# Mj Adapt

> MakerJackie 多平台内容适配工具：将已完成的文章适配到不同发布平台，使用极简硬核风格排版，比如微信公众号，小红书，推特等平台优化排版。核心场景是「一篇文章，多平台发布」的内容分发工作流。

- Skill: `makerjackie/mj-adapt` (Agent Skill, multi-file: 15 files)
- Install (CLI): `npx skillmds@latest add makerjackie/mj-adapt`
- Raw SKILL.md: https://api.skillmd.com/api/skills/makerjackie/mj-adapt/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: makerjackie (https://skillmd.com/u/makerjackie)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/makerjackie/mj-adapt

---


# MakerJackie Adapt (mj-adapt)

将已完成的文章适配到多个发布平台，自动生成各平台所需的格式和素材（默认生成全部平台）。

## 核心使用场景

**触发时机**：用户已经写好一篇文章，需要将其发布到多个平台（微信公众号、小红书、知乎、推特等）。

**核心任务**：根据不同平台的要求，生成对应的格式和素材：
- **微信公众号**：生成特殊格式的 HTML（内联样式，符合公众号编辑器要求） + 微信公众号首图 + 文章标题和描述。
- **标题与封面候选**：默认生成 5 个 AI 标题候选、3 个公众号首图方向和 3 张封面图；用户未选择时才选一个作为 primary，但候选文件必须保留。
- **小红书**：生成图文素材（1080x1350px 竖版图片，4:5 比例）
- **推特**：生成简短版本的介绍（140 字以内）

## Quick Workflow

### Step 1: 接收已完成的文章
- 接收 Markdown 格式的文章内容或接收文章文件路径

**🚨 核心原则（最高优先级）：**
- **严禁修改原文内容**：不得改写、润色、压缩、重组原文的任何段落、句子或用词。
- **严禁删减内容**：必须保留原文的完整性，不得因为"适配平台"而删减段落。
- **定位是排版工具**：本 Skill 只负责「格式转换 + 视觉排版」，不是「内容编辑器」。

**平台适配规则：**
- **微信公众号**：100% 保留原文，只做 Markdown → HTML 转换 + 应用排版样式。
- **小红书图文（长文截图模式）**：
  - **必须 100% 保留原文**，逐字复制，不得改写、压缩、重组或提炼任何内容。
  - **禁用杂志式排版**：不得使用封面页、总览页、卡片网格、数据看板、大号独立标题页等任何杂志式设计。
  - **内容样式必须使用内联样式**（与微信公众号 HTML 完全相同的方式）；只允许 `<style>` 放页面 reset、body 和 `.slide` 固定尺寸，不得引用 `xhs-base.css`。
  - 视觉风格与微信公众号保持一致，但字号必须适配图片阅读（38px 正文、1.55 行高、H2 52px/H3 44px/H4 38px）。
  - 非末页必须尽量装满，不能出现一页只有几段文字、下半屏大面积空白的图。
  - 本质上就是"把文章截图成长图"，而不是"把文章设计成幻灯片"。
  - 如果用户明确要求"精简版"或"Hook 版"，才可以提炼核心观点做二次创作。

### Step 2: 识别目标平台
- 默认生成：全部平台素材，除非用户说“只生成微信公众号素材”，则只生成微信公众号相关素材

### Step 3: 生成微信公众号 HTML
- 解析 Markdown 结构
- 应用 MakerJackie 排版样式（黑白配色、粗边框）
- 生成符合微信公众号要求的 HTML（内联样式）

**字体规范（重要）：**
- **正文字号**：16px（统一正文字号，保持舒适阅读）
- **行高**：1.65（紧凑舒适，符合公众号阅读习惯）
- **标题字号**：
  - H2: 20px（加粗）
  - H3: 17px（加粗）
  - H4: 15px（加粗）
- **字体族**：`-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`

**核心调整**：
- 正文开头**严禁**重复展示文章标题框（用户已通过标题点击进入，无需冗余）。
- **公众号首图**：在 HTML 顶部放置 primary 封面图 `<img src="{date}-{slug}-cover.png">`，尺寸 900x383，3px 黑色边框。此图片由 Step 4 渲染生成，另外保留候选封面图供发布前挑选。

**组件使用建议**：
- 卡片组件（方块边框）：应**谨慎且克制**地使用。仅用于强调核心观点、Tips 或独立的小样。
- 灰色引用样式：用于呈现次要信息、补充说明或背景知识，使用灰色字体和浅色左边框。

