/* Spinner for button loading state */
.spinner-border-sm {
  display: inline-block;
  width: 1em;
  height: 1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spin 0.75s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.config-field {
  margin-bottom: 1em !important;
}
.config-block > div {
  margin-bottom: 0.4em !important;
}
/* Modernes Look & Feel für die Konfigurationsseite */
/* Abstand optimiert für Konfigurations-Tab */
/* Abstand optimiert für Konfigurations-Tab */
.config-block {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 4px 12px rgba(60,120,220,0.06), 0 12px 32px rgba(60,120,220,0.06);
  padding: 0.5em 1em 1.2em 1em;
  margin-bottom: 1.2em;
  overflow: hidden;
  transition: box-shadow 0.3s ease;
}
.config-block:hover {
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 6px 16px rgba(60,120,220,0.08), 0 16px 40px rgba(60,120,220,0.08);
}
.config-block:first-child {
  margin-top: 0.2em;
}

label {
  font-size: 1.08em;
  color: #2a3a4d;
  margin-bottom: 0;
  display: block;
}

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="file"],
select {
  border: 1px solid #d0d7e2;
  border-radius: 8px;
  padding: 0.5em 0.8em;
  font-size: 1.08em;
  background: #f7f9fc;
  margin-top: 0.01em;
  margin-bottom: 0.04em;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.25s ease, box-shadow 0.3s ease;
}
input:focus, select:focus {
  border-color: #3a8dde;
  outline: none;
  box-shadow: 0 0 0 3px rgba(58,141,222,0.15), 0 2px 8px rgba(58,141,222,0.1);
}

button, .btn {
  font-family: inherit;
  font-size: 0.95em;
  border-radius: 8px;
  border: none;
  background: #3a8dde;
  color: #fff;
  padding: 0.6em 1.4em;
  box-shadow: 0 1px 2px rgba(0,0,0,0.08), 0 4px 12px rgba(60,120,220,0.12);
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.25s ease, transform 0.2s ease;
  font-weight: 600;
  letter-spacing: 0.2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  line-height: 1.4;
  white-space: nowrap;
}
button:hover, .btn:hover {
  background: #256bb2;
  box-shadow: 0 4px 12px rgba(60,120,220,0.2), 0 8px 24px rgba(60,120,220,0.12);
  transform: translateY(-2px);
}
button:active, .btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 4px rgba(60,120,220,0.15), inset 0 1px 2px rgba(0,0,0,0.06);
}
button:disabled, .btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* === Unified Button Variants === */
.btn-primary {
  background: #3a8dde;
  color: #fff;
  border: none;
}
.btn-primary:hover {
  background: #2c6fb8;
}

.btn-edit {
  background: #f0f0f0;
  color: #3a8dde;
  border: 2px solid #3a8dde;
}
.btn-edit:hover {
  background: #3a8dde;
  color: #fff;
  box-shadow: 0 4px 12px rgba(58,141,222,0.3);
  transform: translateY(-2px);
}

.btn-danger {
  background: #ef4444;
  color: #fff;
  border: none;
}
.btn-danger:hover {
  background: #dc2626;
  box-shadow: 0 4px 12px rgba(239,68,68,0.3);
  transform: translateY(-2px);
}

.btn-warning {
  background: #ff9800;
  color: #fff;
  border: none;
}
.btn-warning:hover {
  background: #e68900;
  box-shadow: 0 4px 12px rgba(255,152,0,0.3);
  transform: translateY(-2px);
}
.btn-warning:disabled {
  background: #ccc;
  color: #888;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
  opacity: 0.7;
}

.btn-success {
  background: #10b981;
  color: #fff;
  border: none;
}
.btn-success:hover {
  background: #059669;
  box-shadow: 0 4px 12px rgba(16,185,129,0.3);
  transform: translateY(-2px);
}

.btn-neutral {
  background: #6c757d;
  color: #fff;
  border: none;
}
.btn-neutral:hover {
  background: #5a6268;
  box-shadow: 0 4px 12px rgba(108,117,125,0.3);
  transform: translateY(-2px);
}

/* Size variants */
.btn-sm {
  font-size: 0.82em;
  padding: 0.35em 0.9em;
  border-radius: 6px;
}

.btn-lg {
  font-size: 1.1em;
  padding: 0.75em 2em;
}

/* Full-width in match cards */
.btn-block {
  width: 100%;
}

/* Close button (modals) */
.btn-close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: none;
  border: none;
  font-size: 1.5em;
  cursor: pointer;
  padding: 0.2em;
  color: #666;
  box-shadow: none;
  line-height: 1;
}
.btn-close:hover {
  color: #333;
  background: none;
  box-shadow: none;
  transform: none;
}

/* Sort buttons (table headers) */
.btn-sort {
  font-size: 0.8em;
  padding: 0.1em 0.3em;
  background: #eee;
  color: #888;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin-left: 0.2em;
  box-shadow: none;
  font-weight: 400;
  letter-spacing: 0;
}
.btn-sort:hover {
  background: #ddd;
  color: #555;
  box-shadow: none;
  transform: none;
}


.tab-nav {
  background: #f7f9fc;
  border-bottom: 1px solid #e0e6f0;
  padding: 0.5em 1em;
  display: flex;
  gap: 0.5em;
  align-items: flex-end;
  position: relative;
}
.tab-nav.settings-active .tab-nav-center {
  display: none;
}
.tab-nav.settings-active .tab[data-tab="general"] {
  visibility: hidden;
  pointer-events: none;
  min-width: 60px;
}
.tab-nav.settings-active {
  justify-content: space-between;
}
.tab-nav-settings-title {
  display: none;
  flex: 1;
  text-align: center;
  font-size: 1.5em;
  font-weight: 700;
  color: #2a3a4d;
  letter-spacing: 0.01em;
  padding-bottom: 0.15em;
  padding-top: 0.3em;
}
.tab-nav.settings-active .tab-nav-settings-title {
  display: block;
}
.tab-nav-center {
  flex: 1;
  display: flex;
  justify-content: center;
  gap: 0.5em;
  align-items: flex-end;
}
.tab-nav .tab {
  font-size: 17px !important;
  color: #3a8dde;
  padding: 0.5em 1em;
  border-radius: 10px 10px 0 0;
  margin-right: 0.2em;
  background: white;
  border: 1px solid #e0e6f0;
  border-bottom: none;
  box-shadow: 0 1px 4px rgba(60,120,220,0.06);
  cursor: pointer;
  transition: background 0.25s, color 0.2s, box-shadow 0.3s ease, transform 0.2s ease;
  position: relative;
  top: 2px;
}
.tab-nav .tab .icon svg {
  width: 26px;
  height: 26px;
}
.tab-nav .tab {
  text-decoration: none;
}
.tab-nav .tab a,
.tab-nav .tab span {
  text-decoration: none;
}
.tab-nav .tab:hover {
  background: linear-gradient(135deg, #e8f4fd 0%, #dbe9fa 100%);
  color: #256bb2;
  box-shadow: 0 2px 8px rgba(58,141,222,0.12);
  transform: translateY(-1px);
}
.tab-nav .tab.active {
  background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%);
  color: #fff;
  border-bottom: 2px solid #fff;
  z-index: 2;
  font-weight: 600;
  box-shadow: 0 4px 16px rgba(58,141,222,0.25), 0 2px 6px rgba(123,47,242,0.15);
  transform: translateY(-2px);
}
.tab-nav .tab.tab-setup-locked {
  opacity: 0.38;
  pointer-events: none;
  cursor: not-allowed;
  filter: grayscale(0.4);
}

body {
  background: #f2f5fa;
  font-family: 'Segoe UI', 'Roboto', Arial, sans-serif;
  color: #2a3a4d;
}
.rank.medal td {
  border: 2px solid #ffd700;
  background: #fffbe6;
}
.rank.medal td:nth-child(1) {
  border-left: 4px solid #ffd700;
}
.court-row {
  display: flex;
  gap: 1em;
  margin-bottom: 1em;
}

/* Runden-Grid: feste Breiten je nach Anzahl Matches */
.round-grid {
  display: grid !important;
  gap: 1.2em;
  padding: 0.7em 1.2em 0.7em 0.5em;
}
.round-grid.cols-1 { grid-template-columns: 320px; }
.round-grid.cols-2 { grid-template-columns: repeat(2, 320px); }
.round-grid.cols-3 { grid-template-columns: repeat(3, 320px); }

