.blog{padding:7rem var(--g) clamp(4rem, 8vw, 7rem)}.blog-head{gap:1.5rem;max-width:70rem;padding:clamp(2rem,6vw,5rem) 0 clamp(2.5rem,5vw,4.5rem);display:grid}.blog-head .label a{color:var(--ink)}.blog-head .label a:hover{color:var(--accent)}.article .blog-head h1{font-size:clamp(2.5rem,6.4vw,5.75rem);line-height:.96}@media (min-width:900px){.posts .case{grid-template-columns:8rem 1fr 7rem 5rem}}.posts h2{max-width:22ch;margin-bottom:1rem;font-size:clamp(1.9rem,3.6vw,3.4rem);line-height:1}.posts .body{margin-bottom:1rem}.posts .case>.label:nth-last-child(-n+2){text-align:right}.posts a.case:hover h2{color:var(--bg)}.article-grid{gap:3rem var(--g);border-top:1px solid var(--line);padding-top:clamp(2rem,4vw,3.5rem);display:grid}.toc{display:none}@media (min-width:1100px){.article-grid{grid-template-columns:14rem minmax(0,54rem)}.toc{align-self:start;max-height:calc(100svh - 8rem);display:block;position:sticky;top:6.5rem;overflow-y:auto}.toc ol{border-left:1px solid var(--line);gap:.7rem;margin-top:1.25rem;padding-left:1rem;display:grid}.toc a{color:var(--mute);font-size:.88rem;line-height:1.35;transition:color .2s;display:block}.toc a:hover{color:var(--accent)}}.prose{min-width:0;font-size:1.0625rem;line-height:1.7}.prose>*{max-width:68ch}.prose>*+*{margin-top:1.4rem}.prose>p:first-child{font-size:clamp(1.15rem,1.5vw,1.3rem);line-height:1.55}.prose h2{border-top:1px solid var(--line);margin-top:4.5rem;padding-top:1.5rem;scroll-margin-top:6rem;font-size:clamp(2rem,3.4vw,3rem);line-height:1}.prose h3{margin-top:2.75rem;scroll-margin-top:6rem;font-size:1.6rem;line-height:1.1}.prose h4{font:500 .72rem/1.4 var(--mono), monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-top:2.25rem}.prose :is(h2,h3,h4) a{color:inherit;text-decoration:none}.prose :is(p,li,td) a{text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:.2em}.prose a:hover{color:var(--accent)}.prose strong{font-weight:600}.prose :is(ul,ol){gap:.6rem;padding-left:1.4rem;display:grid}.prose ul{list-style:square}.prose ol{list-style:decimal}.prose li::marker{color:var(--accent);font-family:var(--mono), monospace;font-size:.8em}.prose li>:is(ul,ol){margin-top:.6rem}.prose blockquote,.callout{border-left:1px solid var(--accent);color:var(--mute);padding-left:1.25rem}.prose hr{border:0;border-top:1px solid var(--line);margin-block:3rem}.prose img{max-width:100%;height:auto}.prose code{font:.86em var(--mono), monospace}.prose :not(pre)>code{background:var(--surface);border:1px solid var(--line);overflow-wrap:anywhere;padding:.12em .38em}.prose pre{background:var(--surface);border:1px solid var(--line);tab-size:2;--sh-class:#ede6da;--sh-identifier:#ede6da;--sh-sign:#8f877b;--sh-property:#d9b88f;--sh-entity:#f08a5d;--sh-jsxliterals:#d9b88f;--sh-string:#b8c48f;--sh-keyword:#e4572e;--sh-comment:#6f685e;max-width:none;padding:1.25rem 1.4rem;font-size:.9rem;line-height:1.6;overflow-x:auto}.table{max-width:none;overflow-x:auto}.prose table{border-collapse:collapse;width:100%;font-size:.95rem}.prose th{font:500 .72rem/1.4 var(--mono), monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);text-align:left}.prose :is(th,td){border-bottom:1px solid var(--line);vertical-align:top;padding:.85rem 1rem .85rem 0}.takeaways{border:1px solid var(--line);background:linear-gradient(var(--accent), var(--accent)) 0 0 / 14px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) 0 0 / 1px 14px no-repeat, linear-gradient(var(--accent), var(--accent)) 100% 100% / 14px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) 100% 100% / 1px 14px no-repeat, var(--surface);padding:1.5rem}.takeaways .label{color:var(--accent);margin-bottom:1rem}.faq{border-bottom:1px solid var(--line)}.faq-item{border-top:1px solid var(--line);padding-block:1.5rem}.prose .faq-item h3{margin:0 0 .75rem}.faq-item>*+*{margin-top:1rem}.explainer{border:1px solid var(--line);background:var(--surface);max-width:none;margin-block:3rem;display:grid}.ex-stage{background:var(--bg);border-bottom:1px solid var(--line);padding:clamp(.75rem,3vw,2rem)}.ex-stage svg{width:100%;max-width:30rem;height:auto;margin-inline:auto;display:block;overflow:visible}.ex-side{flex-direction:column;gap:1.25rem;min-width:0;padding:clamp(1.1rem,3vw,2rem);display:flex}.explainer figcaption{justify-content:space-between;gap:1rem;display:flex}.ex-count{color:var(--ink);white-space:nowrap}.prose .ex-steps{gap:1.5rem;padding:0;list-style:none;display:grid}.ex-steps li{align-content:start;gap:.5rem;display:grid}.ex-steps strong{font:400 clamp(1.7rem, 2.6vw, 2.3rem) / 1 var(--serif), serif;letter-spacing:-.02em}.ex-steps p{color:var(--mute);font-size:.98rem;line-height:1.6}.ex-controls{display:none}@media (min-width:820px){.explainer{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.ex-stage{border-bottom:0;border-right:1px solid var(--line)}}.explainer svg text{font:500 10px var(--mono), monospace;letter-spacing:.08em;fill:var(--ink);transition:fill .4s}.explainer svg .sub,.explainer svg .note text,.explainer svg .status text{fill:var(--mute);font-size:8px}.explainer svg .node rect{fill:var(--surface);stroke:#5a534a;transition:stroke .4s,fill .4s}.explainer svg .status rect{fill:var(--mute);transition:fill .4s}.explainer svg .wire{fill:none;stroke:#5a534a;transition:stroke .4s}.explainer svg .flow{fill:none;stroke:var(--accent);stroke-width:3px;stroke-linecap:round;stroke-dasharray:.1 13;opacity:0;transition:opacity .4s}.explainer[data-ready] .ex-steps>li{visibility:hidden;opacity:0;transition:opacity .45s var(--ease), transform .45s var(--ease), visibility 0s .45s;grid-area:1/1;transform:translateY(8px)}.explainer[data-ready] .ex-steps>li[data-current]{visibility:visible;opacity:1;transition-delay:0s;transform:none}.explainer[data-ready] .ex-side{justify-content:space-between}.explainer[data-ready] .ex-controls{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:auto;display:flex}.ex-ticks{flex:1 0 100%;gap:4px;margin-bottom:.75rem;display:flex}.ex-ticks button{background:linear-gradient(var(--line), var(--line)) center / 100% 2px no-repeat;cursor:pointer;border:0;flex:1;height:1.5rem}.ex-ticks button:hover{background-image:linear-gradient(var(--mute), var(--mute))}.ex-ticks button[aria-current]{background-image:linear-gradient(var(--accent), var(--accent))}.ex-controls>button{border:1px solid var(--line);color:var(--ink);cursor:pointer;white-space:nowrap;background:0 0;flex:1;padding:.85rem .5rem;transition:border-color .2s,color .2s,background .2s}.ex-controls>button:hover{border-color:var(--accent);color:var(--accent)}.ex-controls>button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--bg)}.explainer[data-ready] svg text{fill:#7d7468}.explainer[data-ready] svg .node rect,.explainer[data-ready] svg .wire{stroke:#4a443d}.explainer[data-ready] svg .status rect{fill:#4a443d}.explainer[data-ready] svg [data-done] text,.explainer[data-ready] svg text[data-done]{fill:var(--mute)}.explainer[data-ready] svg [data-done] rect,.explainer[data-ready] svg .wire[data-done]{stroke:var(--mute)}.explainer[data-ready] svg .status[data-done] rect{fill:var(--ink);stroke:none}.explainer[data-ready] svg [data-on] text,.explainer[data-ready] svg text[data-on]{fill:var(--ink)}.explainer[data-ready] svg .node[data-on] rect{stroke:var(--accent);fill:color-mix(in srgb, var(--accent) 12%, var(--surface))}.explainer[data-ready] svg .wire[data-on]{stroke:color-mix(in srgb, var(--accent) 45%, var(--line))}.explainer[data-ready] svg .status[data-on] rect{fill:var(--accent)}.explainer[data-ready] svg .flow[data-on]{opacity:1;animation:.9s linear infinite ex-flow}@keyframes ex-flow{0%{stroke-dashoffset:13.1px}to{stroke-dashoffset:0}}.ex-hint{text-align:center;margin-top:1rem;display:none}.explainer[data-ready] .ex-hint{display:block}.explainer[data-ready] svg [data-step]:not(.flow){cursor:pointer}.explainer[data-ready] svg .node:not([data-on]):hover rect{stroke:var(--ink)}.explainer[data-ready] svg .node[data-on] rect{animation:ex-pop .6s var(--ease)}.explainer[data-ready] svg .status[data-on] rect{animation:1.2s steps(2,jump-none) infinite ex-blink}@keyframes ex-pop{0%{stroke-width:5px;fill:color-mix(in srgb, var(--accent) 45%, var(--surface))}}@keyframes ex-blink{to{opacity:.35}}@media (prefers-reduced-motion:reduce){.explainer svg *{animation:none!important}}.ex-stage>:not(svg){max-width:30rem;margin-inline:auto}.viz-text{align-content:start;gap:.75rem;display:grid}.viz-text strong{font:400 clamp(1.7rem, 2.6vw, 2.3rem) / 1 var(--serif), serif;letter-spacing:-.02em}.viz-text p{color:var(--mute);font-size:.98rem;line-height:1.6}.viz-text p+p{font-size:.88rem}.viz-controls{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:auto;display:flex}.viz-controls>span{flex:1 0 100%;margin-top:.5rem}.viz-controls>button{border:1px solid var(--line);color:var(--ink);cursor:pointer;white-space:nowrap;background:0 0;flex:1;padding:.85rem .5rem;transition:border-color .2s,color .2s,background .2s}.viz-controls>button:hover{border-color:var(--accent);color:var(--accent)}.viz-controls>button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--bg)}.viz-controls>button:disabled{opacity:.35;cursor:not-allowed}.viz-controls input[type=range]{accent-color:var(--accent);cursor:ew-resize;flex:1 0 100%;height:2rem}.term{border:1px solid var(--line);background:var(--surface);min-height:15rem;font:.78rem/1.7 var(--mono), monospace;overflow-wrap:anywhere;text-align:left;padding:1.1rem 1.2rem}.term>div+div{margin-top:1rem}.term-cmd span{color:var(--accent)}.term-out{color:var(--mute)}.explainer[data-ready] .term>div{cursor:pointer}.explainer[data-ready] .term>:not([data-on],[data-done]){display:none}.explainer[data-ready] .term>[data-done]{opacity:.55}.explainer[data-ready] .term>[data-on] .term-cmd{animation:.8s steps(24,end) both term-type}.explainer[data-ready] .term>[data-on] .term-cmd:after{content:"▍";color:var(--accent);animation:1s steps(2,jump-none) infinite ex-blink}.explainer[data-ready] .term>[data-on] .term-out{animation:.3s both term-out}@keyframes term-type{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes term-out{0%{opacity:0;transform:translateY(4px)}}.bars{text-align:left;gap:1.75rem;display:grid}.bars>div{gap:.9rem;display:grid}.bars>div>.label{color:var(--ink)}.bar-row{gap:.35rem;display:grid}.bar-track{border:1px solid var(--line);background:var(--surface);height:1.4rem;display:flex}.bar-track i{transform-origin:0;display:block}.bars i[data-kind=used]{background:#5a534a}.bars i[data-kind=kept]{box-shadow:inset 0 0 0 1px var(--mute);background:repeating-linear-gradient(135deg,#0000 0 5px,#8f877b55 5px 6px)}.bars i[data-kind=lost]{background:var(--accent)}.bar-note{font:.72rem/1.4 var(--mono), monospace;color:var(--mute)}.bars-key{flex-wrap:wrap;gap:.4rem 1.2rem;display:flex}.bars-key span{white-space:nowrap}.bars-key i[data-kind]{vertical-align:-1px;width:.7rem;height:.7rem;display:inline-block}.explainer[data-ready] .bars>div:not([data-on]){display:none}.explainer[data-ready] .bars>[data-on] .bar-track i{animation:bar-grow .7s var(--ease) both}.explainer[data-ready] .bars>[data-on] .bar-track i+i{animation-delay:.35s}@keyframes bar-grow{0%{transform:scaleX(0)}}.band{gap:.6rem;display:grid}.band-ends{justify-content:space-between;gap:1rem;display:flex}.band-track{border:1px solid var(--line);background:color-mix(in srgb, var(--accent) 16%, var(--surface));height:3.5rem;position:relative}.band-track i{width:var(--p);background:repeating-linear-gradient(135deg, var(--surface) 0 7px, #2a2622 7px 8px);border-right:2px solid var(--accent);transition:width .25s var(--ease);position:absolute;inset:0 auto 0 0}.band-track b{background:var(--ink);width:2px;position:absolute;inset:0 0 0 auto}.band-floor{margin-left:clamp(0%, calc(var(--p) - 3rem), calc(100% - 6.5rem));color:var(--accent);white-space:nowrap;transition:margin .25s var(--ease);justify-self:start}.readout{background:var(--line);border:1px solid var(--line);grid-template-columns:1fr 1fr;gap:1px;margin-top:1.5rem;display:grid}.readout>div{background:var(--bg);gap:.5rem;padding:1rem;display:grid}.readout dd{font:400 clamp(1.9rem, 4vw, 2.6rem) / 1 var(--serif), serif;font-variant-numeric:tabular-nums}.readout small{font:500 .72rem var(--mono), monospace;color:var(--mute)}.code{border:1px solid var(--line);background:var(--surface);font:.78rem/1.9 var(--mono), monospace;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;padding:1.1rem 1.2rem}.code .label{margin-bottom:.3rem}.code .label:not(:first-child){margin-top:1.1rem}.code-call{color:var(--ink)}.code-off,.code-revert{color:var(--mute)}.code [data-run]{border-left:2px solid var(--accent);color:var(--ink);background:color-mix(in srgb, var(--accent) 14%, transparent);animation:code-run .5s var(--ease);margin-inline:-1.2rem;padding-inline:calc(1.2rem - 2px) 1.2rem}.code-revert{margin-top:1.1rem}.code-revert[data-run]{color:var(--accent)}@keyframes code-run{0%{background:color-mix(in srgb, var(--accent) 55%, transparent)}}@media (prefers-reduced-motion:reduce){.explainer *{transition:none!important;animation:none!important}}.author{gap:2rem var(--g);border-block:1px solid var(--line);align-items:end;margin-top:clamp(4rem,9vw,8rem);padding-block:clamp(2rem,4vw,3.5rem);display:grid}.author h2{margin-bottom:1.25rem;font-size:clamp(2.2rem,4.6vw,4.25rem)}.author img{border:1px solid var(--line);width:7rem;height:auto;margin-top:1rem;display:block}.author .cta{flex-wrap:wrap}@media (min-width:1100px){.author{grid-template-columns:14rem minmax(0,1fr) auto;align-items:start}.author .cta{flex-direction:column;align-items:flex-start;max-width:20rem}}.pager{background:var(--line);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;gap:1px;display:grid}.pager>*{background:var(--bg);align-content:start;gap:.75rem;padding:clamp(1.5rem,3vw,2.5rem) 0;transition:color .3s;display:grid}.pager>:last-child{text-align:right;padding-left:clamp(1rem,3vw,2.5rem)}.pager>:first-child{padding-right:clamp(1rem,3vw,2.5rem)}.pager strong{font:400 clamp(1.3rem, 2.4vw, 2.1rem) / 1.05 var(--serif), serif;letter-spacing:-.02em;text-wrap:balance}.pager a:hover{color:var(--accent)}@media (max-width:899px){.posts .case>.label:nth-last-child(-n+2){text-align:left}.posts .case>.label:last-child{text-align:right}.pager{grid-template-columns:1fr}.pager>*{text-align:left!important;padding-inline:0!important}.pager>span:empty{display:none}}
