diff --git a/.claude/skills/morpho-design/SKILL.md b/.claude/skills/morpho-design/SKILL.md
new file mode 100644
index 0000000..b1d4a88
--- /dev/null
+++ b/.claude/skills/morpho-design/SKILL.md
@@ -0,0 +1,47 @@
+---
+name: morpho-design
+description: Design posters, logos, type and motion in Morphotype with the morpho CLI (make → check --fix → vary → video). Use when asked to make, change or judge a design, poster, logo, lettering or animation in the app — not for work on the app's own code.
+---
+
+# Designing with morpho
+
+Morphotype designs are made with `npm run morpho -- …` (`scripts/morpho.mjs`). Don't read template, material or effect sources to learn what exists, and don't screenshot the editor: the CLI answers in a few lines of text or one PNG. Full reference: `docs/AGENT-TOOLS.md`.
+
+## The workflow: aim for 2–3 calls and one image
+
+1. **Start the daemon once** (drawing then takes about a second): `npm run morpho -- serve &`
+2. **Look up only what you need**, in text: `morpho catalog kits`, `catalog fonts`, `catalog presets`, `catalog shapes`, `catalog motion`, or a name (`catalog chrome`).
+3. **Write a spec and `make` it.** One call builds the design, places everything against the engine's real outlines, fixes what's mechanical, checks it and draws one PNG:
+
+   ```json
+   {
+     "name": "Summer Sound", "canvas": "1080x1350", "kit": "riso-zine", "duration": 5,
+     "layers": [
+       { "shape": "sparkle", "name": "Mark", "fitHeight": 20, "place": "top third" },
+       { "text": "SUMMER\nSOUND", "name": "Title", "fitWidth": 82, "place": "centre" },
+       { "text": "12 JULY · RIVERSIDE", "name": "Info", "place": "bottom", "margin": 90 }
+     ],
+     "motion": { "recipe": "cascade", "layers": ["Mark", "Title", "Info"] }
+   }
+   ```
+
+   `npm run morpho -- make summer.json` → `summer.morpho`, findings, `test-results/morpho/summer-make.png`.
+4. **Read the text first.** `make` prints every box and margin, what it fixed and the findings. Look at the PNG once, to judge the look; after a later `make` with no warnings you don't need to look again.
+5. **If something's left**, run the commands under "still to do" with `--check` (it prints only what changed in the findings), or edit the spec and `make` again. `check <file> --fix` mends cut-off text, near-centring, loop seams and moves the clock cuts off.
+6. **Compare options in one sheet**, not several renders: `morpho vary summer.morpho --vary 'Title.preset=Ice chrome|Plasma'`.
+7. **Finish**: `morpho video summer.morpho -o summer.mp4` (moving) or `morpho render summer.morpho --out summer.png` (still).
+
+Every command ends with `next: …`: the likely next command.
+
+## Spec essentials
+
+- Layers are **bottom first**. A layer is `text`, `shape`, `line`, `path` or `group`.
+- **Place with words, not pixels**: `fitWidth` / `fitHeight` (% of the canvas), `place` (`top`, `centre`, `bottom`, `top third`, `bottom third`, `left`, `right`, `top left`…), `margin` (px or `"6%"`), `centre` (`x`, `y`, `true`), `contain`, `offset` [x, y]. Stacks and rows: `"layout": [{ "stack": ["Date", "Venue"], "gap": 12, "align": "left", "place": "bottom left" }]`.
+- **Kits** (`chrome-night`, `neon-club`, `riso-zine`, `brutal-pop`, `puff-sky`, `editorial`, `holo-y2k`, `arcade`) set the background, fonts and a look per role. The first text is the headline, other text is body, shapes are accent; `role`, `font`, `preset` or `material` override it; `color` (hex or a palette name like `"accent"`) tints the look's main colour.
+- **Motion recipes**: `cascade`, `pop`, `type-on`, `slide-in`, `drop`, `drift`, `breathe`, or `enter` / `stagger` / `feel` / `loop` by hand. On a looping clock, things that enter also leave before the end, so loops join.
+- Anything else: a layer's `"set": { "gloss": 0.4 }`, `"modifiers": [{ "kind": "wave", "amplitude": 0.04 }]`, or the spec's `"set": ["Title.liquid=1"]`.
+- `"style": "abstract"` turns rules of taste (centring, near-misses, clear lead, crowding, hue count) into notes; mistakes stay warnings.
+
+## Editing an existing design
+
+`morpho describe f.morpho` (text tree) → `morpho set f.morpho 'Title.gloss=0.4' 'Info.place=bottom left' --check` → `morpho check f.morpho --fix`. Templates: `morpho scene "UFO poster" -o ufo.morpho`. When the design was made from a spec, change the spec and `make` again instead: `make` rebuilds from the spec.
diff --git a/CLAUDE.md b/CLAUDE.md
index 4872f13..52f47d8 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -4,28 +4,7 @@ A type and logo lab. The geometry engine is Rust (`crates/morpho-core`), compile
 
 ## Designing in the app: use morpho
 
-Don't read the template or effect sources to learn what exists, and don't screenshot the editor to judge a design. Use the CLI (`docs/AGENT-TOOLS.md`):
-
-```sh
-npm run morpho -- serve &                 # once: keeps a browser warm (drawing then takes < 1 s)
-npm run morpho -- catalog                 # what exists; then: catalog chrome / glitch / star / motion / keyframes / layers
-npm run morpho -- describe "UFO poster"   # a design as text, changed settings only
-npm run morpho -- scene "UFO poster" -o ufo.morpho
-npm run morpho -- set ufo.morpho 'Title.gloss=0.4' 'Star.x=-120'
-npm run morpho -- render ufo.morpho --frames 6           # one filmstrip image
-npm run morpho -- vary ufo.morpho --vary 'Title.liquid=0.2,0.6,1.2'
-npm run morpho -- check ufo.morpho                       # problems in words
-npm run morpho -- compare ufo.morpho reference.png
-
-npm run morpho -- new poster.morpho --canvas 1080x1350 --bg "#111111"   # from scratch
-npm run morpho -- add poster.morpho text "HELLO" --size 200 --preset "Ice chrome"
-npm run morpho -- align poster.morpho HELLO                            # centre by what's drawn
-npm run morpho -- layout poster.morpho                                 # boxes and margins as text
-npm run morpho -- timing poster.morpho                                 # when everything moves
-npm run morpho -- video poster.morpho -o poster.mp4
-```
-
-Prefer `check`, `describe` and text output over images. When you do need to look, ask for one contact sheet (`--frames`, `vary`), not several renders.
+To make, change or judge a design, use the `morpho` CLI, not the template or effect sources or editor screenshots: write a spec, `npm run morpho -- make spec.json`, then `check --fix`, `vary` and `video`. The `morpho-design` skill (`.claude/skills/morpho-design/SKILL.md`) has the workflow and `docs/AGENT-TOOLS.md` the reference.
 
 ## Commands
 
diff --git a/docs/AGENT-TOOLS.md b/docs/AGENT-TOOLS.md
index af7cbf5..11de803 100644
--- a/docs/AGENT-TOOLS.md
+++ b/docs/AGENT-TOOLS.md
@@ -1,58 +1,235 @@
 # morpho: the app from the command line
 
-`scripts/morpho.mjs` drives Morphotype without its interface. It's built for AI agents (and scripts) designing in the app: every command answers in a few lines of text or in **one** PNG, so learning what exists, reading a design, editing it and judging it doesn't mean reading source files or taking a pile of screenshots.
+`scripts/morpho.mjs` drives Morphotype without its interface. It's built for AI agents (and scripts) designing in the app. A whole design is **one spec file and one command**: `make` builds it, places it against the engine's real outlines, fixes what's mechanical, checks it in words and draws **one** PNG. Every command ends with the likely next command.
 
 ```sh
+npm run morpho -- serve &      # once: keeps a browser warm, so drawing takes about a second
 npm run morpho -- help
 ```
 
-## Commands
+## The workflow: make → check (--fix) → vary → video
+
+```sh
+morpho catalog kits                    # 1. pick a look (optional: kits, fonts, presets, shapes…)
+morpho make poster.json                # 2. build, place, fix, check, one picture
+morpho set poster.morpho 'Info.place=bottom left' --check   # 3. only if make left something to do
+morpho vary poster.morpho --vary 'Title.preset=Ice chrome|Plasma|Molten'   # (optional) compare options in one sheet
+morpho video poster.morpho -o poster.mp4                    # 4. done
+```
+
+A good design takes **2–3 calls and one image**: write the spec, `make`, then `video` (or `render`). `make` prints what it built, every layer's box and margins, what it fixed, the findings, and the commands for whatever is left, so the picture is for judging the look, not for finding mistakes.
+
+To change the design, edit the spec and run `make` again: it rebuilds everything (so a spec is the design's source; `set` edits on the `.morpho` file are lost on the next `make`).
+
+### Example
+
+`night.json`:
+
+```json
+{
+  "name": "Night Drive",
+  "canvas": "1080x1350",
+  "kit": "chrome-night",
+  "duration": 4,
+  "layers": [
+    { "shape": "ring", "name": "Halo", "color": "accent", "fitWidth": 80, "place": "top third", "motion": { "loop": "pulse", "amount": 6, "period": 4 } },
+    { "text": "NIGHT\nDRIVE", "name": "Title", "fitWidth": 78, "place": "top third", "modifiers": [{ "kind": "wave", "amplitude": 0.04, "wavelength": 1.4 }] },
+    { "shape": "sparkle", "name": "Spark", "size": 200, "place": "top right", "margin": 110, "motion": { "loop": "spin", "period": 4 } },
+    { "text": "LIVE · 21.11 · WAREHOUSE 9", "name": "Info", "place": "bottom", "margin": 120 }
+  ],
+  "motion": { "recipe": "cascade", "layers": ["Title", "Info"] }
+}
+```
+
+```
+$ morpho make night.json
+wrote night.morpho from night.json
+"Night Drive" 1080×1350, 4s loop, kit chrome-night: 4 layers
+motion cascade: Title, Info: enter rise 0.15s apart, leaving from 3.17s so the 4s loop joins
+motion Halo: loop pulse
+motion Spark: loop spin
+layout: Halo: fit 80% wide, at top third · Title: fit 78% wide, at top third · Spark: at top right (margin 110) · Info: at bottom (margin 120)
+boxes on 1080×1350 (px; x,y from the centre; negative margins are off the canvas), top first:
+"Info"                     463×25     centre 0,542      margins L 308 R 308 T 1205 B 120 · 35px type
+"Spark"                    200×200    centre 330,-465   margins L 770 R 110 T 110 B 1040
+"Title"                    842×387    centre 0,-225     margins L 119 R 119 T 256 B 706 · 210px type
+"Halo"                     864×864    centre 0,-225     margins L 108 R 108 T 18 B 468
+"Night Drive" 1080×1350, 4s loop: no problems, 2 warnings
+! "Title" and "Spark": rights 8.808px apart, nearly lined up
+! "Halo": only 18px from the top edge: crowded (bleed it off or give it room)
+· the loop joins smoothly
+· visual weight sits upper (16% of the way to the edge)
+· palette: 2 main hues (violet, azure), mostly neutrals
+· looked at 4 of 4 layers
+still to do:
+  morpho align night.morpho "Spark" --to "Title" --edge right   # "Title" and "Spark": rights 8.808px apart, nearly lined up
+  morpho set night.morpho '"Halo".contain=true'   # "Halo": only 18px from the top edge: crowded (bleed it off or give it room)
+wrote test-results/morpho/night-make.png (1000×338)
+next: run the commands under "still to do" (add --check to see what each changes), or edit night.json and make again
+```
+
+Run the two commands (each with `--check` to see what it changed), or change the spec (`"margin": 120` on Spark is one way to settle the first) and `make` again.
+
+The picture is the design at rest, or (when it moves) at rest plus three moments on the clock in one strip.
+
+## The spec
+
+JSON. Layers are listed **bottom first**: later ones draw on top.
+
+| Key | What it is |
+| --- | --- |
+| `name` | The design's name. |
+| `canvas` | `"1080x1350"`, a preset name (`"Instagram post"`, see `catalog canvas`) or `{ "width", "height" }`. |
+| `kit` | A style kit (below): background, fonts and a look for each role. |
+| `background` | `"#111111"`, `"#a,#b"` (a gradient), a background preset (`"Paper"`) or a background object. Overrides the kit's. |
+| `duration`, `loop` | The clock, in seconds (looping unless `"loop": false`). |
+| `style` | `poster` (default), `logo` or `abstract` (see `check`). |
+| `layers` | The layers, bottom first (below). |
+| `layout` | Stacks and rows: `{ "stack": ["Title", "Info"], "gap": 40, "align": "centre", "place": "centre" }`, or `"row": […]`. |
+| `motion` | Motion recipes over several layers: `{ "recipe": "cascade", "layers": ["Title", "Info"] }` (or a list of them). |
+| `set` | Assignments applied last, as `set` takes them: `["Title.gloss=0.6", "background.grain=0.2"]`. |
+
+A layer is one of `"text": "HI\nTHERE"`, `"shape": "star"`, `"line": "<svg d>"`, `"path": "<svg d>"` (path data in em units, centred on 0,0) or `"group": [ …layers… ]` (with `"merge": true` they fuse into one shape). Then any of:
+
+| Key | What it is |
+| --- | --- |
+| `name` | How commands address it. |
+| `role` | `headline`, `accent` or `body`: which of the kit's looks it takes. By default the first text is the headline, other text is body, and everything else is accent. |
+| `font`, `size`, `tracking` | Text: a bundled font id (`catalog fonts`), px, em. A headline with no size fills 80% of the width. |
+| `color` | `#rrggbb`, or a kit palette name (`"accent"`, `"ink"`): the look's one main colour (a flat fill, a neon's glow, an ink), or flat in that colour when the look has none. |
+| `preset`, `material`, `recipe` | A material look by name (`catalog presets`), a material id, a modifier recipe. A `preset` or `material` replaces the kit's look. |
+| `modifiers` | `[{ "kind": "wave", "amplitude": 0.04 }, "slant"]`. |
+| `fitWidth`, `fitHeight`, `place`, `margin`, `centre`, `contain`, `offset` | Layout in words (below). |
+| `at`, `rotation`, `scale`, `width` | Plain position (`"x,y"` px from the centre), degrees, scale, and a pen line's stroke width. Use `place` instead of `at` where you can. |
+| `set` | Any other setting: `{ "gloss": 0.4, "wave.amplitude": 0.05 }`. |
+| `motion` | This layer's motion: a recipe's fields (`{ "enter": "rise", "delay": 0.3 }`, `{ "loop": "float" }`), or motion settings as they're stored (`catalog motion`). |
+
+## Layout in words
+
+Measure, then place: every instruction is resolved against the engine's real build boxes (what's drawn, not the anchor), so italic, wavy or warped type lands where it looks like it should.
+
+| Instruction | What it does |
+| --- | --- |
+| `fitWidth: 80`, `fitHeight: 30` | Sizes the layer (or group) so its box is that % of the canvas width / height. Both: it fits inside both. Fits happen first; the layer then stays centred where it was. |
+| `place: "top"` | `top`, `centre`, `bottom`, `top third`, `bottom third`, `left`, `right`, `top left`, `top right`, `bottom left`, `bottom right`. One word centres the other axis. Thirds put the box's centre on the third line. |
+| `margin: 64` | Distance from the edges for `place`, in px or `"6%"` of the short side (default 6%). |
+| `centre: "x"` | Centres by ink: `x`, `y` or `both` (`true`). |
+| `contain: true` | Shrinks it if it's bigger than the canvas inside the margins, then moves it inside them. |
+| `offset: [0, -60]` | A nudge in px after placing. |
+| `stack` / `row` | Several layers one under another (or side by side), first listed first, `gap` px apart, aligned `start`, `centre` or `end` across (`left`, `right`, `top`, `bottom` work too), and placed as one block with `place` and `margin`. |
+
+The same instructions work on files you already have:
+
+```sh
+morpho add poster.morpho text "Sat 14 June" --place "bottom left" --margin 80
+morpho add poster.morpho shape star --fit-height 30 --place centre
+morpho set poster.morpho 'Title.place=top third' 'Title.fitWidth=80' 'Info.margin=5%' 'Info.centre=x'
+morpho set poster.morpho --stack "Date,Venue" --gap 12 --align left --place "bottom left"
+morpho align poster.morpho Title Info            # centre by what's drawn (--to Layer, --edge left…)
+```
+
+## Kits
+
+A kit gives a design a background, a palette, a font pairing and a look for each role in one word. Anything a layer sets itself wins. `catalog kits` lists them with their contents.
+
+| Kit | Look |
+| --- | --- |
+| `chrome-night` | liquid chrome on near-black, a violet glow, grotesk captions |
+| `neon-club` | neon tubes on black, pink and cyan |
+| `riso-zine` | two-ink risograph on warm paper, tall condensed headline |
+| `brutal-pop` | flat colour, thick outlines and hard shadows on a green grid |
+| `puff-sky` | puffy inflated letters on deep sky blue, pink accents |
+| `editorial` | black serif on paper with a red stamp |
+| `holo-y2k` | holographic foil and an acid aura on black |
+| `arcade` | pixel type in chunky 3D on electric violet |
+
+`new <file> --kit name` starts a file with a kit; `add` then gives each layer its role's look (`--role headline|accent|body`).
+
+## Motion recipes
+
+Several layers in one go, on today's motion model (entrances, loops, ways out), so nobody works out delays or writes keyframes by hand. On a looping clock everything that enters also leaves before the clock ends (the entrance's own way out: rise leaves rising, grow shrinks away), so the loop joins without a jump. `"leave": "none"` keeps things on screen.
+
+| Recipe | What it does |
+| --- | --- |
+| `cascade` | each rises in, one after another |
+| `pop` | each grows in with a spring |
+| `type-on` | text fades in letter by letter |
+| `slide-in` | each slides in from the left |
+| `drop` | each drops in from above with a bounce |
+| `drift` | everything floats, out of step |
+| `breathe` | everything pulses gently, out of step |
+
+Or by hand: `enter` (`fade`, `rise`, `drop`, `left`, `right`, `grow`, `spin`), `stagger` (s between layers), `start` (s), `feel` (`Smooth`, `Snappy`, `Bouncy`, `Slow`), `duration` (s), `distance`, `letters` (`true` or `"words"`) with `letterStagger`, `loop` with `period`, `amount` and `spread` (phase step between layers), `leave` (`auto`, `none`, `fade`, `rise`…) and `leaveAt`.
+
+```sh
+morpho motion poster.morpho Title Info Date --recipe cascade
+morpho motion poster.morpho --enter rise --stagger 0.15 --feel Snappy     # every top-level layer, bottom up
+morpho motion poster.morpho Star --loop spin --period 4
+```
+
+## check, --fix, set --check
+
+`check` says what's wrong in words, marks what it can mend with `[--fix]`, and prints the rest as commands to run.
+
+```sh
+morpho check poster.morpho            # findings; "N can be fixed automatically"; to do: commands
+morpho check poster.morpho --fix      # applies the mechanical fixes, writes the file, checks again
+morpho set poster.morpho 'Title.size=240' --check   # just what that edit changed in the findings
+```
+
+`--fix` mends what has one right answer:
+
+- **text cut off** by the canvas: shrunk to fit inside the margins and moved in;
+- **nearly centred** (0.2–1.2% off): centred by its ink;
+- **an entrance that replays at the loop's seam**: a way out timed to end before the clock does (and the entrance brought forward if it would otherwise not hold still);
+- **a move the clock cuts off**: started earlier, then its stagger tightened, then made quicker.
+
+Everything else comes back as a ready-to-run command (`align … --edge left` for a near-miss, `set … contain=true` for something crowding an edge, a size for a headline without a clear lead, a fill for low contrast, `arrange … top` for something covered), or in words when it needs judgment.
+
+`set --check` (and `make`) remember each version's findings, so `--check` only checks the new one and prints what appeared (`+`), went away (`−`) or changed (`~`).
+
+**`--style poster|logo|abstract`** (on `new`, `make`, `set`, or one `check`) says what kind of design it is; it's kept in the file. For `abstract` work, rules of taste (near-misses and centring, a clear lead, crowded edges, how many hues) become notes; mistakes (off the canvas, unseen, low contrast, loop jumps, pops) stay warnings.
+
+### What check looks for
+
+**From the project and the engine's build:** layers the engine couldn't build; layers entirely or partly off the canvas; text too small to read; unknown materials and invalid colours; settings outside their range; keyframes that point at nothing; entrances or exits timed after the clock ends, or cut off by it.
+
+**From the boxes (layout notes):** edges and centres that nearly line up, 0.2–1.2% of the canvas apart (closer than that, nobody sees it); layers that are nearly centred; things crowding an edge; a design that sits a little off centre; two headlines of about the same size (no clear lead); too many text sizes.
+
+**From the pixels:** layers that can't be seen at rest (each layer is hidden in turn and the image compared, scaled to the layer's size so hairlines and tiny marks count); text with low contrast against what's actually behind it (measured on its best-separated quarter, so outlines, hard shadows and lit edges count); a blank, one-colour design; pops in the motion (one frame step far bigger than the steps on both sides of it); a loop that jumps where it starts over; where the visual weight sits, and how many hues the palette really uses.
+
+## Every command
 
 | Command | What it gives back | Browser? |
 | --- | --- | --- |
-| `catalog [query]` | What designs are made of. With no query, a one-screen index. With a section (`materials`, `modifiers`, `shapes`, `motion`, `keyframes`, `layers`, `presets`, `recipes`, `fonts`, `backgrounds`, `canvas`, `templates`), that whole section. With a name (`chrome`, `glitch`, `star`, `"Ice chrome"`), every setting with its range, default and label. Anything else is searched. | no |
-| `describe <scene>` | The design as a text tree, top layer first. Each layer is one line: what it is, where it sits, its material, modifiers, motion and keyframes, showing **only settings that differ from the defaults**. | no |
+| `make <spec.json> [-o f]` | A whole design from a spec: built, placed, mechanically fixed (`--no-fix` to skip), checked, one PNG. `--kit`, `--style`, `--at` / `--frames` for the picture. | yes |
+| `catalog [query]` | What designs are made of. With no query, a one-screen index. With a section (`kits`, `materials`, `modifiers`, `shapes`, `motion`, `keyframes`, `layers`, `presets`, `recipes`, `fonts`, `backgrounds`, `canvas`, `templates`), that whole section. With a name (`chrome`, `glitch`, `star`, `"Ice chrome"`, `riso-zine`), every setting with its range, default and label. Anything else is searched. | no |
+| `describe <scene>` | The design as a text tree, top layer first, showing **only settings that differ from the defaults**. | no |
 | `scene <template> [-o f]` | Writes a template as an editable `.morpho` file. | no |
-| `set <file> <a=b>…` | Edits a `.morpho` file in place and prints each change (`--dry` to only print them). | no |
-| `render <scene>` | A PNG. With one time it's that frame (at rest by default). With `--at 0,1,2` or `--frames 8` it's one captioned filmstrip. | yes |
-| `vary <scene>` | One PNG with a captioned cell per variation: `--vary` multiplies lists of values, `--variant 'a=1; b=2'` adds hand-made combinations. | yes |
-| `check <scene>` | Problems, in words (see below). | yes |
-| `compare <scene> <image>` | How close the design is to a reference picture: colour, pixel and layout scores, plus one reference \| design \| difference image. | yes |
-| `new <file>` | A blank design: `--canvas 1080x1350` or a preset name (`"Instagram post"`), `--bg "#111111"`, `"#a,#b"` (a gradient) or a background preset, `--duration 4`. | no |
-| `add <file> text "HI"` · `shape star` · `line "<d>"` · `path "<d>"` | A new layer. Options: `--name`, `--at x,y`, `--size`, `--font`, `--color`, `--material chrome` or `--preset "Ice chrome"`, `--recipe Glitch`, `--rotation`, `--scale`, `--width` (lines), and `--above L`, `--below L` or `--into Group` (the default is on top). Lines and outlines take SVG path data in em units, centred on 0,0. | no |
+| `set <file> <a=b>…` | Edits a `.morpho` file in place and prints each change (`--dry` to only print them). Layout assignments (`L.place=…`) and `--stack`/`--row` are resolved against the build; `--check` prints what changed in the findings; `--style` sets the design's style. | layout and `--check` only |
+| `new <file>` | A blank design: `--canvas`, `--bg`, `--duration`, `--kit`, `--style`. | no |
+| `add <file> text "HI"` · `shape star` · `line "<d>"` · `path "<d>"` | A new layer. Options: `--name`, `--at x,y`, `--size`, `--font`, `--color`, `--material` or `--preset`, `--recipe`, `--rotation`, `--scale`, `--width` (lines), `--above L`, `--below L` or `--into Group`, `--role`, and layout: `--fit-width`, `--fit-height`, `--place`, `--margin`, `--centre`. | layout only |
 | `add <file> modifier glitch --to L` | A modifier with its defaults; `--fields '{"amount":0.6}'` overrides them. A recipe name adds that recipe. | no |
 | `add <file> group A B` | Wraps layers in a group where the topmost one was (`--merge` fuses them into one shape). | no |
 | `add <file> font f.ttf` · `image p.png` | Embeds a font and prints its id for `--font`. Places a picture in a rectangle, or with `--to L` fills that layer with it. | yes |
