/* Floating navigation inspired by the live reference, shared by every page. */
:root{--nav-top:16px;--nav-height:76px;--nav-clearance:calc(var(--nav-top) + var(--nav-height) + 20px)}
html{scroll-padding-top:var(--nav-clearance)}
.header{
 position:sticky;top:var(--nav-top);z-index:30;
 width:calc(100% - 48px);max-width:1320px;min-height:var(--nav-height);
 margin:24px auto 0;padding:14px 24px;gap:24px;
 background:rgba(255,255,255,.98);border:1px solid var(--line);border-radius:999px;
 box-shadow:0 6px 24px rgba(8,13,11,.06);
}
.header .brand{flex-shrink:0}
.header .desktop-nav{white-space:nowrap}
.header .nav-actions{flex-shrink:0}
.skip:focus{position:fixed;top:16px}
.journal .article-aside{top:var(--nav-clearance)}
.journal .article-body section{scroll-margin-top:20px}
@media(max-width:1100px){.header{gap:18px;padding-inline:20px}.header .desktop-nav{gap:18px;margin-left:0}.header .nav-actions{gap:12px}}
@media(max-width:960px){
 :root{--nav-top:12px;--nav-height:68px}
 .header{padding:10px 18px;gap:12px;margin-top:18px}
 .header #mobile-nav:not([hidden]){
  top:calc(100% + 10px);left:0;right:0;padding:14px 22px;
  border:1px solid var(--line);border-radius:24px;background:#fff;
  box-shadow:0 12px 30px rgba(8,13,11,.1);
  max-height:calc(100dvh - var(--nav-clearance) - 20px);overflow-y:auto;overscroll-behavior:contain;
 }
 .header #mobile-nav a,.header #mobile-nav button{min-height:48px;padding:13px 0}
}
@media(max-width:760px){.journal .article-aside{position:static}}
@media(max-width:480px){
 :root{--nav-top:8px;--nav-height:66px;--nav-clearance:calc(var(--nav-top) + var(--nav-height) + 16px)}
 .header{width:calc(100% - 24px);margin-top:14px;padding:10px 12px;gap:8px}
 .header .brand{font-size:24px;gap:7px}
 .header .nav-actions{gap:4px}
 .header .menu-button{flex-shrink:0}
 .header #mobile-nav:not([hidden]){border-radius:20px;padding:12px 18px}
}
@media(max-width:360px){
 .header{padding-inline:10px;gap:6px}
 .header .brand{font-size:20px;gap:6px}
 .header .brand svg{width:21px;height:25px}
 .header .nav-actions{gap:2px}
 .header .nav-actions>.button{font-size:11px;padding:10px;gap:0}
}