/* Map Five | clean analytical theme */
:root{
  --bg:#ffffff; --panel:#fafafa; --panel-2:#f3f4f6;
  --ink:#16181d; --muted:#5b616e; --faint:#6b7280;
  --line:#e5e7eb; --line-2:#d1d5db;
  --accent:#2563eb; --accent-soft:#eff4ff; --accent-line:#dbe5ff; --accent-ink:#1e40af;
  /* dark tooltip chrome (trajectory #tt) */
  --tip-bg:#111827; --tip-ink:#f8fafc; --tip-mut:#cbd5e1;
  --pos:#059669; --pos-soft:#e7f6f0;
  --neg:#dc2626; --neg-soft:#fdecec;
  --warn:#b45309; --warn-soft:#fdf3e3; --warn-line:#fed7aa; --warn-panel:#fff7ed;
  --amber:#d97706;
  /* championship gold: solid mark (--gold) + soft pill trio */
  --gold:#b8860b; --gold-soft:#fbf2d9; --gold-ink:#7a5f13; --gold-line:#efe0ad;
  --role-ar-soft:#eef7f2; --role-ar-ink:#047857; --role-ar-line:#c8ead9;
  --role-smg-soft:#eef4ff; --role-smg-ink:#1e40af; --role-smg-line:#cbdcff;
  --role-flex-soft:#fff7ed; --role-flex-ink:#9a3412; --role-flex-line:#fed7aa;
  --role-mixed-soft:#f5f3ff; --role-mixed-ink:#5b21b6; --role-mixed-line:#ddd6fe;
  /* "ink" variants: AA-safe text on light backgrounds, where the vivid tokens
     above are for fills/marks only (see styleguide → Contrast). */
  --pos-ink:#047857; --neg-ink:#b91c1c; --amber-ink:#a2570f;
  /* radius scale */
  --radius-sm:6px; --radius-md:8px; --radius-lg:10px; --radius-pill:999px;
  --radius:var(--radius-lg);            /* legacy alias */
  /* elevation + motion */
  --shadow:0 8px 24px rgba(15,23,42,.12);
  --transition:150ms ease;
  /* spacing scale — 4px grid (suffix = px). Applied app-wide via var(--space-*). */
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-16:4rem; --space-20:5rem;
  /* type scale — tuned to actual usage clusters (see analysis/audit_scale.py) */
  --text-xs:.72rem; --text-sm:.82rem; --text-base:.9rem; --text-md:1rem;
  --text-lg:1.15rem; --text-xl:1.25rem; --text-2xl:1.5rem; --text-3xl:1.7rem;
  --text-hero:2.7rem;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--navh,52px) + var(--space-4))}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.2;margin:0 0 .4em}
h1{font-size:var(--text-3xl);letter-spacing:-.02em}
h2{font-size:var(--text-xl);letter-spacing:-.01em;margin-top:1.8em}
h3{font-size:var(--text-md)}
h2[id],h3[id],section[id]{scroll-margin-top:calc(var(--navh,52px) + var(--space-4))}
p{margin:.6em 0}
.num{font-variant-numeric:tabular-nums;font-family:var(--mono)}
.muted{color:var(--muted)}
.faint{color:var(--faint)}
.small{font-size:var(--text-sm)}
.sub{display:block;color:var(--faint);font-size:var(--text-xs);font-weight:400}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* header / nav */
.site-head{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:20}
.site-head .inner{max-width:1080px;margin:0 auto;padding:var(--space-3) var(--space-5);display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap}
.brand{font-weight:700;letter-spacing:-.02em;color:var(--ink);font-size:var(--text-md);white-space:nowrap}
.brand .dot{color:var(--accent)}
.nav{display:flex;gap:var(--space-1);flex-wrap:wrap}
.nav a{color:var(--muted);padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-base);font-weight:500}
.nav a:hover{background:var(--panel-2);text-decoration:none;color:var(--ink)}
.nav a.active{background:var(--accent-soft);color:var(--accent)}
/* Insights dropdown in the nav */
.navdrop{position:relative}
.navdrop-btn{font:inherit;font-size:var(--text-base);font-weight:500;color:var(--muted);cursor:pointer;
  background:none;border:0;padding:var(--space-1) var(--space-3);border-radius:var(--radius-md)}
.navdrop-btn:hover{background:var(--panel-2);color:var(--ink)}
.navdrop.active>.navdrop-btn{background:var(--accent-soft);color:var(--accent)}
.navdrop-menu{position:absolute;top:calc(100% + 4px);left:0;min-width:190px;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow);
  padding:var(--space-1);display:none;flex-direction:column;gap:var(--space-1);z-index:30}
.navdrop.open>.navdrop-menu{display:flex}
.navdrop-menu a{color:var(--muted);padding:var(--space-2) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-base);font-weight:500;white-space:nowrap}
.navdrop-menu a:hover{background:var(--panel-2);text-decoration:none;color:var(--ink)}
.navdrop-menu a.active{background:var(--accent-soft);color:var(--accent)}

.wrap{max-width:1080px;margin:0 auto;padding:var(--space-6) var(--space-5) var(--space-16)}
.wrap.narrow{max-width:840px}
.wrap.wide{max-width:1280px}

.lede{color:var(--muted);font-size:var(--text-md);max-width:70ch}
.crumb{font-size:var(--text-sm);color:var(--faint);margin-bottom:var(--space-2)}
.crumb a{color:var(--muted)}
.page-toc{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin:var(--space-3) 0 var(--space-5);
  padding:var(--space-3) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.page-toc-title{font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);
  margin-right:var(--space-1)}
.page-toc a{font-size:var(--text-sm);font-weight:600;color:var(--muted);background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius-pill);padding:var(--space-1) var(--space-3)}
.page-toc a:hover{background:var(--panel-2);color:var(--ink);text-decoration:none}
.anchor-link{display:inline-flex;align-items:center;justify-content:center;width:1.35em;height:1.35em;margin-left:var(--space-2);
  border-radius:var(--radius-sm);color:var(--faint);font-size:.78em;font-weight:700;text-decoration:none;opacity:0;
  vertical-align:.05em;transition:opacity var(--transition),background-color var(--transition),color var(--transition)}
h2:hover .anchor-link,h3:hover .anchor-link,.anchor-link:focus-visible{opacity:1}
.anchor-link:hover{background:var(--panel-2);color:var(--accent);text-decoration:none}

/* panels & layout */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-4) var(--space-5)}
.panel-shell{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--line)}
.panel-head h2,.panel-head h3{margin:0}
.panel-head .small{margin:var(--space-1) 0 0;max-width:68ch}
.panel-body{padding:var(--space-4)}
.panel-stack{display:grid;gap:var(--space-4)}
.grid{display:grid;gap:var(--space-4)}
/* let grid columns shrink below their content so .scroll-x children actually scroll */
.grid>*{min-width:0}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.cols-2,.cols-3{grid-template-columns:1fr}}

