[hidden]{display:none!important}
:root{
  color-scheme:dark;
  --ground:#120f14; --panel:#1b161f; --panel2:#241d29; --line:#352b3b;
  --ink:#f1e9ef; --muted:#a898a6; --faint:#7a6c7b;
  --ember:#ff6a2b; --ember2:#ffa15c; --gold:#f2c14e; --silver:#c9cbd6; --bronze:#c98552;
  --ok:#5fd39a; --warn:#f2c14e; --bad:#ff5d6c; --discord:#5865f2;
  --display:"Saira Condensed","Arial Narrow",sans-serif;
  --body:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box}
html{background:var(--ground)}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;color:var(--ink);font:15px/1.6 var(--body);
  background:
    radial-gradient(1100px 460px at 85% -10%,rgba(255,106,43,.16),transparent 60%),
    radial-gradient(800px 360px at -10% 10%,rgba(120,40,90,.22),transparent 60%),var(--ground);
  background-repeat:no-repeat}
main{flex:1;width:100%;max-width:1120px;margin:0 auto;padding-inline:20px;padding-block:32px 64px;display:grid;gap:32px;align-content:start}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;line-height:1.05;text-wrap:balance;margin:0}
h1{font-size:clamp(40px,7vw,68px);font-weight:800}
h1 span{color:var(--ember)}
h2{font-size:clamp(26px,4vw,34px);font-weight:700}
h3{font-size:20px;font-weight:700}
p{margin:0;max-width:66ch}
a{color:var(--ember2)}
.muted{color:var(--muted)}
.small{font-size:13px}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.eyebrow{font:600 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ember)}
:focus-visible{outline:2px solid var(--ember2);outline-offset:2px}

