@topmindspace/tms-skills 0.1.9 → 0.1.11

package/top-ppt-html/assets/examples/2026-09-26-topmind-tms-skills-showcase.html

@@ -941,9 +941,9 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
 <section class="band band--fit" id="cover">
   <div class="wrap">
     <div class="shead rv">
-      <div class="t-eyebrow">产品介绍 · 2026-09-26</div>
+      <div class="t-eyebrow">产品介绍 · 2026-09-26 · v0.1.11</div>
       <h1 class="t-display shead__title">TopMind × tms-skills</h1>
-      <p class="t-lead shead__desc">让 idea 飞 · 把好想法做成可上台的演示文稿</p>
+      <p class="t-lead shead__desc">HTML + PPT 双交付 · 为正式商务演示而生</p>
     </div>
   </div>
 </section>
@@ -952,23 +952,23 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
   <div class="wrap">
     <div class="shead rv"><div class="t-eyebrow">目录</div>
       <h2 class="t-h1 shead__title">报告大纲</h2></div>
-    <ol class="agenda rv">      <li class="agenda__i"><a class="agenda__a" href="#s1"><span class="agenda__n">01</span><span><span class="agenda__t">TopMind 定位</span><div class="agenda__d">知识工作空间</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s2"><span class="agenda__n">02</span><span><span class="agenda__t">tms-skills 概览</span><div class="agenda__d">可安装技能 monorepo</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s3"><span class="agenda__n">03</span><span><span class="agenda__t">top-ppt-html 特色</span><div class="agenda__d">HTML + 保真 PPTX</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s4"><span class="agenda__n">04</span><span><span class="agenda__t">三模式契约</span><div class="agenda__d">演示 · 研究 · 架构</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s5"><span class="agenda__n">05</span><span><span class="agenda__t">风格与主题</span><div class="agenda__d">九风格 × 亮暗</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s6"><span class="agenda__n">06</span><span><span class="agenda__t">质量门禁</span><div class="agenda__d">strict 0/0 交付</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s7"><span class="agenda__n">07</span><span><span class="agenda__t">Fast Mode</span><div class="agenda__d">少问一句 · 工艺不降</div></span></a></li></ol>
+    <ol class="agenda rv">      <li class="agenda__i"><a class="agenda__a" href="#s1"><span class="agenda__n">01</span><span><span class="agenda__t">市面 PPT 技能很多，为何还要 top-ppt-html</span><div class="agenda__d">01 · 为什么是我们</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s2"><span class="agenda__n">02</span><span><span class="agenda__t">tms-skills：整仓可安装的智能体技能</span><div class="agenda__d">02 · tms-skills</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s3"><span class="agenda__n">03</span><span><span class="agenda__t">双交付：HTML 即演示，PPTX 可继续编</span><div class="agenda__d">03 · top-ppt-html</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s4"><span class="agenda__n">04</span><span><span class="agenda__t">模式先定后写：A 演示 · B 研究 · C 架构</span><div class="agenda__d">04 · 三模式</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s5"><span class="agenda__n">05</span><span><span class="agenda__t">交付面三件套：演示 HTML · 可编辑 PPTX · 门禁说明</span><div class="agenda__d">05 · 图表工艺</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s6"><span class="agenda__n">06</span><span><span class="agenda__t">0.1.x 能力累进：定位与样张随版本加厚</span><div class="agenda__d">05 · 图表工艺</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s7"><span class="agenda__n">07</span><span><span class="agenda__t">九风格开场即可见，亮暗主题一键贯穿</span><div class="agenda__d">06 · 风格主题</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s8"><span class="agenda__n">08</span><span><span class="agenda__t">散装出稿止步，strict 0/0 才算交付</span><div class="agenda__d">07 · 质量门禁</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s9"><span class="agenda__n">09</span><span><span class="agenda__t">从想法到上台：工艺链路如何把主张垫实</span><div class="agenda__d">07 · 质量门禁</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s10"><span class="agenda__n">10</span><span><span class="agenda__t">核图优先：排名对比用横向条，一眼分出轻重</span><div class="agenda__d">05 · 图表工艺</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s11"><span class="agenda__n">11</span><span><span class="agenda__t">打开 HTML 即演示：顶栏快捷操作一览</span><div class="agenda__d">08 · Header 工具栏</div></span></a></li>      <li class="agenda__i"><a class="agenda__a" href="#s12"><span class="agenda__n">12</span><span><span class="agenda__t">Fast Mode：跳过问询，不跳过工艺</span><div class="agenda__d">09 · Fast Mode</div></span></a></li></ol>
   </div>
 </section>
 
 <section class="band" id="s1" data-skel="P4" data-page-type="points">
   <div class="wrap">
     <div class="shead rv">
-      <div class="t-eyebrow">01 · TopMind</div>
-      <h2 class="t-h1 shead__title">TopMind：让 idea 飞的知识工作空间</h2>
+      <div class="t-eyebrow">01 · 为什么是我们</div>
+      <h2 class="t-h1 shead__title">市面 PPT 技能很多，为何还要 top-ppt-html</h2>
     </div>
     <div class="grid g-2 rv a-start">
       <div class="card"><div class="card__hd"><h3 class="t-h3">要点一</h3></div>