### Step 4: 生成标题与封面候选 (Titles & Covers)
风格统一为「MakerJackie 极简硬核风」：白色背景、黑色粗边框、高对比度、Monospace 字体。

#### 默认产出
除非用户明确说“只要一个标题/一张封面”，否则必须先生成候选，再确定 primary：

1. `output/{date}-{slug}/{date}-{slug}-title-cover-options.md`
   - 5 个 AI 标题候选，覆盖不同角度：价值直给、冲突观点、项目发布、教程承诺、个人叙事。
   - 3 个公众号首图方向，分别说明主文案、副文案、视觉重心和适用场景。
2. `output/{date}-{slug}/{date}-{slug}-cover-a.html`
3. `output/{date}-{slug}/{date}-{slug}-cover-b.html`
4. `output/{date}-{slug}/{date}-{slug}-cover-c.html`
5. 对应渲染出：
   - `output/{date}-{slug}/{date}-{slug}-cover-a.png`
   - `output/{date}-{slug}/{date}-{slug}-cover-b.png`
   - `output/{date}-{slug}/{date}-{slug}-cover-c.png`
6. 如果用户没有选择，AI 选择最贴近文章调性的一个复制为 primary：
   - `output/{date}-{slug}/{date}-{slug}-cover.html`
   - `output/{date}-{slug}/{date}-{slug}-cover.png`

候选标题和封面只用于发布素材选择，不得反向改写文章正文。

#### 渲染流程
1. AI 根据下方设计规范生成 3 个独立 HTML 候选：`output/{date}-{slug}/{date}-{slug}-cover-a.html`、`cover-b.html`、`cover-c.html`，每个包含一个 `.cover` 元素（900x383px，白底 + 黑边框 + 标题/日期/品牌）。
2. 运行 `generate-cover.js` 将 `.cover` 截图成 PNG：
   ```bash
   node generate-cover.js output/{date}-{slug}/{date}-{slug}-cover-a.html output/{date}-{slug}/
   node generate-cover.js output/{date}-{slug}/{date}-{slug}-cover-b.html output/{date}-{slug}/
   node generate-cover.js output/{date}-{slug}/{date}-{slug}-cover-c.html output/{date}-{slug}/
   ```
3. 输出候选 PNG（1800x766px，2x 高清）。
4. 将最终选中的候选复制为 `output/{date}-{slug}/{date}-{slug}-cover.png`，微信公众号 HTML 中通过 `<img src="{date}-{slug}-cover.png">` 引用此 primary 图片。

#### 1. 微信公众号首图 (900x383px)
- **视觉结构**：标准 2.35:1 比例。白色背景 + 3px 黑色内边框。
- **文字内容**：
    - 左上角：`{{DATE}}` (YYYY-MM-DD，字号 14px)。
    - 正中央：文章主标题（**加粗，字号 72-96px，醒目且吸引眼球**）。
    - 右下角：`{{BRAND_IDENTIFIER}}` (字号 14px)。
- **字体样式**：标题使用黑色粗体（font-weight: 900），直抒胸臆，简洁有力。保持视觉上的平衡与留白，避免文字过于拥挤。

#### 2. 微信公众号次图 (500x500px)
- **视觉结构**：1:1 比例。纯白背景 + 3px 黑色边框。
- **文字内容**：
    - 居中：精炼的核心关键词或文章标题。
    - 底部：`{{BRAND_IDENTIFIER}}`。
- **使用场景**：用于公众号推文列表中的正方形缩略图。

#### 3. 小红书图文（长文截图模式）
- **核心目标**：将文章渲染为保留原文排版的多张连续截图。
- **尺寸**：1080x1350px (4:5 比例)，白色背景。
- **排版规则**：
  - ⚠️ **小红书字号不等于微信公众号字号**：图片在手机上是全屏宽显示，16px 渲染出来只有 ~6px 等效，完全看不清。
  - 正文字号：**38px**，行高 1.55。
  - H2 字号：**52px**，H3：**44px**，H4：**38px**。
  - 不使用独立封面页，不追求"Hook 吸引点击"风格。
  - 优先在段落、列表项、引用块、代码块边界分页；H2 章节边界只是偏好，不是硬规则。
  - 非末页正文内容底部应达到页面高度的 72% 以上，或底部空白不超过 320px；否则必须从下一页继续合并内容。
  - 保留原文所有段落、列表、引用、代码块等元素。
  - 不做文案压缩、不做内容重组、不添加卡片/总览等杂志式组件。

