:root{
  color-scheme:light dark;
  
  --sans:-apple-system,BlinkMacSystemFont,'Inter','Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;
  
  
  --rad-klein:10px; --rad-knopf:12px; --rad-feld:14px; --rad:18px; --rad-gross:22px;
  
  --rad-pille:99px;
  --gitter:32px;
  --breite:76rem;
  
  --hoehe-feld:52px;
  --hoehe-knopf:46px;
  
  --satzbreite:42rem;
  
  --klebehoehe:60px;

  
  --luft-eng:1.25rem;
  --luft-block:calc(var(--luft-eng) * 2);
  --luft-abschnitt:calc(var(--luft-eng) * 3.6);

  
  --takt:.16s;
  --takt-weit:calc(var(--takt) * 1.5);
  --kurve:cubic-bezier(.2,.8,.2,1);

  
  --satz-etikett:.8125rem/1.35;
  --satz-klein:.8125rem/1.5;
  --satz-beleg:.8125rem/1.55;
  --satz-bedienung:.875rem/1.45;
  --satz-feld:.9375rem/1.5;
  --satz-zeile:.9375rem/1.45;
  --satz-text:1.0625rem/1.62;
  --satz-titel:1.375rem/1.3;
  --satz-anriss:1.25rem/1.55;
  --satz-wert:1.35rem/1.15;
  --satz-zahl:2.5rem/1.05;

  
  --schatten:0 1px 2px var(--schatten1),0 8px 24px -12px var(--schatten2);
  --schatten-hoch:0 2px 4px var(--schatten1),0 14px 30px -14px var(--schatten2);
  --schatten-leucht:0 0 0 4px var(--leucht);

  --ring:0 0 0 1px var(--linie);
  --ring-kontur:0 0 0 1px var(--kontur);
  --ring-kante:0 0 0 1px var(--kante);
}
:root{--grund:light-dark(oklch(100% 0 0),oklch(0% 0 0));--flaeche:light-dark(oklch(100% 0 0),oklch(19.21% 0.004 286));--flaeche2:light-dark(oklch(97.07% 0.0027 286.4),oklch(24.05% 0.0057 286));--tinte:light-dark(oklch(23.16% 0.0038 286.1),oklch(97.07% 0.0027 286.4));--tinte2:light-dark(oklch(45.85% 0.008 286.1),oklch(77.21% 0.0098 286.2));--gedaempft:light-dark(oklch(52.63% 0.0093 286.1),oklch(70.83% 0.0115 286.1));--linie:light-dark(oklch(86.52% 0.0068 286.3),oklch(30.32% 0.0089 285.9));--linie2:light-dark(oklch(83.12% 0.0069 286.2),oklch(36.23% 0.0102 285.9));--kontur:light-dark(oklch(63.53% 0.0089 286.1),oklch(59.57% 0.012 286));--kante:light-dark(oklch(48.62% 0.0827 200.4),oklch(79.13% 0.1025 199.3));--kante2:light-dark(oklch(95.67% 0.0148 196.9),oklch(26.41% 0.0346 201.5));--warn:light-dark(oklch(48.27% 0.1115 61.6),oklch(77.21% 0.1456 69.2));--warn2:light-dark(oklch(96.85% 0.0203 74.7),oklch(25.45% 0.046 80.8));--ruhe:light-dark(oklch(63.53% 0.0089 286.1),oklch(59.57% 0.012 286));--raster:light-dark(oklch(93.24% 0.0067 286.3),oklch(27.07% 0.0092 285.8));--leucht:light-dark(oklch(48.62% 0.0827 200.4 / .16),oklch(79.13% 0.1025 199.3 / .22));--glas:light-dark(oklch(100% 0 0 / .82),oklch(19.21% 0.004 286 / .82));--auf:light-dark(oklch(100% 0 0),oklch(24.89% 0.0425 205.1));--schatten1:light-dark(oklch(23.16% 0.0038 286.1 / .05),oklch(0% 0 0 / .5));--schatten2:light-dark(oklch(23.16% 0.0038 286.1 / .1),oklch(0% 0 0 / .66));}@supports not (color:light-dark(#fff,#000)){:root{--grund:oklch(100% 0 0);--flaeche:oklch(100% 0 0);--flaeche2:oklch(97.07% 0.0027 286.4);--tinte:oklch(23.16% 0.0038 286.1);--tinte2:oklch(45.85% 0.008 286.1);--gedaempft:oklch(52.63% 0.0093 286.1);--linie:oklch(86.52% 0.0068 286.3);--linie2:oklch(83.12% 0.0069 286.2);--kontur:oklch(63.53% 0.0089 286.1);--kante:oklch(48.62% 0.0827 200.4);--kante2:oklch(95.67% 0.0148 196.9);--warn:oklch(48.27% 0.1115 61.6);--warn2:oklch(96.85% 0.0203 74.7);--ruhe:oklch(63.53% 0.0089 286.1);--raster:oklch(93.24% 0.0067 286.3);--leucht:oklch(48.62% 0.0827 200.4 / .16);--glas:oklch(100% 0 0 / .82);--auf:oklch(100% 0 0);--schatten1:oklch(23.16% 0.0038 286.1 / .05);--schatten2:oklch(23.16% 0.0038 286.1 / .1);}@media(prefers-color-scheme:dark){:root{--grund:oklch(0% 0 0);--flaeche:oklch(19.21% 0.004 286);--flaeche2:oklch(24.05% 0.0057 286);--tinte:oklch(97.07% 0.0027 286.4);--tinte2:oklch(77.21% 0.0098 286.2);--gedaempft:oklch(70.83% 0.0115 286.1);--linie:oklch(30.32% 0.0089 285.9);--linie2:oklch(36.23% 0.0102 285.9);--kontur:oklch(59.57% 0.012 286);--kante:oklch(79.13% 0.1025 199.3);--kante2:oklch(26.41% 0.0346 201.5);--warn:oklch(77.21% 0.1456 69.2);--warn2:oklch(25.45% 0.046 80.8);--ruhe:oklch(59.57% 0.012 286);--raster:oklch(27.07% 0.0092 285.8);--leucht:oklch(79.13% 0.1025 199.3 / .22);--glas:oklch(19.21% 0.004 286 / .82);--auf:oklch(24.89% 0.0425 205.1);--schatten1:oklch(0% 0 0 / .5);--schatten2:oklch(0% 0 0 / .66);}}}@media(prefers-contrast:more){:root{--grund:light-dark(oklch(100% 0 0),oklch(0% 0 0));--flaeche:light-dark(oklch(100% 0 0),oklch(19.21% 0.004 286));--flaeche2:light-dark(oklch(97.07% 0.0027 286.4),oklch(24.05% 0.0057 286));--tinte:light-dark(oklch(0% 0 0),oklch(100% 0 0));--tinte2:light-dark(oklch(35.03% 0.0086 285.9),oklch(86.55% 0.0082 286.2));--gedaempft:light-dark(oklch(41.13% 0.0099 286),oklch(81.62% 0.0097 286.2));--linie:light-dark(oklch(75.9% 0.0085 286.2),oklch(41.17% 0.0116 285.9));--linie2:light-dark(oklch(68.81% 0.0087 286.2),oklch(47.76% 0.0127 285.9));--kontur:light-dark(oklch(52.63% 0.0093 286.1),oklch(69.53% 0.0116 286.1));--kante:light-dark(oklch(41.2% 0.07 200.3),oklch(85.89% 0.085 199.4));--kante2:light-dark(oklch(95.67% 0.0148 196.9),oklch(26.41% 0.0346 201.5));--warn:light-dark(oklch(41.5% 0.0948 62.9),oklch(85.7% 0.1203 74.1));--warn2:light-dark(oklch(96.85% 0.0203 74.7),oklch(25.45% 0.046 80.8));--ruhe:light-dark(oklch(52.63% 0.0093 286.1),oklch(69.53% 0.0116 286.1));--raster:light-dark(oklch(83.8% 0.0096 286.2),oklch(35.88% 0.012 285.8));--leucht:light-dark(oklch(48.62% 0.0827 200.4 / .16),oklch(79.13% 0.1025 199.3 / .22));--glas:light-dark(oklch(100% 0 0 / .82),oklch(19.21% 0.004 286 / .82));--auf:light-dark(oklch(100% 0 0),oklch(24.89% 0.0425 205.1));--schatten1:light-dark(oklch(23.16% 0.0038 286.1 / .05),oklch(0% 0 0 / .5));--schatten2:light-dark(oklch(23.16% 0.0038 286.1 / .1),oklch(0% 0 0 / .66));}}@supports not (color:light-dark(#fff,#000)){@media(prefers-contrast:more){:root{--grund:oklch(100% 0 0);--flaeche:oklch(100% 0 0);--flaeche2:oklch(97.07% 0.0027 286.4);--tinte:oklch(0% 0 0);--tinte2:oklch(35.03% 0.0086 285.9);--gedaempft:oklch(41.13% 0.0099 286);--linie:oklch(75.9% 0.0085 286.2);--linie2:oklch(68.81% 0.0087 286.2);--kontur:oklch(52.63% 0.0093 286.1);--kante:oklch(41.2% 0.07 200.3);--kante2:oklch(95.67% 0.0148 196.9);--warn:oklch(41.5% 0.0948 62.9);--warn2:oklch(96.85% 0.0203 74.7);--ruhe:oklch(52.63% 0.0093 286.1);--raster:oklch(83.8% 0.0096 286.2);--leucht:oklch(48.62% 0.0827 200.4 / .16);--glas:oklch(100% 0 0 / .82);--auf:oklch(100% 0 0);--schatten1:oklch(23.16% 0.0038 286.1 / .05);--schatten2:oklch(23.16% 0.0038 286.1 / .1);}@media(prefers-color-scheme:dark){:root{--grund:oklch(0% 0 0);--flaeche:oklch(19.21% 0.004 286);--flaeche2:oklch(24.05% 0.0057 286);--tinte:oklch(100% 0 0);--tinte2:oklch(86.55% 0.0082 286.2);--gedaempft:oklch(81.62% 0.0097 286.2);--linie:oklch(41.17% 0.0116 285.9);--linie2:oklch(47.76% 0.0127 285.9);--kontur:oklch(69.53% 0.0116 286.1);--kante:oklch(85.89% 0.085 199.4);--kante2:oklch(26.41% 0.0346 201.5);--warn:oklch(85.7% 0.1203 74.1);--warn2:oklch(25.45% 0.046 80.8);--ruhe:oklch(69.53% 0.0116 286.1);--raster:oklch(35.88% 0.012 285.8);--leucht:oklch(79.13% 0.1025 199.3 / .22);--glas:oklch(19.21% 0.004 286 / .82);--auf:oklch(24.89% 0.0425 205.1);--schatten1:oklch(0% 0 0 / .5);--schatten2:oklch(0% 0 0 / .66);}}}}


*{box-sizing:border-box}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;
scroll-padding-top:calc(var(--klebehoehe) + .9rem)}
:target{scroll-margin-top:calc(var(--klebehoehe) + .9rem)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--grund);color:var(--tinte);
font:1rem/1.55 var(--sans);text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column;
scrollbar-color:var(--linie2) transparent;scrollbar-width:thin}



main{max-width:var(--breite);width:100%;margin:0 auto;padding:2.75rem 1.5rem 6rem;flex:1}
::selection{background:var(--kante);color:var(--auf)}
a{color:var(--kante);text-underline-offset:.18em;text-decoration-thickness:1px}


.sprungmarke{position:absolute;left:-9999px;top:0;z-index:40;
display:inline-flex;align-items:center;min-height:44px;padding:0 1.1rem;
background:var(--flaeche);color:var(--kante);font:600 var(--satz-bedienung) var(--sans);
text-decoration:none;border-radius:0 0 var(--rad) 0;
box-shadow:var(--ring-kante),var(--schatten)}
.sprungmarke:focus{left:0}


:focus-visible{outline:2px solid transparent;outline-offset:2px;border-radius:3px;
box-shadow:0 0 0 2px var(--flaeche),0 0 0 4px var(--kante)}


header{position:sticky;top:0;z-index:20;background:var(--glas);
-webkit-backdrop-filter:saturate(1.5) blur(20px);backdrop-filter:saturate(1.5) blur(20px);
box-shadow:0 1px 0 0 var(--linie)}

@supports(animation-timeline:scroll()){
  @media(prefers-reduced-motion:no-preference){
    .kopf{animation:kopfschrumpf linear both;
    animation-timeline:scroll();animation-range:0 160px}
  }
}
@keyframes kopfschrumpf{to{padding-top:.35rem;padding-bottom:.35rem}}


.kopf{max-width:var(--breite);margin:0 auto;padding:.55rem 1.5rem;display:flex;
flex-wrap:wrap;align-items:center;gap:.45rem 1.2rem;min-height:60px}
.menueknopf{display:none}
.menuekopf{display:none}

.marke{display:inline-flex;align-items:center;text-decoration:none;
color:var(--tinte);font-family:var(--sans);font-size:1.12rem;font-weight:600;
letter-spacing:-.03em;line-height:1}

.marke .signet{color:var(--kante);flex:none;margin-right:.5rem;
transition:transform var(--takt-weit) var(--kurve)}
.signet-ring{stroke-dasharray:47;stroke-dashoffset:0;
animation:signetkreis 1.15s var(--kurve) 1}
.signet-achse{stroke-dasharray:6;stroke-dashoffset:0;
animation:signetachse .85s var(--kurve) 1}
.signet-kern{r:1.9px;animation:signetkern .7s var(--kurve) 1}
@keyframes signetkreis{from{stroke-dashoffset:47}}
@keyframes signetachse{from{stroke-dashoffset:6}}
@keyframes signetkern{from{r:.8px}}
.marke b{font-weight:700}
.marke span{color:var(--gedaempft);font-weight:400}




.kopf nav[popover]{position:static;inset:auto;width:auto;height:auto;margin:0;
padding:0;display:flex;flex-wrap:wrap;gap:0 .2rem;overflow:visible;
border:0;border-radius:0;background:transparent;color:inherit;box-shadow:none;
font:400 var(--satz-feld) var(--sans)}
.kopf nav a{position:relative;display:inline-flex;align-items:center;min-height:40px;
gap:.38rem;padding:0 .7rem;color:var(--tinte2);text-decoration:none;white-space:nowrap;
border-radius:var(--rad-knopf);
transition:color var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}
.kopf nav a[aria-current]{color:var(--tinte);font-weight:600}

.kopf nav a.marke{margin-right:1.1rem;padding-left:.15rem;background:transparent}


.kopfsuche{position:relative;display:flex;align-items:center;margin:0 0 0 auto;padding:0 .25rem 0 0;
background:var(--flaeche);box-shadow:var(--ring-kontur),var(--schatten);
border-radius:var(--rad-pille);
transition:box-shadow var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}
.kopfsuche:focus-within{box-shadow:0 0 0 2px var(--flaeche),0 0 0 4px var(--kante),var(--schatten)}
.kopfsuche input[type=search]{min-width:13rem;max-width:20rem;min-height:38px;
font:400 var(--satz-bedienung) var(--sans);color:var(--tinte);
padding:.4rem .8rem .4rem 2rem;
border:0;border-radius:var(--rad-pille) 0 0 var(--rad-pille);background-color:transparent;
box-shadow:none;
transition:box-shadow var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}

.kopfsuche::before,.kopfsuche::after{content:"";position:absolute;pointer-events:none;
border:0 solid var(--tinte2)}
.kopfsuche::before{left:.66rem;top:50%;width:8px;height:8px;margin-top:-5px;
border-width:1.5px;border-radius:50%}
.kopfsuche::after{left:calc(.66rem + 9px);top:50%;width:5px;height:0;margin-top:3.5px;
border-top-width:1.5px;border-radius:1px;transform:rotate(45deg);transform-origin:0 0}
.kopfsuche input[type=search]:focus,.kopfsuche input[type=search]:focus-visible{background-color:transparent;
box-shadow:none;outline:0}
.kopfsuche button{display:grid;place-items:center;flex:none;width:32px;min-height:32px;
margin:0;padding:0;border:0;border-radius:var(--rad-pille);background:var(--kante2);
color:var(--kante);box-shadow:none;filter:none;transform:none;
font:650 var(--satz-bedienung) var(--mono)}
.nurvorleser{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);
white-space:nowrap}

.kopfsuche input[type=search]::placeholder{color:var(--gedaempft);opacity:1}







