/* Layout: floodlit night. A fixed WebGL particle field (ball → dust → "10" → ball) sits behind one editorial column;
   the chronicle turns into a horizontal reel on desktop. Single dark theme by design. */
:root{
  color-scheme: dark;
  /* palette after sports.ru UI tokens: black-800/700/500, mint, yellow; sky kept for Argentina */
  --night:#161616;
  --pitch:#222222;
  --pitch-2:#373737;
  --scoreboard:#111111;
  --line:rgba(255,255,255,.1);
  --line-2:rgba(255,255,255,.2);
  --ink:#ffffff;
  --ink-2:#d8d8d8;
  --mute:#9b9b9b;
  --gold:#00C78B;
  --gold-2:#CCF3DE;
  --gold-glow:rgba(0,199,139,.14);
  --mint:#00A876;
  --mint-hover:#008F64;
  --yellow:#FFC300;
  --sky:#74acdf;
  --white:#f7f7f2;
  --garnet:#c4144f;
  --blau:#2b6cd6;
  --psg-navy:#3654b8;
  --psg-red:#e2302f;
  --pink:#f5b6cd;
  --black:#1a1a1a;

  --display:"Unbounded","Manrope",system-ui,sans-serif;
  --serif:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --body:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  --r-xs:8px;
  --r-sm:12px;
  --r:16px;
  --r-lg:24px;
  --pill:100px;

  --gutter:clamp(16px,4vw,48px);
  --max:1240px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--night);color:var(--ink);
  font-family:var(--body);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:clip;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
::selection{background:var(--gold);color:var(--night)}

/* ---------- atmosphere ---------- */
#stage{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 120% 90% at 50% 40%,transparent 55%,rgba(0,0,0,.6) 100%)}
.grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{background-position:0 0}20%{background-position:-50px 37px}40%{background-position:41px -60px}60%{background-position:-33px -17px}80%{background-position:57px 49px}100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.grain{animation:none}}

main,footer{position:relative;z-index:3}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:0}

/* ---------- top bar ---------- */
.bar{position:fixed;top:0;left:0;right:0;z-index:20;
  padding:calc(env(safe-area-inset-top,0px) + 14px) var(--gutter) 14px;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  background:linear-gradient(var(--night) 10%,rgba(7,8,12,0))}
.mark{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.mark b{color:var(--gold);font-weight:500}
.bar nav{display:flex;gap:clamp(12px,2vw,28px)}
.bar nav a{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--mute);transition:color .2s}
.bar nav a:hover{color:var(--ink)}
.progress{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--gold);transform-origin:0 50%;transform:scaleX(0)}
@media (max-width:760px){.bar nav{display:none}}

/* ---------- hero ---------- */
#hero{position:relative;min-height:100svh;display:grid;align-items:end;padding-block:120px clamp(40px,8vh,80px)}
#hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 70% at 78% -5%,var(--gold-glow),transparent 70%)}
.hero-inner{position:relative;width:100%}
.title{font-family:var(--display);font-weight:900;text-transform:uppercase;
  font-size:clamp(5.4rem,22vw,13.5rem);line-height:.8;letter-spacing:-.005em;margin:.18em 0 .16em}
.title .line{display:block;overflow:hidden;padding-bottom:.05em}
.title .ch{display:inline-block;will-change:transform}
.title .l1{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.title .l2{color:var(--ink)}
.lede{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.55rem,2.7vw,2.35rem);line-height:1.15;max-width:26ch;margin:0;text-wrap:balance}
.lede em{color:var(--gold-2);font-style:italic}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 32px;margin-top:clamp(28px,5vh,48px);padding-top:16px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--mute)}
.hero-meta b{color:var(--ink);font-weight:500}
.cue{display:flex;align-items:center;gap:12px;margin-top:22px;font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.cue i{display:block;width:56px;height:1px;background:var(--line-2);position:relative;overflow:hidden}
.cue i::after{content:"";position:absolute;inset:0;background:var(--gold);transform:translateX(-100%);animation:cue 2.2s cubic-bezier(.6,0,.2,1) infinite}
@keyframes cue{60%,100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.cue i::after{animation:none;transform:none}}

/* ---------- prologue ---------- */
#prologue{padding-block:clamp(96px,18vh,200px)}
.prologue-text{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.9rem,4.4vw,3.9rem);line-height:1.1;max-width:28ch;margin:18px 0 0;text-wrap:pretty}
.prologue-text .hl{color:var(--gold-2)}

/* ---------- chapters ---------- */
.chapter{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,6vw,96px);
  padding-block:clamp(72px,13vh,150px);border-top:1px solid var(--line)}
