:root{
  --grund:#f5f5f7;
  --flaeche:#ffffff;
  --flaeche-2:#fbfbfd;
  --linie-fein:#e8e8ed;
  --linie:#d2d2d7;
  --linie-stark:#86868b;
  --kante:#e3e3e8;
  --tinte:#1d1d1f;
  --gedaempft:#6e6e73;
  --akzent-50:#eefaf4;
  --akzent-100:#eefaf4;
  --akzent-200:#b6ebd0;
  --akzent-400:#3ecf8e;
  --akzent-500:#15803d;
  --akzent-700:#0f6b33;
  --auf-akzent:#ffffff;
  --knopf:#00875a;
  --knopf-tief:#0f6b33;
  --auf-knopf:#ffffff;
  --knopf-zweit:#00875a;
  --lila-50:#f3effb;
  --lila-200:#ccc0ef;
  --lila-400:#7d62c8;
  --lila-500:#5531b7;
  --lila-700:#3f218f;
  --band:#1d1d1f;
  --akzent-900:#1d1d1f;
  --band-punkt:#f0b871;
  --auf-dunkel:#e8e7ea;
  --auf-dunkel-stark:#ffffff;
  --auf-dunkel-matt:#a5a1af;
  --auf-dunkel-akzent:#a5a1af;
  --auf-dunkel-linie:#34323a;
  --fehler:#ba0517;
  --fehler-linie:#ba0517;
  --fehler-tief:#ba0517;
  --fehler-flaeche:#fdecee;
  --warn:#8a4b00;
  --warn-linie:#8a4b00;
  --warn-rand:#f0dcb4;
  --warn-flaeche:#fdf5e7;
  --gut:#15803d;
  --gut-linie:#15803d;
  --gut-flaeche:#e2f8ee;
  --info:#6e6e73;
  --info-linie:#86868b;
  --info-flaeche:#fbfbfd;
  --merk:#6e6e73;
  --merk-flaeche:#fbfbfd;
  --akzent-tief:#0f6b33;
  --akzent-lese:#0f6b33;
  --akzent-matt:#6e6e73;
  --gut-rand:#b2ecd2;
  --termin:#1d4f91;
  --termin-flaeche:#edf3fc;
  --termin-rand:#cfdef4;
  --gruen:#3ecf8e;
  --schatten:0 1px 2px 0 rgba(16,24,28,.06);
  --schatten-hoch:0 4px 16px -4px rgba(16,24,28,.14);
  --schatten-schwebe:0 6px 18px rgba(16,24,28,.13);
  --schatten-tief:0 1px 2px rgba(16,24,28,.08), 0 18px 50px -12px rgba(16,24,28,.28);
  --schatten-rand:rgba(16,24,28,.14);
  --schatten-karte:0 1px 2px rgba(0,0,0,.04),0 12px 40px -12px rgba(0,0,0,.14);
  --a1:2px;
  --a2:4px;
  --a3:8px;
  --a4:12px;
  --a5:16px;
  --a6:24px;
  --a7:32px;
  --a8:48px;
  --a9:64px;
  --a10:96px;
  --b-leiste:264px;
  --b-kopf:52px;
  --b-lesen:38rem;
  --b-inhalt:68rem;
  --b-rand:16px;
  --radius:6px;
  --radius-gross:12px;
  --radius-rund:999px;
  --radius-karte:20px;
  --radius-tafel:14px;
  --radius-knopf:12px;
  --radius-pille:980px;
  --radius-feld:12px;
  --t-xs:0.8rem;
  --t-s:0.9rem;
  --t-m:1rem;
  --t-l:1.25rem;
  --t-xl:1.75rem;
  --t-2xl:3rem;
  --zeit:160ms;
  --zeit-kurz:90ms;
  --kurve:cubic-bezier(.2,.8,.3,1);
  --schrift-titel:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --schrift-text:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --akzent:var(--akzent-500);
  --akzent-hell:var(--akzent-50);
  --warn-hell:var(--warn-flaeche);
  --gut-hell:var(--gut-flaeche);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root[data-theme="auto"]{
  --grund:#101012;
  --flaeche:#18171b;
  --flaeche-2:#211f24;
  --linie-fein:#2a292f;
  --linie:#34323a;
  --linie-stark:#6b6875;
  --kante:#6b6875;
  --tinte:#e8e7ea;
  --gedaempft:#a5a1af;
  --akzent-50:#10281c;
  --akzent-100:#10281c;
  --akzent-200:#1d4d36;
  --akzent-400:#2fb57a;
  --akzent-500:#3ecf8e;
  --akzent-700:#5fdca3;
  --auf-akzent:#101012;
  --knopf:#00875a;
  --knopf-tief:#0f6b33;
  --auf-knopf:#ffffff;
  --knopf-zweit:#5fdca3;
  --lila-50:#201935;
  --lila-200:#392d58;
  --lila-400:#856bce;
  --lila-500:#a78fe8;
  --lila-700:#c6b7ef;
  --band:#686572;
  --akzent-900:#686572;
  --band-punkt:#f0b871;
  --auf-dunkel:#f6f6f7;
  --auf-dunkel-stark:#f6f6f7;
  --auf-dunkel-matt:#eae9ec;
  --auf-dunkel-akzent:#eae9ec;
  --auf-dunkel-linie:#2a292f;
  --fehler:#ff9a9f;
  --fehler-linie:#ff9a9f;
  --fehler-tief:#ff9a9f;
  --fehler-flaeche:#2a1517;
  --warn:#f0b871;
  --warn-linie:#f0b871;
  --warn-rand:#4d3a1b;
  --warn-flaeche:#241a0f;
  --gut:#6ee7a8;
  --gut-linie:#6ee7a8;
  --gut-flaeche:#1e332c;
  --info:#a5a1af;
  --info-linie:#6b6875;
  --info-flaeche:#211f24;
  --merk:#a5a1af;
  --merk-flaeche:#211f24;
  --akzent-tief:#5fdca3;
  --akzent-lese:#5fdca3;
  --akzent-matt:#a5a1af;
  --gut-rand:#276149;
  --termin:#9cc0f2;
  --termin-flaeche:#101b2c;
  --termin-rand:#2a3d5c;
  --gruen:#3ecf8e;
  --schatten:0 1px 2px 0 rgba(0,0,0,.45);
  --schatten-hoch:0 8px 24px -6px rgba(0,0,0,.6);
  --schatten-schwebe:0 6px 18px rgba(0,0,0,.55);
  --schatten-tief:0 1px 2px rgba(0,0,0,.5), 0 18px 50px -12px rgba(0,0,0,.75);
  --schatten-rand:rgba(0,0,0,.5);
  --schatten-karte:0 1px 2px rgba(0,0,0,.45),0 14px 34px -16px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}
:root[data-theme="dunkel"]{
  --grund:#101012;
  --flaeche:#18171b;
  --flaeche-2:#211f24;
  --linie-fein:#2a292f;
  --linie:#34323a;
  --linie-stark:#6b6875;
  --kante:#6b6875;
  --tinte:#e8e7ea;
  --gedaempft:#a5a1af;
  --akzent-50:#10281c;
  --akzent-100:#10281c;
  --akzent-200:#1d4d36;
  --akzent-400:#2fb57a;
  --akzent-500:#3ecf8e;
  --akzent-700:#5fdca3;
  --auf-akzent:#101012;
  --knopf:#00875a;
  --knopf-tief:#0f6b33;
  --auf-knopf:#ffffff;
  --knopf-zweit:#5fdca3;
  --lila-50:#201935;
  --lila-200:#392d58;
  --lila-400:#856bce;
  --lila-500:#a78fe8;
  --lila-700:#c6b7ef;
  --band:#686572;
  --akzent-900:#686572;
  --band-punkt:#f0b871;
  --auf-dunkel:#f6f6f7;
  --auf-dunkel-stark:#f6f6f7;
  --auf-dunkel-matt:#eae9ec;
  --auf-dunkel-akzent:#eae9ec;
  --auf-dunkel-linie:#2a292f;
  --fehler:#ff9a9f;
  --fehler-linie:#ff9a9f;
  --fehler-tief:#ff9a9f;
  --fehler-flaeche:#2a1517;
  --warn:#f0b871;
  --warn-linie:#f0b871;
  --warn-rand:#4d3a1b;
  --warn-flaeche:#241a0f;
  --gut:#6ee7a8;
  --gut-linie:#6ee7a8;
  --gut-flaeche:#1e332c;
  --info:#a5a1af;
  --info-linie:#6b6875;
  --info-flaeche:#211f24;
  --merk:#a5a1af;
  --merk-flaeche:#211f24;
  --akzent-tief:#5fdca3;
  --akzent-lese:#5fdca3;
  --akzent-matt:#a5a1af;
  --gut-rand:#276149;
  --termin:#9cc0f2;
  --termin-flaeche:#101b2c;
  --termin-rand:#2a3d5c;
  --gruen:#3ecf8e;
  --schatten:0 1px 2px 0 rgba(0,0,0,.45);
  --schatten-hoch:0 8px 24px -6px rgba(0,0,0,.6);
  --schatten-schwebe:0 6px 18px rgba(0,0,0,.55);
  --schatten-tief:0 1px 2px rgba(0,0,0,.5), 0 18px 50px -12px rgba(0,0,0,.75);
  --schatten-rand:rgba(0,0,0,.5);
  --schatten-karte:0 1px 2px rgba(0,0,0,.45),0 14px 34px -16px rgba(0,0,0,.7);
  color-scheme:dark;
}
@font-face{font-family:"Plex"; font-style:normal; font-weight:400;
  font-display:swap; src:url("/s/ibm-plex-sans-400.woff2") format("woff2")}
@font-face{font-family:"Plex"; font-style:normal; font-weight:500;
  font-display:swap; src:url("/s/ibm-plex-sans-500.woff2") format("woff2")}
@font-face{font-family:"Plex"; font-style:normal; font-weight:600;
  font-display:swap; src:url("/s/ibm-plex-sans-600.woff2") format("woff2")}
@font-face{font-family:"Plex"; font-style:normal; font-weight:700;
  font-display:swap; src:url("/s/ibm-plex-sans-700.woff2") format("woff2")}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;
    animation-iteration-count:1 !important; transition-duration:.01ms !important;
    scroll-behavior:auto !important}
}


*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--grund); color:var(--tinte);
  font:16px/1.6 var(--schrift-text);
  font-feature-settings:"kern","liga"; letter-spacing:-.005em;
  font-variant-numeric:lining-nums tabular-nums;
}

h1,h2,h3,.titelschrift{font-family:var(--schrift-titel); font-weight:600}

h1,.gross{letter-spacing:-.02em}
h2,h3,.kartentitel{letter-spacing:-.012em}
.klein,.leise,th,.zusatz{letter-spacing:0}
a{color:var(--tinte); text-decoration:none}
p a,li a,dd a,td a,.satz a,.fliess a,.hinweis a,.leise a,summary a{
  text-decoration:underline; text-decoration-color:var(--linie-stark);
  text-decoration-thickness:1px; text-underline-offset:.16em}
p a:hover,li a:hover,dd a:hover,td a:hover,.satz a:hover,.fliess a:hover{
  text-decoration-color:var(--tinte)}

.kopfleiste .innen{max-width:62rem; margin:0 auto; padding:var(--a5) var(--a6);
  display:flex; align-items:baseline; gap:var(--a4)}
.marke:hover{text-decoration:none}

.marke-gut,.marke-offen{display:inline-block; padding:var(--a1) var(--a3);
  border-radius:999px; font-size:var(--t-xs); font-weight:500; margin:var(--a2) 0}
.marke-gut{background:var(--gut-hell); color:var(--gut)}
.marke-offen{background:var(--warn-hell); color:var(--warn)}

main{max-width:62rem; margin:0 auto; padding:var(--a8) var(--a6) var(--a10)}

h1{font-size:var(--t-2xl); font-weight:700; letter-spacing:-.03em;
  line-height:1.05; margin:0 0 var(--a4); text-wrap:balance}
h2{font-size:var(--t-xl); font-weight:600; letter-spacing:-.02em;
  line-height:1.15; margin:var(--a9) 0 var(--a5); text-wrap:balance}
h3{font-size:var(--t-l); font-weight:600; letter-spacing:-.012em;
  margin:var(--a7) 0 var(--a4); text-wrap:balance}
h2:first-child,h3:first-child,
main > h2:first-of-type{margin-top:0}
.unterzeile{color:var(--gedaempft); font-size:var(--t-l);
  margin:0 0 var(--a7); max-width:var(--b-lesen); text-wrap:pretty}
p{margin:var(--a3) 0}

.karte{background:var(--flaeche); border:1px solid var(--kante);
  border-radius:var(--radius-gross); padding:var(--a7); box-shadow:var(--schatten);
  margin:0 0 var(--a6)}
.karte h3,.karte .kartentitel{margin:0 0 var(--a3); font-size:var(--t-l);
  font-weight:600; line-height:inherit}
.karte .zusatz{color:var(--gedaempft); font-size:var(--t-s)}

.pfad{display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
  gap:var(--a3); margin:0 0 var(--a7)}
.schritt{min-width:0; background:var(--flaeche); border:1px solid var(--linie);
  border-radius:12px; padding:var(--a4) var(--a5)}
.schritt .nr{font-size:var(--t-xs); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--gedaempft)}
.schritt .titel{font-weight:600; font-size:var(--t-m); margin-top:var(--a1)}
.schritt.fertig{border-color:var(--linie); background:var(--akzent-50)}
.schritt.fertig .nr, .schritt.fertig .titel{color:var(--akzent-700)}
.schritt.offen{border-color:var(--warn-rand); background:var(--warn-hell)}
.schritt.offen .nr, .schritt.offen .titel{color:var(--warn)}

ol.wegweiser{list-style:none; counter-reset:ww; margin:0 0 var(--a7);
  padding:0; display:grid; gap:var(--a3)}
ol.wegweiser li{counter-increment:ww; position:relative;
  background:var(--flaeche); border:1px solid var(--linie);
  border-radius:12px; padding:var(--a4) var(--a5) var(--a4) var(--a8)}
ol.wegweiser li::before{content:counter(ww); position:absolute;
  left:var(--a4); top:var(--a4); width:1.5rem; height:1.5rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:var(--t-xs); font-weight:700; background:var(--linie-fein);
  color:var(--tinte)}
ol.wegweiser li .kopfzeile{display:flex; gap:var(--a4); align-items:baseline;
  justify-content:space-between; flex-wrap:wrap}
ol.wegweiser li .titel{font-weight:600}
ol.wegweiser li .wort{font-size:var(--t-xs); font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--gedaempft); white-space:nowrap}
ol.wegweiser li p{margin:var(--a3) 0 0; max-width:var(--b-lesen)}
ol.wegweiser li .knopf.klein{margin-top:var(--a3)}
ol.wegweiser li.fertig{opacity:.7}
ol.wegweiser li.fertig::before{content:"✓"; background:var(--akzent-50);
  color:var(--akzent-700)}
ol.wegweiser li.fertig .wort{color:var(--akzent-700)}
ol.wegweiser li.dran{border-color:var(--linie); background:var(--akzent-50)}
ol.wegweiser li.dran::before{background:var(--akzent-500); color:var(--auf-akzent)}
ol.wegweiser li.dran .wort{color:var(--akzent-700)}
ol.wegweiser li.spaeter{opacity:.55}

.status{border-radius:12px; padding:var(--a5) var(--a5); margin:0 0 var(--a6);
  font-weight:500; display:flex; gap:var(--a4); align-items:flex-start}
.status.gut{background:var(--gut-hell); color:var(--gut)}
.status.offen{background:var(--warn-hell); color:var(--warn)}
.status .zeichen{font-weight:700}

ol.fragen{margin:0; padding:0; list-style:none; counter-reset:f}
ol.fragen li{counter-increment:f; background:var(--flaeche); border:1px solid var(--linie);
  border-radius:12px; padding:var(--a5) var(--a5) var(--a5) var(--a8); margin-bottom:var(--a4);
  position:relative}
ol.fragen li::before{content:counter(f); position:absolute; left:var(--a5); top:var(--a5);
  width:1.5rem; height:1.5rem; border-radius:50%; background:var(--warn-hell);
  color:var(--warn); font-size:var(--t-xs); font-weight:700; display:grid; place-items:center}

