Visual Report 是一个把主题转化为单文件、自包含 HTML 可视化报告的工具技能。它面向系统、流程、研究发现或决策等对象，目标是用视觉而非大段文字来承载含义。
用途 该技能用于生成一份 HTML 文档，其中 Tailwind 和 Mermaid 通过 CDN 引入，手工编写的 CSS/SVG 负责 Mermaid 无法表达的编辑类视觉。VISUAL-LANGUAGE.md 列出各种图表模式，并作为“某个想法该选哪种模式”的唯一依据；完整脚手架、图表构建配方、交互规则和统一风格位于 HTML-REPORT.md。
主要能力
- 视觉优先：每个主要观点都配一张视觉图，报告长度取决于主题有多少观点，而不是用引言、回顾和结论撑起大量章节。
- 图表模式选择：依据 VISUAL-LANGUAGE.md 中的决策树选择合适模式，不默认对所有内容使用 Mermaid 流程图。
- 自包含：一个文件、无需构建步骤、可移植；唯一依赖是 Tailwind CDN 和 Mermaid ESM 导入，因此需要网络访问才能完整渲染。
- 轻量交互：仅允许内联原生 JS 实现可折叠区块、前后对比切换、CSS 动画等，不引入额外库。
- 统一风格：采用 HTML-REPORT.md 中的编辑美学风格，而非企业仪表盘风格。
使用方式 流程分为三步。
- 探索：找到主题及其实质所在并从中收集信息。若针对代码库，可用 Explore 子代理逐区域探索，写作仍由自己完成；不要把文件堆进报告，而是提取值得绘制的结构。若分析已在对话中完成，则整理现有内容，不重新调查。若指向特定来源，则阅读指定的文档或 URL。在仓库中时读取 docs/adr/，ADR 记录的决定应在报告中体现，且不应被静默违背。一旦能画出对象就停止探索。
- 可视化：编写一个自包含 HTML 文件并打开。默认写入操作系统临时目录，解析 $TMPDIR，回退到 /tmp（Windows 为 %TEMP%），路径为 <tmpdir>/<slug>-<timestamp>.html；若用户指定位置或要求保留/提交，则写入该处。无论哪种方式都打印绝对路径并打开（macOS 用 open，Linux 用 xdg-open，Windows 用 start）；若打开失败（无头或 SSH 会话），只打印路径并说明。
- 校验：Mermaid 语法错误不会大声失败，而是渲染成错误块且控制台无提示。需重新检查每个 Mermaid 块中的已知陷阱（含括号、冒号或 HTML 的标签要加引号），然后用无头方式渲染页面：uv run --no-project --with playwright python <skill-dir>/scripts/check_render.py <report.html>。该脚本等待 Mermaid 完成，打开标签页、切换项和 <details>，最终输出 PASS、FAIL 或 BLOCKED。FAIL 需修复 problems 下的每一行并重跑；BLOCKED 表示未验证而非通过，需按提示修复或说明渲染未检查；PASS 后需阅读列出的每张截图，diagram-<n>.png 检查各图可读性，page-<k>.png 按视口高度切片，是手工 CSS/SVG 视觉的唯一检查（标签重叠、箭头未命中目标、文字溢出框等），修复后重跑，并处理每条 warnings、在交付时点名每个未验证的图表。
适用场景 适合把系统、流程、研究发现或决策整理成一份可独立打开、以图表为主的 HTML 报告；适合需要引用 ADR 的场景，当报告描绘的内容受现有 ADR 约束时，用琥珀色标注引用（如“此流程遵循 ADR-0012”），但仅在该 ADR 确实约束所绘内容时使用。
限制
- 需要网络访问才能完整渲染，因为依赖 Tailwind CDN 和 Mermaid ESM 导入。
- 交互仅限内联原生 JS，不引入额外库。
- 若探索中发现 bug、过时文档或设计问题，只在报告中记录，不去修复。
- 校验脚本可能因环境原因返回 BLOCKED，此时渲染属于未验证状态。
- 关于收费、价格、平台支持等具体信息，资料中暂未提供。