Phase 1 of the mobile redesign: add the reusable primitives every
later phase plugs into, and switch the layout to a 4-tab bottom nav
+ compact AppBar on phone viewports while leaving the desktop header
untouched above 640px.
- New primitives: BottomNav, Sheet, AppBar, SegmentedControl, all
with vitest unit tests.
- Layout swaps the desktop header for AppBar + BottomNav under the
existing 640px breakpoint. Login / register / reader routes opt
out of the mobile chrome.
- Library tab currently points at /bookmarks; the curated /library
wrapper lands in Phase 5.
- Independent ResizeObservers publish --app-header-h,
--mobile-app-bar-h, --app-bottom-nav-h, with a zero-height skip so
hidden bars don't clobber the visible one's value.
- viewport-fit=cover + env(safe-area-inset-*) tokens for notched
devices and the iOS home indicator.
- Playwright spec covers visibility at 390px / 1280px viewports and
tab navigation.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
6dcb720a0f