fix #36: 两个 narration demo 在窄屏下裁切——补 viewport meta + 1920 舞台自适应缩放

demos/md-html-narration/md-html-demo.html 和 demos/voiceover-demo/什么是token.html
是固定 1920×1080 的 NarrationStage 舞台，既没有 viewport meta，也没有
c1/hero-animation 那套 rescale()，窗口窄于 1920 时画面被裁掉大半——375 宽下
几乎全是背景色，正是 issue 里说的「需要调整缩放才能正确展示」。

改动只加不减，共 30 行：
- 补 <meta name="viewport" content="width=device-width, initial-scale=1">
  （缺它时移动版 Chrome 按 980px 虚拟视口渲染再整体缩放，是「要手动调缩放」的直接来源）
- 沿用仓库已有的 rescale() 写法，按视口宽度给 #root 设 zoom，上限为 1

上限 1 是关键：≥1920 一律不缩放，所以 scripts/render-video-seek.js 走的
1920×1080 录制路径完全不受影响（实测 zoom=1、stageRect 与修改前逐字节一致）。
md-html-demo 因 body 有 20px padding，窄屏时额外减 40，并显式在 ≥1920 处
返回 1，避免桌面版被缩掉 2%。

验证：21 个 demo × 375/768/1280/1920 共 84 次检查，横向溢出从 6 处降为 0；
两个页面 1920 截图与修改前逐像素一致（diff 0.000%），其余 demo 未受影响。

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

demos/md-html-narration/md-html-demo.html

@@ -2,6 +2,7 @@
 <html lang="zh-CN">
 <head>
 <meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>md还是html，这是个蠢问题 · 解说 demo (v3 · 字幕+持续运动+修溢出)</title>
 <script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
 <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
@@ -611,5 +612,20 @@ const App = () => (
 
 ReactDOM.createRoot(document.getElementById('root')).render(<App />);
 </script>
+
+<script>
+  // ── Fit 1920 stage to viewport ─────────────────────────────────
+  // ≥1920（含录制用的 1920×1080）保持 1:1 原尺寸不缩放；
+  // 窄于 1920 才缩小，减 40 是 body 左右各 20px 的 padding
+  (function () {
+    var root = document.getElementById('root');
+    function rescale() {
+      var cw = document.documentElement.clientWidth;
+      root.style.zoom = cw >= 1920 ? 1 : (cw - 40) / 1920;
+    }
+    rescale();
+    window.addEventListener('resize', rescale);
+  })();
+</script>
 </body>
 </html>

demos/voiceover-demo/什么是token.html

@@ -2,6 +2,7 @@
 <html lang="zh-CN">
 <head>
 <meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>什么是 token · narration demo</title>
 <script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
 <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
@@ -197,5 +198,18 @@ const App = () => (
 
 ReactDOM.createRoot(document.getElementById('root')).render(<App />);
 </script>
+
+<script>
+  // ── Fit 1920 stage to viewport ─────────────────────────────────
+  // 只在窗口窄于 1920 时缩小，≥1920（含录制用的 1920×1080）保持 1:1 原尺寸
+  (function () {
+    var root = document.getElementById('root');
+    function rescale() {
+      root.style.zoom = Math.min(1, document.documentElement.clientWidth / 1920);
+    }
+    rescale();
+    window.addEventListener('resize', rescale);
+  })();
+</script>
 </body>
 </html>