/* Singing Battle · Season 5 — upgraded pass ("Stage night editorial").
   One authored light per section (warm-gold key, burgundy glow or violet haze), hairlines instead of boxes,
   Bebas Neue for names and numbers, Instrument Serif italic for the editorial voice, Outfit for reading.
   Layout uses container queries so the same markup works on the 1440 and 390 boards.
   Motion: transform/opacity, Season 4 springs, pausable (.is-paused) and removed under reduced motion (.rm). */

:root{
  --ground:#08070a;--ink-1:#0f0d12;--ink-2:#151219;--ink-3:#1d1822;
  --cream:#f6efe0;--cream-2:#e6dccb;--mute:#bcb2a3;--dim:#9a9083;
  --gold:#d9b25f;--gold-hi:#f1d48f;--gold-lite:#fff1c9;--gold-deep:#8f6a24;
  --wine:#3a0a17;--wine-2:#6e1027;--crimson:#b3122f;--crimson-hi:#d42645;
  --violet:#2c1550;--violet-2:#5a2d91;
  --line:rgba(241,212,143,.30);--line-strong:rgba(241,212,143,.62);--line-soft:rgba(255,255,255,.08);--line-mid:rgba(255,255,255,.15);
  --display:'Bebas Neue','S5 Narrow A','S5 Narrow B','S5 Wide',Impact,sans-serif;
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --text:Outfit,'Segoe UI',system-ui,sans-serif;
  --wrap:1240px;
  --ring:conic-gradient(from 210deg,#fff1ba,#d9b25f,#8f6a24,#fff1ba);
  --spring:linear(0,.0105 1%,.0435 2.1%,.1661 4.4%,.6167 11%,.8052 14.7%,.9254 18.5%,.9955 22.4%,1.0237 25.7%,1.0366 29.1%,1.0387 32.6%,1.0318 37%,1.0045 49.7%,.9987 58.2%,.9988 69.4%,1);
  --spring-pop:linear(0,.009,.035 2.1%,.141,.281 6.7%,.723 12.9%,.938 16.7%,1.017,1.077,1.121,1.149 24.3%,1.159,1.163,1.161,1.154 29.9%,1.129 32.8%,1.051 39.6%,1.017 43.1%,.991,.977 51%,.974 53.8%,.975 57.1%,.997 69.8%,1.003 76.9%,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{background:var(--ground)}
body{margin:0;color:var(--cream);font-family:var(--text);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit;-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4,p,ol,ul,dl,dd,figure,fieldset{margin:0}
ol,ul{padding:0;list-style:none}
fieldset{border:0;padding:0;min-width:0}
button,input,select{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px;border-radius:6px}
[tabindex="-1"]:focus{outline:none}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0}
.icon{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Containers ---------- */
.s5-app{container:app/inline-size;--gutter:clamp(20px,5cqi,72px)}
.v{container:view/inline-size;position:relative;min-height:100%;background:var(--ground);color:var(--cream);font-family:var(--text);--gutter:clamp(20px,5cqi,72px)}
.cq{container-type:inline-size;position:relative}

/* ---------- Type voice ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:600;line-height:1.3;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-hi)}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor;opacity:.7}
.eyebrow.plain::before{display:none}
.eyebrow.center{justify-content:center}
.serif{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.disp{font-family:var(--display);font-weight:400;letter-spacing:.02em;line-height:.88}
.gold{color:var(--gold-hi)}
.mute{color:var(--mute)}
.fine{font-size:13px;line-height:1.55;color:var(--dim)}
.num{font-variant-numeric:tabular-nums}
.sec-title{font-family:var(--display);font-weight:400;font-size:clamp(56px,7.4cqi,112px);line-height:.86;letter-spacing:.01em;color:var(--cream);text-wrap:balance}
.sec-title .serif{display:block;font-size:.42em;line-height:1.1;color:var(--gold-hi);margin-bottom:.12em}
.sec-lead{max-width:560px;margin-top:18px;color:var(--mute);font-size:17px;line-height:1.6;text-wrap:pretty}
.sec-lead b{color:var(--cream);font-weight:600}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 28px;border-radius:999px;font-family:var(--display);font-size:24px;line-height:1;letter-spacing:.07em;text-decoration:none;cursor:pointer;border:0;transition:transform .5s var(--spring),box-shadow .35s,background .3s,color .3s,border-color .3s;white-space:nowrap}
.btn .icon{width:20px;height:20px;stroke-width:2.2;transition:transform .5s var(--spring)}
.btn:hover .icon{transform:translate3d(4px,0,0)}
.btn:active{transform:scale(.96)}
.btn-primary{background:linear-gradient(180deg,var(--crimson-hi),var(--crimson) 60%,#860c23);color:#fff6e8;box-shadow:0 14px 34px rgba(179,18,47,.42),inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(241,212,143,.55);overflow:hidden}
.btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.22) 48%,transparent 60%);transform:translateX(-120%);pointer-events:none}
.btn-primary:hover{box-shadow:0 18px 44px rgba(179,18,47,.55),inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(241,212,143,.8)}
.btn-primary:hover::after{transition:transform .9s var(--ease-out);transform:translateX(120%)}
.btn-secondary{background:rgba(8,7,10,.35);color:var(--gold-hi);box-shadow:inset 0 0 0 1.5px var(--line-strong);backdrop-filter:blur(6px)}
.btn-secondary:hover{background:rgba(241,212,143,.1);box-shadow:inset 0 0 0 1.5px var(--gold-hi)}
.btn-sm{min-height:46px;padding:0 20px;font-size:20px}
.btn[disabled],.btn[aria-disabled="true"]{cursor:not-allowed;filter:saturate(.3) brightness(.72);box-shadow:none;transform:none}
.btn-text{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 2px;border:0;background:none;color:var(--gold-hi);font-family:var(--text);font-size:15px;font-weight:600;letter-spacing:.02em;text-decoration:none;cursor:pointer}
.btn-text .icon{width:17px;height:17px;transition:transform .5s var(--spring)}
.btn-text:hover .icon{transform:translate3d(4px,0,0)}
.btn-text:hover span{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.btn-text[disabled]{color:var(--dim);cursor:not-allowed}
.chip-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line-mid);background:transparent;color:var(--cream-2);font-size:14px;font-weight:500;cursor:pointer;transition:border-color .25s,background .25s,color .25s}
.chip-btn:hover{border-color:var(--line-strong);color:var(--cream)}
.chip-btn[aria-pressed="true"],.chip-btn[aria-selected="true"]{border-color:var(--gold);background:rgba(241,212,143,.14);color:var(--gold-lite)}
.chip-btn .icon{width:16px;height:16px}

/* ---------- Header ---------- */
/* Default styles are the wide layout so a standalone header board renders correctly; containers under 1100px switch to the phone bar. */
.s5-top{position:absolute;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;gap:22px;height:76px;padding:0 var(--gutter,56px);color:var(--cream);transition:background .4s,box-shadow .4s}
.s5-top.solid{background:rgba(8,7,10,.88);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:inset 0 -1px 0 var(--line-soft)}
.s5-top.clear{background:linear-gradient(180deg,rgba(8,7,10,.78),rgba(8,7,10,.34) 60%,rgba(8,7,10,0))}
.brand{display:flex;flex-direction:column;gap:6px;line-height:1;text-decoration:none;min-width:0;flex:none}
.brand b{font-weight:600;font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--cream);white-space:nowrap}
.brand small{font-family:var(--display);font-size:18px;letter-spacing:.1em;color:var(--gold-hi);white-space:nowrap}
.s5-nav{display:flex;gap:2px;margin-left:auto}
.s5-nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 13px;border-radius:999px;font-size:14.5px;font-weight:500;letter-spacing:.02em;color:#e2d8c8;text-decoration:none;transition:color .2s,background .25s}
.s5-nav a:hover{color:var(--cream);background:rgba(255,255,255,.07)}
.s5-nav a[aria-current="page"]{color:var(--gold-lite)}
.s5-nav a::after{content:"";position:absolute;left:13px;right:13px;bottom:6px;height:2px;border-radius:2px;background:var(--gold-hi);transform:scaleX(0);transition:transform .5s var(--spring)}
.s5-nav a[aria-current="page"]::after{transform:none}
.top-cta{min-height:44px;padding:0 22px;font-size:21px}
@container (max-width:1099px){
  .s5-top{height:60px;gap:8px}
  .s5-nav{display:none}
  .brand{gap:5px}
  .brand b{font-size:10.5px;letter-spacing:.26em}
  .brand small{font-size:15.5px}
  .top-cta{margin-left:auto;padding:0 18px;font-size:19px}
}

/* ---------- Prototype shell ---------- */
.s5-app{position:relative;height:var(--app-h,100vh);min-height:480px;overflow:hidden;background:var(--ground);isolation:isolate}
.s5-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(217,178,95,.35) transparent}
.s5-scroll:focus{outline:none}
.skip{position:absolute;left:12px;top:-80px;z-index:100;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--gold-hi);color:#140f06;font-weight:600;text-decoration:none}
.skip:focus{top:12px}
.v-enter{animation:v-in .7s var(--ease-out) both}
@keyframes v-in{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
.tabbar{position:absolute;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));height:68px;padding:6px 6px 10px;background:linear-gradient(180deg,rgba(18,14,22,.94),rgba(8,7,10,.98));box-shadow:inset 0 1px 0 rgba(241,212,143,.22);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.tabbar a{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:48px;border-radius:14px;color:#b9afa1;font-size:11px;font-weight:500;line-height:1.15;letter-spacing:.01em;text-decoration:none;transition:color .3s}
.tabbar a>span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabbar a .icon{width:22px;height:22px;transition:transform .55s var(--spring-pop),fill-opacity .3s;fill:currentColor;fill-opacity:0}
.tabbar a[aria-current="page"]{color:var(--gold-lite)}
.tabbar a[aria-current="page"] .icon{transform:translate3d(0,-1px,0) scale(1.08);fill-opacity:.2}
.tabbar a:active .icon{transform:scale(.86)}
.tab-glow{position:absolute;top:6px;bottom:10px;left:6px;width:calc((100% - 12px) / 6);border-radius:14px;background:radial-gradient(ellipse at 50% 0%,rgba(241,212,143,.22),transparent 72%);transition:transform .62s var(--spring),opacity .3s;pointer-events:none}
.tab-glow::before{content:"";position:absolute;top:-6px;left:50%;width:26px;height:2px;margin-left:-13px;border-radius:2px;background:var(--gold-hi);box-shadow:0 0 12px rgba(241,212,143,.7)}
.tab-glow.off{opacity:0}
@container (min-width:1100px){.tabbar{display:none}}
@container (max-width:1099px){.s5-scroll .s5-foot{padding-bottom:110px}}

/* ---------- Light and texture ---------- */
.light{position:relative;isolation:isolate}
.light::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 78%,transparent 100%)}
.light.wine::before{background:radial-gradient(ellipse 60% 50% at 30% 30%,rgba(110,16,39,.42),transparent 70%)}
.light.violet::before{background:radial-gradient(ellipse 55% 55% at 78% 40%,rgba(90,45,145,.36),transparent 70%)}
.light.amber::before{background:radial-gradient(ellipse 55% 55% at 50% 45%,rgba(150,98,30,.26),transparent 70%)}
.light.floor::before{background:radial-gradient(ellipse 70% 55% at 50% 70%,rgba(110,16,39,.34),transparent 70%)}

/* ---------- Sections ---------- */
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.section{padding-top:120px;padding-bottom:120px}
.section.tight{padding-top:80px;padding-bottom:80px}
.hair{height:1px;background:linear-gradient(90deg,transparent,var(--line-mid) 15%,var(--line-mid) 85%,transparent)}
@container (max-width:759px){.section{padding-top:76px;padding-bottom:76px}.section.tight{padding-top:56px;padding-bottom:56px}}

/* ---------- Home: the authored hero ----------
   Geometry is driven by a few variables so both compositions come from one markup:
   --mt/--mf place the masthead, --head-x/--head-top place the top of Black's hair, --W sizes the square photo.
   The photo's hair-top sits 2.7% down the square and the head centre 57.1% across (measured from the cutout). */
.hero{position:relative;overflow:hidden;isolation:isolate;height:var(--ch);min-height:560px;background:#0b0810}
.hero-layer{position:absolute;inset:0}
.hero-stage{position:absolute;inset:-2%;width:104%;height:104%;max-width:none;object-fit:cover;object-position:24% 34%;filter:saturate(1.05) brightness(.62) contrast(1.06)}
.hero-key{position:absolute;inset:0;background:radial-gradient(ellipse 34% 52% at var(--key-x,30%) 6%,rgba(255,186,96,.40),rgba(255,160,80,.12) 45%,transparent 70%);mix-blend-mode:screen}
.hero-haze{position:absolute;inset:-8%;background:radial-gradient(ellipse 38% 50% at 86% 26%,rgba(118,64,214,.34),transparent 70%),radial-gradient(ellipse 46% 36% at 18% 92%,rgba(128,18,44,.55),transparent 72%);mix-blend-mode:screen}
.hero-beams{position:absolute;inset:-12% -6% 0;mix-blend-mode:screen;pointer-events:none;transform-origin:var(--key-x,33%) 0;background:conic-gradient(from 166deg at var(--key-x,33%) -14%,transparent 0deg,rgba(255,196,120,.11) 5deg,transparent 11deg,transparent 19deg,rgba(255,186,110,.08) 23deg,transparent 29deg),conic-gradient(from 190deg at 80% -16%,transparent 0deg,rgba(150,100,255,.12) 5deg,transparent 11deg,transparent 15deg,rgba(150,100,255,.07) 18deg,transparent 23deg)}
.hero.ambient .hero-beams{animation:beam-sway 16s ease-in-out infinite alternate}
.hero.is-paused .hero-beams{animation-play-state:paused}
@keyframes beam-sway{from{transform:rotate(-1.3deg)}to{transform:rotate(1.5deg)}}
.hero-vignette{position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at var(--key-x,30%) 40%,transparent 45%,rgba(6,4,8,.55) 100%)}
.hero-floor{position:absolute;inset:0;background:var(--floor)}
.hero-top{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,7,10,.55),transparent 16%)}
.hero-side{position:absolute;inset:0;background:linear-gradient(270deg,rgba(8,7,10,.9) 0%,rgba(8,7,10,.66) 24%,rgba(8,7,10,.18) 42%,transparent 54%)}
.hero-grain{position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;pointer-events:none}
.masthead{position:absolute;left:0;right:0;top:var(--mt);margin:0;display:flex;justify-content:center;gap:.16em;font-family:var(--display);font-weight:400;font-size:var(--mf);line-height:.84;letter-spacing:.004em;color:var(--cream);filter:drop-shadow(0 8px 30px rgba(0,0,0,.5));user-select:none;white-space:nowrap}
.masthead .w{display:flex}
.masthead .ch{display:inline-block;background:linear-gradient(180deg,#fffaf0 0%,#f5ead2 52%,#d8c39c 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.subject{position:absolute;margin:0;top:calc(var(--head-top) - .027 * var(--W));left:calc(var(--head-x) - .571 * var(--W));width:var(--W);height:var(--W);transform-origin:57% 30%}
.subject img{position:absolute;inset:0;width:100%;height:100%;max-width:none;-webkit-mask-image:linear-gradient(180deg,#000 0,#000 var(--fade-at,80%),transparent 99%),linear-gradient(90deg,transparent 0,#000 6%,#000 92%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 0,#000 var(--fade-at,80%),transparent 99%),linear-gradient(90deg,transparent 0,#000 6%,#000 92%,transparent 100%);mask-composite:intersect;filter:contrast(1.05) saturate(1.04) brightness(1.02) drop-shadow(0 0 1px rgba(255,214,160,.28)) drop-shadow(0 26px 46px rgba(0,0,0,.55))}
.relight{position:absolute;inset:0;pointer-events:none}
.relight.key{mix-blend-mode:soft-light;background:radial-gradient(ellipse 16% 13% at 59% 31%,rgba(255,220,170,.75),transparent 72%),radial-gradient(ellipse 52% 40% at 40% 6%,rgba(255,206,130,.95),rgba(255,180,100,.35) 50%,transparent 75%),linear-gradient(90deg,transparent 58%,rgba(140,90,255,.55) 100%)}
.relight.rim{mix-blend-mode:screen;opacity:.42;background:linear-gradient(118deg,rgba(255,196,120,.55) 0%,transparent 16%),linear-gradient(242deg,rgba(150,104,255,.55) 0%,transparent 15%)}
.relight.fill{mix-blend-mode:multiply;background:linear-gradient(180deg,transparent 55%,rgba(60,12,30,.55) 100%)}
.hero-copy{position:absolute;z-index:4}
.champ-tag{position:absolute;z-index:4;display:grid;justify-items:start;gap:0;margin:0}
.champ-tag small{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-hi);text-shadow:0 2px 12px rgba(0,0,0,.8)}
.champ-tag small i{display:block;width:30px;height:1.5px;background:var(--gold-hi);transform-origin:0 50%}
.champ-tag b{font-family:var(--serif);font-style:italic;font-weight:400;line-height:1;letter-spacing:-.005em;color:var(--cream);text-shadow:0 6px 30px rgba(0,0,0,.6)}
.ev-season{margin:0;font-family:var(--display);font-weight:400;line-height:.84;letter-spacing:.02em;color:var(--gold-hi);background:linear-gradient(180deg,#fff3cc,#f1d48f 46%,#c9993f);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 6px 22px rgba(0,0,0,.5))}
.ev-rule{display:block;height:1.5px;background:linear-gradient(90deg,var(--gold-hi),transparent);transform-origin:0 50%}
.ev-date{display:grid;gap:4px;margin:0}
.ev-date .serif{color:var(--cream-2);line-height:1}
.ev-date b{font-family:var(--display);font-weight:400;line-height:.9;letter-spacing:.03em;color:var(--cream)}
.ev-prize{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 12px;margin:0}
.ev-prize b{font-family:var(--display);font-weight:400;line-height:.86;letter-spacing:.01em;color:var(--gold-lite);text-shadow:0 8px 40px rgba(241,212,143,.22)}
.ev-prize .serif{color:var(--gold-hi);line-height:1}
.ev-meta{margin:0;font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-2)}
.ev-meta i{display:inline-block;width:4px;height:4px;margin:0 10px 2px;border-radius:50%;background:var(--gold);vertical-align:middle}
.ev-qual{margin:0;color:var(--cream-2);text-wrap:pretty}
.ev-qual b{color:var(--cream);font-weight:600}
.ev-cta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
.motion-toggle{position:absolute;z-index:5;right:var(--gutter);bottom:24px;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-mid);background:rgba(8,7,10,.55);color:var(--cream);cursor:pointer;backdrop-filter:blur(6px);transition:border-color .2s,background .2s}
.motion-toggle:hover{border-color:var(--line-strong)}
.motion-toggle .icon{width:17px;height:17px}
.scroll-cue{position:absolute;z-index:4;left:50%;bottom:22px;display:grid;justify-items:center;gap:6px;transform:translateX(-50%);font-size:10.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--mute)}
.scroll-cue i{display:block;width:1px;height:34px;background:linear-gradient(180deg,var(--gold-hi),transparent);transform-origin:50% 0}

/* Phone and tablet composition (default) */
.hero{
  --ch:var(--cover-h-override,778px);
  --u:calc(var(--ch) / 100);
  --mt:70px;
  --mf:min(calc((100cqi - 2 * var(--gutter)) / 4.86),96px);
  --W:min(124cqi,calc(62 * var(--u)));
  --head-x:62%;
  --head-top:calc(var(--mt) + .62 * var(--mf));
  --key-x:60%;
  --fade-at:72%;
  --floor:linear-gradient(0deg,#08070a 0%,rgba(10,5,9,.94) 24%,rgba(16,6,12,.66) 38%,rgba(20,6,14,.2) 50%,transparent 60%);
}
.champ-tag{left:var(--gutter);top:calc(var(--mt) + 1.24 * var(--mf));max-width:40cqi}
.champ-tag small{font-size:10px;letter-spacing:.2em;gap:0}
.champ-tag small i{display:none}
.champ-tag b{margin-top:4px;font-size:clamp(40px,12cqi,50px)}
.hero-copy{left:var(--gutter);right:var(--gutter);bottom:20px;display:grid;gap:10px}
.ev-season{font-size:clamp(56px,16.4cqi,72px)}
.ev-rule{width:64px;margin:2px 0}
.ev-date .serif{font-size:17px}
.ev-date b{font-size:clamp(31px,9.2cqi,40px)}
.ev-prize b{font-size:clamp(40px,11.6cqi,50px)}
.ev-prize .serif{font-size:19px}
.ev-meta{display:none}
.ev-qual{font-size:15px;line-height:1.45}
.ev-qual .q-long{display:none}
.ev-cta{margin-top:6px;gap:4px 14px;flex-wrap:nowrap}
.ev-cta .btn-primary{flex:1 1 auto;min-width:0;padding:0 18px;font-size:22px}
.ev-cta .btn-text{flex:none}
.motion-toggle,.scroll-cue,.hero .hero-side{display:none}
@container (min-width:600px) and (max-width:1099px){
  .hero{--W:min(92cqi,calc(66 * var(--u)));--head-x:60%}
  .hero-copy{max-width:520px}
  .ev-meta{display:block}
  .ev-qual .q-long{display:inline}
  .ev-qual .q-short{display:none}
}
/* Desktop composition */
@container (min-width:1100px){
  .hero{
    --ch:var(--cover-h-override,900px);
    --mt:calc(10.4 * var(--u));
    --mf:min(calc((100cqi - 2 * var(--gutter)) / 4.86),calc(30 * var(--u)));
    --W:calc(89 * var(--u));
    --head-x:max(33%,calc(.571 * var(--W)));
    --head-top:calc(var(--mt) + .5 * var(--mf));
    --key-x:33%;
    --fade-at:84%;
    --floor:linear-gradient(0deg,#08070a 0%,rgba(16,5,10,.88) 9%,rgba(26,6,14,.46) 22%,rgba(20,6,14,.1) 36%,transparent 48%);
  }
  .hero .hero-side{display:block}
  .champ-tag{left:var(--gutter);top:calc(var(--mt) + .86 * var(--mf));max-width:320px}
  .champ-tag b{margin-top:6px;font-size:clamp(72px,9.6 * var(--u),96px)}
  .hero-copy{left:auto;right:var(--gutter);top:calc(var(--mt) + .82 * var(--mf));bottom:auto;width:min(440px,32cqi);gap:14px}
  .ev-season{font-size:clamp(104px,13.6 * var(--u),132px)}
  .ev-rule{width:96px;margin:4px 0 6px}
  .ev-date .serif{font-size:26px}
  .ev-date b{font-size:clamp(50px,6.4 * var(--u),60px)}
  .ev-prize b{font-size:clamp(76px,9.8 * var(--u),96px)}
  .ev-prize .serif{font-size:28px}
  .ev-meta{display:block}
  .ev-qual{font-size:17px;line-height:1.5;max-width:26em}
  .ev-qual .q-long{display:inline}
  .ev-qual .q-short{display:none}
  .ev-cta{margin-top:8px;flex-wrap:wrap;gap:8px 22px}
  .ev-cta .btn-primary{flex:0 0 auto;padding:0 28px;font-size:24px}
  .motion-toggle{display:inline-flex}
  .scroll-cue{display:grid}
}
/* Hero entrance, three independent clocks.
   Facts and the primary action: start as soon as the copy fonts are in, or after 350 ms at most, and are readable within ~0.7 s of mount.
   They use swap copies of the display and serif faces, so slow fonts show a fallback face instead of hiding the facts.
   Atmosphere settles around them: the masthead letters wait for their own face (3 s cap), the stage plate and
   Black's photo each fade in when their image has decoded. */
/* Fallbacks for the cover facts while the display faces load: local fonts scaled to roughly the width of Bebas Neue and
   Instrument Serif, so a slow font never wraps or pushes the action off the cover. No 'block' face in these stacks:
   a loading 'block' face further down would hide the facts again. */
@font-face{font-family:'S5 Narrow A';src:local('Arial Narrow'),local('ArialNarrow'),local('Roboto Condensed'),local('RobotoCondensed-Regular'),local('Avenir Next Condensed'),local('AvenirNextCondensed-Regular');size-adjust:90%}
@font-face{font-family:'S5 Narrow B';src:local('DejaVu Sans Condensed'),local('DejaVuSansCondensed'),local('Liberation Sans Narrow'),local('LiberationSansNarrow');size-adjust:76%}
@font-face{font-family:'S5 Wide';src:local('Arial'),local('ArialMT'),local('Helvetica Neue'),local('Helvetica'),local('Roboto'),local('Liberation Sans'),local('DejaVu Sans'),local('FreeSans');size-adjust:70%}
@font-face{font-family:'S5 Serif Italic';src:local('Georgia Italic'),local('Georgia-Italic'),local('Times New Roman Italic'),local('TimesNewRomanPS-ItalicMT'),local('Liberation Serif Italic'),local('DejaVu Serif Italic'),local('DejaVuSerif-Italic');font-style:italic;size-adjust:88%}
.hero-copy,.champ-tag{--display:'Bebas Neue Swap','S5 Narrow A','S5 Narrow B','S5 Wide',sans-serif;--serif:'Instrument Serif Swap','S5 Serif Italic',Georgia,'Times New Roman',serif}
.s5-top .top-cta{--display:'Bebas Neue Swap','S5 Narrow A','S5 Narrow B','S5 Wide',sans-serif}
.hero.copy-in .hero-copy>*{animation:rise .55s var(--spring) both;animation-delay:calc(var(--k,0) * 40ms)}
.hero.copy-in .hero-copy .ev-rule{animation:rule-in .8s var(--ease-out) .12s both}
.hero.copy-in .champ-tag>*{animation:rise .55s var(--spring) both;animation-delay:calc(100ms + var(--k,0) * 50ms)}
.hero.copy-in .champ-tag small i{animation:rule-in .8s var(--ease-out) .3s both}
.hero.copy-in .scroll-cue{animation:fade-in .8s var(--ease-out) 1.2s both}
.hero.type-in .masthead .ch{animation:letter-in .95s var(--spring) both;animation-delay:calc(40ms + var(--i) * 30ms)}
.hero.stage-in .hero-stage{animation:stage-up 1.8s var(--ease-out) both}
.subject{opacity:0;transform:translate3d(0,22px,0) scale(1.035);transition:opacity 1.3s var(--ease-out),transform 1.9s var(--ease-out)}
.subject.in{opacity:1;transform:none}
/* Until its own clock starts, each piece waits unseen (never in its final position first). */
.hero:not(.copy-in) .hero-copy>*,.hero:not(.copy-in) .champ-tag>*,.hero:not(.copy-in) .scroll-cue,.hero:not(.type-in) .masthead .ch,.hero:not(.stage-in) .hero-stage{opacity:0}
/* The two photos are not painted at all until decoded, so their raster never delays the first frame of the facts. */
.hero:not(.stage-in) .hero-stage,.subject:not(.in){visibility:hidden}
.rm .hero:not(.copy-in) .hero-copy>*,.rm .hero:not(.copy-in) .champ-tag>*,.rm .hero:not(.copy-in) .scroll-cue,.rm .hero:not(.type-in) .masthead .ch,.rm .hero:not(.stage-in) .hero-stage{opacity:1}
.hero.ambient .hero-key{animation:key-breathe 8s ease-in-out 2s infinite alternate}
.hero.ambient .hero-haze{animation:haze-drift 24s ease-in-out infinite alternate}
.hero.ambient .scroll-cue i{animation:cue 2.6s var(--ease-io) 2s infinite}
.hero.is-paused .hero-key,.hero.is-paused .hero-haze,.hero.is-paused .scroll-cue i{animation-play-state:paused}
@keyframes stage-up{from{opacity:.2;transform:scale(1.06)}to{opacity:1;transform:none}}
@keyframes letter-in{from{opacity:0;transform:translate3d(0,40%,0)}to{opacity:1;transform:none}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes rise{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes rule-in{from{transform:scaleX(0)}to{transform:none}}
@keyframes key-breathe{from{opacity:1}to{opacity:.78}}
@keyframes haze-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-2.5%,1.5%,0)}}
@keyframes cue{0%{transform:scaleY(0);opacity:0}30%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1) translate3d(0,14px,0);opacity:0}}

/* ---------- Home: the road to November 17 ---------- */
.road{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:40px 80px;align-items:start}
.road-steps{display:grid;gap:0;counter-reset:st}
.road-step{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 22px;padding:26px 0;border-top:1px solid var(--line-soft)}
.road-step:last-child{border-bottom:1px solid var(--line-soft)}
.road .sec-title{font-size:clamp(56px,6.2cqi,92px)}
.road-step .n{grid-row:span 2;font-family:var(--display);font-size:84px;line-height:.8;color:transparent;-webkit-text-stroke:1.2px rgba(241,212,143,.7)}
.road-step h3{font-family:var(--display);font-weight:400;font-size:clamp(34px,3.4cqi,46px);line-height:.92;letter-spacing:.02em;color:var(--cream)}
.road-step p{font-size:16px;color:var(--mute);max-width:520px}
.road-step p b{color:var(--cream);font-weight:600}
.road-step.final h3{color:var(--gold-lite)}
@container (max-width:899px){.road{grid-template-columns:minmax(0,1fr)}.road-step{grid-template-columns:64px minmax(0,1fr);gap:4px 14px}.road-step .n{font-size:58px}}
/* Total wins vs streak */
.tally{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px 56px;align-items:center;margin-top:72px;padding:40px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tally h3{font-family:var(--display);font-weight:400;font-size:clamp(40px,4.4cqi,60px);line-height:.9;letter-spacing:.02em;color:var(--cream)}
.tally h3 .serif{display:block;font-size:.5em;color:var(--gold-hi);margin-bottom:6px}
.tally-copy p{margin-top:14px;color:var(--mute);font-size:16px;max-width:460px}
.tally-copy .btn-text{margin-top:10px}
.tally-board{display:grid;gap:18px}
.tally-results{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.chip-res{display:grid;place-items:center;height:52px;border-radius:12px;border:1px solid var(--line-mid);font-family:var(--display);font-size:22px;letter-spacing:.06em;color:var(--dim);transition:background .4s,border-color .4s,color .4s,transform .5s var(--spring-pop)}
.chip-res.win{border-color:rgba(241,212,143,.7);background:rgba(241,212,143,.13);color:var(--gold-lite)}
.chip-res.loss{border-color:rgba(255,143,160,.45);background:rgba(110,16,39,.45);color:#ffc5ce}
.chip-res.now{transform:translate3d(0,-5px,0) scale(1.05)}
.tally-counters{display:grid;grid-template-columns:1.25fr 1fr;gap:12px}
.counter{padding:16px 18px 14px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));box-shadow:inset 0 0 0 1px var(--line-soft)}
.counter.total{box-shadow:inset 0 0 0 1px var(--line);background:radial-gradient(ellipse 80% 90% at 0% 0%,rgba(241,212,143,.12),transparent 70%)}
.counter small{display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}
.counter strong{display:block;font-family:var(--display);font-weight:400;font-size:84px;line-height:.86;color:var(--cream);font-variant-numeric:tabular-nums}
.counter.total strong{color:var(--gold-lite)}
.counter .note{display:block;min-height:1.4em;margin-top:6px;font-family:var(--serif);font-style:italic;font-size:18px;color:var(--cream-2)}
.counter strong.bump{animation:bump .6s var(--spring-pop)}
.counter strong.bump2{animation:bump2 .6s var(--spring-pop)}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes bump2{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}
@container (max-width:899px){.tally{grid-template-columns:minmax(0,1fr);margin-top:48px;padding:28px 0}.counter strong{font-size:68px}}

/* ---------- Home: top 16 preview ---------- */
.t16{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:40px 72px;align-items:start}
.t16-head{position:sticky;top:110px}
.t16-big{font-family:var(--display);font-weight:400;font-size:clamp(120px,15cqi,220px);line-height:.8;letter-spacing:.01em;background:linear-gradient(180deg,#fff2c8,#f1d48f 50%,#b88a3c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.t16-head .serif{display:block;margin-top:8px;font-size:clamp(24px,2.6cqi,34px);line-height:1.15;color:var(--cream)}
@container (max-width:899px){.t16{grid-template-columns:minmax(0,1fr)}.t16-head{position:static}}

/* ---------- Home: tournament ---------- */
.tour{display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px 80px;align-items:center}
.tour-date{display:grid;justify-items:start;font-family:var(--display);line-height:.78;color:var(--cream)}
.tour-date small{font-family:var(--text);font-size:12px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-hi);margin-bottom:14px}
.tour-date b{font-weight:400;font-size:clamp(170px,22cqi,300px);letter-spacing:-.01em;background:linear-gradient(180deg,#fff2c8,#f1d48f 55%,#a87b33);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tour-date span{font-size:clamp(46px,5.4cqi,72px);letter-spacing:.14em;margin-top:8px}
.tour-copy h2{font-family:var(--display);font-weight:400;font-size:clamp(44px,5cqi,76px);line-height:.9;letter-spacing:.02em;color:var(--cream);text-wrap:balance}
.tour-copy h2 .serif{display:block;font-size:.5em;color:var(--gold-hi);margin-bottom:8px}
.tour-copy p{margin-top:16px;color:var(--mute);font-size:17px;max-width:560px}
.facts-line{display:flex;flex-wrap:wrap;gap:12px 0;margin-top:26px;padding-top:20px;border-top:1px solid var(--line-soft)}
.facts-line div{display:grid;gap:2px;padding-right:28px;margin-right:28px;border-right:1px solid var(--line-soft)}
.facts-line div:last-child{border-right:0;margin-right:0;padding-right:0}
.facts-line dt{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.facts-line dd{font-family:var(--display);font-size:34px;line-height:1;letter-spacing:.03em;color:var(--cream)}
.facts-line dd.gold{color:var(--gold-lite)}
@container (max-width:899px){.tour{grid-template-columns:minmax(0,1fr);gap:24px}.facts-line div{padding-right:18px;margin-right:18px}.facts-line dd{font-size:28px}}

/* ---------- Home: champions ---------- */
.hall{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px 72px;align-items:center}
.hall-photo{position:relative;border-radius:28px;overflow:hidden;aspect-ratio:1/1;box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 0 0 1px var(--line)}
.hall-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;transition:transform 1.2s var(--ease-out)}
.hall-photo:hover img{transform:scale(1.03)}
.hall-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(8,7,10,.85));pointer-events:none}
.hall-photo figcaption{position:absolute;left:28px;right:28px;bottom:24px;z-index:1;display:grid;gap:4px}
.hall-photo figcaption .eyebrow{color:var(--gold-hi)}
.hall-photo figcaption b{font-family:var(--display);font-weight:400;font-size:clamp(64px,7cqi,104px);line-height:.85;letter-spacing:.02em;color:var(--cream)}
.hall-photo figcaption .serif{font-size:24px;color:var(--cream-2)}
.past{display:grid}
.past-row{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:18px;align-items:center;padding:18px 0;border-top:1px solid var(--line-soft);text-decoration:none}
.past-row:last-child{border-bottom:1px solid var(--line-soft)}
.past-row img,.past-row .ph{width:76px;height:76px;border-radius:50%;object-fit:cover;padding:2.5px;background:var(--ring)}
.past-row .ph{display:grid;place-items:center;padding:0;background:transparent;border:1.5px dashed rgba(241,212,143,.55);color:var(--gold-hi)}
.past-row .ph .icon{width:28px;height:28px}
.past-row small{display:block;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi)}
.past-row b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(30px,3cqi,40px);line-height:.95;letter-spacing:.02em;color:var(--cream);overflow-wrap:anywhere}
.past-row .serif{font-size:17px;color:var(--mute)}
.past-row .amt{font-family:var(--display);font-size:30px;color:var(--gold-lite)}
.past-row:hover b{color:var(--gold-lite)}
@container (max-width:899px){.hall{grid-template-columns:minmax(0,1fr)}.past-row{grid-template-columns:60px minmax(0,1fr) auto;gap:14px}.past-row img,.past-row .ph{width:60px;height:60px}.past-row .amt{font-size:24px}}

/* ---------- Home: powers shelf ---------- */
.shelf{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.shelf a{display:grid;justify-items:center;gap:10px;text-decoration:none;text-align:center}
.shelf .art{position:relative;width:100%;max-width:300px;aspect-ratio:1/1;display:grid;place-items:center}
.shelf .art::before{content:"";position:absolute;inset:10% 6% -6%;border-radius:50%;background:radial-gradient(ellipse at 50% 60%,rgba(241,212,143,.22),transparent 65%);filter:blur(10px)}
.shelf img{position:relative;width:88%;height:auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.65));transition:transform .8s var(--spring-pop)}
.shelf img.clip,.pw-art img.clip{border-radius:13%}
.shelf a:hover img{transform:translate3d(0,-8px,0) rotate(-1.5deg) scale(1.03)}
.shelf b{font-family:var(--display);font-weight:400;font-size:clamp(28px,3cqi,40px);line-height:1;letter-spacing:.06em;color:var(--cream)}
.shelf p{max-width:16em;font-size:15px;line-height:1.5;color:var(--mute)}
@container (max-width:599px){
  .shelf{grid-template-columns:minmax(0,1fr);gap:14px}
  .shelf a{grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto auto;justify-items:start;align-items:center;column-gap:18px;row-gap:2px;text-align:left}
  .shelf .art{grid-row:span 2;width:112px}
  .shelf img{width:100%}
  .shelf b{align-self:end;font-size:30px}
  .shelf p{align-self:start;font-size:15px;max-width:none}
}
.not-buy{max-width:640px;margin:34px auto 0;text-align:center;font-size:15px;color:var(--mute)}
.not-buy b{color:var(--cream);font-weight:600}

