/* Sitzungsmanager · Gestaltung
   Schrift und Farben wie im InfraManager (Atkinson Hyperlegible, Asphalt und Signalgelb), aber für Dokumente:
   Lesespalte, Seitenleiste auf großen Bildschirmen, Leiste unten am Handy. Größen in rem, damit sie mit der
   Systemschrift mitwachsen; getestet von 320 bis 1440 Pixel und mit 1,5-facher Schrift. */

@font-face { font-family: "Atkinson Hyperlegible"; font-weight: 400; font-display: swap;
  src: url("/fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible"; font-weight: 700; font-display: swap;
  src: url("/fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Atkinson Hyperlegible Mono"; font-weight: 400; font-display: swap;
  src: url("/fonts/atkinson-hyperlegible-mono-latin-400-normal.woff2") format("woff2"); }

:root {
  color-scheme: light;
  --asphalt: #24282c; --asphalt-hell: #3a4046; --signal: #ffd100; --signal-gedrueckt: #e6bc00;
  --flaeche: #ffffff; --grund: #f3f5f4; --linie: #d5dbdf; --linie-stark: #9aa4ab;
  --text: #1c1f22; --text-leise: #59626a; --text-auf-asphalt: #f2f4f5; --text-auf-asphalt-leise: #b7bfc5;
  --fehler: #b3261e; --fehler-grund: #fdecea; --ok: #1e7b3a; --ok-grund: #e6f4ea; --warnung: #8a5a00; --warnung-grund: #fff4d6;
  --vertraulich: #8b1c1c; --vertraulich-grund: #fbeaea; --info-grund: #e8f0fb; --info: #1f4e8c;
  --fokus: #0b62d6; --schatten: 0 1px 2px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.06);
  --schrift: "Atkinson Hyperlegible", system-ui, sans-serif; --nummer: "Atkinson Hyperlegible Mono", ui-monospace, monospace;
  --oben: env(safe-area-inset-top, 0px); --unten: env(safe-area-inset-bottom, 0px);
  --leiste: 3.5rem; --tipp: 3rem; --radius: 10px; --spalte: 46rem;
  font-family: var(--schrift); color: var(--text); background: var(--grund);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --flaeche: #1d2125; --grund: #15181b; --linie: #343b41; --linie-stark: #59626a;
    --text: #eceff1; --text-leise: #a7b0b7;
    --fehler: #ff8a80; --fehler-grund: #3a1e1c; --ok: #7ed49a; --ok-grund: #17301f; --warnung: #ffcc66; --warnung-grund: #33290f;
    --vertraulich: #ff9a9a; --vertraulich-grund: #3a1d1d; --info-grund: #1a2a40; --info: #9cc2ff;
    --fokus: #7fb2ff; --schatten: 0 1px 2px rgba(0,0,0,.4);
  }
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font-size: 1rem; line-height: 1.5; -webkit-text-size-adjust: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--fokus); outline-offset: 2px; }
a { color: var(--info); }
h1, h2, h3 { line-height: 1.25; margin: 0 0 .5em; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.2rem; } h3 { font-size: 1.05rem; }
.nummer, .zahl { font-family: var(--nummer); font-variant-numeric: tabular-nums; }
.leise { color: var(--text-leise); }
.klein { font-size: .875rem; }
.nur-vorlesen { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Knöpfe und Eingaben ---------- */
button, .knopf { font: inherit; }
.knopf, .knopf-signal, .knopf-leise, .knopf-gefahr {
  display: inline-flex; align-items: center; justify-content: center; gap: .4em; min-height: var(--tipp);
  padding: .4rem 1rem; border-radius: var(--radius); border: 1px solid var(--linie-stark); background: var(--flaeche);
  color: var(--text); font-weight: 700; cursor: pointer; text-decoration: none; text-align: center;
}
.knopf-signal { background: var(--signal); border-color: var(--signal); color: #1c1f22; }
.knopf-signal:active { background: var(--signal-gedrueckt); }
.knopf-leise { border-color: transparent; background: transparent; color: var(--info); padding: .4rem .6rem; }
.knopf-gefahr { color: var(--fehler); border-color: var(--fehler); }
.knopf[disabled], .knopf-signal[disabled] { opacity: .5; cursor: not-allowed; }
.knopfreihe { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0; }
.klein-knopf { min-height: 2.25rem; padding: .2rem .7rem; font-size: .9rem; }
label.feld { display: block; margin: 0 0 .9rem; }
label.feld > span { display: block; font-weight: 700; margin-bottom: .25rem; }
label.feld small { display: block; color: var(--text-leise); margin-top: .2rem; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=time], input[type=datetime-local],
input[type=number], input[type=search], input[type=url], select, textarea {
  width: 100%; min-height: var(--tipp); padding: .55rem .75rem; font: inherit; color: var(--text);
  background: var(--flaeche); border: 1px solid var(--linie-stark); border-radius: 8px;
}
textarea { min-height: 7rem; resize: vertical; line-height: 1.45; }
label.haken { display: flex; gap: .6rem; align-items: flex-start; min-height: var(--tipp); padding: .55rem 0; cursor: pointer; }
label.haken input { width: 1.3rem; height: 1.3rem; margin-top: .1rem; flex: none; accent-color: var(--asphalt); }
.fehlertext { color: var(--fehler); font-weight: 700; }

/* ---------- Anmeldung ---------- */
.anmeldung { min-height: 100vh; display: grid; place-items: center; padding: calc(2rem + var(--oben)) 1rem 2rem; background: var(--asphalt); }
.anmeldung form { width: min(26rem, 100%); background: var(--flaeche); border-radius: 14px; padding: 1.75rem 1.5rem; box-shadow: var(--schatten); }
.anmeldung .wortmarke { color: var(--text); border: 0; padding: 0; margin: 0 0 1.25rem; }
.anmeldung .wm-oben { color: var(--text-leise); font-size: 1rem; }
.anmeldung .wm-unten { color: var(--asphalt); font-size: 1.6rem; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .anmeldung .wm-unten { color: var(--signal); } }
.anmeldung-fuss { color: var(--text-auf-asphalt-leise); font-size: .85rem; margin-top: 1.25rem; text-align: center; }
.anmeldung-fuss a { color: var(--text-auf-asphalt); }

/* ---------- Grundaufbau ---------- */
.wortmarke { display: flex; flex-direction: column; line-height: 1.05; white-space: nowrap; margin: 0; }
.wm-oben { font-size: .7rem; letter-spacing: .04em; color: var(--text-auf-asphalt-leise); }
.wm-unten { font-size: .95rem; font-weight: 700; letter-spacing: .09em; color: var(--signal); }
.kopf {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: .75rem;
  min-height: calc(var(--leiste) + var(--oben)); padding: var(--oben) .75rem 0; background: var(--asphalt); color: var(--text-auf-asphalt);
}
.kopf .gemeinde { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .95rem;
  border-left: 1px solid var(--text-auf-asphalt-leise); padding-left: .75rem; }
.kopf .gemeinde small { display: block; color: var(--text-auf-asphalt-leise); font-size: .75rem; }
.kopf button { min-width: var(--tipp); min-height: var(--tipp); border: 0; border-radius: 50%; background: var(--asphalt-hell);
  color: var(--text-auf-asphalt); font-weight: 700; cursor: pointer; }
.rahmen { display: grid; grid-template-columns: 15rem minmax(0, 1fr); min-height: calc(100vh - var(--leiste) - var(--oben)); }
.navigation { background: var(--flaeche); border-right: 1px solid var(--linie); padding: 1rem .5rem; position: sticky;
  top: calc(var(--leiste) + var(--oben)); height: calc(100vh - var(--leiste) - var(--oben)); overflow-y: auto; }
.navigation a { display: flex; align-items: center; gap: .6rem; min-height: var(--tipp); padding: .4rem .8rem; border-radius: 8px;
  color: var(--text); text-decoration: none; font-weight: 700; }
.navigation a .zaehler { margin-left: auto; background: var(--signal); color: #1c1f22; border-radius: 999px; padding: 0 .5rem; font-size: .8rem; }
.navigation a[aria-current=page] { background: var(--grund); box-shadow: inset 4px 0 0 var(--signal); }
.navigation .abschnitt { margin: 1rem .8rem .3rem; font-size: .75rem; color: var(--text-leise); text-transform: uppercase; letter-spacing: .06em; }
.symbol { width: 1.35rem; height: 1.35rem; flex: none; }
main { padding: 1.25rem 1.25rem calc(2rem + var(--unten)); min-width: 0; }
.spalte { max-width: var(--spalte); }
.breit { max-width: 72rem; }
@media (max-width: 52rem) {
  .rahmen { display: block; }
  .navigation { position: fixed; z-index: 30; bottom: 0; left: 0; right: 0; top: auto; height: auto; display: flex;
    justify-content: space-around; padding: .25rem .25rem calc(.25rem + var(--unten)); border: 0; border-top: 1px solid var(--linie); }
  .navigation .nur-breit, .navigation .abschnitt { display: none; }
  .navigation a { flex-direction: column; gap: .1rem; font-size: .72rem; padding: .3rem .2rem; min-width: 3.5rem; flex: 1; justify-content: center; }
  .navigation a[aria-current=page] { box-shadow: inset 0 3px 0 var(--signal); }
  .navigation a .zaehler { position: absolute; margin: -1.3rem 0 0 1.3rem; }
  main { padding: 1rem .85rem calc(5.5rem + var(--unten)); }
}

/* ---------- Karten, Listen, Marken ---------- */
.karte { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: 1rem 1.1rem; margin: 0 0 .75rem; }
.karte.hervor { border-left: 5px solid var(--signal); }
a.karte, button.karte { display: block; width: 100%; text-align: left; color: inherit; text-decoration: none; font: inherit; cursor: pointer; }
a.karte:hover, button.karte:hover { border-color: var(--linie-stark); }
.zeile { display: flex; gap: .75rem; align-items: baseline; justify-content: space-between; flex-wrap: wrap; }
.marke { display: inline-block; padding: .1rem .55rem; border-radius: 999px; font-size: .8rem; font-weight: 700; background: var(--grund);
  border: 1px solid var(--linie); white-space: nowrap; }
.marke.neu { background: var(--signal); border-color: var(--signal); color: #1c1f22; }
.marke.vertraulich { background: var(--vertraulich-grund); border-color: var(--vertraulich); color: var(--vertraulich); }
.marke.ok { background: var(--ok-grund); border-color: var(--ok); color: var(--ok); }
.marke.warnung { background: var(--warnung-grund); border-color: var(--warnung); color: var(--warnung); }
.marke.fehler { background: var(--fehler-grund); border-color: var(--fehler); color: var(--fehler); }
.hinweis { padding: .75rem 1rem; border-radius: var(--radius); background: var(--info-grund); border-left: 4px solid var(--info); margin: .75rem 0; }
.hinweis.warnung { background: var(--warnung-grund); border-color: var(--warnung); }
.hinweis.fehler { background: var(--fehler-grund); border-color: var(--fehler); }
.hinweis.ok { background: var(--ok-grund); border-color: var(--ok); }
.leer { color: var(--text-leise); padding: 2rem 0; text-align: center; }
.datum-block { display: grid; place-items: center; width: 3.6rem; min-width: 3.6rem; padding: .3rem; border-radius: 8px; background: var(--asphalt);
  color: var(--text-auf-asphalt); line-height: 1.1; text-align: center; }
.datum-block b { font-size: 1.35rem; } .datum-block small { font-size: .7rem; text-transform: uppercase; }
.sitzung-karte { display: flex; gap: .9rem; align-items: center; }
.sitzung-karte .mitte { flex: 1; min-width: 0; }
.kennzahlen { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: .75rem; margin: .75rem 0 1.25rem; }
.kennzahl { background: var(--flaeche); border: 1px solid var(--linie); border-radius: var(--radius); padding: .8rem 1rem; }
.kennzahl b { display: block; font-size: 1.6rem; font-family: var(--nummer); }
.tabelle-huelle { overflow-x: auto; border: 1px solid var(--linie); border-radius: var(--radius); background: var(--flaeche); }
table.liste { width: 100%; border-collapse: collapse; }
table.liste th, table.liste td { padding: .55rem .75rem; border-bottom: 1px solid var(--linie); text-align: left; vertical-align: top; }
table.liste th { font-size: .8rem; color: var(--text-leise); text-transform: uppercase; letter-spacing: .04em; background: var(--grund); }
table.liste tr:last-child td { border-bottom: 0; }

/* ---------- Tagesordnung ---------- */
.to { list-style: none; margin: 0; padding: 0; }
.to > li { margin: 0 0 .6rem; }
.to-punkt { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: .25rem .75rem; background: var(--flaeche);
  border: 1px solid var(--linie); border-radius: var(--radius); padding: .8rem 1rem; }
.to-punkt .nr { font-family: var(--nummer); font-weight: 700; font-size: 1.1rem; color: var(--text-leise); }
.to-punkt h3 { margin: 0; font-size: 1.05rem; }
.to-punkt .rest { grid-column: 2; }
.to-punkt.nicht-oeffentlich { border-left: 5px solid var(--vertraulich); }
.to-punkt.aktuell { outline: 3px solid var(--signal); }
.unterlagen { list-style: none; padding: 0; margin: .5rem 0 0; }
.unterlagen li { margin: .3rem 0; }
.unterlage { display: flex; gap: .6rem; align-items: center; min-height: var(--tipp); padding: .35rem .6rem; border-radius: 8px;
  background: var(--grund); color: var(--text); text-decoration: none; border: 1px solid transparent; width: 100%; font: inherit; text-align: left; cursor: pointer; }
.unterlage:hover { border-color: var(--linie-stark); }
.unterlage .titel { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.textblock { white-space: pre-wrap; overflow-wrap: anywhere; }
details.aufklapp { border-top: 1px solid var(--linie); margin-top: .6rem; padding-top: .4rem; }
details.aufklapp summary { cursor: pointer; font-weight: 700; min-height: 2.5rem; display: flex; align-items: center; }

/* ---------- Dialog und Meldung ---------- */
dialog { border: 0; border-radius: 14px; padding: 0; width: min(36rem, calc(100vw - 1.5rem)); max-height: calc(100vh - 2rem); background: var(--flaeche); color: var(--text); box-shadow: 0 10px 40px rgba(0,0,0,.3); }
dialog::backdrop { background: rgba(0,0,0,.45); }
dialog .dialog-kopf { display: flex; align-items: center; gap: .5rem; padding: 1rem 1.1rem .25rem; }
dialog .dialog-kopf h2 { flex: 1; margin: 0; }
dialog .dialog-inhalt { padding: .5rem 1.1rem 1.1rem; overflow-y: auto; max-height: calc(100vh - 8rem); }
dialog.gross { width: min(60rem, calc(100vw - 1.5rem)); }
.meldung { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(1rem + var(--unten)); z-index: 100; max-width: min(32rem, calc(100vw - 2rem));
  background: var(--asphalt); color: var(--text-auf-asphalt); padding: .8rem 1.1rem; border-radius: 10px; box-shadow: var(--schatten); }
@media (max-width: 52rem) { .meldung { bottom: calc(5.5rem + var(--unten)); } }
.menue { position: absolute; right: .75rem; top: calc(var(--leiste) + var(--oben) - .25rem); z-index: 40; min-width: 16rem; background: var(--flaeche);
  border: 1px solid var(--linie); border-radius: var(--radius); box-shadow: var(--schatten); padding: .4rem; }
.menue button, .menue a { display: block; width: 100%; text-align: left; min-height: var(--tipp); padding: .5rem .8rem; border: 0; background: none;
  color: var(--text); font: inherit; border-radius: 6px; cursor: pointer; text-decoration: none; }
.menue button:hover, .menue a:hover { background: var(--grund); }
.menue .kopfzeile { padding: .5rem .8rem; border-bottom: 1px solid var(--linie); margin-bottom: .3rem; }

/* ---------- PDF-Ansicht ---------- */
.lesen { position: fixed; inset: 0; z-index: 50; display: grid; grid-template-rows: auto 1fr; background: #3a3f44; }
.lesen-kopf { display: flex; align-items: center; gap: .5rem; padding: calc(.4rem + var(--oben)) .6rem .4rem; background: var(--asphalt); color: var(--text-auf-asphalt); }
.lesen-kopf .titel { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.lesen-kopf button { min-width: var(--tipp); min-height: var(--tipp); border: 0; border-radius: 8px; background: var(--asphalt-hell); color: var(--text-auf-asphalt); font: inherit; font-weight: 700; cursor: pointer; }
.lesen-inhalt { overflow: auto; padding: 1rem .5rem calc(1rem + var(--unten)); -webkit-overflow-scrolling: touch; }
.lesen-inhalt canvas { display: block; margin: 0 auto 1rem; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.4); max-width: 100%; height: auto; }
.lesen-seite { position: relative; }
.lesen-notizen { position: fixed; right: 0; top: calc(var(--leiste) + var(--oben)); bottom: 0; width: min(24rem, 100vw); background: var(--flaeche);
  border-left: 1px solid var(--linie); padding: 1rem; overflow-y: auto; z-index: 55; }

/* ---------- Protokollmodus ---------- */
.protokoll { display: grid; grid-template-columns: 18rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.protokoll .punkte-leiste { position: sticky; top: calc(var(--leiste) + var(--oben) + 1rem); max-height: calc(100vh - 7rem); overflow-y: auto; }
.protokoll .punkte-leiste button { display: flex; gap: .5rem; width: 100%; text-align: left; min-height: var(--tipp); padding: .45rem .6rem; margin: 0 0 .25rem;
  border: 1px solid var(--linie); border-radius: 8px; background: var(--flaeche); color: var(--text); font: inherit; cursor: pointer; }
.protokoll .punkte-leiste button[aria-current=true] { border-color: var(--asphalt); box-shadow: inset 4px 0 0 var(--signal); font-weight: 700; }
.protokoll .punkte-leiste .erledigt::after { content: "✓"; margin-left: auto; color: var(--ok); font-weight: 700; }
@media (max-width: 60rem) { .protokoll { grid-template-columns: 1fr; } .protokoll .punkte-leiste { position: static; max-height: none; display: flex; overflow-x: auto; gap: .4rem; }
  .protokoll .punkte-leiste button { flex: none; width: auto; } }
.stimmen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
.anwesenheit-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .4rem; }
.person-knopf { display: flex; justify-content: space-between; align-items: center; gap: .5rem; min-height: var(--tipp); padding: .4rem .7rem;
  border-radius: 8px; border: 1px solid var(--linie); background: var(--flaeche); color: var(--text); font: inherit; cursor: pointer; text-align: left; }
.person-knopf.anwesend { border-color: var(--ok); background: var(--ok-grund); }
.person-knopf.weg { border-color: var(--fehler); background: var(--fehler-grund); }
.person-knopf.gewaehlt { outline: 3px solid var(--fehler); }

/* ---------- Beamer ---------- */
.beamer { position: fixed; inset: 0; background: #0f1214; color: #fff; display: grid; grid-template-rows: auto 1fr; cursor: none; }
.beamer-kopf { display: flex; justify-content: space-between; padding: 1.2vh 2vw; font-size: 2vh; color: #b7bfc5; border-bottom: 1px solid #2a3035; }
.beamer-inhalt { display: grid; place-items: center; overflow: hidden; padding: 2vh 3vw; }
.beamer-titel { text-align: center; max-width: 80vw; }
.beamer-titel .nr { font-size: 4vh; color: var(--signal); font-family: var(--nummer); }
.beamer-titel h1 { font-size: 6.5vh; line-height: 1.2; margin: 1vh 0 0; }
.beamer canvas { max-width: 94vw; max-height: 84vh; width: auto !important; height: auto !important; background: #fff; }
.beamer-beschluss { max-width: 75vw; font-size: 3.4vh; line-height: 1.4; }
.beamer-beschluss .ergebnis { font-size: 5vh; font-weight: 700; color: var(--signal); margin-top: 3vh; }
.beamer.schwarz * { visibility: hidden; }

/* ---------- Kalender ---------- */
.monat { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--linie); border: 1px solid var(--linie); border-radius: var(--radius); overflow: hidden; }
.monat .tag { background: var(--flaeche); min-height: 6.5rem; padding: .3rem; font-size: .85rem; }
.monat .tag.anders { background: var(--grund); color: var(--text-leise); }
.monat .tag.heute .datum { background: var(--signal); color: #1c1f22; border-radius: 999px; padding: 0 .4rem; }
.monat .kopfzeile { background: var(--grund); padding: .3rem; font-size: .75rem; font-weight: 700; text-align: center; }
.monat .eintrag { display: block; width: 100%; text-align: left; border: 0; border-radius: 4px; padding: .1rem .3rem; margin: .15rem 0; font: inherit; font-size: .78rem;
  background: var(--info-grund); color: var(--text); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.monat .eintrag.sitzung { background: var(--signal); color: #1c1f22; font-weight: 700; }
@media (max-width: 40rem) { .monat { display: none; } }

@media print {
  .kopf, .navigation, .knopfreihe, .meldung { display: none !important; }
  .rahmen { display: block; } main { padding: 0; } body { background: #fff; }
}
#anmeldeknopf { width: 100%; }
.kopf a.wortmarke { text-decoration: none; }
.lesen-bild { display: block; max-width: 100%; margin: 0 auto; background: #fff; }
.lesen-kopf .knopf { min-height: var(--tipp); }
.beamer-bild { max-width: 94vw; max-height: 84vh; object-fit: contain; background: #fff; }

/* Sprungziele nicht unter Kopf und Leiste verstecken */
html { scroll-padding-top: calc(var(--leiste) + var(--oben) + .5rem); }
@media (max-width: 52rem) {
  html { scroll-padding-bottom: calc(5.5rem + var(--unten)); }
  /* Beschriftungen der Leiste unten: bei wenig Platz sauber gekürzt statt überlappend */
  .navigation a { min-width: 0; }
  .navigation a span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* Schmale Bildschirme und große Schrift */
.lesen-kopf { flex-wrap: wrap; }
@media (max-width: 40rem) {
  .lesen-kopf .titel { order: -1; flex-basis: 100%; white-space: normal; }
  .lesen-kopf button, .lesen-kopf .knopf { min-width: 2.75rem; }
  .to-punkt { grid-template-columns: 2rem minmax(0, 1fr); gap: .25rem .5rem; padding: .7rem .75rem; }
}
.monat-kopf { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.monat-kopf h2 { margin: 0; flex: 1 1 10rem; }

/* Reihenfolge ändern */
ol.reihenfolge { list-style: none; margin: 0; padding: 0; }
ol.reihenfolge li { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr) auto; gap: .5rem; align-items: center;
  padding: .35rem 0; border-bottom: 1px solid var(--linie); }
ol.reihenfolge li.fest .titel { color: var(--text-leise); }
ol.reihenfolge .knopfreihe { margin: 0; flex-wrap: nowrap; }
ol.reihenfolge .knopf[disabled] { opacity: .35; }

/* Beamer: Sachverhalt und Antrag */
.beamer-text { max-width: 82vw; max-height: 100%; overflow: hidden; line-height: 1.4; font-size: 3.4vh; }
.beamer-text .nr, .beamer-beschluss .nr { color: var(--signal); font-family: var(--nummer); font-size: .9em; }
.beamer-text h2 { font-size: 1.5em; margin: .2em 0 .6em; }
.beamer-text p { margin: 0 0 .7em; }
.beamer-text .vorschlag { border-left: .3em solid var(--signal); padding: .4em 0 .1em .9em; margin-top: .9em; background: rgba(255, 209, 0, .07); }
.beamer-text .vorschlag b { color: var(--signal); font-size: .85em; text-transform: uppercase; letter-spacing: .06em; }
.beamer-beschluss { max-height: 100%; overflow: hidden; }

/* Unterpunkte (5a, 5b …) */
.to > li.unterpunkt { margin-left: 2.5rem; }
.to > li.unterpunkt .to-punkt { border-left-width: 3px; }
@media (max-width: 40rem) { .to > li.unterpunkt { margin-left: 1.2rem; } }
ol.reihenfolge li.unterpunkt { padding-left: 1.8rem; }
.protokoll .punkte-leiste button.unterpunkt { margin-left: 1.2rem; width: calc(100% - 1.2rem); font-size: .95em; }
button.kennzahl { font: inherit; color: var(--text); text-align: left; cursor: pointer; }
button.kennzahl[disabled] { cursor: default; opacity: .7; }
a.kennzahl { color: var(--text); text-decoration: none; }

/* Menü: scrollbar, wenn es nicht auf den Bildschirm passt */
.menue { max-height: calc(100vh - var(--leiste) - var(--oben) - 1rem - var(--unten)); overflow-y: auto; overscroll-behavior: contain; }
@supports (height: 100dvh) { .menue { max-height: calc(100dvh - var(--leiste) - var(--oben) - 1rem - var(--unten)); } }
.datum-klein { width: auto; min-height: 2.25rem; padding: .2rem .5rem; }

/* PDF-Ansicht als modaler Dialog über allem, auch über anderen Dialogen */
dialog.lesen { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; border-radius: 0;
  background: #3a3f44; color: var(--text); box-shadow: none; }
@supports (height: 100dvh) { dialog.lesen { height: 100dvh; } }
dialog.lesen[open] { display: grid; grid-template-rows: auto 1fr; }
dialog.lesen::backdrop { background: rgba(0, 0, 0, .6); }
.mehrstimmig { border-top: 1px solid var(--linie); margin-top: .5rem; padding-top: .5rem; }
.stimmen-zwei { grid-template-columns: repeat(2, minmax(0, 1fr)); } .stimmen input[readonly] { background: var(--grund); }

/* ---------- Editor für formatierten Text ---------- */
.ed { border: 1px solid var(--linie-stark); border-radius: 8px; background: var(--flaeche); }
.ed:focus-within { outline: 3px solid var(--fokus); outline-offset: 1px; }
.ed-leiste { display: flex; flex-wrap: wrap; gap: .25rem .6rem; padding: .35rem .4rem; border-bottom: 1px solid var(--linie); background: var(--grund);
  border-radius: 8px 8px 0 0; position: sticky; top: calc(var(--leiste) + var(--oben)); z-index: 2; }
.ed-gruppe { display: inline-flex; gap: .2rem; }
.ed-knopf { min-height: 2.25rem; min-width: 2.25rem; padding: .1rem .55rem; border: 1px solid var(--linie); border-radius: 6px; background: var(--flaeche);
  color: var(--text); font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; }
.ed-knopf:hover { border-color: var(--linie-stark); }
.ed-knopf[title^="Kursiv"] { font-style: italic; } .ed-knopf[title^="Unterstrichen"] { text-decoration: underline; }
.ed-flaeche { padding: .5rem .75rem; }
.ed-text { min-height: 6rem; outline: none; line-height: 1.5; overflow-x: auto; }
.ed-text p { margin: 0 0 .5em; }
.ed-text table, .richtext table { border-collapse: collapse; margin: .4em 0 .8em; min-width: 50%; }
.ed-text td, .ed-text th, .richtext td, .richtext th { border: 1px solid var(--linie-stark); padding: .3rem .5rem; vertical-align: top; text-align: left; }
.ed-text th, .richtext th { background: var(--grund); font-weight: 700; }
.ed-text td p, .ed-text th p, .richtext td p, .richtext th p { margin: 0; }
.ed-text .selectedCell { background: var(--info-grund); }
.ed-text .column-resize-handle { position: absolute; right: -2px; top: 0; bottom: 0; width: 4px; background: var(--fokus); pointer-events: none; }
.ed-text td, .ed-text th { position: relative; }
.ProseMirror-gapcursor { display: none; pointer-events: none; position: absolute; }
.ProseMirror-gapcursor:after { content: ""; display: block; position: absolute; top: -2px; width: 20px; border-top: 1px solid var(--text); }
.ProseMirror-focused .ProseMirror-gapcursor { display: block; }
.ProseMirror { white-space: pre-wrap; word-wrap: break-word; }

/* Anzeige formatierter Texte */
.richtext { overflow-wrap: anywhere; overflow-x: auto; }
.richtext p { margin: 0 0 .5em; }
.richtext ul, .richtext ol, .ed-text ul, .ed-text ol { margin: .2em 0 .6em; padding-left: 1.6em; }
.feld-titel { display: block; font-weight: 700; margin-bottom: .25rem; }
.beamer-text .richtext th, .beamer-text .richtext td, .beamer-beschluss .richtext th, .beamer-beschluss .richtext td { border-color: #59626a; }
.beamer-text .richtext th, .beamer-beschluss .richtext th { background: #22282d; color: #fff; }

/* ---------- Hilfe (Handbuch) ---------- */
.hilfe-verzeichnis { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .5rem 1.5rem; }
.hilfe-verzeichnis ul { margin: .3rem 0 .6rem; padding-left: 1.1rem; }
.hilfe-verzeichnis li { margin: .15rem 0; }
.hilfe-kapitel { scroll-margin-top: calc(var(--leiste) + var(--oben) + 1rem); }
.hilfe-kapitel h2 { margin-top: .1rem; }
.hilfe-einleitung { font-size: 1.05rem; }
.hilfe-abschnitt { border-top: 1px solid var(--linie); padding-top: .6rem; margin-top: .9rem; }
.hilfe-abschnitt h3 { margin: 0 0 .4rem; }
.hilfe-abschnitt p, .hilfe-abschnitt li { line-height: 1.55; max-width: 72ch; }
.hilfe-schritte li { margin: .25rem 0; }
@media print { .hilfe-verzeichnis, input[type=search] { display: none; } .hilfe-kapitel { break-inside: avoid-page; box-shadow: none; } }