/* shared explainer surfaces */
.callout{border:1px solid var(--accent-line);background:var(--accent-soft);color:var(--accent-ink);
  border-radius:var(--radius-md);padding:var(--space-3);margin:var(--space-4) 0}
.callout.warn{border-color:var(--warn-line);background:var(--warn-panel);color:var(--amber-ink)}
.callout.warn strong{color:var(--warn)}
.context-band{background:var(--warn-panel);border-left:1px solid var(--warn-line)}
.surface-list{display:grid;gap:var(--space-2)}
.surface-row{border-top:1px solid var(--line);padding:var(--space-3) 0}
.surface-row:first-child{border-top:0;padding-top:0}
.surface-row:last-child{padding-bottom:0}
.formula{font-family:var(--mono);font-size:var(--text-sm);background:#fff;border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:var(--space-2);display:inline-block}
.calc-list{display:grid;gap:var(--space-2);margin-top:var(--space-3)}
.calc-row{border-top:1px solid var(--line);padding:var(--space-3) 0}
.calc-row:first-child{border-top:0;padding-top:0}
.calc-row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}
.calc-title{font-weight:700}
.calc-math{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-2)}
.math-chip{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fbfcfe;padding:var(--space-1) var(--space-2)}
.math-chip .k{display:block;font-size:var(--text-xs);font-weight:700;color:var(--faint);letter-spacing:.04em;text-transform:uppercase}
.math-chip .v{font-family:var(--mono);font-weight:800}
.math-op{font-family:var(--mono);font-weight:800;color:var(--faint)}
.math-card{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:var(--space-3);margin-bottom:var(--space-3)}
.math-card .k{font-size:var(--text-xs);font-weight:700;color:var(--faint);letter-spacing:.04em;text-transform:uppercase}
.math-card .v{font-family:var(--mono);font-size:var(--text-xl);font-weight:800}
.math-card.sum{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent-ink)}
.mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2);margin:var(--space-3) 0}
.mini{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fbfcfe;padding:var(--space-2)}
.mini .k{font-size:var(--text-xs);font-weight:700;color:var(--faint);letter-spacing:.04em;text-transform:uppercase}
.mini .v{font-family:var(--mono);font-size:var(--text-lg);font-weight:800}
.mini .v.sm{font-family:var(--sans);font-size:var(--text-base);text-transform:capitalize}
.contribution{font-family:var(--mono);font-weight:800;font-size:var(--text-lg);white-space:nowrap}
.evidence-link{display:inline-flex;align-items:center;min-height:32px}
@media(max-width:760px){.evidence-link{min-height:44px}}

/* stat tiles */
.stat-row{display:flex;gap:var(--space-4);flex-wrap:wrap;margin:var(--space-4) 0}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--space-3) var(--space-4);min-width:120px}
.stat .k{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--faint);font-weight:600}
.stat .v{font-size:var(--text-2xl);font-weight:700;font-family:var(--mono);font-variant-numeric:tabular-nums;margin-top:var(--space-1)}
.stat .v.sm{font-size:var(--text-lg)}
.stat.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.profile-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.adjusted-explainer{margin-top:var(--space-8)}
.adjusted-explainer h2{margin-top:0}
.adjusted-explainer h3{margin-top:var(--space-2)}
.section-head,.skill-table-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.section-head h2,.skill-table-head h3{margin:0}
.section-head .small,.skill-table-head .small{margin:var(--space-1) 0 0;max-width:68ch}
.skill-stats-block{margin-top:var(--space-8)}
.skill-stats-block h2{margin-top:0}
.skill-record-row .stat{min-width:145px}
.skill-split-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-3);margin:var(--space-3) 0 var(--space-5)}
.skill-split-card{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:var(--space-3) var(--space-4)}
.skill-split-card.warn{border-color:var(--warn-line);background:var(--warn-panel)}
.skill-split-card.muted{background:var(--panel);color:var(--muted)}
.skill-split-top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3)}
.skill-split-top span{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--faint)}
.skill-split-top strong{font-family:var(--mono);font-size:var(--text-xl);font-variant-numeric:tabular-nums}
.skill-table-head{margin-top:var(--space-5);margin-bottom:var(--space-3)}
.skill-season{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;margin:var(--space-2) 0;overflow:hidden}
.skill-season summary{display:grid;grid-template-columns:minmax(8rem,.7fr) minmax(9rem,.55fr) minmax(0,1.1fr);gap:var(--space-3);
  align-items:center;padding:var(--space-3) var(--space-4);cursor:pointer}
.skill-season[open] summary{border-bottom:1px solid var(--line);background:var(--panel)}
.skill-season-title{font-weight:700}
.skill-season-meta{font-family:var(--mono);font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:var(--muted)}
.skill-season-detail{padding:var(--space-3) var(--space-4) var(--space-4)}
.skill-summary-pills{display:flex;justify-content:flex-start;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-3)}
.skill-split-pill{display:inline-flex;align-items:center;gap:var(--space-1);border:1px solid var(--line);border-radius:var(--radius-pill);
  background:#fff;padding:2px var(--space-2);font-size:var(--text-xs);font-variant-numeric:tabular-nums}
.skill-split-pill span{color:var(--faint)}
.skill-split-pill.warn{border-color:var(--warn-line);background:var(--warn-panel);color:var(--warn)}
.skill-split-pill.muted{background:var(--panel);color:var(--muted)}
.skill-scroll-hint{display:none;margin:0 0 var(--space-2)}
.skill-event-table{min-width:760px}
.stat-warn{color:var(--warn)}
@media(max-width:760px){
  .skill-split-grid{grid-template-columns:1fr}
  .skill-season summary{grid-template-columns:1fr}
  .skill-scroll-hint{display:block}
}

/* generic table */
table.data{border-collapse:collapse;width:100%;font-size:var(--text-base)}
table.data th,table.data td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);text-align:left}
table.data th{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.03em;color:var(--faint);font-weight:600}
table.data tbody th{font-size:var(--text-base);text-transform:none;letter-spacing:0;color:var(--muted);font-weight:700}
table.data td.n,table.data th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
table.data tr.selected td{background:var(--accent-soft)}
table.data tr:hover td{background:var(--accent-soft)}
table.data tr.subhead td{background:var(--panel-2);font-weight:600;color:var(--muted);
  text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.04em}
.team-cell{min-width:150px}
.team-badge{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0}
.team-logo{width:24px;height:24px;object-fit:contain;flex:0 0 auto}
.team-badge.compact{font-size:var(--text-sm);max-width:100%}
.team-badge.compact .team-logo{width:20px;height:20px}
.team-history{margin:calc(-1 * var(--space-2)) 0 var(--space-3)}
.team-summary{display:inline-flex;align-items:center;gap:var(--space-2);font:inherit;font-size:var(--text-sm);font-weight:600;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--radius-pill);padding:var(--space-1) var(--space-2);
  cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.06)}
