@vosjs/studio-core 0.41.2 → 0.42.1

package/dist/index.js

@@ -623,7 +623,7 @@ function projectFromArtifact(artifact, videoUrl, opts = {}) {
   const coverage = surface === "monitor" || artifact.meta.windowMovedDuringTake || unfocused ? 0 : norm.coverage;
   if (artifact.cursor.length > 0 && coverage < CAPTURE_COVERAGE_MIN) {
     console.warn(
-      "[voila/studio] dropping cursor track \u2014",
+      "[studio] dropping cursor track \u2014",
       surface === "monitor" ? "entire-screen takes have no cursor effects (untrackable outside browser pages)" : artifact.meta.windowMovedDuringTake ? "window moved/resized during the take" : unfocused ? `browser window focused only ${Math.round((artifact.meta.windowFocusedFrac ?? 0) * 100)}% of the take \u2014 a different window was likely shared` : `coverage ${norm.coverage.toFixed(2)} (wrong surface shared, or unusable capture geometry)`
     );
   }
@@ -3403,6 +3403,13 @@ var TYPING_CLICK_ABSORB = 1.5;
 var TYPING_REFOCUS_FRAC = 0.08;
 function groupTrack(track, opts) {
   const { width, height, clusterGap, typingGap, typingZoom, targetFill } = opts;
+  const stepOf = (t) => opts.steps?.find(
+    (st) => st.do !== "wait" && !st.skipped && st.tStart <= t && t <= st.tEnd
+  ) ?? null;
+  const sameStep = (a, b) => {
+    const sa = stepOf(a.t);
+    return sa !== null && sa === stepOf(b.t);
+  };
   const minLevel = opts.minLevel ?? resolveZoomStyle().minLevel;
   const clicks = dedupePresses(
     track.filter((e) => e.type === "down")
@@ -3436,7 +3443,7 @@ function groupTrack(track, opts) {
     for (const c of list) {
       const last = clusters.at(-1);
       const prev = last?.at(-1);
-      const joins = last && prev && c.t - prev.t <= clusterGap && (!spatial || unionFitLevel(unionRect([...last, c]), width, height) >= minLevel);
+      const joins = last && prev && (c.t - prev.t <= clusterGap || sameStep(prev, c)) && (!spatial || unionFitLevel(unionRect([...last, c]), width, height) >= minLevel);
       if (joins) last.push(c);
       else clusters.push([c]);
     }
@@ -3515,7 +3522,8 @@ function planAutoZoom(track, options) {
     typingGap,
     typingZoom,
     targetFill,
-    minLevel
+    minLevel,
+    steps: options.steps
   });
   const { sessions } = grouped;
   const drags = dragsFromTrack(track, width, height);
@@ -3630,10 +3638,11 @@ function planAutoZoom(track, options) {
   const spans = within([...zSpans, ...kSpans, ...dragSpans]).sort(
     (a, b) => a.in - b.in
   );
+  const firstStep = options.steps?.find((st) => !st.skipped)?.tStart;
   const dwells = dwellSpans(track, width, height, maxLevel, [
     ...spans,
     ...dragReserved
-  ]);
+  ]).filter((d) => firstStep === void 0 || d.out > firstStep);
   return within([...spans, ...dwells]).sort((a, b) => a.in - b.in);
 }
 function typingSessions(track, width, height, typingGap) {
@@ -4834,7 +4843,7 @@ var STUDIO_SETUP = `async (ctx) => {
       // The MediaError rides along: code 4 is an unreadable/unsupported source
       // (a dead blob URL, a 404), code 3 a decode failure, code 2 a network
       // stall. A bare "failed to load" gave the fleet log nothing to act on.
-      v.onerror = () => rej(new Error('[voila] video failed to load' + (v.error ? ' (' + v.error.code + (v.error.message ? ': ' + v.error.message : '') + ')' : '')))
+      v.onerror = () => rej(new Error('[studio] video failed to load' + (v.error ? ' (' + v.error.code + (v.error.message ? ': ' + v.error.message : '') + ')' : '')))
       v.load()
     })
     cache.set(src, v)
@@ -4847,7 +4856,7 @@ var STUDIO_SETUP = `async (ctx) => {
       const img = new Image()
       img.crossOrigin = 'anonymous'
       img.onload = () => { cache.set(src, img); res(img) }
-      img.onerror = () => rej(new Error('[voila] image failed to load'))
+      img.onerror = () => rej(new Error('[studio] image failed to load'))
       img.src = src
     })
   }
