[hidden]{display:none!important}
html,body{margin:0}
img{max-width:100%}
/* Layout: one-screen arena. A stadium scoreboard: you (sky) vs ghost (coral) under bulb-yellow lights. */
:root{
  --bg:#0d1626; --bg2:#14213a; --panel:#1a2944; --line:#2a3d60;
  --fg:#eef3ff; --muted:#93a3c4;
  --bulb:#ffc93c; --you:#4cc9f0; --opp:#ff6b5b; --good:#3ddc84; --bad:#ff5d73;
  --display:"Bungee","Arial Black",Impact,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
html,body{height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.45;
  background-image:radial-gradient(ellipse 80% 40% at 50% -10%, rgba(255,201,60,.13), transparent 70%);
  background-attachment:fixed}
*{box-sizing:border-box}
button{font:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--bulb);outline-offset:2px}
.wrap{max-width:560px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;gap:20px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 32px}
.screen{display:flex;flex-direction:column;gap:18px}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
h1,h2,h3{margin:0;text-wrap:balance}

/* Logo */
.logo{font-family:var(--display);font-size:clamp(32px,9.5vw,58px);line-height:.9;letter-spacing:.01em;display:flex;align-items:baseline;gap:10px}
.logo .five{color:var(--bulb);font-size:1.25em;text-shadow:0 0 24px rgba(255,201,60,.45)}
.tag{color:var(--muted);margin:0;max-width:40ch}

/* Rank card */
.rank{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;display:grid;grid-template-columns:auto 1fr;gap:4px 16px;align-items:center}
.badge{grid-row:span 3;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:22px;color:#0d1626;background:var(--tier,#c88a52);box-shadow:inset 0 -6px 0 rgba(0,0,0,.18),0 0 0 4px rgba(255,255,255,.06)}
.tiername{font-family:var(--display);font-size:22px}
.rating{color:var(--muted);font-size:14px}
/* Rank ladder: whole-scale track on top, current division close-up below */
.ladder{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:14px}
.lad-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.lad-head b{font-family:var(--display);font-size:15px;font-weight:400}
.lad-head small{color:var(--muted);font-size:12px}
.lad-scale{position:relative;padding-top:22px}
.lad-track{display:flex;height:12px;border-radius:99px;overflow:hidden;gap:2px}
.lad-track span{position:relative;height:100%;opacity:.35}
.lad-track span.on{opacity:1}
.lad-track span i{position:absolute;top:0;bottom:0;width:2px;background:var(--panel);opacity:.9}
.lad-labels{display:flex;gap:2px;margin-top:6px}
.lad-labels span{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:center;overflow:hidden;white-space:nowrap}
.lad-labels span.on{color:var(--fg)}
.lad-me{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:1px;transition:left 1s cubic-bezier(.3,1.3,.5,1)}
.lad-me em{font-style:normal;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:1px 6px;white-space:nowrap}
.lad-me::after{content:"";width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid var(--fg)}
.lad-ghost{position:absolute;top:22px;width:3px;height:12px;background:var(--fg);opacity:.4;transform:translateX(-50%);border-radius:2px}
.div-bar{position:relative;height:16px;background:var(--bg2);border-radius:99px;overflow:hidden}
.div-bar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;transition:width 1s ease}
.div-bar b{position:absolute;top:0;bottom:0;width:2px;background:var(--fg);opacity:.5}
.div-ends{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.div-end{display:flex;flex-direction:column;gap:2px;min-width:0}
.div-end.r{text-align:right}
.div-end .label{font-size:10px}
.div-end strong{font-size:15px}
.div-end small{font-size:13px;color:var(--muted)}
.div-end .warn{color:var(--bad);font-weight:700}
.div-end .near{color:var(--good);font-weight:700}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat{background:var(--bg2);border-radius:10px;padding:10px 8px;text-align:center}
.stat b{display:block;font-family:var(--mono);font-size:20px}
.stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}

