:root{--chalk-grain:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2764%27%20height%3D%2764%27%3E%3Cfilter%20id%3D%27chalk%27%20x%3D%270%27%20y%3D%270%27%20width%3D%27100%25%27%20height%3D%27100%25%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%27.9%27%20numOctaves%3D%273%27%20seed%3D%2717%27%20stitchTiles%3D%27stitch%27%20result%3D%27noise%27%2F%3E%3CfeColorMatrix%20in%3D%27noise%27%20type%3D%27matrix%27%20values%3D%270%200%200%200%201%200%200%200%200%201%200%200%200%200%201%204%200%200%200%20-1.25%27%2F%3E%3C%2Ffilter%3E%3Cpath%20fill%3D%27white%27%20filter%3D%27url%28%23chalk%29%27%20d%3D%27M0%200h64v64H0z%27%2F%3E%3C%2Fsvg%3E);--chalk-rule:var(--pencil-line-mask) center / 100% 100% no-repeat intersect, var(--chalk-grain) top left / 64px 64px repeat;--pencil-grain:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2764%27%20height%3D%2764%27%3E%3Cdefs%3E%3Cfilter%20id%3D%27tooth%27%20x%3D%270%27%20y%3D%270%27%20width%3D%27100%25%27%20height%3D%27100%25%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%27.85%27%20numOctaves%3D%273%27%20seed%3D%277%27%20stitchTiles%3D%27stitch%27%20result%3D%27noise%27%2F%3E%3CfeColorMatrix%20in%3D%27noise%27%20type%3D%27matrix%27%20values%3D%270%200%200%200%201%200%200%200%200%201%200%200%200%200%201%202.4%200%200%200%20-.45%27%20result%3D%27grain%27%2F%3E%3CfeComposite%20in%3D%27SourceGraphic%27%20in2%3D%27grain%27%20operator%3D%27in%27%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%27white%27%20filter%3D%27url%28%23tooth%29%27%20d%3D%27M0%200h64v64H0z%27%2F%3E%3C%2Fsvg%3E);--pencil-line-mask:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20320%208%27%20preserveAspectRatio%3D%27none%27%3E%3Cg%20fill%3D%27white%27%3E%3Cpath%20d%3D%27M2%204.4C44%203.2%20112%203.1%20164%203.3S274%203.2%20318%204.2C271%204.7%20225%204.9%20168%204.8S50%205%202%204.4Z%27%2F%3E%3Cpath%20d%3D%27M15%205.4Q158%205%20303%205.2%27%20fill%3D%27none%27%20stroke%3D%27white%27%20stroke-width%3D%27.35%27%20opacity%3D%27.35%27%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);--pencil-rule:var(--pencil-line-mask) center / 100% 100% no-repeat intersect, var(--pencil-grain) top left / 64px 64px repeat}.pencil-mark,.pencil-outline,.chalk-outline{-webkit-mask-image:var(--pencil-grain);-webkit-mask-image:var(--pencil-grain);mask-image:var(--pencil-grain);pointer-events:none;-webkit-mask-size:64px 64px;mask-size:64px 64px}.pencil-outline,.chalk-outline{border-radius:inherit;opacity:.72;border:1.5px solid;position:absolute;inset:0}.pencil-outline:after{content:"";border-radius:inherit;opacity:.24;border:.5px solid;position:absolute;inset:-.4px .3px .4px -.3px}.chalk-outline{opacity:.85;-webkit-mask-image:var(--chalk-grain);-webkit-mask-image:var(--chalk-grain);mask-image:var(--chalk-grain);border-width:2px}.chalk-outline:after{content:"";border-radius:inherit;opacity:.3;border:1px solid;position:absolute;inset:-.8px .5px .6px -.5px}.pencil-line{-webkit-mask:var(--pencil-rule);-webkit-mask:var(--pencil-rule);mask:var(--pencil-rule);pointer-events:none;background:currentColor}@media (forced-colors:active){.pencil-mark,.pencil-outline,.chalk-outline,.pencil-line{opacity:1;-webkit-mask:none;mask:none}.pencil-line{forced-color-adjust:none;background:canvastext;height:1px}}:root{--box:min(84vw, 40rem, 72svh);--rise:9svh;--shift:0px;--shrink:.6;--under:calc(50svh - var(--rise) + var(--box) * .19 * var(--shrink))}.story{position:relative}.corner{z-index:2;text-underline-offset:.18em;font-weight:550;text-decoration-thickness:1px;transition:opacity .3s;position:fixed;top:1.25rem;right:1.5rem}.actor{background:linear-gradient(var(--paper) var(--under), transparent calc(var(--under) + 2rem));pointer-events:none;z-index:1;height:100svh;margin-bottom:-100svh;position:sticky;top:0}.bot{width:var(--box);aspect-ratio:1;animation:.8s ease-out both arrive;position:absolute;top:50%;left:50%;translate:-50% -50%}.awake .bot{transform:translate(calc(var(--x) * var(--shift)), calc(-1 * var(--rise))) scale(var(--shrink))}@keyframes arrive{0%{opacity:0}}.face{width:100%;height:100%;display:block;overflow:visible}.head{fill:var(--fill);stroke:var(--line);stroke-width:6px}.pupil{fill:var(--line)}.lid{fill:none;stroke:var(--line);stroke-width:5px;stroke-linecap:round}.glasses{fill:none;stroke:var(--line);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.hat{stroke:var(--line);stroke-width:2.5px;stroke-linejoin:round}.marks{fill:none;stroke:var(--ink);stroke-width:2.8px;stroke-linecap:round;stroke-linejoin:round}.mark{opacity:0;transition:opacity .4s}.mark path{stroke-dasharray:1 1;stroke-dashoffset:1px;transition:stroke-dashoffset .35s ease-out}.mark.on{opacity:1;transition-duration:.1s}.mark.on path{stroke-dashoffset:0}.mark path:nth-child(2){transition-delay:80ms}.mark path:nth-child(3){transition-delay:.16s}.mark path:nth-child(4){transition-delay:.24s}.zzz.on path{animation:1.9s ease-out both drift}.zzz.on path:nth-child(2){animation-delay:.35s}.zzz.on path:nth-child(3){animation-delay:.7s}@keyframes drift{0%{opacity:0;translate:-6px 8px}30%{opacity:1}}.waves.on path{animation:.8s ease-in-out infinite alternate pulse}.waves.on path:nth-child(2n){animation-delay:.4s}@keyframes pulse{to{opacity:.25}}.step{height:100svh;padding:calc(var(--under) + 3.5rem) 1.25rem 0;flex-direction:column;align-items:center;display:flex}.say{text-align:center;max-width:38rem;opacity:var(--seen,1)}h1,h2{font-family:var(--font-display);letter-spacing:-.02em;text-wrap:balance;margin:0 0 .45em;font-size:clamp(2rem,5.4vw,3.6rem);font-weight:600;line-height:1.04}p{max-width:30rem;color:var(--muted);text-wrap:pretty;margin:0 auto;font-size:clamp(1.05rem,1.7vw,1.25rem);line-height:1.5}p a{text-underline-offset:.18em;text-decoration-thickness:1px}.js .step:first-of-type:not(.spoken) .say{visibility:hidden}.actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1.5rem;margin-top:2rem;display:flex}.button{color:var(--muted);order:1;padding:.85em 0;font-weight:550;text-decoration:none}.actions:not(.linux) .mac,.actions.linux .linux{background:var(--ink);color:var(--paper);border-radius:999px;order:0;padding:.85em 1.5em}.button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}@media (width<=40rem){:root{--shrink:.72}}@media (width>=50rem){:root{--rise:0px;--shift:min(25vw, 17rem)}.actor{background:0 0}.step{grid-template-columns:repeat(2, calc(2 * var(--shift)));justify-content:center;align-items:center;padding:0;display:grid}.say{text-align:start;padding:0 2rem}.step:nth-of-type(2n) .say{grid-column:2}p{margin:0}.actions{justify-content:start}}@media (prefers-reduced-motion:reduce){.bot{animation:none}}