.team-summary:hover{background:var(--panel)}
.team-summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.team-stack{display:inline-flex;align-items:center;padding-left:2px}
.team-stack .team-logo,.team-dot{width:18px;height:18px;border-radius:var(--radius-pill);border:1px solid #fff;background:var(--panel);
  box-shadow:0 0 0 1px var(--line);object-fit:contain}
.team-stack .team-logo:not(:first-child),.team-stack .team-dot:not(:first-child){margin-left:-6px}
.team-dot{display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--muted)}
.team-strip{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-2)}
.team-strip .team-badge{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-pill);padding:var(--space-1) var(--space-2)}

/* deltas */
.delta{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
.delta.up{color:var(--pos-ink)} .delta.down{color:var(--neg-ink)} .delta.flat{color:var(--faint)}
.pill{display:inline-block;padding:var(--space-1) var(--space-2);border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:600}
.pill.up{background:var(--pos-soft);color:var(--pos-ink)}
.pill.down{background:var(--neg-soft);color:var(--neg-ink)}
.pill.flat{background:var(--panel-2);color:var(--muted)}
.pill.tag{background:var(--accent-soft);color:var(--accent)}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.champ{background:var(--gold-soft);color:var(--gold-ink);border:1px solid var(--gold-line);font-variant-numeric:tabular-nums}
.pill.role{border:1px solid var(--line);font-family:var(--mono);font-variant-numeric:tabular-nums;text-transform:uppercase;letter-spacing:.02em}
.pill.role-ar{background:var(--role-ar-soft);color:var(--role-ar-ink);border-color:var(--role-ar-line)}
.pill.role-smg{background:var(--role-smg-soft);color:var(--role-smg-ink);border-color:var(--role-smg-line)}
.pill.role-flex{background:var(--role-flex-soft);color:var(--role-flex-ink);border-color:var(--role-flex-line)}
.pill.role-mixed{background:var(--role-mixed-soft);color:var(--role-mixed-ink);border-color:var(--role-mixed-line)}
.pill.role-unknown{background:var(--panel-2);color:var(--muted)}
.role-dispute{color:var(--muted);white-space:nowrap}
.role-dispute:hover{color:var(--accent)}
.role-table .pill.role{min-width:4.7em;text-align:center}
.role-cell{display:inline-flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.season-role{display:flex!important;align-items:center;gap:var(--space-2);flex-wrap:wrap}

/* bars */
.bar-track{background:var(--panel-2);border-radius:var(--radius-sm);height:9px;overflow:hidden;min-width:60px}
.bar-fill{height:100%;background:var(--accent);border-radius:var(--radius-sm)}
.bar-fill.pos{background:var(--pos)}
.bar-fill.amber{background:var(--amber)}
.barline{display:flex;align-items:center;gap:var(--space-2)}
.barline .lab{min-width:130px;font-size:var(--text-sm)}
.barline .val{font-family:var(--mono);font-size:var(--text-sm);color:var(--muted);min-width:46px;text-align:right}

/* controls */
.controls{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin:var(--space-4) 0}
.search{flex:1;min-width:220px;max-width:340px;padding:var(--space-2) var(--space-3);border:1px solid var(--line-2);
  border-radius:var(--radius-md);font-size:var(--text-base);font-family:inherit}
.search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.toggle{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-base);cursor:pointer;user-select:none;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}
.toggle input{accent-color:var(--accent);width:16px;height:16px;cursor:pointer}
.colmenu{position:relative}
.colmenu-btn{font:inherit;font-size:var(--text-base);cursor:pointer;color:var(--ink);
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}
.colmenu-btn:hover{background:var(--panel-2)}
.colmenu-panel{position:absolute;top:calc(100% + 4px);left:0;z-index:30;min-width:172px;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-1);
  box-shadow:var(--shadow)}
.colmenu-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);
  font-size:var(--text-base);cursor:pointer;user-select:none;white-space:nowrap}
.colmenu-item:hover{background:var(--panel-2)}
.colmenu-item input{accent-color:var(--accent);width:15px;height:15px;cursor:pointer}
.eramenu-panel{min-width:min(96vw,640px);max-height:min(80vh,560px);overflow:auto}
/* era titles must stay readable — wrap instead of clipping "Modern Warfare III" to "Modern Warfare" */
.eramenu-panel .colmenu-item{white-space:normal}
.era-presets{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-1) var(--space-2);
  border-bottom:1px solid var(--line);margin-bottom:var(--space-2)}
.era-preset{font:inherit;font-size:var(--text-sm);cursor:pointer;color:var(--ink);background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2)}
.era-preset:hover{background:var(--accent-soft);border-color:var(--accent)}
.era-clear{margin-left:auto;color:var(--muted)}
.era-clear:hover{background:var(--panel-2);border-color:var(--line-2)}
/* three era columns side by side so every group is visible without scrolling */
.era-groups{display:grid;grid-template-columns:repeat(3,minmax(185px,1fr));gap:var(--space-1) var(--space-2)}
.era-group{min-width:0}
.era-group-h{font-size:var(--text-xs);font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--faint);padding:var(--space-1) var(--space-2)}
/* On phones the search takes its own row (≤760px), so the Eras control sits at the
   left of the next row — keep the panel left-anchored and cap it to the viewport. */
@media(max-width:620px){
  .eramenu-panel{min-width:min(94vw,300px)}
  .era-groups{grid-template-columns:1fr}
}
.ringw{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--ink);user-select:none;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}
.ringw-lbl{color:var(--muted)}
.ringw input[type=range]{accent-color:var(--accent);width:96px;cursor:pointer}
.ringw-val{font-family:var(--mono);font-variant-numeric:tabular-nums;min-width:1.8em;text-align:right}
.clearfilters{font:inherit;font-size:var(--text-sm);cursor:pointer;color:var(--muted);
  background:transparent;border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}
.clearfilters:hover{background:var(--panel-2);color:var(--ink);border-color:var(--line-2)}
.sharebtn{font:inherit;font-size:var(--text-sm);font-weight:600;cursor:pointer;color:#fff;
  background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3)}
.sharebtn:disabled{opacity:.5;cursor:not-allowed;filter:none}
.sharebtn:hover{filter:brightness(1.06)}
.note{background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);
  font-size:var(--text-sm);color:var(--accent-ink)}
.compare-tray{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;
  border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:var(--radius-md);padding:var(--space-3);margin:calc(-1 * var(--space-2)) 0 var(--space-3)}
