@jokerized/decksmith 0.9.2 → 0.9.3

package/dist/cli.js

@@ -1814,7 +1814,11 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
   await mkdir3(dir, { recursive: true });
   const cssPath = join3(dir, "fonts.css");
   const cached2 = await readFile3(cssPath, "utf8").catch(() => "");
-  if (cached2.startsWith(stamp)) return { family, css: cached2, files: localNames(cached2) };
+  if (cached2.startsWith(stamp)) {
+    const css2 = withInterMetrics(cached2);
+    if (css2 !== cached2) await writeFile3(cssPath, css2);
+    return { family, css: css2, files: localNames(css2) };
+  }
   const res = await fetch(
     `https://fonts.googleapis.com/css2?${families.map((f) => `family=${f.replaceAll(" ", "+")}:wght@400;500;700`).join("&")}&text=${encodeURIComponent(text2)}&display=block`,
     { headers: { "User-Agent": UA } }
@@ -1832,11 +1836,19 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
     css = css.replaceAll(url2, name);
     files.push(name);
   }
-  css = `${stamp}
-${css}`;
+  css = withInterMetrics(`${stamp}
+${css}`);
   await writeFile3(cssPath, css);
   return { family, css, files };
 }
+var INTER_METRICS = "ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+function withInterMetrics(css) {
+  return css.replace(
+    /@font-face\s*\{(?![^}]*ascent-override)/g,
+    `@font-face {
+  ${INTER_METRICS};`
+  );
+}
 function localNames(css) {
   return [...css.matchAll(/url\(([^)]+)\)/g)].map((m) => m[1] ?? "");
 }
@@ -6832,7 +6844,6 @@ var READOUT_W = 460;
 var READOUT_LH = 1.35;
 var TALL_ASPECT = 1.15;
 var RESHAPE_SECONDS = 1.2;
-var GHOST_OPACITY = 0.28;
 var DRAW_SECONDS = 1.8;
 var DRAW_FLOOR = 1;
 var SEPARATE = 0.5;
@@ -6909,6 +6920,14 @@ var lineChart = (beat2, ctx) => {
     return new Set(kept);
   };
   const LABEL_SIZE3 = 40;
+  const RUN_ABOVE = Math.ceil(LABEL_SIZE3 * 0.969);
+  const RUN_BELOW = Math.ceil(LABEL_SIZE3 * 0.242);
+  const runBox = (left, by, w) => ({
+    x: left,
+    y: by - RUN_ABOVE,
+    w,
+    h: RUN_ABOVE + RUN_BELOW
+  });
   const runW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const catW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const nameW = (s) => textWidth(s, LABEL_SIZE3, 500, 0, false, face);
@@ -6923,17 +6942,47 @@ var lineChart = (beat2, ctx) => {
   const dots = p.points.map(
     (pt, i) => `<circle class="dot" cx="${n2(x(i))}" cy="${n2(y(pt.y))}" r="${i === p.points.length - 1 ? 11 : 9}" fill="${i === p.points.length - 1 ? theme.tones.b : theme.accent}" />`
   ).join("");
+  const labelBox = (cx, cy, text2, anchorStart = false) => {
+    const w = runW(text2);
+    return runBox(anchorStart ? cx : cx - w / 2, cy, w);
+  };
+  const curveBand = (pts, x0, x1) => {
+    const ys = [];
+    const py = (i) => y(pts[i]?.y ?? 0);
+    for (let i = 0; i < pts.length; i++) {
+      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
+    }
+    for (let i = 0; i + 1 < pts.length; i++) {
+      const [ax, bx] = [x(i), x(i + 1)];
+      for (const edge of [x0, x1]) {
+        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
+          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
+        }
+      }
+    }
+    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
+  };
+  const drawnThrough = (series, b) => {
+    const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+    return Math.min(b.y + b.h, bottom) - Math.max(b.y, top) > 8;
+  };
+  const valueBy = (i) => {
+    const v = p.points[i]?.y ?? 0;
+    const over = Math.max(44, y(v) - 26);
+    if (!cmp) return over;
+    const box2 = (by) => labelBox(x(i), by, String(v), i === 0);
+    if (!drawnThrough(cmp.points, box2(over))) return over;
+    const under = y(v) + 16 + RUN_ABOVE;
+    if (under > H - PAD2.b + 4) return over;
+    return drawnThrough(cmp.points, box2(under)) || drawnThrough(p.points, box2(under)) ? over : under;
+  };
   const shownValues = fitIndices((i) => runW(String(p.points[i]?.y ?? "")), true);
   const showsValue = (i) => shownValues.has(i);
   const values = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => {
     const anchor = i === 0 ? ' text-anchor="start"' : "";
-    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(Math.max(44, y(pt.y) - 26))}">${esc(String(pt.y))}</text>`;
+    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(valueBy(i))}">${esc(String(pt.y))}</text>`;
   }).join("");
-  const labelBox = (cx, cy, text2, anchorStart = false) => {
-    const w = runW(text2);
-    return { x: anchorStart ? cx : cx - w / 2, y: cy - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-  };
-  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), Math.max(44, y(pt.y) - 26), String(pt.y), i === 0));
+  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), valueBy(i), String(pt.y), i === 0));
   const overlaps = (a, b) => Math.min(a.x + a.w, b.x + b.w) - Math.max(a.x, b.x) > 8 && Math.min(a.y + a.h, b.y + b.h) - Math.max(a.y, b.y) > 8;
   const deltaBoxes = (p.deltas ?? []).slice(0, p.points.length - 1).map((d, i) => {
     const a = p.points[i];
@@ -6961,40 +7010,22 @@ var lineChart = (beat2, ctx) => {
     lineTag("line", basePath, ' opacity="0"'),
     `<path id="${sid}-target" d="${path2}" fill="none" stroke="none" />`
   ].join("\n    ") : lineTag("line", path2);
-  const curveBand = (pts, x0, x1) => {
-    const ys = [];
-    const py = (i) => y(pts[i]?.y ?? 0);
-    for (let i = 0; i < pts.length; i++) {
-      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
-    }
-    for (let i = 0; i + 1 < pts.length; i++) {
-      const [ax, bx] = [x(i), x(i + 1)];
-      for (const edge of [x0, x1]) {
-        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
-          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
-        }
-      }
-    }
-    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
-  };
   const fixedBoxes = [
     // `.axname` is the one run here set at weight 500 rather than 400, and
     // under-charging a width is the unrecoverable direction (see `padR`).
     // No `text-anchor` on the y half, so it runs rightwards from x=0.
-    { x: 0, y: 42 - LABEL_SIZE3, w: nameW(p.yLabel), h: LABEL_SIZE3 },
-    {
-      x: PAD2.l + plotW / 2 - nameW(p.xLabel) / 2,
-      y: H - 16 - LABEL_SIZE3,
-      w: nameW(p.xLabel),
-      h: LABEL_SIZE3
-    },
+    runBox(0, 42, nameW(p.yLabel)),
+    runBox(PAD2.l + plotW / 2 - nameW(p.xLabel) / 2, H - 16, nameW(p.xLabel)),
     ...ticks.map((v) => {
       const w = runW(v.toFixed(scale.decimals));
-      return { x: PAD2.l - 22 - w, y: y(v) + 13 - LABEL_SIZE3, w, h: LABEL_SIZE3 };
+      return runBox(PAD2.l - 22 - w, y(v) + 13, w);
     }),
     ...p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => shownX.has(i)).map(({ pt, i }) => labelBox(x(i), H - PAD2.b + 56, pt.x))
   ];
   const lastI = p.points.length - 1;
