@topmindspace/tms-skills 0.1.9 → 0.1.11

package/CHANGELOG.md

@@ -1,3 +1,33 @@
+## 0.1.11 — 2026-09-26
+
+### Positioning · README slim · showcase narrative
+
+- **差异化定位**：根 README / 技能 README（中英）开篇写清——市面 PPT 技能很多，为何还要 top-ppt-html；特色 **HTML + PPT 双交付**；为**演示报告 / 正式商务演示**而生；参考 **MD3** 信息密度与克制；日常 HTML 等同幻灯片，需要时再导出高保真可编辑 PPTX。
+- **主题总览只留一张**：默认 `theme-overview.png`（演示·business-blue）；caption 链到 style-gallery / 研究·架构总览路径；正文不再三张并排占屏（落地页同步精简）。
+- **Showcase 叙事**：改写「为什么是我们」与「双交付」两页；subtitle / meta → v0.1.11；版本折线含 0.1.11；`validate_report --strict` **0/0**（5 种图表保持）。
+- **截图**：刷新 `docs/showcase/topmind-showcase/*` 与 `top-ppt-html/assets/showcase/`（含 positioning / charts / toolbar）。
+- **SKILL.md**：开篇与 description 产品句对齐定位；等量删减冗余，体积仍 ≤13KB。
+- **Live**：`docs/showcase.html` / Pages 源与 github.io `tms-skills/` 同步本版。
+- 版本对齐 **0.1.11**（根 + 技能 package/lock / SKILL metadata / README / PUBLISHING）。
+
+### 红线未动
+反截断、图表多样性地板、Mode A craft、runtime SHA 同版本门禁、中文「演示文稿」术语、整仓 npm 发版、motion=none。
+
+## 0.1.10 — 2026-09-26
+
+### Showcase · header toolbar docs · bilingual README
+
+- **产品 Showcase 加厚**：`2026-09-26-topmind-tms-skills-showcase` 扩为 Mode A · 12 内容页；**5 种图表**（`bar` / `donut` / `line` / `waterfall` / `hbar`）经 `render_from_model` + `hydrate_charts` 回填；含 **Header 工具栏专页**（控件 × 快捷键 × 行为表）；`validate_report --strict` **0/0**。
+- **Header 工具栏文档**：`SKILL.md` 交付物表（T/P/H/F/B + 9 风格 + Esc/翻页 + `REPORT_MODEL` 同步）；根 README / 技能 README（中英）显著说明。
+- **双语 README**：保持 **`README.md` = 中文默认**；新增 **`README.en.md`** 全量英文平行；`top-ppt-html/README.en.md` 用户向摘要；文首互链。
+- **截图**：刷新 `docs/showcase/topmind-showcase/*` 与 `top-ppt-html/assets/showcase/`（含 `showcase-toolbar.png`）。
+- **维护工具**：新增 `scripts/hydrate_charts.py`（核心图类型占位 SVG → 模型数据绘形，供样张重建）。
+- **Live**：`docs/showcase.html` / Pages 源与 github.io `tms-skills/` 同步本版 showcase。
+- 版本对齐 **0.1.10**（根 + 技能 package/lock / SKILL metadata / README / PUBLISHING）。
+
+### 红线未动
+反截断、图表多样性地板、Mode A craft、runtime SHA 同版本门禁、中文「演示文稿」术语、整仓 npm 发版、motion=none。
+
 ## 0.1.9 — 2026-09-26
 
 ### Docs · banner · theme overview · live showcase

package/README.en.md

