/* Tafel (Beamer, Chrome): feste 1920×1080-Bühne, die auf den Bildschirm skaliert.
   Lesbar aus 6 m: Fließtext ≥ 28 px, Schlüsselzahlen ≥ 64 px, Trefferflächen ≥ 64 px. */
html,body{height:100%;overflow:hidden;background:var(--flaeche)}
.buehne{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;background:var(--grund);color:var(--text);font-size:28px;overflow:hidden}
.ansicht{position:absolute;inset:0;display:flex;flex-direction:column}
.knopf{min-height:72px;padding:12px 28px;font-size:28px}
.knopf.klein{min-height:60px;padding:8px 20px;font-size:24px}
.eyebrow{font-size:22px}
.karte{padding:24px 28px}
.chip{font-size:22px;padding:4px 16px}
.kasten{font-size:26px}
.kasten>b:first-child{font-size:20px}
h1{font-size:56px} h2{font-size:38px}
.leise.klein{font-size:22px}

/* Seitenkopf nach Vorlage, auf die Bühne vergrößert (Anmeldung, Übersicht) */
.seitenkopf{padding:20px 40px;gap:30px;flex:none}
.seitenkopf .heim{font-size:26px}
.seitenkopf .name small{font-size:20px}
.seitenkopf .name strong{font-size:40px}
.seitenkopf .schalter{gap:12px;align-items:center}

/* Anmeldung / Übersicht */
.mitte{flex:1;display:grid;place-items:center}
.anmeldung{width:900px;display:flex;flex-direction:column;gap:22px}
.anmeldung h1{font-size:64px;line-height:1.05}
.feld-gross{font:inherit;font-size:34px!important;min-height:80px!important;border:2px solid var(--linie)!important;width:100%}
.uebersicht{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:36px 80px;overflow:auto}
.uebersicht h1{font-size:56px}
.stundenliste{display:flex;flex-direction:column;gap:16px;overflow:auto;max-height:720px}
.stunde{display:flex;align-items:center;justify-content:space-between;gap:20px}
.stunde .code{font-family:var(--mono);font-size:44px;font-weight:600;letter-spacing:.12em}

/* Kopf der laufenden Stunde */
.kopf{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 40px;min-height:96px;flex:none}
.kopf .name small{font-size:20px}
.kopf .name strong{font-size:38px}
.kopf .zaehler{font-family:var(--mono);font-size:28px;font-weight:600}
.kopf .codeklein{font-family:var(--mono);font-size:34px;font-weight:600;letter-spacing:.15em;padding:4px 16px;border-radius:var(--r-klein);background:var(--fach-hell);color:var(--fach);border:1px solid var(--fach)}
.kopf .uhr{font-size:52px;line-height:1}
.netz{font-size:22px}
.haupt{flex:1;min-height:0;position:relative;padding:24px 40px;display:flex;gap:32px}

/* Regieleiste */
.regie{display:flex;align-items:center;gap:12px;padding:14px 40px;border-top:1px solid var(--linie);background:var(--karte);height:112px;flex:none}
.regie .luecke{flex:1}
.regie .knopf{white-space:nowrap;padding:10px 20px;font-size:26px;flex:none}
.regie .knopf:not(.leise):not(.zweit){min-width:300px;justify-content:center}

