/* Schrift: Calibri, wo vorhanden. Sonst Carlito (gleiche Maße, lokal eingebunden, Lizenz SIL OFL siehe carlito-lizenz.txt) */
@font-face{font-family:Carlito;font-style:normal;font-weight:400;font-display:swap;src:local("Carlito"),url("?r=a&f=carlito-400.woff2") format("woff2")}
@font-face{font-family:Carlito;font-style:normal;font-weight:700;font-display:swap;src:local("Carlito Bold"),local("Carlito-Bold"),url("?r=a&f=carlito-700.woff2") format("woff2")}
/* HallenBuddy – gemeinsame Gestaltung für Zentrale, Verwaltung und App. Keine Inline-Styles (strikte CSP). */
:root{--bg:#f4f6f8;--karte:#fff;--ink:#1d2a36;--leise:#3b4753;--linie:#dfe4e9;--linie2:#c9d1d8;--akzent:#16795c;--akzent-d:#105c46;--akzent-h:#e7f3ee;
--side:#172a35;--side-ink:#c4d3d8;--side-hover:#223a46;--side-aktiv:#24503f;--side-aktiv-ink:#f1fff8;--side-mark:#8dd8b7;
--rot:#b42318;--rot-h:#fdecea;--gelb:#8a5a00;--gelb-h:#fff4d6;--blau:#1b5aa6;--blau-h:#e8f0fb;--radius:10px;--schatten:0 1px 2px rgba(20,30,40,.06)}
.ebene-zentrale{--akzent:#1f5fae;--akzent-d:#174a88;--akzent-h:#e8f0fb;--side:#1c3557;--side-hover:#25446c;--side-aktiv:#2c5a90;--side-mark:#a8cdfb;--side-ink:#cfdcec}
.ebene-app{--akzent:#14634c;--akzent-d:#0e4b39;--akzent-h:#e3f2ec;--side:#14634c;--side-hover:#1b7559;--side-aktiv:#0e4b39;--side-mark:#c7f0dc;--side-ink:#e3f4ec}
html{font-size:15px}html.fs-1{font-size:13px}html.fs-2{font-size:14px}html.fs-4{font-size:16.5px}html.fs-5{font-size:18px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Calibri,Carlito,"Segoe UI",Roboto,Arial,sans-serif;font-size:1rem;line-height:1.45}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--akzent-t,var(--akzent))}
h1{font-size:1.7rem;margin:0 0 .3rem;font-weight:700;letter-spacing:-.3px}
h2{font-size:1.2rem;margin:0 0 .7rem;font-weight:700}
h3{font-size:1.05rem;margin:1rem 0 .5rem;font-weight:700}
p{margin:0 0 .7rem}
.laden{padding:3rem;text-align:center;color:var(--leise)}
.leise{color:var(--leise)}.klein{font-size:.88rem}.fett{font-weight:700}.rot{color:var(--rot)}.nowrap{white-space:nowrap}.rechts{text-align:right}.mitte{text-align:center}
.versteckt{display:none!important}

/* Schaltflächen und Felder */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.4rem;padding:.45rem .9rem;border:1px solid var(--linie2);border-radius:8px;background:#fff;cursor:pointer;font-weight:600;white-space:nowrap;text-decoration:none;color:var(--ink)}
.knopf:hover{border-color:var(--akzent);background:var(--akzent-h)}
.knopf:disabled{opacity:.5;cursor:not-allowed}
.knopf.haupt{background:var(--akzent);border-color:var(--akzent);color:#fff}.knopf.haupt:hover{background:var(--akzent-d)}
.knopf.gefahr{color:var(--rot);border-color:#e8b4ae}.knopf.gefahr:hover{background:var(--rot-h);border-color:var(--rot)}
.knopf.klein{min-height:2rem;padding:.25rem .6rem;font-size:.9rem}
.knopf.text{border-color:transparent;background:transparent;padding-left:.4rem;padding-right:.4rem}.knopf.text:hover{background:var(--akzent-h)}
.knopf:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.nav-punkt:focus-visible{outline:3px solid #7fb9a3;outline-offset:2px}
.knopfreihe{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
input[type=text],input[type=password],input[type=number],input[type=date],input[type=time],input[type=search],input[type=tel],input[type=email],select,textarea{width:100%;min-height:2.4rem;padding:.4rem .6rem;border:1px solid var(--linie2);border-radius:8px;background:#fff}
textarea{min-height:5rem;resize:vertical;line-height:1.45}
input[type=checkbox],input[type=radio]{width:1.15rem;height:1.15rem;accent-color:var(--akzent);margin:0}
label.feld{display:flex;flex-direction:column;gap:.25rem;font-weight:600;font-size:.92rem}
label.feld input,label.feld select,label.feld textarea{font-weight:400}
label.feld>span.hinweis{font-weight:400;color:var(--leise);font-size:.85rem}
label.haken{display:flex;align-items:center;gap:.5rem;font-weight:400;cursor:pointer}
.raster2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.raster3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.raster4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}
.voll{grid-column:1/-1}
.formular{display:flex;flex-direction:column;gap:.8rem}
.fehlertext{color:var(--rot);font-size:.9rem;min-height:1.2em}

/* Grundaufbau mit senkrechter Leiste links */
.leiste{position:fixed;inset:0 auto 0 0;width:240px;background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;padding:1.3rem .8rem 1rem;z-index:20;overflow-y:auto}
.marke{padding:0 .7rem 1.1rem;color:#fff}
.marke .innen{width:max-content;max-width:100%}
.marke .wort{font-size:1.6rem;font-weight:800;letter-spacing:.5px;line-height:1}
.marke .wort b{color:var(--side-mark)}
.marke .unter{display:block;font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;margin-top:.35rem;color:var(--side-mark)}
/* Untertitel läuft bündig von der ersten bis zur letzten Buchstabenkante des Schriftzugs */
.marke .unter.buendig{display:flex;justify-content:space-between;letter-spacing:0;font-size:.72rem;font-weight:700;width:0;min-width:100%;white-space:nowrap}
.marke .unter.buendig .sp{flex:0 0 .45em}
.schulmarke{margin:0 .4rem 1.1rem;padding:.6rem .7rem;border:1px solid rgba(255,255,255,.14);border-radius:9px;font-size:.88rem;line-height:1.35}
.schulmarke b{display:block;color:#fff;font-size:.95rem}
.nav-gruppe{margin-top:.55rem}
.nav-titel{display:flex;align-items:center;gap:.55rem;width:100%;border:0;background:transparent;font:inherit;font-size:.8rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--side-mark);padding:.4rem .8rem;border-radius:8px;cursor:pointer;text-align:left}
.nav-titel:hover{background:var(--side-hover);color:#fff}
.nav-titel .pfeil{flex:0 0 auto;width:0;height:0;border-left:.3rem solid transparent;border-right:.3rem solid transparent;border-top:.4rem solid currentColor;transition:transform .15s}
.nav-gruppe.zu .nav-titel .pfeil{transform:rotate(-90deg)}
.nav-gruppe.zu .nav-liste{display:none}
.nav-titel .zahl{display:none;margin-left:auto;font-size:.75rem;background:rgba(255,255,255,.2);color:#fff;border-radius:10px;padding:0 .45rem;letter-spacing:0}
.nav-titel .zahl.rot{background:#c0392b}
.nav-gruppe.zu .nav-titel .zahl{display:inline-block}
.nav-punkt{display:flex;align-items:center;gap:.6rem;width:100%;border:0;background:transparent;color:var(--side-ink);padding:.36rem .8rem .36rem 1.3rem;border-radius:8px;cursor:pointer;text-align:left;font-size:.95rem}
.nav-punkt:hover{background:var(--side-hover);color:#fff}
.nav-punkt.aktiv{background:#fff;color:var(--side);font-weight:700}
.nav-punkt.aktiv .zahl{background:rgba(0,0,0,.14)}
.nav-punkt.aktiv .zahl.rot{background:#c0392b;color:#fff}
.nav-punkt .zahl{margin-left:auto;font-size:.75rem;background:rgba(255,255,255,.16);border-radius:10px;padding:0 .45rem;font-weight:700}
.nav-punkt .zahl.rot{background:#c0392b;color:#fff}
.nav-punkt .ampel{flex:0 0 auto;width:.65rem;height:.65rem;border-radius:50%;margin-left:auto;box-shadow:0 0 0 2px rgba(255,255,255,.22)}
.nav-punkt .zahl+.ampel{margin-left:.45rem}
.ampel.gruen{background:#3ecf8e}.ampel.gelb{background:#f2b705}.ampel.rot{background:#ef5350}
.nav-punkt.aktiv .ampel{box-shadow:0 0 0 2px rgba(0,0,0,.08)}
.leiste-fuss{margin-top:auto;padding:1rem .4rem 0;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:.3rem;font-size:.88rem}
.leiste-fuss .nav-punkt{padding-left:.8rem}
.leiste-fuss .ich{padding:0 .4rem .3rem;color:#fff}
.arbeitsflaeche{margin-left:240px;min-height:100vh;display:flex;flex-direction:column}
.kopf{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--linie);display:flex;align-items:center;gap:.8rem;padding:.6rem 1.6rem;min-height:3.4rem}
.kopf .pfad{font-weight:700}.kopf .pfad span{color:var(--leise);font-weight:400}
.kopf .raum{flex:1}
.menue-knopf{display:inline-flex}
.inhalt{padding:1.5rem 1.6rem 2rem;flex:1;max-width:1900px;width:100%}
/* Seitenkopf: Titel, Erklärung, darunter links die Aktionsleiste (Neu, Speichern, PDF, Drucken) */
.seitenkopf{margin-bottom:1.2rem}
.seitenkopf p{margin:0;color:var(--leise);max-width:62rem}
.aktionsleiste{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.9rem}
.aktionsleiste .trenner{width:1px;height:1.7rem;background:var(--linie2);margin:0 .35rem}
.kartenkopf{margin-bottom:.9rem}
.kartenkopf h2{margin-bottom:.3rem}
.kartenkopf p{color:var(--leise);margin:0 0 .7rem;max-width:62rem}
.kartenkopf .knopfreihe{margin-top:.6rem}
.fuss{padding:.9rem 1.6rem 1.3rem;color:var(--leise);font-size:.88rem;display:flex;flex-wrap:wrap;gap:.3rem .5rem;align-items:center;border-top:1px solid var(--linie);background:#fff}
.fuss .links{display:flex;flex-wrap:wrap;gap:.2rem}
.fuss button,.fuss a{border:0;background:none;color:var(--leise);cursor:pointer;padding:.3rem .8rem;border-radius:999px;font-size:inherit;text-decoration:none;font-weight:600}
.fuss button:hover,.fuss a:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.fuss .fusslink{color:var(--akzent-t,var(--akzent-d))}
.fuss .version{padding:.3rem .8rem;border-left:1px solid var(--linie2)}
.fuss .raum{flex:1}

/* Karten, Kacheln, Hinweise */
.karte{background:var(--karte);border:1px solid var(--linie);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:var(--schatten);margin-bottom:1rem}
.karte.eng{padding:.7rem .9rem}
.karte>h2:first-child{margin-top:0}
.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.9rem;margin-bottom:1rem}
.kachel{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:.9rem 1rem;min-height:6.2rem;display:flex;flex-direction:column;gap:.15rem}
.kachel .wert{font-size:1.8rem;font-weight:700;line-height:1.15}
.kachel .wert small{font-size:.95rem;font-weight:400;color:var(--leise)}
.kachel .titel{font-size:.85rem;color:var(--leise)}
.kachel.warn{border-color:#efc9a0;background:#fffaf2}.kachel.fehler{border-color:#ebb3ac;background:#fff6f5}
.kachel button.knopf{margin-top:auto;align-self:flex-start}
.hinweis{padding:.7rem .9rem;border-radius:8px;border:1px solid #e6dcc4;background:#fffaf0;margin-bottom:1rem}
.hinweis.rot{border-color:#ebb3ac;background:var(--rot-h);color:#7a1a12}
.hinweis.blau{border-color:#c5d8f2;background:var(--blau-h);color:#123e75}
.hinweis.gruen{border-color:#bfe0d1;background:var(--akzent-h);color:#0d4a37}
.marke-klein{display:inline-block;font-size:.75rem;font-weight:700;border-radius:5px;padding:.08rem .4rem;background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));border:1px solid transparent;vertical-align:middle}
.marke-klein.grau{background:#eef1f4;color:#3d4a56}.marke-klein.rot{background:var(--rot-h);color:var(--rot)}.marke-klein.gelb{background:var(--gelb-h);color:var(--gelb)}.marke-klein.blau{background:var(--blau-h);color:var(--blau)}
.leer{padding:1.4rem;text-align:center;color:var(--leise);border:1px dashed var(--linie2);border-radius:var(--radius);background:#fff}

/* Tabellen */
.tabelle-huelle{overflow-x:auto;border:1px solid var(--linie);border-radius:var(--radius);background:#fff;margin-bottom:1rem}
table.liste{width:100%;border-collapse:collapse;font-size:.95rem}
table.liste th,table.liste td{padding:.5rem .7rem;border-bottom:1px solid var(--linie);text-align:left;vertical-align:middle;height:2.6rem}
table.liste th{background:#f7f9fa;font-size:.85rem;color:#33414d;font-weight:700;white-space:nowrap;position:sticky;top:0}
table.liste tr:last-child td{border-bottom:0}
table.liste tr.klickbar{cursor:pointer}table.liste tr.klickbar:hover td{background:#f5faf8}
table.liste td.aktionen{white-space:nowrap;text-align:right;width:1%}
table.liste td.zahl,table.liste th.zahl{text-align:right;font-variant-numeric:tabular-nums}
table.liste tfoot td{font-weight:700;background:#f7f9fa}
.werkzeuge{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.8rem}
.werkzeuge .raum{flex:1}
.werkzeuge input[type=search]{max-width:260px}
.reiter{display:inline-flex;gap:2px;background:#e9edf0;padding:3px;border-radius:9px;flex-wrap:wrap}
.reiter button{border:0;background:transparent;padding:.35rem .75rem;border-radius:7px;cursor:pointer;font-weight:600;color:#33414d}
.reiter button.aktiv{background:#fff;color:var(--akzent-t,var(--akzent-d));box-shadow:var(--schatten)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{border:1px solid var(--linie2);background:#fff;border-radius:16px;padding:.2rem .7rem;cursor:pointer;font-size:.9rem}
.chip.an{background:var(--akzent);border-color:var(--akzent);color:#fff}

/* Sportplan */
.plan-huelle{overflow:auto;border:1px solid var(--linie);border-radius:var(--radius);background:#fff;margin-bottom:1.2rem;max-height:calc(100vh - 13rem)}
.plan-huelle.frei{max-height:none}
table.plan{border-collapse:separate;border-spacing:0;font-size:.85rem;min-width:100%}
table.plan th,table.plan td{border-right:1px solid var(--linie);border-bottom:1px solid var(--linie);padding:0}
table.plan thead th{position:sticky;top:0;background:#f3f6f8;z-index:3;padding:.35rem .4rem;font-weight:700;text-align:center;white-space:nowrap}
table.plan thead tr:nth-child(2) th{top:1.95rem;font-weight:600;font-size:.8rem}
table.plan th.std{position:sticky;left:0;z-index:2;background:#f7f9fa;width:3.4rem;min-width:3.4rem;text-align:center;font-weight:700;padding:.2rem}
table.plan thead th.std{z-index:4}
table.plan th.std small{display:block;font-weight:400;font-size:.72rem;color:var(--leise);line-height:1.1}
table.plan td.zelle{min-width:6.8rem;height:2.7rem;vertical-align:top;background:#fff;position:relative}
table.plan td.zelle.leerbar{cursor:pointer}
table.plan td.zelle.leerbar:hover{background:#f1f8f5}
table.plan td.zelle.ziel{background:#dff1e9;outline:2px dashed var(--akzent);outline-offset:-3px}
table.plan td.summe{text-align:center;font-weight:700;background:#fafbfc;min-width:3rem;vertical-align:middle}
table.plan tr.tagkopf th{background:var(--side);color:#fff;text-align:left;padding:.35rem .6rem;position:static;font-size:.95rem}
table.plan td.ausser{background:repeating-linear-gradient(45deg,#f6f7f8,#f6f7f8 6px,#eef0f2 6px,#eef0f2 12px)}
.belegung{position:relative;margin:2px;border-radius:7px;padding:.2rem .35rem;background:#e3f2ec;border:1.5px solid #6fae94;min-height:calc(100% - 4px);font-size:.82rem;line-height:1.2;cursor:pointer;overflow:hidden;box-shadow:0 1px 1px rgba(20,40,30,.18)}
.belegung b{display:block;font-size:.86rem}
.belegung .lk{color:#24453a}
.belegung.fremd{background:#eef1f5;border-color:#8795a5;color:#2f3c48}
.belegung.frei{background:repeating-linear-gradient(135deg,#f3f4f6,#f3f4f6 5px,#e6e9ec 5px,#e6e9ec 10px);border-color:#8f9aa6;color:#3b4652}
.belegung.konflikt{border-color:var(--rot);box-shadow:inset 0 0 0 1px var(--rot);background:#fdeeee}
.belegung.woche{border-style:dashed}
.belegung.markiert{box-shadow:0 0 0 3px #f2b84b}
.belegung[draggable=true]{cursor:grab}
.belegung.schiebt{opacity:.4;outline:2px dashed var(--akzent);outline-offset:-2px}
.plan-legende{display:flex;flex-wrap:wrap;gap:.8rem;font-size:.92rem;color:var(--ink);margin:-.4rem 0 1rem}
.plan-legende span{display:inline-flex;align-items:center;gap:.35rem}
.plan-legende i{display:inline-block;width:1.1rem;height:.8rem;border-radius:3px;border:1px solid #b9dccb;background:#e3f2ec}
.plan-legende i.fremd{background:#eef1f5;border-color:#cdd5de}.plan-legende i.frei{background:#e6e9ec;border-color:#cfd5db}.plan-legende i.konflikt{background:#fdeeee;border-color:var(--rot)}.plan-legende i.gekoppelt{border-left:4px solid #3b7d66}

/* Prüfung */
.pruef{display:flex;gap:.8rem;align-items:flex-start;padding:.6rem .8rem;border-bottom:1px solid var(--linie)}
.pruef:last-child{border-bottom:0}
.pruef .art{flex:0 0 auto}
.pruef .text{flex:1}
.pruef .text small{display:block;color:var(--leise)}

/* Jahreskalender */
.kalender{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.9rem}
.monat{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:.6rem .7rem}
.monat h3{margin:0 0 .4rem;font-size:.95rem}
.monat table{width:100%;border-collapse:collapse;font-size:.8rem;table-layout:fixed}
.monat th{color:#2b3640;font-weight:700;padding:.1rem 0;text-align:center}
.monat td{text-align:center;padding:0;height:1.75rem}
.monat td button{width:100%;height:1.6rem;border:0;background:transparent;border-radius:5px;cursor:pointer;font-size:.8rem}
.monat td button:hover{background:#eef4f1}
.monat td.we button{color:#33404b}
.monat td.sperr button{background:#f7d4cf;color:#6b1610;font-weight:700}
.monat td.sperr.teil button{background:#fbe8c8;color:#6a4300}
.monat td.ferien button{background:#dbe7f7;color:#173d70;font-weight:700}
.monat td.heute button{outline:2px solid var(--akzent)}
.monat td.ausser button{visibility:hidden}

/* Dialog */
dialog.fenster{border:0;border-radius:12px;padding:0;width:min(680px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);box-shadow:0 20px 60px rgba(0,0,0,.25)}
dialog.fenster.breit{width:min(980px,calc(100vw - 2rem))}
dialog.fenster::backdrop{background:rgba(15,25,35,.45)}
.fenster-kopf{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid var(--linie);position:sticky;top:0;background:#fff;z-index:2}
.fenster-kopf h2{margin:0;flex:1}
.fenster-inhalt{padding:1.1rem 1.2rem;overflow:auto}
.fenster-fuss{display:flex;gap:.5rem;justify-content:flex-end;flex-wrap:wrap;padding:.8rem 1.2rem;border-top:1px solid var(--linie);position:sticky;bottom:0;background:#fff}
.fenster-fuss .raum{flex:1}
.flaechenwahl{display:flex;flex-direction:column;gap:.5rem;max-height:14rem;overflow:auto;border:1px solid var(--linie);border-radius:8px;padding:.6rem}
.flaechenwahl .gruppe{display:flex;flex-wrap:wrap;gap:.3rem .9rem;align-items:center}
.flaechenwahl .gruppe b{width:100%;font-size:.85rem}
.kopierfeld{display:flex;gap:.4rem;align-items:center}
.kopierfeld code,.kopierfeld a{flex:1;min-width:0;overflow-wrap:anywhere;background:#f3f6f8;border:1px solid var(--linie);border-radius:7px;padding:.45rem .6rem;font-size:1.05rem;letter-spacing:.5px;user-select:all}
.kopierfeld a{color:var(--akzent-t,var(--akzent-d));font-weight:600;letter-spacing:0;text-decoration:none}.kopierfeld a:hover{text-decoration:underline}
.text-ansicht h3{margin-top:1.1rem}
.text-ansicht p{white-space:pre-line}

/* Anmeldung */
.anmeldung{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:var(--side)}
.anmeldung .karte{width:min(420px,100%);padding:1.6rem 1.6rem 1.2rem}
.anmeldung .marke{color:var(--ink);padding:0 0 1rem}
.anmeldung .marke .wort b{color:var(--akzent-t,var(--akzent))}
.anmeldung .marke .unter{color:var(--akzent-t,var(--akzent))}
.anmeldung .fusszeile{margin-top:1.1rem;padding-top:.7rem;border-top:1px solid var(--linie);font-size:.85rem;color:var(--leise);display:flex;gap:.2rem;flex-wrap:wrap;align-items:center}
.anmeldung .fusszeile button,.anmeldung .fusszeile a{border:0;background:none;color:var(--leise);cursor:pointer;text-decoration:none;padding:.25rem .65rem;border-radius:999px;font-size:inherit;font-weight:600}
.anmeldung .fusszeile button:hover,.anmeldung .fusszeile a:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.anmeldung .fusszeile .raum{flex:1}

/* Meldung unten */
.toast{position:fixed;left:50%;bottom:1.2rem;transform:translateX(-50%);display:flex;align-items:flex-start;gap:.65rem;background:#14684f;color:#fff;padding:.65rem .6rem .65rem .8rem;border-radius:10px;z-index:100;max-width:min(560px,calc(100vw - 2rem));box-shadow:0 8px 30px rgba(0,0,0,.25);font-weight:600;animation:hb-toast .22s ease-out}
.toast.fehler{background:#a8261b}
.toast.warn{background:var(--gelb-h);color:#5c3d00;border:1px solid #e3c36a}
.toast.info{background:var(--blau)}
.toast-icon{flex:0 0 auto;display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:rgba(255,255,255,.22)}
.toast.warn .toast-icon{background:#f2b705;color:#3d2800}
.toast-icon svg{width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.toast-text{flex:1;min-width:0;padding-top:.1rem;overflow-wrap:anywhere}
.toast-zu{flex:0 0 auto;border:0;background:transparent;color:inherit;opacity:.75;cursor:pointer;width:1.6rem;height:1.6rem;border-radius:6px;display:inline-grid;place-items:center;padding:0}
.toast-zu:hover,.toast-zu:focus-visible{opacity:1;background:rgba(255,255,255,.2)}
.toast.warn .toast-zu:hover{background:rgba(0,0,0,.08)}
.toast-zu svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
@keyframes hb-toast{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}

/* Schriftgröße als Auswahl-Blasen */
.pillen{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.pille{border:1px solid var(--linie2);background:#fff;border-radius:999px;padding:.4rem 1.1rem;cursor:pointer;font-weight:600;line-height:1.2;color:var(--ink)}
.pille:hover{border-color:var(--akzent);background:var(--akzent-h)}
.pille.an{background:var(--akzent);border-color:var(--akzent);color:#fff}
.pille.s1{font-size:.78rem}.pille.s2{font-size:.88rem}.pille.s3{font-size:1rem}.pille.s4{font-size:1.15rem}.pille.s5{font-size:1.3rem}

/* Symbolknöpfe in Tabellenzeilen: Bearbeiten, Kopieren, Löschen */
.icon-knopf{display:inline-flex;align-items:center;justify-content:center;width:2.1rem;height:2.1rem;border:1px solid transparent;border-radius:8px;background:transparent;cursor:pointer;color:var(--leise);padding:0}
.icon-knopf svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-knopf:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));border-color:var(--akzent)}
.icon-knopf.gefahr:hover{background:var(--rot-h);color:var(--rot);border-color:var(--rot)}
.icon-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
table.liste td.zeilenaktionen{white-space:nowrap;text-align:right;width:1%;padding-top:0;padding-bottom:0}
table.liste td.zeilenaktionen .icon-knopf{opacity:.45}
table.liste tr:hover td.zeilenaktionen .icon-knopf,table.liste tr:focus-within td.zeilenaktionen .icon-knopf{opacity:1}
@media (hover:none){table.liste td.zeilenaktionen .icon-knopf{opacity:1}}
table.liste tbody tr:hover td{background:#f6faf8}
table.liste td small.zeile2{display:block;color:var(--leise);font-weight:400;font-size:.82rem}
table.schluessel th{width:11rem;text-align:left;background:#f7f9fa;font-size:.85rem;color:#33414d;padding:.5rem .7rem;border-bottom:1px solid var(--linie);vertical-align:middle}
table.schluessel td{padding:.5rem .7rem;border-bottom:1px solid var(--linie)}
table.schluessel tr:last-child th,table.schluessel tr:last-child td{border-bottom:0}

/* Aufklappbereiche und Vorschau der Datenschutzerklärung */
details.klapp{border:1px solid var(--linie);border-radius:var(--radius);background:#fff;margin-bottom:1rem;box-shadow:var(--schatten)}
details.klapp>summary{padding:.8rem 1.2rem;cursor:pointer;font-weight:700;font-size:1.05rem}
details.klapp>.klapp-inhalt{padding:0 1.2rem 1.1rem}
.vorschau-text h3{margin-top:1.1rem}
.vorschau-text p{white-space:pre-line}
.vorschau-text mark{background:#fff0b3;color:inherit;border-radius:3px;padding:0 .2em;box-decoration-break:clone}
.vorschau-kopf{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;margin-bottom:.4rem;color:var(--leise);font-size:.88rem}
.vorschau-kopf mark{background:#fff0b3;border-radius:3px;padding:0 .3em;color:var(--ink)}
.erklaerung{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.9rem;margin-bottom:1rem}
.erklaerung .karte{margin:0}
.erklaerung h3{margin:0 0 .3rem}
.erklaerung p{margin:0;color:#33414d}

/* Druck: eigene Kopf- und Fußzeile */
.druckkopf,.druckfuss{display:none}
@media print{
  @page{size:A4 landscape;margin:10mm}
  body{background:#fff;font-size:10pt}
  .leiste,.kopf,.fuss,.werkzeuge,.knopfreihe,.aktionsleiste,.nicht-drucken,.seitenkopf,.kartenkopf .knopfreihe,.plan-legende .knopf,.toast,dialog,.knopf,.icon-knopf,.zeilenaktionen,table.liste td.aktionen,.pruef .knopf{display:none!important}
  details.klapp:not([open])>.klapp-inhalt{display:none}
  textarea{border:0;resize:none;padding:0}
  .arbeitsflaeche{margin:0}
  .inhalt{padding:0;max-width:none}
  .druckkopf{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid #1d2a36;padding-bottom:4mm;margin-bottom:4mm}
  .druckkopf b{font-size:14pt}
  .druckfuss{display:block;margin-top:5mm;padding-top:2mm;border-top:1px solid #999;font-size:8pt;color:#333}
  .karte,.tabelle-huelle,.plan-huelle{box-shadow:none;border-color:#999;max-height:none;overflow:visible}
  .plan-huelle{page-break-inside:auto}
  table.plan{font-size:7.5pt}
  table.plan td.zelle{min-width:0;height:auto}
  table.plan thead th{position:static}
  table.plan th.std{position:static}
  .belegung{border-color:#888!important;box-shadow:none!important}
  .tag-block{page-break-after:always}
  .tag-block:last-child{page-break-after:auto}
  .monat{page-break-inside:avoid}
  a{color:#000;text-decoration:none}
}

/* Kleine Bildschirme */
@media (max-width:900px){
  .leiste{transform:translateX(-100%);transition:transform .2s;box-shadow:0 0 40px rgba(0,0,0,.3)}
  body.menue-offen .leiste{transform:none}
  .arbeitsflaeche{margin-left:0}
  .menue-knopf{display:inline-flex}
  .kopf{padding:.5rem 1rem}
  .inhalt{padding:1rem}
  .raster3,.raster4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plan-huelle{max-height:none}
}
@media (max-width:560px){
  .raster2,.raster3,.raster4{grid-template-columns:1fr}
  h1{font-size:1.4rem}
  .kacheln{grid-template-columns:1fr 1fr}
  .kopf .pfad .krume:not(.hier),.kopf .pfad .trenn{display:none}
}
.bild-vorschau{display:block;max-width:min(320px,100%);max-height:200px;border-radius:8px;border:1px solid var(--linie);margin:.3rem 0 .6rem;object-fit:cover}
.staette-karte{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:start}
@media (max-width:560px){.staette-karte{grid-template-columns:1fr}}
table.schluessel{width:100%;border-collapse:collapse;font-size:.95rem}

/* Sportplan: Kacheln, Überlappungen, Zielvorschau, Werkzeuge */
.belegung.segment{margin-top:0;margin-bottom:0;border-radius:0;min-height:100%}
.belegung.segment.erste{margin-top:2px;border-radius:7px 7px 0 0}
.belegung.segment.letzte{margin-bottom:2px;border-radius:0 0 7px 7px}
.belegung.segment.erste.letzte{border-radius:7px}
.belegung.segment:not(.erste){border-top-color:transparent}
.belegung.segment:not(.letzte){border-bottom-color:transparent}
.stapel{display:flex;align-items:stretch;min-height:100%;height:100%}
.stapel>.belegung,.stapel>.leerplatz{flex:1 1 0;min-width:0}
.stapel.mehrere>.belegung{font-size:.74rem}
.kachelwerkzeuge{position:absolute;top:1px;right:1px;display:inline-flex;opacity:.8;gap:1px;background:rgba(255,255,255,.92);border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.belegung:hover>.kachelwerkzeuge,.belegung:focus-within>.kachelwerkzeuge{opacity:1}
.plan-huelle.kompakt .kachelwerkzeuge{display:none}
.plan-huelle.kompakt .belegung:hover>.kachelwerkzeuge{display:inline-flex}
.kachelwerkzeuge .icon-knopf{width:1.45rem;height:1.45rem;border-radius:5px;color:#33414d}
.kachelwerkzeuge .icon-knopf svg{width:.95rem;height:.95rem}
@media (hover:none){.kachelwerkzeuge{display:inline-flex}}
table.plan td.zelle.ziel{background:#cfeee0;outline:3px solid var(--akzent);outline-offset:-3px}
table.plan td.zelle.ziel-konflikt{background:#fbe0dc;outline:3px solid #d9534f;outline-offset:-3px}
table.plan td.zelle.ziel-aus{background:#eceff1;outline:3px dashed #8b97a3;outline-offset:-3px}
table.plan td.zelle.ziel .belegung,table.plan td.zelle.ziel-konflikt .belegung{opacity:.55}
.belegung.markiert{animation:hb-blink 1.1s ease-in-out 3}
@keyframes hb-blink{50%{box-shadow:0 0 0 5px #f2b84b}}
.plan-huelle.kompakt table.plan{font-size:.7rem;table-layout:fixed;width:100%}
.plan-huelle.kompakt table.plan td.zelle{overflow:hidden}
.plan-huelle.kompakt .belegung{overflow:hidden;word-break:break-word;hyphens:auto}
.plan-huelle.kompakt table.plan td.zelle{min-width:2.1rem;height:2.2rem}
.plan-huelle.kompakt table.plan thead th{padding:.2rem .15rem;font-size:.68rem}
.plan-huelle.kompakt table.plan th.std{width:1.9rem;min-width:1.9rem}
.plan-huelle.kompakt table.plan th.std small{display:none}
.plan-huelle.kompakt .belegung{padding:.1rem .2rem;font-size:.68rem}
.plan-huelle.kompakt .belegung .lk{display:none}
.tage-reihe{display:flex;flex-wrap:wrap;gap:.8rem .6rem;align-items:flex-start}
.tage-reihe>.tag-block{flex:1 1 0;min-width:0}
.tage-reihe .plan-huelle{margin-bottom:0}
.tag-block h2{margin:.2rem 0 .4rem}

/* Ablage */
.ablage{border:1px dashed #8aa89b;border-radius:var(--radius);background:#f7fbf9;margin-bottom:1rem}
.ablage>summary{cursor:pointer;padding:.55rem .9rem;font-weight:700;display:flex;gap:.6rem;align-items:center}
.ablage>summary .zahl{font-weight:600;color:var(--leise)}
.ablage .ablage-inhalt{padding:.2rem .9rem .8rem}
.ablage.ziel{background:#dff1e9;border-color:var(--akzent);border-style:solid}
.ablage .ablage-werkzeug{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.6rem}
.ablage-chips{display:flex;flex-wrap:wrap;gap:.5rem;min-height:2.6rem}
.ablage-chip{position:relative;display:flex;align-items:center;gap:.3rem;border:1.5px solid #6fae94;background:#e3f2ec;border-radius:8px;padding:.25rem .3rem .25rem .55rem;font-size:.82rem;cursor:grab;max-width:19rem}
.ablage-chip.fremd{background:#eef1f5;border-color:#8795a5}
.ablage-chip small{display:block;color:var(--leise);font-size:.74rem}
.ablage-chip .icon-knopf{width:1.5rem;height:1.5rem}
.ablage-leer{color:var(--leise);font-size:.9rem;align-self:center}

/* Hilfe im Sportplan */
.infobox{border:1px solid #c5d8f2;background:var(--blau-h);color:#123e75;border-radius:var(--radius);padding:.7rem 1rem;margin-bottom:1rem;display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap}
.infobox ul{margin:0;padding-left:1.1rem;flex:1 1 30rem;columns:2 22rem;column-gap:2rem}
.infobox li{margin:.1rem 0;break-inside:avoid}
.faq details{border-bottom:1px solid var(--linie);padding:.5rem 0}
.faq summary{cursor:pointer;font-weight:700}
.faq p{margin:.4rem 0 .2rem}

/* Planprüfung */
.pruef{align-items:center;border-radius:6px}
.pruef.sprung{cursor:pointer}
.pruef.sprung:hover,.pruef.sprung:focus-visible{background:#f1f8f5;box-shadow:inset 3px 0 0 var(--akzent)}
.pruef .art{flex:0 0 10.5rem}
.pruef .text{flex:1;min-width:0}

/* Jahreskalender */
.kalender{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1300px){.kalender{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.kalender{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kalender{grid-template-columns:1fr}}
.monat h3{margin:0 0 .4rem;font-size:.95rem}
.monat .monatsname{border:0;background:transparent;font:inherit;font-weight:700;cursor:pointer;padding:.1rem .3rem;border-radius:6px}
.monat .monatsname:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.monat.aktiv{border-color:var(--akzent);box-shadow:0 0 0 2px #bfe0d1}
.monat td.we{background:#dfe5ea}
.monat td.feiertag button{background:#e9dcf5;color:#43206b;font-weight:700}
.monat td.ferien button{background:#dbe7f7;color:#173d70;font-weight:700}
.monat td.we.ferien button,.monat td.we.feiertag button{font-weight:700}
.kal-legende{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;font-size:.92rem;color:var(--ink);margin:-.3rem 0 .9rem}
.kal-legende i{display:inline-block;width:1rem;height:.8rem;border-radius:3px;margin-right:.3rem;vertical-align:-1px;border:1px solid #c9d0d6}
.kal-legende i.we{background:#dfe5ea}.kal-legende i.ft{background:#e9dcf5}.kal-legende i.fe{background:#dbe7f7}.kal-legende i.sp{background:#f7d4cf}.kal-legende i.tl{background:#fbe8c8}
.monatsdetail td.we-zeile,.monatsdetail tr.we-zeile td{background:#e9edf1}

/* Protokoll als Text */
.protokolltext p{display:grid;grid-template-columns:10.5rem 9rem minmax(0,1fr);gap:.8rem;margin:0;padding:.3rem .2rem;border-bottom:1px solid #eef1f3;font-size:.92rem}
.protokolltext .zeit{color:var(--leise);font-variant-numeric:tabular-nums;white-space:nowrap}
.protokolltext .wer{font-weight:600}

/* Knopfgitter: gleich breite Knöpfe, nach Themen gruppiert */
.knopfgruppe{margin:.9rem 0 .3rem;font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--leise)}
.knopfgitter{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.5rem}
.knopfgitter .knopf{width:100%;justify-content:center;text-align:center}
.adresszeile{display:flex;align-items:center;gap:.4rem;padding:.35rem .2rem;border-bottom:1px solid var(--linie)}
.adresszeile:last-child{border-bottom:0}
.adresszeile b{flex:0 0 7rem}
.adresszeile a{flex:1;min-width:0;overflow-wrap:anywhere}
.feldreihe{display:flex;gap:.6rem;align-items:flex-end}
.feldreihe label.feld{flex:1}
.feldreihe .knopf{height:2.4rem}
@media print{.kachelwerkzeuge,.ablage,.infobox,.tage-reihe .plan-huelle{box-shadow:none}.ablage,.infobox{display:none!important}.tage-reihe{display:block}.tage-reihe .tag-block{page-break-after:always}.protokolltext p{page-break-inside:avoid}}

@media print{
  body.druck-dialog #app{display:none!important}
  body.druck-dialog dialog.druck-dran{display:block!important;position:static!important;width:auto!important;max-height:none!important;box-shadow:none!important;border:0!important;overflow:visible!important}
  body.druck-dialog dialog.druck-dran .fenster-inhalt{max-height:none!important;overflow:visible!important}
  body.druck-dialog dialog.druck-dran .fenster-fuss,body.druck-dialog dialog.druck-dran .fenster-kopf .knopf{display:none!important}
}
.ablage>summary svg,.infobox svg{width:1.25rem;height:1.25rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ablage>summary{list-style:none}
.ablage>summary::-webkit-details-marker{display:none}
.ablage-werkzeug select{width:auto;min-width:11rem;max-width:26rem}
.ablage-werkzeug .fett{font-weight:700}
.ablage-chip svg{width:1rem;height:1rem}

/* Sportstätten-Schalter ohne Sperrtermine ausgegraut, Hinweise besser lesbar */
.chip.leer{background:#e6eaee;border-style:dashed;border-color:#8d99a5;color:#3f4b57}
.chip.leer.an{background:var(--akzent);border-style:solid;border-color:var(--akzent);color:#fff}
.chip-hinweis{margin:.1rem 0 .8rem;font-size:.92rem;color:var(--ink)}
.konfliktband ul{margin:.3rem 0 .6rem;padding-left:1.2rem}
.konfliktband b{font-size:1.02rem}
.hinweis{color:#2c3a46}

/* ===== Runde 2026.1.6 ===== */
/* Menü: Sportplan als zentraler Punkt, Symbole */
.nav-punkt svg{width:1.15rem;height:1.15rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.nav-punkt .txt{flex:1 1 auto;min-width:0}
.nav-punkt{padding-left:.9rem}
.nav-gruppe.ohne-titel{margin-top:.2rem;margin-bottom:.35rem}
.nav-punkt.gross{font-size:1.1rem;font-weight:700;padding:.65rem .9rem;background:rgba(255,255,255,.1);border-left:4px solid var(--side-mark);color:#fff;letter-spacing:.2px}
.nav-punkt.gross svg{width:1.45rem;height:1.45rem;stroke-width:2}
.nav-punkt.gross:hover{background:var(--side-hover)}
.nav-punkt.gross.aktiv{background:#fff;color:var(--side);border-left-color:var(--akzent)}
.nav-punkt.aktiv svg{opacity:1}
.leiste-fuss .nav-punkt{padding-left:.9rem}

/* Planvarianten als Reiter im Sportplan */
.reiter.planwahl button{display:inline-flex;align-items:center;gap:.4rem}
.reiter.planwahl .punkt{width:.6rem;height:.6rem;border-radius:50%;background:#aab4bd;display:inline-block}
.reiter.planwahl .punkt.an{background:var(--akzent)}
.reiter.planwahl small{font-size:.72rem;font-weight:700;background:var(--gelb-h);color:var(--gelb);border-radius:4px;padding:0 .3rem}
.reiter.klein button{padding:.2rem .6rem;font-size:.9rem}
.knopfpaar{display:inline-flex;gap:0}
.knopfpaar .knopf:first-child{border-top-right-radius:0;border-bottom-right-radius:0}
.knopfpaar .knopf:last-child{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}

/* Sportplan: Summe SuS, Tagessumme, leere Zellen */
table.plan td.summe{background:#e8f0fb;color:#0f3a73;font-size:1.05rem;border-left:2px solid #9bb8e0}
table.plan thead th.summe-kopf{background:#d6e4f8;color:#0f3a73;border-left:2px solid #9bb8e0}
table.plan tfoot td,table.plan tfoot th{position:sticky;bottom:0;z-index:2;background:#d6e4f8;color:#0f3a73;font-weight:700;border-top:2px solid #6f95c9;padding:.45rem .6rem;text-align:left}
table.plan tfoot th.std{left:0;text-align:center;z-index:3}
table.plan tfoot td small{display:block;font-weight:400;color:#274a7a;font-size:.78rem}
table.plan tfoot td.summe{text-align:center;font-size:1.25rem;border-left:2px solid #6f95c9}
table.plan td.zelle.leerbar:hover{background:#dbe8fb;outline:2px solid #3a74c4;outline-offset:-3px}
table.plan td.zelle.leerbar:hover::after{content:"+ Neuer Eintrag";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:.82rem;color:#123e75;pointer-events:none}
.belegung .sus{font-weight:800;color:#0f3a73}
.tagblock-summe{display:inline-block;margin-left:.8rem;font-size:.9rem;font-weight:700;color:#0f3a73;background:#d6e4f8;border-radius:6px;padding:.05rem .5rem}
.tag-block h2{display:flex;align-items:center;flex-wrap:wrap}

/* Stundenkorb */
.ablage.korb{border-style:solid;border-color:#8aa89b;background:#f4faf7}
.ablage.korb.angeheftet{position:sticky;top:0;z-index:30;box-shadow:0 6px 16px rgba(20,40,30,.18)}
.ablage.korb>summary .zahl{font-weight:600}
.korb-werkzeug{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.6rem}
.korb-werkzeug .raum{flex:1}
.korb-werkzeug input[type=search]{width:12rem}
.korb-scroll{overflow:auto;max-height:min(42vh,24rem);padding-bottom:.3rem}
.korb-reihe{display:flex;gap:1.1rem;align-items:flex-start;min-width:min-content}
.korb-abschnitt{flex:0 0 auto;background:#fff;border:1px solid var(--linie);border-radius:10px;padding:.5rem .6rem .7rem}
.korb-abschnitt h3{margin:0 0 .45rem;font-size:1rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem}
.korb-abschnitt h3 small{font-weight:600;color:var(--leise);font-size:.8rem}
.korb-teil+.korb-teil{margin-top:.6rem;padding-top:.5rem;border-top:1px dashed var(--linie2)}
.korb-teiltitel{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--leise);margin-bottom:.3rem}
.korb-kacheln{display:grid;grid-template-columns:6.4rem;gap:.45rem}
.korb-kacheln.zwei{grid-template-columns:repeat(2,6.4rem)}
.korb-kacheln.drei{grid-template-columns:repeat(3,6.4rem)}
.korb-kachel{display:flex;flex-direction:column;gap:.15rem;min-height:7.6rem;padding:.4rem .45rem;border:1.5px solid #6fae94;border-radius:8px;background:#e3f2ec;cursor:grab;font-size:.82rem;line-height:1.2;box-shadow:0 1px 2px rgba(20,40,30,.2);user-select:none}
.korb-kachel:hover{border-color:var(--akzent);box-shadow:0 2px 6px rgba(20,40,30,.3)}
.korb-kachel.zieht{opacity:.4}
.korb-kachel .t{font-size:.95rem;word-break:break-word}
.korb-kachel .u{color:#24453a;font-size:.78rem;word-break:break-word}
.korb-kachel .sus{margin-top:auto;color:#0f3a73}
.korb-kachel .w{font-size:.72rem;color:var(--leise);border-top:1px solid rgba(0,0,0,.12);padding-top:.15rem}
.korb-kachel .w.offen{color:#7a4a00;font-weight:700}
.korb-kachel.offen{border-style:dashed;background:#fff;border-color:#3a74c4}
.korb-kachel.schiene{border-left:5px solid #3b7d66}
.korb-kachel.fremd{background:#eef1f5;border-color:#8795a5}
.korb-leer{padding:1rem;color:var(--leise);max-width:42rem}
.korb-vorschau p{margin:0}
.korb-seite{display:flex;flex-direction:column;height:100vh;padding:.8rem 1rem;gap:.5rem;background:var(--bg)}
.korb-seite.ziel{background:#dff1e9;outline:3px solid var(--akzent);outline-offset:-3px}
.korb-seite .korb-scroll{flex:1 1 auto;max-height:none}
.korb-kopf{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center}
.korb-kopf .marke-klein-wort{font-weight:800;color:var(--akzent-t,var(--akzent-d))}
.korb-kopf .korb-name{width:16rem;font-weight:700;font-size:1.1rem}
.korb-fuss{padding-top:.3rem;border-top:1px solid var(--linie)}
body.korbfenster .fuss,body.korbfenster .toast.leer{display:none}

/* Dialoge mit fester Höhe (Hilfe): kein Springen beim Suchen */
dialog.fenster.hoch[open]{display:flex;flex-direction:column;height:min(84vh,46rem)}
dialog.fenster.hoch .fenster-inhalt{flex:1 1 auto;min-height:0;overflow:auto}
.hilfe-kopf{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:.8rem;position:sticky;top:-1.1rem;background:#fff;padding:.3rem 0;z-index:1}
.hilfe-kopf input[type=search]{flex:1 1 16rem;max-width:26rem}
.hilfe .faq h3{margin:1rem 0 .3rem;color:var(--akzent-t,var(--akzent-d))}
.faq summary:hover{color:var(--akzent-t,var(--akzent-d))}

/* Planvarianten */
.plan-abschnitt{margin-bottom:1.6rem}
.plan-abschnitt>h2{display:flex;align-items:baseline;gap:.7rem}
.plan-abschnitt>h2 small{font-weight:400;color:var(--leise);font-size:.9rem}
.schalter{display:inline-flex;align-items:center;gap:.5rem;border:0;background:transparent;cursor:pointer;font-weight:700;padding:.15rem}
.schalter .bahn{position:relative;width:2.6rem;height:1.4rem;border-radius:1rem;background:#aab4bd;transition:background .15s}
.schalter .bahn::after{content:"";position:absolute;top:.15rem;left:.15rem;width:1.1rem;height:1.1rem;border-radius:50%;background:#fff;transition:left .15s}
.schalter.an .bahn{background:var(--akzent)}
.schalter.an .bahn::after{left:1.35rem}
.schalter .st{min-width:3.9rem;text-align:left;color:var(--leise)}
.schalter.an .st{color:var(--akzent-t,var(--akzent-d))}
.zeitraum-fehlt{color:var(--rot);font-weight:700}
.plan-anlass{display:block;color:var(--leise);font-size:.85rem;font-weight:400}
tr.inaktiv td{color:#3b4753}

/* Ferien: Mehrfachauswahl */
.massenleiste{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;padding:.5rem .8rem;margin-bottom:.6rem;background:#eef3f8;border:1px solid #c5d8f2;border-radius:8px}
.massenleiste .raum{flex:1}
th.auswahl,td.auswahl{width:2.4rem;text-align:center}

/* Übersicht */
.balken{height:.65rem;background:#dde3e8;border-radius:6px;overflow:hidden}
.balken>i{display:block;height:100%;background:var(--akzent);border-radius:6px}
.balken.warn>i{background:#d38b2c}.balken.voll>i{background:#2c9a6e}
.stand{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem 1.4rem}
.stand-zeile{display:flex;flex-direction:column;gap:.25rem}
.stand-zeile .zk{display:flex;justify-content:space-between;gap:.5rem;font-size:.92rem}
.stand-zeile .zk b{font-weight:700}
.stand-gross{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;margin-bottom:1rem}
.stand-gross .zahl-gross{font-size:2.4rem;font-weight:800;line-height:1;color:var(--akzent-t,var(--akzent-d))}
.stand-gross .balken{flex:1 1 16rem;height:.9rem}

/* Statusampel und Vorschau (Zentrale) */
.ampel{display:inline-flex;align-items:center;gap:.5rem;font-weight:600}
.ampel i{width:1rem;height:1rem;border-radius:50%;background:#aab4bd;display:inline-block;box-shadow:inset 0 0 0 2px rgba(0,0,0,.12)}
.ampel.gruen i{background:#2c9a6e}.ampel.gelb i{background:#e2a400}.ampel.rot i{background:#c0392b}
.ampel.gruen{color:#0d4a37}.ampel.gelb{color:#6d4a00}.ampel.rot{color:#7a1a12}
.vorschau-box{margin-top:.5rem;padding:.6rem .8rem;border:1px dashed var(--linie2);border-radius:8px;background:#fafbfc}
.vorschau-box .titel{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--leise);margin-bottom:.3rem}
.uebernommen,mark.uebernommen{background:#fff3b0;border-radius:3px;padding:0 .1rem}
p.uebernommen{padding:.1rem .3rem}
.fenster-inhalt p,.rechtvorschau p{line-height:1.5;margin:0 0 .7rem}
.rechtvorschau h3{margin:1rem 0 .3rem}
.rechtvorschau{white-space:normal}
.rechtvorschau p,.fenster-inhalt .rechtvorschau p{white-space:pre-line}

.fusszeile-vorschau{font-weight:600;word-spacing:.1rem}
.fusszeile-vorschau u{color:var(--akzent-t,var(--akzent))}


/* ===== Runde 2026.1.7 ===== */
/* Menü: Oberpunkte, Unterpunkte und Bereiche deutlich getrennt, einklappbar */
.nav-gruppe{margin-top:.9rem;padding-top:.65rem;border-top:1px solid rgba(255,255,255,.18)}
.nav-gruppe.ohne-titel{margin-top:.2rem;padding-top:0;border-top:0}
.nav-titel{color:#fff;font-size:.8rem;font-weight:800;letter-spacing:1.5px;padding:.4rem .7rem;background:rgba(255,255,255,.07)}
.nav-titel .pfeil{border-top-color:var(--side-mark)}
.nav-liste{margin:.25rem 0 0 .7rem;padding-left:.3rem;border-left:2px solid rgba(255,255,255,.18)}
.nav-gruppe.ohne-titel .nav-liste{margin-left:0;padding-left:0;border-left:0}
.nav-unter{padding:.6rem .7rem .15rem;font-size:.72rem;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:rgba(255,255,255,.55)}
.nav-unter:first-child{padding-top:.2rem}
.marke-mini{display:none;text-align:center;font-size:1.5rem;font-weight:800;color:#fff;margin:.1rem 0 .8rem}
.marke-mini b{color:var(--side-mark)}
.menue-knopf svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:901px){
  .leiste,.arbeitsflaeche{transition:width .18s,margin-left .18s}
  body.leiste-zu .leiste{width:68px;padding:1rem .45rem}
  body.leiste-zu .arbeitsflaeche{margin-left:68px}
  body.leiste-zu .marke,body.leiste-zu .schulmarke,body.leiste-zu .leiste-fuss .ich,body.leiste-zu .nav-unter,body.leiste-zu .nav-titel,body.leiste-zu .nav-punkt .txt{display:none}
  body.leiste-zu .marke-mini{display:block}
  body.leiste-zu .nav-gruppe{margin-top:.5rem;padding-top:.5rem}
  body.leiste-zu .nav-gruppe.zu .nav-liste{display:block}
  body.leiste-zu .nav-liste{margin-left:0;padding-left:0;border-left:0}
  body.leiste-zu .nav-punkt,body.leiste-zu .nav-punkt.gross{justify-content:center;padding:.65rem 0;position:relative;border-left-width:0}
  body.leiste-zu .nav-punkt .zahl{position:absolute;top:1px;right:3px;font-size:.62rem;padding:0 .3rem;margin:0}
  body.leiste-zu .nav-punkt .ampel{position:absolute;right:.7rem;bottom:.55rem;margin:0;width:.55rem;height:.55rem}
  body.leiste-zu .leiste-fuss{padding:.8rem 0 0}
}

/* Kopfzeile: Standort und Schuljahr */
.kopf .pfad{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .5rem;font-size:1.02rem}
.kopf .pfad .krume{font-weight:600;color:var(--leise)}
.kopf .pfad .krume.hier{font-weight:800;color:var(--ink)}
.kopf .pfad .trenn{color:#8a97a3;font-weight:400}
.schuljahr-chip{display:inline-flex;align-items:center;gap:.5rem;background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));border:1.5px solid var(--akzent);border-radius:999px;padding:.25rem .9rem .25rem .7rem;font-size:.92rem;font-weight:600;white-space:nowrap}
.schuljahr-chip svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.schuljahr-chip b{font-size:1.08rem;font-weight:800;letter-spacing:.2px}

/* Quickinfo */
.hb-tip{position:fixed;left:0;top:0;z-index:10000;max-width:min(24rem,calc(100vw - 12px));background:#1c2a35;color:#fff;font-size:.82rem;line-height:1.35;padding:.32rem .6rem;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.35);pointer-events:none;white-space:pre-line;opacity:0;visibility:hidden;transition:opacity .1s}
.hb-tip.an{opacity:1;visibility:visible}

/* Sortierbare Tabellen */
th.sortierbar{cursor:pointer;user-select:none}
th.sortierbar::after{content:"\2195";margin-left:.4rem;opacity:.3;font-size:.85em}
th.sortierbar:hover{background:#eef3f1}
th.sortierbar:hover::after{opacity:.75}
th.sortierbar[aria-sort]{background:#e4f1ec}
th.sortierbar[aria-sort=ascending]::after{content:"\25B2";opacity:1;color:var(--akzent-t,var(--akzent-d))}
th.sortierbar[aria-sort=descending]::after{content:"\25BC";opacity:1;color:var(--akzent-t,var(--akzent-d))}
th.sortierbar:focus-visible{outline:3px solid #7fb9a3;outline-offset:-3px}
td.wdh{color:#6b7783;font-weight:400}

/* PDF speichern und Drucken: dezent in der Fußzeile */
.fuss .druck-slot{display:inline-flex;align-items:center;flex-wrap:wrap;margin-left:.4rem;padding-left:.8rem;border-left:1px solid var(--linie2)}
.fuss .druck-slot:empty{display:none}
.fuss .druck-label{font-size:.8rem;margin-right:.2rem}
.fuss .druck-slot .knopf{min-height:0;border:0;background:none;box-shadow:none;padding:.3rem .7rem;font-size:inherit;font-weight:600;color:var(--leise);border-radius:999px}
.fuss .druck-slot .knopf:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}

/* Kachelanzeige im Sportplan und Verbindungslinien */
.kachelleiste{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.1rem;margin:0 0 .9rem;padding:.5rem .8rem;background:#fff;border:1px solid var(--linie);border-radius:10px}
.kachelleiste .kl-titel{font-weight:700}
.kachelleiste .kl-hinweis{color:var(--leise);font-size:.84rem;flex:1 1 14rem}
.beispielkachel{display:inline-flex;flex-direction:column;gap:.05rem;min-width:12rem;padding:.25rem .45rem .3rem;border-radius:7px;background:#e3f2ec;border:1.5px solid #6fae94;box-shadow:0 1px 1px rgba(20,40,30,.18)}
.kt{display:inline-flex;align-items:center;gap:.3rem;border:1px dashed transparent;background:transparent;font:inherit;cursor:pointer;padding:.08rem .3rem;border-radius:5px;color:#1b3b30;transition:opacity .12s}
.kt svg{width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.kt:hover{background:rgba(255,255,255,.75);border-color:#6fae94}
.kt:not(.an){opacity:.3}
.kt.titel{font-weight:800;font-size:.92rem}
.kt-zeile{display:flex;flex-wrap:wrap;gap:.1rem}
.kt.aussen{border:1px solid var(--linie2);background:#fff;padding:.3rem .65rem;border-radius:8px;color:#235544;font-weight:600}
.kt.aussen:hover{border-color:var(--akzent)}
.plan-huelle{position:relative}
.ketten{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none;z-index:1}
.kette-linie{position:absolute;height:2px;background:#2b6e57;border-radius:1px}
.kette-glied{position:absolute;width:20px;height:20px;border-radius:50%;background:#fff;border:1.5px solid #2b6e57;color:#2b6e57;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.kette-glied svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kette-glied.klein{width:12px;height:12px;border-width:1px}
.kette-glied.klein svg{width:7px;height:7px}
.plan-legende .kette-symbol{display:inline-flex;vertical-align:middle;width:1.1rem;height:1.1rem;border-radius:50%;border:1.5px solid #2b6e57;color:#2b6e57;align-items:center;justify-content:center;margin-right:.35rem;background:#fff}
.plan-legende .kette-symbol svg{width:.65rem;height:.65rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.belegung{padding:.25rem .4rem}
.belegung b{font-size:.9rem;line-height:1.15}
.belegung .lk{display:block;margin-top:.1rem;font-size:.78rem;color:#1f3f34}
@media (max-width:720px){.kachelleiste{display:none}}
@media print{.ketten{display:none}}

/* Demo-Zugang: nur ansehen */
.demo-band{display:flex;align-items:center;flex-wrap:wrap;gap:.2rem .6rem;padding:.4rem 1.6rem;background:#e8f1fb;border-bottom:1px solid #b9d0ee;color:#123e75;font-size:.92rem}
.demo-band svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.demo-aus{opacity:.45;cursor:not-allowed!important}
input.demo-aus,select.demo-aus,textarea.demo-aus{background:#eef1f4}
body.demo td.zelle.leerbar{pointer-events:none}
body.demo .belegung{cursor:default}

/* Dialoge: alles auf einen Blick, wenig Scrollen */
dialog.fenster{max-height:calc(100vh - 1rem)}
dialog.fenster.breit{width:min(1040px,calc(100vw - 1rem))}
.fenster-kopf{padding:.7rem 1.1rem}
.fenster-inhalt{padding:.8rem 1.1rem}
.fenster-fuss{padding:.6rem 1.1rem}
.fenster-inhalt .formular{gap:.6rem}
.fenster-inhalt label.feld{gap:.15rem}
.fenster-inhalt h3{margin:.4rem 0 .3rem}
.fenster-inhalt textarea{min-height:0}
.flaechenwahl{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.45rem .8rem;max-height:none;overflow:visible;padding:.5rem .6rem}
.flaechenwahl .gruppe{align-content:flex-start;gap:.15rem .8rem}
.vorschlaege{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin-top:.1rem}
.vorschlaege .v-titel{font-size:.8rem;color:var(--leise);margin-right:.15rem}
.vorschlaege button{border:1px solid var(--linie2);background:#f7faf9;border-radius:14px;padding:.12rem .65rem;font-size:.86rem;cursor:pointer;color:var(--ink)}
.vorschlaege button:hover{border-color:var(--akzent);background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.feld-klein{font-size:.8rem;color:var(--leise);font-weight:400}

/* Planprüfung: erledigt, ignorieren, Archiv */
.pruef-aktionen{display:flex;gap:.2rem;flex:0 0 auto}
.pruef.archiviert .text{color:#4a5864}
.marke-klein.erledigt{background:#e4f3ec;color:#14634c;border-color:#9bd0b9}
.marke-klein.ignoriert{background:#eceff2;color:#44515d;border-color:#c1cad2}
.archiv-kopf{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.archiv-kopf h2{margin:0}

/* Auswertung */
.auswertung-karte{margin-bottom:1.3rem}
.auswertung-karte>h2{margin-bottom:.2rem}
.auswertung-karte>p.leise{margin-bottom:.6rem}
table.liste.auswertung thead th{background:#e9f1ee;border-bottom:2px solid #9fc4b5;color:#1d3f33;text-transform:none}
table.liste.auswertung tbody tr:nth-child(even) td{background:#fafcfb}
table.liste.auswertung tbody tr:hover td{background:#eef7f3}
table.liste.auswertung tfoot td{background:#e9f1ee;border-top:2px solid #9fc4b5;font-size:1rem}
.abw{display:inline-block;min-width:3.3rem;text-align:center;border-radius:6px;padding:.1rem .5rem;font-weight:800;font-variant-numeric:tabular-nums}
.abw.null{background:#e4f3ec;color:#14634c}
.abw.plus{background:#fde3df;color:#9b1c10}
.abw.minus{background:#fff0c9;color:#7a4a00}
tr.abweichung td:first-child{box-shadow:inset 4px 0 0 #d9534f}
tr.abweichung.minus td:first-child{box-shadow:inset 4px 0 0 #e0a100}
.mini-balken{display:inline-block;vertical-align:middle;width:6rem;height:.55rem;background:#dde3e8;border-radius:5px;overflow:hidden;margin-right:.5rem}
.mini-balken>i{display:block;height:100%;background:var(--akzent)}
.mini-balken.voll>i{background:#d38b2c}
.zahl-stark{font-weight:800}

/* Kachelwerkzeuge verdecken den Titel nicht: Der Titel rückt bei Platzmangel in die nächste Zeile */
.belegung.mit-werkzeug::before{content:"";float:right;width:3.3rem;height:1.45rem}
.plan-huelle.kompakt .belegung.mit-werkzeug::before{display:none}

/* Wochenrhythmus */
.chip-woche{display:inline-flex;align-items:center;padding:.2rem .7rem;border-radius:999px;background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));font-weight:700;font-size:.9rem;border:1px solid transparent}
.folge-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr));gap:.5rem;margin:.4rem 0 1rem}
.folge-woche{border:1px solid var(--linie2);border-radius:var(--radius);padding:.45rem .7rem;background:#fff;display:flex;flex-direction:column;gap:.1rem}
.folge-woche span{color:var(--leise);font-size:.85rem}
.folge-woche.jetzt{border-color:var(--akzent);box-shadow:0 0 0 2px var(--akzent-h)}
.folge-box p{margin:.3rem 0}

/* Hallen: Bilder und Ansprechpersonen */
.bilder-reihe{display:flex;flex-wrap:wrap;gap:.7rem;margin:.6rem 0}
.bild-mini{margin:0;width:9.5rem}.bild-mini img{display:block;width:100%;height:6.5rem;object-fit:cover;border-radius:var(--radius);border:1px solid var(--linie2)}
.bild-mini.gross{width:min(22rem,100%)}.bild-mini.gross img{height:auto;max-height:16rem}
.bild-mini figcaption{display:flex;flex-direction:column;gap:.15rem;margin-top:.25rem;font-size:.85rem;align-items:flex-start}
.bilder-liste{display:flex;flex-direction:column;gap:.8rem}
.bild-zeile{display:flex;gap:1rem;align-items:flex-start;border:1px solid var(--linie);border-radius:var(--radius);padding:.6rem}
.bild-zeile .bild-klein{width:9rem;height:6.5rem;object-fit:cover;border-radius:var(--radius);flex:0 0 auto}
.bild-rechts{flex:1 1 auto;display:flex;flex-direction:column;gap:.5rem;min-width:0}
.kontakte{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.6rem;margin:.6rem 0}
.kontakte>h3{grid-column:1/-1;margin:.2rem 0 0}
.kontakt-karte{border:1px solid var(--linie2);border-radius:var(--radius);padding:.6rem .8rem;background:#fff}
.kontakt-karte p{margin:.25rem 0 0}
.kontakt-kopf{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.kontakt-links{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin-top:.3rem}
.kontakt-link{display:inline-flex;align-items:center;gap:.35rem;color:var(--akzent-t,var(--akzent-d));font-weight:600;text-decoration:none}
.kontakt-link:hover{text-decoration:underline}
.kontakt-link svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.person-tabs,.tage-wahl{display:flex;flex-wrap:wrap;gap:.4rem}
.chip.plus{border-style:dashed}
.zeilen{display:flex;flex-direction:column;gap:.6rem}
.zeile-block{border:1px solid var(--linie);border-radius:var(--radius);padding:.6rem;display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}
.zeile-block .raster4{width:100%}
@media (max-width:640px){.bild-zeile{flex-direction:column}}

/* ---- Etappe 3: Karte, Erklärkasten, Kontakte, Notfall, Mitteilungen, Uhrzeitlinie ---- */
.karte-huelle{position:relative;overflow:hidden;border:1px solid var(--linie2);border-radius:var(--radius);background:#eaf1ec repeating-linear-gradient(0deg,transparent 0 47px,rgba(22,121,92,.10) 47px 48px),repeating-linear-gradient(90deg,transparent 0 47px,rgba(22,121,92,.10) 47px 48px);touch-action:none;cursor:grab;margin-bottom:1rem;user-select:none;-webkit-user-select:none}
.karte-huelle:active{cursor:grabbing}
.karte-huelle.klein{margin-bottom:0;cursor:default}
.karte-kacheln,.karte-pins{position:absolute;left:0;top:0;right:0;bottom:0;overflow:hidden}
.karte-pins{pointer-events:none}
.karte-kachel{position:absolute;width:256px;height:256px;max-width:none;pointer-events:none;-webkit-user-drag:none}
.pin{position:absolute;width:0;height:0;padding:0;border:0;background:none;pointer-events:auto;cursor:pointer;font:inherit}
.pin-kopf{position:absolute;left:0;top:-40px;transform:translateX(-50%);min-width:28px;height:28px;padding:0 .35rem;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;color:#fff;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.45);white-space:nowrap}
.pin-nadel{position:absolute;left:-1px;top:-12px;width:2px;height:12px;background:#27323c;box-shadow:0 0 0 1px rgba(255,255,255,.85)}
.pin.halle .pin-kopf{background:#16795c}.pin.halt .pin-kopf{background:#1b5aa6}
.pin:hover .pin-kopf,.pin:focus-visible .pin-kopf{transform:translateX(-50%) scale(1.12);z-index:2}
.pin:focus-visible{outline:none}.pin:focus-visible .pin-kopf{outline:3px solid #f2b84b}
.pin.klein{width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;border:2px solid #fff;pointer-events:none}
.pin.klein.halle{background:#16795c}.pin.klein.halt{background:#1b5aa6}
.karte-knoepfe{position:absolute;top:8px;right:8px;z-index:3;display:flex;flex-direction:column;gap:4px}
.karte-knoepfe .knopf{min-width:2.5rem;min-height:2.5rem;padding:.2rem .4rem;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.karte-masstab{position:absolute;top:10px;left:10px;z-index:3;display:flex;flex-direction:column;gap:2px;font-size:.72rem;font-weight:700;color:#27323c;pointer-events:none;text-shadow:0 0 3px #fff,0 0 3px #fff}
.karte-masstab .ms-linie{display:block;height:6px;border:2px solid #27323c;border-top:0;min-width:10px}
.karte-fuss{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:center;padding:.25rem .5rem;font-size:.76rem;background:rgba(255,255,255,.93);cursor:default;border-top:1px solid var(--linie)}
.karte-fuss small{flex:1 1 100%;color:var(--leise);font-size:.72rem}
.karte-fuss:empty{display:none}
.karte-leer{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;color:var(--leise);padding:0 1rem}
.mini-karte{display:block;width:132px;height:80px;max-width:none}
.mk-flaeche{fill:#eaf1ec;stroke:#c9d1d8}.mk-text{font-size:10px;fill:#3b4753}
.mk-punkt{stroke:#fff;stroke-width:1.5}.mk-punkt.halle{fill:#16795c}.mk-punkt.halt{fill:#1b5aa6}
.karte-legende{display:flex;flex-wrap:wrap;gap:.3rem 1rem;font-size:.85rem;color:var(--leise);margin:-.4rem 0 1rem}
.karte-legende i{display:inline-block;width:.8rem;height:.8rem;border-radius:50%;margin-right:.3rem;vertical-align:-.1rem}
.karte-legende i.halle{background:#16795c}.karte-legende i.halt{background:#1b5aa6}
.karte-popup{display:flex;flex-direction:column;gap:.6rem}
.karte-popup h3{margin:.2rem 0 .1rem}
.karte-popup ul{margin:0;padding-left:1.1rem}
.erklaerung{border:1px solid #c5d8f2;border-left:4px solid #1b5aa6;border-radius:var(--radius);background:linear-gradient(90deg,var(--blau-h),#fffaf0 140%);margin:.2rem 0 1rem;color:#14304f}
.erklaerung summary{display:flex;align-items:center;gap:.5rem;padding:.55rem .8rem;cursor:pointer;font-weight:700;list-style:none}
.erklaerung summary::-webkit-details-marker{display:none}
.erklaerung summary svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.erklaerung summary::after{content:"▾";margin-left:auto;font-size:.9rem;transition:transform .15s}
.erklaerung[open] summary::after{transform:rotate(180deg)}
.erklaerung summary:focus-visible{outline:3px solid #7fb9a3;outline-offset:-3px;border-radius:var(--radius)}
.erklaerung-inhalt{padding:0 .9rem .5rem 2.3rem}
.erklaerung-inhalt p:last-child{margin-bottom:.3rem}
.optionsfeld{border:1px solid var(--linie);border-radius:var(--radius);background:#fff;padding:.6rem .9rem;margin:0 0 1rem}
.optionsfeld>summary{cursor:pointer;font-weight:700}
.optionsfeld .opt-reihe{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:.6rem 0 .2rem;align-items:center}
.optionsfeld .opt-reihe>b{font-size:.9rem}
.kontakt-icons{display:inline-flex;gap:.1rem;margin-left:.3rem;vertical-align:middle}
.icon-link{display:inline-flex;align-items:center;justify-content:center;width:1.9rem;height:1.9rem;border-radius:7px;color:var(--akzent-t,var(--akzent-d));border:1px solid transparent}
.icon-link:hover,.icon-link:focus-visible{background:var(--akzent-h);border-color:var(--akzent)}
.icon-link svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.firma{display:inline-flex;align-items:center;flex-wrap:wrap}
.firma.zweite{display:flex;margin-top:.1rem}.firma.zweite small{color:var(--leise);margin-right:.25rem}
table.bustabelle td{vertical-align:top}
.bild-tabelle{display:block;width:112px;height:72px;object-fit:cover;border-radius:6px;border:1px solid var(--linie)}
.bild-zelle{min-width:120px}.karte-zelle{min-width:140px}
.vorgaben-liste{display:flex;flex-direction:column;gap:.15rem}
.status-zelle label.haken{white-space:nowrap}
.zeile-halt{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.mit-zeitlinie{position:relative}
.zeitlinie{position:absolute;left:0;height:0;border-top:2px solid #d92d20;z-index:2;pointer-events:none}
.zeitlinie.versteckt{display:none}
.zeit-label{position:absolute;left:3.5rem;top:-.72rem;background:#d92d20;color:#fff;font-size:.7rem;font-weight:800;padding:0 .35rem;border-radius:4px;line-height:1.1rem}
.anfahrt-klein{display:block;font-weight:500;font-size:.68rem;color:var(--leise);line-height:1.1}
.kachelmarken{position:absolute;right:3px;bottom:2px;display:inline-flex;gap:2px;pointer-events:none}
.kachelmarken svg{width:.9rem;height:.9rem;fill:#fff;stroke:#7a5200;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.belegung.mm-info .kachelmarken svg:first-child{stroke:var(--blau)}
.belegung.mm-hinweis .kachelmarken svg:first-child{stroke:#8a5a00}
.belegung.mm-ausfall .kachelmarken svg:first-child{stroke:var(--rot)}
.belegung.mm-ausfall{box-shadow:inset 0 0 0 2px rgba(180,35,24,.55)}
.mitteilung{position:relative;display:flex;gap:.75rem;align-items:flex-start;padding:.75rem .9rem;border-radius:var(--radius);border:1px solid #c5d8f2;border-left-width:5px;background:var(--blau-h);color:#14304f;margin-bottom:.7rem;box-shadow:var(--schatten)}
.mitteilung.art-hinweis{border-color:#e6cf93;background:#fff6dc;color:#4d3500}
.mitteilung.art-ausfall{border-color:#ebb3ac;background:var(--rot-h);color:#6e1a12}
.mitteilung.archiviert{opacity:.65;border-style:dashed}
.mit-symbol{flex:none;width:2.2rem;height:2.2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.75)}
.mit-symbol svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mit-inhalt{flex:1 1 auto;min-width:0}
.mit-kopf{display:flex;flex-wrap:wrap;gap:.2rem .6rem;align-items:center}
.mit-kopf b{font-size:1.02rem}
.mit-text{margin:.3rem 0 .4rem;white-space:pre-wrap;overflow-wrap:anywhere}
.mit-marken{display:flex;flex-wrap:wrap;gap:.25rem;align-items:center;margin-top:.3rem}
.mit-weg{position:absolute;top:.2rem;right:.2rem}
.mitteilungen-banner{margin-bottom:.8rem}
.notfall{display:flex;flex-direction:column;gap:.9rem}
.notfall h3{margin:.2rem 0 .4rem}
.notfall-standort{border:1px solid #e6cf93;background:#fff6dc;border-radius:var(--radius);padding:.6rem .9rem;color:#4d3500}
.notfall-standort p{margin:.2rem 0 .5rem;font-size:1.1rem;font-weight:700}
.notruf-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:.6rem}
.notruf{display:flex;align-items:center;gap:.75rem;min-height:3.4rem;padding:.55rem .9rem;border-radius:var(--radius);border:2px solid #d9857c;background:#fff;color:var(--ink);text-decoration:none}
.notruf:hover,.notruf:focus-visible{background:var(--rot-h);border-color:var(--rot)}
.notruf svg{flex:none;width:1.5rem;height:1.5rem;fill:none;stroke:var(--rot);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.notruf-text{display:flex;flex-direction:column;min-width:0}.notruf-text b{overflow-wrap:anywhere}.notruf-text span{font-size:1.1rem;font-weight:700;color:var(--rot)}
.fluchtplaene{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.7rem}
.fluchtplan{display:flex;flex-direction:column;gap:.25rem;text-decoration:none;color:var(--ink);font-weight:600}
.fluchtplan img{width:100%;max-height:16rem;object-fit:contain;background:#fff;border:1px solid var(--linie2);border-radius:8px}
.knopf.notfall-knopf{color:var(--rot);border-color:#e8b4ae}.knopf.notfall-knopf svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.knopf.notfall-knopf:hover{background:var(--rot-h);border-color:var(--rot)}
.code-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.code-wert{font-family:Consolas,"Courier New",monospace;font-weight:700;font-size:1.05rem;background:#fff6dc;border:1px solid #e6cf93;border-radius:6px;padding:.1rem .5rem}
.notiz-liste{display:flex;flex-direction:column;gap:.5rem;margin:.4rem 0}
.notiz{border:1px solid #e6cf93;background:#fff9e6;border-radius:8px;padding:.5rem .7rem}
.notiz.archiviert{opacity:.65;border-style:dashed}
.notiz p{margin:0 0 .3rem;white-space:pre-wrap;overflow-wrap:anywhere}
.notiz-kopf{display:flex;flex-wrap:wrap;gap:.3rem .6rem;align-items:center;font-size:.85rem;color:var(--leise)}
@media (max-width:640px){
  .notruf-liste,.fluchtplaene{grid-template-columns:1fr}
  .mitteilung{padding:.65rem .7rem}.mit-symbol{width:1.9rem;height:1.9rem}
  .zeile-halt{grid-template-columns:1fr}
  .erklaerung-inhalt{padding-left:.9rem}
  .karte-fuss small{display:none}
}
@media print{.karte-knoepfe,.karte-fuss button,.mit-weg{display:none!important}.mitteilung{break-inside:avoid}.zeitlinie{display:none}}
.haken-reihe{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;align-items:center}
.nummern-zeile{display:grid;grid-template-columns:minmax(0,1fr) 12rem auto;gap:.5rem;align-items:center}
.chip-box{display:flex;flex-wrap:wrap;gap:.35rem;max-height:10rem;overflow:auto;padding:.3rem 0}
.mehrfach{border:1px solid var(--linie);border-radius:var(--radius);padding:.5rem .7rem;background:#fff}
.mehrfach-kopf{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline;margin-bottom:.3rem}
.mehrfach input[type=search]{margin:.2rem 0 .3rem}
.such-zeile{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.such-zeile input{flex:1 1 14rem;width:auto}
.koord-feld{display:flex;flex-direction:column;gap:.6rem}
.datei-feld{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}
.datei-vorschau{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.datei-vorschau img.bild-klein{max-width:9rem;max-height:6rem;border-radius:6px;border:1px solid var(--linie)}
label.feld.inline{flex-direction:row;align-items:center;gap:.5rem}
label.feld.inline select{width:auto}
@media (max-width:640px){.nummern-zeile{grid-template-columns:1fr auto}.nummern-zeile input[type=tel]{grid-column:1}.chip-box{max-height:8rem}}
.bild-gross{display:block;max-width:100%;max-height:70vh;margin:0 auto;border-radius:8px;border:1px solid var(--linie);object-fit:contain;background:#fff}
.firmen-block{margin-top:.3rem;display:flex;flex-direction:column;gap:.1rem}
.firmen-block small{color:var(--leise)}

/* QR-Code und Link-Anmeldung */
.qr-druck{text-align:center}
.qr-druck .kopierfeld{text-align:left}
.qr-huelle{display:flex;justify-content:center;margin:.6rem 0}
canvas.qr{width:100%;max-width:320px;height:auto;image-rendering:pixelated;border:1px solid var(--linie);border-radius:8px;background:#fff}
.merken small{display:block;margin:.25rem 0 0 1.7rem}

/* Vermerke: Absprachen mit Datum, Weg und Person. Lehrkräfte sehen sie nur lesend, Schülerinnen und Schüler gar nicht. */
.vermerke{margin-top:1rem;border-top:1px solid var(--linie);padding-top:.7rem}
.vermerke h3{margin:0 0 .5rem;font-size:1rem}
.vermerk{border:1px solid var(--linie);border-radius:8px;padding:.5rem .7rem;margin:0 0 .5rem;background:#fff}
.vermerk-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .6rem}
.vermerk-kopf .raum{flex:1 1 0;min-width:.5rem}
.vermerk-text{margin:.3rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.icon-knopf{position:relative}
.icon-knopf .zaehler{position:absolute;top:-.2rem;right:-.2rem;min-width:1.05rem;height:1.05rem;border-radius:999px;background:var(--akzent);color:#fff;font-size:.7rem;font-weight:700;line-height:1.05rem;text-align:center;padding:0 .2rem}
.vermerke textarea{width:100%}

/* Einwilligung: erste Abfrage nach dem Anmelden und Bereich im Profil */
.anmeldung .karte.einw-karte{width:min(680px,100%)}
.einw .einw-kz{padding-bottom:.4rem}
.einw .einw-kz p{margin:.2rem 0 .5rem}
.einw-zeile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.4rem 1rem;align-items:end;border-top:1px solid var(--linie);padding:.6rem 0}
.einw-zeile .haken{padding-bottom:.55rem;white-space:nowrap}
@media (max-width:560px){.einw-zeile{grid-template-columns:minmax(0,1fr)}.einw-zeile .haken{padding-bottom:0}}

/* Handy und Tablet (Android und Apple) */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,a,select,summary,label.haken,.chip{touch-action:manipulation}
.tabelle-huelle,.plan-huelle,.fenster-inhalt{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.toast{bottom:calc(1.2rem + env(safe-area-inset-bottom,0px))}
/* Datumsfelder: iOS zeichnet sie eigenwillig, leere Felder fallen sonst in sich zusammen */
input[type=date],input[type=time]{min-width:0;display:block;-webkit-appearance:none;appearance:none;line-height:1.2}
input[type=date]::-webkit-date-and-time-value,input[type=time]::-webkit-date-and-time-value{text-align:left;min-height:1.2em;margin:0}
/* iOS zoomt in Eingabefelder unter 16 px und lässt die Seite danach verschoben stehen. Berührungsgeräte bekommen deshalb mindestens 16 px und größere Tippflächen. */
@media (pointer:coarse){
  input[type=text],input[type=password],input[type=number],input[type=date],input[type=time],input[type=search],input[type=tel],input[type=email],select,textarea{font-size:max(16px,1rem);min-height:2.75rem}
  .knopf{min-height:2.75rem}.knopf.klein{min-height:2.5rem}
  .icon-knopf{width:2.75rem;height:2.75rem}
  .nav-punkt{padding-top:.62rem;padding-bottom:.62rem}.nav-titel{padding-top:.6rem;padding-bottom:.6rem}
  input[type=checkbox],input[type=radio]{width:1.4rem;height:1.4rem}
  label.haken{min-height:2.75rem;align-items:center}
}
/* Dynamische Bildschirmhöhe: Auf dem iPhone ist 100vh höher als der sichtbare Bereich, sobald die Adressleiste da ist */
@supports (height:100dvh){
  .arbeitsflaeche,.anmeldung{min-height:100dvh}
  .korb-seite{height:100dvh}
  dialog.fenster{max-height:calc(100dvh - 2rem)}
  .plan-huelle{max-height:calc(100dvh - 13rem)}
}
@supports selector(body:has(dialog)){
  body:has(dialog[open]){overflow:hidden}
  @media print{body:has(dialog[open]){overflow:visible}}
}
@media (max-width:900px){.plan-huelle{max-height:none}}
@media (max-width:560px){
  .kopf{gap:.5rem}
  .kopf .pfad{min-width:0;flex:1 1 auto}
  .kopf .pfad span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .schuljahr-chip .wort{display:none}
  .schuljahr-chip{padding:.2rem .7rem .2rem .55rem;flex:0 0 auto}
  .pruef{flex-wrap:wrap}.pruef .art{flex:0 0 auto}.pruef .text{flex:1 1 12rem}
}

/* ---------------------------------------------------------------- Etappe 5: App für Schüler */
[hidden]{display:none!important}
.anmeldung{flex-direction:column;gap:1rem}
/* App installieren (Anmeldeseiten) */
.install-karte{width:min(420px,100%);padding:.7rem 1rem;border-radius:var(--radius);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#f1fff8}
.install-karte summary{display:flex;gap:.8rem;align-items:center;cursor:pointer;list-style:none}
.install-karte summary::-webkit-details-marker{display:none}
.install-karte summary b{flex:1;font-size:1.02rem}
.install-pfeil{transition:transform .15s}.install-karte[open] .install-pfeil{transform:rotate(180deg)}
.install-icon{flex:none;width:40px;height:40px;border-radius:10px;background:#fff}
.install-inhalt{display:flex;flex-direction:column;gap:.4rem;margin-top:.6rem;padding-top:.6rem;border-top:1px solid rgba(255,255,255,.22)}
.install-text{margin:0;font-size:.92rem;color:#d7efe5}
.install-schritte{margin:0;padding-left:1.2rem;font-size:.92rem;color:#d7efe5}
.install-karte .knopf.text{color:#d7efe5}.install-karte .knopf.text:hover{background:rgba(255,255,255,.14);color:#fff}
.install-karte .knopf.haupt{background:#fff;color:var(--akzent-t,var(--akzent-d));border-color:#fff}.install-karte .knopf.haupt:hover{background:#e3f2ec}
.install-karte summary:focus-visible{outline:3px solid #c7f0dc;outline-offset:3px;border-radius:6px}
@media (max-width:640px){.install-karte{order:-1}}
/* Verwaltung: App-Ansicht */
.matrix{width:100%;border-collapse:collapse;font-size:.95rem}
.matrix th,.matrix td{padding:.45rem .7rem;border-bottom:1px solid var(--linie);text-align:left;vertical-align:middle}
.matrix thead th{background:#f7f9fa;font-size:.85rem;color:#33414d;white-space:nowrap}
.matrix th.mitte,.matrix td.mitte{text-align:center;width:9rem}
.matrix tr.kopfzeile th{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));font-size:.82rem;letter-spacing:.02em;text-transform:uppercase}
.matrix label.haken{justify-content:center}
.haken-reihe{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem}
.speicherleiste{position:sticky;bottom:0;z-index:5;display:flex;gap:.6rem;align-items:center;justify-content:flex-end;padding:.6rem .9rem;margin-top:1rem;background:var(--gelb-h);border:1px solid #ecd08a;border-radius:var(--radius);box-shadow:0 -2px 10px rgba(20,30,40,.1);font-weight:700;color:var(--gelb)}
.speicherleiste span{margin-right:auto}
/* Karte: eigener Standort und Schule */
.pin.schule .pin-kopf{background:#6b3fa0}.pin.ich .pin-kopf{background:#d4380d}
.pin.klein.schule{background:#6b3fa0}.pin.klein.ich{background:#d4380d}
.karte-legende i.schule{background:#6b3fa0}.karte-legende i.ich{background:#d4380d}
.standort-karte .punkte{margin:.4rem 0}
ul.punkte{margin:.3rem 0 .7rem;padding-left:1.2rem}ul.punkte li{margin:.2rem 0}
/* Stunde im Detail */
.kachel-sachen{display:flex;align-items:flex-start;gap:.25rem;margin-top:1px;font-size:.72rem;line-height:1.1;font-weight:700;color:#14507a;overflow:hidden}
.kachel-sachen svg{flex:none;width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bus-banner{display:flex;gap:.6rem;align-items:center;margin:0 0 .9rem;padding:.55rem .85rem;border-radius:var(--radius);background:var(--blau-h);border:1px solid #c5d8f2;color:#123e75}
.bus-banner svg{flex:none;width:1.4rem;height:1.4rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.countdown{font-variant-numeric:tabular-nums}
.knopf.text.lk-link{min-height:0;padding:0 .2rem;font-weight:700;color:var(--akzent-t,var(--akzent-d));text-decoration:underline;text-underline-offset:2px;text-align:left}
.notfall-zeile{margin-top:.8rem}
dl.detailliste{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:.4rem 1rem;margin:0}
dl.detailliste dt{font-weight:700;color:var(--leise)}dl.detailliste dd{margin:0;overflow-wrap:anywhere}
table.liste.mit-klick tr.klickbar:focus-visible td{outline:2px solid #7fb9a3;outline-offset:-2px}
/* Sportstätten als kompakte Kacheln */
.staetten-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.8rem;align-items:start}
.staette-kachel{display:flex;flex-direction:column;gap:.45rem;padding:.8rem .9rem;border:1px solid var(--linie);border-left:4px solid var(--akzent);border-radius:var(--radius);background:var(--karte);box-shadow:var(--schatten)}
.staette-kachel header{display:flex;gap:.5rem;align-items:center;justify-content:space-between}
.knopf.text.staette-name{min-height:0;padding:0;font-size:1.08rem;font-weight:700;color:var(--ink);text-align:left}.knopf.text.staette-name:hover{background:none;color:var(--akzent-t,var(--akzent-d));text-decoration:underline}
.st-zeilen p{display:flex;gap:.4rem;align-items:flex-start;margin:0 0 .15rem;font-size:.92rem}
.st-zeilen svg,.st-sachen svg{flex:none;width:1rem;height:1rem;margin-top:.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.st-sachen{display:flex;gap:.4rem;align-items:center;padding:.25rem .55rem;border-radius:6px;background:var(--blau-h);color:#123e75;font-size:.9rem;font-weight:600}
.st-mehr{border-top:1px solid var(--linie);padding-top:.4rem}.st-mehr summary{cursor:pointer;font-weight:600;color:var(--leise);font-size:.9rem}
.matrix .kurz{display:none}
@media (max-width:640px){.staetten-raster{grid-template-columns:1fr}.matrix th.mitte,.matrix td.mitte{width:4.2rem}.matrix .lang{display:none}.matrix .kurz{display:inline}.speicherleiste{flex-wrap:wrap}}
@media print{.install-karte,.speicherleiste,.bus-banner{display:none!important}}


/* ---------------------------------------------------------------- Etappe 6: Sportplan-Arbeitsfläche */
.punkt{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;background:#aab4bd;flex:0 0 auto}.punkt.an{background:var(--akzent)}
.reiter.modus button{display:inline-flex;align-items:center;gap:.4rem}.reiter.modus button svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reiter.modus button:disabled{opacity:.45;cursor:not-allowed}
.reiter.modus button.aktiv[aria-selected=true]{outline:2px solid var(--akzent)}
.planleiste{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .9rem;padding:.5rem .8rem;margin-bottom:.7rem;border:1px solid var(--linie2);border-left:6px solid #aab4bd;border-radius:var(--radius);background:#fff}
.planleiste.aktiv{border-left-color:var(--akzent);background:#f4faf7}
.planleiste.inaktiv{background:#fbf8f0}
.planleiste .plan-chip{display:inline-flex;align-items:center;gap:.5rem;font-size:1.05rem}
.planleiste .plan-hinweis{color:var(--leise);font-size:.88rem;flex:1 1 18rem}
.planleiste .raum,.speicherleiste .raum,.werkzeugleiste .raum,.wp-kopf .raum{flex:1}
.marke-klein.gruen{background:#e4f3ec;color:#14634c}
.speicherleiste{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.7rem;padding:.4rem .6rem;border:1px dashed var(--linie2);border-radius:var(--radius);background:#fafcfb}
.speicherleiste .knopf svg,.werk-chip svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;margin-right:.3rem}
.werkzeugleiste{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;margin-bottom:.7rem;padding:.4rem .6rem;border:1px solid var(--linie);border-radius:var(--radius);background:#fff}
.werkzeugleiste .wl-titel{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--leise)}
.werkzeugleiste .wl-trenn{width:1px;align-self:stretch;background:var(--linie2)}
.schalter.mit-text .st{min-width:0}
.schalter:disabled{opacity:.5;cursor:not-allowed}
.werk-chip{display:inline-flex;align-items:center;gap:.2rem;border:1px solid var(--linie2);background:#fff;border-radius:999px;padding:.2rem .7rem;cursor:pointer;font-weight:600;color:#33414d}
.werk-chip.an{background:var(--akzent-h);border-color:var(--akzent);color:var(--akzent-t,var(--akzent-d))}
.werk-chip .zahl{margin-left:.35rem;min-width:1.2rem;text-align:center;background:var(--akzent);color:#fff;border-radius:999px;font-size:.75rem;padding:0 .35rem}
.dock{display:flex;flex-wrap:wrap;gap:.7rem;align-items:flex-start;margin-bottom:.8rem}
.dock.fix{position:sticky;top:0;z-index:30;max-height:72vh;overflow:auto;padding:.4rem;background:rgba(244,246,248,.96);border-radius:var(--radius);box-shadow:0 6px 16px rgba(20,40,30,.18)}
.wpanel{display:flex;flex-direction:column;flex:1 1 26rem;min-width:18rem;max-width:100%;height:14rem;min-height:8rem;resize:both;overflow:hidden;background:#fff;border:1px solid #8aa89b;border-radius:var(--radius)}
.wpanel.wp-korb{flex-basis:30rem;background:#f4faf7}
.wpanel.wp-konflikte{flex-basis:36rem}
.wp-kopf{display:flex;align-items:center;gap:.5rem;padding:.3rem .5rem .3rem .7rem;border-bottom:1px solid var(--linie);background:#eef4f1;flex:0 0 auto}
.wp-kopf svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--akzent-t,var(--akzent-d))}
.wp-kopf .wp-info{color:var(--leise);font-size:.85rem}
.wp-koerper{flex:1 1 auto;overflow:auto;padding:.5rem .7rem}
.wp-koerper .korb-scroll{max-height:none;overflow:visible}
/* Korb: Kacheln kompakt und umbrechend */
.korb-reihe{flex-wrap:wrap;gap:.6rem;min-width:0}
.korb-abschnitt{max-width:100%;padding:.35rem .5rem .5rem}
.korb-abschnitt h3{font-size:.92rem;margin:0 0 .3rem}
.korb-kacheln,.korb-kacheln.zwei,.korb-kacheln.drei{display:flex;flex-wrap:wrap;gap:.3rem;grid-template-columns:none}
.korb-kachel{width:5.4rem;min-height:0;padding:.3rem .4rem;font-size:.78rem;flex:0 0 auto}
.korb-kachel .t{font-size:.86rem}
.korb-kachel .sus{margin-top:.1rem}
.korb-kachel .w{padding-top:.1rem}
.korb-werkzeug .reiter{flex:0 0 auto}
.korb-werkzeug .fett{font-weight:700}
/* Setzen von gekoppelten Gruppen: Zielzellen der Partner */
table.plan td.zelle.ziel-partner{background:#e6f4ee;outline:3px dashed var(--akzent);outline-offset:-3px}
table.plan td.zelle.ziel-partner-konflikt{background:#fdeceb;outline:3px dashed #d9534f;outline-offset:-3px}
.belegung .kz{display:block;font-size:.68rem;font-weight:700;color:#5b3a00}
.abw-zeit{position:relative}.abw-zeit .abw-uhr{display:inline-block;margin-left:.25rem;vertical-align:-2px}.abw-uhr svg{width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;color:#8a5a00}
/* Detail im Ansehen-Modus */
.detail-liste{display:grid;gap:.4rem}
.detail-liste .dz{display:grid;grid-template-columns:9rem 1fr;gap:.6rem;padding:.25rem 0;border-bottom:1px solid var(--linie)}
.detail-liste .dk{color:var(--leise);font-size:.88rem}
.detail-liste .dv{font-weight:600}
.detail-problem{margin:.15rem 0;font-weight:400}
@media (max-width:560px){.detail-liste .dz{grid-template-columns:1fr;gap:0}}
.infobox.ansehen-hinweis{background:#f4f6f8;border-color:var(--linie2);color:var(--ink)}
.infobox.ansehen-hinweis p{margin:0}
/* Konfliktfenster */
@media (max-width:760px){.konfliktfenster{grid-template-columns:1fr}}
.notizliste,.todo-liste,.kontaktliste{display:flex;flex-direction:column;gap:.35rem}
.notiz-zeile{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding:.3rem .5rem;border:1px solid var(--linie);border-radius:8px;background:#fffdf5}
.notiz-zeile .text{flex:1 1 14rem;color:var(--ink)}
.todo-zeile{display:flex;align-items:center;gap:.5rem;justify-content:space-between;padding:.15rem .3rem;border-bottom:1px solid var(--linie)}
.todo-zeile.erledigt .haken span{text-decoration:line-through;color:var(--leise)}
.kontakt-zeile{display:flex;flex-wrap:wrap;gap:.2rem .8rem;align-items:baseline;padding:.2rem .3rem;border-bottom:1px solid var(--linie)}
.kontaktliste h4{margin:.5rem 0 .1rem;font-size:.9rem;color:var(--leise)}
.lk-zeile{margin:-.2rem 0 .3rem;font-size:.92rem}
/* Raster */
.raster-generator{border:1px solid var(--linie);border-radius:8px;padding:.4rem .7rem;margin:.5rem 0;background:#fafcfb}
.raster-generator>summary{cursor:pointer;font-weight:700}
.abw-regel{border:1px solid var(--linie);border-radius:8px;padding:.5rem .7rem;margin:.5rem 0;background:#fff}
/* Dashboard */
.meldungen{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.meldung{display:flex;gap:.8rem;align-items:flex-start;justify-content:space-between;padding:.7rem .9rem;border-radius:var(--radius);border:1px solid #c5d8f2;background:var(--blau-h);color:#123e75}
.meldung.wichtig{border-color:#ebb3ac;background:var(--rot-h);color:#7a1a12}
.meldung .ml-kopf{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.meldung p{margin:.2rem 0 0}
.dash-hinweise .hinweis:last-child{margin-bottom:0}
/* Planvarianten */
.icon-huelle{display:inline-block;cursor:not-allowed}
.icon-knopf.gesperrt,.icon-knopf:disabled{opacity:.3;cursor:not-allowed;pointer-events:none}
.plan-hinweis-box p{margin:0}
.pruef .art{display:flex;flex-direction:column;gap:.2rem;align-items:flex-start}.pruef .art-name{font-size:.78rem;color:var(--leise)}
.pruef small.ref{color:var(--leise);font-family:ui-monospace,Consolas,monospace}
.haken-reihe{display:flex;flex-wrap:wrap;gap:.2rem 1rem}
.zwischen-status{align-self:center}

/* Etappe 7: Blocksatz für Fließtext. Logo, Tabellen, Knöpfe, Menü und kurze Zeilen bleiben linksbündig */
.seitenkopf p,.inhalt p,dialog.fenster p,.anmeldung .karte p,.einw-karte p,.app-hinweis,.feld .hinweis,.hinweis,.erklaerung-inhalt,.hilfe p,.install-text,.mk-text,.ms-text,.notruf-text,.vermerk-text,.text-ansicht,.mit-text{text-align:justify;text-justify:inter-word;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
td p,th p,.tabelle-huelle p,.leer,.demo-band,.kopf p,.leiste p,.knopfreihe p,.toast,.kachel p,.belegung p,.fuss p,.karte-legende p{text-align:left;hyphens:manual;-webkit-hyphens:manual}

/* Etappe 7: Kopfzeile mit Hilfe, Profil und Abmelden */
.kopf-aktionen{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}
.kopf-aktionen .trenner{width:1px;height:1.5rem;background:var(--linie2);margin:0 .55rem}
.kopf-knopf{display:inline-flex;align-items:center;gap:.4rem;border:1px solid transparent;background:transparent;color:var(--ink);padding:.32rem .7rem;border-radius:8px;cursor:pointer;font-size:.95rem;line-height:1.2;white-space:nowrap}
.kopf-knopf:hover{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.kopf-knopf.aktiv{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));font-weight:700;border-color:var(--akzent)}
.kopf-knopf svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.kopf-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
body.leiste-zu .leiste-fuss{display:none}
@media (max-width:1100px){.kopf-knopf .txt{display:none}.kopf-knopf{padding:.4rem .5rem}}
@media (max-width:420px){.kopf-aktionen{gap:0}.kopf-aktionen .trenner{margin:0 .25rem}.kopf-knopf{padding:.4rem .4rem}.schuljahr-chip{padding:.3rem .5rem;font-size:.85rem}}
/* Schuljahr-Anzeige: Wort und Zahl gleich hoch auf einer Grundlinie */
.schuljahr-chip{align-items:baseline;gap:.4rem;line-height:1.25;font-size:.95rem;padding:.3rem .95rem .3rem .75rem}
.schuljahr-chip svg{align-self:center}
.schuljahr-chip .wort{font-weight:600}
.schuljahr-chip b{font-size:inherit;font-weight:800;line-height:inherit}
/* Etappe 7: Eingabefelder einheitlich, mit sichtbarer Reaktion beim Überfahren und Anklicken */
input[type=text],input[type=password],input[type=number],input[type=date],input[type=time],input[type=search],input[type=tel],input[type=email],select,textarea{border:1.5px solid var(--linie2);transition:border-color .12s,box-shadow .12s,background-color .12s}
input[type=text]:hover:not(:disabled),input[type=password]:hover:not(:disabled),input[type=number]:hover:not(:disabled),input[type=date]:hover:not(:disabled),input[type=time]:hover:not(:disabled),input[type=search]:hover:not(:disabled),input[type=tel]:hover:not(:disabled),input[type=email]:hover:not(:disabled),select:hover:not(:disabled),textarea:hover:not(:disabled){border-color:#7d93a3}
input[type=text]:focus,input[type=password]:focus,input[type=number]:focus,input[type=date]:focus,input[type=time]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=email]:focus,select:focus,textarea:focus{border-color:var(--akzent);box-shadow:0 0 0 3px var(--akzent-h);outline:none}
input:disabled,select:disabled,textarea:disabled{background:#eef1f4;color:var(--leise);cursor:not-allowed}
input[type=date],input[type=time]{cursor:pointer}
input[type=date]::-webkit-calendar-picker-indicator,input[type=time]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.65}
input[type=date]::-webkit-calendar-picker-indicator:hover,input[type=time]::-webkit-calendar-picker-indicator:hover{opacity:1}
select:not([multiple]){-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:2rem;background-image:linear-gradient(45deg,transparent 50%,#4a5b69 50%),linear-gradient(135deg,#4a5b69 50%,transparent 50%);background-position:calc(100% - 1.05rem) 52%,calc(100% - .75rem) 52%;background-size:.32rem .32rem,.32rem .32rem;background-repeat:no-repeat}
/* Kästchen und Auswahlknöpfe einheitlich */
input[type=checkbox],input[type=radio]{-webkit-appearance:none;appearance:none;display:inline-grid;place-content:center;flex:0 0 auto;background:#fff;border:1.5px solid #7d93a3;cursor:pointer;transition:background-color .12s,border-color .12s,box-shadow .12s}
input[type=checkbox]{border-radius:5px}
input[type=radio]{border-radius:50%}
input[type=checkbox]::before{content:"";width:.7em;height:.7em;transform:scale(0);transition:transform .1s;background:#fff;clip-path:polygon(14% 44%,0 62%,40% 100%,100% 18%,84% 4%,40% 68%)}
input[type=radio]::before{content:"";width:.55em;height:.55em;border-radius:50%;transform:scale(0);transition:transform .1s;background:#fff}
input[type=checkbox]:checked,input[type=radio]:checked{background:var(--akzent);border-color:var(--akzent)}
input[type=checkbox]:checked::before,input[type=radio]:checked::before{transform:scale(1)}
input[type=checkbox]:hover:not(:disabled),input[type=radio]:hover:not(:disabled){border-color:var(--akzent);box-shadow:0 0 0 3px var(--akzent-h)}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:3px solid #7fb9a3;outline-offset:2px}
input[type=checkbox]:disabled,input[type=radio]:disabled{opacity:.5;cursor:not-allowed}

/* Etappe 7: Ziehen und Ablegen bei Sportstätten und Flächen */
.griff{display:inline-block;position:relative;flex:0 0 auto;width:1.6rem;height:2rem;border:0;background:transparent;cursor:grab;border-radius:6px;padding:0;touch-action:none}
.griff::before{content:"";position:absolute;inset:.4rem .45rem;background:radial-gradient(circle,#7d93a3 1.5px,transparent 1.7px) 0 0/6px 6px}
.griff:hover::before,.griff:focus-visible::before{background-image:radial-gradient(circle,var(--akzent) 1.6px,transparent 1.8px)}
.griff:hover{background:var(--akzent-h)}
.griff:active{cursor:grabbing}
.griff:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
td.griff-zelle,th.griff-zelle{width:2.2rem;padding-right:0}
.ziehliste .kartenkopf{display:flex;align-items:flex-start;gap:.6rem}
.ziehliste .kartenkopf .kartentitel{flex:1 1 auto;min-width:0}
.ziehliste{display:flex;flex-direction:column;gap:1rem}
.ziehliste>.karte.zieht,tr.zieht{opacity:.4}
.ziehliste>.karte.drop-vor{box-shadow:0 -5px 0 0 var(--akzent)}
.ziehliste>.karte.drop-nach{box-shadow:0 5px 0 0 var(--akzent)}
tr.drop-vor>td{box-shadow:inset 0 3px 0 0 var(--akzent)}
tr.drop-nach>td{box-shadow:inset 0 -3px 0 0 var(--akzent)}
.nur-touch{display:none}
@media (pointer:coarse){.nur-touch{display:inline-flex}th.nur-touch,td.nur-touch{display:table-cell}}

/* Etappe 7: Klickmenü an Namen, einklappbare Abschnitte, Sprungleiste, Nach-oben-Knopf */
.link-knopf{font:inherit;font-weight:inherit;color:var(--akzent-t,var(--akzent-d));background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left;text-decoration:underline;text-decoration-color:#9fc4b5;text-underline-offset:3px;border-radius:3px}
.link-knopf:hover{text-decoration-color:currentColor;color:var(--akzent-t,var(--akzent))}
.link-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:2px}
.klickmenue{position:fixed;z-index:900;min-width:15rem;max-width:min(26rem,calc(100vw - 16px));max-height:min(70vh,28rem);overflow:auto;background:#fff;border:1px solid var(--linie2);border-radius:10px;box-shadow:0 10px 30px rgba(20,40,34,.22);padding:.35rem}
.klickmenue-kopf{padding:.5rem .6rem .2rem;font-size:.78rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--leise);text-align:left}
.klickmenue-punkt{display:flex;align-items:center;gap:.55rem;width:100%;background:none;border:0;padding:.5rem .6rem;border-radius:7px;font:inherit;color:var(--ink);text-align:left;cursor:pointer}
.klickmenue-punkt:hover,.klickmenue-punkt:focus-visible{background:var(--akzent-h);outline:none}
.klickmenue-punkt svg{width:1.1rem;height:1.1rem;fill:none;stroke:var(--akzent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.klickmenue-punkt .platz{width:1.1rem;flex:0 0 auto}
.klickmenue-punkt .text{flex:1 1 auto}
.klickmenue-punkt .zusatz{font-size:.85rem;color:var(--leise);white-space:nowrap}
.auswertung-karte{scroll-margin-top:5rem}
.auswertung-karte>h2{margin:0 0 .2rem}
.abschnitt-knopf{display:flex;align-items:center;gap:.6rem;width:100%;background:none;border:0;padding:.15rem .25rem;margin:0 -.25rem;font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:7px}
.abschnitt-knopf:hover{background:var(--akzent-h)}
.abschnitt-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
.abschnitt-knopf .pfeil{flex:0 0 auto;width:0;height:0;border-left:.35rem solid transparent;border-right:.35rem solid transparent;border-top:.45rem solid var(--akzent);transition:transform .15s}
.auswertung-karte.zu .abschnitt-knopf .pfeil{transform:rotate(-90deg)}
.auswertung-karte.zu .abschnitt-inhalt{display:none}
.abschnitt-inhalt>p.leise{margin:.2rem 0 .6rem}
.ausw-index{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 1rem}
.chip-sprung{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .85rem;border:1px solid var(--linie2);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-weight:600;cursor:pointer}
.chip-sprung svg{width:1rem;height:1rem;fill:none;stroke:var(--akzent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.chip-sprung:hover,.chip-sprung:focus-visible{border-color:var(--akzent);background:var(--akzent-h);outline:none}
.nach-oben{position:fixed;right:1.2rem;bottom:1.2rem;z-index:40;width:3rem;height:3rem;border-radius:50%;border:0;background:var(--akzent);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 14px rgba(20,40,34,.3);opacity:0;visibility:hidden;transform:translateY(.6rem);transition:opacity .2s,transform .2s,visibility .2s}
.nach-oben.sichtbar{opacity:1;visibility:visible;transform:none}
.nach-oben:hover{background:var(--akzent-d)}
.nach-oben:focus-visible{outline:3px solid #7fb9a3;outline-offset:3px}
.nach-oben svg{width:1.4rem;height:1.4rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media print{.auswertung-karte.zu .abschnitt-inhalt{display:block}.abschnitt-knopf .pfeil{display:none}.abschnitt-knopf{padding:0;margin:0}}
@media (prefers-reduced-motion:reduce){.nach-oben,.abschnitt-knopf .pfeil{transition:none}}

/* Etappe 7: Leiste für ungespeicherte Änderungen */
.aenderungsleiste{position:sticky;bottom:.8rem;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem .8rem;margin:1.2rem 0 0;padding:.7rem 1rem;background:var(--gelb-h);border:1px solid #e3c36a;border-radius:var(--radius);box-shadow:0 6px 22px rgba(20,30,40,.2);font-weight:700;color:#5c3d00}
.aenderungsleiste[hidden]{display:none}
.aenderungsleiste .aend-punkt{flex:0 0 auto;width:.7rem;height:.7rem;border-radius:50%;background:#f2b705;box-shadow:0 0 0 3px rgba(242,183,5,.3)}
.aenderungsleiste .aend-text{flex:1 1 14rem;min-width:0}
.aenderungsleiste .raum{display:none}
@media print{.aenderungsleiste{display:none!important}}

/* Etappe 7: Anmeldeseiten, Anmeldung und App-Installation nebeneinander (Desktop und Tablet). Nur auf Smartphones untereinander */
@media (min-width:700px){
  .anmeldung{flex-direction:row;flex-wrap:wrap;align-items:flex-start;align-content:center;justify-content:center;gap:1.5rem}
  .anmeldung .karte:not(.einw-karte){width:auto;flex:1 1 300px;max-width:420px}
  .anmeldung .install-karte{width:auto;flex:1 1 300px;max-width:420px;order:0}
}

/* ===== Etappe 8: Sportplan ruhig und eindeutig ===== */
/* Verkehrsmittel mit Symbol */
.vm-reihe{display:inline-flex;flex-wrap:wrap;gap:.15rem .8rem;vertical-align:middle}
.vm{display:inline-flex;align-items:center;gap:.3rem;font-weight:700}
.vm svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.vm-bus{color:#9a4f00}.vm-bahn{color:#1b5aa6}.vm-rad{color:#17704f}.vm-fuss{color:#6a3d9a}
td .vm svg,.st-zeilen .vm svg{vertical-align:middle;margin:0}
/* Menü: Dashboard und Sportplan, gleiche Größe, zwei Farben */
.nav-punkt.gross.farbe-dashboard{background:rgba(110,170,235,.22);border-left-color:#7fb8f0}
.nav-punkt.gross.farbe-sportplan{background:rgba(110,210,160,.26);border-left-color:#7fe0ad}
.nav-punkt.gross.farbe-dashboard:hover,.nav-punkt.gross.farbe-sportplan:hover{background:var(--side-hover)}
.nav-punkt.gross.farbe-dashboard.aktiv{background:#fff;color:#174a88;border-left-color:#1f6fd0}
.nav-punkt.gross.farbe-sportplan.aktiv{background:#fff;color:#0e4b39;border-left-color:#16795c}
.nav-punkt.gross + .nav-punkt.gross{margin-top:.25rem}
/* LIVE-Anzeige */
.live-pille{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .7rem;border-radius:999px;font-weight:800;font-size:.85rem;letter-spacing:.3px;border:1px solid transparent;white-space:nowrap}
.live-pille .live-punkt{width:.7rem;height:.7rem;border-radius:50%;flex:0 0 auto}
.live-pille.an{background:#e3f4ea;color:#0e5a38;border-color:#8fcfae}.live-pille.an .live-punkt{background:#1e9e5a;box-shadow:0 0 0 3px rgba(30,158,90,.25)}
.live-pille.aus{background:#fdecea;color:#8f1d12;border-color:#efb4ad}.live-pille.aus .live-punkt{background:#c9382b;box-shadow:0 0 0 3px rgba(201,56,43,.22)}
.live-pille.geplant{background:#fff4d6;color:#7a4e00;border-color:#e6c97a}.live-pille.geplant .live-punkt{background:#d89a1a;box-shadow:0 0 0 3px rgba(216,154,26,.25)}
.planleiste .live-pille{font-size:.9rem}
/* Speichern-Bereich: immer da, im Ansehen eingefroren */
.speicherleiste{position:static;display:flex;flex-direction:column;align-items:stretch;gap:.4rem;justify-content:flex-start;padding:.55rem .8rem;margin:0 0 .7rem;background:#fafcfb;border:1px solid var(--linie2);border-radius:var(--radius);box-shadow:none;font-weight:400;color:var(--ink)}
.speicherleiste span{margin-right:0}
.speicherleiste .sl-knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .6rem}
.speicherleiste .sl-titel{display:inline-flex;align-items:center;gap:.4rem;font-weight:800;margin-right:.4rem}
.speicherleiste .sl-titel svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.speicherleiste .sl-ort{margin:0}
.speicherleiste.eingefroren .sl-knoepfe{opacity:.95}
/* Kurzanleitung, einklappbar */
details.kurzanleitung{display:block;padding:0;margin-bottom:.7rem}
details.kurzanleitung>summary{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;list-style:none;cursor:pointer;padding:.5rem 1rem;font-size:1rem}
details.kurzanleitung>summary::-webkit-details-marker{display:none}
details.kurzanleitung>summary::before{content:"▸";display:inline-block;width:.8rem;transition:transform .12s}
details.kurzanleitung[open]>summary::before{transform:rotate(90deg)}
details.kurzanleitung>summary svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
details.kurzanleitung .ka-modus{font-weight:400;flex:1 1 14rem}
details.kurzanleitung>ul{margin:0;padding:0 1rem .6rem 2.2rem;columns:2 22rem;column-gap:2rem}
details.kurzanleitung li.nur-bearbeiten{opacity:.55}
/* Werkzeuge in zwei festen Zeilen */
.werkzeuge.zweizeilig{flex-direction:column;align-items:stretch;gap:.45rem}
.werkzeuge .wz-zeile{display:flex;flex-wrap:wrap;gap:.5rem .7rem;align-items:center}
.werkzeuge .wz-zeile.kontext{min-height:2.7rem}
.werkzeuge .wz-zeile .raum{flex:1}
.werkzeuge .wz-beschr{color:var(--leise);font-weight:700;font-size:.9rem}
.werkzeuge select{min-width:14rem}
/* Wochen A bis D: Farbe, gestrichelte Kante und Beschriftung */
.belegung.wk-a,.plan-legende i.wk-a,.woche-chip.wk-a,.chip-woche.wk-a{background:#e2edfb;border-color:#5f93d3}
.belegung.wk-b,.plan-legende i.wk-b,.woche-chip.wk-b,.chip-woche.wk-b{background:#fdeed6;border-color:#d39a42}
.belegung.wk-c,.plan-legende i.wk-c,.woche-chip.wk-c,.chip-woche.wk-c{background:#eee4f8;border-color:#9b77c5}
.belegung.wk-d,.plan-legende i.wk-d,.woche-chip.wk-d,.chip-woche.wk-d{background:#fbe4ed;border-color:#cb7597}
.belegung.woche{border-style:dashed;border-width:2px}
.woche-chip,.chip-woche.wk-a,.chip-woche.wk-b,.chip-woche.wk-c,.chip-woche.wk-d{border:1.5px dashed;color:#1d2a36}
.woche-chip{display:inline-block;margin-left:.7rem;padding:.05rem .6rem;border-radius:999px;font-size:.85rem;font-weight:700;vertical-align:middle}
/* Schiene und einzelne Gruppe unterscheidbar */
.belegung.schiene{border-left:6px solid #2d6b55}
.plan-legende i.gekoppelt{border-left:6px solid #2d6b55;width:1.6rem;height:1.1rem;display:inline-flex;align-items:center;justify-content:center;color:#1d6b53;background:#e3f2ec}
.plan-legende i.gekoppelt svg{width:.8rem;height:.8rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.plan-legende i.woche{border-style:dashed;border-width:2px}
/* Kachelanzeige mit Vorschau */
.kachelleiste{flex-direction:column;align-items:stretch;gap:.5rem}
.kachelleiste .kl-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem}
.kachelleiste .kl-vorschau{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem;padding:.55rem .7rem;border:1.5px dashed #9ab5a8;border-radius:10px;background:#f6fbf8}
.kachelleiste .kl-hinweis b{color:var(--ink)}
/* Eingefrorene Knöpfe bleiben lesbar */
.knopf:disabled,.schalter:disabled{opacity:.5}
.belegung.woche.konflikt{border-color:var(--rot);background:#fdeeee}
.dock.eingefroren{opacity:.62;filter:grayscale(.35)}
.dock.eingefroren .wpanel{pointer-events:none}
/* Eintrag: Zeit und Flächen ruhiger */
.zeit-zeile{align-items:start}
.abw-zeit-box{display:flex;flex-direction:column;gap:.5rem;padding:.6rem .8rem;border:1px dashed var(--linie2);border-radius:var(--radius);background:#fafcfb}
.abw-zeit-box .knopfreihe .knopf.haupt{pointer-events:auto}
th.std.pause{background:#eef0f2;color:var(--leise)}
.flaechenwahl .gruppe{border:1px solid var(--linie);border-radius:10px;padding:.45rem .6rem;background:#fff}
.flaechenwahl .gruppe b{margin-bottom:.15rem}
.flaechenwahl .gruppe .haken{padding:.15rem .6rem;border:1px solid var(--linie2);border-radius:999px;background:#f6f8f9;cursor:pointer}
.flaechenwahl .gruppe .haken:has(input:checked){background:var(--akzent-h);border-color:var(--akzent);font-weight:700}
.gruppen-form h3.schritt{margin:.9rem 0 .3rem;padding-top:.5rem;border-top:1px solid var(--linie);font-size:1rem;color:var(--akzent-t,var(--akzent-d))}
.gruppen-form h3.schritt:first-of-type{border-top:0;margin-top:0;padding-top:0}
.gruppen-form details.ohne-klassen{margin:.3rem 0}
.gruppen-form details.ohne-klassen summary{cursor:pointer;color:var(--leise);font-weight:600}
.gruppen-form .schiene-zusatz{align-self:end}
/* Zeitraum mit Einzeltag und Wochentagen */
.zeitraum-feld{display:flex;flex-direction:column;gap:.4rem}
.zeitraum-feld .ein-tag{align-self:end;padding-bottom:.35rem}
.wt-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem}
.wt-streifen{display:inline-flex;gap:.25rem}
.wt{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;padding:.1rem .4rem;border-radius:6px;border:1px solid var(--linie2);background:#f3f5f7;font-size:.85rem;font-weight:700;color:var(--leise)}
.wt.unterricht{background:#e3f4ea;border-color:#6fae94;color:#0e5a38}
.wt.gewaehlt{outline:2px solid var(--akzent);outline-offset:1px;background:var(--akzent);color:#fff;border-color:var(--akzent)}
/* App-Ansicht: Beispiele */
.matrix .bsp-knopf{font-size:.82rem;padding:0 .3rem;margin-left:.3rem}
.matrix tr.beispiel-zeile td{background:#f6fbf8;border-top:0}
.beispiel-kasten{padding:.35rem .6rem;border-left:4px solid var(--akzent);color:var(--ink);font-size:.92rem}
.st-zeilen p{text-align:left;hyphens:manual;-webkit-hyphens:manual}
/* Auswahlleiste aus Chips (Lehrkraft, Sportstätte) */
.chipleiste{display:flex;flex-wrap:wrap;gap:.3rem}
.chipleiste .chip{border:1px solid var(--linie2);background:#fff;border-radius:999px;padding:.22rem .75rem;font-weight:700;cursor:pointer;color:var(--ink);min-height:2rem}
.chipleiste .chip:hover{background:var(--akzent-h)}
.chipleiste .chip[aria-checked=true]{background:var(--akzent);color:#fff;border-color:var(--akzent)}
.werkzeuge .wz-zeile .chipleiste{flex:1 1 20rem}
.werkzeuge select{width:auto;min-width:14rem;max-width:26rem}
.werkzeuge .wz-zeile.kontext{flex-wrap:nowrap}
.werkzeuge .wz-zeile.kontext .reiter{flex-wrap:wrap}
.werkzeuge .wz-zeile .chipleiste{flex:1 1 auto;min-width:0}
.werkzeuge .wz-zeile .wz-beschr{flex:0 0 auto}

/* ---- E9: ruhige Feldhinweise, einklappbare Seitenhinweise, Menü-Zwischenüberschriften ---- */
label.feld>span.hinweis{padding:0;border:0;background:none;margin:0;border-radius:0;color:var(--leise);font-size:.84rem;line-height:1.4;font-weight:400;text-align:left;hyphens:manual}
.raster2{align-items:start}
details.seitenhinweis{margin:.2rem 0 .6rem;max-width:62rem}
details.seitenhinweis>summary{cursor:pointer;color:var(--akzent-t,var(--akzent-d));font-size:.88rem;font-weight:600;padding:.15rem 0;list-style:none;display:flex;align-items:center;gap:.4rem}
details.seitenhinweis>summary::-webkit-details-marker{display:none}
details.seitenhinweis>summary::before{content:'';width:.5rem;height:.5rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
details.seitenhinweis[open]>summary::before{transform:rotate(45deg)}
details.seitenhinweis>p{margin:.2rem 0 0}
body.druck-dialog dialog.druck-dran .druckkopf,body.druck-dialog dialog.druck-dran .druckfuss{display:flex}
body.druck-dialog dialog.druck-dran .druckfuss{display:block}
body.druck-dialog dialog.druck-dran .kopierfeld .knopf{display:none!important}
table.infoblatt{width:100%;border-collapse:collapse}
table.infoblatt th{width:11rem;text-align:left;vertical-align:top;font-weight:700;padding:.45rem .6rem .45rem 0;border-bottom:1px solid var(--linie)}
table.infoblatt td{padding:.45rem 0;border-bottom:1px solid var(--linie);text-align:left}
@media (max-width:600px){table.infoblatt th{width:7rem}}
div.feldblock{display:flex;flex-direction:column;gap:.35rem;font-weight:600;font-size:.92rem}
div.feldblock>p{font-weight:400;margin:0}
th.umbau{white-space:nowrap}
th.umbau .umbau-titel{display:block;margin-bottom:.2rem}
th.umbau .umbau-knoepfe{display:inline-flex;gap:.15rem}
.spalten-knopf{padding:.05rem .4rem;min-height:1.6rem;line-height:1}
table.umbauen th{background:var(--akzent-h)}
td.bus-rot,td.bus-rot span{color:#b3261e;font-weight:600}
.erste-text{white-space:pre-wrap;font-family:inherit;background:var(--flaeche2,#f6f8f7);border:1px solid var(--linie);border-radius:8px;padding:.8rem 1rem;margin:.5rem 0;line-height:1.5;text-align:left;hyphens:manual}
.erste-bausteine .chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0}
.erste-bausteine .chip{border:1px solid var(--linie2);background:#fff;border-radius:999px;padding:.3rem .8rem;cursor:pointer;font:inherit;color:var(--leise)}
.erste-bausteine .chip.an{background:var(--akzent-h);border-color:var(--akzent);color:var(--akzent-t,var(--akzent-d));font-weight:600}
.erste-bausteine .baustein{margin:.6rem 0}
.schalter-zeile{display:flex;align-items:center;gap:.8rem;margin-bottom:.4rem}
.bedarf-kopf h2{margin:0 0 .2rem}
.bedarf-kopf p{margin:0 0 .8rem;color:var(--leise)}
table.bedarf-tabelle td,table.bedarf-tabelle th{vertical-align:top;text-align:left}
table.bedarf-tabelle .klein{font-size:.85rem;color:var(--leise)}
.belegung .kachel-erste{display:block;margin-top:.15rem;font-size:.72rem;font-weight:700;color:#7a4b00;background:#fff3cf;border:1px solid #e6c876;border-radius:4px;padding:0 .3rem;width:fit-content}
.belegung.mit-erste{box-shadow:inset 0 0 0 2px #e6c876}
.erste-karte h3{margin:0 0 .3rem}
.erste-karte .erste-text{margin:.4rem 0}
/* Haken links, Inhalt rechts. Ohne Haken ist die Zeile ausgegraut. */
.einw-zeile,.kontakt-zeile{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:.4rem 1rem;align-items:start;border-top:1px solid var(--linie);padding:.6rem 0}
.einw-zeile .haken,.kontakt-zeile .haken{padding-top:1.7rem;white-space:nowrap}
.einw-zeile.aus .feld,.kontakt-zeile.aus .feld{opacity:.55}
.einw-zeile.aus input,.kontakt-zeile.aus input,.kontakt-zeile.aus textarea{background:#eef1f3;color:#6b7782}
@media (max-width:560px){.einw-zeile,.kontakt-zeile{grid-template-columns:minmax(0,1fr)}.einw-zeile .haken,.kontakt-zeile .haken{padding-top:0}}
.kontakt-frei{white-space:pre-wrap;text-align:left;hyphens:manual;background:var(--akzent-h);border-radius:8px;padding:.6rem .8rem}
.belegung .kachel-bus{display:inline-flex;align-items:center;gap:.2rem;margin-top:.15rem;border:1px solid #9cc2f0;background:#e8f1fc;color:#123e75;border-radius:4px;padding:0 .3rem;font-size:.72rem;font-weight:700;cursor:pointer}
.belegung .kachel-bus.offen{border-color:#ebb3ac;background:#fdeceb;color:#7a1a12}
.belegung .kachel-bus svg{width:.8rem;height:.8rem}

/* Etappe 11: Hallenplan, Hallennutzer, Sperrtermine mit Ersatztermin */
.belegung.fest{cursor:pointer;background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.045) 0 6px,transparent 6px 12px)}
.belegung .kachel-fest{position:absolute;top:2px;right:3px;width:.85rem;height:.85rem;opacity:.55;pointer-events:none}
.belegung .kachel-fest svg{width:100%;height:100%}
.belegung.farbig{background-color:color-mix(in srgb,var(--fest) 17%,#fff);border-color:var(--fest);box-shadow:inset 4px 0 0 var(--fest),0 1px 1px rgba(20,40,30,.18);color:#1d2a36}
.plan-legende i.fest{background:#eef1f5 repeating-linear-gradient(135deg,rgba(0,0,0,.08) 0 3px,transparent 3px 6px);border-color:#8795a5}
.farbpunkt{display:inline-block;width:.8rem;height:.8rem;border-radius:50%;vertical-align:-.1em;border:1px solid rgba(0,0,0,.25);margin-right:.2rem}
.farbpunkt.leer{background:#cfd6de}
.hallen-legende{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;margin:.2rem 0 .7rem;font-size:.9rem}
.hallen-legende span{display:inline-flex;align-items:center;gap:.3rem}
.farbwahl{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
.farbknopf{width:1.8rem;height:1.8rem;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--linie2);cursor:pointer;padding:0}
.farbknopf.an{box-shadow:0 0 0 3px var(--ink)}
.farbknopf.auto{width:auto;border-radius:1rem;padding:0 .7rem;background:#eef1f4;font-size:.85rem;border:1px solid var(--linie2);box-shadow:none}
.farbknopf.auto.an{background:var(--akzent-h);border-color:var(--akzent);box-shadow:none;font-weight:700}
.farbeigen{width:2.1rem;height:1.9rem;padding:0;border:1px solid var(--linie2);border-radius:6px;background:none;cursor:pointer}
.kontakt-liste{display:grid;gap:.6rem}
.kontakt-karte{border:1px solid var(--linie);border-radius:8px;padding:.7rem;display:grid;gap:.5rem;background:#fafbfc}
.kontakt-karte .knopf.text{justify-self:start}
.unterkopf{margin:.2rem 0 .8rem}.unterkopf h2{margin-bottom:.3rem}
.knopfreihe{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.gilt-box{display:grid;gap:.5rem}
.gilt-zeile{align-items:end}
.absprachen{display:grid;gap:.7rem;margin-top:.7rem}
.karte.absprache{cursor:pointer;padding:.8rem 1rem}.karte.absprache:hover{border-color:var(--akzent)}
.karte.absprache.erledigt{opacity:.65}
.absprache-meta{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;font-size:.88rem;color:var(--leise)}
.optionsliste{display:grid;gap:.2rem;margin:.4rem 0 .8rem}
.option-zeile{display:flex;gap:.7rem;align-items:flex-start;padding:.35rem 0;cursor:pointer}
.option-zeile small{display:block;color:var(--leise)}
.zeile-aktion{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.35rem 0;border-bottom:1px solid var(--linie)}
.sperr-ersatz{margin-top:.3rem;font-size:.86rem;color:var(--leise)}
tr.gestrichen td{text-decoration:line-through;color:var(--leise)}
tr.gestrichen td .marke-klein{text-decoration:none}
.ersatz-block{display:grid;gap:.5rem}
.rueckfrage{margin-bottom:.6rem}.rueckfrage p{margin-bottom:.5rem}
.notiz-zelle{max-width:22rem;color:var(--leise);font-size:.9rem}
@media print{.hallenplan-teil .belegung.farbig{-webkit-print-color-adjust:exact;print-color-adjust:exact}.kachel-fest{display:none}}
.wochenkalender tr.jetzt td{background:var(--akzent-h)}
.wochenkalender tr.ferienwoche td{color:var(--leise);background:#f6f8fa}
.wochen-chip.an{background:var(--akzent);border-color:var(--akzent);color:#fff}
.wochen-chip.an.auto{border-style:dashed;opacity:.8}
.wochen-chip.wk-aus.an{background:#8795a5;border-color:#8795a5}
.wochenkalender .chips{gap:.3rem}
.nur-druck{display:none}
@media print{.nur-druck{display:inline;font-weight:700}}

/* Etappe 12: Inventar, Schlüssel, Abiturplanung */
.inv-orte{display:grid;gap:1rem}
.inv-ort{padding:.9rem 1rem}
.inv-ort.inv-ziel{outline:2px dashed var(--akzent);outline-offset:2px;background:var(--akzent-h)}
.inv-ort.archiviert,.inv-zeile.archiviert,.schl-tabelle tr.archiviert{opacity:.6}
.inv-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.6rem}
.inv-kopf h2{margin:0}
.inv-kopf .raum{flex:1}
table.inv-tabelle{width:100%;border-collapse:collapse}
.inv-tabelle th{text-align:left;font-size:.85rem;color:var(--leise);padding:.3rem .5rem;border-bottom:1px solid var(--linie)}
.inv-tabelle th.zahl,.inv-tabelle td.zahl{text-align:right}
.inv-tabelle td{padding:.35rem .5rem;border-bottom:1px solid var(--linie);vertical-align:middle}
.inv-tabelle .thumb-spalte{width:3.2rem}
.inv-zeile{cursor:pointer}
.inv-zeile:hover td{background:#f5faf8}
.inv-zeile.zieht{opacity:.4}
.inv-zeile.drop-vor td{border-top:3px solid var(--akzent)}
.inv-zeile .griff{color:var(--leise);cursor:grab;letter-spacing:-2px;margin-right:.2rem}
.thumb{display:block;width:2.6rem;height:2.6rem;object-fit:cover;border-radius:6px;border:1px solid var(--linie2);background:#f4f6f8}
.thumb.leer{background:repeating-linear-gradient(45deg,#f4f6f8,#f4f6f8 6px,#eef1f4 6px,#eef1f4 12px)}
.thumb-knopf{padding:0;border:0;background:none;cursor:zoom-in;display:block}
.thumb-knopf:focus-visible{outline:2px solid var(--akzent);outline-offset:2px;border-radius:6px}
.bild-gross{text-align:center}.bild-gross img{max-width:100%;max-height:70vh;border-radius:8px}
.inv-schnell{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.7rem;align-items:center}
.inv-schnell input[type=text]:first-child{flex:1 1 14rem}.inv-schnell input[type=number]{width:6rem}.inv-schnell input.kurz{width:6rem}
input.gezaehlt{width:6rem;text-align:right}input.gezaehlt.abweichung{border-color:var(--gelb);background:var(--gelb-h)}
.inv-zeile.abweichung td{background:var(--gelb-h)}
.inventur-leiste p{margin:0 0 .5rem}
.leer-karte{text-align:left}
.schl-inhaberliste{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.schl-inhaber{display:inline-flex;align-items:center;gap:.2rem;padding:.1rem .2rem .1rem .6rem;border:1px solid var(--linie2);border-radius:999px;background:#fff}
.schl-inhaber.zurueck{opacity:.6;text-decoration:line-through}
.schl-ergebnis h2{margin:1rem 0 .6rem}
.abi-liste{display:grid;gap:.3rem}
.abi-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.abi-zeile.erledigt label span{text-decoration:line-through;color:var(--leise)}
.typisch-liste .feldblock{margin-bottom:.8rem}
@media print{.inv-schnell,.inv-ort .knopfreihe,.thumb-knopf{display:none}.thumb{width:2rem;height:2rem}.inv-ort{break-inside:avoid;box-shadow:none}}

/* Etappe 13: Optimierung, Epochen, Hallennutzung */
.opt-vorschlag{border:1px solid var(--linie);border-radius:8px;padding:.6rem .8rem;margin:.5rem 0;display:flex;flex-direction:column;gap:.35rem}
.epoche .kopfzeile{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.4rem}
.epoche .kopfzeile h2{margin:0}
.epoche tr.jetzt td{background:#eaf6ee}
.epochen-tab{margin:.6rem 0}
.epochen-tab select,.epochen-tab input{max-width:100%}
.epochen-tab td{vertical-align:top}
.epoche-datum{display:flex;flex-direction:column;gap:.25rem}
.epoche-zeit{display:flex;gap:.3rem;margin-top:.3rem}
.feld-knopf{display:flex;align-items:flex-end}
.balken-zeile{display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.waerme-huelle{display:flex;flex-wrap:wrap;gap:1.4rem}
.waerme-teil h3{margin:.2rem 0 .4rem;font-size:1rem}
.waerme-tabelle{border-collapse:collapse}
.waerme-tabelle th{font-size:.78rem;padding:.15rem .4rem;font-weight:600;text-align:center}
.waerme-tabelle td.waerme{min-width:2.7rem;height:1.5rem;text-align:center;font-size:.75rem;border:1px solid #fff;color:#16323f}
.waerme.w0{background:#f1f4f6}.waerme.w1{background:#cfe6dc}.waerme.w2{background:#9fd0bb}.waerme.w3{background:#4f9f85;color:#fff}.waerme.w4{background:#27705b;color:#fff}
.klein-hoehe{max-height:18rem;overflow:auto}
@media print{.waerme.w0{background:#fff}}
/* Etappe 14: Demoschule */
.demo-vorlagen{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.7rem;margin:.4rem 0 1rem}
.demo-karte{display:flex;flex-direction:column;gap:.25rem;border:2px solid var(--linie2);border-radius:var(--radius);padding:.75rem .85rem;background:var(--karte);cursor:pointer;position:relative}
.demo-karte:hover{border-color:var(--akzent)}
.demo-karte:has(input:checked){border-color:var(--akzent);background:var(--akzent-h)}
.demo-karte:has(input:focus-visible){outline:3px solid var(--akzent);outline-offset:2px}
.demo-karte input{position:absolute;top:.75rem;right:.75rem}
.demo-titel{font-weight:700;font-size:1.1rem;padding-right:1.6rem}
.demo-zahlen{font-weight:600;color:var(--akzent-t,var(--akzent-d));font-size:.92rem}
.demo-marke{margin-left:.5rem}
.zugang-tabelle th{text-align:left;white-space:nowrap}
.zugang-tabelle .kopierfeld{min-width:10rem}


/* ===== Etappe 15: Rückmeldungen, Orientierung ===== */
/* Speicherstand in der Kopfzeile */
.speicherstand{display:inline-flex;align-items:center;gap:.4rem;border:1.5px solid var(--akzent);background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d));border-radius:999px;padding:.2rem .8rem .2rem .6rem;font-size:.88rem;font-weight:700;white-space:nowrap;transition:background .4s,border-color .4s,color .4s}
.speicherstand[hidden]{display:none}
.speicherstand svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.speicherstand.ok.ruhig{background:transparent;border-color:transparent;color:var(--leise);font-weight:600}
.speicherstand.laeuft{background:var(--blau-h);border-color:var(--blau);color:var(--blau)}
.speicherstand.laeuft svg{animation:hb-puls 1s ease-in-out infinite}
.speicherstand.fehler{background:var(--rot-h);border-color:var(--rot);color:var(--rot)}
.speicherstand.offen{background:var(--gelb-h);border-color:#e3c36a;color:#5c3d00}
@keyframes hb-puls{50%{opacity:.35}}
@keyframes hb-dreh{to{transform:rotate(360deg)}}
@keyframes hb-schuettel{20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
/* Knopf arbeitet gerade */
.knopf.laeuft::after{content:'';display:inline-block;width:.85em;height:.85em;margin-left:.55rem;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:hb-dreh .7s linear infinite;vertical-align:-.1em}
/* Fehler im Fenster oder bei der Anmeldung: roter Kasten mit Kreuz */
.fehlertext:not(:empty){display:flex;gap:.55rem;align-items:flex-start;background:var(--rot-h);border:1px solid #ebb3ac;border-left:4px solid var(--rot);color:#7a1a12;border-radius:8px;padding:.55rem .75rem;margin-top:.8rem;font-weight:600}
.fehlertext:not(:empty)::before{content:'✕';flex:0 0 auto;display:inline-grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--rot);color:#fff;font-size:.7rem;line-height:1;font-weight:800}
.fehlertext.schuettel{animation:hb-schuettel .38s}
/* Pflichtfelder und fehlerhafte Eingaben */
input:user-invalid,select:user-invalid,textarea:user-invalid{border-color:var(--rot);background:#fff8f7;box-shadow:0 0 0 3px rgba(180,35,24,.12)}
/* Suchen und springen */
.such-knopf kbd{font:inherit;font-size:.72rem;font-weight:700;color:var(--leise);border:1px solid var(--linie2);border-radius:5px;padding:0 .3rem;background:#fff}
dialog.suchfenster{border:0;border-radius:14px;padding:0;width:min(660px,calc(100vw - 2rem));margin:9vh auto auto;box-shadow:0 20px 70px rgba(10,20,30,.4);background:var(--karte);color:var(--ink);overflow:hidden}
dialog.suchfenster::backdrop{background:rgba(15,25,35,.45)}
.suchkopf{display:flex;align-items:center;gap:.7rem;padding:.75rem 1rem;border-bottom:1px solid var(--linie)}
.suchkopf>svg{flex:0 0 auto;width:1.35rem;height:1.35rem;fill:none;stroke:var(--leise);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.suchkopf kbd,.suchfuss kbd{font:inherit;font-size:.75rem;font-weight:700;color:var(--leise);border:1px solid var(--linie2);border-radius:5px;padding:.05rem .4rem;background:#f4f6f8}
.suchfeld-gross{flex:1;min-width:0;border:0!important;outline:0!important;box-shadow:none!important;font-size:1.1rem;background:transparent!important;color:inherit;padding:.3rem 0}
.suchliste{max-height:min(55vh,430px);overflow:auto;padding:.4rem}
.such-kopf{padding:.4rem .7rem .2rem;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--leise)}
.suchtreffer{display:flex;align-items:center;gap:.65rem;width:100%;text-align:left;border:0;background:transparent;padding:.55rem .7rem;border-radius:8px;cursor:pointer;font:inherit;color:inherit}
.suchtreffer.aktiv{background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.suchtreffer svg{flex:0 0 auto;width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.such-leer{flex:0 0 1.15rem}
.such-art{flex:0 0 auto;min-width:5rem;text-align:center;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--leise);background:#eef1f4;border-radius:5px;padding:.1rem .4rem}
.suchtreffer.aktiv .such-art{background:#fff}
.such-text{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.such-sub{margin-left:auto;color:var(--leise);font-size:.85rem;white-space:nowrap;padding-left:.5rem}
.suchfuss{display:flex;gap:1.2rem;padding:.5rem 1rem;border-top:1px solid var(--linie);font-size:.82rem}
/* Gefilterte Zeilen */
tr[hidden],table[hidden]{display:none!important}
.werkzeuge input.tabellenfilter{min-width:min(18rem,100%)}
@media (max-width:900px){.such-knopf kbd,.such-sub{display:none}.speicherstand .txt{display:none}.speicherstand{padding:.2rem .45rem}}
@media (prefers-reduced-motion:reduce){.toast,.fehlertext.schuettel,.speicherstand.laeuft svg,.knopf.laeuft::after{animation:none}}
@media print{.speicherstand,.suchfenster,.such-knopf{display:none!important}}
/* Aufgabenzeilen im Dashboard: Farbe zeigt die Dringlichkeit, ein Knopf führt zur Seite */
.aufgabe,.alles-gut{display:flex;align-items:center;gap:.8rem;padding:.65rem .8rem;border:1px solid var(--linie);border-left:5px solid var(--blau);border-radius:var(--radius);margin:.5rem 0;background:#fff}
.aufgabe.rot{border-color:#ebb3ac;border-left-color:var(--rot);background:var(--rot-h)}
.aufgabe.gelb{border-color:#ecd08a;border-left-color:#e0a800;background:var(--gelb-h)}
.aufgabe.blau{border-color:#c5d8f2;border-left-color:var(--blau);background:var(--blau-h)}
.alles-gut{border-color:#b9dccf;border-left-color:var(--akzent);background:var(--akzent-h);color:var(--akzent-t,var(--akzent-d))}
.aufgabe-symbol{flex:0 0 auto;display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--blau);color:#fff}
.aufgabe.rot .aufgabe-symbol{background:var(--rot)}.aufgabe.gelb .aufgabe-symbol{background:#f2b705;color:#3d2800}.alles-gut .aufgabe-symbol{background:var(--akzent)}
.aufgabe-symbol svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.aufgabe-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.aufgabe-text span{font-size:.92rem;color:var(--leise)}
.alles-gut .aufgabe-text span{color:inherit}
.aufgabe .knopf{flex:0 0 auto}
@media (max-width:600px){.aufgabe{flex-wrap:wrap}.aufgabe .knopf{margin-left:2.5rem}}
.hilfe-punkt{display:inline-grid;place-items:center;vertical-align:middle;margin-left:.5rem;width:1.7rem;height:1.7rem;padding:0;border:1px solid var(--linie2);border-radius:50%;background:#fff;color:var(--leise);cursor:pointer}
.hilfe-punkt:hover,.hilfe-punkt:focus-visible{background:var(--blau-h);border-color:var(--blau);color:var(--blau)}
.hilfe-punkt svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media print{.hilfe-punkt{display:none!important}}

/* Farbschemen im Profil */
.farbwahl{display:grid;grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr));gap:.7rem;margin:.6rem 0 1rem}
.farbe-option{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;text-align:left;padding:.6rem;border:2px solid var(--linie2);border-radius:var(--radius);background:var(--karte);color:var(--ink);cursor:pointer;font:inherit}
.farbe-option:hover{border-color:var(--akzent)}
.farbe-option.an{border-color:var(--akzent);box-shadow:0 0 0 3px var(--akzent-h)}
.farbe-option:disabled{opacity:.5;cursor:not-allowed}
.farbe-option .leise{font-size:.82rem}
.muster{display:flex;gap:.3rem;align-items:center;width:100%;height:2.6rem;padding:.35rem;border-radius:7px;border:1px solid rgba(128,128,128,.4)}
.muster i{display:block;height:100%;border-radius:4px;border:1px solid rgba(128,128,128,.35)}
.muster i:nth-child(1){flex:1}.muster i:nth-child(2){width:.55rem;opacity:.85}.muster i:nth-child(3){width:.55rem;opacity:.45}
.akzentwahl{display:flex;flex-wrap:wrap;gap:.6rem;margin:.5rem 0}
.akzent-option{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .8rem .35rem .4rem;border:2px solid var(--linie2);border-radius:999px;background:var(--karte);color:var(--ink);cursor:pointer;font:inherit;font-weight:600}
.akzent-option:hover{border-color:var(--akzent)}
.akzent-option.an{border-color:var(--akzent);box-shadow:0 0 0 3px var(--akzent-h)}
.akzent-option:disabled{opacity:.5;cursor:not-allowed}
.akzent-punkt{display:inline-block;width:1.4rem;height:1.4rem;border-radius:50%;border:2px solid rgba(255,255,255,.7);box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.farbkarte h3{margin:.8rem 0 .2rem;font-size:1rem}

/* Tastenkürzel im Sportplan: Tastenmarke auf Knöpfen und Übersicht */
.tk{margin-left:.45rem;font:inherit;font-size:.7rem;font-weight:700;color:var(--leise);border:1px solid var(--linie2);border-radius:4px;padding:0 .28rem;background:transparent;line-height:1.35;vertical-align:middle}
.knopf.haupt .tk,.reiter button.aktiv .tk{color:inherit;border-color:currentColor;opacity:.75}
.tasten-gruppe{margin:.9rem 0 .3rem;font-size:.8rem;letter-spacing:1px;text-transform:uppercase;color:var(--leise)}
.tasten-zeile{display:grid;grid-template-columns:7.5rem 1fr;gap:.6rem;align-items:center;padding:.22rem 0;border-bottom:1px solid var(--linie)}
.tasten-zeile kbd{font:inherit;font-size:.85rem;font-weight:700;color:var(--ink);border:1px solid var(--linie2);border-radius:5px;padding:.05rem .45rem;justify-self:start;background:var(--akzent-h)}
.tasten-liste.aus{opacity:.55}
@media print{.tk{display:none}}

/* Schließen-Knopf der Meldung überdeckt nichts mehr */
.mitteilung:has(.mit-weg){padding-right:2.7rem}

/* App: einfache Ansicht für Schülerinnen und Schüler auf dem Handy */
.einfach-wahl{margin-bottom:.4rem}
.einfach-auswahl{margin:.3rem 0 .6rem}
.einfach-auswahl select{width:100%;font-size:1.05rem;padding:.6rem .7rem}
.einfach-tag{margin:1.1rem 0 .4rem;font-size:1.05rem}
.einfach-tag.heute{color:var(--akzent-t,var(--akzent-d))}
.einfach-liste{display:flex;flex-direction:column;gap:.45rem}
.einfach-karte{display:flex;align-items:center;gap:.8rem;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--akzent-h);border:1px solid var(--linie2);border-left:5px solid var(--akzent);border-radius:10px;padding:.65rem .8rem;min-height:3.4rem;cursor:pointer}
.einfach-karte:active{filter:brightness(.96)}
.ek-zeit{display:flex;flex-direction:column;min-width:4.6rem;font-size:.95rem}
.ek-zeit small{color:var(--leise);font-size:.8rem}
.ek-haupt{display:flex;flex-direction:column;flex:1;min-width:0}
.ek-halle{font-size:1.08rem;font-weight:700;overflow-wrap:anywhere}
.ek-gruppe{font-size:.95rem;color:var(--ink)}
.einfach-fuss{margin:1.2rem 0 .4rem;text-align:center}

/* Druck: Auswahl, Seitenumbrüche, Seitenzahlen */
.druck-sammlung{display:none}
.druck-auswahl h3{margin:.9rem 0 .3rem;font-size:.85rem;letter-spacing:.8px;text-transform:uppercase;color:var(--leise)}
.druck-liste,.druck-radios{display:flex;flex-direction:column;gap:.15rem}
.druck-auswahl-knopf.aktiv{border-color:var(--akzent);color:var(--akzent-t,var(--akzent-d));font-weight:700}
@media print{
  .druck-aus{display:none!important}
  thead{display:table-header-group}
  tr{break-inside:avoid}
  th.sortierbar::after,table.plan td.zelle.leerbar::after{display:none!important}
  table th{position:static!important}
  .tag-block.druck-letzter{break-after:auto!important;page-break-after:auto!important}
  .karte{break-inside:avoid}
  .karte.druck-lang{break-inside:auto}
  body.druck-sammlung-an main.inhalt>*:not(.druckkopf):not(.druckfuss):not(.druck-sammlung){display:none!important}
  body.druck-sammlung-an .druck-sammlung{display:block}
  .druck-sammlung>section{break-after:page}
  .druck-sammlung table.plan{table-layout:fixed;width:100%}
  .druck-sammlung table.plan th.std{width:4.2rem}
  h2,h3{break-after:avoid}
  .druck-sammlung>section:last-child{break-after:auto}
  .druck-sammlung h2{margin:0 0 3mm;font-size:13pt}
  @page{@bottom-right{content:"Seite " counter(page) " von " counter(pages);font-size:8pt;color:#555}}
}

/* Funktionen: Schalter je Funktion mit Erklärung */
.fn-zeile{display:grid;gap:.2rem;padding:.7rem 0;border-top:1px solid var(--linie)}
.fn-zeile:first-of-type{border-top:0}
.fn-zeile .fn-text{margin:0 0 0 3.2rem}
.fn-zeile .fn-hinweis{margin:0 0 0 3.2rem}
.fn-zeile.aus .fn-text{opacity:.85}

.fn-punkt{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:#8a96a2;margin-left:.3rem;vertical-align:middle}
.fn-liste{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.4rem 1rem;margin:.4rem 0}
.fn-matrix th,.fn-matrix td{padding:.45rem .3rem}
.fn-matrix th.fn-kopf{min-width:0;white-space:normal;line-height:1.2;vertical-align:bottom;font-size:.82rem}
.fn-matrix th:first-child,.fn-matrix td:first-child{padding-left:.7rem;min-width:9rem}
.fn-matrix td.mitte{text-align:center}
details.fn-wahl{border:1px solid var(--linie);border-radius:8px;padding:.5rem .8rem}
details.fn-wahl summary{cursor:pointer;font-weight:700}

/* Teilen: Symbol an Einzeldaten und Textfenster */
.mit-teilen{margin-left:auto;display:inline-flex}
.mitteilung .teilen-symbol{color:inherit;opacity:.7}
.mitteilung .teilen-symbol:hover{opacity:1}
.teilen-leiste{display:flex;justify-content:flex-end;margin:-.2rem 0 .3rem}
.staette-kachel header{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .5rem}
.staette-kachel header .teilen-symbol{margin-left:auto}
.kartenkopf .teilen-symbol{flex:none}
textarea.teilen-text{min-height:13rem;font-size:1rem;line-height:1.5;white-space:pre-wrap}

/* Knöpfe nur mit Symbol */
.sr-nur{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.knopf.symbol{display:inline-flex;align-items:center;justify-content:center;gap:.2rem;padding-left:.6rem;padding-right:.6rem;min-width:2.6rem}
.knopf.symbol svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.knopf.symbol[data-kurz]::after{content:attr(data-kurz);font-size:.68rem;font-weight:700;letter-spacing:.02em}
.knopf.symbol.haupt svg{stroke:#fff}

/* ---- Sportplan 2026.1.28: kompakte Leiste, Info-Punkt, Leisten unten und rechts im Bearbeiten-Modus ---- */
.planleiste.kompakt{padding:.35rem .7rem;gap:.35rem .7rem;margin-bottom:.6rem}
.planleiste.kompakt .plan-chip{font-size:1rem;padding:.15rem .7rem;border:1px solid var(--linie2);border-radius:999px;background:#fff}
.planleiste.kompakt .knopf svg,.werk-chip svg,.sym-schalter svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
.planleiste.kompakt .knopf svg{margin-right:.3rem}
.planleiste .wl-trenn{width:1px;align-self:stretch;min-height:1.6rem;background:var(--linie2)}
.anzeige-knoepfe{display:inline-flex;align-items:center;gap:.3rem}
.sym-schalter{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--linie2);background:#fff;border-radius:8px;padding:.28rem .6rem;font:inherit;font-weight:600;color:#33414d;cursor:pointer}
.sym-schalter svg{margin:0}
.sym-schalter.an{background:var(--akzent-h);border-color:var(--akzent);color:var(--akzent-t,var(--akzent-d))}
.sym-schalter:focus-visible,.werk-chip:focus-visible,.el-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
.kachel-knopf{display:inline-flex;align-items:center;gap:.1rem}
.kachel-knopf .kk-abw{margin-left:.45rem;padding:0 .5rem;border-radius:999px;background:#fff4d6;color:#7a4e00;border:1px solid #e6c97a;font-size:.78rem;font-weight:700;white-space:nowrap}
.werk-chip.extern{border-style:dashed}
.werk-chip.extern::after{content:"\2197";margin-left:.35rem;font-size:.85rem}
/* Info-Punkt neben der Überschrift */
.info-wrap{position:relative;display:inline-block;vertical-align:middle;font-size:1rem;font-weight:400;letter-spacing:0}
.info-punkt{margin-left:.55rem}
.info-punkt[aria-expanded=true]{background:var(--blau-h);border-color:var(--blau);color:var(--blau)}
.info-pop{position:absolute;left:0;top:calc(100% + .5rem);z-index:60;width:min(34rem,86vw);padding:.8rem 1rem .9rem;background:#fff;color:var(--ink);border:1px solid var(--linie2);border-radius:var(--radius);box-shadow:0 10px 28px rgba(20,40,30,.25);text-align:left}
.info-pop[hidden]{display:none}
.info-pop .ip-kopf{display:flex;flex-wrap:wrap;gap:.2rem .8rem;align-items:baseline;margin-bottom:.4rem}
.info-pop ul{margin:0;padding-left:1.1rem;display:grid;gap:.3rem}
.info-pop li{font-size:.92rem}
.info-pop .ip-fuss{display:flex;gap:.5rem;margin-top:.7rem}
/* Planvarianten im Fenster */
.pv-liste{display:grid;gap:.4rem;min-width:min(34rem,80vw)}
.pv-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .8rem;width:100%;text-align:left;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--linie2);border-radius:var(--radius);padding:.55rem .8rem;cursor:pointer}
.pv-zeile:hover{border-color:var(--akzent);background:var(--akzent-h)}
.pv-zeile.aktuell{border-color:var(--akzent);border-width:2px;background:#f4faf7}
.pv-zeile .pv-name{font-size:1.02rem}
.pv-zeile .raum{flex:1}
.pv-zeile .pv-oeffnen{color:var(--akzent-t,var(--akzent-d));font-weight:700}
/* Bearbeiten-Modus: Werkzeugleiste oben, bleibt beim Scrollen unter der Kopfzeile stehen (2026.1.32) */
.sp-bar{position:sticky;top:var(--kopf-h,3.5rem);z-index:30;display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .35rem;padding:.3rem .6rem;margin:0 0 .7rem;background:var(--side);border-radius:10px;box-shadow:0 3px 10px rgba(10,25,20,.22)}
.sp-bar .raum{flex:1}
.el-knopf{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;min-width:4.6rem;padding:.3rem .5rem;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--side-ink);font:inherit;font-size:.74rem;font-weight:600;cursor:pointer;line-height:1.1}
.el-knopf svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.el-knopf:hover:not(:disabled){background:var(--side-hover);color:#fff}
.el-knopf:disabled{opacity:.35;cursor:not-allowed}
.el-knopf.haupt{background:var(--akzent);color:#fff}
.el-knopf.haupt:hover:not(:disabled){background:#1b8f6f}
.el-knopf .zahl{position:absolute;margin:-1.55rem -1.9rem 0 0;font-size:.65rem;font-weight:700;min-width:1.1rem;text-align:center;background:#f2f6f8;color:var(--side);border-radius:999px;padding:0 .3rem}
.el-knopf{position:relative}
.el-knopf.an{color:#7fe3b0}
.el-knopf.an svg{filter:drop-shadow(0 0 3px rgba(127,227,176,.6))}
.el-zwischen:not(.an){color:#8ea0a8}
.el-trenn{width:1px;align-self:stretch;min-height:2.2rem;background:rgba(255,255,255,.18);margin:0 .25rem}
.el-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--side-ink);font-size:.82rem;text-decoration:none;padding:.35rem .6rem;border-radius:8px}
.el-link:hover{background:var(--side-hover);color:#fff}
.el-link svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Angedockte Fenster: unter der oberen Leiste festhalten, einklappbar, am Kopf anfassen */
.wp-kopf{cursor:grab;user-select:none}
.wp-kopf .icon-knopf.an{background:var(--akzent-h);border-color:var(--akzent);color:var(--akzent-t,var(--akzent-d))}
.wpanel.zu{height:auto!important;min-height:0;resize:none}
.wpanel.zu .wp-koerper{display:none}
.wpanel.reisst{opacity:.55;outline:3px dashed var(--akzent);outline-offset:2px;cursor:grabbing}
.wp-koerper.eingefroren{opacity:.6;filter:grayscale(.3)}
/* Kachelanzeige im Fenster und die Verbindungs-Kette */
.kachel-fenster .kachelleiste{display:flex;border:0;padding:0;margin:0}
.kachel-fenster .kl-titel{font-size:1.25rem}
.kachel-fenster .kl-vorschau{padding:1rem 1.2rem;gap:.9rem 1.6rem}
.kachel-fenster .beispielkachel{min-width:16rem;padding:.55rem .8rem .65rem;font-size:1.1rem}
.kachel-fenster .kt{font-size:1.05rem}
.kachel-fenster .kt svg{width:1.2rem;height:1.2rem}
.kachel-fenster .kl-hinweis{flex:1 1 100%;margin:0;font-size:.95rem}
.kt:not(.an){opacity:.55}
.kt.aussen:not(.an){border-style:dashed;border-color:#9ab5a8;background:#f6fbf8}
/* Popup-Fenster: Planwahl und Zurück-Knopf */
.korb-kopf .korb-plan{display:inline-flex;align-items:center}
.korb-kopf .reiter.planwahl{margin:0}

.planleiste.kompakt .werk-chip{padding:.12rem .55rem;font-size:.9rem}
.planleiste.kompakt .werk-chip .zahl{margin-left:.25rem}
.planleiste.kompakt .sym-schalter{padding:.2rem .5rem;font-size:.9rem}
body.sp-sch .toast{bottom:calc(var(--sch-h,46px) + .8rem)}
.info-pop li.nur-bearbeiten{color:var(--leise)}
.wpanel.gefroren{cursor:not-allowed}
.wpanel.gefroren .wp-kopf{cursor:grab}
.korb-kopf .knopf svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;margin-right:.3rem}
@media (max-width:720px){.info-pop{position:fixed;left:1rem;right:1rem;top:5.5rem;width:auto;max-height:75vh;overflow:auto}}

/* ---- Konfliktcenter 2026.1.29: Kacheln, Zähler, Ausschnitt aus dem Plan, Varianten ---- */
.kf-kopfleiste{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
.kf-kopfleiste .raum{flex:1}
.kf-zaehl{display:inline-flex;align-items:baseline;gap:.4rem;padding:.3rem .8rem;border-radius:999px;border:2px solid var(--linie2);background:#fff;font:inherit;font-weight:700;color:var(--ink);cursor:pointer}
.kf-zaehl b{font-size:1.15rem}
.kf-zaehl.rot{border-color:#e3a39c;background:var(--rot-h);color:#8f1d12}
.kf-zaehl.gelb{border-color:#e6c97a;background:var(--gelb-h);color:#6a4300}
.kf-zaehl.aktiv{box-shadow:0 0 0 3px rgba(22,121,92,.35);border-color:var(--akzent)}
.kf-gross{font-size:1.2rem}
.kf-satz{font-size:1.02rem;font-weight:600;margin:.2rem 0 .5rem}
.kf-mini{display:grid;gap:.3rem;margin:.4rem 0 .6rem}
.kf-mini-titel{font-size:.78rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--leise)}
.kf-chip{display:inline-flex;gap:.2rem;align-items:center;border:1px solid var(--linie2);background:#f7f9fb;border-radius:999px;padding:.2rem .7rem;font:inherit;font-size:.9rem;cursor:pointer}
.kf-chip:hover{border-color:var(--akzent);background:var(--akzent-h)}
.knopf.haupt svg,.kf-loesen svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Ausschnitt aus dem Plan */
.mini-tag{display:grid;grid-template-columns:1.6rem repeat(var(--sp,1),minmax(4.2rem,1fr));grid-template-rows:auto repeat(var(--zl,3),1.7rem);gap:2px;font-size:.74rem;max-width:34rem}
.mt-ecke,.mt-kopf,.mt-std{display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--leise)}
.mt-kopf{background:#eef2f5;border-radius:4px;padding:.1rem .2rem}
.mt-zelle{background:#fafbfc;border:1px solid #e6ebef;border-radius:3px}
.mt-block{align-self:stretch;justify-self:start;width:calc(100% - 2px);display:flex;align-items:center;padding:0 .3rem;border-radius:5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;z-index:1;border:1.5px solid #9fb0bd;background:#dfe7ee;color:#26343f}
.mt-block.konflikt{border:2px solid var(--rot);background:repeating-linear-gradient(135deg,#fde1de 0 6px,#f6b8b1 6px 12px);color:#6b1710;font-weight:700}
.mt-block.hinweis{border:2px solid #d89a1a;background:repeating-linear-gradient(135deg,#fff3cf 0 6px,#f7dd96 6px 12px);color:#5c3d00;font-weight:700}
.mt-block.neu{border:2px dashed #1e9e5a;background:#d8f3e3;color:#0e5a38;font-weight:700}
/* Lösungen im Fenster */
.var-karte{display:grid;gap:.4rem;align-content:start;border:2px solid var(--linie2);border-radius:12px;padding:.7rem .8rem;background:#fff}
.var-karte:hover{border-color:var(--akzent)}
.var-kopf{display:flex;align-items:center;gap:.5rem;font-size:1.05rem}
.var-buchst{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--akzent);color:#fff;font-weight:800}
.wpanel.wp-konflikte{height:26rem}
@media (max-width:760px){.var-fenster{min-width:0}}

/* ---- Überschneidungen im Plan 2026.1.29: deutlicher Rand, Schraffur, Gegenrichtung bei Nachbarn, Ausrufezeichen ---- */
.belegung.konflikt,.belegung.woche.konflikt{border:2px solid var(--rot);border-style:solid;box-shadow:none;background:repeating-linear-gradient(135deg,#fdeeec 0 7px,#f8d2cd 7px 14px)}
.belegung.konflikt.markiert{box-shadow:0 0 0 3px #f2b84b}
.stapel.mehrere{gap:3px}
.stapel.mehrere>.belegung.konflikt:nth-child(even){background:repeating-linear-gradient(45deg,#fdeeec 0 7px,#f3bdb6 7px 14px)}
.stapel.mehrere>.belegung.konflikt:nth-child(odd){border-right-style:dashed}
.belegung.konflikt::after{content:"!";position:absolute;right:3px;bottom:3px;width:1.05rem;height:1.05rem;border-radius:50%;background:var(--rot);color:#fff;font-weight:800;font-size:.72rem;line-height:1.05rem;text-align:center;pointer-events:none}

/* Dialoge für alle Rollen 2026.1.30: Rückgängig in der Meldung */
.toast-knopf{flex:0 0 auto;align-self:center;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.16);color:inherit;font:inherit;font-weight:700;padding:.25rem .75rem;border-radius:7px;cursor:pointer}
.toast-knopf:hover,.toast-knopf:focus-visible{background:rgba(255,255,255,.3)}
.toast-knopf:disabled{opacity:.6;cursor:default}
.toast.warn .toast-knopf{border-color:rgba(0,0,0,.35);background:rgba(0,0,0,.06)}

/* Zentrale, Textbausteine: drei Blöcke mit kräftiger Kopfzeile und gut sichtbaren Feldern (2026.1.31) */
.tb-block{background:#fff;border:1px solid #8ea3b8;border-radius:12px;margin-bottom:1.4rem;overflow:hidden;box-shadow:0 2px 8px rgba(20,40,70,.10)}
.tb-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1rem;padding:.9rem 1.2rem;background:var(--side);color:#fff}
.tb-nr{flex:0 0 auto;width:2.1rem;height:2.1rem;border-radius:50%;background:#fff;color:var(--side);font-weight:800;display:grid;place-items:center}
.tb-titel{flex:1 1 16rem;min-width:0}
.tb-titel h2{margin:0;font-size:1.25rem;color:#fff}
.tb-titel p{margin:.15rem 0 0;font-size:.92rem;color:#dbe6f2;line-height:1.35}
.tb-aktion{display:flex;align-items:center;gap:.7rem;margin-left:auto}
.tb-status{display:inline-flex;align-items:center;gap:.4rem;padding:.25rem .7rem;border-radius:999px;font-weight:700;font-size:.85rem;background:#fff;color:var(--ink)}
.tb-status:empty{display:none}
.tb-status::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#8a96a2}
.tb-status.ok::before{background:#1c9a63}
.tb-status.offen::before{background:#e6a100}
.tb-status.fehlt::before{background:#d93025}
.tb-status.info::before{background:#1b5aa6}
.tb-koerper{padding:1.2rem;background:#eef3f9;display:flex;flex-direction:column;gap:1rem}
.tb-raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem 1.1rem}
.tb-koerper label.feld>span:first-child{font-size:.95rem;color:var(--ink);display:flex;gap:.5rem;align-items:center}
.tb-koerper label.feld em{font-style:normal;font-size:.72rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:.05rem .45rem;border-radius:999px}
.tb-koerper em.pflicht{background:#fde7e4;color:#9b1c10}
.tb-koerper em.optional{background:#e4e9ef;color:#3b4753}
.tb-koerper input[type=text],.tb-koerper input[type=email],.tb-koerper input[type=tel],.tb-koerper textarea{border:2px solid #5d7893;background:#fff;color:var(--ink)}
.tb-koerper input:focus,.tb-koerper textarea:focus{outline:3px solid #a8cdfb;border-color:var(--akzent)}
.tb-koerper input.fehlt{border-color:#d93025;background:#fff8f7}
.tb-vorschauen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.tb-vorschau{background:#fff;border:1px solid #c3d0de;border-left:6px solid var(--akzent);border-radius:8px;padding:.8rem 1rem}
.tb-vorschau .titel{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--akzent-d);margin-bottom:.4rem}
@media (max-width:900px){.tb-vorschauen{grid-template-columns:1fr}}
@media (max-width:700px){.tb-raster{grid-template-columns:1fr}.tb-aktion{margin-left:0}}

/* Zentrale, Funktionen: zwei klar getrennte Ansichten und je Funktion eine Zeile mit Schulauswahl (2026.1.31) */
.fn-reiterleiste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-bottom:1rem;max-width:44rem}
.fn-reiter{display:flex;flex-direction:column;gap:.15rem;text-align:left;padding:.8rem 1rem;border:2px solid var(--linie2);border-radius:10px;background:#fff;cursor:pointer;min-height:4.2rem}
.fn-reiter b{font-size:1.05rem}
.fn-reiter span{font-size:.88rem;color:var(--leise)}
.fn-reiter.aktiv{border-color:var(--akzent);background:var(--akzent-h);box-shadow:inset 0 0 0 1px var(--akzent)}
.fn-zeilen{display:flex;flex-direction:column}
.fn-zeile{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:.8rem 1.2rem;padding:.75rem .2rem;border-bottom:1px solid var(--linie)}
.fn-zeile:last-child{border-bottom:0}
.fn-text{display:flex;flex-direction:column;gap:.1rem}
.fn-text span{color:var(--leise);font-size:.9rem}
.fn-zahl{font-weight:700;font-size:.88rem;padding:.2rem .7rem;border-radius:999px;white-space:nowrap}
.fn-zahl.alle{background:#e1f3ea;color:#0e5a3b}
.fn-zahl.teil{background:#fff4d6;color:#7a4e00}
.fn-zahl.keine{background:#eceff2;color:#3b4753}
.fn-schulen{max-height:22rem;overflow:auto}
@media (max-width:700px){.fn-zeile{grid-template-columns:1fr auto}.fn-zeile .fn-zahl{grid-column:1;justify-self:start}.fn-zeile .knopf{grid-column:2;grid-row:1 / span 2}.fn-reiterleiste{grid-template-columns:1fr}}
.meldung-link{font-weight:700}

/* ---- Schublade unten (2026.1.32): Stundenkorb, Konflikte, Notizen, Kontakte, To-do ---- */
@property --sch-h{syntax:'<length>';inherits:true;initial-value:0px}
body.sp-sch{transition:--sch-h .24s ease}
body.sp-sch.sch-zieht{transition:none;user-select:none;cursor:ns-resize}
body.sp-sch .inhalt{padding-bottom:calc(var(--sch-h,46px) + 1.2rem)}
.sch{position:fixed;z-index:45;left:0;right:0;bottom:0;height:var(--sch-h,46px);display:flex;flex-direction:column;background:#f7f9fa;border-top:3px solid var(--side);box-shadow:0 -8px 24px rgba(10,25,20,.30)}
@media (min-width:901px){.sch{left:240px}body.leiste-zu .sch{left:68px}}
.sch-griff{position:absolute;left:0;right:0;top:-10px;height:18px;z-index:2;cursor:ns-resize;display:flex;justify-content:center;align-items:flex-start;touch-action:none}
.sch:not(.offen) .sch-griff{display:none}
.sch-grip{display:block;width:3.4rem;height:6px;margin-top:3px;border-radius:999px;background:#fff;border:1px solid var(--side);box-shadow:0 1px 3px rgba(0,0,0,.3)}
.sch-griff:hover .sch-grip,.sch-griff:focus-visible .sch-grip{background:var(--akzent);border-color:var(--akzent)}
.sch-griff:focus-visible{outline:none}
.sch-streifen{flex:0 0 auto;display:flex;align-items:center;gap:.3rem;height:46px;padding:0 .6rem;background:var(--side);overflow:hidden}
.sch-streifen .raum{flex:1}
.sch-tab{display:inline-flex;align-items:center;gap:.45rem;padding:.38rem .85rem;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--side-ink);font:inherit;font-weight:700;cursor:pointer;white-space:nowrap}
.sch-tab svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sch-tab:hover{background:var(--side-hover);color:#fff}
.sch-tab.an{background:#fff;color:var(--side)}
.sch-tab.extern{border-style:dashed;border-color:#6fae94}
.sch-tab.extern::after{content:"\2197";margin-left:.1rem}
.sch-tab .zahl{min-width:1.3rem;text-align:center;background:#e4ecf2;color:var(--side);border-radius:999px;font-size:.78rem;padding:0 .4rem;line-height:1.35}
.sch-tab:not(.an) .zahl{background:rgba(255,255,255,.2);color:#fff}
.sch-tab .zahl.rot{background:#d93025;color:#fff}
.sch-tab:focus-visible,.sch-streifen .icon-knopf:focus-visible{outline:3px solid #7fb9a3;outline-offset:1px}
.sch-info{color:#c4d3d8;font-size:.88rem;margin-right:.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sch-streifen .icon-knopf{background:transparent;border-color:transparent;color:var(--side-ink)}
.sch-streifen .icon-knopf:hover{background:var(--side-hover);color:#fff}
.sch-koerper{flex:1 1 auto;min-height:0;overflow:auto;padding:.7rem 1rem 1rem}
.sch:not(.offen) .sch-koerper{display:none}
.sch-koerper .korb-scroll{max-height:none;overflow:visible}
.sch-koerper.eingefroren{background:#f1f3f5}
.sch-hinweis{margin:0 0 .6rem;color:var(--leise);font-size:.9rem}
@media (prefers-reduced-motion:reduce){body.sp-sch{transition:none}}

/* Schiene erkennbar: Symbol vorn in der Kachel und Marke im Stundenkorb (2026.1.32) */
.belegung .schiene-ic{display:inline-flex;vertical-align:-.15em;margin-right:.3em;color:#1d6b53}
.belegung .schiene-ic svg{width:.95em;height:.95em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.korb-kachel .schiene-badge{display:inline-flex;align-items:center;gap:.25rem;align-self:flex-start;font-size:.68rem;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:#fff;background:#2d6b55;border-radius:4px;padding:0 .35rem}
.korb-kachel .schiene-badge svg{width:.75rem;height:.75rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* ---- Konfliktfenster 2026.1.32: links Probleme, rechts Problem und Lösungen ---- */
.konfliktfenster{display:grid;grid-template-columns:minmax(15rem,21rem) minmax(0,1fr);gap:.9rem;align-items:start;height:100%;min-height:0}
.konfliktfenster.leer{display:block;height:auto}
.kf-links,.kf-rechts{min-height:0;max-height:100%;overflow:auto;display:flex;flex-direction:column;gap:.5rem;padding:2px}
.kf-liste2{display:flex;flex-direction:column;gap:.3rem}
.kf-zeile2{display:flex;gap:.55rem;align-items:flex-start;text-align:left;border:1px solid var(--linie2);border-radius:10px;background:#fff;padding:.4rem .6rem;font:inherit;color:var(--ink);cursor:pointer}
.kf-zeile2:hover{border-color:var(--akzent)}
.kf-zeile2.aktiv{border-color:var(--akzent);background:var(--akzent-h);box-shadow:inset 4px 0 0 var(--akzent)}
.kf-zeile2 .kf-txt{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.kf-zeile2 .kf-txt b{font-size:.95rem;line-height:1.25}
.kf-zeile2 .kf-sub{font-size:.8rem;color:var(--leise);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kf-punkt{flex:0 0 auto;display:inline-block;width:.8rem;height:.8rem;border-radius:50%;margin-top:.3rem}
.kf-punkt.fehler,.kf-zeile2.fehler .kf-punkt{background:var(--rot)}
.kf-punkt.hinweis,.kf-zeile2.hinweis .kf-punkt{background:#d89a1a}
.kf-punkt.gross{width:1.1rem;height:1.1rem;margin-top:.35rem}
.kf-kopf2{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-start}
.kf-kopf2 .kf-titel{flex:1 1 18rem;min-width:0}
.kf-gross{font-size:1.2rem;line-height:1.25}
.kf-satz{font-size:1rem;margin:.2rem 0 0}
.kf-ref{align-self:center;white-space:nowrap}
.kf-block{display:flex;flex-direction:column;gap:.35rem}
.kf-sonst{display:flex;flex-wrap:wrap;gap:.4rem}
.var-reihe{display:flex;gap:.7rem;overflow-x:auto;padding:2px 2px .5rem;align-items:stretch}
.var-karte{flex:0 0 auto;width:min(19rem,82vw);display:flex;flex-direction:column;gap:.4rem;border:2px solid var(--linie2);border-radius:12px;padding:.6rem .7rem;background:#fff}
.var-karte:hover{border-color:var(--akzent)}
.var-kopf{display:flex;align-items:center;gap:.5rem}
.var-buchst{flex:0 0 auto;display:inline-grid;place-items:center;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--akzent);color:#fff;font-weight:800}
.var-text{font-size:.95rem;line-height:1.25}
.var-karte .mini-tag{max-width:none}
.var-nehmen{margin-top:auto;align-self:flex-start}
.sch-koerper[data-tab=konflikte]{overflow:hidden}
@media (max-width:760px){.konfliktfenster{grid-template-columns:1fr;height:auto}.kf-links,.kf-rechts{max-height:none;overflow:visible}}

.var-karte.jetzt{background:#fff8f7;border-color:#e3a39c}
.var-karte.jetzt.hinweis{background:#fffaf0;border-color:#e6c97a}
.var-buchst.jetzt{background:var(--rot)}
.var-karte.jetzt.hinweis .var-buchst.jetzt{background:#d89a1a}
.kf-rechts .kf-eintraege{margin:0}

/* Überschneidung ohne Streifenmuster: ruhige Fläche, kräftiger roter Rand, Ausrufezeichen (2026.1.32) */
.belegung.konflikt,.belegung.woche.konflikt{background:#fdeeee;border:2px solid var(--rot);box-shadow:none}
.stapel.mehrere>.belegung.konflikt:nth-child(even){background:#fadbd8}
.stapel.mehrere>.belegung.konflikt:nth-child(odd){border-right-style:solid}
.mt-block.konflikt{background:#fdeeee;border:2px solid var(--rot);color:#6b1710}
.mt-block.hinweis{background:#fff8e6;border:2px solid #d89a1a;color:#5c3d00}

/* Optimierung: Wechsel in Klartext mit Lösungen (2026.1.32) */
.opt-satz{font-size:1.05rem;margin:.2rem 0 .4rem}
.opt-lk-kopf{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-bottom:.4rem}
.opt-lk-kopf h3{margin:0;font-size:1.1rem}
.opt-wechsel{border-top:1px solid var(--linie);padding:.6rem 0 .3rem;display:flex;flex-direction:column;gap:.4rem}
.opt-wechsel-kopf{display:flex;flex-wrap:wrap;gap:.2rem .5rem;align-items:center}
.opt-lsg-liste{display:flex;flex-direction:column;gap:.3rem}
.opt-lsg{display:flex;flex-wrap:wrap;gap:.4rem .8rem;align-items:center;border:1px solid var(--linie2);border-radius:8px;padding:.35rem .6rem;background:#fff}
.opt-lsg-text{flex:1 1 20rem;min-width:0}

/* Busplan 2026.1.33 */
.fahrten-kopf{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.fahrten-kopf h2{margin:0}
details.bus-mehr{border:1px solid var(--linie2);border-radius:10px;padding:.4rem .7rem;margin:.5rem 0;background:#fafcfb}
details.bus-mehr>summary{cursor:pointer;font-weight:700;padding:.2rem 0}
.belegung .kachel-bus.bus-warte{border-color:#e3c27a;background:#fff6dc;color:#6a4300}
.belegung .kachel-bus.bus-warte::after{content:"?";font-weight:800;margin-left:.15rem}
.belegung .kachel-bus.bus-ok{border-color:#8fcfae;background:#e3f4ea;color:#0e5a38}
.belegung .kachel-bus.bus-ok::after{content:"\2713";font-weight:800;margin-left:.15rem}
.belegung .kachel-bus.bus-fehlt{border-color:#e0958c;background:#fdeceb;color:#7a1a12}
.plan-legende i.bus-leg{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.1rem;margin:0 .25rem 0 .6rem;border-radius:4px;border:1px solid #9cc2f0;background:#e8f1fc;color:#123e75}
.plan-legende i.bus-leg:first-child{margin-left:0}
.plan-legende i.bus-leg svg{width:.8rem;height:.8rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.plan-legende i.bus-leg.ok{border-color:#8fcfae;background:#e3f4ea;color:#0e5a38}
.plan-legende i.bus-leg.warte{border-color:#e3c27a;background:#fff6dc;color:#6a4300}
.plan-legende i.bus-leg.fehlt{border-color:#e0958c;background:#fdeceb;color:#7a1a12}
/* Erste Sportstunde: Platzhalter-Chips, Textvorschläge, Zeilen ordnen */
.platz-leiste{margin:.2rem 0 .9rem;padding:.7rem .8rem;border:1px solid var(--linie2);background:var(--akzent-h);border-radius:6px}
.platz-leiste .leise{margin:0 0 .5rem;font-size:.9rem}
.chips.platz-chips{gap:.4rem}
.chip.platz{background:#fff;border-color:var(--akzent);color:var(--akzent-d,var(--akzent));cursor:grab;font-weight:600;user-select:none;-webkit-user-select:none}
.chip.platz:hover,.chip.platz:focus-visible{background:var(--akzent);color:#fff}
.chip.platz:active{cursor:grabbing}
.varianten{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:.1rem 0 .4rem}
.varianten .leise{margin-right:.2rem;font-size:.9rem}
.knopf.klein.variante.an{background:var(--akzent);border-color:var(--akzent);color:#fff}
.griff-punkte{display:none;letter-spacing:-.1em;color:#7d93a3;cursor:grab;font-weight:700;user-select:none}
@media (pointer:fine){td.griff-zelle .griff-punkte{display:inline-block;margin-right:.3rem}}
tr.ziel-ueber>td{box-shadow:inset 0 3px 0 0 var(--akzent)}
tr[draggable=true]{cursor:grab}
.druck-liste.erste-lk{display:flex;flex-direction:column;gap:.35rem;max-height:50vh;overflow:auto;padding:.3rem 0}
@media (max-width:640px){.platz-leiste{padding:.55rem .6rem}.chip.platz{padding:.3rem .7rem}}
/* Menü anordnen: Gruppen mit Pfeilen verschieben */
.nav-box{display:contents}
.nav-ordnen-knopf{border:0;background:transparent;color:var(--side-ink);font:inherit;font-size:.88rem;text-align:left;padding:.3rem .8rem;border-radius:8px;cursor:pointer}
.nav-ordnen-knopf:hover,.nav-ordnen-knopf:focus-visible{background:var(--side-hover);color:#fff}
.nav-ordnen-kopf{margin:.7rem .4rem .5rem;font-size:.88rem;line-height:1.35;color:var(--side-ink)}
.nav-ordnen-kopf b{display:block;color:#fff;margin-bottom:.2rem}
.nav-ordnen-zeile{display:flex;align-items:center;gap:.3rem;margin:.2rem .2rem;padding:.2rem .3rem .2rem .8rem;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff}
.nav-ordnen-name{flex:1 1 auto;font-weight:700;font-size:.9rem}
.nav-ordnen-zeile .icon-knopf{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);color:#fff}
.nav-ordnen-zeile .icon-knopf:hover,.nav-ordnen-zeile .icon-knopf:focus-visible{background:#fff;color:var(--side)}
.nav-ordnen-fuss{display:flex;gap:.5rem;margin:.7rem .3rem}
body.leiste-zu .nav-ordnen-knopf{display:none}
/* Mängelmelder */
.mangel-liste{display:flex;flex-direction:column;gap:.8rem}
.mangel-karte{background:#fff;border:1px solid var(--linie2);border-left:5px solid #6a7f93;border-radius:8px;padding:.8rem 1rem;display:flex;flex-direction:column;gap:.5rem}
.mangel-karte.status-neu{border-left-color:#b78a00}
.mangel-karte.status-gelesen{border-left-color:#2f6f9f}
.mangel-karte.status-bearbeitung{border-left-color:#2f6f9f}
.mangel-karte.status-erledigt{border-left-color:#2a7a55}
.mangel-karte.dringend{border-left-color:#b3261e;background:#fff7f6}
.mangel-karte.archiv{opacity:.8}
.mangel-kopf{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}
.mangel-ort{font-size:1.02rem}
.mangel-status{display:inline-block;padding:.1rem .6rem;border-radius:999px;font-size:.85rem;font-weight:700;border:1px solid transparent}
.mangel-status.s-neu{background:#fff4cc;color:#6b5000;border-color:#f0d680}
.mangel-status.s-gelesen,.mangel-status.s-bearbeitung{background:#e3eef8;color:#1d4d73;border-color:#b7d1e8}
.mangel-status.s-erledigt{background:#dcf1e6;color:#175c3e;border-color:#a9d9c0}
.mangel-inhalt{display:flex;gap:.8rem;align-items:flex-start}
.mangel-text{margin:0;flex:1 1 auto;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}
.mangel-bild{flex:0 0 auto;border:1px solid var(--linie2);background:#fff;padding:0;border-radius:6px;cursor:zoom-in;line-height:0}
.mangel-bild img{width:96px;height:72px;object-fit:cover;border-radius:5px}
.mangel-gross img{max-width:100%;max-height:70vh;display:block;margin:0 auto}
.mangel-meta{font-size:.88rem;color:var(--leise)}
.mangel-verlauf summary{cursor:pointer;font-size:.9rem}
.mangel-verlauf ul{margin:.4rem 0 0;padding-left:1.1rem;font-size:.9rem}
.mangel-an{display:flex;flex-direction:column;gap:.3rem;margin:.3rem 0}
.mangel-vorschau{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.mangel-vorschau img{max-width:160px;max-height:120px;border-radius:6px;border:1px solid var(--linie2)}
@media (max-width:520px){.mangel-inhalt{flex-direction:column}.mangel-bild img{width:100%;height:auto;max-height:200px}.mangel-bild{width:100%}}
.anfrage-antwort{border-top:1px solid var(--linie2);padding-top:.5rem;margin-top:.2rem}
.anfrage-antwort b{display:block;margin-bottom:.2rem;color:var(--akzent-d,var(--akzent))}

/* ---- Einführungsclips (tour.js) ---- */
html.tour-offen,html.tour-offen body{overflow:hidden}
.tour{position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;background:linear-gradient(160deg,#10222c 0%,#17353f 62%,#14634c 150%);color:#fff;overscroll-behavior:contain;max-width:100vw;overflow:hidden}
.tour:focus{outline:0}
.tour *{box-sizing:border-box;min-width:0}
.tour [hidden]{display:none!important}
.tour button{font:inherit;color:inherit;cursor:pointer}
.tour button:focus-visible{outline:3px solid #f6c945;outline-offset:2px}
.tour-kopf{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.7rem 1rem .4rem;flex:none}
.tour-wort{display:flex;align-items:baseline;gap:.2rem .5rem;flex-wrap:wrap;font-weight:800;font-size:1.15rem;letter-spacing:.3px}
.tour-wort b{color:#f6c945}
.tour-wort small{font-size:.72rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#bfeed7}
.tour-zu{flex:none;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);border-radius:10px;padding:.4rem .8rem;font-weight:600;min-height:40px}
.tour-zu:hover{background:rgba(255,255,255,.18)}
.tour-balken{display:flex;gap:6px;padding:0 1rem .6rem;flex:none}
.tour-seg{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.22);overflow:hidden}
.tour-seg i{display:block;height:100%;width:0;background:#f6c945;border-radius:4px}
.tour-seg.fertig i{width:100%}
.tour-seg.lauf i{animation:tr-fuell var(--dauer,8s) linear forwards}
@keyframes tr-fuell{from{width:0}to{width:100%}}
.tour-inhalt{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:.4rem 1rem 1rem}
.tour-textblock{width:100%;max-width:520px;flex:none}
.tour-nr{font-size:.72rem;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#bfeed7}
.tour-textblock h2{margin:.2rem 0 .4rem;font-size:1.7rem;line-height:1.08;font-weight:800;color:#fff}
.tour-textblock p{margin:0;font-size:1rem;line-height:1.45;color:#d7e8e2}
.tour-buehne{width:100%;display:flex;justify-content:center;flex:none}
.tour-fuss{display:flex;gap:.6rem;align-items:center;justify-content:center;flex-wrap:wrap;padding:.7rem 1rem 1rem;flex:none;background:rgba(0,0,0,.2)}
.tour-ende{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}
.tour-nav{min-width:104px;min-height:44px;padding:.4rem 1rem;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);border-radius:10px;font-weight:600}
.tour-nav:hover:not(:disabled){background:rgba(255,255,255,.2)}
.tour-nav:disabled{opacity:.35;cursor:default}
.tour-nav.haupt{background:#f6c945;border-color:#f6c945;color:#10222c}
.tour-nav.haupt:hover:not(:disabled){background:#ffd75e}
@media (min-width:860px){
  .tour-inhalt{flex-direction:row;justify-content:center;align-items:center;gap:3.5rem;padding:1rem 2rem 2rem}
  .tour-textblock{width:380px}
  .tour-textblock h2{font-size:2.4rem}
  .tour-textblock p{font-size:1.15rem}
  .tour-buehne{width:auto;flex:1;max-width:560px}
}
/* Zeichnung */
.tr-geraet{position:relative;width:100%;background:#f4f6f8;border:5px solid #0b1820;border-radius:12px;color:#1d2a36;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.35)}
.tr-handy{max-width:300px}
.tr-fenster{max-width:540px}
.tr-kopf{background:#172a35;color:#fff;font-weight:700;font-size:.9rem;padding:.55rem .8rem}
.tr-schirm{display:flex;flex-direction:column;gap:.5rem;padding:.6rem;min-height:270px}
.tr-a{opacity:0;animation:tr-rein .45s ease-out var(--d,0s) forwards}
@keyframes tr-rein{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tr-chips{display:flex;gap:.35rem}
.tr-chip{flex:1 1 0;text-align:center;padding:.28rem .3rem;border:1px solid #c9d1d8;border-radius:12px;background:#fff;font-size:.78rem;font-weight:600}
.tr-chip.an{background:#1f9a74;border-color:#1f9a74;color:#fff}
.tr-karte{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .65rem;background:#fff;border:1px solid #dfe4e9;border-left:5px solid #1f9a74;border-radius:12px}
.tr-karte .tr-text b,.tr-banner b{display:block;font-size:.86rem}
.tr-karte .tr-text span,.tr-banner span{display:block;font-size:.76rem;color:#52606d}
.tr-marke{flex:none;font-style:normal;font-size:.68rem;font-weight:700;padding:.1rem .45rem;border-radius:12px;background:#e9edf1;color:#3a4856}
.tr-karte.kl-gruen,.tr-banner.kl-gruen{border-left-color:#1f9a74;background:#eef7f3}
.tr-karte.kl-blau,.tr-banner.kl-blau{border-left-color:#1d5fa0;background:#edf4fb}
.tr-karte.kl-rot,.tr-banner.kl-rot{border-left-color:#c23b3b;background:#fcefef}
.tr-karte.kl-gelb,.tr-banner.kl-gelb{border-left-color:#d99a00;background:#fff8dd}
.tr-banner{padding:.55rem .65rem;border:1px solid #dfe4e9;border-left:5px solid #1d5fa0;border-radius:12px;background:#edf4fb}
.tr-zeile{display:flex;align-items:center;gap:.55rem;padding:.42rem .6rem;background:#fff;border:1px solid #dfe4e9;border-radius:12px;font-size:.84rem}
.tr-haken{flex:none;width:1.25rem;height:1.25rem;border-radius:12px;border:1.5px solid #c9d1d8;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:.8rem;color:#fff}
.tr-haken.ok{background:#1f9a74;border-color:#1f9a74}
.tr-knopf{align-self:stretch;text-align:center;padding:.55rem .8rem;border-radius:12px;background:#1f9a74;color:#fff;font-weight:700;font-size:.86rem;position:relative}
.tr-schalter{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.5rem .65rem;background:#fff;border:1px solid #dfe4e9;border-radius:12px;font-size:.86rem;position:relative}
.tr-sw{flex:none;width:2.5rem;height:1.4rem;border-radius:12px;background:#c9d1d8;position:relative;display:block}
.tr-sw b{position:absolute;top:.15rem;left:.15rem;width:1.1rem;height:1.1rem;border-radius:12px;background:#fff}
.tr-sw.an{background:#1f9a74}
.tr-sw.an b{left:1.25rem}
.tr-zahl{display:flex;align-items:baseline;gap:.5rem;padding:.4rem .65rem;background:#fff;border:1px solid #dfe4e9;border-radius:12px}
.tr-zahl b{font-size:1.7rem;color:#c23b3b}
.tr-zahl span{font-size:.82rem;color:#52606d}
.tr-status{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:.3rem}
.tr-st{padding:.35rem .15rem;border-radius:12px;background:#e9edf1;color:#52606d;font-size:.64rem;font-weight:700;text-align:center;overflow-wrap:anywhere;line-height:1.1}
.tr-st.vor{background:#d6ece4;color:#14634c}
.tr-st.an{background:#1d5fa0;color:#fff}
.tr-feld{background:#fff;border:1px solid #dfe4e9;border-radius:12px;padding:.4rem .6rem}
.tr-feld small{display:block;font-size:.7rem;font-weight:700;color:#52606d;margin-bottom:.2rem}
.tr-eingabe{min-height:1.7rem;padding:.25rem .5rem;border:1px solid #c9d1d8;border-radius:12px;font-size:.86rem;overflow:hidden}
.tr-getippt{display:inline-block;clip-path:inset(0 100% 0 0);animation:tr-tippen var(--dd,.6s) steps(var(--n,8),end) var(--d2,1s) forwards}
@keyframes tr-tippen{to{clip-path:inset(0 0 0 0)}}
.tr-ziel::after{content:"";position:absolute;inset:-3px;border:3px solid #f6c945;border-radius:12px;opacity:0;pointer-events:none;animation:tr-puls .9s ease-out var(--dz,0s) 1 forwards}
@keyframes tr-puls{0%{opacity:0;transform:scale(.97)}30%{opacity:1}100%{opacity:1;transform:scale(1)}}
.tr-finger{position:absolute;left:0;top:0;z-index:3;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:rgba(246,201,69,.92);box-shadow:0 0 0 7px rgba(246,201,69,.32);opacity:0;pointer-events:none;animation:tr-finger 1.5s ease-in-out var(--d,0s) forwards}
@keyframes tr-finger{
  0%{opacity:0;transform:translate(var(--sx,200px),var(--sy,200px)) scale(1)}
  15%{opacity:1}
  60%{opacity:1;transform:translate(var(--fx,100px),var(--fy,100px)) scale(1)}
  72%{opacity:1;transform:translate(var(--fx,100px),var(--fy,100px)) scale(.78)}
  84%{opacity:1;transform:translate(var(--fx,100px),var(--fy,100px)) scale(1)}
  100%{opacity:0;transform:translate(var(--fx,100px),var(--fy,100px)) scale(1)}}
.tr-detail{position:absolute;left:.6rem;right:.6rem;bottom:.6rem;z-index:4;padding:.6rem .75rem;background:#fff;border:2px solid #1f9a74;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.tr-detail b{display:block;margin-bottom:.25rem;font-size:.9rem;color:#14634c}
.tr-dz{display:flex;justify-content:space-between;gap:.6rem;font-size:.8rem;padding:.1rem 0}
.tr-dz span{color:#52606d}
.tr-dz em{font-style:normal;font-weight:600;text-align:right}
.tour.pause *,.tour.pause *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.tour .tr-a,.tour .tr-getippt,.tour .tr-finger,.tour .tr-ziel::after{animation-duration:.01s!important;animation-delay:0s!important}}
/* Einstellungen der Clips in der Verwaltung */
.clip-karten{display:grid;gap:.9rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.clip-rolle{display:flex;flex-direction:column;gap:.55rem}
.clip-rolle.aus h2{opacity:.6}
.clip-kopf{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.clip-kopf h2{margin:0}
.clip-rolle .raster2{margin-top:.2rem}
@media (max-width:820px){.clip-karten{grid-template-columns:1fr}}
.clip-ansehen{display:flex;flex-wrap:wrap;gap:.5rem}

/* ---------------------------------------------------------------- Inventar: Symbole, Zählblatt, Zählungen prüfen */
.sym{display:inline-flex;flex:none;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;border-radius:6px;border:1px solid var(--linie2);background:var(--akzent-h);color:var(--akzent-d)}
.sym svg{width:1.7rem;height:1.7rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sym.klein{width:2rem;height:2rem}.sym.klein svg{width:1.3rem;height:1.3rem}
.sym-wahl{display:grid;gap:.6rem}
.sym-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem}
.sym-vorschau{display:inline-flex;align-items:center;gap:.5rem}
.sym-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(3rem,1fr));gap:.35rem}
.sym-knopf{display:flex;align-items:center;justify-content:center;height:3rem;padding:0;border:1px solid var(--linie2);border-radius:6px;background:#fff;color:var(--ink);cursor:pointer}
.sym-knopf svg{width:1.7rem;height:1.7rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sym-knopf:hover{background:var(--akzent-h)}
.sym-knopf.an{background:var(--akzent);border-color:var(--akzent);color:#fff}
.sym-knopf:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}
.zaehl-liste{display:grid;gap:.4rem;margin:.6rem 0}
.zaehl-zeile{display:flex;align-items:center;gap:.7rem;padding:.4rem .5rem;border:1px solid var(--linie);border-radius:8px;background:#fff;cursor:text}
.zaehl-name{flex:1;display:flex;flex-direction:column;min-width:0}.zaehl-name b{overflow-wrap:break-word;hyphens:auto}
input.zaehl-feld{width:6.5rem;flex:none;text-align:right;font-size:1.15rem;min-height:2.8rem}
.zaehl-liste.vorschau .zaehl-zeile{cursor:default}
.vorschau-rahmen{max-width:26rem;margin:.6rem 0 0;padding:.8rem;border:1px solid var(--linie2);border-radius:var(--radius);background:var(--bg)}
.zaehlseite .karte{width:min(560px,100%)}
.zaehl-titel{font-size:1.4rem}
.zaehl-meldung .hinweis{margin-bottom:.8rem}
.zp{display:grid;gap:.5rem}
.zp-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;padding:.5rem .6rem;border:1px solid var(--linie);border-radius:8px;background:#fff}
.zp-zeile.abweichung{background:var(--gelb-h);border-color:var(--gelb)}
.zp-mitte{flex:1 1 14rem;display:grid;gap:.3rem;min-width:0}.zp-name{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .6rem}
.zp-rechts{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.gelb-text{color:var(--gelb)}
.iv-verteilen>*+*{margin-top:.8rem}
@media (max-width:520px){.anmeldung.zaehlseite{padding:.6rem}.zaehlseite .karte{padding:1rem}input.zaehl-feld{width:5rem}.zaehl-zeile{gap:.5rem}.zaehl-zeile .sym{width:2.2rem;height:2.2rem}.zaehl-zeile .sym svg{width:1.4rem;height:1.4rem}}
.qr-druck p.fett{text-align:center}
@media print{.zaehl-liste.vorschau,.vorschau-rahmen{break-inside:avoid}}