.ch-head{position:sticky;top:96px;align-self:start}
.ch-years{font-family:var(--display);font-weight:800;font-size:clamp(3.2rem,6.6vw,6.2rem);line-height:.86;
  font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1px var(--gold);margin:14px 0 0;white-space:nowrap}
.ch-title{font-family:var(--serif);font-style:italic;font-weight:600;font-size:clamp(2rem,3.6vw,3.2rem);line-height:1.02;margin:.25em 0 0;text-wrap:balance}
.ch-body{min-width:0}
.ch-body p{max-width:62ch;margin:0 0 1.1em;color:var(--ink-2)}
.ch-body p:first-child{font-size:1.18em;line-height:1.5;color:var(--ink)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:34px 0 0;padding:0}
.fact{background:rgba(7,8,12,.92);padding:18px 18px 16px;margin:0}
.fact dt{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.fact dd{margin:6px 0 0;font-family:var(--display);font-weight:800;font-size:1.9rem;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
@media (max-width:860px){
  .chapter{grid-template-columns:1fr}
  .ch-head{position:static}
}

/* ---------- numbers ---------- */
#numbers{border-top:1px solid var(--line);padding-block:clamp(80px,14vh,160px)}
.numbers-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,6vw,96px);align-items:end}
.ten-slot{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;gap:24px;min-height:min(70vh,560px)}
.ten-slot h2{font-family:var(--serif);font-style:italic;font-weight:600;font-size:clamp(2.4rem,4.6vw,4rem);line-height:1;margin:14px 0 0}
.ten-caption{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--mute);max-width:34ch}
.ten-caption b{color:var(--gold);font-weight:500}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:0;padding:0}
.stat{background:rgba(7,8,12,.9);padding:clamp(18px,2.6vw,32px);margin:0;display:flex;flex-direction:column;gap:10px}
.stat-num{font-family:var(--display);font-weight:900;font-size:clamp(3.2rem,6.2vw,5.6rem);line-height:.85;color:var(--gold-2);font-variant-numeric:tabular-nums;margin:0}
.stat-label{font-size:15px;line-height:1.4;color:var(--ink-2);margin:0;max-width:26ch}
.asof{font-family:var(--mono);font-size:11.5px;color:var(--mute);margin-top:14px}
@media (max-width:860px){
  .numbers-grid{grid-template-columns:1fr}
  .ten-slot{min-height:0}
}
@media (max-width:420px){.stats{grid-template-columns:1fr}}

/* ---------- chronicle reel ---------- */
#chronicle{border-top:1px solid var(--line)}
.reel{padding-block:clamp(72px,12vh,120px) clamp(48px,8vh,96px)}
.reel-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap}
.reel-title h2{font-family:var(--serif);font-style:italic;font-weight:600;font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1;margin:12px 0 0}
.readout{display:flex;align-items:flex-end;gap:18px}
.reel-year{font-family:var(--display);font-weight:900;font-size:clamp(4rem,9vw,8rem);line-height:.78;font-variant-numeric:tabular-nums;color:transparent;-webkit-text-stroke:1px var(--gold);min-width:4ch}
.reel-era{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);padding-bottom:6px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chip{font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding:8px 14px;border:1px solid var(--line-2);border-radius:999px;background:transparent;color:var(--mute);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.chip:hover{color:var(--ink);border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--night);border-color:var(--ink)}
.reel-viewport{margin-top:28px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;padding-block:10px 18px}
.reel-track{display:flex;gap:18px;align-items:stretch;width:max-content;padding-inline:var(--gutter)}
.reel.is-pinned{height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;padding-block:76px 24px;box-sizing:border-box}
.reel.is-pinned .reel-viewport{overflow:hidden}

.card{flex:0 0 320px;display:flex;flex-direction:column;gap:14px;padding:22px 22px 18px;
  background:rgba(14,17,24,.94);border:1px solid var(--line);border-radius:4px;min-height:340px;box-sizing:border-box}