.compare-tray[hidden]{display:none}
.compare-tray .chips{margin-top:var(--space-2)}
.compare-tray-actions{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}
.compare-check{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:28px;cursor:pointer}
.compare-check input{accent-color:var(--accent);width:16px;height:16px;cursor:pointer}

/* tabulator tuning (clean analytical) */
/* reserve space while the table builds so the legend/footer below don't jump (CLS) */
#table:empty{min-height:70vh}
.tabulator{background:#fff;border:1px solid var(--line);border-radius:var(--radius);font-size:var(--text-base);font-family:var(--sans);overflow:visible}
/* header sticks to the window (just below the sticky nav) as the page scrolls */
.tabulator .tabulator-header{background:#fff;border-bottom:2px solid var(--line);font-weight:600;
  position:sticky;top:var(--navh,52px);z-index:11}
.tabulator .tabulator-header .tabulator-col{background:#fff;border-right:none}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content{padding:var(--space-2) var(--space-3)}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.03em;color:var(--faint);
  white-space:normal;text-overflow:clip;overflow:visible}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title{padding-right:26px}
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter{right:6px;width:12px;justify-content:center}
.tabulator .tabulator-row{border-bottom:1px solid var(--line)}
.tabulator .tabulator-row.tabulator-row-even{background:var(--panel)}
.tabulator .tabulator-row:hover{background:var(--accent-soft)}
.tabulator .tabulator-row.compare-selected-row{background:var(--accent-soft)}
.tabulator .tabulator-cell{padding:var(--space-2) var(--space-3);border-right:none}
.tabulator-row .tabulator-cell.compare-select-cell{padding-inline:var(--space-2)}
.tabulator-row .tabulator-cell.tabnum{font-family:var(--mono);font-variant-numeric:tabular-nums}
.tabulator .tabulator-footer{background:#fff;border-top:1px solid var(--line)}

footer.site-foot{border-top:1px solid var(--line);color:var(--faint);font-size:var(--text-sm);
  max-width:1080px;margin:0 auto;padding:var(--space-6) var(--space-5)}
footer.site-foot a{color:var(--muted)}
/* skip-to-content link (injected first by mountNav); visible only on focus */
.skip{position:absolute;left:.5rem;top:-3rem;z-index:40;background:var(--accent);color:#fff;
  padding:var(--space-2) var(--space-3);border-radius:0 0 var(--radius-md) var(--radius-md);font-size:var(--text-sm);font-weight:600}
.skip:focus{top:0}
/* restrained hover transitions on interactive chrome */
.nav a,.navdrop-btn,.navdrop-menu a,.colmenu-btn,.colmenu-item,.era-preset,
.sharebtn,.clearfilters,.toggle,.seg button,.sim-row,.stat{
  transition:background-color var(--transition),color var(--transition),
    border-color var(--transition),box-shadow var(--transition)}
.link-button{border:0;background:transparent;color:var(--accent);font:inherit;font-weight:800;padding:0;cursor:pointer;text-decoration:underline}
.link-button:hover{color:var(--accent-ink)}
/* accessibility: visible focus + adequate tap targets */
a:focus-visible,button:focus-visible,.toggle:focus-within,input:focus-visible,
.tabulator .tabulator-col:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
/* the skip-link target is focusable for AT but shouldn't draw a page-sized ring */
#root:focus,#root:focus-visible{outline:none}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(max-width:760px){
  body{font-size:16px}
  .brand,.nav a,.navdrop-btn,.colmenu-btn,.sharebtn,.clearfilters,.ringw{
    min-height:44px;display:inline-flex;align-items:center}
  .colmenu-item{min-height:44px}
  .ringw input[type=range]{height:28px}
  /* compact nav items so the wrapped nav takes ~2 lines, not 3 (tap targets stay 44px tall) */
  .nav a{padding:var(--space-2) var(--space-2);font-size:var(--text-sm)}
  .navdrop-btn{font-size:var(--text-sm)}
  .site-head .inner{gap:var(--space-2) var(--space-3)}
  /* release the header on phones: sticky brand + wrapped nav pinned ~140px of the viewport */
  .site-head{position:static}
  .tabulator .tabulator-header{top:0}
  /* 16px floor stops iOS Safari's focus auto-zoom; full-width search shortens the controls stack */
  .search{font-size:16px;flex-basis:100%;max-width:none}
  /* comfortable tap targets on the small controls */
  .navdrop-btn{padding:var(--space-2) var(--space-2)}
  .era-preset{padding:var(--space-2) var(--space-3)}
  .controls{gap:var(--space-2)}
  html{scroll-padding-top:var(--space-4)}
  h2[id],h3[id],section[id]{scroll-margin-top:var(--space-4)}
  .page-toc a{min-height:44px;display:inline-flex;align-items:center}
  .anchor-link{opacity:1}
}
/* horizontal-scroll wrapper/handler for wide data surfaces.
   position:relative makes the wrapper the containing block for absolutely
   positioned descendants (.sr-only badges/captions inside cells) — without it
   they escape the overflow clip at their static x-position deep in the scrolled
   table and stretch the document sideways on phones */
.scroll-x{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch}
.scroll-region{overscroll-behavior-x:contain;scrollbar-gutter:stable}
.scroll-region[data-overflow-x="true"]{scroll-snap-type:none}
.scroll-region[data-overflow-x="true"][data-at-start="false"][data-at-end="false"]{
  box-shadow:inset 12px 0 12px -14px rgba(15,23,42,.55),inset -12px 0 12px -14px rgba(15,23,42,.55)}
.scroll-region[data-overflow-x="true"][data-at-start="false"][data-at-end="true"]{
  box-shadow:inset 12px 0 12px -14px rgba(15,23,42,.55)}
.scroll-region[data-overflow-x="true"][data-at-start="true"][data-at-end="false"]{
  box-shadow:inset -12px 0 12px -14px rgba(15,23,42,.55)}
.scroll-x:focus-visible{border-radius:var(--radius-sm)}
.scrollhint{display:none;margin:var(--space-1) 0 var(--space-2)}
.scroll-region[data-overflow-x="false"]>.scrollhint{display:none}
.heatmap-table-wrap{margin-top:var(--space-2)}
/* compact-header key: shown only on phones, where headerTooltips can't fire */
.colkey{display:none;margin:var(--space-1) 0 var(--space-2)}
@media(max-width:760px){.colkey{display:block}}
/* fixed-width share bars inside tables; shrink on phones so rows fit the screen */
.bar-share{width:120px}
.bar-cell{min-width:160px}
@media(max-width:560px){.bar-share{width:64px}.bar-cell{min-width:0}.bar-track{min-width:40px}}
/* shared HTML chart tooltip (heatmap/scatter), styled to match the map's */
.charttip{position:absolute;pointer-events:none;z-index:9;background:var(--bg);border:1px solid var(--line-2);
  border-radius:var(--radius-md);box-shadow:0 6px 20px rgba(15,23,42,.14);padding:var(--space-2);
  font-size:var(--text-sm);max-width:260px;opacity:0;transition:opacity .1s}
.charttip.on{opacity:1}
.charttip.fixed{position:fixed;z-index:50}
@media(min-width:761px){#table .tabulator{width:100%;max-width:100%}}
@media(max-width:760px){
  .scrollhint{display:block}
  table.data a,table.sim-table a,.tabulator-cell a,.refs a{display:inline-flex;align-items:center;min-height:44px;max-width:100%}
  .tabulator-cell a{margin-top:calc(-1 * var(--space-2));margin-bottom:calc(-1 * var(--space-2))}
  /* tighter cells on phones so the compact columns fit their labels */
  .tabulator .tabulator-cell{padding:var(--space-2) var(--space-2)}
  .tabulator .tabulator-header .tabulator-col .tabulator-col-content{padding:var(--space-2) var(--space-2)}
}

.legend{display:flex;gap:var(--space-4);flex-wrap:wrap;font-size:var(--text-sm);color:var(--muted);margin:var(--space-2) 0}
.legend .sw{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:var(--space-1);vertical-align:-1px}

/* ---- Player compare ---- */
.compare-page{--cmp-sticky:#fff;--cmp-band:#f8fafc;padding-top:var(--space-5)}
.compare-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:var(--space-6);
  align-items:end;border-bottom:1px solid var(--line);padding-bottom:var(--space-5);margin-bottom:var(--space-4)}
.compare-title h1{margin-bottom:var(--space-1)}
.compare-title .lede{margin:0;max-width:58ch}
.eyebrow,.section-label{margin:0 0 var(--space-1);font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.compare-controls{display:grid;gap:var(--space-1);align-self:stretch;align-content:end}
.compare-controls label{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}
.compare-add-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:var(--space-2)}
.compare-add-row .search{min-width:0;max-width:none;width:100%;height:44px}
.compare-add-row .sharebtn,.compare-add-row .clearfilters{min-height:44px}
.compare-error{color:var(--neg-ink)}
.compare-roster{display:grid;grid-template-columns:minmax(0,.38fr) minmax(0,.62fr);gap:var(--space-5);align-items:start;margin:var(--space-5) 0 var(--space-4)}
/* verdict strip: the crop-safe, screenshot-first answer block */
.compare-verdict{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:var(--space-4);margin-bottom:var(--space-4)}
.verdict-head{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.verdict-head h2{margin:0;font-size:var(--text-lg)}
.verdict-cards{display:grid;grid-template-columns:repeat(var(--players,2),minmax(0,1fr));gap:var(--space-3);margin:var(--space-3) 0}
.verdict-card{border:1px solid var(--line);border-top:3px solid var(--cmp-color,var(--accent));border-radius:var(--radius-md);
  padding:var(--space-3);display:grid;gap:2px;min-width:0}
.verdict-card.lead{background:color-mix(in srgb,var(--cmp-color,var(--accent)) 7%,#fff)}
.verdict-card a{font-weight:700;color:var(--ink)}
.verdict-card .num{font-family:var(--mono);font-size:var(--text-2xl);font-weight:800;font-variant-numeric:tabular-nums}
.verdict-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.verdict-foot p{margin:0;max-width:52ch}
.verdict-actions{display:flex;align-items:center;gap:var(--space-3);margin-left:auto}
@media(max-width:560px){.verdict-cards{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}}
/* per-metric "how is this computed" link on summary row headers */
.metric-info{display:inline-flex;align-items:center;justify-content:center;width:1.5em;height:1.5em;margin-left:var(--space-1);
  border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--faint);font-size:var(--text-xs);font-weight:700;vertical-align:.1em}
.metric-info:hover,.metric-info:focus-visible{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft);text-decoration:none}
.chips,.compare-suggestions{display:flex;flex-wrap:wrap;gap:var(--space-2);min-height:2rem}
.chip{display:inline-flex;align-items:center;gap:var(--space-1);min-height:44px;font-size:var(--text-sm);padding:0 var(--space-1) 0 var(--space-3);
  border-radius:var(--radius-md);border:1px solid var(--line-2);background:#fff;color:var(--ink)}
.chip button{border:0;background:transparent;color:var(--muted);border-radius:var(--radius-sm);width:44px;height:44px;line-height:1;cursor:pointer;padding:0}
.chip button:hover{background:var(--panel-2);color:var(--ink)}
.compare-chip a{font-weight:700;color:var(--ink)}
.suggestion-group{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2)}
.suggestion-group>span{font-size:var(--text-xs);font-weight:700;color:var(--faint);min-width:6.75rem}
.suggestion-btn{font:inherit;font-size:var(--text-sm);min-height:44px;cursor:pointer;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:var(--radius-md);padding:0 var(--space-3);transition:background var(--transition),border-color var(--transition)}
.suggestion-btn span{font-family:var(--mono);font-size:var(--text-xs);color:var(--faint);margin-left:var(--space-1)}
.suggestion-btn:hover{background:var(--accent-soft);border-color:var(--accent-line);text-decoration:none}
.suggestion-btn:focus-visible,.chip button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.compare-block{margin-top:var(--space-5)}
.compare-section-head{display:flex;align-items:end;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-2)}
.compare-section-head h2{margin:0;font-size:var(--text-lg)}
.compare-section-head .small{margin:0;max-width:52ch}
.compare-summary-tools{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;justify-content:flex-end}
.rowmenu .colmenu-panel{right:0;left:auto}
.compare-summary-wrap,.compare-table-wrap{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff}
.compare-summary,.compare-table{margin:0}
.compare-summary{min-width:calc(8rem + (var(--players,2) * 9.4rem))}
.compare-table{min-width:calc(8.5rem + (var(--players,2) * 10.25rem))}
.compare-summary th,.compare-summary td,.compare-table th,.compare-table td{padding:var(--space-2) var(--space-3)}
.compare-summary th:first-child,.compare-table th:first-child,.compare-table td:first-child{
  position:sticky;left:0;z-index:2;background:var(--cmp-sticky);box-shadow:1px 0 0 var(--line)}
.compare-summary thead th,.compare-table thead th{background:var(--cmp-band);position:sticky;top:0;z-index:3}
.compare-summary thead th:first-child,.compare-table thead th:first-child{z-index:4;background:var(--cmp-band)}
.compare-summary th:first-child{min-width:8rem}
.compare-summary th:not(:first-child),.compare-summary td:not(:first-child){min-width:9.4rem}
.compare-summary tbody th,.compare-table tbody th:first-child{font-weight:700;color:var(--muted)}
.compare-summary td strong,.compare-summary td span{display:block;text-align:right}
.compare-summary td strong{font-family:var(--mono);font-size:var(--text-lg);font-variant-numeric:tabular-nums;color:var(--ink)}
.compare-summary td .pill{display:inline-block;text-align:center}
.compare-summary-cell{display:grid;gap:var(--space-1)}
.summary-main{min-height:2.4rem}
.best-badge{display:inline-flex!important;align-items:center;justify-content:center;width:max-content;min-height:1.25rem;
  padding:0 var(--space-1);border:1px solid color-mix(in srgb,var(--cmp-color,var(--accent)) 45%,var(--line));
  border-radius:var(--radius-sm);background:#fff;color:var(--accent-ink);font-size:var(--text-xs);font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;line-height:1;text-align:center!important}
.summary-main .best-badge{margin-left:auto;margin-bottom:2px}
.summary-meter{height:6px;background:var(--panel-2);border-radius:var(--radius-pill);overflow:hidden}
.summary-meter>i{display:block;width:var(--summary-score,0);height:100%;background:var(--cmp-color,var(--accent));border-radius:var(--radius-pill)}
.compare-summary td.cell-best{background:var(--accent-soft)}
.compare-season-cell.cell-best{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cmp-color,var(--accent)) 42%,var(--line))}
.compare-table th:first-child,.compare-table td:first-child{min-width:8.5rem}
.compare-table th:not(:first-child),.compare-table td:not(:first-child){min-width:10.25rem}
.compare-table td{vertical-align:top}
.compare-table td:not(:first-child):not(.n){font-variant-numeric:tabular-nums}
.compare-table td.empty{background:var(--panel)}
.compare-table td.season-heat{background:color-mix(in srgb,var(--cmp-color,var(--accent)) var(--heat,0),#fff)}
.compare-season-cell{border-radius:var(--radius-sm);padding:var(--space-2);margin:calc(-1 * var(--space-2)) calc(-1 * var(--space-3))}
.season-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.season-top .best-badge{margin-right:auto}
.season-top strong{font-family:var(--mono);font-size:var(--text-md)}
.season-meter{height:6px;background:var(--panel-2);border-radius:var(--radius-sm);overflow:hidden;margin:var(--space-1) 0}
.season-meter>i{display:block;width:var(--season-score,0);height:100%;background:var(--cmp-color,var(--accent));border-radius:var(--radius-sm)}
.compare-season-cell span{display:block;margin-top:2px}
.compare-season-cell .pill{display:inline-block;margin-left:var(--space-1);vertical-align:1px}
.season-teams{display:flex!important;gap:var(--space-1);flex-wrap:wrap;margin-top:var(--space-2)!important}
.season-teams .team-badge{max-width:9.5rem;overflow:hidden}
.season-teams .team-badge span{display:inline;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:0}
/* width:0 + min-width:100% zeroes the nowrap text's intrinsic width so it can't
   inflate its table column: an event list wider than the column leaks scrollable
   overflow past the .scroll-x wrapper, and on phones that document-level overflow
   makes Chrome abandon the device-width viewport and lay the page out at 1280px */
.event-list{width:0;min-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compare-summary-wrap .scrollhint,.compare-table-wrap .scrollhint{margin:var(--space-2) var(--space-3) 0}
@media(max-width:760px){
  .compare-page{padding-top:var(--space-4)}
  .compare-hero,.compare-roster{grid-template-columns:1fr;gap:var(--space-3)}
  .compare-hero{align-items:start}
  /* the lede is desktop copy; on phones it costs fold space the verdict needs */
  .compare-title .lede{display:none}
  .compare-add-row{grid-template-columns:minmax(0,1fr) auto}
  .compare-add-row .clearfilters{grid-column:1 / -1}
  .suggestion-group{align-items:flex-start}
  .suggestion-group>span{flex-basis:100%}
}
/* two players must fit side by side on a phone — the core screenshot moment.
   9.4rem columns overshoot a 375px viewport by ~54px; tighten to fit. */
@media(max-width:430px){
  .compare-summary{min-width:calc(5.4rem + (var(--players,2) * 6.3rem))}
  .compare-summary th,.compare-summary td{padding:var(--space-2) var(--space-2)}
  .compare-summary th:first-child{min-width:5.4rem}
  .compare-summary th:not(:first-child),.compare-summary td:not(:first-child){min-width:6.3rem}
  .compare-summary td strong{font-size:var(--text-md)}
  .compare-table{min-width:calc(7rem + (var(--players,2) * 9rem))}
  .compare-table th:first-child,.compare-table td:first-child{min-width:7rem}
  .compare-table th:not(:first-child),.compare-table td:not(:first-child){min-width:9rem}
}

/* ---- Similar players block (player.html) ---- */
#similar{margin-top:var(--space-8)}
.sim-controls{display:flex;justify-content:flex-end;margin:var(--space-1) 0 var(--space-2)}
.seg{display:inline-flex;border:1px solid var(--line-2);border-radius:var(--radius-md);overflow:hidden;background:var(--bg)}
.seg button{font:inherit;font-size:var(--text-sm);font-weight:600;color:var(--muted);background:transparent;
  border:0;padding:var(--space-2) var(--space-3);cursor:pointer;min-height:44px}
.seg button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent)}
.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.sim-row{display:grid;grid-template-columns:1.1rem 9rem 1fr 2.4rem auto;align-items:center;gap:var(--space-3);
  width:100%;text-align:left;background:transparent;border:0;border-top:1px solid var(--line);
  padding:var(--space-2) var(--space-1);cursor:pointer;font:inherit;color:var(--ink)}
.sim-row:first-child{border-top:0}
.sim-row:hover{background:var(--panel)}
.sim-row.active{background:var(--accent-soft)}
.sim-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:var(--radius-sm)}
.sim-row .rk{color:var(--faint);font-size:var(--text-sm);text-align:right}
.sim-row .nm{font-weight:600}
.sim-row .track{position:relative;height:7px;border-radius:var(--radius-sm);background:var(--panel-2);overflow:hidden}
.sim-row .track>i{position:absolute;left:0;top:0;bottom:0;border-radius:var(--radius-sm);background:var(--accent)}
.sim-row .sc{font-family:var(--mono);font-weight:700;font-size:var(--text-base);text-align:right}
.pill.mate{background:var(--warn-soft);color:var(--warn)}
.pill.solo{background:var(--pos-soft);color:var(--pos-ink)}
.sim-cmp-head{margin:var(--space-4) 0 var(--space-2);font-size:var(--text-base);font-weight:600;display:flex;gap:var(--space-2);
  align-items:baseline;flex-wrap:wrap}
.sim-cmp-head .va{color:var(--accent)} .sim-cmp-head .vb{color:var(--warn)}
.sim-cmp-head a{margin-left:auto}
.sim-table{width:100%;border-collapse:collapse;font-size:var(--text-base)}
.sim-table th{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--faint);
  font-weight:600;text-align:right;padding:var(--space-1) var(--space-1)}