.court-card {
  border-radius: 1em;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 4px 12px rgba(60,60,120,0.06), 0 12px 28px rgba(60,60,120,0.06);
  padding: 1em;
  min-width: 180px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.04);
  transition: box-shadow 0.3s ease, transform 0.2s ease;
}
.court-card:hover {
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 6px 16px rgba(60,60,120,0.1), 0 16px 36px rgba(60,60,120,0.08);
  transform: translateY(-1px);
}
.court-card.padel {
  border-color: #3a8dde;
  background: linear-gradient(90deg, #3a8dde 0%, #7ee8fa 100%);
  color: #fff;
}
.court-card.tennis {
  border-color: #ff9800;
  background: linear-gradient(90deg, #ff9800 0%, #ffe0b2 100%);
  color: #222;
}
.court-label {
  font-weight: bold;
  margin-bottom: 0.5em;
}
.round.finished {
  opacity: 0.5;
}
.round.round-started .court-playing {
  animation: courtPulseGreen 2s ease-in-out infinite;
}
@keyframes courtPulseGreen {
  0%, 100% { box-shadow: 0 0 8px rgba(34, 197, 94, 0.3); }
  50% { box-shadow: 0 0 16px rgba(34, 197, 94, 0.6); }
}
.start-round-btn:hover {
  filter: brightness(1.08);
  transform: scale(1.03);
}
.status.orange {
  background: #f59e0b;
  color: #fff;
  padding: 0.2em 0.6em;
  border-radius: 1em;
}
.status.green {
  background: #10b981;
  color: #fff;
  padding: 0.2em 0.6em;
  border-radius: 1em;
}
.status.grey {
  background: #94a3b8;
  color: #fff;
  padding: 0.2em 0.6em;
  border-radius: 1em;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0;
}
th, td {
  border: 1px solid #e8eaed;
  padding: 0.6em 0.8em;
  text-align: left;
}
th {
  background: linear-gradient(90deg, #3a8dde 0%, #5a9de8 100%);
  color: #fff;
  font-weight: 600;
  white-space: nowrap;
}
tbody tr:nth-child(even) {
  background: #f8fafc;
}
tbody tr:nth-child(odd) {
  background: #fff;
}
tbody tr {
  transition: background 0.2s ease, box-shadow 0.25s ease, transform 0.2s ease;
}
tbody tr:hover {
  background: #e7f3ff;
  box-shadow: 0 2px 8px rgba(58,141,222,0.1);
  position: relative;
  z-index: 1;
}

/* Sticky Tabellenkopf für Anmeldungen (ohne Sub-Tabs) */
#players-content th {
  position: sticky;
  top: 0;
  z-index: 99;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
#players-content .players-table-wrap {
  overflow-y: auto;
  min-height: calc(100vh - 220px);
  max-height: calc(100vh - 220px);
  overflow-x: auto;
  width: 100%;
  box-sizing: border-box;
}
#players-content .players-table-wrap .config-block {
  overflow: visible;
  width: 100%;
  box-sizing: border-box;
}
/* Sort buttons in table header */
#players-content .btn-sort {
  background: rgba(255,255,255,0.2);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.3);
}
/* Spaltenbreite per Ziehen (th ist sticky und damit Bezugsrahmen) */
#players-content .col-resizer {
  position: absolute;
  top: 0;
  right: 0;
  width: 6px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
}
#players-content .col-resizer:hover {
  background: rgba(255,255,255,0.45);
}
#players-content .players-table.cols-resized th {
  box-sizing: border-box;
}
#players-content .players-table.cols-resized th[data-col],
#players-content .players-table.cols-resized td {
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Rundmail-Editor */
.rm-editor:empty:before {
  content: attr(data-placeholder);
  color: #9ca3af;
  pointer-events: none;
}
.rm-editor h2 {
  font-size: 1.25em;
  margin: 0.3em 0;
}
.rm-editor p {
  margin: 0;
}
body {
  font-family: 'Segoe UI', Arial, sans-serif;
  margin: 0;
  padding: 0;
  background: #f7f8fa;
  color: #222;
  --header-height: 72px;
  --tab-nav-height: 56px;
  --subtab-height: 44px;
}
/* Veranstaltung (ohne Turnierlogik): Lila → Pink in Kopfleiste und aktivem Reiter */
body.is-event header,
body.is-event .tab-nav .tab.active {
  background: linear-gradient(90deg, #7c3aed 0%, #db2777 100%);
}

header {
  background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%);
  color: #fff;
  padding: 0;
  position: sticky;
  top: 0;
  z-index: 1000;
  height: var(--header-height);
  box-sizing: border-box;
  margin-bottom: 0;
  display: flex;
  align-items: center;
}
.app-header-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  gap: 16px;
}
.app-header-side {
  flex: 0 0 260px;
  min-width: 0;
}
.app-header-side-left {
  display: flex;
  justify-content: flex-start;
}
.app-header-side-stack {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.app-header-logo {
  height: 38px;
  width: auto;
  flex-shrink: 0;
  align-self: center;
  display: block;
  margin-left: 6px;
}
.app-header-logo-top { display: none; }
body:not(.logo-top) .app-header-side { flex-basis: 340px; }
body.logo-top { --header-height: 100px; }
/* Turnier mit Zuschauer-Anmeldung: Platz für den Umschalter unter dem Titel */
body.has-linked { --header-height: 98px; }
body.has-linked.logo-top { --header-height: 124px; }
/* … mit Untertitel noch etwas höher, damit nichts abgeschnitten wird */
body.has-linked:has(header .subtitle:not(:empty)) { --header-height: 120px; }
body.has-linked.logo-top:has(header .subtitle:not(:empty)) { --header-height: 146px; }
.linked-switch { display: inline-flex; margin-top: 5px; border: 1px solid rgba(255,255,255,0.55); border-radius: 999px; overflow: hidden; font-size: 0.8em; line-height: 1; }
.linked-switch .ls-item { padding: 4px 12px; color: #fff; text-decoration: none; white-space: nowrap; }
.linked-switch a.ls-item[href]:hover { background: rgba(255,255,255,0.18); }
.linked-switch .ls-active { background: #fff; color: #5b21b6; font-weight: 700; cursor: default; }
body.is-event .linked-switch .ls-active { color: #be185d; }
body.logo-top .app-header-logo-right { display: none; }
body.logo-top .app-header-logo-top {
  display: block;
  height: 24px;
  width: auto;
  margin: 0 auto 4px;
}
.app-header-side-right {
  justify-content: flex-end;
}
.app-header-title-wrap {
  flex: 1 1 auto;
  min-width: 0;
  text-align: center;
}
.app-header-title-wrap #header-title,
.app-header-title-wrap .subtitle {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 960px) {
  .app-header-side {
    flex-basis: 210px;
  }
}
h1 {
  margin: 0;
  font-size: 2rem;
}
.tab-nav {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  background: #f7f8fa;
  border-bottom: 2px solid #e0e0e0;
  position: sticky;
  top: var(--header-height);
  z-index: 999;
  height: var(--tab-nav-height);
  box-sizing: border-box;
  align-items: center;
  /* Deckende Hintergrundfarbe um Durchscheinen beim Scrollen zu verhindern */
  box-shadow: 0 -20px 0 #f7f8fa;
}
.tab-nav .tab .icon {
  font-size: 1.2em;
}
main {
  padding: 1.5rem 2rem 2rem 2rem;
}

/* Gruppenverwaltung Styles */
#groups-section h2 {
  font-size: 1.5em;
  color: #2a3a4d;
  margin-bottom: 0.5em;
}

#groups-section h3 {
  font-size: 1.2em;
  font-weight: bold;
}

.group-container {
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  padding: 1em;
  min-height: 150px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 4px 12px rgba(60,60,120,0.05);
  transition: box-shadow 0.3s ease;
}

.group-player-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5em;
  margin-bottom: 0.5em;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #ddd;
  transition: box-shadow 0.2s;
}

.group-player-item:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

#teams-result {
  margin-top: 1em;
}

.team-card {
  padding: 1em;
  background: #fff;
  border: 2px solid #ff9800;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(255, 152, 0, 0.1);
  transition: transform 0.2s, box-shadow 0.2s;
}

.team-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(255, 152, 0, 0.2);
}

/* ========================================
   Sub-Tab Navigation (Anmeldungen)
   ======================================== */
.sub-tab-nav {
  display: flex;
  gap: 0;
  margin-bottom: 1.5em;
  border-bottom: 2px solid #e0e0e0;
}

.sub-tab {
  padding: 0.75em 1.5em;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  font-weight: 600;
  color: #666;
  cursor: pointer;
  font-size: 1em;
  margin-bottom: -2px;
  transition: all 0.25s ease;
}

.sub-tab:hover {
  color: #3a8dde;
  background: rgba(58, 141, 222, 0.05);
  box-shadow: 0 -2px 8px rgba(58,141,222,0.08);
}

.sub-tab.active {
  border-bottom-color: #3a8dde;
  color: #3a8dde;
  box-shadow: 0 -2px 8px rgba(58,141,222,0.1);
}

/* Aufstellung Sub-Tabs - einheitlicher Gradient wie im Teilnehmerbereich */
#teams-groups-subtabs,
#matches-subtabs {
  border-bottom: 1px solid #e0e6f0 !important;
}
.aufstellung-tab {
  background: white;
  color: #3a8dde;
  border-color: #d0d7e2;
}
.aufstellung-tab:hover {
  background: linear-gradient(135deg, #e8f4fd 0%, #dbe9fa 100%);
  color: #256bb2;
}

/* Alle Aufstellung-Tabs: gleicher Gradient wenn aktiv */
.aufstellung-tab.active {
  background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%) !important;
  color: white !important;
  border-color: #d0d7e2 !important;
  font-weight: 600;
}

/* Begegnungen Sub-Tabs - gleicher Stil wie Aufstellung/Teilnehmerbereich */
.begegnungen-subtab {
  background: white;
  color: #3a8dde;
  border-color: #d0d7e2;
}
.begegnungen-subtab:hover:not(.active) {
  background: linear-gradient(135deg, #e8f4fd 0%, #dbe9fa 100%) !important;
  color: #256bb2 !important;
}
.begegnungen-subtab.active {
  background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%) !important;
  color: white !important;
  border-color: #d0d7e2 !important;
  font-weight: 600;
}

