:root{--ink: #2b2723;--ink-soft: rgb(43 39 35 / .62);--dark: #000;--font: ui-sans-serif, -apple-system, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;--font-label: helvetica-neue-lt-pro, "Helvetica Neue", Helvetica, Arial, sans-serif;--font-display: "Haas Grotesk Display", "Helvetica Neue", Helvetica, Arial, sans-serif;--size-label: clamp(12px, calc(12px + 4 * (100vw - 375px) / 1065), 16px);--size-display: clamp(28px, calc(28px + 4 * (100vw - 375px) / 1065), 32px);--text: oklch(.1 0 0);--muted: oklch(.4 0 0);--pad: 20px;--mono: ui-monospace, "SF Mono", Menlo, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--dark);color:var(--ink);font:13px/1.4 var(--font);-webkit-font-smoothing:antialiased}#stage{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;opacity:0;transition:opacity .9s ease}body.ready #stage{opacity:1}.lil-gui.autoPlace{top:76px!important;max-height:calc(100% - 132px)!important}@media(max-width:768px){.lil-gui.autoPlace{top:110px!important;max-height:calc(100% - 166px)!important}}.lil-gui.lil-root>.lil-children{overscroll-behavior:contain}.status{position:fixed;inset:50% 20px auto;transform:translateY(-50%);margin:0;text-align:center;color:var(--ink)}.status:empty{display:none}@media(prefers-reduced-motion:reduce){#stage{transition:none}}.device-modes{position:fixed;z-index:2;left:50%;bottom:max(64px,calc(env(safe-area-inset-bottom) + 56px));transform:translate(-50%);display:flex;padding:3px;gap:2px;border-radius:999px;background:#ffffff80;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.device-modes button{font:500 var(--size-label) / 1.2 var(--font-label);color:var(--ink-soft);background:none;border:0;border-radius:999px;padding:7px 16px;cursor:pointer;transition:background-color .2s ease,color .2s ease}.device-modes button[aria-pressed=true]{color:var(--ink);background:#ffffffe6}body:not([data-scene=device]) .device-modes{display:none}body.ready.switching #stage{opacity:0;transition:opacity .22s ease}@font-face{font-display:swap;font-family:Haas Grotesk Display;font-style:normal;font-weight:500;src:url(/type/haas-grotesk-disp-medium.woff2) format("woff2"),url(/type/haas-grotesk-disp-medium.woff) format("woff")}.masthead{position:fixed;top:0;left:0;right:0;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--pad);align-items:start;padding:max(var(--pad),env(safe-area-inset-top)) max(var(--pad),env(safe-area-inset-right)) 0 max(var(--pad),env(safe-area-inset-left));pointer-events:none;z-index:2;color:var(--text);transition:color .4s ease}body:not([data-scene=device]) .masthead,body:not([data-scene=device]) .about__toggle{color:#fff}body:before,body:after{content:"";position:fixed;left:0;right:0;height:150px;z-index:1;pointer-events:none;opacity:0;transition:opacity .4s ease}body:before{top:0;background:linear-gradient(#00000057,#0000)}body:after{bottom:0;height:110px;background:linear-gradient(#0000,#00000042)}body:not([data-scene=device]):before,body:not([data-scene=device]):after{opacity:1}.masthead>*{pointer-events:auto}.masthead__name,.masthead__title{margin:0;font:500 var(--size-display) / 1 var(--font-display);color:inherit;text-decoration:none;user-select:none}.masthead__name{grid-column:1 / 3;justify-self:start}.masthead__title{grid-column:3 / 7}.masthead__tabs{grid-column:7 / -1;justify-self:end;display:flex;align-items:center;gap:12px;padding-top:4px}.masthead__tab{font:500 var(--size-label) / 1.2 var(--font-label);color:inherit;opacity:.55;background:none;border:0;padding:0;cursor:pointer;text-decoration:none;transition:opacity .3s ease}.masthead__tab[aria-pressed=true]{opacity:1}.masthead__tab[aria-busy=true]{cursor:progress}@media(hover:hover){.masthead__name:hover{opacity:.6}.masthead__tab:hover{opacity:1}}@media(max-width:768px){.masthead{grid-template-columns:1fr 1fr;row-gap:14px}.masthead__name{grid-column:1}.masthead__title{grid-column:2}.masthead__tabs{grid-column:2;justify-self:start;padding-top:0}}.about{display:contents}.about__toggle{position:fixed;right:max(var(--pad),env(safe-area-inset-right));bottom:max(var(--pad),env(safe-area-inset-bottom));font:500 var(--size-label) / 1.2 var(--font-label);z-index:2;color:var(--text);transition:color .4s ease,opacity .3s ease;opacity:.55;background:none;border:0;padding:0;cursor:pointer}.about__toggle[aria-expanded=true]{opacity:1}@media(hover:hover){.about__toggle:hover{opacity:1}}.about__panel{position:fixed;z-index:3;right:max(var(--pad),env(safe-area-inset-right));bottom:calc(max(var(--pad),env(safe-area-inset-bottom)) + 30px);width:min(420px,calc(100vw - 2 * var(--pad)));max-height:calc(100dvh - 150px);overflow-y:auto;overscroll-behavior:contain;padding:6px 20px;border-radius:4px;background:#fffffff0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--text);font:500 13px / 1.3 var(--font-label)}.about__panel[hidden]{display:none}.about__rows{margin:0;padding:0;list-style:none}.about__row{display:grid;grid-template-columns:132px 1fr;align-items:center;column-gap:12px;min-height:50px;padding:9px 0;border-bottom:1px solid rgb(0 0 0 / .14)}.about__rows:last-child .about__row:last-child{border-bottom:0}.about__keys{display:flex;gap:4px}.about__credits{color:var(--muted);font-weight:400;font-size:12px}.about__term{font-weight:500;color:var(--text)}.about__panel a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}.key{position:relative;display:inline-flex;align-items:flex-start;justify-content:flex-start;width:28px;height:30px;padding:5px 0 0 7px;border-radius:6px;background:linear-gradient(#ececea,#d6d5d2);box-shadow:0 1px #0000002e,0 2px 4px #0000001f,inset 0 0 0 1px #00000014;font:500 11px / 1 var(--font-label);color:#3b3a38;isolation:isolate}.key:before{content:"";position:absolute;inset:2px 3px 5px;z-index:-1;border-radius:4px;background:linear-gradient(#fdfdfc,#f1f0ee);box-shadow:inset 0 1px #ffffffe6,0 1px 1px #00000014}.key--space{width:96px}.about__toggle:focus:not(:focus-visible),.masthead__tab:focus:not(:focus-visible){outline:none}