@@ -4861,7 +4870,7 @@ var STUDIO_SETUP = `async (ctx) => {
       const faces = ctx.data.overlayFonts || ${JSON.stringify(OVERLAY_FONT_FACES)}
       // Mark what SETUP registers, so ON_FRAME's live path (a text overlay
       // arriving through SET_DATA) never adds the same face twice.
-      const ofSet = window.__voilaFontSet || (window.__voilaFontSet = {})
+      const ofSet = window.__vosFontSet || (window.__vosFontSet = {})
       const loads = faces.map((f) => {
         ofSet[f.family + '|' + f.weight] = 1
         const ff = new FontFace(f.family, 'url(' + f.url + ')', { weight: String(f.weight) })
@@ -4872,7 +4881,7 @@ var STUDIO_SETUP = `async (ctx) => {
         Promise.all(loads).catch(() => {}),
         new Promise((res) => setTimeout(res, 4000)),
       ])
-    } catch (e) { console.warn('[voila] overlay fonts failed to load', e) }
+    } catch (e) { console.warn('[studio] overlay fonts failed to load', e) }
   }
   // An HTML layer arrives as SOURCE, and the picture is built HERE.
   //
@@ -4915,7 +4924,7 @@ var STUDIO_SETUP = `async (ctx) => {
       // Fail open per URL, and NOT sticky: the layer paints without it now
       // and the next build asks again.
       faceData.delete(url)
-      console.warn('[voila] html layer ' + what + ' failed to load', url, e)
+      console.warn('[studio] html layer ' + what + ' failed to load', url, e)
       return ''
     })
     faceData.set(url, p)
@@ -4967,7 +4976,7 @@ var STUDIO_SETUP = `async (ctx) => {
         ns.htmlSafe = true
       } catch (e) {
         ns.htmlSafe = false
-        console.error('[voila] html layers are off: this browser taints a canvas that draws a foreignObject SVG', e)
+        console.error('[studio] html layers are off: this browser taints a canvas that draws a foreignObject SVG', e)
       }
     }
     // One picture per clip in the cache: the previous key goes when a new
@@ -4984,7 +4993,7 @@ var STUDIO_SETUP = `async (ctx) => {
   // recorded on the clip and said at the level a render page forwards.
   ns.buildHtmlLayer = (oc, live) => buildHtmlLayer(oc, live).catch((e) => {
     ns.htmlErrors[oc.id] = String((e && e.message) || e)
-    console.error('[voila] html layer ' + oc.id + ' ' + ns.htmlErrors[oc.id])
+    console.error('[studio] html layer ' + oc.id + ' ' + ns.htmlErrors[oc.id])
   })
   // The capture contract for a LIVE layer, on ANY anchor. A recording's own
   // program installs the settle machinery (pendingDecodes, the wait a
@@ -5027,7 +5036,7 @@ var STUDIO_SETUP = `async (ctx) => {
     try {
       if (oc.kind === 'image') await loadImage(oc.key)
       else await load(oc.key, true)
-    } catch (e) { console.warn('[voila] overlay media failed to load', oc.key, e) }
+    } catch (e) { console.warn('[studio] overlay media failed to load', oc.key, e) }
   }
   // GLB object assets (V3b): load via the engine's GLTFLoader addon into a
   // shared cache, bbox-NORMALIZED (norm = 1/maxDim) so transform3d.scale means
@@ -5039,7 +5048,7 @@ var STUDIO_SETUP = `async (ctx) => {
     if (!oc.asset || oc.asset.kind !== 'gltf' || !oc.asset.key || objCache.has(oc.asset.key)) continue
     try {
       const GL = ctx.loaders && ctx.loaders.GLTFLoader
-      if (!GL) { console.warn('[voila] GLTFLoader unavailable'); continue }
+      if (!GL) { console.warn('[studio] GLTFLoader unavailable'); continue }
       const gltf = await new Promise((res, rej) => new GL().load(oc.asset.key, res, undefined, rej))
       const box = new ctx.THREE.Box3().setFromObject(gltf.scene)
       const size = new ctx.THREE.Vector3()
@@ -5048,7 +5057,7 @@ var STUDIO_SETUP = `async (ctx) => {
       box.getCenter(center)
       const maxDim = Math.max(size.x, size.y, size.z) || 1
       objCache.set(oc.asset.key, { scene: gltf.scene, norm: 1 / maxDim, center: center })
-    } catch (e) { console.warn('[voila] glb failed to load', oc.asset.key, e) }
+    } catch (e) { console.warn('[studio] glb failed to load', oc.asset.key, e) }
   }
   // 3D-text typefaces: FontLoader JSONs into a shared cache, keyed by
   // URL. Awaited here so frame 0 is complete on cold loads (export/chunk
