From 0334fc8bc4e868a2ea4ce992e57c30b682a74a71 Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 10:36:01 -0700
Subject: [PATCH 1/7] claim human-experience-filter-art session 0036
 (placeholder) + sessions.json entry

---
 ...TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md | 23 +++++++++++++++++++
 sessions/sessions.json                        |  3 +++
 2 files changed, 26 insertions(+)
 create mode 100644 sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md

diff --git a/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md b/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md
new file mode 100644
index 0000000..77b9a9a
--- /dev/null
+++ b/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md
@@ -0,0 +1,23 @@
+# Session 0036.0 — Transcript
+
+> App: human-experience-filter-art
+> Start: 2026-06-30T06-30 (PST)
+> Type: planning-and-executing
+> Posture: yolo
+> Claude-Session: a7814ad4-473f-4946-b158-a5fad35b4bf1
+> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art
+> Status: **PLACEHOLDER — claimed at session start; finalized at session end.**
+>
+> This file reserves session ID 0036 for human-experience-filter-art. The driver replaces this
+> body with the full transcript and renames the file to its final
+> SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--<end>.md form at session end.
+
+## Launch prompt
+
+_(launch prompt not captured at claim time)_
+
+## Deferred decisions
+
+_Autonomous-mode low-confidence calls the driver made and would have
+liked operator input on. Appended as the session runs; surfaced at
+finalize. Empty if none._
diff --git a/sessions/sessions.json b/sessions/sessions.json
index 93fe965..d044dc2 100644
--- a/sessions/sessions.json
+++ b/sessions/sessions.json
@@ -103,5 +103,8 @@
   },
   "0035": {
     "title": ""
+  },
+  "0036": {
+    "title": ""
   }
 }

From 00fd9aab17a1401160b102327ebc4c63f2082ee4 Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 10:39:44 -0700
Subject: [PATCH 2/7] add
 sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--2026-06-30T12-00.md
 + replace placeholder/variant
 SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md

---
 ...RIPT-2026-06-30T06-30--2026-06-30T12-00.md | 108 ++++++++++++++++++
 ...TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md |  23 ----
 2 files changed, 108 insertions(+), 23 deletions(-)
 create mode 100644 sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--2026-06-30T12-00.md
 delete mode 100644 sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md

diff --git a/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--2026-06-30T12-00.md b/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--2026-06-30T12-00.md
new file mode 100644
index 0000000..9f7b35a
--- /dev/null
+++ b/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--2026-06-30T12-00.md
@@ -0,0 +1,108 @@
+# Session 0036.0 — Transcript
+
+> App: human-experience-filter-art
+> Start: 2026-06-30T06-30 (PST)
+> Type: planning-and-executing
+> Posture: yolo
+> Claude-Session: a7814ad4-473f-4946-b158-a5fad35b4bf1
+> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art
+> Status: finalized
+
+## Launch prompt
+
+"Let's publish this to benstull.art. Ideally this would be hosted on Cloudflare
+Pages. Cloudflare Pages does have limits though, so we should check that against
+this project." (Started conversationally — no tracked init; finalized as
+planning-and-executing/yolo.)
+
+## Pre-state
+
+The simulator was a FastAPI server (`simulator/app.py`) serving a ~92 KB static
+frontend + 3.9 GB of media (1080p clip bases + 558 already-720p transition morphs +
+audio) via dynamic endpoints. Not yet public anywhere. Operator wanted it live at
+benstull.art on Cloudflare Pages. Concurrent sessions (0029/0031/0033/0034/0035)
+were active on the SAME checkout.
+
+## Arc
+
+**1. Brainstorm → design → plan (Cloudflare publish).** Established the blocker:
+Pages has a 25 MiB/file hard limit; the project has 26 files >25 MiB. Designed a
+fully-static target: Pages frontend + R2 media (no per-file limit, free egress) +
+read-APIs baked to JSON + client-side pick + `/api/alteration` ported to JS.
+Operator chose: both tiers irrelevant→dropped; path `/human-experience-simulator`
+with apex redirect; no cross-session cache (initially). Spec + plan written under
+`docs/superpowers/`. Operator declared the WHOLE project exempt from flotilla/PPE/§9.
+
+**2. Executed the plan (5 tasks).** Client-side alteration engine (`alteration.js`
++ node/py parity tests); config-driven `mediaBase` + baked-JSON boot + client pick +
+`crossOrigin` for the WebGL dream shader; `tools/build_static.py` (dist/ + manifest-
+only ~2.3 GB media tree + `_redirects`); Cloudflare deploy artifacts; static-build
+E2E. Hit + cleanly extracted a parallel session's in-flight "Run simulation" work
+that got swept into a commit (operator chose extraction).
+
+**3. Live deploy.** Installed wrangler; operator did `wrangler login`. Created R2
+bucket `human-experience-simulator-media`, CORS (wrangler's `{rules:[...]}` schema,
+not S3-style), bound `static.benstull.art` via CLI (zone-id from API), parallel
+604-file upload (no `wrangler r2 sync` exists). Created + deployed Pages project;
+operator bound `benstull.art`. **Live.**
+
+**4. Debugging (systematic).** "Morphs not showing" = upload still in progress
+(transitions sort last) → fixed by parallel upload. "Video + audio not playing" →
+drove the LIVE site with Playwright: video fine, **audio 404'd** because
+`scaleAudioUrl` hardcoded `/media/audio/` instead of `mediaBase()` — fixed.
+"Still no video after hard refresh" → **stale cached JS** (Pages caches .js
+max-age=14400, ignores `_headers`) → fixed with content-versioned asset URLs
+(`app.js?v=<hash>`) + no-cache `_headers`. Private-window confirmed fresh code worked.
+
+**5. Preload algorithm.** "Next altitude's video doesn't start" = a buggy
+hold-last-frame settle gate I'd added (gated playLoop behind a canplay that doesn't
+re-fire) → reverted. Operator specified the algorithm: gate on 1 clip/altitude +
+connecting morphs (~126 MB, ~10-20s — measured), then grow the pool in the
+background; the random pick is restricted to fully-loaded (eligible) clips so
+navigation never stalls and new clips are reachable only once fully downloaded.
+Built `preload.js` (pure planner + node tests), wired phase-1 gate + eligible picks.
+
+**6. Worktree isolation enforcement.** The shared checkout caused branch-switch
+chaos (my commits landed on a switched-to `main`). Operator: "make sure every
+session works off a fresh worktree not in the main directory." Built
+`.claude/settings.json` (worktree.bgIsolation + baseRef:fresh) + a PreToolUse hook
+(`worktree-guard.sh`) that DENIES edits to repo files while in the main checkout +
+SessionStart notice → EnterWorktree. Proven live (blocked my own edit); fixed an
+over-broad version that blocked external files too. Dogfooded the merge of guard +
+preload onto origin/main IN an isolated worktree.
+
+## Cut state
+
+- **Live:** https://benstull.art/human-experience-simulator/ — Pages + R2, preload
+  algorithm, audio fixed, cache-versioned. Operator confirmed video+audio work.
+- **origin/main (`a4d3d83`+):** has the Cloudflare publish, preload algorithm, and
+  worktree-isolation guard, merged cleanly with parallel a11y work.
+- Plan archived in-repo (`docs/superpowers/plans/2026-06-30-cloudflare-static-publish.md`),
+  on origin/main. **No `content` repo** → plan stays in-repo (app.json gap).
+- Local `main` checkout is behind origin/main (parallel session actively deploying).
+- Backup branches on origin: `chore/worktree-isolation`, `fix/preload-gate`,
+  `design/cloudflare-static-publish` (content all merged to main; safe to delete).
+
+## Pipeline (§9) status
+
+Operator-set Cloudflare exception (no flotilla/PPE). localhost + **E2E green** (33
+node tests; 13 altitude-lock + 2 static-build Playwright); no PPE (exempt); **prod =
+live** via `make deploy`. Repeatable deploy: `make deploy` / `make deploy-media`
+(`deploy/cloudflare/`).
+
+## Operator plate (next session)
+
+- By-eye/ear review of the live site: load time, video, audio, rapid-altitude
+  navigation smoothness (eligible-pick growth), the preload behavior under real
+  network. The hold/grow path only triggers when media isn't cached — needs eyes.
+- Restart any still-running sessions so they pick up the worktree guard + move to
+  worktrees. Clean up backup branches if desired.
+
+## Deferred decisions
+
+- Estimated session start time (no tracked init) — used 2026-06-30T06-30.
+- Did NOT reconcile local `main` (behind origin/main) — a parallel session is
+  actively deploying origin/main; left the shared checkout untouched to avoid
+  disrupting it.
+- Cross-session Service-Worker disk cache and a 720p base tier were proposed and
+  DEFERRED (morphs already 720p; bases dominate load but per-altitude growth covers it).
diff --git a/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md b/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md
deleted file mode 100644
index 77b9a9a..0000000
--- a/sessions/0036/SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--INPROGRESS.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Session 0036.0 — Transcript
-
-> App: human-experience-filter-art
-> Start: 2026-06-30T06-30 (PST)
-> Type: planning-and-executing
-> Posture: yolo
-> Claude-Session: a7814ad4-473f-4946-b158-a5fad35b4bf1
-> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art
-> Status: **PLACEHOLDER — claimed at session start; finalized at session end.**
->
-> This file reserves session ID 0036 for human-experience-filter-art. The driver replaces this
-> body with the full transcript and renames the file to its final
-> SESSION-0036.0-TRANSCRIPT-2026-06-30T06-30--<end>.md form at session end.
-
-## Launch prompt
-
-_(launch prompt not captured at claim time)_
-
-## Deferred decisions
-
-_Autonomous-mode low-confidence calls the driver made and would have
-liked operator input on. Appended as the session runs; surfaced at
-finalize. Empty if none._