### Step 5: 生成小红书长文截图
- **视觉基调**：白色背景、正文字号 38px（⚠️ 小红书字号远大于微信公众号，16px 在小红书全屏图片上完全看不清）、行高 1.55、黑白配色。
- **⛔ 最重要的规则：100% 保留原文，逐字复制，不做任何改动！**
  - 原文的每一个段落、列表项、引用、代码块都必须保留。
  - 不得添加原文没有的过渡句、总结、评论或"小标题"。
  - 不得将列表改成卡片网格、或将文本重组为杂志式版面。
- **分页方式**：
  - 每个 `.slide` 为一页独立图片，第一页直接从文章内容开始（无须独立封面页）。
  - 不要机械地"一个 H2 一页"。如果某个 H2 后内容很短，必须继续放入下一段或下一个 H2 的开头，直到非末页内容密度合格。
  - 只在段落、列表项、引用块、代码块边界切页；不得把一句话切成两页。
  - 非末页内容填充率目标：72%-92%。低于 72% 或底部正文空白超过 320px，视为失败。
  - 不得通过拉大行距、拉大段距、放大字体、添加装饰元素来"填满"页面。
  - 首图直接从文章内容开始（无须独立封面页），标题和正文开头即可。
  - 最后一页包含结尾 + 一个主 CTA + 作者信息。
- **样式规则**：
  - **正文内容必须使用内联样式（inline styles）**，与微信公众号 HTML 相同方式。
  - `<style>` 块只允许定义 reset、body 和 `.slide` 固定尺寸；不得在 `<style>` 中定义正文排版样式，不得引用 `xhs-base.css`。
  - 图片尺寸：**固定 1080x1350px（4:5 竖版）**，白色背景，每页必须精确等于这个尺寸（不能使用 `min-height`，否则内容不满时会产出非标准尺寸图片）。
  - 每页必须包含正文容器：`<div data-role="content">...</div>`。页码、作者标识等页脚放入 `data-role="footer"` 或 `data-role="page-number"`，不要混入正文容器。
- **生成后必须自查**：
  - 逐段对比原文和生成的 `.slide` 内容，确认无修改、无遗漏。
  - 如果发现任何改写或压缩，必须重写直到 100% 一致。
  - 逐页检查非末页密度：如果像截图一样下半页空白，必须重新分页，而不是直接交付。

### Step 6: 生成 `xhs-slides.html`
- AI 直接生成包含所有 `.slide` 页面的 `xhs-slides.html`。
- **职责拆分**：
  - AI 负责：根据原文生成长文截图风格 HTML，按自然边界和内容密度拆分 `.slide` 页面，**逐字保留原文完整内容**，使用内联样式（与微信公众号相同风格）。
  - `generate-xhs-slides.js` 负责：将 `.slide` 截图成统一规格的 PNG。
- **关键约束（必须遵守）**：
  - 页面尺寸固定 `1080x1350`（4:5 竖版），白底，正文字号 38px。使用 `height: 1350px` 而非 `min-height`。
  - **正文内容必须使用内联样式**（与微信公众号 HTML 相同方式）；`<style>` 仅用于 reset、body 和 `.slide` 固定尺寸，**不得**引用 `xhs-base.css`。
  - 每页正文必须包在 `<div data-role="content">...</div>` 中；页脚、页码用 `data-role="footer"` 或 `data-role="page-number"`。
  - **非末页不得稀疏**：填充率低于 72% 或底部正文空白超过 320px 时，必须合并下一页内容重新分页。
  - **不得做任何文案压缩、改写或内容重组**。
  - **禁用杂志式组件**：无封面页、总览页、卡片网格、数据看板、大号标题页。
  - 本质上就是"将文章按章节截图"，样式只是为了阅读舒适，不是重新设计版面。
- HTML 工作流详细规范见 `XHS_HTML_SPEC.md`

### Step 7: 渲染 `xhs-slides.html`
- 输入：AI 生成的 `xhs-slides.html`
- 输出：
  - `xhs-01-*.html`, `xhs-02-*.html` ... 调试用 HTML
  - `{date}-{slug}-1.png`, `{date}-{slug}-2.png` ... 最终交付图片