label{display:block; margin:var(--a5) 0 var(--a2); font-size:var(--t-s); font-weight:500}
label .hilfe{display:block; font-weight:400; color:var(--gedaempft); font-size:var(--t-s);
  margin-top:var(--a1)}
input,select{width:100%; max-width:26rem; padding:var(--a3) var(--a4); font:inherit;
  border:1px solid var(--linie-stark); border-radius:var(--radius);
  background:var(--flaeche); color:var(--tinte)}
input:focus,select:focus{outline:2px solid var(--akzent-500); outline-offset:1px;
  border-color:var(--linie-stark)}
input[type=file]{padding:var(--a3); max-width:32rem}
.mit-auge{position:relative; display:block; max-width:26rem}
.mit-auge>input{width:100%; max-width:none; padding-right:calc(var(--a10) + var(--a3)); margin:0}
.mit-auge>button.auge{position:absolute; top:0; right:0; bottom:0; width:auto; min-width:5.5rem; min-height:44px; margin:0; padding:0 var(--a4);
  border:0; border-radius:0 12px 12px 0; background:none; box-shadow:none; transform:none;
  color:var(--tinte); font:inherit; font-size:var(--t-s); font-weight:600; cursor:pointer}
.mit-auge>button.auge:hover{background:none; box-shadow:none; text-decoration:underline; transform:none}
.mit-auge>button.auge[hidden]{display:none}
.anmelde-raster{display:grid; grid-template-columns:minmax(0,26rem); gap:0 var(--a6); align-items:start}
.anmelde-raster .karte{max-width:none}
.anmelde-raster label:has(> input){display:flex; flex-direction:column; align-items:stretch; gap:var(--a2)}
.anmelde-raster label > input{max-width:none}
.anmelde-raster .mit-auge{max-width:none}
.anmelde-liste-text{margin:0 0 var(--a4)}
.anmelde-links>.karte:first-child,.anmelde-rechts>.karte{margin-top:0}
.anmelde-raster .feld{max-width:none}
.anmelde-raster .feld input{max-width:none}
@media (min-width:880px){.anmelde-raster.mit-liste{grid-template-columns:minmax(0,26rem) minmax(0,26rem)}}
.anmelde-raster .karte form>:is(button,.knopf):not(.auge),.anmelde-raster .karte>:is(button,.knopf),.anmelde-raster .karte>p>.knopf{display:flex;align-items:center;justify-content:center;width:100%;height:48px;min-height:48px;padding:0 var(--a5);margin-top:var(--a6);box-sizing:border-box;font-size:var(--t-m);font-weight:600;line-height:1.2}
.anmelde-raster .karte>p:has(>.knopf){margin:0}
.anmelde-raster .karte .trennzeile{margin:var(--a6) 0 0}
.anmelde-raster{row-gap:var(--a6)}
.anmelde-raster.mit-liste{align-items:stretch}
.anmelde-links,.anmelde-rechts{display:flex;flex-direction:column;gap:var(--a6)}
.anmelde-links>.karte,.anmelde-rechts>.karte{margin:0}
.anmelde-links>.karte:last-child,.anmelde-rechts>.karte:last-child{flex:1 1 auto}
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):not([type=range]),
select{height:48px; padding-top:0; padding-bottom:0; box-sizing:border-box}
form:has(> :is(select,input:not([type=hidden]))) > :is(button,.knopf),
form:has(> label > :is(select,input:not([type=hidden]))) > :is(button,.knopf){
  margin-top:0; min-height:48px; box-sizing:border-box}
input[type=checkbox],input[type=radio]{width:auto; max-width:none;
  min-height:0; padding:0}
.feldgruppe{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:0 var(--a6); align-items:end}

@supports (grid-template-rows: subgrid) {
  .feldgruppe > label:has(> .hilfe){
    display:grid; grid-template-rows:subgrid; grid-row:span 3}
}
@supports not (grid-template-rows: subgrid) {
  .feldgruppe > label:has(> .hilfe){display:flex; flex-direction:column}
  .feldgruppe > label:has(> .hilfe) > .hilfe{flex:1 1 auto}
  .feldgruppe > label:has(> .hilfe) > input,
  .feldgruppe > label:has(> .hilfe) > select{margin-top:auto}
}
.feldname{display:block}

button,.knopf{margin-top:var(--a6); padding:var(--a4) var(--a6); border:0; border-radius:var(--radius-pille);
  background:var(--knopf); color:var(--auf-knopf); font:inherit; font-weight:600; cursor:pointer;
  display:inline-block}
button:hover{background-color:var(--knopf-tief)}
a.knopf, a.knopf:hover{text-decoration:none}
.knopf:hover{background-color:var(--knopf-tief); color:var(--auf-knopf)}
button[disabled]{background:var(--grund); color:var(--gedaempft);
  border-color:var(--linie); cursor:not-allowed}
button.still{background:transparent; color:var(--tinte); border:1px solid var(--linie)}
.knopf.klein{margin-top:var(--a3); padding:var(--a3) var(--a5); font-size:var(--t-s);
  background:var(--flaeche); color:var(--knopf-zweit);
  border:1.5px solid var(--knopf-zweit); text-decoration:none}
.knopf.klein:hover{background:var(--flaeche); color:var(--knopf-zweit);
  border-color:var(--knopf-zweit); box-shadow:inset 0 0 0 1px var(--knopf-zweit)}

table{width:100%; border-collapse:collapse; margin:var(--a3) 0}
th,td{text-align:left; padding:var(--a3) var(--a3); border-bottom:1px solid var(--linie);
  font-size:var(--t-s)}
th{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.07em;
  color:var(--gedaempft); font-weight:600}
td.zahl,th.zahl,td.num,th.num{text-align:right;
  font-variant-numeric:tabular-nums;
  font-feature-settings:'tnum' 1,'lnum' 1}

iframe{width:100%; height:36rem; border:1px solid var(--kante); border-radius:var(--radius);
  background:var(--flaeche); box-shadow:var(--schatten)}
.leise{color:var(--gedaempft); font-size:var(--t-s)}
.abschluss{border:1px dashed var(--linie); border-radius:var(--radius);
  padding:var(--a6); text-align:center; background:var(--flaeche)}
.tarife{display:grid; gap:var(--a5);
  grid-template-columns:repeat(auto-fit, minmax(17rem, 1fr));
  align-items:stretch}
.tarifgitter{display:grid; gap:var(--a5); margin:0 0 var(--a6);
  grid-template-columns:repeat(4, minmax(0, 1fr));
  align-items:stretch}
.stufe{min-width:0; display:flex; flex-direction:column; margin:0;
  background:var(--flaeche); border:1px solid var(--kante);
  border-radius:var(--radius-gross); padding:var(--a5) var(--a5) var(--a5);
  box-shadow:var(--schatten); position:relative}
.stufe.hervor{border:2px solid var(--akzent-500);
  padding:calc(var(--a5) - 1px) calc(var(--a5) - 1px) calc(var(--a5) - 1px);
  box-shadow:var(--schatten-schwebe)}
.stufe .empfehlung{position:absolute; top:calc(var(--a4) * -1); left:var(--a5);
  margin:0; background:var(--akzent-500); color:var(--auf-akzent); font-size:var(--t-xs);
  font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  padding:var(--a1) var(--a4); border-radius:999px}
.stufe h3,.stufe h2{margin:0 0 var(--a3); font-size:var(--t-m); font-weight:600;
  letter-spacing:-.012em; line-height:inherit}
.stufe .betrag{margin:0; font-size:var(--t-xl); font-weight:600;
  letter-spacing:-.03em; line-height:1.15}
.stufe .betrag .ab{font-size:var(--t-m); font-weight:500;
  color:var(--gedaempft); letter-spacing:0}
.tarifgitter.drei{grid-template-columns:repeat(3, minmax(0, 1fr))}
.tarifgitter.zwei{grid-template-columns:repeat(2, minmax(0, 1fr))}
.stufe .betrag.offen{font-size:var(--t-m); font-weight:600;
  letter-spacing:0; color:var(--gedaempft); line-height:1.3}
.stufe .takt{margin:var(--a1) 0 var(--a4); color:var(--gedaempft);
  font-size:var(--t-xs)}
.stufe .wen{margin:0 0 var(--a5); color:var(--gedaempft); font-size:var(--t-s);
  line-height:1.45}
.stufe ul{list-style:none; margin:0 0 var(--a5); padding:0;
  display:grid; gap:var(--a2); font-size:var(--t-s)}
.stufe li{position:relative; padding-left:var(--a5); line-height:1.45;
  margin:0}
.stufe li::before{content:"✓"; position:absolute; left:0; top:0;
  color:var(--akzent-500); font-weight:700; font-size:var(--t-xs)}
.stufe li.fehlt{color:var(--gedaempft)}
.stufe li.fehlt::before{content:"–"; color:var(--linie-stark)}
.stufe li.fehlt .stattdessen{display:block; font-size:var(--t-xs);
  color:var(--gedaempft); line-height:1.4}
.stufe .fuss{margin-top:auto}
.stufe .fuss p{margin:0 0 var(--a2)}
.stufe .fuss .knopf{display:block; width:100%; text-align:center;
  margin-top:var(--a4)}
.stufe .fuss .knopf.klein{padding:var(--a3) var(--a5); font-size:var(--t-s);
  border-color:var(--linie-stark)}
.stufe .fuss .knopf.klein:hover{border-color:var(--linie-stark)}
.untertreppe{margin:0 0 var(--a6)}
details.katalog{border:1px solid var(--linie); border-radius:var(--radius);
  background:var(--flaeche); padding:var(--a5) var(--a5); margin:0 0 var(--a5)}
details.katalog > summary{cursor:pointer; font-weight:600;
  font-size:var(--t-s); color:var(--tinte); list-style:none}
details.katalog > summary::-webkit-details-marker{display:none}
details.katalog > summary::before{content:"+ "; font-weight:700}
details.katalog[open] > summary::before{content:"– "}
details.katalog > .inhalt{margin-top:var(--a5)}
details.katalog h3{font-size:var(--t-m); margin:var(--a7) 0 var(--a4)}
details.kurzgefragt{border:1px solid var(--linie); border-radius:var(--radius);
  padding:var(--a5) var(--a4); margin:var(--a4) 0; background:var(--flaeche)}
details.kurzgefragt > summary{cursor:pointer; font-weight:600;
  list-style:none}
details.kurzgefragt > summary::-webkit-details-marker{display:none}
details.kurzgefragt > summary::before{content:"+ "; font-weight:700}
details.kurzgefragt[open] > summary::before{content:"– "}
details.kurzgefragt dl{margin:var(--a4) 0 0}
details.kurzgefragt dt{font-weight:600; margin-top:var(--a4)}
details.kurzgefragt dt:first-child{margin-top:0}
details.kurzgefragt dd{margin:var(--a2) 0 0; color:var(--tinte)}
@media (max-width:1000px){
  .tarifgitter{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .tarifgitter.drei{grid-template-columns:repeat(2, minmax(0, 1fr))} }
@media (max-width:640px){
  .tarifgitter{grid-template-columns:1fr}
  .tarifgitter.drei{grid-template-columns:1fr}
  .tarifgitter.zwei{grid-template-columns:1fr} }
.tarif{display:flex; flex-direction:column}
.tarif form{margin-top:auto}
.tarif h3{margin:0 0 var(--a3)}
.tarif .preis{margin:0 0 var(--a3); font-size:var(--t-m)}
.tarif .preis strong{font-size:var(--t-xl); letter-spacing:-.02em}
.netto-hinweis{white-space:nowrap}.preis-brutto{display:block;font-weight:400}
.tarif ul{margin:var(--a3) 0; padding-left:var(--a5)}
.tarif li{margin:var(--a2) 0}
.trennzeile{display:flex; align-items:center; gap:var(--a4);
  margin:var(--a5) 0; color:var(--gedaempft); font-size:var(--t-s)}
.trennzeile::before, .trennzeile::after{content:""; flex:1 1 auto;
  height:1px; background:var(--linie)}
label.ankreuz{display:flex; gap:var(--a3); align-items:flex-start;
  font-weight:400; font-size:var(--t-s); line-height:1.45;
  margin:var(--a4) 0}
label.ankreuz input{width:auto; margin:var(--a2) 0 0; flex:0 0 auto}
.warnknopf{background:var(--fehler); border-color:var(--fehler);
  color:var(--flaeche)}
.warnknopf:hover{background:var(--fehler-tief); border-color:var(--fehler-tief)}
dl.angaben{display:grid; grid-template-columns:auto 1fr;
  gap:var(--a3) var(--a5); margin:0; align-items:baseline}
dl.angaben dt{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.04em; color:var(--gedaempft); margin:0;
  grid-column:1}
dl.angaben dd{margin:0; font-weight:600; grid-column:2}
@media (max-width:520px){
  dl.angaben{grid-template-columns:1fr; gap:var(--a2)}
  dl.angaben dt{grid-column:1; margin-top:var(--a4)}
  dl.angaben dd{grid-column:1}
}

@media (max-width:640px){ main{padding:var(--a6) var(--a5) var(--a9)} h1{font-size:var(--t-xl)}
  .tarife{grid-template-columns:1fr} }

html, body{overflow-x:hidden}
main{overflow-x:clip}

.rollbar{overflow-x:auto; -webkit-overflow-scrolling:touch;
  margin:0 0 var(--a4);
  background:
    linear-gradient(to right in oklab, var(--flaeche) 30%, transparent),
    linear-gradient(to right in oklab, transparent, var(--flaeche) 70%) 100% 0,
    radial-gradient(farthest-side at 0 50%, var(--schatten-rand), transparent),
    radial-gradient(farthest-side at 100% 50%, var(--schatten-rand), transparent) 100% 0;
  background-repeat:no-repeat;
  background-size:40px 100%, 40px 100%, 14px 100%, 14px 100%;
  background-attachment:local, local, scroll, scroll}
.rollbar table{margin:0}
.rollbar > table{min-width:100%}

@media (max-width:640px){
  .karte{padding:var(--a5) var(--a5)}
  .seitenkopf{gap:var(--a4)}
  .seitenkopf .titel h1{font-size:var(--t-xl)}
  .seitenkopf .titel .unter{font-size:var(--t-m)}
  .seitenkopf .angaben{gap:var(--a4)}
  h2{margin:var(--a7) 0 var(--a4); font-size:var(--t-l)}
  input, select, textarea{max-width:none}
  .feldgruppe{grid-template-columns:1fr}
  input, select, textarea{font-size:var(--t-m)}
  button, .knopf{width:100%; text-align:center;
    min-height:44px}
  input, select, textarea{min-height:44px}
  .seitenkopf .aktionen{width:100%}
  .seitenkopf .aktionen .knopf.klein{flex:1 1 auto}
  .vorfuehrung .inhalt{padding:var(--a5) var(--a4)}
  .vorfuehrung .adresse{font-size:var(--t-xs)}
  .lage > a{padding:var(--a5)}
  .offene{padding:var(--a5) var(--a5)}
  .offene li .warum{font-size:var(--t-xs)}
  th, td{padding:var(--a3) var(--a3); font-size:var(--t-s)}
}

@media (max-width:400px){
  main{padding:var(--a5) var(--a4) var(--a8)}
  h1{font-size:var(--t-l)}
  h2{font-size:var(--t-m)}
  .unterzeile{font-size:var(--t-m)}
  .dunkel{padding:var(--a6) var(--a4)}
  .dunkel h2{font-size:var(--t-l)}
}
.marke-zustand{display:inline-block; padding:var(--a1) var(--a3); border-radius:999px;
  font-size:var(--t-xs); font-weight:600; letter-spacing:.01em; white-space:nowrap}
.z-bestanden{background:var(--gut-hell); color:var(--gut)}
.z-behoben{background:var(--gut-hell); color:var(--gut)}
.z-geprueft{background:var(--info-flaeche); color:var(--info)}
.z-offen{background:var(--warn-hell); color:var(--warn)}

table.pruefliste td{vertical-align:top}
table.pruefliste td.was{width:45%}
table.pruefliste .titelzeile{font-weight:500}
table.pruefliste .begruendung{color:var(--gedaempft); font-size:var(--t-s);
  margin-top:var(--a2); font-style:italic}

.spur{background:var(--flaeche); border:1px solid var(--kante);
  border-radius:var(--radius); padding:var(--a5) var(--a6); margin:0 0 var(--a5);
  box-shadow:var(--schatten)}
.spur h3{margin:0 0 var(--a2); font-size:var(--t-m); font-weight:600}
.spur .rahmen{overflow-x:auto}
.spur table{font-size:var(--t-s)}
.spur .mehr{color:var(--gedaempft); font-size:var(--t-xs); margin-top:var(--a3)}
.gegenueber{display:grid; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));
  gap:var(--a5); margin:var(--a5) 0}