-        <ul class="ul"><li><strong>工作空间，不是工具箱。</strong>把想法、材料与产出收拢在同一语境，减少搬运与失真</li><li><strong>知识工艺，克制表达。</strong>强调结构、证据与可读性——让好想法被认真看见</li></ul></div>
+        <ul class="ul"><li><strong>正式商务演示，不是花哨 gadget。</strong>为演示报告与上台汇报而生——直观、大气、可编辑，而非装饰堆砌</li><li><strong>HTML + PPT 双交付。</strong>日常用 HTML 等同幻灯片演示；需要时再导出高保真可编辑 PPTX</li></ul></div>
       <div class="card"><div class="card__hd"><h3 class="t-h3">要点二</h3></div>
-        <ul class="ul"><li><strong>面向正式场合。</strong>演讲、汇报、路演：材料要上台，不只是堆在文档里</li></ul></div>
+        <ul class="ul"><li><strong>信息密度与克制（参考 MD3）。</strong>整体空间布局合适、文字/图形/形状/颜色克制——读得清、站得住</li></ul></div>
     </div>
-    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">TopMind 把有想法推进到可上台——工艺在结构，不在堆砌。</span></div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">产出即上台：同源模型保证 HTML 与 PPTX 一致，图表带数据可核对。</span></div>
   </div>
 </section>
 
@@ -994,18 +994,29 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
   <div class="wrap">
     <div class="shead rv">
       <div class="t-eyebrow">03 · top-ppt-html</div>
-      <h2 class="t-h1 shead__title">一屏一主张：可翻页 HTML，保真可编辑 PPTX</h2>
+      <h2 class="t-h1 shead__title">双交付：HTML 即演示，PPTX 可继续编</h2>
     </div>
     <div class="grid g-side rv a-start">
-      <div class="stack gap-4"><ul class="ul"><li><strong>模型单写。</strong>只填 REPORT_MODEL，禁手改 HTML 正文</li><li><strong>三模式 × 九风格。</strong>演示 / 研究 / 架构各有契约</li><li><strong>门禁闭环。</strong>validate --strict 0/0 才交付</li></ul></div>
-      <div class="fig"><div class="fig__cap">交付关注点（示意权重）</div>
+      <div class="stack gap-4"><ul class="ul"><li><strong>日常 HTML 上台。</strong>单文件可翻页，等同幻灯片；亮暗与九风格顶栏即切</li><li><strong>需要时再出 PPT。</strong>版式保真可编辑 PPTX；图表数据可标注、可核对</li><li><strong>克制的商务面。</strong>参考 MD3：合适信息密度，少装饰、一屏一主张</li></ul></div>
+      <div class="fig"><div class="fig__cap">工艺关注点（产品强调 · 示意权重）</div>
       <svg class="chart" data-chart="bar" viewBox="0 0 560 220">
-        <!-- 数据以 REPORT_MODEL.chart 为准；复杂图形用 extract_snippet --chart bar -->
-        <text x="280" y="110" text-anchor="middle" class="f-txt3" font-size="12">bar · 见模型数据</text>
-      </svg>
+      <line x1="46" y1="170" x2="540" y2="170" class="s-bds" stroke-width="1"/>
+      <rect data-anim="grow" x="92.0" y="58.0" width="56.1" height="112.0" rx="6" class="f-s3"><title>版式 32</title></rect>
+      <text data-anim="fade" x="120.0" y="192" text-anchor="middle" class="f-txt3" font-size="11">版式</text>
+      <text data-anim="fade" x="120.0" y="50.0" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">32</text>
+      <rect data-anim="grow" x="211.9" y="72.0" width="56.1" height="98.0" rx="6" class="f-s3"><title>排版 28</title></rect>
+      <text data-anim="fade" x="240.0" y="192" text-anchor="middle" class="f-txt3" font-size="11">排版</text>
+      <text data-anim="fade" x="240.0" y="64.0" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">28</text>
+      <rect data-anim="grow" x="331.9" y="107.0" width="56.1" height="63.0" rx="6" class="f-acc"><title>色彩 18</title></rect>
+      <text data-anim="fade" x="360.0" y="192" text-anchor="middle" class="f-txt3" font-size="11">色彩</text>
+      <text data-anim="fade" x="360.0" y="99.0" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">18</text>
+      <rect data-anim="grow" x="451.9" y="93.0" width="56.1" height="77.0" rx="6" class="f-acc"><title>内容 22</title></rect>
+      <text data-anim="fade" x="480.0" y="192" text-anchor="middle" class="f-txt3" font-size="11">内容</text>
+      <text data-anim="fade" x="480.0" y="85.0" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">22</text>
+    </svg>
       </div>
     </div>
-    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">工艺是版式、排版、色彩与内容组织——图表图标克制配文。</span></div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">工艺在结构与密度，不在 gadget——正式场合演讲/汇报才是主场。</span></div>
   </div>
 </section>
 
