feat(mockups): 13 curtain call (frieze → sea → landfall → frieze → cave, look toggle 1/2/3)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

docs/design/002-direction-round-notes.md

@@ -198,6 +198,10 @@ mockup of the transition.
   → into the cave. The vellum chart (12) appears as the map on the captain's table at sea.
 - three.js is allowed in 13 (it is already a dependency; it reuses 07's sea).
 
+- **13 is finished and committed** (`feat/sea-chart-round`, not pushed); report in
+  `docs/design/002-sea-chart-spikes/13-curtain-call-report.md`. Preview rebuilt with 01–13.
+  Known rough spots: a small sideways camera shuffle at landfall, sun glare in looks 1/2, a boxy giant.
+
 ## Open questions (in priority order)
 
 1. ~~Which sea-chart approach (08–11) reads best, or which mix?~~ 11's navigation + 10's style (§9).

docs/design/002-sea-chart-spikes/13-curtain-call-report.md

@@ -0,0 +1,85 @@
+# 13 Curtain call — report
+
+Status: **done** (not committed). Built from `13-curtain-call-brief.md`.
+
+## What was built
+
+`src/mockups/13-curtain-call/` is a five-beat scripted transition. All of it is a pure function of one
+number, the beat position `p` (0 = frieze … 4 = cave), so every transition can be played forwards or
+backwards, or frozen with `?beat=N&t=0..1`.
+
+| Beat | What you see | Transition into it |
+|---|---|---|
+| 1 Frieze | 04's black-figure band: Troy saga column, the horse and the infant, Just a Man, Full Speed Ahead. Caption "Troy falls". | — |
+| 2 To sea | 07's low-poly sea and ship; a small redraw of 12's general chart lies bottom left as the table map, with "You are here". | 1.8 s. The figures flatten into the ground line. The band splits along that line: the top half slides up, the bottom half slides down. The 3D horizon starts **exactly on the painted ground line**: the camera pitch is solved from the layout. The line fades, and only then does the camera rise over the ship's shoulder. The chart slides in last. |
+| 3 Landfall | Cyclops' Island with a cave mouth facing the camera; the ship lies off the shore. | 2.0 s. The ship sails a gentle S, the island rises from under the sea, the camera swings to frame both, and "You are here" moves to port 6 on the chart. |
+| 4 Curtain | The Cyclops frieze: crew (Odysseus with the cup), the cave mouth in the rock, Polyphemus with his club, sheep. Caption "Polyphemus". | 1.2 s. The frieze drops over the sea like a curtain (ease-in-out); the chart is put away as it falls. |
+| 5 Cave | 3D cave interior: firelit rock, the giant's silhouette with a glinting eye, the fire, the flock. "Back to sea" in the caption. | 1.6 s. The glow in the cave mouth fades and opens. The mouth is a real hole, masked through the whole frieze, so the 3D cave shows through it. The frieze zooms through the mouth (×16) while the cave camera moves in. |
+
+Controls: Play/Pause (holds each beat for 3.4 s, about 25 s in total), ← / → (also arrow keys, Space
+to play), five labelled step dots, "Look: 1 · 2 · 3" with the look's name, and `?beat=1..5`,
+`?look=1|2|3`, `?t=` (freeze) and `?play=1`. A jump that skips a beat, such as a dot two steps away
+or "Back to sea", fades through the curtain colour in about 0.7 s instead of scrubbing through the
+beats in between. Under `prefers-reduced-motion`, **every** step is that fade, and the waves slow
+down. The credits footer is a grid row of its own, outside the stage, so it is visible in every beat
+and every look.
+
+Files: `main.ts` (beats, timing, DOM choreography), `frieze.ts` (the two full-stage frieze SVGs,
+split at the ground line), `figures.ts` (copied from 04, helpers exported), `scene.ts` (trimmed from 07:
+sky, sea, island, ship, plus a new cave scene, palettes per look), `chart.ts` (simplified 12 chart).
+
+## Screenshots (1440×900)
+
+Look 2 (default): `screenshots/13-curtain-call-beat1.png` … `-beat5.png`.
+Looks 1/3: `-beat2-look1.png`, `-beat2-look3.png`, `-beat4-look1.png`, `-beat4-look3.png`.
+Mid-transition (frozen with `?t=`): `-morph.png` (1→2 at 40 %), `-morph-look1.png`, `-morph-look3.png`,
+`-mid-landfall.png` (2→3 at 50 %), `-mid-curtain.png` (3→4 at 50 %), `-mid-cave.png` (4→5 at 50 %).
+
+**Capture note:** with the brief's `--use-gl=swiftshader`, headless Chrome often captured the WebGL
+canvas blank, which looked like a black stage. `--use-angle=swiftshader --use-gl=angle
+--enable-unsafe-swiftshader --virtual-time-budget=6000` captures reliably. The renderer also sets
+`preserveDrawingBuffer`.
+
+## What works
+
+- **The morph is honest.** The ground line really becomes the horizon: the split happens on the line,
+  and the sea's horizon sits on it pixel-exact before the camera moves (`-morph*.png`).
+- **The cave zoom** reads well: through the mouth you see the real 3D cave, then the frieze falls away
+  around you (`-mid-cave.png`).
+- The curtain drop is simple and clear. All transitions sit at 1.2–2.0 s and run in reverse with ←.
+
+## What doesn't, or is rough
+
+- **Landfall framing:** in the middle of 2→3 the island rises to the *right* of the ship, then the camera
+  swings and it ends up behind it. That reads as a slight sideways shuffle; a fixed camera would be calmer.
+- **The sun** is a large glare in the morph frames of looks 1 and 2, because the camera looks level
+  at the horizon there.
+- **The giant** is blocky boxes. As a silhouette it is enough, but it is not pretty.
+- **The 3D does not match 1440×900 exactly:** the stage is 1440×~857 and the frieze uses SVG `slice`.
+  It is tuned for desktop only, as briefed. Other sizes still line the horizon up, because it is
+  computed, but the crops will differ.
+- The Play hold times were only checked in code; headless virtual time does not run the rAF loop
+  faithfully, and one headless Play run showed the state switching (Pause, dot 2) but not the frames.
+- Beat 3 has no song chip (only an eyebrow, "year 1"). Beats 3 and 4 both point at Polyphemus, so I left
+  that chip off beat 3.
+
+## The three looks, honestly
+
+**Look 2, two worlds** (default) is the most legible. The terracotta frieze is a strong, clearly
+"other" curtain, and the naturalistic sea is a real place, so each change of world feels like an event.
+But the morph (`-morph.png`) shows the seam: clay band → blue-gold sea is a jump in palette, carried
+only by the geometry of the horizon line.
+
+**Look 3, frieze-led** makes the morph almost seamless, because terracotta sky meets terracotta band
+(`-morph-look3.png`). The sea becomes a black-figure painting come to life, which is the most
+*distinctive* of the three. The cost is that the 3D sea is dark and moody, the ship is a silhouette
+with little detail, and the vellum chart then looks like a foreign object (which the brief allows:
+"one object on the table").
+
+**Look 1, vellum throughout** is the most unified and the quietest. The pen-and-wash frieze as an
+illustrated chart border is charming (`-beat4-look1.png`), and the sepia sea sits right next to the
+chart. But the sepia 3D loses depth and contrast (`-beat2-look1.png`), and nothing feels like a
+"curtain" any more: the transitions are less of an event.
+
+My read: 2 if the frieze is the punctuation, 3 if the frieze is the identity. 1 is the safest, but it
+undersells the 3D.