+  const LINE = RUN_ABOVE + RUN_BELOW;
+  const SWATCH = 48;
+  const SWATCH_GAP = 16;
   const ghost = (() => {
     if (!cmp) return void 0;
     const w = ghostW(cmp.label);
@@ -7003,6 +7034,18 @@ var lineChart = (beat2, ctx) => {
         `line-chart ${beat2.id}: the compare label "${cmp.label}" is ${Math.ceil(w)}px against the ${Math.floor(plotW)}px of plot it is set in. Shorten it.`
       );
     }
+    const drawnDeltas = deltasFit ? deltaBoxes : [];
+    const gapTo = (series, b) => {
+      const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+      return Math.max(0, top - (b.y + b.h), b.y - bottom);
+    };
+    const clearOfText = (b) => !fixedBoxes.some((f) => overlaps(b, f)) && !valueBoxes.some((v) => overlaps(b, v)) && !drawnDeltas.some((d) => d !== null && overlaps(b, d));
+    const stacked = (b) => valueBoxes.some(
+      (v) => Math.min(b.x + b.w, v.x + v.w) - Math.max(b.x, v.x) > 0 && Math.max(v.y - (b.y + b.h), b.y - (v.y + v.h)) < LINE
+    );
+    const crossed = (b) => [p.points, cmp.points].some((series) => drawnThrough(series, b));
+    const owned = (b) => gapTo(p.points, b) - gapTo(cmp.points, b) >= LINE;
+    const honest = (b) => clearOfText(b) && !stacked(b) && !crossed(b) && owned(b);
     const atEnd = (i, start) => {
       const cy = y(cmp.points[i]?.y ?? 0);
       const away = Math.max(44, cy - 26);
@@ -7010,20 +7053,42 @@ var lineChart = (beat2, ctx) => {
       const sides = cy < y(p.points[i]?.y ?? 0) ? [away, toward] : [toward, away];
       return sides.map((by) => ({ i, start, by }));
     };
-    const drawnDeltas = deltasFit ? deltaBoxes : [];
-    return [...atEnd(lastI, false), ...atEnd(0, true)].find((c) => {
-      const box2 = { x: c.start ? x(c.i) : x(c.i) - w, y: c.by - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-      if (fixedBoxes.some((f) => overlaps(box2, f))) return false;
-      if (valueBoxes.some((v) => overlaps(box2, v))) return false;
-      if (drawnDeltas.some((d) => d !== null && overlaps(box2, d))) return false;
-      return ![p.points, cmp.points].some((series) => {
-        const [top, bottom] = curveBand(series, box2.x, box2.x + box2.w);
-        return Math.min(box2.y + box2.h, bottom) - Math.max(box2.y, top) > 8;
-      });
+    const end2 = [...atEnd(lastI, false), ...atEnd(0, true)].find(
+      (c) => honest(runBox(c.start ? x(c.i) : x(c.i) - w, c.by, w))
+    );
+    if (end2) {
+      return { kind: "label", anchor: end2.start ? "start" : "end", x: x(end2.i), by: end2.by };
+    }
+    const yAt = (series, at2) => curveBand(series, at2, at2)[0];
+    const sep4 = (at2) => yAt(p.points, at2) - yAt(cmp.points, at2);
+    const centres = p.points.flatMap(
+      (_, i) => i < lastI ? [x(i), (x(i) + x(i + 1)) / 2] : [x(i)]
+    );
+    const along = centres.map((cx) => {
+      const left = Math.min(Math.max(cx - w / 2, PAD2.l), width - padR - w);
+      const side = Math.sign(sep4(left + w / 2));
+      const cols = [
+        left,
+        left + w,
+        ...p.points.map((_, i) => x(i)).filter((v) => v > left && v < left + w)
+      ];
+      const narrowest = Math.min(...cols.map((c) => side * sep4(c)));
+      const [top, bottom] = curveBand(cmp.points, left, left + w);
+      const by = side > 0 ? top - 16 - RUN_BELOW : bottom + 16 + RUN_ABOVE;
+      return { left, by, narrowest, side };
+    }).filter((c) => c.side !== 0 && c.by >= 44 && c.by <= H - PAD2.b + 4).sort((a, b) => b.narrowest - a.narrowest).find((c) => honest(runBox(c.left, c.by, w)));
+    if (along) return { kind: "label", anchor: "middle", x: along.left + w / 2, by: along.by };
+    const kw = SWATCH + SWATCH_GAP + w;
+    const right = width - padR;
+    const key = [42, H - 16].find((by) => {
+      const b = runBox(right - kw, by, kw);
+      return clearOfText(b) && !stacked(b) && !crossed(b);
     });
+    return key === void 0 ? void 0 : { kind: "key", left: right - kw, right, by: key };
   })();
-  const ghostLabel = cmp && ghost ? `
-    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.start ? "start" : "end"}" x="${n2(x(ghost.i))}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : "";
+  const ghostLabel = !cmp || !ghost ? "" : ghost.kind === "label" ? `
+    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.anchor}" x="${n2(ghost.x)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : `
+    <g class="ghostkey" id="${sid}-ghostlab"><line x1="${n2(ghost.left)}" y1="${n2(ghost.by - 14)}" x2="${n2(ghost.left + SWATCH)}" y2="${n2(ghost.by - 14)}" stroke="${theme.dim}" stroke-width="5" stroke-linecap="round" /><text class="ghostlab" text-anchor="end" x="${n2(ghost.right)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text></g>`;
   const readout = p.readout ? `
   <div class="readout" id="${sid}-read">${esc(p.readout)}</div>` : "";
   const html = `${chrome(sid, p.eyebrow, p.headline, box, face)}
@@ -7085,7 +7150,12 @@ var lineChart = (beat2, ctx) => {
       // The copy lifts off — same geometry, so the half-second reads as one line
       // separating from itself rather than as a second line arriving.
       tween(`#${sid}-line`, { opacity: 0 }, { opacity: 1, duration: SEPARATE }, lift2),
-      tween(`#${sid}-base`, { opacity: 1 }, { opacity: GHOST_OPACITY, duration: SEPARATE }, lift2),
+      tween(
+        `#${sid}-base`,
+        { stroke: theme.accent },
+        { stroke: theme.dim, duration: SEPARATE },
+        lift2
+      ),
       reshape(`#${sid}-line`, `#${sid}-target`, lift2 + SEPARATE, RESHAPE_SECONDS, true)
     );
   }
@@ -11628,8 +11698,11 @@ function closeSafe(code) {
 }
 function sceneHtml(sid, start, clip3, label, scene, transit) {
   const setup = [...mathSetup(sid, scene.html), ...scene.setup ?? []].map(statement).join("\n            ");
+  const measure4 = (scene.measure ?? []).map(statement);
+  const laps = lapSetup(sid, setup + measure4.join(""));
   const build = (pad) => [
-    ...(scene.measure ?? []).map(statement),
+    ...measure4,
+    ...laps,
     `window.__timelines = window.__timelines || {};`,
     `// Each scene owns a paused timeline under its own composition id, with`,
     `// times relative to its start \u2014 one absolute root timeline yields a`,
@@ -11674,6 +11747,15 @@ function mathSetup(sid, html) {
             })`
   ];
 }
+function lapSetup(sid, script) {
+  if (!script.includes("katex.render")) return [];
+  const laps = [".rlap", ".llap", ".clap"].map((c) => `#${sid} .katex ${c} *`).join(", ");
+  return [
+    statement(`Array.prototype.forEach.call(document.querySelectorAll('${laps}'), function (el) {
+              el.setAttribute("data-layout-allow-overlap", "");
+            })`)
+  ];
+}
 function statement(s) {
   const line2 = s.trim();
   return line2.endsWith(";") ? line2 : `${line2};`;
@@ -18016,7 +18098,8 @@ var FONTSOURCE = {
 async function vendorFace(face, dir) {
   return vendorFontsource(FONTSOURCE[face], familyOf(face), dir);
 }
-var PACK_DISPLAY = "font-display: block;\n  ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+var PACK_DISPLAY = `font-display: block;
+  ${INTER_METRICS}`;
 async function vendorFontsource(pkgName, family, dir) {
   const pkg = dirname(createRequire2(import.meta.url).resolve(pkgName));
   const css = await readFile11(join11(pkg, "index.css"), "utf8");
@@ -21697,12 +21780,13 @@ function scanPaperArc(storyboard, prefs) {
   }));
 }
 function scanNarrationDrift(storyboard, narration) {
-  const flat = (s) => (s ?? "").replace(/\s+/g, " ").trim();
+  const sentences = (s) => splitSentences((s ?? "").replace(/\s+/g, " ").trim()).join("\n");
   const stale = [];
   for (const beat2 of storyboard.beats) {
     const segments2 = narration.beats[beat2.id];
-    if (!segments2?.length || !flat(beat2.narration)) continue;
-    if (flat(segments2.map((s) => s.text).join(" ")) !== flat(beat2.narration)) stale.push(beat2.id);
+    const said = sentences(beat2.narration);
+    if (!segments2?.length || !said) continue;
+    if (sentences(segments2.map((s) => s.text).join(" ")) !== said) stale.push(beat2.id);
   }
   if (!stale.length) return [];
   return [

package/dist/index.js

@@ -1811,7 +1811,11 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
   await mkdir3(dir, { recursive: true });
   const cssPath = join3(dir, "fonts.css");
   const cached2 = await readFile3(cssPath, "utf8").catch(() => "");
-  if (cached2.startsWith(stamp)) return { family, css: cached2, files: localNames(cached2) };
+  if (cached2.startsWith(stamp)) {
+    const css2 = withInterMetrics(cached2);
+    if (css2 !== cached2) await writeFile3(cssPath, css2);
+    return { family, css: css2, files: localNames(css2) };
+  }
   const res = await fetch(
     `https://fonts.googleapis.com/css2?${families.map((f) => `family=${f.replaceAll(" ", "+")}:wght@400;500;700`).join("&")}&text=${encodeURIComponent(text2)}&display=block`,
     { headers: { "User-Agent": UA } }
@@ -1829,11 +1833,19 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
     css = css.replaceAll(url, name);
     files.push(name);
   }
-  css = `${stamp}
-${css}`;
+  css = withInterMetrics(`${stamp}
+${css}`);
   await writeFile3(cssPath, css);
   return { family, css, files };
 }
+var INTER_METRICS = "ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+function withInterMetrics(css) {
+  return css.replace(
+    /@font-face\s*\{(?![^}]*ascent-override)/g,
+    `@font-face {
+  ${INTER_METRICS};`
+  );
+}
 function localNames(css) {
   return [...css.matchAll(/url\(([^)]+)\)/g)].map((m) => m[1] ?? "");
 }
