:root{
  --bg:#EEF1F4; --surface:#FFFFFF; --ink:#18222F; --muted:#5B6676;
  --court:#1F4E9C; --court-ink:#FFFFFF; --line:#E8650F; --rule:#D5DBE3; --soft:#E6EBF1; --warn:#FFF1E6;
  --link:#1F4E9C;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0E151F; --surface:#17202C; --ink:#E7ECF2; --muted:#94A1B2;
    --court:#22457F; --court-ink:#F4F7FB; --line:#FF8A3D; --rule:#2A3646; --soft:#1F2A38; --warn:#2B2118;
    --link:#FF8A3D;
    color-scheme:dark;
  }
}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ background:var(--bg); color:var(--ink); min-height:100vh;
  font-family:'Barlow',system-ui,sans-serif; font-size:15px; line-height:1.4; -webkit-text-size-adjust:100%; }
body.noscroll{ overflow:hidden; }
button:focus-visible, a:focus-visible{ outline:2px solid var(--line); outline-offset:2px; }
a{ color:var(--link); font-weight:500; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.cond{ font-family:'Barlow Condensed','Arial Narrow',sans-serif; }

.a-app{ max-width:440px; margin:0 auto; min-height:100vh; display:flex; flex-direction:column; }
.a-loading{ padding:40px 16px; color:var(--muted); max-width:440px; margin:0 auto; }

.a-head{ padding:20px 16px 12px; padding-top:max(20px, env(safe-area-inset-top)); }
.a-brand{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.a-brand h1{ font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:32px; margin:0; line-height:1; }
.a-brand span{ color:var(--muted); font-size:13px; text-align:right; }
.a-banner{ margin:12px 0 0; padding:9px 12px; background:var(--warn); border-left:3px solid var(--line);
  border-radius:6px; font-size:13px; }
.a-error{ margin:0 0 12px; padding:9px 12px; background:var(--warn); border-radius:8px; font-size:13px; }

.a-seg{ display:flex; gap:6px; margin-top:14px; overflow-x:auto; padding-bottom:2px; }
.a-seg button{ border:1px solid var(--rule); background:transparent; color:var(--ink); padding:7px 13px;
  border-radius:999px; font:inherit; font-weight:500; white-space:nowrap; cursor:pointer; }
.a-seg button[aria-pressed=true]{ background:var(--court); border-color:var(--court); color:var(--court-ink); }
.a-pick{ display:block; margin-top:14px; }
.a-search{ margin-top:10px; position:relative; }
.a-search input{ width:100%; border:1px solid var(--rule); background:var(--surface); color:var(--ink); padding:9px 12px;
  border-radius:10px; font:inherit; }
.a-search input:focus-visible{ outline:2px solid var(--line); outline-offset:1px; }
.a-sr-note{ margin:8px 2px 0; color:var(--muted); font-size:14px; }
.a-sr-list{ list-style:none; margin:6px 0 0; padding:0; background:var(--surface); border-radius:12px; overflow:hidden;
  border:1px solid var(--rule); }
.a-sr-list li + li{ border-top:1px solid var(--soft); }
.a-sr-list button{ display:block; width:100%; text-align:left; background:none; border:0; color:inherit; font:inherit;
  padding:10px 12px; cursor:pointer; }
.a-sr-list button:hover, .a-sr-list button:focus-visible{ background:var(--soft); }
.a-sr-list strong{ font-weight:600; display:block; }
.a-sr-list small{ color:var(--muted); font-size:13px; }
.a-pick select{ width:100%; border:1px solid var(--rule); background:var(--surface); color:var(--ink); padding:9px 12px;
  border-radius:10px; font:inherit; font-weight:500; }

main{ flex:1; padding:0 16px 96px; }
.a-round{ display:flex; align-items:center; justify-content:space-between; margin:6px 0 12px; }
.a-round button{ width:38px; height:38px; border-radius:8px; border:1px solid var(--rule); background:var(--surface);
  color:var(--ink); font-size:20px; line-height:1; cursor:pointer; }
.a-round button:disabled{ opacity:.35; cursor:default; }
.a-round strong{ font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:600; display:block; text-align:center; }
.a-round small{ color:var(--muted); display:block; text-align:center; font-size:13px; }

.a-group{ margin-bottom:18px; }
.a-group h2{ font-family:'Barlow Condensed',sans-serif; font-size:18px; font-weight:600; margin:0 2px 6px; color:var(--muted); }
.a-list{ background:var(--surface); border-radius:12px; overflow:hidden; }
.a-row{ display:grid; grid-template-columns:52px 1fr auto; gap:10px; align-items:center; width:100%;
  padding:12px 14px; background:none; border:0; border-top:1px solid var(--soft); color:inherit; font:inherit;
  text-align:left; cursor:pointer; }
.a-row:first-child{ border-top:0; }
.a-row:hover{ background:var(--soft); }
.a-status{ font-size:13px; color:var(--muted); line-height:1.25; }
.a-live{ color:var(--line); font-weight:600; display:flex; align-items:center; gap:6px; }
.a-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--line);
  animation:a-pulse 1.4s ease-in-out infinite; flex:none; }