.gegenueber div{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:12px; padding:var(--a5) var(--a5)}
.gegenueber .kopf{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.07em;
  color:var(--gedaempft); font-weight:600}
.gegenueber .wert{font-size:var(--t-l); font-weight:600; font-variant-numeric:tabular-nums;
  margin-top:var(--a1)}

.wege{display:grid; gap:var(--a4); margin:var(--a3) 0 0}
.weg{border:1px solid var(--linie); border-radius:12px; padding:var(--a5) var(--a5);
  background:var(--flaeche); cursor:pointer; display:block}
.weg:has(input:checked){border-color:var(--linie); background:var(--akzent-50)}
.weg input{width:auto; margin-right:var(--a3)}
.weg .name{font-weight:600}
.weg .text{display:block}
.weg .text{color:var(--gedaempft); font-size:var(--t-s); margin-top:var(--a1);
  margin-left:var(--a6)}
textarea{width:100%; padding:var(--a3) var(--a4); font:inherit;
  border:1px solid var(--linie-stark); border-radius:var(--radius);
  background:var(--flaeche); color:var(--tinte); min-height:6rem}
textarea:focus{outline:2px solid var(--akzent-500); outline-offset:1px}
.verfallen{background:var(--warn-hell); color:var(--warn); border-radius:10px;
  padding:var(--a4) var(--a5); font-size:var(--t-s); margin:var(--a3) 0}

.stapel{display:grid; gap:var(--a4); margin:var(--a3) 0 var(--a5)}
.meldung{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:12px; padding:var(--a5) var(--a5)}
.meldung.aus,.meldung.aus :not(.knopf,.marke-zustand){color:var(--gedaempft)}
.meldung .kopfzeile{display:flex; align-items:flex-start; gap:var(--a4);
  flex-wrap:wrap}
.meldung .kopfzeile .titel{flex:1 1 18rem; min-width:0}
.meldung .name{font-weight:600; font-size:var(--t-m)}
.meldung .quelle{color:var(--gedaempft); font-size:var(--t-xs); margin-top:var(--a1)}
.meldung .beschreibung{color:var(--gedaempft); font-size:var(--t-s);
  margin-top:var(--a3)}
.meldung .warum{background:var(--warn-hell); color:var(--warn);
  border-radius:9px; padding:var(--a3) var(--a4); font-size:var(--t-s); margin-top:var(--a3)}
.meldung .frist{font-size:var(--t-xs); color:var(--gedaempft); margin-top:var(--a3);
  font-variant-numeric:tabular-nums}
.meldung .frist.knapp{color:var(--warn); font-weight:600}
.meldung .wahl{display:flex; gap:var(--a3); margin-top:var(--a4); flex-wrap:wrap}
.meldung .wahl label{display:inline-flex; align-items:center; gap:var(--a2);
  margin:0; padding:var(--a2) var(--a4); border:1px solid var(--linie);
  border-radius:999px; font-size:var(--t-s); font-weight:500; cursor:pointer;
  background:var(--grund)}
.meldung .wahl label:has(input:checked){border-color:var(--linie);
  background:var(--akzent-50); color:var(--akzent-700)}
.meldung .wahl input{width:auto; margin:0}
.meldung .wahl label.gesperrt{opacity:.45; cursor:not-allowed}
.meldung button{margin-top:var(--a4); padding:var(--a3) var(--a5); font-size:var(--t-s)}
.fehlerband{background:var(--fehler-flaeche); border:1px solid var(--fehler-linie); color:var(--fehler);
  border-radius:10px; padding:var(--a4) var(--a5); margin:var(--a3) 0}
.hinweisband{background:var(--gut-flaeche); border:1px solid var(--gut-linie); color:var(--gut);
  border-radius:10px; padding:var(--a4) var(--a5); margin:var(--a3) 0}
.qr{margin:var(--a5) 0; line-height:0}
.qr svg{max-width:100%; height:auto; border:1px solid var(--linie);
  border-radius:8px; background:var(--flaeche)}
pre.codes{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:10px; padding:var(--a5) var(--a5); font-size:var(--t-m);
  letter-spacing:.06em; line-height:1.7; overflow-x:auto}
.fristband{background:var(--flaeche); border:1px solid var(--linie);
  border-left:3px solid var(--linie-stark); border-radius:10px;
  padding:var(--a4) var(--a5); margin:0 0 var(--a5); font-size:var(--t-s)}
code, .pruefsumme, .ticket, .mitteilung, .taxkennung{overflow-wrap:anywhere}
code.pruefsumme{font-size:var(--t-xs)}
.fristband.knapp{border-left-color:var(--warn)}
.fristband.abgelaufen{border-left-color:var(--fehler)}

ul.grenzliste{margin:var(--a3) 0 var(--a4); padding-left:var(--a5);
  font-size:var(--t-s); color:var(--gedaempft)}
ul.grenzliste li{margin:var(--a2) 0}
ul.grenzliste strong{color:var(--tinte)}

.vorgang{border-radius:8px; padding:var(--a3) var(--a4); margin-top:var(--a3);
  font-size:var(--t-xs); line-height:1.5}
.vorgang.gut{background:var(--flaeche-2); color:var(--tinte)}
.vorgang.schlecht{background:var(--fehler-flaeche);
  color:var(--fehler); border:1px solid var(--fehler)}
.vorgang .ticket{font-family:ui-monospace, SFMono-Regular, Menlo,
  monospace; letter-spacing:.04em; word-break:break-all}
.befund{border:1px solid var(--linie); border-left:3px solid var(--warn);
  border-radius:8px; padding:var(--a3) var(--a4); margin:var(--a3) 0;
  background:var(--flaeche)}
.karte .zwischentitel{margin:var(--a6) 0; font:inherit; font-weight:700;
  letter-spacing:inherit}
.befund p{margin:var(--a2) 0; font-size:var(--t-s)}
.befund .tun{color:var(--tinte); font-weight:500}


.klartext{background:var(--flaeche-2); border-radius:10px;
  padding:var(--a4) var(--a5); margin:var(--a3) 0 var(--a5)}
.klartext .satz{margin:0; font-size:var(--t-s); color:var(--tinte)}
.klartext details{margin-top:var(--a3)}
.klartext summary{cursor:pointer; font-size:var(--t-s); color:var(--tinte);
  font-weight:500; list-style:none}
.klartext summary::-webkit-details-marker{display:none}
.klartext summary::before{content:"+ "; font-weight:700}
.klartext details[open] summary::before{content:"– "}
.klartext details p{margin:var(--a3) 0 0; font-size:var(--t-s); color:var(--tinte);
  max-width:44rem}
.klartext .fundstelle{margin-top:var(--a3); font-size:var(--t-xs); color:var(--gedaempft);
  font-variant-numeric:tabular-nums}

.herkunft{display:inline-block; margin-left:var(--a3); padding:var(--a1) var(--a3);
  border-radius:999px; font-size:var(--t-xs); font-weight:500; white-space:nowrap;
  vertical-align:.08em; letter-spacing:.005em}
.h-import{background:var(--info-flaeche); color:var(--info)}
.h-vorjahr{background:var(--flaeche-2); color:var(--gedaempft)}
.h-vorschlag{background:var(--warn-hell); color:var(--warn)}
.h-gerechnet{background:var(--info-flaeche); color:var(--info)}
.h-eingabe{background:var(--gut-hell); color:var(--gut)}
.h-gesetz{background:var(--info-flaeche); color:var(--info)}

.offene{background:var(--flaeche); border:1px solid var(--kante);
  border-left:3px solid var(--warn); border-radius:12px;
  padding:var(--a5) var(--a5); margin:0 0 var(--a6); box-shadow:var(--schatten)}
.offene.fertig{border-color:var(--linie); border-left-color:var(--linie-stark)}
.offene .zaehler{display:flex; align-items:baseline; gap:var(--a3);
  flex-wrap:wrap; margin-bottom:var(--a2)}
.offene .zahl{font-size:var(--t-xl); font-weight:600; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; color:var(--warn)}
.offene.fertig .zahl{color:var(--akzent-700)}
.offene .wort{font-weight:500}
.offene .beruhigung{color:var(--gedaempft); font-size:var(--t-s); margin:var(--a2) 0 0}
.offene ul{list-style:none; margin:var(--a4) 0 0; padding:0}
.offene li{border-top:1px solid var(--linie); padding:var(--a3) 0 var(--a3)}
.offene li:first-child{border-top:0}
.offene li a{font-weight:500; display:inline-block}
.offene li .wo{color:var(--gedaempft); font-size:var(--t-xs); margin-left:var(--a3)}
.offene li .warum{color:var(--gedaempft); font-size:var(--t-s); margin-top:var(--a1);
  max-width:46rem}
.offene li .folge{color:var(--tinte); font-weight:600;
  font-size:var(--t-s); margin-top:var(--a2)}
.offene .rest{color:var(--gedaempft); font-size:var(--t-s); margin-top:var(--a3)}

.abschlussfenster{display:grid; grid-template-columns:minmax(0,1fr) 17rem;
  gap:var(--a6); align-items:start; margin:0 0 var(--a7)}
.abschlussfenster > .fensterhaupt{grid-column:1; min-width:0}
.abschlussfenster > .kachelspalte{grid-column:2; min-width:0}
@media (max-width:1100px){
  .abschlussfenster{grid-template-columns:minmax(0,1fr)}
  .abschlussfenster > .fensterhaupt{grid-column:auto; order:2}
  .abschlussfenster > .kachelspalte{grid-column:auto; order:1}
}
.viergruppen > h2{margin:0 0 var(--a2)}
.viergruppen > .leise{margin:0 0 var(--a5)}
.gruppenreihe{display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--a5)}
@media (max-width:760px){.gruppenreihe{grid-template-columns:minmax(0,1fr)}}
.gruppe{background:var(--flaeche); border:1px solid var(--kante);
  border-left:3px solid var(--linie-stark); border-radius:12px;
  padding:var(--a5) var(--a5); box-shadow:var(--schatten); min-width:0}
.gruppe.kostet{border-left-color:var(--linie-stark)}
.gruppe.frist{border-left-color:var(--warn)}
.gruppe.beiuns{border-left-color:var(--info)}
.gruppe.erledigt{border-left-color:var(--gut)}
.gruppenkopf{display:flex; align-items:baseline; gap:var(--a3);
  flex-wrap:wrap}
.gruppenkopf .zahl{font-size:var(--t-xl); font-weight:600;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.gruppe.kostet .gruppenkopf .zahl{color:var(--tinte)}
.gruppe.frist .gruppenkopf .zahl{color:var(--warn)}
.gruppe.beiuns .gruppenkopf .zahl{color:var(--info)}
.gruppe.erledigt .gruppenkopf .zahl{color:var(--gut)}
.gruppenkopf h3{margin:0; font-size:var(--t-m)}
.gruppe .unter{color:var(--gedaempft); font-size:var(--t-s);
  margin:var(--a2) 0 0}
.gruppe .leer{color:var(--gedaempft); font-size:var(--t-s);
  margin:var(--a4) 0 0; font-style:italic}
.gruppe ul{list-style:none; margin:var(--a4) 0 0; padding:0}
.gruppe li{border-top:1px solid var(--linie-fein); padding:var(--a3) 0}
.gruppe li:first-child{border-top:0}
.gruppe li a,.gruppe li .titel{font-weight:500}
.gruppe li .warum{color:var(--gedaempft); font-size:var(--t-s);
  margin-top:var(--a1)}
.gruppe li .folge{color:var(--tinte); font-weight:600;
  font-size:var(--t-s); margin-top:var(--a2);
  font-variant-numeric:tabular-nums}
.gruppe li .fundstelle{color:var(--gedaempft); font-size:var(--t-xs);
  margin-top:var(--a1)}

.kachelspalte{display:grid; gap:var(--a4); align-content:start}
.kachelspalte .kachel{display:block; background:var(--flaeche);
  border:1px solid var(--kante); border-radius:12px;
  padding:var(--a4) var(--a5); text-decoration:none; color:inherit;
  box-shadow:var(--schatten)}
.kachelspalte a.kachel:hover{border-color:var(--linie-stark)}
.kachelspalte .kachel .name{display:block; font-size:var(--t-xs);
  font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gedaempft)}
.kachelspalte .kachel .wert{display:block; font-size:var(--t-l);
  font-weight:600; letter-spacing:-.02em; margin-top:var(--a1);
  font-variant-numeric:tabular-nums; overflow-wrap:break-word}
.kachelspalte .kachel .zusatz{display:block; font-size:var(--t-xs);
  color:var(--gedaempft); margin-top:var(--a1)}

.kaufkasten{margin-top:var(--a6)}
.kaufkasten .preis{margin:var(--a3) 0 0; display:flex; gap:var(--a3);
  align-items:baseline; flex-wrap:wrap}
