#box,#keys,canvas,.readout{display:none}#says{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}#chrome{padding:var(--edge);justify-content:space-between;display:flex}.corner,.label,.num,.readout .caption{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.08em;text-transform:uppercase;font-weight:400;line-height:1.6}.corner{text-decoration:none}.tr,.label span,.num time{opacity:var(--quiet)}a.tr:hover,a.tr:focus-visible{opacity:1}main{padding:0 var(--edge) calc(var(--edge) * 2)}h1{margin:0}h1 span{margin-left:1.2em}.essays{margin:0;padding:12svh 0;list-style:none}.essay{max-width:36rem;position:relative}.essay+.essay{margin-top:14svh}.num{margin:0 0 1.5em}.num b{color:var(--n);margin-right:1.2em;font-weight:400}h2{font-size:var(--fs-chapter);letter-spacing:-.028em;text-wrap:balance;margin:0 0 .5em;font-weight:400;line-height:.98}h2 a,h2 .t{text-decoration:none;display:block}h2 a:after{content:"";z-index:1;position:absolute;inset:-1rem}h2 a:focus-visible{outline:none}h2 a:focus-visible:after{outline:2px solid var(--blue)}h2 em{color:var(--n)}.sub{font-size:var(--fs-lead);text-wrap:balance;margin:0 0 .9em;font-style:italic;line-height:1.2}.deck{font-size:var(--fs-body);text-wrap:pretty;margin:0 0 1.8em;line-height:1.55}.meta{flex-wrap:wrap;justify-content:space-between;gap:.6em 2em;margin:0;display:flex}.meta .go{opacity:1;color:var(--n)}.go i{transition:transform .4s var(--ease);font-style:normal;display:inline-block}.essay:hover .go i,.essay:focus-within .go i{transform:translate(6px)}.essay:active .go i{transform:translate(10px)}.foot{flex-wrap:wrap;gap:.4em 2em;margin:0;display:flex}.js canvas{z-index:1;width:100%;height:100%;display:block;position:fixed;inset:0}.js #keys{inset:0 0 0 calc(var(--col) * 1%);z-index:1;pointer-events:none;outline-offset:-6px;display:block;position:fixed}.js #keys:focus-visible:after{content:"← → step · Enter hold · Esc let go";right:calc(var(--edge) + 6px);bottom:var(--edge);font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.08em;text-transform:uppercase;position:absolute}.js #chrome{z-index:4;pointer-events:none;padding:0;display:block;position:fixed;inset:0}.js .corner{top:var(--edge);pointer-events:auto;position:absolute}.js .tl{left:calc(var(--col) * 1% + var(--edge))}.js .tr{right:var(--edge)}.js main{z-index:2;width:calc(var(--col) * 1%);min-height:100svh;padding:var(--edge);flex-direction:column;display:flex;position:relative}.js .essays{flex-direction:column;flex:1;justify-content:center;display:flex}.js h2{font-size:min(var(--fs-chapter), (var(--col) * 1vw - 2 * var(--edge)) / 7.3)}.js .readout{left:calc(var(--col) * 1% + var(--edge));bottom:var(--edge);align-items:flex-end;gap:16px;margin:0;transition:opacity .4s;display:flex;position:absolute}.readout .figure{letter-spacing:-.045em;font-variant-numeric:lining-nums tabular-nums;font-size:clamp(3.75rem,7.8vw,7.5rem);line-height:.76}.readout .caption{letter-spacing:.06em;line-height:1.75}.readout b{color:var(--n);font-weight:400}.js .essay>:not(h2),.js .essay .t{animation:wipe 1s var(--ease) backwards}.js .essay .t{animation-delay:.1s}.js .essay>:nth-child(3){animation-delay:.24s}.js .essay>:nth-child(4){animation-delay:.36s}.js .essay>:nth-child(5){animation-delay:.48s}@keyframes wipe{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0 0 -20%)}}@media (width<=900px) and (height>=500px),(aspect-ratio<=1){.js canvas{z-index:3;height:var(--box)}.js #box{z-index:3;height:var(--box);background:var(--paper);border-bottom:1px solid color-mix(in srgb, var(--ink) 16%, transparent);display:block;position:fixed;inset:0 0 auto}.js #keys{height:var(--box);z-index:3;inset:0 0 auto}.js #keys:focus-visible:after{bottom:10px;right:14px}.js main{width:auto;min-height:100svh;padding-top:calc(var(--box) + 5svh)}.js .essays{justify-content:flex-start;padding:6svh 0 9svh}.js h2{font-size:9.5vw}.js .tl{top:12px;left:14px}.js .tr{top:12px;right:14px}.js .readout{left:14px;top:calc(var(--box) - 58px);gap:10px;bottom:auto}.readout .figure{font-size:2.75rem}.readout .caption{font-size:.59375rem}}@media (prefers-reduced-motion:reduce){.js .essay>*,.js .essay .t{animation:none}.js .readout,.go i{transition:none}}