From 1b646c8ade6e65599c318de8aa822e9d624379fe Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 10:45:10 -0700
Subject: [PATCH 3/7] claim human-experience-filter-art session 0037
 (placeholder) + sessions.json entry

---
 ...TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md | 23 +++++++++++++++++++
 sessions/sessions.json                        |  3 +++
 2 files changed, 26 insertions(+)
 create mode 100644 sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md

diff --git a/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md b/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md
new file mode 100644
index 0000000..997ece8
--- /dev/null
+++ b/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md
@@ -0,0 +1,23 @@
+# Session 0037.0 — Transcript
+
+> App: human-experience-filter-art
+> Start: 2026-06-30T10-42 (PST)
+> Type: planning-and-executing
+> Posture: yolo
+> Claude-Session: aa7ac424-d797-4918-8837-2a904441d91e
+> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art/.claude/worktrees/session-0037-altitude-snap-on-release
+> Status: **PLACEHOLDER — claimed at session start; finalized at session end.**
+>
+> This file reserves session ID 0037 for human-experience-filter-art. The driver replaces this
+> body with the full transcript and renames the file to its final
+> SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--<end>.md form at session end.
+
+## Launch prompt
+
+_(launch prompt not captured at claim time)_
+
+## Deferred decisions
+
+_Autonomous-mode low-confidence calls the driver made and would have
+liked operator input on. Appended as the session runs; surfaced at
+finalize. Empty if none._
diff --git a/sessions/sessions.json b/sessions/sessions.json
index d044dc2..50d5654 100644
--- a/sessions/sessions.json
+++ b/sessions/sessions.json
@@ -106,5 +106,8 @@
   },
   "0036": {
     "title": ""
+  },
+  "0037": {
+    "title": ""
   }
 }

From 8e790b4a957a7430ebd573a6554ee457bb39c437 Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 10:50:51 -0700
Subject: [PATCH 4/7] feat(dial): snap to the closest altitude on drag release
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A drag is a way of grabbing the altitude dial, not a free-standing encoder
detent. Until now onDialUp held the live blend wherever the knob stopped (the
"no auto-complete" model), so a grab-and-release could leave the experience
parked mid-morph between two altitudes.

Now a real turn (moved >= 6) auto-scrubs the short way to Math.round(pos) and
settles there (frac 0 locks) — a grab-and-release always lands on a discrete
altitude, exactly like a tap or label click. The tap path (moved < 6 ->
jumpToScale) is unchanged, and reduced motion is handled by autoScrub (jump to
target, no tween).

