yuanflow-cli 0.1.42 → 0.1.44

package/skills/yuanflow-skill//350/207/252/345/252/222/344/275/223/347/237/245/350/257/206/345/272/223/SKILL.md

@@ -10,13 +10,15 @@ emoji: 🧠
 
 查询时，必须先明确用户具体需求，然后从知识库的一级能力开始，依次使用渐进式查询。不能跳级、跨越式查询。
 
-## 环境判断
+## 外部 CLI 主流程
 
-1. 在 YuanFlow-main 内置环境，优先调用内置工具 `yuanflow_cli_call`。
-2. 在外部 Agent 中，如果本地有 `yuanflow-cli`，直接执行 CLI。
-3. 如果外部环境没有 CLI，再提示用户安装 `npm install -g yuanflow-cli`。
+外部 Agent 或用户直接使用时，使用 `yuanflow-cli knowledge ...` 查询 YuanFlow 自媒体知识库。
 
-不要让用户手动提供 token。YuanFlow-main 内置环境会注入认证 token；外部 CLI 使用 `YUANCHUANG_API_TOKEN`。
+1. 先确认本机可执行 `yuanflow-cli --help`。
+2. 外部 CLI 使用 `YUANCHUANG_API_TOKEN` 或 `yuanflow-cli config set-token <你的令牌>` 完成鉴权。
+3. 先查公开目录，再按 `next_actions` 渐进查询。
+
+不要让用户手动粘贴 token，也不要在回复、日志或文件里暴露 token。
 
 ## 能做什么
 
@@ -77,6 +79,10 @@ yuanflow-cli knowledge rules \
 
 4. 最后基于接口返回的公开规则摘要，完成创作、评估或优化。
 
+## YuanFlow-main 内置环境
+
+在 YuanFlow-main 内置环境，优先调用内置工具 `yuanflow_cli_call`。token、受管包路径和输出目录由 YuanFlow-main 管理，不要要求用户手动提供 token。
+
 ## YuanFlow-main 内置工具调用示例
 
 在 YuanFlow-main 内置环境，调用 `yuanflow_cli_call`，参数数组不要包含 token：

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/SKILL.md

