.article-ink{margin-block:2.5rem}.article-ink>svg{aspect-ratio:544/240;width:100%;height:auto;display:block}.article-ink figcaption{color:var(--muted-foreground);font-size:var(--type-small);line-height:var(--type-small-leading);text-align:center;margin-top:.5rem}@media (prefers-reduced-motion:no-preference){.article-ink[data-ink-revealing] .article-ink-mark{-webkit-mask:var(--ink-mask);mask:var(--ink-mask)}.article-ink[data-ink-revealing] .article-ink-trace{stroke-dasharray:1;animation:article-ink-draw .5s var(--expo-out) both}.article-ink[data-ink-revealing] :is(.article-ink-dot,[data-ink-companion]){animation:article-ink-arrive .5s var(--expo-out) both}}@keyframes article-ink-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes article-ink-arrive{0%,20%{opacity:0}to{opacity:1}}.dark .article-ink [fill=\#292724]{fill:#d6d3cf}.dark .article-ink [fill=\#b45b32]{fill:#df956b}.article-drawing{width:100%}.drawing-sheet-scroll[data-pannable]{scrollbar-width:thin;scrollbar-color:var(--muted-foreground) transparent;overflow-x:auto}.article-drawing-sheet{display:flow-root;position:relative}.article-drawing-sheet[data-drawing] [data-blog-ink]{visibility:hidden}.article-drawing-sheet[data-ink-theme]{background:var(--background);color:var(--foreground)}.article-drawing-sheet[data-ink-theme=dark]{--background:var(--color-neutral-950);--foreground:var(--color-neutral-50);--muted-foreground:var(--color-neutral-400);--muted:var(--color-neutral-900);--border:var(--color-neutral-800)}.article-drawing-sheet[data-ink-theme=light]{--background:var(--color-neutral-50);--foreground:var(--color-neutral-950);--muted-foreground:var(--color-neutral-700);--muted:var(--color-neutral-100);--border:var(--color-neutral-200)}.drawing-notice{font-size:var(--type-small);color:var(--muted-foreground);margin-block:1rem;display:block}.article-back{min-height:48px;font-size:var(--type-small);color:var(--muted-foreground);align-items:center;gap:.5rem;display:inline-flex}.article-contents{font-size:var(--type-small);line-height:var(--type-small-leading);color:var(--muted-foreground)}.article-contents-desktop{display:none}.article-contents-mobile{border-block:1px solid var(--border);margin-block:.5rem;padding-block:1rem}.article-contents ol{flex-direction:column;gap:.5rem;display:flex}.article-contents-link{transition:color .1s var(--control-ease);text-decoration:none;display:block}.article-contents-mobile .article-contents-link{align-items:center;min-height:48px;display:flex}.article-contents-link:is(:hover,:focus-visible,[aria-current=location]){color:var(--foreground)}.article-contents-link:focus-visible,.article-contents-title:focus-visible{outline:var(--focus-width) solid var(--ring);outline-offset:4px}.article-contents-text{display:block}.article-contents-title{color:var(--muted-foreground);text-align:left;opacity:0;pointer-events:none;transition:color .4s var(--control-ease), opacity .4s var(--control-ease);padding-bottom:1rem;display:block}.article-contents-title:is(:hover,:focus-visible),.article-contents-title[aria-current=location]{color:var(--foreground)}.article-contents[data-scrolled=true] .article-contents-title{opacity:1;pointer-events:auto}.article-signoff{border-top:1px solid var(--border);font-size:var(--type-small);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:3rem;padding-block:1.5rem;display:flex}@media (min-width:67.5rem){.article-contents-desktop{max-width:10rem;display:block;position:fixed;top:8.625rem;left:5rem}.article-contents-mobile{display:none}}@media (prefers-reduced-motion:no-preference){html:has(#article){scroll-behavior:smooth}}.blog-prose :is(ul,ol){padding-left:1.5rem}.blog-prose ul{list-style:outside}.blog-prose ol{list-style:decimal}.blog-prose li+li{margin-top:.5rem}.blog-prose blockquote{border-left:2px solid var(--border);font-family:var(--font-serif);font-size:var(--type-body);font-weight:var(--weight-serif);line-height:var(--type-body-leading);letter-spacing:0;color:var(--muted-foreground);padding-left:1rem}.blog-prose blockquote :is(strong,b){font-weight:var(--weight-serif);color:var(--foreground)}.blog-prose pre{background:var(--muted);padding:1rem;overflow-x:auto}.blog-prose code{font-size:.875em}.blog-prose figure{margin-block:2.5rem}.blog-prose figure img{aspect-ratio:auto 3/2;object-fit:contain;width:min(100%,26rem);height:auto;margin-inline:auto;display:block}.article-draft{border-block:1px solid var(--border);padding-block:1rem}.article-body>*+*{margin-top:var(--page-paragraph-gap)}.article-body>.article-playground{font-size:var(--type-body);margin-block:2.5rem;line-height:1.45}.article-demo-muted{color:var(--muted-foreground)}.article-demo-range{grid-template-columns:1fr auto;align-items:center;gap:.5rem 1rem;display:grid}.article-demo-range [data-slot=slider]{grid-column:1/-1}.article-demo-value{font-size:var(--type-small);font-variant-numeric:tabular-nums;color:var(--muted-foreground)}.article-spacing-sample{background:var(--muted);transition:gap .24s var(--expo-out);flex-direction:column;padding:1.5rem;display:flex}.article-spacing-sample p+p{margin-top:8px}.article-demo-sheet{justify-items:start;gap:1rem;padding-block:1rem;display:grid}.article-playground .experiment-button[aria-pressed=true]{border-color:var(--foreground);background:var(--muted)}.article-playground .experiment-button{align-items:center;gap:.5rem;max-width:100%;display:inline-flex}.article-motion-track{background:var(--muted);padding:2rem 1rem;overflow:hidden}.article-motion-travel{width:calc(100% - 32px);transition:transform var(--demo-duration) var(--expo-out)}.article-motion-travel[data-right=true]{transform:translate(100%)}.article-motion-shape{border:1px solid var(--foreground);background:var(--background);width:32px;height:32px;transform:scale(calc(1 + var(--demo-energy) * .08)) rotate(calc(var(--demo-energy) * 15deg));transition:transform .24s var(--expo-out);display:block}.article-arrow-left{transform:rotate(180deg)}.article-undo-status{flex-wrap:wrap;align-items:center;gap:1rem;min-height:48px;display:flex}@media (prefers-reduced-motion:reduce){.article-contents-link,.article-contents-desktop .article-contents-link,.article-contents-desktop .article-contents-link:before,.article-contents-desktop .article-contents-text,.article-spacing-sample,.article-motion-travel,.article-motion-shape{transition:none}.article-motion-shape{transform:none}}.blog-prose figcaption{font-size:var(--type-small);line-height:var(--type-small-leading);color:var(--muted-foreground);text-align:center;text-wrap:pretty;margin-top:1rem}.blog-prose{position:relative}.blog-prose .sidenote{border-left:2px solid var(--border);color:var(--muted-foreground);font-family:var(--font-handwriting);letter-spacing:0;margin-left:1rem;padding-left:.75rem;font-size:18px;font-weight:400;line-height:20px}@media (min-width:68.75rem){.blog-prose .sidenote{border-left:0;width:12rem;margin-left:0;padding-left:0;position:absolute;left:calc(100% + 1.5rem)}.article-drawing-sheet[data-drawing] .blog-prose .sidenote{border-left:2px solid var(--border);width:auto;margin-left:1rem;padding-left:.75rem;position:static}}