@@ -1027,10 +1038,70 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
   </div>
 </section>
 
-<section class="band" id="s5" data-skel="P2" data-page-type="metrics" band--top>
+<section class="band" id="s5" data-skel="P3" data-page-type="donut">
   <div class="wrap">
     <div class="shead rv">
-      <div class="t-eyebrow">05 · 风格主题</div>
+      <div class="t-eyebrow">05 · 图表工艺</div>
+      <h2 class="t-h1 shead__title">交付面三件套：演示 HTML · 可编辑 PPTX · 门禁说明</h2>
+    </div>
+    <div class="grid g-side rv a-start">
+      <div class="fig" style="text-align:center"><div class="fig__cap">构成占比</div>
+      <svg class="chart" data-chart="donut" viewBox="0 0 560 220">
+      <g transform="translate(210,40)">
+        <circle cx="70" cy="70" r="54" class="f-none s-bds" stroke-width="15"/>
+        <circle data-sweep data-circ="339.3" data-p="0.4000" cx="70" cy="70" r="54" class="f-none s-acc" stroke-width="15" stroke-dasharray="135.7 203.6" stroke-linecap="butt" transform="rotate(-90.0 70 70)"><title>可翻页 HTML 40%</title></circle>
+        <circle data-sweep data-circ="339.3" data-p="0.3500" cx="70" cy="70" r="54" class="f-none s-txt2" stroke-width="15" stroke-dasharray="118.8 220.5" stroke-linecap="butt" transform="rotate(54.0 70 70)"><title>保真 PPTX 35%</title></circle>
+        <circle data-sweep data-circ="339.3" data-p="0.2500" cx="70" cy="70" r="54" class="f-none s-txt3" stroke-width="15" stroke-dasharray="84.8 254.5" stroke-linecap="butt" transform="rotate(180.0 70 70)"><title>质检交付说明 25%</title></circle>
+        <text x="70" y="68" text-anchor="middle" class="f-txt" font-size="22" font-weight="600" data-count="40" data-suffix="%">40%</text>
+        <text x="70" y="88" text-anchor="middle" class="f-txt3" font-size="11">同源模型</text>
+      </g>
+    </svg>
+      </div>
+      <div class="stack gap-4"><h3 class="t-h3">构成明细</h3>
+        <ul class="ul">        <li><strong>可翻页 HTML。</strong>40（40%）</li>        <li><strong>保真 PPTX。</strong>35（35%）</li>        <li><strong>质检交付说明。</strong>25（25%）</li></ul>
+      </div>
+    </div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">双通道不是二选一：HTML 上台演示，PPTX 可继续编辑，门禁证明可交付。</span></div>
+  </div>
+</section>
+
+<section class="band" id="s6" data-skel="P8" data-page-type="bar">
+  <div class="wrap">
+    <div class="shead rv">
+      <div class="t-eyebrow">05 · 图表工艺</div>
+      <h2 class="t-h1 shead__title">0.1.x 能力累进：定位与样张随版本加厚</h2>
+    </div>
+    <div class="grid g-side rv a-start">
+      <div class="fig"><div class="fig__cap">0.1.x 能力累进：定位与样张随版本加厚</div>
+      <svg class="chart" data-chart="line" viewBox="0 0 560 220">
+      <line x1="46" y1="180" x2="540" y2="180" class="s-bds" stroke-width="1"/>
+      <line x1="46" y1="130" x2="540" y2="130" class="s-bds" stroke-width="1" stroke-dasharray="3 5"/>
+      <line x1="46" y1="80" x2="540" y2="80" class="s-bds" stroke-width="1" stroke-dasharray="3 5"/>
+      <path data-draw d="M60.0,100.0 L175.0,80.0 L290.0,70.0 L405.0,60.0 L520.0,50.0" class="f-none s-acc" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
+      <circle cx="60.0" cy="100.0" r="4" class="f-acc"><title>0.1.7 · 8项</title></circle>
+      <text x="60.0" y="200" text-anchor="middle" class="f-txt3" font-size="11">0.1.7</text>
+      <circle cx="175.0" cy="80.0" r="4" class="f-acc"><title>0.1.8 · 10项</title></circle>
+      <text x="175.0" y="200" text-anchor="middle" class="f-txt3" font-size="11">0.1.8</text>
+      <circle cx="290.0" cy="70.0" r="4" class="f-acc"><title>0.1.9 · 11项</title></circle>
+      <text x="290.0" y="200" text-anchor="middle" class="f-txt3" font-size="11">0.1.9</text>
+      <circle cx="405.0" cy="60.0" r="4" class="f-acc"><title>0.1.10 · 12项</title></circle>
+      <text x="405.0" y="200" text-anchor="middle" class="f-txt3" font-size="11">0.1.10</text>
+      <circle cx="520.0" cy="50.0" r="4" class="f-acc"><title>0.1.11 · 13项</title></circle>
+      <text x="520.0" y="200" text-anchor="middle" class="f-txt3" font-size="11">0.1.11</text>
+    </svg>
+      </div>
+      <div class="stack gap-4"><h3 class="t-h3">怎么读这张图</h3>
+        <ul class="ul"><li><strong>真实版本线。</strong>对应 CHANGELOG 已合并能力，非虚构增速</li><li><strong>本版强化。</strong>差异化定位 · 双交付叙事 · README 总览精简</li></ul>
+      </div>
+    </div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">质量与叙事同步推进——版本线把门禁、样张与定位一起写清。</span></div>
+  </div>
+</section>
+
+<section class="band" id="s7" data-skel="P2" data-page-type="metrics" band--top>
+  <div class="wrap">
+    <div class="shead rv">
+      <div class="t-eyebrow">06 · 风格主题</div>
       <h2 class="t-h1 shead__title">九风格开场即可见，亮暗主题一键贯穿</h2>
     </div>
     <div class="grid g-4 rv a-start">