- 导出规格固定为 `1080x1350` 视口，`deviceScaleFactor=2`，最终 PNG 为 `2160x2700`。
- 渲染脚本会检查 overflow 和非末页密度；如果报 `Underfilled non-final slide detected`，必须重新合并分页后再渲染。只有调试旧样例时才使用 `--allow-underfilled`。
- 注意：`fixtures/` 目录中的旧示例文件为杂志风格（已废弃），仅用于渲染器回归测试，**不得参考其内容和布局**。
- 命令示例：
  ```bash
  # 实际使用
  node generate-xhs-slides.js output/2026-05-12-article-title.xhs-slides.html output/

  # 回归测试（使用仓库内 fixture）
  node generate-xhs-slides.js fixtures/2026-04-20-ai-subscription-bill-1785-monthly.xhs-slides.html ../../output/regression
  ```

### Step 8: 生成社交媒体短内容 (Social Media Short-form)

根据文章内容自动适配社交媒体平台，将3000-5000字长文浓缩成200-500字的短内容。

#### 3种切入角度

**A. 金句开头（观点类）**
第一句话是有冲击力的观点，适合深度思考、行业洞察类文章。

**B. 数据/成果冲击（测试/案例类）**
第一句话抛出令人信服的数据或成果，适合评测、案例拆解类文章。

**C. 价值主张直给（工具/方法类）**
第一句话直接说明是什么、有什么用，适合教程、工具推荐类文章。

#### 标准结构（200-500字）

```
1. 开头（1-2句，30-50字）
   - 金句/数据/价值主张
2. 展开（3-5句或列表，100-300字）
   - 具体细节/数字
   - 个人经历/真实案例
3. 结尾（1句，20-30字）
   - 互动引导（评论区见/迟点分享）
   - @提及（如涉及产品/人物）
```

#### 风格要点

- 口语化、对话感
- 短句为主（15-25字）
- 具体数字（"3个"、"半年"、"100%"）
- 真实细节（时间线、工具名）
- 无套话和AI腔

### Step 9: 配图设计提案（可选）

配图生成前，先向用户展示设计方向选择，确认后再执行。

#### 配图需求确认

| 类型 | 说明 | 图片数量 |
|------|------|---------|
| A. 仅封面 | 头条封面图 | 1张 |
| B. 正文配图 | 章节配图，辅助阅读理解 | 3-8张 |
| C. 全套配图 | 封面 + 正文全部 | 4-10张 |

#### 配图数量建议

| 文章长度 | 推荐配图数 | 包含 |
|---------|-----------|------|
| < 1500字 | 2-3张 | 封面 + 1-2张正文 |
| 1500-3000字 | 4-6张 | 封面 + 每个核心章节1张 |
| 3000-5000字 | 6-8张 | 封面 + 章节图 + 信息图 |
| > 5000字 | 8-10张 | 不超过10张，避免过度打断 |

#### 风格推荐

根据文章类型自动推荐风格，向用户展示选项并等待确认：

| 文章类型 | 推荐风格 |
|---------|---------|
| AI工具评测 | 极简专业 / 编辑杂志 / 数据信息图 |
| 技术教程 | 极简专业 / 手绘白板 / 编辑杂志 |
| 产品发布 | 编辑杂志 / 大字报 / 极简专业 |
| 深度分析 | 编辑杂志 / 数据信息图 / 极简专业 |
| 个人故事 | 温暖叙事 / 编辑杂志 |
| 行业观察 | 大字报 / 编辑杂志 / 数据信息图 |

## 品牌与转化规范 (Branding & CTA)

### 1. 固定主次关系
- **Maker Jackie** 是人、信任和内容源头。用于作者署名、账号身份、个人故事、AI 实践和独立开发记录。
- **01MVP** 是产品、课程和付费转化入口。用于承接“我也想系统学习 AI 产品实战”的读者。
- 标准关系句：`01MVP 是 Maker Jackie 做的 AI 产品实战教程。`
- 不要把 `makerjackie.com / 01mvp.com` 固定并列塞进每篇内容。每篇文章只给一个主要动作：关注 Jackie，或者去 01mvp.com。

### 2. 场景化 CTA 适配
根据文章类型自动适配 CTA (Call to Action) 区域：
- **AI 教程 / 产品实战 / 独立开发复盘 / 工具教程**：主推 **01MVP**，轻带 Maker Jackie。
  - `{{CTA_LABEL}}`: `ABOUT 01MVP`
  - `{{CTA_CONTENT}}`: `01MVP 是 Maker Jackie 整理的 AI 产品实战手册，记录如何从一个想法出发，借助 AI 做出可上线的产品，并找到第一个真实用户。如果你正在用 AI 做产品，欢迎来 01mvp.com 从第一章开始。`
