/* Header controls stay in normal flow, with space reserved by flex layout. */
header{height:80px}
header nav.wrap{height:100%;display:flex;align-items:center;gap:24px;padding:0 28px}
header .brand{flex:none;white-space:nowrap}
header .navlinks{display:flex;position:static;align-items:center;gap:22px;padding:0;background:transparent}
header .navlinks a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
header .nav-actions{display:flex;align-items:center;flex:none;gap:16px;margin:0 0 0 auto}
header .nav-cta{display:inline-flex;flex:none;min-height:44px;white-space:nowrap}
header .theme-control{position:relative;top:auto;right:auto;z-index:auto;flex:none;min-height:44px;gap:6px;margin:0}
header .theme-icon{display:block;width:16px;font-size:16px;text-align:center}
header .theme-track{flex:none;width:44px;height:26px;padding:3px}
header .theme-thumb{width:20px;height:20px}
header .theme-control input:checked + .theme-track .theme-thumb{transform:translateX(18px)}
header .mobile-toggle{display:none;flex:0 0 44px;align-items:center;justify-content:center;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;color:var(--text);background:transparent;font-size:26px;line-height:1}
header a:focus-visible,header .mobile-toggle:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media(max-width:1100px){
  header .mobile-toggle{display:flex}
  header .navlinks{display:none;position:absolute;top:100%;left:0;right:0;align-items:stretch;gap:4px;padding:16px 28px;background:var(--panel);border-bottom:1px solid var(--line);box-shadow:0 16px 24px #0002;max-height:calc(100dvh - 80px);overflow-y:auto}
  header .navlinks.open{display:flex;flex-direction:column}
  header .navlinks a{padding:0 12px;border-radius:8px}
  html[data-theme="light"] header .navlinks{background:var(--panel)}
}
@media(max-width:640px){
  header{height:72px}
  header nav.wrap{padding:0 16px;gap:12px}
  header .brand{gap:8px;font-size:17px;letter-spacing:.2em}
  header .brand img{width:34px;height:34px}
  header .nav-actions{gap:10px}
  header .nav-cta{display:none}
  header .navlinks{padding:12px 16px;max-height:calc(100dvh - 72px)}
}