.kaufkasten .preis .brutto{font-size:var(--t-xl); font-weight:600;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.kaufkasten .preis .einmal{color:var(--gedaempft); font-size:var(--t-s)}
.kaufkasten ul.enthalten{margin:var(--a4) 0 0; padding-left:var(--a6);
  font-size:var(--t-s)}
.kaufkasten .ohnekasse{color:var(--warn)}
.zahlenblatt .fundstelle{display:block; color:var(--gedaempft);
  font-size:var(--t-xs)}

html{scroll-padding-top:5.5rem}
@media (max-width:760px){html{scroll-padding-top:7rem}}
h2[id],div[id].ankerziel{scroll-margin-top:1.2rem}

.zusicherung{display:flex; gap:var(--a3); align-items:flex-start;
  background:var(--gut-hell); color:var(--gut); border-radius:10px;
  padding:var(--a4) var(--a5); margin:var(--a4) 0 0; font-size:var(--t-s); max-width:34rem}
.zusicherung .zeichen{font-weight:700}

table.anhangliste td{vertical-align:top}
table.anhangliste td.was{width:34%}
table.anhangliste .titelzeile{font-weight:500}

p.mitteilung{background:var(--grund); border-left:3px solid var(--linie-stark);
  border-radius:8px; padding:var(--a4) var(--a5); font-size:var(--t-s); max-width:46rem}

.zweispaltig{display:grid; grid-template-columns:minmax(0,1fr) 21rem;
  gap:var(--a7); align-items:start}
.zweispaltig .haupt{min-width:0}
@media (max-width:1000px){ .zweispaltig{grid-template-columns:1fr; gap:var(--a6)} }

.weg-spalte{position:sticky; top:var(--a6); background:var(--flaeche);
  border:1px solid var(--kante); border-radius:var(--radius);
  padding:var(--a6) var(--a6); box-shadow:var(--schatten)}
.weg-spalte h2{margin:0 0 var(--a2); font-size:var(--t-m)}
.weg-spalte .fortschritt{font-size:var(--t-s); font-weight:600;
  color:var(--akzent-700); background:var(--akzent-50); border-radius:999px;
  padding:var(--a2) var(--a4); display:inline-block; margin:var(--a3) 0 var(--a2);
  font-variant-numeric:tabular-nums}
ol.weg{list-style:none; margin:var(--a5) 0 0; padding:0; counter-reset:w}
ol.weg li{counter-increment:w; border-top:1px solid var(--linie);
  padding:var(--a4) 0 var(--a4)}
ol.weg li:first-child{border-top:0}
ol.weg li label{display:flex; gap:var(--a3); align-items:flex-start; margin:0;
  cursor:pointer; font-weight:600; font-size:var(--t-s)}
ol.weg li input{width:auto; margin:var(--a1) 0 0; flex:0 0 auto;
  accent-color:var(--akzent-500)}
.weg-titel::before{content:counter(w) ". "; color:var(--gedaempft);
  font-weight:600}
ol.weg li.erledigt{opacity:.5}
ol.weg li.erledigt .weg-titel{text-decoration:line-through;
  text-decoration-thickness:1px}
.weg-wer{display:inline-block; margin:var(--a2) 0 0 var(--a6);
  padding:var(--a1) var(--a3); border-radius:999px; font-size:var(--t-xs);
  font-weight:600; letter-spacing:.01em}
.w-ich{background:var(--warn-hell); color:var(--warn)}
.w-stelle{background:var(--info-flaeche); color:var(--info)}
.w-warten{background:var(--flaeche-2); color:var(--gedaempft)}
.weg-was{margin:var(--a2) 0 0 var(--a6); font-size:var(--t-s); color:var(--tinte)}
.weg-zusatz{margin:var(--a2) 0 0 var(--a6); font-size:var(--t-xs); color:var(--gedaempft)}
.weg-stolper{margin:var(--a3) 0 0 var(--a6)}
.weg-stolper summary{cursor:pointer; font-size:var(--t-xs); color:var(--warn);
  font-weight:500; list-style:none}
.weg-stolper summary::-webkit-details-marker{display:none}
.weg-stolper summary::before{content:"! "; font-weight:700}
.weg-stolper p{font-size:var(--t-xs); color:var(--gedaempft); margin:var(--a2) 0 0}
.weg-spalte .fundstelle{margin:var(--a2) 0 0 var(--a6); font-size:var(--t-xs);
  color:var(--gedaempft)}


.geruest{display:grid; grid-template-columns:var(--b-leiste) minmax(0,1fr);
  grid-template-rows:var(--b-kopf) minmax(0,1fr); min-height:100vh}
.geruest > .kopfleiste{grid-column:1/-1}
.geruest > .leiste{grid-column:1; grid-row:2}
.geruest > main{grid-column:2; grid-row:2; padding:var(--a6) var(--a7) var(--a8);
  max-width:none; margin:0; min-width:0}
.leiste-mobil{display:none; background:var(--flaeche);
  border:1px solid var(--linie); border-radius:12px;
  margin:0 0 var(--a5)}
@media (max-width:1199px){
  .geruest{grid-template-columns:minmax(0,1fr)}
  .leiste{display:none}
  .geruest > main{grid-column:auto; grid-row:3; padding:var(--a5) var(--a5) var(--a7)}
  .geruest > .leiste-mobil{grid-row:2}
  .leiste-mobil{display:block}
}
.leiste-mobil > summary{list-style:none; cursor:pointer;
  padding:var(--a4) var(--a5); display:flex; gap:var(--a3);
  align-items:baseline; flex-wrap:wrap; font-weight:600}
.leiste-mobil > summary::-webkit-details-marker{display:none}
.leiste-mobil > summary::after{content:"Menü ▾"; margin-left:auto;
  font-size:var(--t-xs); font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:var(--gedaempft); white-space:nowrap}
.leiste-mobil[open] > summary::after{content:"Schließen ▴"}
.leiste-mobil > summary:focus-visible{outline:2px solid var(--akzent-500);
  outline-offset:-2px}
.leiste-mobil > summary .wo{font-weight:400; color:var(--gedaempft);
  font-size:var(--t-s)}
.leiste-mobil .gruppe{font-size:var(--t-xs); font-weight:700;
  letter-spacing:.09em; text-transform:uppercase; color:var(--gedaempft);
  padding:var(--a4) var(--a5) var(--a2)}
.leiste-mobil .nav-punkt{padding-left:var(--a4)}

.leiste{background:var(--flaeche); border-right:1px solid var(--linie);
  padding:var(--a5) 0 var(--a7); overflow-y:auto; position:sticky;
  top:var(--b-kopf); height:calc(100vh - var(--b-kopf))}
.leiste .firma{padding:0 var(--a5) var(--a5); border-bottom:1px solid var(--linie-fein);
  margin-bottom:var(--a4)}
.leiste .firma .name{font-weight:600; font-size:var(--t-m); line-height:1.3;
  color:var(--tinte); display:block}
.leiste .firma .jahr{font-size:var(--t-xs); color:var(--gedaempft);
  margin-top:var(--a1); display:block}
.leiste .gruppe{font-size:var(--t-xs); font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--gedaempft);
  padding:var(--a4) var(--a5) var(--a2)}
.leiste nav{display:block}

.nav-punkt{display:flex; align-items:flex-start; gap:var(--a4);
  padding:var(--a3) var(--a5) var(--a3) var(--a4);
  border-left:3px solid transparent; text-align:left;
  color:var(--gedaempft); font-size:var(--t-s); line-height:1.35}
.nav-punkt:hover{background:var(--grund); text-decoration:none;
  color:var(--tinte)}
.nav-punkt[aria-current="page"]{border-left-color:var(--akzent-500);
  background:var(--akzent-50); color:var(--akzent-700); font-weight:700}
.nav-punkt .zeichen{flex:none; width:1.1rem; text-align:center; opacity:.75}
.nav-punkt .wort{flex:1 1 auto; min-width:0; hyphens:auto;
  overflow-wrap:break-word}
.nav-punkt .zusatz{display:block; font-size:var(--t-xs); font-weight:400;
  color:var(--gedaempft); margin-top:var(--a1)}
.nav-punkt .stand{flex:none; margin-left:auto}

.marke{display:inline-flex; align-items:center; gap:var(--a2);
  padding:var(--a2) var(--a3); border:1px solid transparent;
  border-radius:999px; font-size:var(--t-xs); font-weight:700;
  line-height:normal; white-space:nowrap}
.marke:empty{padding:0}
.marke .form{font-size:.8em}
.m-fertig{background:var(--gut-flaeche); color:var(--gut);
  border-color:var(--gut-linie)}
.m-arbeit{background:var(--info-flaeche); color:var(--info);
  border-color:var(--info-linie)}
.m-offen{background:transparent; color:var(--info);
  border-color:var(--linie-stark)}
.m-ueberfaellig{background:var(--fehler-flaeche); color:var(--fehler);
  border-color:var(--fehler-linie)}

.seitenkopf{display:flex; gap:var(--a4) var(--a5); flex-wrap:wrap;
  align-items:flex-end; margin:0 0 var(--a7)}
.seitenkopf .titel{flex:1 1 18rem; min-width:0}
.seitenkopf .titel h1{margin:0; font-size:var(--t-2xl)}
.seitenkopf .titel .unter{color:var(--gedaempft); font-size:var(--t-l);
  margin-top:var(--a3); max-width:var(--b-lesen)}
.seitenkopf .aktionen{align-self:flex-end; flex:none;
  display:flex; gap:var(--a3) var(--a5); flex-wrap:wrap; align-items:center}
.seitenkopf .aktionen .knopf.klein,.seitenkopf .aktionen .knopf{margin-top:0}
.seitenkopf .angaben{align-self:center; flex:1 1 100%;
  display:flex; gap:var(--a6); flex-wrap:wrap;
  border-top:1px solid var(--linie-fein); padding-top:var(--a4);
  margin-top:var(--a1)}
.seitenkopf .angabe .was{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.07em; color:var(--gedaempft); font-weight:600}
.seitenkopf .angabe .wert{font-weight:600; font-variant-numeric:tabular-nums}

main > p, main > .karte > p, .klartext p{max-width:var(--b-lesen)}
main{max-width:var(--b-inhalt)}
.geruest > main{max-width:none}
.geruest > main > *{max-width:var(--b-inhalt)}

.leer{border:1px dashed var(--linie-stark); border-radius:var(--radius);
  padding:var(--a6); text-align:center; background:var(--flaeche);
  color:var(--gedaempft)}
.leer .titel{font-weight:600; color:var(--tinte); margin-bottom:var(--a2)}
.leer p{margin:var(--a2) auto var(--a4); max-width:32rem; font-size:var(--t-s)}


figure.bild{margin:0 0 var(--a5); background:var(--flaeche);
  border:1px solid var(--kante); border-radius:var(--radius);
  padding:var(--a5); background-clip:padding-box; box-shadow:var(--schatten)}
figure.bild + figure.bild{margin-top:var(--a5)}
figure.bild figcaption{margin-top:var(--a4); font-size:var(--t-s);
  color:var(--gedaempft); line-height:1.45}
figure.bild figcaption b{color:var(--tinte); font-weight:600}
.legende{display:flex; gap:var(--a5); flex-wrap:wrap; margin:0 0 var(--a2);
  font-size:var(--t-xs); color:var(--gedaempft)}
.legende .stueck{display:inline-flex; align-items:center; gap:var(--a2)}
.legende .klecks{width:10px; height:10px; border-radius:2px; flex:none}

.karte.kapitel{border-left:3px solid var(--linie)}
.karte.kapitel.gefuellt{border-left-color:var(--linie-stark)}
.karte.kapitel .kopfzeile{display:flex; align-items:center;
  justify-content:space-between; gap:var(--a4); flex-wrap:wrap}
.karte.kapitel h3{margin:0}
.karte.kapitel textarea{margin-top:var(--a4); min-height:8rem}
ul.leitfragen{margin:var(--a4) 0 0; padding:0 0 0 var(--a5);
  color:var(--tinte); font-size:var(--t-s)}
ul.leitfragen li{margin:var(--a2) 0}

.karte.kapitel .weglassen{display:inline-flex; align-items:center;
  gap:var(--a2); margin:0 auto 0 0; font-size:var(--t-xs); font-weight:400;
  color:var(--gedaempft); cursor:pointer}
.karte.kapitel .weglassen input{width:auto; margin:0}
.karte.kapitel.weggelassen{opacity:.55; border-left-color:var(--linie)}
.karte.kapitel.weggelassen h3{text-decoration:line-through;
  text-decoration-thickness:1px}

.merken{display:flex; align-items:center; justify-content:space-between;
  gap:var(--a5); flex-wrap:wrap; margin-top:var(--a5);
  padding-top:var(--a4); border-top:1px solid var(--linie-fein);
  text-align:left}
.merken .stand{font-size:var(--t-s); color:var(--gedaempft); flex:1 1 16rem}
.merken .knoepfe{display:flex; gap:var(--a3); flex-wrap:wrap}
.merken button, .merken .knopf.klein{margin-top:0}

.karte.dokument{max-width:var(--b-lesen); padding:var(--a7)}
.karte.dokument h3{margin:var(--a6) 0 var(--a3); font-size:var(--t-m)}
.karte.dokument h3:first-child{margin-top:0}
.karte.dokument p{margin:0 0 var(--a4); line-height:1.65}
.karte.dokument ul{margin:0; padding-left:var(--a5)}

.vorfuehrung{background:var(--grund); border:1px solid var(--linie);
  border-radius:var(--radius-gross); overflow:hidden; margin:var(--a5) 0}
.vorfuehrung .fensterleiste{display:flex; align-items:center;
  gap:var(--a4); padding:var(--a3) var(--a5);
  border-bottom:1px solid var(--linie); background:var(--flaeche)}
.vorfuehrung .ampeln{display:flex; gap:var(--a2); flex:none}
.vorfuehrung .ampeln i{width:9px; height:9px; border-radius:50%;
  background:var(--linie); display:block}
.vorfuehrung .adresse{flex:1 1 auto; min-width:0; font-size:var(--t-xs);
  color:var(--gedaempft); background:var(--grund); border-radius:6px;
  padding:var(--a2) var(--a3); white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.vorfuehrung .beispielmarke{flex:none; font-size:var(--t-xs); font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:var(--warn);
  background:var(--warn-flaeche); border:1px solid var(--warn-linie);
  border-radius:999px; padding:var(--a1) var(--a3)}
.vorfuehrung .inhalt{padding:var(--a6); background:var(--grund)}
.vorfuehrung .inhalt > *:first-child{margin-top:0}
.vorfuehrung .inhalt .offene{margin-bottom:var(--a5)}
.vorfuehrung .inhalt .karte:last-child{margin-bottom:0}

.musterbild{max-width:26rem; margin:var(--a7) auto; text-align:center}
.musterbild .vorfuehrung{box-shadow:0 1.5rem 3rem -1.2rem rgba(0,0,0,.35);
  text-align:left; margin:0}
.musterbild .inhalt h4{margin-top:0}
.musterbild .inhalt table{width:100%}
.musterbild .inhalt td.zahl{text-align:right; font-variant-numeric:tabular-nums}
.musterbild figcaption{margin-top:var(--a4); color:var(--gedaempft);
  font-size:var(--t-s)}

.lage{display:grid; grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));
  gap:var(--a5); margin:var(--a6) 0 var(--a7)}
.lage > a{display:flex; flex-direction:column; background:var(--flaeche);
  border:1px solid var(--kante); border-radius:var(--radius-gross);
  padding:var(--a6); box-shadow:var(--schatten); color:var(--tinte);
  text-decoration:none; transition:border-color .12s, box-shadow .12s}
.lage > a:hover{border-color:var(--linie-stark); text-decoration:none;
  box-shadow:var(--schatten-hoch)}
.lage > a > .sinnbild,.karte > .sinnbild{color:var(--gedaempft);
  opacity:.85; margin:0 0 var(--a4); display:block; flex:0 0 auto}
.karte > .sinnbild{margin-bottom:var(--a3)}
.lage .ich{font-size:var(--t-m); font-weight:600; letter-spacing:-.02em;
  margin-bottom:var(--a3)}
.lage .dann{color:var(--gedaempft); font-size:var(--t-s); flex:1 1 auto;
  line-height:1.55}
.lage .weiter{margin-top:var(--a5); font-weight:600; font-size:var(--t-s);
  color:var(--tinte)}
.lage .weiter::after{content:" →"}
.lage .kostet{margin-top:var(--a3); font-size:var(--t-xs); color:var(--gedaempft);
  border-top:1px solid var(--linie-fein); padding-top:var(--a3)}

.lage-kopf{padding:var(--a7) 0 var(--a6); max-width:34rem}
.lage-kopf h1{margin:0 0 var(--a4)}
.lage-kopf .unterzeile{margin:0 0 var(--a6)}

.lage-block{display:grid; grid-template-columns:1fr 1fr;
  gap:var(--a6) var(--a7); align-items:center;
  padding:var(--a7) 0; border-top:1px solid var(--linie-fein)}
.lage-block .wort{min-width:0}
.lage-block .wort p{margin:0; font-size:var(--t-l); line-height:1.45;
  letter-spacing:-.012em; max-width:28ch}
.lage-block .schau{min-width:0}
.lage-block.gedreht .wort{order:2}
.lage-block.ohne-bild{grid-template-columns:1fr}
.lage-schluss{border-top:1px solid var(--linie-fein);
  padding:var(--a7) 0 var(--a6)}
@media (max-width:40rem){
  .lage-block{grid-template-columns:1fr; gap:var(--a5)}
  .lage-block.gedreht .wort{order:0}
  .lage-block .wort p{font-size:var(--t-m)}
}

.bild{margin:0; background:var(--flaeche); border:1px solid var(--kante);
  border-radius:var(--radius-gross); box-shadow:var(--schatten-hoch);
  overflow:hidden}
.bild-kopf{display:flex; align-items:center; gap:var(--a3);
  padding:var(--a3) var(--a4); border-bottom:1px solid var(--linie-fein);
  background:var(--flaeche-2)}
.bild-kopf .ampel{width:.6rem; height:.6rem; border-radius:50%;
  background:var(--linie); flex:0 0 auto}
.bild-kopf .wo{margin-left:var(--a3); font-size:var(--t-xs);
  color:var(--gedaempft); font-weight:500}
.bild-leib,.bild-klein{padding:var(--a5)}
.bild-klein{padding:var(--a5)}
.tafel-label{font-size:var(--t-xs); font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; color:var(--gedaempft); margin-bottom:var(--a3)}
.tafel-zahl{font-size:var(--t-2xl); font-weight:700; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; margin-bottom:var(--a4)}

.beleg-kopf{display:flex; justify-content:space-between; gap:var(--a4);
  flex-wrap:wrap; margin-bottom:var(--a4)}
.beleg-rechts{text-align:right}
.beleg-von{font-weight:600; font-size:var(--t-m)}
.beleg-meta{font-size:var(--t-xs); color:var(--gedaempft); margin-top:var(--a1)}
.beleg-summe{font-size:var(--t-l); font-weight:700;
  font-variant-numeric:tabular-nums; white-space:nowrap}

.bildzeilen{display:flex; flex-direction:column; gap:var(--a3);
  border-top:1px solid var(--linie-fein); padding-top:var(--a4)}
.bild-klein > .bildzeilen:first-child{border-top:0; padding-top:0}
.bildzeile{display:flex; justify-content:space-between; gap:var(--a4);
  font-size:var(--t-s)}