@@ -0,0 +1,77 @@
+---
+name: 视觉卡片生成
+description: 当用户需要生成小红书图文卡片、公众号封面、文章插图、社交媒体配图、海报、信息图、视觉方案卡、商业风格设计图或多风格配图时使用。本 Skill 使用 HTML 模板、风格参考和质量检查脚本生成可复用、可检查、可商业交付的视觉卡片。
+emoji: 🖼️
+---
+
+# 视觉卡片生成
+
+## 外部 CLI 主流程
+
+外部 Agent 或用户直接使用本 Skill 时，优先按本 Skill 的模板和参考文档完成视觉卡片生成；如果任务中需要上传素材、生成图片、理解图片/视频或调用 YuanFlow API，再使用本地 `yuanflow-cli`。
+
+1. 如果本地可执行 `yuanflow-cli --help`，直接使用本地 CLI。
+2. 如果本地没有 `yuanflow-cli`，再提示用户安装 `npm install -g yuanflow-cli`。
+3. 外部 CLI 使用 `YUANCHUANG_API_TOKEN` 或 `yuanflow-cli config set-token <你的令牌>` 完成鉴权。
+
+不要在回复、日志或文件中暴露 token。用户主流程统一称为 YuanFlow API 和 YuanFlow 文件中转，不要求用户配置第三方平台 Key。
+
+本 Skill 本身不新增独立 `yuanflow-cli visual-card` 命令。它通过 Skill 说明、HTML 模板、参考文档和检查脚本完成视觉卡片生产。
+
+## YuanFlow-main 内置环境
+
+只有在 YuanFlow-main 内置环境中，才使用 `yuanflow_cli_call`、`yuanflow_image_request`、`content_workbench_update`、`artifact_files_register` 等受控工具。token、受管包路径、程序数据目录和输出目录由 YuanFlow-main 管理，不写成外部用户必备步骤。
+
+如果用户需要先生成图片素材，可调用 `生图技能` 或 YuanFlow-main 内置图片能力；如果需要理解用户提供的图片/视频素材，可调用 `视觉理解`；如果需要上传本地素材给在线能力使用，可调用 `YuanFlow文件中转工具`。
+
+## 适用输出
+
+- 小红书图文：3:4 封面和 3-9 张正文卡片。
+- 公众号封面：21:9 主封面、1:1 次封面、3:4 竖版封面。
+- 文章插图：16:9、4:3、3:2 的正文配图。
+- 社交媒体视觉：海报、活动图、概念图、产品卖点图、数据图、流程图。
+- 设计方案卡：风格探索板、品牌视觉方向、信息架构卡片、方案对比图。
+
+## 生成流程
+
+1. 识别任务类型：封面、图文卡片、文章插图、社交配图、海报、信息图、风格探索。
+2. 读取 `references/commercial-system.md`，确认比例、尺寸、页面角色、文字限制、证据需求和质量门禁。
+3. 从 `references/style-atlas.md` 选择一个主风格和一个子风格；用户未指定时，按传播目标选择。
+4. 从 `assets/templates/` 复制最接近的 HTML 模板到任务输出目录，命名为 `index.html`。
+5. 在 `.poster` 节点上设置 `data-style`、`data-ratio`，并按页面目标调整布局模块。
+6. 参考 `references/layout-playbook.md` 和 `references/use-case-recipes.md` 组织页面结构，避免每页都变成重复的标题加卡片。
+7. 如果图片或截图是证据，优先使用用户提供的真实素材；如果需要生成图片，只把生成图作为素材，最终文字仍放在 HTML 中排版。
+8. 参考 `references/quality-check.md` 做最终检查；生成 HTML 后尽量运行检查脚本。
+
+检查命令：
+
+```bash
+python scripts/check_visual_card.py <index.html>
+```
+
+## 风格选择规则
+
+- 一组输出默认只使用一个主风格，除非用户明确要求做多风格探索。
+- 通过风格、色板、布局、材质、图片处理和文案节奏制造变化，不靠随机装饰。
+- 不使用无意义气泡、假数据、假 UI、假截图、占位文字或不可读小字。
+- 小红书封面优先保证缩略图可读：主标题清楚，主体视觉明确，正文不拥挤。
+- 文章插图优先服务文章论点，不做成硬广横幅。
+- 不同封面比例要分别设计，不能把 21:9 直接裁成 1:1 或 3:4。
+
+## 资源说明
+
+- `references/style-atlas.md`：风格体系、子风格、识别测试、反模式、HTML 骨架。
+- `references/commercial-system.md`：商业交付骨架、生产标准、复用矩阵。
+- `references/use-case-recipes.md`：封面、文章插图、社交配图、海报和风格探索配方。
+- `references/layout-playbook.md`：按输出类型和内容模式选择布局。
+- `references/quality-check.md`：最终质量检查清单。
+- `assets/templates/`：可复制使用的 HTML 母版。
+- `overview.html`：成熟风格系统和矩阵总览。
+- `scripts/check_visual_card.py`：HTML 静态检查脚本，只依赖 Python 标准库。
+
+## 交付要求
+
+- 给出输出目录路径。
+- 如用户要求渲染图片，给出渲染后的图片文件路径。
+- 简短说明使用的风格、比例和页面数量。
+- 如果使用了网页图片或外部素材，在任务目录中记录来源链接，并在回复中说明。

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/agents/openai.yaml

@@ -0,0 +1,8 @@
+interface:
+  display_name: "视觉卡片生成"
+  short_description: "生成小红书图文、封面、文章插图、海报和商业视觉卡片。"
+  brand_color: "#C8372D"
+  default_prompt: "使用 $视觉卡片生成 将主题、文章、截图、照片、笔记、提纲或脚本转成小红书图文卡片、公众号封面、文章插图、海报或商业视觉设计图。"
+
+policy:
+  allow_implicit_invocation: true

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/assets/templates/editorial-publishing.html

