/* Kiosk-Ansichten ohne Menü: Board-Tablet, Melde-Tablet, Beamer. Gestaltung nach dem abgenommenen Mockup (Phase 3). */
.kiosk {
    --rot: var(--tv-akzent); --rot-hell: var(--tv-akzent-hell); --blau: var(--tv-leitung); --gruen: #2fae5f; --gold: #ffd54a;
    --text: #e6e6e6; --gedimmt: #9a9a9a; --karte: rgba(20, 20, 22, .86); --rand: rgba(255, 255, 255, .09);
    position: fixed; inset: 0; display: flex; flex-direction: column; overflow: hidden;
    color: var(--text); font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
    background: linear-gradient(rgba(8, 10, 16, .72), rgba(8, 10, 16, .86)), var(--tv-hintergrund) right center / cover, #0b0d12;
    user-select: none; -webkit-user-select: none; touch-action: manipulation;
}
.kiosk * { box-sizing: border-box; }
.kiosk .num { font-variant-numeric: tabular-nums; }
.kiosk button {
    font: inherit; color: #fff; background: rgba(48, 48, 52, .95); border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 10px; font-weight: 700; cursor: pointer;
}
.kiosk button:active, .kiosk button.gedrueckt { filter: brightness(1.3); }
.kiosk button:disabled { opacity: .4; cursor: default; }
.kiosk button.ok, .kiosk button.gross { background: var(--rot); border-color: var(--rot-hell); }