- **个人成长 / 思考 / 自媒体 / 生活记录**：主推 **Maker Jackie**，轻带 01MVP。
  - `{{CTA_LABEL}}`: `ABOUT MAKER JACKIE`
  - `{{CTA_CONTENT}}`: `我是 Jackie，独立开发者，01MVP 作者。这里记录 AI 实践、独立开发、个人成长和一些阶段性的答案。系统化的 AI 产品实战教程，我放在 01mvp.com。`
- **平台短内容**：公众号、小红书、X、B 站每条内容只保留一个转化口。技术教程给 01MVP；个人思考给 Maker Jackie。

## 样式规范

### 核心设计原则
- Neo-Brutalism 硬核极简黑白
- **白色底色**：干净、简洁的阅读体验
- **黑白配色**：强烈的视觉对比
- **清晰层次**：通过边框和间距区分内容块
- **Monospace 标签**：技术感的小标题和元信息
- 匹配合适的风格，比如 代码块，不需要局限于黑白色，而是正常的 黑白灰配色。

### 颜色系统
- 背景色：`#ffffff` (白色)
- 主文字：`#000000` (黑色)
- 正文：`#111111` (深灰)
- 边框：`3px solid #000000` (黑色粗边框)
- 强调背景：`#000000` (黑底白字)

### 字体系统
- **标签/元信息**：`Menlo, Monaco, Consolas, 'Courier New', monospace`
  - 12px, 700 weight, 1.6 line-height, 1px letter-spacing
- **大标题**：30px, 900 weight, 1.35 line-height
- **章节标题**：25px, 900 weight, 1.45 line-height
- **强调文字**：18-20px, 700 weight, 1.65 line-height
- **正文**：16px, 400 weight, 1.65 line-height
- **卡片文字**：16px, 400 weight, 1.65 line-height

### 输出位置
默认是仓库根目录的 `output/{date}-{slug}/` 目录，slug 是文章标题的 URL 友好版本。

默认应包含：
- `{date}-{slug}-title-cover-options.md`：5 个标题候选 + 3 个封面方向。
- `{date}-{slug}-cover-a.png`、`{date}-{slug}-cover-b.png`、`{date}-{slug}-cover-c.png`：公众号首图候选。
- `{date}-{slug}-cover.png`：当前 primary 公众号首图。
- `{date}-{slug}-wechat.html`：公众号正文 HTML。

###### 布局组件

#### 1. 灰色引用 (Secondary Text)
```
- 4px 浅灰色左边框 (#f0f0f0)
- 15px padding-left/right
- 灰色字体 (#888888)
- 用于次要信息、补充说明
```

#### 2. 章节标题
```
- 顶部 3px 黑色边框
- 14px padding-top
- 包含：章节编号 + 标题
```

#### 3. 卡片组件
```
- 2px 黑色边框
- 16px padding
- 白色背景
- 包含：小标签 + 内容
```

#### 4. 强调引用
```
- 黑色背景
- 白色文字
- 16-18px padding
- 用于重要观点
```

#### 5. 页脚 (Jackie 个人版)
```
- 2px 黑色边框包裹的全卡片
- 包含：Jackie 头像、简介
- 包含：一个主 CTA，根据文章意图指向 Maker Jackie 或 01MVP
- 包含：联系邮箱或账号 ID
```

### 间距系统
- 组件间距：24-32px
- 段落间距：18px
- 内部 padding：16-18px
- 小间距：10-12px

## 微信公众号 HTML 要求

### 必须遵守的规则
1. **内联样式**：所有样式必须写在 `style` 属性中
2. **不支持的 CSS**：避免使用 `position: fixed/sticky`, `float`, `transform` 等
3. **盒模型**：使用 `box-sizing: border-box`
4. **响应式**：使用 `max-width` 而非固定宽度
5. **图片**：使用相对路径或 CDN 链接

### 容器结构
```html
<section style="margin:0;padding:24px 0;background-color:#ffffff;">
  <section style="margin:0 auto;padding:0;max-width:677px;box-sizing:border-box;">
    <!-- 内容区域 -->
  </section>
</section>
```