/* Turnierkonfiguration Sub-Tabs - gleicher Stil */
.config-tab {
  background: white;
  color: #3a8dde;
  border-color: #d0d7e2;
}
.config-tab:hover:not(.active) {
  background: linear-gradient(135deg, #e8f4fd 0%, #dbe9fa 100%) !important;
  color: #256bb2 !important;
}
.config-tab.active {
  background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%) !important;
  color: white !important;
  border-color: #d0d7e2 !important;
  font-weight: 600;
}

/* Sticky Sub-Tabs - alle Sub-Tab Container */
.sub-tab-nav,
.planning-subtab-nav,
#registration-subtabs,
#teams-groups-subtabs,
#config-subtabs,
#matches-subtabs {
  position: sticky;
  /* -2px um direkt unter den Haupt-Tabs zu kleben ohne sichtbare Lücke */
  top: calc(var(--header-height) + var(--tab-nav-height) - 2px);
  z-index: 998;
  background: #f7f8fa;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  padding-left: 0 !important;
  padding-right: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  /* Deckender Hintergrund: verhindert Durchscheinen beim Scrollen */
  box-shadow: 0 -25px 0 #f7f8fa;
}

/* Einheitlicher Abstand für alle Sub-Tab-Container */
#teams-groups-wrapper,
#registration-wrapper,
#matches-container,
#config-wrapper {
  margin-top: 0;
}

/* Sticky Action Bar für Speicherbuttons und Statistiken (unter Sub-Tabs) */
.sticky-action-bar {
  position: sticky;
  top: calc(var(--header-height) + var(--tab-nav-height) + var(--subtab-height) - 8px);
  z-index: 997;
  background: #f7f8fa;
  padding: 0.5rem 0;
  margin-bottom: 0.75rem;
  margin-top: 0;
  /* Schatten nach oben in Tab-Farbe, um Lücke zu schließen */
  box-shadow: 0 -35px 0 #f7f8fa;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  flex-wrap: nowrap;
}

/* Match-Timer */
.match-timer-box {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  padding: 0.6em 1.2em;
  border-radius: 10px;
  min-width: 220px;
  color: #3a8dde;
  box-shadow: 0 2px 8px rgba(58,141,222,0.15);
  background: linear-gradient(135deg, #1d8cf8 0%, #8e2de2 100%);
  border: none;
}
.match-timer-box::before {
  content: '';
  position: absolute;
  inset: 2px;
  background: #fff;
  border-radius: 8px;
  z-index: 0;
}
.match-timer-box > * {
  position: relative;
  z-index: 1;
}
.match-timer-box .timer-icon {
  flex-shrink: 0;
  color: #3a8dde;
}
.match-timer-box .timer-display {
  width: 84px;
  text-align: center;
  border: none;
  border-radius: 6px;
  padding: 4px 6px;
  font-size: 1.6em;
  font-weight: 400;
  background: linear-gradient(135deg, #1d8cf8 0%, #8e2de2 100%);
  color: #fff;
}
.match-timer-box .timer-display:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(99,102,241,0.3);
}
.match-timer-box .timer-btn-play {
  background: #22c55e;
  border: 1.5px solid #1a9e4a;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transition: background 0.15s;
}
.match-timer-box .timer-btn-play:hover { background: #16a34a; }
.match-timer-box .timer-btn-pause {
  background: #ef4444;
  border: 1.5px solid #dc2626;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transition: background 0.15s;
}
.match-timer-box .timer-btn-pause:hover { background: #dc2626; }
.match-timer-box .timer-icon-btn {
  background: none;
  border: 1.5px solid #3a8dde;
  border-radius: 6px;
  cursor: pointer;
  padding: 6px 8px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #3a8dde;
  transition: opacity 0.15s;
}
.match-timer-box .timer-icon-btn:hover { opacity: 0.7 !important; }
.timer-warn {
  outline: 3px solid #ef4444;
  outline-offset: -2px;
}
.timer-expired {
  outline: 3px solid #ef4444;
  outline-offset: -2px;
}
.timer-blink-off {
  outline-color: transparent !important;
}

/* Knopfzeile (Filter, Knöpfe, Aktionen) über dem klebenden Tabellenkopf (th z-index 99) – sonst liegen
   die Infofelder beim Darüberfahren dahinter */
.sticky-stats-bar > div:not(.players-table-wrap) { position: relative; z-index: 120; }

/* Sticky Stats und Buttons ohne Sub-Tabs */
.sticky-stats-bar {
  position: sticky;
  top: calc(var(--header-height) + var(--tab-nav-height));
  z-index: 997;
  background: #f7f8fa;
  padding: 0.5rem 0;
  margin-bottom: 0.75rem;
  box-shadow: 0 -20px 0 #f7f8fa;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  flex-wrap: wrap;
}

/* Statistik-Anzeige in der Action Bar */
.action-bar-stats {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-right: auto;
  font-size: 0.95em;
  color: #555;
  max-width: 1500px;
  flex: 1 1 auto;
}

/* Leere Stats verstecken */
.action-bar-stats:empty {
  display: none;
}

.action-bar-stats .stat-highlight {
  font-weight: 600;
  color: #3a8dde;
}

/* Buttons in der Action Bar */
.action-bar-buttons {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ========================================
   Gruppen & Teams - Drag & Drop
   ======================================== */ */
.draggable {
  cursor: grab;
  user-select: none;
  transition: all 0.2s ease;
}

.draggable:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.draggable.dragging {
  opacity: 0.5;
  cursor: grabbing;
}

.drop-zone {
  transition: all 0.2s ease;
}

.drop-zone.drag-over {
  background: #ecfdf5 !important;
  border-color: #059669 !important;
  box-shadow: inset 0 0 10px rgba(5, 150, 105, 0.2);
}

.player-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.4em 0.8em;
  margin: 0.25em;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 20px;
  font-size: 0.9em;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.player-chip:hover {
  border-color: #3a8dde;
  box-shadow: 0 2px 8px rgba(58, 141, 222, 0.2);
}

.team-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.5em 1em;
  margin: 0.25em;
  background: #e3f2fd;
  border: 2px solid #17a2b8;
  border-radius: 8px;
  font-size: 0.9em;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.team-chip:hover {
  background: #bbdefb;
  box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);
}

.section-box {
  border-radius: 12px;
  padding: 1.5em;
  margin-bottom: 2em;
  background: #f8f9fa;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03), 0 4px 12px rgba(60,60,120,0.05);
  transition: box-shadow 0.3s ease;
}
.section-box:hover {
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), 0 6px 16px rgba(60,60,120,0.07), 0 12px 28px rgba(60,60,120,0.05);
}

.team-container,
.group-container {
  min-height: 120px;
  transition: all 0.2s;
}

.unassigned-container {
  border-style: dashed !important;
  background: #fafafa;
}

/* Info-Box für Hinweis */
.info-box {
  padding: 0.75em;
  background: #e7f3ff;
  border-radius: 6px;
  font-size: 0.9em;
  color: #0066cc;
  margin: 0.5em 0;
}

/* Radio/Checkbox Gruppen für Regeln */
.rules-category {
  border: 1px solid #eee;
  padding: 0.75em;
  border-radius: 6px;
  background: #fafafa;
}

.rules-category-title {
  font-weight: 600;
  font-size: 0.9em;
  margin-bottom: 0.5em;
  color: #555;
}

/* ========================================
   Turnierbaum-Konfiguration
   ======================================== */

.bracket-match-pair {
  transition: box-shadow 0.2s ease;
}

.bracket-match-pair:hover {
  box-shadow: 0 2px 12px rgba(102, 126, 234, 0.2);
}

.bracket-slot {
  transition: all 0.15s ease;
  min-height: 38px;
}

.bracket-slot.drag-over {
  background: #e8f5e9 !important;
  border-color: #4caf50 !important;
}

.bracket-chip {
  max-width: 100%;
}

.bracket-chip:hover {
  transform: translateY(-1px);
}

.bracket-unassigned {
  transition: all 0.2s ease;
}

.bracket-unassigned.drag-over {
  background: #e8f5e9 !important;
  border-color: #4caf50 !important;
}

/* Bracket Quarter Sections */
.bracket-quarter {
  transition: box-shadow 0.2s ease;
}

.bracket-quarter:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* Bracket Seed Toggle */
.bracket-seed-toggle {
  transition: all 0.15s ease !important;
}

.bracket-seed-toggle:hover {
  border-color: #3a8dde !important;
  color: #3a8dde !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Info-Icon Tooltip */
.bracket-info-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.bracket-info-icon .bracket-tooltip {
  display: none;
  position: absolute;
  top: 130%;
  left: 50%;
  transform: translateX(-50%);
  background: #333;
  color: #fff;
  padding: 0.6em 0.8em;
  border-radius: 6px;
  font-size: 0.78em;
  font-weight: 400;
  line-height: 1.4;
  white-space: normal;
  width: 280px;
  text-align: left;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  pointer-events: none;
}

.bracket-info-icon .bracket-tooltip::after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-bottom-color: #333;
}

.bracket-info-icon:hover .bracket-tooltip {
  display: block;
}

/* ========================================
   JOKER / FREILOS STYLING
   ======================================== */

/* Joker-Button (lila wie Header) */
.btn-joker {
  background: #7b2ff2 !important;
  color: #fff !important;
  border: none;
}
.btn-joker:hover {
  background: #6a28d6 !important;
  box-shadow: 0 4px 12px rgba(123, 47, 242, 0.4);
  transform: translateY(-2px);
}

/* Joker-Badge (Icon hinter Name in Tabelle) */
.joker-badge-inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #7b2ff2;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  margin-left: 6px;
  vertical-align: middle;
}

/* Joker-Hinweis (aufklappbar, blau wie info-box) */
/* Joker-Button Hover-Tooltip */
.joker-tooltip-wrap {
  position: relative;
}
.joker-tooltip-box {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 420px;
  background: #1e3a5f;
  color: #e8f0fa;
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 0.84em;
  line-height: 1.5;
  text-align: left;
  box-shadow: 0 4px 16px rgba(0,0,0,0.22);
  z-index: 100;
  pointer-events: none;
  font-weight: normal;
  white-space: normal;
  word-wrap: break-word;
}
.joker-tooltip-box::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 18px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #1e3a5f;
}
.joker-tooltip-box strong {
  display: block;
  margin-bottom: 6px;
  color: #fff;
  font-size: 1.05em;
}
.joker-tooltip-box p {
  margin: 0 0 8px 0;
}
.joker-tooltip-box ul {
  margin: 0;
  padding-left: 16px;
}
.joker-tooltip-box li {
  margin: 4px 0;
}
.joker-tooltip-wrap:hover .joker-tooltip-box,
.joker-tooltip-wrap:focus-within .joker-tooltip-box {
  display: block;
}

