:root{
  --em:#059669;--em2:#047857;--em-bg:#ecfdf5;--em-bd:#a7f3d0;
  --bl:#2563eb;--bl2:#1d4ed8;--bl-bg:#eff6ff;--bl-bd:#bfdbfe;
  --am:#d97706;--am-bg:#fffbeb;--cr:#dc2626;
  --ink:#0f172a;--mut:#475569;--line:#e2e8f0;--bg:#f8fafc;--card:#fff;
  --slate:#64748b;--hatch:#cbd5e1;
  --r:16px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body.qc{margin:0;background:var(--bg);color:var(--ink);font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}
a{color:var(--bl2)}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:3000}
.skip:focus{left:8px;top:54px}
.wrap{max-width:1180px;margin:0 auto;padding:0 14px;min-width:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* mast — local, not sticky */
.mast{background:#fff;border-bottom:1px solid var(--line)}
.mast-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;min-height:48px;padding-top:8px;padding-bottom:8px}
.mast-nav{display:flex;flex-wrap:wrap;gap:10px 14px;min-width:0}
.mast-home{color:var(--ink);text-decoration:none;font-weight:800;font-size:.88rem;white-space:nowrap}
.mast-home:hover{color:var(--em)}
.live-pill{margin:0;display:inline-flex;align-items:center;gap:7px;background:#f1f5f9;border:1px solid var(--line);border-radius:999px;padding:4px 11px;font-size:.78rem;font-weight:700;color:var(--mut);white-space:nowrap}
.live-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 #22c55e88;animation:pulse 2s infinite;flex:none}
@keyframes pulse{70%{box-shadow:0 0 0 7px #22c55e00}100%{box-shadow:0 0 0 0 #22c55e00}}
@media(prefers-reduced-motion:reduce){.live-dot{animation:none}}

/* hero */
.hero{padding:18px 14px 8px}
.kick-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.badge{display:inline-block;border-radius:999px;padding:2px 9px;font:800 .68rem/1.2 system-ui;letter-spacing:.08em}
.badge.unof{background:#475569;color:#fff}
.kick{font:800 .72rem/1.2 system-ui;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}
h1{font:900 clamp(1.55rem,5.2vw,2.85rem)/1.05 system-ui,sans-serif;letter-spacing:-.035em;margin:0 0 10px;max-width:18ch}
.sub-badges{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.sub-badges li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font:800 .78rem/1.2 system-ui;color:var(--ink)}
.sub-badges li.em{background:var(--em-bg);border-color:var(--em-bd);color:var(--em2)}
.sub-badges li.bl{background:var(--bl-bg);border-color:var(--bl-bd);color:var(--bl2)}
.keyline{display:flex;flex-wrap:wrap;gap:10px 14px;font:700 .75rem/1.2 system-ui;color:var(--mut);margin:0 0 16px}
.keyline .sw{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:5px}
.sw.em{background:var(--em)}.sw.bl{background:var(--bl)}.sw.am{background:var(--am)}
.sw.ht{background:repeating-linear-gradient(-45deg,#e2e8f0,#e2e8f0 2px,#94a3b8 2px,#94a3b8 4px)}

.board{display:grid;grid-template-columns:1fr;gap:10px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 14px 12px;min-width:0}
.tile.for{background:var(--em-bg);border-color:var(--em-bd)}
.tile.by{background:var(--bl-bg);border-color:var(--bl-bd)}
.tile.hoch{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;background:#fff}
.tile-k{margin:0;font:800 .68rem/1.2 system-ui;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.tile.for .tile-k{color:var(--em2)}.tile.by .tile-k{color:var(--bl2)}
.tile-n{margin:2px 0 0;font:900 clamp(3rem,10vw,4.4rem)/.9 system-ui;letter-spacing:-.06em}
.tile.for .tile-n{color:var(--em)}.tile.by .tile-n{color:var(--bl)}
.tile-n.sm{font-size:clamp(1.6rem,5vw,2.1rem);letter-spacing:-.03em;color:var(--ink)}
.tile-l{margin:4px 0 8px;font:800 .82rem/1.25 system-ui;color:var(--ink)}
.chip-blak{margin:4px 0 0;font:700 .75rem/1.2 system-ui;color:var(--slate)}
.av{border-radius:50%;object-fit:cover;background:#e2e8f0;flex:none;display:block}
.av-lg{width:72px;height:72px;border:3px solid #fff;box-shadow:0 0 0 2px var(--bl)}
.err{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;padding:10px 12px;border-radius:10px;font-size:.88rem}

.faces{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.face{display:flex;flex-direction:column;align-items:center;gap:3px;width:64px;min-width:0;background:#fff;border:1px solid #00000012;border-radius:12px;padding:6px 4px 7px;text-decoration:none;color:inherit;cursor:pointer;font:inherit}
.face img,.face .mono{width:40px;height:40px;border-radius:50%}
.face b{font-size:.68rem;letter-spacing:-.01em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.face i{font-style:normal;font:800 .72rem/1 system-ui;font-variant-numeric:tabular-nums}
.face em{font-style:normal;font:700 .62rem/1 system-ui;color:var(--slate);letter-spacing:.04em}
.face.for i{color:var(--em)}.face.by i{color:var(--bl)}
.face.star{border-color:var(--am);box-shadow:0 0 0 2px #fbbf2444}
.star-banner{flex:1 0 100%;margin:4px 0 0;background:var(--am);color:#fff;border-radius:999px;padding:5px 10px;font:800 .72rem/1.2 system-ui;text-align:center;letter-spacing:.02em}
.face.on,.db.on,.fly-row.on{outline:2px solid var(--ink);outline-offset:1px}

/* sections */
.sec{padding:22px 14px 8px}
.sec-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin-bottom:10px}
h2{font:900 clamp(1.15rem,3vw,1.55rem)/1.15 system-ui;margin:0;letter-spacing:-.02em}
.sec-tag{font:800 .72rem/1.2 system-ui;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.ctrls{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.seg{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.seg button{border:0;background:none;padding:8px 11px;font:700 .8rem/1.2 system-ui;color:var(--ink);cursor:pointer;min-height:40px}
.seg button+button{border-left:1px solid var(--line)}
.seg button[aria-pressed="true"]{background:var(--ink);color:#fff}
.seg button:focus-visible{outline:2px solid var(--em);outline-offset:-2px}

/* butterfly */
.axis{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;font:800 .72rem/1 system-ui;margin:0 0 6px}
.axis .bl{color:var(--bl);text-align:right}.axis .em{color:var(--em)}.axis .mid{color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 8px}
.fly{display:flex;flex-direction:column;gap:6px}
.fly-row{display:grid;grid-template-columns:minmax(0,1fr) 62px;grid-template-areas:"id val" "trk trk" "pct pct";gap:6px 8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:7px 8px;cursor:pointer;min-width:0;overflow:hidden}
.fly-id{grid-area:id;display:flex;align-items:center;gap:8px;min-width:0}
.fly-id img,.fly-id .mono{width:36px;height:36px;border-radius:50%;flex:none}
.fly-id .who{min-width:0}
.fly-id b{display:block;font-size:.82rem;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fly-id small{display:block;color:var(--slate);font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dtag{display:inline-block;font:800 .62rem/1 system-ui;letter-spacing:.06em;background:#f1f5f9;border-radius:4px;padding:2px 5px;margin-right:4px;vertical-align:1px}
.fly-trk{grid-area:trk;display:grid;grid-template-columns:1fr 2px 1fr;align-items:center;min-width:0;height:28px;overflow:hidden}
.fly-half{height:18px;display:flex;align-items:center;min-width:0}
.fly-half.L{justify-content:flex-end}
.fly-half.R{justify-content:flex-start}
.fly-trk .spine{width:2px;height:28px;background:var(--ink);border-radius:1px}
.bar{height:16px;border-radius:4px;min-width:0;display:block}
.bar.em{background:var(--em)}.bar.bl{background:var(--bl)}.bar.am{background:var(--am)}
.fly-lab{grid-area:val;font:800 .78rem/1.1 system-ui;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.fly-lab.R{color:var(--em2)}
.fly-lab.L{color:var(--bl2)}
.fly-pct{grid-area:pct;font:700 .7rem/1.2 system-ui;color:var(--mut);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fly-row.callout{border-color:var(--am);background:#fffbeb}
.fly-row.callout .dtag{background:var(--am);color:#fff}
.sep-track{margin-top:10px;background:#fffbeb;border:1px dashed var(--am);border-radius:12px;padding:8px}
.sep-k{font:800 .68rem/1.2 system-ui;letter-spacing:.1em;text-transform:uppercase;color:var(--am);margin:0 0 6px}

/* maps */
.map-leg{display:flex;flex-wrap:wrap;gap:8px 12px;font:700 .75rem/1.2 system-ui;color:var(--mut);margin:0 0 10px}
.map-leg i{display:inline-block;width:14px;height:10px;border-radius:2px;vertical-align:-1px;margin-right:4px}
.map-grid{display:grid;grid-template-columns:1fr;gap:10px}
.map-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:10px;min-width:0}
.map-card figcaption{font:800 .82rem/1.2 system-ui;margin:0 0 6px}
.mapbox{position:relative;background:#eef2f7;border-radius:10px;overflow:hidden;aspect-ratio:4/5}
.mapbox svg{display:block;width:100%;height:100%;cursor:pointer}
.mapbox path{stroke:#fff;stroke-width:.7;vector-effect:non-scaling-stroke}
.mapbox path:hover,.mapbox path.on{stroke:#0f172a;stroke-width:2}
.mapbox .lbl{font:800 11px system-ui,sans-serif;fill:#0f172a;paint-order:stroke;stroke:#fff;stroke-width:3px;pointer-events:none;text-anchor:middle}
.tip{position:absolute;pointer-events:none;background:#0f172af2;color:#fff;border-radius:10px;padding:7px 9px;font-size:.78rem;max-width:220px;z-index:4;line-height:1.3}
.tip b{color:#a7f3d0}

/* cards */
h3.grp{font:800 .78rem/1.2 system-ui;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:16px 0 8px}
h3.grp.un{color:#64748b}
.cards{display:grid;grid-template-columns:1fr;gap:8px}
.cards.strip{background:#f1f5f9;border:1px dashed #94a3b8;border-radius:14px;padding:8px}
.db{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:8px 10px;align-items:center;background:#fff;border:1px solid var(--line);border-left:5px solid var(--slate);border-radius:12px;padding:10px;cursor:pointer;text-align:left;font:inherit;color:inherit;min-width:0;width:100%}
.db.for{border-left-color:var(--em)}.db.by{border-left-color:var(--bl)}.db.con{border-left-color:var(--am)}.db.gop{border-left-color:var(--cr)}
.db img,.db .mono{width:44px;height:44px;border-radius:50%;grid-row:1/span 3;align-self:start}
.db .nm{min-width:0}
.db .nm b{display:block;font-size:.95rem;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db .nm small{display:block;color:var(--mut);font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pills-r{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.pill{display:inline-block;border-radius:999px;padding:2px 7px;font:800 .62rem/1.2 system-ui;letter-spacing:.04em;background:#f1f5f9;color:var(--ink)}
.pill.win{background:#ecfdf5;color:var(--em2)}.pill.unop{background:#e2e8f0;color:#334155}
.pill.con{background:#fffbeb;color:var(--am)}.pill.gop{background:#fef2f2;color:var(--cr)}
.pill.nmj{background:#f5f3ff;color:#6d28d9}
.delta{font:900 1.15rem/1 system-ui;font-variant-numeric:tabular-nums;white-space:nowrap}
.delta.for{color:var(--em)}.delta.by{color:var(--bl)}.delta.con{color:var(--am)}.delta.raw{color:var(--ink)}
.delta small{display:block;font:700 .65rem/1.2 system-ui;color:var(--slate);font-weight:700}
.tracks{grid-column:1/-1;display:flex;flex-direction:column;gap:4px}
.tr{display:grid;grid-template-columns:64px minmax(0,1fr) 52px;gap:6px;align-items:center;font-size:.7rem}
.tr .lab{color:var(--mut);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr .n{text-align:right;font-variant-numeric:tabular-nums;font-weight:800}
.track{position:relative;height:10px;background:#eef2f7;border-radius:99px;overflow:hidden}
.track i{display:block;height:100%;border-radius:99px}
.track i.h{background:#64748b}.track i.c{background:#64748b}
.db.for .track i.c{background:var(--em)}.db.by .track i.c{background:var(--bl)}.db.con .track i.c{background:var(--am)}
.track .gh{position:absolute;top:-2px;bottom:-2px;width:2px;background:#94a3b8;border-radius:1px}

.mono{display:inline-flex;align-items:center;justify-content:center;background:var(--em);color:#fff;font:800 .72rem/1 system-ui;border-radius:50%}
.tile.by .mono,.face.by .mono{background:var(--bl)}
.db.by .mono{background:var(--bl)}

.foot-nav{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:18px}
.mini-cta{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font:800 .8rem/1.2 system-ui;text-decoration:none;color:var(--ink)}
.mini-cta:hover{border-color:var(--em);color:var(--em2)}

.foot{background:#fff;border-top:1px solid var(--line);padding:10px 0 28px}
.method{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.method summary{cursor:pointer;font:800 .88rem/1.3 system-ui;color:var(--ink)}
.method p{font-size:.84rem;color:#334155;margin:8px 0;max-width:72ch}
.method p:last-child{margin-bottom:4px}

@media(min-width:720px){
  .board{grid-template-columns:1fr minmax(180px,240px) 1fr;align-items:stretch}
  .tile.hoch{order:0}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .map-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mapbox{aspect-ratio:3/4}
  .fly-row{grid-template-columns:minmax(0,210px) minmax(0,1fr) 72px;grid-template-areas:"id trk val" "id pct pct"}
  .face{width:70px}
}
@media(min-width:1100px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  h1{font-size:3rem}
}
@media(max-width:719px){
  .axis{padding-left:0;margin-top:4px}
  .fly-pct{padding-left:0}
  .tile-n{font-size:3.2rem}
  .db{grid-template-columns:40px minmax(0,1fr) auto}
  .db img,.db .mono{width:40px;height:40px}
}
@media(max-width:400px){
  .face{width:56px}
  .seg button{padding:8px 8px;font-size:.74rem}
}