h1{font-family:var(--sans);font-size:clamp(2.4rem,1.55rem + 2.4vw,3.5rem);
font-weight:700;letter-spacing:-.03em;line-height:1.08;margin:0 0 .8rem;max-width:20ch;
overflow-wrap:anywhere;text-wrap:balance;color:var(--tinte)}
h2{font-family:var(--sans);font-size:clamp(1.6rem,1.2rem + 1.3vw,2.25rem);
font-weight:660;letter-spacing:-.025em;line-height:1.2;color:var(--tinte);
margin:var(--luft-abschnitt) 0 var(--luft-eng);max-width:24ch;text-wrap:balance}

h3{font:640 var(--satz-titel) var(--sans);letter-spacing:-.018em;color:var(--tinte);
margin:var(--luft-block) 0 .5rem}

p{margin:0 0 1rem;max-width:var(--satzbreite);font:var(--satz-text) var(--sans);
color:var(--tinte2);text-wrap:pretty}
ul{padding-left:1.15rem;max-width:var(--satzbreite)}
li{margin-bottom:.4rem;color:var(--tinte2)}
strong{font-weight:640;color:var(--tinte)}
.anriss{font:var(--satz-anriss) var(--sans);max-width:36rem;margin-bottom:0;
color:var(--tinte2)}


.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr));
gap:1rem;margin-top:.35rem}
.kachel{position:relative;display:flex;flex-direction:column;overflow:hidden;
background:var(--flaeche);border-radius:var(--rad);
box-shadow:var(--ring),var(--schatten);padding:1.3rem 1.35rem 1.4rem;
text-decoration:none;color:inherit;
transition:box-shadow var(--takt) var(--kurve),transform var(--takt-weit) var(--kurve)}
.kachel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
background:var(--kante);transform:scaleY(0);transform-origin:top;
transition:transform var(--takt-weit) var(--kurve)}

.kachel-wort{font:650 var(--satz-etikett) var(--sans);letter-spacing:.09em;
text-transform:uppercase;color:var(--gedaempft);text-wrap:balance;
overflow-wrap:anywhere;margin-bottom:.5rem}

.kachel-zahl{font:700 var(--satz-zahl) var(--sans);letter-spacing:-.04em;
color:var(--tinte);font-variant-numeric:tabular-nums;
margin:auto 0 .15rem}
.kachel-einheit{font:400 var(--satz-klein) var(--sans);color:var(--gedaempft)}

.kachel:has(.kachel-vorbereitung){background:transparent;box-shadow:none;
outline:1px dashed var(--linie2);outline-offset:-1px}
.kachel:has(.kachel-vorbereitung) .kachel-zahl{font:600 var(--satz-wert) var(--mono);
color:var(--gedaempft);margin-bottom:.35rem}
.kachel-datum{font:1rem/1.3 var(--mono);color:var(--tinte);
font-variant-numeric:tabular-nums;margin-top:.6rem}
.kachel-ruhig{background:transparent;box-shadow:none;
outline:1px dashed var(--linie2);outline-offset:-1px}

.kachel-titel{font:650 var(--satz-titel) var(--sans);color:var(--tinte);
letter-spacing:-.012em;margin:.5rem 0 .3rem;text-wrap:balance}


.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
min-height:var(--hoehe-knopf);padding:0 1.1rem;border-radius:var(--rad-knopf);
font:650 var(--satz-bedienung) var(--sans);letter-spacing:.01em;
color:var(--tinte);text-decoration:none;background:var(--flaeche2);
transition:background-color var(--takt) var(--kurve),filter var(--takt) var(--kurve)}
.knopf-haupt{background:var(--kante);color:var(--auf);box-shadow:var(--ring-kante)}
@media(hover:hover){
  .knopf:hover{background:var(--kante2)}
  .knopf-haupt:hover{background:var(--kante);filter:brightness(.92)}
}


a.kachel::after{content:"→";position:absolute;top:1rem;right:1.15rem;
color:var(--kontur);font-size:.9rem;
transition:color var(--takt) var(--kurve),transform var(--takt-weit) var(--kurve)}

@media(hover:hover){
  
  a.kachel:hover{box-shadow:0 0 0 1px color-mix(in oklab,var(--kante) 45%,var(--linie)),
  var(--schatten-hoch),var(--schatten-leucht);
  transform:translateY(-2px)}
  a.kachel:hover::before{transform:scaleY(1)}
  a.kachel:hover::after{color:var(--kante);transform:translateX(3px)}
}


.kennzahl{display:flex;align-items:baseline;gap:.45rem;
font-variant-numeric:tabular-nums}
.kennzahl .wert{font:650 var(--satz-wert) var(--sans);color:var(--tinte);
letter-spacing:-.02em}
.kennzahl .einheit{font:400 var(--satz-klein) var(--sans);color:var(--gedaempft)}

.kennzahl .unerhoben{font:400 var(--satz-zeile) var(--sans);color:var(--gedaempft);
font-style:italic}


@property --dreh{syntax:"<angle>";inherits:false;initial-value:0deg}
.konsole{position:relative;margin:0 0 var(--luft-block);border-radius:var(--rad-gross);
border:1px solid transparent;
background:linear-gradient(var(--flaeche),var(--flaeche)) padding-box,
conic-gradient(from var(--dreh),var(--linie) 0 62%,var(--kante) 78%,var(--linie) 92%) border-box;
box-shadow:var(--schatten);overflow:hidden;animation:dreh 9s linear infinite}
@keyframes dreh{to{--dreh:360deg}}
.konsole-kopf{display:flex;align-items:center;gap:.5rem;padding:.5rem .85rem;
box-shadow:0 1px 0 0 var(--linie);background:var(--flaeche2);
font:.75rem/1 var(--mono);color:var(--gedaempft);letter-spacing:.02em}
.konsole-kopf::before{content:"";width:9px;height:9px;border-radius:50%;
background:var(--ruhe);box-shadow:14px 0 0 var(--ruhe),28px 0 0 var(--kante);
margin-right:2.2rem;flex:none}
.konsole-leib{padding:1.05rem 1.15rem;font:400 .86rem/1.75 var(--mono);
font-variant-ligatures:none;color:var(--tinte2);overflow-x:auto}

@supports((mask-image:linear-gradient(#000,#000)) or (-webkit-mask-image:linear-gradient(#000,#000))){
  .konsole-leib{
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 1.6rem),transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 1.6rem),transparent 100%)}
}
.konsole-leib b{color:var(--tinte);font-weight:600}
.konsole-zeile{display:block;white-space:pre}
.konsole-zeile.eingabe::before{content:"$ ";color:var(--kante);font-weight:700}

.konsole-zeile.ausgabe{white-space:pre-wrap;padding-left:1.6ch;text-indent:-1.6ch}
.konsole-zeile.ausgabe::before{content:"› ";color:var(--gedaempft)}

.tippen{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:bottom;
width:var(--zeichen);animation:tippen 1.9s steps(40,end) both}
@keyframes tippen{from{width:0}}
.zeiger{display:inline-block;width:.55ch;height:1.05em;vertical-align:-.16em;
background:var(--kante);margin-left:.15ch;animation:blinken 1.05s step-end infinite}
@keyframes blinken{50%{opacity:0}}



@property --anteil{syntax:"<percentage>";inherits:true;initial-value:0%}
.balken{display:block;height:6px;border-radius:var(--rad-pille);background:var(--flaeche2);
box-shadow:var(--ring);overflow:hidden;margin:.4rem 0 0}
.balken::before{content:"";display:block;height:100%;width:var(--anteil,0%);
background:linear-gradient(90deg,color-mix(in oklab,var(--kante) 65%,transparent),var(--kante));
border-radius:var(--rad-pille);animation:fuellen .9s var(--kurve) both}

.balken[data-besetzt]::before{min-width:2px}
@keyframes fuellen{from{width:0}}
.balken-warn::before{background:linear-gradient(90deg,
color-mix(in oklab,var(--warn) 65%,transparent),var(--warn))}
.verteilung{list-style:none;padding:0;margin:0;max-width:none;display:grid;gap:.8rem}
.verteilung li{margin:0}
.verteilung .zeile{display:flex;justify-content:space-between;align-items:baseline;
gap:1rem;font:400 var(--satz-feld) var(--sans)}
.verteilung .zeile a{color:var(--tinte);text-decoration:none;font-weight:500}
.verteilung .wert{font:400 var(--satz-klein) var(--mono);
font-variant-numeric:tabular-nums;color:var(--gedaempft);white-space:nowrap}

@media(hover:hover){
  .verteilung .zeile a:hover{color:var(--kante);text-decoration:underline}
}


.datenbild{display:block;flex:none;overflow:visible}
.datenbild .rest{fill:var(--linie)}
.datenbild .belegt{fill:var(--kante)}
.datenbild .spur{fill:none;stroke:var(--linie);stroke-width:2}
.datenbild .spur-belegt{fill:none;stroke:var(--kante);stroke-width:2;
stroke-linecap:round}

.datenbild circle.spur-belegt{stroke-dashoffset:0;
animation:ringfuellen .9s var(--kurve) both}
@keyframes ringfuellen{from{stroke-dashoffset:var(--bogen)}}

.datenbild.verlauf .spur-belegt{stroke-linejoin:round}
.datenbild .flaeche-belegt{fill:color-mix(in oklab,var(--kante) 22%,transparent)}
.datenbild .flaeche-rest{fill:var(--flaeche2)}

.datenzeile{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.datenzeile .datenbild{order:2}
.datenzeile .zahl{font:400 var(--satz-beleg) var(--mono);
font-variant-numeric:tabular-nums;color:var(--gedaempft)}


table{display:block;width:100%;background:var(--flaeche);
border-radius:var(--rad);box-shadow:var(--ring),var(--schatten);
font:400 var(--satz-zeile) var(--sans);overflow:hidden}
tbody,tr,th,td{display:block}
tr{position:relative;padding:.62rem 1.05rem .68rem;box-shadow:0 1px 0 0 var(--linie);
transition:background-color var(--takt) var(--kurve)}
tr:last-child{box-shadow:none}
th{text-align:left;font-weight:600}
td{color:var(--tinte2)}
td + td{margin-top:.25rem}


th,td{overflow-wrap:anywhere}


.merkmale tr{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:0 1.75rem;
padding:1rem 1.15rem}
.merkmale th{font:500 var(--satz-beleg) var(--sans);color:var(--gedaempft);
padding-top:.1rem}
.merkmale td{font:500 var(--satz-zeile) var(--sans);color:var(--tinte);margin:0}


.strom tr{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:0 1.3rem;
padding:.74rem 1.05rem .8rem}
.strom th{font:400 .78rem/1.6 var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums;padding-top:.12rem}
.strom td{margin:0}
.strom td a{font:600 var(--satz-zeile) var(--sans);color:var(--tinte);text-decoration:none}
.strom .herkunft{display:inline-block;margin-top:.1rem}

.strom td > .herkunft{display:block}
.strom th.fortsetzung time{position:absolute;width:1px;height:1px;overflow:hidden;
clip-path:inset(50%);white-space:nowrap}
.strom tr:has(+ tr > th.fortsetzung){box-shadow:none}
.strom th.fortsetzung::before{content:"";position:absolute;left:1.05rem;top:0;bottom:0;
width:1px;background:var(--linie2)}


.vergleich{overflow-x:auto}
.vergleich table{display:table;border-collapse:separate;border-spacing:0;min-width:44rem}
.vergleich tr{display:table-row;padding:0;box-shadow:none}
.vergleich th,.vergleich td{display:table-cell;padding:.82rem .95rem;
box-shadow:0 1px 0 0 var(--linie);vertical-align:top;text-align:left}
.vergleich tr:first-child th{font:650 var(--satz-zeile) var(--sans);
box-shadow:0 1px 0 0 var(--linie2);background:var(--flaeche2)}
.vergleich tr th:first-child{position:sticky;left:0;background:var(--flaeche);
font:500 var(--satz-beleg) var(--sans);color:var(--gedaempft);min-width:13rem}
.vergleich tr:first-child th:first-child{background:var(--flaeche2)}
.vergleich td{font:400 var(--satz-zeile) var(--sans);color:var(--tinte)}
.vergleich .herkunft,.vergleich .beleg{margin-top:.45rem}

.vergleich th,.vergleich td{overflow-wrap:normal}
.vergleich .herkunft{border-left:2px solid var(--kante);padding-left:.7rem}


.regeln tr{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:0 1.6rem;
padding:.92rem 1.15rem}
.regeln th{font:400 var(--satz-beleg) var(--mono);font-variant-ligatures:none;
color:var(--kante);
word-break:break-word;padding-top:.05rem}
.regeln td{margin:0;font-size:.9375rem;line-height:1.6;color:var(--tinte2)}


.matrix{overflow-x:auto}
.matrix table{display:table;border-collapse:separate;border-spacing:0;min-width:34rem}
.matrix tr{display:table-row;padding:0;box-shadow:none}
.matrix th,.matrix td{display:table-cell;padding:.7rem .85rem;
box-shadow:0 1px 0 0 var(--linie);text-align:right;vertical-align:middle}
.matrix tr:first-child th{background:var(--flaeche2);font:650 var(--satz-klein) var(--sans);
box-shadow:0 1px 0 0 var(--linie2)}
.matrix tr th:first-child{text-align:left;font:500 var(--satz-beleg) var(--sans);
color:var(--gedaempft);background:var(--flaeche);position:sticky;left:0}
.matrix td{font:400 var(--satz-feld) var(--mono);font-variant-numeric:tabular-nums;
color:var(--tinte);
background:color-mix(in oklab,var(--kante) calc(var(--anteil,0%) * .34),transparent)}
.matrix td a{color:inherit;text-decoration:none;display:block}

.matrix th,.matrix td{overflow-wrap:normal}


@media(hover:hover){
  tr:hover{background:var(--flaeche2)}
  .vergleich tr:hover,.matrix tr:hover{background:none}
  .strom td a:hover,.matrix td a:hover{color:var(--kante);text-decoration:underline}
}



.herkunft{font:400 var(--satz-beleg) var(--mono);
color:var(--gedaempft);letter-spacing:-.005em;word-break:break-word;
font-variant-numeric:tabular-nums;font-variant-ligatures:none}


p.herkunft{max-width:88ch;font:400 var(--satz-beleg) var(--mono);
font-variant-ligatures:none;font-variant-numeric:tabular-nums}
.merkmale .herkunft,.beleg{border-left:2px solid var(--kante);padding-left:.7rem;
margin-top:.5rem;transition:border-color var(--takt) var(--kurve),box-shadow var(--takt) var(--kurve)}
.merkmale .herkunft + .herkunft{margin-top:.25rem}
.beleg{font:400 var(--satz-beleg) var(--mono);font-variant-ligatures:none;
color:var(--gedaempft);word-break:break-word;border-left-color:var(--linie2)}


pre.ausgabe{margin:0;padding:1rem 1.15rem;background:var(--flaeche);
border-left:2px solid var(--kante);border-radius:var(--rad-klein);
box-shadow:var(--ring),var(--schatten);
font:400 .8125rem/1.6 var(--mono);font-variant-ligatures:none;
color:var(--tinte2);overflow-x:auto;white-space:pre;
-webkit-user-select:all;user-select:all}
code{font:400 var(--satz-beleg) var(--mono);font-variant-ligatures:none;
color:var(--tinte);word-break:break-word}


.eintrag{font:600 var(--satz-zeile) var(--sans);letter-spacing:-.005em}
.eintrag a{color:var(--tinte);text-decoration:none}

.eintrag[data-status]::before{content:""}
.eintrag[data-status]::before,.statuspunkt{display:inline-block;
width:.625rem;height:.625rem;border-radius:50%;background:var(--ruhe);
margin-right:.55rem;vertical-align:.02em;flex:none}


.eintrag[data-status="aktiv"]::before,.statuspunkt[data-status="aktiv"]{
background:var(--ruhe)}
.eintrag[data-status="eingestellt"]::before,.statuspunkt[data-status="eingestellt"]{
background:var(--warn);box-shadow:0 0 0 2px var(--warn2);
animation:puls 3.4s ease-out infinite}
@keyframes puls{0%{box-shadow:0 0 0 0 var(--warn2)}60%,100%{box-shadow:0 0 0 6px transparent}}
tr:has(.offene-meldung) .eintrag::before{box-shadow:0 0 0 3px var(--warn2)}

.veraltet{font:400 var(--satz-beleg) var(--mono);font-variant-ligatures:none;
color:var(--warn);margin-top:.4rem}
.leer{color:var(--gedaempft);font-style:italic}
.leise{font:400 var(--satz-bedienung) var(--sans);color:var(--gedaempft)}
.offene-meldung{font:400 var(--satz-beleg) var(--mono);font-variant-ligatures:none;
color:var(--warn);background:var(--warn2);border-left:2px solid var(--warn);
padding:.35rem .55rem .35rem .65rem;border-radius:0 3px 3px 0;margin:.5rem 0}
.alarm{color:var(--warn);font-weight:650}
.umbruch{overflow-x:auto}


.wege{display:flex;flex-wrap:wrap;gap:.5rem;margin:var(--luft-block) 0 0;padding:0;list-style:none}
.wege li{margin:0}
.wege a{display:inline-flex;align-items:center;gap:.4rem;min-height:38px;
padding:0 .9rem;box-shadow:var(--ring);border-radius:var(--rad-pille);
background:var(--flaeche);color:var(--tinte2);text-decoration:none;
font:400 var(--satz-bedienung) var(--sans);
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve),
transform var(--takt) var(--kurve)}