.sim-table th.l{text-align:left}
.sim-table td{padding:var(--space-1) var(--space-1);border-top:1px solid var(--line)}
.sim-metric{color:var(--muted)}
.sim-v{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:600}
.sim-v.va{color:var(--accent)} .sim-v.vb{color:var(--warn)}
.sim-gname{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--faint);
  font-weight:700;padding:var(--space-3) var(--space-1) var(--space-1)}
.sim-tag{text-align:right;font-size:var(--text-xs);color:var(--muted);white-space:nowrap}
.sim-tag .dot{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;margin-right:var(--space-1);vertical-align:middle}
.sim-tag.aligned .dot{background:var(--pos)}
.sim-tag.close .dot{background:var(--line-2)}
.sim-tag.differs .dot{background:var(--warn)}
@media (max-width:560px){.sim-row{grid-template-columns:1rem 6.5rem 1fr 2.2rem;gap:var(--space-2)}
  .sim-row .tags{grid-column:2/5}}

/* Similar-players methodology note */
.sim-method{margin:var(--space-1) 0 var(--space-2);font-size:var(--text-sm)}
.sim-method>summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:var(--text-sm);
  list-style:none;display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) 0}
.sim-method>summary::-webkit-details-marker{display:none}
.sim-method>summary::before{content:"›";display:inline-block;transition:transform .15s;font-weight:700}
.sim-method[open]>summary::before{transform:rotate(90deg)}
.sim-method>summary:hover{text-decoration:underline}
.sim-method>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.sim-method-body{color:var(--muted);border-left:2px solid var(--line);padding:var(--space-1) 0 var(--space-1) var(--space-4);
  margin:var(--space-2) 0 var(--space-1);max-width:70ch}
