Changelog — 2026-04-27 (04)

Mobile-responsive header

Why Care?

Mobile visitors couldn’t navigate. The desktop nav was hidden at ≤640px with no replacement, and the right-side action cluster floated next to the brand instead of pinning to the right. Both fixed in one small change.

What Got Built

• MobileNav.astro — hamburger button (3-bar → X morph) + full-width drawer beneath the sticky header. Drawer contents: flat links (Dojo, Webinars, Changelog, Log in) plus two <details> accordions for Working Groups and Projects, populated from the same loader data the desktop popdowns consume. Uses semantic <details>/<summary> so the no-JS fallback is real.
• Header spacing fix — added margin-left: auto to .site-header__actions. The right cluster now anchors right whether or not the desktop nav is visible.

Behavior

• Hidden at >640px (desktop nav stays the source of truth).
• Visible at ≤640px (hamburger replaces desktop nav).
• Closes on: direct re-press, Esc, outside-tap, any link navigation (MPA tears down the drawer naturally).
• Body scroll locked while open (html.mnav-open { overflow: hidden }).
• Respects prefers-reduced-motion.

A11y

• Real <button> with aria-haspopup="menu", aria-expanded, aria-controls, dynamic aria-label (“Open menu” ↔ “Close menu”).
• Drawer panel has role="menu"; items have role="menuitem".
• Esc returns focus to the trigger.
• All links and accordion summaries meet 44px tap-target minimum.

Verification

• pnpm astro check — zero new errors.
• Resize between 800px and 600px to confirm the swap (desktop nav ↔ hamburger).
• Hamburger interactions: open/close/Esc/outside-tap/link-click all behave.
• Right-side actions stay pinned to the right edge in both viewport modes.