.bildzeile .k{color:var(--gedaempft); min-width:0}
.bildzeile .v{font-variant-numeric:tabular-nums; font-weight:500;
  white-space:nowrap}
.bildzeile.hebe .v{color:var(--akzent-700); font-weight:700}

.bildmarke{display:inline-flex; align-items:center; gap:var(--a2);
  font-size:var(--t-xs); font-weight:600; background:var(--akzent-50);
  color:var(--akzent-700); border:1px solid var(--akzent-200);
  padding:var(--a2) var(--a4); border-radius:999px}
.bildvorschlag{margin-top:var(--a4); background:var(--gut-flaeche);
  border-radius:var(--radius); padding:var(--a4);
  display:flex; gap:var(--a4); align-items:flex-start}
.bildvorschlag .haken{color:var(--akzent-500); font-weight:700; flex:0 0 auto}
.bildvorschlag .txt{font-size:var(--t-s)}

.bildfrage .was{font-weight:600; margin-bottom:var(--a4)}
.bildfrage .wahl{display:flex; flex-direction:column; gap:var(--a3)}
.bildfrage .moeglich{border:1px solid var(--linie); border-radius:var(--radius);
  padding:var(--a4) var(--a4); font-size:var(--t-s); display:flex;
  align-items:center; gap:var(--a3)}
.bildfrage .kreis{width:1rem; height:1rem; border-radius:50%;
  border:1.5px solid var(--linie); flex:0 0 auto}
.bildfrage .moeglich.gewaehlt{border-color:var(--akzent-500);
  background:var(--akzent-50)}
.bildfrage .moeglich.gewaehlt .kreis{border-color:var(--akzent-500);
  background:radial-gradient(circle,var(--akzent-500) 0 44%,transparent 46%)}

.bildliste{display:flex; flex-direction:column}
.bildliste .z{display:flex; justify-content:space-between; gap:var(--a4);
  padding:var(--a3) var(--a4); font-size:var(--t-s); border-radius:var(--radius)}
.bildliste .z.aktiv{background:var(--akzent-50); font-weight:600}
.bildliste .z .nr{color:var(--gedaempft);
  font-variant-numeric:tabular-nums; font-size:var(--t-xs)}
.bildliste .z.aktiv .nr{color:var(--akzent-700)}
.leer-bild{color:var(--gedaempft); font-size:var(--t-s);
  padding:var(--a5) 0; text-align:center;
  border:1px dashed var(--linie); border-radius:var(--radius);
  margin-bottom:var(--a4)}

.dunkel{background:var(--band); color:var(--auf-dunkel);
  border-radius:var(--radius-gross); padding:var(--a8) var(--a7);
  margin:var(--a9) 0}
.dunkel h2{color:var(--auf-dunkel-stark); margin:0 0 var(--a4); font-size:var(--t-xl);
  letter-spacing:-.025em}
.dunkel p{color:var(--auf-dunkel-matt); max-width:42rem; margin:0 0 var(--a4)}
.dunkel .satz{font-size:var(--t-m); line-height:1.6}
.dunkel .punkte{display:grid;
  grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
  gap:var(--a5); margin-top:var(--a6)}
.dunkel .punkt{border-top:2px solid var(--auf-dunkel-linie);
  padding-top:var(--a4)}
.dunkel .punkt .sinnbild{color:var(--auf-dunkel-matt); opacity:1; margin:0 0 var(--a3);
  display:block}
.dunkel .punkt .nr{font-size:var(--t-xs); font-weight:700; letter-spacing:.09em;
  color:var(--auf-dunkel-matt); text-transform:uppercase}
.dunkel .punkt .was{font-weight:600; color:var(--auf-dunkel-stark); margin-top:var(--a2)}
.dunkel .punkt .dazu{font-size:var(--t-s); color:var(--auf-dunkel-matt); margin-top:var(--a2);
  line-height:1.5}
@media (max-width:640px){ .dunkel{padding:var(--a7) var(--a5)} }

.nicht{display:flex; flex-wrap:wrap; gap:var(--a3); margin:var(--a4) 0 0}
.nicht span{display:inline-flex; align-items:center; gap:var(--a2);
  border:1px solid var(--linie); border-radius:999px;
  padding:var(--a2) var(--a4); font-size:var(--t-s); color:var(--gedaempft);
  background:var(--flaeche)}
.nicht span::before{content:"×"; font-weight:700; color:var(--fehler)}

dl.angaben{margin:0; display:grid; grid-template-columns:max-content 1fr;
  gap:var(--a2) var(--a5)}
dl.angaben dt{color:var(--gedaempft); font-size:var(--t-s)}
dl.angaben dd{margin:0}
@media (max-width:34rem){
  dl.angaben{grid-template-columns:1fr; gap:0}
  dl.angaben dd{margin:0 0 var(--a4)}
}
.recht{max-width:var(--b-lesen)}


.kopfleiste{position:sticky; top:0; z-index:40;
  background:var(--flaeche); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--linie)}
.kopfleiste .innen{max-width:var(--b-inhalt); margin:0 auto;
  padding:var(--a4) var(--a6); display:flex; align-items:center; gap:var(--a6)}
.kopfleiste nav{display:flex; gap:var(--a6); margin-left:auto;
  align-items:center; flex-wrap:wrap; justify-content:flex-end;
  row-gap:var(--a2)}
.kopfleiste nav a{color:var(--gedaempft); font-size:var(--t-s); font-weight:500}
.kopfleiste nav a:hover{color:var(--tinte); text-decoration:none}
.kopfleiste nav a.knopf,
.kopfleiste nav a.knopf.klein{margin-top:0; font-size:var(--t-s);
  padding:var(--a3) var(--a5); background:var(--knopf); color:var(--auf-knopf);
  border:1px solid var(--knopf); border-radius:var(--radius-pille); font-weight:600}
.kopfleiste nav a.knopf:hover,
.kopfleiste nav a.knopf.klein:hover{background:var(--knopf-tief);
  border-color:var(--knopf-tief); color:var(--auf-knopf); text-decoration:none}
.kopfleiste nav a.weg-knopf{padding:var(--a3) var(--a5); border:1px solid var(--linie-stark);
  border-radius:var(--radius-pille); color:var(--tinte); font-weight:600}
.kopfleiste nav a.weg-knopf:hover{background:var(--flaeche-2); text-decoration:none}
.kopfleiste nav a.knopf.klein.ruhig{background:transparent; color:var(--tinte);
  border-color:var(--linie-stark)}
.kopfleiste nav a.knopf.klein.ruhig:hover{background:var(--flaeche-2); color:var(--tinte)}
.kopfleiste nav a.weg-knopf,.kopfleiste nav a.knopf{min-height:44px; display:inline-flex;
  align-items:center}
.marke{display:inline-flex; align-items:center; gap:var(--a3);
  font-size:var(--t-l); font-weight:600; letter-spacing:-.02em;
  color:var(--tinte); white-space:nowrap; flex:none}
.marke svg{display:block; flex:none}
.markenzusatz{font-size:var(--t-s); color:var(--gedaempft);
  border-left:1px solid var(--linie); padding-left:var(--a5);
  white-space:nowrap; min-width:0; overflow:hidden; text-overflow:ellipsis}
.kopfleiste nav{flex:none}
.kopfleiste nav a{white-space:nowrap}
@media (max-width:1150px){
  .markenzusatz{display:none}
}
@media (max-width:900px){
  .kopfleiste nav a.weg-schmal{display:none}
  .kopfleiste .innen{gap:var(--a4); padding:var(--a3) var(--a5)}
}
@media (max-width:640px){
  .kopfleiste nav a.knopf{width:auto}
  .kopfleiste nav a,footer.fussleiste a{min-height:44px; display:inline-flex;
    align-items:center}
  footer.fussleiste a{min-width:44px; justify-content:center}
  .wegzeile a,a.nebenweg,.firmenliste .firma>a{display:inline-flex;
    align-items:center; min-height:44px}
}
.feldfehler{color:var(--fehler); font-weight:600; margin:0 0 var(--a2)}
input[aria-invalid="true"],select[aria-invalid="true"]{border:2px solid var(--fehler)}
@media (hover:hover) and (pointer:fine){.nur-telefon{display:none}}
@media (max-width:440px){
  .kopfleiste .innen:has(a.weg-knopf) .marke{max-width:44px; overflow:hidden; gap:0;
    justify-content:center; padding:0; border:0; min-width:44px;
    min-height:44px}
  .kopfleiste .innen:has(a.weg-knopf) .marke .marke-name{position:absolute;
    width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);
    white-space:nowrap}
  .kopfleiste nav{gap:var(--a3)}
}

.testphase{background:var(--flaeche-2);
  color:color-mix(in srgb,var(--gedaempft) 70%,var(--tinte));
  border-bottom:1px solid var(--linie-fein)}
.kassenlage{background:var(--warn-flaeche); color:var(--warn);
  border-bottom:1px solid var(--warn-linie)}
.testphase .innen,.kassenlage .innen{max-width:var(--b-inhalt);
  margin:0 auto;
  padding:var(--a3) var(--a6); display:flex; gap:var(--a3);
  align-items:baseline; font-size:var(--t-s); line-height:1.4}
.testphase .zeichen,.kassenlage .zeichen{flex:none; font-weight:700}
.testphase p,.kassenlage p{margin:0}
.kassenlage{background:var(--fehler-flaeche); color:var(--fehler);
  border-bottom:1px solid var(--fehler-linie); font-weight:600}
@media (max-width:900px){
  .testphase .innen,.kassenlage .innen{padding:var(--a3) var(--a5);
    font-size:var(--t-xs)}
}

.held{background:linear-gradient(180deg in oklab, var(--flaeche-2) 0%, var(--grund) 100%);
  border-bottom:1px solid var(--linie); overflow:hidden}
.held .innen{max-width:var(--b-inhalt); margin:0 auto;
  padding:var(--a7) var(--a6) var(--a7); display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.95fr);
  gap:var(--a7); align-items:start}
.held .eyebrow{display:inline-flex; align-items:center; gap:var(--a3);
  font-size:var(--t-xs); font-weight:600; letter-spacing:.06em;
  text-transform:uppercase; color:var(--gedaempft);
  background:var(--flaeche-2); border:1px solid var(--linie);
  border-radius:999px;
  padding:var(--a2) var(--a4); margin:0 0 var(--a5)}
.held h1{font-size:clamp(var(--t-xl),5.2vw,var(--t-2xl)); line-height:1.04;
  letter-spacing:-.035em; margin:0 0 var(--a5); text-wrap:balance;
  font-weight:600}
.held h1 .ton{color:var(--tinte)}
.held .unter{font-size:var(--t-m); line-height:1.55; color:var(--gedaempft);
  max-width:32rem; margin:0 0 var(--a6)}
.held .taten{display:flex; flex-wrap:wrap; gap:var(--a4);
  align-items:center; margin-bottom:var(--a6)}
.held .taten .knopf{font-size:var(--t-m); padding:var(--a4) var(--a6)}
.held .zweiter{font-weight:600; color:var(--tinte); font-size:var(--t-m)}
.held .haken{display:flex; flex-direction:column; gap:var(--a3); margin:0;
  padding:0; list-style:none}
.held .haken li{display:flex; align-items:flex-start; gap:var(--a3);
  font-size:var(--t-s); color:var(--gedaempft)}
.held .haken li::before{content:"✓"; color:var(--akzent-500);
  font-weight:700; line-height:1.5; flex:none}

.held .schau{position:relative; min-width:0; max-height:27rem;
  overflow:hidden; margin-top:var(--a2)}
.held .schau .vorfuehrung{margin:0; transform:rotate(-.4deg);
  box-shadow:var(--schatten-tief)}
.held .schau::after{content:""; position:absolute; left:0; right:0;
  bottom:0; height:10rem; pointer-events:none;
  background:linear-gradient(180deg in oklab, transparent, var(--grund) 82%)}
@media (max-width:900px){
  .held .innen{grid-template-columns:1fr; gap:var(--a7);
    padding:var(--a7) var(--a5) var(--a6)}
  .held .schau{display:none}
}

.belege{background:var(--flaeche); border-bottom:1px solid var(--linie)}
.belege .innen{max-width:var(--b-inhalt); margin:0 auto;
  padding:var(--a6) var(--a6); display:grid;
  grid-template-columns:repeat(auto-fit,minmax(11rem,1fr)); gap:var(--a6)}
.belege .zahl{font-size:var(--t-xl); font-weight:600; letter-spacing:-.03em;
  color:var(--tinte); font-variant-numeric:tabular-nums}
.belege .wozu{font-size:var(--t-s); color:var(--gedaempft); line-height:1.45;
  margin-top:var(--a2)}
@media (max-width:640px){
  .belege .innen{grid-template-columns:1fr 1fr; gap:var(--a5);
    padding:var(--a5) var(--a5)}
  .belege .zahl{font-size:var(--t-l)}
}

main.start{max-width:var(--b-inhalt); padding-top:var(--a9)}
main.start > h2{font-size:clamp(var(--t-l),2.6vw,var(--t-xl)); letter-spacing:-.03em;
  margin:var(--a9) 0 var(--a5)}
main.start > h2:first-child{margin-top:0}
main.start > h2 + p{max-width:var(--b-lesen); color:var(--gedaempft);
  font-size:var(--t-m)}
.abschluss{background:var(--flaeche-2); border:1px solid var(--linie);
  border-radius:var(--radius-gross); padding:var(--a8) var(--a7);
  text-align:center; margin:var(--a9) 0 0}
.abschluss h2{margin:0 0 var(--a4); letter-spacing:-.03em}
.abschluss p{max-width:36rem; margin:0 auto var(--a6);
  color:var(--gedaempft)}

.recht p, .recht li{line-height:1.65}
.recht ul{padding-left:var(--a5)}

.karte.hinweis{border-left:4px solid var(--linie-stark); background:var(--flaeche)}
.karte.warnung{border-left:4px solid var(--warn-linie);
  background:var(--warn-flaeche); color:var(--warn)}
.karte.warnung code{background:var(--flaeche); padding:var(--a1) var(--a2);
  border-radius:4px; color:var(--tinte)}

.jetzt{background:var(--flaeche); border:1px solid var(--kante);
  border-left:3px solid var(--akzent-500); border-radius:var(--radius-gross);
  padding:var(--a7) var(--a7) var(--a6); margin:0 0 var(--a6);
  box-shadow:var(--schatten)}
.jetzt.fertig{border-left-color:var(--gut-linie)}
.jetzt .wann{margin:0 0 var(--a2); font-size:var(--t-s); font-weight:600;
  color:var(--warn); font-family:var(--schrift-text)}
.jetzt .vorwort{margin:0; font-size:var(--t-xs); font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gedaempft);
  font-family:var(--schrift-text)}
.jetzt .was{margin:var(--a2) 0 0; font-size:var(--t-2xl); line-height:1.2;
  color:var(--tinte); overflow-wrap:break-word; hyphens:auto}
.jetzt .warum{margin:var(--a4) 0 0; color:var(--gedaempft);
  max-width:var(--b-lesen)}
.jetzt .tun{margin:var(--a6) 0 0}
.knopf.gross{font-size:var(--t-l); padding:var(--a4) var(--a7)}
@media (max-width:640px){
  .jetzt{padding:var(--a6) var(--a5)}
  .jetzt .was{font-size:var(--t-xl)}
  .knopf.gross{display:block; text-align:center}
}

.sonstnoch{margin:0 0 var(--a7)}
.sonstnoch .wort{margin:0 0 var(--a3); font-size:var(--t-xs);
  font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gedaempft); font-family:var(--schrift-text)}
.sonstnoch ul{list-style:none; margin:0; padding:0; display:flex;
  flex-wrap:wrap; gap:var(--a3) var(--a6)}
.sonstnoch li{min-width:0; overflow-wrap:break-word}
.sonstnoch a{color:var(--gedaempft); text-decoration:none;
  border-bottom:1px solid var(--linie); padding-bottom:var(--a1)}
.sonstnoch a:hover{color:var(--tinte); border-bottom-color:var(--linie-stark);
  text-decoration:none}
.sonstnoch .dazu{color:var(--gedaempft); font-size:var(--t-s);
  margin-left:var(--a2); opacity:.8}

.fortschrittskarte{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:var(--radius-gross); padding:var(--a6) var(--a7);
  margin:0 0 var(--a6)}
