项目看板生成 Skill，用于把逻辑大纲或口述内容整理成任意项目的 HTML 看板。
触发条件
用户说「创建项目看板」「做个看板」「项目板」「看板生成」「board」时触发。用户提供内容的形式可能是：一段口述/散乱的思考（对话中的聊天文字）、一份逻辑大纲（已有结构的项目描述），或混合模式（既有大纲又有口述补充）。
SVG 图标资源
看板中涉及品牌/工具/平台名称时，使用 thesvg MCP 获取高质量品牌 SVG 图标，而非手绘占位符。相关 MCP 工具调用包括：search_icons(query: "github") 搜索图标并返回 slug + variants；get_icon(slug: "github", variant: "mono") 获取原始 SVG 代码；get_icon_url(slug: "github") 获取 CDN 嵌入 URL；list_categories() 浏览所有分类。
使用规则：品牌名出现（GitHub、Notion、飞书等）时调 search_icons 找到对应 slug，get_icon 取 mono 或 default variant；人在/角色占位图标不用品牌图标，用纯 CSS 圆点/色块；装饰性小图标（箭头、勾选等）用内联 SVG 原语（<svg> + <path>），保持单文件零依赖。嵌入方式有两种：内联 SVG（推荐，零依赖）或 CDN URL（图标多时减少文件体积）。变体选择上，深色模式优先 default 或 light variant，浅色模式优先 default 或 dark，mono variant 在两种模式下都可使用，用 CSS filter 或直接调整 fill/stroke 适配主题。不适用场景：人名/角色用色块圆点；抽象概念（如「壁垒」「时间窗口」）用语义色标记；图标库中找不到的用简洁的内联 SVG 原语，不要硬凑。
第一步：结构梳理
收到用户内容后，不要立即写代码。先做结构梳理，输出一份「看板蓝图」给用户确认。分析框架从用户提供的内容中提取以下维度：已决项（Decided，已经确定、不再讨论的决策/事实）、待决项（Open Questions，需要回答的问题，标注紧急度 must / can-wait / confirm）、依赖链（Dependencies，哪些事是另一些事的前提，上下游关系）、行动路线（Actions，具体要做的事，按时间/阶段分组）、交付物（Deliverables，做完后手里应该有的东西）。
蓝图输出格式包含板块规划、信息密度（已决项数量、待决项数量及 must/can-wait 分布、依赖链层级数、行动项数量、交付物数量）、缺失信息（指出用户内容中模糊或缺失的地方，一次性列出），最后提示确认后开始生成看板。用户确认蓝图后进入第二步，用户说「就这样」「直接做」「没问题」即视为确认。
第二步：看板生成
技术约束：格式为单个 .html 文件，零依赖，浏览器直接打开；字体为 MiSans 本地 + Outfit Google Fonts + CJK 系统回退；主题为深色/浅色双主题，localStorage 持久化用户选择；尺寸 max-width 1200px，响应式（< 960px 单列折叠）；打印时 @media print 隐藏 footer/toggle，卡片 break-inside: avoid。
Design System（强制）：必须严格遵循参数化规范，包括色彩体系（:root 变量，深色模式为默认，浅色模式通过 html[data-theme="light"] 覆盖）、语义色彩映射（完成/通过/积极用 accent 绿，警告/进行中用 amber，紧急/未决/阻塞用 rose，信息/正常/参考用 blue，补充/特殊用 purple）、排版层级（页面标题、板块标题、卡片标题、正文、辅助文字、标签/元数据、列头标签各有规定字号与字重）、粗体修正、Surface 层级（标准卡片、紧凑项、内联条）与交互态（卡片 hover、按钮/标签 :active 的 scale(0.96) 触觉反馈、高亮卡片、右上角圆形主题切换按钮）。
板块组件库：根据蓝图规划，从 Header（必须）、Section 容器（必须）、已决项网格、依赖链、泳道对比表（Swim Lane）、状态表格、时间/阶段卡片、交付物网格、Footer（必须）中选取并组合。组件选取规则：蓝图中有已决项用已决项网格；有待决问题列表用状态表格；有上下游依赖用依赖链；有多方案/多维度对比用泳道对比表；按时间/阶段划分用时间卡片；有做完后手里有什么用交付物网格。板块顺序原则：已决地基 → 依赖链/全景 → 核心决策 → 开放问题 → 行动路线 → 交付物。
交互特性：主题切换（深色/浅色，localStorage 持久化）、卡片 hover（边框变亮 + 投影浮起）、:active 触觉（scale(0.96) 模拟物理按压）、可点击行（cursor: pointer + onclick 跳转，如有链接）、status badge 可点击切换（可选，点击循环切换状态）。
第三步：输出
将完整 HTML 写入 00_专注区/ 目录，文件名格式：{项目名}.html；告知用户文件位置；询问是否需要微调。
反模式（禁止）
禁止使用 emoji，用语义色标记 + 图标替代；禁止使用纯黑 #000 或纯白 #fff 文字；禁止使用实色灰色卡片背景（必须用 rgba 白色叠加层）；禁止使用实色边框（必须用 rgba 透明度边框）；禁止使用 Inter 字体；禁止使用三列等宽卡片布局（除非是 decided-grid 或 deliverable-grid 的紧凑项）；禁止使用 h-screen（必须用 min-height: 100dvh）；禁止在深色模式下使用通用 rgba(0,0,0,x) 阴影（必须用色调阴影）；禁止泛化 AI 话术（"elevate"、"seamless"、"next-gen"等）。
参考实现
完整的 CSS + HTML 组件参考位于 assets/component-reference.html（包含所有组件的视觉效果和 HTML 结构示例）。生成看板时，直接复制此文件中的 CSS 和组件 HTML 结构，替换占位内容为实际项目内容。这是权威样式源——不要自行发明 CSS，从这个文件里取。