.a-dot.light{ margin-right:7px; vertical-align:1px; }
.a-dot.inline{ margin-left:7px; vertical-align:1px; }
@keyframes a-pulse{ 50%{ opacity:.25; } }
@media (prefers-reduced-motion: reduce){ .a-dot{ animation:none; } }
.a-teams{ line-height:1.55; min-width:0; }
.a-teams div{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.a-teams .win{ font-weight:600; }
.a-fav{ color:var(--line); font-size:12px; margin-left:6px; }
.a-score{ font-family:'Barlow Condensed',sans-serif; font-size:19px; font-weight:600; text-align:right;
  line-height:1.3; font-variant-numeric:tabular-nums; }
.a-muted{ color:var(--muted); }
.a-note{ color:var(--muted); font-size:13px; margin:14px 2px 0; max-width:60ch; }

.a-table{ width:100%; border-collapse:collapse; background:var(--surface); border-radius:12px; overflow:hidden;
  font-variant-numeric:tabular-nums; font-size:14px; }
.a-table th{ font-weight:500; color:var(--muted); font-size:12px; text-align:right; padding:10px 6px; }
.a-table td{ text-align:right; padding:9px 6px; border-top:1px solid var(--soft); }
.a-table .l{ text-align:left; }
.a-table th:first-child, .a-table td:first-child{ padding-left:12px; width:28px; }
.a-table .name{ font-weight:500; }
.a-table .pts{ font-family:'Barlow Condensed',sans-serif; font-size:17px; font-weight:600; }
.a-table tr.fav td:first-child{ box-shadow:inset 3px 0 0 var(--line); }

.a-star{ background:none; border:0; cursor:pointer; color:var(--muted); font-size:18px; line-height:1; padding:4px; }
.a-star[aria-pressed=true]{ color:var(--line); }
.a-star.light{ color:var(--court-ink); opacity:.75; padding:4px 0; }
.a-star.light[aria-pressed=true]{ color:var(--line); opacity:1; }

.a-empty{ background:var(--surface); border-radius:12px; padding:18px 16px; color:var(--muted); }
.a-empty p{ margin:0 0 6px; max-width:60ch; }
.a-empty p:last-child{ margin-bottom:0; }
.a-empty strong{ color:var(--ink); }

.a-favcard{ margin-bottom:20px; }
.a-favhead{ display:flex; justify-content:space-between; align-items:center; margin:0 2px 8px; }
.a-favhead h2{ font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:600; margin:0; line-height:1.1; }

.a-tabs{ position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:100%; max-width:440px;
  display:grid; grid-template-columns:repeat(4,1fr); background:var(--surface); border-top:1px solid var(--rule); z-index:10;
  padding-bottom:env(safe-area-inset-bottom); }
.a-tabs button{ background:none; border:0; border-top:3px solid transparent; padding:12px 4px 14px; font:inherit;
  color:var(--muted); cursor:pointer; }
.a-tabs button[aria-current=page]{ color:var(--court); border-top-color:var(--court); font-weight:600; }
@media (prefers-color-scheme: dark){ .a-tabs button[aria-current=page]{ color:var(--ink); border-top-color:var(--line); } }
.a-badge{ display:inline-block; margin-left:6px; min-width:18px; padding:0 5px; border-radius:9px;
  background:var(--line); color:#fff; font-size:12px; font-weight:600; line-height:18px; }

.a-detail{ position:fixed; inset:0; background:var(--bg); overflow-y:auto; z-index:20; }
.a-detail-inner{ max-width:440px; margin:0 auto; padding-bottom:40px; }
.a-board{ background:var(--court); color:var(--court-ink); padding:14px 16px 34px; position:relative; overflow:hidden;
  padding-top:max(14px, env(safe-area-inset-top)); }
.a-board svg{ position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:340px; pointer-events:none; }
.a-back{ background:none; border:0; color:var(--court-ink); font:inherit; font-weight:500; cursor:pointer;
  padding:4px 0; margin-bottom:14px; position:relative; }
.a-board-grid{ display:grid; grid-template-columns:1fr auto 1fr; align-items:start; gap:10px; position:relative; }
.a-board .tname{ font-family:'Barlow Condensed',sans-serif; font-size:19px; font-weight:600; line-height:1.15; padding-top:12px; }
.a-board .tname.r{ text-align:right; }
.a-board .num{ font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:72px; line-height:1;
  font-variant-numeric:tabular-nums; }
.a-board .state{ text-align:center; margin-top:10px; font-size:14px; position:relative; }
.a-detail-body{ padding:0 16px; }
.a-detail-body h2{ font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:600; margin:22px 2px 8px; }
.a-info{ background:var(--surface); border-radius:12px; padding:12px 14px; margin:0; }
.a-info p{ margin:0 0 4px; }
.a-info p:last-child{ margin-bottom:0; }
.a-dl{ display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:14px; }
.a-dl dt{ color:var(--muted); }
.a-dl dd{ margin:0; }

.a-toast{ position:fixed; top:12px; left:50%; transform:translateX(-50%); width:calc(100% - 32px); max-width:408px;
  background:var(--ink); color:var(--bg); border-radius:12px; padding:11px 14px; z-index:30;
  display:flex; flex-direction:column; box-shadow:0 8px 28px rgba(0,0,0,.28); }
.a-toast strong{ font-weight:600; }
.a-toast span{ font-size:14px; }
.a-link{ background:none; border:0; padding:0; font:inherit; font-weight:500; color:var(--link);
  text-decoration:underline; cursor:pointer; }

/* Spielbericht */
.a-small{ padding:12px 2px; font-size:14px; }
.a-repseg{ margin:22px 0 10px; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); overflow:visible; }
.a-repseg button:first-child{ grid-column:1 / -1; }
/* lange Teamnamen: Schrift wird per fitText() verkleinert, ganz zuletzt "..." */
.a-repseg button{ padding:7px 6px; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-radius:12px; }

.a-scorers-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.a-scorers{ background:var(--surface); border-radius:14px; padding:12px 12px 6px; min-width:0; }
.a-scorers .team{ margin:0 0 6px; font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.a-scorers .pl{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:10px; font-size:14px; line-height:1.3; }
.a-scorers .pl small{ display:block; color:var(--muted); font-size:11.5px; margin-top:2px; }
.a-scorers .pl strong{ font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:700; line-height:1; flex:none; }

.a-flow{ list-style:none; margin:0; padding:0; background:var(--surface); border-radius:14px; overflow:hidden; }
.a-ev{ display:grid; grid-template-columns:1fr 64px 1fr; align-items:center; gap:8px; padding:10px 12px;
  border-top:1px solid var(--soft); font-size:14px; line-height:1.3; }
.a-ev:first-child{ border-top:0; }
.a-ev .txt:first-child{ text-align:right; }
.a-ev .txt strong{ font-weight:600; }
.a-ev .txt.minor{ color:var(--muted); }
.a-ev .mid{ text-align:center; display:flex; flex-direction:column; align-items:center; }
.a-ev .min{ color:var(--muted); font-size:11.5px; }
.a-ev .sc{ font-family:'Barlow Condensed',sans-serif; font-size:19px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1.05; }
.a-half{ padding:7px 12px; background:var(--soft); color:var(--muted); font-size:13px; font-weight:600; text-align:center; }
.a-ic{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 3px;
  border-radius:4px; font-size:11px; font-weight:700; line-height:1; color:var(--muted); border:1px solid var(--rule);
  vertical-align:middle; margin-left:2px; }
.a-ic.goal{ border:0; border-radius:50%; min-width:10px; width:10px; height:10px; padding:0; background:var(--court); margin:0 4px; }
.a-ic.goal:not(:empty){ width:18px; height:18px; color:var(--court-ink); font-size:10px; margin:0; }
.a-ic.miss{ border-style:dashed; }
.a-ic.pen{ background:var(--soft); color:var(--ink); border-color:transparent; }
.a-ic.yellow{ background:#F2C230; border:0; width:12px; min-width:12px; height:16px; padding:0; border-radius:2px; }
.a-ic.red{ background:#D63B2F; border:0; width:12px; min-width:12px; height:16px; padding:0; border-radius:2px; }
.a-ic.blue{ background:#2F6FD6; border:0; width:12px; min-width:12px; height:16px; padding:0; border-radius:2px; }
.a-ic.time{ color:var(--line); border-color:var(--line); }
@media (prefers-color-scheme: dark){ .a-ic.goal{ background:var(--line); } }
.a-squad td.pen{ white-space:nowrap; }
.a-squad abbr{ text-decoration:none; }
.a-offs{ margin-top:10px; }

/* Spielerstatistik */
.a-psearch{ margin:4px 0 12px; }
.a-h2{ font-family:'Barlow Condensed',sans-serif; font-size:21px; font-weight:600; margin:20px 2px 8px; }
.a-facts{ margin:0 2px 4px; }
.a-prow{ display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; padding:11px 14px;
  background:none; border:0; border-top:1px solid var(--soft); color:inherit; font:inherit; text-align:left; cursor:pointer; }
.a-prow:first-child{ border-top:0; }
.a-prow:hover{ background:var(--soft); }
.a-prow .who{ min-width:0; }
.a-prow strong{ font-weight:600; display:block; }
.a-prow small{ color:var(--muted); font-size:13px; display:block; }
.a-prow .val{ text-align:right; flex:none; }
.a-prow .val strong{ font-family:'Barlow Condensed',sans-serif; font-size:21px; line-height:1; }
.a-plink{ background:none; border:0; padding:0; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.a-plink strong{ font-weight:500; display:block; }
.a-plink small, .a-sub{ color:var(--muted); font-size:12px; display:block; font-weight:400; }
.a-plink:hover strong{ text-decoration:underline; }
.a-scorertab td{ vertical-align:middle; }
.a-teamtab td.name{ font-weight:500; }
.a-pback{ margin:2px 2px 10px; text-decoration:none; }
.a-phead h2{ font-family:'Barlow Condensed',sans-serif; font-size:28px; font-weight:700; margin:0 2px; line-height:1.1; }
.a-phead p{ margin:4px 2px 14px; color:var(--muted); font-size:14px; }
.a-tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.a-tiles div{ background:var(--surface); border-radius:12px; padding:10px 8px; text-align:center; }
.a-tiles strong{ display:block; font-family:'Barlow Condensed',sans-serif; font-size:26px; font-weight:700; line-height:1.1;
  font-variant-numeric:tabular-nums; }
.a-tiles span{ color:var(--muted); font-size:12px; }
.a-compare p{ font-size:14px; }
.a-compare .a-link{ font-size:inherit; }
.a-bars{ margin-top:12px; display:grid; gap:8px; }
.a-bar{ display:grid; grid-template-columns:minmax(0,1.3fr) 1fr 34px; gap:8px; align-items:center; font-size:13px; }
.a-bar .lbl{ color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.a-bar .track{ height:8px; background:var(--soft); border-radius:4px; overflow:hidden; }
.a-bar .track span{ display:block; height:100%; background:var(--muted); border-radius:4px; }
.a-bar.me .track span{ background:var(--line); }
.a-bar.me .lbl{ color:var(--ink); font-weight:600; }
.a-bar .v{ text-align:right; font-variant-numeric:tabular-nums; }
.a-pgames td.pen{ white-space:nowrap; }
.a-pgames th:first-child, .a-pgames td:first-child{ width:auto; white-space:nowrap; }
.a-teamtab th:first-child, .a-teamtab td:first-child{ width:auto; }
.a-dot.inline-l{ margin-right:8px; vertical-align:3px; }
.a-tickinfo{ margin:-4px 2px 4px; }