/* Kopfzeile */
.kiosk .kopf { display: flex; align-items: center; gap: 14px; height: 54px; padding: 0 18px; background: rgba(10, 10, 12, .92); border-bottom: 2px solid var(--rot); flex: none; }
.kiosk .kopf img { height: 36px; width: 36px; }
/* Beamer: Wortmarke „DoubleOut“ rechts oben */
.kiosk .kopf-marke { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.05; margin-right: 6px; }
.kiosk .kopf .kopf-marke img { height: 30px; width: auto; margin: -4px -4px 1px 0; }
.kiosk .kopf-marke small { font-size: 9px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gedimmt); }
.kiosk .board { background: var(--rot); color: #fff; font-weight: 800; padding: 4px 12px; border-radius: 6px; font-size: 20px; letter-spacing: .03em; }
.kiosk .board.melden { background: var(--blau); }
.kiosk .kopf .info { line-height: 1.15; min-width: 0; }
.kiosk .kopf .info b { font-size: 16px; }
.kiosk .kopf .info span { display: block; color: var(--gedimmt); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kiosk .kopf .rechts { margin-left: auto; display: flex; align-items: center; gap: 16px; color: var(--gedimmt); font-size: 14px; white-space: nowrap; }
.kiosk .punkt { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--gruen); margin-right: 6px; box-shadow: 0 0 6px var(--gruen); }
.kiosk .punkt.aus { background: var(--rot-hell); box-shadow: 0 0 6px var(--rot-hell); }
.kiosk .uhr { color: #fff; font-weight: 600; font-size: 17px; }
.kiosk .hinweis-leiste { background: rgba(var(--tv-akzent-rgb), .9); color: #fff; padding: 8px 18px; font-weight: 600; display: flex; gap: 12px; align-items: center; flex: none; }
.kiosk .hinweis-leiste button { margin-left: auto; padding: 4px 14px; background: rgba(0, 0, 0, .3); }

/* Zählansicht */
.kiosk .inhalt { flex: 1; display: grid; grid-template-columns: 1fr minmax(360px, 470px); gap: 14px; padding: 14px; min-height: 0; }
.kiosk .links { display: flex; flex-direction: column; gap: 14px; min-height: 0; }
.kiosk .spieler-reihe { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.kiosk .spieler { background: var(--karte); border: 2px solid var(--rand); border-radius: 14px; padding: 12px 16px; position: relative; }
.kiosk .spieler.aktiv { border-color: var(--rot); box-shadow: 0 0 0 1px var(--rot), 0 0 28px rgba(var(--tv-akzent-rgb), .35); }
.kiosk .spieler.aktiv::before { content: "AM WURF"; position: absolute; top: -11px; left: 14px; background: var(--rot); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .12em; padding: 3px 9px; border-radius: 4px; }
.kiosk .spieler .name { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 21px; font-weight: 700; }
.kiosk .spieler .name-text { min-width: 0; line-height: 1.2; overflow-wrap: break-word; }
.kiosk .legs { display: flex; gap: 5px; flex: none; }
.kiosk .legs i { width: 15px; height: 15px; border-radius: 50%; border: 2px solid #666; }
.kiosk .legs i.an { background: var(--gold); border-color: var(--gold); }
.kiosk .anwurf { font-size: 12px; color: var(--gold); font-weight: 600; margin-top: 2px; }
.kiosk .leer { visibility: hidden; }
.kiosk .rest { font-size: clamp(64px, 10vw, 104px); font-weight: 800; line-height: 1; text-align: center; margin: 4px 0 6px; color: #fff; letter-spacing: -.02em; }
.kiosk .spieler:not(.aktiv) .rest { color: #bdbdbd; }
.kiosk .werte { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; border-top: 1px solid var(--rand); padding-top: 8px; }
.kiosk .werte b { display: block; font-size: 20px; }
.kiosk .werte span { font-size: 12px; color: var(--gedimmt); }
.kiosk .checkout { margin-top: 10px; display: flex; gap: 6px; justify-content: center; align-items: center; min-height: 32px; }
.kiosk .checkout .lbl { font-size: 12px; color: var(--gedimmt); margin-right: 4px; }
.kiosk .checkout .d { background: rgba(47, 174, 95, .18); border: 1px solid var(--gruen); color: #c9f5d8; font-weight: 700; padding: 4px 12px; border-radius: 6px; font-size: 18px; }

.kiosk .verlauf { flex: 1; background: var(--karte); border: 1px solid var(--rand); border-radius: 14px; padding: 6px 14px; min-height: 0; overflow: auto; }
.kiosk .verlauf table { width: 100%; border-collapse: collapse; font-size: 17px; }
.kiosk .verlauf th { color: var(--gedimmt); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; padding: 6px 4px; }
.kiosk .verlauf td { text-align: center; padding: 4px; border-top: 1px solid rgba(255, 255, 255, .06); }
.kiosk .verlauf td.mitte { color: var(--gedimmt); font-size: 13px; width: 70px; }
.kiosk .verlauf td.rest-s { color: var(--gedimmt); }
.kiosk .verlauf td.hoch { color: var(--gold); font-weight: 700; }
.kiosk .verlauf td.bust { color: var(--rot-hell); text-decoration: line-through; }

/* Eingabe */
.kiosk .rechts-sp { display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.kiosk .anzeige { background: #050505; border: 2px solid #333; border-radius: 12px; height: 84px; display: flex; align-items: center; padding: 0 18px; flex: none; }
.kiosk .anzeige.fehler { border-color: var(--rot-hell); }
.kiosk .anzeige .wer { color: var(--gedimmt); font-size: 14px; line-height: 1.2; }
.kiosk .anzeige .wer b { color: #fff; display: block; font-size: 17px; }
.kiosk .anzeige .wer em { color: var(--rot-hell); font-style: normal; display: block; font-size: 14px; font-weight: 600; }
.kiosk .anzeige .zahl { margin-left: auto; font-size: 58px; font-weight: 800; color: #fff; }
.kiosk .anzeige .zahl small { font-size: 18px; color: var(--gedimmt); font-weight: 500; margin-left: 6px; }
.kiosk .schnell { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; flex: none; }
.kiosk .schnell button { height: 46px; font-size: 19px; }
.kiosk .tasten { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; flex: 1; min-height: 0; }
.kiosk .tasten button { font-size: 32px; }
.kiosk .tasten button.ok { font-size: 26px; }
.kiosk button.korr { background: rgba(70, 60, 40, .95); font-size: 20px; }
.kiosk .fuss { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; flex: none; }
.kiosk .fuss button { height: 50px; font-size: 15px; font-weight: 600; background: rgba(30, 30, 34, .95); color: #ddd; }
.kiosk .fuss button.an { background: rgba(var(--tv-leitung-rgb), .35); border-color: var(--blau); color: #fff; }

/* Dialog */
.kiosk .dimm { position: absolute; inset: 0; background: rgba(0, 0, 0, .66); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(2px); z-index: 10; }
.kiosk .dialog { width: min(720px, 94vw); background: #151517; border: 2px solid var(--gruen); border-radius: 18px; padding: 26px 32px; box-shadow: 0 20px 60px rgba(0, 0, 0, .7); }
.kiosk .dialog.rot { border-color: var(--rot); }
.kiosk .dialog h3 { margin: 0; font-size: 34px; }
.kiosk .dialog .unter { color: var(--gedimmt); margin: 4px 0 20px; font-size: 16px; }
.kiosk .frage { margin: 16px 0 8px; font-size: 18px; font-weight: 600; }
.kiosk .wahl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.kiosk .wahl.vier { grid-template-columns: repeat(4, 1fr); }
.kiosk .wahl button { height: 76px; font-size: 30px; }
.kiosk .wahl button.gew { background: var(--gruen); border-color: #5fd68b; }
.kiosk .dialog .zeile { display: flex; gap: 12px; margin-top: 24px; }
.kiosk .dialog .zeile button { height: 60px; flex: 1; font-size: 19px; }

/* Mitte (Hinweise, Wer beginnt, Abschluss) */
.kiosk .mitte-box { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px; }
.kiosk .vorzeile { color: var(--rot-hell); font-weight: 800; text-transform: uppercase; letter-spacing: .2em; font-size: 15px; }
.kiosk .hinweis { color: var(--gedimmt); font-size: 16px; margin: 10px 0 22px; }
.kiosk .beginner { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; }
.kiosk .beginner button { width: 330px; height: 84px; font-size: 22px; }
.kiosk .chip { display: inline-block; background: rgba(var(--tv-leitung-rgb), .2); border: 1px solid var(--blau); color: #cfe2ff; padding: 4px 12px; border-radius: 20px; font-size: 14px; margin: 0 4px; }
.kiosk .gross-text { font-size: 42px; font-weight: 800; margin: 18px 0 6px; }

/* Warteansicht */
.kiosk .warte { flex: 1; display: grid; grid-template-columns: 1fr minmax(320px, 460px); gap: 18px; padding: 18px; min-height: 0; }
.kiosk .w-erste { background: var(--karte); border: 2px solid var(--rot); border-radius: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 24px; box-shadow: 0 0 30px rgba(var(--tv-akzent-rgb), .25); }
.kiosk .w-erste.ruhig { border-color: var(--rand); box-shadow: none; }
.kiosk .w-paar { margin: 26px 0 8px; display: flex; flex-direction: column; gap: 4px; }
.kiosk .w-paar b { font-size: 42px; }
.kiosk .w-paar .vs { color: var(--gedimmt); font-weight: 800; font-size: 20px; }
.kiosk .start { width: min(440px, 90%); height: 104px; font-size: 32px; background: var(--rot); border-color: var(--rot-hell); margin-top: 10px; }
.kiosk .w-liste { background: var(--karte); border: 1px solid var(--rand); border-radius: 18px; padding: 16px 18px; overflow: auto; }
.kiosk .w-kopf { color: var(--gedimmt); font-size: 13px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; margin-bottom: 8px; }
.kiosk .w-zeile { display: flex; gap: 14px; align-items: center; padding: 14px 4px; border-top: 1px solid rgba(255, 255, 255, .07); }
.kiosk .w-zeile .nr { width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .08); display: flex; align-items: center; justify-content: center; font-weight: 800; flex: none; }
.kiosk .w-zeile b { font-size: 19px; display: block; }
.kiosk .w-zeile span { color: var(--gedimmt); font-size: 14px; }
.kiosk .w-zeile.gedimmt { opacity: .5; }

/* E-Dart */
.kiosk .e-wrap { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 18px; min-height: 0; }
.kiosk .e-sp { background: var(--karte); border: 1px solid var(--rand); border-radius: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 24px; }
.kiosk .e-sp.beginnt { border-color: var(--gold); }
.kiosk .e-sp .n { font-size: 34px; font-weight: 800; text-align: center; line-height: 1.15; }
.kiosk .e-sp .l { font-size: 150px; font-weight: 800; line-height: 1; }
.kiosk .e-sp .lb { color: var(--gedimmt); font-size: 15px; text-transform: uppercase; letter-spacing: .14em; }
.kiosk .e-sp button { margin-top: 18px; width: 92%; height: 120px; font-size: 28px; background: var(--rot); border-color: var(--rot-hell); }
.kiosk .e-leiste { display: flex; gap: 12px; padding: 0 18px 18px; align-items: center; flex: none; }
.kiosk .e-leiste button { height: 58px; padding: 0 26px; font-size: 17px; background: rgba(30, 30, 34, .95); }
.kiosk .e-leiste .txt { color: var(--gedimmt); font-size: 15px; margin-left: auto; }

/* NFC-Melden */
.kiosk .nfc { flex: 1; display: grid; grid-template-columns: minmax(300px, 420px) 1fr; gap: 18px; padding: 18px; min-height: 0; }
.kiosk .nfc-warte { background: var(--karte); border: 1px dashed rgba(255, 255, 255, .2); border-radius: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 26px; }
.kiosk .nfc-warte.passiv { opacity: .55; }
.kiosk .nfc-warte .ic { width: 150px; height: 150px; border-radius: 50%; border: 3px solid var(--blau); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; }
.kiosk .nfc-warte h3 { font-size: 26px; margin: 0 0 6px; }
.kiosk .nfc-warte p { color: var(--gedimmt); margin: 0; }
.kiosk .nfc-treffer { background: var(--karte); border: 2px solid var(--blau); border-radius: 18px; padding: 24px 28px; display: flex; flex-direction: column; overflow: auto; }
.kiosk .nfc-treffer.gruen { border-color: var(--gruen); }
.kiosk .nfc-treffer.rot { border-color: var(--rot); }
.kiosk .nfc-treffer .karte-z { color: var(--gedimmt); font-size: 15px; }
.kiosk .nfc-treffer h3 { font-size: 34px; margin: 2px 0 14px; }
.kiosk .melde-partie { background: rgba(255, 255, 255, .05); border-radius: 12px; padding: 14px 18px; font-size: 18px; margin-bottom: 8px; }
.kiosk .melde-partie .gegner { font-size: 24px; font-weight: 700; margin-top: 4px; }
.kiosk .erg { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; margin-top: 8px; }
.kiosk .erg button { height: 76px; font-size: 30px; }
.kiosk .erg button.gew { background: var(--blau); border-color: var(--tv-leitung-hell); }
.kiosk .nfc-treffer .unten { margin-top: auto; padding-top: 16px; display: flex; gap: 12px; }
.kiosk .nfc-treffer .unten button { height: 66px; font-size: 20px; flex: 1; }
.kiosk .nfc-treffer .unten button.ok { flex: 2; }
.kiosk .leser { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Live-Kacheln (Live-Seite und Beamer) */
.live-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.live-board { background: var(--tv-karte, rgba(20, 20, 22, .86)); border: 1px solid rgba(255, 255, 255, .09); border-radius: 14px; padding: 12px 14px; }
.live-board.laeuft { border-color: rgba(var(--tv-akzent-rgb), .7); }
.live-board .lb-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: .85rem; color: #9a9a9a; }
.live-board .lb-kennung { background: var(--rot); color: #fff; font-weight: 800; padding: 1px 9px; border-radius: 5px; font-size: 1rem; }
.live-board .lb-kennung.frei { background: #444; }
.live-board .lb-zeile { display: grid; grid-template-columns: 14px 1fr auto auto; gap: 8px; align-items: center; padding: 4px 0; }
.live-board .lb-zeile + .lb-zeile { border-top: 1px solid rgba(255, 255, 255, .06); }
.live-board .lb-wurf { width: 9px; height: 9px; border-radius: 50%; }
.live-board .lb-wurf.an { background: var(--rot); box-shadow: 0 0 6px var(--rot); }
.live-board .lb-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-board .lb-legs { font-weight: 800; color: #ffd54a; font-size: 1.2rem; min-width: 1.5rem; text-align: center; }
.live-board .lb-rest { font-weight: 800; font-size: 1.5rem; min-width: 3.4rem; text-align: right; font-variant-numeric: tabular-nums; }
.live-board .lb-fuss { display: flex; gap: 10px; color: #9a9a9a; font-size: .8rem; margin-top: 6px; flex-wrap: wrap; }
.live-board .lb-co { color: #c9f5d8; }
.live-board .lb-sieger .lb-name { color: #ffd54a; }

/* Beamer */
.kiosk.beamer { user-select: auto; }
.kiosk.beamer .beamer-inhalt { flex: 1; padding: 18px 24px; overflow: hidden; min-height: 0;
    /* Spalten-Umbruch: passt die Leiste „Zuletzt gemeldet“ nicht mehr unter die Seite, wandert sie in eine zweite Spalte außerhalb des Bildes. */
    display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; column-gap: 100px; }
.kiosk.beamer .beamer-seite { width: 100%; flex: none; }
.kiosk.beamer .beamer-seite > .mitte-box { min-height: 60vh; }

/* Beamer: zuletzt gemeldete Ergebnisse, farblich abgesetzt (blau = Meldungen) */
.kiosk.beamer .zuletzt { width: 100%; flex: none; margin-top: auto; padding-top: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 12px; align-items: start; }
.kiosk.beamer .zl-titel { grid-column: 1 / -1; justify-self: start; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: var(--blau); border-radius: 6px; padding: 3px 12px; }
.kiosk.beamer .zl-partie { background: rgba(20, 45, 85, .88); border: 1px solid rgba(var(--tv-leitung-rgb), .55); border-left: 5px solid var(--blau); border-radius: 10px; padding: 8px 14px; min-width: 0; }
.kiosk.beamer .zl-kopf { font-size: .85rem; color: #a9c6ee; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kiosk.beamer .zl-erg { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 2px; font-size: 1.2rem; }
.kiosk.beamer .zl-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #c5cfdc; }
.kiosk.beamer .zl-name.rechts { text-align: right; }
.kiosk.beamer .zl-name.sieger { color: #fff; font-weight: 800; }
.kiosk.beamer .zl-legs { font-weight: 800; font-size: 1.5rem; color: #fff; }
.kiosk.beamer .live-raster { grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); }
.kiosk.beamer .live-board { font-size: 1.15rem; }
.kiosk.beamer .live-board .lb-rest { font-size: 2.1rem; }
.kiosk.beamer h2 { font-size: 1.6rem; margin: 0 0 12px; }
.kiosk.beamer .fortschritt { height: 3px; background: var(--rot); flex: none; animation: beamer-lauf linear forwards; }
@keyframes beamer-lauf { from { width: 0; } to { width: 100%; } }

@media (max-width: 900px) {
    .kiosk .inhalt, .kiosk .warte, .kiosk .nfc { grid-template-columns: 1fr; overflow: auto; }
}

/* Beamer: Knopf hell/dunkel (unauffällig, nur bei Bedarf mit der Maus) */
.kiosk.beamer .ansicht-knopf { background: transparent; border: 1px solid var(--rand); color: var(--gedimmt); width: 32px; height: 32px; padding: 0; border-radius: 50%; font-size: 16px; line-height: 1; opacity: .5; }
.kiosk.beamer .ansicht-knopf:hover { opacity: 1; }

/* Beamer hell (?ansicht=hell): weißer Grund, schwarze Schrift, kräftige Farben – für helle Räume und große Entfernung. */
.kiosk.beamer.hell {
    --rot: var(--tv-akzent-dunkel); --rot-hell: var(--tv-akzent-dunkel); --blau: var(--tv-leitung-dunkel); --gruen: #137a3a; --gold: #8a5a00;
    --text: #111; --gedimmt: #4a4a4a; --karte: #fff; --rand: #c9c9c9;
    --tv-text: #111; --tv-text-gedimmt: #4a4a4a; --tv-karte: #fff; --tv-karte-rand: #c9c9c9;
    --bs-body-color: #111; --bs-body-bg: #fff;
    background: var(--tv-hintergrund-hell) right center / cover, #eceef1; color: #111;
}
.kiosk.beamer.hell .kopf { background: #fff; border-bottom: 4px solid var(--rot); }
.kiosk.beamer.hell .kopf .info b { font-size: 18px; }
.kiosk.beamer.hell .kopf .info span, .kiosk.beamer.hell .kopf .rechts { color: #333; }
.kiosk.beamer.hell .uhr { color: #111; font-weight: 800; }
.kiosk.beamer.hell .fortschritt { height: 4px; }
.kiosk.beamer.hell .gross-text { color: #111; }

/* Live-Kacheln */
.kiosk.beamer.hell .live-board { background: #fff; border: 2px solid #c9c9c9; box-shadow: 0 2px 8px rgba(0, 0, 0, .08); }
.kiosk.beamer.hell .live-board.laeuft { border-color: var(--rot); }
.kiosk.beamer.hell .live-board .lb-kopf { color: #333; }
.kiosk.beamer.hell .live-board .lb-kennung { background: var(--rot); }
.kiosk.beamer.hell .live-board .lb-kennung.frei { background: #6b6b6b; }
.kiosk.beamer.hell .live-board .lb-zeile + .lb-zeile { border-top-color: #ddd; }
.kiosk.beamer.hell .live-board .lb-name { font-weight: 700; color: #111; }
.kiosk.beamer.hell .live-board .lb-wurf.an { background: var(--rot); box-shadow: none; }
.kiosk.beamer.hell .live-board .lb-legs { color: #fff; background: #111; border-radius: 6px; padding: 0 .35rem; }
.kiosk.beamer.hell .live-board .lb-rest { color: #000; }
.kiosk.beamer.hell .live-board .lb-fuss { color: #333; }
.kiosk.beamer.hell .live-board .lb-co { color: var(--gruen); font-weight: 700; }
.kiosk.beamer.hell .live-board .lb-sieger .lb-name { color: var(--gruen); }

/* Turnierbaum und Gruppen */
.kiosk.beamer.hell .karte { background: #fff; border-color: #c9c9c9; box-shadow: 0 2px 8px rgba(0, 0, 0, .08); }
.kiosk.beamer.hell .table > :not(caption) > * > * { border-bottom-color: #ddd; }
.kiosk.beamer.hell .table thead th { color: #fff; background: #2b2b2b; }
.kiosk.beamer.hell .tabelle-gruppe tr.aufsteiger td { background: #d6f0de; }
.kiosk.beamer.hell .baum-titel, .kiosk.beamer.hell .baum-rundenname { color: #333; font-weight: 700; }
.kiosk.beamer.hell .baum-seite-sieger, .kiosk.beamer.hell .baum-seite-finale { border-left-color: #bbb; }
.kiosk.beamer.hell .partie { background: #fff; border-color: #bdbdbd; border-left-color: #8a8a8a; color: #111; }
.kiosk.beamer.hell .partie-kopf { color: #444; border-bottom-color: #e2e2e2; }
.kiosk.beamer.hell .partie-zeile + .partie-zeile { border-top-color: #e2e2e2; }
.kiosk.beamer.hell .partie-sieger { color: #000; font-weight: 800; }
.kiosk.beamer.hell .partie-verlierer { color: #6a6a6a; }
.kiosk.beamer.hell .partie-freilos { color: #777; }
.kiosk.beamer.hell .partie-bereit { border-left-color: #c77d00; }
.kiosk.beamer.hell .partie-laeuft { border-left-color: var(--blau); box-shadow: 0 0 0 2px rgba(var(--tv-leitung-dunkel-rgb), .55); }
.kiosk.beamer.hell .partie-beendet { border-left-color: var(--gruen); }
.kiosk.beamer.hell .partie-board { color: var(--blau); }
.kiosk.beamer.hell .partie-hinweis { color: #9a5c00; font-weight: 700; }
.kiosk.beamer.hell .partie-moeglich { text-decoration-color: rgba(0, 0, 0, .3); }
.kiosk.beamer.hell .partie-offen { opacity: .9; }
.kiosk.beamer.hell .zl-partie { background: #dbe8fb; border-color: #8fb4ea; border-left-color: var(--blau); }
.kiosk.beamer.hell .zl-kopf { color: #1d3d6b; }
.kiosk.beamer.hell .zl-name { color: #3a4656; }
.kiosk.beamer.hell .zl-name.sieger, .kiosk.beamer.hell .zl-legs { color: #000; }

/* Melde-Tablet koppeln (QR-Code) */
.kiosk .koppeln-app { margin-top: 34px; max-width: 620px; background: var(--karte); border: 1px solid var(--rand); border-radius: 14px; padding: 16px 22px; display: flex; flex-direction: column; gap: 6px; font-size: 16px; }
.kiosk .koppeln-app[hidden], .kiosk .koppeln-app [hidden], .kiosk [data-zustand][hidden] { display: none; }
.kiosk .koppeln-app small { color: var(--gedimmt); }
.kiosk .koppeln-app button { padding: 6px 14px; background: var(--blau); border-color: var(--tv-leitung-hell); }

/* Beamer: Bestleistungen heute und Banner bei 180 / High Finish */
.kiosk.beamer .beamer-bestleistungen { padding: 10px 6px; }
.kiosk.beamer .heute-bestleistungen.gross .eintrag { font-size: 30px; }
.kiosk.beamer .heute-bestleistungen.gross .titel { font-size: 20px; }
.kiosk.beamer .heute-bestleistungen.gross .eintrag { gap: 18px; }
/* Werte je Spalte gleich lang (Ziffern gleich breit): keine feste Breite, damit die Namen Platz haben. */
.kiosk.beamer .heute-bestleistungen.gross .eintrag .wert { min-width: 0; flex: 0 0 auto; font-variant-numeric: tabular-nums; }
.kiosk.beamer.hell .heute-bestleistungen .titel { color: var(--rot); }
.kiosk.beamer.hell .heute-bestleistungen .eintrag .wert, .kiosk.beamer.hell .heute-bestleistungen .eintrag .name { color: #111; }
.kiosk.beamer.hell .heute-bestleistungen .eintrag.erster .wert { color: #b8860b; }

.kiosk .beamer-banner { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 50; min-width: 56%;
    padding: 34px 60px 38px; text-align: center; border-radius: 22px; color: #fff;
    background: linear-gradient(135deg, rgba(var(--tv-akzent-rgb), .97), rgba(var(--tv-akzent-tief-rgb), .97)); border: 4px solid var(--gold);
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, .55), 0 20px 60px rgba(0, 0, 0, .6); animation: banner-rein .5s ease-out; }
.kiosk .beamer-banner.finish { background: linear-gradient(135deg, rgba(var(--tv-leitung-rgb), .97), rgba(var(--tv-leitung-tief-rgb), .97)); }
.kiosk .beamer-banner .gross { font-size: 120px; font-weight: 900; line-height: 1; letter-spacing: .02em; text-shadow: 0 6px 24px rgba(0, 0, 0, .45); }
.kiosk .beamer-banner.finish .gross { font-size: 86px; }
.kiosk .beamer-banner .wer { font-size: 48px; font-weight: 800; margin-top: 14px; }
.kiosk .beamer-banner .wo { font-size: 24px; color: rgba(255, 255, 255, .85); margin-top: 6px; }
@keyframes banner-rein { from { transform: translate(-50%, -50%) scale(.6); opacity: 0; } to { transform: translate(-50%, -50%) scale(1); opacity: 1; } }

.kiosk .board.statistik { background: var(--gruen); }

/* Melde-Tablet: Auswahl bei mehreren laufenden Partien und Kontrollschirm vor dem Melden */
.kiosk .melde-wahl { display: grid; gap: 12px; margin-top: 8px; }
.kiosk .melde-wahl button { min-height: 76px; font-size: 20px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 4px; padding: 10px 18px; text-align: left; }
.kiosk .melde-wahl button span { font-size: 15px; opacity: .75; }
.kiosk .frage.pruefen { font-size: 24px; line-height: 1.4; padding: 16px; border-radius: 12px; background: rgba(255, 196, 0, .12); border: 1px solid rgba(255, 196, 0, .5); }

/* Fehlergrenze auf Tablets */
.fehlergrenze-kiosk { margin: 24px; font-size: 20px; }
.fehlergrenze-kiosk .btn { font-size: 18px; padding: 10px 18px; }

/* Training am Board-Tablet (eigenes Farbschema über style am .kiosk) */
.kiosk input { user-select: text; -webkit-user-select: text; font: inherit; }
.kiosk.training .kopf { border-bottom-color: var(--tv-akzent); }
.kiosk .t-start-knopf { margin-top: 24px; background: rgba(var(--tv-akzent-rgb), .25); border-color: var(--rot); font-size: 26px; height: 84px; }
.kiosk .t-start { flex: 1; display: grid; grid-template-columns: minmax(340px, 1fr) minmax(340px, 1fr); gap: 18px; padding: 18px; min-height: 0; }
.kiosk .t-spalte { background: var(--karte); border: 1px solid var(--rand); border-radius: 18px; padding: 16px 18px; display: flex; flex-direction: column; min-height: 0; overflow: auto; }
.kiosk .t-suche { display: flex; gap: 10px; }
.kiosk .t-suche input, .kiosk input.t-gast { flex: 1; min-width: 0; height: 56px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .2); background: #0b0b0d; color: #fff; padding: 0 14px; font-size: 20px; }
.kiosk .t-suche button { padding: 0 18px; font-size: 18px; }
.kiosk .t-treffer-liste { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.kiosk .t-treffer-liste button { padding: 10px 16px; font-size: 18px; }
.kiosk .t-gewaehlt { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.kiosk .t-zeile { display: flex; align-items: center; gap: 10px; background: rgba(255, 255, 255, .05); border-radius: 10px; padding: 8px 10px; }
.kiosk .t-zeile .nr { width: 34px; height: 34px; border-radius: 50%; background: var(--rot); display: flex; align-items: center; justify-content: center; font-weight: 800; flex: none; }
.kiosk .t-zeile b { flex: 1; font-size: 20px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kiosk .t-zeile button { width: 48px; height: 44px; font-size: 18px; flex: none; }
.kiosk .t-losen { margin-top: 12px; height: 52px; font-size: 18px; }
.kiosk .t-spiele { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; overflow: auto; min-height: 0; flex: 1; }
.kiosk .t-spiele button { text-align: left; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-height: 68px; }
.kiosk .t-spiele button b { font-size: 17px; }
.kiosk .t-spiele button span { font-size: 13px; font-weight: 500; color: var(--gedimmt); }
.kiosk .t-spiele button.gew { background: rgba(var(--tv-akzent-rgb), .45); border-color: var(--rot-hell); }
.kiosk .t-spiele button.gew span { color: #eee; }
.kiosk .t-fehler { color: var(--rot-hell); font-weight: 700; margin-top: 8px; }
.kiosk .t-knoepfe { display: flex; gap: 12px; margin-top: 12px; flex: none; }
.kiosk .t-knoepfe button { height: 70px; flex: 1; font-size: 20px; }
.kiosk .t-knoepfe button.gross { flex: 2; font-size: 24px; }

.kiosk .spieler-reihe.eins { grid-template-columns: 1fr; }
.kiosk .spieler.fertig { opacity: .55; }
.kiosk .t-legs { color: var(--gold); font-size: 16px; }
.kiosk .t-ziel { text-align: center; font-size: 22px; font-weight: 800; color: var(--gold); margin-top: 4px; }
.kiosk .t-ziel.klein { font-size: 18px; margin: 0 10px 0 0; }
.kiosk .t-liste { display: flex; flex-direction: column; gap: 6px; flex: none; max-height: 62%; overflow: auto; }
.kiosk .t-sp { display: flex; align-items: center; gap: 10px; background: var(--karte); border: 2px solid var(--rand); border-radius: 12px; padding: 6px 14px; }
.kiosk .t-sp.aktiv { border-color: var(--rot); box-shadow: 0 0 18px rgba(var(--tv-akzent-rgb), .35); }
.kiosk .t-sp.fertig { opacity: .5; }
.kiosk .t-sp .t-name { flex: 1; min-width: 0; line-height: 1.2; }
.kiosk .t-sp .t-name b { font-size: 19px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kiosk .t-sp .t-name span { font-size: 12px; color: var(--gedimmt); }
.kiosk .t-sp .t-haupt { font-size: 38px; font-weight: 800; min-width: 90px; text-align: right; }
.kiosk .anzeige .t-ziel-zeile { display: block; font-size: 15px; color: var(--gold); }
.kiosk .anzeige .t-ziel-zeile b { display: inline; color: var(--gold); font-size: 20px; }
.kiosk .t-treffer { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; min-height: 0; }
.kiosk .t-treffer button { font-size: 64px; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; }
.kiosk .t-treffer button small { font-size: 15px; font-weight: 600; opacity: .8; margin-top: 6px; }
.kiosk .t-fertig { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; color: var(--gedimmt); }
.kiosk .t-auswertung { margin: 20px 0 6px; display: flex; flex-direction: column; gap: 8px; min-width: min(640px, 92vw); }
.kiosk .t-aw-zeile { display: flex; align-items: center; gap: 14px; background: var(--karte); border: 1px solid var(--rand); border-radius: 12px; padding: 10px 16px; text-align: left; }
.kiosk .t-aw-zeile.erster { border-color: var(--gold); }
.kiosk .t-aw-zeile .nr { font-weight: 800; color: var(--gold); width: 24px; }
.kiosk .t-aw-zeile b { flex: 1; font-size: 22px; }
.kiosk .t-aw-zeile span { font-size: 18px; color: #ddd; }
@media (max-width: 900px) { .kiosk .t-start { grid-template-columns: 1fr; overflow: auto; } }