:root{color-scheme:light dark;--ink: light-dark(oklch(20% .045 var(--accent-h)), oklch(93% .04 var(--accent-h)));--ink-soft: light-dark(oklch(46% .052 var(--accent-h)), oklch(64% .046 var(--accent-h)));--ink-faint: light-dark(oklch(53% .055 var(--accent-h)), oklch(58% .05 var(--accent-h)));--paper: light-dark(oklch(97% .012 var(--accent-h)), oklch(16% .02 var(--accent-h)));--surface: light-dark(oklch(99.5% .008 var(--accent-h)), oklch(20% .022 var(--accent-h)));--line: light-dark(oklch(89% .018 var(--accent-h)), oklch(28% .024 var(--accent-h)));--line-strong: light-dark(oklch(80% .022 var(--accent-h)), oklch(36% .028 var(--accent-h)));--accent-h: 280;--accent: light-dark( oklch(52% .27 var(--accent-h)), oklch(74% .21 var(--accent-h)) );--accent-ink: light-dark(oklch(46% .27 var(--accent-h)), oklch(78% .2 var(--accent-h)));--accent-soft: light-dark( oklch(95% .05 var(--accent-h)), oklch(27% .09 var(--accent-h)) );--step--1: clamp(.78rem, .74rem + .18vw, .88rem);--step-0: clamp(1rem, .95rem + .24vw, 1.13rem);--step-1: clamp(1.3rem, 1.18rem + .55vw, 1.66rem);--step-2: clamp(1.7rem, 1.46rem + 1.1vw, 2.55rem);--step-3: clamp(2.2rem, 1.7rem + 2.3vw, 3.7rem);--step-4: clamp(3.2rem, 2.1rem + 5.4vw, 7.5rem);--space-1: .5rem;--space-2: 1rem;--space-3: 1.5rem;--space-4: 2.5rem;--space-5: clamp(4rem, 9vw, 7rem);--space-6: clamp(7rem, 16vw, 13rem);--measure: 38rem;--shell: min(72rem, 92vw);--gutter: clamp(1.25rem, 4vw, 4rem);--radius: 16px;--font-display: "Archivo", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-sans: "Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "Spline Sans Mono", ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring-3: linear( 0, .009, .035 2.1%, .141 4.4%, .723 12.9%, .938 16.7%, 1.017, 1.077, 1.121, 1.149 24.3%, 1.159, 1.163, 1.161, 1.154 29.9%, 1.129 32.8%, 1.051 39.6%, 1.017 43.1%, .991, .977 51%, .974 53.8%, .98 57.1%, 1.018 69.2%, 1.006 81.4%, .997 94.7%, 1 );--scroll-thumb: color-mix(in oklab, var(--accent) 80%, var(--line))}html[data-theme=light]{color-scheme:light}html[data-theme=dark]{color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-color:var(--scroll-thumb) transparent}:where(:not(:root)){scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-sans);font-size:var(--step-0);line-height:1.6;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}code{font-family:var(--font-mono);font-size:.88em;font-weight:500}.display,h2{line-height:.94;letter-spacing:-.035em;font-weight:800;text-wrap:balance;margin:0}:where(a,button,input,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}.hud{position:fixed;top:var(--space-3);right:var(--space-3);z-index:40;margin:0;display:grid;gap:2px;padding:.55rem .7rem;border:1px solid var(--line);border-radius:8px;background:color-mix(in oklab,var(--surface) 78%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-family:var(--font-mono);font-size:.66rem;font-weight:500;letter-spacing:.02em;color:var(--ink-soft);pointer-events:none}.hud__row{margin:0;display:flex;justify-content:space-between;gap:1.4rem}.hud__row b{color:var(--accent-ink);font-variant-numeric:tabular-nums}.hud__row b:after{content:counter(n) "%"}.hud-px:after{counter-reset:n calc(var(--live-pointer-x-ratio, .5) * 100)}.hud-py:after{counter-reset:n calc(var(--live-pointer-y-ratio, .5) * 100)}.hud__toggle{pointer-events:auto;display:flex;align-items:center;gap:.45rem;margin:0 0 1px;padding:0 0 .4rem;border:0;border-block-end:1px solid var(--line);background:none;color:var(--accent-ink);font:inherit;font-size:inherit;font-weight:600;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}.hud__ico{inline-size:.6rem;block-size:.6rem;fill:currentColor}.hud__ico--play{display:none}.hud__label:after{content:"live"}.hud[data-paused] .hud__ico--pause{display:none}.hud[data-paused] .hud__ico--play{display:inline}.hud[data-paused] .hud__label:after{content:"paused"}.hud[data-paused] .hud__row b{color:var(--ink-faint)}@media (max-width: 40rem){.hud{display:none}}.masthead{position:relative;width:var(--shell);margin-inline:auto;padding:clamp(var(--space-4),8vh,5.5rem) 0 var(--space-6);display:grid;gap:clamp(var(--space-4),6vh,var(--space-5))}.eyebrow{font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;color:var(--accent-ink);margin:0 0 var(--space-4)}.display{font-size:clamp(2.75rem,1.8rem + 4.6vw,6.4rem);font-stretch:112%;margin:0}.display__accent{color:var(--accent)}.display__line{display:block}.masthead__intro>:not(.display),.display__line{transition:opacity .7s var(--ease-out),translate .7s var(--ease-out),filter .7s var(--ease-out);transition-delay:calc(sibling-index()*.07s)}@starting-style{.masthead__intro>:not(.display),.display__line{opacity:0;translate:0 .85rem;filter:blur(5px)}}@media (prefers-reduced-motion: reduce){.masthead__intro>:not(.display),.display__line{transition:none}}.masthead__sub{font-size:var(--step-1);font-weight:300;letter-spacing:-.02em;color:var(--ink-soft);margin:var(--space-3) 0 var(--space-4);line-height:1.1;text-wrap:balance}.masthead__sub em{font-style:normal;font-weight:500;color:var(--ink)}.masthead__cta{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin:0 0 var(--space-4)}.colophon__cta{margin:var(--space-4) 0 0}.btn-gh{display:inline-flex;align-items:center;gap:.65ch;padding:.7rem 1.25rem;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.02em;color:var(--paper);background:var(--accent);border:1px solid var(--accent);border-radius:12px;text-decoration:none;transition:background .2s var(--ease-out),border-color .2s var(--ease-out),translate .15s var(--ease-out)}.btn-gh__mark{inline-size:1.2em;block-size:1.2em;fill:currentColor}.btn-gh:hover{background:var(--accent-ink);border-color:var(--accent-ink);translate:0 -1px}.btn-doc{display:inline-flex;align-items:center;gap:.65ch;padding:.7rem 1.25rem;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.02em;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;text-decoration:none;transition:color .2s var(--ease-out),border-color .2s var(--ease-out),translate .15s var(--ease-out)}.btn-doc__mark{inline-size:1.2em;block-size:1.2em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn-doc:hover{color:var(--accent-ink);border-color:var(--accent-ink);translate:0 -1px}.lede{max-width:var(--measure);color:var(--ink-soft);font-size:var(--step-1);font-weight:350;line-height:1.5;margin:0;text-wrap:pretty}.lede code,.desc code,.colophon code,.reveal__t code{background:light-dark(oklch(96.5% .006 var(--accent-h)),oklch(26% .03 var(--accent-h)));color:light-dark(oklch(48% .23 calc(var(--accent-h) - 55)),oklch(85% .16 calc(var(--accent-h) - 55)));padding:.12em .46em;border-radius:6px;border:1px solid light-dark(oklch(88% .02 var(--accent-h)),oklch(38% .04 var(--accent-h)));font-weight:600;font-size:.86em;box-decoration-break:clone;-webkit-box-decoration-break:clone}.hint{display:inline-flex;align-items:center;gap:.6rem;margin:var(--space-4) 0 0;font-family:var(--font-mono);font-size:var(--step--1);color:var(--ink-faint);letter-spacing:.01em}.hint__dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--accent);box-shadow:0 0 color-mix(in oklab,var(--accent) 60%,transparent);animation:pulse 2.6s var(--ease-out) infinite}@keyframes pulse{0%{box-shadow:0 0 color-mix(in oklab,var(--accent) 55%,transparent)}70%,to{box-shadow:0 0 0 .5rem transparent}}kbd{font-family:var(--font-mono);font-size:.85em;font-weight:600;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:5px;padding:.05em .4em;line-height:1}.scroll-hint{font-family:var(--font-mono);font-size:var(--step--1);font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-faint);margin:var(--space-6) 0 0}.scroll-hint:after{content:"↓";display:inline-block;margin-left:.6em;animation:nudge 1.8s ease-in-out infinite}@keyframes nudge{0%,to{transform:translateY(0);opacity:.5}50%{transform:translateY(.35em);opacity:1}}.viewport-pad{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(36rem 36rem at calc(var(--live-pointer-x-ratio, .5) * 100vw) calc(var(--live-pointer-y-ratio, .5) * 100vh),color-mix(in oklab,var(--accent-soft) 55%,transparent),transparent 55%);animation:viewport-pad-fade linear both;animation-timeline:scroll(root block);animation-range:0 92vh}@keyframes viewport-pad-fade{to{opacity:0}}.viewport-pad__grid{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.55;background:repeating-linear-gradient(to right,transparent 0 calc(7vw - 1px),color-mix(in oklab,var(--line) 45%,transparent) calc(7vw - 1px) 7vw),repeating-linear-gradient(to bottom,transparent 0 calc(7vw - 1px),color-mix(in oklab,var(--line) 45%,transparent) calc(7vw - 1px) 7vw)}.viewport-pad__cross{position:absolute;background:color-mix(in oklab,var(--accent) 26%,transparent)}.viewport-pad__cross--x{inset-block:0;inline-size:1px;left:calc(var(--live-pointer-x-ratio, .5) * 100vw)}.viewport-pad__cross--y{inset-inline:0;block-size:1px;top:calc(var(--live-pointer-y-ratio, .5) * 100vh)}.viewport-pad__dot{position:absolute;inline-size:.85rem;aspect-ratio:1;border-radius:50%;background:var(--accent);left:calc(var(--live-pointer-x-ratio, .5) * 100vw);top:calc(var(--live-pointer-y-ratio, .5) * 100vh);translate:-50% -50%;box-shadow:0 0 0 5px color-mix(in oklab,var(--accent) 20%,transparent),0 0 1.6rem color-mix(in oklab,var(--accent) 45%,transparent)}.hero-stage{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.5rem,1vw,.85rem)}.hero-stage>*{border:1px solid var(--line);border-radius:14px;background:color-mix(in oklab,var(--surface) 80%,transparent);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.hchip{position:relative;display:grid;align-content:space-between;gap:.45rem;padding:.7rem .85rem;min-block-size:4.7rem}.hchip:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border-radius:inherit;padding:1px;--edge-ang: atan2(calc(var(--live-local-pointer-y-ratio, .5) - .5), calc(var(--live-local-pointer-x-ratio, .5) - .5));--edge: clamp( 0, calc(max(abs(var(--live-local-pointer-x-ratio, .5) - .5), abs(var(--live-local-pointer-y-ratio, .5) - .5))*2) , 1 );background:conic-gradient(from calc(var(--edge-ang) + 90deg),color-mix(in oklab,var(--accent) 85%,white),color-mix(in oklab,var(--accent) 14%,transparent) 60deg,color-mix(in oklab,var(--accent) 14%,transparent) 300deg,color-mix(in oklab,var(--accent) 85%,white));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:calc(var(--live-local-pointer-inside, 0) * (.12 + var(--edge) * .8));transition:opacity .2s var(--ease-out);pointer-events:none}.hchip__k{margin:0;font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}.hchip__v{margin:0;font-family:var(--font-display);font-size:var(--step-1);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1;color:var(--accent-ink)}.hero-clock:after{counter-reset:h var(--live-hours, 0) m var(--live-minutes, 0) s var(--live-seconds, 0);content:counter(h) ":" counter(m,decimal-leading-zero) ":" counter(s,decimal-leading-zero)}.hero-fps:after{counter-reset:f var(--live-fps, 0);content:counter(f) " fps"}.hero-vp:after{counter-reset:w calc(var(--live-vw, 0)) h calc(var(--live-vh, 0));content:counter(w) " × " counter(h)}.hero-vel:after{counter-reset:v calc(var(--live-scroll-velocity, 0));content:counter(v) " px"}.hchip__bar{block-size:.3rem;border-radius:999px;background:color-mix(in oklab,var(--line) 80%,transparent);overflow:hidden}.hchip__bar i{display:block;block-size:100%;border-radius:inherit;inline-size:clamp(0%,calc(var(--live-fps, 0) / 120 * 100%),100%);background:var(--accent);transition:inline-size .2s var(--ease-out)}.hchip__shear{display:grid;gap:.22rem}.hchip__shear i{block-size:.28rem;border-radius:999px;background:linear-gradient(90deg,var(--accent),color-mix(in oklab,var(--accent) 30%,var(--surface)));transform:translate(clamp(-1.4rem,calc(var(--live-scroll-velocity, 0) * .6px),1.4rem)) skew(clamp(-14deg,calc(var(--live-scroll-velocity, 0) * -.45deg),14deg));transition:transform .16s var(--ease-out)}.hchip--hue{grid-column:1 / -1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.45rem .6rem;min-block-size:0}.hue-duotone{display:grid;place-items:center;inline-size:1.5rem;block-size:1.5rem}.hue-duotone svg{inline-size:100%;block-size:100%}.hue-duotone__bg{fill:var(--accent);opacity:.3}.hue-duotone__fg{fill:var(--accent)}.hue-chip__label{font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}.hchip--hue .hero-hue{font-family:var(--font-mono);font-size:.6rem;font-weight:700;letter-spacing:.06em;color:var(--accent-ink);font-variant-numeric:tabular-nums}.hero-hue:after{counter-reset:h round(var(--accent-h, 280),1);content:"h " counter(h)}.hue-track{grid-column:1 / -1;position:relative;block-size:.9rem;border-radius:999px;cursor:ew-resize;background:linear-gradient(90deg,#fb5c99,#ff5f77,#ff6551 8.33%,#ff6738 10.42%,#ff6825 11.46%,#ff6916,#fe6a00,#fb6e00,#f77200 13.54%,#f17800 14.58%,#e68100 16.67%,#d38f00,#c19900,#ada200,#92ac00 33.33%,#7eb200 35.42%,#71b500 36.46%,#69b600,#62b811 37.5%,#53ba2a,#40bc3b,#25bd48 40.62%,#0abe4e 41.14%,#00be53,#00be58 41.67%,#00bd68,#00bc75 43.75%,#00ba87 45.83%,#00b8a1,#00b6b6,#00b2c8,#00aedc,#00a9f7 66.67%,#31a4ff 68.75%,#3ba3ff,#44a2ff 69.79%,#52a0ff 70.83%,#699bff,#7997ff 75%,#958dff,#b27eff 83.33%,#e068d8,#fb5c99);background:linear-gradient(90deg,#fb5c99,color(xyz 0.493 0.307 0.203),color(xyz 0.482 0.31 0.104) 8.33%,color(xyz 0.473 0.312 0.067) 10.42%,color(xyz 0.467 0.313 0.051) 11.46%,#ff6916,#fe6a00,color(xyz 0.458 0.315 0.03),color(xyz 0.454 0.316 0.024) 13.54%,color(xyz 0.447 0.318 0.013) 14.58%,color(xyz 0.43 0.321 -0.005) 16.67%,color(xyz 0.391 0.329 -0.027),color(xyz 0.347 0.338 -0.031),color(xyz 0.301 0.348 -0.019),color(xyz 0.258 0.359 0.011) 33.33%,color(xyz 0.239 0.364 0.035) 35.42%,color(xyz 0.23 0.366 0.049) 36.46%,color(xyz 0.226 0.367 0.056),#62b811 37.5%,#53ba2a,#40bc3b,#25bd48 40.62%,#0abe4e,color(xyz 0.197 0.376 0.147) 41.67%,color(xyz 0.193 0.377 0.172),color(xyz 0.189 0.378 0.2) 43.75%,color(xyz 0.185 0.38 0.262) 45.83%,color(xyz 0.188 0.381 0.411),color(xyz 0.206 0.378 0.588),color(xyz 0.235 0.371 0.779),color(xyz 0.273 0.361 0.961),color(xyz 0.315 0.35 1.111) 66.67%,color(xyz 0.336 0.344 1.165) 68.75%,color(xyz 0.341 0.343 1.176),color(xyz 0.346 0.341 1.186) 69.79%,color(xyz 0.356 0.339 1.203) 70.83%,color(xyz 0.376 0.333 1.222),color(xyz 0.393 0.328 1.222) 75%,color(xyz 0.424 0.32 1.166),color(xyz 0.449 0.313 1.043) 83.33%,#e068d8,#fb5c99)}.hue-track__line{position:absolute;inset-block:-3px;inline-size:3px;left:calc(var(--accent-h, 280) / 360 * 100%);translate:-50% 0;border-radius:2px;background:light-dark(oklch(16% 0 0),oklch(98% 0 0));box-shadow:0 0 0 2px color-mix(in oklab,var(--surface) 70%,transparent)}@media (max-width: 52rem){.hero-stage{grid-template-columns:repeat(2,1fr)}}main{display:flow-root}.demo{position:relative;width:var(--shell);margin-inline:auto;padding:var(--space-6) 0;border-top:1px solid var(--line)}.watermark{position:absolute;top:calc(var(--space-6) - .35em);right:0;margin:0;font-family:var(--font-display);font-size:clamp(7rem,22vw,18rem);font-weight:900;font-stretch:125%;line-height:.7;letter-spacing:-.05em;color:color-mix(in oklab,var(--accent) 14%,var(--line));pointer-events:none;-webkit-user-select:none;user-select:none;z-index:0}@keyframes watermark-enter{0%{opacity:0;translate:0 2.5rem;scale:.9;filter:blur(6px)}to{opacity:1;translate:none;scale:1;filter:blur(0)}}@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.watermark{animation:watermark-enter linear both;animation-timeline:view();animation-range:entry 0% entry 80%}}}.demo-head{position:relative;z-index:1;max-width:var(--measure);margin-bottom:var(--space-5)}.index{font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;color:var(--accent-ink);letter-spacing:.22em;text-transform:uppercase;margin:0 0 var(--space-3)}.demo h2{font-size:var(--step-3);font-stretch:108%;margin:0 0 var(--space-3)}.desc{color:var(--ink-soft);font-size:var(--step-0);font-weight:350;line-height:1.55;margin:0;max-width:34rem;text-wrap:balance}.demo-body{position:relative;z-index:1;display:grid;gap:var(--gutter) clamp(2rem,5vw,4rem);grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));align-items:start}#scroll .demo-body{grid-template-columns:minmax(0,20rem) minmax(0,1fr);gap:var(--gutter) clamp(2rem,6vw,5rem)}.scrolly{position:sticky;top:clamp(var(--space-4),14vh,8rem);align-self:start;display:grid;gap:var(--space-4)}.scrolly__hint{display:flex;align-items:center;gap:.6ch;margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.08em;color:var(--ink-faint)}.scrolly__hint span{font-size:1.1em;animation:scrolly-bob 1.8s var(--ease-out) infinite}@keyframes scrolly-bob{0%,to{translate:0 -.15rem}50%{translate:0 .3rem}}@media (max-width: 52rem){#scroll .demo-body{grid-template-columns:1fr}.scrolly{position:static}}@media (prefers-reduced-motion: reduce){.scrolly__hint span{animation:none}}.stage{display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.stage--auto{min-height:18rem;padding:clamp(var(--space-4),6vw,4rem)}.auto-box{position:relative;inline-size:18rem;block-size:10rem;min-inline-size:8rem;min-block-size:6.5rem;max-inline-size:100%;resize:both;overflow:auto;display:grid;place-items:center;padding:var(--space-4) var(--space-3) var(--space-3);border:1px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklab,var(--accent-soft) 32%,var(--surface))}.auto-box__tag{position:absolute;inset:.6rem auto auto .8rem;margin:0;font-family:var(--font-mono);font-size:.62rem;font-weight:600;letter-spacing:.04em;color:var(--accent-ink)}.auto-box__read{margin:0;font-family:var(--font-display);font-size:var(--step-2);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ink)}.auto-box__w:after{counter-reset:w calc(var(--live-w, 0));content:counter(w)}.auto-box__h:after{counter-reset:h calc(var(--live-h, 0));content:counter(h)}.stage--pointer{--px: var(--live-local-pointer-x-ratio, .5);--py: var(--live-local-pointer-y-ratio, .5);--act: var(--live-local-pointer-inside, 0);position:relative;min-height:21rem;padding:clamp(var(--space-3),5vw,3.25rem);perspective:1000px;background:radial-gradient(22rem 22rem at calc(var(--px) * 100%) calc(var(--py) * 100%),color-mix(in oklab,var(--accent-soft) calc(var(--act) * 85%),transparent),transparent 68%),var(--surface)}.stage--pointer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius);padding:1px;--edge-ang: atan2(calc(var(--py, .5) - .5), calc(var(--px, .5) - .5));background:conic-gradient(from calc(var(--edge-ang) + 90deg),color-mix(in oklab,var(--accent) 80%,white),color-mix(in oklab,var(--accent) 12%,transparent) 70deg,color-mix(in oklab,var(--accent) 12%,transparent) 290deg,color-mix(in oklab,var(--accent) 80%,white));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:calc(.2 + var(--act) * .6);transition:opacity .22s var(--ease-out);pointer-events:none}.tilt-card{--w: min(16rem, 66vw);--px: var(--live-local-pointer-x-ratio, .5);--py: var(--live-local-pointer-y-ratio, .5);--act: var(--live-local-pointer-inside, 0);--rx: calc((.5 - var(--live-pointer-y-ratio, .5)) * 16deg);--ry: calc((var(--live-pointer-x-ratio, .5) - .5) * 16deg);--glare-r: calc(var(--w) * .5);position:relative;inline-size:var(--w);aspect-ratio:5 / 7;border-radius:20px;overflow:hidden;background:radial-gradient(11rem 11rem at calc(var(--px, .5) * 100%) calc(var(--py, .5) * 100%),color-mix(in oklab,oklch(72% .2 var(--accent-h)) calc(var(--act) * 55%),transparent),transparent 62%),linear-gradient(155deg,oklch(28% .12 var(--accent-h)),oklch(13% .08 var(--accent-h)));color:oklch(97% .02 var(--accent-h));transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));box-shadow:0 1px 1px #0002,0 14px 34px -14px #0008,0 44px 66px -34px #000a;transition:transform .22s var(--ease-out);will-change:transform}.tilt-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;border-radius:inherit;padding:1.5px;--edge-ang: atan2(calc(var(--py, .5) - .5), calc(var(--px, .5) - .5));background:conic-gradient(from calc(var(--edge-ang) + 90deg),color-mix(in oklab,var(--accent) 92%,white),color-mix(in oklab,var(--accent) 20%,transparent) 70deg,color-mix(in oklab,var(--accent) 20%,transparent) 290deg,color-mix(in oklab,var(--accent) 92%,white));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:calc(.3 + var(--act) * .6);transition:opacity .22s var(--ease-out);pointer-events:none}.tilt-card__texture{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background-image:radial-gradient(oklch(100% 0 0) 1px,transparent 1.4px);background-size:11px 11px;opacity:calc(.22 * var(--act, 1) + .04);mix-blend-mode:soft-light;-webkit-mask:radial-gradient(circle var(--glare-r) at calc(var(--px) * 100%) calc(var(--py) * 100%),#000,transparent 72%);mask:radial-gradient(circle var(--glare-r) at calc(var(--px) * 100%) calc(var(--py) * 100%),#000,transparent 72%);transition:opacity .22s var(--ease-out)}.tilt-card__glare{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;background:radial-gradient(circle var(--glare-r, 6rem) at calc(var(--px, .5) * 100%) calc(var(--py, .5) * 100%),#ffffffcc,#ffffff00 70%);mix-blend-mode:soft-light;opacity:calc(.9 * var(--act, 1));transition:opacity .2s var(--ease-out)}.tilt-card__content{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--space-3);transform:translateZ(18px)}.tilt-card__kicker{font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:oklch(85% .13 var(--accent-h));margin:0 0 auto}.tilt-card__title{font-size:clamp(1.5rem,1.25rem + .9vw,2rem);font-weight:800;font-stretch:112%;line-height:.92;letter-spacing:-.03em;margin:0 0 var(--space-1);text-wrap:balance}.tilt-card__sub{font-size:var(--step--1);color:oklch(88% .04 var(--accent-h));margin:0}.reveals{position:relative;display:grid;gap:var(--space-3)}.reveals:before{content:"";position:absolute;left:1.35rem;top:1.35rem;bottom:1.35rem;inline-size:2px;background:var(--line);border-radius:2px}.reveal{--in: var(--live-visible, 0);--seen: var(--const-has-entered, 0);position:relative;display:grid;grid-template-columns:2.7rem 1fr;gap:var(--space-3);align-items:start;min-block-size:38vh;align-content:center;opacity:calc(.14 + var(--seen) * .86);translate:0 calc((1 - var(--seen)) * 2.4rem);filter:blur(calc((1 - var(--seen)) * 5px));transition:opacity .65s var(--ease-out),translate .65s var(--ease-out),filter .65s var(--ease-out);transition-delay:.18s}.reveal__node{position:relative;z-index:1;justify-self:center;display:grid;place-items:center;inline-size:2.7rem;block-size:2.7rem;border-radius:50%;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:color-mix(in oklab,var(--accent-ink) calc(var(--seen) * 100%),var(--ink-faint));background:color-mix(in oklab,var(--accent-soft) calc(var(--seen) * 100%),var(--surface));border:2px solid color-mix(in oklab,var(--accent) calc(max(var(--seen),var(--in))*100%),var(--line));box-shadow:0 0 0 calc(var(--in) * .4rem) color-mix(in oklab,var(--accent) calc(var(--in) * 20%),transparent);scale:calc(.82 + max(var(--seen),var(--in))*.18);transition:background .45s var(--ease-out),color .45s var(--ease-out),border-color .25s linear,box-shadow .3s var(--ease-out),scale .45s var(--ease-out)}.reveal:not(:first-child) .reveal__node:before{content:"";position:absolute;left:50%;bottom:100%;translate:-50% 0;inline-size:2px;block-size:clamp(var(--space-5),40vh,22rem);background:color-mix(in oklab,var(--accent) calc(var(--seen) * 100%),transparent);transition:background .55s var(--ease-out)}.reveal__body{display:grid;gap:var(--space-2);padding-block-start:.28rem}.reveal--toggle .reveal__body{position:relative;isolation:isolate}.reveal--toggle .reveal__body:before{content:"";position:absolute;top:-.65rem;right:-.85rem;bottom:-.65rem;left:-.85rem;z-index:-1;border-radius:14px;background:color-mix(in oklab,var(--accent-soft) calc(var(--in) * 85%),transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--accent) calc(var(--in) * 50%),transparent),0 0 calc(var(--in) * 1.6rem) color-mix(in oklab,var(--accent) calc(var(--in) * 22%),transparent);transition:background .32s var(--ease-out),box-shadow .32s var(--ease-out)}.reveal__t{font-size:var(--step-0);font-weight:400;line-height:1.5;margin:0;text-wrap:balance}.reveal__t code{white-space:nowrap}.reveal__state{display:inline-flex;flex-wrap:wrap;gap:var(--space-2);margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.04em}.reveal__live,.reveal__seen{display:inline-flex;align-items:center;gap:.5ch;padding:.25em .75em;border:1px solid;border-radius:999px}.reveal__live{color:color-mix(in oklab,var(--accent-ink) calc(var(--in) * 100%),var(--ink-faint));border-color:color-mix(in oklab,var(--accent) calc(var(--in) * 55%),var(--line));background:color-mix(in oklab,var(--accent-soft) calc(var(--in) * 100%),transparent);transition:color .2s linear,border-color .2s linear,background .2s linear}.reveal__live:before{content:"";inline-size:.5rem;block-size:.5rem;border-radius:50%;background:color-mix(in oklab,var(--accent) calc(var(--in) * 100%),var(--line-strong));transition:background .2s linear}.reveal__seen{color:var(--accent-ink);border-color:color-mix(in oklab,var(--accent) 45%,var(--line));background:var(--accent-soft);opacity:var(--seen);scale:calc(.88 + var(--seen) * .12);transition:opacity .5s var(--ease-out),scale .5s var(--ease-out)}.reveal__seen:before{content:"✓";font-weight:700}.stage--slider{min-height:30rem;padding:clamp(var(--space-4),8vw,6rem) var(--space-4)}.meter{display:grid;justify-items:center;gap:var(--space-5);inline-size:min(34rem,100%)}.gauge{--max-tint: light-dark(oklch(60% .19 62), oklch(81% .17 78));position:relative;display:grid;place-items:center;inline-size:clamp(11rem,38vw,15rem);aspect-ratio:1}.gauge>*{grid-area:1 / 1}.gauge__arc{--p: var(--live-value-pct, 0);--arc-color: var(--accent);inline-size:100%;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--arc-color) calc(var(--p) * 360deg),var(--line) 0);-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - .85rem),#000 calc(100% - .8rem));mask:radial-gradient(farthest-side,#0000 calc(100% - .85rem),#000 calc(100% - .8rem));transition:background 90ms linear}.gauge__num{margin:0;font-family:var(--font-display);font-size:clamp(2.8rem,1.8rem + 4.5vw,5rem);font-weight:900;font-stretch:110%;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink);transition:color .2s var(--ease-out)}.gauge__num:after{counter-reset:v calc(var(--live-value, 0));content:counter(v)}.gauge__flag{position:absolute;left:50%;bottom:1.5rem;z-index:2;translate:-50% 0;margin:0;padding:.2em .7em;border-radius:999px;background:color-mix(in oklab,var(--surface) 80%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);font-family:var(--font-mono);font-size:.64rem;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint);opacity:0;transition:opacity .2s var(--ease-out),color .2s var(--ease-out)}.gauge__flag:after{content:""}@container style(--live-value: 0){.gauge__flag{opacity:1;color:var(--ink-faint)}.gauge__flag:after{content:"min"}}@container style(--live-value: 100){.gauge__arc{--arc-color: var(--max-tint)}.gauge__num{color:var(--max-tint)}.gauge__flag{opacity:1;color:var(--max-tint)}.gauge__flag:after{content:"max"}}.slider{display:grid;gap:var(--space-3);inline-size:100%}.slider__label{display:flex;align-items:baseline;justify-content:space-between;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}.slider__keys{display:inline-flex;gap:.3rem;letter-spacing:0;text-transform:none}.dial{--pct: var(--live-value-pct, 0);--hue: oklch(72% .2 calc(255 - var(--pct) * 210));inline-size:100%;height:2.75rem;margin:0;background:transparent;cursor:ew-resize;-webkit-appearance:none;-moz-appearance:none;appearance:none}.dial::-webkit-slider-runnable-track{height:.85rem;border-radius:99px;background:linear-gradient(90deg,var(--hue) calc(var(--pct) * 100%),var(--line) calc(var(--pct) * 100%));border:1px solid var(--line);transition:filter .18s var(--ease-out)}.dial::-moz-range-track{height:.85rem;border-radius:99px;background:var(--line);border:1px solid var(--line)}.dial::-moz-range-progress{height:.85rem;border-radius:99px;background:var(--hue)}.dial::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;inline-size:1.6rem;block-size:1.6rem;margin-top:calc((.85rem - 1.6rem) / 2);border-radius:50%;background:var(--surface);border:3px solid var(--hue);box-shadow:0 1px 4px #0004,0 0 0 calc(var(--pct) * .7rem) color-mix(in oklab,var(--hue) 32%,transparent);transition:transform .16s var(--ease-out),box-shadow .12s linear}.dial::-moz-range-thumb{inline-size:1.6rem;block-size:1.6rem;border-radius:50%;background:var(--surface);border:3px solid var(--hue);box-shadow:0 1px 4px #0004,0 0 0 calc(var(--pct) * .7rem) color-mix(in oklab,var(--hue) 32%,transparent);transition:transform .16s var(--ease-out),box-shadow .12s linear}.dial:is(:hover,:focus-visible)::-webkit-slider-thumb{transform:scale(1.12)}.dial:is(:hover,:focus-visible)::-moz-range-thumb{transform:scale(1.12)}.dial:focus-visible::-webkit-slider-runnable-track{filter:brightness(1.06) saturate(1.1);outline:2px solid var(--accent);outline-offset:6px}.dial:focus-visible::-moz-range-track{filter:brightness(1.06) saturate(1.1)}.dial:focus-visible{outline:none}.slider__ticks{display:flex;justify-content:space-between;padding:0 .6rem;font-family:var(--font-mono);font-size:.62rem;color:var(--ink-faint)}.slider__ticks i{inline-size:1px;block-size:.4rem;background:var(--line-strong)}.stage--state{min-height:32rem;padding:clamp(var(--space-4),8vw,6rem) var(--space-4)}.level{display:grid;justify-items:center;inline-size:min(30rem,100%)}.level__core{--tier-h: 280;--tier-c: .2;--tier: light-dark( oklch(56% var(--tier-c) var(--tier-h)), oklch(80% calc(var(--tier-c) * .85) var(--tier-h)) );display:grid;justify-items:center;gap:var(--space-5);inline-size:100%}.level__word{margin:0;font-family:var(--font-display);font-size:var(--step-4);font-weight:900;font-stretch:110%;letter-spacing:-.04em;line-height:1;color:var(--tier);transition:color .2s var(--ease-out)}.level__word:after{content:"—"}.stepper{display:grid;justify-items:center;gap:var(--space-3);inline-size:100%}.stepper__label{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}.stepper__keys{display:inline-flex;gap:.3rem;letter-spacing:0;text-transform:none}.stepper__track{display:flex;align-items:stretch;justify-content:center;gap:var(--space-3);block-size:15rem}.steps-wrap{position:relative;inline-size:2.4rem;block-size:15rem}.steps{--p: var(--live-value-pct, 0);position:absolute;left:50%;top:50%;translate:-50% -50%;rotate:-90deg;inline-size:15rem;block-size:2.4rem;margin:0;background:transparent;cursor:ns-resize;-webkit-appearance:none;-moz-appearance:none;appearance:none}.steps::-webkit-slider-runnable-track{height:.5rem;border-radius:99px;background:linear-gradient(90deg,var(--tier) calc(var(--p) * 100%),var(--line) calc(var(--p) * 100%));border:1px solid var(--line)}.steps::-moz-range-track{height:.5rem;border-radius:99px;background:var(--line);border:1px solid var(--line)}.steps::-moz-range-progress{height:.5rem;border-radius:99px;background:var(--tier)}.steps::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.4rem;height:1.4rem;margin-top:calc((.5rem - 1.4rem) / 2 - 1.5px);border-radius:50%;background:var(--surface);border:3px solid var(--tier);box-shadow:0 1px 4px #0004;transition:transform .16s var(--ease-out),border-color .2s var(--ease-out)}.steps::-moz-range-thumb{width:1.4rem;height:1.4rem;border-radius:50%;background:var(--surface);border:3px solid var(--tier);box-shadow:0 1px 4px #0004;transition:transform .16s var(--ease-out),border-color .2s var(--ease-out)}.steps:is(:hover,:focus-visible)::-webkit-slider-thumb{transform:scale(1.12)}.steps:is(:hover,:focus-visible)::-moz-range-thumb{transform:scale(1.12)}.steps:focus-visible::-webkit-slider-runnable-track{outline:2px solid var(--accent);outline-offset:6px}.steps:focus-visible{outline:none}.stepper__scale{display:flex;flex-direction:column-reverse;justify-content:space-between;align-items:flex-start;padding-block:.1rem;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}.stepper__scale i{display:flex;align-items:center;gap:.55rem;flex:0 0 auto;font-style:normal;color:var(--ink-faint);transition:color .2s var(--ease-out)}.stepper__scale i:before{content:"";inline-size:.4rem;block-size:.4rem;border-radius:50%;background:currentColor;opacity:.55}@container style(--live-value: 0){.level__word:after{content:"Off"}.level__core{--tier-c: 0}.stepper__scale i:nth-child(1){color:var(--ink);font-weight:700}}@container style(--live-value: 1){.level__word:after{content:"Low"}.level__core{--tier-h: 255}.stepper__scale i:nth-child(2){color:var(--tier);font-weight:700}}@container style(--live-value: 2){.level__word:after{content:"Mid"}.level__core{--tier-h: 195}.stepper__scale i:nth-child(3){color:var(--tier);font-weight:700}}@container style(--live-value: 3){.level__word:after{content:"High"}.level__core{--tier-h: 70}.stepper__scale i:nth-child(4){color:var(--tier);font-weight:700}}@container style(--live-value: 4){.level__word:after{content:"Max"}.level__core{--tier-h: 25;--tier-c: .24}.stepper__scale i:nth-child(5){color:var(--tier);font-weight:700}}.caption{margin:0;max-width:var(--measure);min-width:0}.caption figcaption{font-family:var(--font-mono);font-size:var(--step--1);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:var(--space-3) 0 var(--space-1)}.caption figcaption:first-child{margin-top:0}.caption pre{margin:0;padding:var(--space-3);background:light-dark(oklch(99% .004 280),oklch(13% .012 280));border:1px solid var(--line);border-radius:12px;overflow-x:auto;font-size:var(--step--1);line-height:1.7;transition:border-color .2s var(--ease-out)}.caption pre:hover{border-color:var(--line-strong)}.caption code{font-family:var(--font-mono)}.tok-key{color:light-dark(oklch(49% .18 calc(var(--accent-h) + 25)),oklch(80% .14 calc(var(--accent-h) + 25)))}.tok-fn{color:light-dark(oklch(53% .12 calc(var(--accent-h) - 25)),oklch(81% .1 calc(var(--accent-h) - 25)))}.tok-str{color:light-dark(oklch(50% .13 calc(var(--accent-h) + 55)),oklch(80% .12 calc(var(--accent-h) + 55)))}.tok-num{color:light-dark(oklch(56% .11 calc(var(--accent-h) + 90)),oklch(82% .1 calc(var(--accent-h) + 90)))}.tok-sel{color:var(--accent-ink)}.tok-prop{color:var(--ink-soft)}.tok-var{color:light-dark(oklch(52% .19 calc(var(--accent-h) - 55)),oklch(82% .15 calc(var(--accent-h) - 55)));font-weight:600}.tok-com{color:var(--ink-faint);font-style:italic}.stage--field{padding:clamp(var(--space-4),5vw,3rem)}.field{--warn: light-dark(oklch(64% .16 65), oklch(78% .15 70));--limit: light-dark(oklch(55% .21 25), oklch(72% .18 25));inline-size:min(30rem,100%);display:grid;gap:var(--space-2)}.field__label{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}.field__req{color:var(--ink-faint);letter-spacing:.04em}.field__input{width:100%;resize:vertical;min-block-size:4.5rem;padding:var(--space-3);font-family:var(--font-sans);font-size:var(--step-0);line-height:1.5;color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;transition:border-color .2s var(--ease-out)}.field__input::placeholder{color:var(--ink-faint)}.field__input:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.field__meter{block-size:.4rem;border-radius:999px;background:color-mix(in oklab,var(--line) 80%,transparent);overflow:hidden}.field__meter i{display:block;block-size:100%;border-radius:inherit;inline-size:clamp(0%,calc(var(--live-length, 0) / var(--max, 1) * 100%),100%);background:var(--accent);transition:inline-size .12s var(--ease-out),background .2s linear}.field__status{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600}.field__count{color:var(--ink-soft);font-variant-numeric:tabular-nums}.field__count:after{counter-reset:c var(--live-length, 0) m var(--max, 0);content:counter(c) " / " counter(m)}.field__word{color:var(--accent-ink);letter-spacing:.04em;text-transform:uppercase}.field__word:after{content:"looks good"}@container style(--live-empty: 1){.field__word{color:var(--ink-faint)}.field__word:after{content:"waiting"}}@container style(--live-valid: 0){.field__word{color:var(--warn)}.field__word:after{content:"keep typing"}.field__meter i{background:var(--warn)}}@container style(--live-length: 120){.field__word{color:var(--limit)}.field__word:after{content:"max reached"}.field__meter i{background:var(--limit)}}.stage--trig{min-height:18rem;padding:clamp(var(--space-4),6vw,4rem);border:none;background:none}.eyes{display:flex;gap:clamp(var(--space-2),3vw,var(--space-4))}.eye{--a: atan2(calc(var(--live-local-pointer-y-ratio, .5) - .5), calc(var(--live-local-pointer-x-ratio, .5) - .5));position:relative;display:grid;place-items:center;inline-size:clamp(3.5rem,12vw,5.5rem);aspect-ratio:1;border-radius:50%;background:light-dark(oklch(99% .004 280),oklch(96% .01 280));border:2px solid var(--line-strong);box-shadow:inset 0 -.4rem 1rem #0001,0 8px 20px -12px #0008}.eye__pupil{position:relative;inline-size:40%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#3e4058,#1f2030,#05050d 70%);translate:calc(cos(var(--a))*1.1rem) calc(sin(var(--a))*1.1rem);transition:translate 90ms var(--ease-out)}.eye__pupil:after{content:"";position:absolute;inset:18% auto auto 18%;inline-size:28%;aspect-ratio:1;border-radius:50%;background:#ffffffd9}.stage--clock{min-height:18rem;padding:clamp(var(--space-4),6vw,4rem)}.clock{display:grid;justify-items:center;gap:var(--space-3)}@property --magnet-x{syntax: "<number>"; inherits: true; initial-value: .5;}@property --magnet-y{syntax: "<number>"; inherits: true; initial-value: .5;}.clock__face{--magnet-x: calc( .5 + (var(--live-local-pointer-x-ratio, .5) - .5) * .82 * var(--live-local-pointer-inside, 0) );--magnet-y: calc( .5 + (var(--live-local-pointer-y-ratio, .5) - .5) * .82 * var(--live-local-pointer-inside, 0) );position:relative;inline-size:clamp(8rem,30vw,11rem);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at calc(var(--magnet-x) * 100%) calc(var(--magnet-y) * 100%),color-mix(in oklab,var(--accent) 34%,var(--surface)),var(--surface) 62%);border:2px solid var(--line-strong);transition:--magnet-x .45s var(--ease-out),--magnet-y .45s var(--ease-out)}.clock__face:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:repeating-conic-gradient(from -1deg,var(--line-strong) 0 2deg,transparent 2deg 30deg);-webkit-mask:radial-gradient(circle,transparent 62%,#000 64%);mask:radial-gradient(circle,transparent 62%,#000 64%)}.clock__hand{position:absolute;left:50%;bottom:50%;transform-origin:bottom center;border-radius:999px;background:var(--ink)}.clock__hand--hour{inline-size:4px;block-size:26%;rotate:calc(var(--live-hours, 0) * 30deg + var(--live-minutes, 0) * .5deg);translate:-50% 0}.clock__hand--min{inline-size:3px;block-size:36%;rotate:calc(var(--live-minutes, 0) * 6deg);translate:-50% 0}.clock__hand--sec{inline-size:2px;block-size:40%;background:var(--accent);rotate:calc(var(--live-seconds, 0) * 6deg);translate:-50% 0}.clock__cap{position:absolute;top:50%;right:50%;bottom:50%;left:50%;inline-size:.7rem;aspect-ratio:1;border-radius:50%;background:var(--accent);translate:-50% -50%}.clock__digital{margin:0;font-family:var(--font-mono);font-size:var(--step-1);font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.06em;color:var(--accent-ink)}.clock__digital:after{counter-reset:h var(--live-hours, 0) m var(--live-minutes, 0) s var(--live-seconds, 0);content:counter(h) ":" counter(m,decimal-leading-zero) ":" counter(s,decimal-leading-zero)}.stage--device{padding:clamp(var(--space-3),4vw,2.5rem);border:none;background:none}.tiles{--warn: light-dark(oklch(64% .16 65), oklch(78% .15 70));--limit: light-dark(oklch(55% .21 25), oklch(72% .18 25));--ok: light-dark(oklch(56% .15 150), oklch(76% .16 150));inline-size:100%;display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr))}.tile{display:grid;gap:.4rem;align-content:start;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.tile__k{margin:0;display:flex;align-items:center;gap:.4ch;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}.tile__big{margin:0;display:flex;align-items:center;gap:.5ch;min-block-size:1.4em;font-family:var(--font-display);font-size:var(--step-2);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--accent-ink)}.tile__sub{margin:0;font-family:var(--font-mono);font-size:var(--step--1);color:var(--ink-soft)}.tile__sub code{background:none;padding:0;color:var(--ink-faint)}.tile__na{display:none;margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-style:italic;color:var(--ink-faint)}.tile__dot{inline-size:.6rem;aspect-ratio:1;border-radius:50%;background:var(--ok)}.tile__online:after{content:"online"}@container style(--live-online: 0){.tile--online{color:var(--limit)}.tile--online .tile__dot{background:var(--limit)}.tile__online:after{content:"offline"}}.tile__net:after{content:"—"}@container style(--live-net-type: 1){.tile__net:after{content:"slow-2g"}}@container style(--live-net-type: 2){.tile__net:after{content:"2g"}}@container style(--live-net-type: 3){.tile__net:after{content:"3g"}}@container style(--live-net-type: 4){.tile__net:after{content:"4g"}}.tile__downlink:after{counter-reset:d calc(var(--live-net-downlink, 0));content:counter(d)}.tile__rtt:after{counter-reset:r var(--live-net-rtt, 0);content:counter(r)}:root:not([data-has-network]) .tile--net .tile__net,:root:not([data-has-network]) .tile--net .tile__net-detail{display:none}:root:not([data-has-network]) .tile--net .tile__na{display:block}.tile__bolt{opacity:0;color:var(--ok);transition:opacity .2s var(--ease-out)}@container style(--live-battery-charging: 1){.tile__bolt{opacity:1}}.tile__batt:after{counter-reset:b calc(var(--live-battery-level, 0) * 100);content:counter(b) "%"}.tile__gauge{block-size:.45rem;border-radius:999px;background:color-mix(in oklab,var(--line) 80%,transparent);overflow:hidden}.tile__gauge i{display:block;block-size:100%;border-radius:inherit;inline-size:clamp(0%,calc(var(--live-battery-level, 0) * 100%),100%);background:var(--accent);transition:inline-size .3s var(--ease-out)}:root:not([data-has-battery]) .tile--battery .tile__batt,:root:not([data-has-battery]) .tile--battery .tile__gauge,:root:not([data-has-battery]) .tile--battery .tile__bolt{display:none}:root:not([data-has-battery]) .tile--battery .tile__na{display:block}.tile__fps:after{counter-reset:f var(--live-fps, 0);content:counter(f) " fps"}.tile__gauge--fps i{inline-size:clamp(0%,calc(var(--live-fps, 0) / 120 * 100%),100%);background:var(--ok)}.stage--momentum{min-height:16rem;padding:clamp(var(--space-4),6vw,4rem);overflow:hidden}.momentum{display:grid;gap:var(--space-4);justify-items:center}.momentum__stack{display:grid;gap:.6rem}.momentum__stack span{display:block;inline-size:clamp(8rem,30vw,14rem);block-size:.7rem;border-radius:999px;background:linear-gradient(90deg,var(--accent),color-mix(in oklab,var(--accent) 35%,var(--surface)));transform:translate(clamp(-3rem,calc(var(--live-scroll-velocity, 0) * var(--m, 1) * 1px),3rem)) skew(clamp(-16deg,calc(var(--live-scroll-velocity, 0) * -.5deg),16deg));filter:blur(clamp(0px,calc(max(var(--live-scroll-velocity, 0),-1 * var(--live-scroll-velocity, 0))*.14px),5px));transition:transform .18s var(--ease-out),filter .18s var(--ease-out)}.momentum__read{margin:0;display:inline-flex;align-items:center;gap:.6ch;font-family:var(--font-mono);font-size:var(--step-1);font-weight:600;font-variant-numeric:tabular-nums;color:var(--accent-ink)}.momentum__v:after{counter-reset:v calc(var(--live-scroll-velocity, 0));content:counter(v)}.momentum__dir:after{content:"·";color:var(--ink-faint)}@container style(--live-scroll-direction: 1){.momentum__dir:after{content:"↓"}}@container style(--live-scroll-direction: -1){.momentum__dir:after{content:"↑"}}.stage--size{min-height:20rem;padding:clamp(var(--space-4),6vw,4rem)}.sizer{--landscape: clamp(0, calc((var(--live-aspect, 1) - 1) * 100), 1);position:relative;inline-size:16rem;block-size:11rem;min-inline-size:8rem;min-block-size:6rem;max-inline-size:100%;resize:both;overflow:auto;display:grid;align-content:center;justify-items:center;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--line-strong);border-radius:var(--radius);background:color-mix(in oklab,var(--accent-soft) calc(var(--landscape) * 55% + 18%),var(--surface));transition:background .2s var(--ease-out)}.sizer__badge{margin:0;display:grid;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink)}.sizer__por,.sizer__land{grid-area:1 / 1}.sizer__land{opacity:var(--landscape)}.sizer__por{opacity:calc(1 - var(--landscape))}.sizer__read{margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.1rem .8rem;font-family:var(--font-mono);font-size:var(--step--1);font-variant-numeric:tabular-nums;color:var(--ink-soft)}.sizer__w:after{counter-reset:w calc(var(--live-w, 0));content:counter(w)}.sizer__h:after{counter-reset:h calc(var(--live-h, 0));content:counter(h)}.sizer__aspect:after{counter-reset:whole round(down,var(--live-aspect, 1),1) frac round(mod(var(--live-aspect, 1),1) * 100,1);content:"aspect " counter(whole) "." counter(frac,decimal-leading-zero);color:var(--accent-ink)}.stage--media{min-height:20rem;padding:clamp(var(--space-4),6vw,4rem)}.player{display:grid;justify-items:center;gap:var(--space-3);--live-video-accent: var(--accent);transition:--live-progress .25s linear,--live-video-accent .3s linear}.player__ring{inline-size:clamp(10rem,36vw,14rem);aspect-ratio:1;border-radius:50%;padding:.55rem;background:conic-gradient(var(--live-video-accent, var(--accent)) calc(var(--live-progress, 0) * 360deg),var(--line) 0)}.player__video{inline-size:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;display:block;background:var(--surface)}.player__time{margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-variant-numeric:tabular-nums;color:var(--ink-soft)}.player__cur,.player__dur{color:var(--accent-ink);font-weight:600}.player__cur:after{counter-reset:c calc(var(--live-current-time, 0));content:counter(c) "s"}.player__dur:after{counter-reset:d calc(var(--live-duration, 0));content:counter(d) "s"}.stage--ambient{min-height:18rem;padding:clamp(var(--space-4),6vw,4rem);border:none;background:none}.ambient{--low: clamp(0, round(up, calc(.2 - var(--live-battery-level, 1)), 1), 1);display:grid;gap:var(--space-3);inline-size:min(26rem,100%)}.ambient:has(.ambient__sim:checked){--low: 1}.ambient__switch{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.04em;color:var(--ink-soft);cursor:pointer}.ambient__sim{-moz-appearance:none;appearance:none;-webkit-appearance:none;position:relative;flex:0 0 auto;inline-size:2.5rem;block-size:1.4rem;margin:0;border-radius:999px;background:var(--line-strong);cursor:pointer;transition:background .2s var(--ease-out)}.ambient__sim:after{content:"";position:absolute;inset-block:.18rem;inset-inline-start:.18rem;aspect-ratio:1;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px #0006;transition:translate .2s var(--ease-out)}.ambient__sim:checked{background:var(--accent)}.ambient__sim:checked:after{translate:1.1rem 0}.ambient__sim:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.ambient__card{position:relative;overflow:hidden;padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius);color:oklch(98% .02 var(--accent-h));background:linear-gradient(110deg in oklab,color(from oklch(46% .2 var(--accent-h)) display-p3 r g b),color(from oklch(30% .16 calc(var(--accent-h) + 40)) display-p3 r g b),color(from oklch(46% .2 var(--accent-h)) display-p3 r g b));background-size:200% 100%;animation:ambient-sheen 4s linear infinite}@keyframes ambient-sheen{to{background-position:200% 0}}.ambient__title{margin:0 0 var(--space-1);font-family:var(--font-display);font-size:var(--step-2);font-weight:800;letter-spacing:-.02em;text-wrap:balance}.ambient__state{margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;opacity:.85}.ambient__state:after{content:"full power ·effects on"}@container style(--low: 1){.ambient__card{animation:none;background:var(--surface);color:var(--ink);border-color:var(--line-strong)}.ambient__state:after{content:"low battery ·effects off"}}.dragboard{position:relative;inline-size:100%;block-size:19rem;border-radius:var(--radius);border:1px solid var(--line);overflow:hidden;touch-action:none;background:radial-gradient(circle at center,var(--accent-soft),transparent 72%),radial-gradient(color-mix(in oklab,var(--line) 70%,transparent) 1px,transparent 1.6px) 0 0 / 18px 18px,var(--surface)}.drag-token{position:absolute;left:calc(var(--hx) * 100%);top:calc(var(--hy) * 100%);translate:-50% -50%;display:grid;place-items:center;padding:.7rem 1.1rem;border-radius:999px;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.02em;white-space:nowrap;color:light-dark(oklch(99% .02 var(--accent-h)),oklch(18% .03 var(--accent-h)));background:var(--accent);box-shadow:0 6px 18px -8px color-mix(in oklab,var(--accent) 70%,transparent);cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;transition:translate .8s var(--ease-spring-3),scale .8s var(--ease-spring-3),box-shadow .3s var(--ease-out)}.drag-token:active{translate:calc(-50% + (var(--live-local-pointer-x-ratio, .5) - var(--hx)) * var(--live-w, 0) * 1px) calc(-50% + (var(--live-local-pointer-y-ratio, .5) - var(--hy)) * var(--live-h, 0) * 1px);transition:none;cursor:grabbing;scale:1.08;z-index:2;box-shadow:0 16px 32px -10px color-mix(in oklab,var(--accent) 80%,transparent)}.stage--formstate{min-height:20rem;padding:clamp(var(--space-4),5vw,3rem);display:grid;place-items:center}.fstate-wrap{--ok: light-dark(oklch(56% .15 150), oklch(76% .16 150));--live-color: #7c5cff;--accent: var(--live-color);--accent-ink: oklch(from var(--live-color) calc(l - .12) c h);--accent-soft: oklch(from var(--live-color) l c h / .28);inline-size:min(30rem,100%);display:grid;gap:.7rem}.fstate{inline-size:100%;display:grid;gap:var(--space-4)}.fstate__field{display:grid;gap:var(--space-2)}.fstate__label{font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}.fstate__input{inline-size:100%;padding:.85rem var(--space-3);font-family:var(--font-sans);font-size:var(--step-0);color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;transition:border-color .2s var(--ease-out)}.fstate__input::placeholder{color:var(--ink-faint)}.fstate__input:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.fstate__select{inline-size:100%;padding:.85rem var(--space-3);font-family:var(--font-sans);font-size:var(--step-0);color:var(--ink);background-color:var(--surface);border:1px solid var(--line-strong);border-radius:12px;cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:right 1.2rem center,right .85rem center;background-size:.35rem .35rem,.35rem .35rem;background-repeat:no-repeat;transition:border-color .2s var(--ease-out)}.fstate__select:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.fstate__seats{margin:0;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.04em;color:var(--accent-ink);opacity:clamp(0,var(--live-value-num, 0),1);transition:opacity .2s linear}.fstate__seats:after{counter-reset:seats calc(var(--live-value-num, 0));content:counter(seats) " seats included"}.fstate__color{inline-size:100%;block-size:2.75rem;padding:.3rem;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;cursor:pointer;transition:border-color .2s var(--ease-out)}.fstate__color::-webkit-color-swatch-wrapper{padding:0}.fstate__color::-webkit-color-swatch{border:none;border-radius:8px}.fstate__color::-moz-color-swatch{border:none;border-radius:8px}.fstate__color:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.fstate__chips{display:flex;flex-wrap:wrap;gap:.9rem;margin:0;padding:0;list-style:none;font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.04em}.fstate__chip{display:inline-flex;align-items:center;gap:.5ch;color:color-mix(in oklab,var(--accent-ink) calc(var(--s, 0) * 100%),var(--ink-faint));transition:color .2s linear}.fstate__chip span{inline-size:.5rem;block-size:.5rem;border-radius:50%;background:color-mix(in oklab,var(--accent) calc(var(--s, 0) * 100%),var(--line-strong));transition:background .2s linear}.fstate__chip--dirty{--s: var(--live-dirty, 0)}.fstate__chip--touched{--s: var(--live-touched, 0)}.fstate__chip--changed{--s: var(--live-changed, 0)}.fstate__chip--submitted{--s: var(--live-submitted, 0)}.fstate__topper{display:flex;align-items:center;gap:.7rem;padding-inline:.4rem;font-family:var(--font-mono);font-size:var(--step--1)}.fstate__ring{--p: clamp(0, var(--live-completion, 0), 1);--ring: var(--accent);inline-size:1.35rem;aspect-ratio:1;border-radius:50%;background:conic-gradient(in oklch,var(--ring) calc(var(--p) * 360deg),color-mix(in oklab,var(--line) 55%,transparent) 0);-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 calc(100% - 2.5px));mask:radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 calc(100% - 2.5px));transition:background .26s var(--ease-out)}.fstate__count{font-weight:600;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--ink-soft)}.fstate__count:after{counter-reset:v var(--live-valid-count, 0) t var(--live-field-count, 0);content:counter(v) " / " counter(t) " valid"}.fstate__status{margin-inline-start:auto;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);transition:color .22s linear}.fstate__status:after{content:"incomplete"}@container style(--live-all-valid: 1){.fstate__ring{--ring: var(--ok)}.fstate__status:after{content:"ready"}}@container style(--live-submitted: 1){.fstate__status{color:var(--ok)}.fstate__status:after{content:"submitted"}}.fstate__bar{display:flex;align-items:center;gap:var(--space-2)}.fstate__btn{padding:.6rem 1.15rem;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;letter-spacing:.04em;color:var(--ink-soft);background:transparent;border:1px solid var(--line-strong);border-radius:12px;cursor:pointer;transition:color .2s linear,border-color .2s var(--ease-out),background .2s var(--ease-out),opacity .2s linear}.fstate__btn:hover{border-color:var(--accent);color:var(--accent-ink)}.fstate__btn--go{color:var(--paper);color:contrast-color(var(--accent));background:var(--accent);border-color:var(--accent);opacity:.4;pointer-events:none}@container style(--live-all-valid: 1){.fstate__btn--go{opacity:1;pointer-events:auto}}.fstate__btn--go:hover{color:var(--paper);color:contrast-color(var(--accent-ink));background:var(--accent-ink);border-color:var(--accent-ink)}.stage--sun{min-height:22rem;padding:clamp(var(--space-4),6vw,4rem);display:grid;justify-items:center;gap:var(--space-4);overflow:clip}.sun-card{--dx: clamp(-.5, calc(var(--live-local-pointer-x-ratio, .5) - .5), .5);--dy: clamp(-.5, calc(var(--live-local-pointer-y-ratio, .5) - .5), .5);--reach: 7rem;position:relative;inline-size:min(19rem,70vw);aspect-ratio:4 / 5;border-radius:18px;box-shadow:calc(var(--dx) * -2 * var(--reach)) calc(var(--dy) * -2 * var(--reach)) 2.5rem .25rem oklch(from var(--live-img, #825f3c) l c h / .6);transition:box-shadow .12s linear}.sun-card__img{display:block;inline-size:100%;block-size:100%;object-fit:cover;border-radius:inherit}.sun-palette{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem;margin:0;padding:0;list-style:none}.sun-sw{display:grid;gap:.4rem;justify-items:center;font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}.sun-sw i{inline-size:2.5rem;block-size:2.5rem;border-radius:10px;background:var(--sw);box-shadow:inset 0 0 0 1px #ffffff1f,0 1px 4px #0000002e;transition:background .28s linear}.sun-sw--dominant{--sw: var(--live-img, #825f3c)}.sun-sw--accent{--sw: var(--live-img-accent, #d27828)}.sun-sw--dark{--sw: var(--live-img-dark, #261e1c)}.sun-sw--light{--sw: var(--live-img-light, #e8ded2)}.sun-sw--avg{--sw: var(--live-img-avg, #967864)}.sun-picker{display:flex;gap:var(--space-2)}.sun-dot{inline-size:2rem;block-size:2rem;padding:0;border:2px solid var(--line-strong);border-radius:50%;background-size:cover;background-position:center;cursor:pointer;transition:transform .15s var(--ease-out),border-color .15s linear}.sun-dot:focus-visible{border-color:var(--accent)}.sun-dot:hover{transform:scale(1.12);border-color:var(--accent)}.stage--vid{display:grid;place-items:center;gap:var(--space-3);padding:0}.vid-card{--vid: var(--live-video, #3c4678);position:relative;margin:0;inline-size:100%;border-radius:16px;overflow:hidden;box-shadow:0 0 3rem -.25rem oklch(from var(--vid) l c h / .55),0 0 7rem .5rem oklch(from var(--vid) l c h / .32);transition:box-shadow .32s linear}.vid-card__v{display:block;inline-size:100%;block-size:auto}.vid-palette{display:flex;justify-content:center;gap:var(--space-4);margin:0;padding:0;list-style:none}.vid-sw{display:grid;gap:.4rem;justify-items:center;font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}.vid-sw i{inline-size:2.5rem;block-size:2.5rem;border-radius:10px;background:var(--sw);box-shadow:inset 0 0 0 1px #ffffff1f,0 1px 4px #0000002e;transition:background .28s linear}.vid-sw--dominant{--sw: var(--live-video, #3c4678)}.vid-sw--accent{--sw: var(--live-video-accent, var(--live-video, #3c4678))}.src-grid{position:relative;z-index:1;display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(max(15rem,calc((100% - 2 * var(--space-3)) / 3)),1fr));grid-auto-rows:auto}.src{position:relative;grid-row:span 3;display:grid;grid-template-rows:subgrid;row-gap:var(--space-2);padding:var(--space-3);border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden;transition:border-color .2s var(--ease-out),box-shadow .2s var(--ease-out)}.src:hover,.src:has(.src__link:focus-visible){border-color:color-mix(in oklab,var(--accent) 40%,var(--line));box-shadow:0 14px 30px -24px color-mix(in oklab,var(--accent) 55%,transparent)}.src:hover .src__key,.src:has(.src__link:focus-visible) .src__key{color:var(--accent)}.src__link{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;border-radius:inherit}.src__link:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;border-radius:inherit}@keyframes src-enter{0%{opacity:0;translate:0 1.6rem;scale:.97}to{opacity:1;translate:none;scale:1}}@supports (animation-timeline: view()){@media (prefers-reduced-motion: no-preference){.src{animation:src-enter linear both;animation-timeline:view();animation-range:entry 0% entry 28%}}}.src__head{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;padding-block-end:.7rem;border-block-end:1px solid var(--line)}.src__icon{display:grid;place-items:center;inline-size:1.6rem;block-size:1.6rem;flex:0 0 auto;border-radius:7px;background:var(--accent-soft);color:var(--accent-ink)}.src__icon svg{inline-size:.95rem;block-size:.95rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.src__key{font-family:var(--font-mono);font-size:var(--step-0);font-weight:600;letter-spacing:-.01em;color:var(--accent-ink);background:none;padding:0;overflow-wrap:anywhere;transition:color .2s var(--ease-out)}.src__scope,.src__tag{font-family:var(--font-mono);font-size:.62rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;padding:.2em .6em;border-radius:999px;border:1px solid transparent}.src__scope{margin-inline-start:auto;color:var(--accent-ink);background:var(--accent-soft);border-color:color-mix(in oklab,var(--accent) 25%,transparent)}.src__scope--el{color:var(--ink-soft);background:transparent;border-color:var(--line-strong)}.src__tag{color:var(--ink-faint);border-color:var(--line)}.src__vars{margin:0;display:grid;align-content:start}.src__var{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:.8rem;padding-block:.22rem;font-family:var(--font-mono);font-size:var(--step--1);line-height:1.45}.src__var+.src__var{border-block-start:1px solid color-mix(in oklab,var(--line) 40%,transparent)}.src__var dt{margin:0;color:light-dark(oklch(52% .22 350),oklch(82% .16 350));font-weight:500;overflow-wrap:anywhere}.src__var dd{margin:0;text-align:right;color:var(--accent-ink);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.src__var dd:after{counter-reset:v calc(var(--val, 0));content:counter(v) var(--unit, "")}.src__var--scoped dd{color:var(--ink-faint);font-weight:500}.src__var--scoped dd:after{content:"—"}.src__var--navtype dd:after{content:"navigate"}@container style(--const-nav-type: reload){.src__var--navtype dd:after{content:"reload"}}@container style(--const-nav-type: back_forward){.src__var--navtype dd:after{content:"back / fwd"}}@container style(--const-nav-type: prerender){.src__var--navtype dd:after{content:"prerender"}}.src__dash{color:var(--ink-faint)}.src__desc{align-self:end;margin:0 calc(-1 * var(--space-3)) calc(-1 * var(--space-3));padding:var(--space-2) var(--space-3);border-block-start:1px solid var(--line);background:color-mix(in oklab,var(--paper) 55%,transparent);font-size:var(--step-0);line-height:1.45;color:var(--ink-soft);text-wrap:balance}.src__desc code{background:none;padding:0;border:0;color:var(--ink);font-weight:500}.colophon{width:var(--shell);margin:0 auto;padding:var(--space-6) 0 var(--space-5);border-top:1px solid var(--line)}.colophon__lead{font-family:var(--font-display);font-size:var(--step-2);font-weight:700;font-stretch:108%;letter-spacing:-.03em;line-height:1.05;color:var(--ink);text-wrap:balance;margin:0 0 var(--space-3);max-width:30rem}.colophon__note{color:var(--ink-soft);max-width:var(--measure);margin:0;text-wrap:balance}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.tilt-card{transform:none;transition:none}.tilt-card__glare{background:radial-gradient(36% 36% at 50% 50%,#fff5,#fff0 60%)}.reveal{translate:none;filter:none}.reveal__node{scale:1}.scroll-hint:after,.hint__dot{animation:none}.dial::-webkit-slider-thumb,.dial::-moz-range-thumb,.dial::-webkit-slider-runnable-track,.steps::-webkit-slider-thumb,.steps::-moz-range-thumb{transition:none}.player,.clock__face{transition:none}.momentum__stack span{filter:none}.ambient__card{animation:none}.hchip__shear i{transition:none}}.when-pointer{display:contents}.when-tilt{display:none}:root[data-tilt=on] .when-pointer{display:none}:root[data-tilt=on] .when-tilt{display:contents}.tilt-enable{display:none;align-items:center;gap:.5rem;margin-top:var(--space-2);padding:.5rem .9rem;border:1px solid color-mix(in oklab,white 55%,transparent);border-radius:999px;background:color-mix(in oklab,white 22%,transparent);color:#fff;font:inherit;font-family:var(--font-mono);font-size:var(--step--1);font-weight:600;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:scale .16s var(--ease-out)}:root[data-tilt=offer] .tilt-enable{display:inline-flex}.tilt-enable:active{scale:.96}.tilt-enable__icon{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;animation:tilt-wobble 2.8s var(--ease-out) infinite}.tilt-card__note{display:none;margin:var(--space-2) 0 0;font-family:var(--font-mono);font-size:var(--step--1);color:oklch(88% .04 var(--accent-h))}:root[data-tilt=denied] .tilt-card__note{display:block}@keyframes tilt-wobble{0%,to{rotate:-12deg}50%{rotate:12deg}}@media (prefers-reduced-motion: reduce){.tilt-enable__icon{animation:none}}