/* Full name on arrival; its O takes over once the introductory header passes. */
html{scroll-padding-top:64px}
.scroll-header{position:fixed;inset:0 0 auto;z-index:50;height:64px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff;color:#232323;border-bottom:1px solid #e9e9e9;opacity:0;visibility:hidden;transform:translateY(-4px);pointer-events:none;transition:opacity .16s ease,transform .16s cubic-bezier(.22,1,.36,1),visibility .16s}
.scroll-header.is-visible{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.scroll-mark{display:grid;place-items:center;width:44px;height:44px;margin-left:-6px;flex:none;color:var(--red)}
.scroll-mark svg{width:32px;height:auto}
.scroll-header .header-links{align-items:center}
.scroll-header .header-links a[aria-current]{color:var(--red)}
.scroll-header .header-links a:hover{color:var(--red)}
.locked .scroll-header{visibility:hidden;pointer-events:none}
.footer-wordmark{display:block;width:144px;color:var(--red)}
.footer-wordmark svg{width:100%;height:auto}
.footer-brand .footer-wordmark+p{margin-top:14px}
.themed-project .footer-wordmark{color:var(--ink)}
@media(max-width:600px){html{scroll-padding-top:60px}.scroll-header{height:60px}.scroll-mark svg{width:28px}.scroll-mark{margin-left:-8px}.scroll-header .header-links{gap:14px}.footer-wordmark{width:128px}}
@media(prefers-reduced-motion:reduce){.scroll-header{transition:none;transform:none}}