*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{width:100%;height:100%;overflow:hidden;background:#080808;font-family:'Lato',sans-serif;color:#fff;}

/* ── SITE HEADER (floats over grid) ── */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;justify-content:space-between;align-items:center;
  padding:1rem 1.5rem;pointer-events:none;
}
.logo{font-family:'Oswald',sans-serif;font-weight:700;font-size:.95rem;color:rgba(255,255,255,.75);letter-spacing:.14em;}
.tagline{font-size:.62rem;color:rgba(255,255,255,.28);letter-spacing:.14em;text-transform:uppercase;}

/* ── MOSAIC ── */
.mosaic{
  display:grid;width:100vw;height:100vh;
  grid-template-columns:repeat(6,1fr);
  grid-template-rows:1fr 1fr;
  gap:2px;background:#0f0f0f;
}
/* top row: NBA | ML | F1   ·   bottom row: MLB | CV | About */
.nba-panel  { grid-column:1/3; grid-row:1; }
.ml-panel   { grid-column:3/5; grid-row:1; }
.f1-panel   { grid-column:5/7; grid-row:1; }
.mlb-panel  { grid-column:1/3; grid-row:2; }
.cv-panel   { grid-column:3/5; grid-row:2; }
.about-panel{ grid-column:5/7; grid-row:2; }

/* phones: two columns, three rows */
@media(max-width:760px){
  .mosaic{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);}
  .nba-panel  { grid-column:1/2; grid-row:1; }
  .ml-panel   { grid-column:2/3; grid-row:1; }
  .f1-panel   { grid-column:1/2; grid-row:2; }
  .mlb-panel  { grid-column:2/3; grid-row:2; }
  .cv-panel   { grid-column:1/2; grid-row:3; }
  .about-panel{ grid-column:2/3; grid-row:3; }
  .panel{padding:1.1rem 1.1rem 1.35rem;}
  .panel-hint{display:none;}
  .panel-sub{font-size:.56rem;letter-spacing:.12em;}
}

/* ── PANELS ── */
.panel{
  position:relative;overflow:hidden;cursor:pointer;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:2rem 2rem 2.75rem;
  -webkit-user-select:none;user-select:none;
}
.panel:active{filter:brightness(.78);}

