/* The pinned public header (owner decision, 10/26/2026: "the header stays PINNED at the top while scrolling"; this
   reverses the 10/19/2026 rule that the bar scrolls with the page). Served as /shared/header-pin.css, never inside a
   page's own HTML (backend/test_mobile_nav.py keeps position:sticky out of the pages). The look is in
   commercial.css: at the top it blends (no fill, no border); once scrolled (#navsentinel, about 8 px) it is frosted
   glass, a translucent page-color fill with a blur and a 1 px hairline, solid where backdrop-filter is missing.
   Pinned with the script on every width; without it, pinned only on a desktop, where its links fit on one row (on a
   phone they are open in the page then). The border is always there (transparent at the top), so pinning or the
   frosted look never moves the page. */
nav.sitenav.navjs,body.articlepage nav.sitenav.navjs{position:sticky;top:0;z-index:60}
@media(min-width:1024px){nav.sitenav,body.articlepage nav.sitenav{position:sticky;top:0;z-index:60}}
nav.sitenav.navjs.scrolled{background:rgba(255,255,255,.76);background:color-mix(in srgb,var(--surface) 76%,transparent);
  -webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px)}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){nav.sitenav.navjs.scrolled{background:var(--surface)}}
/* An anchored heading or section lands below the bar, never under it. */
[id]{scroll-margin-top:calc(var(--nav-h) + 16px)}
@media(max-width:1023px){[id]{scroll-margin-top:80px}}
/* Things that stick inside a page start below the bar. */
.pagenav{top:calc(var(--nav-h) + 24px)}
.walk.pinned .walkstage{top:max(calc(var(--nav-h) + 16px),calc(50vh - 330px))}
@media(prefers-reduced-motion:reduce){nav.sitenav{transition:none}}