:root{--bg:#0f1215;--card:#171b20;--line:#262c33;--ink:#eef0f2;--ink2:#9aa3ac;--sgw:#cd6627;--auf-akzent:#fff;--akzent-zart:rgba(205,102,39,.12)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif}
a{color:var(--sgw)}
header.top{display:flex;align-items:center;gap:24px;padding:14px 28px;border-bottom:1px solid var(--line)}
header.top .marke{font-weight:800;letter-spacing:.04em;text-transform:uppercase}
header.top nav{display:flex;gap:18px;flex:1}
header.top nav a{color:var(--ink2);text-decoration:none;font-size:14px}
header.top form{margin:0}
main{max-width:1180px;margin:0 auto;padding:28px}
h1{font-size:28px;margin:0 0 4px;text-transform:uppercase;letter-spacing:.02em}
.sub{color:var(--ink2);margin:0 0 24px}
.karte{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
.zahlen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}
.zahlen b{display:block;font-size:30px}
.zahlen span{color:var(--ink2);font-size:13px}
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
th{color:var(--ink2);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
td.erg{font-weight:700}
button,input[type=submit]{background:var(--sgw);color:var(--auf-akzent);border:0;border-radius:8px;padding:9px 16px;font:inherit;font-weight:600;cursor:pointer}
button.still{background:transparent;color:var(--ink2);padding:0;font-weight:400;font-size:14px}
.login{max-width:380px;margin:12vh auto}
.login label{display:block;font-size:13px;color:var(--ink2);margin:14px 0 4px}
.login input[type=text],.login input[type=password],.login input:not([type]){width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:#0f1215;color:var(--ink);font:inherit}
.fehler{color:#e8746e;font-size:14px}

/* Navigation */
header.top a.marke{color:var(--ink);text-decoration:none}
header.top nav a.an{color:var(--ink);border-bottom:2px solid var(--sgw);padding-bottom:4px}
header.top nav .bald{color:#4d555d;font-size:14px;cursor:default}
header.top .wer{color:var(--ink2);font-size:14px;text-decoration:none}
header.top .wer:hover{color:var(--ink)}
.leise{color:var(--ink2);font-size:13px}
h2.abschnitt{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:26px 0 10px;border-left:3px solid var(--sgw);padding-left:8px}

/* Kader */
/* Spielerkarte: das Foto ist die Karte (Vorbild Mannschaftskasse und Split-App). Hochformat
   4:5 wie die fupa-Bilder, der Text steht unten auf einem dunklen Verlauf. */
.kader{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.spielerkarte{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--card);color:#fff;text-decoration:none;transition:border-color .15s}
.spielerkarte:hover{border-color:var(--sgw)}
.spielerkarte:focus-visible{outline:2px solid var(--sgw);outline-offset:2px}
.sk-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.sk-initialen{display:flex;align-items:center;justify-content:center;padding-bottom:30%;box-sizing:border-box;background:#1d2228;color:#3a424b;font-size:56px;font-weight:800;letter-spacing:.02em}
.spielerkarte::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgb(10 12 15/.96) 0%,rgb(10 12 15/.88) 32%,rgb(10 12 15/.4) 50%,rgb(10 12 15/0) 64%)}
.sk-text{position:relative;z-index:2;padding:12px 14px}
.sk-name{display:block;font-size:17px;line-height:1.2;text-shadow:0 1px 10px rgb(0 0 0/.5)}
.sk-pos{display:block;margin-top:2px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sgw)}
.spielerkarte .mini{margin-top:10px;padding-top:9px;border-top:1px solid rgb(255 255 255/.14)}
.spielerkarte .mini span{color:rgb(255 255 255/.7)}
@media (prefers-reduced-motion:reduce){.spielerkarte{transition:none}}
.foto{display:inline-flex;align-items:center;justify-content:center;flex:none;width:52px;height:65px;border-radius:8px;object-fit:cover;object-position:top;background:#262c33}
.foto.ersatz{color:var(--ink2);font-size:15px;font-weight:800}
.foto.gross{width:80px;height:100px;border-radius:10px}.foto.gross.ersatz{font-size:24px}
.mini{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:14px}
.mini b{display:block;font-size:18px}.mini span{font-size:11px;color:var(--ink2)}

/* Spielerseite */
.kopf{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:18px}
.kopf .sub{margin:0}
.zurueck{font-size:13px;text-decoration:none;color:var(--ink2)}
.zeitraum{display:flex;align-items:center;gap:8px;position:relative}
.chip{display:inline-block;font-size:13px;padding:6px 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--ink2);text-decoration:none;cursor:pointer;white-space:nowrap}
.chip.an{background:var(--sgw);border-color:var(--sgw);color:var(--auf-akzent)}
.pn-wahl{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 10px;font-size:13px;color:var(--ink2)}
.pn-karte{display:none}
.pn>input.pn-1:checked~.pn-karte.pn-1,.pn>input.pn-2:checked~.pn-karte.pn-2{display:block}
.pn>input.pn-1:checked~.pn-wahl .pn-1,.pn>input.pn-2:checked~.pn-wahl .pn-2{background:var(--sgw);border-color:var(--sgw);color:var(--auf-akzent)}
.spielwahl summary{list-style:none}.spielwahl summary::-webkit-details-marker{display:none}
.menue{position:absolute;right:0;top:42px;z-index:20;width:420px;max-height:70vh;overflow:auto;background:#1b2026;border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.spielzeile{display:grid;grid-template-columns:30px 1fr auto 44px;gap:10px;align-items:center;padding:9px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:14px}
.spielzeile:hover,.spielzeile.an{background:#262c33}
.spielzeile small,.liste small,.ziele small,.szene small{display:block;color:var(--ink2);font-size:12px}
.spielzeile .erg{font-weight:700}.spielzeile .min{color:var(--ink2);text-align:right}
.ausgang{display:inline-block;width:24px;height:24px;line-height:24px;border-radius:6px;text-align:center;font-size:12px;font-weight:800;background:#2a3038;color:var(--ink2)}
.a-S{background:#1f6b42;color:#fff}.a-N{background:#8a2f2b;color:#fff}.a-U{background:#5a626b;color:#fff}
nav.reiter{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px}
nav.reiter a{padding:10px 16px;color:var(--ink2);text-decoration:none;font-size:15px;border-bottom:2px solid transparent;margin-bottom:-1px}
nav.reiter a.an{color:var(--ink);border-color:var(--sgw)}
.raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:start}
.sp-4{grid-column:span 4}.sp-6{grid-column:span 6}.sp-8{grid-column:span 8}.sp-12{grid-column:span 12}
.modul h2{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:0 0 12px;border-left:3px solid var(--sgw);padding-left:8px}
.modul h3{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);margin:14px 0 6px}
.grosszeile{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.gross{font-size:40px;font-weight:800;line-height:1}.gross small{font-size:20px;color:var(--ink2);font-weight:600}
.mittel{font-size:26px;font-weight:800;line-height:1.1}
.delta{font-size:13px;font-weight:700}.d-gut{color:#58c28a}.d-schlecht{color:#e8746e}.d-gleich{color:var(--ink2);font-weight:400}
.legende{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--ink2);margin-top:8px}
.legende i{display:inline-block;width:16px;height:3px;vertical-align:middle;margin-right:5px}
.l-sgw{background:var(--sgw)}.l-grau{background:#7b8792}.l-gruen{background:#1f4a33;height:9px!important}.l-strich{background:var(--ink);width:2px!important;height:12px!important}
.l-hohl{width:9px!important;height:9px!important;border-radius:50%;border:2px solid var(--sgw)}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.kachel{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:#12161a}
.kachel .name{font-size:13px;color:var(--ink2)}
.kachel .unten{display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.vermutet{display:inline-block;margin-left:5px;width:15px;height:15px;line-height:15px;text-align:center;border-radius:50%;background:#3a3222;color:#e0b04a;font-size:10px;font-weight:700;cursor:help}
.zahlraster{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.zahlraster.drei{grid-template-columns:repeat(3,1fr);margin-top:12px}
.zahlraster b{display:block;font-size:26px}.zahlraster span{font-size:12px;color:var(--ink2)}
.fuss{font-size:12px;color:var(--ink2);margin:10px 0 0}
table.ziele td{padding:7px 8px 7px 0;font-size:14px;vertical-align:middle;border-bottom:1px solid var(--line)}
td.zahl,th.zahl{text-align:right;white-space:nowrap}
.ok{color:#58c28a}.nok{color:#e8746e;font-weight:800}
.zwei{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.zwei ul,.modul ul{margin:0;padding-left:18px;font-size:14px}
.schmal{max-width:430px}
table.liste td{font-size:14px}
tr.klick{cursor:pointer}tr.klick:hover,tr.klick.an{background:#1d2228}
table.liste a{color:var(--ink);text-decoration:none;font-weight:600}
.drei-spalten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.szene{display:grid;grid-template-columns:40px 1fr;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.szene .min{color:var(--ink2);font-weight:700}.szene.fehler .min{color:#e8746e}
@media (max-width:900px){.sp-4,.sp-6,.sp-8{grid-column:span 12}.drei-spalten,.zwei{grid-template-columns:1fr}.menue{width:92vw}}

/* Aktive Links in der Navigation klar von noch nicht gebauten Bereichen trennen */
header.top nav a{color:var(--ink);font-weight:600}
header.top nav a:hover{color:var(--sgw)}
header.top nav .bald{color:#4d555d}
header.top nav .bald small{font-size:10px;letter-spacing:.06em;text-transform:uppercase;border:1px solid #333a42;border-radius:4px;padding:1px 4px;margin-left:3px}
a.knopf{display:inline-block;background:var(--sgw);color:var(--auf-akzent);text-decoration:none;font-weight:600;border-radius:8px;padding:9px 16px;margin-bottom:8px}

/* Wappen: Logo oder Ersatz mit Kuerzel */
.logo{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none;object-fit:contain}
.logo.ersatz{border-radius:50%;background:#262c33;color:var(--ink2);font-size:10px;font-weight:800;letter-spacing:.02em}
.logo.gross{width:52px;height:52px}.logo.gross.ersatz{font-size:14px}
.logo.riesig{width:84px;height:84px}.logo.riesig.ersatz{font-size:22px}
.spielzeile{grid-template-columns:30px 30px 1fr auto 44px}

/* Spieluebersicht */
.spielkarten{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;margin-bottom:8px}
.spielkarte{position:relative;display:block;color:var(--ink);text-decoration:none;border-left:4px solid var(--line)}
.spielkarte:hover{border-color:var(--sgw)}
.spielkarte .oben{display:flex;justify-content:space-between;font-size:12px;color:var(--ink2);margin-bottom:12px;padding-right:32px}
.spielkarte .ausgang{position:absolute;top:14px;right:14px}
.paarung,.spielkopf{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center}
.team{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:14px}
.stand{text-align:center;font-size:30px;font-weight:800;line-height:1.1}
.stand small{display:block;font-size:12px;font-weight:400;color:var(--ink2);margin-top:4px}
.a-rand-S{border-left-color:#1f6b42}.a-rand-N{border-left-color:#8a2f2b}.a-rand-U{border-left-color:#5a626b}

/* Spielseite */
.spielkopf{border-left:4px solid var(--line);margin:8px 0 16px;padding:22px 20px}
.spielkopf .team{font-size:17px}
.spielkopf .tore{display:block;font-size:54px;margin:4px 0}
.videobox{margin-bottom:16px}
.videokopf{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.videokopf h2{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:0;border-left:3px solid var(--sgw);padding-left:8px}
.knopf.klein,button.klein{font-size:13px;padding:6px 12px;margin:0;cursor:pointer}
.videoflaeche video{width:100%;max-height:70vh;background:#000;border-radius:8px;margin-top:12px;display:block}
.anstoss{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:13px}
.anstoss .zeit{font-variant-numeric:tabular-nums;color:var(--ink);min-width:48px}
.videohinweis{margin:8px 0 0;min-height:1em}
.videohinweis.warnung{color:#e0b04a}
.videobox.dock{position:fixed;right:16px;bottom:16px;width:440px;z-index:30;box-shadow:0 18px 40px rgba(0,0,0,.6);margin:0;padding:12px}
.videobox.dock .anstoss,.videobox.dock .dateiname,.videobox.dock h2,.videobox.dock .zs-ablage{display:none}
.videobox.dock .videoflaeche video{margin-top:8px}
.szenenlink{cursor:pointer}.szenenlink:hover circle{stroke:var(--ink);stroke-width:2}
.szenen{max-height:420px;overflow:auto}
a.szene{color:var(--ink);text-decoration:none}
a.szene[href]{cursor:pointer}a.szene[href]:hover,a.szene.an{background:#1d2228}
.szenen .szene{grid-template-columns:52px 1fr auto;padding:8px 8px;border-left:3px solid var(--sgw)}
.szenen .szene.gegner{border-left-color:#7b8792}
.szenen .szene.tor{background:#20262d}.szenen .szene.tor b::before{content:"⚽ "}
.szene .xg{text-align:right;font-weight:700}.szene .xg small{font-weight:400}
.zeichen{width:10px;height:14px;border-radius:2px;align-self:center}
.z-gelb{background:#e8c33a}.z-rot{background:#e8746e}
.legende.oben{margin:0 0 8px}
.l-tor{width:11px!important;height:11px!important;border-radius:50%;background:var(--sgw);border:2px solid var(--ink)}
.l-punkt{width:8px!important;height:8px!important;border-radius:50%;background:var(--sgw)}
.l-ecke{width:0!important;height:0!important;border-left:8px solid #6b747d;border-top:4px solid transparent;border-bottom:4px solid transparent}
.l-gelb{width:5px!important;height:10px!important;background:#e8c33a;border-radius:1px}
table.chancen td,table.vergleich td{font-size:14px;vertical-align:middle;padding:8px 8px 8px 0}
table.chancen small{display:block;color:var(--ink2);font-size:12px}
table.chancen td.breit{width:42%}
table.vergleich td.mitte{width:60%;text-align:center}
table.vergleich td.mitte span{display:block;font-size:12px;color:var(--ink2);margin-bottom:3px}
table.vergleich th:last-child{text-align:left}
table.vergleich td.vorn{font-weight:800}
@media (max-width:900px){.videobox.dock{width:92vw}}
.breit-scroll{overflow-x:auto}
table.spielerwerte td:first-child{white-space:nowrap}
table.spielerwerte th,table.spielerwerte td{padding:8px 8px}

/* Mannschaft und Gegner */
.mitlogo{display:flex;align-items:center;gap:14px}
.zahlraster.vier{grid-template-columns:repeat(4,1fr);margin-bottom:14px}
.zahlraster.fuenf{grid-template-columns:repeat(5,1fr)}
table.stil tr.gruppe td{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);padding-top:16px;border-bottom:1px solid var(--sgw)}
table.stil td.rang{white-space:nowrap}table.stil td.rang small,table.anteile small{display:inline-block;margin-left:8px;color:var(--ink2);font-size:12px}
table.stil td.rang svg{vertical-align:middle}
table.minuten td.breit,table.anteile td.breit{width:45%}
table.anteile td.breit svg{width:70%;vertical-align:middle}
.spielkarten-klein{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin:12px 0}
.spielkarten-klein h3{margin-top:0}
.form{display:inline-block;width:11px;height:11px;border:2px solid var(--sgw)}
.f-kreis{border-radius:50%}.f-raute{transform:rotate(45deg)}
.f-dreieck{width:0;height:0;border:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:12px solid var(--sgw)}
.gegnerwahl{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.gegnerkarte{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--ink);text-decoration:none;text-align:center;font-size:14px}
.gegnerkarte:hover{border-color:var(--sgw)}
.modulkopf{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.marke-status{font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid #6b5a2a;color:#e0b04a;border-radius:4px;padding:2px 7px;white-space:nowrap}
.marke-status.ok{border-color:#1f6b42;color:#58c28a}
.nichtimpdf{opacity:.55}
form.pruefen{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:8px}
form.pruefen textarea{width:100%;background:#0f1215;color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:inherit;font-size:14px;resize:vertical}
form.pruefen div{display:flex;gap:18px;align-items:center;font-size:14px}
form.pruefen button{margin-left:auto}
label small{display:block;color:var(--ink2);font-size:12px}

/* Spielwahl der Gegneranalyse: Haken erst im Auswahlmodus */
.wahlkarte{position:relative}
.wahlhaken{display:none;position:absolute;top:10px;left:12px;z-index:2;cursor:pointer}
.wahlhaken input{width:20px;height:20px;accent-color:var(--sgw);cursor:pointer}
form.wahl .wahlhaken{display:block}
form.wahl .spielkarte .oben{padding-left:30px}
form.wahl .wahlkarte:has(input:checked) .spielkarte{border-color:var(--sgw);background:#1f2227}
form.wahl .wahlkarte:not(:has(input:checked)) .spielkarte{opacity:.6}
.nur-mit-wahl{display:none}
form.wahl .nur-mit-wahl{display:revert}
form.wahl .nur-ohne-wahl{display:none}

/* Videozusammenschnitt der Gegneranalyse */
.zusammenschnitt{margin-bottom:8px}
.zs-spiele{margin:12px 0}
.zs-spiele select{background:#0f1215;color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:5px 8px;font:inherit;font-size:13px;max-width:280px}
.zs-spiele .fehlt{color:#e0b04a}.zs-spiele .da{color:#58c28a}
.zs-wahl{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0 4px}
.zs-wahl>div{display:flex;gap:6px;flex-wrap:wrap}
.zs-wahl button.chip{font:inherit;font-size:13px;font-weight:400}
.zs-buehne{display:grid;grid-template-columns:minmax(0,3fr) minmax(260px,2fr);gap:16px;align-items:start}
.zs-bild{position:relative;background:#000;border-radius:8px;overflow:hidden;aspect-ratio:16/9}
.zs-bild video{width:100%;height:100%;display:block}
.zs-liste{max-height:480px;overflow:auto;border:1px solid var(--line);border-radius:8px}
.zs-szene{display:grid;grid-template-columns:22px 44px 1fr;gap:8px;align-items:center;padding:7px 10px;border-bottom:1px solid var(--line);font-size:13px;cursor:pointer}
.zs-szene:hover{background:#1d2228}.zs-szene.an{background:#262c33;border-left:3px solid var(--sgw)}
.zs-szene.fehlt{opacity:.45}
.zs-szene small{display:block;color:var(--ink2);font-size:11px}
.zs-szene .min{color:var(--ink2);font-weight:700}
.zs-kopf{display:flex;justify-content:space-between;padding:7px 10px;font-size:12px;color:var(--ink2);border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--card)}
.zs-kopf button{font-size:12px}
#zs-aufnahme.laeuft{background:#8a2f2b}
@media (max-width:900px){.zs-buehne{grid-template-columns:1fr}}
.zs-tasten{font-size:12px;margin:2px 0 0}
/* Vollbild fuer Videoplayer (vollbild.js, docs/wissen/vollbild-player.md): ins Vollbild geht
   .vb samt Leiste und Szenenliste, nicht das Videoelement. Gilt fuer Zusammenschnitt und Popup. */
.vb-flaeche{position:relative;width:100%;height:100%}
/* Oben rechts: oben links zeigt das Ligenvideo Spielzeit und Spielstand */
.vb-titel{position:absolute;right:12px;top:12px;text-align:right;background:rgba(15,18,21,.82);border-left:3px solid var(--sgw);padding:6px 12px;border-radius:4px;font-size:14px;font-weight:600;pointer-events:none}
.vb-titel small{display:block;font-weight:400;color:var(--ink2);font-size:12px}
.vb-leiste{display:none}
.vb.voll{display:flex;aspect-ratio:auto;border-radius:0;background:#000}
.vb.voll .vb-flaeche{flex:1;min-width:0}
.vb.voll video{width:100%;height:100%;max-height:none;border-radius:0}
.vb.voll .vb-titel{top:20px;right:20px;font-size:18px;padding:8px 16px}
.vb.voll .vb-titel small{font-size:14px}
.vb .vb-liste{display:none}
.vb.liste-auf .vb-liste{display:block;flex:none;width:380px;max-height:none;height:100%;overflow:auto;border:0;border-left:1px solid var(--line);border-radius:0;background:var(--card)}
.vb.voll .vb-leiste{display:flex;align-items:center;gap:8px;position:absolute;left:50%;bottom:64px;transform:translateX(-50%);padding:8px 10px;background:rgba(15,18,21,.86);border:1px solid var(--line);border-radius:10px;transition:opacity .2s}
.vb-leiste button{white-space:nowrap}
.vb-leiste button.still{padding:6px 8px;color:var(--ink)}
.vb-leiste [hidden]{display:none}
.vb-haken{display:flex;align-items:center;gap:6px;padding:0 6px;font-size:14px;cursor:pointer;white-space:nowrap}
.vb-haken input{width:18px;height:18px;accent-color:var(--sgw)}
.vb-stand{min-width:52px;text-align:center;font-size:13px;color:var(--ink2)}
.vb.ruhig .vb-leiste{opacity:0;pointer-events:none}
.vb.ruhig{cursor:none}
@media (prefers-reduced-motion:reduce){.vb-leiste{transition:none}}

/* Kennzahlen fuer das Trainerteam (auch Handy und Tablet) */
.tk-wahl{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;margin-bottom:10px;scrollbar-width:thin}
.tk-wahl .chip{flex:none}
.tk-spiel{display:inline-flex;align-items:center;gap:6px}
.tk-punkt{width:8px;height:8px;border-radius:50%;background:#5a626b}
.tk-ergebnis{margin-bottom:14px;padding:14px 18px}
.tk-paarung{display:flex;align-items:center;justify-content:center;gap:18px}
.tk-paarung>span{display:flex;align-items:center;gap:8px}
.tk-paarung strong{font-size:28px;letter-spacing:.04em}
.tk-ergebnis p{text-align:center;margin:6px 0 0}
.tk-kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:12px}
.tk-kachel{padding:12px 14px}
.tk-kachel>div:first-of-type{display:flex;align-items:baseline;gap:6px;margin:2px 0 6px}
.tk-kachel b{font-size:24px}.tk-kachel .trenner{color:var(--ink2)}
.wir{color:var(--sgw)}.die{color:#b9c0c7}
b.die{font-weight:600}
.tk-balken{display:block;height:6px;border-radius:3px;background:#3a4149;overflow:hidden}
.tk-balken i{display:block;height:100%;background:var(--sgw)}
.tk-video{display:flex;gap:10px;font-size:13px;white-space:nowrap}
.tk-video a{text-decoration:none}
.tk-kachel .tk-video{margin-top:8px}
.tk-legende{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 12px}
.tk-legende i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.tk-legende i.wir{background:var(--sgw)}.tk-legende i.die{background:#b9c0c7}
.tk-gruppe{margin-bottom:12px;padding:0}
.tk-gruppe>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;cursor:pointer;list-style:none}
.tk-gruppe>summary::-webkit-details-marker{display:none}
.tk-gruppe>summary h2{margin:0;font-size:17px}
.tk-gruppe>summary h2::before{content:"▸ ";color:var(--ink2)}
.tk-gruppe[open]>summary h2::before{content:"▾ "}
.tk-kopfspalten{display:flex;gap:24px;font-size:12px;color:var(--ink2);text-transform:uppercase;letter-spacing:.06em}
.tk-zeile{border-top:1px solid var(--line)}
.tk-inhalt{display:grid;grid-template-columns:minmax(0,1fr) 92px 120px 92px 48px;align-items:center;gap:12px;padding:9px 18px;list-style:none}
summary.tk-inhalt{cursor:pointer}
summary.tk-inhalt::-webkit-details-marker{display:none}
details.tk-zeile[open]>summary{background:#1d2228}
.tk-name{font-size:15px}
.tk-info{color:var(--ink2);font-size:13px;cursor:help}
.tk-wert{font-weight:700;font-size:16px;text-align:right}
.tk-wert.die{text-align:left}
.tk-wert small{display:block;font-weight:400;font-size:11px;color:var(--ink2)}
.tk-inhalt .tk-video{justify-content:flex-end}
.tk-hinweis{margin:0;padding:4px 18px 10px}
.tk-spiele{margin:0 0 10px;font-size:14px}
.tk-spiele td{padding:5px 18px;border:0}
.tk-spiele td.wir,.tk-spiele td.die{font-weight:700;width:90px}
.tk-spiele td.wir{text-align:right}
@media (max-width:700px){
  .tk-inhalt{grid-template-columns:1fr 1fr auto;grid-template-areas:"name name video" "wir balken die";gap:4px 10px;padding:10px 14px}
  .tk-name{grid-area:name}.tk-inhalt .tk-video{grid-area:video}
  .tk-wert.wir{grid-area:wir;text-align:left}.tk-wert.die{grid-area:die;text-align:right}
  .tk-inhalt .tk-balken{grid-area:balken;align-self:center}
  .tk-inhalt{grid-template-columns:auto 1fr auto}
  .tk-kopfspalten{display:none}
  .tk-gruppe>summary{padding:12px 14px}
  .tk-hinweis{padding:4px 14px 10px}.tk-spiele td{padding:5px 14px}
  .tk-kacheln{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tk-kachel b{font-size:20px}
  .tk-paarung{gap:10px}.tk-paarung strong{font-size:22px}
}

/* Handy: Kopfzeile umbrechen, Menue waagerecht scrollbar, weniger Rand */
@media (max-width:700px){
  header.top{flex-wrap:wrap;gap:8px 14px;padding:10px 16px}
  header.top nav{order:3;flex-basis:100%;overflow-x:auto;gap:16px;padding-bottom:4px}
  header.top nav a{white-space:nowrap}
  header.top .wer{margin-left:auto}
  main{padding:16px}
  h1{font-size:22px}
  nav.reiter{overflow-x:auto}
  nav.reiter a{white-space:nowrap;padding:10px 12px}
  .kopf{margin-bottom:12px}
}

/* Scouting */
.sc-tabelle{padding:6px 8px;overflow-x:auto}
.sc-tabelle td,.sc-tabelle th{padding:8px 10px}
.sc-tabelle .zahl{text-align:right;white-space:nowrap}
.sc-tabelle tr.eigen td{background:var(--akzent-zart)}
.sc-verein{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}
.sc-verein:hover span{color:var(--sgw)}
.sc-verein .logo{width:26px;height:26px}
@media (max-width:700px){.sc-tabelle .breit{display:none}.sc-tabelle td,.sc-tabelle th{padding:8px 6px}}

/* Torwart */
.tw-elfmeter td small{display:block;color:var(--ink2);font-size:12px}
.tw-elfmeter a{text-decoration:none}
.tw-ecken{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:6px 0 12px}
.tw-ecken>div{display:flex;flex-direction:column;gap:4px}
.tw-ecken b{font-size:26px}
.tw-schuetzen .zahl{text-align:right}
@media (max-width:700px){.tw-elfmeter .breit,.tw-schuetzen .breit{display:none}.tw-ecken b{font-size:20px}}
.tw-rollen{overflow-x:auto}.tw-schuetzen th,.tw-schuetzen td{padding:8px 6px;white-space:nowrap}
.tw-elfmeter th,.tw-elfmeter td{padding:8px 6px}

/* Popup-Player */
.pp{position:fixed;inset:0;z-index:100;background:rgba(5,7,9,.72);display:flex;align-items:center;justify-content:center;padding:24px}
.pp[hidden]{display:none}
body.pp-offen{overflow:hidden}
.pp-fenster{background:var(--card);border:1px solid var(--line);border-radius:14px;width:min(1100px,100%);max-height:100%;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.pp-kopf{display:flex;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line)}
.pp-kopf .pp-titel{flex:1}
.pp-zu{font-size:20px;line-height:1}
.pp-export{font-size:13px;color:var(--sgw);text-decoration:none}
.pp-koerper{display:grid;grid-template-columns:1fr}
.pp.pp-mit-liste .pp-koerper{grid-template-columns:1fr 300px}
.pp-buehne{padding:14px 16px}
.pp video{width:100%;max-height:62vh;background:#000;border-radius:8px;display:block}
.pp-bild{position:relative}
.pp-bild:not(.voll) .vb-titel{display:none}
.pp-unter{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px;font-size:14px}
.pp-knoepfe{display:flex;gap:8px;align-items:center}
.pp-fehlt,.pp-anstoss{margin-top:10px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#1d2228}
.pp-fehlt p,.pp-anstoss p{margin:0 0 8px;font-size:14px}
.pp-hinweis{margin:8px 0 0;min-height:1em}
.pp-hinweis.warnung{color:#e8746e}
.pp-liste{border-left:1px solid var(--line);max-height:70vh;overflow:auto;padding:6px}
.pp-liste:empty{display:none}
/* Szenenliste im Popup: Haken fuer den Export, Text startet die Szene, Kopf mit Auswahl und Download */
.pp-listenkopf{position:sticky;top:-6px;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;margin:-6px -6px 4px;padding:10px 12px;background:var(--card);border-bottom:1px solid var(--line);font-size:12px;color:var(--ink2)}
.pp-listenkopf button.still{font-size:12px}
.pp-listenkopf .pp-download{flex-basis:100%}
.pp-zeile{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:4px;padding:2px 4px 2px 8px;border-radius:8px}
.pp-zeile input{margin:10px 0 0;width:15px;height:15px;accent-color:var(--sgw);cursor:pointer}
.pp-zeile-text{display:grid;grid-template-columns:42px 1fr;gap:2px 8px;width:100%;text-align:left;background:transparent;color:var(--ink);font-weight:400;font-size:13px;padding:6px 4px;border-radius:6px}
.pp-zeile-text small{grid-column:2;color:var(--ink2);font-size:11px}
.pp-zeile.an,.pp-zeile:hover{background:#262c33}
.pp-zeile.aus .pp-zeile-text{opacity:.45}
@media (max-width:800px){
  .pp{padding:0;align-items:stretch}
  .pp-fenster{border-radius:0;width:100%}
  .pp.pp-mit-liste .pp-koerper{grid-template-columns:1fr}
  .pp-liste{border-left:0;border-top:1px solid var(--line);max-height:40vh}
}

/* Videoablage */
.vt-kopf{margin-bottom:14px}
.vt-knoepfe{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.vt-filter{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.vt-filter button.chip{font:inherit;font-size:13px;font-weight:400}
.vt-hinweis.warnung{color:#e8746e}
.vt-paarung{display:flex;align-items:center;gap:8px}
.vt-paarung small{display:block}
.vt-datei .da{color:#58c28a}.vt-datei .fehlt{color:#e8746e}
.vt-aktion{white-space:nowrap;text-align:right}
@media (max-width:700px){.vt-tabelle .breit,.vt-tabelle th.zahl,.vt-tabelle td.zahl{display:none}.vt-paarung .logo{display:none}}

/* Feedback-Knopf (feedback.js). Unten links, weil unten rechts der angedockte Videoplayer sitzt. */
.fbk{position:fixed;left:16px;bottom:16px;z-index:40;width:42px;height:42px;padding:0;border-radius:10px;font-size:20px;line-height:1;box-shadow:0 8px 22px rgba(0,0,0,.45);opacity:.85}
.fbk:hover,.fbk:focus-visible{opacity:1}
.fbk-zaehler{background:var(--sgw);color:var(--auf-akzent);font-size:13px;font-weight:700;text-decoration:none;border-radius:999px;padding:3px 10px}
.fbk-blatt{width:min(460px,92vw);background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:18px 20px;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.fbk-blatt::backdrop{background:rgba(5,7,9,.6)}
.fbk-blatt form{display:flex;flex-direction:column;gap:6px}
.fbk-kopf{display:flex;justify-content:space-between;align-items:center}
.fbk-kopf h2{margin:0;font-size:18px}
.fbk-zu{font-size:18px}
.fbk-blatt .leise{margin:4px 0 6px}
.fbk-label{font-size:13px;color:var(--ink2);margin-top:8px}
.fbk-sterne{display:flex;gap:2px}
.fbk-stern{background:transparent;color:var(--sgw);font-size:24px;padding:0 3px;font-weight:400}
.fbk-chips{display:flex;flex-wrap:wrap;gap:6px}
.fbk-chips button{background:transparent;color:var(--ink2);border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:14px;font-weight:500}
.fbk-chips button[aria-pressed=true]{background:var(--sgw);border-color:var(--sgw);color:var(--auf-akzent)}
.fbk-blatt textarea{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit;resize:vertical}
.fbk-senden{margin-top:6px}
.fbk-senden:disabled{opacity:.6;cursor:wait}
.fbk-meldung{margin:4px 0 0;font-size:14px;color:#7fc98a;min-height:1.2em}
.fbk-meldung.fehler{color:#e8746e}
@media print{.fbk,.fbk-blatt{display:none}}
/* Szenen eines Spielers im Video (Spielerseite) */
.abspielen{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.abspielen .chip{font-size:12px;padding:4px 10px}
.abspielen .chip:hover{border-color:var(--sgw);color:var(--ink)}
a.video,table.liste a.video{color:var(--sgw);text-decoration:none;font-size:11px;font-weight:400;margin-left:6px;padding:0 2px}
a.video:hover,table.liste a.video:hover{color:var(--ink)}
.form.grau{border-color:#7b8792}.f-dreieck.grau{border-color:transparent;border-bottom-color:#7b8792}
.form.voll{background:var(--sgw)}
.szenenlink:hover line:not(.treffer){stroke-width:3;stroke-opacity:1}
.szenenlink:hover rect{stroke:var(--ink)}
.szenenlink:hover polygon{stroke:var(--ink);stroke-width:2}
.punktlink{cursor:pointer}.punktlink:hover circle{stroke:var(--ink)}
#zs-seiten[hidden]{display:none}
/* Zeitraumfilter: Abhakmenue */
.zeitraum{flex-wrap:wrap}
.wahlkopf{display:flex;align-items:center;gap:6px;padding:6px 8px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;position:sticky;top:-6px;background:#1b2026;z-index:1}
.wahlkopf .leise{margin-right:auto;font-size:12px}
button.voll{background:var(--sgw);border-color:var(--sgw);color:var(--auf-akzent)}
.spielzeile.wahl{grid-template-columns:18px 26px 26px 1fr auto auto;cursor:pointer}
.spielzeile.wahl input{accent-color:var(--sgw);width:16px;height:16px;margin:0}
.spielzeile.wahl .nur{font-size:11px;color:var(--ink2);text-decoration:none;white-space:nowrap}
.spielzeile.wahl .nur:hover{color:var(--sgw)}
.wahlkopf button:not(.voll){background:transparent;border:1px solid var(--line);color:var(--ink2);font-weight:400}
/* Zusammenschnitt: Spiele und Videodateien zugeklappt unter dem Player */
.zs-ablage{margin-top:16px;border-top:1px solid var(--line);padding-top:10px}
.zs-ablage summary{cursor:pointer;font-size:13px;color:var(--ink2);padding:4px 0}
.zs-ablage summary:hover{color:var(--ink)}
.zs-ablage[open] summary{margin-bottom:10px}
.zs-ablage .warnung{color:#e0b04a}
.zs-ablage .zs-spiele{margin-top:10px}
button:disabled{opacity:.45;cursor:not-allowed}
/* Ligavergleich */
.liga-wahl{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:14px}
.liga-trenner{width:1px;height:22px;background:var(--line);margin:0 8px}
table.liga th a{color:var(--ink2);font-weight:600;text-decoration:none}
table.liga th a:hover,table.liga th.sortiert a{color:var(--sgw)}
table.liga td.sortiert{background:rgba(255,255,255,.03)}
table.liga tr.markiert td{color:var(--sgw)}table.liga tr.markiert .sc-verein span{color:var(--sgw)}
table.liga tr.schnitt td{color:var(--ink2);border-top:1px solid var(--line)}
table.liga .sc-verein .logo{width:22px;height:22px}
table.stil td.rang a{color:inherit;text-decoration:none}table.stil td.rang a:hover small{color:var(--sgw)}
table.liga th sup{font-size:9px;margin-left:2px;opacity:.7}
.liga-hinweise{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:14px 0 0;font-size:12px;color:var(--ink2)}
.liga-hinweise dt{font-weight:600;color:var(--ink)}.liga-hinweise dd{margin:0}
.liga-tage{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;padding:8px 2px;font-size:14px}
.liga-tage label{display:flex;gap:8px;align-items:center;cursor:pointer}
/* Laufwerte: Spieler mit wenig Spielzeit blass am Tabellenende */
table.liste tr.leise td,table.liste tr.leise a,table.liste tr.leise b{color:var(--ink2);font-weight:400}
/* Spinnennetze (module/netz.py): Vergleichsgruppe per Pills, Radios nur optisch versteckt */
.nz{position:relative}
.nz-r{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.nz-wahl{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 8px;font-size:13px}
.nz-karte{display:none}
.nz>input.nz-1:checked~.nz-karte.nz-1,.nz>input.nz-2:checked~.nz-karte.nz-2,.nz>input.nz-3:checked~.nz-karte.nz-3{display:block}
.nz>input.nz-1:checked~.nz-wahl .nz-1,.nz>input.nz-2:checked~.nz-wahl .nz-2,.nz>input.nz-3:checked~.nz-wahl .nz-3{background:var(--sgw);border-color:var(--sgw);color:var(--auf-akzent)}
.nz>input.nz-1:focus-visible~.nz-wahl .nz-1,.nz>input.nz-2:focus-visible~.nz-wahl .nz-2,.nz>input.nz-3:focus-visible~.nz-wahl .nz-3{outline:2px solid var(--sgw);outline-offset:2px}
.nz-notiz{margin:0 0 6px}
.nz-warn{color:#e0b05a}
.nz-reihe{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.nz-reihe{grid-template-columns:minmax(0,1fr)}}
.nz-bild svg{width:100%;height:auto;max-width:476px;display:block;margin:0 auto}
.nz-legende{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink2);margin-bottom:8px}
.nz-legende span{display:inline-flex;align-items:center;gap:6px}
.nz-legende i{display:inline-block;width:10px;height:10px;border-radius:50%}
.nz-legende i.linie{width:18px;height:0;border-radius:0;border-top:2px solid var(--ink2);background:none}
.nz-legende i.gestrichelt{border-top-style:dashed}
.nz-tabelle td,.nz-tabelle th{padding:6px 8px;font-size:13px}
.nz-perz{display:inline-block;min-width:28px;text-align:center;font-size:11px;border:1px solid var(--line);border-radius:999px;padding:0 5px;margin-left:4px;color:var(--ink2)}
.nz-perz.gut{color:#58c28a;border-color:#2c5a42}
.nz-perz.schlecht{color:#e8746e;border-color:#5f3431}