.fortschrittskarte .kopf{display:flex; justify-content:space-between;
  align-items:baseline; gap:var(--a4); flex-wrap:wrap}
.fortschrittskarte .was{font-size:var(--t-xs); font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gedaempft)}
.fortschrittskarte .zahlen{font-size:var(--t-l); font-weight:700;
  color:var(--tinte); font-variant-numeric:tabular-nums}
.fortschrittskarte .balken{margin-top:var(--a3); height:.5rem;
  border-radius:999px; background:var(--grund); overflow:hidden}
.fortschrittskarte .balken .fuellung{height:100%; border-radius:999px;
  background:var(--akzent-500)}
.fortschrittskarte ul{list-style:none; margin:var(--a4) 0 0; padding:0}
.fortschrittskarte li{padding:var(--a2) 0; color:var(--gedaempft);
  font-size:var(--t-s)}
.fortschrittskarte li.fertig{color:var(--gut)}
.fortschrittskarte li .zeichen{display:inline-block; width:1.2em}
.fortschrittskarte .tun{margin:var(--a5) 0 0}

.naechste-frist{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:var(--radius-gross); padding:var(--a6) var(--a7);
  margin:0 0 var(--a6)}
.naechste-frist .was{font-size:var(--t-xs); font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gedaempft)}
.naechste-frist .datum{margin:var(--a3) 0 0; font-size:var(--t-l);
  font-weight:700; color:var(--tinte)}
.naechste-frist .tage{display:block; font-size:var(--t-s); font-weight:400;
  color:var(--gedaempft); margin-top:var(--a1)}
.naechste-frist .grund{margin:var(--a2) 0 0; color:var(--gedaempft);
  font-size:var(--t-s)}
.naechste-frist.ruhig p{color:var(--gedaempft); margin:var(--a3) 0 0}


details.klappe{border-top:1px solid var(--linie-fein); margin:0}
details.klappe > summary{list-style:none; cursor:pointer;
  padding:var(--a4) 0; display:flex; gap:var(--a4); align-items:baseline;
  color:var(--gedaempft); font-family:var(--schrift-text);
  font-size:var(--t-s)}
details.klappe > summary::-webkit-details-marker{display:none}
details.klappe > summary::before{content:"›"; display:inline-block;
  color:var(--linie-stark); font-weight:700;
  transition:transform var(--zeit) var(--kurve)}
details.klappe[open] > summary::before{transform:rotate(90deg)}
details.klappe > summary:hover{color:var(--tinte)}
details.klappe > summary:focus-visible{outline:2px solid var(--akzent-500);
  outline-offset:2px; border-radius:var(--radius)}
details.klappe > summary .titel{font-weight:600; color:var(--tinte)}
details.klappe > summary .dazu{margin-left:auto; color:var(--gedaempft)}
details.klappe > .inhalt{padding:0 0 var(--a6)}
details.klappe > .inhalt > h2:first-child{margin-top:0}

.achse{margin:var(--a5) 0 var(--a7)}

.achse-quer{display:block; background:var(--flaeche);
  border:1px solid var(--linie); border-radius:var(--radius-gross);
  padding:var(--a4) var(--a5) var(--a5); overflow:hidden}
.achse-zeile{display:grid; grid-template-columns:15.5rem 1fr;
  gap:var(--a4); align-items:center; padding:var(--a2) 0;
  border-top:1px solid var(--linie-fein)}
.achse-zeile:first-child{border-top:0}
.achse-kopf{border-top:0; padding-bottom:var(--a2);
  position:sticky; top:0; background:var(--flaeche); z-index:1}
.achse-kopf .achse-was{color:var(--gedaempft);
  font-size:var(--t-xs); letter-spacing:.04em; text-transform:uppercase}
.achse-monate{display:grid; grid-template-columns:repeat(12,1fr);
  gap:var(--a1); min-width:0}
.achse-m{min-width:0; display:flex; flex-wrap:wrap; gap:var(--a1);
  justify-content:center; align-items:center; min-height:1.5rem;
  border-left:1px solid var(--linie-fein); padding:var(--a1) 0}
.achse-m:first-child{border-left:0}
.achse-kopf .achse-m{font-size:var(--t-xs); color:var(--gedaempft);
  border-left:0; font-family:var(--schrift-text); letter-spacing:.03em}
.achse-m.heute{background:var(--akzent-50)}
.achse-kopf .achse-m.heute{color:var(--akzent-700); font-weight:700;
  border-radius:var(--radius)}

.achse-was{min-width:0}
.achse-was .wr-name{display:block; font-weight:600; line-height:1.25}
.achse-was .wr-wo,.achse-was .wr-takt{display:block;
  font-size:var(--t-xs); color:var(--gedaempft)}
.achse-was .wr-wenn{display:block; font-size:var(--t-xs);
  color:var(--gedaempft); font-style:italic}
.achse-was .wr-nr,.achse-noten .nr{display:inline-flex;
  align-items:center; justify-content:center; min-width:1.15rem;
  height:1.15rem; margin:var(--a1) var(--a1) 0 0;
  border-radius:var(--radius-rund); background:var(--flaeche-2);
  color:var(--gedaempft); font-size:var(--t-xs); font-weight:700;
  font-family:var(--schrift-text)}
.achse-noten{list-style:none; margin:var(--a4) 0 0; padding:0;
  columns:2; column-gap:var(--a6); font-size:var(--t-xs);
  color:var(--gedaempft)}
.achse-noten li{break-inside:avoid; margin:0 0 var(--a2);
  line-height:1.35}
.achse-noten .wo{font-size:.9em}
@media (max-width:700px){.achse-noten{columns:1}}
.achse-gruppe{margin:var(--a5) 0 var(--a2); font-size:var(--t-xs);
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--gedaempft); font-family:var(--schrift-text)}
.achse-gruppe:first-child{margin-top:var(--a3)}

.marke{display:inline-flex; align-items:center; justify-content:center;
  min-width:2.2em; padding:var(--a1) var(--a2); font-size:var(--t-xs);
  line-height:1.4; border:1px solid transparent;
  border-radius:var(--radius-rund); font-variant-numeric:tabular-nums;
  font-family:var(--schrift-text); text-decoration:none}
.marke.wiederkehrend{background:var(--flaeche-2); color:var(--gedaempft);
  border-color:var(--linie)}
.marke.einmal{background:var(--tinte); color:var(--flaeche);
  font-weight:700; border-radius:var(--radius)}
.marke.hinweis{background:var(--warn-flaeche); color:var(--warn);
  border-color:var(--warn-linie); border-radius:var(--radius)}
.marke.bedingt{background:transparent; border-style:dashed;
  border-color:var(--linie-stark); color:var(--gedaempft);
  font-weight:400}

.achse-legende{display:flex; flex-wrap:wrap; gap:var(--a5);
  margin:var(--a4) 0 0; font-size:var(--t-xs); color:var(--gedaempft);
  align-items:center}
.achse-legende span.was{display:inline-flex; align-items:center;
  gap:var(--a2)}

.spurwahl{display:flex; flex-wrap:wrap; gap:var(--a3);
  margin:var(--a4) 0 var(--a5)}
.spurwahl > a{display:inline-block; padding:var(--a3) var(--a5);
  border:1px solid var(--linie); border-radius:var(--radius-rund);
  background:var(--flaeche); color:var(--tinte); text-decoration:none;
  font-size:var(--t-s)}
.spurwahl > a[aria-current="page"]{background:var(--akzent-500);
  border-color:var(--akzent-500); color:var(--auf-akzent);
  font-weight:600}

.band{list-style:none; margin:var(--a8) 0 0; padding:0;
  display:grid; gap:0}
.band li{position:relative; padding:0 0 var(--a7) var(--a7);
  border-left:var(--a1) solid var(--linie)}
.band li:last-child{border-left-color:transparent; padding-bottom:0}
.band .punkt{position:absolute;
  left:calc(var(--a1) / 2 - var(--a5) / 2); top:var(--a1);
  width:calc(var(--a5) - var(--a1) * 2);
  height:calc(var(--a5) - var(--a1) * 2);
  border-radius:var(--radius-rund);
  background:var(--flaeche); border:var(--a1) solid var(--linie)}
.band .wann{display:block; font-size:var(--t-s); color:var(--gedaempft);
  letter-spacing:.04em}
.band .was{display:block; font-size:var(--t-l); font-weight:600;
  margin:var(--a1) 0 0}
.band .dazu{display:block; color:var(--gedaempft); font-size:var(--t-s);
  margin:var(--a2) 0 0}

.bandfragen{display:flex; flex-wrap:wrap; gap:var(--a6);
  align-items:flex-end; margin:var(--a7) 0 0}
.bandfragen fieldset{border:0; margin:0; padding:0}
.bandfragen legend{padding:0 0 var(--a3); font-size:var(--t-s);
  color:var(--gedaempft)}
.bandfragen label{display:inline-flex; align-items:baseline;
  gap:var(--a2); margin-right:var(--a5)}
@media (max-width:700px){
  .bandfragen{flex-direction:column; align-items:stretch}
}

.achse-hoch{display:none; list-style:none; margin:0; padding:0}
.achse-hoch > li{border-top:1px solid var(--linie-fein);
  padding:var(--a4) 0}
.achse-hoch > li:first-child{border-top:0}
.achse-hoch .mname{font-weight:600; font-family:var(--schrift-titel);
  margin:0 0 var(--a2)}
.achse-hoch li.heute .mname{color:var(--akzent-700)}
.achse-hoch li.leer .mname{color:var(--gedaempft); font-weight:400}
.achse-hoch ul{list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:var(--a3)}
.achse-hoch ul li{display:grid; grid-template-columns:3rem 1fr;
  gap:var(--a3); align-items:start}
.achse-hoch .was{display:block; font-weight:600; line-height:1.3}
.achse-hoch .wo{display:block; font-size:var(--t-xs);
  color:var(--gedaempft)}
.achse-hoch .wenn{display:block; font-size:var(--t-xs);
  color:var(--gedaempft); font-style:italic}
.achse-hoch .nichts{color:var(--gedaempft); font-size:var(--t-s)}

@media (max-width:900px){
  .achse-quer{display:none}
  .achse-hoch{display:block}
}

body.nur-achse .kopfleiste,body.nur-achse .fussleiste,
body.nur-achse .zum-inhalt,body.nur-achse .achse-hoch,
body.nur-achse .nicht-im-druck,body.nur-achse details.klappe,
body.nur-achse .karte.begriffe,body.nur-achse .weiterlesen{display:none}
body.nur-achse{--dt-s:.5rem; --dt-m:.58rem; --dt-l:.68rem}
body.nur-achse main{padding:var(--a3) var(--a4); max-width:none}
body.nur-achse .achse-quer{border:0; padding:0; display:block;
  break-inside:avoid}

body.nur-achse .spurwahl,body.nur-achse .achse-legende .was:last-child{
  display:none}
body.nur-achse .testphase .innen{padding:var(--a1) var(--a4)}
body.nur-achse .testphase{font-size:var(--dt-m); line-height:1.25}
body.nur-achse h1{font-size:var(--t-l); margin:0 0 var(--a1)}
body.nur-achse .unterzeile{font-size:var(--dt-m); line-height:1.3;
  margin:0 0 var(--a2)}
body.nur-achse .achse{margin:0}
body.nur-achse main > p{margin:var(--a2) 0 0}
body.nur-achse .achse-legende{margin:var(--a2) 0 0;
  gap:var(--a4); row-gap:0}
body.nur-achse .achse-noten li{margin:0}
body.nur-achse .achse-gruppe{margin:var(--a1) 0 0}
body.nur-achse .achse-zeile{padding:0; gap:var(--a3);
  grid-template-columns:18rem 1fr; break-inside:avoid}
body.nur-achse .achse-was .wr-name{font-size:var(--dt-l);
  line-height:1.15}
body.nur-achse .achse-was .wr-wo{font-size:var(--dt-s); line-height:1.15}
body.nur-achse .achse-was .wr-takt{display:none}
body.nur-achse .testphase .innen{max-width:none}

body.nur-achse .achse-was .wr-nr,body.nur-achse .achse-noten .nr{
  display:inline; min-width:0; height:auto; padding:0 var(--a1);
  border-radius:2px; font-size:var(--dt-s); line-height:1; margin:0 var(--a1) 0 0;
  vertical-align:baseline}
body.nur-achse .achse-noten{columns:4; font-size:var(--dt-s);
  margin:var(--a2) 0 0; line-height:1.2}
body.nur-achse .achse-gruppe{margin:var(--a3) 0 0; font-size:var(--dt-m)}
body.nur-achse .achse-kopf .achse-m{font-size:var(--dt-m)}
body.nur-achse .achse-m{min-height:.85rem}
body.nur-achse .marke{font-size:var(--dt-s); min-width:1.7em; padding:0 var(--a1);
  border-radius:var(--radius)}
body.nur-achse .achse-legende{gap:var(--a4); font-size:var(--dt-m);
  margin:var(--a2) 0 0}
body.nur-achse .leise{font-size:var(--dt-s); line-height:1.3;
  margin:var(--a2) 0 0}

@media print{
  :root{--dt-s:.5rem; --dt-m:.58rem; --dt-l:.68rem}
  .kopfleiste,.fussleiste,.zum-inhalt,.achse-hoch,.spurwahl,
  .nicht-im-druck,details.klappe,.karte.begriffe,.weiterlesen,
  .achse-legende .was:last-child{display:none !important}
  .testphase .innen{padding:var(--a1) var(--a4)}
  .testphase{font-size:var(--dt-m); line-height:1.25}
  h1{font-size:var(--t-l); margin:0 0 var(--a1)}
  .unterzeile{font-size:var(--dt-m); line-height:1.3; margin:0 0 var(--a2)}
  .achse{margin:0}
  main > p{margin:var(--a2) 0 0}
  .achse-legende{margin:var(--a2) 0 0; gap:var(--a4); row-gap:0}
  .achse-noten li{margin:0}
  .achse-gruppe{margin:var(--a1) 0 0}
  .achse-quer{display:block !important; border:0; padding:0;
    break-inside:avoid}
  main{padding:var(--a3) var(--a4)}
  .achse-zeile{padding:0; break-inside:avoid; gap:var(--a3);
    grid-template-columns:18rem 1fr}
  .achse-was .wr-name{font-size:var(--dt-l); line-height:1.15}
  .achse-was .wr-wo{font-size:var(--dt-s); line-height:1.15}
  .achse-was .wr-takt{display:none}
  .testphase .innen{max-width:none}

  .achse-was .wr-nr,.achse-noten .nr{display:inline; min-width:0;
    height:auto; padding:0 var(--a1); border-radius:2px; font-size:var(--dt-s);
    line-height:1; margin:0 var(--a1) 0 0; vertical-align:baseline}
  .achse-noten{columns:4; font-size:var(--dt-s); margin:var(--a2) 0 0;
    line-height:1.2}
  .achse-gruppe{margin:var(--a3) 0 0; font-size:var(--dt-m)}
  .achse-kopf .achse-m{font-size:var(--dt-m)}
  .achse-m{min-height:.85rem}
  .marke{border-radius:var(--radius); font-size:var(--dt-s);
    min-width:1.7em; padding:0 var(--a1)}
  .achse-legende{gap:var(--a4); font-size:var(--dt-m); margin:var(--a2) 0 0}
  .leise{font-size:var(--dt-s); line-height:1.3; margin:var(--a2) 0 0}
  main{max-width:none}
  @page{size:A4 landscape; margin:8mm}
}

.bahn{display:grid; grid-template-columns:repeat(12,1fr); gap:var(--a1);
  margin:0 0 var(--a7); border-top:1px solid var(--linie-fein);
  padding-top:var(--a4)}
.bahn .monat{min-width:0; display:flex; flex-direction:column;
  align-items:center; gap:var(--a1); padding:var(--a2) 0}
.bahn .kurz{font-size:var(--t-xs); color:var(--gedaempft);
  font-family:var(--schrift-text); letter-spacing:.04em}
.bahn .punkt{width:5px; height:5px; border-radius:50%;
  background:var(--linie-stark)}
.bahn .mehr{font-size:var(--t-xs); color:var(--gedaempft)}
.bahn .vorbei{opacity:.45}
.bahn .vorbei .punkt{background:var(--linie-stark)}
.bahn .kommt{opacity:.75}
.bahn .jetzt{background:var(--akzent-50); border-radius:var(--radius)}
.bahn .jetzt .kurz{color:var(--akzent-700); font-weight:700}
.bahn .still .kurz{opacity:.5}
@media (max-width:640px){
  .bahn{grid-template-columns:repeat(6,1fr); row-gap:var(--a3)}
  .bahn .kurz{font-size:var(--t-xs)}
}

