Route a video's sound through its own Master routing node

An editor recording had no sound while the video tab played a video.
The tab played its <video> straight to the speakers, past the Web
Audio graph, so the recording tap behind the limiter never heard it.
Fixing only that would have left videos as the one sound source the
Master routing cannot reach, so they get their own node, like sounds.

- A video asset with sound has a routing node labelled "Video". One
  without sound has none, it would have nothing to send.
- Its links take the sound after volume and FX. Several links or
  another level give the video its own bus, as with a sound.
- A new video follows the bus most other videos use. With none linked
  yet it goes to the Master, not to where the sounds go. Songs and
  sounds no longer follow videos either.
- Players only know their file, so videoBusesOf maps each file to the
  bus of its first asset. setMix takes that map and moves the gains of
  running videos at once when the routing changes.
- In the game, played in the editor or released, a video's sound
  follows its links. The tabs (video, composition, animation preview)
  play straight into the Master, as the sound tabs have since #368.
- The video tab's sound now goes through the Master, so its volume, FX
  and limiter apply there and the editor recording hears it.
- The recording badge beside the menu is an HTML element over the
  canvas now. The second render that drew it on the desynchronized
  canvas let the screen show a frame without it, so it flickered. The
  element is never in the copy, and clicks go through it.

Tests:
- Unit master-routing and sound-library: 3 new, green. Red without
  video in the routing kinds, without moving the gains, and with the
  old rule for the links of a new video.
- e2e 66e-iii: the tab plays a video linked to a bus, the level is
  0.09 on the Master and 0 on the bus. 66g: in the game the bus has
  0.09. Both red with the old ways.
- e2e 67e reads the badge from a real screenshot, still green.
- The README names 2043 e2e checks.
- Gate on melektaus-atx: 304 files, 4694 tests green.

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

tools/e2e/66-video.mjs

@@ -21,6 +21,7 @@ const DRIVEN = 'vd66-driven';
 const EARLY = 'vd66-early';
 const LATE = 'vd66-late';
 const CUT = 'vd66-cut';
+const BUS = 'vd66-bus';
 const LANE = LANES.video;
 const COLORS = { red: '#fe0000', green: '#00ff01', blue: '#0000ff', white: '#ffffff' };
 
@@ -184,6 +185,45 @@ export async function video(t) {
     JSON.stringify(resumed),
   );
 
+  // 66e-iii. With sound the video has a node in the Master routing (#351), linked to the master.
+  //          Sent into a bus there, the tab still plays it straight into the master, as every
+  //          tab's preview does (#368): heard at the output, where a recording of the editor
+  //          listens, and nothing on the bus. It used to play past the mix altogether.
+  const graphOf = (expr) => json(`((g) => ${expr})(__gm.routing.graph())`);
+  const routed = await graphOf(
+    `({ node: g.nodes.find((n) => n.id === ${JSON.stringify(assetId)}) ?? null,
+        links: g.edges.filter((e) => e.from.node === ${JSON.stringify(assetId)}).map((e) => e.to.node) })`,
+  );
+  check(
+    'a video with sound has a node of its own in the Master routing, linked to the master',
+    routed.node?.params.kind === 'video' &&
+      routed.node.params.name === 'colors' &&
+      JSON.stringify(routed.links) === '["#master"]',
+    JSON.stringify(routed),
+  );
+  await mutate(`
+    const p = __gm.state.project;
+    p.assets.push({ id: '${BUS}', type: 'bus', name: 'vd66 bus', props: {} });
+    p.routing.nodes.push({ id: '${BUS}', type: 'RoutedAsset', x: 320, y: 0, params: { name: 'vd66 bus', kind: 'bus' } });
+    p.routing.edges.push({ id: '${BUS}-out', from: { node: '${BUS}', port: 'out' }, to: { node: '#master', port: 'in' } });
+    for (const e of p.routing.edges) if (e.from.node === ${JSON.stringify(assetId)}) e.to = { node: '${BUS}', port: 'in' };`);
+  const metered = JSON.stringify(['mix', `mix:${BUS}`]);
+  await json(`__gm.routing.peaks(${metered})`);
+  await click(playButton.x, playButton.y);
+  const tabPeaks = await waitFor(
+    () => json(`__gm.routing.peaks(${metered})`),
+    (peaks) => Math.max(...(peaks.mix ?? [0])) > 0.01,
+  );
+  const tabRoutes = await json('__gm.routing.media()');
+  await click(playButton.x, playButton.y);
+  check(
+    'the tab plays the video straight into the master, past its routing',
+    Math.max(...(tabPeaks.mix ?? [0])) > 0.01 &&
+      Math.max(...(tabPeaks[`mix:${BUS}`] ?? [0])) === 0 &&
+      tabRoutes.some((r) => r.file === uploaded.file && !r.routed && r.bus === 'mix'),
+    JSON.stringify({ tabPeaks, tabRoutes }),
+  );
+
   // 66e-ii. With the clip picked (#403), a drag in the track off its handles or in the strip beside
   //         its band changes nothing; one on its band moves it whole, one undo step. A click in the
   //         track beside it picks the video, on it the clip again.
@@ -261,7 +301,8 @@ export async function video(t) {
   );
   await shot('66-video-sprite');
 
-  // 66g. Play starts it over from the clip's start and lets it be heard; Esc makes it quiet again.
+  // 66g. Play starts it over from the clip's start and lets it be heard, along the routing of its
+  //      video into the bus from 66e-iii; Esc makes it quiet again.
   await play();
   await sleep(200);
   const heard = (await json('__gm.videos()'))[0];
@@ -270,6 +311,18 @@ export async function video(t) {
     heard && !heard.muted && !heard.paused && heard.time >= 0.6 && heard.time < 1.1,
     JSON.stringify(heard),
   );
+  const runPeaks = await waitFor(
+    () => json(`__gm.routing.peaks(${metered})`),
+    (peaks) => Math.max(...(peaks[`mix:${BUS}`] ?? [0])) > 0.01,
+    20,
+  );
+  const runRoutes = await json('__gm.routing.media()');
+  check(
+    'in the game the video is heard on the bus its routing sends it to',
+    Math.max(...(runPeaks[`mix:${BUS}`] ?? [0])) > 0.01 &&
+      runRoutes.some((r) => r.file === uploaded.file && r.routed && r.bus === `mix:${BUS}`),
+    JSON.stringify({ runPeaks, runRoutes }),
+  );
   await stop();
   await sleep(200);
   const quiet = (await json('__gm.videos()'))[0];
@@ -589,7 +642,7 @@ export async function video(t) {
     const p = __gm.state.project;
     const gone = ['${OBJECT}', '${EARLY}', '${LATE}'];
     for (const holder of p.assets) if (holder.objects) holder.objects = holder.objects.filter((o) => !gone.includes(o.id));
-    p.assets = p.assets.filter((a) => ![ '${SPRITE}', '${DRIVEN}', '${CUT}', ${JSON.stringify(assetId)} ].includes(a.id));
+    p.assets = p.assets.filter((a) => ![ '${SPRITE}', '${DRIVEN}', '${CUT}', '${BUS}', ${JSON.stringify(assetId)} ].includes(a.id));
     __gm.state.select(null);
     __gm.lookAt(0, 0);`);
 }