/* ---------- Home: more from the show ---------- */
.more-band{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.more-band a{display:grid;gap:8px;align-content:start;padding:34px 34px 34px 0;text-decoration:none}
.more-band a+a{padding-left:34px;border-left:1px solid var(--line-soft)}
.more-band .icon{width:26px;height:26px;color:var(--gold-hi)}
.more-band b{font-family:var(--display);font-weight:400;font-size:34px;line-height:1;letter-spacing:.03em;color:var(--cream)}
.more-band p{font-size:15px;color:var(--mute)}
.more-band span.go{display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-size:14px;font-weight:600;color:var(--gold-hi)}
.more-band span.go .icon{width:16px;height:16px;transition:transform .5s var(--spring)}
.more-band a:hover span.go .icon{transform:translate3d(4px,0,0)}
.more-band a:hover b{color:var(--gold-lite)}
@container (max-width:899px){.more-band{grid-template-columns:minmax(0,1fr)}.more-band a,.more-band a+a{padding:26px 0;border-left:0}.more-band a+a{border-top:1px solid var(--line-soft)}}

/* ---------- Home: section heads and the champion lineage ---------- */
.sec-head{margin-bottom:56px}
.sec-head.center{display:grid;justify-items:center;text-align:center}
.sec-head.center .sec-title{margin-top:18px}
.sec-head.split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:18px 40px}
.center-cta{display:flex;justify-content:center;margin-top:26px}
.t16-title{display:grid;justify-items:start;margin:0}
.t16-title .serif{display:block;margin-top:10px;font-size:clamp(24px,2.6cqi,34px);line-height:1.15;color:var(--cream);max-width:11em}
.lineage{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;padding-top:34px}
.lineage::before{content:"";position:absolute;left:0;right:0;top:5px;height:1px;background:linear-gradient(90deg,rgba(241,212,143,.12),var(--line) 30%,var(--line-strong) 75%,var(--gold-hi))}
.lin{position:relative;min-width:0}
.lin::before{content:"";position:absolute;top:-34px;left:0;width:11px;height:11px;border-radius:50%;background:var(--ground);box-shadow:inset 0 0 0 2px rgba(241,212,143,.65)}
.lin.reigning::before{background:var(--gold-hi);box-shadow:0 0 0 4px rgba(241,212,143,.2),0 0 18px rgba(241,212,143,.6)}
.lin.next::before{box-shadow:inset 0 0 0 2px var(--gold-hi)}
.lin a{display:grid;gap:14px;text-decoration:none;color:inherit}
.lin .shot{position:relative;display:block;aspect-ratio:1/1;border-radius:50%;padding:3px;background:var(--ring);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.lin .ph-in{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#141018}
.lin .ph-in img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(1.07);filter:saturate(.9) brightness(.92);transition:transform 1s var(--ease-out),filter .5s}
.lin a:hover .ph-in img{transform:scale(1.12);filter:none}
.lin-txt{display:grid;gap:4px}
.lin small{font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-hi)}
.lin b{font-family:var(--display);font-weight:400;font-size:clamp(28px,2.7cqi,40px);line-height:.95;letter-spacing:.02em;color:var(--cream);overflow-wrap:anywhere;transition:color .25s}
.lin a:hover b{color:var(--gold-lite)}
.lin .lin-txt .serif{font-size:18px;line-height:1.2;color:var(--gold-hi)}
.lin.reigning .shot{padding:4px;box-shadow:0 0 0 6px rgba(241,212,143,.12),0 26px 60px rgba(0,0,0,.5),0 0 70px rgba(241,212,143,.22)}
.lin.reigning .ph-in img{filter:none;object-position:56% 30%}
.lin.next .shot{display:grid;place-items:center;align-content:center;gap:10px;padding:18px;text-align:center;background:radial-gradient(circle at 50% 35%,rgba(241,212,143,.14),transparent 70%),#0f0c12;box-shadow:none;border:1.5px dashed rgba(241,212,143,.6)}
.lin.next .shot .icon{width:46px;height:46px;color:var(--gold-hi);stroke-width:1.5}
.lin.next .shot .serif{font-size:20px;line-height:1.2;color:var(--cream-2)}
@container (max-width:899px){
  .lineage{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 14px;padding-top:0}
  .lineage::before,.lin::before{display:none}
  .lin.reigning,.lin.next{grid-column:1/-1}
  .lin.reigning{order:-1}
  .lin.reigning a,.lin.next a{grid-template-columns:120px minmax(0,1fr);align-items:center;gap:18px}
  .lin.reigning .shot{width:120px}
  .lin.next a{grid-template-columns:96px minmax(0,1fr);padding-left:12px}
  .lin.next .shot{width:96px;padding:0}
  .lin.next .shot .serif{display:none}
  .lin.next .shot .icon{width:32px;height:32px}
  .lin a{gap:10px;justify-items:center;text-align:center}
  .lin.reigning a,.lin.next a{justify-items:start;text-align:left}
  .lin small{font-size:10px;letter-spacing:.18em}
  .lin b{font-size:22px}
  .lin.reigning b{font-size:44px}
  .lin.next b{font-size:32px}
}
.tally h3 .serif{display:block;font-size:.5em;color:var(--gold-hi);margin-bottom:6px}

/* ---------- Footer ---------- */
.s5-foot{position:relative;overflow:hidden;padding:84px var(--gutter) 48px;text-align:center;color:var(--dim);font-size:13.5px;border-top:1px solid var(--line-soft)}
.s5-foot .mark{font-family:var(--display);font-size:clamp(52px,9.4cqi,140px);line-height:.85;letter-spacing:.02em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(241,212,143,.26);user-select:none}
.s5-foot>p{max-width:640px;margin:18px auto 0}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 22px;margin-top:18px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--cream-2);text-decoration:none}
.foot-links a:hover{color:var(--gold-lite)}

