.article-shell{background:var(--bg);grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);width:100%;min-height:100dvh;display:grid}.article-page{--g:1.5rem;--col:calc((100cqw - 11 * var(--g)) / 12);--measure:34rem;--section-gap:4.5rem;--media-gap:3rem;width:100%;max-width:1600px;padding:0 var(--page-gutter);margin-inline:auto;container-type:inline-size}.article-page-hero{column-gap:var(--g);grid-template-columns:repeat(12,minmax(0,1fr));padding-top:4.5rem;display:grid}.article-page-meta{padding-right:var(--g);font-size:var(--text-xs);font-weight:var(--weight-regular);letter-spacing:var(--tracking-meta);color:var(--fg-muted);flex-wrap:wrap;grid-area:1/1/auto/span 3;align-self:baseline;align-items:baseline;column-gap:.5rem;line-height:1.4;display:flex}.article-page-category,.article-page-meta-secondary,.article-page-meta-separator{font-size:var(--text-xs);font-weight:var(--weight-regular);letter-spacing:var(--tracking-meta);color:var(--fg-muted);line-height:1.4}.article-page-meta-secondary{font-variant-numeric:tabular-nums}.article-page-meta-separator{opacity:.5}.article-page-title{min-width:0;font-size:var(--text-title);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);text-wrap:balance;overflow-wrap:break-word;color:var(--fg);grid-area:1/4/auto/span 8;align-self:baseline}.article-page-description{min-width:0;max-width:34rem;font-size:var(--text-prose);font-weight:var(--weight-medium);letter-spacing:var(--tracking-prose);line-height:var(--leading-prose);text-wrap:pretty;color:var(--fg);grid-column:4/-1;margin-top:1.5rem}.article-page-body{animation:fadeIn var(--duration-enter) var(--ease-out) 80ms both;margin-top:3rem;position:relative}.article-page .article-prose{column-gap:var(--g);max-width:none;font-size:var(--text-prose);font-weight:var(--weight-medium);line-height:var(--leading-prose);letter-spacing:var(--tracking-prose);color:var(--fg);overflow-wrap:break-word;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;display:grid}.article-prose>*{grid-column:4/span 6;min-width:0;margin-top:1rem}.article-prose>:is(p,ul,ol,blockquote){max-width:var(--measure);text-wrap:pretty}.article-prose>h2{margin-top:var(--section-gap);padding-right:var(--g);font-size:var(--text-prose);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-prose);line-height:var(--leading-prose);text-wrap:balance;color:var(--fg);grid-column:1/span 3;scroll-margin-top:1.5rem}.article-prose>h2+*{margin-top:var(--section-gap)}.article-prose>h3{font-size:var(--text-prose);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight);text-wrap:balance;color:var(--fg);margin-top:2rem;line-height:1.4}.article-prose>h3+*{margin-top:.5rem}.article-prose>:is(figure,.demo-frame,hr){grid-column:4/-1;max-width:none}.article-prose>:is(figure,.demo-frame,.prose-callout,hr){margin-top:var(--media-gap);margin-bottom:0}.article-prose>:is(figure,.demo-frame,.prose-callout,hr)+:not(h2){margin-top:var(--media-gap)}.article-prose>h2+:is(figure,.demo-frame){margin-top:var(--section-gap)}.article-prose>:first-child,.article-prose>h2:first-child+*{margin-top:0}.article-prose>:is(ul,ol){padding-left:1.25rem}.article-prose>:is(ul,ol)>li+li{margin-top:.5rem}.article-prose>:is(ul,ol)>li::marker{color:var(--fg-muted)}.article-prose :where(a:not(.demo-frame *)){color:inherit;text-decoration-line:underline;-webkit-text-decoration-color:color-mix(in oklch, currentColor 55%, transparent);text-decoration-color:color-mix(in oklch, currentColor 55%, transparent);text-underline-offset:.2em;text-decoration-skip-ink:auto;transition:color .15s var(--ease-out);text-decoration-thickness:1px}@media (hover:hover) and (pointer:fine){.article-prose :where(a:not(.demo-frame *)):hover{color:var(--accent-text)}}.article-prose :where(a:not(.demo-frame *)):active{color:var(--accent-text)}.article-prose :where(strong:not(.demo-frame *)){font-weight:var(--weight-semibold);color:var(--fg)}.article-prose :where(em:not(.demo-frame *)){font-style:italic}.article-prose>blockquote{border-left:1px solid var(--border);padding-left:1.25rem;font-style:italic}.article-prose :where(pre:not(.demo-frame *)){background:var(--surface);max-width:100%;font-family:var(--font-mono), ui-monospace, monospace;font-size:var(--text-xs);line-height:var(--leading-normal);border-radius:.5rem;padding:1rem;overflow-x:auto}.article-prose :where(code:not(.demo-frame *)){background:var(--surface);font-family:var(--font-mono), ui-monospace, monospace;font-size:var(--text-xs);border-radius:.25rem;padding:.125rem .375rem}.article-prose :where(pre:not(.demo-frame *)) code{font-size:inherit;background:0 0;border-radius:0;padding:0}.article-prose :where(img:not(.demo-frame *)){max-width:100%;height:auto;box-shadow:inset 0 0 0 1px var(--image-outline);border-radius:.75rem}.article-prose>hr{border:none;border-top:1px solid var(--border)}.article-prose>.prose-callout{border-block:1px solid var(--border);text-wrap:balance;padding-block:1.5rem;font-style:italic}.prose-callout-rule{display:none}.article-prose .prose-callout p+p{margin-top:1rem}.article-page-footer{margin-top:var(--section-gap)}.article-page-footer-nav{column-gap:var(--g);border-top:1px solid var(--border);grid-template-columns:repeat(12,minmax(0,1fr));padding-top:.75rem;display:grid}.article-page-nav-link{grid-column:1/-1;grid-template-columns:subgrid;min-height:44px;font-size:var(--text-xs);font-weight:var(--weight-regular);letter-spacing:var(--tracking-meta);color:var(--fg);transition:color .15s var(--ease-out);align-items:center;line-height:1.4;display:grid}.article-page-nav-dir{color:var(--fg-muted);transition:color .15s var(--ease-out);grid-column:1/span 3}.article-page-nav-title{text-wrap:balance;grid-column:4/-1;justify-self:start;min-width:0}@media (hover:hover) and (pointer:fine){.article-page-nav-link:hover,.article-page-nav-link:hover .article-page-nav-dir{color:var(--accent-text)}}.article-page-nav-link:active,.article-page-nav-link:active .article-page-nav-dir{color:var(--accent-text)}.article-page-nav-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.heading-link-root{scroll-margin-top:1.5rem;position:relative}.heading-link-btn{cursor:pointer;min-width:44px;min-height:44px;color:var(--fg-muted);opacity:0;pointer-events:none;transition:opacity .2s var(--ease-out), color .2s var(--ease-out);background:0 0;border:none;border-radius:.25rem;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:absolute;top:-.5rem;left:-2.75rem}.heading-link-root:hover .heading-link-btn,.heading-link-btn:focus-visible{opacity:1;pointer-events:auto}.heading-link-btn:hover{color:var(--accent-text)}.heading-link-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.heading-link-icon{display:block}.heading-link-tooltip{background:var(--fg);color:var(--bg);font-size:var(--text-2xs);font-weight:var(--weight-medium);white-space:nowrap;pointer-events:none;animation:tooltipPop .15s var(--ease-out) forwards;border-radius:.25rem;padding:.25rem .5rem;position:absolute;top:-1.75rem;left:50%;transform:translate(-50%)}.toc-root{width:100%;display:block;position:relative}.toc-hover-zone{border:0;justify-content:flex-end;width:44px;min-width:44px;min-height:44px;margin:0 0 0 auto;padding:0;display:flex;position:relative}.toc-trigger{z-index:4;width:44px;height:max(44px, calc((var(--toc-n,1) - 1) * .5rem + 14px));cursor:pointer;background:0 0;border:0;padding:0;position:absolute;top:0;left:auto;right:0}.toc-hover-zone.is-open .toc-trigger{pointer-events:none}.toc-panel{z-index:3;width:var(--toc-width,14rem);flex:0 0 var(--toc-width,14rem);font-size:var(--text-xs);white-space:nowrap;pointer-events:none;flex-direction:column;align-items:flex-end;line-height:1rem;transition:none;display:flex;position:relative}.toc-panel.is-shown{pointer-events:auto}.toc-link{width:fit-content;min-width:44px;max-width:100%;height:1.5rem;color:var(--fg-muted);font-weight:var(--weight-regular);letter-spacing:var(--tracking-meta);cursor:pointer;margin-left:auto;text-decoration:none;transition:color .18s;display:block;position:relative}.toc-label{text-overflow:ellipsis;pointer-events:none;opacity:0;text-align:right;width:100%;transition:opacity .14s ease, transform var(--toc-motion-duration) var(--toc-motion-ease);will-change:transform, opacity;display:block;overflow:hidden;transform:translate(6px)}.toc-line{z-index:1;pointer-events:none;opacity:.75;width:16px;height:1px;transform:translateY(calc(var(--toc-i,0) * -1rem));transition:opacity .12s ease, transform var(--toc-motion-duration) var(--toc-motion-ease);will-change:transform, opacity;background:currentColor;border-radius:1px;position:absolute;top:0;left:auto;right:0}.toc-link-active .toc-line{opacity:1;color:var(--accent-text)}.toc-panel.is-shown .toc-label{opacity:1;transition-delay:calc(var(--toc-stagger-delay) * var(--toc-i,0));transform:translate(0)}.toc-panel.is-shown .toc-line{opacity:0;transform:translateY(0)}.toc-link:hover,.toc-link:focus-visible,.toc-link-active{color:var(--fg)}.toc-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.article-page-toc{--toc-width:calc(3 * var(--col) + 2 * var(--g));width:var(--toc-width);pointer-events:none;position:absolute;top:0;bottom:0;right:0}.article-page-toc .toc-root{pointer-events:auto;position:sticky;top:1.5rem}@media (max-width:1023px){.article-page{--g:1rem;--section-gap:3rem;--media-gap:2rem}.article-page-hero,.article-page .article-prose{grid-template-columns:minmax(0,1fr)}.article-page-hero{padding-top:3rem}.article-page-hero>*,.article-prose>*,.article-prose>h2,.article-prose>:is(figure,.demo-frame),.article-prose>hr{grid-area:auto/1/auto/-1}.article-page-meta{align-self:start;padding-right:0}.article-page-title{align-self:start;margin-top:.5rem}.article-page-description{font-size:var(--text-prose)}.article-prose>h2{margin-bottom:.75rem;padding-top:0;padding-right:0}.article-prose>h2+*,.article-prose>h2+:is(figure,.demo-frame){margin-top:0}.article-page-toc{display:none}.article-page-footer-nav{grid-template-columns:minmax(0,1fr)}.article-page-nav-link{grid-template-columns:auto minmax(0,1fr);column-gap:.5rem}.article-page-nav-dir,.article-page-nav-title{grid-column:auto}.heading-link-btn{left:auto;right:-.75rem}}@media (prefers-reduced-motion:reduce){.article-page-body{animation:none}.toc-panel,.toc-panel.is-shown,.toc-label,.toc-panel.is-shown .toc-label,.toc-line{transition:none}}@media print{.article-page-hero,.article-page .article-prose{display:block}}.case-page-nav-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