.card.big{flex-basis:400px;border-color:rgba(224,182,94,.38);background:linear-gradient(180deg,rgba(40,32,16,.94),rgba(14,17,24,.94) 55%)}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.04em}
.card time{color:var(--gold);font-variant-numeric:tabular-nums}
.tag{display:inline-flex;align-items:center;gap:8px;color:var(--mute);text-transform:uppercase;letter-spacing:.1em;font-size:11px}
.dot{width:10px;height:10px;border-radius:50%;flex:none;background:linear-gradient(90deg,var(--c1) 0 50%,var(--c2) 50% 100%);box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.card h3{font-family:var(--display);font-weight:800;font-size:1.85rem;line-height:.98;text-transform:uppercase;margin:0;text-wrap:balance}
.card.big h3{font-size:2.45rem}
.score{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;padding:8px 14px;background:var(--scoreboard);border:1px solid var(--line);border-radius:3px;font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;color:var(--mute)}
.score b{font-family:var(--display);font-weight:800;font-size:1.55rem;line-height:1;color:var(--ink);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.score small{font-size:11px;color:var(--gold);letter-spacing:.04em;margin-left:-2px}
.card p{font-size:15px;line-height:1.55;color:var(--ink-2);margin:0}
.watch{margin-top:auto;display:flex;align-items:center;gap:10px;padding-top:14px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--ink);transition:color .2s}
.watch:hover{color:var(--gold-2)}
.watch .play{width:0;height:0;border-left:8px solid var(--gold);border-top:5px solid transparent;border-bottom:5px solid transparent}
.watch span:last-child{margin-left:auto;color:var(--mute)}

@media (min-width:900px) and (max-height:780px){
  .reel-year{font-size:4.6rem}
  .reel-title h2{font-size:2.2rem}
  .filters{margin-top:14px}
  .reel-viewport{margin-top:16px}
  .card{min-height:300px;padding:18px 18px 14px;gap:10px}
  .card.big h3{font-size:2.1rem}
}
@media (max-width:899px){
  .reel-viewport{overflow:visible;margin-top:24px}
  .reel-track{flex-direction:column;width:auto;padding-inline:0;padding-left:22px;position:relative;gap:16px}
  .reel-track::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1px;background:linear-gradient(var(--gold),var(--line) 30%,var(--line) 70%,var(--sky))}
  .card,.card.big{flex-basis:auto;min-height:0;position:relative}
  .card::before{content:"";position:absolute;left:-23px;top:26px;width:9px;height:9px;border-radius:50%;background:var(--night);border:1px solid var(--gold)}
  .readout{display:none}
}

/* ---------- epilogue ---------- */
#epilogue{position:relative;min-height:100svh;display:grid;align-items:center;border-top:1px solid var(--line);padding-block:clamp(96px,14vh,160px)}
.epi{max-width:640px}
.epi-score{display:flex;align-items:baseline;gap:clamp(10px,2vw,22px);margin:18px 0 8px;font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(3rem,12vw,6.6rem);line-height:.85;white-space:nowrap}
.epi-score .n{color:var(--sky);font-variant-numeric:tabular-nums}
.epi-note{font-family:var(--mono);font-size:12.5px;color:var(--mute);letter-spacing:.04em}
.epi p{color:var(--ink-2);max-width:56ch}
.epi .big-line{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.15;color:var(--ink);margin-top:36px;text-wrap:balance}
.epi-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:32px 0 0}
.epi-stats div{background:rgba(7,8,12,.9);padding:14px 16px}
.epi-stats b{display:block;font-family:var(--display);font-weight:800;font-size:2.1rem;line-height:1;color:var(--sky)}
.epi-stats span{font-size:13px;color:var(--mute)}
@media (max-width:560px){.epi-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding-block:56px 64px;background:rgba(7,8,12,.94)}
.foot{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px 48px}
.foot h4{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:500;margin:0 0 14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14.5px;color:var(--ink-2)}
.foot a{text-decoration:none;border-bottom:1px solid var(--line-2)}
.foot a:hover{color:var(--gold-2);border-color:var(--gold)}
.foot small{display:block;font-size:13px;line-height:1.55;color:var(--mute)}
@media (max-width:860px){.foot{grid-template-columns:1fr}}

/* ---------- runner & chalk line ---------- */
.trail{position:absolute;left:0;top:0;width:100%;z-index:2;pointer-events:none;overflow:visible;color:var(--ink)}
.trail .pitch{fill:none;stroke:rgba(239,232,216,.075);stroke-width:1.4}
.trail .pitch circle[fill]{fill:rgba(239,232,216,.12);stroke:none}
.trail-ahead{fill:none;stroke:rgba(239,232,216,.2);stroke-width:2;stroke-dasharray:1 11;stroke-linecap:round}
.trail-done{fill:none;stroke:var(--gold);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.runner{position:fixed;left:0;top:0;z-index:18;width:112px;height:152px;pointer-events:none;transform-origin:0 0;will-change:transform}
.runner-flip{width:112px;height:152px;transform:scaleX(var(--face,1));transform-origin:48px 50%;transition:transform .28s cubic-bezier(.3,.7,.2,1)}
.runner-svg{display:block;overflow:visible;transform-origin:48px 100%}
.k-num{font-family:var(--display);font-weight:900;font-size:13px}
.runner-tag{position:absolute;left:48px;bottom:100%;transform:translate(-50%,-2px);white-space:nowrap;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);
  background:rgba(7,8,12,.8);border:1px solid var(--line-2);padding:4px 9px;border-radius:999px}