@@ -2321,7 +2333,8 @@ var FONTSOURCE = {
 async function vendorFace(face, dir) {
   return vendorFontsource(FONTSOURCE[face], familyOf(face), dir);
 }
-var PACK_DISPLAY = "font-display: block;\n  ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+var PACK_DISPLAY = `font-display: block;
+  ${INTER_METRICS}`;
 async function vendorFontsource(pkgName, family, dir) {
   const pkg = dirname(createRequire(import.meta.url).resolve(pkgName));
   const css = await readFile4(join4(pkg, "index.css"), "utf8");
@@ -6992,7 +7005,6 @@ var READOUT_W = 460;
 var READOUT_LH = 1.35;
 var TALL_ASPECT = 1.15;
 var RESHAPE_SECONDS = 1.2;
-var GHOST_OPACITY = 0.28;
 var DRAW_SECONDS = 1.8;
 var DRAW_FLOOR = 1;
 var SEPARATE = 0.5;
@@ -7069,6 +7081,14 @@ var lineChart = (beat2, ctx) => {
     return new Set(kept);
   };
   const LABEL_SIZE3 = 40;
+  const RUN_ABOVE = Math.ceil(LABEL_SIZE3 * 0.969);
+  const RUN_BELOW = Math.ceil(LABEL_SIZE3 * 0.242);
+  const runBox = (left, by, w) => ({
+    x: left,
+    y: by - RUN_ABOVE,
+    w,
+    h: RUN_ABOVE + RUN_BELOW
+  });
   const runW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const catW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const nameW = (s) => textWidth(s, LABEL_SIZE3, 500, 0, false, face);
@@ -7083,17 +7103,47 @@ var lineChart = (beat2, ctx) => {
   const dots = p.points.map(
     (pt, i) => `<circle class="dot" cx="${n2(x(i))}" cy="${n2(y(pt.y))}" r="${i === p.points.length - 1 ? 11 : 9}" fill="${i === p.points.length - 1 ? theme.tones.b : theme.accent}" />`
   ).join("");
+  const labelBox = (cx, cy, text2, anchorStart = false) => {
+    const w = runW(text2);
+    return runBox(anchorStart ? cx : cx - w / 2, cy, w);
+  };
+  const curveBand = (pts, x0, x1) => {
+    const ys = [];
+    const py = (i) => y(pts[i]?.y ?? 0);
+    for (let i = 0; i < pts.length; i++) {
+      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
+    }
+    for (let i = 0; i + 1 < pts.length; i++) {
+      const [ax, bx] = [x(i), x(i + 1)];
+      for (const edge of [x0, x1]) {
+        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
+          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
+        }
+      }
+    }
+    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
+  };
+  const drawnThrough = (series, b) => {
+    const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+    return Math.min(b.y + b.h, bottom) - Math.max(b.y, top) > 8;
+  };
+  const valueBy = (i) => {
+    const v = p.points[i]?.y ?? 0;
+    const over = Math.max(44, y(v) - 26);
+    if (!cmp) return over;
+    const box2 = (by) => labelBox(x(i), by, String(v), i === 0);
+    if (!drawnThrough(cmp.points, box2(over))) return over;
+    const under = y(v) + 16 + RUN_ABOVE;
+    if (under > H - PAD2.b + 4) return over;
+    return drawnThrough(cmp.points, box2(under)) || drawnThrough(p.points, box2(under)) ? over : under;
+  };
   const shownValues = fitIndices((i) => runW(String(p.points[i]?.y ?? "")), true);
   const showsValue = (i) => shownValues.has(i);
   const values = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => {
     const anchor = i === 0 ? ' text-anchor="start"' : "";
-    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(Math.max(44, y(pt.y) - 26))}">${esc(String(pt.y))}</text>`;
+    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(valueBy(i))}">${esc(String(pt.y))}</text>`;
   }).join("");
