@import url("vishnu-kit-tokens.css");   


:root{
  --t-grund:#fbf9f4; --t-flaeche:#f3ede1; --t-flaeche2:#ffffff; --t-linie:#e2d8c4; --t-linie2:#c9bb9d;
  --t-text:#26211a; --t-leise:#615849;
  --t-haupt:#4f3a1c; --t-auf-haupt:#ffffff; --t-haupt-leise:#e9d9b8;
  --t-zweit:#4a6829; --t-zweit-leise:#e3ead3;
  --t-gold:#7a5d0e; --t-gold-leise:#f3e6bd;
  --t-warn:#8a3b22; --t-warn-leise:#f3ddd3;
  --t-sand:#6b5f47; --t-sand-leise:#ebe3d0;

  
  --d-1:#4a6829; --d-2:#a8691f; --d-3:#3d5566; --d-4:#8a3b22; --d-5:#6b5f47; --d-6:#2f6f5a;
  --d-ziel:var(--t-gold); --d-raster:var(--t-linie); --d-leise:var(--t-linie2);

  
  --m-kurz:160ms; --m-mittel:420ms; --m-lang:900ms;
  --m-ease:cubic-bezier(.2,.7,.2,1); --m-ease-aus:cubic-bezier(.4,0,.2,1);
  --m-stufe:70ms;   

  
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --sans:Inter,'Segoe UI',system-ui,-apple-system,Arial,sans-serif;
}
[data-theme="dark"]{
  
  --t-grund:#0b1222; --t-flaeche:#121c33; --t-flaeche2:#182542; --t-linie:#243154; --t-linie2:#35466e;
  --t-text:#eef1f8; --t-leise:#a9b2c7;
  --t-haupt:#e9d9b8; --t-auf-haupt:#26211a; --t-haupt-leise:#2e2518;
  --t-zweit:#a9c77a; --t-zweit-leise:#1d2e14;
  --t-gold:#d9b25a; --t-gold-leise:#302a14;
  --t-warn:#e39a7c; --t-warn-leise:#3d2018;
  --t-sand:#cdbf9a; --t-sand-leise:#2e2518;
  
  --d-1:#a9c77a; --d-2:#e2a65c; --d-3:#9cc0cf; --d-4:#e0957a; --d-5:#cdbf9a; --d-6:#8fc4a8;
}


@keyframes erdeWachsenY{from{transform:scaleY(0)}}
@keyframes erdeWachsenX{from{transform:scaleX(0)}}
@keyframes erdeRein{from{opacity:0;transform:translateY(6px)}}
@keyframes erdeStrich{from{stroke-dashoffset:var(--ed-len,400)}}
@keyframes erdePuls{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:.9;transform:scale(1.18)}}
.m-rein{animation:erdeRein var(--m-mittel) var(--m-ease) both;animation-delay:calc(var(--i,0) * var(--m-stufe))}


.ed{display:block;width:100%;color:var(--t-text);font-variant-numeric:tabular-nums}
.ed svg{display:block;width:100%;overflow:visible}
.ed-titel{font-size:11.5px;color:var(--t-leise);margin:0 0 6px;display:flex;gap:8px;align-items:baseline}
.ed-titel b{color:var(--t-text);font-weight:600}
.ed-quelle{font-size:10.5px;color:var(--t-leise);margin-top:4px}


.ed.ed-inline{display:inline-flex;gap:8px;align-items:center;width:auto}.ed-inline .ed-titel{margin:0}
.ed .ed-spark{display:inline-block;width:96px;height:26px;vertical-align:middle}
.ed-spark polyline{fill:none;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.ed-spark .ed-flaeche{stroke:none;opacity:.14}
.ed-spark .ed-letzter{stroke:var(--t-grund);stroke-width:1.5}
.ed-spark.ed-an polyline:not(.ed-flaeche){stroke-dasharray:var(--ed-len,400);animation:erdeStrich var(--m-lang) var(--m-ease) both}


.ed-balken rect.ed-b{transform-box:fill-box;transform-origin:bottom}
.ed-balken.ed-an rect.ed-b{animation:erdeWachsenY var(--m-lang) var(--m-ease) both;animation-delay:calc(var(--i,0) * 18ms)}
.ed-balken .ed-achse{stroke:var(--d-raster);stroke-width:1;vector-effect:non-scaling-stroke}
.ed-balken .ed-ziellinie{stroke:var(--d-ziel);stroke-width:1.2;stroke-dasharray:3 3;vector-effect:non-scaling-stroke;fill:none}


.ed-trichter{display:grid;gap:5px}
.ed-stufe{display:grid;grid-template-columns:minmax(84px,auto) 1fr auto;gap:10px;align-items:center;font-size:12.5px}
.ed-stufe .ed-name{color:var(--t-leise);white-space:nowrap}
.ed-stufe .ed-spur{height:14px;background:var(--t-sand-leise);border-radius:4px;overflow:hidden}
.ed-stufe .ed-fuell{display:block;height:100%;border-radius:4px;background:var(--ed-farbe,var(--d-1));transform-origin:left}
.ed-trichter.ed-an .ed-fuell{animation:erdeWachsenX var(--m-lang) var(--m-ease) both;animation-delay:calc(var(--i,0) * var(--m-stufe))}
.ed-stufe .ed-wert{font-weight:600;min-width:2.5ch;text-align:right}
.ed-stufe .ed-quote{color:var(--t-leise);font-weight:400;font-size:11px;margin-left:4px}
[dir="rtl"] .ed-stufe .ed-fuell{transform-origin:right}


.ed-zielband{position:relative;height:16px}
.ed-zielband .ed-spur{position:absolute;inset:6px 0;background:var(--t-sand-leise);border-radius:2px}
.ed-zielband .ed-korridor{position:absolute;top:4px;bottom:4px;border:1px solid var(--d-ziel);border-radius:3px;background:var(--t-gold-leise)}
.ed-zielband .ed-punkt{position:absolute;top:2px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--ed-farbe,var(--d-1));
  border:2px solid var(--t-grund);transition:left var(--m-lang) var(--m-ease)}


.ed-zahl{font-variant-numeric:tabular-nums}


.m-puls{animation:erdePuls 2.4s var(--m-ease-aus) infinite;transform-box:fill-box;transform-origin:center}




@media (prefers-reduced-motion:reduce){
  :root{--m-kurz:1ms;--m-mittel:1ms;--m-lang:1ms;--m-stufe:0ms}
  .m-rein,.m-puls,.ed-an *,.ed-an{animation:none !important}
  .erde-banner>video.erde-video{display:none}
}