/* Spieler-Tabelle: Zeile hover */
.player-row:hover { background: #f0f7ff; }

/* Joker im Turnierbaum / Bracket */
.team-name.is-joker {
  color: #b45309 !important;
  font-style: italic;
}

/* Kompaktes Joker-Badge für kleine Cards (Turnierbaum Übersicht) */
.joker-badge-compact {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px;
  border-radius: 3px !important;
  margin-left: 2px !important;
  flex-shrink: 0;
}
.joker-badge-compact svg {
  width: 10px !important;
  height: 10px !important;
}

/* ========================================
   RESPONSIVE: Aufstellung (Teams / Gruppen)
   ======================================== */

/* Mittlere Bildschirme: Teams auf 2 Spalten, "Ohne Team" darunter */
@media (max-width: 1100px) {
  .teams-grid {
    flex-wrap: wrap !important;
  }
  .teams-columns {
    flex-basis: 100% !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .teams-grid > .unassigned-container {
    flex-basis: 100% !important;
  }
}

/* Kleine Bildschirme: alles untereinander */
@media (max-width: 700px) {
  .teams-columns {
    grid-template-columns: 1fr !important;
  }
  .groups-grid {
    flex-direction: column !important;
  }
}

/* Player-Chips und Team-Chips dürfen nicht über Container-Rand hinausragen */
.player-chip,
.team-chip {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ========================================
   HANDY-ANSICHT (≤ 768 px): Kopf kompakt, Reiter als Leiste unten,
   Fenster als Blatt von unten, Infos per Antippen (siehe mobileUi.js).
   Am Computer bleibt alles wie oben.
   ======================================== */
.tab-more,
.header-help-mobile-info,
#tab-more-sheet,
#m-info-sheet { display: none; }

@media (max-width: 768px) {
  body { --header-height: 56px; --tab-nav-height: 0px; --bottom-bar-height: 62px; }
  body.logo-top { --header-height: 56px; }
  body.has-linked,
  body.has-linked.logo-top,
  body.has-linked:has(header .subtitle:not(:empty)),
  body.has-linked.logo-top:has(header .subtitle:not(:empty)) { --header-height: 80px; }

  /* Kopf: nur Titel (+ Umschalter), rechts „?“ */
  .app-header-bar { padding: 0 10px; gap: 8px; }
  .app-header-side,
  body:not(.logo-top) .app-header-side { flex: 0 0 38px; }
  .app-header-side-right > :not(#header-help-btn) { display: none !important; }
  #header-back-to-turnier { display: none !important; }
  /* Adminbereich bzw. Abmelden stehen auf dem Handy im „Mehr“-Blatt */
  #header-zum-admin { display: none !important; }
  #header-help-btn {
    align-self: center;
    width: 36px; height: 36px;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 0 !important;
  }
  #header-help-btn > span { display: none; }
  #header-help-btn::before { content: '?'; font-size: 1.15rem; font-weight: 700; }
  .app-header-title-wrap #header-title { font-size: 1.2rem; line-height: 1.25; }
  .app-header-title-wrap .subtitle,
  body.logo-top .app-header-logo-top { display: none !important; }
  .linked-switch { margin-top: 4px; font-size: 0.75em; }
  .linked-switch .ls-item { padding: 5px 14px; }

  /* Hilfe-Menü: Turnier-ID, Version und Konto */
  .header-help-mobile-info {
    display: flex; flex-direction: column; gap: 4px;
    padding: 2px 4px 6px; font-size: 0.88em; color: #51637a;
  }
  .header-help-mobile-info a { color: #2563eb; }
  .hhm-meta { font-family: monospace; font-size: 0.95em; }

  /* Reiterleiste unten */
  .tab-nav,
  .tab-nav.settings-active {
    position: fixed; top: auto; bottom: 0; left: 0; right: 0;
    height: calc(var(--bottom-bar-height) + env(safe-area-inset-bottom));
    padding: 0 0 env(safe-area-inset-bottom);
    gap: 0;
    background: #fff;
    border-top: 1px solid #e0e6f0; border-bottom: none;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.08);
    z-index: 1001;
    justify-content: stretch; align-items: stretch;
  }
  .tab-nav-settings-title,
  .tab-nav.settings-active .tab-nav-settings-title { display: none; }
  .tab-nav-center,
  .tab-nav.settings-active .tab-nav-center { display: contents; }
  .tab-nav .tab,
  .tab-nav .tab-more {
    flex: 1 1 0; min-width: 0;
    margin: 0; top: 0;
    padding: 7px 2px 5px !important;
    border: none; border-radius: 0; box-shadow: none; background: transparent;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    font-family: inherit; font-size: 11px !important; line-height: 1.1;
    color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    transform: none; cursor: pointer;
  }
  .tab-nav .tab:hover { background: transparent; box-shadow: none; transform: none; color: #64748b; }
  .tab-nav .tab .icon,
  .tab-nav .tab-more .icon { display: inline-flex; padding: 3px 16px; border-radius: 999px; font-size: 1em; }
  .tab-nav .tab .icon svg,
  .tab-nav .tab-more .icon svg { width: 22px; height: 22px; }
  .tab-nav .tab[data-tab="general"]::after { content: 'Einstellungen'; }
  .tab-nav.settings-active .tab[data-tab="general"] { visibility: visible; pointer-events: auto; min-width: 0; }
  .tab-nav .tab.tab-in-more { display: none !important; }

  /* Aktiver Reiter: Symbol in Turnier- bzw. Veranstaltungsfarbe */
  .tab-nav .tab.active,
  body.is-event .tab-nav .tab.active,
  .tab-nav:has(.tab-in-more.active) .tab-more {
    background: transparent; border: none; box-shadow: none; transform: none;
    color: #6d28d9; font-weight: 700;
  }
  .tab-nav .tab.active .icon,
  .tab-nav:has(.tab-in-more.active) .tab-more .icon {
    background: linear-gradient(90deg, #1d8cf8 0%, #8e2de2 100%); color: #fff;
  }
  body.is-event .tab-nav .tab.active { color: #be185d; }
  body.is-event .tab-nav .tab.active .icon { background: linear-gradient(90deg, #7c3aed 0%, #db2777 100%); }

  /* Reihenfolge wie am Computer (Teilen zuerst), „Mehr“ ganz rechts */
  .tab-nav .tab-more { display: flex; order: 9; }

  main { padding: 1rem 0.75rem calc(var(--bottom-bar-height) + 24px + env(safe-area-inset-bottom)); }
  /* Knopfreihen über Listen umbrechen statt die Seite zu verbreitern */
  .sticky-stats-bar > div { flex-wrap: wrap; }
  .closed-banner { bottom: calc(var(--bottom-bar-height) + 10px + env(safe-area-inset-bottom)) !important; }

  /* „Mehr“-Blatt über der Leiste */
  #tab-more-sheet.open {
    display: flex; align-items: flex-end;
    position: fixed; top: 0; left: 0; right: 0;
    bottom: calc(var(--bottom-bar-height) + env(safe-area-inset-bottom));
    background: rgba(0,0,0,0.35); z-index: 1002;
  }
  .tab-more-panel {
    width: 100%; background: #fff;
    border-radius: 16px 16px 0 0; padding: 8px 0;
    box-shadow: 0 -6px 24px rgba(0,0,0,0.15);
  }
  .tab-more-item {
    display: flex; align-items: center; justify-content: flex-start; gap: 14px;
    width: 100%; min-height: 52px; padding: 10px 22px;
    border: none; background: none; text-align: left;
    font-family: inherit; font-size: 1rem; color: #2a3a4d; cursor: pointer;
  }
  .tab-more-item .icon { display: inline-flex; color: #3a8dde; }
  .tab-more-item .icon svg { width: 22px; height: 22px; }
  .tab-more-item.active { color: #6d28d9; font-weight: 700; background: #f5f3ff; }
  .tab-more-item:disabled { opacity: 0.4; }
  .tab-more-exit { border-top: 1px solid #e5e7eb; margin-top: 4px; color: #51637a; }
  .tab-more-exit .icon { color: #64748b; }

  /* Fenster als Blatt von unten (modal.js, Spieler-Fenster usw. – Klasse „m-sheet“ setzt mobileUi.js) */
  .m-sheet,
  .header-help-overlay { align-items: flex-end !important; justify-content: stretch !important; padding: 0 !important; }
  .m-sheet > div:first-child,
  .header-help-modal {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    max-height: 90vh !important; overflow-y: auto !important;
    border-radius: 16px 16px 0 0 !important; box-sizing: border-box !important; margin: 0 !important;
  }
  .m-sheet > div:first-child { padding: 1.25em 1em calc(1em + env(safe-area-inset-bottom)) !important; }
  /* iPhone: 100vh zählt die Browserleiste mit → Blatt unten abgeschnitten. Overlay an den sichtbaren Bereich
     koppeln (oben/unten 0 statt Höhe 100vh) und Höhe in dvh begrenzen */
  .m-sheet,
  .header-help-overlay { top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: auto !important; height: auto !important; }
  .m-sheet > div:first-child,
  .header-help-modal { max-height: 90dvh !important; }

  /* Infos per Antippen: Text erscheint unten (mobileUi.js); Hover-Tooltips aus */
  .joker-tooltip-box,
  .wiz-info-icon .wiz-tooltip,
  .bracket-info-icon .bracket-tooltip { display: none !important; }
  .match-info-icon::after { display: none !important; }
  .wiz-info-icon { width: 22px !important; height: 22px !important; }
  #m-info-sheet.open {
    display: block;
    position: fixed; left: 10px; right: 10px;
    bottom: calc(var(--bottom-bar-height) + 10px + env(safe-area-inset-bottom));
    z-index: 10004;
    background: #1e293b; color: #f1f5f9;
    border-radius: 12px; padding: 14px 44px 14px 16px;
    font-size: 0.92rem; line-height: 1.5;
    box-shadow: 0 8px 28px rgba(0,0,0,0.3);
  }
  #m-info-sheet .m-info-text { white-space: pre-line; }
  #m-info-sheet .m-info-close {
    position: absolute; top: 6px; right: 6px; width: 36px; height: 36px;
    border: none; background: none; color: #f1f5f9; font-size: 1.5rem; line-height: 1; cursor: pointer;
  }

  /* „Schon gewusst?“ volle Breite unten über der Leiste */
  .gt-popup {
    top: auto !important; left: 10px !important; right: 10px !important;
    bottom: calc(var(--bottom-bar-height) + 10px + env(safe-area-inset-bottom)) !important;
    width: auto !important; max-width: none !important;
    /* höchstens bis unter den Kopf, längere Texte scrollen im Fenster */
    max-height: calc(100vh - var(--header-height) - var(--bottom-bar-height) - 30px - env(safe-area-inset-bottom)) !important;
    max-height: calc(100dvh - var(--header-height) - var(--bottom-bar-height) - 30px - env(safe-area-inset-bottom)) !important;
  }
}

/* ========================================
   HANDY: Teilnehmer als Karten (playerCards.js, nur ≤ 768 px gerendert)
   ======================================== */
.pc-lock { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; margin-bottom: 4px; background: #fef3c7; border: 1px solid #fbbf24; border-radius: 8px; font-size: 0.82em; color: #92400e; }
.pc-lock button { margin-left: auto; padding: 6px 12px; background: #ef4444; color: #fff; border: none; border-radius: 6px; font-size: 0.95em; }
.pc-toolbar { display: block !important; padding: 8px 0 6px !important; margin-bottom: 8px !important; box-shadow: none !important; }
.pc-search-row { display: flex; gap: 8px; }
.pc-search-row input { flex: 1; min-width: 0; height: 44px; padding: 0 14px; font-size: 16px; border: 1px solid #cbd5e1; border-radius: 10px; box-sizing: border-box; background: #fff; }
.pc-menu-btn { width: 48px; height: 44px; flex-shrink: 0; border: 1px solid #cbd5e1; border-radius: 10px; background: #fff; font-size: 1.4rem; line-height: 1; color: #334155; cursor: pointer; }
.pc-menu-btn.open { background: #ede9fe; border-color: #a78bfa; color: #5b21b6; }
.pc-counts { display: flex; gap: 14px; flex-wrap: wrap; margin: 8px 2px 6px; font-size: 0.86em; color: #51637a; }
.pc-counts b { color: #1e293b; }
.pc-chips { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; }
.pc-chip { flex-shrink: 0; padding: 7px 14px; border: 1px solid #cbd5e1; border-radius: 999px; background: #fff; color: #334155; font-size: 0.86em; font-family: inherit; cursor: pointer; white-space: nowrap; }
.pc-chip.active { background: #3a8dde; border-color: #3a8dde; color: #fff; font-weight: 600; }
body.is-event .pc-chip.active { background: #7c3aed; border-color: #7c3aed; }
.pc-menu { margin-top: 10px; padding: 10px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.pc-menu[hidden] { display: none; }
.pc-menu > span { margin-bottom: 8px; }
.pc-menu-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-menu-buttons .btn { min-height: 42px; }
.pc-list { display: flex; flex-direction: column; gap: 8px; }
.pc-empty { padding: 24px 12px; text-align: center; color: #94a3b8; }
.pc-card { background: #fff; border: 1px solid #e2e8f0; border-left: 5px solid #cbd5e1; border-radius: 10px; padding: 10px 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); cursor: pointer; }
.pc-card.s-green { border-left-color: #10b981; }
.pc-card.s-orange { border-left-color: #f59e0b; }
.pc-card.s-grey { border-left-color: #94a3b8; }
.pc-card.s-red { border-left-color: #2a2a2a; opacity: 0.75; }
.pc-card.is-absent .pc-name { color: #94a3b8; text-decoration: line-through; }
.pc-head { display: flex; align-items: flex-start; gap: 10px; }
.pc-head .player-select, .pc-joker .player-select { width: 22px; height: 22px; margin-top: 2px; flex-shrink: 0; }
.pc-main { flex: 1; min-width: 0; }
.pc-name { font-weight: 600; font-size: 1.02em; color: #1e293b; word-break: break-word; }
.pc-plus { display: inline-block; padding: 0 6px; margin-left: 4px; border-radius: 999px; background: #f3e8ff; color: #6b21a8; font-size: 0.8em; font-weight: 700; }
.pc-sub { margin-top: 2px; font-size: 0.82em; color: #64748b; word-break: break-word; }
.pc-status { flex-shrink: 0; min-height: 34px; padding: 4px 10px; border: none; border-radius: 8px; color: #fff; font-size: 0.82em; font-weight: 600; font-family: inherit; cursor: pointer; background: #94a3b8; }
.pc-status.s-green { background: #10b981; }
.pc-status.s-orange { background: #f59e0b; }
.pc-status.s-grey { background: #94a3b8; }
.pc-status.s-red { background: #2a2a2a; }
.pc-toggles { display: flex; gap: 6px; margin-top: 10px; }
.pc-tg { flex: 1 1 0; min-width: 0; min-height: 42px; padding: 6px 4px; border: 1.5px solid #cbd5e1; border-radius: 9px; background: #f8fafc; color: #475569; font-size: 0.85em; font-weight: 600; font-family: inherit; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; justify-content: center; }
.pc-tg.pc-checkin.on { background: #d1fae5; border-color: #10b981; color: #065f46; }
.pc-tg.pc-absent.on { background: #fee2e2; border-color: #dc2626; color: #991b1b; }
.pc-tg.pc-fee.on { background: #dbeafe; border-color: #3a8dde; color: #1e40af; }
.pc-tg.pc-fee-exempt { border-style: dashed; color: #10b981; cursor: default; }
.pc-tg:disabled { opacity: 0.5; }
.pc-joker { cursor: default; border-left-color: #7b2ff2; display: flex; gap: 10px; align-items: center; }
.pc-joker-badge { display: inline-block; padding: 1px 8px; border-radius: 999px; background: #7b2ff2; color: #fff; font-size: 0.75em; font-weight: 700; }
.pc-select-bar { position: fixed; left: 0; right: 0; bottom: calc(var(--bottom-bar-height, 62px) + env(safe-area-inset-bottom)); z-index: 1000; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; background: #1e293b; color: #fff; }
.pc-select-bar label { display: flex; align-items: center; gap: 8px; font-weight: 600; color: #fff; margin: 0; }
.pc-select-done { padding: 8px 14px; border: 1px solid rgba(255,255,255,0.4); border-radius: 8px; background: transparent; color: #fff; font-family: inherit; font-weight: 600; }
body:has(.pc-select-bar) main { padding-bottom: calc(var(--bottom-bar-height, 62px) + 90px + env(safe-area-inset-bottom)); }
.pc-select-bar input { width: 22px; height: 22px; }
.pc-select-bar #actions-dropdown-menu { top: auto !important; bottom: 2.8em; }
/* Blatt zur Status-Auswahl */
.pc-sheet-panel { width: 100%; max-height: 90vh; max-height: 90dvh; overflow-y: auto; box-sizing: border-box; background: #fff; border-radius: 16px 16px 0 0; padding: 14px 0 calc(10px + env(safe-area-inset-bottom)); box-shadow: 0 -6px 24px rgba(0,0,0,0.15); }
.pc-sheet-title { padding: 0 20px 8px; font-weight: 700; color: #1e293b; }
.pc-sheet-note { margin: 0 20px 8px; font-size: 0.85em; color: #92400e; }
.pc-sheet-item, .pc-sheet-cancel { display: flex; align-items: center; justify-content: flex-start; gap: 12px; width: 100%; min-height: 50px; padding: 0 22px; border: none; background: none; font-family: inherit; font-size: 1rem; color: #1e293b; text-align: left; cursor: pointer; }
.pc-sheet-item:disabled { opacity: 0.4; cursor: default; }
.pc-sheet-item.current { font-weight: 700; opacity: 1; }
.pc-sheet-cancel { justify-content: center; color: #64748b; border-top: 1px solid #e5e7eb; margin-top: 6px; }
.pc-dot { width: 14px; height: 14px; border-radius: 50%; background: #94a3b8; flex-shrink: 0; }
.pc-sheet-item.s-green .pc-dot { background: #10b981; }
.pc-sheet-item.s-orange .pc-dot { background: #f59e0b; }
.pc-sheet-item.s-red .pc-dot { background: #2a2a2a; }

@media (max-width: 768px) {
  /* Zuschauer-Bereich unter der Liste: Zeilen als kleine Karten */
  .spectators-panel table, .spectators-panel tbody, .spectators-panel tr { display: block; width: 100%; }
  .spectators-panel thead { display: none; }
  .spectators-panel tr { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0; border-bottom: 1px solid #fbcfe8; }
  .spectators-panel td { display: inline; }
  .spectators-panel td:first-child { flex-basis: 100%; font-weight: 600; }
  .spectators-panel td:nth-child(2)::before { content: 'Personen: '; color: #9d174d; }
  .spectators-panel td:nth-child(4):not(:empty)::before { content: 'Check-in '; color: #9d174d; }
}

/* ========================================
   HANDY: Begegnungen wie auf der Teilnehmerseite (eine Runde, Plätze untereinander)
   ======================================== */
.m-round-nav { display: none; }
.gp-nav { display: none; }

@media (max-width: 768px) {
  #backup-dropdown-wrapper { margin-right: 0 !important; }
  #matches-subtabs .sub-tab { padding: 0.5em 0.65em !important; }
  /* kleine Handys (360 px): „Runden | Rangliste | Backup“ passt sonst nicht in eine Zeile */
  #backup-dropdown-wrapper > .btn { padding-left: 0.6em !important; padding-right: 0.6em !important; }
  /* Gruppenphase (Organisator): Unterreiter ohne Symbole, Backup nur als Symbol */
  #matches-subtabs .sub-tab svg { display: none; }
  #backup-dropdown-wrapper .backup-label { display: none; }
  /* Gruppen untereinander, Spiele einspaltig, Tabelle kompakt */
  .gp-groups { grid-template-columns: 1fr !important; gap: 1em !important; margin-bottom: 1.5em !important; }
  /* Mehrere Gruppen: eine zur Zeit, Pfeile in .gp-nav */
  .gp-nav { display: flex; align-items: center; justify-content: space-between; gap: 0.5em; margin: 0 0 0.8em; padding: 0.4em; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; }
  .gp-nav-label { font-weight: 700; color: #3a8dde; text-align: center; flex: 1; }
  .gp-nav-label small { font-weight: 400; color: #64748b; }
  .gp-nav-btn { width: 44px; height: 44px; border: 1px solid #d0d7e2; border-radius: 8px; background: #f8fafc; color: #334155; font-size: 1.1em; cursor: pointer; }
  .gp-nav-btn:disabled { opacity: 0.35; cursor: default; }
  .gp-paged .gp-group:not(.gp-active) { display: none !important; }
  .gp-match-grid { grid-template-columns: 1fr !important; gap: 0.9em !important; }
  .gp-standings { padding: 0.6em !important; margin-bottom: 1em !important; }
  .gp-group { padding: 0.8em 0.6em !important; }
  .gp-group > h3 { margin: 0.2em 0 0.6em !important; }
  .gp-standings th, .gp-standings td { padding: 0.5em 0.35em !important; font-size: 0.85em !important; }
  #sub-tab-content .sticky-action-bar { position: static; flex-wrap: wrap; gap: 0.5em; }
  /* Statistik kompakt nebeneinander statt großer Kästen untereinander */
  #sub-tab-content .action-bar-stats { flex-wrap: nowrap !important; gap: 0.5em !important; width: 100%; }
  #sub-tab-content .action-bar-stats > div { flex: 1 1 0; min-width: 0; padding: 0.4em 0.6em !important; gap: 0.4em !important; }
  #sub-tab-content .action-bar-stats svg { width: 18px; height: 18px; flex-shrink: 0; }
  #sub-tab-content .action-bar-buttons:empty { display: none !important; }
  /* Turnierbaum (Gruppenphase + K.O.): eine Kartenliste in Spielreihenfolge (Nummer 1, 2, 3 …), Haupt- und
     Nebenrunde gemischt und an den Farben erkennbar; ohne Verbindungslinien, Leerfelder und Bereichsüberschriften */
  .horizontal-bracket-wrapper { padding: 0 !important; overflow: visible !important; }
  .horizontal-bracket-wrapper > .bracket-lines { display: none !important; }
  .horizontal-bracket-wrapper > div { display: flex !important; flex-direction: column; gap: 0.8em; }
  .horizontal-bracket-wrapper .bracket-row, .horizontal-bracket-wrapper .bracket-row-header { display: contents !important; }
  .horizontal-bracket-wrapper .bracket-row > div:not([data-ko-sec]), .horizontal-bracket-wrapper .bracket-row-header > div:not([data-ko-sec]) { display: none !important; }
  [data-ko-sec] { justify-self: auto !important; width: 100%; margin: 0 !important; }
  [data-ko-sec="main"], [data-ko-sec="cons"], [data-ko-sec="reentry"] { order: var(--ko-order, 99); }
  [data-ko-sec$="-head"] { display: none !important; }
  [data-ko-sec] .match-card { margin-top: 10px; }
  [data-ko-sec] .match-container { width: 100% !important; height: auto !important; }
  [data-ko-sec] .match-card { width: 100% !important; box-sizing: border-box; }
  [data-ko-sec] .team-name { min-width: 0 !important; }
  [data-ko-sec] { transform: none !important; width: 100% !important; }
  .horizontal-bracket-wrapper { padding-left: 0 !important; }
  #ko-phase-header { font-size: 1.3em !important; margin-top: 0.4em !important; }
  /* Kopfbereich nicht klebend und kompakt – oben klebt die Runden-Navigation */
  #matches-content-area .sticky-action-bar { position: static; gap: 0.5em; }
  #matches-content-area .sticky-action-bar > div:not(:last-child) { padding: 0.35em 0.7em !important; }
  #matches-content-area .sticky-action-bar .td-legend { width: 100%; box-sizing: border-box; }
  #matches-content-area .sticky-action-bar > div:last-child { margin-left: 0 !important; width: 100%; justify-content: space-between !important; }

  .m-round-nav {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    /* klebt unter Kopf und Unterreitern (Runden | Rangliste | Backup), die selbst kleben */
    position: sticky; top: calc(var(--header-height) + 48px); z-index: 997;
    margin: 0 0 10px; padding: 8px 0; background: #f7f8fa;
  }
  .m-round-nav span { font-weight: 700; font-size: 1.05em; color: #2a3a4d; }
  .m-round-nav button {
    width: 52px; height: 42px; border: 1px solid #cbd5e1; border-radius: 10px;
    background: #fff; color: #3a8dde; font-size: 1.1em; cursor: pointer;
  }
  .m-round-nav button:disabled { opacity: 0.35; cursor: default; }

  #rounds.m-paged > .round:not(.m-current) { display: none !important; }
  /* Runde ohne grauen Rahmen und ohne eigenen Kopf – Nummer und „Starten“ stehen in der Runden-Leiste */
  #rounds > .round {
    display: block !important; width: 100% !important; box-sizing: border-box; opacity: 1 !important;
    padding: 0 !important; margin-bottom: 1em !important;
    background: transparent !important; border: none !important; box-shadow: none !important;
  }
  #rounds > .round .round-head { display: none !important; }
  #rounds .round-grid { display: flex !important; flex-direction: column; gap: 10px; width: 100%; max-width: 100%; margin: 0 !important; padding: 0 !important; box-sizing: border-box; }
  #rounds .court-card { width: 100% !important; max-width: none !important; box-sizing: border-box; padding: 0 !important; border: 1px solid #dfe5ee !important; box-shadow: 0 1px 4px rgba(0,0,0,0.05) !important; }
  #rounds .court-card.court-playing { border: 2px solid #22c55e !important; box-shadow: 0 0 10px rgba(34,197,94,0.3) !important; }
  /* Farbstreifen links aus – die Platzart zeigt das Platz-Kästchen */
  #rounds .court-card > div:first-child:not(.mc-body) { display: none !important; }

  /* Platz-Karte wie auf der Teilnehmerseite: Platz-Kästchen oben rechts, Teams untereinander, Ergebnis rechts */
  .court-card .mc-body {
    display: grid !important; grid-template-columns: 1fr auto; column-gap: 12px; row-gap: 6px;
    align-items: center; text-align: left !important; padding: 0.7em 0.9em !important;
  }
  .court-card .mc-body > * { grid-column: 1 / -1; }
  .court-card .mc-teams,
  .court-card .mc-scores { display: contents !important; }
  .court-card .mc-body .court-label {
    grid-column: 2; grid-row: 1; justify-self: end; width: auto !important;
    margin: 0 !important; padding: 2px 9px; border-radius: 6px;
    font-size: 0.8em !important; font-weight: 700; background: #f1f5f9; color: #475569;
  }
  .court-card.ct-tennis .court-label { background: #ffedd5; color: #c2410c; }
  .court-card.ct-padel .court-label { background: #dbeafe; color: #1d4ed8; }
  .court-card .mc-body .round-court-dropdown { margin: 0 !important; min-height: 40px; font-size: 0.95em !important; text-align: left !important; }
  .court-card.ct-tennis .round-court-dropdown { border-color: #fdba74 !important; color: #c2410c; }
  .court-card.ct-padel .round-court-dropdown { border-color: #93c5fd !important; color: #1d4ed8; }
  .court-card .mc-team { grid-column: 1; text-align: left !important; font-size: 1.02em !important; color: #475569 !important; }
  .court-card .mc-team.mc-win { font-weight: 700; color: #1e293b !important; }
  .court-card .mc-team br { display: none; }
  .court-card .mc-team-a { grid-row: 2; }
  .court-card .mc-team-b { grid-row: 3; }
  .court-card .mc-vs,
  .court-card .mc-colon { display: none !important; }
  .court-card .score-left,
  .court-card .score-right {
    grid-column: 2; width: 3.4em !important; height: 44px; font-size: 1.2em !important; box-sizing: border-box;
  }
  .court-card .score-left { grid-row: 2; }
  .court-card .score-right { grid-row: 3; }
  /* Gespeichertes Ergebnis als farbiges Kästchen (Eingabe erst nach „Bearbeiten“) */
  .court-card .score-input[data-has-result][disabled] {
    width: 2.4em !important; height: 32px; padding: 0 !important; border: none !important; border-radius: 7px !important;
    font-size: 1.05em !important; opacity: 1; -webkit-text-fill-color: #fff;
  }
  .court-card .mc-actions { grid-row: 4; margin-top: 0.2em !important; }
  .court-card .mc-actions .btn { width: 100%; min-height: 44px; font-size: 1em; }
  /* Gespeichert: „Bearbeiten“ klein oben links neben dem Platz-Kästchen – keine eigene Zeile */
  .court-card .mc-actions:has(.edit-result) { grid-row: 1; grid-column: 1; justify-content: flex-start !important; margin-top: 0 !important; width: auto !important; }
  .court-card .mc-actions .edit-result { width: auto; min-height: 32px; padding: 4px 12px; font-size: 0.85em; }

  /* „Runde starten/pausieren“ in der Runden-Leiste */
  .m-round-nav .m-round-start {
    width: auto; padding: 0 12px; font-size: 0.9em; font-weight: 600;
    background: #22c55e; border-color: #16a34a; color: #fff;
  }
  .m-round-nav .m-round-start.is-playing { background: #fff; color: #16a34a; border-color: #22c55e; }
  .m-round-nav span { flex: 1; text-align: center; }
}

/* HANDY: Extras – Handicaps und Straf-Shots zum Ausklappen (mobileUi.js) */
@media (max-width: 768px) {
  .m-collapsible > div > :first-child { cursor: pointer; position: relative; padding-right: 30px; }
  .m-collapsible > div > :first-child::after {
    content: '\25BE'; position: absolute; right: 2px; top: 0; font-size: 1.3em; line-height: 1; color: #64748b;
  }
  .m-collapsible.m-collapsed > div > :first-child::after { content: '\25B8'; }
  .m-collapsible.m-collapsed > div > :not(:first-child) { display: none !important; }
  .m-collapsible.m-collapsed > div > :first-child { margin-bottom: 0 !important; }
  #extrasHandicaps, #extrasShotList { min-width: 0 !important; max-width: 100%; flex: 1 1 100% !important; }
  #extrasHandicaps > div, #extrasShotList > div { box-sizing: border-box; max-width: 100%; min-width: 0; }
}

/* HANDY: Rangliste – nur Rang, Name und Sortierspalten; „Alle Spalten zeigen“ mit seitlichem Scrollen */
.rk-cols-toggle { display: none; }
@media (max-width: 768px) {
  .rk-cols-toggle {
    display: inline-block; margin: 0 0 8px; padding: 8px 14px; border: 1px solid #cbd5e1; border-radius: 8px;
    background: #fff; color: #3a8dde; font-family: inherit; font-weight: 600; cursor: pointer;
  }
  #ranking-table-wrap { display: block !important; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #ranking-table-wrap:not(.rk-all) .ranking-table th:not(.rk-keep),
  #ranking-table-wrap:not(.rk-all) .ranking-table td:not(.rk-keep) { display: none; }
  #ranking-table-wrap:not(.rk-all) .sorted-col-outline { display: none; }
  .ranking-table th, .ranking-table td { padding: 8px 6px !important; font-size: 0.9em; }
  .ranking-table th { white-space: normal !important; }
  .ranking-table td:nth-child(2) { min-width: 96px; }
  .ranking-unequal-warning, .ranking-unequal-ok { margin-left: 0 !important; }
}

/* HANDY: Straf-Shots kompakt; Rangliste – Sortierung untereinander */
@media (max-width: 768px) {
  /* Straf-Shots: Name, offen und Knöpfe in einer Zeile; „erledigt/gesamt“ und das Wort „erledigt“ ausgeblendet */
  .ev-shot-grid { grid-template-columns: minmax(0, 1fr) auto auto !important; column-gap: 6px !important; justify-content: stretch !important; }
  .ev-shot-grid .ev-shot-total, .ev-shot-grid .ev-shot-lbl { display: none !important; }
  .ev-shot-grid .ev-shot-btns { gap: 4px !important; }
  .ev-shot-grid .ev-shot-btns button { min-height: 38px; min-width: 38px; padding: 4px 8px !important; font-size: 0.95em !important; }
  #extrasShotList > div { padding: 12px 10px !important; }
  .rk-sort-box { display: grid !important; grid-template-columns: 1fr auto; gap: 8px !important; margin-left: 0 !important; width: 100%; }
  .rk-sort-box .rk-sort-title { grid-column: 1; grid-row: 1; }
  .rk-sort-box .ranking-sort-help-btn { grid-column: 2; grid-row: 1; min-width: 32px; min-height: 32px; }
  /* „Entsperren“ in Teilnehmer und Aufstellung gut antippbar */
  .pc-lock button, #btn-unlock-teams { min-height: 36px; }
  .rk-sort-box > label:not(.rk-sort-title) { grid-column: 1 / -1; }
  .rk-sort-box select { flex: 1; width: 100% !important; min-height: 42px; }
}

/* HANDY/TABLET: Aufstellung antippen statt ziehen (tapMove.js) */
#tap-move-hint { display: none; }
.tap-selected {
  outline: 3px solid #7c3aed !important; outline-offset: 2px;
  background: #ede9fe !important; box-shadow: 0 0 0 4px rgba(124,58,237,0.15) !important;
}
.tap-active .drop-zone { outline: 2px dashed #a78bfa; outline-offset: -2px; }
#tap-move-hint.open {
  display: flex; align-items: center; gap: 10px;
  position: fixed; left: 10px; right: 10px; z-index: 10003;
  bottom: calc(var(--bottom-bar-height, 0px) + 10px + env(safe-area-inset-bottom));
  padding: 10px 12px; border-radius: 12px; background: #4c1d95; color: #fff;
  font-size: 0.92em; box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
#tap-move-hint span { flex: 1; }
#tap-move-hint button {
  flex-shrink: 0; padding: 8px 12px; border: 1px solid rgba(255,255,255,0.5); border-radius: 8px;
  background: transparent; color: #fff; font-family: inherit; font-weight: 600; cursor: pointer;
}
@media (max-width: 768px) {
  /* Aufstellung: Knopfreihen (Wunschpartner, Zurücksetzen, Auslosen) umbrechen */
  .aufst-actions { flex: 1 1 100% !important; margin-left: 0 !important; flex-wrap: wrap; }
  .player-list .draggable { max-width: calc(100% - 0.5em) !important; }
  /* „Ohne Team“ / „Ohne Gruppe“ oben: erst Person antippen, dann darunter das Ziel */
  .teams-grid > .unassigned-container,
  .groups-grid > .unassigned-container { order: -1; min-height: 0 !important; }
}
@media (max-width: 768px) {
  /* Extras: Suche und Sortierung der Straf-Shots untereinander in voller Breite */
  .extras-shot-controls { flex-wrap: wrap; }
  .extras-shot-controls input, .extras-shot-controls select { flex: 1 1 100%; width: auto !important; }
}

/* ========================================
   HANDY: Admin – Einladungs-Tokens, Anfragen, Turnierhistorie als Karten
   (Spaltenreihenfolge der Tabellen ist fest; Sortierung bleibt als kleine Knöpfe darüber)
   ======================================== */
@media (max-width: 768px) {
  /* Kopf der Admin-Seiten: Titel und „Zurück“ untereinander */
  .page-header { flex-wrap: wrap; gap: 6px 12px; }
  .page-header h1 { font-size: 1.6em !important; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

  /* Sortier-Köpfe als Knöpfe in einer Zeile über den Karten */
  .token-table, .token-table tbody,
  .tournament-table, .tournament-table tbody { display: block; width: 100%; }
  .token-table thead, .tournament-table thead { display: block; margin-bottom: 8px; }
  .token-table thead tr, .tournament-table thead tr { display: flex; flex-wrap: wrap; gap: 6px; }
  .token-table thead th, .tournament-table thead th {
    display: inline-flex !important; align-items: center; gap: 4px; width: auto !important;
    padding: 5px 10px !important; border-radius: 999px; font-size: 0.78em !important; white-space: nowrap;
  }
  .token-table thead th:last-child, .tournament-table thead th:first-child { display: none !important; }

  /* Karten */
  .token-table tbody tr, .tournament-table tbody tr {
    display: grid; grid-template-columns: auto 1fr auto; gap: 4px 10px; align-items: center;
    padding: 12px; margin-bottom: 10px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  }
  .token-table tbody td, .tournament-table tbody td {
    display: block; padding: 0 !important; border: none !important; grid-column: 1 / -1; min-width: 0;
  }
  .token-table tbody tr:hover td, .tournament-table tbody tr:hover td { background: transparent; }
  .token-table td[colspan], .tournament-table td[colspan] { grid-column: 1 / -1; }

  /* Token: Häkchen · Status · Datum, darunter Organisator, Titel, Link, Empfänger, Turnier, Knöpfe */
  .token-table tbody td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .token-table tbody td:nth-child(7) { grid-column: 2; grid-row: 1; }
  .token-table tbody td:nth-child(6) { grid-column: 3; grid-row: 1; font-size: 0.8em; color: #64748b; }
  .token-table tbody td:nth-child(3) { order: 1; font-weight: 700; font-size: 1.02em; }
  .token-table tbody td:nth-child(4) { order: 2; }
  .token-table tbody td:nth-child(2) { order: 3; font-size: 0.8em; word-break: break-all; }
  .token-table tbody td:nth-child(5) { order: 4; font-size: 0.85em !important; font-style: normal !important; }
  .token-table tbody td:nth-child(5)::before { content: 'Gesendet an: '; color: #94a3b8; }
  .token-table tbody td:nth-child(8) { order: 5; font-size: 0.85em; }
  .token-table tbody td:nth-child(8)::before { content: 'Turnier: '; color: #94a3b8; }
  .token-table tbody td:nth-child(9) { order: 6; display: flex; flex-wrap: wrap; gap: 8px; white-space: normal !important; margin-top: 4px; }
  .token-table tbody td:nth-child(9) .action-btn { width: 44px; height: 40px; }
  .token-table .note-input { width: 100%; box-sizing: border-box; min-height: 40px; }

  /* Turnierhistorie: Häkchen · Code · Typ · Status, darunter Titel, Organisator, Daten */
  .tournament-table tbody tr { grid-template-columns: auto auto 1fr auto auto; }
  .tournament-table tbody td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .tournament-table tbody td:nth-child(2) { grid-column: 2; grid-row: 1; }
  .tournament-table tbody td:nth-child(5), .tournament-table tbody td:nth-child(6), .tournament-table tbody td:nth-child(7) { display: block; }
  .tournament-table tbody td:nth-child(7) { grid-column: 4; grid-row: 1; }
  .tournament-table tbody td:nth-child(8) { grid-column: 5; grid-row: 1; }
  .tournament-table tbody td:nth-child(3) { order: 1; font-weight: 700; font-size: 1.02em; }
  .tournament-table tbody td:nth-child(4) { order: 2; font-size: 0.9em; color: #475569; }
  .tournament-table tbody td:nth-child(5),
  .tournament-table tbody td:nth-child(6) { order: 3; grid-column: auto / span 2; font-size: 0.8em; color: #64748b; }
  .tournament-table tbody td:nth-child(5),
  .tournament-table tbody td:nth-child(6) { grid-column: 1 / -1; white-space: nowrap; }
  .tournament-table tbody td:nth-child(5)::before { content: 'Erstellt '; }
  .tournament-table tbody td:nth-child(6)::before { content: 'Geändert '; }
  .tournament-table tbody tr.selected { border-color: #3a8dde; background: #eff6ff; }
  .tournament-table input[type="checkbox"], .token-table td input[type="checkbox"] { width: 22px; height: 22px; }

  /* Aktionen-Leiste der Historie oben, klebt beim Scrollen */
  .content-card .bulk-actions {
    position: sticky; top: 0; z-index: 50; background: #fff;
    margin: 0 -4px 10px; padding: 10px 6px; border-bottom: 1px solid #e2e8f0; box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  }
  .actions-dropdown-btn { min-height: 42px; }

  /* Keine Umbrüche mitten in Zahlen-Angaben */
  .nowrap, .stats-badge, .status-badge, .badge, .badge-status { white-space: nowrap; }

  /* Admin-Übersicht: 2 Kacheln nebeneinander, Text und Symbole kleiner */
  .dashboard-cards { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .dashboard-card {
    flex-direction: column; gap: 6px !important; padding: 14px 8px !important;
    font-size: 0.92em !important; text-align: center; line-height: 1.2; min-height: 84px; box-sizing: border-box;
  }
  .dashboard-card .icon svg { width: 22px !important; height: 22px !important; }
  .dashboard-logo { height: 44px !important; width: auto; }
  .dashboard-header h1 { font-size: 1.5em !important; }

  /* Admin-Übersicht: Links (Startseite, Abmelden) unter den Titel */
  .dashboard-header { flex-wrap: wrap; gap: 8px; }
  .dashboard-header .header-actions { flex-basis: 100%; display: flex; justify-content: space-between; gap: 12px; }

  /* Token-Formular: Felder und Knopf in voller Breite */
  .generate-row { flex-direction: column; align-items: stretch !important; }
  .generate-row .field, .generate-row .field input { width: 100% !important; max-width: none !important; box-sizing: border-box; }
  .generate-row .field input { min-height: 44px; font-size: 16px; }
  .generate-row > button { width: 100%; min-height: 46px; }

  /* Anfragen: große Knöpfe nebeneinander */
  .req-when { margin-left: 0 !important; }
  .req-actions .req-ok, .req-actions .req-no { flex: 1 1 0; min-height: 46px; font-size: 1em; }
  .req-done table, .req-done tbody { display: block; }
  .req-done thead { display: none; }
  .req-done tr { display: flex; flex-wrap: wrap; gap: 2px 10px; padding: 8px 0; border-bottom: 1px solid #f0f2f5; }
  .req-done td { padding: 0 !important; border: none !important; }
  .req-done td:first-child { flex-basis: 100%; font-weight: 600; }
}

/* Begegnungen: Schalter „Automatisch starten“ (neben dem Timer) */
.auto-start-toggle {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
  font-size: 0.88em; font-weight: 600; color: #2a3a4d; cursor: pointer; white-space: nowrap; user-select: none;
}
.auto-start-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.auto-start-toggle .ast-switch { position: relative; width: 38px; height: 21px; border-radius: 999px; background: #cbd5e1; transition: background 0.2s; flex-shrink: 0; }
.auto-start-toggle .ast-switch::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.2); transition: left 0.2s;
}
.auto-start-toggle input:checked + .ast-switch { background: #22c55e; }
.auto-start-toggle input:checked + .ast-switch::after { left: 19px; }
.auto-start-toggle input:focus-visible + .ast-switch { outline: 2px solid #3a8dde; outline-offset: 2px; }

/* Losverfahren (Reiter Teilnehmer) */
#lottery-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 16px; }
#lottery-modal .lo-box { background: #fff; border-radius: 12px; max-width: 760px; width: 100%; max-height: 90vh; overflow: auto; padding: 20px 22px; box-shadow: 0 10px 40px rgba(0,0,0,0.25); box-sizing: border-box; }
#lottery-modal .lo-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
#lottery-modal .lo-head h3 { margin: 0; font-size: 1.1em; flex: 1; }
#lo-close { border: none; background: none; font-size: 1.5em; line-height: 1; cursor: pointer; color: #64748b; }
#lottery-modal .lo-info { margin: 0 0 8px; color: #334155; font-size: 0.92em; }
#lottery-modal .lo-warn { background: #fffbeb; border: 1px solid #fcd34d; color: #92400e; border-radius: 8px; padding: 8px 12px; font-size: 0.9em; margin-bottom: 8px; }
#lottery-modal .lo-hint { margin: 0 0 10px; color: #64748b; font-size: 0.85em; }
#lottery-modal .lo-cols { display: flex; gap: 14px; flex-wrap: wrap; }
#lottery-modal .lo-col { flex: 1 1 260px; min-width: 0; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px 10px; }
#lottery-modal .lo-col h4 { margin: 2px 0 8px; font-size: 0.95em; color: #1e293b; }
#lottery-modal .lo-list { list-style: none; margin: 0; padding: 0; max-height: 320px; overflow: auto; }
#lottery-modal .lo-item { display: block; width: 100%; text-align: left; border: 1px solid transparent; background: #f8fafc; border-radius: 6px; padding: 7px 9px; margin-bottom: 4px; font: inherit; font-size: 0.92em; cursor: pointer; color: #1e293b; }
#lottery-modal .lo-item:hover { border-color: #93c5fd; }
#lottery-modal .lo-item.lo-picked { background: #dbeafe; border-color: #3a8dde; font-weight: 600; }
#lottery-modal .lo-no { color: #64748b; font-variant-numeric: tabular-nums; }
#lottery-modal .lo-pair { color: #64748b; font-size: 0.85em; }
#lottery-modal .lo-mails { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; font-size: 0.92em; cursor: pointer; }
#lottery-modal .lo-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
@media (max-width: 768px) {
  #lottery-modal { align-items: flex-end; padding: 0; }
  #lottery-modal .lo-box { border-radius: 14px 14px 0 0; max-height: 92vh; padding: 16px; }
  #lottery-modal .lo-item { padding: 10px; }
  #lottery-modal .lo-actions .btn { flex: 1 1 auto; min-height: 44px; }
}
