用途：把系统组件、流程、调用链、数据管线、状态机等整理成可直接在浏览器打开的技术图，支持架构、工作流、时序、数据流、生命周期五种模式。
主要能力：生成的单个 HTML 自包含内联 SVG，带暗/亮主题切换（localStorage 记忆并尊重 prefers-color-scheme），内置导出菜单（复制 PNG 到剪贴板；原生光栅化下载 PNG/JPEG/WebP，最高 4×；下载双主题 SVG，随宿主 prefers-color-scheme 切换，适合 GitHub README）；颜色走 CSS 变量，保证两套主题一致。
使用方式：四种带类型的渲染器（workflow/sequence/dataflow/lifecycle）用 ajv 对 JSON 做 schema 校验，需先在该技能目录执行 npm install，否则渲染器只打印警告并跳过校验。流程为先阅读 schemas/<type>.schema.json 与 examples 示例，写好 <name>.<type>.json，再运行 node renderers/<type>/render-<type>.mjs <input>.json <output>.html。架构模式用 render-architecture.mjs。若无 shell 权限（如技能作为项目知识引入），退回架构模式手工把 SVG 放入 assets/template.html。
输入与映射：可直接粘贴 Mermaid 代码，但不机械解析，而是读取结构后在其对应模式中重新排版，丢弃原样式，仅保留拓扑与语义。
约束与限制：必须用 CSS 类而非内联颜色，否则主题切换失效；组件、边界、标签、坐标等有硬性布局规则与检查项（两矩形遮罩、箭头先于组件、viewBox 留白等）；渲染器会对重叠、越界、标签碰撞等快速报错，应改 JSON 而非改渲染器；各模式有列/行、像素间距等预算限制。具体收费、价格与平台支持情况暂未提供。