.sim-method-body p{margin:var(--space-2) 0}
.sim-method-body ul{margin:var(--space-2) 0;padding-left:var(--space-4)}
.sim-method-body li{margin:var(--space-1) 0}
.sim-method-body strong{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.sim-method>summary::before{transition:none}}

/* ---- Kills Over Replacement ---- */
.field-label{display:grid;gap:var(--space-1);font-size:var(--text-xs);font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--faint)}
.select{font:inherit;font-size:var(--text-base);color:var(--ink);background:#fff;border:1px solid var(--line-2);
  border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);min-height:44px;min-width:16rem}
.select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.kor-method{margin:var(--space-4) 0}
.kor-controls{display:flex;align-items:end;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;
  margin:var(--space-4) 0 var(--space-5);padding-bottom:var(--space-4);border-bottom:1px solid var(--line)}
.kor-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3);margin:0 0 var(--space-5)}
.kor-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(16rem,.6fr);gap:var(--space-4);align-items:start;
  margin-bottom:var(--space-5)}
.kor-panel{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:var(--space-4)}
.kor-panel h2{font-size:var(--text-md);margin:0 0 var(--space-3)}
.kor-bar-row{display:grid;grid-template-columns:1.5rem minmax(8rem,12rem) minmax(8rem,1fr) 4rem;gap:var(--space-3);
  align-items:center;padding:var(--space-2) 0;border-top:1px solid var(--line)}
