annotatable-html 0.0.0-stage → 1.38.3

package/templates/annotatable.theme.css

@@ -0,0 +1,28 @@
+/* annotatable.theme.css —— 主题自定义文件
+ * 「annotatable new」生成文档时会自动应用本文件：
+ *   1. 下面的 :root 变量块会替换文档的默认配色；
+ *   2. 其余 CSS 会追加到文档样式末尾（可覆盖任何默认样式）。
+ * 不需要主题时删除本文件即可恢复默认。 */
+
+:root{
+  --paper:#f6f4ee;       /* 页面背景 */
+  --card:#ffffff;        /* 文档卡片背景 */
+  --ink:#2b2721;         /* 正文颜色 */
+  --muted:#8a8375;       /* 次要文字 */
+  --line:#e7e2d6;        /* 边框线 */
+  --accent:#b45309;      /* 主题色（按钮/标题/强调） */
+  --accent-soft:#fdf3e3; /* 主题色浅底 */
+  --hl:#fde047;          /* 划线高亮 */
+  --hl2:#fb923c;         /* 有批语的高亮 */
+  --danger:#dc2626;      /* 危险操作 */
+
+  /* 版式挂钩（v1.17.0，可选）：只写想改的，其余保持模板默认 */
+  /* --wrap-max:980px; */  /* 正文版心最大宽度 */
+  /* --root-fs:16px; */    /* 根字号（rem 基准，全局缩放） */
+  /* --lh:1.75; */         /* 正文行高 */
+  /* --font-body:"Segoe UI",system-ui,sans-serif; */  /* 正文字体栈 */
+  /* --font-head:var(--font-body); */                /* 标题字体栈 */
+}
+
+/* ↓↓↓ 额外自定义样式写在下面（会覆盖默认样式）↓↓↓ */
+/* 想可视化调参：运行 annotatable studio 打开主题工坊（实时预览+一键保存）。 */

package/templates/commands/html4agent.md

@@ -0,0 +1,37 @@
+---
+description: HTML4agent：生成可批注 HTML（划线批注+AI流式回答+版本回滚），值守监听批注
+---
+参数 $ARGUMENTS：首次使用 = 文档需求（主题与内容要求）；之后 = 可省略（值守中自动接批注），或写批注反馈。
+
+本命令是**值守循环工作流**，按对话阶段执行对应一节（只执行当前阶段，不要越步）：
+
+## 阶段一：生成并开始值守（用户给出文档需求，或本会话尚未生成文档时）
+
+1. 目录无 AGENTS.md → 运行 `npx annotatable-html init`（已存在自动跳过）；
+2. 运行 `npx annotatable-html new <名称>.html`（名称从需求推断，中文即可）；
+3. 把内容写进生成的 html 的各 section；**不要动**批注层脚本与 annotations-store 区块；
+4. 起伴随服务器（后台任务，会话期间保持）：`npx annotatable-html serve <文档所在目录> --port 8980`；
+5. 有浏览器操作能力 → 自己打开 `http://localhost:8980/<文档名>.html`；没有 → 把 URL 给用户；
+6. 挂监听（后台任务）：`npx annotatable-html poll <文档路径>`；
+7. 告知用户：「打开这个地址直接划线批注，我在值守——批完不用喊我，回答会在页面上实时长出来。」
+
+记住文档路径（后续阶段要用）。
+
+## 阶段二：值守应答（POLL_HIT 唤醒，或用户直接给批注反馈时）
+
+1. 运行 `npx annotatable-html read <文档路径>` 列出待回应批注（含对话线）；
+   （无待回应批注：温和告知"还没看到新批注"；继续值守。）
+2. 逐条处理 status:"new" 的批注：通读 thread 全部轮次与原文上下文。批语是祈使句（「这里改成X」）→ 走 edit（见规则）；疑问句 → 流式回答：
+   - `npx annotatable-html reply <文档路径> --stream '<第一段>' --id <批注id>`（开始，必带 --id）；
+   - `npx annotatable-html reply <文档路径> --stream '<后续段>'`（续段）；
+   - `npx annotatable-html reply <文档路径> --stream-end '<完整全文>'`（收尾）；
+   - **退出码 4 = 用户按了⏹，5 = 批注已被删除：两种都立即停手，不要重试、不要续写**；
+   - 长回答（>5 行）若适合分阶教学 → 改用 `npx annotatable-html answer` 写教学卡，reply 只留摘要；
+3. 一轮答完**重新挂 poll**（后台任务）。除非用户喊停，值守持续整个会话。
+
+## 规则
+
+- 批语含「暂存/留着」→ 划线内容进 ANSWER.md 暂存区；含「沉淀(到：文件名)」→ 整理进 docs/Learn/；
+- 每次写回 rev+1 并维护快照（reply/edit 工具已封装；手工改务必遵守）；
+- 起不了 serve 时才让用户双击文件打开（file:// 兜底）：告知用 Edge/Chrome 打开，同文件夹绑过一次后其余文档自动互联；其余流程不变；
+- 目录存在 AGENTS.md 时以其细节为准；用户明确要"普通 html"时才输出不带批注层的文件。