Adds an altitude-lock e2e asserting a partial drag settles on an integer
altitude after release. Full altitude-lock (14) + a11y + i18n suites green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 simulator/e2e/tests/altitude-lock.spec.ts | 30 ++++++++++++++++++++++-
 simulator/static/app.js                   |  6 ++++-
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/simulator/e2e/tests/altitude-lock.spec.ts b/simulator/e2e/tests/altitude-lock.spec.ts
index b86c830..f6aeb3a 100644
--- a/simulator/e2e/tests/altitude-lock.spec.ts
+++ b/simulator/e2e/tests/altitude-lock.spec.ts
@@ -276,7 +276,8 @@ test("crossing a detent commits and locks the destination clip", async ({ page }
   const box = (await page.locator("#dial").boundingBox())!;
   const cx = box.x + box.width / 2, cy = box.y + box.height / 2;
   // Drag clockwise across one full detent (top -> right ~= 90deg = 1.25 detents),
-  // crossing integer 1 (orbit) so it commits, then hold past it (no auto-complete).
+  // crossing integer 1 (orbit) so it commits, then hold past it WHILE STILL DRAGGING
+  // (the live blend holds wherever the knob is held; the snap happens only on release).
   await page.mouse.move(cx, cy - 30);
   await page.mouse.down();
   await page.mouse.move(cx + 30, cy + 6, { steps: 14 });
@@ -293,3 +294,30 @@ test("crossing a detent commits and locks the destination clip", async ({ page }
   expect(st2.activeClipId).toBe(st.activeClipId);
   await page.mouse.up();
 });
+
+test("releasing a partial drag snaps to the closest altitude (no held mid-blend)", async ({ page }) => {
+  // The operator can grab the dial, turn it PART of a detent, and let go between two
+  // altitudes. On release the knob must auto-scrub to the CLOSEST altitude and settle
+  // there (integer position, frac 0) — landing on a discrete altitude exactly as if
+  // they had clicked it, rather than holding the half-finished blend.
+  await boot(page);
+  const box = (await page.locator("#dial").boundingBox())!;
+  const cx = box.x + box.width / 2, cy = box.y + box.height / 2;
+  await page.mouse.move(cx, cy - 30);
+  await page.mouse.down();
+  await page.mouse.move(cx + 18, cy - 24, { steps: 8 });   // ~0.5 detent — parks BETWEEN altitudes
+  // While held we are mid-blend: a fractional knob position.
+  await page.waitForFunction(
+    () => { const p = (window as any).__hefState().pos; return Math.abs(p - Math.round(p)) > 0.05; },
+    null, { timeout: 5000 },
+  );
+  await page.mouse.up();
+  // After release the position settles on an integer altitude (the snap).
+  await page.waitForFunction(
+    () => Number.isInteger((window as any).__hefState().pos),
+    null, { timeout: 10000 },
+  );
+  const st = await page.evaluate(() => (window as any).__hefState());
+  expect(Number.isInteger(st.pos)).toBe(true);   // landed on an altitude, not held mid-blend
+  expect(st.ringIndex).toBe(st.pos);             // committed altitude == the position it landed on
+});
diff --git a/simulator/static/app.js b/simulator/static/app.js
index 3023f57..3fbb19a 100644
--- a/simulator/static/app.js
+++ b/simulator/static/app.js
@@ -1076,7 +1076,11 @@ function onDialUp(e) {
     }
     return;
   }
-  // No auto-complete: hold the blend wherever the knob stopped (continuous-encoder model).
+  // Snap on release: a drag is a way of GRABBING the dial, not a free-standing
+  // encoder detent — so when the operator lets go between altitudes, auto-scrub the
+  // short way to the CLOSEST one and settle there (frac 0 locks). The result is the
+  // same as a tap/label-click: a grab-and-release always lands on a discrete altitude.
+  autoScrub(Math.round(pos));
 }
 
 // Click a label → auto-scrub the SHORTEST signed way around the ring to that scale.

From 22bd152f33b027b00f0e069f371bbaa3fb039e60 Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 10:54:38 -0700
Subject: [PATCH 5/7] add
 sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--2026-06-30T10-52.md
 + replace placeholder/variant
 SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md

---
 ...RIPT-2026-06-30T10-42--2026-06-30T10-52.md | 76 +++++++++++++++++++
 ...TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md | 23 ------
 2 files changed, 76 insertions(+), 23 deletions(-)
 create mode 100644 sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--2026-06-30T10-52.md
 delete mode 100644 sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md

