/* udiman — «Radarschirm in Kupfer». Bauweise nach BIS-Radar (mobile first 375 px, Tabbar unten, Seitenleiste ab 900 px),
   eigene Farben: Kupfer auf Graphit. Farben NUR als Tokens auf :root — außerhalb dieses Blocks steht keine Hex-Zahl.
   Bewegung gibt es genau einmal: der Sweep im Scope beim Laden (Kopfzeile bzw. Radar der Anmeldeseite). */

@font-face{font-family:"Unbounded";font-weight:600;font-display:swap;src:url(/static/s/unbounded-600.woff2) format("woff2")}
@font-face{font-family:"Unbounded";font-weight:800;font-display:swap;src:url(/static/s/unbounded-800.woff2) format("woff2")}
@font-face{font-family:"Golos Text";font-weight:400;font-display:swap;src:url(/static/s/golos-400.woff2) format("woff2")}
@font-face{font-family:"Golos Text";font-weight:600;font-display:swap;src:url(/static/s/golos-600.woff2) format("woff2")}
@font-face{font-family:"Martian Mono";font-weight:400;font-display:swap;src:url(/static/s/martian-400.woff2) format("woff2")}
@font-face{font-family:"Martian Mono";font-weight:600;font-display:swap;src:url(/static/s/martian-600.woff2) format("woff2")}

:root{
  --bg:#0e0f12; --panel:#15171c; --panel-2:#1b1e25; --line:#262a33; --line-2:#323744;
  --ink:#eef0f3; --ink-2:#c5c9d2; --muted:#8b91a0;
  --akzent:#f08a3c; --akzent-ink:#0e0f12; --akzent-soft:rgba(240,138,60,.12); --akzent-text:#f08a3c;
  --eis:#5cc8ff; --eis-soft:rgba(92,200,255,.14);
  --spielen:#3ddc84; --schatten:#ffd166; --beobachten:var(--schatten); --nie:#ff5c5c;
  --grid:rgba(240,138,60,.035); --schatten-tief:0 18px 50px -20px rgba(0,0,0,.8); --schleier:rgba(0,0,0,.55);
  --r:14px; --gut:16px; --tabh:64px;
  --f-d:"Unbounded","Golos Text",system-ui,sans-serif;
  --f-b:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-m:"Martian Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  color-scheme:dark;
}
/* Hell: Akzent, Eis und Spielen auf ≥ 4,5:1 gegen --bg #f3f1ec (Stufe 1, Punkt 8; F3 maß 4,36 / 4,42 / 4,09):
   #a64f17 4,96 · #0a6ea3 4,93 · #127a42 4,78 — gegen --panel #fff jeweils > 5,3. */
:root[data-theme="light"]{
  --bg:#f3f1ec; --panel:#ffffff; --panel-2:#f8f6f1; --line:#e2ded5; --line-2:#d0cabd;
  --ink:#16181d; --ink-2:#2f333b; --muted:#646a76;
  --akzent:#f08a3c; --akzent-ink:#16181d; --akzent-soft:rgba(166,79,23,.10); --akzent-text:#a64f17;
  --eis:#0a6ea3; --eis-soft:rgba(10,110,163,.13);
  --spielen:#127a42; --schatten:#946200; --nie:#c62828;
  --grid:rgba(22,24,29,.045); --schatten-tief:0 18px 40px -24px rgba(40,25,0,.35); --schleier:rgba(20,15,5,.35);
  color-scheme:light;
}
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]){
    --bg:#f3f1ec; --panel:#ffffff; --panel-2:#f8f6f1; --line:#e2ded5; --line-2:#d0cabd;
    --ink:#16181d; --ink-2:#2f333b; --muted:#646a76;
    --akzent-ink:#16181d; --akzent-soft:rgba(166,79,23,.10); --akzent-text:#a64f17;
    --eis:#0a6ea3; --eis-soft:rgba(10,110,163,.13);
    --spielen:#127a42; --schatten:#946200; --nie:#c62828;
    --grid:rgba(22,24,29,.045); --schatten-tief:0 18px 40px -24px rgba(40,25,0,.35); --schleier:rgba(20,15,5,.35);
    color-scheme:light;
  }
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0; min-height:100dvh; font:400 15px/1.45 var(--f-b); color:var(--ink);
  background-color:var(--bg);
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px),
    radial-gradient(120% 60% at 50% -10%,var(--akzent-soft),transparent 60%);
  background-size:28px 28px,28px 28px,100% 100%;
  background-attachment:fixed;
  padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 12px);
  overflow-x:hidden;
}
.grain{position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--akzent-text);outline-offset:2px;border-radius:6px}
.mono{font-family:var(--f-m);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.leise{color:var(--muted)} .klein{font-size:12px}
.akz{color:var(--akzent-text)} .eis{color:var(--eis)}
/* W8 Pinnacle: Farbe nur als Urteil in Tabellenzellen (KI ganz über/unter null) */
.tafel td.gut{color:var(--spielen)} .tafel td.schlecht{color:var(--nie)} .tafel td.eis{color:var(--eis)}
p{margin:0 0 8px}

/* ------------------------------------------------------------ Kopfzeile */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;
  padding:calc(10px + env(safe-area-inset-top)) var(--gut) 10px;
  background:color-mix(in oklab,var(--bg) 82%,transparent);backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line)}
.marke{display:flex;align-items:center;gap:10px;margin-right:auto;min-width:0}
.marke-t{display:flex;align-items:baseline;gap:8px;font:600 13px/1 var(--f-d);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.marke-t b{color:var(--akzent-text);font-weight:800}
.marke-t small{font:400 10px/1 var(--f-m);letter-spacing:.04em;text-transform:none;color:var(--muted)}
.ich{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;
  font:800 13px var(--f-d);text-transform:uppercase;background:var(--panel-2);border:1px solid var(--line-2)}
.stand{display:none;align-items:center;gap:7px;font:400 10.5px/1 var(--f-m);color:var(--muted);white-space:nowrap}
.stand i{width:7px;height:7px;border-radius:50%;background:var(--muted)}
.stand.ok i{background:var(--spielen);box-shadow:0 0 8px var(--spielen)}
.stand.fehler i{background:var(--nie);box-shadow:0 0 8px var(--nie)}
@media (min-width:520px){.stand{display:inline-flex}}
.probe{margin:0;padding:6px var(--gut);font:600 11px var(--f-m);text-align:center;background:var(--schatten);color:var(--akzent-ink)}

/* Scope — die Signatur. Kreise + Sweep, EINMAL beim Laden; sonst steht alles. */
.scope{position:relative;width:28px;height:28px;border-radius:50%;flex:none;
  border:1.5px solid var(--akzent-text);
  background:radial-gradient(circle,var(--akzent-text) 0 2px,transparent 2.5px),
    radial-gradient(circle,transparent 0 6px,color-mix(in oklab,var(--akzent-text) 45%,transparent) 6.5px 7px,transparent 7.5px);
  overflow:hidden}
.scope i{position:absolute;inset:0;border-radius:50%;opacity:0;
  background:conic-gradient(from 0deg,transparent 0 280deg,color-mix(in oklab,var(--akzent) 75%,transparent) 360deg)}
.top .scope i{animation:sweep 1.8s cubic-bezier(.5,.1,.3,1) .15s 1 both}
@keyframes sweep{from{transform:rotate(-90deg);opacity:1}85%{opacity:1}to{transform:rotate(270deg);opacity:0}}
.scope.gross{width:56px;height:56px;border-width:2px;opacity:.85}

/* ------------------------------------------------------------ Tabbar */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(5,1fr);
  height:calc(var(--tabh) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);
  background:color-mix(in oklab,var(--panel) 88%,transparent);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);border-top:1px solid var(--line)}
