:root {
  --grund: #f6f5f1;
  --flaeche: #ffffff;
  --text: #1d2327;
  --leise: #5b6670;
  --linie: #dfe3e6;
  --akzent: #1f5f5b;
  --akzent-hell: #e3efed;
  --warnung: #b4532a;
  --gefahr-flaeche: #fbeae5;
  /* Kennzeichnungen (Status, Hinweise) */
  --info-flaeche: #e4ecf7; --info-text: #2b4f80;
  --hinweis-flaeche: #fbf0d9; --hinweis-text: #855a0c; --notiz-text: #4a3608;
  --lila-flaeche: #ece6f6; --lila-text: #563f8c;
  --ok: #2f7a4f;
  --radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
}
@media (prefers-color-scheme: dark) {
  :root {
    --grund: #15191c; --flaeche: #1e2428; --text: #e8eaec; --leise: #9aa5ae; --linie: #313a40;
    --akzent: #6fbfb6; --akzent-hell: #20332f; --warnung: #f0a07a; --gefahr-flaeche: #3a2620;
    --info-flaeche: #22324a; --info-text: #a9c6ef; --hinweis-flaeche: #3a3020; --hinweis-text: #f0cd85; --notiz-text: #f0e0bd;
    --lila-flaeche: #2f2945; --lila-text: #c9bdf2; --ok: #7fd1a1;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--grund); line-height: 1.5; }
a { color: var(--akzent); }
h1 { font-size: 1.6rem; margin: 0.2rem 0 0.4rem; }
h2 { font-size: 1.1rem; margin: 0 0 0.8rem; }

.kopf { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.8rem 1.5rem; background: var(--flaeche); border-bottom: 1px solid var(--linie); flex-wrap: wrap; }
.marke { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; color: var(--text); }
.marke small { display: block; color: var(--leise); font-size: 0.8rem; }
.marke-zeichen { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 8px; background: var(--akzent); color: var(--flaeche); font-weight: 700; }
.navi { display: flex; gap: 1.2rem; align-items: center; }
.navi a, .link { color: var(--text); text-decoration: none; font: inherit; }
.navi a:hover, .link:hover { color: var(--akzent); }
.navi form { margin: 0; }
.link { background: none; border: 0; padding: 0; cursor: pointer; }

.inhalt { max-width: 1200px; margin: 0 auto; padding: 1.5rem; }
.fuss { text-align: center; color: var(--leise); font-size: 0.8rem; padding: 2rem 1rem; }

.karte { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 1.2rem 1.4rem; }
.spalten { display: grid; grid-template-columns: 2fr 1fr; gap: 1.2rem; margin-top: 1.2rem; }
@media (max-width: 820px) { .spalten { grid-template-columns: 1fr; } }

.kennzahlen { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.8rem; margin: 1rem 0; }
.kennzahlen div { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.9rem 1rem; }
.kennzahlen strong { display: block; font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.kennzahlen span { color: var(--leise); font-size: 0.85rem; }
.kennzahlen .hinweis { border-color: var(--warnung); }
.kennzahlen .hinweis strong { color: var(--warnung); }

.kacheln { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 0.6rem; }
.kacheln a { display: flex; justify-content: space-between; padding: 0.7rem 0.9rem; border: 1px solid var(--linie); border-radius: 8px; text-decoration: none; color: var(--text); }
.kacheln a:hover { border-color: var(--akzent); }
.kacheln span { color: var(--leise); }

.knopf { display: inline-block; background: var(--akzent); color: var(--flaeche); border: 0; border-radius: 8px; padding: 0.6rem 1.1rem; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
.knopf.zweitrangig { background: var(--akzent-hell); color: var(--akzent); }

.anmeldung { max-width: 380px; margin: 3rem auto; }
.anmeldung label { display: block; margin-bottom: 0.9rem; font-weight: 600; font-size: 0.9rem; }
.anmeldung input { display: block; width: 100%; margin-top: 0.3rem; padding: 0.6rem 0.7rem; border: 1px solid var(--linie); border-radius: 8px; font: inherit; background: var(--grund); color: var(--text); }
.fehler { color: var(--warnung); }

.meldungen { list-style: none; padding: 0; }
.meldungen li { padding: 0.6rem 1rem; border-radius: 8px; background: var(--akzent-hell); margin-bottom: 0.5rem; }

.brotkrumen { color: var(--leise); font-size: 0.85rem; margin: 0; }
.unterzeile { color: var(--leise); margin-top: 0; }
.leer { color: var(--leise); }
.hinweistext { color: var(--leise); font-size: 0.85rem; max-width: 70ch; }

.tabellenrahmen { overflow-x: auto; background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
th, td { padding: 0.5rem 0.7rem; border-bottom: 1px solid var(--linie); text-align: left; vertical-align: top; }
thead th { font-size: 0.8rem; color: var(--leise); font-weight: 600; background: var(--flaeche); }
tbody tr:last-child th, tbody tr:last-child td { border-bottom: 0; }
.liste td.zahl, .liste th.zahl { text-align: right; }
.rollbar { overflow-x: auto; }
.eng th, .eng td { padding: 0.45rem 0.4rem; }
.eng th:first-child, .eng td:first-child { padding-left: 0; }
.eng th:last-child, .eng td:last-child { padding-right: 0; }
.auffaellig { color: var(--warnung); font-weight: 600; }

.noten th, .noten td { text-align: center; white-space: nowrap; }
.noten .links { text-align: left; font-weight: 500; position: sticky; left: 0; background: var(--flaeche); }
.noten small { display: block; color: var(--leise); font-size: 0.72rem; font-weight: 400; }
.noten .ln-titel { display: block; color: var(--text); }
.noten .kat { background: var(--grund); color: var(--leise); }
.noten .vorschlag { background: var(--akzent-hell); }
.noten .vorschlag strong { font-size: 1.05rem; }
.noten tr.gefaehrdet td, .noten tr.gefaehrdet th { background: var(--gefahr-flaeche); }
.sonder { color: var(--leise); font-size: 0.8rem; }
.warnung { display: inline-grid; place-items: center; width: 1.1rem; height: 1.1rem; margin-left: 0.3rem; border-radius: 50%; background: var(--warnung); color: var(--flaeche); font-size: 0.75rem; font-weight: 700; cursor: help; }

.noten .ordnerkopf { color: var(--text); font-size: 0.8rem; border-bottom: 2px solid var(--akzent); }
.noten a.ln-titel { color: var(--text); text-decoration: none; border-bottom: 1px dotted var(--leise); }
.noten a.ln-titel:hover { color: var(--akzent); }
.struktur { margin-top: 1.5rem; }
.karte-kopf { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.karte-kopf h2 { margin: 0; }
.aktionen a { margin-right: 0.9rem; white-space: nowrap; font-size: 0.9rem; }
.inhalt.breit { max-width: none; }
.noten th, .noten td { padding: 0.45rem 0.55rem; }
.noten thead th { white-space: normal; min-width: 5rem; max-width: 9.5rem; vertical-align: bottom; }
.noten thead th.links { min-width: 10rem; }
.einzelgewicht { display: inline-block; margin-left: 0.25rem; padding: 0 0.3rem; border-radius: 4px; background: var(--akzent-hell); color: var(--akzent); font-size: 0.72rem; font-weight: 600; cursor: help; }

/* Schülerakte */
.akte-kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.leise { color: var(--leise); font-weight: 400; }
.raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 1.2rem; margin-top: 1rem; }
.raster .breit-2 { grid-column: 1 / -1; }
.karte h3 { font-size: 0.95rem; margin: 1.1rem 0 0.4rem; }
.daten { display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1rem; margin: 0; }
.daten dt { color: var(--leise); font-size: 0.9rem; }
.daten dd { margin: 0; }
.kontakt { padding: 0.7rem 0; border-bottom: 1px solid var(--linie); }
.kontakt:last-child { border-bottom: 0; }
.etiketten { margin: 0.3rem 0; }
.hinweisleiste { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.etikett { display: inline-block; font-size: 0.75rem; padding: 0.1rem 0.5rem; border-radius: 999px; background: var(--akzent-hell); color: var(--akzent); font-weight: 600; margin-right: 0.25rem; }
.etikett.warnend { background: var(--gefahr-flaeche); color: var(--warnung); }
.marke-status { font-weight: 600; }
.status-abgang { color: var(--warnung); }
.schlicht { margin: 0; padding-left: 1.1rem; }
.kennzahlen.klein { margin: 0 0 0.6rem; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 0.5rem; }
.kennzahlen.klein div { padding: 0.6rem 0.7rem; min-width: 0; }
.kennzahlen.klein span { font-size: 0.78rem; overflow-wrap: anywhere; }
.kennzahlen.klein strong { font-size: 1.3rem; }
.vertraulich { border-color: var(--warnung); }
tr.auffaellig td { color: var(--warnung); }

.daten.zahlen dd { font-variant-numeric: tabular-nums; font-weight: 600; font-size: 1.05rem; }

/* Personal-Übersicht */
.hr { margin: 1rem 0 0; }
.hr .bereiche { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.6rem 0 0.4rem; }
.hr .bereiche .etikett { text-decoration: none; }
.spalten.drei { grid-template-columns: 2fr 1fr 1fr; margin-top: 0.4rem; }
@media (max-width: 980px) { .spalten.drei { grid-template-columns: 1fr; } }
.liste.kompakt td { padding: 0.35rem 0.5rem; font-size: 0.9rem; }

/* Sprachmenü oben rechts */
.sprachmenue { position: relative; }
.sprachmenue summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.55rem; border: 1px solid var(--linie); border-radius: 999px; font-size: 0.8rem; font-weight: 600; color: var(--text); }
.sprachmenue summary::-webkit-details-marker { display: none; }
.sprachmenue summary:hover { border-color: var(--akzent); color: var(--akzent); }
.sprachmenue form { position: absolute; right: 0; z-index: 20; margin-top: 0.4rem; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 10px; padding: 0.3rem; min-width: 9rem; box-shadow: 0 6px 20px rgba(0,0,0,.12); }
.sprachmenue button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 0.5rem 0.75rem; border-radius: 7px; cursor: pointer; font: inherit; font-size: 0.9rem; color: var(--text); }
.sprachmenue button:hover { background: var(--akzent-hell); }
.sprachmenue button[aria-current="true"] { font-weight: 700; color: var(--akzent); }

/* Anhänge */
.nowrap { white-space: nowrap; }
.blockzeile { display: block; font-size: 0.78rem; }
.notiz { display: block; color: var(--leise); font-size: 0.85rem; margin-top: 0.15rem; max-width: 60ch; }
.filterzeile { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: end; margin: 0; }
.filterzeile label { font-size: 0.8rem; color: var(--leise); display: flex; flex-direction: column; gap: 0.2rem; }
select, .formular input, .formular textarea { font: inherit; padding: 0.4rem 0.55rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); }
.anhaenge { margin-top: 0.8rem; }
.link.gefahr { color: var(--warnung); font-size: 0.85rem; }
.hochladen { margin-top: 1rem; border-top: 1px solid var(--linie); padding-top: 0.8rem; }
.hochladen summary { cursor: pointer; font-weight: 600; color: var(--akzent); }
.formular { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8rem; margin-top: 0.8rem; max-width: 820px; }
.formular label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.85rem; font-weight: 600; }
.formular label small { font-weight: 400; }
.formular textarea { width: 100%; }
.formzeile { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 0.8rem; }
@media (max-width: 760px) { .formzeile { grid-template-columns: 1fr; } }
.formular .knopf { justify-self: start; }

/* Förderung */
.ampel { font-size: 0.8rem; font-weight: 600; white-space: nowrap; }
.ampel.ok { color: var(--ok); }
.ampel.fehlt, .ampel.offen, .ampel.veraltet { color: var(--warnung); }
.knopfreihe { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.knopf.klein { padding: 0.35rem 0.75rem; font-size: 0.85rem; }
.nta-marke { display: inline-block; margin-left: 0.35rem; padding: 0 0.35rem; border-radius: 4px; background: var(--lila-flaeche); color: var(--lila-text); font-size: 0.7rem; font-weight: 700; cursor: help; vertical-align: middle; }
.dokument { max-width: 900px; margin: 0 auto; }
.dokument section.karte { margin-top: 1rem; }
.druckkopf { display: none; }
.ziel { border-top: 1px solid var(--linie); padding: 0.8rem 0; }
.ziel:first-of-type { border-top: 0; }
.ziel-kopf { display: flex; justify-content: space-between; gap: 1rem; }
.unterschriften { display: none; }
.inline-form { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: end; margin: 0; }
.inline-form label { display: flex; flex-direction: column; font-size: 0.75rem; color: var(--leise); gap: 0.15rem; }
.inline-form input, .inline-form select { font: inherit; font-size: 0.85rem; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }

@media print {
  .kopf, .fuss, .nicht-drucken, .meldungen, .brotkrumen { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .inhalt { padding: 0; max-width: none; }
  .karte { border: 0; padding: 0; }
  .dokument section.karte { margin-top: 0.8rem; }
  .druckkopf { display: block; font-size: 9pt; color: #444; border-bottom: 1px solid #999; padding-bottom: 0.3rem; margin-bottom: 0.8rem; }
  .unterschriften { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.5rem; margin-top: 2.5rem; font-size: 9pt; }
  .unterschriften div { border-top: 1px solid #000; padding-top: 0.3rem; }
  a { color: #000; text-decoration: none; }
  .ziel { break-inside: avoid; }
}

/* ---------------------------------------------------------------- Startseite */
:root {
  --papier-gelb: #fbf3d3; --papier-gruen: #e1efe9; --papier-blau: #e3ebf5; --papier-rosa: #f6e4e4; --papier-grau: #ecebe7;
}
@media (prefers-color-scheme: dark) {
  :root { --papier-gelb: #3a3522; --papier-gruen: #233530; --papier-blau: #232f3d; --papier-rosa: #3b2829; --papier-grau: #2c2f31; }
}
.unsichtbar { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.symbol { width: 1.15em; height: 1.15em; vertical-align: -0.2em; flex: none; }
.klein { font-size: 0.82rem; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 2px solid var(--akzent); outline-offset: 2px;
}

.startkopf { display: grid; grid-template-columns: auto 1fr; gap: 1.2rem; align-items: center; margin-bottom: 1.4rem; }
.startgruss h1 { margin: 0; font-size: 1.75rem; letter-spacing: -0.01em; }
.startgruss .unterzeile { margin: 0.15rem 0 0; }


/* Das Kalenderblatt ist das eine markante Element der Seite */
.kalenderblatt { display: grid; grid-template-rows: auto 1fr auto; width: 4.6rem; text-align: center; border-radius: 10px; overflow: hidden;
  background: var(--flaeche); border: 1px solid var(--linie); box-shadow: 0 2px 0 var(--linie); font-variant-numeric: lining-nums; }
.kb-tag { background: var(--akzent); color: var(--flaeche); font-size: 0.75rem; font-weight: 700; padding: 0.2rem 0; }
.kb-zahl { font-size: 2.1rem; font-weight: 700; line-height: 1.05; padding-top: 0.25rem; color: var(--text); }
.kb-monat { font-size: 0.75rem; color: var(--leise); padding-bottom: 0.35rem; }

.suchfeld { display: flex; align-items: center; gap: 0.4rem; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 999px; padding: 0.25rem 0.3rem 0.25rem 0.8rem; }
.suchfeld:focus-within { border-color: var(--akzent); }
.suchfeld .symbol { color: var(--leise); }
.suchfeld input { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; color: var(--text); padding: 0.35rem 0; }
.suchfeld input:focus-visible { outline: none; }
.suchfeld .knopf { border-radius: 999px; }
.suchfeld.gross { max-width: 640px; margin: 0.6rem 0 1.2rem; }

.schnellzugriff { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem 1.6rem; margin-bottom: 1.4rem; }
.sz-gruppe h2 { font-size: 0.85rem; color: var(--leise); font-weight: 600; margin: 0 0 0.45rem; }
.sz-gruppe ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.45rem; }
.sz-gruppe a { display: flex; flex-direction: column; padding: 0.5rem 0.8rem; min-width: 7.5rem; background: var(--flaeche); border: 1px solid var(--linie);
  border-radius: 8px; text-decoration: none; color: var(--text); }
.sz-gruppe a:hover { border-color: var(--akzent); }
.sz-gruppe a span { color: var(--leise); font-size: 0.78rem; }
.sz-bereiche a { flex-direction: row; align-items: center; gap: 0.45rem; min-width: 0; }
.sz-bereiche a strong { font-weight: 500; font-size: 0.92rem; }
.sz-bereiche .symbol { color: var(--akzent); }

.startraster { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 1.2rem; align-items: start; }
.hauptspalte, .seitenspalte { display: grid; gap: 1.2rem; min-width: 0; }
.hauptspalte .karte.hr { margin: 0; }
.hauptspalte .spalten.drei { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.hauptspalte .spalten.drei > div { min-width: 0; }
.hauptspalte .hr .spalten.drei { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.hauptspalte .hr .spalten.drei > div:first-child { grid-column: 1 / -1; }
@media (max-width: 600px) { .hauptspalte .hr .spalten.drei { grid-template-columns: 1fr; } }
@media (max-width: 980px) { .startraster { grid-template-columns: 1fr; } }
.kennzahlen { margin-top: 0; }

/* Geburtstage */
.geburtstage h2 { display: flex; align-items: center; gap: 0.4rem; }
.geburtstage h2 .symbol { color: var(--akzent); }
.gb-tag { padding: 0.55rem 0 0.35rem; border-top: 1px solid var(--linie); }
.gb-tag:first-of-type { border-top: 0; }
.gb-tag h3 { font-size: 0.8rem; color: var(--leise); margin: 0 0 0.2rem; font-weight: 600; }
.gb-tag ul { list-style: none; margin: 0; padding: 0; }
.gb-tag li { padding: 0.15rem 0; }
.gb-tag small { display: block; font-size: 0.8rem; }
.gb-tag.heute { background: var(--akzent-hell); margin: 0.3rem -0.7rem 0.2rem; padding: 0.55rem 0.7rem; border-radius: 8px; border-top: 0; }
.gb-tag.heute h3 { color: var(--akzent); }
.gb-tag.heute li { font-weight: 600; }
.gb-tag.heute small { font-weight: 400; }
.gb-gruss { margin: 0.2rem 0 0; color: var(--akzent); font-weight: 600; }

/* Notizen */
.notizen h2, .mitteilungen h2 { display: flex; align-items: center; gap: 0.4rem; }
.notizen .karte-kopf { margin-bottom: 0.7rem; }
.notizform { display: grid; gap: 0.45rem; margin-bottom: 0.9rem; }
.notizliste .notizform { margin-bottom: 0.2rem; }
.notizform textarea { width: 100%; font: inherit; padding: 0.5rem 0.6rem; border: 1px solid var(--linie); border-radius: 8px; background: var(--grund); color: var(--text); resize: vertical; }
.notizform-zeile { display: flex; flex-wrap: wrap; gap: 0.5rem 0.8rem; align-items: center; }
.notizform-zeile label.klein { display: flex; align-items: center; gap: 0.3rem; color: var(--leise); }
.notizform-zeile input[type=date], .notizform-zeile select { font: inherit; font-size: 0.82rem; padding: 0.2rem 0.35rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.notizform-zeile .knopf { margin-left: auto; }
.farbwahl { border: 0; margin: 0; padding: 0; display: flex; gap: 0.3rem; }
.farbpunkt { position: relative; width: 1.25rem; height: 1.25rem; border-radius: 50%; border: 1px solid var(--linie); cursor: pointer; }
.farbpunkt input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.farbpunkt:has(input:checked) { outline: 2px solid var(--akzent); outline-offset: 1px; }
.farbpunkt:has(input:focus-visible) { outline: 2px solid var(--text); outline-offset: 1px; }
.farbe-gelb { background: var(--papier-gelb); } .farbe-gruen { background: var(--papier-gruen); } .farbe-blau { background: var(--papier-blau); }
.farbe-rosa { background: var(--papier-rosa); } .farbe-grau { background: var(--papier-grau); }

.notizliste { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0.6rem; align-items: start; }
.notizliste .leer { grid-column: 1 / -1; }
.notiz { position: relative; border-radius: 6px 6px 6px 14px; padding: 0.65rem 0.8rem 0.5rem; }
.mitteilungen .notiz + .notiz { margin-top: 0.55rem; }
.notiz.angeheftet { box-shadow: inset 3px 0 0 var(--akzent); }
.notiz.faellig { box-shadow: inset 3px 0 0 var(--warnung); }
.notiz .nadel { position: absolute; top: 0.5rem; right: 0.55rem; color: var(--akzent); }
.notiz-text { overflow-wrap: anywhere; padding-right: 1.2rem; }
.notiz-meta { margin: 0.3rem 0 0; font-size: 0.75rem; color: var(--leise); }
.notiz-aktionen { display: flex; flex-wrap: wrap; gap: 0.2rem 0.8rem; align-items: start; margin-top: 0.25rem; font-size: 0.8rem; }
.notiz-aktionen form { margin: 0; display: flex; gap: 0.8rem; }
.notiz-aktionen .link { font-size: 0.8rem; color: var(--leise); }
.notiz-aktionen .link:hover { color: var(--akzent); }
.notiz-aktionen .link.gefahr { color: var(--warnung); }
.notiz-aktionen summary { cursor: pointer; color: var(--leise); list-style: none; }
.notiz-aktionen summary::-webkit-details-marker { display: none; }
.notiz-aktionen details[open] { flex-basis: 100%; order: 5; }
.notiz-aktionen details[open] .notizform { margin-top: 0.4rem; }
.erledigt-liste { margin-top: 0.9rem; font-size: 0.85rem; }
.erledigt-liste summary { cursor: pointer; color: var(--leise); }
.notiz-erledigt { display: flex; justify-content: space-between; gap: 0.6rem; padding: 0.35rem 0; border-bottom: 1px solid var(--linie); }
.notiz-erledigt span { text-decoration: line-through; color: var(--leise); }
.notiz-erledigt form { display: flex; gap: 0.6rem; margin: 0; white-space: nowrap; }
.erledigt-liste > form { margin-top: 0.5rem; }
@media (prefers-reduced-motion: no-preference) { .notiz-aktionen details[open] .notizform { animation: aufklappen 0.15s ease-out; } }
@keyframes aufklappen { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

/* Kennzahlen kompakter */
.kennzahlen div { padding: 0.65rem 0.9rem; }
.kennzahlen strong { font-size: 1.35rem; }

/* Stufenübersicht und Rollenmatrix */
.kurschips { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.kurschips a { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 5px; background: var(--akzent-hell); color: var(--akzent); font-size: 0.8rem; font-weight: 600; text-decoration: none; }
.kurschips a:hover { background: var(--akzent); color: var(--flaeche); }
.rollenmatrix th[scope=row] { min-width: 18rem; max-width: 26rem; font-weight: 400; }
.rollenmatrix th.senkrecht { vertical-align: bottom; height: 10rem; padding-bottom: 0.6rem; }
.rollenmatrix th.senkrecht span { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; }
.rollenmatrix td.recht { text-align: center; font-size: 0.82rem; white-space: nowrap; }
.recht-ja { background: var(--akzent-hell); color: var(--akzent); font-weight: 700; }
.recht-lesen { color: var(--text); }
.recht-eigene, .recht-stufe, .recht-teils, .recht-teils_ek { color: var(--akzent); font-weight: 600; }
.recht-nein { color: var(--leise); }

/* ---------------------------------------------------------------- Zuordnung */
.zo-kopf { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.zo-kopf h1 { margin-bottom: 0; }
.zo-sj label { display: flex; flex-direction: column; font-size: 0.8rem; color: var(--leise); gap: 0.2rem; }
.zo-raster { display: grid; grid-template-columns: minmax(200px, 250px) minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
@media (max-width: 1100px) { .zo-raster { grid-template-columns: minmax(180px, 220px) minmax(0, 1fr); } .zo-pool { grid-column: 2; } }
@media (max-width: 720px) { .zo-raster { grid-template-columns: 1fr; } .zo-pool { grid-column: auto; } }
.zo-raster .karte { padding: 1rem; min-width: 0; }
.zo-raster h2 { font-size: 1rem; }
.zo-suche { width: 100%; font: inherit; font-size: 0.9rem; padding: 0.45rem 0.65rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); }
.zo-gruppen { position: sticky; top: 0.6rem; max-height: calc(100vh - 1.2rem); overflow-y: auto; }
.zo-gruppen h2 { font-size: 0.75rem; color: var(--leise); font-weight: 600; margin: 0.9rem 0 0.25rem; }
.zo-gruppen ul { list-style: none; margin: 0; padding: 0; }
.zo-gruppen li a { display: flex; justify-content: space-between; gap: 0.5rem; padding: 0.35rem 0.55rem; border-radius: 6px; color: var(--text); text-decoration: none; font-size: 0.92rem; }
.zo-gruppen li a:hover { background: var(--akzent-hell); }
.zo-gruppen li a.aktiv { background: var(--akzent); color: var(--flaeche); font-weight: 600; }
.zo-gruppen li a small { color: inherit; opacity: 0.7; font-variant-numeric: tabular-nums; }
.zo-neu { margin-top: 1rem; border-top: 1px solid var(--linie); padding-top: 0.7rem; }
.zo-neu > summary { cursor: pointer; font-weight: 600; color: var(--akzent); }
.zo-neu .formular { gap: 0.5rem; }
.zo-neu input, .zo-neu select { width: 100%; }
.zo-gruppenkopf { display: flex; justify-content: space-between; gap: 0.8rem; flex-wrap: wrap; align-items: flex-start; }
.zo-gruppenkopf h2 { font-size: 1.25rem; margin: 0; }
.zo-gruppenkopf .unterzeile { margin: 0.1rem 0 0; }
.zo-stichtag { display: flex; align-items: center; gap: 0.6rem; margin: 0.8rem 0; font-size: 0.85rem; color: var(--leise); }
.zo-stichtag input { font: inherit; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.zo-hinweis { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; padding: 0.6rem 0.8rem; margin-bottom: 0.7rem;
  border-radius: 8px; background: var(--akzent-hell); font-size: 0.88rem; }
.zo-liste-kopf { display: flex; justify-content: space-between; align-items: center; gap: 0.6rem; padding: 0.4rem 0; border-bottom: 1px solid var(--linie); }
.haken { display: inline-flex; align-items: center; gap: 0.4rem; cursor: pointer; }
.zo-ablage, .zo-poolliste { max-height: 62vh; overflow-y: auto; }
.zo-zeile { display: flex; align-items: center; gap: 0.6rem; padding: 0.38rem 0.3rem; border-bottom: 1px solid var(--linie); }
.zo-zeile:last-child { border-bottom: 0; }
.zo-zeile input[type=checkbox] { width: 1rem; height: 1rem; flex: none; accent-color: var(--akzent); }
.zo-name { flex: 1; min-width: 0; }
.zo-name small { display: block; color: var(--leise); font-size: 0.76rem; }
.zo-poolzeile { cursor: pointer; border-radius: 6px; }
.zo-poolzeile:hover { background: var(--grund); }
.zo-poolzeile.gewaehlt { background: var(--akzent-hell); }
.zo-poolzeile[draggable=true] { cursor: grab; }
.zo-poolzeile[hidden] { display: none; }
.zo-rolle { display: flex; gap: 0.2rem; margin: 0; }
.zo-rolle input { width: 8.5rem; font: inherit; font-size: 0.8rem; padding: 0.2rem 0.4rem; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--text); }
.zo-rolle input:hover, .zo-rolle input:focus { border-color: var(--linie); background: var(--grund); }
.zo-rolle .link { color: var(--akzent); font-weight: 700; padding: 0 0.3rem; }
.zo-mitglieder.ablegen { outline: 2px dashed var(--akzent); outline-offset: 3px; background: var(--akzent-hell); }
.zo-leer { padding: 1.5rem 0.5rem; text-align: center; }
.zo-filter { display: grid; gap: 0.5rem; margin-bottom: 0.4rem; }
.zo-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.zo-chip { font: inherit; font-size: 0.8rem; padding: 0.2rem 0.6rem; border-radius: 999px; border: 1px solid var(--linie); background: var(--flaeche); color: var(--text); cursor: pointer; }
.zo-chip[aria-pressed=true] { background: var(--akzent); border-color: var(--akzent); color: var(--flaeche); font-weight: 600; }
.zo-filterzeile { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.zo-filterzeile select { font: inherit; font-size: 0.82rem; padding: 0.25rem 0.4rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.knopf.gefahr { background: var(--gefahr-flaeche); color: var(--warnung); }
.knopf:disabled { opacity: 0.45; cursor: default; }

/* ---------------------------------------------------------------- Neuanmeldung */
.an-tabs { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0 0 0.8rem; border-bottom: 1px solid var(--linie); }
.an-tabs a { padding: 0.45rem 0.8rem; border-radius: 8px 8px 0 0; color: var(--leise); text-decoration: none; font-size: 0.9rem; font-weight: 600; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.an-tabs a span { display: inline-block; min-width: 1.4rem; margin-left: 0.25rem; padding: 0 0.35rem; border-radius: 999px; background: var(--linie); color: var(--text); font-size: 0.75rem; text-align: center; font-variant-numeric: tabular-nums; }
.an-tabs a:hover { color: var(--akzent); }
.an-tabs a.aktiv { color: var(--akzent); border-bottom-color: var(--akzent); }
.an-tabs a.aktiv span { background: var(--akzent); color: var(--flaeche); }
.an-filter { margin-bottom: 1rem; }
.an-filter input[type=search] { font: inherit; padding: 0.4rem 0.55rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); min-width: 14rem; }
.an-filter .an-meine { flex-direction: row; align-items: center; font-size: 0.85rem; color: var(--text); padding-bottom: 0.4rem; }
.an-liste td { vertical-align: middle; }
.an-fortschritt-zelle { min-width: 8.5rem; }
.an-fortschritt-zelle small { display: block; font-size: 0.75rem; color: var(--leise); margin-top: 0.15rem; }

.an-status { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; white-space: nowrap; background: var(--linie); color: var(--text); vertical-align: middle; }
.an-status.gross { font-size: 0.8rem; padding: 0.15rem 0.7rem; margin-left: 0.4rem; }
.an-status-eingegangen { background: var(--info-flaeche); color: var(--info-text); }
.an-status-pruefung { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.an-status-warteliste { background: var(--lila-flaeche); color: var(--lila-text); }
.an-status-zugesagt { background: var(--akzent-hell); color: var(--akzent); }
.an-status-abgelehnt, .an-status-zurueckgezogen { background: var(--gefahr-flaeche); color: var(--warnung); }
.an-status-uebernommen { background: var(--akzent); color: var(--flaeche); }

.an-balken { height: 0.45rem; border-radius: 999px; background: var(--linie); overflow: hidden; }
.an-balken span { display: block; height: 100%; background: var(--akzent); border-radius: inherit; }
.an-balken.gross { height: 0.6rem; margin: 0.2rem 0 0.8rem; }

.an-statusleiste { display: flex; flex-wrap: wrap; gap: 0.3rem; align-items: center; margin: 0.8rem 0 1rem; }
.an-schritt { font: inherit; font-size: 0.85rem; font-weight: 600; padding: 0.35rem 0.8rem; border: 1px solid var(--linie); background: var(--flaeche); color: var(--leise); border-radius: 999px; cursor: pointer; }
.an-schritt:hover:not(:disabled) { border-color: var(--akzent); color: var(--akzent); }
.an-schritt.aktiv { background: var(--akzent); border-color: var(--akzent); color: var(--flaeche); }
.an-schritt-abgelehnt, .an-schritt-zurueckgezogen { margin-left: 0.2rem; }
.an-schritt-abgelehnt { margin-left: 1rem; }
.an-schritt-abgelehnt.aktiv, .an-schritt-zurueckgezogen.aktiv { background: var(--warnung); border-color: var(--warnung); }
.an-schritt:disabled { cursor: default; }
.an-seit { font-size: 0.8rem; margin-left: 0.4rem; }

.an-banner { padding: 0.75rem 1rem; border-radius: var(--radius); margin: 0 0 1rem; border: 1px solid var(--linie); background: var(--flaeche); }
.an-banner.ok { border-color: var(--akzent); background: var(--akzent-hell); }
.an-banner.warnend { border-color: var(--warnung); background: var(--gefahr-flaeche); }
.an-banner ul { margin: 0.3rem 0; }

.an-raster { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); gap: 1.2rem; align-items: start; }
@media (max-width: 960px) { .an-raster { grid-template-columns: 1fr; } }
.an-hauptspalte, .an-seitenspalte { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; min-width: 0; }
.an-raster .karte { min-width: 0; }
.etikett.meins { background: var(--akzent); color: var(--flaeche); }

.an-punkte { list-style: none; margin: 0; padding: 0; }
.an-punkt { display: flex; gap: 0.7rem; align-items: flex-start; padding: 0.5rem 0.3rem; border-bottom: 1px solid var(--linie); border-radius: 4px; }
.an-punkt:last-child { border-bottom: 0; }
.an-punkt form { margin: 0; }
.an-punkt.meins { background: linear-gradient(90deg, var(--akzent-hell), transparent 70%); }
.an-punkt:target { outline: 2px solid var(--akzent); outline-offset: -2px; }
.an-kaestchen { flex: none; position: relative; width: 1.35rem; height: 1.35rem; margin-top: 0.1rem; border: 2px solid var(--leise); border-radius: 5px; background: var(--flaeche); cursor: pointer; padding: 0; }
.an-kaestchen:hover:not(:disabled) { border-color: var(--akzent); }
.an-kaestchen[aria-checked=true] { background: var(--akzent); border-color: var(--akzent); }
.an-kaestchen[aria-checked=true]::after { content: ""; position: absolute; left: 0.36rem; top: 0.1rem; width: 0.35rem; height: 0.7rem; border: solid var(--flaeche); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.an-kaestchen:disabled { cursor: default; opacity: 0.7; }
.an-punkt-text { flex: 1; min-width: 0; }
.an-punkt.erledigt .an-punkt-titel { color: var(--leise); text-decoration: line-through; text-decoration-color: var(--linie); }
.an-pflicht { display: inline-block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--warnung); margin: 0 0.3rem; }
.an-punkt.erledigt .an-pflicht { color: var(--leise); }
.an-punkt-menue { position: relative; flex: none; }
.an-punkt-menue summary { list-style: none; cursor: pointer; color: var(--leise); font-weight: 700; padding: 0 0.4rem; border-radius: 5px; letter-spacing: 0.05em; }
.an-punkt-menue summary::-webkit-details-marker { display: none; }
.an-punkt-menue summary:hover { background: var(--grund); color: var(--akzent); }
.an-menue { position: absolute; right: 0; z-index: 15; margin-top: 0.3rem; display: grid; gap: 0.6rem; min-width: 19rem; padding: 0.8rem; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.14); }
.an-menue-knoepfe { display: flex; gap: 1rem; flex-wrap: wrap; }
.an-menue-knoepfe .link { font-size: 0.85rem; color: var(--akzent); }
.an-menue-knoepfe .link.gefahr { color: var(--warnung); }
.an-zusammenstellen { display: grid; gap: 0.6rem; margin-top: 0.9rem; padding-top: 0.8rem; border-top: 1px solid var(--linie); }
.an-zusammenstellen .an-breit { flex: 1 1 16rem; }
.an-zusammenstellen .an-breit input { width: 100%; }
.inline-form label.an-zeile { flex-direction: row; align-items: center; gap: 0.3rem; color: var(--text); padding-bottom: 0.35rem; }

.an-dateiwahl { display: flex; flex-direction: column; gap: 0.3rem; margin: 0; font-size: 0.82rem; }
.an-dateiwahl select { font-size: 0.8rem; padding: 0.2rem 0.3rem; max-width: 15rem; }
.an-ablage { display: flex !important; flex-direction: column; align-items: center; gap: 0.25rem; padding: 1.1rem; border: 2px dashed var(--linie); border-radius: var(--radius); text-align: center; cursor: pointer; font-weight: 400 !important; }
.an-ablage:hover, .an-ablage.ablegen { border-color: var(--akzent); background: var(--akzent-hell); }
.an-ablage input[type=file] { max-width: 100%; font-size: 0.85rem; }
.an-dateinamen { font-size: 0.82rem; color: var(--akzent); font-weight: 600; overflow-wrap: anywhere; }

.an-klasse-gross { font-size: 2rem; font-weight: 700; margin: 0; line-height: 1.1; color: var(--akzent); }
.an-seitenspalte .inline-form { margin: 0.6rem 0 0.2rem; }
.an-seitenspalte .inline-form select { max-width: 16rem; }
.an-bemerkung { margin: 0; white-space: normal; }
.an-verlauf { list-style: none; margin: 0; padding: 0; font-size: 0.85rem; }
.an-verlauf li { display: grid; grid-template-columns: max-content 1fr; gap: 0.6rem; padding: 0.3rem 0; border-bottom: 1px solid var(--linie); }
.an-verlauf li:last-child { border-bottom: 0; }
a.klein, .klein { font-size: 0.85rem; }

.an-formular { display: grid; gap: 1.2rem; margin-top: 1rem; }
.an-formular h3 { margin-top: 1.2rem; }
.an-felder { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 0.7rem 1rem; }
.an-feld { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.85rem; font-weight: 600; min-width: 0; }
.an-feld.breit { grid-column: 1 / -1; }
.an-feld input:not([type=checkbox]), .an-feld select, .an-feld textarea { font: inherit; font-weight: 400; width: 100%; padding: 0.42rem 0.55rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); }
.an-feld input:disabled, .an-feld select:disabled, .an-feld textarea:disabled { opacity: 0.7; }
.an-feld small { font-weight: 400; }
.an-feld.an-haken { flex-direction: row; align-items: center; gap: 0.45rem; font-weight: 400; }
.an-feld.an-haken input { width: 1rem; height: 1rem; accent-color: var(--akzent); }
.an-haken-reihe { display: flex; flex-wrap: wrap; gap: 0.4rem 1.3rem; margin: 0.8rem 0; }
.an-loeschen span { color: var(--warnung); }
.an-kontakt { border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.9rem 1rem; margin: 0 0 0.9rem; }
.an-kontakt legend { font-weight: 700; padding: 0 0.4rem; }
.an-adresse[hidden] { display: none; }
.an-vorlagen { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 0.6rem; }
.an-vorlage { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.6rem 0.75rem; border: 1px solid var(--linie); border-radius: 8px; cursor: pointer; }
.an-vorlage:has(input:checked) { border-color: var(--akzent); background: var(--akzent-hell); }
.an-vorlage input { margin-top: 0.25rem; accent-color: var(--akzent); }
.an-vorlage small { display: block; }
.an-absenden { margin-bottom: 1rem; }

.an-uebernahme { display: grid; gap: 1.2rem; margin-top: 1rem; }
.an-hinweise { margin: 0.8rem 0 0; padding-left: 1.1rem; color: var(--warnung); font-size: 0.9rem; }
.an-kontaktwahl { border: 0; border-top: 1px solid var(--linie); padding: 0.7rem 0; margin: 0; display: grid; gap: 0.35rem; }
.an-kontaktwahl:first-of-type { border-top: 0; }
.an-kontaktwahl legend { padding: 0; margin-bottom: 0.3rem; }
.an-bestaetigen { margin-top: 0.8rem; font-weight: 600; }
.kennzahlen.klein a { text-decoration: none; color: inherit; }

/* ---------------------------------------------------------------- Zeugnisse und Konferenzen */
.zg-status { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; white-space: nowrap; vertical-align: middle; background: var(--linie); color: var(--text); }
.zg-status.gross { font-size: 0.8rem; padding: 0.15rem 0.7rem; margin-left: 0.4rem; }
.zg-status-entwurf, .zg-status-geplant { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.zg-status-durchgefuehrt { background: var(--info-flaeche); color: var(--info-text); }
.zg-status-freigegeben, .zg-status-abgeschlossen { background: var(--akzent-hell); color: var(--akzent); }
.zg-leiste { margin: 0.4rem 0 1rem; align-items: center; }
.zg-leiste form { margin: 0; }
.zg-inline { display: inline; margin: 0; }
.zg-kern { display: inline-block; font-size: 0.65rem; font-weight: 800; padding: 0 0.25rem; border-radius: 3px; background: var(--akzent-hell); color: var(--akzent); vertical-align: middle; }
.zg-versetzung { margin-top: 0.9rem; padding: 0.7rem 0.9rem; border-radius: 8px; background: var(--akzent-hell); font-size: 0.92rem; }
.zg-versetzung.warnend { background: var(--gefahr-flaeche); }
.zg-versetzung ul { margin: 0.3rem 0; }
.zg-noten th[scope=row] { font-weight: 600; }
.zg-noten tbody.zg-schueler { border-bottom: 2px solid var(--linie); }
.zg-noten tbody.zg-schueler tr:first-child td, .zg-noten tbody.zg-schueler tr:first-child th { border-bottom: 0; vertical-align: middle; }
.zg-noten tbody.fehlerhaft { background: var(--gefahr-flaeche); }
.zg-wahl { min-width: 10rem; }
.zg-wahl.vorschlag { border-style: dashed; color: var(--leise); }
.zg-begruendung { width: 100%; min-width: 12rem; font: inherit; font-size: 0.85rem; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.zg-kommentarzeile td { padding-top: 0; }
.zg-kommentarzeile summary { cursor: pointer; font-size: 0.85rem; color: var(--akzent); font-weight: 600; }
.zg-kommentar { margin: 0.5rem 0 0.3rem; }
.zg-kommentartext { margin: 0.4rem 0; padding: 0.6rem 0.9rem; border-left: 3px solid var(--akzent); background: var(--grund); border-radius: 0 8px 8px 0; white-space: normal; max-width: 85ch; }
.zg-kommentarmeta { font-size: 0.8rem; margin: 0.2rem 0; }
.zg-kommentaraktionen form { display: flex; gap: 0.6rem; align-items: center; margin: 0.3rem 0; }
.zg-anmerkungen { list-style: none; margin: 0.6rem 0; padding: 0; display: grid; gap: 0.4rem; max-width: 85ch; }
.zg-anmerkungen li { padding: 0.45rem 0.7rem; border-radius: 8px; background: var(--hinweis-flaeche); color: var(--notiz-text); font-size: 0.88rem; }
.zg-anmerkungen li.erledigt { background: var(--grund); color: var(--leise); }
.zg-anmerkungen .zg-anmerkung-kopf { display: block; font-size: 0.75rem; font-weight: 600; opacity: 0.8; }
.zg-anmerkungen .link { font-size: 0.78rem; color: inherit; text-decoration: underline; }
.zg-anmerken { display: flex; gap: 0.5rem; align-items: flex-start; max-width: 85ch; margin: 0.4rem 0; }
.zg-anmerken textarea { flex: 1; font: inherit; font-size: 0.88rem; padding: 0.35rem 0.5rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); resize: vertical; }
.zg-kommentarform textarea { width: 100%; font: inherit; line-height: 1.55; padding: 0.7rem 0.8rem; border: 1px solid var(--linie); border-radius: 8px; background: var(--grund); color: var(--text); resize: vertical; }
.zg-kommentarform .knopfreihe { align-items: center; margin-top: 0.5rem; }
.zg-punkt { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; margin-right: 0.35rem; vertical-align: middle; background: var(--linie); }
.zg-punkt.ok { background: var(--ok); }
.zg-punkt.veraltet { background: var(--warnung); }
.zg-punkt.offen { background: transparent; border: 2px solid var(--leise); }
.zg-unterzeichner { list-style: none; padding: 0; margin: 0; columns: 2 16rem; font-size: 0.9rem; }
.zg-unterzeichner li { padding: 0.2rem 0; break-inside: avoid; }
.zg-speichern { margin: 1rem 0; align-items: center; }
.zg-angaben input, .zg-angaben select, .zg-angaben textarea { width: 100%; }
.zg-angaben .haken input { width: auto; }
.formzeile.zwei { grid-template-columns: 1fr 1fr; }
.formzeile.vier { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 760px) { .formzeile.zwei, .formzeile.vier { grid-template-columns: 1fr; } }
.zg-ger table input { width: 100%; min-width: 2.5rem; font: inherit; font-size: 0.85rem; padding: 0.2rem 0.3rem; border: 1px solid var(--linie); border-radius: 5px; background: var(--grund); color: var(--text); }
.zg-ger summary { cursor: pointer; font-weight: 600; font-size: 0.85rem; color: var(--akzent); }
.zg-kopfdaten { margin-bottom: 1.2rem; }
.zg-kopfdaten > summary { cursor: pointer; list-style: none; display: flex; gap: 1rem; align-items: baseline; flex-wrap: wrap; }
.zg-kopfdaten > summary::-webkit-details-marker { display: none; }
.zg-kopfdaten > summary h2 { margin: 0; }
.zg-kopfdaten > summary h2::before { content: "▸ "; color: var(--akzent); }
.zg-kopfdaten[open] > summary h2::before { content: "▾ "; }
.zg-kopfdaten fieldset { border: 0; padding: 0; margin: 0.8rem 0 0; max-width: none; }
.zg-kopfdaten input, .zg-kopfdaten select, .zg-kopfdaten textarea { width: 100%; }
.zg-teilnehmende { border: 1px solid var(--linie) !important; border-radius: 8px; padding: 0.6rem 0.8rem !important; }
.zg-teilnehmende legend { padding: 0 0.3rem; }
.zg-matrix { font-size: 0.88rem; }
.zg-matrix th, .zg-matrix td { text-align: center; padding: 0.35rem 0.45rem; }
.zg-matrix .links { text-align: left; }
.zg-matrix thead th { font-size: 0.75rem; }
.zg-matrix td.kern { font-weight: 700; text-decoration: underline; text-decoration-color: var(--akzent); }
.zg-n5 { background: var(--hinweis-flaeche); color: var(--hinweis-text); font-weight: 700; }
.zg-n6 { background: var(--gefahr-flaeche); color: var(--warnung); font-weight: 700; }
.zg-matrixzeile th, .zg-matrixzeile td { border-bottom: 0; }
.zg-beschlusszeile td { text-align: left; padding: 0 0.45rem 0.7rem; border-bottom: 2px solid var(--linie); background: var(--grund); }
.zg-beschluss { border: 0; margin: 0; padding: 0.5rem 0 0; display: flex; flex-wrap: wrap; gap: 0.5rem 0.8rem; align-items: end; }
.zg-beschluss label { display: flex; flex-direction: column; font-size: 0.72rem; color: var(--leise); gap: 0.15rem; }
.zg-beschluss label.breit { flex: 1 1 14rem; }
.zg-beschluss label.zahl input { width: 4.2rem; }
.zg-beschluss input, .zg-beschluss select, .zg-beschluss textarea { font: inherit; font-size: 0.85rem; padding: 0.25rem 0.4rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--flaeche); color: var(--text); }
.zg-beschluss textarea { resize: vertical; }
.zg-gruende { display: block; margin-top: 0.3rem; font-size: 0.78rem; }
.zg-vorschlag { min-width: 12rem; }
.zg-angaben label.haken { flex-direction: row; align-items: center; gap: 0.45rem; font-weight: 400; }
.spalten > * { min-width: 0; }

/* ---------------------------------------------------------------- Designs (Auswahl oben rechts)
   „standard“ = Farben oben (hell/dunkel nach System). Latte und Mocha sind feste Paletten von Catppuccin
   (https://catppuccin.com, MIT-Lizenz). Schriftfarben auf getönten Flächen sind für ausreichenden Kontrast
   (WCAG AA) gegenüber der Palette leicht abgedunkelt. :root[data-design] schlägt :root in der Dunkel-Abfrage. */
:root[data-design="latte"] {
  color-scheme: light;
  --grund: #e6e9ef; --flaeche: #eff1f5; --text: #4c4f69; --leise: #5c5f77; --linie: #ccd0da;
  --akzent: #8839ef; --akzent-hell: #efe6fc; --warnung: #d20f39; --gefahr-flaeche: #f9e5ea;
  --info-flaeche: #dfe7f8; --info-text: #1a55cc; --hinweis-flaeche: #f6ead8; --hinweis-text: #8a5a10; --notiz-text: #4c4f69;
  --lila-flaeche: #ece3fb; --lila-text: #7a2ee0; --ok: #2f7d1f;
  --papier-gelb: #f3e9d9; --papier-gruen: #dceadb; --papier-blau: #dde5f6; --papier-rosa: #f1e2f0; --papier-grau: #dce0e8;
}
:root[data-design="mocha"] {
  color-scheme: dark;
  --grund: #181825; --flaeche: #1e1e2e; --text: #cdd6f4; --leise: #a6adc8; --linie: #313244;
  --akzent: #cba6f7; --akzent-hell: #3a3350; --warnung: #f38ba8; --gefahr-flaeche: #432f42;
  --info-flaeche: #2c3450; --info-text: #89b4fa; --hinweis-flaeche: #3f3b41; --hinweis-text: #f9e2af; --notiz-text: #f9e2af;
  --lila-flaeche: #3a3350; --lila-text: #cba6f7; --ok: #a6e3a1;
  --papier-gelb: #38343b; --papier-gruen: #2b3539; --papier-blau: #2a3048; --papier-rosa: #383147; --papier-grau: #2a2b3c;
}

/* ---------------------------------------------------------------- Elternkommunikation */
.ek-ok { color: var(--ok); font-weight: 600; }
.ek-offen { color: var(--hinweis-text); font-weight: 600; }
.ek-neu td:first-child { box-shadow: inset 3px 0 0 var(--akzent); }
.ek-etikett-neu { background: var(--info-flaeche); color: var(--info-text); }
.ek-art { display: inline-block; padding: 0.05rem 0.5rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; white-space: nowrap; background: var(--linie); color: var(--text); }
.ek-art-zeugnis { background: var(--lila-flaeche); color: var(--lila-text); }
.ek-art-fehlzeiten { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.ek-schreiben { margin-left: 0.5rem; font-size: 0.82rem; }
.ek-neu-raster { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.2rem; margin-bottom: 1rem; align-items: start; }
.ek-felder { grid-template-columns: 1fr 1fr; }
.ek-felder textarea { min-height: 12rem; }
.ek-empf { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.5rem 0; border-bottom: 1px solid var(--linie); cursor: pointer; }
.ek-empf input { margin-top: 0.3rem; }
.ek-schuelerliste { max-height: 32rem; overflow-y: auto; }
.ek-spalten { grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); margin-top: 0.8rem; }
.ek-verlauf { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 0.8rem; }
.ek-beitrag { border: 1px solid var(--linie); border-radius: 10px; padding: 0.7rem 0.9rem; background: var(--flaeche); max-width: 75ch; }
.ek-von-eltern { background: var(--info-flaeche); border-color: transparent; margin-left: auto; }
.ek-von-system { background: var(--grund); }
.ek-beitrag-kopf { font-size: 0.85rem; margin-bottom: 0.3rem; }
.ek-text p { margin: 0 0 0.6rem; overflow-wrap: anywhere; }
.ek-text p:last-child { margin-bottom: 0; }
.ek-antwort { display: grid; gap: 0.5rem; border-top: 1px solid var(--linie); padding-top: 0.8rem; }
.ek-antwort .an-feld { max-width: none; }
.ek-antwort textarea { width: 100%; }
.ek-antwort .knopf { justify-self: start; }
.ek-zusammenfassung { font-weight: 600; margin-top: 0; }
.ek-empfaenger { padding: 0.6rem 0; border-top: 1px solid var(--linie); font-size: 0.9rem; }
.ek-status { list-style: none; margin: 0.25rem 0; padding: 0; font-size: 0.82rem; display: grid; gap: 0.1rem; }
.ek-zustellung-fehler, .ek-zustellung-ohne_email { color: var(--warnung); font-weight: 600; }
.ek-zustellung-wartet { color: var(--hinweis-text); }
.ek-aktionen { display: flex; flex-wrap: wrap; gap: 0.3rem 0.9rem; align-items: center; font-size: 0.82rem; }
.ek-aktionen form { margin: 0; }
.ek-vermerk summary { cursor: pointer; color: var(--akzent); }
.ek-vermerk form { display: flex; gap: 0.4rem; margin-top: 0.4rem; flex-wrap: wrap; }
.ek-vermerk input[type=text] { flex: 1; min-width: 10rem; font: inherit; padding: 0.3rem 0.5rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.ek-vorschau-liste p { margin: 0.2rem 0; }
@media (max-width: 860px) { .ek-neu-raster, .ek-spalten, .ek-felder { grid-template-columns: 1fr; } }

/* Elternseite (Link / Portal) */
.ek-eltern-kopf { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 0.8rem 1.2rem; background: var(--flaeche); border-bottom: 1px solid var(--linie); }
.ek-eltern-marke { display: flex; align-items: center; gap: 0.7rem; }
.ek-eltern-marke small { display: block; color: var(--leise); font-size: 0.8rem; }
.ek-eltern-inhalt { max-width: 760px; margin: 0 auto; padding: 1.2rem; display: grid; gap: 1rem; }
.ek-eltern-inhalt h1 { margin-bottom: 0; }
.ek-eltern .ek-von-eltern { margin-left: 2rem; }
.ek-sprachwahl { display: flex; gap: 0.8rem; font-size: 0.9rem; }
.ek-sprachwahl a[aria-current] { font-weight: 700; text-decoration: none; color: var(--text); }
.ek-meldung { padding: 0.7rem 0.9rem; border-radius: 8px; background: var(--akzent-hell); color: var(--akzent); font-weight: 600; margin: 0; }
.ek-vorschau { padding: 0.6rem 0.9rem; border-radius: 8px; background: var(--hinweis-flaeche); color: var(--hinweis-text); margin: 0; }
.ek-bestaetigung p { margin-top: 0; }
.ek-portalzeile { padding: 0.4rem 0; border-bottom: 1px solid var(--linie); margin: 0; }

/* ---------------------------------------------------------------- System: Sicherung, PDF-Export, Benutzer und Rechte */
.sy-reiter { margin-bottom: 1rem; }
.sy-raster { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.2rem; align-items: start; }
.sy-formular { display: grid; gap: 0.7rem; }
.sy-raster > * { min-width: 0; }
.sy-module { min-width: 0; border: 1px solid var(--linie); border-radius: 8px; padding: 0.6rem 0.9rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); gap: 0.25rem 1rem; margin: 0.3rem 0 0.8rem; }
.sy-module legend { font-weight: 600; font-size: 0.85rem; padding: 0 0.3rem; }
.sy-alle { grid-column: 1 / -1; border-bottom: 1px solid var(--linie); padding-bottom: 0.3rem; }
.sy-feld { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.85rem; font-weight: 600; }
.sy-feld input, .sy-feld select { font: inherit; font-weight: 400; padding: 0.42rem 0.55rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); }
.sy-zeitraum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.7rem; }
.sy-formular .knopf { justify-self: start; }
.sy-hinweise { margin: 0 0 0.8rem; padding-left: 1.1rem; display: grid; gap: 0.35rem; font-size: 0.9rem; }
.sy-ueberschrift { margin: 1.4rem 0 0.7rem; }
.sy-aktionen { display: flex; gap: 0.35rem; align-items: center; flex-wrap: wrap; }
.sy-aktionen form { margin: 0; }
.sy-art { display: inline-block; padding: 0.05rem 0.5rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; background: var(--linie); color: var(--text); white-space: nowrap; }
.sy-art-vor_wiederherstellung { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.sy-art-hochgeladen { background: var(--info-flaeche); color: var(--info-text); }
.sy-art-automatisch { background: var(--lila-flaeche); color: var(--lila-text); }
.sy-plan td, .sy-plan th { font-size: 0.88rem; }
.sy-unterzeile td { font-size: 0.8rem !important; color: var(--leise); padding-top: 0.15rem; padding-bottom: 0.15rem; }
.sy-unterzeile td:first-child { padding-left: 1.6rem; }
.sy-warnung { margin: 1rem 0; padding: 0.8rem 1rem; border-radius: 8px; background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.sy-warnung ul { margin: 0.4rem 0 0; padding-left: 1.1rem; }
.sy-blockiert { background: var(--gefahr-flaeche); color: var(--warnung); }
.sy-fehler { padding: 0.6rem 0.8rem; border-radius: 8px; background: var(--gefahr-flaeche); }
.sy-bestaetigung { display: grid; gap: 0.6rem; margin-top: 1rem; padding: 0.9rem 1rem; border: 1px solid var(--warnung); border-radius: 10px; max-width: 46rem; }
.sy-bestaetigung p { margin: 0; }
.sy-bestaetigung .knopf { justify-self: start; }
.sy-bestaetigung input[type=text] { max-width: 18rem; }
.sy-status { display: inline-block; padding: 0.15rem 0.6rem; border-radius: 999px; font-size: 0.78rem; font-weight: 700; background: var(--linie); }
.sy-status-fertig { background: var(--akzent-hell); color: var(--akzent); }
.sy-status-laeuft, .sy-status-wartet { background: var(--info-flaeche); color: var(--info-text); }
.sy-status-fehler { background: var(--gefahr-flaeche); color: var(--warnung); }
.sy-auftrag { margin-bottom: 0.8rem; }
.sy-dateien { margin: 0.6rem 0 0; padding-left: 1.1rem; display: grid; gap: 0.25rem; font-size: 0.9rem; }
.sy-plus { color: var(--ok); font-weight: 700; }
.sy-minus { color: var(--warnung); font-weight: 700; }
.sy-pw { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 1.4rem; font-weight: 700; letter-spacing: 0.05em; margin: 0.3rem 0; }
.sy-passwort { border-color: var(--akzent); margin-bottom: 1rem; }
.sy-aktiv { margin: 0.8rem 0; }
.sy-app { border-top: 1px solid var(--linie); padding: 0.5rem 0; }
.sy-app summary { cursor: pointer; padding: 0.2rem 0; }
.sy-rechtetabelle th, .sy-rechtetabelle td { font-size: 0.82rem; padding: 0.25rem 0.4rem; }
.sy-rechtetabelle thead th { text-align: left; }
.sy-wahl { font: inherit; font-size: 0.8rem; padding: 0.15rem 0.3rem; border: 1px solid var(--linie); border-radius: 5px; background: var(--grund); color: var(--text); }
.sy-wahl-plus { border-color: var(--ok); color: var(--ok); font-weight: 700; }
.sy-wahl-minus { border-color: var(--warnung); color: var(--warnung); font-weight: 700; }
.sy-sonder th { font-weight: 400; font-style: italic; }
@media (max-width: 860px) { .sy-raster, .sy-zeitraum { grid-template-columns: 1fr; } }
.sy-dateiname { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.7rem; }
.sy-raster .daten { grid-template-columns: auto minmax(0, 1fr); }
.sy-raster .daten dd { overflow-wrap: anywhere; }
.sy-reiter { overflow-x: auto; }
.startraster > * { min-width: 0; }
.hauptspalte, .seitenspalte { grid-template-columns: minmax(0, 1fr); }
.sy-raster .hinweistext { overflow-wrap: anywhere; }
.sy-raster input[type=file] { max-width: 100%; min-width: 0; }
.sy-raster .inline-form { flex-wrap: wrap; }
.sy-feld[hidden] { display: none; }

/* ---------------------------------------------------------------- Schuljahre, Laufbahn, Archiv (lb-) */
.lb-kette { list-style: none; margin: 0 0 1.2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(9rem, 100%), 1fr)); gap: 0.4rem; counter-reset: lb; }
.lb-kette li { position: relative; padding: 0.5rem 0.7rem 0.5rem 2.2rem; border-radius: 8px; background: var(--flaeche); border: 1px solid var(--linie); font-size: 0.85rem; counter-increment: lb; min-width: 0; }
.lb-kette li::before { content: counter(lb); position: absolute; left: 0.6rem; top: 0.55rem; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--linie); color: var(--text); font-size: 0.72rem; font-weight: 700; display: grid; place-items: center; }
.lb-kette li strong, .lb-kette li span { display: block; }
.lb-kette li span { color: var(--leise); font-size: 0.78rem; }
.lb-kette li.hier { border-color: var(--akzent); background: var(--akzent-hell); }
.lb-kette li.hier::before { background: var(--akzent); color: var(--flaeche); }
.lb-zwei { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lb-aktiv td:first-child { box-shadow: inset 3px 0 0 var(--akzent); }
.lb-schritte { margin-top: 0.8rem; }
.lb-plan input[type=text], .lb-plan select, .lb-posten select { font: inherit; font-size: 0.88rem; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); max-width: 100%; }
.lb-zeile { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; }
.lb-klassen { margin: 0 0 0.8rem; padding-left: 1.1rem; display: grid; gap: 0.2rem; }
.lb-leiste { display: flex; gap: 0.8rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.8rem; }
.lb-jahrwahl { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; margin: 0 0 0.8rem; font-size: 0.9rem; font-weight: 600; }
.lb-leiste .lb-jahrwahl { margin: 0; }
.lb-jahrwahl select { font: inherit; font-weight: 400; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.lb-klasse { margin-bottom: 1rem; }
.lb-posten td { vertical-align: middle; }
.lb-hindernis { background: var(--gefahr-flaeche); }
.lb-erledigt td { color: var(--leise); }
.lb-speichern { position: sticky; bottom: 0; padding: 0.7rem 0; background: var(--grund); display: flex; gap: 0.5rem; flex-wrap: wrap; border-top: 1px solid var(--linie); }
.lb-archivhinweis { margin: 0.4rem 0 1rem; padding: 0.7rem 1rem; border-radius: 8px; background: var(--lila-flaeche); color: var(--lila-text); }
.lb-zeitstrahl { list-style: none; margin: 1rem 0 1.4rem; padding: 0; display: grid; gap: 0; }
.lb-zeitstrahl li { position: relative; display: flex; gap: 0.8rem; padding: 0 0 0.9rem; }
.lb-zeitstrahl li::before { content: ""; position: absolute; left: 0.45rem; top: 1rem; bottom: 0; width: 2px; background: var(--linie); }
.lb-zeitstrahl li:last-child::before { display: none; }
.lb-zeitstrahl li > div { min-width: 0; }
.lb-punkt { flex: 0 0 auto; width: 0.95rem; height: 0.95rem; margin-top: 0.2rem; border-radius: 50%; background: var(--akzent); position: relative; z-index: 1; }
.lb-zeitstrahl li.laufend .lb-punkt { background: var(--flaeche); border: 2px solid var(--akzent); }
.lb-st-abgang .lb-punkt { background: var(--hinweis-text); }
.lb-st-archiv .lb-punkt { background: var(--lila-text); }
.lb-zeitstrahl .etikett { margin-top: 0.2rem; }
.lb-ereignis { padding: 0.55rem 0; border-bottom: 1px solid var(--linie); display: grid; gap: 0.2rem; }
.lb-ereignis:last-of-type { border-bottom: 0; }
.lb-ereignis.zurueck strong { text-decoration: line-through; color: var(--leise); }
.lb-ereignis form { margin: 0.2rem 0 0; }
.lb-filter { display: flex; gap: 0.7rem; align-items: end; flex-wrap: wrap; margin: 0 0 0.8rem; }
.lb-filter input, .lb-filter select { font: inherit; font-weight: 400; padding: 0.4rem 0.55rem; border: 1px solid var(--linie); border-radius: 7px; background: var(--grund); color: var(--text); max-width: 100%; }
.lb-faellig { padding: 0.55rem 0.8rem; border-radius: 8px; background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.lb-faellig a { color: inherit; font-weight: 700; }
.lb-loeschaktion form { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; margin: 0; }
.lb-loeschaktion details { margin-top: 0.3rem; font-size: 0.85rem; }
.lb-loeschaktion summary { cursor: pointer; color: var(--akzent); font-weight: 600; }
.lb-aufschub { margin-top: 0.3rem !important; }
.lb-aufschub input { font: inherit; font-size: 0.85rem; padding: 0.25rem 0.4rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); max-width: 100%; }
.lb-fristen input, .lb-fristen select { font: inherit; font-size: 0.88rem; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); max-width: 100%; }
.lb-jahre { width: 4.5rem; }
.lb-hinweis { width: 100%; min-width: 12rem; }
@media (max-width: 700px) {
  .lb-zwei { grid-template-columns: minmax(0, 1fr); }
  .lb-speichern { position: static; }
}
/* schmale Bildschirme: Formularzeilen dürfen nicht über den Rand wachsen (lange Auswahltexte) */
@media (max-width: 760px) {
  .formzeile, .formzeile.zwei, .formzeile.vier { grid-template-columns: minmax(0, 1fr); }
  .formzeile > * { min-width: 0; }
  .formzeile select, .formzeile input { max-width: 100%; min-width: 0; }
}

/* ---------------------------------------------------------------- Kalender, Räume, Sprechtage (tm-) */
.nur-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tm-leiste { display: flex; gap: 0.8rem 1.2rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.9rem; }
.tm-leiste .lb-jahrwahl { margin: 0; }
.tm-monatwahl { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.tm-monatwahl h2 { margin: 0 0.3rem; min-width: 11rem; text-align: center; font-size: 1.15rem; }
.tm-monat { border: 1px solid var(--linie); border-radius: var(--radius); background: var(--flaeche); overflow: hidden; }
.tm-kopfzeile, .tm-woche { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.tm-kopfzeile div { padding: 0.4rem 0.5rem; font-size: 0.78rem; font-weight: 700; color: var(--leise); border-bottom: 1px solid var(--linie); }
.tm-tag { min-height: 6.2rem; padding: 0.3rem 0.35rem 0.4rem; border-right: 1px solid var(--linie); border-bottom: 1px solid var(--linie); min-width: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.tm-woche .tm-tag:last-child { border-right: 0; }
.tm-woche:last-child .tm-tag { border-bottom: 0; }
.tm-tag.fremd { background: var(--grund); }
.tm-tag.fremd .tm-zahl { color: var(--leise); }
.tm-tag.heute .tm-zahl { background: var(--akzent); color: var(--flaeche); border-radius: 999px; padding: 0 0.4rem; }
.tm-tagkopf { display: flex; align-items: center; gap: 0.3rem; font-size: 0.85rem; font-weight: 700; }
.tm-wt, .tm-mon { display: none; }
.tm-plus { margin-left: auto; text-decoration: none; color: var(--leise); font-weight: 700; padding: 0 0.3rem; border-radius: 4px; opacity: 0; }
.tm-tag:hover .tm-plus, .tm-plus:focus { opacity: 1; background: var(--akzent-hell); color: var(--akzent); }
.tm-eintrag { display: block; font-size: 0.74rem; line-height: 1.25; padding: 0.12rem 0.35rem; border-radius: 5px; text-decoration: none; color: var(--text);
  background: var(--linie); border-left: 3px solid var(--leise); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-zeit { font-variant-numeric: tabular-nums; font-weight: 700; }
.tm-art-ferien, .tm-punkt.tm-art-ferien { background: var(--info-flaeche); border-color: var(--info-text); }
.tm-art-feiertag, .tm-punkt.tm-art-feiertag { background: var(--gefahr-flaeche); border-color: var(--warnung); }
.tm-art-veranstaltung, .tm-punkt.tm-art-veranstaltung { background: var(--akzent-hell); border-color: var(--akzent); }
.tm-art-konferenz, .tm-punkt.tm-art-konferenz { background: var(--lila-flaeche); border-color: var(--lila-text); }
.tm-art-pruefung, .tm-punkt.tm-art-pruefung { background: var(--hinweis-flaeche); border-color: var(--hinweis-text); }
.tm-art-eltern, .tm-art-sprechtag, .tm-punkt.tm-art-eltern, .tm-punkt.tm-art-sprechtag { background: var(--info-flaeche); border-color: var(--akzent); }
.tm-art-fahrt, .tm-punkt.tm-art-fahrt { background: var(--akzent-hell); border-color: var(--ok); }
.tm-art-frist, .tm-punkt.tm-art-frist { background: var(--hinweis-flaeche); border-color: var(--warnung); }
.tm-punkt { display: inline-block; width: 0.7rem; height: 0.7rem; border-radius: 3px; border-left: 3px solid; flex: 0 0 auto; }
.tm-unten { margin-top: 1.2rem; }
.tm-liste { list-style: none; margin: 0.3rem 0 0; padding: 0; display: grid; gap: 0.35rem; }
.tm-liste li { display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; font-size: 0.92rem; }
.tm-liste .tm-punkt { align-self: center; }
.tm-datum { min-width: 5.6rem; font-variant-numeric: tabular-nums; color: var(--leise); font-size: 0.85rem; }
.tm-legende { list-style: none; padding: 0; margin: 0 0 0.8rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(12rem, 100%), 1fr)); gap: 0.3rem 1rem; font-size: 0.88rem; }
.tm-legende li { display: flex; gap: 0.45rem; align-items: center; }
.tm-aufgabe { padding: 0.5rem 0.7rem; border-radius: 8px; background: var(--grund); }
.tm-aufgabe.offen { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.tm-loeschen { margin-top: 1rem; }
/* Raumplan */
.tm-raumplan { padding-top: 0.6rem; }
.tm-raster-kopf, .tm-raumzeile { display: grid; grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr); gap: 0.8rem; align-items: center; }
.tm-stunden { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); font-size: 0.72rem; color: var(--leise); }
.tm-stunden span { border-left: 1px solid var(--linie); padding-left: 0.2rem; }
.tm-raumzeile { padding: 0.45rem 0; border-top: 1px solid var(--linie); }
.tm-raumname { display: flex; flex-direction: column; font-size: 0.9rem; }
.tm-bahn { position: relative; height: 2.1rem; border-radius: 6px; background: repeating-linear-gradient(90deg, var(--grund) 0, var(--grund) calc(100% / 12 - 1px), var(--linie) calc(100% / 12 - 1px), var(--linie) calc(100% / 12)); }
.tm-buchung { position: absolute; top: 0.2rem; bottom: 0.2rem; border-radius: 5px; background: var(--akzent); color: var(--flaeche); font-size: 0.72rem; padding: 0.15rem 0.3rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tm-buchung.termin { background: var(--lila-text); }
.tm-buchung.sprechtag { background: var(--info-text); }
.tm-buchung span { display: block; overflow: hidden; text-overflow: ellipsis; }
.tm-frei { display: none; }
.tm-buchungsliste:empty { display: none; }
.tm-buchungsliste { grid-column: 2; list-style: none; margin: 0.25rem 0 0; padding: 0; font-size: 0.82rem; display: grid; gap: 0.1rem; }
/* Sprechtage */
.tm-st { padding: 0.7rem 0; border-bottom: 1px solid var(--linie); }
.tm-st:last-child { border-bottom: 0; }
.tm-st p { margin: 0.25rem 0; }
.tm-st-kopf { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; }
.tm-status { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.75rem; font-weight: 700; background: var(--linie); color: var(--text); white-space: nowrap; vertical-align: middle; }
.tm-status.gross { font-size: 0.8rem; padding: 0.15rem 0.7rem; margin-left: 0.4rem; }
.tm-status-entwurf { background: var(--hinweis-flaeche); color: var(--hinweis-text); }
.tm-status-verfuegbarkeit { background: var(--lila-flaeche); color: var(--lila-text); }
.tm-status-buchung { background: var(--akzent-hell); color: var(--akzent); }
.tm-status-geschlossen { background: var(--info-flaeche); color: var(--info-text); }
.tm-ablauf { list-style: none; margin: 0.6rem 0 0.4rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr)); gap: 0.4rem; }
.tm-ablauf form { margin: 0; height: 100%; }
.tm-schritt { width: 100%; height: 100%; text-align: left; font: inherit; font-size: 0.85rem; padding: 0.5rem 0.7rem; border-radius: 8px; border: 1px solid var(--linie); background: var(--flaeche); color: var(--text); cursor: pointer; }
.tm-schritt span { display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: var(--linie); font-size: 0.72rem; font-weight: 700; margin-right: 0.3rem; }
.tm-schritt:hover { border-color: var(--akzent); }
.tm-ablauf li.hier .tm-schritt { border-color: var(--akzent); background: var(--akzent-hell); font-weight: 700; cursor: default; }
.tm-ablauf li.hier .tm-schritt span { background: var(--akzent); color: var(--flaeche); }
.tm-knoepfe { margin: 0.4rem 0 1rem; }
.tm-fensterform { margin-top: 0.8rem; }
.tm-dazu { margin-top: 0.8rem; flex-wrap: wrap; }
.tm-dazu select { max-width: 100%; }
#lehrkraefte select { font: inherit; font-size: 0.88rem; padding: 0.25rem 0.4rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); max-width: 100%; }
.tm-zweispaltig { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.2rem; align-items: start; }
.tm-zweispaltig > * { min-width: 0; }
.tm-zweispaltig > div { display: grid; gap: 1rem; }
.tm-zeiten h3 { margin: 1rem 0 0.4rem; }
.tm-raster td { vertical-align: top; }
.tm-z-gebucht td { background: var(--akzent-hell); }
.tm-z-gesperrt td { color: var(--leise); background: var(--grund); }
.tm-zeile { margin-top: 0.7rem; display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; }
.tm-lehrkraefte { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(22rem, 100%), 1fr)); gap: 1rem; align-items: start; }
/* Elternportal */
.tm-elternnav { display: flex; gap: 1rem; align-items: center; font-size: 0.9rem; }
.tm-elternnav form { margin: 0; }
.tm-elternliste { display: grid; gap: 0.6rem; }
.tm-elternbuchung { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1.5fr) auto; gap: 0.5rem; align-items: center; padding: 0.55rem 0; border-top: 1px solid var(--linie); }
.tm-elternbuchung select, .tm-elternbuchung input { font: inherit; padding: 0.35rem 0.5rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); width: 100%; min-width: 0; }
@media (max-width: 860px) {
  .tm-zweispaltig { grid-template-columns: minmax(0, 1fr); }
  .tm-elternbuchung { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .tm-kopfzeile { display: none; }
  .tm-woche { display: block; }
  .tm-tag { min-height: 0; border-right: 0; flex-direction: row; flex-wrap: wrap; align-items: baseline; padding: 0.45rem 0.6rem; }
  .tm-tag.leer, .tm-tag.fremd { display: none; }
  .tm-tagkopf { width: 100%; }
  .tm-wt, .tm-mon { display: inline; font-weight: 400; color: var(--leise); }
  .tm-eintrag { white-space: normal; font-size: 0.85rem; width: 100%; }
  .tm-plus { opacity: 1; }
  .tm-raster-kopf { display: none; }
  .tm-raumzeile { grid-template-columns: minmax(0, 1fr); gap: 0.3rem; }
  .tm-bahn { display: none; }
  .tm-buchungsliste { grid-column: 1; }
  .tm-frei { display: list-item; }
}
@media print {
  #menueband, .an-tabs, .tm-leiste { display: none !important; }
  .tm-zweispaltig { display: block; }
  .tm-z-gesperrt { display: none; }
}
.tm-zeiten .link, .tm-zeile .link, .tm-liste .link, .tm-buchungsliste .link, .tm-elternliste .link, #raster .link { color: var(--akzent); text-decoration: underline; font-size: 0.85rem; }

/* ---------------------------------------------------------------- Sicherheit: Zwei-Faktor-Anmeldung, Sicherungen (0.4.6.0) */
.zf-status { display: inline-block; font-size: 0.8rem; font-weight: 600; padding: 0.15rem 0.55rem; border-radius: 999px; vertical-align: middle; margin-left: 0.3rem; }
.zf-status.an { background: var(--akzent-hell); color: var(--akzent); }
.zf-status.aus { background: var(--grund); color: var(--leise); border: 1px solid var(--linie); }
p.zf-status { margin: 0 0 0.6rem; }
.zf-schritte { padding-left: 1.3rem; display: grid; gap: 0.8rem; }
.zf-qr { margin: 0.6rem 0; }
.zf-qr svg { display: block; width: 210px; max-width: 100%; height: auto; background: #fff; padding: 6px; border-radius: 8px; border: 1px solid var(--linie); }
.zf-schluessel { font-size: 1rem; letter-spacing: 0.06em; word-break: break-all; }
.zf-form { display: flex; gap: 0.6rem; align-items: flex-end; flex-wrap: wrap; margin-top: 0.4rem; }
.zf-form input[type="text"], .zf-form input:not([type]) { font: inherit; font-size: 1.1rem; letter-spacing: 0.12em; padding: 0.45rem 0.6rem; border: 1px solid var(--linie); border-radius: 8px; background: var(--grund); color: var(--text); width: 11rem; max-width: 100%; }
.zf-codes { border: 2px dashed var(--akzent); border-radius: var(--radius); padding: 0.8rem 1rem; margin-bottom: 1rem; }
.zf-codes ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: 0.35rem 1rem; list-style: none; padding: 0; margin: 0.5rem 0 0.8rem; }
.zf-codes code { font-size: 1.05rem; letter-spacing: 0.05em; }
.zf-anmeldung { max-width: 26rem; }
.sy-download { display: inline-block; position: relative; }
.sy-download > summary { list-style: none; }
.sy-download > summary::-webkit-details-marker { display: none; }
.sy-download[open] .sy-download-form { position: absolute; right: 0; z-index: 5; width: min(22rem, 80vw); background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); padding: 0.8rem; display: grid; gap: 0.5rem; text-align: left; }
.sy-download-form input[type="password"] { font: inherit; padding: 0.4rem 0.55rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); width: 100%; }
@media print { .nicht-drucken { display: none !important; } }

/* ---------------------------------------------------------------- Office-Kacheln (0.4.6.0) */
.of-kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.of-kopf h1 { margin: 0 0 0.2rem; }
.of-kopf p { margin: 0; }
.of-aktionen { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.of-aktionen .knopf, .of-zurueck { display: inline-flex; align-items: center; gap: 0.4rem; }
.of-aktionen svg, .of-zurueck svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ohne-menueband #of-umschalten svg { transform: rotate(180deg); }
.of-kacheln { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: 0.9rem; }
.of-kachel { position: relative; display: flex; align-items: center; gap: 0.9rem; min-height: 5.2rem; padding: 0.9rem 1rem; background: var(--flaeche); border: 1px solid var(--linie);
  border-radius: var(--radius); color: var(--text); text-decoration: none; border-left: 5px solid var(--of-farbe, var(--akzent)); transition: transform .12s ease, box-shadow .12s ease; }
.of-kachel:hover, .of-kachel:focus-visible { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1); border-color: var(--of-farbe, var(--akzent)); }
.of-symbol { flex: none; display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: 10px; background: var(--of-farbe, var(--akzent)); color: #fff; }
.of-symbol svg { width: 1.6rem; height: 1.6rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.of-text { display: grid; gap: 0.15rem; min-width: 0; }
.of-text strong { font-size: 1.05rem; }
.of-text small { color: var(--leise); }
.of-neu { position: absolute; top: 0.45rem; right: 0.6rem; color: var(--leise); font-size: 0.9rem; }
.ohne-menueband #menueband { display: none; }
.of-zurueck { position: fixed; right: 1rem; bottom: 1rem; z-index: 50; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18); }
.of-zurueck[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .of-kachel { transition: none; } }
.sy-warnung { background: var(--gefahr-flaeche); color: var(--warnung); border-radius: 8px; padding: 0.7rem 1rem; font-weight: 600; }
.sy-spalte { display: grid; gap: 1rem; align-content: start; min-width: 0; }
.zf-zeile .zf-status { margin-left: 0; }
#zweifaktor form { margin: 0.6rem 0; display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; }

/* ---------------------------------------------------------------- Noten: Schnelleingabe, Struktur, Leistungsvorgaben (0.4.7.0) */
.ne-kopfknoepfe { float: right; margin: 0 0 0.6rem 1rem; }
.ne-form { display: grid; gap: 1rem; }
.ne-felder { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 2.4fr) minmax(0, 1.2fr) minmax(0, 0.9fr); gap: 0.8rem; align-items: start; }
.ne-felder .sy-feld input, .ne-felder .sy-feld select { width: 100%; min-width: 0; box-sizing: border-box; }
.ne-mit-einheit { display: inline-flex; align-items: center; gap: 0.3rem; max-width: 100%; }
.ne-mit-einheit input { flex: 1 1 auto; min-width: 3.5rem; }
.ne-einheit { color: var(--leise); font-weight: 600; min-width: 0.9rem; }
.ne-summe { margin: 0.4rem 0 0; }
.ne-summe.ne-ueber, .ne-summenwarnung { color: var(--warnung); }
.ne-summenwarnung { display: block; font-size: 0.78rem; margin-top: 0.2rem; }
.ne-be { margin-top: 0.8rem; }
.ne-be summary { cursor: pointer; color: var(--akzent); font-weight: 600; font-size: 0.9rem; }
.ne-be .ne-felder { grid-template-columns: repeat(2, minmax(0, 14rem)); margin-top: 0.6rem; }
.ne-hilfe { margin-top: 0.3rem; }
.ne-tabelle { width: 100%; border-collapse: collapse; }
.ne-tabelle th, .ne-tabelle td { padding: 0.32rem 0.5rem; border-bottom: 1px solid var(--linie); text-align: left; vertical-align: middle; }
.ne-tabelle thead th { font-size: 0.8rem; color: var(--leise); font-weight: 600; }
.ne-tabelle tbody th { font-weight: 500; white-space: nowrap; }
.ne-tabelle input { font: inherit; padding: 0.35rem 0.5rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); box-sizing: border-box; }
.ne-note { width: 5.2rem; font-weight: 700; font-size: 1.05rem; text-align: center; }
.ne-note:focus { outline: 2px solid var(--akzent); outline-offset: 1px; }
.ne-kommentar { width: 100%; min-width: 8rem; }
.ne-nr { color: var(--leise); font-size: 0.8rem; width: 2rem; }
.ne-deutung { margin-left: 0.45rem; font-size: 0.8rem; color: var(--leise); white-space: nowrap; }
.ne-falsch .ne-note { border-color: var(--warnung); background: var(--gefahr-flaeche); }
.ne-falsch .ne-deutung { color: var(--warnung); font-weight: 600; }
.ne-fehlertext { display: block; }
.ne-einzel { display: none; }
.ne-mit-gewicht .ne-einzel { display: table-cell; }
.ne-knoepfe { position: sticky; bottom: 0; background: var(--grund); padding: 0.6rem 0; border-top: 1px solid var(--linie); z-index: 3; }
.ne-strukturtabelle input, .ne-strukturtabelle select { font: inherit; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); }
.ne-strukturtabelle input[name^="name_"] { width: min(16rem, 100%); font-weight: 600; }
.ne-wurzel th, .ne-wurzel td { background: var(--akzent-hell); }
.ne-lnzeile td { font-size: 0.92rem; }
.ne-einzug { display: inline-flex; align-items: center; gap: 0.3rem; }
.ne-strukturtabelle .aktionen { white-space: nowrap; }
.ne-strukturtabelle .aktionen > * + * { margin-left: 0.6rem; }
.ne-neuer-ordner .ne-felder { grid-template-columns: minmax(0, 2fr) minmax(0, 2fr) minmax(0, 0.8fr) auto; align-items: end; }
.nv-filter { display: flex; gap: 1rem; align-items: end; flex-wrap: wrap; margin: 0.6rem 0 1rem; }
.nv-vorgabe { margin-bottom: 1rem; }
.nv-vorgabe h2 { margin: 0 0 0.3rem; }
.nv-merkmale { display: flex; flex-wrap: wrap; gap: 0.35rem 0.9rem; margin: 0; color: var(--leise); font-size: 0.88rem; }
.nv-frist { font-weight: 600; color: var(--text); }
.nv-frist.vorbei { color: var(--warnung); }
.nv-zaehler { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.7rem 0; }
.nv-stand { display: inline-block; font-size: 0.78rem; font-weight: 600; padding: 0.12rem 0.55rem; border-radius: 999px; background: var(--grund); border: 1px solid var(--linie); color: var(--leise); white-space: nowrap; }
.nv-stand.erfuellt { background: var(--akzent-hell); color: var(--akzent); border-color: transparent; }
.nv-stand.in_arbeit { background: #fff4d6; color: #8a5a00; border-color: transparent; }
.nv-stand.ueberfaellig { background: var(--gefahr-flaeche); color: var(--warnung); border-color: transparent; }
:root[data-design="mocha"] .nv-stand.in_arbeit { background: #3b3220; color: #f9e2af; }
@media (prefers-color-scheme: dark) { :root[data-design="standard"] .nv-stand.in_arbeit { background: #3b3220; color: #f5d78e; } }
.nv-bald { color: var(--warnung); font-weight: 600; }
.nv-startliste { list-style: none; padding: 0; margin: 0.4rem 0 0; display: grid; gap: 0.45rem; }
.nv-unterricht { margin: 0.6rem 0 1rem; clear: both; }
.nv-unterricht h2 { font-size: 1rem; margin: 0; }
.nv-ueberfaellig { color: var(--warnung); font-weight: 600; }
.nv-drei { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.7rem; }
.nv-faecher { border: 1px solid var(--linie); border-radius: 8px; padding: 0.5rem 0.8rem; }
.nv-faecher legend { font-size: 0.85rem; font-weight: 600; padding: 0 0.3rem; }
.nv-faecher > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 0.25rem 1rem; }
.nv-faecher label { display: inline-flex; gap: 0.35rem; align-items: center; font-size: 0.9rem; }
@media (max-width: 860px) {
  .ne-felder, .ne-be .ne-felder, .ne-neuer-ordner .ne-felder, .nv-drei { grid-template-columns: minmax(0, 1fr); }
  .ne-kopfknoepfe { float: none; margin: 0 0 0.6rem; }
}
@media (max-width: 600px) {
  .ne-tabelle thead { display: none; }
  .ne-tabelle tr { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr) auto; gap: 0.2rem 0.4rem; padding: 0.45rem 0; border-bottom: 1px solid var(--linie); align-items: center; }
  .ne-tabelle th, .ne-tabelle td { border: 0; padding: 0; }
  .ne-tabelle tbody th { white-space: normal; }
  .ne-tabelle td:nth-child(4) { grid-column: 2 / -1; }
  .ne-mit-gewicht .ne-einzel { display: block; grid-column: 2 / -1; }
  .ne-deutung { display: block; margin: 0.15rem 0 0; text-align: center; }
}

/* ---------------------------------------------------------------- Kursauswahl „Mein Unterricht“ (0.4.7.1) */
.sz-unterricht { grid-column: span 2; }
.kw-start { display: grid; gap: 0.5rem; background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.75rem 0.9rem; }
.kw-start .kw-label { font-size: 0.8rem; color: var(--leise); }
.kw-start select, .kw-wechsel select { font: inherit; padding: 0.45rem 0.55rem; border: 1px solid var(--linie); border-radius: 8px; background: var(--grund); color: var(--text);
  width: 100%; min-width: 0; }
.kw-start .kw-knoepfe { display: flex; gap: 0.45rem; flex-wrap: wrap; }
.kw-start .kw-knoepfe .knopf, .kw-start .kw-knoepfe button { display: inline-flex; align-items: center; gap: 0.4rem; }
.kw-start .kw-knoepfe svg { width: 1rem; height: 1rem; }
.kw-kopf { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem 1.2rem; flex-wrap: wrap; }
.kw-kopf h1 { margin-bottom: 0.2rem; }
.kw-wechsel { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; color: var(--leise); }
.kw-wechsel select { width: auto; max-width: 18rem; font-size: 0.9rem; color: var(--text); }
.kw-aktionen { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; }
@media (max-width: 700px) {
  .sz-unterricht { grid-column: auto; }
  .kw-wechsel { width: 100%; }
  .kw-wechsel select { flex: 1; max-width: none; }
}
.ne-vorlaeufig { background: var(--akzent-hell); border-left: 4px solid var(--akzent); padding: 0.55rem 0.8rem; border-radius: 6px; font-size: 0.9rem; }
.ne-vorgabe { font-weight: 600; }
.ne-liegt-in { max-width: 12rem; }
.ne-jahresnote { border: 1px solid var(--linie); border-radius: var(--radius); padding: 0.6rem 1rem 0.2rem; margin: 1rem 0; display: flex; gap: 0.6rem 1.4rem; flex-wrap: wrap; align-items: flex-end; }
.ne-jahresnote legend { font-weight: 600; padding: 0 0.3rem; }
.ne-jahresnote .hinweistext { flex-basis: 100%; }
.ns-form { display: flex; gap: 0.4rem; align-items: center; flex-wrap: wrap; margin: 0; }
.ns-form input { font: inherit; font-size: 0.85rem; padding: 0.3rem 0.45rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--grund); color: var(--text); width: 12rem; max-width: 100%; }
.ne-gesperrt td, .ne-gesperrt th { color: var(--leise); }
.ne-gesperrt input { opacity: 0.55; cursor: not-allowed; border-style: dashed !important; }
.ne-sperre { background: var(--gefahr-flaeche); color: var(--warnung); border-radius: 6px; padding: 0.55rem 0.8rem; font-size: 0.9rem; }
.ne-bogen { margin-left: 0.4rem; font-size: 0.68rem; font-weight: 600; color: var(--leise); text-decoration: none; border: 1px solid var(--linie); border-radius: 4px; padding: 0 0.25rem; }
.ne-bogen:hover { color: var(--akzent); border-color: var(--akzent); }
.ne-schloss svg { width: 0.85rem; height: 0.85rem; vertical-align: -0.1rem; color: var(--warnung); }
@media print { .ne-bogen { display: none; } }

/* Abweichung der Zeugnisnote vom rechnerischen Vorschlag (ab 0.4.8.1): nur markieren, Lehrkraft hat die Notenhoheit */
.zg-abw-text { display: none; color: #c06a1c; font-weight: 600; font-size: 0.75rem; }
.zg-abweichung .zg-abw-text { display: block; }
.zg-abweichung > tr:first-child > td, .zg-abweichung > tr:first-child > th { background: rgba(217, 130, 43, 0.14); }
.zg-abweichung select.zg-wahl { border-color: #d9822b; box-shadow: 0 0 0 2px rgba(217, 130, 43, 0.3); }
.zg-abw-hinweis { background: rgba(217, 130, 43, 0.14); border-left: 4px solid #d9822b; padding: 0.5rem 0.8rem; border-radius: 6px; font-size: 0.9rem; }
td.zn-abweichung { background: rgba(217, 130, 43, 0.18); box-shadow: inset 0 0 0 2px rgba(217, 130, 43, 0.55); }
td.zn-abweichung small { color: #c06a1c; font-weight: 600; }