Animation pass: one shared motion language for phones

Mobile only (<=639px / coarse pointers); desktop keeps its behaviour.

Foundation
- lib/motion.ts owns the spring presets (snappy/gentle/sheet), durations,
  easings and variants (screens, tabs, wizard steps, list stagger).
- Native-feel CSS: press feedback scales every button, card, chip, tab,
  row and summary to 0.96 with a spring-like cubic-bezier on transform
  (scoped to phones/coarse pointers), tap-highlight off, touch-action
  manipulation, chrome text non-selectable, reduced motion drops it.
- App shell fades in once on launch; the study feed fades in on phones.

Applied
- Tab bar: sliding active pill (shared layoutId) + icon bounce.
- Study Decks/Homework, language toggle, difficulty and size pickers:
  the same gliding highlight, gated so desktop keeps the old styling.
- Route content enters direction-aware (deeper = from the right, back =
  from the left, same-depth = crossfade) via RouteTransition on the
  library/create/homework content columns; library tab switches
  crossfade; wizard steps slide forward/backward (reduced motion safe).
- Library: cards fade up in a capped stagger on first load, glide with
  layout animations and shrink away on delete (AnimatePresence).
- Study feed: correct feedback pulses, wrong shakes, the progress bar
  settles with a spring curve, score and XP count up on the results.
- Settings sheet uses the sheet spring; the drawer now follows the
  finger and closes on release velocity, like the sheet.
- Generation progress: the stage message fades/slides between stages;
  the icon keeps its gentle wobble; the feed fades in on hand-off.

Skipped, on purpose: LazyMotion (the sliding highlights need layout
animations = domMax, same features the current import already has);
route exit animations (the App Router unmounts the outgoing page —
exits are handled by in-page AnimatePresence); replacing the study
feed's native scroll-snap with finger-follow drag (would fight the
platform scroller); finger-follow height animation for native <details>
expanders.

Verified: animation suite 8/8 (reduced motion + 4x-CPU-throttled trace:
no long tasks, CLS 0.0000), regression 74/74, mobile 52/52, declutter
116/116, i18n 25/25. Lint + build clean. SW freezmo-v21.

README.md

@@ -165,6 +165,14 @@ no database, no data leaving your machine except the requests you send to Ollama
   correct/wrong feedback, key status
 - Micro-interactions: 160–200ms colour/transform transitions, `active:scale-[0.985]`, skeleton
   shimmer, hairline hover washes on every row and card
+- **Motion (phones)**: one shared language (`lib/motion.ts`) — every button, card, chip, tab and
+  drawer row scales to 0.96 on press with a spring release; the tab bar, segmented controls and
+  difficulty/size pickers glide their highlight with a shared `layoutId`; wizard steps slide
+  forward and backward and page content enters direction-aware; the Settings sheet and drawer
+  follow the finger and settle on release velocity; library cards fade up in a capped stagger and
+  animate out on delete; score and XP count up; correct answers pulse, wrong ones shake;
+  `prefers-reduced-motion` collapses everything to short fades. Only transform and opacity
+  animate — never blur.
 - **iOS-flavoured PWA**: standalone mode, safe-area insets, bottom tab bar, sheet-style dialogs with
   a grabber, inset grouped lists, segmented controls, "Add to Home Screen" hint — see
   [Install as an app](#install-as-an-app-pwa)
@@ -934,6 +942,18 @@ Things I chose while building, with the reasoning:
     health cards for a Connection status row plus a collapsed Details list. Decorative orbs were
     pushed further off the phone edges so they never glow under CTAs or cards.
 
+37. **The animation pass is one shared language, and it stays off the desktop.** `lib/motion.ts`
+    owns the spring presets (snappy / gentle / sheet), durations and variants; components import
+    them instead of ad-hoc numbers. Press feedback is CSS (a spring-like cubic-bezier on
+    transform) scoped to `≤639px / pointer: coarse`, so every control responds without
+    per-component wiring. Sliding highlights use one `layoutId` per control. Route content
+    animates on entrance only — the App Router unmounts the outgoing page, so exits are left to
+    in-page `AnimatePresence` (list items, sheets). Only transform and opacity animate (plus the
+    explicit expander heights); `prefers-reduced-motion` collapses motion to short fades.
+    LazyMotion was skipped on purpose: the sliding highlights need layout animations (domMax),
+    the same feature set the current `motion` import already pulls in. Verified with a
+    4x-CPU-throttled mobile trace (no long tasks, CLS 0) and a reduced-motion run.
+
 14. **`gpt-oss:120b` does all content work — but it cannot read images** (`this model does not
     support image input`), so `VISION_MODEL` has to stay a multimodal model (`gemma4:31b-cloud`).
     Text-only inputs — pasted text, PDFs with a text layer, DOCX/PPTX/ODT — never touch the vision