@font-face{font-family:Inter Display;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/InterDisplay-Bold.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/InterVariable.woff2) format("woff2")}:root{font-family:Inter,Arial,sans-serif;font-optical-sizing:auto;font-synthesis:none;-webkit-font-smoothing:antialiased;--surface:#d7d7d7;--text:#272a2d;--muted:#666a6f;--line:#bec1c3;--focus:#626e7e;--selected:#f4f4f3;--picker:#caccce;color-scheme:light}:root[data-theme=dark]{--surface:#24272c;--text:#f1f2f4;--muted:#858990;--line:#303337;--focus:#c1cfdf;--selected:#444a54;--picker:#1a1d21;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;color:var(--text);background:var(--surface)}button{font:inherit;color:inherit}[hidden]{display:none!important}canvas{display:block;width:100%;height:100%}.controls{position:relative;padding:54px max(12%,calc((100% - 1120px)/2)) 76px;background:var(--surface);isolation:isolate;min-height:100vh}.controls-intro{position:relative;z-index:2;margin:0 0 28px 2%;display:flex;align-items:center;justify-content:space-between;gap:24px}.controls-intro h1{font-family:Inter Display,Inter,sans-serif;font-weight:700;font-size:clamp(32px,3.2vw,48px);letter-spacing:-.045em;line-height:1.08;margin:0;text-wrap:balance}.control-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 30px;position:relative;z-index:1}.control-card{min-width:0}.control-view{display:block;width:100%;height:260px;background:none;border:0;border-radius:20px;touch-action:pan-y;cursor:pointer;padding:0;color:inherit}.control-view:focus-visible{outline:2px solid var(--focus);outline-offset:-5px}#range-control,#dial-control{touch-action:none;cursor:ew-resize}#lever-control{touch-action:none;cursor:grab}.control-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:20px 10px 0;border-top:1px solid var(--line)}.control-caption h2{font-family:Inter Display,Inter,sans-serif;font-size:16px;font-weight:700;letter-spacing:-.015em;margin:0}.control-caption span,.control-caption output{font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}#controls-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media(min-width:701px)and (max-width:900px){.control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.controls-intro{gap:16px}.controls-intro h1{font-size:36px}}@media(max-width:700px){.control-grid{grid-template-columns:1fr;gap:32px}.controls{padding:32px 7% 48px}.control-view{height:250px}.controls-intro{align-items:flex-start;margin-left:0;flex-wrap:wrap;gap:16px}.controls-intro h1{font-size:34px}}:root[data-theme=dark] .control-caption span,:root[data-theme=dark] .control-caption output{font-weight:400}#theme-toggle{width:44px;height:44px;display:grid;place-items:center;flex-shrink:0;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}#theme-toggle:focus-visible{outline:2px solid var(--focus);outline-offset:3px}#theme-toggle svg{grid-area:1/1;pointer-events:none;transform-origin:center;transition:transform .24s cubic-bezier(.23,1,.32,1),opacity .18s cubic-bezier(.23,1,.32,1)}#theme-toggle .moon-icon{opacity:1;transform:rotate(0) scale(1)}#theme-toggle .sun-icon{opacity:0;transform:rotate(-60deg) scale(.9)}:root[data-theme=dark] #theme-toggle .moon-icon{opacity:0;transform:rotate(45deg) scale(.9)}:root[data-theme=dark] #theme-toggle .sun-icon{opacity:1;transform:rotate(0) scale(1)}@media(hover:hover)and (pointer:fine){#theme-toggle:hover{background:var(--picker);color:var(--text)}}@media(prefers-reduced-motion:reduce){#theme-toggle svg{transform:none!important;transition:opacity .15s ease}}