form.zeile{display:flex; flex-wrap:wrap; gap:var(--a3); align-items:center;
  margin:var(--a4) 0 0}
form.zeile label{margin:0; white-space:nowrap}
form.zeile select,form.zeile input{width:auto; max-width:16rem}


:focus-visible{outline:2px solid var(--akzent-500); outline-offset:2px;
  border-radius:var(--radius)}
.knopf:focus-visible,button:focus-visible{outline:2px solid var(--tinte);
  outline-offset:2px}

.zum-inhalt{position:absolute; left:-9999px; top:0; z-index:50;
  background:var(--flaeche); color:var(--tinte); padding:var(--a4) var(--a5);
  border:2px solid var(--akzent-500); border-radius:var(--radius)}
.zum-inhalt:focus{left:var(--a5); top:var(--a3)}

.knopf,button,.karte,a.karte{transition:background-color var(--zeit-kurz)
  var(--kurve), border-color var(--zeit-kurz) var(--kurve),
  box-shadow var(--zeit-kurz) var(--kurve)}
.knopf:active,button:active{transform:translateY(1px)}

button[aria-busy="true"],.knopf[aria-busy="true"]{opacity:.75;
  cursor:progress}
button[aria-busy="true"]::after{content:""; display:inline-block;
  width:.7em; height:.7em; margin-left:var(--a3);
  border:2px solid currentColor; border-right-color:transparent;
  border-radius:50%; animation:dreht 700ms linear infinite;
  vertical-align:-1px}
@keyframes dreht{to{transform:rotate(360deg)}}

.fussleiste{border-top:1px solid var(--linie); margin-top:var(--a8);
  padding:var(--a5) var(--a6); background:var(--flaeche)}
.fussleiste .innen{max-width:var(--b-inhalt); margin:0 auto;
  display:flex; flex-wrap:wrap; gap:var(--a3) var(--a5);
  align-items:baseline; font-size:var(--t-s); color:var(--gedaempft)}
.fussleiste a{color:var(--gedaempft); text-decoration:underline;
  text-underline-offset:2px}
.fussleiste a:hover{color:var(--tinte)}
.fussleiste .abstand{flex:1 1 auto}
.fussleiste .mehr{margin-top:var(--a4); padding-top:var(--a4);
  border-top:1px solid var(--linie); font-size:var(--t-xs)}
.fussleiste .mehr a{text-decoration:none}
.fussleiste .mehr a:hover{text-decoration:underline}
.fussleiste .fusstitel{color:var(--gedaempft)}.fussleiste .klarwort{margin-top:var(--a4); padding-top:var(--a4);
  border-top:1px solid var(--linie); font-size:var(--t-xs);
  display:block}
.fussleiste .klarwort p{margin:0; max-width:52em}
.fussleiste .kuendigung{margin-top:var(--a4); padding-top:var(--a4);
  border-top:1px solid var(--linie); font-size:var(--t-s)}
.fussleiste .kuendigung a{color:var(--tinte)}

.darstellung{display:inline-flex; gap:var(--a3); align-items:baseline}
.darstellung a{text-decoration:none}
.darstellung a[aria-current]{color:var(--tinte); font-weight:600;
  text-decoration:underline; text-underline-offset:3px}

@media print{
  .leiste, form, .abschluss, .kopfleiste, .fussleiste{display:none !important}
  .geruest{display:block}
  .karte, figure.bild{break-inside:avoid; box-shadow:none}
  h2{break-after:avoid}
}

label .freiwillig{font-weight:400; color:var(--gedaempft); font-size:var(--t-xs);
  margin-left:var(--a2)}

.wortlaut{margin:var(--a3) 0;padding:var(--a4) var(--a5);border-left:3px solid var(--linie-stark);
  background:var(--flaeche-2);font-size:var(--t-s);line-height:1.55}
.pflicht h2{display:flex;align-items:center;gap:var(--a3);flex-wrap:wrap}
.haken{display:flex;gap:var(--a3);align-items:flex-start;margin-top:var(--a4);
  font-size:var(--t-m);line-height:1.5}
.haken input{margin-top:var(--a2);flex:none}
ul.haken{flex-direction:column;padding-left:var(--a5)}
.marke-fertig,.marke-offen{font-size:var(--t-xs);font-weight:600;
  letter-spacing:.02em;padding:var(--a1) var(--a3);border-radius:.6rem;
  white-space:nowrap}
.marke-fertig{background:var(--gut-flaeche);color:var(--gut)}
.marke-offen{background:var(--fehler-flaeche);color:var(--fehler)}
.hinweis87c{background:var(--flaeche-2);font-size:var(--t-s)}
.fehlerband.erfolg{background:var(--gut-flaeche);color:var(--gut)}


.kopfbild{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:var(--a7); align-items:center; margin:var(--a9) 0}
.wust{color:var(--gedaempft);
  line-height:1.75; max-height:19rem; overflow:hidden; user-select:none;
  -webkit-mask-image:linear-gradient(var(--tinte) 58%,transparent 100%);
  mask-image:linear-gradient(var(--tinte) 58%,transparent 100%)}
.wust span{display:inline-block; margin:0 var(--a3) var(--a1) 0;
  white-space:nowrap; opacity:.72}
.wust .g1{font-size:var(--t-xs)}
.wust .g2{font-size:var(--t-m); opacity:.86}
.wust .g3{font-size:var(--t-xs); opacity:.55}
.kopfbild .woher{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.08em; color:var(--gedaempft); font-weight:600;
  margin:0 0 var(--a3)}
.kopfbild h2{margin:0 0 var(--a4); letter-spacing:-.03em;
  font-size:clamp(var(--t-l),3.1vw,var(--t-xl)); line-height:1.2;
  text-wrap:balance}
.kopfbild .ansage p{max-width:34rem}

@media (max-width:820px){
  .kopfbild{grid-template-columns:1fr; gap:var(--a5)}
  .wust{max-height:9.5rem}
}

.woher{margin:var(--a9) 0}
.woher h2{margin-bottom:var(--a6)}
.woherweg{display:grid; align-items:center; gap:var(--a5);
  grid-template-columns:minmax(0,1.15fr) auto minmax(0,1fr)}
.qtitel{font-size:var(--t-xs); text-transform:uppercase; letter-spacing:.08em;
  color:var(--gedaempft); font-weight:600; margin:0 0 var(--a3)}
.qtitel-zwei{margin-top:var(--a5)}
.quelle{display:flex; flex-direction:column; background:var(--flaeche);
  border:1px solid var(--linie); border-radius:8px;
  padding:var(--a3) var(--a4); margin:0 0 var(--a3)}
.quelle-geprueft{border-color:var(--linie); background:var(--flaeche-2)}
.qname{font-weight:600; font-size:var(--t-s)}
.qdazu{color:var(--gedaempft); font-size:var(--t-xs); margin-top:var(--a1)}
.quellreihe{display:flex; flex-wrap:wrap; gap:var(--a3)}
.quellreihe .quelle{margin:0}
.uebergabe{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:var(--radius); padding:var(--a6) var(--a5)}
.uebergabe p{margin:0 0 var(--a3); font-size:var(--t-s)}
.uebergabe .leise{margin:0; font-size:var(--t-s); color:var(--gedaempft)}
.sinnbild-gross{width:40px; height:40px; color:var(--gedaempft);
  margin-bottom:var(--a4)}
.woher .satz{margin-top:var(--a6); color:var(--gedaempft);
  font-size:var(--t-s); line-height:1.55; max-width:46rem}

@media (max-width:820px){
  .woherweg{grid-template-columns:1fr; gap:var(--a4)}
  .woher .pfeil{width:100%; height:2.6rem; padding:0;
    justify-content:center}
  .woher .pfeil svg{transform:rotate(90deg)}
}

.ergebnisbild{margin:var(--a9) 0}
.ergebnisbild h2{margin-bottom:var(--a6)}
.blaetter{display:grid; gap:var(--a5) var(--a5);
  grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}
.blattkarte{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:var(--radius); padding:var(--a5) var(--a4) var(--a4);
  display:flex; flex-direction:column; align-items:flex-start}
.blatt{color:var(--gedaempft); opacity:.8; margin-bottom:var(--a4)}
.blattname{font-weight:600; line-height:1.3; font-size:var(--t-m);
  hyphens:auto; overflow-wrap:anywhere}
.blattwohin{color:var(--gedaempft); font-size:var(--t-xs); line-height:1.4;
  margin:var(--a2) 0 var(--a4); flex:1 1 auto}
.marke-spaeter{display:inline-block; font-size:var(--t-xs); font-weight:600;
  padding:var(--a1) var(--a3); border-radius:999px; background:var(--info-flaeche);
  color:var(--info); border:1px solid var(--linie)}
.ergebnisbild .satz{margin-top:var(--a6); color:var(--gedaempft);
  font-size:var(--t-s); max-width:44rem}

@media (max-width:520px){
  .blaetter{grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:var(--a4)}
  .blattkarte{padding:var(--a4) var(--a3)}
  .blatt{width:44px; height:57px}
  .blattkarte .marke-fertig,.blattkarte .marke-offen,
  .blattkarte .marke-spaeter{white-space:normal; line-height:1.3}
}

.wegbild{margin:var(--a9) 0}
.wegbild h2{margin-bottom:var(--a7)}
.wegbild .sinnbild{width:40px;height:40px}
.wegbild .satz{margin-top:var(--a6)}
.stationen{display:grid;gap:var(--a3) var(--a5);align-items:start;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr}
.station{text-align:center;padding:var(--a2)}
.sinnbild{color:var(--gedaempft);margin-bottom:var(--a3)}
.station .name{font-weight:600;line-height:1.35}
.station .dazu{font-size:var(--t-s);color:var(--gedaempft);line-height:1.45;
  margin-top:var(--a2)}
.pfeil{display:flex;align-items:center;justify-content:center;
  color:var(--gedaempft);padding-top:var(--a6)}
.dunkel .sinnbild,.dunkel .pfeil{color:currentColor;opacity:.85}
.dunkel .station .dazu{color:inherit;opacity:.75}

@media (max-width:820px){
  .stationen{grid-template-columns:1fr;gap:var(--a2)}
  .pfeil{width:100%;height:3rem;padding:0 0 0 var(--a2);
    justify-content:flex-start}
  .pfeil svg{transform:rotate(90deg)}
  .station{display:grid;grid-template-columns:auto 1fr;gap:var(--a1) var(--a5);
    text-align:left;align-items:center;
    width:100%;max-width:26rem;margin-inline:auto}
  .sinnbild{grid-row:span 2;margin-bottom:0}
  .station .dazu{margin-top:0}
}

.ergebnisband{background:var(--flaeche-2); border:1px solid var(--linie);
  border-radius:var(--radius); padding:var(--a6) var(--a6) var(--a5);
  margin:0 0 var(--a6)}
.ergebnisband .gross{font-size:clamp(var(--t-xl),6vw,var(--t-2xl)); font-weight:600;
  letter-spacing:-.035em; line-height:1; color:var(--tinte);
  font-variant-numeric:tabular-nums}
.ergebnisband .wozu{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.08em; color:var(--gedaempft); font-weight:600; margin:0 0 var(--a2)}
.ergebnisband .dazu{margin:var(--a3) 0 0; color:var(--tinte); font-size:var(--t-s);
  line-height:1.5; max-width:44rem}
.ergebnisband .nebenwerte{display:flex; flex-wrap:wrap; gap:var(--a4) var(--a7);
  margin:var(--a5) 0 0; padding:var(--a5) 0 0;
  border-top:1px solid var(--linie)}
.ergebnisband .nebenwert .zahl{font-size:var(--t-l); font-weight:600;
  letter-spacing:-.02em; color:var(--tinte); font-variant-numeric:tabular-nums}
.ergebnisband .nebenwert .was{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.07em; color:var(--gedaempft); font-weight:600}

.ungeprueft{border-left:3px solid var(--warn-linie); background:var(--warn-flaeche);
  padding:var(--a4) var(--a5); border-radius:0 6px 6px 0}
tr.ungeprueft td{background:var(--warn-flaeche)}
.ungeprueft b{color:var(--warn)}
table.rechenweg caption{caption-side:top; text-align:left; font-size:var(--t-s);
  color:var(--gedaempft); padding:var(--a2) var(--a3) var(--a3); line-height:1.5}
table.rechenweg thead th{text-align:left; font-size:var(--t-xs);
  text-transform:uppercase; letter-spacing:.06em; color:var(--gedaempft);
  padding:var(--a3) var(--a3); border-bottom:1px solid var(--linie-stark)}
.abschluss .zweiter{display:inline-block; margin-left:var(--a4);
  font-weight:600; color:var(--tinte); font-size:var(--t-m)}
table.rechenweg{margin:0; font-variant-numeric:tabular-nums}
table.rechenweg td{vertical-align:top; padding:var(--a3) var(--a3)}
table.rechenweg td.zeichen{width:1.6rem; text-align:center; font-weight:700;
  color:var(--gedaempft); padding-left:0}
table.rechenweg td.was{width:auto}
table.rechenweg td.wieviel{text-align:right; white-space:nowrap;
  font-weight:500; padding-right:0}
table.rechenweg .name{font-weight:500}
table.rechenweg .warum{color:var(--gedaempft); font-size:var(--t-s);
  line-height:1.45; margin-top:var(--a1); max-width:38rem}
table.rechenweg .fundstelle{display:inline-block; margin-top:var(--a2);
  font-size:var(--t-xs); color:var(--gedaempft);
  background:var(--info-flaeche); border-radius:4px; padding:var(--a1) var(--a3)}
table.rechenweg tr.summe td{border-top:1px solid var(--linie-stark);
  background:var(--flaeche-2)}
table.rechenweg tr.summe .name, table.rechenweg tr.summe td.wieviel{
  font-weight:600}
table.rechenweg tr.ergebnis td{border-top:2px solid var(--linie-stark);
  background:var(--flaeche-2)}
table.rechenweg tr.ergebnis .name,
table.rechenweg tr.ergebnis td.wieviel{color:var(--tinte); font-weight:700}
table.rechenweg tr.ergebnis td.wieviel{font-size:var(--t-m)}

.datenlage{border:1px solid var(--linie); border-left:3px solid var(--warn-linie);
  border-radius:var(--radius); background:var(--flaeche);
  padding:var(--a5) var(--a6); margin:var(--a6) 0}
.datenlage h3{margin:0 0 var(--a3); font-size:var(--t-m)}
.datenlage p{font-size:var(--t-s); line-height:1.6; margin:var(--a3) 0}
.datenlage dl{display:grid; grid-template-columns:auto minmax(0,1fr);
  gap:var(--a2) var(--a5); margin:var(--a4) 0 0; font-size:var(--t-s)}
.datenlage dt{color:var(--gedaempft); white-space:nowrap}
.datenlage dd{margin:0; font-variant-numeric:tabular-nums}

.hebel{background:var(--flaeche-2); border:1px solid var(--linie);
  border-radius:10px; padding:var(--a4) var(--a5); margin:var(--a4) 0 0}
.hebel label{margin-top:0}
.hebel .satz{font-size:var(--t-s); color:var(--tinte); line-height:1.5; margin:var(--a3) 0 0}

details.mehrfelder{margin:var(--a5) 0 0; border-top:1px solid var(--linie);
  padding-top:var(--a4)}
details.mehrfelder > summary{cursor:pointer; font-weight:500; font-size:var(--t-s);
  list-style:none}
details.mehrfelder > summary::-webkit-details-marker{display:none}
details.mehrfelder > summary::before{content:"+ "; font-weight:700;
  color:var(--gedaempft)}
details.mehrfelder[open] > summary::before{content:"– "}
details.mehrfelder > summary:focus-visible{outline:2px solid var(--akzent-500);
  outline-offset:3px; border-radius:4px}
details.mehrfelder .warum{color:var(--gedaempft); font-size:var(--t-s);
  line-height:1.5; margin:var(--a3) 0 0; max-width:42rem}

.gegenkarte{background:var(--flaeche); border:1px solid var(--linie);
  border-radius:var(--radius); padding:var(--a6); margin:var(--a5) 0}