@@ -0,0 +1,140 @@
+# tms-skills
+
+**[中文](./README.md)** | English
+
+> Language note: **Chinese is the default** (`README.md`). This file is the full English parallel.
+
+[![Release](https://img.shields.io/github/v/release/topmindspace/tms-skills?style=flat-square&color=blue)](https://github.com/topmindspace/tms-skills/releases)
+[![npm](https://img.shields.io/npm/v/@topmindspace/tms-skills?style=flat-square)](https://www.npmjs.com/package/@topmindspace/tms-skills)
+[![CI](https://img.shields.io/github/actions/workflow/status/topmindspace/tms-skills/ci.yml?style=flat-square&label=CI)](https://github.com/topmindspace/tms-skills/actions/workflows/ci.yml)
+[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=flat-square)](LICENSE)
+
+**TopMindspace agent-skills monorepo** — turn good ideas into stage-ready **formal business presentations**.
+
+Primary skill **[top-ppt-html](./top-ppt-html/)**: **HTML + PPT dual delivery**, built for **demo reports / formal business decks**.
+
+### Why top-ppt-html
+
+Plenty of PPT skills exist — some lean gadgety, some dump consulting density by default. **top-ppt-html** takes a different path:
+
+- **Dual delivery**: day-to-day, present with **single-file HTML** like slides; export **high-fidelity editable PPTX** when needed (charts carry data you can annotate)
+- **MD3-inspired**: spatial layout, **fitting information density**, restrained type / shapes / color
+- **Stage-ready**: clear, atmospheric, multi-style — formal business presenting, not decoration
+
+> Let ideas fly — make good thinking visible.
+
+<p align="center">
+  <img src="docs/assets/tms-skills-banner.png" alt="tms-skills — TopMindspace agent skills" width="960" />
+</p>
+
+> **Warning**: do not install `@topmindspace/tms-skills@^2` (2.0.0–2.1.1 deprecated). Current line is **0.1.x** (`latest`).
+
+## Craft at a glance
+
+### Theme overview (Gate 0)
+
+<p align="center">
+  <img src="top-ppt-html/assets/theme-overview.png" alt="Presentation mode · business-blue theme overview" width="900" /><br/>
+  <sub>Presentation · business-blue (default) · also <a href="./top-ppt-html/assets/style-gallery.html">style-gallery</a> · <a href="./top-ppt-html/assets/theme-overview-research.png">research overview</a> · <a href="./top-ppt-html/assets/theme-overview-architecture.png">architecture overview</a></sub>
+</p>
+
+### Style covers
+
+| Presentation · business-blue | Research · mckinsey | Architecture · graphite-dark |
+|:---:|:---:|:---:|
+| ![bizblue](docs/showcase/presentation-business-blue/bizblue-cover.png) | ![mckinsey](docs/showcase/research-mckinsey/mckinsey-cover.png) | ![graphite](docs/showcase/architecture-graphite-dark/graphite-cover.png) |
+
+### Product showcase (Mode A · dual-delivery narrative · multi-chart · header toolbar)
+
+| Positioning | Dual delivery | Charts | Header toolbar |
+|:---:|:---:|:---:|:---:|
+| ![pos](docs/showcase/topmind-showcase/showcase-s1.png) | ![split](docs/showcase/topmind-showcase/showcase-s3.png) | ![charts](docs/showcase/topmind-showcase/showcase-s5.png) | ![toolbar](docs/showcase/topmind-showcase/showcase-s11.png) |
+
+**Live**
+
+- Landing: [topmindspace.github.io/tms-skills/](https://topmindspace.github.io/tms-skills/)
+- Full deck: [showcase.html](https://topmindspace.github.io/tms-skills/showcase.html)
+- Style gallery: [style-gallery.html](https://topmindspace.github.io/tms-skills/style-gallery.html)
+- In-repo gallery: [top-ppt-html/assets/style-gallery.html](./top-ppt-html/assets/style-gallery.html)
+- Showcase HTML: [top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html)
+- More shots: [docs/showcase/](./docs/showcase/)
+
+### HTML header toolbar (ready when you open the file)
+
+| Control | Shortcut | Behavior |
+|---------|----------|----------|
+| Theme toggle | **T** | Light / dark; per-file memory; syncs `REPORT_MODEL.theme` |
+| Style picker | 9 styles | Live visual skins; write back `REPORT_MODEL.style` before deliver |
+| PPTX preview | **P** | WYSIWYG page sequence + copyable agent prompt |
+| Generation guide | **H** | Dual-channel + environment notes |
+| Fullscreen | **F** | Immersive present mode |
+| Collapse toolbar | **B** | Mini bar (brand + expand); remembers per file |
+
+See [top-ppt-html/README.md](./top-ppt-html/README.md) and [SKILL.md](./top-ppt-html/SKILL.md).
+
+## Skills
+
+| Skill | Version | What it does |
+|-------|---------|--------------|
+| [`top-ppt-html`](./top-ppt-html/) | **0.1.11** | Formal business decks: paginated HTML + editable 16:9 PPTX; dual delivery · MD3-inspired density; 3 modes × 9 styles; strict 0/0 |
+
+Installer [`@topmindspace/tms-skills`](https://www.npmjs.com/package/@topmindspace/tms-skills) is also **0.1.11** (whole-repo same-tag releases).
+
+## Install
+
+**npm = pinned snapshot**; **GitHub = track repo HEAD**.
+
+```bash
+npx @topmindspace/tms-skills list
+npx @topmindspace/tms-skills install top-ppt-html
+npx @topmindspace/tms-skills install top-ppt-html --to ./.claude/skills
+npx @topmindspace/tms-skills@0.1.11 install top-ppt-html   # pin
+```
+
+```bash
+# track HEAD
+npx github:topmindspace/tms-skills install top-ppt-html
+```
+
+Default probe order: `./.agents` → `./.claude` → `./.cursor` → `./.codex` → `./.mimocode`, then user-level `~/.claude`, etc. Or pass `--to`. Do not `npm install top-ppt-html` (skill id is not a standalone package).
+
+PPTX export needs `npm install` in the skill folder (pptxgenjs). HTML generation uses Python stdlib only.
+
+## Golden examples
+
+| Mode | File |
+|------|------|
+| A Presentation | [`2026-09-09-presentation-business-blue`](./top-ppt-html/assets/examples/2026-09-09-presentation-business-blue.html) |
+| B Research | [`2026-09-09-research-mckinsey`](./top-ppt-html/assets/examples/2026-09-09-research-mckinsey.html) |
+| C Architecture | [`2026-09-09-architecture-graphite-dark`](./top-ppt-html/assets/examples/2026-09-09-architecture-graphite-dark.html) |
+| Product showcase | [`2026-09-26-topmind-tms-skills-showcase`](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html) (dual-delivery narrative · 5 chart types · toolbar page) |
+
+## Repo layout
+
+```
+tms-skills/
+├─ top-ppt-html/             # skill (SKILL.md + assets + references + scripts)
+├─ bin/tms-skills.js         # CLI: list / install
+├─ docs/                     # publishing · showcase shots · banner · Pages source
+├─ scripts/                  # repo gates / privacy scan
+├─ package.json              # @topmindspace/tms-skills
+└─ LICENSE · CHANGELOG.md · README.md · README.en.md
+```
+
+## Release & CI
+
+| Action | GitHub | npm |
+|--------|:------:|:---:|
+| push main | live | **unchanged** |
+| tag `vX.Y.Z` | Release + zip | **auto publish** |
+
+```bash
+npm run check && npm run audit && npm run privacy
+# PPTX smoke (incl. McKinsey): bash scripts/ci_skill_gates.sh --with-pptx
+```
+
+See [docs/PUBLISHING.md](./docs/PUBLISHING.md) · [docs/ci.md](./docs/ci.md).
+
+## License
+
+MIT © TopMindspace — [LICENSE](./LICENSE)

package/README.md

@@ -1,13 +1,23 @@
 # tms-skills
 
+[English](./README.en.md) | 中文
+
 [![Release](https://img.shields.io/github/v/release/topmindspace/tms-skills?style=flat-square&color=blue)](https://github.com/topmindspace/tms-skills/releases)
 [![npm](https://img.shields.io/npm/v/@topmindspace/tms-skills?style=flat-square)](https://www.npmjs.com/package/@topmindspace/tms-skills)
 [![CI](https://img.shields.io/github/actions/workflow/status/topmindspace/tms-skills/ci.yml?style=flat-square&label=CI)](https://github.com/topmindspace/tms-skills/actions/workflows/ci.yml)
 [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=flat-square)](LICENSE)
 
-**TopMindspace 智能体技能 monorepo** — 把好想法做成可上台的交付。
+**TopMindspace 智能体技能 monorepo** — 把好想法做成可上台的正式商务演示。
+
+当前主技能 **[top-ppt-html](./top-ppt-html/)**：**HTML + PPT 双交付**，为**演示报告 / 正式商务演示**而生。
+
+### 为什么是 top-ppt-html
+
+市面 PPT 技能很多：有的偏花哨装饰，有的偏咨询 dump。**top-ppt-html** 走另一条路——
 
-当前主技能 **[top-ppt-html](./top-ppt-html/)**：优雅、大气的正式场合**演示文稿**（单文件 HTML + 版式保真可编辑 PPTX）。
+- **双交付**：日常用**单文件 HTML**等同幻灯片演示；需要时再导出**高保真可编辑 PPTX**（图表带数据、可标注）
+- **参考 MD3**：整体空间布局、**合适的信息密度**、克制的文字 / 图形 / 形状 / 颜色
+- **产出即上台**：直观、美观大气、风格多样；主场是正式商务演示，不是 gadget
 
 > 让 idea 飞，好想法被看见。
 
@@ -23,17 +33,7 @@
 
 <p align="center">
   <img src="top-ppt-html/assets/theme-overview.png" alt="演示模式 · business-blue 主题总览" width="900" /><br/>
-  <sub>演示 · business-blue</sub>
-</p>
-
-<p align="center">
-  <img src="top-ppt-html/assets/theme-overview-research.png" alt="研究模式 · mckinsey 主题总览" width="900" /><br/>
-  <sub>研究 · mckinsey</sub>
-</p>
-
-<p align="center">
-  <img src="top-ppt-html/assets/theme-overview-architecture.png" alt="架构模式 · graphite-dark 主题总览" width="900" /><br/>
-  <sub>架构 · graphite-dark</sub>
+  <sub>演示 · business-blue（默认）· 另见 <a href="./top-ppt-html/assets/style-gallery.html">style-gallery</a> · <a href="./top-ppt-html/assets/theme-overview-research.png">研究总览</a> · <a href="./top-ppt-html/assets/theme-overview-architecture.png">架构总览</a></sub>
 </p>
 
 ### 风格封面
@@ -42,11 +42,11 @@
 |:---:|:---:|:---:|
 | ![bizblue](docs/showcase/presentation-business-blue/bizblue-cover.png) | ![mckinsey](docs/showcase/research-mckinsey/mckinsey-cover.png) | ![graphite](docs/showcase/architecture-graphite-dark/graphite-cover.png) |
 
-### 产品 Showcase 样张（Mode A · ~10 页）
+### 产品 Showcase（Mode A · 双交付叙事 · 多图 · Header 工具栏）
 
-| Cover | 三模式 | 质量门禁 |
-|:---:|:---:|:---:|
-| ![cover](docs/showcase/topmind-showcase/showcase-cover.png) | ![modes](docs/showcase/topmind-showcase/showcase-s4.png) | ![gates](docs/showcase/topmind-showcase/showcase-s6.png) |
+| 定位 | 双交付 | 图表 | Header 工具栏 |
+|:---:|:---:|:---:|:---:|
+| ![pos](docs/showcase/topmind-showcase/showcase-s1.png) | ![split](docs/showcase/topmind-showcase/showcase-s3.png) | ![charts](docs/showcase/topmind-showcase/showcase-s5.png) | ![toolbar](docs/showcase/topmind-showcase/showcase-s11.png) |
 
 **在线体验**
 
@@ -54,16 +54,29 @@
 - 完整演示文稿：[showcase.html](https://topmindspace.github.io/tms-skills/showcase.html)
 - 风格画廊：[style-gallery.html](https://topmindspace.github.io/tms-skills/style-gallery.html)
 - 仓库内交互画廊：[top-ppt-html/assets/style-gallery.html](./top-ppt-html/assets/style-gallery.html)
-- 仓库内 Showcase HTML：[top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html)
+- 仓库内 Showcase：[top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html)
 - 更多截图：[docs/showcase/](./docs/showcase/)
 
+### HTML Header 工具栏（打开即用）
+
+| 控件 | 快捷键 | 做什么 |
+|------|--------|--------|
+| 亮暗主题 | **T** | 浅/深切换，按文件记忆，同步 `REPORT_MODEL.theme` |
+| 风格选择 | 9 套 | 九风格实时换肤；交付前写回 `REPORT_MODEL.style` |
+| 预览 PPTX | **P** | 页序列预览 + 可复制精导提示词 |
+| PPT 生成指引 | **H** | 双通道与环境说明 |
+| 全屏 | **F** | 沉浸演示 |
+| 收起工具栏 | **B** | 折叠为迷你条 |
+
+详见 [top-ppt-html/README.md](./top-ppt-html/README.md#html-header-工具栏) · [SKILL.md 交付物](./top-ppt-html/SKILL.md)。
+
 ## 技能一览
 
 | 技能 | 版本 | 做什么 |
 |------|------|--------|
-| [`top-ppt-html`](./top-ppt-html/) | **0.1.9** | 正式场合演讲/汇报演示文稿：HTML 可翻页 + 16:9 可编辑 PPTX；三模式 × 九风格；strict 0/0 门禁 |
+| [`top-ppt-html`](./top-ppt-html/) | **0.1.11** | 正式商务演示：HTML 可翻页 + 16:9 可编辑 PPTX；双交付 · MD3 密度克制；三模式 × 九风格；strict 0/0 |
 
-安装器 [`@topmindspace/tms-skills`](https://www.npmjs.com/package/@topmindspace/tms-skills) 同为 **0.1.9**（整仓同 tag 发版）。
+安装器 [`@topmindspace/tms-skills`](https://www.npmjs.com/package/@topmindspace/tms-skills) 同为 **0.1.11**（整仓同 tag 发版）。
 
 ## 安装
 
@@ -73,7 +86,7 @@
 npx @topmindspace/tms-skills list
 npx @topmindspace/tms-skills install top-ppt-html
 npx @topmindspace/tms-skills install top-ppt-html --to ./.claude/skills
-npx @topmindspace/tms-skills@0.1.9 install top-ppt-html   # 钉版本
+npx @topmindspace/tms-skills@0.1.11 install top-ppt-html   # 钉版本
 ```
 
 ```bash
@@ -92,7 +105,7 @@ PPTX 精导需在技能目录 `npm install`（pptxgenjs）。HTML 生成仅 Pyth
 | A 演示 | [`2026-09-09-presentation-business-blue`](./top-ppt-html/assets/examples/2026-09-09-presentation-business-blue.html) |
 | B 研究 | [`2026-09-09-research-mckinsey`](./top-ppt-html/assets/examples/2026-09-09-research-mckinsey.html) |
 | C 架构 | [`2026-09-09-architecture-graphite-dark`](./top-ppt-html/assets/examples/2026-09-09-architecture-graphite-dark.html) |
-| 产品 Showcase | [`2026-09-26-topmind-tms-skills-showcase`](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html) |
+| 产品 Showcase | [`2026-09-26-topmind-tms-skills-showcase`](./top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html)（双交付叙事 · 5 种图表 · Header 工具栏） |
 
 ## 仓库结构
 
@@ -100,10 +113,10 @@ PPTX 精导需在技能目录 `npm install`（pptxgenjs）。HTML 生成仅 Pyth
 tms-skills/
 ├─ top-ppt-html/             # 技能（SKILL.md + assets + references + scripts）
 ├─ bin/tms-skills.js         # CLI：list / install
-├─ docs/                     # 发布规范 · showcase 截图 · banner
+├─ docs/                     # 发布规范 · showcase 截图 · banner · Pages 源
 ├─ scripts/                  # 仓库级门禁 / 隐私扫描
 ├─ package.json              # @topmindspace/tms-skills
-└─ LICENSE · CHANGELOG.md · README.md
+└─ LICENSE · CHANGELOG.md · README.md · README.en.md
 ```
 
 ## 发布与 CI

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@topmindspace/tms-skills",
-  "version": "0.1.9",
-  "description": "TopMindspace 智能体技能 monorepo — 通过 npm / GitHub npx 安装技能（top-ppt-html：优雅大气正式场合演讲/汇报演示文稿等）。",
+  "version": "0.1.11",
+  "description": "TopMindspace 智能体技能 monorepo — 通过 npm / GitHub npx 安装技能（top-ppt-html：HTML+PPT 双交付，正式商务演示文稿）。",
   "license": "MIT",
   "author": "TopMindspace",
   "repository": {
@@ -27,6 +27,7 @@
   "files": [
     "bin",
     "README.md",
+    "README.en.md",
     "LICENSE",
     "CHANGELOG.md",
     "top-ppt-html"

package/top-ppt-html/README.en.md

@@ -0,0 +1,82 @@
+# TopPPT HTML
+
+**[中文](./README.md)** | English
+
+[![Release](https://img.shields.io/github/v/release/topmindspace/tms-skills?style=flat-square&color=blue)](https://github.com/topmindspace/tms-skills/releases)
+[![npm](https://img.shields.io/npm/v/@topmindspace/tms-skills?style=flat-square)](https://www.npmjs.com/package/@topmindspace/tms-skills)
+[![CI](https://img.shields.io/github/actions/workflow/status/topmindspace/tms-skills/ci.yml?style=flat-square&label=CI)](https://github.com/topmindspace/tms-skills/actions/workflows/ci.yml)
+[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=flat-square)](../LICENSE)
+
+**Let ideas fly — make good thinking visible.** A high-craft skill for **demo reports / formal business presentations**: **HTML + PPT dual delivery** — day-to-day, present with paginated HTML like slides; export **layout-faithful editable PPTX** when needed. **MD3-inspired**: fitting information density, restrained type / shapes / color. Core craft is layout, typography, color, and content structure — not gadget soup.
+
+### Why top-ppt-html
+
+Plenty of PPT skills exist. This one is for **formal business presenting**: clear, atmospheric, multi-style, **high-fidelity editable PPTX** (charts carry annotatable data) — stage-ready output.
+
+<p align="center">
+  <img src="assets/showcase/showcase-cover.png" alt="TopMind × tms-skills showcase cover" width="720" />
+</p>
+
+- Skill id: `top-ppt-html`; brand: **TopPPT HTML**
+- Version: **v0.1.11** (same tag as `@topmindspace/tms-skills@0.1.11`)
+- **Agent entry**: `SKILL.md` → `references/playbook.md` (L1) → L2 on demand
+- **Human maintainers**: this README (install / commands / layout); do not treat it as the generation spec
+
+### Theme overview (Gate 0)
+
+<p align="center">
+  <img src="assets/theme-overview.png" alt="Presentation · business-blue" width="860" /><br/>
+  <sub>Presentation · business-blue (default) · also <a href="./assets/style-gallery.html">style-gallery</a> · <a href="./assets/theme-overview-research.png">research</a> · <a href="./assets/theme-overview-architecture.png">architecture</a></sub>
+</p>
+
+### Style × mode
+
+| business-blue · Presentation | mckinsey · Research | graphite-dark · Architecture |
+|:---:|:---:|:---:|
+| ![bb](assets/showcase/style-business-blue-cover.png) | ![mk](assets/showcase/style-mckinsey-cover.png) | ![gr](assets/showcase/style-graphite-cover.png) |
+
+| Positioning | Dual delivery | Charts | Header toolbar |
+|:---:|:---:|:---:|:---:|
+| ![pos](assets/showcase/showcase-positioning.png) | ![sp](assets/showcase/showcase-split.png) | ![ch](assets/showcase/showcase-charts.png) | ![tb](assets/showcase/showcase-toolbar.png) |
+
+**Live** · [Landing](https://topmindspace.github.io/tms-skills/) · [Showcase deck](https://topmindspace.github.io/tms-skills/showcase.html) · [Style gallery](https://topmindspace.github.io/tms-skills/style-gallery.html)
+
+- In-repo gallery: [`assets/style-gallery.html`](./assets/style-gallery.html)
+- Product showcase: [`assets/examples/2026-09-26-topmind-tms-skills-showcase.html`](./assets/examples/2026-09-26-topmind-tms-skills-showcase.html) (Mode A · dual-delivery narrative · **5 chart types** · toolbar page)
+- Repo shot pack: [`docs/showcase/`](../docs/showcase/)
+
+## Skill snapshot
+
+| Dimension | Capability |
+|-----------|------------|
+| Output | Single-file HTML (paginated, light/dark, **header toolbar T/P/H/F/B + 9 styles**) + 16:9 editable PPTX |
+| Positioning | Formal business · dual delivery · MD3-inspired density |
+| Modes | A Presentation · B Research · C Architecture |
+| Styles | 9 packs (`styles.md`) |
+| Charts | Core 8 by default + full registry; variety / anti-truncation / Mode A craft |
+| Quality | `validate_report --strict` · `validate_pptx --strict` · `quality_gate --deliver` |
+
+## HTML header toolbar
+
+| Control | Shortcut | Behavior |
+|---------|----------|----------|
+| Theme toggle | **T** | Light / dark; per-file memory; syncs `REPORT_MODEL.theme` |
+| Style picker | 9 styles | Live visual skins; write back `REPORT_MODEL.style` before deliver |
+| PPTX preview | **P** | WYSIWYG sequence + copyable agent prompt |
+| Generation guide | **H** | Dual-channel + environment notes |
+| Fullscreen | **F** | Immersive present |
+| Collapse toolbar | **B** | Mini bar; remembers per file |
+
+Also: arrow-key paging; **Esc** closes modals. After style/theme change, re-run `validate_report --strict` (do not rewrite content).
+
+## Install
+
+```bash
+npx @topmindspace/tms-skills install top-ppt-html
+npx @topmindspace/tms-skills@0.1.11 install top-ppt-html
+npx github:topmindspace/tms-skills install top-ppt-html
+```
+
+PPTX needs `npm install` in this folder (pptxgenjs). HTML generation: Python stdlib only.
+
+Full Chinese maintainer docs (directory map, command cookbook): see [`README.md`](./README.md). Agent rules live in `SKILL.md` / `playbook.md`.

package/top-ppt-html/README.md

@@ -1,18 +1,24 @@
 # TopPPT HTML
 
+[English](./README.en.md) | 中文
+
 [![Release](https://img.shields.io/github/v/release/topmindspace/tms-skills?style=flat-square&color=blue)](https://github.com/topmindspace/tms-skills/releases)
 [![npm](https://img.shields.io/npm/v/@topmindspace/tms-skills?style=flat-square)](https://www.npmjs.com/package/@topmindspace/tms-skills)
 [![CI](https://img.shields.io/github/actions/workflow/status/topmindspace/tms-skills/ci.yml?style=flat-square&label=CI)](https://github.com/topmindspace/tms-skills/actions/workflows/ci.yml)
 [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=flat-square)](../LICENSE)
 
-**让 idea 飞，好想法被看见。** 面向**演讲与正式场合**的高品质演示文稿技能：把主张、调研、分析、架构方案，生成为**优雅、美观、大气**的可翻页 HTML + **版式保真可编辑 PPTX**。核心工艺是版式、排版、色彩与内容组织——克制图标/图表配文，而非 gadget 堆砌或咨询 dump 默认。
+**让 idea 飞，好想法被看见。** 为**演示报告 / 正式商务演示**而生的高品质演示文稿技能：**HTML + PPT 双交付**——日常用可翻页 HTML 等同幻灯片；需要时再导出**版式保真可编辑 PPTX**。参考 **MD3**：合适信息密度、克制文字/图形/颜色。核心工艺是版式、排版、色彩与内容组织——不是 gadget 堆砌。
+
+### 为什么还是 top-ppt-html
+
+市面 PPT 技能很多。本技能主场是**正式商务演示**：直观、美观大气、风格多样、**高保真可编辑 PPTX**（图表带数据可标注）；产出即上台。
 
 <p align="center">
   <img src="assets/showcase/showcase-cover.png" alt="TopMind × tms-skills showcase cover" width="720" />
 </p>
 
 - 技能标识：`top-ppt-html`；品牌名：**TopPPT HTML**
-- 版本：**v0.1.9**（与 `@topmindspace/tms-skills@0.1.9` 同 tag）
+- 版本：**v0.1.11**（与 `@topmindspace/tms-skills@0.1.11` 同 tag）
 - **智能体入口**：`SKILL.md` → `references/playbook.md`（L1）→ L2 按需
 - **人类维护者**：本 README（安装 / 命令 / 目录）；勿把本文件当生成规范
 
@@ -20,17 +26,7 @@
 
 <p align="center">
   <img src="assets/theme-overview.png" alt="演示模式 · business-blue 主题总览" width="860" /><br/>
-  <sub>演示 · business-blue</sub>
-</p>
-
-<p align="center">
-  <img src="assets/theme-overview-research.png" alt="研究模式 · mckinsey 主题总览" width="860" /><br/>
-  <sub>研究 · mckinsey</sub>
-</p>
-
-<p align="center">
-  <img src="assets/theme-overview-architecture.png" alt="架构模式 · graphite-dark 主题总览" width="860" /><br/>
-  <sub>架构 · graphite-dark</sub>
+  <sub>演示 · business-blue（默认）· 另见 <a href="./assets/style-gallery.html">style-gallery</a> · <a href="./assets/theme-overview-research.png">研究</a> · <a href="./assets/theme-overview-architecture.png">架构</a></sub>
 </p>
 
 ### 风格 × 模式一览
@@ -39,25 +35,41 @@
 |:---:|:---:|:---:|
 | ![bb](assets/showcase/style-business-blue-cover.png) | ![mk](assets/showcase/style-mckinsey-cover.png) | ![gr](assets/showcase/style-graphite-cover.png) |
 
-| Showcase · HTML+PPTX | 三模式 | 质量门禁 |
-|:---:|:---:|:---:|
-| ![sp](assets/showcase/showcase-split.png) | ![md](assets/showcase/showcase-modes.png) | ![gt](assets/showcase/showcase-gates.png) |
+| 定位 | 双交付 | 图表 | Header 工具栏 |
+|:---:|:---:|:---:|:---:|
+| ![pos](assets/showcase/showcase-positioning.png) | ![sp](assets/showcase/showcase-split.png) | ![ch](assets/showcase/showcase-charts.png) | ![tb](assets/showcase/showcase-toolbar.png) |
 
 **在线体验** · [落地页](https://topmindspace.github.io/tms-skills/) · [Showcase 演示文稿](https://topmindspace.github.io/tms-skills/showcase.html) · [风格画廊](https://topmindspace.github.io/tms-skills/style-gallery.html)
 
 - 交互画廊（仓库内）：[`assets/style-gallery.html`](./assets/style-gallery.html)
-- 产品 Showcase（仓库内）：[`assets/examples/2026-09-26-topmind-tms-skills-showcase.html`](./assets/examples/2026-09-26-topmind-tms-skills-showcase.html)（Mode A · business-blue · ~10 页）
+- 产品 Showcase（仓库内）：[`assets/examples/2026-09-26-topmind-tms-skills-showcase.html`](./assets/examples/2026-09-26-topmind-tms-skills-showcase.html)（Mode A · 双交付叙事 · **5 种图表** · Header 工具栏）
 - 仓库级大图集：[`docs/showcase/`](../docs/showcase/)（不进技能 zip）
 
 ## 一、技能简介（人类速览）
 | 维度 | 能力 |
 |------|------|
-| 产出 | 单文件 HTML（可翻页、亮暗双主题、header 工具栏）+ 16:9 可编辑 PPTX（精导通道） |
+| 产出 | **双交付**：日常 HTML 可翻页演示 + 按需 16:9 可编辑 PPTX；亮暗双主题 · **Header 工具栏 T/P/H/F/B + 9 风格** |
+| 定位 | 正式商务演示 · MD3 密度克制 · 非 gadget |
 | 三模式 | A 演示 · B 研究 · C 架构（页型/字号/密度契约见 `playbook.md` §一） |
 | 风格 | 9 套（`styles.md`）；编码色板 c1–c5 随风格 |
 | 图表 | 核图 8 默认 + registry 全量；多样性 / 反截断 / Mode A 工艺见 playbook + `presentation-craft.md` |
 | 质量 | `validate_report --strict`（A 隐含 layout-qa）· `validate_pptx --strict` · `quality_gate --deliver` |
 
+## HTML Header 工具栏
+
+打开交付的 HTML 即可使用顶栏快捷操作（产品 Showcase 有专页演示）：
+
+| 控件 | 快捷键 | 行为 |
+|------|--------|------|
+| 亮暗主题 | **T** | 浅色外发 / 深色大屏；**按文件记忆**；同步 `REPORT_MODEL.theme` |
+| 风格选择 | 9 套下拉 | 九风格实时切换（纯视觉，不动内容）；交付前 `data-style` = `REPORT_MODEL.style` |
+| 预览 PPTX | **P** | 页序列所见即所得；可复制提示词回对话走精导 |
+| PPT 生成指引 | **H** | 双通道说明与环境依赖（与 `?` 同效） |
+| 全屏 | **F** | 沉浸演示 |
+| 收起工具栏 | **B** | 折叠为迷你条；锚点自适应并按文件记忆 |
+
+另：方向键翻页；**Esc** 关闭预览/帮助模态。风格或主题变更后须重跑 `validate_report --strict`（不重写内容）。
+
 生成规范、页型/图表穷举、铁律 **不在本文件**——智能体读 `SKILL.md` / playbook；选型大表见 `page-type-matrix.md` / `chart-decision-tree.md`。
 
 **核心架构**：HTML 与 PPTX 出自同一内容模型 `window.REPORT_MODEL`（唯一事实源）；页面只预览不导出，PPTX 由智能体走「精导通道」生成（extract → build → strict 校验）。阈值与几何全部单源化：`scripts/layout-constants.json`（常量）+ `scripts/model-schema.json`（页型 DSL）。

package/top-ppt-html/SKILL.md

@@ -1,15 +1,15 @@
 ---
 name: top-ppt-html
-description: "Use when 用户要做报告、演示、汇报、PPT、slides、deck、路演，或写研究报告、分析报告、咨询报告、白皮书、调研、评测、对标、经营分析、复盘、项目汇报、商务/HTML/网页报告，或做架构图、拓扑图、流程图、泳道图、方案图，或把材料做成可视化报告并导出 HTML/PPT/PPTX，或优化排版/版式/配色/图文布局，或要快速模式/fast/直接生成/一键出稿/少问一句。TopPPT HTML：优雅大气的正式场合演讲/汇报演示文稿——零外链可翻页 HTML（亮暗双主题）+ 版式保真可编辑 16:9 PPTX；核心=版式·排版·色彩·内容组织；三模式（A 演示·每屏一主张 / B 研究·咨询密排 / C 架构·图为王）× 9 风格。Do NOT use for 纯代码工程、非报告类网页或应用开发、视频/图片生成、直接改写已有 Word/PPT 源文件本身。"
+description: "Use when 用户要做报告、演示、汇报、PPT、slides、deck、路演，或写研究报告、分析报告、咨询报告、白皮书、调研、评测、对标、经营分析、复盘、项目汇报、商务/HTML/网页报告，或做架构图、拓扑图、流程图、泳道图、方案图，或把材料做成可视化报告并导出 HTML/PPT/PPTX，或优化排版/版式/配色/图文布局，或要快速模式/fast/直接生成/一键出稿/少问一句。TopPPT HTML：正式商务演示双交付——零外链可翻页 HTML（日常上台）+ 高保真可编辑 16:9 PPTX（按需）；MD3 式密度克制；核心=版式·排版·色彩·内容；三模式（A 演示 / B 研究 / C 架构）× 9 风格。Do NOT use for 纯代码工程、非报告类网页或应用开发、视频/图片生成、直接改写已有 Word/PPT 源文件本身。"
 license: MIT
 compatibility: "Python 3 stdlib for HTML generation; Node >=18 + pptxgenjs for PPTX; optional playwright for browser regression / theme captures."
 metadata:
-  version: "0.1.9"
+  version: "0.1.11"
   author: TopMindspace
 ---
 # TopPPT HTML
 
-**让 idea 飞，好想法被看见。** 面向**演讲与正式场合**的优雅、大气的演示文稿——非 gadget 堆砌、非咨询 dump 默认。三种模式、两种交付：**单文件 HTML**（可翻页演示）+ **版式保真可编辑 PPTX**（**B 通道** `build_pptx.js` 为唯一交付；**A 通道**仅预览/`cross_verify`）。同源 `REPORT_MODEL`。设计对齐 MD3，执行克制；研究模式可对齐咨询密度，但**克制优先**——少装饰、一屏一重心。
+**让 idea 飞，好想法被看见。** 为**演示报告 / 正式商务演示**而生——**HTML + PPT 双交付**（日常 HTML 等同幻灯片；需要时再导出高保真可编辑 PPTX）。非 gadget、非咨询 dump 默认。同源 `REPORT_MODEL`；**B 通道** `build_pptx.js` 交付，**A** 仅预览/`cross_verify`。参考 MD3：合适信息密度、克制文字/图形/颜色；少装饰、一屏一重心。
 
 ## Gate 0 · 先给参考图（**标准模式**硬门禁）
 
@@ -35,7 +35,7 @@ metadata:
 | 篇幅 | A=10 / B=12 / C=6 | |
 | format | **html only**（**仅当用户要 PPT/PPTX 才开** B 通道） | |
 
-**跳过** Gate 0/六项/完整大纲。**仍须** 最小大纲→模型单写→strict 0/0→`quality_gate --deliver`（反截断、图表多样性、Mode A craft 不降）。读面 L0+L1（A/Fast 可加 L1.5）；代码一律 `extract_snippet`。一行宣布「Fast 选用：…」→ playbook §二轻量链；声明已跳过参考图。**标准模式**仍强制 Gate 0 + 六项。
+**跳过** Gate 0/六项/完整大纲。**仍须** 最小大纲→模型单写→strict 0/0→`quality_gate --deliver`（反截断、图表多样、Mode A craft 不降）。L0+L1（A/Fast 可加 L1.5）；代码一律 `extract_snippet`。一行宣布「Fast 选用：…」→ playbook §二；声明已跳过参考图。**标准模式**仍强制 Gate 0 + 六项。
 
 ## 唯一入口流程
 
@@ -114,20 +114,30 @@ metadata:
 
 ## 交付物与验收
 
-- **HTML**：单文件零外链、可翻页可演示、每页一屏高；header 工具栏（T 亮暗 / 9 风格即切 / P 预览 / H 指引 / F 全屏 / B 折叠）。
-- **PPTX（B 通道交付）**：`extract_model` → `build_pptx.js` → `validate_pptx --strict`；16:9 全原生可编辑。**A 通道不交付**（仅预览 / `cross_verify`；细则 playbook §九）。
-- **验收**：HTML strict 0/0；含 PPTX 再加 PPTX 0/0；失败给**定向修复指引**。
-- **交付说明**：`quality_gate.py --deliver`（含 PPTX 带 `--pptx/--model`；子门禁并行）出七要素，缺一 FAIL——勿手拼。
+- **HTML**：零外链可翻页、每页一屏。**Header 工具栏**（样张专页）：
+
+| 键 | 控件 | 要点 |
+|----|------|------|
+| **T** | 亮暗 | 按文件记忆；同步 `REPORT_MODEL.theme` |
+| 9 套 | 风格 | 实时换肤；交付前写回 `REPORT_MODEL.style` |
+| **P** | 预览 PPTX | 页序列 + 精导提示词 |
+| **H** | 生成指引 | 双通道说明（=?） |
+| **F**/**B** | 全屏/折叠 | 沉浸演示；迷你条记忆 |
+| 方向键/**Esc** | 翻页/关模态 | PPT 式翻页 |
+
+> 改风格/主题后同步 `REPORT_MODEL` 并重跑校验（不重写）。
+- **PPTX（B 通道）**：`extract_model` → `build_pptx.js` → `validate_pptx --strict`；16:9 可编辑。**A 不交付**（仅预览/`cross_verify`；playbook §九）。
+- **验收**：HTML strict 0/0；含 PPTX 再加 PPTX 0/0；失败给定向修复指引。
+- **交付说明**：`quality_gate.py --deliver`（PPTX 带 `--pptx/--model`）出七要素，缺一 FAIL。
 
 ## 版本口径
 
-包 semver（现 0.1.9）≠ 布局 schema 线（layout-constants / model-schema 的 version，现 `0.1`）；patch 不抬 schema。
+包 semver（现 0.1.11）≠ schema 线（layout-constants / model-schema，现 `0.1`）；patch 不抬 schema。
 
 ## 环境依赖
 
-- **零依赖可用**：HTML 生成与全部 Python 脚本只用 **Python 标准库**。
-- **PPTX 精导**：另需 Node + pptxgenjs（安装与 `TOP_PPT_NODE_EXE`/`TOP_PPT_NODE_PATH` 探测细节见 `pptx-export.md` 环境备注，探测失败会打印指引）。
-- **硬门禁**：标签泄漏/空页/极偏图/简单大图 → `scripts/layout-constants.json`（qualityGates）+ `failure-modes.md`。
-- **可选**：浏览器页高/裁切真值、参考图重生成需 playwright（`regression.py` 自动探测，缺失即跳过）。
-- **一键回归**：`scripts/regression.py`——模板/常量/schema/运行时/示例改动后必跑。
-- **技能自检**：`audit_skill.py`（体积/披露/Gate 0/内容重复）· `audit_docs.py`（§ 引用 + 任务路由可解析）· `audit_styles.py`（9 风格 × 亮暗 token 与对比度）· `audit_css.py`（CSS 类覆盖率 · 报告制）。
+- **零依赖可用**：HTML 与全部 Python 脚本仅用标准库。
+- **PPTX 精导**：Node + pptxgenjs（`TOP_PPT_NODE_EXE`/`TOP_PPT_NODE_PATH`；见 `pptx-export.md`）。
+- **硬门禁**：标签泄漏/空页/极偏图/简单大图 → `layout-constants.json` + `failure-modes.md`。
+- **可选**：页高/裁切与参考图重生成需 playwright（`regression.py` 探测，缺失跳过）。
+- **回归 / 自检**：`regression.py`；`audit_skill/docs/styles/css.py`。