@@ -1043,10 +1114,10 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
   </div>
 </section>
 
-<section class="band" id="s6" data-skel="P4" data-page-type="comparison">
+<section class="band" id="s8" data-skel="P4" data-page-type="comparison">
   <div class="wrap">
     <div class="shead rv">
-      <div class="t-eyebrow">06 · 质量门禁</div>
+      <div class="t-eyebrow">07 · 质量门禁</div>
       <h2 class="t-h1 shead__title">散装出稿止步，strict 0/0 才算交付</h2>
     </div>
     <div class="grid g-half g-2 rv a-start">
@@ -1059,10 +1130,102 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
   </div>
 </section>
 
-<section class="band" id="s7" data-skel="P2" data-page-type="timeline">
+<section class="band" id="s9" data-skel="P8" data-page-type="bar">
+  <div class="wrap">
+    <div class="shead rv">
+      <div class="t-eyebrow">07 · 质量门禁</div>
+      <h2 class="t-h1 shead__title">从想法到上台：工艺链路如何把主张垫实</h2>
+    </div>
+    <div class="grid g-side rv a-start">
+      <div class="fig"><div class="fig__cap">从想法到上台：工艺链路如何把主张垫实</div>
+      <svg class="chart" data-chart="waterfall" viewBox="0 0 560 220">
+      <line x1="40" y1="190" x2="540" y2="190" class="s-bds" stroke-width="1"/>
+      <rect data-anim="grow" x="68.4" y="159.1" width="44.9" height="30.9" rx="5" class="f-s3"/>
+      <text x="90.8" y="151.1" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">20pt</text>
+      <text x="90.8" y="206" text-anchor="middle" class="f-txt3" font-size="11">意图</text>
+      <rect data-anim="grow" x="150.0" y="135.9" width="44.9" height="23.2" rx="5" class="f-acc"/>
+      <text x="172.5" y="127.9" text-anchor="middle" class="f-acc" font-size="12" font-weight="600">+15pt</text>
+      <text x="172.5" y="206" text-anchor="middle" class="f-txt3" font-size="11">模式</text>
+      <line x1="131.7" y1="159.1" x2="150.0" y2="159.1" class="s-bds" stroke-width="1" stroke-dasharray="3 3"/>
+      <rect data-anim="grow" x="231.7" y="97.2" width="44.9" height="38.6" rx="5" class="f-acc"/>
+      <text x="254.2" y="89.2" text-anchor="middle" class="f-acc" font-size="12" font-weight="600">+25pt</text>
+      <text x="254.2" y="206" text-anchor="middle" class="f-txt3" font-size="11">模型</text>
+      <line x1="213.3" y1="135.9" x2="231.7" y2="135.9" class="s-bds" stroke-width="1" stroke-dasharray="3 3"/>
+      <rect data-anim="grow" x="313.4" y="74.1" width="44.9" height="23.2" rx="5" class="f-acc"/>
+      <text x="335.8" y="66.1" text-anchor="middle" class="f-acc" font-size="12" font-weight="600">+15pt</text>
+      <text x="335.8" y="206" text-anchor="middle" class="f-txt3" font-size="11">图表</text>
+      <line x1="295.0" y1="97.2" x2="313.4" y2="97.2" class="s-bds" stroke-width="1" stroke-dasharray="3 3"/>
+      <rect data-anim="grow" x="395.0" y="50.9" width="44.9" height="23.2" rx="5" class="f-acc"/>
+      <text x="417.5" y="42.9" text-anchor="middle" class="f-acc" font-size="12" font-weight="600">+15pt</text>
+      <text x="417.5" y="206" text-anchor="middle" class="f-txt3" font-size="11">门禁</text>
+      <line x1="376.7" y1="74.1" x2="395.0" y2="74.1" class="s-bds" stroke-width="1" stroke-dasharray="3 3"/>
+      <rect data-anim="grow" x="476.7" y="50.9" width="44.9" height="139.1" rx="5" class="f-acc"/>
+      <text x="499.2" y="42.9" text-anchor="middle" class="f-txt2" font-size="12" font-weight="600">90pt</text>
+      <text x="499.2" y="206" text-anchor="middle" class="f-txt3" font-size="11">上台</text>
+    </svg>
+      </div>
+      <div class="stack gap-4"><h3 class="t-h3">怎么读这张图</h3>
+        <ul class="ul"><li><strong>意图定模式。</strong>路演→A · 调研→B · 拓扑→C</li><li><strong>门禁收口。</strong>strict 0/0 前不算交付</li></ul>
+      </div>
+    </div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">上台交付 = 模式契约 + 模型单写 + 多样图表 + 门禁收口。</span></div>
+  </div>
+</section>
+
+<section class="band" id="s10" data-skel="P1" data-page-type="split">
   <div class="wrap">
     <div class="shead rv">