.runner-tag::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--kit,var(--gold));margin-right:7px;vertical-align:1px}
.runner::after{content:"";position:absolute;left:48px;top:62%;width:130px;height:130px;margin:-65px 0 0 -65px;border-radius:50%;border:2px solid var(--kit,var(--gold));
  transform:scale(calc(.25 + var(--burst,1) * 1.3));opacity:calc(1 - var(--burst,1));pointer-events:none}
@media (prefers-reduced-motion:reduce){.runner,.trail-done{display:none}}
.nav-stats{color:var(--gold)!important}

/* ---------- v2: motion layer ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

.loader{display:none;position:fixed;inset:0;z-index:100;background:var(--night);flex-direction:column;justify-content:flex-end;gap:18px;
  padding:var(--gutter);padding-bottom:calc(var(--gutter) + env(safe-area-inset-bottom,0px))}
.js-loading .loader{display:flex}
.loader-top{display:flex;justify-content:space-between;gap:16px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.loader-num{font-family:var(--display);font-weight:900;font-size:clamp(7rem,30vw,24rem);line-height:.78;color:var(--gold-2);font-variant-numeric:tabular-nums;margin:0}
.loader-bar{height:2px;background:var(--line);position:relative;overflow:hidden}
.loader-bar i{position:absolute;inset:0;background:var(--gold);transform-origin:0 50%;transform:scaleX(0)}

.title{perspective:900px}
.title .ch{transform-origin:50% 100%;backface-visibility:hidden}
[data-chars] .ch{display:inline-block;will-change:transform}
[data-chars] .wd{display:inline-block;white-space:nowrap}

.marquee{position:relative;z-index:3;overflow:hidden;white-space:nowrap;border-block:1px solid var(--line);padding-block:clamp(14px,2.4vw,30px);background:rgba(7,8,12,.55)}
.mq-track{display:inline-flex;align-items:center;will-change:transform}
.mq-track span{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(3.4rem,9vw,8.6rem);line-height:.95;padding-inline:.22em;color:transparent;-webkit-text-stroke:1px var(--gold)}
.mq-track span.solid{color:var(--ink);-webkit-text-stroke:0}
.mq-track i{font-style:normal;font-family:var(--display);color:var(--gold);font-size:clamp(1.6rem,3.4vw,3rem)}
.marquee.sky .mq-track span{-webkit-text-stroke-color:var(--sky)}
.marquee.sky .mq-track span.solid{color:var(--sky)}
.marquee.sky .mq-track i{color:var(--sky)}

.shot{grid-column:1/-1;margin:0 0 clamp(24px,5vh,56px);min-width:0}
.shot-mask{position:relative;overflow:hidden;aspect-ratio:16/8;background:var(--pitch);border-radius:2px}
.shot-mask img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;will-change:transform}
.shot-mask::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,8,12,0) 45%,rgba(7,8,12,.78));pointer-events:none}
.shot-label{position:absolute;left:clamp(14px,2.5vw,32px);bottom:clamp(12px,2.2vw,28px);z-index:2;font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(2.2rem,6vw,5.4rem);line-height:.85;color:var(--ink);margin:0}
.shot figcaption{display:flex;justify-content:space-between;gap:6px 20px;flex-wrap:wrap;margin-top:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.03em;color:var(--mute)}
.shot figcaption a,.frame a{text-decoration:none;border-bottom:1px solid var(--line-2)}
@media (max-width:640px){.shot-mask{aspect-ratio:4/3}}

#frames{position:relative;border-top:1px solid var(--line);padding-block:clamp(72px,12vh,120px)}
.frames-head{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.frames-head h2{font-family:var(--serif);font-style:italic;font-weight:600;font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1;margin:12px 0 0}
.tunnel-count{font-family:var(--display);font-weight:900;font-size:clamp(2.6rem,6vw,5rem);line-height:.8;color:transparent;-webkit-text-stroke:1px var(--gold);font-variant-numeric:tabular-nums;white-space:nowrap}
.tunnel{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin-top:32px}
.frame{margin:0;min-width:0}
.frame img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:2px;background:var(--pitch)}
.frame figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-family:var(--mono);font-size:12px;color:var(--ink-2)}
.frame figcaption span:last-child{color:var(--gold);white-space:nowrap}
#frames.is-tunnel{height:100vh;height:100svh;padding:0;overflow:hidden}
#frames.is-tunnel .frames-head{position:absolute;left:0;right:0;top:84px}
#frames.is-tunnel .tunnel{position:absolute;inset:0;margin:0;display:block;perspective:1000px;perspective-origin:50% 55%}
#frames.is-tunnel .frame{position:absolute;left:50%;top:56%;width:min(42vw,600px);will-change:transform,opacity}
#frames.is-tunnel .frame img{box-shadow:0 40px 90px rgba(0,0,0,.65)}
@media (max-width:760px){#frames.is-tunnel .frame{width:80vw}}

.card-img{margin:-22px -22px 0;aspect-ratio:16/10;overflow:hidden;border-radius:4px 4px 0 0;background:var(--scoreboard)}
.card-img img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.3) contrast(1.05)}
.reel.is-pinned .reel-viewport{perspective:1600px}
.reel.is-pinned .card{will-change:transform}
.stats{perspective:1200px}

.thanks{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(4rem,15vw,14rem);line-height:.82;margin:clamp(48px,10vh,120px) 0 0;
  color:transparent;-webkit-text-stroke:1px var(--sky);
  background-image:linear-gradient(90deg,var(--sky) 0 50%,transparent 50% 100%);background-size:200% 100%;background-position:0 0;
  -webkit-background-clip:text;background-clip:text}

.cursor{position:fixed;left:0;top:0;z-index:60;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--gold);pointer-events:none;display:none;align-items:center;justify-content:center;
  transition:width .3s cubic-bezier(.2,.8,.2,1),height .3s cubic-bezier(.2,.8,.2,1),margin .3s cubic-bezier(.2,.8,.2,1),background-color .3s}
.has-cursor .cursor{display:flex}
.cursor.is-big{width:86px;height:86px;margin:-43px 0 0 -43px;background:rgba(239,232,216,.94)}
.cursor-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--night);opacity:0;transition:opacity .2s}
.cursor.is-big .cursor-label{opacity:1}
@media (prefers-reduced-motion:reduce){.has-cursor .cursor{display:none}}

/* ---------- v3: sports-style tokens, type and rounded geometry ---------- */
body{font-size:16.5px;line-height:1.6}
.grain{opacity:.045}
.eyebrow{font-weight:700;letter-spacing:.12em;font-size:12px;color:var(--gold)}