+| `motion <file> [L…]` | A motion recipe (`--recipe`) or entrances, loops and ways out by hand over several layers (default: every top-level layer, bottom up). | no |
 | `remove` · `duplicate` · `arrange` | `remove <file> L…`. `duplicate <file> L` (new ids, so its keyframes follow its own modifiers). `arrange <file> L top\|bottom\|up\|down\|above M\|below M`. | no |
-| `align <file> L… [--to canvas\|M] [--edge centre,middle]` | Lines layers up by what they actually draw, not their anchors. A wavy or italic word that looks off centre gets centred by its ink. | yes |
-| `layout <scene>` | Every layer's box, centre and margins to each edge as text, plus the layout notes `check` gives. | yes |
-| `timing <scene>` | When everything moves: entrances and exits as bars on the clock, loops and keyframes as their cycles (hold keyframes as rest, go, at To, back), with notes on rhythm (entrances all starting at once, long stretches where nothing moves, moves cut off by the clock). | no |
-| `video <scene> -o f.mp4` | MP4, MOV, WebM or GIF (needs ffmpeg), or PNG frames into a folder ending in `/`. Every frame is drawn at its exact time, so a 4 s loop exports in about 3 s and joins seamlessly. `--fps` (default 30, GIF 20), `--size` (GIF default 480) or `--scale`. | yes |
-| `fit <file> <ref> L.setting…` | Tunes each setting in turn until the design matches a reference picture, writes the file (or `--out`), and prints before → after. Settings: position, rotation, scale, and any number in the content or material. | yes |
-| `serve` / `stop` | Keeps Vite and a browser running. While it's up, drawing commands take well under a second instead of 5–15 s. | — |
+| `align <file> L… [--to canvas\|M] [--edge centre,middle]` | Lines layers (or groups) up by what they draw. | yes |
+| `layout <scene>` | Every layer's box, centre and margins as text, plus the layout notes. | yes |
+| `timing <scene>` | When everything moves: entrances and exits as bars on the clock, loops and keyframes as their cycles, with notes on rhythm. | no |
+| `render <scene>` | A PNG at one time (at rest by default), or a captioned filmstrip with `--at 0,1,2` / `--frames 8`. | yes |
+| `vary <scene>` | One PNG with a captioned cell per variation: `--vary` multiplies lists of values, `--variant 'a=1; b=2'` adds hand-made combinations. | yes |
+| `check <scene>` | Findings in words, `--fix`, `--style` (above). | yes |
+| `compare <scene> <image>` | How close the design is to a reference picture: colour, pixel and layout scores, plus one reference \| design \| difference image. | yes |
+| `fit <file> <ref> L.setting…` | Tunes each setting in turn until the design matches a reference picture. | yes |
+| `video <scene> -o f.mp4` | MP4, MOV, WebM or GIF (needs ffmpeg), or PNG frames into a folder ending in `/`. Every frame is drawn at its exact time, so loops join seamlessly. `--fps`, `--size`, `--scale`. | yes |
+| `serve` / `stop` | Keeps Vite and a browser running (`MORPHO_PORT`, default 7801). Drawing commands then take about a second instead of 5–15 s. | — |
 
 `<scene>` is a template name (exact, any case, or a unique part of one) or a `.morpho`/`.json` file. PNGs go to `test-results/morpho/` unless you pass `--out`. `--json` gives machine-readable output.
 
-## A design from scratch
-
-```sh
-morpho new gig.morpho --canvas 1080x1350 --bg "#0d0d12" --name "Night Drive" --duration 4
-morpho add gig.morpho text "NIGHT\nDRIVE" --font unbounded --size 300 --preset "Ice chrome" --at 0,-150 --name Title
-morpho add gig.morpho shape ring --size 900 --at 0,-150 --color "#5a17d6" --below Title --name Halo
-morpho add gig.morpho shape sparkle --size 220 --at 320,-490 --preset Plasma --name Spark
-morpho add gig.morpho text "LIVE · 21.11 · WAREHOUSE 9" --font space-grotesk --size 34 --color "#e8e8f0" --at 0,420 --name Info
-morpho add gig.morpho modifier wave --to Title --fields '{"amplitude":0.04,"wavelength":1.4}'
-morpho set gig.morpho 'Spark.motion.loop="spin"' 'Spark.motion.period=4' 'Halo.motion.loop="pulse"' 'Title.motion.enter="rise"'
-morpho check gig.morpho     # → title 10% off both edges; the loop jumps (the entrance replays)
-morpho set gig.morpho 'Title.size=250' 'Title.motion.leave="fade"' 'Title.motion.leaveAt=3.3'
-morpho align gig.morpho Title Info          # centre by what's drawn
-morpho check gig.morpho     # → no problems; the loop joins smoothly
-morpho video gig.morpho -o gig.mp4
-```
-
 ## Editing: `Layer.setting=value`
 
-Use the same assignments for `set`, and for `--set`, `--vary` and `--variant` on any command (with `--set`, files are left alone):
+The same assignments work for `set`, a spec's `set`, and `--set`, `--vary` and `--variant` on any command (with `--set`, files are left alone):
 
 ```sh
 morpho set y2k.morpho 'Topo blob.gloss=0.8'           # a material setting
@@ -73,47 +250,22 @@ morpho set y2k.morpho 'canvas.width=1080' 'timeline.duration=4' 'background.grai
 - **Changing the material.** Setting `effect` switches the material. Settings the old and new materials share are kept; the rest start at the new material's defaults.
 - **Template ids.** They are generated afresh each time a template is made, so address template layers by name. After `scene`, the ids in the file stay fixed.
 
-## What `check` looks for
-
-**From the project and the engine's build:**
-- layers the engine couldn't build;
-- layers entirely or partly off the canvas;
-- text too small to read;
-- unknown materials and invalid colours;
-- settings outside their range;
-- keyframes that point at nothing;
-- entrances or exits timed after the clock ends.
-
-**From the boxes (layout notes):**
-- edges and centres that nearly line up, 0.2–1.2% of the canvas apart (closer than that, nobody sees it);
-- layers that are nearly centred on the canvas;
-- things crowding an edge;
-- a design that sits a little off centre;
-- two headlines of about the same size (no clear lead);
-- too many text sizes.
-
-**From the pixels:**
-- layers that can't be seen at rest: each layer is hidden in turn and the image compared, scaled to the layer's size so hairlines and tiny marks count;
-- text with low contrast against what's actually behind it;
-- a blank, one-colour design;
-- pops in the motion: one frame step far bigger than the steps either side of it, so fast but smooth moves aren't flagged;
-- a loop that jumps where it starts over (for example an entrance that replays every loop);
-- where the visual weight sits, and how many hues the palette really uses.
-
 ## Speed
 
 Drawing runs on the GPU by default, with SwiftShader as a fallback if WebGL won't start there. Pass `--cpu` (or set `MORPHO_CPU=1`) for SwiftShader everywhere: the same pixels on every machine, about 4× slower.
 
 While a job runs, the editor's live preview is held still, because its animation loop competes for the main thread.
 
-With `serve` running, timings on an M-series Mac for a 14-layer animated poster:
+With `serve` running, on an M-series Mac:
 
 | Command | Time |
 | --- | --- |
-| `render` | 0.2 s |
+| `render` (14-layer animated poster) | 0.2 s |
 | six-frame filmstrip | 0.3 s |
 | six-cell `vary` | 0.8 s |
-| full `check` | 1.9 s |
+| full `check` (14 layers) | 1.9 s |
+| `make` (4-layer animated poster: build, layout, fixes, check, picture) | 0.9 s |
+| `set --check` | 0.6–1.1 s |
 
 Under `serve`, edits to the app's TypeScript reload the page by themselves. After an engine (Rust) change, run `npm run wasm:dev`.
 
@@ -121,6 +273,11 @@ Under `serve`, edits to the app's TypeScript reload the page by themselves. Afte
 
 | File | What it does |
 | --- | --- |
+| `ui/src/agent/make.ts` | Specs to projects: layers bottom first, kit looks by role, modifiers, settings, motion recipes; the layout comes back as instructions for the page to resolve. |
+| `ui/src/agent/place.ts` | Layout in words (fit, place, stack, row, centre, contain) and `align`, as edits computed from build boxes. |
+| `ui/src/agent/kits.ts` | The style kits. A test checks that every font, preset and background they name exists. |
+| `ui/src/agent/moves.ts` | Motion recipes, and ways out timed to end before a looping clock does. |
+| `ui/src/agent/fix.ts` | What `--fix` does (retiming, the loop seam), the commands it leaves, and the difference between two checks. |
 | `ui/src/agent/catalog.ts` | Generates the catalog from the same registries the Inspector draws from (`EFFECTS`, `PRESETS`, `MODIFIER_UI`, `SYMBOL_UI`, `LOOP_UI`, …), so new materials, modifiers and shapes show up without touching it. A test fails if the layer-format notes miss a field that the layer factories create. |
 | `ui/src/agent/describe.ts` | The text tree. |
 | `ui/src/agent/edit.ts` | Assignments and their checks. |
@@ -128,6 +285,6 @@ Under `serve`, edits to the app's TypeScript reload the page by themselves. Afte
 | `ui/src/agent/layout.ts` | Boxes, layout notes, balance and palette. |
 | `ui/src/agent/timing.ts` | The timing chart and rhythm notes (from the timeline dock's own tracks). |
 | `ui/src/agent/check.ts` | Structural checks and the pixel measures (pure, unit-tested). |
-| `ui/src/agent/page.ts` | The in-app side, on `await window.morphotype.agent()` (its own chunk). Loads a project with its fonts and pictures, builds it at export quality, and draws frames through the renderer's export path. Contact sheets are composed in an `OffscreenCanvas`. |
+| `ui/src/agent/page.ts` | The in-app side, on `await window.morphotype.agent()` (its own chunk). Loads a project with its fonts and pictures, builds it at export quality, resolves layout against the build, draws frames through the renderer's export path, and runs `make`, `check` and `--fix`. Contact sheets are composed in an `OffscreenCanvas`. |
 | `ui/src/agent/node.ts` | What the no-browser commands load in Node through Vite's SSR loader. |
-| `scripts/morpho.mjs` | The CLI: argument parsing, Vite and Playwright, the `serve` daemon (`MORPHO_PORT`, default 7801). |
+| `scripts/morpho.mjs` | The CLI: argument parsing, next-step hints, the findings kept for `--check` (`test-results/morpho/.checks/`), Vite and Playwright, the `serve` daemon. |
diff --git a/scripts/e2e.mjs b/scripts/e2e.mjs
index 52d8960..4da8f27 100644
--- a/scripts/e2e.mjs
+++ b/scripts/e2e.mjs
@@ -907,7 +907,15 @@ try {
       const layout = await a.layout();
       const video = await a.frameBatch({ fps: 10, from: 0, count: 3, size: 120 });
       const aligned = await a.align(['Caption'], 'canvas', ['centre']);
-      return { changes, still: [still.width, still.height], strip: [strip.width, strip.height], grid: [grid.width, grid.height], report, text: a.describe(), layout, video: [video.frames.length, video.total], aligned: aligned.change };
+      const text = a.describe();
+      // A whole design from a spec: kit, layout in words, a motion recipe, checked, one picture.
+      const made = await a.make({ canvas: '1080x1350', kit: 'chrome-night', duration: 3, layers: [{ text: 'HELLO', name: 'Title', fitWidth: 70, place: 'top third' }, { text: 'small print', name: 'Info', place: 'bottom', margin: 90 }], motion: { recipe: 'cascade' } }, { size: 200 });
+      const title = made.project.layers.find((l) => l.name === 'Title');
+      const box = window.morphotype.store.get().build.layers.find((l) => l.id === title.id).bbox;
+      // A design with text cut off and an entrance that replays: --fix mends both.
+      await a.load({ ...made.project, layers: made.project.layers.map((l) => (l.name === 'Title' ? { ...l, x: l.x + 600, motion: { ...l.motion, leave: 'none' } } : l)) });
+      const fixed = await a.checkFix({ size: 200, layers: 2 });
+      return { changes, still: [still.width, still.height], strip: [strip.width, strip.height], grid: [grid.width, grid.height], report, text, layout, video: [video.frames.length, video.total], aligned: aligned.change, made: { text: made.text, width: made.width, box }, fixed: fixed.text };
     });
   });
   check(agent.changes.length === 2 && agent.text.includes('flat {fill #ff2d55}'), `agent edits the design (${agent.changes[0]})`);
@@ -916,6 +924,9 @@ try {
   check(/margins L .* R /.test(agent.layout) && /palette: /.test(agent.report), 'agent layout lists boxes and margins, and check reads the palette');
   check(agent.video[0] === 3 && agent.video[1] === 40, `agent draws video frames in batches (${agent.video.join(' of ')})`);
   check(/Caption" x:|already aligned/.test(agent.aligned), `agent aligns by what's drawn (${agent.aligned})`);
