diff --git a/CHANGELOG.md b/CHANGELOG.md
index f5ee71c0..9c5ba88d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,131 @@
      per release, newest first. HTML comments like this one are stripped before
      rendering, so maintainer notes stay out of the user-facing window. -->
 
+## 1.17.0 — Games that look finished 🎨
+
+### 🖐️ Dragging, clicking and selecting that do what you meant
+
+- 🖐️ **Dragging in games no longer throws on Quest.** Every press in play logged a
+  `setPointerCapture` InvalidStateError (about a hundred in one Untangle session) and leaving play
+  could end in "Something went wrong": the editor's orbit controls stayed mounted in play and
+  captured the pointer under a pointer lock. They stand down while you play now, and the capture
+  is guarded.
+- 🔀 **Edit and Interact.** A new cell at the end of the bottom bar (or the **I** key) switches
+  the editor between Edit — every click selects, so every object can be moved — and Interact,
+  where clicks and drags work the way they do in play (piano keys play, crates carry) without
+  starting the game. Module click handlers say which modes they run in; by default a game piece
+  answers in Interact and Play and an Edit click selects it.
+- 👻 **Click through glass.** A see-through wall or a shell marked "Click-through in the viewport"
+  (Inspector ▸ Object) no longer steals the click from what is behind it, and clicking the same
+  spot again (after the double-click window) cycles down through everything under the cursor.
+- 🧩 **Every module's content is in the object list.** A new "Module content" section lists the
+  pieces a module builds outside the scene (the Untangle board, a piano, a dungeon) by name;
+  click a row to frame it, hide it locally, or open the module's toolbox.
+
+### 🎮 Games start when you press Start
+
+- ▶️ **Test play.** A game no longer paints its menu over the editor with live buttons. A small
+  "Game · menu" chip says the scene is a game, and ▶ Test play resets it to its menu, enters
+  Play and puts the Start screen in front of you (also on the play button's right-click menu).
+  The HUD editor's eye still previews the screens, inert.
+- 🔁 **The round resets when the last player leaves.** Alone, leaving Play returns the game to its
+  menu at once; with others, when the last player has been out for ten seconds.
+- 🖱️ **Free-cursor games.** A scene can play with the real mouse cursor and no pointer lock
+  (Untangle and the Jam Room do): the cursor aims, clicks fire On Click, press-drag carries. The
+  editor grid no longer shows in Play.
+- 💾 **Games remember things.** `api.storage` for modules and the new **Store Value** / **Stored
+  Value** nodes keep a best score or your unlocked levels on this device (never shared, never
+  saved into the scene). The HUD action "Save best score" wires one up.
+- 🔇 **A quieter console.** The PCFSoftShadowMap deprecation, the router pushState warning and
+  rapier's init warning are gone.
+
+### 🎨 Seven games that look finished
+
+- 🏗️ **Towers remembers your best height** — and looks finished: a sky, a tiled floor, wooden
+  crates, glowing height rings, turning stars; Round over shows this round and your best.
+- 🌌 **Stars Room is a space room** — a starfield behind glass, crystal stars, a start screen
+  with Start round or Free play, a two-minute round, your best round saved.
+- 🎸 **Jam Room is a game** — a small studio; press Start, then ▶ on the Transport, and keep the
+  band going for eight bars. Played with the mouse, your best tempo saved.
+- 🏟️ **Football** is a floodlit glass stadium with a live scoreboard.
+- 🏰 **Dungeon Realms** is torch-lit stone under a vault, with glowing gems, animated portals and
+  a Start menu you can click.
+- 🌅 **Waves** is a sunset arena with a crystal tower that dims with your health, portals,
+  readable enemies and hit flashes.
+- 🪢 **Untangle, finished:** a real drag (press-drag-release, or click then click), a redrawn
+  board, 30 levels per mode that unlock as you solve them (your progress stays on this device,
+  with a Reset), and a new 3D mode — untangle the graph around a globe.
+- Every game has a Start screen, Pause on **P**, and a restart.
+
+### 🥽 Games in a headset
+
+- 🎮 **Play in VR puts you in Interact.** A game opens in Interact in a headset: your grips grab
+  and knock things instead of the world, the stick WALKS you (walls stop you, gravity holds you,
+  small steps climb), and there is no flying or teleporting unless the scene allows it. The left
+  **Y** button switches to Edit and back (a tick in your hand and a small wrist label say which),
+  and the game can put you on its start spot. In Edit, grips move and scale the world again —
+  in game scenes too.
+- 👁️ **No more light helper in one eye.** Editor helpers drew into the left eye only in a
+  headset. Now they are in both eyes in Edit and gone in Interact and Play — together with the
+  grid, collider wireframes and selection outlines.
+- 📋 **The game menu in VR.** A game's menu, pause and results screens float in front of you and
+  answer your laser and trigger (or a poke); the score and timer sit on your left wrist and,
+  if you like, in a strip at the top of your view.
+- 🎹 **Hold the trigger and sweep.** Hold the trigger and brush across piano keys, drum steps,
+  pads or buttons — each one you pass fires once.
+- 🌍 **Module content follows the world.** Grab and turn the world and the Untangle board (and
+  every module's content) turns with it.
+
+### 🔊 Games that sound and feel like games
+
+- 🔔 20 built-in game sounds, 7 music loops (quiet under the sound effects, only while you
+  play), a big centred banner for moments like "GOAL!" or "Floor 3", sparkle / confetti / smoke /
+  spark bursts, and controller vibration patterns (in Interact and Play only). Settings ▸ Sound
+  has a "Game sounds" and a "Music" volume.
+- 🧩 New Game nodes: **Announce**, **Game Sound**, **Effect Burst**, **Controller Buzz**,
+  **Game Music** and the **On Grab** trigger.
+- 🏗️ **Towers** tells you when your tower reaches each ring (a banner, sparkles at the ring,
+  a chime), and the gold ring at the top is a fanfare with confetti. **Stars Room** sparkles where
+  you hit a star and pays a coin when it lights. **The Jam Room is a VR cockpit**: stand in the
+  middle and every instrument is in reach; a sweep also stomps the pedals and flips the mixer
+  mutes (Music FX 0.2.0).
+- ⚽ **Football plays like football**: your first touch kicks a match off, 3-2-1, GOAL! with
+  confetti and a crowd, the conceding team kicks off, first to 5 or 3:00 with a golden goal;
+  swing a controller through the ball to kick it; the consoles stand outside the court.
+- 🏰 **Dungeon Realms is lit everywhere**, with real wall torches, footsteps, gem chimes, a
+  "Floor N" banner and dungeon music; you can no longer walk through pillars, crates or chests.
+- 🔫 **Waves is a VR shooter**: a gun in your hand (Blaster, Scatter, Beam), an ability on your
+  grip (Shield, Slow-mo, Pulse), five levels of rigged grunts, runners and tanks walking at the
+  crystal, a menu with How to play / Loadout / Options, and a Start board you shoot in a headset.
+- 🪢 **Untangle** drags with a controller's trigger (laser or tip), lets you hold and turn the
+  globe in one hand, and lost its drone: one sound per event and a quiet puzzle loop.
+
+### 🧱 Kits and levels
+
+- 🧱 Four new packs in Explorer ▸ Packs — **Modular Architecture**, **Nature & Terrain**,
+  **Props & Interiors** and **Sci-fi & Modern** — over 120 pieces that snap to the 1 m grid (CC0,
+  made with Meshy.ai).
+- 🗺️ Three walkable example levels in Templates ▸ General: **Castle Courtyard**, **Forest
+  Clearing** and **Tavern Interior**. Kit pieces are saved as references to their pack, so a
+  level of 150 pieces is about 25 KB. Configure Scene ▸ Physics ▸ Play mode ▸ Spawn point.
+- ↩️ Placing a kit piece is undoable (it was "too large for undo history").
+- 🛠️ **Fixed:** moves made with the gizmo, Align to ground or an Explorer drop were refused by
+  peers (a rotation sent with its order letters); loading a scene while the simulation runs no
+  longer leaves the old physics world behind.
+
+### 🧰 For authors
+
+- 🧱 **Game and template defs can say more:** rounded boxes, capsules, rings, planes,
+  ico/dodecahedra; spot, directional (shadows fitted to the scene) and hemisphere lights; glass,
+  clearcoat, sheen and toon materials; animation and particle presets by name; click-through
+  shells; custom skies with a gradient, fog and a solid ground. Games-tab cards are rendered with
+  each game's own lighting.
+- 🔤 **Centred HUD text is centred.** A single-line HUD text sat flush left inside its box
+  whatever its alignment said.
+- 🧩 SDK: `registerClickHandler(fn, {modes})`, `api.registerListedGroup(name, {label})`,
+  `api.storage`, `api.editorMode()`, and `api.pointerRay()` is the crosshair ray under a pointer lock and the
+  cursor's ray in a free-cursor game.
+
 ## 1.16.0 — Waves, and one world to keep 🌊
 
 ### 🎮 A new game, and a Games tab that can move again
diff --git a/CLAUDE.md b/CLAUDE.md
index 9de987e5..c3d92adf 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -2156,6 +2156,153 @@ loadable play content. Everything a user does must be visible to connected peers
   `#embed-play` (▶ while not playing, so an Esc inside the frame has a way back in). Absent = the
   old app. The community Worker's `/e/<id>` frames the app at `/?s=<id>&play=1&embed=1`; no
   separate viewer build. Suite `embed-boot` (20).
+- **ROADMAP 30 — EDIT / INTERACT, AND THE SELECTION THAT FINDS THINGS** (1.17.0; plan + as-built:
+  cloud `plans/core/roadmap-30-games-that-look-finished.md`). `sceneStore.editorMode`
+  ('edit' | 'interact', LOCAL — never replicated, never saved) + `objectActions.setEditorMode`; the
+  toggle is the `mode` cell at the RIGHT END of the default Controls bar (`#editor-mode-toggle`, a
+  `<button aria-pressed>` — loadLayout's own append rule for a default added later, which keeps the
+  play well's slot) and key **I** through the registry, which stands down in text fields, mesh
+  sessions and any session a module reports through the new `shortcuts.registerKeySessionProbe`
+  seam (sculpt/spline/draw use it). Edit always SELECTS. Interact is play's hands without play's
+  lock: `playInteract.editorInteractActive`/`cursorGrabStart`/`cursorGrabMove`/`cursorGrabEnd`
+  (a press on a dynamic body of a RUNNING sim carries it along the CURSOR ray with the exact hold
+  play uses — `grab.cursor` picks the cursor ray, otherwise the play aim) and `interactClick(ray)`
+  (module groups → the first opaque hit offered to 'interact' handlers → its On Click → the miss;
+  selects nothing, ever). `moduleSDK.runClickHandlers(object, mode)` is the ONE dispatch and
+  `registerClickHandler(fn, {modes})` defaults to `['interact','play']` — a game piece no longer
+  eats editor clicks; an editor TOOL passes `{modes:['edit']}`. VR's trigger has NO editor mode
+  (modules DEVX #33): it still offers every handler first.
+  · **THE POINTER-CAPTURE THROW (P0)**: three 0.185's OrbitControls calls `setPointerCapture`
+  unguarded, and the editor controls stayed MOUNTED in play — under a pointer lock that throws an
+  InvalidStateError per press (~100 in one Quest session, then "Something went wrong" on exit).
+  The editor OrbitControls stand down per frame while `isLocked === true` (restored after) and the
+  capture is guarded on the controls' element while a pointer lock exists. Suite
+  `pointer-capture-play`.
+  · **SELECT-THROUGH** (`selectThrough.js`, a pure LEAF, vitest): `pickStack(hits, topLevelOf)`
+  + `primaryIndex` — the pick prefers the first OPAQUE top-level target; see-through =
+  `userData.pick === 'through'`, effective opacity < 0.25, or a hidden node. A plain repeat at
+  ±4 px cycles DOWN the stack and wraps — only AFTER the 400 ms double-click window and within
+  1500 ms (inside 400 ms is the configurable double-click action; a cycle there would kill
+  open-properties wherever anything sits behind the cursor — QUESTIONS-30-core-modes fork 1). A
+  one-time "Click again to select behind" hint. Inspector ▸ Object "Click-through in the
+  viewport" (`#inspector-pick-through`) → `objectActions.setPickThrough` (props undo +
+  `objectParameters` 'pick', received in commandsHandler). Interact's click uses the same stack.
+  · **MODULE CONTENT IN THE OBJECT LIST** (`moduleContent.js`, a LEAF + `ModuleContent.svelte`
+  under the scene tree): one read-only row per module scene-root group (registered through
+  `registerInteractiveGroup`/`registerSystemGroup`, humanised — 'untangle-module' → 'Untangle
+  module' — or named by `api.registerListedGroup(name, {label, icon})`), children to depth 2
+  capped at 200 + "+N more", a LOCAL hide eye, a menu (Frame it / Open <toolbox> / Hide in
+  viewport) and an Inspector card (`#module-content-card`). Clicking selects a PROXY — a
+  scene-root `Box3Helper` on the helper layer, never in objectsGroup (golden rule 5 holds). An
+  EDIT viewport click on module content selects its proxy too.
+  · `api.pointerRay()` (P4): the CROSSHAIR ray while `isLocked === true`, a pointer lock is held
+  and not in the menu substate; the mouse ray otherwise — including a free-cursor game, decided by
+  `playCursor.playCursorSetting()` (the 30 integrate wired the two lanes' seam to the one leaf).
+  `api.editorMode()` is the module-side read of the store (DEVX #35, integrate).
+- **ROADMAP 30 — GAMES START ON START** (1.17.0). `hudDocs.isGameHud(docs)` / `hudIsGame`: a scene
+  IS a game when any HUD doc holds a screen with `showWhile` set (a `hudbutton→setgamestate`
+  wiring alone does not count — nothing masquerades without a state-bound screen, and it keeps
+  hudDocs a leaf). Outside Play `HudLayer` hides a game's screens; the HUD editor's preview eye
+  shows them INERT and fully CLICK-THROUGH (a preview is a picture of the menu — which also ended
+  HUD menus eating editor clicks). `GameChip.svelte` (App.svelte, beside HudLayer; ids
+  `#game-chip`/`#game-chip-preview`/`#game-chip-test`) says "Game · <state>" and ▶ Test play =
+  `gamePresence.testPlay()`: reset to the menu, enter Play, the Start screen in front (also the
+  play button's right-click row "Test play (start from the menu)"). THE ABANDON WATCH widened
+  (21-F3's host-only writer): every non-menu state is a round; SOLO leaving resets immediately;
+  with peers the 10 s window stands; ticks are edge-driven; leaving a game clears this peer's
+  screen overrides.
+  · **FREE-CURSOR GAMES** (`playCursor.js`, a LEAF: sceneStore + playSettings + canvasRect): the
+  ONE answer to "where does the player aim" — `playAimNdc()` (the cursor in free-cursor play, the
+  crosshair (0,0) otherwise), `playCursorFree()`, `cursorClient()`, `playCursorSetting()`.
+  `scenePhysics.play.cursor: 'free'` (OMITTED at the 'locked' default, so saves are
+  byte-identical), or a module publishes `userData.play.cursor = 'free'` on its scene-root group
+  (resolvePlaySettings, field by field). PLC never asks for a lock when free, PlayReticle hides,
+  playInteract aims and carries along the cursor ray and takes only VIEWPORT presses (a HUD
+  button, a toast, the ✕ are not world gestures). The editor GRID hides in Play
+  (`extensions/Grid.svelte`, mesh named `editor-grid`; `helpersInPlay` keeps it).
+  · **STORAGE** (`gameStorage.js`, a LEAF on safeStorage, vitest): `api.storage` get/set/remove/
+  keys/clear/bytes — JSON, key `tp:mod:<moduleId>:<key>`, 256 KB per module, LOCAL (never
+  replicated, never saved into a scene, survives disable/remove — `clear()` is the reset). Flow
+  nodes **Store Value** (op set/max/min/add on its trigger's stamp edge) and **Stored Value**
+  read `tp:scene:<scene name or 'untitled'>:<key>` — a Games-tab load leaves the scene unnamed,
+  so every template uses a GAME-SPECIFIC key (`towers-best`, `stars-best`, `jam-best-bpm`) or two
+  games' bests collide. hudActions "Save best score" (an additive `via` on the press role).
+  · **CONSOLE HYGIENE**: `<Canvas shadows={PCFShadowMap}>` (PCFSoft is deprecated in three
+  0.18x); the play back-marker is a SvelteKit shallow entry (`pushState` from `$app/navigation` +
+  `playMarkerState()`); rapier-compat's own init warning is filtered for that one call (the call is
+  inside the frozen dependency — exact prefix, restored in `finally`). helpers.cjs `page.__console`
+  captures every console message from BEFORE the first navigation (suite `console-hygiene`).
+- **ROADMAP 30 — THE AUTHOR KIT** (`scripts/author-templates.cjs`; THE DEF SCHEMA is the comment
+  block at its top and is the reference). New: primitives `capsule`, `plane`, `ring`,
+  `icosahedron`/`dodecahedron`, `box.bevel`; lights `spot`/`directional` (shadow frustum FITTED
+  to the built meshes, `fit:false` opts out)/`hemisphere`; `physical`/`toon`/`flatShading`/`side`
+  materials; flags `pick:'through'`, `origin`, `anim:'<preset>'` (an AUTHORED clip — wire a Play
+  Animation node to run it), `particles:'<preset>'`; an unknown object `type` THROWS (it silently
+  became a cone). CUSTOM SKY: `env: {preset:'custom'|<base>, exposure, background:'#hex'|{top,
+  bottom}, fog, ground:{color,roughness}, sun:{color,intensity,dir}, hemi}` builds a customPreset
+  saved + replicated as the ordinary environment singleton; environment.js grew two ADDITIVE
+  customPreset fields read only through `skyGradientOf`/`skyGroundOf` (a cached gradient
+  CanvasTexture background — older peers see the bottom colour flat — and an `env-ground` disc
+  in ENV_ROOT, hidden in wireframe and passthrough; the shadow catcher stands down while it
+  shows). `--def <file.json>` iterates on a def without editing DEFS (same slug replaces).
+  THE CARD: the scene's own look (sky, fog, env rig, authored lights, shadows), the post stack's
+  tone-mapping entry else NONE (what a composed desktop frame shows — the toneMapping gotcha),
+  camera = `thumb.camera` → `view` → a projected 3/4 fit (floor slabs and camera markers
+  excluded), on the REAL GPU (helpers.cjs per-platform ANGLE; the run prints `GPU: …`). A dark
+  game gets a dark card. `HudElement.svelte`: a text/timer box takes `justify-content` from
+  `style.align`, so a single centred line is centred (modules DEVX #28).
+
+- **ROADMAP 30b — THE QUEST ROUND (games in a headset)** (1.17.0; the user's Quest 3 feedback on the
+  round-1 preview is the acceptance test: cloud `plans/core/lanes/30b/user-feedback-2026-09-23.md`).
+  C1 MODES (vr-modes): `vrGrip.js` (pure: what a grip may hold — in Edit anything >= 4 m on an axis
+  or containing your head is SCENERY and the grip grabs the WORLD, which is what brought the Edit
+  world grab back in game scenes; Interact grabs only dynamic bodies, rigid, no select, no undo,
+  never the world), `locomotionPolicy.js` (pure: `play.locomotion {teleport?, fly?}` absent =
+  false in Interact/Play, Edit always flies/teleports; `normalizeSpawn` = `{position, yaw[,
+  vrOnly]}` and ALSO reads 30c's first `{pos, yaw}`), `charController.resolveWalk` shared by desktop
+  and VR (a capsule, gravity, 0.3 m autostep; the dungeon raster also clamps the rapier tier),
+  `playSpawn.js` (`desktopSpawn`/`spawnDesktopPlayer`; VR moves the rig so the FEET land on the
+  spawn facing yaw), `onVRSessionStart` puts a GAME (a showWhile screen, a spawn, or a
+  `userData.play` publisher) in Interact and LEFT Y toggles (right B when the radial menu is on
+  the left) with a forced haptic tick + the `vr-mode-label` wrist label, `moduleWorld.js`
+  re-homes every registered module group under `module-world-root` INSIDE the world rig so module
+  content follows world grabs (a `scene.remove` shim; playPublishers + moduleContent scan it), and
+  `helperLayer.helpersHiddenFor` hides helpers in Play OR Interact (see the HELPER_LAYER gotcha).
+  Suites vr-helper-eyes, interact-clean-view, vr-grips-by-mode, vr-walk-interact, vr-mode-spawn,
+  module-world-root (+ vitest vrGrip/locomotionPolicy); `tests/e2e/fakeXR.cjs` = a fake XR
+  session driving the REAL per-frame path (install/pose/button/stick/installSpace/head).
+  · C2-C6 GAME FEEL (vr-play), one debug name `__stores.gameKit`: `gameFeel.js` (the ONE
+  Interact/Play predicate), `gameSfx.js` (20 procedural sounds on the sfx bus, 24-voice cap, an
+  unknown name is a no-op), `gameMusic.js` + `gameMusicPresets.js` (7 presets on the SESSION
+  clock, REFUSED from Edit, stopped on leaving Interact/Play), Settings ▸ Interface ▸ Sound (two
+  safeStorage volumes), `hapticPatterns.js` + vrControls.hapticPattern/hapticKnock (hapticPulse is
+  SILENT in Edit through one funnel; a 4th `force` arg is the mode tick's), `vrGameInput.js` (hover
+  tap / press bump; the one "clickable" resolver), `effectsBurst.js` (a pooled 12×96 Points system
+  at scene root, local, `warmUp` compiles the material at build or the first burst of a session
+  is lost to a shader compile), `gameAnnounce.js` + HudLayer's `#game-announce` (desktop) / a
+  head-locked banner (VR), `vrGamePanel.js` (a menu-type screen — input 'menu', an enabled
+  control, or showWhile menu|paused|over — is drawn on a canvas BOARD 1.2 m ahead with lazy yaw
+  follow; every other screen's lines ride the LEFT-WRIST card and an optional head strip,
+  `vr:gameStrip`), and the hold-and-sweep (the tip fires the NEAREST touching clickable once, the
+  laser while held; click ctx `{source, mode}`, `{sweep:false}` opts out; Scene's VR trigger
+  fallthrough in Interact/Play is `interactClick`, never a select). `gameFeelActions.js`
+  (core-games) = the Announce / Game Sound / Effect Burst / Controller Buzz / Game Music / On Grab
+  flow nodes, LOCAL on every peer from the replicated stamp inside the actionSeenAt family; music
+  is a DECLARATION. Suites game-audio, game-haptics, game-effects, vr-game-panel, vr-sweep,
+  game-feel-nodes.
+- **ROADMAP 30c — THE MESHY ASSET ROUND** (1.17.0): four packs on packs `main` (architecture-kit,
+  nature-kit, props-kit, scifi-kit; `tools/meshy` spends the credits through one ledger) and
+  `src/lib/packRefs.js` (level-design): a piece placed from a pack carries `userData.packRef =
+  {pack, item, path, hash, kids}` and a PRISTINE one (a fingerprint over the descendants' geometry,
+  materials and an 8×8 texture sample, root transform free) travels and saves as a STUB that every
+  peer and every loader REFILLS from the pack url (fetched and parsed once per piece, textures
+  shared) — one WallStone is 7.9 MB as toJSON and 555 B as a stub. The four paths: save + wire use
+  stubs, autosave GLTF keeps the full tree, and undo keeps the stub through
+  `history.registerReferenceSnapshot` (registered from `startPackRefs` by a dynamic import;
+  restore needs nothing new — the stub scan refills it). Three walkable General templates
+  (`scripts/level-templates.cjs` via author-templates' `kit` type, `seed: false`); a scene load
+  now ends a running simulation first. Suites pack-refs, pack-undo, level-templates (`LIVE=1`
+  runs it against a build's own feed + pack CDN).
 
 ## Replication golden rules
 
@@ -2251,6 +2398,75 @@ loadable play content. Everything a user does must be visible to connected peers
 
 ## Hard-won gotchas (do not rediscover)
 
+- **HELPER_LAYER MUST NEVER BE 1 OR 2: three's WebXRManager gives the LEFT eye layer 1 and the
+  RIGHT eye layer 2.** Helpers on layer 1 drew into ONE eye in a headset — the Quest report "in the
+  middle of the world I see the light source helper, and only with one eye" (Towers, Stars Room,
+  Football). It is 30 now.
+- **three's `Euler.toArray()` IS `[x, y, z, 'XYZ']`**, and 27-A's wire validator accepted a
+  rotation of 3 or 4 FINITE NUMBERS only — so every `move` from the gizmo, Align to ground, an
+  Explorer drop and a dozen other senders was refused on arrival (`invalid:move`) and the peer kept
+  the old pose. `isQuatOrEuler` takes the order string now (suite move-wire-shape).
+- **A BLANKET SHAPE RENAME HITS EVERY KEY OF THAT SHAPE.** Unifying `play.spawn {pos}` ->
+  `{position}` with a textual `{ pos: [` replace also rewrote the level defs' camera `view: {pos}`,
+  and the authoring script died in the page (`reading '0'`) — the next suite would have been the
+  first to notice. Rename by the owning key (`spawn: { pos:`), and author once after any rename.
+- **A rapier collider with no body is FIXED AND SOLID.** The character controller's capsule was
+  `world.createCollider(capsule)`, teleported with the camera each frame: it depenetrated whatever
+  it was moved into and stood as an invisible pillar where the player last was. Harmless while
+  only walk mode made one; 30b's collideRigStep made every desktop Play + sim session drive it,
+  and a crate was flung 8 m before the first knock. A query shape takes `.setSolverGroups(0)`.
+- **A THIRD SOFTWARE-GL PAGE BOOTS PAST setupPage's 30 s ON THE 1.17 UNION** (7 s on round 1,
+  first bad from the vr-play merge in a noisy bisect) while its boot programs, draw calls and boot
+  script are identical — the page waits in shader links behind two pages saturating the shared
+  SwiftShader process. Three-page suites launch on the GPU backend (`h.GPU_ARGS`; modules:
+  `E2E_GPU=1`), where all three boot in < 2 s. Root cause still owed.
+- **An ADDITIVE burst vanishes against a bright sky** — pair it with a normal-blended one
+  (Towers' ring puff). **A banner at a round's END doubles the results panel** — the panel carries
+  the words.
+- **A module effect/click on a Quest cannot rely on the DOM HUD**: core draws no DOM HUD in a
+  headset, so a Start button that only exists there left Waves' round unstarted and "the enemies
+  do not move" (30b-waves P0). vrGamePanel is core's answer; a module may still add its own board.
+- **Known, not fixed (30c pack lanes):** a nested import (a Group with children) doubles its
+  offset on peers (the receiver parents it under the import root and adds the root position again
+  per level — kits ship FLAT to stay clear), and a `move` landing while the peer still shows the
+  loading placeholder is lost.
+- **`TubeGeometry` HANDED A 2D `Shape` BUILDS EVERY VERTEX AS NaN** — its Frenet frames come
+  from Vector2 tangents. Untangle 2.1.0's amber rim never drew, and worse, the board group's
+  `Box3.setFromObject` read NaN, so the object list's "Frame it" flew the camera into NaN and the
+  audio listener threw every frame. Sweep a closed `CatmullRomCurve3` through the shape's
+  `getSpacedPoints` instead. The tell: `setFromObject` on a module group returns NaN bounds.
+- **A rAF TIMESTAMP IS THE FRAME'S START, WHICH CAN PRECEDE THE CALL THAT SCHEDULED IT.** A tween
+  computing `(now - started) / duration` gets a NEGATIVE elapsed on its first frame, and with a
+  0 ms duration that is ±Infinity/NaN (`objectActions.flyTo(…, 0)` parked the camera there for a
+  frame). Clamp t to [0, 1]; a test reproduces it deterministically by stamping the first frame
+  20 ms before the call (object-list-modules 5.0).
+- **A HUD TEXT BOX IS A FLEX ROW, SO `text-align` ALONE NEVER CENTRED A SINGLE LINE.** The
+  anonymous text item shrank to its words and sat flush left in every game menu whatever `align`
+  said; the row takes `justify-content` from the same `align` now (text/timer, 30-visuals-core,
+  guarded in game-towers). Modules laid their 1.16 menus out left-aligned to dodge it (DEVX #28).
+- **A perRound LATCH READS UN-SET THE INSTANT THE ROUND ENDS**, so a Round-over screen must read
+  STORED values (Store Value `max` + a `set` 0 on round start — `max`, because a sensor re-firing
+  after the round writes 0). The old Towers "your best tower" line always read 0 m for this.
+- **PARTICLE EMITTERS ARE COUNTED PER PAIR**: one particle node wired to 24 selectors is 24 of
+  the scene's 8. Pool ONE emitter on an anchor a Script node moves onto the object just hit (the
+  Stars Room burst).
+- **`--use-angle=gl` IS SWIFTSHADER ON LINUX.** The authoring script rendered every Games-tab card
+  in software until roadmap 30; it now uses helpers.cjs's per-platform backend and PRINTS its
+  GPU. Trust no card size or pixel number whose run did not say which GPU it was.
+- **EVERY TOP-LEVEL OBJECT IN objectsGroup BECOMES A FIXED PHYSICS BODY, and a decoration GROUP's
+  default collider is the box of all its children** — a stadium's `Arena` group was one invisible
+  wall around the pitch. Give such a group an explicit custom collider (or none).
+- **DESKTOP PLAY SPAWNS AT Scene.svelte's FIXED `<Player position={[0, 2, 3]}>`** outside a
+  dungeon, whatever the def's `view` says (modules DEVX #27) — keep that eye line clear.
+- **THE EDITOR GRID DRAWS AT y = 0**, so a floor whose top is exactly 0 z-fights it (it showed
+  through the football pitch). Put a floor's top a hair above; the custom sky's ground disc sits
+  at -0.01, under the grid. The grid is hidden in Play since 1.17.
+- **A FLAT GROUND DISC ENDS IN A BAND, NOT A HORIZON**: past the arena a solid ground reads as an
+  olive strip under a plain sky. Close the fog in past the play space (Towers: near 16, far 75)
+  so the ground fades into the sky's own haze colour.
+- **THREE LANES NUMBERING ONE LIST FROM THE SAME BASE COLLIDE.** Each modules lane appended
+  DEVX-REQUESTS rows from #26; the merge renumbered them (#26-28 visuals, #29-32 untangle,
+  #33-35 audit). A merge that auto-resolves a numbered list silently duplicates ids — read it.
 - **jsDelivr PARSES `@v2` AS A SEMVER VERSION, AND A VERSION IS NEVER RE-RESOLVED.** The scenes
   feed is `scenes@v2` and the serving ritual retags `v2`; jsDelivr's data API lists the repo as
   `versions: ["1","2"], tags: {}`, the response says `x-jsd-version-type: version`, and a
@@ -4790,6 +5006,32 @@ override for e2e — never share 5173 (the user's main-checkout server).
   locked (replicate the INDEX per-item opt-in; ONE mesh with scenes as tags;
   scene-is-primary renaming), and the vocabulary settled: **session = the mesh, room =
   who is in a scene, PocketBase rooms stay DISCOVERY** — that naming blocks R4.
+- Status (2026-09-24): **1.17.0 round 2 + 3 — THE QUEST ROUND AND THE MESHY ASSETS, integrated
+  on `feat/1.17` (lane `30b-integrate`)**, held at the user's release gate with a new preview
+  (https://preview-1-17.theprototype.pages.dev). Core merged #244 vr-modes, #245 vr-play, #246
+  core-games, #247 level-templates (the two `play.spawn` shapes unified on `{position, yaw}`) +
+  integrate fixes: move-with-order-string, kit placement undo by reference, the character capsule
+  made a query shape (it flung bodies once every desktop Play + sim drove it), game-waves rewritten
+  for Waves 2.x, game-football 6.9, vr-sweep flips mixer mutes + footswitches, check 333/47. Modules dev merged #24 untangle, #21 football, #23 waves, #25
+  waves assets, #22 dungeon + integrate: DEVX renumber (#36/#38/#39/#40), build:waves on a fresh
+  clone, music-fx 0.2.0 (footswitch + mute buttons the sweep flips), the Kit's torches are the
+  props-kit WallTorch. Packs main: the four kits + the Meshy tool. Scenes `preview-1-17`: the seven
+  games + three General levels re-authored on the union. The per-feedback table, the suite table
+  and the owed-on-device list are in the lane handover.
+- Status (2026-09-23): **1.17.0 "Games that look finished" — ROADMAP 30, integrated on `feat/1.17`
+  (lane `30-integrate`).** Merged core #240 author-kit → #241 game-flow → #239 editor-modes (one
+  conflict, `playInteract.js`: the Interact cursor carry + the play aim, both kept) → #242
+  core-games; modules #19 untangle → #18 game-visuals → #17 modes-audit into `dev` (DEVX rows
+  renumbered: three lanes each started at #26). Integrate fixes: pointerRay asks the one playCursor
+  leaf; `api.editorMode()` (untangle's Edit stand-down had nothing to read); `flyTo(…, 0)` NaN;
+  untangle's NaN rim; the author-kit Waves-card check vs the custom sky; the four game suites
+  following their games; Towers' horizon fog + clock label, Stars Room's board size, untangle's
+  "Crossings: N" and wide centred titles. svelte-check **335/47** (ratcheted from 336), vitest 222,
+  the lanes' suites + held suites + the seven game suites green on the union scenes (details in
+  the cloud master's execution log). OWED on device: the seven games' look on a real display and
+  in the Quest browser, Untangle drag with a Quest controller in 2D mode and the globe feel, the
+  Edit/Interact toggle and the I key, Test play with two real people, a best score surviving an
+  Oculus Browser restart, the Football glass cost on Quest.
 - Status (2026-09-22): **1.16.0 "Waves, and one world to keep" — ROADMAP 29 ROUND 3, the follow-up
   round closed by the integrator (lane `29f-integrate`).** Merged: core #236 + modules #14 (the
   simulate-race rule, `simAuthority.js`: a peer receiving `simulate` while simulating yields to the
@@ -6301,3 +6543,34 @@ with in its OWN group and the generator publishes no markers itself. DEVX filed
 #23 `api.teleportPlayer` (a play-mode respawn cannot move the rig; `flyTo` moves the editor
 camera) / play-mode menus as module DOM, #24 a live trigger count (`nodeValue` is ~6 Hz),
 #25 two clocks on the api.
+
+**R30 additions (1.17.0):** `api.registerClickHandler(fn, {modes})` — `modes` ⊆
+`['edit','interact','play']`, ABSENT = `['interact','play']`: a game piece is quiet in Edit (an
+Edit click selects it) and an editor TOOL passes `{modes:['edit']}`; every module in the modules
+repo declares it since 30-mod-audit. VR's trigger has no editor mode and still offers every
+handler (DEVX #33). `api.registerListedGroup(name, {label, icon?})` names a scene-root group's row
+in the object list's Module content section (groups registered as interactive/system are listed
+anyway, humanised; listing does NOT make a group pickable — register it as interactive for that,
+DEVX #34). `api.storage.get(key, fallback)` / `set(key, value) → bool` / `remove(key)` /
+`keys()` / `clear()` / `bytes()` — JSON under `tp:mod:<moduleId>:<key>`, 256 KB per module,
+LOCAL, never replicated; feature-detect it, and a 1.16 fallback writes the SAME key through
+localStorage (untangle's progress does). `api.pointerRay()` is the crosshair ray in play under a
+pointer lock and the cursor's ray in a free-cursor game; a board/puzzle/instrument module asks for
+the free cursor by publishing `userData.play.cursor = 'free'` on its scene-root group. `api.editorMode()`
+→ 'edit' | 'interact' (LOCAL, read-only; DEVX #35, added by the 30 integrate): a module whose
+own pointer listeners run outside core's click routing (untangle's window-capture drag) stands
+down while it reads 'edit' and nothing is playing, so an Edit click selects its content.
+
+**R30b additions (1.17.0, the Quest round):** `api.setSpawn([x, y, z], yaw, {teleport?})` (y = the
+FEET, yaw = three's rotation.y, a CHECKPOINT unless `teleport`; a module's overrides the scene's
+`play.spawn`) + `api.respawnPlayer()`; `api.playSound(name, pos?)` knows 20 procedural names
+(click pop whoosh success fail hit kick shoot laser explosion coin levelup goal whistle cheer step
+ring sparkle hurt portal; an unknown name is a no-op); `api.music.play(preset, {volume?})` /
+`stop()` / `current()` / `presets()` (arcade ambient dungeon stadium space puzzle studio; refused
+from Edit, stops on leaving Interact/Play); `api.hapticPattern(name, hand?)` (tap bump hit success
+fail rumble heartbeat; every haptic is silent in Edit); `api.effects.burst([x, y, z], {kind?,
+color?, count?})` (sparkle confetti smoke sparks, LOCAL); `api.announce(text, {sub?, ms?,
+color?})`; click handlers get `{source: 'click' | 'sweep', mode}` and
+`registerClickHandler(fn, {sweep: false})` opts out of the VR sweep. Feature-detect every one
+(`api.x?.()`). A scene's play block may say `play.locomotion {teleport?, fly?}` and
+`play.spawn {position, yaw, vrOnly?}`.
diff --git a/MODULES.md b/MODULES.md
index a2beb5c9..dd2c3444 100644
--- a/MODULES.md
+++ b/MODULES.md
@@ -233,6 +233,31 @@ api.registerClickHandler((object) => {
 Handlers see desktop clicks and VR trigger presses (the exact mesh hit, not the
 top-level group). Return `false` to let normal selection continue.
 
+**Modes (1.17).** The editor has two click modes, Edit (every click selects) and
+Interact (play-style clicks and drags without starting the game), plus Play. A
+handler runs in Interact and Play by default, so an Edit click on your game piece
+selects it like any object. Say so when you want something else:
+
+```js
+api.registerClickHandler(pressKey, { modes: ['interact', 'play'] }); // the default, spelled out
+api.registerClickHandler(pickTool, { modes: ['edit'] });             // an editor TOOL
+```
+
+In a headset the same modes apply (1.17, 30b): Play in VR enters Interact, where the
+trigger clicks (module handlers, On Click) and selects nothing; in Edit it selects as
+before. Handlers also get `ctx = {source, mode}` — see *Game feel* below for the
+hold-and-sweep and `{sweep: false}`.
+`api.editorMode()` reads the mode on this screen (`'edit'` | `'interact'`) — for a module
+whose own pointer listeners run outside click routing (a drag), so it can stand down in Edit.
+
+**Listed in the object list (1.17).** Content you build at the scene root shows in
+the object list's *Module content* section — a read-only row that frames it, hides
+it locally, or opens your toolbox. Give it a readable name:
+
+```js
+api.registerListedGroup('piano-module', { label: 'Piano' });
+```
+
 ```js
 api.registerFrameTask((time) => { /* runs every frame, synced time */ });
 
@@ -432,6 +457,106 @@ api.registerFrameTask(() => {
 });
 ```
 
+### Free-cursor games (1.17)
+
+A board, puzzle or instrument game can play with the real mouse cursor and no
+pointer lock: publish `userData.play.cursor = 'free'` on your scene-root group
+(or the scene's physics block sets `play.cursor: 'free'`). `api.pointerRay()` is
+then the cursor's ray in play; in a locked game it is the CROSSHAIR ray (the view's
+centre), never the stale mouse position the lock pinned.
+
+### Storage (1.17)
+
+```js
+// JSON on THIS device, namespaced to your module (tp:mod:<id>:<key>), 256 KB per
+// module; never replicated, never saved into a scene, survives disable/remove.
+if (api.storage) {
+	const progress = api.storage.get('progress', { unlocked: 1 });
+	api.storage.set('progress', progress);   // -> true, or false over the quota
+	api.storage.keys(); api.storage.bytes(); api.storage.remove('progress');
+	api.storage.clear();                     // your "Reset progress"
+}
+```
+
+Feature-detect it; on an older app write the SAME key yourself
+(`localStorage['tp:mod:<id>:<key>'] = JSON.stringify(value)`) so progress carries over.
+
+### Game feel: sound, music, haptics, effects, banners (1.17, roadmap 30b)
+
+Everything here is LOCAL to the device it runs on — broadcast your own op
+(`api.send`) when every peer should hear, feel or see it — and all of it is
+feature-detected, so a module written against it still loads on an older app.
+
+```js
+register(api) {
+	api.registerClickHandler((object, ctx) => {
+		if (!object.userData.ring) return false;
+		const at = object.getWorldPosition(new api.THREE.Vector3()).toArray();
+		api.playSound?.('success', at);
+		api.effects?.burst(at, { kind: 'sparkle' });
+		api.announce?.('Ring ' + object.userData.ring + ' reached', { sub: '+50' });
+		api.hapticPattern?.('success');                // both hands; 'left' | 'right' for one
+		return true;
+	});
+	api.game.onChange?.(() => (api.game.roundUnderway() ? api.music?.play('arcade') : api.music?.stop()));
+}
+```
+
+- **`api.playSound(name, position?)`** → `true` when a sound started. Twenty
+  procedural game sounds, no assets: `click` `pop` `whoosh` `success` `fail` `hit`
+  `kick` `shoot` `laser` `explosion` `coin` `levelup` `goal` `whistle` `cheer`
+  `step` `ring` `sparkle` `hurt` `portal`, plus the ping chimes `ding` (the default),
+  `chime`, `pluck`, `bell`. An unknown name is a quiet no-op (it used to play the
+  ding). `position` spatialises it. Played at the player's "Game sounds" volume.
+- **`api.music.play(preset, {volume?})` / `api.music.stop()`** — a looping
+  procedural track under the effects, at the player's "Music" volume: `arcade`
+  `ambient` `dungeon` `stadium` `space` `puzzle` `studio`. It is TEMPO-SYNCED to the
+  session clock (two peers on one preset hear the same bar), plays only in Interact
+  or Play (`false` from the editor) and stops by itself when the player goes back to
+  editing. `api.music.current()` names what is playing; `api.music.presets()` lists them.
+- **`api.hapticPattern(name, hand?)`** — `tap` `bump` `hit` `success` `fail`
+  `rumble` `heartbeat` on the VR controllers. `api.haptic(intensity, ms, hand?)`
+  still exists. BOTH are silent in Edit mode (vibration is for playing), and core
+  already plays the defaults for you in Interact/Play: a `tap` when the laser enters
+  something clickable, a `bump` when a press lands, a `hit` on a grab, and a knock
+  sized by how hard the hand hit.
+- **`api.effects.burst([x, y, z], {kind?, color?, count?})`** — a short, pooled
+  particle burst at the scene root: `sparkle` (default), `confetti`, `smoke`,
+  `sparks`; `count` 1..96. Nothing is saved or replicated.
+- **`api.announce(text, {sub?, ms?, color?})`** — a big centred banner ("GOAL!",
+  "Level 3"): the desktop HUD, and in a headset a banner fixed in front of the
+  player. A new one replaces the one showing; `ms` 300..15000 (default 1800).
+
+- **`api.setSpawn([x, y, z], yaw, {teleport?})`** — where the player starts: `y` is the
+  FEET, `yaw` is three's `rotation.y` (0 faces −Z). Entering Interact or Play puts the player
+  there (a headset's rig lands its feet on it, a desktop its camera); without `teleport` it is a
+  checkpoint and nobody moves until then. A module's spawn overrides the scene's
+  `play.spawn`. `api.respawnPlayer()` sends the player back to it now.
+
+**In VR, your game's HUD is in the player's hands.** A screen with `input: 'menu'`,
+a control on it, or bound to the `menu` / `paused` / `over` game state is drawn on
+a board ~1.2 m in front of the player that follows their head lazily; its buttons
+work with the laser and trigger and with a poke. The other screens (score, timer,
+level) read as short lines on a card on the left wrist and a strip across the top
+of the view. The board and the wrist card always carry an **Edit mode** button.
+Nothing to do on your side — author the HUD once and it works on both.
+
+**Hold the trigger and sweep (VR, Interact/Play).** While the trigger is held, the
+controller TIP clicks each clickable it passes over — the one it is NEAREST to, so a
+glide along a keyboard plays one key at a time — once, and again after it leaves and
+comes back: piano keys, pads, toggles, HUD buttons; the laser does the same for things
+out of reach. "Clickable" (also what earns the hover `tap`) means: under a group you
+passed to `registerInteractiveGroup`, a part of an audio device (`userData.device` on
+an ancestor — each key/pad is its own control), an object an On Click node targets, or
+an object you mark `userData.clickable = true`. Your handler gets a second argument
+`ctx = {source, mode}`: `source` is `'click'` (desktop), `'trigger'` (the VR press
+itself) or `'sweep'` (a later entry while held). A control that must not be swept
+(a knob you drag, a dot you carry) opts out:
+
+```js
+api.registerClickHandler(pickDot, { sweep: false }); // presses still reach it; sweeps do not
+```
+
 ### Physics (P-A)
 
 All mutations are INITIATOR-ONLY — the peer that started the simulation steps
@@ -579,8 +704,9 @@ api.scene();        // THREE.Scene
 api.objectsGroup(); // the replicated objects root (add scene content here)
 api.peerId();       // our peer id (undefined before the mesh is up)
 api.toast('hi');    // toast in the corner
-api.haptic(0.6, 60);          // buzz the VR controllers (no-op on desktop);
+api.haptic(0.6, 60);          // buzz the VR controllers (no-op on desktop and in Edit);
 api.haptic(0.6, 60, 'right'); // optional hand targets one controller (17-A1)
+api.hapticPattern('success'); // a named pattern (1.17, see Game feel)
 api.isVR();                   // true inside a VR session
 api.vrHand('left');           // one hand's WORLD pose + buttons, or null:
                               // {position, quaternion, trigger, gripped, connected}
diff --git a/check-baseline.json b/check-baseline.json
index 87376af8..12fe5e30 100644
--- a/check-baseline.json
+++ b/check-baseline.json
@@ -1,6 +1,6 @@
 {
 	"comment": "27-I: the svelte-check floor, read ONLY by scripts/check-ratchet.cjs. It used to be hardcoded in release.yml's shell block, where it went stale (362 while the tree measured 359). Ratchet it DOWN whenever a change legitimately removes errors - that is the project convention, and --update does it in one command.",
-	"errors": 336,
+	"errors": 333,
 	"warnings": 47,
-	"measured": "2026-09-20"
+	"measured": "2026-09-23"
 }
diff --git a/scripts/author-templates.cjs b/scripts/author-templates.cjs
index 9d244779..6f6be2cd 100644
--- a/scripts/author-templates.cjs
+++ b/scripts/author-templates.cjs
@@ -39,6 +39,84 @@
 //   editor camera the file opens on) · `thumb.camera` (render the card through a named
 //   camera object). A def with `music` exports WITH assets, so the bytes ride the .tpscene.
 //
+// ==== THE DEF SCHEMA (30 author-kit) — every field, one line each ======================
+// Colours are 0xRRGGBB numbers or '#rrggbb' strings; positions/rotations are [x, y, z]
+// (rotation in radians, Euler XYZ); lengths in metres. Every field is OPTIONAL unless marked *;
+// an absent field is the old behaviour, so a def only states what it means to change.
+//
+// DEF (the file / the card):
+//   kind*            'template' | 'example' | 'game' | 'contest' — decides the folder + index section
+//   seed             false keeps a template out of the bundled offline seed (30c: kit levels need the pack CDN)
+//   slug* title* description   identity + card text; author, license ('CC0-1.0'), tags []
+//   modules          [{id, version}] — the card's module list (games only; must match installModules)
+//   installModules   ['<id>'] — zips installed from MODULES_REPO before the build (the game shows)
+//   generate         a /command, {menu, moduleId?, waitMs?}, or a list of them — run after the build
+//   generateWaitMs   default wait after each generate step (2500)
+//   layout           [{kind, index?, pos, yaw?}] — place generated devices by userData.device.kind
+//   objects*         the scene: OBJECTS below
+//   env              '<preset>' | {preset, exposure} | a CUSTOM sky (ENV below)
+//   gravity          number (m/s², negative = down) · physics — a scenePhysics block, merged
+//   post             a scenePost document (effects: AO, tone mapping, bloom, SMAA, ...)
+//   graphs           {'scene' | <object name>: {nodes, edges}} — node data strings naming a def
+//                    object become its uuid (not label/format/text/placeholder/name); '$music' and
+//                    '$sound:<key>' become content hashes
+//   hud              a hudDocs map · shaders {'scene' | <object name>: shader graph document}
+//   animations       {<object name>: an authored animation set (clips of tracks of keys)}
+//   music            {url | file, sha256, name, volume?} — the scene's background track (+ Explorer)
+//   sounds           [{key, url | file, sha256, name}] — one-shot assets for Sound nodes
+//   view             {pos, target} — the editor camera the file opens on (also the card's camera)
+//   thumb            {camera?: <camera object name>, sceneGroups?: ['<scene-root group>'],
+//                     toneMapping?: 'agx'|'aces'|'neutral'|'reinhard'|'cineon'|'linear'|'none'}
+//   contest          (kind contest) {brief, rules, durationDays, opensAfterDays, judging, credits}
+//
+// OBJECTS — {type*, name*, pos?, rot?, ...}:
+//   box              size [w, h, d]; bevel (radius → a ROUNDED box, baked), bevelSegments (3)
+//   sphere           r                  · cylinder  r (top), r2 (bottom, = r), h
+//   cone             r, h               · torus     r, tube (r × 0.2)
+//   capsule          r, h (the straight part; `length` alias)
+//   plane            size [w, h] — faces +Z (rot [-π/2, 0, 0] to lie flat)
+//   ring             r (outer), inner (r × 0.5) — a flat annulus facing +Z
+//   icosahedron / dodecahedron   r, detail (0)
+//   light            kind 'point' (default: color, intensity, distance, decay — no shadow)
+//                    | 'spot' (angle π/6, penumbra 0.3, distance, decay, target) | 'directional'
+//                    (target; its shadow frustum is FITTED to the built meshes — `fit: false` to
+//                    keep three's) | 'hemisphere' (color = sky, groundColor, intensity).
+//                    spot/directional: castShadow (true), shadowMapSize, `target` = a WORLD point
+//                    aimed by rotation — place a directional OUTSIDE the scene on its sun side
+//   camera           lookAt, fov, aspect — the app's own /create Camera marker
+//   spline           points [{pos, radius}], closed, color
+//   group / empty    children [objects] (names resolve inside groups too)
+//   mirror           of (a named object/group), opacity (0.15), prefix — reflected across x = 0
+//   kit              pack*, item* (a pack item NAME, e.g. 'architecture-kit' / 'WallStone'), scale?
+//                    ([x,y,z] or a number) — a PACK PIECE as a reference (30c packRefs.js): written
+//                    as a stub the app refills from PACKS_BASE, so a level of 100 pieces stays small.
+//                    Kept TOP-LEVEL (physics only reads top-level objects); `physics` sets its
+//                    collider (custom compound boxes/wedges for doorways, stairs, trees)
+// MATERIAL (every mesh type): color, roughness (0.85), metalness (0), emissive +
+//   emissiveIntensity (1), opacity (< 1 → transparent), flatShading, side ('double' | 'back'),
+//   toon (MeshToonMaterial), physical (MeshPhysicalMaterial — also implied by any of:
+//   clearcoat, clearcoatRoughness, transmission, thickness, ior, sheen, sheenColor,
+//   sheenRoughness, iridescence, specularIntensity)
+// FLAGS (any object): physics {mode, mass, restitution, friction, ...} (userData.physics) ·
+//   shadow false (no cast/receive) · pick 'through' (select-through shells: walls, glass) ·
+//   origin [x, y, z] (the local pivot a Door preset swings about) · anim '<preset>' | [..]
+//   (door, drawer, elevator, turntable, pulse, fade — key or name; an AUTHORED clip, run it with
+//   a Play Animation node) · particles '<preset>' | {preset, ...overrides} (sparkles, fire,
+//   smoke, dust, confetti, sparks)
+// ENV — a custom sky: {preset: 'custom' | '<preset>', base?: '<preset>', exposure,
+//   background: '#hex' | {top, bottom} (a gradient; `background` keeps the bottom colour),
+//   fog: {color, near, far} | null, ground: {color, roughness?} (a solid ground disc that takes
+//   the shadows), sun: {color, intensity, dir (FROM the scene TOWARD the sun) | position} | null,
+//   hemi: {sky, ground, intensity} | null}. Any of those keys (or preset 'custom') builds a custom
+//   payload from the base preset (default: the named preset, else studio); exposure is applied once.
+// LOADER FLAGS: --out <dir> (scenes-repo tree + index.json) · --only <slug,..> (a subset, index
+//   MERGED) · --def <file.json,..> (defs from JSON; a same-slug def REPLACES the built-in one) ·
+//   env APP_URL, MODULES_REPO (the sibling modules checkout: zips + modules/<id>/<id>.def.json)
+// THE CARD: rendered with the scene's own look (background, fog, environment rig, authored
+//   lights, shadows), the post stack's tone curve else none, through thumb.camera, else view,
+//   else a 3/4 fit of the content (floor slabs excluded); the private studio pair only lights a
+//   scene with no light at all.
+//
 // 24-A A3 (the PR #192 follow-up): the node/edge helpers are ONE module-scope
 // `graphBuilder()` and `remapData` walks every own string field. Both are meant to leave
 // every earlier def byte-identical, and that is CHECKED, not believed — build the same def
@@ -95,6 +173,22 @@ const ONLY =
 				.split(',')
 				.filter(Boolean)
 		: null;
+// 30 author-kit: `--def <file.json[,file.json]>` adds defs from JSON files — each file holds
+// ONE def or an ARRAY of them. A file def whose slug matches a DEFS entry REPLACES it (so a
+// lane can iterate on a def without editing DEFS); any other slug is appended. Combine with
+// `--only <slug>` to author just that def. This is also how the author-kit suite authors its
+// def-under-test into a scratch folder.
+const defFlag = process.argv.indexOf('--def');
+const FILE_DEFS =
+	defFlag !== -1
+		? String(process.argv[defFlag + 1] ?? '')
+				.split(',')
+				.filter(Boolean)
+				.flatMap((file) => {
+					const parsed = JSON.parse(fs.readFileSync(path.resolve(file), 'utf8'));
+					return Array.isArray(parsed) ? parsed : [parsed];
+				})
+		: [];
 
 // ---- declarative scene definitions ------------------------------------------
 // objects: {type:'box'|'cylinder'|'sphere'|'cone', name, color, pos, rot?, ...dims,
@@ -187,6 +281,10 @@ function towersGraph() {
 	N('quithide', 'hudscreen', 'Close pause on quit', 520, 790, { screen: 'pause', action: 'hide' });
 	E('bquit', 'doquit', 'trigger');
 	E('bquit', 'quithide', 'trigger');
+	// 30: Round over offers Play again beside Menu — the Restart chain above, from `over`
+	N('breplay', 'hudbutton', 'Play again button', 40, 875, { element: 'replay-btn' });
+	E('breplay', 'restartreset', 'trigger');
+	E('breplay', 'restartdelay', 'trigger');
 
 	// ---- height: rung sensors -> perRound latches -> boolean*height -> max -> HUD
 	for (let i = 1; i <= 4; i++) {
@@ -210,16 +308,67 @@ function towersGraph() {
 	E('mx34', 'mxall', 'b');
 	N('hheight', 'hudtext', 'HUD height', 1480, 1030, { element: 'height-read', format: 'Best height: {v} m', decimals: 0, value: 0 });
 	E('mxall', 'hheight', 'value');
-	N('hfinal', 'hudtext', 'HUD final height', 1480, 1180, { element: 'final-height', format: 'Your best tower: {v} m', decimals: 0, value: 0 });
-	E('mxall', 'hfinal', 'value');
-	// reaching the top rung earns a sparkle burst on the pad
-	N('pfx', 'particle', '4m sparkle', 1000, 1400, {
-		mode: 'burst', count: 120, lifetime: 1.4, speed: 2.5, gravity: 0,
-		turbulence: 0.4, sizeStart: 0.12, opacity: 0.9, sprite: 'star', blending: 'additive', space: 'world'
-	});
-	N('selpad', 'objectselector', 'Build pad', 1240, 1400, { selected: 'Build pad' });
-	E('enr4', 'pfx', 'trigger');
-	E('pfx', 'selpad');
+	// ---- 30: the BEST HEIGHT, saved on THIS device (Store Value / Stored Value) --------
+	// Stored on every ring crossing, never on `over`: a perRound latch READS un-set the
+	// instant the round ends (the Infinity cutoff), so an `over` edge would store 0 — and
+	// that is also why the old Round-over line read "0 m" every time. `towers-last` is the
+	// same number for THIS round: `max` too (a crate jittering in a ring sensor re-fires
+	// the crossing after the round ends, when the height reads 0 — a `set` would wipe it),
+	// zeroed by its own `set` node when a round starts. Keys are game-specific because a
+	// Games-tab load leaves the scene unnamed, so every template shares tp:scene:untitled:*.
+	N('storebest', 'storevalue', 'Save best height', 1720, 1030, { key: 'towers-best', mode: 'max', value: 0 });
+	N('storelast', 'storevalue', 'Save this round', 1720, 1180, { key: 'towers-last', mode: 'max', value: 0 });
+	E('mxall', 'storebest', 'value');
+	E('mxall', 'storelast', 'value');
+	for (let i = 1; i <= 4; i++) {
+		E('enr' + i, 'storebest', 'trigger');
+		E('enr' + i, 'storelast', 'trigger');
+	}
+	N('onround', 'ongamestate', 'When a round starts', 1480, 1330, { state: 'playing', edge: 'enter', pulse: 0.3 });
+	N('zerolast', 'storevalue', 'New round: zero it', 1720, 1330, { key: 'towers-last', mode: 'set', value: 0 });
+	E('onround', 'zerolast', 'trigger');
+	N('storedbest', 'storedvalue', 'My best height', 1960, 1030, { key: 'towers-best', output: 'number', fallback: 0 });
+	N('hbest', 'hudtext', 'HUD best (menu)', 2200, 980, { element: 'best-read', format: 'Your best tower: {v} m', decimals: 0, value: 0 });
+	E('storedbest', 'hbest', 'value');
+	N('hbest2', 'hudtext', 'HUD best (over)', 2200, 1100, { element: 'over-best', format: 'Best ever: {v} m', decimals: 0, value: 0 });
+	E('storedbest', 'hbest2', 'value');
+	N('storedlast', 'storedvalue', 'This round', 1960, 1180, { key: 'towers-last', output: 'number', fallback: 0 });
+	N('hfinal', 'hudtext', 'HUD final height', 2200, 1220, { element: 'final-height', format: 'This round: {v} m', decimals: 0, value: 0 });
+	E('storedlast', 'hfinal', 'value');
+	// ---- 30b: the rings are MILESTONES. The first crossing of a ring in a round (a perRound
+	// Once — a crate re-entering the sensor must not re-announce) tells every player: a banner,
+	// a burst AT the ring, a chime from the ring, and a success buzz in VR. The gold ring at
+	// the top is the big one: confetti, the level-up fanfare, "Top of the tower!". The Game
+	// Feel nodes are LOCAL on every peer from the replicated stamp, so no message of their own.
+	// (It replaces 30's particle emitter on the pad: the burst pool costs no emitter slot.)
+	N('buzzring', 'hapticpulse', 'Buzz: a ring reached', 1720, 1480, { pattern: 'success', hand: 'both' });
+	for (let i = 1; i <= 4; i++) {
+		const y = 960 + (i - 1) * 150;
+		const top = i === 4;
+		N('first' + i, 'once', 'First time at ' + i + 'm', 2440, y, { perRound: true, pulse: 0.3 });
+		E('enr' + i, 'first' + i, 'trigger');
+		N('say' + i, 'announce', top ? 'Say: top!' : 'Say: ring ' + i, 2680, y, top
+			? { text: 'Top of the tower!', sub: '4 m — the gold ring', seconds: 2.6, color: '#ffc640', decimals: 0 }
+			: { text: 'Ring ' + i + ' reached', sub: i + ' m — keep stacking', seconds: 1.8, color: '#9ee6ff', decimals: 0 });
+		E('first' + i, 'say' + i, 'trigger');
+		N('fx' + i, 'effectburst', 'Burst at ring ' + i, 2920, y, { kind: top ? 'confetti' : 'sparkle', count: top ? 96 : 56, lift: 0, color: '' });
+		E('first' + i, 'fx' + i, 'trigger');
+		E('selr' + i, 'fx' + i, 'at');
+		// an additive sparkle alone is faint against a daylight sky: a small confetti puff
+		// beside it reads at any exposure (the top ring's burst IS confetti already)
+		if (!top) {
+			N('puff' + i, 'effectburst', 'Puff at ring ' + i, 2920, y + 70, { kind: 'confetti', count: 36, lift: 0.1, color: '' });
+			E('first' + i, 'puff' + i, 'trigger');
+			E('selr' + i, 'puff' + i, 'at');
+		}
+		N('chime' + i, 'gamesound', top ? 'Fanfare at the top' : 'Chime at ring ' + i, 3160, y, { sound: top ? 'levelup' : 'ring' });
+		E('first' + i, 'chime' + i, 'trigger');
+		E('selr' + i, 'chime' + i, 'at');
+		E('first' + i, 'buzzring', 'trigger');
+	}
+	N('topsparkle', 'effectburst', 'Sparkle at the top', 2920, 1560, { kind: 'sparkle', count: 80, lift: 0.4, color: '#ffe08a' });
+	E('first4', 'topsparkle', 'trigger');
+	E('selr4', 'topsparkle', 'at');
 
 	// ---- the stars — collectible-module touch pickups (shared team score) -------
 	for (let i = 1; i <= 3; i++) {
@@ -230,7 +379,16 @@ function towersGraph() {
 		});
 		N('selstar' + i, 'objectselector', 'Star ' + i, 280, y, { selected: 'Star ' + i });
 		E('colstar' + i, 'selstar' + i);
+		// 30: every star turns and breathes once a round starts (its authored `Star glow`
+		// clip: the Turntable + Pulse presets in ONE clip, since a transport plays one clip
+		// per object). Through a zero-second Delay: Play Animation reads a trigger VALUE and
+		// On Game State carries only a stamp (the beat-graph finding).
+		N('glow' + i, 'playanim', 'Star ' + i + ' glow', 1240, y, { clip: 'Star glow', action: 'restart', speed: 1 });
+		E('glowpulse', 'glow' + i, 'trigger');
+		E('glow' + i, 'selstar' + i);
 	}
+	N('glowpulse', 'delay', 'Round start pulse (0 s)', 1000, 1560, { seconds: 0, pulse: 0.3 });
+	E('onround', 'glowpulse', 'trigger');
 	N('cstars', 'collectiblecount', 'Stars left', 520, 1670, { variable: 'stars', read: 'left' });
 	N('hstars', 'hudtext', 'HUD stars', 760, 1670, { element: 'stars-read', format: 'Stars left: {v}', decimals: 0, value: 0 });
 	E('cstars', 'hstars', 'value');
@@ -245,7 +403,7 @@ function towersGraph() {
 
 	// ---- the round clock: ends the round on time -------------------------------
 	N('clock', 'gametime', 'Time left', 40, 2100, { read: 'remaining', length: 180 });
-	N('hclock', 'hudtext', 'HUD clock', 280, 2040, { element: 'clock', format: '{v}s', decimals: 0, value: 0 });
+	N('hclock', 'hudtext', 'HUD clock', 280, 2040, { element: 'clock', format: 'Time: {v}s', decimals: 0, value: 0 });
 	E('clock', 'hclock', 'value');
 	N('timeup', 'compare', 'Time up?', 280, 2190, { op: 'lte', a: 0, b: 0 });
 	E('clock', 'timeup', 'a');
@@ -258,28 +416,142 @@ function towersGraph() {
 	N('gotime', 'setgamestate', 'Time over', 1000, 2240, { state: 'over', outcome: "Time's up!", reset: false });
 	E('alltime', 'gotime', 'trigger');
 
+	// ---- 30b: the round's sound, and the crates' ------------------------------------------
+	// Music: the arcade loop while you are in the game (Interact or Play; never the editor).
+	N('music', 'gamemusic', 'Arcade music', 40, 2480, { preset: 'arcade', volume: 0.45, while: 'always' });
+	// Every menu button clicks.
+	N('click', 'gamesound', 'Button click', 280, 2480, { sound: 'click' });
+	for (const b of ['bstart', 'bagain', 'bresume', 'brestart', 'bquit', 'breplay']) E(b, 'click', 'trigger');
+	// A round starts with a whistle and a banner. It ENDS without one: the Round over panel is
+	// the result (a banner over it read twice), so the end is a cheer or a whistle + confetti.
+	N('saygo', 'announce', 'Say: build!', 1720, 1640, { text: 'Build!', sub: 'Stack crates on the glowing pad — reach the gold ring', seconds: 2.2, color: '#ffd45e', decimals: 0 });
+	E('onround', 'saygo', 'trigger');
+	N('whistle', 'gamesound', 'Round start whistle', 1720, 1720, { sound: 'whistle' });
+	E('onround', 'whistle', 'trigger');
+	N('cheer', 'gamesound', 'Cheer', 1240, 2080, { sound: 'cheer' });
+	E('allwin', 'cheer', 'trigger');
+	N('confetti', 'effectburst', 'Confetti for everyone', 1240, 2160, { kind: 'confetti', count: 96, lift: 0, color: '' });
+	E('allwin', 'confetti', 'trigger');
+	N('upwhistle', 'gamesound', 'Final whistle', 1240, 2380, { sound: 'whistle' });
+	E('alltime', 'upwhistle', 'trigger');
+	// Each crate: a pop when a player lifts it (On Grab) and a knock when it lands on
+	// something (On Impact past a gentle landing), both placed AT the crate.
+	TOWERS_CRATES.forEach((name, k) => {
+		const y = 2560 + k * 110;
+		N('csel' + k, 'objectselector', name, 280, y, { selected: name });
+		N('cgrab' + k, 'ongrab', name + ' grabbed', 40, y, { pulse: 0.3 });
+		E('cgrab' + k, 'csel' + k);
+		N('cpop' + k, 'gamesound', name + ' lift', 520, y, { sound: 'pop' });
+		E('cgrab' + k, 'cpop' + k, 'trigger');
+		E('csel' + k, 'cpop' + k, 'at');
+		N('cland' + k, 'onimpact', name + ' lands', 760, y, { pulse: 0.3, minStrength: 0.8 });
+		E('cland' + k, 'csel' + k);
+		N('cknock' + k, 'gamesound', name + ' knock', 1000, y, { sound: 'hit' });
+		E('cland' + k, 'cknock' + k, 'trigger');
+		E('csel' + k, 'cknock' + k, 'at');
+	});
+
 	return g.done();
 }
+/** the nine crates the sound chains above name (the objects below) */
+const TOWERS_CRATES = ['Cube 1', 'Cube 2', 'Cube 3', 'Cube 4', 'Cube 5', 'Cube 6', 'Plank 1', 'Plank 2', 'Plank 3'];
 
 const TOWERS_HUD_PANEL = {
-	bg: 'rgba(20, 26, 36, 0.92)',
-	radius: 16,
-	border: '1px solid rgba(136, 192, 208, 0.25)'
+	bg: 'rgba(14, 20, 32, 0.9)',
+	radius: 18,
+	border: '1px solid rgba(255, 212, 94, 0.28)'
+};
+const TOWERS_BTN = { size: 17, weight: '600', bg: '#3b7dd8', color: '#ffffff', radius: 10 };
+// 30: the finished look. Crates read as WOOD (a physical material with a sheen and a thin
+// clearcoat, chamfered edges), the floor carries a subtle 2 m tile from a shader graph, the
+// walls are chamfered with a glowing trim, and the height markers are thin glowing rings
+// beside a marked pole instead of stacked translucent squares.
+const TOWERS_WOOD = { physical: true, roughness: 0.6, sheen: 0.4, sheenColor: 0xffd7a0, sheenRoughness: 0.55, clearcoat: 0.12, clearcoatRoughness: 0.5 };
+const TOWERS_CRATE = { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 };
+const TOWERS_PLANK = { mode: 'dynamic', mass: 0.9, friction: 0.8, restitution: 0.03 };
+/** a chamfered wooden crate (bevelSegments 1 keeps the baked geometry small)
+ * @param {string} name @param {number} color @param {number[]} size @param {number[]} pos @param {any} physics */
+const towersCrate = (name, color, size, pos, physics) => ({ type: 'box', name, color, size, bevel: 0.045, bevelSegments: 1, pos, ...TOWERS_WOOD, physics });
+/** the floor tile: a 13 x 13 grid of 2 m tiles with a thin grout line and a faint checker,
+ * MULTIPLYING the authored colour (albedo is `diffuseColor.rgb *= ` in the inject backend) */
+const TOWERS_FLOOR_SHADER = {
+	nodes: [
+		{ id: 'uv', type: 'uv', position: { x: 40, y: 80 }, data: {} },
+		{ id: 'xy', type: 'split', position: { x: 240, y: 80 }, data: {} },
+		{
+			id: 'tile',
+			type: 'glsl',
+			position: { x: 460, y: 80 },
+			data: {
+				type: 'vec3',
+				expression:
+					'vec3(1.0 - 0.3 * (1.0 - step(0.025, fract(a * 13.0)) * step(fract(a * 13.0), 0.975) * step(0.025, fract(b * 13.0)) * step(fract(b * 13.0), 0.975)) - 0.06 * mod(floor(a * 13.0) + floor(b * 13.0), 2.0))'
+			}
+		},
+		{ id: 's', type: 'surface', position: { x: 720, y: 80 }, data: {} }
+	],
+	edges: [
+		{ id: 'e-uv-xy', source: 'uv', sourceHandle: 'out', target: 'xy', targetHandle: 'value' },
+		{ id: 'e-xy-tile-a', source: 'xy', sourceHandle: 'x', target: 'tile', targetHandle: 'a' },
+		{ id: 'e-xy-tile-b', source: 'xy', sourceHandle: 'y', target: 'tile', targetHandle: 'b' },
+		{ id: 'e-tile-s', source: 'tile', sourceHandle: 'out', target: 's', targetHandle: 'albedo' }
+	]
+};
+/** the Turntable + Pulse presets folded into ONE clip (a transport plays one clip per
+ * object): a turn every 6 s, a breath every 1.5 s — scale and glow together */
+const STAR_GLOW_CLIP = {
+	active: 'glow',
+	changedAt: 0,
+	clips: {
+		glow: {
+			name: 'Star glow',
+			duration: 6,
+			loop: 'loop',
+			tracks: [
+				{ id: 'turn', channel: 'rot.y', keys: [{ t: 0, v: 0 }, { t: 6, v: 6.2832 }] },
+				{
+					id: 'breathe',
+					channel: 'scale',
+					keys: [0, 1.5, 3, 4.5, 6].flatMap((t, i, all) =>
+						i < all.length - 1
+							? [{ t, v: 1, ease: [0.42, 0, 0.58, 1] }, { t: t + 0.75, v: 1.18, ease: [0.42, 0, 0.58, 1] }]
+							: [{ t, v: 1 }]
+					)
+				},
+				{
+					id: 'shine',
+					channel: 'emissive',
+					keys: [0, 1.5, 3, 4.5, 6].flatMap((t, i, all) =>
+						i < all.length - 1 ? [{ t, v: 1.6 }, { t: t + 0.75, v: 3.2 }] : [{ t, v: 1.6 }]
+					)
+				}
+			]
+		}
+	}
 };
 const TOWERS_DEF = {
 	kind: 'game',
 	slug: 'towers',
 	title: 'Towers',
 	description:
-		'Co-op crate stacking: grab the crates, build the tallest tower on the glowing pad, climb to the stars. Press P to pause or restart.',
+		'Co-op crate stacking: grab the wooden crates, build the tallest tower on the glowing pad, climb to the stars. Your best height is saved. Press P to pause or restart.',
 	license: 'CC0-1.0',
 	author: 'theprototype',
 	tags: ['physics', 'stacking', 'co-op', 'vr'],
-	modules: [{ id: 'collectible', version: '1.0.0' }],
+	modules: [{ id: 'collectible', version: '1.1.2' }],
 	installModules: ['collectible'],
-	// daylight: the scene must READ, and a stacking game lives on seeing block edges.
-	// (night was black on the user's display; the emissive accents below still pop.)
-	env: { preset: 'daylight', exposure: 1 },
+	// 30: daylight under a real sky — a blue-to-haze gradient, a far fog that softens the
+	// horizon, and a solid ground disc around the arena (the infinite grid is editor chrome;
+	// it no longer shows in Play). Exposure above the 0.9 floor.
+	env: {
+		preset: 'daylight',
+		exposure: 1.05,
+		background: { top: '#4a7fc0', bottom: '#dbe8f2' },
+		// 30 integrate: the fog closes in past the arena wall, so the ground beyond the edge
+		// fades into the sky's own haze instead of ending in a flat olive band
+		fog: { color: '#dbe8f2', near: 16, far: 75 },
+		ground: { color: '#7b8866', roughness: 0.95 }
+	},
 	// ground ON — a solid floor the crates rest on. A crate knocked past the low wall
 	// falls to the bounds limit and RESPAWNS to its start pose (beforeStates), so the
 	// supply cannot be lost. Grab interaction, sim starts on Play.
@@ -288,20 +560,27 @@ const TOWERS_DEF = {
 		bounds: { limit: -20, action: 'respawn' },
 		material: { friction: 0.7, restitution: 0.05 },
 		damping: { linear: 0.05, angular: 0.3 },
-		play: { interaction: 'grab', grounded: false, simOnPlay: true }
+		// 30b: a SPAWN — Play (and Interact in VR) puts you 4.5 m in front of the pad, facing
+		// it, with a podium on each hand (yaw 0 faces -Z)
+		play: { interaction: 'grab', grounded: false, simOnPlay: true, spawn: { position: [0, 0, 4.5], yaw: 0 } }
 	},
-	// C9 Towers look, minimal + VR-safe: ao -> AgX -> low bloom -> smaa. No shader docs.
+	// the shell floor (fork 11): ao -> AgX -> bloom -> smaa, bloom a touch higher so the
+	// rings, the trim and the pad read as light
 	post: {
 		enabled: true,
 		effects: [
 			{ id: 'ao', kind: 'ao', enabled: true, params: {} },
 			{ id: 'tone', kind: 'tonemapping', enabled: true, params: { mode: 'AGX' } },
-			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: 0.5, luminanceThreshold: 0.85 } },
+			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: 0.75, luminanceThreshold: 0.8 } },
 			{ id: 'aa', kind: 'smaa', enabled: true, params: {} }
 		],
 		changedAt: 0
 	},
+	view: { pos: [7.5, 6.5, 12.5], target: [0, 1.4, 0] },
+	thumb: { camera: 'Card camera' },
 	graphs: { scene: towersGraph() },
+	shaders: { 'Arena floor': TOWERS_FLOOR_SHADER },
+	animations: { 'Star 1': STAR_GLOW_CLIP, 'Star 2': STAR_GLOW_CLIP, 'Star 3': STAR_GLOW_CLIP },
 	hud: {
 		scene: {
 			active: '',
@@ -313,11 +592,15 @@ const TOWERS_DEF = {
 					showWhile: 'menu',
 					input: 'menu',
 					elements: [
-						{ id: 'menu-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 460, h: 340, z: 0, label: '', style: TOWERS_HUD_PANEL },
-						{ id: 'title', kind: 'text', anchor: 'center', x: 0, y: -115, w: 400, h: 54, z: 1, label: 'TOWERS', style: { size: 40, weight: '700', color: '#ffd45e', align: 'center' } },
-						{ id: 'subtitle', kind: 'text', anchor: 'center', x: 0, y: -68, w: 430, h: 44, z: 1, label: 'Grab the crates and build the tallest tower on the glowing pad. Touch the floating stars.', style: { size: 14, color: '#d8dee9', align: 'center' }, wrap: true },
-						{ id: 'start-btn', kind: 'button', anchor: 'center', x: 0, y: 20, w: 220, h: 48, z: 1, label: 'Start round', enabled: true, style: { size: 17, weight: '600', bg: '#3b7dd8', color: '#ffffff', radius: 10 } },
-						{ id: 'menu-hint', kind: 'text', anchor: 'center', x: 0, y: 110, w: 430, h: 40, z: 1, label: 'Grab: hold click  ·  Push/pull: wheel  ·  Fly: Q/E  ·  Pause: P', style: { size: 12, color: '#8b97a8', align: 'center' }, wrap: true }
+						{ id: 'menu-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 500, h: 460, z: 0, label: '', style: TOWERS_HUD_PANEL },
+						{ id: 'title', kind: 'text', anchor: 'center', x: 0, y: -176, w: 420, h: 54, z: 1, label: 'TOWERS', style: { size: 42, weight: '700', color: '#ffd45e', align: 'center' } },
+						// 30b: HOW TO PLAY, said once, plainly — the goal, the milestones, the clock
+						{ id: 'howto-title', kind: 'text', anchor: 'center', x: 0, y: -132, w: 440, h: 20, z: 1, label: 'HOW TO PLAY', style: { size: 12, weight: '700', color: '#9ee6ff', align: 'center' } },
+						{ id: 'subtitle', kind: 'text', anchor: 'center', x: 0, y: -94, w: 450, h: 60, z: 1, label: 'Grab crates from the podiums and stack them on the glowing pad. Each ring your tower reaches is a milestone — the gold ring at 4 m is the top. Touch the three floating stars. Three minutes a round.', style: { size: 14, color: '#d8dee9', align: 'center' }, wrap: true },
+						{ id: 'best-read', kind: 'text', anchor: 'center', x: 0, y: -44, w: 420, h: 24, z: 1, label: 'Your best tower: 0 m', style: { size: 15, weight: '600', color: '#9ee6ff', align: 'center' } },
+						{ id: 'start-btn', kind: 'button', anchor: 'center', x: 0, y: 14, w: 240, h: 50, z: 1, label: 'Start round', enabled: true, style: TOWERS_BTN },
+						{ id: 'menu-hint', kind: 'text', anchor: 'center', x: 0, y: 88, w: 460, h: 36, z: 1, label: 'Desktop: hold click to grab  ·  wheel pushes/pulls  ·  Q/E fly  ·  P pause', style: { size: 12, color: '#8b97a8', align: 'center' }, wrap: true },
+						{ id: 'menu-hint-vr', kind: 'text', anchor: 'center', x: 0, y: 128, w: 460, h: 36, z: 1, label: 'VR: grip grabs a crate  ·  left stick walks  ·  Y switches to Edit mode', style: { size: 12, color: '#8b97a8', align: 'center' }, wrap: true }
 					]
 				},
 				{
@@ -326,10 +609,10 @@ const TOWERS_DEF = {
 					showWhile: 'playing',
 					input: 'game',
 					elements: [
-						{ id: 'height-read', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 280, h: 30, z: 1, label: '', style: { size: 18, weight: '600', color: '#e5e9f0', align: 'center' } },
-						{ id: 'clock', kind: 'text', anchor: 'top-center', x: 0, y: 46, w: 120, h: 22, z: 1, label: '', style: { size: 13, color: '#c8d0dc', align: 'center' } },
-						{ id: 'stars-read', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 200, h: 24, z: 1, label: '', style: { size: 14, color: '#ffd45e', align: 'right' } },
-						{ id: 'play-hint', kind: 'text', anchor: 'bottom-center', x: 0, y: 12, w: 520, h: 20, z: 1, label: 'Stack on the glowing pad — the rings mark your height.  Press P to pause.', style: { size: 11, color: '#8b97a8', align: 'center' } }
+						{ id: 'height-read', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 280, h: 30, z: 1, label: '', style: { size: 20, weight: '700', color: '#ffffff', align: 'center' } },
+						{ id: 'clock', kind: 'text', anchor: 'top-center', x: 0, y: 48, w: 120, h: 22, z: 1, label: '', style: { size: 13, weight: '600', color: '#e5e9f0', align: 'center' } },
+						{ id: 'stars-read', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 200, h: 24, z: 1, label: '', style: { size: 15, weight: '600', color: '#ffd45e', align: 'right' } },
+						{ id: 'play-hint', kind: 'text', anchor: 'bottom-center', x: 0, y: 12, w: 520, h: 20, z: 1, label: 'Stack on the glowing pad — the rings mark your height.  Press P to pause.', style: { size: 11, color: '#e5e9f0', align: 'center' } }
 					]
 				},
 				{
@@ -339,8 +622,8 @@ const TOWERS_DEF = {
 					elements: [
 						{ id: 'pause-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 380, h: 300, z: 0, label: '', style: TOWERS_HUD_PANEL },
 						{ id: 'pause-title', kind: 'text', anchor: 'center', x: 0, y: -95, w: 340, h: 36, z: 1, label: 'PAUSED', style: { size: 26, weight: '700', color: '#e5e9f0', align: 'center' } },
-						{ id: 'resume-btn', kind: 'button', anchor: 'center', x: 0, y: -30, w: 240, h: 42, z: 1, label: 'Resume', enabled: true, style: { size: 16, weight: '600', bg: '#3b7dd8', color: '#ffffff', radius: 10 } },
-						{ id: 'restart-btn', kind: 'button', anchor: 'center', x: 0, y: 22, w: 240, h: 42, z: 1, label: 'Restart round', enabled: true, style: { size: 16, weight: '600', bg: '#4c9e6a', color: '#ffffff', radius: 10 } },
+						{ id: 'resume-btn', kind: 'button', anchor: 'center', x: 0, y: -30, w: 240, h: 42, z: 1, label: 'Resume', enabled: true, style: { ...TOWERS_BTN, size: 16 } },
+						{ id: 'restart-btn', kind: 'button', anchor: 'center', x: 0, y: 22, w: 240, h: 42, z: 1, label: 'Restart round', enabled: true, style: { ...TOWERS_BTN, size: 16, bg: '#4c9e6a' } },
 						{ id: 'quit-btn', kind: 'button', anchor: 'center', x: 0, y: 74, w: 240, h: 42, z: 1, label: 'Quit to menu', enabled: true, style: { size: 15, weight: '500', bg: '#3a4150', color: '#e5e9f0', radius: 10 } }
 					]
 				},
@@ -350,76 +633,105 @@ const TOWERS_DEF = {
 					showWhile: 'over',
 					input: 'menu',
 					elements: [
-						{ id: 'over-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 420, h: 250, z: 0, label: '', style: TOWERS_HUD_PANEL },
-						{ id: 'over-title', kind: 'text', anchor: 'center', x: 0, y: -70, w: 380, h: 40, z: 1, label: 'ROUND OVER', style: { size: 30, weight: '700', color: '#ffd45e', align: 'center' } },
-						{ id: 'final-height', kind: 'text', anchor: 'center', x: 0, y: -18, w: 380, h: 26, z: 1, label: '', style: { size: 16, color: '#e5e9f0', align: 'center' } },
-						{ id: 'again-btn', kind: 'button', anchor: 'center', x: 0, y: 58, w: 220, h: 44, z: 1, label: 'Back to menu', enabled: true, style: { size: 16, weight: '600', bg: '#3b7dd8', color: '#ffffff', radius: 10 } }
+						{ id: 'over-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 440, h: 320, z: 0, label: '', style: TOWERS_HUD_PANEL },
+						{ id: 'over-title', kind: 'text', anchor: 'center', x: 0, y: -104, w: 400, h: 40, z: 1, label: 'ROUND OVER', style: { size: 30, weight: '700', color: '#ffd45e', align: 'center' } },
+						{ id: 'final-height', kind: 'text', anchor: 'center', x: 0, y: -56, w: 400, h: 28, z: 1, label: '', style: { size: 18, weight: '600', color: '#e5e9f0', align: 'center' } },
+						{ id: 'over-best', kind: 'text', anchor: 'center', x: 0, y: -24, w: 400, h: 22, z: 1, label: '', style: { size: 14, color: '#9ee6ff', align: 'center' } },
+						{ id: 'replay-btn', kind: 'button', anchor: 'center', x: 0, y: 40, w: 240, h: 46, z: 1, label: 'Play again', enabled: true, style: TOWERS_BTN },
+						{ id: 'again-btn', kind: 'button', anchor: 'center', x: 0, y: 96, w: 240, h: 42, z: 1, label: 'Menu', enabled: true, style: { size: 15, weight: '500', bg: '#3a4150', color: '#e5e9f0', radius: 10 } }
 					]
 				}
 			]
 		}
 	},
 	objects: [
-		// the arena — a lit floor with a low rim, built on the ground plane
-		{ type: 'box', name: 'Arena floor', color: 0x6b7280, size: [26, 0.5, 26], pos: [0, -0.25, 0], roughness: 0.95, physics: { mode: 'static', friction: 0.9 } },
-		{ type: 'box', name: 'Wall north', color: 0x565f6e, size: [26, 1, 0.5], pos: [0, 0.5, -13], physics: { mode: 'static' } },
-		{ type: 'box', name: 'Wall south', color: 0x565f6e, size: [26, 1, 0.5], pos: [0, 0.5, 13], physics: { mode: 'static' } },
-		{ type: 'box', name: 'Wall west', color: 0x565f6e, size: [0.5, 1, 26], pos: [-13, 0.5, 0], physics: { mode: 'static' } },
-		{ type: 'box', name: 'Wall east', color: 0x565f6e, size: [0.5, 1, 26], pos: [13, 0.5, 0], physics: { mode: 'static' } },
-		// build pad — glowing blue, SUNK so its bottom face is not coplanar with the floor
-		{ type: 'cylinder', name: 'Build pad', color: 0x3b6ea8, r: 1.7, h: 0.24, pos: [0, 0.08, 0], emissive: 0x2a5b8f, emissiveIntensity: 0.7, roughness: 0.5, physics: { mode: 'static', friction: 1 } },
+		// the arena — a tiled floor with a low chamfered rim and a glowing trim on top
+		{ type: 'box', name: 'Arena floor', color: 0xb4bbc4, size: [26, 0.5, 26], pos: [0, -0.25, 0], roughness: 0.78, physics: { mode: 'static', friction: 0.9 } },
+		{ type: 'box', name: 'Wall north', color: 0x7a8494, size: [26, 1, 0.5], bevel: 0.1, bevelSegments: 1, pos: [0, 0.5, -13], physical: true, roughness: 0.55, clearcoat: 0.3, physics: { mode: 'static' } },
+		{ type: 'box', name: 'Wall south', color: 0x7a8494, size: [26, 1, 0.5], bevel: 0.1, bevelSegments: 1, pos: [0, 0.5, 13], physical: true, roughness: 0.55, clearcoat: 0.3, physics: { mode: 'static' } },
+		{ type: 'box', name: 'Wall west', color: 0x7a8494, size: [0.5, 1, 26], bevel: 0.1, bevelSegments: 1, pos: [-13, 0.5, 0], physical: true, roughness: 0.55, clearcoat: 0.3, physics: { mode: 'static' } },
+		{ type: 'box', name: 'Wall east', color: 0x7a8494, size: [0.5, 1, 26], bevel: 0.1, bevelSegments: 1, pos: [13, 0.5, 0], physical: true, roughness: 0.55, clearcoat: 0.3, physics: { mode: 'static' } },
+		{ type: 'box', name: 'Trim north', color: 0x9fe8ff, size: [25.4, 0.05, 0.12], pos: [0, 1.02, -13], emissive: 0x4fcfff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'box', name: 'Trim south', color: 0x9fe8ff, size: [25.4, 0.05, 0.12], pos: [0, 1.02, 13], emissive: 0x4fcfff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'box', name: 'Trim west', color: 0x9fe8ff, size: [0.12, 0.05, 25.4], pos: [-13, 1.02, 0], emissive: 0x4fcfff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'box', name: 'Trim east', color: 0x9fe8ff, size: [0.12, 0.05, 25.4], pos: [13, 1.02, 0], emissive: 0x4fcfff, emissiveIntensity: 2.4, shadow: false },
+		// build pad — glowing blue under a clearcoat, SUNK so its bottom face is not coplanar
+		// with the floor, a bright rim, and a soft blue light spilling onto the tiles
+		{ type: 'cylinder', name: 'Build pad', color: 0x2f6fbf, r: 1.7, h: 0.24, pos: [0, 0.08, 0], emissive: 0x2f8fff, emissiveIntensity: 1.1, physical: true, roughness: 0.3, clearcoat: 0.8, physics: { mode: 'static', friction: 1 } },
+		{ type: 'torus', name: 'Pad rim', color: 0xbfefff, r: 1.72, tube: 0.045, pos: [0, 0.2, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x7fdcff, emissiveIntensity: 3, shadow: false },
+		{ type: 'light', name: 'Pad glow', kind: 'point', color: 0x5fb4ff, intensity: 4, distance: 7, pos: [0, 0.7, 0] },
 		// podiums where the crate supply sits, sunk into the floor by the same trick
-		{ type: 'cylinder', name: 'Cube podium', color: 0x4a5262, r: 1.1, h: 0.5, pos: [-5.5, 0.2, 0], physics: { mode: 'static', friction: 0.9 } },
-		{ type: 'cylinder', name: 'Plank podium', color: 0x4a5262, r: 1.1, h: 0.5, pos: [5.5, 0.2, 0], physics: { mode: 'static', friction: 0.9 } },
-		// PRE-PLACED crates: a tidy supply that rests until grabbed, then stays put.
+		{ type: 'cylinder', name: 'Cube podium', color: 0x5d6879, r: 1.1, h: 0.5, pos: [-5.5, 0.2, 0], physical: true, metalness: 0.1, roughness: 0.4, clearcoat: 0.5, physics: { mode: 'static', friction: 0.9 } },
+		{ type: 'cylinder', name: 'Plank podium', color: 0x5d6879, r: 1.1, h: 0.5, pos: [5.5, 0.2, 0], physical: true, metalness: 0.1, roughness: 0.4, clearcoat: 0.5, physics: { mode: 'static', friction: 0.9 } },
+		// PRE-PLACED wooden crates: a tidy supply that rests until grabbed, then stays put.
 		// Cubes on the left podium (podium top ~0.45; stack from just above it).
-		{ type: 'box', name: 'Cube 1', color: 0xd08770, size: [0.6, 0.6, 0.6], pos: [-5.5, 0.85, 0], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Cube 2', color: 0xd0a070, size: [0.6, 0.6, 0.6], pos: [-5.5, 1.5, 0], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Cube 3', color: 0xc98a5a, size: [0.6, 0.6, 0.6], pos: [-5.5, 2.15, 0], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Cube 4', color: 0xd08770, size: [0.6, 0.6, 0.6], pos: [-5.5, 2.8, 0], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
+		towersCrate('Cube 1', 0xb57a45, [0.6, 0.6, 0.6], [-5.5, 0.85, 0], TOWERS_CRATE),
+		towersCrate('Cube 2', 0xc28d55, [0.6, 0.6, 0.6], [-5.5, 1.5, 0], TOWERS_CRATE),
+		towersCrate('Cube 3', 0xa86d3c, [0.6, 0.6, 0.6], [-5.5, 2.15, 0], TOWERS_CRATE),
+		towersCrate('Cube 4', 0xb57a45, [0.6, 0.6, 0.6], [-5.5, 2.8, 0], TOWERS_CRATE),
 		// planks on the right podium
-		{ type: 'box', name: 'Plank 1', color: 0xa3be8c, size: [1.4, 0.3, 0.6], pos: [5.5, 0.75, 0], physics: { mode: 'dynamic', mass: 0.9, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Plank 2', color: 0x94b07e, size: [1.4, 0.3, 0.6], pos: [5.5, 1.2, 0], physics: { mode: 'dynamic', mass: 0.9, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Plank 3', color: 0xa3be8c, size: [1.4, 0.3, 0.6], pos: [5.5, 1.65, 0], physics: { mode: 'dynamic', mass: 0.9, friction: 0.8, restitution: 0.03 } },
+		towersCrate('Plank 1', 0xd2a86e, [1.4, 0.3, 0.6], [5.5, 0.75, 0], TOWERS_PLANK),
+		towersCrate('Plank 2', 0xc49a60, [1.4, 0.3, 0.6], [5.5, 1.2, 0], TOWERS_PLANK),
+		towersCrate('Plank 3', 0xd2a86e, [1.4, 0.3, 0.6], [5.5, 1.65, 0], TOWERS_PLANK),
 		// a few loose cubes near the pad to start building right away
-		{ type: 'box', name: 'Cube 5', color: 0xd08770, size: [0.6, 0.6, 0.6], pos: [-2, 0.35, 2], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
-		{ type: 'box', name: 'Cube 6', color: 0xc98a5a, size: [0.6, 0.6, 0.6], pos: [2, 0.35, 2], physics: { mode: 'dynamic', mass: 1, friction: 0.8, restitution: 0.03 } },
-		// height rings over the pad — faint translucent bands, sensors a rising crate trips
-		{ type: 'box', name: 'Height ring 1m', color: 0x9ee6ff, size: [1.5, 0.05, 1.5], pos: [0, 1, 0], emissive: 0x2f6f8f, emissiveIntensity: 0.6, opacity: 0.28, physics: { mode: 'static', sensor: true, collider: 'box' } },
-		{ type: 'box', name: 'Height ring 2m', color: 0x9ee6ff, size: [1.5, 0.05, 1.5], pos: [0, 2, 0], emissive: 0x2f6f8f, emissiveIntensity: 0.6, opacity: 0.28, physics: { mode: 'static', sensor: true, collider: 'box' } },
-		{ type: 'box', name: 'Height ring 3m', color: 0x9ee6ff, size: [1.5, 0.05, 1.5], pos: [0, 3, 0], emissive: 0x2f6f8f, emissiveIntensity: 0.6, opacity: 0.28, physics: { mode: 'static', sensor: true, collider: 'box' } },
-		{ type: 'box', name: 'Height ring 4m', color: 0x9ee6ff, size: [1.5, 0.05, 1.5], pos: [0, 4, 0], emissive: 0x2f6f8f, emissiveIntensity: 0.6, opacity: 0.28, physics: { mode: 'static', sensor: true, collider: 'box' } },
-		// the stars — glowing collectible touch pickups at climbing heights
-		{ type: 'sphere', name: 'Star 1', color: 0xffe08a, r: 0.2, pos: [-3.5, 2.4, 3.5], emissive: 0xffcf50, emissiveIntensity: 0.9, roughness: 0.4 },
-		{ type: 'sphere', name: 'Star 2', color: 0xffe08a, r: 0.2, pos: [3.5, 3.2, -3.5], emissive: 0xffcf50, emissiveIntensity: 0.9, roughness: 0.4 },
-		{ type: 'sphere', name: 'Star 3', color: 0xffe08a, r: 0.2, pos: [0, 4.4, 0], emissive: 0xffcf50, emissiveIntensity: 0.9, roughness: 0.4 }
+		towersCrate('Cube 5', 0xc28d55, [0.6, 0.6, 0.6], [-2, 0.35, 2], TOWERS_CRATE),
+		towersCrate('Cube 6', 0xa86d3c, [0.6, 0.6, 0.6], [2, 0.35, 2], TOWERS_CRATE),
+		// height rings over the pad — thin glowing rings a rising crate trips (the sensor is
+		// the ring's box, so the hole still counts); select-through, so a click reaches the
+		// tower inside. The top ring is gold: the one worth a sparkle.
+		{ type: 'torus', name: 'Height ring 1m', color: 0xbff4ff, r: 0.9, tube: 0.035, pos: [0, 1, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.2, shadow: false, pick: 'through', physics: { mode: 'static', sensor: true, collider: 'box' } },
+		{ type: 'torus', name: 'Height ring 2m', color: 0xbff4ff, r: 0.9, tube: 0.035, pos: [0, 2, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.2, shadow: false, pick: 'through', physics: { mode: 'static', sensor: true, collider: 'box' } },
+		{ type: 'torus', name: 'Height ring 3m', color: 0xbff4ff, r: 0.9, tube: 0.035, pos: [0, 3, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.2, shadow: false, pick: 'through', physics: { mode: 'static', sensor: true, collider: 'box' } },
+		{ type: 'torus', name: 'Height ring 4m', color: 0xfff0b8, r: 0.9, tube: 0.04, pos: [0, 4, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0xffc640, emissiveIntensity: 2.6, shadow: false, pick: 'through', physics: { mode: 'static', sensor: true, collider: 'box' } },
+		// the measuring pole beside the pad: one bright mark per metre, lined up with a ring
+		{ type: 'cylinder', name: 'Height pole', color: 0xe8edf3, r: 0.04, h: 4.3, pos: [2.2, 2.15, 0], physical: true, metalness: 0.6, roughness: 0.3, shadow: false },
+		{ type: 'torus', name: 'Pole mark 1m', color: 0xbff4ff, r: 0.1, tube: 0.025, pos: [2.2, 1, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'torus', name: 'Pole mark 2m', color: 0xbff4ff, r: 0.1, tube: 0.025, pos: [2.2, 2, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'torus', name: 'Pole mark 3m', color: 0xbff4ff, r: 0.1, tube: 0.025, pos: [2.2, 3, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x49d2ff, emissiveIntensity: 2.4, shadow: false },
+		{ type: 'torus', name: 'Pole mark 4m', color: 0xfff0b8, r: 0.1, tube: 0.03, pos: [2.2, 4, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0xffc640, emissiveIntensity: 2.6, shadow: false },
+		// the stars — faceted glowing collectibles at climbing heights (touch pickups)
+		{ type: 'dodecahedron', name: 'Star 1', color: 0xffc640, r: 0.24, pos: [-3.5, 2.4, 3.5], emissive: 0xffb830, emissiveIntensity: 1.6, physical: true, roughness: 0.25, metalness: 0.1, clearcoat: 1, flatShading: true },
+		{ type: 'dodecahedron', name: 'Star 2', color: 0xffc640, r: 0.24, pos: [3.5, 3.2, -3.5], emissive: 0xffb830, emissiveIntensity: 1.6, physical: true, roughness: 0.25, metalness: 0.1, clearcoat: 1, flatShading: true },
+		{ type: 'dodecahedron', name: 'Star 3', color: 0xffc640, r: 0.24, pos: [0, 4.6, 0], emissive: 0xffb830, emissiveIntensity: 1.6, physical: true, roughness: 0.25, metalness: 0.1, clearcoat: 1, flatShading: true },
+		// the card's camera: a 3/4 view over the pad with the podiums either side
+		{ type: 'camera', name: 'Card camera', pos: [8.2, 6, 10.2], lookAt: [0, 1.5, 0], fov: 45 }
 	]
 };
 
 // ---- 24-A A4: Stars Room, the second GAME def -------------------------------------
 // The first game that needs NO module download: a zero-g room you knock stars around
-// in (A1's knock, A2's On Hit), pure core. Sandbox by default (locked fork 4): the sim
-// runs on Play, the stars react, the touch leaderboard counts; the P menu (or the
-// physical Start pad, for VR — F8: the DOM HUD is invisible in a headset) opens the
-// OPTIONAL round: light every star. Design notes worth keeping:
-//   · the default screen is \`input: 'game'\` — a \`menu\`-input screen visible while
+// in (A1's knock, A2's On Hit), pure core. Design notes worth keeping:
+//   · 30 visuals-core: a START SCREEN (menu) offers `Start round` or `Free play`. Free play is
+//     a game STATE of its own ('free' — setGameState keeps an unknown state verbatim), so its
+//     screen is state-bound and the P menu's Resume (a `hide`) falls back to it; a screen
+//     OVERRIDE would have fallen back to the start screen instead. A round is two minutes:
+//     light every star, or run out of time — Round over names which, from STORED values,
+//     because every perRound latch reads un-lit the instant the round ends;
+//   · the default free screen is `input: 'game'` — a `menu`-input screen visible while
 //     playing releases the pointer lock (21-E3), which would make free play unplayable
 //     on desktop; every button lives on the P menu, plus two onclick PADS for VR;
 //   · the lit colour rides latch -> Select -> Set Color. The editor would refuse to draw
 //     Select (number) into Set Color's colour input, but the runtime reads whatever the
 //     wire resolves to and Select passes a string through raw — recorded as a follow-up
-//     (a Select typed by its wired inputs, or a Select Colour node);
+//     (a Select typed by its wired inputs, or a Select Colour node). The Round-over title
+//     uses the same trick into HUD Text's `format`;
+//   · THE BURST (30b): 30 pooled ONE particle emitter on a `Burst anchor` a Script moved onto
+//     the star just hit, because a particle node wired to 24 stars is 24 of the runtime's 8
+//     emitters. The Game Feel Effect Burst is pooled by the CORE (twelve short-lived systems at
+//     the scene root, no emitter slot), so each star has its own burst node now and the anchor,
+//     the Script and the hit-index sum are gone;
 //   · the spawner RECYCLES oldest-out at maxAlive, it does not refuse — "More stars"
 //     therefore never fails, and the room holds at most 27 + 32 dynamic bodies;
-//   · the chime is a def-level \`sounds\` entry (A4, additive): fetched like \`music\`,
-//     dropped into the Explorer, addressed by \`'$sound:<key>'\` from a Sound node — NOT
-//     \`music\`, which would also fill the scene's background-music slot;
-//   · dark by nature, so authored on a LIT preset at low exposure + bloom (F14, the
-//     Towers finding); the look on the user's display is owed, never assumed.
+//   · the chime is a def-level `sounds` entry (A4, additive): fetched like `music`,
+//     dropped into the Explorer, addressed by `'$sound:<key>'` from a Sound node — NOT
+//     `music`, which would also fill the scene's background-music slot;
+//   · 30: a real space room — a deep-blue gradient sky, a starfield (one continuous emitter
+//     flung to a ~20 m shell and faded in only once it has left the room), glass walls on a
+//     glowing frame, crystal stars; the look on the user's display is owed, never assumed.
 const STARS_HUD_PANEL = {
-	bg: 'rgba(8, 10, 24, 0.9)',
-	radius: 16,
-	border: '1px solid rgba(255, 212, 94, 0.25)'
+	bg: 'rgba(8, 10, 28, 0.9)',
+	radius: 18,
+	border: '1px solid rgba(255, 212, 94, 0.3)'
 };
 const STARS_CHIME = {
 	key: 'chime',
@@ -430,6 +742,8 @@ const STARS_CHIME = {
 };
 const STAR_DIM = '#3b3f66';
 const STAR_LIT = '#ffe08a';
+/** the round length in seconds (Game Time `remaining`) */
+const STARS_ROUND = 120;
 /** a seeded LCG, so the lattice jitter is DATA and two builds place every star alike
  * @param {number} seed */
 function seeded(seed) {
@@ -439,14 +753,15 @@ function seeded(seed) {
 		return s / 4294967296;
 	};
 }
-/** 24 stars on a jittered 4 x 6 lattice at hand height (0.8-2.6 m), r 0.16-0.3 */
+/** 24 crystal stars on a jittered 4 x 6 lattice at hand height (0.8-2.6 m), r 0.16-0.3 —
+ * faceted icosahedra under a clearcoat, glowing in four colours, with SPHERE colliders */
 function starObjects() {
 	const rand = seeded(24);
 	const palette = [
-		{ color: 0xffe08a, emissive: 0xffcf50 },
-		{ color: 0x9ad0ff, emissive: 0x5aa8ff },
-		{ color: 0xffb0d8, emissive: 0xff6ab0 },
-		{ color: 0xc8ffb0, emissive: 0x8aff6a }
+		{ color: 0xffe08a, emissive: 0xffc040 },
+		{ color: 0x9ad0ff, emissive: 0x4a9cff },
+		{ color: 0xffb0d8, emissive: 0xff5aa8 },
+		{ color: 0xc8ffb0, emissive: 0x6aff5a }
 	];
 	/** @type {any[]} */ const out = [];
 	let i = 0;
@@ -459,10 +774,11 @@ function starObjects() {
 			const r = 0.16 + rand() * 0.14;
 			const p = palette[(i - 1) % palette.length];
 			out.push({
-				type: 'sphere', name: 'Star ' + i, color: p.color, r: +r.toFixed(3),
+				type: 'icosahedron', name: 'Star ' + i, color: p.color, r: +r.toFixed(3),
 				pos: [+x.toFixed(2), +y.toFixed(2), +z.toFixed(2)],
-				emissive: p.emissive, emissiveIntensity: 1.2, roughness: 0.4,
-				physics: { mode: 'dynamic', mass: 0.2, restitution: 0.9, friction: 0.1 }
+				emissive: p.emissive, emissiveIntensity: 1.1, physical: true, roughness: 0.15, metalness: 0.1,
+				clearcoat: 1, clearcoatRoughness: 0.1, flatShading: true,
+				physics: { mode: 'dynamic', mass: 0.2, restitution: 0.9, friction: 0.1, collider: 'sphere' }
 			});
 		}
 	return out;
@@ -471,25 +787,33 @@ function starObjects() {
 function starsGraph() {
 	const g = graphBuilder();
 	const { N, E } = g;
-	// ---- the round: Start (P menu or the VR pad) -> playing; Back to menu ------------
-	N('bstart', 'hudbutton', 'Start button', 40, 40, { element: 'start-btn' });
+	// ---- the start screen: Start round or Free play -----------------------------------
+	N('bstart0', 'hudbutton', 'Start screen: Start', 40, 40, { element: 'go-btn' });
 	N('gostart', 'setgamestate', 'Start round', 280, 40, { state: 'playing', outcome: '', reset: false });
+	E('bstart0', 'gostart', 'trigger');
+	N('bfree', 'hudbutton', 'Start screen: Free play', 40, 110, { element: 'free-btn' });
+	N('gofree', 'setgamestate', 'Free play', 280, 110, { state: 'free', outcome: '', reset: false });
+	E('bfree', 'gofree', 'trigger');
+	// ---- Start from the P menu or the VR pad -> playing ---------------------------------
+	N('bstart', 'hudbutton', 'Start button (menu)', 40, 190, { element: 'start-btn' });
 	E('bstart', 'gostart', 'trigger');
-	N('padstart', 'onclick', 'Start pad clicked', 40, 120, { pulse: 0.3 });
-	N('selstartpad', 'objectselector', 'Start pad', 280, 120, { selected: 'Start pad' });
+	N('padstart', 'onclick', 'Start pad clicked', 40, 260, { pulse: 0.3 });
+	N('selstartpad', 'objectselector', 'Start pad', 280, 260, { selected: 'Start pad' });
 	E('padstart', 'selstartpad');
 	E('padstart', 'gostart', 'trigger');
-	N('starthide', 'hudscreen', 'Close menu on start', 520, 40, { screen: 'pause', action: 'hide' });
+	N('starthide', 'hudscreen', 'Close menu on start', 520, 190, { screen: 'pause', action: 'hide' });
 	E('bstart', 'starthide', 'trigger');
-	N('bagain', 'hudbutton', 'Play again button', 40, 200, { element: 'again-btn' });
-	N('gomenu', 'setgamestate', 'Back to menu', 280, 200, { state: 'menu', outcome: '', reset: true });
+	// ---- Round over: Play again, or back to the start screen ------------------------------
+	N('bagain', 'hudbutton', 'Menu button (over)', 40, 330, { element: 'again-btn' });
+	N('gomenu', 'setgamestate', 'Back to menu', 280, 330, { state: 'menu', outcome: '', reset: true });
 	E('bagain', 'gomenu', 'trigger');
+	N('breplay', 'hudbutton', 'Play again button', 40, 400, { element: 'replay-btn' });
 	// ---- the P menu (Towers' pause, plus Start / More stars) --------------------------
-	N('pkey', 'keypress', 'Press P', 40, 340, { code: 'KeyP', edge: 'down', pulse: 0.3 });
-	N('pausetoggle', 'hudscreen', 'Toggle menu', 280, 340, { screen: 'pause', action: 'toggle' });
+	N('pkey', 'keypress', 'Press P', 40, 480, { code: 'KeyP', edge: 'down', pulse: 0.3 });
+	N('pausetoggle', 'hudscreen', 'Toggle menu', 280, 480, { screen: 'pause', action: 'toggle' });
 	E('pkey', 'pausetoggle', 'trigger');
-	N('bresume', 'hudbutton', 'Resume button', 40, 490, { element: 'resume-btn' });
-	N('resumehide', 'hudscreen', 'Close menu', 280, 490, { screen: 'pause', action: 'hide' });
+	N('bresume', 'hudbutton', 'Resume button', 40, 560, { element: 'resume-btn' });
+	N('resumehide', 'hudscreen', 'Close menu', 280, 560, { screen: 'pause', action: 'hide' });
 	E('bresume', 'resumehide', 'trigger');
 	N('brestart', 'hudbutton', 'Restart button', 40, 640, { element: 'restart-btn' });
 	N('restartreset', 'setgamestate', 'Restart: to menu', 280, 640, { state: 'menu', outcome: '', reset: true });
@@ -500,9 +824,11 @@ function starsGraph() {
 	E('brestart', 'restartdelay', 'trigger');
 	E('restartdelay', 'restartplay', 'trigger');
 	E('brestart', 'restarthide', 'trigger');
-	N('bquit', 'hudbutton', 'Quit to free play button', 40, 790, { element: 'quit-btn' });
-	N('doquit', 'setgamestate', 'Quit to free play', 280, 790, { state: 'menu', outcome: '', reset: true });
-	N('quithide', 'hudscreen', 'Close menu on quit', 520, 790, { screen: 'pause', action: 'hide' });
+	E('breplay', 'restartreset', 'trigger');
+	E('breplay', 'restartdelay', 'trigger');
+	N('bquit', 'hudbutton', 'Quit to menu button', 40, 840, { element: 'quit-btn' });
+	N('doquit', 'setgamestate', 'Quit to menu', 280, 840, { state: 'menu', outcome: '', reset: true });
+	N('quithide', 'hudscreen', 'Close menu on quit', 520, 840, { screen: 'pause', action: 'hide' });
 	E('bquit', 'doquit', 'trigger');
 	E('bquit', 'quithide', 'trigger');
 	// ---- More stars: the menu button or the VR pad spawns 3 copies of the template ----
@@ -511,7 +837,7 @@ function starsGraph() {
 	N('selmorepad', 'objectselector', 'More stars pad', 280, 1020, { selected: 'More stars pad' });
 	E('padmore', 'selmorepad');
 	N('seltpl', 'objectselector', 'Star template', 280, 940, { selected: 'Star template' });
-	// \`at\` is an OFFSET from the template (under the floor at y -2): y 4 lands copies at 2 m
+	// `at` is an OFFSET from the template (under the floor at y -2): y 4 lands copies at 2 m
 	N('spawn', 'spawn', 'Spawn 3 stars', 520, 940, { x: 0, y: 4, z: 0, count: 3, maxAlive: 32, interval: 0.5, spread: 1.5 });
 	E('bmore', 'spawn', 'trigger');
 	E('padmore', 'spawn', 'trigger');
@@ -526,31 +852,32 @@ function starsGraph() {
 	N('sumtouch', 'peervariable', 'All touches', 40, 1540, { name: 'touches', read: 'sum', peer: '', fallback: 0 });
 	N('hsum', 'hudtext', 'HUD all touches', 280, 1540, { element: 'total-read', format: 'Touches: {v}', decimals: 0, value: 0 });
 	E('sumtouch', 'hsum', 'value');
-	N('board', 'leaderboard', 'Touch leaderboard', 520, 1540, { element: 'board', variable: 'touches', order: 'desc', format: '{name} — {v}', decimals: 0, limit: 8 });
-	N('board2', 'leaderboard', 'Touch leaderboard (round)', 760, 1540, { element: 'board-2', variable: 'touches', order: 'desc', format: '{name} — {v}', decimals: 0, limit: 8 });
-	// ---- the round clock ---------------------------------------------------------
-	N('clock', 'gametime', 'Round clock', 40, 1690, { read: 'elapsed', length: 600 });
-	N('hclock', 'hudtext', 'HUD clock', 280, 1690, { element: 'clock', format: '{v}s', decimals: 0, value: 0 });
+	N('board', 'leaderboard', 'Touch leaderboard', 520, 1540, { element: 'board', variable: 'touches', order: 'desc', format: '{name} — {v}', decimals: 0, limit: 4 });
+	N('board2', 'leaderboard', 'Touch leaderboard (round)', 760, 1540, { element: 'board-2', variable: 'touches', order: 'desc', format: '{name} — {v}', decimals: 0, limit: 4 });
+	N('board3', 'leaderboard', 'Touch leaderboard (over)', 1000, 1540, { element: 'board-3', variable: 'touches', order: 'desc', format: '{name} — {v}', decimals: 0, limit: 5 });
+	// ---- the round clock: two minutes, counting down -----------------------------------
+	N('clock', 'gametime', 'Time left', 40, 1690, { read: 'remaining', length: STARS_ROUND });
+	N('hclock', 'hudtext', 'HUD clock', 280, 1690, { element: 'clock', format: '{v}s left', decimals: 0, value: 0 });
 	E('clock', 'hclock', 'value');
-	N('hfinal', 'hudtext', 'HUD final time', 520, 1690, { element: 'final-time', format: 'Every star lit in {v}s', decimals: 0, value: 0 });
-	E('clock', 'hfinal', 'value');
-	// ---- per star: burst + chime on any hit, a per-player touch on MY hit, a perRound
-	// latch that paints the star lit during a round ---------------------------------------
+	N('elapsed', 'gametime', 'Round time', 40, 1760, { read: 'elapsed', length: STARS_ROUND });
+	N('timeup', 'compare', 'Time up?', 280, 1760, { op: 'lte', a: 0, b: 0 });
+	E('clock', 'timeup', 'a');
+	N('playing', 'gametime', 'Is playing', 40, 1830, { read: 'playing', length: 60 });
+	N('timeandplay', 'gate', 'Time up & playing', 520, 1760, { op: 'and', a: false, b: false });
+	E('timeup', 'timeandplay', 'a');
+	E('playing', 'timeandplay', 'b');
+	N('alltime', 'allplayers', 'Everyone out of time', 760, 1760, { pulse: 0.3 });
+	E('timeandplay', 'alltime', 'condition');
+	N('gotime', 'setgamestate', 'Time over', 1000, 1760, { state: 'over', outcome: "Time's up!", reset: false });
+	E('alltime', 'gotime', 'trigger');
+	// ---- per star: a chime on any hit, a per-player touch on MY hit, and a perRound latch
+	// that paints the star lit during a round ------------------------------------------------
 	let prevSum = '';
 	for (let i = 1; i <= 24; i++) {
 		const y = 1900 + (i - 1) * 180;
 		N('sel' + i, 'objectselector', 'Star ' + i, 1000, y, { selected: 'Star ' + i });
 		N('hit' + i, 'onhit', 'Star ' + i + ' hit', 40, y, { pulse: 0.3, minSpeed: 0.3, who: 'anyone' });
 		E('hit' + i, 'sel' + i);
-		N('mulc' + i, 'math', 'Burst size ' + i, 280, y, { op: 'mul', a: 0, b: 15 });
-		E('hit' + i, 'mulc' + i, 'a', 'speed');
-		N('pfx' + i, 'particle', 'Star ' + i + ' burst', 520, y, {
-			mode: 'burst', count: 40, lifetime: 0.9, speed: 1.8, gravity: 0,
-			turbulence: 0.3, sizeStart: 0.08, opacity: 0.9, sprite: 'star', blending: 'additive', space: 'world'
-		});
-		E('hit' + i, 'pfx' + i, 'trigger');
-		E('mulc' + i, 'pfx' + i, 'count');
-		E('pfx' + i, 'sel' + i);
 		N('snd' + i, 'sound', 'Star ' + i + ' chime', 760, y, {
 			hash: '$sound:chime', file: STARS_CHIME.name, volume: 0.7, radius: 8, rolloff: 1, loop: false, playing: false
 		});
@@ -578,6 +905,24 @@ function starsGraph() {
 			prevSum = 'sum' + i;
 		}
 	}
+	// ---- 30b: each star SPARKLES where it is hit, and LIGHTING it (the first hit of the round,
+	// a perRound Once) pays a coin chime and a haptic tap. The Game Feel burst is POOLED by
+	// the core (twelve short-lived systems at the scene root, no emitter slot), so 24 of them
+	// cost nothing between hits — which retires 30's one-emitter-plus-Script anchor trick.
+	N('buzzlit', 'hapticpulse', 'Buzz: a star lit', 1960, 1400, { pattern: 'tap', hand: 'both' });
+	for (let i = 1; i <= 24; i++) {
+		const y = 1900 + (i - 1) * 180;
+		N('fx' + i, 'effectburst', 'Star ' + i + ' sparkle', 2200, y, { kind: 'sparkle', count: 28, lift: 0, color: '' });
+		E('hit' + i, 'fx' + i, 'trigger');
+		E('sel' + i, 'fx' + i, 'at');
+		N('first' + i, 'once', 'Star ' + i + ' first lit', 2440, y, { perRound: true, pulse: 0.3 });
+		E('hit' + i, 'first' + i, 'trigger');
+		N('coin' + i, 'gamesound', 'Star ' + i + ' coin', 2680, y, { sound: 'coin' });
+		E('first' + i, 'coin' + i, 'trigger');
+		E('sel' + i, 'coin' + i, 'at');
+		E('first' + i, 'buzzlit', 'trigger');
+	}
+	// ---- the round's result, kept where the round's end cannot erase it ------------------
 	N('hlit', 'hudtext', 'HUD lit', 2200, 2000, { element: 'lit-read', format: 'Lit: {v} / 24', decimals: 0, value: 0 });
 	E('sum24', 'hlit', 'value');
 	N('alllit', 'compare', 'All lit?', 2200, 2150, { op: 'gte', a: 0, b: 24 });
@@ -586,22 +931,110 @@ function starsGraph() {
 	E('alllit', 'allwin', 'condition');
 	N('gowin', 'setgamestate', 'Round won', 2680, 2150, { state: 'over', outcome: 'Every star lit!', reset: false });
 	E('allwin', 'gowin', 'trigger');
+	// Stored on every hit (never on `over`, when every perRound latch reads un-lit): the
+	// best round and this round's count as `max`, so a star knocked on the over screen
+	// (the sim still runs) cannot wipe them; the win time is `max` of a value that is 0
+	// until the 24th star lights. Each round zeroes its own two by `set` nodes.
+	N('winat', 'select', 'Time if every star is lit', 2200, 2300, { index: 0, a: 0, b: 0 });
+	E('alllit', 'winat', 'index');
+	E('elapsed', 'winat', 'b');
+	N('storebest', 'storevalue', 'Save best round', 2440, 2300, { key: 'stars-best', mode: 'max', value: 0 });
+	N('storelast', 'storevalue', 'Save this round', 2440, 2380, { key: 'stars-last', mode: 'max', value: 0 });
+	N('storetime', 'storevalue', 'Save the win time', 2440, 2460, { key: 'stars-time', mode: 'max', value: 0 });
+	E('sum24', 'storebest', 'value');
+	E('sum24', 'storelast', 'value');
+	E('winat', 'storetime', 'value');
+	for (let i = 1; i <= 24; i++) {
+		E('hit' + i, 'storebest', 'trigger');
+		E('hit' + i, 'storelast', 'trigger');
+		E('hit' + i, 'storetime', 'trigger');
+	}
+	N('onround', 'ongamestate', 'When a round starts', 2200, 2540, { state: 'playing', edge: 'enter', pulse: 0.3 });
+	N('zerolast', 'storevalue', 'New round: zero the count', 2440, 2540, { key: 'stars-last', mode: 'set', value: 0 });
+	N('zerotime', 'storevalue', 'New round: zero the time', 2440, 2620, { key: 'stars-time', mode: 'set', value: 0 });
+	E('onround', 'zerolast', 'trigger');
+	E('onround', 'zerotime', 'trigger');
+	N('storedlast', 'storedvalue', 'This round', 2680, 2380, { key: 'stars-last', output: 'number', fallback: 0 });
+	N('storedtime', 'storedvalue', 'Win time', 2680, 2460, { key: 'stars-time', output: 'number', fallback: 0 });
+	N('storedbest', 'storedvalue', 'Best round', 2680, 2300, { key: 'stars-best', output: 'number', fallback: 0 });
+	N('won', 'compare', 'Won?', 2920, 2380, { op: 'gte', a: 0, b: 24 });
+	E('storedlast', 'won', 'a');
+	N('titlepick', 'select', 'Over title', 3160, 2300, { index: 0, a: "TIME'S UP", b: 'EVERY STAR LIT' });
+	E('won', 'titlepick', 'index');
+	N('htitle', 'hudtext', 'HUD over title', 3400, 2300, { element: 'over-title', format: 'ROUND OVER', decimals: 0, value: 0 });
+	E('titlepick', 'htitle', 'format');
+	N('linepick', 'select', 'Over line', 3160, 2460, { index: 0, a: 'Lit {v} / 24 in time', b: 'Every star lit in {v}s' });
+	E('won', 'linepick', 'index');
+	N('pickvalue', 'select', 'Over number', 3160, 2540, { index: 0, a: 0, b: 0 });
+	E('won', 'pickvalue', 'index');
+	E('storedlast', 'pickvalue', 'a');
+	E('storedtime', 'pickvalue', 'b');
+	N('hfinal', 'hudtext', 'HUD over line', 3400, 2460, { element: 'final-time', format: 'Lit {v} / 24', decimals: 0, value: 0 });
+	E('linepick', 'hfinal', 'format');
+	E('pickvalue', 'hfinal', 'value');
+	N('hbest', 'hudtext', 'HUD best (over)', 3400, 2620, { element: 'over-best', format: 'Your best: {v} / 24 stars', decimals: 0, value: 0 });
+	E('storedbest', 'hbest', 'value');
+	N('hbest0', 'hudtext', 'HUD best (start)', 3400, 2700, { element: 'best-read', format: 'Your best round: {v} / 24 stars', decimals: 0, value: 0 });
+	E('storedbest', 'hbest0', 'value');
+
+	// ---- 30b: the round says what is happening, and sounds like it -----------------------
+	N('music', 'gamemusic', 'Space music', 40, 1240, { preset: 'space', volume: 0.45, while: 'always' });
+	N('click', 'gamesound', 'Button click', 280, 1100, { sound: 'click' });
+	for (const b of ['bstart0', 'bfree', 'bstart', 'bagain', 'breplay', 'bresume', 'brestart', 'bquit', 'bmore']) E(b, 'click', 'trigger');
+	N('saygo', 'announce', 'Say: light them', 2680, 2540, { text: 'Light every star!', sub: 'Two minutes — knock each one', seconds: 2.2, color: '#ffe08a', decimals: 0 });
+	E('onround', 'saygo', 'trigger');
+	N('whistle', 'gamesound', 'Round start whistle', 2680, 2620, { sound: 'whistle' });
+	E('onround', 'whistle', 'trigger');
+	N('sayfree', 'announce', 'Say: free play', 520, 110, { text: 'Free play', sub: 'Knock the stars around — P or the menu to start a round', seconds: 2, color: '#9ee6ff', decimals: 0 });
+	E('bfree', 'sayfree', 'trigger');
+	N('fanfare', 'gamesound', 'Win fanfare', 2920, 2230, { sound: 'levelup' });
+	E('allwin', 'fanfare', 'trigger');
+	N('upwhistle', 'gamesound', 'Final whistle', 1240, 1920, { sound: 'whistle' });
+	E('alltime', 'upwhistle', 'trigger');
+	// the round's end, whichever way: confetti in front of every player and a cheer, with the
+	// results on the Round over screen (the VR board in a headset) — NO banner at the end: it
+	// read twice over the results panel
+	N('onover', 'ongamestate', 'When the round ends', 3160, 2700, { state: 'over', edge: 'enter', pulse: 0.3 });
+	N('confetti', 'effectburst', 'Confetti', 3400, 2700, { kind: 'confetti', count: 96, lift: 0, color: '' });
+	E('onover', 'confetti', 'trigger');
+	N('cheer', 'gamesound', 'Cheer', 3400, 2780, { sound: 'cheer' });
+	E('onover', 'cheer', 'trigger');
 	return g.done();
 }
 
 const STARS_TEXT = { size: 13, color: '#d8dee9', align: 'center' };
 const STARS_BTN = { size: 16, weight: '600', bg: '#3b7dd8', color: '#ffffff', radius: 10 };
+const STARS_QUIET = { size: 15, weight: '500', bg: '#3a4150', color: '#e5e9f0', radius: 10 };
+/** a glass wall: nearly clear, glossy, faintly blue — select-through, so the stars behind
+ * it are what a click reaches @param {string} name @param {number[]} size @param {number[]} pos */
+const starsGlass = (name, size, pos) => ({
+	type: 'box', name, color: 0x8fb0ff, size, pos, opacity: 0.1, physical: true, roughness: 0.05, clearcoat: 1,
+	emissive: 0x1a2a5a, emissiveIntensity: 0.4, pick: 'through', shadow: false,
+	physics: { mode: 'static', friction: 0.1, restitution: 0.85 }
+});
+/** the glowing frame the glass hangs in @param {string} name @param {string} type @param {any} dims @param {number[]} pos */
+const starsFrame = (name, type, dims, pos) => ({ type, name, ...dims, pos, color: 0xbfe8ff, emissive: 0x58c8ff, emissiveIntensity: 2.2, shadow: false });
 const STARS_DEF = {
 	kind: 'game',
 	slug: 'stars-room',
 	title: 'Stars Room',
 	description:
-		'A zero-gravity room full of glowing stars. Knock them with your hands in VR or walk into them; press P for the round: light every star, and see who touched the most.',
+		'A zero-gravity glass room full of glowing crystal stars. Knock them with your hands in VR or walk into them. Start a round to light every star against the clock, or just play.',
 	license: 'CC0-1.0',
 	author: 'theprototype',
 	tags: ['zero-g', 'physics', 'sandbox', 'vr'],
 	// pure core — the first game that needs no download (no 'modules', no 'installModules')
-	env: { preset: 'studio', exposure: 0.55 },
+	// 30: a space room at a readable exposure (the 0.55 studio made it murky): a deep-blue
+	// gradient sky, a cool hemisphere and a soft key light for the crystals' facets
+	env: {
+		preset: 'custom',
+		base: 'studio',
+		exposure: 1.1,
+		background: { top: '#03040f', bottom: '#27408f' },
+		fog: null,
+		hemi: { sky: '#a8b8ff', ground: '#2c2058', intensity: 1.4 },
+		sun: { color: '#d4ddff', intensity: 1.5, dir: [0.35, 1, 0.3] }
+	},
 	physics: {
 		gravity: 0,
 		ground: { enabled: false },
@@ -609,7 +1042,8 @@ const STARS_DEF = {
 		material: { friction: 0.1, restitution: 0.85 },
 		damping: { linear: 0.35, angular: 0.2 },
 		ccd: false,
-		play: { interaction: 'grab', grounded: false, simOnPlay: true },
+		// 30b: a SPAWN just inside the south glass, facing the stars (yaw 0 faces -Z)
+		play: { interaction: 'grab', grounded: false, simOnPlay: true, spawn: { position: [0, 0, 5.2], yaw: 0 } },
 		knock: { enabled: true, gain: 1, maxSpeed: 10, radius: 0.12, spin: 0.6 }
 	},
 	post: {
@@ -617,7 +1051,7 @@ const STARS_DEF = {
 		effects: [
 			{ id: 'ao', kind: 'ao', enabled: true, params: {} },
 			{ id: 'tone', kind: 'tonemapping', enabled: true, params: { mode: 'AGX' } },
-			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: 1.2, luminanceThreshold: 0.55 } },
+			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: 1.3, luminanceThreshold: 0.5 } },
 			{ id: 'vig', kind: 'vignette', enabled: true, params: {} },
 			{ id: 'aa', kind: 'smaa', enabled: true, params: {} }
 		],
@@ -625,23 +1059,42 @@ const STARS_DEF = {
 	},
 	sounds: [STARS_CHIME],
 	view: { pos: [0, 3.4, 11], target: [0, 1.6, 0] },
+	thumb: { camera: 'Card camera' },
 	graphs: { scene: starsGraph() },
 	hud: {
 		scene: {
 			active: '',
 			changedAt: 0,
 			screens: [
+				{
+					id: 'start',
+					name: 'Start',
+					showWhile: 'menu',
+					input: 'menu',
+					elements: [
+						{ id: 'start-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 460, h: 400, z: 0, label: '', style: STARS_HUD_PANEL },
+						{ id: 'start-title', kind: 'text', anchor: 'center', x: 0, y: -145, w: 420, h: 48, z: 1, label: 'STARS ROOM', style: { size: 36, weight: '700', color: '#ffd45e', align: 'center' } },
+						// 30b: HOW TO PLAY
+						{ id: 'howto-title', kind: 'text', anchor: 'center', x: 0, y: -112, w: 400, h: 18, z: 1, label: 'HOW TO PLAY', style: { size: 12, weight: '700', color: '#9ee6ff', align: 'center' } },
+						{ id: 'start-sub', kind: 'text', anchor: 'center', x: 0, y: -80, w: 420, h: 44, z: 1, label: 'Zero gravity. Knock every crystal star once to light it — in VR swing your hands through them, on a desktop walk into them.', style: STARS_TEXT, wrap: true },
+						{ id: 'best-read', kind: 'text', anchor: 'center', x: 0, y: -44, w: 400, h: 24, z: 1, label: 'Your best round: 0 / 24 stars', style: { size: 14, weight: '600', color: '#9ee6ff', align: 'center' } },
+						{ id: 'go-btn', kind: 'button', anchor: 'center', x: 0, y: 12, w: 260, h: 48, z: 1, label: 'Start round', enabled: true, style: { ...STARS_BTN, size: 17 } },
+						{ id: 'free-btn', kind: 'button', anchor: 'center', x: 0, y: 70, w: 260, h: 42, z: 1, label: 'Free play', enabled: true, style: STARS_QUIET },
+						{ id: 'start-hint', kind: 'text', anchor: 'center', x: 0, y: 128, w: 420, h: 22, z: 1, label: 'Light all 24 in two minutes  ·  P: menu', style: { size: 12, color: '#8b97a8', align: 'center' }, wrap: true },
+						{ id: 'start-hint-vr', kind: 'text', anchor: 'center', x: 0, y: 156, w: 420, h: 22, z: 1, label: 'VR: left stick walks  ·  grip grabs  ·  Y switches to Edit mode', style: { size: 12, color: '#8b97a8', align: 'center' }, wrap: true }
+					]
+				},
 				{
 					id: 'free',
 					name: 'Free play',
-					showWhile: 'menu',
+					showWhile: 'free',
 					input: 'game',
 					elements: [
 						{ id: 'free-title', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 420, h: 30, z: 1, label: 'STARS ROOM  ·  free play', style: { size: 18, weight: '700', color: '#ffd45e', align: 'center' } },
-						{ id: 'free-hint', kind: 'text', anchor: 'top-center', x: 0, y: 44, w: 520, h: 22, z: 1, label: 'Knock the stars.  P: menu (start a round, more stars)', style: { size: 12, color: '#8b97a8', align: 'center' } },
-						{ id: 'touches-read', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 220, h: 24, z: 1, label: '', style: { size: 14, color: '#ffd45e', align: 'right' } },
+						{ id: 'free-hint', kind: 'text', anchor: 'top-center', x: 0, y: 44, w: 520, h: 22, z: 1, label: 'Knock the stars.  P: menu (start a round, more stars)', style: { size: 12, color: '#c8d0dc', align: 'center' } },
+						{ id: 'touches-read', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 220, h: 24, z: 1, label: '', style: { size: 14, weight: '600', color: '#ffd45e', align: 'right' } },
 						{ id: 'total-read', kind: 'text', anchor: 'top-right', x: 16, y: 40, w: 220, h: 22, z: 1, label: '', style: { size: 12, color: '#c8d0dc', align: 'right' } },
-						{ id: 'board', kind: 'list', anchor: 'top-right', x: 16, y: 70, w: 220, h: 150, z: 1, label: '', title: 'Touches', rowsText: '', rows: 8, rowHeight: 18, style: { size: 12, bg: 'rgba(8, 10, 24, 0.6)', radius: 8, pad: 6 } }
+						{ id: 'board', kind: 'list', anchor: 'top-right', x: 16, y: 70, w: 180, h: 96, z: 1, label: '', title: 'Touches', rowsText: '', rows: 4, rowHeight: 18, style: { size: 12, bg: 'rgba(8, 10, 28, 0.62)', radius: 10, pad: 8 } }
 					]
 				},
 				{
@@ -650,11 +1103,11 @@ const STARS_DEF = {
 					showWhile: 'playing',
 					input: 'game',
 					elements: [
-						{ id: 'lit-read', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 280, h: 30, z: 1, label: '', style: { size: 18, weight: '600', color: '#ffe08a', align: 'center' } },
-						{ id: 'clock', kind: 'text', anchor: 'top-center', x: 0, y: 46, w: 120, h: 22, z: 1, label: '', style: { size: 13, color: '#c8d0dc', align: 'center' } },
-						{ id: 'touches-read-2', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 220, h: 24, z: 1, label: '', style: { size: 14, color: '#ffd45e', align: 'right' } },
-						{ id: 'board-2', kind: 'list', anchor: 'top-right', x: 16, y: 44, w: 220, h: 150, z: 1, label: '', title: 'Touches', rowsText: '', rows: 8, rowHeight: 18, style: { size: 12, bg: 'rgba(8, 10, 24, 0.6)', radius: 8, pad: 6 } },
-						{ id: 'play-hint', kind: 'text', anchor: 'bottom-center', x: 0, y: 12, w: 520, h: 20, z: 1, label: 'Light every star.  P: menu', style: { size: 11, color: '#8b97a8', align: 'center' } }
+						{ id: 'lit-read', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 280, h: 30, z: 1, label: '', style: { size: 20, weight: '700', color: '#ffe08a', align: 'center' } },
+						{ id: 'clock', kind: 'text', anchor: 'top-center', x: 0, y: 48, w: 140, h: 22, z: 1, label: '', style: { size: 13, weight: '600', color: '#e5e9f0', align: 'center' } },
+						{ id: 'touches-read-2', kind: 'text', anchor: 'top-right', x: 16, y: 14, w: 220, h: 24, z: 1, label: '', style: { size: 14, weight: '600', color: '#ffd45e', align: 'right' } },
+						{ id: 'board-2', kind: 'list', anchor: 'top-right', x: 16, y: 44, w: 180, h: 96, z: 1, label: '', title: 'Touches', rowsText: '', rows: 4, rowHeight: 18, style: { size: 12, bg: 'rgba(8, 10, 28, 0.62)', radius: 10, pad: 8 } },
+						{ id: 'play-hint', kind: 'text', anchor: 'bottom-center', x: 0, y: 12, w: 520, h: 20, z: 1, label: 'Light every star.  P: menu', style: { size: 11, color: '#c8d0dc', align: 'center' } }
 					]
 				},
 				{
@@ -668,8 +1121,8 @@ const STARS_DEF = {
 						{ id: 'start-btn', kind: 'button', anchor: 'center', x: 0, y: -50, w: 250, h: 42, z: 1, label: 'Start round: light every star', enabled: true, style: STARS_BTN },
 						{ id: 'restart-btn', kind: 'button', anchor: 'center', x: 0, y: 0, w: 250, h: 42, z: 1, label: 'Restart round', enabled: true, style: { ...STARS_BTN, bg: '#4c9e6a' } },
 						{ id: 'more-btn', kind: 'button', anchor: 'center', x: 0, y: 50, w: 250, h: 42, z: 1, label: 'More stars', enabled: true, style: { ...STARS_BTN, bg: '#b0863b' } },
-						{ id: 'resume-btn', kind: 'button', anchor: 'center', x: 0, y: 100, w: 250, h: 42, z: 1, label: 'Resume', enabled: true, style: { ...STARS_BTN, size: 15, weight: '500', bg: '#3a4150', color: '#e5e9f0' } },
-						{ id: 'quit-btn', kind: 'button', anchor: 'center', x: 0, y: 150, w: 250, h: 42, z: 1, label: 'Quit to free play', enabled: true, style: { ...STARS_BTN, size: 15, weight: '500', bg: '#3a4150', color: '#e5e9f0' } }
+						{ id: 'resume-btn', kind: 'button', anchor: 'center', x: 0, y: 100, w: 250, h: 42, z: 1, label: 'Resume', enabled: true, style: STARS_QUIET },
+						{ id: 'quit-btn', kind: 'button', anchor: 'center', x: 0, y: 150, w: 250, h: 42, z: 1, label: 'Quit to menu', enabled: true, style: STARS_QUIET }
 					]
 				},
 				{
@@ -678,32 +1131,60 @@ const STARS_DEF = {
 					showWhile: 'over',
 					input: 'menu',
 					elements: [
-						{ id: 'over-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 420, h: 250, z: 0, label: '', style: STARS_HUD_PANEL },
-						{ id: 'over-title', kind: 'text', anchor: 'center', x: 0, y: -70, w: 380, h: 40, z: 1, label: 'EVERY STAR LIT', style: { size: 30, weight: '700', color: '#ffd45e', align: 'center' } },
-						{ id: 'final-time', kind: 'text', anchor: 'center', x: 0, y: -18, w: 380, h: 26, z: 1, label: '', style: { size: 16, color: '#e5e9f0', align: 'center' } },
-						{ id: 'again-btn', kind: 'button', anchor: 'center', x: 0, y: 58, w: 220, h: 44, z: 1, label: 'Back to free play', enabled: true, style: STARS_BTN }
+						{ id: 'over-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 460, h: 400, z: 0, label: '', style: STARS_HUD_PANEL },
+						{ id: 'over-title', kind: 'text', anchor: 'center', x: 0, y: -150, w: 420, h: 42, z: 1, label: 'ROUND OVER', style: { size: 30, weight: '700', color: '#ffd45e', align: 'center' } },
+						{ id: 'final-time', kind: 'text', anchor: 'center', x: 0, y: -106, w: 420, h: 26, z: 1, label: '', style: { size: 17, weight: '600', color: '#e5e9f0', align: 'center' } },
+						{ id: 'over-best', kind: 'text', anchor: 'center', x: 0, y: -76, w: 420, h: 22, z: 1, label: '', style: { size: 14, color: '#9ee6ff', align: 'center' } },
+						{ id: 'board-3', kind: 'list', anchor: 'center', x: 0, y: 4, w: 280, h: 116, z: 1, label: '', title: 'Touches', rowsText: '', rows: 5, rowHeight: 18, style: { size: 12, bg: 'rgba(255, 255, 255, 0.05)', radius: 10, pad: 8 } },
+						{ id: 'replay-btn', kind: 'button', anchor: 'center', x: 0, y: 100, w: 240, h: 44, z: 1, label: 'Play again', enabled: true, style: STARS_BTN },
+						{ id: 'again-btn', kind: 'button', anchor: 'center', x: 0, y: 154, w: 240, h: 40, z: 1, label: 'Menu', enabled: true, style: STARS_QUIET }
 					]
 				}
 			]
 		}
 	},
 	objects: [
-		// the room: 12 x 7 x 12, walls you can see through and bounce off
-		{ type: 'box', name: 'Floor', color: 0x101626, size: [12, 0.5, 12], pos: [0, -0.25, 0], roughness: 0.9, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'box', name: 'Ceiling', color: 0x101626, size: [12, 0.5, 12], pos: [0, 7.25, 0], roughness: 0.9, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'box', name: 'Wall north', color: 0x2a3a6a, size: [12.5, 7, 0.5], pos: [0, 3.5, -6], emissive: 0x1a2a5a, emissiveIntensity: 0.5, opacity: 0.12, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'box', name: 'Wall south', color: 0x2a3a6a, size: [12.5, 7, 0.5], pos: [0, 3.5, 6], emissive: 0x1a2a5a, emissiveIntensity: 0.5, opacity: 0.12, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'box', name: 'Wall west', color: 0x2a3a6a, size: [0.5, 7, 12.5], pos: [-6, 3.5, 0], emissive: 0x1a2a5a, emissiveIntensity: 0.5, opacity: 0.12, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'box', name: 'Wall east', color: 0x2a3a6a, size: [0.5, 7, 12.5], pos: [6, 3.5, 0], emissive: 0x1a2a5a, emissiveIntensity: 0.5, opacity: 0.12, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
-		{ type: 'light', name: 'Room light', kind: 'point', color: 0x9fb4ff, intensity: 6, distance: 16, pos: [0, 5.5, 0] },
+		// the room: 12 x 7 x 12 — a glossy deck, a dark ceiling with a light ring, glass walls
+		// you can see (and click) through and bounce off, hung in a glowing frame
+		{ type: 'box', name: 'Floor', color: 0x4a62b8, size: [12, 0.5, 12], pos: [0, -0.25, 0], physical: true, roughness: 0.3, metalness: 0.2, clearcoat: 1, clearcoatRoughness: 0.2, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
+		{ type: 'ring', name: 'Floor ring', color: 0xbfe8ff, r: 4.6, inner: 4.45, pos: [0, 0.01, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0x58c8ff, emissiveIntensity: 2, shadow: false, pick: 'through' },
+		{ type: 'box', name: 'Ceiling', color: 0x1c2656, size: [12, 0.5, 12], pos: [0, 7.25, 0], physical: true, roughness: 0.5, clearcoat: 0.5, physics: { mode: 'static', friction: 0.1, restitution: 0.85 } },
+		{ type: 'torus', name: 'Ceiling ring', color: 0xeaf4ff, r: 2.2, tube: 0.05, pos: [0, 6.9, 0], rot: [-Math.PI / 2, 0, 0], emissive: 0xcfe6ff, emissiveIntensity: 3, shadow: false, pick: 'through' },
+		starsGlass('Wall north', [12.5, 7, 0.5], [0, 3.5, -6]),
+		starsGlass('Wall south', [12.5, 7, 0.5], [0, 3.5, 6]),
+		starsGlass('Wall west', [0.5, 7, 12.5], [-6, 3.5, 0]),
+		starsGlass('Wall east', [0.5, 7, 12.5], [6, 3.5, 0]),
+		starsFrame('Frame NW', 'cylinder', { r: 0.07, h: 7 }, [-6, 3.5, -6]),
+		starsFrame('Frame NE', 'cylinder', { r: 0.07, h: 7 }, [6, 3.5, -6]),
+		starsFrame('Frame SW', 'cylinder', { r: 0.07, h: 7 }, [-6, 3.5, 6]),
+		starsFrame('Frame SE', 'cylinder', { r: 0.07, h: 7 }, [6, 3.5, 6]),
+		starsFrame('Frame top north', 'box', { size: [12.1, 0.1, 0.1] }, [0, 7, -6]),
+		starsFrame('Frame top south', 'box', { size: [12.1, 0.1, 0.1] }, [0, 7, 6]),
+		starsFrame('Frame top west', 'box', { size: [0.1, 0.1, 12.1] }, [-6, 7, 0]),
+		starsFrame('Frame top east', 'box', { size: [0.1, 0.1, 12.1] }, [6, 7, 0]),
+		// the starfield: one continuous emitter flung to a ~20 m shell (speed / drag) that fades
+		// in only once it is out past the glass — the kit's particles, not a texture
+		{
+			type: 'empty', name: 'Starfield', pos: [0, 3.5, 0],
+			particles: {
+				preset: 'sparkles', mode: 'continuous', count: 450, lifetime: 9, lifeJitter: 0.3,
+				shape: 'sphere', radius: 0.5, speed: 60, speedJitter: 0.4, gravity: 0, drag: 3, turbulence: 0,
+				sizeStart: 0.18, sizeEnd: 0.18, colorStart: '#ffffff', colorEnd: '#a8bcff',
+				opacity: 1, fadeIn: 0.3, fadeOut: 0.25, sprite: 'star', blending: 'additive', spin: 0, space: 'local'
+			}
+		},
+		{ type: 'light', name: 'Room light', kind: 'point', color: 0xa8bcff, intensity: 20, distance: 18, pos: [0, 5.5, 0] },
+		{ type: 'light', name: 'Deck glow', kind: 'point', color: 0x7fd4ff, intensity: 4, distance: 9, pos: [0, 0.6, 0] },
 		// the two physical buttons (an onclick fires from a VR ray — the HUD is not in a headset)
-		{ type: 'box', name: 'Start pad', color: 0x3b7dd8, size: [0.6, 0.16, 0.6], pos: [-1, 0.08, -4.8], emissive: 0x1f4f9f, emissiveIntensity: 0.9, roughness: 0.4, physics: { mode: 'static' } },
-		{ type: 'box', name: 'More stars pad', color: 0xb0863b, size: [0.6, 0.16, 0.6], pos: [1, 0.08, -4.8], emissive: 0x7a5a1f, emissiveIntensity: 0.9, roughness: 0.4, physics: { mode: 'static' } },
+		{ type: 'box', name: 'Start pad', color: 0x3b7dd8, size: [0.6, 0.16, 0.6], bevel: 0.04, bevelSegments: 1, pos: [-1, 0.08, -4.8], emissive: 0x2f6fef, emissiveIntensity: 1.4, physical: true, roughness: 0.3, clearcoat: 1, physics: { mode: 'static' } },
+		{ type: 'box', name: 'More stars pad', color: 0xb0863b, size: [0.6, 0.16, 0.6], bevel: 0.04, bevelSegments: 1, pos: [1, 0.08, -4.8], emissive: 0xc07a1f, emissiveIntensity: 1.4, physical: true, roughness: 0.3, clearcoat: 1, physics: { mode: 'static' } },
 		// the stars, two planets for contrast, and the spawner's template under the floor
 		...starObjects(),
-		{ type: 'sphere', name: 'Planet Azure', color: 0x5b7fd6, r: 0.6, pos: [-3, 1.9, 2.2], emissive: 0x1f3f9f, emissiveIntensity: 0.35, roughness: 0.6, physics: { mode: 'dynamic', mass: 2, restitution: 0.7, friction: 0.2 } },
-		{ type: 'sphere', name: 'Planet Ember', color: 0xd68a5b, r: 0.6, pos: [3.2, 2.3, -2.4], emissive: 0x8f3a1a, emissiveIntensity: 0.35, roughness: 0.6, physics: { mode: 'dynamic', mass: 2, restitution: 0.7, friction: 0.2 } },
-		{ type: 'sphere', name: 'Star template', color: 0xffe08a, r: 0.22, pos: [0, -2, 0], emissive: 0xffcf50, emissiveIntensity: 1.2, roughness: 0.4, physics: { mode: 'dynamic', mass: 0.2, restitution: 0.9, friction: 0.1 } }
+		{ type: 'sphere', name: 'Planet Azure', color: 0x5b7fd6, r: 0.6, pos: [-3, 1.9, 2.2], emissive: 0x1f3f9f, emissiveIntensity: 0.4, physical: true, roughness: 0.45, sheen: 0.6, sheenColor: 0x9fc4ff, clearcoat: 0.4, physics: { mode: 'dynamic', mass: 2, restitution: 0.7, friction: 0.2, collider: 'sphere' } },
+		{ type: 'sphere', name: 'Planet Ember', color: 0xd68a5b, r: 0.6, pos: [3.2, 2.3, -2.4], emissive: 0x8f3a1a, emissiveIntensity: 0.4, physical: true, roughness: 0.45, sheen: 0.6, sheenColor: 0xffc49f, clearcoat: 0.4, physics: { mode: 'dynamic', mass: 2, restitution: 0.7, friction: 0.2, collider: 'sphere' } },
+		{ type: 'icosahedron', name: 'Star template', color: 0xffe08a, r: 0.22, pos: [0, -2, 0], emissive: 0xffc040, emissiveIntensity: 1.1, physical: true, roughness: 0.15, clearcoat: 1, flatShading: true, physics: { mode: 'dynamic', mass: 0.2, restitution: 0.9, friction: 0.1, collider: 'sphere' } },
+		// the card: through the south glass, across the lattice, the frame catching the light
+		{ type: 'camera', name: 'Card camera', pos: [9, 5.6, 13], lookAt: [0, 2.4, 0], fov: 46 }
 	]
 };
 
@@ -1162,6 +1643,402 @@ const BEAT_DEF = {
 //                    `thumb.sceneGroups: ['dungeon-module']` to get it onto the card
 //   untangle       — 21-C C7: the thin template (pose + level + room + HUD + graph); its
 //                    board is scene-root content too (`thumb.sceneGroups: ['untangle-module']`)
+// ---- 30 visuals-core: the Jam Room becomes a GAME -----------------------------------
+// It was a sandbox on one dark slab with no HUD: 23-D3's piano into a speaker, the beat lab
+// (transport, drum machine, sampler) and a pedal chain into a mixer, all cabled — built
+// from the modules' own menus, so the devices are always what those modules make. Now it
+// is a small studio (a wooden floor, rugs, plastered walls with acoustic panels, warm
+// lamps, a few props) and a shell: Start = a three-second COUNT-IN, then the goal on
+// screen — keep the band playing for EIGHT BARS.
+//   · WHAT THE GOAL IS BUILT ON: core's Transport node (musicClock's shared transport as a
+//     flow value — beat, bar, bpm, playing, identical on every peer). The music modules
+//     publish nothing to the flow (no notes-played count, no transport control), so the
+//     round cannot START the transport: the HUD says "press ▶ on the Transport", which is
+//     the device's own Play button, clicked with the FREE CURSOR (play.cursor 'free' — you
+//     play instruments with the pointer, no lock). The beat the count-in ends on is kept
+//     with Set Variable (a replicated sample-and-hold), so bars count from THIS round; a
+//     transport restarted mid-round counts from its own zero.
+//   · the SCORE is the tempo you finished at (the Transport's BPM −/+ buttons), saved on
+//     this device as the best with Store Value max — `jam-best-bpm`.
+//   · a device selector cannot be authored here: graphs are restored BEFORE `generate`
+//     makes the devices, so a def-local name cannot reach them (the builder is the kit's
+//     region). Nothing in the shell needs one — the Transport node reads the shared clock.
+const JAM_BARS = 8;
+const JAM_PANEL = { bg: 'rgba(28, 18, 12, 0.9)', radius: 18, border: '1px solid rgba(255, 176, 96, 0.35)' };
+const JAM_BTN = { size: 17, weight: '600', bg: '#d9772b', color: '#ffffff', radius: 10 };
+const JAM_QUIET = { size: 15, weight: '500', bg: '#4a3b32', color: '#f1e6dc', radius: 10 };
+function jamGraph() {
+	const g = graphBuilder();
+	const { N, E } = g;
+	// ---- starting: the Start button, or Play again / Restart after a reset ---------------
+	N('bgo', 'hudbutton', 'Start jam button', 40, 40, { element: 'go-btn' });
+	N('begin', 'delay', 'Begin (0 s)', 280, 40, { seconds: 0, pulse: 0.3 });
+	E('bgo', 'begin', 'trigger');
+	N('goplay', 'setgamestate', 'Start the round', 520, 40, { state: 'playing', outcome: '', reset: false });
+	E('begin', 'goplay', 'trigger');
+	// the count-in: its own screen over the round's HUD for three seconds
+	N('showcount', 'hudscreen', 'Show the count-in', 520, 120, { screen: 'countin', action: 'show' });
+	E('begin', 'showcount', 'trigger');
+	N('countdone', 'delay', 'Count-in: 3 s', 760, 120, { seconds: 3, pulse: 0.3 });
+	E('begin', 'countdone', 'trigger');
+	N('hidecount', 'hudscreen', 'Hide the count-in', 1000, 120, { screen: 'countin', action: 'hide' });
+	E('countdone', 'hidecount', 'trigger');
+	N('elapsed', 'gametime', 'Round time', 40, 200, { read: 'elapsed', length: 600 });
+	N('countval', 'math', '3.49 - time', 280, 200, { op: 'sub', a: 3.49, b: 0 });
+	E('elapsed', 'countval', 'b');
+	N('hcount', 'hudtext', 'HUD count', 520, 200, { element: 'count-read', format: '{v}', decimals: 0, value: 3 });
+	E('countval', 'hcount', 'value');
+	// ---- the transport, as numbers --------------------------------------------------------
+	N('tbeat', 'transportbeat', 'Transport beat', 40, 320, { read: 'beat' });
+	N('tbpm', 'transportbeat', 'Transport BPM', 40, 400, { read: 'bpm' });
+	N('tplaying', 'transportbeat', 'Transport playing', 40, 480, { read: 'playing' });
+	// the beat the count-in ended on: a replicated sample-and-hold
+	N('keepstart', 'setvariable', 'Remember the start beat', 1240, 120, { name: 'jamStartBeat', value: 0, op: 'set', scope: 'shared' });
+	E('countdone', 'keepstart', 'trigger');
+	E('tbeat', 'keepstart', 'value');
+	N('startbeat', 'getvariable', 'Start beat', 280, 320, { name: 'jamStartBeat', fallback: 0 });
+	N('since', 'math', 'Beats since the start', 520, 320, { op: 'sub', a: 0, b: 0 });
+	E('tbeat', 'since', 'a');
+	E('startbeat', 'since', 'b');
+	N('restarted', 'compare', 'Transport restarted?', 520, 400, { op: 'lt', a: 0, b: 0 });
+	E('tbeat', 'restarted', 'a');
+	E('startbeat', 'restarted', 'b');
+	N('beats', 'select', 'Beats this round', 760, 360, { index: 0, a: 0, b: 0 });
+	E('restarted', 'beats', 'index');
+	E('since', 'beats', 'a');
+	E('tbeat', 'beats', 'b');
+	N('bars', 'math', 'Bars (÷ 4)', 1000, 360, { op: 'div', a: 0, b: 4 });
+	E('beats', 'bars', 'a');
+	// shown as COMPLETED bars: round(x - 0.5) is floor(x) for the readout
+	N('barsfloor', 'math', 'Bars − 0.5', 1240, 320, { op: 'sub', a: 0, b: 0.5 });
+	E('bars', 'barsfloor', 'a');
+	N('barsshown', 'math', 'Not below 0', 1480, 320, { op: 'max', a: 0, b: 0 });
+	E('barsfloor', 'barsshown', 'a');
+	N('hbars', 'hudtext', 'HUD bars', 1720, 320, { element: 'bars-read', format: 'Bar {v} / ' + JAM_BARS, decimals: 0, value: 0 });
+	E('barsshown', 'hbars', 'value');
+	N('hbarbar', 'hudbar', 'HUD progress', 1720, 400, { element: 'bars-bar', min: 0, max: JAM_BARS, value: 0, format: '' });
+	E('bars', 'hbarbar', 'value');
+	N('beatmod', 'math', 'Beat in the bar', 280, 560, { op: 'mod', a: 0, b: 4 });
+	E('tbeat', 'beatmod', 'a');
+	N('beatshown', 'math', '+ 0.5 (1..4)', 520, 560, { op: 'add', a: 0, b: 0.5 });
+	E('beatmod', 'beatshown', 'a');
+	N('hbeat', 'hudtext', 'HUD beat', 760, 560, { element: 'beat-read', format: 'Beat {v}', decimals: 0, value: 0 });
+	E('beatshown', 'hbeat', 'value');
+	N('hintpick', 'select', 'Hint', 280, 640, { index: 0, a: 'Press ▶ on the Transport to start the beat', b: 'Keep the band going  ·  {v} BPM' });
+	E('tplaying', 'hintpick', 'index');
+	N('hhint', 'hudtext', 'HUD hint', 520, 640, { element: 'jam-hint', format: 'Press ▶ on the Transport to start the beat', decimals: 0, value: 0 });
+	E('hintpick', 'hhint', 'format');
+	E('tbpm', 'hhint', 'value');
+	// ---- the goal: eight bars, with the transport running, after the count-in -------------
+	N('enough', 'compare', JAM_BARS + ' bars?', 1240, 440, { op: 'gte', a: 0, b: JAM_BARS });
+	E('bars', 'enough', 'a');
+	N('pastcount', 'compare', 'Count-in over?', 280, 720, { op: 'gte', a: 0, b: 3.2 });
+	E('elapsed', 'pastcount', 'a');
+	N('isplaying', 'gametime', 'Round on', 40, 720, { read: 'playing', length: 600 });
+	N('g1', 'gate', 'Bars & transport', 1480, 440, { op: 'and', a: false, b: false });
+	E('enough', 'g1', 'a');
+	E('tplaying', 'g1', 'b');
+	N('g2', 'gate', 'Round on & counted in', 520, 720, { op: 'and', a: false, b: false });
+	E('isplaying', 'g2', 'a');
+	E('pastcount', 'g2', 'b');
+	N('g3', 'gate', 'Session complete?', 1720, 480, { op: 'and', a: false, b: false });
+	E('g1', 'g3', 'a');
+	E('g2', 'g3', 'b');
+	N('allwin', 'allplayers', 'Everyone agrees', 1960, 480, { pulse: 0.3 });
+	E('g3', 'allwin', 'condition');
+	N('gowin', 'setgamestate', 'Session complete', 2200, 480, { state: 'over', outcome: 'Session complete!', reset: false });
+	E('allwin', 'gowin', 'trigger');
+	// ---- the score: the tempo you finished at, the best kept on this device --------------
+	N('storebest', 'storevalue', 'Save best tempo', 2200, 560, { key: 'jam-best-bpm', mode: 'max', value: 0 });
+	N('storelast', 'storevalue', 'Save this tempo', 2200, 640, { key: 'jam-last-bpm', mode: 'set', value: 0 });
+	E('allwin', 'storebest', 'trigger');
+	E('allwin', 'storelast', 'trigger');
+	E('tbpm', 'storebest', 'value');
+	E('tbpm', 'storelast', 'value');
+	N('storedbest', 'storedvalue', 'Best tempo', 2440, 560, { key: 'jam-best-bpm', output: 'number', fallback: 0 });
+	N('storedlast', 'storedvalue', 'This tempo', 2440, 640, { key: 'jam-last-bpm', output: 'number', fallback: 0 });
+	N('hbest', 'hudtext', 'HUD best (start)', 2680, 560, { element: 'best-read', format: 'Your best tempo: {v} BPM', decimals: 0, value: 0 });
+	E('storedbest', 'hbest', 'value');
+	N('hbest2', 'hudtext', 'HUD best (over)', 2680, 640, { element: 'over-best', format: 'Your best tempo: {v} BPM', decimals: 0, value: 0 });
+	E('storedbest', 'hbest2', 'value');
+	N('hlast', 'hudtext', 'HUD this tempo', 2680, 720, { element: 'over-line', format: JAM_BARS + ' bars at {v} BPM', decimals: 0, value: 0 });
+	E('storedlast', 'hlast', 'value');
+	// ---- the P menu and Round over: Resume / Restart / Play again / Quit -----------------
+	N('pkey', 'keypress', 'Press P', 40, 880, { code: 'KeyP', edge: 'down', pulse: 0.3 });
+	N('pausetoggle', 'hudscreen', 'Toggle menu', 280, 880, { screen: 'pause', action: 'toggle' });
+	E('pkey', 'pausetoggle', 'trigger');
+	N('bresume', 'hudbutton', 'Resume button', 40, 960, { element: 'resume-btn' });
+	N('resumehide', 'hudscreen', 'Close menu', 280, 960, { screen: 'pause', action: 'hide' });
+	E('bresume', 'resumehide', 'trigger');
+	N('brestart', 'hudbutton', 'Restart button', 40, 1040, { element: 'restart-btn' });
+	N('breplay', 'hudbutton', 'Play again button', 40, 1120, { element: 'replay-btn' });
+	N('restartreset', 'setgamestate', 'Restart: to menu', 280, 1080, { state: 'menu', outcome: '', reset: true });
+	N('restarthide', 'hudscreen', 'Close menu on restart', 520, 1040, { screen: 'pause', action: 'hide' });
+	N('restartdelay', 'delay', 'Restart: wait', 520, 1120, { seconds: 0.2, pulse: 0.3 });
+	for (const b of ['brestart', 'breplay']) {
+		E(b, 'restartreset', 'trigger');
+		E(b, 'restartdelay', 'trigger');
+	}
+	E('brestart', 'restarthide', 'trigger');
+	E('restartdelay', 'begin', 'trigger');
+	N('bquit', 'hudbutton', 'Quit to menu button', 40, 1200, { element: 'quit-btn' });
+	N('bmenu', 'hudbutton', 'Menu button (over)', 40, 1280, { element: 'again-btn' });
+	N('doquit', 'setgamestate', 'Quit to menu', 280, 1240, { state: 'menu', outcome: '', reset: true });
+	N('quithide', 'hudscreen', 'Close menu on quit', 520, 1240, { screen: 'pause', action: 'hide' });
+	E('bquit', 'doquit', 'trigger');
+	E('bmenu', 'doquit', 'trigger');
+	E('bquit', 'quithide', 'trigger');
+
+	// ---- 30b: the shell sounds like a game — but never plays music over the band. The end
+	// of a session is confetti, the fanfare and a buzz; its words are the Session complete
+	// panel (a banner over the panel read twice) -----------------------------------------------
+	N('click', 'gamesound', 'Button click', 280, 1360, { sound: 'click' });
+	for (const b of ['bgo', 'bresume', 'brestart', 'breplay', 'bquit', 'bmenu']) E(b, 'click', 'trigger');
+	N('saygo', 'announce', 'Say: go', 1000, 40, { text: 'Go!', sub: 'Press ▶ on the Transport — keep it going for ' + JAM_BARS + ' bars', seconds: 2, color: '#ffb060', decimals: 0 });
+	E('countdone', 'saygo', 'trigger');
+	N('donefx', 'effectburst', 'Confetti', 2440, 400, { kind: 'confetti', count: 96, lift: 0, color: '' });
+	E('allwin', 'donefx', 'trigger');
+	N('donesnd', 'gamesound', 'Fanfare', 2680, 400, { sound: 'levelup' });
+	E('allwin', 'donesnd', 'trigger');
+	N('donebuzz', 'hapticpulse', 'Buzz: done', 2680, 480, { pattern: 'success', hand: 'both' });
+	E('allwin', 'donebuzz', 'trigger');
+	return g.done();
+}
+/** 30b: where a VR player stands in the Jam Room — the middle of the cockpit (feet) */
+const JAM_SPAWN = [1.0, 0, -1.0];
+/** 30b: a stand/desk under a device: a top slab and two end panels, dark wood, select-through
+ * @param {string} name @param {number[]} at the floor centre @param {number[]} size [w, top height, d] */
+const jamStand = (name, at, size) => {
+	const [w, h, d] = size;
+	const wood = { color: 0x3a2618, physical: true, roughness: 0.55, clearcoat: 0.3, pick: 'through' };
+	const alongX = w >= d;
+	return [
+		{ type: 'box', name: name, size: [w, 0.05, d], pos: [at[0], h - 0.025, at[2]], bevel: 0.015, bevelSegments: 1, ...wood },
+		{ type: 'box', name: name + ' end A', size: alongX ? [0.05, h - 0.05, d * 0.9] : [w * 0.9, h - 0.05, 0.05], pos: alongX ? [at[0] - w / 2 + 0.06, (h - 0.05) / 2, at[2]] : [at[0], (h - 0.05) / 2, at[2] - d / 2 + 0.06], ...wood },
+		{ type: 'box', name: name + ' end B', size: alongX ? [0.05, h - 0.05, d * 0.9] : [w * 0.9, h - 0.05, 0.05], pos: alongX ? [at[0] + w / 2 - 0.06, (h - 0.05) / 2, at[2]] : [at[0], (h - 0.05) / 2, at[2] + d / 2 - 0.06], ...wood }
+	];
+};
+/** a warm lamp: a pole, a glowing shade and its light, as ONE group
+ * @param {string} name @param {number[]} pos */
+const jamLamp = (name, pos) => ({
+	type: 'group', name, pos,
+	children: [
+		{ type: 'cylinder', name: name + ' base', color: 0x2b2420, r: 0.18, r2: 0.2, h: 0.04, pos: [0, 0.02, 0], physical: true, metalness: 0.6, roughness: 0.35 },
+		{ type: 'cylinder', name: name + ' pole', color: 0x2b2420, r: 0.02, h: 1.5, pos: [0, 0.77, 0], physical: true, metalness: 0.6, roughness: 0.35 },
+		{ type: 'cylinder', name: name + ' shade', color: 0xffe2b8, r: 0.16, r2: 0.26, h: 0.3, pos: [0, 1.6, 0], emissive: 0xffb060, emissiveIntensity: 1.6, side: 'double', shadow: false },
+		{ type: 'light', name: name + ' light', kind: 'point', color: 0xffb070, intensity: 8, distance: 9, pos: [0, 1.5, 0] }
+	]
+});
+const JAM_DEF = {
+	kind: 'game',
+	slug: 'jam-room',
+	title: 'Jam Room',
+	description:
+		'A small studio: a piano into a speaker, a beat lab (transport, drum machine, sampler pads) and a pedal chain into a mixer — all cabled. Press Start, then ▶ on the Transport, and keep the band going for eight bars. Play with the mouse; your best tempo is saved.',
+	license: 'CC0-1.0',
+	author: 'theprototype',
+	tags: ['music', 'vr'],
+	installModules: ['music-lab', 'music-fx'],
+	modules: [{ id: 'music-lab', version: '0.2.1' }, { id: 'music-fx', version: '0.2.0' }],
+	// warm, indoor, readable: a dark wood gradient behind the open front, a warm hemisphere,
+	// a soft key light, and the lamps doing the rest
+	env: {
+		preset: 'custom',
+		base: 'studio',
+		exposure: 1.25,
+		background: { top: '#1a120d', bottom: '#3a2a20' },
+		fog: null,
+		ground: { color: '#2a211c', roughness: 0.95 },
+		hemi: { sky: '#ffdcb8', ground: '#7a5a42', intensity: 1.8 },
+		sun: { color: '#ffe2c0', intensity: 1.6, dir: [0.4, 1, 0.7] }
+	},
+	// no simulation (nothing here has a body); a FREE cursor, because you play the
+	// instruments by pointing at them — no pointer lock, the real cursor clicks keys and pads.
+	// 30b: a VR-ONLY spawn INSIDE the band (see JAM_SPAWN): the headset stands at the
+	// cockpit, where the controller tip reaches the piano, the drums, the sampler, the
+	// transport and the mixer; a desktop keeps the overview it always had (a level eye at the
+	// cockpit would see only the piano).
+	physics: { play: { cursor: 'free', simOnPlay: false, spawn: { position: JAM_SPAWN, yaw: 0, vrOnly: true } } },
+	// 30b: NO Game Music node, on purpose — the room IS the music (the transport, the drums and
+	// the piano are what you hear), so a procedural `studio` loop would only fight the band.
+	post: {
+		enabled: true,
+		effects: [
+			{ id: 'ao', kind: 'ao', enabled: true, params: {} },
+			{ id: 'tone', kind: 'tonemapping', enabled: true, params: { mode: 'AGX' } },
+			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: 0.6, luminanceThreshold: 0.8 } },
+			{ id: 'vig', kind: 'vignette', enabled: true, params: {} },
+			{ id: 'aa', kind: 'smaa', enabled: true, params: {} }
+		],
+		changedAt: 0
+	},
+	// inside the room, a step back from the band: Play starts from the editor camera's spot
+	view: { pos: [1.0, 2.5, 2.2], target: [1.0, 0.7, -1.4] },
+	thumb: { camera: 'Card camera' },
+	graphs: { scene: jamGraph() },
+	hud: {
+		scene: {
+			active: '',
+			changedAt: 0,
+			screens: [
+				{
+					id: 'start',
+					name: 'Start',
+					showWhile: 'menu',
+					input: 'menu',
+					elements: [
+						{ id: 'start-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 480, h: 360, z: 0, label: '', style: JAM_PANEL },
+						{ id: 'start-title', kind: 'text', anchor: 'center', x: 0, y: -125, w: 420, h: 48, z: 1, label: 'JAM ROOM', style: { size: 38, weight: '700', color: '#ffb060', align: 'center' } },
+						// 30b: HOW TO PLAY
+						{ id: 'howto-title', kind: 'text', anchor: 'center', x: 0, y: -94, w: 420, h: 18, z: 1, label: 'HOW TO PLAY', style: { size: 12, weight: '700', color: '#ffd9a8', align: 'center' } },
+						{ id: 'start-sub', kind: 'text', anchor: 'center', x: 0, y: -62, w: 440, h: 44, z: 1, label: 'Press Start, then ▶ on the Transport, and keep the band going for eight bars. Play the piano, the drum grid and the pads on top of it.', style: { size: 14, color: '#f1e6dc', align: 'center' }, wrap: true },
+						{ id: 'best-read', kind: 'text', anchor: 'center', x: 0, y: -18, w: 420, h: 24, z: 1, label: 'Your best tempo: 0 BPM', style: { size: 15, weight: '600', color: '#ffd9a8', align: 'center' } },
+						{ id: 'go-btn', kind: 'button', anchor: 'center', x: 0, y: 40, w: 240, h: 50, z: 1, label: 'Start jam', enabled: true, style: JAM_BTN },
+						{ id: 'start-hint', kind: 'text', anchor: 'center', x: 0, y: 108, w: 440, h: 22, z: 1, label: 'Click keys, pads and the drum grid  ·  BPM −/+ on the Transport  ·  P: menu', style: { size: 12, color: '#b8a594', align: 'center' }, wrap: true },
+						{ id: 'start-hint-vr', kind: 'text', anchor: 'center', x: 0, y: 136, w: 440, h: 22, z: 1, label: 'VR: hold the trigger and sweep across keys and pads  ·  Y: Edit mode', style: { size: 12, color: '#b8a594', align: 'center' }, wrap: true }
+					]
+				},
+				{
+					id: 'countin',
+					name: 'Count-in',
+					input: 'game',
+					elements: [
+						{ id: 'count-read', kind: 'text', anchor: 'center', x: 0, y: -30, w: 200, h: 120, z: 1, label: '3', style: { size: 96, weight: '700', color: '#ffb060', align: 'center' } },
+						{ id: 'count-sub', kind: 'text', anchor: 'center', x: 0, y: 50, w: 420, h: 30, z: 1, label: 'Get ready…', style: { size: 20, weight: '600', color: '#f1e6dc', align: 'center' } }
+					]
+				},
+				{
+					id: 'hud',
+					name: 'Jam',
+					showWhile: 'playing',
+					input: 'game',
+					elements: [
+						{ id: 'bars-read', kind: 'text', anchor: 'top-center', x: 0, y: 14, w: 280, h: 30, z: 1, label: 'Bar 0 / ' + JAM_BARS, style: { size: 20, weight: '700', color: '#ffffff', align: 'center' } },
+						{ id: 'bars-bar', kind: 'bar', anchor: 'top-center', x: 0, y: 50, w: 260, h: 10, z: 1, label: '', min: 0, max: JAM_BARS, value: 0, orientation: 'horizontal', style: { color: '#ffb060', bg: 'rgba(255, 255, 255, 0.15)', radius: 5 } },
+						{ id: 'beat-read', kind: 'text', anchor: 'top-right', x: 18, y: 14, w: 160, h: 26, z: 1, label: '', style: { size: 16, weight: '600', color: '#ffd9a8', align: 'right' } },
+						{ id: 'jam-hint', kind: 'text', anchor: 'bottom-center', x: 0, y: 70, w: 560, h: 24, z: 1, label: '', style: { size: 14, weight: '600', color: '#f1e6dc', align: 'center' } }
+					]
+				},
+				{
+					id: 'pause',
+					name: 'Menu',
+					input: 'menu',
+					elements: [
+						{ id: 'pause-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 380, h: 300, z: 0, label: '', style: JAM_PANEL },
+						{ id: 'pause-title', kind: 'text', anchor: 'center', x: 0, y: -95, w: 340, h: 36, z: 1, label: 'PAUSED', style: { size: 26, weight: '700', color: '#f1e6dc', align: 'center' } },
+						{ id: 'resume-btn', kind: 'button', anchor: 'center', x: 0, y: -30, w: 240, h: 42, z: 1, label: 'Resume', enabled: true, style: { ...JAM_BTN, size: 16 } },
+						{ id: 'restart-btn', kind: 'button', anchor: 'center', x: 0, y: 22, w: 240, h: 42, z: 1, label: 'Restart', enabled: true, style: { ...JAM_BTN, size: 16, bg: '#4c9e6a' } },
+						{ id: 'quit-btn', kind: 'button', anchor: 'center', x: 0, y: 74, w: 240, h: 42, z: 1, label: 'Quit to menu', enabled: true, style: JAM_QUIET }
+					]
+				},
+				{
+					id: 'over',
+					name: 'Session complete',
+					showWhile: 'over',
+					input: 'menu',
+					elements: [
+						{ id: 'over-panel', kind: 'panel', anchor: 'center', x: 0, y: 0, w: 440, h: 300, z: 0, label: '', style: JAM_PANEL },
+						{ id: 'over-title', kind: 'text', anchor: 'center', x: 0, y: -100, w: 400, h: 40, z: 1, label: 'SESSION COMPLETE', style: { size: 30, weight: '700', color: '#ffb060', align: 'center' } },
+						{ id: 'over-line', kind: 'text', anchor: 'center', x: 0, y: -54, w: 400, h: 28, z: 1, label: '', style: { size: 18, weight: '600', color: '#f1e6dc', align: 'center' } },
+						{ id: 'over-best', kind: 'text', anchor: 'center', x: 0, y: -22, w: 400, h: 22, z: 1, label: '', style: { size: 14, color: '#ffd9a8', align: 'center' } },
+						{ id: 'replay-btn', kind: 'button', anchor: 'center', x: 0, y: 40, w: 240, h: 46, z: 1, label: 'Play again', enabled: true, style: JAM_BTN },
+						{ id: 'again-btn', kind: 'button', anchor: 'center', x: 0, y: 96, w: 240, h: 42, z: 1, label: 'Menu', enabled: true, style: JAM_QUIET }
+					]
+				}
+			]
+		}
+	},
+	objects: [
+		// the studio: a warm wooden floor (the devices sit on it at y 0), two rugs, plastered
+		// walls on three sides with acoustic panels — select-through, they are the room's shell
+		{ type: 'box', name: 'Floor', color: 0xb07a4a, size: [12, 0.3, 10], pos: [1.1, -0.15, -1.8], physical: true, roughness: 0.55, clearcoat: 0.35, clearcoatRoughness: 0.4 },
+		{ type: 'box', name: 'Rug', color: 0x7a2330, size: [5.4, 0.02, 3.4], pos: [0.9, 0.012, -2.7], physical: true, roughness: 0.95, sheen: 0.8, sheenColor: 0xd4606e, sheenRoughness: 0.7 },
+		{ type: 'cylinder', name: 'Round rug', color: 0x2f4d5a, r: 1.9, h: 0.02, pos: [3.6, 0.012, -0.9], physical: true, roughness: 0.95, sheen: 0.8, sheenColor: 0x7fb4c8, sheenRoughness: 0.7 },
+		{ type: 'box', name: 'Back wall', color: 0xe6cbaa, size: [12, 3.4, 0.2], pos: [1.1, 1.7, -6.8], roughness: 0.9, pick: 'through' },
+		{ type: 'box', name: 'Left wall', color: 0xdcbf9e, size: [0.2, 3.4, 10], pos: [-4.9, 1.7, -1.8], roughness: 0.9, pick: 'through' },
+		{ type: 'box', name: 'Right wall', color: 0xdcbf9e, size: [0.2, 3.4, 10], pos: [7.1, 1.7, -1.8], roughness: 0.9, pick: 'through' },
+		// a ceiling that casts no shadow (the key light comes from above), so the room reads as a
+		// room from the player's eye while the open front keeps the editor's view in
+		{ type: 'box', name: 'Ceiling', color: 0xf0dcc4, size: [12, 0.12, 10], pos: [1.1, 3.46, -1.8], roughness: 0.9, emissive: 0x8a6a50, emissiveIntensity: 0.9, shadow: false, pick: 'through' },
+		{ type: 'cylinder', name: 'Ceiling light 1', color: 0xfff2dc, r: 0.4, h: 0.04, pos: [-1.2, 3.38, -2.6], emissive: 0xffd8a8, emissiveIntensity: 3, shadow: false, pick: 'through' },
+		{ type: 'cylinder', name: 'Ceiling light 2', color: 0xfff2dc, r: 0.4, h: 0.04, pos: [3.2, 3.38, -2.6], emissive: 0xffd8a8, emissiveIntensity: 3, shadow: false, pick: 'through' },
+		{ type: 'box', name: 'Skirting', color: 0x3a2a20, size: [12, 0.14, 0.04], pos: [1.1, 0.07, -6.68], roughness: 0.6 },
+		// acoustic panels: fabric (sheen) in two colours, on the back wall behind the band
+		{ type: 'box', name: 'Panel 1', color: 0x2d4a52, size: [1.2, 1.5, 0.08], bevel: 0.03, bevelSegments: 1, pos: [-2.6, 1.8, -6.64], physical: true, roughness: 0.95, sheen: 0.7, sheenColor: 0x6fa0ac, pick: 'through' },
+		{ type: 'box', name: 'Panel 2', color: 0x8a3a2a, size: [1.2, 1.5, 0.08], bevel: 0.03, bevelSegments: 1, pos: [-0.9, 1.8, -6.64], physical: true, roughness: 0.95, sheen: 0.7, sheenColor: 0xd08a70, pick: 'through' },
+		{ type: 'box', name: 'Panel 3', color: 0x2d4a52, size: [1.2, 1.5, 0.08], bevel: 0.03, bevelSegments: 1, pos: [0.8, 1.8, -6.64], physical: true, roughness: 0.95, sheen: 0.7, sheenColor: 0x6fa0ac, pick: 'through' },
+		{ type: 'box', name: 'Panel 4', color: 0x8a3a2a, size: [1.2, 1.5, 0.08], bevel: 0.03, bevelSegments: 1, pos: [2.5, 1.8, -6.64], physical: true, roughness: 0.95, sheen: 0.7, sheenColor: 0xd08a70, pick: 'through' },
+		{ type: 'box', name: 'Panel 5', color: 0x2d4a52, size: [1.2, 1.5, 0.08], bevel: 0.03, bevelSegments: 1, pos: [4.2, 1.8, -6.64], physical: true, roughness: 0.95, sheen: 0.7, sheenColor: 0x6fa0ac, pick: 'through' },
+		// warm light: two floor lamps and a spot on the beat lab
+		jamLamp('Lamp left', [-4.1, 0, -5.4]),
+		jamLamp('Lamp right', [6.3, 0, -5.4]),
+		{ type: 'light', name: 'Stage spot', kind: 'spot', color: 0xffd9a8, intensity: 60, angle: 0.7, penumbra: 0.6, distance: 14, pos: [1, 5.2, 1.5], target: [1.0, 0.6, -1.3] },
+		// props: an amp stack, a plant, a stool
+		{
+			type: 'group', name: 'Amp', pos: [-3.6, 0, -3.4], rot: [0, 0.5, 0],
+			children: [
+				{ type: 'box', name: 'Amp cabinet', color: 0x1e1a18, size: [0.9, 0.9, 0.5], bevel: 0.04, bevelSegments: 1, pos: [0, 0.45, 0], physical: true, roughness: 0.7, clearcoat: 0.2 },
+				{ type: 'plane', name: 'Amp grille', color: 0x4a403a, size: [0.76, 0.56], pos: [0, 0.38, 0.252], roughness: 1 },
+				{ type: 'box', name: 'Amp head', color: 0x2a2420, size: [0.9, 0.24, 0.46], bevel: 0.03, bevelSegments: 1, pos: [0, 1.02, 0], physical: true, roughness: 0.6, clearcoat: 0.3 },
+				{ type: 'box', name: 'Amp light', color: 0xffc07a, size: [0.5, 0.03, 0.01], pos: [0, 1.03, 0.235], emissive: 0xffa040, emissiveIntensity: 2.5, shadow: false }
+			]
+		},
+		{
+			type: 'group', name: 'Plant', pos: [6.2, 0, -3.2],
+			children: [
+				{ type: 'cylinder', name: 'Pot', color: 0xb8674a, r: 0.26, r2: 0.2, h: 0.46, pos: [0, 0.23, 0], physical: true, roughness: 0.8, clearcoat: 0.2 },
+				{ type: 'icosahedron', name: 'Leaves', color: 0x3f7a3a, r: 0.5, detail: 1, pos: [0, 0.86, 0], roughness: 0.8, flatShading: true },
+				{ type: 'icosahedron', name: 'Leaves top', color: 0x4d8f45, r: 0.34, detail: 1, pos: [0.08, 1.3, 0.04], roughness: 0.8, flatShading: true }
+			]
+		},
+		{
+			type: 'group', name: 'Stool', pos: [-1.9, 0, -0.8],
+			children: [
+				{ type: 'cylinder', name: 'Stool seat', color: 0x6a3f22, r: 0.24, h: 0.06, pos: [0, 0.62, 0], physical: true, roughness: 0.5, clearcoat: 0.4 },
+				{ type: 'cylinder', name: 'Stool leg', color: 0x2b2420, r: 0.03, h: 0.6, pos: [0, 0.3, 0], physical: true, metalness: 0.6, roughness: 0.35 },
+				{ type: 'cylinder', name: 'Stool foot', color: 0x2b2420, r: 0.2, h: 0.03, pos: [0, 0.015, 0], physical: true, metalness: 0.6, roughness: 0.35 }
+			]
+		},
+		// 30b: the cockpit's furniture — what the devices stand on, at hand height. Select-
+		// through, so a press or the laser always reaches the device on top.
+		...jamStand('Keyboard stand', [1.0, 0, -2.0], [1.84, 0.74, 1.0]),
+		...jamStand('Drum desk', [0.1, 0, -0.85], [0.72, 0.78, 1.12]),
+		...jamStand('Right desk', [1.75, 0, -0.85], [0.56, 0.78, 1.2]),
+		...jamStand('Pedal board', [2.65, 0, -0.9], [0.36, 0.46, 1.9]),
+		// the speakers stand above the keys, so the laser (and the sound) clears the piano
+		...jamStand('Speaker stand left', [0.1, 0, -3.1], [0.44, 0.75, 0.44]),
+		...jamStand('Speaker stand right', [1.9, 0, -3.1], [0.44, 0.75, 0.44]),
+		{ type: 'camera', name: 'Card camera', pos: [4.2, 2.6, 2.6], lookAt: [1.0, 0.7, -1.3], fov: 55 }
+	],
+	// 30b: THE COCKPIT — a U of stands around the VR spawn (JAM_SPAWN, facing -Z): the piano
+	// straight ahead with its keys at hand height, the drum machine on the left desk, the
+	// sampler and the mixer on the right desk, the transport on its stand behind-left, all
+	// turned to face the player; the pedal chain on its board beyond the right desk and the
+	// two speakers on stands behind the piano, both in the laser's reach and line of sight. (30's
+	// semicircle faced a desktop view: in VR the piano sat on the FLOOR and the drums were
+	// two metres from anyone.) Each yaw turns the device's player side (+Z; the transport's
+	// panel is on -Z) toward the spawn.
+	layout: [
+		{ kind: 'mod-music-lab-piano', pos: [1.0, 0.8, -2.0], yaw: 0 },
+		{ kind: 'mod-music-lab-drums', pos: [0.1, 0.85, -0.85], yaw: Math.PI / 2 },
+		{ kind: 'mod-music-lab-transport', pos: [0.7, 0.5, -0.2], yaw: Math.atan2(-0.3, 0.8) },
+		{ kind: 'mod-music-lab-sampler', pos: [1.75, 0.85, -1.17], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-fx-mixer', pos: [1.75, 0.85, -0.6], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-lab-speaker', index: 0, pos: [0.1, 1.1, -3.1], yaw: Math.PI },
+		{ kind: 'mod-music-lab-speaker', index: 1, pos: [1.9, 1.1, -3.1], yaw: Math.PI },
+		{ kind: 'mod-music-fx-filter', pos: [2.65, 0.5, -1.7], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-fx-distortion', pos: [2.65, 0.5, -1.3], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-fx-bitcrush', pos: [2.65, 0.5, -0.9], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-fx-delay', pos: [2.65, 0.5, -0.5], yaw: -Math.PI / 2 },
+		{ kind: 'mod-music-fx-reverb', pos: [2.65, 0.5, -0.1], yaw: -Math.PI / 2 }
+	],
+	generate: [
+		{ menu: 'Music Lab: piano + speaker', moduleId: 'music-lab', waitMs: 1500 },
+		{ menu: 'Music Lab: beat lab', moduleId: 'music-lab', waitMs: 1500 },
+		{ menu: 'Music FX: demo chain', moduleId: 'music-fx', waitMs: 2000 }
+	]
+};
+
 const MODULE_DEFS = ['football', 'dungeon-realms', 'untangle', 'waves'];
 
 const DEFS = [
@@ -1268,55 +2145,35 @@ const DEFS = [
 			{ type: 'box', name: 'Jetty', color: 0x8a6f52, size: [1.2, 0.25, 5], pos: [-1.5, 0.12, 8.5] }
 		]
 	},
-	{
-		// 23-D3: the Jam Room - the fastest answer to "what is this app": a piano into a
-		// speaker, the beat lab (transport, drum machine, sampler pads), a pedal chain into a
-		// mixer, all cabled. Built from the modules' own menus, so the template is always what
-		// those modules make; the modules it needs ride the index row AND the payload (the
-		// device-kind requirement signal derives them from the objects).
-		kind: 'game',
-		slug: 'jam-room',
-		title: 'Jam Room',
-		description: 'A piano into a speaker, a beat lab (transport, drum machine, sampler pads) and a pedal chain into a mixer - all cabled. Press Play on the transport, paint the grid, plug things in.',
-		license: 'CC0-1.0',
-		author: 'theprototype',
-		tags: ['music', 'vr'],
-		installModules: ['music-lab', 'music-fx'],
-		modules: [{ id: 'music-lab', version: '0.2.0' }, { id: 'music-fx', version: '0.1.0' }],
-		objects: [{ type: 'box', name: 'Floor', color: 0x2b2f36, size: [9, 0.3, 7], pos: [1.2, -0.15, -2.4] }],
-		// a semicircle facing the spawn at the origin; both speakers turned to face the listener
-		layout: [
-			{ kind: 'mod-music-lab-transport', pos: [-2.6, 0.5, -1.8] },
-			{ kind: 'mod-music-lab-piano', pos: [-1.3, 0, -2.4] },
-			{ kind: 'mod-music-lab-drums', pos: [0.3, 0.8, -2.8] },
-			{ kind: 'mod-music-lab-sampler', pos: [1.5, 0.8, -2.8] },
-			{ kind: 'mod-music-lab-speaker', index: 0, pos: [-1.0, 0.35, -4.4], yaw: Math.PI },
-			{ kind: 'mod-music-lab-speaker', index: 1, pos: [1.6, 0.35, -4.4], yaw: Math.PI },
-			{ kind: 'mod-music-fx-mixer', pos: [3.2, 0.8, -2.6] },
-			{ kind: 'mod-music-fx-filter', pos: [2.4, 0.5, -0.9] },
-			{ kind: 'mod-music-fx-distortion', pos: [3.0, 0.5, -0.9] },
-			{ kind: 'mod-music-fx-bitcrush', pos: [3.6, 0.5, -0.9] },
-			{ kind: 'mod-music-fx-delay', pos: [4.2, 0.5, -0.9] },
-			{ kind: 'mod-music-fx-reverb', pos: [4.8, 0.5, -0.9] }
-		],
-		generate: [
-			{ menu: 'Music Lab: piano + speaker', moduleId: 'music-lab', waitMs: 1500 },
-			{ menu: 'Music Lab: beat lab', moduleId: 'music-lab', waitMs: 1500 },
-			{ menu: 'Music FX: demo chain', moduleId: 'music-fx', waitMs: 2000 }
-		]
-	},
+	// 23-D3's Jam Room, a game since 30 visuals-core (JAM_DEF above)
+	JAM_DEF,
 	TOWERS_DEF,
 	STARS_DEF,
 	MIRROR_DEF,
 	BEAT_DEF,
 	// the def is the module's (see moduleDef); a checkout without it cannot author it
-	...MODULE_DEFS.map((id) => moduleDef(id) ?? { slug: id, missingModuleDef: true })
+	...MODULE_DEFS.map((id) => moduleDef(id) ?? { slug: id, missingModuleDef: true }),
+	// 30c level design: three walkable GENERAL templates built from the kits (seed: false —
+	// kit references need the pack CDN); the layouts live in level-templates.cjs
+	...require('./level-templates.cjs').LEVEL_DEFS
 ];
 
 (async () => {
+	// 30 author-kit: the REAL GPU. `--use-angle=gl` fell back to SwiftShader on Linux, so every
+	// card was a software render. The ANGLE backend is per platform — tests/e2e/helpers.cjs
+	// GPU_ARGS, which is where the measurements behind it live.
+	const angle = process.platform === 'win32' ? 'd3d11' : process.platform === 'darwin' ? 'metal' : 'vulkan';
 	const browser = await chromium.launch({
 		headless: true,
-		args: ['--disable-background-timer-throttling', '--disable-renderer-backgrounding', '--use-gl=angle', '--use-angle=gl']
+		args: [
+			'--disable-background-timer-throttling',
+			'--disable-renderer-backgrounding',
+			'--use-gl=angle',
+			'--use-angle=' + angle,
+			...(angle === 'vulkan' ? ['--enable-features=Vulkan'] : []),
+			'--enable-gpu',
+			'--ignore-gpu-blocklist'
+		]
 	});
 	const ctx = await browser.newContext({ ignoreHTTPSErrors: true });
 	await ctx.addInitScript(() => {
@@ -1329,10 +2186,22 @@ const DEFS = [
 	await page.goto(URL, { waitUntil: 'domcontentloaded', timeout: 60000 });
 	await page.waitForFunction(() => window.__stores && !!window.__stores.sessions, { timeout: 40000 });
 	await page.waitForTimeout(2000);
+	// 30 author-kit: say which GPU the thumbnails are rendered on — a SwiftShader card is
+	// not the one a user's display would show, and nothing else in the run would tell
+	const gpu = await page.evaluate(() => {
+		const gl = document.createElement('canvas').getContext('webgl2');
+		const info = gl?.getExtension('WEBGL_debug_renderer_info');
+		return info ? gl.getParameter(info.UNMASKED_RENDERER_WEBGL) : 'unknown';
+	});
+	console.log('GPU: ' + gpu + (/swiftshader/i.test(gpu) ? '  (WARN software rendering)' : ''));
 
 	/** @type {Record<string, {entry: any, bytes: Buffer, thumb: Buffer|null}>} */
 	const built = {};
-	const defs = ONLY ? DEFS.filter((d) => ONLY.includes(d.slug)) : DEFS;
+	// 30 author-kit: `--def` files replace a same-slug DEFS entry in place, or append
+	const allDefs = DEFS.map((d) => FILE_DEFS.find((f) => f.slug === d.slug) ?? d).concat(
+		FILE_DEFS.filter((f) => !DEFS.some((d) => d.slug === f.slug))
+	);
+	const defs = ONLY ? allDefs.filter((d) => ONLY.includes(d.slug)) : allDefs;
 	if (ONLY && defs.length !== ONLY.length)
 		console.log('  WARN --only names a slug DEFS does not have: ' + ONLY.join(','));
 	// a module-owned def whose file is absent must not quietly drop its row from a full
@@ -1388,11 +2257,117 @@ const DEFS = [
 			const s = window.__stores;
 			const T = s.THREE;
 			s.commandsHandler.sceneCommand('/clear all');
+			// 30c: KIT pieces name a pack item; resolve each to its file path through the pack's
+			// own item list (default.json) on PACKS_BASE, once per pack, before anything builds
+			/** @type {Record<string, Record<string, string>>} */
+			const kitFiles = {};
+			/** @param {any[]} list @param {Set<string>} sink */
+			const kitPacks = (list, sink) => {
+				for (const o of list ?? []) {
+					if (o.type === 'kit') sink.add(o.pack);
+					if (o.children) kitPacks(o.children, sink);
+				}
+				return sink;
+			};
+			for (const pack of kitPacks(d.objects, new Set())) {
+				const base = String(s.packs.PACKS_BASE).replace(/\/+$/, '');
+				const res = await fetch(base + '/' + pack + '/default.json');
+				if (!res.ok) throw new Error('kit: pack "' + pack + '" is not served at ' + base + ' (HTTP ' + res.status + ')');
+				kitFiles[pack] = {};
+				for (const row of await res.json()) {
+					const file = row?.variants?.['glTF-Binary'];
+					if (row?.name && file) kitFiles[pack][row.name] = pack + '/' + row.name + '/glTF-Binary/' + file;
+				}
+			}
 			/** @type {any} */
 			let group;
 			s.objectsGroup.subscribe((g) => (group = g))();
 			/** @param {number} n */
 			const hex = (n) => '#' + Number(n).toString(16).padStart(6, '0');
+			// 30 author-kit: material fields only MeshPhysicalMaterial has (a def using any of
+			// them gets one), the directional lights whose shadow frustum is fitted once the
+			// whole scene is built, and the animation presets applied once objects have uuids
+			const PHYSICAL_KEYS = ['clearcoat', 'clearcoatRoughness', 'transmission', 'thickness', 'ior', 'sheen', 'sheenColor', 'sheenRoughness', 'iridescence', 'specularIntensity'];
+			/** @type {any[]} */ const fitShadows = [];
+			/** @type {{object: any, anim: any}[]} */ const animQueue = [];
+			// 30 author-kit: a ROUNDED box. Core's Box params carry no bevel, so this is a port of
+			// three/examples' RoundedBoxGeometry (MIT) — same vertex placement, normals and UVs —
+			// BAKED into a plain BufferGeometry: toJSON writes a subclass's `type` and ObjectLoader
+			// cannot rebuild 'RoundedBoxGeometry', while a plain BufferGeometry round-trips its
+			// buffers. @param {number} width @param {number} height @param {number} depth
+			// @param {number} segments @param {number} radius
+			const roundedBox = (width, height, depth, segments, radius) => {
+				const total = segments * 2 + 1;
+				radius = Math.min(width / 2, height / 2, depth / 2, radius);
+				const src = new T.BoxGeometry(1, 1, 1, total, total, total).toNonIndexed();
+				const positions = src.attributes.position.array;
+				const normals = src.attributes.normal.array;
+				const uvs = src.attributes.uv.array;
+				const position = new T.Vector3();
+				const normal = new T.Vector3();
+				const temp = new T.Vector3();
+				const faceDir = new T.Vector3();
+				const box = new T.Vector3(width, height, depth).divideScalar(2).subScalar(radius);
+				const faceTris = positions.length / 6;
+				const half = 0.5 / total;
+				/** @param {string} uvAxis @param {string} projAxis @param {number} side */
+				const getUv = (uvAxis, projAxis, side) => {
+					const arc = (2 * Math.PI * radius) / 4;
+					const centre = Math.max(side - 2 * radius, 0);
+					temp.copy(normal);
+					/** @type {any} */ (temp)[projAxis] = 0;
+					temp.normalize();
+					const arcUv = (0.5 * arc) / (arc + centre);
+					const arcAngle = 1.0 - temp.angleTo(faceDir) / (Math.PI / 4);
+					if (Math.sign(/** @type {any} */ (temp)[uvAxis]) === 1) return arcAngle * arcUv;
+					return centre / (arc + centre) + arcUv + arcUv * (1.0 - arcAngle);
+				};
+				for (let i = 0, j = 0; i < positions.length; i += 3, j += 2) {
+					position.fromArray(positions, i);
+					normal.copy(position);
+					normal.x -= Math.sign(normal.x) * half;
+					normal.y -= Math.sign(normal.y) * half;
+					normal.z -= Math.sign(normal.z) * half;
+					normal.normalize();
+					positions[i] = box.x * Math.sign(position.x) + normal.x * radius;
+					positions[i + 1] = box.y * Math.sign(position.y) + normal.y * radius;
+					positions[i + 2] = box.z * Math.sign(position.z) + normal.z * radius;
+					normals[i] = normal.x;
+					normals[i + 1] = normal.y;
+					normals[i + 2] = normal.z;
+					const face = Math.floor(i / faceTris);
+					if (face === 0) {
+						faceDir.set(1, 0, 0);
+						uvs[j] = getUv('z', 'y', depth);
+						uvs[j + 1] = 1.0 - getUv('y', 'z', height);
+					} else if (face === 1) {
+						faceDir.set(-1, 0, 0);
+						uvs[j] = 1.0 - getUv('z', 'y', depth);
+						uvs[j + 1] = 1.0 - getUv('y', 'z', height);
+					} else if (face === 2) {
+						faceDir.set(0, 1, 0);
+						uvs[j] = 1.0 - getUv('x', 'z', width);
+						uvs[j + 1] = getUv('z', 'x', depth);
+					} else if (face === 3) {
+						faceDir.set(0, -1, 0);
+						uvs[j] = 1.0 - getUv('x', 'z', width);
+						uvs[j + 1] = 1.0 - getUv('z', 'x', depth);
+					} else if (face === 4) {
+						faceDir.set(0, 0, 1);
+						uvs[j] = 1.0 - getUv('x', 'y', width);
+						uvs[j + 1] = 1.0 - getUv('y', 'x', height);
+					} else {
+						faceDir.set(0, 0, -1);
+						uvs[j] = getUv('x', 'y', width);
+						uvs[j + 1] = 1.0 - getUv('y', 'x', height);
+					}
+				}
+				const geo = new T.BufferGeometry();
+				geo.setAttribute('position', new T.BufferAttribute(positions, 3));
+				geo.setAttribute('normal', new T.BufferAttribute(normals, 3));
+				geo.setAttribute('uv', new T.BufferAttribute(uvs, 2));
+				return geo;
+			};
 			// 28-G: ONE recursive builder. The four original primitives take exactly the
 			// steps they always did, in the same order, so every earlier def is byte-identical.
 			// `mirror` reflects across x = 0: position x negated, yaw and roll NEGATED — a
@@ -1409,6 +2384,41 @@ const DEFS = [
 				if (o.type === 'group' || o.type === 'empty') {
 					object = new T.Group();
 					for (const child of o.children ?? []) object.add(build(child, opts));
+				} else if (o.type === 'kit') {
+					// 30c: a hollow STUB — the app's packRefs watcher refills it from the pack
+					// (awaited below, before the card renders and the file is written)
+					const path = kitFiles[o.pack]?.[o.item];
+					if (!path) throw new Error('kit "' + o.name + '": pack ' + o.pack + ' has no item "' + o.item + '"');
+					object = new T.Group();
+					object.userData.packRef = { pack: o.pack, item: o.item, path, kids: [] };
+					object.userData.packStub = true;
+					if (o.scale != null) {
+						const k = Array.isArray(o.scale) ? o.scale : [o.scale, o.scale, o.scale];
+						object.scale.set(k[0], k[1], k[2]);
+					}
+				} else if (o.type === 'light' && o.kind && o.kind !== 'point') {
+					// 30 author-kit: spot / directional / hemisphere. Spot and directional follow
+					// createLight's convention (cast shadows by default, the V-1 bias pair) and aim
+					// by ROTATION (24-E1: they shine along local -Z; lightHelpers places the target
+					// on that forward) — `target` is a WORLD point applied with lookAt once the
+					// position is set, below. A directional's ortho frustum is FITTED to the built
+					// scene after every object exists (`fitShadows`), unless `fit: false`.
+					if (o.kind === 'hemisphere') {
+						object = new T.HemisphereLight(o.color ?? 0xffffff, o.groundColor ?? 0x444444, o.intensity ?? 1);
+					} else if (o.kind === 'spot' || o.kind === 'directional') {
+						object =
+							o.kind === 'spot'
+								? new T.SpotLight(o.color ?? 0xffffff, o.intensity ?? 1, o.distance ?? 0, o.angle ?? Math.PI / 6, o.penumbra ?? 0.3, o.decay ?? 2)
+								: new T.DirectionalLight(o.color ?? 0xffffff, o.intensity ?? 1);
+						object.castShadow = o.castShadow ?? true;
+						object.shadow.bias = -0.0002;
+						object.shadow.normalBias = 0.02;
+						if (o.shadowMapSize) {
+							object.userData.shadowMapSize = o.shadowMapSize;
+							object.shadow.mapSize.set(o.shadowMapSize, o.shadowMapSize);
+						}
+						if (o.kind === 'directional' && object.castShadow && o.fit !== false) fitShadows.push(object);
+					} else throw new Error('light: unknown kind "' + o.kind + '" (point | spot | directional | hemisphere)');
 				} else if (o.type === 'light') {
 					// a point light: a viewpoint's worth of scenery it lights, no shadow map
 					object = new T.PointLight(o.color ?? 0xffffff, o.intensity ?? 1, o.distance ?? 0, o.decay ?? 2);
@@ -1449,16 +2459,44 @@ const DEFS = [
 					);
 				} else {
 					let geo;
-					if (o.type === 'box') geo = new T.BoxGeometry(o.size[0], o.size[1], o.size[2]);
+					if (o.type === 'box' && o.bevel > 0) geo = roundedBox(o.size[0], o.size[1], o.size[2], o.bevelSegments ?? 3, o.bevel);
+					else if (o.type === 'box') geo = new T.BoxGeometry(o.size[0], o.size[1], o.size[2]);
 					else if (o.type === 'cylinder') geo = new T.CylinderGeometry(o.r, o.r2 ?? o.r, o.h, 24);
 					else if (o.type === 'sphere') geo = new T.SphereGeometry(o.r, 24, 16);
 					else if (o.type === 'torus') geo = new T.TorusGeometry(o.r, o.tube ?? o.r * 0.2, 16, 40);
-					else geo = new T.ConeGeometry(o.r, o.h, 24);
-					const mat = new T.MeshStandardMaterial({
-						color: o.color,
-						roughness: o.roughness ?? 0.85,
-						metalness: o.metalness ?? 0
-					});
+					// 30 author-kit: four more primitives, all core three geometries ObjectLoader
+					// rebuilds from their parameters (so the .tpscene stays small). A plane faces +Z
+					// (rotate it -90deg on x to lie flat); a ring is the flat annulus, also +Z.
+					else if (o.type === 'capsule') geo = new T.CapsuleGeometry(o.r, o.h ?? o.length ?? 1, 8, 16);
+					else if (o.type === 'plane') geo = new T.PlaneGeometry(o.size[0], o.size[1]);
+					else if (o.type === 'ring') geo = new T.RingGeometry(o.inner ?? o.r * 0.5, o.r, 48);
+					else if (o.type === 'icosahedron') geo = new T.IcosahedronGeometry(o.r, o.detail ?? 0);
+					else if (o.type === 'dodecahedron') geo = new T.DodecahedronGeometry(o.r, o.detail ?? 0);
+					else if (o.type === 'cone') geo = new T.ConeGeometry(o.r, o.h, 24);
+					else throw new Error('object "' + o.name + '": unknown type "' + o.type + '"');
+					// 30 author-kit: MeshPhysicalMaterial when a def asks for `physical` or uses any
+					// field only it has; MeshToonMaterial for `toon`. Absent all of those it is the
+					// same MeshStandardMaterial as ever (byte-identical defs).
+					const physical = o.physical || PHYSICAL_KEYS.some((k) => o[k] != null);
+					/** @type {any} */
+					let mat;
+					if (o.toon) mat = new T.MeshToonMaterial({ color: o.color });
+					else if (physical) {
+						mat = new T.MeshPhysicalMaterial({ color: o.color, roughness: o.roughness ?? 0.85, metalness: o.metalness ?? 0 });
+						for (const k of PHYSICAL_KEYS) {
+							if (o[k] == null) continue;
+							if (k === 'sheenColor') mat.sheenColor = new T.Color(o[k]);
+							else mat[k] = o[k];
+						}
+					} else
+						mat = new T.MeshStandardMaterial({
+							color: o.color,
+							roughness: o.roughness ?? 0.85,
+							metalness: o.metalness ?? 0
+						});
+					if (o.flatShading) mat.flatShading = true;
+					if (o.side === 'double') mat.side = T.DoubleSide;
+					else if (o.side === 'back') mat.side = T.BackSide;
 					// B8: material EMISSIVE + opacity, so a game can glow a pad or float a
 					// translucent marker without a shader doc (which the user found "strange").
 					// emissiveIntensity multiplies the emissive COLOUR, so both are needed.
@@ -1482,6 +2520,35 @@ const DEFS = [
 				if (pos && o.type !== 'spline') object.position.set(pos[0], pos[1], pos[2]);
 				if (rot) object.rotation.set(rot[0], rot[1], rot[2]);
 				if (o.physics && !mirror) object.userData.physics = o.physics;
+				// 30 author-kit: object FLAGS. Each lands where the app itself keeps it, so the
+				// .tpscene carries it the ordinary way (userData rides toJSON; a clip rides the
+				// animations block). A mirror ghost takes none of them (it is decoration).
+				if (!mirror) {
+					// select-through: a shell (wall, ceiling, glass) the editor's pick passes by
+					if (o.pick === 'through') object.userData.pick = 'through';
+					// the transform ORIGIN (objectOrigin's local pivot offset) — a Door preset
+					// swings about it, so a hinge is authored here
+					if (Array.isArray(o.origin)) object.userData.origin = o.origin.map(Number);
+					// a particle emitter from a preset (particlePresets), optionally patched —
+					// the config addParticlesPreset writes to userData.particles
+					if (o.particles) {
+						const spec = typeof o.particles === 'string' ? { preset: o.particles } : o.particles;
+						if (!s.particlePresets.PARTICLE_PRESETS.some((/** @type {any} */ p) => p.key === spec.preset))
+							throw new Error('object "' + o.name + '": no particle preset "' + spec.preset + '"');
+						const base = s.particlePresets.particlePreset(spec.preset);
+						if (!base) throw new Error('object "' + o.name + '": no particle preset "' + spec.preset + '"');
+						const { preset: _preset, ...patch } = spec;
+						object.userData.particles = { ...structuredClone(base), ...patch };
+					}
+					// animation presets are applied once the object has a uuid in the scene
+					if (o.anim) animQueue.push({ object, anim: o.anim });
+				}
+				// a spot/directional aims by rotation at a WORLD point (see the light branch)
+				if (o.target && (object.isSpotLight || object.isDirectionalLight)) {
+					const t = o.target;
+					object.updateMatrixWorld(true);
+					object.lookAt(mirror ? -t[0] : t[0], t[1], t[2]);
+				}
 				if (o.shadow === false || opts.shadow === false) {
 					// shadowDefaults sweeps cast/receive back ON unless the object opts out
 					object.castShadow = false;
@@ -1508,12 +2575,122 @@ const DEFS = [
 				}
 				group.add(build(o));
 			}
+			// 30c: refill every kit stub from its pack BEFORE anything measures the scene (the
+			// shadow fit below, the card) — and refuse to write a level whose pack is unreachable
+			if (kitPacks(d.objects, new Set()).size) {
+				s.objectsGroup.update((v) => v);
+				await new Promise((r) => setTimeout(r, 200));
+				await s.packRefs.packRefsSettled();
+				const hollow = [];
+				group.traverse((/** @type {any} */ n) => {
+					if (n.userData?.packStub) hollow.push(n.name);
+				});
+				if (hollow.length) throw new Error('kit pieces did not load: ' + hollow.slice(0, 5).join(', '));
+			}
+			// 30 author-kit: FIT each shadow-casting directional light's ortho frustum to the
+			// meshes just built — the 8 corners of their world box carried into the light's own
+			// frame (it looks down -Z, and the shadow camera is posed from the light toward its
+			// target on that same forward). Saved with the light: LightShadow.toJSON carries the
+			// camera, so the fitted frustum is what the file (and every peer) renders with.
+			if (fitShadows.length) {
+				group.updateMatrixWorld(true);
+				const bounds = new T.Box3();
+				group.traverse((/** @type {any} */ n) => {
+					if (n.isMesh && !n.userData?.camera) bounds.expandByObject(n);
+				});
+				if (!bounds.isEmpty()) {
+					const corners = [];
+					for (const x of [bounds.min.x, bounds.max.x])
+						for (const y of [bounds.min.y, bounds.max.y])
+							for (const z of [bounds.min.z, bounds.max.z]) corners.push(new T.Vector3(x, y, z));
+					for (const light of fitShadows) {
+						light.updateMatrixWorld(true);
+						const inv = light.matrixWorld.clone().invert();
+						const local = new T.Box3().setFromPoints(corners.map((c) => c.clone().applyMatrix4(inv)));
+						const pad = Math.max(local.max.x - local.min.x, local.max.y - local.min.y) * 0.05 + 0.5;
+						const cam = light.shadow.camera;
+						// symmetric about the light's axis (the shadow camera is centred on it)
+						const rx = Math.max(Math.abs(local.min.x), Math.abs(local.max.x)) + pad;
+						const ry = Math.max(Math.abs(local.min.y), Math.abs(local.max.y)) + pad;
+						cam.left = -rx;
+						cam.right = rx;
+						cam.bottom = -ry;
+						cam.top = ry;
+						cam.near = Math.max(0.1, -local.max.z - pad);
+						cam.far = Math.max(cam.near + 1, -local.min.z + pad);
+						cam.updateProjectionMatrix();
+					}
+				}
+			}
 			s.objectsGroup.update((v) => v);
 
 			// ---- C5.3: the scene DATA a game carries beyond its objects -------------
 			// Each of these lands through the app's own write path, so what the script
 			// produces is exactly what a user authoring by hand would have saved.
-			if (d.env) s.environment.setEnvironment(d.env.preset ?? d.env, d.env.exposure ?? 1);
+			// 30 author-kit: a CUSTOM sky. `env` is still a preset name or {preset, exposure}
+			// (unchanged path, byte-identical); a def that says preset:'custom' or overrides any
+			// sky field builds a custom payload from a base preset (`base`, else the named
+			// preset, else studio) and commits it through the environment module's own custom
+			// path (applyCustomPreset), so the scene saves it as `customPreset` and a peer or a
+			// late joiner receives it on the environment singleton like any authored sky.
+			// The payload's own `exposure` stays 1 — the def's exposure is the STATE multiplier
+			// (applyCustomPreset would otherwise square it).
+			const SKY_KEYS = ['background', 'fog', 'ground', 'sun', 'hemi'];
+			const env = d.env && typeof d.env === 'object' ? d.env : null;
+			/** @param {any} c */
+			const col = (c) => (typeof c === 'number' ? hex(c) : c);
+			if (env && (env.preset === 'custom' || SKY_KEYS.some((k) => env[k] !== undefined))) {
+				const presets = s.environment.ENVIRONMENT_PRESETS;
+				const baseKey = env.base ?? (env.preset && env.preset !== 'custom' ? env.preset : 'studio');
+				if (!presets[baseKey]) throw new Error('env: no base preset "' + baseKey + '"');
+				const payload = JSON.parse(JSON.stringify(presets[baseKey]));
+				payload.label = env.label ?? 'Custom';
+				payload.exposure = 1;
+				if (env.background !== undefined) {
+					if (env.background && typeof env.background === 'object') {
+						// a GRADIENT sky: `background` keeps a flat colour beside it (the horizon)
+						// for the backgroundColor store and for an older peer that ignores it
+						payload.gradient = { top: col(env.background.top), bottom: col(env.background.bottom) };
+						payload.background = col(env.background.bottom);
+					} else payload.background = col(env.background);
+				}
+				if (env.fog !== undefined)
+					payload.fog =
+						env.fog === null
+							? null
+							: {
+									...(payload.fog ?? { color: payload.background, near: 30, far: 160 }),
+									...env.fog,
+									...(env.fog.color != null ? { color: col(env.fog.color) } : {})
+								};
+				if (env.ground) payload.ground = { color: col(env.ground.color), ...(env.ground.roughness != null ? { roughness: env.ground.roughness } : {}) };
+				if (env.sun !== undefined) {
+					if (env.sun === null) payload.sun = null;
+					else {
+						const prev = payload.sun ?? { color: '#ffffff', intensity: 1.8, position: [6, 10, 4] };
+						// `dir` points FROM the scene TOWARD the sun; the rig wants a position
+						const dir = env.sun.dir ? new T.Vector3(...env.sun.dir).normalize().multiplyScalar(16) : null;
+						payload.sun = {
+							color: env.sun.color != null ? col(env.sun.color) : prev.color,
+							intensity: env.sun.intensity ?? prev.intensity,
+							position: dir ? dir.toArray().map((v) => Math.round(v * 1000) / 1000) : env.sun.position ?? prev.position
+						};
+					}
+				}
+				if (env.hemi !== undefined) {
+					if (env.hemi === null) payload.hemi = null;
+					else {
+						const prev = payload.hemi ?? { sky: '#ffffff', ground: '#4c525c', intensity: 1 };
+						payload.hemi = {
+							sky: env.hemi.sky != null ? col(env.hemi.sky) : prev.sky,
+							ground: env.hemi.ground != null ? col(env.hemi.ground) : prev.ground,
+							intensity: env.hemi.intensity ?? prev.intensity
+						};
+					}
+				}
+				s.environment.applyCustomPreset(payload);
+				s.environment.setEnvironment('custom', env.exposure ?? 1);
+			} else if (d.env) s.environment.setEnvironment(d.env.preset ?? d.env, d.env.exposure ?? 1);
 			if (typeof d.gravity === 'number') s.scenePhysics.setSceneGravity(d.gravity);
 			// B8: the whole scenePhysics block (ground/bounds/material/damping/play), not
 			// just gravity — a physics GAME is authored in these numbers. setScenePhysics
@@ -1542,6 +2719,22 @@ const DEFS = [
 				}
 				s.animationPreview.animationsRestore(sets, false);
 			}
+			// 30 author-kit: `anim: '<preset>'` (or a list of them) — through applyPreset, the
+			// Animation window's own preset path, so each is an ORDINARY authored clip keyed
+			// from where the object stands (and, for a Door, about its `origin`). A clip is
+			// authored, not playing: a Play Animation node (or the Animation window) runs it.
+			if (animQueue.length && s.animationPreview) {
+				const presets = s.animationPreview.PRESETS;
+				for (const { object, anim } of animQueue) {
+					for (const name of Array.isArray(anim) ? anim : [anim]) {
+						const key = Object.keys(presets).find(
+							(k) => k === String(name).toLowerCase() || presets[k].name.toLowerCase() === String(name).toLowerCase()
+						);
+						if (!key) throw new Error('object "' + object.name + '": no animation preset "' + name + '" (' + Object.keys(presets).join(', ') + ')');
+						s.animationPreview.applyPreset(key, object.uuid, object);
+					}
+				}
+			}
 			// 28-G: THE TRACK. Into the Explorer (content-hashed, so re-runs dedupe) and into
 			// the scene's music slot with playing OFF — the graph plays it from Start. The
 			// hash is what a Sound node addresses, hence the `'$music'` remap below.
@@ -1676,40 +2869,139 @@ const DEFS = [
 			const bytes = await s.sessions.exportSessionZip(payload, { assets: !!music || sounds.length > 0, packs: false, flow: true });
 
 			// fitted offscreen thumbnail — the sessions.js renderSceneThumbnail
-			// approach at card size (480x270 webp)
+			// approach at card size (480x270 webp).
+			// 30 author-kit P2: THE CARD LOOKS LIKE THE GAME. It used to light the scene with a
+			// private hemisphere + directional pair on a fixed grey, which is why a sunset game
+			// read as a grey box. Now it renders with the scene's OWN look: the live background
+			// (flat colour or the gradient texture), its fog, the environment rig cloned from the
+			// scene root (hemi + sun + shadow catcher / ground + extra env lights, at the
+			// intensities the viewport uses) and the authored lights; the private pair is the
+			// fallback ONLY when the scene has no light at all. Shadows on (PCF). Tone mapping
+			// follows the post stack's Tone mapping curve when it has one, else the renderer's
+			// own ACES Filmic — what a play-mode frame shows — at the environment's exposure.
+			// The camera is `thumb.camera`, else `view`, else a 3/4 framing of the CONTENT: the
+			// objects' bounds without the camera markers and without floor-like slabs (a 30x40 m
+			// ground framed whole leaves every game piece a speck — the 1690-byte Waves card).
 			let thumb = null;
 			try {
 				const T = s.THREE;
+				/** @type {any} */ let liveScene;
+				s.globalScene.subscribe((v) => (liveScene = v))();
+				/** @type {any} */ let liveRenderer;
+				s.globalRenderer.subscribe((v) => (liveRenderer = v))();
 				const renderer = new T.WebGLRenderer({ antialias: true, alpha: true });
 				renderer.setSize(480, 270);
+				renderer.shadowMap.enabled = true;
+				renderer.shadowMap.type = T.PCFShadowMap;
+				/** @type {any} */ let post;
+				s.scenePost?.scenePost?.subscribe((/** @type {any} */ v) => (post = v))();
+				const tonemap = post?.enabled !== false ? (post?.effects ?? []).find((/** @type {any} */ fx) => fx.kind === 'tonemapping' && fx.enabled !== false) : null;
+				const CURVES = { AGX: T.AgXToneMapping, ACES_FILMIC: T.ACESFilmicToneMapping, NEUTRAL: T.NeutralToneMapping, REINHARD: T.ReinhardToneMapping, CINEON: T.CineonToneMapping, LINEAR: T.LinearToneMapping };
+				// what the DESKTOP frame shows: a composed frame (the default Shaded+AO view mode
+				// keeps the composer running) never receives the renderer's own ACES — only a stack
+				// Tone mapping entry maps it (the "renderer.toneMapping NEVER REACHES A COMPOSED
+				// FRAME" gotcha). So: the stack's curve, else none. `thumb.toneMapping` overrides.
+				const PICK = { agx: 'AGX', aces: 'ACES_FILMIC', neutral: 'NEUTRAL', reinhard: 'REINHARD', cineon: 'CINEON', linear: 'LINEAR' };
+				const forced = d.thumb?.toneMapping;
+				renderer.toneMapping =
+					forced === 'none'
+						? T.NoToneMapping
+						: forced
+							? (/** @type {any} */ (CURVES)[/** @type {any} */ (PICK)[forced] ?? ''] ?? T.NoToneMapping)
+							: tonemap
+								? (/** @type {any} */ (CURVES)[tonemap.params?.mode ?? 'AGX'] ?? T.AgXToneMapping)
+								: T.NoToneMapping;
+				renderer.toneMappingExposure = liveRenderer?.toneMappingExposure ?? 1;
 				const scene = new T.Scene();
-				scene.background = new T.Color('#232a33');
-				scene.add(new T.HemisphereLight(0xffffff, 0x444466, 2.2));
-				const sun = new T.DirectionalLight(0xffffff, 1.4);
-				sun.position.set(6, 10, 4);
-				scene.add(sun);
-				const clone = new T.ObjectLoader().parse(group.toJSON());
+				const bg = liveScene?.background;
+				scene.background = bg?.isColor ? bg.clone() : bg ?? new T.Color('#232a33');
+				if (liveScene?.fog) scene.fog = liveScene.fog.clone();
+				const envRoot = liveScene?.getObjectByName('environment-root');
+				if (envRoot) scene.add(envRoot.clone(true));
+				// 30c: a level of kit pieces is CLONED, not round-tripped — toJSON writes every
+				// piece's textures as PNG data URLs (7.9 MB for one wall), which is the very cost
+				// the kit references exist to avoid. Every other def renders exactly as before.
+				const clone = kitPacks(d.objects, new Set()).size ? group.clone(true) : new T.ObjectLoader().parse(group.toJSON());
 				scene.add(clone);
 				// 21-C C6-b: a module's WORLD lives at the scene root (golden rule 5), so a
 				// card rendered from objectsGroup alone shows a dungeon template as a lone
 				// arch. `thumb.sceneGroups` names scene-root groups to include — cloned into
 				// the offscreen scene, never moved; absent, the picture is what it always was.
-				/** @type {any} */ let liveScene;
-				s.globalScene.subscribe((v) => (liveScene = v))();
 				for (const name of d.thumb?.sceneGroups ?? []) {
 					const live = liveScene?.getObjectByName(name);
 					if (live) clone.add(live.clone(true));
 					else console.log('  WARN thumb.sceneGroups: no scene-root group named ' + name);
 				}
+				// camera markers are chrome, not scenery
+				clone.traverse((/** @type {any} */ n) => {
+					if (n.userData?.camera) n.visible = false;
+				});
+				scene.updateMatrixWorld(true);
+				// a spot/directional shines along its -Z (24-E1) — lightHelpers seats its target
+				// there every frame in the live app; nothing does in this offscreen scene
+				let lights = 0;
+				scene.traverse((/** @type {any} */ n) => {
+					if (!n.isLight || !n.visible || !(n.intensity > 0)) return;
+					let shown = true;
+					for (let p = n.parent; p; p = p.parent) if (!p.visible) shown = false;
+					if (!shown) return;
+					lights++;
+					if ((n.isSpotLight || n.isDirectionalLight) && n.parent !== scene.getObjectByName('environment-root')) {
+						const at = n.getWorldPosition(new T.Vector3());
+						const fwd = new T.Vector3(0, 0, -1).applyQuaternion(n.getWorldQuaternion(new T.Quaternion()));
+						n.target.position.copy(at).add(fwd.multiplyScalar(10));
+						scene.add(n.target);
+						n.target.updateMatrixWorld(true);
+					}
+				});
+				if (!lights) {
+					scene.add(new T.HemisphereLight(0xffffff, 0x444466, 2.2));
+					const sun = new T.DirectionalLight(0xffffff, 1.4);
+					sun.position.set(6, 10, 4);
+					scene.add(sun);
+				}
 				const box = new T.Box3().setFromObject(clone);
-				const size = Math.max(box.getSize(new T.Vector3()).length(), 1);
-				const center = box.getCenter(new T.Vector3());
-				let camera = new T.PerspectiveCamera(40, 480 / 270, size / 100, size * 10);
-				camera.position.copy(center).add(new T.Vector3(size * 0.55, size * 0.42, size * 0.72));
+				// the CONTENT box: every visible mesh except floor-like slabs (thin, and covering
+				// over a quarter of the whole footprint); the whole box when nothing else is left
+				const whole = box.getSize(new T.Vector3());
+				const footprint = Math.max(whole.x * whole.z, 1e-6);
+				const content = new T.Box3();
+				clone.traverse((/** @type {any} */ n) => {
+					if (!n.isMesh || !n.visible || n.userData?.camera) return;
+					const b = new T.Box3().setFromObject(n);
+					if (b.isEmpty()) return;
+					const sz = b.getSize(new T.Vector3());
+					const slab = sz.y < 0.05 * Math.max(sz.x, sz.z) && (sz.x * sz.z) / footprint > 0.25;
+					if (!slab) content.union(b);
+				});
+				const frame = content.isEmpty() ? box : content;
+				const center = frame.getCenter(new T.Vector3());
+				// FIT the box to the 16:9 frame from the 3/4 direction: every corner q (relative
+				// to the centre) needs |q.right| <= tanH * depth and |q.up| <= tanV * depth, where
+				// depth = dist - q.dir — so the distance is the max over the eight corners (a
+				// bounding sphere wastes the card's width on a box that is long and low)
+				const fov = 40;
+				const dir = new T.Vector3(0.55, 0.42, 0.72).normalize();
+				const fwd = dir.clone().negate();
+				const right = new T.Vector3().crossVectors(fwd, new T.Vector3(0, 1, 0)).normalize();
+				const up = new T.Vector3().crossVectors(right, fwd);
+				const tanV = Math.tan(((fov / 2) * Math.PI) / 180);
+				const tanH = tanV * (480 / 270);
+				let dist = 1;
+				for (const x of [frame.min.x, frame.max.x])
+					for (const y of [frame.min.y, frame.max.y])
+						for (const z of [frame.min.z, frame.max.z]) {
+							const q = new T.Vector3(x, y, z).sub(center);
+							const along = q.dot(dir);
+							dist = Math.max(dist, Math.abs(q.dot(right)) / tanH + along, Math.abs(q.dot(up)) / tanV + along);
+						}
+				dist *= 1.08;
+				const span = Math.max(whole.length(), dist * 2);
+				let camera = new T.PerspectiveCamera(fov, 480 / 270, Math.max(dist / 200, 0.01), dist + span * 4);
+				camera.position.copy(center).add(dir.clone().multiplyScalar(dist));
 				camera.lookAt(center);
 				// 28-G: `thumb.camera` renders the card THROUGH a named camera object — the
-				// hero shot the def already authored — instead of the fitted 3/4 view. Camera
-				// markers are chrome, not scenery, so they stay out of that picture.
+				// hero shot the def already authored — instead of the fitted 3/4 view.
 				const hero = d.thumb?.camera ? group.getObjectByName(d.thumb.camera) : null;
 				if (hero) {
 					group.updateMatrixWorld(true);
@@ -1717,9 +3009,13 @@ const DEFS = [
 					camera = new T.PerspectiveCamera(spec.fov ?? 50, 480 / 270, spec.near ?? 0.1, spec.far ?? 1000);
 					hero.getWorldPosition(camera.position);
 					hero.getWorldQuaternion(camera.quaternion);
-					clone.traverse((/** @type {any} */ n) => {
-						if (n.userData?.camera) n.visible = false;
-					});
+				} else if (d.view) {
+					// the editor view the file opens on — the author already chose it
+					/** @type {any} */ let editorCam;
+					s.globalCamera.subscribe((v) => (editorCam = v))();
+					camera = new T.PerspectiveCamera(editorCam?.fov ?? 50, 480 / 270, 0.1, 2000);
+					camera.position.set(d.view.pos[0], d.view.pos[1], d.view.pos[2]);
+					camera.lookAt(d.view.target[0], d.view.target[1], d.view.target[2]);
 				}
 				renderer.render(scene, camera);
 				thumb = renderer.domElement.toDataURL('image/webp', 0.82);
@@ -1731,7 +3027,9 @@ const DEFS = [
 			// leave no look or rule behind for the next def — a leaked sky or gravity is
 			// exactly the bug A6 exists to fix, and it would be baked into the next scene
 			s.commandsHandler.sceneCommand('/clear all');
-			s.environment.setEnvironment('studio', 1);
+			// 30 author-kit: the FULL reset — setEnvironment('studio') keeps a custom payload
+			// in the state, and environmentSnapshot would then save it into the NEXT def
+			s.environment.environmentRestore(null, false);
 			s.scenePhysics.resetSceneGravity();
 			s.restoreGraphs({});
 			// B8: every singleton a game def can now set — a null/empty restore is the
@@ -1789,7 +3087,9 @@ const DEFS = [
 	// with a partial one.
 	if (!ONLY) {
 		fs.mkdirSync(STATIC_OUT, { recursive: true });
-		const seedTemplates = defs.filter((d) => d.kind === 'template').map((d) => ({
+		// 30c: `seed: false` keeps a template OUT of the offline seed — a level built from kit
+		// references needs the pack CDN, so bundling it offline would promise an empty world
+		const seedTemplates = defs.filter((d) => d.kind === 'template' && d.seed !== false).map((d) => ({
 			...writeDef(STATIC_OUT, d),
 			scene: `/templates/${d.slug}/scene.tpscene`,
 			thumb: built[d.slug].thumb ? `/templates/${d.slug}/thumb.webp` : ''
diff --git a/scripts/level-templates.cjs b/scripts/level-templates.cjs
new file mode 100644
index 00000000..036bd415
--- /dev/null
+++ b/scripts/level-templates.cjs
@@ -0,0 +1,598 @@
+// 30c level design — three GENERAL-tab templates built from the round-3 kits (the
+// Modular Architecture Kit, Nature & Terrain, Props & Interiors), authored by
+// author-templates.cjs through its `kit` object type (a pack piece as a REFERENCE — core
+// src/lib/packRefs.js — so a level of ~150 pieces is a ~100 KB file whose bytes come from
+// the pack CDN).
+//
+// Every level is a PLAYABLE walk: a Character Controller node in walk mode, the simulation
+// starting on Play (the walker only collides while a world exists — charController.js), a
+// spawn point (scenePhysics play.spawn), and colliders that match the pieces: walls and
+// props keep their measured box, and the pieces a box gets wrong take CUSTOM compound
+// shapes — a doorway is two jambs and a lintel, a staircase a wedge, a tree its trunk, a
+// footbridge its deck and rails. Grass, flowers, rugs and water are sensors (pass-through).
+//
+// THE GRID (kit.md): walls stand ON grid lines, centred on them, pivot bottom-centre, 2 m
+// long; floor tiles fill the 2 × 2 cells; storeys are 3 m. Every position below is on that
+// grid unless it is a prop.
+//
+// Numbers the colliders use were MEASURED from the shipped GLBs (see the handover's
+// probe): the arch opening, the footbridge deck profile, the tree trunks, the mound.
+
+const A = 'architecture-kit';
+const N = 'nature-kit';
+const P = 'props-kit';
+const PI = Math.PI;
+const H = PI / 2;
+
+// ---- colliders ------------------------------------------------------------------------
+
+/** A custom compound collider from convex pieces, each a flat vertex list (object-local,
+ * the root's pivot). @param {number[][][]} pieces each a list of [x,y,z] */
+function compound(pieces, extra = {}) {
+	/** @type {number[]} */
+	const verts = [];
+	/** @type {number[][]} */
+	const ranges = [];
+	for (const piece of pieces) {
+		ranges.push([verts.length, piece.length * 3]);
+		for (const v of piece) verts.push(...v.map((n) => Math.round(n * 1000) / 1000));
+	}
+	if (verts.length > 1200) throw new Error('collider over the 1200-float cap: ' + verts.length);
+	return { mode: 'static', collider: 'custom', colliderVerts: verts, colliderPieces: ranges, ...extra };
+}
+
+/** the 8 corners of an axis-aligned box @param {number[]} min @param {number[]} max */
+function box(min, max) {
+	const out = [];
+	for (const x of [min[0], max[0]]) for (const y of [min[1], max[1]]) for (const z of [min[2], max[2]]) out.push([x, y, z]);
+	return out;
+}
+
+/** a ramp rising toward -Z from `z0` (low, y0) to `z1` (high, y1), `w` wide
+ * @param {number} w @param {number} z0 @param {number} z1 @param {number} y0 @param {number} y1 */
+function wedge(w, z0, z1, y0, y1) {
+	const x = w / 2;
+	return [
+		[-x, y0, z0],
+		[x, y0, z0],
+		[-x, y0, z1],
+		[x, y0, z1],
+		[-x, y1, z1],
+		[x, y1, z1]
+	];
+}
+
+const COLLIDERS = {
+	// the Arch: 2 × 3 × 0.5, its opening MEASURED at ±0.408 m and 2.05 m high — two jambs
+	// and a lintel, so the walker passes through the opening and not the stone. The jambs sit
+	// 6 cm INSIDE the stone: the 0.82 m opening leaves a 0.3 m capsule 11 cm a side, and a walk
+	// that grazed a jamb corner slid off it and stopped (measured, 1 run in 2); the eye walks the
+	// centre line, so nothing visibly clips
+	arch: compound([box([-1, 0, -0.25], [-0.47, 3, 0.25]), box([0.47, 0, -0.25], [1, 3, 0.25]), box([-1, 2.05, -0.25], [1, 3, 0.25])]),
+	// a doorway wall: kit.md's exact 1.0 × 2.2 m opening, centred, in a 0.25 m wall
+	doorway: compound([box([-1, 0, -0.125], [-0.5, 3, 0.125]), box([0.5, 0, -0.125], [1, 3, 0.125]), box([-1, 2.2, -0.125], [1, 3, 0.125])]),
+	// Stairs (2 × 3 × 4, bottom step at +Z): a wedge 36.9° — under the walker's 50° climb
+	stairs: compound([wedge(2, 2, -2, 0, 3)]),
+	/** a trunk: a square column of half-width r about (cx, cz), h tall — the canopy stays
+	 * walk-under @param {number} r @param {number} [cx] @param {number} [cz] @param {number} [h] */
+	trunk: (r, cx = 0, cz = 0, h = 3) => compound([box([cx - r, 0, cz - r], [cx + r, h, cz + r])]),
+	/** a sandstone Ramp (2 × 1 × 2, low edge at +Z) squashed to `rise` metres */
+	ramp: (/** @type {number} */ rise) => compound([wedge(2, 1, -1, 0, rise)]),
+	sensor: { sensor: true }
+};
+
+// the footbridge, MEASURED (the GLB's own vertices): it is walked along its LOCAL Z (2 m),
+// its deck a flat 0.85 m up across |x| < 1.45, and its posts and rails fill 1.45 < |x| < 2
+// up to 2.06 m. The deck has no approach of its own (a 0.85 m step either end), so the level
+// kitbashes a squashed sandstone Ramp onto each end.
+const BRIDGE_DECK = { deckY: 0.85, halfW: 1.45, railY: 2.06 };
+function bridgeCollider() {
+	const d = BRIDGE_DECK;
+	return compound([
+		box([-d.halfW, 0, -1], [d.halfW, d.deckY, 1]),
+		box([-2, 0, -1], [-d.halfW, d.railY, 1]),
+		box([d.halfW, 0, -1], [2, d.railY, 1])
+	]);
+}
+
+// the grassy mound (8 × 1.2 × 8): its convex hull, from MEASURED rings of (radius, height)
+// (its mesh ends in a 0.37 m lip, over the walker's 0.3 m step, so the hull's foot runs out
+// to 4.3 m at ground level: a 31° slope where the lip is)
+const HILL_RINGS = [
+	[0, 1.2],
+	[1.5, 1.15],
+	[2, 1.01],
+	[2.5, 0.85],
+	[3, 0.68],
+	[3.5, 0.49]
+];
+function hillCollider() {
+	/** @type {number[][]} */
+	const verts = [];
+	for (const [r, y] of HILL_RINGS) {
+		if (r === 0) {
+			verts.push([0, y, 0]);
+			continue;
+		}
+		for (let i = 0; i < 12; i++) verts.push([Math.cos((i / 12) * 2 * PI) * r, y, Math.sin((i / 12) * 2 * PI) * r]);
+	}
+	verts.push(...[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11].map((i) => [Math.cos((i / 12) * 2 * PI) * 4.3, 0, Math.sin((i / 12) * 2 * PI) * 4.3]));
+	return compound([verts]);
+}
+
+// the trunks, MEASURED between 0.3 and 1.2 m up (radius about the trunk's own centre, which
+// is off the pivot on the pine, the birch and the dead tree); the oak's reading includes its
+// root flare, so it takes the trunk proper
+/** @type {Record<string, any>} */
+const TRUNKS = {
+	Oak: COLLIDERS.trunk(0.6, -0.05, 0.04),
+	OakAutumn: COLLIDERS.trunk(0.6, -0.05, 0.04),
+	Pine: COLLIDERS.trunk(0.4, -0.24, -0.14),
+	Birch: COLLIDERS.trunk(0.25, 0.01, -0.24),
+	DeadTree: COLLIDERS.trunk(0.4, 0.36, 0.5)
+};
+
+// ---- helpers --------------------------------------------------------------------------
+
+/** a counter per name prefix, so every object has a unique readable name */
+function namer() {
+	/** @type {Record<string, number>} */
+	const seen = {};
+	return (/** @type {string} */ base) => {
+		seen[base] = (seen[base] ?? 0) + 1;
+		return base + ' ' + seen[base];
+	};
+}
+
+/** a deterministic PRNG (mulberry32), so a re-author is byte-stable @param {number} seed */
+function rng(seed) {
+	let a = seed >>> 0;
+	return () => {
+		a = (a + 0x6d2b79f5) >>> 0;
+		let t = a;
+		t = Math.imul(t ^ (t >>> 15), t | 1);
+		t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
+		return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+	};
+}
+
+const r3 = (/** @type {number} */ n) => Math.round(n * 1000) / 1000;
+
+/** one kit piece @param {string} pack @param {string} item @param {string} name
+ * @param {number[]} pos @param {number} [yaw] @param {any} [extra] */
+function piece(pack, item, name, pos, yaw = 0, extra = {}) {
+	return { type: 'kit', pack, item, name, pos: pos.map(r3), ...(yaw ? { rot: [0, r3(yaw), 0] } : {}), ...extra };
+}
+
+/** the walk: ONE Character Controller node in walk mode — the whole of a level's logic */
+function walkGraph() {
+	return {
+		nodes: [
+			{
+				id: 'walk',
+				type: 'charcontroller',
+				position: { x: 40, y: 40 },
+				data: { label: 'Character Controller', mode: 'walk', speed: 0.08, jumpHeight: 1.1, eyeHeight: 1.7, gravity: true },
+				class: 'w-[150px]'
+			}
+		],
+		edges: []
+	};
+}
+
+/** the shared play physics: ground on, respawn below, grab props, the sim starts on Play so
+ * the walker has a world to collide with; `spawn` = where desktop play starts */
+function playPhysics(/** @type {number[]} */ spawn, /** @type {number} */ yaw) {
+	return {
+		ground: { enabled: true, height: 0, friction: 0.8, restitution: 0 },
+		bounds: { limit: -20, action: 'respawn' },
+		damping: { linear: 0.1, angular: 0.4 },
+		play: { interaction: 'grab', grounded: false, simOnPlay: true, spawn: { position: spawn, yaw } }
+	};
+}
+
+/** the house look: AO, AgX, a soft bloom (flames, lanterns), SMAA */
+function lookPost(bloom = 0.6) {
+	return {
+		enabled: true,
+		effects: [
+			{ id: 'ao', kind: 'ao', enabled: true, params: {} },
+			{ id: 'tone', kind: 'tonemapping', enabled: true, params: { mode: 'AGX' } },
+			{ id: 'bloom', kind: 'bloom', enabled: true, params: { intensity: bloom, luminanceThreshold: 0.85 } },
+			{ id: 'aa', kind: 'smaa', enabled: true, params: {} }
+		],
+		changedAt: 0
+	};
+}
+
+const DYNAMIC = (/** @type {number} */ mass) => ({ mode: 'dynamic', mass });
+
+// ---- 1. Castle Courtyard ---------------------------------------------------------------
+//
+// A 16 × 20 m walled courtyard: curtain walls on the grid lines x = ±8, z = 6 and z = -14,
+// round towers three storeys tall on the two north corners, a rampart terrace (a stone
+// platform 3 m up behind the north wall, battlements for a parapet) reached by a staircase
+// through an archway, a paved avenue from the gate to the well, a market stall with its
+// crates and sacks, and trees on the earth either side. The gate (oak double doors between
+// two pillars) is behind you when you spawn; you look north down the avenue.
+function castleObjects() {
+	const n = namer();
+	/** @type {any[]} */
+	const o = [];
+	// curtain walls ------------------------------------------------------------------
+	for (const x of [-5, -3, -1, 1, 3, 5]) o.push(piece(A, 'WallStone', n('North wall'), [x, 0, -14]));
+	for (const z of [-11, -9, -7, -5, -3, -1, 1, 3, 5]) {
+		o.push(piece(A, 'WallStone', n('West wall'), [-8, 0, z], H));
+		// the east wall has one DOOR (to a storeroom — the Door leaf is shut)
+		if (z === -7) {
+			o.push(piece(A, 'WallStoneDoor', 'Storeroom doorway', [8, 0, z], -H, { physics: COLLIDERS.doorway }));
+			o.push(piece(A, 'Door', 'Storeroom door', [8, 0, z], -H));
+		} else o.push(piece(A, 'WallStone', n('East wall'), [8, 0, z], H));
+	}
+	for (const x of [-7, -5, -3, -1, 3, 5, 7]) o.push(piece(A, 'WallStone', n('South wall'), [x, 0, 6]));
+	// the gate: oak double doors in a 2 m gap, a pillar either side, a battlement over it
+	o.push(piece(A, 'Gate', 'Castle gate', [1, 0, 6]));
+	o.push(piece(A, 'Pillar', n('Gate pillar'), [0, 0, 6]));
+	o.push(piece(A, 'Pillar', n('Gate pillar'), [2, 0, 6]));
+	o.push(piece(A, 'CornerPostStone', n('Corner post'), [-8, 0, 6]));
+	o.push(piece(A, 'CornerPostStone', n('Corner post'), [8, 0, 6]));
+	// battlements along every wall top (the north ones are the rampart's parapet)
+	for (const x of [-5, -3, -1, 1, 3, 5]) o.push(piece(A, 'Battlement', n('Battlement'), [x, 3, -14]));
+	for (const z of [-11, -9, -7, -5, -3, -1, 1, 3, 5]) {
+		o.push(piece(A, 'Battlement', n('Battlement'), [-8, 3, z], H));
+		o.push(piece(A, 'Battlement', n('Battlement'), [8, 3, z], H));
+	}
+	for (const x of [-7, -5, -3, -1, 1, 3, 5, 7]) o.push(piece(A, 'Battlement', n('Battlement'), [x, 3, 6]));
+	// two round towers, three storeys, on the north corners
+	for (const x of [-8, 8]) for (const y of [0, 3, 6]) o.push(piece(A, 'Tower', n(x < 0 ? 'West tower' : 'East tower'), [x, y, -14]));
+	// the rampart: a solid platform 3 m up behind the north wall (three courses of blocks)
+	for (const x of [-5, -3, -1, 1, 3, 5]) for (const y of [0, 1, 2]) o.push(piece(A, 'Block', n('Rampart block'), [x, y, -13]));
+	// its railing along the courtyard edge — open at x = -5, where the stairs arrive
+	for (const x of [-3, -1, 1, 3, 5]) o.push(piece(A, 'Railing', n('Rampart railing'), [x, 3, -12.08]));
+	// the staircase up to it, entered through an archway
+	o.push(piece(A, 'Stairs', 'Rampart stairs', [-5, 0, -10], 0, { physics: COLLIDERS.stairs }));
+	o.push(piece(A, 'Arch', 'Stair archway', [-5, 0, -7], 0, { physics: COLLIDERS.arch }));
+	// the avenue: flagstones from the gate to the rampart
+	for (const x of [-3, -1, 1, 3]) for (const z of [5, 3, 1, -1, -3, -5, -7, -9, -11]) o.push(piece(A, 'FloorStone', n('Flagstone'), [x, 0, z]));
+	// the well in the middle of the avenue
+	o.push(piece(P, 'Well', 'Well', [0, 0.1, -4]));
+	// the market on the east side, facing the avenue
+	o.push(piece(P, 'MarketStall', 'Market stall', [6, 0, -2], -H));
+	o.push(piece(P, 'CrateStack', 'Crate stack', [6.4, 0, 1.4], -H));
+	o.push(piece(P, 'Crate', n('Crate'), [4.9, 0, 0.9], 0.3, { physics: DYNAMIC(15) }));
+	o.push(piece(P, 'CrateTeal', n('Crate'), [5.1, 0, -4.8], -0.2, { physics: DYNAMIC(12) }));
+	o.push(piece(P, 'Barrel', n('Barrel'), [6.9, 0, -4.6], 0, { physics: DYNAMIC(30) }));
+	o.push(piece(P, 'BarrelSmall', n('Barrel'), [6.3, 0, -5.4], 0, { physics: DYNAMIC(12) }));
+	o.push(piece(P, 'Sacks', 'Grain sacks', [6.7, 0, 3.5], -2.4));
+	o.push(piece(P, 'Lantern', n('Lantern'), [6.4, 1.05, 1.1], 0, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'Signpost', 'Signpost', [3.3, 0, 4.4], -0.5));
+	o.push(piece(P, 'Chest', 'Treasure chest', [5, 0, -11], -0.3));
+	// wall torches on the inner faces (a wall face is 0.125 off its grid line)
+	for (const z of [-9, 3]) o.push(piece(P, 'WallTorch', n('Wall torch'), [7.875, 1.5, z], -H, { physics: COLLIDERS.sensor }));
+	for (const z of [-1, -9]) o.push(piece(P, 'WallTorch', n('Wall torch'), [-7.875, 1.5, z], H, { physics: COLLIDERS.sensor }));
+	// the west garden: trees, a bench, bushes, flowers on the earth
+	o.push(piece(N, 'Oak', 'Courtyard oak', [-6, 0, 3], 0.7, { physics: TRUNKS.Oak }));
+	o.push(piece(N, 'Birch', 'Courtyard birch', [-6.2, 0, -3.5], 2.1, { physics: TRUNKS.Birch }));
+	o.push(piece(P, 'Bench', 'Garden bench', [-5, 0, 0.2], H));
+	for (const [x, z, yaw] of [[-7.1, 0.6, 0.3], [-7.2, -5.6, 1.9], [4.9, 4.9, 0.8]]) o.push(piece(N, 'Bush', n('Bush'), [x, 0, z], yaw));
+	for (const [x, z] of [[-4.9, 4.6], [-6.9, -1.4], [4.8, -8.6]]) o.push(piece(N, 'FlowerPatch', n('Flowers'), [x, 0, z], x, { physics: COLLIDERS.sensor }));
+	const rand = rng(1701);
+	for (let i = 0; i < 14; i++) {
+		const west = i % 2 === 0;
+		const x = west ? -7.3 + rand() * 2.8 : 4.6 + rand() * 2.8;
+		const z = west ? -6 + rand() * 10.5 : -9 + rand() * 13.5;
+		o.push(piece(N, i % 3 ? 'GrassTuft' : 'GrassTuftDry', n('Grass'), [x, 0, z], rand() * 6, { physics: COLLIDERS.sensor }));
+	}
+	// pines outside the walls, so the skyline is not empty
+	for (const [x, z, s] of [[-12, -18, 1.1], [-14, -9, 1], [-13, 2, 0.9], [12.5, -19, 1.05], [14, -6, 1.1], [13, 4, 0.95], [-3, -20, 1.2], [4, -21, 1]])
+		o.push(piece(N, 'Pine', n('Pine'), [x, 0, z], x * 0.37, { scale: s, physics: TRUNKS.Pine }));
+	return o;
+}
+
+const CASTLE_DEF = {
+	kind: 'template',
+	seed: false,
+	slug: 'castle-courtyard',
+	title: 'Castle Courtyard',
+	description:
+		'A walled courtyard built from the kits: towers, a gate, a rampart up a stair through an archway, a market stall and a well. Press Play to walk it.',
+	author: 'theprototype',
+	license: 'CC0-1.0',
+	tags: ['level design', 'kits', 'castle', 'walkable'],
+	objects: castleObjects(),
+	// a lit afternoon: a high warm sun from the south-west, a blue sky fading to haze, the
+	// packed-earth ground, and a far fog so the horizon softens
+	env: {
+		preset: 'daylight',
+		exposure: 1.05,
+		background: { top: '#4f86c6', bottom: '#dfe8ee' },
+		fog: { color: '#dfe8ee', near: 35, far: 130 },
+		ground: { color: '#7a6446', roughness: 0.95 },
+		sun: { color: '#fff1d6', intensity: 2.6, dir: [-0.55, 0.62, 0.55] },
+		hemi: { sky: '#d3e6ff', ground: '#7a6446', intensity: 1.25 }
+	},
+	// just inside the gate, looking up the avenue at the well and the rampart
+	physics: playPhysics([1, 0.3, 4.6], 0),
+	post: lookPost(0.5),
+	graphs: { scene: walkGraph() },
+	view: { pos: [9.5, 9, 13], target: [0, 2, -5] },
+	thumb: {}
+};
+
+// ---- 2. Forest Clearing ----------------------------------------------------------------
+//
+// A clearing in a ring of trees under a cliff: a stone path runs north from where you stand,
+// turns east over a footbridge where a pond narrows, and ends at a small plaster hut built
+// from the architecture kit (four walls, a doorway, a window, a slate roof). A mound to the
+// west is walkable; logs, a stump, mushrooms, ferns and flowers dress the floor.
+function forestObjects() {
+	const n = namer();
+	/** @type {any[]} */
+	const o = [];
+	// the path north, then east over the bridge to the hut
+	for (const z of [4, 2, 0, -2, -4, -6]) o.push(piece(N, 'PathTile', n('Path'), [0, 0, z], 0));
+	// the crossing, west to east: a ramp up, the footbridge (turned so its walk runs along X),
+	// a ramp down — the Ramp is architecture-kit sandstone squashed to the deck's 0.85 m
+	o.push(piece(A, 'Ramp', n('Bridge ramp'), [2, 0, -6], -H, { scale: [1, 0.85, 1], physics: COLLIDERS.ramp(1) }));
+	o.push(piece(N, 'Bridge', 'Footbridge', [4, 0, -6], H, { physics: bridgeCollider() }));
+	o.push(piece(A, 'Ramp', n('Bridge ramp'), [6, 0, -6], H, { scale: [1, 0.85, 1], physics: COLLIDERS.ramp(1) }));
+	o.push(piece(N, 'PathTile', n('Path'), [8, 0, -6], 0));
+	// the pond: its body to the north-east, a narrow neck running under the bridge
+	o.push(piece(N, 'PondWater', 'Pond', [4.8, 0.02, -10.8], 0.35, { scale: 1.7, physics: COLLIDERS.sensor }));
+	o.push(piece(N, 'PondWater', 'Pond neck', [4, 0.025, -6], H, { scale: [1.5, 1, 0.85], physics: COLLIDERS.sensor }));
+	for (const [x, z, yaw] of [[1.3, -8.4, 0.2], [7.6, -11.6, 1.2], [2.2, -11.9, 2.4], [6.8, -7.9, 0.9]]) o.push(piece(N, 'Reeds', n('Reeds'), [x, 0, z], yaw, { physics: COLLIDERS.sensor }));
+	for (const [x, z, yaw] of [[1.5, -10.5, 0.4], [7.9, -9.6, 2.2], [4.6, -12.7, 1.1]]) o.push(piece(N, 'FlatRock', n('Pond rock'), [x, 0, z], yaw));
+	for (const [x, z] of [[1.9, -7.7], [5.4, -12.6], [7.3, -8.3]]) o.push(piece(N, 'RockSmall', n('Pebble'), [x, 0, z], x));
+	// the hut: a 4 × 4 m plaster cottage (kit.md's recipe, moved to x 10..14, z -9..-5),
+	// its doorway facing the path, a window to the south
+	const hx = 10;
+	const hz = -9;
+	for (const [dx, dz] of [[1, 1], [3, 1], [1, 3], [3, 3]]) o.push(piece(A, 'FloorWood', n('Hut floor'), [hx + dx, 0, hz + dz]));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx + 1, 0, hz]));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx + 3, 0, hz]));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx + 1, 0, hz + 4]));
+	o.push(piece(A, 'WallPlasterWindow', 'Hut window wall', [hx + 3, 0, hz + 4]));
+	o.push(piece(A, 'Window', 'Hut window', [hx + 3, 0, hz + 4]));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx, 0, hz + 1], H));
+	o.push(piece(A, 'WallPlasterDoor', 'Hut doorway', [hx, 0, hz + 3], H, { physics: COLLIDERS.doorway }));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx + 4, 0, hz + 1], H));
+	o.push(piece(A, 'WallPlaster', n('Hut wall'), [hx + 4, 0, hz + 3], H));
+	for (const [dx, dz] of [[0, 0], [4, 0], [0, 4], [4, 4]]) o.push(piece(A, 'CornerPostStone', n('Hut corner'), [hx + dx, 0, hz + dz]));
+	for (const dx of [1, 3]) {
+		o.push(piece(A, 'RoofSlope', n('Hut roof'), [hx + dx, 3, hz + 3]));
+		o.push(piece(A, 'RoofSlope', n('Hut roof'), [hx + dx, 3, hz + 1], PI));
+	}
+	for (const dx of [0, 4]) {
+		o.push(piece(A, 'WallPlasterGable', n('Hut gable'), [hx + dx, 3, hz + 3], H));
+		o.push(piece(A, 'WallPlasterGable', n('Hut gable'), [hx + dx, 3, hz + 1], -H));
+	}
+	o.push(piece(A, 'Chimney', 'Hut chimney', [hx + 3, 3.7, hz + 1]));
+	// inside the hut
+	o.push(piece(P, 'Bed', 'Hut bed', [hx + 2.8, 0.1, hz + 1.25], H));
+	o.push(piece(P, 'Table', 'Hut table', [hx + 2.9, 0.1, hz + 3], 0, { scale: [0.7, 1, 0.8] }));
+	o.push(piece(P, 'Chair', 'Hut chair', [hx + 2.9, 0.1, hz + 2.2], PI));
+	o.push(piece(P, 'Rug', 'Hut rug', [hx + 1.6, 0.1, hz + 2.1], 0, { scale: 0.8, physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'Lantern', n('Lantern'), [hx + 2.9, 0.88, hz + 3], 0, { physics: COLLIDERS.sensor }));
+	o.push({ type: 'light', name: 'Hut lamp', pos: [hx + 2, 2.2, hz + 2], color: 0xffb468, intensity: 6, distance: 8, decay: 2 });
+	o.push(piece(P, 'Barrel', n('Barrel'), [hx - 0.8, 0, hz + 1.6], 0, { physics: DYNAMIC(25) }));
+	o.push(piece(P, 'Crate', n('Crate'), [hx - 0.9, 0, hz + 0.6], 0.4, { physics: DYNAMIC(15) }));
+	// the cliff behind everything, and the walkable mound to the west
+	for (const x of [-10, -6, -2, 2, 6, 10]) o.push(piece(N, 'Cliff', n('Cliff'), [x, 0, -19], x > 0 ? PI * 0.02 : 0));
+	o.push(piece(N, 'Hill', 'Grassy mound', [-9, 0, -3], 0.4, { physics: hillCollider() }));
+	// trees round the clearing
+	const trees = [
+		['Oak', -6, -9, 1.0], ['OakAutumn', -11, 4, 1.05], ['Pine', -14, -12, 1.1], ['Pine', -4, -15, 1.15], ['Birch', -3.5, -10.5, 1],
+		['Pine', 11, -15, 1.1], ['Birch', 8.5, 2.8, 1], ['Oak', 15.5, -3, 1.1], ['DeadTree', -12.5, -6, 1], ['Pine', 16, -10, 1.2],
+		['Birch', -8, 7.5, 0.95], ['Pine', 6, 10, 1.1], ['OakAutumn', 13, 5.5, 0.9], ['Pine', -15, 3, 1.05], ['Oak', 2, -15.5, 1.05]
+	];
+	// an outer ring of pines closes the clearing in (and hides the edge of the world)
+	const ring = rng(99);
+	for (let i = 0; i < 16; i++) {
+		const a = (i / 16) * 2 * PI + ring() * 0.25;
+		const r = 20 + ring() * 5;
+		trees.push([i % 5 === 2 ? 'Oak' : 'Pine', r3(2 + Math.cos(a) * r), r3(-3 + Math.sin(a) * r), r3(1 + ring() * 0.3)]);
+	}
+	for (const [item, x, z, s] of trees)
+		o.push(piece(N, /** @type {string} */ (item), n(/** @type {string} */ (item)), [/** @type {number} */ (x), 0, /** @type {number} */ (z)], /** @type {number} */ (x) * 0.61, { scale: s, physics: TRUNKS[/** @type {string} */ (item)] }));
+	// the floor of the clearing
+	o.push(piece(N, 'Log', 'Fallen log', [-3.4, 0, -1.2], 0.45));
+	o.push(piece(N, 'Stump', 'Stump', [-4.2, 0, -4.6], 0.8));
+	o.push(piece(N, 'Mushrooms', n('Mushrooms'), [-3.3, 0, -5.3], 1.3, { physics: COLLIDERS.sensor }));
+	o.push(piece(N, 'Mushrooms', n('Mushrooms'), [-6.8, 0, -7.8], 2.6, { physics: COLLIDERS.sensor }));
+	o.push(piece(N, 'BoulderCluster', 'Boulders', [-9.5, 0, -13.5], 0.9));
+	o.push(piece(N, 'RockLarge', 'Big rock', [9.5, 0, 0.5], 2.2));
+	o.push(piece(N, 'RockMedium', n('Rock'), [-1.8, 0, 7.5], 0.5));
+	o.push(piece(P, 'Signpost', 'Signpost', [1.6, 0, -3.4], -0.6));
+	o.push(piece(N, 'Stump', 'Seat stump', [-1.9, 0, 1.6], 2.0, { scale: 0.7 }));
+	const rand = rng(4242);
+	const clear = (/** @type {number} */ x, /** @type {number} */ z) => Math.abs(x) < 1.6 && z > -7.5 && z < 6.5; // the path
+	for (let i = 0; i < 16; i++) {
+		const a = rand() * 2 * PI;
+		const r = 4 + rand() * 9;
+		const x = r3(Math.cos(a) * r);
+		const z = r3(Math.sin(a) * r * 0.9 - 3);
+		if (clear(x, z) || (x > 0.8 && x < 14.5 && z > -13 && z < -3.5) || z < -16) continue; // path, bridge, pond, hut, cliff
+		const kind = i % 4 === 0 ? 'Fern' : i % 4 === 1 ? 'Bush' : i % 4 === 2 ? 'FlowerPatch' : 'BushAutumn';
+		o.push(piece(N, kind, n(kind), [x, 0, z], rand() * 6, kind === 'FlowerPatch' || kind === 'Fern' ? { physics: COLLIDERS.sensor } : {}));
+	}
+	for (let i = 0; i < 26; i++) {
+		const x = r3(-12 + rand() * 26);
+		const z = r3(-14 + rand() * 22);
+		if (clear(x, z) || (x > 0.8 && x < 14.5 && z > -13 && z < -3.5) || z < -16) continue;
+		o.push(piece(N, i % 4 ? 'GrassTuft' : 'Flowers', n('Grass'), [x, 0, z], rand() * 6, { physics: COLLIDERS.sensor }));
+	}
+	for (const [x, z, yaw] of [[-2.6, -2.8, 0.2], [2.4, 1.5, 1.4], [-5.5, 2.5, 2.9]]) o.push(piece(N, 'FallenLeaves', n('Leaves'), [x, 0.01, z], yaw, { physics: COLLIDERS.sensor }));
+	return o;
+}
+
+const FOREST_DEF = {
+	kind: 'template',
+	seed: false,
+	slug: 'forest-clearing',
+	title: 'Forest Clearing',
+	description:
+		'A clearing under a cliff: a stone path, a footbridge over the neck of a pond and a little plaster hut, ringed by oaks, pines and birches. Press Play to walk it.',
+	author: 'theprototype',
+	license: 'CC0-1.0',
+	tags: ['level design', 'kits', 'nature', 'walkable'],
+	objects: forestObjects(),
+	// late morning in the woods: a clear sky, a green ground, a warm sun through the trees
+	env: {
+		preset: 'daylight',
+		exposure: 1.05,
+		background: { top: '#5d93cf', bottom: '#dfe8e0' },
+		// the fog closes in past the tree line, so the flat ground fades into haze instead of
+		// ending in a band at the horizon (the Towers finding)
+		fog: { color: '#dfe8e0', near: 18, far: 62 },
+		ground: { color: '#5f7d3f', roughness: 1 },
+		sun: { color: '#fff3d8', intensity: 2.5, dir: [0.45, 0.72, 0.5] },
+		hemi: { sky: '#d9ecff', ground: '#5f7d3f', intensity: 1.3 }
+	},
+	physics: playPhysics([0, 0.35, 5], 0),
+	post: lookPost(0.5),
+	graphs: { scene: walkGraph() },
+	view: { pos: [-6, 7.5, 12], target: [3, 1, -6] },
+	thumb: {}
+};
+
+// ---- 3. Tavern Interior ----------------------------------------------------------------
+//
+// A two-storey room 12 × 10 m: the HALL (x -6..2) rises the full 6 m with a BALCONY along its
+// north wall, the KITCHEN (x 2..6) sits behind a partition with a doorway and has a LOFT above
+// it that opens onto the balcony. An oak staircase climbs the west wall to the balcony; a bar
+// runs under it; tables, benches, barrels and a hearth fill the rooms, and lanterns and wall
+// torches light it warm. The front door is shut: you are inside.
+function tavernObjects() {
+	const n = namer();
+	/** @type {any[]} */
+	const o = [];
+	const XS = [-5, -3, -1, 1, 3, 5];
+	const ZS = [-5, -3, -1, 1, 3];
+	// ground floor, ceiling, balcony and loft ------------------------------------------
+	for (const x of XS) for (const z of ZS) o.push(piece(A, 'FloorWood', n('Floor'), [x, 0, z]));
+	for (const x of XS) for (const z of ZS) o.push(piece(A, 'FloorWood', n('Ceiling'), [x, 6, z]));
+	for (const x of [-5, -3, -1, 1]) o.push(piece(A, 'FloorWood', n('Balcony'), [x, 3, -5]));
+	for (const x of [3, 5]) for (const z of ZS) o.push(piece(A, 'FloorWood', n('Loft'), [x, 3, z]));
+	// outer walls, two storeys: sandstone below, plaster above --------------------------
+	/** @param {number} y @param {string} solid @param {string} win @param {string} winWall */
+	const shell = (y, solid, win, winWall) => {
+		// a window's shutters are its FRONT (+Z): every wall of the shell is turned so its
+		// front faces OUT (kit.md: the Window shares its wall's position and rotation)
+		for (const x of XS) {
+			// north wall z = -6, turned to face -Z
+			if (y === 3 && x === -1) {
+				o.push(piece(A, winWall, n('Window wall'), [x, y, -6], PI));
+				o.push(piece(A, 'Window', n('Window'), [x, y, -6], PI));
+			} else o.push(piece(A, solid, n('Wall'), [x, y, -6], PI));
+			// south wall z = 4 (the front: the door, and windows)
+			if (y === 0 && x === -3) {
+				o.push(piece(A, 'WallStoneDoor', 'Front doorway', [x, y, 4]));
+				o.push(piece(A, 'Door', 'Front door', [x, y, 4]));
+			} else if ((y === 0 && (x === 1 || x === 5)) || (y === 3 && x === -3)) {
+				o.push(piece(A, winWall, n('Window wall'), [x, y, 4]));
+				o.push(piece(A, 'Window', n('Window'), [x, y, 4]));
+			} else o.push(piece(A, solid, n('Wall'), [x, y, 4]));
+		}
+		for (const z of ZS) {
+			if (y === 0 && z === 1) {
+				o.push(piece(A, winWall, n('Window wall'), [-6, y, z], -H));
+				o.push(piece(A, 'Window', n('Window'), [-6, y, z], -H));
+			} else o.push(piece(A, solid, n('Wall'), [-6, y, z], -H));
+			if (y === 0 && z === -1) {
+				o.push(piece(A, winWall, n('Window wall'), [6, y, z], H));
+				o.push(piece(A, 'Window', n('Window'), [6, y, z], H));
+			} else o.push(piece(A, solid, n('Wall'), [6, y, z], H));
+		}
+		for (const [x, z] of [[-6, -6], [6, -6], [-6, 4], [6, 4]]) o.push(piece(A, 'CornerPostStone', n('Corner post'), [x, y, z]));
+	};
+	shell(0, 'WallStone', 'Window', 'WallStoneWindow');
+	shell(3, 'WallPlaster', 'Window', 'WallPlasterWindow');
+	// the partition between hall and kitchen (x = 2), a doorway at z = 1 --------------------
+	for (const z of ZS) {
+		if (z === 1) o.push(piece(A, 'WallPlasterDoor', 'Kitchen doorway', [2, 0, z], H, { physics: COLLIDERS.doorway }));
+		else o.push(piece(A, 'WallPlaster', n('Partition'), [2, 0, z], H));
+	}
+	// the staircase up the west wall to the balcony, rails along the open edges ----------
+	o.push(piece(A, 'StairsWood', 'Balcony stairs', [-5, 0.1, -2], 0, { physics: COLLIDERS.stairs }));
+	for (const x of [-3, -1, 1]) o.push(piece(A, 'Railing', n('Balcony railing'), [x, 3.1, -3.92]));
+	for (const z of [-3, -1, 1, 3]) o.push(piece(A, 'Railing', n('Loft railing'), [2.08, 3.1, z], H));
+	o.push(piece(A, 'Column', n('Column'), [2, 0.1, -4]));
+	o.push(piece(A, 'Column', n('Column'), [-2, 0.1, -4]));
+	for (const x of [-3, -1, 1]) o.push(piece(A, 'Beam', n('Balcony beam'), [x, 2.7, -4]));
+	for (const x of [-5, -3, -1, 1]) o.push(piece(A, 'Beam', n('Ceiling beam'), [x, 5.7, -0.5]));
+	// the bar, under the balcony: half walls (scaled to counter height) with a trim top --
+	for (const x of [-2.2, -0.2]) {
+		o.push(piece(A, 'WallStoneHalf', n('Bar'), [x, 0.1, -2.6], 0, { scale: [1, 0.72, 1] }));
+		o.push(piece(A, 'Trim', n('Bar top'), [x, 1.18, -2.6]));
+	}
+	o.push(piece(P, 'Bookcase', n('Shelf'), [-1.2, 0.1, -5.5]));
+	o.push(piece(P, 'Bookcase', n('Shelf'), [0.4, 0.1, -5.5]));
+	for (const [x, z] of [[-3.4, -5.2], [-3.6, -4.4], [1.4, -5.2]]) o.push(piece(P, 'Barrel', n('Barrel'), [x, 0.1, z], x, { physics: DYNAMIC(30) }));
+	o.push(piece(P, 'Candles', n('Candles'), [-1.6, 1.38, -2.6], 0, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'Lantern', n('Lantern'), [-0.2, 1.38, -2.6], 0, { physics: COLLIDERS.sensor }));
+	for (const x of [-2.4, -1.2, 0]) o.push(piece(P, 'Chair', n('Bar stool'), [x, 0.1, -1.7], PI));
+	// the hall: two long tables with benches, a rug, a plant --------------------------
+	for (const [x, z] of [[-2.6, 1.2], [-0.2, 0.6]]) {
+		o.push(piece(P, 'Table', n('Table'), [x, 0.1, z], H));
+		o.push(piece(P, 'Bench', n('Bench'), [x - 0.75, 0.1, z], H));
+		o.push(piece(P, 'Bench', n('Bench'), [x + 0.75, 0.1, z], H));
+		o.push(piece(P, 'Candles', n('Candles'), [x, 0.88, z], 0, { physics: COLLIDERS.sensor }));
+	}
+	o.push(piece(P, 'Rug', 'Hall rug', [-1.2, 0.1, 1.0], H, { scale: 1.2, physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'PottedPlant', n('Plant'), [1.4, 0.1, 3.3]));
+	o.push(piece(P, 'PottedPlant', n('Plant'), [-5.3, 0.1, 3.3]));
+	o.push(piece(P, 'CrateTeal', n('Crate'), [-4.9, 0.1, 1.9], 0.2, { physics: DYNAMIC(12) }));
+	// the kitchen: a hearth, a cauldron, a workbench, stores -----------------------------
+	o.push(piece(A, 'Chimney', 'Hearth', [5.4, 0.1, -5.4]));
+	o.push(piece(P, 'Cauldron', 'Cauldron', [4.4, 0.1, -5], 0.4));
+	o.push(piece(P, 'Workbench', 'Workbench', [5.45, 0.1, -1.5], -H));
+	o.push(piece(P, 'Candles', n('Candles'), [5.45, 1.02, -1.2], 0, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'CrateStack', 'Kitchen crates', [4.6, 0.1, 3.2]));
+	o.push(piece(P, 'Sacks', 'Kitchen sacks', [5.2, 0.1, 1.4], 1.9));
+	o.push(piece(P, 'BarrelSmall', n('Barrel'), [3.1, 0.1, -5.3], 0, { physics: DYNAMIC(10) }));
+	// the loft: a bed, a chest, a rug, a tapestry, a plant --------------------------------
+	o.push(piece(P, 'Bed', 'Loft bed', [5, 3.1, -4.4]));
+	o.push(piece(P, 'Chest', 'Loft chest', [5.2, 3.1, 2.8], -H));
+	o.push(piece(P, 'Rug', 'Loft rug', [4.1, 3.1, -0.5], H, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'Tapestry', n('Tapestry'), [5.875, 3.9, 0.5], -H, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'Tapestry', n('Tapestry'), [-3, 3.9, -5.875], 0, { physics: COLLIDERS.sensor }));
+	o.push(piece(P, 'PottedPlant', n('Plant'), [1.3, 3.1, -5.3]));
+	// wall torches and lights ----------------------------------------------------------
+	for (const [x, z, yaw] of [[-5.875, 0.7, H], [-5.875, 2.8, H], [1.875, -1.8, -H], [-0.8, 3.875, PI], [5.875, 2, -H]])
+		o.push(piece(P, 'WallTorch', n('Wall torch'), [x, 1.55, z], yaw, { physics: COLLIDERS.sensor }));
+	for (const [x, y, z, i] of [[-3, 2.5, 1.2, 9], [0.2, 2.5, 1, 9], [-1, 2.4, -3.2, 7], [4, 2.4, -2.5, 8], [4, 5.2, -1, 8], [-2, 5.2, -5, 6], [-4.2, 2.3, -1, 5]])
+		o.push({ type: 'light', name: n('Lamp'), pos: [x, y, z], color: 0xffb060, intensity: i, distance: 11, decay: 2 });
+	return o;
+}
+
+const TAVERN_DEF = {
+	kind: 'template',
+	seed: false,
+	slug: 'tavern-interior',
+	title: 'Tavern Interior',
+	description:
+		'A two-storey tavern: a hall with a bar under the balcony, a kitchen with a hearth, and a loft up the oak stairs, lit warm by lanterns and torches. Press Play to walk it.',
+	author: 'theprototype',
+	license: 'CC0-1.0',
+	tags: ['level design', 'kits', 'interior', 'walkable'],
+	objects: tavernObjects(),
+	// an early evening outside the windows; inside, the warm lamps do the work and a warm
+	// hemisphere keeps the corners from going black
+	env: {
+		preset: 'sunset',
+		exposure: 1.1,
+		background: { top: '#3f4a78', bottom: '#f0a766' },
+		fog: null,
+		ground: { color: '#5b5040', roughness: 1 },
+		sun: { color: '#ffb06a', intensity: 1.6, dir: [0.7, 0.35, 0.6] },
+		hemi: { sky: '#ffd9ae', ground: '#6b5236', intensity: 1.2 }
+	},
+	// by the front door, the bar and the stairs ahead
+	physics: playPhysics([-1.4, 0.3, 3.3], -0.2),
+	post: lookPost(0.7),
+	graphs: { scene: walkGraph() },
+	view: { pos: [0.5, 2.1, 3.3], target: [-1.5, 1.6, -3] },
+	thumb: {}
+};
+
+module.exports = { LEVEL_DEFS: [CASTLE_DEF, FOREST_DEF, TAVERN_DEF], COLLIDERS, TRUNKS, BRIDGE_DECK, HILL_RINGS };
diff --git a/src/App.svelte b/src/App.svelte
index f93a67e8..089775f0 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -2,6 +2,10 @@
 	import { safeStorage } from '$lib/safeStorage';
   import { onMount } from 'svelte'
   import { Canvas } from '@threlte/core'
+  // 30 P0: threlte's Canvas defaults `shadows` to PCFSoftShadowMap, which three 0.185
+  // deprecates and silently downgrades to PCFShadowMap on the first shadow render (with a
+  // console warning). Asking for PCF directly is the identical picture, minus the warning.
+  import { PCFShadowMap } from 'three'
   import Scene from './components/Scene.svelte'
   import Menu from './components/Menu.svelte'
   import ConfirmModal from './components/menu/ConfirmModal.svelte'
@@ -61,6 +65,7 @@
   import { startMultiTransform } from '$lib/multiTransform'
   import { startLightParams } from '$lib/lightParams'
   import { startShadowDefaults } from '$lib/shadowDefaults'
+  import { startPackRefs } from '$lib/packRefs'
   import { startViewMode } from '$lib/viewMode'
   import { startInputRuntime } from '$lib/inputRuntime'
   // 21-E2.4: right-drag a HUD element in the viewport. Installed here rather than from
@@ -102,6 +107,7 @@ import { startMusicToolbox } from './lib/musicToolbox'
   import { loadProjectManifest } from '$lib/projectManifest'
   import { startSharedLibrary } from '$lib/sharedLibrary'
   import { startSceneIdentity } from '$lib/sceneIdentity'
+  import GameChip from './components/hud/GameChip.svelte'
   import HudLayer from './components/hud/HudLayer.svelte'
   import HudEditor from './components/editors/HudEditor.svelte'
   import { importFile, load } from '$lib/fileHandler.svelte'
@@ -191,6 +197,7 @@ import { startMusicToolbox } from './lib/musicToolbox'
     startMultiTransform()
     startLightParams()
     startShadowDefaults()
+    startPackRefs()
     startViewMode()
     startInputRuntime()
     startHudViewportDrag()
@@ -471,9 +478,16 @@ import { startMusicToolbox } from './lib/musicToolbox'
 			import('./lib/qualityGovernor'),
 			import('./lib/importBudget'),
 			import('./lib/importGate'),
-			import('./lib/decimate')
-      ]).then(([sceneStore, appStore, flowStore, meshEdit, vrControls, autosave, voiceChat, audioEngineLib, musicClockLib, audioDevicesLib, audioPatchLib, vrPatchLib, musicToolboxLib, micCaptureLib, annotationsHandler, flowRuntime, history, materialsHandler, objectActions, commandsHandler, moduleSDK, drawModeLib, pathCapture, lockControl, prefabsLib, physics, jointsLib, possessLib, handModelsLib, terrainSculptLib, userModulesLib, environmentLib, sceneMusicLib, animatedImports, fileHandler, fileWindowsLib, sceneBounds, cameraClip, ping, sessionsLib, geometryEdit, lightParams, shadowDefaultsLib, paletteLib, viewModeLib, inputRuntimeLib, shortcutsLib, themesLib, vrRadialMenu, vrPaletteLib, vrWindowPosesLib, vrKeyboardLib, faceEditLib, meshToolParamsLib, avatarModelLib, explorerLib, bottomDock, explorerDrop, assetShare, soundRuntime, dungeonPlay, sceneAssetsLib, THREE, GLTFExporterModule, snappingLib, flowSocketsLib, networkQualityLib, packsLib, customNodesLib, nodesHandlerLib, nodeCatalogLib, objectMenuLib, animationPreviewLib, aiProvidersLib, aiToolsLib, aiAssistantLib, meshProvidersLib, meshJobsLib, flowGraphsLib, objectFlowLib, peerServerLib, cloudHooksLib, cloudPluginLib, connectionStateLib, peerApprovalLib, particleRuntimeLib, particleActionsLib, particlePresetsLib, versionLib, whatsNewLib, confirmDialogLib, scenePhysicsLib, playInteractLib, moveSmoothingLib, knockLib, playSettingsLib, colliderSpecLib, colliderHelpersLib, colliderEditLib, editSessionLib, trackpadNavLib, vrSleeveLib, gridSettingsLib, viewPrefsLib, cameraBookmarksLib, cameraObjectsLib, cameraHelpersLib, onionSkinLib, cameraPreviewLib, addObjectsLib, cameraPipLib, inputDeviceLib, sceneTemplatesLib, bvhPickingLib, multiTransformLib, objectOriginLib, moduleGalleryLib, uvEditorLib, uvUnwrapLib, meshTopologyLib, meshBudgetLib, proportionalLib, proportionalRingLib, scenePickLib, snapEngineLib, meshPivotLib, selectionPrefsLib, editOverlaysLib, objectPermissionsLib, scenePostLib, postEffectsLib, viewportOverridesLib, postprocessingModule, shaderBackendsLib, shaderGraphLib, shaderSyncLib, shaderTexturesLib, shaderCatalogLib, unitsLib, postBackendsLib, workspaceLib, editResumeLib, moduleRequirementsLib, hudDocsLib, hudSyncLib, idbLib, hudKindsLib, hudImagesLib, gameStateLib, gameSyncLib, hudActionsLib, moduleNodeIOLib, moduleToolboxesLib, splineTubeLib, splineToolLib, splineEditLib, terrainCarveLib, flattenActionsLib, hudViewportDragLib, gamepadPrefsLib, charControllerLib, hudRichTextLib, moduleHudKindsLib, hudMinimapLib, hudArrangeLib, gamePresenceLib, levelsLib, peerVarsLib, projectManifestLib, projectFileLib, transientObjectsLib, spawnerLib, triggerSyncLib, saveNameLib, sceneIdentityLib, importDuplicatesLib, peerScenesLib, sharedLibraryLib, transferLedgerLib, explorerViewLib, filePreviewLib, saveAsLib, windowTabsLib, colocationLib, colocationCalibrateLib, colocationPresenceLib, xrAnchorsLib, colocationAnchorsLib, colocationNudgeLib, mountedVolumesLib, storageUsageLib, scenePrivacyLib, touchControlsLib, playModeLib, objectListNavLib, inviteLinksLib, helperLayerLib, explorerClipboardLib, lookPresenceLib, postGraphsLib, postGraphPresetsLib, materialSharingLib, diagnosticsLib, wireValidateLib, wireErrorsLib, safeStorageLib, sceneBudgetLib, overloadGuardLib, qualityGovernorLib, importBudgetLib, importGateLib, decimateLib]) => {
-        window.__stores = { ...sceneStore, ...appStore, ...flowStore, meshEdit, vrControls, autosave, voiceChat, audioEngine: audioEngineLib, musicClock: musicClockLib, audioDevices: audioDevicesLib, audioPatch: audioPatchLib, vrPatch: vrPatchLib, musicToolbox: musicToolboxLib, micCapture: micCaptureLib, annotationsHandler, flowRuntime, history, materialsHandler, objectActions, commandsHandler, moduleSDK, drawMode: drawModeLib, pathCapture, lockControl, prefabs: prefabsLib, physics, joints: jointsLib, possess: possessLib, handModels: handModelsLib, terrainSculpt: terrainSculptLib, userModules: userModulesLib, environment: environmentLib, sceneMusic: sceneMusicLib, animatedImports, fileHandler, fileWindows: fileWindowsLib, sceneBounds, cameraClip, ping, sessions: sessionsLib, geometryEdit, lightParams, shadowDefaults: shadowDefaultsLib, palette: paletteLib, viewModeCtl: viewModeLib, inputRuntime: inputRuntimeLib, shortcutsRegistry: shortcutsLib, themes: themesLib, vrRadialMenu, vrPalette: vrPaletteLib, vrWindowPoses: vrWindowPosesLib, vrKeyboard: vrKeyboardLib, faceEdit: faceEditLib, meshToolParams: meshToolParamsLib, avatarModel: avatarModelLib, explorer: explorerLib, bottomDock, explorerDrop, assetShare, soundRuntime, dungeonPlay, sceneAssets: sceneAssetsLib, THREE, GLTFExporterModule, snapping: snappingLib, flowSockets: flowSocketsLib, networkQuality: networkQualityLib, packs: packsLib, customNodes: customNodesLib, nodesHandler: nodesHandlerLib, nodeCatalog: nodeCatalogLib, objectMenu: objectMenuLib, animationPreview: animationPreviewLib, aiProviders: aiProvidersLib, aiTools: aiToolsLib, aiAssistant: aiAssistantLib, meshProviders: meshProvidersLib, meshJobs: meshJobsLib, flowGraphsCtl: flowGraphsLib, objectFlow: objectFlowLib, peerServer: peerServerLib, cloudHooks: cloudHooksLib, cloudPlugin: cloudPluginLib, connectionState: connectionStateLib, peerApproval: peerApprovalLib, particleRuntime: particleRuntimeLib, particleActions: particleActionsLib, particlePresets: particlePresetsLib, version: versionLib, whatsNew: whatsNewLib, confirmDialog: confirmDialogLib, scenePhysics: scenePhysicsLib, playInteract: playInteractLib, moveSmoothing: moveSmoothingLib, knock: knockLib, playSettings: playSettingsLib, colliderSpec: colliderSpecLib, colliderHelpers: colliderHelpersLib, colliderEdit: colliderEditLib, editSession: editSessionLib, trackpadNav: trackpadNavLib, vrSleeve: vrSleeveLib, gridSettings: gridSettingsLib, viewPrefs: viewPrefsLib, cameraBookmarks: cameraBookmarksLib, cameraObjects: cameraObjectsLib, cameraHelpers: cameraHelpersLib, onionSkin: onionSkinLib, cameraPreview: cameraPreviewLib, addObjects: addObjectsLib, cameraPip: cameraPipLib, inputDevice: inputDeviceLib, sceneTemplates: sceneTemplatesLib, bvhPicking: bvhPickingLib, multiTransform: multiTransformLib, objectOrigin: objectOriginLib, moduleGallery: moduleGalleryLib, uvEditor: uvEditorLib, uvUnwrap: uvUnwrapLib, meshTopology: meshTopologyLib, meshBudget: meshBudgetLib, proportional: proportionalLib, proportionalRing: proportionalRingLib, scenePick: scenePickLib, snapEngine: snapEngineLib, meshPivot: meshPivotLib, selectionPrefs: selectionPrefsLib, editOverlays: editOverlaysLib, objectPermissions: objectPermissionsLib, scenePost: scenePostLib, postEffects: postEffectsLib, viewportOverrides: viewportOverridesLib, postprocessing: postprocessingModule, shaderBackends: shaderBackendsLib, shaderGraph: shaderGraphLib, shaderSync: shaderSyncLib, shaderTextures: shaderTexturesLib, shaderCatalog: shaderCatalogLib, units: unitsLib, postBackends: postBackendsLib, workspace: workspaceLib, editResume: editResumeLib, moduleRequirements: moduleRequirementsLib, hudDocs: hudDocsLib, hudSync: hudSyncLib, idb: idbLib, hudKinds: hudKindsLib, hudImages: hudImagesLib, gameState: gameStateLib, gameSync: gameSyncLib, hudActions: hudActionsLib, moduleNodeIO: moduleNodeIOLib, moduleToolboxes: moduleToolboxesLib, splineTube: splineTubeLib, splineTool: splineToolLib, splineEdit: splineEditLib, terrainCarve: terrainCarveLib, flattenActions: flattenActionsLib, hudViewportDrag: hudViewportDragLib, gamepadPrefs: gamepadPrefsLib, charController: charControllerLib, hudRichText: hudRichTextLib, moduleHudKinds: moduleHudKindsLib, hudMinimap: hudMinimapLib, hudArrange: hudArrangeLib, gamePresence: gamePresenceLib, levels: levelsLib, peerVars: peerVarsLib, projectManifest: projectManifestLib, projectFile: projectFileLib, transientObjects: transientObjectsLib, spawner: spawnerLib, triggerSync: triggerSyncLib, saveName: saveNameLib, sceneIdentity: sceneIdentityLib, importDuplicates: importDuplicatesLib, peerScenes: peerScenesLib, sharedLibrary: sharedLibraryLib, transferLedger: transferLedgerLib, explorerView: explorerViewLib, filePreview: filePreviewLib, saveAs: saveAsLib, windowTabs: windowTabsLib, colocation: colocationLib, colocationCalibrate: colocationCalibrateLib, colocationPresence: colocationPresenceLib, xrAnchors: xrAnchorsLib, colocationAnchors: colocationAnchorsLib, colocationNudge: colocationNudgeLib, mountedVolumes: mountedVolumesLib, storageUsage: storageUsageLib, scenePrivacy: scenePrivacyLib, touchControls: touchControlsLib, playMode: playModeLib, objectListNav: objectListNavLib, inviteLinks: inviteLinksLib, helperLayer: helperLayerLib, explorerClipboard: explorerClipboardLib, lookPresence: lookPresenceLib, postGraphs: postGraphsLib, postGraphPresets: postGraphPresetsLib, materialSharing: materialSharingLib, diagnostics: diagnosticsLib, wireValidate: wireValidateLib, wireErrors: wireErrorsLib, safeStorage: safeStorageLib, sceneBudget: sceneBudgetLib, overloadGuard: overloadGuardLib, qualityGovernor: qualityGovernorLib, importBudget: importBudgetLib, importGate: importGateLib, decimate: decimateLib }
+			import('./lib/decimate'),
+			import('./lib/playCursor'),
+			import('./lib/gameStorage'),
+			// 30b (vr-play): the game-feel leaves under ONE name
+			import('./lib/gameKit'),
+			import('./lib/moduleWorld'),
+			import('./lib/playSpawn'),
+			import('./lib/packRefs')
+      ]).then(([sceneStore, appStore, flowStore, meshEdit, vrControls, autosave, voiceChat, audioEngineLib, musicClockLib, audioDevicesLib, audioPatchLib, vrPatchLib, musicToolboxLib, micCaptureLib, annotationsHandler, flowRuntime, history, materialsHandler, objectActions, commandsHandler, moduleSDK, drawModeLib, pathCapture, lockControl, prefabsLib, physics, jointsLib, possessLib, handModelsLib, terrainSculptLib, userModulesLib, environmentLib, sceneMusicLib, animatedImports, fileHandler, fileWindowsLib, sceneBounds, cameraClip, ping, sessionsLib, geometryEdit, lightParams, shadowDefaultsLib, paletteLib, viewModeLib, inputRuntimeLib, shortcutsLib, themesLib, vrRadialMenu, vrPaletteLib, vrWindowPosesLib, vrKeyboardLib, faceEditLib, meshToolParamsLib, avatarModelLib, explorerLib, bottomDock, explorerDrop, assetShare, soundRuntime, dungeonPlay, sceneAssetsLib, THREE, GLTFExporterModule, snappingLib, flowSocketsLib, networkQualityLib, packsLib, customNodesLib, nodesHandlerLib, nodeCatalogLib, objectMenuLib, animationPreviewLib, aiProvidersLib, aiToolsLib, aiAssistantLib, meshProvidersLib, meshJobsLib, flowGraphsLib, objectFlowLib, peerServerLib, cloudHooksLib, cloudPluginLib, connectionStateLib, peerApprovalLib, particleRuntimeLib, particleActionsLib, particlePresetsLib, versionLib, whatsNewLib, confirmDialogLib, scenePhysicsLib, playInteractLib, moveSmoothingLib, knockLib, playSettingsLib, colliderSpecLib, colliderHelpersLib, colliderEditLib, editSessionLib, trackpadNavLib, vrSleeveLib, gridSettingsLib, viewPrefsLib, cameraBookmarksLib, cameraObjectsLib, cameraHelpersLib, onionSkinLib, cameraPreviewLib, addObjectsLib, cameraPipLib, inputDeviceLib, sceneTemplatesLib, bvhPickingLib, multiTransformLib, objectOriginLib, moduleGalleryLib, uvEditorLib, uvUnwrapLib, meshTopologyLib, meshBudgetLib, proportionalLib, proportionalRingLib, scenePickLib, snapEngineLib, meshPivotLib, selectionPrefsLib, editOverlaysLib, objectPermissionsLib, scenePostLib, postEffectsLib, viewportOverridesLib, postprocessingModule, shaderBackendsLib, shaderGraphLib, shaderSyncLib, shaderTexturesLib, shaderCatalogLib, unitsLib, postBackendsLib, workspaceLib, editResumeLib, moduleRequirementsLib, hudDocsLib, hudSyncLib, idbLib, hudKindsLib, hudImagesLib, gameStateLib, gameSyncLib, hudActionsLib, moduleNodeIOLib, moduleToolboxesLib, splineTubeLib, splineToolLib, splineEditLib, terrainCarveLib, flattenActionsLib, hudViewportDragLib, gamepadPrefsLib, charControllerLib, hudRichTextLib, moduleHudKindsLib, hudMinimapLib, hudArrangeLib, gamePresenceLib, levelsLib, peerVarsLib, projectManifestLib, projectFileLib, transientObjectsLib, spawnerLib, triggerSyncLib, saveNameLib, sceneIdentityLib, importDuplicatesLib, peerScenesLib, sharedLibraryLib, transferLedgerLib, explorerViewLib, filePreviewLib, saveAsLib, windowTabsLib, colocationLib, colocationCalibrateLib, colocationPresenceLib, xrAnchorsLib, colocationAnchorsLib, colocationNudgeLib, mountedVolumesLib, storageUsageLib, scenePrivacyLib, touchControlsLib, playModeLib, objectListNavLib, inviteLinksLib, helperLayerLib, explorerClipboardLib, lookPresenceLib, postGraphsLib, postGraphPresetsLib, materialSharingLib, diagnosticsLib, wireValidateLib, wireErrorsLib, safeStorageLib, sceneBudgetLib, overloadGuardLib, qualityGovernorLib, importBudgetLib, importGateLib, decimateLib, playCursorLib, gameStorageLib, gameKitLib, moduleWorldLib, playSpawnLib, packRefsLib]) => {
+        window.__stores = { ...sceneStore, ...appStore, ...flowStore, meshEdit, vrControls, autosave, voiceChat, audioEngine: audioEngineLib, musicClock: musicClockLib, audioDevices: audioDevicesLib, audioPatch: audioPatchLib, vrPatch: vrPatchLib, musicToolbox: musicToolboxLib, micCapture: micCaptureLib, annotationsHandler, flowRuntime, history, materialsHandler, objectActions, commandsHandler, moduleSDK, drawMode: drawModeLib, pathCapture, lockControl, prefabs: prefabsLib, physics, joints: jointsLib, possess: possessLib, handModels: handModelsLib, terrainSculpt: terrainSculptLib, userModules: userModulesLib, environment: environmentLib, sceneMusic: sceneMusicLib, animatedImports, fileHandler, fileWindows: fileWindowsLib, sceneBounds, cameraClip, ping, sessions: sessionsLib, geometryEdit, lightParams, shadowDefaults: shadowDefaultsLib, palette: paletteLib, viewModeCtl: viewModeLib, inputRuntime: inputRuntimeLib, shortcutsRegistry: shortcutsLib, themes: themesLib, vrRadialMenu, vrPalette: vrPaletteLib, vrWindowPoses: vrWindowPosesLib, vrKeyboard: vrKeyboardLib, faceEdit: faceEditLib, meshToolParams: meshToolParamsLib, avatarModel: avatarModelLib, explorer: explorerLib, bottomDock, explorerDrop, assetShare, soundRuntime, dungeonPlay, sceneAssets: sceneAssetsLib, THREE, GLTFExporterModule, snapping: snappingLib, flowSockets: flowSocketsLib, networkQuality: networkQualityLib, packs: packsLib, customNodes: customNodesLib, nodesHandler: nodesHandlerLib, nodeCatalog: nodeCatalogLib, objectMenu: objectMenuLib, animationPreview: animationPreviewLib, aiProviders: aiProvidersLib, aiTools: aiToolsLib, aiAssistant: aiAssistantLib, meshProviders: meshProvidersLib, meshJobs: meshJobsLib, flowGraphsCtl: flowGraphsLib, objectFlow: objectFlowLib, peerServer: peerServerLib, cloudHooks: cloudHooksLib, cloudPlugin: cloudPluginLib, connectionState: connectionStateLib, peerApproval: peerApprovalLib, particleRuntime: particleRuntimeLib, particleActions: particleActionsLib, particlePresets: particlePresetsLib, version: versionLib, whatsNew: whatsNewLib, confirmDialog: confirmDialogLib, scenePhysics: scenePhysicsLib, playInteract: playInteractLib, moveSmoothing: moveSmoothingLib, knock: knockLib, playSettings: playSettingsLib, colliderSpec: colliderSpecLib, colliderHelpers: colliderHelpersLib, colliderEdit: colliderEditLib, editSession: editSessionLib, trackpadNav: trackpadNavLib, vrSleeve: vrSleeveLib, gridSettings: gridSettingsLib, viewPrefs: viewPrefsLib, cameraBookmarks: cameraBookmarksLib, cameraObjects: cameraObjectsLib, cameraHelpers: cameraHelpersLib, onionSkin: onionSkinLib, cameraPreview: cameraPreviewLib, addObjects: addObjectsLib, cameraPip: cameraPipLib, inputDevice: inputDeviceLib, sceneTemplates: sceneTemplatesLib, bvhPicking: bvhPickingLib, multiTransform: multiTransformLib, objectOrigin: objectOriginLib, moduleGallery: moduleGalleryLib, uvEditor: uvEditorLib, uvUnwrap: uvUnwrapLib, meshTopology: meshTopologyLib, meshBudget: meshBudgetLib, proportional: proportionalLib, proportionalRing: proportionalRingLib, scenePick: scenePickLib, snapEngine: snapEngineLib, meshPivot: meshPivotLib, selectionPrefs: selectionPrefsLib, editOverlays: editOverlaysLib, objectPermissions: objectPermissionsLib, scenePost: scenePostLib, postEffects: postEffectsLib, viewportOverrides: viewportOverridesLib, postprocessing: postprocessingModule, shaderBackends: shaderBackendsLib, shaderGraph: shaderGraphLib, shaderSync: shaderSyncLib, shaderTextures: shaderTexturesLib, shaderCatalog: shaderCatalogLib, units: unitsLib, postBackends: postBackendsLib, workspace: workspaceLib, editResume: editResumeLib, moduleRequirements: moduleRequirementsLib, hudDocs: hudDocsLib, hudSync: hudSyncLib, idb: idbLib, hudKinds: hudKindsLib, hudImages: hudImagesLib, gameState: gameStateLib, gameSync: gameSyncLib, hudActions: hudActionsLib, moduleNodeIO: moduleNodeIOLib, moduleToolboxes: moduleToolboxesLib, splineTube: splineTubeLib, splineTool: splineToolLib, splineEdit: splineEditLib, terrainCarve: terrainCarveLib, flattenActions: flattenActionsLib, hudViewportDrag: hudViewportDragLib, gamepadPrefs: gamepadPrefsLib, charController: charControllerLib, hudRichText: hudRichTextLib, moduleHudKinds: moduleHudKindsLib, hudMinimap: hudMinimapLib, hudArrange: hudArrangeLib, gamePresence: gamePresenceLib, levels: levelsLib, peerVars: peerVarsLib, projectManifest: projectManifestLib, projectFile: projectFileLib, transientObjects: transientObjectsLib, spawner: spawnerLib, triggerSync: triggerSyncLib, saveName: saveNameLib, sceneIdentity: sceneIdentityLib, importDuplicates: importDuplicatesLib, peerScenes: peerScenesLib, sharedLibrary: sharedLibraryLib, transferLedger: transferLedgerLib, explorerView: explorerViewLib, filePreview: filePreviewLib, saveAs: saveAsLib, windowTabs: windowTabsLib, colocation: colocationLib, colocationCalibrate: colocationCalibrateLib, colocationPresence: colocationPresenceLib, xrAnchors: xrAnchorsLib, colocationAnchors: colocationAnchorsLib, colocationNudge: colocationNudgeLib, mountedVolumes: mountedVolumesLib, storageUsage: storageUsageLib, scenePrivacy: scenePrivacyLib, touchControls: touchControlsLib, playMode: playModeLib, objectListNav: objectListNavLib, inviteLinks: inviteLinksLib, helperLayer: helperLayerLib, explorerClipboard: explorerClipboardLib, lookPresence: lookPresenceLib, postGraphs: postGraphsLib, postGraphPresets: postGraphPresetsLib, materialSharing: materialSharingLib, diagnostics: diagnosticsLib, wireValidate: wireValidateLib, wireErrors: wireErrorsLib, safeStorage: safeStorageLib, sceneBudget: sceneBudgetLib, overloadGuard: overloadGuardLib, qualityGovernor: qualityGovernorLib, importBudget: importBudgetLib, importGate: importGateLib, decimate: decimateLib, playCursor: playCursorLib, gameStorage: gameStorageLib, gameKit: gameKitLib, moduleWorld: moduleWorldLib, playSpawn: playSpawnLib, packRefs: packRefsLib }
       })
     }
   })
@@ -568,6 +582,10 @@ import { startMusicToolbox } from './lib/musicToolbox'
      above (a game HUD that dies when you press play is no HUD at all). --z-hud, no
      new tier: it beats the camera PiP and loses to modal/toast/menu. -->
 <HudLayer />
+<!-- 30 P1: the game chip — "Game · <state>" + ▶ Test play. Beside HudLayer because it is the
+     editor's stand-in for a game's screens, which HudLayer no longer draws outside Play.
+     Editor-only (it hides itself in Play, in VR and in embed mode). -->
+<GameChip />
 
 <!-- W9: THE VIEWPORT IS A LAYOUT REGION.
      threlte's Canvas fills its parent (`width/height: 100%`) and sizes the renderer
@@ -582,7 +600,7 @@ import { startMusicToolbox } from './lib/musicToolbox'
      step reallocates the composer's render targets, so animating the inset turns one
      realloc into one per frame. -->
 <div class="viewport" class:viewport-inset={$viewPrefs.dockPushesViewport && !$embedMode}>
-  <Canvas>
+  <Canvas shadows={PCFShadowMap}>
     <Scene />
   </Canvas>
 </div>
diff --git a/src/components/LockHighlights.svelte b/src/components/LockHighlights.svelte
index c61921b1..50e2811a 100644
--- a/src/components/LockHighlights.svelte
+++ b/src/components/LockHighlights.svelte
@@ -4,6 +4,8 @@
 	import { lockedObjects, objectsGroup } from '../stores/sceneStore';
 	import { peers } from '../stores/appStore';
 	import { peerColor } from '$lib/lockControl';
+	// 30b P1: who-holds-what boxes are editor information - none in Interact/Play
+	import { editorHelpersShown } from '$lib/helperLayer';
 
 	// Wireframe box around every object locked by ANOTHER peer, tinted with
 	// that peer's color (same hash as pings/cursors). Boxes track the object
@@ -16,6 +18,7 @@
 	const helpers = new Map();
 
 	useTask(() => {
+		group.visible = $editorHelpersShown;
 		/** @type {any} */
 		const peer = $peers;
 		const scene = $objectsGroup;
diff --git a/src/components/Outline.svelte b/src/components/Outline.svelte
index 760800b0..ccbf5950 100644
--- a/src/components/Outline.svelte
+++ b/src/components/Outline.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { objectsGroup, selectedObjects, lockedObjects, viewMode, TControls, isLocked } from '../stores/sceneStore.js';
+	import { objectsGroup, selectedObjects, lockedObjects, viewMode, TControls, isLocked, editorMode } from '../stores/sceneStore.js';
 	import { showToast } from '../stores/appStore.js';
 	import { get } from 'svelte/store';
 	import { chromiumMajor, postSupported } from '$lib/viewMode';
@@ -504,7 +504,9 @@
 		// information — who has what selected, what a peer has locked — and in play
 		// mode they are glare over the thing you are playing with, which is the same
 		// argument the mesh-edit session already makes one line up.
-		const playing = $isLocked;
+		// 30b P1: ...and in INTERACT, which is play's hands without play's lock: a
+		// player-style view of the scene has no selection glare either
+		const playing = $isLocked || $editorMode === 'interact';
 		if ($objectsGroup && !editing && !playing)
 			for (const uuid of $selectedObjects) addMeshes(outlineEffectSelected.selection, uuid);
 		outlineEffectLocked.selection.clear();
diff --git a/src/components/Scene.svelte b/src/components/Scene.svelte
index 8a36b46d..e1fd898b 100644
--- a/src/components/Scene.svelte
+++ b/src/components/Scene.svelte
@@ -9,7 +9,7 @@
 	import { peers, username, userdata, specatorMode, avatarConfig, viewportMenu, objectContextMenu, viewportMenuOpener, addMenu, addMenuOpener, showToast, multiSelectMode } from '../stores/appStore';
 	import { get } from 'svelte/store';
 	import { vrPostEnabled } from '$lib/viewportOverrides';
-	import { isLocked, editorCam, isVRMode, globalScene, objectsGroup, showGrid, TControls, selectedObject, selectedObjects, lockedObjects, marqueeRect, worldRig, vrOverride, specators, globalCamera, globalRenderer, orbitControls, passthroughActive, sessionCompositesOverRoom, vrObjectsPanelOpen, vrPaletteOpen, vrPropsPanelOpen, vrPrefabsPanelOpen, vrChatPanelOpen, vrEditMenuOpen, vrSnapMenuOpen, vrSettingsPanelOpen, vrApprovePanelOpen, vrToolMode, viewMode, contextLost } from '../stores/sceneStore';
+	import { isLocked, editorMode, editorCam, isVRMode, globalScene, objectsGroup, showGrid, TControls, selectedObject, selectedObjects, lockedObjects, marqueeRect, worldRig, vrOverride, specators, globalCamera, globalRenderer, orbitControls, passthroughActive, sessionCompositesOverRoom, vrObjectsPanelOpen, vrPaletteOpen, vrPropsPanelOpen, vrPrefabsPanelOpen, vrChatPanelOpen, vrEditMenuOpen, vrSnapMenuOpen, vrSettingsPanelOpen, vrApprovePanelOpen, vrToolMode, viewMode, contextLost } from '../stores/sceneStore';
 	import {
 		selectObject,
 		deselectObject,
@@ -29,10 +29,14 @@
 	import { holdBody, releaseBody } from '$lib/physics';
 	import { sculptObject, enterSculpt, beginStroke, strokeMove, endStroke as sculptEndStroke, showCursorAt, hideCursor } from '$lib/terrainSculpt';
 	import { sceneHits } from '$lib/scenePick';
-	import { startPlayInteract, tickPlayInteract, stopPlayInteract, carriedUuid } from '$lib/playInteract';
+	import { pickStack, chooseInStack } from '$lib/selectThrough';
+	import { tickModuleProxy, selectModuleGroup, moduleGroupOf } from '$lib/moduleContent';
+	import { setModuleWorldRoot } from '$lib/moduleWorld';
+	import { startPlayInteract, tickPlayInteract, stopPlayInteract, carriedUuid, editorInteractActive, cursorGrabStart, cursorGrabMove, cursorGrabEnd, interactClick } from '$lib/playInteract';
+	import { registerKeySessionProbe } from '$lib/shortcuts';
 	import { startKnock, tickKnock, stopKnock } from '$lib/knock';
 	import { tickMoveSmoothing } from '$lib/moveSmoothing';
-	import { moduleClickHandlers, moduleInteractiveGroups, fireClickMiss } from '$lib/moduleSDK';
+	import { moduleInteractiveGroups, fireClickMiss, runClickHandlers } from '$lib/moduleSDK';
 	import { updateSpatialAudio } from '$lib/voiceChat';
 	import { tickAnimatedMixers } from '$lib/animatedImports';
 	import { tickAnimationPreview, captureAutoKey, playheadOf } from '$lib/animationPreview';
@@ -51,7 +55,10 @@
 	// the annotation is TS syntax — a JSDoc @type cast is ignored here (the documented trap).
 	let knifeFrom: number[] | null = null;
 	import { peerScenes } from '$lib/peerScenes';
-	import { initVRControls, updateVRControls, raycastMenu, raycastPanel, raycastPalette, raycastProps, raycastPrefabs, raycastKeyboard, raycastChat, raycastEdit, raycastSnap, raycastSettings, raycastApprove, placePrefabGhost, vrFaceTrigger, vrVertexTrigger, vrVertexGrabStart, vrVertexGrabEnd, beginStretchSliderDrag, endStretchSliderDrag, executeVRMenuAction, resetWorldRig, onInputSourcesChange, worldToContentPose, boxSelectStart, boxSelectEnd, boxSelectActive, applyVRFrameRate, shouldSendHands, onHandPinchStart, onHandPinchEnd, pinchMenuToggledAt, firePingIfArmed, vrModuleTriggerStart, vrModuleTriggerEnd, vrModuleSelectSwallowed, handSnapshot, vrGrabbedUuid, hapticPulse } from '$lib/vrControls';
+	import { initVRControls, updateVRControls, raycastMenu, raycastPanel, raycastPalette, raycastProps, raycastPrefabs, raycastKeyboard, raycastChat, raycastEdit, raycastSnap, raycastSettings, raycastApprove, placePrefabGhost, vrFaceTrigger, vrVertexTrigger, vrVertexGrabStart, vrVertexGrabEnd, beginStretchSliderDrag, endStretchSliderDrag, executeVRMenuAction, resetWorldRig, onInputSourcesChange, worldToContentPose, boxSelectStart, boxSelectEnd, boxSelectActive, applyVRFrameRate, shouldSendHands, onHandPinchStart, onHandPinchEnd, pinchMenuToggledAt, firePingIfArmed, vrModuleTriggerStart, vrModuleTriggerEnd, vrModuleSelectSwallowed, handSnapshot, vrGrabbedUuid, hapticKnock, hapticPulse, onVRSessionStart } from '$lib/vrControls';
+	// 30b (vr-play): the game in your hands — hover/press haptics (P1), the sweep (P4)
+	import { startVrGameInput, stopVrGameInput } from '$lib/vrGameInput';
+	import { gameFeelActive } from '$lib/gameFeel';
 	import { vrKeyboardTarget } from '$lib/vrKeyboard';
 	import { measureMode, measureClick } from '$lib/measure';
 	import { pinsGroup, openAnnotation, showNotePins } from '$lib/annotationsHandler';
@@ -95,7 +102,51 @@
 	import { Mesh, Vector3 } from 'three'
 
 
-	let { scene, camera, renderer, dpr } = useThrelte();
+	let { scene, camera, renderer, dpr, dom } = useThrelte();
+
+	// 30 P0: THE POINTER-CAPTURE THROW — ~100 errors on a Quest were one per press.
+	// three 0.185's OrbitControls.onPointerDown calls `domElement.setPointerCapture` with
+	// no guard (its TransformControls sibling guards exactly this), and Chromium refuses a
+	// capture with InvalidStateError while the page holds a pointer lock — which is every
+	// press in play, since the editor controls stay mounted there. The throw lands before
+	// `_addPointer`, so it fired once per press and surfaced as "Something went wrong".
+	// Two halves: the controls stand down while playing (syncOrbitForPlay, per frame), and
+	// the capture itself is guarded on the element they listen on — the smaller of the two
+	// ways to reach it (a subclass would mean replacing threlte's <OrbitControls> with a
+	// hand-built <T is>), and it covers the camera preview's OrbitControls too, which
+	// listens on the same element. It calls the PROTOTYPE method at call time rather than
+	// a captured copy, so nothing else on the element is shadowed for good.
+	const pointerCaptureGuard = (el: any) => {
+		if (!el || typeof el.setPointerCapture !== 'function' || el.__captureGuarded) return () => {};
+		el.__captureGuarded = true;
+		el.setPointerCapture = function (this: any, pointerId: number) {
+			if (this.ownerDocument?.pointerLockElement) return; // the lock already owns the pointer
+			return Element.prototype.setPointerCapture.call(this, pointerId);
+		};
+		return () => {
+			delete el.setPointerCapture;
+			delete el.__captureGuarded;
+		};
+	};
+	onDestroy(pointerCaptureGuard(dom));
+	// the first half: while playing, every OrbitControls that drives the view stands
+	// down. Per FRAME rather than on the isLocked edge, because <TransformControls>
+	// unmounts in play and its auto-pause CLEANUP writes `enabled = true`
+	// unconditionally a tick later (the enableZoom note on the mount below) — a write on
+	// the edge would be stomped. Whatever this stood down comes back when play ends.
+	const orbitStoodDown = new Set<any>();
+	function syncOrbitForPlay() {
+		const controls: any = $activeOrbit;
+		if ($isLocked === true) {
+			if (controls && controls.enabled !== false) {
+				controls.enabled = false;
+				orbitStoodDown.add(controls);
+			}
+		} else if (orbitStoodDown.size) {
+			for (const stood of orbitStoodDown) stood.enabled = true;
+			orbitStoodDown.clear();
+		}
+	}
 
 	// 26-D: the quality governor's two knobs that live here. Resolution goes through
 	// threlte's OWN dpr (renderer.setPixelRatio directly would be undone by threlte's resize
@@ -276,6 +327,7 @@
 
 	useTask((delta) => {
 		rotation += 0.25 * delta;
+		syncOrbitForPlay(); // 30 P0: the editor camera controls stand down while playing
 		// 21-B B3: play-mode grab/carry. The ray is NDC (0,0) every frame, so it
 		// belongs in the frame loop rather than on a pointer event.
 		tickPlayInteract(delta, camera.current);
@@ -346,6 +398,7 @@
 		updateCables(); // 23-A4: patch cables follow their plugs; the routing diff runs here too
 		updateOnionSkin(); // 17-E F6: ghosts at the neighbouring keys (local, off by default)
 		updateTinyMarkers(); // R2: a dot to aim at when an object has no size left
+		tickModuleProxy(); // 30 P3: a selected module group's proxy box follows its content
 		if (!renderer.xr.isPresenting) updateEditorNavigation(delta, camera.current, $activeOrbit);
 	});
 
@@ -443,35 +496,66 @@
 		return sceneHits(selectionRaycaster, { tinyProxies: true });
 	}
 
-	function runModuleClickHandlers(hit) {
-		for (const handler of moduleClickHandlers) {
-			try {
-				if (handler(hit)) return true;
-			} catch (error) {
-				console.log('module click handler failed', error);
-			}
-		}
-		return false;
+	// 30 P1: ONE dispatch, filtered by the mode the click came from — 'edit' (the editor
+	// pick: only handlers that asked for Edit), 'play' (the play tap), or null (VR's
+	// trigger, which has no editor mode yet and still offers every handler first)
+	function runModuleClickHandlers(hit: any, mode: string | null = null) {
+		return runClickHandlers(hit, mode);
 	}
 
 	// 15-O: double-click detection for "open the properties panel" — reuses the
 	// existing click path instead of a separate dblclick listener. Declared at
 	// COMPONENT scope: raycastSelect lives here, not in the pointer-handler block.
 	let lastPick: { uuid: string | null; t: number } = { uuid: null, t: 0 };
+	// 30 P2: the last plain editor click — where, when, and what it picked — so a repeat on
+	// the same spot can walk DOWN the stack instead of re-picking the same object
+	let lastSelectClick: { x: number; y: number; t: number; uuid: string | null } | null = null;
+	let selectBehindHinted = safeStorage.getItem('hint:selectBehind') === 'true';
 
-	function raycastSelect(additive = false) {
+	// 30 P1: `mode` is where the click came from. 'edit' = the desktop editor pick, where a
+	// module handler runs only if it registered for Edit (so a piano or a puzzle piece no
+	// longer swallows the select) and On Click nodes do NOT fire — Interact is where the
+	// scene reacts. null = VR's trigger, unchanged: every handler first, then select + pulse.
+	function raycastSelect(additive = false, mode: string | null = null, click: { x: number; y: number; t: number } | null = null) {
 		// module-owned interactive groups live at the scene root (pong, dungeon, ...)
+		// 30 P3: in EDIT the nearest module-content hit that no edit handler took is
+		// remembered, so a click on a board or a dungeon selects its PROXY (the object list's
+		// Module content row) instead of passing through it to the floor behind
+		let moduleHit: { name: string; distance: number } | null = null;
 		for (const name of moduleInteractiveGroups) {
 			const root = scene.getObjectByName(name);
 			if (!root) continue;
 			const moduleHits = selectionRaycaster.intersectObject(root, true);
-			if (moduleHits.length > 0 && runModuleClickHandlers(moduleHits[0].object)) return true;
+			if (moduleHits.length > 0 && runModuleClickHandlers(moduleHits[0].object, mode)) return true;
+			if (moduleHits.length > 0 && (!moduleHit || moduleHits[0].distance < moduleHit.distance))
+				moduleHit = { name, distance: moduleHits[0].distance };
 		}
 		const hits = pickSceneObjects();
-		if (hits.length > 0) {
-			// modules may consume the click (buttons, instruments, ...)
-			if (runModuleClickHandlers(hits[0].object)) return true;
-			const target = topLevelObjectOf(hits[0].object);
+		// 30 P2: SELECT-THROUGH — collapse the hits into a stack of top-level targets and
+		// prefer the first OPAQUE one (a 0.12-opacity wall, a flagged ceiling or a hidden
+		// node no longer wins the click); a plain repeat on the same spot walks down it.
+		const stack = pickStack(hits, topLevelObjectOf);
+		const choice = chooseInStack(stack, click ?? { x: -1e6, y: -1e6, t: 0 }, !additive && click ? lastSelectClick : null);
+		const chosen = choice.index >= 0 ? stack[choice.index] : null;
+		if (mode === 'edit' && !additive && moduleHit && moduleGroupOf(moduleHit.name) && (!chosen || moduleHit.distance < chosen.hit.distance)) {
+			deselectObject();
+			selectModuleGroup(moduleHit.name);
+			return true;
+		}
+		if (chosen) {
+			// modules may consume the click (buttons, instruments, ...) — in Edit only the
+			// ones that asked for it (an editor tool), everything else in VR
+			if (runModuleClickHandlers(chosen.hit.object, mode)) return true;
+			const target = chosen.target;
+			if (click && !additive) {
+				lastSelectClick = { ...click, uuid: target.uuid };
+				// the first time a click lands on a stack, say how to reach what is behind
+				if (stack.length > 1 && !selectBehindHinted) {
+					selectBehindHinted = true;
+					safeStorage.setItem('hint:selectBehind', 'true');
+					showToast('Click again to select behind');
+				}
+			}
 			if (target) {
 				// 15-O: a plain click SELECTS; the properties panel opens on a
 				// DOUBLE-click (or via the context menu / object list / a pinned
@@ -494,7 +578,9 @@
 					focusObject(target.uuid);
 					isolateObjects([target.uuid]);
 				}
-				fireObjectClick(target.uuid); // 134: pulse any OnClick node targeting it
+				// 134: pulse any OnClick node targeting it — not from the EDIT pick (30 P1:
+				// selecting a button in the editor must not press it; Interact does that)
+				if (mode !== 'edit') fireObjectClick(target.uuid);
 				return true;
 			}
 		}
@@ -625,14 +711,21 @@
 		let lastSplineClick = 0; // 57.2: a second click here finishes the spline
 		let lastPointerXY: number[] | null = null; // last cursor position, for keyboard-opened menus
 
-		const setRayFromEvent = (event) => {
+		const ndcOfEvent = (event: any) => {
 			const rect = element.getBoundingClientRect();
-			const ndc = new THREE.Vector2(
+			return new THREE.Vector2(
 				((event.clientX - rect.left) / rect.width) * 2 - 1,
 				-((event.clientY - rect.top) / rect.height) * 2 + 1
 			);
-			selectionRaycaster.setFromCamera(ndc, camera.current);
 		};
+		const setRayFromEvent = (event) => {
+			selectionRaycaster.setFromCamera(ndcOfEvent(event), camera.current);
+		};
+		// 30 P1: an Interact carry in progress (the camera controls stand down for it)
+		let interactCarrying = false;
+		// the press that CAN start an Interact gesture: no editor session or tool holds it
+		const interactPress = () =>
+			editorInteractActive() && !$specatorMode && !$editingObject && !$faceEditObject && !$splineEditObject && !$drawMode && !$sculptObject;
 
 		const onPointerDown = (event) => {
 			if (event.button === 2) {
@@ -673,6 +766,20 @@
 				}
 				return;
 			}
+			// 30 P1: INTERACT — a press on a dynamic body of a running sim CARRIES it along the
+			// cursor (play's hold, unforked); anything else is a click-or-orbit, and never a
+			// marquee (a box SELECTS, which Interact does not do)
+			if (interactPress()) {
+				setRayFromEvent(event);
+				if (cursorGrabStart(selectionRaycaster, ndcOfEvent(event), camera.current)) {
+					interactCarrying = true;
+					setOrbitEnabled(false);
+					return;
+				}
+				downPosition = [event.clientX, event.clientY];
+				downTime = Date.now();
+				return;
+			}
 			// Shift+drag = marquee select (13) — orbit pauses for the gesture
 			// #20: inside a MESH SESSION the same gesture boxes ELEMENTS instead of objects.
 			// A separate branch, not a loosened gate: the object marquee must never run in a
@@ -703,6 +810,8 @@
 		};
 
 		const onPointerMove = (event) => {
+			// 30 P1: an Interact carry follows the cursor
+			if (interactCarrying) cursorGrabMove(ndcOfEvent(event));
 			// 57.3: a radius drag owns the gesture (thickness, not the camera)
 			if (radiusDragActive()) {
 				radiusDragMove(event.clientY);
@@ -767,6 +876,13 @@
 		};
 
 		const onPointerUp = (event) => {
+			if (interactCarrying && event.button === 0) {
+				interactCarrying = false;
+				cursorGrabEnd(); // a throw (false if the carry was already cancelled)
+				setOrbitEnabled(true);
+				downPosition = null;
+				return;
+			}
 			if (radiusDragActive() && event.button === 0) {
 				endRadiusDrag(); // final broadcast + one undo entry
 				setOrbitEnabled(true);
@@ -988,6 +1104,13 @@
 				}
 				return;
 			}
+			// 30 P1: INTERACT — the click plays with the scene and selects nothing (the
+			// editor tools above — pings, spline/measure/path picks, mesh sessions — keep
+			// their clicks in either mode; they were armed on purpose)
+			if (interactPress()) {
+				interactClick(selectionRaycaster);
+				return;
+			}
 			// light pick-proxies select their light (lights have no raycastable geometry)
 			if ($lightProxiesGroup) {
 				const proxyHits = selectionRaycaster.intersectObject($lightProxiesGroup, true);
@@ -1011,7 +1134,7 @@
 			// 85: a click on nothing is also the way out of an isolation — the same
 			// "click the background to get back" instinct as deselecting.
 			const additive = event.shiftKey || $multiSelectMode;
-			if (!raycastSelect(additive) && !additive) {
+			if (!raycastSelect(additive, 'edit', { x: event.clientX, y: event.clientY, t: Date.now() }) && !additive) {
 				if (isIsolated()) clearIsolation();
 				deselectObject();
 			}
@@ -1267,6 +1390,13 @@
 			tempMatrix.identity().extractRotation(controller.matrixWorld);
 			selectionRaycaster.ray.origin.setFromMatrixPosition(controller.matrixWorld);
 			selectionRaycaster.ray.direction.set(0, 0, -1).applyMatrix4(tempMatrix);
+			// 30b (C3): in Interact/Play a VR press is a CLICK — module handlers, On Click,
+			// the miss — and selects nothing, ever (the desktop Interact rule); the sweep
+			// already fired anything it knew was clickable and swallowed this release
+			if (gameFeelActive()) {
+				interactClick(selectionRaycaster);
+				return;
+			}
 			raycastSelect();
 		};
 		// 182: hold-to-move a vertex — grab on trigger press, drop on release
@@ -1292,12 +1422,17 @@
 		const onDisc = (e: any) => { e.target.userData.handedness = null; };
 		// 21-B B3: play mode's own input path. Registered HERE, below every `let`
 		// its closure reads (runModuleClickHandlers among them) — the TDZ rule.
-		startPlayInteract({ moduleHitTest: runModuleClickHandlers });
+		startPlayInteract({ moduleHitTest: (object: any) => runModuleClickHandlers(object, 'play') });
+		// 30 P1: the sessions that own the letter keys, so the I (Edit/Interact) key stands
+		// down while one is open — shortcuts cannot import them (history's cycle family)
+		const offKeyProbe = registerKeySessionProbe(() => !!get(sculptObject) || !!get(splineEditObject) || !!get(drawMode) || splineToolActive());
 		// 24-A A1: the knock's feeds. The VR hand poses come from vrControls through
 		// this seam rather than an import (knock.js stays off vrControls' 3500 lines),
 		// and the two "what am I holding" reads keep a probe off its own carried object.
 		// A2: the hand that hit gets a buzz — LOCAL, the same seam shape as the hand poses
-		startKnock({ hands: handSnapshot, heldUuids: () => [carriedUuid(), vrGrabbedUuid()], haptic: hapticPulse });
+		startKnock({ hands: handSnapshot, heldUuids: () => [carriedUuid(), vrGrabbedUuid()], haptic: hapticKnock });
+		// 30b: game feel in VR (a frame hook + a trigger hook through vrControls' registries)
+		startVrGameInput();
 
 		xrControllers.forEach((controller) => {
 			controller.addEventListener('select', onXRSelect);
@@ -1309,8 +1444,10 @@
 
 		return () => {
 			offEditResume(); // #20 P5
+			offKeyProbe(); // 30 P1
 			stopPlayInteract(); // 21-B B3 (releases any carried body with zero velocity)
 			stopKnock(); // 24-A A1
+			stopVrGameInput(); // 30b
 			element.removeEventListener('pointerdown', onPointerDown);
 			element.removeEventListener('contextmenu', onContextMenu);
 			element.removeEventListener('webglcontextlost', onContextLost);
@@ -1477,6 +1614,11 @@
 	     sceneObjects — they'd leak into GLTF sync). oncreate passes the ref
 	     DIRECTLY (the { ref } destructure trap, N1). -->
 	<T.Group name="particle-root" oncreate={(ref: any) => setParticleRoot(ref)} />
+
+	<!-- 30b P5: module viewport content (registered scene-root groups) is re-homed here so
+	     the VR world gestures carry it too — Untangle's dots spin with the world. Not in
+	     sceneObjects: nothing under it is serialised or sent (golden rule 5). -->
+	<T.Group name="module-world-root" oncreate={(ref: any) => setModuleWorldRoot(ref)} />
 </T.Group>
 
 {#if !$isLocked && !$isVRMode}
@@ -1519,6 +1661,9 @@ position={[0, 2, 3]}
 		// B2.1: request the preferred refresh rate (auto = highest supported) —
 		// without this the Quest stays at its 90Hz default
 		applyVRFrameRate();
+		// 30b P4: remember the untouched reference space (the walker's floor), and a
+		// GAME lands in Interact on its spawn
+		onVRSessionStart();
 	}}
 	onsessionend={() => passthroughActive.set(false)}
 >
diff --git a/src/components/editors/Explorer.svelte b/src/components/editors/Explorer.svelte
index 81d76926..1b2b2135 100644
--- a/src/components/editors/Explorer.svelte
+++ b/src/components/editors/Explorer.svelte
@@ -295,6 +295,7 @@
 		openPackLoading
 	} from '$lib/packs';
 	import { importFile, exportObjectsAsGltf, openScenePayload } from '$lib/fileHandler.svelte';
+	import { packRefFromUrl } from '$lib/packRefs';
 	// 21-H2: the Explorer is the prefab HOME (the Library modal is gone), so it owns
 	// their whole CRUD — add, export both ways, update, rename, properties, delete.
 	import {
@@ -5700,7 +5701,10 @@
 				dismiss();
 				return showToast('Could not fetch the pack item');
 			}
-			await importFile(new File([await res.blob()], item.name + '.glb'), item.name, 'glb');
+			// 30c: the placed piece carries its pack reference (packRefs.js)
+			await importFile(new File([await res.blob()], item.name + '.glb'), item.name, 'glb', undefined, undefined, {
+				packRef: packRefFromUrl(item.glbUrl, { pack: item.packName, item: item.name })
+			});
 			dismiss();
 		} catch {
 			dismiss();
diff --git a/src/components/editors/Nodes.svelte b/src/components/editors/Nodes.svelte
index 9ddf8a1d..d4d3393c 100644
--- a/src/components/editors/Nodes.svelte
+++ b/src/components/editors/Nodes.svelte
@@ -160,6 +160,7 @@
 		visibility: EffectNode,
 		setuniform: EffectNode,
 		onclick: OnClickNode,
+		ongrab: OnClickNode, // 30b (core-games): the same pulse card
 		onimpact: AnimationNode,
 		// 24-A A2: its own card — the pulse dot PLUS speed/byMe value rows (the MoveInput
 		// shape: several source handles need labelled rows, not one right-edge dot)
@@ -211,6 +212,15 @@
 		ongamestate: AnimationNode,
 		setvariable: AnimationNode,
 		getvariable: AnimationNode,
+		// 30 P4: the device-local pair (the second registry — the catalog is the first)
+		storevalue: AnimationNode,
+		storedvalue: AnimationNode,
+		// 30b (core-games): Game Feel — spec-driven like the rest of the game shell
+		announce: AnimationNode,
+		gamesound: AnimationNode,
+		effectburst: AnimationNode,
+		hapticpulse: AnimationNode,
+		gamemusic: AnimationNode,
 		gametime: AnimationNode,
 		// 21-F3's `collectcount` card MOVED to the collectible module (R3a) — an old
 		// scene's node renders as UnknownNode until the module is installed, honestly
diff --git a/src/components/editors/nodes/NodeWrapper.svelte b/src/components/editors/nodes/NodeWrapper.svelte
index c0121443..4a3ca613 100644
--- a/src/components/editors/nodes/NodeWrapper.svelte
+++ b/src/components/editors/nodes/NodeWrapper.svelte
@@ -21,6 +21,7 @@
 		HUD: '#f0abfc', // A3: pink-violet, distinct from Effects' purple
 		Game: '#34d399', // 21-D6: emerald — the game shell
 		Character: '#fbbf24', // 21-E6: amber — the player's own movement
+		Music: '#fb7185', // 23-B3's group had no accent (palette-groups red on feat/1.17): rose
 		// 'Object Flow' was MISSING, so flowinput/flowoutput/objectflow fell through to
 		// the module-node gray and read as third-party cards. Fixed while adding HUD.
 		'Object Flow': '#818cf8' // indigo
diff --git a/src/components/editors/nodes/OnClickNode.svelte b/src/components/editors/nodes/OnClickNode.svelte
index e24a3ead..4edd854a 100644
--- a/src/components/editors/nodes/OnClickNode.svelte
+++ b/src/components/editors/nodes/OnClickNode.svelte
@@ -19,6 +19,7 @@
 		onclick: ['clicked!', 'connect to the object; pulses on click'],
 		onenter: ['entered!', 'pulses when something enters the sensor object'],
 		onexit: ['exited!', 'pulses when a sensor overlap ends'],
+		ongrab: ['grabbed!', 'pulses when a player picks the object up'], // 30b (core-games)
 		animfinished: ['finished!', 'pulses when the clip on this object reaches its end'],
 		// 17-E F5: the same pulse card, plus a marker NAME to watch for
 		animmarker: ['marker!', 'pulses as the playhead crosses a marker; blank = any']
diff --git a/src/components/hud/GameChip.svelte b/src/components/hud/GameChip.svelte
new file mode 100644
index 00000000..b967327d
--- /dev/null
+++ b/src/components/hud/GameChip.svelte
@@ -0,0 +1,111 @@
+<script>
+	// 30 P1 — THE EDITOR STOPS MASQUERADING AS THE GAME (roadmap 30 fork 4).
+	//
+	// A scene with a game shell used to paint its menu over the EDITOR — "TOWERS / Start
+	// round" sitting on top of the scene you were building, its buttons live, so a Start
+	// press in the editor started the round for every peer without anybody pressing Play.
+	// HudLayer now keeps a game's screens off the viewport outside play (the HUD editor's
+	// preview eye still shows them, inert). This chip is what stands in for them: one
+	// line saying the scene IS a game and where its state is, and the one button an
+	// author needs to try it — ▶ Test play (back to the menu, enter play, Start screen).
+	//
+	// LOCAL chrome: editor only, never in embed mode (an embed has its own ▶), never in a
+	// headset (DOM is invisible there), and it replicates nothing — Test play's reset goes
+	// through the game shell's own write path, which is what replicates.
+	import { Play, Eye, EyeOff } from '@lucide/svelte';
+	import { isLocked, isVRMode } from '../../stores/sceneStore';
+	import { hudIsGame, hudPreviewInViewport } from '$lib/hudDocs';
+	import { gameState } from '$lib/gameState';
+	import { embedMode } from '$lib/playMode';
+	import { testPlay } from '$lib/gamePresence';
+
+	const visible = $derived($hudIsGame && $isLocked !== true && !$isVRMode && !$embedMode);
+	const stateLabel = $derived(String($gameState?.state ?? 'menu'));
+</script>
+
+{#if visible}
+	<div id="game-chip" class="game-chip" data-game-state={stateLabel}>
+		<span class="game-chip-label">Game · <span class="game-chip-state">{stateLabel}</span></span>
+		<button
+			id="game-chip-preview"
+			type="button"
+			class="game-chip-icon"
+			aria-pressed={$hudPreviewInViewport}
+			aria-label={$hudPreviewInViewport ? 'Hide the game screens in the editor' : 'Show the game screens in the editor (preview, buttons inert)'}
+			title={$hudPreviewInViewport ? 'Hide the game screens in the editor' : 'Preview the game screens in the editor (buttons inert)'}
+			onclick={() => hudPreviewInViewport.update((on) => !on)}
+		>
+			{#if $hudPreviewInViewport}<Eye size={14} aria-hidden="true" />{:else}<EyeOff size={14} aria-hidden="true" />{/if}
+		</button>
+		<button
+			id="game-chip-test"
+			type="button"
+			class="game-chip-test"
+			title="Test play: back to the menu, enter Play, start from the Start screen"
+			onclick={() => testPlay()}
+		>
+			<Play size={13} aria-hidden="true" />
+			<span>Test play</span>
+		</button>
+	</div>
+{/if}
+
+<style>
+	.game-chip {
+		position: fixed;
+		/* under the logo (8..56px), and under the Connect bar when that is docked full-width
+		   across the top — `--connect-bottom` is 0 otherwise */
+		top: calc(var(--connect-bottom, 0px) + 68px);
+		left: 16px;
+		/* the authoring HUD band: over the viewport, under every window (--z-window 40) */
+		z-index: 38;
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		padding: 4px 4px 4px 10px;
+		border-radius: 9999px;
+		background: var(--surface, #1f2937);
+		color: var(--icon-strong, #e5e7eb);
+		border: 1px solid var(--border, rgba(255, 255, 255, 0.12));
+		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
+		font-size: 12px;
+		line-height: 1;
+		user-select: none;
+	}
+	.game-chip-label {
+		white-space: nowrap;
+		opacity: 0.85;
+	}
+	.game-chip-state {
+		font-weight: 600;
+	}
+	.game-chip-icon {
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		width: 24px;
+		height: 24px;
+		border-radius: 9999px;
+		color: inherit;
+		opacity: 0.8;
+	}
+	.game-chip-icon:hover,
+	.game-chip-icon[aria-pressed='true'] {
+		opacity: 1;
+		background: rgba(255, 255, 255, 0.08);
+	}
+	.game-chip-test {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+		padding: 5px 10px 5px 8px;
+		border-radius: 9999px;
+		background: var(--accent, #ef562f);
+		color: #fff;
+		font-weight: 600;
+		white-space: nowrap;
+	}
+	.game-chip-test:hover {
+		filter: brightness(1.08);
+	}
+</style>
diff --git a/src/components/hud/HudElement.svelte b/src/components/hud/HudElement.svelte
index 3612ae94..e7e026bb 100644
--- a/src/components/hud/HudElement.svelte
+++ b/src/components/hud/HudElement.svelte
@@ -366,10 +366,21 @@
 			.filter(Boolean)
 			.join('; ')
 	);
+	// A text box is a flex row (it centres vertically), so its line is an anonymous flex
+	// ITEM that shrinks to the text — `text-align` then aligns inside a box exactly as wide
+	// as the words and does nothing. Every 'center'/'right' single-line HUD text rendered
+	// flush left (measured on the Towers menu, 30 visuals-core). The row's own
+	// justify-content follows the same `align`; scoped to text/timer, because the list is a
+	// flex COLUMN, where justify-content would move the rows vertically.
+	const textStyle = $derived(
+		boxStyle +
+			'; justify-content: ' +
+			(style.align === 'center' ? 'center' : style.align === 'right' ? 'flex-end' : 'flex-start')
+	);
 </script>
 
 {#if kind === 'text' || kind === 'timer'}
-	<div class="hud-el hud-text" class:hud-wrap={element?.wrap} style={boxStyle}>{text}</div>
+	<div class="hud-el hud-text" class:hud-wrap={element?.wrap} style={textStyle}>{text}</div>
 {:else if kind === 'button'}
 	<!-- buttons are the ONE thing that opts INTO pointer events; the layer itself is
 	     pointer-events: none so the viewport keeps every click. In the editor the press is
diff --git a/src/components/hud/HudLayer.svelte b/src/components/hud/HudLayer.svelte
index 260619ca..f875bee4 100644
--- a/src/components/hud/HudLayer.svelte
+++ b/src/components/hud/HudLayer.svelte
@@ -12,7 +12,7 @@
 	// phase (the AnnotationPins / AnnotationMarkers split).
 	import { onMount } from 'svelte';
 	import HudElement from './HudElement.svelte';
-	import { hudDocs, hudRuntime, hudScreenOverride, hudPreviewInViewport, visibleScreen, activeHudKeys, setHudValue, hudValueOf } from '$lib/hudDocs';
+	import { hudDocs, hudRuntime, hudScreenOverride, hudPreviewInViewport, hudIsGame, visibleScreen, activeHudKeys, setHudValue, hudValueOf } from '$lib/hudDocs';
 	import { isVRMode, isLocked, playPointerFree } from '../../stores/sceneStore';
 	import { hudEditorClose } from '../../stores/appStore.js';
 	import { viewportOverrides, renderLayer } from '$lib/viewportOverrides';
@@ -26,6 +26,9 @@
 	import { claimInput, releaseInput, onInput } from '$lib/inputRuntime';
 	import { gamepadPrefs } from '$lib/gamepadPrefs';
 	import { fireHudButton } from '$lib/flowRuntime';
+	// 30b (vr-play): api.announce's banner — drawn here on the desktop, and by the VR game
+	// panel's head-locked banner in a headset (DOM is invisible there)
+	import { gameAnnouncement } from '$lib/gameAnnounce';
 
 	// 21-D5: WHICH documents are on screen — the scene HUD, plus the one keyed by the
 	// camera being looked through (attaching a HUD to a camera IS keying it by that
@@ -62,6 +65,17 @@
 	// authoring. `=== false` would read the transient value and flip back a moment later.
 	const playing = $derived($isLocked === true);
 
+	// 30 P1: THE EDITOR STOPS MASQUERADING AS THE GAME. Outside Play a GAME's screens (the
+	// `hudIsGame` rule: a screen bound to a game state) are not drawn at all — the menu of
+	// a Games-tab game used to sit over the scene being built, with a LIVE Start that began
+	// the round for every peer with nobody in Play. The game chip (GameChip.svelte) stands
+	// in for them. The HUD editor's preview eye still draws them for authoring, and then
+	// every control is INERT (`editor` on HudElement — the artboard's own swallow), so
+	// laying out a menu can never fire the game. A HUD with no state-bound screen is a
+	// plain overlay and keeps its old behaviour exactly.
+	const gameInEditor = $derived(!playing && $hudIsGame);
+	const gameHidden = $derived(gameInEditor && !$hudPreviewInViewport);
+
 	// BOTH stores are read as dependencies. `visibleScreen` reaches the override through
 	// `get()`, and a `get()` inside a $derived registers NOTHING — so with only $hudDocs
 	// here, showing a screen wrote the store and the layer never re-rendered. It looked
@@ -103,7 +117,7 @@
 	// dropdowns, and under pointer lock the ring is the only hand a player has. A
 	// disabled control is skipped the way it ignores presses.
 	const focusables = $derived(elements.filter((el) => isInteractiveKind(el.kind) && el.enabled !== false));
-	const anyVisible = $derived(elements.length > 0 && !$isVRMode && layerAllowed && !authoringHidden);
+	const anyVisible = $derived(elements.length > 0 && !$isVRMode && layerAllowed && !authoringHidden && !gameHidden);
 
 	// ---- 21-E3: the MENU SUBSTATE - this component is the SINGLE WRITER ------------
 	// Visibility IS the state: any visible screen marked input:'menu' while playing
@@ -286,7 +300,8 @@
 	// Claim only while a screen with focusables is actually up, and release the moment it
 	// is not — a claim left standing pauses editor fly for good.
 	$effect(() => {
-		const wants = anyVisible && focusables.length > 0;
+		// 30 P1: an INERT preview has nothing to drive, so it must not pause editor flight
+		const wants = anyVisible && focusables.length > 0 && !gameInEditor;
 		if (!wants) return;
 		claimInput('keys');
 		return () => releaseInput('keys');
@@ -331,8 +346,17 @@
 	}
 </script>
 
+{#if $gameAnnouncement && !$isVRMode && layerAllowed}
+	{#key $gameAnnouncement.id}
+		<div id="game-announce" class="game-announce" role="status" aria-live="polite" style="--announce-ms: {$gameAnnouncement.ms}ms">
+			<div class="game-announce-title" style:color={$gameAnnouncement.color}>{$gameAnnouncement.text}</div>
+			{#if $gameAnnouncement.sub}<div class="game-announce-sub">{$gameAnnouncement.sub}</div>{/if}
+		</div>
+	{/key}
+{/if}
+
 {#if anyVisible}
-	<div id="hud-layer" class="hud-layer" class:hud-authoring={!playing} data-authoring={!playing}>
+	<div id="hud-layer" class="hud-layer" class:hud-authoring={!playing} class:hud-inert={gameInEditor} data-authoring={!playing} data-inert={gameInEditor}>
 		{#each elements as el (el.__key + ':' + el.id)}
 			<div
 				class="hud-slot"
@@ -343,7 +367,7 @@
 				data-hud-kind={el.kind}
 				style="{place(el)}; {centering(el)}"
 			>
-				<HudElement element={el} runtime={$hudRuntime[el.id]} onpress={fireHudButton} />
+				<HudElement element={el} runtime={$hudRuntime[el.id]} editor={gameInEditor} onpress={fireHudButton} />
 			</div>
 		{/each}
 	</div>
@@ -368,6 +392,56 @@
 	.hud-slot {
 		position: absolute;
 	}
+	/* 30b: api.announce — a big centred banner over the game, never clickable, gone by
+	   itself (the store clears it; the fade only dresses the exit) */
+	.game-announce {
+		position: fixed;
+		left: 50%;
+		top: 32%;
+		transform: translate(-50%, -50%);
+		z-index: var(--z-hud, 45);
+		pointer-events: none;
+		text-align: center;
+		padding: 18px 40px;
+		border-radius: 18px;
+		background: rgb(10 14 22 / 0.72);
+		box-shadow: 0 10px 40px rgb(0 0 0 / 0.45);
+		animation: game-announce-in 220ms ease-out, game-announce-out 300ms ease-in calc(var(--announce-ms, 1800ms) - 300ms) forwards;
+	}
+	.game-announce-title {
+		font-size: clamp(32px, 6vw, 72px);
+		font-weight: 800;
+		letter-spacing: 0.02em;
+		line-height: 1.05;
+		text-shadow: 0 2px 12px rgb(0 0 0 / 0.6);
+	}
+	.game-announce-sub {
+		margin-top: 6px;
+		font-size: clamp(14px, 2vw, 22px);
+		color: #e5e7eb;
+	}
+	@keyframes game-announce-in {
+		from {
+			opacity: 0;
+			transform: translate(-50%, -50%) scale(0.85);
+		}
+	}
+	@keyframes game-announce-out {
+		to {
+			opacity: 0;
+		}
+	}
+	@media (prefers-reduced-motion: reduce) {
+		.game-announce {
+			animation: none;
+		}
+	}
+	/* 30 P1: a previewed GAME screen is a picture of the menu, not the menu — every click
+	   goes through it to the viewport (the elements opt back INTO pointer events one by
+	   one, so the override has to reach them) */
+	.hud-inert :global(*) {
+		pointer-events: none !important;
+	}
 	/* the keyboard ring, so a player under pointer lock can see where they are */
 	.hud-focused {
 		outline: 2px solid var(--accent, #ef562f);
diff --git a/src/components/menu/Controls.svelte b/src/components/menu/Controls.svelte
index 9adc16ed..64dc0045 100644
--- a/src/components/menu/Controls.svelte
+++ b/src/components/menu/Controls.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-	import { Clapperboard, Code, Cog, Eye, FolderOpen, Grid2x2, List, Maximize2, MessageSquare, Monitor, Move, Palette, Pin, Play, RectangleGoggles, RotateCcw, SquarePen, Sun, Workflow } from '@lucide/svelte';
+	import { Clapperboard, Code, Cog, Eye, FolderOpen, Grid2x2, Hand, List, Maximize2, MessageSquare, Monitor, Move, Palette, Pin, Play, RectangleGoggles, RotateCcw, SquarePen, Sun, Workflow } from '@lucide/svelte';
 	import { Listgroup } from 'flowbite-svelte';
-	import { objectsGroup, TControls, transformMode, isLocked, lockedObjects, globalScene, vrPassthrough, vrOverride, selectedObject, selectedObjects } from '../../stores/sceneStore';
+	import { objectsGroup, TControls, transformMode, editorMode, isLocked, lockedObjects, globalScene, vrPassthrough, vrOverride, selectedObject, selectedObjects } from '../../stores/sceneStore';
 	import { chatHidden, flowGraphClose, flowCodeClose, animationClose, uvEditorClose, shaderEditorClose, hudEditorClose, explorerClose, objectListClose, objectContextMenu, renamingObject, advancedMode, showEnvInList, showLocalObjects, floatingToolbar, toolbarAlwaysOnTop, showSimControls, expandedObjects } from '../../stores/appStore.js';
 	// 24-B2: keyboard navigation in the object list (the Explorer's gridKeydown shape)
 	import { visibleObjectRows, withExpanded, typeAheadIndex } from '$lib/objectListNav';
@@ -13,7 +13,7 @@
 	import { ENV_ROOT } from '$lib/environment';
 	import { flyTo } from '$lib/objectActions';
 	import { mutedFlowObjects } from '../../stores/flowStore';
-	import { focusObject, duplicateObject, toggleObjectVisibility, moveObjectToGroup, setTransformMode, selectObject } from '$lib/objectActions';
+	import { focusObject, duplicateObject, toggleObjectVisibility, moveObjectToGroup, setTransformMode, selectObject, toggleEditorMode } from '$lib/objectActions';
 	import { registerWindowReset } from '$lib/dragWindow';
 	import { enterEditMode } from '$lib/meshEdit';
 	import { addAnnotation } from '$lib/annotationsHandler';
@@ -28,6 +28,7 @@
 	import { shareObject } from '$lib/objectPermissions';
 	import Objects from './Objects.svelte';
 	import LocalObjects from './LocalObjects.svelte';
+	import ModuleContent from './ModuleContent.svelte';
 	import ContextMenu from '../ContextMenu.svelte';
 	import MobileAddButton from './MobileAddButton.svelte';
 	import AiHudButton from './AiHudButton.svelte';
@@ -39,6 +40,9 @@
 	import { visibleDockKey, dockOccupants, bottomInset, FLOW_FAMILY, armDockMode, DOCK_TITLES } from '$lib/bottomDock';
 	import { togglePanel } from '$lib/panelToggles';
 	import { requestPlay, willEnterXR, willEnterAR, vrSupported, arSupported, xrSessionFailed } from '$lib/playMode';
+	// 30 P2: Test play — the play button's right-click row beside the game chip's button
+	import { testPlay } from '$lib/gamePresence';
+	import { hudIsGame } from '$lib/hudDocs';
 	import { DOCK_VIEWS } from '$lib/dockMenu';
 	import { safeStorage } from '$lib/safeStorage';
 	import { VRButton, XRButton } from '@threlte/xr'
@@ -916,6 +920,18 @@
 					requestPlay();
 				}
 			},
+			// 30 P2: TEST PLAY — back to the menu, into Play, the Start screen. Offered only
+			// where it means something: a scene with no game shell has no menu to start from.
+			...($hudIsGame
+				? [
+						{ section: 'Game' },
+						{
+							label: 'Test play (start from the menu)',
+							tooltip: 'Reset the game to its menu, enter Play, and start from the Start screen',
+							action: () => testPlay()
+						}
+					]
+				: []),
 			// the FAB is a toolbar cell like any other, so it carries the same tail —
 			// minus "Hide button" (there is no toolbar without a way to press play)
 			...toolbarTail(null)
@@ -952,7 +968,9 @@
 		collapsed: boolean;
 		posX: number | null;
 	};
-	type CellButton = { title: string; slot?: string; icon: any; tint: () => string; run: () => void };
+	// 30 P1: `pressed` makes the cell a TOGGLE — it renders as a real <button> carrying
+	// aria-pressed (a <p> cannot: the attribute is not supported on its role)
+	type CellButton = { title: string; slot?: string; icon: any; tint: () => string; run: () => void; pressed?: () => boolean };
 
 	/** the one PSEUDO-cell: the transparent well the play FAB sits in. It is not a
 	 *  roster entry (play is never hideable) but it IS a cell of the row, which is
@@ -963,7 +981,10 @@
 	 *  the FAB's own right-click menu (plus Settings' Reset window positions, which
 	 *  is the hatch for iOS Safari, where a long press fires no `contextmenu`). */
 	const SPACER = '__spacer';
-	const DEFAULT_ORDER = ['move', 'rotate', 'scale', 'objects', 'flow', 'explorer'];
+	// 30 P1: the Edit/Interact toggle ('mode') joins the default bar at the END — the same
+	// place loadLayout already appends a default id an older record has never heard of, so
+	// a fresh profile and an upgraded one agree, and the well keeps its slot after Scale
+	const DEFAULT_ORDER = ['move', 'rotate', 'scale', 'objects', 'flow', 'explorer', 'mode'];
 	const DEFAULT_SPACER = 3;
 
 	/** W8b: the roster is bigger than the bar. `DEFAULT_ORDER` is what a fresh profile
@@ -1005,6 +1026,14 @@
 	// reading `$transformMode` / the `$derived` flags inside it registers the
 	// dependency in the render effect exactly as the inline expressions used to.
 	const BUTTONS: Record<string, CellButton> = {
+		mode: {
+			title: 'Interact mode (I)',
+			slot: 'editor-mode-toggle',
+			icon: Hand,
+			tint: () => ($editorMode === 'interact' ? ICON_ON : ICON_OFF),
+			pressed: () => $editorMode === 'interact',
+			run: () => toggleEditorMode()
+		},
 		move: {
 			title: 'Move (1)',
 			icon: Move,
@@ -1060,6 +1089,22 @@
 		)
 	};
 
+	/** 30 P1: the toggle cell's click as a DIRECT listener — an `on:click` on a new element
+	 *  adds a deprecation warning in this runes-mode file (the openStats reasoning). */
+	function cellClick(node: HTMLElement, id: string) {
+		let current = id;
+		const click = () => runCell(current);
+		node.addEventListener('click', click);
+		return {
+			update(next: string) {
+				current = next;
+			},
+			destroy() {
+				node.removeEventListener('click', click);
+			}
+		};
+	}
+
 	function defaultLayout(): ControlsLayout {
 		return { order: [...DEFAULT_ORDER], hidden: [], spacerIndex: DEFAULT_SPACER, collapsed: false, posX: null };
 	}
@@ -2015,6 +2060,24 @@
 			{:else}
 				{@const btn = BUTTONS[cell.id]}
 				{@const Glyph = btn.icon}
+				{#if btn.pressed}
+				<!-- 30 P1: a TOGGLE cell is a real button, so it can say aria-pressed -->
+				<button
+					type="button"
+					id={btn.slot}
+					class={classActive +
+						' w-10' +
+						(i === 0 ? ' rounded-l-full' : '') +
+						(i === visibleCells.length - 1 ? ' rounded-r-full' : '')}
+					title={btn.title}
+					aria-label={btn.title}
+					aria-pressed={btn.pressed()}
+					use:cellClick={cell.id}
+					use:cellMenu={cell.id}
+				>
+					<Glyph size={18} class={btn.tint()} aria-hidden="true" />
+				</button>
+				{:else}
 				<!-- ONE template for every roster button: the six hand-written cells each
 				     carried their own copy of this element, so each one also carried its own
 				     copy of the same three a11y/deprecation warnings. -->
@@ -2030,6 +2093,7 @@
 				>
 					<Glyph size={18} class={btn.tint()} aria-hidden="true" />
 				</p>
+				{/if}
 			{/if}
 		{/each}
 	</div>
@@ -2360,6 +2424,8 @@
 						{/each}
 					{/if}
 				</div>
+				<!-- 30 P3: every module's scene-root content, listed read-only -->
+				<ModuleContent />
 			  {/if}
 			{/if}
 		</div>
diff --git a/src/components/menu/Inspector.svelte b/src/components/menu/Inspector.svelte
index 703c2dd1..3e856961 100644
--- a/src/components/menu/Inspector.svelte
+++ b/src/components/menu/Inspector.svelte
@@ -30,7 +30,9 @@
 	import { recordEntry, beginHistoryBatch, endHistoryBatch, recordTransformSet } from '$lib/history';
 	import { deviceOf, deviceSpec, isDeviceObject, setDeviceFor, previewDeviceParams } from '$lib/audioDevices';
 	import { MUSIC_TOOLBOX_ID, musicToolboxPick } from '$lib/musicToolbox';
-	import { openModuleToolbox } from '$lib/moduleToolboxes';
+	import { openModuleToolbox, moduleToolboxes } from '$lib/moduleToolboxes';
+	// 30 P3: a Module content row selected in the object list (a proxy, not an object)
+	import { moduleSelection } from '$lib/moduleContent';
 	import { canEditObject } from '$lib/objectPermissions';
 	import {
 		attachMultiPivot,
@@ -56,7 +58,7 @@
 	import { LIGHT_PARAMS, SHADOW_TYPES, SHADOW_SIZES, setShadowMapSize, cappedShadowSize } from '$lib/lightParams';
 	import { animatedObjects, setAnimationState } from '$lib/animatedImports';
 	import { captureAutoKey, playheadOf } from '$lib/animationPreview';
-	import { moveObjectToGroup, selectObject, flyTo } from '$lib/objectActions';
+	import { moveObjectToGroup, selectObject, flyTo, setPickThrough } from '$lib/objectActions';
 	import { listPhysicsObjects, enablePhysicsOnSelection, setPhysicsFor, PHYSICS_MATERIALS } from '$lib/physics';
 	import {
 		sceneGravity,
@@ -167,6 +169,7 @@
 		selectedObjects,
 		backgroundColor,
 		globalCamera,
+		orbitControls,
 		viewMode,
 		showGrid, pokeScene } from '../../stores/sceneStore';
 	// 16-P3: grid + snapping prefs (LOCAL, like the clip planes)
@@ -591,6 +594,16 @@
 			if (object?.uuid) captureAutoKey(object.uuid, playheadOf(object.uuid));
 		}
 	}
+	// 30 P3: the module toolbox a Module content card can open (null = the module has none)
+	const moduleToolbox = $derived(
+		$moduleSelection ? $moduleToolboxes.find((/** @type {any} */ box) => box.moduleId === $moduleSelection.moduleId) ?? null : null
+	);
+	// 30 P2: every member is click-through (a mixed set reads unchecked; ticking it marks them all)
+	const pickThroughAll = $derived.by(() => {
+		$selectedObject;
+		$objectsGroup;
+		return insTargets.length > 0 && insTargets.every((/** @type {any} */ object) => object?.userData?.pick === 'through');
+	});
 	/** @param {string} label @param {(object:any)=>void} fn */
 	function fan(label, fn) {
 		fanOn(insTargets, label, fn);
@@ -1392,6 +1405,28 @@
 		if (!direction.lengthSq()) direction.set(-1, 1, 1).normalize();
 		flyTo(direction.multiplyScalar(distance).toArray(), [0, 0, 0]);
 	}
+	/**
+	 * 30c: the play SPAWN from the editor view — the point the view orbits around is where
+	 * the player's feet go, and the camera's heading toward it is the way they face (yaw 0
+	 * looks down -Z, the fixed start's direction).
+	 */
+	function setSpawnFromView() {
+		/** @type {any} */
+		const camera = $globalCamera;
+		/** @type {any} */
+		const controls = $orbitControls;
+		const target = controls?.target;
+		if (!camera || !target) return;
+		const yaw = Math.atan2(-(target.x - camera.position.x), -(target.z - camera.position.z));
+		const r2 = (/** @type {number} */ v) => Math.round(v * 100) / 100;
+		setScenePhysics({ play: { spawn: { position: [r2(target.x), r2(target.y), r2(target.z)], yaw: Math.round(yaw * 1000) / 1000 } } });
+	}
+	/** @param {any} spawn */
+	function spawnText(spawn) {
+		if (!spawn) return 'Default — (0, 2, 3), facing −Z';
+		const deg = Math.round((((spawn.yaw * 180) / Math.PI) % 360 + 360) % 360);
+		return '(' + spawn.position.map((/** @type {number} */ v) => v.toFixed(1)).join(', ') + '), facing ' + deg + '°';
+	}
 	/** shared look for the small bookmark row buttons */
 	const bmBtn = 'shrink-0 rounded-sm bg-gray-700 px-1.5 py-0.5 text-xs text-gray-300 hover:bg-gray-600 disabled:opacity-40';
 	function resetView() {
@@ -2593,6 +2628,24 @@
 				>
 					Start the simulation when play mode opens
 				</Checkbox>
+				<!-- 30c: where desktop play starts — feet position + heading, shared scene data -->
+				<div class="ui-row items-center gap-2">
+					<span class="w-24 shrink-0 text-xs text-gray-300">Spawn point</span>
+					<span id="physics-spawn-readout" class="flex-1 text-xs text-gray-400">{spawnText($scenePlay.spawn)}</span>
+				</div>
+				<div class="ui-row gap-2">
+					<button
+						id="physics-spawn-set"
+						class="ui-button-quiet text-xs"
+						title="Play starts at the point the view orbits around, facing the way the camera looks at it"
+						onclick={setSpawnFromView}>Set to the view's focus</button
+					>
+					{#if $scenePlay.spawn}
+						<button id="physics-spawn-clear" class="ui-button-quiet text-xs" onclick={() => setScenePhysics({ play: { spawn: null } })}
+							>Clear</button
+						>
+					{/if}
+				</div>
 				<p class="text-[10px] italic text-gray-400">
 					Shared: everyone entering play mode in this scene gets these.
 				</p>
@@ -2655,6 +2708,25 @@
 				>
 			</Section>
 		</div>
+	{:else if $moduleSelection && !$selectedObjects.length}
+		<!-- 30 P3: a Module content row (a PROXY, not an object): whose it is, and where it
+		     is edited — never transform rows the module would overwrite on its next rebuild -->
+		<div id="drawer-label" class="sticky top-0 z-10 -mx-4 rounded-tl-lg bg-gray-800 px-4">
+			<PanelHeader
+				title="Properties"
+				badge="Module content"
+				pinned={$inspectorPinned}
+				onpin={() => inspectorPinned.update((v) => !v)}
+				onclose={() => inspectorClose.set(true)}
+			/>
+		</div>
+		<div id="module-content-card" class="mt-2 flex flex-col gap-2 rounded-sm border border-gray-600/60 p-2 text-xs text-gray-300">
+			<p class="text-sm font-semibold text-gray-100">{$moduleSelection.label}</p>
+			<p>Made by the <strong>{$moduleSelection.moduleName}</strong> module — edit it with its toolbox or nodes.</p>
+			{#if moduleToolbox}
+				<button type="button" class="ui-button self-start" onclick={() => openModuleToolbox(moduleToolbox.id)}>Open {moduleToolbox.title}</button>
+			{/if}
+		</div>
 	{:else if $selectedObject?.name !== undefined}
 		<div id="drawer-label" class="sticky top-0 z-10 -mx-4 rounded-tl-lg bg-gray-800 px-4">
 			<PanelHeader
@@ -3094,6 +3166,19 @@
 						Frustum culled
 					</Checkbox>
 					<p class="text-[10px] text-gray-500">Higher render order draws later (over other objects). Disable culling for objects that vanish at screen edges.</p>
+					<!-- 30 P2: a wall, a ceiling or a glass case can stand aside for the editor's
+					     click — it picks the next opaque thing behind (click again to cycle back) -->
+					<Checkbox
+						id="inspector-pick-through"
+						checked={pickThroughAll}
+						onchange={(/** @type {any} */ e) => {
+							const on = e.target.checked;
+							fan('Click-through', (/** @type {any} */ object) => setPickThrough(object.uuid, on));
+							selectedObject.update((v) => v);
+						}}
+					>
+						Click-through in the viewport
+					</Checkbox>
 				</Section>
 			{/if}
 
diff --git a/src/components/menu/ModuleContent.svelte b/src/components/menu/ModuleContent.svelte
new file mode 100644
index 00000000..8a4964cd
--- /dev/null
+++ b/src/components/menu/ModuleContent.svelte
@@ -0,0 +1,186 @@
+<script>
+	// 30 P3: the object list's "Module content" section. One row per scene-root group a
+	// module registered (interactive / system / listed), expandable to its named children,
+	// READ-ONLY: the module owns that content and rebuilds it from its own state, so the
+	// list offers nothing a rebuild would undo (no rename, no delete, no drag). A click
+	// selects a PROXY (moduleContent.js) and frames it; the Inspector then says whose it
+	// is. Module content changes without a poke (a module adds children on its own clock),
+	// so the rows re-derive on every pokeScene AND once a second while the list is shown —
+	// the System view's precedent.
+	import { ChevronDown, ChevronRight, Boxes, Eye, EyeOff } from '@lucide/svelte';
+	import { get } from 'svelte/store';
+	import * as THREE from 'three';
+	import { globalScene, sceneRevision } from '../../stores/sceneStore';
+	import { showSidebar } from '../../stores/appStore';
+	import {
+		moduleContentRows,
+		moduleGroupsRevision,
+		moduleSelection,
+		selectModuleGroup
+	} from '$lib/moduleContent';
+	import { flyTo, deselectObject } from '$lib/objectActions';
+	import { moduleToolboxes, openModuleToolbox } from '$lib/moduleToolboxes';
+	import { safeStorage } from '$lib/safeStorage';
+	import ContextMenu from '../ContextMenu.svelte';
+
+	/** @type {any[]} */
+	let rows = $state([]);
+	let open = $state(safeStorage.getItem('objects:moduleContent') !== 'closed');
+	/** @type {Record<string, boolean>} */
+	let expanded = $state({});
+	/** @type {{x: number, y: number, row: any} | null} */
+	let menu = $state(null);
+
+	function refresh() {
+		rows = moduleContentRows(get(globalScene));
+	}
+	$effect(() => {
+		void $moduleGroupsRevision;
+		void $sceneRevision;
+		refresh();
+	});
+	$effect(() => {
+		const timer = setInterval(refresh, 1000);
+		return () => clearInterval(timer);
+	});
+
+	function toggleOpen() {
+		open = !open;
+		safeStorage.setItem('objects:moduleContent', open ? 'open' : 'closed');
+	}
+
+	/** frame a world box the way the System view frames its rows @param {any} box */
+	function frame(box) {
+		if (!box || box.isEmpty?.()) return;
+		const center = box.getCenter(new THREE.Vector3());
+		const size = Math.max(box.getSize(new THREE.Vector3()).length(), 2);
+		flyTo([center.x + size * 0.6, center.y + size * 0.45, center.z + size * 0.6], center.toArray());
+	}
+
+	/** @param {any} row */
+	function select(row) {
+		deselectObject(); // the proxy REPLACES the object selection, never joins it
+		const box = selectModuleGroup(row.name);
+		frame(box);
+		showSidebar('properties');
+	}
+
+	/** @param {any} row */
+	function toolboxOf(row) {
+		return $moduleToolboxes.find((/** @type {any} */ box) => box.moduleId === row.moduleId) ?? null;
+	}
+
+	/** Hide in the viewport, LOCALLY: a module rebuilding its group may show it again,
+	 * and nothing here is sent or saved. @param {any} row */
+	function toggleHidden(row) {
+		row.object.visible = !row.object.visible;
+		refresh();
+	}
+
+	/** @param {any} row */
+	function menuItems(row) {
+		const toolbox = toolboxOf(row);
+		return [
+			{ label: 'Frame it', action: () => select(row) },
+			...(toolbox ? [{ label: 'Open ' + toolbox.title, action: () => openModuleToolbox(toolbox.id) }] : []),
+			{
+				label: row.visible ? 'Hide in viewport (this device)' : 'Show in viewport',
+				action: () => toggleHidden(row)
+			}
+		];
+	}
+
+	/** a direct listener (panel chrome swallows delegated handlers) @param {HTMLElement} node @param {any} row */
+	function rowMenu(node, row) {
+		let current = row;
+		/** @param {MouseEvent} event */
+		const onMenu = (event) => {
+			event.preventDefault();
+			event.stopPropagation();
+			menu = { x: event.clientX, y: event.clientY, row: current };
+		};
+		node.addEventListener('contextmenu', onMenu);
+		return {
+			/** @param {any} next */
+			update(next) {
+				current = next;
+			},
+			destroy() {
+				node.removeEventListener('contextmenu', onMenu);
+			}
+		};
+	}
+</script>
+
+{#if rows.length}
+	<div id="module-content" class="mt-1 border-t border-gray-300 pt-1 dark:border-gray-600">
+		<button
+			id="module-content-head"
+			type="button"
+			class="flex w-full items-center gap-1 px-1 py-0.5 text-left text-[11px] font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400"
+			title="Content built by modules — listed read-only; the module owns it"
+			aria-expanded={open}
+			onclick={toggleOpen}
+		>
+			{#if open}<ChevronDown size={14} aria-hidden="true" />{:else}<ChevronRight size={14} aria-hidden="true" />{/if}
+			Module content
+			<span class="ml-auto font-normal normal-case text-gray-400">{rows.length}</span>
+		</button>
+		{#if open}
+			{#each rows as row (row.name)}
+				<div class="module-content-row" data-group={row.name} data-module={row.moduleId} use:rowMenu={row}>
+					<div
+						class={'flex items-center gap-1 rounded-sm px-1 py-0.5 text-sm text-gray-800 dark:text-gray-200 ' +
+							($moduleSelection?.name === row.name ? 'bg-primary-600/30' : 'hover:bg-gray-200 dark:hover:bg-gray-600')}
+					>
+						<button
+							type="button"
+							class="w-4 shrink-0 text-gray-400"
+							aria-label={expanded[row.name] ? 'Hide children' : 'Show children'}
+							onclick={() => (expanded = { ...expanded, [row.name]: !expanded[row.name] })}
+						>
+							{#if expanded[row.name]}<ChevronDown size={14} aria-hidden="true" />{:else}<ChevronRight size={14} aria-hidden="true" />{/if}
+						</button>
+						<Boxes size={14} class="shrink-0 text-gray-400" aria-hidden="true" />
+						<button
+							type="button"
+							class="module-content-name min-w-0 flex-1 truncate text-left"
+							class:opacity-50={!row.visible}
+							title={'Made by the ' + row.moduleName + ' module — click to select and frame it'}
+							onclick={() => select(row)}
+						>
+							{row.label}
+						</button>
+						<span class="module-content-badge shrink-0 rounded-sm bg-gray-200 px-1 text-[10px] text-gray-600 dark:bg-gray-600 dark:text-gray-200">{row.moduleName}</span>
+						<button
+							type="button"
+							class="shrink-0 text-gray-400"
+							title={row.visible ? 'Hide in the viewport (this device only)' : 'Show in the viewport'}
+							aria-label={row.visible ? 'Hide in the viewport' : 'Show in the viewport'}
+							onclick={() => toggleHidden(row)}
+						>
+							{#if row.visible}<Eye size={14} aria-hidden="true" />{:else}<EyeOff size={14} aria-hidden="true" />{/if}
+						</button>
+					</div>
+					{#if expanded[row.name]}
+						{#each row.children as child (child.uuid)}
+							<p class="module-content-child truncate text-xs text-gray-400" style={'padding-left:' + (child.depth * 12 + 20) + 'px'}>
+								{child.name}
+							</p>
+						{/each}
+						{#if row.more}
+							<p class="module-content-more pl-8 text-xs italic text-gray-400">+{row.more} more</p>
+						{/if}
+						{#if !row.children.length && !row.more}
+							<p class="pl-8 text-xs italic text-gray-400">No named parts</p>
+						{/if}
+					{/if}
+				</div>
+			{/each}
+		{/if}
+	</div>
+{/if}
+
+{#if menu}
+	<ContextMenu x={menu.x} y={menu.y} items={menuItems(menu.row)} sizeKey="object" onclose={() => (menu = null)} />
+{/if}
diff --git a/src/components/menu/Settings.svelte b/src/components/menu/Settings.svelte
index 496ad0be..be5b89b2 100644
--- a/src/components/menu/Settings.svelte
+++ b/src/components/menu/Settings.svelte
@@ -3,6 +3,9 @@
 	import { HardDrive, Lock, RotateCcw, X } from '@lucide/svelte';
 	import ThemedSelect from '../ui/ThemedSelect.svelte';
 	import SettingRow from './SettingRow.svelte';
+	// 30b (vr-play) C5: the two LOCAL game-audio volumes
+	import { gameSoundVolume } from '$lib/gameSfx';
+	import { gameMusicVolume } from '$lib/gameMusic';
 	import { showGrid, vrOverride, vrMenuHand, vrSnapAngle, vrMirrorSnapTurn, vrTeleportEnabled, vrSleeveEnabled, vrVertexHold, vrFlying, vrPassthrough, vrMenuHold, vrTargetHz, peerHandStyle } from '../../stores/sceneStore.js';
 	import { applyVRFrameRate } from '$lib/vrControls';
 	import { settingsOpen, settingsSection, hidePanels, restorePanels, advancedMode, showEnvInList, objectSearchEnabled, showSimControls, showToast, showRoomsButton, toastsInDrawerOnly, mobileUndockAllowed, enableShiftAdd, noteDoubleClickToOpen, duplicateCarriesAnimation, duplicateCarriesFlow, duplicateCarriesShader, touchTools, floatingToolbar, toolbarAlwaysOnTop } from '../../stores/appStore.js';
@@ -767,6 +770,17 @@
 							</span>
 						{/if}
 					</SettingRow>
+					<p class="ui-section-label">Sound</p>
+					<SettingRow name="Game sounds">
+						<svelte:fragment slot="control"><input id="setting-game-sound-volume" type="range" style="width: 100%" min="0" max="1" step="0.05" bind:value={$gameSoundVolume} aria-label="Game sounds volume" /></svelte:fragment>
+						How loud a game's effects are on this device — coins, goals, hits, the clicks a
+						game makes. Local to you; {Math.round($gameSoundVolume * 100)}%
+					</SettingRow>
+					<SettingRow name="Music">
+						<svelte:fragment slot="control"><input id="setting-game-music-volume" type="range" style="width: 100%" min="0" max="1" step="0.05" bind:value={$gameMusicVolume} aria-label="Game music volume" /></svelte:fragment>
+						The background music a game plays while you are in Interact or Play (it stops when
+						you go back to editing). Local to you; {Math.round($gameMusicVolume * 100)}%
+					</SettingRow>
 					<p class="ui-section-label">Notifications</p>
 					<SettingRow name="Welcome on start">
 						<svelte:fragment slot="control"><Toggle bind:checked={$showWelcomeOnStart} /></svelte:fragment>
diff --git a/src/components/play/PlayReticle.svelte b/src/components/play/PlayReticle.svelte
index 993276a6..e8db4c9f 100644
--- a/src/components/play/PlayReticle.svelte
+++ b/src/components/play/PlayReticle.svelte
@@ -5,6 +5,7 @@
 	// playInteract.js.
 	import { isLocked, isVRMode } from '../../stores/sceneStore';
 	import { playInteractState } from '$lib/playInteract';
+	import { playCursorFree } from '$lib/playCursor';
 	import { safeStorage } from '$lib/safeStorage';
 
 	// the scroll hint is worth exactly one showing, so it is a LOCAL pref and
@@ -14,7 +15,10 @@
 	);
 
 	const reticle = $derived($playInteractState);
-	const visible = $derived($isLocked && !$isVRMode && reticle.mode !== 'off');
+	// 30 P3: a free-cursor game aims with the real cursor, so there is no crosshair to draw.
+	// $playInteractState is the dependency that re-reads it (it moves on every aim change,
+	// and playCursorFree reads its stores through get()).
+	const visible = $derived($isLocked && !$isVRMode && reticle.mode !== 'off' && !playCursorFree());
 	const carrying = $derived(reticle.mode === 'carrying');
 
 	$effect(() => {
diff --git a/src/components/play/PointerLockControls.svelte b/src/components/play/PointerLockControls.svelte
index 018c6484..c8f9b900 100644
--- a/src/components/play/PointerLockControls.svelte
+++ b/src/components/play/PointerLockControls.svelte
@@ -1,12 +1,15 @@
 <script lang="ts">
     import { onDestroy, untrack } from 'svelte'
     import { get } from 'svelte/store'
-    import { Euler, Camera } from 'three'
+    import { Euler, Camera, Vector3 } from 'three'
     import { useThrelte, useParent, useTask } from '@threlte/core'
     import { isLocked, playPointerFree, playerCam, editorCam, globalScene } from '../../stores/sceneStore'
     import { userdata, peers } from '../../stores/appStore'
     import { dungeonData, slideMove, spawnPointFor } from '$lib/dungeonPlay'
     import { resolvePlaySettings } from '$lib/playSettings'
+    import { spawnDesktopPlayer } from '$lib/playSpawn'
+    // 30 P3: free-cursor games never take the pointer — the real cursor aims
+    import { playCursorFree } from '$lib/playCursor'
     import { inputClaims, getGamepadAxes } from '$lib/inputRuntime'
     import { gamepadPrefs } from '$lib/gamepadPrefs'
     import { coarsePointer } from '$lib/inputDevice'
@@ -32,7 +35,8 @@
       effectiveSpeed,
       setJumpRequested,
       tickWalker,
-      walkStep
+      walkStep,
+      collideRigStep
     } from '$lib/charController'
 
     const { renderer, camera, invalidate } = useThrelte()
@@ -111,7 +115,7 @@
           if (document.pointerLockElement === domElement) document.exitPointerLock()
         } else if (!free && wasFree) {
           wasFree = false
-          if (!noPointerLock && $isLocked === true && document.pointerLockElement !== domElement) {
+          if (!noPointerLock && !playCursorFree() && $isLocked === true && document.pointerLockElement !== domElement) {
             const again: any = domElement.requestPointerLock({ unadjustedMovement: true })
             again?.catch?.(() => {})
           }
@@ -160,6 +164,10 @@
      */
     function requestLock(first: boolean) {
       if (noPointerLock) return cancelLockRetry()   // W4: nothing to lock on a touch device
+      // 30 P3: a FREE-CURSOR game (`play.cursor: 'free'`) enters play without a lock: the
+      // cursor stays visible and aims (playCursor.playAimNdc), movement keys still walk or
+      // fly, and Escape still leaves — PLC's Escape branch already handles "no lock held"
+      if (playCursorFree()) return cancelLockRetry()
       if (get(isLocked) !== true) return cancelLockRetry()
       if (get(playPointerFree)) return cancelLockRetry()   // 21-E3: the menu owns the pointer
       if (document.pointerLockElement === domElement) return cancelLockRetry()
@@ -185,6 +193,9 @@
         // in your seed-deterministic room (peers take consecutive rooms).
         // untracked: the effect must only depend on $isLocked.
         untrack(() => {
+          // 30b P4: a game's own spawn (the scene's play.spawn, or a module's api.setSpawn)
+          // wins; the dungeon's per-peer rooms below are what a scene without one gets
+          if (spawnDesktopPlayer()) return
           const data = dungeonData($globalScene)
           // resolve the rig ONCE and mutate the object: `$cameraParent.position.x = v`
           // compiles to store_mutate -> cameraParent.set(), and useParent() is a
@@ -276,6 +287,8 @@
 
       const beforeX = $cameraParent?.position.x ?? 0
       const beforeZ = $cameraParent?.position.z ?? 0
+      // 30b P3: the rig's WORLD pose before this frame's built-in step, for the collision pass
+      const beforeWorld: any = $isLocked === true && $cameraParent ? $cameraParent.getWorldPosition(new Vector3()) : null
 
       if (moveState.forward === 1) {
         $cameraParent.translateZ(-speed);
@@ -364,6 +377,10 @@
         }
       }
 
+      // 30b P3: ...and against the physics world's colliders while a simulation runs, so
+      // desktop Play stops at a game's walls as the VR walker does (no world, no change)
+      if ($isLocked === true && rig && beforeWorld) collideRigStep(rig, beforeWorld)
+
     },
     {
       autoInvalidate: false
@@ -527,6 +544,7 @@
     // a programmatic exit, so this stays idle.)
     function onCanvasPointerDown() {
       if (noPointerLock) return   // W4: a touch tap is the look/interact gesture, not a re-lock
+      if (playCursorFree()) return   // 30 P3: a click in a free-cursor game is the game's
       if ($isLocked === true && !$playPointerFree && document.pointerLockElement !== domElement) {
         const again: any = domElement.requestPointerLock({ unadjustedMovement: true })
         again?.catch?.(() => {})
diff --git a/src/components/play/VRControls.svelte b/src/components/play/VRControls.svelte
index b5d66fe3..4a190adb 100644
--- a/src/components/play/VRControls.svelte
+++ b/src/components/play/VRControls.svelte
@@ -6,9 +6,8 @@
 	import * as THREE from 'three';
 	import { useThrelte, useTask } from '@threlte/core';
 	import { vrFlying, vrMenuOpen, vrObjectsPanelOpen, vrGrabbedHand } from '../../stores/sceneStore';
-	import { computeMoveOffset, worldScale, twoGripStretchActive, controllerIndexFor, vrNavigationSuppressed } from '$lib/vrControls';
+	import { computeMoveOffset, worldScale, twoGripStretchActive, controllerIndexFor, vrNavigationSuppressed, tickVRInteractLocomotion } from '$lib/vrControls';
 	import { inputClaims } from '$lib/inputRuntime';
-	import { dungeonData, slideMove } from '$lib/dungeonPlay';
 
 	const { renderer, camera, scene } = useThrelte();
 	const { xr } = renderer;
@@ -23,7 +22,7 @@
 	const cameraDir = new THREE.Vector3();
 	const aimDir = new THREE.Vector3();
 
-	useTask(() => {
+	useTask((delta) => {
 		const controller1 = xr.getController(0);
 		const controller2 = xr.getController(1);
 		// controls must live on the dolly or they will not move with it
@@ -35,12 +34,15 @@
 		const session = renderer.xr.getSession();
 		if (!session) return;
 		if ($vrMenuOpen || $vrObjectsPanelOpen) return; // menu/panel own the sticks (74/101)
+		if ($inputClaims.includes('locomotion')) return; // K-C: a module drives instead
+		// 30b P3: INTERACT walks like a game (collision, gravity, step-up; no fly or teleport
+		// unless the play block allows them) — a held object does not stop your feet
+		if (tickVRInteractLocomotion(delta, session)) return;
 		if ($vrGrabbedHand === 'left') return; // a left-hand grab owns its stick (100)
 		if (twoGripStretchActive()) return; // 186: both grips + sticks stretch, not move
 		// D9: world pan/grab write reference-space offsets themselves, and the
 		// mesh-edit gestures read the sticks for reel/scale — never also move
 		if (vrNavigationSuppressed()) return;
-		if ($inputClaims.includes('locomotion')) return; // K-C: a module drives instead
 		const space = xr.getReferenceSpace();
 		if (!space) return;
 
@@ -63,19 +65,10 @@
 				// grabbed-world scale (71): body-relative speed stays constant
 				speed: 0.05 * worldScale()
 			});
-			if (offset.x || offset.y || offset.z) {
-				// dungeon collision (58.5): clamp the viewer displacement against
-				// the raster (offset = -(viewer displacement) per convention)
-				const data = dungeonData(scene);
-				if (data) {
-					const viewer = xr.getCamera(camera.current).position;
-					const allowed = slideMove(data, viewer.x, viewer.z, -offset.x, -offset.z, 0.3);
-					offset.x = -(allowed.x - viewer.x);
-					offset.z = -(allowed.z - viewer.z);
-				}
-				if (offset.x || offset.y || offset.z)
-					xr.setReferenceSpace(space.getOffsetReferenceSpace(new XRRigidTransform(offset)));
-			}
+			// 30b P3: EDIT flies through walls (the dungeon raster clamp that stood here is the
+			// Interact walker's job now — the user's ask: "go through walls ... only in edit")
+			if (offset.x || offset.y || offset.z)
+				xr.setReferenceSpace(space.getOffsetReferenceSpace(new XRRigidTransform(offset)));
 		}
 	});
 </script>
diff --git a/src/components/play/VRSelectionShell.svelte b/src/components/play/VRSelectionShell.svelte
index 24258eed..faa46c19 100644
--- a/src/components/play/VRSelectionShell.svelte
+++ b/src/components/play/VRSelectionShell.svelte
@@ -5,6 +5,8 @@
 	import { selectedObject, isVRMode, objectsGroup, vrWireframeSelection } from '../../stores/sceneStore'
 	import { editingObject } from '$lib/meshEdit'
 	import { faceEditObject } from '$lib/faceEdit'
+	// 30b P1: a selection indicator is editor scaffolding - none in Interact/Play
+	import { editorHelpersShown } from '$lib/helperLayer'
 
 	// VR selection indicator (101/110): the desktop outline is a postprocessing
 	// composer and does NOT render in WebXR. Default is a two-tone wireframe —
@@ -106,7 +108,7 @@
 		// the live structure — a static indicator would just lag behind edits
 		const editing = !!$editingObject || !!$faceEditObject
 		const active =
-			$isVRMode && !editing && !!target?.uuid && !!$objectsGroup?.getObjectByProperty('uuid', target.uuid)
+			$isVRMode && $editorHelpersShown && !editing && !!target?.uuid && !!$objectsGroup?.getObjectByProperty('uuid', target.uuid)
 		group.visible = active
 		if (!active) return
 		const style = $vrWireframeSelection ? 'wire' : 'shell'
diff --git a/src/extensions/Grid.svelte b/src/extensions/Grid.svelte
index 8fb6b9af..1abce886 100644
--- a/src/extensions/Grid.svelte
+++ b/src/extensions/Grid.svelte
@@ -2,6 +2,11 @@
     import { Grid } from '@threlte/extras'
     import { T, useThrelte, useTask } from '@threlte/core'
     import { orbitControls } from '../stores/sceneStore'
+    // 30 P3: the grid is an EDITOR helper — it drew under/through the ground in five of the
+    // seven Games-tab games. Hidden while playing, on every scene; the existing "Show
+    // helpers in Play (debug)" toggle is the one way to keep it (no new setting).
+    // 30b P1: ...and in Interact, the same one predicate every editor helper answers to
+    import { editorHelpersShown } from '../lib/helperLayer'
     import { gridSettings, effectiveCell } from '../lib/gridSettings'
     import { snapSettings } from '../lib/snapping'
     let { showGrid } = $props()
@@ -71,8 +76,9 @@
     const fadeDistance = $derived($gridSettings.fadeMode === 'auto' ? fade : $gridSettings.fadeDistance)
   </script>
 
-   {#if showGrid}
+   {#if showGrid && $editorHelpersShown}
     <Grid
+      name="editor-grid"
       infiniteGrid={$gridSettings.infinite}
       gridSize={$gridSettings.infinite ? undefined : [$gridSettings.size, $gridSettings.size]}
       followCamera={$gridSettings.follow === 'camera'}
diff --git a/src/lib/cameraHelpers.js b/src/lib/cameraHelpers.js
index ec90b20a..fe2a2d0e 100644
--- a/src/lib/cameraHelpers.js
+++ b/src/lib/cameraHelpers.js
@@ -7,7 +7,7 @@ import { wireframeActive } from './viewMode';
 // 24-E2: frustums live on the helper layer; MARKERS hop onto it while hidden (Play
 // without the debug toggle, or a camera preview) — see helperLayer.js for the rule
 import { markHelper, setMarkersHidden, helpersHidden, helpersInPlay } from './helperLayer';
-import { isLocked } from '../stores/sceneStore';
+import { isLocked, editorMode } from '../stores/sceneStore';
 import { safeStorage } from './safeStorage';
 
 // 16-P5: frustum visualization for camera OBJECTS — the colliderHelpers pattern.
@@ -175,6 +175,7 @@ export function startCameraHelpers() {
 	// 24-E2: the marker hop follows Play, the debug toggle and the preview
 	if (!started && typeof window !== 'undefined') {
 		isLocked.subscribe(applyMarkerLayers);
+		editorMode.subscribe(applyMarkerLayers); // 30b: Interact hides markers like Play
 		helpersInPlay.subscribe(applyMarkerLayers);
 		frustumSuppressed.subscribe(applyMarkerLayers);
 	}
diff --git a/src/lib/charController.js b/src/lib/charController.js
index 949bb2f0..2b18c9ce 100644
--- a/src/lib/charController.js
+++ b/src/lib/charController.js
@@ -267,7 +267,12 @@ function ensureCapsule(rt, eyeHeight) {
 	if (capsule && key !== capsuleKey) dropCapsule();
 	if (!capsule) {
 		try {
-			capsule = world.createCollider(RAPIER.ColliderDesc.capsule(half, CAPSULE_RADIUS));
+			// a QUERY shape for the controller, never an obstacle: a collider with no body is
+			// FIXED, and teleported with the camera every frame it depenetrated whatever it
+			// was moved into (30b-integrate: desktop Play + a sim flung a crate 8 m before the
+			// first knock) and stood as an invisible pillar where the player last was. Solver
+			// groups 0 = no contact forces with anything; computeColliderMovement still sweeps it.
+			capsule = world.createCollider(RAPIER.ColliderDesc.capsule(half, CAPSULE_RADIUS).setSolverGroups(0));
 			controller = world.createCharacterController(0.02);
 			controller.enableAutostep?.(0.3, 0.2, true);
 			controller.enableSnapToGround?.(0.3);
@@ -307,13 +312,48 @@ function floorHeight() {
  */
 export function tickWalker(rig, settings, dt, desired) {
 	if (!rig) return { grounded, vy, source: 'none' };
-	const step = Math.max(0, Math.min(dt, 0.1)); // a tab that was backgrounded
 	const eyeHeight = Math.max(0.1, Number(settings?.eyeHeight ?? 1.7) || 1.7);
-	const useGravity = settings?.gravity !== false;
-	const g = Math.abs(Number(get(sceneGravity)) || 9.81);
-
 	rig.getWorldPosition(_worldPos);
-	let feet = _worldPos.y - eyeHeight;
+	const moved = resolveWalk(
+		{ x: _worldPos.x, y: _worldPos.y - eyeHeight, z: _worldPos.z },
+		eyeHeight,
+		dt,
+		desired,
+		{ gravity: settings?.gravity !== false, jumpHeight: settings?.jumpHeight }
+	);
+	// write back through the rig's PARENT: the camera lives in a group at y = 0.9, so a
+	// world target has to be converted rather than assigned
+	_target.set(_worldPos.x + moved.dx, moved.feet + eyeHeight, _worldPos.z + moved.dz);
+	if (rig.parent) rig.parent.worldToLocal(_target);
+	rig.position.copy(_target);
+	return { grounded: moved.grounded, vy: moved.vy, source: moved.source };
+}
+
+/**
+ * 30b P3: THE WALKER'S RESOLUTION, without a rig — so the VR walker (which moves the
+ * XR reference space, not a camera parent) resolves against exactly the same tiers.
+ * `feetPos` is the feet in WORLD space; the capsule spans feet -> feet + `height`.
+ * Returns the resolved world step and the new feet height. Owns the module's vertical
+ * state (vy / grounded / the jump edge): desktop play and a VR session never walk at once.
+ *
+ * 30b (asked by the dungeon lane): the dungeon RASTER now also clamps the rapier tier.
+ * A Kit dungeon's walls are module InstancedMeshes, never rapier colliders, so with a
+ * simulation running the capsule found nothing to stop it and walked through every wall.
+ * @param {{x: number, y: number, z: number}} feetPos
+ * @param {number} height eye/capsule height in metres
+ * @param {number} dt seconds
+ * @param {{dx: number, dz: number, dy?: number}} desired the wanted step, world units
+ *   (`dy` only without gravity — a flier's vertical intent)
+ * @param {{gravity?: boolean, jumpHeight?: number}} [opts]
+ * @returns {{dx: number, dy: number, dz: number, feet: number, grounded: boolean, vy: number, source: 'rapier'|'dungeon'|'plane'}}
+ */
+export function resolveWalk(feetPos, height, dt, desired, opts = {}) {
+	const step = Math.max(0, Math.min(dt, 0.1)); // a tab that was backgrounded
+	const eyeHeight = Math.max(0.1, Number(height) || 1.7);
+	const useGravity = opts.gravity !== false;
+	const g = Math.abs(Number(get(sceneGravity)) || 9.81);
+	_worldPos.set(feetPos.x, feetPos.y + eyeHeight, feetPos.z);
+	let feet = feetPos.y;
 
 	// gravity + the jump edge. The jump is spent only while we are ON something, so a
 	// press in mid-air is DROPPED rather than queued — a queued one fires on landing,
@@ -321,7 +361,7 @@ export function tickWalker(rig, settings, dt, desired) {
 	if (useGravity) {
 		if (jumpRequested && grounded) {
 			jumpRequested = false;
-			vy = Math.sqrt(2 * g * Math.max(0, Number(settings?.jumpHeight ?? 0) || 0));
+			vy = Math.sqrt(2 * g * Math.max(0, Number(opts.jumpHeight ?? 0) || 0));
 		}
 		vy -= g * step;
 	} else {
@@ -333,7 +373,7 @@ export function tickWalker(rig, settings, dt, desired) {
 	let source = 'plane';
 	let dx = desired?.dx ?? 0;
 	let dz = desired?.dz ?? 0;
-	let dy = useGravity ? vy * step : 0;
+	let dy = useGravity ? vy * step : Number(desired?.dy ?? 0) || 0;
 
 	const built = ensureCapsule(physicsRuntime(), eyeHeight);
 	if (built && capsule && controller) {
@@ -345,6 +385,13 @@ export function tickWalker(rig, settings, dt, desired) {
 			dx = moved.x;
 			dy = moved.y;
 			dz = moved.z;
+			// 30b: a dungeon raster clamps the capsule's step too (see resolveWalk)
+			const raster = dungeonData(get(globalScene));
+			if (raster && (dx || dz)) {
+				const slid = slideMove(raster, _worldPos.x, _worldPos.z, dx, dz, CAPSULE_RADIUS);
+				dx = slid.x - _worldPos.x;
+				dz = slid.z - _worldPos.z;
+			}
 			grounded = !!controller.computedGrounded();
 			feet += dy;
 			if (grounded && vy < 0) vy = 0;
@@ -356,7 +403,7 @@ export function tickWalker(rig, settings, dt, desired) {
 			console.log('character controller step failed', error);
 			dropCapsule();
 			source = 'plane';
-			dy = useGravity ? vy * step : 0;
+			dy = useGravity ? vy * step : Number(desired?.dy ?? 0) || 0;
 		}
 	}
 
@@ -373,8 +420,15 @@ export function tickWalker(rig, settings, dt, desired) {
 		const floor = raster ? 0 : floorHeight();
 		feet += dy;
 		if (!useGravity) {
-			feet = floor;
-			grounded = true;
+			// a flier (30b: `desired.dy` given) keeps its height above the floor; the walker
+			// with gravity off never passes dy, so it still stands ON the floor, unchanged
+			if (desired?.dy == null) {
+				feet = floor;
+				grounded = true;
+			} else {
+				feet = Math.max(floor, feet);
+				grounded = feet <= floor + 1e-4;
+			}
 		} else if (feet <= floor + 1e-4) {
 			feet = floor;
 			if (vy < 0) vy = 0;
@@ -384,12 +438,6 @@ export function tickWalker(rig, settings, dt, desired) {
 		}
 	}
 
-	// write back through the rig's PARENT: the camera lives in a group at y = 0.9, so a
-	// world target has to be converted rather than assigned
-	_target.set(_worldPos.x + dx, feet + eyeHeight, _worldPos.z + dz);
-	if (rig.parent) rig.parent.worldToLocal(_target);
-	rig.position.copy(_target);
-
 	const state = { vy, grounded, ground: feet, source };
 	const previous = get(walkerState);
 	if (
@@ -399,7 +447,47 @@ export function tickWalker(rig, settings, dt, desired) {
 		Math.abs(previous.ground - state.ground) > 1e-4
 	)
 		walkerState.set(state);
-	return { grounded, vy, source };
+	return { dx, dy, dz, feet, grounded, vy, source };
+}
+
+/** the head-sized capsule the built-in flier collides with: eye .. eye - FLY_BODY */
+const FLY_BODY = 1.0;
+
+/**
+ * 30b P3: DESKTOP PLAY'S BUILT-IN FLIER COLLIDES. With no Character Controller node,
+ * PointerLockControls moves the camera rig freely (WASD/QE/the pad) and the only wall it
+ * ever respected was a dungeon raster, so a player flew through every wall of every game.
+ * After the built-in step, the rig's world displacement since `before` is resolved through
+ * the walker's rapier capsule (a 1 m body hanging below the eye — a wall stops you, a floor
+ * holds you up, a low rim can still be flown over). Only while a simulation RUNS, because
+ * only then does a world with colliders exist; otherwise nothing happens and the step is
+ * byte-for-byte the old one (the 21-E6 parity contract: an empty scene flies as before).
+ * @param {any} rig the camera object PointerLockControls drives
+ * @param {{x: number, y: number, z: number}} before the rig's WORLD position before the step
+ * @returns {boolean} whether a collision pass ran
+ */
+export function collideRigStep(rig, before) {
+	if (!rig) return false;
+	const rt = physicsRuntime();
+	if (!rt) return false;
+	if (!ensureCapsule(rt, FLY_BODY) || !capsule || !controller) return false;
+	rig.getWorldPosition(_worldPos);
+	const d = { x: _worldPos.x - before.x, y: _worldPos.y - before.y, z: _worldPos.z - before.z };
+	if (Math.abs(d.x) + Math.abs(d.y) + Math.abs(d.z) < 1e-7) return false;
+	try {
+		capsule.setTranslation({ x: before.x, y: before.y - FLY_BODY / 2, z: before.z });
+		controller.computeColliderMovement(capsule, d);
+		const moved = controller.computedMovement();
+		_target.set(before.x + moved.x, before.y + moved.y, before.z + moved.z);
+		capsule.setTranslation({ x: _target.x, y: _target.y - FLY_BODY / 2, z: _target.z });
+		if (rig.parent) rig.parent.worldToLocal(_target);
+		rig.position.copy(_target);
+		return true;
+	} catch (error) {
+		console.log('fly collision failed', error);
+		dropCapsule();
+		return false;
+	}
 }
 
 /** Forget the walker's motion (a mode change, the controller removed, a test starting
diff --git a/src/lib/colliderHelpers.js b/src/lib/colliderHelpers.js
index 5c7aaeb4..5205f0f9 100644
--- a/src/lib/colliderHelpers.js
+++ b/src/lib/colliderHelpers.js
@@ -7,6 +7,7 @@ import { colliderSpecOf } from './colliderSpec';
 import { wireframeActive } from './viewMode';
 import { scenePhysicsGround } from './scenePhysics';
 import { safeStorage } from './safeStorage';
+import { helpersHidden } from './helperLayer';
 
 // CL-A A7: collider visualization (the lightHelpers pattern). Per tracked
 // object a wireframe built FROM colliderSpecOf — the SAME spec physics
@@ -233,7 +234,8 @@ const followQuat = new THREE.Quaternion();
  * entirely in wireframe view mode (they'd render as junk). */
 export function updateColliderHelpers() {
 	if (!proxyRoot) return;
-	proxyRoot.visible = (entries.size > 0 || !!groundProxy) && !wireframeActive();
+	// 30b P1: collider/trigger wireframes are editor scaffolding — gone in Interact and Play
+	proxyRoot.visible = (entries.size > 0 || !!groundProxy) && !wireframeActive() && !helpersHidden();
 	if (!proxyRoot.visible) return;
 	entries.forEach((entry) => {
 		entry.object.updateMatrixWorld();
diff --git a/src/lib/commandsHandler.svelte.js b/src/lib/commandsHandler.svelte.js
index 6b8f1332..a40bac20 100644
--- a/src/lib/commandsHandler.svelte.js
+++ b/src/lib/commandsHandler.svelte.js
@@ -17,6 +17,7 @@ import { hasAnimatedImport, sendAnimatedImport, setAnimationState, dropAllAnimat
 import { dropAllAnimations } from '$lib/animationPreview'
 import { parkAnimatedAtBase } from '$lib/flowRuntime'
 import { stripEditOverlays } from '$lib/editOverlays'
+import { isPristinePackRef, stubElementOf } from '$lib/packRefs'
 import { runSceneClearHandlers } from '$lib/moduleSDK'
 import { annotations } from '$lib/annotationsHandler'
 import { isViewer, warnViewerReadOnly } from '$lib/objectPermissions'
@@ -601,6 +602,14 @@ export async function objectParameters(data) {
             pokeScene(); // collider viz re-syncs
             physicsShapeChanged(data.uuid); // CL-A A2: live mid-sim rebuild
         }
+    } else if (data.parameter == 'pick') {
+        // 30 P2: click-through in the viewport. null = cleared (the default).
+        let mesh = sceneObjects.getObjectByProperty('uuid', data.uuid);
+        if (mesh) {
+            if (data.pick === 'through') mesh.userData.pick = 'through';
+            else delete mesh.userData.pick;
+            pokeScene();
+        }
     } else if (data.parameter == 'origin') {
         // 17-D: userData.origin is the per-object transform ORIGIN — a local-space
         // pivot offset the tools transform around. null = the object's own zero.
@@ -935,6 +944,12 @@ async function applyCreateObject(object, uuid, override, groupuuid, pos, rot, sc
  */
 export function sendObjects(peerId, element, opts = {}) {
     let groupid;
+    if (peerId === null && isPristinePackRef(element)) {
+        // 30c: a placed KIT PIECE reaches every peer as its stub; each refills it from
+        // the pack (no GLTF of a 1 MB piece per placement — see packRefs.js)
+        peer.send({ type: 'object', element: stubElementOf(element), groupuuid: element.parent?.uuid, ...(opts.override ? { override: true } : {}) });
+        return;
+    }
     if (peerId === null) {
         groupid = element.uuid;
         peer.send({type: 'group', name: element.name, uuid: element.uuid, groupparent: null,
@@ -1031,6 +1046,19 @@ export function sendObject(conn, element, groupuuid, opts = {}) {
     objects.forEach(element => {
         // viewer perms: never sync a viewer's local-only objects to a peer
         if (element.userData && element.userData.__localOnly) return;
+        if (isPristinePackRef(element)) {
+            // 30c: a pristine KIT PIECE travels as a stub (one small message) and the
+            // receiver refills it from its pack — packRefs.js carries the measurement (one
+            // wall is 7.9 MB as toJSON). ObjectLoader path: the element's matrix is LOCAL,
+            // and the receiver adds it under `groupuuid`.
+            conn.send({
+                type: 'object',
+                element: stubElementOf(element),
+                groupuuid: element.parent?.uuid,
+                ...heal
+            });
+            return;
+        }
         if (hasAnimatedImport(element.uuid)) {
             // rigs travel as their original file bytes, one message
             sendAnimatedImport(conn, element, opts);
@@ -1163,7 +1191,8 @@ function countObjects(element, sink) {
         objects = sceneObjects.children;
     }
     objects.forEach(element => {
-        if (element.type == "Group" && !hasAnimatedImport(element.uuid)) {
+        // 30c: a kit-piece stub is ONE message; its children are refilled, never sent
+        if (element.type == "Group" && !hasAnimatedImport(element.uuid) && !isPristinePackRef(element)) {
             countObjects(element, sink);
         }
         sink.push(element.uuid)
diff --git a/src/lib/effectsBurst.js b/src/lib/effectsBurst.js
new file mode 100644
index 00000000..02d98344
--- /dev/null
+++ b/src/lib/effectsBurst.js
@@ -0,0 +1,315 @@
+// 30b (vr-play) C6 — `api.effects.burst([x,y,z], {kind, color, count})`: a short-lived
+// particle burst for a game's moments — the sparkle when a Towers ring is reached, the
+// confetti on a goal, smoke off an explosion, sparks off a hit.
+//
+// POOLED: a fixed set of THREE.Points systems (POOL_SIZE x MAX_COUNT particles) built on
+// first use and recycled oldest-first, so a burst per frame costs no allocation and no GPU
+// upload of a new geometry — only the attribute ranges it rewrites. LOCAL by contract:
+// nothing is sent (a module that wants peers to see it broadcasts its own op), and the
+// systems live at the SCENE ROOT under fixed names (golden rule 5: objectsGroup is
+// replicated, the scene root is local), so no burst can leak into a save or a GLTF sync.
+//
+// Ticked from the flow runtime's frame loop (the module frame-task list — it runs on the
+// desktop AND in a headset, where window rAF stops), and parked invisible between bursts.
+// `depthWrite: false` is right for soft sprites; a burst is short enough that the AO/outline
+// trade-off (the documented depthWrite trap) does not matter.
+//
+// Kinds (the motion model per kind is the only thing that differs):
+//  sparkle  gold twinkling stars that drift up, additive
+//  confetti many-coloured flakes thrown up, falling under gravity, normal blending
+//  smoke    grey puffs that rise, swell and thin
+//  sparks   fast orange streaks, gravity, very short
+import * as THREE from 'three';
+import { get } from 'svelte/store';
+import { globalScene, globalRenderer, globalCamera } from '../stores/sceneStore';
+import { moduleFrameTasks } from './moduleSDK';
+
+export const BURST_KINDS = ['sparkle', 'confetti', 'smoke', 'sparks'];
+export const POOL_SIZE = 12;
+export const MAX_COUNT = 96;
+
+/**
+ * The per-kind recipe. Pure data; `life` in seconds, speeds in m/s, `size` in metres.
+ * @type {Record<string, {count: number, life: number, speed: number, up: number, gravity: number, drag: number, size: number, grow: number, additive: boolean, color: string, palette?: string[]}>}
+ */
+export const BURST_RECIPES = {
+	sparkle: { count: 40, life: 1.1, speed: 1.2, up: 0.8, gravity: -0.4, drag: 1.6, size: 0.09, grow: -0.5, additive: true, color: '#ffd76a' },
+	confetti: { count: 80, life: 2.2, speed: 3.2, up: 3.2, gravity: -5.5, drag: 1.2, size: 0.07, grow: 0, additive: false, color: '#ffffff', palette: ['#ef4444', '#f59e0b', '#22c55e', '#3b82f6', '#a855f7', '#ec4899'] },
+	smoke: { count: 28, life: 2.4, speed: 0.5, up: 0.9, gravity: 0.3, drag: 0.8, size: 0.35, grow: 1.4, additive: false, color: '#9ca3af' },
+	sparks: { count: 60, life: 0.55, speed: 5.5, up: 1.5, gravity: -9.8, drag: 0.6, size: 0.045, grow: -0.6, additive: true, color: '#ffa53a' }
+};
+
+/**
+ * Where each particle starts heading: a deterministic spread over the sphere (a golden-
+ * angle spiral), so a burst looks the same every time and the maths is testable. Returns
+ * unit directions with the upward kick of the recipe folded into y later.
+ * @param {number} n @returns {number[][]}
+ */
+export function burstDirections(n) {
+	/** @type {number[][]} */
+	const out = [];
+	const golden = Math.PI * (3 - Math.sqrt(5));
+	for (let i = 0; i < n; i++) {
+		const y = 1 - (2 * (i + 0.5)) / n;
+		const r = Math.sqrt(Math.max(0, 1 - y * y));
+		const a = golden * i;
+		out.push([Math.cos(a) * r, y, Math.sin(a) * r]);
+	}
+	return out;
+}
+
+/** @type {THREE.Texture | null} */
+let sprite = null;
+/** a soft round dot, drawn once (a square point reads as a pixel, not a particle) */
+function spriteTexture() {
+	if (sprite) return sprite;
+	const canvas = document.createElement('canvas');
+	canvas.width = canvas.height = 64;
+	const g = /** @type {CanvasRenderingContext2D} */ (canvas.getContext('2d'));
+	const grad = g.createRadialGradient(32, 32, 0, 32, 32, 32);
+	grad.addColorStop(0, 'rgba(255,255,255,1)');
+	grad.addColorStop(0.35, 'rgba(255,255,255,0.85)');
+	grad.addColorStop(1, 'rgba(255,255,255,0)');
+	g.fillStyle = grad;
+	g.fillRect(0, 0, 64, 64);
+	sprite = new THREE.CanvasTexture(canvas);
+	sprite.colorSpace = THREE.SRGBColorSpace;
+	return sprite;
+}
+
+/**
+ * @typedef {object} BurstSystem
+ * @property {THREE.Points} points
+ * @property {Float32Array} pos @property {Float32Array} vel @property {Float32Array} col
+ * @property {Float32Array} base the per-particle start colour (col fades from it)
+ * @property {number} count @property {number} age @property {number} life
+ * @property {any} recipe @property {number} startedAt
+ */
+
+/** @type {BurstSystem[]} */
+const pool = [];
+let lastTick = 0;
+let ticking = false;
+const stats = { fired: 0, recycled: 0 };
+
+/** @param {number} index @returns {BurstSystem} */
+function makeSystem(index) {
+	const geometry = new THREE.BufferGeometry();
+	const pos = new Float32Array(MAX_COUNT * 3);
+	const col = new Float32Array(MAX_COUNT * 3);
+	geometry.setAttribute('position', new THREE.BufferAttribute(pos, 3).setUsage(THREE.DynamicDrawUsage));
+	geometry.setAttribute('color', new THREE.BufferAttribute(col, 3).setUsage(THREE.DynamicDrawUsage));
+	geometry.setDrawRange(0, 0);
+	const material = new THREE.PointsMaterial({
+		size: 0.1,
+		map: spriteTexture(),
+		vertexColors: true,
+		transparent: true,
+		depthWrite: false,
+		sizeAttenuation: true
+	});
+	const points = new THREE.Points(geometry, material);
+	points.name = 'effects-burst-' + index;
+	points.frustumCulled = false; // the particles fly out of any bounds computed at t=0
+	points.visible = false;
+	points.renderOrder = 996;
+	points.userData.localOnly = true;
+	return {
+		points,
+		pos,
+		vel: new Float32Array(MAX_COUNT * 3),
+		col,
+		base: new Float32Array(MAX_COUNT * 3),
+		count: 0,
+		age: 0,
+		life: 0,
+		recipe: null,
+		startedAt: 0
+	};
+}
+
+/**
+ * Compile the burst material NOW, while nothing is showing. three builds a program on the
+ * first draw that needs it, and on a loaded device (a headset mid-game) that stall ate the
+ * first burst of a session whole — measured: the first burst on a page changed 0 pixels,
+ * every later one ~1500. One material, one program; cheap.
+ * @param {any} scene
+ */
+function warmUp(scene) {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	const camera = /** @type {any} */ (get(globalCamera));
+	const probe = pool[0]?.points;
+	if (!renderer?.compile || !camera || !probe) return;
+	const was = probe.visible;
+	probe.visible = true; // compile() walks VISIBLE objects only
+	try {
+		renderer.compile(probe, camera, scene);
+	} catch {
+		/* a lost context compiles nothing; the first draw will */
+	}
+	probe.visible = was;
+}
+
+/** the free system, or the oldest running one @returns {BurstSystem | null} */
+function takeSystem() {
+	const scene = /** @type {any} */ (get(globalScene));
+	if (!scene) return null;
+	const fresh = pool.length === 0;
+	while (pool.length < POOL_SIZE) pool.push(makeSystem(pool.length));
+	for (const sys of pool) if (sys.points.parent !== scene) scene.add(sys.points);
+	if (fresh) warmUp(scene);
+	const idle = pool.find((sys) => !sys.points.visible);
+	if (idle) return idle;
+	stats.recycled++;
+	return pool.reduce((a, b) => (a.startedAt <= b.startedAt ? a : b));
+}
+
+/** @param {string | undefined} kind */
+function recipeOf(kind) {
+	return BURST_RECIPES[kind && BURST_RECIPES[kind] ? kind : 'sparkle'];
+}
+
+/**
+ * Fire a burst at a world position. LOCAL. Returns the system's name, or null when there
+ * is no scene or the position is not three finite numbers.
+ * @param {number[]} position @param {{kind?: string, color?: string, count?: number}} [options]
+ * @returns {string | null}
+ */
+export function burst(position, options = {}) {
+	if (!Array.isArray(position) || position.length < 3 || !position.slice(0, 3).every((n) => Number.isFinite(Number(n)))) return null;
+	const sys = takeSystem();
+	if (!sys) return null;
+	const recipe = recipeOf(options?.kind);
+	const wanted = Number(options?.count);
+	const count = Math.max(1, Math.min(MAX_COUNT, Math.round(Number.isFinite(wanted) && wanted > 0 ? wanted : recipe.count)));
+	const dirs = burstDirections(count);
+	const tint = new THREE.Color();
+	const custom = typeof options?.color === 'string' && options.color ? options.color : null;
+	for (let i = 0; i < count; i++) {
+		const d = dirs[i];
+		// a small per-particle speed variation from the index (deterministic)
+		const speed = recipe.speed * (0.55 + 0.45 * (((i * 7919) % 97) / 97));
+		sys.pos[i * 3] = Number(position[0]);
+		sys.pos[i * 3 + 1] = Number(position[1]);
+		sys.pos[i * 3 + 2] = Number(position[2]);
+		sys.vel[i * 3] = d[0] * speed;
+		sys.vel[i * 3 + 1] = d[1] * speed + recipe.up;
+		sys.vel[i * 3 + 2] = d[2] * speed;
+		const colour = custom ?? (recipe.palette ? recipe.palette[i % recipe.palette.length] : recipe.color);
+		tint.set(colour);
+		sys.base[i * 3] = sys.col[i * 3] = tint.r;
+		sys.base[i * 3 + 1] = sys.col[i * 3 + 1] = tint.g;
+		sys.base[i * 3 + 2] = sys.col[i * 3 + 2] = tint.b;
+	}
+	sys.count = count;
+	sys.age = 0;
+	sys.life = recipe.life;
+	sys.recipe = recipe;
+	sys.startedAt = performance.now();
+	const material = /** @type {THREE.PointsMaterial} */ (sys.points.material);
+	material.blending = recipe.additive ? THREE.AdditiveBlending : THREE.NormalBlending;
+	material.size = recipe.size;
+	material.opacity = 1;
+	material.needsUpdate = true;
+	const geometry = sys.points.geometry;
+	geometry.setDrawRange(0, count);
+	geometry.attributes.position.needsUpdate = true;
+	geometry.attributes.color.needsUpdate = true;
+	sys.points.visible = true;
+	stats.fired++;
+	ensureTicking();
+	return sys.points.name;
+}
+
+/**
+ * Advance every live burst by `dt` seconds. Exported so the suites step it
+ * deterministically; the frame task calls it with the real frame time.
+ * @param {number} dt
+ */
+export function stepBursts(dt) {
+	// the AGE runs on the real clock (a burst lives its life whatever the frame rate — a
+	// throttled tab ticks five times a second); only the INTEGRATION step is capped, so a
+	// long frame cannot fling a particle across the room
+	const elapsed = Math.min(1, Math.max(0, dt));
+	const step = Math.min(0.1, elapsed);
+	for (const sys of pool) {
+		if (!sys.points.visible) continue;
+		sys.age += elapsed;
+		const r = sys.recipe;
+		if (sys.age >= sys.life) {
+			sys.points.visible = false;
+			sys.points.geometry.setDrawRange(0, 0);
+			continue;
+		}
+		const damp = Math.exp(-r.drag * step);
+		const fade = 1 - sys.age / sys.life;
+		for (let i = 0; i < sys.count; i++) {
+			const k = i * 3;
+			sys.vel[k] *= damp;
+			sys.vel[k + 1] = sys.vel[k + 1] * damp + r.gravity * step;
+			sys.vel[k + 2] *= damp;
+			sys.pos[k] += sys.vel[k] * step;
+			sys.pos[k + 1] += sys.vel[k + 1] * step;
+			sys.pos[k + 2] += sys.vel[k + 2] * step;
+			// additive particles fade by DARKENING (black adds nothing); a sparkle twinkles
+			const twinkle = r === BURST_RECIPES.sparkle ? 0.6 + 0.4 * Math.sin(sys.age * 24 + i * 1.7) : 1;
+			const k2 = r.additive ? fade * twinkle : 1;
+			sys.col[k] = sys.base[k] * k2;
+			sys.col[k + 1] = sys.base[k + 1] * k2;
+			sys.col[k + 2] = sys.base[k + 2] * k2;
+		}
+		const material = /** @type {THREE.PointsMaterial} */ (sys.points.material);
+		if (!r.additive) material.opacity = Math.min(1, fade * 1.6);
+		material.size = Math.max(0.005, r.size * (1 + r.grow * (sys.age / sys.life)));
+		sys.points.geometry.attributes.position.needsUpdate = true;
+		sys.points.geometry.attributes.color.needsUpdate = true;
+	}
+}
+
+function frameTask() {
+	const now = performance.now();
+	const dt = lastTick ? (now - lastTick) / 1000 : 0;
+	lastTick = now;
+	stepBursts(dt);
+	if (!pool.some((sys) => sys.points.visible)) {
+		// nothing alive: leave the frame loop until the next burst. AFTER the loop that is
+		// calling us — a splice inside its forEach would skip the next module's task
+		ticking = false;
+		lastTick = 0;
+		queueMicrotask(() => {
+			if (ticking) return; // a burst fired in the meantime
+			const i = moduleFrameTasks.indexOf(frameTask);
+			if (i >= 0) moduleFrameTasks.splice(i, 1);
+		});
+	}
+}
+
+function ensureTicking() {
+	if (ticking) return;
+	ticking = true;
+	lastTick = 0;
+	if (!moduleFrameTasks.includes(frameTask)) moduleFrameTasks.push(frameTask);
+}
+
+/** live systems for the suites @returns {{fired: number, recycled: number, live: {name: string, count: number, age: number, kind: string}[]}} */
+export function burstDebug() {
+	return {
+		...stats,
+		live: pool
+			.filter((sys) => sys.points.visible)
+			.map((sys) => ({
+				name: sys.points.name,
+				count: sys.count,
+				age: sys.age,
+				kind: Object.keys(BURST_RECIPES).find((k) => BURST_RECIPES[k] === sys.recipe) ?? ''
+			}))
+	};
+}
+
+/** Drop every live burst (a scene clear) */
+export function clearBursts() {
+	for (const sys of pool) {
+		sys.points.visible = false;
+		sys.points.geometry.setDrawRange(0, 0);
+	}
+}
diff --git a/src/lib/environment.js b/src/lib/environment.js
index 8eaedb53..607d8a6d 100644
--- a/src/lib/environment.js
+++ b/src/lib/environment.js
@@ -88,6 +88,7 @@ export const ENV_ROOT = 'environment-root';
 const RIG_HEMI = 'env-rig-hemi';
 const RIG_SUN = 'env-rig-sun';
 const CATCHER = 'env-shadow-catcher';
+const GROUND = 'env-ground';
 const EXTRA_PREFIX = 'env-extra-';
 let userLightFactor = 1;
 
@@ -159,6 +160,73 @@ function shadowCatcher(scene, create) {
 	return disc;
 }
 
+/**
+ * 30 author-kit: a custom payload may carry two ADDITIVE sky fields, both absent on every
+ * stock preset and every older save, so those render exactly as before:
+ *   gradient: {top, bottom}  — a vertical background gradient. `background` stays a plain
+ *     colour beside it (the `backgroundColor` store and an older peer, which ignores the
+ *     gradient, read that one — authors set it to the horizon colour).
+ *   ground: {color, roughness?} — a solid ground disc under the scene that RECEIVES the sun's
+ *     shadows (so the ShadowMaterial catcher stands down while it shows).
+ * Both are read through these two normalizers only — a malformed value reads as absent.
+ * @param {any} preset @returns {{top: string, bottom: string} | null} */
+export function skyGradientOf(preset) {
+	const g = preset?.gradient;
+	return g && typeof g.top === 'string' && typeof g.bottom === 'string' ? { top: g.top, bottom: g.bottom } : null;
+}
+
+/** @param {any} preset @returns {{color: string, roughness: number} | null} */
+export function skyGroundOf(preset) {
+	const g = preset?.ground;
+	if (!g || typeof g.color !== 'string') return null;
+	return { color: g.color, roughness: Number.isFinite(g.roughness) ? g.roughness : 1 };
+}
+
+/** @type {{key: string, texture: THREE.CanvasTexture} | null} one cached gradient texture */
+let gradientCache = null;
+
+/** A 2x256 vertical gradient as a screen-filling background texture (three stretches a
+ * plain texture background over the viewport). Cached by its two colours.
+ * @param {{top: string, bottom: string}} gradient */
+function gradientTexture(gradient) {
+	const key = gradient.top + '|' + gradient.bottom;
+	if (gradientCache?.key === key) return gradientCache.texture;
+	if (typeof document === 'undefined') return null;
+	const canvas = document.createElement('canvas');
+	canvas.width = 2;
+	canvas.height = 256;
+	const ctx = canvas.getContext('2d');
+	if (!ctx) return null;
+	const fill = ctx.createLinearGradient(0, 0, 0, 256);
+	fill.addColorStop(0, gradient.top);
+	fill.addColorStop(1, gradient.bottom);
+	ctx.fillStyle = fill;
+	ctx.fillRect(0, 0, 2, 256);
+	const texture = new THREE.CanvasTexture(canvas);
+	texture.colorSpace = THREE.SRGBColorSpace;
+	gradientCache?.texture.dispose();
+	gradientCache = { key, texture };
+	return texture;
+}
+
+/** The solid ground disc (a scene-root mesh in ENV_ROOT, like the catcher, so it never
+ * enters objectsGroup, sync or a save — the payload's `ground` field is what travels).
+ * @param {any} scene @param {boolean} create */
+function groundDisc(scene, create) {
+	const root = envRoot(scene);
+	let disc = scene.getObjectByName(GROUND);
+	if (!disc && create) {
+		disc = new THREE.Mesh(new THREE.CircleGeometry(1, 64), new THREE.MeshStandardMaterial({ color: '#808080', roughness: 1 }));
+		disc.name = GROUND;
+		disc.rotation.x = -Math.PI / 2;
+		// under the catcher's plane and a hair under y = 0, so a floor authored AT 0 wins
+		disc.position.y = -0.01;
+		disc.receiveShadow = true;
+		root.add(disc);
+	}
+	return disc;
+}
+
 /** Create/update/remove `env-extra-*` lights to mirror state.lights @param {any} scene @param {any[]} defs */
 function reconcileExtraLights(scene, defs) {
 	const root = envRoot(scene);
@@ -215,7 +283,9 @@ export function applyEnvironment() {
 		scene.background = null;
 		scene.fog = null;
 	} else {
-		scene.background = new THREE.Color(preset.background);
+		// 30 author-kit: a gradient sky when the payload carries one, else the flat colour
+		const gradient = skyGradientOf(preset);
+		scene.background = (gradient && gradientTexture(gradient)) || new THREE.Color(preset.background);
 		// fog never swallows a big scene: its reach grows with the scene bounds
 		scene.fog = preset.fog
 			? new THREE.Fog(
@@ -283,9 +353,24 @@ export function applyEnvironment() {
 	// object to a real table (the sky/fog lift above is the whole AR stand-down;
 	// the sun rig keeps casting untouched)
 	const shadowsOff = shadowsDisabled();
+	// 30 author-kit: an authored solid ground receives the shadows itself, so the catcher
+	// (which only darkens) stands down while the ground shows
+	// (and, like the sky, the ground lifts in passthrough: it would cover the real room)
+	const ground = skyGroundOf(preset);
+	const groundShown = !!ground && !wireframeActive() && !get(passthroughActive);
+	const disc = groundDisc(scene, !!ground);
+	if (disc) {
+		disc.visible = groundShown;
+		if (ground) {
+			disc.material.color.set(ground.color);
+			disc.material.roughness = ground.roughness;
+		}
+		const span = Math.max(200, sceneRadius() * 4);
+		disc.scale.set(span, span, span);
+	}
 	const catcher = shadowCatcher(scene, !!(preset.sun && !shadowsOff));
 	if (catcher) {
-		catcher.visible = !!(preset.sun && !shadowsOff) && !wireframeActive();
+		catcher.visible = !!(preset.sun && !shadowsOff) && !groundShown && !wireframeActive();
 		const span = Math.max(60, sceneRadius() * 2);
 		catcher.scale.set(span, span, span);
 	}
diff --git a/src/lib/explorerDrop.js b/src/lib/explorerDrop.js
index 8eba91af..b3de320d 100644
--- a/src/lib/explorerDrop.js
+++ b/src/lib/explorerDrop.js
@@ -6,6 +6,7 @@ import { peers, showToast, toastStore, stackOnDrop } from '../stores/appStore';
 import { explorerItems, itemBlob } from './explorer';
 import { prefabs, instantiatePrefab } from './prefabs';
 import { importFile } from './fileHandler.svelte';
+import { packRefFromUrl } from './packRefs';
 import { setObjectTexture } from './materialsHandler';
 import { topLevelObjectOf } from './objectActions';
 import { sceneHits, hitWorldNormal } from './scenePick';
@@ -205,7 +206,11 @@ async function placeExplorerPayload(payload, target) {
 				dismiss();
 				return showToast('Could not fetch the pack item');
 			}
-			importFile(new File([await res.blob()], name + '.glb'), name, undefined, target.point ?? undefined);
+			// 30c: the placed piece carries its pack reference, so a save and the wire write it
+			// as a small stub instead of the whole model (packRefs.js)
+			importFile(new File([await res.blob()], name + '.glb'), name, undefined, target.point ?? undefined, undefined, {
+				packRef: packRefFromUrl(payload.url, { item: name })
+			});
 			dismiss();
 		} catch {
 			dismiss();
diff --git a/src/lib/fileHandler.svelte.js b/src/lib/fileHandler.svelte.js
index a79248e6..2a085ab8 100644
--- a/src/lib/fileHandler.svelte.js
+++ b/src/lib/fileHandler.svelte.js
@@ -23,6 +23,8 @@ import { createGltfLoader, registerAnimatedImport, recordAnimatedImport, sendAni
 import { environment } from './environment';
 import { parkAnimatedAtBase } from '$lib/flowRuntime';
 import { stripEditOverlays } from '$lib/editOverlays';
+import { stampPackRef } from '$lib/packRefs';
+import { hashBytes } from '$lib/explorer';
 import { saveFileBase } from '$lib/saveName';
 import { peers, fixLight, loadingFile, showToast, showInfoToast, dismissToastById } from '../stores/appStore';
 import { safeStorage } from './safeStorage';
@@ -666,7 +668,10 @@ function defaultImportName(extension, name) {
  * @param {any} file @param {string=} name @param {string=} ext - explicit extension when the blob has no name (Library)
  * @param {number[]=} position - world drop point (Explorer drag-out, 96)
  * @param {any[]=} extras - companion files picked/dropped alongside (.mtl + its textures)
- * @param {{reduce?: boolean | import('./importBudget').ReductionPlan}} [opts] 26-F: import REDUCED
+ * @param {{reduce?: boolean | import('./importBudget').ReductionPlan, packRef?: import('./packRefs').PackRef | null}} [opts]
+ *   26-F: `reduce` imports REDUCED. 30c: `packRef` names the PACK ITEM this file is — the
+ *   placed root then carries the reference (packRefs.js), so a save and the wire write it
+ *   as a small stub. Ignored for an animated or a reduced import (neither IS the file).
  * @returns {Promise<string|null>} the placed root's uuid, or null when nothing was placed
  */
 export async function importFile(file, name, ext, position, extras, opts = {}) {
@@ -703,6 +708,9 @@ export async function importFile(file, name, ext, position, extras, opts = {}) {
 		return null;
 	}
 	try {
+		// 30c: stamp the pack reference BEFORE addImported, which is what replicates it
+		if (opts.packRef && !parsed.animated && typeof file?.arrayBuffer === 'function')
+			stampPackRef(parsed.root, opts.packRef, await hashBytes(await file.arrayBuffer()));
 		if (parsed.animated) addAnimatedImport(parsed.animated.result, parsed.animated.buffer, label, parsed.animated.kind);
 		else addImported(parsed.root, label, position);
 		for (const note of parsed.notes) showToast(note);
diff --git a/src/lib/flowRuntime.js b/src/lib/flowRuntime.js
index a6ba1e78..81bdbecf 100644
--- a/src/lib/flowRuntime.js
+++ b/src/lib/flowRuntime.js
@@ -68,6 +68,10 @@ import {
 // so a user can hand over what happened (hardening audit H4). A zero-import leaf.
 import { log } from './diagnostics';
 import { safeStorage } from './safeStorage';
+// 30 P4: the device-local store Store Value / Stored Value read and write (a leaf)
+import { sceneStorageKey, readStored, writeStored } from './gameStorage';
+// 30b (core-games): the game-feel nodes' runtime half (announce/sound/burst/haptic/music)
+import { GAME_FEEL_ACTIONS, runGameFeelAction, updateGameMusicNodes, primeGameFeelActions } from './gameFeelActions';
 
 // H3: inputRuntime is reached via a PRIMED dynamic import (the moduleSDK
 // pattern) — a static edge would close the TDZ cycle history -> flowRuntime ->
@@ -1115,6 +1119,40 @@ function updateLeaderboardNodes(time, ctx) {
 /** @type {Map<string, number>} */
 const hudSetActed = new Map();
 
+/** 30 P4: a Store Value / Stored Value key in THIS scene's namespace
+ * (`tp:scene:<scene name or 'untitled'>:<key>`). The name is the scene's own (levels'
+ * `currentLevel`), so a best score belongs to its game. @param {string} key */
+function storedKey(key) {
+	let name = null;
+	try {
+		name = levelsRef ? get(levelsRef.currentLevel)?.name ?? null : null;
+	} catch {}
+	return sceneStorageKey(name, key);
+}
+
+/** 30 P4: the Store Value write. `set` keeps whatever arrived (a number or text); `max`,
+ * `min` and `add` are numeric against what this device already holds, and an unchanged
+ * best writes nothing. @param {any} data */
+function storeValue(data) {
+	const key = String(data.key ?? '').trim();
+	if (!key) return;
+	const full = storedKey(key);
+	const mode = data.mode ?? 'set';
+	if (mode === 'set') {
+		writeStored(full, typeof data.value === 'string' ? data.value : num(data.value ?? 0));
+		return;
+	}
+	const value = num(data.value ?? 0);
+	const held = Number(readStored(full, undefined));
+	const has = Number.isFinite(held);
+	const next =
+		mode === 'max' ? (has ? Math.max(held, value) : value)
+		: mode === 'min' ? (has ? Math.min(held, value) : value)
+		: mode === 'add' ? (has ? held : 0) + value
+		: value;
+	if (!has || next !== held) writeStored(full, next);
+}
+
 /** The element behind an id, across every HUD document. An input's OPTIONS and its
  * `shared` flag live on the element, and a node names only the id. @param {string} id */
 function findHudElement(id) {
@@ -1154,7 +1192,7 @@ function updateGameNodes(time, ctx) {
 	// 1. the ACTIONS, on a fresh trigger stamp only
 	for (const node of nodes) {
 		const type = node.type;
-		if (type !== 'setgamestate' && type !== 'setcamera' && type !== 'setvariable' && type !== 'setlook' && type !== 'travel')
+		if (type !== 'setgamestate' && type !== 'setcamera' && type !== 'setvariable' && type !== 'setlook' && type !== 'travel' && type !== 'storevalue' && !GAME_FEEL_ACTIONS.includes(type))
 			continue;
 		seeActionNode(node, time);
 		const stamp = triggerStampFor(node.id, ctx);
@@ -1197,6 +1235,17 @@ function updateGameNodes(time, ctx) {
 			const hash = typeof data.level === 'string' ? data.level : '';
 			if (sceneName && levelsRef?.travelToScene) levelsRef.travelToScene(sceneName);
 			else if (hash && levelsRef) levelsRef.travelToLevel(hash, String(data.levelName ?? ''));
+		} else if (GAME_FEEL_ACTIONS.includes(type)) {
+			// 30b (core-games): a banner, a sound, a burst or a buzz — LOCAL on every peer from
+			// the replicated stamp, inside the actionSeenAt family above like storevalue (a
+			// fresh node adopting an old stamp must not announce on connect)
+			runGameFeelAction(type, data);
+		} else if (type === 'storevalue') {
+			// 30 P4: a LOCAL write on the stamp edge, inside the actionSeenAt family above (a
+			// fresh node adopting an old stamp must not overwrite a best on connect). It
+			// sends NOTHING: every peer that sees the trigger acts for its own device, which
+			// is the whole semantics of "saved on this device".
+			storeValue(data);
 		} else if (type === 'setcamera') {
 			const uuid = typeof data.camera === 'string' ? data.camera : '';
 			if (uuid) lookThroughCamera(uuid);
@@ -1254,6 +1303,9 @@ function updateGameNodes(time, ctx) {
 	for (const id of [...gameActed.keys()])
 		if (!nodes.some((/** @type {any} */ n) => n.id === id)) gameActed.delete(id);
 
+	// 1a. 30b (core-games): Game Music is a DECLARATION (present = wanted), read per frame
+	updateGameMusicNodes(nodes, (/** @type {any} */ node) => resolveInputs(node, nodes, edges, time, ctx), game.state);
+
 	// 1b. 21-F4 ALLPLAYERS — the group-travel gate. Each peer evaluates the wired
 	// condition for ITSELF (my answer about my player), publishes the verdict through
 	// the presence channel ON CHANGE, and derives "everyone in play says yes" from the
@@ -1817,6 +1869,7 @@ export const valueTypes = [
 	'gamepadbutton', // 21-E5: pad trigger — the keypress model verbatim
 	'gamepadaxis', // 21-E5: a stick, read LOCALLY (never streamed)
 	'onimpact', // PFX-C: physics impact trigger
+	'ongrab', // 30b (core-games): a player picked it up
 	'onhit', // 24-A A2: the knock's trigger — a handle map: __default pulse + speed/byMe
 	'onenter', 'onexit', // CL-C: sensor overlap triggers
 	'velocity', // CL-C: live speed readout (m/s)
@@ -1828,6 +1881,7 @@ export const valueTypes = [
 	'hudinput', // 21-D4: the HUD as a SOURCE - what the player set on a slider/toggle/etc
 	// 21-D6 the game shell
 	'ongamestate', 'getvariable', 'gametime',
+	'storedvalue', // 30 P4: what Store Value saved on this device
 	// 24-A A4: `peervariable` was MISSING here since 21-G4, and the omission was silent in
 	// every direction that is easy to look at — it has an OUTPUT type in flowSockets, an
 	// evaluator case below, and the editor draws its source handle — but `resolveInputs`
@@ -2189,6 +2243,7 @@ function evalNodeBody(node, allNodes, allEdges, time, seen, ctx) {
 		}
 		case 'animfinished': // 17-E: fired locally when a clip reaches its end
 		case 'animmarker': // 17-E F5: fired locally when the playhead crosses one
+		case 'ongrab': // 30b (core-games): the On Click window, fired on a player's grab
 		case 'onclick': {
 			const trig = ctx && ctx.triggers ? ctx.triggers[node.id] : null;
 			const dt = trig ? time - trig.lastT : Infinity;
@@ -2368,6 +2423,16 @@ function evalNodeBody(node, allNodes, allEdges, time, seen, ctx) {
 			// LOCAL read of REPLICATED state, so every peer computes the same number and
 			// nothing about the read goes on the wire
 			return num(gameVar(String(d.name ?? ''), d.fallback ?? 0));
+		// --- 30 P4: what THIS device saved (never replicated, legitimately per-peer) ---
+		case 'storedvalue': {
+			const key = String(d.key ?? '').trim();
+			const held = key ? readStored(storedKey(key), undefined) : undefined;
+			if (d.output === 'text') {
+				if (held === undefined) return String(d.fallback ?? '');
+				return typeof held === 'string' ? held : JSON.stringify(held);
+			}
+			return held === undefined ? num(d.fallback ?? 0) : num(held);
+		}
 		// --- 21-G4: the PER-PLAYER half of the same idea ---
 		case 'peervariable': {
 			// Also a LOCAL read of REPLICATED state — every peer holds every peer's row —
@@ -2699,14 +2764,46 @@ export function fireModuleTrigger(type, match, opts) {
 }
 
 export function fireObjectClick(uuid) {
+	let fired = 0; // 30b: how many On Click nodes this reached (additive return)
 	nodes.forEach((node) => {
 		if (node.type !== 'onclick') return;
 		// H1: an unwired OnClick inside the clicked object's own graph also fires
-		if (reachesObjectSelector(node.id, uuid) || implicitOwnerOf(node) === uuid)
+		if (reachesObjectSelector(node.id, uuid) || implicitOwnerOf(node) === uuid) {
 			// 21-G4: a perPlayer On Click keeps its pulse LOCAL — that one bit is the
 			// whole per-player collectible (see replicatesPulse)
 			applyNodeTrigger(node.id, syncedNow(), replicatesPulse(node));
+			fired++;
+		}
+	});
+	return fired;
+}
+
+/**
+ * 30b (core-games): a PLAYER picked `uuid` up — the desktop play/interact carry
+ * (playInteract.beginGrab) or a VR Interact grip. Pulses every On Grab node wired to the
+ * object (or unwired inside its own graph), exactly as fireObjectClick does for a click; the
+ * stamp replicates (unless the node is perPlayer), so every peer hears the crate lift.
+ * Returns how many nodes it reached. @param {string} uuid @returns {number}
+ */
+export function fireObjectGrab(uuid) {
+	let fired = 0;
+	nodes.forEach((node) => {
+		if (node.type !== 'ongrab') return;
+		if (reachesObjectSelector(node.id, uuid) || implicitOwnerOf(node) === uuid) {
+			applyNodeTrigger(node.id, syncedNow(), replicatesPulse(node));
+			fired++;
+		}
 	});
+	return fired;
+}
+
+/** 30b (vr-play): would a click on `uuid` reach an On Click node? The same two rules
+ * fireObjectClick fires by — the VR hover tap and the sweep ask it before touching
+ * anything. @param {string} uuid @returns {boolean} */
+export function objectHasOnClick(uuid) {
+	return nodes.some(
+		(node) => node.type === 'onclick' && (reachesObjectSelector(node.id, uuid) || implicitOwnerOf(node) === uuid)
+	);
 }
 
 /**
@@ -3568,6 +3665,7 @@ export function startFlowRuntime() {
 	// knock.js imports physics, which imports this module.
 	import('./knock').then((m) => m.registerHitListener((hit, local) => fireObjectHit(hit, local)));
 	import('./gamePresence').then((m) => (presenceRef = m));
+	primeGameFeelActions(); // 30b: effectsBurst + vrControls, primed (see gameFeelActions)
 	flowGraphs.subscribe(() => {
 		nodes = allNodes();
 		edges = allEdges();
diff --git a/src/lib/flowSockets.js b/src/lib/flowSockets.js
index 96a5eaab..a3b4f2c7 100644
--- a/src/lib/flowSockets.js
+++ b/src/lib/flowSockets.js
@@ -18,6 +18,7 @@ const OUTPUT = {
 	colorpicker: 'color',
 	objectselector: 'object',
 	onclick: 'event',
+	ongrab: 'event', // 30b (core-games)
 	keypress: 'event', // H3
 	// 21-E5: a pad button is an EVENT (the keypress channel), a stick is a NUMBER. Both
 	// therefore reach every existing consumer with no coercion of their own.
@@ -61,6 +62,9 @@ const OUTPUT = {
 	ongamestate: 'event',
 	getvariable: 'number',
 	gametime: 'number',
+	// 30 P4: the readable half of Store Value (a number socket; `output: text` carries a
+	// string down the same channel, the hudtext precedent)
+	storedvalue: 'number',
 	// 21-F3's `collectcount` MOVED to the collectible module (R3a); a module value
 	// node's socket type comes from its registerValueNode `vtype`, so no entry here.
 	// 21-G4: one player's own number (mine / a named peer / the sum / the max)
@@ -168,6 +172,15 @@ const INPUT = {
 	setcamera: { trigger: 'event', camera: 'object' },
 	setlook: { trigger: 'event', camera: 'object', on: 'boolean' },
 	setvariable: { trigger: 'event', value: 'number' },
+	storevalue: { trigger: 'event', value: 'number' }, // 30 P4
+	// 30b (core-games): the Game Feel family — an event, a wired number for {v}, a PLACE
+	// (an object: an undeclared handle types as 'number' and would refuse an Object
+	// Selector), and Game Music's on/off
+	announce: { trigger: 'event', value: 'number' },
+	gamesound: { trigger: 'event', at: 'object' },
+	effectburst: { trigger: 'event', at: 'object' },
+	hapticpulse: { trigger: 'event' },
+	gamemusic: { on: 'boolean' },
 	gamestart: { camera: 'object' },
 	// 21-F4: travel fires on its trigger edge; allplayers takes each player's own
 	// boolean answer (a Latch, a Gate, a Compare — anything true/false)
diff --git a/src/lib/gameAnnounce.js b/src/lib/gameAnnounce.js
new file mode 100644
index 00000000..2aea5559
--- /dev/null
+++ b/src/lib/gameAnnounce.js
@@ -0,0 +1,49 @@
+// 30b (vr-play) — `api.announce(text, {sub, ms, color})`: a BIG centred banner for a
+// game's moments — "GOAL!", "Level 3", "Ring 2 reached". The user, on Towers: "When I
+// reach some of the rings and go to the top, it should dynamically tell me".
+//
+// A LEAF holding one store; two renderers read it — HudLayer on the desktop (DOM) and the
+// VR game panel's head-locked banner in a headset (DOM is invisible there). LOCAL: nothing
+// is sent (a module announces on the peer that saw the moment, or broadcasts its own op).
+// A new announcement REPLACES the one showing — a banner queue would still be showing
+// "Ring 1" when the player reached ring 3.
+import { writable, get } from 'svelte/store';
+
+/** @typedef {{id: number, text: string, sub: string, color: string, ms: number, at: number}} Announcement */
+
+/** the banner on screen, or null @type {import('svelte/store').Writable<Announcement | null>} */
+export const gameAnnouncement = writable(null);
+
+const DEFAULT_MS = 1800;
+const MAX_MS = 15000;
+let nextId = 1;
+/** @type {any} */
+let timer = null;
+
+/**
+ * Show a banner. Returns its id (0 for empty text). `ms` is clamped to 300..15000.
+ * @param {string} text @param {{sub?: string, ms?: number, color?: string}} [options]
+ * @returns {number}
+ */
+export function announce(text, options = {}) {
+	const line = String(text ?? '').trim().slice(0, 80);
+	if (!line) return 0;
+	const raw = Number(options?.ms);
+	const ms = Number.isFinite(raw) ? Math.min(MAX_MS, Math.max(300, raw)) : DEFAULT_MS;
+	const color = typeof options?.color === 'string' && /^#?[0-9a-z(),.% -]{3,40}$/i.test(options.color) ? options.color : '#ffd76a';
+	const id = nextId++;
+	gameAnnouncement.set({ id, text: line, sub: String(options?.sub ?? '').slice(0, 120), color, ms, at: Date.now() });
+	if (timer) clearTimeout(timer);
+	timer = setTimeout(() => {
+		timer = null;
+		if (get(gameAnnouncement)?.id === id) gameAnnouncement.set(null);
+	}, ms);
+	return id;
+}
+
+/** Take the banner down now (a scene clear, leaving the game). */
+export function clearAnnouncement() {
+	if (timer) clearTimeout(timer);
+	timer = null;
+	gameAnnouncement.set(null);
+}
diff --git a/src/lib/gameFeel.js b/src/lib/gameFeel.js
new file mode 100644
index 00000000..400353ae
--- /dev/null
+++ b/src/lib/gameFeel.js
@@ -0,0 +1,38 @@
+// 30b (vr-play): "IS THE PLAYER PLAYING?" — the ONE predicate behind every piece of game
+// feel: controller haptics, game music, the VR game panel and the hold-and-sweep.
+//
+// The user's rule, verbatim from the Quest report: "The vibration should be only
+// interactive mode, not in edit mode." A game feels like a game in INTERACT and in PLAY,
+// and the editor stays quiet. Both halves are LOCAL state on this device (`editorMode` is
+// never sent, `isLocked` is this peer's play press), so nothing here replicates.
+//
+// `isLocked` is THREE-state (null editor / true playing / false the exit transient), so
+// playing is `=== true` — the transient must read "not playing" (the 21-E3 rule).
+// VR has no pointer lock: a headset session enters INTERACT (30b-vr-modes' C1), which is
+// why `editorMode === 'interact'` alone is also enough.
+//
+// A LEAF: sceneStore + svelte/store only, so vrControls, moduleSDK, the audio leaves and
+// the HUD layer can all read it without reaching the history cycle family.
+import { derived, get } from 'svelte/store';
+import { isLocked, editorMode } from '../stores/sceneStore';
+
+/** true while this device is in Interact or Play @returns {boolean} */
+export function gameFeelActive() {
+	return get(isLocked) === true || get(editorMode) === 'interact';
+}
+
+/** the same answer as a store — a falling edge is "the player left the game" */
+export const gameFeelOn = derived(
+	[isLocked, editorMode],
+	([$locked, $mode]) => $locked === true || $mode === 'interact'
+);
+
+/**
+ * The click MODE a game-side press dispatches with (moduleSDK's CLICK_MODES): 'play'
+ * under desktop Play, 'interact' in Interact (VR Play enters Interact), 'edit' otherwise.
+ * @returns {'edit' | 'interact' | 'play'}
+ */
+export function gameClickMode() {
+	if (get(isLocked) === true) return 'play';
+	return get(editorMode) === 'interact' ? 'interact' : 'edit';
+}
diff --git a/src/lib/gameFeelActions.js b/src/lib/gameFeelActions.js
new file mode 100644
index 00000000..fe3dcbc3
--- /dev/null
+++ b/src/lib/gameFeelActions.js
@@ -0,0 +1,223 @@
+// 30b (core-games): GAME FEEL AS FLOW NODES. 30b-vr-play gave MODULES the game-feel kit
+// (api.playSound's procedural set, api.music, api.hapticPattern, api.effects.burst,
+// api.announce), but the three core games — Towers, Stars Room, Jam Room — are authored as
+// FLOW GRAPHS, and a graph had no way to reach any of it: a ring reached could not say so,
+// sparkle, chime or buzz. These are the five nodes that close that gap, and this file is
+// their runtime half (flowRuntime owns the stamp edge; this owns what happens on it).
+//
+// THE SYNC MODEL, one rule for all five: every one is LOCAL, acted on by EVERY peer from
+// the REPLICATED trigger stamp — the setcamera / storevalue / hudscreen house rule. The
+// trigger already travelled, so a banner, a sound, a burst and a buzz happen on each
+// device from the same pulse with NO message of their own. A per-player trigger (a
+// perPlayer On Click) keeps its pulse on the machine that pressed it, so only that player
+// gets the feedback — which composes rather than special-cases.
+//
+// Haptics and music keep the core's own gate (gameFeel: Interact or Play, silent in Edit),
+// because both funnel through the functions that own it (vrControls.hapticPattern,
+// gameMusic.playGameMusic). A sound, a banner and a burst are not gated: a spectator in
+// the editor watching a peer's round sees the ring light and hears it, like every other
+// consequence of a replicated pulse.
+//
+// Deliberately NOT a leaf in the strict sense: it reaches effectsBurst (which imports
+// moduleSDK) and vrControls through PRIMED dynamic imports, the flowRuntime rule — a static
+// edge from a module flowRuntime imports into either closes a cycle into history.
+import * as THREE from 'three';
+import { get } from 'svelte/store';
+import { globalCamera, objectsGroup } from '../stores/sceneStore';
+import { playGameSound, isGameSound, GAME_SOUNDS } from './gameSfx';
+import { announce } from './gameAnnounce';
+import { playGameMusic, stopGameMusic, gameMusicState, MUSIC_PRESET_IDS } from './gameMusic';
+import { gameFeelActive } from './gameFeel';
+import { HAPTIC_PATTERN_NAMES } from './hapticPatterns';
+
+export { GAME_SOUNDS, MUSIC_PRESET_IDS, HAPTIC_PATTERN_NAMES };
+export const BURST_KIND_NAMES = ['sparkle', 'confetti', 'smoke', 'sparks'];
+
+/** the flow node types this file acts for on a trigger's stamp edge */
+export const GAME_FEEL_ACTIONS = ['announce', 'gamesound', 'effectburst', 'hapticpulse'];
+
+/** @type {any} */ let burstRef = null;
+/** @type {any} */ let vrRef = null;
+
+/** flowRuntime's init: resolve the two primed modules (see the header). */
+export function primeGameFeelActions() {
+	import('./effectsBurst').then((m) => (burstRef = m));
+	import('./vrControls').then((m) => (vrRef = m));
+}
+
+/** what each node type did — the suites' view (no headset, no ears) */
+const debug = {
+	/** @type {Record<string, number>} */ fired: {},
+	/** per sound name, so a suite can count coins among the clicks @type {Record<string, number>} */ sounds: {},
+	/** @type {any[]} */ last: [],
+	musicOwner: /** @type {string | null} */ (null),
+	musicStarts: 0,
+	musicStops: 0
+};
+
+/**
+ * Put a wired number into a text: every `{v}` becomes the value, `decimals` places (a
+ * non-number passes through as text). PURE — the hudtext format rule, so an author who
+ * knows one knows the other.
+ * @param {string} text @param {any} value @param {number} [decimals]
+ * @returns {string}
+ */
+export function fillValue(text, value, decimals = 0) {
+	const s = String(text ?? '');
+	if (!s.includes('{v}')) return s;
+	const n = Number(value);
+	const d = Math.max(0, Math.min(6, Math.round(Number(decimals) || 0)));
+	const shown = value === undefined || value === null || value === '' ? '' : Number.isFinite(n) ? n.toFixed(d) : String(value);
+	return s.split('{v}').join(shown);
+}
+
+/** a named object's world position, or null @param {any} uuid @returns {number[] | null} */
+function worldPositionOf(uuid) {
+	if (typeof uuid !== 'string' || !uuid) return null;
+	const object = get(objectsGroup)?.getObjectByProperty?.('uuid', uuid);
+	if (!object) return null;
+	object.updateWorldMatrix(true, false);
+	const p = object.getWorldPosition(new THREE.Vector3());
+	return [p.x, p.y, p.z];
+}
+
+/** a point `metres` in front of the viewer's eyes at eye height — where a banner-sized
+ * burst belongs when nothing names a place (the confetti at a round's end) */
+function inFrontOfPlayer(metres = 1.6) {
+	/** @type {any} */
+	const camera = get(globalCamera);
+	if (!camera?.getWorldPosition) return null;
+	camera.updateMatrixWorld?.(true);
+	const eye = camera.getWorldPosition(new THREE.Vector3());
+	const dir = camera.getWorldDirection(new THREE.Vector3());
+	dir.y = Math.max(-0.2, Math.min(0.2, dir.y));
+	dir.normalize();
+	const p = eye.addScaledVector(dir, metres);
+	return [p.x, p.y, p.z];
+}
+
+/** @param {string} type @param {any} what */
+function note(type, what) {
+	debug.fired[type] = (debug.fired[type] ?? 0) + 1;
+	debug.last.push({ type, ...what, at: Date.now() });
+	if (debug.last.length > 120) debug.last.shift();
+}
+
+/**
+ * ONE stamp edge of a game-feel action node, already past flowRuntime's freshness and
+ * staleness checks. `data` is the node's resolved inputs.
+ * @param {string} type @param {any} data
+ * @returns {boolean} whether it did something
+ */
+export function runGameFeelAction(type, data) {
+	if (type === 'announce') {
+		const text = fillValue(data.text ?? '', data.value, data.decimals);
+		const sub = fillValue(data.sub ?? '', data.value, data.decimals);
+		const id = announce(text, { sub, ms: Number(data.seconds ?? 1.8) * 1000, color: data.color || undefined });
+		if (id) note(type, { text, sub });
+		return id > 0;
+	}
+	if (type === 'gamesound') {
+		const name = String(data.sound ?? 'click');
+		if (!isGameSound(name)) return false;
+		const at = worldPositionOf(data.at);
+		const ok = playGameSound(name, at);
+		debug.sounds[name] = (debug.sounds[name] ?? 0) + 1;
+		note(type, { sound: name, spatial: !!at, played: ok });
+		return ok;
+	}
+	if (type === 'effectburst') {
+		const at = worldPositionOf(data.at);
+		const lift = Number(data.lift ?? 0) || 0;
+		const where = at ? [at[0], at[1] + lift, at[2]] : inFrontOfPlayer();
+		if (!where || !burstRef) return false;
+		const kind = BURST_KIND_NAMES.includes(data.kind) ? data.kind : 'sparkle';
+		const count = Number(data.count);
+		const name = burstRef.burst(where, {
+			kind,
+			...(typeof data.color === 'string' && data.color ? { color: data.color } : {}),
+			...(Number.isFinite(count) && count > 0 ? { count } : {})
+		});
+		note(type, { kind, where, fired: !!name });
+		return !!name;
+	}
+	if (type === 'hapticpulse') {
+		const pattern = String(data.pattern ?? 'tap');
+		const hand = data.hand === 'left' || data.hand === 'right' ? data.hand : undefined;
+		// gated inside (silent in Edit, the user's rule) — the count still says we asked
+		const ok = vrRef?.hapticPattern?.(pattern, hand) ?? false;
+		note(type, { pattern, hand: hand ?? 'both', felt: !!ok });
+		return !!ok;
+	}
+	return false;
+}
+
+/**
+ * Which Game Music node wants to play right now — PURE (the stores stay in the caller), so
+ * the rule is unit-tested: the FIRST node in graph order whose `on` is not false (unwired
+ * = on) and whose `while` allows the shell's state ('round' = playing or paused), with a
+ * known preset. @param {any[]} nodes @param {(node: any) => any} resolve
+ * @param {string} gameStateName @returns {{id: string, preset: string, volume: number} | null}
+ */
+export function musicWanted(nodes, resolve, gameStateName) {
+	for (const node of nodes) {
+		if (node?.type !== 'gamemusic') continue;
+		const data = resolve(node) ?? {};
+		if (data.on === false || data.on === 0) continue;
+		const during = data.while ?? 'always';
+		if (during === 'round' && gameStateName !== 'playing' && gameStateName !== 'paused') continue;
+		const preset = String(data.preset ?? '');
+		if (!MUSIC_PRESET_IDS.includes(preset)) continue;
+		const v = Number(data.volume);
+		return { id: node.id, preset, volume: Number.isFinite(v) ? Math.min(1, Math.max(0, v)) : 0.7 };
+	}
+	return null;
+}
+
+/**
+ * THE MUSIC NODE is a DECLARATION, not an action (the Character Controller's shape): a
+ * Game Music node that WANTS to play — its `on` input true or unwired, and during a round
+ * when `while` says so — plays its preset while this device is in Interact or Play, and
+ * stops when nothing wants it. Level-triggered, so leaving and re-entering Interact brings
+ * the music back with no pulse, and a late joiner hears it the moment it arrives.
+ * The FIRST wanting node in graph order wins; music a MODULE started is never stopped
+ * here (we stop only what we started).
+ * @param {any[]} nodes every flow node @param {(node: any) => any} resolve resolved inputs
+ * @param {string} gameStateName the shell's state ('menu' | 'playing' | ...)
+ */
+export function updateGameMusicNodes(nodes, resolve, gameStateName) {
+	const want = musicWanted(nodes, resolve, gameStateName);
+	const playing = get(gameMusicState);
+	if (want && gameFeelActive()) {
+		if (!playing || playing.preset !== want.preset || Math.abs((playing.volume ?? 1) - want.volume) > 1e-3) {
+			// a preset someone else started is left alone unless we are the owner already
+			if (playing && debug.musicOwner === null) return;
+			if (playGameMusic(want.preset, { volume: want.volume })) {
+				if (!playing || playing.preset !== want.preset) debug.musicStarts++;
+				debug.musicOwner = want.id;
+			}
+		}
+		return;
+	}
+	if (debug.musicOwner !== null) {
+		if (playing) {
+			stopGameMusic();
+			debug.musicStops++;
+		}
+		debug.musicOwner = null;
+	}
+}
+
+/** the suites' view @returns {any} */
+export function gameFeelActionsDebug() {
+	return { fired: { ...debug.fired }, sounds: { ...debug.sounds }, last: debug.last.map((e) => ({ ...e })), musicOwner: debug.musicOwner, musicStarts: debug.musicStarts, musicStops: debug.musicStops };
+}
+
+/** forget the counters (a suite section's clean slate) */
+export function resetGameFeelActionsDebug() {
+	debug.fired = {};
+	debug.sounds = {};
+	debug.last = [];
+	debug.musicStarts = 0;
+	debug.musicStops = 0;
+}
diff --git a/src/lib/gameKit.js b/src/lib/gameKit.js
new file mode 100644
index 00000000..8306fbbb
--- /dev/null
+++ b/src/lib/gameKit.js
@@ -0,0 +1,13 @@
+// 30b (vr-play): the game-feel leaves under ONE debug-hook name (`__stores.gameKit`), so
+// this lane adds one entry to App.svelte's three tails instead of one per leaf. Nothing in
+// the app imports this file; it exists for the suites.
+export * as gameFeel from './gameFeel';
+export * as gameSfx from './gameSfx';
+export * as gameMusic from './gameMusic';
+export * as gameMusicPresets from './gameMusicPresets';
+export * as hapticPatterns from './hapticPatterns';
+export * as vrGameInput from './vrGameInput';
+export * as effectsBurst from './effectsBurst';
+export * as gameAnnounce from './gameAnnounce';
+export * as vrGamePanel from './vrGamePanel';
+export * as gameFeelActions from './gameFeelActions'; // 30b (core-games): the Game Feel flow nodes
diff --git a/src/lib/gameMusic.js b/src/lib/gameMusic.js
new file mode 100644
index 00000000..40fdbde4
--- /dev/null
+++ b/src/lib/gameMusic.js
@@ -0,0 +1,236 @@
+// 30b (vr-play) C5 — GAME MUSIC: `api.music.play(preset, {volume})` / `api.music.stop()`.
+// Seven procedural looping presets (gameMusicPresets.js is the tune as data), scheduled on
+// the app's one AudioContext and LOCAL to this device — a peer's music is theirs.
+//
+// THREE RULES, each one the user's:
+//  · it plays only while the player is PLAYING (Interact or Play — gameFeel.js). A call
+//    from the editor is refused, and leaving the game stops it: "music stops on leaving
+//    Play/Interact". Refusing in Edit is stricter than "stop on leave" and is on purpose —
+//    a module that started its music from register() would otherwise score the editor.
+//  · it sits UNDER the effects: one "Music" volume in Settings (persisted via safeStorage)
+//    times a quiet MIX constant, into the engine's `music` bus.
+//  · it is TEMPO-SYNCED to the SESSION clock: the step that plays is floor(sessionNow /
+//    step length), never "steps since the button" — two peers who start one preset hear
+//    the same bar at the same moment, and a restart lands back on the beat.
+//
+// The scheduler is the classic lookahead: a 25 ms timer schedules every step whose time
+// falls inside the next LOOKAHEAD seconds on the audio clock (audioTimeFor maps a session
+// stamp through the engine's filtered clock). A TIMER, not a rAF: an immersive session
+// stops window rAF on the Quest, and music must not.
+import { writable, get } from 'svelte/store';
+import { ensureAudioContext, bus, audioTimeFor } from './audioEngine';
+import { sessionNow } from './sessionClock';
+import { safeStorage } from './safeStorage';
+import { gameFeelOn, gameFeelActive } from './gameFeel';
+import { sfxTone, sfxNoise } from './gameSfx';
+import { musicPreset, stepSeconds, stepEvents, MUSIC_PRESET_IDS } from './gameMusicPresets';
+
+export { MUSIC_PRESET_IDS };
+
+const VOLUME_KEY = 'game:musicVolume';
+/** music under effects: the slider's full scale is this loud */
+const MIX = 0.55;
+const LOOKAHEAD = 0.18;
+const TICK_MS = 25;
+
+/** @param {string | null} raw @param {number} fallback */
+function readVolume(raw, fallback) {
+	const n = raw === null ? NaN : Number(raw);
+	return Number.isFinite(n) ? Math.min(1, Math.max(0, n)) : fallback;
+}
+
+/** "Music" volume, 0..1, LOCAL per device (Settings ▸ Interface ▸ Sound). */
+export const gameMusicVolume = writable(readVolume(safeStorage.getItem(VOLUME_KEY), 0.6));
+
+/** what is playing now: `{preset, volume}` or null @type {import('svelte/store').Writable<{preset: string, volume: number} | null>} */
+export const gameMusicState = writable(null);
+
+/**
+ * The running session. `gain` is PER PLAY: stopping fades and disconnects it, so any note
+ * already scheduled into it goes silent with it — no voice bookkeeping needed.
+ * @type {{preset: any, volume: number, gain: GainNode, timer: any, lastStep: number, scheduled: number} | null}
+ */
+let current = null;
+const debug = { steps: 0, notes: 0, refused: 0, stops: 0 };
+
+/** @param {number} volume the per-call volume */
+function levelFor(volume) {
+	return MIX * get(gameMusicVolume) * volume;
+}
+
+// Declared ABOVE the subscribes (they run synchronously at module evaluation).
+gameMusicVolume.subscribe((v) => {
+	safeStorage.setItem(VOLUME_KEY, String(v));
+	if (current) current.gain.gain.value = levelFor(current.volume);
+});
+// "music stops on leaving Play/Interact" — the falling edge of the one predicate
+gameFeelOn.subscribe((on) => {
+	if (!on && current) stopGameMusic();
+});
+
+/** @param {number} midi */
+const hz = (midi) => 440 * Math.pow(2, (midi - 69) / 12);
+
+/**
+ * Build one step's notes into `dest` at audio time `t`. Shared by the live scheduler and
+ * the offline render, so what the suite measures is what a player hears.
+ * @param {BaseAudioContext} ctx @param {AudioNode} dest @param {any} preset
+ * @param {number} step @param {number} t @returns {number} notes built
+ */
+export function buildMusicStep(ctx, dest, preset, step, t) {
+	const beat = 60 / preset.bpm;
+	let n = 0;
+	for (const event of stepEvents(preset, step)) {
+		const g = preset.drumGain;
+		switch (event.kind) {
+			case 'kick':
+				sfxTone(ctx, dest, { freq: 140, to: 44, t0: t, dur: 0.24, peak: 0.55 * g, attack: 0.002 });
+				break;
+			case 'snare':
+				sfxNoise(ctx, dest, { t0: t, dur: 0.14, peak: 0.22 * g, filter: 'bandpass', freq: 1800, q: 0.7, attack: 0.002 });
+				sfxTone(ctx, dest, { freq: 190, to: 140, t0: t, dur: 0.08, peak: 0.12 * g, attack: 0.002 });
+				break;
+			case 'hat':
+				sfxNoise(ctx, dest, { t0: t, dur: 0.04, peak: 0.08 * g, filter: 'highpass', freq: 7000, attack: 0.001 });
+				break;
+			case 'bass': {
+				const dur = Math.max(0.12, (event.beats ?? 0.5) * beat * 0.95);
+				const v = preset.bassVoice;
+				const lp = ctx.createBiquadFilter();
+				lp.type = 'lowpass';
+				lp.frequency.value = v.cutoff;
+				lp.connect(dest);
+				sfxTone(ctx, lp, { freq: hz(/** @type {number} */ (event.midi)), type: v.type, t0: t, dur, peak: v.gain, attack: 0.01 });
+				break;
+			}
+			case 'pad': {
+				const dur = (event.beats ?? 4) * beat;
+				for (const m of /** @type {number[]} */ (event.midi))
+					sfxTone(ctx, dest, { freq: hz(m), type: preset.pad.type, t0: t, dur, peak: preset.pad.gain, attack: Math.min(0.6, dur * 0.3) });
+				break;
+			}
+			case 'arp':
+				sfxTone(ctx, dest, { freq: hz(/** @type {number} */ (event.midi)), type: preset.arp.type, t0: t, dur: Math.max(0.1, beat * 0.45), peak: preset.arp.gain, attack: 0.004 });
+				break;
+		}
+		n++;
+	}
+	return n;
+}
+
+function tick() {
+	if (!current) return;
+	const ctx = ensureAudioContext();
+	const stepMs = stepSeconds(current.preset) * 1000;
+	const now = sessionNow();
+	const horizon = now + LOOKAHEAD * 1000;
+	// the first tick starts at the NEXT step boundary — a step already begun would land
+	// part-way through its own notes
+	let step = current.lastStep < 0 ? Math.floor(now / stepMs) + 1 : current.lastStep + 1;
+	// a stalled timer (a background tab) never replays the backlog: skip to now
+	if (step * stepMs < now - 200) step = Math.floor(now / stepMs) + 1;
+	for (; step * stepMs <= horizon; step++) {
+		const at = audioTimeFor(step * stepMs);
+		if (at < ctx.currentTime) continue;
+		debug.notes += buildMusicStep(ctx, current.gain, current.preset, step, at);
+		debug.steps++;
+		current.lastStep = step;
+	}
+}
+
+/**
+ * Start (or switch to) a preset. Refused — false — outside Interact/Play, and for an
+ * unknown preset name. The same preset already playing only takes the new volume.
+ * @param {string} presetId @param {{volume?: number}} [options]
+ * @returns {boolean}
+ */
+export function playGameMusic(presetId, options = {}) {
+	const preset = musicPreset(presetId);
+	if (!preset || !gameFeelActive()) {
+		debug.refused++;
+		return false;
+	}
+	const raw = Number(options?.volume);
+	const volume = Number.isFinite(raw) ? Math.min(1, Math.max(0, raw)) : 1;
+	if (current && current.preset.id === preset.id) {
+		current.volume = volume;
+		current.gain.gain.value = levelFor(volume);
+		gameMusicState.set({ preset: preset.id, volume });
+		return true;
+	}
+	if (current) stopGameMusic();
+	/** @type {AudioContext} */
+	let ctx;
+	try {
+		ctx = ensureAudioContext();
+	} catch {
+		return false;
+	}
+	if (ctx.state === 'suspended') ctx.resume().catch(() => {});
+	const gain = ctx.createGain();
+	gain.gain.value = levelFor(volume);
+	gain.connect(bus('music'));
+	current = { preset, volume, gain, timer: setInterval(tick, TICK_MS), lastStep: -1, scheduled: 0 };
+	tick();
+	gameMusicState.set({ preset: preset.id, volume });
+	return true;
+}
+
+/** Stop whatever is playing (a short fade — a hard cut clicks). Safe to call anytime. */
+export function stopGameMusic() {
+	if (!current) return;
+	const { gain, timer } = current;
+	current = null;
+	clearInterval(timer);
+	debug.stops++;
+	try {
+		const ctx = ensureAudioContext();
+		gain.gain.cancelScheduledValues(ctx.currentTime);
+		gain.gain.setValueAtTime(gain.gain.value, ctx.currentTime);
+		gain.gain.linearRampToValueAtTime(0, ctx.currentTime + 0.3);
+	} catch {
+		/* a closed context has nothing left to fade */
+	}
+	setTimeout(() => {
+		try {
+			gain.disconnect();
+		} catch {}
+	}, 450);
+	gameMusicState.set(null);
+}
+
+/**
+ * Render `bars` bars of a preset OFFLINE and measure them (the suite's proof that every
+ * preset plays a real loop).
+ * @param {string} presetId @param {number} [bars] @param {number} [sampleRate]
+ * @returns {Promise<{preset: string, seconds: number, rms: number, peak: number, notes: number} | null>}
+ */
+export async function renderGameMusic(presetId, bars = 1, sampleRate = 22050) {
+	const preset = musicPreset(presetId);
+	const Offline = typeof window !== 'undefined' ? /** @type {any} */ (window).OfflineAudioContext : null;
+	if (!preset || !Offline) return null;
+	const step = stepSeconds(preset);
+	const seconds = bars * 16 * step + 1;
+	const ctx = new Offline(1, Math.ceil(seconds * sampleRate), sampleRate);
+	let notes = 0;
+	for (let i = 0; i < bars * 16; i++) notes += buildMusicStep(ctx, ctx.destination, preset, i, i * step);
+	const buffer = await ctx.startRendering();
+	const data = buffer.getChannelData(0);
+	let sum = 0;
+	let peak = 0;
+	for (let i = 0; i < data.length; i++) {
+		sum += data[i] * data[i];
+		peak = Math.max(peak, Math.abs(data[i]));
+	}
+	return { preset: preset.id, seconds, rms: Math.sqrt(sum / data.length), peak, notes };
+}
+
+/** the live gain's value, or null when nothing plays */
+export function gameMusicGainValue() {
+	return current ? current.gain.gain.value : null;
+}
+
+/** counts for the suites */
+export function gameMusicDebug() {
+	return { ...debug, playing: current?.preset.id ?? null, lastStep: current?.lastStep ?? -1 };
+}
diff --git a/src/lib/gameMusicPresets.js b/src/lib/gameMusicPresets.js
new file mode 100644
index 00000000..35082b13
--- /dev/null
+++ b/src/lib/gameMusicPresets.js
@@ -0,0 +1,202 @@
+// 30b (vr-play) C5 — the game MUSIC presets as DATA, plus the pure arithmetic that turns
+// a preset and a step number into the notes that step plays. Imports NOTHING: the
+// scheduler (gameMusic.js) is the only thing that touches WebAudio, so everything a
+// listener would call "the tune" is testable with no browser.
+//
+// A preset is a four-bar loop in sixteenth notes: a chord PROGRESSION (scale degrees, one
+// per bar), drum lanes as 16-char strings ('x' hit, '.' rest), a bass lane ('r' root,
+// 'o' octave, 'f' fifth, 't' third), an optional pad (the bar's triad, held) and an
+// optional ARP lane of chord-tone indices ('0'-'5' = triad tones up two octaves).
+//
+// Everything is keyed to a GLOBAL step count (the session clock divided by the step
+// length), never to "when play was pressed" — so two peers who start the same preset hear
+// the same bar at the same moment, and "tempo-synced" means synced to the session.
+
+/** @typedef {{kind: 'kick'|'snare'|'hat'|'bass'|'pad'|'arp', midi?: number[] | number, beats?: number}} MusicEvent */
+
+/**
+ * @typedef {object} MusicPreset
+ * @property {string} id @property {string} name
+ * @property {number} bpm
+ * @property {number} root midi note of the key's tonic (octave 4-ish)
+ * @property {number[]} scale semitone offsets of the mode
+ * @property {number[]} progression scale degrees (0-based), one chord per bar
+ * @property {{kick?: string, snare?: string, hat?: string}} drums 16 chars each
+ * @property {string} bass 16 chars: r o f t .
+ * @property {{type: OscillatorType, gain: number} | null} pad
+ * @property {{lane: string, type: OscillatorType, gain: number, octave: number} | null} arp
+ * @property {{type: OscillatorType, gain: number, cutoff: number}} bassVoice
+ * @property {number} drumGain
+ */
+
+const MAJOR = [0, 2, 4, 5, 7, 9, 11];
+const MINOR = [0, 2, 3, 5, 7, 8, 10];
+const DORIAN = [0, 2, 3, 5, 7, 9, 10];
+const PHRYGIAN = [0, 1, 3, 5, 7, 8, 10];
+const LYDIAN = [0, 2, 4, 6, 7, 9, 11];
+
+/** @type {MusicPreset[]} */
+export const MUSIC_PRESETS = [
+	{
+		id: 'arcade',
+		name: 'Arcade',
+		bpm: 138,
+		root: 60,
+		scale: MAJOR,
+		progression: [0, 5, 3, 4],
+		drums: { kick: 'x...x...x...x...', snare: '....x.......x...', hat: '..x...x...x...x.' },
+		bass: 'r.r.o.r.r.r.o.f.',
+		pad: null,
+		arp: { lane: '0.1.2.3.2.1.0.1.', type: 'square', gain: 0.045, octave: 1 },
+		bassVoice: { type: 'square', gain: 0.07, cutoff: 900 },
+		drumGain: 0.8
+	},
+	{
+		id: 'ambient',
+		name: 'Ambient',
+		bpm: 72,
+		root: 62,
+		scale: LYDIAN,
+		progression: [0, 3, 5, 4],
+		drums: {},
+		bass: 'r...............',
+		pad: { type: 'triangle', gain: 0.05 },
+		arp: { lane: '0.......2.......', type: 'sine', gain: 0.04, octave: 2 },
+		bassVoice: { type: 'sine', gain: 0.09, cutoff: 500 },
+		drumGain: 0
+	},
+	{
+		id: 'dungeon',
+		name: 'Dungeon',
+		bpm: 84,
+		root: 57,
+		scale: PHRYGIAN,
+		progression: [0, 0, 1, 6],
+		drums: { kick: 'x.......x.x.....', snare: '............x...', hat: '' },
+		bass: 'r.......r...f...',
+		pad: { type: 'sawtooth', gain: 0.022 },
+		arp: { lane: '....2.......1...', type: 'triangle', gain: 0.035, octave: 1 },
+		bassVoice: { type: 'sawtooth', gain: 0.07, cutoff: 350 },
+		drumGain: 0.7
+	},
+	{
+		id: 'stadium',
+		name: 'Stadium',
+		bpm: 120,
+		root: 55,
+		scale: MAJOR,
+		progression: [0, 4, 5, 3],
+		drums: { kick: 'x...x...x...x...', snare: '....x.......x.x.', hat: 'x.x.x.x.x.x.x.x.' },
+		bass: 'r.r.r.r.f.f.o.o.',
+		pad: { type: 'sawtooth', gain: 0.025 },
+		arp: null,
+		bassVoice: { type: 'sawtooth', gain: 0.07, cutoff: 700 },
+		drumGain: 0.9
+	},
+	{
+		id: 'space',
+		name: 'Space',
+		bpm: 100,
+		root: 64,
+		scale: DORIAN,
+		progression: [0, 6, 5, 4],
+		drums: { kick: 'x.........x.....', snare: '....x.......x...', hat: '..x...x...x...xx' },
+		bass: 'r.....r.....f...',
+		pad: { type: 'triangle', gain: 0.035 },
+		arp: { lane: '0.2.4.2.1.3.5.3.', type: 'triangle', gain: 0.04, octave: 1 },
+		bassVoice: { type: 'triangle', gain: 0.09, cutoff: 600 },
+		drumGain: 0.6
+	},
+	{
+		id: 'puzzle',
+		name: 'Puzzle',
+		bpm: 96,
+		root: 65,
+		scale: MAJOR,
+		progression: [0, 3, 1, 4],
+		drums: { kick: 'x.......x.......', snare: '', hat: '....x.......x...' },
+		bass: 'r...f...r...t...',
+		pad: null,
+		arp: { lane: '0..2..1..3..2...', type: 'triangle', gain: 0.05, octave: 1 },
+		bassVoice: { type: 'triangle', gain: 0.08, cutoff: 800 },
+		drumGain: 0.5
+	},
+	{
+		id: 'studio',
+		name: 'Studio',
+		bpm: 88,
+		root: 55,
+		scale: MINOR,
+		progression: [0, 3, 6, 4],
+		drums: { kick: 'x......x..x.....', snare: '....x.......x...', hat: 'x.xxx.xxx.xxx.xx' },
+		bass: 'r.....r.f.....o.',
+		pad: { type: 'sine', gain: 0.045 },
+		arp: null,
+		bassVoice: { type: 'sine', gain: 0.1, cutoff: 500 },
+		drumGain: 0.6
+	}
+];
+
+/** @param {string} id @returns {MusicPreset | null} */
+export function musicPreset(id) {
+	return MUSIC_PRESETS.find((p) => p.id === String(id)) ?? null;
+}
+
+/** the names a module can ask for */
+export const MUSIC_PRESET_IDS = MUSIC_PRESETS.map((p) => p.id);
+
+/** seconds per sixteenth note @param {MusicPreset} preset */
+export function stepSeconds(preset) {
+	return 60 / preset.bpm / 4;
+}
+
+/**
+ * The triad (three midi notes) on scale degree `degree`, stacked in thirds inside the
+ * mode — so a minor key's iv is minor and a major key's V is major, with no chord table.
+ * @param {MusicPreset} preset @param {number} degree @returns {number[]}
+ */
+export function triadOn(preset, degree) {
+	const s = preset.scale;
+	/** @param {number} i */
+	const note = (i) => preset.root + s[((i % 7) + 7) % 7] + 12 * Math.floor(i / 7);
+	return [note(degree), note(degree + 2), note(degree + 4)];
+}
+
+/** @param {string | undefined} lane @param {number} i */
+const hitAt = (lane, i) => !!lane && lane[i] !== undefined && lane[i] !== '.';
+
+/**
+ * What global step `step` plays. Pure: same preset + same step = same events, on every
+ * device. The chord changes per BAR (16 steps), cycling the progression.
+ * @param {MusicPreset} preset @param {number} step @returns {MusicEvent[]}
+ */
+export function stepEvents(preset, step) {
+	const i = ((step % 16) + 16) % 16;
+	const bar = Math.floor(step / 16);
+	const degree = preset.progression[((bar % preset.progression.length) + preset.progression.length) % preset.progression.length];
+	const triad = triadOn(preset, degree);
+	/** @type {MusicEvent[]} */
+	const out = [];
+	if (hitAt(preset.drums.kick, i)) out.push({ kind: 'kick' });
+	if (hitAt(preset.drums.snare, i)) out.push({ kind: 'snare' });
+	if (hitAt(preset.drums.hat, i)) out.push({ kind: 'hat' });
+	const b = preset.bass[i];
+	if (b && b !== '.') {
+		const base = triad[0] - 24;
+		const midi = b === 'o' ? base + 12 : b === 'f' ? base + 7 : b === 't' ? triad[1] - 24 : base;
+		// a bass note lasts until the next one in its lane
+		let len = 1;
+		while (len < 16 && (preset.bass[(i + len) % 16] ?? '.') === '.' && i + len < 16) len++;
+		out.push({ kind: 'bass', midi, beats: len / 4 });
+	}
+	if (preset.pad && i === 0) out.push({ kind: 'pad', midi: triad, beats: 4 });
+	if (preset.arp) {
+		const c = preset.arp.lane[i];
+		if (c && c !== '.') {
+			const k = Number(c);
+			const tone = triad[k % 3] + 12 * (Math.floor(k / 3) + preset.arp.octave);
+			out.push({ kind: 'arp', midi: tone, beats: 0.25 });
+		}
+	}
+	return out;
+}
diff --git a/src/lib/gamePresence.js b/src/lib/gamePresence.js
index 3f38f0ca..3771d284 100644
--- a/src/lib/gamePresence.js
+++ b/src/lib/gamePresence.js
@@ -25,11 +25,15 @@
 // history's import subtree, and nothing here registers a history kind.
 
 import { writable, get } from 'svelte/store';
-import { peers } from '../stores/appStore';
+import { peers, showToast } from '../stores/appStore';
 import { isLocked } from '../stores/sceneStore';
 import { rolesInfo } from './cloudHooks';
 import { sessionHost } from './connectionState';
 import { gameState, resetGame } from './gameState';
+// 30 P2: both leaves (hudDocs: svelte/store + gameState + hudKinds + safeStorage; playMode:
+// sceneStore + appStore), so Test play lives here beside the reset permission it obeys
+import { hudIsGame, hudScreenOverride } from './hudDocs';
+import { requestPlay } from './playMode';
 
 /** The two modes. A third would be a protocol change, so the reader treats anything it
  * does not recognise as `editor` (the normalize-at-the-boundary rule). */
@@ -275,8 +279,11 @@ export function isSessionWriter() {
  */
 export function tickAbandonWatch(now = Date.now()) {
 	const game = get(gameState);
-	if (game.state !== 'playing') {
-		// nothing to abandon; forget the arming so the NEXT round starts clean
+	// 30 P2 (roadmap 30 fork 5): EVERY state but `menu` is a round a player can leave — a
+	// paused round and a finished one (`over`, the victory screen) used to linger on the
+	// editor forever, because only `playing` was watched. `menu` is the one state with
+	// nothing to abandon, and reaching it forgets the arming so the NEXT round starts clean.
+	if (game.state === 'menu') {
 		armedRound = null;
 		return 'idle';
 	}
@@ -287,7 +294,11 @@ export function tickAbandonWatch(now = Date.now()) {
 	}
 	// a round nobody has entered yet is not an abandoned round
 	if (armedRound !== game.round) return 'idle';
-	if (now - lastPlayingAt < ABANDON_MS) return 'waiting';
+	// 30 P2: ALONE, leaving IS abandoning — there is nobody whose reload or connect dance
+	// the ten-second window protects, and the round must not sit `playing` with its in-game
+	// HUD waiting for a player who is back in the editor. With peers the window stands.
+	const grace = livePeers().length ? ABANDON_MS : 0;
+	if (now - lastPlayingAt < grace) return 'waiting';
 	if (!isSessionWriter()) return 'notwriter';
 	// re-read through the single write path: `resetGame` is what the admin button calls,
 	// so the two ways a game ends up back at its menu are literally one function
@@ -342,6 +353,41 @@ export function requestResetGame() {
 
 /** @type {(()=>void)[]} */
 let disposers = [];
+/** was this peer in play at the last isLocked notification (the exit EDGE, not a state) */
+let wasPlaying = false;
+/** @type {any} */ let pokeTimer = null;
+
+/** One deferred watch pass; several notifications in one task coalesce into it. */
+function pokeWatch() {
+	if (pokeTimer || typeof setTimeout === 'undefined') return;
+	pokeTimer = setTimeout(() => {
+		pokeTimer = null;
+		tickAbandonWatch();
+	}, 0);
+}
+
+/**
+ * 30 P2 — ▶ TEST PLAY (roadmap 30 fork 4). What an author means by "try my game": back to
+ * the menu, into Play, the Start screen in front of them. Reached from the game chip and
+ * from the play button's right-click menu.
+ *
+ * The reset goes through `requestResetGame`, so it obeys the same rule as the Users
+ * popover's admin entry: the host (or anyone alone) may, an admin under a roles plugin
+ * may, and anybody else JOINS the game as it is — told so, never silently. This peer's
+ * own screen overrides are cleared either way (LOCAL), so the state-bound screen decides
+ * what shows. Play itself is the ordinary `requestPlay`, synchronously inside the click, so
+ * an immersive session is still requested within the gesture that asked for it.
+ * @returns {{ok: boolean, reason?: string}} the reset's verdict
+ */
+export function testPlay() {
+	const game = get(gameState);
+	const pristine = game.state === 'menu' && !game.startedAt;
+	const verdict = pristine ? { ok: true } : requestResetGame();
+	if (!verdict.ok) showToast((verdict.reason ?? 'The game cannot be reset.') + ' Joining the game as it is.');
+	hudScreenOverride.set({});
+	requestPlay();
+	return verdict;
+}
 
 /** Install the presence broadcast + the abandon watch. Idempotent. */
 export function startGamePresence() {
@@ -349,7 +395,26 @@ export function startGamePresence() {
 	// the subscribe lives HERE and not at module scope: a module-level subscribe runs
 	// its callback SYNCHRONOUSLY at module eval, and anything it reads that is declared
 	// below TDZ-crashes the SSR prerender (the documented meshEdit/faceEdit trap)
-	disposers.push(isLocked.subscribe(() => publishPlayMode()));
+	disposers.push(
+		isLocked.subscribe((v) => {
+			publishPlayMode();
+			// 30 P2: a screen THIS peer chose during play (the pause menu a P press opened, a
+			// hudscreen node's override) is play state — it must not follow the player back
+			// into the editor, or the next Play lands on a stale pause screen over a round
+			// that has since returned to its menu. Games only: a plain HUD's overrides are
+			// authored behaviour and keep their old lifetime.
+			if (v !== true && wasPlaying && get(hudIsGame)) hudScreenOverride.set({});
+			wasPlaying = v === true;
+			pokeWatch();
+		})
+	);
+	// 30 P2: the watch also runs on the EDGES, not only on its 1s beat: entering play arms
+	// the round even if the player leaves inside the first second, and the last player
+	// leaving resets a solo round on the spot. Deferred a macrotask, because a tick may
+	// WRITE the game state and these are store notifications (never write a store from
+	// inside a subscriber).
+	disposers.push(gameState.subscribe(() => pokeWatch()));
+	disposers.push(peerPlayModes.subscribe(() => pokeWatch()));
 	watchTimer = setInterval(() => tickAbandonWatch(), WATCH_MS);
 	disposers.push(() => {
 		clearInterval(watchTimer);
@@ -361,6 +426,9 @@ export function startGamePresence() {
 export function stopGamePresence() {
 	for (const dispose of disposers) dispose();
 	disposers = [];
+	if (pokeTimer) clearTimeout(pokeTimer);
+	pokeTimer = null;
+	wasPlaying = false;
 }
 
 /** Test/debug view — `abandonWrites` is the only way to tell WHICH peer wrote a
diff --git a/src/lib/gameSfx.js b/src/lib/gameSfx.js
new file mode 100644
index 00000000..702caca5
--- /dev/null
+++ b/src/lib/gameSfx.js
@@ -0,0 +1,378 @@
+// 30b (vr-play) C5 — THE GAME SOUND SET. Twenty procedural WebAudio effects a game can
+// name (`api.playSound('coin')`), with NO asset files: every sound is oscillators, a
+// shared noise buffer, filters and envelopes, built fresh per play on the app's one
+// AudioContext (audioEngine — a second context would have its own listener and clock).
+//
+// Why procedural and not samples: a module is a self-contained zip, the sound set must be
+// the same on every peer with nothing to fetch, and "the user asked for sounds in every
+// game" is not worth a megabyte of wav per build. The ping chimes (pingAudio.js) set the
+// precedent; this is the same idea grown to a game's vocabulary.
+//
+// ROUTING: every game sound goes through ONE gain (the "Game sounds" volume in Settings,
+// persisted LOCALLY through safeStorage) into the engine's `sfx` bus, so the mixer and the
+// limiter see it like any other effect. A `position` spatialises it through a PannerNode
+// (the engine keeps the listener on the camera/headset whatever spatialVoice says).
+//
+// CAPPED: a sweep across a keyboard or a round of explosions must not stack hundreds of
+// live voices — past MAX_LIVE the oldest-ending ones are simply not started (a dropped
+// sound is inaudible under that many; a stalled audio thread is not).
+//
+// A LEAF: svelte/store + audioEngine + safeStorage. `renderGameSound` renders one into an
+// OfflineAudioContext and MEASURES it — the suite's proof that every name makes a sound.
+import { writable, get } from 'svelte/store';
+import { ensureAudioContext, bus } from './audioEngine';
+import { safeStorage } from './safeStorage';
+
+/** The names a game can play. Anything else is a quiet no-op (never an error). */
+export const GAME_SOUNDS = [
+	'click',
+	'pop',
+	'whoosh',
+	'success',
+	'fail',
+	'hit',
+	'kick',
+	'shoot',
+	'laser',
+	'explosion',
+	'coin',
+	'levelup',
+	'goal',
+	'whistle',
+	'cheer',
+	'step',
+	'ring',
+	'sparkle',
+	'hurt',
+	'portal'
+];
+const SOUND_SET = new Set(GAME_SOUNDS);
+
+/** @param {string} name */
+export function isGameSound(name) {
+	return SOUND_SET.has(String(name));
+}
+
+const VOLUME_KEY = 'game:soundVolume';
+const MAX_LIVE = 24;
+
+/** @param {string | null} raw @param {number} fallback */
+function readVolume(raw, fallback) {
+	const n = raw === null ? NaN : Number(raw);
+	// Number.isFinite, never `|| fallback`: a slider dragged to ZERO is a real volume
+	return Number.isFinite(n) ? Math.min(1, Math.max(0, n)) : fallback;
+}
+
+/** "Game sounds" volume, 0..1, LOCAL per device (Settings ▸ Interface ▸ Sound). */
+export const gameSoundVolume = writable(readVolume(safeStorage.getItem(VOLUME_KEY), 0.8));
+
+/** @type {GainNode | null} */
+let gameGain = null;
+
+// Declared ABOVE the subscribe (the module-level subscribe runs synchronously — TDZ rule).
+gameSoundVolume.subscribe((v) => {
+	safeStorage.setItem(VOLUME_KEY, String(v));
+	if (gameGain) gameGain.gain.value = v;
+});
+
+/** the game-sound gain on the sfx bus, built once @returns {GainNode} */
+function gameOut() {
+	const ctx = ensureAudioContext();
+	if (!gameGain) {
+		gameGain = ctx.createGain();
+		gameGain.gain.value = get(gameSoundVolume);
+		gameGain.connect(bus('sfx'));
+	}
+	return gameGain;
+}
+
+/* ------------------------------------------------------------------ the synth ---- */
+
+/** @type {WeakMap<BaseAudioContext, AudioBuffer>} one second of white noise per context */
+const noiseBuffers = new WeakMap();
+
+/** @param {BaseAudioContext} ctx @returns {AudioBuffer} */
+function noiseBuffer(ctx) {
+	let buffer = noiseBuffers.get(ctx);
+	if (buffer) return buffer;
+	buffer = ctx.createBuffer(1, ctx.sampleRate, ctx.sampleRate);
+	const data = buffer.getChannelData(0);
+	// a fixed LCG, so the same sound renders the same bytes on every device
+	let seed = 0x2f6b1d;
+	for (let i = 0; i < data.length; i++) {
+		seed = (seed * 1664525 + 1013904223) >>> 0;
+		data[i] = (seed / 0xffffffff) * 2 - 1;
+	}
+	noiseBuffers.set(ctx, buffer);
+	return buffer;
+}
+
+/** exponential ramps cannot reach zero */
+const FLOOR = 0.0001;
+
+/**
+ * One enveloped oscillator, optionally gliding.
+ * @param {BaseAudioContext} ctx @param {AudioNode} dest
+ * @param {{freq: number, to?: number, type?: OscillatorType, t0: number, dur: number,
+ *   peak?: number, attack?: number, vibrato?: {rate: number, depth: number}}} o
+ */
+function tone(ctx, dest, o) {
+	const { freq, to, type = 'sine', t0, dur, peak = 0.25, attack = 0.008, vibrato } = o;
+	const osc = ctx.createOscillator();
+	const gain = ctx.createGain();
+	osc.type = type;
+	osc.frequency.setValueAtTime(freq, t0);
+	if (to) osc.frequency.exponentialRampToValueAtTime(Math.max(20, to), t0 + dur);
+	if (vibrato) {
+		const lfo = ctx.createOscillator();
+		const depth = ctx.createGain();
+		lfo.frequency.value = vibrato.rate;
+		depth.gain.value = vibrato.depth;
+		lfo.connect(depth).connect(osc.frequency);
+		lfo.start(t0);
+		lfo.stop(t0 + dur + 0.05);
+	}
+	gain.gain.setValueAtTime(FLOOR, t0);
+	gain.gain.exponentialRampToValueAtTime(peak, t0 + attack);
+	gain.gain.exponentialRampToValueAtTime(FLOOR, t0 + dur);
+	osc.connect(gain).connect(dest);
+	osc.start(t0);
+	osc.stop(t0 + dur + 0.05);
+}
+
+/**
+ * A filtered noise burst, optionally sweeping its filter.
+ * @param {BaseAudioContext} ctx @param {AudioNode} dest
+ * @param {{t0: number, dur: number, peak?: number, attack?: number,
+ *   filter?: BiquadFilterType, freq?: number, to?: number, q?: number, flutter?: number}} o
+ */
+function noise(ctx, dest, o) {
+	const { t0, dur, peak = 0.3, attack = 0.005, filter = 'lowpass', freq = 2000, to, q = 0.8, flutter } = o;
+	const src = ctx.createBufferSource();
+	src.buffer = noiseBuffer(ctx);
+	src.loop = true;
+	const biquad = ctx.createBiquadFilter();
+	biquad.type = filter;
+	biquad.Q.value = q;
+	biquad.frequency.setValueAtTime(freq, t0);
+	if (to) biquad.frequency.exponentialRampToValueAtTime(Math.max(20, to), t0 + dur);
+	const gain = ctx.createGain();
+	gain.gain.setValueAtTime(FLOOR, t0);
+	gain.gain.exponentialRampToValueAtTime(peak, t0 + attack);
+	gain.gain.exponentialRampToValueAtTime(FLOOR, t0 + dur);
+	src.connect(biquad).connect(gain);
+	if (flutter) {
+		// a crowd is not one steady hiss: an amplitude wobble makes it read as voices
+		const wobble = ctx.createGain();
+		wobble.gain.value = 0.6;
+		const lfo = ctx.createOscillator();
+		const depth = ctx.createGain();
+		lfo.frequency.value = flutter;
+		depth.gain.value = 0.4;
+		lfo.connect(depth).connect(wobble.gain);
+		lfo.start(t0);
+		lfo.stop(t0 + dur + 0.05);
+		gain.connect(wobble).connect(dest);
+	} else gain.connect(dest);
+	src.start(t0, (t0 * 7.13) % 0.5);
+	src.stop(t0 + dur + 0.05);
+}
+
+/** equal-tempered frequency of a midi note @param {number} midi */
+const hz = (midi) => 440 * Math.pow(2, (midi - 69) / 12);
+
+/**
+ * Build one sound into `dest` starting at `t0`. Returns its length in seconds, or -1 for
+ * a name that is not in the set. Pure WebAudio graph building — the live player and the
+ * offline measurement share it, so what the suite measures is what a player hears.
+ * @param {BaseAudioContext} ctx @param {AudioNode} dest @param {string} name @param {number} t0
+ * @returns {number}
+ */
+export function buildGameSound(ctx, dest, name, t0) {
+	switch (name) {
+		case 'click':
+			tone(ctx, dest, { freq: 1900, type: 'square', t0, dur: 0.035, peak: 0.12, attack: 0.002 });
+			noise(ctx, dest, { t0, dur: 0.03, peak: 0.12, filter: 'highpass', freq: 3000 });
+			return 0.05;
+		case 'pop':
+			tone(ctx, dest, { freq: 380, to: 1100, t0, dur: 0.09, peak: 0.3, attack: 0.004 });
+			return 0.1;
+		case 'whoosh':
+			noise(ctx, dest, { t0, dur: 0.45, peak: 0.35, attack: 0.12, filter: 'bandpass', freq: 300, to: 2600, q: 1.4 });
+			return 0.5;
+		case 'success':
+			[72, 76, 79, 84].forEach((m, i) =>
+				tone(ctx, dest, { freq: hz(m), type: 'triangle', t0: t0 + i * 0.08, dur: i === 3 ? 0.5 : 0.18, peak: 0.28 })
+			);
+			return 0.8;
+		case 'fail':
+			tone(ctx, dest, { freq: 330, type: 'square', t0, dur: 0.22, peak: 0.12 });
+			tone(ctx, dest, { freq: 247, type: 'square', t0: t0 + 0.2, dur: 0.22, peak: 0.12 });
+			tone(ctx, dest, { freq: 196, to: 150, type: 'sawtooth', t0: t0 + 0.4, dur: 0.45, peak: 0.12 });
+			return 0.9;
+		case 'hit':
+			tone(ctx, dest, { freq: 160, to: 55, t0, dur: 0.18, peak: 0.5, attack: 0.002 });
+			noise(ctx, dest, { t0, dur: 0.12, peak: 0.4, freq: 1400, to: 300, attack: 0.002 });
+			return 0.22;
+		case 'kick':
+			tone(ctx, dest, { freq: 150, to: 42, t0, dur: 0.3, peak: 0.7, attack: 0.002 });
+			noise(ctx, dest, { t0, dur: 0.02, peak: 0.15, filter: 'highpass', freq: 2000, attack: 0.001 });
+			return 0.32;
+		case 'shoot':
+			tone(ctx, dest, { freq: 900, to: 140, type: 'square', t0, dur: 0.16, peak: 0.16, attack: 0.002 });
+			noise(ctx, dest, { t0, dur: 0.1, peak: 0.3, freq: 3000, to: 500, attack: 0.001 });
+			return 0.2;
+		case 'laser':
+			tone(ctx, dest, { freq: 1500, to: 280, type: 'sawtooth', t0, dur: 0.26, peak: 0.14, attack: 0.003 });
+			tone(ctx, dest, { freq: 3000, to: 560, type: 'sine', t0, dur: 0.2, peak: 0.08, attack: 0.003 });
+			return 0.3;
+		case 'explosion':
+			noise(ctx, dest, { t0, dur: 1.3, peak: 0.7, freq: 2200, to: 120, attack: 0.004, q: 0.5 });
+			tone(ctx, dest, { freq: 90, to: 28, t0, dur: 0.9, peak: 0.6, attack: 0.004 });
+			return 1.35;
+		case 'coin':
+			tone(ctx, dest, { freq: hz(83), type: 'square', t0, dur: 0.08, peak: 0.13, attack: 0.002 });
+			tone(ctx, dest, { freq: hz(88), type: 'square', t0: t0 + 0.07, dur: 0.35, peak: 0.13, attack: 0.002 });
+			return 0.45;
+		case 'levelup':
+			[60, 64, 67, 72, 76, 79, 84, 88].forEach((m, i) =>
+				tone(ctx, dest, { freq: hz(m), type: 'triangle', t0: t0 + i * 0.055, dur: i === 7 ? 0.6 : 0.12, peak: 0.24 })
+			);
+			return 1.05;
+		case 'goal':
+			// a bright major stab that swells, with a rising run on top — a stadium moment
+			[60, 64, 67, 72].forEach((m) =>
+				tone(ctx, dest, { freq: hz(m), type: 'sawtooth', t0, dur: 1.1, peak: 0.07, attack: 0.05 })
+			);
+			[79, 84, 88, 91].forEach((m, i) =>
+				tone(ctx, dest, { freq: hz(m), type: 'triangle', t0: t0 + 0.05 + i * 0.07, dur: 0.4, peak: 0.16 })
+			);
+			noise(ctx, dest, { t0: t0 + 0.1, dur: 1.4, peak: 0.12, attack: 0.3, filter: 'bandpass', freq: 1600, q: 0.7, flutter: 9 });
+			return 1.5;
+		case 'whistle':
+			// a referee's pea whistle: a high tone with a fast trill
+			tone(ctx, dest, { freq: 2900, type: 'sine', t0, dur: 0.55, peak: 0.2, attack: 0.02, vibrato: { rate: 32, depth: 160 } });
+			return 0.6;
+		case 'cheer':
+			noise(ctx, dest, { t0, dur: 1.8, peak: 0.3, attack: 0.35, filter: 'bandpass', freq: 1200, to: 1700, q: 0.6, flutter: 7 });
+			noise(ctx, dest, { t0: t0 + 0.1, dur: 1.6, peak: 0.14, attack: 0.4, filter: 'bandpass', freq: 2600, q: 1.2, flutter: 11 });
+			return 1.9;
+		case 'step':
+			noise(ctx, dest, { t0, dur: 0.08, peak: 0.3, freq: 500, to: 180, attack: 0.002 });
+			return 0.1;
+		case 'ring':
+			tone(ctx, dest, { freq: 1320, t0, dur: 1.0, peak: 0.2, attack: 0.003 });
+			tone(ctx, dest, { freq: 1320 * 2.76, t0, dur: 0.5, peak: 0.07, attack: 0.003 });
+			tone(ctx, dest, { freq: 1320 * 5.4, t0, dur: 0.25, peak: 0.04, attack: 0.003 });
+			return 1.05;
+		case 'sparkle': {
+			// seven high pings on a fixed pattern (deterministic — no Math.random)
+			const notes = [96, 100, 103, 98, 105, 101, 108];
+			notes.forEach((m, i) => tone(ctx, dest, { freq: hz(m), t0: t0 + i * 0.045, dur: 0.22, peak: 0.1, attack: 0.002 }));
+			return 0.55;
+		}
+		case 'hurt':
+			tone(ctx, dest, { freq: 320, to: 110, type: 'sawtooth', t0, dur: 0.32, peak: 0.2, attack: 0.004 });
+			noise(ctx, dest, { t0, dur: 0.15, peak: 0.2, freq: 900, attack: 0.002 });
+			return 0.36;
+		case 'portal':
+			tone(ctx, dest, { freq: 180, to: 1300, t0, dur: 0.9, peak: 0.18, attack: 0.3, vibrato: { rate: 9, depth: 40 } });
+			tone(ctx, dest, { freq: 270, to: 1950, type: 'triangle', t0: t0 + 0.05, dur: 0.85, peak: 0.08, attack: 0.3 });
+			noise(ctx, dest, { t0, dur: 0.9, peak: 0.08, attack: 0.4, filter: 'bandpass', freq: 800, to: 4000, q: 2 });
+			return 0.95;
+		default:
+			return -1;
+	}
+}
+
+/* ------------------------------------------------------------------ the player --- */
+
+/** end times (context seconds) of the sounds still ringing @type {number[]} */
+const live = [];
+const debug = { played: 0, dropped: 0, unknown: 0, last: '' };
+
+/**
+ * Play a game sound, LOCAL to this device. Returns true when a sound started; false for
+ * an unknown name, a missing audio context, or the voice cap.
+ * @param {string} name @param {number[] | null} [position] world-space, spatialised
+ * @returns {boolean}
+ */
+export function playGameSound(name, position = null) {
+	if (!isGameSound(name)) {
+		debug.unknown++;
+		return false;
+	}
+	/** @type {AudioContext} */
+	let ctx;
+	try {
+		ctx = ensureAudioContext();
+	} catch {
+		return false;
+	}
+	if (ctx.state === 'suspended') ctx.resume().catch(() => {});
+	const now = ctx.currentTime;
+	while (live.length && live[0] <= now) live.shift();
+	if (live.length >= MAX_LIVE) {
+		debug.dropped++;
+		return false;
+	}
+	/** @type {AudioNode} */
+	let dest = gameOut();
+	if (Array.isArray(position) && position.length >= 3 && position.every((n) => Number.isFinite(n))) {
+		const panner = ctx.createPanner();
+		panner.panningModel = 'HRTF';
+		panner.distanceModel = 'inverse';
+		panner.refDistance = 2;
+		if (panner.positionX) {
+			panner.positionX.value = position[0];
+			panner.positionY.value = position[1];
+			panner.positionZ.value = position[2];
+		} else panner.setPosition(position[0], position[1], position[2]);
+		panner.connect(dest);
+		dest = panner;
+	}
+	const length = buildGameSound(ctx, dest, name, now + 0.005);
+	live.push(now + length);
+	live.sort((a, b) => a - b);
+	debug.played++;
+	debug.last = name;
+	return true;
+}
+
+/**
+ * Render one sound OFFLINE and measure it (the suite's "does every name make a sound").
+ * @param {string} name @param {number} [sampleRate]
+ * @returns {Promise<{name: string, seconds: number, rms: number, peak: number} | null>}
+ */
+export async function renderGameSound(name, sampleRate = 22050) {
+	const Offline = typeof window !== 'undefined' ? /** @type {any} */ (window).OfflineAudioContext : null;
+	if (!Offline) return null;
+	const probe = new Offline(1, 64, sampleRate);
+	const seconds = buildGameSound(probe, probe.destination, name, 0);
+	if (seconds < 0) return { name, seconds: -1, rms: 0, peak: 0 };
+	const ctx = new Offline(1, Math.ceil((seconds + 0.1) * sampleRate), sampleRate);
+	buildGameSound(ctx, ctx.destination, name, 0);
+	const buffer = await ctx.startRendering();
+	const data = buffer.getChannelData(0);
+	let sum = 0;
+	let peak = 0;
+	for (let i = 0; i < data.length; i++) {
+		sum += data[i] * data[i];
+		peak = Math.max(peak, Math.abs(data[i]));
+	}
+	return { name, seconds, rms: Math.sqrt(sum / data.length), peak };
+}
+
+/** the live gain's value (null before the first sound) — the volume's measurable end */
+export function gameSoundGainValue() {
+	return gameGain ? gameGain.gain.value : null;
+}
+
+/** counts for the suites @returns {{played: number, dropped: number, unknown: number, last: string, live: number}} */
+export function gameSfxDebug() {
+	return { ...debug, live: live.length };
+}
+
+// the two building blocks, shared with the music scheduler (gameMusic.js) so a game's
+// music and its effects are made of the same parts
+export { tone as sfxTone, noise as sfxNoise };
diff --git a/src/lib/gameStorage.js b/src/lib/gameStorage.js
new file mode 100644
index 00000000..e68d6544
--- /dev/null
+++ b/src/lib/gameStorage.js
@@ -0,0 +1,197 @@
+// 30 P4 — WHAT A GAME REMEMBERS ON THIS DEVICE (roadmap 30 fork 7).
+//
+// Two consumers, one rule: a module's `api.storage` and the Store Value / Stored Value flow
+// nodes. Both are LOCAL per device by design — a best score, unlocked levels, a "seen the
+// tutorial" flag — so nothing here replicates, nothing enters a scene file and nothing is
+// undone. A peer's best is theirs; the card says so ("Saved on this device only").
+//
+// THE KEYS ARE A CONTRACT, byte for byte, because a module that must run on an older core
+// (untangle's fallback for a 1.16 client) writes the SAME key itself so its data survives
+// the upgrade:
+//
+//     tp:mod:<moduleId>:<key>          a module's own namespace (api.storage)
+//     tp:scene:<scene name>:<key>      a flow graph's namespace, per scene ('untitled'
+//                                      when the scene has no name)
+//
+// VALUES ARE JSON. `set(key, value)` stores `JSON.stringify(value)`; `get` parses it back
+// and hands the fallback over on a missing key OR a value that does not parse (a hand-edited
+// entry, a truncated write), because a broken save must never crash a game's boot.
+//
+// THE CAP is per MODULE (256 KB), measured as the JSON text of every entry in the namespace
+// plus its key — what the browser actually spends. A write that would cross it returns
+// false and nothing is written; the caller hears it once per session through `onOverCap`
+// (moduleSDK turns that into ONE toast), never once per frame.
+//
+// A DELIBERATE LEAF: it imports safeStorage (itself a leaf) and nothing else, so moduleSDK,
+// flowRuntime and a unit test can all reach it. safeStorage is what makes the promise
+// honest: in Safari private mode, a sandboxed frame or a full quota the write falls back to
+// memory for the session instead of throwing.
+
+import { safeStorage } from './safeStorage';
+
+/** bytes (UTF-16 code units, i.e. JSON text length) one module may keep */
+export const MODULE_STORAGE_CAP = 256 * 1024;
+
+/** @param {string} moduleId */
+export function modulePrefix(moduleId) {
+	return 'tp:mod:' + String(moduleId) + ':';
+}
+
+/** @param {string|null|undefined} sceneName */
+export function scenePrefix(sceneName) {
+	const name = typeof sceneName === 'string' && sceneName.trim() ? sceneName.trim() : 'untitled';
+	return 'tp:scene:' + name + ':';
+}
+
+/** The full key a module writes. @param {string} moduleId @param {string} key */
+export function moduleStorageKey(moduleId, key) {
+	return modulePrefix(moduleId) + String(key);
+}
+
+/** The full key a Store Value node writes. @param {string|null|undefined} sceneName @param {string} key */
+export function sceneStorageKey(sceneName, key) {
+	return scenePrefix(sceneName) + String(key);
+}
+
+/** Parsed-value cache keyed by the FULL key. Every write through this module keeps it
+ * current, so a Stored Value node read every frame costs a Map lookup, not a
+ * localStorage read and a JSON.parse. @type {Map<string, {text: string|null, value: any}>} */
+const cache = new Map();
+
+/** @param {string} full @returns {{text: string|null, value: any}} */
+function read(full) {
+	const hit = cache.get(full);
+	if (hit) return hit;
+	const text = safeStorage.getItem(full);
+	/** @type {any} */
+	let value;
+	let ok = text !== null;
+	if (ok) {
+		try {
+			value = JSON.parse(/** @type {string} */ (text));
+		} catch {
+			ok = false;
+		}
+	}
+	const entry = { text: ok ? text : null, value: ok ? value : undefined };
+	cache.set(full, entry);
+	return entry;
+}
+
+/** Read a full key: the parsed value, or `fallback` when it is missing or unreadable.
+ * @param {string} full @param {any} [fallback] */
+export function readStored(full, fallback = undefined) {
+	const entry = read(full);
+	return entry.text === null ? fallback : entry.value;
+}
+
+/** Does a full key hold a readable value? @param {string} full */
+export function hasStored(full) {
+	return read(full).text !== null;
+}
+
+/** Write a full key (JSON). `undefined` removes it. Returns the JSON text written, or
+ * null when the value cannot be serialized (a cycle, a BigInt).
+ * @param {string} full @param {any} value @returns {string|null} */
+export function writeStored(full, value) {
+	if (value === undefined) {
+		removeStored(full);
+		return '';
+	}
+	/** @type {string} */
+	let text;
+	try {
+		const out = JSON.stringify(value);
+		if (typeof out !== 'string') return null; // a function, a symbol
+		text = out;
+	} catch {
+		return null;
+	}
+	safeStorage.setItem(full, text);
+	cache.set(full, { text, value: JSON.parse(text) });
+	return text;
+}
+
+/** @param {string} full */
+export function removeStored(full) {
+	safeStorage.removeItem(full);
+	cache.delete(full);
+}
+
+/** Every full key under a prefix. @param {string} prefix @returns {string[]} */
+function fullKeysUnder(prefix) {
+	return safeStorage.keys().filter((key) => key.startsWith(prefix));
+}
+
+/** The JSON bytes a namespace holds, optionally pretending one key held `replace` instead.
+ * @param {string} prefix @param {string} [except] a full key to leave out */
+function usedBytes(prefix, except) {
+	let total = 0;
+	for (const full of fullKeysUnder(prefix)) {
+		if (full === except) continue;
+		const text = safeStorage.getItem(full);
+		if (text !== null) total += full.length + text.length;
+	}
+	return total;
+}
+
+/**
+ * The `api.storage` object for one module.
+ * @param {string} moduleId
+ * @param {{cap?: number, onOverCap?: (info: {key: string, bytes: number, cap: number}) => void}} [options]
+ */
+export function makeModuleStorage(moduleId, options = {}) {
+	const prefix = modulePrefix(moduleId);
+	const cap = options.cap ?? MODULE_STORAGE_CAP;
+	return {
+		/** @param {string} key @param {any} [fallback] */
+		get(key, fallback = undefined) {
+			return readStored(prefix + String(key), fallback);
+		},
+		/** @param {string} key @param {any} value @returns {boolean} written */
+		set(key, value) {
+			const full = prefix + String(key);
+			if (value === undefined) {
+				removeStored(full);
+				return true;
+			}
+			/** @type {string|undefined} */
+			let text;
+			try {
+				text = JSON.stringify(value);
+			} catch {
+				return false;
+			}
+			if (typeof text !== 'string') return false;
+			const bytes = usedBytes(prefix, full) + full.length + text.length;
+			if (bytes > cap) {
+				options.onOverCap?.({ key: String(key), bytes, cap });
+				return false;
+			}
+			return writeStored(full, value) !== null;
+		},
+		/** @param {string} key */
+		remove(key) {
+			removeStored(prefix + String(key));
+		},
+		/** this module's keys, without the prefix, sorted @returns {string[]} */
+		keys() {
+			return fullKeysUnder(prefix)
+				.map((full) => full.slice(prefix.length))
+				.sort();
+		},
+		/** forget everything this module stored — the module's own reset */
+		clear() {
+			for (const full of fullKeysUnder(prefix)) removeStored(full);
+		},
+		/** how much of the cap is spent (JSON text of every entry + its key) */
+		bytes() {
+			return usedBytes(prefix);
+		}
+	};
+}
+
+/** TEST SEAM: forget the parsed-value cache (a suite that writes localStorage directly). */
+export function debugResetGameStorage() {
+	cache.clear();
+}
diff --git a/src/lib/hapticPatterns.js b/src/lib/hapticPatterns.js
new file mode 100644
index 00000000..f39b99e8
--- /dev/null
+++ b/src/lib/hapticPatterns.js
@@ -0,0 +1,78 @@
+// 30b (vr-play) C4 — HAPTIC PATTERNS as data. `api.hapticPattern(name, hand)` plays one
+// of these on the Quest's controller actuators; core fires the defaults in Interact/Play
+// (hover-enter `tap`, a press `bump`, a grab `hit`, a knock scaled by its impulse).
+//
+// A pattern is a list of PULSES, each `{at, intensity, ms}` with `at` in milliseconds
+// from the start. A GamepadHapticActuator plays one pulse at a time and a new pulse
+// REPLACES the one running, so a pattern is timed pulses, never overlapping ones — the
+// schedule below is what vrControls plays through setTimeout.
+//
+// Imports NOTHING: the shapes are tested with no browser and no headset. How they FEEL is
+// the on-device check (owed) — the numbers are a first pass at "make it cool".
+
+/** @typedef {{at: number, intensity: number, ms: number}} HapticPulse */
+
+/** @type {Record<string, HapticPulse[]>} */
+export const HAPTIC_PATTERNS = {
+	// a fingertip on a button: the lightest thing that is still felt
+	tap: [{ at: 0, intensity: 0.18, ms: 12 }],
+	// a press landing: short and firm
+	bump: [{ at: 0, intensity: 0.45, ms: 28 }],
+	// a grab or a solid contact: a hard edge, then a short settle
+	hit: [
+		{ at: 0, intensity: 0.85, ms: 35 },
+		{ at: 55, intensity: 0.3, ms: 25 }
+	],
+	// a win: three rising pulses
+	success: [
+		{ at: 0, intensity: 0.3, ms: 40 },
+		{ at: 90, intensity: 0.5, ms: 40 },
+		{ at: 180, intensity: 0.8, ms: 70 }
+	],
+	// a miss: two heavy, flat pulses
+	fail: [
+		{ at: 0, intensity: 0.7, ms: 90 },
+		{ at: 160, intensity: 0.7, ms: 140 }
+	],
+	// an engine / an explosion: a long grinding buzz, fading
+	rumble: [
+		{ at: 0, intensity: 1, ms: 120 },
+		{ at: 120, intensity: 0.75, ms: 120 },
+		{ at: 240, intensity: 0.5, ms: 120 },
+		{ at: 360, intensity: 0.28, ms: 140 }
+	],
+	// lub-dub
+	heartbeat: [
+		{ at: 0, intensity: 0.65, ms: 45 },
+		{ at: 150, intensity: 0.4, ms: 55 }
+	]
+};
+
+/** the names `api.hapticPattern` accepts */
+export const HAPTIC_PATTERN_NAMES = Object.keys(HAPTIC_PATTERNS);
+
+/**
+ * A pattern's pulses, clamped to what an actuator takes (0..1, 1..1000 ms). Unknown -> [].
+ * `scale` multiplies every intensity — how a knock's impulse sizes a `hit`.
+ * @param {string} name @param {number} [scale] @returns {HapticPulse[]}
+ */
+export function hapticSchedule(name, scale = 1) {
+	const pattern = HAPTIC_PATTERNS[String(name)];
+	if (!pattern) return [];
+	const k = Number.isFinite(scale) ? Math.max(0, scale) : 1;
+	return pattern.map((p) => ({
+		at: Math.max(0, p.at),
+		intensity: Math.min(1, Math.max(0, p.intensity * k)),
+		ms: Math.min(1000, Math.max(1, p.ms))
+	}));
+}
+
+/**
+ * The strength a KNOCK buzzes with: a light brush is a tap, a real swing a full hit.
+ * `speed` is the closing speed in m/s (knockMath's `approach`).
+ * @param {number} speed @returns {number} 0.2..1
+ */
+export function knockHapticScale(speed) {
+	const s = Number.isFinite(speed) ? Math.max(0, speed) : 0;
+	return Math.min(1, 0.2 + s / 6);
+}
diff --git a/src/lib/helperLayer.js b/src/lib/helperLayer.js
index 1a5c55d2..3123ab54 100644
--- a/src/lib/helperLayer.js
+++ b/src/lib/helperLayer.js
@@ -1,6 +1,6 @@
 // 24-E2: THE HELPER LAYER — "the editor sees it, the game does not". Light helpers and
 // their pick proxies, camera frustums and (while hidden) camera MARKERS live on render
-// layer 1; the editor camera enables it outside Play (and in Play with the debug
+// layer HELPER_LAYER (30, see below); the editor camera enables it outside Play (and in Play with the debug
 // toggle), and every camera that renders FOR someone — the play camera, a camera-object
 // preview, PiP, thumbnails, captureThroughCamera — is a fresh THREE camera on layer 0
 // only, so it never sees them.
@@ -20,12 +20,26 @@
 //  Bits are flipped with enable/disable, never `set`: the outline passes mark a
 //  selected object with a layer bit of their own, and `set` would wipe it.
 //
+//
+// 30b P0 — THE LAYER NUMBER IS NOT FREE. three's WebXRManager renders each eye through
+// its own sub-camera and RESERVES layers 1 and 2 for them: every frame it writes
+// `cameraL.mask = (camera.mask | 0b110) & ~0b100` and `cameraR.mask = (camera.mask |
+// 0b110) & ~0b010` (WebXRManager.updateCamera, "1 = left, 2 = right"). So on layer 1 a
+// helper was ALWAYS drawn by the left eye — whatever the editor camera enabled — and never
+// by the right one: the light-source helper a Quest user saw "with one eye" in Towers,
+// Stars Room and Football. Any number the XR eye cameras only ever INHERIT (3..30; 31 is
+// overloadGuard's REDUCED_LAYER, and postprocessing's Selection ids count up from 2) is
+// correct; 30 keeps well clear of both.
+//
+// 30b P0/P1 — Interact hides helpers too: Edit is the only mode that draws the editor's
+// scaffolding, in both eyes; Interact (desktop or VR) and Play draw none of it.
+//
 // Imports sceneStore only (the lightHelpers/cameraHelpers family), no THREE.
-import { get, writable } from 'svelte/store';
-import { isLocked, editorCam, globalCamera, objectsGroup } from '../stores/sceneStore';
+import { derived, get, writable } from 'svelte/store';
+import { isLocked, editorCam, globalCamera, objectsGroup, editorMode } from '../stores/sceneStore';
 import { safeStorage } from './safeStorage';
 
-export const HELPER_LAYER = 1;
+export const HELPER_LAYER = 30;
 
 /** "Show helpers in Play (debug)" — LOCAL pref, default off. While on, helpers render
  * in Play and a DEBUG chip sits in the play HUD so a screenshot cannot be mistaken for
@@ -54,11 +68,25 @@ export function applyHelperLayer(camera, on) {
 	else camera.layers.disable(HELPER_LAYER);
 }
 
-/** Should helpers be hidden right now (Play without the debug toggle)? */
+/** 30b P1: the ONE predicate every editor helper answers to — Play (`isLocked === true`)
+ * or Interact hides them, unless the "Show helpers in Play (debug)" toggle keeps them.
+ * Pure so a suite can pin the table. @param {any} locked @param {any} mode @param {boolean} debug */
+export function helpersHiddenFor(locked, mode, debug) {
+	return (locked === true || mode === 'interact') && !debug;
+}
+
+/** Should helpers be hidden right now (Play or Interact, without the debug toggle)? */
 export function helpersHidden() {
-	return !!get(isLocked) && !get(helpersInPlay);
+	return helpersHiddenFor(get(isLocked), get(editorMode), get(helpersInPlay));
 }
 
+/** 30b P1: the same answer as a store, for components (the grid, the VR selection shell)
+ * and for anything that toggles `visible` per frame. */
+export const editorHelpersShown = derived(
+	[isLocked, editorMode, helpersInPlay],
+	([$locked, $mode, $debug]) => !helpersHiddenFor($locked, $mode, $debug)
+);
+
 /** the marker-hop state the last `setMarkersHidden` applied (reads for the test seam) */
 let markersHidden = false;
 export function markersAreHidden() {
@@ -119,5 +147,6 @@ export function startHelperLayer() {
 	started = true;
 	editorCam.subscribe(applyToEditorCamera);
 	isLocked.subscribe(applyToEditorCamera);
+	editorMode.subscribe(applyToEditorCamera);
 	helpersInPlay.subscribe(applyToEditorCamera);
 }
diff --git a/src/lib/history.js b/src/lib/history.js
index 6f0d3734..26e57bd4 100644
--- a/src/lib/history.js
+++ b/src/lib/history.js
@@ -185,6 +185,24 @@ export function recordTransformSet(items) {
 
 // --- create/delete: object presence, restored from a serialized snapshot ---
 
+/** @type {((object: any) => any) | null} */
+let referenceSnapshot = null;
+
+/**
+ * 30b integrate: content that can be REBUILT from where it came from is kept in history as
+ * that reference, not as its serialized bytes. A kit piece placed from a pack is ~0.8 MB of
+ * GLB and ~7.9 MB as toJSON (its textures come back as PNG data URLs), so every placement
+ * toasted "too large for undo history" and level building with the kits had no undo. The
+ * provider returns a toJSON element (packRefs' stub) or null for "not a reference"; the
+ * restore needs nothing new, because a stub added back to the scene is refilled by the
+ * same scan that refills a loaded file's or a peer's. Registered, never imported: packRefs
+ * reaches the Explorer, and nothing in history's import subtree may grow that edge.
+ * @param {((object: any) => any) | null} fn
+ */
+export function registerReferenceSnapshot(fn) {
+	referenceSnapshot = fn;
+}
+
 /**
  * Serialize an object (ObjectLoader JSON round-trip, same format the
  * `object` peer message uses for lights/parents) for create/delete entries.
@@ -199,7 +217,8 @@ export function captureObjectSnapshot(object, quiet = false) {
 	// re-broadcast hands one to every peer (editOverlays.js)
 	const unpark = parkEditOverlays(object);
 	try {
-		const element = object.toJSON();
+		const reference = referenceSnapshot ? referenceSnapshot(object) : null;
+		const element = reference ?? object.toJSON();
 		if (JSON.stringify(element).length > SNAPSHOT_LIMIT) {
 			if (!quiet) showToast('Object is too large for undo history — this step will not be undoable');
 			return null;
diff --git a/src/lib/hudActions.js b/src/lib/hudActions.js
index 5579f1c1..efb51344 100644
--- a/src/lib/hudActions.js
+++ b/src/lib/hudActions.js
@@ -115,6 +115,10 @@ export const HUD_ACTIONS = [
 	// entry calls, so the two ways a game is reset are one function.
 	{ key: 'resetgame', label: 'Reset the game', group: 'Game', role: 'press', node: 'setgamestate', data: { state: 'menu', reset: true }, handle: 'trigger', hint: 'Back to the menu AND the round clock to zero — collectibles read un-collected again.' },
 	{ key: 'setvar', label: 'Set a variable', group: 'Game', role: 'press', node: 'setvariable', data: { name: 'score', op: 'add', value: 1 }, handle: 'trigger', hint: 'Add to, subtract from or set a shared number.' },
+	// 30 P4: keep the best on THIS device. The value is fed from the `score` variable by a
+	// `via` source (additive to the press role: absent everywhere else, so every other
+	// press action builds exactly what it built before).
+	{ key: 'savebest', label: 'Save best score', group: 'Game', role: 'press', node: 'storevalue', data: { key: 'best', mode: 'max' }, handle: 'trigger', via: { node: 'getvariable', data: { name: 'score' }, handle: 'value' }, hint: 'Keeps the highest “score” seen on this device (Store Value, max) — each player keeps their own.' },
 	// 21-F4: LEVEL COMPLETE — travel to a level. The destination is the AUTHOR'S PICK
 	// on the Travel card, deliberately not a "next by folder order": the Explorer
 	// library is LOCAL, so two peers can hold different orders and a computed "next"
@@ -309,6 +313,10 @@ export function describeNode(node, handle = null) {
 			return 'Only once';
 		case 'getvariable':
 			return 'Variable “' + (d.name ?? '') + '”';
+		case 'storevalue':
+			return 'Save “' + (d.key ?? '') + '” on this device (' + (d.mode ?? 'set') + ')';
+		case 'storedvalue':
+			return 'Saved “' + (d.key ?? '') + '” (this device)';
 		case 'gametime':
 			return 'Round time (' + (d.read ?? 'elapsed') + ')';
 		case 'hudtext':
@@ -521,6 +529,13 @@ export function addBinding(elementId, actionKey) {
 			const actionNode = makeNode(action.node, baseX + 220, baseY, action.data);
 			created.push(actionNode);
 			createdEdges.push(makeEdge(press, actionNode, action.handle));
+			// 30 P4: a press action may name the VALUE it acts on too (Save best score reads
+			// the score) — the drives role's `via`, one socket over
+			if (action.via) {
+				const source = makeNode(action.via.node, baseX, baseY + 120, action.via.data);
+				created.push(source);
+				createdEdges.push(makeEdge(source, actionNode, action.via.handle));
+			}
 		}
 	} else {
 		const displayType = /** @type {any} */ (DISPLAY_NODE)[String(action.role === 'drives' ? currentKindOf(elementId) : '')] ?? 'hudtext';
diff --git a/src/lib/hudDocs.js b/src/lib/hudDocs.js
index 8b38b473..81c83f03 100644
--- a/src/lib/hudDocs.js
+++ b/src/lib/hudDocs.js
@@ -21,7 +21,7 @@
 // computes the same string with no message of its own. Screen visibility is per-peer ON
 // PURPOSE — one player on the start menu while another plays.
 
-import { writable, get } from 'svelte/store';
+import { writable, derived, get } from 'svelte/store';
 import { sessionNow } from './sessionClock'; // 25-E: stamps another peer compares
 // 21-D1: the kind REGISTRY. hudKinds imports nothing, so this stays a leaf.
 import { HUD_KINDS as REGISTERED_KINDS, defaultsForKind, styleDefaultsForKind, kindDef } from './hudKinds';
@@ -75,6 +75,28 @@ export const activeHudDoc = writable(null);
  * @type {import('svelte/store').Writable<Record<string, string|null>>} */
 export const hudScreenOverride = writable({});
 
+/**
+ * 30 P1: IS THIS SCENE A GAME? The rule, and why it is this one: a scene is a game when ANY
+ * of its HUD documents holds a screen bound to a game state (`showWhile` set). That binding
+ * is the one thing that makes the editor MASQUERADE as the running game — the shared state
+ * picks the screen, so a menu whose state is `menu` paints itself over the editor with
+ * nobody in Play. Every Games-tab template has one; a hand-made HUD with no state-bound
+ * screen is a plain overlay and keeps its old behaviour (drawn in the editor, buttons live).
+ * A `hudbutton -> setgamestate` wiring alone was considered and NOT taken: with no
+ * state-bound screen nothing masquerades, and reading the graph here would put a flow edge
+ * into a leaf that keeps none.
+ * @param {Record<string, any>} docs @returns {boolean}
+ */
+export function isGameHud(docs) {
+	for (const doc of Object.values(docs ?? {}))
+		for (const screen of Array.isArray(doc?.screens) ? doc.screens : [])
+			if (typeof screen?.showWhile === 'string' && screen.showWhile) return true;
+	return false;
+}
+
+/** 30 P1: the rule above as a store — HudLayer and the game chip both read it. */
+export const hudIsGame = derived(hudDocs, (docs) => isGameHud(docs));
+
 /** The editor's current selection, per document key -> element ids. LOCAL.
  * @type {import('svelte/store').Writable<Record<string, string[]>>} */
 export const hudSelection = writable({});
diff --git a/src/lib/knock.js b/src/lib/knock.js
index 0775625a..9544f88b 100644
--- a/src/lib/knock.js
+++ b/src/lib/knock.js
@@ -1,6 +1,6 @@
 import * as THREE from 'three';
 import { writable, get } from 'svelte/store';
-import { isLocked, isVRMode, objectsGroup } from '../stores/sceneStore';
+import { isLocked, isVRMode, objectsGroup, editorMode } from '../stores/sceneStore';
 import { peers } from '../stores/appStore';
 import { sceneKnock } from './scenePhysics';
 import { sessionNow } from './sessionClock'; // 25-E: `at` crosses the wire, so it is SESSION time
@@ -141,7 +141,10 @@ function armed() {
 	const cfg = get(sceneKnock);
 	if (!cfg?.enabled) return false;
 	if (!get(simulating) && !get(remoteSimulating)) return false;
-	return get(isLocked) === true || get(isVRMode) === true;
+	// 30b P2: in VR only a PLAYER's hands knock — an Edit hand is placing things, and a
+	// knock would fling the object it is reaching for (contract C1: grips grab/knock in
+	// Interact/Play; Edit moves things as it always has)
+	return get(isLocked) === true || (get(isVRMode) === true && get(editorMode) === 'interact');
 }
 
 /** @param {number} now @param {any} group */
diff --git a/src/lib/locomotionPolicy.js b/src/lib/locomotionPolicy.js
new file mode 100644
index 00000000..e59afbd8
--- /dev/null
+++ b/src/lib/locomotionPolicy.js
@@ -0,0 +1,114 @@
+// 30b P3/P4: HOW A PLAYER MAY MOVE, and WHERE THEY START — a pure leaf (imports nothing),
+// so the rule table and the spawn maths are unit-tested with no headset.
+//
+// Contract C1: EDIT keeps the editor's movement (fly, teleport, the world gestures).
+// INTERACT and PLAY walk like a game — the stick walks, a capsule stops at walls, gravity
+// pulls you down, a ~0.3 m step is climbed, snap turn stays — and NEITHER fly NOR teleport
+// unless the scene's play block allows it (`play.locomotion: {teleport?, fly?}`, absent =
+// false). The Quest report this answers: "In [the dungeon] I can go through walls,
+// teleport, I want to be able to do this only in edit mode and fly only in edit mode."
+
+/**
+ * @param {'edit' | 'interact'} mode
+ * @param {{teleport?: boolean, fly?: boolean} | null | undefined} locomotion the resolved play block
+ * @returns {{walk: boolean, fly: boolean, teleport: boolean, collide: boolean, gravity: boolean, worldGestures: boolean}}
+ */
+export function locomotionPolicy(mode, locomotion) {
+	if (mode !== 'interact') {
+		// the editor: movement exactly as it has always been, walls included
+		return { walk: false, fly: true, teleport: true, collide: false, gravity: false, worldGestures: true };
+	}
+	const fly = locomotion?.fly === true;
+	return {
+		walk: true,
+		fly,
+		teleport: locomotion?.teleport === true,
+		collide: true,
+		gravity: !fly,
+		worldGestures: false
+	};
+}
+
+/**
+ * `play.locomotion` at a store boundary: only booleans survive, and an empty block is
+ * ABSENT (so a scene that never used it saves byte-identically).
+ * @param {any} raw @returns {{teleport?: boolean, fly?: boolean} | null}
+ */
+export function normalizeLocomotion(raw) {
+	if (!raw || typeof raw !== 'object') return null;
+	/** @type {{teleport?: boolean, fly?: boolean}} */
+	const out = {};
+	if (typeof raw.teleport === 'boolean') out.teleport = raw.teleport;
+	if (typeof raw.fly === 'boolean') out.fly = raw.fly;
+	return Object.keys(out).length ? out : null;
+}
+
+const SPAWN_LIMIT = 100000;
+
+/**
+ * A spawn point at a store/api boundary: `{position: [x, y, z], yaw}` with finite numbers
+ * (y is the FEET, yaw in radians, three's rotation.y: 0 faces -Z). Accepts the api's
+ * `(position, yaw)` pair too. Anything else is null.
+ * @param {any} raw @param {any} [yawArg]
+ * @returns {{position: [number, number, number], yaw: number} | null}
+ */
+export function normalizeSpawn(raw, yawArg) {
+	// 30c's first shape was `{pos, yaw}` (the level lane); read it too so a scene authored
+	// that way keeps its spawn
+	const position = Array.isArray(raw) ? raw : (raw?.position ?? raw?.pos);
+	if (!Array.isArray(position) || position.length < 3) return null;
+	const p = position.slice(0, 3).map(Number);
+	if (!p.every((v) => Number.isFinite(v) && Math.abs(v) <= SPAWN_LIMIT)) return null;
+	const yawRaw = Array.isArray(raw) ? yawArg : raw?.yaw;
+	const yaw = Number(yawRaw ?? 0);
+	return {
+		position: /** @type {[number, number, number]} */ (p),
+		yaw: Number.isFinite(yaw) ? yaw : 0,
+		// 30b (core-games): a VR-ONLY spawn — the headset stands on it, desktop Play and
+		// Interact keep their own camera (the Jam Room puts a VR player INSIDE the band, where
+		// a level desktop eye would see only the piano). Additive, kept only when true.
+		...(!Array.isArray(raw) && raw?.vrOnly === true ? { vrOnly: true } : {})
+	};
+}
+
+/** forward (the direction you face) for a yaw: (-sin yaw, 0, -cos yaw) @param {number} yaw */
+export function yawForward(yaw) {
+	return { x: -Math.sin(yaw), y: 0, z: -Math.cos(yaw) };
+}
+
+/**
+ * The yaw you face from a forward vector (the inverse of yawForward; y is ignored).
+ * @param {{x: number, z: number}} dir
+ */
+export function yawOf(dir) {
+	return Math.atan2(-dir.x, -dir.z);
+}
+
+/**
+ * THE VR SPAWN as two XR reference-space offsets (WebXR: a pose in the NEW space is
+ * `inverse(originOffset) * pose in the old one`, so an offset rotating by `a` turns the
+ * viewer by `-a`, and one translating by `t` moves the viewer by `-t`).
+ *   1. `turn`: rotate about the viewer's head so they face `yaw` (the snap-turn shape),
+ *   2. `move`: translate so the FEET land on the spawn point.
+ * @param {{x: number, y: number, z: number}} head the head in the current space
+ * @param {number} headYaw the yaw the head currently faces
+ * @param {number} headHeight the head's height above the physical floor
+ * @param {{position: number[], yaw: number}} spawn
+ */
+export function vrSpawnOffsets(head, headYaw, headHeight, spawn) {
+	const a = headYaw - spawn.yaw; // the viewer turns by -a = spawn.yaw - headYaw
+	const s = Math.sin(a);
+	const c = Math.cos(a);
+	const turn = {
+		angle: a,
+		position: { x: head.x - (c * head.x + s * head.z), y: 0, z: head.z - (-s * head.x + c * head.z) },
+		orientation: { x: 0, y: Math.sin(a / 2), z: 0, w: Math.cos(a / 2) }
+	};
+	const feet = head.y - headHeight;
+	const move = {
+		x: head.x - spawn.position[0],
+		y: feet - spawn.position[1],
+		z: head.z - spawn.position[2]
+	};
+	return { turn, move };
+}
diff --git a/src/lib/moduleContent.js b/src/lib/moduleContent.js
new file mode 100644
index 00000000..580d76e9
--- /dev/null
+++ b/src/lib/moduleContent.js
@@ -0,0 +1,222 @@
+// 30 P3: MODULE CONTENT in the object list — a LEAF (THREE + svelte/store + sceneStore +
+// helperLayer). moduleSDK writes the registry, the object list reads it, objectActions
+// clears the selection; none of them may import each other through here, which is why
+// it is its own file (moduleSDK primes objectActions DYNAMICALLY to dodge that cycle, and
+// a registry living in either one would close it).
+//
+// THE FINDING (roadmap 30, "Selection and the object list", cause 3): scene-root module
+// content — the dungeon, the untangle board, the piano, the sabers — lives outside
+// `objectsGroup` by golden rule 5, so it was never picked and never LISTED. Only the
+// advanced System filter polled `systemGroupNames`, and it named no module. Every module
+// group is listed now, READ-ONLY: the module owns it and regenerates it from its own
+// state, so a rename, a delete or a reparent here would be undone on the next rebuild
+// (or, worse, not undone and never replicated).
+//
+// Selecting one selects a PROXY, never the group: a scene-root box on the helper layer
+// sized to the group's bounds. It is not in objectsGroup, so it never replicates, never
+// saves and never enters the selection SET (applySelectionSet filters uuids it cannot
+// find there) — the selection outline, the gizmo and every "act on the selection"
+// command stay exactly what they were.
+import * as THREE from 'three';
+import { writable, get } from 'svelte/store';
+import { globalScene } from '../stores/sceneStore';
+import { markHelper } from './helperLayer';
+
+/** named children listed per group, and how deep */
+export const LIST_CAP = 200;
+export const LIST_DEPTH = 2;
+
+/**
+ * @typedef {{ name: string, moduleId: string, moduleName: string, label: string,
+ *   icon: string | null, kinds: Set<string> }} ModuleGroup
+ */
+
+/** @type {Map<string, ModuleGroup>} scene-root group name -> who registered it */
+const groups = new Map();
+
+/** bumps on every registry change so the list re-derives */
+export const moduleGroupsRevision = writable(0);
+
+/**
+ * Record a module's scene-root group. `kind` is which register* call named it
+ * ('interactive' | 'system' | 'listed'); the row lives while any kind still holds it.
+ * @param {string} name @param {{id: string, name?: string}} owner @param {string} kind
+ * @param {{label?: string, icon?: string}} [opts]
+ */
+export function noteModuleGroup(name, owner, kind, opts = {}) {
+	if (!name || !owner?.id) return;
+	const entry = groups.get(name) ?? {
+		name,
+		moduleId: owner.id,
+		moduleName: owner.name || owner.id,
+		label: '',
+		icon: null,
+		kinds: new Set()
+	};
+	entry.kinds.add(kind);
+	if (opts.label) entry.label = String(opts.label).slice(0, 80);
+	if (opts.icon) entry.icon = String(opts.icon);
+	groups.set(name, entry);
+	moduleGroupsRevision.update((n) => n + 1);
+}
+
+/** @param {string} name @param {string} kind */
+export function forgetModuleGroup(name, kind) {
+	const entry = groups.get(name);
+	if (!entry) return;
+	entry.kinds.delete(kind);
+	if (kind === 'listed') {
+		entry.label = '';
+		entry.icon = null;
+	}
+	if (!entry.kinds.size) groups.delete(name);
+	if (get(moduleSelection)?.name === name && !groups.has(name)) clearModuleSelection();
+	moduleGroupsRevision.update((n) => n + 1);
+}
+
+/** every registered module group, in a stable order (module, then name) */
+export function moduleGroupList() {
+	return [...groups.values()].sort(
+		(a, b) => a.moduleName.localeCompare(b.moduleName) || a.name.localeCompare(b.name)
+	);
+}
+
+/** @param {string} name */
+export function moduleGroupOf(name) {
+	return groups.get(name) ?? null;
+}
+
+/** A group name is an id ('untangle-module'); until the module names it with
+ * registerListedGroup, show it the way a person would write it ('Untangle module').
+ * @param {string} name */
+export function humanize(name) {
+	const words = String(name).replace(/[-_]+/g, ' ').trim();
+	return words ? words[0].toUpperCase() + words.slice(1) : String(name);
+}
+
+/**
+ * The rows the list draws: one per registered group PRESENT in the scene, with its named
+ * descendants down to LIST_DEPTH, capped at LIST_CAP (the rest counted, not dropped
+ * silently). A group a module registered but has not built yet is not listed — there is
+ * nothing to frame or select.
+ * @param {any} scene
+ */
+export function moduleContentRows(scene) {
+	if (!scene) return [];
+	/** @type {any[]} */
+	const rows = [];
+	for (const entry of moduleGroupList()) {
+		const root = scene.getObjectByName(entry.name);
+		// 30b P5: a registered group is re-homed under the world rig's module root
+		// (moduleWorld.js — named, not imported, because that leaf imports this one)
+		if (!root || (root.parent !== scene && root.parent?.name !== 'module-world-root')) continue;
+		/** @type {{name: string, depth: number, uuid: string}[]} */
+		const children = [];
+		let total = 0;
+		/** @param {any} node @param {number} depth */
+		const walk = (node, depth) => {
+			for (const child of node.children ?? []) {
+				if (child.userData?.isModuleProxy) continue;
+				if (child.name) {
+					total++;
+					if (children.length < LIST_CAP) children.push({ name: child.name, depth, uuid: child.uuid });
+				}
+				if (depth < LIST_DEPTH) walk(child, depth + 1);
+			}
+		};
+		walk(root, 1);
+		rows.push({
+			name: entry.name,
+			label: entry.label || humanize(entry.name),
+			moduleId: entry.moduleId,
+			moduleName: entry.moduleName,
+			icon: entry.icon,
+			object: root,
+			visible: root.visible !== false,
+			children,
+			more: Math.max(0, total - children.length)
+		});
+	}
+	return rows;
+}
+
+// --- the selection: a proxy, never the group ----------------------------------------
+
+/** @type {import('svelte/store').Writable<{name: string, moduleId: string, moduleName: string, label: string} | null>} */
+export const moduleSelection = writable(null);
+
+/** @type {any} */
+let proxy = null;
+const box = new THREE.Box3();
+let lastFit = 0;
+
+/** @param {any} root */
+function fitProxy(root) {
+	if (!proxy || !root) return false;
+	box.makeEmpty();
+	// bounds of the GROUP only — the proxy is a scene-root sibling, never inside it
+	box.setFromObject(root);
+	if (box.isEmpty()) {
+		const at = root.getWorldPosition(new THREE.Vector3());
+		box.setFromCenterAndSize(at, new THREE.Vector3(0.5, 0.5, 0.5));
+	}
+	proxy.box.copy(box);
+	proxy.updateMatrixWorld(true);
+	return true;
+}
+
+/**
+ * Select a module group: park the proxy around it and publish the selection. Returns the
+ * group's world bounds (the caller frames them), or null when the group is not in the scene.
+ * @param {string} name
+ */
+export function selectModuleGroup(name) {
+	const scene = /** @type {any} */ (get(globalScene));
+	const root = scene?.getObjectByName(name);
+	const entry = groups.get(name);
+	if (!root || !entry) return null;
+	if (!proxy) {
+		proxy = new THREE.Box3Helper(new THREE.Box3(), new THREE.Color(0xf59e0b));
+		proxy.name = 'module-content-proxy';
+		proxy.userData.isModuleProxy = true;
+		proxy.material.depthTest = false;
+		proxy.material.transparent = true;
+		proxy.renderOrder = 999;
+		markHelper(proxy);
+	}
+	if (proxy.parent !== scene) scene.add(proxy);
+	fitProxy(root);
+	moduleSelection.set({ name, moduleId: entry.moduleId, moduleName: entry.moduleName, label: entry.label || humanize(name) });
+	return box.clone();
+}
+
+export function clearModuleSelection() {
+	if (proxy?.parent) proxy.parent.remove(proxy);
+	if (get(moduleSelection)) moduleSelection.set(null);
+}
+
+/** Per frame (Scene's task): module content moves on its own, so the box follows it —
+ * at a few Hz, because setFromObject walks the whole group. */
+export function tickModuleProxy() {
+	const selection = get(moduleSelection);
+	if (!selection || !proxy?.parent) return;
+	const now = performance.now();
+	if (now - lastFit < 250) return;
+	lastFit = now;
+	const root = proxy.parent.getObjectByName(selection.name);
+	if (!root) {
+		clearModuleSelection();
+		return;
+	}
+	fitProxy(root);
+}
+
+/** test/debug view */
+export function moduleContentDebug() {
+	return {
+		groups: moduleGroupList().map((g) => ({ name: g.name, moduleId: g.moduleId, label: g.label, kinds: [...g.kinds] })),
+		selection: get(moduleSelection),
+		proxyInScene: !!proxy?.parent,
+		proxyBox: proxy?.parent ? { min: proxy.box.min.toArray(), max: proxy.box.max.toArray() } : null
+	};
+}
diff --git a/src/lib/moduleSDK.js b/src/lib/moduleSDK.js
index c81f3631..9eacc612 100644
--- a/src/lib/moduleSDK.js
+++ b/src/lib/moduleSDK.js
@@ -2,7 +2,10 @@ import { keyOf, letterOf } from './keyOf';
 import { sessionNow } from './sessionClock'; // 25-E: stamps another peer compares
 import * as THREE from 'three';
 import { writable, get } from 'svelte/store';
-import { globalScene, objectsGroup, selectedObject, selectedObjects, globalCamera, isVRMode, isLocked } from '../stores/sceneStore';
+import { globalScene, objectsGroup, selectedObject, selectedObjects, globalCamera, isVRMode, isLocked, playPointerFree, editorMode } from '../stores/sceneStore';
+// 30 P4: the scene's play block decides whether play aims with a crosshair (a leaf chain)
+// 30 integrate: the ONE answer to "is this a free-cursor game" (30-core-flow's leaf)
+import { playCursorSetting } from './playCursor';
 import { peers, showToast, modulesOpen, userdata } from '../stores/appStore';
 import { syncedAnimations, flowGraphs, flowValues, flowTriggers, allNodes, findNodeAnyGraph, SCENE_GRAPH } from '../stores/flowStore';
 import { customGeometryBuilders } from './customGeometries';
@@ -42,7 +45,26 @@ import { APP_VERSION } from './version.js';
 import { ndcFromClient } from './canvasRect';
 // 27-B: recovery paths report through the diagnostics ring (hardening audit H4)
 import { log } from './diagnostics';
+// 30 P3: the object list's Module content registry — a LEAF, so no cycle
+import { noteModuleGroup, forgetModuleGroup } from './moduleContent';
+export { moduleContentDebug } from './moduleContent';
 import { safeStorage } from './safeStorage';
+// 30 P4: api.storage — a LEAF (safeStorage only), shared with the Store Value flow node
+import { makeModuleStorage } from './gameStorage';
+// 30b (vr-play) C5: the game sound set and game music — LEAVES (svelte/store, audioEngine,
+// safeStorage, sessionClock, sceneStore), so static edges close no cycle
+import { isGameSound, playGameSound } from './gameSfx';
+import { playGameMusic, stopGameMusic, gameMusicState, MUSIC_PRESET_IDS } from './gameMusic';
+// 30b (vr-play): api.announce's banner store — a LEAF (svelte/store only)
+import { announce as announceBanner, clearAnnouncement } from './gameAnnounce';
+/** the ping chimes `api.playSound` still reaches (pingAudio's PING_SOUNDS ids) */
+const PING_NAMES = new Set(['ding', 'chime', 'pluck', 'bell']);
+import { runtimeSpawn, setRuntimeSpawn } from './playSettings'; // 30b P4 (a leaf)
+import { spawnDesktopPlayer, currentSpawn, desktopSpawn, spawnEyePose } from './playSpawn'; // 30b P4 (a leaf)
+
+/** modules already told they hit the storage cap this session (ONE toast each, never
+ * one per write — a game saving every frame would otherwise bury the screen) */
+const storageCapWarned = new Set();
 
 // Module SDK v1 — in-repo modules under src/modules/<name>/ register through
 // the api object passed to their register(api). See MODULES.md for the guide.
@@ -69,8 +91,76 @@ export const moduleMenuItems = writable([]);
 export const moduleEffects = {};
 /** @type {Record<string, any>} node type -> Svelte component */
 export const moduleNodeComponents = {};
-/** @type {((object: any) => boolean)[]} */
+/** 30b: a handler also gets `ctx = {source, mode}` (see runClickHandlers)
+ * @type {((object: any, ctx?: {source: string, mode: string}) => boolean)[]} */
 export const moduleClickHandlers = [];
+
+/** 30 P1: the three places a viewport click can come from. */
+export const CLICK_MODES = ['edit', 'interact', 'play'];
+/** What an SDK handler hears when it names no modes: Interact and Play, NOT Edit —
+ * the behaviour change the user asked for (a piano or a puzzle piece used to swallow
+ * every EDITOR click, so it could never be selected). */
+export const DEFAULT_CLICK_MODES = ['interact', 'play'];
+/** handler -> the modes it runs in. A handler with NO entry runs everywhere: that is a
+ * core handler pushed straight into the array (vrPatch's plug click — patching a cable
+ * is authoring, so it must keep working in Edit), never an SDK one.
+ * @type {WeakMap<Function, string[]>} */
+const clickHandlerModes = new WeakMap();
+
+/** Normalise a `{modes}` option: known names only, the default when nothing usable is
+ * left. @param {any} modes @returns {string[]} */
+export function normalizeClickModes(modes) {
+	const list = Array.isArray(modes) ? modes : typeof modes === 'string' ? [modes] : [];
+	const known = [...new Set(list.filter((mode) => CLICK_MODES.includes(mode)))];
+	return known.length ? known : [...DEFAULT_CLICK_MODES];
+}
+
+/** 30b (C3): handlers that asked NOT to be swept (`{sweep: false}`) — a knob you drag, a
+ * dot you carry. They still hear the press itself; only the later entries of a held
+ * trigger skip them. @type {WeakSet<Function>} */
+const noSweepHandlers = new WeakSet();
+
+/** Does this handler run for a click in `mode`? A null mode is VR's trigger, which has
+ * no editor mode of its own yet and keeps offering every handler, as it always has.
+ * @param {Function} fn @param {string | null} mode */
+export function clickHandlerRunsIn(fn, mode) {
+	if (!mode) return true;
+	const modes = clickHandlerModes.get(fn);
+	return !modes || modes.includes(mode);
+}
+
+/**
+ * Offer a clicked mesh to every handler that runs in `mode`, in registration order; the
+ * first to return true consumes the click. ONE dispatch for the editor's pick, Interact
+ * and Play's tap, so the three can never disagree about who hears what.
+ *
+ * 30b (C3): every handler also gets `ctx = {source, mode}` — `source` is 'click' (the
+ * desktop / a VR release), 'trigger' (the VR press itself, fired on the press) or 'sweep'
+ * (a later entry while the trigger is held). A 'sweep' skips handlers registered with
+ * `{sweep: false}`. Additive: a one-argument handler is byte-unchanged.
+ * @param {any} object @param {string | null} mode @param {{source?: string}} [ctx]
+ * @returns {boolean}
+ */
+export function runClickHandlers(object, mode, ctx = {}) {
+	const source = ctx?.source ?? 'click';
+	const info = { source, mode: mode ?? 'vr' };
+	for (const handler of [...moduleClickHandlers]) {
+		if (!clickHandlerRunsIn(handler, mode)) continue;
+		if (source === 'sweep' && noSweepHandlers.has(handler)) continue;
+		try {
+			if (handler(object, info)) return true;
+		} catch (error) {
+			log('warn', 'module', 'click handler failed', String(error));
+		}
+	}
+	return false;
+}
+
+/** The modes a handler was registered with (tests / the debug view).
+ * @param {Function} fn @returns {string[] | null} */
+export function clickHandlerModesOf(fn) {
+	return clickHandlerModes.get(fn) ?? null;
+}
 /** 23-B1: a viewport click that hit NOTHING. `moduleClickHandlers` is only ever handed a
  * MESH, so a gesture armed by a plug click had no way to hear "the user clicked the sky":
  * the wire stayed armed for the rest of the session and a picked-up cable stayed HIDDEN
@@ -111,6 +201,9 @@ const sceneClearHandlers = [];
 
 /** Called by the clear-scene path (local and remote) */
 export function runSceneClearHandlers() {
+	// 30b: a cleared scene takes its game's bursts and banner with it
+	effectsRef?.clearBursts?.();
+	clearAnnouncement();
 	sceneClearHandlers.forEach((fn) => {
 		try {
 			fn();
@@ -188,6 +281,8 @@ let nodeCatalogRef = null;
 let knockRef = null;
 /** @type {Promise<any>} */
 let knockReady = Promise.resolve(null);
+/** 30b: primed for api.effects (effectsBurst imports moduleFrameTasks from here) @type {any} */
+let effectsRef = null;
 if (typeof window !== 'undefined') {
 	knockReady = import('./knock').then((m) => (knockRef = m));
 	import('./inputRuntime').then((m) => (inputRuntimeRef = m));
@@ -208,6 +303,8 @@ if (typeof window !== 'undefined') {
 	import('./flowRuntime').then((m) => (flowRuntimeRef = m));
 	import('./flowGraphs').then((m) => (flowGraphsRef = m));
 	import('./nodeCatalog').then((m) => (nodeCatalogRef = m));
+	// 30b (C6): the burst pool reads moduleFrameTasks from here, so the edge back is dynamic
+	import('./effectsBurst').then((m) => (effectsRef = m));
 }
 
 // --- api.pointerRay (190): where the user is POINTING, as a world ray --------
@@ -228,11 +325,38 @@ if (typeof window !== 'undefined') {
 		pointerClient.seen = true;
 	});
 }
+/** 30 P4: the CROSSHAIR ray, a fresh Raycaster through the centre of the view */
+const SCREEN_CENTRE = new THREE.Vector2(0, 0);
+
+/**
+ * 30 P4: does play aim with a CROSSHAIR right now? Under a pointer lock the cursor is
+ * pinned and its last client position is where the mouse happened to be when the lock
+ * began — a STALE ray that never moves again (untangle's carried dot followed it, so a
+ * drag in play went nowhere). So while playing, the pointer locked, and not in the menu
+ * substate (the pointer is free there, over the HUD), the ray is the view's centre —
+ * play mode's own NDC (0,0), the one playInteract aims with.
+ */
+function crosshairAims() {
+	if (get(isLocked) !== true || get(playPointerFree)) return false;
+	if (typeof document === 'undefined' || !document.pointerLockElement) return false;
+	// 30-core-flow: free cursor — a scene whose play block says `cursor: 'free'` (or a
+	// module publishing it through userData.play) plays with the real cursor and no lock,
+	// so its ray IS the mouse ray. Asked through playCursor, the leaf playInteract, PLC and
+	// PlayReticle ask too, so the four cannot disagree about where the player aims.
+	return playCursorSetting() !== 'free';
+}
+
 function pointerRayNow() {
 	if (get(isVRMode)) return vrControlsRef?.pointerHandRay?.() ?? null;
 	/** @type {any} */
 	const camera = get(globalCamera);
-	if (!camera || !pointerClient.seen) return null;
+	if (!camera) return null;
+	if (crosshairAims()) {
+		const centre = new THREE.Raycaster();
+		centre.setFromCamera(SCREEN_CENTRE, camera);
+		return centre;
+	}
+	if (!pointerClient.seen) return null;
 	const fresh = new THREE.Raycaster();
 	const ndc = ndcFromClient(pointerClient.x, pointerClient.y);
 	fresh.setFromCamera(new THREE.Vector2(ndc.x, ndc.y), camera);
@@ -251,6 +375,30 @@ function physicsApi() {
 	return physicsRef;
 }
 
+/**
+ * 30b P4: move the player to the spawn in force — VR moves the rig (vrControls), desktop
+ * Play moves the play camera, desktop Interact the editor view. Edit is never moved.
+ * @returns {boolean}
+ */
+function respawnPlayerNow() {
+	const spawn = currentSpawn();
+	if (!spawn) return false;
+	if (get(isVRMode)) {
+		if (get(editorMode) !== 'interact') return false;
+		return !!vrControlsRef?.spawnPlayer?.();
+	}
+	// 30b (core-games): a VR-only spawn leaves the desktop view where it is
+	const desk = desktopSpawn();
+	if (!desk) return false;
+	if (get(isLocked) === true) return spawnDesktopPlayer(desk);
+	if (get(editorMode) === 'interact') {
+		const { eye, lookAt } = spawnEyePose(desk);
+		objectActionsRef?.flyTo?.(eye, lookAt);
+		return !!objectActionsRef;
+	}
+	return false;
+}
+
 /** @param {string} moduleId @param {string} [moduleName] the DISPLAY name, needed while
  * register() runs: loadedModules is not appended until it RETURNS, so anything reading the
  * name from there during registration gets the raw id (which is how a module HUD kind was
@@ -259,6 +407,8 @@ function makeApi(moduleId, moduleName = moduleId) {
 	const disposals = (moduleDisposals[moduleId] ??= []);
 	/** record an undo thunk deactivateModule runs at teardown (A2) @param {() => void} fn */
 	const onDispose = (fn) => disposals.push(fn);
+	/** 30b P4: setSpawn journals its clear once per module */
+	let spawnDisposeHooked = false;
 	/** A value frozen for the undo stack, so a module mutating its patch object later
 	 * cannot rewrite history. @param {any} v */
 	const frozen = (v) => {
@@ -463,9 +613,24 @@ function makeApi(moduleId, moduleName = moduleId) {
 		/**
 		 * Intercept viewport clicks (desktop click + VR trigger). Receives the
 		 * exact mesh hit; return true to consume the click (no selection).
-		 * @param {(object: any) => boolean} fn
+		 *
+		 * 30 P1: `{modes}` says WHERE it runs — any of 'edit' | 'interact' | 'play'.
+		 * Absent means ['interact', 'play']: a handler that is part of the GAME (a key,
+		 * a pad, a puzzle piece) no longer eats the editor's select click. A handler
+		 * that is an editor TOOL (a toolbox pick) passes {modes: ['edit']}, or all three.
+		 * In Edit an 'edit' handler still runs BEFORE the selection, so it can consume.
+		 *
+		 * 30b: `fn(object, ctx)` — `ctx.source` is 'click', 'trigger' (the VR press) or
+		 * 'sweep' (VR, Interact/Play: the trigger HELD and the controller tip or laser
+		 * passing into this mesh — each entry clicks once, re-armed when it leaves). Pass
+		 * `{sweep: false}` for a control that must not be swept (a knob you drag, a dot you
+		 * carry); it still hears the press.
+		 * @param {(object: any, ctx?: {source: string, mode: string}) => boolean} fn
+		 * @param {{modes?: string[], sweep?: boolean}} [options]
 		 */
-		registerClickHandler(fn) {
+		registerClickHandler(fn, options = {}) {
+			clickHandlerModes.set(fn, normalizeClickModes(options?.modes));
+			if (options?.sweep === false) noSweepHandlers.add(fn);
 			moduleClickHandlers.push(fn);
 			onDispose(() => arrayRemove(moduleClickHandlers, fn));
 		},
@@ -493,20 +658,37 @@ function makeApi(moduleId, moduleName = moduleId) {
 		registerInteractiveGroup(name) {
 			moduleInteractiveGroups.push(name);
 			registerSystemGroup(name); // clickable module content is also listable
+			noteModuleGroup(name, { id: moduleId, name: moduleName }, 'interactive'); // 30 P3
 			onDispose(() => {
 				arrayRemove(moduleInteractiveGroups, name);
 				arrayRemove(systemGroupNames, name);
+				forgetModuleGroup(name, 'interactive');
 				removeSceneRootGroup(name); // module-owned viewport content goes with the module
 			});
 		},
 		/** List a scene-root group under the object list's System filter @param {string} name */
 		registerSystemGroup(name) {
 			registerSystemGroup(name);
+			noteModuleGroup(name, { id: moduleId, name: moduleName }, 'system'); // 30 P3
 			onDispose(() => {
 				arrayRemove(systemGroupNames, name);
+				forgetModuleGroup(name, 'system');
 				removeSceneRootGroup(name);
 			});
 		},
+		/**
+		 * 30 P3: list a scene-root group in the object list's "Module content" section under
+		 * a label a person can read (the group's own name is usually an id). Groups passed to
+		 * registerInteractiveGroup / registerSystemGroup are listed anyway; this names them,
+		 * or lists one that is neither. Read-only there: a click selects a PROXY and frames
+		 * it, and the Inspector points at your module's toolbox and nodes.
+		 * @param {string} name the scene-root group's object name
+		 * @param {{label?: string, icon?: string}} [options]
+		 */
+		registerListedGroup(name, options = {}) {
+			noteModuleGroup(name, { id: moduleId, name: moduleName }, 'listed', options ?? {});
+			onDispose(() => forgetModuleGroup(name, 'listed'));
+		},
 		/**
 		 * Runs when the scene is cleared (locally or by a peer) — remove your
 		 * viewport content and reset module state here.
@@ -516,10 +698,55 @@ function makeApi(moduleId, moduleName = moduleId) {
 			sceneClearHandlers.push(fn);
 			onDispose(() => arrayRemove(sceneClearHandlers, fn));
 		},
+		/**
+		 * 30 integrate (modules DEVX #35): the editor's click mode on THIS screen —
+		 * 'edit' | 'interact'. LOCAL and read-only; `isPlaying()` says whether Play is on
+		 * top of it. A module whose own pointer listeners run outside core's click routing
+		 * (untangle's drag) stands down while this reads 'edit' and nothing is playing, so an
+		 * Edit click selects its content like any object.
+		 * @returns {'edit' | 'interact'}
+		 */
+		editorMode() {
+			return get(editorMode) === 'interact' ? 'interact' : 'edit';
+		},
+		/**
+		 * 30b P4: where the player STARTS — entering Interact or Play puts them here (VR: the
+		 * rig so the FEET land on it facing `yaw`; desktop Play: the play camera; desktop
+		 * Interact: the editor view). `position` is [x, y, z] with y the FEET height; `yaw`
+		 * is radians, three's rotation.y (0 faces -Z, forward = (-sin yaw, 0, -cos yaw)).
+		 * Overrides the scene's authored `play.spawn`. LOCAL: every peer's module sets its
+		 * own from the same replicated state; never saved. `{teleport: true}` also moves the
+		 * player there NOW when Interact or Play is on (a new level, a new dungeon floor) —
+		 * without it a changed spawn is a checkpoint, used on the next entry.
+		 * `setSpawn(null)` clears it. Cleared when the module is disabled.
+		 * @param {number[] | null} position @param {number=} yaw
+		 * @param {{teleport?: boolean}=} options @returns {boolean} whether it was accepted
+		 */
+		setSpawn(position, yaw = 0, options = {}) {
+			const ok = setRuntimeSpawn(position, yaw, moduleId);
+			if (!spawnDisposeHooked) {
+				spawnDisposeHooked = true;
+				onDispose(() => {
+					if (get(runtimeSpawn)?.owner === moduleId) setRuntimeSpawn(null);
+				});
+			}
+			if (ok && position && options?.teleport) respawnPlayerNow();
+			return ok;
+		},
+		/**
+		 * 30b P4: move the player to the spawn in force now (see setSpawn) — only while
+		 * Interact or Play is on; the editor's Edit view is never moved.
+		 * @returns {boolean} whether the player was moved
+		 */
+		respawnPlayer() {
+			return respawnPlayerNow();
+		},
 		/**
 		 * Where the user is POINTING, as a THREE.Raycaster in world space —
 		 * desktop mouse over the viewport, or the VR pointer hand's ray. A fresh
 		 * instance per call (safe to keep). Null before the first pointer event.
+		 * 30 P4: in play under a pointer lock it is the CROSSHAIR ray (the view's
+		 * centre) — the mouse ray is frozen there; a free-cursor game keeps the mouse.
 		 * The drag recipe (190/untangle): click to pick, follow pointerRay() in a
 		 * frame task, click to drop. (190)
 		 */
@@ -766,8 +993,20 @@ function makeApi(moduleId, moduleName = moduleId) {
 		 * @param {'left'|'right'=} hand
 		 */
 		haptic(intensity = 0.5, durationMs = 50, hand = undefined) {
+			// 30b: silent in EDIT mode (core's own gate) — vibration is for playing
 			vrControlsRef?.hapticPulse?.(intensity, durationMs, hand);
 		},
+		/**
+		 * 30b: a named haptic PATTERN — 'tap' (hover), 'bump' (a press), 'hit' (a grab,
+		 * a contact), 'success', 'fail', 'rumble' (an engine, an explosion), 'heartbeat'.
+		 * On one hand ('left'|'right') or both. LOCAL, Interact/Play only (false in Edit,
+		 * on desktop nothing buzzes). Core already plays tap / bump / hit / knocks for
+		 * you; use this for the game's own moments.
+		 * @param {string} name @param {'left'|'right'=} hand @returns {boolean}
+		 */
+		hapticPattern(name, hand = undefined) {
+			return vrControlsRef?.hapticPattern?.(String(name), hand) ?? false;
+		},
 		/**
 		 * 24-A A2: every KNOCK this peer sees — its own hand's, and every peer's as the
 		 * `hit` message is applied — as `{uuid, by, at, speed, point, linvel, angvel,
@@ -890,10 +1129,61 @@ function makeApi(moduleId, moduleName = moduleId) {
 		flyTo(position, lookAt) {
 			objectActionsRef?.flyTo(position, lookAt ?? position);
 		},
-		/** A spatial UI chime (the ping sounds). LOCAL — broadcast your own op if
-		 * peers should hear it too. @param {string=} sound @param {number[]=} position */
+		/**
+		 * A sound, LOCAL to this device — broadcast your own op if peers should hear it.
+		 * 30b: the GAME set (procedural, no assets, the "Game sounds" volume): 'click',
+		 * 'pop', 'whoosh', 'success', 'fail', 'hit', 'kick', 'shoot', 'laser',
+		 * 'explosion', 'coin', 'levelup', 'goal', 'whistle', 'cheer', 'step', 'ring',
+		 * 'sparkle', 'hurt', 'portal'; plus the ping chimes 'ding' (the default),
+		 * 'chime', 'pluck', 'bell'. An unknown name is a quiet no-op. `position`
+		 * spatialises it. Returns whether a sound started.
+		 * @param {string=} sound @param {number[]=} position @returns {boolean}
+		 */
 		playSound(sound = 'ding', position = undefined) {
-			pingAudioRef?.playPing(sound, position ?? null);
+			const name = String(sound ?? 'ding');
+			if (isGameSound(name)) return playGameSound(name, position ?? null);
+			if (!PING_NAMES.has(name)) return false;
+			pingAudioRef?.playPing(name, position ?? null);
+			return !!pingAudioRef;
+		},
+		/**
+		 * 30b: game MUSIC — procedural loops, LOCAL to this device, tempo-synced to the
+		 * session clock (two peers on one preset hear the same bar), under the effects
+		 * and on the "Music" volume. Plays only in Interact/Play (a call from Edit returns
+		 * false) and stops by itself when the player leaves the game.
+		 * Presets: 'arcade', 'ambient', 'dungeon', 'stadium', 'space', 'puzzle', 'studio'.
+		 */
+		/**
+		 * 30b (C6): a short, pooled particle BURST at a world position — 'sparkle' (the
+		 * default), 'confetti', 'smoke' or 'sparks', an optional CSS colour and a count
+		 * (1..96). LOCAL: broadcast your own op if peers should see it too. Returns
+		 * whether a burst started.
+		 * @param {number[]} position @param {{kind?: string, color?: string, count?: number}=} options
+		 * @returns {boolean}
+		 */
+		effects: {
+			burst: (/** @type {number[]} */ position, /** @type {{kind?: string, color?: string, count?: number}} */ options = {}) =>
+				!!effectsRef?.burst?.(position, options ?? {}),
+			kinds: () => ['sparkle', 'confetti', 'smoke', 'sparks']
+		},
+		/**
+		 * 30b: a BIG centred banner — "GOAL!", "Level 3", "Ring 2 reached" — on the desktop
+		 * HUD and, in a headset, head-locked in front of the player. `sub` is a second,
+		 * smaller line; `ms` how long it stays (300..15000, default 1800); `color` the
+		 * title's colour. A new banner replaces the one showing. LOCAL. Returns its id.
+		 * @param {string} text @param {{sub?: string, ms?: number, color?: string}=} options
+		 * @returns {number}
+		 */
+		announce(text, options = {}) {
+			return announceBanner(text, options ?? {});
+		},
+		music: {
+			/** @param {string} preset @param {{volume?: number}=} options 0..1 @returns {boolean} */
+			play: (preset, options = {}) => playGameMusic(preset, options ?? {}),
+			stop: () => stopGameMusic(),
+			/** the preset playing now, or null @returns {string | null} */
+			current: () => get(gameMusicState)?.preset ?? null,
+			presets: () => [...MUSIC_PRESET_IDS]
 		},
 		/** Park the editor camera behind an object and follow it (the car's chase
 		 * cam) — LOCAL, no selection, no undo. @param {string} uuid */
@@ -1014,6 +1304,24 @@ function makeApi(moduleId, moduleName = moduleId) {
 		 * immune to the shared-scope add race. Rows replicate on the presence channel,
 		 * late joiners converge, a row drops with its owner's disconnect.
 		 */
+		/**
+		 * 30 P4 (roadmap 30 fork 7): what this module remembers ON THIS DEVICE — a best
+		 * score, unlocked levels, a settings choice. JSON values under
+		 * `tp:mod:<moduleId>:<key>` through safeStorage (never throws: a private window or a
+		 * full quota falls back to memory for the session), 256 KB per module (a `set` over
+		 * it returns false and says so ONCE), LOCAL: never replicated, never in a scene
+		 * file, never undone — and deliberately NOT cleared when the module is disabled or
+		 * removed (a reinstall keeps your progress; `clear()` is the module's own reset).
+		 * `get(key, fallback)` · `set(key, value) -> bool` · `remove(key)` · `keys()` ·
+		 * `clear()` · `bytes()`.
+		 */
+		storage: makeModuleStorage(moduleId, {
+			onOverCap: () => {
+				if (storageCapWarned.has(moduleId)) return;
+				storageCapWarned.add(moduleId);
+				showToast(`"${moduleName}" hit its 256 KB storage limit on this device — that value was not saved.`);
+			}
+		}),
 		peerVars: {
 			/** Write MY OWN row. @param {string} name @param {number} value */
 			setMine(name, value) {
diff --git a/src/lib/moduleWorld.js b/src/lib/moduleWorld.js
new file mode 100644
index 00000000..00025850
--- /dev/null
+++ b/src/lib/moduleWorld.js
@@ -0,0 +1,122 @@
+// 30b P5: MODULE CONTENT FOLLOWS THE WORLD — a leaf (svelte/store + sceneStore +
+// moduleContent's registry).
+//
+// THE FINDING (the Quest report: "When I spin the world around, the untangled dots do not
+// spin around"). The VR world gestures (71: two-grip scale/rotate/pan) transform the
+// `world-grab-rig` group, and only what lives INSIDE it moves: objectsGroup, the grid, the
+// notes, the particles. A module's viewport content — the Untangle board, the dungeon, the
+// piano — lives at the SCENE ROOT (golden rule 5: never in objectsGroup, or it would enter
+// GLTF sync), so it stayed pinned to the room while the rest of the world spun away.
+//
+// THE FIX, for every module at once: a `module-world-root` group INSIDE the rig (a sibling
+// of objectsGroup, so golden rule 5 still holds — nothing here is serialised or sent), and
+// every REGISTERED module group (registerInteractiveGroup / registerSystemGroup /
+// registerListedGroup — the names the Module content list already knows) is re-homed
+// under it the moment it reaches the scene root. Its LOCAL transform is untouched, so on
+// the desktop (rig = identity) nothing moves at all, and in VR it rides the rig. A module
+// converting world hits with `group.worldToLocal` (Untangle does) keeps working unchanged,
+// because every matrix it reads is the true one.
+//
+// COMPATIBILITY, the two things a module can still do to "its scene-root group":
+//  · `api.scene().remove(group)` — Object3D.remove only removes DIRECT children, so the
+//    scene instance gets a remove that also takes a re-homed group back out;
+//  · `scene.getObjectByName(name)` — a traversal, so it still finds it.
+// Core's own scene-root scans (playSettings.playPublishers, moduleContent's rows) read
+// `moduleWorldChildren()` as well as `scene.children`.
+// Content a module adds WITHOUT registering a name cannot be told apart from the app's own
+// scene-root helpers, so it stays where it was put.
+import { get } from 'svelte/store';
+import { globalScene } from '../stores/sceneStore';
+import { moduleGroupList, moduleGroupsRevision, moduleContentRows } from './moduleContent';
+
+export const MODULE_WORLD_ROOT = 'module-world-root';
+
+/** @type {any} */ let root = null;
+/** @type {any} */ let patchedScene = null;
+let started = false;
+
+/** the group inside the world rig that module content is re-homed under (null before mount) */
+export function moduleWorldRoot() {
+	return root;
+}
+
+/** the re-homed module groups (for scene-root scans that used to read scene.children) */
+export function moduleWorldChildren() {
+	return root ? root.children : [];
+}
+
+/** is `object` a module group at the top of the module world (or the scene root)? @param {any} object @param {any} scene */
+export function isModuleTopLevel(object, scene) {
+	return !!object && (object.parent === scene || (!!root && object.parent === root));
+}
+
+/** @param {any} object */
+function registeredName(object) {
+	if (!object?.name) return false;
+	return moduleGroupList().some((entry) => entry.name === object.name);
+}
+
+/** move every registered module group sitting at the scene root under the module root */
+export function adoptModuleGroups() {
+	const scene = /** @type {any} */ (get(globalScene));
+	if (!scene || !root) return 0;
+	let moved = 0;
+	for (const child of [...scene.children]) {
+		if (child === root || !registeredName(child)) continue;
+		// .add re-parents (three removes it from the scene first) and KEEPS the local
+		// transform — which is the point: the group's numbers become rig-relative
+		root.add(child);
+		moved++;
+	}
+	return moved;
+}
+
+/** give the scene a remove() that also finds a re-homed module group @param {any} scene */
+function patchRemove(scene) {
+	if (!scene || patchedScene === scene) return;
+	patchedScene = scene;
+	const nativeRemove = scene.remove;
+	/** @param {...any} objects */
+	scene.remove = function (...objects) {
+		for (const object of objects) {
+			if (root && object?.parent === root) root.remove(object);
+			else nativeRemove.call(this, object);
+		}
+		return this;
+	};
+	// a registered group arriving later is re-homed as it lands (after the add returns —
+	// never re-parent inside three's own add loop)
+	scene.addEventListener?.('childadded', (/** @type {any} */ event) => {
+		if (!registeredName(event.child)) return;
+		queueMicrotask(adoptModuleGroups);
+	});
+}
+
+/** Scene mounts the root inside the world rig. @param {any} group */
+export function setModuleWorldRoot(group) {
+	root = group;
+	if (root) root.name = MODULE_WORLD_ROOT;
+	start();
+	adoptModuleGroups();
+}
+
+function start() {
+	if (started || typeof window === 'undefined') return;
+	started = true;
+	globalScene.subscribe((scene) => {
+		patchRemove(scene);
+		adoptModuleGroups();
+	});
+	// a name registered AFTER its group was added (register order varies by module)
+	moduleGroupsRevision.subscribe(() => adoptModuleGroups());
+}
+
+/** test/debug view: what is re-homed, and what the object list's Module content lists */
+export function moduleWorldDebug() {
+	const scene = /** @type {any} */ (get(globalScene));
+	return {
+		root: !!root,
+		rehomed: moduleWorldChildren().map((/** @type {any} */ c) => c.name),
+		rows: moduleContentRows(scene).map((/** @type {any} */ row) => row.name)
+	};
+}
diff --git a/src/lib/nodeCatalog.js b/src/lib/nodeCatalog.js
index a06ac847..e03f8b05 100644
--- a/src/lib/nodeCatalog.js
+++ b/src/lib/nodeCatalog.js
@@ -14,6 +14,14 @@ import { GAME_STATES } from './gameState';
 // svelte/store). Reaching them through inputRuntime instead would close a cycle:
 // inputRuntime imports shortcuts, which reaches history.
 import { GAMEPAD_BUTTONS, GAMEPAD_AXES } from './gamepadPrefs';
+// 30b (core-games): the Game Feel nodes' option lists come from the leaves that own them,
+// so a sound, a pattern or a preset added there reaches the palette with no second edit
+import { GAME_SOUNDS as GAME_SOUND_NAMES } from './gameSfx';
+import { HAPTIC_PATTERN_NAMES } from './hapticPatterns';
+import { MUSIC_PRESET_IDS } from './gameMusicPresets';
+/** Announce's value mark, spelled once OUTSIDE the catalog literals: a brace inside a node's
+ * strings breaks the brace-matching scan flow-node-docs reads this file with */
+const V_MARK = '{v}';
 
 /**
  * A1: `kind: 'text'` is a free-text param. It writes on COMMIT (change/blur),
@@ -214,6 +222,99 @@ export const nodeCatalog = [
 				defaults: { name: 'score', fallback: 0 },
 				params: [{ key: 'name', kind: 'text', placeholder: 'score', maxLength: 40 }]
 			},
+			// 30 P4 (roadmap 30 fork 7): what a game remembers ON THIS DEVICE — a best score,
+			// a level reached. Keyed `tp:scene:<scene name>:<key>` so a best belongs to its
+			// game. LOCAL by design: Store Value writes this peer's browser and sends
+			// nothing, so a REPLICATED trigger (an ordinary On Click) makes every peer save
+			// its own copy, while a per-player trigger saves only for the one who earned it.
+			{
+				type: 'storevalue',
+				label: 'Store Value',
+				defaults: { key: 'best', mode: 'max', value: 0 },
+				inputs: ['trigger', 'value'],
+				inputLabels: { value: 'value — wire a Counter, a variable, a score' },
+				params: [
+					{ key: 'key', kind: 'text', placeholder: 'best', maxLength: 60 },
+					{ key: 'mode', kind: 'select', options: ['set', 'max', 'min', 'add'] }
+				],
+				note: 'Saved on this device only — never sent to other players, never in the scene file.'
+			},
+			{
+				type: 'storedvalue',
+				label: 'Stored Value',
+				defaults: { key: 'best', output: 'number', fallback: 0 },
+				params: [
+					{ key: 'key', kind: 'text', placeholder: 'best', maxLength: 60 },
+					{ key: 'output', kind: 'select', options: ['number', 'text'] }
+				],
+				note: 'Reads what THIS device saved — each player sees their own.'
+			},
+			// 30b (core-games): GAME FEEL — the flow half of 30b-vr-play's module kit, so a
+			// graph-authored game (Towers, Stars Room, Jam Room) can say "Ring 2 reached",
+			// sparkle, chime, buzz and score itself. All LOCAL on every peer from the
+			// replicated trigger stamp (the storevalue / setcamera rule): no message of their
+			// own. Haptics and music keep the core's Interact/Play gate — silent in Edit.
+			{
+				type: 'announce',
+				label: 'Announce',
+				defaults: { text: 'Level ' + V_MARK, sub: '', seconds: 1.8, color: '#ffd76a', decimals: 0 },
+				inputs: ['trigger', 'value'],
+				inputLabels: { value: 'value - fills ' + V_MARK + ' in the text' },
+				params: [
+					{ key: 'text', kind: 'text', placeholder: 'Ring ' + V_MARK + ' reached', maxLength: 80 },
+					{ key: 'sub', kind: 'text', placeholder: 'a smaller second line', maxLength: 120 },
+					{ key: 'seconds', kind: 'range', min: 0.3, max: 15, step: 0.1 },
+					{ key: 'color', kind: 'text', placeholder: '#ffd76a', maxLength: 20 }
+				],
+				note: 'A big banner on every screen (and in VR) — each player sees it from the same pulse.'
+			},
+			{
+				type: 'gamesound',
+				label: 'Game Sound',
+				defaults: { sound: 'coin' },
+				inputs: ['trigger', 'at'],
+				inputLabels: { at: 'at - an object (unwired = not placed)' },
+				params: [{ key: 'sound', kind: 'select', options: [...GAME_SOUND_NAMES] }],
+				note: 'Built-in sounds, no files — played on each device, at the wired object when there is one.'
+			},
+			{
+				type: 'effectburst',
+				label: 'Effect Burst',
+				defaults: { kind: 'sparkle', color: '', count: 48, lift: 0 },
+				inputs: ['trigger', 'at'],
+				inputLabels: { at: 'at - an object (unwired = in front of the player)' },
+				params: [
+					{ key: 'kind', kind: 'select', options: ['sparkle', 'confetti', 'smoke', 'sparks'] },
+					{ key: 'count', kind: 'range', min: 4, max: 96, step: 1 },
+					{ key: 'lift', kind: 'range', min: -2, max: 4, step: 0.1 },
+					{ key: 'color', kind: 'text', placeholder: 'the kind\'s own colours', maxLength: 20 }
+				],
+				note: 'A short particle burst, pooled — any number of these costs nothing between pulses.'
+			},
+			{
+				type: 'hapticpulse',
+				label: 'Controller Buzz',
+				defaults: { pattern: 'success', hand: 'both' },
+				inputs: ['trigger'],
+				params: [
+					{ key: 'pattern', kind: 'select', options: [...HAPTIC_PATTERN_NAMES] },
+					{ key: 'hand', kind: 'select', options: ['both', 'left', 'right'] }
+				],
+				note: 'VR controllers only, and only in Interact or Play — the editor stays still.'
+			},
+			{
+				type: 'gamemusic',
+				label: 'Game Music',
+				defaults: { preset: 'arcade', volume: 0.7, while: 'always' },
+				inputs: ['on'],
+				inputLabels: { on: 'on - unwired = always' },
+				params: [
+					{ key: 'preset', kind: 'select', options: [...MUSIC_PRESET_IDS] },
+					{ key: 'volume', kind: 'range', min: 0, max: 1, step: 0.05 },
+					{ key: 'while', kind: 'select', options: ['always', 'round'] }
+				],
+				note: 'Plays while you are in Interact or Play (never in the editor); each device hears its own.'
+			},
 			// the round clock, derived from the shared startedAt stamp — no clock of its own
 			{
 				type: 'gametime',
@@ -585,6 +686,9 @@ export const nodeCatalog = [
 		items: [
 			// 134: EVENT nodes — ride small replicated trigger messages, not state
 			{ type: 'onclick', label: 'On Click', defaults: { pulse: 0.3 } },
+			// 30b (core-games): a player picked the object up — desktop play/Interact carry or
+			// a VR Interact grip (never an editor move). Towers' crates sound on the lift.
+			{ type: 'ongrab', label: 'On Grab', defaults: { pulse: 0.3 } },
 			// H3: keyboard trigger — LOCAL key presses replicate as trigger pulses
 			// (golden rule: never stream local state); held keys re-pulse so the
 			// output stays high while held
diff --git a/src/lib/nodeDocs.js b/src/lib/nodeDocs.js
index df0afa02..a73658e3 100644
--- a/src/lib/nodeDocs.js
+++ b/src/lib/nodeDocs.js
@@ -35,6 +35,14 @@ export const NODE_DOCS = {
 	allplayers: "Iterates the connected players so a per-player value can be read, or a HUD row shown, for each of them.",
 	setvariable: "Stores a named value in the replicated scene variables when a pulse arrives - shared state without an object.",
 	getvariable: "Reads a named scene variable as a value - the read side of Set Variable, live on every peer.",
+	storevalue: "Saves a value on THIS device when a pulse arrives (set, keep the max or min, or add) - a best score or a level reached that survives a reload; never sent to other players.",
+	storedvalue: "Reads what Store Value saved on this device, as a number or text - the read side of a best score; each player sees their own.",
+	ongrab: "Fires a pulse when a player picks the object up - a carry in Play or Interact, or a VR grip in Interact; editor moves never fire it.",
+	announce: "Shows a big banner - 'Ring 2 reached', 'GOAL!' - on every screen and in VR when a pulse arrives; {v} in the text shows a wired number.",
+	gamesound: "Plays one of the built-in game sounds (coin, ring, levelup, cheer...) when a pulse arrives, at the wired object if one is wired; no sound files needed.",
+	effectburst: "Fires a short sparkle, confetti, smoke or sparks burst at the wired object (or in front of the player) when a pulse arrives; pooled and local to each device.",
+	hapticpulse: "Buzzes the VR controllers with a named pattern (tap, bump, success...) when a pulse arrives - only in Interact or Play, never while editing.",
+	gamemusic: "Plays a looping built-in music preset while you are in Interact or Play - always, or only during a round; wire 'on' to switch it by a condition.",
 	gametime: "Seconds since the game (or the round) started, the same on every peer - a clock that pauses with the game.",
 	peervariable: "A value kept PER PLAYER (score, lives, team) - each peer reads its own row, or a named player's.",
 	charcontroller: "Turns the connected object into a walking, jumping character driven by the player's movement input.",
@@ -70,6 +78,7 @@ export const NODE_DOCS = {
 	onclick: "Fires a short pulse when its object is clicked - the bridge from user input into the graph.",
 	keypress: "Fires a pulse while a keyboard key is pressed - the bridge from your keyboard into the graph.",
 	onimpact: "Fires a pulse when a physics simulation lands the connected object on the ground or another object.",
+	onhit: "Fires a pulse when a hand or a walking player knocks the object - with how hard it was hit (speed) and whether you did it (byMe).",
 	onenter: "Fires a pulse when something enters a trigger volume - the checkpoint, doorway and pressure-plate node.",
 	onexit: "Fires a pulse when something leaves a trigger volume - the other half of On Enter.",
 	onrest: "Fires a pulse when a physics body has finished moving - the counterpart to On Impact, which fires when it starts.",
diff --git a/src/lib/objectActions.js b/src/lib/objectActions.js
index 48c84686..b43c33bf 100644
--- a/src/lib/objectActions.js
+++ b/src/lib/objectActions.js
@@ -16,6 +16,8 @@ import {
 	orbitControls,
 	isVRMode,
 	gizmoSuppressed,
+	editorMode,
+	isLocked,
 	cameraClaim, pokeScene } from '../stores/sceneStore';
 import { attachMultiPivot, releaseMultiPivot, hasCustomOrigin, pivotPose, setPivotOrigin } from './multiTransform';
 import { focusTargetFace, faceEditObject, hideElementSelection, restoreElementSelection } from './faceEdit';
@@ -35,6 +37,9 @@ import { canEditObject, warnViewerReadOnly } from './objectPermissions';
 import { stripEditOverlays, isEditOverlay } from './editOverlays';
 // B7: the transient marker (a LEAF — two stores only, so no cycle back through history)
 import { markTransient } from './transientObjects';
+// 30 P3: a LEAF (THREE + stores), so a static import here closes no cycle
+import { clearModuleSelection } from './moduleContent';
+import { desktopSpawn, spawnEyePose } from './playSpawn'; // 30b P4 (+ vrOnly: core-games)
 // D2: a LEAF (svelte stores + THREE), so a static import here closes no cycle
 import { shareDuplicatedMaterials, linkMaterials } from './materialSharing';
 import {
@@ -164,6 +169,7 @@ export function applySelectionSet(uuids, openProperties = false) {
 			!locked.find((lockedUuid) => lockedUuid[1] === uuid)
 	);
 	applyMemberTints(group, clean);
+	if (clean.length) clearModuleSelection(); // 30 P3: an object selection replaces the proxy
 	const previous = get(selectedObjects);
 	selectedObjects.set(clean);
 	if (clean.length) lastSelection = { uuids: [...clean], origin: null }; // 24-B1
@@ -180,7 +186,13 @@ export function applySelectionSet(uuids, openProperties = false) {
 		// move gizmo unless every object in the set is editable by the local user
 		// (their own local-only objects, or anything for editors/admins).
 		const editable = clean.every((/** @type {any} */ uuid) => canEditObject(group.getObjectByProperty('uuid', uuid)));
-		if (get(gizmoSuppressed)) {
+		if (get(editorMode) === 'interact') {
+			// 30 P1: INTERACT hands the scene to the player-style input, so a selection
+			// made from the object list (or kept from Edit) stands with no gizmo — a
+			// seated gizmo would take the next press on the object and move it instead
+			releaseMultiPivot();
+			controls.detach();
+		} else if (get(gizmoSuppressed)) {
 			// sculpt mode: selection (and its lock) stand, but no gizmo — the
 			// SculptToolbar toggle re-attaches explicitly when the user opts in
 			releaseMultiPivot();
@@ -211,6 +223,43 @@ export function applySelectionSet(uuids, openProperties = false) {
 	}
 }
 
+/**
+ * 30 P1: switch the editor between EDIT (a click selects, the gizmo attaches) and
+ * INTERACT (a click plays with the scene: module handlers, On Click nodes, the cursor
+ * grab). LOCAL — the store is never sent or saved. Entering Interact puts the gizmo away
+ * without dropping the selection, and coming back re-seats it on whatever is still
+ * selected, so a round trip through Interact costs the user nothing.
+ * @param {'edit' | 'interact'} mode @returns {'edit' | 'interact'}
+ */
+export function setEditorMode(mode) {
+	/** @type {'edit' | 'interact'} */
+	const next = mode === 'interact' ? 'interact' : 'edit';
+	if (get(editorMode) === next) return next;
+	editorMode.set(next);
+	/** @type {any} */
+	const controls = get(TControls);
+	if (next === 'interact') {
+		releaseMultiPivot();
+		if (controls && !get(isVRMode)) controls.detach();
+		// 30b P4: a game that names a spawn puts the desktop view there on the way in (VR
+		// does the same for the rig — vrControls follows this store; Play's camera spawns in
+		// PointerLockControls). No spawn, no move: the view stays where the author left it.
+		const spawn = desktopSpawn();
+		if (spawn && !get(isVRMode) && get(isLocked) !== true) {
+			const { eye, lookAt } = spawnEyePose(spawn);
+			flyTo(eye, lookAt);
+		}
+	} else if (get(selectedObjects).length) {
+		applySelectionSet([...get(selectedObjects)]);
+	}
+	return next;
+}
+
+/** The toolbar cell and the I key. */
+export function toggleEditorMode() {
+	return setEditorMode(get(editorMode) === 'interact' ? 'edit' : 'interact');
+}
+
 /** @param {string} uuid @param {boolean} openProperties @param {boolean=} additive - shift-click toggles set membership */
 export function selectObject(uuid, openProperties = false, additive = false) {
 	const group = get(objectsGroup);
@@ -271,6 +320,7 @@ export function deselectObject() {
 	applyMemberTints(get(objectsGroup), []);
 	broadcastSelectionRelease(get(selectedObjects));
 	selectedObjects.set([]);
+	clearModuleSelection(); // 30 P3: the Module content proxy goes with any deselect
 	if (controls && !get(isVRMode)) controls.detach();
 	// selectedObject keeps the last object on purpose — the open inspector binds
 	// to $selectedObject.position/material and would crash on an empty value
@@ -298,6 +348,14 @@ export function setTransformMode(mode) {
 	const controls = get(TControls);
 	const object = controls?.object;
 	const vr = get(isVRMode);
+	// 30 P1: a transform tool IS editing — picking one in Interact goes back to Edit (which
+	// re-seats the gizmo on the selection) in that tool, rather than doing nothing visible
+	if (get(editorMode) === 'interact' && !vr) {
+		setEditorMode('edit');
+		get(TControls)?.setMode(mode);
+		transformMode.set(mode);
+		return;
+	}
 	const same = get(transformMode) === mode;
 	const isEditProxy = !!(object?.userData?.isFaceProxy || object?.userData?.isVertexProxy);
 	if (same && object && !vr) {
@@ -683,6 +741,12 @@ registerHistoryKind('props', (entry, state) => {
 		if (peer)
 			peer.send({ type: 'objectParameters', parameter: 'device', uuid: entry.uuid, device: state.device });
 	}
+	if ('pick' in state) {
+		// 30 P2: click-through in the viewport ("the next opaque thing behind me")
+		if (state.pick) object.userData.pick = state.pick;
+		else delete object.userData.pick;
+		if (peer) peer.send({ type: 'objectParameters', parameter: 'pick', uuid: entry.uuid, pick: state.pick ?? null });
+	}
 	if ('origin' in state) {
 		// 17-D: the per-object transform origin (pivot offset) is scene data, so
 		// moving it is undoable and replicated like any other userData write
@@ -706,6 +770,30 @@ registerHistoryKind('group', (entry, state) => {
 	return true;
 });
 
+/**
+ * 30 P2: mark an object CLICK-THROUGH in the viewport — an editor click passes it to the
+ * next opaque thing behind (a game's walls, a glass case, a ceiling). Scene data like
+ * `userData.physics`: one `props` undo entry, the existing `objectParameters` message,
+ * and it rides toJSON / GLTF extras into every save. Absent is the default, so an object
+ * never flagged serialises byte-identically.
+ * @param {string} uuid @param {boolean} on @returns {boolean} whether anything changed
+ */
+export function setPickThrough(uuid, on) {
+	const object = get(objectsGroup)?.getObjectByProperty('uuid', uuid);
+	if (!object) return false;
+	const before = object.userData.pick ?? null;
+	const next = on ? 'through' : null;
+	if (before === next) return false;
+	if (next) object.userData.pick = next;
+	else delete object.userData.pick;
+	recordEntry({ kind: 'props', uuid, before: { pick: before }, after: { pick: next } });
+	/** @type {any} */
+	const peer = get(peers);
+	peer?.send({ type: 'objectParameters', parameter: 'pick', uuid, pick: next });
+	pokeScene();
+	return true;
+}
+
 /** Toggle visibility and replicate (same message Properties uses) @param {string} uuid */
 export function toggleObjectVisibility(uuid) {
 	const group = get(objectsGroup);
@@ -1137,7 +1225,10 @@ export function flyTo(position, target, duration = 400) {
 	/** @param {number} now */
 	function step(now) {
 		if (token !== focusAnimation) return;
-		const t = Math.min((now - started) / duration, 1);
+		// a rAF timestamp is the FRAME's start, which can precede `started`: a 0 ms fly then
+		// divided a negative (or zero) elapsed by 0 and parked the camera at ±Infinity/NaN for a
+		// frame, which threw from the audio listener (30 mod-audit finding). Clamp both ends.
+		const t = duration > 0 ? Math.min(Math.max((now - started) / duration, 0), 1) : 1;
 		const ease = 1 - Math.pow(1 - t, 3);
 		camera.position.lerpVectors(startPosition, endPosition, ease);
 		controls.target.lerpVectors(startTarget, endTarget, ease);
diff --git a/src/lib/packRefs.js b/src/lib/packRefs.js
new file mode 100644
index 00000000..a9a8f7d7
--- /dev/null
+++ b/src/lib/packRefs.js
@@ -0,0 +1,551 @@
+// @ts-ignore - no bundled three type declarations (project-wide)
+import * as THREE from 'three';
+// @ts-ignore - three addons ship no declarations here (project-wide)
+import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
+// @ts-ignore
+import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';
+// @ts-ignore
+import { MeshoptDecoder } from 'three/addons/libs/meshopt_decoder.module.js';
+import { writable, get } from 'svelte/store';
+import { objectsGroup, pokeScene } from '../stores/sceneStore';
+import { showToast } from '../stores/appStore';
+import { PACKS_BASE } from './packs';
+import { hashBytes } from './explorer';
+
+// 30c — KIT REFERENCES: a pack piece in a scene is a REFERENCE, not a copy.
+//
+// THE MEASUREMENT this module exists for: one placed `WallStone` (a 0.84 MB GLB from the
+// architecture kit) serialized through `buildSessionPayload` as a 7.9 MB toJSON element —
+// its three 1024² JPEGs come back as PNG data URLs (3.3 + 2.3 + 1.9 MB) — and 5.9 MB
+// zipped. `objects` is one toJSON() PER top-level child, so two copies of one wall share
+// nothing, and a castle of ~100 kit pieces would be a ~600 MB file. The wire has the same
+// shape (a session load sends each element; a placement sends each mesh as a GLTF).
+//
+// So a piece placed from a pack carries WHERE IT CAME FROM:
+//   userData.packRef = {pack, item, path, hash, kids}
+// `path` is relative to PACKS_BASE (an absolute URL passes through — the Khronos rows),
+// `hash` is the content hash of the bytes it was built from, `kids` the uuids of its
+// descendants in traverse order (so every peer rebuilds the same child uuids). A save, a
+// session-load broadcast and a late joiner's sync write a PRISTINE piece as a STUB: an
+// empty Group with the root's uuid, transform and userData plus `packStub: true`. Every
+// peer (and the loader of a file) REFILLS a stub from the pack URL — fetched and parsed
+// once per piece, and every copy shares its textures, so twelve walls upload three
+// textures instead of thirty-six.
+//
+// PRISTINE is measured, never assumed: a piece whose descendants differ from the file it
+// came from (a mesh edit, a new colour, a dropped texture, a moved child) is written in
+// full exactly as before — `fingerprintOf` over the descendants' structure, geometry
+// checksums, material parameters and an 8×8 sample of every texture, compared against the
+// same fingerprint of the parsed file. Only the ROOT's own transform, name and userData
+// are free, and those ride the stub.
+//
+// AN OLDER BUILD reading a stub gets an empty group where the piece was (nothing throws);
+// a peer that cannot reach the pack keeps the stub, says so once, and SAVES it back as a
+// stub — a reference is never silently turned into nothing.
+//
+// A LEAF: three + its loaders, svelte/store, two stores, packs (for PACKS_BASE) and
+// explorer (for the one content hash) — both leaves themselves. sessions and
+// commandsHandler import this; nothing here reaches back.
+
+/**
+ * @typedef {{pack: string, item: string, path: string, hash?: string, kids?: string[]}} PackRef
+ */
+
+/** How many refills are in flight — the author script and the suite wait on it.
+ * @type {import('svelte/store').Writable<number>} */
+export const packRefsPending = writable(0);
+
+/** url -> the parsed file ({hash, scene}); a failure is forgotten so a retry can win
+ * @type {Map<string, Promise<{hash: string, scene: any}>>} */
+const templates = new Map();
+/** content hash -> the fingerprint of a pristine copy
+ * @type {Map<string, {key: string, samples: (number[] | null)[]}>} */
+const fingerprints = new Map();
+/** image-bytes key -> the ONE texture every piece painted with those bytes uses
+ * @type {Map<string, any>} */
+const sharedTextures = new Map();
+/** root uuid -> its refill, so two scans never fill one root twice
+ * @type {Map<string, Promise<boolean>>} */
+const filling = new Map();
+/** urls already reported as unreachable (one toast per piece, not per copy) */
+const reported = new Set();
+
+/** @param {any} object @returns {PackRef | null} */
+export function packRefOf(object) {
+	const ref = object?.userData?.packRef;
+	return ref && typeof ref.path === 'string' && ref.path ? ref : null;
+}
+
+/** Where a reference's bytes live. @param {PackRef} ref */
+export function packRefUrl(ref) {
+	if (/^https?:\/\//.test(ref.path)) return ref.path;
+	return String(PACKS_BASE).replace(/\/+$/, '') + '/' + ref.path.replace(/^\/+/, '');
+}
+
+/**
+ * The reference for a pack item fetched from `url`: relative to PACKS_BASE when it lives
+ * there (so a scene follows the pack to whatever ref the build serves), absolute otherwise.
+ * @param {string} url @param {{pack?: string, item?: string}} [names]
+ * @returns {PackRef | null}
+ */
+export function packRefFromUrl(url, names = {}) {
+	if (!url || typeof url !== 'string') return null;
+	const base = String(PACKS_BASE).replace(/\/+$/, '') + '/';
+	let path = url;
+	if (url.startsWith(base)) path = url.slice(base.length);
+	else if (!/^https?:\/\//.test(url)) return null;
+	const pack = names.pack || (path === url ? '' : path.split('/')[0]) || 'pack';
+	const item = names.item || (path.split('/').pop() ?? '').replace(/\.\w+$/, '') || 'item';
+	return { pack, item, path };
+}
+
+function createLoader() {
+	const loader = new GLTFLoader();
+	const draco = new DRACOLoader();
+	draco.setDecoderPath('/draco/');
+	loader.setDRACOLoader(draco);
+	loader.setMeshoptDecoder(MeshoptDecoder);
+	return loader;
+}
+
+/**
+ * The bytes of every IMAGE in a GLB, by glTF image index — read from the file's own JSON
+ * chunk, because the parsed texture no longer knows them. Empty for a .gltf or anything
+ * unexpected (sharing is an optimisation; nothing depends on it).
+ * @param {ArrayBuffer} buffer @returns {Uint8Array[]}
+ */
+function glbImages(buffer) {
+	try {
+		const view = new DataView(buffer);
+		if (view.getUint32(0, true) !== 0x46546c67) return [];
+		const jsonLength = view.getUint32(12, true);
+		const json = JSON.parse(new TextDecoder().decode(new Uint8Array(buffer, 20, jsonLength)));
+		const binStart = 20 + jsonLength + 8;
+		return (json.images ?? []).map((/** @type {any} */ image) => {
+			const bv = json.bufferViews?.[image.bufferView];
+			return bv ? new Uint8Array(buffer, binStart + (bv.byteOffset ?? 0), bv.byteLength) : new Uint8Array();
+		});
+	} catch {
+		return [];
+	}
+}
+
+const MAP_SLOTS = ['map', 'normalMap', 'roughnessMap', 'metalnessMap', 'emissiveMap', 'aoMap', 'alphaMap', 'bumpMap', 'displacementMap', 'lightMap'];
+
+/**
+ * One texture per distinct IMAGE across every kit piece: the architecture kit's six
+ * sandstone walls carry byte-identical JPEGs, so without this each wall variant uploaded
+ * its own three. Keyed by the image bytes' hash plus everything that makes two textures
+ * of one image differ (colour space, sampler, channel, flip).
+ * @param {any} gltf @param {ArrayBuffer} buffer
+ */
+async function shareTextures(gltf, buffer) {
+	const images = glbImages(buffer);
+	if (!images.length) return;
+	const json = gltf.parser?.json;
+	/** @type {string[]} */
+	const imageKeys = await Promise.all(
+		images.map(async (bytes) => (bytes.byteLength ? hashBytes(bytes.slice().buffer) : ''))
+	);
+	gltf.scene.traverse((/** @type {any} */ node) => {
+		if (!node.isMesh) return;
+		for (const material of Array.isArray(node.material) ? node.material : [node.material]) {
+			for (const slot of MAP_SLOTS) {
+				const texture = material?.[slot];
+				if (!texture) continue;
+				const index = gltf.parser?.associations?.get(texture)?.textures;
+				const source = index == null ? undefined : json?.textures?.[index]?.source;
+				const imageKey = source == null ? '' : imageKeys[source];
+				if (!imageKey) continue;
+				const key = [imageKey, texture.colorSpace, texture.wrapS, texture.wrapT, texture.magFilter, texture.minFilter, texture.channel, texture.flipY].join('|');
+				const shared = sharedTextures.get(key);
+				if (shared && shared !== texture) {
+					material[slot] = shared;
+					texture.dispose();
+				} else if (!shared) sharedTextures.set(key, texture);
+			}
+		}
+	});
+}
+
+/**
+ * Fetch + parse a pack file ONCE per url, and register the fingerprint of a pristine copy
+ * under the hash of the bytes actually fetched.
+ * @param {string} url @returns {Promise<{hash: string, scene: any}>}
+ */
+export function loadPackTemplate(url) {
+	let job = templates.get(url);
+	if (!job) {
+		job = (async () => {
+			const res = await fetch(url);
+			if (!res.ok) throw new Error('HTTP ' + res.status);
+			const buffer = await res.arrayBuffer();
+			const hash = await hashBytes(buffer);
+			/** @type {any} */
+			const gltf = await new Promise((resolve, reject) => createLoader().parse(buffer, '', resolve, reject));
+			// an animated rig replicates as its BYTES (animatedImports) — never a reference
+			if (gltf.animations?.length) throw new Error('animated models are not referenced');
+			await shareTextures(gltf, buffer);
+			const scene = gltf.scene;
+			scene.updateMatrixWorld(true);
+			fingerprints.set(hash, fingerprintOf(scene));
+			return { hash, scene };
+		})();
+		templates.set(url, job);
+		job.catch(() => templates.delete(url));
+	}
+	return job;
+}
+
+// ---- the fingerprint ---------------------------------------------------------
+
+/** Seven significant digits, and anything under 1e-6 is zero — a GLTF round trip turns a
+ * rotation matrix's -1.14e-9 into -1.42e-9, which is the same matrix.
+ * @param {number} v */
+const num = (v) =>
+	typeof v === 'number' && Number.isFinite(v) ? (Math.abs(v) < 1e-6 ? 0 : Number(v.toPrecision(7))) : String(v);
+
+/** Two weighted sums over a typed array — equal arrays give equal sums, and a moved
+ * vertex moves the second one even when it keeps the first.
+ * @param {ArrayLike<number>} array */
+function checksum(array) {
+	let a = 0;
+	let b = 0;
+	for (let i = 0; i < array.length; i++) {
+		a += array[i];
+		b += array[i] * ((i % 251) + 1);
+	}
+	return num(a) + '/' + num(b);
+}
+
+/** @param {any} geometry */
+function geometryKey(geometry) {
+	if (!geometry?.attributes) return '-';
+	const names = Object.keys(geometry.attributes).sort();
+	const parts = names.map((name) => {
+		const attr = geometry.attributes[name];
+		return name + ':' + attr.itemSize + ':' + attr.count + ':' + (attr.normalized ? 1 : 0) + ':' + checksum(attr.array);
+	});
+	const index = geometry.index ? 'i' + geometry.index.count + ':' + checksum(geometry.index.array) : 'noindex';
+	const groups = (geometry.groups ?? []).map((/** @type {any} */ g) => g.start + '+' + g.count + '@' + (g.materialIndex ?? 0)).join(';');
+	return parts.join(',') + '|' + index + '|' + groups;
+}
+
+/** 8×8 RGBA of a texture's image, cached per image. Null when it cannot be read (no
+ * canvas, a tainted or odd image) — then the texture is compared by its shape alone.
+ * @type {WeakMap<any, number[] | null>} */
+const samples = new WeakMap();
+/** @param {any} texture @returns {number[] | null} */
+function textureSample(texture) {
+	const image = texture?.image;
+	if (!image || typeof image !== 'object') return null;
+	if (samples.has(image)) return samples.get(image) ?? null;
+	/** @type {number[] | null} */
+	let out = null;
+	try {
+		if (typeof document !== 'undefined' && (image.width ?? 0) > 0) {
+			const canvas = document.createElement('canvas');
+			canvas.width = 8;
+			canvas.height = 8;
+			const ctx = canvas.getContext('2d', { willReadFrequently: true });
+			if (ctx) {
+				ctx.drawImage(image, 0, 0, 8, 8);
+				out = Array.from(ctx.getImageData(0, 0, 8, 8).data);
+			}
+		}
+	} catch {
+		out = null;
+	}
+	samples.set(image, out);
+	return out;
+}
+
+/** @param {any} texture */
+function textureKey(texture) {
+	if (!texture) return '-';
+	const image = texture.image ?? {};
+	return [
+		(image.width ?? '?') + 'x' + (image.height ?? '?'),
+		texture.flipY ? 1 : 0,
+		texture.wrapS,
+		texture.wrapT,
+		num(texture.repeat?.x) + ',' + num(texture.repeat?.y),
+		num(texture.offset?.x) + ',' + num(texture.offset?.y),
+		num(texture.rotation),
+		texture.channel ?? 0
+	].join(':');
+}
+
+/** @param {any} color */
+const colorKey = (color) => (color?.getHexString ? color.getHexString() : '-');
+
+/** @param {any} material @param {(number[] | null)[]} sink */
+function materialKey(material, sink) {
+	if (!material) return '-';
+	const head = [
+		material.type,
+		colorKey(material.color),
+		num(material.roughness),
+		num(material.metalness),
+		colorKey(material.emissive),
+		num(material.emissiveIntensity),
+		num(material.opacity),
+		material.transparent ? 1 : 0,
+		material.side,
+		num(material.alphaTest),
+		material.vertexColors ? 1 : 0,
+		material.flatShading ? 1 : 0,
+		material.wireframe ? 1 : 0,
+		num(material.normalScale?.x) + ',' + num(material.normalScale?.y),
+		num(material.envMapIntensity)
+	].join(',');
+	const maps = MAP_SLOTS.map((slot) => {
+		const texture = material[slot];
+		if (texture) sink.push(textureSample(texture));
+		return slot + '=' + textureKey(texture);
+	}).join(',');
+	return head + '|' + maps;
+}
+
+/**
+ * What must match for a copy to be the file it came from: every DESCENDANT's type, name,
+ * visibility and local matrix, each mesh's geometry and material(s), plus texture samples
+ * (compared with a tolerance, because an autosave round trip re-encodes the JPEGs). The
+ * root itself is excluded — its transform, name and userData are the placement and ride
+ * the stub.
+ * @param {any} root @returns {{key: string, samples: (number[] | null)[]}}
+ */
+export function fingerprintOf(root) {
+	/** @type {(number[] | null)[]} */
+	const sink = [];
+	/** @type {string[]} */
+	const lines = [];
+	root.traverse((/** @type {any} */ node) => {
+		if (node === root) return;
+		let line = node.type + ':' + node.name + ':' + (node.visible ? 1 : 0) + ':' + node.matrix.elements.map(num).join(',');
+		if (node.isMesh || node.isLine || node.isPoints) {
+			line += '|' + geometryKey(node.geometry);
+			const materials = Array.isArray(node.material) ? node.material : [node.material];
+			line += '|' + materials.map((/** @type {any} */ m) => materialKey(m, sink)).join('||');
+		}
+		lines.push(line);
+	});
+	return { key: lines.join('\n'), samples: sink };
+}
+
+/** Mean absolute difference per channel under which two samples are one image. */
+const SAMPLE_TOLERANCE = 10;
+
+/** @param {{key: string, samples: (number[] | null)[]}} a @param {{key: string, samples: (number[] | null)[]}} b */
+export function sameFingerprint(a, b) {
+	if (!a || !b || a.key !== b.key || a.samples.length !== b.samples.length) return false;
+	for (let i = 0; i < a.samples.length; i++) {
+		const x = a.samples[i];
+		const y = b.samples[i];
+		if (!x || !y) continue; // unreadable on one side: the shape key already matched
+		if (x.length !== y.length) return false;
+		let diff = 0;
+		for (let k = 0; k < x.length; k++) diff += Math.abs(x[k] - y[k]);
+		if (diff / x.length > SAMPLE_TOLERANCE) return false;
+	}
+	return true;
+}
+
+/** The uuids of a root's descendants in traverse order. @param {any} root */
+function descendantUuids(root) {
+	/** @type {string[]} */
+	const out = [];
+	root.traverse((/** @type {any} */ node) => {
+		if (node !== root) out.push(node.uuid);
+	});
+	return out;
+}
+
+/**
+ * Stamp a freshly imported pack piece BEFORE it replicates: its reference, its children's
+ * uuids, and — since it IS the file right now — the pristine fingerprint for its hash.
+ * @param {any} root @param {PackRef} ref @param {string} hash the bytes it was parsed from
+ */
+export function stampPackRef(root, ref, hash) {
+	if (!root || !ref) return;
+	root.updateMatrixWorld(true);
+	root.userData = { ...(root.userData ?? {}), packRef: { pack: ref.pack, item: ref.item, path: ref.path, hash, kids: descendantUuids(root) } };
+	if (hash && !fingerprints.has(hash)) fingerprints.set(hash, fingerprintOf(root));
+}
+
+/**
+ * Is this object a reference that can travel as a stub? A hollow stub (not refilled yet,
+ * or its pack was unreachable) always is; a filled one only when it still IS the file.
+ * @param {any} object @returns {boolean}
+ */
+export function isPristinePackRef(object) {
+	const ref = packRefOf(object);
+	if (!ref) return false;
+	if (object.userData.packStub) return object.children.length === 0;
+	const fingerprint = ref.hash ? fingerprints.get(ref.hash) : null;
+	if (!fingerprint) return false;
+	object.updateMatrixWorld(true);
+	return sameFingerprint(fingerprint, fingerprintOf(object));
+}
+
+/**
+ * The stub: an empty Group carrying the root's identity, transform and userData, as a
+ * toJSON element — the shape `objects` and the `object` message already carry, so an
+ * older reader parses it into an empty group rather than failing.
+ * @param {any} root @returns {any}
+ */
+export function stubElementOf(root) {
+	const ref = /** @type {PackRef} */ (packRefOf(root));
+	const hollow = new THREE.Group();
+	hollow.uuid = root.uuid;
+	hollow.name = root.name;
+	hollow.position.copy(root.position);
+	hollow.quaternion.copy(root.quaternion);
+	hollow.scale.copy(root.scale);
+	hollow.visible = root.visible;
+	hollow.renderOrder = root.renderOrder;
+	hollow.layers.mask = root.layers.mask;
+	const kids = root.userData.packStub ? ref.kids ?? [] : descendantUuids(root);
+	hollow.userData = JSON.parse(JSON.stringify({ ...root.userData, packRef: { ...ref, kids }, packStub: true }));
+	hollow.updateMatrix();
+	return hollow.toJSON();
+}
+
+/** How many nodes a stub stands for (the root + what it refills to), for object budgets.
+ * @param {any} node a serialized node (element.object) */
+export function stubNodeCount(node) {
+	const kids = node?.userData?.packStub ? node?.userData?.packRef?.kids : null;
+	return Array.isArray(kids) ? kids.length : 0;
+}
+
+/** A child uuid every peer computes alike: the root's uuid with its last 12 hex digits
+ * replaced by the child's index. @param {string} rootUuid @param {number} index */
+function derivedUuid(rootUuid, index) {
+	return String(rootUuid).slice(0, 24) + (index + 1).toString(16).padStart(12, '0');
+}
+
+/** A private copy of a parsed piece: geometry and material cloned (the edit tools mutate
+ * both IN PLACE, and a copy must never move its siblings), textures shared.
+ * @param {any} scene */
+function instanceOf(scene) {
+	const copy = scene.clone(true);
+	copy.traverse((/** @type {any} */ node) => {
+		if (!node.isMesh) return;
+		node.geometry = node.geometry.clone();
+		node.material = Array.isArray(node.material) ? node.material.map((/** @type {any} */ m) => m.clone()) : node.material.clone();
+	});
+	return copy;
+}
+
+/**
+ * Refill a stub from its pack. Resolves true when it filled, false when it could not (or
+ * is no longer in the scene, or was filled meanwhile). The children take the recorded
+ * uuids, so every peer converges on the same ones.
+ * @param {any} root @returns {Promise<boolean>}
+ */
+export function fillPackRef(root) {
+	if (!root?.userData?.packStub) return Promise.resolve(false);
+	const ref = packRefOf(root);
+	if (!ref) return Promise.resolve(false);
+	const inflight = filling.get(root.uuid);
+	if (inflight) return inflight;
+	const url = packRefUrl(ref);
+	packRefsPending.update((n) => n + 1);
+	const job = (async () => {
+		try {
+			const { hash, scene } = await loadPackTemplate(url);
+			// replaced (a clear, a reload of the same file) or filled while we fetched
+			if (!root.userData.packStub || root.children.length) return false;
+			if (get(objectsGroup)?.getObjectByProperty('uuid', root.uuid) !== root) return false;
+			const copy = instanceOf(scene);
+			/** @type {any[]} */
+			const nodes = [];
+			copy.traverse((/** @type {any} */ node) => {
+				if (node !== copy) nodes.push(node);
+			});
+			const kids = Array.isArray(ref.kids) ? ref.kids : [];
+			// a stub that lost its kids (a merge import re-uuids the tree) still has to give
+			// every peer the SAME child uuids: derive them from the root's
+			nodes.forEach((node, i) => {
+				node.uuid = typeof kids[i] === 'string' && kids[i] ? kids[i] : derivedUuid(root.uuid, i);
+			});
+			const hideShadow = root.userData.shadow === false;
+			for (const child of [...copy.children]) root.add(child);
+			if (hideShadow)
+				root.traverse((/** @type {any} */ node) => {
+					if (!node.isMesh) return;
+					node.castShadow = false;
+					node.receiveShadow = false;
+					node.userData.shadow = false;
+				});
+			delete root.userData.packStub;
+			root.userData.packRef = { ...ref, hash, kids: nodes.map((node) => node.uuid) };
+			pokeScene();
+			return true;
+		} catch (error) {
+			if (!reported.has(url)) {
+				reported.add(url);
+				console.log('kit piece could not be loaded: ' + url, error);
+				showToast('Could not load the kit piece "' + (ref.item || ref.path) + '" — its pack is unreachable. It stays in the scene as a placeholder.');
+			}
+			return false;
+		} finally {
+			filling.delete(root.uuid);
+			packRefsPending.update((n) => n - 1);
+		}
+	})();
+	filling.set(root.uuid, job);
+	return job;
+}
+
+/** Resolves once no refill is in flight (the author script and the suites wait on it). */
+export function packRefsSettled() {
+	return new Promise((resolve) => {
+		/** @type {any} */
+		let off = null;
+		off = packRefsPending.subscribe((n) => {
+			if (n > 0) return;
+			queueMicrotask(() => off?.());
+			resolve(true);
+		});
+	});
+}
+
+/** Refill every stub in the scene, and learn the pristine fingerprint of every piece whose
+ * file we have not parsed yet (a scene restored from the autosave), so a later save can
+ * write it as a stub again. */
+function scan() {
+	const group = get(objectsGroup);
+	if (!group) return;
+	group.traverse((/** @type {any} */ node) => {
+		const ref = packRefOf(node);
+		if (!ref) return;
+		if (node.userData.packStub) {
+			if (!node.children.length) fillPackRef(node);
+		} else if (ref.hash && !fingerprints.has(ref.hash)) {
+			loadPackTemplate(packRefUrl(ref)).catch(() => {});
+		}
+	});
+}
+
+let started = false;
+/** @type {any} */
+let scanTimer = null;
+
+/** Watch the scene for stubs (a loaded file, a peer's broadcast, a late joiner's sync). */
+export function startPackRefs() {
+	if (started || typeof window === 'undefined') return;
+	started = true;
+	// 30b integrate: undo keeps a pristine piece as its stub (history.registerReferenceSnapshot).
+	// Dynamic: history's import subtree must not gain an edge to the Explorer through here.
+	import('./history').then((history) =>
+		history.registerReferenceSnapshot((/** @type {any} */ object) => (isPristinePackRef(object) ? stubElementOf(object) : null))
+	);
+	objectsGroup.subscribe(() => {
+		if (scanTimer) return;
+		scanTimer = setTimeout(() => {
+			scanTimer = null;
+			scan();
+		}, 30);
+	});
+}
diff --git a/src/lib/physics.js b/src/lib/physics.js
index 1ed12567..14f0268b 100644
--- a/src/lib/physics.js
+++ b/src/lib/physics.js
@@ -148,10 +148,34 @@ const IMPACT_MIN_DOWN_VY = 1.2; // m/s downward (pre-step) for a contact to coun
 export async function warmup() {
 	if (RAPIER) return;
 	const module = await import('@dimforge/rapier3d-compat');
-	await module.init();
+	await initQuietly(module);
 	RAPIER = module;
 }
 
+// 30 P0: rapier-compat's own `init()` hands wasm-bindgen's init a bare byte array — the
+// pre-0.2.93 calling convention — and wasm-bindgen answers with "using deprecated
+// parameters for the initialization function; pass a single object instead". The call
+// is INSIDE rapier's bundle (`init` takes no arguments and the inner init is not
+// exported), so there is no single-object form for us to pass, and rapier is a FROZEN
+// dependency (solver behaviour). So the one warning is filtered for the length of that
+// call and nothing else: an exact-prefix match, restored in `finally`, every other
+// console.warn passes straight through.
+const RAPIER_INIT_WARNING = 'using deprecated parameters for the initialization function';
+
+/** @param {any} module */
+async function initQuietly(module) {
+	const warn = console.warn;
+	console.warn = (/** @type {any[]} */ ...args) => {
+		if (typeof args[0] === 'string' && args[0].startsWith(RAPIER_INIT_WARNING)) return;
+		warn.apply(console, args);
+	};
+	try {
+		await module.init();
+	} finally {
+		console.warn = warn;
+	}
+}
+
 /** @param {any} object */
 function transformOf(object) {
 	return {
diff --git a/src/lib/playCursor.js b/src/lib/playCursor.js
new file mode 100644
index 00000000..533c69f7
--- /dev/null
+++ b/src/lib/playCursor.js
@@ -0,0 +1,77 @@
+// 30 P3 — FREE-CURSOR GAMES (roadmap 30 fork 6): WHERE PLAY MODE AIMS.
+//
+// Play mode had exactly one aim: NDC (0, 0), the crosshair, because under pointer lock the
+// cursor is pinned to the centre of the canvas and does not exist for the player. A board
+// game, a puzzle or an instrument wants the opposite — the real cursor, visible, aiming
+// wherever it is — and `scenePhysics.play.cursor: 'free'` asks for that (absent = 'locked',
+// today, byte for byte). A module may publish it too, field by field, through the
+// `userData.play` contract (`resolvePlaySettings`).
+//
+// THIS LEAF IS THE ONE ANSWER to "where is the player aiming right now", so the pieces that
+// ask cannot disagree:
+//   · playInteract's tap and grab (the crosshair ray before this),
+//   · PointerLockControls, which must not ask for a lock in free mode,
+//   · PlayReticle, which has no crosshair to draw in free mode,
+//   · the module SDK's `pointerRay()` (lane 30-core-modes reads `playAimNdc()` in play:
+//     the cursor when free, the crosshair under a lock — which is also the fix for the
+//     stale-mouse ray it returned under a lock).
+//
+// The cursor is recorded in CLIENT pixels and converted to NDC against the canvas at read
+// time (the W9 rule `pointerRay` already keeps: the viewport can change with the pointer
+// perfectly still). LOCAL and unreplicated — an aim is a fact about this screen.
+//
+// Imports stores and leaves only (sceneStore, scenePhysics via playSettings, canvasRect),
+// so playInteract, PointerLockControls and moduleSDK can all reach it without a cycle.
+
+import { get } from 'svelte/store';
+import { isLocked, isVRMode, globalScene } from '../stores/sceneStore';
+import { resolvePlaySettings } from './playSettings';
+import { ndcFromClient } from './canvasRect';
+
+/** the last pointer position over the page, CLIENT pixels */
+const cursor = { x: 0, y: 0, seen: false };
+
+if (typeof window !== 'undefined') {
+	// capture phase + passive: we only read coordinates, and a panel that stops the event
+	// on its way up (the documented delegated-handler trap) must not hide the cursor from us
+	const note = (/** @type {PointerEvent} */ event) => {
+		cursor.x = event.clientX;
+		cursor.y = event.clientY;
+		cursor.seen = true;
+	};
+	window.addEventListener('pointermove', note, { capture: true, passive: true });
+	window.addEventListener('pointerdown', note, { capture: true, passive: true });
+}
+
+/** 'free' | 'locked' — the scene's play cursor, publishers included. Readable in the
+ * editor too (it is authored data), so the Inspector can show it. @returns {'free'|'locked'} */
+export function playCursorSetting() {
+	return resolvePlaySettings(get(globalScene)).cursor === 'free' ? 'free' : 'locked';
+}
+
+/** Is play running with a FREE cursor right now? Desktop play only: a headset has no
+ * cursor to free, and outside play there is no aim at all. */
+export function playCursorFree() {
+	if (get(isLocked) !== true || get(isVRMode)) return false;
+	return playCursorSetting() === 'free';
+}
+
+/** The last cursor position in client pixels, or null before the first pointer event. */
+export function cursorClient() {
+	return cursor.seen ? { x: cursor.x, y: cursor.y } : null;
+}
+
+/**
+ * WHERE PLAY MODE AIMS, in NDC: the cursor in free-cursor play (the centre until the first
+ * pointer event), the crosshair (0, 0) otherwise.
+ * @returns {{x: number, y: number}}
+ */
+export function playAimNdc() {
+	if (!playCursorFree() || !cursor.seen) return { x: 0, y: 0 };
+	return ndcFromClient(cursor.x, cursor.y);
+}
+
+/** test/debug view */
+export function playCursorDebug() {
+	return { setting: playCursorSetting(), free: playCursorFree(), cursor: cursorClient(), ndc: playAimNdc() };
+}
diff --git a/src/lib/playInteract.js b/src/lib/playInteract.js
index 88102534..baf66577 100644
--- a/src/lib/playInteract.js
+++ b/src/lib/playInteract.js
@@ -1,6 +1,6 @@
 import * as THREE from 'three';
 import { writable, get } from 'svelte/store';
-import { isLocked, isVRMode, playPointerFree, objectsGroup, globalScene, lockedObjects, pokeScene } from '../stores/sceneStore';
+import { isLocked, isVRMode, playPointerFree, objectsGroup, globalScene, lockedObjects, pokeScene, editorMode } from '../stores/sceneStore';
 import { peers } from '../stores/appStore';
 import { sceneHits } from './scenePick';
 import { topLevelObjectOf } from './objectActions';
@@ -13,11 +13,14 @@ import {
 	remoteSimulating,
 	isInitiator
 } from './physics';
-import { suspendAnimation, resumeAnimation, fireObjectClick } from './flowRuntime';
+import { suspendAnimation, resumeAnimation, fireObjectClick, fireObjectGrab } from './flowRuntime';
 import { velocityFromSamples } from './throwVelocity';
 import { resolvePlaySettings } from './playSettings';
+import { pickStack, primaryIndex } from './selectThrough';
 import { nameOf } from './lockControl';
-import { moduleClickHandlers, moduleInteractiveGroups, fireClickMiss } from './moduleSDK';
+import { moduleInteractiveGroups, fireClickMiss, runClickHandlers } from './moduleSDK';
+// 30 P3: where play mode aims — the crosshair under a lock, the cursor in a free-cursor game
+import { playAimNdc, playCursorFree } from './playCursor';
 
 // 21-B B3: play mode becomes INTERACT mode — a crosshair grab at distance,
 // scroll to push and pull, and a release that throws with the velocity you
@@ -76,9 +79,14 @@ const yawQuat = new THREE.Quaternion();
 const desiredQuat = new THREE.Quaternion();
 const euler = new THREE.Euler(0, 0, 0, 'YXZ');
 
-/** @type {{object: any, relQuat: THREE.Quaternion, mass: number, held: boolean,
- *   samples: {t: number, pos: THREE.Vector3, quat: THREE.Quaternion}[], lastSent: number}|null} */
+/** `cursor`: 30 P1 — the carry follows the editor's CURSOR ray (Interact), not the
+ * crosshair. Everything else about the hold is the play-mode hold, unforked.
+ * @type {{object: any, relQuat: THREE.Quaternion, mass: number, held: boolean,
+ *   samples: {t: number, pos: THREE.Vector3, quat: THREE.Quaternion}[], lastSent: number,
+ *   cursor?: boolean}|null} */
 let grab = null;
+/** 30 P1: the cursor's NDC while an Interact carry runs (fed by Scene's pointermove) */
+const cursorNdc = new THREE.Vector2();
 let carryDistance = CARRY_DEFAULT;
 /** @type {{t: number, uuid: string|null, hit: any}|null} */ let press = null;
 let started = false;
@@ -113,8 +121,13 @@ function dynamicUuids() {
 /** @param {any} camera */
 function aimFrom(camera) {
 	camera.getWorldPosition(camPos);
-	camera.getWorldDirection(camDir);
+	// 30 P3: the aim is the crosshair (NDC 0,0) under a lock and the CURSOR in a
+	// free-cursor game; `camDir` then follows the ray rather than the view axis, which is
+	// what makes a carried object follow the cursor
+	const aim = playAimNdc();
+	centre.set(aim.x, aim.y);
 	raycaster.setFromCamera(centre, camera);
+	camDir.copy(raycaster.ray.direction);
 	return sceneHits(raycaster, {}); // no tinyProxies: a proxy carries no `face`
 	// and is a SELECTION affordance — grabbing an invisible speck is not a feature
 }
@@ -134,6 +147,89 @@ function moduleTap() {
 	return false;
 }
 
+// --- 30 P1: INTERACT, the editor's play-style mode ----------------------------------
+// The editor's second click mode borrows play's hands without play's lock: the cursor
+// aims (not the crosshair), a press on a dynamic body while a sim runs CARRIES it with the
+// exact hold above, and a short click is play's TAP — module groups, module handlers
+// registered for 'interact', On Click nodes, the miss. Scene owns the canvas events and
+// calls in here, because the editor's own gestures (sessions, pings, pins) sit in front.
+
+/** Is the editor in INTERACT right now (outside play and VR)? */
+export function editorInteractActive() {
+	return get(editorMode) === 'interact' && get(isLocked) !== true && !get(isVRMode);
+}
+
+/**
+ * A press in Interact. Starts a cursor carry when the ray's first hit is a dynamic body
+ * of a running sim that nobody else holds; returns whether it did (Scene then stands the
+ * camera controls down for the gesture, or lets the press orbit as usual).
+ * @param {any} ray a THREE.Raycaster aimed through the cursor
+ * @param {{x: number, y: number}} ndc the cursor in NDC
+ * @param {any} camera
+ */
+export function cursorGrabStart(ray, ndc, camera) {
+	if (!editorInteractActive() || grab || !camera || !simRunning()) return false;
+	const hit = sceneHits(ray, {})[0];
+	const target = hit ? topLevelObjectOf(hit.object) : null;
+	if (!target || !dynamicUuids().has(target.uuid)) return false;
+	if (get(lockedObjects).some((/** @type {any} */ entry) => entry[1] === target.uuid)) return false;
+	if (!canEditObject(target)) {
+		warnViewerReadOnly();
+		return false;
+	}
+	activeCamera = camera;
+	cursorNdc.set(ndc.x, ndc.y);
+	camera.getWorldPosition(camPos);
+	beginGrab(target, camera);
+	// (TS narrowed `grab` to null at the guard above; beginGrab assigned it since)
+	const started = /** @type {any} */ (grab);
+	if (started) started.cursor = true;
+	return !!started;
+}
+
+/** The cursor moved while carrying. @param {{x: number, y: number}} ndc */
+export function cursorGrabMove(ndc) {
+	if (grab?.cursor) cursorNdc.set(ndc.x, ndc.y);
+}
+
+/** Release: a throw, like play's. @returns {boolean} whether a cursor carry ended */
+export function cursorGrabEnd() {
+	if (!grab?.cursor) return false;
+	endGrab(true);
+	return true;
+}
+
+/**
+ * A short click in Interact: play's tap, aimed by the cursor. Module scene-root groups
+ * first (as the editor pick always did), then the first scene hit offered to the module
+ * handlers that run in 'interact', then its On Click nodes; a click on nothing is the miss.
+ * Selects nothing, ever.
+ * @param {any} ray a THREE.Raycaster aimed through the cursor
+ * @returns {'module-group' | 'module-handler' | 'click' | 'miss'}
+ */
+export function interactClick(ray) {
+	const scene = /** @type {any} */ (get(globalScene));
+	for (const name of moduleInteractiveGroups) {
+		const root = scene?.getObjectByName(name);
+		if (!root) continue;
+		const hits = ray.intersectObject(root, true);
+		if (hits.length > 0 && runClickHandlers(hits[0].object, 'interact')) return 'module-group';
+	}
+	// 30 P2: the same see-through rule as the editor's pick — a 0.12-opacity wall in
+	// front of a star must not take the star's click here either
+	const stack = pickStack(sceneHits(ray, { tinyProxies: true }), topLevelObjectOf);
+	const entry = stack.length ? stack[primaryIndex(stack)] : null;
+	const hit = entry?.hit ?? null;
+	if (hit && runClickHandlers(hit.object, 'interact')) return 'module-handler';
+	const target = entry?.target ?? null;
+	if (target) {
+		fireObjectClick(target.uuid);
+		return 'click';
+	}
+	fireClickMiss();
+	return 'miss';
+}
+
 /** @param {any} object */
 function massOf(object) {
 	const mass = object?.userData?.physics?.mass;
@@ -160,6 +256,8 @@ function beginGrab(object, camera) {
 	);
 	suspendAnimation(object.uuid);
 	playInteractState.set({ mode: 'carrying', distance: carryDistance, uuid: object.uuid, blocked: null });
+	// 30b (core-games): an On Grab node hears it (a crate's lift sound in Towers)
+	fireObjectGrab(object.uuid);
 }
 
 /**
@@ -218,6 +316,11 @@ function sendThrow(object, velocity, throwIt) {
 /** @param {PointerEvent} event */
 function onPointerDown(event) {
 	if (event.button !== 0) return;
+	// 30 P3: with a FREE cursor a press anywhere on the page reaches this window listener —
+	// a HUD button, a toast, the ✕ — so only a press on the VIEWPORT is a world gesture.
+	// Under a lock the target is the locked canvas anyway, which is why this is scoped to
+	// free mode (a synthesized window-level press keeps working there, as it always has).
+	if (playCursorFree() && !isViewportTarget(event)) return;
 	const mode = interactionMode();
 	if (mode === 'off' || !activeCamera) return;
 	const hits = aimFrom(activeCamera);
@@ -245,6 +348,13 @@ function onPointerDown(event) {
 	beginGrab(target, activeCamera);
 }
 
+/** Is this event aimed at the 3D viewport (the renderer's canvas)? @param {Event} event */
+function isViewportTarget(event) {
+	/** @type {any} */
+	const target = event.target;
+	return !!target && target.tagName === 'CANVAS' && !!target.closest?.('.viewport');
+}
+
 /** @param {PointerEvent} event */
 function onPointerUp(event) {
 	if (event.button !== 0) return;
@@ -321,7 +431,15 @@ function onWheel(event) {
  */
 export function tickPlayInteract(delta, camera) {
 	activeCamera = camera ?? activeCamera;
-	const mode = interactionMode();
+	// 30 P1: an Interact carry lives OUTSIDE play, so play's 'off' must not cancel it —
+	// leaving Interact (or entering play/VR) is what ends it, through the same
+	// zero-velocity cancel every other path uses
+	const cursorCarry = !!grab?.cursor;
+	if (cursorCarry && (!editorInteractActive() || !camera)) {
+		endGrab(false);
+		return;
+	}
+	const mode = cursorCarry ? 'grab' : interactionMode();
 	if (mode === 'off' || !camera) {
 		if (grab) endGrab(false);
 		if (get(playInteractState).mode !== 'off')
@@ -337,8 +455,19 @@ export function tickPlayInteract(delta, camera) {
 			endGrab(false);
 			return;
 		}
-		camera.getWorldPosition(camPos);
-		camera.getWorldDirection(camDir);
+		if (grab.cursor) {
+			// the same carry point, along the CURSOR's ray instead of the view axis
+			raycaster.setFromCamera(cursorNdc, camera);
+			camPos.copy(raycaster.ray.origin);
+			camDir.copy(raycaster.ray.direction);
+		} else {
+			camera.getWorldPosition(camPos);
+			// 30 P3: along the AIM ray, so a free-cursor carry follows the cursor
+			const aim = playAimNdc();
+			centre.set(aim.x, aim.y);
+			raycaster.setFromCamera(centre, camera);
+			camDir.copy(raycaster.ray.direction);
+		}
 		targetPos.copy(camPos).addScaledVector(camDir, carryDistance);
 		// dt-based, so a throttled tab does not change the feel
 		const k = Math.min(SPRING_K_MAX, Math.max(SPRING_K_MIN, SPRING_K / Math.sqrt(Math.max(grab.mass, 1))));
@@ -438,6 +567,7 @@ export function playInteractDebug() {
 		started,
 		mode: interactionMode(),
 		carrying: grab?.object?.uuid ?? null,
+		cursor: !!grab?.cursor,
 		held: !!grab?.held,
 		distance: carryDistance,
 		lastUp,
diff --git a/src/lib/playMode.js b/src/lib/playMode.js
index 6f573a36..a19f886b 100644
--- a/src/lib/playMode.js
+++ b/src/lib/playMode.js
@@ -3,6 +3,12 @@ import { isLocked, isVRMode, vrOverride, vrPassthrough } from '../stores/sceneSt
 // appStore is a LEAF (svelte/store and nothing else — sceneStore already pulls in more
 // than it does), so this does not widen the cycle surface the note below is about.
 import { showToast } from '../stores/appStore';
+// 30 P0: the back-button marker goes through SvelteKit's shallow-routing entry, not a raw
+// `history.pushState` — the router patches the raw call in dev with a "will conflict with
+// SvelteKit's router" warning, and it is right: its own popstate handler reads the index
+// keys only ITS pushState writes. `$app/navigation` is SSR-safe to IMPORT (only a CALL on
+// the server throws, and the marker is only ever pushed from a browser play press).
+import { pushState } from '$app/navigation';
 
 // THE PLAY STATE MACHINE, lifted out of Controls.svelte so the play FAB, the FAB's
 // right-click mode menu and (next) a keyboard shortcut all press the same button.
@@ -154,20 +160,38 @@ export function exitPlay() {
 // no history to go back to, pushing and popping our own entry is invisible.
 //
 // It is safe to pop because the marker is ALWAYS the top entry when we hold one: this
-// app keeps no state in the URL and nothing else in it calls pushState (grep), so
-// there is no router to fight and nothing of the user's can be underneath ours. The
-// flag is the whole guard — see `consumePlayMarker` for the double-pop it prevents.
+// app keeps no state in the URL and nothing else in it pushes history entries (grep), so
+// nothing of the user's can be underneath ours. The flag is the whole guard — see
+// `consumePlayMarker` for the double-pop it prevents.
+//
+// 30 P0: the entry is a SvelteKit SHALLOW entry (`pushState` from $app/navigation) —
+// same url, same navigation index, so the router's popstate handler treats the Back
+// that spends it as a state change and never navigates; our listener below still sees
+// the popstate. The state object lands under the router's `sveltekit:states` key, which
+// is where `playMarkerState()` reads it.
 let backMarker = false;
 
 function pushPlayMarker() {
 	if (backMarker || typeof history === 'undefined') return;
 	try {
-		// the SAME url with a state object: no navigation, nothing for a router to
-		// resolve, and `history.state.tpPlay` is a readable answer to "is the marker up?"
-		history.pushState({ tpPlay: true }, '');
+		// the SAME url ('' resolves to the current one) with a state object: no
+		// navigation, nothing to load, and `playMarkerState()` is a readable answer to
+		// "is the marker up?"
+		pushState('', { tpPlay: true });
 		backMarker = true;
 	} catch {
-		/* a sandboxed frame can refuse pushState; play simply keeps its normal exits */
+		/* a sandboxed frame can refuse pushState (and the router refuses before it has
+		   started); play simply keeps its normal exits */
+	}
+}
+
+/** the marker's state object as the router stored it on the CURRENT entry (test/debug view) */
+export function playMarkerState() {
+	try {
+		const st = /** @type {any} */ (typeof history === 'undefined' ? null : history.state);
+		return !!st?.['sveltekit:states']?.tpPlay;
+	} catch {
+		return false;
 	}
 }
 
diff --git a/src/lib/playSettings.js b/src/lib/playSettings.js
index 57784b0d..973aed71 100644
--- a/src/lib/playSettings.js
+++ b/src/lib/playSettings.js
@@ -1,6 +1,29 @@
-import { get } from 'svelte/store';
+import { get, writable } from 'svelte/store';
 import { scenePlay } from './scenePhysics';
 import { showToast } from '../stores/appStore';
+import { normalizeLocomotion, normalizeSpawn } from './locomotionPolicy';
+import { moduleWorldChildren } from './moduleWorld';
+
+/**
+ * 30b P4: a spawn point set at RUNTIME by a module (`api.setSpawn(position, yaw)`) — a
+ * dungeon's floor, a level's start. LOCAL (every peer's module runs the same code off the
+ * same replicated state, so each sets its own), never saved, and it wins over the scene's
+ * authored `play.spawn` (contract C1: a module overrides the scene's).
+ * @type {import('svelte/store').Writable<{position: [number, number, number], yaw: number, owner?: string} | null>}
+ */
+export const runtimeSpawn = writable(null);
+
+/** @param {any} position @param {any} [yaw] @param {string} [owner] @returns {boolean} */
+export function setRuntimeSpawn(position, yaw, owner) {
+	if (position == null) {
+		runtimeSpawn.set(null);
+		return true;
+	}
+	const spawn = normalizeSpawn(position, yaw);
+	if (!spawn) return false;
+	runtimeSpawn.set(owner ? { ...spawn, owner } : spawn);
+	return true;
+}
 
 // 21-B B3: what play mode BEHAVES like in this scene.
 //
@@ -28,7 +51,10 @@ let warnedMultiple = false;
  */
 export function playPublishers(scene) {
 	if (!scene?.children) return [];
-	const found = scene.children.filter((/** @type {any} */ child) => child?.userData?.play);
+	// 30b P5: registered module groups live under the world rig's module root now
+	const found = [...scene.children, ...moduleWorldChildren()].filter(
+		(/** @type {any} */ child) => child?.userData?.play
+	);
 	found.sort((/** @type {any} */ a, /** @type {any} */ b) => {
 		if (a.name === 'dungeon-module') return -1;
 		if (b.name === 'dungeon-module') return 1;
@@ -41,7 +67,15 @@ export function playPublishers(scene) {
  * The effective play settings: the scene's shared `play` block, overridden
  * FIELD BY FIELD by each publisher (a module only overrides what it declares).
  * @param {any} scene
- * @returns {{interaction: 'grab'|'click'|'off', grounded: boolean, eyeHeight: number}}
+ * 30 P3: `cursor` too — 'free' (the real cursor aims, no pointer lock) or 'locked' (the
+ * crosshair, today). A module publishing `userData.play.cursor` overrides the scene's, the
+ * way `grounded` does, which is how a board-game module asks for it without an authored
+ * scene field.
+ * 30b P3/P4: `locomotion` ({teleport, fly}, both false unless the scene or a publisher
+ * allows them — field by field, like `grounded`) and `spawn` (the runtime api.setSpawn,
+ * else a publisher's `userData.play.spawn`, else the scene's `play.spawn`, else null).
+ * @returns {{interaction: 'grab'|'click'|'off', grounded: boolean, eyeHeight: number, cursor: 'free'|'locked',
+ *   locomotion: {teleport: boolean, fly: boolean}, spawn: {position: [number, number, number], yaw: number} | null}}
  */
 export function resolvePlaySettings(scene) {
 	const base = get(scenePlay);
@@ -49,8 +83,13 @@ export function resolvePlaySettings(scene) {
 	const out = {
 		interaction: base.interaction,
 		grounded: base.grounded,
-		eyeHeight: DEFAULT_EYE_HEIGHT
+		eyeHeight: DEFAULT_EYE_HEIGHT,
+		cursor: base.cursor === 'free' ? 'free' : 'locked',
+		locomotion: { teleport: false, fly: false },
+		spawn: normalizeSpawn(base.spawn)
 	};
+	const baseLoco = normalizeLocomotion(base.locomotion);
+	if (baseLoco) Object.assign(out.locomotion, baseLoco);
 	const publishers = playPublishers(scene);
 	if (publishers.length > 1 && !warnedMultiple) {
 		warnedMultiple = true;
@@ -67,7 +106,14 @@ export function resolvePlaySettings(scene) {
 			out.interaction = play.interaction;
 		if (typeof play.grounded === 'boolean') out.grounded = play.grounded;
 		if (typeof play.eyeHeight === 'number') out.eyeHeight = play.eyeHeight;
+		if (play.cursor === 'free' || play.cursor === 'locked') out.cursor = play.cursor;
+		const loco = normalizeLocomotion(play.locomotion);
+		if (loco) Object.assign(out.locomotion, loco);
+		const spawn = normalizeSpawn(play.spawn);
+		if (spawn) out.spawn = spawn;
 	}
+	const runtime = get(runtimeSpawn);
+	if (runtime) out.spawn = { position: runtime.position, yaw: runtime.yaw };
 	return out;
 }
 
diff --git a/src/lib/playSpawn.js b/src/lib/playSpawn.js
new file mode 100644
index 00000000..f6263635
--- /dev/null
+++ b/src/lib/playSpawn.js
@@ -0,0 +1,62 @@
+// 30b P4: THE DESKTOP HALF OF A SPAWN — a LEAF (THREE + svelte/store + sceneStore +
+// playSettings), so PointerLockControls, objectActions and moduleSDK can all reach it
+// without closing a cycle. The VR half lives in vrControls.spawnPlayer (it moves the XR
+// reference space, which only vrControls holds).
+//
+// A spawn is `{position: [x, y, z], yaw}` — y is the FEET, yaw is three's rotation.y (0 faces
+// -Z) — resolved by playSettings.resolvePlaySettings: a module's runtime api.setSpawn, else
+// a publisher's userData.play.spawn, else the scene's play.spawn.
+import * as THREE from 'three';
+import { get } from 'svelte/store';
+import { playerCam } from '../stores/sceneStore';
+import { resolvePlaySettings } from './playSettings';
+import { globalScene } from '../stores/sceneStore';
+
+/** the play camera's eye above the feet: the walker's 1.7 m person */
+export const SPAWN_EYE = 1.7;
+
+/** the spawn in force right now, or null @returns {{position: [number, number, number], yaw: number} | null} */
+export function currentSpawn() {
+	return resolvePlaySettings(get(globalScene)).spawn;
+}
+
+/** the spawn a DESKTOP view honours — the one in force unless it is VR-only (30b core-games)
+ * @returns {{position: [number, number, number], yaw: number} | null} */
+export function desktopSpawn() {
+	const spawn = currentSpawn();
+	return spawn && !(/** @type {any} */ (spawn).vrOnly) ? spawn : null;
+}
+
+/**
+ * Where an EYE stands on a spawn, and a point straight ahead of it at eye height (what
+ * flyTo and lookAt want). Pure. @param {{position: number[], yaw: number}} spawn
+ */
+export function spawnEyePose(spawn) {
+	const [x, y, z] = spawn.position;
+	const eye = [x, y + SPAWN_EYE, z];
+	const lookAt = [x - Math.sin(spawn.yaw) * 2, y + SPAWN_EYE, z - Math.cos(spawn.yaw) * 2];
+	return { eye, lookAt };
+}
+
+/**
+ * Put desktop Play's camera on the spawn: eye at feet + SPAWN_EYE, facing its yaw, level.
+ * PointerLockControls derives yaw/pitch from the camera's quaternion every look, so writing
+ * the quaternion is the whole of "face this way".
+ * @param {{position: number[], yaw: number} | null} [spawn] defaults to the one in force
+ * @returns {boolean} whether the camera moved
+ */
+export function spawnDesktopPlayer(spawn = desktopSpawn()) {
+	/** @type {any} */
+	const cam = get(playerCam);
+	if (!spawn || !cam?.isObject3D) return false;
+	const { eye } = spawnEyePose(spawn);
+	const target = new THREE.Vector3(eye[0], eye[1], eye[2]);
+	if (cam.parent) {
+		cam.parent.updateWorldMatrix(true, false);
+		cam.parent.worldToLocal(target);
+	}
+	cam.position.copy(target);
+	cam.quaternion.setFromEuler(new THREE.Euler(0, spawn.yaw, 0, 'YXZ'));
+	cam.updateMatrixWorld(true);
+	return true;
+}
diff --git a/src/lib/scenePhysics.js b/src/lib/scenePhysics.js
index 8992b6c7..43491845 100644
--- a/src/lib/scenePhysics.js
+++ b/src/lib/scenePhysics.js
@@ -1,6 +1,7 @@
 import { writable, derived, get } from 'svelte/store';
 import { sessionNow } from './sessionClock'; // 25-E: stamps another peer compares
 import { peers } from '../stores/appStore';
+import { normalizeLocomotion, normalizeSpawn } from './locomotionPolicy'; // 30b P3/P4
 
 // CL-A A6 / 21-B B1: scene-wide physics settings. ONE shared object for the
 // whole session, replicated as its OWN latest-wins singleton message (the
@@ -43,6 +44,10 @@ export const DEFAULT_SCENE_PHYSICS = Object.freeze({
 });
 
 const BOUNDS_ACTIONS = ['freeze', 'respawn', 'delete'];
+// 30 P3: the play cursor. 'locked' (the crosshair under pointer lock) is the default and
+// is NEVER written — a normalized play block carries `cursor` only when it is 'free' — so
+// every scene saved before this, and every scene that does not use it, stays byte-identical.
+const PLAY_CURSORS = ['free', 'locked'];
 const INTERACTIONS = ['grab', 'click', 'off'];
 
 /** @param {any} v @param {number} lo @param {number} hi @param {number} fallback */
@@ -61,6 +66,12 @@ function nullableNum(v, lo, hi) {
 	return Math.max(lo, Math.min(hi, n));
 }
 
+/** `{[key]: value}` when there is a value, `{}` when not — for fields that are ABSENT at
+ * their default. @param {string} key @param {any} value */
+function optional(key, value) {
+	return value == null ? {} : { [key]: value };
+}
+
 /** @param {any} v @param {boolean} fallback */
 function bool(v, fallback) {
 	return typeof v === 'boolean' ? v : fallback;
@@ -142,9 +153,15 @@ export function normalizeScenePhysics(raw) {
 			{
 				interaction: pick(playRaw.interaction, INTERACTIONS, d.play.interaction),
 				grounded: bool(playRaw.grounded, d.play.grounded),
-				simOnPlay: bool(playRaw.simOnPlay, d.play.simOnPlay)
+				simOnPlay: bool(playRaw.simOnPlay, d.play.simOnPlay),
+				// 30 P3: present only when free (see PLAY_CURSORS)
+				...(pick(playRaw.cursor, PLAY_CURSORS, 'locked') === 'free' ? { cursor: 'free' } : {}),
+				// 30b P3/P4: present only when authored (locomotionPolicy's normalizers), so a
+				// scene that never used them stays byte-identical
+				...optional('locomotion', normalizeLocomotion(playRaw.locomotion)),
+				...optional('spawn', normalizeSpawn(playRaw.spawn))
 			},
-			['interaction', 'grounded', 'simOnPlay']
+			['interaction', 'grounded', 'simOnPlay', 'cursor', 'locomotion', 'spawn']
 		),
 		// A1: the 20 ceiling is throwVelocity's MAX_LINVEL, restated rather than imported —
 		// this module is store-only and the response clamps through clampThrow anyway
@@ -189,7 +206,7 @@ scenePhysicsState_.subscribe((s) => sceneGravity.set(s.gravity));
 export const scenePhysicsGround = derived(scenePhysicsState_, (s) => s.ground);
 /** out-of-bounds config. NOT named `sceneBounds` — that is sceneBounds.js */
 export const scenePhysicsBounds = derived(scenePhysicsState_, (s) => s.bounds);
-/** play-mode block ({interaction, grounded, simOnPlay}) */
+/** play-mode block ({interaction, grounded, simOnPlay, cursor?: 'free', spawn?: {position, yaw}}) */
 export const scenePlay = derived(scenePhysicsState_, (s) => s.play);
 /** A1: the knock block ({enabled, gain, maxSpeed, minSpeed, radius, spin, predict}) */
 export const sceneKnock = derived(scenePhysicsState_, (s) => s.knock);
diff --git a/src/lib/selectThrough.js b/src/lib/selectThrough.js
new file mode 100644
index 00000000..6989413d
--- /dev/null
+++ b/src/lib/selectThrough.js
@@ -0,0 +1,135 @@
+// 30 P2: SELECT-THROUGH and CLICK-CYCLE — the pure part. Imports NOTHING (the
+// objectListNav / inputDevice shape), so the editor pick, the suite and vitest share it.
+//
+// Two measured reasons it exists (roadmap 30, "Selection and the object list"):
+//  - a near-invisible SHELL wins the nearest-hit pick. Stars Room's 0.12-opacity walls
+//    took every click on a star, a pad or a planet (16 of 16 selected "Wall south"),
+//    and Football's 0.06 ceiling ate the lamps and the bars.
+//  - with nothing but the nearest hit there was no way at all to reach what sits
+//    BEHIND an opaque object, short of the object list.
+//
+// So a plain click prefers the first OPAQUE target down the ray, and a REPEATED click on
+// the same spot walks down the stack (the DCC convention: Blender and Maya both cycle).
+//
+// THE TIMING IS A DECISION, and it deviates from the plan's "< 600 ms": the editor's
+// double-click (15-O / 85's configurable action) is a second click on the SAME object
+// inside 400 ms, so a cycle inside that window would hand the second click to the object
+// behind and double-click-to-open-properties would die wherever anything sits behind the
+// cursor, i.e. almost everywhere. A repeat therefore cycles from the END of the
+// double-click window, and 600 ms would leave a 200 ms window nobody can hit on purpose.
+
+/** below this effective opacity a surface is glass, not a thing to click */
+export const SEE_THROUGH_OPACITY = 0.25;
+/** how far (css px) a second click may land from the first and still be "the same spot" */
+export const CYCLE_SLOP_PX = 4;
+/** the editor's double-click window (raycastSelect's lastPick) — a repeat inside it is a double-click */
+export const DOUBLE_CLICK_MS = 400;
+/** after this, a click on the same spot is a fresh pick again, not "the next one down" */
+export const CYCLE_WINDOW_MS = 1500;
+
+/**
+ * The effective opacity of the surface a raycast hit landed on: the material of the
+ * hit's own FACE on a multi-material mesh, 0 for a material switched off.
+ * @param {any} hit
+ * @returns {number}
+ */
+export function hitOpacity(hit) {
+	const object = hit?.object;
+	if (!object) return 1;
+	let material = object.material;
+	if (Array.isArray(material)) {
+		const index = hit.face?.materialIndex ?? 0;
+		material = material[index] ?? material[0];
+	}
+	if (!material) return 1;
+	if (material.visible === false) return 0;
+	if (material.transparent && typeof material.opacity === 'number') return material.opacity;
+	return 1;
+}
+
+/**
+ * Is this hit something a click should pass through to whatever is behind it?
+ * The flag on the TOP-LEVEL object wins (a template marks its walls and ceilings
+ * `userData.pick = 'through'` whatever their opacity), then the surface's own opacity,
+ * then a hidden node on the way up (three's raycaster does not test `visible`).
+ * @param {any} hit @param {any} target the hit's top-level object
+ */
+export function isSeeThrough(hit, target) {
+	if (target?.userData?.pick === 'through') return true;
+	if (hitOpacity(hit) < SEE_THROUGH_OPACITY) return true;
+	for (let node = hit?.object; node; node = node.parent) {
+		if (node.visible === false) return true;
+		if (node === target) break;
+	}
+	return false;
+}
+
+/**
+ * @typedef {{ uuid: string, target: any, hit: any, through: boolean }} StackEntry
+ */
+
+/**
+ * Collapse raw hits (nearest first) into the STACK of distinct top-level targets.
+ * A target counts as opaque if ANY of its hits is — a glass case around a solid core
+ * is a thing you can click, the core is just behind its own glass.
+ * @param {any[]} hits
+ * @param {(object: any) => any} topOf resolves a hit mesh to its top-level object (null = skip)
+ * @returns {StackEntry[]}
+ */
+export function pickStack(hits, topOf) {
+	/** @type {StackEntry[]} */
+	const stack = [];
+	/** @type {Map<string, number>} */
+	const at = new Map();
+	for (const hit of hits ?? []) {
+		const target = topOf(hit.object);
+		if (!target) continue;
+		const through = isSeeThrough(hit, target);
+		const index = at.get(target.uuid);
+		if (index === undefined) {
+			at.set(target.uuid, stack.length);
+			stack.push({ uuid: target.uuid, target, hit, through });
+		} else if (stack[index].through && !through) {
+			stack[index].through = false;
+		}
+	}
+	return stack;
+}
+
+/** The entry a plain click selects: the first opaque target, else the nearest.
+ * @param {StackEntry[]} stack */
+export function primaryIndex(stack) {
+	const index = stack.findIndex((entry) => !entry.through);
+	return index < 0 ? 0 : index;
+}
+
+/**
+ * Is `click` a deliberate repeat of `last` — the same spot, after the double-click window
+ * and before the cycle window closes?
+ * @param {{x: number, y: number, t: number}} click
+ * @param {{x: number, y: number, t: number} | null | undefined} last
+ */
+export function isRepeatClick(click, last) {
+	if (!last) return false;
+	const dt = click.t - last.t;
+	if (!(dt >= DOUBLE_CLICK_MS && dt <= CYCLE_WINDOW_MS)) return false;
+	return Math.hypot(click.x - last.x, click.y - last.y) <= CYCLE_SLOP_PX;
+}
+
+/**
+ * Which stack entry this click selects. A repeat of the last click whose pick is still in
+ * the stack takes the NEXT entry down (wrapping, so the see-through shell in front is
+ * reachable too); anything else takes the primary.
+ * @param {StackEntry[]} stack
+ * @param {{x: number, y: number, t: number}} click
+ * @param {{x: number, y: number, t: number, uuid: string | null} | null | undefined} last
+ * @returns {{index: number, cycled: boolean}} index -1 = nothing to pick
+ */
+export function chooseInStack(stack, click, last) {
+	if (!stack.length) return { index: -1, cycled: false };
+	const primary = primaryIndex(stack);
+	if (!last?.uuid || !isRepeatClick(click, last)) return { index: primary, cycled: false };
+	const current = stack.findIndex((entry) => entry.uuid === last.uuid);
+	if (current < 0) return { index: primary, cycled: false };
+	return { index: (current + 1) % stack.length, cycled: stack.length > 1 };
+}
diff --git a/src/lib/sessions.js b/src/lib/sessions.js
index 4dfc1f4c..10fa8db0 100644
--- a/src/lib/sessions.js
+++ b/src/lib/sessions.js
@@ -6,6 +6,7 @@ import { serializeGraphs, copyGraphFrom } from './flowGraphs';
 import { serializeNode, serializeEdge, sendNodes } from './nodesHandler';
 import { parkAnimatedAtBase } from './flowRuntime';
 import { stripEditOverlays } from './editOverlays';
+import { isPristinePackRef, stubElementOf, stubNodeCount } from './packRefs';
 // B7: a spawner's copies exist only while the world runs — never in a scene file
 import { isTransient } from './transientObjects';
 import {
@@ -263,7 +264,9 @@ export function buildSessionPayload(name) {
 				// scene file as permanent content
 				objects: (group?.children ?? [])
 					.filter((/** @type {any} */ child) => !animatedUuids.includes(child.uuid) && !isTransient(child))
-					.map((/** @type {any} */ child) => child.toJSON()),
+					// 30c: a pristine KIT PIECE is written as a stub its pack refills (packRefs.js
+					// has the measurement: one wall is 7.9 MB as toJSON)
+					.map((/** @type {any} */ child) => (isPristinePackRef(child) ? stubElementOf(child) : child.toJSON())),
 				animated: animatedImportsSnapshot(group),
 				// authored movement tracks (the Animation window) were never saved
 				animations: animationsSnapshot(),
@@ -356,7 +359,7 @@ export function buildSelectionPayload(name, uuids) {
 		const objects = roots
 			.map((uuid) => group?.getObjectByProperty('uuid', uuid))
 			.filter((/** @type {any} */ object) => object && !animatedUuids.includes(object.uuid) && !isTransient(object))
-			.map((/** @type {any} */ object) => object.toJSON());
+			.map((/** @type {any} */ object) => (isPristinePackRef(object) ? stubElementOf(object) : object.toJSON()));
 		const clips = animationsSnapshot();
 		/** @type {any} */
 		const animations = {};
@@ -1201,6 +1204,9 @@ export function importObjects(payload, indices) {
 			uuidMap.set(node.uuid, fresh);
 			node.uuid = fresh;
 		});
+		// 30c: a kit-piece stub refills its children under the RECORDED uuids — which are
+		// the file's, and this import is a merge; let the refill derive fresh ones
+		if (object.userData?.packStub && object.userData.packRef) object.userData.packRef.kids = [];
 		group.add(object);
 		recordObjectPresence('create', object);
 		if (peer) peer.send({ type: 'object', element: object.toJSON() });
@@ -1301,6 +1307,18 @@ export async function applySession(payload, opts = {}) {
 		const restored = await restoreSessionLibrary(payload);
 		if (restored) showToast('Restored ' + restored + ' library file' + (restored === 1 ? '' : 's'));
 	}
+	// 30c: a scene REPLACE ends the run. The physics world holds bodies for the objects
+	// about to be wiped and none for the ones arriving, and sim-on-play skips a start while
+	// `simulating` is still true — so after playing one level, the next one loaded was
+	// walked THROUGH (measured: the walker crossed the tavern's walls and stairs as if they
+	// were not there). Stopped the quiet way a yielded run stops (no settling moves, no
+	// undo entry for a layout that is being thrown away); the next Play builds a new world.
+	try {
+		const physics = await import('./physics');
+		if (get(physics.simulating)) physics.stopSimulation({ yielded: true });
+	} catch {
+		/* physics failing to load must never block a scene load */
+	}
 	if (replicate) sceneCommand('/clear all'); // replicated clear (objects + module content)
 	else clearSceneLocal();
 	/** @type {any} */
@@ -1436,6 +1454,8 @@ export function countPayloadObjects(payload) {
 	const walk = (node) => {
 		if (!node) return;
 		n++;
+		// 30c: a kit-piece stub stands for the nodes it refills to
+		n += stubNodeCount(node);
 		for (const kid of node.children ?? []) walk(kid);
 	};
 	for (const element of payload?.objects ?? []) {
diff --git a/src/lib/shortcuts.js b/src/lib/shortcuts.js
index d871b61b..8a770537 100644
--- a/src/lib/shortcuts.js
+++ b/src/lib/shortcuts.js
@@ -23,7 +23,8 @@ import {
 	setTransformMode,
 	selectAllObjects,
 	clearIsolation,
-	isIsolated
+	isIsolated,
+	toggleEditorMode
 } from './objectActions';
 import { undo, redo } from './history';
 import { editingObject, enterEditMode, exitEditMode } from './meshEdit';
@@ -269,6 +270,18 @@ export const shortcuts = [
 			else if (get(selectedObject)?.uuid) enterEditMode(get(selectedObject).uuid);
 		}
 	},
+	{
+		// 30 P1: Edit / Interact. Free outside a mesh session (I is MESH_EDIT_KEYS' inset
+		// there, which is why the registry already stands down for it); `when` also stands
+		// it down while sculpt, spline or draw own the letter keys (their probes), so a
+		// stray I never flips the mode under a session.
+		id: 'editor.interact-mode',
+		keys: 'I',
+		group: 'Objects',
+		label: 'Edit / Interact mode (Interact: clicks play with the scene instead of selecting)',
+		when: () => !keySessionOpen(),
+		action: () => toggleEditorMode()
+	},
 	{
 		id: 'panels.object-list',
 		keys: 'O',
@@ -633,6 +646,35 @@ function slug(text) {
 		.replace(/^-+|-+$/g, '');
 }
 
+/**
+ * 30 P1: editor SESSIONS that own the plain letter keys register a probe here — sculpt,
+ * spline edit and draw (Scene, which already imports all three) — so a mode key can stand
+ * down while one is open without this module importing them: shortcuts sits inside
+ * history's import family, and splineEdit reaches vrControls, which would close a cycle.
+ * @type {(() => boolean)[]} */
+const keySessionProbes = [];
+
+/** @param {() => boolean} probe @returns {() => void} unregister */
+export function registerKeySessionProbe(probe) {
+	keySessionProbes.push(probe);
+	return () => {
+		const index = keySessionProbes.indexOf(probe);
+		if (index >= 0) keySessionProbes.splice(index, 1);
+	};
+}
+
+/** Is any session holding the letter keys right now (mesh edit included)? */
+export function keySessionOpen() {
+	if (get(editingObject) || get(faceEditObject)) return true;
+	return keySessionProbes.some((probe) => {
+		try {
+			return !!probe();
+		} catch {
+			return false;
+		}
+	});
+}
+
 /**
  * @param {ShortcutInput} shortcut
  */
diff --git a/src/lib/tinyMarkers.js b/src/lib/tinyMarkers.js
index fae5b1ea..8eff110f 100644
--- a/src/lib/tinyMarkers.js
+++ b/src/lib/tinyMarkers.js
@@ -2,6 +2,7 @@
 import * as THREE from 'three';
 import { get } from 'svelte/store';
 import { objectsGroup, globalScene, globalCamera, globalRenderer, selectedObjects } from '../stores/sceneStore';
+import { helpersHidden } from './helperLayer';
 
 // A dot for an object you can no longer see.
 //
@@ -74,6 +75,11 @@ export function updateTinyMarkers() {
 	const renderer = get(globalRenderer);
 	const height = renderer?.domElement?.clientHeight ?? 0;
 	if (!scene || !group || !camera?.isPerspectiveCamera || !height) return;
+	// 30b P1: an aiming aid for the EDITOR — Interact and Play draw no scaffolding
+	if (helpersHidden()) {
+		if (points) points.visible = false;
+		return;
+	}
 
 	/** @type {number[]} */
 	const spots = [];
diff --git a/src/lib/vrControls.js b/src/lib/vrControls.js
index eef68025..0c469a3d 100644
--- a/src/lib/vrControls.js
+++ b/src/lib/vrControls.js
@@ -39,9 +39,18 @@ import {
 	vrToolMode,
 	vrTargetHz,
 	vrSleeveEnabled,
+	editorMode,
 	peerHandStyle, pokeScene } from '../stores/sceneStore';
+import { isScenery, pickGripTarget, gripMovesWorld } from './vrGrip';
+import { resolvePlaySettings, playPublishers } from './playSettings';
+import { hudDocs, isGameHud } from './hudDocs';
+import { locomotionPolicy, vrSpawnOffsets, yawForward } from './locomotionPolicy';
+import { resolveWalk } from './charController';
 import { activeRing, findMenuEntry, ringEntries, sectorFromStick, pushRing, popRing, resetRings, hubEntry } from './vrRadialMenu';
 import { paletteColorAt, barValueAt } from './vrPalette';
+// 30b (vr-play) C4: the ONE game-feel predicate (a leaf) + the pattern shapes (pure)
+import { gameFeelActive } from './gameFeel';
+import { hapticSchedule, knockHapticScale } from './hapticPatterns';
 import { recordMaterialChange, setMaterialParam } from './materialsHandler';
 import { prefabs, instantiatePrefab } from './prefabs';
 import {
@@ -117,17 +126,20 @@ import {
 	focusObject,
 	ungroupObject,
 	applySelectionSet,
-	selectionUuids
+	selectionUuids,
+	setEditorMode,
+	toggleEditorMode
 } from './objectActions';
 import { vrKeyboardTarget, openVRKeyboard, pressVRKey, closeVRKeyboard } from './vrKeyboard';
 import { sceneCommand } from './commandsHandler.svelte';
 import { sendPing, pingColor } from './ping';
 import { peerColor } from './lockControl';
 import { setVRAxes, setVRButtons } from './inputRuntime';
-import { suspendAnimation, resumeAnimation } from './flowRuntime';
+import { suspendAnimation, resumeAnimation, fireObjectGrab } from './flowRuntime';
 import { drawMode, toggleDrawMode, addStrokePoint, endStroke } from './drawMode';
 import { setPttHeld, cycleMicMode, vrMicMode, micActive, pttActive } from './voiceChat';
 import { safeStorage } from './safeStorage';
+import { helpersHidden } from './helperLayer';
 import {
 	HOLD_MS,
 	vrWindowAdjust,
@@ -233,7 +245,7 @@ vrChatPanelOpen.subscribe((open) => {
 });
 
 /** @type {any} */ let renderer = null;
-/** @type {{menu?: boolean, squeeze?: boolean, stick?: boolean, trigger?: boolean, a?: boolean}[]} */
+/** @type {{menu?: boolean, squeeze?: boolean, stick?: boolean, trigger?: boolean, a?: boolean, mode?: boolean}[]} */
 const previousButtons = [{}, {}];
 const raycaster = new THREE.Raycaster();
 const tempMatrix = new THREE.Matrix4();
@@ -310,6 +322,8 @@ function ensureRayLines() {
 export function updateHoverBox(object) {
 	const scene = get(globalScene);
 	if (!scene) return;
+	// 30b P1: the hover shell is editor scaffolding — none in Interact/Play
+	if (helpersHidden()) object = null;
 	if (!hoverBox) {
 		hoverBox = new THREE.Box3Helper(new THREE.Box3(), new THREE.Color(RAY_HOVER));
 		hoverBox.name = 'vr-hover-box';
@@ -329,6 +343,8 @@ function setHovered(object) {
 	// the shell is the primary, emissive-independent cue; the emissive tint is a
 	// secondary touch for materials that support it
 	updateHoverBox(object);
+	// 30b P1: ...and neither is the emissive hover tint (it paints a replicated material)
+	if (helpersHidden()) object = null;
 	if (hoveredObject === object) return;
 	if (hoveredObject?.material?.emissive) hoveredObject.material.emissive.setHex(hoveredEmissive);
 	hoveredObject = null;
@@ -381,9 +397,17 @@ export function registerVRTriggerHooks(hooks) {
 		if (i >= 0) triggerHooks.splice(i, 1);
 	};
 }
+/** 30b (C3): did SOME hook take the last trigger press on each slot? The sweep starts
+ * from a non-consuming hook, so it reads this on its next frame to stand down under a
+ * gesture another feature claimed (a knob drag, a cable, the sleeve). */
+const triggerClaims = [false, false];
+/** @param {number} index */
+export function triggerClaimed(index) {
+	return !!triggerClaims[index];
+}
 /** @param {number} index @returns {boolean} */
 export function vrModuleTriggerStart(index) {
-	return triggerHooks.some((h) => {
+	const claimed = triggerHooks.some((h) => {
 		try {
 			return !!h.start?.(index);
 		} catch (error) {
@@ -391,6 +415,8 @@ export function vrModuleTriggerStart(index) {
 			return false;
 		}
 	});
+	triggerClaims[index] = claimed;
+	return claimed;
 }
 /** @param {number} index @returns {boolean} */
 export function vrModuleTriggerEnd(index) {
@@ -800,7 +826,8 @@ export function updateTeleport(session) {
 	const y = source?.gamepad?.axes?.[3] ?? 0;
 
 	// 157: teleport can be disabled — reset any arm + hide the arc
-	if (!get(vrTeleportEnabled)) {
+	// 30b P3: ...and Interact allows it only when the scene's play block says so
+	if (!get(vrTeleportEnabled) || !vrLocomotionNow().teleport) {
 		teleportEngaged = false;
 		hideArc();
 		return;
@@ -926,24 +953,228 @@ export function initVRControls(r) {
 	renderer = r;
 }
 
+/** 30b: what the actuators were asked for (a ring, newest last) and how many pulses the
+ * Edit-mode gate swallowed — the suites' view, since no headset is attached headless */
+const hapticRing = /** @type {{intensity: number, ms: number, hand: string | null, at: number}[]} */ ([]);
+let hapticSuppressed = 0;
+
+// ---- 30b P3: WALK LIKE A GAME (Interact) ------------------------------------------------
+// Edit keeps the editor's stick (VRControls.svelte: fly/strafe, left-grip pan/elevate,
+// teleport, the world gestures). INTERACT walks: the left stick moves along the head's
+// yaw at a walking pace, the step resolves through charController.resolveWalk — the SAME
+// three tiers desktop's walker uses (the rapier capsule when a sim runs, a dungeon raster,
+// the ground plane) — gravity pulls the feet down, a ~0.3 m step is climbed (the
+// capsule's autostep), and nothing flies or teleports unless the play block allows it.
+// The rig moves the WebXR way: by offsetting the reference space (offset = -(the viewer's
+// displacement), the convention across this file).
+//
+// FEET. A headset reports the HEAD. The physical head height comes from the viewer pose in
+// the BASE reference space captured at session start (local-floor: y 0 is the real floor),
+// and the feet are the head's current world y minus it — robust to every offset any gesture
+// applied since. Without a base space (a fake session in a suite), a standing 1.6 m head.
+
+/** metres per second on a full stick */
+export const VR_WALK_SPEED = 2.2;
+/** a standing head when no base space can say better */
+const STANDING_HEAD = 1.6;
+/** @type {any} */ let xrBaseSpace = null;
+
+/** Scene's onsessionstart: remember the untouched reference space. */
+export function noteXRBaseSpace() {
+	xrBaseSpace = renderer?.xr?.getReferenceSpace?.() ?? null;
+}
+
+/** 30b P3: the locomotion rules in force right now (mode + the resolved play block). */
+export function vrLocomotionNow() {
+	const mode = get(editorMode) === 'interact' ? 'interact' : 'edit';
+	return locomotionPolicy(mode, resolvePlaySettings(get(globalScene)).locomotion);
+}
+
+/** the viewer pose in the current space, and the head's physical height @returns {any} */
+function viewerNow() {
+	const frame = renderer?.xr?.getFrame?.();
+	const space = renderer?.xr?.getReferenceSpace?.();
+	const pose = frame && space ? frame.getViewerPose?.(space) : null;
+	if (!pose) return null;
+	const base = xrBaseSpace ? frame.getViewerPose?.(xrBaseSpace) : null;
+	const p = pose.transform.position;
+	const o = pose.transform.orientation;
+	const q = new THREE.Quaternion(o.x, o.y, o.z, o.w);
+	const fwd = new THREE.Vector3(0, 0, -1).applyQuaternion(q);
+	return {
+		head: { x: p.x, y: p.y, z: p.z },
+		yaw: Math.atan2(-fwd.x, -fwd.z),
+		headHeight: base ? base.transform.position.y : STANDING_HEAD
+	};
+}
+
+/** @param {{x: number, y: number, z: number}} offset reference-space offset (-(displacement))
+ * @param {{x: number, y: number, z: number, w: number}} [orientation] */
+function offsetSpace(offset, orientation) {
+	const space = renderer?.xr?.getReferenceSpace?.();
+	if (!space) return false;
+	renderer.xr.setReferenceSpace(
+		space.getOffsetReferenceSpace(
+			orientation ? new XRRigidTransform(offset, orientation) : new XRRigidTransform(offset)
+		)
+	);
+	return true;
+}
+
+/**
+ * 30b P3: ONE walker step as data — the wanted displacement from the stick, resolved against
+ * the world. Exported so a suite drives it with a real simulation and no headset.
+ * @param {{head: {x: number, y: number, z: number}, headHeight: number, yaw: number,
+ *   stick: {x: number, y: number}, dt: number, fly?: boolean, aim?: {x: number, y: number, z: number}}} input
+ * @returns {{dx: number, dy: number, dz: number, feet: number, grounded: boolean, source: string}}
+ */
+export function vrWalkStep(input) {
+	const dead = (/** @type {number} */ v) => (Math.abs(v) > 0.15 ? v : 0);
+	const sx = dead(input.stick.x);
+	const sy = dead(input.stick.y);
+	const dt = Math.max(0, Math.min(input.dt, 0.1));
+	const speed = VR_WALK_SPEED * dt;
+	const fwd = input.fly && input.aim ? input.aim : yawForward(input.yaw);
+	const flat = yawForward(input.yaw);
+	// stick UP is negative y in xr-standard; strafe is always horizontal
+	const right = { x: -flat.z, z: flat.x };
+	const desired = {
+		dx: speed * (-sy * fwd.x + sx * right.x),
+		dz: speed * (-sy * fwd.z + sx * right.z),
+		...(input.fly ? { dy: speed * -sy * (fwd.y ?? 0) } : {})
+	};
+	// the capsule is quantised to 10 cm so a nodding head does not rebuild it every frame
+	const height = Math.min(2.1, Math.max(1, Math.round(input.headHeight * 10) / 10));
+	const feet = input.head.y - input.headHeight;
+	const r = resolveWalk({ x: input.head.x, y: feet, z: input.head.z }, height, dt, desired, {
+		gravity: !input.fly
+	});
+	return { dx: r.dx, dy: r.feet - feet, dz: r.dz, feet: r.feet, grounded: r.grounded, source: r.source };
+}
+
+/**
+ * 30b P3: the Interact half of VRControls.svelte's stick task. Returns false in Edit (the
+ * caller then runs the editor's own stick code unchanged).
+ * @param {number} dt seconds @param {any} session
+ */
+export function tickVRInteractLocomotion(dt, session) {
+	const policy = vrLocomotionNow();
+	if (!policy.walk) return false;
+	const viewer = viewerNow();
+	if (!viewer) return true;
+	const left = [...(session?.inputSources ?? [])].find((s) => s.handedness === 'left');
+	const axes = left?.gamepad?.axes ?? [];
+	/** @type {any} */
+	let aim = null;
+	if (policy.fly) {
+		const index = controllerIndexFor('left');
+		if (index >= 0) {
+			const v = new THREE.Vector3(0, 0, -1).applyQuaternion(
+				renderer.xr.getController(index).getWorldQuaternion(new THREE.Quaternion())
+			);
+			aim = { x: v.x, y: v.y, z: v.z };
+		}
+	}
+	const step = vrWalkStep({
+		head: viewer.head,
+		headHeight: viewer.headHeight,
+		yaw: viewer.yaw,
+		stick: { x: axes[2] ?? 0, y: axes[3] ?? 0 },
+		dt,
+		fly: policy.fly,
+		aim
+	});
+	// fell out of the world: back to the spawn (or the origin)
+	if (step.feet < -50) {
+		// no spawn: stand back up on the origin, feet at 0
+		if (!spawnPlayer())
+			offsetSpace({ x: viewer.head.x, y: viewer.head.y - viewer.headHeight, z: viewer.head.z });
+		return true;
+	}
+	if (step.dx || step.dy || step.dz) offsetSpace({ x: -step.dx, y: -step.dy, z: -step.dz });
+	return true;
+}
+
+/**
+ * 30b P4: put the player on the game's spawn — the runtime api.setSpawn, else the scene's
+ * `play.spawn` (resolvePlaySettings). In VR the FEET land on it facing its yaw; on the
+ * desktop the play camera does (PointerLockControls reads the same resolution). No spawn,
+ * no move. @returns {boolean} whether the player was moved
+ */
+export function spawnPlayer() {
+	const spawn = resolvePlaySettings(get(globalScene)).spawn;
+	if (!spawn || !renderer?.xr?.getSession?.()) return false;
+	const viewer = viewerNow();
+	if (!viewer) return false;
+	const { turn, move } = vrSpawnOffsets(viewer.head, viewer.yaw, viewer.headHeight, spawn);
+	offsetSpace(turn.position, turn.orientation);
+	offsetSpace(move);
+	return true;
+}
+
 /**
  * Buzz the VR controllers if the session's gamepads support it (no-op on
  * desktop). Used by modules for press feedback. Optional `hand` targets one
  * controller — matched by each inputSource's OWN handedness (never a raw slot
  * index, which diverges from the controller order after a hands<->controllers
  * swap — 194/210; axesForSlot resolves the same way).
+ *
+ * 30b (C4): a NO-OP IN EDIT MODE — "The vibration should be only interactive mode, not
+ * in edit mode" (the user, from a Quest). Every core pulse and a module's api.haptic
+ * funnel through here, so this one gate covers all of them.
  * @param {number} intensity 0..1 @param {number} durationMs
  * @param {'left'|'right'=} hand omit to pulse both
+ * @param {boolean=} force pulse even in Edit (the mode-switch tick only)
  */
-export function hapticPulse(intensity = 0.5, durationMs = 50, hand = undefined) {
+export function hapticPulse(intensity = 0.5, durationMs = 50, hand = undefined, force = false) {
+	// `force`: the one pulse that must be felt IN Edit — 30b-vr-modes' Edit/Interact switch
+	// tick, which confirms the switch INTO Edit
+	if (!force && !gameFeelActive()) {
+		hapticSuppressed++;
+		return;
+	}
 	const session = renderer?.xr?.getSession?.();
-	session?.inputSources?.forEach((source) => {
+	if (!session) return;
+	hapticRing.push({ intensity, ms: durationMs, hand: hand ?? null, at: performance.now() });
+	if (hapticRing.length > 64) hapticRing.shift();
+	session.inputSources?.forEach((/** @type {any} */ source) => {
 		if (hand && source.handedness !== hand) return;
 		const actuator = source.gamepad?.hapticActuators?.[0];
 		actuator?.pulse?.(intensity, durationMs);
 	});
 }
 
+/**
+ * 30b (C4): play a named PATTERN ('tap' 'bump' 'hit' 'success' 'fail' 'rumble'
+ * 'heartbeat' — hapticPatterns.js) as timed pulses. `scale` sizes every pulse (a knock's
+ * impulse). Returns false for an unknown name or outside Interact/Play; each pulse is
+ * gated again as it fires, so leaving the game mid-pattern stops it.
+ * @param {string} name @param {'left'|'right'=} hand @param {number=} scale
+ * @returns {boolean}
+ */
+export function hapticPattern(name, hand = undefined, scale = 1) {
+	const pulses = hapticSchedule(name, scale);
+	if (!pulses.length || !gameFeelActive()) return false;
+	for (const pulse of pulses) {
+		if (pulse.at <= 0) hapticPulse(pulse.intensity, pulse.ms, hand);
+		else setTimeout(() => hapticPulse(pulse.intensity, pulse.ms, hand), pulse.at);
+	}
+	return true;
+}
+
+/** 30b: the knock's haptic seam (Scene hands this to knock.js) — a `hit` sized by the
+ * knock's own strength, on the hand that hit. `intensity` arrives as knock.js computes
+ * it (0.2 + speed/10); read back as the speed it encodes.
+ * @param {number} intensity @param {number} _ms @param {'left'|'right'} hand */
+export function hapticKnock(intensity, _ms, hand) {
+	hapticPattern('hit', hand, knockHapticScale(Math.max(0, (Number(intensity) - 0.2) * 10)));
+}
+
+/** the suites' view of the actuators @returns {{pulses: any[], suppressed: number}} */
+export function hapticDebug() {
+	return { pulses: hapticRing.map((p) => ({ ...p })), suppressed: hapticSuppressed };
+}
+
 /** 194: resolve a controller slot by HANDEDNESS. three's getController(i) is a
  * persistent object; Scene stamps controller.userData.handedness from each
  * 'connected' event, so this survives a hands<->controllers reorder (the raw
@@ -1572,11 +1803,12 @@ function broadcastMove(object, force = false) {
 		});
 }
 
-/** @param {any} object @param {any} before */
+/** @param {any} object @param {any} before null = a PLAYER's grab (Interact): moved and
+ * thrown like any other, but not an edit, so no undo entry */
 function endGrab(object, before) {
 	broadcastMove(object, true);
 	const after = transformStateOf(object);
-	if (JSON.stringify(before) !== JSON.stringify(after))
+	if (before && JSON.stringify(before) !== JSON.stringify(after))
 		recordTransform({ uuid: object.uuid, before: before, after: after });
 	// PFX-C: mid-sim release = throw (velocity estimate from the hold samples)
 	import('./physics').then((m) => m.releaseBody(object.uuid));
@@ -1586,6 +1818,17 @@ function endGrab(object, before) {
 /** @type {{index: number, prev: any} | null} right-grip drag-the-world pan */
 let worldPan = null;
 
+/** 30b P2: test/debug view of what the grips are doing right now */
+export function vrGripDebug() {
+	return {
+		grab: grab?.object?.uuid ?? null,
+		grabInteract: !!grab?.interact,
+		worldGrab: !!worldGrab,
+		worldPan: !!worldPan,
+		emptyAir: [...emptyAirSqueeze]
+	};
+}
+
 // ---- 214: Box Select — a 3D drag-box marquee. Trigger-press anchors a corner,
 // the controller drags the opposite corner, release selects every top-level
 // object whose world origin falls inside. The visual is a scene-root mesh
@@ -2224,13 +2467,13 @@ function onSqueezeStart(index) {
 	}
 	if (!get(objectsGroup)) return;
 	const controller = renderer.xr.getController(index);
-	const hits = controllerRay(index).intersectObjects(get(objectsGroup).children, true);
-	let object = hits.length ? topLevelObjectOf(hits[0].object) : null;
-	if (!object) {
-		// hand inside an object grabs it without a pointer (100.3)
-		object = containedTopLevel(controller.getWorldPosition(new THREE.Vector3()), get(objectsGroup));
-	}
+	// 30b P2: the grip takes what vrGrip.pickGripTarget says — scenery (floors, walls, the
+	// room you stand in) passes through, and in INTERACT only a player-holdable body counts
+	const mode = get(editorMode) === 'interact' ? 'interact' : 'edit';
+	let object = gripTargetOf(controllerRay(index), controller.getWorldPosition(new THREE.Vector3()), mode);
 	if (!object) {
+		// 30b P2: Interact's grips never move the world (contract C1)
+		if (!gripMovesWorld(mode)) return;
 		emptyAirSqueeze[index] = true;
 		// 186: in stretch mode both grips drive the stretch, not a world grab
 		if (get(vrStretchObject)) return;
@@ -2250,6 +2493,8 @@ function onSqueezeStart(index) {
 	if (get(lockedObjects).find((lock) => lock[1] === object.uuid)) return;
 
 	if (grab && grab.object === object && grab.index !== index) {
+		// 30b P2: a player's second hand does not resize the thing it is holding
+		if (mode === 'interact') return;
 		// second hand on the same object -> two-hand scale
 		const distance = controllerDistance();
 		scaleGrab = {
@@ -2263,6 +2508,7 @@ function onSqueezeStart(index) {
 		return;
 	}
 
+	const interact = mode === 'interact';
 	suspendAnimation(object.uuid); // animated objects park at their base while held
 	// PFX-C: mid-sim, a VR-grabbed dynamic body follows the hand kinematically
 	// and RELEASE throws it with the estimated hand velocity — the exact desktop
@@ -2281,7 +2527,10 @@ function onSqueezeStart(index) {
 	grab = {
 		object,
 		index,
-		style: get(vrGrabStyle),
+		// 30b P2: a player's hand is RIGID (no gizmo-style move/rotate), and `interact`
+		// switches off the editor's extras in updateGrab/endGrab (snap, stick scale, undo)
+		interact,
+		style: interact ? 'rigid' : get(vrGrabStyle),
 		relPos: object.position.clone().sub(pPos).applyQuaternion(pQuat.clone().invert()),
 		relQuat: pQuat.clone().invert().multiply(object.quaternion),
 		startScale: object.scale.clone(),
@@ -2291,8 +2540,53 @@ function onSqueezeStart(index) {
 		before: transformStateOf(object)
 	};
 	vrGrabbedHand.set(renderer.xr.getController(index)?.userData?.handedness ?? null);
-	hapticPulse(0.25, 30);
-	selectObject(object.uuid); // locks it for peers, updates selection state
+	// 30b (C4): a grab lands with a `hit` (a gated no-op in Edit, like every pulse)
+	hapticPattern('hit', renderer.xr.getController(index)?.userData?.handedness ?? undefined);
+	// 30b P2: a player picking something up is not SELECTING it — no lock broadcast, no
+	// selection shell, no inspector (Edit keeps all three)
+	if (!interact) selectObject(object.uuid); // locks it for peers, updates selection state
+	// 30b (core-games): a PLAYER's grab reaches On Grab nodes (Edit moves things, it does not play)
+	else fireObjectGrab(object.uuid);
+}
+
+/**
+ * 30b P2: the top-level object a grip closes on, or null for empty air. Ray hits first
+ * (nearest first, each top-level object once), then the hand-inside test (100.3); both go
+ * through the vrGrip rule, so a floor, a wall or the room you stand in is never held.
+ * Exported for the headless suite. @param {any} ray a THREE.Raycaster
+ * @param {any} handPos the controller's world position @param {'edit'|'interact'} mode
+ */
+export function gripTargetOf(ray, handPos, mode) {
+	const group = get(objectsGroup);
+	if (!group) return null;
+	/** @type {any} */
+	const camera = get(globalCamera);
+	const head = camera ? camera.getWorldPosition(new THREE.Vector3()) : null;
+	const locked = get(lockedObjects);
+	const interaction = mode === 'interact' ? resolvePlaySettings(get(globalScene)).interaction : 'grab';
+	/** @param {any} object */
+	const describe = (object) => {
+		const box = new THREE.Box3().setFromObject(object);
+		return {
+			scenery: isScenery(box.isEmpty() ? null : box, head),
+			grabbable:
+				interaction === 'grab' &&
+				object.userData?.physics?.mode === 'dynamic' &&
+				!locked.find((/** @type {any} */ lock) => lock[1] === object.uuid)
+		};
+	};
+	/** @type {any[]} */
+	const order = [];
+	for (const hit of ray.intersectObjects(group.children, true)) {
+		const top = topLevelObjectOf(hit.object);
+		if (top && !order.includes(top)) order.push(top);
+	}
+	const picked = pickGripTarget(order.map(describe), mode);
+	if (picked >= 0) return order[picked];
+	// a hand INSIDE an object needs no pointer (100.3) — the same rule decides
+	const inside = containedTopLevel(handPos, group);
+	if (inside && pickGripTarget([describe(inside)], mode) === 0) return inside;
+	return null;
 }
 
 /** @param {number} index */
@@ -2359,7 +2653,7 @@ function onSqueezeEnd(index) {
 			hapticPulse(0.4, 60);
 			return;
 		}
-		endGrab(object, grab.before);
+		endGrab(object, grab.interact ? null : grab.before);
 		grab = null;
 		vrGrabbedHand.set(null);
 		hapticPulse(0.18, 24);
@@ -2419,7 +2713,7 @@ function updateGrab() {
 		const pPos = position.clone().applyMatrix4(parentInv);
 		const pQuat = parentQuat.clone().invert().multiply(quaternion);
 
-		const axes = axesForSlot(grab.index);
+		const axes = grab.interact ? [] : axesForSlot(grab.index); // 30b P2: no reel/scale in Interact
 		const adjusted = grabStickAdjust({
 			length: Math.max(grab.relPos.length(), 0.05),
 			scale: grab.scaleFactor,
@@ -2435,7 +2729,9 @@ function updateGrab() {
 		const pose = rigidGrabPose(pPos, pQuat, grab.relPos, grab.relQuat);
 		object.position.copy(pose.position);
 		object.quaternion.copy(pose.quaternion);
-		if (get(vrSnapMode) === 'surface') {
+		if (grab.interact) {
+			// 30b P2: a player's hand does not snap
+		} else if (get(vrSnapMode) === 'surface') {
 			dropToSurface(object, get(objectsGroup)); // 156: rest on the nearest surface under it
 		} else if (get(snapEnabled)) {
 			const step = get(snapSettings).translate;
@@ -3118,11 +3414,13 @@ export function updateVRControls() {
 			console.log('VR frame hook failed', error);
 		}
 	}
+	updateModeLabel(); // 30b P4: the wrist label follows the mode (hidden outside a session)
 	if (!session) {
 		hideArc();
 		teleportEngaged = false;
 		return;
 	}
+	payPendingSpawn(); // 30b P4
 	// open menu/panel are modal for the sticks: sector nav / scrolling own them;
 	// a RIGHT-hand grab owns the right stick too (reel/scale beats teleport, 100);
 	// D9: manipulation gestures + ANY held grip stand navigation down entirely
@@ -3185,6 +3483,13 @@ export function updateVRControls() {
 		}
 		prev.menu = menuPressed;
 
+		// 30b P4: the MODE button — Y on the LEFT hand (B on the right when the radial menu
+		// lives on the left, so the two never share a button): Edit <-> Interact, in VR
+		if (source.handedness === modeHand()) {
+			if (menuPressed && !prev.mode) toggleVRMode();
+			prev.mode = menuPressed;
+		}
+
 
 		// right A held = push-to-talk
 		const aPressed = !!buttons[4]?.pressed;
@@ -3533,3 +3838,149 @@ export function updateVRControls() {
 		vrHovered.set(null);
 	}
 }
+
+// ---- 30b P4: ENTER INTERACT, SWITCH IN VR, SPAWN ------------------------------------------
+// Contract C1: pressing Play in VR on a GAME enters Interact; the left Y button toggles
+// Edit <-> Interact in the headset (a haptic tick + a label on that wrist says which); and
+// entering Interact puts the world back to 1:1 and the player on the game's spawn.
+
+/** Is this scene a game? A HUD screen bound to a game state (the GameChip rule), a spawn,
+ * or a module publishing the play contract (a dungeon). */
+export function sceneIsGame() {
+	const scene = get(globalScene);
+	if (isGameHud(get(hudDocs))) return true;
+	if (resolvePlaySettings(scene).spawn) return true;
+	return playPublishers(scene).length > 0;
+}
+
+/** which hand owns the mode button: the LEFT (Y), unless the radial menu lives there */
+export function modeHand() {
+	return get(vrMenuHand) === 'left' ? 'right' : 'left';
+}
+
+/** Scene's onsessionstart (after the base space is live). */
+export function onVRSessionStart() {
+	noteXRBaseSpace();
+	// a game is played, not edited: Play in VR lands in Interact (the stores follow below)
+	if (sceneIsGame() && get(editorMode) !== 'interact') setEditorMode('interact');
+	else if (get(editorMode) === 'interact') enterInteractVR();
+	updateModeLabel();
+}
+
+/** Interact starts at 1:1, on the spawn, with no editor gesture half-done. */
+function enterInteractVR() {
+	worldGrab = null;
+	worldPan = null;
+	emptyAirSqueeze[0] = emptyAirSqueeze[1] = false;
+	if (grab && !grab.interact) {
+		endGrab(grab.object, grab.before);
+		grab = null;
+		vrGrabbedHand.set(null);
+	}
+	resetWorldRig();
+	// at sessionstart no XR frame exists yet (so no viewer pose to move FROM): the spawn
+	// waits for the first frame that has one (updateVRControls)
+	spawnPending = true;
+	if (viewerNow()) {
+		spawnPending = false;
+		spawnPlayer();
+	}
+}
+
+/** The button: flip the mode, tick the hand, flash the label. @returns {'edit'|'interact'} */
+export function toggleVRMode() {
+	const next = toggleEditorMode();
+	hapticPulse(0.35, 40, /** @type {any} */ (modeHand()), true);
+	modeLabelFlashUntil = Date.now() + 500;
+	updateModeLabel();
+	return next;
+}
+
+let spawnPending = false;
+/** a spawn owed since enterInteractVR, paid on the first frame with a viewer pose */
+function payPendingSpawn() {
+	if (!spawnPending || !viewerNow()) return;
+	spawnPending = false;
+	spawnPlayer();
+}
+
+/** @type {any} */ let modeLabel = null;
+/** @type {any} */ let modeLabelCanvas = null;
+let modeLabelText = '';
+let modeLabelFlashUntil = 0;
+
+function ensureModeLabel() {
+	if (modeLabel || typeof document === 'undefined') return modeLabel;
+	modeLabelCanvas = document.createElement('canvas');
+	modeLabelCanvas.width = 256;
+	modeLabelCanvas.height = 80;
+	const texture = new THREE.CanvasTexture(modeLabelCanvas);
+	texture.colorSpace = THREE.SRGBColorSpace;
+	modeLabel = new THREE.Mesh(
+		new THREE.PlaneGeometry(0.075, 0.0234),
+		new THREE.MeshBasicMaterial({ map: texture, transparent: true, depthWrite: true })
+	);
+	modeLabel.name = 'vr-mode-label';
+	// on the back of the controller, tilted up toward the eyes (the wrist you glance at)
+	modeLabel.position.set(0, 0.03, 0.07);
+	modeLabel.rotation.set(-1.0, 0, 0);
+	modeLabel.renderOrder = 996;
+	return modeLabel;
+}
+
+/** redraw the label when the mode changes; re-parent it onto the mode hand's controller */
+function updateModeLabel() {
+	const label = ensureModeLabel();
+	if (!label || !renderer) return;
+	const presenting = !!renderer.xr.getSession?.();
+	const index = presenting ? controllerIndexFor(modeHand()) : -1;
+	label.visible = index >= 0;
+	if (index < 0) return;
+	const controller = renderer.xr.getController(index);
+	if (label.parent !== controller) controller.add(label);
+	const interact = get(editorMode) === 'interact';
+	const text = interact ? 'INTERACT' : 'EDIT';
+	label.scale.setScalar(Date.now() < modeLabelFlashUntil ? 1.35 : 1);
+	if (text === modeLabelText) return;
+	modeLabelText = text;
+	const ctx = modeLabelCanvas.getContext('2d');
+	if (!ctx) return;
+	ctx.clearRect(0, 0, 256, 80);
+	ctx.fillStyle = interact ? 'rgba(20, 110, 90, 0.9)' : 'rgba(150, 95, 10, 0.9)';
+	ctx.beginPath();
+	ctx.roundRect?.(4, 4, 248, 72, 18);
+	if (!ctx.roundRect) ctx.rect(4, 4, 248, 72);
+	ctx.fill();
+	ctx.fillStyle = '#ffffff';
+	ctx.font = 'bold 34px sans-serif';
+	ctx.textAlign = 'center';
+	ctx.textBaseline = 'middle';
+	ctx.fillText(text, 112, 42);
+	ctx.font = 'bold 22px sans-serif';
+	ctx.fillStyle = 'rgba(255,255,255,0.75)';
+	ctx.fillText(modeHand() === 'left' ? 'Y' : 'B', 228, 42);
+	label.material.map.needsUpdate = true;
+}
+
+/** test/debug view of the label */
+export function vrModeLabelDebug() {
+	return {
+		text: modeLabelText,
+		visible: !!modeLabel?.visible,
+		hand: modeLabel?.parent?.userData?.handedness ?? null,
+		flashing: Date.now() < modeLabelFlashUntil
+	};
+}
+
+// THE LAST STATEMENT IN THE FILE on purpose: a module-level subscribe runs its callback
+// synchronously at evaluation, so every `let` it reaches must already be declared (the
+// TDZ rule that took the whole app down twice). Entering Interact in a live session resets
+// the world and spawns; either way the label follows.
+let lastEditorMode = get(editorMode);
+editorMode.subscribe((mode) => {
+	if (mode === lastEditorMode) return;
+	lastEditorMode = mode;
+	if (!renderer?.xr?.getSession?.()) return;
+	if (mode === 'interact') enterInteractVR();
+	updateModeLabel();
+});
diff --git a/src/lib/vrGameInput.js b/src/lib/vrGameInput.js
new file mode 100644
index 00000000..ec0ff9c8
--- /dev/null
+++ b/src/lib/vrGameInput.js
@@ -0,0 +1,432 @@
+// 30b (vr-play) — THE GAME IN YOUR HANDS, the VR input half: what a controller is pointing
+// at or touching in a GAME, and what that feels like. P1 (C4) is the haptic defaults —
+// a `tap` when the laser enters something clickable, a `bump` when the trigger lands on
+// it; P4 (C3) grows the hold-and-sweep on the same resolver.
+//
+// "Clickable" is decided HERE, once, for the tap, the bump and the sweep alike:
+//  · anything under a module's scene-root INTERACTIVE group (a board, a dungeon door);
+//  · a part of a module DEVICE (`userData.device` on an ancestor — the music lab's piano
+//    keys, drum pads, transport buttons: every one is its own control);
+//  · an object an On Click node targets (flowRuntime's own rule), or one a module marked
+//    `userData.clickable = true`.
+// The ENTRY KEY is what "once per entry" counts: the exact mesh for module content and
+// device parts (a key is not its piano), the top-level object otherwise (an object with an
+// On Click is one thing to press however many meshes it is built from).
+//
+// Everything is LOCAL and gated on gameFeelActive(): the editor never buzzes (the user's
+// rule), and nothing here sends anything — a click that lands replicates through the paths
+// it always did (module handlers, the On Click trigger).
+//
+// Plugs into vrControls through its generic registries (registerVRFrameHook,
+// registerVRTriggerHooks) — the vrSleeve precedent — so vrControls never imports it.
+// Started from Scene.svelte (`startVrGameInput`), which already imports everything here.
+import * as THREE from 'three';
+import { get } from 'svelte/store';
+import { objectsGroup, globalScene, globalRenderer } from '../stores/sceneStore';
+import { gameFeelActive, gameClickMode } from './gameFeel';
+import { sceneHits } from './scenePick';
+import { pickStack, primaryIndex } from './selectThrough';
+import { topLevelObjectOf } from './objectActions';
+import { objectHasOnClick, fireObjectClick } from './flowRuntime';
+import { moduleInteractiveGroups, runClickHandlers } from './moduleSDK';
+import { registerVRFrameHook, registerVRTriggerHooks, registerPanelGroupProvider, controllerIndexFor, hapticPattern, triggerClaimed } from './vrControls';
+// P3 (C2): the game UI in VR — the panel, the wrist card, the strip, the banner
+import { vrGamePanelFrame, panelTargetAlong, panelHover, pressPanelTarget, pokeFrame, uAcross, vrGameSurface, hideVrGamePanel } from './vrGamePanel';
+
+const _mat = new THREE.Matrix4();
+
+/**
+ * @typedef {{kind: 'object', key: string, mesh: any, top: any | null, point: any, distance: number, group: string | null}} ClickTarget
+ */
+
+/** the scene-root interactive group a mesh sits under, or null @param {any} mesh */
+function interactiveGroupOf(mesh) {
+	const scene = get(globalScene);
+	for (let node = mesh; node && node !== scene; node = node.parent) {
+		if (node.parent === scene && moduleInteractiveGroups.includes(node.name)) return node.name;
+	}
+	return null;
+}
+
+/** is there a module device on the path from the mesh up to `top`? @param {any} mesh @param {any} top */
+function deviceBetween(mesh, top) {
+	for (let node = mesh; node; node = node.parent) {
+		if (node.userData?.device) return true;
+		if (node === top) break;
+	}
+	return false;
+}
+
+/**
+ * Resolve a raycast/overlap HIT to the thing a press would reach — or null when nothing
+ * clickable is there. Pure over the scene; exported for the suites.
+ * @param {any} hit a THREE intersection ({object, point, distance})
+ * @returns {ClickTarget | null}
+ */
+export function clickTargetOf(hit) {
+	const mesh = hit?.object;
+	if (!mesh) return null;
+	const group = interactiveGroupOf(mesh);
+	if (group) return { kind: 'object', key: mesh.uuid, mesh, top: null, point: hit.point, distance: hit.distance ?? 0, group };
+	const top = topLevelObjectOf(mesh);
+	if (!top) return null;
+	if (deviceBetween(mesh, top)) return { kind: 'object', key: mesh.uuid, mesh, top, point: hit.point, distance: hit.distance ?? 0, group: null };
+	if (top.userData?.clickable === true || objectHasOnClick(top.uuid))
+		return { kind: 'object', key: top.uuid, mesh, top, point: hit.point, distance: hit.distance ?? 0, group: null };
+	return null;
+}
+
+/**
+ * The nearest clickable along a ray: module interactive groups first (the viewport click's
+ * order), then the scene with the see-through rule (a faint wall does not take the press).
+ * @param {any} ray a THREE.Raycaster @returns {ClickTarget | null}
+ */
+export function clickTargetAlong(ray) {
+	/** @type {ClickTarget | null} */
+	let best = null;
+	const scene = get(globalScene);
+	for (const name of moduleInteractiveGroups) {
+		const root = scene?.getObjectByName(name);
+		if (!root) continue;
+		const hits = ray.intersectObject(root, true).filter((/** @type {any} */ h) => h.object.visible !== false);
+		const target = hits.length ? clickTargetOf(hits[0]) : null;
+		if (target && (!best || target.distance < best.distance)) best = target;
+	}
+	if (get(objectsGroup)) {
+		const stack = pickStack(sceneHits(ray), topLevelObjectOf);
+		const entry = stack.length ? stack[primaryIndex(stack)] : null;
+		const target = entry?.hit ? clickTargetOf(entry.hit) : null;
+		if (target && (!best || target.distance < best.distance)) best = target;
+	}
+	return best;
+}
+
+/* -------------------------------------------------------------- controller rays ---- */
+
+/** the world ray of three.js controller SLOT `index` @param {number} index */
+export function controllerRayOf(index) {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	const controller = renderer?.xr?.getController?.(index);
+	if (!controller) return null;
+	const ray = new THREE.Raycaster();
+	_mat.identity().extractRotation(controller.matrixWorld);
+	ray.ray.origin.setFromMatrixPosition(controller.matrixWorld);
+	ray.ray.direction.set(0, 0, -1).applyMatrix4(_mat);
+	return ray;
+}
+
+/** 'left' | 'right' | undefined for a controller slot @param {number} index */
+export function handOf(index) {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	const h = renderer?.xr?.getController?.(index)?.userData?.handedness;
+	return h === 'left' || h === 'right' ? h : undefined;
+}
+
+/* ----------------------------------------------------------------- the defaults ---- */
+
+/** what each slot's laser pointed at last frame (entry key) — the hover-enter edge */
+const hoverKey = /** @type {(string | null)[]} */ ([null, null]);
+const stats = { taps: 0, bumps: 0, sweepClicks: 0 };
+
+/**
+ * One frame of the hover edge for slot `index`: a NEW clickable under the laser taps that
+ * hand. Exported so the suites drive it with a posed controller (no XR session headless).
+ * @param {number} index @param {any} [ray] defaults to the controller's own ray
+ * @returns {ClickTarget | null}
+ */
+export function hoverFrame(index, ray = controllerRayOf(index)) {
+	if (!ray || !gameFeelActive()) {
+		hoverKey[index] = null;
+		return null;
+	}
+	const target = clickTargetAlong(ray);
+	const key = target?.key ?? null;
+	if (key && key !== hoverKey[index]) {
+		hapticPattern('tap', handOf(index));
+		stats.taps++;
+	}
+	hoverKey[index] = key;
+	return target;
+}
+
+/**
+ * A trigger PRESS on slot `index`: a bump when it lands on something clickable. Never
+ * consumes the press — the click itself still travels the normal select path.
+ * @param {number} index @param {any} [ray] @returns {boolean} whether it bumped
+ */
+export function pressFeedback(index, ray = controllerRayOf(index)) {
+	if (!ray || !gameFeelActive()) return false;
+	if (!clickTargetAlong(ray)) return false;
+	hapticPattern('bump', handOf(index));
+	stats.bumps++;
+	return true;
+}
+
+/** @returns {{taps: number, bumps: number, sweepClicks: number, hover: (string | null)[], sweeps: boolean[]}} */
+export function vrGameInputDebug() {
+	return { ...stats, hover: [...hoverKey], sweeps: sweeps.map(Boolean) };
+}
+
+/* --------------------------------------------------------------- P3 the panel ---- */
+
+const _pos = new THREE.Vector3();
+const _quat = new THREE.Quaternion();
+
+/** one hand's controller world pose, or null @param {'left'|'right'} hand */
+function handPose(hand) {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	const index = controllerIndexFor(hand);
+	const controller = index >= 0 ? renderer?.xr?.getController?.(index) : null;
+	if (!controller) return null;
+	controller.getWorldPosition(_pos);
+	controller.getWorldQuaternion(_quat);
+	return { position: _pos.clone(), quaternion: _quat.clone() };
+}
+
+/** the controller's TIP for a poke (the target-ray origin is its front end) @param {number} index */
+function tipOf(index) {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	const controller = renderer?.xr?.getController?.(index);
+	return controller ? controller.getWorldPosition(new THREE.Vector3()) : null;
+}
+
+/** true once a press of OURS (a panel button) took this trigger: its trailing 'select'
+ * must not also reach Scene's pick */
+let swallowNext = false;
+/** was a headset presenting on the last frame (the session-end edge) */
+let presenting = false;
+
+/* ---------------------------------------------------------------- P4 the sweep ---- */
+
+// C3 — HOLD THE TRIGGER AND SWEEP. The user: "I want to be able to hold trigger and
+// automatically press the buttons where I move the controller around. So, for example, I
+// can hit different keys on piano holding trigger and on the mixer enable/disable".
+//
+// While the trigger is held in Interact/Play, every clickable the controller TIP (a
+// ~6 cm sphere just ahead of the controller) ENTERS is clicked once, and re-armed when
+// the tip leaves it; with the tip touching nothing, the LASER does the same for things
+// out of reach (and for the game board's buttons). The first entry is the press itself
+// (`source: 'trigger'`), fired on the PRESS rather than the release, so an instrument
+// sounds when you hit it; every later one is `source: 'sweep'`, which a handler can opt
+// out of (`registerClickHandler(fn, {sweep: false})`). A press another feature CLAIMED
+// (a knob drag, a cable, the sleeve) is left alone — read one frame later, because this
+// hook does not consume and cannot see the hooks after it. When the sweep clicked
+// anything, the press's trailing 'select' is swallowed: that click already happened.
+
+/** the tip sphere's radius (~6 cm across) and how far ahead of the controller it sits */
+export const TIP_RADIUS = 0.03;
+const TIP_AHEAD = 0.03;
+/** the laser sweeps only what the tip cannot reach */
+const LASER_MIN = 0.25;
+
+/** @typedef {{first: boolean, inside: Set<string>, laserKey: string | null, panelKey: string | null, fired: number}} Sweep */
+/** @type {(Sweep | null)[]} */
+const sweeps = [null, null];
+
+const _box = new THREE.Box3();
+const _sphere = new THREE.Sphere();
+
+/**
+ * Every clickable a TIP sphere touches (bounding sphere, then the world box — a key, a
+ * pad, a step cell is a box). Keyed by entry, so a device part is its own control.
+ * @param {THREE.Vector3} tip @param {number} [radius] @returns {ClickTarget[]}
+ */
+export function clickTargetsTouching(tip, radius = TIP_RADIUS) {
+	/** @type {any[]} */
+	const roots = [];
+	const group = get(objectsGroup);
+	if (group) roots.push(group);
+	const scene = /** @type {any} */ (get(globalScene));
+	for (const name of moduleInteractiveGroups) {
+		const root = scene?.getObjectByName(name);
+		if (root) roots.push(root);
+	}
+	/** @type {Map<string, ClickTarget>} */
+	const found = new Map();
+	for (const root of roots)
+		root.traverseVisible((/** @type {any} */ node) => {
+			if (!node.isMesh || !node.geometry) return;
+			const geo = node.geometry;
+			if (!geo.boundingSphere) geo.computeBoundingSphere();
+			_sphere.copy(geo.boundingSphere).applyMatrix4(node.matrixWorld);
+			if (_sphere.distanceToPoint(tip) > radius) return;
+			if (!geo.boundingBox) geo.computeBoundingBox();
+			_box.copy(geo.boundingBox).applyMatrix4(node.matrixWorld);
+			if (_box.distanceToPoint(tip) > radius) return;
+			const distance = _box.distanceToPoint(tip);
+			const target = clickTargetOf({ object: node, point: tip.clone(), distance });
+			const known = target ? found.get(target.key) : null;
+			if (target && (!known || distance < known.distance)) found.set(target.key, target);
+		});
+	return [...found.values()].sort((a, b) => a.distance - b.distance);
+}
+
+/**
+ * CLICK a target the way Interact/Play's tap does — the module handlers for this mode
+ * first, then the object's On Click — and bump the hand when something acted.
+ * @param {ClickTarget} target @param {string} source @param {number} index @returns {boolean}
+ */
+export function fireClickTarget(target, source, index) {
+	let acted = runClickHandlers(target.mesh, gameClickMode(), { source });
+	if (!acted && target.top) acted = fireObjectClick(target.top.uuid) > 0;
+	if (acted) {
+		hapticPattern('bump', handOf(index));
+		stats.sweepClicks++;
+	}
+	return acted;
+}
+
+/** the tip sphere's centre for slot `index` @param {number} index */
+function tipAhead(index) {
+	const ray = controllerRayOf(index);
+	return ray ? ray.ray.origin.clone().addScaledVector(ray.ray.direction, TIP_AHEAD) : null;
+}
+
+/**
+ * One frame of a held trigger on slot `index`. `opts.tip`/`opts.ray` inject the pose (the
+ * suites; no headset headless). Returns the entry keys this frame clicked, or null when
+ * no sweep is live.
+ * @param {number} index @param {{tip?: THREE.Vector3 | null, ray?: THREE.Raycaster | null}} [opts]
+ * @returns {string[] | null}
+ */
+export function sweepFrame(index, opts = {}) {
+	const sweep = sweeps[index];
+	if (!sweep) return null;
+	if (!gameFeelActive() || (sweep.first && triggerClaimed(index))) {
+		sweeps[index] = null;
+		return null;
+	}
+	const source = sweep.first ? 'trigger' : 'sweep';
+	sweep.first = false;
+	const tip = opts.tip === undefined ? tipAhead(index) : opts.tip;
+	const ray = opts.ray === undefined ? controllerRayOf(index) : opts.ray;
+	/** @type {string[]} */
+	const fired = [];
+	// the tip plays what it is NEAREST to: a 6 cm sphere is wider than a piano key, and
+	// "every key it touches" would sound clusters. A target fires when it becomes the
+	// nearest touching one; it stays spent while the tip still touches it, and LEAVING
+	// re-arms it.
+	const touching = tip ? clickTargetsTouching(tip) : [];
+	const nearest = touching[0] ?? null;
+	const still = new Set([...sweep.inside].filter((key) => touching.some((t) => t.key === key)));
+	if (nearest && !still.has(nearest.key)) {
+		if (fireClickTarget(nearest, source, index)) fired.push(nearest.key);
+		still.add(nearest.key);
+	}
+	sweep.inside = still;
+	if (!touching.length && ray) {
+		const board = panelTargetAlong(ray);
+		const boardKey = board?.hit.id ?? null;
+		if (board && boardKey !== sweep.panelKey && pressPanelTarget(board, { source, u: uAcross(board) })) {
+			hapticPattern('bump', handOf(index));
+			fired.push(board.hit.id);
+		}
+		sweep.panelKey = boardKey;
+		const far = board ? null : clickTargetAlong(ray);
+		const farKey = far && far.distance > LASER_MIN ? far.key : null;
+		if (far && farKey && farKey !== sweep.laserKey && fireClickTarget(far, source, index)) fired.push(farKey);
+		sweep.laserKey = farKey;
+	} else {
+		sweep.laserKey = null;
+		sweep.panelKey = null;
+	}
+	if (fired.length) {
+		sweep.fired += fired.length;
+		swallowNext = true;
+	}
+	return fired;
+}
+
+/**
+ * A trigger PRESS on slot `index`. In Interact/Play: a game-board button under the laser
+ * is pressed at once and the press consumed (the sweep carries on across the board); any
+ * other press starts a SWEEP, which fires on the next frame once it knows no other
+ * gesture claimed this press. Returns whether the press was consumed. Exported for the
+ * suites (the live hook calls it).
+ * @param {number} index @returns {boolean}
+ */
+export function triggerStart(index) {
+	swallowNext = false;
+	sweeps[index] = null;
+	if (!gameFeelActive()) return false;
+	const ray = controllerRayOf(index);
+	const target = ray ? panelTargetAlong(ray) : null;
+	if (target) {
+		pressPanelTarget(target, { source: 'trigger', u: uAcross(target) });
+		hapticPattern('bump', handOf(index));
+		swallowNext = true;
+		sweeps[index] = { first: false, inside: new Set(), laserKey: null, panelKey: target.hit.id, fired: 1 };
+		return true;
+	}
+	sweeps[index] = { first: true, inside: new Set(), laserKey: null, panelKey: null, fired: 0 };
+	return false;
+}
+
+/** The trigger RELEASED on slot `index`: the sweep ends (the swallow stays armed for the
+ * trailing 'select', which WebXR fires before 'selectend'). @param {number} index */
+export function triggerEnd(index) {
+	sweeps[index] = null;
+	return false;
+}
+
+/** is a sweep live on slot `index`? (suites) @param {number} index */
+export function sweepLive(index) {
+	return !!sweeps[index];
+}
+
+/** @type {(() => void)[]} */
+let offs = [];
+
+/** Wire the defaults into the VR loop. Returns the stop. Idempotent. */
+export function startVrGameInput() {
+	stopVrGameInput();
+	offs = [
+		registerVRFrameHook(() => {
+			const renderer = /** @type {any} */ (get(globalRenderer));
+			if (!renderer?.xr?.isPresenting) {
+				// the session ENDED: take the surfaces down once (this hook runs every desktop
+				// frame too, where there is nothing to do)
+				if (presenting) hideVrGamePanel();
+				presenting = false;
+				return;
+			}
+			presenting = true;
+			vrGamePanelFrame({ hands: [handPose('left'), null] });
+			for (const index of [0, 1]) {
+				const ray = controllerRayOf(index);
+				// the laser on the board wins over the world behind it
+				if (panelHover(index, gameFeelActive() ? ray : null)) hoverKey[index] = null;
+				else hoverFrame(index, ray);
+				pokeFrame(index, gameFeelActive() ? tipOf(index) : null);
+				sweepFrame(index);
+			}
+		}),
+		registerVRTriggerHooks({
+			start: (/** @type {number} */ index) => triggerStart(index),
+			end: (/** @type {number} */ index) => triggerEnd(index),
+			swallow: () => {
+				if (!swallowNext) return false;
+				swallowNext = false;
+				return true;
+			}
+		}),
+		// the beam ends ON the board and the wrist card (the reticle sits on the button)
+		registerPanelGroupProvider(() => {
+			const s = vrGameSurface('vr-game-panel');
+			return s?.mesh.visible ? s.mesh : null;
+		}),
+		registerPanelGroupProvider(() => {
+			const s = vrGameSurface('vr-game-wrist');
+			return s?.mesh.visible ? s.mesh : null;
+		})
+	];
+	return stopVrGameInput;
+}
+
+export function stopVrGameInput() {
+	for (const off of offs) off();
+	offs = [];
+	hoverKey[0] = hoverKey[1] = null;
+	sweeps[0] = sweeps[1] = null;
+	hideVrGamePanel();
+}
diff --git a/src/lib/vrGamePanel.js b/src/lib/vrGamePanel.js
new file mode 100644
index 00000000..33e856cc
--- /dev/null
+++ b/src/lib/vrGamePanel.js
@@ -0,0 +1,898 @@
+// 30b (vr-play) C2 — THE GAME UI IN VR. The user, on a Quest: "in VR I should be able to
+// see the game menu and interact with it", "I also should see the score in the VR".
+//
+// DOM is invisible in a headset, so the HUD layer (HudLayer.svelte) draws nothing there.
+// This module draws the SAME documents into CANVAS TEXTURES on four scene-root meshes:
+//
+//  · the GAME PANEL — a world-space board ~1.2 m in front at chest height that LAZILY
+//    follows your head yaw (it re-centres only once you have turned past ~35 degrees, so
+//    it holds still while you read it). It shows a game's MENU-like screens (menu, pause,
+//    results: a screen with input 'menu', a control on it, or bound to menu/paused/over)
+//    laid out exactly as the desktop HUD lays them out (the 9-grid over the 1280x720
+//    reference stage), plus a footer with two buttons of ours: "Edit mode" (the Edit ⇄
+//    Interact switch 30b-vr-modes adds; a plain `editorMode` write is enough to leave) and
+//    "Top strip" on/off. Its buttons answer the controller LASER + trigger and a
+//    fingertip/controller-tip POKE.
+//  · the WRIST card — the game's small overlays (score, timer, level) as short lines on
+//    the LEFT wrist, shown when you turn the wrist toward your face, with the same two
+//    buttons, so there is always a way back to editing even mid-round.
+//  · the TOP STRIP — the same lines in one head-locked row across the top of the view,
+//    LOCAL on/off (persisted), default on.
+//  · the ANNOUNCE banner — api.announce(), head-locked, big and centred.
+//
+// A button press is the desktop press verbatim: `fireHudButton(id)` pulses the element's
+// Button nodes through the replicated trigger log, a toggle writes its value first — so a
+// press in the headset and a click on the desktop cannot disagree about what happened.
+//
+// LOCAL and non-replicated throughout; everything sits at the SCENE ROOT under fixed names
+// (golden rule 5) on the default layer (both eyes, never the helper layer), and only while
+// a headset session is presenting AND the player is in Interact/Play. The frame work is
+// driven by vrGameInput's frame hook; the suites drive `vrGamePanelFrame` with a synthetic
+// head pose, since no XR session runs headless.
+import * as THREE from 'three';
+import { get } from 'svelte/store';
+import { globalScene, globalRenderer } from '../stores/sceneStore';
+import { setEditorMode } from './objectActions';
+import { hudDocs, hudRuntime, hudValueOf, setHudValue, visibleScreen, activeHudKeys, rectInFrame, hudScreenOverride } from './hudDocs';
+import { isInteractiveKind, isRenderableKind } from './hudKinds';
+import { fireHudButton, hudOptionsOf } from './flowRuntime';
+import { cameraPreview } from './cameraPreview';
+import { gameState } from './gameState';
+import { gameFeelActive } from './gameFeel';
+import { gameAnnouncement } from './gameAnnounce';
+import { playGameSound } from './gameSfx';
+import { hudImageFor, resolveHudImage } from './hudImages';
+import { safeStorage } from './safeStorage';
+
+/** the HUD's authoring reference — the editor artboard's stage */
+export const STAGE_W = 1280;
+export const STAGE_H = 720;
+/** the panel's footer (our own buttons), in stage pixels */
+export const FOOTER_H = 96;
+const PANEL_DIST = 1.2;
+const PANEL_DROP = 0.22; // below the eyes: chest height
+const FOLLOW_DEG = 35;
+const SETTLE_DEG = 2;
+const WRIST_W = 0.15;
+const STRIP_KEY = 'vr:gameStrip';
+
+/** the board canvas's pixels per stage pixel: ~1000 px across a metre-wide board, what a
+ * headset's ~20 px per degree needs at 1.2 m */
+const SCALE = 1.5;
+
+/* ------------------------------------------------------------ the classification --- */
+
+/** a screen the PANEL shows (a menu, a pause, a results card) rather than the wrist
+ * @param {any} screen */
+export function isPanelScreen(screen) {
+	if (!screen) return false;
+	if (screen.input === 'menu') return true;
+	if (['menu', 'paused', 'over'].includes(String(screen.showWhile ?? ''))) return true;
+	return (screen.elements ?? []).some((/** @type {any} */ el) => isInteractiveKind(el.kind) && el.enabled !== false);
+}
+
+/** kinds with no VR form on the board (a crosshair, a plot, the debug pill, module DOM) */
+const NO_VR_FORM = new Set(['crosshair', 'minimap', 'debug', 'custom', 'damageflash']);
+/** the board never gets narrower than its footer needs, in stage pixels */
+const MIN_CROP_W = 720;
+const CROP_PAD = 36;
+
+/**
+ * The part of the 1280x720 stage a screen actually USES — the union of its elements'
+ * rects, padded, widened to fit the footer. A desktop menu is usually a card in the middle
+ * of a transparent screen; drawn whole, the headset saw a wall of empty backdrop with the
+ * menu small in its middle (measured on the Towers template). Pure; exported.
+ * @param {any} screen @returns {{x: number, y: number, w: number, h: number}}
+ */
+export function panelCrop(screen) {
+	let x0 = Infinity;
+	let y0 = Infinity;
+	let x1 = -Infinity;
+	let y1 = -Infinity;
+	for (const el of screen?.elements ?? []) {
+		if (!isRenderableKind(el.kind) || NO_VR_FORM.has(el.kind)) continue;
+		const r = rectInFrame(el, STAGE_W, STAGE_H);
+		x0 = Math.min(x0, r.left);
+		y0 = Math.min(y0, r.top);
+		x1 = Math.max(x1, r.left + r.w);
+		y1 = Math.max(y1, r.top + r.h);
+	}
+	if (!Number.isFinite(x0)) return { x: 0, y: 0, w: STAGE_W, h: STAGE_H };
+	x0 = Math.max(0, x0 - CROP_PAD);
+	y0 = Math.max(0, y0 - CROP_PAD);
+	x1 = Math.min(STAGE_W, x1 + CROP_PAD);
+	y1 = Math.min(STAGE_H, y1 + CROP_PAD);
+	let w = x1 - x0;
+	if (w < MIN_CROP_W) {
+		const cx = (x0 + x1) / 2;
+		w = MIN_CROP_W;
+		x0 = Math.min(Math.max(0, cx - w / 2), STAGE_W - w);
+	}
+	return { x: x0, y: y0, w, h: Math.max(120, y1 - y0) };
+}
+
+/** metres per stage pixel on the board: a 14 px label reads ~1 degree tall at 1.2 m */
+const METRES_PER_PX = 0.0016;
+
+/**
+ * The screens on show right now, the HudLayer rule (scene doc + the one keyed by the camera
+ * looked through), split into what the panel shows and what the wrist/strip show.
+ * @returns {{panel: {key: string, screen: any}[], overlay: {key: string, screen: any}[]}}
+ */
+export function vrScreens() {
+	const through = get(cameraPreview)?.uuid ?? null;
+	/** @type {{key: string, screen: any}[]} */
+	const panel = [];
+	/** @type {{key: string, screen: any}[]} */
+	const overlay = [];
+	for (const key of activeHudKeys(through)) {
+		const screen = visibleScreen(key);
+		if (!screen) continue;
+		(isPanelScreen(screen) ? panel : overlay).push({ key, screen });
+	}
+	return { panel, overlay };
+}
+
+/**
+ * The overlay as SHORT LINES — what a score/timer/level card SAYS, readable on a wrist.
+ * Pure over (elements, runtime, values); exported for the suites.
+ * @param {any[]} elements @param {Record<string, any>} runtime @returns {string[]}
+ */
+export function overlayLines(elements, runtime) {
+	/** @type {string[]} */
+	const out = [];
+	const sorted = [...elements].sort((a, b) => (a.y ?? 0) - (b.y ?? 0) || (a.x ?? 0) - (b.x ?? 0));
+	for (const el of sorted) {
+		if (!isRenderableKind(el.kind)) continue;
+		const rt = runtime?.[el.id] ?? null;
+		const text = rt?.text !== undefined && rt?.text !== null ? String(rt.text) : String(el.label ?? '');
+		if (el.kind === 'text' || el.kind === 'timer' || el.kind === 'richtext' || el.kind === 'panel') {
+			const clean = text.replace(/\[[^\]]*\]/g, '').replace(/\s+/g, ' ').trim();
+			if (clean) out.push(clean);
+		} else if (el.kind === 'bar' || el.kind === 'progressradial') {
+			const value = Number(rt?.value ?? el.value ?? 0);
+			const min = Number(rt?.min ?? el.min ?? 0);
+			const max = Number(rt?.max ?? el.max ?? 1);
+			const pct = max - min > 1e-9 ? Math.round(Math.min(1, Math.max(0, (value - min) / (max - min))) * 100) : 0;
+			out.push((text ? text + ' ' : '') + pct + '%');
+		} else if (el.kind === 'list') {
+			const rows = Array.isArray(rt?.rows) && rt.rows.length ? rt.rows : String(el.rowsText ?? '').split('\n').filter(Boolean);
+			if (text) out.push(text);
+			for (const row of rows.slice(0, 3)) out.push(String(row));
+		}
+		if (out.length >= 6) break;
+	}
+	return out.slice(0, 6);
+}
+
+/* --------------------------------------------------------------------- drawing ----- */
+
+/** a style value, token names resolved to literals (a canvas cannot take var()) */
+function paint(/** @type {any} */ value, /** @type {string} */ fallback) {
+	if (value === undefined || value === null || value === '') return fallback;
+	const text = String(value);
+	if (/^[a-z][a-z0-9-]*$/i.test(text) && !/^(transparent|white|black|red|green|blue|gray|grey|yellow|orange|none)$/i.test(text)) {
+		try {
+			const v = getComputedStyle(document.documentElement).getPropertyValue('--' + text).trim();
+			return v || fallback;
+		} catch {
+			return fallback;
+		}
+	}
+	return text;
+}
+
+/** @param {CanvasRenderingContext2D} g @param {number} x @param {number} y @param {number} w @param {number} h @param {number} r */
+function roundRect(g, x, y, w, h, r) {
+	const rr = Math.max(0, Math.min(r, w / 2, h / 2));
+	g.beginPath();
+	g.moveTo(x + rr, y);
+	g.arcTo(x + w, y, x + w, y + h, rr);
+	g.arcTo(x + w, y + h, x, y + h, rr);
+	g.arcTo(x, y + h, x, y, rr);
+	g.arcTo(x, y, x + w, y, rr);
+	g.closePath();
+}
+
+/** @type {Map<string, HTMLImageElement>} */
+const images = new Map();
+let imageTick = 0;
+
+/** @typedef {{id: string, key: string, kind: string, x: number, y: number, w: number, h: number, footer?: string}} HitRect */
+
+/**
+ * Draw one menu screen + our footer into a 2D context sized (STAGE_W x (STAGE_H+FOOTER_H))
+ * * SCALE, and return the pressable rects in CANVAS pixels. `hover` rings the element the
+ * laser is on. Pure over its arguments (the DOM is only touched for token colours and
+ * image decode); exported for the suites.
+ * @param {CanvasRenderingContext2D} g @param {{key: string, screen: any} | null} entry
+ * @param {Record<string, any>} runtime @param {{hover?: string | null, strip?: boolean, mode?: string, crop?: {x: number, y: number, w: number, h: number}}} [opts]
+ * @returns {HitRect[]}
+ */
+export function drawPanel(g, entry, runtime, opts = {}) {
+	const crop = opts.crop ?? { x: 0, y: 0, w: STAGE_W, h: STAGE_H };
+	const W = g.canvas.width;
+	const H = g.canvas.height;
+	const k = W / crop.w;
+	g.clearRect(0, 0, W, H);
+	// the board: a dark rounded plate, so a screen authored over the game view still reads
+	roundRect(g, 0, 0, W, H, 28 * k);
+	g.fillStyle = 'rgba(12, 16, 26, 0.9)';
+	g.fill();
+	g.lineWidth = 3 * k;
+	g.strokeStyle = 'rgba(148, 163, 184, 0.55)';
+	g.stroke();
+	/** @type {HitRect[]} */
+	const hits = [];
+	const elements = (entry?.screen?.elements ?? []).filter((/** @type {any} */ el) => isRenderableKind(el.kind));
+	const sorted = [...elements].sort((a, b) => (a.z ?? 0) - (b.z ?? 0));
+	g.save();
+	g.beginPath();
+	g.rect(0, 0, W, crop.h * k);
+	g.clip();
+	for (const el of sorted) {
+		const r = rectInFrame(el, STAGE_W, STAGE_H);
+		const x = (r.left - crop.x) * k;
+		const y = (r.top - crop.y) * k;
+		const w = r.w * k;
+		const h = r.h * k;
+		const style = el.style ?? {};
+		const rt = runtime?.[el.id] ?? null;
+		const text = rt?.text !== undefined && rt?.text !== null ? String(rt.text) : String(el.label ?? '');
+		const size = Math.max(10, Number(style.size ?? 14)) * k;
+		const weight = String(style.weight ?? (el.kind === 'button' ? 600 : 400));
+		const colour = paint(style.color, '#f3f4f6');
+		const disabled = el.enabled === false;
+		g.globalAlpha = Number(style.opacity ?? 1) * (disabled ? 0.45 : 1);
+		const bg = paint(style.bg, el.kind === 'button' || el.kind === 'toggle' || el.kind === 'dropdown' || el.kind === 'tabs' ? '#374151' : 'transparent');
+		const radius = Number(style.radius ?? (el.kind === 'button' ? 8 : 0)) * k;
+		if (bg !== 'transparent') {
+			roundRect(g, x, y, w, h, radius);
+			g.fillStyle = bg;
+			g.fill();
+		}
+		if (style.border) {
+			roundRect(g, x, y, w, h, radius);
+			g.lineWidth = 2 * k;
+			g.strokeStyle = paint(style.border, 'rgba(75,85,99,0.7)');
+			g.stroke();
+		}
+		g.fillStyle = colour;
+		g.font = `${weight} ${size}px system-ui, sans-serif`;
+		g.textBaseline = 'middle';
+		const align = el.kind === 'button' ? 'center' : String(style.align ?? 'left');
+		g.textAlign = align === 'center' ? 'center' : align === 'right' ? 'right' : 'left';
+		const pad = Number(style.pad ?? 0) * k;
+		const tx = align === 'center' ? x + w / 2 : align === 'right' ? x + w - pad - 4 * k : x + pad + 4 * k;
+		if (el.kind === 'bar' || el.kind === 'progressradial' || el.kind === 'slider') {
+			const value = Number(el.kind === 'slider' ? hudValueOf(el.id, el.value ?? el.min ?? 0) : rt?.value ?? el.value ?? 0);
+			const min = Number(rt?.min ?? el.min ?? 0);
+			const max = Number(rt?.max ?? el.max ?? (el.kind === 'slider' ? 100 : 1));
+			const pct = max - min > 1e-9 ? Math.min(1, Math.max(0, (value - min) / (max - min))) : 0;
+			roundRect(g, x, y + h * 0.3, w, h * 0.4, h * 0.2);
+			g.fillStyle = 'rgba(255,255,255,0.15)';
+			g.fill();
+			roundRect(g, x, y + h * 0.3, w * pct, h * 0.4, h * 0.2);
+			g.fillStyle = paint(style.color, '#ef562f');
+			g.fill();
+			if (text && el.kind !== 'slider') {
+				g.fillStyle = '#f3f4f6';
+				g.textAlign = 'center';
+				g.fillText(text, x + w / 2, y + h / 2);
+			}
+		} else if (el.kind === 'toggle') {
+			const on = !!hudValueOf(el.id, el.value);
+			roundRect(g, x + 6 * k, y + h * 0.2, h * 1.1, h * 0.6, h * 0.3);
+			g.fillStyle = on ? '#22c55e' : 'rgba(255,255,255,0.2)';
+			g.fill();
+			g.beginPath();
+			g.arc(x + 6 * k + (on ? h * 0.8 : h * 0.3), y + h / 2, h * 0.24, 0, Math.PI * 2);
+			g.fillStyle = '#fff';
+			g.fill();
+			g.fillStyle = colour;
+			g.textAlign = 'left';
+			g.fillText(text, x + h * 1.3 + 10 * k, y + h / 2);
+		} else if (el.kind === 'dropdown' || el.kind === 'tabs') {
+			const options = hudOptionsOf(el.id, el);
+			const held = hudValueOf(el.id, el.value ?? (el.kind === 'tabs' ? 0 : options[0]));
+			const shown = el.kind === 'tabs' ? options[Math.round(Number(held)) || 0] ?? '' : String(held ?? '');
+			g.textAlign = 'center';
+			g.fillText((text ? text + ': ' : '') + '‹ ' + shown + ' ›', x + w / 2, y + h / 2);
+		} else if (el.kind === 'list') {
+			const rows = Array.isArray(rt?.rows) && rt.rows.length ? rt.rows : String(el.rowsText ?? '').split('\n').filter(Boolean);
+			const rowH = Number(el.rowHeight ?? 18) * k;
+			let yy = y + rowH / 2;
+			if (text) {
+				g.fillText(text, tx, yy);
+				yy += rowH;
+			}
+			for (const row of rows) {
+				if (yy > y + h) break;
+				g.fillText(String(row), tx, yy);
+				yy += rowH;
+			}
+		} else if (el.kind === 'image') {
+			const url = hudImageFor(String(el.src ?? ''));
+			if (!url && el.src) void resolveHudImage(String(el.src));
+			if (url) {
+				let img = images.get(url);
+				if (!img) {
+					img = new Image();
+					img.onload = () => (imageTick += 1);
+					img.src = url;
+					images.set(url, img);
+				}
+				if (img.complete && img.naturalWidth) g.drawImage(img, x, y, w, h);
+			}
+		} else if (el.kind === 'crosshair' || el.kind === 'minimap' || el.kind === 'debug' || el.kind === 'custom' || el.kind === 'damageflash') {
+			// a crosshair, a plot, a debug pill and a module's own DOM have no VR form here
+		} else if (text) {
+			// text, timer, button, panel, richtext and anything else that says something
+			const lines = el.wrap || el.kind === 'richtext' ? wrapText(g, text.replace(/\[[^\]]*\]/g, ''), w - 8 * k) : [text];
+			const lh = size * 1.25;
+			let yy = y + h / 2 - ((lines.length - 1) * lh) / 2;
+			for (const line of lines) {
+				g.fillText(line, tx, yy);
+				yy += lh;
+			}
+		}
+		g.globalAlpha = 1;
+		const pressable = isInteractiveKind(el.kind) && !disabled;
+		if (pressable) {
+			hits.push({ id: el.id, key: entry?.key ?? 'scene', kind: el.kind, x, y, w, h });
+			if (opts.hover === el.id) {
+				roundRect(g, x - 4 * k, y - 4 * k, w + 8 * k, h + 8 * k, radius + 4 * k);
+				g.lineWidth = 4 * k;
+				g.strokeStyle = '#5fd0ff';
+				g.stroke();
+			}
+		}
+	}
+	g.restore();
+	// the footer: OUR two buttons, always there
+	const fy = crop.h * k;
+	g.fillStyle = 'rgba(255,255,255,0.06)';
+	g.fillRect(0, fy, W, 2 * k);
+	const buttons = [
+		{ id: 'edit', label: 'Edit mode' },
+		{ id: 'strip', label: opts.strip === false ? 'Top strip: off' : 'Top strip: on' }
+	];
+	const bw = 300 * k;
+	const bh = 60 * k;
+	buttons.forEach((b, i) => {
+		const bx = W / 2 + (i === 0 ? -bw - 20 * k : 20 * k);
+		const by = fy + (FOOTER_H * k - bh) / 2;
+		roundRect(g, bx, by, bw, bh, 12 * k);
+		g.fillStyle = b.id === 'edit' ? '#1f2937' : '#111827';
+		g.fill();
+		g.lineWidth = (opts.hover === 'footer:' + b.id ? 5 : 2) * k;
+		g.strokeStyle = opts.hover === 'footer:' + b.id ? '#5fd0ff' : 'rgba(148,163,184,0.6)';
+		g.stroke();
+		g.fillStyle = '#f3f4f6';
+		g.font = `600 ${26 * k}px system-ui, sans-serif`;
+		g.textAlign = 'center';
+		g.textBaseline = 'middle';
+		g.fillText(b.label, bx + bw / 2, by + bh / 2);
+		hits.push({ id: 'footer:' + b.id, key: '', kind: 'footer', footer: b.id, x: bx, y: by, w: bw, h: bh });
+	});
+	return hits;
+}
+
+/** a line cut to fit `max` pixels with an ellipsis @param {CanvasRenderingContext2D} g
+ * @param {string} text @param {number} max */
+function fitText(g, text, max) {
+	if (g.measureText(text).width <= max) return text;
+	let lo = 0;
+	let hi = text.length;
+	while (lo < hi) {
+		const mid = (lo + hi + 1) >> 1;
+		if (g.measureText(text.slice(0, mid) + '…').width <= max) lo = mid;
+		else hi = mid - 1;
+	}
+	return text.slice(0, lo).trimEnd() + '…';
+}
+
+/** the strip is one glanceable row: a sentence (a hint, an instruction) belongs on the
+ * wrist, not across the top of the view @param {string} line */
+export function stripWorthy(line) {
+	return line.length <= 28;
+}
+
+/** @param {CanvasRenderingContext2D} g @param {string} text @param {number} max */
+function wrapText(g, text, max) {
+	/** @type {string[]} */
+	const out = [];
+	for (const para of text.split('\n')) {
+		let line = '';
+		for (const word of para.split(/\s+/)) {
+			const next = line ? line + ' ' + word : word;
+			if (line && g.measureText(next).width > max) {
+				out.push(line);
+				line = word;
+			} else line = next;
+		}
+		if (line) out.push(line);
+	}
+	return out.slice(0, 12);
+}
+
+/**
+ * A compact card of lines (+ optional footer buttons) — the wrist, the top strip and the
+ * banner are all this. Returns the pressable rects.
+ * @param {CanvasRenderingContext2D} g @param {string[]} lines
+ * @param {{title?: string, row?: boolean, buttons?: boolean, strip?: boolean, hover?: string | null, big?: boolean, color?: string}} [opts]
+ * @returns {HitRect[]}
+ */
+export function drawCard(g, lines, opts = {}) {
+	const W = g.canvas.width;
+	const H = g.canvas.height;
+	g.clearRect(0, 0, W, H);
+	roundRect(g, 0, 0, W, H, Math.min(24, H / 4));
+	g.fillStyle = 'rgba(12, 16, 26, 0.86)';
+	g.fill();
+	g.lineWidth = 2;
+	g.strokeStyle = 'rgba(148, 163, 184, 0.5)';
+	g.stroke();
+	g.fillStyle = opts.color ?? '#f3f4f6';
+	g.textBaseline = 'middle';
+	/** @type {HitRect[]} */
+	const hits = [];
+	if (opts.big) {
+		g.textAlign = 'center';
+		g.font = `800 ${Math.round(H * 0.42)}px system-ui, sans-serif`;
+		g.fillText(fitText(g, lines[0] ?? '', W - 40), W / 2, lines[1] ? H * 0.4 : H / 2);
+		if (lines[1]) {
+			g.font = `500 ${Math.round(H * 0.16)}px system-ui, sans-serif`;
+			g.fillStyle = '#e5e7eb';
+			g.fillText(lines[1], W / 2, H * 0.78);
+		}
+		return hits;
+	}
+	if (opts.row) {
+		g.textAlign = 'center';
+		g.font = `600 ${Math.round(H * 0.46)}px system-ui, sans-serif`;
+		g.fillText(fitText(g, lines.join('   ·   '), W - 24), W / 2, H / 2);
+		return hits;
+	}
+	const pad = 18;
+	const footer = opts.buttons ? 64 : 0;
+	const rows = Math.max(1, lines.length + (opts.title ? 1 : 0));
+	const rowH = Math.min(52, (H - footer - pad * 2) / rows);
+	let y = pad + rowH / 2;
+	g.textAlign = 'left';
+	if (opts.title) {
+		g.font = `700 ${Math.round(rowH * 0.62)}px system-ui, sans-serif`;
+		g.fillStyle = '#93c5fd';
+		g.fillText(opts.title, pad, y);
+		y += rowH;
+	}
+	g.fillStyle = '#f3f4f6';
+	g.font = `600 ${Math.round(rowH * 0.62)}px system-ui, sans-serif`;
+	for (const line of lines) {
+		g.fillText(fitText(g, line, W - pad * 2), pad, y);
+		y += rowH;
+	}
+	if (opts.buttons) {
+		const labels = [
+			{ id: 'edit', label: 'Edit' },
+			{ id: 'strip', label: opts.strip === false ? 'Strip off' : 'Strip on' }
+		];
+		const bw = (W - pad * 3) / 2;
+		labels.forEach((b, i) => {
+			const bx = pad + i * (bw + pad);
+			const by = H - footer + 8;
+			roundRect(g, bx, by, bw, footer - 22, 10);
+			g.fillStyle = '#1f2937';
+			g.fill();
+			g.lineWidth = opts.hover === 'footer:' + b.id ? 4 : 2;
+			g.strokeStyle = opts.hover === 'footer:' + b.id ? '#5fd0ff' : 'rgba(148,163,184,0.6)';
+			g.stroke();
+			g.fillStyle = '#f3f4f6';
+			g.font = `600 22px system-ui, sans-serif`;
+			g.textAlign = 'center';
+			g.fillText(b.label, bx + bw / 2, by + (footer - 22) / 2);
+			hits.push({ id: 'footer:' + b.id, key: '', kind: 'footer', footer: b.id, x: bx, y: by, w: bw, h: footer - 22 });
+		});
+	}
+	return hits;
+}
+
+/* ------------------------------------------------------------------ the meshes ----- */
+
+/**
+ * @typedef {{name: string, mesh: THREE.Mesh, canvas: HTMLCanvasElement, g: CanvasRenderingContext2D,
+ *   texture: THREE.CanvasTexture, w: number, h: number, hits: HitRect[], sig: string}} Surface
+ */
+
+/** @type {Record<string, Surface>} */
+const surfaces = {};
+
+/** @param {string} name @param {number} pxW @param {number} pxH @param {number} worldW */
+function surface(name, pxW, pxH, worldW) {
+	let s = surfaces[name];
+	const scene = /** @type {any} */ (get(globalScene));
+	if (!s) {
+		const canvas = document.createElement('canvas');
+		canvas.width = pxW;
+		canvas.height = pxH;
+		const g = /** @type {CanvasRenderingContext2D} */ (canvas.getContext('2d'));
+		const texture = new THREE.CanvasTexture(canvas);
+		texture.colorSpace = THREE.SRGBColorSpace;
+		texture.anisotropy = 4;
+		const worldH = (worldW * pxH) / pxW;
+		const mesh = new THREE.Mesh(
+			new THREE.PlaneGeometry(worldW, worldH),
+			new THREE.MeshBasicMaterial({ map: texture, transparent: true, depthTest: false, depthWrite: false, side: THREE.DoubleSide })
+		);
+		mesh.name = name;
+		mesh.renderOrder = 1000;
+		mesh.visible = false;
+		mesh.frustumCulled = false;
+		mesh.userData.localOnly = true;
+		s = { name, mesh, canvas, g, texture, w: worldW, h: worldH, hits: [], sig: '' };
+		surfaces[name] = s;
+	}
+	if (scene && s.mesh.parent !== scene) scene.add(s.mesh);
+	return s;
+}
+
+/** give a surface a new canvas size and world size (a new crop) @param {Surface} s
+ * @param {number} pxW @param {number} pxH @param {number} worldW */
+function resizeSurface(s, pxW, pxH, worldW) {
+	if (s.canvas.width === pxW && s.canvas.height === pxH && Math.abs(s.w - worldW) < 1e-6) return;
+	s.canvas.width = pxW;
+	s.canvas.height = pxH;
+	// a CanvasTexture keeps its GPU allocation at the OLD size unless it is disposed
+	s.texture.dispose();
+	s.texture.needsUpdate = true;
+	s.w = worldW;
+	s.h = (worldW * pxH) / pxW;
+	s.mesh.geometry.dispose();
+	s.mesh.geometry = new THREE.PlaneGeometry(s.w, s.h);
+}
+
+/* -------------------------------------------------------------------- the state ---- */
+
+/** LOCAL: the head-locked strip, on by default */
+function stripOn() {
+	return safeStorage.getItem(STRIP_KEY) !== 'false';
+}
+/** @param {boolean} on */
+export function setVrStrip(on) {
+	safeStorage.setItem(STRIP_KEY, on ? 'true' : 'false');
+}
+
+const panelYaw = { value: NaN, following: false };
+/** the laser's current panel target per controller slot, for the hover ring */
+const hover = /** @type {(string | null)[]} */ ([null, null]);
+const debug = { presses: 0, pokes: 0, lastPress: /** @type {string | null} */ (null), edits: 0 };
+
+const _head = new THREE.Vector3();
+const _headQ = new THREE.Quaternion();
+const _fwd = new THREE.Vector3();
+const _up = new THREE.Vector3();
+const _v = new THREE.Vector3();
+const _e = new THREE.Euler();
+
+/** the headset's world pose @returns {{position: THREE.Vector3, quaternion: THREE.Quaternion} | null} */
+function headPose() {
+	const renderer = /** @type {any} */ (get(globalRenderer));
+	if (!renderer?.xr?.isPresenting) return null;
+	const cam = renderer.xr.getCamera();
+	cam.updateMatrixWorld?.(true);
+	cam.getWorldPosition(_head);
+	cam.getWorldQuaternion(_headQ);
+	return { position: _head, quaternion: _headQ };
+}
+
+/** @param {THREE.Quaternion} q yaw of a quaternion (radians) */
+function yawOf(q) {
+	_e.setFromQuaternion(q, 'YXZ');
+	return _e.y;
+}
+
+/**
+ * Where the panel should yaw: it FOLLOWS lazily, with HYSTERESIS — a glance inside
+ * FOLLOW_DEG leaves it alone, and once the head has turned past that the panel eases ALL
+ * the way back in front (stopping at SETTLE_DEG). Without the second half a big turn left
+ * it parked FOLLOW_DEG off to the side, forever. Pure over (current, head, dt, state);
+ * `state.following` carries the latch between frames. Exported.
+ * @param {number} current @param {number} head @param {number} dt seconds
+ * @param {{following: boolean}} state
+ * @returns {number}
+ */
+export function followYaw(current, head, dt, state) {
+	if (!Number.isFinite(current)) {
+		state.following = false;
+		return head;
+	}
+	let d = head - current;
+	d = Math.atan2(Math.sin(d), Math.cos(d));
+	const off = Math.abs(d);
+	if (!state.following && off > (FOLLOW_DEG * Math.PI) / 180) state.following = true;
+	if (state.following && off < (SETTLE_DEG * Math.PI) / 180) state.following = false;
+	if (!state.following) return current;
+	return current + d * Math.min(1, dt * 3);
+}
+
+/**
+ * One frame of the VR game UI. `opts.head` injects a head pose and `opts.hands` the two
+ * controller world poses — the suites drive both; the live frame reads the XR camera and
+ * the controllers. Returns what is on show.
+ * @param {{head?: {position: any, quaternion: any} | null, hands?: ({position: any, quaternion: any} | null)[], dt?: number, force?: boolean}} [opts]
+ */
+export function vrGamePanelFrame(opts = {}) {
+	const head = opts.head === undefined ? headPose() : opts.head;
+	const live = !!head && (opts.force || gameFeelActive());
+	const { panel, overlay } = live ? vrScreens() : { panel: [], overlay: [] };
+	const runtime = get(hudRuntime);
+	const strip = stripOn();
+	void get(hudDocs);
+	void get(hudScreenOverride);
+	void get(gameState);
+
+	// ---- the panel
+	const entry = panel[0] ?? null;
+	const crop = panelCrop(entry?.screen);
+	const board = surface('vr-game-panel', Math.round(crop.w * SCALE), Math.round((crop.h + FOOTER_H) * SCALE), crop.w * METRES_PER_PX);
+	board.mesh.visible = !!entry;
+	if (entry && head) {
+		const sig = JSON.stringify([entry.key, entry.screen, runtime, hover, strip, imageTick, valuesSig(entry.screen)]);
+		if (sig !== board.sig) {
+			board.sig = sig;
+			resizeSurface(board, Math.round(crop.w * SCALE), Math.round((crop.h + FOOTER_H) * SCALE), crop.w * METRES_PER_PX);
+			board.hits = drawPanel(board.g, entry, runtime, { hover: hover[0] ?? hover[1], strip, crop });
+			board.texture.needsUpdate = true;
+		}
+		const headYaw = yawOf(head.quaternion);
+		panelYaw.value = followYaw(panelYaw.value, headYaw, opts.dt ?? 1 / 72, panelYaw);
+		_fwd.set(-Math.sin(panelYaw.value), 0, -Math.cos(panelYaw.value));
+		board.mesh.position.copy(head.position).addScaledVector(_fwd, PANEL_DIST);
+		board.mesh.position.y = head.position.y - PANEL_DROP;
+		board.mesh.rotation.set(-0.12, panelYaw.value, 0, 'YXZ');
+		board.mesh.updateMatrixWorld(true);
+	} else if (!entry) panelYaw.value = NaN; // a new menu appears straight ahead
+
+	// ---- the wrist + the strip (the overlay lines; the wrist is there even with none)
+	const lines = overlayLines(
+		overlay.flatMap((o) => o.screen.elements ?? []),
+		runtime
+	);
+	const wrist = surface('vr-game-wrist', 320, 300, WRIST_W);
+	const leftHand = opts.hands?.[0] ?? null;
+	if (live && leftHand) {
+		const sig = JSON.stringify([lines, strip, hover]);
+		if (sig !== wrist.sig) {
+			// a line count change re-sizes the card
+			wrist.sig = sig;
+			wrist.hits = drawCard(wrist.g, lines.length ? lines : ['No score yet'], { title: 'Game', buttons: true, strip, hover: hover[0] ?? hover[1] });
+			wrist.texture.needsUpdate = true;
+		}
+		// up the forearm, facing up off it — clear of 30b-vr-modes' mode label, which sits on
+		// the same controller at (0, 0.03, 0.07)
+		_v.set(-0.01, 0.035, 0.21).applyQuaternion(leftHand.quaternion).add(leftHand.position);
+		wrist.mesh.position.copy(_v);
+		wrist.mesh.quaternion.copy(leftHand.quaternion).multiply(WRIST_TILT);
+		wrist.mesh.updateMatrixWorld(true);
+		// shown when the card's face points at the head ("turn the wrist to read")
+		_up.set(0, 0, 1).applyQuaternion(wrist.mesh.quaternion);
+		_v.copy(head ? head.position : _v).sub(wrist.mesh.position).normalize();
+		wrist.mesh.visible = _up.dot(_v) > 0.35;
+	} else wrist.mesh.visible = false;
+
+	const stripLines = lines.filter(stripWorthy);
+	const bar = surface('vr-game-strip', 1024, 72, 0.9);
+	bar.mesh.visible = live && strip && stripLines.length > 0;
+	if (bar.mesh.visible && head) {
+		const sig = JSON.stringify(stripLines);
+		if (sig !== bar.sig) {
+			bar.sig = sig;
+			drawCard(bar.g, stripLines, { row: true });
+			bar.texture.needsUpdate = true;
+		}
+		headLocked(bar.mesh, head, 1.3, 0.36);
+	}
+
+	// ---- the announce banner (head-locked; shown in any mode while presenting)
+	const note = get(gameAnnouncement);
+	const banner = surface('vr-game-announce', 1024, 256, 0.95);
+	banner.mesh.visible = !!head && !!note;
+	if (banner.mesh.visible && head && note) {
+		const sig = JSON.stringify([note.id, note.text, note.sub, note.color]);
+		if (sig !== banner.sig) {
+			banner.sig = sig;
+			drawCard(banner.g, [note.text, note.sub].filter(Boolean), { big: true, color: note.color });
+			banner.texture.needsUpdate = true;
+		}
+		headLocked(banner.mesh, head, 1.5, 0.12);
+		const left = note.at + note.ms - Date.now();
+		/** @type {any} */ (banner.mesh.material).opacity = Math.max(0, Math.min(1, left / 300));
+	}
+	return {
+		panel: board.mesh.visible ? entry?.screen?.id ?? null : null,
+		lines,
+		stripLines,
+		wrist: wrist.mesh.visible,
+		strip: bar.mesh.visible,
+		banner: banner.mesh.visible
+	};
+}
+
+const WRIST_TILT = new THREE.Quaternion().setFromEuler(new THREE.Euler(-Math.PI / 2, 0, 0));
+
+/** @param {any} screen the values a menu's inputs hold (a toggle flip must redraw) */
+function valuesSig(screen) {
+	return (screen?.elements ?? []).filter((/** @type {any} */ el) => isInteractiveKind(el.kind)).map((/** @type {any} */ el) => hudValueOf(el.id, el.value));
+}
+
+/** @param {THREE.Object3D} mesh @param {{position: any, quaternion: any}} head @param {number} dist @param {number} up */
+function headLocked(mesh, head, dist, up) {
+	_fwd.set(0, 0, -1).applyQuaternion(head.quaternion);
+	_up.set(0, 1, 0).applyQuaternion(head.quaternion);
+	mesh.position.copy(head.position).addScaledVector(_fwd, dist).addScaledVector(_up, up);
+	mesh.quaternion.copy(head.quaternion);
+	mesh.updateMatrixWorld(true);
+}
+
+/* ---------------------------------------------------------------- interaction ----- */
+
+/** @typedef {{surface: string, hit: HitRect, point: THREE.Vector3, distance: number}} PanelTarget */
+
+/** @param {Surface} s @param {THREE.Vector2} uv @returns {HitRect | null} */
+function hitAtUv(s, uv) {
+	const px = uv.x * s.canvas.width;
+	const py = (1 - uv.y) * s.canvas.height;
+	return s.hits.find((r) => px >= r.x && px <= r.x + r.w && py >= r.y && py <= r.y + r.h) ?? null;
+}
+
+/**
+ * What a ray points at on the panel or the wrist — a pressable rect or null. Exported for
+ * the sweep (P4) and the suites.
+ * @param {THREE.Raycaster} ray @returns {PanelTarget | null}
+ */
+export function panelTargetAlong(ray) {
+	/** @type {PanelTarget | null} */
+	let best = null;
+	for (const name of ['vr-game-panel', 'vr-game-wrist']) {
+		const s = surfaces[name];
+		if (!s?.mesh.visible) continue;
+		const hit = ray.intersectObject(s.mesh, false)[0];
+		if (!hit?.uv) continue;
+		const rect = hitAtUv(s, hit.uv);
+		if (rect && (!best || hit.distance < best.distance)) best = { surface: name, hit: rect, point: hit.point.clone(), distance: hit.distance };
+	}
+	return best;
+}
+
+/**
+ * The laser's hover ring for slot `index` (redraws the board when it changes).
+ * @param {number} index @param {THREE.Raycaster | null} ray @returns {PanelTarget | null}
+ */
+export function panelHover(index, ray) {
+	const target = ray ? panelTargetAlong(ray) : null;
+	hover[index] = target?.hit.id ?? null;
+	return target;
+}
+
+/**
+ * PRESS a panel target — the desktop press verbatim. Returns true when something acted.
+ * @param {PanelTarget} target @param {{source?: string, u?: number}} [opts]
+ */
+export function pressPanelTarget(target, opts = {}) {
+	const hit = target?.hit;
+	if (!hit) return false;
+	debug.presses++;
+	debug.lastPress = hit.id;
+	playGameSound('click', target.point ? target.point.toArray() : null);
+	if (hit.kind === 'footer') {
+		if (hit.footer === 'edit') {
+			debug.edits++;
+			// the ONE Edit/Interact switch (30b-vr-modes' Y button calls it too); the store
+			// write is the whole of leaving Interact, the rest re-seats a desktop gizmo
+			setEditorMode('edit');
+		} else if (hit.footer === 'strip') setVrStrip(!stripOn());
+		return true;
+	}
+	const el = elementOf(hit);
+	if (!el) return false;
+	if (el.kind === 'button') fireHudButton(el.id);
+	else if (el.kind === 'toggle') {
+		setHudValue(el.id, !hudValueOf(el.id, el.value), { shared: !!el.shared });
+		fireHudButton(el.id);
+	} else if (el.kind === 'slider') {
+		const min = Number(el.min ?? 0);
+		const max = Number(el.max ?? 100);
+		const step = Number(el.step || 1);
+		const u = Number.isFinite(opts.u) ? Number(opts.u) : 0.5;
+		const raw = min + (max - min) * Math.min(1, Math.max(0, u));
+		setHudValue(el.id, Math.round(raw / step) * step, { shared: !!el.shared });
+	} else if (el.kind === 'dropdown' || el.kind === 'tabs') {
+		const options = hudOptionsOf(el.id, el);
+		if (!options.length) return false;
+		if (el.kind === 'tabs') {
+			const at = Math.max(0, Math.round(Number(hudValueOf(el.id, el.value ?? 0))));
+			setHudValue(el.id, (at + 1) % options.length, { shared: !!el.shared });
+		} else {
+			const held = String(hudValueOf(el.id, el.value ?? options[0]));
+			setHudValue(el.id, options[(Math.max(0, options.indexOf(held)) + 1) % options.length], { shared: !!el.shared });
+		}
+	} else fireHudButton(el.id); // a module kind with sub-presses: its own id pulses
+	return true;
+}
+
+/** @param {HitRect} hit */
+function elementOf(hit) {
+	for (const { screen } of vrScreens().panel) {
+		const el = (screen.elements ?? []).find((/** @type {any} */ e) => e.id === hit.id);
+		if (el) return el;
+	}
+	return null;
+}
+
+/** the u (0..1 across the rect) of a panel target — a slider's value @param {PanelTarget} target */
+export function uAcross(target) {
+	const s = surfaces[target.surface];
+	if (!s) return 0.5;
+	const local = s.mesh.worldToLocal(target.point.clone());
+	const px = (local.x / s.w + 0.5) * s.canvas.width;
+	return (px - target.hit.x) / Math.max(1, target.hit.w);
+}
+
+/* ------------------------------------------------------------------------ poke ---- */
+
+/** a tip is TOUCHING within this of the plane; it must back off past RELEASE to re-arm */
+const POKE_TOUCH = 0.018;
+const POKE_RELEASE = 0.04;
+const pokeArmed = [true, true];
+
+/**
+ * One frame of the fingertip / controller-tip POKE for slot `index`: pushing the tip
+ * through a button presses it once; pulling back re-arms. Returns the pressed target.
+ * @param {number} index @param {THREE.Vector3 | null} tip world position
+ * @returns {PanelTarget | null}
+ */
+export function pokeFrame(index, tip) {
+	if (!tip) return null;
+	let pressed = null;
+	let nearest = Infinity;
+	for (const name of ['vr-game-panel', 'vr-game-wrist']) {
+		const s = surfaces[name];
+		if (!s?.mesh.visible) continue;
+		const local = s.mesh.worldToLocal(tip.clone());
+		if (Math.abs(local.x) > s.w / 2 || Math.abs(local.y) > s.h / 2) continue;
+		const depth = Math.abs(local.z);
+		nearest = Math.min(nearest, depth);
+		if (depth > POKE_TOUCH || !pokeArmed[index]) continue;
+		const uv = new THREE.Vector2(local.x / s.w + 0.5, local.y / s.h + 0.5);
+		const rect = hitAtUv(s, uv);
+		if (!rect) continue;
+		const target = { surface: name, hit: rect, point: tip.clone(), distance: 0 };
+		pokeArmed[index] = false;
+		debug.pokes++;
+		pressPanelTarget(target, { source: 'poke', u: uAcross(target) });
+		pressed = target;
+	}
+	if (nearest > POKE_RELEASE) pokeArmed[index] = true;
+	return pressed;
+}
+
+/** @returns {{presses: number, pokes: number, lastPress: string | null, edits: number, hover: (string | null)[], strip: boolean, hits: Record<string, HitRect[]>}} */
+export function vrGamePanelDebug() {
+	/** @type {Record<string, HitRect[]>} */
+	const hits = {};
+	for (const [name, s] of Object.entries(surfaces)) hits[name] = s.hits.map((h) => ({ ...h }));
+	return { ...debug, hover: [...hover], strip: stripOn(), hits };
+}
+
+/** the surfaces' meshes (suites read visibility, poses and canvases) @param {string} name */
+export function vrGameSurface(name) {
+	const s = surfaces[name];
+	return s ? { mesh: s.mesh, canvas: s.canvas } : null;
+}
+
+/** Hide everything (the session ended, the player left the game). */
+export function hideVrGamePanel() {
+	for (const s of Object.values(surfaces)) s.mesh.visible = false;
+	hover[0] = hover[1] = null;
+	panelYaw.value = NaN;
+}
diff --git a/src/lib/vrGrip.js b/src/lib/vrGrip.js
new file mode 100644
index 00000000..a4aaba3a
--- /dev/null
+++ b/src/lib/vrGrip.js
@@ -0,0 +1,74 @@
+// 30b P2: WHAT A VR GRIP TAKES HOLD OF — a pure leaf (imports nothing), so the rule is
+// unit-tested with no headset and no scene.
+//
+// THE FINDING (the Quest report: "when in game and in edit mode I should be able to move
+// around the world and scale it with grips, now it disables this for some reason"). No
+// code disabled the world grab. It fires only when a grip closes on EMPTY AIR, and a game
+// scene has none: Stars Room is a closed 12 m room (floor, four walls, a ceiling), the
+// football pitch sits in a glass box, Towers stands on a 26 m floor ringed by walls. Every
+// controller ray ends on one of them, and the hand-inside test (100.3) is no better in a
+// room-sized mesh, so every grip GRABBED THE ROOM — the wall moved with your hand, the world
+// never did. A "normal" editor scene has sky behind everything, which is why it only broke
+// in games.
+//
+// THE RULE: SCENERY is not held by a grip. An object is scenery when its world bounds
+// reach SCENERY_EXTENT on any axis (a floor, a wall, a ceiling, a pitch) or the viewer's
+// HEAD is inside them (you are standing in it — a room mesh, an arena). A grip ray passes
+// through scenery to what is behind it, and a grip that finds nothing else is empty air —
+// which in EDIT is the world gesture again, everywhere. Scenery still moves in Edit through
+// every other path (the trigger selects it; the gizmo, the props panel and the menus act on
+// the selection).
+//
+// And by MODE (contract C1): EDIT holds anything that is not scenery; INTERACT holds only
+// what a player may hold — a dynamic physics body, under a play block whose interaction is
+// 'grab' — and NEVER moves the world. The first non-scenery hit decides: in Interact a
+// static podium in front of a ball blocks the grab, the way a wall blocks your hand.
+
+/** metres: a world-bounds extent at or past this on any axis makes an object scenery */
+export const SCENERY_EXTENT = 4;
+
+/**
+ * @param {{min: {x: number, y: number, z: number}, max: {x: number, y: number, z: number}} | null} box
+ *   the object's WORLD bounds (null / empty = nothing to hold, never scenery)
+ * @param {{x: number, y: number, z: number} | null} head the viewer's head in world space
+ * @returns {boolean}
+ */
+export function isScenery(box, head) {
+	if (!box || !box.min || !box.max) return false;
+	const dx = box.max.x - box.min.x;
+	const dy = box.max.y - box.min.y;
+	const dz = box.max.z - box.min.z;
+	if (!(dx >= 0 && dy >= 0 && dz >= 0)) return false; // empty / NaN bounds
+	if (Math.max(dx, dy, dz) >= SCENERY_EXTENT) return true;
+	if (!head) return false;
+	return (
+		head.x >= box.min.x && head.x <= box.max.x &&
+		head.y >= box.min.y && head.y <= box.max.y &&
+		head.z >= box.min.z && head.z <= box.max.z
+	);
+}
+
+/**
+ * Which candidate a grip takes, in ray order.
+ * @param {{scenery: boolean, grabbable: boolean}[]} candidates top-level objects along the
+ *   ray, nearest first (each once)
+ * @param {'edit' | 'interact'} mode
+ * @returns {number} the index taken, or -1 for "nothing" (empty air in Edit = the world)
+ */
+export function pickGripTarget(candidates, mode) {
+	for (let i = 0; i < candidates.length; i++) {
+		const c = candidates[i];
+		if (!c || c.scenery) continue;
+		if (mode === 'interact') return c.grabbable ? i : -1;
+		return i;
+	}
+	return -1;
+}
+
+/**
+ * Does an empty-air grip move the world in this mode? Only Edit's does.
+ * @param {'edit' | 'interact'} mode
+ */
+export function gripMovesWorld(mode) {
+	return mode !== 'interact';
+}
diff --git a/src/lib/wireValidate.js b/src/lib/wireValidate.js
index 134cacc6..9ad3e21f 100644
--- a/src/lib/wireValidate.js
+++ b/src/lib/wireValidate.js
@@ -38,7 +38,17 @@ export function isVec3(v) {
 
 /** A rotation on the wire is an Euler triple or a quaternion. @param {unknown} v */
 export function isQuatOrEuler(v) {
-	return isFiniteArray(v, 3) || isFiniteArray(v, 4);
+	return isFiniteArray(v, 3) || isFiniteArray(v, 4) || isEulerWithOrder(v);
+}
+
+/**
+ * three's `Euler.toArray()` is `[x, y, z, order]` — the shape the gizmo, the Explorer drop,
+ * the Inspector and a dozen other senders put on the wire. The appliers read [0..2] only, so
+ * refusing it dropped every one of those moves on the receiving peer (`invalid:move`).
+ * @param {unknown} v
+ */
+export function isEulerWithOrder(v) {
+	return Array.isArray(v) && v.length === 4 && isFiniteArray(v.slice(0, 3), 3) && typeof v[3] === 'string' && /^[XYZ]{3}$/.test(v[3]);
 }
 
 /** @param {unknown} v */
diff --git a/src/stores/sceneStore.js b/src/stores/sceneStore.js
index 4ffec3b0..ed4d0f7c 100644
--- a/src/stores/sceneStore.js
+++ b/src/stores/sceneStore.js
@@ -41,6 +41,16 @@ export const isLocked = writable(null);
  * @type {import("svelte/store").Writable<boolean>}
  */
 export const playPointerFree = writable(false);
+/**
+ * 30 P1: the editor's CLICK MODE, beside Play rather than inside it. 'edit' (the
+ * default): a viewport click SELECTS and the gizmo attaches. 'interact': a click reaches
+ * module click handlers, On Click nodes and the cursor grab — play-style, without the
+ * pointer lock and without starting the game — and selects nothing. LOCAL per peer:
+ * never replicated, never saved (the view-mode rule), so a reload is back in Edit.
+ * Written through objectActions.setEditorMode, which also puts the gizmo away.
+ * @type {import("svelte/store").Writable<'edit' | 'interact'>}
+ */
+export const editorMode = writable('edit');
 export const isVRMode = writable(false);
 export const vrOverride = writable(false);
 export const playerCam = writable(false);
diff --git a/static/llms-full.txt b/static/llms-full.txt
index cb43b90b..4e569f61 100644
--- a/static/llms-full.txt
+++ b/static/llms-full.txt
@@ -282,6 +282,31 @@ api.registerClickHandler((object) => {
 Handlers see desktop clicks and VR trigger presses (the exact mesh hit, not the
 top-level group). Return `false` to let normal selection continue.
 
+**Modes (1.17).** The editor has two click modes, Edit (every click selects) and
+Interact (play-style clicks and drags without starting the game), plus Play. A
+handler runs in Interact and Play by default, so an Edit click on your game piece
+selects it like any object. Say so when you want something else:
+
+```js
+api.registerClickHandler(pressKey, { modes: ['interact', 'play'] }); // the default, spelled out
+api.registerClickHandler(pickTool, { modes: ['edit'] });             // an editor TOOL
+```
+
+In a headset the same modes apply (1.17, 30b): Play in VR enters Interact, where the
+trigger clicks (module handlers, On Click) and selects nothing; in Edit it selects as
+before. Handlers also get `ctx = {source, mode}` — see *Game feel* below for the
+hold-and-sweep and `{sweep: false}`.
+`api.editorMode()` reads the mode on this screen (`'edit'` | `'interact'`) — for a module
+whose own pointer listeners run outside click routing (a drag), so it can stand down in Edit.
+
+**Listed in the object list (1.17).** Content you build at the scene root shows in
+the object list's *Module content* section — a read-only row that frames it, hides
+it locally, or opens your toolbox. Give it a readable name:
+
+```js
+api.registerListedGroup('piano-module', { label: 'Piano' });
+```
+
 ```js
 api.registerFrameTask((time) => { /* runs every frame, synced time */ });
 
@@ -456,6 +481,14 @@ api.onInput((kind, code) => {});        // 'down'/'up' events; returns unsubscri
 //   'locomotion' — VR left-stick locomotion
 api.claimInput('keys');                 // ALWAYS release when your mode ends
 api.releaseInput('keys');
+
+// reading a keydown YOURSELF (a toolbox's own handler)? resolve the key the way the
+// editor does — `event.key` when it is an ASCII letter/digit, the physical
+// `event.code` position otherwise — so it works on a Cyrillic/Greek/Hebrew layout:
+window.addEventListener('keydown', (e) => {
+	if (api.keyOf(e) === 'G') grab();       // 'G' on QWERTY, AZERTY, Dvorak AND ЙЦУКЕН
+	if (api.letterOf(e) === 'w') drive();   // lowercase form; named keys ('Escape') unchanged
+});
 ```
 
 ### Pointer ray (190)
@@ -473,6 +506,100 @@ api.registerFrameTask(() => {
 });
 ```
 
+### Free-cursor games (1.17)
+
+A board, puzzle or instrument game can play with the real mouse cursor and no
+pointer lock: publish `userData.play.cursor = 'free'` on your scene-root group
+(or the scene's physics block sets `play.cursor: 'free'`). `api.pointerRay()` is
+then the cursor's ray in play; in a locked game it is the CROSSHAIR ray (the view's
+centre), never the stale mouse position the lock pinned.
+
+### Storage (1.17)
+
+```js
+// JSON on THIS device, namespaced to your module (tp:mod:<id>:<key>), 256 KB per
+// module; never replicated, never saved into a scene, survives disable/remove.
+if (api.storage) {
+	const progress = api.storage.get('progress', { unlocked: 1 });
+	api.storage.set('progress', progress);   // -> true, or false over the quota
+	api.storage.keys(); api.storage.bytes(); api.storage.remove('progress');
+	api.storage.clear();                     // your "Reset progress"
+}
+```
+
+Feature-detect it; on an older app write the SAME key yourself
+(`localStorage['tp:mod:<id>:<key>'] = JSON.stringify(value)`) so progress carries over.
+
+### Game feel: sound, music, haptics, effects, banners (1.17, roadmap 30b)
+
+Everything here is LOCAL to the device it runs on — broadcast your own op
+(`api.send`) when every peer should hear, feel or see it — and all of it is
+feature-detected, so a module written against it still loads on an older app.
+
+```js
+register(api) {
+	api.registerClickHandler((object, ctx) => {
+		if (!object.userData.ring) return false;
+		const at = object.getWorldPosition(new api.THREE.Vector3()).toArray();
+		api.playSound?.('success', at);
+		api.effects?.burst(at, { kind: 'sparkle' });
+		api.announce?.('Ring ' + object.userData.ring + ' reached', { sub: '+50' });
+		api.hapticPattern?.('success');                // both hands; 'left' | 'right' for one
+		return true;
+	});
+	api.game.onChange?.(() => (api.game.roundUnderway() ? api.music?.play('arcade') : api.music?.stop()));
+}
+```
+
+- **`api.playSound(name, position?)`** → `true` when a sound started. Twenty
+  procedural game sounds, no assets: `click` `pop` `whoosh` `success` `fail` `hit`
+  `kick` `shoot` `laser` `explosion` `coin` `levelup` `goal` `whistle` `cheer`
+  `step` `ring` `sparkle` `hurt` `portal`, plus the ping chimes `ding` (the default),
+  `chime`, `pluck`, `bell`. An unknown name is a quiet no-op (it used to play the
+  ding). `position` spatialises it. Played at the player's "Game sounds" volume.
+- **`api.music.play(preset, {volume?})` / `api.music.stop()`** — a looping
+  procedural track under the effects, at the player's "Music" volume: `arcade`
+  `ambient` `dungeon` `stadium` `space` `puzzle` `studio`. It is TEMPO-SYNCED to the
+  session clock (two peers on one preset hear the same bar), plays only in Interact
+  or Play (`false` from the editor) and stops by itself when the player goes back to
+  editing. `api.music.current()` names what is playing; `api.music.presets()` lists them.
+- **`api.hapticPattern(name, hand?)`** — `tap` `bump` `hit` `success` `fail`
+  `rumble` `heartbeat` on the VR controllers. `api.haptic(intensity, ms, hand?)`
+  still exists. BOTH are silent in Edit mode (vibration is for playing), and core
+  already plays the defaults for you in Interact/Play: a `tap` when the laser enters
+  something clickable, a `bump` when a press lands, a `hit` on a grab, and a knock
+  sized by how hard the hand hit.
+- **`api.effects.burst([x, y, z], {kind?, color?, count?})`** — a short, pooled
+  particle burst at the scene root: `sparkle` (default), `confetti`, `smoke`,
+  `sparks`; `count` 1..96. Nothing is saved or replicated.
+- **`api.announce(text, {sub?, ms?, color?})`** — a big centred banner ("GOAL!",
+  "Level 3"): the desktop HUD, and in a headset a banner fixed in front of the
+  player. A new one replaces the one showing; `ms` 300..15000 (default 1800).
+
+**In VR, your game's HUD is in the player's hands.** A screen with `input: 'menu'`,
+a control on it, or bound to the `menu` / `paused` / `over` game state is drawn on
+a board ~1.2 m in front of the player that follows their head lazily; its buttons
+work with the laser and trigger and with a poke. The other screens (score, timer,
+level) read as short lines on a card on the left wrist and a strip across the top
+of the view. The board and the wrist card always carry an **Edit mode** button.
+Nothing to do on your side — author the HUD once and it works on both.
+
+**Hold the trigger and sweep (VR, Interact/Play).** While the trigger is held, the
+controller TIP clicks each clickable it passes over — the one it is NEAREST to, so a
+glide along a keyboard plays one key at a time — once, and again after it leaves and
+comes back: piano keys, pads, toggles, HUD buttons; the laser does the same for things
+out of reach. "Clickable" (also what earns the hover `tap`) means: under a group you
+passed to `registerInteractiveGroup`, a part of an audio device (`userData.device` on
+an ancestor — each key/pad is its own control), an object an On Click node targets, or
+an object you mark `userData.clickable = true`. Your handler gets a second argument
+`ctx = {source, mode}`: `source` is `'click'` (desktop), `'trigger'` (the VR press
+itself) or `'sweep'` (a later entry while held). A control that must not be swept
+(a knob you drag, a dot you carry) opts out:
+
+```js
+api.registerClickHandler(pickDot, { sweep: false }); // presses still reach it; sweeps do not
+```
+
 ### Physics (P-A)
 
 All mutations are INITIATOR-ONLY — the peer that started the simulation steps
@@ -620,8 +747,9 @@ api.scene();        // THREE.Scene
 api.objectsGroup(); // the replicated objects root (add scene content here)
 api.peerId();       // our peer id (undefined before the mesh is up)
 api.toast('hi');    // toast in the corner
-api.haptic(0.6, 60);          // buzz the VR controllers (no-op on desktop);
+api.haptic(0.6, 60);          // buzz the VR controllers (no-op on desktop and in Edit);
 api.haptic(0.6, 60, 'right'); // optional hand targets one controller (17-A1)
+api.hapticPattern('success'); // a named pattern (1.17, see Game feel)
 api.isVR();                   // true inside a VR session
 api.vrHand('left');           // one hand's WORLD pose + buttons, or null:
                               // {position, quaternion, trigger, gripped, connected}
diff --git a/tests/e2e/author-kit.test.cjs b/tests/e2e/author-kit.test.cjs
new file mode 100644
index 00000000..ea204515
--- /dev/null
+++ b/tests/e2e/author-kit.test.cjs
@@ -0,0 +1,419 @@
+// 30 author-kit: what a template/game DEF can say. The builder (scripts/author-templates.cjs)
+// grew primitives, light kinds, physical/toon materials and object flags; each is only real
+// if it survives the .tpscene round trip, so this suite AUTHORS a def-under-test through the
+// real script (`--def <file> --only <slug> --out <tmp>`), then LOADS the written file back
+// through sessions.readSessionZip + applySession — the Templates modal's own read path — and
+// reads each object's geometry / material / userData / clip. One check per feature.
+//
+// Run: APP_URL=https://theprototype.app:5233/ npm run e2e -- author-kit
+// (the authoring pass drives its own headless browser against the same APP_URL)
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const os = require('os');
+const path = require('path');
+const { execFileSync } = require('child_process');
+
+const SLUG = 'author-kit-test';
+
+/** The def-under-test: every new field once, on a named object. */
+const DEF = {
+	kind: 'template',
+	slug: SLUG,
+	title: 'Author kit test',
+	description: 'every author-kit field, once',
+	license: 'CC0-1.0',
+	author: 'theprototype',
+	objects: [
+		{ type: 'box', name: 'Floor', color: 0x808890, size: [20, 0.2, 20], pos: [0, -0.1, 0] },
+		{ type: 'box', name: 'Rounded', color: 0xd97706, size: [2, 1, 1.2], bevel: 0.2, pos: [-4, 0.5, 0] },
+		{ type: 'capsule', name: 'Capsule', color: 0x3b82f6, r: 0.4, h: 1.2, pos: [-2, 1, 0] },
+		{ type: 'plane', name: 'Plane', color: 0x22c55e, size: [2, 3], pos: [0, 1.5, -3] },
+		{ type: 'ring', name: 'Ring', color: 0xeab308, r: 1, inner: 0.6, pos: [2, 1.5, -3] },
+		{ type: 'icosahedron', name: 'Ico', color: 0xa855f7, r: 0.6, detail: 1, pos: [2, 0.6, 0] },
+		{ type: 'dodecahedron', name: 'Dodeca', color: 0xec4899, r: 0.6, pos: [4, 0.6, 0] },
+		{
+			type: 'sphere',
+			name: 'Glass',
+			color: 0xffffff,
+			r: 0.6,
+			pos: [0, 0.6, 2],
+			clearcoat: 0.8,
+			clearcoatRoughness: 0.15,
+			transmission: 0.9,
+			thickness: 0.5,
+			ior: 1.45,
+			sheen: 0.4,
+			sheenColor: 0xff0000,
+			roughness: 0.1
+		},
+		{ type: 'sphere', name: 'Plain physical', color: 0x999999, r: 0.3, pos: [-2, 0.3, 2], physical: true },
+		{ type: 'box', name: 'Glow', color: 0x111111, size: [0.5, 0.5, 0.5], pos: [2, 0.25, 2], emissive: 0x00ffcc, emissiveIntensity: 2.5 },
+		{ type: 'cone', name: 'Faceted', color: 0x999999, r: 0.4, h: 0.8, pos: [4, 0.4, 2], flatShading: true, side: 'double' },
+		{ type: 'sphere', name: 'Toon', color: 0x44aa88, r: 0.5, pos: [-4, 0.5, 2], toon: true },
+		{ type: 'box', name: 'Shell', color: 0xffffff, size: [8, 3, 0.1], pos: [0, 1.5, -5], opacity: 0.1, pick: 'through' },
+		{ type: 'cylinder', name: 'Coin', color: 0xfacc15, r: 0.3, h: 0.05, pos: [-4, 1.5, -2], rot: [Math.PI / 2, 0, 0], anim: 'Turntable' },
+		{ type: 'box', name: 'Door', color: 0x8b5a2b, size: [1, 2, 0.1], pos: [4, 1, -2], origin: [-0.5, 0, 0], anim: ['door', 'Pulse'] },
+		{ type: 'sphere', name: 'Fountain', color: 0x999999, r: 0.2, pos: [0, 0.2, 4], particles: { preset: 'sparkles', count: 33 } },
+		{ type: 'box', name: 'Brazier', color: 0x333333, size: [0.4, 0.4, 0.4], pos: [-2, 0.2, 4], particles: 'fire' },
+		{ type: 'light', kind: 'spot', name: 'Spot', color: 0xffeecc, intensity: 20, angle: 0.5, penumbra: 0.4, pos: [0, 6, 4], target: [0, 0, 0] },
+		{ type: 'light', kind: 'directional', name: 'Key', color: 0xffffff, intensity: 2, pos: [10, 14, 8], target: [0, 0, 0], shadowMapSize: 1024 },
+		{ type: 'light', kind: 'hemisphere', name: 'Fill', color: 0xbbddff, groundColor: 0x332211, intensity: 0.6, pos: [0, 5, 0] },
+		{ type: 'light', name: 'Bulb', color: 0xffaa55, intensity: 3, distance: 8, pos: [3, 2, 3] }
+	]
+};
+
+/** Author the def through the real script into a fresh temp folder; returns the .tpscene
+ * bytes and the thumbnail bytes. A STRING is a slug the script already knows (a DEFS entry
+ * or a module-owned def from the sibling modules checkout).
+ * @param {any} def @param {string} tag */
+function author(def, tag) {
+	const dir = fs.mkdtempSync(path.join(os.tmpdir(), 'author-kit-' + tag + '-'));
+	const slug = typeof def === 'string' ? def : def.slug;
+	const args = ['--only', slug, '--out', path.join(dir, 'out')];
+	if (typeof def !== 'string') {
+		const file = path.join(dir, 'def.json');
+		fs.writeFileSync(file, JSON.stringify(def));
+		args.unshift('--def', file);
+	}
+	const out = path.join(dir, 'out');
+	const script = path.join(__dirname, '../../scripts/author-templates.cjs');
+	const log = execFileSync('node', [script, ...args], {
+		env: { ...process.env, APP_URL: h.URL },
+		encoding: 'utf8',
+		timeout: 240000
+	});
+	console.log(log.trim().split('\n').filter((l) => /B, thumb|WARN|FATAL|PAGEERROR|GPU/.test(l)).join('\n'));
+	const section = ['games', 'templates', 'examples', 'contests'].find((d) => fs.existsSync(path.join(out, d, slug)));
+	if (!section) return { scene: Buffer.alloc(0), thumb: null };
+	const base = path.join(out, section, slug);
+	return {
+		scene: fs.readFileSync(path.join(base, 'scene.tpscene')),
+		thumb: fs.existsSync(path.join(base, 'thumb.webp')) ? fs.readFileSync(path.join(base, 'thumb.webp')) : null
+	};
+}
+
+/** Load a .tpscene into the page through the Templates modal's own read path. */
+async function load(page, bytes) {
+	return page.evaluate(async (b64) => {
+		const s = window.__stores;
+		const bin = Uint8Array.from(atob(b64), (c) => c.charCodeAt(0));
+		const payload = await s.sessions.readSessionZip(bin.buffer);
+		if (!payload) return false;
+		await s.sessions.applySession(payload, { backup: false, replicate: false });
+		return true;
+	}, bytes.toString('base64'));
+}
+
+h.run(async () => {
+	// ---- P0: primitives, lights, materials, flags -------------------------------------
+	const authored = author(DEF, 'p0');
+	check(authored.scene.length > 1000, 'the def authored a .tpscene (' + authored.scene.length + ' B)');
+
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const peer = await h.setupPage(browser, 'author-kit', { context: { viewport: { width: 1540, height: 774 } } });
+	const page = peer.page;
+	await page.waitForFunction(() => !!window.__stores?.sessions && !!window.__stores?.animationPreview, { timeout: 30000 });
+	check(await load(page, authored.scene), 'the authored file loads through readSessionZip + applySession');
+	await page.waitForTimeout(800);
+
+	const r = await page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any} */ let group;
+		s.objectsGroup.subscribe((g) => (group = g))();
+		const by = (/** @type {string} */ n) => group.getObjectByName(n);
+		const geo = (/** @type {string} */ n) => by(n)?.geometry;
+		const mat = (/** @type {string} */ n) => by(n)?.material;
+		/** @type {any} */ let anims;
+		s.animationPreview.animations.subscribe((v) => (anims = v))();
+		const clipNames = (/** @type {string} */ n) => Object.values(anims[by(n)?.uuid]?.clips ?? {}).map((/** @type {any} */ c) => c.name);
+		const rounded = geo('Rounded');
+		rounded.computeBoundingBox();
+		const bb = rounded.boundingBox;
+		// a rounded box's corner is CUT: no vertex reaches the sharp corner's |x|+|y|+|z|
+		const pos = rounded.attributes.position.array;
+		let cornerMax = 0;
+		for (let i = 0; i < pos.length; i += 3) cornerMax = Math.max(cornerMax, Math.abs(pos[i]) + Math.abs(pos[i + 1]) + Math.abs(pos[i + 2]));
+		const aim = (/** @type {string} */ n, /** @type {number[]} */ t) => {
+			const l = by(n);
+			l.updateMatrixWorld(true);
+			const wp = l.getWorldPosition(new s.THREE.Vector3());
+			const fwd = new s.THREE.Vector3(0, 0, -1).applyQuaternion(l.getWorldQuaternion(new s.THREE.Quaternion()));
+			return fwd.dot(new s.THREE.Vector3(...t).sub(wp).normalize());
+		};
+		const key = by('Key');
+		const cam = key?.shadow?.camera;
+		return {
+			roundedType: rounded.type,
+			roundedVerts: rounded.attributes.position.count,
+			roundedSize: [bb.max.x - bb.min.x, bb.max.y - bb.min.y, bb.max.z - bb.min.z],
+			cornerMax,
+			capsule: geo('Capsule')?.type,
+			capsuleRadius: geo('Capsule')?.parameters?.radius,
+			plane: geo('Plane')?.type,
+			ring: geo('Ring')?.type,
+			ringInner: geo('Ring')?.parameters?.innerRadius,
+			ico: geo('Ico')?.type,
+			icoDetail: geo('Ico')?.parameters?.detail,
+			dodeca: geo('Dodeca')?.type,
+			glass: {
+				physical: !!mat('Glass')?.isMeshPhysicalMaterial,
+				clearcoat: mat('Glass')?.clearcoat,
+				clearcoatRoughness: mat('Glass')?.clearcoatRoughness,
+				transmission: mat('Glass')?.transmission,
+				thickness: mat('Glass')?.thickness,
+				ior: mat('Glass')?.ior,
+				sheen: mat('Glass')?.sheen,
+				sheenColor: mat('Glass')?.sheenColor?.getHexString()
+			},
+			plainPhysical: !!mat('Plain physical')?.isMeshPhysicalMaterial,
+			floorStandard: mat('Floor')?.type,
+			glow: { emissive: mat('Glow')?.emissive?.getHexString(), intensity: mat('Glow')?.emissiveIntensity },
+			faceted: { flat: mat('Faceted')?.flatShading, side: mat('Faceted')?.side, double: s.THREE.DoubleSide },
+			toon: !!mat('Toon')?.isMeshToonMaterial,
+			shellPick: by('Shell')?.userData?.pick,
+			floorPick: by('Floor')?.userData?.pick ?? null,
+			coinClips: clipNames('Coin'),
+			doorClips: clipNames('Door'),
+			doorOrigin: by('Door')?.userData?.origin,
+			fountain: by('Fountain')?.userData?.particles,
+			brazier: by('Brazier')?.userData?.particles?.preset,
+			spot: {
+				is: !!by('Spot')?.isSpotLight,
+				angle: by('Spot')?.angle,
+				penumbra: by('Spot')?.penumbra,
+				shadow: by('Spot')?.castShadow,
+				aim: aim('Spot', [0, 0, 0])
+			},
+			key: {
+				is: !!key?.isDirectionalLight,
+				shadow: key?.castShadow,
+				aim: aim('Key', [0, 0, 0]),
+				frustum: cam ? [cam.left, cam.right, cam.bottom, cam.top, cam.near, cam.far] : null,
+				mapSize: key?.shadow?.mapSize?.x
+			},
+			hemi: { is: !!by('Fill')?.isHemisphereLight, ground: by('Fill')?.groundColor?.getHexString() },
+			bulb: { is: !!by('Bulb')?.isPointLight, distance: by('Bulb')?.distance }
+		};
+	});
+	console.log(JSON.stringify(r));
+
+	// primitives
+	check(r.roundedType === 'BufferGeometry', 'bevel: the rounded box is baked into a plain BufferGeometry (ObjectLoader rebuilds it) — ' + r.roundedType);
+	check(r.roundedVerts > 36, 'bevel: it carries the rounded tessellation (' + r.roundedVerts + ' verts)');
+	check(r.roundedSize.every((v, i) => Math.abs(v - [2, 1, 1.2][i]) < 1e-3), 'bevel: its outer size is still the authored size ' + r.roundedSize.map((v) => v.toFixed(3)));
+	check(r.cornerMax < 2.1 - 0.05, 'bevel: the corners are cut (max |x|+|y|+|z| ' + r.cornerMax.toFixed(3) + ' < a sharp 2.1)');
+	check(r.capsule === 'CapsuleGeometry' && Math.abs(r.capsuleRadius - 0.4) < 1e-6, 'capsule: CapsuleGeometry r=0.4 (' + r.capsule + ')');
+	check(r.plane === 'PlaneGeometry', 'plane: PlaneGeometry (' + r.plane + ')');
+	check(r.ring === 'RingGeometry' && Math.abs(r.ringInner - 0.6) < 1e-6, 'ring: RingGeometry inner 0.6 (' + r.ring + ')');
+	check(r.ico === 'IcosahedronGeometry' && r.icoDetail === 1, 'icosahedron: IcosahedronGeometry detail 1 (' + r.ico + ')');
+	check(r.dodeca === 'DodecahedronGeometry', 'dodecahedron: DodecahedronGeometry (' + r.dodeca + ')');
+	// materials
+	check(r.glass.physical, 'physical: a physical-only field makes a MeshPhysicalMaterial');
+	check(Math.abs(r.glass.clearcoat - 0.8) < 1e-6, 'physical: clearcoat 0.8 survives (' + r.glass.clearcoat + ')');
+	check(Math.abs(r.glass.clearcoatRoughness - 0.15) < 1e-6, 'physical: clearcoatRoughness 0.15 survives');
+	check(Math.abs(r.glass.transmission - 0.9) < 1e-6, 'physical: transmission 0.9 survives (' + r.glass.transmission + ')');
+	check(Math.abs(r.glass.thickness - 0.5) < 1e-6, 'physical: thickness 0.5 survives');
+	check(Math.abs(r.glass.ior - 1.45) < 1e-6, 'physical: ior 1.45 survives (' + r.glass.ior + ')');
+	check(Math.abs(r.glass.sheen - 0.4) < 1e-6 && r.glass.sheenColor === 'ff0000', 'physical: sheen 0.4 + sheenColor #ff0000 survive (' + r.glass.sheenColor + ')');
+	check(r.plainPhysical, 'physical: `physical: true` alone makes a MeshPhysicalMaterial');
+	check(r.floorStandard === 'MeshStandardMaterial', 'an object using none of it stays MeshStandardMaterial (' + r.floorStandard + ')');
+	check(r.glow.emissive === '00ffcc' && Math.abs(r.glow.intensity - 2.5) < 1e-6, 'emissive + emissiveIntensity 2.5 survive (' + JSON.stringify(r.glow) + ')');
+	check(r.faceted.flat === true, 'flatShading survives');
+	check(r.faceted.side === r.faceted.double, "side: 'double' survives as DoubleSide");
+	check(r.toon, 'toon: MeshToonMaterial');
+	// flags
+	check(r.shellPick === 'through', "pick: 'through' lands on userData.pick");
+	check(r.floorPick === null, 'an unflagged object carries no pick key');
+	check(r.coinClips.includes('Turntable'), 'anim: the Turntable preset is an authored clip on the coin (' + r.coinClips + ')');
+	check(r.doorClips.includes('Door') && r.doorClips.includes('Pulse'), 'anim: a list of presets, by key or by name (' + r.doorClips + ')');
+	check(Array.isArray(r.doorOrigin) && r.doorOrigin[0] === -0.5, 'origin: the hinge offset lands on userData.origin (' + JSON.stringify(r.doorOrigin) + ')');
+	check(r.fountain?.preset === 'sparkles' && r.fountain?.count === 33 && r.fountain?.sprite === 'star', 'particles: a preset + a patch (count 33) on userData.particles');
+	check(r.brazier === 'fire', "particles: a bare preset name ('fire')");
+	// lights
+	check(r.spot.is && Math.abs(r.spot.angle - 0.5) < 1e-6 && Math.abs(r.spot.penumbra - 0.4) < 1e-6, 'spot: SpotLight with angle 0.5 + penumbra 0.4');
+	check(r.spot.shadow === true, 'spot: casts shadows by default (createLight convention)');
+	check(r.spot.aim > 0.999, 'spot: aimed by rotation at its target (forward . to-target = ' + r.spot.aim.toFixed(4) + ')');
+	check(r.key.is && r.key.shadow === true, 'directional: DirectionalLight casting shadows');
+	check(r.key.aim > 0.999, 'directional: aimed at its target (' + r.key.aim.toFixed(4) + ')');
+	check(
+		!!r.key.frustum && r.key.frustum[1] > 5.5 && r.key.frustum[1] < 40 && r.key.frustum[4] > 0.1 && r.key.frustum[5] > r.key.frustum[4] + 10,
+		'directional: its shadow frustum is FITTED to the scene, not three\'s default ±5 (' + (r.key.frustum ?? []).map((v) => v.toFixed(1)) + ')'
+	);
+	check(r.key.mapSize === 1024, 'directional: shadowMapSize 1024 survives (' + r.key.mapSize + ')');
+	check(r.hemi.is && r.hemi.ground === '332211', 'hemisphere: HemisphereLight with its ground colour');
+	check(r.bulb.is && r.bulb.distance === 8, 'point: the existing point light is unchanged');
+
+	// ---- P1: a custom sky ---------------------------------------------------------------
+	const SKY = {
+		kind: 'template',
+		slug: 'author-kit-sky',
+		title: 'Author kit sky',
+		description: 'a custom env: gradient sky, fog, ground, sun, hemi',
+		license: 'CC0-1.0',
+		author: 'theprototype',
+		env: {
+			preset: 'custom',
+			exposure: 1.2,
+			background: { top: '#ff2020', bottom: 0x2020ff },
+			fog: { color: '#6070a0', near: 20, far: 90 },
+			ground: { color: '#3a5a2a' },
+			sun: { color: '#fff0dd', intensity: 2.2, dir: [1, 2, 0.5] },
+			hemi: { sky: '#cfe0ff', ground: 0x303820, intensity: 0.7 }
+		},
+		// looking steeply UP, so the whole frame is sky (no grid, no ground, no object)
+		view: { pos: [0, 1.6, 6], target: [0, 40, -12] },
+		objects: [{ type: 'box', name: 'Block', color: 0x999999, size: [1, 1, 1], pos: [0, 0.5, 0] }]
+	};
+	const sky = author(SKY, 'p1');
+	check(await load(page, sky.scene), 'the custom-sky file loads');
+	await page.waitForTimeout(1200);
+	const e = await page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any} */ let state;
+		s.environment.environment.subscribe((v) => (state = v))();
+		/** @type {any} */ let scene;
+		s.globalScene.subscribe((v) => (scene = v))();
+		/** @type {any} */ let renderer;
+		s.globalRenderer.subscribe((v) => (renderer = v))();
+		const ground = scene.getObjectByName('env-ground');
+		const catcher = scene.getObjectByName('env-shadow-catcher');
+		return {
+			preset: state.preset,
+			exposure: state.exposure,
+			custom: state.customPreset,
+			backgroundIsTexture: !!scene.background?.isTexture,
+			fog: scene.fog ? { color: scene.fog.color.getHexString(), near: scene.fog.near } : null,
+			groundVisible: !!ground?.visible,
+			groundColor: ground?.material?.color?.getHexString(),
+			catcherVisible: !!catcher?.visible,
+			rendererExposure: renderer?.toneMappingExposure
+		};
+	});
+	console.log(JSON.stringify(e));
+	const c = e.custom ?? {};
+	check(e.preset === 'custom' && Math.abs(e.exposure - 1.2) < 1e-9, "env: preset 'custom' with the def's exposure 1.2 as the STATE multiplier");
+	check(c.exposure === 1 && Math.abs(e.rendererExposure - 1.2) < 1e-6, 'env: exposure is applied once, not squared (renderer ' + e.rendererExposure + ')');
+	check(c.gradient?.top === '#ff2020' && c.gradient?.bottom === '#2020ff', 'env: the gradient {top, bottom} is saved (numbers become #hex)');
+	check(c.background === '#2020ff', 'env: `background` keeps a flat horizon colour beside the gradient (older peers read it)');
+	check(e.backgroundIsTexture, 'env: the live scene background is the gradient texture');
+	check(c.fog?.color === '#6070a0' && c.fog?.near === 20 && e.fog?.color === '6070a0', 'env: fog {color, near, far} is applied');
+	check(c.ground?.color === '#3a5a2a' && e.groundVisible && e.groundColor === '3a5a2a', 'env: the ground disc shows in the authored colour');
+	check(!e.catcherVisible, 'env: the shadow catcher stands down while the ground receives the shadows');
+	const sunDir = c.sun?.position ? c.sun.position.map((v) => v / Math.hypot(...c.sun.position)) : [];
+	const want = [1, 2, 0.5].map((v) => v / Math.hypot(1, 2, 0.5));
+	check(sunDir.length === 3 && sunDir.every((v, i) => Math.abs(v - want[i]) < 1e-3) && c.sun.intensity === 2.2 && c.sun.color === '#fff0dd', 'env: sun {color, intensity, dir} -> the rig sun position along dir');
+	check(c.hemi?.sky === '#cfe0ff' && c.hemi?.ground === '#303820' && c.hemi?.intensity === 0.7, 'env: hemi {sky, ground, intensity}');
+
+	// the pixels: the sky's upper band is red-heavy and its lower band blue-heavy
+	const frame = await h.grabFrame(peer);
+	const bands = await page.evaluate(
+		async ({ b64 }) => {
+			const img = new Image();
+			img.src = 'data:image/png;base64,' + b64;
+			await img.decode();
+			const canvas = document.createElement('canvas');
+			canvas.width = img.width;
+			canvas.height = img.height;
+			const ctx = canvas.getContext('2d');
+			ctx.drawImage(img, 0, 0);
+			// clear of the Connect pill (top centre) and the Controls HUD (bottom centre)
+			const band = (/** @type {number} */ y0, /** @type {number} */ y1) => {
+				const x0 = Math.round(img.width * 0.08);
+				const w = Math.round(img.width * 0.22);
+				const d = ctx.getImageData(x0, Math.round(img.height * y0), w, Math.round(img.height * (y1 - y0))).data;
+				const sum = [0, 0, 0];
+				for (let i = 0; i < d.length; i += 4) for (let k = 0; k < 3; k++) sum[k] += d[i + k];
+				return sum.map((v) => v / (d.length / 4));
+			};
+			return { top: band(0.18, 0.26), bottom: band(0.74, 0.82) };
+		},
+		{ b64: frame.toString('base64') }
+	);
+	console.log('sky bands', JSON.stringify(bands));
+	check(bands.top[0] - bands.bottom[0] > 60, 'pixels: the upper sky is redder than the lower (R ' + bands.top[0].toFixed(0) + ' vs ' + bands.bottom[0].toFixed(0) + ')');
+	check(bands.bottom[2] - bands.top[2] > 60, 'pixels: the lower sky is bluer than the upper (B ' + bands.bottom[2].toFixed(0) + ' vs ' + bands.top[2].toFixed(0) + ')');
+
+	// ---- P2: a thumbnail that looks like the game -----------------------------------------
+	// The card is rendered with the SCENE's look — its background (flat or gradient), fog,
+	// environment rig and authored lights — not a private grey studio. Three measurements:
+	//   · the SKY def's card (its `view` looks straight up) shows the authored gradient;
+	//   · the P0 def's card (studio + its own lights) reads (centre luminance > 0.2);
+	//   · the Waves def from the sibling modules checkout — the 1690-byte near-blank case to
+	//     beat — shows its OWN sunset sky, not the old grey, and carries more picture.
+	// (Waves itself is dark: its live frames read 0.11-0.13 on this metric, so a truthful card
+	// cannot clear 0.2 until its look is raised — QUESTIONS-30-author-kit fork 1.)
+	const stats = (/** @type {Buffer | null} */ webp) =>
+		page.evaluate(async (b64) => {
+			if (!b64) return null;
+			const img = new Image();
+			img.src = 'data:image/webp;base64,' + b64;
+			await img.decode();
+			const canvas = document.createElement('canvas');
+			canvas.width = img.width;
+			canvas.height = img.height;
+			const ctx = canvas.getContext('2d');
+			ctx.drawImage(img, 0, 0);
+			const mean = (/** @type {number} */ x, /** @type {number} */ y, /** @type {number} */ w, /** @type {number} */ hh) => {
+				const d = ctx.getImageData(Math.round(x), Math.round(y), Math.round(w), Math.round(hh)).data;
+				const sum = [0, 0, 0];
+				for (let i = 0; i < d.length; i += 4) for (let k = 0; k < 3; k++) sum[k] += d[i + k];
+				return sum.map((v) => v / (d.length / 4));
+			};
+			const W = img.width;
+			const H = img.height;
+			const c = mean(W / 4, H / 4, W / 2, H / 2);
+			return {
+				w: W,
+				h: H,
+				// the centre clip: the middle half on each axis, Rec.709 luma in 0..1
+				lum: (0.2126 * c[0] + 0.7152 * c[1] + 0.0722 * c[2]) / 255,
+				top: mean(0, 0, W, H * 0.12),
+				bottom: mean(0, H * 0.88, W, H * 0.12),
+				corner: mean(4, 4, 24, 16)
+			};
+		}, webp ? webp.toString('base64') : null);
+
+	const skyCard = await stats(sky.thumb);
+	console.log('sky card', JSON.stringify(skyCard));
+	check(!!skyCard && skyCard.w === 480 && skyCard.h === 270, 'card: 480x270');
+	check(!!skyCard && skyCard.top[0] - skyCard.bottom[0] > 60 && skyCard.bottom[2] - skyCard.top[2] > 60,
+		'card: the sky def card shows the authored GRADIENT (top R ' + skyCard?.top[0].toFixed(0) + ' / bottom B ' + skyCard?.bottom[2].toFixed(0) + ')');
+	const kitCard = await stats(authored.thumb);
+	console.log('kit card', JSON.stringify(kitCard));
+	check(!!kitCard && kitCard.lum > 0.2, 'card: a lit studio scene reads (centre luminance ' + kitCard?.lum.toFixed(3) + ' > 0.2)');
+
+	const wavesDef = [path.resolve(__dirname, '../../../modules'), path.resolve(__dirname, '../../../theprototype.app-modules')]
+		.map((root) => path.join(process.env.MODULES_REPO || root, 'modules/waves/waves.def.json'))
+		.find((f) => fs.existsSync(f));
+	if (!wavesDef) console.log('SKIP waves card: no modules/waves/waves.def.json in the sibling modules checkout');
+	else {
+		const wavesEnv = JSON.parse(fs.readFileSync(wavesDef, 'utf8')).env;
+		const waves = author('waves', 'p2');
+		const size = waves.thumb?.length ?? 0;
+		const card = await stats(waves.thumb);
+		// the sky the def AUTHORS: a custom sky's own background (a gradient's TOP colour — the
+		// corner sampled is the card's top-left), else the named preset's (30-visuals-mod gave
+		// Waves a custom dusk gradient; the check predates it)
+		const authoredBg = typeof wavesEnv === 'object' && wavesEnv ? wavesEnv.background : null;
+		const want = await page.evaluate(({ preset, bg }) => {
+			const hexc = (bg && typeof bg === 'object' ? bg.top : bg) || window.__stores.environment.ENVIRONMENT_PRESETS[preset]?.background || '#000000';
+			const n = parseInt(String(hexc).replace('#', '').slice(0, 6), 16);
+			return [(n >> 16) & 255, (n >> 8) & 255, n & 255];
+		}, { preset: wavesEnv?.preset ?? wavesEnv, bg: authoredBg });
+		console.log('waves card', size, JSON.stringify(card), 'scene background', want);
+		check(size > 1690 * 1.2, 'waves: the card carries more picture than the old 1690-byte render (' + size + ' B)');
+		check(!!card && card.corner.every((v, i) => Math.abs(v - want[i]) < 12),
+			"waves: the card's sky is the scene's OWN background " + JSON.stringify(want) + ', not a private grey (' + card?.corner.map((v) => v.toFixed(0)) + ')');
+		// QUESTIONS-30-author-kit fork 1: the 0.2 bar holds once Waves has a readable look of
+		// its own (30-visuals-mod) — asserted only when the def carries that look
+		if (authoredBg) check(!!card && card.lum > 0.2, 'waves: with its own readable look the card reads (centre luminance ' + card?.lum.toFixed(3) + ' > 0.2)');
+		if (process.env.AUTHOR_KIT_SAVE && waves.thumb) fs.writeFileSync(process.env.AUTHOR_KIT_SAVE, waves.thumb);
+	}
+
+	await h.finish(browser);
+});
+
+/** @param {boolean} ok @param {string} label */
+function check(ok, label) {
+	h.check(ok, label);
+}
diff --git a/tests/e2e/console-hygiene.test.cjs b/tests/e2e/console-hygiene.test.cjs
new file mode 100644
index 00000000..10ae74ce
--- /dev/null
+++ b/tests/e2e/console-hygiene.test.cjs
@@ -0,0 +1,121 @@
+// 30 P0 — CONSOLE HYGIENE. Three warnings every session printed, each a real fault in
+// miniature and each reported from the diagnostics log of a user's Quest:
+//
+//   1. `WebGLShadowMap: PCFSoftShadowMap has been deprecated. Using PCFShadowMap instead.`
+//      threlte's <Canvas> defaults `shadows` to PCFSoftShadowMap; three 0.185 downgrades
+//      it on the first shadow render. App.svelte asks for PCFShadowMap directly now —
+//      the identical picture, and this suite also asserts the renderer's type IS PCF.
+//   2. `Avoid using history.pushState(...)` — SvelteKit's router, answering the play
+//      marker's raw pushState. playMode.js pushes a SvelteKit SHALLOW entry instead.
+//   3. `using deprecated parameters for the initialization function` — wasm-bindgen,
+//      answering rapier-compat's own init(). physics.js filters exactly that line for
+//      the length of the call (the call is inside rapier, which is a frozen dependency).
+//
+// The console is read from BEFORE the first navigation (helpers.setupPage attaches its
+// listener ahead of page.goto), because the PCF warning fires on the very first frame
+// with a shadow-casting light — a listener attached after boot would never see it and
+// this suite would pass over the bug.
+const h = require('./helpers.cjs');
+
+const BANNED = [
+	{ id: 'pcf', re: /PCFSoftShadowMap has been deprecated/ },
+	{ id: 'pushState', re: /Avoid using `history\.pushState/ },
+	{ id: 'wasm-init', re: /using deprecated parameters for the initialization function/ }
+];
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+	/** @param {string} id */
+	const seen = (id) => {
+		const rule = BANNED.find((b) => b.id === id);
+		return (page.__console ?? []).filter((m) => rule.re.test(m.text));
+	};
+
+	h.check(Array.isArray(page.__console), 'the console is captured from before the first navigation');
+
+	// a lit, shadow-casting scene: a box under the default environment's sun
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		s.commandsHandler.sceneCommand('/create box');
+		await new Promise((r) => setTimeout(r, 800));
+	});
+	await page.waitForTimeout(1500);
+
+	// ---- 1. the shadow map --------------------------------------------------------
+	const shadow = await page.evaluate(() => {
+		const THREE = window.__stores.THREE;
+		let renderer;
+		window.__stores.globalRenderer.subscribe((v) => (renderer = v))();
+		return {
+			enabled: !!renderer?.shadowMap?.enabled,
+			type: renderer?.shadowMap?.type,
+			pcf: THREE.PCFShadowMap,
+			soft: THREE.PCFSoftShadowMap,
+			lights: (() => {
+				let n = 0;
+				let scene;
+				window.__stores.globalScene.subscribe((v) => (scene = v))();
+				scene?.traverse((o) => {
+					if (o.isLight && o.castShadow) n++;
+				});
+				return n;
+			})()
+		};
+	});
+	h.check(shadow.lights > 0, `premise: a shadow-casting light is in the scene (${shadow.lights})`);
+	h.check(shadow.enabled, 'shadows stay enabled');
+	h.check(shadow.type === shadow.pcf, `the renderer asks for PCFShadowMap (type ${shadow.type}, PCF ${shadow.pcf}, soft ${shadow.soft})`);
+	h.check(seen('pcf').length === 0, `no PCFSoftShadowMap deprecation warning (${seen('pcf').length})`);
+
+	// ---- 2 + 3. enter play (pushes the back marker, warms rapier), exit ---------------
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		await s.physics.warmup();
+		s.playMode.requestPlay();
+	});
+	await h.eventually(
+		() => page.evaluate(() => window.__stores.playMode.playBackMarker()),
+		(v) => v === true,
+		'entering play pushes the back marker',
+		6000
+	);
+	const marker = await page.evaluate(() => window.__stores.playMode.playMarkerState?.() ?? false);
+	h.check(marker === true, 'the marker is a SvelteKit shallow entry (sveltekit:states.tpPlay)');
+	await page.evaluate(() => window.__stores.playMode.exitPlay());
+	await h.eventually(
+		() => page.evaluate(() => window.__stores.playMode.playBackMarker()),
+		(v) => v === false,
+		'leaving play spends the marker',
+		6000
+	);
+	await h.eventually(
+		() => page.evaluate(() => { let v; window.__stores.isLocked.subscribe((x) => (v = x))(); return v; }),
+		(v) => v === null,
+		'and play settles back to the editor',
+		6000
+	);
+	await page.waitForTimeout(600);
+	const rapierReady = await page.evaluate(async () => {
+		try {
+			await window.__stores.physics.warmup();
+			return true;
+		} catch {
+			return false;
+		}
+	});
+	h.check(rapierReady, 'premise: rapier initialised (its init is what prints the wasm warning)');
+	h.check(seen('pushState').length === 0, `no SvelteKit router pushState warning (${seen('pushState').length})`);
+	h.check(seen('wasm-init').length === 0, `no wasm "deprecated parameters" warning (${seen('wasm-init').length})`);
+
+	// the filter must not eat anything ELSE: an ordinary warning still gets through
+	await page.evaluate(() => console.warn('console-hygiene: an ordinary warning'));
+	await page.waitForTimeout(200);
+	h.check(
+		(page.__console ?? []).some((m) => /console-hygiene: an ordinary warning/.test(m.text)),
+		'an ordinary console.warn still reaches the console (the filter is scoped to one call)'
+	);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/controls-roster.test.cjs b/tests/e2e/controls-roster.test.cjs
index 2a1e894c..cbd373cb 100644
--- a/tests/e2e/controls-roster.test.cjs
+++ b/tests/e2e/controls-roster.test.cjs
@@ -52,7 +52,8 @@ const closeMenus = async (page) => {
 
 /** right-click a toolbar cell by its title and wait for its menu */
 async function cellMenu(page, title) {
-	await page.locator(`#controls-pill p[title="${title}"]`).click({ button: 'right' });
+	// 30 P1: a toggle cell is a <button>, the rest are <p>s — address the CELL, whatever it is
+	await page.locator(`#controls-pill > div > [title="${title}"]`).click({ button: 'right' });
 	await page.waitForTimeout(350);
 }
 
@@ -81,11 +82,13 @@ h.run(async () => {
 	const A = await h.setupPage(browser, 'A');
 
 	// ---- premise: the default roster, in the default order ------------------------
-	const DEFAULT = ['Move (1)', 'Rotate (2)', 'Scale (3)', '—', 'Object list (O)', 'Node editor (N)', 'Explorer'];
+	// 30 P1: the Edit/Interact toggle joined the default bar at the right end (the place a
+	// default id new to an older record is appended), so the well keeps its slot
+	const DEFAULT = ['Move (1)', 'Rotate (2)', 'Scale (3)', '—', 'Object list (O)', 'Node editor (N)', 'Explorer', 'Interact mode (I)'];
 	let titles = await barTitles(A.page);
 	h.check(
 		titles.join(' | ') === DEFAULT.join(' | '),
-		`premise: six buttons around the play well, in order (${titles.join(' | ')})`
+		`premise: seven buttons around the play well, in order (${titles.join(' | ')})`
 	);
 	h.check(
 		await A.page.evaluate(() => !!document.querySelector('#controls-pill #play-button')),
@@ -114,8 +117,8 @@ h.run(async () => {
 	// plus Play. It reads checked (it IS on the bar) and carries no toggle, because
 	// there is no toolbar without a way to press play.
 	h.check(
-		menu.filter((r) => r.checked).length === 7,
-		`Customize lists the six buttons AND the play well as on the bar (${menu.filter((r) => r.checked).length})`
+		menu.filter((r) => r.checked).length === 8,
+		`Customize lists the seven buttons AND the play well as on the bar (${menu.filter((r) => r.checked).length})`
 	);
 	h.check(
 		menu.some((r) => r.label === 'Play' && r.checked),
@@ -134,7 +137,7 @@ h.run(async () => {
 	await pick(A.page, 'Rotate (2)');
 	titles = await barTitles(A.page);
 	h.check(!titles.includes('Rotate (2)'), `Rotate left the bar (${titles.join(' | ')})`);
-	h.check(titles.length === 6, `the bar lost exactly one cell (${titles.length})`);
+	h.check(titles.length === 7, `the bar lost exactly one cell (${titles.length})`);
 	h.check(
 		titles.indexOf('—') === 2,
 		`the well stayed between the same neighbours — spacerIndex followed the hide (${titles.indexOf('—')})`
@@ -150,7 +153,7 @@ h.run(async () => {
 	await A.page.waitForTimeout(600);
 	titles = await barTitles(A.page);
 	h.check(
-		!titles.includes('Rotate (2)') && titles.length === 6,
+		!titles.includes('Rotate (2)') && titles.length === 7,
 		`the hidden button is still hidden after a reload (${titles.join(' | ')})`
 	);
 	h.check(titles.indexOf('—') === 2, 'the well came back where it was left');
@@ -219,7 +222,7 @@ h.run(async () => {
 	await pick(A.page, 'Expand toolbar');
 	titles = await barTitles(A.page);
 	h.check(
-		titles.length === 6 && titles.includes('Explorer'),
+		titles.length === 7 && titles.includes('Explorer'),
 		`the FAB menu brings the bar back exactly as it was (${titles.join(' | ')})`
 	);
 	h.check((await layout(A.page))?.collapsed === false, 'expanding persisted too');
@@ -228,15 +231,15 @@ h.run(async () => {
 	await cellMenu(A.page, 'Explorer');
 	await pick(A.page, 'Customize toolbar…');
 	h.check(
-		(await rows(A.page)).filter((r) => r.checked).length === 6,
-		'premise: Customize opens showing the hidden button unchecked (5 buttons + Play)'
+		(await rows(A.page)).filter((r) => r.checked).length === 7,
+		'premise: Customize opens showing the hidden button unchecked (6 buttons + Play)'
 	);
 	await pick(A.page, 'Reset toolbar');
 	// W1: Reset is `keepOpen` too, so the list itself has to show the restored roster
 	h.check(await menuOpen(A.page), 'Reset toolbar leaves the Customize list up');
 	h.check(
-		(await rows(A.page)).filter((r) => r.checked).length === 7,
-		`and the rows re-rendered IN PLACE — all six read checked again (${(await rows(A.page)).filter((r) => r.checked).length})`
+		(await rows(A.page)).filter((r) => r.checked).length === 8,
+		`and the rows re-rendered IN PLACE — all seven read checked again (${(await rows(A.page)).filter((r) => r.checked).length})`
 	);
 	titles = await barTitles(A.page);
 	h.check(
@@ -275,7 +278,7 @@ h.run(async () => {
 	);
 	saved = await layout(A.page);
 	h.check(
-		saved && saved.spacerIndex === 2 && saved.order.join(',') === 'move,rotate,scale,objects,flow,explorer',
+		saved && saved.spacerIndex === 2 && saved.order.join(',') === 'move,rotate,scale,objects,flow,explorer,mode',
 		`the RECORD is derived from the row: the well moved, the order did not (spacerIndex=${saved?.spacerIndex} order=${saved?.order.join(',')})`
 	);
 	await cellMenu(A.page, 'Scale (3)');
@@ -304,7 +307,7 @@ h.run(async () => {
 		'the leftmost cell refuses Move left and offers Move right'
 	);
 	await closeMenus(A.page);
-	await cellMenu(A.page, 'Explorer');
+	await cellMenu(A.page, 'Interact mode (I)');
 	menu = await rows(A.page);
 	h.check(
 		menu.find((r) => r.label === 'Move right')?.disabled === true,
@@ -583,7 +586,7 @@ h.run(async () => {
 	titles = await barTitles(A.page);
 	h.check(
 		titles.join(' | ') === DEFAULT.join(' | ') && titles.indexOf('—') === 3,
-		`W8b: the default bar is byte-identical — same six, same order, same well slot (${titles.join(' | ')})`
+		`W8b: the default bar is the roster's default — same cells, same order, same well slot (${titles.join(' | ')})`
 	);
 	h.check(
 		(await layout(A.page)) === null,
@@ -621,7 +624,7 @@ h.run(async () => {
 	);
 	h.check(
 		await A.page.evaluate(
-			() => document.querySelector('[role="menu"] button[aria-label="Move Explorer down"]')?.disabled === true
+			() => document.querySelector('[role="menu"] button[aria-label="Move Interact mode (I) down"]')?.disabled === true
 		),
 		'▼ is refused on the last row'
 	);
@@ -721,7 +724,7 @@ h.run(async () => {
 	await pick(A.page, 'Animation');
 	titles = await barTitles(A.page);
 	h.check(
-		titles.includes('Animation') && titles.length === 8,
+		titles.includes('Animation') && titles.length === 9,
 		`enabling Animation put it on the bar (${titles.join(' | ')})`
 	);
 	h.check(
diff --git a/tests/e2e/editor-modes.test.cjs b/tests/e2e/editor-modes.test.cjs
new file mode 100644
index 00000000..4249524f
--- /dev/null
+++ b/tests/e2e/editor-modes.test.cjs
@@ -0,0 +1,434 @@
+// 30 P1 — EDIT and INTERACT, and (section 7) P4 — api.pointerRay under a pointer lock.
+//
+// The user's report: "interact with objects" and "edit mesh/transform" were one mode, so
+// some objects could not be moved or even SELECTED — the music modules' click handlers
+// consumed every editor click on a piano, a drum machine or a sampler (measured on the
+// Jam Room: never selectable). Now the editor has two modes, LOCAL per peer:
+//   EDIT (default)  a click SELECTS; a module click handler runs only if it asked for
+//                   {modes: ['edit']}; On Click nodes do not fire.
+//   INTERACT        a click reaches module handlers + On Click nodes (+ a grab on a
+//                   dynamic body while a sim runs); nothing is selected, no gizmo.
+// Play is unchanged (play-interact is held).
+//
+// Every viewport click here is a REAL mouse click on a pixel verified to land on the
+// intended mesh through the app's own pick (the premise checks), so no check can pass on
+// a click that hit empty space.
+
+const h = require('./helpers.cjs');
+
+const read = (page, name) =>
+	page.evaluate((n) => {
+		let v;
+		window.__stores[n].subscribe((x) => (v = x))();
+		return v;
+	}, name);
+const mode = (page) => read(page, 'editorMode');
+const selection = (page) => read(page, 'selectedObjects');
+
+/** screen pixel over an object (its bounds centre, or a named descendant's), plus what
+ * the app's OWN pick resolves at that pixel */
+function aimAt(page, target) {
+	return page.evaluate((t) => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let group, camera, renderer;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		s.globalCamera.subscribe((v) => (camera = v))();
+		s.globalRenderer.subscribe((v) => (renderer = v))();
+		const object = t.uuid ? group.getObjectByProperty('uuid', t.uuid) : group.getObjectByName(t.name);
+		if (!object) return null;
+		object.updateWorldMatrix(true, true);
+		const box = new THREE.Box3().setFromObject(object);
+		const centre = box.getCenter(new THREE.Vector3());
+		if (t.top) centre.y = box.max.y - 0.002;
+		const rect = renderer.domElement.getBoundingClientRect();
+		const v = centre.clone().project(camera);
+		const x = rect.left + ((v.x + 1) / 2) * rect.width;
+		const y = rect.top + ((1 - v.y) / 2) * rect.height;
+		const ray = new THREE.Raycaster();
+		ray.setFromCamera(new THREE.Vector2(v.x, v.y), camera);
+		const hits = s.scenePick.sceneHits(ray);
+		const under = document.elementFromPoint(x, y);
+		return {
+			x,
+			y,
+			uuid: object.uuid,
+			first: hits[0]?.object?.name ?? null,
+			firstUuid: hits[0]?.object?.uuid ?? null,
+			hitsTarget: !!hits[0] && (hits[0].object === object || object.getObjectByProperty('uuid', hits[0].object.uuid) != null),
+			onCanvas: under === renderer.domElement
+		};
+	}, target);
+}
+
+/** wrap the peer's send so a suite can see what left the machine */
+async function spySends(page) {
+	await page.evaluate(() => {
+		let p;
+		window.__stores.peers.subscribe((v) => (p = v))();
+		if (p.__spied) return;
+		const real = p.send.bind(p);
+		window.__sent = [];
+		p.send = (msg) => {
+			window.__sent.push(msg?.type);
+			return real(msg);
+		};
+		p.__spied = true;
+	});
+}
+const sent = (page) => page.evaluate(() => window.__sent.slice());
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const B = await h.setupPage(browser, 'B');
+	const page = A.page;
+	await h.connect(A, B);
+	await spySends(page);
+
+	// ---------------------------------------------------------------- 1
+	console.log('\n=== 1. the toggle, the key, the registry row ===');
+	h.check((await mode(page)) === 'edit', '1.1 the editor starts in EDIT');
+	const cell = page.locator('#editor-mode-toggle');
+	h.check((await cell.count()) === 1, '1.2 the Controls bar has the mode toggle');
+	h.check((await cell.getAttribute('aria-pressed')) === 'false', '1.3 ...not pressed in Edit');
+	const title = (await cell.getAttribute('title')) ?? '';
+	h.check(/\(I\)/.test(title), `1.4 ...and its tooltip names the key (${title})`);
+	await cell.click();
+	await page.waitForTimeout(200);
+	h.check((await mode(page)) === 'interact', '1.5 clicking it switches to INTERACT');
+	h.check((await cell.getAttribute('aria-pressed')) === 'true', '1.6 ...and it reads pressed');
+	await page.mouse.move(5, 400);
+	await page.evaluate(() => document.activeElement?.blur?.());
+	await page.keyboard.press('i');
+	await page.waitForTimeout(200);
+	h.check((await mode(page)) === 'edit', '1.7 I switches back to EDIT');
+	const row = await page.evaluate(() =>
+		window.__stores.shortcutsRegistry.shortcuts.find((s) => s.id === 'editor.interact-mode')
+	);
+	h.check(row?.keys === 'I', `1.8 the shortcut registry lists it (${row?.keys} · ${row?.label})`);
+	await page.locator('#object-search').evaluate((el) => {
+		// the object list may be closed: the key test only needs a focused text field
+		el.focus();
+	}).catch(() => {});
+	const typed = await page.evaluate(() => {
+		const input = document.createElement('input');
+		input.id = 'em-probe';
+		document.body.appendChild(input);
+		input.focus();
+		return document.activeElement === input;
+	});
+	await page.keyboard.press('i');
+	await page.waitForTimeout(150);
+	h.check(typed && (await mode(page)) === 'edit', '1.9 I typed into a text field does not toggle');
+	await page.evaluate(() => document.getElementById('em-probe')?.remove());
+
+	// ---------------------------------------------------------------- fixtures
+	const box = await page.evaluate(() => {
+		const s = window.__stores;
+		s.commandsHandler.sceneCommand('/create box');
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.children[group.children.length - 1];
+		o.name = 'Target';
+		o.position.set(2.5, 0.5, 0);
+		delete o.userData.physics;
+		o.updateMatrixWorld();
+		s.objectsGroup.update((v) => v);
+		return o.uuid;
+	});
+	await page.waitForTimeout(800);
+	await page.evaluate((uuid) => {
+		// re-seat after /create's own re-seat (the documented trap)
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.getObjectByProperty('uuid', uuid);
+		o.position.set(2.5, 0.5, 0);
+		delete o.userData.physics;
+		o.updateMatrixWorld();
+		window.__stores.objectActions.deselectObject();
+	}, box);
+
+	// ---------------------------------------------------------------- 2
+	console.log('\n=== 2. a module click handler: edit-only vs the default ===');
+	await page.evaluate(async () => {
+		window.__emCalls = { edit: 0, dflt: 0 };
+		await window.__stores.moduleSDK.initModules([
+			{
+				id: 'emtest',
+				name: 'Editor modes test',
+				version: '1.0.0',
+				description: 'click handlers with and without {modes}',
+				register(api) {
+					api.registerClickHandler((o) => {
+						if (o?.name === 'Target') window.__emCalls.edit++;
+						return false;
+					}, { modes: ['edit'] });
+					api.registerClickHandler((o) => {
+						if (o?.name === 'Target') window.__emCalls.dflt++;
+						return false;
+					});
+				}
+			}
+		]);
+	});
+	let aim = await aimAt(page, { uuid: box });
+	h.check(aim?.hitsTarget && aim.onCanvas, `2.1 (premise) the pixel lands on the Target through the app's pick (${aim?.first})`);
+	await page.mouse.click(aim.x, aim.y);
+	await page.waitForTimeout(400);
+	let calls = await page.evaluate(() => ({ ...window.__emCalls }));
+	h.check(calls.edit === 1, `2.2 in EDIT a handler registered {modes:['edit']} runs (${calls.edit})`);
+	h.check(calls.dflt === 0, `2.3 ...and a handler with no {modes} does NOT (${calls.dflt})`);
+	h.check((await selection(page)).includes(box), '2.4 ...and the click selected the Target');
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.waitForTimeout(1700); // out of the double-click AND the cycle window
+	await page.mouse.click(aim.x, aim.y);
+	await page.waitForTimeout(400);
+	calls = await page.evaluate(() => ({ ...window.__emCalls }));
+	h.check(calls.dflt === 1, `2.5 in INTERACT the default handler runs (${calls.dflt})`);
+	h.check(calls.edit === 1, `2.6 ...and the edit-only one does not (${calls.edit})`);
+	h.check((await selection(page)).length === 0, '2.7 ...and nothing is selected');
+
+	// ---------------------------------------------------------------- 3
+	console.log('\n=== 3. an On Click node fires only in INTERACT (and replicates) ===');
+	await page.evaluate((uuid) => {
+		const s = window.__stores;
+		s.flowNodes.set([
+			{ id: 'emclick', type: 'onclick', position: { x: 0, y: 0 }, data: { type: 'onclick', pulse: 0.3 } },
+			{ id: 'emsel', type: 'objectselector', position: { x: 240, y: 0 }, data: { type: 'objectselector', label: 'Object Selector', selected: uuid } }
+		]);
+		s.flowEdges.set([{ id: 'e-emclick-emsel', source: 'emclick', target: 'emsel' }]);
+	}, box);
+	await page.waitForTimeout(900);
+	await page.evaluate((peerId) => window.__stores.nodesHandler.sendNodes(peerId), B.id);
+	await h.eventually(
+		() => read(B.page, 'flowNodes'),
+		(nodes) => nodes.some((n) => n.id === 'emclick'),
+		'3.1 (premise) the peer holds the On Click graph'
+	);
+	await page.waitForTimeout(700); // the actionSeenAt settle (a peer's first tick)
+	const stamp = (p) => p.page.evaluate(() => {
+		let t;
+		window.__stores.flowTriggers.subscribe((v) => (t = v))();
+		return t?.emclick?.lastT ?? null;
+	});
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await page.waitForTimeout(1700);
+	const beforeEdit = await stamp(A);
+	await page.mouse.click(aim.x, aim.y);
+	await page.waitForTimeout(700);
+	h.check((await stamp(A)) === beforeEdit, `3.2 an EDIT click does not fire the On Click node (${await stamp(A)})`);
+	h.check((await selection(page)).includes(box), '3.3 ...it selects instead');
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await page.waitForTimeout(1700);
+	await page.mouse.click(aim.x, aim.y);
+	await page.waitForTimeout(500);
+	const fired = await stamp(A);
+	h.check(fired !== null && fired !== beforeEdit, `3.4 an INTERACT click fires it (${fired})`);
+	await h.eventually(() => stamp(B), (t) => t !== null && Math.abs(t - fired) < 1e-6, '3.5 ...and the pulse reaches the peer');
+
+	// ---------------------------------------------------------------- 4
+	console.log('\n=== 4. entering INTERACT puts the gizmo away; EDIT brings it back ===');
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await page.evaluate((uuid) => window.__stores.objectActions.selectObject(uuid), box);
+	await page.waitForTimeout(300);
+	const gizmoOn = await page.evaluate(() => {
+		let c;
+		window.__stores.TControls.subscribe((v) => (c = v))();
+		return !!c?.object;
+	});
+	h.check(gizmoOn, '4.1 (premise) a selected object carries the gizmo in EDIT');
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await page.waitForTimeout(200);
+	const gizmoOff = await page.evaluate(() => {
+		let c;
+		window.__stores.TControls.subscribe((v) => (c = v))();
+		return !!c?.object;
+	});
+	h.check(!gizmoOff, '4.2 INTERACT detaches it');
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await page.waitForTimeout(200);
+	const gizmoBack = await page.evaluate(() => {
+		let c;
+		window.__stores.TControls.subscribe((v) => (c = v))();
+		return !!c?.object;
+	});
+	h.check(gizmoBack, '4.3 ...and EDIT re-seats it on the selection');
+
+	// ---------------------------------------------------------------- 5
+	console.log('\n=== 5. the music-lab piano: EDIT selects it, INTERACT plays it ===');
+	const installed = await h.installModule(A, 'music-lab');
+	if (!installed) {
+		console.log('SKIP music-lab zip not found at ' + h.moduleZipPath('music-lab'));
+	} else {
+		await page.evaluate(() => {
+			const item = window.__stores.moduleSDK.moduleMenuItems;
+			let list;
+			item.subscribe((v) => (list = v))();
+			list.find((m) => m.label === 'Music Lab: piano + speaker').action();
+		});
+		await h.eventually(
+			() => page.evaluate(() => {
+				let group;
+				window.__stores.objectsGroup.subscribe((v) => (group = v))();
+				return !!group.getObjectByName('key-60');
+			}),
+			(v) => v,
+			'5.1 (premise) the piano is built, keys and all'
+		);
+		const piano = await page.evaluate(() => {
+			let group;
+			window.__stores.objectsGroup.subscribe((v) => (group = v))();
+			let node = group.getObjectByName('key-60');
+			while (node.parent && node.parent !== group) node = node.parent;
+			window.__stores.objectActions.focusObject(node.uuid);
+			return node.uuid;
+		});
+		await page.waitForTimeout(900);
+		await page.evaluate(() => window.__stores.objectActions.deselectObject());
+		aim = await aimAt(page, { name: 'key-60', top: true });
+		h.check(aim?.first?.startsWith('key-') && aim.onCanvas, `5.2 (premise) the pixel lands on a piano KEY (${aim?.first})`);
+		await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+		await page.evaluate(() => (window.__sent.length = 0));
+		await page.mouse.click(aim.x, aim.y);
+		await page.waitForTimeout(500);
+		let out = await sent(page);
+		h.check((await selection(page)).includes(piano), '5.3 in EDIT a click on a piano key SELECTS the piano');
+		h.check(!out.includes('devicenote'), `5.4 ...and plays nothing (${out.filter((t) => t === 'devicenote').length} notes)`);
+		await page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+		await page.evaluate(() => window.__stores.objectActions.deselectObject());
+		await page.waitForTimeout(1700);
+		await page.evaluate(() => (window.__sent.length = 0));
+		await page.mouse.click(aim.x, aim.y);
+		await page.waitForTimeout(500);
+		out = await sent(page);
+		h.check(out.includes('devicenote'), `5.5 in INTERACT the same click plays a note (${out.filter((t) => t === 'devicenote').length})`);
+		h.check((await selection(page)).length === 0, '5.6 ...and selects nothing');
+	}
+
+	// ---------------------------------------------------------------- 6
+	console.log('\n=== 6. INTERACT grabs a dynamic body with the CURSOR while a sim runs ===');
+	await page.evaluate(() => window.__stores.physics.warmup().catch(() => {}));
+	await page.waitForTimeout(2500);
+	const crate = await page.evaluate(() => {
+		const s = window.__stores;
+		s.commandsHandler.sceneCommand('/create box');
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.children[group.children.length - 1];
+		o.name = 'Crate';
+		return o.uuid;
+	});
+	await page.waitForTimeout(800);
+	await page.evaluate((uuid) => {
+		const s = window.__stores;
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.getObjectByProperty('uuid', uuid);
+		o.position.set(-2, 0.5, 1);
+		o.userData.physics = { mode: 'dynamic', mass: 1 };
+		o.updateMatrixWorld();
+		s.scenePhysics.setScenePhysics({ ground: { enabled: true, height: 0 } });
+		s.objectActions.deselectObject();
+		s.objectActions.focusObject(uuid);
+	}, crate);
+	await page.waitForTimeout(900);
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.evaluate(() => window.__stores.physics.toggleSimulation());
+	await h.eventually(() => page.evaluate(() => window.__stores.physics.physicsDebug().length), (n) => n > 0, '6.1 (premise) the simulation runs');
+	await page.waitForTimeout(800);
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	aim = await aimAt(page, { uuid: crate });
+	h.check(aim?.hitsTarget && aim.onCanvas, `6.2 (premise) the pixel lands on the crate (${aim?.first})`);
+	const camBefore = await page.evaluate(() => {
+		let c;
+		window.__stores.globalCamera.subscribe((v) => (c = v))();
+		return c.position.toArray();
+	});
+	const start = await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return group.getObjectByProperty('uuid', uuid).position.toArray();
+	}, crate);
+	await page.mouse.move(aim.x, aim.y);
+	await page.mouse.down();
+	await page.waitForTimeout(250);
+	const dbg = await page.evaluate(() => window.__stores.playInteract.playInteractDebug());
+	h.check(dbg.carrying === crate, `6.3 pressing on the crate GRABS it (${dbg.carrying})`);
+	for (let i = 1; i <= 12; i++) {
+		await page.mouse.move(aim.x + i * 12, aim.y - i * 8);
+		await page.waitForTimeout(40);
+	}
+	await page.waitForTimeout(700);
+	const carried = await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return group.getObjectByProperty('uuid', uuid).position.toArray();
+	}, crate);
+	await page.mouse.up();
+	await page.waitForTimeout(300);
+	const moved = Math.hypot(carried[0] - start[0], carried[1] - start[1], carried[2] - start[2]);
+	h.check(moved > 0.3, `6.4 ...and it follows the CURSOR (moved ${moved.toFixed(2)} m)`);
+	h.check(carried[1] > start[1] + 0.1, `6.5 ...up the screen means up in the world (${start[1].toFixed(2)} -> ${carried[1].toFixed(2)})`);
+	const camAfter = await page.evaluate(() => {
+		let c;
+		window.__stores.globalCamera.subscribe((v) => (c = v))();
+		return c.position.toArray();
+	});
+	const camMoved = Math.hypot(camAfter[0] - camBefore[0], camAfter[1] - camBefore[1], camAfter[2] - camBefore[2]);
+	h.check(camMoved < 0.05, `6.6 the drag carried the crate and did NOT orbit the camera (${camMoved.toFixed(3)})`);
+	const after = await page.evaluate(() => window.__stores.playInteract.playInteractDebug());
+	h.check(after.carrying === null, '6.7 releasing lets go');
+	h.check((await selection(page)).length === 0, '6.8 ...and nothing was selected');
+	const orbitOn = await page.evaluate(() => {
+		let oc;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		return oc?.enabled;
+	});
+	h.check(orbitOn === true, '6.9 the camera controls are back after the carry');
+	await page.evaluate(() => window.__stores.physics.stopSimulation());
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+
+	// ---------------------------------------------------------------- 7
+	console.log('\n=== 7. P4: api.pointerRay() under a pointer lock is the CROSSHAIR ray ===');
+	await page.mouse.move(40, 300); // a mouse ray well off-centre
+	await page.waitForTimeout(100);
+	const rays = await page.evaluate(() => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let renderer;
+		s.globalRenderer.subscribe((v) => (renderer = v))();
+		const free = s.moduleSDK.pointerRayNow();
+		const freeDir = free ? free.ray.direction.toArray() : null;
+		let lockEl = renderer.domElement;
+		Object.defineProperty(document, 'pointerLockElement', { configurable: true, get: () => lockEl });
+		s.isLocked.set(true);
+		const locked = s.moduleSDK.pointerRayNow();
+		let camera;
+		s.globalCamera.subscribe((v) => (camera = v))();
+		const centre = new THREE.Raycaster();
+		centre.setFromCamera(new THREE.Vector2(0, 0), camera);
+		const out = {
+			freeDir,
+			lockedDir: locked ? locked.ray.direction.toArray() : null,
+			centreDir: centre.ray.direction.toArray(),
+			lockedOrigin: locked ? locked.ray.origin.toArray() : null,
+			centreOrigin: centre.ray.origin.toArray()
+		};
+		s.isLocked.set(null);
+		lockEl = null;
+		delete document.pointerLockElement;
+		const after = s.moduleSDK.pointerRayNow();
+		out.afterDir = after ? after.ray.direction.toArray() : null;
+		return out;
+	});
+	const dot = (a, b) => a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
+	h.check(rays.freeDir && dot(rays.freeDir, rays.centreDir) < 0.999, '7.1 (premise) the mouse ray is off-centre');
+	h.check(rays.lockedDir && dot(rays.lockedDir, rays.centreDir) > 0.99999, `7.2 under a lock pointerRay is the crosshair ray (dot ${rays.lockedDir ? dot(rays.lockedDir, rays.centreDir).toFixed(6) : 'null'})`);
+	h.check(rays.lockedOrigin && Math.hypot(...rays.lockedOrigin.map((v, i) => v - rays.centreOrigin[i])) < 1e-6, '7.3 ...from the camera');
+	h.check(rays.afterDir && dot(rays.afterDir, rays.freeDir) > 0.99999, '7.4 unlocked, it is the mouse ray again');
+
+	h.check(h.pageErrors(A).filter((m) => /setPointerCapture/.test(m)).length === 0, 'no pointer-capture errors in the run');
+	await h.finish(browser);
+});
diff --git a/tests/e2e/fakeXR.cjs b/tests/e2e/fakeXR.cjs
new file mode 100644
index 00000000..7cdadfd2
--- /dev/null
+++ b/tests/e2e/fakeXR.cjs
@@ -0,0 +1,175 @@
+// 30b: a FAKE XR SESSION for headless suites. Headless Chromium cannot present WebXR, so
+// the VR suites before this drove the pure exports one by one. This drives the REAL
+// per-frame path instead: `renderer.xr.getSession` answers a fake session whose two
+// inputSources carry gamepads the suite presses, and Scene's own useTask then runs
+// `updateVRControls()` (grips, sticks, buttons) every frame exactly as in a headset.
+// Controller poses are written straight into the controller groups' MATRICES
+// (WebXRManager owns them, `matrixAutoUpdate` is false — the vr-teleport-handedness trick).
+//
+// Page-side state lives on `window.__fakeXR`; every helper here is a thin page.evaluate.
+
+/** Install the session (idempotent). Slot 0 = left, slot 1 = right. @param {any} page */
+async function install(page) {
+	await page.evaluate(() => {
+		if (window.__fakeXR) return;
+		const s = window.__stores;
+		let r;
+		s.globalRenderer.subscribe((v) => (r = v))();
+		const pad = () => ({
+			buttons: Array.from({ length: 6 }, () => ({ pressed: false, touched: false, value: 0 })),
+			axes: [0, 0, 0, 0],
+			hapticActuators: [{ pulses: [], pulse(i, ms) { this.pulses.push([i, ms]); return Promise.resolve(true); } }]
+		});
+		const sources = [
+			{ handedness: 'left', gamepad: pad() },
+			{ handedness: 'right', gamepad: pad() }
+		];
+		const session = { inputSources: sources, addEventListener() {}, removeEventListener() {} };
+		const original = r.xr.getSession.bind(r.xr);
+		r.xr.getSession = () => (window.__fakeXR?.on ? session : original());
+		r.xr.getController(0).userData.handedness = 'left';
+		r.xr.getController(1).userData.handedness = 'right';
+		window.__fakeXR = { on: true, session, sources, renderer: r, restore: () => (r.xr.getSession = original) };
+	});
+}
+
+/** @param {any} page @param {boolean} on */
+async function setOn(page, on) {
+	await page.evaluate((on) => {
+		window.__fakeXR.on = on;
+	}, on);
+}
+
+/**
+ * Pose a controller: world position + a yaw/pitch aim (radians; yaw 0 aims -Z).
+ * @param {any} page @param {'left'|'right'} hand @param {number[]} pos @param {{yaw?: number, pitch?: number}} [aim]
+ */
+async function pose(page, hand, pos, aim = {}) {
+	await page.evaluate(
+		({ hand, pos, aim }) => {
+			const { renderer } = window.__fakeXR;
+			const THREE = window.__stores.THREE;
+			const c = renderer.xr.getController(hand === 'left' ? 0 : 1);
+			const q = new THREE.Quaternion().setFromEuler(new THREE.Euler(aim.pitch ?? 0, aim.yaw ?? 0, 0, 'YXZ'));
+			c.matrix.compose(new THREE.Vector3(...pos), q, new THREE.Vector3(1, 1, 1));
+			c.updateMatrixWorld(true);
+		},
+		{ hand, pos, aim }
+	);
+}
+
+/** Press or release a gamepad button (0 trigger, 1 grip, 3 stick, 4 A/X, 5 B/Y).
+ * @param {any} page @param {'left'|'right'} hand @param {number} index @param {boolean} down */
+async function button(page, hand, index, down) {
+	await page.evaluate(
+		({ hand, index, down }) => {
+			const src = window.__fakeXR.sources.find((s) => s.handedness === hand);
+			src.gamepad.buttons[index].pressed = down;
+			src.gamepad.buttons[index].value = down ? 1 : 0;
+		},
+		{ hand, index, down }
+	);
+}
+
+/** Stick axes (xr-standard: axes[2] x, axes[3] y; stick UP is NEGATIVE y).
+ * @param {any} page @param {'left'|'right'} hand @param {number} x @param {number} y */
+async function stick(page, hand, x, y) {
+	await page.evaluate(
+		({ hand, x, y }) => {
+			const src = window.__fakeXR.sources.find((s) => s.handedness === hand);
+			src.gamepad.axes[2] = x;
+			src.gamepad.axes[3] = y;
+		},
+		{ hand, x, y }
+	);
+}
+
+/** haptic pulses recorded per hand @param {any} page */
+async function pulses(page) {
+	return page.evaluate(() =>
+		Object.fromEntries(window.__fakeXR.sources.map((s) => [s.handedness, s.gamepad.hapticActuators[0].pulses.length]))
+	);
+}
+
+/**
+ * A SPEC-ACCURATE reference space + frame, for suites that move the player. WebXR:
+ * `space.getOffsetReferenceSpace(t)` makes a space whose origin sits at `t` in the old one,
+ * and a pose in it is `inverse(accumulated origin offset) * the pose in the base space`.
+ * The head stands at `head` (base-space metres) facing `yaw`; the renderer's reference
+ * space becomes the base, and `vrControls.noteXRBaseSpace()` remembers it the way Scene's
+ * onsessionstart does.
+ * @param {any} page @param {{head?: number[], yaw?: number}} [opts]
+ */
+async function installSpace(page, opts = {}) {
+	await page.evaluate(({ head, yaw }) => {
+		const fx = window.__fakeXR;
+		const THREE = window.__stores.THREE;
+		const r = fx.renderer;
+		if (typeof window.XRRigidTransform === 'undefined') {
+			window.XRRigidTransform = class {
+				constructor(p = {}, o = {}) {
+					this.position = { x: p.x ?? 0, y: p.y ?? 0, z: p.z ?? 0, w: 1 };
+					this.orientation = { x: o.x ?? 0, y: o.y ?? 0, z: o.z ?? 0, w: o.w ?? 1 };
+				}
+			};
+		}
+		const basePose = new THREE.Matrix4().compose(
+			new THREE.Vector3(...head),
+			new THREE.Quaternion().setFromEuler(new THREE.Euler(0, yaw, 0, 'YXZ')),
+			new THREE.Vector3(1, 1, 1)
+		);
+		const makeSpace = (m) => ({
+			__m: m,
+			getOffsetReferenceSpace(t) {
+				const p = t.position;
+				const o = t.orientation;
+				const offset = new THREE.Matrix4().compose(
+					new THREE.Vector3(p.x, p.y, p.z),
+					new THREE.Quaternion(o.x, o.y, o.z, o.w),
+					new THREE.Vector3(1, 1, 1)
+				);
+				return makeSpace(m.clone().multiply(offset));
+			}
+		});
+		const base = makeSpace(new THREE.Matrix4());
+		const poseIn = (space) => {
+			const m = space.__m.clone().invert().multiply(basePose);
+			const pos = new THREE.Vector3();
+			const q = new THREE.Quaternion();
+			m.decompose(pos, q, new THREE.Vector3());
+			return { transform: { position: { x: pos.x, y: pos.y, z: pos.z }, orientation: { x: q.x, y: q.y, z: q.z, w: q.w } } };
+		};
+		const frame = { getViewerPose: (space) => (space?.__m ? poseIn(space) : null) };
+		fx.originalGetFrame = fx.originalGetFrame ?? r.xr.getFrame.bind(r.xr);
+		r.xr.getFrame = () => (window.__fakeXR?.on ? frame : fx.originalGetFrame());
+		r.xr.setReferenceSpace(base);
+		fx.base = base;
+		fx.poseNow = () => {
+			const pose = poseIn(r.xr.getReferenceSpace());
+			const p = pose.transform.position;
+			const o = pose.transform.orientation;
+			const fwd = new THREE.Vector3(0, 0, -1).applyQuaternion(new THREE.Quaternion(o.x, o.y, o.z, o.w));
+			return { x: p.x, y: p.y, z: p.z, yaw: Math.atan2(-fwd.x, -fwd.z) };
+		};
+		window.__stores.vrControls.noteXRBaseSpace();
+	}, { head: opts.head ?? [0, 1.6, 0], yaw: opts.yaw ?? 0 });
+}
+
+/** the head in the CURRENT reference space (= world, the dolly never moves) @param {any} page */
+async function head(page) {
+	return page.evaluate(() => window.__fakeXR.poseNow());
+}
+
+/** uninstall: the renderer's own getSession comes back @param {any} page */
+async function uninstall(page) {
+	await page.evaluate(() => {
+		if (!window.__fakeXR) return;
+		const fx = window.__fakeXR;
+		if (fx.originalGetFrame) fx.renderer.xr.getFrame = fx.originalGetFrame;
+		if (fx.base) fx.renderer.xr.setReferenceSpace(null);
+		fx.restore();
+		window.__fakeXR = null;
+	});
+}
+
+module.exports = { install, setOn, pose, button, stick, pulses, installSpace, head, uninstall };
diff --git a/tests/e2e/game-audio.test.cjs b/tests/e2e/game-audio.test.cjs
new file mode 100644
index 00000000..67d29852
--- /dev/null
+++ b/tests/e2e/game-audio.test.cjs
@@ -0,0 +1,190 @@
+// 30b (vr-play) P0 — C5 SOUND AND MUSIC. The user, from a Quest: "There is also no score,
+// no sounds, fix this" / "Make for each game improvements, add sounds, music".
+//
+// 1 every name in the game sound set RENDERS a real sound (offline, measured) · 2 the SDK
+// routes playSound: a game name plays, a ping name still plays, an unknown name is a quiet
+// no-op · 3 a game sound reaches the speakers (the destination tap, measured live) · 4 every
+// music preset renders a real bar · 5 music is REFUSED in Edit · 6 music plays in Interact,
+// on the SESSION step grid, audibly · 7 leaving Interact stops it and the output goes
+// silent · 8 the same in desktop Play · 9 the two volumes are LOCAL, persisted, and reach
+// the gains · 10 the Settings rows drive the stores.
+const h = require('./helpers.cjs');
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.AUDIO_ARGS });
+	const A = await h.setupPage(browser, 'A', { audio: true });
+	const page = A.page;
+
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		await s.moduleSDK.initModules([
+			{ id: 'audio30b', name: 'Audio test', version: '1.0.0', description: 'the 30b sound seams', register(api) { window.__api = api; } }
+		]);
+	});
+
+	console.log('\n=== 1. every game sound renders a real sound ===');
+	const renders = await page.evaluate(async () => {
+		const k = window.__stores.gameKit.gameSfx;
+		const out = [];
+		for (const name of k.GAME_SOUNDS) out.push(await k.renderGameSound(name));
+		return out;
+	});
+	h.check(renders.length === 20, '1.1 the set holds the 20 contract names (' + renders.length + ')');
+	const quiet = renders.filter((r) => !r || r.rms < 0.004 || r.peak < 0.02);
+	h.check(quiet.length === 0, '1.2 every name renders energy (quiet: ' + JSON.stringify(quiet.map((r) => r && r.name)) + ')');
+	const distinct = new Set(renders.map((r) => r && Math.round(r.rms * 1e5)));
+	h.check(distinct.size >= 18, '1.3 the sounds are distinct from each other (' + distinct.size + ' distinct levels)');
+	const unknownRender = await page.evaluate(() => window.__stores.gameKit.gameSfx.renderGameSound('nope'));
+	h.check(unknownRender && unknownRender.seconds === -1 && unknownRender.rms === 0, '1.4 an unknown name builds nothing');
+
+	console.log('\n=== 2. the SDK routes playSound ===');
+	const routed = await page.evaluate(async () => {
+		const k = window.__stores.gameKit.gameSfx;
+		const before = k.gameSfxDebug();
+		const coin = window.__api.playSound('coin', [0, 1, -2]);
+		const mid = k.gameSfxDebug();
+		const unknown = window.__api.playSound('definitely-not-a-sound');
+		const after = k.gameSfxDebug();
+		// the ping chimes still play through their own module (primed at boot)
+		await new Promise((r) => setTimeout(r, 300));
+		const ding = window.__api.playSound('ding');
+		return { coin, unknown, ding, played: mid.played - before.played, playedAfter: after.played - mid.played, last: mid.last };
+	});
+	h.check(routed.coin === true && routed.played === 1 && routed.last === 'coin', '2.1 playSound("coin") plays the game coin (' + JSON.stringify(routed) + ')');
+	h.check(routed.unknown === false && routed.playedAfter === 0, '2.2 an unknown name is a quiet no-op (it used to fall through to the ding)');
+	h.check(routed.ding === true, '2.3 a ping name still plays');
+
+	console.log('\n=== 3. a game sound reaches the speakers ===');
+	await page.waitForTimeout(1200); // let 2's sounds ring out
+	await page.evaluate(() => window.__api.playSound('explosion'));
+	const live = await h.audioMetrics(A, 500);
+	h.check(!live.silent && live.peak > 0.01, '3.1 the explosion is audible at the destination (peak ' + live.peak.toFixed(4) + ')');
+
+	console.log('\n=== 4. every music preset renders a real bar ===');
+	const bars = await page.evaluate(async () => {
+		const m = window.__stores.gameKit.gameMusic;
+		const out = [];
+		for (const id of m.MUSIC_PRESET_IDS) out.push(await m.renderGameMusic(id, 1));
+		return out;
+	});
+	h.check(bars.length === 7, '4.1 seven presets (' + bars.map((b) => b && b.preset).join(',') + ')');
+	const flat = bars.filter((b) => !b || b.rms < 0.003 || b.notes < 4);
+	h.check(flat.length === 0, '4.2 every preset plays notes with energy (' + JSON.stringify(bars.map((b) => b && [b.preset, +b.rms.toFixed(4), b.notes])) + ')');
+
+	await page.waitForTimeout(1500); // the explosion's tail
+	console.log('\n=== 5. music is refused in Edit ===');
+	const refused = await page.evaluate(() => {
+		const s = window.__stores;
+		s.objectActions.setEditorMode('edit');
+		return { ok: window.__api.music.play('arcade'), current: window.__api.music.current() };
+	});
+	h.check(refused.ok === false && refused.current === null, '5.1 music.play from the editor returns false and plays nothing');
+	const editQuiet = await h.audioMetrics(A, 400);
+	h.check(editQuiet.silent, '5.2 the output is silent (peak ' + editQuiet.peak.toFixed(4) + ')');
+
+	console.log('\n=== 6. music plays in Interact, on the session step grid ===');
+	const started = await page.evaluate(() => {
+		const s = window.__stores;
+		s.objectActions.setEditorMode('interact');
+		return { ok: window.__api.music.play('arcade', { volume: 0.8 }), current: window.__api.music.current(), unknown: window.__api.music.play('polka') };
+	});
+	h.check(started.ok === true && started.current === 'arcade', '6.1 music.play("arcade") starts in Interact');
+	h.check(started.unknown === false && (await page.evaluate(() => window.__api.music.current())) === 'arcade', '6.2 an unknown preset is refused and the current one keeps playing');
+	await page.waitForTimeout(900);
+	const grid = await page.evaluate(() => {
+		const k = window.__stores.gameKit;
+		const d = k.gameMusic.gameMusicDebug();
+		const stepMs = k.gameMusicPresets.stepSeconds(k.gameMusicPresets.musicPreset('arcade')) * 1000;
+		const now = window.__stores.connectionState?.sessionNow?.() ?? null;
+		return { d, stepMs, now };
+	});
+	h.check(grid.d.steps >= 5 && grid.d.notes > 0, '6.3 the scheduler scheduled steps and notes (' + JSON.stringify(grid.d) + ')');
+	const audible = await h.audioMetrics(A, 700);
+	h.check(!audible.silent && audible.peak > 0.005, '6.4 the music is audible (peak ' + audible.peak.toFixed(4) + ')');
+	const synced = await page.evaluate(async () => {
+		const k = window.__stores.gameKit;
+		const { sessionNow } = await import('/src/lib/sessionClock.js');
+		const d = k.gameMusic.gameMusicDebug();
+		const stepMs = k.gameMusicPresets.stepSeconds(k.gameMusicPresets.musicPreset('arcade')) * 1000;
+		// the last scheduled step sits inside the lookahead window of the SESSION clock
+		const lead = d.lastStep * stepMs - sessionNow();
+		return { lead, stepMs };
+	});
+	h.check(synced.lead > -synced.stepMs && synced.lead < 250, '6.5 steps are numbered off the session clock (last step leads now by ' + synced.lead.toFixed(1) + ' ms)');
+
+	console.log('\n=== 7. leaving Interact stops the music ===');
+	const stopped = await page.evaluate(() => {
+		window.__stores.objectActions.setEditorMode('edit');
+		return { current: window.__api.music.current(), gain: window.__stores.gameKit.gameMusic.gameMusicGainValue() };
+	});
+	h.check(stopped.current === null && stopped.gain === null, '7.1 back to Edit: nothing is playing');
+	await page.waitForTimeout(700);
+	const afterStop = await h.audioMetrics(A, 500);
+	h.check(afterStop.silent, '7.2 the output went silent (peak ' + afterStop.peak.toFixed(4) + ')');
+
+	console.log('\n=== 8. the same in desktop Play ===');
+	const playPath = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.isLocked.set(true);
+		const ok = window.__api.music.play('dungeon');
+		const during = window.__api.music.current();
+		s.isLocked.set(false);
+		const after = window.__api.music.current();
+		await new Promise((r) => setTimeout(r, 50));
+		return { ok, during, after };
+	});
+	h.check(playPath.ok && playPath.during === 'dungeon', '8.1 music plays in Play');
+	h.check(playPath.after === null, '8.2 leaving Play stops it');
+
+	console.log('\n=== 9. the volumes are local, persisted, and reach the gains ===');
+	const vols = await page.evaluate(async () => {
+		const s = window.__stores;
+		const k = s.gameKit;
+		k.gameSfx.gameSoundVolume.set(0.25);
+		window.__api.playSound('click');
+		const sfxGain = k.gameSfx.gameSoundGainValue();
+		s.objectActions.setEditorMode('interact');
+		window.__api.music.play('puzzle', { volume: 0.5 });
+		k.gameMusic.gameMusicVolume.set(0.4);
+		const musicGain = k.gameMusic.gameMusicGainValue();
+		window.__api.music.stop();
+		s.objectActions.setEditorMode('edit');
+		return {
+			sfxGain,
+			musicGain,
+			sfxKey: localStorage.getItem('game:soundVolume'),
+			musicKey: localStorage.getItem('game:musicVolume')
+		};
+	});
+	h.check(Math.abs(vols.sfxGain - 0.25) < 1e-6 && vols.sfxKey === '0.25', '9.1 the Game sounds volume sets the gain and persists (' + JSON.stringify(vols) + ')');
+	h.check(Math.abs(vols.musicGain - 0.55 * 0.4 * 0.5) < 1e-6 && vols.musicKey === '0.4', '9.2 the Music volume (x the call volume, under the effects) sets the gain and persists');
+
+	console.log('\n=== 10. the Settings rows drive the stores ===');
+	await page.evaluate(() => window.__stores.settingsOpen.set(true));
+	await page.waitForTimeout(600);
+	// the Interface section holds the rows; open it if it is collapsed
+	const hasRow = await page.evaluate(() => !!document.querySelector('#setting-game-sound-volume'));
+	if (!hasRow) await page.getByText('Interface', { exact: true }).first().click().catch(() => {});
+	await page.waitForSelector('#setting-game-sound-volume', { timeout: 5000 }).catch(() => {});
+	const rows = await page.evaluate(() => {
+		const s = window.__stores.gameKit;
+		const set = (id, v) => {
+			const el = document.querySelector(id);
+			if (!el) return false;
+			el.value = String(v);
+			el.dispatchEvent(new Event('input', { bubbles: true }));
+			el.dispatchEvent(new Event('change', { bubbles: true }));
+			return true;
+		};
+		const a = set('#setting-game-sound-volume', 0.6);
+		const b = set('#setting-game-music-volume', 0.35);
+		let sv, mv;
+		s.gameSfx.gameSoundVolume.subscribe((v) => (sv = v))();
+		s.gameMusic.gameMusicVolume.subscribe((v) => (mv = v))();
+		return { a, b, sv, mv };
+	});
+	h.check(rows.a && rows.b, '10.1 both rows render in Settings');
+	h.check(Math.abs(rows.sv - 0.6) < 1e-6 && Math.abs(rows.mv - 0.35) < 1e-6, '10.2 dragging them sets the stores (' + JSON.stringify(rows) + ')');
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-dungeon-realms.test.cjs b/tests/e2e/game-dungeon-realms.test.cjs
index cbb17627..025fc122 100644
--- a/tests/e2e/game-dungeon-realms.test.cjs
+++ b/tests/e2e/game-dungeon-realms.test.cjs
@@ -130,7 +130,9 @@ const snap = (page) =>
 			need: game?.gemTotals().need ?? 0,
 			total: game?.gemTotals().total ?? 0,
 			gameFloor: game?.state.floorIndex ?? null,
-			menu: !!document.getElementById('dr-menu'),
+			// 30-visuals-mod: the Start menu is a core HUD screen (input: 'menu'); the module's DOM
+			// card stays silenced in the template (drmenu show: 'never')
+			menu: window.__stores.hudDocs.visibleScreen('scene')?.id === 'menu' && !document.getElementById('dr-menu'),
 			resolvedGrounded: window.__stores.playSettings.resolvePlaySettings(scene).grounded
 		};
 	});
@@ -172,10 +174,11 @@ const pressP = (page) =>
 		window.dispatchEvent(new KeyboardEvent('keyup', { code: 'KeyP', bubbles: true }));
 	});
 const hudButton = (page, name) => page.getByRole('button', { name, exact: true });
-/** click a module MENU button by its action id (the module DOM menu) */
+/** click a MENU button by its action id (the HUD Start menu since 30-visuals-mod) */
 const clickMenu = (page, id) =>
 	page.evaluate((id) => {
-		const button = document.querySelector('#dr-menu .dr-btn[data-id="' + id + '"]');
+		const label = { 'join-p1': 'Join as Player 1', 'join-p2': 'Join as Player 2', start: 'Start adventure', 'new-dungeon': 'New dungeon' }[id];
+		const button = [...document.querySelectorAll('#hud-layer button')].find((b) => b.textContent.trim().startsWith(label));
 		if (!button) return false;
 		button.click();
 		return true;
@@ -240,13 +243,13 @@ h.run(async () => {
 	await A.page.waitForTimeout(2500);
 	h.check(payload.modules.includes('dungeon') && payload.modules.includes('dungeon-realms'), '1.1 the file\'s requirement list names BOTH modules (' + payload.modules.join(',') + ')');
 	const names = await namesOf(A.page);
-	h.check(Object.keys(names).length === 6 && !!names['Entrance plinth'] && !!names['Arch lintel'], '1.2 the file restored the 6 arch objects (' + Object.keys(names).length + ')');
+	h.check(Object.keys(names).length === 8 && !!names['Entrance plinth'] && !!names['Arch lintel'], '1.2 the file restored the 6 arch objects + Ground + Card camera (' + Object.keys(names).length + ')');
 	const env = await A.page.evaluate(() => {
 		let e;
 		window.__stores.environment.environment.subscribe((v) => (e = v))();
 		return e?.preset ?? null;
 	});
-	h.check(env === 'night', '1.3 the night environment preset (' + env + ')');
+	h.check(env === 'custom', '1.3 the custom dusk sky (' + env + ')');
 	const phys = await A.page.evaluate(() => window.__stores.scenePhysics.scenePhysicsDebug());
 	h.check(phys.play?.interaction === 'click' && phys.play?.grounded === true && phys.play?.simOnPlay === false, '1.4 play block: click, grounded, no sim (' + JSON.stringify(phys.play) + ')');
 	await h.eventually(() => snap(A.page), (s) => s.seed === SEED && s.floorInstances > 0 && s.overlay, '1.5 the Kit regenerated SEED ' + SEED + ' FROM THE NODE after /clear all (777 is gone) and Realms overlaid it', 15000);
@@ -255,7 +258,7 @@ h.run(async () => {
 	const dungeonNodes = await nodesOf(A.page, 'dkdungeon');
 	h.check(dungeonNodes.length === 1 && dungeonNodes[0].data.apply === true && dungeonNodes[0].data.seed === SEED, '1.7 ONE Dungeon node owns the recipe (apply on, seed ' + SEED + ')');
 	h.check((await gameStateOf(A.page)) === 'menu' && (await screenOf(A.page)) === 'menu', '1.8 the game shell starts in menu with the menu screen');
-	h.check(/DUNGEON REALMS/.test(await hudText(A.page)), '1.9 the HUD menu screen renders its title');
+	await h.eventually(() => A.page.evaluate(() => ({ chip: !!document.querySelector('#game-chip'), buttons: document.querySelectorAll('#hud-layer button').length })), (v) => v.chip && v.buttons === 0, '1.9 in the editor the game chip stands in for the menu (30 P1: no live menu over the editor)', 6000);
 	h.check(a1.resolvedGrounded === true && a1.grounded === true, '1.10 grounded resolves TRUE from the Kit contract (playSettings)');
 
 	// ---- 2. B receives it over the handshake ---------------------------------------------------
@@ -264,8 +267,8 @@ h.run(async () => {
 	// ("Entrance_plinth" — the light keeps its space), and the graph binds by uuid anyway
 	await h.eventually(
 		() => namesOf(B.page).then((n) => ({ uuids: Object.values(n), count: Object.keys(n).length })),
-		(v) => v.count === 6 && v.uuids.includes(names['Entrance plinth']),
-		'2.1 B received the 6 arch objects with the same plinth uuid',
+		(v) => v.count === 8 && v.uuids.includes(names['Entrance plinth']),
+		'2.1 B received the 8 objects with the same plinth uuid',
 		30000
 	);
 	await h.eventually(() => snap(B.page), (s) => s.seed === SEED && s.checksum === a1.checksum && s.campaignChecksum === a1.campaignChecksum && s.overlay, '2.2 B: the graph replicated and its Dungeon node built the SAME world (checksums match)', 20000);
@@ -276,6 +279,7 @@ h.run(async () => {
 	await A.page.locator('#play-button').click();
 	await B.page.locator('#play-button').click();
 	await h.eventually(() => snap(A.page), (s) => s.menu, '3.1 A: the module start menu appears in play mode');
+	await h.eventually(async () => (await hudText(A.page)) ?? '', (t) => /DUNGEON REALMS/.test(t), '3.1b in play the HUD menu screen renders its title');
 	await h.eventually(() => snap(B.page), (s) => s.menu, '3.2 B: the module start menu appears');
 	h.check(await clickMenu(A.page, 'join-p1'), '3.3 A joins as Player 1 (module menu)');
 	h.check(await clickMenu(B.page, 'join-p2'), '3.4 B joins as Player 2');
@@ -345,7 +349,7 @@ h.run(async () => {
 	await installZip(C, 'dungeon-realms', realmsZip.bytes, 'C');
 	await h.connect(C, A);
 	const aEnd = await snap(A.page);
-	await h.eventually(() => namesOf(C.page).then((n) => Object.keys(n).length), (n) => n === 6, '6.1 C received the arch', 30000);
+	await h.eventually(() => namesOf(C.page).then((n) => Object.keys(n).length), (n) => n === 8, '6.1 C received the arch', 30000);
 	await h.eventually(() => snap(C.page), (s) => s.seed === SEED && s.floorIndex === 5 && s.checksum === aEnd.checksum && s.overlay, '6.2 C: the Kit rebuilt seed ' + SEED + ' on floor 5 (same checksum) with the overlay', 30000);
 	await h.eventually(() => snap(C.page), (s) => s.collected === aEnd.collected && s.started && s.won, '6.3 C: the game state caught up (gems, started, won)', 20000);
 	await h.eventually(() => gameStateOf(C.page), (v) => v === 'over', '6.4 C: the game shell reads over');
diff --git a/tests/e2e/game-editor-flow.test.cjs b/tests/e2e/game-editor-flow.test.cjs
new file mode 100644
index 00000000..213ae7e1
--- /dev/null
+++ b/tests/e2e/game-editor-flow.test.cjs
@@ -0,0 +1,214 @@
+// 30 P1/P2 — GAMES START ON START: the editor stops masquerading as the running game.
+//
+// Before: loading a Games-tab game painted its MENU over the editor ("TOWERS / Start
+// round" on top of the scene being built) with LIVE buttons — a Start press in the editor
+// started the round for every peer with nobody in Play — and leaving Play left the round
+// `playing` with its in-game HUD on the editor.
+//
+// After: a GAME's screens are not drawn outside Play (the rule, and why it is the rule:
+// hudDocs `isGameHud` — a scene is a game when one of its HUD screens is bound to a game
+// state with `showWhile`), the HUD editor's preview eye still shows them for authoring
+// with every button INERT, and a small chip stands in for them: "Game · <state>" plus
+// ▶ Test play.
+//
+// Loaded from the REAL Towers .tpscene with the REAL collectible zip, skip-never-fail when
+// either is missing (authored content must never turn a bare checkout red).
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const path = require('path');
+
+const SCENES_REPO = [
+	path.resolve(__dirname, '../../../theprototype.app-scenes'),
+	path.resolve(__dirname, '../../../scenes')
+].find((p) => fs.existsSync(p));
+const TPSCENE =
+	process.env.TOWERS_TPSCENE || (SCENES_REPO && path.join(SCENES_REPO, 'games/towers/scene.tpscene'));
+
+/** @param {any} page */
+async function loadTowers(page) {
+	const bytes = Array.from(fs.readFileSync(TPSCENE));
+	await page.evaluate(async (arr) => {
+		const s = window.__stores;
+		const payload = await s.sessions.readSessionZip(new Uint8Array(arr).buffer);
+		await s.sessions.applySession(payload, { backup: false });
+	}, bytes);
+	await page.waitForTimeout(2000);
+}
+
+/** @param {any} page */
+const snap = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		/** @param {any} st */
+		const g = (st) => {
+			let v;
+			st.subscribe((/** @type {any} */ x) => (v = x))();
+			return v;
+		};
+		const layer = document.querySelector('#hud-layer');
+		const chip = document.querySelector('#game-chip');
+		return {
+			state: g(s.gameState.gameState)?.state ?? null,
+			locked: g(s.isLocked),
+			isGame: g(s.hudDocs.hudIsGame),
+			screen: s.hudDocs.visibleScreen('scene')?.id ?? null,
+			layer: !!layer,
+			layerText: layer?.textContent ?? '',
+			buttons: layer ? layer.querySelectorAll('button').length : 0,
+			chip: !!chip,
+			chipText: chip?.textContent?.replace(/\s+/g, ' ').trim() ?? '',
+			preview: g(s.hudDocs.hudPreviewInViewport)
+		};
+	});
+
+h.run(async () => {
+	if (!TPSCENE || !fs.existsSync(TPSCENE)) {
+		console.log('SKIP: no sibling scenes checkout with games/towers/scene.tpscene (or TOWERS_TPSCENE)');
+		return;
+	}
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A', {
+		context: { viewport: { width: 1280, height: 720 } },
+		storage: { hudPreviewInViewport: 'false' }
+	});
+	const page = A.page;
+	if (!(await h.installModule(A, 'collectible'))) {
+		console.log('SKIP: no collectible.zip in the sibling modules checkout (npm run pack -- collectible)');
+		await h.finish(browser);
+		return;
+	}
+	await loadTowers(page);
+
+	// =====================================================================
+	// 1. EDIT MODE SHOWS THE CHIP, NOT THE MENU
+	// =====================================================================
+	let st = await snap(page);
+	h.check(st.state === 'menu' && st.screen === 'menu', `premise: the game sits on its menu (${st.state}/${st.screen})`);
+	h.check(st.locked !== true, 'premise: we are in the editor, not in Play');
+	h.check(st.isGame === true, 'Towers reads as a GAME (a showWhile-bound screen)');
+	h.check(st.buttons === 0, `no HUD button exists in the editor (${st.buttons})`);
+	h.check(!/TOWERS/.test(st.layerText), 'and the menu title is not painted over the editor');
+	h.check(st.chip, 'the game chip stands in for it');
+	h.check(/Game\s*·\s*menu/.test(st.chipText), `reading "Game · menu" (${st.chipText})`);
+
+	// A REAL click where the Start button used to be changes nothing. The spot is computed
+	// from the element's own anchored rect, the rule HudLayer places it by.
+	const start = await page.evaluate(() => {
+		const s = window.__stores;
+		const doc = s.hudDocs.hudDocOf('scene');
+		const menu = doc.screens.find((sc) => sc.id === 'menu');
+		const el = menu.elements.find((e) => e.kind === 'button' && /start/i.test(String(e.label ?? e.text ?? '')));
+		if (!el) return null;
+		const r = s.hudDocs.rectInFrame(el, window.innerWidth, window.innerHeight);
+		return { x: r.left + r.w / 2, y: r.top + r.h / 2, id: el.id };
+	});
+	h.check(!!start, `premise: the Start button is in the document (${start?.id})`);
+	if (start) {
+		const under = await page.evaluate(({ x, y }) => document.elementFromPoint(x, y)?.tagName ?? null, start);
+		h.check(under !== 'BUTTON', `nothing button-shaped is under that spot in the editor (${under})`);
+		await page.mouse.click(start.x, start.y);
+		await page.waitForTimeout(900);
+		st = await snap(page);
+		h.check(st.state === 'menu', `clicking where Start used to be leaves the game on its menu (${st.state})`);
+	}
+
+	// =====================================================================
+	// 2. THE PREVIEW EYE: the author can still SEE the screens — inert
+	// =====================================================================
+	await page.locator('#game-chip-preview').click();
+	await h.eventually(() => snap(page), (v) => v.buttons > 0 && /TOWERS/.test(v.layerText), 'the preview eye paints the menu over the editor', 5000);
+	st = await snap(page);
+	h.check(st.preview === true, 'the eye IS the HUD editor\'s preview store (one switch, two surfaces)');
+	const inert = await page.evaluate(() => {
+		const b = [...document.querySelectorAll('#hud-layer button')].find((x) => /start/i.test(x.textContent ?? ''));
+		if (!b) return null;
+		const r = b.getBoundingClientRect();
+		const x = r.left + r.width / 2;
+		const y = r.top + r.height / 2;
+		const under = document.elementFromPoint(x, y);
+		return { tab: b.tabIndex, x, y, clickThrough: !b.contains(under), under: under?.tagName ?? null };
+	});
+	h.check(!!inert && inert.tab === -1, `the previewed Start is out of the tab order (${JSON.stringify(inert)})`);
+	h.check(!!inert && inert.clickThrough, `and the preview is a PICTURE of the menu: a click there reaches the viewport (${inert?.under})`);
+	// a real press on the previewed button's own pixel
+	if (inert) await page.mouse.click(inert.x, inert.y);
+	await page.waitForTimeout(900);
+	st = await snap(page);
+	h.check(st.state === 'menu', `pressing the PREVIEWED Start does nothing — buttons are inert outside Play (${st.state})`);
+	await page.locator('#game-chip-preview').click();
+	await h.eventually(() => snap(page), (v) => v.buttons === 0, 'the eye off hides the screens again', 5000);
+
+	// =====================================================================
+	// 3. ▶ TEST PLAY (solo): back to the menu, into Play, the Start screen
+	// =====================================================================
+	// leave the round somewhere Test play must undo: mid-game, with a local screen override
+	await page.evaluate(() => {
+		const s = window.__stores;
+		s.gameState.setGameState('playing');
+		s.hudDocs.showHudScreen('scene', 'pause');
+	});
+	await h.eventually(() => snap(page), (v) => v.state === 'playing', 'premise: the round is running before Test play', 4000);
+	await page.locator('#game-chip-test').click();
+	await h.eventually(() => snap(page), (v) => v.locked === true, 'Test play enters Play', 6000);
+	st = await snap(page);
+	h.check(st.state === 'menu', `...with the game reset to its menu (${st.state})`);
+	h.check(st.screen === 'menu', `...and the MENU screen showing, not the stale pause override (${st.screen})`);
+	await h.eventually(() => snap(page), (v) => /Start round/.test(v.layerText) && v.buttons > 0, 'the Start screen is in front of the player', 6000);
+	h.check(!st.chip, 'the chip is editor chrome — gone in Play');
+	await page.locator('#hud-layer button', { hasText: 'Start round' }).click();
+	await h.eventually(() => snap(page), (v) => v.state === 'playing' && v.screen === 'hud', 'Start (in Play) starts the round', 8000);
+	await page.keyboard.press('Escape');
+	await h.eventually(() => snap(page), (v) => v.locked !== true, 'Escape returns to the editor', 6000);
+	await h.eventually(() => snap(page), (v) => v.state === 'menu', 'ALONE, leaving play resets the round to its menu at once', 3000);
+	st = await snap(page);
+	h.check(st.buttons === 0 && !/Stack on the glowing pad/.test(st.layerText), `and no in-game HUD is left on the editor (${st.buttons} buttons)`);
+	h.check(/Game\s*·\s*menu/.test(st.chipText), `the chip reads the menu again (${st.chipText})`);
+
+	// the play button's right-click menu carries the same row
+	await page.locator('#play-button').click({ button: 'right' });
+	const row = page.locator('[role=menuitem]', { hasText: 'Test play (start from the menu)' });
+	await h.eventually(() => row.count(), (n) => n === 1, 'the play button right-click menu offers "Test play (start from the menu)"', 4000);
+	await row.first().click();
+	await h.eventually(() => snap(page), (v) => v.locked === true && v.state === 'menu', 'and the row enters Play on the menu', 6000);
+	await page.keyboard.press('Escape');
+	await h.eventually(() => snap(page), (v) => v.locked !== true, 'back to the editor', 6000);
+
+	// =====================================================================
+	// 4. TWO PEERS: the round ends when the LAST player leaves
+	// =====================================================================
+	const B = await h.setupPage(browser, 'B', { context: { viewport: { width: 1280, height: 720 } } });
+	if (!(await h.installModule(B, 'collectible'))) {
+		console.log('SKIP (section 4): no collectible.zip for the second peer');
+		await h.finish(browser);
+		return;
+	}
+	await h.connect(B, A);
+	await h.eventually(() => snap(B.page), (v) => v.isGame === true, 'B received the game (its HUD document)', 20000);
+	const both = async () => ({ a: await snap(page), b: await snap(B.page) });
+	// A (the host) Test-plays and starts; B joins play
+	await page.locator('#game-chip-test').click();
+	await h.eventually(() => snap(page), (v) => v.locked === true, 'A enters Play through Test play', 6000);
+	await page.locator('#hud-layer button', { hasText: 'Start round' }).click();
+	await h.eventually(() => both(), (v) => v.a.state === 'playing' && v.b.state === 'playing', 'Start in A\'s Play starts the round for both', 8000);
+	await B.page.evaluate(() => window.__stores.playMode.requestPlay());
+	await h.eventually(
+		() => page.evaluate(() => window.__stores.gamePresence.gamePresenceDebug().peers),
+		(m) => Object.values(m).includes('playing'),
+		'A sees B in play',
+		8000
+	);
+	// A leaves while B plays: the round stays
+	await page.keyboard.press('Escape');
+	await h.eventually(() => snap(page), (v) => v.locked !== true, 'A back in the editor', 6000);
+	await page.waitForTimeout(12000); // past the ten-second window: B is still playing
+	let v2 = await both();
+	h.check(v2.a.state === 'playing' && v2.b.state === 'playing', `A left while B plays: the round is still on for both (${v2.a.state}/${v2.b.state})`);
+	// B leaves too: nobody is in play, so the host commits the menu after the window
+	await B.page.keyboard.press('Escape');
+	await h.eventually(() => snap(B.page), (v) => v.locked !== true, 'B back in the editor', 6000);
+	await h.eventually(() => both(), (v) => v.a.state === 'menu' && v.b.state === 'menu', 'the LAST player leaving resets the round to menu on BOTH (the host writes it)', 20000);
+	const writes = await Promise.all([page, B.page].map((p) => p.evaluate(() => window.__stores.gamePresence.gamePresenceDebug().abandonWrites)));
+	h.check(writes[0] >= 1 && writes[1] === 0, `written by the host alone (A=${writes[0]}, B=${writes[1]})`);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-effects.test.cjs b/tests/e2e/game-effects.test.cjs
new file mode 100644
index 00000000..3103f850
--- /dev/null
+++ b/tests/e2e/game-effects.test.cjs
@@ -0,0 +1,255 @@
+// 30b (vr-play) P2 — C6 EFFECTS and api.announce. The user, on Towers: "When I reach some of
+// the rings and go to the top, it should dynamically tell me and give effects such as
+// sparkles or anything similar."
+//
+// 1 a burst is a scene-root, pooled, LOCAL particle system (nothing in objectsGroup,
+// nothing on the wire) · 2 it moves the way its kind says (confetti falls, smoke rises) ·
+// 3 it dies after its life and leaves the frame loop · 4 the pool is bounded and recycles ·
+// 5 inputs are clamped and bad ones refused · 6 it reaches the PIXELS · 7 announce shows a
+// big banner, replaces the one showing, and goes by itself · 8 a scene clear takes both.
+const h = require('./helpers.cjs');
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A', { context: { viewport: { width: 1280, height: 720 } } });
+	const page = A.page;
+
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		await s.moduleSDK.initModules([
+			{ id: 'fx30b', name: 'Effects test', version: '1.0.0', description: 'the 30b effect seams', register(api) { window.__api = api; } }
+		]);
+		window.__sent = [];
+		let peer;
+		s.peers.subscribe((p) => (peer = p))();
+		const orig = peer.send.bind(peer);
+		peer.send = (data) => {
+			window.__sent.push(data?.type);
+			return orig(data);
+		};
+	});
+	await page.waitForTimeout(600); // the primed effects import
+
+	console.log('\n=== 1. a burst is local, scene-root, pooled ===');
+	const fired = await page.evaluate(() => {
+		const s = window.__stores;
+		let scene, group;
+		s.globalScene.subscribe((v) => (scene = v))();
+		s.objectsGroup.subscribe((v) => (group = v))();
+		const before = group.children.length;
+		let rd;
+		s.globalRenderer.subscribe((v) => (rd = v))();
+		const pointsBefore = rd.info.programs.length;
+		const ok = window.__api.effects.burst([0, 1.5, -3], { kind: 'confetti' });
+		// synchronously, before ANY frame has drawn the burst
+		const pointsAfter = rd.info.programs.length;
+		const fx = s.gameKit.effectsBurst.burstDebug();
+		const live = fx.live[0];
+		const points = live ? scene.getObjectByName(live.name) : null;
+		return {
+			ok,
+			live,
+			parentIsScene: points?.parent === scene,
+			inGroup: !!group.getObjectByName(live?.name ?? '-'),
+			groupDelta: group.children.length - before,
+			drawCount: points?.geometry?.drawRange?.count ?? -1,
+			sent: window.__sent.slice(),
+			pointsBefore,
+			pointsAfter
+		};
+	});
+	h.check(fired.ok === true && fired.live?.kind === 'confetti', '1.1 api.effects.burst starts a confetti burst (' + JSON.stringify(fired.live) + ')');
+	h.check(fired.parentIsScene && !fired.inGroup && fired.groupDelta === 0, '1.2 it lives at the scene root, never in objectsGroup');
+	h.check(fired.drawCount === 80, '1.3 confetti draws its recipe count (80, got ' + fired.drawCount + ')');
+	h.check(!fired.sent.length, '1.4 nothing was sent (' + JSON.stringify(fired.sent) + ')');
+	h.check(
+		fired.pointsAfter > fired.pointsBefore,
+		'1.5 the burst program is compiled when the pool is built, not on the first draw (' + fired.pointsBefore + ' -> ' + fired.pointsAfter + ')'
+	);
+
+	console.log('\n=== 2. each kind moves the way it says ===');
+	const motion = await page.evaluate(() => {
+		const s = window.__stores;
+		const fx = s.gameKit.effectsBurst;
+		fx.clearBursts();
+		let scene;
+		s.globalScene.subscribe((v) => (scene = v))();
+		const meanY = (name) => {
+			const p = scene.getObjectByName(name);
+			const a = p.geometry.attributes.position.array;
+			const n = p.geometry.drawRange.count;
+			let y = 0;
+			for (let i = 0; i < n; i++) y += a[i * 3 + 1];
+			return y / n;
+		};
+		const spread = (name) => {
+			const p = scene.getObjectByName(name);
+			const a = p.geometry.attributes.position.array;
+			let m = 0;
+			for (let i = 0; i < p.geometry.drawRange.count; i++) m = Math.max(m, Math.hypot(a[i * 3], a[i * 3 + 1] - 1, a[i * 3 + 2]));
+			return m;
+		};
+		const c = fx.burst([0, 1, 0], { kind: 'confetti' });
+		const m = fx.burst([0, 1, 0], { kind: 'smoke' });
+		for (let i = 0; i < 12; i++) fx.stepBursts(1 / 60);
+		const early = { confetti: meanY(c), smoke: meanY(m), spread: spread(c) };
+		for (let i = 0; i < 60; i++) fx.stepBursts(1 / 60);
+		const late = { confetti: meanY(c), smoke: meanY(m) };
+		return { early, late };
+	});
+	h.check(motion.early.spread > 0.3, '2.1 the particles fly apart (' + motion.early.spread.toFixed(2) + ' m after 0.2 s)');
+	h.check(motion.late.confetti < motion.early.confetti, '2.2 confetti falls under gravity (' + motion.early.confetti.toFixed(2) + ' -> ' + motion.late.confetti.toFixed(2) + ')');
+	h.check(motion.late.smoke > motion.early.smoke && motion.late.smoke > 1, '2.3 smoke rises (' + motion.early.smoke.toFixed(2) + ' -> ' + motion.late.smoke.toFixed(2) + ')');
+
+	console.log('\n=== 3. a burst dies and leaves the frame loop ===');
+	const lifetime = await page.evaluate(async () => {
+		const s = window.__stores;
+		const fx = s.gameKit.effectsBurst;
+		fx.clearBursts();
+		await new Promise((r) => setTimeout(r, 200)); // let the idle task leave
+		const tasksBefore = s.moduleSDK.moduleFrameTasks.length;
+		fx.burst([0, 1, -2], { kind: 'sparks' });
+		const during = s.moduleSDK.moduleFrameTasks.length;
+		await new Promise((r) => setTimeout(r, 1400)); // sparks live 0.55 s, on the REAL frame loop
+		return { tasksBefore, during, after: s.moduleSDK.moduleFrameTasks.length, live: fx.burstDebug().live.length };
+	});
+	h.check(lifetime.during === lifetime.tasksBefore + 1, '3.1 a live burst ticks from the frame loop (' + JSON.stringify(lifetime) + ')');
+	h.check(lifetime.live === 0, '3.2 the real frame loop aged it out (no live bursts after its life)');
+	h.check(lifetime.after === lifetime.tasksBefore, '3.3 and its frame task left the loop with it');
+
+	console.log('\n=== 4. the pool is bounded and recycles ===');
+	const pool = await page.evaluate(() => {
+		const s = window.__stores;
+		const fx = s.gameKit.effectsBurst;
+		let scene;
+		s.globalScene.subscribe((v) => (scene = v))();
+		const before = fx.burstDebug().recycled;
+		for (let i = 0; i < 20; i++) fx.burst([i * 0.1, 1, -2], { kind: 'sparkle' });
+		const systems = scene.children.filter((c) => /^effects-burst-/.test(c.name)).length;
+		return { systems, live: fx.burstDebug().live.length, recycled: fx.burstDebug().recycled - before, cap: fx.POOL_SIZE };
+	});
+	h.check(pool.systems === pool.cap && pool.live === pool.cap, '4.1 twenty bursts use at most the pool (' + JSON.stringify(pool) + ')');
+	h.check(pool.recycled === 20 - pool.cap, '4.2 the oldest ones were recycled');
+
+	console.log('\n=== 5. inputs are clamped and bad ones refused ===');
+	const inputs = await page.evaluate(() => {
+		const s = window.__stores;
+		const fx = s.gameKit.effectsBurst;
+		fx.clearBursts();
+		let scene;
+		s.globalScene.subscribe((v) => (scene = v))();
+		const big = fx.burst([0, 1, 0], { count: 5000, kind: 'nope', color: '#00ff00' });
+		const p = scene.getObjectByName(big);
+		const col = p.geometry.attributes.color.array;
+		return {
+			count: p.geometry.drawRange.count,
+			kind: fx.burstDebug().live[0].kind,
+			green: col[1] > 0.9 && col[0] < 0.1,
+			bad: window.__api.effects.burst([0, NaN, 0]),
+			short: window.__api.effects.burst([1, 2])
+		};
+	});
+	h.check(inputs.count === 96, '5.1 count clamps to 96 (' + inputs.count + ')');
+	h.check(inputs.kind === 'sparkle' && inputs.green, '5.2 an unknown kind falls back to sparkle, the colour is honoured');
+	h.check(inputs.bad === false && inputs.short === false, '5.3 a bad position is refused');
+
+	console.log('\n=== 6. it reaches the pixels ===');
+	await page.evaluate(() => {
+		window.__stores.gameKit.effectsBurst.clearBursts();
+		window.__stores.objectActions.deselectObject?.();
+	});
+	await page.waitForTimeout(400);
+	const quiet1 = await h.grabFrame(A);
+	await page.waitForTimeout(150);
+	const quiet2 = await h.grabFrame(A);
+	const fired6 = await page.evaluate(() => {
+		const s = window.__stores;
+		let cam;
+		s.globalCamera.subscribe((c) => (cam = c))();
+		const THREE = s.THREE;
+		const at = cam.getWorldPosition(new THREE.Vector3()).add(cam.getWorldDirection(new THREE.Vector3()).multiplyScalar(4));
+		const ok = window.__api.effects.burst(at.toArray(), { kind: 'confetti', count: 96 }); // 2.2 s of life: a slow frame cannot outlive it
+		return { ok, live: s.gameKit.effectsBurst.burstDebug().live, tasks: s.moduleSDK.moduleFrameTasks.length };
+	});
+	// the burst lives 1.1 s; a loaded machine can take a while to render the next frame,
+	// so sample until one differs (or the burst is surely gone)
+	const idle = await h.frameDelta(page, quiet1, quiet2);
+	let burstDelta = { changed: 0 };
+	for (let i = 0; i < 6 && burstDelta.changed <= idle.changed + 400; i++) {
+		await page.waitForTimeout(80);
+		const frame = await h.grabFrame(A);
+		burstDelta = await h.frameDelta(page, quiet2, frame);
+	}
+	const diag = await page.evaluate(async () => {
+		const s = window.__stores;
+		let rd, scene, cam;
+		s.globalRenderer.subscribe((v) => (rd = v))();
+		s.globalScene.subscribe((v) => (scene = v))();
+		s.globalCamera.subscribe((v) => (cam = v))();
+		const f0 = rd.info.render.frame;
+		await new Promise((r) => setTimeout(r, 300));
+		const live = s.gameKit.effectsBurst.burstDebug().live;
+		const p = live[0] ? scene.getObjectByName(live[0].name) : null;
+		return {
+			frames: rd.info.render.frame - f0,
+			live,
+			parent: p?.parent === scene,
+			cam: cam?.position.toArray().map((v) => +v.toFixed(1)),
+			pos: p ? Array.from(p.geometry.attributes.position.array.slice(0, 3)).map((v) => +v.toFixed(1)) : null
+		};
+	});
+	h.check(burstDelta.changed > idle.changed + 400, '6.1 a burst in view changes the frame (' + burstDelta.changed + ' px vs idle ' + idle.changed + ') ' + JSON.stringify({ fired6, diag }));
+
+	console.log('\n=== 7. announce ===');
+	const ann = await page.evaluate(async () => {
+		const api = window.__api;
+		const empty = api.announce('   ');
+		const id1 = api.announce('Ring 1 reached', { ms: 3000 });
+		const id2 = api.announce('GOAL!', { sub: 'Blue 1 - 0', ms: 900, color: '#22c55e' });
+		await new Promise((r) => setTimeout(r, 100));
+		const el = document.querySelector('#game-announce');
+		const title = el?.querySelector('.game-announce-title');
+		const out = {
+			empty,
+			id1,
+			id2,
+			count: document.querySelectorAll('#game-announce').length,
+			text: el?.textContent?.replace(/\s+/g, ' ').trim(),
+			color: title ? getComputedStyle(title).color : null,
+			pe: el ? getComputedStyle(el).pointerEvents : null
+		};
+		await new Promise((r) => setTimeout(r, 1200));
+		out.gone = !document.querySelector('#game-announce');
+		return out;
+	});
+	h.check(ann.empty === 0 && ann.id1 > 0 && ann.id2 > ann.id1, '7.1 an empty line is refused, each banner gets an id');
+	h.check(ann.count === 1 && ann.text === 'GOAL! Blue 1 - 0', '7.2 ONE banner, the newest replacing the first (' + ann.text + ')');
+	h.check(ann.color === 'rgb(34, 197, 94)' && ann.pe === 'none', '7.3 the title takes its colour and the banner never takes a click');
+	h.check(ann.gone, '7.4 it goes by itself after its ms');
+	const vr = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.isVRMode.set(true);
+		window.__api.announce('Level 3');
+		await new Promise((r) => setTimeout(r, 100));
+		const shown = !!document.querySelector('#game-announce');
+		s.isVRMode.set(false);
+		return shown;
+	});
+	h.check(vr === false, '7.5 in VR the DOM banner stands down (the head-locked one takes over, P3)');
+
+	console.log('\n=== 8. a scene clear takes both ===');
+	const cleared = await page.evaluate(async () => {
+		const s = window.__stores;
+		window.__api.effects.burst([0, 1, -2], { kind: 'smoke' });
+		window.__api.announce('Wave 2', { ms: 5000 });
+		await new Promise((r) => setTimeout(r, 50));
+		const before = { live: s.gameKit.effectsBurst.burstDebug().live.length, banner: !!document.querySelector('#game-announce') };
+		s.moduleSDK.runSceneClearHandlers();
+		await new Promise((r) => setTimeout(r, 100));
+		return { before, live: s.gameKit.effectsBurst.burstDebug().live.length, banner: !!document.querySelector('#game-announce') };
+	});
+	h.check(cleared.before.live > 0 && cleared.before.banner, '8.1 premise: a burst and a banner are up');
+	h.check(cleared.live === 0 && !cleared.banner, '8.2 a scene clear removes both (' + JSON.stringify(cleared) + ')');
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-feel-nodes.test.cjs b/tests/e2e/game-feel-nodes.test.cjs
new file mode 100644
index 00000000..425df7f7
--- /dev/null
+++ b/tests/e2e/game-feel-nodes.test.cjs
@@ -0,0 +1,286 @@
+// 30b (core-games) P0 — GAME FEEL AS FLOW NODES. The three core games are FLOW graphs, and
+// 30b-vr-play's game-feel kit (banner, sounds, bursts, haptics, music) was reachable from a
+// MODULE only. The user on Towers: "When I reach some of the rings and go to the top, it
+// should dynamically tell me and give effects such as sparkles ... there should be some
+// sounds." These five nodes are how a graph does that.
+//
+// 1 a pulse through Announce / Game Sound / Effect Burst / Controller Buzz does its thing,
+// with {v} filled, the sound and burst AT the wired object · 2 nothing of their own goes on
+// the wire · 3 a node adopting an OLD stamp stays quiet (actionSeenAt) · 4 the buzz is
+// silent in Edit and asks in Interact · 5 Game Music is a declaration: silent in Edit,
+// plays in Interact, 'round' waits for the round, an `on` wired false stops it, leaving
+// Interact stops it · 6 a replicated pulse makes the second peer announce too.
+const h = require('./helpers.cjs');
+
+const NOW = () => (Date.now() % 86400000) / 1000;
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A', { context: { viewport: { width: 1280, height: 720 } } });
+	const page = A.page;
+
+	// a box to aim the sound and the burst at, then the graph
+	await page.evaluate(() => window.__stores.commandsHandler.sceneCommand('/create box'));
+	await page.waitForTimeout(600);
+	const box = await page.evaluate(async () => {
+		const s = window.__stores;
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		let target = group.children.find((c) => c.isMesh);
+		if (!target) {
+			const THREE = s.THREE ?? (await import('/node_modules/.vite/deps/three.js').catch(() => null));
+			return { missing: true, have: group.children.length, hasTHREE: !!THREE };
+		}
+		// hold it still and somewhere known (a /create box is dynamic and would fall)
+		target.userData.physics = { mode: 'static' };
+		target.position.set(2, 3, -4);
+		target.updateMatrixWorld(true);
+		return { uuid: target.uuid };
+	});
+	h.check(!!box.uuid, 'a box to aim at (' + JSON.stringify(box) + ')');
+
+	const build = (extra = {}) =>
+		page.evaluate(
+			async ({ uuid, extra }) => {
+				const s = window.__stores;
+				const x = extra.suffix ?? '';
+				const N = (id, type, data) => ({ id, type, position: { x: 0, y: 0 }, data: { label: id, ...data }, class: 'w-[150px]' });
+				const nodes = [
+					N('fKey', 'keypress', { code: 'KeyJ', edge: 'down', pulse: 0.3 }),
+					N('fCount', 'counter', { op: 'up', step: 1 }),
+					N('fSel', 'objectselector', { selected: uuid }),
+					N('fAnn' + x, 'announce', { text: 'Ring {v} reached', sub: 'keep going', seconds: 2, color: '#7fd4ff' }),
+					N('fSnd' + x, 'gamesound', { sound: 'ring' }),
+					N('fFx' + x, 'effectburst', { kind: 'confetti', count: 30, lift: 0.5 }),
+					N('fBuzz' + x, 'hapticpulse', { pattern: 'success', hand: 'both' }),
+					...(extra.music ? [N('fMus', 'gamemusic', { preset: 'space', volume: 0.4, while: extra.music })] : [])
+				];
+				const E = (s0, t, th) => ({ id: 'e-' + s0 + '-' + t + (th ? '.' + th : ''), source: s0, target: t, ...(th ? { targetHandle: th } : {}) });
+				const edges = [
+					E('fKey', 'fCount', 'pulse'),
+					E('fKey', 'fAnn' + x, 'trigger'),
+					E('fCount', 'fAnn' + x, 'value'),
+					E('fKey', 'fSnd' + x, 'trigger'),
+					E('fSel', 'fSnd' + x, 'at'),
+					E('fKey', 'fFx' + x, 'trigger'),
+					E('fSel', 'fFx' + x, 'at'),
+					E('fKey', 'fBuzz' + x, 'trigger')
+				];
+				s.flowGraphs.update((g) => ({ ...g, scene: { nodes, edges } }));
+				s.flowNodes.set(nodes);
+				s.flowEdges.set(edges);
+				s.gameKit.gameFeelActions.resetGameFeelActionsDebug();
+				await new Promise((r) => setTimeout(r, 800)); // past the nodes' first-seen (actionSeenAt)
+				return true;
+			},
+			{ uuid: box.uuid, extra }
+		);
+	await build();
+	await page.evaluate(() => {
+		let peer;
+		window.__stores.peers.subscribe((v) => (peer = v))();
+		window.__sent = [];
+		const send = peer.send.bind(peer);
+		peer.send = (msg) => {
+			window.__sent.push(msg?.type);
+			return send(msg);
+		};
+	});
+
+	console.log('\n=== 1. a pulse: banner, sound, burst, buzz ===');
+	const pulse = async (replicate = false) => {
+		await page.evaluate(({ t, replicate }) => window.__stores.flowRuntime.applyNodeTrigger('fKey', t, replicate), { t: NOW(), replicate });
+		await page.waitForTimeout(500);
+	};
+	await pulse();
+	await pulse();
+	const one = await page.evaluate(() => {
+		const k = window.__stores.gameKit;
+		let ann;
+		k.gameAnnounce.gameAnnouncement.subscribe((v) => (ann = v))();
+		const dbg = k.gameFeelActions.gameFeelActionsDebug();
+		const banner = document.querySelector('#game-announce');
+		return {
+			ann,
+			fired: dbg.fired,
+			last: dbg.last,
+			sfx: k.gameSfx.gameSfxDebug(),
+			live: k.effectsBurst.burstDebug().live,
+			bannerText: banner?.textContent ?? null
+		};
+	});
+	h.check(one.ann?.text === 'Ring 2 reached' && one.ann?.sub === 'keep going', '1.1 Announce shows the text with {v} = the wired counter (' + JSON.stringify(one.ann) + ')');
+	h.check(one.ann?.color === '#7fd4ff' && one.ann?.ms === 2000, '1.2 in its colour, for its seconds');
+	h.check(/Ring 2 reached/.test(one.bannerText ?? ''), '1.3 the desktop banner draws it (' + JSON.stringify(one.bannerText) + ')');
+	const snd = one.last.filter((e) => e.type === 'gamesound');
+	h.check(snd.length === 2 && snd.every((e) => e.sound === 'ring' && e.spatial), '1.4 Game Sound played `ring` twice, placed at the wired box (' + JSON.stringify(snd) + ')');
+	h.check(one.sfx.last === 'ring', '1.5 through the procedural set (' + JSON.stringify(one.sfx) + ')');
+	const fx = one.last.filter((e) => e.type === 'effectburst');
+	h.check(fx.length === 2 && fx.every((e) => e.fired && e.kind === 'confetti'), '1.6 Effect Burst fired a confetti burst per pulse');
+	const where = fx[0]?.where ?? [];
+	h.check(Math.abs(where[0] - 2) < 1e-3 && Math.abs(where[1] - 3.5) < 1e-3 && Math.abs(where[2] + 4) < 1e-3, '1.7 at the wired box, lifted 0.5 m (' + JSON.stringify(where) + ')');
+	h.check(one.live.some((b) => b.kind === 'confetti'), '1.8 a live burst is in the pool');
+	h.check((one.fired.hapticpulse ?? 0) === 2, '1.9 Controller Buzz asked twice');
+
+	console.log('\n=== 2. nothing of their own on the wire ===');
+	const sent = await page.evaluate(() => window.__sent);
+	h.check(!sent.some((t) => /announce|sound|burst|haptic|music/i.test(String(t))), '2.1 no game-feel message was sent (' + JSON.stringify([...new Set(sent)]) + ')');
+
+	console.log('\n=== 3. an OLD stamp does not announce ===');
+	// the key's newest stamp is section 1's; NEW action nodes wired to it now would adopt it
+	await page.waitForTimeout(600);
+	await build({ suffix: 'New' });
+	await page.waitForTimeout(700);
+	const stale = await page.evaluate(() => window.__stores.gameKit.gameFeelActions.gameFeelActionsDebug().fired);
+	h.check(!stale.announce && !stale.gamesound && !stale.effectburst && !stale.hapticpulse, '3.1 fresh nodes adopting a stamp older than them stay quiet (' + JSON.stringify(stale) + ')');
+	await pulse();
+	const fresh = await page.evaluate(() => window.__stores.gameKit.gameFeelActions.gameFeelActionsDebug().fired);
+	h.check(fresh.announce === 1 && fresh.gamesound === 1, '3.2 and act on the next real pulse (' + JSON.stringify(fresh) + ')');
+
+	console.log('\n=== 4. the buzz: silent in Edit, asked in Interact ===');
+	const buzz = await page.evaluate(async () => {
+		const s = window.__stores;
+		const k = s.gameKit;
+		const t = () => (Date.now() % 86400000) / 1000;
+		s.objectActions.setEditorMode('edit');
+		k.gameFeelActions.resetGameFeelActionsDebug();
+		const sup0 = s.vrControls.hapticDebug().suppressed;
+		s.flowRuntime.applyNodeTrigger('fKey', t(), false);
+		await new Promise((r) => setTimeout(r, 400));
+		const edit = k.gameFeelActions.gameFeelActionsDebug().last.find((e) => e.type === 'hapticpulse');
+		const sup1 = s.vrControls.hapticDebug().suppressed;
+		s.objectActions.setEditorMode('interact');
+		s.flowRuntime.applyNodeTrigger('fKey', t(), false);
+		await new Promise((r) => setTimeout(r, 400));
+		const inter = k.gameFeelActions.gameFeelActionsDebug().last.filter((e) => e.type === 'hapticpulse').pop();
+		s.objectActions.setEditorMode('edit');
+		return { edit, inter, sup0, sup1 };
+	});
+	h.check(buzz.edit && buzz.edit.felt === false, '4.1 in Edit the buzz is refused by the core gate (' + JSON.stringify(buzz.edit) + ')');
+	h.check(buzz.inter && buzz.inter.felt === true && buzz.inter.pattern === 'success', '4.2 in Interact the success pattern is played (' + JSON.stringify(buzz.inter) + ')');
+
+	console.log('\n=== 5. Game Music is a declaration ===');
+	await build({ music: 'always' });
+	const music = await page.evaluate(async () => {
+		const s = window.__stores;
+		const k = s.gameKit;
+		const state = () => {
+			let v;
+			k.gameMusic.gameMusicState.subscribe((x) => (v = x))();
+			return v?.preset ?? null;
+		};
+		const wait = () => new Promise((r) => setTimeout(r, 400));
+		s.objectActions.setEditorMode('edit');
+		await wait();
+		const inEdit = state();
+		s.objectActions.setEditorMode('interact');
+		await wait();
+		const inInteract = state();
+		s.objectActions.setEditorMode('edit');
+		await wait();
+		const backInEdit = state();
+		return { inEdit, inInteract, backInEdit, dbg: k.gameFeelActions.gameFeelActionsDebug() };
+	});
+	h.check(music.inEdit === null, '5.1 the editor stays silent (' + music.inEdit + ')');
+	h.check(music.inInteract === 'space', '5.2 Interact plays the preset (' + music.inInteract + ')');
+	h.check(music.backInEdit === null, '5.3 back in Edit it stops (' + music.backInEdit + ')');
+	await build({ music: 'round' });
+	const round = await page.evaluate(async () => {
+		const s = window.__stores;
+		const k = s.gameKit;
+		const state = () => {
+			let v;
+			k.gameMusic.gameMusicState.subscribe((x) => (v = x))();
+			return v?.preset ?? null;
+		};
+		const wait = () => new Promise((r) => setTimeout(r, 400));
+		s.gameState.resetGame?.();
+		s.objectActions.setEditorMode('interact');
+		await wait();
+		const menu = state();
+		s.gameState.setGameState('playing');
+		await wait();
+		const playing = state();
+		s.gameState.setGameState('over');
+		await wait();
+		const over = state();
+		// `on` wired to a false boolean: a Compare that can never hold
+		s.gameState.setGameState('playing');
+		const cmp = { id: 'fNo', type: 'compare', position: { x: 0, y: 0 }, data: { label: 'never', op: 'gt', a: 0, b: 1 }, class: 'w-[150px]' };
+		const edge = { id: 'e-fNo-fMus.on', source: 'fNo', target: 'fMus', targetHandle: 'on' };
+		s.flowGraphs.update((g) => ({ ...g, scene: { nodes: [...g.scene.nodes, cmp], edges: [...g.scene.edges, edge] } }));
+		await wait();
+		const off = state();
+		s.objectActions.setEditorMode('edit');
+		s.gameState.resetGame?.();
+		return { menu, playing, over, off };
+	});
+	h.check(round.menu === null && round.playing === 'space' && round.over === null, "5.4 while 'round' it waits for the round and stops at its end (" + JSON.stringify(round) + ')');
+	h.check(round.off === null, '5.5 an `on` wired false switches it off');
+
+	console.log('\n=== 7. On Grab: a player lifting a body pulses it ===');
+	await page.evaluate(() => window.__stores.commandsHandler.sceneCommand('/create box'));
+	await page.waitForTimeout(800);
+	const grabbed = await page.evaluate(async () => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		const crate = group.children.filter((c) => c.isMesh).pop();
+		crate.name = 'Grab crate';
+		crate.position.set(0, 1.2, -3);
+		crate.userData.physics = { mode: 'dynamic', mass: 1 };
+		s.objectsGroup.update((v) => v);
+		s.scenePhysics.setScenePhysics({ play: { interaction: 'grab' }, ground: { enabled: true, height: 0 } });
+		const N = (id, type, data) => ({ id, type, position: { x: 0, y: 0 }, data: { label: id, ...data }, class: 'w-[150px]' });
+		const nodes = [N('gGrab', 'ongrab', { pulse: 0.3 }), N('gSel', 'objectselector', { selected: crate.uuid }), N('gPop', 'gamesound', { sound: 'pop' })];
+		const edges = [
+			{ id: 'e-gGrab-gSel', source: 'gGrab', target: 'gSel' },
+			{ id: 'e-gGrab-gPop.trigger', source: 'gGrab', target: 'gPop', targetHandle: 'trigger' },
+			{ id: 'e-gSel-gPop.at', source: 'gSel', target: 'gPop', targetHandle: 'at' }
+		];
+		s.flowGraphs.update((g) => ({ ...g, scene: { nodes, edges } }));
+		s.flowNodes.set(nodes);
+		s.flowEdges.set(edges);
+		await new Promise((r) => setTimeout(r, 800));
+		s.gameKit.gameFeelActions.resetGameFeelActionsDebug();
+		s.objectActions.setEditorMode('interact');
+		await s.physics.toggleSimulation();
+		await new Promise((r) => setTimeout(r, 600));
+		let camera;
+		s.globalCamera.subscribe((v) => (camera = v))();
+		camera.updateMatrixWorld(true);
+		const from = camera.getWorldPosition(new THREE.Vector3());
+		const to = crate.getWorldPosition(new THREE.Vector3());
+		const ray = new THREE.Raycaster(from, to.clone().sub(from).normalize());
+		const started = s.playInteract.cursorGrabStart(ray, { x: 0, y: 0 }, camera);
+		await new Promise((r) => setTimeout(r, 600));
+		const dbg = s.gameKit.gameFeelActions.gameFeelActionsDebug();
+		s.playInteract.cursorGrabEnd();
+		await s.physics.toggleSimulation();
+		s.objectActions.setEditorMode('edit');
+		return { started, pops: dbg.last.filter((e) => e.type === 'gamesound' && e.sound === 'pop') };
+	});
+	h.check(grabbed.started === true, '7.1 (premise) the Interact cursor carry picked the crate up');
+	h.check(grabbed.pops.length === 1 && grabbed.pops[0].spatial, '7.2 On Grab fired: the pop played once, at the crate (' + JSON.stringify(grabbed.pops) + ')');
+
+	console.log('\n=== 6. two peers: a replicated pulse announces on both ===');
+	// the graph is A's before B dials, so the handshake's full-state nodes reply carries it
+	await build();
+	const B = await h.setupPage(browser, 'B');
+	await h.connect(B, A);
+	await B.page.waitForFunction(() => window.__stores.allNodes().some((n) => n.id === 'fAnn'), null, { timeout: 30000 });
+	await B.page.waitForTimeout(900); // B's first tick sees the nodes (actionSeenAt)
+	await pulse(true);
+	await B.page.waitForTimeout(800);
+	const onB = await B.page.evaluate(() => {
+		let v;
+		window.__stores.gameKit.gameAnnounce.gameAnnouncement.subscribe((x) => (v = x))();
+		return { ann: v, fired: window.__stores.gameKit.gameFeelActions.gameFeelActionsDebug().fired };
+	});
+	h.check(/^Ring \d+ reached$/.test(onB.ann?.text ?? ''), '6.1 the second peer shows the banner from the same pulse (' + JSON.stringify(onB.ann) + ')');
+	h.check((onB.fired.gamesound ?? 0) >= 1, '6.2 and plays the sound itself (' + JSON.stringify(onB.fired) + ')');
+
+	h.check(h.pageErrors(A).length === 0 && h.pageErrors(B).length === 0, 'no page error');
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-football.test.cjs b/tests/e2e/game-football.test.cjs
index c476ccfb..9c63eee3 100644
--- a/tests/e2e/game-football.test.cjs
+++ b/tests/e2e/game-football.test.cjs
@@ -219,6 +219,16 @@ const gameStateOf = (page) =>
 	});
 const screenOf = (page) => page.evaluate(() => window.__stores.hudDocs.visibleScreen('scene')?.id ?? null);
 const hudText = async (page) => (await page.locator('#hud-layer').textContent().catch(() => '')) ?? '';
+/** 30-visuals-mod: the playing HUD's score is the SCOREBOARD's two numbers (fb-red-score /
+ * fb-blue-score), no longer a "RED n — n BLUE" line; read them as that line */
+const scoreLine = (page) =>
+	page.evaluate(() => {
+		let r = {};
+		window.__stores.hudDocs.hudRuntime.subscribe((v) => (r = v || {}))();
+		const red = r['fb-red-score']?.text;
+		const blue = r['fb-blue-score']?.text;
+		return red == null || blue == null ? '' : 'RED ' + red + ' — ' + blue + ' BLUE';
+	});
 const pressP = (page) =>
 	page.evaluate(() => {
 		window.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyP', bubbles: true }));
@@ -272,7 +282,7 @@ h.run(async () => {
 	const ball = names['Football'];
 	const redGate = names['Red gate'];
 	const blueGate = names['Blue gate'];
-	h.check(Object.keys(names).length === 41, `1.1 the file restored 41 objects (${Object.keys(names).length})`);
+	h.check(Object.keys(names).length === 42, `1.1 the file restored 42 objects — 41 + the Arena decoration group (${Object.keys(names).length})`);
 	const phys = await A.page.evaluate(() => window.__stores.scenePhysics.scenePhysicsDebug());
 	h.check(phys.gravity === 0 && phys.ground?.enabled === false && phys.ccd === true, `1.2 zero-g, no ground, CCD on (${phys.gravity}, ${phys.ground?.enabled}, ${phys.ccd})`);
 	h.check(phys.knock?.enabled === true && phys.knock.maxSpeed === 10 && Math.abs(phys.knock.spin - 0.8) < 1e-9, `1.3 the knock block ON from the file — the ball curls (${JSON.stringify(phys.knock)})`);
@@ -328,7 +338,7 @@ h.run(async () => {
 	await h.eventually(() => screenOf(A.page), (v) => v === 'hud', '3.4 A sees the playing HUD', 6000);
 	await h.eventually(() => snap(A.page), (s) => s?.serves >= 1, '3.5 A served the kick-off (serveDelay)', 8000);
 	await h.eventually(() => speedOf(A.page, ball), (v) => v != null && v > 0.2, '3.6 the ball moves on the initiator');
-	await h.eventually(() => hudText(A.page), (t) => /RED 0 — 0 BLUE/.test(t), '3.7 the HUD score list reads RED 0 — 0 BLUE');
+	await h.eventually(() => scoreLine(A.page), (t) => /RED 0 — 0 BLUE/.test(t), '3.7 the HUD scoreboard reads RED 0 — 0 BLUE');
 
 	// ---- 3b. the P menu ------------------------------------------------------------------------
 	const simState = (pg) => pg.evaluate(() => { const p = window.__stores.physics; let a, b, l, f; p.simulating.subscribe((v) => (a = v))(); p.remoteSimulating.subscribe((v) => (b = v))(); window.__stores.isLocked.subscribe((v) => (l = v))(); window.__stores.playPointerFree?.subscribe?.((v) => (f = v))(); return { sim: a, remote: b, locked: l, free: f }; });
@@ -357,7 +367,7 @@ h.run(async () => {
 	await h.eventually(() => myVar(B.page, 'goals'), (v) => v === 1, '4.5 B\'s OWN goals row = 1');
 	h.check((await myVar(A.page, 'goals')) === 0, '4.6 A\'s goals row stays 0');
 	await h.eventually(() => rowOf(A.page, 'goals', B.id), (v) => v === 1, '4.7 A\'s leaderboard shows B = 1');
-	await h.eventually(() => hudText(A.page), (t) => /RED 0 — 1 BLUE/.test(t), '4.8 the DOM HUD score follows');
+	await h.eventually(() => scoreLine(A.page), (t) => /RED 0 — 1 BLUE/.test(t), '4.8 the HUD scoreboard follows');
 	const lamp = (page, name) =>
 		page.evaluate((uuid) => {
 			let g;
@@ -450,10 +460,10 @@ h.run(async () => {
 	await h.eventually(() => screenOf(A.page), (v) => v === 'over', '6.7 A sees the over screen', 6000);
 	h.check(/MATCH OVER/.test(await hudText(A.page)), '6.8 the over screen renders');
 
-	// New match on the over screen: back to the menu, the sheet survives
+	// Menu on the over screen (30b: Rematch + Menu; it was New match): back to the menu, the sheet survives
 	const newBefore = await stampOf(B.page, 'evnew');
-	await hudButton(A.page, 'New match').click();
-	await h.eventually(() => snap(B.page), (s) => s?.score.blue === 0 && s.started === false && s.outcome === null, '6.9 B: New match — score 0');
+	await hudButton(A.page, 'Menu').click();
+	await h.eventually(() => snap(B.page), (s) => s?.score.blue === 0 && s.started === false && s.outcome === null, '6.9 B: Menu on the over screen (30b: Rematch + Menu) — score 0');
 	await h.eventually(() => stampOf(B.page, 'evnew'), (t) => t !== null && t !== newBefore, '6.10 B: the "On new match" stamp landed in the trigger log');
 	await h.eventually(() => gameStateOf(C.page), (v) => v === 'menu', '6.11 C: the shell is back in menu');
 	await h.eventually(() => screenOf(A.page), (v) => v === 'menu', '6.12 A sees the menu again', 6000);
diff --git a/tests/e2e/game-haptics.test.cjs b/tests/e2e/game-haptics.test.cjs
new file mode 100644
index 00000000..18faa841
--- /dev/null
+++ b/tests/e2e/game-haptics.test.cjs
@@ -0,0 +1,174 @@
+// 30b (vr-play) P1 — C4 HAPTICS. The user, from a Quest: "For games, also enable controller
+// vibration, make it cool like haptic, so it would be good for users to interact with the
+// world. The vibration should be only interactive mode, not in edit mode."
+//
+// No headset runs headless, so the XR session is a STUB whose gamepads carry recording
+// actuators — every assertion reads what the actuator was actually asked to do.
+// 1 Edit is silent (api.haptic, a core pulse, a pattern) · 2 Interact buzzes, on the named
+// hand · 3 patterns play as timed pulses and stop when the player leaves mid-pattern ·
+// 4 the hover-enter TAP: once per entry, only on clickable things (On Click / device part /
+// marked), never in Edit · 5 the press BUMP · 6 the knock is scaled by its strength.
+const h = require('./helpers.cjs');
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		await s.moduleSDK.initModules([
+			{ id: 'haptic30b', name: 'Haptic test', version: '1.0.0', description: 'the 30b haptic seams', register(api) { window.__api = api; } }
+		]);
+		let renderer;
+		s.globalRenderer.subscribe((r) => (renderer = r))();
+		window.__buzz = [];
+		const source = (hand) => ({
+			handedness: hand,
+			gamepad: { buttons: [], axes: [], hapticActuators: [{ pulse: (i, ms) => window.__buzz.push({ hand, i, ms, t: performance.now() }) }] }
+		});
+		const session = { inputSources: [source('left'), source('right')] };
+		renderer.xr.getSession = () => session;
+		renderer.xr.getController(0).userData.handedness = 'left';
+		renderer.xr.getController(1).userData.handedness = 'right';
+	});
+	const buzz = () => page.evaluate(() => window.__buzz.splice(0));
+	const mode = (m) => page.evaluate((m) => window.__stores.objectActions.setEditorMode(m), m);
+
+	console.log('\n=== 1. Edit mode is silent ===');
+	await mode('edit');
+	const edit = await page.evaluate(() => {
+		const s = window.__stores;
+		const before = s.vrControls.hapticDebug().suppressed;
+		window.__api.haptic(0.6, 50, 'left');
+		s.vrControls.hapticPulse(0.4, 40); // a core pulse (menus, teleport, the sleeve)
+		const pattern = window.__api.hapticPattern('success', 'right');
+		return { pattern, suppressed: s.vrControls.hapticDebug().suppressed - before };
+	});
+	await page.waitForTimeout(300);
+	const editBuzz = await buzz();
+	h.check(editBuzz.length === 0, '1.1 no actuator pulsed in Edit (' + editBuzz.length + ')');
+	h.check(edit.suppressed === 2 && edit.pattern === false, '1.2 the pulses were swallowed by the gate and the pattern refused (' + JSON.stringify(edit) + ')');
+
+	console.log('\n=== 2. Interact buzzes, on the named hand ===');
+	await mode('interact');
+	await page.evaluate(() => window.__api.haptic(0.6, 50, 'left'));
+	const one = await buzz();
+	h.check(one.length === 1 && one[0].hand === 'left' && one[0].i === 0.6 && one[0].ms === 50, '2.1 api.haptic pulses the LEFT actuator in Interact (' + JSON.stringify(one) + ')');
+	await page.evaluate(() => window.__stores.vrControls.hapticPulse(0.3, 20));
+	const both = await buzz();
+	h.check(both.length === 2 && both.some((b) => b.hand === 'left') && both.some((b) => b.hand === 'right'), '2.2 a pulse with no hand reaches both');
+
+	console.log('\n=== 3. patterns are timed pulses and stop when the player leaves ===');
+	const ok = await page.evaluate(() => ({ s: window.__api.hapticPattern('success', 'right'), u: window.__api.hapticPattern('zzz') }));
+	// wait on the PULSES, not a clock: headless timers run late under load
+	await page.waitForFunction(() => window.__buzz.length >= 3, null, { timeout: 5000 }).catch(() => {});
+	const success = await buzz();
+	h.check(ok.s === true && ok.u === false, '3.1 a known pattern plays, an unknown one is refused');
+	h.check(
+		success.length === 3 && success.every((b) => b.hand === 'right') && success[0].i < success[1].i && success[1].i < success[2].i,
+		'3.2 success = three rising pulses on the right (' + JSON.stringify(success.map((b) => b.i)) + ')'
+	);
+	h.check(success.length === 3 && success[2].t - success[0].t > 120, '3.3 they are spaced in time, not fired at once (' + (success.length === 3 ? (success[2].t - success[0].t).toFixed(0) : '-') + ' ms)');
+	await page.evaluate(() => {
+		window.__api.hapticPattern('rumble', 'left');
+		window.__stores.objectActions.setEditorMode('edit');
+	});
+	await page.waitForTimeout(2000); // past the whole rumble even with late timers
+	const cut = await buzz();
+	h.check(cut.length === 1, '3.4 leaving Interact mid-rumble stops it after the first pulse (' + cut.length + ' of 4)');
+	await mode('interact');
+
+	console.log('\n=== 4. the hover-enter tap ===');
+	const ids = await page.evaluate(async () => {
+		const s = window.__stores;
+		const make = async (at) => {
+			const [uuid] = await window.__api.create('/create box 1 1 1', { at });
+			return uuid;
+		};
+		const clickable = await make([0, 1, -4]);
+		const plain = await make([3, 1, -4]);
+		const marked = await make([-3, 1, -4]);
+		await new Promise((r) => setTimeout(r, 400));
+		window.__api.flow.addNodes({ graphId: clickable, nodes: [{ type: 'onclick', x: 40, y: 40, data: {} }] });
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		g.getObjectByProperty('uuid', marked).userData.clickable = true;
+		return { clickable, plain, marked };
+	});
+	await page.waitForTimeout(500);
+	const hover = await page.evaluate((ids) => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		const k = s.gameKit.vrGameInput;
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const rayTo = (uuid) => {
+			const target = g.getObjectByProperty('uuid', uuid).getWorldPosition(new THREE.Vector3());
+			const origin = new THREE.Vector3(target.x, 1, 2);
+			return new THREE.Raycaster(origin, target.clone().sub(origin).normalize());
+		};
+		const miss = new THREE.Raycaster(new THREE.Vector3(0, 30, 0), new THREE.Vector3(0, 1, 0));
+		const out = {};
+		out.first = k.hoverFrame(0, rayTo(ids.clickable))?.key ?? null;
+		out.a = window.__buzz.splice(0);
+		k.hoverFrame(0, rayTo(ids.clickable));
+		k.hoverFrame(0, rayTo(ids.clickable));
+		out.b = window.__buzz.splice(0);
+		out.plain = k.hoverFrame(0, rayTo(ids.plain))?.key ?? null;
+		out.c = window.__buzz.splice(0);
+		out.marked = k.hoverFrame(0, rayTo(ids.marked))?.key ?? null;
+		out.d = window.__buzz.splice(0);
+		k.hoverFrame(0, miss);
+		k.hoverFrame(0, rayTo(ids.clickable));
+		out.e = window.__buzz.splice(0);
+		s.objectActions.setEditorMode('edit');
+		k.hoverFrame(0, miss);
+		out.editKey = k.hoverFrame(0, rayTo(ids.clickable))?.key ?? null;
+		out.f = window.__buzz.splice(0);
+		s.objectActions.setEditorMode('interact');
+		return out;
+	}, ids);
+	h.check(hover.first === ids.clickable && hover.a.length === 1 && hover.a[0].hand === 'left' && hover.a[0].i < 0.25, '4.1 the laser entering an On Click object taps that hand lightly (' + JSON.stringify(hover.a) + ')');
+	h.check(hover.b.length === 0, '4.2 staying on it taps nothing more (' + hover.b.length + ')');
+	h.check(hover.plain === null && hover.c.length === 0, '4.3 a plain object is not clickable: no tap');
+	h.check(hover.marked === ids.marked && hover.d.length === 1, '4.4 an object marked userData.clickable taps');
+	h.check(hover.e.length === 1, '4.5 leaving and coming back taps again (re-armed)');
+	h.check(hover.editKey === null && hover.f.length === 0, '4.6 in Edit the hover resolves nothing and never taps');
+
+	console.log('\n=== 5. the press bump ===');
+	const press = await page.evaluate((ids) => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const rayTo = (uuid) => {
+			const target = g.getObjectByProperty('uuid', uuid).getWorldPosition(new THREE.Vector3());
+			const origin = new THREE.Vector3(target.x, 1, 2);
+			return new THREE.Raycaster(origin, target.clone().sub(origin).normalize());
+		};
+		const k = s.gameKit.vrGameInput;
+		const hit = k.pressFeedback(1, rayTo(ids.clickable));
+		const a = window.__buzz.splice(0);
+		const none = k.pressFeedback(1, rayTo(ids.plain));
+		const b = window.__buzz.splice(0);
+		return { hit, a, none, b };
+	}, ids);
+	h.check(press.hit && press.a.length === 1 && press.a[0].hand === 'right' && press.a[0].i >= 0.4, '5.1 a trigger landing on a clickable bumps the pressing hand (' + JSON.stringify(press.a) + ')');
+	h.check(press.none === false && press.b.length === 0, '5.2 a press on nothing clickable does not');
+
+	console.log('\n=== 6. the knock is scaled by its strength ===');
+	await page.evaluate(() => {
+		const v = window.__stores.vrControls;
+		v.hapticKnock(Math.min(1, 0.2 + 0.4 / 10), 30, 'right'); // a brush at 0.4 m/s
+	});
+	await page.waitForFunction(() => window.__buzz.length >= 2, null, { timeout: 5000 }).catch(() => {});
+	const soft = await buzz();
+	await page.evaluate(() => window.__stores.vrControls.hapticKnock(Math.min(1, 0.2 + 6 / 10), 30, 'right')); // a swing at 6 m/s
+	await page.waitForFunction(() => window.__buzz.length >= 2, null, { timeout: 5000 }).catch(() => {});
+	const hard = await buzz();
+	h.check(soft.length === 2 && hard.length === 2, '6.1 a knock plays the two-pulse hit (' + soft.length + ', ' + hard.length + ')');
+	h.check(hard[0].i > soft[0].i * 2 && hard[0].i <= 1, '6.2 a harder knock buzzes harder (' + soft[0].i.toFixed(3) + ' -> ' + hard[0].i.toFixed(3) + ')');
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-jam-room.test.cjs b/tests/e2e/game-jam-room.test.cjs
new file mode 100644
index 00000000..1e942d69
--- /dev/null
+++ b/tests/e2e/game-jam-room.test.cjs
@@ -0,0 +1,245 @@
+// 30 visuals-core P2 ACCEPTANCE — the Jam Room becomes a GAME. It was 23-D3's sandbox: the
+// music modules' devices, all cabled, on one dark slab with no HUD. Now it is a small studio
+// with a shell: Start -> a three-second count-in -> keep the band playing for EIGHT BARS
+// (core's Transport node reads the shared clock; the bars count from the beat the count-in
+// ended on, kept with Set Variable) -> Session complete, the tempo you finished at saved as
+// this device's best (Store Value max). A FREE cursor (play.cursor 'free'): you play the
+// instruments by pointing at them, no pointer lock.
+//
+// Loaded from the REAL .tpscene: JAM_ROOM_TPSCENE=<path> (a lane's staged build) or the
+// sibling scenes checkout's games/jam-room/scene.tpscene, with the REAL music-lab and
+// music-fx zips. Skip-never-fail when either is absent.
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const path = require('path');
+
+const SCENES_REPO = [
+	path.resolve(__dirname, '../../../theprototype.app-scenes'),
+	path.resolve(__dirname, '../../../scenes')
+].find((p) => fs.existsSync(p));
+const TPSCENE = process.env.JAM_ROOM_TPSCENE || (SCENES_REPO && path.join(SCENES_REPO, 'games/jam-room/scene.tpscene'));
+
+h.run(async () => {
+	if (!TPSCENE || !fs.existsSync(TPSCENE)) {
+		console.log('SKIP: no games/jam-room/scene.tpscene in a sibling scenes checkout and no JAM_ROOM_TPSCENE');
+		return;
+	}
+	const browser = await h.launch({ args: h.AUDIO_ARGS });
+	const A = await h.setupPage(browser, 'A', { context: { viewport: { width: 1280, height: 720 } } });
+	const page = A.page;
+	for (const id of ['music-lab', 'music-fx'])
+		if (!(await h.installModule(A, id))) {
+			console.log('SKIP: no ' + id + '.zip in the sibling modules checkout');
+			await h.finish(browser);
+			return;
+		}
+	await page.evaluate(() => window.__stores.modulesOpen.set(false));
+
+	const bytes = Array.from(fs.readFileSync(TPSCENE));
+	await page.evaluate(async (arr) => {
+		const s = window.__stores;
+		const payload = await s.sessions.readSessionZip(new Uint8Array(arr).buffer);
+		await s.sessions.applySession(payload, { backup: false });
+	}, bytes);
+	await page.waitForTimeout(2500);
+
+	const snap = () =>
+		page.evaluate(() => {
+			const s = window.__stores;
+			const g = (st) => { let v; st.subscribe((x) => (v = x))(); return v; };
+			const group = g(s.objectsGroup);
+			const kinds = [];
+			group.traverse((o) => { if (o.userData?.device?.kind) kinds.push(o.userData.device.kind); });
+			return {
+				kinds,
+				state: g(s.gameState.gameState)?.state ?? null,
+				screen: s.hudDocs.visibleScreen('scene')?.id ?? null,
+				cursor: s.playCursor.playCursorDebug(),
+				transport: s.musicClock.transportState()
+			};
+		});
+	const hud = async () => (await page.locator('#hud-layer').textContent()) ?? '';
+	const clickBtn = (text) => page.getByRole('button', { name: text, exact: true }).click();
+	// 30b: what the VR wrist card / top strip would SAY right now (vr-play's overlay split)
+	const vrLines = () =>
+		page.evaluate(() => {
+			const s = window.__stores;
+			const k = s.gameKit.vrGamePanel;
+			let rt; s.hudDocs.hudRuntime.subscribe((v) => (rt = v))();
+			const { panel, overlay } = k.vrScreens();
+			return { panel: panel.map((p) => p.screen.id), lines: overlay.flatMap((o) => k.overlayLines(o.screen.elements, rt)) };
+		});
+	const stored = () => page.evaluate(() => {
+		const out = {};
+		for (let i = 0; i < localStorage.length; i++) {
+			const k = localStorage.key(i);
+			if (/^tp:scene:.*:jam-(best|last)-bpm$/.test(k)) out[k.split(':').pop()] = JSON.parse(localStorage.getItem(k));
+		}
+		return out;
+	});
+
+	// 1 — the room arrived: twelve cabled devices in a studio, and the shell
+	let st = await snap();
+	h.check(st.kinds.length === 12, `the twelve devices arrived (${st.kinds.length}: ${[...new Set(st.kinds)].map((k) => k.replace(/^mod-music-(lab|fx)-/, '')).join(', ')})`);
+	const look = await page.evaluate(() => {
+		const s = window.__stores;
+		const g = (st) => { let v; st.subscribe((x) => (v = x))(); return v; };
+		const group = g(s.objectsGroup);
+		const env = g(s.environment.environment);
+		const lights = [];
+		group.traverse((o) => { if (o.isLight) lights.push(o.type); });
+		return {
+			walls: ['Back wall', 'Left wall', 'Right wall'].every((n) => group.getObjectByName(n)?.userData?.pick === 'through'),
+			rug: !!group.getObjectByName('Rug'), props: ['Amp', 'Plant', 'Stool', 'Lamp left'].every((n) => !!group.getObjectByName(n)),
+			lights, gradient: !!env?.customPreset?.gradient, exposure: env?.exposure,
+			post: (g(s.scenePost.scenePost)?.effects ?? []).map((e) => e.kind)
+		};
+	});
+	h.check(look.walls && look.rug && look.props, 'a studio: select-through walls, a rug, a lamp, an amp, a plant, a stool');
+	h.check(look.lights.includes('SpotLight') && look.lights.filter((t) => t === 'PointLight').length >= 2, `warm light: a spot and the lamps (${look.lights})`);
+	h.check(look.gradient && look.exposure >= 0.9, `a real backdrop, exposure ${look.exposure}`);
+	h.check(['ao', 'tonemapping', 'bloom', 'smaa'].every((k) => look.post.includes(k)), `the post floor (${look.post})`);
+	h.check(st.state === 'menu' && st.screen === 'start', `it is a game now: the start screen (${st.state}/${st.screen})`);
+	h.check(st.cursor.setting === 'free', `a free-cursor game (${JSON.stringify(st.cursor)})`);
+	h.check(!st.transport.playing, 'the transport is stopped on load (nothing plays until you do)');
+
+	// 1c — 30b: THE COCKPIT. Standing on the VR spawn, the controller TIP reaches a control on
+	// every instrument (piano, drums, sampler, transport, mixer) at hand height, and the laser
+	// has a clear line to every pedal and speaker. Measured from the scene, not believed.
+	const reach = await page.evaluate(() => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let scene, group;
+		s.globalScene.subscribe((v) => (scene = v))();
+		s.objectsGroup.subscribe((v) => (group = v))();
+		group.updateMatrixWorld(true);
+		const spawn = s.playSettings.resolvePlaySettings(scene).spawn;
+		if (!spawn) return { spawn: null };
+		const [fx, fy, fz] = spawn.position;
+		const head = new THREE.Vector3(fx, fy + 1.6, fz);
+		const devices = [];
+		group.traverse((o) => { if (o.userData?.device?.kind) devices.push(o); });
+		const out = {};
+		for (const d of devices) {
+			const kind = d.userData.device.kind.replace(/^mod-music-(lab|fx)-/, '');
+			let best = null;
+			d.traverse((m) => {
+				if (!m.isMesh || m === d) return;
+				if (!s.gameKit.vrGameInput.clickTargetOf({ object: m, point: new THREE.Vector3(), distance: 0 })) return;
+				if (/^vrpatch/.test(m.name)) return; // a cable jack is not the instrument
+				const b = new THREE.Box3().setFromObject(m);
+				const c = b.getCenter(new THREE.Vector3());
+				// horizontal distance from the feet axis to the nearest point of the control
+				const nx = Math.max(b.min.x, Math.min(fx, b.max.x));
+				const nz = Math.max(b.min.z, Math.min(fz, b.max.z));
+				const flat = Math.hypot(nx - fx, nz - fz);
+				// the laser: nothing opaque between the head and the control's centre
+				const dir = c.clone().sub(head);
+				const len = dir.length();
+				const ray = new THREE.Raycaster(head, dir.normalize(), 0, len - 0.02);
+				const blocker = ray.intersectObjects(group.children, true).find((hit) => {
+					let n = hit.object;
+					while (n && n !== group) {
+						if (n === d || n.userData?.pick === 'through') return false;
+						n = n.parent;
+					}
+					return true;
+				});
+				const row = { flat: +flat.toFixed(2), y: +c.y.toFixed(2), laser: +len.toFixed(2), blocked: blocker ? blocker.object.name : null };
+				if (!best || row.flat < best.flat) best = row;
+			});
+			(out[kind] ??= []).push(best);
+		}
+		return { spawn, out };
+	});
+	h.check(reach.spawn?.vrOnly === true && reach.spawn.position.join() === '1,0,-1', `30b: a VR-only spawn in the middle of the cockpit (${JSON.stringify(reach.spawn)})`);
+	const tipReach = ['piano', 'drums', 'sampler', 'transport', 'mixer'].map((k) => [k, reach.out?.[k]?.[0]]);
+	h.check(tipReach.every(([, r]) => r && r.flat <= 0.85 && r.y >= 0.6 && r.y <= 1.6), `30b: the tip reaches every instrument at hand height from the spawn (${JSON.stringify(Object.fromEntries(tipReach))})`);
+	const laserReach = Object.entries(reach.out ?? {}).flatMap(([k, rows]) => rows.map((r) => [k, r]));
+	h.check(laserReach.length === 12 && laserReach.every(([, r]) => r && !r.blocked && r.laser <= 3.5), `30b: the laser has a clear line to all twelve devices (${JSON.stringify(laserReach.filter(([, r]) => !r || r.blocked || r.laser > 3.5))})`);
+
+	// 2 — Play: no pointer lock, the start screen
+	await page.evaluate(() => window.__stores.isLocked.set(true));
+	await page.waitForTimeout(1500);
+	st = await snap();
+	const lockEl = await page.evaluate(() => !!document.pointerLockElement);
+	h.check(st.cursor.free === true && !lockEl, `in Play the cursor stays free (free ${st.cursor.free}, lock ${lockEl})`);
+	h.check(/JAM ROOM/.test(await hud()) && /Start jam/.test(await hud()) && /Your best tempo: 0 BPM/.test(await hud()), 'the start screen: title, Start jam, this device\'s best (none yet)');
+	// 30b: how to play, on a desktop and in VR; no music over the band; a desktop keeps its view
+	h.check(/HOW TO PLAY/.test(await hud()) && /VR: hold the trigger and sweep/.test(await hud()), '30b: the start screen says how to play, VR included');
+	const quiet = await page.evaluate(() => {
+		const s = window.__stores;
+		let m, cam;
+		s.gameKit.gameMusic.gameMusicState.subscribe((v) => (m = v))();
+		s.playerCam.subscribe((v) => (cam = v))();
+		const p = cam.getWorldPosition(new s.THREE.Vector3());
+		return { music: m, musicNodes: s.allNodes().filter((n) => n.type === 'gamemusic').length, eye: [p.x, p.y, p.z].map((n) => +n.toFixed(2)) };
+	});
+	h.check(quiet.music === null && quiet.musicNodes === 0, `30b: no game music — the room IS the music (${JSON.stringify(quiet.music)}, ${quiet.musicNodes} nodes)`);
+	h.check(Math.hypot(quiet.eye[0] - 1, quiet.eye[2] + 1) > 0.5, `30b: desktop Play does not stand on the VR-only spawn (eye ${quiet.eye})`);
+
+	// 3 — Start: the count-in, then the goal, which waits for the transport
+	await clickBtn('Start jam');
+	await h.eventually(() => snap().then((v) => `${v.state}/${v.screen}`), (v) => v === 'playing/countin', 'Start plays the count-in', 4000);
+	h.check(/Get ready/.test(await hud()) && /[123]/.test(await hud()), 'the count-in counts');
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'hud', 'after three seconds the goal shows', 6000);
+	await h.eventually(async () => await hud(), (t) => /Bar 0 \/ 8/.test(t) && /Press ▶ on the Transport/.test(t), 'Bar 0 / 8, and it says what starts the beat', 4000);
+	// a READABLE frame in play, measured on the goal screen (the start screen's panel would be
+	// measuring the menu): mean luminance of the centred 360 px square (fork 11)
+	const lum = await page.evaluate(async (b64) => {
+		const bmp = await createImageBitmap(await (await fetch('data:image/png;base64,' + b64)).blob());
+		const c = document.createElement('canvas'); c.width = bmp.width; c.height = bmp.height;
+		const x = c.getContext('2d'); x.drawImage(bmp, 0, 0);
+		const d = x.getImageData(Math.round(bmp.width / 2 - 180), Math.round(bmp.height / 2 - 180), 360, 360).data;
+		let sum = 0;
+		for (let i = 0; i < d.length; i += 4) sum += 0.2126 * d[i] + 0.7152 * d[i + 1] + 0.0722 * d[i + 2];
+		return sum / (d.length / 4) / 255;
+	}, (await page.screenshot(process.env.SHOT ? { path: process.env.SHOT } : {})).toString('base64'));
+	h.check(lum >= 0.25, `the play frame reads: centre luminance ${lum.toFixed(3)} >= 0.25`);
+	await page.waitForTimeout(1500);
+	h.check((await snap()).state === 'playing' && /Bar 0 \/ 8/.test(await hud()), 'with the transport stopped, no bar counts (the goal is the band playing)');
+
+	// 4 — the transport runs (the device's ▶, here through the same shared clock) at 240 BPM:
+	// eight bars are 32 beats, eight seconds
+	await page.evaluate(() => { const m = window.__stores.musicClock; m.setBpm(240); m.playTransport(); });
+	await h.eventually(async () => await hud(), (t) => /Keep the band going\s+·\s+240 BPM/.test(t), 'the hint follows the transport (playing, 240 BPM)', 4000);
+	await h.eventually(async () => await hud(), (t) => /Bar [1-7] \/ 8/.test(t), 'the bars count up', 6000);
+	const vr = await vrLines();
+	h.check(vr.panel.length === 0 && vr.lines.some((l) => /^Bar [1-7] \/ 8$/.test(l)) && vr.lines.some((l) => /^Beat [1-4]$/.test(l)), `30b: the bars and the beat read on the VR wrist/strip (${JSON.stringify(vr)})`);
+	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'over', 'eight bars complete the session (over)', 14000);
+	await h.eventually(async () => await hud(), (t) => /SESSION COMPLETE/.test(t) && /8 bars at 240 BPM/.test(t) && /Your best tempo: 240 BPM/.test(t), 'Session complete names the tempo and the best', 4000);
+	h.check((await stored())['jam-best-bpm'] === 240, 'the best tempo is saved on this device (jam-best-bpm 240)');
+	const done = await page.evaluate(() => window.__stores.gameKit.gameFeelActions.gameFeelActionsDebug());
+	h.check(done.last.some((e) => e.type === 'effectburst' && e.kind === 'confetti') && (done.sounds.levelup ?? 0) >= 1 && done.last.some((e) => e.type === 'hapticpulse' && e.pattern === 'success'), '30b: the session ends in confetti, the fanfare and a success buzz');
+	h.check(!done.last.some((e) => e.type === 'announce' && /complete/i.test(e.text)), '30b: and no banner over the Session complete panel (it read twice)');
+
+	// 5 — Play again: a fresh count-in, and the bars count from where the count-in ENDED —
+	// the transport is still running at beat 30-something
+	await clickBtn('Play again');
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'countin', 'Play again counts in again', 5000);
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'hud', 'and returns to the goal', 6000);
+	// flowValues publishes every 150 ms, so wait for the captured start beat to arrive there
+	let barsNow = {};
+	await h.eventually(
+		async () => (barsNow = await page.evaluate(() => {
+			let v; window.__stores.flowValues.subscribe((x) => (v = x))();
+			return { bars: v['bars'], beat: v['tbeat'], start: v['startbeat'] };
+		})),
+		(v) => v.start > 16, 'the count-in kept the beat it ended on (a replicated sample-and-hold)', 4000
+	);
+	h.check(barsNow.beat > 16 && barsNow.bars < 1.5, `the new round counts from its own start, not the transport's (${JSON.stringify(barsNow)})`);
+
+	// 6 — Quit to the start screen, which carries the best
+	await page.evaluate(() => {
+		window.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyP', bubbles: true }));
+		window.dispatchEvent(new KeyboardEvent('keyup', { code: 'KeyP', bubbles: true }));
+	});
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'pause', 'P opens the menu', 6000);
+	await clickBtn('Quit to menu');
+	await h.eventually(() => snap().then((v) => `${v.state}/${v.screen}`), (v) => v === 'menu/start', 'Quit returns to the start screen', 6000);
+	h.check(/Your best tempo: 240 BPM/.test(await hud()), 'the start screen shows the saved best');
+
+	await page.evaluate(() => { window.__stores.musicClock.stopTransport(); window.__stores.isLocked.set(false); });
+	await page.waitForTimeout(400);
+	await h.finish(browser);
+});
diff --git a/tests/e2e/game-loop.test.cjs b/tests/e2e/game-loop.test.cjs
index cc023995..a0d14096 100644
--- a/tests/e2e/game-loop.test.cjs
+++ b/tests/e2e/game-loop.test.cjs
@@ -82,7 +82,10 @@ h.run(async () => {
 			...withStates,
 			screens: withStates.screens.map((sc) => ({
 				...sc,
-				showWhile: sc.id === hudScreen ? 'playing' : 'menu'
+				showWhile: sc.id === hudScreen ? 'playing' : 'menu',
+				// 30 P1: the menu is pressed IN PLAY now, so it frees the pointer the way every
+				// Games-tab menu does (21-E3's menu substate)
+				...(sc.id === hudScreen ? {} : { input: 'menu' })
 			}))
 		});
 		await new Promise((r) => setTimeout(r, 600));
@@ -168,6 +171,10 @@ h.run(async () => {
 		// close the editor so the HUD renders in the viewport (D5's authoring rule)
 		window.__stores.hudEditorClose.set(true);
 	});
+	// 30 P1: a GAME's screens are drawn in PLAY, never over the editor (game-editor-flow),
+	// so both players press play first — which is also the only honest version of "the
+	// user's scenario": Start is a button inside the game, not a switch in the editor.
+	for (const p of [A, B]) await p.page.evaluate(() => window.__stores.playMode.requestPlay());
 	await page.waitForTimeout(1200);
 	const beforeA = await onScreen(A);
 	const beforeB = await onScreen(B);
@@ -238,10 +245,17 @@ h.run(async () => {
 	h.check(scoredB === 'Gems: 7', `and the peer derives the same string with no runtime message (${JSON.stringify(scoredB)})`);
 
 	// ---- 8. a LATE JOINER walks into a running game ------------------------
+	// A approves from the EDITOR (a peer cannot approve while in play); B stays in play,
+	// so the round keeps a player and the abandon watch leaves it running
+	await page.evaluate(() => window.__stores.playMode.exitPlay());
+	await page.waitForTimeout(600);
 	const C = await h.setupPage(browser, 'C');
 	await C.page.waitForFunction(() => !!window.__stores?.gameState, { timeout: 30000 });
 	await h.connect(C, A);
 	await C.page.waitForTimeout(3200);
+	// the joiner looks at the game the way a player does: from inside Play
+	await C.page.evaluate(() => window.__stores.playMode.requestPlay());
+	await C.page.waitForTimeout(1200);
 	const lateState = await gstate(C);
 	h.check(lateState.state === 'playing', `a late joiner arrives mid-game (${lateState.state})`);
 	h.check(lateState.vars?.gems === 7, `with the score already right (${lateState.vars?.gems})`);
@@ -286,6 +300,8 @@ h.run(async () => {
 	);
 
 	// ---- 9. the game ENDS, and everyone follows ----------------------------
+	await page.evaluate(() => window.__stores.playMode.requestPlay());
+	await page.waitForTimeout(600);
 	const ended = await page.evaluate(async () => {
 		const s = window.__stores;
 		s.gameState.setGameState('over', { outcome: 'won' });
diff --git a/tests/e2e/game-stars-room.test.cjs b/tests/e2e/game-stars-room.test.cjs
index d005ed72..617ee7e3 100644
--- a/tests/e2e/game-stars-room.test.cjs
+++ b/tests/e2e/game-stars-room.test.cjs
@@ -11,6 +11,12 @@
 // three and the room never holding more than 27 + maxAlive dynamic bodies (the spawner
 // RECYCLES at the cap — it does not refuse), one touch banked in MY row, and the optional
 // round: Start -> playing, every star swept -> "Lit: 24 / 24" -> over; P toggles the menu.
+//
+// 30 visuals-core: a START screen (Start round / Free play — free play is a game state of
+// its own, `free`), a two-minute round, Round over written from STORED values (every
+// perRound latch reads un-lit the instant the round ends), the best round saved on this
+// device, glass walls that clicks pass through, a starfield, and ONE pooled burst emitter a
+// Script node moves onto the star just hit — the fix for the emitter-cap toast on load.
 const h = require('./helpers.cjs');
 const fs = require('fs');
 const path = require('path');
@@ -117,14 +123,16 @@ h.run(async () => {
 	// 1 — the world arrived whole, with its physics block
 	let st = await snap();
 	const dyn = st.kids.filter((k) => k.dynamic);
-	h.check(st.kids.length === 36, `36 objects arrived (${st.kids.length})`);
+	// 30: 36 -> 50 (floor/ceiling rings, 8 frame pieces, starfield, burst anchor, deck light, card camera)
+	// 30b: -> 49, the burst anchor retired (the core's pooled Effect Burst replaced the trick)
+	h.check(st.kids.length === 49, `49 objects arrived (${st.kids.length})`);
 	h.check(dyn.length === 27, `27 dynamic bodies: 24 stars + 2 planets + the template (${dyn.length})`);
 	h.check(st.kids.filter((k) => /^Star \d+$/.test(k.name)).length === 24, 'the 24 stars are named Star 1..24');
 	h.check(st.gravity === 0 && st.ground?.enabled === false, `zero-g with the ground off (${st.gravity}, ground ${st.ground?.enabled})`);
 	h.check(st.knock?.enabled === true && Math.abs(st.knock.maxSpeed - 10) < 1e-9 && Math.abs(st.knock.spin - 0.6) < 1e-9, `the knock block restored ON from the file (${JSON.stringify(st.knock)})`);
 	h.check(Math.abs((st.damping?.linear ?? 0) - 0.35) < 1e-9, `damping 0.35 (${st.damping?.linear})`);
 	h.check(st.play?.simOnPlay === true && st.play?.interaction === 'grab' && st.play?.grounded === false, 'play block: grab, flying, simOnPlay');
-	h.check(st.state === 'menu' && st.screen === 'free', `starts in free play (${st.state}/${st.screen})`);
+	h.check(st.state === 'menu' && st.screen === 'start', `starts on the start screen (${st.state}/${st.screen})`);
 	const chime = await page.evaluate(() => {
 		const s = window.__stores;
 		const snd = s.allNodes().find((n) => n.type === 'sound');
@@ -134,19 +142,98 @@ h.run(async () => {
 	h.check(!!chime.hash && /^[0-9a-f]{16,}$/.test(chime.hash) && chime.held, `the chime's hash was remapped and its bytes rode the file into the Explorer (${chime.hash?.slice(0, 8)}, held ${chime.held})`);
 	h.check(chime.nodes > 200, `the graph is there (${chime.nodes} nodes)`);
 
+	// 1b — 30: the look and the emitter budget, measured
+	const look = await page.evaluate(() => {
+		const s = window.__stores;
+		const g = (st) => { let v; st.subscribe((x) => (v = x))(); return v; };
+		const group = g(s.objectsGroup);
+		const walls = ['Wall north', 'Wall south', 'Wall west', 'Wall east'].map((n) => group.getObjectByName(n));
+		const star = group.getObjectByName('Star 1');
+		let userEmitters = 0;
+		group.traverse((o) => { if (o.userData?.particles) userEmitters++; });
+		const env = g(s.environment.environment);
+		return {
+			glass: walls.every((w) => w?.userData?.pick === 'through' && w.material.opacity < 0.25),
+			star: star && { geo: star.geometry.type, mat: star.material.type, collider: star.userData.physics?.collider },
+			particleNodes: s.allNodes().filter((n) => n.type === 'particle').length,
+			userEmitters,
+			starfield: !!group.getObjectByName('Starfield')?.userData?.particles,
+			exposure: env?.exposure, gradient: !!env?.customPreset?.gradient
+		};
+	});
+	h.check(look.glass, 'the four walls are glass panels, select-through');
+	h.check(look.star?.geo === 'IcosahedronGeometry' && look.star.mat === 'MeshPhysicalMaterial' && look.star.collider === 'sphere', `the stars are crystals with sphere colliders (${JSON.stringify(look.star)})`);
+	h.check(look.starfield && look.exposure >= 0.9 && look.gradient, `a starfield under a gradient sky, exposure ${look.exposure}`);
+	h.check(look.particleNodes + look.userEmitters <= 8, `the emitters fit the runtime's cap of 8 (${look.particleNodes} nodes + ${look.userEmitters} on objects; it was 24 per-star bursts)`);
+	const loadToasts = await page.locator('.tp-toast').allTextContents().catch(() => []);
+	h.check(!loadToasts.some((t) => /emitter cap|cap \(8\)/i.test(t)), `no emitter-cap toast on load (${JSON.stringify(loadToasts).slice(0, 120)})`);
+
+	// 30b: the game-feel stores the suite reads (sound / burst / banner / music)
+	const feel = () =>
+		page.evaluate(() => {
+			const k = window.__stores.gameKit;
+			let music, ann;
+			k.gameMusic.gameMusicState.subscribe((v) => (music = v))();
+			k.gameAnnounce.gameAnnouncement.subscribe((v) => (ann = v))();
+			const d = k.gameFeelActions.gameFeelActionsDebug();
+			return { music: music?.preset ?? null, ann: ann?.text ?? null, last: d.last, fired: d.fired, sounds: d.sounds };
+		});
+	const resetFeel = () => page.evaluate(() => window.__stores.gameKit.gameFeelActions.resetGameFeelActionsDebug());
+	// 30b: what the VR wrist card / top strip would SAY right now (vr-play's overlay split)
+	const vrLines = () =>
+		page.evaluate(() => {
+			const s = window.__stores;
+			const k = s.gameKit.vrGamePanel;
+			let rt; s.hudDocs.hudRuntime.subscribe((v) => (rt = v))();
+			const { panel, overlay } = k.vrScreens();
+			return { panel: panel.map((p) => p.screen.id), lines: overlay.flatMap((o) => k.overlayLines(o.screen.elements, rt)) };
+		});
+
 	// 2 — entering play starts the sim (free play, no round)
 	await page.evaluate(() => window.__stores.isLocked.set(true));
 	await h.eventually(() => snap().then((v) => v.sim), (v) => v === true, 'entering play starts the sim', 10000);
 	await page.waitForTimeout(600);
 	st = await snap();
-	h.check(st.state === 'menu' && st.screen === 'free', 'free play: the sim runs while the game shell stays in menu');
+	h.check(st.state === 'menu' && st.screen === 'start', 'the start screen shows in play, the sim running behind it');
+	// 30b: the menu says how to play, the room has its music, and Play put you on the spawn
+	h.check(/HOW TO PLAY/.test(await hud()) && /Knock every crystal star once to light it/.test(await hud()), '30b: the start screen says HOW TO PLAY');
+	await h.eventually(() => feel().then((f) => f.music), (m) => m === 'space', '30b: the space music plays in Play', 6000);
+	const eye = await page.evaluate(() => {
+		const s = window.__stores;
+		let cam; s.playerCam.subscribe((v) => (cam = v))();
+		const p = cam.getWorldPosition(new s.THREE.Vector3());
+		return [p.x, p.y, p.z].map((n) => +n.toFixed(2));
+	});
+	h.check(Math.abs(eye[0]) < 0.05 && Math.abs(eye[1] - 1.7) < 0.05 && Math.abs(eye[2] - 5.2) < 0.05, `30b: Play put the eye on the spawn, inside the south glass (${eye})`);
+	h.check(/Start round/.test(await hud()) && /Free play/.test(await hud()) && /Your best round: 0 \/ 24/.test(await hud()), 'it offers Start round and Free play, and this device\'s best (none yet)');
+	await clickBtn('Free play');
+	await h.eventually(() => snap().then((v) => `${v.state}/${v.screen}`), (v) => v === 'free/free', 'Free play: the `free` state and its screen', 6000);
 	h.check(/STARS ROOM/.test(await hud()) && /free play/.test(await hud()), 'the free-play banner renders');
+	// 30: a READABLE frame in play — mean luminance of the centred 360 px square (fork 11)
+	await page.waitForTimeout(800);
+	const lum = await page.evaluate(async (b64) => {
+		const bmp = await createImageBitmap(await (await fetch('data:image/png;base64,' + b64)).blob());
+		const c = document.createElement('canvas'); c.width = bmp.width; c.height = bmp.height;
+		const x = c.getContext('2d'); x.drawImage(bmp, 0, 0);
+		const d = x.getImageData(Math.round(bmp.width / 2 - 180), Math.round(bmp.height / 2 - 180), 360, 360).data;
+		let sum = 0;
+		for (let i = 0; i < d.length; i += 4) sum += 0.2126 * d[i] + 0.7152 * d[i + 1] + 0.0722 * d[i + 2];
+		return sum / (d.length / 4) / 255;
+	}, (await page.screenshot()).toString('base64'));
+	h.check(lum >= 0.25, `the play frame reads: centre luminance ${lum.toFixed(3)} >= 0.25`);
 
 	// 3 — a hand knocks Star 1: it leaves at hand speed, and damping bleeds it
 	const k1 = await knockStar('Star 1', 4);
 	h.check(k1.hits === 1, `a 4 m/s pass knocks Star 1 once (${k1.hits})`);
 	h.check(!!k1.atHit && Math.abs(mag(k1.atHit) - 4) < 0.4, `...and it leaves at ~4 m/s (${mag(k1.atHit).toFixed(2)})`);
-	await page.waitForTimeout(500);
+	// 30b: the knocked star SPARKLES where it was hit — the core's pooled Effect Burst, at the
+	// star (the 30 anchor-and-Script trick is retired)
+	await page.waitForTimeout(250);
+	const star1At = (await snap()).kids.find((k) => k.name === 'Star 1')?.pos;
+	const sparkle = (await feel()).last.filter((e) => e.type === 'effectburst' && e.kind === 'sparkle' && e.fired);
+	const near = sparkle.find((e) => star1At && Math.hypot(e.where[0] - star1At[0], e.where[1] - star1At[1], e.where[2] - star1At[2]) < 1.2);
+	h.check(!!near, `the knocked star sparkled where it was hit (${JSON.stringify(sparkle.map((e) => e.where))}, star ${star1At})`);
+	await page.waitForTimeout(350);
 	const v05 = speedOf(await bodyOf(k1.uuid));
 	await page.waitForTimeout(2500);
 	const v3 = speedOf(await bodyOf(k1.uuid));
@@ -177,12 +264,26 @@ h.run(async () => {
 	h.check(alive <= 27 + 32 && alive >= before + 3, `twelve more presses never exceed 27 + maxAlive 32 (${alive}) — the spawner recycles, it does not pile up`);
 
 	// 6 — the round: Start -> playing; sweep every star -> Lit 24/24 -> over
+	await resetFeel();
 	await clickBtn('Start round: light every star');
 	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'playing', 'Start flips to playing', 8000);
 	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'hud', 'the round HUD shows', 6000);
+	await h.eventually(() => feel(), (f) => f.last.some((e) => e.type === 'announce' && e.text === 'Light every star!') && f.last.some((e) => e.sound === 'whistle'), '30b: the round opens with a banner and a whistle', 4000);
 	await page.waitForTimeout(800);
+	await resetFeel();
 	await knockStar('Star 3', 3, 'q');
 	await h.eventually(async () => await hud(), (t) => /Lit: 1 \/ 24/.test(t), 'one hit lights one star (Lit: 1 / 24)', 8000);
+	// 30b: the score is readable in VR — the round HUD is an OVERLAY, so the wrist card and the
+	// top strip carry "Lit: 1 / 24" and the clock (the menu screens go to the VR board)
+	const vr = await vrLines();
+	h.check(vr.panel.length === 0 && vr.lines.some((l) => /^Lit: 1 \/ 24$/.test(l)) && vr.lines.some((l) => /\d+s left/.test(l)), `30b: the score and the clock read on the VR wrist/strip (${JSON.stringify(vr)})`);
+	// 30b: LIGHTING a star pays a coin chime at it and a tap in VR — once per star per round
+	await h.eventually(() => feel(), (f) => f.last.filter((e) => e.sound === 'coin' && e.spatial).length === 1 && (f.fired.hapticpulse ?? 0) === 1, '30b: lighting Star 3 plays one coin at it and asks one tap', 4000);
+	await page.waitForTimeout(1500); // let it drift, then knock it again inside the same round
+	await knockStar('Star 3', 3, 'q2');
+	await page.waitForTimeout(700);
+	const again = await feel();
+	h.check(again.last.filter((e) => e.sound === 'coin').length === 1 && again.last.filter((e) => e.type === 'effectburst').length >= 2, `30b: a second knock sparkles again but pays no second coin (coins ${again.last.filter((e) => e.sound === 'coin').length}, sparkles ${again.last.filter((e) => e.type === 'effectburst').length})`);
 	const lit3 = await page.evaluate(() => {
 		let group; window.__stores.objectsGroup.subscribe((v) => (group = v))();
 		return '#' + group.getObjectByName('Star 3').material.color.getHexString();
@@ -234,15 +335,30 @@ h.run(async () => {
 	});
 	await h.eventually(litThisRound, (n) => n >= 24, 'all 24 latches were set this round (hit stamps at or after startedAt)', 10000);
 	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'over', 'every star lit ends the round (over)', 10000);
-	h.check(/EVERY STAR LIT/.test(await hud()) && /Every star lit in \d+s/.test(await hud()), 'the over screen names the time');
+	// 30b: the round ends in confetti and a cheer, and the win is announced
+	await h.eventually(() => feel(), (f) => f.last.some((e) => e.type === 'effectburst' && e.kind === 'confetti') && f.last.some((e) => e.sound === 'cheer') && (f.sounds.levelup ?? 0) === 1, '30b: over = confetti, a cheer and the win fanfare', 4000);
+	h.check(!(await feel()).last.some((e) => e.type === 'announce' && /lit!|up!/i.test(e.text)), '30b: and no banner over the results panel (it read twice)');
+	const coins = (await feel()).sounds.coin ?? 0;
+	h.check(coins === 24, `30b: the sweep paid exactly one coin per star lit (${coins} / 24)`);
+	await h.eventually(async () => await hud(), (t) => /EVERY STAR LIT/.test(t) && /Every star lit in \d+s/.test(t) && /Your best: 24 \/ 24/.test(t), 'the over screen names the time and the best, from storage');
+	const storedStars = await page.evaluate(() => {
+		const out = {};
+		for (let i = 0; i < localStorage.length; i++) {
+			const k = localStorage.key(i);
+			if (/^tp:scene:.*:stars-(best|last|time)$/.test(k)) out[k.split(':').pop()] = JSON.parse(localStorage.getItem(k));
+		}
+		return out;
+	});
+	h.check(storedStars['stars-best'] === 24 && storedStars['stars-last'] === 24 && storedStars['stars-time'] > 0, `the round was saved on this device (${JSON.stringify(storedStars)})`);
 
 	// 7 — a NEW round un-lights every star (the perRound reset, and the repaint that
 	// proves the paint tracks the round rather than sticking). Material colour is NOT
 	// base-managed — restoreBase carries pose and visibility only — so a star does not
 	// revert to its authored palette colour when the round ends; it is repainted when the
 	// next round starts, which is the behaviour worth asserting.
-	await clickBtn('Back to free play');
-	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'menu', 'Back to free play returns to menu', 8000);
+	await clickBtn('Menu');
+	await h.eventually(() => snap().then((v) => `${v.state}/${v.screen}`), (v) => v === 'menu/start', 'Menu returns to the start screen', 8000);
+	h.check(/Your best round: 24 \/ 24/.test(await hud()), 'the start screen shows the saved best round (24 / 24)');
 	await pressP();
 	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'pause', 'the menu opens again', 6000);
 	await clickBtn('Start round: light every star');
diff --git a/tests/e2e/game-towers.test.cjs b/tests/e2e/game-towers.test.cjs
index ae72bd1f..27ad9279 100644
--- a/tests/e2e/game-towers.test.cjs
+++ b/tests/e2e/game-towers.test.cjs
@@ -1,8 +1,15 @@
 // B8 ACCEPTANCE — the Towers game template (redesigned after the first playthrough:
 // PRE-PLACED crates, no spawner, lit daylight, a pause/restart menu). Loaded from the
-// REAL .tpscene in the sibling scenes checkout with the REAL collectible zip, driven
-// through the real surfaces. Skip-never-fail when the scenes checkout or the zip is
-// absent — authored content, not core code, must keep a bare checkout green.
+// REAL .tpscene in the sibling scenes checkout (or TOWERS_TPSCENE=<path>, a lane's staged
+// build) with the REAL collectible zip, driven through the real surfaces. Skip-never-fail
+// when the scenes checkout or the zip is absent — authored content, not core code, must
+// keep a bare checkout green.
+//
+// 30 visuals-core: the finished look (glowing rings with select-through, a tiled floor from
+// a shader graph, wooden crates, a sky + ground, stars that turn and breathe once a round
+// starts), a centred HUD, a readable frame in play, and the BEST HEIGHT saved on this device
+// (Store Value max) and shown on the menu, with the Round-over screen reading this round's
+// height from `towers-last` — a perRound latch reads un-set the moment the round ends.
 const h = require('./helpers.cjs');
 const fs = require('fs');
 const path = require('path');
@@ -11,11 +18,11 @@ const SCENES_REPO = [
 	path.resolve(__dirname, '../../../theprototype.app-scenes'),
 	path.resolve(__dirname, '../../../scenes')
 ].find((p) => fs.existsSync(p));
-const TPSCENE = SCENES_REPO && path.join(SCENES_REPO, 'games/towers/scene.tpscene');
+const TPSCENE = process.env.TOWERS_TPSCENE || (SCENES_REPO && path.join(SCENES_REPO, 'games/towers/scene.tpscene'));
 
 h.run(async () => {
 	if (!TPSCENE || !fs.existsSync(TPSCENE)) {
-		console.log('SKIP: no sibling scenes checkout with games/towers/scene.tpscene');
+		console.log('SKIP: no sibling scenes checkout with games/towers/scene.tpscene (or TOWERS_TPSCENE)');
 		return;
 	}
 	const browser = await h.launch({ args: h.GPU_ARGS });
@@ -56,25 +63,120 @@ h.run(async () => {
 			};
 		});
 	const hud = async () => (await page.locator('#hud-layer').textContent()) ?? '';
+	// 30b: the game-feel stores the suite reads (sound / burst / banner / music)
+	const feel = () =>
+		page.evaluate(() => {
+			const k = window.__stores.gameKit;
+			let music;
+			k.gameMusic.gameMusicState.subscribe((v) => (music = v))();
+			const d = k.gameFeelActions.gameFeelActionsDebug();
+			return { music: music?.preset ?? null, last: d.last, fired: d.fired, sounds: d.sounds };
+		});
+	const resetFeel = () => page.evaluate(() => window.__stores.gameKit.gameFeelActions.resetGameFeelActionsDebug());
 	const clickBtn = (text) => page.locator('#hud-layer button', { hasText: text }).click();
 
 	// 1 — the world arrived whole and lit
 	let st = await snap();
-	h.check(st.kids.length === 24, `the 24 objects arrived (${st.kids.length})`);
+	// 30: 24 -> 36 (4 wall trims, the pad rim + its light, the height pole + 4 marks, the card camera)
+	h.check(st.kids.length === 36, `the 36 objects arrived (${st.kids.length})`);
 	const crates = st.kids.filter((k) => k.dynamic);
 	h.check(crates.length === 9, `9 pre-placed dynamic crates (${crates.length})`);
 	h.check(st.play?.simOnPlay === true && st.play?.interaction === 'grab', 'play block: grab + simOnPlay');
 	h.check(st.state === 'menu' && st.screen === 'menu', `starts on the menu screen (${st.state}/${st.screen})`);
-	h.check(/TOWERS/.test(await hud()), 'the menu renders (TOWERS)');
+
+	// 1b — 30 visuals-core: the finished look is DATA in the file, measured rather than seen
+	const look = await page.evaluate(() => {
+		const s = window.__stores;
+		const g = (st) => { let v; st.subscribe((x) => (v = x))(); return v; };
+		const group = g(s.objectsGroup);
+		const ring = group.getObjectByName('Height ring 2m');
+		const floor = group.getObjectByName('Arena floor');
+		const crate = group.getObjectByName('Cube 1');
+		const star = group.getObjectByName('Star 1');
+		const env = g(s.environment.environment);
+		const anims = g(s.animationPreview.animations);
+		const clip = anims[star?.uuid];
+		return {
+			ring: ring && { geo: ring.geometry.type, pick: ring.userData.pick ?? null, sensor: !!ring.userData.physics?.sensor, collider: ring.userData.physics?.collider },
+			floorShader: !!g(s.shaderGraph.shaderGraphs)[floor?.uuid] && !g(s.shaderGraph.shaderErrors)[floor?.uuid],
+			floorPatched: !!floor && Object.prototype.hasOwnProperty.call(floor.material, 'onBeforeCompile'),
+			crate: crate && { type: crate.material.type, sheen: crate.material.sheen ?? 0, verts: crate.geometry.attributes.position.count },
+			starClip: clip ? Object.values(clip.clips).map((c) => c.name) : [],
+			gradient: !!env?.customPreset?.gradient, ground: !!env?.customPreset?.ground, exposure: env?.exposure,
+			post: (g(s.scenePost.scenePost)?.effects ?? []).map((e) => e.kind)
+		};
+	});
+	h.check(look.ring?.geo === 'TorusGeometry' && look.ring.pick === 'through' && look.ring.sensor && look.ring.collider === 'box', `the height markers are thin glowing ring SENSORS, select-through (${JSON.stringify(look.ring)})`);
+	h.check(look.floorShader && look.floorPatched, `the arena floor carries its tile shader graph, compiled and installed (${look.floorShader}/${look.floorPatched})`);
+	h.check(look.crate?.type === 'MeshPhysicalMaterial' && look.crate.sheen > 0 && look.crate.verts > 36, `the crates are chamfered wood: physical + sheen (${JSON.stringify(look.crate)})`);
+	h.check(look.starClip.includes('Star glow'), `every star carries the Turntable + Pulse clip (${look.starClip})`);
+	h.check(look.gradient && look.ground && look.exposure >= 0.9, `a real sky and ground, exposure >= 0.9 (${look.gradient}/${look.ground}/${look.exposure})`);
+	h.check(['ao', 'tonemapping', 'bloom', 'smaa'].every((k) => look.post.includes(k)), `the post floor: AO, tone mapping, bloom, SMAA (${look.post})`);
+	// no toast on load (the Stars Room emitter-cap toast was the finding)
+	const loadToasts = await page.locator('.tp-toast').allTextContents().catch(() => []);
+	h.check(!loadToasts.some((t) => /cap|error|went wrong/i.test(t)), `no warning toast on load (${JSON.stringify(loadToasts).slice(0, 120)})`);
 
 	// 2 — entering play starts the sim (simOnPlay honoured from the file)
 	await page.evaluate(() => window.__stores.isLocked.set(true));
 	await h.eventually(() => snap().then((v) => v.sim), (v) => v === true, 'entering play starts the sim', 10000);
+	// 30 P1: a game's menu is drawn in PLAY, not over the editor (game-editor-flow covers
+	// the editor half), so the menu check lives on this side of the play press now
+	h.check(/TOWERS/.test(await hud()), 'the menu renders in play (TOWERS)');
+	h.check(/Your best tower: 0 m/.test(await hud()), 'the menu shows this device\'s best height (none yet: 0 m)');
+	// 30b: HOW TO PLAY on the menu, the arcade music in Play, and Play put the eye on the spawn
+	h.check(/HOW TO PLAY/.test(await hud()) && /gold ring at 4 m is the top/.test(await hud()) && /VR: grip grabs a crate/.test(await hud()), '30b: the menu says how to play, on a desktop and in VR');
+	await h.eventually(() => feel().then((f) => f.music), (m) => m === 'arcade', '30b: the arcade music plays in Play', 6000);
+	const eye = await page.evaluate(() => {
+		const s = window.__stores;
+		let cam; s.playerCam.subscribe((v) => (cam = v))();
+		const p = cam.getWorldPosition(new s.THREE.Vector3());
+		return [p.x, p.y, p.z].map((n) => +n.toFixed(2));
+	});
+	h.check(Math.abs(eye[0]) < 0.05 && Math.abs(eye[1] - 1.7) < 0.05 && Math.abs(eye[2] - 4.5) < 0.05, `30b: Play put the eye on the spawn in front of the pad (${eye})`);
+	// 30: a centred HUD text is CENTRED — the words, not the box (a flex row shrank the line
+	// to its text, so text-align did nothing and every centred title sat flush left)
+	const centring = await page.evaluate(() => {
+		const out = {};
+		for (const el of document.querySelectorAll('#hud-layer .hud-text')) {
+			const t = el.textContent.trim();
+			if (t !== 'TOWERS' && !/^Your best tower/.test(t)) continue;
+			const r = document.createRange();
+			r.selectNodeContents(el);
+			const words = r.getBoundingClientRect();
+			const box = el.getBoundingClientRect();
+			out[t.slice(0, 12)] = +((words.left + words.width / 2) - (box.left + box.width / 2)).toFixed(1);
+		}
+		return out;
+	});
+	h.check(Object.keys(centring).length === 2 && Object.values(centring).every((d) => Math.abs(d) < 3), `centred HUD texts are centred on their box (offsets ${JSON.stringify(centring)})`);
 
 	// 3 — the Start button flips to playing and swaps the menu for the HUD
+	await resetFeel();
 	await clickBtn('Start round');
 	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'playing', 'Start flips to playing', 8000);
+	await h.eventually(() => feel(), (f) => (f.sounds.click ?? 0) >= 1 && (f.sounds.whistle ?? 0) >= 1 && f.last.some((e) => e.type === 'announce' && e.text === 'Build!'), '30b: Start clicks, whistles and says "Build!"', 4000);
 	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'hud', 'the in-game HUD screen shows', 6000);
+	// 30: the stars turn and breathe once the round starts (a Play Animation per star)
+	await h.eventually(
+		() => page.evaluate(() => {
+			const s = window.__stores; let group, pb;
+			s.objectsGroup.subscribe((v) => (group = v))(); s.animationPreview.playback.subscribe((v) => (pb = v))();
+			return ['Star 1', 'Star 2', 'Star 3'].filter((n) => pb[group.getObjectByName(n)?.uuid]?.playing).length;
+		}),
+		(n) => n === 3, 'Start sets all three stars turning (their Star glow clip plays)', 6000
+	);
+	// 30: a READABLE frame in play — mean luminance of the centred 360 px square (fork 11)
+	await page.waitForTimeout(800);
+	const lum = await page.evaluate(async (b64) => {
+		const bmp = await createImageBitmap(await (await fetch('data:image/png;base64,' + b64)).blob());
+		const c = document.createElement('canvas'); c.width = bmp.width; c.height = bmp.height;
+		const x = c.getContext('2d'); x.drawImage(bmp, 0, 0);
+		const d = x.getImageData(Math.round(bmp.width / 2 - 180), Math.round(bmp.height / 2 - 180), 360, 360).data;
+		let sum = 0;
+		for (let i = 0; i < d.length; i += 4) sum += 0.2126 * d[i] + 0.7152 * d[i + 1] + 0.0722 * d[i + 2];
+		return sum / (d.length / 4) / 255;
+	}, (await page.screenshot()).toString('base64'));
+	h.check(lum >= 0.25, `the play frame reads: centre luminance ${lum.toFixed(3)} >= 0.25`);
 
 	// 4 — crates rest stably (no cycling): population and dynamic count hold over 4s
 	const before = (await snap()).kids.length;
@@ -93,7 +195,46 @@ h.run(async () => {
 		o.position.set(0, 3.5, 0); o.updateMatrix();
 	}, crate.uuid);
 	await h.eventually(async () => await hud(), (t) => /Best height: [1-3] m/.test(t), 'lifting a crate latches the height HUD', 12000);
+	// 30b: every ring the crate crossed is a MILESTONE — a banner, a burst at the ring, its
+	// chime, and a buzz for a player in VR
+	await h.eventually(
+		() => feel(),
+		(f) => [1, 2, 3].every((i) => f.last.some((e) => e.type === 'announce' && e.text === 'Ring ' + i + ' reached')),
+		'30b: rings 1, 2 and 3 are announced as they are reached', 6000
+	);
+	const rings = await feel();
+	const bursts = rings.last.filter((e) => e.type === 'effectburst' && e.kind === 'sparkle' && e.fired);
+	h.check([1, 2, 3].every((y) => bursts.some((b) => Math.abs(b.where[1] - y) < 0.05 && Math.hypot(b.where[0], b.where[2]) < 0.05)), `30b: a sparkle burst AT each ring (${JSON.stringify(bursts.map((b) => b.where.map((n) => +n.toFixed(2))))})`);
+	h.check((rings.sounds.ring ?? 0) === 3 && rings.last.filter((e) => e.sound === 'ring').every((e) => e.spatial), `30b: each ring chimes once, from the ring (${rings.sounds.ring})`);
+	h.check((rings.fired.hapticpulse ?? 0) >= 1 && rings.last.some((e) => e.type === 'hapticpulse' && e.pattern === 'success' && e.felt), `30b: and asks the success buzz, felt in Play (${rings.fired.hapticpulse})`);
+	// a crate re-entering ring 1 in the same round is not a new milestone
+	await page.evaluate(() => {
+		let group; window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		window.__stores.flowRuntime.fireObjectEnter(group.getObjectByName('Height ring 1m').uuid, group.getObjectByName('Cube 2').uuid);
+	});
+	await page.waitForTimeout(700);
+	const re = await feel();
+	h.check(re.last.filter((e) => e.type === 'announce' && e.text === 'Ring 1 reached').length === 1 && (re.sounds.ring ?? 0) === 3, '30b: a second crossing of ring 1 in the same round says nothing (a perRound Once)');
+	// THE TOP: the gold ring is the big one
+	await page.evaluate((uuid) => {
+		let group; window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.children.find((c) => c.uuid === uuid);
+		o.position.set(0, 4.4, 0); o.updateMatrix();
+	}, crate.uuid);
+	await h.eventually(() => feel(), (f) => f.last.some((e) => e.type === 'announce' && e.text === 'Top of the tower!') && (f.sounds.levelup ?? 0) === 1 && f.last.some((e) => e.type === 'effectburst' && e.kind === 'confetti' && Math.abs(e.where[1] - 4) < 0.05), '30b: the gold ring: "Top of the tower!", confetti at the ring and the level-up fanfare', 8000);
+	// ...and when that crate comes down on the pad it lands with a knock (On Impact -> Game Sound)
+	await h.eventually(() => feel(), (f) => f.last.some((e) => e.sound === 'hit' && e.spatial), '30b: a falling crate lands with a knock, at the crate', 8000);
 	h.check(/Stars left: 3/.test(await hud()), 'the collectible module reports 3 stars left');
+	// 30: the crossing SAVED the height on this device (Store Value max + the round's `set`)
+	const stored = () => page.evaluate(() => {
+		const out = {};
+		for (let i = 0; i < localStorage.length; i++) {
+			const k = localStorage.key(i);
+			if (/^tp:scene:.*:towers-(best|last)$/.test(k)) out[k.split(':').pop().replace('towers-', '')] = JSON.parse(localStorage.getItem(k));
+		}
+		return out;
+	});
+	await h.eventually(stored, (v) => v.best >= 1 && v.last === v.best, 'the best height is saved on this device (towers-best, towers-last)', 6000);
 	h.check(/\d+s/.test(await hud()), 'the round clock renders');
 
 	// 5b — GRAB: aim at a crate and pointerdown carries it (the user's "cannot take
@@ -121,9 +262,48 @@ h.run(async () => {
 		return window.__stores.playInteract.playInteractDebug().carrying;
 	});
 	h.check(carrying === grabCrate, `pointerdown grabs the crate (${carrying === grabCrate})`);
+	// 30b: the lift makes a sound, placed at the crate (On Grab -> Game Sound)
+	await h.eventually(() => feel(), (f) => f.last.some((e) => e.sound === 'pop' && e.spatial), '30b: grabbing the crate pops, at the crate', 3000);
 	await page.evaluate(() => window.dispatchEvent(new PointerEvent('pointerup', { button: 0, bubbles: true })));
 	await page.waitForTimeout(300);
 
+	// 5c — 30: Round over reads THIS round's height from the stored `towers-last` (a perRound
+	// latch reads 0 the instant the round ends, which is what the old line showed) and the
+	// best from `towers-best`; Play again starts a fresh round and re-zeroes the round's value
+	const kept = await stored();
+	// clear the pad first: a crate still standing through a ring re-crosses it in the next
+	// round (the sensor overlap is live), which would make "this round" honestly 1 m — and
+	// was, measured, the base's red on "Restart cleared the height latches"
+	await page.evaluate(() => {
+		let group; window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		let n = 0;
+		for (const c of group.children) {
+			if (c.userData?.physics?.mode !== 'dynamic') continue;
+			if (Math.hypot(c.position.x, c.position.z) > 1.6 && c.position.y < 0.9) continue;
+			c.position.set(-9 + (n++ % 6) * 0.9, 0.35, 8);
+			c.updateMatrix();
+		}
+		window.__stores.objectsGroup.update((v) => v);
+	});
+	await page.waitForTimeout(1200);
+	await page.evaluate(() => window.__stores.gameState.setGameState('over', { outcome: "Time's up!" }));
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'over', 'the round ends on the Round-over screen', 6000);
+	await h.eventually(async () => await hud(), (t) => new RegExp('This round: ' + kept.last + ' m').test(t) && new RegExp('Best ever: ' + kept.best + ' m').test(t), `Round over reads this round (${kept.last} m) and the best (${kept.best} m) from storage`, 6000);
+	// a crate jittering in a ring sensor after the round ended re-fires the crossing while
+	// every latch reads 0 — the round's stored height must survive it (a `set` would wipe it)
+	await page.evaluate(() => {
+		let group; window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		const ring = group.getObjectByName('Height ring 1m');
+		const crate = group.getObjectByName('Cube 1');
+		window.__stores.flowRuntime.fireObjectEnter(ring.uuid, crate.uuid);
+	});
+	await page.waitForTimeout(800);
+	const afterJitter = await stored();
+	h.check(afterJitter.last === kept.last && new RegExp('This round: ' + kept.last + ' m').test(await hud()), `a crossing re-fired on the Round-over screen leaves this round's height alone (${JSON.stringify(afterJitter)})`);
+	await clickBtn('Play again');
+	await h.eventually(() => snap().then((v) => v.state), (v) => v === 'playing', 'Play again starts a fresh round', 8000);
+	await h.eventually(stored, (v) => v.last === 0 && v.best === kept.best, 'the fresh round zeroes this round\'s height and keeps the best', 6000);
+
 	// 6 — PAUSE menu (P) offers Restart while playing
 	await page.evaluate(() => {
 		window.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyP', bubbles: true }));
@@ -137,6 +317,16 @@ h.run(async () => {
 	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'hud', 'Restart returns to play', 8000);
 	await h.eventually(async () => await hud(), (t) => /Best height: 0 m/.test(t), 'Restart cleared the height latches', 8000);
 
+	// 8 — 30: Quit to menu, and the menu carries the saved best height
+	await page.evaluate(() => {
+		window.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyP', bubbles: true }));
+		window.dispatchEvent(new KeyboardEvent('keyup', { code: 'KeyP', bubbles: true }));
+	});
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'pause', 'P opens the pause menu again', 6000);
+	await clickBtn('Quit to menu');
+	await h.eventually(() => snap().then((v) => v.screen), (v) => v === 'menu', 'Quit returns to the menu', 8000);
+	await h.eventually(async () => await hud(), (t) => new RegExp('Your best tower: ' + kept.best + ' m').test(t), `the menu shows the saved best (${kept.best} m)`, 6000);
+
 	await page.evaluate(() => window.__stores.isLocked.set(false));
 	await page.waitForTimeout(400);
 	await h.finish(browser);
diff --git a/tests/e2e/game-untangle.test.cjs b/tests/e2e/game-untangle.test.cjs
index e45c2f8c..2c5a43c5 100644
--- a/tests/e2e/game-untangle.test.cjs
+++ b/tests/e2e/game-untangle.test.cjs
@@ -30,7 +30,8 @@ const path = require('path');
 const SCENES_BASE = (process.env.UNTANGLE_SCENES_BASE || 'https://cdn.jsdelivr.net/gh/theprototype-app/scenes@format-2').replace(/\/$/, '');
 const MODULES_BASE = (process.env.UNTANGLE_MODULES_BASE || 'https://cdn.jsdelivr.net/gh/theprototype-app/modules@main').replace(/\/$/, '');
 const ROOT = path.resolve(__dirname, '../../..');
-const TEMPLATE_LEVEL = 2;
+const TEMPLATE_LEVEL = 1; // 30-untangle: a new player has only level 1 open
+const dotsFor = (l) => 5 + Math.round(((Math.min(30, l) - 1) * 11) / 29); // the roadmap-30 curve
 
 async function fetchBytes(url) {
 	try {
@@ -195,15 +196,15 @@ h.run(async () => {
 		window.__stores.environment.environment.subscribe((v) => (e = v))();
 		return e?.preset ?? null;
 	});
-	h.check(env === 'sunset', '1.3 the sunset environment preset (' + env + ')');
+	h.check(env === 'custom', '1.3 the custom dusk sky (' + env + ')');
 	const phys = await A.page.evaluate(() => window.__stores.scenePhysics.scenePhysicsDebug());
 	h.check(phys.play?.interaction === 'click' && phys.play?.simOnPlay === false, '1.4 play block: click, no sim');
 	await h.eventually(() => snap(A.page), (s) => s.sceneClears === clearsBefore + 1, '1.5 applySession ran /clear all FIRST (the module saw one scene clear)');
 	await h.eventually(() => snap(A.page), (s) => s.level === TEMPLATE_LEVEL && s.nodeOwned && s.built, '1.6 ...then the Untangle Board node applied LEVEL ' + TEMPLATE_LEVEL + ' — not 1 (the clear) and not 5 (before the load)', 10000);
 	let a1 = await snap(A.page);
-	h.check(a1.dots === 5 + TEMPLATE_LEVEL, '1.7 level ' + TEMPLATE_LEVEL + ' has ' + (5 + TEMPLATE_LEVEL) + ' dots (' + a1.dots + ')');
+	h.check(a1.dots === dotsFor(TEMPLATE_LEVEL), '1.7 level ' + TEMPLATE_LEVEL + ' has ' + dotsFor(TEMPLATE_LEVEL) + ' dots (' + a1.dots + ')');
 	h.check((await gameStateOf(A.page)) === 'menu' && (await screenOf(A.page)) === 'menu', '1.8 the game shell starts in menu with the menu screen');
-	h.check(/UNTANGLE/.test(await hudText(A.page)) && /Start/.test(await hudText(A.page)), '1.9 the menu renders its title and Start');
+	await h.eventually(() => A.page.evaluate(() => ({ chip: !!document.querySelector('#game-chip'), buttons: document.querySelectorAll('#hud-layer button').length })), (v) => v.chip && v.buttons === 0, '1.9 in the editor the game chip stands in for the menu (30 P1: no live menu over the editor)', 6000);
 
 	// 1c — the SAME file loaded AGAIN (Templates modal, twice): the node's data did not change, so
 	// only a node re-armed by the scene clear applies its level again. Without that the second load
@@ -236,15 +237,18 @@ h.run(async () => {
 	await A.page.locator('#play-button').click();
 	await B.page.locator('#play-button').click();
 	await A.page.waitForTimeout(500);
+	await h.eventually(async () => (await hudText(A.page)) ?? '', (t) => /UNTANGLE/.test(t) && /Start/.test(t), '4.0 in play the menu renders its title and Start');
 	await hudButton(A.page, 'Start').click();
 	await h.eventually(() => gameStateOf(A.page), (v) => v === 'playing', '4.1 Start flips the shell to playing');
 	await h.eventually(() => screenOf(A.page), (v) => v === 'hud', '4.2 A sees the HUD screen', 6000);
 	await h.eventually(() => hudRuntime(A.page), (r) => r['ut-level']?.text === 'LEVEL ' + TEMPLATE_LEVEL, '4.3 HUD Text reads the Untangle Value node: LEVEL ' + TEMPLATE_LEVEL);
-	await h.eventually(() => hudRuntime(A.page), (r) => r['ut-crossings']?.text === a1.crossings + ' crossings', '4.4 HUD Text reads the crossings count (' + a1.crossings + ')');
-	h.check(await A.page.evaluate(() => window.__untangle.move(0, [0.9, 0.9])), '4.5 A drops dot 0 in a corner');
+	await h.eventually(() => hudRuntime(A.page), (r) => r['ut-crossings']?.text === 'Crossings: ' + a1.crossings, '4.4 HUD Text reads the crossings count (' + a1.crossings + ')');
+	// a NUDGE: a far move can solve the 5-dot level 1 outright
+	h.check(await A.page.evaluate(() => { const p = window.__untangle.state().positions[0]; return window.__untangle.move(0, [p[0] + 0.01, p[1]]); }), '4.5 A nudges dot 0');
+	h.check((await snap(A.page)).crossings > 0, '4.5b (premise) still tangled');
 	const a2 = await snap(A.page);
-	await h.eventually(() => snap(B.page), (s) => s.positions[0][0] === 0.9 && s.crossings === a2.crossings, '4.6 B receives the move and derives the same crossings (' + a2.crossings + ')');
-	await h.eventually(() => hudRuntime(B.page), (r) => r['ut-crossings']?.text === a2.crossings + ' crossings', '4.7 B\'s HUD Text follows');
+	await h.eventually(() => snap(B.page), (s) => s.positions[0][0] === a2.positions[0][0] && s.crossings === a2.crossings, '4.6 B receives the move and derives the same crossings (' + a2.crossings + ')');
+	await h.eventually(() => hudRuntime(B.page), (r) => r['ut-crossings']?.text === 'Crossings: ' + a2.crossings, '4.7 B\'s HUD Text follows');
 
 	// ---- 5. a solve: trigger log, the Counter once, autoAdvance in lockstep -----------------------
 	const solvedNode = (await nodesOf(A.page, 'utevent')).find((n) => n.data.event === 'solved');
@@ -254,7 +258,12 @@ h.run(async () => {
 	await h.eventually(() => stampOf(B.page, solvedNode.id), (t) => t !== null && t !== solvedBefore, '5.3 B: the "On solved" stamp landed in the TRIGGER LOG');
 	await h.eventually(() => hudRuntime(A.page), (r) => r['ut-counter']?.text === '1 untangled', '5.4 A: Counter -> HUD Text counts the solve once');
 	await h.eventually(() => hudRuntime(B.page), (r) => r['ut-counter']?.text === '1 untangled', '5.5 B: counted ONCE, not once per peer');
-	await h.eventually(() => snap(A.page), (s) => s.level === TEMPLATE_LEVEL + 1, '5.6 A: autoAdvance to level ' + (TEMPLATE_LEVEL + 1), 6000);
+	// 30-untangle: no autoAdvance in the template — the solve shows the SOLVED screen (over) and
+	// Next starts the next level on every peer
+	await h.eventually(() => gameStateOf(A.page), (v) => v === 'over', '5.6a the solve moves the shell to over');
+	await h.eventually(() => screenOf(B.page), (v) => v === 'solved', '5.6b B sees the solved screen', 6000);
+	await hudButton(A.page, 'Next level').click();
+	await h.eventually(() => snap(A.page), (s) => s.level === TEMPLATE_LEVEL + 1, '5.6 A: Next -> level ' + (TEMPLATE_LEVEL + 1), 6000);
 	await h.eventually(() => snap(B.page), (s) => s.level === TEMPLATE_LEVEL + 1, '5.7 B: advanced in lockstep', 6000);
 	await h.eventually(() => hudRuntime(B.page), (r) => r['ut-level']?.text === 'LEVEL ' + (TEMPLATE_LEVEL + 1), '5.8 B\'s HUD Text reads LEVEL ' + (TEMPLATE_LEVEL + 1));
 	h.check((await snap(A.page)).nodeOwned === true, '5.9 the node still owns the board after the advance (its level is the STARTING level)');
diff --git a/tests/e2e/game-waves.test.cjs b/tests/e2e/game-waves.test.cjs
index 9755d98f..d982a0ce 100644
--- a/tests/e2e/game-waves.test.cjs
+++ b/tests/e2e/game-waves.test.cjs
@@ -1,6 +1,7 @@
-// 29-F ACCEPTANCE — the Waves game template: wave survival composed from TWO modules
-// (`health` holds the hit points, `waves` derives the wave from the enemies' counters and
-// walks the living ones at the goal) on the REAL artefacts and nothing authored in-test:
+// 29-F ACCEPTANCE, rewritten for Waves 2.x (roadmap 30b: "Waves becomes a VR shooter") — the
+// Waves game template composed from TWO modules (`health` holds the hit points, `waves` runs
+// the levels, walks the enemies and owns the guns) on the REAL artefacts, nothing authored
+// in-test:
 //   the scene — games/waves/scene.tpscene from the scenes FEED (core's own SCENES_BASE
 //               fallback, read out of src/lib/sceneTemplates.js so a ref move follows by
 //               construction — #230), or WAVES_TPSCENE=<path>, or a sibling scenes checkout
@@ -8,28 +9,19 @@
 //               a packed sibling modules checkout, or the modules CDN
 // installed on TWO peers plus a LATE JOINER. Skip-never-fail when a source is missing.
 //
-// What it proves:
-//   1 THE GAMES TAB: the card is picked in the real Templates modal (the feed's index.json
-//     and the scene are served through a route so the row exists before its release) and
-//     loadRemoteScene replaces the world — 10 objects, both modules in the requirement
-//     list, the sunset env, the play block (grab, grounded, sim on play), the knock block
-//     ON, the menu screen, and the modules' derivations: 4 enemies on a 3-wave curve, a
-//     goal, three spawn points, five health rows
+// The GAME itself (guns, abilities, the five levels, breaches, the VR start board, the
+// Meshy figures) is proven by the modules repo's own flight `waves-shooter` (118 checks);
+// this suite is core's side of the template: the card, the file, the handshake, the shell.
+//   1 THE GAMES TAB: the card is picked in the real Templates modal and replaces the world —
+//     17 objects (10 enemies in their three kinds), both modules in the requirement list, the
+//     custom sky, the play block (click, grounded, sim on play, a SPAWN in front of the
+//     crystal, no teleport and no fly — 30b C1), the menu shell, and the module's derivation
 //   2 B receives it over the handshake: same uuids, the same derivation, the HUD document
-//   3 play: Start -> the shell is playing on both -> the HUD screen; the run is ON (wave 1
-//     uses two of the four enemies), the first enemy WALKS toward the goal (+z) and B
-//     places it where A does; the parked enemies stand where the file put them; the HUD
-//     Text elements read the Waves Value nodes and the bar reads the player's health
-//   4 kills are KNOCKS (the template's damage source is `hit`, scaled by speed): a slow
-//     sweep is one pulse (3 -> 2), a hard one three (dead) — core's feedProbe, the code a
-//     hand runs — the hit lands in B's hit log and B's ledger agrees (its own local pulses
-//     off the replicated `hit`); B's knock (a non-initiator) completes wave 1; the kills
-//     rows are per peer; after the interval wave 2 heals the survivors (3 alive)
-//   5 the late joiner: C reads WAVE 2 from the counters in the triggers handshake, the same
-//     ledger, and the game shell
-//   6 the last waves fall on A's knocks -> DONE on all three -> `over`
-//     -> Set Game State (outcome won) -> the over screen; ONE run logged on every peer;
-//     Again -> a new round with every enemy back at full health
+//   3 play: Play -> the shell is playing on both, the HUD screen, the enemies WALK and B
+//     places them where A does, the HUD reads Wave 1
+//   4 a shot's worth of hits (the module's own engine.hit, the path its guns take) kills an
+//     enemy on A and B agrees (the replicated ledger)
+//   5 the late joiner: C reads the same run and the game shell
 const h = require('./helpers.cjs');
 const fs = require('fs');
 const path = require('path');
@@ -48,10 +40,8 @@ function coreScenesBase() {
 const SCENES_BASE = (process.env.WAVES_SCENES_BASE || coreScenesBase() || 'https://cdn.jsdelivr.net/gh/theprototype-app/scenes@main').replace(/\/$/, '');
 const MODULES_BASE = (process.env.WAVES_MODULES_BASE || 'https://cdn.jsdelivr.net/gh/theprototype-app/modules@main').replace(/\/$/, '');
 const ROOT = path.resolve(__dirname, '../../..');
-const ENEMIES = ['Enemy 1', 'Enemy 2', 'Enemy 3', 'Enemy 4'];
-const OBJECTS = ['Ground', 'Goal', 'Spawn 1', 'Spawn 2', 'Spawn 3', ...ENEMIES, 'Home'];
-const ENEMY_HP = 3;
-const INTERVAL_S = 3;
+const ENEMIES = ['Enemy 01', 'Enemy 02', 'Enemy 03', 'Enemy 04', 'Enemy 05 Runner', 'Enemy 06 Runner', 'Enemy 07', 'Enemy 08 Tank', 'Enemy 09 Runner', 'Enemy 10 Tank'];
+const OBJECTS = ['Ground', 'Goal', 'Spawn 1', 'Spawn 2', 'Spawn 3', ...ENEMIES, 'Home', 'Arena'];
 
 /** bytes from a URL, or null with the reason logged (never throws) */
 async function fetchBytes(url) {
@@ -157,48 +147,7 @@ const simOf = (page) =>
 	});
 const hudButton = (page, name) => page.getByRole('button', { name, exact: true });
 const myVar = (page, name) => page.evaluate((n) => window.__stores.peerVars.myPeerVar(n, null), name);
-const lastHitOf = (page, uuid) => page.evaluate((u) => window.__stores.knock.hitLogSnapshot().last[u]?.at ?? null, uuid);
 
-/** a knock probe swept along +x through the enemy's CURRENT position at `speed` m/s —
- * core's feedProbe, the same code a hand (or the desktop head probe) runs. The sweep is
- * one synchronous loop, so the enemy the module walks every frame holds still under it. */
-const knock = (page, uuid, speed) =>
-	page.evaluate(
-		({ uuid, speed }) => {
-			let g;
-			window.__stores.objectsGroup.subscribe((v) => (g = v))();
-			const o = g?.getObjectByProperty('uuid', uuid);
-			if (!o) return { hits: 0, armed: false };
-			const k = window.__stores.knock;
-			const id = 'gw-' + Math.random().toString(36).slice(2, 7);
-			k.dropProbe(id);
-			const [bx, by, bz] = o.position.toArray();
-			let hits = 0;
-			let armed = true;
-			let t = 1000;
-			const step = (speed * 16) / 1000;
-			for (let x = bx - 1.2; x <= bx + 0.05; x += step) {
-				const r = k.feedProbe(id, [x, by, bz], t);
-				hits += r.hits;
-				armed = armed && r.armed;
-				t += 16;
-			}
-			k.dropProbe(id);
-			return { hits, armed };
-		},
-		{ uuid, speed }
-	);
-/** a knock that cannot miss: up to three sweeps, the first that lands wins */
-async function knockUntil(page, uuid, speed, label) {
-	let last = null;
-	for (let attempt = 0; attempt < 3; attempt++) {
-		last = await knock(page, uuid, speed);
-		if (last.hits >= 1) break;
-		await page.waitForTimeout(250);
-	}
-	h.check(!!last && last.hits >= 1 && last.armed, label + ' (hits ' + (last?.hits ?? 0) + ', armed ' + (last?.armed ?? false) + ')');
-	return last;
-}
 const hpOf = async (page, uuid) => (await healthSnap(page)).find((s) => s.uuid === uuid)?.hp ?? null;
 
 h.run(async () => {
@@ -247,7 +196,7 @@ h.run(async () => {
 							tags: ['vr', 'co-op', 'survival'],
 							modules: [
 								{ id: 'health', version: '1.0.0' },
-								{ id: 'waves', version: '1.0.0' }
+								{ id: 'waves', version: '2.1.0' }
 							],
 							bytes: scene.bytes.length,
 							scene: 'games/waves/scene.tpscene',
@@ -276,150 +225,92 @@ h.run(async () => {
 	const needs = (await A.page.locator('#templates-modal .tpl-needs[data-needs="waves"]').textContent().catch(() => '')) ?? '';
 	h.check(/health/i.test(needs) && /waves/i.test(needs), '1.2 the card names both modules it needs (' + needs.trim() + ')');
 	await card.click();
-	await h.eventually(() => namesOf(A.page).then((n) => Object.keys(n)), (n) => n.length === 10 && !n.includes('Box'), '1.3 picking the card loads the scene: the box is gone, 10 objects stand', 30000);
+	await h.eventually(() => namesOf(A.page).then((n) => Object.keys(n)), (n) => n.length === OBJECTS.length && !n.includes('Box'), '1.3 picking the card loads the scene: the box is gone, ' + OBJECTS.length + ' objects stand', 30000);
 	await A.page.waitForTimeout(1500);
 	const names = await namesOf(A.page);
-	h.check(OBJECTS.every((n) => !!names[n]), '1.4 the ground, the goal, three spawn pads, four enemies and the home pad (' + Object.keys(names).join(', ') + ')');
+	h.check(OBJECTS.every((n) => !!names[n]), '1.4 the ground, the goal, three spawn pads, ten enemies (grunts, runners, tanks), the home pad and the arena (' + Object.keys(names).join(', ') + ')');
 	const modules = await A.page.evaluate(() => {
 		let m;
 		window.__stores.moduleRequirements.sceneModules.subscribe((v) => (m = v))();
-		return (m ?? []).map((e) => e.id);
+		return (m ?? []).map((e) => e.id + '@' + e.version);
 	});
-	h.check(modules.includes('health') && modules.includes('waves'), '1.5 the file\'s requirement list names BOTH modules (' + modules.join(',') + ')');
+	h.check(modules.some((m) => m.startsWith('health@')) && modules.some((m) => /^waves@2\./.test(m)), '1.5 the file\'s requirement list names health and waves 2.x (' + modules.join(',') + ')');
 	const env = await A.page.evaluate(() => {
 		let e;
 		window.__stores.environment.environment.subscribe((v) => (e = v))();
 		return e?.preset ?? null;
 	});
-	h.check(env === 'sunset', '1.6 the sunset environment preset (' + env + ')');
+	h.check(env === 'custom', '1.6 the custom sky (' + env + ')');
 	const phys = await A.page.evaluate(() => window.__stores.scenePhysics.scenePhysicsDebug());
-	h.check(phys.play?.interaction === 'grab' && phys.play?.grounded === true && phys.play?.simOnPlay === true, '1.7 play block: grab, grounded, sim on play (' + JSON.stringify(phys.play) + ')');
-	h.check(phys.knock?.enabled === true && phys.knock?.maxSpeed === 10, '1.8 the knock block is ON (a hand knocks an enemy) (' + JSON.stringify(phys.knock) + ')');
+	h.check(phys.play?.interaction === 'click' && phys.play?.grounded === true && phys.play?.simOnPlay === true, '1.7 play block: click, grounded, sim on play (' + JSON.stringify(phys.play) + ')');
+	h.check(
+		JSON.stringify(phys.play?.spawn?.position) === '[0,0,9]' && phys.play?.locomotion?.teleport === false && phys.play?.locomotion?.fly === false,
+		'1.8 30b C1 in the file: a spawn in front of the crystal, no teleport, no fly (' + JSON.stringify({ spawn: phys.play?.spawn, loco: phys.play?.locomotion }) + ')'
+	);
 	h.check((await gameStateOf(A.page)) === 'menu' && (await screenOf(A.page)) === 'menu', '1.9 the game shell starts in menu with the menu screen');
-	h.check(/WAVES/.test(await hudText(A.page)) && /Start/.test(await hudText(A.page)), '1.10 the menu renders its title and Start');
-	await h.eventually(() => snap(A.page), (s) => !!s && s.enemies.length === 4 && s.wave === 1 && !s.running && !!s.goal && s.spawns === 3 && s.waves === 3, '1.11 waves derives from the file: 4 enemies, wave 1 of 3, idle, a goal, three spawn points', 10000);
+	await h.eventually(() => A.page.evaluate(() => ({ chip: !!document.querySelector('#game-chip'), buttons: document.querySelectorAll('#hud-layer button').length })), (v) => v.chip && v.buttons === 0, '1.10 in the editor the game chip stands in for the menu (30 P1: no live menu over the editor)', 6000);
+	await h.eventually(() => snap(A.page), (s) => !!s && s.enemies.length === ENEMIES.length && !s.running && !!s.goal && s.spawns === 3, '1.11 waves derives from the file: ten enemies, idle, a goal, three spawn points', 10000);
 	const a1 = await snap(A.page);
-	h.check(a1.enemies.map((e) => e.label).join() === ENEMIES.join(), '1.12 enemy order is by name (' + a1.enemies.map((e) => e.label).join(', ') + ')');
-	await h.eventually(() => healthSnap(A.page), (all) => all.length === 5 && all.filter((s) => s.scope === 'object').every((s) => s.hp === ENEMY_HP && !s.dead), '1.13 health derives five rows: four enemies at ' + ENEMY_HP + ' hp and the player');
 	const order = a1.enemies.map((e) => e.uuid);
-	h.check(order.every((u, i) => names[ENEMIES[i]] === u), '1.14 the health targets are the four Enemy objects by uuid');
+	h.check(order.every((u) => Object.values(names).includes(u)), '1.12 the run\'s enemies are the file\'s Enemy objects by uuid');
+	await h.eventually(() => healthSnap(A.page), (all) => all.filter((s) => s.scope === 'object').length >= ENEMIES.length && all.filter((s) => s.scope === 'object').every((s) => s.hp > 0 && !s.dead), '1.13 health derives a row per enemy, every one alive');
 
 	// ---- 2. B receives it over the handshake ------------------------------------------------------
 	await h.connect(A, B);
-	await h.eventually(() => namesOf(B.page).then((n) => ({ uuids: Object.values(n), count: Object.keys(n).length })), (v) => v.count === 10 && order.every((u) => v.uuids.includes(u)), '2.1 B received the 10 objects with the same enemy uuids', 30000);
-	await h.eventually(() => snap(B.page), (s) => !!s && s.enemies.length === 4 && s.wave === 1 && !s.running && s.spawns === 3 && s.enemies.map((e) => e.uuid).join() === order.join(), '2.2 B: the graph replicated and its Waves node derives the SAME arena', 20000);
-	await h.eventually(() => healthSnap(B.page), (all) => all.length === 5, '2.3 B: five health rows');
-	await h.eventually(() => screenOf(B.page), (v) => v === 'menu', '2.4 B: the HUD document arrived (menu screen)', 10000);
+	await h.eventually(() => namesOf(B.page).then((n) => ({ uuids: Object.values(n), count: Object.keys(n).length })), (v) => v.count === OBJECTS.length && order.every((u) => v.uuids.includes(u)), '2.1 B received the ' + OBJECTS.length + ' objects with the same enemy uuids', 30000);
+	await h.eventually(() => snap(B.page), (s) => !!s && s.enemies.length === ENEMIES.length && !s.running && s.enemies.map((e) => e.uuid).join() === order.join(), '2.2 B: the graph replicated and its Waves node derives the SAME arena', 20000);
+	await h.eventually(() => screenOf(B.page), (v) => v === 'menu', '2.3 B: the HUD document arrived (menu screen)', 10000);
 
-	// ---- 3. play: Start -> the shell -> the run is on, the enemies walk ---------------------------
+	// ---- 3. play: the shell, the HUD, the enemies walk ---------------------------------------------
 	await A.page.locator('#play-button').click();
 	await h.eventually(() => simOf(A.page), (v) => v.own === true, '3.1 A simulates on entering play (simOnPlay)', 15000);
 	await B.page.locator('#play-button').click();
 	await A.page.waitForTimeout(500);
-	await hudButton(A.page, 'Start').click();
-	await h.eventually(() => gameStateOf(A.page), (v) => v === 'playing', '3.2 Start flips the shell to playing on A');
+	await h.eventually(async () => (await hudText(A.page)) ?? '', (t) => /WAVES/i.test(t) && /Play/.test(t) && /How to play/.test(t), '3.1b in play the menu renders its title, Play and How to play');
+	await A.page.locator('#hud-layer button', { hasText: /^\W*Play$/ }).first().click();
+	await h.eventually(() => gameStateOf(A.page), (v) => v === 'playing', '3.2 Play flips the shell to playing on A');
 	await h.eventually(() => gameStateOf(B.page), (v) => v === 'playing', '3.3 ...and on B (the replicated state)');
 	await h.eventually(() => screenOf(A.page), (v) => v === 'hud', '3.4 A sees the HUD screen', 6000);
-	await h.eventually(() => snap(A.page), (s) => s?.running && s.started && s.wave === 1 && s.size === 2 && s.alive === 2, '3.5 the run is ON: wave 1 uses two of the four enemies, both alive', 10000);
-	await h.eventually(() => snap(B.page), (s) => s?.running && s.started && s.wave === 1 && s.alive === 2, '3.6 B agrees', 10000);
-	const p0 = await posOf(A.page, order[0]);
-	await A.page.waitForTimeout(1500);
-	const p1 = await posOf(A.page, order[0]);
-	h.check(!!p0 && !!p1 && p1[2] > p0[2] + 1, '3.7 the first enemy walks toward the goal (+z): ' + p0?.[2].toFixed(1) + ' -> ' + p1?.[2].toFixed(1));
-	const pA = await posOf(A.page, order[0]);
-	const pB = await posOf(B.page, order[0]);
-	h.check(!!pA && !!pB && Math.abs(pA[2] - pB[2]) < 1.0, '3.8 B places it where A does (same stamp, same clock): ' + pA?.[2].toFixed(1) + ' vs ' + pB?.[2].toFixed(1));
-	const p3 = await posOf(A.page, order[3]);
-	h.check(!!p3 && Math.abs(p3[2] - -8) < 0.3, '3.9 the fourth enemy is not in wave 1: parked where the file put it (z ' + p3?.[2].toFixed(1) + ')');
-	await h.eventually(() => hudRuntime(A.page), (r) => r['wv-wave']?.text === 'Wave 1' && r['wv-left']?.text === '2 left', '3.10 HUD Text reads the Waves Value nodes: Wave 1, 2 left');
-	await h.eventually(() => hudRuntime(A.page), (r) => Math.abs((r['wv-hp']?.value ?? 0) - 1) < 0.01, '3.11 the HUD bar reads the player\'s health (full)');
+	await h.eventually(() => snap(A.page), (s) => s?.running && s.started && s.alive >= 1, '3.5 the run is ON with enemies alive', 15000);
+	const walking = async (page) => {
+		const s = await snap(page);
+		const out = {};
+		for (const e of s?.enemies ?? []) out[e.uuid] = await posOf(page, e.uuid);
+		return out;
+	};
+	const w0 = await walking(A.page);
+	await A.page.waitForTimeout(2500);
+	const w1 = await walking(A.page);
+	const moved = order.filter((u) => w0[u] && w1[u] && Math.hypot(w1[u][0] - w0[u][0], w1[u][2] - w0[u][2]) > 1);
+	h.check(moved.length >= 1, '3.6 THE REPORT: the enemies WALK (' + moved.length + ' moved > 1 m in 2.5 s)');
+	const u0 = moved[0];
+	const pA = u0 ? await posOf(A.page, u0) : null;
+	const pB = u0 ? await posOf(B.page, u0) : null;
+	h.check(!!pA && !!pB && Math.hypot(pA[0] - pB[0], pA[2] - pB[2]) < 1.5, '3.7 B places a walker where A does (same stamp, same clock): ' + JSON.stringify([pA?.map((v) => +v.toFixed(1)), pB?.map((v) => +v.toFixed(1))]));
+	await h.eventually(() => hudRuntime(A.page), (r) => /Wave 1/.test(r['wv-wave']?.text ?? ''), '3.8 HUD Text reads the Waves Value node: Wave 1', 8000);
 
-	// ---- 4. kills are knocks: speed-scaled pulses, both peers, the wave advances -------------------
-	const hitBefore = await lastHitOf(B.page, order[0]);
-	await knockUntil(A.page, order[0], 1, '4.1 A sweeps a SLOW probe through Enemy 1');
-	await h.eventually(() => hpOf(A.page, order[0]), (v) => v === ENEMY_HP - 1, '4.2 a slow knock is ONE pulse: ' + ENEMY_HP + ' -> ' + (ENEMY_HP - 1));
-	await h.eventually(() => lastHitOf(B.page, order[0]), (t) => t !== null && t !== hitBefore, '4.3 the hit landed in B\'s hit log (the replicated `hit`)');
-	await h.eventually(() => hpOf(B.page, order[0]), (v) => v === ENEMY_HP - 1, '4.4 B\'s ledger agrees (its own local pulse off the same hit)');
-	await knockUntil(A.page, order[0], 9, '4.5 A sweeps a HARD probe through Enemy 1');
-	await h.eventually(() => snap(A.page), (s) => s?.alive === 1 && s.enemies[0].kills === 1, '4.6 a hard knock is three pulses: Enemy 1 is dead, one left in wave 1');
-	await h.eventually(() => myVar(A.page, 'kills'), (v) => v === 1, '4.7 A\'s own kills row reads 1 (the killing blow was its hand)');
-	await h.eventually(() => hudRuntime(A.page), (r) => r['wv-left']?.text === '1 left', '4.8 HUD Text: 1 left');
-	await knockUntil(B.page, order[1], 9, '4.9 B (not the initiator) sweeps a hard probe through Enemy 2');
-	await h.eventually(() => snap(A.page), (s) => s?.completed === 1, '4.10 wave 1 is complete on A (B\'s hit replicated, A fired its own pulses)', 10000);
-	await h.eventually(() => myVar(B.page, 'kills'), (v) => v === 1, '4.11 B\'s own kills row reads 1');
-	h.check((await myVar(A.page, 'kills')) === 1, '4.12 ...and A\'s is still 1: one writer per row');
-	await h.eventually(() => snap(A.page), (s) => s?.wave === 2 && s.started && s.alive === 3, '4.13 after the interval: wave 2, three alive (the survivors healed with local pulses)', (INTERVAL_S + 6) * 1000);
-	await h.eventually(() => snap(B.page), (s) => s?.wave === 2 && s.started && s.alive === 3, '4.14 B: wave 2 too', 10000);
-	// the slow knock's one pulse plus the hard knock's three is FOUR hits; wave 2 heals one
-	// death's worth (3), so the survivor comes back at 2 — heals bank per death, they do not
-	// top up (the health module's documented rule)
-	await h.eventually(() => snap(A.page), (s) => s && s.enemies[0].hits === ENEMY_HP + 1 && s.enemies[0].heals === ENEMY_HP && s.enemies[0].hp === ENEMY_HP - 1 && s.enemies[3].hits === 0, '4.15 the ledger: Enemy 1 has ' + (ENEMY_HP + 1) + ' hits and ' + ENEMY_HP + ' heals (hp ' + (ENEMY_HP - 1) + ', the overkill pulse counted), Enemy 4 untouched');
-	await h.eventually(() => hudRuntime(B.page), (r) => r['wv-wave']?.text === 'Wave 2' && r['wv-left']?.text === '3 left', '4.16 B\'s HUD Text: Wave 2, 3 left');
+	// ---- 4. a kill: the gun's own path (engine.hit), both peers agree -------------------------------
+	const prey = moved[0] ?? order[0];
+	const pre = (await snap(A.page)).enemies.find((e) => e.uuid === prey);
+	h.check(!!pre, '4.0 (premise) a walking enemy to shoot (' + (pre?.label ?? '?') + ', hp ' + (pre?.hp ?? '?') + ')');
+	await A.page.evaluate((u) => window.__waves.engine.hit(u, 12), prey);
+	await h.eventually(() => snap(A.page), (s) => (s?.enemies.find((e) => e.uuid === prey)?.kills ?? 0) >= 1, '4.1 enough hits kill it on A (kills 1)', 8000);
+	await h.eventually(() => snap(B.page), (s) => (s?.enemies.find((e) => e.uuid === prey)?.kills ?? 0) >= 1, '4.2 and on B (the replicated ledger)', 8000);
+	await h.eventually(() => myVar(A.page, 'kills'), (v) => v >= 1, '4.3 A\'s own kills row counts it');
 
 	// ---- 5. the late joiner ------------------------------------------------------------------------
+	// A approves the join, and a peer cannot approve from inside Play (the documented gotcha):
+	// A steps out; B still plays, so the shell stays playing (the 10 s window)
 	await A.page.keyboard.press('Escape');
 	await A.page.waitForTimeout(500);
 	const C = await h.setupPage(browser, 'C');
 	await installZip(C, 'health', healthZip.bytes, 'C');
 	await installZip(C, 'waves', wavesZip.bytes, 'C');
 	await h.connect(C, A);
-	await A.page.locator('#play-button').click();
-	await h.eventually(() => namesOf(C.page).then((n) => Object.keys(n).length), (n) => n === 10, '5.1 C received the arena', 30000);
-	await h.eventually(() => snap(C.page), (s) => !!s && s.wave === 2 && s.enemies.length === 4 && s.enemies[0].hits === ENEMY_HP + 1 && s.enemies[0].heals === ENEMY_HP, '5.2 C reads WAVE 2 with the same ledger — the counts arrived in the triggers handshake', 30000);
+	await h.eventually(() => namesOf(C.page).then((n) => Object.keys(n).length), (n) => n === OBJECTS.length, '5.1 C received the arena', 30000);
+	await h.eventually(() => snap(C.page), (s) => !!s && s.enemies.length === ENEMIES.length && (s.enemies.find((e) => e.uuid === prey)?.kills ?? 0) >= 1, '5.2 C reads the same ledger (the kill arrived in the triggers handshake)', 30000);
 	await h.eventually(() => gameStateOf(C.page), (v) => v === 'playing', '5.3 C: the game shell reads playing');
 	h.check((await myVar(C.page, 'kills')) === null, '5.4 the joiner has no kills row yet');
-	await C.page.locator('#play-button').click();
-	await h.eventually(() => hudRuntime(C.page), (r) => r['wv-wave']?.text === 'Wave 2', '5.5 C\'s HUD Text reads Wave 2', 10000);
-
-	// ---- 6. the last waves, over, the log, Again ------------------------------------------------------
-	// (the template wires no pause: P is the editor's sim toggle and does nothing to the run)
-	// wave 2 uses three enemies; wave 3 all four. A's hand clears both — ONE enemy at a
-	// time, as early in the wave as it can (the walkers converge on the goal and, held
-	// kinematic, stand co-located there, where one sweep hits every body it overlaps —
-	// run 2 measured hits 3 on a sweep aimed at one), waiting for each to fall and skipping
-	// any a shared sweep already took, and never swinging again until the next wave is ON
-	// (a knock in the interval lands on a body the next wave is about to heal).
-	const clearWave = async (n, indices, label) => {
-		// the heals into a new wave land a tick or two after it starts (local pulses, counters
-		// republished ~6/s): swing only once every enemy the wave uses reads healed, or a body
-		// still at 0 from the last wave is skipped as "down"
-		await h.eventually(() => snap(A.page), (s) => s?.wave === n && s.started && indices.every((i) => s.enemies[i].hp > 0), label + ' (premise) wave ' + n + ' is on and its enemies are healed', 12000);
-		for (const i of indices) {
-			const before = await snap(A.page);
-			if (before.completed >= n) break;
-			if (before.enemies[i].hp <= 0) continue;
-			const kills = before.enemies[i].kills;
-			await knockUntil(A.page, order[i], 9, label + ' A knocks down ' + ENEMIES[i] + ' (wave ' + n + ')');
-			await h.eventually(() => snap(A.page), (s) => s.enemies[i].kills > kills || s.completed >= n, label + ' ...' + ENEMIES[i] + ' is down', 8000);
-		}
-		await h.eventually(() => snap(A.page), (s) => s?.completed >= n, label + ' wave ' + n + ' is complete', 8000);
-	};
-	await clearWave(2, [0, 1, 2], '6.1');
-	await h.eventually(() => snap(A.page), (s) => s?.wave === 3 && s.started && s.alive === 4, '6.2 wave 3: all four alive', (INTERVAL_S + 8) * 1000);
-	await h.eventually(() => snap(C.page), (s) => s?.wave === 3 && s.alive === 4, '6.3 C: wave 3, four alive', 10000);
-	await clearWave(3, [0, 1, 2, 3], '6.4');
-	await h.eventually(() => snap(A.page), (s) => s?.done === true && s.alive === 0, '6.5 the last enemy falls: DONE on A', 10000);
-	await h.eventually(() => snap(B.page), (s) => s?.done === true, '6.6 done on B', 8000);
-	await h.eventually(() => snap(C.page), (s) => s?.done === true, '6.7 done on C', 8000);
-	await h.eventually(() => gameOf(A.page), (g) => g.state === 'over' && g.outcome === 'won', '6.8 `over` -> Set Game State: the shell is OVER (won) on A', 8000);
-	await h.eventually(() => gameOf(B.page), (g) => g.state === 'over' && g.outcome === 'won', '6.9 ...and on B');
-	await h.eventually(() => gameOf(C.page), (g) => g.state === 'over' && g.outcome === 'won', '6.10 ...and on C');
-	await h.eventually(() => screenOf(A.page), (v) => v === 'over', '6.11 A sees the over screen', 6000);
-	h.check(/ARENA CLEARED/.test(await hudText(A.page)) && /Again/.test(await hudText(A.page)), '6.12 the over screen renders its title and Again');
-	await h.eventually(() => snap(A.page), (s) => s?.log.length === 1 && s.log[0].cleared && s.log[0].waves === 3 && s.log[0].reached === 3, '6.13 ONE run logged in gameState.vars: cleared, 3 waves', 8000);
-	const logA = (await snap(A.page)).log[0];
-	const kills = [await myVar(A.page, 'kills'), await myVar(B.page, 'kills'), await myVar(C.page, 'kills')].map((v) => (v === null ? 'none' : String(v)));
-	// nine kills in a round (2 + 3 + 4); B's hand took one, C's none, so A's took the rest —
-	// however many bodies one of A's sweeps caught at the goal, every kill is credited to a hand
-	h.check(kills.join() === '8,1,none', '6.14 kills rows: A 8, B 1, C none — each peer credited only its own blows (' + kills.join() + ')');
-	await h.eventually(() => snap(B.page), (s) => s?.log.length === 1 && JSON.stringify(s.log[0]) === JSON.stringify(logA), '6.15 B holds the SAME run entry (idempotent by its stamp)', 8000);
-	await h.eventually(() => snap(C.page), (s) => s?.log.length === 1 && s.log[0].at === logA.at, '6.16 and so does C');
-	await h.eventually(() => hudRuntime(A.page), (r) => (r['wv-kills,wv-kills-over']?.rows ?? []).length >= 2, '6.17 the leaderboard rows list the scorers (one node feeds both lists)');
-	await hudButton(A.page, 'Again').click();
-	await h.eventually(() => gameStateOf(B.page), (v) => v === 'playing', '6.18 Again -> a new round on B', 8000);
-	await h.eventually(() => snap(A.page), (s) => s?.running && s.wave === 1 && s.completed === 0 && s.enemies.every((e) => e.hp === ENEMY_HP), '6.19 A: wave 1 again, every enemy back at full health (the reset chains)', 10000);
-	await h.eventually(() => snap(C.page), (s) => s?.running && s.wave === 1 && s.enemies.every((e) => e.hp === ENEMY_HP), '6.20 C agrees', 10000);
-	h.check((await snap(A.page)).log.length === 1, '6.21 the log keeps the finished run');
 
 	for (const p of [A, B, C]) await p.page.evaluate(() => window.__stores.isLocked.set(false)).catch(() => {});
 	await h.finish(browser);
diff --git a/tests/e2e/helpers-in-play.test.cjs b/tests/e2e/helpers-in-play.test.cjs
index 18e48769..1bc5e736 100644
--- a/tests/e2e/helpers-in-play.test.cjs
+++ b/tests/e2e/helpers-in-play.test.cjs
@@ -1,7 +1,7 @@
 // 24-E2: helpers on their own render layer, hidden in Play, a debug toggle. Light
 // helpers + pick proxies and camera frustums (scene root) were gated by editor prefs
 // only; camera MARKERS are replicated meshes that rendered inside the game, in camera
-// previews and in captures (reported). Now: scene-root helpers sit on HELPER_LAYER (1)
+// previews and in captures (reported). Now: scene-root helpers sit on HELPER_LAYER (30 since 30b P0 — 1 is the XR LEFT-EYE layer)
 // for good and only the editor camera enables it (off in Play unless the debug toggle);
 // markers HOP onto the layer while hidden (Play / a preview / a capture's render) and
 // come back to layer 0 after, so every raycaster in the app keeps picking them.
@@ -10,6 +10,7 @@ const h = require('./helpers.cjs');
 const state = (page) =>
 	page.evaluate(() => {
 		const s = window.__stores;
+		const HL = s.helperLayer.HELPER_LAYER;
 		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
 		const cam = get(s.editorCam) || get(s.globalCamera);
 		const scene = get(s.globalScene);
@@ -19,7 +20,7 @@ const state = (page) =>
 		const helperMasks = scene.children.filter((c) => /LightHelper$/.test(c.type || '') || c.name === 'light-proxies' || c.name === 'camera-frustums').map((c) => ({ name: c.name || c.type, mask: c.layers.mask, kids: c.children.map((k) => k.layers.mask) }));
 		return {
 			locked: get(s.isLocked),
-			camHelper: !!cam?.layers?.isEnabled?.(1),
+			camHelper: !!cam?.layers?.isEnabled?.(HL),
 			camMask: cam?.layers?.mask ?? null,
 			markers,
 			helperMasks,
@@ -29,6 +30,8 @@ const state = (page) =>
 		};
 	});
 const bit = (mask, n) => (mask & (1 << n)) !== 0;
+// 30b P0: the helper layer is read from the app, never assumed (it was 1 — the XR left eye)
+let HL = 30;
 
 h.run(async () => {
 	const browser = await h.launch({ args: h.GPU_ARGS });
@@ -36,6 +39,8 @@ h.run(async () => {
 	const B = await h.setupPage(browser, 'B');
 	await h.connect(B, A);
 
+	HL = await A.page.evaluate(() => window.__stores.helperLayer.HELPER_LAYER);
+	h.check(HL !== 1 && HL !== 2, `the helper layer is not one of three's XR EYE layers 1/2 (${HL})`);
 	const ids = await A.page.evaluate(() => {
 		const s = window.__stores;
 		s.commandsHandler.sceneCommand('/light point');
@@ -49,10 +54,10 @@ h.run(async () => {
 
 	// ---- 1. outside Play: helpers on layer 1 only, the editor camera renders it -------
 	let s = await state(A.page);
-	h.check(!s.outlineLayers.includes(1), `premise: the outline passes do not use layer 1 (${JSON.stringify(s.outlineLayers)})`);
-	h.check(s.helperMasks.length >= 2 && s.helperMasks.every((e) => e.kids.length === 0 || e.kids.every((m) => m === 2)) && s.helperMasks.filter((e) => /LightHelper$/.test(e.name)).every((e) => e.mask === 2), `light helper + proxies + frustum root children sit on layer 1 only (${JSON.stringify(s.helperMasks)})`);
+	h.check(!s.outlineLayers.includes(HL), `premise: the outline passes do not use the helper layer (${JSON.stringify(s.outlineLayers)})`);
+	h.check(s.helperMasks.length >= 2 && s.helperMasks.every((e) => e.kids.length === 0 || e.kids.every((m) => m === 1 << HL)) && s.helperMasks.filter((e) => /LightHelper$/.test(e.name)).every((e) => e.mask === 1 << HL), `light helper + proxies + frustum root children sit on the helper layer only (${JSON.stringify(s.helperMasks)})`);
 	h.check(s.camHelper === true, `the editor camera renders the helper layer outside Play (mask ${s.camMask})`);
-	h.check(s.markers.length === 1 && bit(s.markers[0].mask, 0) && !bit(s.markers[0].mask, 1), `the marker is ordinary scenery outside Play (mask ${s.markers[0]?.mask})`);
+	h.check(s.markers.length === 1 && bit(s.markers[0].mask, 0) && !bit(s.markers[0].mask, HL), `the marker is ordinary scenery outside Play (mask ${s.markers[0]?.mask})`);
 
 	// ---- 2. a real click still picks the marker (it never left layer 0) ---------------
 	const at = await h.projectPoint(A.page, [0, 1, 0]);
@@ -67,7 +72,7 @@ h.run(async () => {
 	await A.page.waitForTimeout(400);
 	s = await state(A.page);
 	h.check(s.locked === true && s.camHelper === false, `in Play the camera no longer renders the helper layer (mask ${s.camMask})`);
-	h.check(!bit(s.markers[0].mask, 0) && bit(s.markers[0].mask, 1), `the marker hopped onto the helper layer (mask ${s.markers[0].mask})`);
+	h.check(!bit(s.markers[0].mask, 0) && bit(s.markers[0].mask, HL), `the marker hopped onto the helper layer (mask ${s.markers[0].mask})`);
 	h.check(!s.chip, 'no DEBUG chip while helpers are hidden');
 
 	// ---- 4. the debug toggle brings them back, with the chip -----------------------------
@@ -85,14 +90,14 @@ h.run(async () => {
 	await A.page.evaluate(() => window.__stores.isLocked.set(false));
 	await A.page.waitForTimeout(400);
 	s = await state(A.page);
-	h.check(s.camHelper === true && bit(s.markers[0].mask, 0) && !bit(s.markers[0].mask, 1), `leaving Play: layer back on, marker back on layer 0 (mask ${s.markers[0].mask})`);
+	h.check(s.camHelper === true && bit(s.markers[0].mask, 0) && !bit(s.markers[0].mask, HL), `leaving Play: layer back on, marker back on layer 0 (mask ${s.markers[0].mask})`);
 
 	// ---- 6. a camera preview hides markers; stopping it restores them ------------------
 	await A.page.evaluate((u) => window.__stores.cameraPreview.startCameraPreview(u), ids.marker);
 	await A.page.waitForTimeout(500);
 	s = await state(A.page);
 	h.check(!bit(s.markers[0].mask, 0), `a camera preview hides the markers (mask ${s.markers[0].mask})`);
-	const previewCam = await A.page.evaluate(() => { let c; window.__stores.globalCamera.subscribe((x) => (c = x))(); return c?.layers?.isEnabled?.(1) ?? null; });
+	const previewCam = await A.page.evaluate((HL) => { let c; window.__stores.globalCamera.subscribe((x) => (c = x))(); return c?.layers?.isEnabled?.(HL) ?? null; }, HL);
 	h.check(previewCam === false, `the preview camera never renders the helper layer (${previewCam})`);
 	await A.page.evaluate(() => window.__stores.cameraPreview.stopCameraPreview());
 	await A.page.waitForTimeout(500);
@@ -100,7 +105,7 @@ h.run(async () => {
 	h.check(bit(s.markers[0].mask, 0), `stopping the preview restores the marker (mask ${s.markers[0].mask})`);
 
 	// ---- 7. a capture hides markers for its one render, then puts them back --------------
-	const capture = await A.page.evaluate((u) => {
+	const capture = await A.page.evaluate(({ u, HL }) => {
 		let r;
 		window.__stores.globalRenderer.subscribe((x) => (r = x))();
 		let g;
@@ -108,22 +113,22 @@ h.run(async () => {
 		const marker = g.getObjectByProperty('uuid', u);
 		const seen = [];
 		const original = r.render.bind(r);
-		r.render = (scene, camera) => { seen.push({ mask: marker.layers.mask, camHelper: camera.layers.isEnabled(1) }); return original(scene, camera); };
+		r.render = (scene, camera) => { seen.push({ mask: marker.layers.mask, camHelper: camera.layers.isEnabled(HL) }); return original(scene, camera); };
 		try { window.__stores.cameraObjects.captureThroughCamera(u, 120); } catch (e) { seen.push({ error: e.message }); }
 		r.render = original;
 		return { seen, after: marker.layers.mask };
-	}, ids.marker);
+	}, { u: ids.marker, HL });
 	const during = capture.seen.find((x) => x.mask !== undefined);
 	h.check(!!during && !bit(during.mask, 0) && during.camHelper === false, `captureThroughCamera renders with the marker hidden and no helper layer (${JSON.stringify(capture.seen)})`);
-	h.check(bit(capture.after, 0) && !bit(capture.after, 1), `...and restores the marker afterwards (mask ${capture.after})`);
+	h.check(bit(capture.after, 0) && !bit(capture.after, HL), `...and restores the marker afterwards (mask ${capture.after})`);
 
 	// ---- 8. peer B: ordinary mask outside Play; its own Play hides its own copy -------
 	let b = await state(B.page);
-	h.check(b.markers.length === 1 && bit(b.markers[0].mask, 0) && !bit(b.markers[0].mask, 1), `peer B's copy of the marker is on layer 0 (mask ${b.markers[0]?.mask})`);
+	h.check(b.markers.length === 1 && bit(b.markers[0].mask, 0) && !bit(b.markers[0].mask, HL), `peer B's copy of the marker is on layer 0 (mask ${b.markers[0]?.mask})`);
 	await B.page.evaluate(() => window.__stores.isLocked.set(true));
 	await B.page.waitForTimeout(400);
 	b = await state(B.page);
-	h.check(b.camHelper === false && bit(b.markers[0].mask, 1) && !bit(b.markers[0].mask, 0), `B entering Play hides its own marker copy (mask ${b.markers[0].mask})`);
+	h.check(b.camHelper === false && bit(b.markers[0].mask, HL) && !bit(b.markers[0].mask, 0), `B entering Play hides its own marker copy (mask ${b.markers[0].mask})`);
 	// a snapshot taken by A mid-Play on B carries no hop for B's editor: A's copy is normal
 	s = await state(A.page);
 	h.check(bit(s.markers[0].mask, 0), "A's marker is unaffected by B's Play");
diff --git a/tests/e2e/helpers.cjs b/tests/e2e/helpers.cjs
index ca8d20c0..28a62fae 100644
--- a/tests/e2e/helpers.cjs
+++ b/tests/e2e/helpers.cjs
@@ -119,6 +119,12 @@ async function setupPage(browser, name, options = {}) {
 		page.__errors.push(err.message ?? String(err));
 		console.log(`[${name} pageerror] ` + err.stack);
 	});
+	// 30 P0: every console message, from BEFORE the first navigation — a warning printed on
+	// the first frame (three's shadow-map deprecation) is invisible to a listener attached
+	// after boot. `{type, text}`; `console-hygiene` reads it.
+	/** @type {{type: string, text: string}[]} */
+	page.__console = [];
+	page.on('console', (message) => page.__console.push({ type: message.type(), text: message.text() }));
 	// 27-D: `options.hash` loads the app WITH a hash (`{ hash: '#safe' }`). It has to be
 	// on the initial navigation, not set afterwards: safe mode is read once during
 	// onMount, so a hash assigned to a live page arrives long after the decision.
diff --git a/tests/e2e/interact-clean-view.test.cjs b/tests/e2e/interact-clean-view.test.cjs
new file mode 100644
index 00000000..b7d4a797
--- /dev/null
+++ b/tests/e2e/interact-clean-view.test.cjs
@@ -0,0 +1,141 @@
+// 30b P1: INTERACT AND PLAY DRAW NO EDITOR SCAFFOLDING. The Quest report: "In interact
+// mode I do not need helper boxes or shapes, outlines around objects." Before this, Play
+// hid the helper LAYER and the grid, and Interact hid nothing at all — the grid, the
+// collider/trigger wireframes, the selection outline, a peer's lock box, the tiny-object
+// dots, the VR selection shell and the VR hover box all stayed. Every one of them now
+// answers ONE predicate (helperLayer.helpersHidden / editorHelpersShown), so this suite
+// builds a scene holding one of each and reads each one in Edit, Interact, back in Edit,
+// and in Play.
+const h = require('./helpers.cjs');
+
+const read = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		const scene = get(s.globalScene);
+		const cam = get(s.editorCam) || get(s.globalCamera);
+		const HL = s.helperLayer.HELPER_LAYER;
+		const colliders = scene.getObjectByName('collider-proxies');
+		const locks = scene.getObjectByName('lock-highlights');
+		const tiny = scene.getObjectByName('tiny-object-markers');
+		const shell = scene.getObjectByName('vr-selection-shell');
+		const hover = scene.getObjectByName('vr-hover-box');
+		const outline = window.__outlineDebug?.() ?? null;
+		return {
+			mode: get(s.editorMode),
+			locked: get(s.isLocked),
+			grid: !!scene.getObjectByName('editor-grid'),
+			helperLayer: !!cam?.layers?.isEnabled?.(HL),
+			colliders: !!colliders?.visible && colliders.children.length > 0,
+			locks: !!locks?.visible && locks.children.length > 0,
+			tiny: !!tiny?.visible,
+			shell: !!shell?.visible,
+			hover: !!hover?.visible,
+			outlineSelected: outline ? outline.selected : -1,
+			outlineLocked: outline ? outline.locked : -1
+		};
+	});
+
+const everything = (r) => r.grid && r.helperLayer && r.colliders && r.locks && r.tiny && r.outlineSelected > 0 && r.outlineLocked > 0;
+const nothing = (r) => !r.grid && !r.helperLayer && !r.colliders && !r.locks && !r.tiny && r.outlineSelected === 0 && r.outlineLocked === 0;
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+
+	// ---- the fixture: one of each helper --------------------------------------------------
+	const ids = await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		s.commandsHandler.sceneCommand('/light point');
+		s.commandsHandler.sceneCommand('/create box');
+		s.commandsHandler.sceneCommand('/create box');
+		s.commandsHandler.sceneCommand('/create box');
+		await new Promise((r) => setTimeout(r, 400));
+		const boxes = get(s.objectsGroup).children.filter((c) => c.name === 'Box');
+		const [selected, lockedByPeer, tiny] = boxes;
+		selected.position.set(-1.5, 0.5, 0);
+		lockedByPeer.position.set(1.5, 0.5, 0);
+		tiny.position.set(0, 0.5, -1);
+		tiny.scale.setScalar(0.0005);
+		s.colliderHelpers.showColliders.set(true);
+		// a peer holding the second box (LockHighlights + the locked outline read this)
+		s.lockedObjects.set([['peer-elsewhere', lockedByPeer.uuid]]);
+		s.objectActions.selectObject(selected.uuid);
+		s.objectsGroup.update((g) => g);
+		return { selected: selected.uuid, locked: lockedByPeer.uuid };
+	});
+	await A.page.waitForTimeout(1200);
+
+	// ---- 1. Edit shows all of it -------------------------------------------------------------
+	let r = await read(A.page);
+	h.check(r.mode === 'edit', 'premise: the editor starts in Edit');
+	h.check(everything(r), `Edit: grid, helper layer, colliders, lock box, tiny dot and both outlines are drawn (${JSON.stringify(r)})`);
+
+	// ---- 2. Interact hides every one ------------------------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await A.page.waitForTimeout(600);
+	r = await read(A.page);
+	h.check(r.mode === 'interact', 'Interact is on');
+	h.check(!r.grid, `Interact: no editor grid (${r.grid})`);
+	h.check(!r.helperLayer, 'Interact: the camera stops drawing the helper layer (light helpers, proxies, frustums)');
+	h.check(!r.colliders, 'Interact: no collider wireframes');
+	h.check(!r.locks, "Interact: no peer lock box");
+	h.check(!r.tiny, 'Interact: no tiny-object dot');
+	h.check(r.outlineSelected === 0 && r.outlineLocked === 0, `Interact: no selection or lock outline (${r.outlineSelected}/${r.outlineLocked})`);
+	const kept = await A.page.evaluate(() => { let v; window.__stores.selectedObjects.subscribe((x) => (v = x))(); return v.length; });
+	h.check(kept === 1, `Interact keeps the selection itself — only its glare goes (${kept})`);
+
+	// ---- 3. VR: the selection shell and the hover box stand down in Interact ---------------------
+	await A.page.evaluate(() => window.__stores.isVRMode.set(true));
+	const vr = await A.page.evaluate((uuid) => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		const box = get(s.objectsGroup).getObjectByProperty('uuid', uuid);
+		s.vrControls.updateHoverBox(box);
+		const hover = get(s.globalScene).getObjectByName('vr-hover-box');
+		return { hover: !!hover?.visible };
+	}, ids.selected);
+	await A.page.waitForTimeout(400);
+	r = await read(A.page);
+	h.check(!r.shell, 'VR Interact: no selection shell');
+	h.check(!vr.hover, 'VR Interact: the hover box refuses to show');
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	const vrEdit = await A.page.evaluate((uuid) => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		const box = get(s.objectsGroup).getObjectByProperty('uuid', uuid);
+		s.vrControls.updateHoverBox(box);
+		return !!get(s.globalScene).getObjectByName('vr-hover-box')?.visible;
+	}, ids.selected);
+	await A.page.waitForTimeout(400);
+	r = await read(A.page);
+	h.check(r.shell && vrEdit, `VR Edit: the selection shell and hover box are back (shell ${r.shell}, hover ${vrEdit})`);
+	await A.page.evaluate(() => {
+		window.__stores.vrControls.updateHoverBox(null);
+		window.__stores.isVRMode.set(false);
+	});
+	await A.page.waitForTimeout(600);
+
+	// ---- 4. back in Edit on the desktop, everything returns ---------------------------------------
+	r = await read(A.page);
+	h.check(everything(r), `back to Edit: all of it returns (${JSON.stringify(r)})`);
+
+	// ---- 5. Play hides them all too (the grid and helper layer already did; now the rest) ---------
+	await A.page.evaluate(() => window.__stores.isLocked.set(true));
+	await A.page.waitForTimeout(600);
+	r = await read(A.page);
+	h.check(nothing(r), `Play: nothing of the editor is drawn (${JSON.stringify(r)})`);
+	// ...unless the debug toggle asks for them
+	await A.page.evaluate(() => window.__stores.helperLayer.helpersInPlay.set(true));
+	await A.page.waitForTimeout(500);
+	r = await read(A.page);
+	h.check(r.grid && r.colliders && r.helperLayer, `"Show helpers in Play (debug)" still brings the scaffolding back (${JSON.stringify(r)})`);
+	await A.page.evaluate(() => {
+		window.__stores.helperLayer.helpersInPlay.set(false);
+		window.__stores.isLocked.set(false);
+		window.__stores.lockedObjects.set([]);
+	});
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/level-templates.test.cjs b/tests/e2e/level-templates.test.cjs
new file mode 100644
index 00000000..6878cd79
--- /dev/null
+++ b/tests/e2e/level-templates.test.cjs
@@ -0,0 +1,260 @@
+// 30c level design — the three GENERAL-tab levels built from the kits (Castle Courtyard,
+// Forest Clearing, Tavern Interior; defs in scripts/level-templates.cjs). For each one:
+//   1. it loads from the Templates modal (the real card click) and every kit piece refills
+//      from its pack (packRefs.js), with the file a fraction of what the pieces weigh;
+//   2. Play puts you on the level's SPAWN (scenePhysics play.spawn) with the sim running;
+//   3. the play frame is readable — centre luminance >= 0.25, round 1's bar (fork 11) —
+//      and no quarter of the frame is black (no void, no black corner);
+//   4. the walker CANNOT pass a wall, and CAN pass the openings built for it (an archway
+//      and a staircase to a rampart, a doorway into a hut and a footbridge, a staircase to
+//      a balcony) — the custom colliders are the reason both halves hold.
+//
+// The staged scenes are served to the Templates modal by page.route (the templates-modal
+// suite's idiom) from LEVELS_DIR (default: the lane's staging folder), and the kits — until
+// the pack PRs are merged and format-1 is retagged — from PACKS_DIR when the build's own
+// PACKS_BASE is the CDN. SKIPS (never fails) when LEVELS_DIR has no index.
+//
+//   APP_URL=https://theprototype.app:5255/ node tests/e2e/level-templates.test.cjs
+//   LEVELS=castle-courtyard  (a subset)
+//   LIVE=1  (no routes: the build's own feed + pack CDN — the preview proof; LEVELS_DIR still lists the slugs)
+const fs = require('fs');
+const path = require('path');
+const h = require('./helpers.cjs');
+
+const LEVELS_DIR = process.env.LEVELS_DIR || '/home/deck/.code/theprototype-app/cloud-lane-30-staging/30c-levels';
+const PACKS_DIR = process.env.PACKS_DIR || '/home/deck/.code/lanes-30/levels-packs';
+const ONLY = (process.env.LEVELS || '').split(',').filter(Boolean);
+
+// what each level is walked through: [label, start {x, z, yaw}, key, ms, predicate(end), detail]
+// yaw: 0 looks -Z, +PI/2 looks -X, PI looks +Z, -PI/2 looks +X (the spawn convention)
+const PI = Math.PI;
+// an object only that level has — what the load waits for, so a check never reads the
+// PREVIOUS level while the new one is still arriving
+const MARKER = { 'castle-courtyard': 'Castle gate', 'forest-clearing': 'Footbridge', 'tavern-interior': 'Balcony stairs' };
+const WALKS = {
+	'castle-courtyard': [
+		{ label: 'the walker cannot walk through the south wall by the gate', at: [0, 3], yaw: PI, ms: 2500, pass: (e) => e.z < 5.8, moved: (b, e) => e.z - b.z > 1.2 },
+		{ label: 'the walker cannot walk through the west curtain wall', at: [-4.8, 1.5], yaw: PI / 2, ms: 2500, pass: (e) => e.x > -7.9, moved: (b, e) => b.x - e.x > 1.5 },
+		{ label: 'the walker passes the ARCHWAY and climbs the stairs onto the rampart', at: [-5, -4.6], yaw: 0, ms: 4500, pass: (e) => e.feet > 2.6 && e.z < -11.2, moved: (b, e) => b.z - e.z > 5 },
+		{ label: 'on the rampart the battlements hold the walker in', at: [0, -12.8], y: 3, yaw: 0, ms: 2000, pass: (e) => e.z > -13.95 && e.feet > 2.6, moved: () => true }
+	],
+	'forest-clearing': [
+		{ label: 'the walker cannot walk through the hut wall', at: [16, -7], yaw: PI / 2, ms: 2500, pass: (e) => e.x > 14.1, moved: (b, e) => b.x - e.x > 1 },
+		{ label: 'the walker crosses the FOOTBRIDGE over the pond neck', at: [0, -6], yaw: -PI / 2, ms: 3000, pass: (e) => e.x > 5.3, moved: (b, e) => e.x - b.x > 5 },
+		{ label: 'the walker enters the hut through its DOORWAY', at: [8, -6], yaw: -PI / 2, ms: 2200, pass: (e) => e.x > 10.6, moved: (b, e) => e.x - b.x > 2.5 }
+	],
+	'tavern-interior': [
+		{ label: 'the walker cannot walk through the front wall', at: [0, 3], yaw: PI, ms: 2000, pass: (e) => e.z < 3.9, moved: (b, e) => e.z - b.z > 0.3 },
+		{ label: 'the walker cannot walk through the east wall of the kitchen', at: [3.4, -2.6], yaw: -PI / 2, ms: 2500, pass: (e) => e.x < 5.9, moved: (b, e) => e.x - b.x > 1 },
+		{ label: 'the walker climbs the oak STAIRS to the balcony', at: [-5, 1.3], yaw: 0, ms: 4500, pass: (e) => e.feet > 2.7 && e.z < -3.2, moved: (b, e) => b.z - e.z > 3.5 },
+		{ label: 'the walker goes through the kitchen DOORWAY', at: [1.1, 1], yaw: -PI / 2, ms: 2200, pass: (e) => e.x > 2.6, moved: (b, e) => e.x - b.x > 1.5 }
+	]
+};
+
+/** the rig's world position (feet = eye - 1.7) */
+const rig = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any} */ let cam;
+		s.playerCam.subscribe((c) => (cam = c))();
+		if (!cam) return null;
+		const w = cam.getWorldPosition(new s.THREE.Vector3());
+		return { x: w.x, y: w.y, z: w.z, feet: w.y - 1.7 };
+	});
+
+/** put the rig's FEET at (x, y, z), level, facing `yaw` */
+const placeRig = (page, x, y, z, yaw) =>
+	page.evaluate(
+		({ x, y, z, yaw }) => {
+			const s = window.__stores;
+			/** @type {any} */ let cam;
+			s.playerCam.subscribe((c) => (cam = c))();
+			const v = new s.THREE.Vector3(x, y + 1.7, z);
+			cam.parent?.worldToLocal(v);
+			cam.position.copy(v);
+			cam.quaternion.setFromEuler(new s.THREE.Euler(0, yaw, 0, 'YXZ'));
+			cam.updateMatrixWorld(true);
+			return true;
+		},
+		{ x, y, z, yaw }
+	);
+
+/** centre-clip luminance + the darkest quadrant of a real screenshot */
+async function frameLight(page) {
+	return page.evaluate(async (b64) => {
+		const bmp = await createImageBitmap(await (await fetch('data:image/png;base64,' + b64)).blob());
+		const c = document.createElement('canvas');
+		c.width = bmp.width;
+		c.height = bmp.height;
+		const x = c.getContext('2d');
+		x.drawImage(bmp, 0, 0);
+		const lum = (/** @type {number} */ x0, /** @type {number} */ y0, /** @type {number} */ w, /** @type {number} */ hgt) => {
+			const d = x.getImageData(x0, y0, w, hgt).data;
+			let sum = 0;
+			for (let i = 0; i < d.length; i += 4) sum += 0.2126 * d[i] + 0.7152 * d[i + 1] + 0.0722 * d[i + 2];
+			return sum / (d.length / 4) / 255;
+		};
+		const W = bmp.width;
+		const Hh = bmp.height;
+		const centre = lum(Math.round(W / 2 - 180), Math.round(Hh / 2 - 180), 360, 360);
+		const quads = [lum(0, 0, W / 2, Hh / 2), lum(W / 2, 0, W / 2, Hh / 2), lum(0, Hh / 2, W / 2, Hh / 2), lum(W / 2, Hh / 2, W / 2, Hh / 2)];
+		return { centre, darkest: Math.min(...quads), quads };
+	}, (await page.screenshot()).toString('base64'));
+}
+
+h.run(async () => {
+	const indexFile = path.join(LEVELS_DIR, 'index.json');
+	if (!fs.existsSync(indexFile)) {
+		console.log('SKIP no staged levels at ' + LEVELS_DIR + ' (author them: see the handover)');
+		console.log('ALL PASS');
+		return;
+	}
+	const index = JSON.parse(fs.readFileSync(indexFile, 'utf8'));
+	const levels = (index.templates ?? []).filter((t) => WALKS[t.slug] && (!ONLY.length || ONLY.includes(t.slug)));
+	h.check(levels.length > 0, `the staged index lists the levels (${levels.map((l) => l.slug).join(', ')})`);
+
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	// warm the lazy rapier import (the physics-suite ritual): Play must have a world at once
+	{
+		const warm = await h.setupPage(browser, 'warm');
+		await warm.page.evaluate(() => window.__stores.physics.warmup().catch(() => {}));
+		await warm.page.waitForTimeout(3000);
+		await warm.ctx.close();
+	}
+	const A = await h.setupPage(browser, 'A', { context: { viewport: { width: 1540, height: 774 } } });
+	const page = A.page;
+	// the Templates modal's feed -> the staged folder; the kits -> PACKS_DIR when this build
+	// reads them from the CDN (a relative pack path resolves against PACKS_BASE)
+	// LIVE=1: no routing at all — the build's own scenes feed and pack CDN (a preview proof)
+	if (!process.env.LIVE) await page.route('**/cdn.jsdelivr.net/**', (route) => {
+		const url = route.request().url();
+		const scenes = url.match(/\/theprototype-app\/scenes@[^/]+\/(.*)$/);
+		if (scenes) {
+			const file = path.join(LEVELS_DIR, decodeURIComponent(scenes[1]));
+			if (scenes[1] === 'index.json') return route.fulfill({ json: index });
+			if (fs.existsSync(file)) return route.fulfill({ body: fs.readFileSync(file) });
+			return route.fulfill({ status: 404 });
+		}
+		const packs = url.match(/\/theprototype-app\/packs@[^/]+\/(.*)$/);
+		if (packs && fs.existsSync(PACKS_DIR)) {
+			const file = path.join(PACKS_DIR, decodeURIComponent(packs[1]));
+			if (fs.existsSync(file)) return route.fulfill({ body: fs.readFileSync(file) });
+		}
+		return route.continue();
+	});
+
+	for (const level of levels) {
+		console.log('\n--- ' + level.slug);
+		const size = fs.statSync(path.join(LEVELS_DIR, level.scene)).size;
+		h.check(size < 400_000, `${level.title}: the .tpscene is ${Math.round(size / 1024)} KB (kit pieces ride as references)`);
+
+		// 1. load it from the Templates modal ---------------------------------------
+		await page.evaluate(() => window.__stores.isLocked.set(null));
+		await page.locator('#logo-menu').click();
+		await page.waitForTimeout(300);
+		await page.locator('#open-templates').click();
+		await page.waitForTimeout(500);
+		await page.locator('#templates-tab-general').click();
+		const card = page.locator(`[data-scene-slug="${level.slug}"]`);
+		h.check(await card.isVisible().catch(() => false), `${level.title}: the card is on the General tab`);
+		await card.click();
+		// a replace of a non-empty scene answers nothing here (no peers); a large-scene ask
+		// would be a finding, so it is NOT auto-answered
+		await h.eventually(
+			() =>
+				page.evaluate(async (marker) => {
+					const s = window.__stores;
+					/** @type {any} */ let g;
+					s.objectsGroup.subscribe((v) => (g = v))();
+					let refs = 0;
+					let hollow = 0;
+					let meshes = 0;
+					g.traverse((/** @type {any} */ n) => {
+						if (n.userData?.packRef) refs++;
+						if (n.userData?.packStub) hollow++;
+						if (n.isMesh) meshes++;
+					});
+					/** @type {any} */ let pending;
+					s.packRefs.packRefsPending.subscribe((v) => (pending = v))();
+					return { refs, hollow, meshes, pending, marker: !!g.getObjectByName(marker) };
+				}, MARKER[level.slug]),
+			(r) => r.marker && r.refs > 50 && r.hollow === 0 && r.pending === 0,
+			`${level.title}: the level loads and every kit piece refills from its pack`,
+			60000
+		);
+		const facts = await page.evaluate(() => {
+			const s = window.__stores;
+			/** @type {any} */ let g;
+			s.objectsGroup.subscribe((v) => (g = v))();
+			let refs = 0;
+			let meshes = 0;
+			const maps = new Set();
+			g.traverse((/** @type {any} */ n) => {
+				if (n.userData?.packRef) refs++;
+				if (n.isMesh) {
+					meshes++;
+					if (n.material?.map) maps.add(n.material.map);
+				}
+			});
+			/** @type {any} */ let play;
+			s.scenePhysics.scenePlay.subscribe((v) => (play = v))();
+			return { refs, meshes, maps: maps.size, spawn: play?.spawn ?? null, simOnPlay: play?.simOnPlay };
+		});
+		h.check(facts.maps < facts.refs / 2, `${level.title}: ${facts.refs} kit pieces share ${facts.maps} base textures`);
+		h.check(!!facts.spawn && facts.simOnPlay === true, `${level.title}: a spawn point and sim-on-play are scene data (${JSON.stringify(facts.spawn)})`);
+
+		// COUNTERFACTUALS (CF=arch | CF=spawn): break one guard in the page and watch its
+		// check go red — the archway loses its custom collider (the box of the whole arch
+		// then blocks the opening), or the scene loses its spawn (Play starts at the fixed
+		// (0, 2, 3))
+		if (process.env.CF)
+			await page.evaluate((cf) => {
+				const s = window.__stores;
+				/** @type {any} */ let g;
+				s.objectsGroup.subscribe((v) => (g = v))();
+				if (cf === 'arch') delete g.getObjectByName('Stair archway')?.userData?.physics;
+				if (cf === 'spawn') s.scenePhysics.setScenePhysics({ play: { spawn: null } });
+			}, process.env.CF);
+
+		// 2. Play: the spawn, the sim --------------------------------------------------
+		await page.evaluate(() => window.__stores.isLocked.set(true));
+		await h.eventually(
+			() => page.evaluate(() => { let v; window.__stores.physics.simulating.subscribe((x) => (v = x))(); return v; }),
+			(v) => v === true,
+			`${level.title}: Play starts the simulation (sim-on-play)`,
+			15000
+		);
+		await page.waitForTimeout(1200);
+		const at = await rig(page);
+		h.check(
+			at && Math.hypot(at.x - facts.spawn.position[0], at.z - facts.spawn.position[2]) < 0.6 && Math.abs(at.feet - facts.spawn.position[1]) < 0.6,
+			`${level.title}: Play starts at the spawn point (${at && [at.x, at.feet, at.z].map((v) => v.toFixed(2))})`
+		);
+		const walker = await page.evaluate(() => { let v; window.__stores.charController.walkerState.subscribe((x) => (v = x))(); return v; });
+		h.check(walker.source === 'rapier' && walker.grounded, `${level.title}: the walker stands on the level through the physics world (${walker.source}, grounded ${walker.grounded})`);
+
+		// 3. the frame reads, and no quarter is a void ----------------------------------
+		await page.waitForTimeout(800);
+		const light = await frameLight(page);
+		await page.screenshot({ path: `/home/deck/.code/lanes-30/after-30c/30c-level-design/play-${level.slug}.png` });
+		h.check(light.centre >= 0.25, `${level.title}: the play frame reads — centre luminance ${light.centre.toFixed(3)} >= 0.25`);
+		h.check(light.darkest >= 0.08, `${level.title}: no black quarter (darkest quadrant ${light.darkest.toFixed(3)}; ${light.quads.map((q) => q.toFixed(2))})`);
+
+		// 4. walls hold, openings pass ----------------------------------------------------
+		for (const walk of WALKS[level.slug]) {
+			await placeRig(page, walk.at[0], walk.y ?? 0.3, walk.at[1], walk.yaw);
+			await page.waitForTimeout(700);
+			const before = await rig(page);
+			await page.keyboard.down('KeyW');
+			await page.waitForTimeout(walk.ms);
+			await page.keyboard.up('KeyW');
+			await page.waitForTimeout(300);
+			const end = await rig(page);
+			const ok = before && end && walk.moved(before, end) && walk.pass(end);
+			h.check(!!ok, `${level.title}: ${walk.label} (from ${before && [before.x, before.feet, before.z].map((v) => v.toFixed(2))} to ${end && [end.x, end.feet, end.z].map((v) => v.toFixed(2))})`);
+		}
+		await page.evaluate(() => window.__stores.isLocked.set(false));
+		await page.waitForTimeout(2500);
+	}
+	await h.finish(browser);
+});
diff --git a/tests/e2e/module-storage.test.cjs b/tests/e2e/module-storage.test.cjs
new file mode 100644
index 00000000..a2ef2b58
--- /dev/null
+++ b/tests/e2e/module-storage.test.cjs
@@ -0,0 +1,274 @@
+// 30 P4 — GAMES REMEMBER THINGS ON THIS DEVICE (roadmap 30 fork 7).
+//
+// Two surfaces, one leaf (gameStorage.js):
+//   · `api.storage` for modules — JSON under `tp:mod:<moduleId>:<key>` through safeStorage,
+//     256 KB per module (over it: `false` and ONE toast), LOCAL, surviving a reload.
+//   · the Store Value / Stored Value flow nodes — `tp:scene:<scene name|untitled>:<key>`,
+//     acting on the trigger's stamp edge, sending NOTHING.
+//
+// Modules are driven INLINE through `moduleSDK.initModules` (the post-backends precedent: the
+// real makeApi path, no zip). The key format is asserted byte for byte against raw
+// localStorage, because a module that must also run on an older core (untangle's fallback)
+// writes the very same key itself.
+const h = require('./helpers.cjs');
+
+/** register two inline modules that park their api.storage on window @param {any} page */
+const registerModules = (page) =>
+	page.evaluate(async () => {
+		const sdk = window.__stores.moduleSDK;
+		/** @param {string} id */
+		const make = (id) => ({
+			id,
+			name: 'Storage test ' + id,
+			version: '1.0.0',
+			description: 'inline',
+			register(api) {
+				window['__' + id] = api.storage;
+			}
+		});
+		await sdk.initModules([make('stA'), make('stB')]);
+		return !!window.__stA && !!window.__stB;
+	});
+
+/** @param {any} page */
+const toastsMatching = (page, re) =>
+	page.evaluate((src) => {
+		let list = [];
+		window.__stores.toastStore.subscribe((v) => (list = v ?? []))();
+		const r = new RegExp(src);
+		return list.filter((t) => r.test(String(t?.message ?? t?.text ?? t ?? ''))).length;
+	}, re.source);
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+
+	// ===================================================================== 1. the api
+	h.check(await registerModules(page), 'two inline modules received api.storage');
+	const basics = await page.evaluate(() => {
+		const a = window.__stA;
+		const out = {};
+		out.setN = a.set('score', 42);
+		out.setO = a.set('progress', { mode2d: { unlocked: 3, solved: [1, 2] } });
+		out.setT = a.set('name', 'Ada');
+		out.getN = a.get('score');
+		out.getO = a.get('progress');
+		out.getT = a.get('name');
+		out.missing = a.get('nothing', 'fallback');
+		out.keys = a.keys();
+		out.raw = localStorage.getItem('tp:mod:stA:progress');
+		a.remove('name');
+		out.afterRemove = a.keys();
+		out.bytes = a.bytes();
+		return out;
+	});
+	h.check(basics.setN && basics.setO && basics.setT, 'set returns true for JSON values');
+	h.check(basics.getN === 42 && basics.getT === 'Ada', `get round-trips a number and text (${basics.getN}, ${basics.getT})`);
+	h.check(JSON.stringify(basics.getO) === '{"mode2d":{"unlocked":3,"solved":[1,2]}}', 'and an object');
+	h.check(basics.missing === 'fallback', 'a missing key hands back the fallback');
+	h.check(JSON.stringify(basics.keys) === '["name","progress","score"]', `keys() lists this module's keys, sorted (${basics.keys})`);
+	h.check(
+		basics.raw === '{"mode2d":{"unlocked":3,"solved":[1,2]}}',
+		`THE KEY CONTRACT: localStorage["tp:mod:stA:progress"] holds the JSON (${basics.raw})`
+	);
+	h.check(JSON.stringify(basics.afterRemove) === '["progress","score"]', 'remove() drops one key');
+	h.check(basics.bytes > 0, `bytes() measures what the module spends (${basics.bytes})`);
+
+	// ===================================================================== 2. two modules never meet
+	const apart = await page.evaluate(() => {
+		const a = window.__stA;
+		const b = window.__stB;
+		b.set('score', 7);
+		const view = { a: a.get('score'), b: b.get('score'), bKeys: b.keys() };
+		b.clear();
+		view.afterClear = { a: a.get('score'), bKeys: b.keys() };
+		return view;
+	});
+	h.check(apart.a === 42 && apart.b === 7, `the same key in two modules holds two values (${apart.a}, ${apart.b})`);
+	h.check(JSON.stringify(apart.bKeys) === '["score"]', "a module's keys() never lists another module's");
+	h.check(apart.afterClear.a === 42 && apart.afterClear.bKeys.length === 0, "clear() empties this module and leaves the other alone");
+
+	// ===================================================================== 3. the cap
+	const cap = await page.evaluate(() => {
+		const a = window.__stA;
+		const big = 'x'.repeat(300 * 1024);
+		const first = a.set('huge', big);
+		const second = a.set('huge2', big);
+		return { first, second, has: a.get('huge', null) !== null, cap: window.__stores.gameStorage.MODULE_STORAGE_CAP };
+	});
+	h.check(cap.first === false && cap.second === false, 'a write over 256 KB returns false');
+	h.check(!cap.has, 'and writes nothing');
+	h.check(cap.cap === 262144, `the cap is 256 KB (${cap.cap})`);
+	await page.waitForTimeout(300);
+	const capToasts = await toastsMatching(page, /storage limit/);
+	h.check(capToasts === 1, `ONE toast per module per session, not one per write (${capToasts})`);
+
+	// ===================================================================== 4. a failing localStorage
+	const failing = await page.evaluate(() => {
+		const a = window.__stA;
+		const original = Storage.prototype.setItem;
+		Storage.prototype.setItem = function () {
+			throw new DOMException('quota', 'QuotaExceededError');
+		};
+		let threw = false;
+		let ok = false;
+		let back = null;
+		try {
+			ok = a.set('offline', { still: 'here' });
+			back = a.get('offline');
+		} catch {
+			threw = true;
+		}
+		Storage.prototype.setItem = original;
+		return { threw, ok, back, raw: localStorage.getItem('tp:mod:stA:offline') };
+	});
+	h.check(!failing.threw, 'a throwing localStorage never throws out of api.storage');
+	h.check(failing.ok && failing.back?.still === 'here', 'the value applies for the session (memory fallback)');
+	h.check(failing.raw === null, 'and truly never reached localStorage');
+	h.check(h.pageErrors(A).length === 0, `no page error (${h.pageErrors(A).length})`);
+
+	// ===================================================================== 5. the flow nodes
+	const B = await h.setupPage(browser, 'B');
+	await h.connect(B, A);
+	const built = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.levels.currentLevel.set({ hash: '', name: 'Arcade', unsaved: true });
+		const nodes = [
+			{ id: 'svKey', type: 'keypress', position: { x: 0, y: 0 }, data: { type: 'keypress', code: 'KeyK', edge: 'down' }, class: 'w-[150px]' },
+			{ id: 'svCount', type: 'counter', position: { x: 0, y: 200 }, data: { type: 'counter', op: 'up', step: 1 }, class: 'w-[150px]' },
+			{ id: 'svStore', type: 'storevalue', position: { x: 300, y: 0 }, data: { type: 'storevalue', key: 'best', mode: 'max', value: 0 }, class: 'w-[150px]' },
+			{ id: 'svRead', type: 'storedvalue', position: { x: 600, y: 0 }, data: { type: 'storedvalue', key: 'best', output: 'number', fallback: -1 }, class: 'w-[150px]' }
+		];
+		const edges = [
+			{ id: 'e-svKey-svCount.pulse', source: 'svKey', target: 'svCount', targetHandle: 'pulse' },
+			{ id: 'e-svKey-svStore.trigger', source: 'svKey', target: 'svStore', targetHandle: 'trigger' },
+			{ id: 'e-svCount-svStore.value', source: 'svCount', target: 'svStore', targetHandle: 'value' }
+		];
+		s.flowGraphs.update((g) => ({ ...g, scene: { nodes, edges } }));
+		s.flowNodes.set(nodes);
+		s.flowEdges.set(edges);
+		await new Promise((r) => setTimeout(r, 800)); // past the nodes' first-seen (actionSeenAt)
+		return true;
+	});
+	h.check(built, 'a Counter -> Store Value (max) graph');
+	// count the wire while the node writes: Store Value must send NOTHING of its own
+	await page.evaluate(() => {
+		let peer;
+		window.__stores.peers.subscribe((v) => (peer = v))();
+		window.__sentTypes = [];
+		const send = peer.send.bind(peer);
+		peer.send = (msg) => {
+			window.__sentTypes.push(msg?.type);
+			return send(msg);
+		};
+	});
+	for (let i = 0; i < 3; i++) {
+		// a LOCAL pulse (this player's own key press): the counter and the store both act
+		await page.evaluate(() => window.__stores.flowRuntime.applyNodeTrigger('svKey', (Date.now() % 86400000) / 1000, false));
+		await page.waitForTimeout(700);
+	}
+	const flow = await page.evaluate(() => ({
+		raw: localStorage.getItem('tp:scene:Arcade:best'),
+		sent: window.__sentTypes
+	}));
+	h.check(flow.raw === '3', `three presses keep the best (3) under tp:scene:Arcade:best (${flow.raw})`);
+	h.check(!flow.sent.some((t) => /stor/i.test(String(t))), `Store Value put nothing on the wire (${JSON.stringify([...new Set(flow.sent)])})`);
+	// a LOWER value must not overwrite the max
+	await page.evaluate(() => {
+		const s = window.__stores;
+		s.flowGraphs.update((g) => ({
+			...g,
+			scene: { ...g.scene, nodes: g.scene.nodes.map((n) => (n.id === 'svCount' ? { ...n, data: { ...n.data, step: -5 } } : n)) }
+		}));
+	});
+	await page.evaluate(() => window.__stores.flowRuntime.applyNodeTrigger('svKey', (Date.now() % 86400000) / 1000, false));
+	await page.waitForTimeout(700);
+	h.check((await page.evaluate(() => localStorage.getItem('tp:scene:Arcade:best'))) === '3', 'max mode never lowers the best');
+	const readNow = await page.evaluate(() => {
+		let v = {};
+		window.__stores.flowValues.subscribe((x) => (v = x))();
+		return v.svRead;
+	});
+	h.check(readNow === 3, `Stored Value reads it back (${readNow})`);
+	const onB = await B.page.evaluate(() => Object.keys(localStorage).filter((k) => k.startsWith('tp:scene:')));
+	h.check(onB.length === 0, `the second peer received NOTHING (${JSON.stringify(onB)})`);
+
+	// ===================================================================== 6. a reload keeps both halves
+	await h.freshReload(A);
+	await page.waitForFunction(() => window.__stores && !!window.__stores.moduleSDK, { timeout: 30000 });
+	await registerModules(page);
+	const after = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.levels.currentLevel.set({ hash: '', name: 'Arcade', unsaved: true });
+		const nodes = [
+			{ id: 'svRead2', type: 'storedvalue', position: { x: 0, y: 0 }, data: { type: 'storedvalue', key: 'best', output: 'number', fallback: -1 }, class: 'w-[150px]' },
+			{ id: 'svText', type: 'storedvalue', position: { x: 0, y: 200 }, data: { type: 'storedvalue', key: 'best', output: 'text', fallback: '' }, class: 'w-[150px]' }
+		];
+		s.flowGraphs.update((g) => ({ ...g, scene: { nodes, edges: [] } }));
+		s.flowNodes.set(nodes);
+		s.flowEdges.set([]);
+		await new Promise((r) => setTimeout(r, 900));
+		let v = {};
+		s.flowValues.subscribe((x) => (v = x))();
+		return { score: window.__stA.get('score'), num: v.svRead2, text: v.svText };
+	});
+	h.check(after.score === 42, `a module's value survives a reload (${after.score})`);
+	h.check(after.num === 3, `Stored Value reads the saved best after a reload (${after.num})`);
+	h.check(after.text === '3', `and as text (${JSON.stringify(after.text)})`);
+	const otherScene = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.levels.currentLevel.set({ hash: '', name: 'Other game', unsaved: true });
+		await new Promise((r) => setTimeout(r, 500));
+		let v = {};
+		s.flowValues.subscribe((x) => (v = x))();
+		return v.svRead2;
+	});
+	h.check(otherScene === -1, `another scene's namespace does not see it (fallback ${otherScene})`);
+
+	// ===================================================================== 7. "Save best score" on a HUD button
+	const bind = await page.evaluate(async () => {
+		const s = window.__stores;
+		s.hudDocs.setHudDocFor('scene', {
+			active: 'main',
+			screens: [{ id: 'main', name: 'Main', elements: [{ id: 'saveBtn', kind: 'button', text: 'Save', anchor: 'center', x: 0, y: 0, w: 120, h: 40 }] }]
+		});
+		await new Promise((r) => setTimeout(r, 300));
+		const offered = s.hudActions.actionsForKind('button').some((a) => a.key === 'savebest');
+		const res = s.hudActions.addBinding('saveBtn', 'savebest');
+		await new Promise((r) => setTimeout(r, 900)); // past the fresh nodes' first-seen
+		let g;
+		s.flowGraphs.subscribe((v) => (g = v))();
+		const nodes = g.scene.nodes;
+		const edges = g.scene.edges;
+		const store = nodes.find((n) => n.type === 'storevalue');
+		const src = nodes.find((n) => n.type === 'getvariable');
+		const press = nodes.find((n) => n.type === 'hudbutton');
+		return {
+			offered,
+			ok: res.ok,
+			store: store?.data ?? null,
+			src: src?.data?.name ?? null,
+			trig: edges.some((e) => e.source === press?.id && e.target === store?.id && e.targetHandle === 'trigger'),
+			val: edges.some((e) => e.source === src?.id && e.target === store?.id && e.targetHandle === 'value'),
+			labels: s.hudActions.bindingsFor('saveBtn').map((b) => b.label)
+		};
+	});
+	h.check(bind.offered, 'a HUD button is offered "Save best score"');
+	h.check(bind.ok && bind.store?.key === 'best' && bind.store?.mode === 'max', `which builds a Store Value (best, max) (${JSON.stringify(bind.store)})`);
+	h.check(bind.src === 'score' && bind.val, 'fed by the score variable on its value socket');
+	h.check(bind.trig, 'and pressed by the button on its trigger socket');
+	h.check(bind.labels.some((l) => /Save .best. on this device/.test(l)), `the Actions pane says what it does (${JSON.stringify(bind.labels)})`);
+	await page.evaluate(() => {
+		window.__stores.gameState.setGameVar('score', 12);
+		window.__stores.flowRuntime.fireHudButton('saveBtn');
+	});
+	await h.eventually(
+		() => page.evaluate(() => localStorage.getItem('tp:scene:Other game:best')),
+		(v) => v === '12',
+		'pressing it saves the score as this device\'s best',
+		4000
+	);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/module-world-root.test.cjs b/tests/e2e/module-world-root.test.cjs
new file mode 100644
index 00000000..fd5d9bc3
--- /dev/null
+++ b/tests/e2e/module-world-root.test.cjs
@@ -0,0 +1,127 @@
+// 30b P5: MODULE CONTENT FOLLOWS THE WORLD. The Quest report: "When I spin the world
+// around, the untangled dots do not spin around." The VR world gestures transform the
+// `world-grab-rig` group; module viewport content lived at the SCENE ROOT (golden rule 5
+// keeps it out of objectsGroup), outside the rig, so it stayed pinned to the room. Every
+// REGISTERED module group is now re-homed under `module-world-root` inside the rig — for
+// every module at once — while staying out of objectsGroup (nothing replicates or saves),
+// and the module's own `scene.remove(group)` / `getObjectByName` keep working.
+// Driven with an INLINE module through the real SDK (moduleSDK.initModules).
+const h = require('./helpers.cjs');
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+
+	// a module that builds a board (registered BEFORE it is added) and a late board
+	// (added first, registered after), plus a stray group it never registers
+	await A.page.evaluate(() => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		const mod = {
+			id: 'worldroottest',
+			name: 'World root test',
+			version: '1',
+			register(api) {
+				window.__wrApi = api;
+				api.registerInteractiveGroup('wr-board');
+				const scene = api.scene();
+				const board = new THREE.Group();
+				board.name = 'wr-board';
+				board.userData.play = { grounded: true };
+				const dot = new THREE.Mesh(new THREE.SphereGeometry(0.1), new THREE.MeshBasicMaterial());
+				dot.name = 'wr-dot';
+				dot.position.set(1, 1, 0);
+				board.add(dot);
+				scene.add(board);
+				const late = new THREE.Group();
+				late.name = 'wr-late';
+				scene.add(late);
+				api.registerListedGroup('wr-late', { label: 'Late board' });
+				const stray = new THREE.Group();
+				stray.name = 'wr-stray';
+				scene.add(stray);
+			}
+		};
+		s.moduleSDK.initModules([mod]);
+	});
+	await A.page.waitForTimeout(300);
+
+	const read = () =>
+		A.page.evaluate(() => {
+			const s = window.__stores;
+			const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+			const scene = get(s.globalScene);
+			const THREE = s.THREE;
+			const board = scene.getObjectByName('wr-board');
+			const late = scene.getObjectByName('wr-late');
+			const stray = scene.getObjectByName('wr-stray');
+			const dot = scene.getObjectByName('wr-dot');
+			let inObjects = false;
+			get(s.objectsGroup).traverse((n) => { if (n.name === 'wr-board') inObjects = true; });
+			return {
+				board: board?.parent?.name ?? null,
+				late: late?.parent?.name ?? null,
+				stray: stray?.parent === scene ? 'scene' : stray?.parent?.name ?? null,
+				dotWorld: dot ? dot.getWorldPosition(new THREE.Vector3()).toArray() : null,
+				inObjects,
+				publishers: s.playSettings.playPublishers(scene).map((p) => p.name)
+			};
+		});
+
+	// ---- 1. registered groups are re-homed inside the rig; the stray one is not -------------------
+	let r = await read();
+	h.check(r.board === 'module-world-root', `a registered group lands under the world rig's module root (${r.board})`);
+	h.check(r.late === 'module-world-root', `...also when it was added BEFORE its name was registered (${r.late})`);
+	h.check(r.stray === 'scene', `an UNREGISTERED scene-root group stays where it was put (${r.stray})`);
+	h.check(!r.inObjects, 'golden rule 5: module content never enters objectsGroup');
+	const rigParent = await A.page.evaluate(() => {
+		let v;
+		window.__stores.globalScene.subscribe((x) => (v = x))();
+		return v.getObjectByName('module-world-root')?.parent?.name ?? null;
+	});
+	h.check(rigParent === 'world-grab-rig', `the module root is a child of the world rig (${rigParent})`);
+	h.check(r.dotWorld && Math.abs(r.dotWorld[0] - 1) < 1e-6 && Math.abs(r.dotWorld[1] - 1) < 1e-6, `at 1:1 nothing moved (dot at ${r.dotWorld})`);
+	h.check(r.publishers.includes('wr-board'), `a re-homed group still publishes the play contract (${r.publishers})`);
+
+	// ---- 2. spin + scale the world: the dot goes with it --------------------------------------------
+	await A.page.evaluate(() => {
+		const s = window.__stores;
+		let rig;
+		s.worldRig.subscribe((x) => (rig = x))();
+		rig.quaternion.setFromAxisAngle(new s.THREE.Vector3(0, 1, 0), Math.PI / 2);
+		rig.scale.setScalar(2);
+		rig.updateMatrixWorld(true);
+	});
+	r = await read();
+	// R(90deg about +Y) maps (1,1,0) to (0,1,-1); scale 2 -> (0,2,-2)
+	h.check(
+		r.dotWorld && Math.abs(r.dotWorld[0]) < 1e-6 && Math.abs(r.dotWorld[1] - 2) < 1e-6 && Math.abs(r.dotWorld[2] + 2) < 1e-6,
+		`the world spun and scaled: the module's dot followed (${r.dotWorld.map((v) => v.toFixed(3))})`
+	);
+	await A.page.evaluate(() => window.__stores.vrControls.resetWorldRig());
+
+	// ---- 3. the Module content list still lists it ------------------------------------------------------
+	const rows = await A.page.evaluate(() => window.__stores.moduleWorld.moduleWorldDebug().rows);
+	h.check(rows.includes('wr-board') && rows.includes('wr-late'), `the object list's Module content rows still find both (${rows})`);
+
+	// ---- 4. the module's own scene.remove(group) still takes it out ---------------------------------
+	const removed = await A.page.evaluate(() => {
+		const scene = window.__wrApi.scene();
+		const late = scene.getObjectByName('wr-late');
+		scene.remove(late);
+		return { gone: !scene.getObjectByName('wr-late'), parent: late.parent };
+	});
+	h.check(removed.gone && removed.parent === null, 'api.scene().remove(group) removes a re-homed group');
+
+	// ---- 5. disabling the module takes its content away ---------------------------------------------------
+	await A.page.evaluate(() => {
+		window.__stores.moduleSDK.deactivateModule('worldroottest');
+		const scene = window.__wrApi.scene();
+		scene.remove(scene.getObjectByName('wr-stray'));
+	});
+	await A.page.waitForTimeout(200);
+	r = await read();
+	h.check(r.board === null, `deactivating the module removes its re-homed group (${r.board})`);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/move-wire-shape.test.cjs b/tests/e2e/move-wire-shape.test.cjs
new file mode 100644
index 00000000..aaf038f0
--- /dev/null
+++ b/tests/e2e/move-wire-shape.test.cjs
@@ -0,0 +1,83 @@
+// A `move` sent with three's `Euler.toArray()` — `[x, y, z, 'XYZ']` — must land on the peer.
+//
+// 27-A's wire validator accepted a rotation of 3 or 4 FINITE NUMBERS only, and three 0.185's
+// `Euler.toArray()` carries the ORDER STRING as its fourth entry. That is the shape the gizmo
+// drag, the Explorer drop-to-surface, the Inspector, Align to ground and a dozen other senders
+// put on the wire, so every one of those moves was refused on arrival (`invalid:move`) and the
+// peer kept the old pose. Found by the 30c pack lanes (a snapped kit drag never reached peer B).
+//
+// The path driven here is a REAL sender (objectActions.alignToGround), with a pass-through
+// spy proving the message left in the toArray shape, so the check cannot pass on a sender
+// that happens to send three numbers.
+const h = require('./helpers.cjs');
+
+const poseOf = (page, uuid) =>
+	page.evaluate(async (id) => {
+		const w = window.__stores;
+		const g = await new Promise((r) => w.objectsGroup.subscribe(r)());
+		const o = g.getObjectByProperty('uuid', id);
+		return o ? { y: o.position.y, x: o.position.x, ry: o.rotation.y } : null;
+	}, uuid);
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	const B = await h.setupPage(browser, 'B');
+	await h.connect(B, A);
+
+	const uuid = await A.page.evaluate(async () => {
+		const w = window.__stores;
+		w.commandsHandler.sceneCommand('/create Box 1 1 1');
+		const g = await new Promise((r) => w.objectsGroup.subscribe(r)());
+		return g.children[g.children.length - 1].uuid;
+	});
+	await h.eventually(() => poseOf(B.page, uuid), (p) => !!p, 'premise: B holds the box', 20000);
+	// let /create's own re-seat settle before moving it (the documented /create trap)
+	await A.page.waitForTimeout(1500);
+
+	// lift + turn it on A and replicate that pose with a plain 3-number move first, so B
+	// starts from a known pose that differs from where Align to ground will put it
+	await A.page.evaluate((id) => {
+		const w = window.__stores;
+		let g; w.objectsGroup.subscribe((v) => (g = v))();
+		const o = g.getObjectByProperty('uuid', id);
+		o.userData.physics = { mode: 'static' };
+		o.position.set(1.5, 6, -2);
+		o.rotation.set(0, 0.7, 0);
+		let p; w.peers.subscribe((v) => (p = v))();
+		p.send({ type: 'move', uuid: id, pos: [1.5, 6, -2], rot: [0, 0.7, 0], scale: [1, 1, 1] });
+	}, uuid);
+	await h.eventually(() => poseOf(B.page, uuid), (p) => p && Math.abs(p.y - 6) < 0.01, 'premise: B has the lifted pose (y 6)', 15000);
+
+	// spy on what A sends, passing it through
+	await A.page.evaluate(() => {
+		const w = window;
+		w.__moves = [];
+		let p; w.__stores.peers.subscribe((v) => (p = v))();
+		const orig = p.send.bind(p);
+		p.send = (d) => { if (d && d.type === 'move') w.__moves.push(d.rot); return orig(d); };
+	});
+	const errsBefore = await B.page.evaluate(() => window.__stores.wireErrors.wireErrors().filter((e) => e.type === 'invalid:move').reduce((n, e) => n + e.count, 0));
+
+	await A.page.evaluate((id) => window.__stores.objectActions.alignToGround(id), uuid);
+	const aPose = await poseOf(A.page, uuid);
+	const sent = await A.page.evaluate(() => window.__moves);
+	h.check(aPose && aPose.y < 5, `premise: Align to ground moved the box on A (y ${aPose && aPose.y.toFixed(2)})`);
+	h.check(
+		sent.length > 0 && sent.every((r) => Array.isArray(r) && r.length === 4 && typeof r[3] === 'string'),
+		`premise: the real sender put the toArray shape on the wire (${JSON.stringify(sent[0])})`
+	);
+
+	await h.eventually(
+		() => poseOf(B.page, uuid),
+		(p) => p && Math.abs(p.y - aPose.y) < 0.01,
+		'THE BUG: B follows a move whose rotation is [x, y, z, order]',
+		8000
+	);
+	const bPose = await poseOf(B.page, uuid);
+	h.check(bPose && Math.abs(bPose.ry - 0.7) < 0.01 && Math.abs(bPose.x - 1.5) < 0.01, `B keeps the rest of the pose (x ${bPose && bPose.x.toFixed(2)}, ry ${bPose && bPose.ry.toFixed(2)})`);
+	const errsAfter = await B.page.evaluate(() => window.__stores.wireErrors.wireErrors().filter((e) => e.type === 'invalid:move').reduce((n, e) => n + e.count, 0));
+	h.check(errsAfter === errsBefore, `B recorded no invalid:move (${errsBefore} -> ${errsAfter})`);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/object-list-modules.test.cjs b/tests/e2e/object-list-modules.test.cjs
new file mode 100644
index 00000000..6ae599da
--- /dev/null
+++ b/tests/e2e/object-list-modules.test.cjs
@@ -0,0 +1,283 @@
+// 30 P3 — EVERY MODULE'S CONTENT IS LISTED. The object list's "Module content" section.
+//
+// Measured before this (roadmap 30, "Selection and the object list", cause 3): scene-root
+// module content — the untangle board, the dungeon, the piano, the sabers — lives
+// outside objectsGroup by golden rule 5, so it was never picked and never LISTED (only
+// the advanced System filter polled it). Now every group a module registers gets one
+// READ-ONLY row: the module's name as a badge, expandable to its named children, a click
+// that selects a PROXY and frames it, and an Inspector card saying whose it is.
+//
+// The proxy is the thing to distrust, so it is checked from every side: it never enters
+// objectsGroup, never reaches a peer, never appears in a saved payload, and a deselect
+// removes it. Skip-never-fail when the untangle scene or zip cannot be reached (the
+// game-untangle sources: UNTANGLE_TPSCENE / UNTANGLE_ZIP / the feed / a sibling checkout).
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const path = require('path');
+
+const SCENES_BASE = (process.env.UNTANGLE_SCENES_BASE || 'https://cdn.jsdelivr.net/gh/theprototype-app/scenes@format-2').replace(/\/$/, '');
+const MODULES_BASE = (process.env.UNTANGLE_MODULES_BASE || 'https://cdn.jsdelivr.net/gh/theprototype-app/modules@main').replace(/\/$/, '');
+const ROOT = path.resolve(__dirname, '../../..');
+const TEMPLATE_LEVEL = 2;
+
+async function fetchBytes(url) {
+	try {
+		const res = await fetch(url, { signal: AbortSignal.timeout(20000) });
+		if (!res.ok) {
+			console.log('  (source) ' + url + ' -> HTTP ' + res.status);
+			return null;
+		}
+		return Buffer.from(await res.arrayBuffer());
+	} catch (error) {
+		console.log('  (source) ' + url + ' -> ' + error.message);
+		return null;
+	}
+}
+async function sceneBytes() {
+	if (process.env.UNTANGLE_TPSCENE) {
+		const p = process.env.UNTANGLE_TPSCENE;
+		return fs.existsSync(p) ? { bytes: fs.readFileSync(p), from: p } : null;
+	}
+	const feed = await fetchBytes(SCENES_BASE + '/games/untangle/scene.tpscene');
+	if (feed) return { bytes: feed, from: SCENES_BASE };
+	for (const dir of ['theprototype.app-scenes', 'scenes']) {
+		const p = path.join(ROOT, dir, 'games/untangle/scene.tpscene');
+		if (fs.existsSync(p)) return { bytes: fs.readFileSync(p), from: p };
+	}
+	return null;
+}
+async function zipBytes() {
+	if (process.env.UNTANGLE_ZIP) {
+		const p = process.env.UNTANGLE_ZIP;
+		return fs.existsSync(p) ? { bytes: fs.readFileSync(p), from: p } : null;
+	}
+	const local = [];
+	if (process.env.MODULES_REPO) local.push(path.join(process.env.MODULES_REPO, 'untangle.zip'));
+	local.push(h.moduleZipPath('untangle'));
+	for (const dir of fs.readdirSync(ROOT)) if (/^(theprototype\.app-)?modules/.test(dir)) local.push(path.join(ROOT, dir, 'untangle.zip'));
+	for (const p of local) if (p && fs.existsSync(p)) return { bytes: fs.readFileSync(p), from: p };
+	const cdn = await fetchBytes(MODULES_BASE + '/untangle.zip');
+	return cdn ? { bytes: cdn, from: MODULES_BASE } : null;
+}
+async function installZip(peer, bytes, label) {
+	await peer.page.evaluate(() => window.__stores.modulesOpen.set(true));
+	await peer.page.waitForTimeout(400);
+	await peer.page.getByRole('tab', { name: /^User/ }).click();
+	await peer.page.waitForTimeout(200);
+	await peer.page.locator('#install-module-zip').setInputFiles({ name: 'untangle.zip', mimeType: 'application/zip', buffer: bytes });
+	await h.eventually(
+		() => peer.page.evaluate(() => window.__stores.moduleSDK.loadedModules.map((m) => m.id)),
+		(ids) => ids.includes('untangle'),
+		label + ': the untangle module installed from the real zip',
+		20000
+	);
+	await peer.page.evaluate(() => window.__stores.modulesOpen.set(false));
+	await peer.page.waitForTimeout(300);
+}
+
+
+const GROUP = 'untangle-module';
+const objectCount = (page) =>
+	page.evaluate(() => {
+		let g;
+		window.__stores.objectsGroup.subscribe((v) => (g = v))();
+		let n = 0;
+		g.traverse(() => n++);
+		return n;
+	});
+const debug = (page) => page.evaluate(() => window.__stores.moduleSDK.moduleContentDebug());
+
+h.run(async () => {
+	const scene = await sceneBytes();
+	if (!scene) {
+		console.log('SKIP: games/untangle/scene.tpscene unreachable');
+		return;
+	}
+	const zip = await zipBytes();
+	if (!zip) {
+		console.log('SKIP: untangle.zip unreachable');
+		return;
+	}
+	console.log('  scene from ' + scene.from + ' / module from ' + zip.from);
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const B = await h.setupPage(browser, 'B');
+	const page = A.page;
+	await installZip(A, zip.bytes, 'A');
+	await installZip(B, zip.bytes, 'B');
+	await page.evaluate(async (arr) => {
+		const s = window.__stores;
+		await s.sessions.applySession(await s.sessions.readSessionZip(new Uint8Array(arr).buffer), { backup: false });
+	}, Array.from(scene.bytes));
+	await h.eventually(
+		() => page.evaluate((g) => {
+			let sc;
+			window.__stores.globalScene.subscribe((v) => (sc = v))();
+			return sc?.getObjectByName(g)?.children.filter((c) => c.name.startsWith('untangle-dot-')).length ?? 0;
+		}, GROUP),
+		(n) => n > 0,
+		'(premise) the untangle board is built at the scene root'
+	);
+	await h.connect(A, B);
+	await page.waitForTimeout(1500);
+
+	// ---------------------------------------------------------------- 1
+	console.log('\n=== 1. the section lists the board, read-only ===');
+	await page.evaluate(() => window.__stores.objectListClose.set(false));
+	await page.waitForTimeout(1500);
+	const row = page.locator(`#module-content .module-content-row[data-group="${GROUP}"]`);
+	h.check((await row.count()) === 1, '1.1 the object list has a Module content row for the untangle board');
+	const label = ((await row.locator('.module-content-name').textContent()) ?? '').trim();
+	h.check(/untangle/i.test(label), `1.2 ...labelled for a person (${label})`);
+	const badge = ((await row.locator('.module-content-badge').textContent()) ?? '').trim();
+	h.check(/untangle/i.test(badge), `1.3 ...with the module's name as its badge (${badge})`);
+	await row.locator('button[aria-label="Show children"]').click();
+	await page.waitForTimeout(300);
+	const kids = await row.locator('.module-content-child').allTextContents();
+	h.check(kids.some((t) => t.trim().startsWith('untangle-dot-')), `1.4 expanding it lists the dots (${kids.length} named parts)`);
+	// the tree above is untouched: the board is NOT a scene row
+	const sceneRows = await page.evaluate((g) => [...document.querySelectorAll('#object-tree [role="treeitem"]')].some((el) => el.textContent.includes(g)), GROUP);
+	h.check(!sceneRows, '1.5 the board is not smuggled into the scene tree');
+	await row.click({ button: 'right' });
+	await page.waitForTimeout(300);
+	const menu = await page.evaluate(() => [...document.querySelectorAll('[role="menuitem"]')].map((el) => el.textContent.trim()));
+	h.check(menu.includes('Frame it') && !menu.some((t) => /delete|rename|duplicate/i.test(t)), `1.6 its menu is read-only (${menu.join(' | ')})`);
+	await page.keyboard.press('Escape');
+	await page.waitForTimeout(200);
+
+	// ---------------------------------------------------------------- 2
+	console.log('\n=== 2. a click selects a PROXY and frames it ===');
+	const countsA = await objectCount(page);
+	const countsB = await objectCount(B.page);
+	const camBefore = await page.evaluate(() => {
+		let c;
+		window.__stores.globalCamera.subscribe((v) => (c = v))();
+		return c.position.toArray();
+	});
+	await row.locator('.module-content-name').click();
+	await page.waitForTimeout(900);
+	const d = await debug(page);
+	h.check(d.selection?.name === GROUP, `2.1 the proxy selection names the board (${d.selection?.name})`);
+	h.check(d.proxyInScene, '2.2 the proxy box is in the scene');
+	const inside = await page.evaluate((g) => {
+		const s = window.__stores;
+		let sc;
+		s.globalScene.subscribe((v) => (sc = v))();
+		const box = new s.THREE.Box3().setFromObject(sc.getObjectByName(g));
+		const proxy = sc.getObjectByName('module-content-proxy');
+		return !!proxy && proxy.parent === sc && proxy.box.containsBox(box.expandByScalar(-1e-4));
+	}, GROUP);
+	h.check(inside, '2.3 ...at the SCENE ROOT, sized to the board\'s bounds');
+	const camAfter = await page.evaluate(() => {
+		let c;
+		window.__stores.globalCamera.subscribe((v) => (c = v))();
+		return c.position.toArray();
+	});
+	h.check(Math.hypot(...camAfter.map((v, i) => v - camBefore[i])) > 0.2, '2.4 the camera framed it');
+	const card = ((await page.locator('#module-content-card').textContent().catch(() => '')) ?? '').trim();
+	h.check(/untangle/i.test(card) && /module/i.test(card), `2.5 the Inspector shows whose it is (${card.slice(0, 80)})`);
+	const sel = await page.evaluate(() => {
+		let v;
+		window.__stores.selectedObjects.subscribe((x) => (v = x))();
+		return v.length;
+	});
+	h.check(sel === 0, '2.6 the object SELECTION stays empty (the proxy never joins the set)');
+
+	// ---------------------------------------------------------------- 3
+	console.log('\n=== 3. the proxy never replicates and never saves ===');
+	h.check((await objectCount(page)) === countsA, `3.1 objectsGroup unchanged on A (${countsA})`);
+	await page.waitForTimeout(1200);
+	h.check((await objectCount(B.page)) === countsB, `3.2 ...and on the peer (${countsB})`);
+	const saved = await page.evaluate(() => JSON.stringify(window.__stores.sessions.buildSessionPayload('probe')));
+	h.check(!saved.includes('module-content-proxy'), '3.3 a saved payload does not contain the proxy');
+	const onB = await B.page.evaluate(() => {
+		let sc;
+		window.__stores.globalScene.subscribe((v) => (sc = v))();
+		return !!sc.getObjectByName('module-content-proxy');
+	});
+	h.check(!onB, '3.4 the peer has no proxy');
+
+	// ---------------------------------------------------------------- 4
+	console.log('\n=== 4. a deselect puts it away ===');
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.waitForTimeout(300);
+	const gone = await debug(page);
+	h.check(!gone.proxyInScene && !gone.selection, '4.1 deselect clears the proxy and the selection');
+
+	// ---------------------------------------------------------------- 5
+	console.log('\n=== 5. in the VIEWPORT: an Edit click on the board selects its proxy; Interact plays ===');
+	await page.evaluate(() => window.__stores.inspectorClose.set(true));
+	// 30 integrate: flyTo(..., 0) is a jump — even on a frame whose rAF timestamp precedes the
+	// call (the race that parked the camera at -Infinity/NaN for a frame, mod-audit's finding)
+	const jump = await page.evaluate(
+		() =>
+			new Promise((resolve) => {
+				const s = window.__stores;
+				let cam;
+				s.globalCamera.subscribe((v) => (cam = v))();
+				const raf = window.requestAnimationFrame;
+				window.requestAnimationFrame = (cb) => {
+					window.requestAnimationFrame = raf;
+					return raf(() => {
+						cb(performance.now() - 20);
+						resolve(cam.position.toArray());
+					});
+				};
+				s.objectActions.flyTo([1, 2.5, 6], [0, 1, 0], 0);
+			})
+	);
+	h.check(jump.every(Number.isFinite) && Math.hypot(jump[0] - 1, jump[1] - 2.5, jump[2] - 6) < 0.05, `5.0 flyTo(…, 0) lands in one frame, finite (${jump.map((v) => +v.toFixed(3))})`);
+	await page.evaluate((g) => {
+		const s = window.__stores;
+		let sc;
+		s.globalScene.subscribe((v) => (sc = v))();
+		const box = new s.THREE.Box3().setFromObject(sc.getObjectByName(g));
+		const c = box.getCenter(new s.THREE.Vector3());
+		s.objectActions.flyTo([c.x, c.y + 0.4, c.z + 3.2], c.toArray(), 0);
+	}, GROUP);
+	await page.waitForTimeout(900);
+	const dot = await page.evaluate((g) => {
+		const s = window.__stores;
+		let sc, camera, renderer;
+		s.globalScene.subscribe((v) => (sc = v))();
+		s.globalCamera.subscribe((v) => (camera = v))();
+		s.globalRenderer.subscribe((v) => (renderer = v))();
+		const root = sc.getObjectByName(g);
+		const target = root.children.find((c) => c.name.startsWith('untangle-dot-'));
+		const p = target.getWorldPosition(new s.THREE.Vector3());
+		const v = p.clone().project(camera);
+		const rect = renderer.domElement.getBoundingClientRect();
+		const x = rect.left + ((v.x + 1) / 2) * rect.width;
+		const y = rect.top + ((1 - v.y) / 2) * rect.height;
+		const ray = new s.THREE.Raycaster();
+		ray.setFromCamera(new s.THREE.Vector2(v.x, v.y), camera);
+		const hit = ray.intersectObject(root, true)[0];
+		let n = hit?.object;
+		while (n && n.parent !== root) n = n.parent;
+		return { x, y, hitsBoard: !!hit, name: n?.name ?? null, onCanvas: document.elementFromPoint(x, y) === renderer.domElement };
+	}, GROUP);
+	h.check(dot.hitsBoard && dot.onCanvas, `5.1 (premise) the pixel lands on the board (${dot.name})`);
+	await page.evaluate(() => {
+		window.__stores.objectActions.deselectObject();
+		window.__stores.objectActions.setEditorMode('edit');
+	});
+	await page.waitForTimeout(1700);
+	await page.mouse.click(dot.x, dot.y);
+	await page.waitForTimeout(500);
+	const edit = await debug(page);
+	h.check(edit.selection?.name === GROUP, `5.2 an EDIT click on the board selects its proxy (${edit.selection?.name ?? 'nothing'})`);
+	await page.evaluate(() => {
+		window.__stores.objectActions.deselectObject();
+		window.__stores.objectActions.setEditorMode('interact');
+	});
+	await page.waitForTimeout(1700);
+	await page.mouse.click(dot.x, dot.y);
+	await page.waitForTimeout(500);
+	const inter = await debug(page);
+	h.check(!inter.selection, '5.3 in INTERACT the same click selects nothing (it belongs to the module)');
+	await page.mouse.click(dot.x + 200, dot.y + 150); // drop whatever the module picked up
+	await page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+
+	h.check(h.pageErrors(A).length === 0, `the page threw nothing (${h.pageErrors(A).join(' / ')})`);
+	await h.finish(browser);
+});
diff --git a/tests/e2e/object-sync.test.cjs b/tests/e2e/object-sync.test.cjs
index 9173dd08..14c4b8f2 100644
--- a/tests/e2e/object-sync.test.cjs
+++ b/tests/e2e/object-sync.test.cjs
@@ -66,7 +66,10 @@ const spyConns = (peer) =>
 const diag = (peer) => peer.page.evaluate(() => window.__diag || null);
 
 h.run(async () => {
-	const browser = await h.launch();
+	// GPU backend: three SOFTWARE-GL pages boot the third one past setupPage's 30 s on the 1.17
+	// union (the first two saturate the shared SwiftShader process; the programs, draw calls and
+	// boot script are identical to 1.17 round 1 — measured, 30b-integrate) — the newer suites' rule
+	const browser = await h.launch({ args: h.GPU_ARGS });
 	const A = await h.setupPage(browser, 'A');
 	await instrument(A, 'A');
 
diff --git a/tests/e2e/pack-refs.test.cjs b/tests/e2e/pack-refs.test.cjs
new file mode 100644
index 00000000..19cee2c7
--- /dev/null
+++ b/tests/e2e/pack-refs.test.cjs
@@ -0,0 +1,291 @@
+// 30c — KIT REFERENCES (src/lib/packRefs.js): a piece placed from a pack carries where it
+// came from, and a save / the wire write a PRISTINE one as a small stub that the loader and
+// every peer refill from the pack URL.
+//
+// The fixture is the bundled Duck (static/library/default/Duck — always served by the dev
+// server, nested nodes + a texture) addressed by an ABSOLUTE url, so the suite needs no pack
+// server; when the dev server's PACKS_BASE serves the architecture kit (VITE_PACKS_BASE), a
+// last section measures a real kit wall too, and SKIPS (never fails) without it.
+//
+//   APP_URL=https://theprototype.app:5255/ node tests/e2e/pack-refs.test.cjs
+const h = require('./helpers.cjs');
+
+const DUCK = 'library/default/Duck/glTF-Binary/Duck.glb';
+
+/** Poll until `predicate` holds and RETURN the last value (h.eventually returns nothing). */
+async function until(fn, predicate, label, timeout = 10000) {
+	const start = Date.now();
+	let last;
+	while (Date.now() - start < timeout) {
+		last = await fn();
+		if (predicate(last)) {
+			h.check(true, label);
+			return last;
+		}
+		await new Promise((r) => setTimeout(r, 400));
+	}
+	console.log('  last: ' + JSON.stringify(last)?.slice(0, 600));
+	h.check(false, label);
+	return last;
+}
+
+/** Place the fixture through the REAL drop path (explorerDrop.dropExplorerItem with a pack
+ * payload), at the canvas centre. Resolves the placed root's uuid. */
+async function place(peer, name = 'Duck') {
+	return peer.page.evaluate(
+		async ({ path, name }) => {
+			const s = window.__stores;
+			/** @type {any} */ let g;
+			s.objectsGroup.subscribe((v) => (g = v))();
+			const before = new Set(g.children.map((/** @type {any} */ c) => c.uuid));
+			/** @type {any} */ let renderer;
+			s.globalRenderer.subscribe((v) => (renderer = v))();
+			const r = renderer.domElement.getBoundingClientRect();
+			await s.explorerDrop.dropExplorerItem({ kind: 'object', name, url: location.origin + '/' + path }, r.left + r.width / 2, r.top + r.height / 2);
+			for (let i = 0; i < 100; i++) {
+				const fresh = g.children.find((/** @type {any} */ c) => !before.has(c.uuid));
+				if (fresh) return fresh.uuid;
+				await new Promise((res) => setTimeout(res, 100));
+			}
+			return null;
+		},
+		{ path: DUCK, name }
+	);
+}
+
+/** Facts about one root in a page. */
+function facts(peer, uuid) {
+	return peer.page.evaluate((uuid) => {
+		const s = window.__stores;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const o = g.getObjectByProperty('uuid', uuid);
+		if (!o) return null;
+		let tris = 0;
+		const kids = [];
+		o.traverse((/** @type {any} */ n) => {
+			if (n !== o) kids.push(n.uuid);
+			if (n.isMesh) tris += (n.geometry.index ? n.geometry.index.count : n.geometry.attributes.position.count) / 3;
+		});
+		return {
+			ref: o.userData.packRef ?? null,
+			stub: !!o.userData.packStub,
+			children: o.children.length,
+			kids,
+			tris,
+			pos: o.position.toArray().map((v) => Math.round(v * 1000) / 1000),
+			pristine: s.packRefs.isPristinePackRef(o)
+		};
+	}, uuid);
+}
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+
+	// ---- 1. a placement carries its reference ------------------------------------
+	const duck = await place(A);
+	h.check(!!duck, 'the pack payload placed an object through the real drop path');
+	const f1 = await facts(A, duck);
+	h.check(f1?.ref?.path?.endsWith(DUCK) && /^[0-9a-f]{64}$/.test(f1?.ref?.hash ?? ''), `the root carries packRef {path, hash} (${f1?.ref?.path} ${f1?.ref?.hash?.slice(0, 8)})`);
+	h.check(Array.isArray(f1?.ref?.kids) && f1.ref.kids.join() === f1.kids.join() && f1.kids.length > 0, `packRef.kids records the descendants in traverse order (${f1?.kids?.length})`);
+	h.check(f1?.pristine === true, 'a fresh placement is pristine');
+
+	// ---- 2. the save writes a stub, a fraction of the full element ----------------
+	const saved = await A.page.evaluate((uuid) => {
+		const s = window.__stores;
+		const payload = s.sessions.buildSessionPayload('refs');
+		const el = payload.objects.find((/** @type {any} */ e) => e.object?.uuid === uuid);
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const full = JSON.stringify(g.getObjectByProperty('uuid', uuid).toJSON()).length;
+		return { stub: !!el?.object?.userData?.packStub, kids: el?.object?.children?.length ?? 0, bytes: JSON.stringify(el).length, full };
+	}, duck);
+	h.check(saved.stub && saved.kids === 0, 'buildSessionPayload writes the pristine piece as a hollow stub');
+	h.check(saved.bytes < 4000 && saved.full > saved.bytes * 20, `the stub is ${saved.bytes} B against a ${saved.full} B full element`);
+
+	// ---- 3. an EDITED piece is written in full ------------------------------------
+	const edited = await A.page.evaluate(async (uuid) => {
+		const s = window.__stores;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const o = g.getObjectByProperty('uuid', uuid);
+		let mesh = null;
+		o.traverse((/** @type {any} */ n) => {
+			if (n.isMesh && !mesh) mesh = n;
+		});
+		const out = {};
+		// a colour change
+		const was = mesh.material.color.getHex();
+		mesh.material.color.setHex(0x00ff00);
+		out.color = s.packRefs.isPristinePackRef(o);
+		mesh.material.color.setHex(was);
+		out.colorBack = s.packRefs.isPristinePackRef(o);
+		// a vertex moved in place (the vertex-drag / sculpt path)
+		const pa = mesh.geometry.attributes.position;
+		const y = pa.getY(0);
+		pa.setY(0, y + 0.25);
+		out.vertex = s.packRefs.isPristinePackRef(o);
+		const payload = s.sessions.buildSessionPayload('edited');
+		const el = payload.objects.find((/** @type {any} */ e) => e.object?.uuid === uuid);
+		out.savedFull = !el.object.userData?.packStub && (el.object.children?.length ?? 0) > 0;
+		pa.setY(0, y);
+		out.vertexBack = s.packRefs.isPristinePackRef(o);
+		// a child moved inside the piece
+		mesh.position.x += 0.5;
+		mesh.updateMatrix();
+		out.child = s.packRefs.isPristinePackRef(o);
+		mesh.position.x -= 0.5;
+		mesh.updateMatrix();
+		// the ROOT moved — that is the placement, and rides the stub
+		o.position.x += 3;
+		o.updateMatrix();
+		out.root = s.packRefs.isPristinePackRef(o);
+		return out;
+	}, duck);
+	h.check(edited.color === false && edited.colorBack === true, `a colour change makes it NOT pristine, and undoing it restores it (${edited.color}/${edited.colorBack})`);
+	h.check(edited.vertex === false && edited.savedFull === true && edited.vertexBack === true, `an in-place vertex edit is NOT pristine and saves IN FULL (${edited.vertex}/${edited.savedFull}/${edited.vertexBack})`);
+	h.check(edited.child === false, 'a moved child inside the piece is NOT pristine');
+	h.check(edited.root === true, 'moving the root is the placement: still pristine');
+
+	// ---- 4. a load refills stubs; copies share their textures ---------------------
+	const second = await place(A, 'Duck 2');
+	const loaded = await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const payload = s.sessions.buildSessionPayload('two');
+		const stubs = payload.objects.filter((/** @type {any} */ e) => e.object?.userData?.packStub).length;
+		await s.sessions.applySession(payload, { backup: false });
+		await new Promise((r) => setTimeout(r, 200));
+		await s.packRefs.packRefsSettled();
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const maps = new Set();
+		const geos = new Set();
+		const mats = new Set();
+		let filled = 0;
+		for (const c of g.children) {
+			if (!c.userData.packRef) continue;
+			if (!c.userData.packStub && c.children.length) filled++;
+			c.traverse((/** @type {any} */ n) => {
+				if (!n.isMesh) return;
+				geos.add(n.geometry);
+				mats.add(n.material);
+				if (n.material.map) maps.add(n.material.map);
+			});
+		}
+		return { stubs, filled, maps: maps.size, geos: geos.size, mats: mats.size, names: payload.objects.map((/** @type {any} */ e) => e.object.name) };
+	});
+	h.check(loaded.stubs === 2, `both copies saved as stubs (${loaded.stubs})`);
+	h.check(loaded.filled === 2, `applySession refilled both (${loaded.filled})`);
+	h.check(loaded.maps === 1, `the two copies SHARE one texture (${loaded.maps} distinct maps)`);
+	h.check(loaded.geos === 2 && loaded.mats === 2, `...but each owns its geometry and material, so an edit to one cannot move the other (${loaded.geos}/${loaded.mats})`);
+	const f4 = await facts(A, duck);
+	h.check(f4 && f4.kids.join() === f1.kids.join(), 'the refilled piece takes the RECORDED child uuids');
+	h.check(f4 && Math.abs(f4.pos[0] - (f1.pos[0] + 3)) < 1e-3, `the stub kept the root's placement (x ${f4?.pos?.[0]})`);
+	h.check(f4 && f4.tris === f1.tris && f4.pristine === true, `the refill is the file again: ${f4?.tris} tris, pristine ${f4?.pristine}`);
+
+	// ---- 5. an autosave-style GLTF round trip re-learns pristine ------------------
+	const round = await A.page.evaluate(async (uuid) => {
+		const s = window.__stores;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const o = g.getObjectByProperty('uuid', uuid);
+		const Exporter = s.GLTFExporterModule.GLTFExporter;
+		const glb = await new Promise((res, rej) => new Exporter().parse(o, res, rej, { binary: true, onlyVisible: false }));
+		const gltf = await new Promise((res, rej) => s.animatedImports.createGltfLoader().parse(glb, '', res, rej));
+		const back = gltf.scene.children[0];
+		const la = s.packRefs.fingerprintOf(o).key.split('\n');
+		const lb = s.packRefs.fingerprintOf(back).key.split('\n');
+		const diff = la.map((line, i) => (line === lb[i] ? null : [line.slice(0, 300), (lb[i] ?? '').slice(0, 300)])).filter(Boolean);
+		return { hasRef: !!back.userData?.packRef, pristine: s.packRefs.isPristinePackRef(back), diff: diff.slice(0, 2), n: [la.length, lb.length] };
+	}, duck);
+	h.check(round.hasRef, 'packRef rides GLTF extras (the autosave path)');
+	h.check(round.pristine === true, `after a GLTF round trip (re-encoded textures) the piece still reads pristine (${round.pristine})`);
+	if (!round.pristine) console.log('  diff ' + JSON.stringify(round.diff) + ' lines ' + round.n);
+
+	// ---- 6. an unreachable pack keeps the reference -------------------------------
+	const lost = await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const T = s.THREE;
+		const hollow = new T.Group();
+		hollow.name = 'Lost piece';
+		hollow.userData = { packRef: { pack: 'nowhere', item: 'Ghost', path: location.origin + '/no/such/piece.glb', hash: 'x', kids: [] }, packStub: true };
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		g.add(hollow);
+		s.pokeScene();
+		await new Promise((r) => setTimeout(r, 300));
+		await s.packRefs.packRefsSettled();
+		const payload = s.sessions.buildSessionPayload('lost');
+		const el = payload.objects.find((/** @type {any} */ e) => e.object?.uuid === hollow.uuid);
+		return { children: hollow.children.length, stillStub: !!hollow.userData.packStub, savedStub: !!el?.object?.userData?.packStub, path: el?.object?.userData?.packRef?.path, uuid: hollow.uuid };
+	});
+	h.check(lost.children === 0 && lost.stillStub, 'an unreachable piece stays a hollow stub');
+	h.check(lost.savedStub && /no\/such\/piece\.glb$/.test(lost.path ?? ''), 'and SAVES back as the same reference — never silently dropped');
+	await A.page.evaluate((uuid) => {
+		const s = window.__stores;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const o = g.getObjectByProperty('uuid', uuid);
+		o?.parent?.remove(o);
+		s.pokeScene();
+	}, lost.uuid);
+
+	// ---- 7. two peers: a late joiner and a live placement -------------------------
+	const B = await h.setupPage(browser, 'B');
+	await h.connect(B, A);
+	const joined = await until(
+		() => Promise.all([facts(B, duck), facts(B, second)]),
+		(r) => r.every((f) => f && !f.stub && f.children > 0),
+		'the late joiner refilled both pieces from their pack',
+		20000
+	);
+	h.check(joined[0]?.kids.join() === f1.kids.join(), 'the joiner has the same child uuids');
+	h.check(joined[0]?.tris === f1.tris, `the joiner has the same geometry (${joined[0]?.tris} tris)`);
+	const wire = await A.page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any} */ const p = (() => { let v; s.peers.subscribe((x) => (v = x))(); return v; })();
+		/** @type {any[]} */ const sent = [];
+		const orig = p.send.bind(p);
+		p.send = (msg) => {
+			sent.push({ type: msg.type, bytes: JSON.stringify(msg).length, stub: !!msg.element?.object?.userData?.packStub });
+			return orig(msg);
+		};
+		window.__refSent = sent;
+		return true;
+	});
+	h.check(wire, 'a wire spy wraps A.peers.send');
+	const third = await place(A, 'Duck 3');
+	const live = await until(() => facts(B, third), (f) => f && !f.stub && f.children > 0, 'peer B refilled a LIVE placement', 20000);
+	h.check(live?.ref?.hash === f1.ref.hash, 'B built it from the same bytes (hash)');
+	const spied = await A.page.evaluate(() => window.__refSent.filter((m) => m.type === 'object'));
+	h.check(spied.length === 1 && spied[0].stub && spied[0].bytes < 4000, `the placement crossed the wire as ONE stub message (${JSON.stringify(spied)})`);
+
+	// ---- 8. a real kit wall, when this server's PACKS_BASE serves the architecture kit
+	const kit = await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const url = String(s.packs.PACKS_BASE).replace(/\/+$/, '') + '/architecture-kit/WallStone/glTF-Binary/wall-stone.glb';
+		const res = await fetch(url).catch(() => null);
+		if (!res?.ok) return null;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const before = new Set(g.children.map((/** @type {any} */ c) => c.uuid));
+		await s.explorerDrop.dropExplorerItem({ kind: 'object', name: 'WallStone', url }, innerWidth / 2, innerHeight / 2);
+		let o = null;
+		for (let i = 0; i < 100 && !o; i++) {
+			o = g.children.find((/** @type {any} */ c) => !before.has(c.uuid)) ?? null;
+			if (!o) await new Promise((r) => setTimeout(r, 100));
+		}
+		if (!o) return { placed: false };
+		const payload = s.sessions.buildSessionPayload('kit');
+		const el = payload.objects.find((/** @type {any} */ e) => e.object?.uuid === o.uuid);
+		return { placed: true, path: o.userData.packRef?.path, stub: JSON.stringify(el).length, full: JSON.stringify(o.toJSON()).length };
+	});
+	if (!kit) console.log('SKIP the architecture kit is not served by this build (set VITE_PACKS_BASE)');
+	else {
+		h.check(kit.placed && kit.path === 'architecture-kit/WallStone/glTF-Binary/wall-stone.glb', `a kit wall carries a PACKS_BASE-relative path (${kit.path})`);
+		h.check(kit.stub < 4000 && kit.full > 1_000_000, `a kit wall saves as ${kit.stub} B instead of ${kit.full} B`);
+	}
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/pack-undo.test.cjs b/tests/e2e/pack-undo.test.cjs
new file mode 100644
index 00000000..52e4cdba
--- /dev/null
+++ b/tests/e2e/pack-undo.test.cjs
@@ -0,0 +1,138 @@
+// 30b integrate — placing kit pieces is UNDOABLE, by reference.
+//
+// A piece placed from a pack was recorded in history as its full toJSON — a 0.8 MB
+// architecture-kit wall is ~7.9 MB that way (its JPEGs come back as PNG data URLs), past
+// history's 5 MB snapshot limit, so every placement toasted "Object is too large for undo
+// history" and a level built from the kits had no undo at all. history now asks a
+// registered provider first (packRefs: a PRISTINE piece -> its stub) and keeps THAT; undo
+// removes the piece, redo adds the stub back and the scene's stub scan refills it from the
+// pack, with the recorded child uuids.
+//
+// Fixture: the bundled Duck (always served, addressed by an absolute url — the pack-refs
+// suite's fixture), placed TEN times through the real drop path. A last section places a
+// real architecture-kit wall when KIT_URL names one (e.g. a jsDelivr url of the packs repo)
+// and SKIPS without it.
+//
+//   APP_URL=https://theprototype.app:5239/ [KIT_URL=https://…/WallStone.glb] node tests/e2e/pack-undo.test.cjs
+const h = require('./helpers.cjs');
+
+const DUCK = 'library/default/Duck/glTF-Binary/Duck.glb';
+
+async function place(peer, url, name) {
+	return peer.page.evaluate(
+		async ({ url, name }) => {
+			const s = window.__stores;
+			/** @type {any} */ let g;
+			s.objectsGroup.subscribe((v) => (g = v))();
+			const before = new Set(g.children.map((c) => c.uuid));
+			/** @type {any} */ let renderer;
+			s.globalRenderer.subscribe((v) => (renderer = v))();
+			const r = renderer.domElement.getBoundingClientRect();
+			await s.explorerDrop.dropExplorerItem({ kind: 'object', name, url }, r.left + r.width / 2, r.top + r.height / 2);
+			for (let i = 0; i < 200; i++) {
+				const fresh = g.children.find((c) => !before.has(c.uuid));
+				if (fresh) return fresh.uuid;
+				await new Promise((res) => setTimeout(res, 100));
+			}
+			return null;
+		},
+		{ url, name }
+	);
+}
+
+/** the scene's roots that carry a pack reference, with their refill state */
+const pieces = (peer) =>
+	peer.page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any} */ let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		return g.children
+			.filter((o) => o.userData.packRef)
+			.map((o) => {
+				let tris = 0;
+				o.traverse((n) => {
+					if (n.isMesh) tris += (n.geometry.index ? n.geometry.index.count : n.geometry.attributes.position.count) / 3;
+				});
+				return { uuid: o.uuid, stub: !!o.userData.packStub, tris, kids: o.children.length };
+			});
+	});
+
+/** the create entries on the undo stack, with the size of what each one keeps */
+const createEntries = (peer) =>
+	peer.page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any[]} */ let stack = [];
+		s.history.undoStack.subscribe((v) => (stack = v))();
+		return stack
+			.filter((e) => e.kind === 'create')
+			.map((e) => ({ uuid: e.uuid, bytes: JSON.stringify(e.snapshot.element).length, stub: !!e.snapshot.element?.object?.userData?.packStub }));
+	});
+
+const toasts = (peer) =>
+	peer.page.evaluate(() => {
+		const s = window.__stores;
+		/** @type {any[]} */ let list = [];
+		(s.notifications ?? s.toastStore).subscribe((v) => (list = v))();
+		return (list || []).map((t) => String(t.message ?? t.text ?? t)).filter((m) => /too large for undo/i.test(m)).length;
+	});
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	const url = await A.page.evaluate((p) => location.origin + '/' + p, DUCK);
+
+	// 1. TEN placements, each a create entry that keeps the STUB -------------------------
+	const placed = [];
+	for (let i = 0; i < 10; i++) placed.push(await place(A, url, 'Duck'));
+	h.check(placed.every(Boolean) && new Set(placed).size === 10, `premise: ten kit pieces placed through the real drop path (${placed.filter(Boolean).length})`);
+	const filled = await pieces(A);
+	const tris0 = filled[0]?.tris ?? 0;
+	h.check(filled.length === 10 && filled.every((p) => !p.stub && p.tris > 0), `premise: all ten are filled pieces (${filled.map((p) => p.tris).join(',')} tris)`);
+	const entries = await createEntries(A);
+	const mine = entries.filter((e) => placed.includes(e.uuid));
+	h.check(mine.length === 10, `each placement recorded ONE create entry (${mine.length})`);
+	h.check(
+		mine.every((e) => e.stub && e.bytes < 4000),
+		`THE FIX: each entry keeps the piece as its STUB, not its bytes (${mine.map((e) => e.bytes).join(',')} B)`
+	);
+
+	// 2. undo all ten -------------------------------------------------------------------
+	for (let i = 0; i < 10; i++) await A.page.evaluate(() => window.__stores.history.undo());
+	await h.eventually(() => pieces(A), (p) => p.length === 0, 'undo x10 removes every piece', 8000);
+
+	// 3. redo all ten: back as stubs, refilled from the pack under the SAME uuids ---------
+	for (let i = 0; i < 10; i++) await A.page.evaluate(() => window.__stores.history.redo());
+	await h.eventually(
+		() => pieces(A),
+		(p) => p.length === 10 && p.every((x) => !x.stub && x.tris === tris0),
+		'redo x10 restores every piece, refilled from the pack (same triangle count)',
+		20000
+	);
+	const back = await pieces(A);
+	h.check(placed.every((u) => back.some((p) => p.uuid === u)), 'the restored pieces keep their uuids');
+
+	// 4. and once more round the loop (redo recaptured each snapshot on its way out) -------
+	for (let i = 0; i < 10; i++) await A.page.evaluate(() => window.__stores.history.undo());
+	await h.eventually(() => pieces(A), (p) => p.length === 0, 'a second undo x10 still removes them all', 8000);
+	for (let i = 0; i < 10; i++) await A.page.evaluate(() => window.__stores.history.redo());
+	await h.eventually(() => pieces(A), (p) => p.length === 10 && p.every((x) => !x.stub), 'a second redo x10 still restores them all', 20000);
+
+	// 5. a REAL kit wall (7.9 MB as toJSON): no "too large" toast, and it undoes ----------
+	const kit = process.env.KIT_URL;
+	if (!kit) {
+		console.log('SKIP a real kit wall (set KIT_URL to an architecture-kit GLB)');
+	} else {
+		const t0 = await toasts(A);
+		const wall = await place(A, kit, 'WallStone');
+		h.check(!!wall, 'premise: a real architecture-kit wall placed');
+		const e = (await createEntries(A)).find((x) => x.uuid === wall);
+		h.check(!!e && e.stub && e.bytes < 4000, `the wall's undo entry is its stub (${e && e.bytes} B)`);
+		h.check((await toasts(A)) === t0, 'no "too large for undo history" toast for the wall');
+		await A.page.evaluate(() => window.__stores.history.undo());
+		await h.eventually(() => pieces(A), (p) => !p.some((x) => x.uuid === wall), 'undo removes the wall', 8000);
+		await A.page.evaluate(() => window.__stores.history.redo());
+		await h.eventually(() => pieces(A), (p) => p.some((x) => x.uuid === wall && !x.stub && x.tris > 500), 'redo brings the wall back, refilled', 30000);
+	}
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/play-free-cursor.test.cjs b/tests/e2e/play-free-cursor.test.cjs
new file mode 100644
index 00000000..a5d5bb73
--- /dev/null
+++ b/tests/e2e/play-free-cursor.test.cjs
@@ -0,0 +1,272 @@
+// 30 P3 — FREE-CURSOR GAMES + NO EDITOR GRID IN PLAY (roadmap 30 fork 6).
+//
+// `scenePhysics.play.cursor: 'free'` enters play WITHOUT a pointer lock: the real cursor
+// stays visible and AIMS — a tap fires On Click at the object under the cursor, a
+// press-drag carries a dynamic body along the cursor ray — while the crosshair has nothing
+// to draw. The field is OMITTED at its default, so a scene that never uses it saves
+// byte-identically. Independently, the editor grid is never drawn in play (either cursor).
+//
+// Real input throughout: page.mouse at an object's PROJECTED pixel, with each target placed
+// OFF the view centre, so the crosshair ray (NDC 0,0) would miss it — a pass here cannot be
+// the old aim getting lucky.
+const h = require('./helpers.cjs');
+
+/** @param {any} page @param {string} body */
+const sp = (page, body) => page.evaluate((b) => new Function('sp', b)(window.__stores.scenePhysics), body);
+
+/** place an object in front of the ACTIVE camera, offset sideways (camera right) and up
+ * @param {any} page @param {string} uuid @param {number} ahead @param {number} right @param {number} [up] */
+const placeInView = (page, uuid, ahead, right, up = 0) =>
+	page.evaluate(
+		([uuid, ahead, right, up]) => {
+			const THREE = window.__stores.THREE;
+			let camera = null;
+			let group = null;
+			window.__stores.globalCamera.subscribe((v) => (camera = v))();
+			window.__stores.objectsGroup.subscribe((v) => (group = v))();
+			const pos = camera.getWorldPosition(new THREE.Vector3());
+			const dir = camera.getWorldDirection(new THREE.Vector3());
+			const side = new THREE.Vector3().crossVectors(dir, camera.up).normalize();
+			const upv = new THREE.Vector3().crossVectors(side, dir).normalize();
+			const at = pos.addScaledVector(dir, ahead).addScaledVector(side, right).addScaledVector(upv, up);
+			const object = group.getObjectByProperty('uuid', uuid);
+			object.position.copy(at);
+			object.updateMatrixWorld();
+			window.__stores.objectsGroup.update((v) => v);
+			return at.toArray();
+		},
+		[uuid, ahead, right, up]
+	);
+
+/** @param {any} page @param {string} uuid */
+const posOf = (page, uuid) =>
+	page.evaluate((uuid) => {
+		let group = null;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return group.getObjectByProperty('uuid', uuid)?.position.toArray() ?? null;
+	}, uuid);
+
+/** @param {any} page */
+const counter = (page) =>
+	page.evaluate(() => {
+		let map = {};
+		window.__stores.flowTriggers.subscribe((v) => (map = v))();
+		return map.fcCount?.count ?? 0;
+	});
+
+/** @param {any} page */
+const status = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		let locked;
+		let scene;
+		s.isLocked.subscribe((v) => (locked = v))();
+		s.globalScene.subscribe((v) => (scene = v))();
+		let grid = null;
+		scene?.traverse((o) => {
+			if (o.name === 'editor-grid') grid = o;
+		});
+		return {
+			locked,
+			lockCalls: window.__lockCalls ?? 0,
+			lockElement: !!document.pointerLockElement,
+			reticle: !!document.querySelector('#play-reticle'),
+			free: s.playCursor.playCursorFree(),
+			grid: !!grid && grid.visible !== false
+		};
+	});
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	{
+		// rapier's wasm is lazy; warm the vite dep cache on a throwaway page first
+		const warm = await h.setupPage(browser, 'warm');
+		await warm.page.evaluate(() => window.__stores.physics.warmup().catch(() => {}));
+		await warm.page.waitForTimeout(3000);
+		await warm.ctx.close();
+	}
+	const A = await h.setupPage(browser, 'A', {
+		context: { viewport: { width: 1280, height: 720 } },
+		storage: { showGrid: 'true', helpersInPlay: 'false' }
+	});
+	const page = A.page;
+	// count every pointer-lock request the app makes, whatever element it asks for
+	await page.evaluate(() => {
+		window.__lockCalls = 0;
+		const original = Element.prototype.requestPointerLock;
+		Element.prototype.requestPointerLock = function (...args) {
+			window.__lockCalls++;
+			return original.apply(this, args);
+		};
+	});
+
+	const ids = await page.evaluate(() => {
+		const cmd = window.__stores.commandsHandler.sceneCommand;
+		let group = null;
+		cmd('/create box');
+		cmd('/create box');
+		cmd('/create box');
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		const [target, crate, floor] = group.children.slice(-3);
+		target.name = 'Target';
+		target.userData.physics = { mode: 'static' };
+		crate.name = 'Crate';
+		crate.userData.physics = { mode: 'dynamic', mass: 1 };
+		floor.name = 'Floor';
+		floor.scale.set(20, 0.2, 20);
+		floor.position.set(0, -0.1, 0);
+		floor.userData.physics = { mode: 'static' };
+		window.__stores.objectsGroup.update((v) => v);
+		return { target: target.uuid, crate: crate.uuid };
+	});
+	await page.waitForTimeout(1500);
+
+	// ===================================================================== 1. the field
+	const saved = await page.evaluate(() => {
+		const sp = window.__stores.scenePhysics;
+		sp.setScenePhysics({ gravity: -9 }); // a non-default scene, so a snapshot exists
+		const plain = sp.scenePhysicsSnapshot();
+		sp.setScenePhysics({ play: { cursor: 'locked' } });
+		const locked = sp.scenePhysicsSnapshot();
+		sp.setScenePhysics({ play: { cursor: 'nonsense' } });
+		const junk = sp.scenePhysicsSnapshot();
+		sp.setScenePhysics({ play: { cursor: 'free' } });
+		const free = sp.scenePhysicsSnapshot();
+		return { plain: plain?.play, locked: locked?.play, junk: junk?.play, free: free?.play };
+	});
+	h.check(!!saved.plain && !('cursor' in saved.plain), `a scene saved without the field has no cursor key (${JSON.stringify(saved.plain)})`);
+	h.check(!('cursor' in (saved.locked ?? {})), "'locked' is the default and is never written");
+	h.check(!('cursor' in (saved.junk ?? {})), 'an unknown value normalizes to the default (not written)');
+	h.check(saved.free?.cursor === 'free', `'free' is written (${JSON.stringify(saved.free)})`);
+	const resolved = await page.evaluate(() => window.__stores.playSettings.resolvePlaySettings(null).cursor);
+	h.check(resolved === 'free', `resolvePlaySettings carries it (${resolved})`);
+
+	// ===================================================================== 2. the grid, editor side
+	let st = await status(page);
+	h.check(st.grid, 'premise: the editor grid is drawn in the editor');
+
+	// ===================================================================== 3. enter play, free
+	await page.evaluate(() => window.__stores.physics.toggleSimulation());
+	await page.waitForTimeout(800);
+	await page.evaluate(() => window.__stores.playMode.requestPlay());
+	await h.eventually(() => status(page), (v) => v.locked === true, 'play mode is on', 5000);
+	await page.waitForTimeout(1200);
+	st = await status(page);
+	h.check(st.free, 'the cursor is free');
+	h.check(st.lockCalls === 0, `entering play asked for NO pointer lock (${st.lockCalls} requests)`);
+	h.check(!st.lockElement, 'and nothing holds one');
+	h.check(!st.reticle, 'the crosshair is not drawn (the cursor aims)');
+	h.check(!st.grid, 'the editor grid is hidden in play');
+
+	// ===================================================================== 4. a real click fires On Click
+	await page.evaluate((uuid) => {
+		const nodes = [
+			{ id: 'fcClick', type: 'onclick', position: { x: 0, y: 0 }, data: { type: 'onclick', pulse: 0.3 }, class: 'w-[150px]' },
+			{ id: 'fcSel', type: 'objectselector', position: { x: 300, y: 0 }, data: { type: 'objectselector', selected: uuid }, class: 'w-[150px]' },
+			{ id: 'fcCount', type: 'counter', position: { x: 0, y: 200 }, data: { type: 'counter', op: 'up', step: 1 }, class: 'w-[150px]' }
+		];
+		const edges = [
+			{ id: 'e-fcClick-fcSel', source: 'fcClick', target: 'fcSel' },
+			{ id: 'e-fcClick-fcCount', source: 'fcClick', target: 'fcCount' }
+		];
+		window.__stores.flowGraphs.update((graphs) => ({ ...graphs, scene: { nodes, edges } }));
+		window.__stores.flowNodes.set(nodes);
+		window.__stores.flowEdges.set(edges);
+	}, ids.target);
+	// off-centre: 1.6 m right of the view axis at 5 m, so the crosshair would miss it
+	const targetAt = await placeInView(page, ids.target, 5, 1.6);
+	await page.waitForTimeout(600);
+	const tp = await h.projectPoint(page, targetAt);
+	const under = await page.evaluate(({ x, y }) => document.elementFromPoint(x, y)?.tagName ?? null, tp);
+	h.check(under === 'CANVAS', `premise: the target's pixel is the viewport (${under})`);
+	h.check(Math.abs(tp.x - 640) > 60, `premise: the target is off the view centre (${Math.round(tp.x)}px)`);
+	const before = await counter(page);
+	await page.mouse.move(tp.x, tp.y);
+	await page.mouse.down();
+	await page.waitForTimeout(90);
+	await page.mouse.up();
+	await h.eventually(() => counter(page), (n) => n > before, `a real click at the target's pixel fires its On Click (${before} -> ?)`, 3000);
+	const debugClick = await page.evaluate(() => window.__stores.playInteract.playInteractDebug().lastUp);
+	h.check(debugClick === 'click', `recorded as a click on an object (${debugClick})`);
+	// 30 integrate: api.pointerRay() in a free-cursor game is the CURSOR's ray (30-core-modes'
+	// P4 made it the crosshair under a lock; both lanes now ask the one playCursor leaf)
+	const aimAgree = await page.evaluate((at) => {
+		const S = window.__stores;
+		let cam = null;
+		S.globalCamera.subscribe((c) => { cam = c; })();
+		const ray = S.moduleSDK.pointerRayNow();
+		if (!ray || !cam) return null;
+		const T = S.THREE;
+		const camPos = cam.getWorldPosition(new T.Vector3());
+		const toTarget = new T.Vector3(...at).sub(camPos).normalize();
+		const centre = new T.Raycaster();
+		centre.setFromCamera(new T.Vector2(0, 0), cam);
+		return { target: ray.ray.direction.dot(toTarget), centre: ray.ray.direction.dot(centre.ray.direction) };
+	}, targetAt);
+	h.check(!!aimAgree && aimAgree.target > 0.999, `api.pointerRay() aims at the cursor in a free-cursor game (dot ${aimAgree?.target?.toFixed(5)})`);
+	h.check(!!aimAgree && aimAgree.centre < 0.999, `and not along the view axis (dot ${aimAgree?.centre?.toFixed(5)})`);
+
+	// ===================================================================== 5. a real press-drag carries a body
+	const crateAt = await placeInView(page, ids.crate, 3, -0.9);
+	await page.waitForTimeout(500);
+	const cp = await h.projectPoint(page, crateAt);
+	await page.mouse.move(cp.x, cp.y);
+	await page.mouse.down();
+	await page.waitForTimeout(250);
+	const carrying = await page.evaluate(() => window.__stores.playInteract.playInteractDebug().carrying);
+	h.check(carrying === ids.crate, `a press on the crate's pixel grabs it (${carrying === ids.crate})`);
+	// drag the cursor 260px to the right; the carried crate follows the cursor ray
+	const startPos = await posOf(page, ids.crate);
+	for (let i = 1; i <= 10; i++) {
+		await page.mouse.move(cp.x + i * 26, cp.y);
+		await page.waitForTimeout(40);
+	}
+	await page.waitForTimeout(700);
+	const draggedPos = await posOf(page, ids.crate);
+	const moved = Math.hypot(draggedPos[0] - startPos[0], draggedPos[2] - startPos[2]);
+	const shown = await h.projectPoint(page, draggedPos);
+	h.check(moved > 0.5, `the crate travelled with the cursor (${moved.toFixed(2)} m)`);
+	h.check(Math.abs(shown.x - (cp.x + 260)) < 90, `and sits under it on screen (${Math.round(shown.x)}px vs cursor ${Math.round(cp.x + 260)}px)`);
+	await page.mouse.up();
+	await page.waitForTimeout(300);
+	const released = await page.evaluate(() => window.__stores.playInteract.playInteractDebug().carrying);
+	h.check(released === null, 'releasing lets go');
+
+	// a click on page CHROME is not a world gesture in a free-cursor game
+	const chromeClick = await page.evaluate(() => {
+		const before = window.__stores.playInteract.playInteractDebug().lastUp;
+		const b = document.createElement('button');
+		b.textContent = 'chrome';
+		b.style.cssText = 'position:fixed;left:4px;top:300px;z-index:99999';
+		document.body.appendChild(b);
+		const r = b.getBoundingClientRect();
+		return { x: r.left + r.width / 2, y: r.top + r.height / 2, before };
+	});
+	const beforeChrome = await counter(page);
+	await page.mouse.click(chromeClick.x, chromeClick.y);
+	await page.waitForTimeout(400);
+	h.check((await counter(page)) === beforeChrome, 'a press on page chrome is not taken as a world tap');
+
+	// ===================================================================== 6. Escape leaves
+	await page.keyboard.press('Escape');
+	await h.eventually(() => status(page), (v) => v.locked !== true, 'Escape leaves a free-cursor game', 5000);
+	await h.eventually(() => status(page), (v) => v.grid, 'the grid is back in the editor', 3000);
+
+	// ===================================================================== 7. locked: the lock IS asked for, the grid still hides
+	await sp(page, 'sp.setScenePhysics({ play: { cursor: "locked" } })');
+	await page.evaluate(() => {
+		window.__lockCalls = 0;
+	});
+	await page.waitForTimeout(2200); // past the exit settle
+	await page.evaluate(() => window.__stores.playMode.requestPlay());
+	await h.eventually(() => status(page), (v) => v.locked === true, 'play mode again, cursor locked', 5000);
+	await page.waitForTimeout(800);
+	st = await status(page);
+	h.check(st.lockCalls > 0, `a LOCKED game still asks for the pointer lock (${st.lockCalls}) — the spy works`);
+	h.check(!st.free, 'and reads as not free');
+	h.check(!st.grid, 'the editor grid is hidden in play with a locked cursor too');
+	await page.evaluate(() => window.__stores.playMode.exitPlay());
+	await page.waitForTimeout(500);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/pointer-capture-play.test.cjs b/tests/e2e/pointer-capture-play.test.cjs
new file mode 100644
index 00000000..bdc1d008
--- /dev/null
+++ b/tests/e2e/pointer-capture-play.test.cjs
@@ -0,0 +1,192 @@
+// 30 P0 — THE POINTER-CAPTURE THROW. ~100 errors on a Quest were one per press.
+//
+// three 0.185's OrbitControls.onPointerDown calls `domElement.setPointerCapture` with
+// no guard, and the editor's <OrbitControls> stays MOUNTED in play (only its zoom
+// stands down). Chromium refuses a pointer capture while the page holds a pointer
+// lock — InvalidStateError — and the throw lands before `_addPointer`, so EVERY press
+// in play threw once and, after leaving play, surfaced as "Something went wrong".
+//
+// Headless has no real pointer lock, so the suite supplies Chromium's rule itself: a
+// `document.pointerLockElement` getter that answers the canvas while "locked", and a
+// prototype `setPointerCapture` that throws InvalidStateError exactly when one is set.
+// That model is checked FIRST (premise), so the suite cannot pass by the stub doing
+// nothing. The fix has two independent halves and each has its own check:
+//   (1) the editor OrbitControls is DISABLED while isLocked === true, so its
+//       onPointerDown returns before the capture (checked on the instance itself);
+//   (2) the capture on the canvas wrapper is GUARDED under a lock, for the moment
+//       something re-enables the controls (TransformControls' unmount cleanup does,
+//       unconditionally) — checked by re-enabling it by hand and pressing again.
+
+const h = require('./helpers.cjs');
+
+const PRESSES = 20;
+
+/** real CDP presses at the canvas centre; returns how many pointerdowns the canvas saw */
+async function pressCanvas(page, n) {
+	const box = await page.evaluate(() => {
+		let renderer = null;
+		window.__stores.globalRenderer.subscribe((v) => (renderer = v))();
+		const r = renderer.domElement.getBoundingClientRect();
+		window.__p0downs = 0;
+		renderer.domElement.addEventListener('pointerdown', () => window.__p0downs++, { once: false });
+		return { x: r.left + r.width / 2, y: r.top + r.height / 2 };
+	});
+	for (let i = 0; i < n; i++) {
+		await page.mouse.move(box.x + (i % 5), box.y + (i % 3));
+		await page.mouse.down();
+		await page.mouse.up();
+		await page.waitForTimeout(30);
+	}
+	return page.evaluate(() => window.__p0downs);
+}
+
+const captureErrors = (peer) => h.pageErrors(peer).filter((m) => /setPointerCapture|InvalidStateError/.test(m));
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+
+	// Chromium's rule, installed on the prototype so every element obeys it
+	await page.evaluate(() => {
+		let locked = null;
+		Object.defineProperty(document, 'pointerLockElement', { configurable: true, get: () => locked });
+		window.__p0lock = (on) => {
+			let renderer = null;
+			window.__stores.globalRenderer.subscribe((v) => (renderer = v))();
+			locked = on ? renderer.domElement : null;
+		};
+		const real = Element.prototype.setPointerCapture;
+		Element.prototype.setPointerCapture = function (id) {
+			if (document.pointerLockElement)
+				throw new DOMException("Failed to execute 'setPointerCapture' on 'Element': InvalidStateError", 'InvalidStateError');
+			return real.call(this, id);
+		};
+	});
+
+	// a game-like scene: a floor, a crate, a collectible-ish marker
+	await page.evaluate(() => {
+		const cmd = window.__stores.commandsHandler.sceneCommand;
+		cmd('/create box');
+		cmd('/create sphere');
+	});
+	await page.waitForTimeout(800);
+
+	// ---- premise: the model throws, the way Chromium does ----
+	const premise = await page.evaluate(() => {
+		window.__p0lock(true);
+		try {
+			document.body.setPointerCapture(1);
+			return 'no throw';
+		} catch (e) {
+			return e.name;
+		} finally {
+			window.__p0lock(false);
+		}
+	});
+	h.check(premise === 'InvalidStateError', `premise: a capture under the stubbed lock throws InvalidStateError (${premise})`);
+
+	// ---- enter play with the lock held ----
+	const before = captureErrors(A).length;
+	await page.evaluate(() => {
+		window.__p0lock(true);
+		window.__stores.isLocked.set(true);
+	});
+	await page.waitForTimeout(600);
+	const orbitInPlay = await page.evaluate(() => {
+		let oc = null;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		return oc ? oc.enabled : 'none';
+	});
+	h.check(orbitInPlay === false, `the editor OrbitControls stands down in play (enabled=${orbitInPlay})`);
+
+	const downs = await pressCanvas(page, PRESSES);
+	h.check(downs === PRESSES, `premise: the canvas really received ${PRESSES} pointerdowns (${downs})`);
+	const inPlay = captureErrors(A).length - before;
+	h.check(inPlay === 0, `ZERO setPointerCapture errors over ${PRESSES} presses in play (${inPlay})`);
+
+	// ---- guard (2): something re-enables the controls mid-play (TransformControls'
+	// unmount cleanup does exactly this) — the capture itself must still not throw ----
+	const guardBefore = captureErrors(A).length;
+	await page.evaluate(() => {
+		let oc = null;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		oc.enabled = true;
+	});
+	// press straight away, before the next frame can stand it down again
+	const stomped = await page.evaluate(() => {
+		let renderer = null;
+		window.__stores.globalRenderer.subscribe((v) => (renderer = v))();
+		const wrapper = renderer.domElement.parentElement;
+		let oc = null;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		oc.enabled = true;
+		const errors = [];
+		const onErr = (e) => { if (/setPointerCapture|InvalidStateError/.test(String(e.message))) errors.push(String(e.message)); };
+		window.addEventListener('error', onErr);
+		const ev = new PointerEvent('pointerdown', { pointerId: 1, button: 0, bubbles: true, clientX: 300, clientY: 300 });
+		renderer.domElement.dispatchEvent(ev);
+		window.dispatchEvent(new PointerEvent('pointerup', { pointerId: 1, button: 0, bubbles: true }));
+		document.dispatchEvent(new PointerEvent('pointerup', { pointerId: 1, button: 0, bubbles: true }));
+		window.removeEventListener('error', onErr);
+		return { sameEl: oc.domElement === wrapper || oc.domElement === renderer.domElement, errors };
+	});
+	await page.waitForTimeout(300);
+	h.check(stomped.sameEl, 'premise: the OrbitControls listens on the canvas or its wrapper');
+	const stompErrors = captureErrors(A).length - guardBefore + stomped.errors.length;
+	h.check(stompErrors === 0, `a re-enabled OrbitControls under the lock still captures nothing (${stompErrors} errors)`);
+	const reDisabled = await page.evaluate(() => {
+		let oc = null;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		return oc.enabled;
+	});
+	h.check(reDisabled === false, `...and the next frame stands it down again (enabled=${reDisabled})`);
+
+	// ---- leave play: no "Something went wrong", and the editor still orbits ----
+	await page.evaluate(() => {
+		window.__p0lock(false);
+		window.__stores.isLocked.set(false);
+	});
+	await page.waitForTimeout(2600); // Controls' own effect walks false -> null
+	const toast = await page.evaluate(() => document.body.innerText.includes('Something went wrong'));
+	h.check(!toast, 'no "Something went wrong" toast after leaving play');
+	const locked = await page.evaluate(() => {
+		let v;
+		window.__stores.isLocked.subscribe((x) => (v = x))();
+		return v;
+	});
+	h.check(locked !== true, `back in the editor (isLocked=${locked})`);
+	const enabledAfter = await page.evaluate(() => {
+		let oc = null;
+		window.__stores.orbitControls.subscribe((v) => (oc = v))();
+		return oc.enabled;
+	});
+	h.check(enabledAfter === true, `the editor OrbitControls is enabled again (${enabledAfter})`);
+
+	const camBefore = await page.evaluate(() => {
+		let cam = null;
+		window.__stores.globalCamera.subscribe((v) => (cam = v))();
+		return cam.position.toArray();
+	});
+	const box = await page.evaluate(() => {
+		let renderer = null;
+		window.__stores.globalRenderer.subscribe((v) => (renderer = v))();
+		const r = renderer.domElement.getBoundingClientRect();
+		return { x: r.left + r.width * 0.3, y: r.top + r.height * 0.6 };
+	});
+	await page.mouse.move(box.x, box.y);
+	await page.mouse.down();
+	for (let i = 1; i <= 10; i++) await page.mouse.move(box.x + i * 18, box.y - i * 4);
+	await page.mouse.up();
+	await page.waitForTimeout(600);
+	const camAfter = await page.evaluate(() => {
+		let cam = null;
+		window.__stores.globalCamera.subscribe((v) => (cam = v))();
+		return cam.position.toArray();
+	});
+	const moved = Math.hypot(camAfter[0] - camBefore[0], camAfter[1] - camBefore[1], camAfter[2] - camBefore[2]);
+	h.check(moved > 0.2, `a drag orbits the editor camera after Esc (moved ${moved.toFixed(2)})`);
+	h.check(captureErrors(A).length === 0, `no capture error anywhere in the run (${captureErrors(A).length})`);
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/select-through.test.cjs b/tests/e2e/select-through.test.cjs
new file mode 100644
index 00000000..df3ac264
--- /dev/null
+++ b/tests/e2e/select-through.test.cjs
@@ -0,0 +1,201 @@
+// 30 P2 — SELECT-THROUGH and CLICK-CYCLE.
+//
+// Measured before this (roadmap 30, "Selection and the object list", cause 1): the pick
+// returned the NEAREST hit whatever its opacity, so Stars Room's 0.12-opacity walls took
+// every click on a star, a pad or a planet (16 of 16 selected "Wall south") and
+// Football's 0.06 ceiling ate the lamps. Now a plain editor click prefers the first
+// OPAQUE target down the ray, an object flagged `userData.pick = 'through'` stands aside
+// whatever its opacity, and a REPEAT on the same spot (after the double-click window)
+// walks down the stack — which is how the shell itself stays reachable.
+//
+// Real mouse clicks on pixels proven to cross the intended objects (premises), and the
+// flag is set through the REAL Inspector checkbox, then read back on a second peer.
+
+const h = require('./helpers.cjs');
+
+const selection = (page) =>
+	page.evaluate(() => {
+		let v;
+		window.__stores.selectedObjects.subscribe((x) => (v = x))();
+		return v.slice();
+	});
+
+/** make a box, name/place/scale it, return its uuid (re-seated after /create's own) */
+async function makeBox(page, name, pos, scale = [1, 1, 1]) {
+	const uuid = await page.evaluate(() => {
+		const s = window.__stores;
+		s.commandsHandler.sceneCommand('/create box');
+		let group;
+		s.objectsGroup.subscribe((v) => (group = v))();
+		return group.children[group.children.length - 1].uuid;
+	});
+	await page.waitForTimeout(700);
+	await page.evaluate(
+		({ uuid, name, pos, scale }) => {
+			const s = window.__stores;
+			let group;
+			s.objectsGroup.subscribe((v) => (group = v))();
+			const o = group.getObjectByProperty('uuid', uuid);
+			o.name = name;
+			o.position.fromArray(pos);
+			o.scale.fromArray(scale);
+			delete o.userData.physics;
+			o.updateMatrixWorld(true);
+			s.objectsGroup.update((v) => v);
+		},
+		{ uuid, name, pos, scale }
+	);
+	return uuid;
+}
+
+/** the screen pixel of a world point, and the ORDERED names the app's pick finds there */
+function pixelAt(page, world) {
+	return page.evaluate((world) => {
+		const s = window.__stores;
+		const THREE = s.THREE;
+		let camera, renderer;
+		s.globalCamera.subscribe((v) => (camera = v))();
+		s.globalRenderer.subscribe((v) => (renderer = v))();
+		const v = new THREE.Vector3(...world).project(camera);
+		const rect = renderer.domElement.getBoundingClientRect();
+		const ray = new THREE.Raycaster();
+		ray.setFromCamera(new THREE.Vector2(v.x, v.y), camera);
+		const names = [];
+		for (const hit of s.scenePick.sceneHits(ray)) {
+			let n = hit.object;
+			while (n.parent && n.parent.name !== 'sceneObjects') n = n.parent;
+			if (!names.includes(n.name)) names.push(n.name);
+		}
+		const x = rect.left + ((v.x + 1) / 2) * rect.width;
+		const y = rect.top + ((1 - v.y) / 2) * rect.height;
+		return { x, y, names, onCanvas: document.elementFromPoint(x, y) === renderer.domElement };
+	}, world);
+}
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const B = await h.setupPage(browser, 'B');
+	const page = A.page;
+	await h.connect(A, B);
+
+	// ---------------------------------------------------------------- fixtures
+	// a box INSIDE a 0.1-opacity shell, and an opaque wall in front of a crate
+	const inner = await makeBox(page, 'Inner', [0, 0.5, 0], [0.6, 0.6, 0.6]);
+	const shell = await makeBox(page, 'Shell', [0, 0.5, 0], [2.4, 2.4, 2.4]);
+	await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		const o = group.getObjectByProperty('uuid', uuid);
+		o.material.transparent = true;
+		o.material.opacity = 0.1;
+		o.material.needsUpdate = true;
+	}, shell);
+	const crate = await makeBox(page, 'Crate', [5, 0.5, -1], [0.8, 0.8, 0.8]);
+	const wall = await makeBox(page, 'Wall', [5, 0.8, 1.5], [3, 1.6, 0.2]);
+	await page.evaluate(() => {
+		const s = window.__stores;
+		s.objectActions.deselectObject();
+		// look at both fixtures from the front, so each ray crosses shell->inner / wall->crate
+		s.objectActions.flyTo([2.5, 2.2, 9], [2.5, 0.6, 0], 0);
+	});
+	await page.waitForTimeout(1200);
+
+	// ---------------------------------------------------------------- 1
+	console.log('\n=== 1. a box inside a 0.1-opacity shell selects the BOX ===');
+	let at = await pixelAt(page, [0, 0.5, 0]);
+	h.check(at.onCanvas, '1.1 (premise) the pixel is the canvas');
+	h.check(at.names[0] === 'Shell' && at.names.includes('Inner'), `1.2 (premise) the ray meets the SHELL first, the box behind it (${at.names.join(' > ')})`);
+	await page.mouse.click(at.x, at.y);
+	await page.waitForTimeout(400);
+	h.check((await selection(page)).join() === inner, '1.3 the click selects the box, not the near-invisible shell');
+	const hint = await page.evaluate(() => document.body.innerText.includes('Click again to select behind'));
+	h.check(hint, '1.4 the first stacked pick says how to reach what is behind');
+
+	// ---------------------------------------------------------------- 2
+	console.log('\n=== 2. a repeat on the same spot walks down the stack (and reaches the shell) ===');
+	await page.waitForTimeout(650); // past the double-click window, inside the cycle window
+	await page.mouse.click(at.x, at.y);
+	await page.waitForTimeout(400);
+	h.check((await selection(page)).join() === shell, '2.1 the repeat click reaches the SHELL (the next entry down, wrapping)');
+	await page.waitForTimeout(650);
+	await page.mouse.click(at.x, at.y);
+	await page.waitForTimeout(400);
+	h.check((await selection(page)).join() === inner, '2.2 ...and once more comes back round to the box');
+	// a DOUBLE-click is still the double-click action, never a cycle
+	await page.waitForTimeout(1700);
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.mouse.dblclick(at.x, at.y);
+	await page.waitForTimeout(500);
+	h.check((await selection(page)).join() === inner, '2.3 a double-click stays on the box (no cycle inside the double-click window)');
+	await page.waitForTimeout(1700);
+	await page.mouse.click(at.x + 30, at.y + 30);
+	await page.waitForTimeout(300);
+
+	// ---------------------------------------------------------------- 3
+	console.log('\n=== 3. the Click-through checkbox: an OPAQUE wall is clicked through ===');
+	at = await pixelAt(page, [5, 0.5, -1]);
+	h.check(at.names[0] === 'Wall' && at.names.includes('Crate'), `3.1 (premise) the ray meets the opaque WALL first (${at.names.join(' > ')})`);
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.waitForTimeout(1700);
+	await page.mouse.click(at.x, at.y);
+	await page.waitForTimeout(400);
+	h.check((await selection(page)).join() === wall, '3.2 (premise) unflagged, an opaque wall takes the click');
+	// open its properties and tick the real checkbox
+	await page.evaluate((uuid) => window.__stores.objectActions.selectObject(uuid, true), wall);
+	await page.waitForTimeout(700);
+	const box = page.locator('#inspector-pick-through');
+	h.check((await box.count()) === 1, '3.3 the Inspector carries "Click-through in the viewport"');
+	await box.check();
+	await page.waitForTimeout(400);
+	const flag = await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return group.getObjectByProperty('uuid', uuid).userData.pick ?? null;
+	}, wall);
+	h.check(flag === 'through', `3.4 ticking it writes userData.pick (${flag})`);
+	await page.evaluate(() => window.__stores.objectActions.deselectObject());
+	await page.waitForTimeout(1700);
+	await page.mouse.click(at.x, at.y);
+	await page.waitForTimeout(400);
+	h.check((await selection(page)).join() === crate, '3.5 flagged, the wall stands aside: the click selects the crate behind it');
+	await h.eventually(
+		() =>
+			B.page.evaluate((uuid) => {
+				let group;
+				window.__stores.objectsGroup.subscribe((v) => (group = v))();
+				return group.getObjectByProperty('uuid', uuid)?.userData?.pick ?? null;
+			}, wall),
+		(v) => v === 'through',
+		'3.6 the flag reaches the peer (a props write, like physics)'
+	);
+	// one undo clears it, and the clear replicates too
+	await page.evaluate(() => window.__stores.history.undo());
+	await page.waitForTimeout(400);
+	const undone = await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return group.getObjectByProperty('uuid', uuid).userData.pick ?? null;
+	}, wall);
+	h.check(undone === null, `3.7 one undo clears it (${undone})`);
+	await h.eventually(
+		() =>
+			B.page.evaluate((uuid) => {
+				let group;
+				window.__stores.objectsGroup.subscribe((v) => (group = v))();
+				return group.getObjectByProperty('uuid', uuid)?.userData?.pick ?? null;
+			}, wall),
+		(v) => v === null,
+		'3.8 ...on the peer too'
+	);
+	// an object never flagged carries NO pick key (saved scenes stay byte-identical)
+	const clean = await page.evaluate((uuid) => {
+		let group;
+		window.__stores.objectsGroup.subscribe((v) => (group = v))();
+		return 'pick' in group.getObjectByProperty('uuid', uuid).userData;
+	}, crate);
+	h.check(!clean, '3.9 an unflagged object has no pick key at all');
+
+	h.check(h.pageErrors(A).length === 0, `the page threw nothing (${h.pageErrors(A).join(' / ')})`);
+	await h.finish(browser);
+});
diff --git a/tests/e2e/touch-play.test.cjs b/tests/e2e/touch-play.test.cjs
index 9fb0e0e9..3d0f1e72 100644
--- a/tests/e2e/touch-play.test.cjs
+++ b/tests/e2e/touch-play.test.cjs
@@ -94,7 +94,9 @@ const watchClaims = (page) =>
 
 const historyState = (page) =>
 	page.evaluate(() => ({
-		tpPlay: !!(history.state && history.state.tpPlay),
+		// 30 P0: the marker is a SvelteKit SHALLOW entry now, so its state object sits under
+		// the router's `sveltekit:states` key — playMarkerState() reads it there
+		tpPlay: window.__stores.playMode.playMarkerState(),
 		marker: window.__stores.playMode.playBackMarker(),
 		href: location.href,
 		mounted: !!document.querySelector('#play-button') || !!document.querySelector('canvas')
diff --git a/tests/e2e/vr-game-panel.test.cjs b/tests/e2e/vr-game-panel.test.cjs
new file mode 100644
index 00000000..2607cb74
--- /dev/null
+++ b/tests/e2e/vr-game-panel.test.cjs
@@ -0,0 +1,337 @@
+// 30b (vr-play) P3 — C2 THE GAME UI IN VR. The user, on a Quest 3: "in VR I should be able to
+// see the game menu and interact with it", "I also should see the score in the VR", "there
+// should be an option available to go into the edit mode".
+//
+// No headset runs headless: the suite drives vrGamePanelFrame with a SYNTHETIC head pose and
+// posed controllers (matrixAutoUpdate on — the documented XR-controller trap), and reads
+// what a player would see: which surfaces are visible, where they sit, and what their
+// canvases hold.
+// 1 a menu screen becomes the world panel, 1.2 m ahead at chest height, drawn · 2 its
+// buttons are hit rects, ours included · 3 the LASER + trigger presses Start through the
+// real trigger hook: the game starts, the press is consumed and its trailing select
+// swallowed · 4 in play the score becomes the wrist card + the top strip · 5 the wrist
+// shows only when turned toward the face · 6 a POKE presses once and re-arms on retreat ·
+// 7 the strip toggles · 8 Edit mode leaves Interact and every surface goes · 9 the panel
+// follows the head LAZILY · 10 the announce banner in VR · 11 not presenting = nothing ·
+// 12 a toggle flips its value · 13 the REAL Towers template: its menu in VR, Start pressed.
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const path = require('path');
+
+const SCENES_REPO = [path.resolve(__dirname, '../../../theprototype.app-scenes'), path.resolve(__dirname, '../../../scenes')].find((p) =>
+	fs.existsSync(p)
+);
+const TOWERS = process.env.TOWERS_TPSCENE || (SCENES_REPO && path.join(SCENES_REPO, 'games/towers/scene.tpscene'));
+
+h.run(async () => {
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		await s.moduleSDK.initModules([
+			{ id: 'panel30b', name: 'Panel test', version: '1.0.0', description: 'the 30b VR panel', register(api) { window.__api = api; } }
+		]);
+		localStorage.removeItem('vr:gameStrip');
+		// a game: a menu screen bound to 'menu' with Start + a music toggle, and a play HUD
+		s.hudDocs.setHudDocFor('scene', {
+			active: '',
+			screens: [
+				{
+					id: 'menu',
+					name: 'Menu',
+					showWhile: 'menu',
+					input: 'menu',
+					elements: [
+						{ id: 'title', kind: 'text', anchor: 'top-center', x: 0, y: 80, w: 600, h: 90, label: 'TOWERS', style: { size: 64, align: 'center', weight: '800' } },
+						{ id: 'start', kind: 'button', anchor: 'center', x: 0, y: 0, w: 320, h: 80, label: 'Start', style: { bg: '#2563eb', size: 32 } },
+						{ id: 'music', kind: 'toggle', anchor: 'center', x: 0, y: 120, w: 320, h: 56, label: 'Music', value: false }
+					]
+				},
+				{
+					id: 'hud',
+					name: 'HUD',
+					showWhile: 'playing',
+					elements: [
+						{ id: 'score', kind: 'text', anchor: 'top-left', x: 24, y: 24, w: 240, h: 40, label: 'Height: 0 m' },
+						{ id: 'time', kind: 'timer', anchor: 'top-right', x: 24, y: 24, w: 160, h: 40, label: '1:30' }
+					]
+				}
+			]
+		});
+		s.gameState.setGameState('menu');
+		s.hudActions.addBinding('start', 'start');
+		s.objectActions.setEditorMode('interact');
+		// posed controllers: three writes their matrices per XR frame, so a test must switch
+		// that back on before posing them by hand
+		let r;
+		s.globalRenderer.subscribe((v) => (r = v))();
+		for (const i of [0, 1]) {
+			const c = r.xr.getController(i);
+			c.matrixAutoUpdate = true;
+			c.userData.handedness = i === 0 ? 'left' : 'right';
+		}
+		window.__T = {
+			head: (yawDeg = 0) => {
+				const THREE = s.THREE;
+				return {
+					position: new THREE.Vector3(0, 1.6, 0),
+					quaternion: new THREE.Quaternion().setFromEuler(new THREE.Euler(0, (yawDeg * Math.PI) / 180, 0, 'YXZ'))
+				};
+			},
+			// the left hand held up, palm-side card facing the eyes (or turned away)
+			leftHand: (facing = true) => {
+				const THREE = s.THREE;
+				const q = new THREE.Quaternion().setFromEuler(new THREE.Euler(facing ? 0.9 : -2.2, 0, 0, 'YXZ'));
+				return { position: new THREE.Vector3(-0.1, 1.2, -0.35), quaternion: q };
+			},
+			// the world point of a hit rect's centre on a surface
+			rectPoint: (surfaceName, id) => {
+				const k = s.gameKit.vrGamePanel;
+				const surf = k.vrGameSurface(surfaceName);
+				const rect = k.vrGamePanelDebug().hits[surfaceName].find((x) => x.id === id);
+				if (!surf || !rect) return null;
+				const g = surf.mesh.geometry.parameters;
+				const cx = (rect.x + rect.w / 2) / surf.canvas.width;
+				const cy = (rect.y + rect.h / 2) / surf.canvas.height;
+				return surf.mesh.localToWorld(new s.THREE.Vector3((cx - 0.5) * g.width, (0.5 - cy) * g.height, 0));
+			},
+			aim: (index, from, to) => {
+				const c = r.xr.getController(index);
+				c.position.copy(from);
+				// Object3D.lookAt turns a plain object's +Z toward the target, and a controller's
+				// ray is its -Z: look at the point MIRRORED through the controller instead
+				c.lookAt(from.clone().multiplyScalar(2).sub(to));
+				c.updateMatrixWorld(true);
+			}
+		};
+	});
+	const frame = (opts = '{}') =>
+		page.evaluate((o) => {
+			const T = window.__T;
+			const k = window.__stores.gameKit.vrGamePanel;
+			return k.vrGamePanelFrame({ head: T.head(o.yaw ?? 0), hands: [o.hand === false ? null : T.leftHand(o.facing !== false), null], dt: o.dt ?? 1 / 72 });
+		}, JSON.parse(opts));
+
+	console.log('\n=== 1. the menu screen becomes the world panel ===');
+	const f1 = await frame();
+	const panel = await page.evaluate(() => {
+		const k = window.__stores.gameKit.vrGamePanel;
+		const surf = k.vrGameSurface('vr-game-panel');
+		const g = surf.canvas.getContext('2d');
+		const data = g.getImageData(0, 0, surf.canvas.width, surf.canvas.height).data;
+		let ink = 0;
+		for (let i = 0; i < data.length; i += 4) if (data[i + 3] > 200 && data[i] + data[i + 1] + data[i + 2] > 600) ink++;
+		const start = k.vrGamePanelDebug().hits['vr-game-panel'].find((x) => x.id === 'start');
+		const px = g.getImageData(Math.round(start.x + 8), Math.round(start.y + start.h / 2), 1, 1).data;
+		let scene;
+		window.__stores.globalScene.subscribe((v) => (scene = v))();
+		return {
+			pos: surf.mesh.position.toArray(),
+			visible: surf.mesh.visible,
+			parentIsScene: surf.mesh.parent === scene,
+			layer0: surf.mesh.layers.test(new window.__stores.THREE.Layers()),
+			ink,
+			width: surf.mesh.geometry.parameters.width,
+			startPx: Array.from(px)
+		};
+	});
+	h.check(f1.panel === 'menu' && panel.visible, '1.1 the menu screen is on the panel (' + JSON.stringify(f1) + ')');
+	h.check(Math.abs(panel.pos[2] + 1.2) < 0.05 && panel.pos[1] < 1.6 && panel.pos[1] > 1.2, '1.2 ~1.2 m ahead, below the eyes (' + panel.pos.map((n) => n.toFixed(2)) + ')');
+	h.check(panel.parentIsScene && panel.layer0, '1.3 a scene-root mesh on the default layer (both eyes)');
+	h.check(panel.ink > 1500, '1.4 the canvas holds drawn text (' + panel.ink + ' white px)');
+	h.check(panel.width > 0.6 && panel.width < 1.3, '1.6 the board is sized to the menu it shows, not the whole stage (' + panel.width.toFixed(2) + ' m wide)');
+	h.check(panel.startPx[2] > 200 && panel.startPx[0] < 80, '1.5 the Start button is drawn in its authored blue (' + panel.startPx + ')');
+
+	console.log('\n=== 2. the buttons are hit rects, ours included ===');
+	const ids = await page.evaluate(() => window.__stores.gameKit.vrGamePanel.vrGamePanelDebug().hits['vr-game-panel'].map((x) => x.id));
+	h.check(ids.includes('start') && ids.includes('music') && !ids.includes('title'), '2.1 Start and the toggle press, the title does not (' + ids + ')');
+	h.check(ids.includes('footer:edit') && ids.includes('footer:strip'), '2.2 our Edit mode and Top strip buttons are on the footer');
+
+	console.log('\n=== 3. laser + trigger presses Start through the real trigger hook ===');
+	await page.waitForTimeout(700); // a fresh binding must be seen by a tick before its first press (actionSeenAt)
+	const press = await page.evaluate(async () => {
+		const s = window.__stores;
+		const T = window.__T;
+		const target = T.rectPoint('vr-game-panel', 'start');
+		T.aim(1, new s.THREE.Vector3(0.25, 1.3, -0.3), target);
+		const hover = s.gameKit.vrGamePanel.panelHover(1, s.gameKit.vrGameInput.controllerRayOf(1))?.hit.id ?? null;
+		const consumed = s.vrControls.vrModuleTriggerStart(1);
+		await new Promise((r) => setTimeout(r, 500)); // the Set Game State node acts on the next tick
+		let state;
+		s.gameState.gameState.subscribe((v) => (state = v.state))();
+		const swallow1 = s.vrControls.vrModuleSelectSwallowed();
+		const swallow2 = s.vrControls.vrModuleSelectSwallowed();
+		s.vrControls.vrModuleTriggerEnd(1);
+		return { hover, consumed, state, swallow1, swallow2 };
+	});
+	h.check(press.hover === 'start', '3.1 the laser hovers Start (' + press.hover + ')');
+	h.check(press.consumed === true && press.state === 'playing', '3.2 the trigger pressed it: the game is playing (' + JSON.stringify(press) + ')');
+	h.check(press.swallow1 === true && press.swallow2 === false, '3.3 the trailing select is swallowed once, not forever');
+
+	console.log('\n=== 4. in play the score is on the wrist and the strip ===');
+	const f4 = await frame();
+	h.check(f4.panel === null, '4.1 the panel goes when the menu does');
+	h.check(JSON.stringify(f4.lines) === JSON.stringify(['Height: 0 m', '1:30']), '4.2 the overlay reads as lines (' + JSON.stringify(f4.lines) + ')');
+	h.check(f4.wrist && f4.strip, '4.3 the wrist card and the top strip are up');
+	const stripPose = await page.evaluate(() => window.__stores.gameKit.vrGamePanel.vrGameSurface('vr-game-strip').mesh.position.toArray());
+	h.check(stripPose[1] > 1.8 && stripPose[2] < -1, '4.4 the strip rides high in front of the eyes (' + stripPose.map((n) => n.toFixed(2)) + ')');
+
+	console.log('\n=== 5. the wrist shows only when turned to the face ===');
+	const away = await frame('{"facing": false}');
+	h.check(away.wrist === false && away.strip === true, '5.1 turned away: no wrist card (the strip stays)');
+	const noHand = await frame('{"hand": false}');
+	h.check(noHand.wrist === false, '5.2 no tracked left hand: no card');
+
+	console.log('\n=== 6. a POKE presses once and re-arms on retreat ===');
+	await frame();
+	const poke = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const k = s.gameKit.vrGamePanel;
+		const at = T.rectPoint('vr-game-wrist', 'footer:strip');
+		const surf = k.vrGameSurface('vr-game-wrist');
+		const normal = new s.THREE.Vector3(0, 0, 1).applyQuaternion(surf.mesh.quaternion);
+		const before = k.vrGamePanelDebug().strip;
+		const first = k.pokeFrame(0, at.clone().addScaledVector(normal, 0.005))?.hit.id ?? null;
+		const afterFirst = k.vrGamePanelDebug().strip;
+		const held = k.pokeFrame(0, at.clone().addScaledVector(normal, -0.004))?.hit.id ?? null;
+		k.pokeFrame(0, at.clone().addScaledVector(normal, 0.1)); // pull back
+		const again = k.pokeFrame(0, at.clone().addScaledVector(normal, 0.003))?.hit.id ?? null;
+		return { before, first, afterFirst, held, again, after: k.vrGamePanelDebug().strip };
+	});
+	h.check(poke.first === 'footer:strip' && poke.before === true && poke.afterFirst === false, '6.1 pushing the tip into "Strip on" presses it (' + JSON.stringify(poke) + ')');
+	h.check(poke.held === null, '6.2 holding the tip in the button does not press again');
+	h.check(poke.again === 'footer:strip' && poke.after === true, '6.3 pulling back re-arms it: the next push presses');
+
+	console.log('\n=== 7. the strip toggles ===');
+	await page.evaluate(() => window.__stores.gameKit.vrGamePanel.setVrStrip(false));
+	const off = await frame();
+	h.check(off.strip === false && off.wrist === true, '7.1 strip off: gone, the wrist stays');
+	h.check((await page.evaluate(() => localStorage.getItem('vr:gameStrip'))) === 'false', '7.2 persisted locally');
+	await page.evaluate(() => window.__stores.gameKit.vrGamePanel.setVrStrip(true));
+
+	console.log('\n=== 8. Edit mode leaves Interact, and everything goes ===');
+	await frame();
+	const edit = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const at = T.rectPoint('vr-game-wrist', 'footer:edit');
+		T.aim(1, at.clone().add(new s.THREE.Vector3(0.1, 0.25, 0.1)), at);
+		const consumed = s.vrControls.vrModuleTriggerStart(1);
+		s.vrControls.vrModuleSelectSwallowed();
+		s.vrControls.vrModuleTriggerEnd(1);
+		let mode;
+		s.editorMode.subscribe((v) => (mode = v))();
+		return { consumed, mode };
+	});
+	h.check(edit.consumed && edit.mode === 'edit', '8.1 "Edit" on the wrist switched to Edit (' + JSON.stringify(edit) + ')');
+	const f8 = await frame();
+	h.check(!f8.panel && !f8.wrist && !f8.strip, '8.2 in Edit no game surface shows (' + JSON.stringify(f8) + ')');
+	await page.evaluate(() => {
+		window.__stores.objectActions.setEditorMode('interact');
+		window.__stores.gameState.setGameState('menu');
+	});
+
+	console.log('\n=== 9. the panel follows the head LAZILY ===');
+	await page.evaluate(() => window.__stores.gameKit.vrGamePanel.hideVrGamePanel());
+	await frame('{"yaw": 0}');
+	const yaws = await page.evaluate(() => {
+		const k = window.__stores.gameKit.vrGamePanel;
+		const T = window.__T;
+		const pos = () => k.vrGameSurface('vr-game-panel').mesh.position.clone();
+		const at0 = pos();
+		k.vrGamePanelFrame({ head: T.head(20), hands: [null, null], dt: 0.5 });
+		const at20 = pos();
+		for (let i = 0; i < 30; i++) k.vrGamePanelFrame({ head: T.head(80), hands: [null, null], dt: 0.1 });
+		const at80 = pos();
+		const bearing = (p) => (Math.atan2(-p.x, -p.z) * 180) / Math.PI;
+		return { b0: bearing(at0), b20: bearing(at20), b80: bearing(at80) };
+	});
+	h.check(Math.abs(yaws.b20 - yaws.b0) < 0.5, '9.1 a 20 degree glance leaves it where it is (' + yaws.b0.toFixed(1) + ' -> ' + yaws.b20.toFixed(1) + ')');
+	h.check(yaws.b80 > 40, '9.2 turning 80 degrees brings it round (' + yaws.b80.toFixed(1) + ' degrees)');
+	h.check(yaws.b80 > 75, '9.3 ...all the way back in front, not parked at the edge of the band (' + yaws.b80.toFixed(1) + ')');
+
+	console.log('\n=== 10. the announce banner, head-locked ===');
+	const ann = await page.evaluate(async () => {
+		const k = window.__stores.gameKit.vrGamePanel;
+		const T = window.__T;
+		window.__api.announce('Ring 2 reached', { sub: '+50', ms: 500 });
+		const on = k.vrGamePanelFrame({ head: T.head(0), hands: [null, null] }).banner;
+		const pos = k.vrGameSurface('vr-game-announce').mesh.position.toArray();
+		await new Promise((r) => setTimeout(r, 700));
+		const later = k.vrGamePanelFrame({ head: T.head(0), hands: [null, null] }).banner;
+		return { on, pos, later };
+	});
+	h.check(ann.on && Math.abs(ann.pos[0]) < 0.01 && ann.pos[2] < -1.4, '10.1 api.announce shows a banner straight ahead (' + ann.pos.map((n) => n.toFixed(2)) + ')');
+	h.check(ann.later === false, '10.2 and it goes after its ms');
+
+	console.log('\n=== 11. not presenting: nothing ===');
+	const flat = await page.evaluate(() => window.__stores.gameKit.vrGamePanel.vrGamePanelFrame({ hands: [null, null] }));
+	h.check(!flat.panel && !flat.wrist && !flat.strip && !flat.banner, '11.1 with no headset session nothing is drawn (' + JSON.stringify(flat) + ')');
+
+	console.log('\n=== 12. a toggle flips its value ===');
+	await frame();
+	const tog = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const at = T.rectPoint('vr-game-panel', 'music');
+		T.aim(1, new s.THREE.Vector3(0.2, 1.3, -0.2), at);
+		const before = s.hudDocs.hudValueOf('music', false);
+		s.vrControls.vrModuleTriggerStart(1);
+		s.vrControls.vrModuleSelectSwallowed();
+		s.vrControls.vrModuleTriggerEnd(1);
+		return { before, after: s.hudDocs.hudValueOf('music', false) };
+	});
+	h.check(tog.before === false && tog.after === true, '12.1 the Music toggle flipped through the laser (' + JSON.stringify(tog) + ')');
+
+	console.log('\n=== 13. the REAL Towers template ===');
+	if (!TOWERS || !fs.existsSync(TOWERS)) console.log('SKIP 13: no games/towers/scene.tpscene');
+	else {
+		const bytes = Array.from(fs.readFileSync(TOWERS));
+		await page.evaluate(async (arr) => {
+			const s = window.__stores;
+			const payload = await s.sessions.readSessionZip(new Uint8Array(arr).buffer);
+			await s.sessions.applySession(payload, { backup: false });
+		}, bytes);
+		await page.waitForTimeout(2500);
+		const towers = await page.evaluate(() => {
+			const s = window.__stores;
+			s.gameState.setGameState('menu');
+			s.objectActions.setEditorMode('interact');
+			const k = s.gameKit.vrGamePanel;
+			const T = window.__T;
+			k.hideVrGamePanel();
+			const f = k.vrGamePanelFrame({ head: T.head(0), hands: [T.leftHand(true), null] });
+			const hits = k.vrGamePanelDebug().hits['vr-game-panel'].filter((x) => x.kind !== 'footer');
+			const labels = [];
+			for (const { screen } of k.vrScreens().panel) for (const el of screen.elements) if (hits.some((x) => x.id === el.id)) labels.push(el.label);
+			return { panel: f.panel, labels, hits: hits.map((x) => x.id) };
+		});
+		h.check(!!towers.panel && towers.hits.length > 0, '13.1 the Towers menu is on the VR panel with pressable controls (' + JSON.stringify(towers) + ')');
+		const startId = towers.hits.find((id, i) => /start|play/i.test(towers.labels[i] ?? '')) ?? towers.hits[0];
+		const started = await page.evaluate(async (id) => {
+			const s = window.__stores;
+			const T = window.__T;
+			const at = T.rectPoint('vr-game-panel', id);
+			T.aim(1, new s.THREE.Vector3(0.2, 1.3, -0.2), at);
+			s.vrControls.vrModuleTriggerStart(1);
+			s.vrControls.vrModuleSelectSwallowed();
+			s.vrControls.vrModuleTriggerEnd(1);
+			await new Promise((r) => setTimeout(r, 400));
+			let state;
+			s.gameState.gameState.subscribe((v) => (state = v.state))();
+			const f = s.gameKit.vrGamePanel.vrGamePanelFrame({ head: T.head(0), hands: [T.leftHand(true), null] });
+			return { state, f };
+		}, startId);
+		h.check(started.state === 'playing', '13.2 pressing its Start in VR starts the round (' + JSON.stringify(started) + ')');
+		h.check(started.f.lines.length > 0, '13.3 the round\'s HUD reads on the wrist/strip (' + JSON.stringify(started.f.lines) + ')');
+		h.check(
+			started.f.stripLines.length > 0 && started.f.stripLines.every((l) => l.length <= 28) && started.f.stripLines.length < started.f.lines.length,
+			'13.4 the strip keeps the short readouts and leaves the sentence-long hint to the wrist (' + JSON.stringify(started.f.stripLines) + ')'
+		);
+	}
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/vr-grips-by-mode.test.cjs b/tests/e2e/vr-grips-by-mode.test.cjs
new file mode 100644
index 00000000..108026cb
--- /dev/null
+++ b/tests/e2e/vr-grips-by-mode.test.cjs
@@ -0,0 +1,179 @@
+// 30b P2: GRIPS BY MODE. The Quest report: "when in game and in edit mode I should be able
+// to move around the world and scale it with grips, now it disables this for some reason".
+// Nothing disabled the world grab — it only ever fired on EMPTY AIR, and a game scene has
+// none: every controller ray ends on a floor, a wall or a ceiling, so every grip grabbed
+// the ROOM. The grip now passes through scenery (vrGrip.js), and the mode decides the rest:
+// Edit holds anything that is not scenery and moves the world on air; Interact holds only
+// dynamic bodies and never moves the world.
+//
+// Driven through the REAL per-frame path (Scene's useTask -> updateVRControls) with a fake
+// XR session (fakeXR.cjs): the suite presses grips and moves controllers.
+const h = require('./helpers.cjs');
+const xr = require('./fakeXR.cjs');
+
+const state = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		const rig = get(s.worldRig);
+		return {
+			...s.vrControls.vrGripDebug(),
+			rigScale: rig.scale.x,
+			rigPos: rig.position.toArray(),
+			selected: [...get(s.selectedObjects)],
+			undo: s.history.undoStack ? get(s.history.undoStack).length : null,
+			mode: get(s.editorMode)
+		};
+	});
+const posOf = (page, uuid) =>
+	page.evaluate((uuid) => {
+		let g;
+		window.__stores.objectsGroup.subscribe((x) => (g = x))();
+		return g.getObjectByProperty('uuid', uuid).position.toArray();
+	}, uuid);
+const grip = async (page, hand, down) => {
+	await xr.button(page, hand, 1, down);
+	await page.waitForTimeout(250);
+};
+const resetRig = (page) => page.evaluate(() => window.__stores.vrControls.resetWorldRig());
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+
+	// ---- the fixture: a game-shaped room ---------------------------------------------------
+	// a 20 m floor, a 10 m wall 3 m ahead, a dynamic cube and a static podium in front of it
+	const ids = await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		for (let i = 0; i < 4; i++) s.commandsHandler.sceneCommand('/create box');
+		await new Promise((r) => setTimeout(r, 600));
+		const boxes = get(s.objectsGroup).children.filter((c) => c.name === 'Box');
+		const [floor, wall, cube, podium] = boxes;
+		floor.scale.set(20, 0.5, 20);
+		floor.position.set(0, -0.25, 0);
+		floor.userData.physics = { mode: 'static' };
+		wall.scale.set(10, 4, 0.5);
+		wall.position.set(0, 2, -3);
+		wall.userData.physics = { mode: 'static' };
+		cube.scale.setScalar(0.4);
+		cube.position.set(0, 1.2, -1.5);
+		cube.userData.physics = { mode: 'dynamic', mass: 1 };
+		podium.scale.setScalar(0.4);
+		podium.position.set(1.2, 1.2, -1.5);
+		podium.userData.physics = { mode: 'static' };
+		for (const b of boxes) b.updateMatrixWorld(true);
+		s.objectActions.deselectObject();
+		s.isVRMode.set(true);
+		return { floor: floor.uuid, wall: wall.uuid, cube: cube.uuid, podium: podium.uuid };
+	});
+	await A.page.waitForTimeout(800);
+	await xr.install(A.page);
+	// both hands aim straight ahead at the WALL (the only thing along -Z at y 1.6)
+	const aimWall = async () => {
+		await xr.pose(A.page, 'left', [-0.3, 1.6, 0]);
+		await xr.pose(A.page, 'right', [0.3, 1.6, 0]);
+	};
+	await aimWall();
+	await A.page.waitForTimeout(200);
+
+	// ---- 1. EDIT: two grips on the wall = the WORLD grab, not the wall ----------------------
+	let s = await state(A.page);
+	h.check(s.mode === 'edit' && Math.abs(s.rigScale - 1) < 1e-6, `premise: Edit, the world at 1:1 (${s.rigScale})`);
+	const wallBefore = await posOf(A.page, ids.wall);
+	await grip(A.page, 'left', true);
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === null, `Edit: a grip on a wall does not hold the wall (grab ${s.grab})`);
+	h.check(s.worldGrab, 'Edit: two grips on scenery start the two-grip WORLD grab');
+	// spread the hands: the world scales up
+	await xr.pose(A.page, 'left', [-0.6, 1.6, 0]);
+	await xr.pose(A.page, 'right', [0.6, 1.6, 0]);
+	await A.page.waitForTimeout(300);
+	s = await state(A.page);
+	h.check(s.rigScale > 1.8, `Edit: spreading the hands scales the world (x${s.rigScale.toFixed(2)})`);
+	const wallAfter = await posOf(A.page, ids.wall);
+	h.check(JSON.stringify(wallAfter) === JSON.stringify(wallBefore), 'Edit: the wall itself never moved');
+	await grip(A.page, 'left', false);
+	await grip(A.page, 'right', false);
+	await resetRig(A.page);
+	await aimWall();
+
+	// ---- 2. EDIT: one right grip on the floor = the one-hand world PAN --------------------------
+	await xr.pose(A.page, 'right', [0.3, 1.2, 0], { pitch: -Math.PI / 2 }); // straight down at the floor
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === null && s.worldPan, `Edit: a right grip on the floor pans the world (grab ${s.grab}, pan ${s.worldPan})`);
+	await grip(A.page, 'right', false);
+	await aimWall();
+
+	// ---- 3. EDIT: a grip on the cube still holds and moves it, as always -------------------------
+	await xr.pose(A.page, 'right', [0, 1.2, 0]); // aims -Z through the cube at (0,1.2,-1.5)
+	const undoBefore = (await state(A.page)).undo;
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === ids.cube && !s.grabInteract, `Edit: a grip on the cube holds it (${s.grab})`);
+	h.check(s.selected.includes(ids.cube), 'Edit: holding selects it (the editor lock)');
+	await xr.pose(A.page, 'right', [0.5, 1.2, 0]);
+	await A.page.waitForTimeout(250);
+	await grip(A.page, 'right', false);
+	const cubeMoved = await posOf(A.page, ids.cube);
+	h.check(Math.abs(cubeMoved[0] - 0.5) < 0.05, `Edit: the cube followed the hand (x ${cubeMoved[0].toFixed(2)})`);
+	s = await state(A.page);
+	if (undoBefore !== null) h.check(s.undo === undoBefore + 1, `Edit: the move is one undo entry (${undoBefore} -> ${s.undo})`);
+	await A.page.evaluate(() => window.__stores.objectActions.deselectObject());
+
+	// ---- 4. INTERACT: scenery and air do nothing — the world never moves ------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await aimWall();
+	await A.page.waitForTimeout(200);
+	await grip(A.page, 'left', true);
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === null && !s.worldGrab && !s.worldPan, `Interact: two grips on the wall hold nothing and start no world gesture (${JSON.stringify(s)})`);
+	await xr.pose(A.page, 'left', [-0.8, 1.6, 0]);
+	await xr.pose(A.page, 'right', [0.8, 1.6, 0]);
+	await A.page.waitForTimeout(300);
+	s = await state(A.page);
+	h.check(Math.abs(s.rigScale - 1) < 1e-6 && s.rigPos.every((v) => Math.abs(v) < 1e-6), `Interact: the world stays put (x${s.rigScale})`);
+	await grip(A.page, 'left', false);
+	await grip(A.page, 'right', false);
+
+	// ---- 5. INTERACT: the static podium is not holdable ------------------------------------------
+	await xr.pose(A.page, 'right', [1.2, 1.2, 0]);
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === null, `Interact: a static podium is not holdable (${s.grab})`);
+	await grip(A.page, 'right', false);
+
+	// ---- 6. INTERACT: the dynamic cube IS, as a player's hand -----------------------------------
+	const cubeNow = await posOf(A.page, ids.cube);
+	await xr.pose(A.page, 'right', [cubeNow[0], 1.2, 0]);
+	const undoInteract = (await state(A.page)).undo;
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.grab === ids.cube && s.grabInteract, `Interact: a grip holds the dynamic cube (${s.grab}, interact ${s.grabInteract})`);
+	h.check(!s.selected.includes(ids.cube), 'Interact: holding is not selecting (no editor lock)');
+	await xr.pose(A.page, 'right', [cubeNow[0] - 0.5, 1.2, 0]);
+	await A.page.waitForTimeout(250);
+	await grip(A.page, 'right', false);
+	const cubeThrown = await posOf(A.page, ids.cube);
+	h.check(Math.abs(cubeThrown[0] - (cubeNow[0] - 0.5)) < 0.05, `Interact: the cube followed the hand (x ${cubeThrown[0].toFixed(2)})`);
+	s = await state(A.page);
+	if (undoInteract !== null) h.check(s.undo === undoInteract, `Interact: a player's grab is not an undo step (${undoInteract} -> ${s.undo})`);
+
+	// ---- 7. back to EDIT: the world grab works again ---------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await aimWall();
+	await grip(A.page, 'left', true);
+	await grip(A.page, 'right', true);
+	s = await state(A.page);
+	h.check(s.worldGrab, 'back in Edit: two grips on the wall grab the world again');
+	await grip(A.page, 'left', false);
+	await grip(A.page, 'right', false);
+
+	await resetRig(A.page);
+	await xr.uninstall(A.page);
+	await A.page.evaluate(() => window.__stores.isVRMode.set(false));
+	await h.finish(browser);
+});
diff --git a/tests/e2e/vr-helper-eyes.test.cjs b/tests/e2e/vr-helper-eyes.test.cjs
new file mode 100644
index 00000000..1ed7b38c
--- /dev/null
+++ b/tests/e2e/vr-helper-eyes.test.cjs
@@ -0,0 +1,112 @@
+// 30b P0: THE ONE-EYE LIGHT HELPER. A Quest user saw the light-source helper in the
+// middle of Towers / Stars Room / Football "with one eye" while playing. The cause is a
+// layer number: helpers lived on render layer 1, and three's WebXRManager renders the two
+// eyes through sub-cameras whose masks it rewrites EVERY FRAME from the user camera's:
+//   cameraL.mask = (camera.mask | 0b110) & ~0b100   -> layer 1 ALWAYS on for the left eye
+//   cameraR.mask = (camera.mask | 0b110) & ~0b010   -> layer 1 always OFF for the right eye
+// so a layer-1 helper was drawn by the left eye whatever the editor camera enabled, and
+// never by the right one. Headless Chromium cannot present WebXR, so this suite computes
+// the two eye masks with three's own formula (and first asserts the installed three still
+// SAYS that formula, so a three upgrade that changes it turns this red instead of lying).
+//
+// The contract (C1): helpers draw in BOTH eyes in Edit and in NEITHER in Interact/Play.
+const fs = require('fs');
+const path = require('path');
+const h = require('./helpers.cjs');
+
+const XR_SOURCE = path.join(__dirname, '..', '..', 'node_modules', 'three', 'src', 'renderers', 'webxr', 'WebXRManager.js');
+
+/** what each eye camera would see of the scene-root light helper and its pick proxy */
+const eyes = (page) =>
+	page.evaluate(() => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		const THREE = s.THREE;
+		const cam = get(s.editorCam) || get(s.globalCamera);
+		const scene = get(s.globalScene);
+		const helper = scene.children.find((c) => /LightHelper$/.test(c.type || ''));
+		const proxy = scene.getObjectByName('light-proxy');
+		// WebXRManager.updateCamera, verbatim in bit form
+		const xrMask = cam.layers.mask | 0b110;
+		const left = new THREE.Layers();
+		left.mask = xrMask & ~0b100;
+		const right = new THREE.Layers();
+		right.mask = xrMask & ~0b010;
+		const sees = (eye, node) => !!node && eye.test(node.layers);
+		return {
+			layer: s.helperLayer.HELPER_LAYER,
+			helper: !!helper,
+			proxy: !!proxy,
+			leftHelper: sees(left, helper),
+			rightHelper: sees(right, helper),
+			leftProxy: sees(left, proxy),
+			rightProxy: sees(right, proxy),
+			desktop: !!helper && cam.layers.test(helper.layers),
+			mode: get(s.editorMode),
+			vr: get(s.isVRMode),
+			locked: get(s.isLocked)
+		};
+	});
+
+h.run(async () => {
+	// ---- 0. the premise: three still reserves layers 1/2 for the eyes -----------------
+	const src = fs.readFileSync(XR_SOURCE, 'utf8');
+	h.check(
+		/cameraL\.layers\.mask\s*=\s*cameraXR\.layers\.mask\s*&\s*~\s*0b100/.test(src) &&
+			/cameraR\.layers\.mask\s*=\s*cameraXR\.layers\.mask\s*&\s*~\s*0b010/.test(src) &&
+			/cameraXR\.layers\.mask\s*=\s*camera\.layers\.mask\s*\|\s*0b110/.test(src),
+		'premise: three WebXRManager still gives the left eye layer 1 and the right eye layer 2'
+	);
+
+	const browser = await h.launch();
+	const A = await h.setupPage(browser, 'A');
+	await A.page.evaluate(() => {
+		window.__stores.commandsHandler.sceneCommand('/light point');
+		window.__stores.objectActions.deselectObject();
+	});
+	await h.eventually(() => eyes(A.page), (e) => e.helper && e.proxy, 'a point light has its helper + pick proxy', 10000);
+
+	// ---- 1. Edit on the desktop --------------------------------------------------------
+	let e = await eyes(A.page);
+	h.check(e.layer !== 1 && e.layer !== 2, `the helper layer is not an XR eye layer (${e.layer})`);
+	h.check(e.mode === 'edit' && e.desktop, `Edit: the desktop editor camera draws the helper (${JSON.stringify(e)})`);
+	h.check(e.leftHelper && e.rightHelper, `Edit: BOTH eyes draw the light helper (L ${e.leftHelper} R ${e.rightHelper})`);
+	h.check(e.leftProxy && e.rightProxy, `Edit: BOTH eyes draw its pick proxy (L ${e.leftProxy} R ${e.rightProxy})`);
+
+	// ---- 2. Edit in VR (the headset keeps the editor camera, so the same answer) -------
+	await A.page.evaluate(() => window.__stores.isVRMode.set(true));
+	await A.page.waitForTimeout(200);
+	e = await eyes(A.page);
+	h.check(e.vr && e.leftHelper && e.rightHelper, `VR Edit: both eyes draw the helper (L ${e.leftHelper} R ${e.rightHelper})`);
+
+	// ---- 3. Interact in VR: neither eye ---------------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await A.page.waitForTimeout(200);
+	e = await eyes(A.page);
+	h.check(e.mode === 'interact' && !e.leftHelper && !e.rightHelper, `VR Interact: NEITHER eye draws the helper (L ${e.leftHelper} R ${e.rightHelper})`);
+	h.check(!e.leftProxy && !e.rightProxy, `VR Interact: neither eye draws the pick proxy (L ${e.leftProxy} R ${e.rightProxy})`);
+
+	// ---- 4. back to Edit in VR ------------------------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await A.page.waitForTimeout(200);
+	e = await eyes(A.page);
+	h.check(e.leftHelper && e.rightHelper, `VR back to Edit: both eyes again (L ${e.leftHelper} R ${e.rightHelper})`);
+	await A.page.evaluate(() => window.__stores.isVRMode.set(false));
+
+	// ---- 5. Interact on the desktop and desktop Play hide it too ---------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await A.page.waitForTimeout(200);
+	e = await eyes(A.page);
+	h.check(!e.desktop, 'desktop Interact: the editor camera no longer draws the helper');
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await A.page.evaluate(() => window.__stores.isLocked.set(true));
+	await A.page.waitForTimeout(200);
+	e = await eyes(A.page);
+	h.check(!e.leftHelper && !e.rightHelper, `Play: neither eye (L ${e.leftHelper} R ${e.rightHelper})`);
+	await A.page.evaluate(() => window.__stores.isLocked.set(false));
+	await A.page.waitForTimeout(400);
+	e = await eyes(A.page);
+	h.check(e.desktop && e.leftHelper && e.rightHelper, 'leaving Play: the helper is back for both eyes');
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/vr-mode-spawn.test.cjs b/tests/e2e/vr-mode-spawn.test.cjs
new file mode 100644
index 00000000..7937ffe4
--- /dev/null
+++ b/tests/e2e/vr-mode-spawn.test.cjs
@@ -0,0 +1,142 @@
+// 30b P4: ENTER INTERACT, SWITCH IN VR, SPAWN. The Quest report: "By default for games
+// there should be interact mode in VR, but I should be able to switch to edit mode" and
+// "When getting back to interactive mode, if the game should have a specific place where
+// the character should stand, it should move."
+//  · a VR session on a GAME lands in Interact (vrControls.onVRSessionStart),
+//  · the LEFT Y button toggles Edit <-> Interact, with a haptic tick and a wrist label,
+//  · entering Interact resets the world to 1:1 and puts the FEET on the spawn, facing it,
+//  · the spawn is the scene's `play.spawn`, overridden by a module's api.setSpawn,
+//  · desktop Play spawns the play camera there; desktop Interact flies the editor view.
+// Driven through the real per-frame path with a spec-accurate fake XR space (fakeXR.cjs).
+const h = require('./helpers.cjs');
+const xr = require('./fakeXR.cjs');
+
+const mode = (page) => page.evaluate(() => { let v; window.__stores.editorMode.subscribe((x) => (v = x))(); return v; });
+const near = (a, b, eps = 0.05) => Math.abs(a - b) < eps;
+const wrap = (a) => Math.atan2(Math.sin(a), Math.cos(a));
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	await A.page.evaluate(() => window.__stores.commandsHandler.sceneCommand('/create box'));
+	await A.page.waitForTimeout(400);
+
+	// ---- 0. no spawn, not a game: a session start keeps Edit --------------------------------
+	await A.page.evaluate(() => window.__stores.isVRMode.set(true));
+	await xr.install(A.page);
+	await xr.installSpace(A.page, { head: [0.4, 1.6, 0.2], yaw: 0.3 });
+	await A.page.evaluate(() => window.__stores.vrControls.onVRSessionStart());
+	h.check((await mode(A.page)) === 'edit', 'a plain scene: entering VR stays in Edit');
+	h.check(!(await A.page.evaluate(() => window.__stores.vrControls.sceneIsGame())), 'premise: the scene is not a game');
+
+	// ---- 1. a game (it names a spawn): entering VR lands in Interact, ON the spawn -------------
+	const SPAWN = { position: [3, 0, -4], yaw: Math.PI / 2 };
+	await A.page.evaluate((spawn) => window.__stores.scenePhysics.setScenePhysics({ play: { spawn } }), SPAWN);
+	// the world was left grabbed in Edit: Interact must put it back to 1:1
+	await A.page.evaluate(() => {
+		let rig;
+		window.__stores.worldRig.subscribe((x) => (rig = x))();
+		rig.scale.setScalar(2.5);
+		rig.position.set(1, 0, 1);
+		rig.updateMatrixWorld(true);
+	});
+	await A.page.evaluate(() => window.__stores.vrControls.onVRSessionStart());
+	await A.page.waitForTimeout(300);
+	h.check((await mode(A.page)) === 'interact', 'a game: entering VR lands in INTERACT');
+	let head = await xr.head(A.page);
+	h.check(near(head.x, 3) && near(head.z, -4), `the player stands ON the spawn (head ${head.x.toFixed(2)}, ${head.z.toFixed(2)})`);
+	h.check(near(head.y - 1.6, 0), `the FEET are at the spawn height (feet ${(head.y - 1.6).toFixed(2)})`);
+	h.check(near(wrap(head.yaw - SPAWN.yaw), 0, 0.02), `facing the spawn's yaw (${head.yaw.toFixed(3)})`);
+	const rig = await A.page.evaluate(() => { let r; window.__stores.worldRig.subscribe((x) => (r = x))(); return { s: r.scale.x, p: r.position.toArray() }; });
+	h.check(rig.s === 1 && rig.p.every((v) => v === 0), `Interact put the world back to 1:1 (${JSON.stringify(rig)})`);
+
+	// ---- 2. the LEFT Y button: to Edit, with a tick and the label -------------------------------
+	let label = await A.page.evaluate(() => window.__stores.vrControls.vrModeLabelDebug());
+	h.check(label.visible && label.text === 'INTERACT' && label.hand === 'left', `the wrist label says INTERACT on the left hand (${JSON.stringify(label)})`);
+	const before = await xr.pulses(A.page);
+	await xr.button(A.page, 'left', 5, true);
+	await A.page.waitForTimeout(200);
+	await xr.button(A.page, 'left', 5, false);
+	await A.page.waitForTimeout(200);
+	h.check((await mode(A.page)) === 'edit', 'left Y: Interact -> Edit');
+	const after = await xr.pulses(A.page);
+	h.check(after.left === before.left + 1, `a haptic tick on the left hand (${before.left} -> ${after.left})`);
+	label = await A.page.evaluate(() => window.__stores.vrControls.vrModeLabelDebug());
+	h.check(label.text === 'EDIT', `the label follows: ${label.text}`);
+	h.check(!(await A.page.evaluate(() => { let v; window.__stores.vrMenuOpen.subscribe((x) => (v = x))(); return v; })), 'the radial menu (right B by default) did not open');
+
+	// walk away in Edit, then Y again: Interact puts you back on the spawn
+	await A.page.evaluate(() => {
+		const r = window.__fakeXR.renderer;
+		r.xr.setReferenceSpace(r.xr.getReferenceSpace().getOffsetReferenceSpace(new XRRigidTransform({ x: -2, y: 0, z: 3 })));
+	});
+	head = await xr.head(A.page);
+	h.check(!near(head.x, 3), `premise: moved off the spawn in Edit (x ${head.x.toFixed(2)})`);
+	await xr.button(A.page, 'left', 5, true);
+	await A.page.waitForTimeout(200);
+	await xr.button(A.page, 'left', 5, false);
+	await A.page.waitForTimeout(200);
+	head = await xr.head(A.page);
+	h.check((await mode(A.page)) === 'interact' && near(head.x, 3) && near(head.z, -4), `left Y back to Interact re-spawns (${head.x.toFixed(2)}, ${head.z.toFixed(2)})`);
+
+	// ---- 3. a menu on the LEFT hand moves the mode button to the right B ----------------------
+	await A.page.evaluate(() => window.__stores.vrMenuHand.set('left'));
+	await xr.button(A.page, 'right', 5, true);
+	await A.page.waitForTimeout(200);
+	await xr.button(A.page, 'right', 5, false);
+	await A.page.waitForTimeout(200);
+	h.check((await mode(A.page)) === 'edit', 'menu on the left: the RIGHT B toggles the mode');
+	await A.page.evaluate(() => window.__stores.vrMenuHand.set('right'));
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+
+	// ---- 4. a module's api.setSpawn overrides the scene's; teleport moves you now --------------
+	await A.page.evaluate(() => {
+		window.__stores.moduleSDK.initModules([{ id: 'spawntest', name: 'Spawn test', version: '1', register(api) { window.__spawnApi = api; } }]);
+	});
+	const ok = await A.page.evaluate(() => window.__spawnApi.setSpawn([-5, 0, 2], Math.PI));
+	h.check(ok === true, 'api.setSpawn accepts [x, y, z] + yaw');
+	head = await xr.head(A.page);
+	h.check(near(head.x, 3), 'without {teleport} a new spawn is a checkpoint: nobody moves yet');
+	await A.page.evaluate(() => window.__spawnApi.setSpawn([-5, 0, 2], Math.PI, { teleport: true }));
+	await A.page.waitForTimeout(100);
+	head = await xr.head(A.page);
+	h.check(near(head.x, -5) && near(head.z, 2) && near(head.y, 1.6), `{teleport: true} moves the player there now (${head.x.toFixed(2)}, ${head.y.toFixed(2)}, ${head.z.toFixed(2)})`);
+	h.check(near(Math.abs(wrap(head.yaw)), Math.PI, 0.02), `...facing the module's yaw (${head.yaw.toFixed(3)})`);
+	h.check(!(await A.page.evaluate(() => window.__spawnApi.setSpawn([1, NaN, 2]))), 'a malformed spawn is refused');
+	await A.page.evaluate(() => window.__stores.moduleSDK.deactivateModule('spawntest'));
+	const back = await A.page.evaluate(() => window.__stores.playSettings.resolvePlaySettings((() => { let v; window.__stores.globalScene.subscribe((x) => (v = x))(); return v; })()).spawn);
+	h.check(back && back.position[0] === 3, `disabling the module drops its spawn: the scene's is back (${JSON.stringify(back)})`);
+
+	await xr.uninstall(A.page);
+	await A.page.evaluate(() => window.__stores.isVRMode.set(false));
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	await A.page.waitForTimeout(300);
+
+	// ---- 5. desktop Play spawns the play camera on the scene's spawn ------------------------------
+	await A.page.evaluate(() => window.__stores.isLocked.set(true));
+	await A.page.waitForTimeout(500);
+	const cam = await A.page.evaluate(() => {
+		let c;
+		window.__stores.playerCam.subscribe((x) => (c = x))();
+		const THREE = window.__stores.THREE;
+		const p = c.getWorldPosition(new THREE.Vector3());
+		const f = new THREE.Vector3(0, 0, -1).applyQuaternion(c.getWorldQuaternion(new THREE.Quaternion()));
+		return { p: p.toArray(), yaw: Math.atan2(-f.x, -f.z) };
+	});
+	h.check(near(cam.p[0], 3) && near(cam.p[2], -4) && near(cam.p[1], 1.7), `desktop Play: the camera's eye is on the spawn (${cam.p.map((v) => v.toFixed(2))})`);
+	h.check(near(wrap(cam.yaw - SPAWN.yaw), 0, 0.02), `desktop Play: facing the spawn's yaw (${cam.yaw.toFixed(3)})`);
+	await A.page.evaluate(() => window.__stores.isLocked.set(false));
+	await A.page.waitForTimeout(400);
+
+	// ---- 6. desktop Interact flies the editor view there --------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await A.page.waitForTimeout(900);
+	const ed = await A.page.evaluate(() => { let c; window.__stores.globalCamera.subscribe((x) => (c = x))(); return c.position.toArray(); });
+	h.check(near(ed[0], 3, 0.2) && near(ed[2], -4, 0.2), `desktop Interact: the editor view moved to the spawn (${ed.map((v) => v.toFixed(2))})`);
+	await A.page.evaluate(() => {
+		window.__stores.objectActions.setEditorMode('edit');
+		window.__stores.scenePhysics.setScenePhysics({ play: { spawn: null } });
+	});
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/vr-sweep.test.cjs b/tests/e2e/vr-sweep.test.cjs
new file mode 100644
index 00000000..7558f9cd
--- /dev/null
+++ b/tests/e2e/vr-sweep.test.cjs
@@ -0,0 +1,508 @@
+// 30b (vr-play) P4 — C3 HOLD THE TRIGGER AND SWEEP. The user, on a Quest 3: "I want to be able
+// to hold trigger and automatically press the buttons where I move the controller around. So,
+// for example, I can hit different keys on piano holding trigger and on the mixer
+// enable/disable, toggle multiple knobs."
+//
+// Headless: controllers are posed by hand (matrixAutoUpdate on), the press goes through the
+// REAL trigger hooks (vrModuleTriggerStart / End / SelectSwallowed) and each frame through the
+// exported sweepFrame, with the tip / laser injected.
+// 1 the tip clicks every key it ENTERS, once, the first as the 'trigger' press · 2 leaving
+// re-arms · 3 a {sweep: false} handler hears the press and never a sweep · 4 the release is
+// swallowed after a sweep, and only then · 5 the LASER sweeps what the tip cannot reach ·
+// 6 a press another gesture CLAIMED is left alone · 7 Edit mode: no sweep, the old path ·
+// 8 the game board's buttons sweep too · 9 an Interact release on a plain object CLICKS and
+// never selects · 10 the REAL Jam Room: a sweep across piano keys plays each, across drum
+// steps flips each.
+const h = require('./helpers.cjs');
+const fs = require('fs');
+const path = require('path');
+
+const SCENES_REPO = [path.resolve(__dirname, '../../../theprototype.app-scenes'), path.resolve(__dirname, '../../../scenes')].find((p) =>
+	fs.existsSync(p)
+);
+const JAM = process.env.JAM_ROOM_TPSCENE || (SCENES_REPO && path.join(SCENES_REPO, 'games/jam-room/scene.tpscene'));
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.AUDIO_ARGS });
+	const A = await h.setupPage(browser, 'A');
+	const page = A.page;
+
+	await page.evaluate(async () => {
+		const s = window.__stores;
+		window.__log = [];
+		await s.moduleSDK.initModules([
+			{
+				id: 'sweep30b',
+				name: 'Sweep test',
+				version: '1.0.0',
+				description: 'the 30b sweep',
+				register(api) {
+					window.__api = api;
+					// a keyboard of five keys: this handler plays them, sweeps included
+					api.registerClickHandler((object, ctx) => {
+						if (!object.userData?.sweepKey) return false;
+						window.__log.push({ key: object.userData.sweepKey, source: ctx?.source, mode: ctx?.mode });
+						return true;
+					});
+					// a dot you CARRY: it must hear the press and never a sweep
+					api.registerClickHandler(
+						(object, ctx) => {
+							if (!object.userData?.dot) return false;
+							window.__log.push({ key: 'dot', source: ctx?.source });
+							return true;
+						},
+						{ sweep: false }
+					);
+				}
+			}
+		]);
+		let r;
+		s.globalRenderer.subscribe((v) => (r = v))();
+		for (const i of [0, 1]) {
+			const c = r.xr.getController(i);
+			c.matrixAutoUpdate = true;
+			c.userData.handedness = i === 0 ? 'left' : 'right';
+		}
+		// five keys in a row, 12 cm apart, marked clickable, at hand height
+		const THREE = s.THREE;
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const keys = [];
+		for (let i = 0; i < 5; i++) {
+			const [uuid] = await window.__api.create('/create box 0.08 0.04 0.2', { at: [-0.24 + i * 0.12, 1.0, -0.5] });
+			keys.push(uuid);
+		}
+		const [dot] = await window.__api.create('/create box 0.08 0.08 0.08', { at: [0.5, 1.0, -0.5] });
+		const [plain] = await window.__api.create('/create box 0.3 0.3 0.3', { at: [0, 1.2, -3] });
+		await new Promise((res) => setTimeout(res, 600));
+		keys.forEach((uuid, i) => {
+			const o = g.getObjectByProperty('uuid', uuid);
+			o.userData.clickable = true;
+			o.traverse((n) => n.isMesh && (n.userData.sweepKey = 'k' + i));
+			o.userData.physics = { mode: 'static' };
+		});
+		const d = g.getObjectByProperty('uuid', dot);
+		d.userData.clickable = true;
+		d.traverse((n) => n.isMesh && (n.userData.dot = true));
+		g.updateMatrixWorld(true);
+		window.__ids = { keys, dot, plain };
+		s.objectActions.deselectObject?.();
+		s.objectActions.setEditorMode('interact');
+		window.__T = {
+			keyAt: (i) => g.getObjectByProperty('uuid', keys[i]).getWorldPosition(new THREE.Vector3()),
+			aim: (index, from, to) => {
+				const c = r.xr.getController(index);
+				c.position.copy(from);
+				c.lookAt(from.clone().multiplyScalar(2).sub(to)); // a Group's +Z faces the target
+				c.updateMatrixWorld(true);
+			},
+			// a sweep frame with the TIP at a point and no laser
+			tipFrame: (index, point) => s.gameKit.vrGameInput.sweepFrame(index, { tip: point, ray: null }),
+			press: (index) => s.vrControls.vrModuleTriggerStart(index),
+			release: (index) => ({ swallowed: s.vrControls.vrModuleSelectSwallowed(), end: s.vrControls.vrModuleTriggerEnd(index) })
+		};
+	});
+	const log = () => page.evaluate(() => window.__log.splice(0));
+
+	console.log('\n=== 1. the tip clicks every key it enters, once ===');
+	const run1 = await page.evaluate(() => {
+		const T = window.__T;
+		const THREE = window.__stores.THREE;
+		const above = (i) => T.keyAt(i).add(new THREE.Vector3(0, 0.035, 0)); // just touching the top
+		T.aim(1, above(0).add(new THREE.Vector3(0, 0.05, 0.2)), above(0));
+		const consumed = T.press(1);
+		const frames = [];
+		frames.push(T.tipFrame(1, above(0))); // the press itself
+		frames.push(T.tipFrame(1, above(0))); // still on k0
+		frames.push(T.tipFrame(1, above(1)));
+		frames.push(T.tipFrame(1, above(1)));
+		frames.push(T.tipFrame(1, above(2)));
+		frames.push(T.tipFrame(1, above(3)));
+		return { consumed, frames };
+	});
+	const l1 = await log();
+	h.check(run1.consumed === false, '1.1 the press is NOT consumed by the sweep (other gestures may still take it)');
+	h.check(JSON.stringify(l1.map((e) => e.key)) === JSON.stringify(['k0', 'k1', 'k2', 'k3']), '1.2 four keys entered, four clicks, each once (' + JSON.stringify(l1.map((e) => e.key)) + ')');
+	h.check(l1[0]?.source === 'trigger' && l1.slice(1).every((e) => e.source === 'sweep'), '1.3 the first is the press (trigger), the rest are sweeps (' + l1.map((e) => e.source) + ')');
+	h.check(l1.every((e) => e.mode === 'interact'), '1.4 dispatched as Interact clicks');
+
+	console.log('\n=== 2. leaving re-arms ===');
+	const run2 = await page.evaluate(() => {
+		const T = window.__T;
+		const THREE = window.__stores.THREE;
+		const above = (i) => T.keyAt(i).add(new THREE.Vector3(0, 0.035, 0));
+		T.tipFrame(1, above(3).add(new THREE.Vector3(0, 0.3, 0))); // lift off
+		T.tipFrame(1, above(3)); // back down on k3
+		T.tipFrame(1, above(2)); // and k2 again
+	});
+	void run2;
+	const l2 = await log();
+	h.check(JSON.stringify(l2.map((e) => e.key)) === JSON.stringify(['k3', 'k2']), '2.1 lifting off and coming back plays the key again (' + JSON.stringify(l2.map((e) => e.key)) + ')');
+
+	console.log('\n=== 3. {sweep: false} hears the press, never a sweep ===');
+	const dotRun = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		const dot = s.gameKit.vrGameInput;
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const at = g.getObjectByProperty('uuid', window.__ids.dot).getWorldPosition(new THREE.Vector3());
+		T.release(1);
+		window.__log.splice(0);
+		// a held press that starts on k4 (premise: it plays), then is swept INTO the dot
+		const k4 = T.keyAt(4).add(new THREE.Vector3(0, 0.035, 0));
+		T.aim(1, k4.clone().add(new THREE.Vector3(0, 0.05, 0.2)), k4);
+		T.press(1);
+		T.tipFrame(1, k4);
+		T.tipFrame(1, at.clone());
+		const swept = window.__log.splice(0);
+		T.release(1);
+		// pressed ON the dot: heard
+		T.aim(1, at.clone().add(new THREE.Vector3(0, 0.05, 0.2)), at);
+		T.press(1);
+		T.tipFrame(1, at.clone());
+		const pressed = window.__log.splice(0);
+		T.release(1);
+		return { swept, pressed, live: dot.sweepLive(1) };
+	});
+	h.check(
+		dotRun.swept.length === 1 && dotRun.swept[0].key === 'k4',
+		'3.1 a held sweep plays k4, then passes into the {sweep:false} dot without clicking it (' + JSON.stringify(dotRun.swept) + ')'
+	);
+	h.check(dotRun.pressed.length === 1 && dotRun.pressed[0].source === 'trigger', '3.2 a press ON it does (' + JSON.stringify(dotRun.pressed) + ')');
+	h.check(dotRun.live === false, '3.3 the release ended the sweep');
+
+	console.log('\n=== 4. the release is swallowed after a sweep, and only then ===');
+	const sw = await page.evaluate(() => {
+		const T = window.__T;
+		const THREE = window.__stores.THREE;
+		const above = (i) => T.keyAt(i).add(new THREE.Vector3(0, 0.035, 0));
+		T.press(1);
+		T.tipFrame(1, above(4));
+		const after = T.release(1);
+		window.__log.splice(0);
+		T.press(1);
+		T.tipFrame(1, new THREE.Vector3(3, 3, 3)); // nothing there
+		const empty = T.release(1);
+		return { after: after.swallowed, empty: empty.swallowed };
+	});
+	h.check(sw.after === true, '4.1 a press that swept something swallows its trailing select');
+	h.check(sw.empty === false, '4.2 a press that clicked nothing lets its select through');
+
+	console.log('\n=== 5. the laser sweeps what the tip cannot reach ===');
+	const laser = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		const k = s.gameKit.vrGameInput;
+		const from = new THREE.Vector3(0, 1.6, 1.5);
+		T.aim(1, from, T.keyAt(0));
+		T.press(1);
+		const hits = [];
+		for (let i = 0; i < 5; i++) {
+			T.aim(1, from, T.keyAt(i));
+			hits.push(k.sweepFrame(1, { tip: from.clone() }));
+			T.aim(1, from, T.keyAt(i)); // a second frame on the same key
+			hits.push(k.sweepFrame(1, { tip: from.clone() }));
+		}
+		const r = T.release(1);
+		return { hits, swallowed: r.swallowed, log: window.__log.splice(0) };
+	});
+	h.check(JSON.stringify(laser.log.map((e) => e.key)) === JSON.stringify(['k0', 'k1', 'k2', 'k3', 'k4']), '5.1 the laser, held and moved along the row from 2 m, clicks each key once (' + JSON.stringify(laser.log.map((e) => e.key)) + ')');
+	h.check(laser.swallowed === true, '5.2 and swallows its release');
+
+	console.log('\n=== 6. a press another gesture claimed is left alone ===');
+	const claimed = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		const above = (i) => T.keyAt(i).add(new THREE.Vector3(0, 0.035, 0));
+		// a knob-drag-like hook registered AFTER ours: it takes this press
+		const off = s.vrControls.registerVRTriggerHooks({ start: () => true });
+		const consumed = T.press(1);
+		const frame = T.tipFrame(1, above(1));
+		const live = s.gameKit.vrGameInput.sweepLive(1);
+		off();
+		T.release(1);
+		return { consumed, frame, live, log: window.__log.splice(0) };
+	});
+	h.check(claimed.consumed === true && claimed.log.length === 0 && claimed.live === false, '6.1 the sweep stands down under a claimed gesture (' + JSON.stringify(claimed) + ')');
+
+	console.log('\n=== 7. Edit mode: no sweep ===');
+	const edit = await page.evaluate(() => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		const above = (i) => T.keyAt(i).add(new THREE.Vector3(0, 0.035, 0));
+		s.objectActions.setEditorMode('edit');
+		const consumed = T.press(1);
+		const frame = T.tipFrame(1, above(0));
+		const r = T.release(1);
+		s.objectActions.setEditorMode('interact');
+		return { consumed, frame, swallowed: r.swallowed, log: window.__log.splice(0) };
+	});
+	h.check(edit.consumed === false && edit.frame === null && edit.log.length === 0 && edit.swallowed === false, '7.1 in Edit a held trigger sweeps nothing and the select passes (' + JSON.stringify(edit) + ')');
+
+	console.log('\n=== 8. the game board\'s buttons sweep too ===');
+	const board = await page.evaluate(async () => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		s.hudDocs.setHudDocFor('scene', {
+			active: 'pads',
+			screens: [
+				{
+					id: 'pads',
+					name: 'Pads',
+					input: 'menu',
+					elements: [0, 1, 2].map((i) => ({ id: 'pad' + i, kind: 'toggle', anchor: 'center', x: -220 + i * 220, y: 0, w: 180, h: 80, label: 'Pad ' + (i + 1), value: false }))
+				}
+			]
+		});
+		const k = s.gameKit.vrGamePanel;
+		const head = { position: new THREE.Vector3(0, 1.6, 0), quaternion: new THREE.Quaternion() };
+		k.hideVrGamePanel();
+		k.vrGamePanelFrame({ head, hands: [null, null] });
+		const surf = k.vrGameSurface('vr-game-panel');
+		const pt = (id) => {
+			const rect = k.vrGamePanelDebug().hits['vr-game-panel'].find((x) => x.id === id);
+			const g = surf.mesh.geometry.parameters;
+			return surf.mesh.localToWorld(new THREE.Vector3(((rect.x + rect.w / 2) / surf.canvas.width - 0.5) * g.width, (0.5 - (rect.y + rect.h / 2) / surf.canvas.height) * g.height, 0));
+		};
+		const from = new THREE.Vector3(0.2, 1.3, -0.3);
+		T.aim(1, from, pt('pad0'));
+		const consumed = T.press(1);
+		for (const id of ['pad0', 'pad1', 'pad1', 'pad2']) {
+			T.aim(1, from, pt(id));
+			s.gameKit.vrGameInput.sweepFrame(1, { tip: from.clone() });
+		}
+		const r = T.release(1);
+		const values = [0, 1, 2].map((i) => s.hudDocs.hudValueOf('pad' + i, false));
+		s.hudDocs.setHudDocFor('scene', null);
+		k.hideVrGamePanel();
+		return { consumed, values, swallowed: r.swallowed };
+	});
+	h.check(board.consumed === true && JSON.stringify(board.values) === '[true,true,true]', '8.1 one press swept across three board toggles flips each once (' + JSON.stringify(board) + ')');
+
+	console.log('\n=== 9. an Interact release on a plain object clicks, never selects ===');
+	const release = await page.evaluate(async () => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		let r, g;
+		s.globalRenderer.subscribe((v) => (r = v))();
+		s.objectsGroup.subscribe((v) => (g = v))();
+		const target = g.getObjectByProperty('uuid', window.__ids.plain).getWorldPosition(new THREE.Vector3());
+		const c = r.xr.getController(1);
+		T.aim(1, new THREE.Vector3(0, 1.4, 0), target);
+		s.objectActions.deselectObject?.();
+		const sel = () => {
+			let v;
+			s.selectedObjects.subscribe((x) => (v = x))();
+			return [...v];
+		};
+		c.dispatchEvent({ type: 'select', target: c });
+		const inInteract = sel();
+		s.objectActions.setEditorMode('edit');
+		c.dispatchEvent({ type: 'select', target: c });
+		const inEdit = sel();
+		s.objectActions.deselectObject?.();
+		s.objectActions.setEditorMode('interact');
+		return { inInteract, inEdit, plain: window.__ids.plain };
+	});
+	h.check(release.inInteract.length === 0, '9.1 in Interact the VR release selected nothing (' + JSON.stringify(release.inInteract) + ')');
+	h.check(release.inEdit.includes(release.plain), '9.2 in Edit the same release selects it, as before');
+
+	console.log('\n=== 11. a real-width keyboard: the tip plays the key it is NEAREST ===');
+	const narrow = await page.evaluate(async () => {
+		const s = window.__stores;
+		const T = window.__T;
+		const THREE = s.THREE;
+		let g;
+		s.objectsGroup.subscribe((v) => (g = v))();
+		// seven keys 2.2 cm wide on a 2.4 cm pitch — narrower than the 6 cm tip, like a piano
+		const keys = [];
+		for (let i = 0; i < 7; i++) {
+			const [uuid] = await window.__api.create('/create box 0.022 0.02 0.12', { at: [-0.072 + i * 0.024, 1.3, -0.8] });
+			keys.push(uuid);
+		}
+		await new Promise((res) => setTimeout(res, 600));
+		keys.forEach((uuid, i) => {
+			const o = g.getObjectByProperty('uuid', uuid);
+			o.userData.clickable = true;
+			o.userData.physics = { mode: 'static' };
+			o.traverse((n) => n.isMesh && (n.userData.sweepKey = 'n' + i));
+		});
+		g.updateMatrixWorld(true);
+		window.__log.splice(0);
+		const top = (i) => g.getObjectByProperty('uuid', keys[i]).getWorldPosition(new THREE.Vector3()).add(new THREE.Vector3(0, 0.012, 0));
+		T.aim(1, top(1).add(new THREE.Vector3(0, 0.05, 0.2)), top(1));
+		T.press(1);
+		// glide along the keys, several frames per key, centred over keys 1..5
+		for (let i = 1; i <= 5; i++) for (let f = 0; f < 3; f++) T.tipFrame(1, top(i));
+		T.release(1);
+		return window.__log.splice(0).map((e) => e.key);
+	});
+	h.check(JSON.stringify(narrow) === JSON.stringify(['n1', 'n2', 'n3', 'n4', 'n5']), '11.1 gliding over five 2.2 cm keys plays those five, one each, no clusters (' + JSON.stringify(narrow) + ')');
+
+	console.log('\n=== 10. the REAL Jam Room: piano keys and drum steps ===');
+	const zip = (id) => h.installModule(A, id);
+	if (!JAM || !fs.existsSync(JAM)) console.log('SKIP 10: no games/jam-room/scene.tpscene');
+	else if (!(await zip('music-lab')) || !(await zip('music-fx'))) console.log('SKIP 10: no music-lab / music-fx zips');
+	else {
+		await page.evaluate(() => window.__stores.modulesOpen.set(false));
+		const bytes = Array.from(fs.readFileSync(JAM));
+		await page.evaluate(async (arr) => {
+			const s = window.__stores;
+			const payload = await s.sessions.readSessionZip(new Uint8Array(arr).buffer);
+			await s.sessions.applySession(payload, { backup: false });
+		}, bytes);
+		await page.waitForTimeout(3000);
+		const jam = await page.evaluate(async () => {
+			const s = window.__stores;
+			const THREE = s.THREE;
+			s.objectActions.setEditorMode('interact');
+			let g;
+			s.objectsGroup.subscribe((v) => (g = v))();
+			g.updateMatrixWorld(true);
+			// every piano key, in order of x; every drum STEP cell of the first row
+			const keys = [];
+			const steps = [];
+			g.traverse((o) => {
+				if (!o.isMesh) return;
+				if (/^key-\d+$/.test(o.name) || typeof o.userData?.midi === 'number') keys.push(o);
+				if (/step/i.test(o.name) && o.parent) steps.push(o);
+			});
+			keys.sort((a, b) => a.getWorldPosition(new THREE.Vector3()).x - b.getWorldPosition(new THREE.Vector3()).x);
+			// spy the dispatch: which handler consumed which mesh, with which source
+			const consumed = [];
+			const handlers = s.moduleSDK.moduleClickHandlers;
+			for (let i = 0; i < handlers.length; i++) {
+				const fn = handlers[i];
+				if (fn.__spied) continue;
+				const wrapped = (o, ctx) => {
+					const r = fn(o, ctx);
+					if (r) consumed.push({ name: o.name, source: ctx?.source });
+					return r;
+				};
+				wrapped.__spied = true;
+				handlers[i] = wrapped;
+			}
+			const T = window.__T;
+			const topOf = (o) => {
+				const b = new THREE.Box3().setFromObject(o);
+				return new THREE.Vector3((b.min.x + b.max.x) / 2, b.max.y + 0.01, (b.min.z + b.max.z) / 2);
+			};
+			// three neighbouring WHITE keys: the tip plays whichever it is nearest
+			const white = keys.filter((k) => ![1, 3, 6, 8, 10].includes(((Number(k.userData?.midi ?? k.name.slice(4)) % 12) + 12) % 12));
+			const pick = [white[2], white[3], white[4]].filter(Boolean);
+			T.aim(1, topOf(pick[0]).add(new THREE.Vector3(0, 0.05, 0.2)), topOf(pick[0]));
+			T.press(1);
+			for (const key of pick) {
+				T.tipFrame(1, topOf(key));
+				T.tipFrame(1, topOf(key));
+			}
+			T.release(1);
+			const keyClicks = consumed.splice(0);
+			// the drum machine: the step cells of one row, swept left to right
+			const drums = [];
+			g.traverse((o) => {
+				if (o.userData?.device?.kind && /drums/.test(o.userData.device.kind)) drums.push(o);
+			});
+			const drum = drums[0];
+			const patternOf = () => String(drum?.userData?.device?.params?.pattern ?? '');
+			const cells = [];
+			drum?.traverse((o) => o.isMesh && /^step-\d+-\d+$/.test(o.name) && cells.push(o));
+			// one row (pad 0), every other step, so the tip never sits on two cells at once
+			const cellPick = cells
+				.filter((c) => c.name.startsWith('step-0-'))
+				.sort((a, b) => Number(a.name.split('-')[2]) - Number(b.name.split('-')[2]))
+				.filter((c) => Number(c.name.split('-')[2]) % 2 === 0)
+				.slice(0, 3);
+			const before = patternOf();
+			if (cellPick[0]) {
+				T.aim(1, topOf(cellPick[0]).add(new THREE.Vector3(0, 0.05, 0.2)), topOf(cellPick[0]));
+				T.press(1);
+				for (const cell of cellPick) T.tipFrame(1, topOf(cell));
+				T.release(1);
+			}
+			await new Promise((r) => setTimeout(r, 1500)); // the stroke commits after it idles
+			const after = patternOf();
+			let diff = 0;
+			for (let i = 0; i < Math.max(before.length, after.length); i++) if (before[i] !== after[i]) diff++;
+			return {
+				keys: keys.length,
+				picked: pick.map((k) => k.name),
+				keyClicks,
+				cells: cells.length,
+				cellNames: cellPick.map((c) => c.name),
+				stepClicks: consumed.splice(0),
+				diff,
+				before: before.slice(0, 20),
+				after: after.slice(0, 20)
+			};
+		});
+		h.check(jam.keys > 10, '10.1 premise: the Jam Room piano is there (' + jam.keys + ' keys)');
+		h.check(
+			jam.keyClicks.length === 3 && jam.keyClicks.every((c, i) => c.name === jam.picked[i]) && jam.keyClicks[0].source === 'trigger' && jam.keyClicks[2].source === 'sweep',
+			'10.2 one held sweep across three piano keys plays each, once (' + JSON.stringify(jam.keyClicks) + ')'
+		);
+		h.check(jam.stepClicks.length === 3 && jam.diff >= 3, '10.3 a sweep across three drum steps flips each (' + JSON.stringify({ cells: jam.cellNames, clicks: jam.stepClicks.length, diff: jam.diff }) + ')');
+		// the Quest ask: "on the mixer enable/disable" — music-fx 0.2.0's mute BUTTONS and the
+		// pedals' FOOTSWITCHES answer a click, so one held sweep flips each it passes
+		const fx = await page.evaluate(async () => {
+			const s = window.__stores;
+			const THREE = s.THREE;
+			const T = window.__T;
+			let g;
+			s.objectsGroup.subscribe((v) => (g = v))();
+			g.updateMatrixWorld(true);
+			const topOf = (o) => {
+				const b = new THREE.Box3().setFromObject(o);
+				return new THREE.Vector3((b.min.x + b.max.x) / 2, b.max.y + 0.005, (b.min.z + b.max.z) / 2);
+			};
+			const devices = [];
+			g.traverse((o) => o.userData?.device?.kind?.startsWith?.('mod-music-fx-') && devices.push(o));
+			const mixer = devices.find((d) => d.userData.device.kind === 'mod-music-fx-mixer');
+			const pedals = devices.filter((d) => d !== mixer).sort((a, b) => a.getWorldPosition(new THREE.Vector3()).z - b.getWorldPosition(new THREE.Vector3()).z);
+			const params = (d) => ({ ...(s.audioDevices.deviceOf(d)?.params ?? d.userData.device.params ?? {}) });
+			const mutes = ['mute-1', 'mute-2', 'mute-3'].map((n) => mixer?.getObjectByName(n)).filter(Boolean);
+			const muteBefore = mixer ? params(mixer) : {};
+			if (mutes.length === 3) {
+				T.aim(1, topOf(mutes[0]).add(new THREE.Vector3(0, 0.05, 0.2)), topOf(mutes[0]));
+				T.press(1);
+				for (const m of mutes) {
+					T.tipFrame(1, topOf(m));
+					T.tipFrame(1, topOf(m));
+				}
+				T.release(1);
+			}
+			const switches = pedals.slice(0, 2).map((p) => p.getObjectByName('footswitch')).filter(Boolean);
+			const bypassBefore = pedals.slice(0, 2).map((p) => !!params(p).bypass);
+			if (switches.length === 2) {
+				T.aim(1, topOf(switches[0]).add(new THREE.Vector3(0, 0.05, 0.2)), topOf(switches[0]));
+				T.press(1);
+				for (const sw of switches) {
+					T.tipFrame(1, topOf(sw));
+					T.tipFrame(1, topOf(sw));
+				}
+				T.release(1);
+			}
+			await new Promise((r) => setTimeout(r, 600));
+			const muteAfter = mixer ? params(mixer) : {};
+			return {
+				mixer: !!mixer,
+				mutes: mutes.length,
+				muted: [1, 2, 3].map((i) => !!muteAfter['mute' + i] !== !!muteBefore['mute' + i]),
+				pedals: pedals.length,
+				switches: switches.length,
+				stomped: pedals.slice(0, 2).map((p, i) => !!params(p).bypass !== bypassBefore[i])
+			};
+		});
+		h.check(fx.mixer && fx.mutes === 3 && fx.muted.every(Boolean), '10.4 one held sweep across three mixer MUTE buttons flips each channel (' + JSON.stringify(fx) + ')');
+		h.check(fx.switches === 2 && fx.stomped.every(Boolean), '10.5 a sweep over two pedals\' FOOTSWITCHES stomps each (music-fx 0.2.0)');
+	}
+
+	await h.finish(browser);
+});
diff --git a/tests/e2e/vr-walk-interact.test.cjs b/tests/e2e/vr-walk-interact.test.cjs
new file mode 100644
index 00000000..572ce28f
--- /dev/null
+++ b/tests/e2e/vr-walk-interact.test.cjs
@@ -0,0 +1,169 @@
+// 30b P3: WALK LIKE A GAME. The Quest report (the dungeon): "I can go through walls,
+// teleport, I want to be able to do this only in edit mode and fly only in edit mode. In
+// interactive mode I should be able to move like in a game, without going through walls."
+// Interact's stick now walks: the step resolves through charController.resolveWalk (the
+// rapier capsule while a sim runs), gravity holds the feet on the floor, a ~0.3 m step is
+// climbed, and teleport/fly are off unless the play block allows them. Edit is unchanged
+// (it flies, through walls, and teleports).
+//
+// Section 1 drives the walker step with a REAL rapier world; section 2 drives the REAL
+// per-frame path (VRControls' task) through a fake XR session whose reference space
+// composes offsets exactly as WebXR specifies (fakeXR.installSpace).
+// Desktop Play's built-in flier gets the same walls (section 4).
+const h = require('./helpers.cjs');
+const xr = require('./fakeXR.cjs');
+
+h.run(async () => {
+	const browser = await h.launch({ args: h.GPU_ARGS });
+	const A = await h.setupPage(browser, 'A');
+
+	// ---- the fixture: floor (top 0), a wall ahead, a 0.25 m step, a 0.6 m block --------------
+	await A.page.evaluate(async () => {
+		const s = window.__stores;
+		const get = (store) => { let v; store.subscribe((x) => (v = x))(); return v; };
+		for (let i = 0; i < 5; i++) s.commandsHandler.sceneCommand('/create box');
+		await new Promise((r) => setTimeout(r, 600));
+		const [floor, wall, step, block, faller] = get(s.objectsGroup).children.filter((c) => c.name === 'Box');
+		const place = (o, pos, scale) => { o.position.set(...pos); o.scale.set(...scale); o.updateMatrixWorld(true); };
+		place(floor, [0, -0.25, 0], [20, 0.5, 20]);
+		place(wall, [0, 1.5, -3], [10, 3, 0.4]); // front face at z = -2.8
+		place(step, [3, 0.125, 0], [2, 0.25, 2]); // x 2..4, top 0.25
+		place(block, [-3, 0.3, 0], [2, 0.6, 2]); // x -4..-2, top 0.6
+		place(faller, [8, 3, 8], [0.4, 0.4, 0.4]);
+		for (const o of [floor, wall, step, block]) s.physics.setPhysicsFor(o.uuid, { mode: 'static' });
+		s.physics.setPhysicsFor(faller.uuid, { mode: 'dynamic', mass: 1 });
+		s.objectActions.deselectObject();
+	});
+	await A.page.waitForTimeout(800);
+	await A.page.evaluate(() => window.__stores.physics.toggleSimulation());
+	await h.eventually(
+		() => A.page.evaluate(() => window.__stores.physics.physicsWorldDebug().running),
+		(ok) => ok,
+		'premise: a simulation is running (the capsule tier needs a world)',
+		15000
+	);
+
+	// ---- 1. the walker step against a real world -----------------------------------------------
+	// charController primes physics with a LAZY dynamic import (a scene with no walker never
+	// loads rapier), so the very first steps resolve on the plane tier: wait for the capsule
+	await h.eventually(
+		() => A.page.evaluate(() => window.__stores.vrControls.vrWalkStep({ head: { x: 6, y: 1.6, z: 6 }, headHeight: 1.6, yaw: 0, stick: { x: 0, y: 0 }, dt: 0.016 }).source),
+		(src) => src === 'rapier',
+		'premise: the walker has its rapier capsule',
+		10000
+	);
+	const walk = (input, steps) =>
+		A.page.evaluate(
+			({ input, steps }) => {
+				const vr = window.__stores.vrControls;
+				const head = { ...input.head };
+				let last = null;
+				for (let i = 0; i < steps; i++) {
+					last = vr.vrWalkStep({ ...input, head: { ...head }, dt: 0.05 });
+					head.x += last.dx;
+					head.y += last.dy;
+					head.z += last.dz;
+				}
+				return { head, feet: head.y - input.headHeight, source: last?.source, grounded: last?.grounded };
+			},
+			{ input, steps }
+		);
+	const fwd = { x: 0, y: -1 }; // stick UP
+	let r = await walk({ head: { x: 0, y: 1.6, z: 0 }, headHeight: 1.6, yaw: 0, stick: fwd }, 80);
+	h.check(r.source === 'rapier', `the walker resolved through the rapier capsule (${r.source})`);
+	h.check(r.head.z < -2.2 && r.head.z > -2.6, `walking at a wall STOPS at it (z ${r.head.z.toFixed(2)}; the face is at -2.8, the capsule radius 0.3)`);
+	r = await walk({ head: { x: 6, y: 4.6, z: 6 }, headHeight: 1.6, yaw: 0, stick: { x: 0, y: 0 } }, 60);
+	h.check(Math.abs(r.feet) < 0.08 && r.grounded, `gravity puts the feet on the floor (feet ${r.feet.toFixed(3)}, grounded ${r.grounded})`);
+	// 14 steps of 0.11 m from x 1.2 end ON the step (x 2..4), not past it
+	r = await walk({ head: { x: 1.2, y: 1.6, z: 0 }, headHeight: 1.6, yaw: -Math.PI / 2, stick: fwd }, 14);
+	h.check(r.head.x > 2.4 && r.head.x < 3.8 && Math.abs(r.feet - 0.25) < 0.08, `a 0.25 m step is climbed (x ${r.head.x.toFixed(2)}, feet ${r.feet.toFixed(2)})`);
+	r = await walk({ head: { x: -1.2, y: 1.6, z: 0 }, headHeight: 1.6, yaw: Math.PI / 2, stick: fwd }, 30);
+	h.check(r.head.x > -2.05 && r.feet < 0.1, `a 0.6 m block is a wall, not a step (x ${r.head.x.toFixed(2)}, feet ${r.feet.toFixed(2)})`);
+	r = await walk({ head: { x: 6, y: 1.6, z: 6 }, headHeight: 1.6, yaw: 0, stick: fwd, fly: true, aim: { x: 0, y: 0.8, z: -0.6 } }, 20);
+	h.check(r.feet > 1, `a flier (only when allowed) climbs along its aim (feet ${r.feet.toFixed(2)})`);
+
+	// ---- 2. the real per-frame path: Interact walks into the wall and stops ----------------------
+	await A.page.evaluate(() => window.__stores.isVRMode.set(true));
+	await xr.install(A.page);
+	await xr.installSpace(A.page, { head: [0, 1.6, 0], yaw: 0 });
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('interact'));
+	await A.page.waitForTimeout(300);
+	let head = await xr.head(A.page);
+	h.check(Math.abs(head.z) < 0.05 && Math.abs(head.y - 1.6) < 0.05, `premise: the head starts at the origin, 1.6 m up (${JSON.stringify(head)})`);
+	await xr.stick(A.page, 'left', 0, -1);
+	await A.page.waitForTimeout(2500);
+	await xr.stick(A.page, 'left', 0, 0);
+	head = await xr.head(A.page);
+	h.check(head.z < -1.5, `Interact: the left stick walks you forward (z ${head.z.toFixed(2)})`);
+	h.check(head.z > -2.6, `Interact: ...and the wall stops you (z ${head.z.toFixed(2)})`);
+	h.check(Math.abs(head.y - 1.6) < 0.1, `Interact: the feet stay on the floor (head y ${head.y.toFixed(2)})`);
+
+	// ---- 3. teleport: off in Interact, on in Edit, on in Interact when the play block allows ---
+	const teleportArms = async () => {
+		await xr.stick(A.page, 'right', 0, -1);
+		await A.page.waitForTimeout(300);
+		const st = await A.page.evaluate(() => window.__stores.vrControls.teleportState());
+		await xr.stick(A.page, 'right', 0, 0);
+		await A.page.waitForTimeout(300);
+		return st.engaged;
+	};
+	h.check((await teleportArms()) === false, 'Interact: the right stick does NOT arm a teleport');
+	await A.page.evaluate(() => window.__stores.scenePhysics.setScenePhysics({ play: { locomotion: { teleport: true } } }));
+	await A.page.waitForTimeout(200);
+	h.check((await teleportArms()) === true, 'Interact + play.locomotion.teleport: the teleport arc arms');
+	const saved = await A.page.evaluate(() => {
+		let v;
+		window.__stores.scenePhysics.scenePlay.subscribe((x) => (v = x))();
+		return v;
+	});
+	h.check(saved.locomotion?.teleport === true && saved.locomotion.fly === undefined, `the play block stores only what was authored (${JSON.stringify(saved.locomotion)})`);
+	await A.page.evaluate(() => window.__stores.scenePhysics.setScenePhysics({ play: { locomotion: null } }));
+	await A.page.waitForTimeout(200);
+	const cleared = await A.page.evaluate(() => {
+		let v;
+		window.__stores.scenePhysics.scenePlay.subscribe((x) => (v = x))();
+		return 'locomotion' in v;
+	});
+	h.check(cleared === false, 'clearing the block removes the key (a scene that never used it saves byte-identically)');
+
+	// ---- 4. Edit flies through the same wall ----------------------------------------------------
+	await A.page.evaluate(() => window.__stores.objectActions.setEditorMode('edit'));
+	h.check((await teleportArms()) === true, 'Edit: the teleport arc arms as it always did');
+	await xr.stick(A.page, 'left', 0, -1);
+	await A.page.waitForTimeout(2500);
+	await xr.stick(A.page, 'left', 0, 0);
+	head = await xr.head(A.page);
+	h.check(head.z < -3.2, `Edit: the same stick flies THROUGH the wall (z ${head.z.toFixed(2)})`);
+	await xr.uninstall(A.page);
+	await A.page.evaluate(() => window.__stores.isVRMode.set(false));
+	await A.page.waitForTimeout(300);
+
+	// ---- 5. desktop Play's built-in flier stops at the wall too ------------------------------------
+	const cam = () =>
+		A.page.evaluate(() => {
+			let c;
+			window.__stores.playerCam.subscribe((x) => (c = x))();
+			return c.getWorldPosition(new window.__stores.THREE.Vector3()).toArray();
+		});
+	await A.page.evaluate(() => {
+		let c;
+		window.__stores.playerCam.subscribe((x) => (c = x))();
+		const THREE = window.__stores.THREE;
+		const target = new THREE.Vector3(0, 1.7, 0);
+		c.parent.worldToLocal(target);
+		c.position.copy(target);
+		c.quaternion.identity();
+		window.__stores.isLocked.set(true);
+	});
+	await A.page.waitForTimeout(400);
+	await A.page.evaluate(() => document.dispatchEvent(new KeyboardEvent('keydown', { code: 'KeyW', bubbles: true })));
+	await A.page.waitForTimeout(2500);
+	await A.page.evaluate(() => document.dispatchEvent(new KeyboardEvent('keyup', { code: 'KeyW', bubbles: true })));
+	const p = await cam();
+	h.check(p[2] < -1, `desktop Play: W flies you forward (z ${p[2].toFixed(2)})`);
+	h.check(p[2] > -2.6, `desktop Play: ...and the wall stops you while a sim runs (z ${p[2].toFixed(2)})`);
+	await A.page.evaluate(() => window.__stores.isLocked.set(false));
+
+	await A.page.evaluate(() => window.__stores.physics.toggleSimulation());
+	await h.finish(browser);
+});
diff --git a/tests/unit/gameFeelActions.test.js b/tests/unit/gameFeelActions.test.js
new file mode 100644
index 00000000..d122e6e6
--- /dev/null
+++ b/tests/unit/gameFeelActions.test.js
@@ -0,0 +1,45 @@
+// 30b (core-games): the Game Feel flow nodes' pure halves — the {v} fill an Announce shows,
+// and which Game Music node wants to play (a DECLARATION, read every frame).
+import { describe, it, expect } from 'vitest';
+import { fillValue, musicWanted, MUSIC_PRESET_IDS } from '../../src/lib/gameFeelActions.js';
+
+describe('Announce: {v}', () => {
+	it('fills every {v} with the wired number at the asked decimals', () => {
+		expect(fillValue('Ring {v} reached', 2)).toBe('Ring 2 reached');
+		expect(fillValue('{v} m of {v}', 3.456, 1)).toBe('3.5 m of 3.5');
+	});
+	it('passes text through and leaves a plain line alone', () => {
+		expect(fillValue('Top of the tower!', 9)).toBe('Top of the tower!');
+		expect(fillValue('Hi {v}', 'Ada')).toBe('Hi Ada');
+		expect(fillValue('Stars: {v}', undefined)).toBe('Stars: ');
+	});
+});
+
+describe('Game Music: who wants to play', () => {
+	const id = (/** @type {any} */ n) => n.data;
+	const node = (/** @type {string} */ nid, /** @type {any} */ data) => ({ id: nid, type: 'gamemusic', data });
+	it('the first wanting node wins, in graph order', () => {
+		const nodes = [{ id: 'x', type: 'time', data: {} }, node('a', { preset: 'space', volume: 0.5 }), node('b', { preset: 'arcade' })];
+		expect(musicWanted(nodes, id, 'menu')).toEqual({ id: 'a', preset: 'space', volume: 0.5 });
+	});
+	it('an `on` wired false steps aside for the next one', () => {
+		const nodes = [node('a', { preset: 'space', on: false }), node('b', { preset: 'arcade', on: true })];
+		expect(musicWanted(nodes, id, 'menu')?.id).toBe('b');
+		expect(musicWanted([node('a', { preset: 'space', on: 0 })], id, 'menu')).toBeNull();
+	});
+	it("'round' plays only while the round runs (playing or paused)", () => {
+		const nodes = [node('a', { preset: 'space', while: 'round' })];
+		expect(musicWanted(nodes, id, 'menu')).toBeNull();
+		expect(musicWanted(nodes, id, 'over')).toBeNull();
+		expect(musicWanted(nodes, id, 'playing')?.id).toBe('a');
+		expect(musicWanted(nodes, id, 'paused')?.id).toBe('a');
+	});
+	it('an unknown preset is nobody, volume is clamped and defaults to 0.7', () => {
+		expect(musicWanted([node('a', { preset: 'polka' })], id, 'menu')).toBeNull();
+		expect(musicWanted([node('a', { preset: 'space', volume: 7 })], id, 'menu')?.volume).toBe(1);
+		expect(musicWanted([node('a', { preset: 'space' })], id, 'menu')?.volume).toBe(0.7);
+	});
+	it('every preset the palette offers is one the player can play', () => {
+		expect(MUSIC_PRESET_IDS).toEqual(expect.arrayContaining(['arcade', 'ambient', 'space', 'studio']));
+	});
+});
diff --git a/tests/unit/gameMusicPresets.test.js b/tests/unit/gameMusicPresets.test.js
new file mode 100644
index 00000000..4ba951bd
--- /dev/null
+++ b/tests/unit/gameMusicPresets.test.js
@@ -0,0 +1,62 @@
+// 30b (vr-play) C5: the game-music presets as data, with no browser — every preset the
+// contract names exists, every lane is a real 16-step bar, the triads are built inside the
+// mode, and a step is a pure function of (preset, step), which is what makes two peers on
+// one preset hear the same bar.
+import { describe, it, expect } from 'vitest';
+import { MUSIC_PRESETS, MUSIC_PRESET_IDS, musicPreset, stepEvents, triadOn, stepSeconds } from '../../src/lib/gameMusicPresets.js';
+
+describe('game music presets', () => {
+	it('ships exactly the contract presets', () => {
+		expect([...MUSIC_PRESET_IDS].sort()).toEqual(['ambient', 'arcade', 'dungeon', 'puzzle', 'space', 'stadium', 'studio']);
+		expect(musicPreset('nope')).toBeNull();
+	});
+
+	it('every lane is a 16-step bar and the tempo is sane', () => {
+		for (const p of MUSIC_PRESETS) {
+			expect(p.bass.length).toBe(16);
+			for (const lane of Object.values(p.drums)) if (lane) expect(lane.length).toBe(16);
+			if (p.arp) expect(p.arp.lane.length).toBe(16);
+			expect(p.bpm).toBeGreaterThanOrEqual(60);
+			expect(p.bpm).toBeLessThanOrEqual(160);
+			expect(stepSeconds(p)).toBeCloseTo(60 / p.bpm / 4, 9);
+		}
+	});
+
+	it('triads stack thirds inside the mode (minor i is minor, major I is major)', () => {
+		const arcade = /** @type {any} */ (musicPreset('arcade')); // C major
+		expect(triadOn(arcade, 0)).toEqual([60, 64, 67]);
+		expect(triadOn(arcade, 4)).toEqual([67, 71, 74]); // G major
+		const studio = /** @type {any} */ (musicPreset('studio')); // G minor
+		const [r, t, f] = triadOn(studio, 0);
+		expect(t - r).toBe(3);
+		expect(f - r).toBe(7);
+	});
+
+	it('every preset plays notes in every bar of its loop', () => {
+		for (const p of MUSIC_PRESETS) {
+			for (let bar = 0; bar < p.progression.length; bar++) {
+				let notes = 0;
+				for (let i = 0; i < 16; i++) notes += stepEvents(p, bar * 16 + i).length;
+				expect(notes, p.id + ' bar ' + bar).toBeGreaterThan(0);
+			}
+		}
+	});
+
+	it('a step is a pure function of (preset, step) and loops with the progression', () => {
+		const space = /** @type {any} */ (musicPreset('space'));
+		const loop = space.progression.length * 16;
+		for (const step of [0, 5, 17, 40, 63]) {
+			expect(stepEvents(space, step)).toEqual(stepEvents(space, step));
+			expect(stepEvents(space, step)).toEqual(stepEvents(space, step + loop));
+		}
+		// the chord changes with the bar: the bass root of bar 0 differs from bar 1
+		const root = (/** @type {number} */ step) => stepEvents(space, step).find((e) => e.kind === 'bass')?.midi;
+		expect(root(0)).not.toEqual(root(16));
+	});
+
+	it('the pad holds the bar triad on its downbeat only', () => {
+		const ambient = /** @type {any} */ (musicPreset('ambient'));
+		expect(stepEvents(ambient, 0).some((e) => e.kind === 'pad')).toBe(true);
+		expect(stepEvents(ambient, 1).some((e) => e.kind === 'pad')).toBe(false);
+	});
+});
diff --git a/tests/unit/gameStorage.test.js b/tests/unit/gameStorage.test.js
new file mode 100644
index 00000000..1e9bbe8e
--- /dev/null
+++ b/tests/unit/gameStorage.test.js
@@ -0,0 +1,106 @@
+// 30 P4: the storage leaf with no browser — namespacing, JSON round trips, the cap, and a
+// broken entry never throwing. vitest runs in node, where localStorage does not exist, so
+// safeStorage serves every key from its in-memory fallback: the same path Safari private
+// mode takes, which is exactly the one worth covering here.
+import { describe, it, expect, beforeEach } from 'vitest';
+import {
+	makeModuleStorage,
+	moduleStorageKey,
+	sceneStorageKey,
+	readStored,
+	writeStored,
+	MODULE_STORAGE_CAP,
+	debugResetGameStorage
+} from '../../src/lib/gameStorage.js';
+import { safeStorage, debugResetStorage } from '../../src/lib/safeStorage.js';
+
+beforeEach(() => {
+	for (const key of safeStorage.keys()) safeStorage.removeItem(key);
+	debugResetStorage();
+	debugResetGameStorage();
+});
+
+describe('the key contract', () => {
+	it('is byte-for-byte what a module fallback writes', () => {
+		expect(moduleStorageKey('untangle', 'progress')).toBe('tp:mod:untangle:progress');
+		expect(sceneStorageKey('Towers', 'best')).toBe('tp:scene:Towers:best');
+		expect(sceneStorageKey('', 'best')).toBe('tp:scene:untitled:best');
+		expect(sceneStorageKey(null, 'best')).toBe('tp:scene:untitled:best');
+	});
+});
+
+describe('makeModuleStorage', () => {
+	it('round-trips JSON values', () => {
+		const s = makeModuleStorage('a');
+		expect(s.set('n', 3)).toBe(true);
+		expect(s.set('o', { unlocked: 4, solved: [1, 2] })).toBe(true);
+		expect(s.set('t', 'hi')).toBe(true);
+		expect(s.get('n')).toBe(3);
+		expect(s.get('o')).toEqual({ unlocked: 4, solved: [1, 2] });
+		expect(s.get('t')).toBe('hi');
+		expect(safeStorage.getItem('tp:mod:a:o')).toBe('{"unlocked":4,"solved":[1,2]}');
+	});
+
+	it('hands back the fallback for a missing or unreadable key', () => {
+		const s = makeModuleStorage('a');
+		expect(s.get('missing', 7)).toBe(7);
+		safeStorage.setItem('tp:mod:a:broken', '{not json');
+		expect(s.get('broken', 'fb')).toBe('fb');
+	});
+
+	it('keeps two modules apart', () => {
+		const a = makeModuleStorage('a');
+		const b = makeModuleStorage('b');
+		a.set('score', 1);
+		b.set('score', 2);
+		expect(a.get('score')).toBe(1);
+		expect(b.get('score')).toBe(2);
+		expect(a.keys()).toEqual(['score']);
+		a.clear();
+		expect(a.keys()).toEqual([]);
+		expect(b.get('score')).toBe(2);
+	});
+
+	it('remove and keys', () => {
+		const s = makeModuleStorage('a');
+		s.set('x', 1);
+		s.set('y', 2);
+		expect(s.keys()).toEqual(['x', 'y']);
+		s.remove('x');
+		expect(s.keys()).toEqual(['y']);
+		expect(s.set('y', undefined)).toBe(true);
+		expect(s.keys()).toEqual([]);
+	});
+
+	it('refuses a write over the cap, once per call, and writes nothing', () => {
+		/** @type {any[]} */
+		const over = [];
+		const s = makeModuleStorage('a', { cap: 100, onOverCap: (info) => over.push(info) });
+		expect(s.set('small', 'x'.repeat(40))).toBe(true);
+		expect(s.set('big', 'x'.repeat(80))).toBe(false);
+		expect(over.length).toBe(1);
+		expect(s.get('big', null)).toBe(null);
+		// replacing a key measures the NEW value, not old + new
+		expect(s.set('small', 'y'.repeat(40))).toBe(true);
+		expect(MODULE_STORAGE_CAP).toBe(262144);
+	});
+
+	it('refuses what JSON cannot carry instead of throwing', () => {
+		const s = makeModuleStorage('a');
+		/** @type {any} */
+		const cyclic = {};
+		cyclic.self = cyclic;
+		expect(s.set('c', cyclic)).toBe(false);
+		expect(s.set('f', () => 1)).toBe(false);
+	});
+});
+
+describe('the scene half', () => {
+	it('writeStored/readStored share the cache with a direct read', () => {
+		const full = sceneStorageKey('Towers', 'best');
+		writeStored(full, 12);
+		expect(readStored(full, 0)).toBe(12);
+		debugResetGameStorage();
+		expect(readStored(full, 0)).toBe(12);
+	});
+});
diff --git a/tests/unit/hapticPatterns.test.js b/tests/unit/hapticPatterns.test.js
new file mode 100644
index 00000000..28f4d547
--- /dev/null
+++ b/tests/unit/hapticPatterns.test.js
@@ -0,0 +1,45 @@
+// 30b (vr-play) C4: the haptic patterns as data — every contract name, pulses an actuator
+// can take (never overlapping: a new pulse REPLACES the running one on a real actuator),
+// the scale, and the knock strength curve.
+import { describe, it, expect } from 'vitest';
+import { HAPTIC_PATTERN_NAMES, hapticSchedule, knockHapticScale } from '../../src/lib/hapticPatterns.js';
+
+describe('haptic patterns', () => {
+	it('ships the contract presets', () => {
+		expect([...HAPTIC_PATTERN_NAMES].sort()).toEqual(['bump', 'fail', 'heartbeat', 'hit', 'rumble', 'success', 'tap']);
+	});
+
+	it('every pulse fits an actuator and pulses never overlap', () => {
+		for (const name of HAPTIC_PATTERN_NAMES) {
+			const pulses = hapticSchedule(name);
+			expect(pulses.length, name).toBeGreaterThan(0);
+			pulses.forEach((p, i) => {
+				expect(p.intensity).toBeGreaterThan(0);
+				expect(p.intensity).toBeLessThanOrEqual(1);
+				expect(p.ms).toBeGreaterThanOrEqual(1);
+				if (i > 0) expect(p.at, name + ' pulse ' + i).toBeGreaterThanOrEqual(pulses[i - 1].at + pulses[i - 1].ms);
+			});
+		}
+	});
+
+	it('tap is the lightest and rumble the longest', () => {
+		const total = (/** @type {string} */ n) => hapticSchedule(n).reduce((s, p) => s + p.ms, 0);
+		const peak = (/** @type {string} */ n) => Math.max(...hapticSchedule(n).map((p) => p.intensity));
+		for (const n of HAPTIC_PATTERN_NAMES) if (n !== 'tap') expect(peak('tap')).toBeLessThan(peak(n));
+		for (const n of HAPTIC_PATTERN_NAMES) if (n !== 'rumble') expect(total('rumble')).toBeGreaterThan(total(n));
+	});
+
+	it('unknown names are empty, scale clamps', () => {
+		expect(hapticSchedule('buzzz')).toEqual([]);
+		expect(hapticSchedule('hit', 10).every((p) => p.intensity <= 1)).toBe(true);
+		expect(hapticSchedule('hit', 0.5)[0].intensity).toBeCloseTo(0.425, 6);
+		expect(hapticSchedule('hit', -3).every((p) => p.intensity === 0)).toBe(true);
+	});
+
+	it('a knock scales from a brush to a full hit', () => {
+		expect(knockHapticScale(0)).toBeCloseTo(0.2, 6);
+		expect(knockHapticScale(2)).toBeGreaterThan(knockHapticScale(0.5));
+		expect(knockHapticScale(50)).toBe(1);
+		expect(knockHapticScale(NaN)).toBeCloseTo(0.2, 6);
+	});
+});
diff --git a/tests/unit/levelTemplates.test.js b/tests/unit/levelTemplates.test.js
new file mode 100644
index 00000000..747139b3
--- /dev/null
+++ b/tests/unit/levelTemplates.test.js
@@ -0,0 +1,113 @@
+// 30c level design — the three kit levels' DEFS (scripts/level-templates.cjs), checked with
+// no browser: every piece names a real kit item, sits on the kit's grid, every custom
+// collider fits the 1200-float cap, and each level has a spawn and a walk controller.
+import { describe, it, expect } from 'vitest';
+import { createRequire } from 'node:module';
+import fs from 'node:fs';
+import path from 'node:path';
+
+const require = createRequire(import.meta.url);
+const { LEVEL_DEFS, COLLIDERS } = require('../../scripts/level-templates.cjs');
+
+// the three kits' item lists, when a local snapshot of the packs is around (the pack PRs
+// are separate repos; the list check SKIPS rather than fails without them)
+const PACKS_DIR = process.env.PACKS_DIR || '/home/deck/.code/lanes-30/levels-packs';
+/** @param {string} pack */
+function itemsOf(pack) {
+	const file = path.join(PACKS_DIR, pack, 'default.json');
+	return fs.existsSync(file) ? new Set(JSON.parse(fs.readFileSync(file, 'utf8')).map((/** @type {any} */ r) => r.name)) : null;
+}
+
+/** @param {any} def */
+const kits = (def) => def.objects.filter((/** @type {any} */ o) => o.type === 'kit');
+
+describe('level templates', () => {
+	it('are three general-tab templates kept out of the offline seed', () => {
+		expect(LEVEL_DEFS.map((/** @type {any} */ d) => d.slug)).toEqual(['castle-courtyard', 'forest-clearing', 'tavern-interior']);
+		for (const def of LEVEL_DEFS) {
+			expect(def.kind).toBe('template');
+			expect(def.seed).toBe(false);
+			expect(def.description.length).toBeGreaterThan(40);
+		}
+	});
+
+	it('name every object uniquely', () => {
+		for (const def of LEVEL_DEFS) {
+			const names = def.objects.map((/** @type {any} */ o) => o.name);
+			expect(new Set(names).size).toBe(names.length);
+		}
+	});
+
+	it('build from the kits, and only from items the kits ship', () => {
+		for (const def of LEVEL_DEFS) {
+			expect(kits(def).length).toBeGreaterThan(90);
+			for (const o of kits(def)) {
+				const items = itemsOf(o.pack);
+				if (items) expect(items.has(o.item), def.slug + ': ' + o.pack + '/' + o.item).toBe(true);
+			}
+		}
+	});
+
+	it('stand walls and floors on the 1 m grid, turned in right angles', () => {
+		const grid = /^(Wall(Stone|Plaster)|Floor|Railing|Battlement|Block|Tower|Pillar|CornerPost|Stairs|Gate|RoofSlope|Arch|Door|Window)/;
+		for (const def of LEVEL_DEFS)
+			for (const o of kits(def)) {
+				// the tavern's bar is half walls used as FURNITURE (scaled, off the grid on purpose)
+				if (!grid.test(o.item) || /^Bar/.test(o.name)) continue;
+				const [x, , z] = o.pos;
+				// walls sit on grid lines, cells on odd metres; rails ride 0.08 inside an edge
+				expect(Math.abs(x * 2 - Math.round(x * 2)) < 0.17 || o.item === 'Railing', def.slug + ' ' + o.name + ' x ' + x).toBe(true);
+				expect(Math.abs(z * 2 - Math.round(z * 2)) < 0.17 || o.item === 'Railing', def.slug + ' ' + o.name + ' z ' + z).toBe(true);
+				const yaw = o.rot?.[1] ?? 0;
+				expect(Math.abs(yaw / (Math.PI / 2) - Math.round(yaw / (Math.PI / 2))) < 1e-3, def.slug + ' ' + o.name + ' yaw').toBe(true);
+			}
+	});
+
+	it('give every custom collider valid pieces under the 1200-float cap', () => {
+		for (const def of LEVEL_DEFS)
+			for (const o of def.objects) {
+				const p = o.physics;
+				if (p?.collider !== 'custom') continue;
+				expect(p.colliderVerts.length).toBeLessThanOrEqual(1200);
+				expect(p.colliderVerts.length % 3).toBe(0);
+				for (const [start, count] of p.colliderPieces) {
+					expect(count).toBeGreaterThanOrEqual(9);
+					expect(start + count).toBeLessThanOrEqual(p.colliderVerts.length);
+				}
+			}
+	});
+
+	it('leave the doorway and the archway walkable for the 0.3 m capsule', () => {
+		/** @param {any} c */
+		const gap = (c) => {
+			const v = c.colliderVerts;
+			const [a, b] = c.colliderPieces;
+			const leftMax = Math.max(...v.slice(a[0], a[0] + a[1]).filter((/** @type {number} */ _, /** @type {number} */ i) => i % 3 === 0));
+			const rightMin = Math.min(...v.slice(b[0], b[0] + b[1]).filter((/** @type {number} */ _, /** @type {number} */ i) => i % 3 === 0));
+			return rightMin - leftMax;
+		};
+		expect(gap(COLLIDERS.doorway)).toBeGreaterThan(0.6);
+		expect(gap(COLLIDERS.arch)).toBeGreaterThan(0.6);
+		// a staircase is a ramp the walker can climb (50° is its limit)
+		const slope = Math.atan2(3, 4) * (180 / Math.PI);
+		expect(slope).toBeLessThan(50);
+	});
+
+	it('carry a spawn, sim-on-play and ONE walk-mode character controller', () => {
+		for (const def of LEVEL_DEFS) {
+			expect(def.physics.play.simOnPlay).toBe(true);
+			expect(def.physics.play.spawn.position).toHaveLength(3);
+			const nodes = def.graphs.scene.nodes;
+			expect(nodes.filter((/** @type {any} */ n) => n.type === 'charcontroller')).toHaveLength(1);
+			expect(nodes[0].data.mode).toBe('walk');
+			// the sim needs something dynamic, or startSimulation declines to run at all
+			expect(def.objects.some((/** @type {any} */ o) => o.physics?.mode === 'dynamic')).toBe(true);
+		}
+	});
+
+	it('are deterministic (a re-author writes the same layout)', () => {
+		delete require.cache[require.resolve('../../scripts/level-templates.cjs')];
+		const again = require('../../scripts/level-templates.cjs').LEVEL_DEFS;
+		expect(JSON.stringify(again)).toBe(JSON.stringify(LEVEL_DEFS));
+	});
+});
diff --git a/tests/unit/locomotionPolicy.test.js b/tests/unit/locomotionPolicy.test.js
new file mode 100644
index 00000000..e702d5d6
--- /dev/null
+++ b/tests/unit/locomotionPolicy.test.js
@@ -0,0 +1,127 @@
+import { describe, it, expect } from 'vitest';
+import {
+	locomotionPolicy,
+	normalizeLocomotion,
+	normalizeSpawn,
+	yawForward,
+	yawOf,
+	vrSpawnOffsets
+} from '../../src/lib/locomotionPolicy.js';
+
+// 30b P3/P4: who may fly or teleport, and the VR spawn as WebXR offsets.
+
+describe('locomotionPolicy', () => {
+	it('Edit keeps the editor movement: fly, teleport, the world gestures, no walls', () => {
+		expect(locomotionPolicy('edit', null)).toEqual({
+			walk: false, fly: true, teleport: true, collide: false, gravity: false, worldGestures: true
+		});
+		// a play block never narrows the EDITOR
+		expect(locomotionPolicy('edit', { teleport: false, fly: false }).teleport).toBe(true);
+	});
+	it('Interact walks with walls and gravity; no fly or teleport by default', () => {
+		expect(locomotionPolicy('interact', null)).toEqual({
+			walk: true, fly: false, teleport: false, collide: true, gravity: true, worldGestures: false
+		});
+		expect(locomotionPolicy('interact', {})).toEqual(locomotionPolicy('interact', null));
+	});
+	it('a play block can allow teleport and fly in Interact (fly drops gravity, keeps walls)', () => {
+		const p = locomotionPolicy('interact', { teleport: true, fly: true });
+		expect(p.teleport).toBe(true);
+		expect(p.fly).toBe(true);
+		expect(p.gravity).toBe(false);
+		expect(p.collide).toBe(true);
+		expect(p.worldGestures).toBe(false);
+	});
+	it('only a literal true allows (truthy strings do not)', () => {
+		expect(locomotionPolicy('interact', /** @type {any} */ ({ teleport: 'yes', fly: 1 })).teleport).toBe(false);
+	});
+});
+
+describe('normalizeLocomotion', () => {
+	it('keeps booleans only; an empty block is absent', () => {
+		expect(normalizeLocomotion({ teleport: true, fly: 'x', other: 1 })).toEqual({ teleport: true });
+		expect(normalizeLocomotion({ fly: false })).toEqual({ fly: false });
+		expect(normalizeLocomotion({})).toBe(null);
+		expect(normalizeLocomotion(null)).toBe(null);
+		expect(normalizeLocomotion('fly')).toBe(null);
+	});
+});
+
+describe('normalizeSpawn', () => {
+	it('takes the stored shape and the api pair', () => {
+		expect(normalizeSpawn({ position: [1, 0, -2], yaw: 1.5 })).toEqual({ position: [1, 0, -2], yaw: 1.5 });
+		expect(normalizeSpawn([1, 0.5, -2], 0.25)).toEqual({ position: [1, 0.5, -2], yaw: 0.25 });
+		expect(normalizeSpawn([1, 0.5, -2])).toEqual({ position: [1, 0.5, -2], yaw: 0 });
+	});
+	it('refuses anything that is not three finite numbers', () => {
+		expect(normalizeSpawn({ position: [1, 2] })).toBe(null);
+		expect(normalizeSpawn([1, NaN, 2])).toBe(null);
+		expect(normalizeSpawn([1e9, 0, 0])).toBe(null);
+		expect(normalizeSpawn(null)).toBe(null);
+		expect(normalizeSpawn({ position: [0, 0, 0], yaw: 'x' })).toEqual({ position: [0, 0, 0], yaw: 0 });
+	});
+});
+
+describe('yaw convention (three rotation.y; 0 faces -Z)', () => {
+	it('forward and back', () => {
+		expect(yawForward(0)).toEqual({ x: -0, y: 0, z: -1 });
+		const f = yawForward(Math.PI / 2); // turned LEFT: facing -X
+		expect(f.x).toBeCloseTo(-1);
+		expect(f.z).toBeCloseTo(0);
+		for (const yaw of [0, 0.7, -2.1, 3]) expect(yawOf(yawForward(yaw))).toBeCloseTo(yaw);
+	});
+});
+
+// ---- the VR spawn, checked against WebXR's own composition rule ------------------------
+// A pose in the new space = inverse(originOffset) * pose in the old one. Rotations here
+// are about +Y only, so a pose is {x, y, z, yaw} and an offset is a translation `t`
+// followed by a yaw `a` (XRRigidTransform = T(t) * R(a)).
+/** @param {number} a @param {{x: number, z: number}} p */
+const rotY = (a, p) => ({ x: Math.cos(a) * p.x + Math.sin(a) * p.z, z: -Math.sin(a) * p.x + Math.cos(a) * p.z });
+/** apply inverse(T(t) R(a)) to a pose @param {{x: number, y: number, z: number, yaw: number}} pose
+ * @param {{x: number, y: number, z: number}} t @param {number} a */
+function viaOffset(pose, t, a) {
+	const d = rotY(-a, { x: pose.x - t.x, z: pose.z - t.z });
+	return { x: d.x, y: pose.y - t.y, z: d.z, yaw: pose.yaw - a };
+}
+/** @param {number} a */
+const wrap = (a) => Math.atan2(Math.sin(a), Math.cos(a));
+
+describe('vrSpawnOffsets', () => {
+	const cases = [
+		{ head: { x: 0, y: 1.6, z: 0 }, yaw: 0, spawn: { position: [3, 0, -4], yaw: Math.PI / 2 } },
+		{ head: { x: -2, y: 5.1, z: 7 }, yaw: 2.4, spawn: { position: [0.5, 1.2, 0.5], yaw: -1 } },
+		{ head: { x: 10, y: 1.7, z: -3 }, yaw: -0.3, spawn: { position: [10, 0, -3], yaw: -0.3 } }
+	];
+	for (const [i, c] of cases.entries()) {
+		it(`the feet land on the spawn, facing its yaw (case ${i})`, () => {
+			const headHeight = 1.6;
+			const { turn, move } = vrSpawnOffsets(c.head, c.yaw, headHeight, c.spawn);
+			const afterTurn = viaOffset({ ...c.head, yaw: c.yaw }, turn.position, turn.angle);
+			// the turn is IN PLACE
+			expect(afterTurn.x).toBeCloseTo(c.head.x, 6);
+			expect(afterTurn.z).toBeCloseTo(c.head.z, 6);
+			const after = viaOffset(afterTurn, move, 0);
+			expect(after.x).toBeCloseTo(c.spawn.position[0], 6);
+			expect(after.z).toBeCloseTo(c.spawn.position[2], 6);
+			expect(after.y - headHeight).toBeCloseTo(c.spawn.position[1], 6); // the FEET
+			expect(wrap(after.yaw - c.spawn.yaw)).toBeCloseTo(0, 6);
+		});
+	}
+	it('the turn quaternion is the rotation by `angle` about +Y', () => {
+		const { turn } = vrSpawnOffsets({ x: 0, y: 1.6, z: 0 }, 0.4, 1.6, { position: [0, 0, 0], yaw: -0.6 });
+		expect(turn.angle).toBeCloseTo(1.0);
+		expect(turn.orientation.y).toBeCloseTo(Math.sin(0.5));
+		expect(turn.orientation.w).toBeCloseTo(Math.cos(0.5));
+	});
+});
+
+// 30b (core-games): a VR-only spawn keeps its flag through the one normalizer (absent = none)
+describe('a VR-only spawn', () => {
+	it('keeps vrOnly only when it is exactly true', () => {
+		expect(normalizeSpawn({ position: [1, 0, -1], yaw: 0, vrOnly: true })).toEqual({ position: [1, 0, -1], yaw: 0, vrOnly: true });
+		expect(normalizeSpawn({ position: [1, 0, -1], yaw: 0, vrOnly: 'yes' })).toEqual({ position: [1, 0, -1], yaw: 0 });
+		expect(normalizeSpawn({ position: [1, 0, -1] })).toEqual({ position: [1, 0, -1], yaw: 0 });
+		expect(normalizeSpawn([1, 0, -1], 0.5)).toEqual({ position: [1, 0, -1], yaw: 0.5 });
+	});
+});
diff --git a/tests/unit/scenePhysicsSpawn.test.js b/tests/unit/scenePhysicsSpawn.test.js
new file mode 100644
index 00000000..21aa0875
--- /dev/null
+++ b/tests/unit/scenePhysicsSpawn.test.js
@@ -0,0 +1,29 @@
+// 30c: the play SPAWN is scene data on scenePhysics' play block — present only when set, so a
+// scene that never set one normalizes (and saves) exactly as before.
+import { describe, it, expect } from 'vitest';
+import { normalizeScenePhysics } from '../../src/lib/scenePhysics.js';
+
+describe('scenePhysics play.spawn', () => {
+	it('is absent by default (a scene without one is byte-identical)', () => {
+		const state = normalizeScenePhysics({});
+		expect('spawn' in state.play).toBe(false);
+		expect(JSON.stringify(normalizeScenePhysics({ play: { simOnPlay: true } }).play)).toBe(
+			JSON.stringify({ interaction: 'grab', grounded: false, simOnPlay: true })
+		);
+	});
+
+	it('keeps a valid spawn: feet position and yaw', () => {
+		const state = normalizeScenePhysics({ play: { spawn: { position: [1, 0.3, 4.6], yaw: -0.2 } } });
+		expect(state.play.spawn).toEqual({ position: [1, 0.3, 4.6], yaw: -0.2 });
+		// yaw defaults to 0 (looking down -Z, the fixed start's direction)
+		expect(normalizeScenePhysics({ play: { spawn: { position: [0, 0, 0] } } }).play.spawn).toEqual({ position: [0, 0, 0], yaw: 0 });
+	});
+
+	it('drops a malformed or cleared spawn instead of carrying it', () => {
+		for (const spawn of [null, {}, { position: [1, 2] }, { position: [1, 'x', 3] }, { position: [NaN, 0, 0] }, { position: [1e9, 0, 0] }])
+			expect('spawn' in normalizeScenePhysics({ play: { spawn } }).play).toBe(false);
+	});
+	it('reads the first 30c shape {pos, yaw} into the contract shape {position, yaw}', () => {
+		expect(normalizeScenePhysics({ play: { spawn: { pos: [2, 0, -3], yaw: 1 } } }).play.spawn).toEqual({ position: [2, 0, -3], yaw: 1 });
+	});
+});
diff --git a/tests/unit/selectThrough.test.js b/tests/unit/selectThrough.test.js
new file mode 100644
index 00000000..f04f3766
--- /dev/null
+++ b/tests/unit/selectThrough.test.js
@@ -0,0 +1,135 @@
+import { describe, it, expect } from 'vitest';
+import {
+	hitOpacity,
+	isSeeThrough,
+	pickStack,
+	primaryIndex,
+	isRepeatClick,
+	chooseInStack,
+	SEE_THROUGH_OPACITY,
+	DOUBLE_CLICK_MS,
+	CYCLE_WINDOW_MS
+} from '../../src/lib/selectThrough.js';
+
+// 30 P2: select-through + click-cycle, the pure part. Plain objects stand in for THREE
+// nodes: the functions only read `material`, `visible`, `parent`, `uuid`, `userData`.
+
+/** @param {string} uuid @param {any} [material] @param {any} [extra] */
+function node(uuid, material = { opacity: 1, transparent: false }, extra = {}) {
+	return { uuid, material, visible: true, parent: null, userData: {}, ...extra };
+}
+/** @param {any} object @param {number} distance */
+const hit = (object, distance) => ({ object, distance, face: { materialIndex: 0 } });
+/** top-level resolver: the node itself, or its top-most parent */
+const top = (/** @type {any} */ o) => {
+	let n = o;
+	while (n?.parent) n = n.parent;
+	return n;
+};
+
+describe('hitOpacity', () => {
+	it('reads an opaque material as 1 and ignores opacity without transparent', () => {
+		expect(hitOpacity(hit(node('a'), 1))).toBe(1);
+		expect(hitOpacity(hit(node('a', { opacity: 0.1, transparent: false }), 1))).toBe(1);
+	});
+	it('reads the opacity of a transparent material', () => {
+		expect(hitOpacity(hit(node('a', { opacity: 0.12, transparent: true }), 1))).toBe(0.12);
+	});
+	it('reads the FACE material of a multi-material mesh', () => {
+		const mesh = node('m', [
+			{ opacity: 1, transparent: false },
+			{ opacity: 0.05, transparent: true }
+		]);
+		expect(hitOpacity({ object: mesh, face: { materialIndex: 1 } })).toBe(0.05);
+		expect(hitOpacity({ object: mesh, face: { materialIndex: 0 } })).toBe(1);
+	});
+	it('reads a switched-off material as 0', () => {
+		expect(hitOpacity(hit(node('a', { visible: false, opacity: 1 }), 1))).toBe(0);
+	});
+});
+
+describe('isSeeThrough', () => {
+	it('flags glass below the threshold, and only below it', () => {
+		const glass = node('g', { opacity: SEE_THROUGH_OPACITY - 0.01, transparent: true });
+		const tinted = node('t', { opacity: SEE_THROUGH_OPACITY + 0.01, transparent: true });
+		expect(isSeeThrough(hit(glass, 1), glass)).toBe(true);
+		expect(isSeeThrough(hit(tinted, 1), tinted)).toBe(false);
+	});
+	it('honours the pick flag on the TOP-LEVEL object whatever the opacity', () => {
+		const wall = node('w');
+		wall.userData.pick = 'through';
+		expect(isSeeThrough(hit(wall, 1), wall)).toBe(true);
+	});
+	it('treats a hidden node on the way up as see-through', () => {
+		const group = node('grp', null, { visible: false });
+		const child = node('c', undefined, { parent: group });
+		expect(isSeeThrough(hit(child, 1), group)).toBe(true);
+	});
+});
+
+describe('pickStack + primaryIndex', () => {
+	it('prefers the first OPAQUE target behind a near-invisible shell (the Stars Room case)', () => {
+		const shell = node('shell', { opacity: 0.12, transparent: true });
+		const star = node('star');
+		const floor = node('floor');
+		const stack = pickStack([hit(shell, 1), hit(star, 3), hit(floor, 5)], top);
+		expect(stack.map((e) => e.uuid)).toEqual(['shell', 'star', 'floor']);
+		expect(stack[primaryIndex(stack)].uuid).toBe('star');
+	});
+	it('falls back to the nearest when everything is see-through', () => {
+		const a = node('a', { opacity: 0.1, transparent: true });
+		const b = node('b', { opacity: 0.1, transparent: true });
+		expect(primaryIndex(pickStack([hit(a, 1), hit(b, 2)], top))).toBe(0);
+	});
+	it('collapses several hits on one object into ONE entry, opaque if any hit is', () => {
+		const group = node('case');
+		const pane = node('pane', { opacity: 0.1, transparent: true }, { parent: group });
+		const core = node('core', undefined, { parent: group });
+		const stack = pickStack([hit(pane, 1), hit(core, 2), hit(pane, 3)], top);
+		expect(stack.length).toBe(1);
+		expect(stack[0].through).toBe(false);
+	});
+	it('skips hits that resolve to no top-level object', () => {
+		expect(pickStack([hit(node('x'), 1)], () => null)).toEqual([]);
+	});
+});
+
+describe('isRepeatClick', () => {
+	const last = { x: 100, y: 100, t: 1000 };
+	it('is a repeat on the same spot after the double-click window', () => {
+		expect(isRepeatClick({ x: 103, y: 98, t: 1000 + DOUBLE_CLICK_MS + 50 }, last)).toBe(true);
+	});
+	it('is NOT a repeat inside the double-click window (that gesture is the double-click action)', () => {
+		expect(isRepeatClick({ x: 100, y: 100, t: 1000 + DOUBLE_CLICK_MS - 10 }, last)).toBe(false);
+	});
+	it('is NOT a repeat after the cycle window or more than 4px away', () => {
+		expect(isRepeatClick({ x: 100, y: 100, t: 1000 + CYCLE_WINDOW_MS + 1 }, last)).toBe(false);
+		expect(isRepeatClick({ x: 105, y: 100, t: 1000 + DOUBLE_CLICK_MS + 50 }, last)).toBe(false);
+		expect(isRepeatClick({ x: 100, y: 100, t: 2000 }, null)).toBe(false);
+	});
+});
+
+describe('chooseInStack', () => {
+	const shell = node('shell', { opacity: 0.1, transparent: true });
+	const box = node('box');
+	const floor = node('floor');
+	const stack = pickStack([hit(shell, 1), hit(box, 2), hit(floor, 4)], top);
+	const t0 = 10_000;
+	const later = t0 + DOUBLE_CLICK_MS + 100;
+	it('a plain click takes the primary', () => {
+		expect(chooseInStack(stack, { x: 5, y: 5, t: t0 }, null)).toEqual({ index: 1, cycled: false });
+	});
+	it('a repeat walks DOWN the stack and wraps back to the shell in front', () => {
+		const first = chooseInStack(stack, { x: 5, y: 5, t: later }, { x: 5, y: 5, t: t0, uuid: 'box' });
+		expect(stack[first.index].uuid).toBe('floor');
+		expect(first.cycled).toBe(true);
+		const second = chooseInStack(stack, { x: 5, y: 5, t: later + 600 }, { x: 5, y: 5, t: later, uuid: 'floor' });
+		expect(stack[second.index].uuid).toBe('shell');
+	});
+	it('a repeat whose last pick left the stack starts over at the primary', () => {
+		expect(chooseInStack(stack, { x: 5, y: 5, t: later }, { x: 5, y: 5, t: t0, uuid: 'gone' }).index).toBe(1);
+	});
+	it('an empty stack picks nothing', () => {
+		expect(chooseInStack([], { x: 0, y: 0, t: 0 }, null).index).toBe(-1);
+	});
+});
diff --git a/tests/unit/vrGrip.test.js b/tests/unit/vrGrip.test.js
new file mode 100644
index 00000000..b09e4a80
--- /dev/null
+++ b/tests/unit/vrGrip.test.js
@@ -0,0 +1,65 @@
+import { describe, it, expect } from 'vitest';
+import { isScenery, pickGripTarget, gripMovesWorld, SCENERY_EXTENT } from '../../src/lib/vrGrip.js';
+
+// 30b P2: the grip rule. The game-scene shapes below are the real ones from the Quest report
+// (Towers' 26 m floor, Stars Room's 12.5 m walls, the football pitch's 5.5 m glass).
+/** @param {number[]} min @param {number[]} max */
+const box = (min, max) => ({
+	min: { x: min[0], y: min[1], z: min[2] },
+	max: { x: max[0], y: max[1], z: max[2] }
+});
+const head = { x: 0, y: 1.6, z: 0 };
+
+describe('isScenery', () => {
+	it('a floor, a wall and a glass side are scenery by extent', () => {
+		expect(isScenery(box([-13, -0.45, -13], [13, 0.05, 13]), head)).toBe(true); // Towers floor
+		expect(isScenery(box([-6.25, 0, -6.25], [6.25, 7, -5.75]), head)).toBe(true); // Stars Room wall
+		expect(isScenery(box([-1.525, 0, -2.75], [-1.475, 2.4, 2.75]), head)).toBe(true); // football glass
+	});
+	it('a cube, a ball, a podium are not', () => {
+		expect(isScenery(box([-0.3, 0.5, -0.3], [0.3, 1.1, 0.3]), head)).toBe(false);
+		expect(isScenery(box([-0.22, 1.08, -0.22], [0.22, 1.52, 0.22]), { x: 3, y: 1.6, z: 3 })).toBe(false);
+	});
+	it('the extent threshold is inclusive at SCENERY_EXTENT', () => {
+		expect(isScenery(box([0, 0, 0], [SCENERY_EXTENT, 1, 1]), null)).toBe(true);
+		expect(isScenery(box([0, 0, 0], [SCENERY_EXTENT - 0.01, 1, 1]), null)).toBe(false);
+	});
+	it('a small room you stand INSIDE is scenery (head inside the bounds)', () => {
+		const booth = box([-1.5, 0, -1.5], [1.5, 2.4, 1.5]);
+		expect(isScenery(booth, head)).toBe(true);
+		expect(isScenery(booth, { x: 5, y: 1.6, z: 0 })).toBe(false);
+	});
+	it('empty or missing bounds hold nothing and are never scenery', () => {
+		expect(isScenery(null, head)).toBe(false);
+		expect(isScenery(box([1, 1, 1], [-1, -1, -1]), head)).toBe(false); // Box3.makeEmpty()
+		expect(isScenery(box([NaN, 0, 0], [1, 1, 1]), head)).toBe(false);
+	});
+});
+
+describe('pickGripTarget', () => {
+	const wall = { scenery: true, grabbable: false };
+	const podium = { scenery: false, grabbable: false };
+	const ball = { scenery: false, grabbable: true };
+	it('Edit: scenery is passed through; the first real object is taken', () => {
+		expect(pickGripTarget([wall, podium, ball], 'edit')).toBe(1);
+		expect(pickGripTarget([wall, ball], 'edit')).toBe(1);
+	});
+	it('Edit: only scenery along the ray = empty air (the world gesture)', () => {
+		expect(pickGripTarget([wall, wall], 'edit')).toBe(-1);
+		expect(pickGripTarget([], 'edit')).toBe(-1);
+	});
+	it('Interact: only a grabbable body is taken, through scenery', () => {
+		expect(pickGripTarget([wall, ball], 'interact')).toBe(1);
+	});
+	it('Interact: a non-grabbable object in front blocks the grab', () => {
+		expect(pickGripTarget([podium, ball], 'interact')).toBe(-1);
+		expect(pickGripTarget([wall, podium], 'interact')).toBe(-1);
+	});
+});
+
+describe('gripMovesWorld', () => {
+	it('only Edit moves the world', () => {
+		expect(gripMovesWorld('edit')).toBe(true);
+		expect(gripMovesWorld('interact')).toBe(false);
+	});
+});
diff --git a/tests/unit/wireValidate.test.js b/tests/unit/wireValidate.test.js
index 1bc684aa..3e0054ed 100644
--- a/tests/unit/wireValidate.test.js
+++ b/tests/unit/wireValidate.test.js
@@ -36,6 +36,11 @@ describe('shape predicates', () => {
 		expect(isQuatOrEuler([0, 0, 0])).toBe(true);
 		expect(isQuatOrEuler([0, 0, 0, 1])).toBe(true);
 		expect(isQuatOrEuler([0, 0])).toBe(false);
+		// three's Euler.toArray() carries the order: every gizmo/drop move is sent this way
+		expect(isQuatOrEuler([0.1, 0.2, 0.3, 'XYZ'])).toBe(true);
+		expect(isQuatOrEuler([0.1, 0.2, NaN, 'XYZ'])).toBe(false);
+		expect(isQuatOrEuler([0.1, 0.2, 0.3, 'nope'])).toBe(false);
+		expect(validateWireMessage({ type: 'move', uuid: '6c4c8a2e-1111-4a2b-9c3d-0123456789ab', pos: [0, 1, 0], rot: [0, 0.5, 0, 'XYZ'], scale: [1, 1, 1] })).toBe(true);
 	});
 });