/* top bar: 56px dark strip */
.bar{height:calc(56px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) var(--gutter) 0;display:block;
  background:rgba(22,22,22,.88);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.bar-in{max-width:var(--max);height:56px;margin-inline:auto;display:flex;align-items:center;gap:16px}
.bar .mark,.site-foot .mark{display:inline-flex;align-items:center;gap:10px;font-family:var(--body);font-weight:800;font-size:15px;letter-spacing:0;text-transform:none;color:var(--ink);text-decoration:none;white-space:nowrap}
.mark-badge{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--gold);color:#0b2a1f;font-family:var(--display);font-weight:800;font-size:11.5px;letter-spacing:-.02em}
.bar .bar-nav{display:flex;gap:2px;margin-left:auto}
.bar .bar-nav a{font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2);text-decoration:none;padding:8px 12px;border-radius:var(--pill);transition:background .2s,color .2s}
.bar .bar-nav a:hover{background:var(--pitch-2);color:var(--ink)}
.bar-cta{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 18px;border-radius:var(--pill);background:var(--mint);color:#fff;font-family:var(--body);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;transition:background .2s,transform .2s}
.bar-cta:hover{background:var(--mint-hover)}
.bar-cta:active{transform:scale(.97)}
.progress{height:2px;border-radius:0 2px 2px 0}
@media (max-width:980px){.bar .bar-nav{display:none}.bar-cta{margin-left:auto}}

/* type */
.title{font-family:var(--display);font-weight:800;font-size:clamp(3.6rem,16vw,11rem);line-height:.92;letter-spacing:-.035em;margin:.22em 0 .2em}
.title .l1{-webkit-text-stroke:2px var(--ink)}
.lede{font-family:var(--body);font-style:normal;font-weight:600;font-size:clamp(1.25rem,2.1vw,1.8rem);line-height:1.3;letter-spacing:-.015em;max-width:32ch}
.lede em{font-style:normal;color:var(--gold)}
.prologue-text{font-family:var(--body);font-style:normal;font-weight:700;font-size:clamp(1.6rem,3.6vw,3.1rem);line-height:1.2;letter-spacing:-.03em;max-width:30ch}
.prologue-text .hl{color:var(--gold)}
.ch-title,.ten-slot h2,.reel-title h2,.frames-head h2{font-family:var(--display);font-style:normal;font-weight:700;letter-spacing:-.025em;line-height:1.08}
.ch-title{font-size:clamp(1.5rem,2.6vw,2.3rem)}
.ten-slot h2,.reel-title h2,.frames-head h2{font-size:clamp(1.7rem,3.2vw,2.8rem)}
.ch-years{font-family:var(--display);font-weight:800;letter-spacing:-.04em;font-size:clamp(2.4rem,5vw,4.6rem);-webkit-text-stroke:1.5px var(--gold)}
.ch-body p:first-child{font-weight:600;letter-spacing:-.01em}
.epi .big-line{font-family:var(--body);font-style:normal;font-weight:700;letter-spacing:-.025em}
.stat-num,.fact dd,.reel-year,.loader-num,.epi-score,.epi-stats b,.card h3,.shot-label,.tunnel-count,.thanks,.mq-track span,.score b,.k-num{font-family:var(--display)}
.stat-num{font-weight:800;font-size:clamp(2.4rem,4.6vw,4rem);letter-spacing:-.04em;color:var(--ink)}
.fact dd{font-weight:700;font-size:1.35rem;letter-spacing:-.02em}
.reel-year{font-weight:800;font-size:clamp(2.8rem,6.4vw,5.4rem);letter-spacing:-.04em;-webkit-text-stroke:1.5px var(--gold)}
.loader-num{font-weight:800;font-size:clamp(5rem,22vw,17rem);letter-spacing:-.05em;color:var(--gold)}
.epi-score{font-weight:800;font-size:clamp(2.2rem,8.4vw,5rem);letter-spacing:-.04em}
.epi-stats b{font-weight:800;font-size:1.7rem;letter-spacing:-.03em}
.card h3{font-weight:700;font-size:1.3rem;line-height:1.12;letter-spacing:-.02em;text-transform:none}
.card.big h3{font-size:1.65rem}
.shot-label{font-weight:800;font-size:clamp(1.7rem,4.4vw,4rem);letter-spacing:-.04em}
.tunnel-count{font-weight:800;letter-spacing:-.03em;-webkit-text-stroke:1.5px var(--gold)}
.thanks{font-weight:800;font-size:clamp(2.8rem,10.5vw,9.5rem);line-height:.98;letter-spacing:-.05em;-webkit-text-stroke:1.5px var(--sky)}
.mq-track span{font-weight:800;font-size:clamp(2.4rem,6.6vw,6rem);letter-spacing:-.04em;padding-inline:.3em}
.score b{font-weight:700;font-size:1.2rem;letter-spacing:-.02em}
.hero-meta,.cue,.ten-caption,.asof,.reel-era,.chip,.card-top,.tag,.score,.watch,.epi-note,.foot h4,.loader-top,.shot figcaption,.frame figcaption,.runner-tag,.cursor-label,.fact dt,.stat-label{font-family:var(--body);letter-spacing:.01em}
.hero-meta{font-size:14px;font-weight:500}
.hero-meta b{font-weight:800}
.fact dt,.loader-top,.tag,.cue,.reel-era,.runner-tag,.cursor-label{font-weight:700;letter-spacing:.07em}
.card-top{font-weight:700;font-size:12.5px}
.watch{font-weight:700;letter-spacing:.04em}
.chip{font-weight:600;font-size:13px;letter-spacing:0}

/* rounded geometry everywhere */
.facts,.stats,.epi-stats{gap:10px;background:none;border:0}
.fact,.stat,.epi-stats div{border-radius:var(--r);background:rgba(34,34,34,.92);border:1px solid var(--line)}
.stat{padding:clamp(18px,2.4vw,28px)}
.card{border-radius:20px;background:rgba(34,34,34,.96);border-color:var(--line)}
.card.big{background:linear-gradient(180deg,rgba(0,168,118,.24),rgba(34,34,34,.96) 58%);border-color:rgba(0,199,139,.4)}
.card-img{border-radius:20px 20px 0 0}
.score{border-radius:var(--r-sm);background:var(--scoreboard)}
.shot-mask{border-radius:var(--r-lg)}
.frame img{border-radius:var(--r)}
.marquee{margin-inline:var(--gutter);border-radius:var(--r-lg);border:1px solid var(--line);background:rgba(34,34,34,.55)}
.loader-bar,.loader-bar i{border-radius:var(--pill)}
.chip{border-radius:var(--pill)}
.chip[aria-pressed="true"]{background:var(--gold);color:#0b2a1f;border-color:var(--gold)}
.reel.is-pinned .reel-viewport{padding-inline:4px}
.cue i,.cue i::after{border-radius:var(--pill)}
.runner-tag{border-radius:var(--pill)}

/* footer, laid out like a sports portal footer */
.site-foot{position:relative;z-index:3;background:var(--night);border-top:1px solid var(--line);padding-block:48px 32px}
.foot-top{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.foot-lead{margin:0;color:var(--mute);font-size:14px;max-width:48ch}
.foot-top .bar-cta{margin-left:auto}
.site-foot .foot{padding-block:28px}
.site-foot .foot h4{color:var(--ink);font-size:14px;text-transform:none;letter-spacing:0;font-weight:700;margin-bottom:14px}
.site-foot .foot ul{gap:10px;font-size:14px;color:var(--mute)}
.site-foot .foot a{border:0;color:var(--mute);text-decoration:none;transition:color .2s}
.site-foot .foot a:hover{color:var(--ink)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px 24px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--mute)}
.credits summary{cursor:pointer;color:var(--ink-2);font-weight:600;list-style:none}
.credits summary::-webkit-details-marker{display:none}
.credits summary::after{content:" +";color:var(--gold)}
.credits[open] summary::after{content:" −"}
.credits ul{columns:2 260px;column-gap:28px;margin:14px 0 0;padding:0;list-style:none;font-size:12.5px;line-height:1.45}
.credits li{break-inside:avoid;margin-bottom:6px}
.credits a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--line-2)}

