@import"https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Instrument+Sans:wght@400;500;600&display=swap";:root{--ink: oklch(97% .008 285);--muted: oklch(66% .018 285);--faint: oklch(48% .016 285);--canvas: oklch(10.5% .012 285);--panel: oklch(14% .014 285);--panel-raised: oklch(17% .016 285);--line: oklch(25% .018 285);--line-bright: oklch(34% .025 285);--violet: oklch(69% .2 299);--violet-bright: oklch(78% .18 302);color:var(--ink);background:var(--canvas);font-family:Instrument Sans,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--violet);outline-offset:3px}body:before{position:fixed;inset:0;z-index:-1;content:"";pointer-events:none;background-image:linear-gradient(oklch(100% 0 0 / .026) 1px,transparent 1px),linear-gradient(90deg,oklch(100% 0 0 / .026) 1px,transparent 1px);background-size:52px 52px;-webkit-mask-image:linear-gradient(to bottom,black,transparent 76%);mask-image:linear-gradient(to bottom,black,transparent 76%)}main{width:min(1180px,calc(100% - 40px));margin:0 auto}.nav{position:sticky;top:0;z-index:20;height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid var(--line);background:#040307d1;-webkit-backdrop-filter:blur(18px) saturate(135%);backdrop-filter:blur(18px) saturate(135%)}.brand{justify-self:start;display:inline-flex;align-items:center;gap:10px;color:inherit;font-size:17px;font-weight:600;text-decoration:none;letter-spacing:-.04em}.version{padding:3px 6px;border:1px solid var(--line);border-radius:5px;color:var(--faint);font:500 9px/1 DM Mono,monospace;letter-spacing:.02em}.nav-links{display:flex;align-items:center;gap:28px}.nav-links a{color:var(--muted);font-size:13px;text-decoration:none;transition:color .2s}.nav-links a:hover{color:var(--ink)}.nav-action{justify-self:end;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--line-bright);border-radius:8px;color:var(--ink);background:var(--panel-raised);font-size:12px;text-decoration:none;transition:border-color .2s,background .2s}.nav-action:hover{border-color:var(--violet);background:color-mix(in oklch,var(--panel-raised),var(--violet) 8%)}.hero{min-height:680px;padding:104px 0 96px;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(360px,.82fr);align-items:center;gap:56px}.hero-copy{position:relative;z-index:2}.eyebrow,.kicker,label,.label{color:var(--muted);font:500 10px/1.2 DM Mono,monospace;letter-spacing:.13em;text-transform:uppercase}.eyebrow{display:flex;align-items:center;gap:9px}.eyebrow>span{width:6px;height:6px;border-radius:50%;background:var(--violet);box-shadow:0 0 18px var(--violet)}h1{max-width:760px;margin:24px 0 26px;font-size:clamp(56px,7vw,94px);font-weight:500;line-height:.94;letter-spacing:-.075em;text-wrap:balance}h1 em{color:var(--muted);font-style:normal}.lede{max-width:620px;margin:0;color:var(--muted);font-size:clamp(16px,1.8vw,19px);line-height:1.7;letter-spacing:-.018em}.hero-actions{display:flex;align-items:center;gap:10px;margin-top:36px}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:0 15px;border:1px solid transparent;border-radius:9px;font-size:13px;font-weight:500;text-decoration:none;transition:transform .2s,border-color .2s,background .2s}.button:hover{transform:translateY(-1px)}.button.primary{color:#0c0c16;background:var(--ink)}.button.primary:hover{background:#fff}.button.secondary{border-color:var(--line);background:var(--panel);color:var(--muted)}.button.secondary:hover{border-color:var(--line-bright);color:var(--ink)}.hero-orbit{position:relative;min-height:420px;display:grid;place-items:center;isolation:isolate}.hero-orbit:before{position:absolute;width:310px;aspect-ratio:1;border-radius:50%;content:"";background:conic-gradient(from 120deg,oklch(62% .23 305 / .18),oklch(70% .19 210 / .06),transparent 55%,oklch(72% .2 20 / .12));filter:blur(46px)}.orbit-line{position:absolute;width:360px;aspect-ratio:1;border:1px solid var(--line);border-radius:50%;transform:rotate(-18deg) scaleY(.72)}.orbit-line:before,.orbit-line:after{position:absolute;top:50%;width:5px;height:5px;border-radius:50%;content:"";background:var(--line-bright)}.orbit-line:before{left:-3px}.orbit-line:after{right:-3px}.orbit-avatar{position:absolute;z-index:2;box-shadow:0 26px 70px #00000080}.orbit-a{transform:translate(-18px,2px) rotate(-5deg)}.orbit-b{transform:translate(126px,-105px) rotate(9deg)}.orbit-c{transform:translate(-137px,116px) rotate(-8deg)}.orbit-label{position:absolute;right:14px;bottom:58px;display:inline-flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--muted);font:500 9px/1 DM Mono,monospace;letter-spacing:.08em}.spec-strip{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}.spec-strip>div{min-height:104px;display:flex;align-items:center;gap:14px;padding:24px 30px;color:var(--faint)}.spec-strip>div+div{border-left:1px solid var(--line)}.spec-strip svg{color:var(--violet-bright)}.spec-strip span{display:grid;gap:4px;color:var(--faint);font-size:11px}.spec-strip strong{color:var(--ink);font-size:13px;font-weight:500}.playground-section,.gallery-section,.code-section{padding:116px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:48px;margin-bottom:52px}.section-heading.compact{margin-bottom:32px}.section-heading h2,.code-copy h2{max-width:670px;margin:14px 0 0;font-size:clamp(38px,5vw,60px);font-weight:500;line-height:1.04;letter-spacing:-.06em;text-wrap:balance}.section-heading p{max-width:350px;margin:0 0 5px;color:var(--muted);font-size:14px;line-height:1.7}.runtime-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font:500 9px/1 DM Mono,monospace;letter-spacing:.06em;text-transform:uppercase}.runtime-pill span,.code-status>span{width:6px;height:6px;border-radius:50%;background:#1cce79;box-shadow:0 0 10px #1cce79}.playground{display:grid;grid-template-columns:minmax(360px,1.22fr) minmax(320px,.78fr);min-height:550px;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.preview-stage{position:relative;display:grid;place-items:center;min-height:460px;overflow:hidden;border-right:1px solid var(--line);background:radial-gradient(circle at 50% 45%,var(--panel-raised),var(--canvas) 68%)}.preview-stage:before{position:absolute;inset:24px;border:1px solid var(--line);border-radius:10px;content:""}.preview-stage:after{position:absolute;inset:50% auto auto 50%;width:8px;height:8px;border:1px solid var(--line-bright);border-radius:50%;content:"";transform:translate(-50%,-50%)}.preview-stage canvas{position:relative;z-index:2;filter:drop-shadow(0 30px 45px oklch(0% 0 0 / .46))}.preview-glow{position:absolute;width:360px;height:360px;border-radius:50%;background:var(--violet);opacity:.09;filter:blur(90px)}.stage-meta{position:absolute;top:39px;left:40px;right:40px;display:flex;justify-content:space-between;color:var(--faint);font:500 8px/1 DM Mono,monospace;letter-spacing:.1em;text-transform:uppercase}.controls{display:flex;flex-direction:column;justify-content:center;gap:28px;padding:clamp(30px,5vw,52px)}.field{display:grid;gap:10px}.field-help{color:var(--faint);font-size:10px}.input-shell{height:47px;display:flex;align-items:center;gap:9px;padding:0 13px;border:1px solid var(--line-bright);border-radius:8px;background:var(--panel-raised);color:var(--faint);transition:border-color .2s,box-shadow .2s}.input-shell:focus-within{border-color:var(--violet);box-shadow:0 0 0 3px #ad7aff24;box-shadow:0 0 0 3px oklch(69% .2 299 / .14)}.input-shell input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--ink);font:400 12px/1 DM Mono,monospace}.segmented{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:4px;border:1px solid var(--line);border-radius:9px;background:var(--canvas)}.segmented.three{grid-template-columns:repeat(3,1fr)}.segmented button{min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:6px;background:transparent;color:var(--faint);padding:8px 5px;cursor:pointer;font-size:10px;text-transform:capitalize;transition:background .2s,color .2s}.segmented button:hover{color:var(--ink)}.segmented button[data-active=true]{background:var(--panel-raised);color:var(--ink);box-shadow:0 1px 4px #00000059}.swatch{width:6px;height:6px;border-radius:50%}.swatch-lava{background:conic-gradient(#ff3d81,#8b5cf6,#27e7c4,#ff3d81)}.swatch-aurora{background:#2ce6b5}.swatch-plasma{background:#f05cff}.swatch-mono{background:#b8b8bf}.inline-code-link{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px 13px;border:1px solid var(--line);border-radius:8px;background:var(--canvas);color:var(--faint);text-decoration:none;transition:border-color .2s,color .2s}.inline-code-link:hover{border-color:var(--line-bright);color:var(--violet-bright)}.inline-code-link code{min-width:0;overflow:hidden;color:var(--violet-bright);font:400 10px/1.5 DM Mono,monospace;white-space:nowrap;text-overflow:ellipsis}.gallery-section{border-top:1px solid var(--line)}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.person{display:grid;gap:18px;margin:0;padding:13px 13px 18px;border:1px solid var(--line);border-radius:13px;background:var(--panel);transition:border-color .25s,transform .25s}.person:hover{border-color:var(--line-bright);transform:translateY(-3px)}.person>canvas{aspect-ratio:1}.person>div{display:grid;gap:4px;padding:0 4px}.person strong{font-size:13px;font-weight:500}.person span{color:var(--faint);font:400 10px/1.4 DM Mono,monospace}.code-section{display:grid;grid-template-columns:.78fr 1.22fr;align-items:center;gap:clamp(48px,8vw,100px);border-top:1px solid var(--line)}.code-copy p{max-width:480px;margin:24px 0;color:var(--muted);font-size:14px;line-height:1.75}.code-copy ul{display:grid;gap:10px;margin:0 0 28px;padding:0;list-style:none;color:var(--muted);font-size:12px}.code-copy li{display:flex;align-items:center;gap:9px}.code-copy li svg{color:#1cce79}.docs-link{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font-size:12px;text-decoration:none}.docs-link:hover{color:var(--violet-bright)}.code-window{overflow:hidden;border:1px solid var(--line-bright);border-radius:13px;background:#020204;box-shadow:0 32px 90px #00000047}.code-toolbar{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 18px;border-bottom:1px solid var(--line);background:var(--panel)}.code-tabs{display:flex;gap:18px;height:100%}.code-tabs button{position:relative;border:0;background:none;color:var(--faint);cursor:pointer;font:500 10px/1 DM Mono,monospace}.code-tabs button[aria-selected=true]{color:var(--ink)}.code-tabs button[aria-selected=true]:after{position:absolute;right:0;bottom:-1px;left:0;height:1px;content:"";background:var(--violet-bright)}.copy-button{display:inline-flex;align-items:center;gap:7px;min-height:31px;padding:0 9px;border:1px solid var(--line);border-radius:6px;background:var(--panel-raised);color:var(--muted);cursor:pointer;font-size:10px}.copy-button:hover{color:var(--ink);border-color:var(--line-bright)}.code-window pre{min-height:340px;margin:0;padding:28px;overflow:auto;color:#ceceeb;font:400 11px/1.8 DM Mono,monospace;tab-size:2}.code-status{height:40px;display:flex;align-items:center;gap:8px;padding:0 16px;border-top:1px solid var(--line);color:var(--faint);font:400 9px/1 DM Mono,monospace}.code-language{margin-left:auto}footer{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);color:var(--faint);font-size:11px}.footer-brand,.footer-links,.footer-links a{display:flex;align-items:center}.footer-brand{gap:9px;color:var(--ink);font-weight:500}.footer-brand .muted{margin-left:8px;color:var(--faint);font-weight:400}.footer-links{gap:20px}.footer-links a{gap:4px;color:var(--muted);text-decoration:none}.footer-links a:hover{color:var(--ink)}@media(max-width:900px){.nav{grid-template-columns:1fr auto}.nav-links{display:none}.hero{grid-template-columns:1fr;padding-top:82px}.hero-orbit{min-height:360px}.playground{grid-template-columns:1fr}.preview-stage{border-right:0;border-bottom:1px solid var(--line)}.code-section{grid-template-columns:1fr}}@media(max-width:700px){main{width:min(100% - 24px,1180px)}.hero{min-height:auto;padding:70px 0 78px}.hero h1{font-size:clamp(50px,15vw,76px)}.hero-orbit{min-height:320px;transform:scale(.88)}.spec-strip{grid-template-columns:1fr}.spec-strip>div{min-height:78px}.spec-strip>div+div{border-top:1px solid var(--line);border-left:0}.playground-section,.gallery-section,.code-section{padding:86px 0}.section-heading{align-items:start;flex-direction:column}.section-heading.compact{flex-direction:row;align-items:end}.gallery{grid-template-columns:repeat(2,1fr)}footer{align-items:start;flex-direction:column;padding:28px 0}.footer-brand{flex-wrap:wrap}.footer-brand .muted{width:100%;margin-left:33px}.footer-links{flex-wrap:wrap}}@media(max-width:470px){.nav-action{padding-inline:9px;font-size:0}.nav-action svg{width:17px;height:17px}.hero-actions{align-items:stretch;flex-direction:column}.hero-orbit{min-height:280px;transform:scale(.72);margin-inline:-50px}.section-heading.compact{align-items:start;flex-direction:column}.gallery{grid-template-columns:1fr}.controls{padding:26px 20px}.segmented button{font-size:9px}.code-window pre{min-height:300px;padding:20px;font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}