dsh-ppt 0.4.4 → 0.5.0

package/skills/dsh-ppt/scripts/deck-core.mjs

@@ -15,7 +15,7 @@
  */
 
 import { existsSync, mkdirSync, readdirSync, readFileSync, renameSync, rmSync, writeFileSync } from 'node:fs'
-import { resolve as resolvePath } from 'node:path'
+import { resolve as resolvePath, join as joinPath } from 'node:path'
 import { deflateRawSync } from 'node:zlib'
 
 /**
@@ -152,13 +152,28 @@ export const LANGUAGES = {
       pointKicker: '要点',
       statementKicker: '核心观点',
       quoteKicker: '金句',
-      tableKicker: '数据',
-      continuation: '（续）',
+      tableKicker: '数据',
+      continuation: '（续）',
       notesLabel: '演讲者备注',
       notesToggle: '备注',
       closingTitle: '谢谢',
       closingSubtitle: '讨论与问答',
-      generatedBy: '由 dsh-ppt 生成',
+      generatedBy: '由 dsh-ppt 生成',
+      overviewToggle: '总览',
+      presenterToggle: '演讲者',
+      presenterLabel: '演讲者视图 · Presenter view',
+      helpTitle: '快捷键 · Shortcuts',
+      noNotes: '（本页无备注）',
+      closeLabel: '关闭',
+      currentLabel: '当前页 · Current',
+      nextLabel: '下一页 · Next',
+      timerLabel: '计时 · Timer',
+      presenterHint: '备注：未开演讲者窗口时按 S 显示在顶部；打开后只在演讲者窗口显示，观众看不到',
+      wrapHint: '已环绕到',
+      popupBlocked: '浏览器拦截了演讲者窗口，请允许弹出窗口后按 V 重试',
+      fullscreenUnavailable: '当前窗口无法进入全屏，请在浏览器中独立打开演示文件后重试。',
+      notesCloseLabel: '关闭备注',
+      overviewHint: '点击缩略图跳页，方向键切换，Enter 进入，Esc 退出'
     },
   },
   en: {
@@ -173,13 +188,28 @@ export const LANGUAGES = {
       pointKicker: 'Key point',
       statementKicker: 'Core idea',
       quoteKicker: 'Quote',
-      tableKicker: 'Data',
-      continuation: ' (continued)',
+      tableKicker: 'Data',
+      continuation: ' (continued)',
       notesLabel: 'Speaker notes',
       notesToggle: 'Notes',
       closingTitle: 'Thank You',
       closingSubtitle: 'Discussion & Q&A',
-      generatedBy: 'Generated with dsh-ppt',
+      generatedBy: 'Generated with dsh-ppt',
+      overviewToggle: 'Overview',
+      presenterToggle: 'Presenter',
+      presenterLabel: 'Presenter view',
+      helpTitle: 'Keyboard shortcuts',
+      noNotes: '(No notes on this slide)',
+      closeLabel: 'Close',
+      currentLabel: 'Current',
+      nextLabel: 'Next',
+      timerLabel: 'Timer',
+      presenterHint: 'Notes: S shows them on top until a presenter window is open; afterwards only in the presenter window.',
+      wrapHint: 'Wrapped to',
+      popupBlocked: 'The presenter window was blocked. Allow pop-ups and press V to retry.',
+      fullscreenUnavailable: 'Fullscreen is unavailable here. Open the presentation in a browser tab and try again.',
+      notesCloseLabel: 'Close notes',
+      overviewHint: 'Click a thumbnail to jump; arrows move, Enter opens, Esc exits'
     },
   },
   bilingual: {
@@ -194,17 +224,141 @@ export const LANGUAGES = {
       pointKicker: '要点 · Key point',
       statementKicker: '核心观点 · Core Idea',
       quoteKicker: '金句 · Quote',
-      tableKicker: '数据 · Data',
-      continuation: '（续 · continued）',
+      tableKicker: '数据 · Data',
+      continuation: '（续 · continued）',
       notesLabel: '演讲者备注 · Speaker notes',
       notesToggle: '备注 · Notes',
       closingTitle: '谢谢 · Thank You',
       closingSubtitle: '讨论与问答 · Q&A',
-      generatedBy: '由 dsh-ppt 生成 · Generated with dsh-ppt',
-    },
-  },
-}
-
+      generatedBy: '由 dsh-ppt 生成 · Generated with dsh-ppt',
+      overviewToggle: '总览 · Overview',
+      presenterToggle: '演讲者 · Presenter',
+      presenterLabel: '演讲者视图 · Presenter view',
+      helpTitle: '快捷键 · Shortcuts',
+      noNotes: '（本页无备注 · No notes on this slide）',
+      closeLabel: '关闭 · Close',
+      currentLabel: '当前页 · Current',
+      nextLabel: '下一页 · Next',
+      timerLabel: '计时 · Timer',
+      presenterHint: '备注：未开演讲者窗口时按 S 显示在顶部；打开后只在演讲者窗口显示 · Notes: S shows on top until a presenter window is open',
+      wrapHint: '已环绕到 · Wrapped to',
+      popupBlocked: '浏览器拦截了演讲者窗口 · Presenter window blocked; allow pop-ups and press V',
+      fullscreenUnavailable: '当前窗口无法全屏，请独立打开演示文件 · Open this presentation in a browser tab for fullscreen.',
+      notesCloseLabel: '关闭备注 · Close notes',
+      overviewHint: '点击缩略图跳页 · Click to jump, arrows move, Enter opens, Esc exits'
+    },
+  },
+}
+
+ // ---------------------------------------------------------------------------
+// 主题预览（ppt_themes preview=true / buildThemePreview）
+// ---------------------------------------------------------------------------
+
+function themePages(lang) {
+  return lang === 'en'
+    ? { title: 'dsh-ppt theme gallery', hint: 'Pick a theme id for ppt_create', usage: 'theme', dark: 'dark', light: 'light', palette: 'Palette' }
+    : { title: 'dsh-ppt 主题预览', hint: '把 id 填给 ppt_create 的 theme 参数', usage: 'theme', dark: '深色', light: '浅色', palette: '色板' }
+}
+
+/** 单套主题的 960x540 SVG 色板卡：可直接放进 README / npm 首屏。 */
+export function renderThemeSvg(input, lang = 'zh') {
+  const theme = typeof input === 'string' ? resolveTheme(input) : input
+  const pick = (pair) => (lang === 'en' ? pair.en : pair.zh)
+  const p = theme.palette
+  const L = themePages(lang === 'en' ? 'en' : 'zh')
+  const font = theme.fonts.heading.replace(/"/g, "'")
+  const bodyFont = theme.fonts.body.replace(/"/g, "'")
+  const out = []
+  out.push('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 960 540" width="960" height="540" role="img" aria-label="' + escapeXml(theme.id + ' ' + pick(theme.name)) + '">')
+  out.push('<rect width="960" height="540" fill="' + p.bg + '"/>')
+  out.push('<rect x="0" y="0" width="960" height="6" fill="' + p.accent + '"/><rect x="0" y="534" width="960" height="6" fill="' + p.accent2 + '"/>')
+  out.push('<rect x="36" y="40" width="560" height="360" rx="16" fill="' + p.panel + '" stroke="' + hexToRgba(p.muted, 0.45) + '"/>')
+  out.push('<text x="64" y="92" fill="' + p.accent + '" font-family="' + escapeXml(bodyFont) + '" font-size="14" font-weight="700" letter-spacing="3">' + escapeXml(pick(theme.mood).toUpperCase()) + '</text>')
+  out.push('<text x="64" y="158" fill="' + p.fg + '" font-family="' + escapeXml(font) + '" font-size="42" font-weight="800">' + escapeXml('Aa ' + pick(theme.name)) + '</text>')
+  out.push('<circle cx="72" cy="206" r="5" fill="' + p.accent + '"/><rect x="92" y="199" width="360" height="12" rx="6" fill="' + hexToRgba(p.fg, 0.75) + '"/>')
+  out.push('<circle cx="72" cy="240" r="5" fill="' + p.accent + '"/><rect x="92" y="233" width="300" height="12" rx="6" fill="' + hexToRgba(p.fg, 0.55) + '"/>')
+  out.push('<circle cx="72" cy="274" r="5" fill="' + p.accent + '"/><rect x="92" y="267" width="330" height="12" rx="6" fill="' + hexToRgba(p.fg, 0.55) + '"/>')
+  out.push('<rect x="64" y="312" width="500" height="34" rx="6" fill="' + p.accent + '"/>')
+  out.push('<text x="78" y="334" fill="' + p.bg + '" font-family="' + escapeXml(bodyFont) + '" font-size="14" font-weight="700">dsh-ppt</text>')
+  out.push('<text x="470" y="334" fill="' + p.bg + '" font-family="' + escapeXml(bodyFont) + '" font-size="14" font-weight="700" text-anchor="end">1,234</text>')
+  out.push('<rect x="64" y="346" width="500" height="2" fill="' + hexToRgba(p.muted, 0.5) + '"/>')
+  out.push('<text x="64" y="378" fill="' + p.muted + '" font-family="' + escapeXml(bodyFont) + '" font-size="13">' + escapeXml(theme.id + ' · ' + (theme.dark ? L.dark : L.light) + ' · v' + DECK_VERSION) + '</text>')
+  const swatches = ['bg', 'panel', 'fg', 'muted', 'accent', 'accent2']
+  const labels = ['bg', 'panel', 'fg', 'muted', 'accent', 'accent2']
+  out.push('<text x="632" y="76" fill="' + p.muted + '" font-family="' + escapeXml(bodyFont) + '" font-size="13" font-weight="700" letter-spacing="2">' + escapeXml(L.palette.toUpperCase()) + '</text>')
+  swatches.forEach((key, i) => {
+    const y = 96 + i * 62
+    out.push('<rect x="632" y="' + y + '" width="44" height="44" rx="10" fill="' + p[key] + '" stroke="' + hexToRgba(p.muted, 0.45) + '"/>')
+    out.push('<text x="692" y="' + (y + 20) + '" fill="' + p.fg + '" font-family="' + escapeXml(bodyFont) + '" font-size="14" font-weight="600">' + escapeXml(labels[i]) + '</text>')
+    out.push('<text x="692" y="' + (y + 38) + '" fill="' + p.muted + '" font-family="' + escapeXml(bodyFont) + '" font-size="13">' + escapeXml(String(p[key]).toUpperCase()) + '</text>')
+  })
+  out.push('<text x="632" y="508" fill="' + p.muted + '" font-family="' + escapeXml(bodyFont) + '" font-size="12">' + escapeXml(pick(theme.bestFor)).slice(0, 44) + '</text>')
+  out.push('</svg>')
+  return out.join('')
+}
+
+/** 自包含主题对比页：5 套主题并排，含色板与用法。 */
+export function renderThemePreviewHtml(lang = 'zh') {
+  const L = themePages(lang === 'en' ? 'en' : 'zh')
+  const cards = THEME_IDS.map((id) => {
+    const theme = THEMES[id]
+    const pick = (pair) => (lang === 'en' ? pair.en : pair.zh)
+    const chips = Object.keys(theme.palette).map((key) =>
+      '<span class="chip"><i style="background:' + theme.palette[key] + '"></i>' + escapeHtml(String(theme.palette[key]).toUpperCase()) + '</span>').join('')
+    return '<figure class="card" id="theme-' + escapeHtml(id) + '">' +
+      renderThemeSvg(theme, lang === 'en' ? 'en' : 'zh') +
+      '<figcaption><div class="row"><strong>' + escapeHtml(id) + '</strong><span class="badge">' + escapeHtml(pick(theme.name)) + '</span></div>' +
+      '<p class="muted">' + escapeHtml(pick(theme.mood)) + ' · ' + escapeHtml(pick(theme.bestFor)) + '</p>' +
+      '<p class="chips">' + chips + '</p>' +
+      '<p class="usage">' + escapeHtml(L.usage) + ': <code>' + escapeHtml(id) + '</code></p></figcaption></figure>'
+  }).join('')
+  return '<!DOCTYPE html>' + eolSafe('<html lang="zh-CN">') +
+    '<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">' +
+    '<title>' + escapeHtml(L.title) + '</title><style>' +
+    'body{margin:0;background:#0b0f17;color:#e8f1ff;font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;padding:28px}' +
+    'h1{font-size:26px;margin:0 0 6px}p.sub{color:#8b98ad;margin:0 0 24px;font-size:14px}' +
+    '.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:22px}' +
+    '.card{margin:0;background:#111827;border:1px solid #263043;border-radius:16px;overflow:hidden}' +
+    '.card svg{display:block;width:100%;height:auto}' +
+    'figcaption{padding:14px 16px 16px}.row{display:flex;align-items:center;gap:10px;font-size:16px}' +
+    '.badge{color:#8b98ad;font-size:13px}.muted{color:#8b98ad;font-size:13px;margin:6px 0 10px;line-height:1.5}' +
+    '.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#aab6c9;background:#0b0f17;border:1px solid #263043;border-radius:99px;padding:3px 9px}' +
+    '.chip i{width:10px;height:10px;border-radius:3px;display:inline-block}' +
+    '.usage{margin:0;font-size:13px;color:#aab6c9}code{background:#0b0f17;border:1px solid #263043;border-radius:6px;padding:1px 6px}' +
+    '@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}' +
+    '</style></head><body><h1>' + escapeHtml(L.title) + '</h1><p class="sub">' + escapeHtml(L.hint) + ' · dsh-ppt v' + escapeHtml(DECK_VERSION) + '</p>' +
+    '<div class="grid">' + cards + '</div></body></html>'
+}
+
+function eolSafe(text) { return text }
+
+/** 写主题对比页 + 每套主题 SVG 色板卡；默认不覆盖同名文件。 */
+export function buildThemePreview(options = {}) {
+  const langInput = typeof options.lang === 'string' && options.lang.trim() !== '' ? options.lang.trim() : 'zh'
+  const language = resolveLanguage(langInput)
+  const outputDir = resolvePath(String(options.outputDir ?? '.'))
+  mkdirSync(outputDir, { recursive: true })
+  const overwrite = options.overwrite === true
+  const pickPath = (base, ext) => {
+    const first = resolvePath(joinPath(outputDir, base + ext))
+    if (overwrite || !existsSync(first)) return first
+    for (let i = 1; i < 1000; i += 1) {
+      const candidate = resolvePath(joinPath(outputDir, base + '-' + i + ext))
+      if (!existsSync(candidate)) return candidate
+    }
+    throw new Error('dsh-ppt：找不到可用的预览文件名（同名前缀超过 999 个），请允许 overwrite。')
+  }
+  const htmlPath = pickPath('themes-preview', '.html')
+  writeFileSync(htmlPath, renderThemePreviewHtml(language.id), 'utf8')
+  const svgs = THEME_IDS.map((id) => {
+    const svgPath = pickPath('theme-' + id, '.svg')
+    writeFileSync(svgPath, renderThemeSvg(id, language.id), 'utf8')
+    return { id, path: svgPath }
+  })
+  return { ok: true, outputDir, htmlPath, svgs, themeCount: THEME_IDS.length, language: language.id }
+}
+
+
 export function resolveTheme(input) {
   const id = String(input ?? DEFAULT_THEME).trim().toLowerCase()
   const theme = THEMES[id]
@@ -371,37 +525,37 @@ function quoteSlideFrom(section, ui) {
   return { layout: 'quote', kicker: ui.quoteKicker, title: truncate(lines.join(' '), 220), subtitle: attribution }
 }
 
-function paginateTable(slide, continuation = '（续）') {
-  const rows = slide.rows
-  const columns = Math.max(...rows.map(row => row.length))
-  if (columns > 8) throw new Error('dsh-ppt：表格最多 8 列，请拆成多个表格后重试 / tables support up to 8 columns')
-  if (rows.some(row => row.some(cell => [...cell].length > 60))) {
-    throw new Error('dsh-ppt：表格单元格最多 60 个字符，请精简或拆分内容后重试 / cells support up to 60 characters')
-  }
-  const padded = rows.map(row => Array.from({ length: columns }, (_, i) => row[i] ?? ''))
-  const pages = chunk(padded.slice(1), 8)
-  if (pages.length === 0) pages.push([])
-  return pages.map((body, index) => {
-    const { notes, ...rest } = slide
-    const title = slide.title + (index === 0 ? '' : continuation)
-    // 同名 kicker/title 共用紧凑标题；续页不能凭空多出一行大标题挤压表格。
-    return { ...rest, title, kicker: slide.kicker === slide.title ? title : slide.kicker, rows: [padded[0], ...body],
-      ...(index === 0 && notes ? { notes } : {}) }
-  })
-}
-
-function tableSlidesFrom(section, ui) {
-  const table = section.table
-  const rows = [table.header, ...table.rows]
-  const heading = section.heading || ui.tableKicker
-  return paginateTable({ layout: 'table', kicker: heading, title: heading, rows }, ui.continuation)
+function paginateTable(slide, continuation = '（续）') {
+  const rows = slide.rows
+  const columns = Math.max(...rows.map(row => row.length))
+  if (columns > 8) throw new Error('dsh-ppt：表格最多 8 列，请拆成多个表格后重试 / tables support up to 8 columns')
+  if (rows.some(row => row.some(cell => [...cell].length > 60))) {
+    throw new Error('dsh-ppt：表格单元格最多 60 个字符，请精简或拆分内容后重试 / cells support up to 60 characters')
+  }
+  const padded = rows.map(row => Array.from({ length: columns }, (_, i) => row[i] ?? ''))
+  const pages = chunk(padded.slice(1), 8)
+  if (pages.length === 0) pages.push([])
+  return pages.map((body, index) => {
+    const { notes, ...rest } = slide
+    const title = slide.title + (index === 0 ? '' : continuation)
+    // 同名 kicker/title 共用紧凑标题；续页不能凭空多出一行大标题挤压表格。
+    return { ...rest, title, kicker: slide.kicker === slide.title ? title : slide.kicker, rows: [padded[0], ...body],
+      ...(index === 0 && notes ? { notes } : {}) }
+  })
+}
+
+function tableSlidesFrom(section, ui) {
+  const table = section.table
+  const rows = [table.header, ...table.rows]
+  const heading = section.heading || ui.tableKicker
+  return paginateTable({ layout: 'table', kicker: heading, title: heading, rows }, ui.continuation)
 }
 
 /** 把一个 section 里的金句/表格拆成独立页；备注附着到第一张产出页。 */
 function specialSlidesFor(section, ui) {
   const out = []
   if (section.quote.length > 0) out.push(quoteSlideFrom(section, ui))
-  if (section.table !== null) out.push(...tableSlidesFrom(section, ui))
+  if (section.table !== null) out.push(...tableSlidesFrom(section, ui))
   if (out.length > 0 && section.notes.length > 0) out[0].notes = section.notes.join('\n')
   return out
 }
@@ -425,8 +579,8 @@ export function parseMarkdownDeck(titleInput, content, lang = 'zh') {
   let firstH1Seen = false
 
   const flush = () => {
-    if (current !== null && (current.heading !== '' || current.bullets.length > 0 || current.paragraphs.length > 0
-      || current.table !== null || current.quote.length > 0)) {
+    if (current !== null && (current.heading !== '' || current.bullets.length > 0 || current.paragraphs.length > 0
+      || current.table !== null || current.quote.length > 0)) {
       sections.push(current)
     }
     current = null
@@ -481,7 +635,7 @@ export function parseMarkdownDeck(titleInput, content, lang = 'zh') {
       if (isTableSeparator(tableCells)) continue
       if (current.table === null) {
         current.table = { header: tableCells.map((cell) => stripInlineMarkdown(cell)), rows: [] }
-      } else {
+      } else {
         current.table.rows.push(tableCells.map((cell) => stripInlineMarkdown(cell)))
       }
       continue
@@ -515,7 +669,7 @@ export function parseMarkdownDeck(titleInput, content, lang = 'zh') {
       }
   }
 
-  let bodySections = sections.filter((section) => section.coverOnly !== true)
+  let bodySections = sections.filter((section) => section.coverOnly !== true)
   // 首个 H1 既是封面又把所有要点收在封面节里时，把封面副标题之外的剩余要点
   // 提升为一个无标题节，走下面的要点页生成逻辑，避免丢掉内容。
   if (bodySections.length === 0 && coverSource !== null && coverSource !== undefined) {
@@ -527,18 +681,18 @@ export function parseMarkdownDeck(titleInput, content, lang = 'zh') {
     if (extras.length > 0) {
       const synthetic = createSection()
       synthetic.bullets = extras
-      bodySections = [synthetic]
-    }
-  }
-
-  // 表格和引用不能只挂在封面节上，否则首个 H1 后没有 H2 时会丢失。
-  if (coverSource && (coverSource.table !== null || coverSource.quote.length > 0)) {
-    const special = createSection()
-    special.table = coverSource.table
-    special.quote = coverSource.quote
-    special.notes = coverSource.notes
-    bodySections.unshift(special)
-  }
+      bodySections = [synthetic]
+    }
+  }
+
+  // 表格和引用不能只挂在封面节上，否则首个 H1 后没有 H2 时会丢失。
+  if (coverSource && (coverSource.table !== null || coverSource.quote.length > 0)) {
+    const special = createSection()
+    special.table = coverSource.table
+    special.quote = coverSource.quote
+    special.notes = coverSource.notes
+    bodySections.unshift(special)
+  }
 
   if (bodySections.length === 0) {
     // 一句话 / 无结构输入：封面 + 核心观点 + 结束页（仍是完整的三页演示文稿）
@@ -625,7 +779,7 @@ export function parseMarkdownDeck(titleInput, content, lang = 'zh') {
     if (pages.length > 0) {
       // 超过 8 条自动续页，不再静默丢弃；备注只挂在第一页
       pages.forEach((pagePoints, pageIndex) => {
-        const label = pageIndex === 0 ? section.heading : section.heading + ui.continuation
+        const label = pageIndex === 0 ? section.heading : section.heading + ui.continuation
         const slide = { layout: 'bullets', kicker: label, title: label, bullets: pagePoints }
         if (pageIndex === 0 && specials.length === 0 && notes !== '') slide.notes = notes
         slides.push(slide)
@@ -669,8 +823,8 @@ function normalizeSlide(raw, index) {
     let rows = []
     if (Array.isArray(source.rows)) {
       rows = source.rows
-        .map((row) => (Array.isArray(row) ? row : [row]).map((cell) => stripInlineMarkdown(String(cell))))
-        .filter((row) => row.some((cell) => cell !== ''))
+        .map((row) => (Array.isArray(row) ? row : [row]).map((cell) => stripInlineMarkdown(String(cell))))
+        .filter((row) => row.some((cell) => cell !== ''))
     }
     if (rows.length === 0) {
       // 没有表格数据的 table 页退化成要点页，避免产出空白版式
@@ -681,22 +835,22 @@ function normalizeSlide(raw, index) {
   return { layout, kicker, title, subtitle, text, bullets, ...(notes !== '' ? { notes } : {}) }
 }
 
-function checkSlideLimit(slides, limit) {
-  if (slides.length > limit) {
-    throw new Error('dsh-ppt：生成后共 ' + slides.length + ' 页，超过 maxSlides=' + limit
-      + '，请提高 maxSlides（最多 120）或拆分内容 / generated ' + slides.length + ' slides; raise maxSlides or split the deck')
-  }
-}
-
-export function normalizeSlides(rawSlides, maxSlides = 60, lang = 'zh') {
+function checkSlideLimit(slides, limit) {
+  if (slides.length > limit) {
+    throw new Error('dsh-ppt：生成后共 ' + slides.length + ' 页，超过 maxSlides=' + limit
+      + '，请提高 maxSlides（最多 120）或拆分内容 / generated ' + slides.length + ' slides; raise maxSlides or split the deck')
+  }
+}
+
+export function normalizeSlides(rawSlides, maxSlides = 60, lang = 'zh') {
   if (!Array.isArray(rawSlides) || rawSlides.length === 0) {
     throw new Error('dsh-ppt：slides 必须是非空数组（每个元素是 { layout, title, subtitle, kicker, bullets } 对象）')
   }
   const limit = clampInt(maxSlides, 60, 1, 120)
-  const ui = resolveLanguage(lang).ui
-  const slides = rawSlides.map(normalizeSlide).flatMap(slide => slide.layout === 'table'
-    ? paginateTable(slide, ui.continuation) : [slide])
-  checkSlideLimit(slides, limit)
+  const ui = resolveLanguage(lang).ui
+  const slides = rawSlides.map(normalizeSlide).flatMap(slide => slide.layout === 'table'
+    ? paginateTable(slide, ui.continuation) : [slide])
+  checkSlideLimit(slides, limit)
   if (slides.length === 0) throw new Error('dsh-ppt：slides 规范化后为空')
   return slides
 }
@@ -717,13 +871,13 @@ export function normalizeBuildOptions(options = {}) {
     deck = {
       title,
       subtitle: stripInlineMarkdown(options.subtitle ?? ''),
-      slides: normalizeSlides(options.slides, maxSlides, language.id),
+      slides: normalizeSlides(options.slides, maxSlides, language.id),
     }
   } else {
     const content = String(options.content ?? '').trim()
     if (content === '') throw new Error('dsh-ppt：content 不能为空（或用 slides 传结构化幻灯片）')
     deck = parseMarkdownDeck(title, content, language.id)
-    checkSlideLimit(deck.slides, maxSlides)
+    checkSlideLimit(deck.slides, maxSlides)
   }
   if (deck.slides.length < 1) throw new Error('dsh-ppt：没有可生成的幻灯片')
   const outputDir = resolvePath(String(options.outputDir ?? '.').trim() || '.')
@@ -838,251 +992,644 @@ export function buildDeck(options = {}) {
 // HTML 网页放映
 // ---------------------------------------------------------------------------
 
-export function renderHtml(manifest, theme, language) {
-  const t = theme
-  const lang = language
-  const ui = lang.ui
-  const motion = manifest.motion !== false
-  const motionCss = motion
-    ? `body.motion .slide.is-active{animation:slide-in .45s cubic-bezier(.22,.8,.36,1)}
-@keyframes slide-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
-body.motion .bullets li{
-  opacity:0;animation:bullet-in .55s cubic-bezier(.22,.8,.36,1) forwards;
-  animation-delay:calc(var(--i, 0)*90ms + .12s);
-}
-@keyframes bullet-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}`
-    : ''
-  const slides = manifest.slides.map((slide, index) => renderHtmlSlide(slide, index, ui, lang.id)).join('\n')
-  const themeLabel = t.name[lang.id] ?? t.name.en
-  const total = manifest.slides.length
-
-  return `<!DOCTYPE html>
-<html lang="${lang.attr}">
-<head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>${escapeHtml(manifest.title)}</title>
-<style>
-:root{
-  --bg:${t.palette.bg};
-  --panel:${t.palette.panel};
-  --fg:${t.palette.fg};
-  --muted:${t.palette.muted};
-  --accent:${t.palette.accent};
-  --accent2:${t.palette.accent2};
-  --font-heading:${t.fonts.heading};
-  --font-body:${t.fonts.body};
-}
-*{box-sizing:border-box}
-html,body{height:100%}
-body{
-  margin:0;background:var(--bg);color:var(--fg);
-  font-family:var(--font-body);overflow:hidden;
-  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
-}
-.slide{
-  position:fixed;inset:0;display:none;flex-direction:column;justify-content:center;
-  padding:clamp(34px,7vw,110px);overflow:hidden;
-}
-.slide::before{
-  content:"";position:absolute;inset:-20%;pointer-events:none;z-index:-1;
-  background:
-    radial-gradient(42% 34% at 82% 18%, ${hexToRgba(t.palette.accent, t.dark ? 0.22 : 0.12)}, transparent 70%),
-    radial-gradient(36% 30% at 12% 86%, ${hexToRgba(t.palette.accent2, t.dark ? 0.16 : 0.12)}, transparent 70%),
-    radial-gradient(70% 60% at 50% 50%, ${hexToRgba(t.palette.panel, 0.55)}, transparent 100%);
-}
-.slide.is-active{display:flex}
-${motionCss}
-.kicker{
-  color:var(--accent);font-weight:700;letter-spacing:.18em;text-transform:uppercase;
-  font-size:clamp(12px,1.3vw,18px);margin-bottom:22px;
-}
-h1,h2,.statement-title{font-family:var(--font-heading);line-height:1.06;letter-spacing:-.015em;margin:0}
-h1{font-size:clamp(44px,7.4vw,118px);max-width:20ch}
-h2{font-size:clamp(34px,5vw,82px);max-width:20ch}
-.subtitle{
-  color:var(--muted);font-size:clamp(18px,2.3vw,34px);line-height:1.5;
-  max-width:46em;margin-top:28px;
-}
-.meta{
-  color:var(--muted);font-size:clamp(12px,1.2vw,16px);margin-top:48px;
-  letter-spacing:.06em;
-}
-.bullets ul{margin:30px 0 0;padding:0;list-style:none;display:grid;gap:clamp(12px,1.6vw,24px)}
-.bullets li{
-  position:relative;padding-left:clamp(28px,2.6vw,44px);
-  font-size:clamp(20px,2.6vw,40px);line-height:1.35;max-width:24em;
-}
-.bullets li::before{
-  content:"";position:absolute;left:0;top:.58em;width:.5em;height:.5em;
-  background:var(--accent);border-radius:2px;box-shadow:.28em .28em 0 color-mix(in srgb, var(--accent2) 78%, transparent);
-}
-.section .kicker{margin-bottom:10px}
-.section .accent-line{width:min(180px,18vw);height:6px;background:var(--accent);margin:28px 0}
-.statement-title{
-  font-size:clamp(34px,5.4vw,88px);max-width:22ch;font-weight:800;
-  border-left:6px solid var(--accent);padding-left:clamp(22px,3vw,48px);
-}
-.closing{text-align:center;align-items:center}
-.closing h1,.closing .statement-title{font-size:clamp(52px,9vw,148px)}
-.closing .subtitle{color:var(--accent);font-weight:700}
-.cover h1{font-weight:900}
-.quote-mark{
-  font-family:var(--font-heading);font-size:clamp(90px,13vw,210px);line-height:.62;
-  color:var(--accent);margin-bottom:clamp(14px,2vw,30px);
-}
-.quote-text{
-  font-family:var(--font-heading);font-size:clamp(26px,4.2vw,62px);line-height:1.28;
-  font-weight:700;max-width:22ch;margin:0;
-}
-.quote-attr{color:var(--muted);margin-top:clamp(18px,2.6vw,34px);font-size:clamp(15px,1.8vw,26px);letter-spacing:.04em}
-table.deck-table{
-  border-collapse:collapse;margin-top:clamp(20px,3vw,42px);width:100%;max-width:1120px;
-  font-size:clamp(13px,1.55vw,23px);
-}
-.deck-table th{
-  background:var(--accent);color:var(--bg);text-align:left;font-weight:700;
-  padding:.6em .9em;letter-spacing:.02em;
-}
-.deck-table td{
-  padding:.55em .9em;border-bottom:1px solid color-mix(in srgb, var(--muted) 34%, transparent);
-  color:var(--fg);
-}
-.deck-table tbody tr:nth-child(even){background:color-mix(in srgb, var(--panel) 62%, transparent)}
-#progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:30;transition:width .25s}
-#hud{
-  position:fixed;right:22px;bottom:18px;z-index:30;display:flex;gap:14px;align-items:center;
-  color:var(--muted);font-size:13px;letter-spacing:.08em;font-variant-numeric:tabular-nums;
-}
-#hud button{
-  background:color-mix(in srgb, var(--panel) 88%, transparent);color:var(--fg);
-  border:1px solid color-mix(in srgb, var(--muted) 45%, transparent);border-radius:99px;
-  padding:7px 13px;font:inherit;cursor:pointer;
-}
-#hud button:hover{border-color:var(--accent);color:var(--accent)}
-#notes-panel{
-  position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;
-  background:color-mix(in srgb, var(--panel) 96%, black 4%);
-  border-top:2px solid var(--accent);
-  padding:16px clamp(22px,4vw,64px) 20px;max-height:38vh;overflow:auto;
-}
-body.notes-open #notes-panel.has-notes{display:block}
-#notes-panel .notes-label{
-  color:var(--accent);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
-  font-size:12px;margin-bottom:8px;
-}
-#notes-text{white-space:pre-wrap;line-height:1.65;font-size:15px;color:var(--fg)}
-body.overview .slide{display:flex !important;position:relative;inset:auto;width:100%;height:100vh}
-body.overview{overflow:auto}
-body.overview #progress,body.overview #hud{position:fixed}
-body.overview #notes-panel{display:none !important}
-@media (max-width:640px){
-  #hud{right:12px;bottom:10px;gap:8px;font-size:11px}
-}
-@media print{
-  html,body{height:auto;overflow:visible;background:#fff}
-  .slide{position:relative;display:block !important;height:100vh;page-break-after:always;padding:48px}
-  ${motion ? 'body.motion .bullets li{opacity:1 !important;animation:none !important}' : ''}
-  #progress,#hud,#notes-panel{display:none !important}
-}
-</style>
-</head>
-<body class="${motion ? 'motion' : 'no-motion'}">
-<div id="progress" aria-hidden="true"></div>
-${slides}
-<div id="hud" aria-live="polite">
-  <span id="counter">${ui.slide} 1 ${ui.of} ${total}</span>
-  <span id="theme-label">${ui.theme} · ${escapeHtml(themeLabel)}</span>
-  <button id="notes-toggle" title="S">${escapeHtml(ui.notesToggle)}</button>
-  <button id="fullscreen" title="F">⛶</button>
-</div>
-<div id="notes-panel" aria-live="polite">
-  <div class="notes-label">${escapeHtml(ui.notesLabel)}</div>
-  <div id="notes-text"></div>
-</div>
-<script>
-(() => {
-  const slides = Array.from(document.querySelectorAll('.slide'));
-  const counter = document.getElementById('counter');
-  const progress = document.getElementById('progress');
-  const fullscreenBtn = document.getElementById('fullscreen');
-  const notesPanel = document.getElementById('notes-panel');
-  const notesText = document.getElementById('notes-text');
-  const notesBtn = document.getElementById('notes-toggle');
-  let index = 0;
-  const total = slides.length;
-  const ui = ${JSON.stringify(ui).replace(/</g, '\\u003c')};
-
-  function refreshNotes() {
-    const notes = slides[index]?.dataset.notes || '';
-    notesPanel.classList.toggle('has-notes', notes !== '');
-    notesText.textContent = notes;
+export function renderHtml(manifest, theme, language) {
+  const t = theme
+  const lang = language
+  const ui = lang.ui
+  const motion = manifest.motion !== false
+  const motionCss = motion
+    ? `body.motion .slide.is-active{animation:slide-in .45s cubic-bezier(.22,.8,.36,1)}
+@keyframes slide-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
+body.motion .bullets li{
+  opacity:0;animation:bullet-in .55s cubic-bezier(.22,.8,.36,1) forwards;
+  animation-delay:calc(var(--i, 0)*90ms + .12s);
+}
+@keyframes bullet-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}`
+    : ''
+  const slides = manifest.slides.map((slide, index) => {
+    const label = slide.title || slide.kicker || (ui.slide + ' ' + (index + 1))
+    return '<div class="slide-frame" data-frame="' + (index + 1) + '" tabindex="-1" role="button" aria-label="' + escapeHtml(String(label)) + '">' +
+      renderHtmlSlide(slide, index, ui, lang.id) + '</div>'
+  }).join('\n')
+  const themeLabel = t.name[lang.id] ?? t.name.en
+  const total = manifest.slides.length
+
+  return `<!DOCTYPE html>
+<html lang="${lang.attr}">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="icon" href="data:,">
+<title>${escapeHtml(manifest.title)}</title>
+<style>
+:root{
+  --bg:${t.palette.bg};
+  --panel:${t.palette.panel};
+  --fg:${t.palette.fg};
+  --muted:${t.palette.muted};
+  --accent:${t.palette.accent};
+  --accent2:${t.palette.accent2};
+  --font-heading:${t.fonts.heading};
+  --font-body:${t.fonts.body};
+}
+*{box-sizing:border-box}
+html,body{height:100%}
+body{
+  margin:0;background:var(--bg);color:var(--fg);
+  font-family:var(--font-body);overflow:hidden;
+  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
+}
+#stage{position:fixed;inset:0}
+.slide-frame{position:fixed;inset:0}
+.slide{
+  position:absolute;inset:0;display:none;flex-direction:column;justify-content:center;
+  padding:clamp(34px,7vw,110px);overflow:hidden;
+}
+.slide::before{
+  content:"";position:absolute;inset:-20%;pointer-events:none;z-index:-1;
+  background:
+    radial-gradient(42% 34% at 82% 18%, ${hexToRgba(t.palette.accent, t.dark ? 0.22 : 0.12)}, transparent 70%),
+    radial-gradient(36% 30% at 12% 86%, ${hexToRgba(t.palette.accent2, t.dark ? 0.16 : 0.12)}, transparent 70%),
+    radial-gradient(70% 60% at 50% 50%, ${hexToRgba(t.palette.panel, 0.55)}, transparent 100%);
+}
+.slide.is-active{display:flex}
+${motionCss}
+.kicker{
+  color:var(--accent);font-weight:700;letter-spacing:.18em;text-transform:uppercase;
+  font-size:clamp(12px,1.3vw,18px);margin-bottom:22px;
+}
+h1,h2,.statement-title{font-family:var(--font-heading);line-height:1.06;letter-spacing:-.015em;margin:0}
+h1{font-size:clamp(44px,7.4vw,118px);max-width:20ch}
+h2{font-size:clamp(34px,5vw,82px);max-width:20ch}
+.subtitle{
+  color:var(--muted);font-size:clamp(18px,2.3vw,34px);line-height:1.5;
+  max-width:46em;margin-top:28px;
+}
+.meta{
+  color:var(--muted);font-size:clamp(12px,1.2vw,16px);margin-top:48px;
+  letter-spacing:.06em;
+}
+.bullets ul{margin:30px 0 0;padding:0;list-style:none;display:grid;gap:clamp(12px,1.6vw,24px)}
+.bullets li{
+  position:relative;padding-left:clamp(28px,2.6vw,44px);
+  font-size:clamp(20px,2.6vw,40px);line-height:1.35;max-width:24em;
+}
+.bullets li::before{
+  content:"";position:absolute;left:0;top:.58em;width:.5em;height:.5em;
+  background:var(--accent);border-radius:2px;box-shadow:.28em .28em 0 color-mix(in srgb, var(--accent2) 78%, transparent);
+}
+.section .kicker{margin-bottom:10px}
+.section .accent-line{width:min(180px,18vw);height:6px;background:var(--accent);margin:28px 0}
+.statement-title{
+  font-size:clamp(34px,5.4vw,88px);max-width:22ch;font-weight:800;
+  border-left:6px solid var(--accent);padding-left:clamp(22px,3vw,48px);
+}
+.closing{text-align:center;align-items:center}
+.closing h1,.closing .statement-title{font-size:clamp(52px,9vw,148px)}
+.closing .subtitle{color:var(--accent);font-weight:700}
+.cover h1{font-weight:900}
+.quote-mark{
+  font-family:var(--font-heading);font-size:clamp(90px,13vw,210px);line-height:.62;
+  color:var(--accent);margin-bottom:clamp(14px,2vw,30px);
+}
+.quote-text{
+  font-family:var(--font-heading);font-size:clamp(26px,4.2vw,62px);line-height:1.28;
+  font-weight:700;max-width:22ch;margin:0;
+}
+.quote-attr{color:var(--muted);margin-top:clamp(18px,2.6vw,34px);font-size:clamp(15px,1.8vw,26px);letter-spacing:.04em}
+table.deck-table{
+  border-collapse:collapse;margin-top:clamp(20px,3vw,42px);width:100%;max-width:100%;
+  font-size:clamp(14px,1.55vw,23px);
+}
+.deck-table th{
+  background:color-mix(in srgb, var(--accent) 26%, var(--bg));color:var(--fg);
+  text-align:left;font-weight:700;padding:.6em .9em;letter-spacing:.02em;
+  border-bottom:2px solid var(--accent);
+}
+.deck-table td{
+  padding:.55em .9em;border-bottom:1px solid color-mix(in srgb, var(--muted) 55%, transparent);
+  color:var(--fg);
+}
+.deck-table .num{text-align:right;font-variant-numeric:tabular-nums}
+.deck-table tbody tr:nth-child(even){background:color-mix(in srgb, var(--panel) 62%, transparent)}
+#progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:30;transition:width .25s}
+#hud{
+  position:fixed;right:22px;bottom:18px;z-index:50;display:flex;gap:10px;align-items:center;
+  color:var(--muted);font-size:13px;letter-spacing:.08em;font-variant-numeric:tabular-nums;
+}
+#hud button{
+  background:color-mix(in srgb, var(--panel) 88%, transparent);color:var(--fg);
+  border:1px solid color-mix(in srgb, var(--muted) 45%, transparent);border-radius:99px;
+  padding:8px 14px;min-height:34px;font:inherit;cursor:pointer;
+}
+#hud button:hover{border-color:var(--accent);color:var(--accent)}
+#notes-panel{
+  position:fixed;left:0;right:0;bottom:64px;z-index:40;display:none;
+  background:color-mix(in srgb, var(--panel) 96%, black 4%);
+  border-top:2px solid var(--accent);
+  padding:14px clamp(22px,4vw,64px) 18px;max-height:38vh;overflow:auto;
+}
+body.notes-open #notes-panel{display:block}
+#notes-panel .notes-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
+#notes-close{
+  background:transparent;color:var(--muted);border:1px solid color-mix(in srgb, var(--muted) 45%, transparent);
+  border-radius:99px;padding:4px 12px;font:inherit;cursor:pointer;min-height:30px;
+}
+#notes-close:hover{color:var(--accent);border-color:var(--accent)}
+#notes-panel .notes-label{
+  color:var(--accent);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
+  font-size:12px;margin-bottom:8px;
+}
+#notes-text{white-space:pre-wrap;line-height:1.65;font-size:clamp(15px,1.5vw,18px);color:var(--fg)}
+#notes-text.is-empty{color:var(--muted);font-style:italic}
+#help-panel{
+  position:fixed;right:22px;bottom:64px;z-index:60;max-width:390px;
+  background:color-mix(in srgb, var(--panel) 96%, black 4%);color:var(--fg);
+  border:1px solid color-mix(in srgb, var(--accent) 55%, transparent);border-radius:14px;
+  padding:16px 20px;box-shadow:0 18px 50px rgba(0,0,0,.45);font-size:14px;line-height:1.8;
+}
+#help-panel[hidden]{display:none}
+#help-panel kbd{
+  background:color-mix(in srgb, var(--accent) 22%, transparent);border-radius:5px;
+  padding:1px 6px;font-family:inherit;font-size:12px;
+}
+#toast{
+  position:fixed;left:50%;bottom:84px;transform:translateX(-50%);z-index:70;
+  background:color-mix(in srgb, var(--panel) 96%, black 4%);color:var(--fg);
+  border:1px solid color-mix(in srgb, var(--accent) 55%, transparent);border-radius:99px;
+  padding:9px 18px;font-size:13px;
+}
+#toast[hidden]{display:none}
+#blank{position:fixed;inset:0;z-index:80;display:none;pointer-events:none}
+body.blank-black #blank{display:block;background:#000}
+body.blank-white #blank{display:block;background:#fff}
+body.blank-black #hud,body.blank-white #hud{visibility:hidden;pointer-events:none}
+:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
+body.overview #stage{
+  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;
+  padding:18px 18px 92px;position:fixed;inset:0;overflow:auto;align-content:start;
+}
+body.overview .slide-frame{
+  position:relative;inset:auto;width:100%;aspect-ratio:16/9;overflow:hidden;
+  border:1px solid color-mix(in srgb, var(--muted) 35%, transparent);border-radius:12px;
+  cursor:pointer;background:var(--bg);outline:none;
+}
+body.overview .slide-frame:hover{border-color:var(--accent)}
+body.overview .slide-frame.is-current{outline:2px solid var(--accent);outline-offset:2px}
+body.overview .slide-frame:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
+body.overview .slide-frame::after{
+  content:attr(data-frame);position:absolute;right:8px;bottom:6px;z-index:2;
+  font-size:12px;color:var(--muted);background:color-mix(in srgb, var(--bg) 84%, transparent);
+  border:1px solid color-mix(in srgb, var(--muted) 40%, transparent);border-radius:6px;
+  padding:1px 7px;font-variant-numeric:tabular-nums;
+}
+body.overview .slide{
+  display:flex !important;position:absolute;inset:0;width:100vw;height:100vh;
+  transform:scale(var(--deck-thumb-scale,.25));transform-origin:top left;pointer-events:none;
+  animation:none !important;
+}
+body.overview .bullets li{opacity:1 !important;animation:none !important}
+body.overview #notes-panel,body.presenting #notes-panel{display:none !important}
+body.presenting #notes-toggle{opacity:.55}
+body.presenting #hud{opacity:0;pointer-events:none;transition:opacity .25s}
+body.presenting #hud:hover{opacity:1;pointer-events:auto}
+@media (max-width:900px){
+  .slide{padding:clamp(22px,5vw,44px)}
+  h1{font-size:clamp(34px,8.5vw,64px)}
+  h2{font-size:clamp(26px,6.5vw,48px)}
+  .statement-title{font-size:clamp(26px,7vw,54px)}
+  .subtitle{font-size:clamp(16px,3.4vw,24px)}
+  .bullets li{font-size:clamp(16px,3.4vw,24px)}
+  .kicker{font-size:13px}
+  .deck-table{font-size:14px}
+  .deck-table th,.deck-table td{padding:.55em .6em}
+  #hud{right:10px;bottom:10px;gap:8px;font-size:12px}
+  #hud button{padding:10px 16px;min-height:44px}
+  #notes-panel{bottom:68px;max-height:45vh}
+  #help-panel{right:10px;bottom:68px;left:10px;max-width:none}
+}
+@media (max-width:640px){
+  #theme-label{display:none}
+}
+@media (prefers-reduced-motion: reduce){
+  *,*::before,*::after{animation:none !important;transition:none !important}
+}
+@media print{
+  html,body{height:auto;overflow:visible;background:#fff}
+  .slide-frame{position:relative;display:block !important}
+  .slide{position:relative;display:block !important;height:100vh;page-break-after:always;padding:48px}
+  ${motion ? 'body.motion .bullets li{opacity:1 !important;animation:none !important}' : ''}
+  #progress,#hud,#notes-panel,#help-panel,#toast{display:none !important}
+}
+</style>
+</head>
+<body class="${motion ? 'motion' : 'no-motion'}">
+<div id="progress" aria-hidden="true"></div>
+<div id="stage">
+${slides}
+</div>
+<div id="hud" aria-live="polite">
+  <span id="counter">${ui.slide} 1 ${ui.of} ${total}</span>
+  <span id="theme-label">${ui.theme} · ${escapeHtml(themeLabel)}</span>
+  <button id="notes-toggle" type="button" title="S · ${escapeHtml(ui.notesToggle)}" aria-controls="notes-panel" aria-expanded="false">${escapeHtml(ui.notesToggle)}</button>
+  <button id="presenter-toggle" type="button" title="V · ${escapeHtml(ui.presenterToggle)}">${escapeHtml(ui.presenterToggle)}</button>
+  <button id="overview-toggle" type="button" title="G · ${escapeHtml(ui.overviewToggle)}" aria-pressed="false">${escapeHtml(ui.overviewToggle)}</button>
+  <button id="help-toggle" type="button" title="?" aria-label="${escapeHtml(ui.helpTitle)}">?</button>
+  <button id="fullscreen" type="button" title="F · Fullscreen" aria-label="Fullscreen">⛶</button>
+</div>
+<div id="notes-panel" role="region" aria-label="${escapeHtml(ui.notesLabel)}">
+  <div class="notes-head">
+    <span class="notes-label">${escapeHtml(ui.notesLabel)}</span>
+    <button id="notes-close" type="button" aria-label="${escapeHtml(ui.notesCloseLabel)}">×</button>
+  </div>
+  <div id="notes-text"></div>
+</div>
+<div id="help-panel" hidden>
+  <div class="notes-label">${escapeHtml(ui.helpTitle)}</div>
+  <p><kbd>←</kbd> <kbd>→</kbd> / <kbd>Space</kbd> 翻页 · <kbd>Home</kbd> / <kbd>End</kbd> 首末页 · <kbd>S</kbd> ${escapeHtml(ui.notesToggle)} · <kbd>V</kbd> ${escapeHtml(ui.presenterToggle)} · <kbd>G</kbd> ${escapeHtml(ui.overviewToggle)} · <kbd>F</kbd> 全屏 · <kbd>P</kbd> 打印 · <kbd>B</kbd> 黑屏 · <kbd>W</kbd> 白屏 · <kbd>Esc</kbd> ${escapeHtml(ui.closeLabel)} · <kbd>?</kbd> ${escapeHtml(ui.helpTitle)}</p>
+  <p>${escapeHtml(ui.presenterHint)}</p>
+  <p>${escapeHtml(ui.overviewHint)}</p>
+</div>
+<div id="toast" role="status" hidden></div>
+<div id="blank" aria-hidden="true"></div>
+<script>
+(() => {
+  const frames = Array.from(document.querySelectorAll('.slide-frame'));
+  const slides = Array.from(document.querySelectorAll('.slide'));
+  const counter = document.getElementById('counter');
+  const progress = document.getElementById('progress');
+  const fullscreenBtn = document.getElementById('fullscreen');
+  const notesPanel = document.getElementById('notes-panel');
+  const notesText = document.getElementById('notes-text');
+  const notesBtn = document.getElementById('notes-toggle');
+  const notesClose = document.getElementById('notes-close');
+  const presenterBtn = document.getElementById('presenter-toggle');
+  const overviewBtn = document.getElementById('overview-toggle');
+  const helpBtn = document.getElementById('help-toggle');
+  const helpPanel = document.getElementById('help-panel');
+  const toastEl = document.getElementById('toast');
+  let index = 0;
+  let presenterWin = null;
+  let presenterInitSent = false;
+  let toastTimer = 0;
+  const total = slides.length;
+  const ui = ${JSON.stringify(ui).replace(/</g, '\\u003c')};
+
+  function notesOf(i) { return slides[i] && slides[i].dataset ? (slides[i].dataset.notes || '') : ''; }
+  function titleOf(i) {
+    const el = slides[i] ? slides[i].querySelector('h1,h2,.statement-title,.quote-text') : null;
+    return el ? el.textContent.trim() : '';
+  }
+  function state() {
+    const next = (index + 1) % total;
+    return { index: index, total: total, title: titleOf(index), notes: notesOf(index), nextTitle: titleOf(next), nextNotes: notesOf(next) };
+  }
+  window.__dshPpt = { go: function (delta) { go(index + delta); }, jump: function (i) { go(i); }, state: state };
+
+  function toast(message) {
+    toastEl.textContent = message;
+    toastEl.hidden = false;
+    clearTimeout(toastTimer);
+    toastTimer = setTimeout(function () { toastEl.hidden = true; }, 2600);
+  }
+
+  function syncNotes() {
+    const notes = notesOf(index);
+    notesText.textContent = notes || ui.noNotes;
+    notesText.classList.toggle('is-empty', notes === '');
+    notesBtn.setAttribute('aria-expanded', document.body.classList.contains('notes-open') ? 'true' : 'false');
+    updatePresenter();
+  }
+
+  function sendInit() {
+    if (!presenterOpen()) return;
+    try {
+      presenterWin.postMessage({
+        __dshPpt: 'init',
+        title: (document.title.split(' · ')[1] || document.title),
+        css: document.querySelector('style') ? document.querySelector('style').textContent : '',
+        total: total,
+        slides: slides.map(function (slide) { return slide.outerHTML; }),
+      }, '*');
+    } catch (_) { /* popup closing */ }
   }
 
-  function go(next) {
-    index = (next + total) % total;
-    slides.forEach((slide, i) => slide.classList.toggle('is-active', i === index));
-    counter.textContent = ui.slide + ' ' + (index + 1) + ' ' + ui.of + ' ' + total;
-    progress.style.width = ((index + 1) / total * 100) + '%';
-    refreshNotes();
-    document.title = (index + 1) + ' / ' + total + ' · ' + ${JSON.stringify(manifest.title).replace(/</g, '\\u003c')};
-    try { history.replaceState?.(null, '', '#slide-' + (index + 1)); } catch { /* file:// 下个别浏览器可能拒绝 */ }
+  function sendState() {
+    if (!presenterOpen()) return;
+    const next = (index + 1) % total;
+    try {
+      presenterWin.postMessage({
+        __dshPpt: 'state',
+        index: index,
+        total: total,
+        title: titleOf(index),
+        nextTitle: titleOf(next),
+        notes: notesOf(index),
+        nextNotes: notesOf(next),
+        blank: document.body.classList.contains('blank-black') ? 'black' : (document.body.classList.contains('blank-white') ? 'white' : null),
+      }, '*');
+    } catch (_) { /* popup closing */ }
+  }
+
+  function updatePresenter() { sendState(); }
+
+  function go(next) {
+    if (document.body.classList.contains('blank-black') || document.body.classList.contains('blank-white')) setBlank(null);
+    const wrapped = next < 0 || next >= total;
+    index = (next + total) % total;
+    slides.forEach(function (slide, i) {
+      slide.classList.toggle('is-active', i === index);
+      if (frames[i]) frames[i].classList.toggle('is-current', i === index);
+    });
+    counter.textContent = ui.slide + ' ' + (index + 1) + ' ' + ui.of + ' ' + total;
+    progress.style.width = ((index + 1) / total * 100) + '%';
+    document.title = (index + 1) + ' / ' + total + ' · ' + ${JSON.stringify(manifest.title).replace(/</g, '\\u003c')};
+    try { history.replaceState?.(null, '', '#slide-' + (index + 1)); } catch (_) { /* file:// 下个别浏览器可能拒绝 */ }
+    if (wrapped) toast(ui.wrapHint + ' ' + (index + 1) + ' / ' + total);
+    syncNotes();
+  }
+
+  function notesOpen() { return document.body.classList.contains('notes-open'); }
+  function presenterOpen() { try { return !!(presenterWin && !presenterWin.closed); } catch (_) { return false; } }
+
+  function setNotes(on) {
+    document.body.classList.toggle('notes-open', on);
+    if (on) setOverview(false);
+    syncNotes();
+  }
+
+  function updateThumbScale() {
+    if (!document.body.classList.contains('overview')) return;
+    requestAnimationFrame(function () {
+      const width = frames[0] ? frames[0].getBoundingClientRect().width : 0;
+      if (width > 0) document.documentElement.style.setProperty('--deck-thumb-scale', String(width / window.innerWidth));
+    });
+  }
+
+  function setOverview(on) {
+    document.body.classList.toggle('overview', on);
+    overviewBtn.setAttribute('aria-pressed', on ? 'true' : 'false');
+    frames.forEach(function (frame) { frame.tabIndex = on ? 0 : -1; });
+    if (on) {
+      document.body.classList.remove('notes-open');
+      helpPanel.hidden = true;
+      syncNotes();
+      updateThumbScale();
+    }
+  }
+
+  function presenterHtml() {
+    const labelCurrent = ${JSON.stringify(ui.currentLabel)};
+    const labelNext = ${JSON.stringify(ui.nextLabel)};
+    const labelNotes = ${JSON.stringify(ui.notesLabel)};
+    const noNotes = ${JSON.stringify(ui.noNotes)};
+    const hintText = ${JSON.stringify('← → 翻页 · P 暂停 · T 重置 · +/- 字号 · B/W 黑/白屏 · Esc 结束')};
+    const deckTitle = ${JSON.stringify(manifest.title).replace(/</g, '\\u003c')};
+    const langAttr = ${JSON.stringify(lang.attr)};
+    const cs = getComputedStyle(document.documentElement);
+    const val = function (name, fallback) { const v = cs.getPropertyValue(name).trim(); return v || fallback; };
+    const css = [
+      ':root{--bg:' + val('--bg', '#070B14') + ';--panel:' + val('--panel', '#0D1424') + ';--fg:' + val('--fg', '#E8F1FF') + ';--muted:' + val('--muted', '#7E8BA8') + ';--accent:' + val('--accent', '#7C3AED') + ';--accent2:' + val('--accent2', '#06B6D4') + ';--font-heading:' + val('--font-heading', 'sans-serif') + ';--font-body:' + val('--font-body', 'sans-serif') + '}',
+      '*{box-sizing:border-box}',
+      'body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-body);height:100vh;display:flex;flex-direction:column;overflow:hidden}',
+      'header{display:flex;align-items:center;gap:14px;padding:9px 16px;border-bottom:1px solid color-mix(in srgb, var(--muted) 40%, transparent);font-size:13px;color:var(--muted)}',
+      'header #ptitle{color:var(--fg);font-weight:700;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}',
+      'header #pclock{font-variant-numeric:tabular-nums}',
+      'main{flex:1;display:grid;grid-template-columns:1.12fr .88fr;gap:12px;padding:12px 16px;min-height:0}',
+      '.col{display:flex;flex-direction:column;gap:10px;min-height:0}',
+      '.card{background:var(--panel);border:1px solid color-mix(in srgb, var(--muted) 30%, transparent);border-radius:12px;padding:10px 12px;min-height:0;display:flex;flex-direction:column;gap:6px}',
+      '.card-notes{flex:1}',
+      '.lbl{color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}',
+      '.pv{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:8px;background:var(--bg);border:1px solid color-mix(in srgb, var(--muted) 25%, transparent);--pv-scale:.3}',
+      '.pv-slide{position:absolute;left:0;top:0;transform:translate(var(--pv-x,0px),var(--pv-y,0px)) scale(var(--pv-scale,.25));transform-origin:top left}',
+      '.pv-slide .slide{display:flex !important;position:absolute;left:0;top:0;width:100vw;height:100vh;animation:none !important}',
+      '.pv-slide .bullets li{opacity:1 !important;animation:none !important}',
+      '#thumbs{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}',
+      '#thumbs .thumb{position:relative;flex:0 0 128px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;border:1px solid color-mix(in srgb, var(--muted) 35%, transparent);cursor:pointer;background:var(--bg);--pv-scale:.09}',
+      '#thumbs .thumb.is-current{outline:2px solid var(--accent);outline-offset:1px}',
+      '#pnotes{font-size:var(--notes-size,19px);line-height:1.6;white-space:pre-wrap;overflow:auto;flex:1}',
+      'footer{display:flex;align-items:center;gap:8px;padding:9px 16px;border-top:1px solid color-mix(in srgb, var(--muted) 40%, transparent);flex-wrap:wrap}',
+      'button{background:color-mix(in srgb, var(--panel) 90%, transparent);color:var(--fg);border:1px solid color-mix(in srgb, var(--muted) 45%, transparent);border-radius:99px;padding:6px 12px;min-height:34px;font:inherit;font-size:13px;cursor:pointer}',
+      'button:hover{border-color:var(--accent);color:var(--accent)}',
+      'button[aria-pressed="true"]{background:var(--accent);color:var(--bg);border-color:var(--accent)}',
+      '#ptimer{font-variant-numeric:tabular-nums;font-size:20px;font-weight:700;color:var(--accent);margin-left:6px}',
+      '.bar{flex:1;min-width:100px;height:8px;background:color-mix(in srgb, var(--muted) 28%, transparent);border-radius:99px;overflow:hidden}',
+      '#pprog{height:100%;width:0;background:var(--accent);transition:width .2s}',
+      '.hint{color:var(--muted);font-size:11px;width:100%}',
+    ].join('');
+    const js = [
+      'var total=0,index=0,elapsed=0,started=Date.now(),paused=false,notesSize=19,slides=[],cssText="",curBlank=null,initialized=false,readyTries=0;',
+      'function q(id){return document.getElementById(id)}',
+      'function post(m){try{if(window.opener)window.opener.postMessage(m,"*")}catch(e){}}',
+      'function fmt(ms){var s=Math.max(0,Math.floor(ms/1000)),m=Math.floor(s/60);s=s%60;var h=Math.floor(m/60);m=m%60;return (h>0?(h<10?"0":"")+h+":":"")+(m<10?"0":"")+m+":"+(s<10?"0":"")+s}',
+      'function clock(){var d=new Date();return ("0"+d.getHours()).slice(-2)+":"+("0"+d.getMinutes()).slice(-2)+":"+("0"+d.getSeconds()).slice(-2)}',
+      'function tick(){if(!paused)elapsed=Date.now()-started;q("ptimer").textContent=fmt(elapsed);q("pclock").textContent=clock();if(window.requestAnimationFrame)requestAnimationFrame(tick);else setTimeout(tick,250)}',
+      'function fitBox(box){var rw=box.clientWidth||320,rh=box.clientHeight||180;var s=Math.min(rw/window.innerWidth,rh/window.innerHeight);var ox=(rw-window.innerWidth*s)/2,oy=(rh-window.innerHeight*s)/2;box.style.setProperty("--pv-scale",String(s));box.style.setProperty("--pv-x",ox+"px");box.style.setProperty("--pv-y",oy+"px")}',
+      'function fit(){fitBox(q("pv-cur"));fitBox(q("pv-next"));var th=q("thumbs").children;for(var i=0;i<th.length;i++){fitBox(th[i])}}',
+      'function setSlide(box,html){box.innerHTML="";var f=document.createElement("div");f.className="pv-slide";f.innerHTML=html;box.appendChild(f)}',
+      'function buildThumbs(){var box=q("thumbs");box.innerHTML="";slides.forEach(function(html,i){var t=document.createElement("div");t.className="thumb";var f=document.createElement("div");f.className="pv-slide";f.innerHTML=html;t.appendChild(f);t.addEventListener("click",function(){post({__dshPpt:"cmd",kind:"go",index:i})});box.appendChild(t)});fit()}',
+      'function renderState(st){index=st.index;total=st.total||total;q("pcounter").textContent=(index+1)+" / "+total;setSlide(q("pv-cur"),slides[index]||"");setSlide(q("pv-next"),slides[(index+1)%total]||"");q("pnotes").textContent=st.notes||' + JSON.stringify(ui.noNotes) + ';q("pprog").style.width=((index+1)/total*100)+"%";curBlank=st.blank||null;q("pv-black").setAttribute("aria-pressed",curBlank==="black"?"true":"false");q("pv-white").setAttribute("aria-pressed",curBlank==="white"?"true":"false");q("pv-black").textContent=curBlank==="black"?"取消黑屏":"黑屏";q("pv-white").textContent=curBlank==="white"?"取消白屏":"白屏";var th=q("thumbs").children;for(var i=0;i<th.length;i++){th[i].classList.toggle("is-current",i===index)}fit()}',
+      'function togglePause(){paused=!paused;if(!paused)started=Date.now()-elapsed;var b=q("pause");b.setAttribute("aria-pressed",paused?"true":"false");b.textContent=paused?"继续":"暂停"}',
+      'function resetTimer(){started=Date.now();elapsed=0}',
+      'function applyNotesSize(){document.documentElement.style.setProperty("--notes-size",notesSize+"px")}',
+      'window.addEventListener("message",function(e){var d=e.data||{};if(d.__dshPpt==="init"&&!initialized){initialized=true;slides=d.slides||[];total=d.total||slides.length;cssText=d.css||"";var st=document.createElement("style");st.textContent=cssText;document.head.appendChild(st);q("ptitle").textContent=d.title||"";buildThumbs()}else if(d.__dshPpt==="state"){renderState(d)}else if(d.__dshPpt==="close"){window.close()}});',
+      'window.addEventListener("resize",fit);',
+      'window.addEventListener("beforeunload",function(){post({__dshPpt:"cmd",kind:"closed"})});',
+      'document.addEventListener("keydown",function(e){var k=e.key;if(k==="ArrowRight"||k===" "){e.preventDefault();post({__dshPpt:"cmd",kind:"go",delta:1})}else if(k==="ArrowLeft"){e.preventDefault();post({__dshPpt:"cmd",kind:"go",delta:-1})}else if(k==="Escape"){post({__dshPpt:"cmd",kind:"end"});window.close()}else if(k.toLowerCase()==="p"){togglePause()}else if(k.toLowerCase()==="t"){resetTimer()}else if(k==="+"||k==="="){notesSize=Math.min(34,notesSize+2);applyNotesSize()}else if(k==="-"){notesSize=Math.max(12,notesSize-2);applyNotesSize()}else if(k.toLowerCase()==="b"){post({__dshPpt:"cmd",kind:"blank",color:curBlank==="black"?null:"black"})}else if(k.toLowerCase()==="w"){post({__dshPpt:"cmd",kind:"blank",color:curBlank==="white"?null:"white"})}});',
+      'q("prev").addEventListener("click",function(){post({__dshPpt:"cmd",kind:"go",delta:-1})});',
+      'q("next").addEventListener("click",function(){post({__dshPpt:"cmd",kind:"go",delta:1})});',
+      'q("pause").addEventListener("click",togglePause);',
+      'q("reset").addEventListener("click",resetTimer);',
+      'q("font-plus").addEventListener("click",function(){notesSize=Math.min(34,notesSize+2);applyNotesSize()});',
+      'q("font-minus").addEventListener("click",function(){notesSize=Math.max(12,notesSize-2);applyNotesSize()});',
+      'q("pv-black").addEventListener("click",function(){post({__dshPpt:"cmd",kind:"blank",color:curBlank==="black"?null:"black"})});',
+      'q("pv-white").addEventListener("click",function(){post({__dshPpt:"cmd",kind:"blank",color:curBlank==="white"?null:"white"})});',
+      'q("end").addEventListener("click",function(){post({__dshPpt:"cmd",kind:"end"});window.close()});',
+      'applyNotesSize();tick();function ready(){if(initialized)return;post({__dshPpt:"ready"});readyTries++;if(readyTries<5)setTimeout(ready,700)}setTimeout(ready,250);',
+    ].join('');
+    return '<!DOCTYPE html><html lang="' + langAttr + '"><head><meta charset="UTF-8"><title>' + deckTitle + ' · 演讲者视图</title><style>' + css + '</style></head><body>'
+      + '<header><div id="ptitle"></div><div id="pcounter"></div><div id="pclock" title="本地时间"></div></header>'
+      + '<main><div class="col">'
+      + '<div class="card"><div class="lbl">' + labelCurrent + '</div><div class="pv" id="pv-cur"></div></div>'
+      + '<div class="card"><div class="lbl">' + labelNext + '</div><div class="pv" id="pv-next"></div></div>'
+      + '<div class="card"><div class="lbl">SLIDES</div><div id="thumbs"></div></div>'
+      + '</div><div class="col"><div class="card card-notes"><div class="lbl">' + labelNotes + '</div><div id="pnotes"></div></div></div></main>'
+      + '<footer><button id="prev" title="上一页 (←)">◀</button><button id="next" title="下一页 (→)">▶</button><button id="pause" title="暂停 (P)" aria-pressed="false">暂停</button><button id="reset" title="重置计时 (T)">重置计时</button><button id="font-minus" title="备注字号减小 (-)">A−</button><button id="font-plus" title="备注字号增大 (+)">A+</button><button id="pv-black" title="黑屏 (B)">黑屏</button><button id="pv-white" title="白屏 (W)">白屏</button><button id="end" title="结束放映 (Esc)">结束放映</button><div id="ptimer">00:00</div><div class="bar"><div id="pprog"></div></div><div class="hint">' + hintText + '</div></footer>'
+      + '<scr' + 'ipt>' + js + '</scr' + 'ipt></body></html>';
   }
 
-  document.addEventListener('keydown', (event) => {
-    if (event.key === 'ArrowRight' || event.key === 'PageDown' || event.key === ' ') {
-      event.preventDefault(); go(index + 1);
-    } else if (event.key === 'ArrowLeft' || event.key === 'PageUp') {
-      event.preventDefault(); go(index - 1);
-    } else if (event.key === 'Home') {
-      event.preventDefault(); go(0);
-    } else if (event.key === 'End') {
-      event.preventDefault(); go(total - 1);
-    } else if (event.key.toLowerCase() === 'f') {
-      if (!document.fullscreenElement) document.documentElement.requestFullscreen?.();
-      else document.exitFullscreen?.();
-    } else if (event.key.toLowerCase() === 'g') {
-      document.body.classList.toggle('overview');
-      go(index);
-    } else if (event.key.toLowerCase() === 's') {
-      document.body.classList.toggle('notes-open');
-    } else if (event.key.toLowerCase() === 'p') {
-      window.print();
+  async function toggleFullscreen() {
+    try {
+      if (document.fullscreenElement) { await document.exitFullscreen?.(); return; }
+      if (!document.documentElement.requestFullscreen || document.fullscreenEnabled === false) {
+        toast(ui.fullscreenUnavailable);
+        return;
+      }
+      await document.documentElement.requestFullscreen();
+      if (!document.fullscreenElement) toast(ui.fullscreenUnavailable);
+    } catch (_) { toast(ui.fullscreenUnavailable); }
+  }
+
+  function openPresenter() {
+    if (presenterOpen()) { try { presenterWin.focus(); } catch (_) { /* gone */ } return; }
+    let url = '';
+    try {
+      url = URL.createObjectURL(new Blob([presenterHtml()], { type: 'text/html' }));
+    } catch (_) { toast(ui.popupBlocked); return; }
+    presenterInitSent = false;
+    presenterWin = window.open(url, 'dsh-ppt-presenter', 'width=1180,height=760');
+    if (!presenterWin) {
+      try { URL.revokeObjectURL(url); } catch (_) { /* ignore */ }
+      toast(ui.popupBlocked);
+      return;
     }
-  });
+    document.body.classList.add('presenting');
+    if (document.activeElement && typeof document.activeElement.blur === 'function') document.activeElement.blur();
+    setTimeout(function () { try { URL.revokeObjectURL(url); } catch (_) { /* ignore */ } }, 5000);
+  }
 
-  let wheelLock = 0;
-  document.addEventListener('wheel', (event) => {
-    const now = Date.now();
-    if (now - wheelLock < 550 || document.body.classList.contains('overview')) return;
-    wheelLock = now;
-    if (Math.abs(event.deltaY) > 12) go(index + (event.deltaY > 0 ? 1 : -1));
-  }, { passive: true });
-
-  let touchStartY = 0;
-  document.addEventListener('touchstart', (event) => { touchStartY = event.touches[0].clientY; }, { passive: true });
-  document.addEventListener('touchend', (event) => {
-    const delta = event.changedTouches[0].clientY - touchStartY;
-    if (Math.abs(delta) > 48) go(index + (delta < 0 ? 1 : -1));
-  }, { passive: true });
-
-  fullscreenBtn.addEventListener('click', () => {
-    if (!document.fullscreenElement) document.documentElement.requestFullscreen?.();
-    else document.exitFullscreen?.();
-  });
+  function closePresenter() {
+    if (presenterOpen()) {
+      try { presenterWin.postMessage({ __dshPpt: 'close' }, '*'); presenterWin.close(); } catch (_) { /* gone */ }
+    }
+    document.body.classList.remove('presenting');
+    presenterInitSent = false;
+    if (document.fullscreenElement) { try { document.exitFullscreen?.(); } catch (_) { /* ignore */ } }
+    setBlank(null);
+  }
 
-  notesBtn.addEventListener('click', () => {
-    document.body.classList.toggle('notes-open');
-  });
+  function setBlank(color) {
+    document.body.classList.remove('blank-black', 'blank-white');
+    if (color === 'black') document.body.classList.add('blank-black');
+    else if (color === 'white') document.body.classList.add('blank-white');
+    sendState();
+  }
 
-  const start = Number.parseInt(location.hash?.replace('#slide-', ''), 10);
-  go(Number.isInteger(start) ? start - 1 : 0);
-})();
-</script>
-</body>
-</html>`
-}
+  setInterval(function () {
+    if (!presenterOpen() && document.body.classList.contains('presenting')) {
+      document.body.classList.remove('presenting');
+      if (document.fullscreenElement) { try { document.exitFullscreen?.(); } catch (_) { /* ignore */ } }
+      setBlank(null);
+    }
+  }, 800);
+
+  window.addEventListener('message', function (event) {
+    if (event.source !== presenterWin) return;
+    const data = event.data || {};
+    if (data.__dshPpt === 'cmd' && (data.kind === 'end' || data.kind === 'closed')) { closePresenter(); return; }
+    if (!presenterOpen()) return;
+    if (data.__dshPpt === 'ready') {
+      if (!presenterInitSent) { presenterInitSent = true; sendInit(); }
+      sendState();
+      return;
+    }
+    if (data.__dshPpt !== 'cmd') return;
+    if (data.kind === 'go') {
+      setBlank(null);
+      if (typeof data.index === 'number') go(data.index);
+      else go(index + (data.delta || 0));
+      sendState();
+    } else if (data.kind === 'blank') {
+      setBlank(data.color || null);
+    } else if (data.kind === 'end') {
+      closePresenter();
+    } else if (data.kind === 'closed') {
+      document.body.classList.remove('presenting');
+      setBlank(null);
+    }
+  });
 
+  document.addEventListener('keydown', (event) => {
+    const key = event.key;
+    const lower = key.toLowerCase();
+    const targetEl = event.target;
+    const interactive = targetEl && (targetEl.tagName === 'BUTTON' || targetEl.tagName === 'INPUT' || targetEl.tagName === 'SELECT' || targetEl.tagName === 'TEXTAREA' || targetEl.isContentEditable === true);
+    if (key === ' ' && interactive) return;
+    if (key === 'Escape') {
+      if (!helpPanel.hidden) { helpPanel.hidden = true; return; }
+      if (document.body.classList.contains('overview')) { setOverview(false); return; }
+      if (notesOpen()) { setNotes(false); return; }
+      if (document.body.classList.contains('presenting') || document.body.classList.contains('blank-black') || document.body.classList.contains('blank-white')) { closePresenter(); return; }
+      if (document.fullscreenElement) { document.exitFullscreen?.(); return; }
+      return;
+    }
+    const inOverview = document.body.classList.contains('overview');
+    if (key === 'ArrowRight' || key === 'PageDown' || key === ' ' || (key === 'ArrowDown' && !inOverview)) {
+      event.preventDefault(); go(index + 1);
+    } else if (key === 'ArrowLeft' || key === 'PageUp' || (key === 'ArrowUp' && !inOverview)) {
+      event.preventDefault(); go(index - 1);
+    } else if (/^[1-9]$/.test(key) && !inOverview) {
+      const jumped = Number(key);
+      if (jumped <= total) { event.preventDefault(); go(jumped - 1); }
+    } else if (key === 'Home') {
+      event.preventDefault(); go(0);
+    } else if (key === 'End') {
+      event.preventDefault(); go(total - 1);
+    } else if (key === 'Enter' && inOverview) {
+      event.preventDefault(); setOverview(false);
+    } else if (lower === 'f') {
+      void toggleFullscreen();
+    } else if (lower === 'g') {
+      setOverview(!inOverview);
+    } else if (lower === 's') {
+      if (document.body.classList.contains('presenting')) { toast(ui.presenterHint); }
+      else { document.body.classList.toggle('notes-open'); syncNotes(); }
+    } else if (lower === 'v') {
+      if (presenterOpen()) closePresenter();
+      else openPresenter();
+    } else if (lower === 'b') {
+      setBlank(document.body.classList.contains('blank-black') ? null : 'black');
+    } else if (lower === 'w') {
+      setBlank(document.body.classList.contains('blank-white') ? null : 'white');
+    } else if (lower === 'p') {
+      window.print();
+    } else if (key === '?') {
+      helpPanel.hidden = !helpPanel.hidden;
+    }
+  });
+
+  let wheelLock = 0;
+  document.addEventListener('wheel', (event) => {
+    const now = Date.now();
+    if (now - wheelLock < 550 || document.body.classList.contains('overview') || notesOpen()) return;
+    wheelLock = now;
+    if (Math.abs(event.deltaY) > 12) go(index + (event.deltaY > 0 ? 1 : -1));
+  }, { passive: true });
+
+  let touchStartY = 0;
+  document.addEventListener('touchstart', (event) => { touchStartY = event.touches[0].clientY; }, { passive: true });
+  document.addEventListener('touchend', (event) => {
+    const delta = event.changedTouches[0].clientY - touchStartY;
+    if (Math.abs(delta) > 48 && !document.body.classList.contains('overview')) go(index + (delta < 0 ? 1 : -1));
+  }, { passive: true });
+
+  fullscreenBtn.addEventListener('click', () => { void toggleFullscreen(); });
+  notesBtn.addEventListener('click', () => {
+    if (document.body.classList.contains('presenting')) { toast(ui.presenterHint); return; }
+    setNotes(!notesOpen());
+  });
+  notesClose.addEventListener('click', () => setNotes(false));
+  presenterBtn.addEventListener('click', () => { if (presenterOpen()) closePresenter(); else openPresenter(); });
+  overviewBtn.addEventListener('click', () => setOverview(!document.body.classList.contains('overview')));
+  helpBtn.addEventListener('click', () => { helpPanel.hidden = !helpPanel.hidden; });
+  frames.forEach((frame, i) => {
+    frame.addEventListener('click', () => {
+      if (document.body.classList.contains('overview')) { go(i); setOverview(false); }
+    });
+    frame.addEventListener('keydown', (event) => {
+      if (event.key === 'Enter' && document.body.classList.contains('overview')) { go(i); setOverview(false); }
+    });
+  });
+  window.addEventListener('resize', updateThumbScale);
+  window.addEventListener('beforeunload', closePresenter);
+
+  const start = Number.parseInt(location.hash?.replace('#slide-', ''), 10);
+  go(Number.isInteger(start) ? start - 1 : 0);
+})();
+</script>
+</body>
+</html>`
+}
 function renderHtmlSlide(slide, index, ui, langId) {
   const kicker = slide.kicker || (slide.layout === 'cover' ? ui.coverKicker : '')
   const title = slide.title || ''
@@ -1118,12 +1665,15 @@ function renderHtmlSlide(slide, index, ui, langId) {
       const rows = Array.isArray(slide.rows) ? slide.rows : []
       const head = rows[0] ?? []
       const body = rows.slice(1)
-      inner = '<div class="kicker">' + escapeHtml(kicker || ui.tableKicker) + '</div>' +
-        (title !== '' && title !== kicker ? '<h2>' + escapeHtml(title) + '</h2>' : '') +
+      const isNum = (cell) => /^\s*[+-]?(?:\d{1,3}(?:,\d{3})+|\d+)(?:\.\d+)?\s*(?:%|％|次|页|个|人|元|天|小时|分钟)?\s*$/.test(String(cell ?? ''))
+      const headingText = title !== '' ? title : (kicker || ui.tableKicker)
+      const showKicker = kicker !== '' && kicker !== headingText
+      inner = (showKicker ? '<div class="kicker">' + escapeHtml(kicker) + '</div>' : '') +
+        '<h2>' + escapeHtml(headingText) + '</h2>' +
         '<table class="deck-table"><thead><tr>' +
-        head.map((cell) => '<th>' + escapeHtml(cell) + '</th>').join('') +
+        head.map((cell) => '<th' + (isNum(cell) ? ' class="num"' : '') + '>' + escapeHtml(cell) + '</th>').join('') +
         '</tr></thead><tbody>' +
-        body.map((row) => '<tr>' + row.map((cell) => '<td>' + escapeHtml(cell) + '</td>').join('') + '</tr>').join('') +
+        body.map((row) => '<tr>' + row.map((cell) => '<td' + (isNum(cell) ? ' class="num"' : '') + '>' + escapeHtml(cell) + '</td>').join('') + '</tr>').join('') +
         '</tbody></table>'
       break
     }