/* ---------- Page heads (inner pages) ---------- */
.page-hero{position:relative;padding-top:150px;padding-bottom:64px;overflow:hidden;isolation:isolate}
.page-hero::before{content:"";position:absolute;inset:0;z-index:-1;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);mask-image:linear-gradient(180deg,#000 60%,transparent);background:radial-gradient(ellipse 50% 80% at 18% 0%,rgba(150,98,30,.28),transparent 70%),radial-gradient(ellipse 50% 80% at 90% 10%,rgba(90,45,145,.30),transparent 70%),radial-gradient(ellipse 70% 60% at 50% 120%,rgba(110,16,39,.30),transparent 70%)}
.page-hero .grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px 64px;align-items:end}
.page-title{font-family:var(--display);font-weight:400;font-size:clamp(84px,12cqi,184px);line-height:.8;letter-spacing:.005em;color:var(--cream)}
.page-title .serif{display:block;font-size:.26em;line-height:1.2;color:var(--gold-hi);letter-spacing:0;margin-bottom:.1em}
.page-intro{font-size:17.5px;line-height:1.6;color:var(--mute);max-width:520px;text-wrap:pretty}
.page-intro b{color:var(--cream);font-weight:600}
@container (max-width:899px){.page-hero{padding-top:104px;padding-bottom:36px}.page-hero .grid{grid-template-columns:minmax(0,1fr)}.page-title{font-size:clamp(70px,22cqi,110px)}.page-intro{font-size:16px}}