.btn{border:0;border-radius:12px;padding:16px 18px;font-weight:800;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;transition:transform .12s}
.btn:active{transform:scale(.98)}
.btn small{display:block;font-weight:500;font-size:13px;opacity:.75}
.btn-main{background:var(--bulb);color:#1b1400;box-shadow:0 6px 0 #b38714}
.btn-alt{background:var(--panel);color:var(--fg);border:1px solid var(--line)}
.btn[disabled]{opacity:.5;cursor:default}
.btn .arrow{font-family:var(--display);font-size:22px}
.rules{display:grid;gap:8px;margin:0;padding:0;list-style:none;color:var(--muted);font-size:14px}
.rules b{color:var(--fg)}

/* Queue */
.center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center;min-height:60vh}
.radar{width:120px;height:120px;border-radius:50%;border:2px solid var(--line);position:relative}
.radar::before,.radar::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--bulb);animation:ping 1.6s ease-out infinite}
.radar::after{animation-delay:.8s}
@keyframes ping{from{transform:scale(.4);opacity:1}to{transform:scale(1.5);opacity:0}}
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;width:100%}
.player{background:var(--panel);border-radius:14px;padding:16px 10px;border-top:4px solid var(--c);min-width:0}
.player .nm{font-weight:800;overflow-wrap:anywhere}
.player .rt{font-size:13px;color:var(--muted)}
.vstext{font-family:var(--display);font-size:28px;color:var(--bulb)}
.ghostnote{font-size:13px;color:var(--muted)}

/* Intro flash */
.flash{font-family:var(--display);font-size:clamp(34px,10vw,58px);line-height:1;color:var(--bulb);animation:slam .5s cubic-bezier(.2,1.6,.4,1) both;text-shadow:0 0 30px rgba(255,201,60,.4)}
@keyframes slam{from{transform:scale(2.6);opacity:0}to{transform:scale(1);opacity:1}}
.count{font-family:var(--display);font-size:64px;color:var(--fg)}
.count.pop{animation:pop .6s ease both}
@keyframes pop{from{transform:scale(1.6);opacity:.2}to{transform:scale(1);opacity:1}}