-      <div class="t-eyebrow">07 · Fast Mode</div>
+      <div class="t-eyebrow">05 · 图表工艺</div>
+      <h2 class="t-h1 shead__title">核图优先：排名对比用横向条，一眼分出轻重</h2>
+    </div>
+    <div class="grid g-side rv a-start">
+      <div class="stack gap-4"><ul class="ul"><li><strong>产品已交付能力。</strong>五项均为当前线真实能力，不是预测</li><li><strong>图表选型。</strong>谁大谁小 → hbar；趋势 → line；占比 → donut</li></ul></div>
+      <div class="fig"><div class="fig__cap">能力就绪（当前发布线）</div>
+      <svg class="chart" data-chart="hbar" viewBox="0 0 560 220">
+      <text x="0" y="30.0" class="f-txt2" font-size="12">strict 0/0</text>
+      <rect x="130" y="20.0" width="340" height="15" rx="7.5" class="f-s2"/>
+      <rect data-anim="grow" x="130" y="20.0" width="340.0" height="15" rx="7.5" class="f-acc"><title>strict 0/0 100%</title></rect>
+      <text x="482" y="32.0" class="f-txt" font-size="12" font-weight="600">100%</text>
+      <text x="0" y="66.0" class="f-txt2" font-size="12">三模式契约</text>
+      <rect x="130" y="56.0" width="340" height="15" rx="7.5" class="f-s2"/>
+      <rect data-anim="grow" x="130" y="56.0" width="340.0" height="15" rx="7.5" class="f-acc"><title>三模式契约 100%</title></rect>
+      <text x="482" y="68.0" class="f-txt" font-size="12" font-weight="600">100%</text>
+      <text x="0" y="102.0" class="f-txt2" font-size="12">九风格皮肤</text>
+      <rect x="130" y="92.0" width="340" height="15" rx="7.5" class="f-s2"/>
+      <rect data-anim="grow" x="130" y="92.0" width="340.0" height="15" rx="7.5" class="f-acc"><title>九风格皮肤 100%</title></rect>
+      <text x="482" y="104.0" class="f-txt" font-size="12" font-weight="600">100%</text>
+      <text x="0" y="138.0" class="f-txt2" font-size="12">双通道交付</text>
+      <rect x="130" y="128.0" width="340" height="15" rx="7.5" class="f-s2"/>
+      <rect data-anim="grow" x="130" y="128.0" width="340.0" height="15" rx="7.5" class="f-acc"><title>双通道交付 100%</title></rect>
+      <text x="482" y="140.0" class="f-txt" font-size="12" font-weight="600">100%</text>
+      <text x="0" y="174.0" class="f-txt2" font-size="12">Fast Mode</text>
+      <rect x="130" y="164.0" width="340" height="15" rx="7.5" class="f-s2"/>
+      <rect data-anim="grow" x="130" y="164.0" width="340.0" height="15" rx="7.5" class="f-acc"><title>Fast Mode 100%</title></rect>
+      <text x="482" y="176.0" class="f-txt" font-size="12" font-weight="600">100%</text>
+    </svg>
+      </div>
+    </div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">说服力来自可核对的能力清单与图表多样性，而非单张柱图凑数。</span></div>
+    <div class="footnote">口径：能力就绪度 = 当前发布线已具备并写入文档/门禁的能力（均为 100%）。</div>
+  </div>
+</section>
+
+<section class="band" id="s11" data-skel="P8" data-page-type="table">
+  <div class="wrap">
+    <div class="shead rv">
+      <div class="t-eyebrow">08 · Header 工具栏</div>
+      <h2 class="t-h1 shead__title">打开 HTML 即演示：顶栏快捷操作一览</h2>
+    </div>
+    <div class="tbl-wrap rv"><table><thead><tr><th>控件</th><th>快捷键</th><th>行为</th></tr></thead><tbody><tr><td>亮暗主题</td><td>T</td><td>浅色外发 / 深色大屏；按文件记忆；同步 REPORT_MODEL.theme</td></tr><tr><td>风格选择</td><td>9 套</td><td>九风格实时切换（纯视觉）；交付前 data-style = REPORT_MODEL.style</td></tr><tr><td>预览 PPTX</td><td>P</td><td>页序列所见即所得；可复制提示词回对话走精导</td></tr><tr><td>PPT 生成指引</td><td>H</td><td>双通道说明与环境依赖；与 ? 帮助同效</td></tr><tr><td>全屏</td><td>F</td><td>沉浸演示（requestFullscreen）；图标随进入/退出切换</td></tr><tr><td>收起工具栏</td><td>B</td><td>折叠为品牌标+展开迷你条；锚点自适应并按文件记忆</td></tr></tbody></table></div>
+    <div class="sowhat rv"><span class="sowhat__k">So what</span><span class="sowhat__v">工具栏不是装饰——演示、预览、换肤与交付指引同一顶栏完成。</span></div>
+    <div class="footnote">另：方向键翻页 · Esc 关闭模态 · 风格/主题变更后须重跑校验</div>
+  </div>
+</section>
+
+<section class="band" id="s12" data-skel="P2" data-page-type="timeline">
+  <div class="wrap">
+    <div class="shead rv">
+      <div class="t-eyebrow">09 · Fast Mode</div>
       <h2 class="t-h1 shead__title">Fast Mode：跳过问询，不跳过工艺</h2>
     </div>
     <div class="fig rv"><div class="tl">