-  const labelBox = (cx, cy, text2, anchorStart = false) => {
-    const w = runW(text2);
-    return { x: anchorStart ? cx : cx - w / 2, y: cy - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-  };
-  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), Math.max(44, y(pt.y) - 26), String(pt.y), i === 0));
+  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), valueBy(i), String(pt.y), i === 0));
   const overlaps = (a, b) => Math.min(a.x + a.w, b.x + b.w) - Math.max(a.x, b.x) > 8 && Math.min(a.y + a.h, b.y + b.h) - Math.max(a.y, b.y) > 8;
   const deltaBoxes = (p.deltas ?? []).slice(0, p.points.length - 1).map((d, i) => {
     const a = p.points[i];
@@ -7121,40 +7171,22 @@ var lineChart = (beat2, ctx) => {
     lineTag("line", basePath, ' opacity="0"'),
     `<path id="${sid}-target" d="${path2}" fill="none" stroke="none" />`
   ].join("\n    ") : lineTag("line", path2);
-  const curveBand = (pts, x0, x1) => {
-    const ys = [];
-    const py = (i) => y(pts[i]?.y ?? 0);
-    for (let i = 0; i < pts.length; i++) {
-      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
-    }
-    for (let i = 0; i + 1 < pts.length; i++) {
-      const [ax, bx] = [x(i), x(i + 1)];
-      for (const edge of [x0, x1]) {
-        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
-          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
-        }
-      }
-    }
-    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
-  };
   const fixedBoxes = [
     // `.axname` is the one run here set at weight 500 rather than 400, and
     // under-charging a width is the unrecoverable direction (see `padR`).
     // No `text-anchor` on the y half, so it runs rightwards from x=0.
-    { x: 0, y: 42 - LABEL_SIZE3, w: nameW(p.yLabel), h: LABEL_SIZE3 },
-    {
-      x: PAD2.l + plotW / 2 - nameW(p.xLabel) / 2,
-      y: H - 16 - LABEL_SIZE3,
-      w: nameW(p.xLabel),
-      h: LABEL_SIZE3
-    },
+    runBox(0, 42, nameW(p.yLabel)),
+    runBox(PAD2.l + plotW / 2 - nameW(p.xLabel) / 2, H - 16, nameW(p.xLabel)),
     ...ticks.map((v) => {
       const w = runW(v.toFixed(scale.decimals));
-      return { x: PAD2.l - 22 - w, y: y(v) + 13 - LABEL_SIZE3, w, h: LABEL_SIZE3 };
+      return runBox(PAD2.l - 22 - w, y(v) + 13, w);
     }),
     ...p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => shownX.has(i)).map(({ pt, i }) => labelBox(x(i), H - PAD2.b + 56, pt.x))
   ];
   const lastI = p.points.length - 1;