/* Round */
.hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}
.side{display:flex;flex-direction:column;gap:2px;min-width:0}
.side.r{text-align:right}
.side .who{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .sc{font-family:var(--display);font-size:46px;line-height:1}
.you .who,.you .sc{color:var(--you)} .opp .who,.opp .sc{color:var(--opp)}
.sc.bump{animation:bump .3s ease}
@keyframes bump{50%{transform:scale(1.25)}}
.clock{font-family:var(--mono);font-size:30px;font-weight:700;text-align:center;min-width:3ch}
.clock.low{color:var(--bad);animation:blink .5s steps(2) infinite}
@keyframes blink{50%{opacity:.4}}
.timer{height:10px;background:var(--bg2);border-radius:99px;overflow:hidden}
.timer>i{display:block;height:100%;background:linear-gradient(90deg,var(--bulb),#ffe08a);transform-origin:left;border-radius:99px}
.cathead{text-align:center}
.cathead .label{display:block}
.cathead h2{font-family:var(--display);font-size:clamp(24px,7vw,34px);color:var(--bulb)}
.entry{position:relative}
.entry input{width:100%;font:inherit;font-size:22px;font-weight:700;padding:16px 18px;border-radius:12px;border:2px solid var(--line);background:var(--bg2);color:var(--fg)}
.entry input:focus{border-color:var(--you);outline:none;box-shadow:0 0 0 4px rgba(76,201,240,.2)}
.entry.shake input{animation:shake .35s;border-color:var(--bad)}
.entry.ok input{border-color:var(--good)}
@keyframes shake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.fb{min-height:22px;font-weight:700;font-size:15px;text-align:center}
.fb.good{color:var(--good)} .fb.bad{color:var(--bad)} .fb.dupe{color:var(--bulb)}
.chips{display:flex;flex-wrap:wrap;gap:8px;min-height:40px;align-content:flex-start}
.chip{background:rgba(76,201,240,.14);color:var(--you);border:1px solid rgba(76,201,240,.35);border-radius:99px;padding:5px 12px;font-weight:700;font-size:14px;animation:chipin .3s cubic-bezier(.2,1.5,.4,1)}
.chip.o{background:rgba(255,107,91,.12);color:var(--opp);border-color:rgba(255,107,91,.35)}
.chip.m{background:transparent;color:var(--muted);border-color:var(--line);border-style:dashed;animation:none}
@keyframes chipin{from{transform:scale(.4);opacity:0}}
.combo{position:fixed;left:50%;top:38%;transform:translate(-50%,-50%);font-family:var(--display);font-size:clamp(30px,9vw,48px);color:var(--bulb);pointer-events:none;text-shadow:0 0 20px rgba(255,140,0,.8);animation:combo 1s ease-out forwards;z-index:20;white-space:nowrap}
@keyframes combo{0%{transform:translate(-50%,-30%) scale(.5);opacity:0}20%{transform:translate(-50%,-50%) scale(1.15);opacity:1}100%{transform:translate(-50%,-120%) scale(1);opacity:0}}
.skip{background:none;border:0;color:var(--muted);font-size:13px;text-decoration:underline;align-self:center}

/* Results */
.banner{font-family:var(--display);font-size:clamp(30px,9vw,46px);text-align:center;line-height:1.05}
.banner.w{color:var(--good)} .banner.l{color:var(--opp)} .banner.t{color:var(--bulb)}
.banner.big{animation:slam .6s cubic-bezier(.2,1.6,.4,1) both}
.sub{text-align:center;color:var(--muted);margin:-8px 0 0}
.board{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.board table{width:100%;border-collapse:collapse;font-size:15px}
.board th,.board td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
.board th{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.board td.n,.board th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;width:3.5ch}
.board tr.cur td{background:rgba(255,201,60,.07)}
.board tr.tot td{font-weight:800;border-bottom:0;font-size:17px}
.board td.y{color:var(--you)} .board td.o{color:var(--opp)}
.board .pending td{color:var(--muted);opacity:.6}
.lead{text-align:center;font-weight:800;font-size:18px}
.lead .y{color:var(--you)} .lead .o{color:var(--opp)}
.answers{display:grid;gap:14px}
.answers .label{margin-bottom:6px;display:block}

.delta{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}
.delta .chg{font-family:var(--display);font-size:42px}
.delta .chg.up{color:var(--good)} .delta .chg.dn{color:var(--bad)}
.delta .why{font-size:13px;color:var(--muted);text-align:center;max-width:38ch}
.sharebox{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px;font-family:var(--mono);font-size:13px;white-space:pre-wrap;margin:0;overflow-wrap:anywhere;user-select:all}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>*{flex:1 1 160px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:10px 18px;border-radius:99px;font-weight:700;z-index:30}
canvas#fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:15}
.foot{font-size:12px;color:var(--muted);text-align:center}
.done{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px}
.done-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.done-head .next{font-size:14px;color:var(--muted)}
.done-head .next b{color:var(--bulb);font-size:16px}
.done-res{font-family:var(--display);font-size:26px;line-height:1.1}
.done-res.w{color:var(--good)} .done-res.l{color:var(--opp)} .done-res.t{color:var(--bulb)}
.pct{text-align:center;font-weight:800;font-size:17px;background:rgba(255,201,60,.1);border:1px solid rgba(255,201,60,.35);color:var(--bulb);border-radius:12px;padding:12px}
.pct small{display:block;font-weight:500;font-size:13px;color:var(--muted)}
.chip .p{font-family:var(--mono);font-size:12px;opacity:.75;margin-left:6px;font-weight:500}
.chip.rare{background:rgba(255,201,60,.16);color:var(--bulb);border-color:rgba(255,201,60,.5)}
.statnote{margin:0;font-size:13px;color:var(--muted)}
.statnote:empty{display:none}
.st-top{display:flex;justify-content:space-between;align-items:center}
.st-top .skip{text-decoration:none;font-size:15px;font-weight:700;color:var(--fg);padding:0}
.daynav{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;text-align:center;gap:8px}
.daynav button{height:44px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--fg);font-family:var(--display);font-size:22px}
.daynav button[disabled]{opacity:.35;cursor:default}
.dayname{font-family:var(--display);font-size:22px}
#stBody{display:flex;flex-direction:column;gap:18px}
.block .label{display:block;margin-bottom:8px}
.hist{display:grid;gap:6px}
.hrow{display:grid;grid-template-columns:5.5ch 1fr 3ch;gap:10px;align-items:center;font-size:13px}
.hrow .rg{font-family:var(--mono);color:var(--muted)}
.hrow .tr{height:14px;background:var(--bg2);border-radius:4px;overflow:hidden}
.hrow .tr i{display:block;height:100%;background:var(--you);border-radius:4px}
.hrow .ct{font-family:var(--mono);text-align:right}
.board.scroll{overflow-x:auto}
.board td.dim{color:var(--muted);font-family:var(--mono);font-size:13px;white-space:nowrap}
.catblock .catname{font-weight:800;margin-bottom:6px}
.ghostrec{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.ghostrec .gr-head{font-weight:800}
.ghostrec .gr-head span{color:var(--muted);font-weight:500}
.ghostrec .gr-sub{font-size:13px;color:var(--muted)}
.gr-row{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.gr-row .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gr-row .rs{font-family:var(--mono);white-space:nowrap}
.gr-row .rs.w{color:var(--good)} .gr-row .rs.l{color:var(--opp)} .gr-row .rs.t{color:var(--bulb)}
.nextline{text-align:center;color:var(--muted);font-size:14px;margin:0}
.nextline b{color:var(--bulb)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}
}

/* ---------- Website additions ---------- */
.homehead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.whoami{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-weight:800;min-width:0}
.whoami span{overflow-wrap:anywhere}
.whoami .skip{align-self:flex-end;padding:0}
.tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:4px;gap:4px}
.tabs button{border:0;border-radius:9px;padding:10px;background:transparent;color:var(--muted);font-weight:800}
.tabs button[aria-selected="true"]{background:var(--panel);color:var(--fg)}
.authform{display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-weight:700;font-size:14px}
.field input{font:inherit;font-size:17px;padding:13px 14px;border-radius:10px;border:2px solid var(--line);background:var(--bg2);color:var(--fg);width:100%}
.field input:focus{border-color:var(--you);outline:none}
.field small{font-size:13px;color:var(--muted)}
.field small.ok{color:var(--good)} .field small.bad{color:var(--bad)}
.formerr{color:var(--bad);font-weight:700;margin:0;min-height:0;text-align:center}
.formerr:empty{display:none}
.formerr.info{color:var(--good)}
.qsearch,.qfound{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}
.qtitle{font-family:var(--display);font-size:24px}
.qsearch .tag{margin-top:6px}
.drop{color:var(--muted);font-size:13px}
.homehead .whoami{flex-direction:row;align-items:baseline;gap:10px}
@media (max-width:420px){.lad-labels span{letter-spacing:0;font-size:9px}}

/* ---------- Leaderboard ---------- */
.lbtitle,.formtitle{font-family:var(--display);font-size:clamp(26px,8vw,36px);font-weight:400;line-height:1.05}
.formtitle{font-size:clamp(22px,6.5vw,28px);margin-bottom:6px}
.lbme{background:rgba(76,201,240,.1);border:1px solid rgba(76,201,240,.4);border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;font-weight:700}
.lbme:empty{display:none}
.lbme small{color:var(--muted);font-weight:500;font-size:13px}
.lblist{list-style:none;margin:0;padding:0;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.lbrow{display:grid;grid-template-columns:3ch minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line)}
.lbrow:last-child{border-bottom:0}
.lbrow.me{background:rgba(76,201,240,.1)}
.lbrow .rk{font-family:var(--mono);color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}
.lbrow.p1 .rk{color:#ffc93c}.lbrow.p2 .rk{color:#c3cddc}.lbrow.p3 .rk{color:#c88a52}
.lbrow .who{display:flex;flex-direction:column;min-width:0}
.lbrow .who b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lbrow .who small{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:6px}
.lbrow .dot{width:9px;height:9px;border-radius:50%;flex:none}
.lbrow .sc{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums;text-align:right}
.lbrow .rec{font-family:var(--mono);font-size:12px;color:var(--muted);text-align:right;min-width:5ch}
.lbrow .rec.w{color:var(--good)} .lbrow .rec.l{color:var(--opp)} .lbrow .rec.t{color:var(--bulb)}
.authform .skip{padding:4px}

/* ---------- How to play ---------- */
.ht-top{display:flex;justify-content:space-between;align-items:center}
.ht-top .skip{padding:0;font-size:14px}
.skip.inline{display:inline;padding:0;font-size:12px;align-self:auto}
.ht-track{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:0}
.ht-track::-webkit-scrollbar{display:none}
.ht-card{scroll-snap-align:start;display:flex;flex-direction:column;gap:14px;padding:2px}
.ht-card h2{font-family:var(--display);font-weight:400;font-size:clamp(26px,8vw,36px);line-height:1.05}
.ht-card p{margin:0;color:var(--muted);font-size:17px;max-width:34ch}
.ht-art{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 18px;min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;overflow:hidden}
.ht-flash{font-family:var(--display);font-size:clamp(28px,8.5vw,40px);color:var(--bulb);line-height:1;text-shadow:0 0 26px rgba(255,201,60,.4)}
.ht-timer{width:85%;height:10px;background:var(--bg2);border-radius:99px;overflow:hidden}
.ht-timer i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--bulb),#ffe08a);border-radius:99px;transform-origin:left;animation:htdrain 4s linear infinite}
@keyframes htdrain{from{transform:scaleX(1)}to{transform:scaleX(0)}}
.ht-clock{font-size:26px;font-weight:700}
.ht-input{width:100%;text-align:left;font-size:20px;font-weight:700;padding:12px 14px;border-radius:10px;border:2px solid var(--good);background:var(--bg2)}
.ht-caret{display:inline-block;width:2px;height:1.1em;background:var(--fg);vertical-align:-3px;margin-left:2px;animation:blink 1s steps(2) infinite}
.ht-fb{color:var(--good);font-weight:800}
.ht-chips{justify-content:center;min-height:0}
.ht-hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;width:100%}
.ht-hud .side{display:flex;flex-direction:column;align-items:flex-start}
.ht-hud .side.r{align-items:flex-end}
.ht-hud .who{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.ht-hud .sc{font-family:var(--display);font-size:56px;line-height:1}
.ht-hud .you .who,.ht-hud .you .sc{color:var(--you)} .ht-hud .opp .who,.ht-hud .opp .sc{color:var(--opp)}
.ht-delta{font-weight:800;color:var(--muted)} .ht-delta .up{font-family:var(--display);font-weight:400;color:var(--good);font-size:26px;margin-right:4px}
.ht-tiers{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.ht-tier{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ht-tier i{width:34px;height:34px;border-radius:50%;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18)}
.ht-once{font-weight:800;color:var(--muted)} .ht-once b{font-family:var(--display);font-weight:400;color:var(--bulb);font-size:30px;margin-right:6px;vertical-align:-3px}
.ht-dots{display:flex;justify-content:center;gap:8px}
.ht-dots i{width:8px;height:8px;border-radius:99px;background:var(--line);transition:width .2s,background .2s}
.ht-dots i.on{width:22px;background:var(--bulb)}
.ht-nav{display:grid;grid-template-columns:auto 1fr;gap:10px}
.ht-nav #htBack{gap:8px}
.ht-nav #htBack[disabled]{visibility:hidden}
@media (prefers-reduced-motion:reduce){.ht-timer i,.ht-caret{animation:none}}
/* Arrows read better in the body face than in the display face */
.btn .arrow{font-family:var(--body);font-weight:800;font-size:24px;line-height:1}
.ht-tiers{display:grid;grid-template-columns:repeat(3,auto);justify-content:center;gap:12px 22px}
.ht-nav{display:flex;gap:10px}
.ht-nav #htNext{flex:1}
.ht-nav #htBack[disabled]{display:none}
.daynav button{font-family:var(--body);font-weight:800}

/* ---------- Owner: manage players ---------- */
.pill{display:inline-block;margin-left:8px;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);color:var(--muted);border-radius:99px;padding:1px 7px;vertical-align:2px}
.pill.bad{border-color:rgba(255,93,115,.5);color:var(--bad)}
.board tr.banned td{opacity:.55}
.board td.act{text-align:right;width:1%;white-space:nowrap}
.mini{font:inherit;font-size:13px;font-weight:800;border-radius:8px;padding:6px 10px;border:1px solid var(--line);background:var(--bg2);color:var(--fg)}
.mini.ok{background:var(--you);border-color:var(--you);color:#06202b}
.mini.danger{border-color:rgba(255,93,115,.5);color:var(--bad)}
.mini[disabled]{opacity:.5}
.board tr.manage td{background:var(--bg2)}
.managebox{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.renrow{display:flex;gap:8px;width:100%}
.renrow input{flex:1;min-width:0;font:inherit;font-size:15px;padding:8px 10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}
.managebox .statnote{margin:0}

/* ---------- Account panel & privacy ---------- */
.legal{font-size:13px;color:var(--muted);text-align:center;margin:0}
.legal a,.acct a{color:var(--you)}
.acctlink{background:none;border:0;padding:0;font:inherit;font-weight:800;color:var(--fg);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.acctlink::after{content:" ▾";font-size:.8em}
.acctlink[aria-expanded="true"]::after{content:" ▴"}
.acct{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:12px}
.acct-row{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:15px;min-width:0}
.acct-row span{color:var(--muted)}
.acct-row b{overflow-wrap:anywhere;text-align:right}
.acct a{font-weight:700;text-decoration:none}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--you)}
.dz{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:10px}
.dz h3{font-size:15px;font-weight:800;color:var(--bad)}
.dz p{margin:0;color:var(--muted);font-size:14px}
.dz input{font:inherit;font-size:16px;padding:11px 12px;border-radius:10px;border:2px solid rgba(255,93,115,.5);background:var(--bg2);color:var(--fg)}
.btn-danger{background:var(--bad);color:#2a0008;box-shadow:0 6px 0 #a3283b}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
a.skip.inline{text-decoration:underline;color:var(--muted)}

/* ---------- Welcome page ---------- */
.wl-logo{justify-content:center;font-size:clamp(34px,11vw,56px)}
.wl-logo .five{font-size:1.3em}
.wl-pitch{text-align:center;margin:-6px 0 0;font-size:18px;color:#c4d0ea;text-wrap:balance}
.wl-pitch b{color:var(--fg)}
.wl-stagewrap{position:relative}
.wl-stage{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 20px 40px rgba(0,0,0,.3);overflow:hidden}
.wl-hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:8px}
.wl-hud .side{display:flex;flex-direction:column;min-width:0}
.wl-hud .side.r{align-items:flex-end;text-align:right}
.wl-hud .who{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.wl-hud .sc{font-family:var(--display);font-size:44px;line-height:1}
.wl-hud .you .who,.wl-hud .you .sc{color:var(--you)} .wl-hud .opp .who,.wl-hud .opp .sc{color:var(--opp)}
.wl-clock{font-family:var(--mono);font-size:24px;font-weight:700;text-align:center;padding-bottom:4px}
.wl-clock.low{color:var(--bad)}
.wl-stage .timer{height:8px}
.wl-cat{text-align:center;min-height:44px;display:flex;flex-direction:column;justify-content:center}
.wl-cat small{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.wl-cat b{font-family:var(--display);font-weight:400;font-size:clamp(22px,7vw,30px);color:var(--bulb);line-height:1.05}
.wl-cat b.slam{animation:slam .45s cubic-bezier(.2,1.6,.4,1) both}
.wl-typed{background:var(--bg2);border:2px solid var(--line);border-radius:10px;padding:10px 12px;font-weight:700;font-size:18px;min-height:46px;display:flex;align-items:center;transition:border-color .2s}
.wl-typed.ok{border-color:var(--good)}
.wl-fb{min-height:20px;text-align:center;font-weight:800;font-size:14px;color:var(--good)}
.wl-chips{min-height:34px}
.wl-chips .chip{padding:4px 11px}
.wl-stagewrap .combo{position:absolute;top:44%}
.wl-live{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;font-size:15px;color:var(--muted)}
.wl-live b{color:var(--fg);font-family:var(--mono)}
.wl-dot{width:8px;height:8px;border-radius:50%;background:var(--good);align-self:center;animation:wlpulse 1.8s infinite}
@keyframes wlpulse{0%{box-shadow:0 0 0 0 rgba(61,220,132,.6)}70%{box-shadow:0 0 0 8px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.wl-ctas{display:flex;flex-direction:column;gap:10px}
.wl-ctas .skip{font-size:14px}
.wl-how{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.wl-how div{background:var(--bg2);border-radius:12px;padding:12px 8px;text-align:center;display:flex;flex-direction:column;gap:2px}
.wl-how b{font-family:var(--display);font-weight:400;font-size:22px;color:var(--bulb)}
.wl-how span{font-size:13px;color:var(--muted)}
.wl-tiers{display:flex;flex-direction:column;gap:10px;align-items:center}
.wl-tiers h2{font-family:var(--display);font-weight:400;font-size:20px}
.wl-tierrow{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;width:100%}
.wl-tier{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.wl-tier i{width:34px;height:34px;border-radius:50%;box-shadow:inset 0 -4px 0 rgba(0,0,0,.2)}
.wl-formcard{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:14px;scroll-margin-top:16px}
.wl-formcard h2{font-family:var(--display);font-weight:400;font-size:24px}
.wl-formcard .tabs{background:var(--bg2)}
.wl-formcard .tabs button[aria-selected="true"]{background:var(--panel)}
.wl-ptag{color:var(--bulb)}
.wl-pround{display:flex;flex-direction:column;gap:14px}
.wl-result{display:flex;flex-direction:column;gap:16px;text-align:center}
.wl-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px}
.wl-vs .side{display:flex;flex-direction:column;align-items:center}
.wl-vs .who{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.wl-vs .sc{font-family:var(--display);font-size:48px;line-height:1}
.wl-vs .you .who,.wl-vs .you .sc{color:var(--you)} .wl-vs .opp .who,.wl-vs .opp .sc{color:var(--opp)}
.wl-center{justify-content:center}