- useViewport: matchMedia-based hook (no resize polling). Breakpoints
mobile <768 / tablet 768-1023 / desktop >=1024. SSR-safe.
- useSidebarDrawer: Context provider with open/setOpen/toggle + auto-close
on useLocation().pathname change.
- App.tsx: wraps SidebarDrawerProvider around AppShell, renders a
MobileBackdrop (z-30) when the drawer is open on mobile.
- ProjectSidebar: aside is fixed/translate-x-full off-screen on mobile,
slides in (z-40, 200ms transform) when drawerOpen. Inline column on
desktop, unchanged.
- Session.tsx + Project.tsx: hamburger (Menu icon, >=44x44 min) on mobile
opens the drawer. Headers gain paddingTop: max(0.75rem,
env(safe-area-inset-top)) for notch devices. Home.tsx left alone
(sidebar content duplicates the home page).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
