@font-face{font-family:Onest;src:url(/fonts/onest.woff2)format("woff2");font-weight:100 900;font-display:swap}@font-face{font-family:Onest Fallback;src:local(Arial),local(ArialMT),local(Helvetica Neue),local(HelveticaNeue);font-weight:100 550;size-adjust:101.9%;ascent-override:95.2%;descent-override:29.9%;line-gap-override:0%}@font-face{font-family:Onest Fallback;src:local(Arial Bold),local(Arial-BoldMT),local(Helvetica Neue Bold),local(HelveticaNeue-Bold);font-weight:551 900;size-adjust:99.8%;ascent-override:97.2%;descent-override:30.6%;line-gap-override:0%}:root{--ink:oklch(22% .02 300);--ink-2:oklch(45% .02 300);--paper:oklch(95.5% .004 285);--on-ink:oklch(97% .005 300);--on-ink-2:oklch(82% .01 300);--on-ink-3:oklch(72% .01 300);--on-ink-line:oklch(100% 0 none/.14);--pill:oklch(100% 0 none/.72);--pill-line:oklch(22% .02 300/.1);--accent:oklch(50% .13 355);--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--ease-drawer:cubic-bezier(.32, .72, 0, 1);--dur-press:.16s;--dur-state:.2s;--dur-modal:.25s;--dur-drawer:.5s;--font-display:"Onest", "Onest Fallback", system-ui, sans-serif;--font-text:"Onest", "Onest Fallback", system-ui, sans-serif;--weight-text:400;--weight-ui:500;--weight-strong:600;--type-hero:clamp(2.125rem, 5vw, 5rem);--type-hero-stacked:clamp(1.875rem, 6.6vw, 3.75rem);--space-3xs:clamp(.25rem, .2292rem + .093vw, .3125rem);--space-2xs:clamp(.5rem, .4583rem + .185vw, .625rem);--space-xs:clamp(.75rem, .6875rem + .278vw, .9375rem);--space-s:clamp(1rem, .9167rem + .37vw, 1.25rem);--space-m:clamp(1.5rem, 1.375rem + .556vw, 1.875rem);--space-l:clamp(2rem, 1.8333rem + .741vw, 2.5rem);--space-xl:clamp(3rem, 2.6667rem + 1.481vw, 4rem);--space-2xl:clamp(4rem, 3.3333rem + 2.963vw, 6rem);--space-3xl:clamp(6rem, 5rem + 4.444vw, 9rem);--step--1:clamp(.8125rem, .7917rem + .093vw, .875rem);--step-0:clamp(1rem, .9792rem + .093vw, 1.0625rem);--step-1:clamp(1.125rem, 1.0625rem + .278vw, 1.3125rem);--step-2:clamp(1.3125rem, 1.2083rem + .463vw, 1.625rem);--step-3:clamp(1.625rem, 1.4167rem + .926vw, 2.25rem);--step-4:clamp(1.75rem, 1.4167rem + 1.4815vw, 2.75rem);--step-5:clamp(2.25rem, 1.5rem + 3.333vw, 4.5rem);--gutter:clamp(1rem, 2.6vw, 2.25rem);--frame:120rem;--pad-s:max(var(--gutter), env(safe-area-inset-left,0px), (100vw - var(--frame)) / 2);--pad-e:max(var(--gutter), env(safe-area-inset-right,0px), (100vw - var(--frame)) / 2);--header-h:4rem;--radius-s:.75rem;--radius-m:1.125rem;--radius-l:clamp(1.375rem, 2vw, 1.75rem);--radius-xl:2rem;--target:2.75rem;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light only}@media (hover:hover) and (pointer:fine){:root{--target:2.5rem}}@media (height<=540px) and (aspect-ratio>=4/3){:root{--header-h:3.25rem}}*{box-sizing:border-box}@view-transition{navigation:auto}@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}[hidden]{display:none!important}html,body{block-size:100%;margin:0}html{scrollbar-gutter:stable;font-size:max(100%,min(.8333vw,1.6vh))}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-block-start:calc(var(--header-h) + env(safe-area-inset-top,0px))}body{background:var(--paper);color:var(--ink);font:var(--weight-text) var(--step-0)/1.55 var(--font-text);font-synthesis:none;font-kerning:normal;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;transition:background-color .6s var(--ease-out);overflow:hidden}::selection{background:color-mix(in oklch, var(--accent) 28%, transparent);color:var(--ink)}canvas.gl{touch-action:none;block-size:100%;inline-size:100%;display:block;position:fixed;inset:0}.chrome{pointer-events:none;z-index:5;position:fixed;inset:0}.chrome>*{pointer-events:auto}.chrome>.bar{justify-content:space-between;align-items:center;gap:var(--space-s);min-block-size:calc(var(--header-h) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) var(--pad-e) 0 var(--pad-s);pointer-events:none;transition:background-color var(--dur-state) ease, border-color var(--dur-state) ease;border-block-end:1px solid #0000;display:flex;position:absolute;inset:0 0 auto}.bar>*{pointer-events:auto}body.on-dark .chrome>.bar{background:var(--ink);border-block-end-color:var(--on-ink-line);-webkit-backdrop-filter:none;backdrop-filter:none}body.on-dark .chrome>.bar :is(.who,.navlinks a){color:var(--on-ink)}body.on-dark .chrome>.bar .who span{color:var(--on-ink-2)}@media (hover:hover) and (pointer:fine){body.on-dark .chrome>.bar :is(.who,.navlinks a):hover{background:oklch(100% 0 none/.1)}}body.scrolled:not(.on-dark) .chrome>.bar{background:color-mix(in oklch, var(--paper) 97%, transparent);border-block-end-color:var(--pill-line);-webkit-backdrop-filter:blur(.75rem);backdrop-filter:blur(.75rem)}@media (pointer:coarse){body.scrolled:not(.on-dark) .chrome>.bar{background:var(--paper)}}.who{color:inherit;border-radius:var(--radius-s);margin-inline-start:-.625rem;padding:.375rem .625rem;text-decoration:none;display:grid}.chrome>.skip{z-index:2;position:absolute;inset-block-start:calc(env(safe-area-inset-top,0px) + .625rem);inset-inline-start:var(--pad-s);translate:0 -200%}.chrome>.skip:focus-visible{box-shadow:0 0 0 .1875rem var(--paper), 0 0 0 .3125rem var(--ink);outline:none;translate:0}.chrome>.skip{transition:none}.who b{font:var(--weight-strong) 1.0625rem/1.2 var(--font-display);letter-spacing:-.01em}.who span{color:var(--ink-2);font-size:.8125rem;font-weight:var(--weight-ui);letter-spacing:.01em}.navlinks{gap:var(--space-3xs);margin-inline-end:-.875rem;display:flex}.navlinks a{min-block-size:var(--target);color:var(--ink);font-weight:var(--weight-ui);letter-spacing:.005em;border-radius:999px;align-items:center;padding-inline:.875rem;font-size:.9375rem;text-decoration:none;display:inline-flex}.opts{gap:.375rem;display:flex}.opts a{min-inline-size:var(--target);block-size:var(--target);background:var(--pill);border:1px solid var(--pill-line);color:var(--ink);font-weight:var(--weight-ui);-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem);border-radius:999px;place-items:center;padding-inline:.875rem;font-size:.875rem;text-decoration:none;display:grid}.opts a[aria-current=page]{background:var(--ink);color:oklch(100% 0 none)}@media (hover:hover) and (pointer:fine){.opts a:not([aria-current]):hover,.navlinks a:hover,.who:hover{background:oklch(100% 0 none/.9)}}.hint{max-inline-size:34ch;color:var(--ink-2);font-size:.8125rem;font-weight:var(--weight-ui);letter-spacing:.01em;position:absolute;inset-block-end:var(--gutter);inset-inline-start:var(--pad-s)}.hint b{color:var(--ink);font-weight:var(--weight-strong)}.hint:empty{display:none}.caption{text-align:end;transition:opacity .3s var(--ease-out), translate .3s var(--ease-out);position:absolute;inset-block-end:var(--gutter);inset-inline-end:var(--pad-e)}.caption[hidden]{opacity:0;display:block;translate:0 .5rem}.caption b{font:var(--weight-strong) var(--step-4)/1.05 var(--font-display);letter-spacing:-.03em;display:block}.caption span{color:var(--ink-2)}.panel{z-index:6;inline-size:min(27.5rem,100%);padding:var(--gutter) calc(var(--pad-e) + .5rem) var(--gutter) calc(var(--gutter) + .5rem);opacity:0;visibility:hidden;transition:opacity .32s var(--ease-out), translate .42s var(--ease-out), visibility 0s linear .42s;align-content:center;gap:1.125rem;display:grid;position:fixed;inset-block:0;inset-inline-end:0;translate:1.5rem}.panel.on{opacity:1;visibility:visible;transition-delay:.18s,.18s,0s;translate:0}.panel .icon{border-radius:1.0625rem;block-size:4.5rem;inline-size:4.5rem;box-shadow:0 .5rem 1.5rem oklch(30% .05 300/.18)}.panel h1{font:var(--weight-strong) var(--step-4)/1.05 var(--font-display);letter-spacing:-.03em;margin:0}.panel p{color:var(--ink-2);max-inline-size:30ch;margin:0;font-size:1.125rem}.panel .row{flex-wrap:wrap;gap:.5rem;display:flex}.btn,.chip,.icon-btn{justify-content:center;align-items:center;gap:var(--space-2xs);font:var(--weight-ui) .9375rem/1 var(--font-text);letter-spacing:.005em;cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border:0;text-decoration:none;display:inline-flex}.btn{min-block-size:3rem;font-weight:var(--weight-strong);background:oklch(from var(--accent) min(l, .5) c h);color:oklch(100% 0 none);border-radius:999px;padding-inline:1.375rem}.btn.ghost{background:var(--pill);color:var(--ink);box-shadow:inset 0 0 0 1px var(--pill-line)}.btn.small{min-block-size:var(--target);padding-inline:1.125rem;font-size:.875rem}.chip{min-block-size:var(--target);background:var(--pill);color:var(--ink);box-shadow:inset 0 0 0 1px var(--pill-line);-webkit-backdrop-filter:blur(.625rem);backdrop-filter:blur(.625rem);border-radius:999px;padding-inline:.75rem 1rem;font-size:.875rem}.chip[aria-pressed=true]{background:var(--ink);color:oklch(98% 0 none);box-shadow:none}.icon-btn{inline-size:var(--target);block-size:var(--target);background:var(--pill);color:var(--ink);box-shadow:inset 0 0 0 1px var(--pill-line);border-radius:50%;flex:none;position:relative}.icon-btn:after{content:"";position:absolute;inset:min(0px,50% - 1.375rem)}.icon-btn:disabled{opacity:.35;cursor:default}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.btn:not(.skip):hover,.chip:hover{translate:0 -1px}.chip:not([aria-pressed=true]):hover{box-shadow:inset 0 0 0 1px var(--pill-line), 0 .375rem .875rem -.5rem oklch(25% .03 300/.4)}:is(.chip,.icon-btn:not(:disabled,[aria-disabled=true])) .ico{transition:transform var(--dur-state) var(--ease-out)}:is(.chip,.icon-btn:not(:disabled,[aria-disabled=true])):hover .ico{transform:translateY(-1px)scale(1.08)}.chip[data-shuffle]:hover .ico{transform:rotate(-14deg)scale(1.08)}}.ico{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex:none;block-size:1.25rem;inline-size:1.25rem}.chip .ico{block-size:1.125rem;inline-size:1.125rem}:is(.btn,.chip,.icon-btn:not(:disabled,[aria-disabled=true])):active{transform:scale(.97)}.btn,.chip,.icon-btn,.opts a,.navlinks a,.who{transition:background-color var(--dur-state) ease, color var(--dur-state) ease, box-shadow var(--dur-state) ease, opacity var(--dur-state) ease}@media (prefers-reduced-motion:no-preference){.btn,.chip,.icon-btn,.opts a,.navlinks a{transition:transform var(--dur-press) var(--ease-out), translate var(--dur-state) var(--ease-out), background-color var(--dur-state) ease, color var(--dur-state) ease, box-shadow var(--dur-state) ease, opacity var(--dur-state) ease}}@media (hover:hover) and (pointer:fine){.btn:hover{background:oklch(from var(--accent) min(calc(l + .05), .55) c h);box-shadow:0 .375rem 1rem -.375rem oklch(from var(--accent) min(l, .5) c h / .55)}.btn.ghost:hover{box-shadow:inset 0 0 0 1px var(--pill-line), 0 .375rem 1rem -.5rem oklch(25% .03 300/.35)}.btn.ghost:hover,.chip:not([aria-pressed=true]):hover,.icon-btn:not(:disabled,[aria-disabled=true]):hover{background:oklch(100% 0 none/.95)}}:is(.btn,.chip,.icon-btn,.opts a,.navlinks a,.who,.skip):focus-visible{outline:2px solid var(--ink);outline-offset:.1875rem}.chip:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:.1875rem}.who:focus-visible{outline-offset:-2px}.sr{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:clip}.sr ul{margin:0;padding:0;list-style:none}.sr li a{inline-size:max-content;min-block-size:var(--target);color:var(--ink);align-items:center;padding-inline:.25rem;display:flex}.sr:focus-within{clip-path:none;block-size:auto;inline-size:auto;z-index:9;background:oklch(100% 0 none);border-radius:.75rem;padding:.75rem;position:fixed;inset-block-start:5rem;inset-inline-start:var(--pad-s)}.nogl{text-align:center;place-items:center;padding:1.5rem;display:grid;position:fixed;inset:0}@media (width<=640px){.hint{max-inline-size:30ch;inset-block:4.625rem auto}.caption b{font-size:1.875rem}.panel{inline-size:100%;background:linear-gradient(transparent, var(--paper) 30%);align-content:end;padding-block-end:max(var(--gutter), env(safe-area-inset-bottom));inset-block:auto 0}.panel h1{font-size:2.5rem}.who b{font-size:1rem}.who span{font-size:.75rem}}@media (prefers-contrast:more){:root{--pill:oklch(100% 0 none);--pill-line:oklch(22% .02 300/.45);--ink-2:oklch(35% .02 300)}.chip,.opts a{-webkit-backdrop-filter:none;backdrop-filter:none}}@media (pointer:coarse){:root{--pill:oklch(100% 0 none/.9)}.chip,.opts a,.chrome>.bar{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}@media (prefers-reduced-motion:reduce){.caption,.caption[hidden],.panel,.panel.on{translate:none}}.hero .nogl{margin:var(--space-s) 0 0;text-align:start;color:var(--ink-2);max-inline-size:40ch;padding:0;display:block;position:static}.hero:has(.nogl){min-block-size:0;padding-block:calc(var(--header-h) + env(safe-area-inset-top,0px) + var(--space-l)) var(--space-l);align-content:start}body.scrolls{overscroll-behavior:auto;block-size:auto;overflow:visible}body.scrolls canvas.gl{touch-action:pan-y pinch-zoom;block-size:100lvh;inset:0 auto auto 0}body.scrolls{position:relative}.gl-clip{pointer-events:none;position:absolute;inset:0;overflow:clip}body.scrolls .gl-clip canvas.gl{pointer-events:auto;will-change:transform;block-size:calc(100vh * (1 + 2 * var(--gl-pad,0)));block-size:calc(100lvh * (1 + 2 * var(--gl-pad,0)));position:absolute;inset:0 auto auto 0}.hero{z-index:4;min-block-size:100svh;padding-inline:var(--pad-s) var(--pad-e);pointer-events:none;align-content:center;display:grid;position:relative}.hero h1{font:var(--weight-strong) var(--type-hero)/1.04 var(--font-display);letter-spacing:-.035em;font-variant-numeric:proportional-nums;text-wrap:balance;max-inline-size:11em;margin:0}.hero .lede{margin:var(--space-s) 0 0;max-inline-size:30ch;font-size:var(--step-1);color:var(--ink-2);text-wrap:pretty;line-height:1.45}.hero .lede a{pointer-events:auto;color:var(--ink);font-weight:var(--weight-strong);white-space:nowrap;text-underline-offset:.2em;text-decoration:underline;text-decoration-thickness:1.5px;-webkit-text-decoration-color:color-mix(in oklch, var(--ink) 35%, transparent);text-decoration-color:color-mix(in oklch, var(--ink) 35%, transparent);border-radius:.25rem;margin-block:-.25rem;padding-block:.25rem}.hero .lede a:after{content:"→";content:"→" / "";margin-inline-start:.3em;display:inline-block}.hero .lede a:focus-visible{outline:2px solid var(--ink);outline-offset:.1875rem;border-radius:.25rem}@media (hover:hover) and (pointer:fine){.hero .lede a{transition:text-decoration-color var(--dur-state) ease, text-decoration-thickness var(--dur-state) ease, text-underline-offset var(--dur-state) var(--ease-out)}.hero .lede a:hover{-webkit-text-decoration-color:var(--ink);text-decoration-color:var(--ink);text-underline-offset:.3em;text-decoration-thickness:2px}@media (prefers-reduced-motion:no-preference){.hero .lede a:after{transition:translate var(--dur-state) var(--ease-out)}.hero .lede a:hover:after{translate:.1875rem}}}.next{z-index:4;min-block-size:100svh;padding:6rem var(--gutter);background:var(--paper);border-block-start:1px solid var(--pill-line);align-content:center;gap:.75rem;display:grid;position:relative}.next h2{font:var(--weight-strong) var(--step-4)/1.05 var(--font-display);letter-spacing:-.03em;margin:0}.next p{color:var(--ink-2);max-inline-size:40ch;margin:0}body.grabbing,body.grabbing canvas.gl{cursor:grabbing}@media (prefers-reduced-motion:no-preference){.hero .play:not(.waiting){animation:hero-in .6s var(--ease-out) .65s both}@keyframes hero-in{0%{opacity:0;translate:0 .875rem}}}@media (width<=640px),(aspect-ratio<=4/5){.hero{align-content:start;padding-block-start:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(1rem, 2.5vh, 4rem))}.hero h1{font-size:var(--type-hero-stacked);max-inline-size:11em}.hero .lede{font-size:var(--step-0);max-inline-size:36ch;margin-block-start:var(--space-xs)}}@media (height<=540px) and (aspect-ratio>=4/3){.hero{align-content:center;justify-items:start;row-gap:var(--space-s);padding-block:calc(var(--header-h) + env(safe-area-inset-top,0px) + .25rem) max(.75rem, env(safe-area-inset-bottom,0px))}.hero h1{max-inline-size:11em;font-size:clamp(1.625rem,9svh,2.75rem)}.hero .lede{font-size:var(--step-0);max-inline-size:34ch;margin-block-start:var(--space-2xs)}.hero .play{max-inline-size:min(46ch,52vw);position:static;inset:auto}.hero .play-hint{max-inline-size:44ch}}@media (height<=540px) and (aspect-ratio>=4/3) and (pointer:coarse){.hero .play-hint{display:none}}