.tabs a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  font:600 9.5px/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);min-height:44px}
.tabs svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tabs a.an{color:var(--ink)}
.tabs a.an::before{content:"";position:absolute;top:0;left:28%;right:28%;height:2px;border-radius:0 0 2px 2px;
  background:var(--akzent);box-shadow:0 0 12px var(--akzent)}
.tabs a.an svg{stroke:var(--akzent-text)}

/* ------------------------------------------------------------ Layout */
.wrap{max-width:760px;margin:0 auto;padding:14px var(--gut) 24px;outline:none}
.hud{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 14px;margin:6px 0 16px}
.hud h1{margin:0;font:800 clamp(26px,8vw,38px)/1 var(--f-d);letter-spacing:-.03em;text-transform:uppercase}
.hud-l{min-width:0;max-width:100%}
.zaehl{margin:7px 0 0;color:var(--muted);font:400 11.5px/1.35 var(--f-m);letter-spacing:.01em}
.zaehl b{color:var(--ink);font-weight:600}
.zurueck{display:inline-flex;align-items:center;gap:6px;margin:0 0 6px;font:600 12px var(--f-m);color:var(--muted);min-height:32px}
.zurueck:hover{color:var(--akzent-text)}

/* Abschnittsüberschrift: Leuchtpunkt + Versalien */
.sek{display:flex;align-items:baseline;gap:10px;margin:26px 2px 10px}
.sek h2{margin:0;font:800 15px/1.1 var(--f-d);letter-spacing:.02em;text-transform:uppercase}
.sek h2::before{content:"";display:inline-block;width:7px;height:7px;margin:0 9px 2px 0;border-radius:50%;
  background:var(--akzent);box-shadow:0 0 0 4px var(--akzent-soft)}