/* Lobby */
.lobby{display:grid;grid-template-columns:620px 1fr;gap:40px;width:100%}
.qrbox{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.qr{width:300px;height:300px;background:#fff;border-radius:var(--r);padding:12px}
.qr svg{width:100%;height:100%;display:block}
.bigcode{font-family:var(--mono);font-size:120px;font-weight:600;letter-spacing:.18em;line-height:1}
.joinurl{font-family:var(--mono);font-size:40px;font-weight:600;overflow-wrap:anywhere}
.kacheln{display:flex;flex-wrap:wrap;gap:12px;align-content:flex-start;overflow:auto;max-height:420px}
.kachel{border:1px solid var(--linie);background:var(--karte);color:var(--text);border-radius:var(--r-klein);padding:10px 18px;font-size:26px;font-weight:600;min-height:64px}
.kachel.weg{opacity:.45;border-style:dashed}
.startkachel{display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;border:1px solid var(--linie);background:var(--karte);color:var(--text);border-radius:var(--r);padding:22px 26px;box-shadow:var(--schatten);min-height:140px}
.startkachel b{font-family:var(--serif);font-weight:400;font-size:40px}
.startkachel.aktiv{background:var(--fach-hell);border-color:var(--fach);outline:2px solid var(--fach);outline-offset:-2px}
.startkachel span:last-child{font-size:24px;color:var(--leise)}

/* Modal */
.modal{position:absolute;inset:0;z-index:100;display:grid;place-items:center;background:color-mix(in srgb,var(--text) 45%,transparent)}
.modalbox{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r);padding:40px 44px;width:1100px;display:flex;flex-direction:column;gap:24px;box-shadow:var(--schatten)}
.modalbox h2{font-size:44px}
.gross{font-size:34px;line-height:1.3}
.wahl{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wahl.zeiten{grid-template-columns:repeat(7,1fr)}
.wahl button{text-align:left;color:var(--text);border:1px solid var(--linie);background:var(--karte);border-radius:var(--r-klein);padding:16px 20px;font-size:26px;min-height:80px}
.wahl.zeiten button{text-align:center}
.wahl button[aria-pressed="true"]{border-color:var(--fach);background:var(--fach-hell);font-weight:600;outline:2px solid var(--fach);outline-offset:-2px}
.wahl button small{display:block;font-size:20px;color:var(--leise);font-weight:400;margin-top:4px}

/* Proberunde */
.spalte{display:flex;flex-direction:column;gap:20px;min-width:0}
.spalte.breit{flex:1.4} .spalte.schmal{flex:1}
.zahl{font-family:var(--mono);font-size:110px;font-weight:600;line-height:1}
.zahl small{font-size:40px;color:var(--leise);font-weight:400}
.haupt .hinweis{font-size:32px}

.schritte{margin:0;padding-left:1.2em;font-size:28px;line-height:1.35;display:flex;flex-direction:column;gap:10px}

/* Wege der Gruppen */
.wege{flex:1;display:grid;gap:16px;align-content:start;min-width:0}
.gruppe{background:var(--karte);border:1px solid var(--linie);border-radius:var(--r);padding:12px 16px;display:flex;flex-direction:column;gap:6px;min-height:0;box-shadow:var(--schatten)}
.gruppe.fertig{border-color:var(--richtig);outline:2px solid var(--richtig);outline-offset:-2px}
.gruppe.weg{opacity:.55;border-style:dashed}
.gruppe .gkopf{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.gruppe .gname{font-weight:700;font-size:26px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gruppe .gpos{font-family:var(--mono);font-size:26px;font-weight:600;white-space:nowrap}
.gruppe .gstufe{font-size:22px;color:var(--leise);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gruppe .gstufe b{color:var(--text)}
.gruppe .gzahlen{display:flex;gap:16px;font-size:21px;color:var(--leise)}
.gruppe .gzahlen .viel{color:var(--falsch);font-weight:700}
.gruppe svg.baum{flex:1;min-height:0}
.seite{width:420px;flex:none;display:flex;flex-direction:column;gap:18px;min-height:0}
.rang{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:26px}
.rang li{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid var(--linie);padding-bottom:6px}
.rang li span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rang .mono{white-space:nowrap}

/* Übersicht: Hinweise × Gruppen */
.tabelle{flex:1;overflow:auto;min-width:0}
table.matrix{border-collapse:collapse;width:100%;font-size:22px;background:var(--karte)}
table.matrix th,table.matrix td{border:1px solid var(--linie);padding:8px 10px;text-align:center}
table.matrix th{background:var(--flaeche);font-weight:600}
table.matrix th.links,table.matrix td.links{text-align:left;white-space:nowrap}
table.matrix td.ok{background:var(--richtig-hell);color:var(--richtig);font-weight:700}
table.matrix td.jetzt{background:var(--fach-hell);color:var(--fach);font-weight:700;outline:2px solid var(--fach);outline-offset:-2px}
table.matrix td.viel{background:var(--falsch-hell);color:var(--falsch)}
table.matrix th.gr{writing-mode:vertical-rl;transform:rotate(180deg);height:190px;white-space:nowrap;font-size:20px}

/* Fehlerbild */
.balken-liste{display:flex;flex-direction:column;gap:12px}
.bzeile{display:grid;grid-template-columns:1fr 70px;gap:10px;align-items:center;font-size:24px}
.bzeile .bal{grid-column:1/-1;height:18px;border-radius:var(--r-rund);background:var(--flaeche);border:1px solid var(--linie);overflow:hidden}
.bzeile .bal i{display:block;height:100%;background:var(--fach)}
.bzeile b{font-family:var(--mono);text-align:right}

/* Auflösung */
.haupt.aufloesung{flex-direction:column;gap:16px}
.gruppenwahl{display:flex;flex-wrap:wrap;gap:10px;flex:none}
.aufl-unten{flex:1;min-height:0;display:flex;gap:28px}
.gruppenwahl button{text-align:left;color:var(--text);border:1px solid var(--linie);background:var(--karte);border-radius:var(--r-klein);padding:8px 16px;font-size:24px;min-height:64px;display:flex;justify-content:space-between;gap:14px}
.gruppenwahl button[aria-pressed="true"]{border-color:var(--fach);background:var(--fach-hell);font-weight:700;outline:2px solid var(--fach);outline-offset:-2px}
.aufl-baum{flex:1.7;min-width:0;display:flex;flex-direction:column;gap:14px}
.aufl-baum .karte{flex:1;min-height:0;display:flex;align-items:center}
.aufl-baum svg.baum{max-height:100%}
.aufl-liste{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px;overflow:auto}
.schrittwahl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.aufl-liste button{text-align:left;color:var(--text);border:1px solid var(--linie);background:var(--karte);border-radius:var(--r-klein);padding:10px 16px;font-size:23px;display:flex;justify-content:space-between;gap:10px;min-height:60px}
.aufl-liste button[aria-pressed="true"]{border-color:var(--fach);background:var(--fach-hell);outline:2px solid var(--fach);outline-offset:-2px}
.aufl-liste .detail{font-size:28px}
.aufl-liste .detail .hinweis{font-size:28px}
.aufl-liste .detail code.loesung{font-size:30px;display:block;padding:10px 14px;border:2px solid var(--richtig);background:var(--richtig-hell);border-radius:var(--r-klein);margin-top:8px;overflow-wrap:anywhere}

/* Pause: Impulsfrage groß oben */
.impulsband{position:absolute;left:40px;right:40px;top:20px;z-index:20;background:var(--hinweis-hell);color:var(--text);border:1px solid var(--hinweis);border-left:8px solid var(--hinweis);border-radius:var(--r);padding:26px 36px;box-shadow:var(--schatten);cursor:pointer;text-align:left;font:inherit}
.impulsband .eyebrow{color:var(--hinweis)}
.impulsband p{font-size:48px;line-height:1.2;margin:6px 0 0;font-family:var(--serif)}
.zeitum{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);z-index:15;background:var(--karte);border:3px solid var(--falsch);border-radius:var(--r);padding:30px 60px;font-size:64px;font-family:var(--serif);color:var(--falsch);box-shadow:var(--schatten)}
main.haupt{max-width:none;margin:0;width:100%}

.bzeile .impulszeile{grid-column:1/-1;font-size:22px;color:var(--leise);font-style:italic}

/* Schatzkarte der Klasse (Standardansicht der Rallye) */
.klassenkarte{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
.kk-flaeche{flex:1;min-height:0;padding:12px;position:relative}
.kk-flaeche svg{display:block;width:100%;height:100%}
.kk-grund{fill:var(--hinweis-hell)}
.kk-weg{fill:none;stroke:var(--hinweis);stroke-width:6;stroke-dasharray:16 12;stroke-linecap:round}
.kk-station{fill:var(--karte);stroke:var(--hinweis);stroke-width:4}
.kk-nr{font-family:var(--sans);font-size:30px;font-weight:700;fill:var(--hinweis)}
.kk-mehr{font-family:var(--sans);font-size:26px;font-weight:700;fill:var(--text)}
.kk-fahne line{stroke-width:3}
.kk-fahne text{font-family:var(--sans);font-size:26px;font-weight:700;fill:#fff}
.kk-fahne.weg{opacity:.45}
.kk-fahne.neu{transform-box:fill-box;transform-origin:center bottom;animation:auftauchen .7s ease-out both}
.kk-leiste{flex:none;display:flex;gap:16px}
.kk-zahl{flex:none;display:flex;align-items:baseline;gap:14px;padding:14px 28px}
.kk-zahl .eyebrow{margin-right:10px}
.kk-zahl b{font-family:var(--mono);font-size:56px;line-height:1}
.kk-info{flex:1;display:flex;align-items:baseline;gap:24px;padding:14px 28px;font-size:28px;min-width:0;overflow:hidden;white-space:nowrap}
.kk-rang{display:flex;gap:36px}