/* Shared on-page navigation and sidebar layout, used by every page with sections. */
.page-layout{display:grid;gap:var(--column-gap);padding-top:var(--space-8)}
.page-nav{align-self:start;min-width:0;font-size:1rem}
.page-nav-desktop{display:none}
.page-nav-mobile{border-radius:var(--radius-control);border:1px solid var(--line);background:var(--paper)}
.page-nav-mobile>summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:var(--nav-row-height);padding:.875rem 1rem;list-style:none;cursor:pointer;color:var(--ink);line-height:1.5}
.page-nav-mobile>summary::-webkit-details-marker{display:none}
.page-nav-mobile>summary:hover{background:var(--section-tint)}
.page-nav-mobile>summary svg{flex-shrink:0;transition:transform .15s ease}
.page-nav-mobile[open]>summary svg{transform:rotate(180deg)}
.page-nav-mobile-links{padding:.5rem 1rem;border-top:1px solid var(--line)}
.page-nav .page-nav-mobile-links>a{min-height:3rem;padding-block:.75rem}
.page-nav-mobile-links>.page-nav-all{justify-content:space-between;gap:1rem;color:var(--ink)}
.page-nav p{font-size:.8125rem;font-family:ui-monospace,monospace;color:var(--muted);padding:.75rem 0 .5rem}
.page-nav p:not(:first-child){padding-top:1.25rem}
.page-nav a{min-width:0;display:flex;align-items:center;min-height:2.75rem;padding-block:.5rem;line-height:1.5;color:var(--muted)}
.page-nav a:hover,.page-nav a[aria-current=page]{color:var(--ink);text-decoration:underline;text-underline-offset:.25em}
.page-nav a[aria-current=page]{background:var(--section-tint);padding-inline:.5rem}
@media(max-width:63.99rem){
 html.page-nav-sticky{scroll-padding-top:calc(var(--header-height,4.5rem) + var(--page-nav-height,3.625rem) + 1rem)}
 .page-nav-sticky .page-nav{--page-nav-gutter:clamp(1rem,3.5vw,3.5rem);position:sticky;top:var(--header-height,4.5rem);z-index:90}
 .page-nav-sticky .page-nav-mobile{position:relative;transition:margin-inline .18s ease}
 .page-nav-sticky .page-nav-mobile>summary{transition:padding-inline .18s ease}
 .page-nav-sticky .page-nav.is-stuck .page-nav-mobile{border-radius:0;margin-inline:calc(-1 * var(--gutter));border-inline-color:transparent;border-top-color:transparent}
 .page-nav-sticky .page-nav.is-stuck .page-nav-mobile>summary{padding-inline:calc(var(--page-nav-gutter) - 1px)}
 .page-nav-sticky .page-nav.is-stuck .page-nav-mobile>summary svg{margin-inline-end:calc(1.5rem - 10px)}
 .page-nav-sticky .page-nav:has(.page-nav-mobile[open])::before{content:"";position:fixed;inset:var(--header-height,4.5rem) 0 0;background:rgb(0 0 0 / 35%);z-index:-1}
 .page-nav-sticky .page-nav-mobile[open]{background:var(--menu-surface)}
 .page-nav-sticky .page-nav-mobile-links{position:absolute;top:100%;left:-1px;right:-1px;max-height:calc(100dvh - var(--header-height,4.5rem) - var(--page-nav-height,3.625rem) - 1rem);overflow-y:auto;overscroll-behavior:contain}
 .page-nav-sticky .page-nav.is-stuck .page-nav-mobile-links{padding-inline:calc(var(--page-nav-gutter) - 1px);border-inline-color:transparent}
 .page-nav-sticky .page-nav.is-stuck .page-nav-all>span{display:grid;place-items:center;width:3rem;flex-shrink:0}
}
@media(prefers-reduced-motion:reduce){.page-nav-mobile>summary svg,.page-nav-sticky .page-nav-mobile,.page-nav-sticky .page-nav-mobile>summary{transition:none}}

@media(min-width:64rem){
 .page-layout{grid-template-columns:var(--page-nav-width) minmax(0,1fr);gap:var(--column-gap);padding-top:3rem}
 .page-nav{position:sticky;top:calc(var(--header-height,5rem) + 1.5rem);font-size:.875rem}
 .page-nav-mobile{display:none}
 .page-nav-desktop{display:grid;grid-template-columns:minmax(0,1fr);gap:.125rem}
 .page-nav a{min-height:2.5rem}
}
