:root{color-scheme:dark;--bg:oklch(.08 0 0);--surface:oklch(.15 .01 68);--ink:oklch(.96 .006 68);--muted:oklch(.73 .018 68);--amber:oklch(.72 .16 68);--aqua:oklch(.82 .12 185);--rule:oklch(.30 .025 68)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);font:400 16px/1.6 ui-sans-serif,system-ui,sans-serif;margin:0}a{color:inherit}.skip{background:var(--aqua);color:var(--bg);left:12px;padding:10px;position:fixed;top:-70px;z-index:30}.skip:focus{top:12px}header,main,footer{margin:auto;max-width:1440px;padding-inline:clamp(20px,5vw,72px)}header{align-items:center;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;padding-block:18px}.brand{align-items:center;display:flex;gap:10px;text-decoration:none}.brand span{align-items:center;background:var(--amber);border-radius:8px;color:var(--bg);display:flex;font-size:.8rem;font-weight:900;height:34px;justify-content:center;width:34px}nav{display:flex;gap:28px}nav a{color:var(--muted);font-size:.9rem;text-decoration:none}.hero{align-items:center;display:grid;gap:8vw;grid-template-columns:1.2fr .8fr;min-height:68vh;padding-block:clamp(80px,11vw,150px)}.release{color:var(--aqua);font-size:.84rem;font-weight:800}.hero h1{font-size:clamp(2.8rem,7vw,6rem);letter-spacing:-.04em;line-height:.98;margin:20px 0 24px;max-width:11ch;text-wrap:balance}.hero p:last-child{color:var(--muted);font-size:1.15rem;max-width:62ch}.route{align-items:center;display:flex;justify-content:space-between;min-height:200px;position:relative}.route::before{background:var(--rule);content:"";height:2px;left:0;position:absolute;right:0}.route span{background:var(--bg);border:2px solid var(--amber);border-radius:50%;height:30px;position:relative;width:30px}.route span:first-child,.route span:last-child{background:var(--amber)}.demo-area{border-top:1px solid var(--rule);padding-block:clamp(70px,9vw,120px)}.demo-nav{align-items:end;display:flex;gap:30px;justify-content:space-between}.demo-nav h2,.events h2{font-size:clamp(2rem,4vw,3.8rem);letter-spacing:-.03em;line-height:1;margin:0 0 10px}.demo-nav p,.events p{color:var(--muted);margin:0}.tabs{display:flex;flex-wrap:wrap;gap:8px}.tabs button{background:transparent;border:1px solid var(--rule);border-radius:999px;color:var(--muted);cursor:pointer;font:inherit;min-height:42px;padding:8px 14px}.tabs button[aria-selected=true]{background:var(--amber);border-color:var(--amber);color:var(--bg);font-weight:800}.tabs button:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--aqua);outline-offset:3px}.demo-stage{display:grid;gap:clamp(30px,6vw,80px);grid-template-columns:minmax(200px,.55fr) minmax(0,1.45fr);margin-top:48px}.demo-stage[hidden]{display:none}.demo-note{border-top:2px solid var(--amber);padding-top:16px}.demo-note p{color:var(--muted)}.demo-stage form{background:var(--surface);border:1px solid var(--rule);border-radius:12px;min-height:590px;padding:clamp(22px,4vw,46px)}.events{border-top:1px solid var(--rule);display:grid;gap:6vw;grid-template-columns:.75fr 1.25fr;padding-block:clamp(70px,9vw,120px)}.event-console{background:oklch(.04 0 0);border:1px solid var(--rule);border-radius:12px;min-height:280px}.event-console>div{align-items:center;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;padding:10px 14px}.event-console button{background:transparent;border:0;color:var(--muted);cursor:pointer;min-height:38px}.event-console ol{color:var(--aqua);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.8rem;max-height:320px;overflow:auto;padding:14px 14px 14px 40px}.event-console li{margin-bottom:5px;overflow-wrap:anywhere}footer{border-top:1px solid var(--rule);color:var(--muted);display:flex;gap:24px;justify-content:space-between;padding-block:34px}@media(max-width:900px){nav{display:none}.hero,.demo-stage,.events{grid-template-columns:1fr}.route{max-width:500px}.demo-nav{align-items:flex-start;flex-direction:column}.demo-stage form{min-height:0}}@media(max-width:620px){.hero{min-height:auto}.tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.tabs button{border-radius:8px}.hero h1{font-size:clamp(2.7rem,15vw,4.6rem)}footer{flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}