.gegenrechnung{display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:var(--a5); margin:var(--a6) 0 0}
.gegenrechnung .seite{border:1px solid var(--linie); border-radius:12px;
  padding:var(--a5); background:var(--grund)}
.gegenrechnung .seite.eigen{border-color:var(--linie-stark);
  background:var(--flaeche-2)}
.gegenrechnung .was{font-size:var(--t-xs); text-transform:uppercase;
  letter-spacing:.08em; font-weight:600; color:var(--gedaempft)}
.gegenrechnung .seite.eigen .was{color:var(--gedaempft)}
.gegenrechnung .zahl{font-size:clamp(var(--t-l),4vw,var(--t-xl)); font-weight:600;
  letter-spacing:-.03em; line-height:1.1; margin:var(--a2) 0 var(--a3);
  font-variant-numeric:tabular-nums}
.gegenrechnung .seite.eigen .zahl{color:var(--tinte)}
.gegenrechnung .dazu{font-size:var(--t-s); line-height:1.5;
  color:var(--gedaempft)}
.gegenkarte .folgerung{margin:var(--a5) 0 0; font-size:var(--t-m); line-height:1.55}
.gegenkarte .grundlage{margin:var(--a5) 0 0; font-size:var(--t-s);
  line-height:1.6; color:var(--gedaempft); max-width:46rem}
.gegenkarte .tat{display:flex; flex-wrap:wrap; align-items:center;
  gap:var(--a4) var(--a5); margin:var(--a6) 0 0;
  border-top:1px solid var(--linie); padding-top:var(--a5)}
.gegenkarte .tat .knopf{margin-top:0; flex:none}
.gegenkarte .tat .daneben{flex:1 1 16rem; font-size:var(--t-s);
  line-height:1.5; color:var(--gedaempft)}

.umschalter{margin:var(--a9) 0}
.umschalter > h2{margin:0 0 var(--a7); text-align:center}

.kachelreihe{display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  gap:var(--a4); max-width:64rem; margin:0 auto var(--a8)}
.kachel{display:flex; align-items:center; justify-content:flex-start;
  gap:var(--a3); min-width:0; padding:var(--a4) var(--a5);
  border:1px solid var(--linie); border-radius:999px;
  background:var(--flaeche); color:var(--gedaempft);
  font-size:var(--t-s); font-weight:600; line-height:1.25;
  text-align:left; cursor:pointer}
.kachel .wort{min-width:0; hyphens:auto; overflow-wrap:break-word}
.kachelzeichen{flex:none; width:20px; height:20px}
.kachel:hover{border-color:var(--linie-stark); color:var(--tinte)}
.kachel[aria-selected="true"]{background:var(--akzent-50);
  color:var(--akzent-700); border-color:var(--akzent-500)}

.buehne{position:relative}
.kachelblatt{display:grid; justify-items:center; gap:var(--a6);
  padding-block:var(--a6); scroll-margin-top:var(--a9)}
[hidden]{display:none!important}
.kachelblatt .blattwort{margin:0; font-size:var(--t-l);
  color:var(--gedaempft)}
[data-umschalter="an"] .blattwort{display:none}
.umschalter .satz{margin:0; max-width:44rem; text-align:center;
  font-size:var(--t-l); line-height:1.5; color:var(--tinte)}

.bildplatz{display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:var(--a2); width:100%; max-width:52rem;
  aspect-ratio:16/9; border:1px dashed var(--linie);
  border-radius:var(--radius-gross); background:var(--flaeche-2);
  color:var(--gedaempft)}
.bildplatz .dateiname{font-size:var(--t-s); font-weight:600}
.bildplatz .fehlt{font-size:var(--t-xs); letter-spacing:.06em;
  text-transform:uppercase}

.kachelbild{display:block}
.kachelbild img{width:100%; max-width:52rem; height:auto;
  aspect-ratio:16/9; display:block; margin-inline:auto;
  border-radius:var(--radius-gross)}

@keyframes kachel-ein{from{opacity:0} to{opacity:1}}
[data-umschalter="an"] .kachelblatt{animation:kachel-ein .18s ease-out}

@media (max-width:900px){
  .kachelreihe{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .kachelreihe{grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--a3); margin-bottom:var(--a7)}
  .kachel{padding:var(--a3) var(--a4); font-size:var(--t-xs)}
  .kachelzeichen{width:18px; height:18px}
  .umschalter .satz{font-size:var(--t-m)}
}


.startkopf{border-bottom:1px solid var(--linie-fein)}
.startkopf .innen{max-width:var(--b-inhalt); margin:0 auto;
  padding:var(--a10) var(--a6)}
.startkopf h1 .zeile,.startkopf h2 .zeile{display:block}
.startkopf h1{font-size:var(--t-2xl); line-height:1.06;
  letter-spacing:-0.03em; margin:0 0 var(--a6)}
@media (min-width:1100px){.startkopf h1{white-space:nowrap}}
.startkopf h2.loesung{font-size:var(--t-l); font-weight:500;
  color:var(--gedaempft); line-height:1.25; letter-spacing:-.01em;
  max-width:var(--b-lesen); margin:0 0 var(--a7)}
.startkopf .satz{font-size:var(--t-l); max-width:var(--b-lesen);
  margin:0 0 var(--a7)}
.startkopf .klein{color:var(--gedaempft); font-size:var(--t-s);
  margin:var(--a6) 0 0}

.ergebnis{margin:var(--a8) 0 0; max-width:26rem}
.ergebnis .blatt{background:var(--flaeche); border:1px solid var(--kante);
  border-radius:var(--r-m); padding:var(--a6); box-shadow:var(--schatten-1)}
.ergebnis .kopfzeile{margin:0 0 var(--a5); font-size:var(--t-s);
  letter-spacing:.04em; text-transform:uppercase;
  color:var(--gedaempft)}
.ergebnis table{width:100%; border-collapse:collapse; margin:0}
.ergebnis th{text-align:left; font-weight:400; color:var(--gedaempft);
  padding:var(--a2) 0; border-bottom:0; text-transform:none;
  letter-spacing:0; font-size:var(--t-m)}
.ergebnis td{text-align:right; font-weight:600; border-bottom:0;
  font-variant-numeric:lining-nums tabular-nums; padding:var(--a2) 0}
.ergebnis tr:last-child th,.ergebnis tr:last-child td{
  border-top:1px solid var(--linie-fein); padding-top:var(--a4)}
.ergebnis .fertig{margin:var(--a5) 0 0; font-size:var(--t-s);
  display:flex; gap:var(--a3); align-items:center}
.ergebnis .haken{flex:0 0 auto; width:16px; height:16px;
  border-radius:var(--radius-rund); background:var(--akzent-100);
  border:2px solid var(--akzent-500)}
.ergebnis figcaption{margin:var(--a4) 0 0; font-size:var(--t-xs);
  color:var(--gedaempft)}

.ruf{display:flex; flex-wrap:wrap; align-items:center;
  gap:var(--a5); margin:var(--a6) 0 0}
.ruf .textlink{color:var(--tinte); text-decoration:none;
  border-bottom:1px solid var(--linie); padding-bottom:var(--a1)}
.ruf .textlink:hover{border-bottom-color:var(--tinte)}

.fallgitter{display:grid; gap:var(--a5); margin-top:var(--a7);
  grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){
  .fallgitter{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .fallgitter{grid-template-columns:minmax(0,1fr)}}
.fall-karte{display:flex; flex-direction:column; gap:var(--a4);
  justify-content:space-between; text-decoration:none; color:inherit}
.fall-karte .fall{margin:0; font-size:var(--t-m); line-height:1.35}
.fall-karte .textlink{color:var(--gedaempft); font-size:var(--t-s)}
.fall-karte:hover{border-color:var(--gedaempft)}
.fall-karte:hover .textlink{color:var(--tinte)}

.lage-karte{display:flex; flex-direction:column; color:inherit}
.lage-karte h3{margin:0 0 var(--a3)}
.lage-karte p{margin:0; color:var(--gedaempft)}
.lage-karte .ruf{margin:var(--a5) 0 0}
.lage-karte .lage-tuer{margin:var(--a5) 0 0; margin-top:auto;
  padding-top:var(--a4); border-top:1px solid var(--linie-fein);
  font-size:var(--t-s)}
.lage-karte .lage-tuer a{color:var(--tinte); text-decoration:none;
  border-bottom:1px solid var(--linie)}
.lage-karte .lage-tuer a:hover{border-bottom-color:var(--tinte)}

.fallwege{list-style:none; margin:var(--a6) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));
  gap:var(--a4)}
.fallwege > li > a{display:block; color:inherit; text-decoration:none;
  padding:var(--a4) var(--a5); border:1px solid var(--linie);
  border-radius:var(--radius-gross); background:var(--flaeche)}
.fallwege > li > a:hover{border-color:var(--tinte)}
.fallwege b{display:block}
.fallwege span{display:block; margin-top:var(--a2);
  color:var(--gedaempft); font-size:var(--t-s)}

#tuer-eins h2 .zeile{display:block}
#tuer-eins h2{font-size:var(--t-xl); line-height:1.12; margin:0 0 var(--a5)}
#tuer-eins .satz{font-size:var(--t-l); max-width:var(--b-lesen)}

.hakenliste{list-style:none; margin:var(--a6) 0 0; padding:0;
  display:grid; gap:var(--a4)}
.hakenliste li{display:flex; align-items:flex-start; gap:var(--a4)}
.hakenliste .haken{flex:0 0 auto; width:18px; height:18px;
  margin-top:var(--a1); border-radius:var(--radius-rund);
  background:var(--akzent-100);
  border:2px solid var(--akzent-500)}
.hakenliste .dazu{color:var(--gedaempft)}

.streifen{padding:var(--a10) 0}
.streifen .innen{display:grid; gap:var(--a8);
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center}
.streifen.gedreht .streifen-bild{order:2}
.streifen.gedreht .streifen-text{order:1}
.streifen-text h2{font-size:var(--t-xl); line-height:1.15;
  margin:0 0 var(--a5)}
.streifen-text p{font-size:var(--t-l); color:var(--gedaempft);
  margin:0}
.streifen-bild img{width:100%; height:auto; display:block;
  border-radius:var(--radius-gross); box-shadow:var(--schatten)}

.wandliste{list-style:none; margin:0; padding:0; display:grid;
  gap:var(--a5)}
.wandliste a{text-decoration:none; color:inherit}
.wandliste a:hover b{text-decoration:underline}

.offenliste{margin:var(--a6) 0 0; padding-left:var(--a6);
  color:var(--gedaempft); display:grid; gap:var(--a3)}



.schritt.ruht,.schritt.ruht *{color:var(--gedaempft)}
.schritt.ruht .nr{background:var(--flaeche-2); color:var(--gedaempft);
  border-color:var(--linie)}

.ampel{padding:var(--a5) var(--a6); border-radius:var(--radius);
  margin:var(--a6) 0; font-weight:600; border:1px solid var(--linie)}
.ampel.gruen{background:var(--gut-flaeche); color:var(--gut);
  border-color:var(--gut-linie)}
.ampel.rot{background:var(--fehler-flaeche); color:var(--fehler);
  border-color:var(--fehler-linie)}

.feld{display:grid; gap:var(--a3); margin:var(--a5) 0;
  max-width:var(--b-lesen)}
.feld label{font-weight:500}

#lagen,#tuer-eins,#wand,#ehrlich,#preis{padding:var(--a10) 0}
.karte#ehrlich{padding:var(--a7)}
.grenzliste li.listenpunkt{margin:var(--a4) 0}
.grenzliste li.listenpunkt strong{display:block}

@media (max-width:900px){
  .tuergitter{grid-template-columns:minmax(0,1fr)}
  .streifen .innen{grid-template-columns:minmax(0,1fr); gap:var(--a6)}
  .streifen.gedreht .streifen-bild{order:0}
  .streifen.gedreht .streifen-text{order:0}
  .streifen{padding:var(--a8) 0}
  #lagen,#tuer-eins,#wand,#ehrlich,#preis{padding:var(--a8) 0}
  .karte#ehrlich{padding:var(--a5)}
}
@media (max-width:640px){
  .startkopf h1{font-size:var(--t-xl)}
  .startkopf .satz,.streifen-text p,#tuer-eins .satz{font-size:var(--t-m)}
  .ruf{gap:var(--a4)}
  .ruf .knopf{width:100%; text-align:center}
}


.abpreis{margin:var(--a4) 0 0; color:var(--gedaempft);
  font-size:var(--t-m)}
.abpreis b{color:var(--tinte); font-weight:600}

ol.kette{list-style:none; margin:var(--a6) 0 0; padding:0;
  display:grid; gap:var(--a3);
  grid-template-columns:repeat(3, minmax(0, 1fr))}
ol.kette .glied{display:flex; align-items:baseline; gap:var(--a4);
  padding:var(--a4) var(--a5); border:1px solid var(--linie);
  border-radius:var(--radius); background:var(--flaeche)}
ol.kette .nr{flex:0 0 auto; color:var(--gedaempft);
  font-variant-numeric:tabular-nums; font-size:var(--t-s)}
ol.kette .was{font-weight:500}

.staffel{margin:var(--a5) 0 0; color:var(--gedaempft)}
.mwst{margin:var(--a4) 0 0; color:var(--gedaempft);
  font-size:var(--t-s)}
.zusagen{display:flex; flex-wrap:wrap; gap:var(--a4) var(--a6);
  margin:var(--a4) 0 0; color:var(--gedaempft); font-size:var(--t-s)}
.zusagen span::before{content:"¹3"; margin-right:var(--a2)}

.takt{display:flex; align-items:center; gap:var(--a5);
  flex-wrap:wrap; margin:0 0 var(--a6)}
.taktschalter{display:inline-flex; padding:var(--a1);
  border:1px solid var(--linie); border-radius:var(--radius);
  background:var(--flaeche)}
.taktschalter button{border:0; background:transparent; cursor:pointer;
  padding:var(--a3) var(--a5); border-radius:var(--radius-klein);
  font:inherit; font-size:var(--t-s); color:var(--gedaempft)}
.taktschalter button[aria-pressed="true"]{background:var(--sanft);
  color:var(--tinte); font-weight:600}
.taktnote{color:var(--gedaempft); font-size:var(--t-s)}

.nachweispaar{display:grid; gap:var(--a5);
  grid-template-columns:repeat(2, minmax(0, 1fr)); margin-top:var(--a6)}
.nachweis{padding:var(--a6); border:1px solid var(--linie);
  border-radius:var(--radius); background:var(--flaeche)}
.nachweis h3{margin:0 0 var(--a3)}
.nachweis .satz{margin:0; color:var(--gedaempft)}

.fragengruppe{margin:var(--a7) 0 var(--a4); font-size:var(--t-m);
  color:var(--gedaempft); text-transform:none}
.fragengruppe:first-child{margin-top:0}
.fragen .frage{border-bottom:1px solid var(--linie)}
.fragen .frage summary{cursor:pointer; padding:var(--a4) 0;
  font-weight:500}
.fragen .frage p{margin:0 0 var(--a5); max-width:var(--b-lesen);
  color:var(--gedaempft)}

@media (max-width:900px){
  ol.kette{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .nachweispaar{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  ol.kette{grid-template-columns:minmax(0,1fr)}
}

.paketstart{margin:var(--a4) 0 0}
.paketknopf{display:inline-block; width:100%; box-sizing:border-box;
  text-align:center; padding:var(--a3) var(--a4);
  border-radius:var(--r-m); background:var(--knopf);
  color:var(--auf-knopf); font-weight:600; text-decoration:none;
  transition:background .15s ease, box-shadow .15s ease}
.paketknopf.zweit{background:var(--flaeche); color:var(--knopf-zweit);
  box-shadow:inset 0 0 0 1.5px var(--knopf-zweit)}
.paketknopf:hover,.paketknopf:focus-visible{text-decoration:none}
.pk:hover .paketknopf.zweit{background:var(--knopf);
  color:var(--auf-knopf); box-shadow:none}
@media (prefers-reduced-motion:reduce){
  .paketknopf{transition:none}
}
@media (max-width:760px){
  td.zahl,th.zahl,td.num,th.num,td.wieviel{white-space:nowrap}
  :is(.rollbar,.tabelle-rahmen,.rahmen) :is(td,th){min-width:7rem}
}