+  const LINE = RUN_ABOVE + RUN_BELOW;
+  const SWATCH = 48;
+  const SWATCH_GAP = 16;
   const ghost = (() => {
     if (!cmp) return void 0;
     const w = ghostW(cmp.label);
@@ -7163,6 +7195,18 @@ var lineChart = (beat2, ctx) => {
         `line-chart ${beat2.id}: the compare label "${cmp.label}" is ${Math.ceil(w)}px against the ${Math.floor(plotW)}px of plot it is set in. Shorten it.`
       );
     }
+    const drawnDeltas = deltasFit ? deltaBoxes : [];
+    const gapTo = (series, b) => {
+      const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+      return Math.max(0, top - (b.y + b.h), b.y - bottom);
+    };
+    const clearOfText = (b) => !fixedBoxes.some((f) => overlaps(b, f)) && !valueBoxes.some((v) => overlaps(b, v)) && !drawnDeltas.some((d) => d !== null && overlaps(b, d));
+    const stacked = (b) => valueBoxes.some(
+      (v) => Math.min(b.x + b.w, v.x + v.w) - Math.max(b.x, v.x) > 0 && Math.max(v.y - (b.y + b.h), b.y - (v.y + v.h)) < LINE
+    );
+    const crossed = (b) => [p.points, cmp.points].some((series) => drawnThrough(series, b));
+    const owned = (b) => gapTo(p.points, b) - gapTo(cmp.points, b) >= LINE;
+    const honest = (b) => clearOfText(b) && !stacked(b) && !crossed(b) && owned(b);
     const atEnd = (i, start) => {
       const cy = y(cmp.points[i]?.y ?? 0);
       const away = Math.max(44, cy - 26);
@@ -7170,20 +7214,42 @@ var lineChart = (beat2, ctx) => {
       const sides = cy < y(p.points[i]?.y ?? 0) ? [away, toward] : [toward, away];
       return sides.map((by) => ({ i, start, by }));
     };
-    const drawnDeltas = deltasFit ? deltaBoxes : [];
-    return [...atEnd(lastI, false), ...atEnd(0, true)].find((c) => {
-      const box2 = { x: c.start ? x(c.i) : x(c.i) - w, y: c.by - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-      if (fixedBoxes.some((f) => overlaps(box2, f))) return false;
-      if (valueBoxes.some((v) => overlaps(box2, v))) return false;
-      if (drawnDeltas.some((d) => d !== null && overlaps(box2, d))) return false;
-      return ![p.points, cmp.points].some((series) => {
-        const [top, bottom] = curveBand(series, box2.x, box2.x + box2.w);
-        return Math.min(box2.y + box2.h, bottom) - Math.max(box2.y, top) > 8;
-      });
+    const end2 = [...atEnd(lastI, false), ...atEnd(0, true)].find(
+      (c) => honest(runBox(c.start ? x(c.i) : x(c.i) - w, c.by, w))
+    );
+    if (end2) {
+      return { kind: "label", anchor: end2.start ? "start" : "end", x: x(end2.i), by: end2.by };
+    }
+    const yAt = (series, at2) => curveBand(series, at2, at2)[0];
+    const sep4 = (at2) => yAt(p.points, at2) - yAt(cmp.points, at2);
+    const centres = p.points.flatMap(
+      (_, i) => i < lastI ? [x(i), (x(i) + x(i + 1)) / 2] : [x(i)]
+    );
+    const along = centres.map((cx) => {
+      const left = Math.min(Math.max(cx - w / 2, PAD2.l), width - padR - w);
+      const side = Math.sign(sep4(left + w / 2));
+      const cols = [
+        left,
+        left + w,
+        ...p.points.map((_, i) => x(i)).filter((v) => v > left && v < left + w)
+      ];
+      const narrowest = Math.min(...cols.map((c) => side * sep4(c)));
+      const [top, bottom] = curveBand(cmp.points, left, left + w);
+      const by = side > 0 ? top - 16 - RUN_BELOW : bottom + 16 + RUN_ABOVE;
+      return { left, by, narrowest, side };
+    }).filter((c) => c.side !== 0 && c.by >= 44 && c.by <= H - PAD2.b + 4).sort((a, b) => b.narrowest - a.narrowest).find((c) => honest(runBox(c.left, c.by, w)));
+    if (along) return { kind: "label", anchor: "middle", x: along.left + w / 2, by: along.by };
+    const kw = SWATCH + SWATCH_GAP + w;
+    const right = width - padR;
+    const key = [42, H - 16].find((by) => {
+      const b = runBox(right - kw, by, kw);
+      return clearOfText(b) && !stacked(b) && !crossed(b);
     });
+    return key === void 0 ? void 0 : { kind: "key", left: right - kw, right, by: key };
   })();
-  const ghostLabel = cmp && ghost ? `
-    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.start ? "start" : "end"}" x="${n2(x(ghost.i))}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : "";
+  const ghostLabel = !cmp || !ghost ? "" : ghost.kind === "label" ? `
+    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.anchor}" x="${n2(ghost.x)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : `
+    <g class="ghostkey" id="${sid}-ghostlab"><line x1="${n2(ghost.left)}" y1="${n2(ghost.by - 14)}" x2="${n2(ghost.left + SWATCH)}" y2="${n2(ghost.by - 14)}" stroke="${theme.dim}" stroke-width="5" stroke-linecap="round" /><text class="ghostlab" text-anchor="end" x="${n2(ghost.right)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text></g>`;
   const readout = p.readout ? `
   <div class="readout" id="${sid}-read">${esc(p.readout)}</div>` : "";
   const html = `${chrome(sid, p.eyebrow, p.headline, box, face)}
@@ -7245,7 +7311,12 @@ var lineChart = (beat2, ctx) => {
       // The copy lifts off — same geometry, so the half-second reads as one line
       // separating from itself rather than as a second line arriving.
       tween(`#${sid}-line`, { opacity: 0 }, { opacity: 1, duration: SEPARATE }, lift2),
-      tween(`#${sid}-base`, { opacity: 1 }, { opacity: GHOST_OPACITY, duration: SEPARATE }, lift2),
+      tween(
+        `#${sid}-base`,
+        { stroke: theme.accent },
+        { stroke: theme.dim, duration: SEPARATE },
+        lift2
+      ),
       reshape(`#${sid}-line`, `#${sid}-target`, lift2 + SEPARATE, RESHAPE_SECONDS, true)
     );
   }
@@ -11801,8 +11872,11 @@ function closeSafe(code) {
 }
 function sceneHtml(sid, start, clip3, label, scene, transit) {
   const setup = [...mathSetup(sid, scene.html), ...scene.setup ?? []].map(statement).join("\n            ");
+  const measure4 = (scene.measure ?? []).map(statement);
+  const laps = lapSetup(sid, setup + measure4.join(""));
   const build = (pad) => [
-    ...(scene.measure ?? []).map(statement),
+    ...measure4,
+    ...laps,
     `window.__timelines = window.__timelines || {};`,
     `// Each scene owns a paused timeline under its own composition id, with`,
     `// times relative to its start \u2014 one absolute root timeline yields a`,
@@ -11847,6 +11921,15 @@ function mathSetup(sid, html) {
             })`
   ];
 }
+function lapSetup(sid, script) {
+  if (!script.includes("katex.render")) return [];
+  const laps = [".rlap", ".llap", ".clap"].map((c) => `#${sid} .katex ${c} *`).join(", ");
+  return [
+    statement(`Array.prototype.forEach.call(document.querySelectorAll('${laps}'), function (el) {
+              el.setAttribute("data-layout-allow-overlap", "");
+            })`)
+  ];
+}
 function statement(s) {
   const line2 = s.trim();
   return line2.endsWith(";") ? line2 : `${line2};`;
@@ -18762,12 +18845,13 @@ function scanPaperArc(storyboard, prefs) {
   }));
 }
 function scanNarrationDrift(storyboard, narration) {
-  const flat = (s) => (s ?? "").replace(/\s+/g, " ").trim();
+  const sentences = (s) => splitSentences((s ?? "").replace(/\s+/g, " ").trim()).join("\n");
   const stale = [];
   for (const beat2 of storyboard.beats) {
     const segments2 = narration.beats[beat2.id];
-    if (!segments2?.length || !flat(beat2.narration)) continue;
-    if (flat(segments2.map((s) => s.text).join(" ")) !== flat(beat2.narration)) stale.push(beat2.id);
+    const said = sentences(beat2.narration);
+    if (!segments2?.length || !said) continue;
+    if (sentences(segments2.map((s) => s.text).join(" ")) !== said) stale.push(beat2.id);
   }
   if (!stale.length) return [];
   return [

package/dist/mcp.js

@@ -1655,7 +1655,11 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
   await mkdir2(dir, { recursive: true });
   const cssPath = join3(dir, "fonts.css");
   const cached2 = await readFile2(cssPath, "utf8").catch(() => "");
-  if (cached2.startsWith(stamp)) return { family, css: cached2, files: localNames(cached2) };
+  if (cached2.startsWith(stamp)) {
+    const css2 = withInterMetrics(cached2);
+    if (css2 !== cached2) await writeFile2(cssPath, css2);
+    return { family, css: css2, files: localNames(css2) };
+  }
   const res = await fetch(
     `https://fonts.googleapis.com/css2?${families.map((f) => `family=${f.replaceAll(" ", "+")}:wght@400;500;700`).join("&")}&text=${encodeURIComponent(text2)}&display=block`,
     { headers: { "User-Agent": UA } }
@@ -1673,11 +1677,19 @@ ${text2}`).digest("hex").slice(0, 16)} */`;
     css = css.replaceAll(url, name);
     files.push(name);
   }
-  css = `${stamp}
-${css}`;
+  css = withInterMetrics(`${stamp}
+${css}`);
   await writeFile2(cssPath, css);
   return { family, css, files };
 }
+var INTER_METRICS = "ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+function withInterMetrics(css) {
+  return css.replace(
+    /@font-face\s*\{(?![^}]*ascent-override)/g,
+    `@font-face {
+  ${INTER_METRICS};`
+  );
+}
 function localNames(css) {
   return [...css.matchAll(/url\(([^)]+)\)/g)].map((m) => m[1] ?? "");
 }
