:root{--bg:#050507;--fg:#f4f6f8;--mid:#9aa3ad;--dim:#5c6570;--cyan:#00F0FF;--amber:#FFB800;--hair:rgba(255,255,255,.08)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:Inter,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
#scene{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;display:block;touch-action:pan-y}
#overlay{position:relative;z-index:1;pointer-events:none}
#overlay a,#overlay button{pointer-events:auto}
.mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mid)}
header{position:fixed;top:0;left:0;right:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:22px 5vw;pointer-events:none;background:linear-gradient(to bottom,rgba(5,5,7,.85),rgba(5,5,7,0))}
header a{pointer-events:auto}
.mark{display:flex;align-items:center;gap:10px;color:var(--fg);text-decoration:none;font-weight:600;letter-spacing:.14em;font-size:13px;text-transform:uppercase}
.mark i{width:12px;height:12px;border:2px solid var(--amber);border-radius:50%;box-shadow:0 0 12px rgba(255,184,0,.6)}
nav{display:flex;gap:26px}
nav a{color:var(--mid);text-decoration:none;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
nav a:hover{color:var(--cyan)}
section{min-height:100vh;display:flex;align-items:center;padding:14vh 5vw}
.hero{flex-direction:column;align-items:flex-start;justify-content:center}
.hero .mono{color:var(--cyan);margin-bottom:22px}
h1{font-weight:700;text-transform:uppercase;font-size:clamp(34px,6.2vw,84px);line-height:.98;letter-spacing:-.005em;max-width:12ch;text-shadow:0 0 40px rgba(0,240,255,.12)}
.sub{margin-top:26px;color:var(--mid);font-size:clamp(16px,1.5vw,20px);line-height:1.55;max-width:52ch}
.cta{display:inline-block;margin-top:40px;padding:16px 30px;border:1px solid var(--cyan);border-radius:3px;color:#02141a;background:var(--cyan);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:12px;text-decoration:none;box-shadow:0 0 28px rgba(0,240,255,.45),inset 0 0 12px rgba(255,255,255,.25);transition:box-shadow .25s,transform .25s}
.cta:hover{box-shadow:0 0 48px rgba(0,240,255,.8);transform:translateY(-1px)}
.right{justify-content:flex-end}
.panel{max-width:440px;background:rgba(5,5,7,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--hair);padding:34px 36px}
.panel h2{font-size:22px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;margin:14px 0 12px}
.panel p{color:var(--mid);line-height:1.6;font-size:15px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair);border:1px solid var(--hair);margin-top:26px}
.stats div{background:rgba(5,5,7,.7);padding:16px 14px}
.stats b{display:block;font-size:22px;color:var(--fg);font-weight:600}
.stats span{font-size:11px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}
.tag{color:var(--amber)}
.tag.cy{color:var(--cyan)}
.final{flex-direction:column;align-items:center;text-align:center;justify-content:center}
.final h2{font-size:clamp(26px,3.6vw,48px);text-transform:uppercase;font-weight:700;max-width:18ch;line-height:1.05}
.final p{color:var(--mid);margin-top:18px;max-width:48ch;line-height:1.6}
footer{position:relative;z-index:1;padding:28px 5vw;border-top:1px solid var(--hair);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;background:rgba(5,5,7,.9)}
footer a{color:var(--mid);text-decoration:none;pointer-events:auto}
footer a:hover{color:var(--cyan)}
#hint{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;color:var(--dim);font-size:10px;letter-spacing:.2em;text-transform:uppercase;pointer-events:none;opacity:1;transition:opacity .6s}
#hint.hide{opacity:0}
@media (max-width:720px){nav{display:none}.panel{max-width:100%}.stats{grid-template-columns:1fr 1fr}section{padding:12vh 6vw}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.rules{list-style:none;margin-top:22px;display:grid;gap:14px}
.rules li{color:var(--mid);font-size:14px;line-height:1.55;padding-left:18px;position:relative}
.rules li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px rgba(255,184,0,.7)}
.rules b{color:var(--fg);font-weight:600;display:block}