.kor-bar-row:first-of-type{border-top:0;padding-top:0}
.kor-bar-row .rank{font-family:var(--mono);font-size:var(--text-sm);color:var(--faint);text-align:right}
.kor-bar-row .bar-name{min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kor-bar-row .bar-name span{display:block;margin-top:2px;font-size:var(--text-xs);font-weight:600;color:var(--faint);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kor-bar-row .bar-track{height:8px;border-radius:var(--radius-sm);background:var(--panel-2);overflow:hidden}
.kor-bar-row .bar-fill{height:100%;border-radius:var(--radius-sm);background:var(--accent)}
.kor-bar-row .bar-value{font-family:var(--mono);font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
/* reserve space while the table builds so the note below doesn't jump (CLS) */
#kor-table:empty{min-height:40vh}
/* soften Tabulator's default frozen-column divider to match the table chrome */
.tabulator .tabulator-cell.tabulator-frozen.tabulator-frozen-left,
.tabulator .tabulator-header .tabulator-col.tabulator-frozen.tabulator-frozen-left{border-right:1px solid var(--line-2)}
/* the replacement baseline participates in sorting as a real row; keep it visually distinct */
.tabulator .tabulator-row.kor-baseline-row,
.tabulator .tabulator-row.kor-baseline-row.tabulator-row-even,
.tabulator .tabulator-row.kor-baseline-row:hover{background:var(--accent-soft)}
.kor-baseline-row .tabulator-cell{color:var(--muted)}
.kor-baseline-name{font-weight:700;color:var(--accent);white-space:nowrap}
.kor-coverage{margin:calc(-1 * var(--space-2)) 0 var(--space-2)}
.kor-pool-note{margin:calc(-1 * var(--space-3)) 0 var(--space-4)}
.kor-row-limit{margin:var(--space-2) 0 0}
/* event-by-event trace expanded under a row; sticky-left keeps it in view while
   the table itself scrolls sideways (same trick as the GOAT builder detail) */
.tabulator .tabulator-row.kor-expanded-row{background:var(--accent-soft)}
.kor-row-detail{clear:both;display:block;position:sticky;left:0;cursor:default;
  max-width:min(720px,calc(100vw - 2.5rem));background:var(--panel);border-top:1px solid var(--line);
  padding:var(--space-4);font-size:var(--text-sm)}
.kor-detail-head{margin-bottom:var(--space-3);color:var(--muted)}
.kor-detail-head .small{display:block;margin-top:2px}
.kor-event-row{display:grid;grid-template-columns:minmax(11rem,1.8fr) 4rem 4.5rem 3.5rem minmax(3.5rem,1fr) 3.5rem;
  gap:var(--space-2);align-items:center;padding:var(--space-2) var(--space-1);border-top:1px solid var(--line);
  cursor:pointer;border-radius:var(--radius-sm)}
.kor-event-row:hover{background:var(--accent-soft)}
.kor-event-row .n{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.kor-event-row .strong{font-weight:700}
.kor-event-name{min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kor-event-toggle{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;
  width:1.9rem;height:1.9rem;margin-right:var(--space-2);border:1px solid var(--line-2);background:#fff;
  color:var(--accent);cursor:pointer;font:inherit;font-size:var(--text-base);font-weight:700;border-radius:var(--radius-sm)}
.kor-event-toggle:hover{background:var(--accent-soft);border-color:var(--accent-line)}
.kor-event-bar .bar-track{height:6px;border-radius:var(--radius-sm);background:var(--panel-2);overflow:hidden}
.kor-event-bar .bar-fill{height:100%;border-radius:var(--radius-sm);background:var(--accent)}
.kor-event-bar .bar-fill.neg{background:var(--neg)}
/* match-level maps nested under an expanded event */
.kor-event-maps{margin:var(--space-1) 0 var(--space-3) var(--space-2);
  padding:var(--space-2) 0 var(--space-2) var(--space-4);border-left:2px solid var(--accent-line)}
.kor-maps-head{font-weight:700;display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-1)}
.kor-maps-legend{margin:0 0 var(--space-2)}
.kor-series-head{font-weight:700;margin-top:var(--space-2)}
.kor-map-row{display:grid;grid-template-columns:minmax(7rem,1fr) auto 4.5rem 3rem;gap:var(--space-2);
  align-items:center;padding:var(--space-1) var(--space-2);font-size:var(--text-sm);border-radius:var(--radius-sm)}
.kor-map-row .n{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
/* maps from the other mode: grey surface + grey pill, clearly out of this board */
.kor-map-row.off-split{background:var(--panel-2)}
.kor-map-row.off-split .kor-map-name,.kor-map-row.off-split .n{color:var(--faint)}
.kor-mode{white-space:nowrap;justify-self:start}
.kor-map-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kor-detail-foot{margin:var(--space-2) 0 0}
@media(max-width:560px){
  .kor-event-row{grid-template-columns:4rem 4.5rem 1fr 3.5rem}
  .kor-event-name{grid-column:1/-1}
  .kor-event-bar{display:none}
  /* full event names beat ellipses on phones — CDL-era names share a long prefix */
  .kor-event-name{white-space:normal}
  .kor-map-name{white-space:normal}
  .kor-map-row{grid-template-columns:minmax(0,1fr) auto 4rem 3rem}
}
@media(max-width:760px){
  .select{width:100%;min-width:0}
  .kor-controls{align-items:stretch}
  .kor-controls .field-label{flex:1 1 100%}
  .kor-summary,.kor-grid{grid-template-columns:1fr}
  .kor-bar-row{grid-template-columns:1.25rem minmax(6rem,1fr) 4rem;gap:var(--space-2)}
  .kor-bar-row .bar-track{grid-column:2 / 4}
}

/* ---- Community consensus ---- */
.community-method-note{margin:var(--space-4) 0}
.community-controls{display:flex;align-items:end;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;
  margin:var(--space-4) 0 var(--space-5);padding-bottom:var(--space-4);border-bottom:1px solid var(--line)}
.cc-segmented{display:flex;align-items:center;gap:3px;padding:3px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2)}
.cc-segmented button{min-height:34px;border:0;background:transparent;color:var(--muted);border-radius:var(--radius-sm);
  padding:0 var(--space-3);font:inherit;font-weight:700;cursor:pointer}
.cc-segmented button.active{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(16,24,40,.08)}
.community-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(16rem,.28fr);gap:var(--space-4);align-items:start}
.community-table{min-width:760px}
.community-overall-table:empty{min-height:420px}
.community-overall-table .tabulator-row{cursor:pointer}
.community-overall-table .tabulator-row.community-selected-row{background:var(--accent-soft)}
.community-overall-table .tabulator-cell.score{font-family:var(--mono);font-size:var(--text-lg);font-weight:800}
.community-overall-table .tabulator-cell.top-count,
.community-overall-table .tabulator-col.top-count .tabulator-col-content{padding-right:var(--space-4)}
.community-table th,.community-table td{vertical-align:middle}
.community-table .score{font-family:var(--mono);font-size:var(--text-lg);font-weight:800}
.bar-mini{display:block;height:6px;margin-top:4px;border-radius:999px;background:var(--panel-2);overflow:hidden}
.bar-mini span{display:block;height:100%;border-radius:999px;background:var(--accent)}
.title-strip{display:flex;flex-wrap:wrap;gap:var(--space-1)}
.title-pill,.title-more{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff;
  padding:2px var(--space-2);font-size:var(--text-xs);font-weight:700;white-space:nowrap}
.title-pill.weak{color:var(--faint);background:var(--panel-2)}
.detail-title-strip{margin-top:var(--space-3)}
.rank-list{display:grid;gap:var(--space-2);margin-top:var(--space-3)}
.rank-row{display:grid;grid-template-columns:2rem minmax(0,1fr) auto;gap:var(--space-2);align-items:center;
  padding-bottom:var(--space-2);border-bottom:1px solid var(--line)}
.rank-row:last-child{padding-bottom:0;border-bottom:0}
.rank-no{font-family:var(--mono);font-weight:800;color:var(--faint)}
.calc-summary{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel-2);
  padding:var(--space-2);margin:var(--space-3) 0}
.cc-calc-table-wrap{margin-top:var(--space-3)}
.cc-calc-table{min-width:820px}
.cc-calc-table .formula{margin:0;white-space:nowrap}
#cc-eramenu .eramenu-panel{right:0;left:auto;max-width:min(96vw,640px)}
/* back-to-ranking link inside trace panels; only needed where the trace stacks below the table */
.cc-backlink{display:none}
@media(max-width:960px){
  .cc-backlink{display:inline-flex;align-items:center;min-height:44px;font-weight:700;margin-bottom:var(--space-2)}
}
.cc-legend{padding:0 var(--space-4) var(--space-4);margin:0}
.community-table tbody tr{cursor:pointer}
.cc-evidence{display:block}
@media(max-width:760px){.title-pill{min-height:44px}}
.source-ledger{margin-top:var(--space-4)}
.source-ledger table{min-width:860px}
.community-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:960px){
  .community-layout{grid-template-columns:1fr}
  .community-mini-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:560px){
  .community-controls{align-items:stretch}
  .community-controls .field-label{flex:1 1 100%}
  .cc-segmented{width:100%}
  .cc-segmented button{flex:1}
  .community-controls .sharebtn{width:100%;justify-content:center}
  .community-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* leaderboard: expandable adjusted-wins math (click the Adjusted value) */
.adjmath{border:0;background:none;padding:0;font:inherit;font-weight:700;color:inherit;cursor:pointer;
  text-decoration:underline dotted var(--muted);text-underline-offset:3px}
.adjmath:hover,.adjmath[aria-expanded="true"]{text-decoration-style:solid;color:var(--accent)}
.adjmath-detail{clear:both;display:block;width:100%;background:var(--panel-2);border-top:1px solid var(--line);
  padding:var(--space-3) var(--space-4);cursor:default;position:sticky;left:0}
.adjmath-detail .small{margin:0 0 var(--space-2)}
.adjmath-table{margin:0 0 var(--space-2);min-width:0;width:auto}
.adjmath-table td.n,.adjmath-table th.n{text-align:right}