.marken{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 var(--luft-eng);padding:0;list-style:none}
.marken li{margin:0}
.marken a{display:inline-flex;align-items:center;gap:.45rem;min-height:32px;
padding:0 .3rem 0 .7rem;box-shadow:var(--ring-kontur);border-radius:var(--rad-pille);
background:var(--kante2);color:var(--tinte);text-decoration:none;
font:400 var(--satz-klein) var(--mono);font-variant-ligatures:none}
.marken a::after{content:"×";display:inline-flex;align-items:center;justify-content:center;
width:20px;height:20px;border-radius:50%;background:var(--flaeche);color:var(--gedaempft);
font-size:.85rem;line-height:1}

.marken.einstiege a::after{content:"→";width:auto;height:auto;background:none;
color:var(--kontur);margin-right:.15rem}


.kurzprofil{display:flex;flex-wrap:wrap;gap:.35rem 1.6rem;
margin:0 0 var(--luft-eng);padding:0;list-style:none}
.kurzprofil li{margin:0;display:flex;flex-direction:column;gap:.05rem}
.kurzprofil b{font:640 1.35rem/1.1 var(--sans);letter-spacing:-.02em}
.kurzprofil .profilanteil{color:var(--gedaempft);font:400 var(--satz-klein) var(--sans)}
.kurzprofil .profilname{color:var(--tinte2);font:400 var(--satz-klein) var(--sans)}


@media(hover:hover){
  .eintrag a:hover{color:var(--kante);text-decoration:underline}
  .wege a:hover{box-shadow:var(--ring-kante);color:var(--kante);transform:translateY(-1px)}
  .marken a:hover::after{background:var(--warn);color:var(--auf)}
  .merkmale tr:hover .herkunft{border-left-color:var(--kante);
  box-shadow:-2px 0 6px -1px var(--leucht)}
  .merkmale tr:hover .beleg{border-left-color:var(--kontur)}
}


form{background:var(--flaeche);box-shadow:var(--ring),var(--schatten);
border-radius:var(--rad);padding:.95rem 1.05rem .4rem;margin:0 0 1.35rem;
font-family:var(--sans);

accent-color:var(--kante)}
form p{display:flex;flex-wrap:wrap;gap:.6rem .9rem;align-items:flex-end;margin:0;
max-width:none;font-family:var(--sans);font-size:inherit;line-height:inherit;color:inherit}

label{font:500 var(--satz-etikett) var(--sans);letter-spacing:.005em;
color:var(--gedaempft);display:flex;flex-direction:column;gap:.3rem}

select,input[type=text],input[type=search],input[type=number],input:not([type]){
font:400 var(--satz-feld) var(--sans);color:var(--tinte);
padding:.46rem .62rem;border:0;border-radius:var(--rad-klein);
background:var(--flaeche2);min-width:9.5rem;max-width:15rem;min-height:38px;
box-shadow:var(--ring-kontur);
transition:box-shadow var(--takt) var(--kurve)}

select{appearance:none;padding-right:1.9rem;
background-image:linear-gradient(45deg,transparent 50%,var(--tinte2) 50%),
linear-gradient(135deg,var(--tinte2) 50%,transparent 50%);
background-repeat:no-repeat;
background-position:right .95rem top 50%,right .62rem top 50%;
background-size:5px 5px,5px 5px}

@supports(field-sizing:content){
  input[type=text],input[type=search]{field-sizing:content}
}

select:focus,input:focus{box-shadow:0 0 0 2px var(--kante)}
select:focus-visible,input:focus-visible{outline:2px solid transparent;
box-shadow:0 0 0 2px var(--flaeche),0 0 0 4px var(--kante)}
button{font:650 var(--satz-bedienung) var(--sans);letter-spacing:.01em;padding:.52rem 1.2rem;
border:0;border-radius:var(--rad-klein);background:var(--kante);
box-shadow:var(--ring-kante);
color:var(--auf);cursor:pointer;margin-bottom:.6rem;min-height:38px;
transition:filter var(--takt) var(--kurve),transform var(--takt) var(--kurve),box-shadow var(--takt) var(--kurve)}
button:active{transform:translateY(0)}
.zuruecksetzen{font:400 var(--satz-klein) var(--sans);color:var(--gedaempft);text-decoration:none;
display:inline-flex;align-items:center;min-height:2.1rem;margin-bottom:.6rem}


fieldset{margin:0 0 .9rem;padding:.7rem .9rem .3rem;border:0;border-radius:var(--rad-klein);
background:var(--flaeche2);box-shadow:var(--ring);min-width:0;
transition:box-shadow var(--takt) var(--kurve)}
fieldset:has(:focus-visible){box-shadow:var(--ring-kante),var(--schatten-leucht)}
legend{font:650 var(--satz-etikett) var(--sans);letter-spacing:.09em;
text-transform:uppercase;color:var(--gedaempft);padding:0 .25rem}

.option-zahl{font-family:var(--mono);font-variant-numeric:tabular-nums;
color:var(--gedaempft)}


.umschalter{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;
padding:0 .85rem 0 .7rem;border-radius:var(--rad-pille);background:var(--flaeche);
box-shadow:var(--ring);font:500 var(--satz-bedienung) var(--sans);
color:var(--tinte2);cursor:pointer;
flex-direction:row;transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
.umschalter input{width:1.05rem;height:1.05rem;margin:0;accent-color:var(--kante)}
.umschalter:has(:checked){color:var(--kante);box-shadow:var(--ring-kante)}


@media(hover:hover){
  select:hover,input[type=text]:hover,input[type=search]:hover{box-shadow:var(--ring-kante)}
  button:hover{filter:brightness(1.08);transform:translateY(-1px);
  box-shadow:var(--ring-kante),var(--schatten-leucht)}
  .zuruecksetzen:hover{color:var(--kante);text-decoration:underline}
  .umschalter:hover{box-shadow:var(--ring-kante);color:var(--kante)}
  .aufklapp > summary:hover{color:var(--kante)}
}


nav[aria-label]{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;
margin:1.4rem 0 0;font:400 var(--satz-bedienung) var(--sans)}
nav[aria-label] a,nav[aria-label] strong{display:inline-flex;align-items:center;
justify-content:center;min-width:2.2rem;min-height:2.2rem;padding:0 .55rem;
border-radius:var(--rad-klein);text-decoration:none;font-variant-numeric:tabular-nums}
nav[aria-label] a{color:var(--tinte2);box-shadow:var(--ring-kontur);
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
nav[aria-label] strong{background:var(--kante);color:var(--auf);font-weight:650}
nav[aria-label] .herkunft{flex-basis:100%;margin:.5rem 0 0}
nav[aria-label] .auslassung{color:var(--tinte2);padding:0 .1rem}


footer{font:400 var(--satz-bedienung) var(--sans);background:var(--flaeche);
box-shadow:0 -1px 0 0 var(--linie);margin-top:3rem}


footer nav[aria-label].fussinnen{max-width:var(--breite);margin:0 auto;
padding:2rem 1.5rem 1rem;display:grid;align-items:start;
grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1.5rem 2rem;
font:400 var(--satz-bedienung) var(--sans)}

footer nav[aria-label] a{display:flex;justify-content:flex-start;box-shadow:none;
min-width:0;padding:0;border-radius:0;min-height:44px}
.fussgruppe{display:flex;flex-direction:column}

.fusstitel{margin:0 0 .35rem;font:650 var(--satz-etikett) var(--sans);
letter-spacing:.11em;text-transform:uppercase;color:var(--tinte)}
footer a{display:inline-flex;align-items:center;min-height:44px;
color:var(--gedaempft);text-decoration:none}
.fussrand{max-width:var(--breite);margin:0 auto;padding:.85rem 1.5rem 1.35rem;
box-shadow:0 -1px 0 0 var(--linie);display:flex;flex-wrap:wrap;align-items:center;
gap:.4rem 1.1rem}
.fussmarke{display:inline-flex;align-items:center;font-family:var(--mono);
font-size:.9rem;color:var(--tinte);line-height:1}
.fussmarke .signet{color:var(--kante);margin-right:.45rem;width:16px;height:16px}
.fussmarke span{color:var(--gedaempft);font-weight:400}
.fussspruch{margin:0;color:var(--gedaempft);font-family:var(--sans);
font-size:.78rem;letter-spacing:.01em;max-width:none}
.fussdatei{font:400 var(--satz-etikett) var(--mono)}
.fussdatei:first-of-type{margin-left:auto}


@media(hover:hover){
  .marke:hover .signet{transform:rotate(90deg)}
  .marke:hover b{color:var(--kante)}
  .kopf nav a:hover{color:var(--tinte);background:var(--flaeche2)}
  .kopfsuche button:hover{background:var(--kante);color:var(--auf);box-shadow:none;
  filter:none;transform:none}
  .betrieb-abschnitte a:hover{color:var(--kante);background:var(--flaeche)}
  nav[aria-label] a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
  footer a:hover{color:var(--kante);text-decoration:underline}
}


.raster{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));
gap:1rem;margin:.35rem 0 0}
.karte{position:relative;background:var(--flaeche);box-shadow:var(--ring),var(--schatten);
border-radius:var(--rad-gross);padding:1.4rem 1.45rem;
transition:box-shadow var(--takt) var(--kurve),transform var(--takt-weit) var(--kurve)}

.karte h3{margin:0 0 .45rem}
.karte p{font:var(--satz-feld) var(--sans);margin:0;
color:var(--tinte2);max-width:none}

.karte{overflow:hidden}
.karte-nr{position:absolute;top:.35rem;right:.75rem;
font:700 var(--satz-zahl) var(--mono);letter-spacing:-.04em;
color:color-mix(in oklab,var(--kante) 14%,transparent);
pointer-events:none}

.karte h3{padding-right:3.6rem}


.karte h3 a::after{content:"";position:absolute;inset:0}
.karte p a{position:relative}

@media(hover:hover){
  .karte:has(h3 a:hover){box-shadow:0 0 0 1px color-mix(in oklab,var(--kante) 45%,var(--linie)),
  var(--schatten-hoch),var(--schatten-leucht);
  transform:translateY(-2px)}
}


.band{background:var(--kante2);border-radius:var(--rad-gross);
box-shadow:var(--ring);padding:var(--luft-block);margin:var(--luft-abschnitt) 0}
.band > :first-child{margin-top:0}
.band > :last-child{margin-bottom:0}
.band .herkunft,.band .beleg,.band .leise{color:var(--tinte2)}


.aufklapp{background:var(--flaeche);box-shadow:var(--ring);border-radius:var(--rad);
margin:var(--luft-eng) 0}
.aufklapp > summary{display:flex;align-items:center;gap:.55rem;min-height:44px;
padding:0 1.05rem;cursor:pointer;font:600 var(--satz-feld) var(--sans);color:var(--tinte);
list-style:none;border-radius:var(--rad)}
.aufklapp > summary::-webkit-details-marker{display:none}
.aufklapp > summary::before{content:"";flex:none;width:0;height:0;
border-left:6px solid var(--kontur);border-top:5px solid transparent;
border-bottom:5px solid transparent;
transition:transform var(--takt-weit) var(--kurve)}
.aufklapp[open] > summary::before{transform:rotate(90deg)}
.aufklapp .anzahl{margin-left:auto;font:400 var(--satz-beleg) var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums}
.aufklapp-leib{padding:.2rem 1.05rem 1rem}

@supports(interpolate-size:allow-keywords) and (selector(::details-content)){
  .aufklapp{interpolate-size:allow-keywords}
  .aufklapp::details-content{block-size:0;overflow:hidden;
  transition:block-size var(--takt-weit) var(--kurve),content-visibility var(--takt-weit) allow-discrete;
  content-visibility:hidden}
  .aufklapp[open]::details-content{block-size:auto;content-visibility:visible}
}




.konsole{animation:dreh 1.9s linear}


@view-transition{navigation:auto}
@supports(view-transition-name:kopf){
  header{view-transition-name:kopf}
  footer{view-transition-name:fuss}
  main > h1{view-transition-name:titel}
}


@supports(view-transition-class:zeile){
  .register .eintrag a{view-transition-class:zeile}
  ::view-transition-group(.zeile){animation-duration:var(--takt-weit)}
}


@media(prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){
  animation:none}
}


@supports(animation-timeline:scroll(root block)){
  header::before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;
  background:linear-gradient(90deg,var(--kante),color-mix(in oklab,var(--kante) 35%,transparent));
  transform-origin:left;transform:scaleX(1);
  animation:lesefortschritt linear forwards;animation-timeline:scroll(root block)}
  
  body:has(.lesestand) header::before{content:none}
}


.lesestand{position:fixed;left:0;right:0;top:0;height:2px;z-index:21;
pointer-events:none;--von:0;--bis:1}
.lesestand::before{content:"";display:block;height:100%;transform-origin:left;
transform:scaleX(var(--bis,1));
background:linear-gradient(90deg,var(--kante),color-mix(in oklab,var(--kante) 35%,transparent))}
@supports(animation-timeline:scroll(root block)){
  .lesestand::before{animation:lesefortschritt linear forwards;
  animation-timeline:scroll(root block)}
}

@keyframes lesefortschritt{from{transform:scaleX(var(--von,0))}}

@media print{.lesestand{display:none}}


.zustand{display:inline-flex;align-items:baseline;gap:.5rem}
.zustand::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;
background:var(--ruhe);transform:translateY(-1px)}
.zustand-warn::before{background:var(--warn)}

.zustand-still::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--kontur)}


.kachel-schwelle{font-size:.78rem;color:var(--gedaempft);margin-top:.45rem;
padding-top:.45rem;border-top:1px dashed var(--linie2)}


.marke-schaetzung{display:inline-block;font:600 .75rem/1.5 var(--sans);
letter-spacing:.06em;text-transform:uppercase;color:var(--warn);
background:var(--warn2);border-radius:var(--rad-pille);padding:.1rem .5rem;margin-left:.5rem;
vertical-align:.14em}


.betriebszahlen{grid-template-columns:repeat(auto-fit,minmax(11.5rem,1fr))}
.betriebszahlen .kachel-zahl{font-size:1.85rem}


.betrieb-marke{font:600 .75rem/1 var(--sans);letter-spacing:.11em;
text-transform:uppercase;color:var(--gedaempft);align-self:center}


.betrieb-erklaerung{background:var(--flaeche2);border-radius:var(--rad);
box-shadow:var(--ring);padding:1rem 1.15rem;font-size:.86rem;line-height:1.65;
color:var(--tinte2);max-width:72ch}
.betrieb-erklaerung strong{color:var(--tinte)}


.betriebstabelle.mitkopf tr:first-child{background:var(--flaeche2);
font:650 .75rem/1.5 var(--sans);letter-spacing:.06em;text-transform:uppercase;
color:var(--gedaempft)}
.betriebstabelle.mitkopf tr:first-child th{font-weight:650;color:var(--gedaempft)}
.betriebstabelle.mitkopf tr:first-child td{color:var(--gedaempft)}


