One-pill study chrome, toggling chat pickers, readable homework steps

UI batch from feedback:

- The study/review/exam/homework chrome is now a single 58px pill: round
  close button, title + position over the progress bar, chips (or the exam
  timer) at the far end — everything on the centre line, so nothing crowds
  the rounded corners any more. Homework guide gets the same recipe.
- The immersive feeds carry z-[45] so they paint over the app chrome (on
  /exam the header used to cover the top of the chrome), and the page chrome
  behind an open overlay (.app-header, .segmented, .tabbar) is hidden while
  the transparent overlay is up, so it can no longer ghost through the glass.
  The guide's disclaimer moved inside the overlay with it.
- Chat: the context and model chips toggle their own popover (pressed state,
  aria-expanded), opening one closes the other, a press outside closes it —
  no more being forced to pick something to get out.
- Homework: the model's plain-text step explanations/hints/verdicts keep
  their line breaks (whitespace-pre-wrap) — a step used to collapse into one
  run-on paragraph with the whole solution inside it; the guide prompt now
  says the explanation is coaching, 2-4 sentences.
- The four glacier blobs are at 25% of their old opacity (0.045 light,
  0.1 dark).

Tests: phase-2 chrome geometry + exam layering checks (62), chat desktop
picker checks (101), the standing suites all green. README: decisions 54-56,
decision 23 updated. SW -> freezmo-v44.

README.md

@@ -1061,7 +1061,9 @@ Things I chose while building, with the reasoning:
     rendered inside the content column, so on wide screens it was clipped into a visible hard edge.
     It now lives in a single `position: fixed` layer (`.ice-scene`, `z-index: -1`, pointer-events
     none): base gradient, four drifting glacier blobs, five glossy ice orbs and an SVG-noise grain.
-    `prefers-reduced-motion` stops the drift.
+    `prefers-reduced-motion` stops the drift. The four blobs were then turned down to a quarter of
+    their opacity (0.18 → 0.045 light, 0.40 → 0.10 dark): at full strength the huge circles read
+    as UI rather than as backdrop.
 24. **The UI was deliberately made quieter.** One accent colour (`accent-*`), a desaturated
     `frost-*` scale, hairline borders and flat surfaces replaced the saturated gradients and the
     seven-colour activity badges. Semantic colours (green/amber/red) survive only where they carry
@@ -1359,6 +1361,33 @@ Things I chose while building, with the reasoning:
     phase-1 suite (43 checks, including the real route mapping against a stub Ollama returning a
     monthly-limit body, a two-device sync round-trip, and the generation guards below).
 
+56. **Model text keeps its own line breaks.** Every homework prompt asks for plain text with short
+    lines and numbered or dashed lists (`HOMEWORK_BASE_RULES`), but the guide rendered the step
+    explanation in a bare `<p>` — JSX collapses newlines, so a step arrived as one run-on paragraph
+    with the whole worked solution inside it (the reported "completely broken" step). The
+    explanation, the progressive hints and the verdict/wrong entries of a check now render with
+    `whitespace-pre-wrap` like the other homework results always did, and the guide prompt says the
+    explanation is 2-4 sentences of coaching, with the finished working left to hint 3 and
+    `answer`.
+
+55. **Popovers close the way they open.** The chat's context ("what may chat read") and model chips
+    used to only ever open: the sole way out was picking something, or Escape. The chip now toggles
+    its own popover (and reads pressed while open, `aria-expanded`), opening one closes the other,
+    and on desktop a pointer press anywhere outside closes it — except on the trigger chips
+    themselves, which the outside handler ignores precisely so the toggle cannot re-open what it
+    just closed. Phones keep the sheet + backdrop they already had. Verified by the chat suite
+    (toggle, pressed state, switch, outside click).
+
+54. **The study chrome is one pill, and it sits above the app chrome.** Progress header, close
+    button, title, position and streak/xp (or the exam timer) used to be two stacked rows inside a
+    `rounded-full` box — on a tall box that is a stadium, so the corner curves cut into the icon
+    row and the controls looked like they were falling into the corners. It is now a single 58px
+    pill: round close button, title + counter over the progress bar in the middle, chips at the far
+    end, everything on the centre line — the same recipe in the study feed, review/exam sessions and
+    the homework guide. The immersive feeds also carry `z-[45]`: on `/exam` the app header (`z-40`)
+    used to paint over the top of the chrome. Verified by the phase-2 suite (the close button's
+    corners stay inside the rounded end, single row, counter present).
+
 53. **The flashcard flip never relies on `backface-visibility`.** The card is two faces in a
     `preserve-3d` container (the back pre-rotated 180°) — the classic CSS flip — but each face is a
     glass layer with `backdrop-filter`, and on some GPU/compositing paths the front's backface keeps