[ux] Spacing, type, z-index and breakpoint tokens; presets beyond album pages #695

Part of a UX consistency audit. tokens.css has colour, radius and transition tokens but no scale for spacing, type, z-index or breakpoints, so every component picks its own values. Related: #556 (split globals.css), #613 (studio-modern carries rules the other presets lack).

Numbers (CSS grep)

Inline in components: z-index 5/990 (PhotoGrid), 9999 (ProofingModal), 1000 (MapView). There are 155 inline style={{ blocks in the admin and 72 in components/. Status colours #4ade80/#fbbf24/#f87171 are hardcoded in SubpageDrawer instead of --admin-success/--admin-warning/--admin-error.

Tasks

• Add --space-*, --fs-* (title, kicker, meta, body) and --z-* (header, overlay, lightbox, toast) tokens, shared by the visitor and admin token sets.
• Breakpoints: the visitor side uses 640/1024 with outliers at 600 (globals.css, page.module.css, Lightbox.module.css) and 768 (about.css). The admin uses six values. CSS variables don't work in media queries, so this needs PostCSS custom media or a documented constant set.
• --page-padding is used in map.css but defined nowhere.
• Secondary text via opacity (essay.css, journal/page.tsx, error.tsx) breaks the tuned 4.5:1 contrast that tokens.css explicitly warns about.
• journal.css falls back to #6366f1 for the accent, while everything else falls back to #e60012. The draft badge hardcodes #eab308.
• Presets only style album pages. No preset touches .essay-*, .journal-*, .legal-* or .album-nav, so switching preset leaves stories, the journal and the impressum on generic styling. Essay tiles carry photo-grid__item and inherit cursor: crosshair and passepartout framing by accident.
• Each preset's palette lives in tokens.css and its layout in app/themes/*.css. studio has no theme file. Move each preset's palette into its own file.
• Admin muted text fails AA (#707070 on #111 ≈ 3.8:1, #888 on #f8f8f8 ≈ 3.3:1). Extend preset-contrast.test.ts (fix: keep every preset's accent visible in both colour modes #688) to the admin tokens and to --text-muted on every preset.
• Lint rule: page CSS files may only use their own class prefix (.legal-*, .journal-*, …). That rule would have prevented the impressum leak fixed in fix: visitor-side consistency bugs from the UX audit #685.