@media(min-width:52rem){
  .betriebstabelle tr{display:grid;grid-template-columns:14rem minmax(0,1fr);
  gap:0 1.5rem;align-items:baseline}
  .betriebstabelle.spalten3 tr{grid-template-columns:14rem minmax(0,1fr) 12rem}
  .betriebstabelle.spalten5 tr{grid-template-columns:12rem 7rem 9rem minmax(0,1fr) 9rem}
  .betriebstabelle td + td{margin-top:0}
}


.betrieb-abschnitte{background:var(--flaeche2);box-shadow:0 1px 0 0 var(--linie)}
.betrieb-abschnitte nav{max-width:var(--breite);margin:0 auto;padding:.3rem 1.5rem;
display:flex;flex-wrap:wrap;align-items:center;gap:0 .2rem}
.betrieb-abschnitte a{display:inline-flex;align-items:center;min-height:44px;
padding:0 .7rem;color:var(--tinte2);text-decoration:none;white-space:nowrap;
border-radius:var(--rad-knopf);font:400 var(--satz-bedienung) var(--sans);
transition:color var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}
@media(max-width:640px){
  .betrieb-abschnitte nav{padding-left:1rem;padding-right:1rem}
}



.register tr{display:grid;
grid-template-columns:minmax(0,1.7fr) repeat(var(--mspalten,1),minmax(0,1fr));
column-gap:1.25rem;align-items:center}
.register .eintrag{grid-column:1;grid-row:1}
.register .herkunft{grid-column:1;grid-row:2}

.register .mm{grid-row:1/span 2;margin:0;text-align:left;
font:400 .8125rem/1.5 var(--mono);color:var(--tinte2);
font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

.register .mm .unerhoben{font-style:italic;color:var(--linie2)}


.register .spaltenkopf{background:var(--flaeche2);
box-shadow:0 1px 0 0 var(--linie2)}
.register .spaltenkopf th{font:650 .75rem/1.5 var(--sans);letter-spacing:.07em;
text-transform:uppercase;color:var(--gedaempft)}
.register .spaltenkopf th{align-self:end}
.register .spaltenkopf th:first-child{grid-column:1;grid-row:1}
.register .spaltenkopf th:nth-child(2){grid-column:1;grid-row:2}

.register .spaltenkopf th:nth-child(n+3){grid-row:1/span 2;text-align:left;
align-self:center;overflow-wrap:anywhere}


nav[aria-label].themenband{display:flex;flex-wrap:nowrap;gap:.4rem;
overflow-x:auto;scroll-snap-type:x proximity;
scrollbar-width:thin;padding:0 0 .55rem;margin:0 0 1.1rem;
overscroll-behavior-x:contain}
nav[aria-label].themenband a{scroll-snap-align:start;flex:none;
text-decoration:none;font:500 .8125rem/1 var(--sans);color:var(--tinte2);
padding:.5rem .8rem;min-height:34px;display:inline-flex;align-items:center;
border-radius:var(--rad-pille);background:var(--flaeche);box-shadow:var(--ring);
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
nav[aria-label].themenband a.mehr{color:var(--kante);font-weight:650}
@media(hover:hover){
  nav[aria-label].themenband a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}


.marken-titel{font:650 .75rem/1.5 var(--sans);letter-spacing:.07em;
text-transform:uppercase;color:var(--gedaempft);margin:0 0 .4rem}


.strom .karte{box-shadow:0 1px 0 0 var(--linie)}
.strom .karte:last-child{box-shadow:none}

.strom .karte tr{padding:.18rem 1.05rem;box-shadow:none}
.strom .karte tr:first-child{padding-top:.6rem}
.strom .karte tr:last-child{padding-bottom:.6rem}
.strom .karte .herkunft{margin:0;line-height:1.45}


.strom td > .wechsel{display:grid;grid-template-columns:minmax(0,21rem) minmax(0,1fr);
column-gap:1.1rem;align-items:baseline}
.strom .wechsel .feld{color:var(--gedaempft)}

.strom .wechsel b{font-weight:600;color:var(--tinte)}

.strom .anzahl{font:400 .75rem var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums;margin-left:.5rem}


@media(max-width:640px){
  
  .register tr{grid-template-columns:minmax(0,1fr)}
  .register .eintrag,.register .herkunft{grid-column:1}
  .register .mm{grid-column:1;grid-row:auto;text-align:left;
  display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);
  column-gap:.75rem;align-items:baseline;margin-top:.25rem}
  
  .register .mm::before{font:650 var(--satz-etikett) var(--sans);
  color:var(--gedaempft)}
  .register tr .mm:nth-child(3)::before{content:var(--m1,"")}
  .register tr .mm:nth-child(4)::before{content:var(--m2,"")}
  .register tr .mm:nth-child(5)::before{content:var(--m3,"")}
  
  .register .spaltenkopf{position:absolute;width:1px;height:1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap}
  
  .strom td > .wechsel{grid-template-columns:minmax(0,1fr);row-gap:.05rem}
}


@media print{
  nav[aria-label].themenband{display:none}
  .marken-titel{order:-1;margin:0}
  
  .register .mm{color:inherit}
}



.pillen{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.pille{display:inline-flex;align-items:center;min-height:1.35rem;padding:0 .5rem;
border-radius:var(--rad-pille);box-shadow:var(--ring);background:var(--flaeche2);
font:500 var(--satz-etikett) var(--mono);color:var(--tinte2);letter-spacing:0;
font-variant-numeric:tabular-nums;white-space:nowrap}
.pille-konfig{color:var(--kante);box-shadow:0 0 0 1px var(--kante)}
.marken .marke-alle a{background:transparent;box-shadow:var(--ring-kontur);color:var(--tinte2)}

.marke-kreuz{margin-left:.4rem;font-size:1.05em;line-height:1;color:var(--gedaempft)}
.marken .marke-alle a .marke-kreuz{display:none}


form.listenflaeche{background:transparent;box-shadow:none;padding:0;margin:0 0 .9rem}


h1.listentitel{font-size:clamp(2.1rem,1.3rem + 2.1vw,2.9rem)}


.ergebniszeile{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .55rem;
margin:1rem 0 .55rem;font:400 var(--satz-bedienung) var(--sans);color:var(--tinte2)}
.ergebniszeile b{font-weight:650;color:var(--tinte);font-variant-numeric:tabular-nums}
.ergebniszeile span[aria-hidden]{color:var(--kontur)}

.ansichtswahl{display:flex;align-items:center;gap:.6rem;margin:.2rem 0 .4rem;
font:500 var(--satz-klein) var(--sans);color:var(--gedaempft)}
.ansichtswahl a,.ansichtswahl b{display:inline-flex;align-items:center;min-height:32px;
padding:0 .6rem;border-radius:var(--rad-pille);text-decoration:none}
.ansichtswahl a{box-shadow:var(--ring-kontur);color:var(--tinte2)}
.ansichtswahl b{background:var(--kante);color:var(--auf);font-weight:600}

.register.zeilen{border-radius:var(--rad-gross);box-shadow:var(--ring)}
.register.zeilen tbody{display:contents}

.register.zeilen tr{position:relative;display:grid;
grid-template-columns:minmax(0,1fr) auto;
grid-template-rows:auto auto auto auto;
column-gap:1rem;row-gap:.2rem;
padding:1.1rem 1.25rem 1.1rem 4.9rem;align-items:start}
.register.zeilen tr+tr{box-shadow:inset 0 1px 0 var(--linie)}
.register.zeilen .monogramm{position:absolute;left:1.25rem;top:1.05rem;
display:grid;place-items:center;width:44px;height:44px;
border-radius:var(--rad-knopf);background:var(--flaeche2);color:var(--tinte2);
font:600 var(--satz-feld) var(--sans);letter-spacing:.02em}

.register.zeilen .eintrag{grid-column:1;grid-row:1;display:flex;
flex-wrap:wrap;align-items:baseline;gap:.2rem .7rem;
margin:0;font:640 var(--satz-titel) var(--sans);letter-spacing:-.015em}
.register.zeilen .eintrag[data-status]::before{align-self:center}
.register.zeilen .aufbauzeichen{align-self:center;
padding:.1rem .5rem;border-radius:var(--rad-klein);
background:var(--kante2);color:var(--kante);
font:600 var(--satz-etikett) var(--sans)}
.register.zeilen .anbietertext{grid-column:1;grid-row:2;margin:0;
font:400 var(--satz-feld) var(--sans);color:var(--tinte2);text-align:left}
.register.zeilen .herkunft{grid-column:1;grid-row:3;margin:.15rem 0 0;text-align:left}
.register.zeilen .kurz{grid-column:1;grid-row:4;margin:.3rem 0 0;text-align:left;
display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .5rem;
font:400 var(--satz-bedienung) var(--sans);color:var(--gedaempft)}
.register.zeilen .kurz i{font-style:normal;color:var(--linie2)}



.register.zeilen .eintrag a::after{content:"";position:absolute;inset:0;z-index:1}
@media(hover:hover){
  .register.zeilen tr:hover{background:var(--flaeche2)}
  .register.zeilen tr:hover .monogramm{background:var(--kante2);color:var(--kante)}
}
@media(max-width:640px){
  .register.zeilen tr{grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto auto auto auto auto;padding:1rem 1rem 1rem 3.9rem}
  .register.zeilen .monogramm{left:1rem;top:.95rem;width:36px;height:36px}
  .register.zeilen .eintrag,.register.zeilen .anbietertext,
  .register.zeilen .herkunft,.register.zeilen .kurz{grid-column:1}

}



.schnellfilter{position:sticky;top:var(--klebehoehe);z-index:4;
border:0;padding:.9rem 1.1rem 1.1rem;margin:0 0 .9rem;
background:var(--flaeche2);box-shadow:none;border-radius:var(--rad-gross)}
.schnellfilter>legend{float:left;width:100%;margin:0 0 .55rem;padding:0}
.schnellfilter>p{display:grid;grid-template-columns:1fr;gap:.75rem 1rem;margin:0;clear:both}
.schnellfilter label[for=listensuche]{grid-column:1/-1;display:flex;
flex-direction:column;gap:.35rem}
.schnellfilter input#listensuche{width:100%;max-width:none;field-sizing:fixed;
min-height:56px;padding:0 1rem;border-radius:var(--rad-feld);
background:var(--flaeche);font:400 var(--satz-anriss) var(--sans)}
.schnellfilter-zeile{grid-column:1/-1;display:flex;flex-wrap:wrap;
align-items:flex-end;gap:.75rem}
.schnellfilter-zeile label{flex:0 0 auto;display:flex;flex-direction:column;gap:.3rem}


@media(max-width:640px){
  
  .schnellfilter{position:static}
  .schnellfilter-zeile{flex-direction:column;align-items:stretch}
  .schnellfilter-zeile label{flex:1 1 auto}
  .schnellfilter-zeile select{max-width:none;width:100%}
  .schnellfilter-zeile button{width:100%}
}


.listenzahl{margin:-.4rem 0 var(--luft-block);font:400 var(--satz-anriss) var(--sans);
color:var(--tinte2);max-width:none;font-variant-numeric:tabular-nums}



.kennung{display:flex;align-items:center;flex-wrap:wrap;gap:.15rem .55rem;
margin:.1rem 0 1.1rem;font-family:var(--mono);font-size:.8125rem;
color:var(--gedaempft)}
.kennung code{font-size:.8125rem;color:var(--tinte2);word-break:break-word}
.kennung .statuspunkt{margin-right:0}


nav[aria-label].reiter{display:flex;gap:.1rem;margin:0 0 1.35rem;padding:0;
overflow-x:auto;scrollbar-width:thin;
box-shadow:inset 0 -1px 0 0 var(--linie)}
nav[aria-label].reiter a{position:relative;display:inline-flex;align-items:center;gap:.5rem;
min-height:44px;padding:0 1rem;white-space:nowrap;text-decoration:none;
color:var(--tinte2);font:600 .875rem/1 var(--sans);
border-radius:var(--rad) var(--rad) 0 0;
transition:color var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}
nav[aria-label].reiter a::after{content:"";position:absolute;left:.6rem;right:.6rem;bottom:0;
height:2px;background:var(--kante);transform:scaleX(0);transform-origin:left;
transition:transform var(--takt-weit) var(--kurve)}
nav[aria-label].reiter a[aria-current="page"]{color:var(--tinte)}
nav[aria-label].reiter a[aria-current="page"]::after{transform:scaleX(1)}
nav[aria-label].reiter .anzahl{font:400 .75rem var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums}
@media(hover:hover){
  nav[aria-label].reiter a:hover{color:var(--kante);background:var(--flaeche2)}
  nav[aria-label].reiter a:hover::after{transform:scaleX(1)}
}




.plaetze{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));
gap:.6rem;margin:0 0 1.1rem;padding:0;list-style:none;max-width:none}
.platz{display:flex;flex-direction:column;gap:.3rem;margin:0;
min-height:5.2rem;padding:.9rem 1rem;border-radius:var(--rad);
background:var(--flaeche2);justify-content:center}
.platz-name{font:640 var(--satz-feld) var(--sans);letter-spacing:-.012em;
color:var(--tinte);word-break:break-word}
.platz-weg{font:400 var(--satz-bedienung) var(--sans);color:var(--gedaempft)}
.platz-leer{background:transparent;box-shadow:inset 0 0 0 1px var(--linie2);
color:var(--gedaempft);font:400 var(--satz-bedienung) var(--sans);
align-items:center;text-align:center}
.vergleichsweg{margin:1.25rem 0 1.5rem}


.schrittleiste{margin:0 0 1.25rem}
.schrittleiste ol{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .1rem;
margin:0;padding:0;list-style:none;max-width:none}
.schrittleiste li{display:flex;align-items:center;margin:0}
.schrittleiste li:not(:last-child)::after{content:"";width:1.5rem;height:1px;
margin:0 .1rem;background:var(--linie2);flex:none}
.schrittleiste a,.schrittleiste b{display:inline-flex;align-items:center;gap:.45rem;
min-height:36px;padding:0 .7rem;border-radius:var(--rad-pille);
font:500 var(--satz-bedienung) var(--sans);text-decoration:none}
.schrittleiste a{color:var(--gedaempft)}
.schrittleiste b{background:var(--kante2);color:var(--kante);font-weight:640}
.schritt-nr{display:grid;place-items:center;width:20px;height:20px;flex:none;
border-radius:var(--rad-pille);background:var(--flaeche2);color:var(--gedaempft);
font:600 .75rem/1 var(--mono);font-variant-numeric:tabular-nums}
.schrittleiste b .schritt-nr{background:var(--kante);color:var(--flaeche)}
@media(hover:hover){
  .schrittleiste a:hover{background:var(--flaeche2);color:var(--tinte)}
}
@media(max-width:640px){
  .schrittleiste li:not(:last-child)::after{width:.7rem}
  .schrittleiste a,.schrittleiste b{padding:0 .5rem}
}


.statuskacheln{display:grid;
grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.6rem;
margin:0 0 1.5rem;padding:0}
.statuskachel{margin:0;padding:.85rem 1rem .9rem;background:var(--flaeche2);
border-radius:var(--rad)}
.statuskachel dt{margin:0 0 .25rem;font:650 .75rem/1.2 var(--sans);
letter-spacing:.09em;text-transform:uppercase;color:var(--gedaempft)}
.statuskachel dd{margin:0;font:600 var(--satz-feld) var(--sans);
letter-spacing:-.012em;color:var(--tinte);word-break:break-word}

.kopfdaten{display:grid;
grid-template-columns:repeat(auto-fit,minmax(13.5rem,1fr));gap:0;
margin:0 0 1.5rem;padding:0;background:var(--flaeche);border-radius:var(--rad);
box-shadow:var(--ring),var(--schatten);overflow:hidden}
.kopfdaten > div{margin:0;padding:.72rem .95rem .78rem;background:var(--flaeche);
box-shadow:inset -1px -1px 0 0 var(--linie)}
.kopfdaten dt{margin:0 0 .3rem;font:650 .75rem/1.2 var(--sans);letter-spacing:.08em;
text-transform:uppercase;color:var(--gedaempft)}
.kopfdaten dd{margin:0;font-size:.875rem;line-height:1.45;color:var(--tinte);
word-break:break-word}
.kopfdaten code{font-size:.8125rem;color:var(--tinte)}
.kopfdaten dd a{color:var(--kante)}
.kopfdaten .herkunft{display:block;margin-top:.25rem}


