:root{
  --bg:#070a0e;
  --surface:#0b0f14;
  --card:#0f151c;
  --card-2:#131b24;
  --line:#1c2631;
  --line-2:#273342;
  --ink:#e6edf3;
  --ink-2:#a9b6c3;
  --muted:#6f7e8d;
  --res:#0a9fd8;
  --res-glow:rgba(10,159,216,.35);
  --enl:#21a35c;
  --enl-glow:rgba(33,163,92,.35);
  --radius:14px;
  --head:'Coda',system-ui,sans-serif;
  --body:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit}
.bg-grid{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
   radial-gradient(900px 500px at 10% -10%,rgba(10,159,216,.12),transparent 60%),
   radial-gradient(800px 500px at 100% 0%,rgba(33,163,92,.10),transparent 60%),
   linear-gradient(var(--bg),var(--bg));}
.bg-grid::after{content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:48px 48px;mask-image:linear-gradient(#000,transparent 70%)}
.wrap{max-width:1320px;margin:0 auto;padding:0 24px}

/* header */
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding:14px 24px;background:rgba(7,10,14,.78);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px}
.brand-logo{display:flex;align-items:center;flex:none}
.brand-logo img{height:44px;width:auto;max-width:120px;object-fit:contain;display:block}
.brand-logo .brand-mark{display:none}.brand-logo.fallback .brand-mark{display:block}
.brand-mark{width:34px;height:34px;flex:none;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  background:conic-gradient(from 210deg,var(--res),var(--enl),var(--res))}
.brand-name{font-family:var(--head);font-size:20px;letter-spacing:.06em;text-decoration:none;font-weight:800}
.brand-name span{color:var(--muted);margin:0 2px}
.brand-sub{font-size:12px;color:var(--muted);letter-spacing:.02em}
.tabs{display:flex;gap:4px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px}
.tabs a{font-family:var(--head);font-size:13px;text-decoration:none;color:var(--ink-2);padding:6px 12px;border-radius:999px;transition:background .15s,color .15s}
.tabs a:hover{color:var(--ink);background:var(--card-2)}
.tabs a[aria-current="page"]{background:var(--ink);color:#000}

/* hero */
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:end;padding:40px 0 24px}
.hero h1{font-family:var(--head);font-size:clamp(34px,5vw,56px);line-height:1;margin:0 0 10px;letter-spacing:.01em}
.hero p{margin:0;color:var(--ink-2);max-width:56ch}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}

/* tug-of-war bar */
.tug{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.tug-head{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--head)}
.tug-score{font-size:40px;line-height:1}
.tug-score .r{color:var(--ink)}.tug-score .sep{color:var(--muted);margin:0 6px}
.tug-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}
.tug-bar{display:flex;height:12px;border-radius:999px;overflow:hidden;margin:14px 0 8px;gap:2px;background:var(--surface)}
.tug-bar i{display:block;height:100%}
.tug-bar .res{background:var(--res);box-shadow:0 0 18px var(--res-glow);border-radius:999px 0 0 999px}
.tug-bar .enl{background:var(--enl);box-shadow:0 0 18px var(--enl-glow);border-radius:0 999px 999px 0}
.tug-foot{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-2)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:1px}
.dot.res{background:var(--res)}.dot.enl{background:var(--enl)}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:8px 0 24px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;position:relative;overflow:hidden}
.kpi .k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.kpi .v{font-family:var(--head);font-size:30px;line-height:1.15;margin-top:6px;font-variant-numeric:tabular-nums}
.kpi .s{font-size:13px;color:var(--ink-2);margin-top:2px}
.kpi.res::before,.kpi.enl::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0}
.kpi.res::before{background:var(--res)}.kpi.enl::before{background:var(--enl)}

/* cards */
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-bottom:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px 18px 10px;min-width:0}
.c12{grid-column:span 12}.c8{grid-column:span 8}.c7{grid-column:span 7}.c6{grid-column:span 6}.c5{grid-column:span 5}.c4{grid-column:span 4}
.card-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:6px}
.card h2{font-family:var(--head);font-size:17px;margin:0;font-weight:400;letter-spacing:.02em}
.card .sub{font-size:13px;color:var(--muted);margin-top:2px}
.chart{width:100%;height:340px}
.chart.tall{height:420px}
.chart.short{height:260px}
.legend{display:flex;gap:14px;font-size:13px;color:var(--ink-2);white-space:nowrap}

/* controls */
.seg{display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px}
.seg button{all:unset;cursor:pointer;font-size:12px;color:var(--ink-2);padding:4px 10px;border-radius:999px}
.seg button[aria-pressed="true"]{background:var(--card-2);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.seg button:focus-visible,.tabs a:focus-visible,.cell:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* win strip */
.strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(22px,1fr));gap:4px;padding:6px 0 12px}
.cell{aspect-ratio:1;border-radius:5px;position:relative;cursor:default;display:grid;place-items:center;font-size:10px;color:rgba(255,255,255,.85);font-variant-numeric:tabular-nums}
.cell.res{background:var(--res)}.cell.enl{background:var(--enl)}
.cell.res.soft{background:color-mix(in srgb,var(--res) 45%,var(--surface))}
.cell.enl.soft{background:color-mix(in srgb,var(--enl) 45%,var(--surface))}
.cell.tie{background:var(--line-2)}
.strip-legend{display:flex;gap:16px;font-size:12px;color:var(--muted);flex-wrap:wrap;padding-bottom:6px}
.sw{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:6px}

/* medals */
.medals{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:8px 0 10px}
.medal{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.medal img{width:38px;height:38px;object-fit:contain;flex:none}
.medal .n{font-family:var(--head);font-size:15px;font-variant-numeric:tabular-nums;line-height:1.1}
.medal .t{font-size:11px;color:var(--muted);text-transform:capitalize}
.events{display:flex;gap:14px;flex-wrap:wrap;padding:6px 0 10px}
.events img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6))}

/* table */
details.tbl{margin:4px 0 10px}
details.tbl summary{cursor:pointer;font-size:13px;color:var(--ink-2)}
.tbl-wrap{max-height:340px;overflow:auto;margin-top:10px;border:1px solid var(--line);border-radius:10px}
table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
th,td{padding:7px 12px;text-align:right;border-bottom:1px solid var(--line)}
th:first-child,td:first-child{text-align:left}
th{position:sticky;top:0;background:var(--card-2);font-weight:500;color:var(--ink-2)}
td.w-res{color:#5cc8f0}td.w-enl{color:#5fd393}

/* archive */
.links{list-style:none;margin:0;padding:0}
.links li{display:flex;gap:14px;padding:10px 0;border-bottom:1px solid var(--line)}
.links li:last-child{border:0}
.links time{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;min-width:90px}
.links a{text-decoration:none}.links a:hover{text-decoration:underline}

.note{font-size:12px;color:var(--muted);margin:0 0 24px}
.foot{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;padding-top:18px;padding-bottom:32px;border-top:1px solid var(--line);margin-top:24px}
.empty{padding:60px 0;text-align:center;color:var(--muted)}

@media (max-width:960px){
  .hero{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .c8,.c7,.c6,.c5,.c4{grid-column:span 12}
}
@media (max-width:520px){
  .wrap{padding:0 14px}.top{padding:12px 14px}
  .kpi .v{font-size:24px}
  .chart{height:300px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}