diff --git a/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--2026-06-30T10-52.md b/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--2026-06-30T10-52.md
new file mode 100644
index 0000000..ce76dca
--- /dev/null
+++ b/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--2026-06-30T10-52.md
@@ -0,0 +1,76 @@
+# Session 0037.0 — Transcript
+
+> App: human-experience-filter-art
+> Start: 2026-06-30T10-42 (PST)
+> Type: planning-and-executing
+> Posture: yolo
+> Claude-Session: aa7ac424-d797-4918-8837-2a904441d91e
+> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art/.claude/worktrees/session-0037-altitude-snap-on-release
+> End: 2026-06-30T10-52 (PST)
+> Status: **FINALIZED.**
+
+## Summary
+
+Single-task UX session. Made the altitude dial **snap to the closest altitude on
+drag release** so a grab-and-release always lands on a discrete altitude, just
+like a tap/label-click.
+
+### Arc
+
+1. Claimed session 0037 (two stale `--INPROGRESS` placeholders 0015/0017 noted,
+   not live). Worked in an isolated worktree
+   (`session-0037-altitude-snap-on-release`) branched off `origin/main` (local
+   `main` was 7 behind).
+2. Located the behavior: `onDialUp` (`simulator/static/app.js`) held the live
+   blend wherever a real turn stopped — the "no auto-complete" continuous-encoder
+   model. Tap path (`moved < 6` → `jumpToScale`) and wheel/label auto-scrub were
+   already snap-to-altitude.
+3. TDD: added an `altitude-lock.spec.ts` e2e ("releasing a partial drag snaps to
+   the closest altitude") — confirmed RED (held pos never became integer).
+4. Implemented: a real turn (`moved >= 6`) now `autoScrub(Math.round(pos))` →
+   short scrub to the nearest altitude, settle + lock (frac 0). Reduced motion is
+   handled inside `autoScrub` (jump-to-target). GREEN.
+5. Verified: full altitude-lock (14) + a11y + i18n e2e suites green. Committed,
+   pushed, opened PR #31, merged to `main` (`5696b94`).
+
+### Pipeline (§9)
+
+This app is **exempt** from flotilla/PPE/§9 prod gate — public target is static
+Cloudflare (Pages + R2). Change is merged to `main`; **operator redeploy** of the
+static build is the remaining ship step. No plan artifact archived: the change
+was a trivial leaf `task`, planned inline (no separate plan file; app has no
+content repo).
+
+### Next session
+
+Operator by-eye review of the snap feel on the live sim, then redeploy to
+Cloudflare.
+
+## Launch prompt
+
+> When the user is dragging the slider (rather than clicking on an altitude),
+> let's transition to the closest altitude when they let go. That way, the user
+> will always land on an altitude as if they clicked one, even if they're
+> grabbing and releasing the slider.
+
+## Plan
+
+> Anchor: leaf `task` (UX behavior tweak — directly plan-eligible, R2b).
+
+Snap-on-release for the altitude dial. Today `onDialUp` (app.js) holds the live
+blend wherever a drag stops (the "no auto-complete" continuous-encoder model).
+Change: after a real turn (`moved >= 6`), `autoScrub(Math.round(pos))` so the
+knob settles on the CLOSEST altitude (frac 0 → lock), identical to a tap/click.
+Tap path (`moved < 6` → `jumpToScale`) unchanged. Reduced-motion is handled by
+`autoScrub` (jump-to-target, no tween).
+
+Verification: new e2e in `altitude-lock.spec.ts` ("releasing a partial drag
+snaps to the closest altitude") — TDD red→green; full altitude-lock (14) + a11y
++ i18n suites green. Project is exempt from §9/PPE (static Cloudflare target);
+ships branch → PR → merge → operator redeploy.
+
+## Deferred decisions
+
+_Autonomous-mode low-confidence calls the driver made and would have
+liked operator input on. Appended as the session runs; surfaced at
+finalize. Empty if none._
diff --git a/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md b/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md
deleted file mode 100644
index 997ece8..0000000
--- a/sessions/0037/SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--INPROGRESS.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# Session 0037.0 — Transcript
-
-> App: human-experience-filter-art
-> Start: 2026-06-30T10-42 (PST)
-> Type: planning-and-executing
-> Posture: yolo
-> Claude-Session: aa7ac424-d797-4918-8837-2a904441d91e
-> Checkout: /Users/benstull/git/benstull.org/benstull/human-experience-filter-art/.claude/worktrees/session-0037-altitude-snap-on-release
-> Status: **PLACEHOLDER — claimed at session start; finalized at session end.**
->
-> This file reserves session ID 0037 for human-experience-filter-art. The driver replaces this
-> body with the full transcript and renames the file to its final
-> SESSION-0037.0-TRANSCRIPT-2026-06-30T10-42--<end>.md form at session end.
-
-## Launch prompt
-
-_(launch prompt not captured at claim time)_
-
-## Deferred decisions
-
-_Autonomous-mode low-confidence calls the driver made and would have
-liked operator input on. Appended as the session runs; surfaced at
-finalize. Empty if none._

From 539618b1b82980aa99b12f48b4c132cbd35cbc89 Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 11:03:33 -0700
Subject: [PATCH 6/7] docs(spec): Playback Speed slider replaces Reduce motion
 toggle

Continuous -2x..2x speed control for the resting altitude loop video
(#vid-loop); manual rAF reverse loop below 0x; reduced-motion a11y
behavior preserved invisibly via OS prefers-reduced-motion.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 ...2026-06-30-playback-speed-slider-design.md | 133 ++++++++++++++++++
 1 file changed, 133 insertions(+)
 create mode 100644 docs/superpowers/specs/2026-06-30-playback-speed-slider-design.md

diff --git a/docs/superpowers/specs/2026-06-30-playback-speed-slider-design.md b/docs/superpowers/specs/2026-06-30-playback-speed-slider-design.md
new file mode 100644
index 0000000..5b87d50
--- /dev/null
+++ b/docs/superpowers/specs/2026-06-30-playback-speed-slider-design.md
@@ -0,0 +1,133 @@
+# Playback Speed slider (replaces "Reduce motion") — design
+
+**Date:** 2026-06-30
+**Status:** Approved (pending written-spec review)
+**Scope:** Frontend only (`simulator/static/`). No engine, pipeline, or media changes.
+
+## Summary
+
+Add a continuous **Playback Speed** slider (−2× … 2×) that controls the resting
+**altitude loop video** (`#vid-loop`) in real time as the user drags it. Below
+`0×` the loop plays **in reverse**. The slider **replaces** the "Reduce motion"
+toggle in the Output panel — but the reduced-motion *accessibility behavior* is
+preserved, now derived silently from the OS `prefers-reduced-motion` setting
+rather than a visible toggle.
+
+## What it affects (and what it does not)
+
+- **Affects:** the resting **altitude loop video** `#vid-loop` — the clip that
+  loops while parked at an altitude. The slider sets its play speed/direction.
+- **Does NOT affect:** the **morph / transition video** `#vid`. That element is
+  scrub-driven — the altitude dial sets its `currentTime` directly — so a
+  playback rate has no meaning there. Speed control never touches it.
+
+## UI
+
+Replace the `reduce-motion` checkbox `<label>` in `index.html` with a range
+slider, styled like the existing Audio level control:
+
+```
+Speed   [ −2 ········●········ 2 ]   1.37×
+```
+
+- `<input type="range" id="play-speed" min="-2" max="2" step="any" value="1">`
+  — `step="any"` so dragging yields a **continuous** value, not 0.25 detents.
+- A live numeric **readout** (`<span id="play-speed-val">`) shows the current
+  value formatted to 2 decimals with a `×` suffix (e.g. `1.37×`, `−0.75×`,
+  `0.00×`).
+- Reference **tick labels** at the nice increments (`−2 −1.75 … 0 … 2`) via a
+  `<datalist>` bound to the input, so the round numbers are visible without
+  quantizing the actual applied value.
+- New i18n key `speed.label` ("Speed") in en/es/fr/ja. The `rm.label` key is
+  retired.
+
+## Accessibility (preserved, now invisible)
+
+The reduce-motion *toggle* is removed, but its *behavior* is kept. `isReduced()`
+now derives **live from the OS setting only** —
+`matchMedia("(prefers-reduced-motion: reduce)")`, re-read on its `change` event —
+with no stored override and no UI. Every existing `isReduced()` call site keeps
+working unchanged:
+
+- loop-play gate (`playLoop`),
+- instant (no-tween) auto altitude transitions (`autoScrub`),
+- the photosensitivity-flash luminance floor.
+
+Consequences:
+
+- The `hef.reduceMotion` localStorage key (`RM_KEY`) is **retired**.
+- When OS reduced-motion is **active**: the loop stays frozen and the speed
+  slider is **disabled** (with a short hint), so a vestibular/photosensitive
+  visitor never gets motion they did not ask for. If the OS pref toggles at
+  runtime, the slider enables/disables to match.
+- `warn.body` copy (all 4 langs) is reworded: it currently tells users to "turn
+  on Reduce motion in the panel," which no longer exists. New copy points to the
+  system reduced-motion setting (now auto-applied).
+
+## Speed behavior (`app.js`)
+
+A new `applyPlaySpeed(speed)` drives `#vid-loop`, with the chosen value persisted
+to `localStorage["hef.playSpeed"]` (default `1`). Applied live on the slider's
+`input` event:
+
+- **speed > 0** → `loopVid.playbackRate = speed`; native forward play. The
+  existing duration→`loopStartFrame()` wrap is unchanged. Any active manual
+  reverse loop is cancelled.
+- **|speed| ≈ 0** (within a small epsilon) → pause the element (freeze on the
+  current frame). Reversible by moving the slider off zero. Cancels any reverse
+  loop.
+- **speed < 0** → native negative `playbackRate` is unreliable (Chrome ignores
+  it), so a `requestAnimationFrame` loop owns the element: the element is
+  **paused** and each frame decrements `loopVid.currentTime` by `|speed|·dt`.
+  When it crosses the bottom boundary it **wraps to the tail** (mirror of the
+  forward wrap), reusing the direction-aware landing offset. The loop is
+  cancelled when speed goes ≥ 0, on reduced-motion freeze, when video output is
+  turned off, or when a new loop clip loads.
+
+Interaction with existing motion:
+
+- The manual reverse loop and the **auto-transition tween** (`autoRaf`, which
+  drives the *morph* `#vid`) are independent — different elements, different
+  rAF handles. The reverse loop only owns `#vid-loop`.
+- On landing on a new altitude (`loadLoop` + `playLoop`), the current slider
+  speed is re-applied so the new clip inherits the chosen rate/direction.
+
+## Test seam + tests
+
+Mirrors the existing `scrub.js` / `node --test` pattern:
+
+- A **pure** helper added to `scrub.js`:
+  `reverseStep(t, absSpeed, dt, loopStart, duration) → { next, wrapped }`
+  — computes the next `currentTime` and whether a bottom-boundary wrap occurred.
+  This is the reverse-loop math with no DOM; `app.js` just applies `next` to
+  `loopVid.currentTime`. Covered by a new `node --test` case (steps, wrap at the
+  boundary, clamping).
+- A **Playwright** e2e added to the existing suite: the slider is present;
+  forward value sets `#vid-loop.playbackRate`; `0×` pauses it; a negative value
+  makes `currentTime` decrease over time. Also assert the slider is disabled
+  when `prefers-reduced-motion` is emulated.
+
+## Known risk (noted, not blocking)
+
+Reverse smoothness depends on the **base loop clips'** keyframe density. The
+morphs are all-intra (smooth reverse), but the base altitude clips may not be;
+on some browsers reverse seeking could stutter. The manual loop stays *correct*
+regardless — smoothness is a visual-polish follow-up (re-encode base clips
+all-intra if needed), not a blocker for this change.
+
+## Files touched
+
+- `simulator/static/index.html` — swap toggle → slider + datalist; reword warn.
+- `simulator/static/app.js` — `applyPlaySpeed`, reverse rAF loop, derive
+  `isReduced()` from OS pref, retire `RM_KEY`, re-apply speed on landing.
+- `simulator/static/scrub.js` — add pure `reverseStep` helper.
+- `simulator/static/i18n.js` — add `speed.label`, reword `warn.body` (en/es/fr/ja),
+  retire `rm.label`.
+- `simulator/static/styles.css` — slider styling (reuse audio-level pattern).
+- Tests: `node --test` for `reverseStep`; Playwright e2e for the slider.
+
+## Out of scope
+
+- Re-encoding base clips for smoother reverse (follow-up if stutter is visible).
+- Any speed control over morph/transition videos.
+- Per-altitude or audio speed coupling (audio level is its own control).

From df8b245af3d00b06dad9eff125a284e214347d4e Mon Sep 17 00:00:00 2001
From: BenStullsBets <ben@benbetson.us>
Date: Tue, 30 Jun 2026 11:19:48 -0700
Subject: [PATCH 7/7] feat(speed): Playback Speed slider replaces Reduce motion
 toggle

Continuous -2x..2x slider drives ONLY the resting altitude loop video
(#vid-loop); the morph/transition video is scrub-driven and untouched.
Forward = native playbackRate; ~0x = freeze; below 0x = a manual rAF
reverse loop (native negative playbackRate is unreliable). Reverse math
is the pure, node-tested HEFScrub.reverseStep helper.

Reduced-motion accessibility is preserved but now derives live from the
OS prefers-reduced-motion setting (no visible toggle): when active the
loop stays frozen and the slider is disabled. Retires hef.reduceMotion.
i18n: speed.label (en/es/fr/ja); warn.body reworded to point at the OS
setting.

Tests: +4 node unit cases for reverseStep (14/14 green); a11y e2e Task 5
rewritten for the slider (13/13 green); static-build e2e green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 simulator/e2e/tests/a11y.spec.ts |  70 ++++++++++++++++---
 simulator/static/app.js          | 113 ++++++++++++++++++++++++-------
 simulator/static/i18n.js         |   4 +-
 simulator/static/index.html      |  16 +++--
 simulator/static/scrub.js        |  19 +++++-
 simulator/static/style.css       |   4 ++
 simulator/unit/scrub.test.js     |  25 +++++++
 7 files changed, 210 insertions(+), 41 deletions(-)

diff --git a/simulator/e2e/tests/a11y.spec.ts b/simulator/e2e/tests/a11y.spec.ts
index add613c..37384d5 100644
--- a/simulator/e2e/tests/a11y.spec.ts
+++ b/simulator/e2e/tests/a11y.spec.ts
@@ -41,23 +41,73 @@ test.describe("Task 4 — Photosensitivity warning gate", () => {
   });
 });
 
-test.describe("Task 5 — Reduced motion", () => {
-  test("reduce-motion toggle pauses video playback", async ({ page }) => {
-    await page.emulateMedia({ reducedMotion: "no-preference" }); // deterministic default-off
-    await page.goto("/");
+test.describe("Task 5 — Playback speed slider (replaces Reduce motion)", () => {
+  // Helper: start the experience so #vid-loop is playing.
+  async function startExperience(page: import("@playwright/test").Page) {
     await page.locator("#motion-warning-continue").click().catch(() => {});
-    const rm = page.locator("#reduce-motion");
-    await expect(rm).not.toBeChecked();          // default-off under no-preference
     await page.locator("#run-sim").click();
     await page.waitForTimeout(500);
     await expect
       .poll(() => page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.paused))
-      .toBe(false);                              // experience running → video plays
-    await page.locator('label[for="reduce-motion"]').click(); // hidden input: toggle via its label
-    await expect(rm).toBeChecked();
+      .toBe(false); // experience running → loop plays
+  }
+
+  test("the Reduce motion toggle is gone, replaced by a speed slider", async ({ page }) => {
+    await page.emulateMedia({ reducedMotion: "no-preference" });
+    await page.goto("/");
+    await expect(page.locator("#reduce-motion")).toHaveCount(0);
+    const slider = page.locator("#play-speed");
+    await expect(slider).toBeVisible();
+    await expect(slider).toHaveValue("1");        // default = normal speed
+  });
+
+  test("forward speed sets the loop video's playbackRate", async ({ page }) => {
+    await page.emulateMedia({ reducedMotion: "no-preference" });
+    await page.goto("/");
+    await startExperience(page);
+    await page.locator("#play-speed").fill("2");
+    await expect
+      .poll(() => page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.playbackRate))
+      .toBe(2);
+  });
+
+  test("0x freezes the loop video", async ({ page }) => {
+    await page.emulateMedia({ reducedMotion: "no-preference" });
+    await page.goto("/");
+    await startExperience(page);
+    await page.locator("#play-speed").fill("0");
     await expect
       .poll(() => page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.paused))
-      .toBe(true);                               // reduced motion → frozen
+      .toBe(true);
+  });
+
+  test("negative speed plays the loop in reverse (manual frame-stepping)", async ({ page }) => {
+    await page.emulateMedia({ reducedMotion: "no-preference" });
+    await page.goto("/");
+    await startExperience(page);
+    await page.locator("#play-speed").fill("-1.5");
+    await page.waitForTimeout(150);
+    const a = await page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.currentTime);
+    const paused = await page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.paused);
+    await page.waitForTimeout(250);
+    const b = await page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.currentTime);
+    // The reverse loop pauses the element and drives currentTime by hand — so the
+    // element reads paused, yet currentTime keeps moving (≠ forward play, ≠ freeze).
+    // (It may wrap loopStart→tail, so we assert movement, not a strict decrease.)
+    expect(paused).toBe(true);
+    expect(b).not.toBe(a);
+  });
+
+  test("OS reduced-motion disables the slider and freezes the loop", async ({ page }) => {
+    await page.emulateMedia({ reducedMotion: "reduce" });
+    await page.goto("/");
+    await page.locator("#motion-warning-continue").click().catch(() => {});
+    await page.locator("#run-sim").click();
+    await page.waitForTimeout(500);
+    await expect(page.locator("#play-speed")).toBeDisabled();
+    await expect
+      .poll(() => page.locator("#vid-loop").evaluate((v: HTMLVideoElement) => v.paused))
+      .toBe(true); // OS prefers-reduced-motion → frozen regardless of slider
   });
 });
 