/* header */
.nav{position:sticky;top:0;z-index:10;background:rgba(18,15,20,.82);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav-in{max-width:1120px;margin:0 auto;padding:12px 20px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.logo{font:800 26px/1 var(--display);letter-spacing:.04em;color:var(--ink);text-decoration:none;margin-right:auto}
.logo em{font-style:normal;color:var(--ember)}
.links{display:flex;flex-wrap:wrap;gap:2px}
.links a{color:var(--muted);text-decoration:none;font:600 13px var(--body);padding:8px 11px;border-radius:8px}
.links a:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.links a[aria-current="page"]{color:var(--ink);background:rgba(255,106,43,.14);box-shadow:inset 0 -2px 0 var(--ember)}
.who{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.who{text-decoration:none}
.who-slot{display:inline-block;width:80px;height:30px}
.btn.twitch{background:#9146ff;color:#fff}
.who img{width:26px;height:26px;border-radius:50%}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;font:700 13px var(--body);letter-spacing:.05em;text-transform:uppercase;padding:11px 18px;cursor:pointer;text-decoration:none;color:#1a0d06;background:linear-gradient(180deg,var(--ember2),var(--ember))}
.btn:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.discord{background:var(--discord);color:#fff}
.btn.sm{padding:7px 12px;font-size:12px}
.btn[disabled]{opacity:.45;cursor:not-allowed;filter:none}
.code{display:inline-flex;align-items:center;gap:10px;border:1px dashed var(--ember);border-radius:10px;padding:8px 14px;font:700 17px var(--mono);color:var(--ember2);background:transparent;cursor:pointer}
.code small{font:600 11px var(--body);color:var(--muted);text-transform:uppercase;letter-spacing:.08em}

/* blocks */
.card{background:rgba(27,22,31,.85);border:1px solid var(--line);border-radius:14px;padding:20px;display:grid;gap:14px;align-content:start}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
.hero-copy{display:grid;gap:16px}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.player{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#000;aspect-ratio:16/9;width:100%}
.player iframe{width:100%;height:100%;border:0;display:block}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat{border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:14px 16px;background:rgba(255,255,255,.02)}
.stat b{display:block;font:700 26px var(--mono);font-variant-numeric:tabular-nums}
.stat span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.countdown{display:flex;gap:8px}
.countdown div{background:rgba(0,0,0,.35);border:1px solid var(--line);border-radius:8px;padding:6px 10px;text-align:center;min-width:54px}
.countdown b{display:block;font:700 18px var(--mono)}
.countdown span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.pill{display:inline-flex;align-items:center;gap:6px;font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:4px 10px}
.pill.green{background:rgba(95,211,154,.14);color:var(--ok)}
.pill.amber{background:rgba(242,193,78,.14);color:var(--warn)}
.pill.red{background:rgba(255,93,108,.14);color:var(--bad)}
.pill.grey{background:rgba(255,255,255,.07);color:var(--muted)}

/* leaderboard */
.podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:12px;align-items:end}
.pod{border-radius:14px;padding:18px 14px;text-align:center;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);display:grid;gap:6px}
.pod .rank{font:800 34px/1 var(--display)}
.pod.p1{padding-block:30px;border-color:rgba(242,193,78,.5);background:linear-gradient(180deg,rgba(242,193,78,.12),rgba(255,255,255,.02))}
.pod.p1 .rank{color:var(--gold)}.pod.p2 .rank{color:var(--silver)}.pod.p3 .rank{color:var(--bronze)}
.pod .name{font-weight:600}
.pod .prize{font:700 20px var(--mono);color:var(--ember2)}
.pod.empty{opacity:.4}
.tablewrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font:600 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--faint);padding:8px 10px;border-bottom:1px solid var(--line)}
td{padding:10px;border-bottom:1px solid rgba(255,255,255,.05)}
td.r,th.r{text-align:right}
tr.you td{background:rgba(255,106,43,.1)}
.empty-state{text-align:center;padding:36px 16px;color:var(--muted)}
select,input,textarea{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--ink);font:14px var(--body)}
textarea{font-family:var(--mono);font-size:13px;min-height:180px;width:100%;resize:vertical}

/* rewards */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.tier{border-radius:12px;padding:14px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02);display:grid;gap:6px;align-content:start}
.tier .t{font:800 21px var(--display);text-transform:uppercase}
.tier.reached{border-color:rgba(95,211,154,.35)}
.tier.next{border-color:var(--ember);background:rgba(255,106,43,.08)}
.progress{height:10px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--ember),var(--gold))}

/* forms */
.form{display:grid;gap:16px;max-width:520px;width:100%;margin:0 auto}
.form label{display:grid;gap:6px;font-size:13px;font-weight:600}
.form small{font-weight:400;color:var(--faint);font-size:12px}
.form small.warn{color:var(--warn)}
.linked{display:flex;align-items:center;gap:10px;border:1px solid rgba(88,101,242,.5);background:rgba(88,101,242,.1);border-radius:10px;padding:10px 12px;font-size:14px}
.linked.twitch{border-color:rgba(145,70,255,.5);background:rgba(145,70,255,.1)}
.linked img{width:28px;height:28px;border-radius:50%}
.msg{border-radius:10px;padding:10px 14px;font-size:14px;white-space:pre-line}
.msg.ok{background:rgba(95,211,154,.12);color:var(--ok)}
.msg.err{background:rgba(255,93,108,.12);color:var(--bad)}

/* footer */
.foot{border-top:1px solid rgba(255,255,255,.06);color:var(--faint);font-size:12px}
.foot-in{max-width:1120px;margin:0 auto;padding:20px;display:grid;gap:10px}
.foot .disclaimer{color:var(--muted);max-width:none}
.foot .socials{display:flex;flex-wrap:wrap;gap:6px 16px}
.foot a{color:var(--muted)}

@media (max-width:780px){
  .hero{grid-template-columns:1fr}
  .podium{grid-template-columns:1fr}
  .pod.p1{order:-1}
}
@media (max-width:520px){.stats{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.btn,.links a{transition:background .15s,color .15s,filter .15s}}