.stilllegung{margin:0 0 1.4rem;padding:.95rem 1.15rem 1rem;
background:var(--warn2);box-shadow:var(--ring);
border-left:3px solid var(--warn);border-radius:0 var(--rad) var(--rad) 0}
.stilllegung h2{margin:0 0 .55rem;font-size:.95rem;color:var(--tinte)}
.stilllegung .zitat{margin:0 0 .55rem;padding:0;max-width:68ch;
font:400 var(--satz-text) var(--sans);color:var(--tinte)}

.stilllegung .herkunft{margin:0;color:var(--tinte2)}


nav[aria-label].sprungleiste{position:sticky;top:var(--klebehoehe);z-index:5;
display:flex;gap:.35rem;margin:0 0 1.3rem;padding:.35rem 0;
overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;
scroll-snap-type:x proximity;
background:var(--glas);
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
nav[aria-label].sprungleiste a{display:inline-flex;align-items:center;min-height:40px;
padding:0 .8rem;scroll-snap-align:start;white-space:nowrap;
border-radius:var(--rad-pille);box-shadow:var(--ring);background:var(--flaeche);
color:var(--tinte2);text-decoration:none;font-size:.8125rem;
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
@media(hover:hover){
  nav[aria-label].sprungleiste a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}

main section[id],main details[id]{scroll-margin-top:calc(var(--klebehoehe) + 3.6rem)}


.belegkopf{margin:0 0 1.15rem;padding:.7rem .95rem .75rem;
background:var(--flaeche2);box-shadow:var(--ring);
border-left:2px solid var(--kante);border-radius:0 var(--rad-klein) var(--rad-klein) 0}
.belegkopf p{margin:0;max-width:none}
.belegkopf p + p{margin-top:.32rem}
.belegkopf b{color:var(--tinte2);font-weight:650}


.grad{display:inline-block;font-style:normal;font-size:.75rem;
letter-spacing:.06em;text-transform:uppercase;color:var(--gedaempft);
white-space:nowrap}



.einordnung{list-style:none;margin:.3rem 0 .9rem;padding:0;max-width:none;
display:grid;gap:1px;
background:var(--linie);border-radius:var(--rad);
box-shadow:var(--ring),var(--schatten);overflow:hidden}
.einordnung li{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem 1.1rem;
margin:0;padding:.78rem 1.05rem;background:var(--flaeche)}
.einordnung .feld{flex:0 0 13rem;font:500 .8125rem/1.4 var(--sans);
color:var(--gedaempft)}
.einordnung .wert{flex:0 0 auto;min-width:5rem}
.einordnung .wert{font:650 .9375rem/1.3 var(--sans);color:var(--tinte)}
.einordnung .datenzeile{margin-left:auto}
.einordnung .datenzeile .zahl{font-size:.8125rem}
.einordnung > li > a{font-size:.8125rem;color:var(--kante);text-decoration:none;
white-space:nowrap}
@media(hover:hover){
  .einordnung > li > a:hover{text-decoration:underline}
}


.themenmarken{display:flex;flex-wrap:wrap;gap:.45rem;margin:.3rem 0 1.3rem;
padding:0;max-width:none;list-style:none}
.themenmarken li{margin:0}
.themenmarken a{display:inline-flex;align-items:center;gap:.5rem;min-height:38px;
padding:0 .9rem;border-radius:var(--rad-pille);box-shadow:var(--ring-kontur);
background:var(--flaeche);color:var(--tinte2);text-decoration:none;
font-size:.8125rem;transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
.themenmarken .anzahl{font:400 .75rem var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums}
@media(hover:hover){
  .themenmarken a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}


.rohblock{margin:1.3rem 0 1.5rem}
.rohblock .aufklapp-leib{padding-top:.55rem}
.rohangaben tr{display:grid;grid-template-columns:16rem minmax(0,1fr);
gap:0 1.5rem;padding:.56rem 1.05rem .62rem}
.rohangaben th{font-weight:500;font-size:.78rem;line-height:1.5;
color:var(--gedaempft);padding-top:.14rem}

.rohangaben td{margin:0;font-family:var(--mono);font-size:.8125rem;
font-variant-ligatures:none;
line-height:1.55;color:var(--tinte);word-break:break-word}
.rohangaben .mitzaehlung{margin-top:.28rem;font-family:var(--sans);
font-size:.78rem}
.rohangaben .mitzaehlung a{color:var(--kante);text-decoration:none}
.rohangaben .grad{margin-left:.35rem}


#erreichbarkeit .kopfdaten{margin-bottom:.7rem}
#erreichbarkeit code{font-size:.8125rem;word-break:break-all}

.mitzaehlung{font-family:var(--mono);font-size:.8125rem;line-height:1.55;
color:var(--gedaempft);font-variant-numeric:tabular-nums}

.kopfdaten .mitzaehlung{display:block;margin-top:.28rem}


.vergleich tr.gleich th:first-child,.vergleich tr.gleich td{color:var(--gedaempft)}
.vergleich tr.gleich th:first-child::after{content:"=";margin-left:.5rem;
font-family:var(--mono);color:var(--kontur)}

.vergleich tr:not(.gleich):not(.gruppe) th:first-child{
box-shadow:inset 2px 0 0 0 var(--kante)}
.vergleich tr.gruppe th{background:var(--flaeche2);font:650 .75rem/1 var(--sans);
letter-spacing:.09em;text-transform:uppercase;color:var(--gedaempft);
padding:.7rem .95rem}
.unterschiede{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem;
margin:0 0 .9rem}
.unterschiede p{margin:0;font-size:.875rem;color:var(--tinte2);max-width:none}

@supports selector(:has(*)){
  .vergleichsflaeche:has(#nur-unterschiede:checked) .vergleich tr.gleich{display:none}
}


.vorschlaege{list-style:none;margin:.3rem 0 1.3rem;padding:0;max-width:none;display:grid;
grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:.55rem}
.vorschlaege li{margin:0}
.vorschlaege a{display:block;padding:.7rem .9rem .75rem;border-radius:var(--rad);
box-shadow:var(--ring);background:var(--flaeche);color:var(--tinte);
text-decoration:none;font-size:.875rem;line-height:1.45;
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
.vorschlaege .herkunft{display:block;margin-top:.2rem}
@media(hover:hover){
  .vorschlaege a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}



@supports((mask-image:linear-gradient(#000,#000)) or (-webkit-mask-image:linear-gradient(#000,#000))){
  @media(max-width:820px){
    nav[aria-label].sprungleiste{scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 1.6rem),transparent 100%);
    mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 1.6rem),transparent 100%)}
    nav[aria-label].sprungleiste::-webkit-scrollbar{display:none}
  }
}

@media(max-width:640px){
  .kopfdaten{grid-template-columns:1fr}
  .rohangaben tr,.merkmale tr{grid-template-columns:1fr;gap:.2rem}
  .rohangaben th,.merkmale th{padding-top:0}
  .einordnung .feld{flex:1 1 100%}
  .einordnung .datenzeile{margin-left:0}
  nav[aria-label].sprungleiste{top:calc(var(--klebehoehe) - 20px)}
  main section[id],main details[id]{scroll-margin-top:calc(var(--klebehoehe) + 3rem)}
}


@media print{
  nav[aria-label].reiter,nav[aria-label].sprungleiste{display:none}
  .unterschiede,.vorschlaege{display:none}
  details.aufklapp{box-shadow:none;margin:.5rem 0;break-inside:auto}
  details.aufklapp > summary{font-weight:700;padding:0;min-height:0}
  details.aufklapp > summary::before{display:none}
  details.aufklapp > *{display:block}
  details.aufklapp::details-content{block-size:auto;content-visibility:visible;
  overflow:visible}
  .aufklapp-leib{padding:.35rem 0 0}
  .kopfdaten{box-shadow:none;background:none;gap:0}
  .kopfdaten > div{padding:.2rem 0}
  .einordnung{box-shadow:none;background:none;gap:0}
  .einordnung li{padding:.2rem 0}
  .stilllegung{box-shadow:none}
  .vergleich tr.gleich{display:table-row}
}


.blick{margin:var(--luft-eng) 0 0;padding:1.1rem 1.25rem 1.2rem;background:var(--flaeche);
border-radius:var(--rad);box-shadow:var(--ring),var(--schatten);
display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:.6rem 1.6rem}
.blick-text{grid-column:1}
.blick-text p{margin:0 0 .5rem;max-width:none}
.blick-fakten{grid-column:2;grid-row:1;margin:0;display:grid;gap:.55rem}
.blick-fakten > div{margin:0;display:grid;grid-template-columns:minmax(7rem,.6fr) minmax(0,1fr);
gap:.2rem .8rem;align-items:baseline}
.blick-fakten dt{margin:0;font:650 .75rem/1.35 var(--sans);letter-spacing:.07em;
text-transform:uppercase;color:var(--gedaempft)}
.blick-fakten dd{margin:0;font:500 var(--satz-feld) var(--sans);color:var(--tinte)}
.blick-fakten dd code{font-size:.8125rem}
.blick-quelle{display:block;margin-top:.1rem;font:400 .75rem/1.4 var(--mono);color:var(--gedaempft)}
.blick .wege{grid-column:1/-1;margin:.6rem 0 0}
.blick .wege a.weg-haupt{background:var(--kante);color:var(--auf);font-weight:650;
box-shadow:var(--schatten-hoch),var(--schatten-leucht)}
.blick .wege li.weg-leise a{box-shadow:none;background:transparent;padding:0 .4rem}
@media(max-width:820px){
  .blick{grid-template-columns:1fr}
  .blick-fakten{grid-column:1;grid-row:auto}
  .blick-fakten > div{grid-template-columns:1fr;gap:.1rem}
}

@media(max-width:640px){
  .blick .wege{position:fixed;left:0;right:0;bottom:0;z-index:20;margin:0;
  padding:.55rem .75rem calc(.55rem + env(safe-area-inset-bottom));
  background:var(--flaeche2);box-shadow:0 -1px 0 0 var(--linie);gap:.4rem;flex-wrap:nowrap}
  .blick .wege li{flex:1 1 0;min-width:0}
  .blick .wege li.weg-mehr{flex:0 0 auto}
  .blick .wege a{width:100%;justify-content:center;min-height:42px;padding:0 .4rem;
  font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;
  line-height:42px;text-align:center}
  .blick .wege .mehrmenue>summary{min-height:42px;padding:0 .6rem;font-size:.78rem}
  
  .blick .wege .mehrmenue>ul{top:auto;bottom:calc(100% + .45rem);right:0;min-width:13rem}
  .blick .wege .mehrmenue>ul a{text-align:left;padding:0 .6rem}
  body:has(.blick) main{padding-bottom:4.6rem}
  body:has(.blick) footer{padding-bottom:4.2rem}
}
.unterschiede-zahl{font:700 var(--satz-titel) var(--sans);color:var(--tinte);margin-right:.3rem}


.lagemarken{display:flex;flex-wrap:wrap;gap:.45rem;margin:.2rem 0 .9rem;
max-width:none}
.lagemarken span{display:inline-flex;align-items:center;min-height:1.7rem;
padding:0 .65rem;border-radius:var(--rad-pille);background:var(--flaeche2);
color:var(--tinte2);font:500 var(--satz-bedienung) var(--sans);white-space:nowrap}


.mehrmenue{display:inline-block;position:relative}
.mehrmenue>summary{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;
padding:0 1rem;border-radius:var(--rad-knopf);box-shadow:var(--ring-kontur);
color:var(--tinte2);font:600 var(--satz-bedienung) var(--sans);cursor:pointer;
list-style:none}
.mehrmenue>summary::-webkit-details-marker{display:none}
.mehrmenue>ul{position:absolute;right:0;top:calc(100% + .35rem);z-index:15;
display:flex;flex-direction:column;gap:.15rem;min-width:15rem;margin:0;padding:.35rem;
list-style:none;background:var(--flaeche);border-radius:var(--rad);
box-shadow:var(--ring),var(--schatten-hoch)}
.mehrmenue>ul li{margin:0}
.mehrmenue>ul a{display:flex;width:100%;justify-content:flex-start;
box-shadow:none;background:transparent}
@media(hover:hover){
  .mehrmenue>ul a:hover{background:var(--flaeche2)}
}




.vorbehalte{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.7rem;
max-width:46rem}
.vorbehalte li{margin:0;padding:.15rem 0 .15rem .85rem;
border-left:2px solid var(--kante);
font:var(--satz-feld) var(--sans);color:var(--tinte2)}

.vorbehalte li:last-child{border-left-color:var(--linie2);color:var(--gedaempft)}


.verteilungen{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));
gap:1rem;margin:0 0 1rem;align-items:start}
.verteilungsfeld{position:relative;background:var(--flaeche);
box-shadow:var(--ring),var(--schatten);
border-radius:var(--rad);padding:1rem 1.1rem 0.85rem}

@supports (animation-timeline:view()){
  .verteilungsfeld::before{content:"";position:absolute;left:0;top:0;
  height:2px;width:100%;background:var(--kante);transform-origin:left;
  border-radius:var(--rad) var(--rad) 0 0;
  animation:feldkante linear both;animation-timeline:view();
  animation-range:entry 5% cover 25%}
  @keyframes feldkante{from{transform:scaleX(0)}}
}
.verteilungsfeld h3{margin:0 0 .5rem;font:650 .95rem/1.3 var(--sans);color:var(--tinte)}

.verteilungsfeld > .datenzeile{margin:0 0 .6rem;color:var(--gedaempft);font-size:.8125rem}

.verteilungstabelle{width:100%;border-collapse:collapse;font-size:.85rem}
.verteilungstabelle tr + tr > *{padding-top:.42rem}
.verteilungsname{text-align:left;font:500 .85rem/1.4 var(--mono);color:var(--tinte);
word-break:break-word;padding-right:.8rem;vertical-align:top}
.verteilungswert{vertical-align:top;min-width:9rem}
.verteilungszahl{font-family:var(--mono);font-variant-numeric:tabular-nums;
font-weight:600;color:var(--tinte)}
.verteilungsanteil{font-family:var(--mono);font-variant-numeric:tabular-nums;
color:var(--gedaempft);margin-left:.35rem}

.verteilungswert .balken{margin-top:.3rem}


.kachel-thema .kachel-wort{padding-right:1.9rem}


.kachel-thema .kachel-wort{font:650 var(--satz-feld) var(--sans);letter-spacing:0;
text-transform:none;color:var(--tinte)}


.kacheln:has(.kachel-thema){grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr))}


.kachel-gemeinsam{display:block;margin-top:.55rem;font-size:.8125rem;
color:var(--gedaempft)}
.kachel-gemeinsam .datenzeile{gap:.45rem}
.kachel-gemeinsam .zahl{font-size:.8125rem}


.kachel-anteil .datenzeile{margin:.2rem 0 .1rem;gap:.7rem}
.kachel-anteil .datenzeile .zahl{font:700 1.9rem/1.05 var(--sans);
letter-spacing:-.03em;color:var(--tinte)}


.ausschnittliste .eintrag a{display:flex;align-items:center;min-height:44px}
.ausschnittliste td.herkunft{vertical-align:middle}


