@openprd/cli 0.1.1 → 0.1.8

package/src/html-artifacts.js

@@ -1,30 +1,15 @@
 import path from 'node:path';
-import { pathToFileURL } from 'node:url';
 import { spawn } from 'node:child_process';
+import { buildReviewFallbackPanelItems, CHANGE_SUMMARY_VERBS, USER_CHANGE_SUMMARY_GUIDE } from './change-summary.js';
 import { cjoin, writeText } from './fs-utils.js';
+import { escapeHtml, listMarkup, slugify } from './html-artifact-utils.js';
+export { learningPackagePaths, renderLearningArtifact } from './learning-html-artifact.js';
 import { renderQualityEvalArtifact as renderQualityEvalArtifactV2 } from './quality-html-artifact.js';
 
-function escapeHtml(value) {
-  return String(value ?? '')
-    .replace(/&/g, '&')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#39;');
-}
-
 function leafName(value) {
   return String(value ?? '').split(/[\\/]/).filter(Boolean).at(-1) ?? String(value ?? '');
 }
 
-function listMarkup(items, emptyText = '暂无') {
-  const normalized = Array.isArray(items) ? items.filter(Boolean) : [];
-  if (normalized.length === 0) {
-    return `<li class="empty">${escapeHtml(emptyText)}</li>`;
-  }
-  return normalized.map((item) => `<li>${escapeHtml(item)}</li>`).join('');
-}
-
 function card(title, body) {
   return `
     <section class="card">
@@ -347,15 +332,6 @@ function metricCard(title, metric, subtext) {
   `);
 }
 
-function slugify(value, fallback = 'artifact') {
-  const slug = String(value ?? '')
-    .toLowerCase()
-    .replace(/[^a-z0-9]+/g, '-')
-    .replace(/^-+|-+$/g, '')
-    .slice(0, 80);
-  return slug || fallback;
-}
-
 function formatClarificationQuestion(item) {
   return `
     <div class="qa-item ${item.reason === 'missing' ? 'warning' : ''}">
@@ -415,6 +391,7 @@ export function buildReviewExportPayload(snapshot) {
       '确认主流程与失败路径',
       '确认关键风险与开放问题',
     ],
+    summaryStyle: USER_CHANGE_SUMMARY_GUIDE,
     sectionKeys: Object.keys(sections),
     presentationContract: presentation.contract,
     presentationFeedback: presentation.violations,
@@ -424,6 +401,7 @@ export function buildReviewExportPayload(snapshot) {
 
 const REVIEW_PRESENTATION_CONTRACT = {
   intent: '这些限制用于反馈给 Agent 重新概括，不由 HTML 模板截断原文。',
+  summaryStyle: USER_CHANGE_SUMMARY_GUIDE,
   expectedDataShape: {
     reviewPresentation: {
       diagram: {
@@ -448,16 +426,16 @@ const REVIEW_PRESENTATION_CONTRACT = {
       ],
       panels: {
         flow: [
-          { summary: '15 字内标签', detail: '用户能读懂的一句话说明' },
+          USER_CHANGE_SUMMARY_GUIDE.panelExamples.flow,
         ],
         function: [
-          { summary: '15 字内标签', detail: '用户能读懂的一句话说明' },
+          USER_CHANGE_SUMMARY_GUIDE.panelExamples.function,
         ],
         guardrail: [
-          { summary: '15 字内标签', detail: '用户能读懂的一句话说明' },
+          USER_CHANGE_SUMMARY_GUIDE.panelExamples.guardrail,
         ],
         risk: [
-          { summary: '15 字内标签', detail: '用户能读懂的一句话说明' },
+          USER_CHANGE_SUMMARY_GUIDE.panelExamples.risk,
         ],
       },
     },
@@ -482,18 +460,23 @@ const REVIEW_PRESENTATION_CONTRACT = {
       area: '四个评审卡片',
       target: '重点摘要胶囊',
       maxChars: 15,
-      action: '请重写成短标签，保留结论，不要堆叠长句。',
+      action: `请重写成短标签，优先使用 ${CHANGE_SUMMARY_VERBS.join(' / ')} 这类用户能一眼看懂的动作词，再补必要对象。`,
     },
     {
       id: 'review-panel-detail-format',
       area: '四个评审卡片',
       target: '明细分点',
       format: '- **摘要内容**：明细一句话',
-      action: '请写入 reviewPresentation.panels.<kind>[]，把每个明细改写为“加粗短摘要 + 一句话说明”，方便用户先扫重点再读细节。',
+      action: `请写入 reviewPresentation.panels.<kind>[]，把每个明细改写为“加粗短摘要 + 一句话说明”，短摘要优先使用 ${CHANGE_SUMMARY_VERBS.join(' / ')}。`,
     },
   ],
 };
 
+function reviewPanelExample(kind) {
+  const example = USER_CHANGE_SUMMARY_GUIDE.panelExamples[kind] ?? { summary: '15字内标签', detail: '一句话说明' };
+  return `{ "summary": "${example.summary}", "detail": "${example.detail}" }`;
+}
+
 export function buildReviewPresentationFeedback(snapshot) {
   const sectionsData = snapshot.sections ?? {};
   const violations = [];
@@ -565,7 +548,7 @@ export function buildReviewPresentationFeedback(snapshot) {
         jsonPath: `reviewPresentation.panels.${group.kind}[${index}]`,
         expectedFormat: '- **摘要内容**：明细一句话',
         currentText: normalizedReviewVisibleText(group.items[index]),
-        action: `请写入 reviewPresentation.panels.${group.kind}[${index}]，格式为 { "summary": "15 字内标签", "detail": "一句话说明" }。`,
+        action: `请写入 reviewPresentation.panels.${group.kind}[${index}]，格式例如 ${reviewPanelExample(group.kind)}。`,
       });
     });
     panelItems.forEach((item, index) => {
@@ -586,7 +569,7 @@ export function buildReviewPresentationFeedback(snapshot) {
         jsonPath: `reviewPresentation.panels.${group.kind}[${index}]`,
         expectedFormat: '- **摘要内容**：明细一句话',
         currentText: normalizedReviewVisibleText(item),
-        action: `请写入 reviewPresentation.panels.${group.kind}[${index}]，格式为 { "summary": "15 字内标签", "detail": "一句话说明" }。`,
+        action: `请写入 reviewPresentation.panels.${group.kind}[${index}]，格式例如 ${reviewPanelExample(group.kind)}。`,
       });
     });
   });
@@ -671,6 +654,12 @@ function hasReviewPresentationPanel(snapshot, kind) {
   return Array.isArray(reviewPresentationPanels(snapshot)[kind]);
 }
 
+function reviewPanelFallbackType(kind) {
+  if (kind === 'function') return '新增';
+  if (kind === 'flow') return '优化';
+  return '调整';
+}
+
 function normalizeReviewPresentationPanelItem(item) {
   if (item && typeof item === 'object' && !Array.isArray(item)) {
     const summary = normalizedReviewVisibleText(item.summary ?? item.title ?? item.label);
@@ -686,7 +675,10 @@ function normalizeReviewPresentationPanelItem(item) {
 function reviewPresentationPanelItems(snapshot, kind, fallbackItems) {
   const items = reviewPresentationPanels(snapshot)[kind];
   if (!Array.isArray(items)) {
-    return fallbackItems;
+    return buildReviewFallbackPanelItems(fallbackItems, {
+      fallbackType: reviewPanelFallbackType(kind),
+      summaryMaxLength: 15,
+    });
   }
   return items.map(normalizeReviewPresentationPanelItem).filter(Boolean);
 }
@@ -784,6 +776,46 @@ function reviewIcon(kind) {
   return `<span class="review-icon review-icon-${escapeHtml(kind)}" aria-hidden="true">${icons[kind] ?? icons.flow}</span>`;
 }
 
+function reviewReleaseStatusLabel(status) {
+  const labels = {
+    draft: '草稿版本',
+    current: '当前版本',
+    released: '已发布版本',
+  };
+  return labels[status] ?? '版本轨道';
+}
+
+function resolveReviewProjectRelease(projectRelease) {
+  if (!projectRelease || typeof projectRelease !== 'object' || Array.isArray(projectRelease)) {
+    return null;
+  }
+  const version = typeof projectRelease.currentVersion === 'string' ? projectRelease.currentVersion.trim() : '';
+  if (!version) return null;
+  return {
+    version,
+    status: typeof projectRelease.currentStatus === 'string' ? projectRelease.currentStatus.trim() : '',
+    itemCount: Number.isFinite(projectRelease.itemCount) ? projectRelease.itemCount : null,
+  };
+}
+
+function renderReviewProjectVersion(projectRelease) {
+  if (!projectRelease) return '';
+  const meta = [];
+  if (projectRelease.status) {
+    meta.push(reviewReleaseStatusLabel(projectRelease.status));
+  }
+  if (projectRelease.itemCount > 0) {
+    meta.push(`${projectRelease.itemCount} 条变化`);
+  }
+  return `
+        <div class="review-project-version" aria-label="项目版本">
+          <span class="review-project-version-label">项目版本</span>
+          <strong class="review-project-version-value">${escapeHtml(projectRelease.version)}</strong>
+          ${meta.length ? `<span class="review-project-version-meta">${escapeHtml(meta.join(' · '))}</span>` : ''}
+        </div>
+  `;
+}
+
 function renderReviewOverview(snapshot, sectionsData) {
   const problem = sectionsData.problem?.problemStatement || '尚未形成明确问题定义';
   return `
@@ -1157,6 +1189,10 @@ function reviewCopyBundle({ label, command, payload, message = null }) {
   ].filter(Boolean).join('\n\n');
 }
 
