:root{--bg: #0a0e12;--bg-grid: rgba(255, 255, 255, .025);--surface: #11161c;--surface-2: #161d26;--surface-3: #1c2531;--border: #1f2a36;--border-hi: #2d3d52;--border-glow: rgba(0, 212, 255, .45);--cyan: #00d4ff;--cyan-dim: #0aa3c2;--accent: #ff4655;--xp: #ffd166;--ok: #2ecc71;--warn: #ffb547;--text: #e8eef5;--text-dim: #8b96a5;--text-mute: #5a6573;--radius-sm: 2px;--radius: 4px;--radius-lg: 6px;--corner-cut: 12px;--border-w: 1px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--space-9: 96px;--container: 1200px;--grid-gap: 24px;--font-display: "Chakra Petch", "Geist", system-ui, sans-serif;--font-body: "Geist", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;--fs-display: clamp(2.5rem, 8vw, 5.5rem);--fs-h1: clamp(1.75rem, 4vw, 2.5rem);--fs-h2: clamp(1.4rem, 2.5vw, 1.875rem);--fs-h3: 1.125rem;--fs-body: 1rem;--fs-sm: .875rem;--fs-xs: .75rem;--fs-tiny: .6875rem;--tracking-hud: .18em;--tracking-sm: .05em;--line-tight: 1.1;--line-snug: 1.3;--line: 1.55;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--dur-fast: .12s;--dur: .22s;--dur-slow: .4s;--glow-cyan: 0 0 0 1px var(--border-glow), 0 0 16px -2px rgba(0, 212, 255, .35);--glow-red: 0 0 0 1px rgba(255, 70, 85, .45), 0 0 16px -2px rgba(255, 70, 85, .35);--shadow-flat: 0 1px 0 rgba(255, 255, 255, .02) inset, 0 0 0 1px var(--border);--z-base: 1;--z-hud: 50;--z-popup: 100;--z-gate: 1000;--z-cursor: 9999}@media(prefers-reduced-motion:reduce){:root{--dur-fast: .001ms;--dur: .001ms;--dur-slow: .001ms}}.cut{--c: var(--corner-cut);clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}.frame{position:relative;background:var(--surface);isolation:isolate}.frame:before{content:"";position:absolute;inset:0;background:var(--border);z-index:-1;clip-path:polygon(var(--corner-cut) 0,100% 0,100% calc(100% - var(--corner-cut)),calc(100% - var(--corner-cut)) 100%,0 100%,0 var(--corner-cut))}.frame>.frame__inner{position:relative;background:var(--surface);clip-path:polygon(calc(var(--corner-cut) + 1px) 1px,calc(100% - 1px) 1px,calc(100% - 1px) calc(100% - var(--corner-cut) - 1px),calc(100% - var(--corner-cut) - 1px) calc(100% - 1px),1px calc(100% - 1px),1px calc(var(--corner-cut) + 1px));padding:var(--space-5)}.frame--accent:before{background:linear-gradient(135deg,var(--cyan) 0%,var(--border-hi) 60%)}.frame--hover{transition:transform var(--dur) var(--ease-out),filter var(--dur) var(--ease-out)}.frame--hover:hover{transform:translateY(-2px);filter:drop-shadow(0 8px 24px rgba(0,212,255,.15))}.brackets{position:relative}.brackets:before,.brackets:after,.brackets>.brackets__tl,.brackets>.brackets__br{content:"";position:absolute;width:14px;height:14px;border-color:var(--cyan);border-style:solid;border-width:0;pointer-events:none}.brackets:before{top:-1px;left:-1px;border-top-width:1px;border-left-width:1px}.brackets:after{top:-1px;right:-1px;border-top-width:1px;border-right-width:1px}.brackets>.brackets__tl{bottom:-1px;left:-1px;border-bottom-width:1px;border-left-width:1px}.brackets>.brackets__br{bottom:-1px;right:-1px;border-bottom-width:1px;border-right-width:1px}.label{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--tracking-hud);text-transform:uppercase;color:var(--text-dim)}.label--accent{color:var(--cyan)}.label--xp{color:var(--xp)}.label--ok{color:var(--ok)}.label--red{color:var(--accent)}.key{display:inline-flex;align-items:center;justify-content:center;min-width:1.6em;height:1.6em;padding:0 .4em;font-family:var(--font-mono);font-weight:700;font-size:var(--fs-xs);color:var(--text);background:var(--surface-3);border:1px solid var(--border-hi);border-bottom-width:2px;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.05em}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);animation:dot-pulse 2.2s var(--ease-in-out) infinite;vertical-align:middle}@keyframes dot-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.divider{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-6) 0;color:var(--text-mute)}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.btn{--bd: var(--border-hi);display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);font-family:var(--font-display);font-weight:600;font-size:var(--fs-sm);letter-spacing:var(--tracking-hud);text-transform:uppercase;color:var(--text);background:var(--surface-2);border:1px solid var(--bd);border-radius:var(--radius);cursor:pointer;transition:transform var(--dur-fast) var(--ease-out),border-color var(--dur) var(--ease-out),background var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out)}.btn:hover{background:var(--surface-3);border-color:var(--cyan);box-shadow:var(--glow-cyan);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn--accent{background:linear-gradient(180deg,#00d4ff2e,#00d4ff0f);border-color:var(--cyan);color:#eafcff}.btn--accent:hover{background:linear-gradient(180deg,#00d4ff52,#00d4ff1f);box-shadow:0 0 0 1px var(--cyan),0 0 28px -4px #00d4ff8c}.btn--ghost{background:transparent;border-color:var(--border)}.btn--sm{padding:var(--space-2) var(--space-4);font-size:var(--fs-xs)}.tag{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;font-family:var(--font-mono);font-size:var(--fs-tiny);letter-spacing:var(--tracking-sm);text-transform:uppercase;color:var(--text-dim);background:var(--surface-3);border:1px solid var(--border);border-radius:var(--radius-sm)}.tag--live{color:var(--ok);border-color:#2ecc7166}.tag--shipped{color:var(--xp);border-color:#ffd16666}.tag--cyan{color:var(--cyan);border-color:#00d4ff66}.section{position:relative;padding:var(--space-9) 0}@media(max-width:768px){.section{padding:var(--space-7) 0}}.section__head{display:flex;align-items:baseline;gap:var(--space-4);margin-bottom:var(--space-6)}.section__head .section__num{font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-mute)}.section__h{font-size:var(--fs-h2);letter-spacing:var(--tracking-sm);text-transform:uppercase}.section__sub{color:var(--text-dim);margin-top:var(--space-2);max-width:60ch}.bar{--segs: 20;--filled: 0;display:grid;grid-template-columns:repeat(var(--segs),1fr);gap:2px;height:10px}.bar__seg{background:var(--surface-3);border-radius:1px;transition:background var(--dur) var(--ease-out)}.bar__seg.is-filled{background:var(--cyan);box-shadow:0 0 6px #00d4ff80}.bar__seg.is-tail{background:var(--cyan-dim)}.hint-row{display:flex;align-items:center;gap:var(--space-3);color:var(--text-mute);font-family:var(--font-mono);font-size:var(--fs-tiny);letter-spacing:var(--tracking-hud);text-transform:uppercase}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth}html,body{margin:0;padding:0;min-height:100%}body{background:radial-gradient(1200px 600px at 20% -10%,rgba(0,212,255,.06),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(255,70,85,.045),transparent 55%),var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--line);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(var(--bg-grid) 1px,transparent 1px),linear-gradient(90deg,var(--bg-grid) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 75%);z-index:0}main{position:relative;z-index:var(--z-base)}img,svg,video{display:block;max-width:100%;height:auto}a{color:var(--cyan);text-decoration:none;transition:color var(--dur) var(--ease-out),text-shadow var(--dur) var(--ease-out)}a:hover{color:var(--text);text-shadow:0 0 12px rgba(0,212,255,.6)}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}::selection{background:var(--cyan);color:var(--bg)}h1,h2,h3,h4,h5{margin:0;font-family:var(--font-display);font-weight:600;line-height:var(--line-tight);letter-spacing:.01em}p{margin:0}.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}@media(max-width:640px){.container{padding:0 var(--space-4)}}.mono{font-family:var(--font-mono)}.dim{color:var(--text-dim)}.mute{color:var(--text-mute)}.up{text-transform:uppercase;letter-spacing:var(--tracking-hud)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}