@@ -5059,10 +5068,10 @@ var STUDIO_SETUP = `async (ctx) => {
     if (!oc.asset || oc.asset.kind !== 'text3d' || !oc.asset.url || fontCache.has(oc.asset.url)) continue
     try {
       const FL = ctx.loaders && ctx.loaders.FontLoader
-      if (!FL) { console.warn('[voila] FontLoader unavailable'); continue }
+      if (!FL) { console.warn('[studio] FontLoader unavailable'); continue }
       const font = await new Promise((res, rej) => new FL().load(oc.asset.url, res, undefined, rej))
       fontCache.set(oc.asset.url, font)
-    } catch (e) { console.warn('[voila] typeface failed to load', oc.asset.url, e) }
+    } catch (e) { console.warn('[studio] typeface failed to load', oc.asset.url, e) }
   }
   // Audio clips (music/SFX): start decoding into the shared cache now, but
   // never hold the first frame for it. Playback starts on a press, so the
@@ -5087,7 +5096,7 @@ var STUDIO_SETUP = `async (ctx) => {
           bufs.set(c.key, b)
           if (ns.audioSched) ns.audioSched.sig = ''
         })
-        .catch((e) => console.warn('[voila] audio decode failed', c.key, e))
+        .catch((e) => console.warn('[studio] audio decode failed', c.key, e))
         .then(() => pend.delete(c.key))
     }
   }
