feat(admin-ui): Mobile design revamp for Admin UI

# Mobile design revamp for Admin UI

## Description

The Admin UI is built for desktop widths. On phone and small-tablet viewports the core screens do not adapt: content overflows or sits at fixed desktop widths, horizontal padding does not line up with the header, tap targets and typography are sized for a cursor, and there is no mobile navigation model. Users on a mobile device cannot comfortably read or operate the app.

## Current behavior

- Screens render at desktop widths and overflow horizontally at ≤767px.
- Page content does not align with the header (left edge off from the logo, right edge off from the header end).
- No mobile navigation to reach top-level sections on a phone.
- Spacing and typography are desktop-sized on small screens.

## Expected behavior

- Core screens render without horizontal overflow at 390px down to the smallest supported width.
- Page content aligns with the header: left starts where the logo starts, right ends where the header ends.
- Mobile navigation lets a user reach every top-level section on a phone.
- Desktop and tablet layouts stay visually unchanged.

## Scope

Adapt the Admin UI to mobile viewports (target 390px, breakpoint ≤767px), leaving desktop and tablet layouts unchanged. Delivered as child issues linked to this epic.

In scope: shared mobile layout primitives (page padding, header alignment, spacing/typography constants), mobile navigation (header, bottom navigation, category sheet), and per-screen responsive layouts.

Out of scope: desktop/tablet visual changes, new features, data-model or backend changes.