nav.themenband{display:block;margin:0 0 1.2rem;font-size:.8125rem}
nav.themenband ul{list-style:none;display:flex;gap:.45rem;margin:0;padding:.2rem 0 .55rem;
overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;
overscroll-behavior-x:contain;max-width:none}
nav.themenband li{margin:0;flex:none;scroll-snap-align:start}
nav.themenband a{display:inline-flex;align-items:center;gap:.45rem;min-height:44px;
min-width:0;padding:0 .7rem;border-radius:var(--rad-pille);text-decoration:none;
background:var(--flaeche);box-shadow:var(--ring);color:var(--tinte2);
white-space:nowrap;transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
nav.themenband .bandzahl{font-family:var(--mono);font-variant-numeric:tabular-nums;
color:var(--gedaempft)}
nav.themenband a.bandalle,nav.themenband a.mehr{background:transparent;
box-shadow:var(--ring-kante);color:var(--kante)}

@supports selector(:has(*)){
  nav.themenband:not(:has(ul)){display:flex;gap:.45rem;padding:.2rem 0 .55rem;
  overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;
  overscroll-behavior-x:contain}
  nav.themenband:not(:has(ul)) > a{flex:none;scroll-snap-align:start}
}

@supports (background-attachment:local){
  nav.themenband ul{
    background-image:
      linear-gradient(to right,var(--grund),transparent 12px),
      linear-gradient(to left,var(--grund),transparent 12px),
      linear-gradient(to right,var(--schatten1),transparent 10px),
      linear-gradient(to left,var(--schatten1),transparent 10px);
    background-position:left center,right center,left center,right center;
    background-repeat:no-repeat;
    background-size:22px 100%,22px 100%,10px 100%,10px 100%;
    background-attachment:local,local,scroll,scroll;
  }
}
@media(hover:hover){
  nav.themenband a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}


.abgabewege{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 1.15rem;padding:0;
list-style:none}
.abgabewege li{margin:0}
.abgabewege a{display:inline-flex;align-items:center;min-height:44px;padding:0 .85rem;
border-radius:var(--rad-pille);background:var(--flaeche);box-shadow:var(--ring);
color:var(--tinte2);text-decoration:none;font:.8125rem/1 var(--sans);
transition:box-shadow var(--takt) var(--kurve),color var(--takt) var(--kurve)}
@media(hover:hover){
  .abgabewege a:hover{box-shadow:var(--ring-kante);color:var(--kante)}
}


nav.blaetterung a,nav.blaetterung strong{min-height:44px;min-width:44px}


.kacheln + h2{margin-top:2rem}


@media(max-width:640px){
  .verteilungen{grid-template-columns:1fr;gap:.75rem}
  .verteilungsfeld{padding:.85rem .9rem .7rem}
  .verteilungswert{min-width:7rem}
  
  nav.themenband ul{padding-left:.1rem;padding-right:.1rem}
  .kachel-anteil .datenzeile .zahl{font-size:1.6rem}
}


.themensuche{margin:.4rem 0 .8rem}
.themensuche label{flex:1 1 16rem}
.themensuche input[type=search]{width:100%}
.eingrenzungen{margin-bottom:.9rem}
.marken.eingrenzungen a::after{content:"→"}
.themen-alle{margin:.9rem 0 0}
.themenmethodik{margin-top:var(--luft-block)}
.themenmethodik .aufklapp-leib h2:first-child{margin-top:.6rem}


.gruppenraster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;
margin:0 0 var(--luft-abschnitt)}
.gruppe{padding:1.5rem 1.5rem 1.25rem;background:var(--flaeche2);
border-radius:var(--rad-gross);scroll-margin-top:calc(var(--klebehoehe) + 1.5rem)}
.gruppe-kopf{display:grid;grid-template-columns:auto minmax(0,1fr);
column-gap:1rem;row-gap:.4rem;align-items:start;margin:0 0 .9rem}
.gruppe-zeichen{display:grid;place-items:center;width:44px;height:44px;
border-radius:var(--rad-knopf);background:var(--flaeche);color:var(--kante)}
.gruppe h3{margin:0 0 .2rem;font:640 var(--satz-titel) var(--sans);
letter-spacing:-.018em}
.gruppe-satz{margin:0;font:400 var(--satz-feld) var(--sans);color:var(--tinte2);
max-width:none}
.gruppe-zahl{grid-column:2;font:500 var(--satz-bedienung) var(--sans);
color:var(--gedaempft);font-variant-numeric:tabular-nums}
.gruppe-schnitte{display:flex;flex-direction:column;gap:0;margin:0;padding:0;
list-style:none;max-width:none}
.gruppe-schnitte li{display:flex;align-items:center;justify-content:space-between;
gap:1rem;margin:0;padding:.45rem 0;box-shadow:inset 0 1px 0 var(--linie)}
.gruppe-schnitte a{text-decoration:none;font:400 var(--satz-feld) var(--sans);
color:var(--tinte)}
.gruppe-schnitte span{font:400 var(--satz-bedienung) var(--mono);
color:var(--gedaempft);font-variant-numeric:tabular-nums}
.datenlabor summary{font:600 var(--satz-feld) var(--sans)}
@media(hover:hover){
  .gruppe-schnitte a:hover{color:var(--kante);text-decoration:underline}
}
@media(max-width:900px){
  .gruppenraster{grid-template-columns:1fr}
}


.themenzahl{margin:-.4rem 0 var(--luft-block);font:400 var(--satz-anriss) var(--sans);
color:var(--tinte2);max-width:none;font-variant-numeric:tabular-nums}
.themenzahl b{color:var(--tinte);font-weight:600}
.themenzahl span[aria-hidden]{margin:0 .35rem;color:var(--linie2)}




@property --anteil-gesamt{syntax:"<percentage>";inherits:true;initial-value:0%}
.balken-zweispurig{position:relative;overflow:visible}
.balken-zweispurig::after{content:"";position:absolute;top:-2px;bottom:-2px;
left:var(--anteil-gesamt,0%);width:2px;border-radius:var(--rad-pille);
background:var(--kontur)}


@supports(grid-template-rows:subgrid){
  .kacheln:has(.kachel-gross){grid-auto-rows:auto}
  .kachel-gross{display:grid;grid-template-rows:subgrid;grid-row:span 4;
  align-content:start}
}

.kacheln:has(.kachel-gross){grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));
gap:.55rem}
.kachel-gross{padding:.7rem .8rem .75rem}

.kachel-gross .kachel-zahl{font-size:1.6rem;margin:.25rem 0 .1rem}
.kachel-gross .kachel-wort{font-size:.75rem;letter-spacing:.06em;
text-transform:none;overflow-wrap:anywhere;margin-bottom:0}
.kachel-gross .kachel-einheit{font-size:.75rem;line-height:1.35}
.kachel-gross .balken{margin-top:.45rem;align-self:end}
.kachel-gross .kachel-einheit + .kachel-einheit{margin-top:.1rem}

h2 > .anzahl{margin-left:.6rem;font:400 .8125rem var(--mono);color:var(--gedaempft);
font-variant-numeric:tabular-nums}


.werteliste{display:table;width:100%;border-collapse:separate;border-spacing:0}
.werteliste tr{display:table-row;padding:0;box-shadow:none}
.werteliste th,.werteliste td{display:table-cell;padding:.6rem .8rem;
box-shadow:0 1px 0 0 var(--linie);vertical-align:top}
.werteliste tr:first-child th{background:var(--flaeche2);font-size:.8rem;
font-weight:650;color:var(--gedaempft);box-shadow:0 1px 0 0 var(--linie2)}
.werteliste th{text-align:left;font-weight:500;font-size:.9375rem;
overflow-wrap:anywhere}
.werteliste .num{text-align:right;white-space:nowrap;width:1%;
font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:.875rem}

.werteliste th a{color:var(--tinte);text-decoration:none;font-weight:500;
display:inline-flex;align-items:center;min-height:32px;
padding:.15rem 0;overflow-wrap:anywhere}
.werteliste .balken{max-width:22rem}

.werteliste .leerwert{font-style:italic;color:var(--gedaempft)}
@media(hover:hover){
  .werteliste th a:hover{color:var(--kante);text-decoration:underline}
}



@property --dichte{syntax:"<percentage>";inherits:true;initial-value:0%}

.wuerfel td,.wuerfel th{display:table-cell;padding:.6rem .8rem;
box-shadow:0 1px 0 0 var(--linie);text-align:left;vertical-align:middle}
.wuerfel tr{display:table-row;padding:0;box-shadow:none}
.wuerfel{display:table;width:100%;border-collapse:separate;border-spacing:0;
min-width:34rem}
.wuerfel tr:first-child th{background:var(--flaeche2);font-size:.8rem;
font-weight:650;color:var(--gedaempft);box-shadow:0 1px 0 0 var(--linie2)}
.wuerfel .num{text-align:right;white-space:nowrap;font-family:var(--mono);
font-variant-numeric:tabular-nums}

.wuerfel td a{color:inherit;text-decoration:none;display:flex;
align-items:center;justify-content:flex-end;min-height:32px}

.wuerfelzeile td{background:color-mix(in oklab,var(--kante)
clamp(9%,calc(9% + var(--dichte,0%) * .33),32%),var(--flaeche))}

.wuerfelzeile.leer td{background:var(--flaeche)}
@media(hover:hover){
  .wuerfel tr:hover{background:none}
  .wuerfel td a:hover{color:var(--kante);text-decoration:underline}
}
.matrix td:has(a){background:color-mix(in oklab,var(--kante)
clamp(9%,calc(9% + var(--anteil,0%) * 1.1),42%),var(--flaeche))}
.matrix td:not(:has(a)){background:var(--flaeche)}


.verteilung .zeile a{display:inline-flex;align-items:center;min-height:32px;
padding:.1rem 0;overflow-wrap:anywhere}

.merkmale .herkunft a{display:inline-flex;align-items:center;min-height:32px}


.werteliste .datenzeile{justify-content:flex-end;gap:.5rem}
.werteliste .datenzeile .zahl{font-size:.875rem}


.druckkopf{display:none;overflow-wrap:anywhere}


@media(max-width:640px){
  .werteliste{min-width:22rem}
  .werteliste th,.werteliste td{padding:.5rem .55rem}
  .werteliste .balken{max-width:none}
  .wuerfel{min-width:28rem}
  .wuerfel td,.wuerfel th{padding:.5rem .55rem;font-size:.8125rem}
  .kacheln:has(.kachel-gross){grid-template-columns:1fr}
}


.zwillingsgruppe{margin:1.6rem 0 2rem}
.zwillingsgruppe h3{font-size:.9rem;letter-spacing:.02em;color:var(--tinte2);
margin:1.1rem 0 .5rem}


.zwillingsgruppe .matrix tbody{display:table-row-group}
.zwillingsgruppe .matrix table{width:100%}
.zwillingsgruppe .matrix th,.zwillingsgruppe .matrix td{text-align:left}
.zwillingsgruppe .matrix th a{display:inline-flex;align-items:center;gap:.45rem;
font-family:var(--mono);font-size:.8125rem;font-weight:500;color:var(--tinte);
text-decoration:none;overflow-wrap:anywhere}
.zwillingsgruppe .matrix td{font-family:var(--mono);font-size:.8125rem;
line-height:1.55;color:var(--tinte2);overflow-wrap:anywhere}

.leerwert{font-style:italic;color:var(--gedaempft)}
@media(hover:hover){
  .zwillingsgruppe .matrix th a:hover{color:var(--kante);text-decoration:underline}
}


.ringreihe{display:flex;flex-wrap:wrap;gap:1.4rem;margin:.9rem 0 1.2rem}
.ringzeile{display:flex;align-items:center;gap:.7rem;
background:var(--flaeche);border-radius:var(--rad-klein);
box-shadow:var(--ring);padding:.7rem .95rem}
.ringzeile .datenzeile{flex-direction:row-reverse;align-items:center;gap:.65rem}
.ringzeile .zahl{font:600 .9375rem/1.2 var(--sans);color:var(--tinte);
font-variant-numeric:tabular-nums;white-space:nowrap}
.ringwort{font-size:.78rem;color:var(--gedaempft);max-width:14rem}


.rasterzeile{display:flex;align-items:flex-end;gap:1rem;margin:.8rem 0 1rem;
padding:.85rem 1rem;background:var(--flaeche);border-radius:var(--rad);
box-shadow:var(--ring)}
.rasterzeile .datenzeile{display:flex;flex-direction:column-reverse;
align-items:flex-start;gap:.45rem}
.rasterzeile .zahl{font:600 .875rem/1.2 var(--sans);color:var(--gedaempft);
font-variant-numeric:tabular-nums}
.rasterzeile .datenbild{overflow-x:auto;max-width:100%}


.profil tr{display:grid;grid-template-columns:minmax(0,1fr);gap:.35rem 1.5rem;
padding:.9rem 1.1rem}

.profil th{font-weight:600;font-size:.8125rem;color:var(--tinte);display:block}
.profil td{margin:0}
.profilmarke{display:inline-block;margin-left:.6rem;
font-size:.75rem;font-weight:650;letter-spacing:.07em;
text-transform:uppercase;color:var(--gedaempft);white-space:nowrap;
box-shadow:var(--ring-kontur);border-radius:var(--rad-pille);padding:.12rem .5rem}
.profilmarke[data-gemischt="ja"]{color:var(--kante);box-shadow:var(--ring-kante)}
.profilwerte{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;
max-width:none}
.profilwerte > li{display:grid;grid-template-columns:minmax(6rem,1fr) 7.5rem 7.5rem;
gap:.2rem .9rem;align-items:baseline}
.profilwert{font-family:var(--mono);font-size:.8125rem;color:var(--tinte2);
overflow-wrap:anywhere}
.profilspalte{display:block;font-size:.78rem;color:var(--gedaempft)}
.profilzahl{display:flex;align-items:baseline;gap:.4rem;
font-variant-numeric:tabular-nums;color:var(--tinte);font-weight:600}
.profilzahl small{font-weight:400;font-size:.75rem;color:var(--gedaempft)}
.profilspalte .balken{margin-top:.25rem}
@supports(grid-template-columns:subgrid){
  
  .profil tr{grid-template-columns:18rem minmax(0,1fr)}
  .profil td{grid-column:2}
}


.rechenflaeche .verteilung .zeile a,
.rechenflaeche .verteilung .zeile span{display:inline-block;padding-block:.16rem}
.rechenflaeche .zwillingsgruppe .matrix th a{padding-block:.22rem}
.rechenflaeche .leise a{display:inline-block;padding-block:.3rem}
.rechenflaeche .aufklapp > summary{min-height:24px}


@media(max-width:640px){
  .profilwerte > li{grid-template-columns:minmax(0,1fr);gap:.35rem}
  .profilspalte{display:flex;align-items:baseline;gap:.6rem}
  .profilspalte .balken{flex:1;margin-top:0}
  .profil tr{grid-template-columns:minmax(0,1fr)}
  .profil td{grid-column:auto}
  .ringzeile{width:100%}
  .ringwort{max-width:none}
  .rasterzeile{flex-direction:column;align-items:stretch}
}


.kacheln-haupt .kachel-wort{color:var(--kante)}
.werkzeuggruppe{margin-top:var(--luft-block);max-width:none}
.werkzeuggruppe h3{margin:0 0 .2rem;font:700 var(--satz-titel) var(--sans);letter-spacing:-.012em}
.werkzeuggruppe>.herkunft{margin-top:0}
.werkzeugliste{list-style:none;margin:.6rem 0 0;padding:0;
display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:.5rem .9rem}
.werkzeugliste li{display:flex;flex-direction:column;gap:.1rem;padding:.7rem .95rem;
background:var(--flaeche);border-radius:var(--rad-klein);box-shadow:var(--ring)}
.werkzeugliste li a{font:650 var(--satz-feld) var(--sans);color:var(--tinte);text-decoration:none}
@media(hover:hover){
  .werkzeugliste li a:hover{text-decoration:underline}
}
.werkzeugliste li span{font:400 var(--satz-klein) var(--sans);color:var(--gedaempft)}
.datenlabor{margin-top:var(--luft-block)}
.datenlabor>summary h3{margin:0;font:600 var(--satz-feld) var(--sans);padding:0}
.datenlabor>summary h3::before,.datenlabor>summary h3::after{content:none}
.datenlabor .werkzeugliste{margin-top:.4rem}

.keinedeutung{
  margin:1rem 0 1.4rem;
  padding:.75rem .95rem .75rem 1.1rem;
  font-family:var(--sans);
  font-size:.94rem;
  line-height:1.55;
  color:var(--tinte);
  background:color-mix(in oklab, var(--flaeche) 88%, var(--kante) 12%);
  border-radius:var(--rad);
  box-shadow:var(--ring-kontur);
  position:relative;
}

.keinedeutung::before{
  content:"";
  position:absolute;
  inset:.35rem auto .35rem 0;
  width:3px;
  border-radius:3px;
  background:var(--kante);
}


.nachbarschaft{margin:1.6rem 0 0}
.nachbarschaft h2{margin-bottom:.15rem}
.nachbarschaft > .herkunft{margin-top:0;margin-bottom:.6rem}

.nachbarschaft + .nachbarschaft{
  padding-top:1.5rem;
  box-shadow:inset 0 1px 0 0 var(--linie);
}


.leerbefund{
  font-family:var(--mono);
  font-size:.86rem;
  color:var(--gedaempft);
  padding:.5rem .7rem;
  border-radius:var(--rad);
  box-shadow:var(--ring-kontur);
  display:inline-block;
}