/* sport-color bar sweeps in on hover */
.panel::after{
  content:'';position:absolute;bottom:0;left:0;
  height:3px;width:0;
  transition:width .55s cubic-bezier(.4,0,.2,1);
}
.panel:hover::after{width:100%;}
.nba-panel::after{background:#F58426;}
.f1-panel::after{background:#DC0000;}
.cv-panel::after{background:#00C8FF;}
.about-panel::after{background:rgba(255,255,255,.65);}

/* ── PANEL BACKGROUNDS ── */
.nba-panel{
  background-color:#7a4f1a;
  background-image:
    repeating-linear-gradient(90deg,transparent 0,transparent 38px,rgba(0,0,0,.055) 38px,rgba(0,0,0,.055) 40px),
    repeating-linear-gradient(180deg,rgba(255,255,255,.016) 0,rgba(255,255,255,.016) 55px,rgba(0,0,0,.04) 55px,rgba(0,0,0,.04) 58px),
    linear-gradient(165deg,#C89040 0%,#9A5E1A 40%,#7A4810 70%,#B07030 100%);
}
.nba-panel::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.53);pointer-events:none;z-index:0;}

.f1-panel{
  background-color:#15151E;
  background-image:repeating-conic-gradient(#1c1c28 0% 25%,#131320 0% 50%);
  background-size:10px 10px;
}
.f1-panel::before{content:'';position:absolute;inset:0;background:linear-gradient(140deg,rgba(220,0,0,.13) 0%,transparent 55%);pointer-events:none;z-index:0;}

/* CV panel: video plays behind everything */
.cv-panel{background:#040C14;}
.cv-panel::before{content:'';position:absolute;inset:0;background:rgba(4,12,20,.62);pointer-events:none;z-index:1;}
.cv-video-bg{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:.22;z-index:0;
  transition:opacity .5s;
}
.cv-panel:hover .cv-video-bg{opacity:.38;}

/* About panel: personal photo underneath */
.about-panel{background:url('ELIpfp.jpg') center top/cover no-repeat;}
.about-panel::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.70);pointer-events:none;z-index:0;}

/* ML panel */
.ml-panel{
  background-color:#0B0916;
  background-image:
    radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    radial-gradient(ellipse at 72% 22%,rgba(139,92,246,.20) 0%,transparent 58%),
    linear-gradient(158deg,#191234 0%,#0D0A1C 55%,#130F26 100%);
  background-size:22px 22px,auto,auto;
}
.ml-panel::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.40);pointer-events:none;z-index:0;}
.ml-panel::after{background:#8B5CF6;}
.ml-panel:hover .panel-sport{color:#8B5CF6;}

/* MLB panel */
.mlb-panel{
  background-color:#060D18;
  background-image:
    repeating-linear-gradient(0deg,transparent,transparent 47px,rgba(255,255,255,.016) 47px,rgba(255,255,255,.016) 48px),
    repeating-linear-gradient(90deg,transparent,transparent 47px,rgba(255,255,255,.016) 47px,rgba(255,255,255,.016) 48px),
    radial-gradient(ellipse at 28% 80%,rgba(196,30,58,.13) 0%,transparent 55%),
    linear-gradient(158deg,#0D1B2A 0%,#060D18 55%,#080F1C 100%);
}
.mlb-panel::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.34);pointer-events:none;z-index:0;}
.mlb-panel::after{background:#D4A017;}
.mlb-panel:hover .panel-sport{color:#D4A017;}

/* ── PANEL CONTENT ── */
.panel-content{position:relative;z-index:2;}
.panel-num{
  font-family:'Roboto Mono',monospace;font-size:.62rem;
  color:rgba(255,255,255,.25);letter-spacing:.22em;margin-bottom:.45rem;
}
.panel-sport{
  font-family:'Oswald',sans-serif;font-weight:700;
  font-size:clamp(60px,8.5vw,152px);
  line-height:.83;letter-spacing:-.025em;color:#fff;
  margin-bottom:.65rem;transition:color .3s ease;
}
.nba-panel:hover .panel-sport{color:#F58426;}
.f1-panel:hover  .panel-sport{color:#DC0000;}
.cv-panel:hover  .panel-sport{color:#00C8FF;}
/* six equal 33vw × 50vh cells */
.panel .panel-sport{font-size:clamp(44px,6.2vw,108px);}

.panel-sub{
  font-size:.68rem;color:rgba(255,255,255,.38);
  letter-spacing:.18em;text-transform:uppercase;margin-bottom:.5rem;
}
.panel-hint{
  font-size:.68rem;color:rgba(255,255,255,.25);letter-spacing:.06em;
  transform:translateY(10px);opacity:0;
  transition:transform .35s ease,opacity .35s ease;
}
.panel:hover .panel-hint{transform:translateY(0);opacity:1;}

/* ── OVERLAYS ── */
.overlay{
  position:fixed;inset:0;z-index:200;
  background:#080808;opacity:0;pointer-events:none;
  transform:translateY(16px);
  transition:opacity .42s ease,transform .42s ease;
  overflow-y:auto;overflow-x:hidden;
}
.overlay.active{opacity:1;pointer-events:all;transform:translateY(0);}

/* sticky close bar */
.ov-close{
  position:sticky;top:0;z-index:20;width:100%;
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(8,8,8,.96);border-bottom:1px solid #181818;
  padding:.85rem 1.75rem;cursor:pointer;border:none;color:inherit;
}
.ov-close-left{display:flex;align-items:center;gap:.8rem;}
.ov-close-x{font-size:1.1rem;font-weight:300;color:rgba(255,255,255,.55);}
.ov-close-label{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.35);}
.ov-close-right{font-family:'Roboto Mono',monospace;font-size:.62rem;color:rgba(255,255,255,.22);letter-spacing:.12em;}

/* hero */
.ov-hero{padding:5.5rem 7vw 4rem;border-bottom:1px solid #161616;max-width:1400px;margin:0 auto;}
.ov-eyebrow{
  font-family:'Roboto Mono',monospace;font-size:.62rem;
  color:rgba(255,255,255,.28);letter-spacing:.22em;text-transform:uppercase;
  margin-bottom:2rem;display:flex;align-items:center;gap:1rem;
}
.ov-eyebrow-line{height:1px;background:#222;width:60px;flex-shrink:0;}
.ov-big-title{
  font-family:'Oswald',sans-serif;font-weight:700;
  font-size:clamp(3.8rem,10vw,10rem);
  line-height:.84;letter-spacing:-.03em;color:#fff;margin-bottom:2.5rem;
}
.ov-question{
  font-size:clamp(.95rem,1.8vw,1.2rem);
  color:rgba(255,255,255,.42);max-width:580px;line-height:1.7;font-style:italic;
}

/* full-bleed visual strip */
.ov-fullbleed{padding:3.5rem 7vw;border-bottom:1px solid #161616;}
.ov-fullbleed-inner{max-width:1200px;margin:0 auto;}

/* two-col section */
.ov-section{padding:4rem 7vw;border-bottom:1px solid #161616;}
.ov-cols{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4.5rem;align-items:center;}
.ov-cols.flip{direction:rtl;}
.ov-cols.flip>*{direction:ltr;}
@media(max-width:820px){.ov-cols{grid-template-columns:1fr;}}

/* prose section */
.ov-prose{padding:4rem 7vw;border-bottom:1px solid #161616;}
.ov-prose-inner{max-width:680px;margin:0 auto;}

/* text styles */
.ov-h3{font-family:'Oswald',sans-serif;font-size:1.75rem;font-weight:500;color:#fff;margin-bottom:1rem;letter-spacing:-.01em;}
.ov-body{font-size:.93rem;color:rgba(255,255,255,.5);line-height:1.82;margin-bottom:1rem;}

/* callout */
.ov-callout{
  border-left:2px solid;padding:.8rem 1.1rem;
  margin:1.5rem 0;font-size:.86rem;line-height:1.65;font-style:italic;
}
.nba-call{border-color:rgba(245,132,38,.55);background:rgba(245,132,38,.04);color:rgba(245,185,120,.78);}
.f1-call{border-color:rgba(220,0,0,.55);background:rgba(220,0,0,.04);color:rgba(255,155,155,.78);}
.cv-call{border-color:rgba(0,200,255,.5);background:rgba(0,200,255,.04);color:rgba(120,218,255,.78);}
.ml-call{border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.05);color:rgba(196,181,253,.82);}

/* caption */
.ov-caption{font-family:'Roboto Mono',monospace;font-size:.62rem;color:rgba(255,255,255,.22);letter-spacing:.12em;text-transform:uppercase;margin-top:.9rem;}

/* pills */
.ov-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:1.75rem;}
.ov-pill{font-family:'Roboto Mono',monospace;font-size:10px;padding:4px 10px;border-radius:2px;}
.np{background:rgba(245,132,38,.1);color:#F5A870;border:1px solid rgba(245,132,38,.2);}
.fp{background:rgba(220,0,0,.1);color:#FF8888;border:1px solid rgba(220,0,0,.2);}
.cp{background:rgba(0,200,255,.08);color:#70DDFF;border:1px solid rgba(0,200,255,.18);}
.mp{background:rgba(139,92,246,.1);color:#B9A2FF;border:1px solid rgba(139,92,246,.22);}

/* links */
.ov-links{display:flex;gap:.85rem;margin-top:2rem;flex-wrap:wrap;}
.ov-link{
  font-size:.78rem;font-weight:700;letter-spacing:.07em;
  text-decoration:none;padding:.6rem 1.4rem;border-radius:2px;
  transition:opacity .2s,transform .15s;
}
.ov-link:hover{opacity:.8;transform:translateY(-1px);}
.nl{background:#F58426;color:#fff;}
.fl{background:#DC0000;color:#fff;}
.cl{background:#00C8FF;color:#001820;}
.gl{background:transparent;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.6);}

/* media */
.ov-img{width:100%;display:block;object-fit:cover;border-radius:2px;}
.ov-video{width:100%;display:block;border-radius:2px;background:#000;}

/* bottom nav */
.ov-bnav{padding:3rem 7vw 4.5rem;display:flex;justify-content:space-between;align-items:flex-end;}
.ov-bn-l{font-size:.62rem;color:rgba(255,255,255,.25);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.45rem;}
.ov-bn-next{
  font-family:'Oswald',sans-serif;font-size:2.2rem;font-weight:700;
  color:rgba(255,255,255,.6);cursor:pointer;letter-spacing:-.01em;
  background:none;border:none;
  transition:color .2s;font:inherit;
  font-family:'Oswald',sans-serif;font-size:2.2rem;font-weight:700;
}
.ov-bn-next:hover{color:#fff;}
.nb:hover{color:#F58426;}
.fb:hover{color:#DC0000;}
.cb:hover{color:#00C8FF;}
.mb:hover{color:#8B5CF6;}

/* ── WEMBANYAMA SHOT CHART ── */
.wemby-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:.85rem;}
.wemby-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem;}
.wemby-ctrl-group{display:flex;gap:3px;}
.wemby-pswitch-btn{
  font-family:'Roboto Mono',monospace;font-size:.63rem;letter-spacing:.07em;
  background:transparent;border:1px solid #222;color:#444;
  padding:5px 14px;border-radius:2px;cursor:pointer;transition:all .18s;white-space:nowrap;
}
.wemby-pswitch-btn:hover{border-color:#F58426;color:#F58426;}
.wemby-pswitch-btn.active{background:rgba(245,132,38,.12);border-color:#F58426;color:#F58426;}
.wemby-view-btn{
  font-family:'Roboto Mono',monospace;font-size:.63rem;letter-spacing:.07em;
  background:transparent;border:1px solid #222;color:#444;
  padding:5px 14px;border-radius:2px;cursor:pointer;transition:all .18s;white-space:nowrap;
}
.wemby-view-btn:hover:not(.active){border-color:#F58426;color:#F58426;}
.wemby-view-btn.active{background:#F58426;border-color:#F58426;color:#fff;}
.wemby-games{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:1.5rem;}
.wemby-game-btn{
  font-family:'Roboto Mono',monospace;font-size:.63rem;letter-spacing:.07em;
  background:transparent;border:1px solid #222;color:#444;
  padding:5px 11px;border-radius:2px;cursor:pointer;
  transition:all .18s;white-space:nowrap;
}
.wemby-game-btn:hover{border-color:#F58426;color:#F58426;}
.wemby-game-btn.active{background:#F58426;border-color:#F58426;color:#fff;}
.wemby-group-btn{border-style:dashed;}
.wemby-group-btn.active{background:rgba(245,132,38,.15);border-style:solid;border-color:#F58426;color:#F58426;}
.wemby-replay-btn{
  font-family:'Roboto Mono',monospace;font-size:.63rem;letter-spacing:.07em;
  background:transparent;border:1px solid #222;color:#444;
  padding:5px 13px;border-radius:2px;cursor:pointer;transition:all .18s;
  flex-shrink:0;
}
.wemby-replay-btn:hover{border-color:#F58426;color:#F58426;}
.wemby-chart-wrap{display:grid;grid-template-columns:500px 1fr;gap:2.5rem;align-items:start;max-width:800px;}
.wemby-stat-panel{padding-top:.5rem;}
.wemby-player-name{font-family:'Oswald',sans-serif;font-size:1.1rem;color:rgba(255,255,255,.7);letter-spacing:.02em;margin-bottom:.15rem;}
.wemby-season{font-family:'Roboto Mono',monospace;font-size:.58rem;color:rgba(255,255,255,.25);letter-spacing:.12em;text-transform:uppercase;margin-bottom:1.5rem;}
.wemby-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem 1rem;}
.wemby-stat-n{font-family:'Oswald',sans-serif;font-size:1.45rem;color:#fff;line-height:1;margin-bottom:.18rem;}
.wemby-stat-l{font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.25);letter-spacing:.1em;text-transform:uppercase;}
.wemby-pts-stat{grid-column:1/-1;margin-top:.5rem;border-top:1px solid #1a1a14;padding-top:.85rem;}
.wemby-pts-stat .wemby-stat-n{font-size:2.6rem;color:#F58426;}
.wemby-legend{display:flex;gap:1.2rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #1a1a14;}
.wemby-leg-item{font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.28);letter-spacing:.08em;display:flex;align-items:center;gap:6px;}
.wemby-leg-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;}

/* ── CAREER COMPARISON TOOL ── */
.cc-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1rem;}
.cc-reset-btn{
  font-family:'Roboto Mono',monospace;font-size:.63rem;letter-spacing:.07em;
  background:transparent;border:1px solid #222;color:#444;
  padding:5px 13px;border-radius:2px;cursor:pointer;transition:all .25s;
  opacity:0;pointer-events:none;
}
.cc-reset-btn.cc-reset-visible{opacity:1;pointer-events:all;border-color:#F58426;color:#F58426;}
.cc-reset-btn.cc-reset-visible:hover{background:#F58426;color:#fff;}
.cc-stage{width:100%;background:#0c0800;border-radius:2px;overflow:hidden;margin-bottom:1.5rem;cursor:crosshair;}
.cc-stage canvas{display:block;width:100%;}
.cc-info{
  opacity:0;max-height:0;overflow:hidden;
  transition:opacity .35s ease,max-height .45s ease;
}
.cc-info.cc-info-visible{opacity:1;max-height:600px;}
.cc-info-inner{
  display:grid;grid-template-columns:1fr 260px;gap:2.5rem;
  padding:1.5rem 0;border-top:1px solid #1a1a14;
}
@media(max-width:640px){.cc-info-inner{grid-template-columns:1fr;gap:1.5rem;}}
.cc-info-name{font-family:'Oswald',sans-serif;font-size:2rem;color:#fff;letter-spacing:-.02em;line-height:1;margin-bottom:.35rem;}
.cc-info-score{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.3rem;}
.cc-score-num{font-family:'Oswald',sans-serif;font-size:1.8rem;color:#F58426;line-height:1;}
.cc-score-lbl{font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.28);letter-spacing:.1em;text-transform:uppercase;}
.cc-info-gp{font-family:'Roboto Mono',monospace;font-size:.58rem;color:rgba(255,255,255,.28);letter-spacing:.07em;margin-bottom:.9rem;}
.cc-awards{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:1rem;}
.cc-award{font-family:'Roboto Mono',monospace;font-size:9px;padding:3px 9px;border-radius:2px;background:rgba(245,132,38,.1);color:#F5A870;border:1px solid rgba(245,132,38,.2);}
.cc-stats-row{display:flex;gap:1.4rem;flex-wrap:wrap;}
.cc-stat-val{font-family:'Oswald',sans-serif;font-size:1.25rem;color:#fff;line-height:1;margin-bottom:.12rem;}
.cc-stat-lbl{font-family:'Roboto Mono',monospace;font-size:.5rem;color:rgba(255,255,255,.25);letter-spacing:.1em;text-transform:uppercase;}
.cc-neighbors-title{font-family:'Roboto Mono',monospace;font-size:.58rem;color:rgba(255,255,255,.28);letter-spacing:.1em;text-transform:uppercase;margin-bottom:.8rem;}
.cc-neighbors{display:flex;flex-direction:column;gap:.45rem;}
.cc-neighbor{
  display:flex;justify-content:space-between;align-items:center;
  padding:.5rem .8rem;background:#111108;
  border:1px solid #1e1e14;border-radius:2px;
  cursor:pointer;transition:border-color .15s,background .15s;
}
.cc-neighbor:hover{border-color:#F58426;background:#1a1a0a;}
.cc-neighbor-name{font-size:.82rem;color:rgba(255,255,255,.7);font-family:'Lato',sans-serif;}
.cc-neighbor-diff{font-family:'Roboto Mono',monospace;font-size:.65rem;color:#F58426;}

/* ── LAP DELTA ANALYZER (F1) ── */
.ld-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1.25rem;flex-wrap:wrap;gap:1rem;}
.ld-driver-row{display:flex;align-items:center;gap:1.1rem;}
.ld-drv-tag{
  display:flex;align-items:center;gap:.45rem;
  font-family:'Roboto Mono',monospace;font-size:.65rem;
  color:rgba(255,255,255,.45);letter-spacing:.1em;
}
.ld-drv-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block;}
.ld-stage{width:100%;background:#080808;border-radius:2px;overflow:hidden;margin-bottom:.75rem;}
.ld-stage canvas{display:block;width:100%;}
.ld-hover-panel{
  display:flex;flex-wrap:wrap;gap:.9rem 1.4rem;align-items:center;
  padding:.55rem 1rem;
  background:#0c0800;border:1px solid #1e1e14;border-radius:2px;
  font-family:'Roboto Mono',monospace;font-size:.62rem;
  color:rgba(255,255,255,.3);letter-spacing:.07em;
  transition:opacity .15s;
  opacity:0.3;
}
.ld-hp-lap{color:rgba(255,255,255,.55);font-weight:700;}
.ld-hp-delta{font-size:.72rem;font-weight:700;color:#F58426;}
.ld-hp-sector{color:rgba(255,255,255,.35);}
.ld-hp-sep{color:rgba(255,255,255,.12);}
.ld-hp-tyre{color:rgba(255,255,255,.4);}

/* ── SHOT TRAJECTORY VIEWER (CV) ── */
.tr-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1.25rem;}
.tr-wrap{display:grid;grid-template-columns:1fr 180px;gap:2rem;align-items:start;}
@media(max-width:640px){.tr-wrap{grid-template-columns:1fr;}}
.tr-canvas-wrap{width:100%;border-radius:2px;overflow:hidden;background:#040C14;}
.tr-canvas-wrap canvas{display:block;width:100%;}
.tr-stat-panel{padding-top:.25rem;}
.tr-stat{margin-bottom:1.1rem;}
.tr-stat-n{
  font-family:'Oswald',sans-serif;font-size:1.55rem;
  color:#00C8FF;line-height:1;margin-bottom:.18rem;
}
.tr-stat-l{
  font-family:'Roboto Mono',monospace;font-size:.53rem;
  color:rgba(255,255,255,.25);letter-spacing:.1em;text-transform:uppercase;
}
.tr-phases{
  display:flex;flex-direction:column;gap:.35rem;
  margin-top:1.25rem;padding-top:1rem;border-top:1px solid #0d2030;
}
.tr-phase{
  font-family:'Roboto Mono',monospace;font-size:.58rem;
  letter-spacing:.14em;padding:.32rem .6rem;border-radius:2px;
  color:rgba(0,200,255,.2);border:1px solid rgba(0,200,255,.08);
  transition:all .25s;
}
.tr-phase.active{
  color:#00C8FF;border-color:rgba(0,200,255,.4);
  background:rgba(0,200,255,.07);
}

/* ── SHOT CHART — FILTER PILLS & SUMMARY ──────────────────────────────────── */
.wemby-filters{
  display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;
  padding:.55rem .1rem .35rem;
  opacity:0;transition:opacity .3s ease;
}
.wemby-filters.visible{ opacity:1; }

.wf-pill{
  background:transparent;
  border:1px solid rgba(245,132,38,.22);
  color:rgba(245,132,38,.45);
  font-family:'Roboto Mono',monospace;
  font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.28rem .6rem;border-radius:2px;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .15s ease;
  user-select:none;
}
.wf-pill:hover{
  border-color:rgba(245,132,38,.5);
  color:rgba(245,132,38,.75);
  transform:translateY(-1px);
}
.wf-pill.active{
  background:rgba(245,132,38,.15);
  border-color:rgba(245,132,38,.7);
  color:#F58426;
}

.wf-sep{
  width:1px;height:1rem;
  background:rgba(255,255,255,.1);
  margin:0 .15rem;flex-shrink:0;
}

.wemby-summary{
  display:flex;align-items:baseline;gap:.7rem;
  min-height:1.2rem;
  padding:.1rem 0 .55rem;
  border-bottom:1px solid rgba(255,255,255,.05);
  transition:opacity .25s ease;
}
.ws-zone{
  font-family:'Oswald',sans-serif;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;
  color:rgba(245,132,38,.7);
}
.ws-stat{
  font-family:'Roboto Mono',monospace;font-size:.56rem;
  letter-spacing:.1em;color:rgba(255,255,255,.35);
}

/* ── F1 TELEMETRY VIEWER ───────────────────────────────────────────────────── */
.tlm-header{
  display:flex;align-items:flex-start;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;margin-bottom:1rem;
}
.tlm-controls{
  display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:.85rem;align-items:center;
}
.tlm-ctrl-group{
  display:flex;align-items:center;gap:.3rem;
}
.tlm-ctrl-label{
  font-family:'Roboto Mono',monospace;font-size:.48rem;
  letter-spacing:.14em;color:rgba(255,255,255,.22);
  text-transform:uppercase;margin-right:.2rem;
}
.tlm-race-btn,.tlm-drv-btn,.tlm-ch-btn{
  background:transparent;
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.3);
  font-family:'Roboto Mono',monospace;font-size:.52rem;
  letter-spacing:.1em;text-transform:uppercase;
  padding:.26rem .55rem;border-radius:2px;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
  display:flex;align-items:center;gap:.3rem;
}
.tlm-race-btn:hover,.tlm-drv-btn:hover,.tlm-ch-btn:hover{
  border-color:rgba(255,255,255,.3);color:rgba(255,255,255,.65);
}
.tlm-race-btn.active,.tlm-ch-btn.active{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.35);color:#fff;
}
.tlm-drv-btn.active.lec-btn{ border-color:rgba(220,0,0,.5); color:rgba(220,0,0,.9); background:rgba(220,0,0,.08); }
.tlm-drv-btn.active.str-btn{ border-color:rgba(0,165,80,.5); color:rgba(0,165,80,.9); background:rgba(0,165,80,.08); }
.tlm-drv-btn.active.pia-btn{ border-color:rgba(255,128,0,.5); color:rgba(255,128,0,.9); background:rgba(255,128,0,.08); }

.tlm-drv-dot{
  width:6px;height:6px;border-radius:50%;display:inline-block;
}
.tlm-drv-dot.lec{ background:#DC0000; }
.tlm-drv-dot.str{ background:#00A550; }
.tlm-drv-dot.pia{ background:#FF8000; }
.tlm-drv-dot.ant{ background:#00D2BE; }
.tlm-drv-dot.rus{ background:#C6C6C6; }

.tlm-stage{
  position:relative;width:100%;
  background:#060608;border:1px solid rgba(255,255,255,.05);
  border-radius:2px;overflow:hidden;
}
.tlm-stage canvas{
  width:100%;display:block;cursor:crosshair;
}
.tlm-tooltip{
  position:absolute;pointer-events:none;
  background:#101014;border:1px solid rgba(255,255,255,.12);
  padding:.4rem .65rem;border-radius:2px;font-size:.58rem;
  font-family:'Roboto Mono',monospace;color:rgba(255,255,255,.75);
  white-space:nowrap;opacity:0;transition:opacity .15s;
  letter-spacing:.06em;line-height:1.6;
}

.tlm-scrub-wrap{
  padding:.35rem .55rem .4rem;
  background:rgba(0,0,0,.3);
}
.tlm-scrubber{
  width:100%;height:2px;cursor:pointer;
  -webkit-appearance:none;appearance:none;
  background:rgba(255,255,255,.08);border-radius:1px;outline:none;
}
.tlm-scrubber::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:10px;height:10px;border-radius:50%;
  background:#fff;cursor:pointer;
  box-shadow:0 0 4px rgba(255,255,255,.4);
}
.tlm-scrubber::-moz-range-thumb{
  width:10px;height:10px;border-radius:50%;border:none;
  background:#fff;cursor:pointer;
}

.tlm-statrow{
  display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;
  padding:.6rem .05rem .25rem;
  border-top:1px solid rgba(255,255,255,.05);
}
.tlm-stat-item{
  display:flex;align-items:baseline;gap:.3rem;
}
.tlm-stat-lbl{
  font-family:'Roboto Mono',monospace;font-size:.44rem;
  letter-spacing:.14em;color:rgba(255,255,255,.22);
  text-transform:uppercase;
}
.tlm-stat-val{
  font-family:'Roboto Mono',monospace;font-size:.66rem;
  color:rgba(255,255,255,.7);letter-spacing:.05em;
}
.tlm-stat-item.lec .tlm-stat-val{ color:#DC0000; }
.tlm-stat-item.str .tlm-stat-val{ color:#00A550; }
.tlm-stat-item.pia .tlm-stat-val{ color:#FF8000; }
.tlm-stat-item.ant .tlm-stat-val{ color:#00D2BE; }
.tlm-stat-item.rus .tlm-stat-val{ color:#C6C6C6; }
.tlm-stat-sep{
  width:1px;height:1rem;background:rgba(255,255,255,.08);margin:0 .2rem;
}

/* ── Teammate driver badges (header) ── */
.tlm-mate-badges{
  display:flex;align-items:center;gap:.65rem;
}
.tlm-drv-badge{
  display:flex;align-items:center;gap:.35rem;
  font-family:'Oswald',sans-serif;font-weight:700;
  font-size:.72rem;letter-spacing:.12em;
  color:rgba(255,255,255,.55);
}
.tlm-drv-badge.ant{ color:#00D2BE; }
.tlm-drv-badge.rus{ color:#C6C6C6; }

/* ── Delta fill legend strip ── */
.tlm-delta-legend{
  display:flex;align-items:center;gap:.45rem;
  margin-left:auto;
}
.tlm-delta-swatch{
  width:10px;height:10px;border-radius:2px;
}
.tlm-delta-swatch.green{ background:rgba(0,210,130,0.4); }
.tlm-delta-swatch.red  { background:rgba(210,50,50,0.4); }
.tlm-delta-lbl{
  font-family:'Roboto Mono',monospace;font-size:.58rem;
  color:rgba(255,255,255,.28);letter-spacing:.06em;
  text-transform:uppercase;margin-right:.5rem;
}

/* ── MLB BATTED BALL ANALYTICS ─────────────────────────────────────────────── */
.mlb-header{
  display:flex;justify-content:space-between;align-items:flex-start;
  flex-wrap:wrap;gap:1rem;margin-bottom:1.25rem;
}
.mlb-player-btns{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center;}
.mlb-player-btn{
  font-family:'Roboto Mono',monospace;font-size:.6rem;letter-spacing:.1em;
  background:transparent;border:1px solid rgba(196,30,58,.2);color:rgba(196,30,58,.38);
  padding:.3rem .72rem;border-radius:2px;cursor:pointer;transition:all .2s;
}
.mlb-player-btn:hover{border-color:rgba(196,30,58,.5);color:rgba(196,30,58,.7);}
.mlb-player-btn.active{background:rgba(196,30,58,.14);border-color:rgba(196,30,58,.65);color:#C41E3A;}

.mlb-filter-row{
  display:flex;flex-wrap:wrap;gap:.8rem 1.4rem;align-items:center;
  margin-bottom:1.1rem;padding:.5rem 0;
  border-top:1px solid #161616;border-bottom:1px solid #161616;
}
.mlb-filter-group{display:flex;align-items:center;gap:.38rem;}
.mlb-filter-label{
  font-family:'Roboto Mono',monospace;font-size:.45rem;letter-spacing:.15em;
  color:rgba(255,255,255,.18);text-transform:uppercase;margin-right:.1rem;white-space:nowrap;
}
.mlb-pills{display:flex;gap:.28rem;flex-wrap:wrap;}
.mlb-pill{
  font-family:'Roboto Mono',monospace;font-size:.5rem;letter-spacing:.09em;
  background:transparent;border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.22);padding:.22rem .52rem;border-radius:2px;
  cursor:pointer;transition:all .18s;text-transform:uppercase;
}
.mlb-pill:hover{border-color:rgba(196,30,58,.38);color:rgba(196,30,58,.6);}
.mlb-pill.active{background:rgba(196,30,58,.11);border-color:rgba(196,30,58,.55);color:#C41E3A;}

.mlb-canvas-row{
  display:grid;grid-template-columns:1.5fr 1fr;gap:1rem;
  margin-bottom:.85rem;
}
@media(max-width:720px){.mlb-canvas-row{grid-template-columns:1fr;}}
.mlb-scatter-stage{
  position:relative;background:#050A12;border-radius:2px;overflow:hidden;
  border:1px solid rgba(255,255,255,.04);
}
.mlb-scatter-stage canvas{display:block;width:100%;cursor:crosshair;}
.mlb-vector-stage{
  background:#050A12;border-radius:2px;overflow:hidden;
  border:1px solid rgba(255,255,255,.04);
}
.mlb-vector-stage canvas{display:block;width:100%;}
.mlb-tooltip{
  position:absolute;pointer-events:none;opacity:0;
  background:rgba(5,10,18,.94);border:1px solid rgba(196,30,58,.22);
  padding:.38rem .6rem;border-radius:2px;
  font-family:'Roboto Mono',monospace;font-size:.54rem;
  color:rgba(255,255,255,.72);line-height:1.65;
  transition:opacity .1s;white-space:nowrap;z-index:5;
}

.mlb-statrow{
  display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;
  padding:.5rem .75rem;background:#05080E;
  border:1px solid #0D1A26;border-radius:2px;
}
.mlb-stat-item{
  display:flex;flex-direction:column;align-items:center;padding:.18rem .55rem;
}
.mlb-stat-lbl{
  font-family:'Roboto Mono',monospace;font-size:.43rem;
  letter-spacing:.12em;color:rgba(255,255,255,.2);text-transform:uppercase;margin-bottom:.16rem;
}
.mlb-stat-val{
  font-family:'Oswald',sans-serif;font-size:1rem;
  color:rgba(255,255,255,.55);letter-spacing:-.01em;line-height:1;
  transition:color .2s;
}
.mlb-stat-val.ev-hard{color:#C41E3A;}
.mlb-stat-sep{
  width:1px;height:1.75rem;
  background:rgba(255,255,255,.07);flex-shrink:0;
}
.mlb-call{border-color:rgba(196,30,58,.5);background:rgba(196,30,58,.04);color:rgba(255,155,155,.75);}
.ml{background:#C41E3A;color:#fff;}

/* ══════════════════════════════════════════════════════════════════
   PITCH LAB — 3D TRAJECTORY VIEW
   ══════════════════════════════════════════════════════════════════ */

.pit-view-group{margin-left:auto;}
.pit-view-toggle{
  display:inline-flex;gap:2px;padding:2px;
  background:#05080E;border:1px solid rgba(196,30,58,.18);border-radius:2px;
}
.pit-view-btn{
  font-family:'Roboto Mono',monospace;font-size:.5rem;letter-spacing:.14em;
  padding:.3rem .7rem;background:transparent;color:rgba(255,255,255,.32);
  border:none;border-radius:1px;cursor:pointer;transition:all .18s;
}
.pit-view-btn:hover{color:rgba(196,30,58,.7);}
.pit-view-btn.active{
  background:rgba(196,30,58,.16);color:#C41E3A;
  box-shadow:inset 0 0 0 1px rgba(196,30,58,.5);
}

.pit-3d-stage{
  position:relative;background:#02060C;border-radius:2px;overflow:hidden;
  border:1px solid rgba(255,255,255,.04);
  min-height:480px;margin-bottom:.85rem;
}
.pit-3d-stage canvas{
  display:block;width:100%;height:100%;
  cursor:grab;touch-action:none;
}
.pit-3d-stage canvas:active{cursor:grabbing;}
.pit-3d-stage[hidden]{display:none !important;}

.pit-3d-hud{
  position:absolute;pointer-events:none;z-index:3;
  font-family:'Roboto Mono',monospace;
}
.pit-3d-hud-tl{top:14px;left:14px;max-width:60%;}
.pit-3d-hud-tr{top:12px;right:12px;display:flex;gap:6px;pointer-events:auto;}
.pit-3d-hud-bl{bottom:14px;left:14px;pointer-events:auto;}
.pit-3d-hud-br{bottom:14px;right:14px;}

.pit-3d-eyebrow{
  font-family:'Oswald',sans-serif;font-size:.8rem;letter-spacing:.18em;
  color:#C41E3A;text-transform:uppercase;line-height:1;margin-bottom:.28rem;
}
.pit-3d-sub{
  font-size:.5rem;letter-spacing:.06em;color:rgba(255,255,255,.42);
  line-height:1.5;max-width:340px;
}
.pit-3d-hint{
  font-size:.44rem;letter-spacing:.13em;color:rgba(255,255,255,.24);
  text-transform:uppercase;text-align:right;
}

.pit-3d-btn{
  font-family:'Roboto Mono',monospace;font-size:.46rem;letter-spacing:.16em;
  padding:.38rem .7rem;background:rgba(5,8,14,.85);color:rgba(255,255,255,.5);
  border:1px solid rgba(255,255,255,.09);border-radius:2px;
  cursor:pointer;transition:all .18s;text-transform:uppercase;
  backdrop-filter:blur(2px);
}
.pit-3d-btn:hover{color:#C41E3A;border-color:rgba(196,30,58,.5);}
.pit-3d-btn.active{color:#C41E3A;border-color:rgba(196,30,58,.65);background:rgba(196,30,58,.1);}

.pit-3d-legend{
  display:flex;flex-direction:column;gap:.24rem;
  background:rgba(2,6,12,.65);padding:.5rem .7rem;border-radius:2px;
  border:1px solid rgba(255,255,255,.05);
  backdrop-filter:blur(2px);
}
.pit-3d-legend-row{
  display:flex;align-items:center;gap:.5rem;
  font-size:.48rem;letter-spacing:.08em;color:rgba(255,255,255,.55);
  cursor:pointer;user-select:none;
}
.pit-3d-legend-row.off{opacity:.35;}
.pit-3d-legend-dot{
  width:8px;height:8px;border-radius:50%;flex-shrink:0;
  box-shadow:0 0 6px currentColor;
}
.pit-3d-legend-name{flex:1;color:rgba(255,255,255,.8);}
.pit-3d-legend-count{
  font-size:.42rem;color:rgba(255,255,255,.32);letter-spacing:.06em;
}

#pit-3d-tooltip{
  position:absolute;pointer-events:none;opacity:0;z-index:4;
  background:rgba(2,6,12,.94);border:1px solid rgba(196,30,58,.35);
  padding:.5rem .7rem;border-radius:2px;
  font-family:'Roboto Mono',monospace;font-size:.55rem;
  color:rgba(255,255,255,.78);line-height:1.65;
  transition:opacity .1s;white-space:nowrap;
  backdrop-filter:blur(3px);
}

@media(max-width:720px){
  .pit-view-group{margin-left:0;width:100%;}
  .pit-3d-stage{min-height:400px;}
  .pit-3d-hud-tl{max-width:70%;}
  .pit-3d-sub{display:none;}
  .pit-3d-hud-bl{display:none;}
  .pit-3d-hint{font-size:.4rem;}
}


/* ══════════════════════════════════════════════════════════════════
   BATTING LAB — 3D FLIGHT VIEW  (mirrors pit-3d)
   ══════════════════════════════════════════════════════════════════ */

.mlb-view-group{margin-left:auto;}
.mlb-view-toggle{
  display:inline-flex;gap:2px;padding:2px;
  background:#05080E;border:1px solid rgba(196,30,58,.18);border-radius:2px;
}
.mlb-view-btn{
  font-family:'Roboto Mono',monospace;font-size:.5rem;letter-spacing:.14em;
  padding:.3rem .7rem;background:transparent;color:rgba(255,255,255,.32);
  border:none;border-radius:1px;cursor:pointer;transition:all .18s;
}
.mlb-view-btn:hover{color:rgba(196,30,58,.7);}
.mlb-view-btn.active{
  background:rgba(196,30,58,.16);color:#C41E3A;
  box-shadow:inset 0 0 0 1px rgba(196,30,58,.5);
}

.mlb-3d-stage{
  position:relative;background:#02060C;border-radius:2px;overflow:hidden;
  border:1px solid rgba(255,255,255,.04);
  min-height:520px;margin-bottom:.85rem;
}
.mlb-3d-stage canvas{
  display:block;width:100%;height:100%;
  cursor:grab;touch-action:none;
}
.mlb-3d-stage canvas:active{cursor:grabbing;}
.mlb-3d-stage[hidden]{display:none !important;}

.mlb-3d-hud{
  position:absolute;pointer-events:none;z-index:3;
  font-family:'Roboto Mono',monospace;
}
.mlb-3d-hud-tl{top:14px;left:14px;max-width:60%;}
.mlb-3d-hud-tr{top:12px;right:12px;display:flex;gap:6px;pointer-events:auto;}
.mlb-3d-hud-bl{bottom:14px;left:14px;pointer-events:auto;}
.mlb-3d-hud-br{bottom:14px;right:14px;}

.mlb-3d-eyebrow{
  font-family:'Oswald',sans-serif;font-size:.8rem;letter-spacing:.18em;
  color:#C41E3A;text-transform:uppercase;line-height:1;margin-bottom:.28rem;
}
.mlb-3d-sub{
  font-size:.5rem;letter-spacing:.06em;color:rgba(255,255,255,.42);
  line-height:1.5;max-width:360px;
}
.mlb-3d-hint{
  font-size:.44rem;letter-spacing:.13em;color:rgba(255,255,255,.24);
  text-transform:uppercase;text-align:right;
}

.mlb-3d-btn{
  font-family:'Roboto Mono',monospace;font-size:.46rem;letter-spacing:.16em;
  padding:.38rem .7rem;background:rgba(5,8,14,.85);color:rgba(255,255,255,.5);
  border:1px solid rgba(255,255,255,.09);border-radius:2px;
  cursor:pointer;transition:all .18s;text-transform:uppercase;
  backdrop-filter:blur(2px);
}
.mlb-3d-btn:hover{color:#C41E3A;border-color:rgba(196,30,58,.5);}
.mlb-3d-btn.active{color:#C41E3A;border-color:rgba(196,30,58,.65);background:rgba(196,30,58,.1);}

.mlb-3d-legend{
  display:flex;flex-direction:column;gap:.24rem;
  background:rgba(2,6,12,.65);padding:.5rem .7rem;border-radius:2px;
  border:1px solid rgba(255,255,255,.05);
  backdrop-filter:blur(2px);
}
.mlb-3d-legend-row{
  display:flex;align-items:center;gap:.5rem;
  font-size:.48rem;letter-spacing:.08em;color:rgba(255,255,255,.55);
  cursor:pointer;user-select:none;
}
.mlb-3d-legend-row.off{opacity:.35;}
.mlb-3d-legend-dot{
  width:8px;height:8px;border-radius:50%;flex-shrink:0;
  box-shadow:0 0 6px currentColor;
}
.mlb-3d-legend-name{flex:1;color:rgba(255,255,255,.8);}
.mlb-3d-legend-count{
  font-size:.42rem;color:rgba(255,255,255,.32);letter-spacing:.06em;
}

#mlb-3d-tooltip{
  position:absolute;pointer-events:none;opacity:0;z-index:4;
  background:rgba(2,6,12,.94);border:1px solid rgba(196,30,58,.35);
  padding:.5rem .7rem;border-radius:2px;
  font-family:'Roboto Mono',monospace;font-size:.55rem;
  color:rgba(255,255,255,.78);line-height:1.65;
  transition:opacity .1s;white-space:nowrap;
  backdrop-filter:blur(3px);
}

@media(max-width:720px){
  .mlb-view-group{margin-left:0;width:100%;}
  .mlb-3d-stage{min-height:420px;}
  .mlb-3d-hud-tl{max-width:70%;}
  .mlb-3d-sub{display:none;}
  .mlb-3d-hud-bl{display:none;}
  .mlb-3d-hint{font-size:.4rem;}
}


/* ══════════════════════════════════════════════════════════════════
   RF PREDICTION MODEL (ML overlay)
   ══════════════════════════════════════════════════════════════════ */

.rf-header{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.9rem;}
.rf-chips{display:flex;gap:6px;flex-wrap:wrap;}
.rf-chip{
  font-family:'Roboto Mono',monospace;font-size:10px;padding:4px 10px;border-radius:2px;
  background:rgba(139,92,246,.07);color:#B9A2FF;border:1px solid rgba(139,92,246,.18);white-space:nowrap;
}
.rf-lede{margin-bottom:2rem;font-size:.85rem;max-width:640px;}

/* ── pipeline ── */
.rf-pipeline{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;}
.rf-stage{
  background:#0c0800;border:1px solid #191910;border-top:2px solid rgba(139,92,246,.18);
  padding:1.15rem 1.15rem 1.35rem;
  transition:background .25s,border-top-color .25s,transform .25s;
}
.rf-pipeline .rf-stage:nth-child(2){border-top-color:rgba(139,92,246,.34);}
.rf-pipeline .rf-stage:nth-child(3){border-top-color:rgba(139,92,246,.5);}
.rf-pipeline .rf-stage:nth-child(4){border-top-color:rgba(139,92,246,.68);}
.rf-pipeline .rf-stage:nth-child(5){border-top-color:rgba(139,92,246,.9);}
.rf-stage:hover{background:#12100a;border-top-color:#8B5CF6;transform:translateY(-2px);}
.rf-stage-num{font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(139,92,246,.55);letter-spacing:.16em;margin-bottom:.75rem;}
.rf-stage-t{font-family:'Oswald',sans-serif;font-size:.98rem;font-weight:400;color:#fff;line-height:1.2;margin-bottom:.5rem;letter-spacing:.01em;}
.rf-stage-d{font-size:.72rem;color:rgba(255,255,255,.4);line-height:1.62;}
@media(max-width:900px){.rf-pipeline{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.rf-pipeline{grid-template-columns:1fr;}}

/* ── evaluation layout ── */
.rf-eval{display:grid;grid-template-columns:1fr 290px;gap:3.5rem;align-items:start;}
@media(max-width:900px){.rf-eval{grid-template-columns:1fr;gap:2.25rem;}}

/* ── R² bars ── */
.rf-chart{display:block;}
.rf-row{
  display:grid;grid-template-columns:58px 1fr 50px 78px;align-items:center;gap:.9rem;
  padding:.52rem .55rem;margin:0 -.55rem;border-radius:2px;
  transition:background .18s;cursor:default;
}
.rf-row:hover,.rf-row:focus-visible{background:rgba(139,92,246,.05);outline:none;}
.rf-row:focus-visible{box-shadow:inset 0 0 0 1px rgba(139,92,246,.45);}
.rf-row-stat{font-family:'Oswald',sans-serif;font-size:.92rem;color:rgba(255,255,255,.85);letter-spacing:.03em;}
.rf-track{position:relative;height:9px;background:#16150f;border-radius:2px;}
.rf-fill{
  position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;
  transition:width .95s cubic-bezier(.4,0,.2,1);
}
.rf-fill.rf-sig{background:#8B5CF6;}
.rf-fill.rf-low{background:#46453d;}
.rf-val{
  font-family:'Roboto Mono',monospace;font-size:.73rem;color:rgba(255,255,255,.72);
  text-align:right;font-variant-numeric:tabular-nums;
}
.rf-tier{font-family:'Roboto Mono',monospace;font-size:.52rem;letter-spacing:.13em;text-transform:uppercase;text-align:right;}
.rf-t-strong{color:#B9A2FF;}
.rf-t-mod{color:rgba(255,255,255,.4);}
.rf-t-noise{color:rgba(255,255,255,.22);}

/* axis */
.rf-axis{display:grid;grid-template-columns:58px 1fr 50px 78px;gap:.9rem;margin-top:.5rem;}
.rf-axis-spacer{}
.rf-axis-track{position:relative;height:20px;border-top:1px solid #1d1c15;}
.rf-tick{
  position:absolute;top:5px;transform:translateX(-50%);white-space:nowrap;
  font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.26);
  font-variant-numeric:tabular-nums;
}
.rf-tick:first-child{transform:translateX(0);}
.rf-tick:last-child{transform:translateX(-100%);}
@media(max-width:560px){
  .rf-row,.rf-axis{grid-template-columns:44px 1fr 42px 60px;gap:.55rem;}
  .rf-row-stat{font-size:.82rem;}
  .rf-tier{font-size:.46rem;letter-spacing:.08em;}
}

/* ── side read-out ── */
.rf-side{border-left:1px solid #1a1a12;padding-left:2rem;}
@media(max-width:900px){.rf-side{border-left:none;border-top:1px solid #1a1a12;padding-left:0;padding-top:1.75rem;}}
.rf-note-lbl{
  font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.26);
  letter-spacing:.16em;text-transform:uppercase;margin-bottom:.9rem;
}
.rf-note{min-height:104px;margin-bottom:1.75rem;}
.rf-note-stat{font-family:'Oswald',sans-serif;font-size:1.5rem;color:#fff;line-height:1;margin-bottom:.15rem;letter-spacing:-.01em;}
.rf-note-r2{font-family:'Roboto Mono',monospace;font-size:.6rem;color:#B9A2FF;letter-spacing:.1em;margin-bottom:.75rem;}
.rf-note-d{font-size:.78rem;color:rgba(255,255,255,.45);line-height:1.7;}
.rf-keyblock{border-top:1px solid #1a1a12;padding-top:1.25rem;}
.rf-key-t{
  font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.26);
  letter-spacing:.16em;text-transform:uppercase;margin-bottom:.65rem;
}
.rf-key-d{font-size:.73rem;color:rgba(255,255,255,.34);line-height:1.72;}
.rf-flag{
  font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.3);
  letter-spacing:.08em;line-height:1.75;margin-top:1rem;padding:.55rem .75rem;
  border:1px dashed rgba(139,92,246,.28);border-radius:2px;background:rgba(139,92,246,.03);
}

/* two-col text block reads better top-aligned than centred */
.ov-cols.rf-cols{align-items:start;}


/* ══════════════════════════════════════════════════════════════════
   ML EVALUATION + PLAYER SHOWCASE
   ══════════════════════════════════════════════════════════════════ */

/* headline stat tiles */
.ml-stats{
  display:flex;gap:3.5rem;flex-wrap:wrap;
  margin-bottom:2.25rem;padding-bottom:1.9rem;border-bottom:1px solid #191527;
}
.ml-stat-n{font-family:'Oswald',sans-serif;font-size:2.6rem;color:#fff;line-height:1;letter-spacing:-.02em;margin-bottom:.4rem;}
.ml-stat.hero .ml-stat-n{font-size:3.9rem;color:#B9A2FF;}
.ml-stat-n .u{font-size:.45em;color:rgba(255,255,255,.35);margin-left:.12em;}
.ml-stat.hero .ml-stat-n .u{color:rgba(185,162,255,.55);}
.ml-stat-l{font-family:'Roboto Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.3);letter-spacing:.14em;text-transform:uppercase;}
@media(max-width:620px){.ml-stats{gap:2rem;}.ml-stat.hero .ml-stat-n{font-size:3rem;}.ml-stat-n{font-size:2rem;}}

.ml-hr .rf-note{min-height:88px;margin-bottom:0;}

/* ── predicted vs actual facets ── */
.ml-facets{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-bottom:1rem;}
@media(max-width:1040px){.ml-facets{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.ml-facets{grid-template-columns:1fr;}}
.ml-facet{background:#0b0912;border:1px solid #191527;padding:1rem 1rem .75rem;}
.ml-facet-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.15rem;}
.ml-facet-t{font-family:'Oswald',sans-serif;font-size:1.05rem;color:#fff;letter-spacing:.02em;}
.ml-facet-r{font-family:'Roboto Mono',monospace;font-size:.6rem;color:#B9A2FF;letter-spacing:.06em;font-variant-numeric:tabular-nums;}
.ml-facet-sub{font-family:'Roboto Mono',monospace;font-size:.52rem;color:rgba(255,255,255,.26);letter-spacing:.1em;margin-bottom:.75rem;}
.ml-facet svg{display:block;width:100%;max-width:330px;height:auto;margin:0 auto;overflow:visible;}
.ml-dot{fill:#8B5CF6;fill-opacity:.7;stroke:#0b0912;stroke-width:1.3;cursor:pointer;transition:fill-opacity .15s,fill .15s;}
.ml-dot:hover{fill:#C4B5FD;fill-opacity:1;}
.ml-diag{stroke:rgba(255,255,255,.17);stroke-width:1;}
.ml-ax{stroke:#232030;stroke-width:1;}
.ml-axlbl{fill:rgba(255,255,255,.28);font-family:'Roboto Mono',monospace;font-size:7.5px;}
.ml-note-meta{
  font-family:'Roboto Mono',monospace;font-size:.58rem;color:rgba(255,255,255,.34);
  letter-spacing:.08em;margin-bottom:.8rem;font-variant-numeric:tabular-nums;
}
.ml-readout{
  font-family:'Roboto Mono',monospace;font-size:.62rem;color:rgba(255,255,255,.42);
  letter-spacing:.06em;padding:.7rem .9rem;background:#0b0912;border:1px solid #191527;
  border-radius:2px;min-height:34px;
}
.ml-readout b{color:#B9A2FF;font-weight:400;}

/* ── player showcase ── */
.ml-players{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:2.25rem;}
.ml-pchip{
  display:flex;align-items:baseline;gap:.55rem;
  padding:.5rem .85rem;background:#0b0912;border:1px solid #1d1930;border-radius:2px;
  cursor:pointer;transition:border-color .18s,background .18s;
}
.ml-pchip:hover{border-color:rgba(139,92,246,.55);background:#120f1c;}
.ml-pchip.on{border-color:#8B5CF6;background:rgba(139,92,246,.12);}
.ml-pchip-n{font-size:.78rem;color:rgba(255,255,255,.7);white-space:nowrap;}
.ml-pchip.on .ml-pchip-n{color:#fff;}
.ml-pchip-r{font-family:'Roboto Mono',monospace;font-size:.58rem;color:rgba(255,255,255,.32);font-variant-numeric:tabular-nums;}
.ml-pchip.on .ml-pchip-r{color:#B9A2FF;}

.ml-pdetail{border-top:1px solid #191527;padding-top:1.75rem;}
.ml-pd-head{display:flex;align-items:baseline;gap:1.6rem;flex-wrap:wrap;margin-bottom:1.35rem;}
.ml-pd-name{font-family:'Oswald',sans-serif;font-size:1.9rem;color:#fff;line-height:1;letter-spacing:-.02em;}
.ml-pd-rec{font-family:'Roboto Mono',monospace;font-size:.68rem;color:#B9A2FF;letter-spacing:.09em;font-variant-numeric:tabular-nums;}
.ml-pd-sub{font-family:'Roboto Mono',monospace;font-size:.56rem;color:rgba(255,255,255,.26);letter-spacing:.1em;}

.ml-tbl-wrap{overflow-x:auto;}
.ml-tbl{width:100%;border-collapse:collapse;min-width:620px;}
.ml-tbl th{
  font-family:'Roboto Mono',monospace;font-size:.54rem;color:rgba(255,255,255,.3);
  letter-spacing:.14em;text-transform:uppercase;text-align:left;font-weight:400;
  padding:.5rem .7rem;border-bottom:1px solid #1d1930;white-space:nowrap;
}
.ml-tbl td{
  font-size:.79rem;color:rgba(255,255,255,.58);padding:.58rem .7rem;
  border-bottom:1px solid #131020;font-variant-numeric:tabular-nums;white-space:nowrap;
}
.ml-tbl tr:hover td{background:rgba(139,92,246,.05);}
.ml-tbl .c-stat{font-family:'Roboto Mono',monospace;font-size:.66rem;color:rgba(255,255,255,.75);letter-spacing:.08em;}
.ml-tbl .c-pred{color:#B9A2FF;}
.ml-tbl .c-act{color:rgba(255,255,255,.85);}
.ml-tbl .c-diff{font-family:'Roboto Mono',monospace;color:rgba(255,255,255,.5);}


/* mosaic typography on phones — kept last so it wins over `.panel .panel-sport` above */
@media(max-width:760px){
  .panel .panel-sport{font-size:clamp(21px,6.1vw,44px);}
  .about-panel .panel-sport{font-size:clamp(17px,4.9vw,34px);}
}