:root{--ink:#0B1020;--ink-2:#121A2E;--grid:#161F38;--blue:#1F5CE0;--blue-deep:#1848B8;--sky:#6FB7FF;--paper:#F4F7FF;--muted:#B9C3DC;--coin:#FFD23F;--alert:#FF5C7A;--head:"Chakra Petch",system-ui,sans-serif;--body:"Barlow",system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--body);font-weight:400;color:var(--paper);background:var(--ink);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:26px 26px;line-height:1.5;overflow-x:hidden}a{color:inherit}.hero{position:relative;display:grid;grid-template-columns:1fr;overflow:hidden}.bar{position:relative;z-index:2;display:flex;align-items:center;gap:10px;padding:16px 20px 0}.bar img{width:40px;height:40px;border-radius:10px;border:3px solid var(--paper);object-fit:cover}.wordmark{font-family:var(--head);font-weight:700;font-size:clamp(1.05rem,1rem+.4vw,1.3rem);letter-spacing:.04em;text-transform:uppercase}.copy{position:relative;z-index:2;padding:22px 20px 34px;max-width:620px}.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:2px solid var(--sky);border-radius:4px;background:var(--ink-2);font-family:var(--head);font-weight:700;font-size:clamp(.7rem,.66rem+.2vw,.8rem);letter-spacing:.12em;text-transform:uppercase;color:var(--sky)}.chip i{width:8px;height:8px;border-radius:50%;background:var(--coin);animation:blink 1.6s steps(2,start) infinite}h1{margin-top:16px;font-family:var(--head);font-weight:700;font-size:clamp(2rem,1.3rem+3.4vw,3.9rem);line-height:1.02;letter-spacing:-.01em;text-transform:uppercase}h1 span{color:var(--coin);display:inline-block}.lead{margin-top:16px;font-size:clamp(1rem,.95rem+.35vw,1.2rem);color:var(--muted);max-width:34em}.lead strong{color:var(--paper);font-weight:600}.cta-wrap{margin-top:24px}.cta{position:relative;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;background:var(--coin);color:var(--ink);border:3px solid var(--ink);border-radius:6px;box-shadow:0 0 0 3px var(--coin),6px 6px 0 3px var(--blue);font-family:var(--head);font-weight:700;font-size:clamp(1rem,.95rem+.4vw,1.2rem);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:transform .15s ease}.cta svg{width:20px;height:20px;transition:transform .15s ease}.cta:hover{transform:translate(-2px,-2px)}.cta:hover svg{transform:translateX(4px)}.cta:active{transform:translate(3px,3px)}.cta:focus-visible{outline:3px solid var(--sky);outline-offset:8px}.under{margin-top:16px;font-size:clamp(.85rem,.82rem+.15vw,.95rem);color:var(--muted)}.stage{position:relative;z-index:1;background:var(--blue);padding:44px 16px 28px;clip-path:polygon(0 26px,100% 0,100% 100%,0 100%);overflow:hidden;touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}.stage::before,.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(11,16,32,.12) 0 1px,transparent 1px 4px),repeating-linear-gradient(115deg,transparent 0 70px,rgba(111,183,255,.16) 70px 110px,transparent 110px 190px)}.stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(11,16,32,.35) 100%)}.hero::before{display:none}.scene{position:relative;z-index:1;display:block;width:100%;max-width:440px;margin:0 auto;height:auto;overflow:visible}.rig{transform-box:view-box;transform-origin:200px 200px}.eye-up{transform-box:fill-box;transform-origin:center}.shade{transition:opacity .12s linear}.hud{position:relative;z-index:1;display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:6px}.badge{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;background:var(--ink);border:3px solid var(--ink);box-shadow:inset 0 0 0 2px var(--sky);border-radius:4px;font-family:var(--head);font-weight:700;font-size:clamp(.72rem,.68rem+.2vw,.85rem);letter-spacing:.1em;text-transform:uppercase;color:var(--paper);white-space:nowrap}.badge b{font-weight:700;color:var(--sky);min-width:3.2ch;text-align:right;display:inline-block}.badge.state b{min-width:5.6ch;text-align:left}.badge.state.hidden{box-shadow:inset 0 0 0 2px var(--coin)}.badge.state.hidden b{color:var(--coin)}.hint{position:relative;z-index:1;margin-top:12px;text-align:center;font-size:clamp(.82rem,.8rem+.1vw,.9rem);font-weight:600;color:var(--paper)}.steps{padding:56px 20px 64px}.steps-in{width:100%;max-width:1120px;margin:0 auto}.steps h2{font-family:var(--head);font-weight:700;font-size:clamp(1.4rem,1.1rem+1.4vw,2.2rem);line-height:1.1;text-transform:uppercase;max-width:20em}.steps ol{list-style:none;display:grid;grid-template-columns:1fr;gap:18px;margin-top:28px}.steps li{position:relative;padding:22px 20px 22px;background:var(--ink-2);border:3px solid var(--paper);border-radius:6px;box-shadow:6px 6px 0 var(--blue)}.num{display:inline-grid;place-items:center;width:40px;height:40px;background:var(--coin);color:var(--ink);border:3px solid var(--ink);box-shadow:0 0 0 2px var(--coin);border-radius:4px;font-family:var(--head);font-weight:700;font-size:1.15rem}.steps h3{margin-top:14px;font-family:var(--head);font-weight:700;font-size:clamp(1.05rem,1rem+.3vw,1.25rem);text-transform:uppercase;letter-spacing:.03em}.steps p{margin-top:6px;color:var(--muted);font-size:clamp(.95rem,.92rem+.15vw,1.05rem)}.steps .cta-wrap{margin-top:36px}footer{border-top:3px solid var(--ink-2);background:var(--ink);padding:22px 20px 28px;text-align:center;font-size:clamp(.85rem,.82rem+.15vw,.95rem);color:var(--muted)}footer strong{font-family:var(--head);font-weight:700;color:var(--paper);letter-spacing:.06em;text-transform:uppercase}@keyframes blink{to{opacity:.15}}@media(min-width:700px){.steps ol{grid-template-columns:repeat(3,1fr)}}@media(min-width:960px){.hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto 1fr;min-height:100svh}.hero::before{display:block;background-color:var(--blue);clip-path:polygon(60% 0,100% 0,100% 100%,44% 100%)}.bar{grid-column:1 / -1;padding:24px 40px 0}.copy{align-self:center;padding:32px 24px 56px 40px;max-width:600px;justify-self:end}.stage{align-self:center;background:transparent;clip-path:none;padding:24px 32px 48px 48px}.stage::before,.stage::after{display:none}.scene{max-width:500px}.steps{padding:72px 40px 80px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}html,body{max-width:100%;overflow-x:clip}