@@ -0,0 +1,65 @@
+<!doctype html>
+<html lang="zh-CN" data-parent-style="editorial-publishing">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Editorial Publishing Template</title>
+  <style>
+    :root {
+      --paper: #f3f0e8;
+      --ink: #12100d;
+      --muted: #716a60;
+      --line: rgba(18,16,13,.22);
+      --accent: #9b2f24;
+      --serif: "Songti SC", "STSong", "SimSun", serif;
+      --sans: system-ui, sans-serif;
+      --mono: ui-monospace, monospace;
+    }
+    * { box-sizing: border-box; }
+    body { margin: 0; padding: 48px; background: #1c1a17; font-family: var(--sans); }
+    .sheet { display: flex; flex-direction: column; align-items: center; gap: 42px; }
+    .poster { position: relative; overflow: hidden; background: var(--paper); color: var(--ink); isolation: isolate; }
+    .poster[data-ratio="xhs"] { width: 1080px; height: 1440px; }
+    .poster[data-ratio="article"] { width: 1600px; height: 900px; }
+    .poster[data-ratio="wide"] { width: 2100px; height: 900px; }
+    .paper-grain { position: absolute; inset: 0; opacity: .26; mix-blend-mode: multiply; background-image: radial-gradient(rgba(0,0,0,.06) 1px, transparent 1.5px); background-size: 4px 4px; }
+    .ep-pad { position: relative; z-index: 2; height: 100%; padding: 88px; display: flex; flex-direction: column; }
+    [data-ratio="article"] .ep-pad, [data-ratio="wide"] .ep-pad { padding: 76px 110px; }
+    .ep-issue, .ep-strip, .small-label { font-family: var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
+    .ep-issue { font-size: 20px; margin: 0 0 34px; }
+    .ep-title { font-family: var(--serif); font-weight: 500; font-size: 112px; line-height: 1.08; letter-spacing: .04em; margin: 0; max-width: 880px; }
+    .ep-deck { font-family: var(--serif); font-size: 32px; line-height: 1.55; color: var(--muted); max-width: 640px; }
+    .ep-photo { margin: 44px 0 0; height: 460px; background: #d9d0c2; overflow: hidden; border: 1px solid var(--line); }
+    .ep-photo.small { width: 52%; height: 360px; margin-left: auto; }
+    .ep-photo img, .object-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
+    .ep-strip { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; font-size: 18px; }
+    .book-page { border: 18px solid rgba(155,47,36,.18); }
+    .vertical { writing-mode: vertical-rl; letter-spacing: .18em; }
+    .seal { width: 64px; height: 64px; border: 2px solid var(--accent); color: var(--accent); display: grid; place-items: center; font-family: var(--serif); margin-top: 28px; }
+    .newspaper { display: grid; grid-template-rows: auto auto 1fr; }
+    .masthead { font-family: var(--serif); font-size: 34px; letter-spacing: .18em; border-bottom: 4px double var(--ink); padding-bottom: 16px; margin: 0 0 32px; }
+    .news-grid { display: grid; grid-template-columns: 1fr 1fr .7fr; gap: 26px; margin-top: 40px; }
+    .news-grid article { border-top: 1px solid var(--line); padding-top: 18px; font-family: var(--serif); font-size: 26px; line-height: 1.55; }
+    .mini-chart { display: flex; gap: 18px; align-items: end; border: 1px solid var(--line); padding: 26px; }
+    .mini-chart span { flex: 1; height: var(--h); background: var(--accent); }
+    .gallery { display: grid; grid-template-columns: 1.2fr .8fr; gap: 54px; align-items: end; }
+    .object-frame { margin: 0; height: 620px; background: #dedbd2; }
+    .plaque { border-top: 1px solid var(--line); padding-top: 24px; }
+    .plaque h2 { font-family: var(--serif); font-size: 54px; margin: 0 0 18px; }
+    .plaque p { font-family: var(--serif); color: var(--muted); font-size: 26px; line-height: 1.55; }
+  </style>
+</head>
+<body>
+  <main class="sheet">
+    <section class="poster magazine-paper" data-ratio="xhs" data-style="magazine-paper">
+      <div class="paper-grain"></div>
+      <main class="ep-pad">
+        <p class="ep-issue">VOL. 04 / FIELD NOTE / 2026</p>
+        <h1 class="ep-title">在信息里<br>找到一条路</h1>
+        <figure class="ep-photo"><img src="assets/hero.jpg" alt=""></figure>
+        <div class="ep-strip"><span>观察</span><span>方法</span><span>结论</span></div>
+      </main>
+    </section>
+  </main>
+</body>
+</html>

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/assets/templates/lifestyle-collage.html

@@ -0,0 +1,49 @@
+<!doctype html>
+<html lang="zh-CN" data-parent-style="lifestyle-collage">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Lifestyle Collage Template</title>
+  <style>
+    :root { --paper:#f2ece6; --ink:#25211d; --muted:#82766b; --line:rgba(37,33,29,.18); --accent:#7f8d74; --serif:"Songti SC","STSong","SimSun",serif; --sans:system-ui,sans-serif; --mono:ui-monospace,monospace; }
+    * { box-sizing:border-box; }
+    body { margin:0; padding:48px; background:#1d1b19; font-family:var(--sans); }
+    .sheet { display:flex; flex-direction:column; align-items:center; gap:42px; }
+    .poster { position:relative; overflow:hidden; background:var(--paper); color:var(--ink); isolation:isolate; }
+    .poster[data-ratio="xhs"] { width:1080px; height:1440px; }
+    .poster[data-ratio="article"] { width:1600px; height:900px; }
+    .lc-pad { height:100%; padding:88px; display:flex; flex-direction:column; position:relative; z-index:2; }
+    [data-ratio="article"] .lc-pad { padding:76px 110px; }
+    .lc-title { font-family:var(--serif); font-size:104px; line-height:1.08; font-weight:500; margin:0 0 34px; }
+    .soft-photo { height:560px; margin:0; border-radius:28px; overflow:hidden; background:#d8d0c6; box-shadow:0 20px 60px rgba(37,33,29,.14); }
+    .soft-photo img { width:100%; height:100%; object-fit:cover; }
+    .note-list { display:flex; gap:18px; margin-top:auto; }
+    .note-list p,.specimen-tags span { padding:18px 24px; background:rgba(255,255,255,.36); border:1px solid var(--line); }
+    .collage-desk { --paper:#ead8ba; --ink:#2d2014; --muted:#7d6750; --accent:#315d93; }
+    .paper-stack { flex:1; position:relative; }
+    .paper-stack figure { position:absolute; width:48%; height:42%; background:#f6ead6; box-shadow:0 14px 30px rgba(45,32,20,.18); margin:0; }
+    .paper-stack figure:nth-child(1) { left:4%; top:10%; transform:rotate(-5deg); }
+    .paper-stack figure:nth-child(2) { right:8%; top:22%; transform:rotate(4deg); }
+    .paper-stack figure:nth-child(3) { left:22%; bottom:8%; transform:rotate(-2deg); }
+    .stamp,.timecode { font-family:var(--mono); letter-spacing:.14em; color:var(--accent); }
+    .botanical-organic { --paper:#eef0df; --ink:#172418; --muted:#62715e; --accent:#3f7d4a; }
+    .specimen { height:520px; margin:0 0 34px; display:grid; place-items:center; background:rgba(63,125,74,.10); border:1px solid var(--line); }
+    .specimen img { max-width:80%; max-height:80%; object-fit:contain; }
+    .specimen-tags { display:flex; gap:16px; margin-top:auto; }
+    .film-contact-sheet { --paper:#1b1712; --ink:#f2dec1; --muted:#b69d78; --line:rgba(242,222,193,.2); --accent:#e0a34d; }
+    .frames { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:auto; }
+    .frames figure { height:260px; margin:0; background:#30271d; border:10px solid #0b0907; }
+  </style>
+</head>
+<body>
+  <main class="sheet">
+    <section class="poster lifestyle-collage soft-studio" data-ratio="xhs" data-style="soft-studio">
+      <main class="lc-pad soft">
+        <h1 class="lc-title">周末整理<br>工作台</h1>
+        <figure class="soft-photo"><img src="assets/table.jpg" alt=""></figure>
+        <div class="note-list"><p>光线</p><p>收纳</p><p>节奏</p></div>
+      </main>
+    </section>
+  </main>
+</body>
+</html>

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/assets/templates/product-brand.html

@@ -0,0 +1,50 @@
+<!doctype html>
+<html lang="zh-CN" data-parent-style="product-brand">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Product Brand Template</title>
+  <style>
+    :root { --paper:#f8f7f2; --ink:#101214; --muted:#6f757c; --line:rgba(16,18,20,.16); --accent:#0d6efd; --accent2:#16a34a; --sans:system-ui,sans-serif; --serif:"Songti SC","STSong","SimSun",serif; --mono:ui-monospace,monospace; }
+    * { box-sizing:border-box; }
+    body { margin:0; padding:48px; background:#191a1b; font-family:var(--sans); }
+    .sheet { display:flex; flex-direction:column; align-items:center; gap:42px; }
+    .poster { position:relative; overflow:hidden; background:var(--paper); color:var(--ink); isolation:isolate; }
+    .poster[data-ratio="xhs"] { width:1080px; height:1440px; }
+    .poster[data-ratio="article"] { width:1600px; height:900px; }
+    .poster[data-ratio="wide"] { width:2100px; height:900px; }
+    .pb-pad { height:100%; padding:88px; display:flex; flex-direction:column; position:relative; z-index:2; }
+    [data-ratio="article"] .pb-pad, [data-ratio="wide"] .pb-pad { padding:76px 110px; }
+    .pb-title { margin:0; font-size:104px; line-height:1.04; font-weight:300; letter-spacing:-.02em; max-width:860px; }
+    .product-hero { flex:1; margin:44px 0; display:grid; place-items:center; background:radial-gradient(circle at center, rgba(13,110,253,.14), transparent 54%); }
+    .product-hero img { max-width:78%; max-height:78%; object-fit:contain; filter:drop-shadow(0 34px 42px rgba(16,18,20,.22)); }
+    .callouts,.feature-tags { display:flex; gap:16px; margin-top:auto; }
+    .callouts span,.feature-tags span { padding:16px 22px; border:1px solid var(--line); background:#fff; font-size:28px; }
+    .luxury-minimal { --paper:#10100f; --ink:#f4ead7; --muted:#a89777; --line:rgba(244,234,215,.18); --accent:#d0a85a; }
+    .luxury .pb-title { font-family:var(--serif); font-weight:500; margin-top:auto; }
+    .isolated { background:transparent; border:1px solid var(--line); }
+    .small-label { font-family:var(--mono); letter-spacing:.14em; color:var(--muted); text-transform:uppercase; }
+    .brand-system { --paper:#f5f3ed; --ink:#121212; --muted:#626262; --accent:#c8372d; --accent2:#243c72; }
+    .palette { display:flex; gap:18px; margin:54px 0; }
+    .palette span { width:120px; height:120px; background:var(--accent); }
+    .palette span:nth-child(2) { background:var(--accent2); }
+    .palette span:nth-child(3) { background:var(--ink); }
+    .component-row { display:flex; gap:18px; margin-top:auto; }
+    .component-row button { border:0; padding:20px 28px; background:var(--accent); color:white; font-size:24px; }
+    .component-row button:nth-child(2) { background:transparent; color:var(--ink); border:1px solid var(--line); }
+    .screen-frame { margin:44px 0 0; height:520px; border:1px solid var(--line); background:#fff; padding:28px; }
+    .screen-frame img { width:100%; height:100%; object-fit:contain; }
+  </style>
+</head>
+<body>
+  <main class="sheet">
+    <section class="poster product-brand product-cutout" data-ratio="xhs" data-style="product-cutout">
+      <main class="pb-pad">
+        <h1 class="pb-title">一个工具<br>解决三件事</h1>
+        <figure class="product-hero"><img src="assets/product.png" alt=""></figure>
+        <div class="callouts"><span>快</span><span>稳</span><span>可控</span></div>
+      </main>
+    </section>
+  </main>
+</body>
+</html>

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/assets/templates/social-campaign.html

@@ -0,0 +1,49 @@
+<!doctype html>
+<html lang="zh-CN" data-parent-style="social-campaign">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Social Campaign Template</title>
+  <style>
+    :root { --paper:#fff04a; --ink:#111; --accent:#ff3b7f; --accent2:#00a1ff; --mono:ui-monospace,monospace; --sans:system-ui,sans-serif; }
+    * { box-sizing: border-box; }
+    body { margin:0; padding:48px; background:#181818; font-family:var(--sans); }
+    .sheet { display:flex; flex-direction:column; align-items:center; gap:42px; }
+    .poster { position:relative; overflow:hidden; background:var(--paper); color:var(--ink); isolation:isolate; }
+    .poster[data-ratio="xhs"] { width:1080px; height:1440px; }
+    .poster[data-ratio="poster"] { width:1200px; height:1800px; }
+    .poster[data-ratio="wide"] { width:2100px; height:900px; }
+    .sc-pad { height:100%; padding:78px; display:flex; flex-direction:column; position:relative; z-index:2; }
+    .sc-title { margin:0; font-size:142px; line-height:.95; font-weight:900; letter-spacing:-.03em; max-width:880px; }
+    .burst,.warning,.event-meta,.ticket { font-family:var(--mono); letter-spacing:.14em; text-transform:uppercase; }
+    .burst { align-self:flex-start; background:var(--accent); color:#fff; padding:14px 18px; transform:rotate(-4deg); margin-bottom:28px; }
+    .cutout-stage { flex:1; margin:38px 0; background:rgba(255,255,255,.28); border:5px solid var(--ink); display:grid; place-items:center; }
+    .cutout-stage img { max-width:72%; max-height:72%; object-fit:contain; }
+    .badge-row { display:flex; gap:16px; margin-top:auto; }
+    .badge-row span { border:4px solid var(--ink); padding:16px 24px; font-size:34px; font-weight:800; background:#fff; }
+    .neo-brutalist { --paper:#f5f5f0; --accent:#ff4a00; }
+    .brutal { border:8px solid var(--ink); }
+    .warning { background:var(--accent); padding:16px 20px; font-size:26px; margin-bottom:34px; }
+    .hard-rows { margin-top:auto; border-top:6px solid var(--ink); }
+    .hard-rows p { margin:0; padding:26px 0; border-bottom:4px solid var(--ink); font-size:46px; font-weight:900; }
+    .maximal-poster { --paper:#101010; --ink:#f7f03a; --accent:#f0185c; --accent2:#00d4ff; }
+    .repeat-word { position:absolute; inset:60px 20px auto; font-size:118px; font-weight:900; color:var(--accent); opacity:.55; line-height:.85; }
+    .maximal .sc-title { margin-top:auto; color:var(--ink); text-shadow:8px 8px 0 var(--accent); }
+    .event-key-visual { --paper:#151414; --ink:#fff1d0; --accent:#ffcf33; --accent2:#ff5a3d; }
+    .key-shape { width:520px; height:520px; background:linear-gradient(135deg,var(--accent),var(--accent2)); margin:auto; transform:rotate(12deg); }
+    .ticket { border-top:2px solid rgba(255,241,208,.4); padding-top:22px; font-size:24px; color:var(--ink); }
+  </style>
+</head>
+<body>
+  <main class="sheet">
+    <section class="poster social-campaign pop-magazine" data-ratio="xhs" data-style="pop-magazine">
+      <main class="sc-pad">
+        <p class="burst">SAVE THIS</p>
+        <h1 class="sc-title">这 6 个<br>真的好用</h1>
+        <div class="cutout-stage"><img src="assets/item.png" alt=""></div>
+        <div class="badge-row"><span>实测</span><span>清单</span><span>避坑</span></div>
+      </main>
+    </section>
+  </main>
+</body>
+</html>

package/skills/yuanflow-skill//350/247/206/350/247/211/345/215/241/347/211/207/347/224/237/346/210/220/assets/templates/technical-diagram.html

@@ -0,0 +1,45 @@
+<!doctype html>
+<html lang="zh-CN" data-parent-style="technical-diagram">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Technical Diagram Template</title>
+  <style>
+    :root { --paper:#fafaf8; --ink:#0a0a0a; --muted:#737373; --line:#d4d4d2; --accent:#002fa7; --sans:system-ui,sans-serif; --mono:ui-monospace,monospace; }
+    * { box-sizing:border-box; }
+    body { margin:0; padding:48px; background:#1b1b1b; font-family:var(--sans); }
+    .sheet { display:flex; flex-direction:column; align-items:center; gap:42px; }
+    .poster { position:relative; overflow:hidden; background:var(--paper); color:var(--ink); isolation:isolate; }
+    .poster[data-ratio="xhs"] { width:1080px; height:1440px; }
+    .poster[data-ratio="article"] { width:1600px; height:900px; }
+    .poster[data-ratio="wide"] { width:2100px; height:900px; }
+    .td-pad { height:100%; padding:88px; display:flex; flex-direction:column; position:relative; z-index:2; }
+    [data-ratio="article"] .td-pad, [data-ratio="wide"] .td-pad { padding:76px 110px; }
+    .td-meta,.legend,.terminal { font-family:var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 28px; }
+    .td-title { margin:0; font-size:118px; line-height:1.04; font-weight:250; letter-spacing:-.02em; max-width:860px; }
+    .td-matrix { margin-top:auto; display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
+    .td-matrix div,.hud-grid div,.node-map span,.flow span { border:1px solid var(--line); padding:30px; font-size:34px; background:rgba(0,0,0,.03); }
+    .blueprint-technical { --paper:#092448; --ink:#e6f2ff; --muted:#9db9d6; --line:rgba(230,242,255,.26); --accent:#58c7ff; }
+    .blueprint::before { content:""; position:absolute; inset:0; opacity:.22; background-image:linear-gradient(to right,var(--ink) 1px,transparent 1px),linear-gradient(to bottom,var(--ink) 1px,transparent 1px); background-size:48px 48px; }
+    .node-map { margin-top:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; position:relative; z-index:2; }
+    .cyber-interface { --paper:#090b12; --ink:#edf4ff; --muted:#8aa0bf; --line:rgba(237,244,255,.22); --accent:#00e0ff; }
+    .cyber { background:radial-gradient(circle at 80% 20%, rgba(0,224,255,.18), transparent 34%); }
+    .terminal { color:var(--accent); }
+    .hud-grid { margin-top:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
+    .calm-diagram { --paper:#f7f5ef; --ink:#1f2933; --muted:#6b7280; --line:#d8d4c8; --accent:#4c6fff; }
+    .flow { margin-top:auto; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
+    .flow span { border-color:var(--accent); text-align:center; }
+  </style>
+</head>
+<body>
+  <main class="sheet">
+    <section class="poster technical-diagram swiss-data" data-ratio="xhs" data-style="swiss-data">
+      <main class="td-pad">
+        <p class="td-meta">SYSTEM / 01</p>
+        <h1 class="td-title">一个流程<br>四个节点</h1>
+        <div class="td-matrix"><div>输入</div><div>处理</div><div>验证</div><div>输出</div></div>
+      </main>
+    </section>
+  </main>
+</body>
+</html>