@@ -2165,7 +2177,8 @@ var FONTSOURCE = {
 async function vendorFace(face, dir) {
   return vendorFontsource(FONTSOURCE[face], familyOf(face), dir);
 }
-var PACK_DISPLAY = "font-display: block;\n  ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+var PACK_DISPLAY = `font-display: block;
+  ${INTER_METRICS}`;
 async function vendorFontsource(pkgName, family, dir) {
   const pkg = dirname2(createRequire3(import.meta.url).resolve(pkgName));
   const css = await readFile3(join4(pkg, "index.css"), "utf8");
@@ -6036,7 +6049,6 @@ var READOUT_W = 460;
 var READOUT_LH = 1.35;
 var TALL_ASPECT = 1.15;
 var RESHAPE_SECONDS = 1.2;
-var GHOST_OPACITY = 0.28;
 var DRAW_SECONDS = 1.8;
 var DRAW_FLOOR = 1;
 var SEPARATE = 0.5;
@@ -6113,6 +6125,14 @@ var lineChart = (beat, ctx) => {
     return new Set(kept);
   };
   const LABEL_SIZE3 = 40;
+  const RUN_ABOVE = Math.ceil(LABEL_SIZE3 * 0.969);
+  const RUN_BELOW = Math.ceil(LABEL_SIZE3 * 0.242);
+  const runBox = (left, by, w) => ({
+    x: left,
+    y: by - RUN_ABOVE,
+    w,
+    h: RUN_ABOVE + RUN_BELOW
+  });
   const runW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const catW = (s) => textWidth(s, LABEL_SIZE3, 400, 0, false, face);
   const nameW = (s) => textWidth(s, LABEL_SIZE3, 500, 0, false, face);
@@ -6127,17 +6147,47 @@ var lineChart = (beat, ctx) => {
   const dots = p.points.map(
     (pt, i) => `<circle class="dot" cx="${n2(x(i))}" cy="${n2(y(pt.y))}" r="${i === p.points.length - 1 ? 11 : 9}" fill="${i === p.points.length - 1 ? theme.tones.b : theme.accent}" />`
   ).join("");
+  const labelBox = (cx, cy, text2, anchorStart = false) => {
+    const w = runW(text2);
+    return runBox(anchorStart ? cx : cx - w / 2, cy, w);
+  };
+  const curveBand = (pts, x0, x1) => {
+    const ys = [];
+    const py = (i) => y(pts[i]?.y ?? 0);
+    for (let i = 0; i < pts.length; i++) {
+      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
+    }
+    for (let i = 0; i + 1 < pts.length; i++) {
+      const [ax, bx] = [x(i), x(i + 1)];
+      for (const edge of [x0, x1]) {
+        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
+          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
+        }
+      }
+    }
+    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
+  };
+  const drawnThrough = (series, b) => {
+    const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+    return Math.min(b.y + b.h, bottom) - Math.max(b.y, top) > 8;
+  };
+  const valueBy = (i) => {
+    const v = p.points[i]?.y ?? 0;
+    const over = Math.max(44, y(v) - 26);
+    if (!cmp) return over;
+    const box2 = (by) => labelBox(x(i), by, String(v), i === 0);
+    if (!drawnThrough(cmp.points, box2(over))) return over;
+    const under = y(v) + 16 + RUN_ABOVE;
+    if (under > H - PAD2.b + 4) return over;
+    return drawnThrough(cmp.points, box2(under)) || drawnThrough(p.points, box2(under)) ? over : under;
+  };
   const shownValues = fitIndices((i) => runW(String(p.points[i]?.y ?? "")), true);
   const showsValue = (i) => shownValues.has(i);
   const values = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => {
     const anchor = i === 0 ? ' text-anchor="start"' : "";
-    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(Math.max(44, y(pt.y) - 26))}">${esc(String(pt.y))}</text>`;
+    return `<text class="pv"${anchor} x="${n2(x(i))}" y="${n2(valueBy(i))}">${esc(String(pt.y))}</text>`;
   }).join("");