@@ -5209,7 +5218,7 @@ var STUDIO_FRAME = `(ctx, content, dt) => {
           .then(function (res) { return res.arrayBuffer() })
           .then(function (ab) { return actx.decodeAudioData(ab) })
           .then(function (b) { bufs.set(cc.key, b); AS.sig = '' })
-          .catch(function (e) { console.warn('[voila] audio decode failed', cc.key, e) })
+          .catch(function (e) { console.warn('[studio] audio decode failed', cc.key, e) })
           .then(function () { pend.delete(cc.key) })
       })(clips[di])
     }
@@ -5595,7 +5604,7 @@ var STUDIO_FRAME = `(ctx, content, dt) => {
     // Keyed per window, so SETUP's cold-load faces and repeat frames never
     // re-register; fail-open, frames repaint as each face lands.
     if (typeof FontFace !== 'undefined') {
-      var ofSet = window.__voilaFontSet || (window.__voilaFontSet = {})
+      var ofSet = window.__vosFontSet || (window.__vosFontSet = {})
       var ofBase = d.overlayFonts || ${JSON.stringify(OVERLAY_FONT_FACES)}
       for (var ofi = 0; ofi < ofBase.length; ofi++) {
         var ofB = ofBase[ofi]
@@ -6759,7 +6768,7 @@ var FRAME_STEP_SRC = `
     // A WebCodecs provider (capture pages) services the frame by PTS at
     // decode speed \u2014 no element seek, no 250ms settle cap. The element stays
     // paused as the dimension source and fallback.
-    var wcp = vid.__voilaWc
+    var wcp = vid.__vosWc
     if (wcp) {
       var wcT = Math.min(srcT, wcp.duration || srcT)
       if (wcp.req !== wcT) {
@@ -6790,7 +6799,7 @@ var FRAME_STEP_SRC = `
     // Capture pages: the loop's frame by PTS from its own provider, like the
     // footage. The loop clock only moves forward between wraps, so the walk
     // stays sequential and a wrap is one re-seek to the keyframe at 0.
-    var bwc = bgEl.__voilaWc
+    var bwc = bgEl.__vosWc
     if (bwc) {
       var bwT = Math.min(bgT, bwc.duration || bgT)
       if (bwc.req !== bwT) {
@@ -6837,9 +6846,9 @@ var FRAME_STEP_SRC = `
         if (fired) return
         fired = true
         g.removeEventListener('loadeddata', done)
-        if (g.__voilaWant != null && g.readyState >= 1) {
-          var want = g.__voilaWant
-          g.__voilaWant = null
+        if (g.__vosWant != null && g.readyState >= 1) {
+          var want = g.__vosWant
+          g.__vosWant = null
           var seeked = function () { g.removeEventListener('seeked', seeked); resolve() }
           g.addEventListener('seeked', seeked)
           setTimeout(seeked, 250)
@@ -6859,8 +6868,8 @@ var FRAME_STEP_SRC = `
     return g
   }
   function stepGhost(g, at) {
-    if (g.readyState >= 1) { g.__voilaWant = null; stepPaused(g, at); return }
-    g.__voilaWant = at
+    if (g.readyState >= 1) { g.__vosWant = null; stepPaused(g, at); return }
+    g.__vosWant = at
   }`;
 var SETUP = `async (ctx) => {
   ;${timelineRuntimeCode2}
@@ -6888,11 +6897,11 @@ var SETUP = `async (ctx) => {
   const BG_BLOB_MAX = 64 * 1024 * 1024
   const toBlobUrl = async (src) => {
     const resp = await fetch(src)
-    if (!resp.ok) throw new Error('[voila] blob fetch HTTP ' + resp.status)
+    if (!resp.ok) throw new Error('[studio] blob fetch HTTP ' + resp.status)
     const len = Number(resp.headers.get('content-length') || 0)
     if (len > BLOB_FETCH_MAX) {
       try { if (resp.body) await resp.body.cancel() } catch (e) { void e }
-      throw new Error('[voila] blob fetch over size cap')
+      throw new Error('[studio] blob fetch over size cap')
     }
     const fetched = await resp.blob()
     // Keep the Blob itself: the WebCodecs provider demuxes the SAME
@@ -6906,7 +6915,7 @@ var SETUP = `async (ctx) => {
     let url = src
     if (ctx.data.videoFetchMode === 'blob') {
       try { url = await toBlobUrl(src) }
-      catch (e) { console.warn('[voila] blob fetch failed, using network src', e) }
+      catch (e) { console.warn('[studio] blob fetch failed, using network src', e) }
     }
     v = document.createElement('video')
     v.src = url
@@ -6919,7 +6928,7 @@ var SETUP = `async (ctx) => {
       // The MediaError rides along: code 4 is an unreadable/unsupported source
       // (a dead blob URL, a 404), code 3 a decode failure, code 2 a network
       // stall. A bare "failed to load" gave the fleet log nothing to act on.
-      v.onerror = () => rej(new Error('[voila] video failed to load' + (v.error ? ' (' + v.error.code + (v.error.message ? ': ' + v.error.message : '') + ')' : '')))
+      v.onerror = () => rej(new Error('[studio] video failed to load' + (v.error ? ' (' + v.error.code + (v.error.message ? ': ' + v.error.message : '') + ')' : '')))
       v.load()
     })
     cache.set(src, v)
@@ -6934,7 +6943,7 @@ var SETUP = `async (ctx) => {
       const img = new Image()
       img.crossOrigin = 'anonymous'
       img.onload = () => { cache.set(src, img); res(img) }
-      img.onerror = () => rej(new Error('[voila] image failed to load'))
+      img.onerror = () => rej(new Error('[studio] image failed to load'))
       img.src = src
     })
   }
@@ -7010,7 +7019,7 @@ var SETUP = `async (ctx) => {
           provider.req = t
           chain = chain
             .then(() => advanceTo(t))
-            .catch((e) => { console.warn('[voila] webcodecs frame failed', e) })
+            .catch((e) => { console.warn('[studio] webcodecs frame failed', e) })
           return chain
         },
         // Draw the CURRENT frame into the card. Returns false (element path
@@ -7045,12 +7054,12 @@ var SETUP = `async (ctx) => {
           (wcProvider.width === video.videoWidth &&
             wcProvider.height === video.videoHeight))
       ) {
-        video.__voilaWc = wcProvider
+        video.__vosWc = wcProvider
       } else if (wcProvider) {
-        console.warn('[voila] webcodecs dims mismatch \u2014 element path keeps the frame')
+        console.warn('[studio] webcodecs dims mismatch \u2014 element path keeps the frame')
       }
     } catch (e) {
-      console.warn('[voila] webcodecs provider unavailable, seeks stay html5', e)
+      console.warn('[studio] webcodecs provider unavailable, seeks stay html5', e)
     }
   }
   // The webcam is a separate recording (video-only) drawn as an editable bubble overlay.
@@ -7069,14 +7078,14 @@ var SETUP = `async (ctx) => {
       if (!m.isImage && ctx.data.videoDecodeMode === 'webcodecs') {
         try {
           const wp = await makeWcProvider(m.src)
-          if (wp && (!el.videoWidth || (wp.width === el.videoWidth && wp.height === el.videoHeight))) el.__voilaWc = wp
+          if (wp && (!el.videoWidth || (wp.width === el.videoWidth && wp.height === el.videoHeight))) el.__vosWc = wp
         } catch (e) {
-          console.warn('[voila] webcodecs provider unavailable for a media, seeks stay html5', e)
+          console.warn('[studio] webcodecs provider unavailable for a media, seeks stay html5', e)
         }
       }
       mediaEls[m.id] = el
     } catch (e) {
-      console.warn('[voila] a media failed to load', m.id, e)
+      console.warn('[studio] a media failed to load', m.id, e)
     }
   }
   // Background media (frame.backgroundMedia): warm-load so the first paint is
@@ -7096,7 +7105,7 @@ var SETUP = `async (ctx) => {
         // into a Blob first when it is small enough (one request instead
         // of ranged reads against a CDN). FAIL-OPEN to the element at
         // every step, like the footage.
-        if (ctx.data.videoDecodeMode === 'webcodecs' && !bgV.__voilaWc) {
+        if (ctx.data.videoDecodeMode === 'webcodecs' && !bgV.__vosWc) {
           try {
             if (!(ns.videoBlobs && ns.videoBlobs.get(bgm.key)) && bgm.key.indexOf('blob:') !== 0 && bgm.key.indexOf('data:') !== 0) {
               try {
@@ -7110,22 +7119,22 @@ var SETUP = `async (ctx) => {
               } catch (e) { void e }
             }
             const bgWc = await makeWcProvider(bgm.key)
-            if (bgWc && (!bgV.videoWidth || (bgWc.width === bgV.videoWidth && bgWc.height === bgV.videoHeight))) bgV.__voilaWc = bgWc
+            if (bgWc && (!bgV.videoWidth || (bgWc.width === bgV.videoWidth && bgWc.height === bgV.videoHeight))) bgV.__vosWc = bgWc
           } catch (e) {
-            console.warn('[voila] webcodecs provider unavailable for the background, seeks stay html5', e)
+            console.warn('[studio] webcodecs provider unavailable for the background, seeks stay html5', e)
           }
         }
       }
-    } catch (e) { console.warn('[voila] background media failed to load', e) }
+    } catch (e) { console.warn('[studio] background media failed to load', e) }
   }
   // Which path decodes what, for a host's telemetry: 'provider' is the
   // sequential WebCodecs walk, 'element' an HTMLVideoElement seek per frame.
-  ns.voilaDecode = {
-    recording: ctx.data.isImage ? 'none' : video.__voilaWc ? 'provider' : 'element',
+  ns.studioDecode = {
+    recording: ctx.data.isImage ? 'none' : video.__vosWc ? 'provider' : 'element',
     backdrop: (function () {
       if (!bgm || !bgm.key || bgm.kind === 'image') return 'none'
       const bgHit = cache.get(bgm.key)
-      return bgHit && bgHit.__voilaWc ? 'provider' : 'element'
+      return bgHit && bgHit.__vosWc ? 'provider' : 'element'
     })(),
   }
   // Frame prep: a capture harness calls every ns.framePrep hook right after
@@ -7141,7 +7150,7 @@ var SETUP = `async (ctx) => {
   // chaining; playback never calls it; a harness without it keeps the
   // two-phase loop and stays correct.
   ns.framePrep = ns.framePrep || new Map()
-  ns.framePrep.set('voila.card', (t) => {
+  ns.framePrep.set('studio.card', (t) => {
     if (ns.isPaused === false) return
     const d = ctx.data
     const TL = globalThis.__vosTimeline
@@ -7429,17 +7438,17 @@ var ON_FRAME = `(ctx, content, dt) => {
             // allow="autoplay" so the top frame's activation counts here).
             if (!vid.muted && err && err.name === 'NotAllowedError') {
               vid.muted = true
-              vid.__voilaAutoMuted = true
+              vid.__vosAutoMuted = true
               var p2 = vid.play()
               if (p2 && p2.catch) p2.catch(function () {})
             }
           })
-        } else if (vid.__voilaAutoMuted && d.audioUnlocked) {
+        } else if (vid.__vosAutoMuted && d.audioUnlocked) {
           // First user gesture happened \u2014 lift the policy fallback. If the
           // browser still objects it pauses the element, and the paused branch
           // above self-heals (re-mute + resume) on the next frame.
           vid.muted = false
-          vid.__voilaAutoMuted = false
+          vid.__vosAutoMuted = false
         }
       } else {
         // The paused step (FRAME_STEP_SRC): the provider by PTS, else the
@@ -7759,7 +7768,7 @@ var ON_FRAME = `(ctx, content, dt) => {
       // The loop's provider draws its current sample (paused capture
       // pages); false \u21D2 the element (playback, or before the first ask).
       try {
-        var bgWcp = !bgIsImg && !playing ? bgEl.__voilaWc : null
+        var bgWcp = !bgIsImg && !playing ? bgEl.__vosWc : null
         if (!(bgWcp && bgWcp.draw(bgC, null, (W - bgDw) / 2 + bgOx, (H - bgDh) / 2 + bgOy, bgDw, bgDh))) {
           bgC.drawImage(bgEl, (W - bgDw) / 2 + bgOx, (H - bgDh) / 2 + bgOy, bgDw, bgDh)
         }
@@ -8021,7 +8030,7 @@ var ON_FRAME = `(ctx, content, dt) => {
     // The provider draws the current sample directly (crop-capable,
     // dimension-checked at attach); false \u21D2 element path (pre-first-seek,
     // or the provider never attached).
-    var wcp3 = video.__voilaWc
+    var wcp3 = video.__vosWc
     if (!(wcp3 && wcp3.draw(c, crp, ceX, ceY, ceW, ceH))) {
       if (crp) c.drawImage(video, crp.x, crp.y, crp.w, crp.h, ceX, ceY, ceW, ceH)
       else c.drawImage(video, ceX, ceY, ceW, ceH)
@@ -8580,10 +8589,10 @@ var ON_FRAME = `(ctx, content, dt) => {
   // gated inside their blocks (dirty-tracking above).
   if (card.texture) card.texture.needsUpdate = true
 
-  // verification hook (no-op unless the harness sets window.__VOILA_DEBUG__).
+  // verification hook (no-op unless the harness sets window.__STUDIO_DEBUG__).
   // cv = the CARD 2D canvas; bgCv/ovCv are the background/overlay layers (v2).
-  if (typeof window !== 'undefined' && window.__VOILA_DEBUG__) {
-    window.__voilaDebug = { cv: cv, bgCv: bg.canvas, ovCv: ov.canvas, W: W, H: H, glW: gl && gl.width, glH: gl && gl.height, t: t, canvases: document.querySelectorAll('canvas').length }
+  if (typeof window !== 'undefined' && window.__STUDIO_DEBUG__) {
+    window.__studioDebug = { cv: cv, bgCv: bg.canvas, ovCv: ov.canvas, W: W, H: H, glW: gl && gl.width, glH: gl && gl.height, t: t, canvases: document.querySelectorAll('canvas').length }
   }
 }`;
 function studioLayerData(input, duration, pins) {
@@ -9238,13 +9247,15 @@ var DEFAULT_SPEED_PARAMS = {
   typingMin: 3,
   typingRate: 3,
   scrollMin: 2.5,
-  scrollRate: 2
+  scrollRate: 2,
+  stillRate: 2
 };
 var TYPING_GAP = 1.5;
 var SCROLL_GAP = 0.8;
 var IDLE_PAD = 0.6;
 var MIN_SPAN = 1;
 var PLAYBACK_ACTIVITY = 0.1;
+var STILL_ACTIVITY = 0.02;
 function planAutoSpeed(track, opts) {
   const p = { ...DEFAULT_SPEED_PARAMS, ...opts.params };
   const durS = opts.durationMs / 1e3;
@@ -9263,6 +9274,9 @@ function planAutoSpeed(track, opts) {
     p.scrollMin,
     (start, last) => cands.push({ in: start, out: last, rate: p.scrollRate })
   );
+  for (const [a, b] of stillSteps(opts.steps, opts.activity)) {
+    if (b - a >= MIN_SPAN) cands.push({ in: a, out: b, rate: p.stillRate });
+  }
   for (const [a, b] of idleGaps(evs, durS, p.idleMin)) {
     if (isPlayback(opts.activity, a, b)) continue;
     const start = a + IDLE_PAD;
@@ -9316,6 +9330,29 @@ function idleGaps(track, durationS, idleMin = DEFAULT_SPEED_PARAMS.idleMin) {
   if (durationS - prev >= idleMin) gaps.push([prev, durationS]);
   return gaps;
 }
+function stillSteps(steps, activity) {
+  if (!steps?.length || !activity?.length) return [];
+  const live = steps.filter((st) => !st.skipped);
+  const doing = live.map((st) => st.do !== "wait");
+  const first = doing.indexOf(true);
+  const last = doing.lastIndexOf(true);
+  const out = [];
+  for (const [i, st] of live.entries()) {
+    if (st.do !== "wait" && st.do !== "hover") continue;
+    if (st.do === "wait" && (first < 0 || i < first || i > last)) continue;
+    if (meanActivity(activity, st.tStart, st.tEnd) >= STILL_ACTIVITY) continue;
+    out.push([st.tStart, st.tEnd]);
+  }
+  return out;
+}
+function meanActivity(activity, a, b) {
+  const lo = Math.max(0, Math.floor(a));
+  const hi = Math.min(activity.length, Math.ceil(b));
+  if (hi <= lo) return 0;
+  let sum = 0;
+  for (let i = lo; i < hi; i++) sum += activity[i];
+  return sum / (hi - lo);
+}
 function isPlayback(activity, a, b) {
   if (!activity?.length) return false;
   const lo = Math.max(0, Math.floor(a));
@@ -9354,12 +9391,14 @@ function planForDigest(doc, activity) {
     width: meta.width,
     height: meta.height,
     style: doc.zoomStyle,
-    params: doc.zoomParams
+    params: doc.zoomParams,
+    steps: meta.steps
   });
   const speed = planAutoSpeed(cursor, {
     durationMs: meta.durationMs,
     params: doc.speedParams,
-    activity
+    activity,
+    steps: meta.steps
   });
   const style = resolveZoomStyle(doc.zoomStyle, doc.zoomParams);
   const intensity = doc.tiltStyle ?? style.tilt.intensity;
@@ -9399,7 +9438,8 @@ function momentsFromDoc(doc, plan, opts = {}) {
       typingGap: style.typingGap,
       typingZoom: style.typingZoom,
       targetFill: style.targetFill,
-      minLevel: style.minLevel
+      minLevel: style.minLevel,
+      steps: meta.steps
     });
     const pressed = (c, surface) => {
       const f = clusterFocus(c, width, height);
@@ -9495,15 +9535,30 @@ function momentsFromDoc(doc, plan, opts = {}) {
       rect: null
     });
   }
+  for (const c of opts.changes ?? []) {
+    if (!(c.at >= 0 && c.at < dur)) continue;
+    const peak = Math.min(dur, Math.max(c.at, c.peakAt));
+    drafts.push({
+      kind: "changed",
+      in: c.at,
+      out: peak,
+      at: peak,
+      focus: { cx: c.rect.x + c.rect.w / 2, cy: c.rect.y + c.rect.h / 2 },
+      rect: c.rect,
+      seedAt: c.at,
+      fraction: c.fraction
+    });
+  }
   const order = {
     head: 0,
     click: 1,
     typing: 2,
-    scroll: 3,
-    dwell: 4,
-    scene: 5,
-    idle: 6,
-    tail: 7
+    changed: 3,
+    scroll: 4,
+    dwell: 5,
+    scene: 6,
+    idle: 7,
+    tail: 8
   };
   drafts.sort((a, b) => a.in - b.in || order[a.kind] - order[b.kind]);
   const rated = ratedSegments(doc);
@@ -9512,8 +9567,17 @@ function momentsFromDoc(doc, plan, opts = {}) {
     return spanOutputExtent(rated, lo, Math.max(b, lo + 1e-3));
   };
   const covers = (s, d) => d.in === d.out ? s.in <= d.in && d.in < s.out : s.in < d.out && s.out > d.in;
+  const ids = drafts.map((_, i) => `m${String(i + 1).padStart(2, "0")}`);
+  const seedOf = (d) => {
+    if (d.kind !== "changed" || d.seedAt === void 0) return void 0;
+    const j = drafts.findIndex(
+      (x) => x.kind === "click" && x.at === d.seedAt || x.kind === "typing" && x.out === d.seedAt
+    );
+    return j >= 0 ? ids[j] : void 0;
+  };
   return drafts.map((d, i) => {
     const output = outputOf(d.in, d.out);
+    const seed = seedOf(d);
     const outAt = d.at === null ? null : outputOf(d.at, d.at);
     const proposed = {};
     const z = plan.zoom.find((s) => covers(s, d));
@@ -9523,7 +9587,7 @@ function momentsFromDoc(doc, plan, opts = {}) {
     const tl = plan.tilt.find((s) => covers(s, d));
     if (tl) proposed.tilt = tl.id;
     return {
-      id: `m${String(i + 1).padStart(2, "0")}`,
+      id: ids[i],
       kind: d.kind,
       source: { in: round10(d.in), out: round10(d.out) },
       output: output ? { in: round10(output.start), out: round10(output.end) } : null,
@@ -9539,9 +9603,10 @@ function momentsFromDoc(doc, plan, opts = {}) {
       ...d.clicks !== void 0 ? { clicks: d.clicks } : {},
       ...d.surface ? { surface: true } : {},
       ...d.pings !== void 0 ? { pings: d.pings } : {},
-      activity: activityOf(opts.bins, d),
+      activity: d.kind === "changed" && d.fraction !== void 0 ? round10(d.fraction) : activityOf(opts.bins, d),
       proposed,
-      said: saidOver(opts.transcript, d)
+      said: saidOver(opts.transcript, d),
+      ...seed ? { seed } : {}
     };
   });
 }
@@ -9568,6 +9633,105 @@ function round10(v) {
   return Math.round(v * 1e3) / 1e3;
 }
 
+// src/digest/changes.ts
+var CHANGE_GRID = { w: 128, h: 72 };
+var BLOCK_FILL = 0.5;
+var CHANGE_FLOOR = 0.02;
+var CHANGE_OFFSETS = [0.3, 0.8, 1.5, 2.5];
+var CHANGE_LEAD = 0.5;
+function changedRegion(before, after, delta, minBlocks = 1, ambient = null, block = Math.max(1, Math.round(before.w / 16))) {
+  const { w, h } = before;
+  if (after.w !== w || after.h !== h || w <= 0 || h <= 0) return null;
+  const cols = Math.ceil(w / block);
+  const rows = Math.ceil(h / block);
+  const moved = new Uint16Array(cols * rows);
+  const cells = new Uint16Array(cols * rows);
+  for (let y = 0; y < h; y++) {
+    const by = Math.floor(y / block);
+    for (let x = 0; x < w; x++) {
+      const i = y * w + x;
+      const b = by * cols + Math.floor(x / block);
+      cells[b]++;
+      const drift = ambient ? ambient.rate[i] * ambient.dt : 0;
+      if (Math.abs(after.luma[i] - before.luma[i]) - drift > delta) moved[b]++;
+    }
+  }
+  const filled = new Uint8Array(cols * rows);
+  for (let b = 0; b < filled.length; b++)
+    if (moved[b] >= cells[b] * BLOCK_FILL) filled[b] = 1;
+  const seen = new Uint8Array(cols * rows);
+  let best = null;
+  for (let start = 0; start < filled.length; start++) {
+    if (!filled[start] || seen[start]) continue;
+    const stack = [start];
+    seen[start] = 1;
+    let size = 0;
+    let minX = cols;
+    let minY = rows;
+    let maxX = -1;
+    let maxY = -1;
+    while (stack.length) {
+      const b = stack.pop();
+      size++;
+      const bx = b % cols;
+      const by = Math.floor(b / cols);
+      if (bx < minX) minX = bx;
+      if (bx > maxX) maxX = bx;
+      if (by < minY) minY = by;
+      if (by > maxY) maxY = by;
+      for (const [dx, dy] of [
+        [1, 0],
+        [-1, 0],
+        [0, 1],
+        [0, -1]
+      ]) {
+        const nx = bx + dx;
+        const ny = by + dy;
+        if (nx < 0 || ny < 0 || nx >= cols || ny >= rows) continue;
+        const n = ny * cols + nx;
+        if (filled[n] && !seen[n]) {
+          seen[n] = 1;
+          stack.push(n);
+        }
+      }
+    }
+    if (!best || size > best.size) best = { size, minX, minY, maxX, maxY };
+  }
+  if (!best || best.size < minBlocks) return null;
+  return {
+    fraction: best.size / (cols * rows),
+    rect: {
+      x: best.minX * block / w,
+      y: best.minY * block / h,
+      w: Math.min(w, (best.maxX + 1) * block) / w - best.minX * block / w,
+      h: Math.min(h, (best.maxY + 1) * block) / h - best.minY * block / h
+    }
+  };
+}
+function ambientDrift(earlier, before, lead) {
+  const { w, h } = before;
+  if (earlier.w !== w || earlier.h !== h || !(lead > 0)) return null;
+  const rate = new Array(w * h);
+  for (let i = 0; i < rate.length; i++)
+    rate[i] = Math.abs(before.luma[i] - earlier.luma[i]) / lead;
+  return rate;
+}
+function pickChange(seed, samples, floor = CHANGE_FLOOR) {
+  let best = null;
+  for (const s of samples) {
+    if (!s.region || s.region.fraction < floor) continue;
+    if (!best || s.region.fraction > (best.region?.fraction ?? 0)) best = s;
+  }
+  if (!best?.region) return null;
+  return {
+    seed: seed.id,
+    at: seed.at,
+    peakAt: seed.at + best.dt,
+    fraction: best.region.fraction,
+    rect: best.region.rect
+  };
+}
+
 // src/digest/scenes.ts
 var SCENE_MOTION = 0.25;
 var SCENE_QUIET = 0.1;
@@ -10099,6 +10263,7 @@ function buildDigest(input) {
       activity: "fraction of pixels that changed, per SOURCE second"
     },
     moments: withFiles,
+    steps: digestSteps(doc),
     activity: input.bins,
     plan: input.plan,
     doc: {
@@ -10122,6 +10287,26 @@ function buildDigest(input) {
     }
   };
 }
+function digestSteps(doc) {
+  const steps = doc.source.meta.steps ?? [];
+  if (!steps.length) return [];
+  const rated = ratedSegments(doc);
+  return steps.map((s) => {
+    const out = spanOutputExtent(rated, s.tStart, s.tEnd);
+    return {
+      step: s.step,
+      id: s.id ?? null,
+      do: s.do,
+      selector: s.selector ?? null,
+      source: { in: round11(s.tStart), out: round11(s.tEnd) },
+      output: out ? { in: round11(out.start), out: round11(out.end) } : null,
+      skipped: s.skipped === true,
+      navigated: s.navigated === true,
+      url: s.url ?? null,
+      text: s.text ?? null
+    };
+  });
+}
 function outputDurationOf(doc) {
   return docOutputDuration(doc);
 }
@@ -11956,6 +12141,10 @@ export {
   CARD_FADE_SECONDS,
   CARD_FOV,
   CARD_Z,
+  CHANGE_FLOOR,
+  CHANGE_GRID,
+  CHANGE_LEAD,
+  CHANGE_OFFSETS,
   CHANNEL_SPECS_HASH,
   CHANNEL_SPECS_VERIFIED,
   CLICK_FX_INTENSITY,
@@ -12105,6 +12294,7 @@ export {
   ZOOM_SPAN_MIN,
   ZOOM_STYLES,
   ZOOM_STYLE_OPTIONS,
+  ambientDrift,
   anchorKindOf,
   anchorSourceDuration,
   animStep,
@@ -12137,6 +12327,7 @@ export {
   cardPoseTrack,
   caretAt,
   caretStops,
+  changedRegion,
   clampCamFrac,
   clampCamSize,
   clampFocus,
@@ -12289,6 +12480,7 @@ export {
   pageDisplayUrl,
   parseCssColour,
   parsePoseId,
+  pickChange,
   pickStyle,
   pinBox,
   pinCandidates,