phase: 07_canvas_client_and_hud

**Final report — phase 07 final verification pass**

- **Verified:** all 5 tasks present in `complete/`; app boots (`/healthz` 200, `/` 200, static + atlas + `/api/levels` served); `docs/CLIENT.md` module map matches the on-disk `app/static/` tree; no code defects found.
- **Tests/lint/coverage:** `bash .agents/validate.sh` → ruff clean, pyright 0 errors, `undercooked-levels validate` pass, **full pytest 1838 passed, 97.21% coverage (floor 90%)**, slow sim stage 2 passed, repo hygiene clean. `uv run pytest tests/e2e -q` → **53 passed** (all 8 suites added this phase).
- **Criteria:** (1) two tabs create→join→ready→start→serve one dish, keyboard only — green via `test_us01/02/03/04` ✔; (2) e2e green ✔; (3) canvas non-blank, pixels change after a move — `test_us04_render_smoke` ✔; (4) HUD score within 200 ms of the `served` event — asserted, green ✔; (5) zero console errors + zero off-origin requests — `test_atlas_loads` / `test_us01_landing_surface` ✔; (6) `docs/CLIENT.md` matches layout ✔; (7) 100% suite + 97.21% ✔; (8) docs pass below ✔; (9) no regression in completed phases (all prior suites green) ✔.
- **README.md fixed:** status still said "next pending phase is 07" → now 07 complete, 08 pending; the phase-07 client text buried in the phase-05 bullet → its own "canvas client, art, HUD (phase 07)" bullet; stale "What does not exist yet" (claimed movement/controls missing) → rewritten to phases 08–14; "once the room flow ships" → "live in the browser today"; Layout `app/static/` "renderer arrives with the rest of phase 07" → full shipped-client map; Layout `docs/` "CLIENT lands with phase 07" → `CLIENT.md` listed; added `gen_art_index.py` Layout entry.
- **AGENTS.md fixed:** "the eight screens" (7 listed) → "the seven screens" (+ `dom.js` is the shared builder, not a screen); e2e naming line → notes the non-story guard `test_atlas_loads.py`.
- **Decisions:** no code changes were needed; only the two doc fixes above. Docs re-verified by `test_docs_commands`/`test_docs_index` (44 passed) plus the final full gate.
- **Next pending phase:** `08_client_prediction_and_touch`.

app/static/js/screens/countdown.js

@@ -0,0 +1,38 @@
+// Undercooked — the countdown screen (phase 07 task 02).
+//
+// The 3-second `COUNTDOWN` in big numerals (one `countdown` frame per
+// whole second: 3, 2, 1). The pulse is decorative: under
+// `prefers-reduced-motion` the numeral just changes (the CSS in
+// `screens.css` gates the animation), and a re-mount per numeral is the
+// only motion machinery.
+
+import { el } from "./dom.js";
+
+let numEl = null;
+
+export function mount(target, data, app) {
+  numEl = el("p", { id: "countdown-num", class: "countdown-num" }, String(data.n ?? 3));
+  target.append(
+    el("div", { class: "panel countdown" },
+      el("h2", {}, "Get ready"),
+      numEl,
+    ),
+  );
+}
+
+/** A `countdown` frame landed (same-screen re-show): the numeral
+ *  replaces itself so the (motion-gated) pulse restarts. */
+export function update(data, _app) {
+  if (numEl === null) return;
+  numEl.textContent = String(data.n ?? "");
+  const parent = numEl.parentElement;
+  if (parent !== null) {
+    const fresh = el("p", { id: "countdown-num", class: "countdown-num" }, numEl.textContent);
+    parent.replaceChildren(fresh);
+    numEl = fresh;
+  }
+}
+
+export function unmount() {
+  numEl = null;
+}