:root{
  --bg:#0a0a10; --bg-2:#0d0d15; --panel:#12121c; --panel-2:#161623;
  --red:#e5202f; --red-2:#ff3d4d; --blue:#2f6bff; --blue-2:#5b8dff;
  --ink:#f5f6fb; --muted:#8f95ab; --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16);
  --disp:"Saira Condensed", system-ui, sans-serif; --body:"Sora", system-ui, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* red-left / blue-right ambient, echoing the brand banner split */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(760px 520px at -6% 8%, rgba(229,32,47,.16), transparent 62%),
  radial-gradient(820px 560px at 106% 96%, rgba(47,107,255,.16), transparent 62%),
  linear-gradient(180deg, rgba(0,0,0,.35), transparent 16%)}
h1,h2,h3,h4{font-family:var(--disp);font-weight:800;line-height:1.02;margin:0;letter-spacing:.01em;text-transform:uppercase}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px;border-radius:6px}
img{display:block;max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px;position:relative;z-index:1}
.tnum{font-variant-numeric:tabular-nums}
.mut{color:var(--muted)}
.eyebrow{font-family:var(--body);font-weight:700;font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--blue-2)}

/* chromatic wordmark */
.wm{font-family:var(--disp);font-weight:800;font-style:italic;text-transform:uppercase;line-height:.9;letter-spacing:.01em}
.wm .b{color:var(--blue)}
.wm.glitch{text-shadow:2px 0 rgba(229,32,47,.55), -2px 0 rgba(47,107,255,.55)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:700;font-size:14px;letter-spacing:.02em;padding:14px 24px;border-radius:12px;cursor:pointer;border:1.5px solid transparent;transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease}
.btn-red{background:var(--red);color:#fff;box-shadow:0 10px 30px -12px rgba(229,32,47,.8)}
.btn-red:hover{transform:translateY(-2px);background:var(--red-2)}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 10px 30px -12px rgba(47,107,255,.8)}
.btn-blue:hover{transform:translateY(-2px);background:var(--blue-2)}
.btn-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff}
.btn-ghost:hover{transform:translateY(-2px);background:rgba(47,107,255,.18);border-color:var(--blue);color:#fff}
.btn:disabled,.btn[disabled]{opacity:.55;cursor:default;transform:none}

/* header */
header.site{position:sticky;top:0;z-index:60;backdrop-filter:blur(12px);background:rgba(10,10,16,.78);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.brand{display:flex;align-items:center;gap:11px}
.brand .ico{width:42px;height:42px;object-fit:contain}
.brand .nm{font-family:var(--disp);font-weight:800;font-style:italic;font-size:22px;letter-spacing:.02em}
.brand .nm .b{color:var(--blue)}
nav.links{display:flex;gap:26px}
nav.links a{font-family:var(--body);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);transition:color .16s ease}
nav.links a:hover,nav.links a.active{color:var(--ink)}
@media(max-width:820px){
  header.site .wrap{padding-left:22px;padding-right:22px}
  .nav{flex-wrap:wrap;height:auto;padding:15px 0;gap:12px}
  .brand{flex:1}
  nav.links{order:3;width:100%;justify-content:space-between;gap:6px;font-size:11px;letter-spacing:.04em;border-top:1px solid var(--line);padding-top:12px}
  nav.links a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
  .nav .cta{padding:13px 18px;font-size:13px;min-height:44px}
}

/* hero */
.hero{position:relative;padding:64px 0 40px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:28px;text-align:center}}
.hero .code{display:inline-flex;align-items:stretch;border-radius:10px;overflow:hidden;margin-bottom:22px;box-shadow:0 12px 34px -16px rgba(0,0,0,.9)}
.hero .code b{background:var(--red);color:#fff;font-family:var(--body);font-weight:800;font-size:13px;letter-spacing:.14em;padding:9px 14px;text-transform:uppercase}
.hero .code span{background:var(--panel-2);color:var(--blue-2);font-family:var(--disp);font-weight:800;font-size:18px;letter-spacing:.14em;padding:6px 18px;display:flex;align-items:center;border:1px solid var(--line-2);border-left:0}
.hero h1{font-size:clamp(48px,9vw,104px)}
.hero .lede{margin:18px auto 26px;max-width:46ch;color:var(--muted);font-size:17px}
@media(min-width:901px){.hero .lede{margin-left:0}}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:900px){.hero-cta{justify-content:center}}
.hero-art{position:relative;display:flex;justify-content:center}
.hero-art img{width:min(380px,86%);height:auto;filter:drop-shadow(0 24px 60px rgba(229,32,47,.45)) drop-shadow(0 8px 30px rgba(47,107,255,.3))}