package/templates/theme-studio.html

@@ -0,0 +1,330 @@
+<!DOCTYPE html>
+<!-- annotatable 主题工坊（v1.17.0）
+ * 由 `annotatable studio` 经 GET /__annot/studio 内存直出（core.studioHtml 装配）。
+ * 装配点：下方 style 块内的模板 CSS 标记、JS 里的模板全文与版本号占位。
+ * 实时预览 = 模板副本 + 工坊主题烤入（浏览器端按 lib/core.js applyTheme 同规则），
+ * 所见即所得；保存走 POST /__annot/theme（未从 CLI 启动时降级为下载文件）。 -->
+<html lang="zh-CN">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>主题工坊 · annotatable 可批注模板</title>
+<style id="studio-tpl-css">
+/*__TPL_CSS__*/
+</style>
+<style>
+/* 工坊自身骨架（st- 前缀，避免与模板类名相撞） */
+html,body{height:100%}
+body.st-body{margin:0;display:flex;flex-direction:column;background:#22242a;color:#e8e5df;
+  font:14px/1.6 "Segoe UI",system-ui,"PingFang SC","Microsoft YaHei",sans-serif;overflow:hidden}
+.st-head{display:flex;align-items:baseline;gap:12px;padding:10px 16px;background:#1a1c21;border-bottom:1px solid #33363e}
+.st-head h1{font-size:15px;margin:0;font-weight:700;color:#f0ede7}
+.st-head .st-sub{font-size:12px;color:#9a968e}
+.st-main{flex:1;display:flex;min-height:0}
+.st-rail{width:320px;min-width:320px;overflow-y:auto;padding:14px 16px 24px;background:#26282f;border-right:1px solid #33363e}
+.st-group{margin-bottom:18px}
+.st-group>h2{font-size:12.5px;margin:0 0 8px;color:#c9a86b;letter-spacing:.08em;font-weight:700}
+.st-chips{display:flex;gap:6px;flex-wrap:wrap}
+.st-chip{cursor:pointer;border:1px solid #4a4d56;border-radius:8px;padding:4px 10px;font-size:12px;
+  color:#d8d5cf;background:#2e3138}
+.st-chip:hover{border-color:#c9a86b}
+.st-chip.on{border-color:#c9a86b;color:#f0e7d3;background:#3a3327}
+.st-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}
+.st-cv{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#c9c6bf}
+.st-cv input[type=color]{width:34px;height:24px;border:1px solid #4a4d56;border-radius:5px;padding:0;background:none;cursor:pointer}
+.st-row{display:flex;align-items:center;gap:8px;margin:7px 0;font-size:12.5px;color:#c9c6bf}
+.st-row label{min-width:60px}
+.st-row input[type=range]{flex:1;accent-color:#c9a86b}
+.st-row .st-val{min-width:52px;text-align:right;color:#9a968e;font-variant-numeric:tabular-nums}
+.st-row select,.st-row input[type=text]{flex:1;background:#2e3138;color:#e2dfd9;border:1px solid #4a4d56;
+  border-radius:6px;padding:4px 6px;font-size:12.5px}
+.st-btns{display:flex;flex-direction:column;gap:8px}
+.st-btn{cursor:pointer;border:0;border-radius:8px;padding:9px 12px;font-size:13.5px;font-weight:700;text-align:center}
+.st-btn.primary{background:#c9a86b;color:#241d10}
+.st-btn.primary:hover{background:#d8b87a}
+.st-btn.ghost{background:#2e3138;color:#d8d5cf;border:1px solid #4a4d56}
+.st-btn.ghost:hover{border-color:#c9a86b}
+.st-note{font-size:12px;color:#8e8a82;line-height:1.7;margin-top:10px}
+.st-css{width:100%;height:110px;background:#1d1f24;color:#a8c4a0;border:1px solid #33363e;border-radius:6px;
+  font:11.5px/1.5 ui-monospace,Consolas,monospace;padding:8px;resize:vertical;white-space:pre}
+.st-prev{flex:1;display:flex;min-width:0;background:#fff}
+.st-prev iframe{border:0;width:100%;height:100%;background:#fff}
+.st-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:#2e3138;color:#f0ede7;
+  border:1px solid #c9a86b;border-radius:10px;padding:10px 18px;font-size:13.5px;display:none;z-index:99;
+  box-shadow:0 6px 24px rgba(0,0,0,.4)}
+@media print{ body.st-body .st-rail,body.st-body .st-head{display:none} }
+</style>
+</head>
+<body class="st-body">
+<div class="st-head">
+  <h1>🎨 主题工坊</h1>
+  <span class="st-sub">可批注模板可视化定制 · 左边调、右边看 · 保存后 new / md / inject 自动应用（<span id="st-ver"></span>）</span>
+</div>
+<div class="st-main">
+  <aside class="st-rail">
+    <div class="st-group">
+      <h2>配色预设</h2>
+      <div class="st-chips" id="st-presets"></div>
+    </div>
+    <div class="st-group">
+      <h2>颜色</h2>
+      <div class="st-grid" id="st-colors"></div>
+    </div>
+    <div class="st-group">
+      <h2>字体</h2>
+      <div class="st-row"><label>正文字体</label><select id="st-fbody"></select></div>
+      <div class="st-row" id="st-fbody-custom" style="display:none"><label>自定义</label><input type="text" id="st-fbody-x" placeholder='"Georgia", serif'></div>
+      <div class="st-row"><label>标题字体</label><select id="st-fhead"></select></div>
+      <div class="st-row" id="st-fhead-custom" style="display:none"><label>自定义</label><input type="text" id="st-fhead-x" placeholder='"Georgia", serif'></div>
+    </div>
+    <div class="st-group">
+      <h2>版式</h2>
+      <div class="st-row"><label>根字号</label><input type="range" id="st-fs" min="13" max="20" step="0.5"><span class="st-val" id="st-fs-v"></span></div>
+      <div class="st-row"><label>行高</label><input type="range" id="st-lh" min="1.4" max="2.4" step="0.05"><span class="st-val" id="st-lh-v"></span></div>
+      <div class="st-row"><label>页面宽度</label><input type="range" id="st-w" min="640" max="1400" step="20"><span class="st-val" id="st-w-v"></span></div>
+    </div>
+    <div class="st-group st-btns">
+      <button class="st-btn primary" id="st-save">💾 保存到当前目录</button>
+      <button class="st-btn primary" id="st-save-g">🌍 设为全局默认</button>
+      <button class="st-btn ghost" id="st-dl">⬇ 下载 annotatable.theme.css</button>
+      <button class="st-btn ghost" id="st-reset">↺ 恢复默认</button>
+    </div>
+    <div class="st-group">
+      <h2>theme.css 预览</h2>
+      <textarea class="st-css" id="st-cssout" readonly></textarea>
+    </div>
+    <p class="st-note">
+      · 右侧即真实模板渲染：批注、划线、🧭 导航窗格都能直接试；窗格默认泊位，拖出/缩放可验证页面宽度与导航让位互不干扰。<br>
+      · 「保存到当前目录」写入 annotatable.theme.css；「设为全局默认」写入 ~/.annotatable/theme.css（目录级优先于全局）。
+    </p>
+  </aside>
+  <div class="st-prev"><iframe id="st-frame" title="模板实时预览"></iframe></div>
+</div>
+<div class="st-toast" id="st-toast"></div>
+<script>
+'use strict';
+/* 当前模板全文（由 core.studioHtml 装配；脚本闭串已在源码层转义，防本块提前闭合） */
+var TPL_SRC = "__TPL_SRC__";
+
+/* 预览示例正文（标题供 🧭 导航窗格抓取；mark.annot 观察划线配色） */
+var SAMPLE_HTML = [
+'<p class="kicker">示例预览</p>',
+'<h1>示例文档标题</h1>',
+'<p class="meta">主题工坊示例 · 用于观察配色、字体与版式效果</p>',
+'<p>这是一段用于观察<mark class="annot">正文颜色与字体</mark>的示例文字。段落间距、行高在这里最直观，改动滑杆后稍候片刻即可看到效果。</p>',
+'<h2>一、排版元素</h2>',
+'<p>正文直铺在页面底色上（无白卡片），留白交给版心。<strong>强调文字</strong>与<code>行内代码</code>随主题色联动。</p>',
+'<blockquote>引用块：观察左边线与底色。</blockquote>',
+'<h3>表格与代码</h3>',
+'<div class="table-wrap"><table><thead><tr><th>项目</th><th>观察点</th></tr></thead><tbody>',
+'<tr><td>表格</td><td>边线颜色、表头底色</td></tr>',
+'<tr><td>代码块</td><td>底色与等宽字体</td></tr>',
+'</tbody></table></div>',
+'<pre><code>const theme = "studio"; // 观察代码块底色</code></pre>',
+'<h2>二、批注层外观</h2>',
+'<p>划线高亮：<mark class="annot">黄色为普通划线</mark>；<mark class="annot">橙色代表已有批语</mark>。试着在预览里选中一段文字划线，看看高亮是否顺眼。</p>',
+'<ul><li>列表项观察行距与标记颜色</li><li>第二项</li></ul>',
+'<p>页面宽度滑杆与 🧭 导航窗格互不干扰：窗格泊位时正文自动让位左移，拖窄、拖宽、拖出窗格都可以试。</p>'
+].join('\n');
+
+/* ---------- 状态 ---------- */
+function parseRoot(src) {
+  var m = src.match(/:root\s*\{([^}]*)\}/);
+  var vars = {};
+  if (m) m[1].replace(/\/\*[\s\S]*?\*\//g, '').split(';').forEach(function (kv) {
+    var i = kv.indexOf(':');
+    if (i > 0) vars[kv.slice(0, i).trim()] = kv.slice(i + 1).trim();
+  });
+  return vars;
+}
+var DEFAULTS = parseRoot(TPL_SRC);
+var state = {};
+Object.keys(DEFAULTS).forEach(function (k) { state[k] = DEFAULTS[k]; });
+
+var COLOR_VARS = [
+  ['--bg', '页面底色'], ['--bg2', '次表面'], ['--card', '卡片'], ['--accent', '强调色'],
+  ['--text', '正文'], ['--border', '边线'], ['--hl', '划线高亮'], ['--hl2', '批语高亮'], ['--danger', '危险']
+];
+var FONT_OPTS = [
+  ['', '默认（跟随模板）', ''],
+  ['hei', '黑体（系统无衬线）', '"Microsoft YaHei","PingFang SC","HarmonyOS Sans SC",sans-serif'],
+  ['song', '宋体（衬线）', '"Noto Serif SC","Source Han Serif SC","SimSun",serif'],
+  ['kai', '楷体', '"Kaiti SC","STKaiti","KaiTi",serif'],
+  ['mono', '等宽', 'ui-monospace,Consolas,"Courier New",monospace'],
+  ['x', '自定义…', null]
+];
+var PRESETS = [
+  ['暖白棕（默认）', {}],
+  ['冷灰蓝', { '--bg': '#f3f5f8', '--bg2': '#e7ebf1', '--card': '#ffffff', '--accent': '#4a6fa5', '--text': '#2a3440', '--border': '#d3dae2', '--hl': '#ffd54f', '--hl2': '#ff9e40', '--danger': '#d32f2f' }],
+  ['护眼米绿', { '--bg': '#e9efe2', '--bg2': '#dce5d1', '--card': '#f7faf3', '--accent': '#4a7c59', '--text': '#2f3b2f', '--border': '#c8d6c2', '--hl': '#ffe082', '--hl2': '#ffb74d', '--danger': '#c62828' }],
+  ['暗色', { '--bg': '#1e2025', '--bg2': '#26292f', '--card': '#2b2e35', '--accent': '#d8a657', '--text': '#e6e2d8', '--border': '#3a3e47', '--hl': '#a98f2f', '--hl2': '#b05f34', '--danger': '#e05252' }]
+];
+
+/* ---------- 控件 ---------- */
+function el(id) { return document.getElementById(id); }
+function buildColors() {
+  var g = el('st-colors');
+  COLOR_VARS.forEach(function (cv) {
+    var d = document.createElement('label');
+    d.className = 'st-cv';
+    var inp = document.createElement('input');
+    inp.type = 'color'; inp.id = 'c' + cv[0].slice(1);
+    var cap = document.createElement('span'); cap.textContent = cv[1];
+    d.appendChild(inp); d.appendChild(cap); g.appendChild(d);
+    inp.addEventListener('input', function () { state[cv[0]] = inp.value; markPreset(null); onChange(); });
+  });
+}
+function buildFonts(selId, customRowId, customId, varName) {
+  var sel = el(selId), row = el(customRowId), txt = el(customId);
+  FONT_OPTS.forEach(function (fo) {
+    var o = document.createElement('option');
+    o.value = fo[0]; o.textContent = fo[1];
+    sel.appendChild(o);
+  });
+  function syncSel() {
+    var cur = state[varName] || '';
+    if (cur === DEFAULTS[varName]) { sel.value = ''; row.style.display = 'none'; return; }
+    var hit = FONT_OPTS.filter(function (fo) { return fo[2] === cur; })[0];
+    if (hit) { sel.value = hit[0]; row.style.display = 'none'; }
+    else { sel.value = 'x'; row.style.display = 'flex'; txt.value = cur; }
+  }
+  sel.addEventListener('change', function () {
+    var fo = FONT_OPTS.filter(function (f) { return f[0] === sel.value; })[0];
+    if (fo && fo[2]) { state[varName] = fo[2]; row.style.display = 'none'; }
+    else if (fo) { state[varName] = ''; row.style.display = 'none'; }
+    else { row.style.display = 'flex'; txt.focus(); }
+    onChange();
+  });
+  txt.addEventListener('input', function () { state[varName] = txt.value.trim(); onChange(); });
+  syncSel();
+  return syncSel;
+}
+function buildSlider(id, vid, varName, unit) {
+  var s = el(id), v = el(vid);
+  var def = parseFloat(DEFAULTS[varName]) || 0;
+  if (def < parseFloat(s.min) || def > parseFloat(s.max)) { s.min = Math.floor(def); s.max = Math.ceil(def) + 2; }
+  s.value = def; v.textContent = def + unit;
+  s.addEventListener('input', function () {
+    state[varName] = s.value + unit;
+    v.textContent = s.value + unit;
+    onChange();
+  });
+  return function sync() { def = parseFloat(DEFAULTS[varName]) || 0; s.value = def; v.textContent = def + unit; };
+}
+var syncFonts = [], syncSliders = [];
+function buildPresets() {
+  var box = el('st-presets');
+  PRESETS.forEach(function (pr, ix) {
+    var b = document.createElement('button');
+    b.type = 'button'; b.className = 'st-chip'; b.textContent = pr[0];
+    b.addEventListener('click', function () {
+      COLOR_VARS.forEach(function (cv) { state[cv[0]] = pr[1][cv[0]] || DEFAULTS[cv[0]]; });
+      markPreset(ix); syncColorInputs(); onChange();
+    });
+    box.appendChild(b);
+  });
+  markPreset(0);
+}
+function markPreset(ix) {
+  var chips = el('st-presets').children;
+  for (var i = 0; i < chips.length; i++) chips[i].classList.toggle('on', i === ix);
+}
+function syncColorInputs() {
+  COLOR_VARS.forEach(function (cv) {
+    var inp = el('c' + cv[0].slice(1));
+    var v = state[cv[0]] || '';
+    if (/^#[0-9a-fA-F]{6}$/.test(v)) inp.value = v;
+  });
+}
+
+/* ---------- 主题 CSS 与预览 ---------- */
+function themeCss() {
+  var diffs = [];
+  Object.keys(DEFAULTS).forEach(function (k) {
+    if (state[k] !== DEFAULTS[k] && state[k] !== '') diffs.push('  ' + k + ':' + state[k] + ';');
+  });
+  if (!diffs.length) return '';
+  return ':root{\n' + diffs.join('\n') + '\n}\n';
+}
+function buildPreviewDoc() {
+  var doc = TPL_SRC;
+  var css = themeCss();
+  if (css) {
+    var rm = css.match(/:root\s*\{[^}]*\}/);
+    if (rm) doc = doc.replace(/:root\s*\{[^}]*\}/, function () { return rm[0]; });
+    var rest = rm ? css.replace(rm[0], '') : css;
+    if (rest.trim()) doc = doc.replace('</style>', function () { return rest + '\n</style>'; });
+  }
+  doc = doc.replace(/<article>[\s\S]*?<\/article>/, function () { return '<article>\n' + SAMPLE_HTML + '\n  </article>'; });
+  doc = doc.replace(/<title>[\s\S]*?<\/title>/, '<title>主题工坊 · 预览</title>');
+  var iS = doc.lastIndexOf('<script>');
+  doc = doc.slice(0, iS + 8) + '\nwindow.__ANNOT_NO_BINDNUDGE__=1;' + doc.slice(iS + 8);
+  return doc;
+}
+var rebuildTimer = null;
+function onChange() {
+  el('st-cssout').value = themeCss() || '（当前与默认一致，保存空主题即可恢复默认）';
+  clearTimeout(rebuildTimer);
+  rebuildTimer = setTimeout(function () { el('st-frame').srcdoc = buildPreviewDoc(); }, 400);
+}
+
+/* ---------- 保存 ---------- */
+function toast(msg) {
+  var t = el('st-toast');
+  t.textContent = msg; t.style.display = 'block';
+  clearTimeout(t._h);
+  t._h = setTimeout(function () { t.style.display = 'none'; }, 2600);
+}
+function saveTheme(scope) {
+  var css = themeCss();
+  fetch('/__annot/theme', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ scope: scope, css: css })
+  }).then(function (r) {
+    if (!r.ok) return r.text().then(function (tx) { throw new Error(tx); });
+    return r.json();
+  }).then(function (o) {
+    toast(scope === 'global' ? '✅ 已设为全局默认（' + o.path + '）' : '✅ 已保存到当前目录（' + o.path + '）');
+  }).catch(function () {
+    if (!css) { toast('当前与默认一致，无需保存'); return; }
+    download(css);   // 未从 CLI 启动（或服务未开）→ 下载兜底
+    toast('服务不可达，已转为下载 annotatable.theme.css，请放进文档目录');
+  });
+}
+function download(css) {
+  var a = document.createElement('a');
+  a.href = URL.createObjectURL(new Blob([css], { type: 'text/css' }));
+  a.download = 'annotatable.theme.css';
+  document.body.appendChild(a); a.click(); a.remove();
+  setTimeout(function () { URL.revokeObjectURL(a.href); }, 3000);
+}
+
+/* ---------- 启动 ---------- */
+buildPresets();
+buildColors();
+syncColorInputs();
+syncFonts.push(buildFonts('st-fbody', 'st-fbody-custom', 'st-fbody-x', '--font-body'));
+syncFonts.push(buildFonts('st-fhead', 'st-fhead-custom', 'st-fhead-x', '--font-head'));
+syncSliders.push(buildSlider('st-fs', 'st-fs-v', '--root-fs', 'px'));
+syncSliders.push(buildSlider('st-lh', 'st-lh-v', '--lh', ''));
+syncSliders.push(buildSlider('st-w', 'st-w-v', '--wrap-max', 'px'));
+el('st-save').addEventListener('click', function () { saveTheme('cwd'); });
+el('st-save-g').addEventListener('click', function () { saveTheme('global'); });
+el('st-dl').addEventListener('click', function () {
+  var css = themeCss();
+  if (!css) { toast('当前与默认一致，无需下载'); return; }
+  download(css);
+});
+el('st-reset').addEventListener('click', function () {
+  Object.keys(DEFAULTS).forEach(function (k) { state[k] = DEFAULTS[k]; });
+  syncColorInputs(); syncFonts.forEach(function (f) { f(); }); syncSliders.forEach(function (f) { f(); });
+  markPreset(0); onChange();
+  toast('已恢复模板默认外观');
+});
+el('st-ver').textContent = '当前模板内置版 __PKG_VER__';
+el('st-frame').srcdoc = buildPreviewDoc();
+el('st-cssout').value = '（当前与默认一致，保存空主题即可恢复默认）';
+</script>
+</body>
+</html>