/* ---------- Preview label (design preview only) ---------- */
.preview-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:12px 18px;border-radius:14px;background:repeating-linear-gradient(135deg,rgba(241,212,143,.05) 0 10px,transparent 10px 20px),rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px rgba(241,212,143,.35);font-size:13.5px;line-height:1.45;color:var(--cream-2)}
.preview-bar b{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.preview-bar .grow{flex:1 1 280px}

/* ---------- Standings ---------- */
.st-page{padding-bottom:110px}
.st-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 30px}
@container (max-width:599px){.st-tabs{flex-wrap:nowrap;overflow-x:auto;margin-left:calc(-1 * var(--gutter));margin-right:calc(-1 * var(--gutter));padding:2px var(--gutter);scrollbar-width:none}.st-tabs::-webkit-scrollbar{display:none}.st-tabs .chip-btn{flex:none}}
.st-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:18px 0 12px}
.search{position:relative;display:block;flex:1 1 260px;max-width:420px}
.search .icon{position:absolute;left:18px;top:50%;width:18px;height:18px;margin-top:-9px;color:var(--gold-hi);pointer-events:none}
.search input{width:100%;min-height:50px;padding:0 18px 0 48px;border:0;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line-mid);color:var(--cream);font-size:16px;transition:box-shadow .25s,background .25s}
.search input:focus{outline:none;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1.5px var(--gold-hi),0 0 0 4px rgba(241,212,143,.16)}
.search input::placeholder{color:var(--dim)}
.search input[disabled]{opacity:.5;cursor:not-allowed}
.search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
.st-status{font-size:13.5px;line-height:1.55;color:var(--mute);margin:0 0 22px}
.st-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:start}
.st-main{min-width:0;container-type:inline-size}
.st-aside{position:sticky;top:100px;min-width:0}
@container (max-width:1099px){.st-layout{grid-template-columns:minmax(0,1fr);gap:48px}.st-aside{position:static}}
.preview-bar.compact{padding:10px 16px;font-size:13px;margin-bottom:18px}
.teaser{display:grid}
/* Leaderboard rows: default sizes are for a list column of 600px or more; narrower columns use the phone scale below. */
.lb-head{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:18px;padding:0 18px 12px 62px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.lb-head span:nth-child(2){padding-left:0}
.lb-head span:last-child{text-align:right}
.lb-in{position:relative;padding-left:44px}
.lb-rail{position:absolute;left:0;top:4px;bottom:4px;width:30px;display:flex;justify-content:center}
.lb-rail::before{content:"";position:absolute;left:14px;top:0;bottom:0;width:2px;border-radius:2px;background:linear-gradient(180deg,var(--gold-lite),var(--gold) 70%,var(--gold-hi))}
.lb-rail span{position:sticky;top:110px;align-self:flex-start;margin-top:18px;padding:12px 0;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;white-space:nowrap;color:var(--gold-hi);background:var(--ground)}
.lb-list{display:grid}
.lb-row{position:relative}
.lb-btn{position:relative;display:grid;grid-template-columns:64px auto minmax(0,1fr) auto;align-items:center;gap:18px;width:100%;min-height:82px;padding:10px 18px;border:0;border-radius:16px;background:transparent;text-align:left;cursor:pointer;color:inherit;transition:background .3s}
.lb-row+.lb-row .lb-btn::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:var(--line-soft)}
.lb-btn:hover{background:rgba(255,255,255,.04)}
.lb-btn:hover .lb-name{color:var(--gold-lite)}
.lb-btn[aria-current="true"]{background:linear-gradient(90deg,rgba(241,212,143,.16),rgba(241,212,143,.03) 70%);box-shadow:inset 0 0 0 1px rgba(241,212,143,.5)}
.lb-rank{font-family:var(--display);font-size:44px;line-height:1;color:var(--cream-2);font-variant-numeric:tabular-nums;text-align:center}
.lb-rank small{display:block;margin-top:2px;font-family:var(--text);font-size:9.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi)}
.lb-who{display:grid;gap:5px;min-width:0}
.lb-name{font-family:var(--display);font-weight:400;font-size:36px;line-height:.95;letter-spacing:.02em;color:var(--cream);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;transition:color .25s}
.lb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;font-size:13px;line-height:1.3;color:var(--mute)}
.lb-meta b{color:var(--cream);font-weight:600}
.lb-wins{display:grid;justify-items:end;line-height:1}
.lb-wins strong{font-family:var(--display);font-weight:400;font-size:62px;line-height:.84;color:var(--gold-lite);font-variant-numeric:tabular-nums}
.lb-wins small{display:none;margin-top:5px;font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
.lb-row.first .lb-wins small{display:block}
.lb-row.top .lb-btn{min-height:104px}
.lb-row.top .lb-rank{color:var(--gold-hi);font-size:54px}
.lb-row.top .lb-name{font-size:44px}
.lb-row.top .lb-wins strong{font-size:80px}
.lb-row.top .av{width:64px;height:64px;font-size:24px}
.lb-row.first .lb-btn{min-height:124px;background:radial-gradient(ellipse 70% 120% at 18% 50%,rgba(241,212,143,.13),transparent 70%)}
.lb-row.first .lb-btn:hover{background:radial-gradient(ellipse 70% 120% at 18% 50%,rgba(241,212,143,.18),transparent 70%)}
.lb-row.first .lb-name{font-size:52px}
.lb-row.first .lb-rank{font-size:66px}
.lb-row.first .lb-wins strong{font-size:100px;text-shadow:0 10px 40px rgba(241,212,143,.25)}
.lb-row.first .av{width:78px;height:78px;font-size:29px}
.lb-row.out .lb-rank{color:var(--dim)}
.lb-row.out .lb-name{color:#e2d8c8;font-size:31px}
.lb-row.out .lb-wins strong{color:#e3d6ba;font-size:50px}
.lb-row.out .lb-btn{min-height:72px}
.lb-row.tied .lb-btn{box-shadow:inset 0 0 0 1px rgba(241,212,143,.45);background:repeating-linear-gradient(135deg,rgba(241,212,143,.06) 0 8px,transparent 8px 16px)}
.move-tag{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.move-tag.up{background:rgba(241,212,143,.16);color:var(--gold-lite);box-shadow:inset 0 0 0 1px rgba(241,212,143,.6)}
.move-tag.down{background:rgba(110,16,39,.45);color:#ffc5ce;box-shadow:inset 0 0 0 1px rgba(255,143,160,.4)}
/* Avatars: initials only, because the demo singers are fictional */
.av{position:relative;display:grid;place-items:center;width:54px;height:54px;flex:none;border-radius:50%;background:var(--ring);padding:2.5px;font-family:var(--display);font-size:20px;letter-spacing:.04em;color:var(--cream)}
.av>span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 28%,#43284f,#16111b 72%)}
.av.xl{width:112px;height:112px;font-size:42px;padding:3.5px}
.av.out{background:conic-gradient(from 210deg,#6b6470,#3c3842,#6b6470)}
.av.out>span{background:radial-gradient(circle at 35% 28%,#2b2830,#141217 75%);color:#cfc8bd}
/* The cut */
.cut{position:relative;display:grid;grid-template-columns:minmax(24px,1fr) auto minmax(24px,1fr);align-items:center;gap:18px;margin:26px 0 22px}
.cut i{height:2px;background:linear-gradient(90deg,transparent,var(--gold) 25%,var(--gold-lite));transform-origin:100% 50%}
.cut i:last-child{background:linear-gradient(90deg,var(--gold-lite),var(--gold) 75%,transparent);transform-origin:0 50%}
.cut-label{display:grid;justify-items:center;gap:4px;text-align:center}
.cut-label b{font-family:var(--display);font-weight:400;font-size:36px;line-height:1;letter-spacing:.08em;color:var(--gold-lite)}
.cut-label small{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.2;color:var(--cream-2)}
.cut.tie .cut-label b{color:#ffd9a0}
.cut.draw i{animation:rule-in 1.1s var(--ease-out) .2s both}
.cut.draw .cut-label{animation:rise .8s var(--spring) .1s both}
.chase-head{display:flex;justify-content:space-between;gap:12px;padding:0 18px 8px 18px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.lb-list.chase{opacity:.92}
.st-more{display:flex;justify-content:center;margin-top:16px}
.st-empty{display:grid;justify-items:center;gap:12px;padding:56px 24px;border-radius:24px;background:radial-gradient(ellipse 60% 80% at 50% 0%,rgba(90,45,145,.18),transparent 70%);box-shadow:inset 0 0 0 1px var(--line-soft);text-align:center;color:var(--mute)}
.st-empty .icon{width:36px;height:36px;color:var(--gold-hi)}
.st-empty h3{font-family:var(--display);font-weight:400;font-size:44px;line-height:.95;letter-spacing:.02em;color:var(--cream)}
.st-empty p{max-width:460px;font-size:15.5px}
.skel{display:grid;gap:4px}
.skel i{display:block;height:82px;border-radius:16px;background:linear-gradient(90deg,rgba(255,255,255,.03) 0%,rgba(255,255,255,.07) 50%,rgba(255,255,255,.03) 100%);background-size:200% 100%;animation:skel 1.6s linear infinite}
@keyframes skel{from{background-position:100% 0}to{background-position:-100% 0}}
.list-enter .lb-row{animation:rise .7s var(--spring) both;animation-delay:calc(var(--d,0) * 38ms)}
.list-enter .lb-rail::before{animation:rail-in 1.3s var(--ease-out) both;transform-origin:50% 0}
@keyframes rail-in{from{transform:scaleY(0)}to{transform:none}}
.gap-row{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;margin:2px 0;padding:0 18px;border-radius:14px;color:var(--mute);font-size:14px;text-decoration:none;transition:color .3s}
.gap-row::before,.gap-row::after{content:"";flex:1 1 20px;height:1px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0 2px,transparent 2px 9px)}
.gap-row span{flex:none}
.gap-row .icon{flex:none;width:16px;height:16px;margin-left:-4px;color:var(--gold-hi);transition:transform .5s var(--spring)}
.gap-row:hover .icon{transform:translate3d(4px,0,0)}
.gap-row:hover{color:var(--gold-lite)}
@container (max-width:599px){
  .lb-head{grid-template-columns:34px minmax(0,1fr) auto;gap:10px;padding:0 8px 8px 32px;font-size:10px;letter-spacing:.18em}
  .lb-in{padding-left:24px}
  .lb-rail{width:16px}
  .lb-rail::before{left:6px}
  .lb-rail span{font-size:9px;letter-spacing:.22em;top:76px}
  .lb-btn{grid-template-columns:34px auto minmax(0,1fr) auto;gap:10px;min-height:68px;padding:8px 8px}
  .lb-row+.lb-row .lb-btn::before{left:8px;right:8px}
  .lb-rank{font-size:30px}
  .av{width:40px;height:40px;font-size:15px;padding:2px}
  .lb-name{font-size:25px;line-height:.98}
  .lb-meta{font-size:12px;gap:1px 10px}
  .lb-wins strong{font-size:46px}
  .lb-wins small{font-size:9px;letter-spacing:.12em}
  .lb-row.top .lb-btn{min-height:84px}
  .lb-row.top .lb-rank{font-size:36px}
  .lb-row.top .lb-name{font-size:30px}
  .lb-row.top .lb-wins strong{font-size:58px}
  .lb-row.top .av{width:46px;height:46px;font-size:17px}
  .lb-row.first .lb-btn{min-height:100px}
  .lb-row.first .lb-rank{font-size:42px}
  .lb-row.first .lb-name{font-size:36px}
  .lb-row.first .lb-wins strong{font-size:70px}
  .lb-row.first .av{width:52px;height:52px;font-size:19px}
  .lb-row.out .lb-name{font-size:23px}
  .lb-row.out .lb-wins strong{font-size:40px}
  .cut{gap:10px}
  .cut-label b{font-size:28px}
  .cut-label small{font-size:16px}
  .chase-head{padding:0 8px 6px 8px}
  .gap-row{font-size:13px}
}
/* Aside: how the cut works */
.how-cut{display:grid;gap:18px;padding-top:4px}
.how-cut h2{font-family:var(--display);font-weight:400;font-size:52px;line-height:.9;letter-spacing:.02em;color:var(--cream)}
.how-cut h2 .serif{display:block;font-size:.5em;line-height:1.15;color:var(--gold-hi);margin-bottom:6px}
.how-cut ul{display:grid;border-top:1px solid var(--line-soft)}
.how-cut li{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--line-soft);font-size:15px;line-height:1.5;color:var(--mute)}
.how-cut li b{color:var(--cream);font-weight:600}
.how-cut li .icon{margin-top:2px;width:19px;height:19px;color:var(--gold-hi)}
/* Singer detail */
.sd{display:grid;gap:20px;padding:28px;border-radius:28px;background:radial-gradient(ellipse 90% 60% at 30% 0%,rgba(241,212,143,.14),transparent 70%),radial-gradient(ellipse 80% 70% at 100% 100%,rgba(90,45,145,.24),transparent 70%),linear-gradient(180deg,#17121b,#0e0c11);box-shadow:inset 0 0 0 1px var(--line),0 30px 70px rgba(0,0,0,.45)}
.sd.enter{animation:sd-in .6s var(--spring) both}
@keyframes sd-in{from{opacity:0;transform:translate3d(28px,0,0)}to{opacity:1;transform:none}}
.sd-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sd-id{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}
.sd-id p{font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.sd-id h2{margin-top:6px;font-family:var(--display);font-weight:400;font-size:52px;line-height:.9;letter-spacing:.015em;color:var(--cream);overflow-wrap:anywhere}
.sd-id h2:focus{outline:none}
.sd-total{display:flex;align-items:flex-end;gap:6px 18px;padding:18px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.sd-total strong{display:block;font-family:var(--display);font-weight:400;font-size:150px;line-height:.78;color:var(--gold-lite);font-variant-numeric:tabular-nums;text-shadow:0 14px 50px rgba(241,212,143,.25)}
.sd-total>span{font-family:var(--serif);font-style:italic;font-size:26px;line-height:1.1;color:var(--cream);padding-bottom:12px}
.sd-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sd-stats div{padding:2px 0}
.sd-stats dt{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.sd-stats dd{margin-top:4px;font-family:var(--display);font-size:42px;line-height:1;color:var(--cream);font-variant-numeric:tabular-nums}
.meter{display:grid;gap:10px;padding-top:16px}
.meter-track{position:relative;height:10px;border-radius:10px;background:rgba(255,255,255,.07)}
.meter-fill{position:absolute;left:0;top:0;bottom:0;max-width:100%;border-radius:10px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi));transform-origin:0 50%;animation:rule-in 1.1s var(--ease-out) .25s both}
.meter.out .meter-fill{background:linear-gradient(90deg,#5b5560,#a59c8f)}
.meter-cut{position:absolute;top:-6px;bottom:-6px;width:2px;margin-left:-1px;background:var(--cream);box-shadow:0 0 0 2px rgba(8,7,10,.85)}
.meter-cut::after{content:"16th";position:absolute;top:-19px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-2);white-space:nowrap}
.meter p{font-size:15px;color:var(--cream-2)}
.meter p b{color:var(--gold-lite);font-weight:600}
.meter.out p b{color:var(--cream)}
.sd h3{font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.05em;color:var(--cream)}
.timeline{position:relative;display:grid}
.timeline::before{content:"";position:absolute;left:20px;top:10px;bottom:10px;width:1px;background:linear-gradient(180deg,var(--line),var(--line-soft))}
.timeline li{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);gap:1px 14px;align-items:start;padding:8px 0}
.timeline .dot{grid-row:span 2;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;font-family:var(--display);font-size:19px;letter-spacing:.04em;z-index:1}
.timeline .dot.win{background:#2a2112;color:var(--gold-lite);box-shadow:inset 0 0 0 1.5px rgba(241,212,143,.75)}
.timeline .dot.loss{background:#2a0c15;color:#ffc5ce;box-shadow:inset 0 0 0 1.5px rgba(255,143,160,.55)}
.timeline b{font-weight:600;font-size:15px;color:var(--cream);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-top:2px}
.timeline li>span:not(.dot){font-size:13px;color:var(--mute)}
@container (max-width:1099px){.sd.enter{animation-name:sd-up}.sd{padding:22px 20px}.sd-total strong{font-size:124px}.sd-id h2{font-size:44px}}
@keyframes sd-up{from{opacity:0;transform:translate3d(0,28px,0)}to{opacity:1;transform:none}}
.has-detail .st-hide-on-detail{display:none}
@container (min-width:1100px){.has-detail .st-hide-on-detail{display:revert}}
.toast{position:sticky;bottom:18px;z-index:5;display:flex;align-items:center;gap:12px;margin:18px auto 0;max-width:660px;padding:14px 18px;border-radius:16px;background:rgba(21,16,10,.96);box-shadow:inset 0 0 0 1px var(--line-strong),0 18px 40px rgba(0,0,0,.6);font-size:14.5px;line-height:1.5;color:var(--cream);animation:rise .55s var(--spring) both}
.toast .icon{width:20px;height:20px;color:var(--gold-hi)}
.toast b{font-weight:600;color:var(--gold-lite)}

/* ---------- Rules ---------- */
.essentials{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;counter-reset:es}
.essentials li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 18px;padding:24px 0;border-top:1px solid var(--line-soft)}
@container (max-width:599px){.essentials li{grid-template-columns:44px minmax(0,1fr);gap:2px 12px;padding:16px 0}.essentials .n{font-size:40px}}
.essentials li:nth-last-child(-n+2){border-bottom:1px solid var(--line-soft)}
.essentials .n{grid-row:span 2;font-family:var(--display);font-size:56px;line-height:.82;color:transparent;-webkit-text-stroke:1.1px rgba(241,212,143,.7)}
.essentials b{font-family:var(--display);font-weight:400;font-size:clamp(30px,2.8cqi,38px);line-height:.95;letter-spacing:.02em;color:var(--cream)}
.essentials p{font-size:15.5px;color:var(--mute)}
.essentials li.key b{color:var(--gold-lite)}
@container (max-width:899px){.essentials{grid-template-columns:minmax(0,1fr)}.essentials li:nth-last-child(2){border-bottom:0}.essentials .n{font-size:46px}}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line-soft)}
.steps li{position:relative;display:grid;align-content:start;gap:6px;padding:22px 22px 24px 0;transition:opacity .4s}
.steps li+li{padding-left:22px;border-left:1px solid var(--line-soft)}
.steps li::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--gold-hi);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease-out)}
.steps li.active::before{transform:none}
.steps .no{font-family:var(--display);font-size:40px;line-height:.9;color:rgba(241,212,143,.4);transition:color .4s}
.steps li.active .no{color:var(--gold-hi)}
.steps .dur{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.steps h3{font-family:var(--display);font-weight:400;font-size:34px;line-height:.95;letter-spacing:.02em;color:var(--cream)}
.steps p{font-size:14.5px;color:var(--mute)}
@container (max-width:899px){.steps{grid-template-columns:minmax(0,1fr)}.steps li,.steps li+li{padding:18px 0 18px 0;border-left:0;border-bottom:1px solid var(--line-soft)}}
.board-wrap{position:relative;margin-top:26px;padding:26px 28px 28px;border-radius:26px;background:radial-gradient(ellipse 60% 70% at 50% 0%,rgba(90,45,145,.26),transparent 70%),#0d0a11;box-shadow:inset 0 0 0 1px var(--line-soft)}
.board-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px;padding-right:56px}
.board-phase{font-family:var(--display);font-size:30px;letter-spacing:.06em;color:var(--gold-lite)}
.board-caption{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--cream-2)}
.mini-board{display:grid;grid-template-columns:40fr 20fr 40fr;align-items:center;gap:10px}
.team{display:grid;justify-items:center;gap:8px;min-height:210px;padding:18px 10px;border-radius:20px;background:linear-gradient(180deg,#1d1e27,#0f1017 60%);text-align:center}
.team.blue{box-shadow:inset 0 0 0 2px #2f5fc4,0 0 40px rgba(47,95,196,.18)}
.team.red{box-shadow:inset 0 0 0 2px #c4303f,0 0 40px rgba(196,48,63,.18)}
.team .nm{font-size:clamp(14px,1.6cqi,20px);font-weight:700;color:#fff;letter-spacing:.02em}
.team .score{font-family:var(--text);font-size:clamp(36px,5cqi,68px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.team.blue .score{color:#6d9bff}
.team.red .score{color:#ff6b79}
.team .gifts{display:flex;gap:8px;margin-top:auto}
.team .gifts img{width:44px;height:44px;border-radius:10px;box-shadow:0 6px 14px rgba(0,0,0,.4)}
@container (max-width:599px){.team .gifts img{width:30px;height:30px;border-radius:7px}.team .gifts{gap:5px}.board-wrap{padding:18px 14px 20px}.board-top{flex-direction:column;align-items:flex-start;gap:2px}.board-caption{font-size:16px}.vs{width:44px;height:44px;font-size:14px}.clock{font-size:17px;padding:4px 9px}.team{min-height:170px;padding:14px 6px}}
.mid{display:grid;justify-items:center;gap:12px}
.vs{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:linear-gradient(180deg,#2a2b36,#161720);box-shadow:inset 0 0 0 3px #454553;color:#fff;font-size:18px;font-weight:800}
.clock{padding:6px 14px;border-radius:12px;background:#07080d;color:#fff;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.clock.snipe{box-shadow:inset 0 0 0 1.5px #ffcf57;color:#ffe3a0}
.balance{position:relative;height:12px;margin-top:16px;border-radius:12px;overflow:hidden;background:#c4303f}
.balance i{position:absolute;inset:0;background:#2f5fc4;transform-origin:0 50%;transition:transform .45s ease}
.board-result{position:absolute;left:50%;top:56%;display:grid;justify-items:center;gap:6px;width:min(460px,90%);padding:22px 20px;border-radius:20px;background:linear-gradient(160deg,#2a1020,#120a17 60%);box-shadow:inset 0 0 0 1px rgba(214,168,88,.8),0 30px 60px rgba(0,0,0,.5);text-align:center;transform:translate(-50%,-50%) scale(.94);opacity:0;pointer-events:none;transition:opacity .6s,transform .6s var(--spring)}
.board-result.on{opacity:1;transform:translate(-50%,-50%)}
.board-result h4{font-family:var(--display);font-weight:400;font-size:40px;letter-spacing:.05em;color:var(--gold-lite)}
.board-result p{font-size:15px;color:var(--cream-2)}
.board-result p b{color:var(--gold-lite)}
.board-sing{position:absolute;inset:70px 28px 28px;display:grid;justify-items:center;align-content:center;gap:6px;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,rgba(142,80,216,.28),transparent 65%),linear-gradient(180deg,#1a1024,#0c0812);opacity:0;pointer-events:none;transition:opacity .45s}
.board-sing.on{opacity:1}
.board-sing p{font-family:var(--display);font-size:22px;letter-spacing:.3em;color:#ecd8b6}
.board-sing strong{font-family:var(--text);font-size:clamp(56px,7cqi,90px);font-weight:800;line-height:1;color:#fff1c6;font-variant-numeric:tabular-nums}
.board-sing small{font-size:12px;font-weight:700;letter-spacing:.2em;color:#e9f6b8}
.play-toggle{position:absolute;right:18px;top:16px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-mid);background:#0a090c;color:var(--cream);cursor:pointer}
.play-toggle:hover{border-color:var(--line-strong)}
.play-toggle .icon{width:17px;height:17px}
.board-dim .team,.board-dim .mid,.board-dim .balance{opacity:.16;transition:opacity .45s}
/* Rulebook */
.rules-tools{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-bottom:10px}
.rules-tools .search{flex:1 1 300px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.rules-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 10px;margin:12px 0 8px;font-size:13.5px;color:var(--mute)}
.rules-meta-act{display:flex;gap:18px}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:24px}
.sec-mini{margin:0 0 34px;font-family:var(--display);font-weight:400;font-size:clamp(44px,4.4cqi,64px);line-height:.9;letter-spacing:.02em;color:var(--cream)}
.sec-mini .serif{display:block;font-size:.46em;line-height:1.2;color:var(--gold-hi);margin-bottom:6px}
@container (max-width:899px){.chips{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(-1 * var(--gutter));padding:2px var(--gutter);scrollbar-width:none}.chips .chip-btn{flex:none}}
.topics{display:grid;grid-template-columns:minmax(0,1fr);border-top:1px solid var(--line-soft)}
.topic{border-bottom:1px solid var(--line-soft)}
.topic-btn{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:16px;align-items:center;width:100%;min-height:84px;padding:14px 4px;border:0;background:none;text-align:left;cursor:pointer;color:inherit}
.topic-btn .sym{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(241,212,143,.4);color:var(--gold-hi)}
.topic-btn .sym .icon{width:20px;height:20px}
.topic-btn b{display:block;font-family:var(--display);font-weight:400;font-size:32px;line-height:1;letter-spacing:.03em;color:var(--cream);transition:color .25s}
.topic-btn small{display:block;margin-top:4px;font-size:14px;line-height:1.35;color:var(--dim)}
.topic-btn .chev{width:22px;height:22px;color:var(--gold-hi);transition:transform .45s var(--spring)}
.topic-btn:hover b{color:var(--gold-lite)}
.topic.open .chev{transform:rotate(180deg)}
.topic.s5 .topic-btn b{color:var(--gold-lite)}
.topic-body{padding:0 4px 28px 72px;animation:fade-in .4s var(--ease-out)}
@container (max-width:759px){.topic-btn{grid-template-columns:40px minmax(0,1fr) auto;gap:12px}.topic-btn .sym{width:38px;height:38px}.topic-btn b{font-size:26px}.topic-body{padding:0 2px 22px 2px}}
.rule-part+.rule-part{margin-top:22px;padding-top:18px;border-top:1px dashed var(--line-soft)}
.rule-part h4{margin:4px 0 12px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;color:var(--gold-hi);line-height:1.2}
.rules{display:grid;gap:12px;counter-reset:r}
.rules>li{position:relative;padding-left:36px;font-size:15.5px;line-height:1.62;color:#e0d8ca;counter-increment:r}
.rules>li::before{content:counter(r);position:absolute;left:0;top:2px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(241,212,143,.45);color:var(--gold-hi);font-size:12px;font-weight:600}
.rules b{color:var(--cream);font-weight:600}
.rules mark{background:rgba(241,212,143,.3);color:var(--cream);border-radius:3px;padding:0 2px}
.rules code{padding:1px 7px;border-radius:7px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line-soft);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;color:var(--gold-lite)}
.no-results{padding:30px;text-align:center;color:var(--mute)}
.gift-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
.gift-col{min-width:0;padding:12px 14px;border-radius:16px}
.gift-col.b{background:linear-gradient(180deg,rgba(37,106,244,.14),rgba(37,106,244,.04));box-shadow:inset 0 0 0 1px rgba(80,130,255,.4)}
.gift-col.r{background:linear-gradient(180deg,rgba(255,41,62,.13),rgba(255,41,62,.04));box-shadow:inset 0 0 0 1px rgba(255,90,110,.4)}
.gift-col strong{display:block;margin-bottom:6px;font-family:var(--display);font-weight:400;font-size:26px;letter-spacing:.06em}
.gift-col.b strong{color:#9dbcff}
.gift-col.r strong{color:#ff9fae}
.gift-col li{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:4px 0;border-top:1px solid rgba(255,255,255,.07);font-size:14px;line-height:1.3;color:#e4dccf}
.gift-col li>span:last-child{flex:none;color:var(--mute);font-variant-numeric:tabular-nums}
.gift-n{display:flex;align-items:center;gap:10px;min-width:0}
.gift-n img{width:34px;height:34px;border-radius:8px;flex:none}
.gift-n .gift-blank{display:grid;place-items:center;width:34px;height:34px;flex:none}
.gift-n .gift-blank::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.55}
.gift-col.b .gift-blank{color:#7fa6ff}
.gift-col.r .gift-blank{color:#ff8b98}
.ack-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line-mid)}
.ack-btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:0;background:rgba(241,212,143,.12);box-shadow:inset 0 0 0 1px rgba(241,212,143,.55);color:var(--gold-lite);font-size:14.5px;font-weight:600;cursor:pointer}
.ack-btn[aria-pressed="true"]{background:rgba(120,190,140,.14);box-shadow:inset 0 0 0 1px rgba(150,210,165,.55);color:#cfeed6}
.ack-btn .icon{width:18px;height:18px}
.topic.acked .sym{box-shadow:inset 0 0 0 1px rgba(150,210,165,.6);color:#cfeed6;background:rgba(120,190,140,.12)}

/* ---------- Powers ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
@container (max-width:599px){.tabs{flex-wrap:nowrap;overflow-x:auto;margin-left:calc(-1 * var(--gutter));margin-right:calc(-1 * var(--gutter));padding:2px var(--gutter);scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs .chip-btn{flex:none}}
.pw-page{padding-bottom:110px}
.pw-intro{max-width:640px;margin:0 0 26px;font-size:16px;color:var(--mute)}
.pw-note{margin-top:28px;font-size:15px;color:var(--mute);text-align:center}
.pw-note .btn-text{display:inline-flex;min-height:0;font-size:15px}
.pw-statement{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;margin:0 0 34px;padding:18px 22px;border-radius:18px;background:radial-gradient(ellipse 70% 100% at 0% 50%,rgba(241,212,143,.12),transparent 70%);box-shadow:inset 0 0 0 1px var(--line)}
.pw-statement .icon{width:28px;height:28px;color:var(--gold-hi)}
.pw-statement p{font-size:15.5px;color:var(--cream-2)}
.pw-statement b{color:var(--cream);font-weight:600}
.pw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr));gap:22px}
.pw-card{position:relative;display:flex;flex-direction:column;border-radius:26px;background:linear-gradient(180deg,#141018,#0d0b10);box-shadow:inset 0 0 0 1px var(--line-soft);overflow:hidden;animation:rise .7s var(--spring) both;animation-delay:calc(var(--d,0) * 55ms);transition:box-shadow .35s,transform .6s var(--spring)}
.pw-card:hover{box-shadow:inset 0 0 0 1px var(--line);transform:translate3d(0,-4px,0)}
.pw-art{position:relative;display:grid;place-items:center;height:250px;background:radial-gradient(circle at 50% 58%,rgba(241,212,143,.22),transparent 60%),radial-gradient(ellipse 80% 60% at 50% 110%,rgba(110,16,39,.35),transparent 70%)}
.pw-art img{width:210px;height:210px;object-fit:contain;filter:drop-shadow(0 18px 28px rgba(0,0,0,.7));transition:transform .8s var(--spring-pop)}
.pw-card:hover .pw-art img{transform:translate3d(0,-6px,0) scale(1.04)}
.pw-ph{display:grid;place-items:center;width:190px;height:190px;border-radius:28px;background:radial-gradient(circle at 50% 38%,#2c2116,#0d0b09 70%);box-shadow:inset 0 0 0 2px rgba(217,178,95,.7),inset 0 0 0 9px #0b0a0e,inset 0 0 0 10px rgba(217,178,95,.3);font-family:var(--display);font-size:72px;line-height:1;color:var(--gold-lite);text-align:center}
.pw-ph small{display:block;margin-top:8px;font-family:var(--text);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.pw-tag{margin:0 0 -4px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi)}
@container (max-width:599px){.pw-art{height:210px}.pw-art img{width:176px;height:176px}.pw-ph{width:160px;height:160px;font-size:60px}.pw-body{padding:18px 18px 20px}.pw-body h3{font-size:38px}.pw-plain{font-size:21px}}
.pw-body{display:flex;flex-direction:column;gap:12px;padding:22px 24px 24px;flex:1}
.pw-body h3{font-family:var(--display);font-weight:400;font-size:42px;line-height:.92;letter-spacing:.02em;color:var(--cream)}
.pw-plain{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.25;color:var(--gold-lite)}
.pw-body>p.d{font-size:15px;line-height:1.55;color:var(--mute)}
.pw-body>p.d b{color:var(--cream);font-weight:600}
.pw-facts{display:grid;gap:0;border-top:1px solid var(--line-soft)}
.pw-facts div{display:grid;grid-template-columns:6.4em minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.pw-facts dt{font-size:10.5px;font-weight:600;line-height:1.9;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi)}
.pw-facts dd{margin:0;font-size:14px;line-height:1.5;color:#ddd4c6}
.pw-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:8px}
.pw-price{font-family:var(--display);font-size:38px;line-height:1;color:var(--cream)}
.pw-price small{display:block;font-family:var(--text);font-size:11px;letter-spacing:.06em;color:var(--dim)}
.buy-off{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px dashed var(--line-mid);background:transparent;color:var(--mute);font-size:13.5px;cursor:not-allowed}
.buy-off .icon{width:16px;height:16px}
.pw-code{align-self:flex-start;padding:4px 12px;border-radius:999px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px var(--line-soft);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;color:var(--gold-lite)}
.moment{display:grid;justify-items:center;gap:8px;padding:20px 22px;border-radius:120px 120px 18px 18px;background:radial-gradient(circle at 50% 0,rgba(231,191,118,.22),transparent 60%),linear-gradient(160deg,#2a1224,#100915);box-shadow:inset 0 0 0 1px rgba(214,168,88,.85),inset 0 0 0 7px #120a16,inset 0 0 0 8px rgba(214,168,88,.35);text-align:center;min-width:230px}
.moment .icon{width:30px;height:30px;color:#f5d799}
.moment b{font-family:var(--display);font-weight:400;font-size:32px;letter-spacing:.07em;color:#f5d799}
.moment small{font-size:12.5px;letter-spacing:.06em;color:#dacbe0}
.retired{margin-top:40px;padding-top:24px;border-top:1px solid var(--line-soft);font-size:14.5px;color:var(--mute)}
.retired h3{font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.04em;color:var(--cream);margin-bottom:10px}
.retired ul{display:grid;gap:8px}
.retired li{padding-left:18px;position:relative}
.retired li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--gold-deep)}
.member-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:30px;padding:20px 24px;border-radius:20px;background:radial-gradient(ellipse 60% 140% at 0% 50%,rgba(110,16,39,.45),transparent 70%),rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--line);font-size:15px;color:var(--cream-2)}
.member-band b{color:var(--cream);font-weight:600}

/* ---------- Champions page ---------- */
.feature{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:0;align-items:stretch;border-radius:32px;overflow:hidden;background:#0e0b12;box-shadow:inset 0 0 0 1px var(--line),0 40px 90px rgba(0,0,0,.5)}
.feature-art{position:relative;min-height:560px;overflow:hidden}
.feature-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.feature-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#0e0b12),linear-gradient(0deg,rgba(14,11,18,.5),transparent 30%)}
.feature-copy{position:relative;display:grid;align-content:center;gap:14px;padding:56px 56px 56px 32px;background:radial-gradient(ellipse 80% 60% at 100% 0%,rgba(90,45,145,.28),transparent 70%)}
.feature-copy h2{font-family:var(--display);font-weight:400;font-size:clamp(90px,10cqi,150px);line-height:.8;letter-spacing:.01em;color:var(--cream)}
.feature-copy .serif.big{font-size:32px;line-height:1.15;color:var(--gold-hi)}
.feature-copy p{font-size:16.5px;color:var(--cream-2);max-width:440px}
.handle{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--gold-hi);font-size:15px;font-weight:600;text-decoration:none}
.handle .icon{width:16px;height:16px}
@container (max-width:899px){.feature{grid-template-columns:minmax(0,1fr)}.feature-art{min-height:0;aspect-ratio:1/1}.feature-art::after{background:linear-gradient(180deg,transparent 55%,#0e0b12)}.feature-copy{margin-top:-90px;padding:0 22px 30px}}

.ch-page,.sp-page,.ac-page{padding-bottom:110px}
.past .past-row div{display:grid;gap:4px;min-width:0}
.past-row .serif{display:block;font-size:17px;line-height:1.3;color:var(--mute)}
.past-row img{width:96px;height:96px}
.past-row{grid-template-columns:96px minmax(0,1fr) auto;gap:22px;padding:22px 0}
.handle.sm{min-height:36px;font-size:14px}
.next-champ{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px 34px;margin-top:20px;padding:30px 34px;border-radius:28px;background:radial-gradient(ellipse 60% 120% at 0% 50%,rgba(241,212,143,.12),transparent 70%),radial-gradient(ellipse 50% 100% at 100% 50%,rgba(90,45,145,.22),transparent 70%),#0e0b12;box-shadow:inset 0 0 0 1px var(--line)}
.next-champ .ph{display:grid;place-items:center;width:104px;height:104px;border-radius:50%;border:1.5px dashed rgba(241,212,143,.6);color:var(--gold-hi)}
.next-champ .ph .icon{width:40px;height:40px;stroke-width:1.5}
.next-champ h2{margin-top:8px;font-family:var(--display);font-weight:400;font-size:clamp(40px,4.2cqi,60px);line-height:.92;letter-spacing:.02em;color:var(--cream)}
.next-champ p{font-size:15.5px;color:var(--mute);max-width:520px}
.next-champ .next-side{display:grid;justify-items:end;gap:14px}
.next-prize{display:flex;align-items:baseline;gap:10px}
.next-prize b{font-family:var(--display);font-weight:400;font-size:64px;line-height:.86;color:var(--gold-lite)}
.next-prize .serif{font-size:22px;color:var(--gold-hi)}
@container (max-width:899px){.next-champ{grid-template-columns:minmax(0,1fr);padding:24px 22px}.next-champ .next-side{justify-items:start}.next-champ .ph{width:80px;height:80px}.past-row{grid-template-columns:72px minmax(0,1fr);gap:16px}.past-row img{width:72px;height:72px}.past-row .amt{grid-column:2;font-size:26px}}
.panel-h{font-size:clamp(34px,3cqi,42px)!important}
.panel-sub{margin-top:8px;font-family:var(--display);font-weight:400;font-size:28px;letter-spacing:.04em;color:var(--cream)}
.saved.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.saved.three div{padding:14px 12px}
.saved.three dd{font-size:34px}
/* ---------- Enter ---------- */
.enter-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:40px 72px;align-items:end}
.enter-hero .page-title{font-size:clamp(76px,8.6cqi,132px)}
.enter-side{display:grid;justify-items:start}
.enter-side .checks{width:100%;margin-top:26px}
.free-sub{display:block;margin-top:8px;font-size:28px;line-height:1.1;color:var(--cream)}
.free-mark{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(130px,15cqi,220px);line-height:.76;letter-spacing:.01em;background:linear-gradient(180deg,#fff2c8,#f1d48f 50%,#a87b33);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.free-mark+.serif{display:block;margin-top:6px;font-size:28px;color:var(--cream)}
.checks{display:grid;border-top:1px solid var(--line-soft)}
.checks li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--line-soft);font-size:15.5px;color:var(--mute)}
.checks li b{color:var(--cream);font-weight:600}
.checks .icon{margin-top:3px;width:20px;height:20px;color:var(--gold-hi)}
@container (max-width:899px){.enter-hero{grid-template-columns:minmax(0,1fr)}}
.flow{display:grid;gap:22px;padding:34px;border-radius:30px;background:radial-gradient(ellipse 60% 50% at 0% 0%,rgba(110,16,39,.32),transparent 70%),radial-gradient(ellipse 60% 60% at 100% 100%,rgba(90,45,145,.2),transparent 70%),#0e0b11;box-shadow:inset 0 0 0 1px var(--line)}
@container (max-width:759px){.flow{padding:20px 16px;border-radius:24px}}
.stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.stepper li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;font-size:14px;line-height:1.25;color:var(--mute)}
.stepper .n{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-mid);font-family:var(--display);font-size:20px;color:var(--mute);transition:background .4s,box-shadow .4s,color .4s}
.stepper b{display:block;font-weight:600;color:var(--cream-2);font-size:14.5px}
.stepper small{display:block;font-size:12px;color:var(--dim)}
.stepper li[data-state="current"] .n{background:rgba(241,212,143,.16);box-shadow:inset 0 0 0 1.5px var(--gold-hi);color:var(--gold-lite)}
.stepper li[data-state="current"] b{color:var(--gold-lite)}
.stepper li[data-state="done"] .n{background:rgba(120,190,140,.16);box-shadow:inset 0 0 0 1.5px rgba(150,210,165,.7);color:#cfeed6}
@container (max-width:759px){.stepper{gap:4px}.stepper li{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:6px}.stepper b{font-size:11.5px}.stepper small{display:none}.stepper .n{width:34px;height:34px;font-size:17px}}
.flow-bar{height:3px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.flow-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi));transform-origin:0 50%;transition:transform .8s var(--spring)}
.notice{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px var(--line-soft);font-size:14.5px;color:var(--cream-2)}
.notice.err{background:rgba(110,16,39,.35);box-shadow:inset 0 0 0 1px rgba(255,143,160,.55);color:#ffdbe1}
.reader-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.reader-head strong{font-family:var(--display);font-weight:400;font-size:32px;letter-spacing:.03em;color:var(--cream)}
.accept-box{display:grid;gap:12px;padding:22px;border-radius:20px;background:rgba(255,255,255,.025);box-shadow:inset 0 0 0 1px var(--line)}
.accept-box h3,.form-card h3{font-family:var(--display);font-weight:400;font-size:34px;line-height:1;letter-spacing:.03em;color:var(--cream)}
.check{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:8px 0;font-size:15px;line-height:1.5;color:#e0d8ca;cursor:pointer}
.check input{width:22px;height:22px;margin:1px 0 0;flex:none;accent-color:#d9b25f}
.check.locked{opacity:.5;cursor:not-allowed}
.form-card{display:grid;gap:18px}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@container (max-width:759px){.fields{grid-template-columns:minmax(0,1fr)}}
.field{display:grid;gap:8px;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:var(--cream-2)}
.field input,.field select{width:100%;min-height:52px;padding:0 16px;border:0;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line-mid);color:var(--cream);font-size:16px;font-weight:400;transition:box-shadow .25s,background .25s}
.field input:focus,.field select:focus{outline:none;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1.5px var(--gold-hi),0 0 0 4px rgba(241,212,143,.16)}
.field input[disabled],.field select[disabled]{color:var(--dim);background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 8px,transparent 8px 16px);cursor:not-allowed}
.field small{font-weight:400;font-size:12.5px;line-height:1.45;color:var(--dim)}
.field .lock{display:inline-flex;align-items:center;gap:6px;color:var(--gold-hi)}
.field .lock .icon{width:14px;height:14px}
.agree{display:grid;gap:2px;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--line-soft)}
.agree legend{padding:0 6px;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi)}
.actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.pending{display:grid;justify-items:center;gap:16px;padding:44px 24px;border-radius:26px;background:radial-gradient(ellipse 60% 70% at 50% 0%,rgba(241,212,143,.16),transparent 70%);text-align:center}
.seal{position:relative;display:grid;place-items:center;width:108px;height:108px;border-radius:50%;background:var(--ring);padding:3px;animation:seal-in .9s var(--spring-pop) both}
.seal span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#3a2a20,#120f0c 75%);color:var(--gold-lite)}
.seal .icon{width:44px;height:44px;stroke-width:2}
.seal::after{content:"";position:absolute;inset:-12px;border-radius:50%;box-shadow:0 0 0 1px rgba(241,212,143,.45);animation:seal-ring 1.6s var(--ease-out) .3s both}
@keyframes seal-in{from{opacity:0;transform:scale(.6) rotate(-12deg)}to{opacity:1;transform:none}}
@keyframes seal-ring{from{opacity:.9;transform:scale(.85)}to{opacity:0;transform:scale(1.3)}}
.pending h3{font-family:var(--display);font-weight:400;font-size:clamp(44px,6cqi,56px);line-height:.9;letter-spacing:.02em;color:var(--cream)}
.pending p{max-width:520px;color:var(--mute);font-size:15.5px}
.ref{display:inline-flex;gap:10px;padding:8px 16px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(241,212,143,.5);font-size:13px;font-weight:600;letter-spacing:.03em;white-space:nowrap;color:var(--gold-hi)}
.next-steps{display:grid;width:100%;max-width:560px;text-align:left;border-top:1px solid var(--line-soft)}
.next-steps li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;padding:14px 0;border-bottom:1px solid var(--line-soft);font-size:15px;color:var(--mute)}
.next-steps li b{color:var(--cream);font-weight:600}
.next-steps .n{font-family:var(--display);font-size:28px;line-height:1;color:var(--gold-hi)}
.stage-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line-soft)}
.stage-steps li{display:grid;align-content:start;gap:6px;padding:26px 26px 26px 0}
.stage-steps li+li{padding-left:26px;border-left:1px solid var(--line-soft)}
.stage-steps .no{font-family:var(--display);font-size:52px;line-height:.85;color:transparent;-webkit-text-stroke:1.1px rgba(241,212,143,.7)}
.stage-steps .dur{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.stage-steps h3{font-family:var(--display);font-weight:400;font-size:36px;line-height:.95;letter-spacing:.02em;color:var(--cream)}
.stage-steps p{font-size:15px;color:var(--mute)}
@container (max-width:899px){.stage-steps{grid-template-columns:minmax(0,1fr)}.stage-steps li,.stage-steps li+li{padding:20px 0;border-left:0;border-bottom:1px solid var(--line-soft)}}

/* ---------- Panels (prize, members, account) ---------- */
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
@container (max-width:899px){.two{grid-template-columns:minmax(0,1fr)}}
.panel{display:grid;gap:16px;padding:32px;border-radius:28px;background:linear-gradient(180deg,#131017,#0d0b10);box-shadow:inset 0 0 0 1px var(--line-soft)}
.panel.lit{background:radial-gradient(ellipse 70% 60% at 0% 0%,rgba(110,16,39,.45),transparent 70%),linear-gradient(180deg,#151017,#0d0b10);box-shadow:inset 0 0 0 1px var(--line)}
.panel h2{font-family:var(--display);font-weight:400;font-size:clamp(40px,3.8cqi,54px);line-height:.92;letter-spacing:.02em;color:var(--cream)}
.panel h2 .serif{display:block;font-size:.5em;color:var(--gold-hi);margin-bottom:4px}
.panel>p{font-size:15px;color:var(--mute)}
@container (max-width:759px){.panel{padding:22px;border-radius:24px}}
.prize-now{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.prize-now strong{font-family:var(--display);font-weight:400;font-size:120px;line-height:.8;color:var(--gold-lite)}
.prize-now span{font-family:var(--serif);font-style:italic;font-size:28px;color:var(--cream)}
.amounts{display:flex;flex-wrap:wrap;gap:8px}
.amounts button{min-width:84px;min-height:52px;padding:0 16px;border:0;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line-mid);color:var(--cream);font-family:var(--display);font-size:26px;letter-spacing:.04em;cursor:pointer;transition:box-shadow .25s,background .25s,color .25s}
.amounts button[aria-pressed="true"]{background:rgba(241,212,143,.16);box-shadow:inset 0 0 0 1.5px var(--gold-hi);color:var(--gold-lite)}
.empty-line{display:flex;align-items:center;gap:12px;padding:16px 18px;border-radius:16px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 8px,transparent 8px 16px);box-shadow:inset 0 0 0 1px var(--line-soft);font-size:14.5px;color:var(--mute)}
.empty-line .icon{width:20px;height:20px;color:var(--gold-hi)}
.m-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line-soft)}
.m-steps li{display:grid;gap:6px;padding:24px 24px 24px 0}
.m-steps li+li{padding-left:24px;border-left:1px solid var(--line-soft)}
.m-steps .no{font-family:var(--display);font-size:46px;line-height:.85;color:transparent;-webkit-text-stroke:1.1px rgba(241,212,143,.7)}
.m-steps .dur{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.m-steps h3{font-family:var(--display);font-weight:400;font-size:32px;line-height:1;letter-spacing:.02em;color:var(--cream)}
.m-steps p{font-size:14.5px;color:var(--mute)}
@container (max-width:899px){.m-steps{grid-template-columns:minmax(0,1fr)}.m-steps li,.m-steps li+li{padding:18px 0;border-left:0;border-bottom:1px solid var(--line-soft)}}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line-soft)}
.seg button{min-height:44px;border:0;border-radius:999px;background:none;color:var(--mute);font-size:14.5px;font-weight:500;cursor:pointer;transition:background .3s,color .3s}
.seg button[aria-pressed="true"]{background:rgba(241,212,143,.16);color:var(--gold-lite);box-shadow:inset 0 0 0 1px rgba(241,212,143,.5)}
.saved{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line-soft)}
.saved div{padding:18px 16px;border-bottom:1px solid var(--line-soft)}
.saved div:not(:nth-child(3n+1)){border-left:1px solid var(--line-soft)}
.saved dt{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.saved dd{margin-top:6px;font-family:var(--display);font-size:44px;line-height:1;color:rgba(246,239,224,.35)}
@container (max-width:599px){.saved{grid-template-columns:repeat(2,minmax(0,1fr))}.saved div:not(:nth-child(3n+1)){border-left:0}.saved div:nth-child(2n){border-left:1px solid var(--line-soft)}}
.cmd{display:flex;gap:8px;align-items:center;padding:12px 16px;border-radius:14px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 8px,transparent 8px 16px);box-shadow:inset 0 0 0 1px var(--line-soft);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13.5px;color:var(--dim)}
.shortcuts{display:flex;flex-wrap:wrap;gap:10px}

/* ---------- On-stream band (transparent overlay, 900 x 280 at 1080-wide stream scale) ---------- */
.sg-root{position:relative;width:900px;font-family:var(--text);color:var(--cream);background:transparent}
.sg-band{position:relative;display:grid;grid-template-columns:300px 2px minmax(0,1fr);align-items:stretch;width:900px;height:280px;border-radius:30px;background:linear-gradient(180deg,rgba(22,18,27,.95),rgba(10,9,12,.96));box-shadow:inset 0 0 0 2px rgba(217,178,95,.6),0 22px 50px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.12);overflow:hidden}
/* Left panel: event identity on top, a full-width status strip at the foot. Sizes are set so the band still
   reads at ~295 px wide (scale 0.33): status 40px -> ~13px, Top 16 · Nov 17 50px -> ~16px, names 52px -> ~17px. */
.sg-id{display:grid;grid-template-rows:minmax(0,1fr) 62px;min-width:0;background:radial-gradient(ellipse 120% 90% at 0% 0%,rgba(110,16,39,.6),transparent 70%)}
.sg-brand{display:flex;flex-direction:column;justify-content:center;gap:12px;min-height:0;padding:6px 16px 0 28px}
.sg-id b{font-family:var(--display);font-weight:400;font-size:58px;line-height:.86;letter-spacing:.02em;color:var(--gold-hi)}
.sg-id strong{font-family:var(--display);font-weight:400;font-size:50px;line-height:.95;letter-spacing:.01em;white-space:nowrap;color:#fffaf0}
.sg-state{display:flex;align-items:center;margin:0;padding:4px 12px 0 26px;font-family:var(--display);font-size:40px;line-height:1;letter-spacing:.04em;white-space:nowrap;overflow:hidden}
.sg-state.st-preview{color:#fffaf0;background:repeating-linear-gradient(-45deg,rgba(241,212,143,.24) 0 8px,rgba(241,212,143,.07) 8px 16px);box-shadow:inset 0 2px 0 rgba(241,212,143,.5)}
.sg-state.st-published{color:#1a1206;background:linear-gradient(180deg,#f6dfa4,#dcb565)}
.sg-state.st-stale{color:#ffe3b8;background:linear-gradient(180deg,#6c1226,#430b18);box-shadow:inset 0 2px 0 #e05a72}
.sg-state.st-loading{color:#d8cfc2;background:#1d1b21;box-shadow:inset 0 2px 0 rgba(255,255,255,.12)}
.sg-div{background:linear-gradient(180deg,transparent,#d9b25f 30%,#f1d48f 50%,#d9b25f 70%,transparent)}
/* Right side: one view at a time (Active battle, then Top 3). Rank, photo, name and total wins share one row,
   so each number is attached to its person. Sizes at 295 px wide: battle names ~17 px, wins ~23 px; top-3 names ~15 px. */
.sg-body{position:relative;min-width:0;padding:12px 30px 14px 26px}
.sg-view{display:flex;flex-direction:column;height:100%}
.sg-view.g0{animation:sg-view-a .5s var(--ease-out) both}
.sg-view.g1{animation:sg-view-b .5s var(--ease-out) both}
.sg-band.sg-leaving .sg-view.sg-view{animation:sg-out .3s ease both}
/* Not current: the panel may cross-fade when the view rotates, but nothing rises or replays as a new result,
   and a change of status alone never restarts an animation (the animation names stay the same). */
.sg-view.still,.sg-view.still .sg-row{transform:none!important}
.sg-view.still .sg-row{opacity:1!important}
@keyframes sg-out{from{opacity:1}to{opacity:0}}
@keyframes sg-view-a{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
@keyframes sg-view-b{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}
.sg-label{display:flex;align-items:baseline;justify-content:space-between;gap:16px;height:36px;margin:0 0 4px;font-family:var(--display);font-size:32px;line-height:1;letter-spacing:.1em;white-space:nowrap;color:var(--gold-hi)}
.sg-label .sg-col{font-size:28px;letter-spacing:.12em;color:#bdb19e}
.sg-rows{display:flex;flex-direction:column;justify-content:center;flex:1;min-height:0}
.sg-rows.top{gap:4px}
.sg-row{display:grid;grid-template-columns:56px 54px minmax(0,1fr) auto;align-items:center;column-gap:14px;height:66px}
.sg-row.big{grid-template-columns:56px 72px minmax(0,1fr) auto;column-gap:14px;height:80px}
.sg-rank{font-family:var(--display);font-size:48px;line-height:1;color:var(--gold-hi);text-align:center;white-space:nowrap}
.sg-row.big .sg-rank{font-size:44px}
.sg-name{font-family:var(--display);font-size:46px;line-height:1;letter-spacing:.02em;color:#fffaf0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-row.big .sg-name{font-size:52px}
.sg-name.unknown,.sg-row.big .sg-name.unknown{font-family:var(--text);font-size:30px;font-weight:600;letter-spacing:.02em;color:#c9bfb0}
.sg-wins{min-width:1.1em;font-family:var(--display);font-size:60px;line-height:.9;color:var(--gold-hi);font-variant-numeric:tabular-nums;text-align:right}
.sg-row.big .sg-wins{min-width:0;font-size:70px}
.sg-wins.unknown{color:#bfb5a6}
/* Profile picture: a photo only once that exact singer's photo has loaded; initials on a tint until then or if it fails. */
.sg-av{position:relative;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.16),transparent 62%),var(--tint,#2a282e);box-shadow:0 4px 14px rgba(0,0,0,.45)}
.sg-row.big .sg-av{width:72px;height:72px}
.sg-av b{font-family:var(--display);font-weight:400;font-size:26px;line-height:1;letter-spacing:.04em;color:#fff4dc}
.sg-row.big .sg-av b{font-size:32px}
.sg-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.sg-av::after{content:'';position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(241,212,143,.78)}
.sg-vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;height:30px}
.sg-vs i{height:3px;border-radius:3px;background:linear-gradient(90deg,transparent,rgba(241,212,143,.8))}
.sg-vs i:last-child{background:linear-gradient(90deg,rgba(241,212,143,.8),transparent)}
.sg-vs span{font-family:var(--display);font-size:34px;line-height:1;letter-spacing:.08em;color:#1a1206;background:var(--gold-hi);border-radius:10px;padding:3px 12px 1px}
.sg-calm{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px;padding-left:4px}
.sg-calm b{font-family:var(--display);font-weight:400;font-size:56px;line-height:.95;letter-spacing:.02em;color:#fffaf0}
.sg-calm>span{font-family:var(--display);font-size:34px;line-height:1.05;letter-spacing:.03em;color:#cfc4b2}
.sg-rows.skel .sg-rank{display:block;width:30px;height:30px;margin:auto;border-radius:6px;background:rgba(255,255,255,.07)}
.sg-rows.skel .sg-av{background:rgba(255,255,255,.06)}
.sg-rows.skel .sg-av::after{box-shadow:inset 0 0 0 2px rgba(255,255,255,.08)}
.sg-bar{display:block;height:26px;border-radius:8px;background:rgba(255,255,255,.07)}
.sg-bar.w{width:56px;justify-self:end}
.sg-view.g0 .sg-rows.top .sg-row,.sg-view.g1 .sg-rows.top .sg-row{animation:sg-row-in .55s var(--ease-out) both;animation-delay:calc(var(--k,0) * 70ms)}
@keyframes sg-row-in{from{opacity:0;transform:translate3d(0,12px,0)}to{opacity:1;transform:none}}
/* Not current: gray numbers, gray rings and photos, no rise; the label says "last known" / "last published". */
.sg-band.is-stale .sg-rank,.sg-band.is-stale .sg-wins{color:#bfb5a6}
.sg-band.is-stale .sg-name{color:#e4dbcf}
.sg-band.is-stale .sg-label{color:#d8cfc2}
.sg-band.is-stale .sg-av{filter:grayscale(1) brightness(.85)}
.sg-band.is-stale .sg-av::after{box-shadow:inset 0 0 0 2px #a49c90}
.sg-band.is-stale .sg-div{background:linear-gradient(180deg,transparent,#8a8275 30%,#a49c90 50%,#8a8275 70%,transparent)}
.sg-band.is-stale .sg-vs span{background:#bfb5a6}
.sg-band.is-stale .sg-vs i{background:linear-gradient(90deg,transparent,#a49c90)}
.sg-band.is-stale .sg-vs i:last-child{background:linear-gradient(90deg,#a49c90,transparent)}
.sg-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px;width:max-content;max-width:100%;margin-top:16px;padding:6px 14px 6px 6px;border-radius:999px;background:#0c0b0f;box-shadow:inset 0 0 0 1px var(--line-mid)}
.sg-seg{display:flex;gap:2px;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-mid)}
.sg-seg button{min-height:38px;padding:0 14px;border:0;border-radius:999px;background:none;color:var(--cream-2);font:600 13px/1 var(--text);cursor:pointer}
.sg-seg button[aria-pressed="true"]{background:rgba(241,212,143,.16);color:var(--gold-hi)}
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--line)}
.pill.dim{color:var(--mute);box-shadow:inset 0 0 0 1px var(--line-mid)}

/* ---------- Scroll reveal (Home). Content is only hidden once the component is running, and never under reduced motion. ---------- */
.rv-ready .rv{opacity:0;transform:translate3d(0,28px,0);transition:opacity .9s var(--ease-out),transform 1.2s var(--ease-out)}
.rv-ready .rv.in{opacity:1;transform:none}
.rv-ready .rv.in .road-step,.rv-ready .rv.in .lin,.rv-ready .rv.in.shelf>a,.rv-ready .rv.in.more-band>a{animation:rise .9s var(--spring) both}
.rv-ready .rv.in .road-step:nth-child(2),.rv-ready .rv.in .lin:nth-child(2),.rv-ready .rv.in.shelf>a:nth-child(2),.rv-ready .rv.in.more-band>a:nth-child(2){animation-delay:.09s}
.rv-ready .rv.in .road-step:nth-child(3),.rv-ready .rv.in .lin:nth-child(3),.rv-ready .rv.in.shelf>a:nth-child(3),.rv-ready .rv.in.more-band>a:nth-child(3){animation-delay:.18s}
.rv-ready .rv.in .lin:nth-child(4){animation-delay:.27s}
.rv-ready .rv.in .lin:nth-child(5){animation-delay:.36s}
.rm .rv{opacity:1!important;transform:none!important}

/* ---------- Reduced motion ---------- */
.rm *,.rm *::before,.rm *::after{animation:none!important;transition:none!important}
.rm .subject{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .subject{opacity:1;transform:none}
  .rv-ready .rv{opacity:1;transform:none}
  .hero:not(.copy-in) .hero-copy>*,.hero:not(.copy-in) .champ-tag>*,.hero:not(.copy-in) .scroll-cue,.hero:not(.type-in) .masthead .ch,.hero:not(.stage-in) .hero-stage{opacity:1}
}

/* ---------- Band legibility check board (design review only, not part of the site) ---------- */
.sgk-head{max-width:1100px;margin-bottom:40px}
.sgk-title{margin:14px 0 0;font-family:var(--display);font-weight:400;font-size:64px;line-height:.9;letter-spacing:.02em;color:#fffaf0}
.sgk-intro{margin:16px 0 0;font-size:17px;line-height:1.55;color:var(--cream-2)}
.sgk-row{display:flex;align-items:flex-start;gap:64px}
.sgk-col{display:grid;gap:10px;justify-items:start}
.sgk-h{margin:0;font-family:var(--display);font-weight:400;font-size:34px;line-height:1;letter-spacing:.03em;color:var(--gold-hi)}
.sgk-cap{margin:0 0 6px;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--cream-2)}
.sgk-frame{position:relative;overflow:hidden;border-radius:18px;background:#050507;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.sgk-ui{position:absolute;left:18px;right:18px;display:flex;align-items:center;gap:10px}
.sgk-ui .dot{display:block;width:30px;height:30px;border-radius:50%;background:#2a2a30}
.sgk-ui .bar{display:block;height:12px;border-radius:6px;background:#2a2a30}
.sgk-ui .sp{flex:1}
.sgk-cam{position:absolute;display:grid;place-items:center}
.sgk-cam.host{background:linear-gradient(160deg,#3a3440,#5a4a4c)}
.sgk-cam.guest{background:linear-gradient(160deg,#283a3c,#34384c)}
.sgk-cam span{font-size:15px;font-weight:600;letter-spacing:.06em;color:rgba(255,255,255,.75)}
.sgk-band{position:absolute}
.sgk-band.rel{position:relative}
.sgk-scale{width:900px;transform-origin:0 0}
.sgk-chat{position:absolute;left:18px;right:18px;display:grid;gap:12px}
.sgk-chat i{display:block;height:14px;border-radius:7px;background:#1d1d22}
.sgk-measure{margin:6px 0 0;max-width:600px;font-size:14px;line-height:1.5;color:var(--gold-hi);font-variant-numeric:tabular-nums}
.sgk-states{display:grid;gap:30px}
.sgk-state{display:grid;gap:10px}
.sgk-label{margin:0;max-width:709px;font-size:15px;line-height:1.4;color:var(--cream-2)}
.sgk-label b{color:#fffaf0;font-weight:600}
.sgk-pair{display:flex;align-items:flex-start;gap:24px}
.sgk-note{margin:34px 0 0;max-width:1100px;font-size:15px;line-height:1.55;color:var(--cream-2)}
.sgk-h2{margin:64px 0 24px;font-family:var(--display);font-weight:400;font-size:40px;line-height:1;letter-spacing:.03em;color:#fffaf0}
.sgk-grid{display:grid;grid-template-columns:repeat(2,709px);gap:34px 64px}
.sgk-intro b{color:#fffaf0;font-weight:600}

.s5-purchase{box-sizing:border-box;position:fixed;margin:auto;width:min(520px,calc(100vw - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:32px;border:1px solid #716443;border-radius:14px;background:#141116;color:#f6efe0;font:15px/1.55 Outfit,'Segoe UI',sans-serif;box-shadow:0 20px 80px #000b}.s5-purchase::backdrop{background:#050306c9}.s5-purchase h2{margin:6px 32px 12px 0;font:42px/1.1 'Bebas Neue',sans-serif;letter-spacing:.01em}.s5-purchase p{margin:12px 0}.s5-purchase-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border:1px solid #847869;border-radius:50%;background:transparent;color:inherit;font:26px/1 sans-serif;cursor:pointer}.s5-purchase-kicker{color:#d2b267;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700}.s5-purchase-price{font-size:30px;font-weight:700;color:#e7c879}.s5-purchase-price span{display:block;color:#c5b9ae;font-size:13px;font-weight:400}.s5-purchase label{display:block;margin:22px 0 12px;font-weight:600}.s5-purchase select{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:12px;border:1px solid #7c6c57;border-radius:6px;background:#201c22;color:#fff;font:inherit}.s5-purchase .s5-purchase-fine{font-size:12px;color:#c5b9ae}.s5-purchase-status{padding:12px;border-left:3px solid #d2b267;background:#29221b}.s5-purchase-error{padding:12px;border-left:3px solid #e58777;background:#37211e}.s5-purchase-submit{display:block;width:100%;padding:14px;margin-top:20px;border:0;border-radius:6px;background:#e1bd6b;color:#171216;font:700 14px Outfit,sans-serif;cursor:pointer}.s5-purchase-submit:disabled{opacity:.5;cursor:not-allowed}.s5-purchase-check{display:block;margin:12px auto 0;padding:8px;background:transparent;color:#e7c879;border:0;text-decoration:underline;cursor:pointer}.s5-purchase :focus-visible{outline:3px solid #eac977;outline-offset:3px}@media(max-width:430px){.s5-purchase{padding:24px}.s5-purchase h2{font-size:36px}}

.s5-application-receipt{min-width:0;width:100%;max-width:100%;box-sizing:border-box;overflow-wrap:anywhere}
.s5-application-receipt h3{font-size:clamp(28px,7vw,42px);line-height:1.15;white-space:normal;max-width:100%}
.s5-application-receipt .ref{display:block;white-space:normal;overflow-wrap:anywhere;max-width:100%;box-sizing:border-box}
.s5-application-receipt p{max-width:100%;overflow-wrap:anywhere}

.s5-protection{display:inline-flex;align-items:center;justify-self:start;gap:5px;width:max-content;max-width:100%;padding:3px 7px;border:1px solid #7bd3e780;border-radius:999px;background:#173039;color:#c9f3ff;font-family:Outfit,system-ui,sans-serif;font-size:11px;font-weight:600;line-height:1.2;letter-spacing:.02em;white-space:nowrap}
.s5-protection svg{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sd-id .s5-protection{margin-top:8px;font-size:12px}
/* Keep rank, identity, protection and totals in separate tracks on phone lists. */
@container (max-width:480px){
  .lb-list .lb-row .lb-btn{grid-template-columns:24px 34px minmax(0,1fr) auto;gap:6px;padding-inline:6px}
  .lb-list .lb-row .av{width:34px;height:34px;font-size:14px}
  .lb-list .lb-row .lb-name{font-size:24px;line-height:1}
  .lb-list .lb-row .lb-rank{font-size:30px}
  .lb-list .lb-row .lb-wins strong{font-size:42px}
  .lb-list .lb-row .lb-wins small{font-size:8px;letter-spacing:.08em}
  .lb-list .s5-protection{font-size:10px;padding:3px 5px;gap:4px}
  .lb-list .s5-protection svg{width:12px;height:12px}
}