table.nachbargruppen tr,
table.sammel tr,
table.variablen tr,
table.domaenen tr{display:grid;gap:0 1.4rem;align-items:baseline}
table.nachbargruppen tr{grid-template-columns:12rem minmax(0,1fr)}
table.sammel tr{grid-template-columns:22rem minmax(0,1fr)}
table.variablen tr{grid-template-columns:minmax(0,1fr) 9rem 9rem}
table.domaenen tr{grid-template-columns:15rem minmax(0,1fr)}
table.nachbargruppen td,
table.sammel td,
table.variablen td,
table.domaenen td{margin:0}


table.nachbargruppen th{white-space:normal;word-break:break-word}
table.nachbargruppen td{line-height:1.9}
table.nachbargruppen td a{margin-right:.5rem}


.bestandsblick{margin:1.6rem 0 0}
.bestandsblick > summary{
  cursor:pointer;
  padding:.55rem .8rem;
  border-radius:var(--rad);
  box-shadow:var(--ring);
  font:600 1rem/1.4 var(--sans);
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.2rem .7rem;
}
.bestandsblick > summary .anzahl{
  font:400 .8125rem/1.4 var(--mono);
  color:var(--gedaempft);
}
.bestandsblick-leib{padding:.4rem 0 0}


.sammelfeld{
  width:100%;
  min-height:7.5rem;
  font-family:var(--mono);
  font-size:.9rem;
  line-height:1.6;
  resize:vertical;
}
@supports (field-sizing: content){
  .sammelfeld{field-sizing:content;max-height:60vh}
}


table.sammel th{
  font-family:var(--mono);
  font-weight:400;
  white-space:normal;
  word-break:break-all;
}
.sammeltreffer{margin-top:.3rem;line-height:1.7}


.bilanz{
  margin-top:1rem;
  font-family:var(--sans);
  font-size:1.02rem;
  font-weight:600;
  padding:.6rem .85rem;
  border-radius:var(--rad);
  box-shadow:var(--ring);
}


table.sammelbilanz tr{display:grid;gap:0 1.4rem;align-items:baseline;
grid-template-columns:22rem minmax(0,1fr)}
table.sammelbilanz td{margin:0}
table.sammelbilanz th{white-space:normal;word-break:break-word}


.bilanzwert{
  display:inline-flex;
  align-items:baseline;
  gap:.35rem;
  white-space:nowrap;
  margin-right:1.1rem;
  line-height:1.9;
}
.bilanzwert b{font-family:var(--mono);font-variant-numeric:tabular-nums}


table.variablen th:first-child{font-family:var(--mono);font-weight:400;word-break:break-all}
table.variablen td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}

table.variablenformate tr{display:grid;grid-template-columns:minmax(0,1fr) 9rem;
gap:0 1.4rem;align-items:baseline}
table.variablenformate th{font-family:var(--mono);font-weight:400}
table.variablenformate td{margin:0;text-align:right;font-variant-numeric:tabular-nums}
table.variablentexte td.beleg{
  font-family:var(--sans);
  white-space:normal;
  line-height:1.55;
  max-width:44rem;
}


.satzgruppe{margin:1.4rem 0 0}
.satzgruppe h3{margin-bottom:.3rem;font-size:.95rem;color:var(--gedaempft)}
.marke-wert{
  display:inline-block;
  padding:.2rem .5rem;
  margin:0 .3rem .3rem 0;
  border-radius:var(--rad);
  box-shadow:var(--ring-kontur);
  text-decoration:none;
}
.marke-wert code{font-size:.84rem}


table.domaenen th:first-child{font-family:var(--mono);font-weight:400;white-space:nowrap}
table.domaenen td{line-height:1.9;white-space:normal}
table.domaenen td a{margin-right:.5rem}


@media (max-width:640px){
  
  table.nachbargruppen tr,
  table.sammel tr,
  table.sammelbilanz tr,
  table.variablen tr,
  table.variablenformate tr,
  table.domaenen tr{display:block}
  table.nachbargruppen td,
  table.sammel td,
  table.sammelbilanz td,
  table.variablen td,
  table.variablenformate td,
  table.domaenen td{margin-top:.25rem}
  table.variablen td.num,
  table.variablenformate td{text-align:left}
  table.variablentexte td.beleg{max-width:none}
  table.domaenen th:first-child{white-space:normal;word-break:break-all}
  .bilanz{font-size:.97rem}
  .sammelfeld{min-height:9rem}
}


.reiterkasten{display:flex;flex-wrap:wrap;gap:.35rem;margin:.6rem 0 .2rem}
.reiterkasten .reiterschalter{position:absolute;width:1px;height:1px;opacity:0;
overflow:hidden;clip:rect(0 0 0 0)}
.reiterkasten>label{display:inline-flex;align-items:center;min-height:38px;padding:0 .9rem;
border-radius:var(--rad-pille);box-shadow:var(--ring-kontur);background:var(--flaeche);
font:600 var(--satz-bedienung) var(--sans);color:var(--tinte2);cursor:pointer;
flex-direction:row;letter-spacing:0}
.reiterkasten .reiterschalter:checked+label{background:var(--kante);color:var(--auf);
box-shadow:var(--schatten)}
.reiterkasten .reiterschalter:focus-visible+label{outline:2px solid var(--kante);outline-offset:2px}
.reiterkasten .reiterblatt{order:99;flex-basis:100%;display:none;margin-top:.5rem}
.reiterkasten .reiterschalter:checked+label+.reiterblatt{display:block}
.ablagen{list-style:none;margin:.3rem 0 .6rem;padding:0;display:grid;gap:.3rem}
.ablagen li{display:flex;flex-wrap:wrap;gap:.35rem .6rem;align-items:baseline;
font:400 var(--satz-klein) var(--sans);color:var(--tinte2)}
.ablagen li b{font-weight:650;color:var(--tinte)}
.ablagen li span{color:var(--gedaempft)}
.sammelhinweise{list-style:none;margin:.35rem 0 0;padding:0;display:grid;gap:.2rem}
.sammelhinweise li{font:400 var(--satz-klein) var(--mono);color:var(--tinte2);
padding-left:.7rem;border-left:2px solid var(--kante)}




.abgabe {
  margin: 2rem 0 0;
  padding: 1rem 0 0;
  box-shadow: inset 0 1px 0 var(--linie);
  font-family: var(--sans);
}
.abgabe-wege {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem 1rem;
  margin: 0 0 .5rem;
  font-family: var(--sans);
}
.abgabe-wege b { font-size: .9375rem; }

.abgabe-wege a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--mono);
  font-size: .875rem;
  padding: .25rem .8rem;
  border-radius: var(--rad-klein);
  box-shadow: var(--ring-kontur);
  text-decoration: none;
}

.abgabe-wege a::before { content: "\2193\00a0"; color: var(--kante); }

@media(hover:hover){
  .abgabe-wege a:hover { box-shadow: var(--ring); }
}


.belegraster {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 1.1rem;
  margin: 1rem 0 1.6rem;
}
.belegkarte {
  padding: 1.25rem 1.3rem;
  border-radius: var(--rad-gross);
  background: var(--flaeche);
  box-shadow: var(--ring), var(--schatten);
}
.belegkarte > h3 {
  margin: 0 0 .75rem;
  font-family: var(--sans);
  font-size: .9375rem;
  letter-spacing: -.01em;
  color: var(--tinte);
}

.belegkarte table {
  display: block;
  width: 100%;
  background: none;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
}
.belegkarte tr {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .1rem;
  padding: .5rem 0;
  box-shadow: 0 1px 0 0 var(--linie);
}
.belegkarte tr:last-child { box-shadow: none; }
.belegkarte td { margin: 0; padding: 0; }
.belegkarte td:first-child { font-family: var(--sans); font-size: .9375rem; }
.belegkarte td:last-child { text-align: right; }

.belegkarte code { font-size: .75rem; line-height: 1.45; overflow-wrap: anywhere; }
.belegkarte .datenzeile { justify-content: flex-end; }
.belegkarte .herkunft { margin-top: .6rem; }
.belegkarte > .datenbild { margin-top: .4rem; width: 100%; height: auto; }


.luecken { margin: 1rem 0 1.6rem; }

.luecken tr {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0 1.25rem;
  align-items: baseline;
}
.luecken td { margin: 0; text-align: right; }
.luecken .datenzeile { justify-content: flex-end; }

.luecken tr.kopf { font-size: .8125rem; color: var(--gedaempft); font-family: var(--sans); }
.luecken tr.kopf th { font-weight: 500; }


.regelwerk { margin: 1rem 0; }
.regelwerk > summary {
  cursor: pointer;
  padding: .7rem .9rem;
  border-radius: var(--rad-klein);
  background: var(--flaeche2);
  box-shadow: var(--ring-kontur);
  font-family: var(--sans);
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 .75rem;
}
.regelwerk > summary::marker { color: var(--kante); }
.regelwerk[open] > summary { border-radius: var(--rad-klein) var(--rad-klein) 0 0; }
.regelwerk .anzahl {
  font-family: var(--mono);
  font-size: .8125rem;
  font-weight: 400;
  color: var(--gedaempft);
}
.regelwerk-leib { padding: .8rem 0 0; }


.suchklappe > summary > h2 {
  margin: 0;
  font: inherit;
  min-width: 0;
  overflow-wrap: anywhere;
}

.suchklappe > .aufklapp-leib > h3:first-child { margin-top: .2rem; }


.suchhilfe { margin: 1rem 0; }
.suchhilfe ul { margin: .6rem 0; padding-left: 1.25rem; }
.suchhilfe li { margin: .3rem 0; font-family: var(--sans); }

.suchbeispiele {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: .6rem 0 0;
  padding: 0;
  list-style: none;
}
.suchbeispiele li { margin: 0; }
.suchbeispiele a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 .85rem;
  border-radius: var(--rad-pille);
  background: var(--flaeche);
  box-shadow: var(--ring);
  text-decoration: none;
}
.suchbeispiele code { font-size: .8125rem; }
@media(hover:hover){
  .suchbeispiele a:hover { box-shadow: var(--ring-kante); }
}


@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .belegkarte {
      animation: kante-an linear forwards;
      animation-timeline: view();
      animation-range: entry 0% entry 45%;
    }
  }
}
@keyframes kante-an {
  from { box-shadow: 0 0 0 1px var(--kante); }
}

@media (max-width: 640px) {
  .belegraster { grid-template-columns: 1fr; }
  .abgabe-wege { gap: .5rem; }
}




main > h2{margin:3rem 0 1rem}

.buehne .suchzusatz{margin:1rem 0 .3rem}
.buehne .lagezeile{margin:0}
main > .buehne{margin-bottom:3rem}
main > .entwicklerflaeche,main > .stromleiste{margin-top:3rem}



.buehne{display:flex;flex-direction:column;align-items:center;text-align:center;
padding:clamp(1.6rem,.8rem + 2.2vw,2.25rem) 0 0}
.buehne-text{display:flex;flex-direction:column;align-items:center;width:100%;
max-width:46rem}

.buehne h1{font-size:clamp(3rem,1.6rem + 3.6vw,4.75rem);letter-spacing:-.04em;
line-height:1.02;max-width:16ch;margin:0 0 1rem}
.buehne .anriss{max-width:36rem;margin:0 0 1.6rem;text-wrap:balance}


.grossesuche{display:flex;align-items:center;gap:.4rem;width:100%;max-width:38rem;
margin:0;padding:.3rem .3rem .3rem 1.15rem;background:var(--flaeche);
border-radius:var(--rad-gross);box-shadow:var(--ring-kontur);
transition:box-shadow var(--takt) var(--kurve)}
.grossesuche:focus-within{box-shadow:0 0 0 2px var(--flaeche),0 0 0 4px var(--kante)}

.grossesuche input[type=search]{flex:1 1 auto;width:100%;
min-width:0;max-width:none;field-sizing:fixed;min-height:54px;
padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;
font:400 1.0625rem/1.3 var(--sans);color:var(--tinte)}
.grossesuche input[type=search]:focus,.grossesuche input[type=search]:focus-visible{
box-shadow:none;outline:0;background:transparent}
.grossesuche input[type=search]::placeholder{color:var(--gedaempft);opacity:1}
.grossesuche button{flex:none;min-height:48px;margin:0;padding:0 1.6rem;
border:0;border-radius:calc(var(--rad-gross) - 4px);background:var(--kante);
color:var(--auf);font:600 var(--satz-feld) var(--sans);box-shadow:none;
filter:none;transform:none}


.suchzusatz{margin:.85rem 0 0;font:400 var(--satz-bedienung) var(--sans);
color:var(--gedaempft);max-width:32rem}
.suchzusatz code{font-size:.95em}


.lagezeile{margin:1.5rem 0 0;font:400 var(--satz-bedienung) var(--sans);
color:var(--gedaempft);max-width:none}
.lagezeile b{color:var(--tinte);font-weight:600;font-variant-numeric:tabular-nums}
.lagezeile time{font-family:var(--mono);font-variant-numeric:tabular-nums}
.lagezeile span[aria-hidden]{margin:0 .5rem;color:var(--linie2)}



.spur{margin:clamp(1.4rem,.8rem + 2vw,2.2rem) 0 0;width:100%;max-width:38rem;
display:flex;flex-direction:column;align-items:center;gap:.9rem}
.spurbild{width:100%;height:auto;display:block;overflow:visible}
.spur-bahn{fill:none;stroke:var(--linie2);stroke-width:1.5}
.spur-fluss{fill:none;stroke:var(--kante);stroke-width:2;stroke-linecap:round;
stroke-dasharray:.06 .94;stroke-dashoffset:0;
animation:spurfluss 8.5s linear infinite}
.spur-fluss-1{animation-delay:0s}
.spur-fluss-2{animation-delay:-1.4s}
.spur-fluss-3{animation-delay:-2.8s}
.spur-fluss-4{animation-delay:-4.2s}
.spur-fluss-5{animation-delay:-5.6s}
.spur-fluss-6{animation-delay:-7s}
@keyframes spurfluss{from{stroke-dashoffset:1}}

.spur-anfrage{fill:var(--flaeche);stroke:var(--kontur);stroke-width:1.5}
.spur-anfragezeile{fill:none;stroke:var(--linie2);stroke-width:2.5;
stroke-linecap:round}
.spur-kern{fill:var(--kante2);stroke:var(--kante);stroke-width:1.5}
.spur-kernpunkt{fill:var(--kante)}

.spur-treffer{fill:var(--flaeche2);stroke:var(--linie2);stroke-width:1.5}
.spur-treffer-2{fill:var(--kante2);stroke:var(--kante);stroke-width:2}

.spur-aufbau{fill:var(--flaeche);stroke:var(--kontur);stroke-width:1.5}
.spur-aufbauzeile{fill:none;stroke:var(--kante);stroke-width:2.5;
stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
@supports(animation-timeline:view()){
  .spur-aufbauzeile{animation:spurzeile linear forwards;
  animation-timeline:view();animation-range:entry 10% cover 40%}
  .spur-aufbauzeile-2{animation-delay:0s}
}
@keyframes spurzeile{from{stroke-dashoffset:1}}

.spurworte{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
gap:.65rem;margin:0;font:500 var(--satz-bedienung) var(--sans);color:var(--tinte2)}
.spurworte span[aria-hidden]{color:var(--kontur)}



.aufgabenraster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
gap:.75rem;margin:0}
.aufgabe{display:grid;grid-template-columns:auto 1fr;align-items:center;
column-gap:.8rem;row-gap:.1rem;
padding:1rem 1.1rem;background:var(--flaeche2);border-radius:var(--rad);
color:var(--tinte);text-decoration:none;
transition:transform var(--takt) var(--kurve),background-color var(--takt) var(--kurve)}
.aufgabe-zeichen{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;
border-radius:var(--rad-knopf);background:var(--flaeche);color:var(--kante)}
.aufgabe-titel{font:640 var(--satz-feld) var(--sans);letter-spacing:-.014em;
align-self:end}
.aufgabe-zahl{align-self:start;font:500 var(--satz-bedienung) var(--sans);
color:var(--gedaempft);font-variant-numeric:tabular-nums}



.dreiweg{position:relative;display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0;padding:0;
list-style:none;counter-reset:none;max-width:none}
.dreiweg li{margin:0;display:flex}
.dreiweg::before{content:"";position:absolute;z-index:0;left:12%;right:12%;top:2.85rem;
height:2px;background:repeating-linear-gradient(90deg,
var(--linie2) 0 6px,transparent 6px 12px)}
.wegkarte{position:relative;z-index:1;flex:1 1 auto;
display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;
padding:1.2rem 1.3rem 1.3rem;background:var(--flaeche);border-radius:var(--rad-gross);
box-shadow:var(--ring);color:var(--tinte);text-decoration:none;
transition:transform var(--takt) var(--kurve),box-shadow var(--takt) var(--kurve)}

