/* 2026 scroll story. Builds on ../profiles.css (Night Circuit tokens).
   Components: .chapter (one screen), .steps (pinned, scroll-advanced stage),
   .panel (the one card style), .pick (a selectable list that drives a detail panel).
   Motion: reveals once per chapter, rAF count-ups with exponential ease-out,
   clips autoplay muted only while their step is on screen.
   prefers-reduced-motion shows every final state and never autoplays video. */
.story-page{--ease:cubic-bezier(.16,1,.3,1);--top:64px;--row:clamp(22px,3.05svh,34px)}
.story-page main{max-width:none;padding:0;overflow-x:clip}

/* Top bar, progress, chapter dots */
.story-top{position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;gap:.5rem 2rem;flex-wrap:wrap;padding:.75rem var(--gutter);background:rgba(7,5,26,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-soft)}
.story-top .brand{font-size:22px}
.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left}
.chapters{position:fixed;right:1rem;top:50%;transform:translateY(-50%);z-index:25;display:flex;flex-direction:column;gap:.45rem}
.chapters a{position:relative;display:block;width:24px;height:24px}
.chapters a::before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--line);transition:background .3s,transform .3s var(--ease)}
.chapters a.active::before{background:var(--gold);transform:scale(1.5)}
.chapters a span{position:absolute;right:30px;top:50%;transform:translate(6px,-50%);white-space:nowrap;font-size:13px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:.15rem .55rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s var(--ease)}
.chapters a:hover span,.chapters a:focus-visible span{opacity:1;transform:translate(0,-50%)}

/* Shared type and components */
.chapter{min-height:100svh;max-width:1200px;margin:0 auto;padding:calc(var(--top) + 3rem) calc(var(--gutter) + 2.5rem) 3.5rem var(--gutter);display:flex;flex-direction:column;justify-content:center;position:relative}
.chapter h2,.stage-title{font-size:clamp(2.4rem,6vw,4.6rem);line-height:.98;font-style:italic;font-weight:700;letter-spacing:-.02em;font-stretch:condensed;font-variation-settings:"wdth" 80;margin:0}
.lede{font-size:clamp(1rem,1.4vw,1.2rem);color:var(--muted);max-width:50ch;margin:.9rem 0 1.6rem}
.hint{font-size:13px;color:var(--muted);margin:.6rem 0 0}
.big-count{color:var(--gold);font-variant-numeric:tabular-nums}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:1.1rem 1.2rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
.in .reveal,.reveal.in{opacity:1;transform:none}
.label{display:block;font-size:13px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;gap:.4rem;font-size:13px;border:1px solid var(--line);border-radius:999px;padding:.15rem .65rem;color:var(--ink)}
.chip.gold{border-color:#6b5412;color:var(--gold)}
.ico{width:34px;height:28px;object-fit:contain;flex:none}
.split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:2rem 3.5rem;align-items:center}
.split-side{min-width:0}

/* Detail panel (drinks, items) */
.detail{min-height:11.5rem}
.detail-head{display:flex;align-items:center;gap:.9rem}
.detail-head img{width:56px;height:56px;object-fit:contain}
.detail-name{font-family:var(--display);font-size:1.7rem;font-weight:700;font-style:italic;line-height:1.1}
.detail-name a{color:var(--ink);text-decoration:none}
.detail-name a:hover{color:var(--cyan)}
.detail-value{font-family:var(--display);font-size:2.4rem;font-weight:700;color:var(--gold);line-height:1;margin:.6rem 0 .2rem;font-variant-numeric:tabular-nums}
.detail-list{list-style:none;margin:.8rem 0 0;padding:0;display:grid;gap:.3rem}
.detail-list li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:.6rem;font-size:14px;padding:.2rem 0;border-bottom:1px solid var(--line-soft)}
.detail-list li b{font-family:var(--display);font-size:1.05rem;font-variant-numeric:tabular-nums;text-align:right}
.detail-list li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail-list .sub{color:var(--muted);font-size:12px}