-  const labelBox = (cx, cy, text2, anchorStart = false) => {
-    const w = runW(text2);
-    return { x: anchorStart ? cx : cx - w / 2, y: cy - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-  };
-  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), Math.max(44, y(pt.y) - 26), String(pt.y), i === 0));
+  const valueBoxes = p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => showsValue(i)).map(({ pt, i }) => labelBox(x(i), valueBy(i), String(pt.y), i === 0));
   const overlaps = (a, b) => Math.min(a.x + a.w, b.x + b.w) - Math.max(a.x, b.x) > 8 && Math.min(a.y + a.h, b.y + b.h) - Math.max(a.y, b.y) > 8;
   const deltaBoxes = (p.deltas ?? []).slice(0, p.points.length - 1).map((d, i) => {
     const a = p.points[i];
@@ -6165,40 +6215,22 @@ var lineChart = (beat, ctx) => {
     lineTag("line", basePath, ' opacity="0"'),
     `<path id="${sid}-target" d="${path2}" fill="none" stroke="none" />`
   ].join("\n    ") : lineTag("line", path2);
-  const curveBand = (pts, x0, x1) => {
-    const ys = [];
-    const py = (i) => y(pts[i]?.y ?? 0);
-    for (let i = 0; i < pts.length; i++) {
-      if (x(i) >= x0 && x(i) <= x1) ys.push(py(i));
-    }
-    for (let i = 0; i + 1 < pts.length; i++) {
-      const [ax, bx] = [x(i), x(i + 1)];
-      for (const edge of [x0, x1]) {
-        if (edge > Math.min(ax, bx) && edge < Math.max(ax, bx)) {
-          ys.push(py(i) + (py(i + 1) - py(i)) * (edge - ax) / (bx - ax));
-        }
-      }
-    }
-    return ys.length > 0 ? [Math.min(...ys), Math.max(...ys)] : [Number.POSITIVE_INFINITY, Number.NEGATIVE_INFINITY];
-  };
   const fixedBoxes = [
     // `.axname` is the one run here set at weight 500 rather than 400, and
     // under-charging a width is the unrecoverable direction (see `padR`).
     // No `text-anchor` on the y half, so it runs rightwards from x=0.
-    { x: 0, y: 42 - LABEL_SIZE3, w: nameW(p.yLabel), h: LABEL_SIZE3 },
-    {
-      x: PAD2.l + plotW / 2 - nameW(p.xLabel) / 2,
-      y: H - 16 - LABEL_SIZE3,
-      w: nameW(p.xLabel),
-      h: LABEL_SIZE3
-    },
+    runBox(0, 42, nameW(p.yLabel)),
+    runBox(PAD2.l + plotW / 2 - nameW(p.xLabel) / 2, H - 16, nameW(p.xLabel)),
     ...ticks.map((v) => {
       const w = runW(v.toFixed(scale.decimals));
-      return { x: PAD2.l - 22 - w, y: y(v) + 13 - LABEL_SIZE3, w, h: LABEL_SIZE3 };
+      return runBox(PAD2.l - 22 - w, y(v) + 13, w);
     }),
     ...p.points.map((pt, i) => ({ pt, i })).filter(({ i }) => shownX.has(i)).map(({ pt, i }) => labelBox(x(i), H - PAD2.b + 56, pt.x))
   ];
   const lastI = p.points.length - 1;
+  const LINE = RUN_ABOVE + RUN_BELOW;
+  const SWATCH = 48;
+  const SWATCH_GAP = 16;
   const ghost = (() => {
     if (!cmp) return void 0;
     const w = ghostW(cmp.label);
@@ -6207,6 +6239,18 @@ var lineChart = (beat, ctx) => {
         `line-chart ${beat.id}: the compare label "${cmp.label}" is ${Math.ceil(w)}px against the ${Math.floor(plotW)}px of plot it is set in. Shorten it.`
       );
     }
+    const drawnDeltas = deltasFit ? deltaBoxes : [];
+    const gapTo = (series, b) => {
+      const [top, bottom] = curveBand(series, b.x, b.x + b.w);
+      return Math.max(0, top - (b.y + b.h), b.y - bottom);
+    };
+    const clearOfText = (b) => !fixedBoxes.some((f) => overlaps(b, f)) && !valueBoxes.some((v) => overlaps(b, v)) && !drawnDeltas.some((d) => d !== null && overlaps(b, d));
+    const stacked = (b) => valueBoxes.some(
+      (v) => Math.min(b.x + b.w, v.x + v.w) - Math.max(b.x, v.x) > 0 && Math.max(v.y - (b.y + b.h), b.y - (v.y + v.h)) < LINE
+    );
+    const crossed = (b) => [p.points, cmp.points].some((series) => drawnThrough(series, b));
+    const owned = (b) => gapTo(p.points, b) - gapTo(cmp.points, b) >= LINE;
+    const honest = (b) => clearOfText(b) && !stacked(b) && !crossed(b) && owned(b);
     const atEnd = (i, start) => {
       const cy = y(cmp.points[i]?.y ?? 0);
       const away = Math.max(44, cy - 26);
@@ -6214,20 +6258,42 @@ var lineChart = (beat, ctx) => {
       const sides = cy < y(p.points[i]?.y ?? 0) ? [away, toward] : [toward, away];
       return sides.map((by) => ({ i, start, by }));
     };
-    const drawnDeltas = deltasFit ? deltaBoxes : [];
-    return [...atEnd(lastI, false), ...atEnd(0, true)].find((c) => {
-      const box2 = { x: c.start ? x(c.i) : x(c.i) - w, y: c.by - LABEL_SIZE3, w, h: LABEL_SIZE3 };
-      if (fixedBoxes.some((f) => overlaps(box2, f))) return false;
-      if (valueBoxes.some((v) => overlaps(box2, v))) return false;
-      if (drawnDeltas.some((d) => d !== null && overlaps(box2, d))) return false;
-      return ![p.points, cmp.points].some((series) => {
-        const [top, bottom] = curveBand(series, box2.x, box2.x + box2.w);
-        return Math.min(box2.y + box2.h, bottom) - Math.max(box2.y, top) > 8;
-      });
+    const end2 = [...atEnd(lastI, false), ...atEnd(0, true)].find(
+      (c) => honest(runBox(c.start ? x(c.i) : x(c.i) - w, c.by, w))
+    );
+    if (end2) {
+      return { kind: "label", anchor: end2.start ? "start" : "end", x: x(end2.i), by: end2.by };
+    }
+    const yAt = (series, at2) => curveBand(series, at2, at2)[0];
+    const sep5 = (at2) => yAt(p.points, at2) - yAt(cmp.points, at2);
+    const centres = p.points.flatMap(
+      (_, i) => i < lastI ? [x(i), (x(i) + x(i + 1)) / 2] : [x(i)]
+    );
+    const along = centres.map((cx) => {
+      const left = Math.min(Math.max(cx - w / 2, PAD2.l), width - padR - w);
+      const side = Math.sign(sep5(left + w / 2));
+      const cols = [
+        left,
+        left + w,
+        ...p.points.map((_, i) => x(i)).filter((v) => v > left && v < left + w)
+      ];
+      const narrowest = Math.min(...cols.map((c) => side * sep5(c)));
+      const [top, bottom] = curveBand(cmp.points, left, left + w);
+      const by = side > 0 ? top - 16 - RUN_BELOW : bottom + 16 + RUN_ABOVE;
+      return { left, by, narrowest, side };
+    }).filter((c) => c.side !== 0 && c.by >= 44 && c.by <= H - PAD2.b + 4).sort((a, b) => b.narrowest - a.narrowest).find((c) => honest(runBox(c.left, c.by, w)));
+    if (along) return { kind: "label", anchor: "middle", x: along.left + w / 2, by: along.by };
+    const kw = SWATCH + SWATCH_GAP + w;
+    const right = width - padR;
+    const key = [42, H - 16].find((by) => {
+      const b = runBox(right - kw, by, kw);
+      return clearOfText(b) && !stacked(b) && !crossed(b);
     });
+    return key === void 0 ? void 0 : { kind: "key", left: right - kw, right, by: key };
   })();
-  const ghostLabel = cmp && ghost ? `
-    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.start ? "start" : "end"}" x="${n2(x(ghost.i))}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : "";
+  const ghostLabel = !cmp || !ghost ? "" : ghost.kind === "label" ? `
+    <text class="ghostlab" id="${sid}-ghostlab" text-anchor="${ghost.anchor}" x="${n2(ghost.x)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text>` : `
+    <g class="ghostkey" id="${sid}-ghostlab"><line x1="${n2(ghost.left)}" y1="${n2(ghost.by - 14)}" x2="${n2(ghost.left + SWATCH)}" y2="${n2(ghost.by - 14)}" stroke="${theme.dim}" stroke-width="5" stroke-linecap="round" /><text class="ghostlab" text-anchor="end" x="${n2(ghost.right)}" y="${n2(ghost.by)}">${esc(cmp.label)}</text></g>`;
   const readout = p.readout ? `
   <div class="readout" id="${sid}-read">${esc(p.readout)}</div>` : "";
   const html = `${chrome(sid, p.eyebrow, p.headline, box, face)}
@@ -6289,7 +6355,12 @@ var lineChart = (beat, ctx) => {
       // The copy lifts off — same geometry, so the half-second reads as one line
       // separating from itself rather than as a second line arriving.
       tween(`#${sid}-line`, { opacity: 0 }, { opacity: 1, duration: SEPARATE }, lift2),
-      tween(`#${sid}-base`, { opacity: 1 }, { opacity: GHOST_OPACITY, duration: SEPARATE }, lift2),
+      tween(
+        `#${sid}-base`,
+        { stroke: theme.accent },
+        { stroke: theme.dim, duration: SEPARATE },
+        lift2
+      ),
       reshape(`#${sid}-line`, `#${sid}-target`, lift2 + SEPARATE, RESHAPE_SECONDS, true)
     );
   }
@@ -10767,8 +10838,11 @@ function closeSafe(code) {
 }
 function sceneHtml(sid, start, clip3, label, scene, transit) {
   const setup = [...mathSetup(sid, scene.html), ...scene.setup ?? []].map(statement).join("\n            ");
+  const measure4 = (scene.measure ?? []).map(statement);
+  const laps = lapSetup(sid, setup + measure4.join(""));
   const build = (pad) => [
-    ...(scene.measure ?? []).map(statement),
+    ...measure4,
+    ...laps,
     `window.__timelines = window.__timelines || {};`,
     `// Each scene owns a paused timeline under its own composition id, with`,
     `// times relative to its start \u2014 one absolute root timeline yields a`,
@@ -10813,6 +10887,15 @@ function mathSetup(sid, html) {
             })`
   ];
 }
+function lapSetup(sid, script) {
+  if (!script.includes("katex.render")) return [];
+  const laps = [".rlap", ".llap", ".clap"].map((c) => `#${sid} .katex ${c} *`).join(", ");
+  return [
+    statement(`Array.prototype.forEach.call(document.querySelectorAll('${laps}'), function (el) {
+              el.setAttribute("data-layout-allow-overlap", "");
+            })`)
+  ];
+}
 function statement(s) {
   const line2 = s.trim();
   return line2.endsWith(";") ? line2 : `${line2};`;

package/dist/types/source/fonts.d.ts

@@ -23,3 +23,25 @@ export declare function familyFor(lang: string): string | null;
 export declare function bundleFont(lang: string, glyphs: string, dir: string, opts?: {
     serif?: boolean;
 }): Promise<FontBundle | null>;
+/**
+ * Inter's vertical metrics as `@font-face` descriptors: ascent 0.969em,
+ * descent 0.241em, no line gap.
+ *
+ * Every vertical number in the emitters (line boxes, the SVG label `dy`, the
+ * centring of a tspan block) and every box the gates measure was tuned on Inter.
+ * `src/build/files.ts` declares a v2 pack's Latin faces with these for that
+ * reason, and the CJK bundle needs them for the same one. Noto Sans SC as Google
+ * serves it is 1.160 / 0.288 (hhea, read from the woff2), so its line box is
+ * 1.448em where the emitters budget 1.21. MEASURED in Chrome on a zh-Hans deck
+ * (HypePaper, v0.9.2, 2026-10-11): a 56px split-compare heading spanned 65px
+ * above its baseline and overran the top of its svg by 11px. Every verify
+ * reports that as `container_overflow` on `#sN-sideI`; HypePaper's build also
+ * reported it as `text_box_overflow` on `#sN-labI`, failed on it, and a later
+ * verify of the same deck did not. The ink was never cut, because a Han glyph's
+ * ink sits inside 0.88em. Only the box was wrong.
+ *
+ * Advances are untouched, so the width tables in `src/emit/svg.ts` still apply.
+ */
+export declare const INTER_METRICS = "ascent-override: 96.875%;\n  descent-override: 24.1211%;\n  line-gap-override: 0%";
+/** Declare every `@font-face` in `css` with `INTER_METRICS`. Idempotent. */
+export declare function withInterMetrics(css: string): string;

package/dist/types/verify/index.d.ts

@@ -340,10 +340,16 @@ export declare function scanPaperArc(storyboard: Storyboard, prefs: Prefs): Find
  * NARROW ON PURPOSE. It compares only beats that have BOTH a narration text and
  * segments, so a deck narrated at a lower density — where some beats are
  * deliberately silent — says nothing, and the existing missing-audio error keeps
- * its own case. Whitespace is normalised because the splitter re-joins sentences
- * at stop boundaries; on the demo's thirteen beats the concatenation reproduces
- * the authored text exactly, which is what makes the comparison safe to make
- * fatal.
+ * its own case.
+ *
+ * COMPARED SENTENCE BY SENTENCE, through the same `splitSentences` that cut the
+ * segments. The splitter trims each sentence, so whitespace at a sentence
+ * boundary is gone from the record and the segments' rejoin cannot know what it
+ * was. Rejoining with a space and comparing strings was right for English and
+ * wrong for every Chinese and Japanese deck: they write no space after 。, so
+ * every beat narrated over two or more stops "drifted" — 15 of 18 beats on a
+ * freshly narrated zh-Hans HypePaper run, exactly the multi-segment ones.
+ * Whitespace inside a sentence is still normalised, not dropped.
  */
 export declare function scanNarrationDrift(storyboard: Storyboard, narration: {
     beats: Record<string, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jokerized/decksmith",
-  "version": "0.9.2",
+  "version": "0.9.3",
   "description": "Turn a source document into an animated explanation deck.",
   "type": "module",
   "license": "MIT",