.sek h2{flex:0 1 auto;min-width:0}
.sek .rechts{flex:0 100 auto}
.sek .rechts{margin-left:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font:400 11px var(--f-m);color:var(--muted);white-space:nowrap}
.sek .rechts a{color:var(--akzent-text)}
.hinweis{margin:-2px 2px 10px;font:400 11.5px/1.45 var(--f-b);color:var(--muted);overflow-wrap:anywhere}
h3.unter{margin:18px 2px 8px;font:600 11px/1.3 var(--f-d);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

/* ------------------------------------------------------------ Karten */
.karte{position:relative;padding:14px;margin:0 0 10px;border-radius:var(--r);background:var(--panel);
  border:1px solid var(--line);box-shadow:var(--schatten-tief)}
.karte.flach{box-shadow:none}
/* «spielen» = Kupfer-Kante: Rahmen angefärbt + leuchtender Balken links */
.karte.spielen{border-color:color-mix(in oklab,var(--akzent-text) 45%,var(--line))}
.karte.spielen::before{content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;
  background:var(--akzent);box-shadow:0 0 12px var(--akzent)}
a.karte{display:block}
a.karte:hover,button.karte:hover{border-color:var(--line-2)}
.gitter2{display:grid;gap:10px}
@media (min-width:640px){.gitter2{grid-template-columns:1fr 1fr}.gitter2>.karte{margin:0}}

/* Urteil-Plakette */
.plak{display:inline-flex;align-items:center;gap:6px;flex:none;padding:4px 8px;border-radius:6px;border:1px solid var(--line-2);
  font:600 10px/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.plak::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.plak.u-spielen,.plak.u-übernommen,.plak.u-drin,.plak.u-bestätigt{color:var(--spielen);border-color:color-mix(in oklab,var(--spielen) 50%,transparent)}
.plak.u-beobachten,.plak.u-offen,.plak.u-teilweise,.plak.u-veraltet{color:var(--schatten);border-color:color-mix(in oklab,var(--schatten) 50%,transparent)}
.plak.u-nie,.plak.u-verworfen,.plak.u-widerlegt,.plak.u-falsch-verstanden{color:var(--nie);border-color:color-mix(in oklab,var(--nie) 50%,transparent)}
.plak.u-nicht-prüfbar{color:var(--muted)}
.u-spielen{color:var(--spielen)} .u-beobachten,.u-offen{color:var(--schatten)} .u-nie{color:var(--nie)}

/* Kennzahl: groß, Einheit klein, Intervall klein daneben */
.kz{display:grid;gap:3px;min-width:0}
.kz .et{font:600 9.5px/1.2 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kz .w{font:600 24px/1.05 var(--f-m);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.kz .w small{font-size:12px;font-weight:400;color:var(--muted);letter-spacing:0;margin-left:2px}
.kz .w.eis{color:var(--eis)} .kz .w.akz{color:var(--akzent-text)}
/* nowrap ohne Kappung sprengte auf dem Handy die Karte und die Seitenbreite (F3, «13.930 Zeilen · nur Gegencheck») — wie .mk .ki */
.kz .ki{font:400 10.5px/1.3 var(--f-m);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.kzreihe{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:12px 14px}
/* Kopf der Wett-Detailseite: auf dem Handy zwei Spalten, Nebenzeile bricht um statt in die Nachbarspalte zu laufen (N4: «eröffnet 28.09., 13:51» lag auf «p 47,4 %») */
.kzreihe.kopf4{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.kzreihe.kopf4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.kzreihe.kopf4 .kz .ki{white-space:normal;overflow:visible}
.wettschein .kzreihe{margin-top:10px}
.werte-k span{display:inline-block;margin:0 10px 2px 0;font:400 11px/1.4 var(--f-m);white-space:nowrap}
.werte-k em{font-style:normal;color:var(--muted)}
.mess-regel.schnitt{margin-top:-4px}
.ki{font:400 10.5px var(--f-m);color:var(--muted);letter-spacing:-.01em}

/* ------------------------------------------------------------ Heute: Wettschein */
.schein{padding:0;overflow:hidden}
.schein-kopf{display:flex;align-items:center;gap:8px;padding:11px 14px 0;font:400 10.5px/1.2 var(--f-m);color:var(--muted)}
.schein-kopf .liga{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 10px/1.2 var(--f-m);padding:4px 6px;border-radius:5px;border:1px solid var(--akzent-text);color:var(--akzent-text);letter-spacing:.04em}
.schein-kopf .plak{margin-left:auto}
.schein-partie{padding:8px 14px 0;font:600 16px/1.3 var(--f-b)}
.schein-partie small{display:block;font:400 11px/1.4 var(--f-m);color:var(--muted);margin-top:2px}
.schein-mitte{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;align-items:end;padding:12px 14px 12px}
.schein-quote{display:grid;gap:2px}
.schein-quote .et{font:600 9.5px var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.schein-quote b{font:600 40px/1 var(--f-m);letter-spacing:-.05em;color:var(--akzent-text);font-variant-numeric:tabular-nums}
.schein-quote .markt{font:600 12.5px/1.2 var(--f-b);color:var(--ink)}
.schein-quote .jetzt{margin-top:4px;font:400 11px/1.3 var(--f-m);color:var(--muted)}
.schein-quote .jetzt b{font:600 14px/1 var(--f-m);letter-spacing:-.03em;color:var(--ink)}
.schein-quote .jetzt.weg,.schein-quote .jetzt.weg b{color:var(--nie)}
.schein-zahlen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:560px){.schein-mitte{grid-template-columns:1fr}.schein-zahlen{padding-top:10px;border-top:1px solid var(--line)}}
.schein-zahlen .kz .w{font-size:17px}
.schein-regeln{display:flex;flex-wrap:wrap;gap:5px;padding:0 14px 12px}
.regel-p{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:7px;font:400 10.5px/1 var(--f-m);
  border:1px solid var(--line-2);color:var(--ink-2);background:var(--panel-2)}
.regel-p.ja b{color:var(--spielen)} .regel-p.nein{border-color:color-mix(in oklab,var(--nie) 55%,transparent)} .regel-p.nein b{color:var(--nie)}
/* Perforation zwischen Schein und Knopf */
.schein-fuss{position:relative;display:flex;gap:8px;padding:10px 14px 12px;border-top:1px dashed var(--line-2);background:var(--panel-2)}
.schein-fuss::before,.schein-fuss::after{content:"";position:absolute;top:-9px;width:18px;height:18px;border-radius:50%;background:var(--bg)}
.schein-fuss::before{left:-10px} .schein-fuss::after{right:-10px}

/* Leer-Zustand */
.leer{display:flex;align-items:center;gap:12px;margin:0 0 10px;padding:14px;border-radius:var(--r);border:1px dashed var(--line-2);
  font:400 13.5px/1.4 var(--f-b);color:var(--muted)}
.leer .scope{width:26px;height:26px}
.leer b{color:var(--ink);font-weight:600}
.leer.gross{flex-direction:column;justify-content:center;text-align:center;padding:30px 18px}
.leer.gross .scope{width:56px;height:56px}

/* Eröffnungsfenster */
.fenster{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden}
.fenster li{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:11px 12px;border-top:1px solid var(--line)}
.fenster li:first-child{border-top:0}
.fenster .tag{display:grid;justify-items:center;gap:3px;padding:6px 0;border-radius:10px;background:var(--panel-2);border:1px solid var(--line)}
.fenster .tag span{font:600 10px/1 var(--f-d);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.fenster .tag b{font:600 13px/1 var(--f-m);letter-spacing:-.03em}
.fenster li.bald .tag{border-color:var(--akzent-text);background:var(--akzent-soft)}
.fenster li.bald .tag span{color:var(--akzent-text)}
.fenster .wer{min-width:0}
.fenster .wer b{display:block;font:600 14px/1.25 var(--f-b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fenster .wer small{display:block;font:400 10.5px/1.35 var(--f-m);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fenster .uhr{text-align:right;font:600 13px/1.2 var(--f-m);letter-spacing:-.03em;white-space:nowrap}
.fenster .uhr small{display:block;font:400 9.5px/1.3 var(--f-m);color:var(--muted);letter-spacing:0}
.marker{font:600 9px/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase;padding:3px 5px;border-radius:4px;border:1px solid var(--line-2);color:var(--ink-2);margin-left:6px;vertical-align:1px}
.marker.akz{border-color:var(--akzent-text);color:var(--akzent-text)}
.marker.warn{border-color:var(--schatten);color:var(--schatten)}

/* Ampeln = Leuchtpunkte */
.ampeln{display:grid;gap:8px;grid-template-columns:1fr}
@media (min-width:560px){.ampeln{grid-template-columns:repeat(3,1fr)}}
.ampel{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--panel);border:1px solid var(--line)}
.ampel .led{grid-row:span 2;width:12px;height:12px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 4px color-mix(in oklab,var(--muted) 18%,transparent)}
.ampel.gruen .led{background:var(--spielen);box-shadow:0 0 0 4px color-mix(in oklab,var(--spielen) 20%,transparent),0 0 14px var(--spielen)}
.ampel.gelb .led{background:var(--schatten);box-shadow:0 0 0 4px color-mix(in oklab,var(--schatten) 20%,transparent),0 0 14px var(--schatten)}
.ampel.rot .led{background:var(--nie);box-shadow:0 0 0 4px color-mix(in oklab,var(--nie) 20%,transparent),0 0 14px var(--nie)}
.ampel b{font:600 13px/1.2 var(--f-b)}
.ampel small{font:400 10.5px/1.35 var(--f-m);color:var(--muted)}

/* ------------------------------------------------------------ Bilanz */
.zelle-kopf{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.zelle-kopf h2{flex:1 1 0;min-width:0;overflow-wrap:anywhere;margin:0;font:800 16px/1.15 var(--f-d);letter-spacing:-.01em;text-transform:uppercase}
.zelle-kopf h2 small{display:block;margin-top:4px;font:400 10.5px/1.3 var(--f-m);letter-spacing:0;text-transform:none;color:var(--muted)}
.zelle-kopf .plak{margin-left:auto}
.saisons{width:100%;border-collapse:collapse;margin:4px 0 10px}
.saisons th{font:600 9.5px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right;padding:0 0 6px;font-weight:600}
.saisons th:first-child,.saisons td:first-child{text-align:left}
.saisons td{padding:7px 0 7px 6px;border-top:1px solid var(--line);text-align:right;font:600 14px/1.15 var(--f-m);letter-spacing:-.03em;white-space:nowrap}
.saisons td small{display:block;font:400 9.5px/1.3 var(--f-m);color:var(--muted);letter-spacing:-.03em}
@media (max-width:420px){.saisons td{font-size:13px;padding-left:4px}.saisons td small{font-size:8.5px;white-space:normal}.karte{padding:12px}}
.saisons td.s{font:600 12px var(--f-m);color:var(--ink-2)}
.saisons tr.live td{color:var(--eis)}
.grund{margin:8px 0 0;padding:10px 12px;border-left:2px solid var(--akzent-text);background:var(--akzent-soft);border-radius:0 8px 8px 0;
  font:400 12.5px/1.45 var(--f-b);color:var(--ink-2)}
/* Ziel-Messer: eigener Wert mit Intervall gegen Vadims Marke */
.ziel{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:6px 10px;margin:18px 0 4px}
.ziel>span{font:600 9.5px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ziel .bahn{position:relative;height:22px;border-radius:5px;background:var(--panel-2);border:1px solid var(--line)}
.ziel .band{position:absolute;top:6px;bottom:6px;border-radius:3px;background:var(--eis-soft);border:1px solid color-mix(in oklab,var(--eis) 55%,transparent)}
.ziel .pkt{position:absolute;top:3px;bottom:3px;width:3px;margin-left:-1.5px;border-radius:2px;background:var(--eis);box-shadow:0 0 8px var(--eis)}
.ziel .null{position:absolute;top:0;bottom:0;width:1px;background:var(--line-2)}
.ziel .marke-v{position:absolute;top:-3px;bottom:-3px;width:0;border-left:1.5px dashed var(--akzent-text)}
.ziel .marke-v em{position:absolute;top:-15px;left:3px;font:600 8.5px var(--f-m);font-style:normal;color:var(--akzent-text);white-space:nowrap}
.ziel .marke-v.links em{left:auto;right:3px}
.ziel-leg{display:flex;flex-wrap:wrap;gap:4px 12px;margin:2px 0 0 68px;font:400 9.5px/1.3 var(--f-m);color:var(--muted)}

/* Segment (Schwelle) und Chips (Filter) */
.seg{display:inline-flex;padding:3px;border-radius:11px;background:var(--panel-2);border:1px solid var(--line);gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg button{display:flex;align-items:center;white-space:nowrap;padding:7px 10px;border-radius:8px;font:600 11.5px/1 var(--f-m);color:var(--muted);min-height:32px}
.seg button.an{background:var(--ink);color:var(--bg)}
.seg-zeile{display:flex;align-items:center;gap:8px;margin:10px 0 2px;flex-wrap:wrap}
.seg-zeile>span{font:600 9.5px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.chips{display:flex;gap:6px;overflow-x:auto;padding:2px var(--gut) 10px;margin:0 calc(-1 * var(--gut));scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips .et{flex:none;align-self:center;font:600 9.5px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:2px}
.chip{display:inline-flex;align-items:center;gap:6px;flex:none;height:34px;padding:0 13px;border-radius:17px;
  border:1px solid var(--line-2);background:var(--panel);font:600 12.5px/1 var(--f-b);color:var(--ink-2);white-space:nowrap}
.chip.an{background:var(--akzent);border-color:var(--akzent);color:var(--akzent-ink)}
.chip-trenner{flex:none;width:1px;background:var(--line-2);margin:6px 2px}

/* Aufklappen (Dossier-Muster) */
details.auf{margin:0 0 10px;border-radius:var(--r);background:var(--panel);border:1px solid var(--line)}
details.auf>summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 14px;cursor:pointer;-webkit-tap-highlight-color:transparent}
details.auf>summary::-webkit-details-marker{display:none}
details.auf>summary .t{flex:1 1 0;font:600 11.5px/1.25 var(--f-d);letter-spacing:.07em;text-transform:uppercase;color:var(--ink-2);min-width:0}
details.auf>summary .t small{display:block;margin-top:3px;font:400 10px/1.3 var(--f-m);letter-spacing:0;text-transform:none;color:var(--muted)}
details.auf>summary .n{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:7px;border:1px solid var(--line-2);font:600 10.5px var(--f-m);color:var(--muted)}
details.auf>summary .w{margin-left:auto;max-width:48%;overflow-wrap:anywhere;white-space:normal;flex:none;font:600 16px/1 var(--f-m);letter-spacing:-.04em;text-align:right;white-space:nowrap}
details.auf>summary .w small{display:block;margin-top:3px;font:400 9.5px var(--f-m);color:var(--muted);letter-spacing:0}
details.auf>summary::after{content:"";flex:none;width:7px;height:7px;margin:0 2px 0 4px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:rotate(45deg) translateY(-2px)}
details.auf[open]>summary::after{transform:rotate(-135deg) translate(-2px,-1px);border-color:var(--akzent-text)}
details.auf[open]{border-color:var(--line-2)}
details.auf[open]>summary .n{border-color:var(--akzent-text);color:var(--akzent-text)}
details.auf>.inn{padding:2px 14px 14px;border-top:1px solid var(--line)}
.herleitung{margin:8px 0 0;font:400 11px/1.5 var(--f-m);color:var(--muted);overflow-wrap:anywhere}
.formel{margin:10px 0;padding:10px 12px;border-radius:10px;background:var(--panel-2);border:1px solid var(--line);font:400 12px/1.55 var(--f-m);overflow-wrap:anywhere}
.formel b{color:var(--eis);font-weight:600}

/* Dossier-Kopf (Rechenweg) — Instrumentenrahmen mit Eckwinkeln */
.tape{position:relative;padding:16px 16px 16px;border-radius:18px;background:var(--panel);border:1px solid var(--line);
  box-shadow:var(--schatten-tief);overflow:hidden;isolation:isolate;margin-bottom:14px}
.tape::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,color-mix(in oklab,var(--ink) 2.2%,transparent) 3px 4px)}
.tape::after{content:"";position:absolute;inset:7px;pointer-events:none;border-radius:12px;
  --c:color-mix(in oklab,var(--akzent-text) 55%,transparent);
  background:
    linear-gradient(var(--c),var(--c)) 0 0/12px 1.5px,linear-gradient(var(--c),var(--c)) 0 0/1.5px 12px,
    linear-gradient(var(--c),var(--c)) 100% 0/12px 1.5px,linear-gradient(var(--c),var(--c)) 100% 0/1.5px 12px,
    linear-gradient(var(--c),var(--c)) 0 100%/12px 1.5px,linear-gradient(var(--c),var(--c)) 0 100%/1.5px 12px,
    linear-gradient(var(--c),var(--c)) 100% 100%/12px 1.5px,linear-gradient(var(--c),var(--c)) 100% 100%/1.5px 12px;
  background-repeat:no-repeat}
.tape-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0 2px 10px;
  font:400 9.5px/1.3 var(--f-m);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tape-top>span:first-child::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;
  background:var(--akzent);box-shadow:0 0 8px var(--akzent);vertical-align:1px}
.tape h1{margin:0;font:800 clamp(18px,5.4vw,26px)/1.12 var(--f-d);letter-spacing:-.02em;text-transform:uppercase;overflow-wrap:anywhere}
.tape h1 i{font-style:normal;color:var(--muted);font-weight:600}
.tape .unterz{margin:6px 0 14px;font:400 11px/1.45 var(--f-m);color:var(--muted)}
.stempel{display:inline-block;padding:4px 8px;border:1.5px solid var(--nie);color:var(--nie);border-radius:5px;
  font:800 10px/1 var(--f-d);letter-spacing:.14em;transform:rotate(-3deg)}
.stempel.ja{border-color:var(--akzent-text);color:var(--akzent-text)}

/* Gitter + Wertepaare im Dossier */
.werte{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px;margin-top:10px}
.werte .kz .w{font-size:18px;white-space:normal}
.grafik.gitterbild{max-width:440px;margin:0 auto}

/* ------------------------------------------------------------ Ligen */
.liga-k{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:center}
.liga-k .land{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;font-size:18px;border-radius:10px;background:var(--panel-2);border:1px solid var(--line-2);
  font:600 10.5px var(--f-m);letter-spacing:.02em;color:var(--ink-2)}
.liga-k .land{font-size:17px;letter-spacing:0}
.liga-k .nm{font:600 14.5px/1.2 var(--f-b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.liga-k .nm small{font:400 10.5px var(--f-m);color:var(--muted);margin-left:6px}
.liga-k .meta{grid-column:2 / 4;font:400 10.5px/1.3 var(--f-m);color:var(--muted)}
.liga-k .land{grid-column:1;grid-row:1 / 3} .liga-k .nm{grid-column:2;grid-row:1} .liga-k .plak{grid-column:3;grid-row:1}
.mini-forest{margin-top:12px;display:grid;gap:5px}
.mf{display:grid;grid-template-columns:40px minmax(0,1fr) 92px;align-items:center;gap:8px;font:400 10.5px var(--f-m)}
.mf>span:first-child{color:var(--muted)}
.mf>b{text-align:right;font:600 12.5px var(--f-m);letter-spacing:-.03em;white-space:nowrap}
.mf>b small{font:400 9.5px var(--f-m);color:var(--muted);letter-spacing:0;margin-left:4px}
.mf .bahn{position:relative;height:14px}
.mf .bahn::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--line)}
.mf .null,.mf .v{position:absolute;top:0;bottom:0;width:0}
.mf .null{border-left:1px solid var(--line-2)}
.mf .v{border-left:1.2px dashed color-mix(in oklab,var(--akzent-text) 70%,transparent)}
.mf .iv{position:absolute;top:5px;height:4px;border-radius:2px;background:color-mix(in oklab,var(--eis) 45%,transparent)}
.mf .p{position:absolute;top:2px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--eis);box-shadow:0 0 0 2px var(--panel)}
.mf.u-spielen .p{background:var(--spielen)} .mf.u-nie .p{background:var(--nie)} .mf.u-beobachten .p{background:var(--schatten)}

/* Liga-Regeltext */
.md{font:400 13.5px/1.55 var(--f-b);color:var(--ink-2)}
.md h4{margin:14px 0 6px;font:600 11px/1.3 var(--f-d);letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}
.md ul{margin:4px 0 8px;padding-left:18px} .md li{margin:3px 0}
.md strong{color:var(--ink)} .md code{font:400 12px var(--f-m)}
.md table{border-collapse:collapse;font-size:12px;margin:8px 0} .md td,.md th{border:1px solid var(--line);padding:4px 6px;vertical-align:top}

/* ------------------------------------------------------------ Wetten */
.summe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
@media (min-width:560px){.summe{grid-template-columns:repeat(4,minmax(0,1fr))}}
.wl{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden}
.wl li{border-top:1px solid var(--line)} .wl li:first-child{border-top:0}
.wl a{display:grid;grid-template-columns:44px minmax(0,1fr) auto 10px;grid-template-areas:"d p q e" "d m z e";gap:3px 10px;align-items:center;padding:10px 12px 10px 10px}
.wl a:hover{background:var(--panel-2)}
.wl .d{grid-area:d;display:grid;gap:2px;font:600 11.5px/1.1 var(--f-m);letter-spacing:-.03em}
.wl .d small{font:400 9.5px var(--f-m);color:var(--muted);letter-spacing:0}
.wl .p{grid-area:p;min-width:0;font:600 13.5px/1.25 var(--f-b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl .m{grid-area:m;min-width:0;font:400 10.5px/1.3 var(--f-m);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wl .m .sig{color:var(--akzent-text)}
.wl .q{grid-area:q;text-align:right;font:600 14px/1 var(--f-m);letter-spacing:-.03em}
.wl .q small{font:400 10px var(--f-m);color:var(--muted);letter-spacing:0;margin-left:5px}
.wl .z{grid-area:z;text-align:right;font:400 10.5px/1.2 var(--f-m);color:var(--muted);white-space:nowrap}
.wl .z b{font-weight:600;color:var(--eis)}
.wl .e{grid-area:e;width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.wl .e.gewonnen,.wl .e.halb_gewonnen{background:var(--spielen);box-shadow:0 0 6px var(--spielen)}
.wl .e.verloren,.wl .e.halb_verloren{background:var(--nie)}
.wl .e.push{background:var(--muted)}
.wl li.markiert a{background:var(--akzent-soft)}

/* Tabellen (nur in Detailansichten; eigener Rollrahmen, die Seite scrollt nie quer) */
.tafel-rahmen{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel);max-width:100%}
.tafel{width:100%;border-collapse:collapse;font:400 12px/1.35 var(--f-b)}
.tafel th{position:sticky;top:0;background:var(--panel-2);font:600 9.5px/1.2 var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px;white-space:nowrap}
.tafel td{padding:7px 8px;border-top:1px solid var(--line);vertical-align:top}
.tafel .z{text-align:right;font-family:var(--f-m);font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}
.tafel .z .ki{display:block}
.tafel tr.markiert td{background:var(--akzent-soft)}
.tafel .sub{display:block;font:400 10px/1.3 var(--f-m);color:var(--muted)}

/* ------------------------------------------------------------ Mehr */
.menue{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden}
.menue li{border-top:1px solid var(--line)} .menue li:first-child{border-top:0}
.menue a,.menue button{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;min-height:58px;padding:10px 14px;text-align:left}
.menue a:hover,.menue button:hover{background:var(--panel-2)}
.menue svg{width:22px;height:22px;fill:none;stroke:var(--akzent-text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.menue b{display:block;font:600 14px/1.25 var(--f-b)}
.menue small{display:block;font:400 10.5px/1.35 var(--f-m);color:var(--muted)}
.menue .pfeil{width:7px;height:7px;border-right:1.6px solid var(--muted);border-top:1.6px solid var(--muted);transform:rotate(45deg)}
.regelzeile{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;padding:10px 0;border-top:1px solid var(--line)}
.regelzeile:first-child{border-top:0}
/* DB-Texte ohne Leerzeichen (Dateipfade in kern.aufgabe) brachen nicht um — waagerechtes Scrollen auf 4 Routen (F3) */
.regelzeile b{font:600 13.5px/1.3 var(--f-b);overflow-wrap:anywhere;min-width:0}
.regelzeile small{grid-column:2;font:400 11px/1.45 var(--f-m);color:var(--muted);overflow-wrap:anywhere;min-width:0}
.regelzeile .plak{align-self:start;margin-top:1px}
blockquote{margin:8px 0;padding:6px 10px;border-left:2px solid var(--line-2);font:400 13px/1.5 var(--f-b);color:var(--ink-2)}
dl.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin:8px 0 0;font-size:12.5px}
dl.kv dt{font:600 9.5px/1.6 var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
dl.kv dd{margin:0;overflow-wrap:anywhere}
.ueberholt li{margin:6px 0;list-style:none} .ueberholt ul{margin:0;padding:0}
.ueberholt s{font:600 12.5px var(--f-m);color:var(--nie)} .ueberholt span{display:block;font:400 11.5px/1.4 var(--f-b);color:var(--muted)}

/* ------------------------------------------------------------ Knöpfe, Formulare */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:12px;
  font:600 13.5px/1 var(--f-b);border:1px solid var(--line-2);background:var(--panel);color:var(--ink)}
.knopf.akzent{background:var(--akzent);border-color:var(--akzent);color:var(--akzent-ink);box-shadow:0 8px 24px -12px var(--akzent)}
.knopf.gross{min-height:54px;font-size:15px;width:100%}
.knopf.breit{width:100%}
.knopf:active{transform:translateY(1px)}
.flash{padding:10px 14px;border-radius:12px;font-size:13px;overflow-wrap:anywhere}
.flash.err{border:1px solid var(--nie);color:var(--nie);background:color-mix(in oklab,var(--nie) 8%,transparent)}
.feld-e{display:grid;gap:6px;font:600 10px var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.feld-e input{width:100%;height:50px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);
  font:400 16px var(--f-b);letter-spacing:0;text-transform:none}
.feld-e input:focus{outline:none;border-color:var(--akzent-text);box-shadow:0 0 0 3px var(--akzent-soft)}
.fehlerbox{padding:14px;border-radius:12px;border:1px solid var(--nie);color:var(--nie);font:400 13px var(--f-m)}
.laedt{display:flex;align-items:center;gap:10px;padding:40px 4px;font:400 12px var(--f-m);color:var(--muted)}
.laedt::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--akzent);box-shadow:0 0 10px var(--akzent)}

/* ------------------------------------------------------------ Grafiken (SVG, grafik.js) */
.grafik{display:block;width:100%;height:auto;overflow:visible}
.inn>.grafik{max-width:780px}
.grafik text{font:400 9.5px var(--f-m);fill:var(--muted)}
.grafik .t-ink{fill:var(--ink-2)}
.grafik .gl{stroke:var(--line);stroke-width:1}
.grafik .null{stroke:var(--line-2);stroke-width:1.2}
.grafik .kurve{fill:none;stroke:var(--eis);stroke-width:2;stroke-linejoin:round}
.grafik .kurve-2{fill:none;stroke:var(--eis);stroke-width:1.6;stroke-dasharray:5 3;opacity:.8}
.grafik .kurve-k{fill:none;stroke:var(--muted);stroke-width:1.4;stroke-dasharray:2 3}
.grafik .band{fill:var(--eis-soft);stroke:none}
.grafik .band-2{fill:var(--eis-soft);stroke:none;opacity:.6}
.grafik .pkt{fill:var(--eis)} .grafik .pkt-2{fill:var(--panel);stroke:var(--eis);stroke-width:1.4}
.grafik .balken{fill:var(--eis);opacity:.7}
.grafik .balken-neg{fill:var(--eis);opacity:.28}
.grafik .ring{fill:none;stroke:var(--ink-2);stroke-width:1}
.grafik .bruch{stroke:var(--akzent-text);stroke-width:1.2;stroke-dasharray:3 3}
.grafik .bruch-t{fill:var(--akzent-text)}
.grafik .ziel-l{stroke:var(--akzent-text);stroke-width:1;stroke-dasharray:1 3;opacity:.9}
.grafik .ziel-t{fill:var(--akzent-text)}
/* Präfix g-: «.marke» ist die Wortmarke der Kopfzeile (display:flex, margin) — Falle aus CLAUDE.md, «Ein Präfix nur auf der äußeren Klasse schützt nichts» */
.grafik .g-marke{stroke:var(--akzent-text);stroke-width:1.4}
.grafik .hm{fill:var(--eis)}
.grafik .hm-t{fill:var(--ink);stroke:var(--panel);stroke-width:2.2;paint-order:stroke;font-size:8.5px}
.grafik .hm-r{fill:none;stroke:var(--akzent-text);stroke-width:1.5}
.grafik .hm-r.push{stroke-dasharray:2 2;stroke-width:1}
.legende{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 2px 0;font:400 10px/1.3 var(--f-m);color:var(--muted)}
.legende i{display:inline-block;width:14px;height:0;border-top:2px solid var(--eis);margin-right:5px;vertical-align:3px}
.legende i.gestr{border-top-style:dashed} .legende i.kontr{border-top:1.5px dotted var(--muted)}
.legende i.bruch{border-top:1.5px dashed var(--akzent-text)} .legende i.band{height:8px;border:0;background:var(--eis-soft);vertical-align:0}

/* ------------------------------------------------------------ Anmeldung */
.p-anmelden{padding:0;display:grid;min-height:100dvh;place-items:center}
.anmelden{width:min(360px,100% - 32px);display:grid;gap:14px;text-align:center;padding:32px 0}
.anm-marke{margin:6px 0 0;font:800 34px/1 var(--f-d);letter-spacing:.02em;text-transform:uppercase}
.anm-marke span{color:var(--akzent-text)}
.anm-unter{margin:0;font:400 11.5px var(--f-m);color:var(--muted)}
.anm-form{display:grid;gap:12px;text-align:left;margin-top:10px}
.anm-fuss{margin:6px 0 0;font-size:10px;color:var(--muted)}
.radar-held{position:relative;width:176px;height:176px;margin:0 auto;border-radius:50%;
  border:1.5px solid color-mix(in oklab,var(--akzent-text) 70%,transparent);
  background:radial-gradient(circle,transparent 0 29%,color-mix(in oklab,var(--akzent-text) 25%,transparent) 29.5% 30%,transparent 30.5% 59%,color-mix(in oklab,var(--akzent-text) 25%,transparent) 59.5% 60%,transparent 60.5%),
    linear-gradient(transparent 49.6%,color-mix(in oklab,var(--akzent-text) 18%,transparent) 50%,transparent 50.4%),
    linear-gradient(90deg,transparent 49.6%,color-mix(in oklab,var(--akzent-text) 18%,transparent) 50%,transparent 50.4%);
  overflow:hidden;box-shadow:0 0 60px -20px var(--akzent)}
/* EIN Umlauf beim Laden; die Echos leuchten auf, wenn der Strahl sie überstreicht, und bleiben schwach stehen */
.radar-held i{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 270deg,color-mix(in oklab,var(--akzent) 60%,transparent) 360deg);
  animation:sweep 2.6s linear .2s 1 both}
.radar-held b{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--akzent);box-shadow:0 0 10px var(--akzent);opacity:.35;
  animation:echo 2.6s linear 1 both}
.radar-held b:nth-of-type(1){left:64%;top:26%;animation-delay:.35s}
.radar-held b:nth-of-type(2){left:72%;top:70%;animation-delay:.95s}
.radar-held b:nth-of-type(3){left:26%;top:62%;animation-delay:1.55s}
@keyframes echo{0%{opacity:0}4%{opacity:1}45%,100%{opacity:.35}}


/* ------------------------------------------------------------ Umbau 2: Sportarten-Leiste (klebrig unter der Kopfzeile) */
.sportwahl{position:sticky;top:calc(55px + env(safe-area-inset-top));z-index:29;display:grid;grid-template-columns:repeat(4,1fr);
  gap:4px;padding:6px var(--gut);background:color-mix(in oklab,var(--bg) 86%,transparent);backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line)}
.sportwahl a{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-height:38px;border-radius:10px;
  font:600 10.5px/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid transparent}
.sportwahl svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sportwahl a:hover{color:var(--ink-2)}
.sportwahl a.an{color:var(--ink);background:var(--panel);border-color:var(--line-2);box-shadow:inset 0 -2px 0 var(--akzent),0 6px 18px -10px var(--akzent)}
.sportwahl a.an svg{stroke:var(--akzent-text)}
@media (max-width:430px){.sportwahl a{letter-spacing:.03em;font-size:9px;gap:4px;padding:0 2px}.sportwahl svg{width:14px;height:14px}}
@media (max-width:350px){.sportwahl a svg{display:none}}
@media (min-width:900px){.sportwahl{grid-template-columns:repeat(4,minmax(0,150px));justify-content:start;padding-left:calc(var(--gut) + 8px)}}

/* ------------------------------------------------------------ Archiv-Unternavigation */
.archiv-satz{margin:2px 2px 10px;padding:9px 12px;border-left:2px solid var(--akzent-text);background:var(--akzent-soft);border-radius:0 8px 8px 0;
  font:400 12px/1.45 var(--f-b);color:var(--ink-2)}
.unternav{display:flex;gap:4px;margin:0 0 6px;padding:3px;border-radius:11px;background:var(--panel-2);border:1px solid var(--line);width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.unternav::-webkit-scrollbar{display:none}
.unternav a{padding:8px 12px;border-radius:8px;font:600 11px/1 var(--f-m);color:var(--muted);white-space:nowrap}
.unternav a.an{background:var(--ink);color:var(--bg)}

/* ------------------------------------------------------------ Messwerkzeuge */
.mess-regel{margin:-4px 2px 12px;font:400 11px/1.5 var(--f-m);color:var(--muted)}
.mess-hinweis{margin:0 0 12px;padding:9px 12px;border-radius:10px;border:1px dashed color-mix(in oklab,var(--beobachten) 55%,transparent);
  font:400 12px/1.45 var(--f-b);color:var(--ink-2)}
.mess-kacheln{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 10px}
@media (min-width:560px){.mess-kacheln{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){.mess-kacheln{grid-template-columns:repeat(6,minmax(0,1fr))}}
.mk{position:relative;display:grid;gap:5px;align-content:start;min-width:0;padding:12px 12px 11px;border-radius:12px;background:var(--panel);border:1px solid var(--line);
  box-shadow:var(--schatten-tief);animation:auf .5s cubic-bezier(.2,.7,.2,1) both}
.mk:nth-child(2){animation-delay:.04s} .mk:nth-child(3){animation-delay:.08s} .mk:nth-child(4){animation-delay:.12s} .mk:nth-child(5){animation-delay:.16s} .mk:nth-child(6){animation-delay:.2s}
@keyframes auf{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.mk .et{font:600 9.5px/1.2 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mk b{font:600 23px/1.05 var(--f-m);letter-spacing:-.04em;font-variant-numeric:tabular-nums;white-space:nowrap}
.mk b small{font-size:11.5px;font-weight:400;color:var(--muted);margin-left:3px;letter-spacing:0}
.mk .ki{font:400 10px/1.3 var(--f-m);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk.eis b{color:var(--eis)} .mk.gut b{color:var(--spielen)} .mk.schlecht b{color:var(--nie)}
.kib{position:relative;height:10px;border-radius:4px;background:var(--panel-2);border:1px solid var(--line)}
.kib .n{position:absolute;top:-2px;bottom:-2px;width:1px;background:var(--line-2)}
.kib .b{position:absolute;top:2px;bottom:2px;border-radius:2px;background:var(--eis-soft);border:1px solid color-mix(in oklab,var(--eis) 50%,transparent)}
.kib .p{position:absolute;top:-1px;bottom:-1px;width:3px;margin-left:-1.5px;border-radius:2px;background:var(--eis);box-shadow:0 0 6px var(--eis)}
.mk.gut .kib .p{background:var(--spielen);box-shadow:0 0 6px var(--spielen)} .mk.schlecht .kib .p{background:var(--nie);box-shadow:0 0 6px var(--nie)}
.kib.leer-b{border-style:dashed;background:none}
.mess-reife{display:grid;gap:6px;margin:0 0 4px}
@media (min-width:560px){.mess-reife{grid-template-columns:1fr 1fr;gap:6px 16px}}
.reife{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;font:400 10.5px var(--f-m);color:var(--muted)}
.reife .rb{height:5px;border-radius:3px;background:var(--panel-2);border:1px solid var(--line);overflow:hidden}
.reife .rb i{display:block;height:100%;background:var(--beobachten)}
.reife.voll .rb i{background:var(--spielen)}
.reife b{font:600 11.5px var(--f-m);color:var(--ink)} .reife b small{color:var(--muted);font-weight:400}
.karte.mess{padding:14px 14px 12px}
.mess-kopf{display:flex;align-items:baseline;gap:10px;margin:0 0 10px}
.mess-kopf h3{margin:0;font:800 12.5px/1.1 var(--f-d);letter-spacing:.06em;text-transform:uppercase}
.mess-kopf span{margin-left:auto;font:400 10.5px var(--f-m);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.lesart{margin:10px 0 0;padding-top:8px;border-top:1px solid var(--line);font:400 11.5px/1.5 var(--f-b);color:var(--muted)}
.lesart i{display:inline-block;width:14px;height:0;margin:0 5px 0 2px;vertical-align:3px;border-top:2px solid var(--eis)}
.lesart i.lg-e{border-top:2px dashed var(--akzent-text)}
.lesart i.lg-g{height:8px;border:0;vertical-align:0;background:color-mix(in oklab,var(--spielen) 30%,transparent)}
.lesart i.lg-p{height:8px;border:0;vertical-align:0;background:color-mix(in oklab,var(--nie) 30%,transparent)}
.lesart i.lg-roi{width:8px;height:10px;border:0;vertical-align:-1px;background:linear-gradient(90deg,var(--spielen) 50%,var(--nie) 50%)}
.lesart i.lg-clv,.lesart i.lg-s{width:8px;height:10px;border:0;vertical-align:-1px;background:var(--eis)}
.lesart i.lg-m{width:8px;height:10px;border:0;vertical-align:-1px;background:var(--akzent)}
.grafik .leer-r{fill:none;stroke:var(--line-2);stroke-dasharray:4 4}
.grafik .leer-t{font:600 12px var(--f-b);fill:var(--ink-2)}
.grafik .glueck{fill:var(--spielen);opacity:.16} .grafik .pech{fill:var(--nie);opacity:.18}
.grafik .kurve-e{fill:none;stroke:var(--akzent-text);stroke-width:1.6;stroke-dasharray:6 4}
.grafik .kurve.saldo{stroke-width:2.2}
.grafik .t-gross{font:600 11px var(--f-m);fill:var(--ink)}
.grafik .t-akz{font:600 10px var(--f-m);fill:var(--akzent-text)}
.grafik .t-n{font-size:8.5px}
.grafik .halo,.grafik .ziel-t{stroke:var(--panel);stroke-width:3px;paint-order:stroke;stroke-linejoin:round}
.grafik .wp{fill:var(--eis);opacity:.42} .grafik .wp.raus{opacity:.8;fill:none;stroke:var(--eis);stroke-width:1}
.grafik .kurve-m{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round}
.grafik .mb-roi.gut{fill:var(--spielen);opacity:.8} .grafik .mb-roi.schlecht{fill:var(--nie);opacity:.8}
.grafik .mb-clv{fill:var(--eis);opacity:.85}
.grafik .fz{fill:var(--panel-2);opacity:.6}
.grafik .fl{stroke:var(--eis);stroke-width:1.5}
.grafik .fp{fill:var(--eis);stroke:var(--panel);stroke-width:1.5} .grafik .fp.gut{fill:var(--spielen)} .grafik .fp.schlecht{fill:var(--nie)}
.grafik .lb-s{fill:var(--eis);opacity:.85} .grafik .lb-m{fill:var(--akzent);opacity:.85}
.grafik .lp90{stroke:var(--ink-2);stroke-width:1.6}

/* ------------------------------------------------------------ Live-Wetten: Status */
.st{display:inline-block;padding:2px 5px;margin-right:4px;border-radius:4px;font:600 8.5px/1.2 var(--f-m);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line-2);color:var(--ink-2)}
.st-offen{border-color:var(--akzent-text);color:var(--akzent-text)} .st-gesetzt{border-color:var(--eis);color:var(--eis)} .st-abgerechnet{color:var(--muted)}
.st-nachtraeglich{border-color:var(--schatten);color:var(--schatten)}
/* W7: Klasse einer Papierzeile (signal / beobachten / rest / kontrolle) — Farbe nur am Punkt, die Zeile bleibt lesbar */
.kl{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;background:var(--line-2);vertical-align:1px}
.kl-signal{background:var(--spielen);box-shadow:0 0 6px var(--spielen)} .kl-beobachten{background:var(--schatten)} .kl-kontrolle{background:transparent;border:1px solid var(--muted)}
.wl li.nachtr a{opacity:.72} .wl li.kontr a .p{color:var(--muted)}
.wl li.grau a{opacity:.55}
.filter-zeile{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:0 0 10px;font:400 11px var(--f-m);color:var(--muted)}
.filter-zeile label{display:inline-flex;align-items:center;gap:6px;min-height:32px}
.filter-zeile input[type=range]{width:120px;accent-color:var(--akzent)}
.filter-zeile b{color:var(--ink);font-weight:600}

/* W3: Archiv-Stand je Liga (laufende Saison) */
.stand-l{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);overflow:hidden}
.stand-l li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;padding:9px 12px;border-top:1px solid var(--line)}
.stand-l li:first-child{border-top:0}
.stand-l li.grau{opacity:.55}
.stand-l .nm{font:600 12.5px/1.25 var(--f-b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stand-l .nm small{display:block;font:400 10px/1.35 var(--f-m);color:var(--muted);white-space:normal}
.stand-l .z{font:600 13px/1 var(--f-m);letter-spacing:-.03em;text-align:right;white-space:nowrap}
.stand-l .z small{display:block;margin-top:3px;font:400 9.5px var(--f-m);color:var(--muted);letter-spacing:0}
.stand-l .bahn{grid-column:1/-1;height:3px;border-radius:2px;background:var(--line);overflow:hidden}
.stand-l .bahn i{display:block;height:100%;background:var(--eis)}
.stand-l li.rechenfaehig .bahn i{background:var(--spielen)}

/* W5: Aufgaben aller Teilprojekte — Stapelbalken je Teil und Stufe */
.teil-k .stapel{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--line);margin:8px 0 4px}
.teil-k .stapel i{display:block;height:100%}
.teil-k .stapel .s-fertig{background:var(--spielen)} .teil-k .stapel .s-laeuft{background:var(--akzent)} .teil-k .stapel .s-offen{background:var(--line-2)}
.teil-k .stapel .s-verworfen{background:color-mix(in oklab,var(--nie) 55%,var(--line))} .teil-k .stapel .s-blockiert{background:var(--nie)}
.teil-k .zahlen{display:flex;flex-wrap:wrap;gap:4px 12px;font:400 10.5px var(--f-m);color:var(--muted)}
.teil-k .zahlen b{color:var(--ink);font-weight:600}
.stufe-z{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:7px 0;border-top:1px solid var(--line)}
.stufe-z:first-child{border-top:0}
.stufe-z .t{font:600 12px/1.25 var(--f-b)} .stufe-z .t small{display:block;font:400 10px/1.3 var(--f-m);color:var(--muted)}
.stufe-z .mini{display:flex;gap:2px} .stufe-z .mini i{width:9px;height:9px;border-radius:2px;background:var(--line-2)}
.stufe-z .mini .s-fertig{background:var(--spielen)} .stufe-z .mini .s-laeuft{background:var(--akzent)} .stufe-z .mini .s-verworfen,.stufe-z .mini .s-blockiert{background:var(--nie)}

/* W6: Dienstzustand */
.dienst{padding:0;overflow:hidden}
.dienst .kopf{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.dienst .kopf b{font:600 14px/1.2 var(--f-b)} .dienst .kopf small{display:block;font:400 10.5px/1.3 var(--f-m);color:var(--muted)}
.dienst .kopf .led{width:12px;height:12px;border-radius:50%;background:var(--muted);flex:none}
.dienst.ok .kopf .led{background:var(--spielen);box-shadow:0 0 0 4px color-mix(in oklab,var(--spielen) 20%,transparent),0 0 12px var(--spielen)}
.dienst.gestoert .kopf .led{background:var(--nie);box-shadow:0 0 0 4px color-mix(in oklab,var(--nie) 20%,transparent),0 0 12px var(--nie)}
.dienst.stumm .kopf .led{background:var(--schatten);box-shadow:0 0 0 4px color-mix(in oklab,var(--schatten) 20%,transparent)}
.dienst .zeilen{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px 14px;padding:12px 14px}
.dienst .strom{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px}
.dienst .strom span{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:6px;border:1px solid var(--line-2);font:600 10.5px var(--f-m);color:var(--ink-2)}
.dienst .strom span.com{border-color:var(--spielen);color:var(--spielen)} .dienst .strom span.de{border-color:var(--schatten);color:var(--schatten)}
.dienst .strom span.gesperrt{border-color:var(--nie);color:var(--nie);text-decoration:line-through}
.dienst .gruende{margin:0;padding:8px 14px 12px;font:400 11.5px/1.45 var(--f-b);color:var(--nie)}

/* W1: Tennis-Archiv — Fortschritt Stufe 2 */
.fort{display:grid;gap:6px;margin:6px 0 4px}
.fort .bahn{height:10px;border-radius:5px;background:var(--line);overflow:hidden;position:relative}
.fort .bahn i{position:absolute;left:0;top:0;height:100%;background:var(--eis);min-width:2px}
.fort .bahn i.archiv{background:var(--akzent)}
.fort .z{display:flex;justify-content:space-between;font:400 10.5px var(--f-m);color:var(--muted)} .fort .z b{color:var(--ink);font-weight:600}
.tafel td.grau{color:var(--muted)}
.saisons.hb td{font-size:13px}

/* ------------------------------------------------------------ Desktop: Tabbar wird Seitenleiste */
@media (min-width:900px){
  body{padding-bottom:24px;padding-left:88px}
  .tabs{top:0;right:auto;width:88px;height:auto;grid-template-columns:1fr;grid-auto-rows:78px;align-content:start;
    padding-top:76px;border-top:0;border-right:1px solid var(--line)}
  .tabs a.an::before{top:20%;bottom:20%;left:0;right:auto;width:2px;height:auto}
  .wrap{padding-top:22px}
  .p-anmelden{padding-left:0}
}
@media (min-width:1240px){
  .wrap{max-width:1060px}
  .breit2{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;align-items:start}
  .breit2>*>.sek:first-child{margin-top:6px}
  .breit2 .ampeln{grid-template-columns:1fr}
}

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

/* K3 Plus-Statistik */
.karte.plus .tafel td small,.karte.mess .tafel td small{display:block;color:var(--muted);font-size:10px}
.karte.plus tr.live td{font-weight:600} .karte.plus tr.leise td{color:var(--muted)}
.plus-noch{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:8px 0 10px}
.plus-noch span{font:600 10px var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.plus-noch b{font:600 22px var(--f-m)} .plus-noch small{color:var(--muted);font-size:11px;flex-basis:100%}
.plus-staffel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 10px}
.plus-st{display:flex;flex-direction:column;gap:2px;padding:6px 8px;border:1px solid var(--line);border-radius:6px;min-width:0}
.plus-st em{font:600 10px var(--f-m);font-style:normal;color:var(--muted);letter-spacing:.04em}
.plus-st b{font:600 18px var(--f-m)} .plus-st i{font-style:normal;font-size:11px;color:var(--muted)}
.plus-hinweis{font-size:12px;overflow-wrap:anywhere}
@media (max-width:520px){.plus-staffel{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mess-hinweis.warn{border-left:3px solid var(--schatten);padding-left:8px}
.tafel tr.an td{background:color-mix(in oklab,var(--schatten) 10%,transparent)}