/* Hero */
.hero{display:block;padding-top:calc(var(--top) + 6svh)}
.hero-copy{position:relative;z-index:1;max-width:760px}
.hero h1{font-size:clamp(3.1rem,9.5vw,8rem);line-height:.9}
.hero h1 span{display:block;color:var(--pink)}
.hero-stats{display:flex;flex-wrap:wrap;gap:1.1rem 2.6rem;margin:0 0 2.2rem}
.hero-stats div{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(300ms + var(--i) * 110ms)}
.in .hero-stats div{opacity:1;transform:none}
.hero-stats dd{font-size:clamp(2.2rem,4.6vw,3.4rem)}
.hero-stats div:first-child dd{color:var(--gold)}
.scroll-cue{color:var(--muted);font-size:14px;letter-spacing:.04em}
.scroll-cue span{display:inline-block;animation:nudge 1.8s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.hero-items{position:absolute;top:calc(var(--top) + 2rem);bottom:2rem;right:0;width:min(46%,560px);pointer-events:none}
.hero-items img{position:absolute;width:var(--s);height:auto;opacity:0;transform:scale(.3) rotate(-20deg);transition:opacity .7s var(--ease),transform 1s var(--ease);transition-delay:calc(var(--i) * 90ms)}
.in .hero-items img{opacity:.95;transform:none;animation:float 6s ease-in-out calc(1.4s + var(--i) * -.7s) infinite}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -10px}}