/* stat bar */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px}
@media(max-width:640px){.stats{grid-template-columns:1fr}}
.stat{background:linear-gradient(180deg,var(--panel),var(--bg-2));border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.stat .n{font-family:var(--disp);font-weight:800;font-size:34px;line-height:1}
.stat .n.red{color:var(--red-2)}.stat .n.blue{color:var(--blue-2)}
.stat .l{color:var(--muted);font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-top:6px}

/* sections */
.sec{padding:56px 0}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:26px}
.sec-head h2{font-size:clamp(28px,5vw,44px)}
.sec-head p{color:var(--muted);margin:6px 0 0;max-width:52ch}

/* cards row */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:820px){.cards{grid-template-columns:1fr}}
.card{position:relative;background:linear-gradient(180deg,var(--panel),#0e0e17);border:1px solid var(--line);border-radius:16px;padding:24px;overflow:hidden;transition:transform .2s ease,border-color .2s ease}
.card:hover{transform:translateY(-4px);border-color:var(--line-2)}
.card .tag{font-family:var(--body);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.card .tag.red{color:var(--red-2)}.card .tag.blue{color:var(--blue-2)}
.card h3{font-size:22px;margin:10px 0 8px}
.card p{color:var(--muted);font-size:14px;margin:0 0 16px}
.card .edge{position:absolute;top:0;left:0;width:4px;height:100%}

/* leaderboard preview */
.board{background:linear-gradient(180deg,var(--panel),#0e0e17);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.board .row{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:12px;padding:14px 20px;border-top:1px solid var(--line)}
.board .row:first-child{border-top:0}
.board .rk{font-family:var(--disp);font-weight:800;font-size:22px;color:var(--muted);text-align:center}
.board .row.t1 .rk{color:#ffd76a}.board .row.t2 .rk{color:#cfd6e6}.board .row.t3 .rk{color:#e0955a}
.board .nm{font-weight:600}
.board .wg{font-family:var(--disp);font-weight:800;font-size:20px;color:var(--blue-2)}
.board .head{display:grid;grid-template-columns:56px 1fr auto;gap:12px;padding:14px 20px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:var(--panel-2)}

/* footer */
footer.site{border-top:1px solid var(--line);padding:44px 0 40px;background:#08080d;position:relative;z-index:1;margin-top:20px}
.foot{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot .cols{display:flex;gap:40px;flex-wrap:wrap}
.foot .cols a{color:var(--muted);font-size:14px;display:block;margin-bottom:8px}
.foot .cols a:hover{color:var(--ink)}
.foot .cols .h{color:var(--ink);font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:12px}
.legal{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:13px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* legal / prose pages */
.legal-hero{padding:52px 0 8px}
.legal-hero h1{font-size:clamp(34px,7vw,60px)}
.legal-hero .upd{color:var(--muted);font-size:13px;letter-spacing:.06em;margin-top:10px}
.prose{max-width:800px;margin:0 auto;padding:22px 0 64px}
.prose h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:22px;letter-spacing:.02em;margin:34px 0 10px;color:var(--ink)}
.prose p,.prose li{color:var(--muted);font-size:15px;line-height:1.75;margin:8px 0}
.prose ul{padding-left:20px;margin:8px 0}
.prose a{color:var(--blue-2)}
.prose b{color:var(--ink)}

.rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
