#851 frontend: responsive sidenav — mobile drawer + desktop icon-rail collapse Pull request opened by alvarofraguas Summary Makes the SPA's side navigation responsive and collapsible: Mobile (<768px) • The nav rail is hidden and replaced by a hamburger button in the top bar that opens the same

SideNav

as an off-canvas drawer (dimmed backdrop, 200ms slide-in). • The drawer closes on navigation (nav links, env switcher, command-palette jumps), backdrop tap, or Escape. • Top-bar padding tightens and the Search button collapses to icon-only to fit small screens. Desktop (≥768px) • A circular chevron floating on the rail's right border at mid-height (always visible, no scrolling needed) collapses the rail from 240px to a 56px icon-only strip. • In collapsed mode: labels become native tooltips +

sr-only

text, section headers become dividers, the wordmark reduces to the logo, and the env switcher shrinks to its status dot while keeping the full dropdown. • The preference persists in

localStorage

(

osctrl.sidenav-collapsed

). No functionality is removed in either mode — every nav item, the env switcher, and all permission gating behave exactly as before. Test plan •

npm run check

(tsc) clean •

npm test

— 22 files / 106 tests pass •

npm run build

clean • Verified live on a deployed stack: phone drawer open/close/navigate, desktop collapse/expand with persistence across reloads, dark + light themes jmpsec/osctrl