/* Bar lists (drinks, out front, qualifying). .pick rows are buttons. */
.hbars{list-style:none;margin:0;padding:0;display:grid;gap:clamp(2px,.45svh,6px)}
.hbars li{opacity:0;transform:translateX(-16px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i) * 45ms)}
.in .hbars li{opacity:1;transform:none}
.hbars .row{display:grid;grid-template-columns:2em minmax(6rem,9rem) minmax(0,1fr) 5em;align-items:center;gap:.8rem;width:100%;height:var(--row);min-height:0;padding:0 .5rem;border:1px solid transparent;border-radius:8px;background:none;color:var(--ink);font-weight:400;text-align:left;text-decoration:none}
.hbars button.row{cursor:pointer}
.hbars button.row:hover{background:var(--surface);border-color:var(--line)}
.hbars button.row[aria-pressed=true]{background:var(--surface-2);border-color:var(--gold)}
.hbars .rank{font-family:var(--display);font-weight:700;color:var(--muted);font-size:1rem}
.hbars .who{font-family:var(--display);font-size:1.1rem;font-weight:650;font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbars .track{height:calc(var(--row) * .42);max-height:14px;border-radius:3px;background:var(--line-soft);overflow:hidden}
.hbars .track i{display:block;height:100%;width:100%;border-radius:3px;background:var(--bar,var(--cyan));transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease);transition-delay:calc(250ms + var(--i) * 60ms)}
.in .hbars .track i{transform:scaleX(var(--v))}
.hbars .val{font-family:var(--display);font-weight:700;font-size:1.15rem;text-align:right;font-variant-numeric:tabular-nums}
.drink-bars{--bar:var(--purple)}
.drink-bars li:first-child .val{color:var(--purple)}
.front-bars{--bar:var(--gold);max-width:900px}
.front-bars li:first-child .val{color:var(--gold)}
.qual-bars{max-width:900px}
.qual-bars li.finalist{--bar:var(--gold)}
.qual-bars li.cut{border-bottom:2px solid #6b5412;padding-bottom:clamp(2px,.5svh,6px)}

/* Pinned steps */
.steps{position:relative;height:calc(var(--steps,5) * 80svh + 100svh)}
.stage{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.stage-inner{width:100%;max-width:1200px;margin:0 auto;padding:calc(var(--top) + 1.4rem) calc(var(--gutter) + 2.5rem) 1.6rem var(--gutter)}

/* Moments theater */
.moments-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.1rem}
.sound{min-height:40px;padding:.35rem .9rem;border-radius:999px;font-size:14px;background:var(--surface)}
.sound svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sound .spk{fill:currentColor}
.sound .on{display:none}.sound[aria-pressed=true] .on{display:inline}.sound[aria-pressed=true] .off{display:none}
.sound[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}
.theater{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:1.6rem 2.2rem;align-items:center}
.screen{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;border:1px solid var(--line)}
.theater .screen{width:100%;max-height:calc(100svh - var(--top) - 13rem);margin:0 auto}
.screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.play{position:absolute;left:1rem;bottom:1rem;width:56px;height:56px;border-radius:50%;padding:0;background:rgba(7,5,26,.8);border-color:var(--gold);color:var(--gold)}
.play svg{width:26px;height:26px;fill:currentColor;stroke:none;margin-left:3px}
.screen.playing .play{opacity:0;pointer-events:none}
.moment-copy{min-width:0}
.moment-copy .chip{margin-bottom:.8rem}
.moment-copy h3{font-family:var(--display);font-size:clamp(1.6rem,2.6vw,2.3rem);font-style:italic;font-weight:700;line-height:1.05;margin:0 0 .8rem}
.moment-value{font-family:var(--display);font-size:clamp(2.6rem,5.5vw,4.4rem);font-weight:700;color:var(--gold);line-height:.95;font-stretch:condensed;font-variation-settings:"wdth" 82;font-variant-numeric:tabular-nums}
.moment-copy .label{margin:.3rem 0 1rem}
.moment-copy p{color:var(--ink);margin:0 0 1rem;max-width:44ch}
.moment-meta{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.moment-meta a{font-weight:600}
.moment-copy.swap{animation:swap .5s var(--ease)}
@keyframes swap{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.moment-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem;margin-top:1.1rem}
.moment-tabs button{display:grid;grid-template-columns:64px minmax(0,1fr);align-items:center;gap:.6rem;min-height:52px;padding:.35rem .5rem;text-align:left;font-weight:500;font-size:13px;background:var(--surface);border-radius:10px;color:var(--muted)}
.moment-tabs img{width:64px;height:36px;object-fit:cover;border-radius:5px}
.moment-tabs span{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.25}
.moment-tabs button[aria-pressed=true]{border-color:var(--gold);color:var(--ink);background:var(--surface-2)}

/* Items */
.item-cloud{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.item-cloud li{opacity:0;transform:scale(.7);transition:opacity .6s var(--ease),transform .8s var(--ease);transition-delay:calc(200ms + var(--i) * 45ms)}
.in .item-cloud li{opacity:1;transform:none}
.item-cloud button{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:.7rem;align-items:center;justify-items:start;width:100%;min-height:calc(var(--row) * 1.9);padding:.35rem .6rem;background:none;border:1px solid transparent;border-radius:10px;color:var(--ink);font-weight:400;text-align:left}
.item-cloud button:hover{background:var(--surface);border-color:var(--line)}
.item-cloud button[aria-pressed=true]{background:var(--surface-2);border-color:var(--gold)}
.item-cloud img{width:var(--s);height:var(--s);object-fit:contain;grid-row:span 2}
.item-cloud b{font-family:var(--display);font-size:1.5rem;line-height:1;font-variant-numeric:tabular-nums}
.item-cloud span{font-size:13px;color:var(--muted);line-height:1.2}

/* What each place gets */
.places-inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:2rem 3rem;align-items:center}
.place-pick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;max-width:300px}
.place-pick button{min-height:48px;padding:.3rem;background:transparent;border-color:var(--line-soft)}
.place-pick button img{height:26px;width:auto}
.place-pick button[aria-pressed=true]{border-color:var(--gold);background:var(--surface-2)}
.place-show{min-width:0}
.place-big{height:96px;margin-bottom:.8rem}
.place-big img{height:96px;width:auto;animation:pop .6s var(--ease)}
@keyframes pop{from{opacity:0;transform:scale(.5) rotate(-10deg)}to{opacity:1;transform:none}}
.pbars{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.pbars li{display:grid;grid-template-columns:40px minmax(6.5rem,9rem) minmax(0,1fr) 3em;align-items:center;gap:.7rem}
.pbars img{width:40px;height:40px;object-fit:contain}
.pbars .name{font-size:15px}
.pbars .track{height:12px;border-radius:3px;background:var(--line-soft);overflow:hidden}
.pbars .track i{display:block;height:100%;background:var(--cyan);border-radius:3px;width:calc(var(--v) * 100%);transition:width .7s var(--ease)}
.pbars li:first-child .track i{background:var(--gold)}
.pbars .pct{font-family:var(--display);font-weight:700;font-size:1.1rem;text-align:right;font-variant-numeric:tabular-nums}
.place-line{color:var(--muted);margin:1rem 0 0;min-height:3em;font-size:14px}

/* Courses */
.course-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.3rem}
.course-grid li{opacity:0;transform:translateY(18px) scale(.9);transition:opacity .6s var(--ease),transform .8s var(--ease);transition-delay:calc(150ms + var(--i) * 35ms)}
.in .course-grid li{opacity:1;transform:none}
.course-grid button{display:flex;flex-direction:column;align-items:center;gap:.15rem;width:100%;min-height:0;padding:.4rem .2rem;background:none;border:1px solid transparent;border-radius:10px;color:var(--muted);font-weight:500;font-size:12px;line-height:1.2}
.course-grid button img{width:clamp(60px,9svh,86px);height:clamp(48px,7svh,68px);object-fit:contain;transition:transform .3s var(--ease)}
.course-grid button:hover img,.course-grid button[aria-pressed=true] img{transform:scale(1.08)}
.course-grid button:hover{color:var(--ink)}
.course-grid button[aria-pressed=true]{background:var(--surface-2);border-color:var(--gold);color:var(--ink)}
.course-grid .times{color:var(--gold);font-weight:700}
.course-preview{padding:0;overflow:hidden}
.course-shot{position:relative;aspect-ratio:480/290;background:#000}
.course-shot img.shot{width:100%;height:100%;object-fit:cover;display:block;animation:fade .45s var(--ease)}
.course-shot img.badge{position:absolute;left:.8rem;bottom:-1.6rem;width:84px;height:68px;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(0,0,0,.6))}
@keyframes fade{from{opacity:.2;transform:scale(1.03)}to{opacity:1;transform:none}}
.course-info{padding:1.8rem 1.1rem 1rem}
.course-info h3{font-family:var(--display);font-size:1.5rem;font-style:italic;margin:0 0 .3rem}
.course-info .meta{font-size:14px;color:var(--muted);margin:0 0 .5rem}
.course-info ol{list-style:none;margin:0;padding:0;display:grid;gap:.2rem;font-size:14px}
.course-info li{display:flex;align-items:center;gap:.5rem}
.course-info li .place{height:20px}

/* Finals board */
.finals-head{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem 2rem;flex-wrap:wrap}
.finals-head .lede{margin:0 0 .3rem;min-height:1.6em}
.board-wrap{--brow:clamp(36px,6.2svh,54px);--cols:minmax(6.5rem,1.4fr) repeat(6,minmax(0,1fr)) 4.2rem;margin-top:1.2rem}
.board-head{display:grid;grid-template-columns:var(--cols);align-items:end;gap:.4rem;padding-bottom:.5rem;border-bottom:1px solid var(--line)}
.board-head .rc{text-align:center;opacity:.25;transition:opacity .5s}
.board-head .rc.on{opacity:1}
.board-head .rc img{width:clamp(40px,7svh,62px);height:clamp(32px,5.4svh,48px);object-fit:contain;display:block;margin:0 auto}
.board-head .rc span{font-size:12px;color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.board-head .tot{text-align:right;font-size:13px;color:var(--muted)}
.board{position:relative;height:calc(8 * var(--brow))}
.brow{position:absolute;left:0;right:0;top:0;height:var(--brow);display:grid;grid-template-columns:var(--cols);gap:.4rem;align-items:center;border-bottom:1px solid var(--line-soft);transform:translateY(calc(var(--rank) * var(--brow)));transition:transform .8s var(--ease)}
.brow .who{font-family:var(--display);font-size:1.15rem;font-weight:650;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);text-decoration:none}
.brow .cell{display:flex;justify-content:center}
.brow .cell img{height:calc(var(--brow) * .5);width:auto;opacity:0;transform:scale(.3) rotate(-12deg);transition:opacity .4s var(--ease),transform .7s var(--ease)}
.brow .cell.on img{opacity:1;transform:none}
.brow .total{font-family:var(--display);font-size:1.5rem;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.brow.lead .total,.brow.lead .who{color:var(--gold)}

/* Champion */
.champion h2 span{color:var(--gold)}
.champ-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:2rem 3rem;align-items:end;margin:.4rem 0 2rem}
.podium-rise{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:.8rem}
.podium-rise li{display:flex;flex-direction:column;align-items:center;gap:.6rem;min-width:0}
.podium-rise li:nth-child(1){order:2}.podium-rise li:nth-child(2){order:1}.podium-rise li:nth-child(3){order:3}
.podium-rise .name{font-family:var(--display);font-size:1.3rem;font-weight:700;font-style:italic;color:var(--ink);text-align:center}
.podium-rise .name a{color:inherit;text-decoration:none}
.podium-rise .name a:hover{color:var(--cyan)}
.podium-rise li:nth-child(1) .name{font-size:1.8rem;color:var(--gold)}
.podium-rise .block{width:100%;height:var(--h);border-radius:10px 10px 0 0;background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line);border-bottom:0;display:flex;flex-direction:column;align-items:center;padding-top:.9rem;transform:scaleY(0);transform-origin:bottom;transition:transform 1.2s var(--ease);transition-delay:calc(400ms + var(--d) * 250ms)}
.podium-rise li:nth-child(1) .block{border-color:#6b5412}
.in .podium-rise .block{transform:none}
.podium-rise .block img{height:48px;width:auto}
.podium-rise .pts{font-family:var(--display);font-size:1.2rem;font-weight:700;margin-top:.4rem}
.crown{padding:0;overflow:hidden;margin:0}
.crown .screen{border:0;border-radius:0}
.crown figcaption{padding:.7rem 1rem;font-size:14px;color:var(--muted)}
.cta{display:flex;gap:1rem;flex-wrap:wrap}
.cta a{display:inline-flex;align-items:center;min-height:48px;padding:.7rem 1.4rem;border:1px solid var(--line);border-radius:8px;color:var(--ink);text-decoration:none;font-weight:600}
.cta a:hover{border-color:var(--cyan)}
.cta a.cta-main{background:var(--gold);border-color:var(--gold);color:var(--bg)}
.cta a.cta-main:hover{background:#ffdc70}
.credit-line{font-size:12px;color:var(--muted);margin-top:2.4rem;max-width:none}

/* Responsive */
@media(max-width:1000px){
  .split,.theater,.places-inner,.champ-grid{grid-template-columns:minmax(0,1fr)}
  .split{gap:1.2rem}
  .detail{min-height:0}
  .moment-tabs button{grid-template-columns:1fr;justify-items:center;padding:.3rem}
  .moment-tabs span{display:none}
  .moment-tabs img{width:100%;height:auto;aspect-ratio:16/9}
  .theater .screen{max-height:none}
  .hero-items{opacity:.28;width:100%;left:0}
  .hero-items img{width:calc(var(--s) * .6)}
}
@media(max-width:700px){
  .story-page{--top:96px;--row:30px}
  .chapters{display:none}
  .story-top{padding:.6rem var(--gutter);gap:.2rem 1rem}
  .story-top .primary-nav{gap:1rem;font-size:14px}
  .chapter{padding:calc(var(--top) + 1.5rem) var(--gutter) 3rem}
  .stage-inner{padding:calc(var(--top) + .6rem) var(--gutter) 1rem}
  .hbars .row{grid-template-columns:1.6em minmax(4.8rem,6.5rem) minmax(0,1fr) 4.2em;gap:.5rem;padding:0 .3rem}
  .hbars .who{font-size:1rem}
  .hbars .val{font-size:1rem}
  .moments-head{margin-bottom:.6rem}
  .theater{gap:.8rem}
  .moment-copy .chip{margin-bottom:.4rem}
  .moment-copy h3{margin-bottom:.3rem;font-size:1.4rem}
  .moment-copy p{font-size:14px;margin-bottom:.4rem}
  .moment-value{font-size:2.1rem}
  .moment-copy .label{margin:.1rem 0 .4rem}
  .moment-tabs{margin-top:.6rem;gap:.35rem}
  .item-cloud{grid-template-columns:repeat(2,minmax(0,1fr))}
  .board-wrap{--cols:minmax(4.4rem,1.3fr) repeat(6,minmax(0,1fr)) 2.4rem}
  .board-head .rc span{display:none}
  .brow .who{font-size:.92rem}
  .brow .total{font-size:1.1rem}
  .pbars li{grid-template-columns:32px minmax(5rem,6.5rem) minmax(0,1fr) 2.8em;gap:.5rem}
  .pbars img{width:32px;height:32px}
  .place-big{height:60px;margin:0}.place-big img{height:60px}
  .places-inner .lede{display:none}
  .place-pick{max-width:none;grid-template-columns:repeat(8,minmax(0,1fr))}
  .place-pick button{min-height:44px;padding:.2rem}
  .place-pick button img{height:18px}
  .course-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .course-grid button span{display:none}
  /* Phones: list first, then its detail panel (taps scroll the panel into view). */
  .split{display:flex;flex-direction:column;align-items:stretch}
  .split-side{display:contents}
  .split-side h2{order:1}.split-side .lede{order:2}.split .pick{order:3}.split-side .panel{order:4;margin-top:1rem}.split-side .hint{order:5}
  .steps{height:calc(var(--steps,5) * 70svh + 100svh)}
}
@media(prefers-reduced-motion:reduce){
  .story-page *,.story-page *::before{transition:none!important;animation:none!important}
  .reveal,.hbars li,.hero-stats div,.item-cloud li,.course-grid li,.hero-items img{opacity:1!important;transform:none!important}
  .hbars .track i{transform:scaleX(var(--v))!important}
  .podium-rise .block{transform:none!important}
}
/* Short screens (laptops ~768px tall): tighten so each chapter still fits one screen. */
@media(min-width:701px) and (max-height:860px){
  .chapter{padding-top:calc(var(--top) + 1.4rem);padding-bottom:2rem}
  .chapter h2,.stage-title{font-size:clamp(2.2rem,5vw,3.6rem)}
  .lede{margin:.6rem 0 1rem}
  .course-shot{aspect-ratio:auto;height:30svh}
  .course-info{padding:1.5rem 1rem .7rem}
  .course-info h3{font-size:1.3rem}
  .champ-grid{margin:.2rem 0 1.2rem}
  .podium-rise .block{height:calc(var(--h) * .72)}
  .crown .screen{max-height:36svh}
  .crown figcaption{padding:.5rem .8rem}
  .credit-line{margin-top:1.2rem}
  .cta a{min-height:44px;padding:.55rem 1.2rem}
}