## 图片生成规范

### 小红书图片尺寸
- 统一使用：1080x1350px (4:5 比例)
- 默认导出：2160x2700px PNG（1080x1350 视口下 2x 高清截图）

### 分页策略
1. 第一页：直接从文章开头内容开始（无须独立封面页），包含标题+正文开头
2. 后续每页：优先按自然段、列表项、引用块、代码块边界分页；H2 章节边界只是偏好
3. 最后一页：结尾内容 + 一个主 CTA + 作者信息
4. 非末页：内容填充率必须达到 72% 以上，或底部正文空白不超过 320px；不足时合并下一页内容

### 图片样式
- 与微信公众号保持一致的视觉风格，但小红书使用图片阅读字号（38px 正文、1.55 行高、H2 52px）
- **不做杂志式重排版**（无封面页、总览、卡片网格、大号独立标题页）
- **正文内容必须使用内联样式**；`<style>` 仅用于 reset、body 和 `.slide` 固定尺寸，不引用 `xhs-base.css`
- 白色背景，保留必要边距；非末页不得出现下半页大面积空白

## 输出文件命名

### HTML 文件
格式：`{date}-{slug}-wechat.html`
示例：`2026-04-09-why-i-make-ai-tutorials-wechat.html`

### 图片文件
格式：`{date}-{slug}-{number}.png`
示例：
- `2026-04-09-why-i-make-ai-tutorials-1.png`
- `2026-04-09-why-i-make-ai-tutorials-2.png`

### 标题与封面候选文件
示例：
- `2026-04-09-why-i-make-ai-tutorials-title-cover-options.md`
- `2026-04-09-why-i-make-ai-tutorials-cover-a.png`
- `2026-04-09-why-i-make-ai-tutorials-cover-b.png`
- `2026-04-09-why-i-make-ai-tutorials-cover-c.png`
- `2026-04-09-why-i-make-ai-tutorials-cover.png`

## 使用示例

### 示例 1：多平台发布
```
用户：我写好了一篇文章，需要发到公众号和小红书
[提供 Markdown 内容]

输出：
- 2026-04-20-article-title-wechat.html （复制到公众号编辑器）
- 2026-04-20-article-title-1.png （小红书第 1 页）
- 2026-04-20-article-title-2.png （小红书第 2 页）
- ...
```

### 示例 2：只生成公众号格式
```
用户：把这篇文章转成公众号格式
[提供文章文件路径或内容]

输出：
- 2026-04-20-article-wechat.html
```

### 示例 3：从文件批量适配
```
用户：把 article.md 适配到各个平台

输出：
- 2026-04-20-article-wechat.html （公众号）
- 2026-04-20-article-1.png （小红书图1）
- 2026-04-20-article-2.png （小红书图2）
- ...
```

## 质量检查清单

生成内容前，确保：
- [ ] HTML 使用内联样式
- [ ] 颜色系统正确（黑白为主）
- [ ] 字体和字号符合规范
- [ ] 边框粗细正确（3px 主边框，2px 卡片边框）
- [ ] 间距系统一致
- [ ] 响应式布局（max-width: 677px）
- [ ] 图片尺寸符合小红书要求
- [ ] 文件命名规范
- [ ] 默认生成 5 个标题候选、3 个封面方向和 3 张公众号首图候选；除非用户明确只要一个
- [ ] 已选定或复制出 primary 封面 `{date}-{slug}-cover.png`
- [ ] **小红书 xhs-slides.html：原文与生成内容逐段对比，确认 100% 一致（无改写、无压缩、无遗漏）**
- [ ] **小红书 xhs-slides.html：未使用杂志式组件（封面页、总览页、卡片网格、数据看板）**
- [ ] **小红书 xhs-slides.html：正文内容未使用 `<style>` 块或 `xhs-base.css`，全部内联样式**
- [ ] **小红书 xhs-slides.html：非末页没有大面积空白，填充率 >= 72% 或底部正文空白 <= 320px**
- [ ] 公众号 HTML 和小红书 HTML 中没有未替换的 `{{PLACEHOLDER}}`。

## 参考资源

- 样式模板：`assets/wechat-template.html`
- 小红书生成器：`generate-xhs-slides.js`
- 小红书 HTML 工作流：`XHS_HTML_SPEC.md`
- 小红书旧基础样式：`assets/xhs-base.css`（已废弃，仅用于旧 fixture 参考，不得在新生成中使用）