+  check(/kit chrome-night/.test(agent.made.text) && /no problems/.test(agent.made.text) && agent.made.width > 0, `agent makes a design from a spec: ${agent.made.text.split('\n').find((l) => l.includes('no problems') || l.includes('problem')) ?? agent.made.text.split('\n')[0]}`);
+  check(Math.abs((agent.made.box[2] - agent.made.box[0]) / 1080 - 0.7) < 0.01 && Math.abs((agent.made.box[1] + agent.made.box[3]) / 2 + 225) < 2, `agent layout fits the title to 70% of the width on the top third line (box ${agent.made.box.map(Math.round).join(', ')})`);
+  check(/fixed \d+:/.test(agent.fixed) && /cut off → shrunk to fit/.test(agent.fixed) && /loop starts over from nothing/.test(agent.fixed), `agent check --fix mends cut-off text and the loop seam: ${agent.fixed.split('\n')[0]}`);
 } catch (e) {
   errors.push(`crashed: ${e.message.split('\n').slice(0, 12).join(' / ')}`);
   const pages = browser.contexts().flatMap((c) => c.pages());
diff --git a/scripts/morpho.mjs b/scripts/morpho.mjs
index 5e9db86..d9ad1f4 100644
--- a/scripts/morpho.mjs
+++ b/scripts/morpho.mjs
@@ -3,7 +3,8 @@
 // design, editing it and judging it doesn't take source reading or a pile of
 // screenshots.
 //
-//   npm run morpho -- catalog [name|section]     what materials, modifiers, shapes, motion… exist
+//   npm run morpho -- make <spec.json> [-o f]     a whole design from one spec: built, placed, checked, one PNG
+//   npm run morpho -- catalog [name|section]     what kits, materials, modifiers, shapes, motion… exist
 //   npm run morpho -- describe <scene>            the design as a text tree (changed settings only)
 //   npm run morpho -- scene <template> [-o f]     save a template as an editable .morpho file
 //   npm run morpho -- set <file> <a=b>…           edit a .morpho file; prints what changed
@@ -32,19 +33,30 @@ const OUT_DIR = path.join(root, 'test-results/morpho');
 
 const HELP = `morpho <command> [args] [options]
 
-  catalog [query]          index; a section (materials, modifiers, shapes, motion, keyframes,
+  the workflow: make → check (--fix) → vary → video (docs/AGENT-TOOLS.md)
+
+  make <spec.json> [-o f]  a whole design from one spec (canvas, kit, layers, layout, motion):
+                           builds it, places it, fixes what's mechanical (--no-fix to skip),
+                           checks it and draws one PNG. Re-run after editing the spec.
+                           --kit name, --style poster|logo|abstract, --at 0,1,rest
+  catalog [query]          index; a section (kits, materials, modifiers, shapes, motion, keyframes,
                            layers, presets, recipes, fonts, backgrounds, canvas, templates);
-                           or any name (chrome, glitch, star, "Ice chrome")
+                           or any name (chrome, glitch, star, "Ice chrome", chrome-night)
   describe <scene>         every layer, top first, with the settings that differ from defaults
   scene <template> [-o f]  write a template as a .morpho file to edit (default: <slug>.morpho)
   set <file> <a=b>…        edit a .morpho file in place (--dry to only print the changes)
-                           also Layer.preset="Ice chrome" and Layer.recipe=Glitch
+                           also Layer.preset="Ice chrome" and Layer.recipe=Glitch, layout
+                           (Layer.place=top, .fitWidth=80, .margin=64, .centre=x, .contain=true),
+                           --stack A,B (or --row A,B) --gap 40 --align centre --place centre,
+                           --style poster|logo|abstract, and --check: what that did to the findings
   new <file>               a blank design: --canvas 1080x1350 | "Instagram post", --bg "#111" |
-                           "#a,#b" | Midnight, --name, --duration 4
+                           "#a,#b" | Midnight, --name, --duration 4, --kit name, --style poster|logo|abstract
   add <file> text "HI"     a layer: text "…" | shape star | line "<svg d>" | path "<svg d>", with
                            --name --at x,y --size --font --color --material chrome | --preset "Ice
                            chrome" --recipe Glitch --rotation --scale --width (lines) and
-                           --above L | --below L | --into Group (default: on top)
+                           --above L | --below L | --into Group (default: on top); with a kit,
+                           --role headline|accent|body; layout: --fit-width 80 --fit-height 30
+                           --place "top third" --margin 64 --centre x|y|both
   add <file> modifier glitch --to L [--fields '{"amount":0.6}']   (or a recipe name)
   add <file> group A B [--name G] [--merge]
   add <file> font f.ttf    embed a font; prints the id for --font
@@ -55,13 +67,19 @@ const HELP = `morpho <command> [args] [options]
                            top, bottom, middle (comma-separated for both axes)
   layout <scene>           every layer's box and margins, plus near-misses, crowding and hierarchy
   timing <scene>           when everything moves: bars on the clock and notes on rhythm
+  motion <file> [L…]       motion over several layers at once (default: all, bottom up): --recipe
+                           cascade|pop|type-on|slide-in|drop|drift|breathe, or --enter rise
+                           --stagger 0.15 --feel Smooth --start 0.2 --duration 0.6 --letters
+                           --loop float --spread 0.25 --leave auto|none|fade|rise…
   video <scene>            -o f.mp4 | f.webm | f.gif | dir/ (PNG frames); --fps (30, GIF 20),
                            --size (GIF default 480) or --scale
   fit <scene> <ref> L.k…   tune each setting until the design matches the reference picture;
                            writes the file (or --out), prints before → after
   render <scene>           PNG; one time draws the frame, several draw a captioned filmstrip
   vary <scene>             one PNG with a captioned cell per variation
-  check <scene>            structural and visual problems, as text
+  check <scene>            structural and visual problems, as text; --fix applies the mechanical
+                           fixes (cut-off text, nearly centred, loop seams, moves the clock cuts
+                           off) and prints the rest as commands; --style for this check only
   compare <scene> <image>  how close the design is to a reference (PNG/JPEG), with a difference image
   serve                    keep Vite and a browser running; drawing commands use it when up
 
@@ -91,7 +109,7 @@ options:
 
 function parse(argv) {
   const pos = [], opt = { set: [], vary: [], variant: [] };
-  const flags = new Set(['cpu', 'json', 'dry', 'transparent', 'merge', 'force']);
+  const flags = new Set(['cpu', 'json', 'dry', 'transparent', 'merge', 'force', 'fix', 'no-fix', 'check', 'letters']);
   for (let i = 0; i < argv.length; i++) {
     const a = argv[i];
     if (a === '-o') opt.out = argv[++i];
@@ -216,6 +234,7 @@ async function startApp(gpu) {
 async function runInPage({ scene, set, op, opts }) {
   const a = await window.morphotype.agent();
   return a.quietly(async () => {
+    if (op === 'make') return { changes: [], name: opts.spec?.name, ...(await a.make(opts.spec, opts)) };
     // Later batches of a video reuse the design the first one loaded.
     const key = JSON.stringify([scene, set]);
     let changes = [];
@@ -232,7 +251,9 @@ async function runInPage({ scene, set, op, opts }) {
     const name = p.name;
     if (op === 'render') return { changes, name, ...(await a.render(opts)) };
     if (op === 'vary') return { changes, name, ...(await a.vary(opts.variants, { ...opts, at: opts.at?.[0] ?? null })) };
-    if (op === 'check') return { changes, name, text: await a.check(opts) };
+    if (op === 'check') return { changes, name, ...(await (opts.fix ? a.checkFix(opts) : a.checkFull(opts))) };
+    if (op === 'checkdiff') return { changes, name, ...(await a.checkDiff(opts.before, opts.beforeProject, opts)) };
+    if (op === 'place') return { changes, name, ...(await a.place(opts.ops)) };
     if (op === 'compare') return { changes, name, ...(await a.compare(opts.ref, { ...opts, at: opts.at?.[0] ?? null })) };
     if (op === 'align') return { changes, name, ...(await a.align(opts.targets, opts.to, opts.edges)) };
     if (op === 'layout') return { changes, name, text: await a.layout() };
@@ -333,7 +354,7 @@ const placeOpts = (opt) => ({ name: opt.name, at: opt.at, rotation: num(opt.rota
 /** A page job that changes a file: send the design, write back what comes back. */
 async function pageEdit(file, opt, op, opts) {
   if (!file || !existsSync(file)) throw new Error(`Needs a .morpho file${file ? `; "${file}" doesn't exist` : ''}`);
-  const r = await drawJob({ scene: { project: JSON.parse(await readFile(file, 'utf8')) }, set: opt.set, op, opts }, !(opt.cpu || process.env.MORPHO_CPU));
+  const r = await drawJob({ scene: { project: JSON.parse(await readFile(file, 'utf8')) }, set: opt.set, op, opts }, gpu(opt));
   const out = opt.out ?? file;
   if (!opt.dry) await writeFile(out, JSON.stringify(r.project, null, 1));
   return [...(r.changes ?? []).map((c) => `set ${c}`), r.change ?? r.text, out !== file ? `wrote ${out}` : ''].filter(Boolean).join('\n');
@@ -391,10 +412,65 @@ async function video(s, opt) {
   return `wrote ${shown && !shown.startsWith('..') ? shown : out}: ${total} frames at ${fps} fps, ${info.width}×${info.height}, ${info.duration}s${info.loop ? ' (loops seamlessly)' : ''}`;
 }
 
+const gpu = (opt) => !(opt.cpu || process.env.MORPHO_CPU);
+const q = (f) => (/^[\w./-]+$/.test(f) ? f : JSON.stringify(f));
+
+// ---------- check results kept by file content, so set --check only checks the new version ----------
+
+const CHECKS = path.join(OUT_DIR, '.checks');
+const checkKey = async (text, style) => (await import('node:crypto')).createHash('sha1').update(`${style ?? ''}\n${text}`).digest('hex').slice(0, 20);
+async function keepFindings(text, style, findings) {
+  if (!findings) return;
+  await mkdir(CHECKS, { recursive: true });
+  await writeFile(path.join(CHECKS, `${await checkKey(text, style)}.json`), JSON.stringify(findings));
+}
+async function keptFindings(text, style) {
+  try {
+    return JSON.parse(await readFile(path.join(CHECKS, `${await checkKey(text, style)}.json`), 'utf8'));
+  } catch {
+    return null;
+  }
+}
+
+/** What the findings leave to do: fixable ones, ones with a command, or nothing. */
+const left = (findings = []) => ({ fixable: findings.some((f) => f.level !== 'info' && f.fix), todo: findings.some((f) => f.level !== 'info' && !f.fix), problems: findings.filter((f) => f.level !== 'info').length });
+
+/** The likely next command after a design is in good shape: a video when it moves, a still when it doesn't. */
+const finish = (file, moving) => (moving ? `morpho video ${q(file)} -o ${slug(file)}.mp4 (or vary to compare options first)` : `morpho render ${q(file)} --out ${slug(file)}.png (or vary to compare options first)`);
+
+/** Layout from add's options: one placement for the new layer. */
+function addLayout(opt, id) {
+  const o = { target: `#${id}` };
+  if (opt['fit-width'] !== undefined) o.fitWidth = Number(opt['fit-width']);
+  if (opt['fit-height'] !== undefined) o.fitHeight = Number(opt['fit-height']);
+  if (opt.place) o.place = opt.place;
+  if (opt.margin !== undefined) o.margin = /%$/.test(opt.margin) ? opt.margin : Number(opt.margin);
+  if (opt.centre ?? opt.center) o.centre = opt.centre ?? opt.center;
+  return Object.keys(o).length > 1 ? [o] : [];
+}
+
+/** Stacks and rows from set's options. */
+function stackLayout(opt) {
+  const list = (v) => String(v).split(',').map((x) => x.trim()).filter(Boolean);
+  const out = [];
+  for (const k of ['stack', 'row']) {
+    if (!opt[k]) continue;
+    out.push({ [k]: list(opt[k]), gap: opt.gap !== undefined ? Number(opt.gap) : undefined, align: opt.align, place: opt.place, margin: opt.margin === undefined ? undefined : /%$/.test(opt.margin) ? opt.margin : Number(opt.margin) });
+  }
+  return out;
+}
+
+/** A motion recipe from the command line. */
+function moveSpec(opt, layers) {
+  const n = (k) => (opt[k] === undefined ? undefined : Number(opt[k]));
+  return { layers: layers.length ? layers : 'all', recipe: opt.recipe, enter: opt.enter, leave: opt.leave, loop: opt.loop, stagger: n('stagger'), start: n('start'), feel: opt.feel, duration: n('duration'), distance: n('distance'), letters: opt.letters ? (opt.words ? 'words' : 'letters') : undefined, letterStagger: n('letter-stagger'), period: n('period'), amount: n('amount'), spread: n('spread'), leaveAt: n('leave-at') };
+}
+
 async function main() {
   const { cmd, args, opt } = parse(process.argv.slice(2));
   const t0 = performance.now();
   const say = (s) => process.stdout.write(s.endsWith('\n') ? s : s + '\n');
+  const next = (s) => say(`next: ${s}`);
   const done = () => process.stderr.write(`(${((performance.now() - t0) / 1000).toFixed(1)} s)\n`);
   switch (cmd) {
     case undefined:
@@ -404,6 +480,31 @@ async function main() {
     case 'catalog': {
       const a = await nodeAgent();
       say(a.catalog(args.join(' ')));
+      next(args.length ? 'put it in a spec and run morpho make spec.json' : 'morpho catalog kits, then write a spec and run morpho make spec.json');
+      break;
+    }
+    case 'make': {
+      const [file] = args;
+      if (!file || !existsSync(file)) throw new Error(`make needs a spec file${file ? `; "${file}" doesn't exist` : ''} (JSON: { "canvas": "1080x1350", "kit": "chrome-night", "layers": [ … ] }; see docs/AGENT-TOOLS.md)`);
+      let spec;
+      try {
+        spec = JSON.parse(await readFile(file, 'utf8'));
+      } catch (e) {
+        throw new Error(`${file} isn't valid JSON: ${e.message}`);
+      }
+      const out = opt.out ?? file.replace(/\.json$/i, '') + '.morpho';
+      if (out === file) throw new Error('make writes a .morpho file next to the spec; give -o for another name');
+      const at = opt.at || opt.frames ? times(opt) : undefined;
+      const r = await drawJob({ scene: null, set: [], op: 'make', opts: { spec, kit: opt.kit, style: opt.style, fix: !opt['no-fix'], at, file: out } }, gpu(opt));
+      const text = JSON.stringify(r.project, null, 1);
+      await writeFile(out, text);
+      await keepFindings(text, undefined, r.findings);
+      say(`wrote ${out} from ${file}`);
+      say(r.text);
+      say(`wrote ${await writePng(r.png, { ...opt, out: undefined }, out, 'make')} (${r.width}×${r.height})`);
+      for (const e of r.pageErrors ?? []) process.stderr.write(`page error: ${e}\n`);
+      const l = left(r.findings);
+      next(l.todo ? `run the commands under "still to do" (add --check to see what each changes), or edit ${file} and make again` : finish(out, r.moving));
       break;
     }
     case 'describe': {
@@ -412,6 +513,7 @@ async function main() {
       let p = s.project ? a.migrate(s.project) : a.template(s.template);
       if (opt.set.length) p = a.applyEdits(p, opt.set).project;
       say(a.describe(p));
+      next(s.template ? `morpho scene ${q(args[0])} -o ${slug(p.name)}.morpho, then set or check it` : `morpho set ${q(args[0])} Layer.setting=value --check`);
       break;
     }
     case 'timing': {
@@ -420,17 +522,19 @@ async function main() {
       let p = s.project ? a.migrate(s.project) : a.template(s.template);
       if (opt.set.length) p = a.applyEdits(p, opt.set).project;
       say(a.timing(p));
+      next(s.project ? `morpho motion ${q(args[0])} <layers…> --recipe cascade (or set 'L.motion.delay=…'), then check` : `morpho scene ${q(args[0])} to edit it`);
       break;
     }
     case 'new': {
       const [file] = args;
-      if (!file) throw new Error('new needs a file name: morpho new poster.morpho --canvas 1080x1350 --bg "#111111"');
+      if (!file) throw new Error('new needs a file name: morpho new poster.morpho --canvas 1080x1350 --bg "#111111" (or --kit chrome-night)');
       if (existsSync(file) && !opt.force) throw new Error(`${file} already exists (add --force to replace it)`);
       const a = await nodeAgent();
-      let p = a.blank({ name: opt.name ?? slug(file).replace(/-/g, ' '), canvas: opt.canvas, background: opt.bg, duration: num(opt.duration) });
+      let p = a.newDesign({ name: opt.name ?? slug(file).replace(/-/g, ' '), canvas: opt.canvas, background: opt.bg, duration: num(opt.duration), kit: opt.kit, style: opt.style });
       if (opt.set.length) p = a.applyEdits(p, opt.set).project;
       await writeFile(file, JSON.stringify(p, null, 1));
-      say(`wrote ${file}: "${p.name}" ${p.canvas.width}×${p.canvas.height}, no layers yet. Next: morpho add ${file} text "HELLO" --size 200`);
+      say(`wrote ${file}: "${p.name}" ${p.canvas.width}×${p.canvas.height}${p.agent?.kit ? `, kit ${p.agent.kit}` : ''}${p.agent?.style ? `, ${p.agent.style}` : ''}, no layers yet`);
+      next(`morpho add ${q(file)} text "HELLO" --fit-width 80 --place "top third" (one spec and morpho make is quicker for a whole design)`);
       break;
     }
     case 'add': {
@@ -440,8 +544,10 @@ async function main() {
         if (!what || !existsSync(what)) throw new Error(`add ${kind} needs a file${what ? `; "${what}" doesn't exist` : ''}`);
         const data = (await readFile(what)).toString('base64');
         say(await pageEdit(file, opt, kind, { data, name: path.basename(what), to: opt.to }));
+        next(kind === 'font' ? `morpho add ${q(file)} text "HELLO" --font <the id above>` : `morpho check ${q(file)}`);
         break;
       }
+      let id = null;
       say(
         await editFile(file, opt, (a, p) => {
           if (kind === 'modifier' || kind === 'mod') {
@@ -450,19 +556,40 @@ async function main() {
           }
           if (kind === 'group') return a.addGroup(p, rest, { ...placeOpts(opt), merge: !!opt.merge });
           if (!kind || !what) throw new Error('add <file> text "HELLO" | shape star | line "<svg d>" | path "<svg d>" | modifier <kind> --to L | group A B | font f.ttf | image p.png');
-          return a.addLayer(p, kind, what, placeOpts(opt));
+          const r = a.addWithKit(p, kind, what, { ...placeOpts(opt), role: opt.role });
+          id = r.id;
+          return r;
+        }),
+      );
+      const ops = id && !opt.dry ? addLayout(opt, id) : [];
+      if (ops.length) say(await pageEdit(file, { ...opt, set: [] }, 'place', { ops }));
+      next(`morpho check ${q(file)} (or add the next layer)`);
+      break;
+    }
+    case 'motion': {
+      const [file, ...layers] = args;
+      const spec = moveSpec(opt, layers);
+      if (!spec.recipe && !spec.enter && !spec.loop && !spec.leave) throw new Error('motion needs --recipe (cascade, pop, type-on, slide-in, drop, drift, breathe) or --enter / --loop / --leave');
+      say(
+        await editFile(file, opt, (a, p) => {
+          const r = a.moveEdits(p, spec);
+          return { project: r.project, change: `${r.summary} (${r.edits.length} settings)` };
         }),
       );
+      next(`morpho timing ${q(file)} to see it on the clock, or morpho check ${q(file)}`);
       break;
     }
     case 'remove':
       say(await editFile(args[0], opt, (a, p) => a.removeLayers(p, args.slice(1))));
+      next(`morpho check ${q(args[0])}`);
       break;
     case 'duplicate':
       say(await editFile(args[0], opt, (a, p) => a.duplicateLayer(p, args[1], placeOpts(opt))));
+      next(`morpho set ${q(args[0])} '<copy>.x=…' --check`);
       break;
     case 'arrange':
       say(await editFile(args[0], opt, (a, p) => a.arrange(p, args[1], args[2], args[3])));
+      next(`morpho check ${q(args[0])}`);
       break;
     case 'fit': {
       const [file, ref, ...targets] = args;
@@ -475,16 +602,19 @@ async function main() {
         await writeFile(opt.out, JSON.stringify(a.template(s.template), null, 1));
         say(await pageEdit(opt.out, opt, 'fit', { ref: (await readFile(ref)).toString('base64'), targets }));
       } else say(await pageEdit(file, opt, 'fit', { ref: (await readFile(ref)).toString('base64'), targets }));
+      next(`morpho compare ${q(opt.out ?? file)} ${q(ref)}`);
       break;
     }
     case 'align': {
       const [file, ...targets] = args;
       if (!targets.length) throw new Error('align <file> <layer>… [--to canvas|Layer] [--edge centre,middle]');
       say(await pageEdit(file, opt, 'align', { targets, to: opt.to ?? 'canvas', edges: String(opt.edge ?? 'centre').split(',') }));
+      next(`morpho check ${q(file)}`);
       break;
     }
     case 'video':
       say(await video(await scene(args[0]), opt));
+      next('done: share the file; to change it, edit the spec and run morpho make again');
       break;
     case 'scene': {
       const a = await nodeAgent();
@@ -492,17 +622,41 @@ async function main() {
       const p = a.template(args[0]);
       const out = opt.out ?? `${slug(p.name)}.morpho`;
       await writeFile(out, JSON.stringify(p, null, 1));
-      say(`wrote ${out}: "${p.name}", ${p.layers.length} top-level layers. Edit with: morpho set ${out} Layer.setting=value`);
+      say(`wrote ${out}: "${p.name}", ${p.layers.length} top-level layers`);
+      next(`morpho describe ${q(out)}, then morpho set ${q(out)} Layer.setting=value --check`);
       break;
     }
     case 'set': {
       const [file, ...assign] = args;
-      if (!file || !existsSync(file)) throw new Error(`set needs a .morpho file first${file ? `; "${file}" doesn't exist` : ''} (make one with: morpho scene <template>)`);
-      if (!assign.length) throw new Error('set needs at least one Layer.setting=value');
+      if (!file || !existsSync(file)) throw new Error(`set needs a .morpho file first${file ? `; "${file}" doesn't exist` : ''} (make one with: morpho make spec.json, or morpho scene <template>)`);
+      const stacks = stackLayout(opt);
+      if (!assign.length && !stacks.length && !opt.style) throw new Error('set needs at least one Layer.setting=value (or --stack A,B, or --style)');
       const a = await nodeAgent();
-      const { project, changes } = a.applyEdits(a.migrate(JSON.parse(await readFile(file, 'utf8'))), assign);
-      if (!opt.dry) await writeFile(file, JSON.stringify(project, null, 1));
-      say(changes.join('\n') + (opt.dry ? '\n(dry run: file unchanged)' : ''));
+      const before = await readFile(file, 'utf8');
+      const { ops, rest } = a.layoutFromAssignments(assign);
+      let { project, changes } = a.applyEdits(a.migrate(JSON.parse(before)), rest);
+      if (opt.style) {
+        if (!['poster', 'logo', 'abstract'].includes(opt.style)) throw new Error(`--style is poster, logo or abstract, not "${opt.style}"`);
+        changes.push(`style: ${project.agent?.style ?? 'poster'} → ${opt.style}`);
+        project = { ...project, agent: { ...project.agent, style: opt.style } };
+      }
+      if (opt.dry) {
+        say([...changes, ...(ops.length || stacks.length ? ['(layout is resolved against the build, so a dry run leaves it out)'] : []), '(dry run: file unchanged)'].join('\n'));
+        break;
+      }
+      await writeFile(file, JSON.stringify(project, null, 1));
+      if (changes.length) say(changes.join('\n'));
+      const layout = [...ops, ...stacks];
+      if (layout.length) say(await pageEdit(file, { ...opt, set: [] }, 'place', { ops: layout }));
+      if (opt.check) {
+        const after = await readFile(file, 'utf8');
+        const kept = await keptFindings(before, undefined);
+        const r = await drawJob({ scene: { project: JSON.parse(after) }, set: [], op: 'checkdiff', opts: { before: kept, beforeProject: kept ? null : JSON.parse(before), layers: opt.layers ? Number(opt.layers) : undefined, file } }, gpu(opt));
+        await keepFindings(after, undefined, r.findings);
+        say(r.text);
+        const l = left(r.findings);
+        next(l.fixable ? `morpho check ${q(file)} --fix` : l.todo ? 'the commands under "to do", with --check' : finish(file, r.moving));
+      } else next(`morpho check ${q(file)} (or add --check to set: only what changed in the findings)`);
       break;
     }
     case 'render':
@@ -520,21 +674,42 @@ async function main() {
         opts.variants = variants(opt);
         if (!opts.variants.length) throw new Error('vary needs --vary Layer.setting=a,b,c or --variant "a=1; b=2"');
       }
-      const r = await drawJob({ scene: { template: s.template, project: s.project }, set: opt.set, op: cmd, opts }, !(opt.cpu || process.env.MORPHO_CPU));
+      if (cmd === 'check') {
+        if (opt.style && !['poster', 'logo', 'abstract'].includes(opt.style)) throw new Error(`--style is poster, logo or abstract, not "${opt.style}"`);
+        Object.assign(opts, { fix: !!opt.fix, style: opt.style, file: s.project ? args[0] : `${slug(s.name)}.morpho` });
+        if (opt.fix && s.template) opt.out ??= `${slug(s.name)}.morpho`;
+      }
+      const r = await drawJob({ scene: { template: s.template, project: s.project }, set: opt.set, op: cmd, opts }, gpu(opt));
       if (opt.json) {
-        const { png, ...rest } = r;
+        const { png, project, ...rest } = r;
         if (png) rest.out = await writePng(png, opt, s.name, cmd);
         say(JSON.stringify(rest, null, 1));
         break;
       }
       for (const c of r.changes ?? []) say(`set ${c}`);
+      if (cmd === 'check' && r.project && opt.fix && !opt.dry) {
+        // --fix writes the fixed design: over the file, or (for a template or --out) to a new one.
+        const out = opt.out ?? args[0];
+        const text = JSON.stringify(r.project, null, 1);
+        if (r.fixed || out !== args[0]) await writeFile(out, text);
+        await keepFindings(text, opt.style, r.findings);
+        if (out !== args[0]) say(`wrote ${out}`);
+      } else if (cmd === 'check' && s.project && !opt.set.length) await keepFindings(await readFile(args[0], 'utf8'), opt.style, r.findings);
       if (r.text) say(r.text);
       if (r.png) say(`wrote ${await writePng(r.png, opt, s.name, cmd === 'render' && (opts.at.frames || opts.at.length > 1) ? 'frames' : cmd)} (${r.width}×${r.height})`);
       for (const e of r.pageErrors ?? []) process.stderr.write(`page error: ${e}\n`);
+      const f = q(cmd === 'check' && opt.fix ? (opt.out ?? args[0]) : args[0]);
+      if (cmd === 'check') {
+        const l = left(r.findings);
+        next(l.fixable ? `morpho check ${f} --fix` : l.todo ? `run the commands above (set … --check shows what each changes)` : finish(opt.out ?? args[0], r.moving));
+      } else if (cmd === 'render') next(`morpho check ${f}`);
+      else if (cmd === 'vary') next(`morpho set ${s.project ? f : '<file>'} <the cell's settings> --check`);
+      else if (cmd === 'layout') next(`morpho set ${s.project ? f : '<file>'} 'Layer.place=top' 'Layer.margin=64' (or --stack A,B --gap 40)`);
+      else next(`morpho fit ${f} ${q(args[1])} Layer.x Layer.size …`);
       break;
     }
     case 'serve':
-      return serve(!(opt.cpu || process.env.MORPHO_CPU));
+      return serve(gpu(opt));
     case 'stop':
       await fetch(`http://127.0.0.1:${PORT}/stop`).catch(() => {});
       return say('stopped');
diff --git a/ui/src/agent/agent.test.ts b/ui/src/agent/agent.test.ts
index 5ac6e92..7e97e9f 100644
--- a/ui/src/agent/agent.test.ts
+++ b/ui/src/agent/agent.test.ts
@@ -190,7 +190,7 @@ group('check', () => {
     const px = (rgb: number[], n = 4) => ({ data: new Uint8ClampedArray(Array.from({ length: n }, () => [...rgb, 255]).flat()), width: n, height: 1 });
     expect(diff(px([0, 0, 0]), px([30, 30, 30]))).toBe(30);
     expect(contrast(luminance(255, 255, 255), luminance(0, 0, 0))).toBeCloseTo(21);
-    expect(presence(px([255, 255, 255]), px([0, 0, 0]))).toEqual({ px: 4, contrast: 21 });
+    expect(presence(px([255, 255, 255]), px([0, 0, 0]))).toEqual({ px: 4, contrast: 21, behind: 0 });
     expect(presence(px([10, 10, 10]), px([10, 10, 10])).px).toBe(0);
   });
 
diff --git a/ui/src/agent/build.ts b/ui/src/agent/build.ts
index d59a65e..d26b53d 100644
--- a/ui/src/agent/build.ts
+++ b/ui/src/agent/build.ts
@@ -13,6 +13,8 @@ import { EditError, findNode } from './find';
 export interface Change {
   project: Project;
   change: string;
+  /** The new node's id, for what adds one. */
+  id?: string;
 }
 
 const norm = (s: string) => s.toLowerCase().replace(/[\s_·-]+/g, '');
@@ -151,7 +153,7 @@ export interface Add extends Place {
   font?: string;
   /** Pen lines: stroke width in px. */
   width?: number;
-  /** Flat colour shortcut (sets the material's fill, or flat with that fill). */
+  /** Colour shortcut: the material's main colour (fill, colour or ink), or flat in that colour. */
   color?: string;
 }
 
@@ -181,11 +183,13 @@ export function addLayer(p0: Project, kind: LayerKind, what: string, o: Add = {}
   look(n, o);
   if (o.color) {
     if (!/^#[0-9a-f]{6}$/i.test(o.color)) throw new EditError(`--color is #rrggbb, got "${o.color}"`);
-    if ('fill' in n.style.params) n.style.params.fill = o.color;
+    // The material's one main colour when it has one (a fill, a neon's glow, an ink); else flat in that colour.
+    const main = ['fill', 'color', 'ink'].find((k) => k in n.style.params);
+    if (main) n.style.params[main] = o.color;
     else n.style = style('flat', { fill: o.color });
   }
   insert(p, n, o);
-  return { project: p, change: `added "${n.name}" #${n.id}: ${kind} ${kind === 'text' ? `"${what.replace(/\\n/g, '⏎')}"` : kind === 'shape' ? what : 'path'} · ${n.style.effect}${n.modifiers.length ? ` · ${n.modifiers.map((m) => m.kind).join('+')}` : ''}` };
+  return { project: p, id: n.id, change: `added "${n.name}" #${n.id}: ${kind} ${kind === 'text' ? `"${what.replace(/\\n/g, '⏎')}"` : kind === 'shape' ? what : 'path'} · ${n.style.effect}${n.modifiers.length ? ` · ${n.modifiers.map((m) => m.kind).join('+')}` : ''}` };
 }
 
 /** A modifier on a layer, with its defaults and any `fields` over them. */
@@ -223,7 +227,7 @@ export function addGroup(p0: Project, members: string[], o: Place & { merge?: bo
   for (const x of [...order].reverse()) list.splice(x.h.i, 1);
   list.splice(at, 0, g);
   if (o.merge) look(g, o);
-  return { project: p, change: `grouped ${nodes.map((n) => n.name ?? n.id).join(', ')} as "${g.name}" #${g.id}${o.merge ? ' (merged into one shape)' : ''}` };
+  return { project: p, id: g.id, change: `grouped ${nodes.map((n) => n.name ?? n.id).join(', ')} as "${g.name}" #${g.id}${o.merge ? ' (merged into one shape)' : ''}` };
 }
 
 export function removeLayers(p0: Project, targets: string[]): Change {
@@ -259,7 +263,7 @@ export function duplicateLayer(p0: Project, target: string, o: Place = {}): Chan
     const h = home(p, n.id);
     h.list.splice(h.i + 1, 0, copy);
   }
-  return { project: p, change: `duplicated "${n.name ?? n.id}" as "${copy.name}" #${copy.id}` };
+  return { project: p, id: copy.id, change: `duplicated "${n.name ?? n.id}" as "${copy.name}" #${copy.id}` };
 }
 
 /** Restack: top, bottom, up, down, or above / below another layer (in its own list). */
diff --git a/ui/src/agent/catalog.ts b/ui/src/agent/catalog.ts
index bf36130..56d4d6b 100644
--- a/ui/src/agent/catalog.ts
+++ b/ui/src/agent/catalog.ts
@@ -11,8 +11,10 @@ import { ENTER_OPTIONS, ENTER_UI, EASES, FEELS, LEAVE_OPTIONS, LEAVE_UI, LOOP_OP
 import { CANVAS_PRESETS, isChoice, MODIFIER_DEFAULTS, MODIFIER_UI, SYMBOL_DEFAULTS, SYMBOL_UI, type Field } from '../state/model';
 import type { ModifierKind, SymbolKind } from '../engine/types';
 import type { Template } from '../state/templates';
+import { KITS, kitsText, kitText } from './kits';
+import { recipesText } from './moves';
 
-export const SECTIONS = ['materials', 'presets', 'modifiers', 'recipes', 'shapes', 'motion', 'keyframes', 'layers', 'fonts', 'backgrounds', 'canvas', 'templates'] as const;
+export const SECTIONS = ['kits', 'materials', 'presets', 'modifiers', 'recipes', 'shapes', 'motion', 'keyframes', 'layers', 'fonts', 'backgrounds', 'canvas', 'templates'] as const;
 export type Section = (typeof SECTIONS)[number];
 
 const fmt = (v: unknown) => (typeof v === 'number' ? String(+v.toFixed(4)) : typeof v === 'string' ? v : JSON.stringify(v));
@@ -91,6 +93,7 @@ const MOTION = (): string =>
     '  stagger: s between children (groups) or letters · order: ' + STAGGER_ORDERS.map((o) => o.value).join('|'),
     '  letters: letters|words (text: each moves in turn) · slide: dir right|left|up|down, oneWay, easePass',
     'scene clock: project.timeline = { duration: s, loop: bool } (default 6 s, looping)',
+    recipesText(),
   ].join('\n');
 
 const KEYFRAMES = (): string =>
@@ -143,6 +146,8 @@ function templatesText(list: Template[] | null): string {
 
 function section(s: Section, templates: Template[] | null): string {
   switch (s) {
+    case 'kits':
+      return kitsText();
     case 'materials':
       return EFFECTS.map((e) => `${e.id} — ${e.name}: ${first(e.description)}`).join('\n') + '\n(details: catalog <id>)';
     case 'presets':
@@ -174,6 +179,7 @@ function index(templates: Template[] | null): string {
   const names = (xs: string[]) => xs.join(', ');
   return [
     'Morphotype catalog. Ask for a section or any name below for details.',
+    `kits (${KITS.length}): ${names(KITS.map((k) => k.name))} (background, palette, fonts and looks in one word)`,
     `materials (${EFFECTS.length}): ${names(EFFECTS.map((e) => e.id))}`,
     `presets (${PRESETS.length}): material looks by name`,
     `modifiers (${Object.keys(MODIFIER_UI).length}): ${names(Object.keys(MODIFIER_UI))}`,
@@ -208,6 +214,8 @@ export function catalog(query = '', templates: Template[] | null = null): string
   if (pre) out.push(`preset ${pre.name}: material ${pre.effect}, background ${pre.bg}\n  params: ${JSON.stringify(pre.params)}\n  (other params keep the material's defaults: catalog ${pre.effect})`);
   const rec = SHAPE_RECIPES.find((r) => norm(r.name) === k);
   if (rec) out.push(`recipe ${rec.name}: ${rec.mods.map((m) => JSON.stringify(m)).join(' + ')}`);
+  const kit = KITS.find((x) => norm(x.name) === k);
+  if (kit) out.push(`kit ${kitText(kit)}`);
   const tpl = templates?.find((t) => norm(t.name) === k);
   if (tpl) out.push(`template ${tpl.name} (${tpl.category}) — ${tpl.hint}\n  (see it as layers: describe "${tpl.name}")`);
   if (out.length) return out.join('\n\n');
@@ -224,6 +232,7 @@ function search(k: string, templates: Template[] | null): string {
   for (const r of SHAPE_RECIPES) if (has(r.name, r.tags)) hits.push(`recipe ${r.name}`);
   for (const [s, ui] of Object.entries(SYMBOL_UI)) if (has(s, ui.label)) hits.push(`shape ${s} — ${ui.label}`);
   for (const t of templates ?? []) if (has(t.name, t.hint)) hits.push(`template ${t.name}`);
+  for (const x of KITS) if (has(x.name, x.blurb)) hits.push(`kit ${x.name}`);
   if (!hits.length) return `Nothing matches "${k}". Sections: ${SECTIONS.join(', ')}.`;
   const more = hits.length > 40 ? `\n… and ${hits.length - 40} more` : '';
   return hits.slice(0, 40).join('\n') + more;
diff --git a/ui/src/agent/check.ts b/ui/src/agent/check.ts
index 5ea1d19..481c3d0 100644
--- a/ui/src/agent/check.ts
+++ b/ui/src/agent/check.ts
@@ -9,11 +9,21 @@ import { effectById, EFFECTS } from '../render/effects';
 import { timelineOf } from '../state/clock';
 import { isChoice, isGroup, MODIFIER_UI, SYMBOL_UI, type Node, type Project } from '../state/model';
 import { MORPH_KEY } from '../state/geoMotion';
+import { rowsOf } from '../state/tracks';
 import { num } from './describe';
+import type { LayoutOp } from './place';
+import { retime } from './fix';
+import { handle } from './find';
 
 export interface Finding {
   level: 'error' | 'warn' | 'info';
   text: string;
+  /** A rule of taste rather than a mistake: `--style abstract` turns these into notes. */
+  style?: boolean;
+  /** What `check --fix` does about it: assignments, and layout to resolve against the build. */
+  fix?: { edits?: string[]; layout?: LayoutOp[]; does: string; redo?: (p: Project) => Finding['fix'] | null };
+  /** A ready-to-run command for what --fix leaves to you ({file} is the design). */
+  hint?: string;
 }
 
 export const label = (n: Node) => (n.name ? `"${n.name}" #${n.id}` : `#${n.id}`);
@@ -85,8 +95,8 @@ export function structural(p: Project, build: BuildResult | null): Finding[] {
     }
     // Timing.
     const mo = n.motion;
-    if (mo && mo.enter !== 'none' && mo.delay >= tl.duration) out.push({ level: 'warn', text: `${who}: enters at ${num(mo.delay)}s, after the ${num(tl.duration)}s clock ends` });
-    if (mo?.leave && mo.leave !== 'none' && (mo.leaveAt ?? 0) >= tl.duration) out.push({ level: 'warn', text: `${who}: leaves at ${num(mo.leaveAt ?? 0)}s, after the ${num(tl.duration)}s clock ends` });
+    if (mo && mo.enter !== 'none' && mo.delay >= tl.duration) out.push({ level: 'warn', text: `${who}: enters at ${num(mo.delay)}s, after the ${num(tl.duration)}s clock ends`, fix: retime(p, n.id, 'enter') });
+    if (mo?.leave && mo.leave !== 'none' && (mo.leaveAt ?? 0) >= tl.duration) out.push({ level: 'warn', text: `${who}: leaves at ${num(mo.leaveAt ?? 0)}s, after the ${num(tl.duration)}s clock ends`, fix: retime(p, n.id, 'leave') });
     // Geometry.
     if (isGroup(n) || hidden || merged || (!isGroup(n) && n.guide)) return;
     const o = outs.get(n.id);
@@ -95,12 +105,25 @@ export function structural(p: Project, build: BuildResult | null): Finding[] {
     else if (!o.bbox) out.push({ level: 'warn', text: `${who}: has no outline (empty text or shape?)` });
     else {
       const { share, sides } = outside(o.bbox, W, H);
-      if (share > 0.995) out.push({ level: 'error', text: `${who}: entirely outside the canvas (box ${o.bbox.map(num).join(', ')})` });
-      else if (share > 0.02) out.push({ level: 'warn', text: `${who}: ${Math.round(share * 100)}% off the ${sides.join(' and ')} edge${sides.length > 1 ? 's' : ''}` });
+      const text = n.content.type === 'text';
+      // Text cut off is a mistake to fix; a shape bleeding off may be the point.
+      const inside = { layout: [{ target: '#' + n.id, contain: true }], does: 'shrunk to fit inside the margins and moved in' };
+      const hint = `set {file} '"${handle(p, n)}".contain=true'`;
+      if (share > 0.995) out.push({ level: 'error', text: `${who}: entirely outside the canvas (box ${o.bbox.map(num).join(', ')})`, ...(text ? { fix: inside } : { hint }) });
+      else if (share > 0.02) out.push({ level: 'warn', text: `${who}: ${Math.round(share * 100)}% off the ${sides.join(' and ')} edge${sides.length > 1 ? 's' : ''}${text ? ': cut off' : ''}`, ...(text ? { fix: inside } : { hint }) });
       const tall = o.bbox[3] - o.bbox[1];
-      if (n.content.type === 'text' && tall < Math.min(W, H) * 0.012) out.push({ level: 'warn', text: `${who}: text is only ${num(tall)}px tall on a ${W}×${H} canvas` });
+      if (n.content.type === 'text' && tall < Math.min(W, H) * 0.012) out.push({ level: 'warn', text: `${who}: text is only ${num(tall)}px tall on a ${W}×${H} canvas`, hint: `set {file} '"${handle(p, n)}".size=${Math.round((n.content.size * Math.min(W, H) * 0.025) / Math.max(1, tall))}'` });
     }
   });
+  // Moves the clock cuts off: an entrance or exit still under way when it ends.
+  const D = tl.duration;
+  for (const r of rowsOf(p, [])) {
+    for (const t of r.tracks) {
+      if ((t.kind !== 'enter' && t.kind !== 'leave') || t.index !== undefined || t.start >= D || t.end <= D + 1e-3) continue;
+      const n = r.node;
+      out.push({ level: 'warn', text: `${label(n)}: ${t.kind === 'enter' ? 'its entrance' : 'its exit'} ends at ${num(t.end)}s, after the ${num(D)}s clock: cut off`, fix: retime(p, t.owner, t.kind) });
+    }
+  }
   return out;
 }
 
@@ -125,18 +148,26 @@ const lin = (c: number) => {
 export const luminance = (r: number, g: number, b: number) => 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);
 export const contrast = (a: number, b: number) => (Math.max(a, b) + 0.05) / (Math.min(a, b) + 0.05);
 
-/** How many pixels a layer changes, and its contrast against what's behind it there. */
-export function presence(shown: Pixels, without: Pixels): { px: number; contrast: number } {
-  let px = 0, fg = 0, bg = 0;
+/**
+ * How many pixels a layer changes, and its contrast against what's behind it
+ * there: the contrast that the best-separated quarter of its pixels reaches,
+ * so an outline, a hard shadow or a lit edge counts the way it reads, rather
+ * than being averaged away by a fill close to the background.
+ */
+export function presence(shown: Pixels, without: Pixels): { px: number; contrast: number; behind: number } {
+  let px = 0, bg = 0;
   const d = shown.data, e = without.data;
+  const ratios: number[] = [];
   for (let i = 0; i < d.length; i += 4) {
     // Low enough to catch text a shade off its background; drawing is deterministic, so no noise.
     if (Math.abs(d[i] - e[i]) + Math.abs(d[i + 1] - e[i + 1]) + Math.abs(d[i + 2] - e[i + 2]) < 9) continue;
     px++;
-    fg += luminance(d[i], d[i + 1], d[i + 2]);
-    bg += luminance(e[i], e[i + 1], e[i + 2]);
+    const b = luminance(e[i], e[i + 1], e[i + 2]);
+    bg += b;
+    ratios.push(contrast(luminance(d[i], d[i + 1], d[i + 2]), b));
   }
-  return { px, contrast: px ? contrast(fg / px, bg / px) : 1 };
+  ratios.sort((a, b) => a - b);
+  return { px, contrast: px ? ratios[Math.floor((px - 1) * 0.75)] : 1, behind: px ? bg / px : 0 };
 }
 
 /** Spread of brightness: near 0 means a flat, empty-looking frame. */
@@ -152,12 +183,14 @@ export function spread(p: Pixels): number {
 }
 
 /**
- * Motion from runs of three frames one video frame apart: a pop is one step
- * far bigger than the steps either side of it (fast but smooth motion has
- * neighbours just as big). `seam` is the same around the loop's restart:
- * the step into it (a), across it (b) and out of it (c).
+ * Motion from runs of frames one video frame apart: a pop is one step far
+ * bigger than the steps either side of it (fast but smooth motion has
+ * neighbours just as big). With a third step (c), only the middle step can be
+ * a pop: a move that starts from rest has a still step before it, but a big
+ * one after. `seam` is the same around the loop's restart: the step into it
+ * (a), across it (b) and out of it (c).
  */
-export function motionFindings(runs: { t: number; a: number; b: number }[], seam: { a: number; b: number; c: number } | null, animated: boolean): Finding[] {
+export function motionFindings(runs: { t: number; a: number; b: number; c?: number }[], seam: { a: number; b: number; c: number } | null, animated: boolean): Finding[] {
   const out: Finding[] = [];
   const moving = runs.some((r) => Math.max(r.a, r.b) > 0.05) || (seam && Math.max(seam.a, seam.b, seam.c) > 0.05);
   if (!moving) {
@@ -166,7 +199,7 @@ export function motionFindings(runs: { t: number; a: number; b: number }[], seam
   }
   const floor = 0.15;
   for (const r of runs) {
-    const [big, small] = r.a > r.b ? [r.a, r.b] : [r.b, r.a];
+    const [big, small] = r.c !== undefined ? [r.b, Math.max(r.a, r.c)] : r.a > r.b ? [r.a, r.b] : [r.b, r.a];
     if (big > 2 && big > (small + floor) * 6) out.push({ level: 'warn', text: `pop at ${num(r.t)}s: one frame changes ${num(big / (small + floor))}× more than the next` });
   }
   if (seam) {
@@ -183,5 +216,12 @@ export function report(title: string, findings: Finding[]): string {
   const warns = findings.filter((f) => f.level === 'warn');
   const info = findings.filter((f) => f.level === 'info');
   const head = `${title}: ${errors.length ? `${errors.length} problem${errors.length > 1 ? 's' : ''}` : 'no problems'}, ${warns.length} warning${warns.length === 1 ? '' : 's'}`;
-  return [head, ...errors.map((f) => `✗ ${f.text}`), ...warns.map((f) => `! ${f.text}`), ...info.map((f) => `· ${f.text}`)].join('\n');
+  const line = (mark: string) => (f: Finding) => `${mark} ${f.text}${f.fix ? ' [--fix]' : ''}`;
+  return [head, ...errors.map(line('✗')), ...warns.map(line('!')), ...info.map(line('·'))].join('\n');
+}
+
+/** Under `--style abstract`, rules of taste become notes; mistakes stay what they are. */
+export function forStyle(findings: Finding[], style: string | undefined): Finding[] {
+  if (style !== 'abstract') return findings;
+  return findings.map((f) => (f.style && f.level === 'warn' ? { ...f, level: 'info', fix: undefined } : f));
 }
diff --git a/ui/src/agent/find.ts b/ui/src/agent/find.ts
index 7fbf9df..9ec55ee 100644
--- a/ui/src/agent/find.ts
+++ b/ui/src/agent/find.ts
@@ -24,3 +24,10 @@ export function findNode(p: Project, target: string): Node {
   const names = all.map((n) => (n.name ? `"${n.name}"` : `#${n.id}`));
   throw new EditError(`No layer "${target}". Layers: ${names.join(', ')}`);
 }
+
+/** How a command should name a node: its name when it's unique and safe to quote, else its id. */
+export function handle(p: Project, n: Node): string {
+  const name = n.name;
+  if (!name || /["'\\]/.test(name)) return '#' + n.id;
+  return allNodes(p.layers).filter((m) => m.name?.toLowerCase() === name.toLowerCase()).length === 1 ? name : '#' + n.id;
+}
diff --git a/ui/src/agent/fix.ts b/ui/src/agent/fix.ts
new file mode 100644
index 0000000..231af7c
--- /dev/null
+++ b/ui/src/agent/fix.ts
@@ -0,0 +1,141 @@
+// What `check --fix` can do by itself, and what it hands back as commands.
+// The mechanical fixes: text cut off by the canvas (shrink it and move it in),
+// something nearly centred (centre it by its ink), an entrance that replays
+// at the loop's seam (leave before the clock ends), a move the clock cuts off
+// (start it earlier or make it quicker). Everything else becomes a
+// ready-to-run command. Also the difference between two checks, for `set --check`.
+import { timelineOf } from '../state/clock';
+import { isGroup, type Node, type Project } from '../state/model';
+import { rowsOf } from '../state/tracks';
+import type { Finding } from './check';
+import { num } from './describe';
+import { applyEdits } from './edit';
+import { allNodes, findNode, handle } from './find';
+import { leaveEdits } from './moves';
+import type { LayoutOp } from './place';
+
+type Fix = NonNullable<Finding['fix']>;
+
+/** Space left at the end of the clock after a retimed move, s. */
+const PAD = 0.1;
+
+const ref = (id: string) => JSON.stringify('#' + id);
+const r2 = (v: number) => +v.toFixed(2);
+
+/** The latest end of a node's entrance or exit clips (its own, or as a staggered group). */
+function endOf(p: Project, id: string, kind: 'enter' | 'leave'): number {
+  let end = 0;
+  for (const r of rowsOf(p, [])) for (const t of r.tracks) if (t.kind === kind && t.owner === id) end = Math.max(end, t.end);
+  return end;
+}
+
+/**
+ * Edits that end a node's entrance (or exit) before the clock does: start it
+ * earlier, then tighten its stagger, then make it quicker.
+ */
+export function retime(p0: Project, id: string, kind: 'enter' | 'leave'): Fix {
+  const D = timelineOf(p0).duration;
+  const limit = D - PAD;
+  let p = p0;
+  const edits: string[] = [];
+  const step = (e: string[]) => {
+    edits.push(...e);
+    p = applyEdits(p, e).project;
+  };
+  const over = () => endOf(p, id, kind) - limit;
+  const m = () => findNode(p, id).motion!;
+  const name = findNode(p0, id).name ?? '#' + id;
+  if (kind === 'enter') {
+    if (over() > 0 && m().delay > 0) step([`${ref(id)}.motion.delay=${r2(Math.max(0, m().delay - over()))}`]);
+  } else {
+    // Not before the entrance has finished.
+    const floor = endOf(p, id, 'enter');
+    const at = m().leaveAt ?? 0;
+    if (over() > 0 && at > floor) step([`${ref(id)}.motion.leaveAt=${r2(Math.max(floor, at - over()))}`]);
+  }
+  for (let i = 0; i < 4 && over() > 0 && m().stagger > 0; i++) step([`${ref(id)}.motion.stagger=${r2(m().stagger * 0.6)}`]);
+  const key = kind === 'leave' && m().leaveTransition ? 'leaveTransition' : 'transition';
+  for (let i = 0; i < 6 && over() > 0; i++) {
+    const t = m()[key] ?? m().transition;
+    step([`${ref(id)}.motion.${kind === 'leave' ? 'leaveTransition' : 'transition'}=${JSON.stringify({ ...t, type: t.type === 'physics' ? 'easing' : t.type, duration: r2(Math.max(0.12, t.duration * 0.7)) })}`]);
+  }
+  const start = kind === 'enter' ? m().delay : (m().leaveAt ?? 0);
+  return { edits, does: `"${name}": ${kind === 'enter' ? 'entrance' : 'exit'} now ${num(r2(start))}–${num(r2(endOf(p, id, kind)))}s, inside the ${num(D)}s clock` };
+}
+
+/** Everything that enters but never leaves, on a looping clock: leave before it ends, so the entrance doesn't replay as a jump. */
+export function seamFix(p: Project): Fix | null {
+  const tl = timelineOf(p);
+  if (!tl.loop) return null;
+  const nodes = allNodes(p.layers).filter((n) => n.motion && n.motion.enter !== 'none' && (n.motion.leave ?? 'none') === 'none');
+  if (!nodes.length) return null;
+  const { edits, project } = leaveEdits(p, nodes);
+  const at = (n: Node) => num(findNode(project, n.id).motion!.leaveAt!);
+  // Worked out again when it's applied, after the other fixes have moved things in time.
+  return { edits, does: `${nodes.map((n) => `"${n.name ?? n.id}" leaves (${findNode(project, n.id).motion!.leave}) at ${at(n)}s`).join(', ')}, so the loop starts over from nothing`, redo: seamFix };
+}
+
+/**
+ * The fixes to apply (warnings and errors only) and what's left to do. With
+ * the project, the edits are applied in turn and fixes that depend on the
+ * others (the loop seam) are worked out again last.
+ */
+export function fixPlan(findings: Finding[], p?: Project): { edits: string[]; layout: LayoutOp[]; done: string[]; todo: Finding[] } {
+  const out = { edits: [] as string[], layout: [] as LayoutOp[], done: [] as string[], todo: [] as Finding[] };
+  const later: Finding[] = [];
+  const take = (f: Finding, fix: NonNullable<Finding['fix']>) => {
+    out.edits.push(...(fix.edits ?? []));
+    out.layout.push(...(fix.layout ?? []));
+    out.done.push(`${f.text} → ${fix.does}`);
+  };
+  for (const f of findings) {
+    if (f.level === 'info') continue;
+    if (f.fix?.redo && p) later.push(f);
+    else if (f.fix) take(f, f.fix);
+    else out.todo.push(f);
+  }
+  if (later.length && p) {
+    const now = applyEdits(p, out.edits).project;
+    for (const f of later) {
+      const fix = f.fix!.redo!(now);
+      if (fix) take(f, fix);
+    }
+  }
+  return out;
+}
+
+/** What's left, as commands to run (and what can't be done by command, in words). */
+export function todoText(todo: Finding[], file: string): string[] {
+  const q = /^[\w./-]+$/.test(file) ? file : JSON.stringify(file);
+  return todo.map((f) => (f.hint ? `morpho ${f.hint.replace(/\{file\}/g, q)}   # ${f.text}` : `# ${f.text}`));
+}
+
+/** A finding without its numbers, to tell "the same thing, changed" from "something new". */
+const key = (f: Finding) => f.text.replace(/-?\d+(\.\d+)?/g, '#');
+const mark = (f: Finding) => (f.level === 'error' ? '✗' : f.level === 'warn' ? '!' : '·');
+const quiet = (f: Finding) => /^looked at /.test(f.text);
+
+/** Findings that appeared (+), went away (−) or changed (~) between two checks. */
+export function diffFindings(before: Finding[], after: Finding[]): string[] {
+  const b = before.filter((f) => !quiet(f)), a = after.filter((f) => !quiet(f));
+  const out: string[] = [];
+  const left = new Map(b.map((f) => [key(f), f]));
+  for (const f of a) {
+    const was = left.get(key(f));
+    if (!was) out.push(`+ ${mark(f)} ${f.text}`);
+    else {
+      left.delete(key(f));
+      if (was.text !== f.text || was.level !== f.level) out.push(`~ ${mark(f)} ${f.text} (was: ${was.text})`);
+    }
+  }
+  for (const f of left.values()) out.push(`− ${mark(f)} ${f.text}`);
+  return out;
+}
+
+/** A small text colour for a layer that doesn't stand out: light on dark, dark on light. */
+export function contrastHint(p: Project, n: Node, behind: number): string {
+  const c = behind < 0.35 ? '#ffffff' : '#111111';
+  const who = JSON.stringify(handle(p, n));
+  const fill = !isGroup(n) && 'fill' in n.style.params;
+  return fill ? `set {file} '${who}.fill="${c}"'` : `set {file} '${who}.effect=flat' '${who}.fill="${c}"'`;
+}
diff --git a/ui/src/agent/kits.ts b/ui/src/agent/kits.ts
new file mode 100644
index 0000000..7d8a5af
--- /dev/null
+++ b/ui/src/agent/kits.ts
@@ -0,0 +1,154 @@
+// Style kits: a background, a palette, a font pairing and a look for each
+// role (headline, accent, body), built from the bundled fonts, material
+// presets and background presets. A kit gives a design a coherent start in
+// one word; anything a layer sets itself wins over its kit.
+import { BUNDLED } from '../fonts/library';
+import { PRESETS } from '../render/effects';
+import { BG_PRESETS, SHAPE_RECIPES } from '../state/recipes';
+import { EditError } from './find';
+
+export type Role = 'headline' | 'accent' | 'body';
+export const ROLES: Role[] = ['headline', 'accent', 'body'];
+
+export interface Look {
+  font?: string;
+  /** A material preset by name, or a flat colour. */
+  preset?: string;
+  color?: string;
+  recipe?: string;
+  /** Default size as a share of the canvas's short side (headlines fit 80% of the width instead). */
+  size?: number;
+  tracking?: number;
+}
+
+export interface Kit {
+  name: string;
+  blurb: string;
+  /** A background preset's name, a colour, or "#a,#b" for a gradient. */
+  background: string;
+  /** Named colours: a layer's `color` can be one of these names. */
+  palette: Record<string, string>;
+  headline: Look;
+  accent: Look;
+  body: Look;
+}
+
+export const KITS: Kit[] = [
+  {
+    name: 'chrome-night',
+    blurb: 'liquid chrome on near-black, a violet glow and clean grotesk captions: club nights, launches',
+    background: 'Midnight',
+    palette: { ink: '#e8e8f0', accent: '#5a17d6', hot: '#ff2e9a', paper: '#0b0b0d' },
+    headline: { font: 'unbounded', preset: 'Ice chrome' },
+    accent: { preset: 'Plasma' },
+    body: { font: 'space-grotesk', color: '#e8e8f0', size: 0.032, tracking: 0.04 },
+  },
+  {
+    name: 'neon-club',
+    blurb: 'neon tubes on black, pink and cyan: bars, gigs, late-night signs',
+    background: 'Black',
+    palette: { ink: '#f4ecff', accent: '#ff2bd6', cool: '#28f0ff', paper: '#000000' },
+    headline: { font: 'bungee', preset: 'Neon pink' },
+    accent: { preset: 'Neon cyan' },
+    body: { font: 'space-grotesk', color: '#f4ecff', size: 0.03, tracking: 0.06 },
+  },
+  {
+    name: 'riso-zine',
+    blurb: 'two-ink risograph on warm paper with a tall condensed headline: zines, gig flyers, print',
+    background: 'Paper',
+    palette: { ink: '#1b1b1f', accent: '#ff5aa0', cool: '#2b6bff', warm: '#ff7a1a', paper: '#f2ede4' },
+    headline: { font: 'anton', preset: 'Riso pink + blue' },
+    accent: { preset: 'Riso orange + green' },
+    body: { font: 'space-grotesk', color: '#1b1b1f', size: 0.03 },
+  },
+  {
+    name: 'brutal-pop',
+    blurb: 'flat colour, thick outlines and hard shadows on a green grid: bold, loud, web-brutalist',
+    background: 'Green grid',
+    palette: { ink: '#f2ebe2', accent: '#9b4ff0', line: '#0a0a0a', paper: '#0d7a2c' },
+    headline: { font: 'archivo', preset: 'Neo-brutal' },
+    accent: { preset: 'Cream label' },
+    body: { font: 'space-grotesk', color: '#f2ebe2', size: 0.032 },
+  },
+  {
+    name: 'puff-sky',
+    blurb: 'puffy inflated letters on a deep sky-blue gradient, pink accents: playful, friendly, kids and apps',
+    background: 'Blue backdrop',
+    palette: { ink: '#ffffff', accent: '#ff6fb8', sky: '#7ccfff', paper: '#2b8bff' },
+    headline: { font: 'rubik-mono', preset: 'Puffy cloud' },
+    accent: { preset: 'Bubblegum' },
+    body: { font: 'bricolage', color: '#ffffff', size: 0.034 },
+  },
+  {
+    name: 'editorial',
+    blurb: 'black serif on paper with a red stamp: magazine covers, book jackets, quiet and classic',
+    background: 'Paper',
+    palette: { ink: '#141414', accent: '#e3120b', paper: '#f2ede4' },
+    headline: { font: 'playfair', color: '#141414' },
+    accent: { preset: 'Rubber stamp' },
+    body: { font: 'eb-garamond', color: '#141414', size: 0.034 },
+  },
+  {
+    name: 'holo-y2k',
+    blurb: 'holographic foil and an acid aura on black: Y2K, fashion drops, tech',
+    background: '#0b0b0f',
+    palette: { ink: '#e9e4ff', accent: '#d6ff1f', violet: '#5a1fff', paper: '#0b0b0f' },
+    headline: { font: 'dela-gothic', preset: 'Holo foil' },
+    accent: { preset: 'Acid aura' },
+    body: { font: 'space-grotesk', color: '#e9e4ff', size: 0.03, tracking: 0.05 },
+  },
+  {
+    name: 'arcade',
+    blurb: 'pixel type in chunky 3D on electric violet: games, retro tech, 8-bit',
+    background: 'Electric violet',
+    palette: { ink: '#e2ff2e', accent: '#1f63f0', shadow: '#23203f', paper: '#7b4dff' },
+    headline: { font: 'silkscreen', preset: 'Pixel pop' },
+    accent: { preset: 'Voxel blue' },
+    body: { font: 'silkscreen', color: '#e2ff2e', size: 0.03 },
+  },
+];
+
+const norm = (s: string) => s.toLowerCase().replace(/[\s_-]+/g, '');
+
+export function kitByName(name: string): Kit {
+  const k = KITS.find((x) => norm(x.name) === norm(name));
+  if (!k) throw new EditError(`No kit "${name}". Kits: ${KITS.map((x) => x.name).join(', ')}`);
+  return k;
+}
+
+/** A kit colour by name ("accent"), or the colour itself. */
+export function kitColor(kit: Kit | null, c: string): string {
+  if (kit && c in kit.palette) return kit.palette[c];
+  if (!/^#[0-9a-f]{6}$/i.test(c)) throw new EditError(`"${c}" isn't a colour (#rrggbb)${kit ? ` or one of ${kit.name}'s: ${Object.keys(kit.palette).join(', ')}` : ''}`);
+  return c;
+}
+
+/** A kit in three lines. */
+export function kitText(k: Kit): string {
+  const look = (r: Role) => {
+    const l = k[r];
+    return [l.font, l.preset ?? l.color, l.recipe].filter(Boolean).join(' · ');
+  };
+  return `${k.name}: ${k.blurb}\n  background ${k.background} · palette ${Object.entries(k.palette).map(([n, c]) => `${n} ${c}`).join(', ')}\n  headline ${look('headline')} · accent ${look('accent')} · body ${look('body')}`;
+}
+
+export function kitsText(): string {
+  return KITS.map(kitText).join('\n') + '\nuse: "kit": "name" in a make spec, or morpho new f.morpho --kit name; a layer\'s "color" can be a palette name, its "role" headline | accent | body';
+}
+
+/** Every kit names things that exist (a test runs this). */
+export function kitProblems(): string[] {
+  const out: string[] = [];
+  const fonts = new Set(BUNDLED.map((f) => f.id));
+  for (const k of KITS) {
+    if (!/^#/.test(k.background) && !BG_PRESETS.some((b) => b.name === k.background)) out.push(`${k.name}: no background ${k.background}`);
+    for (const r of ROLES) {
+      const l = k[r];
+      if (l.font && !fonts.has(l.font)) out.push(`${k.name}.${r}: no font ${l.font}`);
+      if (l.preset && !PRESETS.some((p) => p.name === l.preset)) out.push(`${k.name}.${r}: no preset ${l.preset}`);
+      if (l.recipe && !SHAPE_RECIPES.some((p) => p.name === l.recipe)) out.push(`${k.name}.${r}: no recipe ${l.recipe}`);
+      if (l.color && !/^#[0-9a-f]{6}$/i.test(l.color)) out.push(`${k.name}.${r}: bad colour ${l.color}`);
+    }
+  }
+  return out;
+}
diff --git a/ui/src/agent/layout.ts b/ui/src/agent/layout.ts
index bb6353c..69b5b52 100644
--- a/ui/src/agent/layout.ts
+++ b/ui/src/agent/layout.ts
@@ -9,6 +9,7 @@ import type { Box } from '../engine/types';
 import { isGroup, nodeLabel, type Node, type Project } from '../state/model';
 import type { Finding, Pixels } from './check';
 import { num } from './describe';
+import { findNode, handle } from './find';
 
 export interface Item {
   id: string;
@@ -16,6 +17,8 @@ export interface Item {
   text: boolean;
   /** Text: its font size on the canvas, px, and how many characters it has. */
   size?: number;
+  /** Text: its own size setting (before scale). */
+  contentSize?: number;
   chars?: number;
   box: Box;
 }
@@ -33,7 +36,7 @@ export function itemsOf(p: Project, build: BuildResult | null): Item[] {
         if (!box) continue;
         const text = !isGroup(n) && n.content.type === 'text';
         const c = !isGroup(n) && n.content.type === 'text' ? n.content : null;
-        out.push({ id: n.id, name: nodeLabel(n), text, size: c ? c.size * (n as { scale: number }).scale * k : undefined, chars: c ? c.text.replace(/\s/g, '').length : undefined, box });
+        out.push({ id: n.id, name: nodeLabel(n), text, size: c ? c.size * (n as { scale: number }).scale * k : undefined, contentSize: c?.size, chars: c ? c.text.replace(/\s/g, '').length : undefined, box });
       }
     }
   };
@@ -42,6 +45,9 @@ export function itemsOf(p: Project, build: BuildResult | null): Item[] {
 }
 
 const who = (i: Item) => `"${i.name}"`;
+/** An item as a command names it. */
+const h = (p: Project, i: Item) => `"${handle(p, findNode(p, i.id))}"`;
+const area = (b: Box) => (b[2] - b[0]) * (b[3] - b[1]);
 
 /** Each layer's box and its distance to every edge, as a table. */
 export function boxTable(p: Project, items: Item[]): string {
@@ -64,14 +70,17 @@ export function layoutFindings(p: Project, items: Item[]): Finding[] {
   const inside = items.filter((i) => i.box[0] < W / 2 && i.box[2] > -W / 2 && i.box[1] < H / 2 && i.box[3] > -H / 2);
   // Edges that nearly line up.
   const edges = (b: Box) => ({ left: b[0], 'centre (x)': (b[0] + b[2]) / 2, right: b[2], top: b[1], 'middle (y)': (b[1] + b[3]) / 2, bottom: b[3] });
-  const misses: { d: number; text: string }[] = [];
+  const misses: (Finding & { d: number })[] = [];
+  const edge = (k: string) => k.replace(/ \(.\)/, '');
   for (let a = 0; a < inside.length; a++) {
     for (let b = a + 1; b < inside.length; b++) {
       const ea = edges(inside[a].box), eb = edges(inside[b].box);
-      let best: { d: number; text: string } | null = null;
+      let best: (Finding & { d: number }) | null = null;
       for (const k of Object.keys(ea) as (keyof typeof ea)[]) {
         const d = Math.abs(ea[k] - eb[k]);
-        if (d > seen && d <= tol && (!best || d < best.d)) best = { d, text: `${who(inside[a])} and ${who(inside[b])}: ${k.replace(/ \(.\)/, '')}s ${num(d)}px apart, nearly lined up` };
+        // The smaller one moves to the bigger one.
+        const [big, small] = area(inside[a].box) >= area(inside[b].box) ? [inside[a], inside[b]] : [inside[b], inside[a]];
+        if (d > seen && d <= tol && (!best || d < best.d)) best = { level: 'warn', style: true, d, text: `${who(inside[a])} and ${who(inside[b])}: ${edge(k)}s ${num(d)}px apart, nearly lined up`, hint: `align {file} ${h(p, small)} --to ${h(p, big)} --edge ${edge(k)}` };
         if (d <= seen) {
           best = null;
           break;
@@ -80,23 +89,23 @@ export function layoutFindings(p: Project, items: Item[]): Finding[] {
       if (best) misses.push(best);
     }
     const c = edges(inside[a].box);
-    for (const [k, v] of [['horizontally', c['centre (x)']], ['vertically', c['middle (y)']]] as const) {
-      if (Math.abs(v) > seen && Math.abs(v) <= tol) misses.push({ d: Math.abs(v), text: `${who(inside[a])}: ${num(Math.abs(v))}px off centre ${k}, nearly centred` });
+    for (const [k, v, axis] of [['horizontally', c['centre (x)'], 'x'], ['vertically', c['middle (y)'], 'y']] as const) {
+      if (Math.abs(v) > seen && Math.abs(v) <= tol) misses.push({ level: 'warn', style: true, d: Math.abs(v), text: `${who(inside[a])}: ${num(Math.abs(v))}px off centre ${k}, nearly centred`, fix: { layout: [{ target: '#' + inside[a].id, centre: axis }], does: `centred ${k} by its ink` } });
     }
   }
   misses.sort((x, y) => x.d - y.d);
-  for (const m of misses.slice(0, 6)) out.push({ level: 'warn', text: m.text });
-  if (misses.length > 6) out.push({ level: 'info', text: `${misses.length - 6} more near-misses like these` });
+  for (const { d: _, ...m } of misses.slice(0, 6)) out.push(m);
+  if (misses.length > 6) out.push({ level: 'info', style: true, text: `${misses.length - 6} more near-misses like these` });
   // Content as a whole: off centre by a little, or crowding an edge.
   if (inside.length) {
     const u = inside.reduce<Box>((b, i) => [Math.min(b[0], i.box[0]), Math.min(b[1], i.box[1]), Math.max(b[2], i.box[2]), Math.max(b[3], i.box[3])], [Infinity, Infinity, -Infinity, -Infinity]);
     const [L, R] = [u[0] + W / 2, W / 2 - u[2]];
-    if (L > 0 && R > 0 && u[2] - u[0] > W * 0.5 && Math.abs(L - R) > tol && Math.abs(L - R) < W * 0.08) out.push({ level: 'info', text: `the design sits ${num(Math.round(Math.abs(L - R) / 2))}px ${L > R ? 'right' : 'left'} of centre (margins left ${num(Math.round(L))}, right ${num(Math.round(R))})` });
+    if (L > 0 && R > 0 && u[2] - u[0] > W * 0.5 && Math.abs(L - R) > tol && Math.abs(L - R) < W * 0.08) out.push({ level: 'info', style: true, text: `the design sits ${num(Math.round(Math.abs(L - R) / 2))}px ${L > R ? 'right' : 'left'} of centre (margins left ${num(Math.round(L))}, right ${num(Math.round(R))})` });
     const close = Math.min(W, H) * 0.025;
     for (const i of inside) {
       const m: [string, number][] = [['left', i.box[0] + W / 2], ['right', W / 2 - i.box[2]], ['top', i.box[1] + H / 2], ['bottom', H / 2 - i.box[3]]];
       const near = m.filter(([, v]) => v > 0.75 && v < close);
-      if (near.length) out.push({ level: 'warn', text: `${who(i)}: only ${near.map(([s, v]) => `${num(Math.round(v))}px from the ${s}`).join(' and ')} edge: crowded (bleed it off or give it room)` });
+      if (near.length) out.push({ level: 'warn', style: true, text: `${who(i)}: only ${near.map(([s, v]) => `${num(Math.round(v))}px from the ${s}`).join(' and ')} edge: crowded (bleed it off or give it room)`, hint: `set {file} '${h(p, i)}.contain=true'` });
     }
   }
   // Type sizes.
@@ -105,11 +114,11 @@ export function layoutFindings(p: Project, items: Item[]): Finding[] {
   const biggest = Math.max(0, ...items.filter((i) => i.size).map((i) => i.size!));
   if (texts.length >= 2) {
     const [a, b] = texts;
-    if (b.size! / a.size! > 0.88 && a.name !== b.name && a.size! > biggest * 0.6) out.push({ level: 'warn', text: `no clear lead: ${who(a)} (${num(Math.round(a.size!))}px) and ${who(b)} (${num(Math.round(b.size!))}px) are about the same size` });
+    if (b.size! / a.size! > 0.88 && a.name !== b.name && a.size! > biggest * 0.6) out.push({ level: 'warn', style: true, text: `no clear lead: ${who(a)} (${num(Math.round(a.size!))}px) and ${who(b)} (${num(Math.round(b.size!))}px) are about the same size`, hint: `set {file} '${h(p, b)}.size=${Math.round((b.contentSize ?? b.size!) * 0.6)}'` });
     const sizes = new Set(texts.map((t) => Math.round(Math.log(t.size!) / Math.log(1.08))));
-    if (sizes.size > 4) out.push({ level: 'info', text: `${sizes.size} different text sizes: fewer reads cleaner` });
+    if (sizes.size > 4) out.push({ level: 'info', style: true, text: `${sizes.size} different text sizes: fewer reads cleaner` });
   }
-  if (items.length > 30) out.push({ level: 'info', text: `${items.length} separate things on the canvas: busy` });
+  if (items.length > 30) out.push({ level: 'info', style: true, text: `${items.length} separate things on the canvas: busy` });
   return out;
 }
 
@@ -145,6 +154,6 @@ export function lookFindings(design: Pixels, bare: Pixels): Finding[] {
   }
   const main = hues.map((n, k) => ({ n, k })).filter((x) => colored && x.n / colored > 0.04).sort((a, b) => b.n - a.n);
   const neutral = 1 - colored / (w * h);
-  out.push({ level: main.length >= 6 ? 'warn' : 'info', text: `palette: ${main.length ? `${main.length} main hue${main.length > 1 ? 's' : ''} (${main.map((x) => HUES[x.k]).join(', ')})` : 'no strong hues'}${neutral > 0.5 ? ', mostly neutrals' : ''}${main.length >= 6 ? ': busy, try fewer' : ''}` });
+  out.push({ level: main.length >= 6 ? 'warn' : 'info', style: true, text: `palette: ${main.length ? `${main.length} main hue${main.length > 1 ? 's' : ''} (${main.map((x) => HUES[x.k]).join(', ')})` : 'no strong hues'}${neutral > 0.5 ? ', mostly neutrals' : ''}${main.length >= 6 ? ': busy, try fewer' : ''}` });
   return out;
 }
diff --git a/ui/src/agent/make.test.ts b/ui/src/agent/make.test.ts
new file mode 100644
index 0000000..f6a1cd1
--- /dev/null
+++ b/ui/src/agent/make.test.ts
@@ -0,0 +1,318 @@
+import { describe as group, expect, it } from 'vitest';
+import type { Box } from '../engine/types';
+import { group as groupNode, isGroup, symbolLayer, textLayer, type Project, type ShapeLayer } from '../state/model';
+import { newMotion } from '../state/motion';
+import { rowsOf } from '../state/tracks';
+import { catalog } from './catalog';
+import { forStyle, motionFindings, report, structural, type Finding } from './check';
+import { applyEdits } from './edit';
+import { diffFindings, fixPlan, retime, seamFix, todoText } from './fix';
+import { allNodes, findNode } from './find';
+import { KITS, kitByName, kitColor, kitProblems } from './kits';
+import { addWithKit, fromSpec, newDesign } from './make';
+import { moveEdits } from './moves';
+import { alignEdits, fitEdits, layoutFromAssignments, placeEdits, spot, type Boxes } from './place';
+
+const project = (layers: Project['layers'], o: Partial<Project> = {}): Project => ({ version: 2, name: 'Test', canvas: { width: 1000, height: 1200 }, background: { fill: { kind: 'solid', colors: ['#000000'], angle: 180 }, grain: 0, tile: null }, layers, fonts: [], ...o });
+
+/** Boxes as the engine would build them: each layer's size around its position (text: 0.6 of its size per letter wide). */
+function fakeBuild(p: Project): Boxes {
+  const out: Boxes = new Map();
+  for (const n of allNodes(p.layers)) {
+    if (isGroup(n)) continue;
+    const s = (n.content as { size: number }).size * n.scale;
+    const w = n.content.type === 'text' ? s * n.content.text.length * 0.6 : s;
+    const h = s;
+    out.set(n.id, [n.x - w / 2, n.y - h / 2, n.x + w / 2, n.y + h / 2] as Box);
+  }
+  return out;
+}
+
+/** Fit, rebuild, place: what page.ts does against the real engine. */
+function resolve(p: Project, ops: Parameters<typeof fitEdits>[2]): Project {
+  p = applyEdits(p, fitEdits(p, fakeBuild(p), ops)).project;
+  return applyEdits(p, placeEdits(p, fakeBuild(p), ops)).project;
+}
+
+const box = (p: Project, name: string) => fakeBuild(p).get(findNode(p, name).id)!;
+
+group('layout in words', () => {
+  it('reads spots, with one word centring the other axis', () => {
+    expect(spot('top')).toEqual({ x: 'centre', y: 'top' });
+    expect(spot('Upper third')).toEqual({ x: 'centre', y: 'top third' });
+    expect(spot('bottom-right')).toEqual({ x: 'right', y: 'bottom' });
+    expect(spot('left top')).toEqual({ x: 'left', y: 'top' });
+    expect(spot('middle')).toEqual({ x: 'centre', y: 'centre' });
+    expect(() => spot('somewhere')).toThrow(/Spots: top, centre/);
+  });
+
+  it('fits to a share of the canvas, keeping the box where it was', () => {
+    const p0 = project([textLayer('HELLO', 'archivo', { name: 'T', x: 50, y: 20 }, { size: 100 })]);
+    const p = resolve(p0, [{ target: 'T', fitWidth: 80 }]);
+    const b = box(p, 'T');
+    expect(b[2] - b[0]).toBeCloseTo(800, 0);
+    expect((b[0] + b[2]) / 2).toBeCloseTo(50, 3);
+    // Both: it fits inside both.
+    const q = resolve(p0, [{ target: 'T', fitWidth: 80, fitHeight: 10 }]);
+    expect(box(q, 'T')[3] - box(q, 'T')[1]).toBeCloseTo(120, 3);
+  });
+
+  it('places at spots with margins, and thirds on the third lines', () => {
+    const p0 = project([symbolLayer('star', 200, { name: 'S', x: 33, y: 44 })]);
+    let b = box(resolve(p0, [{ target: 'S', place: 'top left', margin: 40 }]), 'S');
+    expect([b[0], b[1]]).toEqual([-460, -560]);
+    b = box(resolve(p0, [{ target: 'S', place: 'bottom', margin: '10%' }]), 'S');
+    expect([(b[0] + b[2]) / 2, b[3]]).toEqual([0, 600 - 100]);
+    b = box(resolve(p0, [{ target: 'S', place: 'top third' }]), 'S');
+    expect((b[1] + b[3]) / 2).toBeCloseTo(-200, 6);
+    b = box(resolve(p0, [{ target: 'S', place: 'centre', offset: [0, -50] }]), 'S');
+    expect([(b[0] + b[2]) / 2, (b[1] + b[3]) / 2]).toEqual([0, -50]);
+  });
+
+  it('centres by ink, and keeps things inside the margins (shrinking what is too big)', () => {
+    const p0 = project([textLayer('WIDE WORD HERE', 'archivo', { name: 'T', x: 120, y: 7 }, { size: 200 })]);
+    const p = resolve(p0, [{ target: 'T', contain: true, margin: 50 }]);
+    const b = box(p, 'T');
+    expect(b[2] - b[0]).toBeCloseTo(900, 0);
+    expect(b[0]).toBeCloseTo(-450, 1);
+    const c = box(resolve(p0, [{ target: 'T', centre: 'x' }]), 'T');
+    expect((c[0] + c[2]) / 2).toBeCloseTo(0, 6);
+    expect((c[1] + c[3]) / 2).toBeCloseTo(7, 6);
+  });
+
+  it('stacks and rows with a gap, aligned across, placed as one block', () => {
+    const p0 = project([textLayer('AB', 'archivo', { name: 'A' }, { size: 100 }), textLayer('ABCD', 'archivo', { name: 'B', x: 300 }, { size: 50 })]);
+    const p = resolve(p0, [{ stack: ['A', 'B'], gap: 20, align: 'left', place: 'bottom left', margin: 40 }]);
+    const a = box(p, 'A'), b = box(p, 'B');
+    expect(b[1] - a[3]).toBeCloseTo(20, 6);
+    expect(a[0]).toBeCloseTo(-460, 6);
+    expect(b[0]).toBeCloseTo(-460, 6);
+    expect(b[3]).toBeCloseTo(560, 6);
+    const r = resolve(p0, [{ row: ['A', 'B'], gap: 30 }]);
+    expect(box(r, 'B')[0] - box(r, 'A')[2]).toBeCloseTo(30, 6);
+    expect((box(r, 'B')[1] + box(r, 'B')[3]) / 2).toBeCloseTo((box(r, 'A')[1] + box(r, 'A')[3]) / 2, 6);
+  });
+
+  it('moves and sizes groups through their layers', () => {
+    const g = groupNode([symbolLayer('star', 100, { name: 'S1', x: -100 }), symbolLayer('star', 100, { name: 'S2', x: 100 })], { name: 'G' });
+    const p = resolve(project([g]), [{ target: 'G', fitWidth: 60, place: 'top', margin: 0 }]);
+    const s1 = box(p, 'S1'), s2 = box(p, 'S2');
+    expect(s2[2] - s1[0]).toBeCloseTo(600, 3);
+    expect(s1[1]).toBeCloseTo(-600, 3);
+    expect((s1[0] + s2[2]) / 2).toBeCloseTo(0, 3);
+  });
+
+  it('aligns edges by the boxes', () => {
+    const p0 = project([symbolLayer('star', 100, { name: 'A', x: 10 }), symbolLayer('star', 300, { name: 'B', x: 200, y: 90 })]);
+    const p = applyEdits(p0, alignEdits(p0, fakeBuild(p0), ['A'], 'B', ['left', 'top'])).project;
+    expect(box(p, 'A')[0]).toBe(box(p, 'B')[0]);
+    expect(box(p, 'A')[1]).toBe(box(p, 'B')[1]);
+    expect(() => alignEdits(p0, fakeBuild(p0), ['A'], 'canvas', ['sideways'])).toThrow(/align edges are/);
+  });
+
+  it('takes layout out of assignments, leaving the other edits', () => {
+    const r = layoutFromAssignments(['Title.place=top third', '"Big one".fitWidth=80', 'Title.margin=5%', 'Title.gloss=0.4', 'Info.centre=x', 'Info.fit=height 20%', 'Info.contain=true']);
+    expect(r.rest).toEqual(['Title.gloss=0.4']);
+    expect(r.ops).toEqual([
+      { target: 'Title', place: 'top third', margin: '5%' },
+      { target: 'Big one', fitWidth: 80 },
+      { target: 'Info', centre: 'x', fitHeight: 20, contain: true },
+    ]);
+    expect(() => layoutFromAssignments(['A.place=nowhere'])).toThrow(/No spot/);
+    expect(() => layoutFromAssignments(['A.fitWidth=-3'])).toThrow(/% of the canvas/);
+  });
+});
+
+group('kits', () => {
+  it('name only fonts, presets, backgrounds and colours that exist', () => {
+    expect(KITS.length).toBeGreaterThanOrEqual(6);
+    expect(kitProblems()).toEqual([]);
+  });
+
+  it('are in the catalog', () => {
+    const idx = catalog('');
+    for (const k of KITS) expect(idx).toContain(k.name);
+    expect(catalog('kits')).toContain('chrome-night: ');
+    expect(catalog('riso-zine')).toContain('kit riso-zine');
+  });
+
+  it('give layers their role\'s look unless they set their own', () => {
+    const { project: p } = fromSpec({ kit: 'chrome-night', layers: [{ shape: 'ring', name: 'R' }, { text: 'BIG', name: 'H' }, { text: 'small', name: 'B' }, { text: 'mine', name: 'M', role: 'body', color: 'hot' }, { text: 'own', name: 'O', preset: 'Molten' }] });
+    const [r, h, b, m, o] = p.layers as ShapeLayer[];
+    expect(p.background.fill.colors[0]).toBe('#0b0b0d');
+    expect(p.agent).toEqual({ kit: 'chrome-night' });
+    expect(h.content).toMatchObject({ font: 'unbounded' });
+    expect(h.style.effect).toBe('chrome');
+    expect(r.style.params.c2).toBe('#5a17d6');
+    expect(b.content).toMatchObject({ font: 'space-grotesk', size: Math.round(1080 * 0.032), tracking: 0.04 });
+    expect(b.style.params.fill).toBe('#e8e8f0');
+    expect(m.style.params.fill).toBe('#ff2e9a');
+    expect(o.style.params.c3).toBe('#ff6a00');
+    // A colour of its own tints the kit's look when it has one main colour.
+    const neon = fromSpec({ kit: 'neon-club', layers: [{ shape: 'ring', color: 'cool' }, { shape: 'star', color: '#123456', preset: 'Ice chrome' }] }).project.layers as ShapeLayer[];
+    expect(neon[0].style).toMatchObject({ effect: 'neon', params: { color: '#28f0ff' } });
+    expect(neon[1].style).toMatchObject({ effect: 'flat', params: { fill: '#123456' } });
+  });
+
+  it('carry on into add', () => {
+    let p = newDesign({ kit: 'editorial', style: 'logo' });
+    expect(p.agent).toEqual({ kit: 'editorial', style: 'logo' });
+    p = addWithKit(p, 'text', 'TITLE', {}).project;
+    p = addWithKit(p, 'text', 'caption', { color: 'accent' }).project;
+    const [t, c] = p.layers as ShapeLayer[];
+    expect(t.content).toMatchObject({ font: 'playfair' });
+    expect(c.content).toMatchObject({ font: 'eb-garamond' });
+    expect(c.style.params.fill).toBe('#e3120b');
+    expect(() => newDesign({ kit: 'nope' })).toThrow(/Kits: chrome-night/);
+    expect(() => kitColor(kitByName('editorial'), 'blurple')).toThrow(/ink, accent, paper/);
+  });
+});
+
+group('make', () => {
+  it('builds a spec: canvas, clock, layers bottom first, modifiers, settings, layout and motion', () => {
+    const made = fromSpec({
+      name: 'Poster',
+      canvas: '1080x1350',
+      duration: 4,
+      style: 'abstract',
+      layers: [
+        { shape: 'ring', name: 'Halo', fitWidth: 90, place: 'top third', set: { 'motion.loop': 'spin' } },
+        { text: 'NIGHT\\nDRIVE', name: 'Title', place: 'top third', modifiers: [{ kind: 'wave', amplitude: 0.04 }, 'slant'] },
+        { group: [{ text: 'A', name: 'GA' }, { text: 'B', name: 'GB' }], name: 'Pair', merge: true },
+        { text: 'Info', name: 'Info', size: 30, motion: { enter: 'fade', delay: 1 } },
+      ],
+      layout: [{ stack: ['Title', 'Info'], gap: 30 }],
+      motion: { recipe: 'cascade', layers: ['Title'] },
+    });
+    const p = made.project;
+    expect(p.canvas).toEqual({ width: 1080, height: 1350 });
+    expect(p.timeline).toEqual({ duration: 4, loop: true });
+    expect(p.agent).toEqual({ style: 'abstract' });
+    expect(p.layers.map((n) => n.name)).toEqual(['Halo', 'Title', 'Pair', 'Info']);
+    const title = findNode(p, 'Title') as ShapeLayer;
+    expect(title.content).toMatchObject({ text: 'NIGHT\nDRIVE' });
+    expect(title.modifiers.map((m) => m.kind)).toEqual(['wave', 'slant']);
+    expect(title.motion).toMatchObject({ enter: 'rise', leave: 'rise' });
+    expect(findNode(p, 'Halo').motion?.loop).toBe('spin');
+    expect(findNode(p, 'Info').motion).toMatchObject({ enter: 'fade', delay: 1, leave: 'fade' });
+    // Fits first (the headline gets 80% wide by default), then places, then stacks.
+    expect(made.layout.slice(0, 2)).toEqual([{ target: `#${findNode(p, 'Halo').id}`, fitWidth: 90 }, { target: `#${findNode(p, 'Title').id}`, fitWidth: 80 }]);
+    expect(made.layout.find((o) => 'stack' in o)).toMatchObject({ stack: ['Title', 'Info'] });
+  });
+
+  it('says what is wrong with a bad spec', () => {
+    expect(() => fromSpec({} as never)).toThrow(/"layers"/);
+    expect(() => fromSpec({ layers: [{ text: 'A', shape: 'star' }] })).toThrow(/not text and shape/);
+    expect(() => fromSpec({ layers: [{ shape: 'zigzagoon' }] })).toThrow(/No shape "zigzagoon"/);
+    expect(() => fromSpec({ layers: [{ text: 'A', place: 'nowhere' }] })).toThrow(/No spot/);
+    expect(() => fromSpec({ layers: [{ text: 'A' }], layout: [{ stack: ['A', 'Z'] }] })).toThrow(/No layer "Z"/);
+    expect(() => fromSpec({ layers: [{ text: 'A' }], kit: 'nope' })).toThrow(/No kit/);
+  });
+});
+
+group('motion recipes', () => {
+  const three = () => project([textLayer('A', 'archivo', { name: 'A' }), textLayer('B', 'archivo', { name: 'B' }), textLayer('C', 'archivo', { name: 'C' })], { timeline: { duration: 4, loop: true } });
+  const clips = (p: Project) => rowsOf(p, []).flatMap((r) => r.tracks.filter((t) => t.kind === 'enter' || t.kind === 'leave').map((t) => ({ name: r.node.name, kind: t.kind, start: (t as { start: number }).start, end: (t as { end: number }).end })));
+
+  it('staggers entrances and leaves before a looping clock ends, last in last out', () => {
+    const r = moveEdits(three(), { layers: ['A', 'B', 'C'], enter: 'rise', stagger: 0.2, start: 0.1 });
+    const c = clips(r.project);
+    expect(c.filter((x) => x.kind === 'enter').map((x) => +x.start.toFixed(2)).sort()).toEqual([0.1, 0.3, 0.5]);
+    const leaves = c.filter((x) => x.kind === 'leave');
+    expect(leaves).toHaveLength(3);
+    for (const l of leaves) expect(l.end).toBeLessThanOrEqual(4 - 0.1);
+    expect(r.summary).toMatch(/enter rise 0.2s apart from 0.1s, leaving from .*s so the 4s loop joins/);
+    const order = ['A', 'B', 'C'].map((n) => findNode(r.project, n).motion!.leaveAt!);
+    expect(order[0]).toBeLessThan(order[2]);
+  });
+
+  it('keeps letter-by-letter exits inside the clock, and stays when told', () => {
+    const r = moveEdits(three(), { layers: 'text', recipe: 'type-on' });
+    for (const l of clips(r.project).filter((x) => x.kind === 'leave')) expect(l.end).toBeLessThanOrEqual(4 - 0.149);
+    expect(findNode(r.project, 'A').motion).toMatchObject({ letters: 'letters', enter: 'fade' });
+    const stay = moveEdits(three(), { layers: ['A'], enter: 'grow', leave: 'none' });
+    expect(findNode(stay.project, 'A').motion?.leave).toBeUndefined();
+  });
+
+  it('runs loops out of step and refuses unknown names', () => {
+    const r = moveEdits(three(), { recipe: 'drift' });
+    expect(['A', 'B', 'C'].map((n) => findNode(r.project, n).motion!.phase)).toEqual([0, 0.25, 0.5]);
+    expect(() => moveEdits(three(), { recipe: 'wobble' })).toThrow(/Recipes: cascade/);
+    expect(() => moveEdits(three(), { enter: 'zoom' as never })).toThrow(/Entrances: fade/);
+    expect(() => moveEdits(three(), { feel: 'Wobbly', enter: 'rise' })).toThrow(/Feels: Smooth/);
+  });
+});
+
+group('check --fix', () => {
+  it('retimes moves the clock cuts off: earlier first, then quicker', () => {
+    const t = textLayer('A', 'archivo', { name: 'A', motion: newMotion({ enter: 'rise', delay: 3.8 }) });
+    const p = project([t], { timeline: { duration: 4, loop: true } });
+    const f = structural(p, null).find((x) => /cut off/.test(x.text))!;
+    expect(f.text).toMatch(/"A" .*its entrance ends at 4.4s, after the 4s clock: cut off/);
+    const q = applyEdits(p, f.fix!.edits!).project;
+    expect(findNode(q, 'A').motion!.delay).toBeCloseTo(3.3, 6);
+    // No room to start earlier: it gets quicker.
+    const slow = project([textLayer('A', 'archivo', { name: 'A', motion: newMotion({ enter: 'rise', transition: { ...newMotion().transition, duration: 5 } }) })], { timeline: { duration: 4, loop: false } });
+    const fix = retime(slow, slow.layers[0].id, 'enter');
+    const s = applyEdits(slow, fix.edits!).project;
+    expect(findNode(s, 'A').motion!.transition.duration).toBeLessThanOrEqual(3.9);
+    expect(fix.does).toMatch(/entrance now 0–.*s, inside the 4s clock/);
+  });
+
+  it('adds a way out for entrances that would replay at the seam, after the other fixes', () => {
+    const p = project([textLayer('A', 'archivo', { name: 'A', motion: newMotion({ enter: 'drop' }) }), textLayer('B', 'archivo', { name: 'B', motion: newMotion({ loop: 'float' }) })], { timeline: { duration: 3, loop: true } });
+    const fix = seamFix(p)!;
+    expect(fix.does).toMatch(/^"A" leaves \(drop\) at/);
+    const q = applyEdits(p, fix.edits!).project;
+    expect(findNode(q, 'B').motion?.leave).toBeUndefined();
+    expect(seamFix(q)).toBeNull();
+    expect(seamFix({ ...p, timeline: { duration: 3, loop: false } })).toBeNull();
+  });
+
+  it('plans fixes for warnings, leaves notes alone, and lists the rest as commands', () => {
+    const fs: Finding[] = [
+      { level: 'warn', text: 'cut', fix: { edits: ['A.x=1'], does: 'moved' } },
+      { level: 'warn', text: 'near', hint: `align {file} "A" --to "B" --edge left` },
+      { level: 'warn', text: 'just words' },
+      { level: 'info', text: 'note', fix: { edits: ['A.x=2'], does: 'no' } },
+    ];
+    const plan = fixPlan(fs);
+    expect(plan.edits).toEqual(['A.x=1']);
+    expect(plan.done).toEqual(['cut → moved']);
+    expect(todoText(plan.todo, 'my poster.morpho')).toEqual([`morpho align "my poster.morpho" "A" --to "B" --edge left   # near`, '# just words']);
+    expect(report('T', fs)).toContain('! cut [--fix]');
+  });
+
+  it('turns style rules into notes for abstract designs, and only those', () => {
+    const fs: Finding[] = [
+      { level: 'warn', text: 'nearly centred', style: true, fix: { layout: [], does: 'centred' } },
+      { level: 'warn', text: 'off the edge' },
+    ];
+    expect(forStyle(fs, 'poster')).toBe(fs);
+    const a = forStyle(fs, 'abstract');
+    expect(a[0]).toMatchObject({ level: 'info', fix: undefined });
+    expect(a[1]).toBe(fs[1]);
+  });
+
+  it('only flags a pop when the steps on both sides are small (a move from rest is not a pop)', () => {
+    expect(motionFindings([{ t: 1, a: 0, b: 12, c: 11 }], null, true)).toEqual([]);
+    expect(motionFindings([{ t: 1, a: 0.1, b: 12, c: 0.2 }], null, true)[0].text).toMatch(/pop at 1s/);
+  });
+});
+
+group('set --check', () => {
+  it('shows what appeared, went away and changed', () => {
+    const before: Finding[] = [
+      { level: 'warn', text: '"T": 10% off the left edge' },
+      { level: 'warn', text: '"A" and "B": lefts 3px apart, nearly lined up' },
+      { level: 'info', text: 'looked at 2 of 2 layers' },
+    ];
+    const after: Finding[] = [
+      { level: 'warn', text: '"T": 4% off the left edge' },
+      { level: 'error', text: '"C": entirely outside the canvas' },
+      { level: 'info', text: 'looked at 3 of 3 layers' },
+    ];
+    expect(diffFindings(before, after)).toEqual(['~ ! "T": 4% off the left edge (was: "T": 10% off the left edge)', '+ ✗ "C": entirely outside the canvas', '− ! "A" and "B": lefts 3px apart, nearly lined up']);
+    expect(diffFindings(after, after)).toEqual([]);
+  });
+});
diff --git a/ui/src/agent/make.ts b/ui/src/agent/make.ts
new file mode 100644
index 0000000..0449bf4
--- /dev/null
+++ b/ui/src/agent/make.ts
@@ -0,0 +1,229 @@
+// A whole design from one spec: canvas, background, kit, layers (text,
+// shapes, lines, outlines, groups, modifiers), where they go and how they
+// move. Building is plain data (this file); placing needs the engine's boxes,
+// so the layout comes back as instructions for page.ts to resolve (measure,
+// then place). Layers are listed bottom first: later ones draw on top.
+//
+//   { "name": "Night Drive", "canvas": "1080x1350", "kit": "chrome-night", "duration": 4,
+//     "layers": [
+//       { "shape": "ring", "name": "Halo", "fitWidth": 85, "place": "top third" },
+//       { "text": "NIGHT\nDRIVE", "name": "Title", "fitWidth": 80, "place": "top third" },
+//       { "text": "LIVE · 21.11 · WAREHOUSE 9", "name": "Info", "place": "bottom" } ],
+//     "motion": { "recipe": "cascade", "layers": ["Title", "Info"] } }
+import { ENTER_UI } from '../state/motion';
+import { isGroup, type Project } from '../state/model';
+import { addLayer, addModifier, addGroup, blank, type Add, type Change, type LayerKind } from './build';
+import { applyEdits } from './edit';
+import { allNodes, EditError, findNode } from './find';
+import { kitByName, kitColor, type Kit, type Look, type Role } from './kits';
+import { moveEdits, type MoveSpec } from './moves';
+import { setLayout, type LayoutOp, type Placement, type Stack } from './place';
+
+export interface LayerSpec {
+  name?: string;
+  text?: string;
+  shape?: string;
+  line?: string;
+  path?: string;
+  /** Children, bottom first; with `merge` they fuse into one shape. */
+  group?: LayerSpec[];
+  merge?: boolean;
+  /** Which of the kit's looks it takes (default: the first text is the headline, other text is body, the rest accent). */
+  role?: Role;
+  font?: string;
+  size?: number;
+  /** #rrggbb or a kit palette name: the look's main colour (a fill, a neon's glow, an ink), or flat in that colour. */
+  color?: string;
+  material?: string;
+  preset?: string;
+  recipe?: string;
+  /** Modifiers by kind, with fields: [{ "kind": "wave", "amplitude": 0.04 }] (or just "wave"). */
+  modifiers?: (string | ({ kind: string } & Record<string, unknown>))[];
+  /** px from the centre, "x,y" or [x, y]: only when no place is given. */
+  at?: string | [number, number];
+  rotation?: number;
+  scale?: number;
+  /** Pen lines: stroke width, px. */
+  width?: number;
+  tracking?: number;
+  // Layout (see place.ts).
+  fit?: string | number;
+  fitWidth?: number;
+  fitHeight?: number;
+  place?: string;
+  margin?: number | string;
+  centre?: boolean | 'x' | 'y' | 'both';
+  contain?: boolean;
+  offset?: [number, number] | string;
+  /** Any other settings, as Layer.setting assignments without the layer: { "gloss": 0.4 } or ["wave.amplitude=0.05"]. */
+  set?: Record<string, unknown> | string[];
+  /** This layer's motion: a recipe's fields (enter, loop, delay…), or motion settings as they're stored. */
+  motion?: MoveSpec & { delay?: number } & Record<string, unknown>;
+}
+
+export interface Spec {
+  name?: string;
+  /** "1080x1350", a preset name ("Instagram post") or { width, height }. */
+  canvas?: string | { width: number; height: number };
+  /** A colour, "#a,#b", a background preset, or a background object. */
+  background?: string | Project['background'];
+  kit?: string;
+  style?: 'poster' | 'logo' | 'abstract';
+  /** Seconds on the clock; with `loop` (default true). */
+  duration?: number;
+  loop?: boolean;
+  layers: LayerSpec[];
+  /** Stacks and rows: { "stack": ["Title", "Info"], "gap": 40, "place": "centre" }. */
+  layout?: Stack[];
+  /** Motion recipes over several layers: { "recipe": "cascade", "layers": ["Title", "Info"] }. */
+  motion?: MoveSpec | MoveSpec[];
+  /** Assignments over everything, last: ["Title.gloss=0.6", "background.grain=0.2"]. */
+  set?: string[];
+}
+
+export interface Made {
+  project: Project;
+  /** For page.ts to resolve against the build: fits first, then places and stacks. */
+  layout: LayoutOp[];
+  /** What was built, a line per step. */
+  notes: string[];
+}
+
+const LAYOUT_KEYS = ['fit', 'fitWidth', 'fitHeight', 'place', 'margin', 'centre', 'contain', 'offset'] as const;
+const MOVE_KEYS = new Set(['recipe', 'enter', 'leave', 'loop', 'stagger', 'start', 'feel', 'duration', 'distance', 'letters', 'letterStagger', 'period', 'amount', 'spread', 'leaveAt']);
+
+function kindOf(l: LayerSpec): [LayerKind | 'group', string] {
+  const kinds = (['text', 'shape', 'line', 'path', 'group'] as const).filter((k) => l[k] !== undefined);
+  if (kinds.length !== 1) throw new EditError(`each layer is one of text, shape, line, path or group${kinds.length ? `, not ${kinds.join(' and ')}` : ''}: ${JSON.stringify(l).slice(0, 80)}`);
+  const k = kinds[0];
+  return [k, k === 'group' ? '' : String(l[k])];
+}
+
+/** The look a layer takes: its own settings over its role's in the kit. */
+function lookOf(kit: Kit | null, role: Role, l: LayerSpec, p: Project): Add {
+  const k: Look = kit?.[role] ?? {};
+  const short = Math.min(p.canvas.width, p.canvas.height);
+  // A preset or material of its own replaces the kit's look; a colour of its own tints it.
+  const own = l.preset || l.material;
+  const color = l.color ?? (own ? undefined : k.color);
+  return {
+    font: l.font ?? k.font,
+    preset: own ? l.preset : k.preset,
+    material: l.material,
+    recipe: l.recipe ?? (own || l.color ? undefined : k.recipe),
+    color: color ? kitColor(kit, color) : undefined,
+    size: l.size ?? (k.size && role !== 'headline' ? Math.round(short * k.size) : role === 'body' && l.text !== undefined ? Math.round(short * 0.034) : undefined),
+  };
+}
+
+/** The spec as a project, its layout instructions and notes. */
+export function fromSpec(spec: Spec, o: { kit?: string; style?: Spec['style'] } = {}): Made {
+  if (!spec || !Array.isArray(spec.layers)) throw new EditError('a spec has "layers": [ … ], bottom first (see docs/AGENT-TOOLS.md)');
+  const kitName = o.kit ?? spec.kit;
+  const kit = kitName ? kitByName(kitName) : null;
+  const canvas = typeof spec.canvas === 'object' ? `${spec.canvas.width}x${spec.canvas.height}` : spec.canvas;
+  let p = blank({ name: spec.name, canvas, background: typeof spec.background === 'string' ? spec.background : kit?.background, duration: spec.duration });
+  if (spec.background && typeof spec.background === 'object') p.background = structuredClone(spec.background);
+  if (spec.duration !== undefined || spec.loop !== undefined) p.timeline = { duration: spec.duration ?? 6, loop: spec.loop ?? true };
+  const style = o.style ?? spec.style;
+  if (kit || style) p.agent = { ...(kit ? { kit: kit.name } : {}), ...(style ? { style } : {}) };
+  const notes: string[] = [];
+  const layout: LayoutOp[] = [];
+  const fits: LayoutOp[] = [];
+  const moves: MoveSpec[] = [];
+  let headline = false;
+
+  /** Adds one layer (or group) on top, or into a group; returns its id. */
+  const add = (l: LayerSpec): string => {
+    const [kind, what] = kindOf(l);
+    let id: string;
+    if (kind === 'group') {
+      const kids = (l.group ?? []).map((c) => add(c));
+      const r = addGroup(p, kids.map((k) => '#' + k), { name: l.name, merge: !!l.merge, preset: l.preset, material: l.material, recipe: l.recipe });
+      p = r.project;
+      id = r.id!;
+      notes.push(r.change);
+    } else {
+      const role: Role = l.role ?? (kind === 'text' ? (headline ? 'body' : 'headline') : 'accent');
+      if (role === 'headline' && kind === 'text') headline = true;
+      const look = lookOf(kit, role, l, p);
+      const at = Array.isArray(l.at) ? l.at.join(',') : l.at;
+      const r = addLayer(p, kind, what, { name: l.name, at, rotation: l.rotation, scale: l.scale, width: l.width, ...look });
+      p = r.project;
+      id = r.id!;
+      const tracking = l.tracking ?? (kind === 'text' ? kit?.[role].tracking : undefined);
+      if (tracking !== undefined) p = applyEdits(p, [`#${id}.content.tracking=${tracking}`]).project;
+      notes.push(r.change + (kit ? ` · ${role}` : ''));
+      // A headline with no size of its own fills most of the width.
+      if (role === 'headline' && kind === 'text' && l.size === undefined && l.fit === undefined && l.fitWidth === undefined && l.fitHeight === undefined) fits.push({ target: '#' + id, fitWidth: 80 });
+    }
+    for (const m of l.modifiers ?? []) {
+      const { kind: mk, ...fields } = typeof m === 'string' ? { kind: m } : m;
+      const r = addModifier(p, '#' + id, mk, fields);
+      p = r.project;
+    }
+    if (l.set) {
+      const list = Array.isArray(l.set) ? l.set : Object.entries(l.set).map(([k, v]) => `${k}=${JSON.stringify(v)}`);
+      p = applyEdits(p, list.map((a) => `#${id}.${a}`)).project;
+    }
+    const place: Placement = { target: '#' + id };
+    for (const k of LAYOUT_KEYS) if (l[k] !== undefined) setLayout(place, k, k === 'centre' && l[k] === true ? 'both' : l[k]);
+    if (Object.keys(place).length > 1) {
+      // Fits run before anything is placed, but keep each layer's own order.
+      if (place.fitWidth !== undefined || place.fitHeight !== undefined) fits.push({ target: place.target, fitWidth: place.fitWidth, fitHeight: place.fitHeight });
+      const { fitWidth: _w, fitHeight: _h, ...rest } = place;
+      if (Object.keys(rest).length > 1) layout.push(rest);
+    }
+    if (l.motion) {
+      const m = l.motion;
+      const recipe = Object.fromEntries(Object.entries(m).filter(([k]) => MOVE_KEYS.has(k))) as MoveSpec;
+      const raw = Object.entries(m).filter(([k]) => !MOVE_KEYS.has(k) && k !== 'delay' && k !== 'layers');
+      if (m.delay !== undefined) recipe.start = m.delay as number;
+      if (Object.keys(recipe).length) moves.push({ ...recipe, layers: ['#' + id] });
+      if (raw.length) p = applyEdits(p, raw.map(([k, v]) => `#${id}.motion.${k}=${JSON.stringify(v)}`)).project;
+    }
+    return id;
+  };
+  for (const l of spec.layers) add(l);
+  for (const s of spec.layout ?? []) {
+    if (!s.stack && !s.row) throw new EditError(`layout entries are stacks or rows: { "stack": ["A", "B"], "gap": 40 }, got ${JSON.stringify(s).slice(0, 60)}`);
+    for (const t of s.stack ?? s.row ?? []) findNode(p, t);
+    layout.push(s);
+  }
+  // Motion last, once every layer exists: recipes over several layers, then each layer's own.
+  const recipes = spec.motion ? (Array.isArray(spec.motion) ? spec.motion : [spec.motion]) : [];
+  for (const m of [...recipes, ...moves]) {
+    if (m.enter && !(m.enter in ENTER_UI) && m.enter !== 'fade') throw new EditError(`No entrance "${m.enter}". Entrances: fade, ${Object.keys(ENTER_UI).join(', ')}`);
+    const r = moveEdits(p, m);
+    p = r.project;
+    notes.push(r.summary);
+  }
+  if (spec.set?.length) {
+    const r = applyEdits(p, spec.set);
+    p = r.project;
+    notes.push(...r.changes);
+  }
+  return { project: p, layout: [...fits, ...layout], notes };
+}
+
+/** A blank design, with a kit's background and the kit and style kept for later adds and checks. */
+export function newDesign(o: { name?: string; canvas?: string; background?: string; duration?: number; kit?: string; style?: Spec['style'] }): Project {
+  const kit = o.kit ? kitByName(o.kit) : null;
+  const p = blank({ ...o, background: o.background ?? kit?.background });
+  if (o.style && !['poster', 'logo', 'abstract'].includes(o.style)) throw new EditError(`--style is poster, logo or abstract, not "${o.style}"`);
+  if (kit || o.style) p.agent = { ...(kit ? { kit: kit.name } : {}), ...(o.style ? { style: o.style } : {}) };
+  return p;
+}
+
+/** add, with the design's kit: the role's look (headline, accent, body) under the layer's own settings. */
+export function addWithKit(p: Project, kind: LayerKind, what: string, o: Add & { role?: string }): Change {
+  const kit = p.agent?.kit ? kitByName(p.agent.kit) : null;
+  if (o.role && !['headline', 'accent', 'body'].includes(o.role)) throw new EditError(`--role is headline, accent or body, not "${o.role}"`);
+  if (!kit) return addLayer(p, kind, what, { ...o, color: o.color ? kitColor(null, o.color) : undefined });
+  const texts = allNodes(p.layers).some((n) => !isGroup(n) && n.content.type === 'text');
+  const role = (o.role as Role | undefined) ?? (kind === 'text' ? (texts ? 'body' : 'headline') : 'accent');
+  const look = lookOf(kit, role, { text: kind === 'text' ? what : undefined, font: o.font, size: o.size, color: o.color, preset: o.preset, material: o.material, recipe: o.recipe }, p);
+  const r = addLayer(p, kind, what, { ...o, ...look });
+  const tracking = kind === 'text' ? kit[role].tracking : undefined;
+  return tracking === undefined ? r : { ...r, project: applyEdits(r.project, [`#${r.id}.content.tracking=${tracking}`]).project, change: `${r.change} · ${role} (${kit.name})` };
+}
diff --git a/ui/src/agent/moves.ts b/ui/src/agent/moves.ts
new file mode 100644
index 0000000..533f350
--- /dev/null
+++ b/ui/src/agent/moves.ts
@@ -0,0 +1,181 @@
+// Motion recipes: an entrance, a loop and a way out for several layers in one
+// go (`--enter rise --stagger 0.15`), as assignments on today's motion model,
+// so nobody writes keyframe JSON or works out delays by hand. On a looping
+// clock everything that enters also leaves before the clock ends (unless told
+// not to), so the loop joins without the entrance replaying as a jump.
+import { timelineOf } from '../state/clock';
+import { ENTER_UI, FEELS, LEAVE_UI, LOOP_UI, settleTime, type EnterKind, type LeaveKind, type LoopKind, type Transition } from '../state/motion';
+import { isGroup, type Node, type Project } from '../state/model';
+import { rowsOf } from '../state/tracks';
+import { num } from './describe';
+import { applyEdits } from './edit';
+import { allNodes, EditError, findNode } from './find';
+
+export interface MoveSpec {
+  /** Layer names or ids, in the order they move; or "all" (top-level layers, bottom up), "text", "shapes". */
+  layers?: string[] | string;
+  /** A named recipe (see RECIPES); the other fields override it. */
+  recipe?: string;
+  enter?: EnterKind;
+  /** "auto" (the default on a looping clock): the entrance's way out; "none" stays. */
+  leave?: LeaveKind | 'auto';
+  loop?: LoopKind;
+  /** Seconds between one layer and the next. */
+  stagger?: number;
+  /** When the first one starts, s. */
+  start?: number;
+  /** Smooth, Snappy, Bouncy or Slow. */
+  feel?: string;
+  /** Seconds each entrance takes. */
+  duration?: number;
+  distance?: number;
+  /** Text moves letter by letter (or word by word), `letterStagger` s apart. */
+  letters?: boolean | 'letters' | 'words';
+  letterStagger?: number;
+  period?: number;
+  amount?: number;
+  /** Loops: phase step from one layer to the next (0…1), so they move out of step. */
+  spread?: number;
+  /** When leaving starts, s (default: as late as still ends before the clock). */
+  leaveAt?: number;
+}
+
+export const RECIPES: Record<string, { blurb: string; spec: MoveSpec }> = {
+  cascade: { blurb: 'each rises in, one after another', spec: { enter: 'rise', stagger: 0.15, feel: 'Smooth' } },
+  pop: { blurb: 'each grows in with a spring', spec: { enter: 'grow', stagger: 0.1, feel: 'Bouncy' } },
+  'type-on': { blurb: 'text fades in letter by letter', spec: { enter: 'fade', letters: 'letters', letterStagger: 0.05, stagger: 0.3 } },
+  'slide-in': { blurb: 'each slides in from the left', spec: { enter: 'left', stagger: 0.12, feel: 'Snappy' } },
+  drop: { blurb: 'each drops in from above with a bounce', spec: { enter: 'drop', stagger: 0.12, feel: 'Bouncy' } },
+  drift: { blurb: 'everything floats, out of step', spec: { loop: 'float', spread: 0.25 } },
+  breathe: { blurb: 'everything pulses gently, out of step', spec: { loop: 'pulse', amount: 6, spread: 0.2 } },
+};
+
+/** The way out that continues an entrance. */
+const OUT: Partial<Record<EnterKind, LeaveKind>> = { rise: 'rise', drop: 'drop', left: 'right', right: 'left', grow: 'shrink' };
+
+/** Gap left at the end of a looping clock, s: everything has gone before it starts over. */
+const PAD = 0.15;
+/** Least time to stay still between arriving and leaving, s. */
+const HOLD = 0.4;
+
+function targetsOf(p: Project, layers: MoveSpec['layers']): Node[] {
+  if (layers === undefined || layers === 'all') return p.layers.filter((n) => n.visible);
+  if (layers === 'text') return allNodes(p.layers).filter((n) => !isGroup(n) && n.content.type === 'text');
+  if (layers === 'shapes') return allNodes(p.layers).filter((n) => !isGroup(n) && n.content.type !== 'text');
+  const list = typeof layers === 'string' ? layers.split(',').map((s) => s.trim()).filter(Boolean) : layers;
+  return list.map((t) => findNode(p, t));
+}
+
+function feelOf(name: string | undefined, duration: number | undefined): Transition | undefined {
+  if (!name && duration === undefined) return undefined;
+  const f = name ? FEELS.find((x) => x.label.toLowerCase() === name.toLowerCase()) : FEELS[0];
+  if (!f) throw new EditError(`No feel "${name}". Feels: ${FEELS.map((x) => x.label).join(', ')}`);
+  return { ...f.value, ...(duration !== undefined ? { duration } : {}) };
+}
+
+/** When a node's entrance and exit clips end on the clock (stagger and letters included). */
+function ends(p: Project, id: string): { enter: number; leave: number } {
+  const out = { enter: 0, leave: 0 };
+  const walk = (rows: ReturnType<typeof rowsOf>) => {
+    for (const r of rows)
+      for (const t of r.tracks) {
+        if ((t.kind === 'enter' || t.kind === 'leave') && (t.owner === id || r.node.id === id)) out[t.kind] = Math.max(out[t.kind], t.end);
+      }
+  };
+  walk(rowsOf(p, []));
+  return out;
+}
+
+const ref = (n: Node) => JSON.stringify('#' + n.id);
+
+/**
+ * Exits for `nodes` timed to end just before a looping clock does: the
+ * entrance's way out (or `kind`), as late as fits, last in last out.
+ * Returns the edits and the project with them.
+ */
+export function leaveEdits(p: Project, nodes: Node[], kind?: LeaveKind, stagger = 0, at?: number): { edits: string[]; project: Project } {
+  const D = timelineOf(p).duration;
+  const edits: string[] = [];
+  nodes.forEach((n, i) => {
+    const m = n.motion;
+    const k = kind ?? (m && OUT[m.enter]) ?? 'fade';
+    edits.push(`${ref(n)}.motion.leave=${JSON.stringify(k)}`);
+    const settle = settleTime(m?.leaveTransition ?? m?.transition ?? FEELS[0].value);
+    edits.push(`${ref(n)}.motion.leaveAt=${+Math.max(0, at ?? D - PAD - settle - (nodes.length - 1 - i) * stagger * 0.5).toFixed(2)}`);
+  });
+  let q = applyEdits(p, edits).project;
+  if (at !== undefined) return { edits, project: q };
+  // Letters and staggered groups take longer to leave than one transition: pull those in by what overshoots.
+  const fixes: string[] = [];
+  for (const n of nodes) {
+    const e = ends(q, n.id);
+    const over = e.leave - (D - PAD);
+    const leaveAt = findNode(q, n.id).motion?.leaveAt ?? 0;
+    if (over > 0.005) fixes.push(`${ref(n)}.motion.leaveAt=${+Math.max(0, leaveAt - over).toFixed(2)}`);
+  }
+  if (fixes.length) q = applyEdits(q, fixes).project;
+  // Something still entering when it should leave: bring its entrance forward so it holds still a moment.
+  const early: string[] = [];
+  for (const n of nodes) {
+    const m = findNode(q, n.id).motion!;
+    const short = ends(q, n.id).enter + HOLD - (m.leaveAt ?? 0);
+    if (short > 0.005 && m.enter !== 'none' && m.delay > 0) early.push(`${ref(n)}.motion.delay=${+Math.max(0, m.delay - short).toFixed(2)}`);
+  }
+  if (early.length) q = applyEdits(q, early).project;
+  return { edits: [...edits, ...fixes, ...early], project: q };
+}
+
+/** A recipe over layers, as assignments, and a line on what it does. */
+export function moveEdits(p: Project, spec0: MoveSpec): { edits: string[]; project: Project; summary: string } {
+  const named = spec0.recipe ? RECIPES[spec0.recipe.toLowerCase()] : undefined;
+  if (spec0.recipe && !named) throw new EditError(`No motion recipe "${spec0.recipe}". Recipes: ${Object.keys(RECIPES).join(', ')}`);
+  const spec: MoveSpec = { ...named?.spec, ...Object.fromEntries(Object.entries(spec0).filter(([, v]) => v !== undefined)) };
+  const nodes = targetsOf(p, spec.layers);
+  if (!nodes.length) throw new EditError('motion needs layers to move');
+  const tl = timelineOf(p);
+  const D = tl.duration;
+  if (spec.enter && !(spec.enter in ENTER_UI) && spec.enter !== 'fade') throw new EditError(`No entrance "${spec.enter}". Entrances: fade, ${Object.keys(ENTER_UI).join(', ')}`);
+  if (spec.loop && !(spec.loop in LOOP_UI) && spec.loop !== 'none') throw new EditError(`No loop "${spec.loop}". Loops: ${Object.keys(LOOP_UI).join(', ')}`);
+  if (spec.leave && spec.leave !== 'auto' && spec.leave !== 'none' && spec.leave !== 'fade' && !(spec.leave in LEAVE_UI)) throw new EditError(`No way out "${spec.leave}". Leaves: auto, none, fade, ${Object.keys(LEAVE_UI).join(', ')}`);
+  const stagger = spec.stagger ?? 0;
+  const start = spec.start ?? 0;
+  const tr = feelOf(spec.feel, spec.duration);
+  const edits: string[] = [];
+  nodes.forEach((n, i) => {
+    const id = ref(n);
+    if (spec.enter) {
+      edits.push(`${id}.motion.enter=${JSON.stringify(spec.enter)}`, `${id}.motion.delay=${+(start + i * stagger).toFixed(3)}`);
+      if (tr) edits.push(`${id}.motion.transition=${JSON.stringify(tr)}`);
+      if (spec.distance !== undefined) edits.push(`${id}.motion.distance=${spec.distance}`);
+      if (spec.letters && !isGroup(n) && n.content.type === 'text') edits.push(`${id}.motion.letters=${JSON.stringify(spec.letters === true ? 'letters' : spec.letters)}`, `${id}.motion.stagger=${spec.letterStagger ?? 0.05}`);
+    }
+    if (spec.loop) {
+      edits.push(`${id}.motion.loop=${JSON.stringify(spec.loop)}`);
+      if (spec.period !== undefined) edits.push(`${id}.motion.period=${spec.period}`);
+      if (spec.amount !== undefined) edits.push(`${id}.motion.amount=${spec.amount}`);
+      if (spec.spread) edits.push(`${id}.motion.phase=${+((i * spec.spread) % 1).toFixed(3)}`);
+    }
+  });
+  let { project } = applyEdits(p, edits);
+  const all = [...edits];
+  const leave = spec.leave ?? (spec.enter && tl.loop ? 'auto' : undefined);
+  let out = '';
+  if (leave && leave !== 'none') {
+    const fresh = nodes.map((n) => findNode(project, n.id));
+    const r = leaveEdits(project, fresh, leave === 'auto' ? undefined : leave, stagger, spec.leaveAt);
+    project = r.project;
+    all.push(...r.edits);
+    const first = Math.min(...fresh.map((n) => findNode(project, n.id).motion?.leaveAt ?? D));
+    out = `, leaving from ${num(first)}s so the ${num(D)}s loop joins`;
+    const tight = fresh.filter((n) => findNode(project, n.id).motion!.leaveAt! < ends(project, n.id).enter + HOLD - 0.01).map((n) => n.name ?? n.id);
+    if (tight.length) out += ` (! ${tight.join(', ')} barely ${tight.length > 1 ? 'hold' : 'holds'} still: a longer clock, a shorter stagger or fewer layers)`;
+  }
+  const lateIn = nodes.filter((n) => ends(project, n.id).enter > D + 1e-3).map((n) => n.name ?? n.id);
+  if (lateIn.length) out += ` (! ${lateIn.join(', ')} ${lateIn.length > 1 ? 'are' : 'is'} still entering when the clock ends)`;
+  const what = [spec.enter && `enter ${spec.enter}${stagger ? ` ${num(stagger)}s apart` : ''}${start ? ` from ${num(start)}s` : ''}${spec.letters ? ' letter by letter' : ''}`, spec.loop && `loop ${spec.loop}${spec.spread ? ' out of step' : ''}`].filter(Boolean).join(', ');
+  return { edits: all, project, summary: `motion ${spec.recipe ? `${spec.recipe}: ` : ''}${nodes.map((n) => n.name ?? n.id).join(', ')}: ${what || 'leave'}${out}` };
+}
+
+export function recipesText(): string {
+  return ['motion recipes (morpho motion <file> <layers…> --recipe name, or "motion" in a make spec):', ...Object.entries(RECIPES).map(([k, r]) => `  ${k}: ${r.blurb} (${JSON.stringify(r.spec)})`), '  or by hand: --enter rise|drop|left|right|grow|spin|fade --stagger 0.15 --feel Smooth|Snappy|Bouncy|Slow --loop float --leave auto|none|fade…'].join('\n');
+}
diff --git a/ui/src/agent/node.ts b/ui/src/agent/node.ts
index fb72fa2..a59a702 100644
--- a/ui/src/agent/node.ts
+++ b/ui/src/agent/node.ts
@@ -14,3 +14,6 @@ export const catalog = (q = '') => catalogText(q, TEMPLATES);
 export const template = (name: string): Project => findTemplate(TEMPLATES, name).make();
 export { timing } from './timing';
 export { addGroup, addLayer, addModifier, arrange, blank, duplicateLayer, removeLayers } from './build';
+export { addWithKit, newDesign } from './make';
+export { moveEdits } from './moves';
+export { layoutFromAssignments } from './place';
diff --git a/ui/src/agent/page.ts b/ui/src/agent/page.ts
index 80c49e4..ebf9617 100644
--- a/ui/src/agent/page.ts
+++ b/ui/src/agent/page.ts
@@ -4,7 +4,6 @@
 // and check it. Everything returns text or one PNG, so a caller spends one
 // image on what would otherwise be a dozen screenshots.
 import { engine } from '../engine/client';
-import type { Box } from '../engine/types';
 import { fontId, fromBase64 } from '../fonts/library';
 import { effectById } from '../render/effects';
 import { getRenderer, loadProjectFonts, placeReference } from '../app/actions';
@@ -20,10 +19,14 @@ import { replaceProject, store } from '../state/store';
 import { loadedTemplates, loadTemplates } from '../state/templateCatalog';
 import { buildScene } from '../state/tree';
 import { catalog, findTemplate } from './catalog';
-import { label, motionFindings, outside, presence, report, spread, structural, type Finding, type Pixels, diff } from './check';
+import { forStyle, label, motionFindings, outside, presence, report, spread, structural, type Finding, type Pixels, diff } from './check';
 import { describe, num } from './describe';
 import { applyEdits, findNode } from './edit';
+import { handle } from './find';
+import { contrastHint, diffFindings, fixPlan, seamFix, todoText } from './fix';
 import { boxTable, itemsOf, layoutFindings, lookFindings } from './layout';
+import { fromSpec, type Spec } from './make';
+import { alignEdits, boxesOf, fitEdits, layoutText, placeEdits, type LayoutOp } from './place';
 
 /** Geometry quality for output (the preview builds at 120), as exports use. */
 const OUTPUT_QUALITY = 360;
@@ -264,28 +267,64 @@ function hide(p: Project, id: string): Project {
   return q;
 }
 
+interface CheckOpts {
+  size?: number;
+  layers?: number;
+  /** poster | logo | abstract (default: the design's own, else poster). */
+  style?: string;
+}
+
 /** Every check, as a short report. `layers` caps how many layers get the (slower) visibility check. */
-async function check(o: { size?: number; layers?: number } = {}): Promise<string> {
-  return draft(() => checkAll(o));
+async function check(o: CheckOpts = {}): Promise<string> {
+  const r = await findings(o);
+  return report(r.title, r.findings);
+}
+
+/** Findings as data for the CLI (what a fix would work out again isn't data). */
+const plain = (fs: Finding[]): Finding[] => fs.map((f) => (f.fix?.redo ? { ...f, fix: { ...f.fix, redo: undefined } } : f));
+
+/** check for the CLI: the report, what --fix would do, the rest as commands, and the findings themselves. */
+async function checkFull(o: CheckOpts & { file?: string } = {}) {
+  const r = await findings(o);
+  const plan = fixPlan(r.findings);
+  const lines = [report(r.title, r.findings)];
+  if (plan.done.length) lines.push(`${plan.done.length} can be fixed automatically ([--fix]): morpho check ${o.file ?? '<file>'} --fix`);
+  const cmds = todoText(plan.todo, o.file ?? '<file>').filter((l) => l.startsWith('morpho'));
+  if (cmds.length) lines.push('to do:', ...cmds.map((l) => `  ${l}`));
+  return { text: lines.join('\n'), findings: plain(r.findings), moving: moves(store.get().project) };
 }
 
-async function checkAll(o: { size?: number; layers?: number }): Promise<string> {
+/** Every check, as findings (with what --fix would do), for the current design's style. */
+async function findings(o: CheckOpts = {}): Promise<{ title: string; findings: Finding[] }> {
+  const r = await draft(() => checkAll(o));
+  return { title: r.title, findings: forStyle(r.findings, o.style ?? store.get().project.agent?.style) };
+}
+
+async function checkAll(o: CheckOpts): Promise<{ title: string; findings: Finding[] }> {
   const p = structuredClone(store.get().project);
   const findings: Finding[] = structural(p, store.get().build);
   const scale = fit(p, o.size ?? 360);
   const tl = timelineOf(p);
   try {
-    // Motion: runs of three frames one video frame apart, across the clock and around the seam.
+    // Motion: runs of four frames one video frame apart, across the clock and around the seam.
     if (moves(p)) {
       const dt = 1 / 30, n = 12, D = tl.duration;
-      const starts = Array.from({ length: n }, (_, i) => ((i + 0.5) * D) / n).filter((t) => t + 2 * dt <= D);
-      const at = starts.flatMap((t) => [t, t + dt, t + 2 * dt]);
+      const starts = Array.from({ length: n }, (_, i) => ((i + 0.5) * D) / n).filter((t) => t + 3 * dt <= D);
+      const at = starts.flatMap((t) => [t, t + dt, t + 2 * dt, t + 3 * dt]);
       if (tl.loop) at.push(D - 2 * dt, D - dt, 0, dt);
       const imgs = await frames(at, scale);
-      const runs = starts.map((t, i) => ({ t: t + dt, a: diff(imgs[3 * i], imgs[3 * i + 1]), b: diff(imgs[3 * i + 1], imgs[3 * i + 2]) }));
-      const k = starts.length * 3;
+      const runs = starts.map((t, i) => ({ t: +(t + 1.5 * dt).toFixed(3), a: diff(imgs[4 * i], imgs[4 * i + 1]), b: diff(imgs[4 * i + 1], imgs[4 * i + 2]), c: diff(imgs[4 * i + 2], imgs[4 * i + 3]) }));
+      const k = starts.length * 4;
       const seam = tl.loop ? { a: diff(imgs[k], imgs[k + 1]), b: diff(imgs[k + 1], imgs[k + 2]), c: diff(imgs[k + 2], imgs[k + 3]) } : null;
-      findings.push(...motionFindings(runs, seam, true));
+      findings.push(
+        ...motionFindings(runs, seam, true).map((f) => {
+          if (f.text.startsWith('the loop jumps')) {
+            const fix = seamFix(p);
+            return fix ? { ...f, fix } : { ...f, hint: 'timing {file}' };
+          }
+          return f.text.startsWith('pop at') ? { ...f, hint: 'timing {file}' } : f;
+        }),
+      );
     } else findings.push({ level: 'info', text: 'still design: nothing moves' });
     // What shows: the design against itself with each layer hidden, at the same quality.
     await load(p, PREVIEW_QUALITY);
@@ -307,14 +346,116 @@ async function checkAll(o: { size?: number; layers?: number }): Promise<string>
       const s = presence(still, without);
       // Unseen: next to nothing changes, for its size (tiny marks and hairlines count too).
       const area = b ? Math.max(0, b[2] - b[0]) * Math.max(0, b[3] - b[1]) * scale * scale : 0;
-      if (s.px < Math.max(1, Math.min(area * 0.02, 40))) findings.push({ level: 'warn', text: `${label(n)}: can't be seen at rest (covered, transparent, off the canvas or still to enter)` });
-      else if (!isGroup(n) && n.content.type === 'text' && s.contrast < 2) findings.push({ level: 'warn', text: `${label(n)}: low contrast, ${num(s.contrast)}:1 against what's behind it` });
+      if (s.px < Math.max(1, Math.min(area * 0.02, 40))) findings.push({ level: 'warn', text: `${label(n)}: can't be seen at rest (covered, transparent, off the canvas or still to enter)`, hint: `arrange {file} ${JSON.stringify(handle(p, n))} top` });
+      else if (!isGroup(n) && n.content.type === 'text' && s.contrast < 2) findings.push({ level: 'warn', text: `${label(n)}: low contrast, ${num(s.contrast)}:1 against what's behind it`, hint: contrastHint(p, n, s.behind) });
     }
     findings.push({ level: 'info', text: `looked at ${picked.length} of ${all.length} layers${picked.length < all.length ? ' (raise --layers to see the rest)' : ''}` });
   } finally {
     await load(p);
   }
-  return report(`"${p.name}" ${p.canvas.width}×${p.canvas.height}${moves(p) ? `, ${num(tl.duration)}s${tl.loop ? ' loop' : ''}` : ''}`, findings);
+  return { title: `"${p.name}" ${p.canvas.width}×${p.canvas.height}${moves(p) ? `, ${num(tl.duration)}s${tl.loop ? ' loop' : ''}` : ''}${p.agent?.style ? ` (${p.agent.style})` : ''}`, findings };
+}
+
+/**
+ * Layout instructions against the real build: fits first (sizes change the
+ * boxes, so measure again, twice for strokes and effects that don't scale),
+ * then places and stacks in one pass (moves are exact). Returns the edits.
+ */
+async function resolveLayout(ops: LayoutOp[]): Promise<string[]> {
+  const all: string[] = [];
+  for (let i = 0; i < 2; i++) {
+    const edits = fitEdits(store.get().project, boxesOf(store.get().build), ops);
+    if (!edits.length) break;
+    all.push(...edits);
+    await load(applyEdits(store.get().project, edits).project);
+  }
+  const edits = placeEdits(store.get().project, boxesOf(store.get().build), ops);
+  if (edits.length) {
+    all.push(...edits);
+    await load(applyEdits(store.get().project, edits).project);
+  }
+  return all;
+}
+
+/** Apply what --fix can: the edits, then the layout. Returns what was done, and what's left. */
+async function applyFixes(fs: Finding[]): Promise<{ done: string[]; todo: Finding[] }> {
+  const plan = fixPlan(fs, store.get().project);
+  if (plan.edits.length) await load(applyEdits(store.get().project, plan.edits).project);
+  if (plan.layout.length) await resolveLayout(plan.layout);
+  return { done: plan.done, todo: plan.todo };
+}
+
+/** check, then --fix: apply the mechanical fixes, check again, and list what's left as commands. */
+async function checkFix(o: CheckOpts & { file?: string } = {}) {
+  const first = await findings(o);
+  const { done } = await applyFixes(first.findings);
+  const after = done.length ? await findings(o) : first;
+  const todo = fixPlan(after.findings).todo;
+  const text = [
+    done.length ? `fixed ${done.length}:\n${done.map((d) => `  ✓ ${d}`).join('\n')}` : 'nothing to fix automatically',
+    report(after.title, after.findings),
+    ...(todo.length ? ['still to do:', ...todoText(todo, o.file ?? 'design.morpho').map((l) => `  ${l}`)] : []),
+  ].join('\n');
+  return { project: saved(), text, findings: plain(after.findings), fixed: done.length, moving: moves(store.get().project) };
+}
+
+/** Layout instructions on the current design (from set and add), resolved against its build. */
+async function place(ops: LayoutOp[]) {
+  const edits = await resolveLayout(ops);
+  return { project: saved(), change: `${layoutText(ops, store.get().project).join('\n')}${edits.length ? '' : '\n(already there)'}` };
+}
+
+/**
+ * A whole design from a spec (make.ts): build it, resolve its layout against
+ * the engine's boxes, apply the mechanical fixes (unless `fix` is false),
+ * check it, and draw one picture: the design at rest, or a filmstrip when it moves.
+ */
+async function make(spec: Spec, o: CheckOpts & { kit?: string; fix?: boolean; at?: (number | null)[]; file?: string } = {}) {
+  const t0 = performance.now();
+  const made = fromSpec(spec, { kit: o.kit, style: o.style as Spec['style'] });
+  await load(made.project);
+  if (made.layout.length) await resolveLayout(made.layout);
+  let r = await findings(o);
+  let done: string[] = [];
+  if (o.fix !== false && fixPlan(r.findings).done.length) {
+    done = (await applyFixes(r.findings)).done;
+    r = await findings(o);
+  }
+  const p = store.get().project;
+  const tl = timelineOf(p);
+  const spread = (n: number) => Array.from({ length: n }, (_, i) => +((i * tl.duration) / n).toFixed(3));
+  const asked = o.at as unknown as { frames?: number } | (number | null)[] | undefined;
+  const at = Array.isArray(asked) ? asked : asked?.frames ? spread(asked.frames) : moves(p) ? [null, ...[0.2, 0.5, 0.85].map((k) => +(k * tl.duration).toFixed(2))] : [null];
+  const img = await render({ at, size: at.length > 1 ? 300 : 640 });
+  const todo = fixPlan(r.findings).todo;
+  const lines = [
+    `"${p.name}" ${p.canvas.width}×${p.canvas.height}${moves(p) ? `, ${num(tl.duration)}s${tl.loop ? ' loop' : ''}` : ''}${p.agent?.kit ? `, kit ${p.agent.kit}` : ''}: ${made.notes.filter((n) => n.startsWith('added') || n.startsWith('grouped')).length} layers`,
+    ...made.notes.filter((n) => n.startsWith('motion')),
+    ...(made.layout.length ? [`layout: ${layoutText(made.layout, p).join(' · ')}`] : []),
+    boxTable(p, itemsOf(p, store.get().build)),
+    ...(done.length ? [`fixed ${done.length}:`, ...done.map((d) => `  ✓ ${d}`)] : []),
+    report(r.title, r.findings),
+    ...(todo.length ? ['still to do:', ...todoText(todo, o.file ?? 'design.morpho').map((l) => `  ${l}`)] : []),
+  ];
+  return { project: saved(), text: lines.join('\n'), findings: plain(r.findings), moving: moves(p), ...img, ms: Math.round(performance.now() - t0) };
+}
+
+/** The current design's findings, and how they differ from `before` (a previous check's findings, or a design to check). */
+async function checkDiff(before: Finding[] | null, beforeProject: unknown, o: CheckOpts & { file?: string } = {}) {
+  const after = await findings(o);
+  let was = before;
+  if (!was) {
+    const now = structuredClone(store.get().project);
+    await load(beforeProject);
+    was = (await findings(o)).findings;
+    await load(now);
+  }
+  const d = diffFindings(was, after.findings);
+  const counts = (fs: Finding[]) => `${fs.filter((f) => f.level === 'error').length} problems, ${fs.filter((f) => f.level === 'warn').length} warnings`;
+  const plan = fixPlan(after.findings);
+  const cmds = todoText(plan.todo, o.file ?? '<file>').filter((l) => l.startsWith('morpho'));
+  const text = [`check: ${counts(after.findings)} (was ${counts(was)})`, ...(d.length ? d : ['no change in the findings']), ...(plan.done.length ? [`${plan.done.length} can be fixed automatically: morpho check ${o.file ?? '<file>'} --fix`] : []), ...(cmds.length ? ['to do:', ...cmds.map((l) => `  ${l}`)] : [])];
+  return { findings: plain(after.findings), moving: moves(store.get().project), text: text.join('\n') };
 }
 
 /** The current design as a file would save it: imported fonts and pictures packed in. */
@@ -366,15 +507,6 @@ async function importImage(b64: string, name: string, target?: string) {
   return { project: saved(), change };
 }
 
-const EDGES: Record<string, { axis: 0 | 1; at: (b: Box) => number }> = {
-  left: { axis: 0, at: (b) => b[0] },
-  right: { axis: 0, at: (b) => b[2] },
-  centre: { axis: 0, at: (b) => (b[0] + b[2]) / 2 },
-  top: { axis: 1, at: (b) => b[1] },
-  bottom: { axis: 1, at: (b) => b[3] },
-  middle: { axis: 1, at: (b) => (b[1] + b[3]) / 2 },
-};
-
 /**
  * Line layers up by what they draw (not their anchors): each edge of `edges`
  * (left, right, centre, top, bottom, middle) of each target meets the same
@@ -382,27 +514,7 @@ const EDGES: Record<string, { axis: 0 | 1; at: (b: Box) => number }> = {
  */
 async function align(targets: string[], to: string, edges: string[]) {
   const p = store.get().project;
-  const { width: W, height: H } = p.canvas;
-  const boxOf = (id: string) => store.get().build?.layers.find((l) => l.id === id)?.bbox ?? null;
-  const ref = to === 'canvas' ? ([-W / 2, -H / 2, W / 2, H / 2] as Box) : boxOf(findNode(p, to).id);
-  if (!ref) throw new Error(`${to} has no outline to align to`);
-  const edits: string[] = [];
-  for (const t of targets) {
-    const n = findNode(p, t);
-    if (isGroup(n)) throw new Error(`align moves layers; ${n.name ?? n.id} is a group (align its layers)`);
-    const b = boxOf(n.id);
-    if (!b) throw new Error(`${n.name ?? n.id} has no outline to align`);
-    const move = [0, 0];
-    for (const e of edges) {
-      const E = EDGES[e === 'center' ? 'centre' : e];
-      if (!E) throw new Error(`align edges are ${Object.keys(EDGES).join(', ')}; not "${e}"`);
-      move[E.axis] = E.at(ref) - E.at(b);
-    }
-    const id = JSON.stringify('#' + n.id);
-    if (Math.abs(move[0]) > 0.01) edits.push(`${id}.x=${+(n.x + move[0]).toFixed(2)}`);
-    if (Math.abs(move[1]) > 0.01) edits.push(`${id}.y=${+(n.y + move[1]).toFixed(2)}`);
-  }
-  const { project, changes } = applyEdits(p, edits);
+  const { project, changes } = applyEdits(p, alignEdits(p, boxesOf(store.get().build), targets, to, edges));
   await load(project);
   return { project: saved(), change: changes.length ? changes.join('\n') : 'already aligned' };
 }
@@ -508,4 +620,10 @@ export const agent = {
   frameBatch,
   layout,
   align,
+  findings,
+  checkFull,
+  checkFix,
+  checkDiff,
+  place,
+  make,
 };
diff --git a/ui/src/agent/place.ts b/ui/src/agent/place.ts
new file mode 100644
index 0000000..d3d912f
--- /dev/null
+++ b/ui/src/agent/place.ts
@@ -0,0 +1,375 @@
+// Layout in words instead of pixel maths: fit a layer to a share of the
+// canvas, put it at a spot (top, centre, the thirds, the corners) with a
+// margin, stack or row several with a gap, centre by what's drawn. Every
+// instruction is resolved against the engine's real build boxes, measure then
+// place: fits change sizes (so they need a rebuild before anything is
+// placed), and moves are exact, so places and stacks run in one pass.
+//
+// Everything here is pure: it takes the project and its boxes and returns
+// assignments for edit.ts.
+import type { Box } from '../engine/types';
+import { isGroup, type Node, type Project, type ShapeLayer } from '../state/model';
+import { EditError, findNode } from './find';
+
+/** One layer (or group): fit it, place it, centre it, keep it inside the margins. */
+export interface Placement {
+  target: string;
+  /** Long side of the fit, as % of the canvas width / height (both: it fits inside both). */
+  fitWidth?: number;
+  fitHeight?: number;
+  /** top, centre, bottom, top third, bottom third, left, right, top left, top right, bottom left, bottom right. */
+  place?: string;
+  /** From the edge, px, or "6%" of the canvas's short side. */
+  margin?: number | string;
+  /** Centre by ink: x, y or both. */
+  centre?: 'x' | 'y' | 'both';
+  /** Shrink it if it's bigger than the canvas inside the margins, then move it inside them. */
+  contain?: boolean;
+  /** px, after placing. */
+  offset?: [number, number];
+}
+
+/** Layers one under another (stack) or side by side (row), first listed first. */
+export interface Stack {
+  stack?: string[];
+  row?: string[];
+  gap?: number;
+  /** Across the stack: start (left / top), centre or end. */
+  align?: 'start' | 'centre' | 'end' | 'left' | 'right' | 'top' | 'bottom' | 'center' | 'middle';
+  place?: string;
+  margin?: number | string;
+  offset?: [number, number];
+}
+
+export type LayoutOp = Placement | Stack;
+
+export const isStack = (o: LayoutOp): o is Stack => 'stack' in o || 'row' in o;
+
+type X = 'left' | 'centre' | 'right' | null;
+type Y = 'top' | 'centre' | 'bottom' | 'top third' | 'bottom third' | null;
+
+const SPOT_WORDS = 'top, centre, bottom, top third, bottom third, left, right, top left, top right, bottom left, bottom right';
+
+/** A spot's two halves. One word means centred on the other axis ("top" is top centre). */
+export function spot(s: string): { x: X; y: Y } {
+  const w = s.toLowerCase().replace(/center|middle/g, 'centre').replace(/upper/g, 'top').replace(/lower/g, 'bottom').replace(/[-_]/g, ' ').replace(/\s+/g, ' ').trim();
+  const table: Record<string, { x: X; y: Y }> = {
+    centre: { x: 'centre', y: 'centre' },
+    top: { x: 'centre', y: 'top' },
+    bottom: { x: 'centre', y: 'bottom' },
+    left: { x: 'left', y: 'centre' },
+    right: { x: 'right', y: 'centre' },
+    'top third': { x: 'centre', y: 'top third' },
+    'bottom third': { x: 'centre', y: 'bottom third' },
+  };
+  if (table[w]) return table[w];
+  const [a, b] = w.split(' ');
+  const ys: Record<string, Y> = { top: 'top', bottom: 'bottom', centre: 'centre' };
+  const xs: Record<string, X> = { left: 'left', right: 'right', centre: 'centre' };
+  if (a in ys && b in xs) return { x: xs[b], y: ys[a] };
+  if (a in xs && b in ys) return { x: xs[a], y: ys[b] };
+  const third = /^(top|bottom) third (left|right)$/.exec(w);
+  if (third) return { x: xs[third[2]], y: `${third[1]} third` as Y };
+  throw new EditError(`No spot "${s}". Spots: ${SPOT_WORDS}`);
+}
+
+export const defaultMargin = (p: Project) => Math.round(Math.min(p.canvas.width, p.canvas.height) * 0.06);
+
+export function marginOf(p: Project, m: number | string | undefined): number {
+  if (m === undefined) return defaultMargin(p);
+  if (typeof m === 'number') return m;
+  const pc = /^\s*(-?[\d.]+)\s*%\s*$/.exec(m);
+  if (pc) return (Math.min(p.canvas.width, p.canvas.height) * Number(pc[1])) / 100;
+  if (Number.isFinite(Number(m))) return Number(m);
+  throw new EditError(`margin is px or a % of the canvas ("6%"), got "${m}"`);
+}
+
+/** Where a w×h box goes for a spot: its left and top. null keeps that axis. */
+function spotAt(p: Project, s: { x: X; y: Y }, w: number, h: number, m: number): [number | null, number | null] {
+  const { width: W, height: H } = p.canvas;
+  const x = s.x === 'left' ? -W / 2 + m : s.x === 'right' ? W / 2 - m - w : s.x === 'centre' ? -w / 2 : null;
+  const y = s.y === 'top' ? -H / 2 + m : s.y === 'bottom' ? H / 2 - m - h : s.y === 'centre' ? -h / 2 : s.y === 'top third' ? -H / 6 - h / 2 : s.y === 'bottom third' ? H / 6 - h / 2 : null;
+  return [x, y];
+}
+
+export type Boxes = Map<string, Box | null>;
+
+/** Boxes by id from a build: leaves, and merged groups as one. */
+export const boxesOf = (build: { layers?: { id: string; bbox: Box | null }[]; renders?: { id: string; bbox: Box | null }[] } | null): Boxes => new Map([...(build?.layers ?? []), ...(build?.renders ?? [])].map((l) => [l.id, l.bbox]));
+
+const union = (bs: Box[]): Box | null => (bs.length ? bs.reduce<Box>((u, b) => [Math.min(u[0], b[0]), Math.min(u[1], b[1]), Math.max(u[2], b[2]), Math.max(u[3], b[3])], [Infinity, Infinity, -Infinity, -Infinity]) : null);
+
+/** What a node draws, as one box: its own, or its visible children's together. */
+export function nodeBox(n: Node, boxes: Boxes): Box | null {
+  if (!n.visible) return null;
+  if (isGroup(n)) return (n.merge ? boxes.get(n.id) : null) ?? union(n.children.map((c) => nodeBox(c, boxes)).filter((b): b is Box => !!b));
+  if (n.guide) return null;
+  return boxes.get(n.id) ?? null;
+}
+
+/** The layers that actually move when a node moves (a group has no position of its own). */
+function leaves(n: Node, out: ShapeLayer[] = []): ShapeLayer[] {
+  if (isGroup(n)) n.children.forEach((c) => leaves(c, out));
+  else out.push(n);
+  return out;
+}
+
+const r2 = (v: number) => +v.toFixed(2);
+const ref = (n: Node) => JSON.stringify('#' + n.id);
+
+/** Assignments that move a node by dx, dy, and the boxes moved to match (so later steps see them). */
+function moveBy(n: Node, dx: number, dy: number, boxes: Boxes, out: string[]) {
+  if (Math.abs(dx) < 0.01 && Math.abs(dy) < 0.01) return;
+  for (const l of leaves(n)) {
+    if (Math.abs(dx) >= 0.01) out.push(`${ref(l)}.x=${r2(l.x + dx)}`);
+    if (Math.abs(dy) >= 0.01) out.push(`${ref(l)}.y=${r2(l.y + dy)}`);
+    l.x += dx;
+    l.y += dy;
+  }
+  const shift = (m: Node) => {
+    const b = boxes.get(m.id);
+    if (b) boxes.set(m.id, [b[0] + dx, b[1] + dy, b[2] + dx, b[3] + dy]);
+    if (isGroup(m)) m.children.forEach(shift);
+  };
+  shift(n);
+}
+
+/** Size a node by k about the centre of its box (which stays put): text, shapes and lines by their size, positions in a group spread with it. */
+function scaleBy(n: Node, k: number, c: [number, number], out: string[]) {
+  for (const l of leaves(n)) {
+    out.push(`${ref(l)}.content.size=${r2((l.content as { size: number }).size * k)}`);
+    const x = c[0] + (l.x - c[0]) * k, y = c[1] + (l.y - c[1]) * k;
+    if (Math.abs(x - l.x) >= 0.01) out.push(`${ref(l)}.x=${r2(x)}`);
+    if (Math.abs(y - l.y) >= 0.01) out.push(`${ref(l)}.y=${r2(y)}`);
+  }
+}
+
+const sizeable = (n: Node) => leaves(n).every((l) => 'size' in l.content);
+
+/**
+ * Pass one: sizes. Fit to a share of the canvas, and contain (shrink only when
+ * it's bigger than the canvas inside its margins). Needs a rebuild after.
+ */
+export function fitEdits(p0: Project, boxes: Boxes, ops: LayoutOp[]): string[] {
+  const p = structuredClone(p0);
+  const out: string[] = [];
+  const { width: W, height: H } = p.canvas;
+  for (const o of ops) {
+    if (isStack(o) || (o.fitWidth === undefined && o.fitHeight === undefined && !o.contain)) continue;
+    const n = findNode(p, o.target);
+    const b = nodeBox(n, boxes);
+    if (!b) throw new EditError(`${n.name ?? n.id} has no outline to fit`);
+    if (!sizeable(n)) throw new EditError(`${n.name ?? n.id} can't be sized (strokes have no size)`);
+    const w = b[2] - b[0], h = b[3] - b[1];
+    const ks: number[] = [];
+    if (o.fitWidth !== undefined) ks.push((W * o.fitWidth) / 100 / Math.max(1e-6, w));
+    if (o.fitHeight !== undefined) ks.push((H * o.fitHeight) / 100 / Math.max(1e-6, h));
+    if (o.contain) {
+      const m = marginOf(p, o.margin);
+      ks.push(Math.min(1, (W - 2 * m) / Math.max(1e-6, w), (H - 2 * m) / Math.max(1e-6, h)));
+    }
+    const k = Math.min(...ks);
+    if (Math.abs(k - 1) > 0.002) scaleBy(n, k, [(b[0] + b[2]) / 2, (b[1] + b[3]) / 2], out);
+  }
+  return out;
+}
+
+/** Pass two: positions. Places, centring, containing and stacks, in the order given. */
+export function placeEdits(p0: Project, boxes0: Boxes, ops: LayoutOp[]): string[] {
+  const p = structuredClone(p0);
+  const boxes: Boxes = new Map(boxes0);
+  const out: string[] = [];
+  const { width: W, height: H } = p.canvas;
+  for (const o of ops) {
+    if (isStack(o)) {
+      stackOne(p, boxes, o, out);
+      continue;
+    }
+    const n = findNode(p, o.target);
+    const box = () => {
+      const b = nodeBox(n, boxes);
+      if (!b) throw new EditError(`${n.name ?? n.id} has no outline to place`);
+      return b;
+    };
+    const m = marginOf(p, o.margin);
+    if (o.place) {
+      const b = box();
+      const [x, y] = spotAt(p, spot(o.place), b[2] - b[0], b[3] - b[1], m);
+      moveBy(n, x === null ? 0 : x - b[0], y === null ? 0 : y - b[1], boxes, out);
+    }
+    if (o.centre) {
+      const b = box();
+      moveBy(n, o.centre === 'y' ? 0 : -(b[0] + b[2]) / 2, o.centre === 'x' ? 0 : -(b[1] + b[3]) / 2, boxes, out);
+    }
+    if (o.contain) {
+      const b = box();
+      const dx = b[0] < -W / 2 + m ? -W / 2 + m - b[0] : b[2] > W / 2 - m ? W / 2 - m - b[2] : 0;
+      const dy = b[1] < -H / 2 + m ? -H / 2 + m - b[1] : b[3] > H / 2 - m ? H / 2 - m - b[3] : 0;
+      moveBy(n, dx, dy, boxes, out);
+    }
+    if (o.offset) moveBy(n, o.offset[0], o.offset[1], boxes, out);
+  }
+  return out;
+}
+
+function stackOne(p: Project, boxes: Boxes, o: Stack, out: string[]) {
+  const row = !!o.row;
+  const names = (row ? o.row : o.stack) ?? [];
+  if (names.length < 2) throw new EditError(`a ${row ? 'row' : 'stack'} needs two layers or more`);
+  const nodes = names.map((t) => findNode(p, t));
+  const bs = nodes.map((n) => {
+    const b = nodeBox(n, boxes);
+    if (!b) throw new EditError(`${n.name ?? n.id} has no outline to stack`);
+    return b;
+  });
+  const gap = o.gap ?? Math.round(Math.min(p.canvas.width, p.canvas.height) * 0.03);
+  const al = o.align === 'left' || o.align === 'top' || o.align === 'start' ? 'start' : o.align === 'right' || o.align === 'bottom' || o.align === 'end' ? 'end' : 'centre';
+  // Main axis 1 (y) for a stack, 0 (x) for a row; the cross axis is the other.
+  const [ma, ca] = row ? [0, 1] : [1, 0];
+  const len = (b: Box) => b[ma + 2] - b[ma];
+  const wide = (b: Box) => b[ca + 2] - b[ca];
+  const total = bs.reduce((s, b) => s + len(b), 0) + gap * (bs.length - 1);
+  const across = Math.max(...bs.map(wide));
+  const u = union(bs)!;
+  // Where the block goes: its spot, or where its members are now.
+  let start = (u[ma] + u[ma + 2]) / 2 - total / 2;
+  let cross = (u[ca] + u[ca + 2]) / 2 - across / 2;
+  if (o.place) {
+    const [x, y] = spotAt(p, spot(o.place), row ? total : across, row ? across : total, marginOf(p, o.margin));
+    const [m, c] = row ? [x, y] : [y, x];
+    if (m !== null) start = m;
+    if (c !== null) cross = c;
+  }
+  let at = start;
+  nodes.forEach((n, i) => {
+    const b = bs[i];
+    const want = al === 'start' ? cross : al === 'end' ? cross + across - wide(b) : cross + (across - wide(b)) / 2;
+    const d = [0, 0];
+    d[ma] = at - b[ma];
+    d[ca] = want - b[ca];
+    if (o.offset) {
+      d[0] += o.offset[0];
+      d[1] += o.offset[1];
+    }
+    moveBy(n, d[0], d[1], boxes, out);
+    at += len(b) + gap;
+  });
+}
+
+/** Line layers up by their boxes: each edge of each target meets the same edge of `to` (the canvas or a layer). */
+export function alignEdits(p0: Project, boxes: Boxes, targets: string[], to: string, edges: string[]): string[] {
+  const p = structuredClone(p0);
+  const { width: W, height: H } = p.canvas;
+  const EDGES: Record<string, { axis: 0 | 1; at: (b: Box) => number }> = {
+    left: { axis: 0, at: (b) => b[0] },
+    right: { axis: 0, at: (b) => b[2] },
+    centre: { axis: 0, at: (b) => (b[0] + b[2]) / 2 },
+    top: { axis: 1, at: (b) => b[1] },
+    bottom: { axis: 1, at: (b) => b[3] },
+    middle: { axis: 1, at: (b) => (b[1] + b[3]) / 2 },
+  };
+  const target = to === 'canvas' ? ([-W / 2, -H / 2, W / 2, H / 2] as Box) : nodeBox(findNode(p, to), boxes);
+  if (!target) throw new EditError(`${to} has no outline to align to`);
+  const out: string[] = [];
+  for (const t of targets) {
+    const n = findNode(p, t);
+    const b = nodeBox(n, boxes);
+    if (!b) throw new EditError(`${n.name ?? n.id} has no outline to align`);
+    const move = [0, 0];
+    for (const e of edges) {
+      const E = EDGES[e === 'center' ? 'centre' : e];
+      if (!E) throw new EditError(`align edges are ${Object.keys(EDGES).join(', ')}; not "${e}"`);
+      move[E.axis] = E.at(target) - E.at(b);
+    }
+    moveBy(n, move[0], move[1], boxes, out);
+  }
+  return out;
+}
+
+const LAYOUT_KEYS = new Set(['place', 'margin', 'fitWidth', 'fitHeight', 'fit', 'centre', 'center', 'contain', 'offset']);
+
+/**
+ * Layout written as assignments (`Title.place=top third`, `Title.fitWidth=80`,
+ * `Info.margin=64`), taken out of a list of edits: one placement per layer,
+ * and the edits that are left.
+ */
+export function layoutFromAssignments(assignments: string[]): { ops: Placement[]; rest: string[] } {
+  const by = new Map<string, Placement>();
+  const rest: string[] = [];
+  for (const a of assignments) {
+    const m = /^("[^"]+"|[^.=]+)\.([A-Za-z]+)=(.*)$/s.exec(a.trim());
+    if (!m || !LAYOUT_KEYS.has(m[2])) {
+      rest.push(a);
+      continue;
+    }
+    const target = m[1].replace(/^"|"$/g, '');
+    const o = by.get(target) ?? { target };
+    by.set(target, o);
+    setLayout(o, m[2], parse(m[3]));
+  }
+  return { ops: [...by.values()], rest };
+}
+
+const parse = (s: string): unknown => {
+  try {
+    return JSON.parse(s);
+  } catch {
+    return s.trim();
+  }
+};
+
+/** One layout key on a placement, checked. */
+export function setLayout(o: Placement, key: string, v: unknown) {
+  const number = (what: string) => {
+    const n = typeof v === 'string' ? Number(v.replace(/%$/, '')) : v;
+    if (typeof n !== 'number' || !Number.isFinite(n) || n <= 0) throw new EditError(`${what} is a % of the canvas, like 80; got ${JSON.stringify(v)}`);
+    return n;
+  };
+  if (key === 'place') {
+    if (typeof v !== 'string') throw new EditError(`place is a spot: ${SPOT_WORDS}`);
+    spot(v);
+    o.place = v;
+  } else if (key === 'margin') o.margin = v as number | string;
+  else if (key === 'fitWidth') o.fitWidth = number('fitWidth');
+  else if (key === 'fitHeight') o.fitHeight = number('fitHeight');
+  else if (key === 'fit') {
+    // fit="width 80%" | "height 30%" | 80 (width)
+    const s = String(v).trim();
+    const w = /^(width|w|height|h)?\s*([\d.]+)\s*%?$/i.exec(s);
+    if (!w) throw new EditError(`fit is "width 80%" or "height 30%", got ${JSON.stringify(v)}`);
+    if (w[1] && /^h/i.test(w[1])) o.fitHeight = Number(w[2]);
+    else o.fitWidth = Number(w[2]);
+  } else if (key === 'centre' || key === 'center') {
+    const c = v === true ? 'both' : v === 'centre' || v === 'center' ? 'both' : v;
+    if (c !== 'x' && c !== 'y' && c !== 'both') throw new EditError('centre is x, y or both (true)');
+    o.centre = c;
+  } else if (key === 'contain') o.contain = v !== false;
+  else if (key === 'offset') {
+    const xy = Array.isArray(v) ? v : String(v).split(',').map(Number);
+    if (xy.length !== 2 || !xy.every((x) => Number.isFinite(Number(x)))) throw new EditError(`offset is x,y in px, got ${JSON.stringify(v)}`);
+    o.offset = [Number(xy[0]), Number(xy[1])];
+  }
+}
+
+/** A short line for each instruction, for the CLI to show what it did. */
+export function layoutText(ops: LayoutOp[], p?: Project): string[] {
+  const name = (t: string) => {
+    try {
+      return p ? (findNode(p, t).name ?? t) : t;
+    } catch {
+      return t;
+    }
+  };
+  // Fits and places of one layer on one line.
+  const merged: LayoutOp[] = [];
+  for (const o of ops) {
+    const same = !isStack(o) && merged.find((m): m is Placement => !isStack(m) && m.target === o.target);
+    if (same) Object.assign(same, Object.fromEntries(Object.entries(o).filter(([, v]) => v !== undefined)));
+    else merged.push({ ...o });
+  }
+  return merged.map((o) => {
+    if (isStack(o)) return `${o.row ? 'row' : 'stack'} ${(o.row ?? o.stack ?? []).map(name).join(', ')}${o.gap !== undefined ? ` gap ${o.gap}` : ''}${o.place ? ` at ${o.place}` : ''}`;
+    const bits = [o.fitWidth !== undefined && `fit ${o.fitWidth}% wide`, o.fitHeight !== undefined && `fit ${o.fitHeight}% tall`, o.place && `at ${o.place}${o.margin !== undefined ? ` (margin ${o.margin})` : ''}`, o.centre && `centred by ink (${o.centre})`, o.contain && 'kept inside the margins', o.offset && `nudged ${o.offset.join(',')}`].filter(Boolean);
+    return `${name(o.target)}: ${bits.join(', ')}`;
+  });
+}
diff --git a/ui/src/state/model.ts b/ui/src/state/model.ts
index eacf21c..1558891 100644
--- a/ui/src/state/model.ts
+++ b/ui/src/state/model.ts
@@ -224,6 +224,8 @@ export interface Project {
   type?: TypeProject;
   /** Length and looping of the scene clock (animated materials and motion). */
   timeline?: Timeline;
+  /** What the morpho CLI keeps with a design: its style kit, and what kind of design it is (abstract turns style rules into notes). */
+  agent?: { kit?: string; style?: 'poster' | 'logo' | 'abstract' };
 }
 
 let counter = 0;