diff --git a/simulator/static/app.js b/simulator/static/app.js
index 3fbb19a..8204688 100644
--- a/simulator/static/app.js
+++ b/simulator/static/app.js
@@ -313,7 +313,7 @@ function loadLoop(clip, landFrame) {
 
 function playLoop() {
   if (isReduced()) return;     // reduced motion holds a still frame — never auto-play the loop
-  if (loopVid.paused) loopVid.play().catch(() => {});
+  applyPlaySpeed();            // honor the chosen speed/direction (forward, freeze, or reverse)
 }
 
 function ensureClipMedia() {
@@ -1120,39 +1120,104 @@ function onDialKey(e) {
 // cache) — no server endpoints. Editing labels stays in /author.html.
 const DEV_KEY = "hef.devMode";
 const WARN_KEY = "hef.motionWarnDismissed";
-const RM_KEY = "hef.reduceMotion";
+const SPEED_KEY = "hef.playSpeed";
 let devMode = false;
 let devStatsTimer = null;
 
-// --- Reduced motion (freeze-to-stills) ---------------------------------------
-// Default follows the OS `prefers-reduced-motion` until the visitor chooses, then
-// their choice persists. When ON: video holds a frame (paused), auto transitions
-// jump instantly instead of tweening — knob changes still re-grade the still.
-let reduceMotion = false;
-function isReduced() { return reduceMotion; }
-function initReduceMotion() {
-  const box = $("reduce-motion");
+// --- Playback speed + reduced motion -----------------------------------------
+// "Reduce motion" is no longer a visible toggle — its accessibility behavior is
+// derived LIVE from the OS `prefers-reduced-motion` setting (no persisted
+// override). The visible control is the Playback Speed slider, which drives ONLY
+// the resting altitude loop video (#vid-loop); the morph/transition video (#vid)
+// is scrub-driven and is never speed-controlled. Below 0x the loop plays in
+// reverse via a manual rAF loop (native negative playbackRate is unreliable —
+// Chrome ignores it). When the OS asks for reduced motion the loop stays frozen
+// and the slider is disabled, so a vestibular/photosensitive visitor never gets
+// motion they did not ask for.
+const SPEED_EPS = 0.02;               // |speed| below this = freeze (treat as 0)
+let playSpeed = 1;
+let revRaf = 0;                       // rAF handle for the manual reverse loop
+let revLast = 0;                      // last rAF timestamp (ms) for dt
+const reduceMq = (window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)")) || null;
+function isReduced() { return !!(reduceMq && reduceMq.matches); }
+
+function stopReverse() {
+  if (revRaf) { cancelAnimationFrame(revRaf); revRaf = 0; }
+}
+// One reverse-loop frame: step #vid-loop's currentTime backward via the pure
+// HEFScrub.reverseStep math, then schedule the next. dt is capped so a stalled
+// tab can't make a giant jump.
+function reverseTick(now) {
+  if (!revRaf) return;
+  const dt = revLast ? Math.min((now - revLast) / 1000, 0.1) : 0;
+  revLast = now;
+  const dur = loopVid.duration;
+  if (Number.isFinite(dur) && dur > 0 && dt > 0) {
+    const r = HEFScrub.reverseStep(loopVid.currentTime, Math.abs(playSpeed), dt, loopStartFrame(), dur);
+    try { loopVid.currentTime = r.next; } catch (_) { /* not seekable yet */ }
+  }
+  revRaf = requestAnimationFrame(reverseTick);
+}
+function startReverse() {
+  if (revRaf) return;
+  loopVid.pause();                    // the rAF owns the element while reversing
+  revLast = 0;
+  revRaf = requestAnimationFrame(reverseTick);
+}
+// Apply the chosen slider speed to the resting loop video. When reduced motion
+// holds or video output is off, the freeze/play decision belongs to
+// syncReducedMotion / playLoop — here we only make sure no reverse loop is left
+// running and the forward rate is sane for when it resumes.
+function applyPlaySpeed() {
+  stopReverse();
+  if (isReduced() || !videoEverOn || !$("visual").checked) {
+    loopVid.playbackRate = Math.max(0.0625, Math.abs(playSpeed) || 1);
+    return;
+  }
+  if (playSpeed > SPEED_EPS) {
+    loopVid.playbackRate = playSpeed;
+    if (loopVid.paused) loopVid.play().catch(() => {});
+  } else if (playSpeed < -SPEED_EPS) {
+    startReverse();
+  } else {
+    loopVid.pause();                  // ~0x → freeze on the current frame
+  }
+}
+function updateSpeedLabel() {
+  const el = $("play-speed-val");
+  if (el) el.textContent = playSpeed.toFixed(2).replace("-", "−") + "×";
+}
+function initPlaySpeed() {
+  const slider = $("play-speed");
   let stored = null;
-  try { stored = localStorage.getItem(RM_KEY); } catch (_) {}
-  const prefers = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-  reduceMotion = stored === null ? !!prefers : stored === "1";
-  if (box) {
-    box.checked = reduceMotion;
-    box.addEventListener("change", () => {
-      reduceMotion = box.checked;
-      try { localStorage.setItem(RM_KEY, reduceMotion ? "1" : "0"); } catch (_) {}
-      applyReduceMotion();
+  try { stored = localStorage.getItem(SPEED_KEY); } catch (_) {}
+  playSpeed = stored === null ? 1 : (parseFloat(stored) || 0);
+  if (slider) {
+    slider.value = String(playSpeed);
+    slider.addEventListener("input", () => {
+      playSpeed = parseFloat(slider.value) || 0;
+      try { localStorage.setItem(SPEED_KEY, String(playSpeed)); } catch (_) {}
+      updateSpeedLabel();
+      applyPlaySpeed();
     });
   }
-  applyReduceMotion();
+  updateSpeedLabel();
+  syncReducedMotion();                // initial enable/disable + freeze/play state
+  if (reduceMq && reduceMq.addEventListener) reduceMq.addEventListener("change", syncReducedMotion);
 }
-function applyReduceMotion() {
-  if (reduceMotion) {
+// Reconcile to the OS prefers-reduced-motion setting: when reduced, freeze both
+// videos and disable the speed slider; otherwise (re)apply the chosen speed.
+function syncReducedMotion() {
+  const slider = $("play-speed");
+  const reduced = isReduced();
+  if (slider) slider.disabled = reduced;
+  if (reduced) {
+    stopReverse();
     if (autoRaf) { cancelAnimationFrame(autoRaf); autoRaf = 0; }
     vid.pause();
     loopVid.pause();
   } else if (videoEverOn && $("visual").checked) {
-    playLoop();                         // resume the held loop on opt-out
+    applyPlaySpeed();                   // resume the held loop at the chosen speed
   }
 }
 
@@ -1523,7 +1588,7 @@ async function main() {
   buildDial();                // draw the altitude knob from the ring's scales
   initDev();                  // wire the Dev Mode toggle + pool picker (reads persisted state)
   initLanguage();             // populate the language dropdown + wire live switching
-  initReduceMotion();         // reduced-motion state + toggle (default from OS pref)
+  initPlaySpeed();            // playback-speed slider + OS-derived reduced motion
   renderScaleReadout();
   // Sliders stream on "input"; the toggles fire on "change".
   for (const id of ["left", "right", "mood"]) $(id).addEventListener("input", debounced);
diff --git a/simulator/static/i18n.js b/simulator/static/i18n.js
index 497e276..b0ea524 100644
--- a/simulator/static/i18n.js
+++ b/simulator/static/i18n.js
@@ -31,9 +31,9 @@
     "knobs.feel":     { en: "Feel", es: "Sentir", fr: "Ressentir", ja: "感じる" },
     "knobs.mood":     { en: "Mood — dark ◀ 0 ▶ light", es: "Ánimo — oscuro ◀ 0 ▶ claro", fr: "Humeur — sombre ◀ 0 ▶ clair", ja: "ムード — 暗 ◀ 0 ▶ 明" },
     "devmode.label":  { en: "Dev Mode", es: "Modo desarrollo", fr: "Mode dév", ja: "開発モード" },
-    "rm.label":       { en: "Reduce motion", es: "Reducir movimiento", fr: "Réduire les animations", ja: "動きを減らす" },
+    "speed.label":    { en: "Speed", es: "Velocidad", fr: "Vitesse", ja: "再生速度" },
     "warn.title":     { en: "Heads up — motion & flashing" },
-    "warn.body":      { en: "This experience contains continuous motion, flashing, and shifting imagery. If you are sensitive to motion or flashing light, turn on “Reduce motion” in the panel before you begin." },
+    "warn.body":      { en: "This experience contains continuous motion, flashing, and shifting imagery. If you are sensitive to motion or flashing light, turn on your device’s “Reduce motion” setting before you begin — the experience honours it automatically." },
     "warn.continue":  { en: "Continue" },
     "about.link":     { en: "About", es: "Acerca de", fr: "À propos", ja: "概要" },
     "scale.cosmos":   { en: "cosmos", es: "cosmos", fr: "cosmos", ja: "宇宙" },
diff --git a/simulator/static/index.html b/simulator/static/index.html
index 4ad8c95..7340e2d 100644
--- a/simulator/static/index.html
+++ b/simulator/static/index.html
@@ -54,11 +54,19 @@
           <input type="range" id="audio" min="0" max="10" value="0" step="1" />
           <span id="audio-level-val">0</span>/10
         </label>
-        <label class="dev-switch" for="reduce-motion">
-          <input type="checkbox" id="reduce-motion" />
-          <span class="dev-switch-track"><span class="dev-switch-thumb"></span></span>
-          <span class="dev-switch-label" data-i18n="rm.label">Reduce motion</span>
+        <label class="audio-level play-speed"><span data-i18n="speed.label">Speed</span>
+          <input type="range" id="play-speed" min="-2" max="2" step="any" value="1"
+                 list="play-speed-ticks" aria-describedby="play-speed-val" />
+          <span id="play-speed-val">1.00×</span>
         </label>
+        <datalist id="play-speed-ticks">
+          <option value="-2"></option><option value="-1.75"></option><option value="-1.5"></option>
+          <option value="-1.25"></option><option value="-1"></option><option value="-0.75"></option>
+          <option value="-0.5"></option><option value="-0.25"></option><option value="0"></option>
+          <option value="0.25"></option><option value="0.5"></option><option value="0.75"></option>
+          <option value="1"></option><option value="1.25"></option><option value="1.5"></option>
+          <option value="1.75"></option><option value="2"></option>
+        </datalist>
         <label class="lang-pick">🌐
           <select id="lang-select" aria-label="Language"></select>
         </label>
diff --git a/simulator/static/scrub.js b/simulator/static/scrub.js
index 171de04..42f0cb6 100644
--- a/simulator/static/scrub.js
+++ b/simulator/static/scrub.js
@@ -41,6 +41,23 @@
     return dir < 0 ? 0 : loopTailS;
   }
 
+  // One frame of REVERSE loop playback for the resting altitude video. Native
+  // negative playbackRate is unreliable (Chrome ignores it), so app.js drives
+  // currentTime by hand; this is the pure math. The visible loop region is
+  // [loopStart, duration] (same frames the forward loop shows). Step back by
+  // absSpeed*dt; if it crosses below loopStart, wrap around to the tail
+  // (duration), carrying the overshoot modulo the region length so a big dt
+  // can't escape the region. Returns the next currentTime and whether a
+  // bottom-boundary wrap happened (so the caller can re-arm its loop state).
+  function reverseStep(t, absSpeed, dt, loopStart, duration) {
+    const L = duration - loopStart;
+    if (!(L > 0)) return { next: duration, wrapped: false };
+    const next = t - Math.abs(absSpeed) * dt;
+    if (next >= loopStart) return { next, wrapped: false };
+    const overshoot = (loopStart - next) % L;
+    return { next: duration - overshoot, wrapped: true };
+  }
+
   // Integers strictly crossed moving prevPos -> pos, in travel order. Landing
   // exactly on an integer counts as crossing it (it commits that altitude).
   function integerCrossings(prevPos, pos) {
@@ -53,5 +70,5 @@
     return out;
   }
 
-  return { clamp01, wrapIndex, segmentOf, accumToPos, fracToTime, crossfadeGains, loopLandFrame, integerCrossings };
+  return { clamp01, wrapIndex, segmentOf, accumToPos, fracToTime, crossfadeGains, loopLandFrame, reverseStep, integerCrossings };
 });
diff --git a/simulator/static/style.css b/simulator/static/style.css
index 18d48d1..1de2098 100644
--- a/simulator/static/style.css
+++ b/simulator/static/style.css
@@ -164,6 +164,10 @@ input[type=range], select { width: 100%; }
                color: #9af; font-weight: 600; letter-spacing: 0.3px; }
 .audio-level input[type=range] { flex: 1; width: auto; }
 #audio-level-val { font-variant-numeric: tabular-nums; min-width: 1.2em; text-align: right; }
+/* Playback speed (−2×…2×) reuses the audio-level row look; wider value field for the sign + decimals. */
+#play-speed-val { font-variant-numeric: tabular-nums; min-width: 3.4em; text-align: right; }
+.play-speed input[type=range]:disabled { opacity: 0.4; cursor: not-allowed; }
+.play-speed:has(input:disabled) { opacity: 0.6; }
 .dev-panel { display: flex; flex-direction: column; gap: 0.8rem; }
 /* Beat the generic `.hidden` (defined earlier, equal specificity): two classes
    win, so the panel truly collapses when Dev Mode is off. */
diff --git a/simulator/unit/scrub.test.js b/simulator/unit/scrub.test.js
index 709c5f5..85e0ccd 100644
--- a/simulator/unit/scrub.test.js
+++ b/simulator/unit/scrub.test.js
@@ -59,6 +59,31 @@ test("integerCrossings: multiple crossings in travel order", () => {
   assert.deepEqual(S.integerCrossings(3.2, 1.8), [{ index: 3, dir: -1 }, { index: 2, dir: -1 }]);
 });
 
+test("reverseStep: decrements within the loop region without wrapping", () => {
+  // region [loopStart=3, duration=8]; step back absSpeed*dt = 0.5
+  assert.deepEqual(S.reverseStep(5, 1, 0.5, 3, 8), { next: 4.5, wrapped: false });
+  // landing exactly on the bottom boundary is the region edge, not a wrap
+  assert.deepEqual(S.reverseStep(3.5, 1, 0.5, 3, 8), { next: 3, wrapped: false });
+});
+
+test("reverseStep: wraps past the bottom boundary back to the tail (duration)", () => {
+  // 3.2 - 0.5 = 2.7 < 3 -> overshoot 0.3 -> 8 - 0.3 = 7.7
+  const r = S.reverseStep(3.2, 1, 0.5, 3, 8);
+  assert.equal(r.wrapped, true);
+  assert.ok(Math.abs(r.next - 7.7) < 1e-9, `next=${r.next}`);
+});
+
+test("reverseStep: overshoot larger than the region length wraps modulo", () => {
+  // region length L = 5; 3 - 7 = -4 -> overshoot 7 -> 7 % 5 = 2 -> 8 - 2 = 6
+  const r = S.reverseStep(3, 1, 7, 3, 8);
+  assert.equal(r.wrapped, true);
+  assert.ok(Math.abs(r.next - 6) < 1e-9, `next=${r.next}`);
+});
+
+test("reverseStep: degenerate region (duration <= loopStart) holds at duration", () => {
+  assert.deepEqual(S.reverseStep(3, 1, 0.5, 3, 3), { next: 3, wrapped: false });
+});
+
 test("loopLandFrame: descend lands on the morph's tail frame, ascend on its head", () => {
   // A morph spans src@0 (frac 0) -> dst@loopTailS (frac 1). Descending (dir>0) lands
   // on dst at frac 1 -> the base loop must continue from loopTailS. Ascending (dir<0)