/* the loader: Leo keeps the ball up while the page loads (an animated SVG drawn as a background) */
.loader::after{content:"";position:absolute;right:var(--gutter);bottom:calc(var(--gutter) + 30px + env(safe-area-inset-bottom,0px));width:clamp(110px,12vw,165px);aspect-ratio:116/156;pointer-events:none;filter:drop-shadow(0 18px 30px rgba(0,0,0,.5));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-44 -150 116 156' width='116' height='156'%3E%3Cdefs%3E%3CclipPath id='ld-tc'%3E%3Cpath d='M-11,-64 L12,-64 L14,-98 Q5,-106 -8,-101 Z'/%3E%3C/clipPath%3E%3CradialGradient id='ld-bg' cx='35%25' cy='30%25' r='70%25'%3E%3Cstop offset='0' stop-color='%23ffffff'/%3E%3Cstop offset='1' stop-color='%23bfc3c9'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='8' cy='2' rx='30' ry='4.2' fill='rgba(0,0,0,.5)'/%3E%3Cg transform='translate(-6,-99)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' values='16;-8;16' keyTimes='0;.5;1' calcMode='spline' keySplines='.4 0 .6 1;.4 0 .6 1' dur='1.2s' repeatCount='indefinite'/%3E%3Crect x='-4' y='-2' width='8' height='12' rx='4' fill='%237a0032'/%3E%3Crect x='-3.4' y='7' width='6.8' height='13' rx='3.4' fill='%23b98b68'/%3E%3Cg transform='translate(0,18) rotate(-28)'%3E%3Crect x='-3.1' y='0' width='6.2' height='17' rx='3.1' fill='%23b98b68'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(-4,-62) rotate(5)'%3E%3Cg%3E%3Crect x='-5.6' y='0' width='11.2' height='33' rx='5.5' fill='%23b98b68'/%3E%3Cpath d='M-6.6,-2 h13.2 v17 q-6.6,3 -13.2,0 z' fill='%23003a74'/%3E%3Cg transform='translate(0,31)'%3E%3Cg%3E%3Crect x='-4.6' y='0' width='9.2' height='30' rx='4.4' fill='%23b98b68'/%3E%3Crect x='-4.8' y='7' width='9.6' height='21' rx='3.6' fill='%23003a74'/%3E%3Cpath d='M-5,26 h9 q7,0 9,3.4 q0.6,2.6 -2,2.6 h-16 z' fill='%23050505'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg%3E%3Cg clip-path='url(%23ld-tc)'%3E%3Crect x='-14' y='-110' width='32' height='50' fill='%23a50044'/%3E%3Crect x='-10' y='-110' width='5' height='50' fill='%23004d98'/%3E%3Crect x='0' y='-110' width='5' height='50' fill='%23004d98'/%3E%3Crect x='10' y='-110' width='5' height='50' fill='%23004d98'/%3E%3C/g%3E%3Ctext x='1.5' y='-75' text-anchor='middle' font-family='Arial Black,Arial,sans-serif' font-weight='800' font-size='13' fill='%23f6d36b'%3E10%3C/text%3E%3Cpath d='M-11.5,-66 h24 l1.4,10 h-26.6 z' fill='%23004d98'/%3E%3Crect x='3' y='-109' width='7' height='7' rx='3' fill='%23e2b48f'/%3E%3Cg transform='translate(6.5,-108)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' values='0;-5;0' keyTimes='0;.5;1' calcMode='spline' keySplines='.4 0 .6 1;.4 0 .6 1' dur='1.2s' repeatCount='indefinite'/%3E%3Cg transform='translate(-6.5,108)'%3E%3Ccircle cx='7.5' cy='-116.5' r='9.6' fill='%23e2b48f'/%3E%3Cpath d='M-2.4,-118 q1,-11 11,-10.6 q8.4,0.6 9.6,7.4 q-4.2,-2.6 -9,-2 q-5,-0.2 -6.6,5.2 q-1.8,4 -3,8.4 q-2.6,-3.8 -2,-8.4 z' fill='%233a2618'/%3E%3Cpath d='M8,-110 q6,1.4 9.2,-4.4 q0.2,6.8 -4.6,9.4 q-5.6,2.4 -10.4,-1.8 q-1.6,-1.6 -1.2,-4.2 q3,1.6 7,1 z' fill='%233a2618'/%3E%3Ccircle cx='13.6' cy='-118.2' r='1.1' fill='%231a1a1a'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(9,-99)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' values='-18;14;-18' keyTimes='0;.5;1' calcMode='spline' keySplines='.4 0 .6 1;.4 0 .6 1' dur='1.2s' repeatCount='indefinite'/%3E%3Crect x='-4' y='-2' width='8' height='12' rx='4' fill='%23a50044'/%3E%3Crect x='-3.4' y='7' width='6.8' height='13' rx='3.4' fill='%23e2b48f'/%3E%3Cg transform='translate(0,18) rotate(-28)'%3E%3Crect x='-3.1' y='0' width='6.2' height='17' rx='3.1' fill='%23e2b48f'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(3,-62)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' values='-50;6;-14;-50' keyTimes='0;.3;.65;1' calcMode='spline' keySplines='.4 0 .6 1;.4 0 .6 1;.3 0 .4 1' dur='1.2s' repeatCount='indefinite'/%3E%3Crect x='-5.6' y='0' width='11.2' height='33' rx='5.5' fill='%23e2b48f'/%3E%3Cpath d='M-6.6,-2 h13.2 v17 q-6.6,3 -13.2,0 z' fill='%23004d98'/%3E%3Cg transform='translate(0,31)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='rotate' values='0;0;52;0' keyTimes='0;.3;.65;1' calcMode='spline' keySplines='.4 0 .6 1;.4 0 .6 1;.3 0 .4 1' dur='1.2s' repeatCount='indefinite'/%3E%3Crect x='-4.6' y='0' width='9.2' height='30' rx='4.4' fill='%23e2b48f'/%3E%3Crect x='-4.8' y='7' width='9.6' height='21' rx='3.6' fill='%23004d98'/%3E%3Cpath d='M-5,26 h9 q7,0 9,3.4 q0.6,2.6 -2,2.6 h-16 z' fill='%23151515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3Cg transform='translate(52,-34)'%3E%3Cg%3E%3CanimateTransform attributeName='transform' type='translate' values='0 0;0 -80;0 0' keyTimes='0;.5;1' calcMode='spline' keySplines='.17 .67 .5 1;.5 0 .83 .33' dur='1.2s' repeatCount='indefinite' additive='sum'/%3E%3CanimateTransform attributeName='transform' type='rotate' from='0' to='-360' dur='1.2s' repeatCount='indefinite' additive='sum'/%3E%3Ccircle r='8' fill='url(%23ld-bg)' stroke='%2315171b' stroke-width='.7'/%3E%3Cg fill='%231a1d22' transform='scale(1.2)'%3E%3Cpolygon points='0,-2.6 2.5,-0.8 1.5,2.1 -1.5,2.1 -2.5,-0.8'/%3E%3Cpolygon points='0,-6.6 2.2,-5.2 -2.2,-5.2'/%3E%3Cpolygon points='6.3,-2 5.4,1.8 4.4,-1'/%3E%3Cpolygon points='-6.3,-2 -5.4,1.8 -4.4,-1'/%3E%3Cpolygon points='3.6,5.6 0.8,6.5 2.4,4'/%3E%3Cpolygon points='-3.6,5.6 -0.8,6.5 -2.4,4'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:600px){.loader::after{width:34vw;bottom:calc(var(--gutter) + 34px + env(safe-area-inset-bottom,0px))}.loader-top span:last-child{display:none}}
@media (prefers-reduced-motion:reduce){.loader::after{display:none}}