wangle/MetaSkill
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

le-wechat-article v1.5.1：版式基线落地——①开篇轻量化：四张封面卡（暖橙/摸鱼绿/摸鱼票据/橄榄）瘦身为导语条，去大字主标题/头图/公司落款（公众号后台已承担），补齐「导语与外标题错层」文案策略；②侧边距：微信 App 自带边距为主边距，HTML 每侧合计 ≤16px（容器/模块 ≤6px、卡片 10~14px、嵌套 ≤12px），全 7 主题合计 156 处收紧，正文列宽占屏 69~76%→80%+；③字号阶梯整体 +1（≥12px 全升 414 处：正文 15→16px、moyu 系 14→15px，≤11px 装饰微标不动）；ENGINE 新增「版式基线」三铁律（v1.5.1）+ theme-generator 生成钩子，未来新主题强制合规；新增暖橙主题 theme-warm-orange（36 组件，含预览资产）并入主题库，SKILL.md 主题计数 6→7；topic-facts 补「超级 AI 妈妈」客户事实卡

Browse Source
This commit is contained in:
leroy
2026-11-07 15:45:11 +08:00
parent 08c615d9fd
commit f7b7740829
15 changed files with 1664 additions and 498 deletions
Download Patch File Download Diff File Expand all files Collapse all files
skills/le-wechat-article/references/themes/theme-olive-journal.md
+84 -102
View File
@@ -30,26 +30,26 @@
标签浅底： #e5e7e0
强调橙（关键词下划线/前导词/CTA）： #ed7b2f
陶土棕装饰（进行中/次强调）： #d4c9b8（配边框 #b17816）
正文字号： 14px
正文字号： 15px
正文行高： 1.9
全局行高： 1.75
最大宽度： 677px
容器内边距： 8px
区块间距： margin-top: 24px（首块头图卡除外）
圆角： 6px（统一小圆角，不用大圆角）
阴影： 整体几乎无阴影，靠边框 + 色块分层，仅头图卡的插画占位区可有极轻装饰
阴影： 整体几乎无阴影，靠边框 + 色块分层
```
字体栈：`'IBM Plex Sans',-apple-system,system-ui,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif`
**正文关键词下划线**（对应 theme-index"正文下划线 CSS"列）：`border-bottom:2px solid #ed7b2f;font-weight:600;color:#23251d;`——直接复用本主题头图卡"强调词"与重点观点卡里已经出现的橙色下划线语言，保持主题内一致。
**正文关键词下划线**（对应 theme-index"正文下划线 CSS"列）：`border-bottom:2px solid #ed7b2f;font-weight:600;color:#23251d;`——直接复用本主题重点观点卡里已经出现的橙色下划线语言，保持主题内一致。
---
## 组件 1 全局容器
```html
<section style="max-width:677px;margin:0 auto;padding:8px;box-sizing:border-box;background:#fdfdf8;color:#4d4f46;font-family:'IBM Plex Sans',-apple-system,system-ui,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;line-height:1.75;">
<section style="max-width:677px;margin:0 auto;padding:4px;box-sizing:border-box;background:#fdfdf8;color:#4d4f46;font-family:'IBM Plex Sans',-apple-system,system-ui,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;line-height:1.75;">
<!-- 所有组件放在这里，第一个子元素是组件 2 头图卡，其余组件均自带 margin-top:24px -->
@@ -58,47 +58,31 @@
---
## 组件 2 头图卡 hero-card
## 组件 2 头图卡 hero-card（内刊导语条）
**用途**：文章开篇头图区，内刊风格：顶部标签+日期条，主标题+强调词，侧边配一枚手绘风占位插画，底部深色摘要条收尾。整篇文章唯一一处、放在最前面，不设 `margin-top`。
**用途**：文章开篇区，内刊风格：顶部标签+日期条，一句话开篇导语，底部深色摘要条收尾。整篇文章唯一一处、放在最前面，不设 `margin-top`。开篇轻量形态：不放大字主标题、不放头图（公众号后台已承担标题与封面图）；原头图并入正文首个图位。
**可替换字段**：`{{内刊标签}}` `{{日期}}` `{{旧标题占位}}`（可选，删除线小字，无需要时整行删除）`{{主标题}}` `{{强调词}}` `{{副标题说明}}` `{{底部摘要}}` `{{标签1}}` `{{标签2}}`
> **文案策略（先读，比代码重要）**：开篇导语和外标题**两层错开**——外标题卖"为什么点开"，导语卖"里面讲什么、读完得到什么"；已知外标题时**禁止原样复述**其核心关键词，从文章第一段或核心论点提炼一句。
**可替换字段**：`{{内刊标签}}` `{{日期}}` `{{开篇导语}}` `{{底部摘要}}` `{{标签1}}` `{{标签2}}`
```html
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;overflow:hidden;font-family:'IBM Plex Sans',-apple-system,system-ui,sans-serif;">
<section style="padding:28px 24px 22px;">
<section style="display:flex;align-items:center;gap:8px;margin-bottom:22px;">
<section style="padding:20px 12px 18px;">
<section style="display:flex;align-items:center;gap:8px;margin-bottom:18px;">
<span style="width:8px;height:8px;background:#1e1f23;border-radius:50%;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<span style="font-size:10px;font-weight:700;letter-spacing:3px;color:#65675e;"><span leaf="">{{内刊标签}}</span></span>
<span style="flex:1;height:1px;background:#bfc1b7;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<span style="font-size:10px;color:#9ea096;font-weight:500;font-variant-numeric:tabular-nums;"><span leaf="">{{日期}}</span></span>
</section>
<section style="display:flex;align-items:stretch;gap:18px;">
<section style="flex:1;min-width:0;">
<p style="font-size:14px;color:#9ea096;margin:0 0 8px;letter-spacing:0.3px;text-decoration:line-through;"><span leaf="">{{旧标题占位}}</span></p>
<p style="font-size:24px;font-weight:800;color:#23251d;margin:0 0 10px;line-height:1.15;letter-spacing:-0.75px;">
<span leaf="">{{主标题}}</span><span style="color:#4d4f46;"><span leaf="">&nbsp;·&nbsp;</span></span><span style="border-bottom:3px solid #e5e7e0;"><span leaf="">{{强调词}}</span></span>
</p>
<section style="display:flex;align-items:center;gap:4px;margin-bottom:12px;">
<span style="width:22px;height:3px;background:#1e1f23;border-radius:2px;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<span style="width:8px;height:3px;background:#bfc1b7;border-radius:2px;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
</section>
<p style="font-size:13px;color:#65675e;margin:0;line-height:1.7;"><span leaf="">{{副标题说明}}</span></p>
</section>
<section style="flex-shrink:0;width:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#eeefe9;border:1px dashed #bfc1b7;border-radius:6px;padding:8px;">
<svg width="72" height="72" viewBox="0 0 64 64" aria-hidden="true" style="display:block;">
<ellipse cx="32" cy="36" rx="22" ry="18" fill="none" stroke="#4d4f46" stroke-width="2"></ellipse>
<circle cx="26" cy="30" r="3" fill="#4d4f46"></circle>
<circle cx="38" cy="30" r="3" fill="#4d4f46"></circle>
<path d="M28 40 Q32 44 36 40" fill="none" stroke="#4d4f46" stroke-width="1.5"></path>
<path d="M12 34 L8 28 M52 34 L56 28" stroke="#bfc1b7" stroke-width="2" stroke-linecap="round"></path>
</svg>
<span style="font-size:8px;font-weight:700;color:#9ea096;letter-spacing:1px;margin-top:4px;"><span leaf="">DOODLE</span></span>
</section>
<section style="display:flex;align-items:center;gap:4px;margin-bottom:12px;">
<span style="width:22px;height:3px;background:#1e1f23;border-radius:2px;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<span style="width:8px;height:3px;background:#bfc1b7;border-radius:2px;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
</section>
<p style="font-size:14px;color:#4d4f46;margin:0;line-height:1.8;"><span leaf="">{{开篇导语}}</span></p>
</section>
<section style="background:#1e1f23;padding:11px 24px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;">
<p style="font-size:12px;color:rgba(255,255,255,0.92);margin:0;font-weight:600;"><span leaf="">{{底部摘要}}</span></p>
<section style="background:#1e1f23;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;">
<p style="font-size:13px;color:rgba(255,255,255,0.92);margin:0;font-weight:600;"><span leaf="">{{底部摘要}}</span></p>
<section style="display:flex;gap:6px;flex-wrap:wrap;">
<span style="background:#e5e7e0;color:#23251d;padding:3px 8px;border-radius:4px;font-size:8px;font-weight:700;border:1px solid #bfc1b7;"><span leaf="">{{标签1}}</span></span>
<span style="background:#e5e7e0;color:#23251d;padding:3px 8px;border-radius:4px;font-size:8px;font-weight:700;border:1px solid #bfc1b7;"><span leaf="">{{标签2}}</span></span>
@@ -107,8 +91,6 @@
</section>
```
（`{{旧标题占位}}` 那一行没有真实"旧标题"内容时整行 `<p>` 删除，不留占位删除线空行。）
---
## 组件 3 章节标题 section-title
@@ -122,12 +104,12 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:center;gap:14px;">
<section style="text-align:center;flex-shrink:0;">
<p style="margin:0;font-size:24px;font-weight:800;color:#23251d;line-height:1;letter-spacing:-2px;"><span leaf="">{{编号}}</span></p>
<p style="margin:0;font-size:25px;font-weight:800;color:#23251d;line-height:1;letter-spacing:-2px;"><span leaf="">{{编号}}</span></p>
<p style="margin:0;font-size:8px;font-weight:700;color:#9ea096;letter-spacing:2px;"><span leaf="">PART</span></p>
</section>
<span style="width:1px;height:36px;background:#bfc1b7;flex-shrink:0;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<section>
<p style="margin:0 0 1px;font-size:17px;font-weight:800;color:#23251d;letter-spacing:0.2px;"><span leaf="">{{标题}}</span></p>
<p style="margin:0 0 1px;font-size:18px;font-weight:800;color:#23251d;letter-spacing:0.2px;"><span leaf="">{{标题}}</span></p>
<p style="margin:0;font-size:11px;font-weight:600;color:#65675e;letter-spacing:1.2px;"><span leaf="">{{副标题}}</span></p>
</section>
</section>
@@ -145,7 +127,7 @@
```html
<section style="margin-top:24px;">
<section style="background:#eeefe9;border:1px solid #bfc1b7;border-radius:6px;padding:12px 16px;font-family:'IBM Plex Sans',-apple-system,sans-serif;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;">
<section style="background:#eeefe9;border:1px solid #bfc1b7;border-radius:6px;padding:12px 10px;font-family:'IBM Plex Sans',-apple-system,sans-serif;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;">
<p style="margin:0;font-size:10px;font-weight:800;letter-spacing:4px;color:#23251d;"><span leaf="">{{刊头标签}}</span></p>
<section style="display:flex;gap:8px;flex-wrap:wrap;">
<span style="font-size:10px;color:#65675e;font-weight:700;"><span leaf="">{{版本号}}</span></span>
@@ -166,7 +148,7 @@
```html
<section style="margin-top:24px;">
<section style="background:#1e1f23;border:1px solid #23251d;border-radius:6px;overflow:hidden;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;">
<section style="padding:12px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;">
<p style="margin:0;font-size:10px;font-weight:800;letter-spacing:4px;color:#ffffff;"><span leaf="">{{刊头标签}}</span></p>
<p style="margin:0;font-size:10px;color:rgba(255,255,255,0.68);"><span leaf="">{{说明文字}}</span></p>
</section>
@@ -184,7 +166,7 @@
```html
<section style="margin-top:24px;">
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;padding:14px 16px;font-family:'IBM Plex Sans',-apple-system,sans-serif;display:flex;align-items:center;justify-content:space-between;gap:10px;">
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;padding:14px 10px;font-family:'IBM Plex Sans',-apple-system,sans-serif;display:flex;align-items:center;justify-content:space-between;gap:10px;">
<section style="display:flex;align-items:center;gap:10px;">
<span style="display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#1e1f23;color:#fff;font-size:11px;font-weight:800;"><span leaf="">{{期号}}</span></span>
<section>
@@ -210,7 +192,7 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:center;gap:10px;">
<span style="background:#1e1f23;color:#fff;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:700;"><span leaf="">{{步骤序号}}</span></span>
<span style="font-size:14px;font-weight:600;color:#4d4f46;"><span leaf="">{{步骤标题}}</span></span>
<span style="font-size:15px;font-weight:600;color:#4d4f46;"><span leaf="">{{步骤标题}}</span></span>
</section>
</section>
</section>
@@ -227,7 +209,7 @@
```html
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<h3 style="font-size:18px;font-weight:700;color:#23251d;margin:0;padding:0 2px;display:block;width:fit-content;box-shadow:inset 0 -0.5em 0 rgba(245,78,0,0.18);"><span leaf="">{{标题文字}}</span></h3>
<h3 style="font-size:19px;font-weight:700;color:#23251d;margin:0;padding:0 2px;display:block;width:fit-content;box-shadow:inset 0 -0.5em 0 rgba(245,78,0,0.18);"><span leaf="">{{标题文字}}</span></h3>
</section>
</section>
```
@@ -245,7 +227,7 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;border-bottom:1px solid #bfc1b7;padding-bottom:10px;">
<span style="font-size:10px;font-weight:800;letter-spacing:3px;color:#ed7b2f;text-transform:uppercase;"><span leaf="">{{Kicker标签}}</span></span>
<span style="font-size:18px;font-weight:800;color:#23251d;line-height:1.2;"><span leaf="">{{标题}}</span></span>
<span style="font-size:19px;font-weight:800;color:#23251d;line-height:1.2;"><span leaf="">{{标题}}</span></span>
<span style="margin-left:auto;font-size:10px;color:#9ea096;font-variant-numeric:tabular-nums;"><span leaf="">{{进度}}</span></span>
</section>
</section>
@@ -263,7 +245,7 @@
```html
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0;font-size:14px;line-height:1.9;text-align:justify;color:#4d4f46;">
<p style="margin:0;font-size:15px;line-height:1.9;text-align:justify;color:#4d4f46;">
<span leaf="">{{正文内容}}</span>
</p>
</section>
@@ -293,7 +275,7 @@
**d. 行内代码标签** —— 技术名词/字段名/命令
```html
<span style="background:#eeefe9;color:#23251d;padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:13px;border:1px solid #b6b7af;"><span leaf="">{{代码}}</span></span>
<span style="background:#eeefe9;color:#23251d;padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:14px;border:1px solid #b6b7af;"><span leaf="">{{代码}}</span></span>
```
**e. 删除线旧词** —— 与"新旧对照段落"（组件 12）配套，单独用时表示"已废弃/被替代的说法"
@@ -313,8 +295,8 @@
```html
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0;font-size:14px;color:#4d4f46;line-height:1.9;">
<span leaf="">{{正文前半}}&nbsp;</span><span style="background:#eeefe9;color:#23251d;padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:13px;border:1px solid #b6b7af;"><span leaf="">{{代码}}</span></span><span leaf="">&nbsp;{{正文后半}}</span>
<p style="margin:0;font-size:15px;color:#4d4f46;line-height:1.9;">
<span leaf="">{{正文前半}}&nbsp;</span><span style="background:#eeefe9;color:#23251d;padding:2px 6px;border-radius:4px;font-family:ui-monospace,Menlo,Monaco,Consolas,monospace;font-size:14px;border:1px solid #b6b7af;"><span leaf="">{{代码}}</span></span><span leaf="">&nbsp;{{正文后半}}</span>
</p>
</section>
</section>
@@ -331,8 +313,8 @@
```html
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0;font-size:14px;line-height:1.9;text-align:justify;color:#4d4f46;">
<span style="font-size:14px;color:#9ea096;letter-spacing:0.3px;text-decoration:line-through;"><span leaf="">{{旧表述}}</span></span>
<p style="margin:0;font-size:15px;line-height:1.9;text-align:justify;color:#4d4f46;">
<span style="font-size:15px;color:#9ea096;letter-spacing:0.3px;text-decoration:line-through;"><span leaf="">{{旧表述}}</span></span>
<span style="margin-left:6px;font-weight:700;color:#23251d;"><span leaf="">{{新表述}}</span></span>
<span style="margin-left:6px;background:#e5e7e0;padding:1px 5px;border-radius:4px;font-weight:600;color:#23251d;border:1px solid #bfc1b7;"><span leaf="">{{差异点}}</span></span>
</p>
@@ -352,7 +334,7 @@
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<ul style="margin:0;padding-left:22px;line-height:1.8;list-style-position:outside;">
<li style="margin-bottom:8px;font-size:15px;color:#4d4f46;list-style-type:disc;">
<li style="margin-bottom:8px;font-size:16px;color:#4d4f46;list-style-type:disc;">
<section><span leaf="">{{列表项}}</span></section>
</li>
</ul>
@@ -371,12 +353,12 @@
```html
<section style="margin-top:24px;">
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;overflow:hidden;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="padding:10px 16px;background:#1e1f23;display:flex;align-items:center;justify-content:space-between;gap:10px;">
<section style="padding:10px 10px;background:#1e1f23;display:flex;align-items:center;justify-content:space-between;gap:10px;">
<p style="margin:0;font-size:10px;font-weight:800;letter-spacing:2px;color:#ffffff;"><span leaf="">{{批注标签}}</span></p>
<span style="font-size:10px;color:rgba(255,255,255,0.65);"><span leaf="">{{批注小字}}</span></span>
</section>
<section style="padding:16px 18px 18px;background:#eeefe9;">
<p style="margin:0;font-size:14px;line-height:1.9;color:#4d4f46;text-align:justify;"><span leaf="">{{编者按正文}}</span></p>
<section style="padding:16px 12px 18px;background:#eeefe9;">
<p style="margin:0;font-size:15px;line-height:1.9;color:#4d4f46;text-align:justify;"><span leaf="">{{编者按正文}}</span></p>
</section>
</section>
</section>
@@ -393,8 +375,8 @@
```html
<section style="margin-top:24px;">
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="background:#fdfdf8;border-radius:6px;padding:16px 18px;border:1px solid #bfc1b7;">
<p style="font-size:14px;color:#4d4f46;margin:0;line-height:1.8;text-align:justify;">
<section style="background:#fdfdf8;border-radius:6px;padding:16px 12px;border:1px solid #bfc1b7;">
<p style="font-size:15px;color:#4d4f46;margin:0;line-height:1.8;text-align:justify;">
<strong style="color:#23251d;border-bottom:3px solid #ed7b2f;"><span leaf="">{{重点观点}}</span></strong><span leaf="">&nbsp;{{补充说明}}</span>
</p>
</section>
@@ -464,7 +446,7 @@
<section style="border-radius:6px;overflow:hidden;border:1px solid #bfc1b7;display:block;">
<span leaf=""><img src="{{图片URL}}" alt="图片" style="max-width:100%;height:auto;display:block;margin:0 auto;"></span>
</section>
<figcaption style="font-size:13px;line-height:1.7;color:#65675e;text-align:center;margin-top:10px;"><span leaf="">{{图片说明}}</span></figcaption>
<figcaption style="font-size:14px;line-height:1.7;color:#65675e;text-align:center;margin-top:10px;"><span leaf="">{{图片说明}}</span></figcaption>
</figure>
</section>
```
@@ -482,9 +464,9 @@
```html
<section style="margin-top:24px;">
<section style="padding:18px;border-radius:6px;background:#fdfdf8;border:1px solid #bfc1b7;text-align:center;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0 0 12px;font-size:12px;color:#65675e;font-weight:700;letter-spacing:1px;"><span leaf="">{{图表标签}}</span></p>
<p style="margin:0 0 12px;font-size:13px;color:#65675e;font-weight:700;letter-spacing:1px;"><span leaf="">{{图表标签}}</span></p>
<section style="min-height:140px;border-radius:6px;background:#eeefe9;display:flex;align-items:center;justify-content:center;border:1px dashed #bfc1b7;">
<span style="font-size:14px;color:#4d4f46;"><span leaf="">{{占位说明}}</span></span>
<span style="font-size:15px;color:#4d4f46;"><span leaf="">{{占位说明}}</span></span>
</section>
</section>
</section>
@@ -503,12 +485,12 @@
<section style="background:#eeefe9;padding:16px;border-radius:6px;border:1px solid #bfc1b7;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:stretch;justify-content:center;gap:8px;">
<section style="flex:1;text-align:center;padding:10px 8px;background:#1e1f23;border-radius:6px;border:1px solid #23251d;">
<p style="font-size:13px;font-weight:800;color:#fff;margin:0 0 3px;"><span leaf="">{{左侧标题}}</span></p>
<p style="font-size:14px;font-weight:800;color:#fff;margin:0 0 3px;"><span leaf="">{{左侧标题}}</span></p>
<p style="font-size:10px;color:rgba(255,255,255,0.75);margin:0;line-height:1.5;"><span leaf="">{{左侧说明}}</span></p>
</section>
<section style="display:flex;align-items:center;color:#bfc1b7;font-size:14px;padding:0 4px;"><span leaf="">vs</span></section>
<section style="display:flex;align-items:center;color:#bfc1b7;font-size:15px;padding:0 4px;"><span leaf="">vs</span></section>
<section style="flex:1;text-align:center;padding:10px 8px;background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;">
<p style="font-size:13px;font-weight:800;color:#23251d;margin:0 0 3px;"><span leaf="">{{右侧标题}}</span></p>
<p style="font-size:14px;font-weight:800;color:#23251d;margin:0 0 3px;"><span leaf="">{{右侧标题}}</span></p>
<p style="font-size:10px;color:#65675e;margin:0;line-height:1.5;"><span leaf="">{{右侧说明}}</span></p>
</section>
</section>
@@ -528,19 +510,19 @@
<section style="margin-top:24px;">
<section style="border-radius:6px;overflow:hidden;border:1px solid #bfc1b7;background:#fdfdf8;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;background:#eeefe9;border-bottom:1px solid #bfc1b7;">
<section style="width:35%;padding:10px 12px;font-size:12px;font-weight:800;color:#23251d;"><span leaf="">{{维度列名}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:12px;font-weight:800;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{方案A名}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:12px;font-weight:800;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{方案B名}}</span></section>
<section style="width:35%;padding:10px 12px;font-size:13px;font-weight:800;color:#23251d;"><span leaf="">{{维度列名}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;font-weight:800;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{方案A名}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;font-weight:800;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{方案B名}}</span></section>
</section>
<section style="display:flex;border-bottom:1px solid #bfc1b7;">
<section style="width:35%;padding:10px 12px;font-size:13px;color:#4d4f46;"><span leaf="">{{行标题}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{A值}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{B值}}</span></section>
<section style="width:35%;padding:10px 12px;font-size:14px;color:#4d4f46;"><span leaf="">{{行标题}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:14px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{A值}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:14px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{B值}}</span></section>
</section>
<section style="display:flex;">
<section style="width:35%;padding:10px 12px;font-size:13px;color:#4d4f46;"><span leaf="">{{行标题}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{A值}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:13px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{B值}}</span></section>
<section style="width:35%;padding:10px 12px;font-size:14px;color:#4d4f46;"><span leaf="">{{行标题}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:14px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{A值}}</span></section>
<section style="width:32.5%;padding:10px 12px;font-size:14px;color:#23251d;border-left:1px solid #bfc1b7;"><span leaf="">{{B值}}</span></section>
</section>
</section>
</section>
@@ -558,9 +540,9 @@
```html
<section style="margin-top:24px;">
<section style="background:#eeefe9;border-radius:6px;padding:22px 18px;border:1px solid #bfc1b7;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="background:#eeefe9;border-radius:6px;padding:20px 12px;border:1px solid #bfc1b7;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="font-size:10px;color:#65675e;margin:0 0 4px;text-transform:uppercase;letter-spacing:2px;font-weight:600;"><span leaf="">{{FLOW标签}}</span></p>
<p style="font-size:13px;color:#23251d;font-weight:600;margin:0 0 8px;"><span leaf="">{{流程说明}}</span></p>
<p style="font-size:14px;color:#23251d;font-weight:600;margin:0 0 8px;"><span leaf="">{{流程说明}}</span></p>
<svg viewBox="0 0 400 82" style="width:100%;height:auto;" role="img" aria-label="流程示意">
<rect x="2" y="14" width="58" height="48" rx="4" fill="#fdfdf8" stroke="#4d4f46" stroke-width="1.5"></rect>
<text x="31" y="34" font-size="9" fill="#23251d" text-anchor="middle" font-weight="700" font-family="IBM Plex Sans,sans-serif"><tspan leaf="">节点一</tspan></text>
@@ -601,11 +583,11 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="margin-bottom:14px;">
<p style="margin:0 0 6px;">
<span style="display:inline-block;font-size:13px;font-weight:700;color:#23251d;background:#e5e7e0;padding:3px 10px;border-radius:999px;border:1px solid #bfc1b7;">
<span style="display:inline-block;font-size:14px;font-weight:700;color:#23251d;background:#e5e7e0;padding:3px 10px;border-radius:999px;border:1px solid #bfc1b7;">
<span style="display:inline-block;width:6px;height:6px;background:#ed7b2f;border-radius:50%;margin-right:5px;vertical-align:middle;overflow:hidden;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span><span leaf="">&nbsp;{{条目标题}}&nbsp;</span>
</span>
</p>
<p style="font-size:13px;color:#4d4f46;margin:0;line-height:1.7;text-align:justify;"><span leaf="">{{条目说明}}</span></p>
<p style="font-size:14px;color:#4d4f46;margin:0;line-height:1.7;text-align:justify;"><span leaf="">{{条目说明}}</span></p>
</section>
</section>
</section>
@@ -624,10 +606,10 @@
<section style="background:#fdfdf8;border:1px solid #bfc1b7;padding:18px;box-sizing:border-box;border-radius:6px;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0 0 12px;font-size:10px;line-height:1.6;color:#9ea096;letter-spacing:3px;font-weight:800;"><span leaf="">{{FAQ标签}}</span></p>
<section style="padding:10px 0;border-top:1px solid #bfc1b7;">
<p style="margin:0;font-size:15px;line-height:1.8;color:#23251d;font-weight:800;"><span leaf="">01 / {{问题}}</span></p>
<p style="margin:0;font-size:16px;line-height:1.8;color:#23251d;font-weight:800;"><span leaf="">01 / {{问题}}</span></p>
</section>
<section style="padding:10px 0;border-top:1px solid #bfc1b7;border-bottom:1px solid #bfc1b7;">
<p style="margin:0;font-size:15px;line-height:1.8;color:#23251d;font-weight:800;"><span leaf="">02 / {{问题}}</span></p>
<p style="margin:0;font-size:16px;line-height:1.8;color:#23251d;font-weight:800;"><span leaf="">02 / {{问题}}</span></p>
</section>
</section>
</section>
@@ -654,14 +636,14 @@
<section style="flex:1;padding-bottom:12px;">
<section style="display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap;">
<span style="display:inline-block;background:#1e1f23;color:#fff;font-size:10px;font-weight:700;padding:2px 8px;border-radius:999px;"><span leaf="">CASE</span></span>
<h4 style="font-size:15px;font-weight:800;color:#23251d;margin:0;"><span leaf="">{{案例标题}}</span></h4>
<h4 style="font-size:16px;font-weight:800;color:#23251d;margin:0;"><span leaf="">{{案例标题}}</span></h4>
</section>
<p style="font-size:11px;font-weight:600;color:#65675e;letter-spacing:1px;margin:0 0 12px;"><span leaf="">{{行业规模}}</span></p>
<p style="font-size:14px;margin:0 0 14px;color:#4d4f46;line-height:1.7;text-align:justify;"><span leaf="">{{案例描述}}</span></p>
<p style="font-size:15px;margin:0 0 14px;color:#4d4f46;line-height:1.7;text-align:justify;"><span leaf="">{{案例描述}}</span></p>
<section style="text-align:center;margin-bottom:4px;">
<span leaf=""><img src="{{图片URL}}" alt="案例配图" style="max-width:100%;height:auto;display:block;margin:0 auto;border-radius:6px;border:1px solid #bfc1b7;"></span>
</section>
<p style="font-size:14px;margin:12px 0 0;color:#4d4f46;line-height:1.7;text-align:justify;"><strong style="color:#23251d;"><span leaf="">{{结果总结}}</span></strong></p>
<p style="font-size:15px;margin:12px 0 0;color:#4d4f46;line-height:1.7;text-align:justify;"><strong style="color:#23251d;"><span leaf="">{{结果总结}}</span></strong></p>
</section>
</section>
</section>
@@ -682,7 +664,7 @@
<section style="margin-top:24px;">
<section style="padding:18px;border-radius:6px;background:#fdfdf8;border:1px solid #bfc1b7;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;">
<p style="margin:0;font-size:12px;color:#65675e;font-weight:700;letter-spacing:1px;"><span leaf="">{{标签}}</span></p>
<p style="margin:0;font-size:13px;color:#65675e;font-weight:700;letter-spacing:1px;"><span leaf="">{{标签}}</span></p>
<span style="font-size:11px;color:#9ea096;"><span leaf="">{{分组说明}}</span></span>
</section>
<section style="display:flex;flex-wrap:wrap;gap:10px;">
@@ -706,8 +688,8 @@
```html
<section style="margin-top:24px;">
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;padding:22px 16px;text-align:center;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="font-size:13px;font-weight:700;color:#23251d;line-height:1.6;margin:0 0 14px;"><span leaf="">{{文末互动引导}}</span></p>
<section style="background:#fdfdf8;border:1px solid #bfc1b7;border-radius:6px;padding:20px 12px;text-align:center;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="font-size:14px;font-weight:700;color:#23251d;line-height:1.6;margin:0 0 14px;"><span leaf="">{{文末互动引导}}</span></p>
<section style="display:flex;justify-content:center;gap:18px;margin-bottom:14px;flex-wrap:wrap;">
<section style="text-align:center;color:#4d4f46;">
<section style="width:40px;height:40px;display:flex;align-items:center;justify-content:center;margin:0 auto 6px;background:#eeefe9;border-radius:6px;border:1px solid #bfc1b7;">
@@ -746,10 +728,10 @@
<section style="padding:18px;border-radius:6px;background:#fdfdf8;border:1px solid #bfc1b7;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<p style="margin:0 0 12px;font-size:11px;font-weight:800;letter-spacing:2px;color:#65675e;"><span leaf="">{{标签}}</span></p>
<section style="display:flex;flex-wrap:wrap;gap:8px;">
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#e5e7e0;border:1px solid #bfc1b7;font-size:12px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·默认}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#eeefe9;border:1px solid #bfc1b7;font-size:12px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·默认}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#d4c9b8;border:1px solid #b17816;font-size:12px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·进行中}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#1e1f23;border:1px solid #23251d;font-size:12px;font-weight:700;color:#ffffff;"><span leaf="">{{阶段名·终态}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#e5e7e0;border:1px solid #bfc1b7;font-size:13px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·默认}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#eeefe9;border:1px solid #bfc1b7;font-size:13px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·默认}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#d4c9b8;border:1px solid #b17816;font-size:13px;font-weight:700;color:#23251d;"><span leaf="">{{阶段名·进行中}}</span></span>
<span style="display:inline-block;padding:6px 10px;border-radius:999px;background:#1e1f23;border:1px solid #23251d;font-size:13px;font-weight:700;color:#ffffff;"><span leaf="">{{阶段名·终态}}</span></span>
</section>
</section>
</section>
@@ -766,13 +748,13 @@
```html
<section style="margin-top:24px;">
<section style="border-radius:6px;overflow:hidden;border:1px solid #23251d;background:#1e1f23;font-family:'IBM Plex Sans',-apple-system,sans-serif;display:flex;align-items:stretch;">
<section style="flex:1;padding:18px 18px 20px;border-right:1px solid rgba(255,255,255,0.08);">
<section style="flex:1;padding:18px 12px 20px;border-right:1px solid rgba(255,255,255,0.08);">
<p style="margin:0 0 8px;font-size:11px;letter-spacing:2px;color:rgba(255,255,255,0.55);font-weight:700;"><span leaf="">{{SUMMARY标签}}</span></p>
<p style="margin:0;font-size:15px;line-height:1.9;color:rgba(255,255,255,0.92);"><span leaf="">{{左侧结论}}</span></p>
<p style="margin:0;font-size:16px;line-height:1.9;color:rgba(255,255,255,0.92);"><span leaf="">{{左侧结论}}</span></p>
</section>
<section style="width:34%;min-width:120px;padding:18px;background:#23251d;display:flex;flex-direction:column;justify-content:center;gap:10px;">
<span style="display:inline-block;padding:4px 8px;background:#eeefe9;color:#23251d;border-radius:4px;font-size:10px;font-weight:800;align-self:flex-start;"><span leaf="">{{NEXT标签}}</span></span>
<p style="margin:0;font-size:13px;line-height:1.8;color:rgba(255,255,255,0.76);"><span leaf="">{{右侧说明}}</span></p>
<p style="margin:0;font-size:14px;line-height:1.8;color:rgba(255,255,255,0.76);"><span leaf="">{{右侧说明}}</span></p>
</section>
</section>
</section>
@@ -788,10 +770,10 @@
```html
<section style="margin-top:24px;">
<section style="background:#1e1f23;border:1px solid #23251d;padding:8px;box-sizing:border-box;border-radius:6px;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="border:1px solid rgba(255,255,255,0.16);border-radius:4px;padding:20px 22px;">
<section style="background:#1e1f23;border:1px solid #23251d;padding:4px;box-sizing:border-box;border-radius:6px;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="border:1px solid rgba(255,255,255,0.16);border-radius:4px;padding:20px 14px;">
<p style="margin:0 0 8px;font-size:10px;line-height:1.6;color:#a3a3a3;letter-spacing:4px;font-weight:800;"><span leaf="">{{CLOSING标签}}</span></p>
<p style="margin:0;font-size:16px;line-height:1.9;color:#fafafa;font-weight:700;"><span leaf="">{{结尾金句}}</span></p>
<p style="margin:0;font-size:17px;line-height:1.9;color:#fafafa;font-weight:700;"><span leaf="">{{结尾金句}}</span></p>
</section>
</section>
</section>
@@ -810,8 +792,8 @@
```html
<section style="margin-top:24px;">
<section style="background:#eeefe9;border:1px solid #bfc1b7;border-radius:6px;overflow:hidden;font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;">
<p style="margin:0;font-size:13px;line-height:1.7;color:#23251d;font-weight:700;"><span leaf="">{{摘要文字}}</span></p>
<section style="padding:12px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;">
<p style="margin:0;font-size:14px;line-height:1.7;color:#23251d;font-weight:700;"><span leaf="">{{摘要文字}}</span></p>
<span style="font-size:10px;color:#65675e;font-weight:800;letter-spacing:2px;"><span leaf="">{{标签}}</span></span>
</section>
</section>
@@ -831,7 +813,7 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<span style="display:inline-flex;align-items:center;gap:10px;padding:8px 12px;background:#eeefe9;border:1px solid #bfc1b7;border-radius:999px;">
<span style="width:22px;height:22px;border-radius:50%;background:#1e1f23;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;"><span leaf="">{{头像字}}</span></span>
<span style="font-size:12px;color:#23251d;font-weight:700;"><span leaf="">{{签名文字}}</span></span>
<span style="font-size:13px;color:#23251d;font-weight:700;"><span leaf="">{{签名文字}}</span></span>
</span>
</section>
</section>
@@ -850,19 +832,19 @@
<section style="font-family:'IBM Plex Sans',-apple-system,sans-serif;">
<section style="display:flex;align-items:center;gap:14px;margin-bottom:16px;">
<section style="text-align:center;flex-shrink:0;">
<p style="margin:0;font-size:24px;font-weight:800;color:#23251d;line-height:1;letter-spacing:-2px;"><span leaf="">///</span></p>
<p style="margin:0;font-size:25px;font-weight:800;color:#23251d;line-height:1;letter-spacing:-2px;"><span leaf="">///</span></p>
<p style="margin:0;font-size:8px;font-weight:700;color:#9ea096;letter-spacing:2px;"><span leaf="">END</span></p>
</section>
<span style="width:1px;height:36px;background:#bfc1b7;flex-shrink:0;display:inline-block;overflow:hidden;vertical-align:middle;font-size:0;line-height:0;"><span leaf="">&nbsp;</span></span>
<section>
<p style="margin:0 0 1px;font-size:17px;font-weight:800;color:#23251d;letter-spacing:0.2px;"><span leaf="">{{结尾标题}}</span></p>
<p style="margin:0 0 1px;font-size:18px;font-weight:800;color:#23251d;letter-spacing:0.2px;"><span leaf="">{{结尾标题}}</span></p>
<p style="margin:0;font-size:11px;font-weight:600;color:#65675e;letter-spacing:1.2px;"><span leaf="">{{结尾说明}}</span></p>
</section>
</section>
<p style="margin:0 0 14px;font-size:14px;line-height:1.9;text-align:justify;color:#4d4f46;"><span leaf="">{{收尾段落1}}</span></p>
<p style="margin:0 0 14px;font-size:14px;line-height:1.9;text-align:justify;color:#4d4f46;"><span leaf="">{{收尾段落2}}</span></p>
<section style="background:#eeefe9;border-radius:6px;padding:16px 18px;border:1px solid #bfc1b7;text-align:center;">
<p style="font-size:15px;color:#23251d;margin:0;line-height:1.6;"><strong style="border-bottom:3px solid #ed7b2f;"><span leaf="">{{最后总结}}</span></strong></p>
<p style="margin:0 0 14px;font-size:15px;line-height:1.9;text-align:justify;color:#4d4f46;"><span leaf="">{{收尾段落1}}</span></p>
<p style="margin:0 0 14px;font-size:15px;line-height:1.9;text-align:justify;color:#4d4f46;"><span leaf="">{{收尾段落2}}</span></p>
<section style="background:#eeefe9;border-radius:6px;padding:16px 12px;border:1px solid #bfc1b7;text-align:center;">
<p style="font-size:16px;color:#23251d;margin:0;line-height:1.6;"><strong style="border-bottom:3px solid #ed7b2f;"><span leaf="">{{最后总结}}</span></strong></p>
</section>
</section>
</section>
@@ -879,7 +861,7 @@
## 完整文章模板骨架
```html
<section style="max-width:677px;margin:0 auto;padding:8px;box-sizing:border-box;background:#fdfdf8;color:#4d4f46;font-family:'IBM Plex Sans',-apple-system,system-ui,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;line-height:1.75;">
<section style="max-width:677px;margin:0 auto;padding:4px;box-sizing:border-box;background:#fdfdf8;color:#4d4f46;font-family:'IBM Plex Sans',-apple-system,system-ui,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;line-height:1.75;">
<!-- 1. 头图卡（组件2 hero-card，唯一一处，不设 margin-top） -->