+function reviewContinueMessage(snapshot) {
+  return '这版需求确认稿已经通过。请先记录这次确认结果，并继续推进后续落地内容。只有后面确实需要额外授权时，再用人话说明影响和下一步。';
+}
+
 function shellQuote(value) {
   return `'${String(value).replace(/'/g, `'\\''`)}'`;
 }
@@ -1182,7 +1218,12 @@ function renderReviewDecision(snapshot) {
   const payload = JSON.stringify(buildReviewExportPayload(snapshot), null, 2);
   const confirmCommand = reviewCommand(snapshot, 'confirmed');
   const reviseCommand = reviewCommand(snapshot, 'needs-revision', '说明需要调整的点');
-  const confirmCopy = reviewCopyBundle({ label: '认可方案', command: confirmCommand, payload });
+  const confirmCopy = reviewCopyBundle({
+    label: '认可并继续下一步',
+    command: confirmCommand,
+    payload,
+    message: reviewContinueMessage(snapshot),
+  });
   const reviseCopy = reviewCopyBundle({ label: '需要调整', command: reviseCommand, payload });
   return `
     <nav class="review-bottom-bar" aria-label="评审决定">
@@ -1191,17 +1232,18 @@ function renderReviewDecision(snapshot) {
           需要调整
         </button>
         <button type="button" class="review-bottom-action confirm" data-copy-value="${escapeHtml(confirmCopy)}" title="${escapeHtml(confirmCommand)}">
-          认可方案
+          认可并继续
         </button>
       </div>
     </nav>
   `;
 }
 
-function renderReviewPage({ snapshot, sectionsData }) {
+function renderReviewPage({ snapshot, sectionsData, projectRelease }) {
   const primaryFlows = reviewList(sectionsData.scenarios?.primaryFlows);
   const edgeCases = reviewList(sectionsData.scenarios?.edgeCases);
   const failureModes = reviewList(sectionsData.scenarios?.failureModes);
+  const visibleProjectRelease = resolveReviewProjectRelease(projectRelease ?? snapshot.projectRelease);
   const flowPanelItems = reviewPresentationPanelItems(snapshot, 'flow', [
     ...primaryFlows,
     ...edgeCases,
@@ -1295,7 +1337,8 @@ function renderReviewPage({ snapshot, sectionsData }) {
       .review-topbar {
         display: flex;
         align-items: center;
-        justify-content: flex-start;
+        justify-content: space-between;
+        flex-wrap: wrap;
         gap: 16px;
         margin-bottom: 16px;
       }
@@ -1312,6 +1355,35 @@ function renderReviewPage({ snapshot, sectionsData }) {
         font-weight: 700;
         letter-spacing: 0;
       }
+      .review-project-version {
+        display: grid;
+        gap: 4px;
+        min-width: 220px;
+        margin-left: auto;
+        padding: 12px 16px;
+        border: 1px solid #bfdbfe;
+        border-radius: 16px;
+        background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
+        box-shadow: 0 12px 24px rgba(37, 99, 235, 0.08);
+      }
+      .review-project-version-label {
+        color: var(--review-blue);
+        font-size: 12px;
+        font-weight: 800;
+        letter-spacing: 0;
+      }
+      .review-project-version-value {
+        color: var(--review-text);
+        font-family: var(--review-mono);
+        font-size: 22px;
+        line-height: 1.1;
+      }
+      .review-project-version-meta {
+        color: var(--review-muted);
+        font-size: 12px;
+        font-weight: 700;
+        letter-spacing: 0;
+      }
       .review-kicker {
         margin: 0 0 6px;
         color: var(--review-muted);
@@ -1691,6 +1763,11 @@ function renderReviewPage({ snapshot, sectionsData }) {
       @media (max-width: 620px) {
         .review-page { padding: 18px 12px 128px; }
         .review-topbar { align-items: flex-start; flex-direction: column; }
+        .review-project-version {
+          min-width: 0;
+          width: 100%;
+          margin-left: 0;
+        }
         .review-overview { padding: 18px; }
         .review-overview h1 {
           font-size: 26px;
@@ -1718,6 +1795,7 @@ function renderReviewPage({ snapshot, sectionsData }) {
     <main class="review-page">
       <header class="review-topbar">
         <div class="review-brand">OpenPrd / 评审面板</div>
+        ${renderReviewProjectVersion(visibleProjectRelease)}
       </header>
       ${renderReviewOverview(snapshot, sectionsData)}
       ${renderReviewFlowSvg(snapshot, sectionsData)}
@@ -2095,9 +2173,9 @@ export function renderPlaygroundArtifact({ snapshot, state, markdownPath, patchP
 </html>`;
 }
 
-export function renderReviewArtifact({ snapshot }) {
+export function renderReviewArtifact({ snapshot, projectRelease = null }) {
   const sectionsData = snapshot.sections ?? {};
-  return renderReviewPage({ snapshot, sectionsData });
+  return renderReviewPage({ snapshot, sectionsData, projectRelease });
 }
 
 export function renderRegressionArtifact({ task, report }) {
@@ -2151,1571 +2229,69 @@ export function renderRegressionArtifact({ task, report }) {
   });
 }
 
-function qualityStatusLabel(status) {
-  if (status === 'pass') return '通过';
-  if (status === 'fail') return '失败';
-  if (status === 'needs-evidence') return '需补证据';
-  if (status === 'advisory') return '建议关注';
-  if (status === 'waived') return '已豁免';
-  return '需关注';
-}
-
-function qualityStatusClass(status) {
-  if (status === 'pass') return 'success';
-  if (status === 'fail') return 'warning';
-  return 'warning';
-}
-
-function qualityBadgeClass(status) {
-  if (status === 'production-ready') return 'status-pass';
-  if (status === 'failed') return 'status-fail';
-  return 'status-warn';
-}
-
-function miniMetric(title, metric, subtext) {
-  return `
-    <div class="mini-metric">
-      <div class="mini-metric-label">${escapeHtml(title)}</div>
-      <div class="mini-metric-value">${escapeHtml(metric)}</div>
-      <div class="mini-metric-sub">${escapeHtml(subtext)}</div>
-    </div>
-  `;
-}
-
-function auditStatusClass(status) {
-  if (status === 'pass' || status === 'production-ready' || status === 'waived') return 'audit-pass';
-  if (status === 'fail' || status === 'failed' || status === 'needs-attention') return 'audit-fail';
-  if (status === 'needs-evidence') return 'audit-evidence';
-  return 'audit-advisory';
-}
-
-function auditGateDecision(gate) {
-  if (gate.required && gate.status === 'pass') return '本期必测块已通过';
-  if (gate.required && gate.status === 'waived') return '已豁免，需保留依据';
-  if (gate.required) return '本期必测未通过，不能宣称就绪';
-  if (gate.status === 'pass') return '按风险确认项已有证据';
-  if (gate.status === 'advisory') return '当前可选，风险进入范围后升级';
-  return '当前不阻断，建议补证据';
-}
-
-function auditChips(items, emptyText = '无') {
-  const list = Array.isArray(items) ? items.filter(Boolean) : [];
-  if (list.length === 0) return `<span class="audit-chip muted">${escapeHtml(emptyText)}</span>`;
-  return list.map((item) => `<span class="audit-chip">${escapeHtml(item)}</span>`).join('\n');
-}
-
-function auditActionItems(report) {
-  const requiredGates = report.gates.filter((gate) => gate.required);
-  const failingRequired = requiredGates.filter((gate) => !['pass', 'waived'].includes(gate.status));
-  const advisory = report.gates.filter((gate) => !gate.required && gate.status !== 'pass');
-  if (failingRequired.length > 0) {
-    return failingRequired.map((gate) => `${reviewerGateDisplay(gate)}: ${gate.warnings[0] ?? gate.evidence?.summary ?? '补齐必需证据后再继续'}`);
-  }
-  if (advisory.length > 0) {
-    return advisory.map((gate) => `${reviewerGateDisplay(gate)}: ${auditGateDecision(gate)}`);
-  }
-  return ['当前本期必测块全部通过；继续保留本次执行证据，交付前复跑 openprd run --verify。'];
-}
-
-function auditEvidenceRows(report) {
-  return report.gates.flatMap((gate) => {
-    const sources = gate.evidence?.sources ?? [];
-    if (sources.length === 0) {
-      return [{
-        gate,
-        source: '未提供',
-        path: gate.required ? '缺少必需证据' : '当前场景未要求',
-        empty: true,
-      }];
-    }
-    return sources.map((source) => ({
-      gate,
-      source: source.source ?? 'evidence',
-      path: source.path ?? 'unknown',
-      empty: false,
-    }));
-  });
-}
-
-function reviewerGateFocus(gate) {
-  const focusByGate = {
-    smoke: '看主流程和最容易出错的失败路径是否真的跑过，而不是只写了测试文件。',
-    'feature-coverage': '看本次需求、任务和验收点是否都被覆盖；如果没有激活任务，要确认这是不是合理状态。',
-    'business-guardrails': '看成本、免费额度、滥用、报警和止损动作是否讲清楚，避免上线后失控。',
-    traceability: '看出问题时能不能从用户动作追到请求、任务和错误，方便复现和定位。',
-    redaction: '看日志、截图、报告和错误信息里是否可能泄露用户隐私、密钥或敏感业务数据。',
-    'normal-performance': '看普通规模下是否会卡顿、超时、资源异常，是否有可比较的基线。',
-    'extreme-performance': '看大数据、并发、异常输入或边界规模下是否有兜底，不只是跑小样本。',
-    knowledge: '看这次发现的问题是否值得沉淀，避免下次 Agent 或团队重复踩同一个坑。',
-  };
-  return focusByGate[gate.id] ?? '看这个测试块是否和本次需求相关，证据是否来自本次执行。';
-}
-
-function reviewerGateQuestion(gate) {
-  if (gate.required && gate.status === 'pass') {
-    return '你可以抽查证据是否对应本次需求；如果证据太泛，要求 Agent 补本次执行记录。';
-  }
-  if (gate.required) {
-    return '这里不能放行。请要求 Agent 补证据、修复问题，并重新生成回归测试报告。';
-  }
-  if (gate.status === 'pass') {
-    return '当前不阻断；你只需要判断这项是否和本次风险相关，必要时抽查证据。';
-  }
-  return '你要决定是否接受本次不补；如果准备发布或风险变高，应要求升级为本期必测。';
-}
-
-function reviewerScenarioLabel(tag) {
-  const labels = {
-    core: '基础验证',
-    frontend: '界面体验',
-    desktop: '桌面端体验',
-    backend: '服务与数据处理',
-    businessCost: '成本与滥用风险',
-    security: '隐私与安全',
-    performance: '性能风险',
-    extreme: '极端场景',
-    release: '上线交付',
-    legacy: '历史兼容',
-  };
-  return labels[tag] ?? tag;
-}
-
-function reviewerGateLabel(report, gateId) {
-  const gate = report.gates.find((item) => item.id === gateId);
-  return reviewerGateDisplay(gate ?? { id: gateId, label: gateId });
-}
-
-function reviewerGateDisplay(gate) {
-  if (gate.id === 'knowledge') return '经验沉淀';
-  return String(gate.label ?? gate.id).replace(/\s*Skill\s*/g, ' ');
-}
-
-function reviewerEnforcementLabel(value) {
-  if (value === 'blocking') return '严格阻断';
-  if (value === 'advisory') return '建议模式';
-  return value ?? '未标明';
-}
-
-function reviewerPolicyLabels(report) {
-  const policy = report.qualityPolicy ?? { scenarioTags: [], requiredGates: [], optionalGates: [] };
-  return {
-    scenarioLabels: policy.scenarioTags.map(reviewerScenarioLabel),
-    requiredLabels: policy.requiredGates.map((gateId) => reviewerGateLabel(report, gateId)),
-    optionalLabels: policy.optionalGates.map((gateId) => reviewerGateLabel(report, gateId)),
-  };
-}
-
-function reviewerDecisionPayload(report, actionItems) {
-  const labels = reviewerPolicyLabels(report);
-  const failingRequired = report.gates
-    .filter((gate) => gate.required && !['pass', 'waived'].includes(gate.status))
-    .map(reviewerGateDisplay);
-  const advisory = report.gates
-    .filter((gate) => !gate.required && gate.status !== 'pass')
-    .map(reviewerGateDisplay);
-  return [
-    `我看了回归测试报告 ${report.id}，我的确认意见如下：`,
-    '',
-    `1. 场景判断：${labels.scenarioLabels.join(', ') || '未标明'}。我认为这个场景【接受 / 不接受】，原因是：`,
-    `2. 本期必测块：${labels.requiredLabels.join(', ') || '无'}。我认为这些回归结果【可信 / 不可信】，需要补充：`,
-    `3. 需确认遗漏：${advisory.join(', ') || '无'}。我选择【不属于本期，可延期 / 属于本期，需要现在补齐】。`,
-    `4. 放行结论：${failingRequired.length === 0 ? '本期必测块可以继续，但请按我的选择处理需确认遗漏。' : `我不同意放行，未通过项包括：${failingRequired.join(', ')}`}`,
-    '',
-    '我希望 Agent 接下来处理：',
-    ...actionItems.map((item) => `- ${item}`),
-  ].join('\n');
-}
-
-function reviewerEvidencePayload(report) {
-  const missing = report.gates.filter((gate) => gate.status !== 'pass' || !gate.evidence?.present);
-  return [
-    `请根据回归测试报告 ${report.id} 补齐或解释以下回归遗漏：`,
-    '',
-    ...missing.map((gate) => [
-      `- ${reviewerGateDisplay(gate)}（${gate.required ? '本期必测' : '按风险确认'}，当前状态：${qualityStatusLabel(gate.status)}）`,
-      `  我要确认：${reviewerGateFocus(gate)}`,
-      `  你需要补充：${regressionHumanText(gate.warnings[0] ?? gate.evidence?.summary ?? '本次执行证据、覆盖范围和判断理由')}`,
-    ].join('\n')),
-    '',
-    '补完后请重新运行 openprd quality . --verify 和 openprd run . --verify，并给我新的报告链接。',
-  ].join('\n');
-}
-
-function reviewerScenarioPayload(report) {
-  const labels = reviewerPolicyLabels(report);
-  return [
-    `我想重新确认回归测试场景。当前报告 ${report.id} 的场景是：${labels.scenarioLabels.join(', ') || '未标明'}。`,
-    '',
-    '请你重新判断：',
-    '- 这个需求是否其实应该按上线交付 / 隐私与安全 / 性能风险 / 服务与数据处理 / 极端场景处理？',
-    '- 哪些按风险确认的测试块应该升级为本期必测？',
-    '- 如果仍保持当前场景，请用面向评审者的语言解释为什么。',
-    '',
-    `当前本期必测块：${labels.requiredLabels.join(', ') || '无'}`,
-  ].join('\n');
-}
-
-function reviewCopyCard(title, description, payload) {
-  return `
-    <div class="review-copy">
-      <div class="review-copy-head">
-        <div>
-          <strong>${escapeHtml(title)}</strong>
-          <span>${escapeHtml(description)}</span>
-        </div>
-        <button type="button" data-copy-nearest>复制回对话</button>
-      </div>
-      <textarea readonly data-review-copy>${escapeHtml(payload)}</textarea>
-    </div>
-  `;
-}
-
-function regressionGateCopyPayload(gate, report) {
-  const warnings = gate.warnings.map(regressionHumanText);
-  const missingText = warnings.length > 0
-    ? warnings.map((item) => `- ${item}`).join('\n')
-    : `- ${gate.evidence?.summary ?? '请补充本次执行证据和判断理由'}`;
-  return [
-    `请处理回归测试报告 ${report.id} 里的这项问题：${reviewerGateDisplay(gate)}`,
-    '',
-    `当前状态：${regressionResultLabel(gate)}`,
-    `本期要求：${gate.required ? '本期必须处理' : '请判断是否属于本期'}`,
-    `我关心的是：${regressionBlockDescription(gate)}`,
-    '',
-    '当前问题：',
-    missingText,
-    '',
-    '请你接下来：',
-    '1. 如果属于本期需求，请直接修复、补测或补证据。',
-    '2. 如果你认为可以延期，请用需求视角说明原因、影响和后续条件。',
-    '3. 处理后重新运行 openprd quality . --verify 和 openprd run . --verify，并给我新的报告链接。',
-  ].join('\n');
-}
-
-function regressionGateHints(gate) {
-  if (gate.required && gate.status !== 'pass') {
-    return [
-      '不要让用户决策是否修；先按本期必测块修复或补证据。',
-      '补完后重新生成报告，确认必须修复数归零。',
-    ];
-  }
-  if (gate.id === 'feature-coverage' && gate.evidence?.summary === '当前没有激活任务清单') {
-    return [
-      '如果这是具体需求交付，先补 active change/tasks.md。',
-      '把新增、修改、删除、异常路径拆成可验收任务后再回归。',
-    ];
-  }
-  if (gate.status === 'needs-evidence') {
-    return [
-      '先确认项目是否只是有能力但缺本次执行证据。',
-      '如果属于本期风险，补一次实际运行记录，而不是只引用脚本存在。',
-    ];
-  }
-  return [
-    '先判断它是否真的属于本期需求风险。',
-    '属于本期就补测；不属于本期才写清延期理由和触发条件。',
-  ];
-}
-
-function regressionGateSimpleSuggestion(gate) {
-  if (gate.required && gate.status !== 'pass') return '先修复或补证据，再重跑报告。';
-  if (gate.id === 'feature-coverage' && gate.evidence?.summary === '当前没有激活任务清单') {
-    return '具体需求交付时先补 tasks.md。';
-  }
-  if (gate.status === 'needs-evidence') return '如果属于本期，就补本次执行证据。';
-  return '相关就补测，不相关就写清延期理由。';
-}
-
-function regressionResultLabel(gate) {
-  if (gate.status === 'pass') return '已通过';
-  if (gate.required) return '未通过';
-  if (gate.status === 'needs-evidence') return '缺少证据';
-  if (gate.status === 'advisory') return '需确认是否本期处理';
-  return qualityStatusLabel(gate.status);
-}
-
-function regressionResultClass(gate) {
-  if (gate.status === 'pass') return 'audit-pass';
-  if (gate.required) return 'audit-fail';
-  if (gate.status === 'needs-evidence') return 'audit-evidence';
-  return 'audit-advisory';
-}
-
-function regressionExpectation(gate) {
-  if (gate.id === 'feature-coverage' && gate.evidence?.summary === '当前没有激活任务清单') {
-    return '全项目检查可接受；具体需求交付时必须有任务拆解';
-  }
-  if (gate.required) return '本期必须通过';
-  return '本期默认不阻断；若需求涉及此风险，应升级为本期测试';
-}
-
-function regressionTreatment(gate) {
-  if (gate.id === 'feature-coverage' && gate.evidence?.summary === '当前没有激活任务清单') {
-    return '如果这是具体需求交付，应先补 active change/tasks，否则无法证明新增/修改/删除等需求项逐项回归。';
-  }
-  if (gate.required && gate.status === 'pass') return '不需要人工评审；保留证据即可继续。';
-  if (gate.required) return '应当现在修复或补证据，修完后重新生成报告。';
-  if (gate.status === 'pass') return '已覆盖，可作为辅助证据保留。';
-  return '需要判断是否属于本期需求；属于就现在补测，不属于才记录为后续风险。';
-}
-
-function regressionBlockDescription(gate) {
-  const descriptions = {
-    smoke: '核心路径能否跑通，至少覆盖主流程和最关键的失败路径。',
-    'feature-coverage': '需求拆解项是否全部完成，验收点是否有对应回归。',
-    'business-guardrails': '成本、额度、滥用、报警、止损是否有明确保护。',
-    traceability: '出问题时是否能追到用户动作、请求、任务和错误。',
-    redaction: '报告、日志和错误信息是否会暴露隐私、密钥或敏感数据。',
-    'normal-performance': '普通规模下是否可用、不卡顿、不超时。',
-    'extreme-performance': '大数据、并发、异常输入、边界规模是否有兜底。',
-    knowledge: '本次问题是否需要沉淀成经验，避免下次重复漏测。',
-  };
-  return descriptions[gate.id] ?? reviewerGateFocus(gate);
-}
-
-function regressionHumanText(value) {
-  return String(value ?? '')
-    .replace(/阻断此门禁/g, '作为本期必测阻断')
-    .replace(/必需门禁/g, '本期必测块')
-    .replace(/可选门禁/g, '按风险确认项')
-    .replace(/门禁/g, '测试块');
-}
-
-function regressionTaskStatus(task) {
-  if (task.done) return '已完成';
-  if (task.blocked) return '阻塞';
-  return '未完成';
-}
-
-function regressionRequirementRows(activeTasks, report) {
-  const tasks = activeTasks.tasks ?? [];
-  const requiredGates = report.gates.filter((gate) => gate.required);
-  const requiredPassed = requiredGates.filter((gate) => ['pass', 'waived'].includes(gate.status)).length;
-  const failingRequired = requiredGates.filter((gate) => !['pass', 'waived'].includes(gate.status));
-  const advisoryGates = report.gates.filter((gate) => !gate.required && gate.status !== 'pass');
-  if (tasks.length === 0) {
-    return `
-      <tr class="audit-evidence">
-        <td>当前没有激活需求任务</td>
-        <td>项目级必测 ${escapeHtml(`${requiredPassed}/${requiredGates.length}`)} 通过</td>
-        <td>如果这是具体需求交付，应先生成或保留 tasks.md，再逐项回归。</td>
-      </tr>
-    `;
-  }
-  return tasks.map((task) => {
-    const statusClass = !task.done || failingRequired.length > 0
-      ? 'audit-fail'
-      : advisoryGates.length > 0
-        ? 'audit-advisory'
-        : 'audit-pass';
-    const conclusion = !task.done
-      ? '不能放行，应完成或明确延期原因。'
-      : failingRequired.length > 0
-        ? '不能放行，仍有本期必测块未通过。'
-        : advisoryGates.length > 0
-          ? '功能已完成；需确认风险项是否属于本期。'
-          : '通过，无需人工评审。';
-    return `
-      <tr class="${statusClass}">
-        <td>
-          <strong>${escapeHtml(task.title)}</strong>
-          <span><code>${escapeHtml(`${task.source}:${task.line}`)}</code></span>
-        </td>
-        <td>${escapeHtml(regressionTaskStatus(task))} · 必测 ${escapeHtml(`${requiredPassed}/${requiredGates.length}`)}</td>
-        <td>${escapeHtml(conclusion)}</td>
-      </tr>
-    `;
-  }).join('\n');
-}
-
-function regressionGateSummaryCards(report) {
-  return report.gates.map((gate) => `
-    <div class="audit-block-card ${regressionResultClass(gate)}">
-      <div class="audit-block-card-head">
-        <strong>${escapeHtml(reviewerGateDisplay(gate))}</strong>
-        <span class="audit-status ${regressionResultClass(gate)}">${escapeHtml(regressionResultLabel(gate))}</span>
-      </div>
-      <div class="audit-block-meta">
-        <span>${gate.required ? '本期必测' : '按风险确认'}</span>
-        <span>${gate.evidence?.present ? `${gate.evidence.sources.length} 条证据` : '缺少本次证据'}</span>
-      </div>
-    </div>
-  `).join('\n');
-}
-
-function regressionExceptionItems(report) {
-  const items = report.gates.filter((gate) => gate.required ? gate.status !== 'pass' : gate.status !== 'pass');
-  if (items.length === 0) {
-    return '<div class="audit-empty">没有未通过或需确认的回归块。查看者只需要确认报告对应的是本次需求即可。</div>';
-  }
-  return items.map((gate) => `
-    <div class="audit-risk-card ${regressionResultClass(gate)}">
-      <div class="audit-risk-card-head">
-        <div>
-          <strong>${escapeHtml(reviewerGateDisplay(gate))}</strong>
-          <span>${escapeHtml(regressionResultLabel(gate))}</span>
-        </div>
-        <button type="button" data-copy-nearest>复制给 Agent</button>
-      </div>
-      <p>${escapeHtml(regressionBlockDescription(gate))}</p>
-      <div class="qa-meta">${escapeHtml(regressionGateSimpleSuggestion(gate))}</div>
-      <textarea readonly class="copy-source" data-review-copy>${escapeHtml(regressionGateCopyPayload(gate, report))}</textarea>
-    </div>
-  `).join('\n');
-}
-
 export function renderQualityEvalArtifact({ report }) {
   return renderQualityEvalArtifactV2({ report });
 }
 
-function learningSourceAnchor(sourceId) {
-  return `source-${slugify(sourceId, 'source')}`;
-}
-
-function learningAssetUrl(rawPath) {
-  const value = String(rawPath ?? '').trim();
-  if (!value) return null;
-  if (/^(?:https?:|data:|file:)/i.test(value)) return value;
-  if (path.isAbsolute(value)) return pathToFileURL(value).href;
-  return encodeURI(value.split(path.sep).join('/'));
-}
-
-function formatLearningParagraphs(paragraphs) {
-  const list = Array.isArray(paragraphs) ? paragraphs.filter(Boolean) : [];
-  return list.map((paragraph) => `<p>${escapeHtml(paragraph)}</p>`).join('\n');
-}
-
-function formatLearningEvidenceChips(sourceIds) {
-  const list = Array.isArray(sourceIds) ? sourceIds.filter(Boolean) : [];
-  if (list.length === 0) {
-    return '<span class="evidence-chip muted">暂无证据引用</span>';
-  }
-  return list.map((id) => `
-    <span class="evidence-chip">${escapeHtml(id)}</span>
-  `).join('\n');
-}
-
-function formatLearningRetrievalBlocks(blocks, chapterId) {
-  const list = Array.isArray(blocks) ? blocks.filter(Boolean) : [];
-  if (list.length === 0) return '';
-  return `
-    <section class="learning-block retrieval" id="${escapeHtml(chapterId)}-retrieval">
-      <h4>检索练习</h4>
-      ${list.map((block, index) => `
-        <details class="retrieval-item" id="${escapeHtml(chapterId)}-retrieval-${index + 1}">
-          <summary><span>R${index + 1}</span>${escapeHtml(block.prompt)}</summary>
-          ${block.hint ? `<div class="retrieval-hint">提示: ${escapeHtml(block.hint)}</div>` : ''}
-          <div class="retrieval-answer">参考答案: ${escapeHtml(block.answer)}</div>
-        </details>
-      `).join('\n')}
-    </section>
-  `;
-}
-
-function formatLearningWorkedExamples(examples, chapterId) {
-  const list = Array.isArray(examples) ? examples.filter(Boolean) : [];
-  if (list.length === 0) return '';
-  return `
-    <section class="learning-block worked" id="${escapeHtml(chapterId)}-worked">
-      <h4>工作示例</h4>
-      ${list.map((example, index) => `
-        <div class="worked-item" id="${escapeHtml(chapterId)}-worked-${index + 1}">
-          <div class="worked-title">${escapeHtml(example.title)}</div>
-          <p>${escapeHtml(example.scenario)}</p>
-          <ol>${listMarkup(example.steps, '暂无步骤')}</ol>
-          ${example.principle ? `<div class="worked-principle">原则: ${escapeHtml(example.principle)}</div>` : ''}
-        </div>
-      `).join('\n')}
-    </section>
-  `;
-}
-
-function formatLearningVisualExplainer(explainer, chapterId) {
-  if (!explainer || typeof explainer !== 'object') return '';
-  const takeaways = Array.isArray(explainer.takeaways) ? explainer.takeaways.filter(Boolean) : [];
-  const imageUrl = learningAssetUrl(explainer.image?.path);
-  const hasImage = Boolean(imageUrl);
-  return `
-    <section class="learning-block visual" id="${escapeHtml(chapterId)}-visual">
-      <div class="visual-header">
-        <div class="visual-kicker">一眼看懂</div>
-        <h4>${escapeHtml(explainer.title ?? '图文解释')}</h4>
-      </div>
-      <div class="visual-grid${hasImage ? ' has-image' : ''}">
-        ${hasImage ? `
-          <figure class="visual-figure">
-            <img src="${escapeHtml(imageUrl)}" alt="${escapeHtml(explainer.image?.alt ?? explainer.title ?? 'visual explainer')}" loading="lazy" />
-            ${explainer.image?.caption ? `<figcaption>${escapeHtml(explainer.image.caption)}</figcaption>` : ''}
-          </figure>
-        ` : ''}
-        <div class="visual-copy">
-          <div class="visual-note">
-            <div class="visual-label">比喻</div>
-            <p>${escapeHtml(explainer.analogy ?? '')}</p>
-          </div>
-          <div class="visual-note">
-            <div class="visual-label">场景</div>
-            <p>${escapeHtml(explainer.scene ?? '')}</p>
-          </div>
-          <div class="visual-note">
-            <div class="visual-label">为什么这张图有用</div>
-            <p>${escapeHtml(explainer.whyItMatters ?? '')}</p>
-          </div>
-          ${takeaways.length > 0 ? `
-            <div class="visual-note">
-              <div class="visual-label">看图重点</div>
-              <ul class="visual-takeaways">${listMarkup(takeaways, '暂无重点')}</ul>
-            </div>
-          ` : ''}
-        </div>
-      </div>
-    </section>
-  `;
-}
-
-function formatLearningEvidenceDetails(chapter, sourcesById) {
-  const ids = Array.isArray(chapter.evidenceIds) ? chapter.evidenceIds.filter(Boolean) : [];
-  if (ids.length === 0) return '';
-  return `
-    <details class="chapter-evidence" id="${escapeHtml(chapter.id)}-evidence">
-      <summary>
-        <span class="evidence-summary-title">本章出处</span>
-        <span class="evidence-summary-count">${ids.length} 个来源</span>
-      </summary>
-      <div class="evidence-mini-list">
-        ${ids.map((id) => {
-          const source = sourcesById.get(id);
-          return `
-            <div class="evidence-mini-card">
-              <strong>${escapeHtml(source?.title ?? id)}</strong>
-              <span>${escapeHtml(source?.relativePath ?? source?.path ?? id)}</span>
-              ${source?.summary ? `<p>${escapeHtml(source.summary)}</p>` : ''}
-            </div>
-          `;
-        }).join('\n')}
-      </div>
-    </details>
-  `;
-}
-
-function formatLearningChapter(chapter, index, sourcesById) {
-  return `
-    <section class="chapter${index === 0 ? ' active' : ''}" id="${escapeHtml(chapter.id)}" data-chapter-index="${index}"${index === 0 ? '' : ' hidden'}>
-      <div class="chapter-kicker" id="${escapeHtml(chapter.id)}-reading">第 ${index + 1} 章 · ${escapeHtml(chapter.label)}</div>
-      <h2>${escapeHtml(chapter.semanticTitle)}</h2>
-      <p class="chapter-summary">${escapeHtml(chapter.summary)}</p>
-      ${formatLearningVisualExplainer(chapter.visualExplainer, chapter.id)}
-      ${formatLearningParagraphs(chapter.paragraphs)}
-      ${formatLearningRetrievalBlocks(chapter.retrievalBlocks, chapter.id)}
-      ${formatLearningWorkedExamples(chapter.workedExamples, chapter.id)}
-      ${formatLearningEvidenceDetails(chapter, sourcesById)}
-    </section>
-  `;
+export async function writeHtmlArtifact(filePath, html) {
+  await writeText(filePath, html);
+  return filePath;
 }
 
-function formatLearningOutlineNode(node, indexPath = '1', activeChapterId = null) {
-  const hasChildren = Array.isArray(node.children) && node.children.length > 0;
-  const label = `
-    <span class="outline-jump depth-${escapeHtml(node.depth ?? 1)}${node.id === activeChapterId ? ' active' : ''}" data-target-id="${escapeHtml(node.id)}">
-      <span class="outline-number">${escapeHtml(indexPath)}</span>
-      <span class="outline-copy">
-        <strong>${escapeHtml(node.title)}</strong>
-        ${node.subtitle ? `<small>${escapeHtml(node.subtitle)}</small>` : ''}
-      </span>
-    </span>
-  `;
-  if (!hasChildren) return `<li>${label}</li>`;
-  return `
-    <li>
-      <details class="outline-branch" open>
-        <summary>${label}</summary>
-        <ol>
-          ${node.children.map((child, childIndex) => formatLearningOutlineNode(child, `${indexPath}.${childIndex + 1}`, activeChapterId)).join('\n')}
-        </ol>
-      </details>
-    </li>
-  `;
+export async function openArtifactInBrowser(filePath) {
+  const platform = process.platform;
+  const command = platform === 'darwin'
+    ? 'open'
+    : platform === 'win32'
+      ? 'cmd'
+      : 'xdg-open';
+  const args = platform === 'win32'
+    ? ['/c', 'start', '', filePath]
+    : [filePath];
+  const child = spawn(command, args, {
+    detached: true,
+    stdio: 'ignore',
+  });
+  child.unref();
 }
 
-function formatLearningSource(source) {
-  return `
-    <section class="source-card" id="${escapeHtml(learningSourceAnchor(source.id))}">
-      <div class="source-title">${escapeHtml(source.title)}</div>
-      <div class="source-meta">${escapeHtml(source.type)} · ${escapeHtml(source.relativePath ?? source.path ?? '')}</div>
-      ${source.summary ? `<p>${escapeHtml(source.summary)}</p>` : ''}
-      ${source.excerpt ? `<pre>${escapeHtml(source.excerpt)}</pre>` : ''}
-      <div class="source-digest">digest: ${escapeHtml(source.digest ?? 'none')}</div>
-    </section>
-  `;
+export function canonicalReviewPath(ws, versionId) {
+  return cjoin(ws.workspaceRoot, 'reviews', `${slugify(versionId, 'review')}.html`);
 }
 
-function formatLearningClaim(claim) {
-  return `
-    <div class="claim-item">
-      <div class="claim-statement">${escapeHtml(claim.statement)}</div>
-      <div class="claim-meta">confidence: ${escapeHtml(claim.confidence ?? 'unknown')} · sources: ${(claim.sourceIds ?? []).map((id) => escapeHtml(id)).join(', ') || 'none'}</div>
-    </div>
-  `;
+function toRelativeHref(fromFilePath, targetFilePath) {
+  const relative = path.relative(path.dirname(fromFilePath), targetFilePath) || path.basename(targetFilePath);
+  return relative.split(path.sep).join('/');
 }
 
-function formatLearningEmptyState(content, packageMeta, evidenceManifest) {
-  const promptPath = content.agentPromptPath ?? packageMeta?.paths?.agentPrompt ?? null;
-  const contextPath = content.agentContextPath ?? packageMeta?.paths?.agentContext ?? null;
-  const contentPath = content.packagePaths?.contentJson ?? packageMeta?.paths?.contentJson ?? null;
-  const assetsDir = content.packagePaths?.assetsDir ?? packageMeta?.paths?.assetsDir ?? null;
-  const renderCommand = contentPath ? `openprd learn . --content-json ${contentPath} --open` : null;
-  const sourceCount = evidenceManifest?.sourceCount ?? (evidenceManifest?.sources?.length ?? 0);
-  const claimCount = evidenceManifest?.claimCount ?? (evidenceManifest?.claims?.length ?? 0);
-  const gapCount = Array.isArray(evidenceManifest?.gaps) ? evidenceManifest.gaps.length : 0;
-  return `
-    <section class="empty-reader" id="agent-authoring">
-      <p class="chapter-kicker">证据包待写作</p>
-      <h2>还没有生成可阅读正文</h2>
-      <p>这一步只完成了学习包归档和证据收集。真正给人阅读的标题、大纲、章节、检索练习和工作示例，还需要由 Agent 根据证据写入内容 JSON 后再渲染。</p>
-      <div class="stat-grid">
-        <div class="stat"><div class="stat-value">${sourceCount}</div><div class="stat-label">份证据来源</div></div>
-        <div class="stat"><div class="stat-value">${claimCount}</div><div class="stat-label">条结构化判断</div></div>
-        <div class="stat"><div class="stat-value">${gapCount}</div><div class="stat-label">个待补缺口</div></div>
-      </div>
-	      <ol class="empty-steps">
-	        <li>让 Agent 读取写作提示、上下文和证据清单。</li>
-	        <li>由 Agent 把标题、目录、章节正文、检索练习、工作示例和需要的 visualExplainer 写进 <code>learning-content.json</code>。</li>
-	        <li>写完后重新执行渲染命令，再打开阅读器查看成品。</li>
-	      </ol>
-	      <div class="empty-paths">
-	        ${promptPath ? `<div><strong>写作提示</strong><span>${escapeHtml(promptPath)}</span></div>` : ''}
-	        ${contextPath ? `<div><strong>上下文</strong><span>${escapeHtml(contextPath)}</span></div>` : ''}
-	        ${contentPath ? `<div><strong>内容 JSON</strong><span>${escapeHtml(contentPath)}</span></div>` : ''}
-	        ${assetsDir ? `<div><strong>图片素材目录</strong><span>${escapeHtml(assetsDir)}</span></div>` : ''}
-	        ${renderCommand ? `<div><strong>重渲染命令</strong><span>${escapeHtml(renderCommand)}</span></div>` : ''}
-	      </div>
-	    </section>
-	  `;
-}
-
-export function renderLearningArtifact({ packageMeta, content, evidenceManifest }) {
-  const chapters = Array.isArray(content.chapters) ? content.chapters : [];
-  const sources = Array.isArray(evidenceManifest.sources) ? evidenceManifest.sources : [];
-  const claims = Array.isArray(evidenceManifest.claims) ? evidenceManifest.claims : [];
-  const gaps = Array.isArray(evidenceManifest.gaps) ? evidenceManifest.gaps : [];
-  const isAwaitingAgent = content.authoringStatus === 'awaiting-agent-content' || chapters.length === 0;
-  const title = content.title || packageMeta?.title || 'OpenPrd 复盘学习包';
-  const outline = Array.isArray(content.outline) && content.outline.length > 0
-    ? content.outline
-    : chapters.map((chapter, index) => ({
-      id: chapter.id,
-      depth: 1,
-      title: `第 ${index + 1} 章 · ${chapter.label}`,
-      subtitle: chapter.semanticTitle,
-      children: [],
-    }));
-  const sourcesById = new Map(sources.map((source) => [source.id, source]));
-  const initialChapterId = chapters[0]?.id ?? outline[0]?.id ?? null;
-  const initialProgressPercent = chapters.length > 0 ? String((1 / chapters.length) * 100) : '0';
-
+export function renderReviewEntryHtml({ entryPath, reviewPath, title = 'OpenPrd Review' }) {
+  const href = escapeHtml(toRelativeHref(entryPath, reviewPath));
   return `<!DOCTYPE html>
 <html lang="zh-CN">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="refresh" content="0; url=${href}" />
     <title>${escapeHtml(title)}</title>
     <style>
       :root {
         color-scheme: light;
-        --bg: #f6fbff;
-        --bg-deep: #eef6ff;
-        --paper: #ffffff;
-        --panel: rgba(255, 255, 255, 0.96);
-        --ink: #171411;
-        --text: #1f2b3d;
-        --muted: #66758b;
-        --line: rgba(121, 151, 194, 0.28);
-        --line-strong: rgba(91, 126, 177, 0.32);
-        --accent: #ef7b43;
-        --accent-deep: #d95f26;
-        --accent-soft: #fff2e8;
-        --amber: #8a5a2b;
-        --amber-soft: #f6e7d4;
-        --jade: #ef7b43;
-        --wash: #f5f9ff;
-        --danger-soft: rgba(220,38,38,0.08);
-        --reader-scale: 1;
-        --mono: "JetBrains Mono","SFMono-Regular",Menlo,monospace;
-        --serif: "Songti SC","Noto Serif CJK SC","Iowan Old Style","Palatino Linotype",serif;
-        --ui: "Avenir Next","Gill Sans","Trebuchet MS",sans-serif;
+        --bg: #f8fafc;
+        --panel: #ffffff;
+        --text: #111827;
+        --muted: #6b7280;
+        --line: rgba(17,24,39,0.12);
+        --accent: #2563eb;
       }
       * { box-sizing: border-box; }
-      html { scroll-behavior: smooth; }
       body {
         margin: 0;
-        background:
-          linear-gradient(90deg, rgba(95, 129, 181, 0.07) 0 1px, transparent 1px 100%),
-          linear-gradient(rgba(95, 129, 181, 0.07) 0 1px, transparent 1px 100%),
-          radial-gradient(circle at top, rgba(255,255,255,0.82), transparent 30%),
-          linear-gradient(180deg, #fbfdff 0%, var(--bg) 50%, var(--bg-deep) 100%);
-        background-size: 56px 56px, 56px 56px, auto, auto;
+        min-height: 100vh;
+        display: grid;
+        place-items: center;
+        background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
         color: var(--text);
-        font-family: var(--ui);
-        overflow: hidden;
-      }
-      .shell {
-        display: grid;
-        grid-template-columns: minmax(280px, 330px) minmax(0, 980px);
-        gap: 18px;
-        max-width: 1340px;
-        height: 100vh;
-        margin: 0 auto;
-        padding: 18px;
-      }
-      .side-panel,
-      .reader {
-        border: 1px solid var(--line);
-        border-radius: 18px;
-        background: var(--panel);
-        box-shadow: 0 20px 50px rgba(92, 122, 168, 0.14);
-      }
-      .side-panel {
-        position: sticky;
-        top: 18px;
-        align-self: start;
-        max-height: calc(100vh - 36px);
-        overflow: auto;
-        padding: 18px;
-        background:
-          linear-gradient(180deg, rgba(255,255,255,0.985), rgba(252,254,255,0.985)),
-          var(--panel);
-      }
-      .reader {
-        min-width: 0;
-        background: var(--paper);
-        overflow: hidden;
-        position: relative;
-        display: grid;
-        grid-template-rows: auto minmax(0, 1fr);
-        height: calc(100vh - 36px);
-      }
-      .reader-header {
-        border-bottom: 1px solid var(--line);
-        background:
-          linear-gradient(135deg, rgba(255,255,255,0.995), rgba(249,252,255,0.98)),
-          var(--paper);
-        padding: 16px 30px 10px;
-      }
-      .reader-scroll {
-        min-height: 0;
-        overflow-y: auto;
-        overscroll-behavior: contain;
-        scrollbar-gutter: stable;
-        scroll-padding-top: 24px;
-      }
-      .eyebrow {
-        margin: 0 0 8px;
-        color: var(--accent);
-        font-size: 13px;
-        font-weight: 800;
-        text-transform: uppercase;
-        letter-spacing: 0;
-      }
-      h1 {
-        margin: 0;
-        font-family: var(--serif);
-        font-size: clamp(27px, 3.2vw, 36px);
-        line-height: 1.14;
-        font-weight: 700;
-        letter-spacing: 0.01em;
-        color: var(--ink);
-      }
-      .subtitle {
-        margin: 10px 0 0;
-        color: var(--muted);
-        line-height: 1.55;
-        font-size: 15px;
-      }
-      .meta-row,
-      .controls,
-      .chapter-evidence {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 8px;
-        align-items: center;
-      }
-      .meta-row { margin-top: 8px; }
-      .meta-details {
-        margin-top: 10px;
-        color: var(--muted);
-        font-size: 12px;
-      }
-      .meta-details summary,
-      .retrieval-item summary,
-      .chapter-evidence summary {
-        list-style: none;
-      }
-      .meta-details summary::-webkit-details-marker,
-      .retrieval-item summary::-webkit-details-marker,
-      .chapter-evidence summary::-webkit-details-marker {
-        display: none;
-      }
-      .meta-details summary {
-        width: fit-content;
-        cursor: pointer;
-        color: var(--accent-deep);
-        font-weight: 650;
-        line-height: 1.4;
-        display: inline-flex;
-        align-items: center;
-        gap: 8px;
-      }
-      .meta-details summary::before,
-      .retrieval-item summary::before,
-      .chapter-evidence summary::before {
-        content: "▸";
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 12px;
-        color: var(--accent-deep);
-        font-size: 11px;
-        transform-origin: 50% 50%;
-        transition: transform 120ms ease;
-      }
-      .meta-details[open] summary::before,
-      .retrieval-item[open] summary::before,
-      .chapter-evidence[open] summary::before {
-        transform: rotate(90deg);
-      }
-      .meta-pill,
-      .evidence-chip {
-        display: inline-flex;
-        width: fit-content;
-        border: 1px solid var(--line);
-        border-radius: 999px;
-        padding: 4px 8px;
-        background: rgba(255,255,255,0.86);
-        color: var(--muted);
-        font-size: 10.5px;
-        text-decoration: none;
-      }
-      .evidence-chip {
-        color: var(--accent);
-        background: var(--accent-soft);
-        border-color: rgba(239,123,67,0.22);
-      }
-      .evidence-chip.muted {
-        color: var(--muted);
-        background: #f8fafc;
-      }
-      .controls {
-        justify-content: space-between;
-        margin-top: 9px;
-        border-top: 1px solid var(--line);
-        padding-top: 9px;
-        background: transparent;
-        gap: 14px;
-      }
-      .button-row { display: flex; gap: 8px; flex-wrap: wrap; }
-      button {
-        border: 1px solid var(--line);
-        border-radius: 999px;
-        padding: 7px 10px;
-        background: rgba(255, 255, 255, 0.96);
-        color: var(--text);
-        font: inherit;
-        font-size: 14px;
-        cursor: pointer;
-      }
-      button:hover { border-color: var(--accent); }
-      button:disabled { color: var(--muted); cursor: not-allowed; opacity: 0.58; }
-      .progress-wrap {
-        min-width: 180px;
-        flex: 1;
-      }
-      .progress-meta {
-        display: flex;
-        justify-content: space-between;
-        gap: 10px;
-        color: var(--muted);
-        font-size: 12px;
-        margin-bottom: 6px;
-      }
-      .progress-track {
-        height: 7px;
-        border-radius: 999px;
-        background: #e5dfd4;
-        overflow: hidden;
-      }
-      .progress-bar {
-        height: 100%;
-        width: 0%;
-        border-radius: inherit;
-        background: var(--accent);
-        transition: width 180ms ease;
-      }
-      .toc-title,
-      .panel-title {
-        margin: 0 0 12px;
-        font-size: 14px;
-        font-weight: 800;
-        color: var(--accent-deep);
-      }
-      .toc-subtitle {
-        margin: -4px 0 16px;
-        color: var(--muted);
-        line-height: 1.6;
-        font-size: 13px;
-      }
-      .outline-list,
-      .outline-list ol {
-        list-style: none;
-        margin: 0;
-        padding: 0;
-      }
-      .outline-list ol {
-        margin-left: 12px;
-        padding-left: 12px;
-        border-left: 1px solid var(--line);
-      }
-      .outline-branch summary {
-        list-style: none;
-      }
-      .outline-branch summary::-webkit-details-marker { display: none; }
-      .outline-jump {
-        display: grid;
-        grid-template-columns: 42px 1fr;
-        gap: 10px;
-        width: 100%;
-        text-align: left;
-        border-color: transparent;
-        background: transparent;
-        color: var(--text);
-        line-height: 1.45;
-        padding: 9px 8px;
-        border-radius: 12px;
-        border: 1px solid transparent;
-        cursor: pointer;
-      }
-      .outline-jump:hover {
-        border-color: rgba(239,123,67,0.18);
-        background: rgba(255, 246, 239, 0.78);
-        color: var(--accent-deep);
-      }
-      .outline-jump.active {
-        border-color: rgba(239,123,67,0.24);
-        background: linear-gradient(180deg, rgba(255,246,239,0.96), rgba(255,250,245,0.98));
-        color: var(--accent-deep);
-      }
-      .outline-jump.active .outline-number,
-      .outline-jump.active .outline-copy strong {
-        color: var(--accent-deep);
-      }
-      .outline-jump.active .outline-copy small {
-        color: #b27044;
-      }
-      .outline-number {
-        color: var(--amber);
-        font-family: var(--serif);
-        font-weight: 800;
-      }
-      .outline-copy strong,
-      .outline-copy small {
-        display: block;
-      }
-      .outline-copy strong {
-        font-weight: 700;
-      }
-      .outline-copy small {
-        margin-top: 3px;
-        color: var(--muted);
-        font-size: 12px;
-      }
-      .stat-grid {
-        display: grid;
-        grid-template-columns: 1fr;
-        gap: 8px;
-        margin-top: 16px;
-      }
-      .stat {
-        border: 1px solid var(--line);
-        border-radius: 14px;
-        padding: 10px;
-        background: var(--wash);
-      }
-      .stat-value {
-        font-family: var(--serif);
-        font-size: 26px;
-        font-weight: 700;
-      }
-      .stat-label {
-        color: var(--muted);
-        font-size: 12px;
-        margin-top: 2px;
-      }
-      .chapter {
-        padding: 38px 52px 54px;
-        min-height: 100%;
-      }
-      .chapter[hidden] { display: none; }
-      .chapter.active {
-        box-shadow: none;
-      }
-      .chapter-kicker {
-        color: var(--accent-deep);
-        font-size: 13px;
-        font-weight: 700;
-        letter-spacing: 0.04em;
-        margin-bottom: 8px;
-      }
-      .chapter h2 {
-        margin: 0 0 12px;
-        font-family: var(--serif);
-        font-size: 38px;
-        line-height: 1.24;
-        font-weight: 600;
-        letter-spacing: 0.01em;
-      }
-      .chapter-summary {
-        margin: 0 0 20px;
-        color: var(--muted);
-        font-size: 15px;
-        line-height: 1.8;
-        max-width: 36em;
-      }
-      .chapter > p {
-        max-width: 42em;
-      }
-      .chapter p,
-      .learning-block p,
-      .source-card p {
-        font-size: calc(17px * var(--reader-scale));
-        line-height: 1.85;
-      }
-      .learning-block {
-        margin: 34px 0 0;
-        border: 0;
-        border-top: 1px solid var(--line);
-        border-radius: 0;
-        padding: 22px 0 0;
-        background: transparent;
-      }
-      .learning-block h4 {
-        margin: 0 0 14px;
-        font-family: var(--serif);
-        font-size: 24px;
-        line-height: 1.3;
-        font-weight: 600;
-        letter-spacing: 0.01em;
-      }
-      .learning-block.retrieval,
-      .learning-block.worked,
-      .learning-block.visual {
-        border-top-color: rgba(239,123,67,0.2);
-      }
-      .learning-block.visual {
-        padding-top: 26px;
-      }
-      .visual-header {
-        display: grid;
-        gap: 6px;
-        margin-bottom: 18px;
-      }
-      .visual-kicker {
-        color: var(--accent-deep);
-        font-size: 12px;
-        font-weight: 800;
-        letter-spacing: 0.12em;
-      }
-      .visual-header h4 {
-        margin: 0;
-        font-size: 30px;
-        line-height: 1.28;
-        font-weight: 600;
-      }
-      .visual-grid {
-        display: grid;
-        gap: 26px;
-      }
-      .visual-grid.has-image {
-        grid-template-columns: minmax(0, 1.28fr) minmax(240px, 320px);
-        align-items: start;
-      }
-      .visual-copy {
-        display: grid;
-        gap: 0;
-        border-left: 1px solid var(--line);
-        padding-left: 22px;
-      }
-      .visual-note {
-        border: 0;
-        border-radius: 0;
-        background: transparent;
-        padding: 0 0 16px;
-      }
-      .visual-note + .visual-note {
-        border-top: 1px solid rgba(121, 151, 194, 0.22);
-        padding-top: 16px;
-      }
-      .visual-label {
-        color: var(--accent-deep);
-        font-size: 11px;
-        font-weight: 700;
-        letter-spacing: 0.12em;
-        margin-bottom: 8px;
-      }
-      .visual-note p {
-        margin: 0;
-      }
-      .visual-takeaways {
-        margin: 0;
-        padding-left: 20px;
-      }
-      .visual-figure {
-        margin: 0;
-        border: 1px solid rgba(121, 151, 194, 0.2);
-        border-radius: 16px;
-        overflow: hidden;
-        background: rgba(255,255,255,0.98);
-        box-shadow: 0 18px 42px rgba(91, 126, 177, 0.08);
-      }
-      .visual-figure img {
-        display: block;
-        width: 100%;
-        height: auto;
-        background:
-          linear-gradient(90deg, rgba(95, 129, 181, 0.07) 0 1px, transparent 1px 100%),
-          linear-gradient(rgba(95, 129, 181, 0.07) 0 1px, transparent 1px 100%),
-          #f8fbff;
-        background-size: 24px 24px, 24px 24px, auto;
-      }
-      .visual-figure figcaption {
-        padding: 12px 14px 14px;
-        border-top: 1px solid rgba(121, 151, 194, 0.16);
-        color: var(--muted);
-        font-size: 12px;
-        line-height: 1.6;
-      }
-      .retrieval-item {
-        border-top: 1px solid var(--line);
-        padding: 16px 0;
-      }
-      .retrieval-item:first-of-type { border-top: 0; }
-      .retrieval-item summary {
-        cursor: pointer;
-        font-weight: 650;
-        line-height: 1.6;
-        display: flex;
-        gap: 10px;
-        align-items: flex-start;
-      }
-      .retrieval-item summary span {
-        display: inline-flex;
-        color: var(--accent);
-        font-family: var(--mono);
-        font-size: 11px;
-        min-width: 24px;
-        padding-top: 2px;
-      }
-      .retrieval-hint,
-      .retrieval-answer {
-        color: var(--muted);
-        line-height: 1.7;
-        margin-top: 8px;
-        margin-left: 34px;
-      }
-      .worked-item {
-        padding: 18px 0;
-        border-top: 1px solid var(--line);
-      }
-      .worked-item:first-of-type {
-        padding-top: 6px;
-        border-top: 0;
-      }
-      .worked-title {
-        font-family: var(--serif);
-        font-size: 24px;
-        font-weight: 600;
-        line-height: 1.35;
-      }
-      .worked-principle {
-        color: var(--muted);
-        line-height: 1.7;
-        margin-top: 12px;
-        padding-top: 12px;
-        border-top: 1px solid rgba(239,123,67,0.16);
-      }
-      ol,
-      ul {
-        margin: 10px 0 0;
-        padding-left: 20px;
-        line-height: 1.75;
-      }
-      .chapter-evidence {
-        display: block;
-        margin-top: 24px;
-        padding-top: 16px;
-        border-top: 1px solid var(--line);
-      }
-      .chapter-evidence summary {
-        cursor: pointer;
-        display: flex;
-        flex-wrap: wrap;
-        align-items: center;
-        gap: 10px;
-        color: var(--muted);
-      }
-      .evidence-summary-title {
-        color: var(--accent-deep);
-        font-size: 13px;
-        font-weight: 700;
-        letter-spacing: 0.04em;
-      }
-      .evidence-summary-count {
-        color: var(--muted);
-        font-size: 12px;
-      }
-      .evidence-mini-list {
-        display: grid;
-        gap: 0;
-        margin-top: 12px;
-      }
-      .evidence-mini-card {
-        border: 0;
-        border-top: 1px solid rgba(121, 151, 194, 0.16);
-        border-radius: 0;
-        background: transparent;
-        padding: 12px 0;
-      }
-      .evidence-mini-card:first-child {
-        border-top: 0;
-        padding-top: 0;
-      }
-      .evidence-mini-card strong,
-      .evidence-mini-card span {
-        display: block;
-      }
-      .evidence-mini-card strong {
-        font-weight: 650;
-        font-size: 14px;
-        line-height: 1.5;
-      }
-      .evidence-mini-card span {
-        color: var(--muted);
-        font-family: var(--mono);
-        font-size: 11px;
-        letter-spacing: 0.02em;
-        margin-top: 4px;
-      }
-      .evidence-mini-card p {
-        margin: 6px 0 0;
-        color: var(--muted);
-        font-size: 13px;
-        line-height: 1.6;
-      }
-      .source-card,
-      .claim-item,
-      .gap-item {
-        border: 1px solid var(--line);
-        border-radius: 10px;
-        padding: 12px;
-        background: #fffefa;
-        margin-bottom: 10px;
-      }
-      .source-title,
-      .claim-statement {
-        font-weight: 800;
-        line-height: 1.5;
-      }
-      .source-meta,
-      .claim-meta,
-      .source-digest {
-        color: var(--muted);
-        font-size: 12px;
-        line-height: 1.6;
-        margin-top: 4px;
-      }
-      .source-card pre {
-        margin: 10px 0 0;
-        white-space: pre-wrap;
-        word-break: break-word;
-        border-radius: 8px;
-        background: #111827;
-        color: #e5e7eb;
-        padding: 10px;
-        font-family: var(--mono);
-        font-size: 12px;
-        line-height: 1.5;
-      }
-      .gap-item {
-        border-color: rgba(220,38,38,0.16);
-        background: var(--danger-soft);
-      }
-      .empty-reader {
-        margin: 38px 52px 54px;
-        padding: 28px;
-        border: 1px dashed var(--line-strong);
-        border-radius: 16px;
-        background: var(--wash);
-      }
-      .empty-reader h2 {
-        margin: 0 0 12px;
-        font-family: var(--serif);
-        font-size: 34px;
-        line-height: 1.2;
-      }
-      .empty-reader p {
-        margin: 0;
-        color: var(--muted);
-        font-size: 17px;
-        line-height: 1.8;
-      }
-      .empty-steps {
-        margin: 18px 0 0;
-        padding-left: 22px;
-        color: var(--muted);
-        line-height: 1.8;
-      }
-      .empty-steps li + li {
-        margin-top: 6px;
-      }
-      .empty-paths {
-        display: grid;
-        gap: 10px;
-        margin-top: 18px;
-      }
-      .empty-paths div {
-        display: grid;
-        gap: 4px;
-        border: 1px solid var(--line);
-        border-radius: 12px;
-        padding: 10px 12px;
-        background: #fffefa;
-      }
-      .empty-paths strong {
-        color: var(--accent-deep);
-        font-size: 13px;
-      }
-      .empty-paths span {
-        color: var(--muted);
-        font-family: var(--mono);
-        font-size: 12px;
-        overflow-wrap: anywhere;
-      }
-      @media (max-width: 1120px) {
-        body { overflow: auto; }
-        .shell { grid-template-columns: 1fr; height: auto; min-height: 100vh; padding: 12px; }
-        .side-panel {
-          position: static;
-          max-height: none;
-        }
-        .reader { height: auto; }
-        .reader-scroll { height: auto; overflow: visible; }
-        .chapter { min-height: auto; padding: 24px 20px 30px; }
-        .visual-grid.has-image { grid-template-columns: 1fr; }
-        .visual-copy {
-          border-left: 0;
-          border-top: 1px solid var(--line);
-          padding-left: 0;
-          padding-top: 18px;
-        }
-      }
-      @media (max-width: 700px) {
-        .reader-header { padding: 18px 20px 12px; }
-        h1 { font-size: 30px; }
-        .chapter h2 { font-size: 28px; }
-        .learning-block h4,
-        .visual-header h4,
-        .worked-title {
-          font-size: 24px;
-        }
-        .stat-grid { grid-template-columns: 1fr; }
-        .controls { display: grid; gap: 12px; }
-        .chapter { padding: 30px 22px 38px; }
-      }
-    </style>
-  </head>
-  <body>
-    <main class="shell">
-      <aside class="side-panel">
-        <p class="toc-title">书籍大纲</p>
-        <p class="toc-subtitle">最多三层展开。先读章名，再进入心法、练习与示例。</p>
-        <ol class="outline-list">
-          ${outline.length > 0 ? outline.map((node, index) => formatLearningOutlineNode(node, `${index + 1}`, initialChapterId)).join('\n') : '<li><span class="outline-jump"><span class="outline-number">0</span><span class="outline-copy"><strong>证据包待写作</strong><small>正文完成后显示目录</small></span></span></li>'}
-        </ol>
-      </aside>
-
-      <article class="reader">
-        <header class="reader-header">
-          <p class="eyebrow">OpenPrd 复盘学习 · ${escapeHtml(content.genre?.label ?? '默认题材')}</p>
-          <h1>${escapeHtml(title)}</h1>
-          <p class="subtitle">${escapeHtml(content.subtitle ?? '')}</p>
-          <details class="meta-details">
-            <summary>生成信息</summary>
-            <div class="meta-row">
-              <span class="meta-pill">topic: ${escapeHtml(content.topic ?? '未指定')}</span>
-              <span class="meta-pill">genre: ${escapeHtml(content.genre?.id ?? 'unknown')}</span>
-              <span class="meta-pill">风格: ${escapeHtml(content.stylePromptPack?.styleId ?? packageMeta?.styleId ?? 'default')}</span>
-              <span class="meta-pill">trigger: ${escapeHtml(packageMeta?.trigger ?? content.trigger ?? 'manual')}</span>
-            </div>
-          </details>
-          <div class="controls">
-            <div class="button-row">
-              <button type="button" id="prevChapter" disabled>上一章</button>
-              <button type="button" id="nextChapter"${chapters.length <= 1 ? ' disabled' : ''}>下一章</button>
-              <button type="button" id="smallerText">A-</button>
-              <button type="button" id="largerText">A+</button>
-            </div>
-            <div class="progress-wrap">
-              <div class="progress-meta">
-                <span id="progressTitle">阅读进度</span>
-                <span id="progressText">${chapters.length > 0 ? `1/${chapters.length}` : '0/0'}</span>
-              </div>
-              <div class="progress-track"><div class="progress-bar" id="progressBar" style="width: ${initialProgressPercent}%"></div></div>
-            </div>
-          </div>
-        </header>
-        <div class="reader-scroll" tabindex="0" aria-label="OpenPrd 复盘学习阅读器 · 当前章节正文">
-          ${chapters.length > 0 ? chapters.map((chapter, index) => formatLearningChapter(chapter, index, sourcesById)).join('\n') : formatLearningEmptyState(content, packageMeta, evidenceManifest)}
-        </div>
-      </article>
-    </main>
-    <script>
-      const scrollRoot = document.querySelector('.reader-scroll');
-      const chapters = Array.from(document.querySelectorAll('.chapter'));
-      const outlineItems = Array.from(document.querySelectorAll('[data-target-id]'));
-      const prevButton = document.getElementById('prevChapter');
-      const nextButton = document.getElementById('nextChapter');
-      const progressBar = document.getElementById('progressBar');
-      const progressText = document.getElementById('progressText');
-      let activeIndex = 0;
-      let fontScale = Number(localStorage.getItem('openprd-learning-font-scale') || '1');
-
-      function clamp(value, min, max) {
-        return Math.max(min, Math.min(max, value));
-      }
-
-      function applyFontScale() {
-        fontScale = clamp(fontScale, 0.9, 1.25);
-        document.documentElement.style.setProperty('--reader-scale', String(fontScale));
-        localStorage.setItem('openprd-learning-font-scale', String(fontScale));
-      }
-
-      function setActive(index, shouldScroll = false) {
-        if (chapters.length === 0) return;
-        activeIndex = clamp(index, 0, chapters.length - 1);
-        chapters.forEach((chapter, chapterIndex) => {
-          const isActive = chapterIndex === activeIndex;
-          chapter.hidden = !isActive;
-          chapter.classList.toggle('active', isActive);
-        });
-        const activeChapterId = chapters[activeIndex].id;
-        outlineItems.forEach((item) => item.classList.toggle('active', item.dataset.targetId === activeChapterId));
-        prevButton.disabled = activeIndex === 0;
-        nextButton.disabled = activeIndex === chapters.length - 1;
-        progressText.textContent = String(activeIndex + 1) + '/' + String(chapters.length);
-        progressBar.style.width = String(((activeIndex + 1) / chapters.length) * 100) + '%';
-        if (shouldScroll) {
-          scrollRoot?.scrollTo({ top: 0, behavior: 'smooth' });
-        }
-      }
-
-      function scrollToReaderTarget(target) {
-        if (!target || !scrollRoot) return;
-        const rootTop = scrollRoot.getBoundingClientRect().top;
-        const targetTop = target.getBoundingClientRect().top;
-        scrollRoot.scrollTo({
-          top: scrollRoot.scrollTop + targetTop - rootTop - 18,
-          behavior: 'smooth',
-        });
-      }
-
-      outlineItems.forEach((item) => {
-        item.addEventListener('click', () => {
-          const target = document.getElementById(item.dataset.targetId);
-          if (!target) return;
-          const chapterIndex = chapters.findIndex((chapter) => chapter.id === target.id || chapter.contains(target));
-          if (chapterIndex >= 0) setActive(chapterIndex, false);
-          scrollToReaderTarget(target);
-        });
-      });
-      prevButton.addEventListener('click', () => setActive(activeIndex - 1, true));
-      nextButton.addEventListener('click', () => setActive(activeIndex + 1, true));
-      document.getElementById('smallerText').addEventListener('click', () => {
-        fontScale -= 0.05;
-        applyFontScale();
-      });
-      document.getElementById('largerText').addEventListener('click', () => {
-        fontScale += 0.05;
-        applyFontScale();
-      });
-      document.addEventListener('keydown', (event) => {
-        if (event.key === 'ArrowRight' || event.key === 'PageDown') setActive(activeIndex + 1, true);
-        if (event.key === 'ArrowLeft' || event.key === 'PageUp') setActive(activeIndex - 1, true);
-      });
-
-      applyFontScale();
-      setActive(0, false);
-    </script>
-  </body>
-</html>`;
-}
-
-export async function writeHtmlArtifact(filePath, html) {
-  await writeText(filePath, html);
-  return filePath;
-}
-
-export async function openArtifactInBrowser(filePath) {
-  const platform = process.platform;
-  const command = platform === 'darwin'
-    ? 'open'
-    : platform === 'win32'
-      ? 'cmd'
-      : 'xdg-open';
-  const args = platform === 'win32'
-    ? ['/c', 'start', '', filePath]
-    : [filePath];
-  const child = spawn(command, args, {
-    detached: true,
-    stdio: 'ignore',
-  });
-  child.unref();
-}
-
-export function canonicalReviewPath(ws, versionId) {
-  return cjoin(ws.workspaceRoot, 'reviews', `${slugify(versionId, 'review')}.html`);
-}
-
-function toRelativeHref(fromFilePath, targetFilePath) {
-  const relative = path.relative(path.dirname(fromFilePath), targetFilePath) || path.basename(targetFilePath);
-  return relative.split(path.sep).join('/');
-}
-
-export function renderReviewEntryHtml({ entryPath, reviewPath, title = 'OpenPrd Review' }) {
-  const href = escapeHtml(toRelativeHref(entryPath, reviewPath));
-  return `<!DOCTYPE html>
-<html lang="zh-CN">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="refresh" content="0; url=${href}" />
-    <title>${escapeHtml(title)}</title>
-    <style>
-      :root {
-        color-scheme: light;
-        --bg: #f8fafc;
-        --panel: #ffffff;
-        --text: #111827;
-        --muted: #6b7280;
-        --line: rgba(17,24,39,0.12);
-        --accent: #2563eb;
-      }
-      * { box-sizing: border-box; }
-      body {
-        margin: 0;
-        min-height: 100vh;
-        display: grid;
-        place-items: center;
-        background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
-        color: var(--text);
-        font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
+        font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
       }
       .panel {
         width: min(560px, calc(100vw - 32px));
@@ -3776,21 +2352,6 @@ export function artifactBundlePaths(ws, artifactId) {
   };
 }
 
-export function learningPackagePaths(ws, packageId) {
-  const dir = cjoin(ws.paths.learningArchiveDir, slugify(packageId, 'learning-package'));
-  return {
-    dir,
-    readerHtml: cjoin(dir, 'reader.html'),
-    assetsDir: cjoin(dir, 'assets'),
-    packageJson: cjoin(dir, 'learning-package.json'),
-    contentJson: cjoin(dir, 'learning-content.json'),
-    contentMarkdown: cjoin(dir, 'learning-content.md'),
-    evidenceManifest: cjoin(dir, 'evidence-manifest.json'),
-    agentContext: cjoin(dir, 'agent-context.json'),
-    agentPrompt: cjoin(dir, 'agent-prompt.md'),
-  };
-}
-
 export function renderMarkdownDataDocument({ title, sections }) {
   const lines = [`# ${title}`, ''];
   for (const section of sections) {