/* Guest page: the Title Sequence design. The page plays like the opening of a film:
   a leader counts down, scroll rolls the title and the credits (the facts), then the
   box office hands you a ticket. Themes: html[data-theme=vegas|hollywood|undecided]. */
@property --p{syntax:'<number>';inherits:true;initial-value:0}
:root{
  --yellow:#FEC00F;--forest:#17371A;--red:#B42318;
  --paper:#fbf7ee;--pi:#17130d;--pl:#bdb19b;--pm:#5c5346;
  --f-b:'Urbanist',system-ui,sans-serif;--f-t:'Bodoni Moda',Didot,Georgia,serif;--f-n:'Yesteryear',cursive;
  --ease:cubic-bezier(.23,1,.32,1);--move:cubic-bezier(.77,0,.175,1);
  --S:72svh;--T:.36s;
}
html[data-theme=hollywood]{--ground:#0d0a09;--ink:#f6eee2;--mute:#c4b7a4;--acc:#FEC00F;--pick:#9b1520;--tk:#9b1520;--tk-ink:#fbf1e2;--tk-acc:#FEC00F}
html[data-theme=vegas]{--ground:#0d0a16;--ink:#f5f1fb;--mute:#bcb3cf;--acc:#FEC00F;--pick:#211a33;--tk:#FEC00F;--tk-ink:#17110a;--tk-acc:#8f1a12}
html[data-theme=undecided]{--ground:#17371A;--ink:#f7f3e5;--mute:#cbd3c0;--acc:#FEC00F;--pick:#17371A;--tk:#17371A;--tk-ink:#f7f3e5;--tk-acc:#FEC00F}
*,*::before,*::after{box-sizing:border-box}
html{scroll-snap-type:y proximity;-webkit-text-size-adjust:100%;background:#000}
body{margin:0;background:var(--ground);color:var(--ink);font:500 17px/1.5 var(--f-b);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{display:block}
p,h1,h2,h3{margin:0;font-weight:inherit}
button,input{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
[hidden]{display:none!important}

/* ---------- leader ---------- */
.leader{position:fixed;inset:0;z-index:50;background:#060606;display:none;pointer-events:none;overflow:hidden}
html.ld .leader{display:block}
.leader.out{opacity:0;transition:opacity .28s ease-out}
.ld-g{position:absolute;inset:-4px;background:#8c8880;animation:ldg calc(var(--T)*4) step-end forwards,weave .16s steps(1) infinite}
.ld-g::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.42));}
.ld-g::after{content:'';position:absolute;inset:0;background:#fff;animation:flk .18s steps(1) infinite}
.ld-x,.ld-y,.ld-s{position:absolute;background:#f1eee7}
.ld-x{left:0;right:0;top:50%;height:2px;margin-top:-1px}
.ld-y{top:0;bottom:0;left:50%;width:2px;margin-left:-1px}
.ld-s{top:0;bottom:0;left:28%;width:1px;opacity:0;animation:scr .7s steps(1) infinite}
.ld-d{position:absolute;left:50%;top:50%;width:min(82vw,60vh);aspect-ratio:1;transform:translate(-50%,-50%)}
.ld-sw{position:absolute;inset:0;border-radius:50%;overflow:hidden}
.ld-sw i,.ld-sw b{position:absolute;inset:0}
.ld-sw .r{clip-path:inset(0 0 0 50%)}
.ld-sw .l{clip-path:inset(0 50% 0 0)}
.ld-sw .r b{background:linear-gradient(90deg,#5c5953 50%,transparent 50%);animation:sw1 var(--T) linear 4}
.ld-sw .l b{background:linear-gradient(90deg,transparent 50%,#5c5953 50%);animation:sw2 var(--T) linear 4}
.ld-d svg{position:absolute;inset:-6%;width:112%;height:112%}
.ld-arm{position:absolute;left:50%;top:0;width:3px;height:50%;margin-left:-1.5px;background:#151515;transform-origin:50% 100%;animation:arm var(--T) linear 4}
.ld-n span{position:absolute;inset:0;display:grid;place-items:center;font:800 min(50vw,37vh)/1 var(--f-b);color:#141414;opacity:0;animation:num var(--T) step-end calc(var(--i)*var(--T)) forwards}
@keyframes sw1{0%{transform:rotate(0)}50%,100%{transform:rotate(180deg)}}
@keyframes sw2{0%,50%{transform:rotate(0)}100%{transform:rotate(180deg)}}
@keyframes arm{to{transform:rotate(360deg)}}
@keyframes num{0%{opacity:1}100%{opacity:0}}
@keyframes ldg{0%{opacity:1}100%{opacity:0}}
@keyframes weave{0%{transform:translate(0,0)}25%{transform:translate(1px,-1px)}50%{transform:translate(-1px,1px)}75%{transform:translate(0,1px)}}
@keyframes flk{0%{opacity:.05}50%{opacity:0}}
@keyframes scr{0%{opacity:0}20%{opacity:.7;transform:translateX(0)}40%{opacity:0}70%{opacity:.5;transform:translateX(38vw)}85%{opacity:0}}

/* ---------- stage ---------- */
.seq{position:relative;height:calc(100svh + (var(--n,5) - 1) * var(--S))}
.stage{position:sticky;top:0;height:100svh;overflow:hidden;background:#000;display:flex;align-items:center}
.frame{position:relative;width:100%;height:100%;overflow:hidden;container-type:size;background:var(--ground)}
.frame::after{content:'';position:absolute;inset:0;z-index:7;pointer-events:none;opacity:.07;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .7 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.sens i{position:absolute;left:0;width:1px;pointer-events:none}
.sens .sen{top:calc(var(--k) * var(--S) - var(--S) / 2 + 50svh);height:var(--S)}
.sens .snap{top:calc(var(--k) * var(--S));height:1px;scroll-snap-align:start}
@supports (animation-timeline:view()){
  .seq{animation:seqp linear both;animation-timeline:view();animation-range:contain 0% contain 100%}
}
@keyframes seqp{from{--p:0}to{--p:1}}
@media (min-width:820px) and (min-aspect-ratio:5/4){
  :root{--S:62svh}
  .frame{height:min(100% - 128px,100vw / 2.39)}
}

.bar{position:absolute;z-index:9;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:max(12px,env(safe-area-inset-top)) 16px 12px}
.bar img{width:88px;height:auto}
.lang{display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(0,0,0,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.lang button{min-width:46px;min-height:44px;border:0;border-radius:999px;background:none;font:700 15px/1 var(--f-b);letter-spacing:.06em;color:#f4efe6;cursor:pointer}
.lang button[aria-pressed=true]{background:#f4efe6;color:#14110c}
@media (min-width:820px){.bar{padding:22px 36px}.bar img{width:100px}}

/* ---------- cards ---------- */
.card{position:absolute;z-index:5;opacity:0;pointer-events:none;transition:opacity .35s ease-out,transform .7s var(--ease)}
.card.on{opacity:1;pointer-events:auto;transition-delay:.1s}
.ttl{left:50%;top:47%;width:min(92cqw,1000px);transform:translate(-50%,-50%);text-align:center}
.t-pre{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:clamp(14px,3.2cqh,30px)}
.t-co{font:700 14px/1.2 var(--f-b);letter-spacing:.32em;text-transform:uppercase;padding-left:.32em}
.t-pr{font:italic 400 clamp(19px,5cqw,26px)/1.2 var(--f-t)}
.t-date{font:italic 400 clamp(20px,5.2cqw,30px)/1.3 var(--f-t);margin-top:clamp(12px,2.6cqh,26px)}
.mo:not(.go) .ttl>*,.mo:not(.go) .ln.e{opacity:0}
.mo.go:not(.settled) .ttl>*{animation:rise .65s var(--ease) both}
.mo.go:not(.settled) .ttl>:nth-child(2){animation-delay:.14s}
.mo.go:not(.settled) .ttl>:nth-child(3){animation-delay:.3s}
.mo.go:not(.settled) .ttl>:nth-child(4){animation-delay:.44s}
.mo.go:not(.settled) .ttl>:nth-child(5){animation-delay:.56s}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}

/* credits (Hollywood + Voting) */
.cr{left:50%;top:45%;width:min(88cqw,640px);transform:translate(-50%,-50%) translateY(16px);text-align:center}
.cr.on{transform:translate(-50%,-50%)}
.cr-k{font:italic 400 clamp(21px,5.6cqw,30px)/1.2 var(--f-t);color:var(--acc);margin-bottom:.35em}
.cr-v{font:500 clamp(32px,9cqw,60px)/1.06 var(--f-t);text-wrap:balance}
.cr-v.sm{font-size:clamp(28px,7.6cqw,46px);line-height:1.12}
.cr-s{font:italic 400 clamp(21px,5.8cqw,32px)/1.3 var(--f-t);margin-top:.35em}
.cr-m{font:600 17px/1.4 var(--f-b);color:var(--mute);margin-top:16px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px}
.tc{font-variant-numeric:tabular-nums;letter-spacing:.06em;color:var(--acc)}
.cr-a,.lit-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;text-decoration:none;font:700 16px/1 var(--f-b);letter-spacing:.02em}
.cr-a{margin-top:20px;box-shadow:inset 0 0 0 1.5px currentColor;color:var(--ink)}
@container (min-aspect-ratio:3/2){
  .cr{width:min(44cqw,600px)}
  .cr[data-side=l]{left:30%}
  .cr[data-side=r]{left:70%}
  .cr-v{font-size:clamp(34px,8.6cqh,60px)}
  .cr-v.sm{font-size:clamp(28px,6.4cqh,44px)}
}

/* ---------- Hollywood ---------- */
.sc{position:absolute;inset:0}
.sc-h{background:radial-gradient(130% 75% at 50% 112%,#55121a 0%,#250b0d 40%,#0d0a09 74%)}
.beam{position:absolute;bottom:-3cqh;left:var(--x);width:max(24cqw,190px);height:150cqh;transform-origin:50% 100%;transform:translateX(-50%) rotate(calc(var(--a) + var(--tilt,0deg)));transition:transform 1.4s var(--move);background:linear-gradient(to top,rgba(255,228,160,.5),rgba(254,192,15,.17) 38%,rgba(254,192,15,0) 82%);clip-path:polygon(48% 100%,52% 100%,100% 0,0 0);mix-blend-mode:screen}
.b1{--x:14%;--a:21deg}.b2{--x:33%;--a:8deg}.b3{--x:67%;--a:-8deg}.b4{--x:86%;--a:-21deg}
.frame[data-side=l] .beam{--tilt:-8deg}
.frame[data-side=r] .beam{--tilt:8deg}
@container (min-aspect-ratio:3/2){
  .carpet{height:29cqh}
  html[data-theme=hollywood] .ttl{top:41%}
  .beam{width:max(16cqw,200px)}
  .frame[data-side=l] .beam{--tilt:-18deg}
  .frame[data-side=r] .beam{--tilt:18deg}
}
.carpet{position:absolute;bottom:0;left:50%;height:36cqh;width:max(100cqw,74cqh);transform:translateX(-50%) scale(calc(1 + var(--p) * .18));transform-origin:50% 100%}
.flashes i{position:absolute;width:26px;height:26px;margin:-13px;opacity:0;background:radial-gradient(circle,#fff 0 2px,rgba(255,255,255,.55) 3px,rgba(255,255,255,0) 13px)}
.flashes i::before,.flashes i::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#fff,transparent)}
.flashes i::after{transform:rotate(90deg)}
.pop i{animation:pop .45s ease-out both}
.pop i:nth-child(2){animation-delay:.18s}.pop i:nth-child(3){animation-delay:.34s}.pop i:nth-child(4){animation-delay:.08s}.pop i:nth-child(5){animation-delay:.5s}.pop i:nth-child(6){animation-delay:.27s}
@keyframes pop{0%{opacity:0;transform:scale(.4)}25%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.15)}}
html[data-theme=hollywood] .ttl h1{font:500 clamp(42px,min(12.4cqw,12.6cqh),96px)/1 var(--f-t);text-transform:uppercase;letter-spacing:.03em;text-wrap:balance}
.t-rule{display:flex;align-items:center;justify-content:center;gap:12px;margin:clamp(14px,2.8cqh,24px) 0 clamp(8px,1.6cqh,14px);color:var(--acc)}
.t-rule i{width:56px;height:1px;background:currentColor;opacity:.85}
.t-rule svg{width:14px;height:14px;fill:currentColor}
.t-theme{color:var(--acc)}
.t-theme b{display:block;font:italic 400 clamp(32px,9cqw,52px)/1.05 var(--f-t)}
.t-theme span{display:block;font:700 15px/1.3 var(--f-b);letter-spacing:.34em;text-transform:uppercase;padding-left:.34em;margin-top:4px}

/* ---------- Vegas ---------- */
.sc-v .sky{position:absolute;inset:0;background:linear-gradient(#06050c 0%,#100b1f 38%,#251238 66%,#3d1a3e 80%,#2a1230 100%)}
.sc-v .sky::before{content:'';position:absolute;inset:0 0 50%;opacity:.8;background:radial-gradient(circle at 12% 18%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 34% 9%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 58% 22%,#fff 0 .8px,transparent 1.4px),radial-gradient(circle at 77% 12%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 91% 30%,#fff 0 .8px,transparent 1.4px),radial-gradient(circle at 46% 36%,#fff 0 .7px,transparent 1.3px),radial-gradient(circle at 23% 40%,#fff 0 .7px,transparent 1.3px)}
.lay{position:absolute;left:0;background-repeat:repeat-x;background-position:left bottom;background-size:auto 100%}
.mtn{bottom:30cqh;height:15cqh;width:500cqw;background-image:var(--mtn);transform:translateX(calc(var(--p) * var(--last) * var(--gap) * -.06))}
.towers{bottom:12.5cqh;height:min(40cqh,84cqw);width:500cqw;background-image:var(--towers);transform:translateX(calc(var(--p) * var(--last) * var(--gap) * -.3))}
.road{position:absolute;left:0;right:0;bottom:0;height:12.5cqh;background:linear-gradient(#2c2538 0 2px,#100d17 2px 30%,#0a0810)}
.dash{position:absolute;left:0;top:58%;height:4px;width:900cqw;opacity:.6;background:repeating-linear-gradient(90deg,#e8e0c8 0 44px,transparent 44px 120px);transform:translateX(calc(var(--p) * var(--last) * var(--gap) * -1.6))}
.frame{--gap:80cqw;--sw:82cqw}
@container (min-aspect-ratio:3/2){.strip,.sc-v{--gap:50cqw;--sw:min(38cqw,76cqh)}}
@container (max-aspect-ratio:3/4){.sign{--ph:13cqh;--cw:64cqw}.s-party{--ph:6cqh;--cw:50cqw}}
.strip{position:absolute;inset:0;z-index:4;transform:translateX(calc(var(--p) * var(--last) * var(--gap) * -1))}
.sign{position:absolute;bottom:12.5cqh;left:calc(50% + var(--i) * var(--gap));width:var(--sw);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;text-align:center;--bf:clamp(16px,min(4.9cqw,3.2cqh),21px);--cw:56cqw;--ch:23cqh;--ph:8cqh}
.sign::after{content:'';position:absolute;z-index:-1;left:36%;right:36%;bottom:0;height:calc(var(--ph) + 130px);border-left:7px solid #2b2540;border-right:7px solid #2b2540}
.crown{transition:filter .5s ease-out;filter:saturate(.25) brightness(.48)}
.crown svg{width:var(--cw,44cqw);max-height:var(--ch,22cqh);height:auto}
.neon{font:400 var(--nf,clamp(40px,min(12cqw,7.4cqh),64px))/1.05 var(--f-n);color:color-mix(in srgb,var(--nc) 32%,#2a2433);padding:2px 10px 6px}
.board{position:relative;width:100%;padding:11px;border-radius:7px;background:#211c2c}
.board::before{content:'';position:absolute;inset:0;border-radius:inherit;opacity:.28;transition:opacity .4s;background:radial-gradient(circle,#fff7d4 0 1.4px,#FEC00F 2.2px,rgba(254,192,15,.35) 3.2px,rgba(254,192,15,0) 4.6px) 0 0/11px 11px}
.board-in{position:relative;background:#f4efe1;color:#151119;border-radius:3px;padding:9px 12px;box-shadow:0 0 0 3px #2c2639;font:800 var(--bf)/1.32 var(--f-b);letter-spacing:.035em;text-transform:uppercase;text-wrap:balance;background-image:repeating-linear-gradient(transparent 0 calc(1.32em - 1px),rgba(20,15,30,.13) calc(1.32em - 1px) 1.32em);background-position:0 9px}
.sign-act{margin-top:12px;display:flex;justify-content:center}
.lit-btn{background:#FEC00F;color:#17110a;box-shadow:0 0 0 3px #211c2c,0 0 22px rgba(254,192,15,.35)}
.poles{display:block;height:var(--ph)}
.lit .crown{filter:none}
.lit .neon{color:color-mix(in srgb,var(--nc) 22%,#fff);text-shadow:0 0 2px #fff,0 0 9px var(--nc),0 0 20px var(--nc),0 0 42px var(--nc)}
.lit .board::before{opacity:1}
.lit .board{box-shadow:0 0 34px rgba(254,192,15,.28)}
.ign .neon,.ign .crown{animation:ignite 1s both}
@keyframes ignite{0%,9%{opacity:.25}10%,15%{opacity:1}16%,27%{opacity:.3}28%,33%{opacity:1}34%,41%{opacity:.45}42%,100%{opacity:1}}
.s-dress .board-in{font-size:calc(var(--bf) * .95)}
.s-where .board-in{font-size:calc(var(--bf) * .9)}
.nw{white-space:nowrap}
.s-party{--cw:44cqw;--ch:19cqh;--ph:4cqh}
.s-party .cab{margin-bottom:6px}
.down{width:min(20cqw,11cqh);margin-top:12px;position:relative}
.s-party .neon{--nf:clamp(40px,min(12cqw,7cqh),62px)}
.cab{padding:10px;border-radius:8px;background:#211c2c;position:relative}
.cab::before{content:'';position:absolute;inset:0;border-radius:inherit;opacity:.28;transition:opacity .4s;background:radial-gradient(circle,#fff7d4 0 1.4px,#FEC00F 2.2px,rgba(254,192,15,.35) 3.2px,rgba(254,192,15,0) 4.6px) 0 0/11px 11px}
.lit .cab::before{opacity:1}
.cab img{position:relative;width:min(40cqw,24cqh);height:auto;background:#120f1a;padding:8px 14px;border-radius:4px;box-shadow:0 0 0 3px #2c2639}
.lit-btn.big{min-height:54px;padding:0 30px;font-size:18px;letter-spacing:.08em;text-transform:uppercase}
html[data-theme=vegas] .ttl{top:36%}
.t-party{display:block;font:800 clamp(17px,4.8cqw,24px)/1.2 var(--f-b);letter-spacing:.24em;text-transform:uppercase;padding-left:.24em}
.t-neon{display:block;margin-top:.12em;font:400 clamp(66px,min(20cqw,15cqh),150px)/.92 var(--f-n);color:#fff6d8;text-shadow:0 0 2px #fff,0 0 10px #FEC00F,0 0 26px #FEC00F,0 0 54px rgba(254,192,15,.7);transform:rotate(-5deg)}
.mo.go:not(.settled) .t-neon{animation:ignite 1.1s .35s both}
@container (min-aspect-ratio:3/2){html[data-theme=vegas] .ttl{top:40%}}

/* ---------- Voting (Bass grid) ---------- */
.sc-u{background:#17371A}
.ln{position:absolute;background:#FEC00F;opacity:.55}
.lh{left:0;right:0;height:1.5px;transform-origin:0 50%}
.mo.go:not(.settled) .lh.e{animation:drawx 1s var(--ease) .2s both}
.lh{transition:opacity .4s}
.frame[data-b="1"] .lh{opacity:0}
@keyframes drawx{from{transform:scaleX(0)}}
.reel{position:absolute;width:min(80cqw,62cqh);aspect-ratio:1;fill:#0c2210;transform:translate(-50%,-50%) rotate(calc(var(--p) * 600deg + var(--r0,0deg)))}
.reel.r1{left:3cqw;top:91cqh}
.reel.r2{left:97cqw;top:91cqh;--r0:28deg}
.film{position:absolute;left:0;bottom:4.5cqh;height:max(28px,4.6cqh);width:300cqw;background:repeating-linear-gradient(90deg,#0c2210 0 10px,#17371A 10px 18px) 0 16%/100% 20% no-repeat,repeating-linear-gradient(90deg,#0c2210 0 10px,#17371A 10px 18px) 0 84%/100% 20% no-repeat,repeating-linear-gradient(90deg,#B42318 0 44px,#0c2210 44px 52px,#0f0c0b 52px 96px,#0c2210 96px 104px) 0 50%/100% 34% no-repeat,#0c2210;transform:translateX(calc(var(--p) * -120cqw))}
html[data-theme=undecided] .ttl h1{font:800 clamp(46px,min(13.4cqw,13cqh),110px)/.95 var(--f-b);letter-spacing:-.01em;text-transform:uppercase;color:#FEC00F;text-wrap:balance}
.t-time{font:600 17px/1.4 var(--f-b);color:var(--mute);margin-top:6px}
.df{left:50%;top:52%;width:min(96cqw,780px);transform:translate(-50%,-50%) translateY(16px);text-align:center}
.df.on{transform:translate(-50%,-50%)}
.df h2{font:italic 400 clamp(28px,7.4cqw,42px)/1.1 var(--f-t);margin-bottom:clamp(14px,2.6cqh,24px)}
.df-row{display:flex;justify-content:center;gap:clamp(12px,3.4cqw,32px)}
.tile{appearance:none;border:0;background:none;padding:0;cursor:pointer;width:min(43cqw,35cqh);color:var(--ink);transition:opacity .3s,transform .2s var(--ease)}
.tile:active{transform:scale(.97)}
.tile svg{width:100%;height:auto;box-shadow:0 20px 44px -12px rgba(0,0,0,.6);outline:3px solid transparent;outline-offset:5px}
.tile[aria-pressed=true] svg{outline-color:#FEC00F}
.df-row:has([aria-pressed=true]) .tile[aria-pressed=false]{opacity:.5}
.tile-name{display:block;margin-top:12px;font:700 16px/1.25 var(--f-b)}
.df-note{margin-top:clamp(12px,2.2cqh,20px);font:500 17px/1.4 var(--f-b);color:var(--mute)}

/* ---------- lobby: box office ---------- */
.lobby{position:relative;display:grid;grid-template-columns:minmax(0,560px);justify-content:center;gap:40px;padding:64px 16px 48px}
html[data-theme=hollywood] .lobby{background:linear-gradient(#000 0,rgba(0,0,0,0) 180px),repeating-linear-gradient(90deg,#26070a 0,#47101a 24px,#26070a 50px)}
html[data-theme=vegas] .lobby{background:linear-gradient(#000 0,rgba(0,0,0,0) 160px)}
html[data-theme=undecided] .lobby{background:linear-gradient(#000 0,rgba(0,0,0,0) 160px)}
.case{display:none}
@media (min-width:1000px){
  .lobby{grid-template-columns:300px minmax(0,560px);gap:72px;padding:120px 32px 72px}
  .case{display:block;position:sticky;top:56px;align-self:start}
}
.case-in{padding:16px;border-radius:6px;background:#15111c;box-shadow:0 0 0 2px #FEC00F,0 30px 70px -20px rgba(0,0,0,.8);position:relative}
.case-in::before{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle,#fff7d4 0 1.4px,#FEC00F 2.2px,rgba(254,192,15,.35) 3.2px,rgba(254,192,15,0) 4.6px) 0 0/12px 12px}
.case-in svg{position:relative;width:100%;height:auto}
.case-in.two{display:flex;gap:10px}
.booth{position:relative}
.window{position:relative;background:var(--paper);color:var(--pi);border-radius:300px 300px 18px 18px/150px 150px 18px 18px;padding:58px 20px 26px;box-shadow:0 0 0 7px #FEC00F,0 0 0 9px rgba(0,0,0,.45),0 50px 100px -40px rgba(0,0,0,.85)}
html[data-theme=vegas] .lobby{padding-left:24px;padding-right:24px}
html[data-theme=vegas] .booth::before{content:'';position:absolute;inset:-18px;border-radius:320px 320px 30px 30px/168px 168px 30px 30px;background:radial-gradient(circle,#fff7d4 0 1.5px,#FEC00F 2.4px,rgba(254,192,15,.35) 3.4px,rgba(254,192,15,0) 5px) 0 0/12px 12px,#1d1729}
html[data-theme=vegas] .window{box-shadow:0 0 0 6px #ff4f7b,0 0 26px 6px rgba(255,79,123,.5),0 50px 100px -40px rgba(0,0,0,.85)}
.grille{display:block;width:44px;height:44px;margin:-26px auto 14px;border-radius:50%;background:radial-gradient(circle,#a88a3c 0 1.6px,transparent 2px) 0 0/7px 7px,#e9dfc6;box-shadow:inset 0 0 0 2px #c8a54a}
.window h2{font:500 clamp(36px,9vw,50px)/1.04 var(--f-t);text-align:center;text-wrap:balance}
.booth-by{text-align:center;color:var(--pm);margin:8px 0 24px;font:500 17px/1.4 var(--f-b)}
.window:has(.done:not([hidden])) h2{display:none}
.greet{text-align:center;margin:-10px 0 18px;font:600 18px var(--f-b)}
form{display:grid;gap:18px}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font:700 18px/1.3 var(--f-b);margin:0 0 10px;padding:0}
.after{display:grid;gap:18px}
.opt{position:relative;display:block}
.opt input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.opt span{display:flex;align-items:center;justify-content:center;height:100%;min-height:50px;padding:6px 10px;border:1.5px solid var(--pl);border-radius:12px;background:#fff;font:700 16px/1.2 var(--f-b);text-align:center}
.opt input:checked+span{background:var(--pick);border-color:var(--pick);color:#fff}
.opt input:focus-visible+span{outline:3px solid var(--pi);outline-offset:2px}
.choice-row,.seg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice-row .opt span{min-height:68px;font-size:17px;border-width:2px;border-radius:14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:grid;gap:6px;font:700 16px/1.3 var(--f-b)}
.field i{font-style:normal;font-weight:500;color:var(--pm)}
.field input{width:100%;height:52px;border:1.5px solid var(--pl);border-radius:12px;background:#fff;padding:0 14px;font:500 18px var(--f-b);color:var(--pi)}
.field input::placeholder{color:#8c8170}
.field input:focus{outline:none;border-color:var(--pi);box-shadow:0 0 0 3px color-mix(in srgb,var(--pick) 40%,transparent)}
.field.invalid input{border-color:var(--red)}
.err{color:var(--red);font:600 16px/1.35 var(--f-b);margin-top:-8px}
.muted{color:var(--pm);font-weight:500}
.sizes{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px}
.sizes .opt span{min-height:48px;padding:0}
.send{height:60px;border:0;border-radius:14px;background:#FEC00F;color:#17110a;font:800 18px/1 var(--f-b);letter-spacing:.02em;cursor:pointer;box-shadow:inset 0 -3px 0 rgba(0,0,0,.16);transition:transform .15s var(--ease)}
.send:active{transform:scale(.98)}
.send:focus-visible{outline:3px solid var(--pi)}

/* confirmation: the ticket comes out of the slot */
.done{outline:none;text-align:center}
.done-h{font:500 clamp(28px,7.4vw,38px)/1.12 var(--f-t);text-wrap:balance}
.slot{position:relative;z-index:2;height:16px;margin:22px 0 0;border-radius:8px;background:#1d1912;box-shadow:inset 0 3px 5px rgba(0,0,0,.7),0 1px 0 #fff}
.tk-clip{overflow:hidden;margin:-8px 10px 0;padding:0 4px 22px;container-type:inline-size}
.ticket{--stub:80px;position:relative;display:flex;text-align:left;min-height:214px;background:var(--tk);color:var(--tk-ink);border-radius:8px;transform:translateY(-104%);box-shadow:0 14px 26px -12px rgba(0,0,0,.45);-webkit-mask:radial-gradient(circle at calc(100% - var(--stub)) 0,#0000 10px,#000 10.5px) top/100% 51% no-repeat,radial-gradient(circle at calc(100% - var(--stub)) 100%,#0000 10px,#000 10.5px) bottom/100% 51% no-repeat;mask:radial-gradient(circle at calc(100% - var(--stub)) 0,#0000 10px,#000 10.5px) top/100% 51% no-repeat,radial-gradient(circle at calc(100% - var(--stub)) 100%,#0000 10px,#000 10.5px) bottom/100% 51% no-repeat}
.done.show .ticket{transform:none;transition:transform 1s var(--ease) .2s}
.ticket::before{content:'';position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--tk-acc) 65%,transparent);border-radius:4px;pointer-events:none}
.tk-main{flex:1;min-width:0;padding:20px 14px 18px 22px;display:flex;flex-direction:column;gap:5px}
.tk-pre{font:700 12px/1.35 var(--f-b);letter-spacing:.16em;text-transform:uppercase;opacity:.85}
.tk-name{font:600 clamp(26px,7.6vw,34px)/1.02 var(--f-t);text-transform:uppercase;letter-spacing:.01em;margin-top:6px;overflow-wrap:anywhere}
.tk-with{font:italic 400 18px/1.2 var(--f-t)}
.tk-in{font:800 15px/1.3 var(--f-b);letter-spacing:.12em;text-transform:uppercase;color:var(--tk-acc);margin-top:4px}
.tk-in i{font:italic 400 18px var(--f-t);letter-spacing:0;text-transform:none;color:var(--tk-ink);margin-right:6px}
.tk-vote{font:600 15px/1.3 var(--f-b);opacity:.9}
.tk-meta{margin-top:auto;padding-top:10px;font:600 15px/1.35 var(--f-b)}
.tk-stub{flex:none;width:var(--stub);border-left:2px dashed color-mix(in srgb,var(--tk-ink) 45%,transparent);display:flex;align-items:center;justify-content:center}
.tk-stub div{writing-mode:vertical-rl;transform:rotate(180deg);display:flex;flex-direction:column;gap:8px;align-items:center;white-space:nowrap}
.tk-admit{font:800 17px/1 var(--f-b);letter-spacing:.18em;text-transform:uppercase}
.tk-num{font:600 13px/1 var(--f-b);letter-spacing:.14em;opacity:.85}
@container (max-width:430px){
  .ticket{--stub:58px;flex-direction:column;-webkit-mask:radial-gradient(circle at 0 calc(100% - var(--stub)),#0000 10px,#000 10.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% calc(100% - var(--stub)),#0000 10px,#000 10.5px) right/51% 100% no-repeat;mask:radial-gradient(circle at 0 calc(100% - var(--stub)),#0000 10px,#000 10.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% calc(100% - var(--stub)),#0000 10px,#000 10.5px) right/51% 100% no-repeat}
  .tk-main{padding:22px 22px 16px}
  .tk-stub{width:auto;height:var(--stub);border-left:0;border-top:2px dashed color-mix(in srgb,var(--tk-ink) 45%,transparent)}
  .tk-stub div{writing-mode:horizontal-tb;transform:none;flex-direction:row;gap:14px}
  .tk-admit{font-size:15px;letter-spacing:.1em}
  .tk-num{font-size:12px;letter-spacing:.08em}
}
@media (max-width:380px){.window{padding-left:16px;padding-right:16px}.tk-clip{margin-left:4px;margin-right:4px}}
.ticket.small{min-height:0;background:#efe7d4;color:var(--pi);--tk-acc:#8c8170;max-width:300px;margin:0 auto}
.ticket.small .tk-name{font-size:24px}
.done-sum{font:500 18px/1.45 var(--f-b);margin:4px 0 0}
.done-link{font:500 16px/1.45 var(--f-b);color:var(--pm);margin-top:14px}
.done-link a{display:block}
.done-link a{color:var(--pi);font-weight:700}
.done-acts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px}
.quiet{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;border-radius:999px;border:1.5px solid var(--pl);background:#fff;color:var(--pi);font:700 16px/1 var(--f-b);text-decoration:none;cursor:pointer}

/* ---------- soundtrack ---------- */
.songs{max-width:760px;margin:0 auto;padding:40px 16px 24px}
.songs h2{font:500 clamp(36px,9vw,52px)/1.05 var(--f-t)}
.lede{color:var(--mute);margin-top:10px;font-size:17px}
.song-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;margin-top:24px;align-items:end}
.song-form label{display:grid;gap:6px;font:700 16px var(--f-b)}
.song-form input{height:52px;width:100%;border-radius:12px;border:1.5px solid color-mix(in srgb,var(--ink) 40%,transparent);background:color-mix(in srgb,var(--ink) 7%,transparent);padding:0 14px;font:500 18px var(--f-b)}
.song-form input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 35%,transparent)}
.song-form button{grid-column:1/-1;height:52px;border:0;border-radius:12px;background:var(--ink);color:var(--ground);font:800 17px var(--f-b);cursor:pointer}
@media (min-width:700px){.song-form{grid-template-columns:1fr 1fr 120px}.song-form button{grid-column:auto}}
.flash{color:var(--acc);margin-top:10px;font-weight:600}
.song-list{list-style:none;margin:28px 0 0;padding:0;counter-reset:tr;border-top:1px solid color-mix(in srgb,var(--ink) 22%,transparent)}
.song-list li{counter-increment:tr;display:grid;grid-template-columns:2.1em minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 14%,transparent)}
.song-list li::before{content:counter(tr);font:italic 500 22px/1 var(--f-t);color:var(--acc);text-align:right}
.song-title{font:500 21px/1.2 var(--f-t)}
.song-artist{font:500 16px/1.3 var(--f-b);color:var(--mute);margin-top:2px}
.back{min-width:68px;min-height:44px;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--ink) 45%,transparent);background:none;font:800 16px/1 var(--f-b);font-variant-numeric:tabular-nums;cursor:pointer;transition:transform .15s var(--ease)}
.back:active{transform:scale(.96)}
.back[aria-pressed=true]{background:var(--acc);border-color:var(--acc);color:#17110a}

/* ---------- end credits ---------- */
.end{display:grid;justify-items:center;gap:12px;padding:80px 16px 150px;text-align:center}
.end-fin{font:italic 400 46px/1 var(--f-t);margin-bottom:12px}
.end img{width:96px;height:auto;margin-bottom:6px}
.end .m{color:var(--mute)}

/* ---------- floating bits ---------- */
.pill{position:fixed;z-index:55;right:16px;bottom:max(16px,env(safe-area-inset-bottom));display:flex;align-items:center;min-height:48px;padding:0 22px;background:#FEC00F;color:#17110a;border-radius:6px;font:800 16px/1 var(--f-b);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.4);transition:opacity .25s,transform .25s var(--ease);-webkit-mask:radial-gradient(circle at 0 50%,#0000 7px,#000 7.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 7px,#000 7.5px) right/51% 100% no-repeat;mask:radial-gradient(circle at 0 50%,#0000 7px,#000 7.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 7px,#000 7.5px) right/51% 100% no-repeat}
.pill:focus-visible{outline:3px solid #17110a;outline-offset:-7px}
.pill.away{opacity:0;transform:translateY(10px);pointer-events:none}
@media (min-width:820px){.pill{right:32px}}

@media (prefers-reduced-motion:reduce){
  .carpet{transform:translateX(-50%)!important}
  .strip,.mtn,.towers,.dash{transform:none!important}
  .sign{left:50%;opacity:0}
  .sign.on{opacity:1}
  .beam,.card,.crown,.board::before,.pill{transition:none!important}
  .reel{transform:translate(-50%,-50%)!important}
  .film{transform:none!important}
  .done.show .ticket{transition:none}
  .ticket{transform:none}
  html{scroll-behavior:auto}
}

/* ---------- live-site additions ---------- */
.greeting{text-align:center;font:600 18px/1.35 var(--f-b);margin:-12px 0 22px}
.size-chart{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;color:var(--pi);font:700 16px/1 var(--f-b)}
.send:disabled{opacity:.7}
.err[data-err=server]{margin-top:12px}
.song-list li.empty{display:block;color:var(--mute);border-bottom:0}
.song-list li.empty::before{content:none}
.more{display:inline-flex;align-items:center;min-height:44px;margin-top:16px;padding:0 18px;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--ink) 45%,transparent);background:none;font:700 16px/1 var(--f-b);cursor:pointer}
.end a{font-weight:700}
