feat: 初始化混沌学园微信公众号 HTML 排版 Skill

- SKILL.md: 完整设计规范（色彩体系、微信公众号兼容规则、图片排版方案）
- scripts/extract_wechat.py: 微信公众号文章抓取脚本
- scripts/build_hundun_html.py: 混沌风格 HTML 生成脚本（组件化）
- examples/hundun-lead-article.html: 领教营二期排版示例
- resources/color-palette.md: 混沌品牌色彩参考

skills/hundun-wechat-layout/resources/color-palette.md

@@ -0,0 +1,44 @@
+# 混沌学园品牌色彩体系参考
+
+## 核心色板
+
+```
+┌──────────────────────────────────────────────────┐
+│  混沌黄 (Primary)   #F5B700   ████████████████  │
+│  深金 (Secondary)   #D99B00   ████████████████  │
+│  石墨黑 (Dark)      #181818   ████████████████  │
+│  辅助深色           #242424   ████████████████  │
+│  原生白底           #FFFFFF   ████████████████  │
+│  极浅灰             #F8F9FA   ████████████████  │
+│  微黄底             #FFFDF5   ████████████████  │
+└──────────────────────────────────────────────────┘
+```
+
+## 文字色板
+
+| 角色 | 色值 | 使用场景 |
+|:-----|:-----|:---------|
+| 主正文 | `#2B2B2B` | 白底区域段落文字 |
+| 辅助正文 | `#333333` | 非卡片区域段落 |
+| 二级正文 | `#4E5969` | 卡片内说明文字、列表文字 |
+| 深色卡内文字 | `#FFFFFF` | 石墨黑背景下的正文 |
+| 深色卡内辅助 | `#CCCCCC` | 深色卡内的副标题/描述 |
+
+## 边框与分割
+
+| 角色 | 色值 | 使用场景 |
+|:-----|:-----|:---------|
+| 浅色卡片边框 | `#E5E6EB` | 年份卡片、报名卡片外框 |
+| 深色卡片边框 | `#333333` | 深色区域内部元素边框 |
+| 虚线分割 | `#D9D9D9` | 二维码上方的分隔线 |
+
+## 渐变
+
+- **底部 CTA 横幅**: `linear-gradient(135deg, #F5B700 0%, #FFA000 100%)`
+
+## 配色原则
+
+1. **白底为基调**：顺应微信公众号默认白色阅读环境
+2. **黄色做点缀**：用于标签徽章、左侧 Accent 线、边框高亮、CTA 按钮
+3. **黑色做对比**：Hero 看板和核心理念使用深色反转，制造视觉焦点
+4. **不大面积铺黑底**：避免在微信白底环境中产生撕裂感