@@ -1079,7 +1242,7 @@ background:var(--surface-2);border-radius:6px;padding:2px 7px;color:var(--text)}
     <div class="shead rv"><div class="t-eyebrow">下一步</div>
       <h2 class="t-h1 shead__title">让好想法被看见</h2></div>
     <div class="grid g-3 rv a-start">
-<ul class="ul"><li><strong>装技能。</strong>npx @topmindspace/tms-skills install top-ppt-html</li><li><strong>看样张。</strong>assets/examples · style-gallery.html</li><li><strong>上台交付。</strong>HTML 可翻页 · PPTX 可编辑 · strict 0/0</li></ul>
+<ul class="ul"><li><strong>装技能。</strong>npx @topmindspace/tms-skills install top-ppt-html</li><li><strong>看样张。</strong>Showcase · style-gallery · 顶栏 T/P/H/F/B</li><li><strong>双交付上台。</strong>HTML 日常演示 · PPTX 按需导出 · strict 0/0</li></ul>
     </div>
   </div>
 </section>
@@ -1703,66 +1866,91 @@ window.REPORT_MODEL = {
   "style": "business-blue",
   "theme": "light",
   "title": "TopMind × tms-skills",
-  "subtitle": "让 idea 飞 · 把好想法做成可上台的演示文稿",
-  "meta": "产品介绍 · 2026-09-26",
+  "subtitle": "HTML + PPT 双交付 · 为正式商务演示而生",
+  "meta": "产品介绍 · 2026-09-26 · v0.1.11",
   "agenda": [
     [
       "01",
-      "TopMind 定位",
-      "知识工作空间"
+      "市面 PPT 技能很多，为何还要 top-ppt-html",
+      "01 · 为什么是我们"
     ],
     [
       "02",
-      "tms-skills 概览",
-      "可安装技能 monorepo"
+      "tms-skills：整仓可安装的智能体技能",
+      "02 · tms-skills"
     ],
     [
       "03",
-      "top-ppt-html 特色",
-      "HTML + 保真 PPTX"
+      "双交付：HTML 即演示，PPTX 可继续编",
+      "03 · top-ppt-html"
     ],
     [
       "04",
-      "三模式契约",
-      "演示 · 研究 · 架构"
+      "模式先定后写：A 演示 · B 研究 · C 架构",
+      "04 · 三模式"
     ],
     [
       "05",
-      "风格与主题",
-      "九风格 × 亮暗"
+      "交付面三件套：演示 HTML · 可编辑 PPTX · 门禁说明",
+      "05 · 图表工艺"
     ],
     [
       "06",
-      "质量门禁",
-      "strict 0/0 交付"
+      "0.1.x 能力累进：定位与样张随版本加厚",
+      "05 · 图表工艺"
     ],
     [
       "07",
-      "Fast Mode",
-      "少问一句 · 工艺不降"
+      "九风格开场即可见，亮暗主题一键贯穿",
+      "06 · 风格主题"
+    ],
+    [
+      "08",
+      "散装出稿止步，strict 0/0 才算交付",
+      "07 · 质量门禁"
+    ],
+    [
+      "09",
+      "从想法到上台：工艺链路如何把主张垫实",
+      "07 · 质量门禁"
+    ],
+    [
+      "10",
+      "核图优先：排名对比用横向条，一眼分出轻重",
+      "05 · 图表工艺"
+    ],
+    [
+      "11",
+      "打开 HTML 即演示：顶栏快捷操作一览",
+      "08 · Header 工具栏"
+    ],
+    [
+      "12",
+      "Fast Mode：跳过问询，不跳过工艺",
+      "09 · Fast Mode"
     ]
   ],
   "sections": [
     {
       "type": "points",
       "layoutPreset": "P4",
-      "eyebrow": "01 · TopMind",
-      "title": "TopMind：让 idea 飞的知识工作空间",
+      "eyebrow": "01 · 为什么是我们",
+      "title": "市面 PPT 技能很多，为何还要 top-ppt-html",
       "points": [
         [
-          "工作空间，不是工具箱",
-          "把想法、材料与产出收拢在同一语境，减少搬运与失真"
+          "正式商务演示，不是花哨 gadget",
+          "为演示报告与上台汇报而生——直观、大气、可编辑，而非装饰堆砌"
         ],
         [
-          "知识工艺，克制表达",
-          "强调结构、证据与可读性——让好想法被认真看见"
+          "HTML + PPT 双交付",
+          "日常用 HTML 等同幻灯片演示；需要时再导出高保真可编辑 PPTX"
         ],
         [
-          "面向正式场合",
-          "演讲、汇报、路演：材料要上台，不只是堆在文档里"
+          "信息密度与克制（参考 MD3）",
+          "整体空间布局合适、文字/图形/形状/颜色克制——读得清、站得住"
         ]
       ],
-      "soWhat": "TopMind 把有想法推进到可上台——工艺在结构，不在堆砌。"
+      "soWhat": "产出即上台：同源模型保证 HTML 与 PPTX 一致，图表带数据可核对。"
     },
     {
       "type": "cards",
@@ -1817,26 +2005,26 @@ window.REPORT_MODEL = {
       "type": "split",
       "layoutPreset": "P1",
       "eyebrow": "03 · top-ppt-html",
-      "title": "一屏一主张：可翻页 HTML，保真可编辑 PPTX",
+      "title": "双交付：HTML 即演示，PPTX 可继续编",
       "left": {
         "points": [
           [
-            "模型单写",
-            "只填 REPORT_MODEL，禁手改 HTML 正文"
+            "日常 HTML 上台",
+            "单文件可翻页，等同幻灯片；亮暗与九风格顶栏即切"
           ],
           [
-            "三模式 × 九风格",
-            "演示 / 研究 / 架构各有契约"
+            "需要时再出 PPT",
+            "版式保真可编辑 PPTX；图表数据可标注、可核对"
           ],
           [
-            "门禁闭环",
-            "validate --strict 0/0 才交付"
+            "克制的商务面",
+            "参考 MD3：合适信息密度，少装饰、一屏一主张"
           ]
         ]
       },
       "right": {
         "type": "bar",
-        "cap": "交付关注点（示意权重）",
+        "cap": "工艺关注点（产品强调 · 示意权重）",
         "labels": [
           "版式",
           "排版",
@@ -1853,7 +2041,7 @@ window.REPORT_MODEL = {
         "max": 40,
         "dataTable": "notes"
       },
-      "soWhat": "工艺是版式、排版、色彩与内容组织——图表图标克制配文。"
+      "soWhat": "工艺在结构与密度，不在 gadget——正式场合演讲/汇报才是主场。"
     },
     {
       "type": "cards",
@@ -1904,10 +2092,71 @@ window.REPORT_MODEL = {
       ],
       "footnote": "意图线索：路演/汇报/演讲 → A；调研/对标 → B；拓扑/方案图 → C"
     },
+    {
+      "type": "donut",
+      "layoutPreset": "P3",
+      "eyebrow": "05 · 图表工艺",
+      "title": "交付面三件套：演示 HTML · 可编辑 PPTX · 门禁说明",
+      "chart": {
+        "labels": [
+          "可翻页 HTML",
+          "保真 PPTX",
+          "质检交付说明"
+        ],
+        "values": [
+          40,
+          35,
+          25
+        ],
+        "unit": "%",
+        "centerLabel": "同源模型",
+        "dataTable": "notes"
+      },
+      "note": "口径：产品交付构成示意——三者同源 REPORT_MODEL，缺一则不算完整上台交付。",
+      "soWhat": "双通道不是二选一：HTML 上台演示，PPTX 可继续编辑，门禁证明可交付。"
+    },
+    {
+      "type": "bar",
+      "layoutPreset": "P7",
+      "eyebrow": "05 · 图表工艺",
+      "title": "0.1.x 能力累进：定位与样张随版本加厚",
+      "chart": {
+        "type": "line",
+        "labels": [
+          "0.1.7",
+          "0.1.8",
+          "0.1.9",
+          "0.1.10",
+          "0.1.11"
+        ],
+        "values": [
+          8,
+          10,
+          11,
+          12,
+          13
+        ],
+        "unit": "项",
+        "max": 14,
+        "dataTable": "notes"
+      },
+      "points": [
+        [
+          "真实版本线",
+          "对应 CHANGELOG 已合并能力，非虚构增速"
+        ],
+        [
+          "本版强化",
+          "差异化定位 · 双交付叙事 · README 总览精简"
+        ]
+      ],
+      "note": "口径：累计能力项为发布说明中的能力主题计数（示意刻度），用于展示版本节奏。",
+      "soWhat": "质量与叙事同步推进——版本线把门禁、样张与定位一起写清。"
+    },
     {
       "type": "metrics",
       "layoutPreset": "P2",
-      "eyebrow": "05 · 风格主题",
+      "eyebrow": "06 · 风格主题",
       "title": "九风格开场即可见，亮暗主题一键贯穿",
       "metrics": [
         [
@@ -1932,7 +2181,7 @@ window.REPORT_MODEL = {
     {
       "type": "comparison",
       "layoutPreset": "P4",
-      "eyebrow": "06 · 质量门禁",
+      "eyebrow": "07 · 质量门禁",
       "title": "散装出稿止步，strict 0/0 才算交付",
       "left": {
         "title": "散装路径 · 风险",
@@ -1970,10 +2219,137 @@ window.REPORT_MODEL = {
       },
       "verdict": "反截断、图表多样性、runtime SHA——门禁是交付的一部分。"
     },
+    {
+      "type": "bar",
+      "layoutPreset": "P6",
+      "eyebrow": "07 · 质量门禁",
+      "title": "从想法到上台：工艺链路如何把主张垫实",
+      "chart": {
+        "type": "waterfall",
+        "labels": [
+          "意图",
+          "模式",
+          "模型",
+          "图表",
+          "门禁",
+          "上台"
+        ],
+        "values": [
+          20,
+          15,
+          25,
+          15,
+          15,
+          90
+        ],
+        "unit": "pt",
+        "dataTable": "notes"
+      },
+      "points": [
+        [
+          "意图定模式",
+          "路演→A · 调研→B · 拓扑→C"
+        ],
+        [
+          "门禁收口",
+          "strict 0/0 前不算交付"
+        ]
+      ],
+      "note": "口径：链路贡献为工艺阶段示意分，用于说明流程而非外部 KPI。",
+      "soWhat": "上台交付 = 模式契约 + 模型单写 + 多样图表 + 门禁收口。"
+    },
+    {
+      "type": "split",
+      "layoutPreset": "P1",
+      "eyebrow": "05 · 图表工艺",
+      "title": "核图优先：排名对比用横向条，一眼分出轻重",
+      "left": {
+        "points": [
+          [
+            "产品已交付能力",
+            "五项均为当前线真实能力，不是预测"
+          ],
+          [
+            "图表选型",
+            "谁大谁小 → hbar；趋势 → line；占比 → donut"
+          ]
+        ]
+      },
+      "right": {
+        "type": "hbar",
+        "cap": "能力就绪（当前发布线）",
+        "labels": [
+          "strict 0/0",
+          "三模式契约",
+          "九风格皮肤",
+          "双通道交付",
+          "Fast Mode"
+        ],
+        "values": [
+          100,
+          100,
+          100,
+          100,
+          100
+        ],
+        "max": 100,
+        "unit": "%",
+        "dataTable": "notes"
+      },
+      "footnote": "口径：能力就绪度 = 当前发布线已具备并写入文档/门禁的能力（均为 100%）。",
+      "soWhat": "说服力来自可核对的能力清单与图表多样性，而非单张柱图凑数。"
+    },
+    {
+      "type": "table",
+      "layoutPreset": "P8",
+      "eyebrow": "08 · Header 工具栏",
+      "title": "打开 HTML 即演示：顶栏快捷操作一览",
+      "table": {
+        "head": [
+          "控件",
+          "快捷键",
+          "行为"
+        ],
+        "rows": [
+          [
+            "亮暗主题",
+            "T",
+            "浅色外发 / 深色大屏；按文件记忆；同步 REPORT_MODEL.theme"
+          ],
+          [
+            "风格选择",
+            "9 套",
+            "九风格实时切换（纯视觉）；交付前 data-style = REPORT_MODEL.style"
+          ],
+          [
+            "预览 PPTX",
+            "P",
+            "页序列所见即所得；可复制提示词回对话走精导"
+          ],
+          [
+            "PPT 生成指引",
+            "H",
+            "双通道说明与环境依赖；与 ? 帮助同效"
+          ],
+          [
+            "全屏",
+            "F",
+            "沉浸演示（requestFullscreen）；图标随进入/退出切换"
+          ],
+          [
+            "收起工具栏",
+            "B",
+            "折叠为品牌标+展开迷你条；锚点自适应并按文件记忆"
+          ]
+        ]
+      },
+      "footnote": "另：方向键翻页 · Esc 关闭模态 · 风格/主题变更后须重跑校验",
+      "soWhat": "工具栏不是装饰——演示、预览、换肤与交付指引同一顶栏完成。"
+    },
     {
       "type": "timeline",
       "layoutPreset": "P6",
-      "eyebrow": "07 · Fast Mode",
+      "eyebrow": "09 · Fast Mode",
       "title": "Fast Mode：跳过问询，不跳过工艺",
       "phases": [
         [
@@ -2004,11 +2380,11 @@ window.REPORT_MODEL = {
       ],
       [
         "看样张",
-        "assets/examples · style-gallery.html"
+        "Showcase · style-gallery · 顶栏 T/P/H/F/B"
       ],
       [
-        "上台交付",
-        "HTML 可翻页 · PPTX 可编辑 · strict 0/0"
+        "双交付上台",
+        "HTML 日常演示 · PPTX 按需导出 · strict 0/0"
       ]
     ]
   }