/* Shared navigation remains readable before the desktop links become cramped. */
body > header { min-height:88px; gap:24px; padding:18px 5%; }
body > header .brand { flex-shrink:0; }
body > header #nav { position:static; display:flex; align-items:center; gap:22px; padding:0; box-shadow:none; font-size:12px; line-height:1.5; }
body > header #nav a { white-space:nowrap; padding:10px 0; }
body > header #nav a[aria-current] { color:var(--red); border-bottom:2px solid var(--red); }
body > header #menu { display:none; color:var(--ink); cursor:pointer; }
.skip:focus { z-index:120; }
html { scroll-padding-top:105px; }
@media(max-width:1180px) {
  body > header #menu { display:flex; align-items:center; gap:12px; padding:10px 0 10px 20px; background:none; border:0; font:600 13px 'DM Sans',sans-serif; }
  body > header #nav { display:none; position:absolute; inset:100% 0 auto; max-height:calc(100dvh - 88px); overflow-y:auto; background:var(--paper); padding:16px 6% 24px; box-shadow:0 12px 20px #0002; font-size:14px; }
  body > header #nav.open { display:flex; flex-direction:column; align-items:stretch; gap:0; }
  body > header #nav a { padding:13px 0; border-bottom:1px solid #e0dcd4; }
}
@media(max-width:720px) { body > header { padding-inline:6%; min-height:84px; } }
/* The name returns home; its red punctuation is a separate editor-login link. */
body > header .brand-lockup { display:flex; align-items:flex-end; flex-shrink:0; }
body > header .brand-login { position:relative; display:block; padding:8px; margin:-8px; color:var(--red); font:800 30px/1 'Manrope',sans-serif; letter-spacing:1px; text-decoration:none; }
body > header .brand-login:hover { color:#a82830; }
body > header .brand-login:focus-visible { outline:2px solid var(--red); outline-offset:2px; border-radius:3px; }