.wegkarte-nr{display:grid;place-items:center;width:28px;height:28px;
border-radius:var(--rad-pille);background:var(--kante);color:var(--flaeche);
font:600 var(--satz-etikett) var(--mono);font-variant-numeric:tabular-nums}
.wegkarte-zeichen{color:var(--kante)}
.wegkarte-titel{font:640 var(--satz-titel) var(--sans);letter-spacing:-.018em}
.wegkarte-satz{font:400 var(--satz-feld) var(--sans);color:var(--tinte2)}


.vorschau{display:flex;flex-direction:column;align-items:flex-start;gap:.6rem;
padding:1.4rem clamp(1.25rem,.6rem + 1.6vw,2rem);
background:var(--flaeche);border-radius:var(--rad-gross);box-shadow:var(--ring)}
.vorschau-name{font:660 var(--satz-wert) var(--sans);letter-spacing:-.022em;
color:var(--tinte);text-decoration:none}
.vorschau-marken{display:flex;flex-wrap:wrap;gap:.4rem;margin:0}
.vorschau-marke{padding:.25rem .7rem;border-radius:var(--rad-pille);
background:var(--flaeche2);color:var(--tinte2);
font:500 var(--satz-bedienung) var(--sans)}
.vorschau-satz{margin:0;max-width:var(--satzbreite);color:var(--tinte2)}
.vorschau-belege{margin:0;font:500 var(--satz-bedienung) var(--sans);
color:var(--gedaempft);font-variant-numeric:tabular-nums}
.vorschau-wege{display:flex;flex-wrap:wrap;gap:.5rem;margin:.35rem 0 0}


.belegprobe{margin:0 0 1rem;padding:.9rem 1.15rem;background:var(--flaeche);
border-radius:var(--rad);max-width:36rem}
.belegprobe-wert{display:block;font:600 var(--satz-titel) var(--sans);
letter-spacing:-.015em;color:var(--tinte)}
.belegprobe-herkunft{margin-top:.35rem;font:400 var(--satz-bedienung) var(--mono);
color:var(--gedaempft)}


.stromleiste{padding:1.25rem clamp(1.1rem,.6rem + 1.2vw,1.75rem);
background:var(--flaeche2);border-radius:var(--rad-gross)}

.stromleiste h2{margin:0 0 .6rem;font:650 var(--satz-etikett) var(--sans);
letter-spacing:.11em;text-transform:uppercase;color:var(--gedaempft)}
.stromzeilen{margin:0;padding:0;list-style:none;max-width:none;
display:flex;flex-direction:column;gap:.35rem}
.stromzeilen li{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .7rem;
margin:0;font:400 var(--satz-bedienung) var(--sans);line-height:1.45}
.stromzeilen time{flex:none;color:var(--gedaempft);font-variant-numeric:tabular-nums}
.stromzeilen a{font-weight:600}
.stromzeilen .herkunft{color:var(--tinte2)}


.entwicklerflaeche{padding:1.4rem clamp(1.1rem,.6rem + 1.2vw,1.75rem);
background:var(--flaeche2);border-radius:var(--rad-gross)}
.entwicklerflaeche h2{margin:0 0 .9rem;font:640 var(--satz-titel) var(--sans);
letter-spacing:-.018em}
.entwicklerflaeche .leise{margin:.75rem 0 0}
.stromleiste .leise{margin:.6rem 0 0}


.probefragen{display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;
margin:.85rem 0 0;padding:0;list-style:none;max-width:38rem}
.probefragen li{margin:0}

.probefragen a{display:inline-block;padding:.4rem .85rem;
border-radius:var(--rad-pille);background:var(--flaeche2);color:var(--tinte);
border:1px solid var(--kante);
font:500 var(--satz-bedienung) var(--sans);text-decoration:none;
transition:background-color var(--takt) var(--kurve),color var(--takt) var(--kurve),
border-color var(--takt) var(--kurve)}

.probefragen-ansage{margin:.85rem 0 0;color:var(--tinte2);
font:400 var(--satz-klein) var(--sans)}
.probefragen-ansage + .probefragen{margin-top:.45rem}


.belegflaeche{position:relative;isolation:isolate;overflow:hidden;
padding:2rem clamp(1.25rem,.5rem + 2vw,2.5rem);
background:var(--flaeche2);border-radius:var(--rad-gross)}
.belegflaeche::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
background-image:linear-gradient(var(--raster) 1px,transparent 1px),
linear-gradient(90deg,var(--raster) 1px,transparent 1px);
background-size:var(--gitter) var(--gitter);
-webkit-mask-image:radial-gradient(80% 120% at 50% 0,#000 0%,transparent 78%);
mask-image:radial-gradient(80% 120% at 50% 0,#000 0%,transparent 78%)}

.belegstufen{display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;margin:0 0 1.25rem;
padding:0;list-style:none;max-width:none}
.belegstufen li{display:flex;align-items:center;gap:.55rem;margin:0;
font:600 var(--satz-feld) var(--sans);color:var(--tinte)}

.belegstufe-wort::first-letter{text-transform:uppercase}
.belegstufe-nr{display:grid;place-items:center;width:24px;height:24px;flex:none;
border-radius:var(--rad-pille);background:var(--kante2);color:var(--kante);
font:600 var(--satz-etikett) var(--mono);font-variant-numeric:tabular-nums}
.belegsatz{margin:0 0 1.1rem;max-width:36rem}


.entwicklerraster{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));
gap:.75rem}
.entwicklerweg{display:flex;flex-direction:column;gap:.25rem;padding:.9rem 1.1rem;
background:var(--flaeche2);border-radius:var(--rad);color:var(--tinte);
text-decoration:none;transition:background-color var(--takt) var(--kurve)}
.entwicklerweg-titel{display:flex;align-items:center;gap:.55rem;
font:640 var(--satz-feld) var(--sans)}
.entwicklerweg-titel code{padding:.1rem .4rem;border-radius:var(--rad-klein);
background:var(--flaeche);color:var(--gedaempft);font-size:.75rem;line-height:1.5}
.entwicklerweg-satz{font:400 var(--satz-bedienung) var(--sans);color:var(--tinte2)}

@media(hover:hover){
  .aufgabe:hover{background:var(--kante2);transform:translateY(-2px)}
  .aufgabe:hover .aufgabe-zeichen{background:var(--flaeche)}
  .wegkarte:hover{box-shadow:var(--ring-kante);transform:translateY(-2px)}
  .entwicklerweg:hover{background:var(--flaeche)}
  .grossesuche button:hover{filter:brightness(.92)}
  .probefragen a:hover{background:var(--kante2);color:var(--tinte);border-color:var(--tinte2)}
  .vorschau-name:hover{text-decoration:underline}
  .stromzeilen a:hover{text-decoration:underline}
}

@media(max-width:1000px){
  .aufgabenraster{grid-template-columns:repeat(2,minmax(0,1fr))}
}


@media(max-width:820px){
  .dreiweg{grid-template-columns:1fr}
  .dreiweg::before{display:none}
}

@media(max-width:640px){
  .buehne{padding-top:1.75rem}
  .buehne h1{font-size:clamp(2.2rem,1.2rem + 4.5vw,3rem)}
  .grossesuche{padding:.3rem .3rem .3rem .9rem;flex-wrap:wrap}
  .grossesuche input[type=search]{min-height:48px;font-size:1rem}
  .grossesuche button{flex:1 1 100%;min-height:46px}
  .aufgabenraster,.dreiweg,.entwicklerraster{grid-template-columns:1fr}
  .probefragen{gap:.35rem}
  .vorschau-wege{flex-direction:column;align-items:stretch}
  .stromleiste,.entwicklerflaeche{padding:1.25rem 1.1rem}
  .belegflaeche{padding:1.75rem 1.1rem}
  .belegstufen{gap:.5rem 1rem}
}


@media(max-width:1000px){
  .kopfsuche input[type=search]{min-width:8rem;max-width:11rem}
  :root{--klebehoehe:150px}
}
@media(max-width:820px){
  
  
  .kopf{display:flex;flex-wrap:nowrap;align-items:center;gap:.5rem;
  padding:.5rem .8rem}
  .menueknopf{order:0;width:auto;flex:none;display:flex;align-items:center;gap:.5rem;
  justify-content:flex-start;min-height:42px;padding:0;border:0;background:transparent;
  color:var(--tinte);font:400 var(--satz-bedienung) var(--sans);cursor:pointer;
  margin:0;border-radius:0;box-shadow:none;filter:none;transform:none}
  .menue-marke{display:inline-flex;align-items:center;font:400 1.08rem/1 var(--mono);
  letter-spacing:-.025em}
  .menue-marke .signet{width:19px;height:19px;margin-right:.5rem;color:var(--kante)}
  .menue-marke b{font-weight:700}.menue-marke span{color:var(--gedaempft)}
  .menue-befehl{display:inline-flex;align-items:center;gap:.45rem;min-height:36px;
  padding:0 .45rem 0 .8rem;border-radius:var(--rad-pille);box-shadow:var(--ring-kontur);
  color:var(--tinte2);background:var(--flaeche)}
  .menue-text{display:none}
  .menue-befehl{padding:0 .3rem}
  .menue-marke span{display:none}
  .menue-symbol{display:grid;place-items:center;width:27px;height:27px;
  border-radius:var(--rad-pille);background:var(--kante2);
  font:600 var(--satz-bedienung) var(--mono);color:var(--kante)}
  .menueknopf:active{transform:none}
  @media(hover:hover){.menueknopf:hover{filter:none;transform:none;box-shadow:none}}
  .kopfsuche{order:1;flex:1 1 auto;min-width:0;margin:0}
  .kopfsuche input[type=search]{width:100%;max-width:none;min-width:0;min-height:40px}
  
  .kopf nav[popover]:not(:popover-open){display:none}
  .kopf nav[popover]:popover-open{position:fixed;inset:7.2rem 1rem auto;
  width:auto;height:auto;max-height:calc(100dvh - 8.2rem);margin:0;padding:.65rem;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.25rem;
  overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:var(--rad-gross);
  background:var(--flaeche);color:var(--tinte);
  box-shadow:var(--ring-kontur),var(--schatten-hoch),var(--schatten-leucht);
  opacity:1;translate:0 0;
  transition:opacity var(--takt) var(--kurve),translate var(--takt-weit) var(--kurve),
  display var(--takt-weit) allow-discrete,overlay var(--takt-weit) allow-discrete}
  @starting-style{.kopf nav[popover]:popover-open{opacity:.01;translate:0 -10px}}
  .kopf nav[popover]::backdrop{background:color-mix(in oklab,var(--tinte) 24%,transparent);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
  .kopf nav[popover] a{min-height:48px;padding:.65rem .75rem;border-radius:var(--rad);
  background:var(--flaeche2);white-space:normal}
  .kopf nav[popover] a::after{left:.75rem;right:.75rem;bottom:7px}
  .menuekopf{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;min-height:44px;padding:.1rem .2rem .55rem .55rem;
  box-shadow:0 1px 0 var(--linie);font:500 var(--satz-bedienung) var(--mono);
  color:var(--gedaempft)}
  .menuekopf > span{display:inline-flex;align-items:center;gap:.35rem}
  .menuekopf b{color:var(--tinte)}
  .menuekopf button{display:grid;place-items:center;width:36px;min-height:36px;margin:0;
  padding:0;border:0;border-radius:var(--rad-pille);background:var(--kante2);
  color:var(--kante);box-shadow:none;filter:none;transform:none;font:500 1.25rem/1 var(--mono)}
  .kopf nav[popover] a.marke{grid-column:1/-1;margin:0;background:transparent;
  box-shadow:0 1px 0 var(--linie);border-radius:0}
  .kopf nav[popover] a.marke[aria-current]{background:var(--kante2);
  box-shadow:inset 3px 0 var(--kante),0 1px 0 var(--linie)}
  
  
  :root{--klebehoehe:60px}
}
@media(max-width:480px){
  .kopf nav[popover]:popover-open{grid-template-columns:1fr}
  .kopf nav[popover] a.marke{grid-column:1}
}
@supports((mask-image:linear-gradient(#000,#000)) or (-webkit-mask-image:linear-gradient(#000,#000))){
  
  nav[aria-label].themenband,nav.themenband ul{
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 2.2rem),transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 2.2rem),transparent 100%)}

  
  .umbruch,.matrix,.vergleich,pre.ausgabe{
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - var(--randausblendung)),transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - var(--randausblendung)),transparent 100%)}
}


@property --randausblendung{syntax:"<length>";inherits:false;initial-value:0px}
@supports(animation-timeline:scroll(self inline)){
  @keyframes randmass{from{--randausblendung:1.6rem}to{--randausblendung:1.6rem}}
  .umbruch,.matrix,.vergleich,pre.ausgabe{animation:randmass linear both;
  animation-timeline:scroll(self inline)}
}
@media(max-width:640px){
  main{padding:1.85rem 1rem 3.5rem}
  .kopf,.fussinnen,.fussrand{padding-left:1rem;padding-right:1rem}
  .kopfsuche input[type=search]{min-height:44px}
  
  form p > label{flex:1 1 100%}
  form select,form input[type=text],form input[type=search],form input[type=number]{
  max-width:none;width:100%;min-height:44px}
  
  
  h2{margin-top:var(--luft-block)}
  p{font-size:1rem}
  .konsole-leib{font-size:.78rem}
  .fussspruch{margin-left:0;flex-basis:100%}
  
  .merkmale tr,.strom tr,.regeln tr{grid-template-columns:minmax(0,1fr);gap:0}
  .merkmale th,.regeln th{margin-bottom:.2rem}
  .strom th{margin-bottom:.25rem}
  .strom th.fortsetzung{margin-bottom:0}
  .strom th.fortsetzung::before{content:none}
}


@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  
  .umbruch,.matrix,.vergleich,pre.ausgabe{animation:randmass linear both!important;
  animation-timeline:scroll(self inline)!important}
}

@media(forced-colors:active){
  .kachel,.karte,table,form,fieldset,.konsole,.band,pre.ausgabe,select,input,button,
  .marken a,.wege a,nav[aria-label] a{outline:1px solid CanvasText}
  .balken::before,.matrix td{background:Highlight}
  .kopf nav a::after{background:CanvasText}
  .datenbild .flaeche-belegt{fill:Highlight}
  .datenbild .flaeche-rest{fill:Canvas;stroke:CanvasText}
}

@media print{
  
  .tippen{animation:none}
  header,footer,.betrieb-abschnitte,form,.wege,.sprungmarke{display:none}
  main{max-width:none;padding:0;display:flex;flex-direction:column}
  .druckkopf{display:block;order:-3;margin:0 0 .6rem;
  font:400 var(--satz-etikett) var(--mono);font-variant-ligatures:none;
  color:var(--gedaempft)}
  h1{order:-2}
  .marken,nav[aria-label]{order:-1}
  .marken{display:flex;margin-bottom:.4rem}
  .marken a{box-shadow:none;background:none;padding-left:0}
  .marken a::after{content:none}
  nav[aria-label]{display:block;margin:0 0 1.2rem}
  nav[aria-label] a,nav[aria-label] strong,nav[aria-label] .auslassung{display:none}
  nav[aria-label] .herkunft{display:block;margin:0}
  .kachel,table,.karte,.konsole{box-shadow:none;break-inside:avoid}
  .kachel,.karte,table,pre.ausgabe{border:1px solid var(--linie)}
  
  .konsole-leib{-webkit-mask-image:none;mask-image:none}
  
  .umbruch,.matrix,.vergleich,pre.ausgabe{-webkit-mask-image:none;mask-image:none}
  
  .konsole-leib,pre.ausgabe,.umbruch,.matrix,.vergleich,table{overflow:visible}
  .konsole-zeile,pre.ausgabe{white-space:pre-wrap;overflow-wrap:anywhere}
  
  .vergleich table,.matrix table{min-width:0}
  .vergleich tr th:first-child{min-width:0}
  .vergleich th,.vergleich td,.matrix th,.matrix td{overflow-wrap:anywhere}
}