chore: 1.1.0 release

2026-08-06 17:09:51 +08:00
parent 28040e1f57
commit 0f70adb1c9
152 changed files with 8915 additions and 39 deletions
@@ -4,6 +4,22 @@
 本项目遵循 [语义化版本](https://semver.org/lang/zh-CN/)。
 ## [1.1.0] - 2026-08-06
 ### 新增
 - PPTD 对齐官方元素级 `animations` 规范；Skill 补充动画 / `notes` 使用边界
 - 对齐配图优先级、文风禁令、澄清提问、复刻细则、并行写页等官方策略
 - 内置约 30 套 preset design system，并支持点名使用
 - 恢复 `customFonts`（Google Fonts）与海报推荐尺寸
 - 根目录主题目录：`theme.md` / `theme_EN.md`（含预览图）
 - 示例项目 `example/xiaomi-yu7-ppt-animation`（页内元素入场动画）
 ### 变更
 - 场景文档同步官方动画细则与 `customFonts` 引用
 - README 补充元素动画、预设主题说明与示例 Prompt
 ## [1.0.2] - 2026-08-06
 ### 变更
@@ -4,6 +4,22 @@
 This project follows [Semantic Versioning](https://semver.org/).
 ## [1.1.0] - 2026-08-06
 ### Added
 - Align PPTD with official element-level `animations`; Skill notes for animation / `notes` usage bounds
 - Align image priority, anti-AI copy rules, clarification asks, replicate guidance, and parallel page writes
 - Ship ~30 preset design systems, invoked only when named
 - Restore `customFonts` (Google Fonts) and poster size recommendations
 - Root theme catalogs: `theme.md` / `theme_EN.md` (with preview images)
 - Sample project `example/xiaomi-yu7-ppt-animation` (on-slide entrance animations)
 ### Changed
 - Sync scenario docs with official animation guidance and `customFonts` references
 - README: document element animations, preset themes, and sample prompts
 ## [1.0.2] - 2026-08-06
 ### Changed
@@ -5,7 +5,7 @@
 [![npm version](https://img.shields.io/npm/v/open-kimi-ppt-skills)](https://www.npmjs.com/package/open-kimi-ppt-skills)
 [![node](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org)
-逆向 Kimi Slides 实现的非官方演示文稿 Skill：让 AI Coding Agent 能够创建、编辑、复刻、读取并导出 PPT/PPTX。**每次生成默认同时交付两份成果：可继续编辑的 PPTD 项目和开箱即用的 PPTX 成品**（自动嵌入字体、写入淡入淡出切换动画），并提供本地在线 PPTD 编辑器支持随时手动导出。支持 Codex、Claude Code、Cursor、WorkBuddy 等任何兼容 SKILL.md 规范的 Agent。
+逆向 Kimi Slides 实现的非官方演示文稿 Skill：让 AI Coding Agent 能够创建、编辑、复刻、读取并导出 PPT/PPTX。**每次生成默认同时交付两份成果：可继续编辑的 PPTD 项目和开箱即用的 PPTX 成品**（自动嵌入字体、写入淡入淡出翻页切换），支持页内元素动画与[预设主题](theme.md)，并提供本地在线 PPTD 编辑器随时手动导出。支持 Codex、Claude Code、Cursor、WorkBuddy 等任何兼容 SKILL.md 规范的 Agent。
 > [!IMPORTANT]
 > 本项目通过逆向分析 Kimi Slides Skill、PPTD 格式以及公开网页编辑器的前端行为与通信协议实现，并非 Kimi 或 Moonshot AI 的官方项目，也未获得其认可或支持。项目依赖的公开前端资源和兼容协议可能随 Kimi 更新而失效，仅供学习与研究使用。
@@ -112,6 +112,15 @@ npx open-kimi-ppt-skills@latest install --target ~/.claude/skills
 [![iPhone 17 Pro](docs/images/example-iphone-17pro.png)](docs/images/example-iphone-17pro.png)
 **示例 4：带页内元素动画（现场演示）**
 ```text
 使用 open-kimi-ppt 做一个介绍小米 yu7的 PPT,要求图片做背景,素材从网上找,8 页左右
 要求带元素入场动画
 ```
 成品示例见 [example/xiaomi-yu7-ppt-animation](example/xiaomi-yu7-ppt-animation)（含 PPTD 项目与 PPTX，可用 `npx open-kimi-ppt-skills serve` 打开预览动画）。
 ### 在线编辑与手动导出
 建议直接让 AI 启动本地编辑器，例如说：
@@ -141,7 +150,9 @@ npx open-kimi-ppt-skills serve --port 56000
 ## 功能特性
 - **PPTD 生成**：让 Agent 生成完整、可继续编辑的 PPTD 项目，支持从零创作、风格迁移、模板复用、图片/PDF 复刻。
- **PPTX 生成**：默认同步生成 PPTX 成品，自动嵌入字体并写入淡入淡出切换动画。
+- **预设主题**：内置约 30 套官方同款 design system，点名即可套用；完整列表与预览图见 [theme.md](theme.md)。
 - **元素动画**：默认不加。提示词加上「要求带元素入场动画」即可，由 AI 按页编排合适的入场效果。
 - **PPTX 生成**：默认同步生成 PPTX 成品，自动嵌入字体并写入淡入淡出**翻页**切换（与页内元素动画是两回事）。
 - **视觉质检**：多模态模型在导出 PPTX 前自动导出整份页面图片、拼接总览图逐项核查（变形、遮挡、出界、对比度、排版、文字溢出），问题页面修复后复检，直至全部通过。
 - **在线编辑**：通过浏览器查看和编辑本地 PPTD 项目，自动保存，可配置页面切换动画。
 - **手动导出**：在编辑器中随时手动导出 PPTX。
@@ -164,11 +175,12 @@ npx open-kimi-ppt-skills serve --port 56000
 更具体地说，相对其他方案的优势是：
 1. **中间格式为 Agent 设计**：PPTD 用 YAML 描述主题、布局与元素，比直接写 OOXML / pptxgenjs 更稳，也比「整页渲一张图」更可局部修改。
-2. **默认同交两份成果**：可继续迭代的 PPTD 项目 + 开箱即用的 PPTX（嵌字体、淡入淡出切换），不是只给半成品。
+2. **默认同交两份成果**：可继续迭代的 PPTD 项目 + 开箱即用的 PPTX（嵌字体、淡入淡出翻页），不是只给半成品。
-3. **PPTX 真能改**：导出后文本框、形状仍可在 PowerPoint / WPS 里编辑，不像图片型 PPT 只能当海报。
+3. **支持元素动画**：提示词写「要求带元素入场动画」即可启用；具体效果与节奏由 AI 处理，无需用户点名动画类型。
-4. **有本地可视化编辑器**：浏览器里预览、微调、配切换动画并手动再导出，不需要每次都让 Agent 重跑全流程。
+4. **PPTX 真能改**：导出后文本框、形状仍可在 PowerPoint / WPS 里编辑，不像图片型 PPT 只能当海报。
-5. **导出前强制视觉质检**：整页截图 + 总览图检查遮挡、出界、对比度、溢出等问题，修完再出 PPTX。
+5. **有本地可视化编辑器**：浏览器里预览、微调、配切换动画并手动再导出，不需要每次都让 Agent 重跑全流程。
-6. **不绑官方模型，成本更低**：相对官方 Kimi Slides，你可以在任意兼容 Agent 里使用 DeepSeek 等低成本模型；即便模型不支持多模态，只要按 PPTD 规范生成，也能做出不错的成品（有多模态时再做视觉质检会更稳）。
+6. **导出前强制视觉质检**：整页截图 + 总览图检查遮挡、出界、对比度、溢出等问题，修完再出 PPTX。
 7. **不绑官方模型，成本更低**：相对官方 Kimi Slides，你可以在任意兼容 Agent 里使用 DeepSeek 等低成本模型；即便模型不支持多模态，只要按 PPTD 规范生成，也能做出不错的成品（有多模态时再做视觉质检会更稳）。
 [![DeepSeek 生成 Liquid Glass 风格 PPT](docs/images/example-deepseek-liquid-glass.png)](docs/images/example-deepseek-liquid-glass.png)
@@ -184,17 +196,20 @@ npx open-kimi-ppt-skills serve --port 56000
 ### 关于风格与主题
-本 Skill **不预设固定主题或模板**。风格由你决定。
+默认 **不会** 自动套用固定主题：未指定风格时由 Agent 按场景指南自行发挥。Skill 内另附约 30 套官方同款 preset，**仅在你点名时**才会使用（例如「用 pine-green-strategy」）。
 完整主题名、风格说明与预览图见 **[theme.md](theme.md)**。
 > [!TIP]
-> **强烈建议在 Prompt 里写明 PPT 风格，或直接附上参考 PPT / PPTX 模板。** 有风格约束或模板参照时，出品会明显更好、更稳定；只给主题不给风格时，Agent 会自行发挥，效果容易波动。
+> **强烈建议在 Prompt 里写明 PPT 风格、点名一套 preset，或直接附上参考 PPT / PPTX 模板。** 有风格约束或模板参照时，出品会明显更好、更稳定；只给主题不给风格时，Agent 会自行发挥，效果容易波动。
-常见两种用法：
+常见用法：
 1. **在 Prompt 里描述风格**：例如「深色科技风」「杂志排版」「苹果 liquid glass」「极简留白 + 大字报」等；
-2. **提供参考模板**：上传现有 PPT / PPTX / 截图，让 Agent 迁移配色、版式与风格。
+2. **点名预设主题**：例如「用 `pine-green-strategy`」——主题列表见 [theme.md](theme.md)；
 3. **提供参考模板**：上传现有 PPT / PPTX / 截图，让 Agent 迁移配色、版式与风格。
-两者可以一起用：先给模板定调，再用一句话补充本次要强化的风格。
+可组合使用：先点名 preset 或给模板定调，再用一句话补充本次要强化的风格。
 ## 界面预览
@@ -5,7 +5,7 @@
 [![npm version](https://img.shields.io/npm/v/open-kimi-ppt-skills)](https://www.npmjs.com/package/open-kimi-ppt-skills)
 [![node](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org)
-An unofficial presentation skill for AI coding agents, reverse-engineered from Kimi Slides. It lets your agent create, edit, replicate, read, and export PPT/PPTX files. **Every run delivers two outputs by default: an editable PPTD project and a ready-to-use PPTX** — fonts embedded and fade transitions included — plus a local in-browser PPTD editor with manual PPTX export. Works with Codex, Claude Code, Cursor, WorkBuddy, and any agent that supports the SKILL.md format.
+An unofficial presentation skill for AI coding agents, reverse-engineered from Kimi Slides. It lets your agent create, edit, replicate, read, and export PPT/PPTX files. **Every run delivers two outputs by default: an editable PPTD project and a ready-to-use PPTX** — fonts embedded and fade page transitions included — with optional on-slide element animations and [preset themes](theme_EN.md), plus a local in-browser PPTD editor with manual PPTX export. Works with Codex, Claude Code, Cursor, WorkBuddy, and any agent that supports the SKILL.md format.
 > [!IMPORTANT]
 > This project is implemented by reverse-engineering the Kimi Slides skill, the PPTD format, and the frontend behavior and communication protocol of the publicly accessible web editor. It is not an official Kimi or Moonshot AI project and is not endorsed or supported by them. Public frontend resources and compatibility contracts used by this project may change without notice. Provided for learning and research purposes only.
@@ -100,6 +100,15 @@ Use open-kimi-ppt to create an iPhone 17 Pro intro PPT.
 [![iPhone 17 Pro](docs/images/example-iphone-17pro.png)](docs/images/example-iphone-17pro.png)
 **Example: on-slide element animations (live presentation)**
 ```text
 Use open-kimi-ppt to create a Xiaomi YU7 intro PPT, with images as backgrounds from the web, about 8 pages.
 Require element entrance animations.
 ```
 See the sample deck at [example/xiaomi-yu7-ppt-animation](example/xiaomi-yu7-ppt-animation) (PPTD project + PPTX; open with `npx open-kimi-ppt-skills serve` to preview animations).
 ### Edit online and export manually
 Prefer asking your agent to start the local editor, for example:
@@ -129,7 +138,9 @@ Writable folder access requires a Chromium-based browser with the File System Ac
 ## Features
 - **PPTD generation**: let your agent generate complete, editable PPTD projects — from scratch, with style transfer, template reuse, or replication from images/PDFs.
- **PPTX generation**: produce a matching PPTX by default, with fonts embedded and fade transitions written automatically.
+- **Preset themes**: ~30 official-style design systems you can name to apply; full list with previews in [theme_EN.md](theme_EN.md).
 - **Element animations**: Off by default. Add `Require element entrance animations` to the prompt; the agent picks suitable on-slide effects per page.
 - **PPTX generation**: produce a matching PPTX by default, with fonts embedded and fade **page** transitions written automatically (separate from on-slide element animations).
 - **Visual QA**: with a multimodal model, the skill exports every page as an image, stitches them into an overview sheet, and checks each page (distortion, occlusion, out-of-bounds elements, contrast, layout consistency, text overflow) before PPTX export — fixing and re-checking until every page passes.
 - **Online editing**: view and edit local PPTD projects in a browser, with autosave and configurable slide transitions.
 - **Manual export**: export PPTX manually from the editor at any time.
@@ -152,11 +163,12 @@ Most PPT skills fall into three buckets: assemble OOXML / pptxgenjs in code, ren
 In short:
 1. **DSL built for agents** — PPTD describes theme, layout, and elements in YAML, more stable than raw OOXML / pptxgenjs, and more locally editable than full-slide images.
-2. **Two deliverables by default** — an iterable PPTD project plus a ready-to-open PPTX (embedded fonts, fade transitions).
+2. **Two deliverables by default** — an iterable PPTD project plus a ready-to-open PPTX (embedded fonts, fade page transitions).
-3. **Truly editable PPTX** — text boxes and shapes remain editable in PowerPoint / WPS, unlike image-only decks.
+3. **Element animations** — add `Require element entrance animations` to the prompt; the agent chooses effects and timing for you.
-4. **Local visual editor** — preview, tweak, set transitions, and re-export in the browser without rerunning the whole agent flow.
+4. **Truly editable PPTX** — text boxes and shapes remain editable in PowerPoint / WPS, unlike image-only decks.
-5. **Visual QA before export** — full-page screenshots plus an overview sheet catch occlusion, overflow, contrast, and layout issues before PPTX is written.
+5. **Local visual editor** — preview, tweak, set transitions, and re-export in the browser without rerunning the whole agent flow.
-6. **Not locked to the official model — lower cost** — unlike official Kimi Slides, you can run this in any compatible agent with cheaper models such as DeepSeek. Even without multimodal vision, a model that follows the PPTD spec can still produce strong decks (multimodal helps more with the visual QA pass).
+6. **Visual QA before export** — full-page screenshots plus an overview sheet catch occlusion, overflow, contrast, and layout issues before PPTX is written.
 7. **Not locked to the official model — lower cost** — unlike official Kimi Slides, you can run this in any compatible agent with cheaper models such as DeepSeek. Even without multimodal vision, a model that follows the PPTD spec can still produce strong decks (multimodal helps more with the visual QA pass).
 [![DeepSeek generating a Liquid Glass-style PPT](docs/images/example-deepseek-liquid-glass.png)](docs/images/example-deepseek-liquid-glass.png)
@@ -172,17 +184,20 @@ In short:
 ### Style and themes
-This skill **does not ship a fixed theme or template**. You choose the look.
+By default the agent **does not** auto-apply a fixed theme: without a style cue it follows the scenario guides. The skill also ships ~30 official-style presets, used **only when you name one** (e.g. “use pine-green-strategy”).
 Browse theme IDs, descriptions, and preview images in **[theme_EN.md](theme_EN.md)**.
 > [!TIP]
-> **Best results come from stating a PPT style in the prompt, or attaching a reference PPT / PPTX template.** With a style constraint or template to follow, output quality is clearly better and more stable. Topic-only prompts leave the agent free to invent a look, so results vary more.
+> **Best results come from stating a PPT style in the prompt, naming a preset, or attaching a reference PPT / PPTX template.** With a style constraint or template to follow, output quality is clearly better and more stable. Topic-only prompts leave the agent free to invent a look, so results vary more.
 Common approaches:
 1. **Describe the style in the prompt** — e.g. dark tech, magazine layout, Apple liquid glass, minimal big-type poster slides;
-2. **Provide a reference template** — upload an existing PPT / PPTX / screenshot and ask the agent to transfer colors, layout, and overall style.
+2. **Name a preset theme** — e.g. “use `pine-green-strategy`”; see the catalog in [theme_EN.md](theme_EN.md);
 3. **Provide a reference template** — upload an existing PPT / PPTX / screenshot and ask the agent to transfer colors, layout, and overall style.
-You can combine both: lock the look with a template, then add one line about the style you want to emphasize.
+You can combine these: lock the look with a preset or template, then add one line about the style you want to emphasize.
 ## Screenshots
@@ -0,0 +1,70 @@
 pageType: cover
 background:
  type: image
  src: media/yu7-hero.jpg
  fit: {mode: cover}
 elements:
  - elementId: cover-wash
    elementType: shape
    bounds: [0, 0, 960, 540]
    shapeName: rect
    fill: {type: solid, color: "#00000072"}
  - elementId: cover-rule
    elementType: shape
    bounds: [58, 44, 72, 4]
    shapeName: rect
    fill: {type: solid, color: "$orange"}
  - elementId: cover-meta
    elementType: text
    bounds: [58, 58, 700, 22]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 12
      letterSpacing: 2
      text: "XIAOMI EV  /  YU7  /  2025 PRODUCT STORY"
  - elementId: cover-title
    elementType: text
    bounds: [58, 206, 560, 120]
    content:
      fontFamily: MiSans
      color: "$white"
      align: [left, middle]
      text: |
        <p><span style="font-size:76px;font-weight:700;letter-spacing:-2px">小米 YU7</span></p>
        <p><span style="font-size:24px;color:#FF6900;font-weight:700">从容奔赴 · 伟大旅程</span></p>
  - elementId: cover-subtitle
    elementType: text
    bounds: [60, 366, 380, 64]
    content:
      fontFamily: MiSans
      color: "$white"
      fontSize: 17
      lineHeight: 1.35
      text: |
        <p>跑车级姿态，SUV 的从容。</p>
        <p>一台把长途旅行做成日常的纯电 SUV。</p>
  - elementId: cover-source
    elementType: text
    bounds: [60, 494, 800, 18]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "图片 / 资料：<a href=\"https://www.xiaomiev.com/yu7\">小米汽车官网 YU7</a>（访问：2026-08-06）"
 animations:
  - elementId: cover-title
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 700
    easing: ease-out
  - elementId: cover-subtitle
    effect: fly-in
    direction: up
    trigger: afterPrevious
    durationMs: 550
    easing: ease-out
  - elementId: cover-meta
    effect: fade-in
    trigger: withPrevious
    durationMs: 450
@@ -0,0 +1,80 @@
 pageType: content
 background:
  type: image
  src: media/yu7-exterior.jpg
  fit: {mode: cover}
 elements:
  - elementId: position-wash
    elementType: shape
    bounds: [0, 0, 500, 540]
    shapeName: rect
    fill: {type: solid, color: "#071013D4"}
  - elementId: position-index
    elementType: text
    bounds: [58, 42, 120, 24]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "01 / POSITION"
  - elementId: position-title
    elementType: text
    bounds: [58, 94, 400, 112]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:43px;font-weight:700">从 SU7 到 YU7</span></p>
        <p><span style="font-size:25px;color:#FF6900;font-weight:700">小米的第二台车，第一台 SUV</span></p>
  - elementId: position-body
    elementType: text
    bounds: [60, 236, 360, 112]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 17
      lineHeight: 1.45
      text: |
        <p>保留跑车式的低趴比例，</p>
        <p>把车内空间、舒适与长途能力</p>
        <p>放进同一台车。</p>
  - elementId: position-line
    elementType: line
    bounds: [60, 382, 354, 1]
    viewBox: [354, 1]
    points: "0,0.5 354,0.5"
    border: {style: solid, width: 2, color: "$orange"}
  - elementId: position-stats
    elementType: text
    bounds: [60, 405, 410, 88]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:32px;font-weight:700">1:3</span><span style="font-size:15px;color:#C9D0D4"> 头身比　　</span><span style="font-size:32px;font-weight:700">0.245</span><span style="font-size:15px;color:#C9D0D4"> 风阻系数</span></p>
        <p><span style="font-size:16px;color:#C9D0D4">接近 5 米车长，仍然保留向前俯冲的姿态</span></p>
  - elementId: position-source
    elementType: text
    bounds: [58, 510, 850, 16]
    content:
      fontFamily: MiSans
      color: "#CCD4D7"
      fontSize: 9
      text: "数据来源：<a href=\"https://www.xiaomiev.com/yu7\">小米汽车官网 YU7</a>；图源同上"
 animations:
  - elementId: position-title
    effect: fly-in
    direction: right
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: position-body
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
  - elementId: position-stats
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 500
@@ -0,0 +1,80 @@
 pageType: content
 background:
  type: image
  src: media/yu7-detail.jpg
  fit: {mode: cover}
 elements:
  - elementId: design-wash
    elementType: shape
    bounds: [0, 0, 960, 540]
    shapeName: rect
    fill: {type: solid, color: "#0000004C"}
  - elementId: design-topline
    elementType: line
    bounds: [58, 46, 844, 1]
    viewBox: [844, 1]
    points: "0,0.5 844,0.5"
    border: {style: solid, width: 1, color: "#FFFFFF7A"}
  - elementId: design-index
    elementType: text
    bounds: [58, 58, 160, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "02 / DESIGN"
  - elementId: design-title
    elementType: text
    bounds: [58, 88, 560, 74]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:44px;font-weight:700">长车头，宽体，低趴</span></p>
        <p><span style="font-size:19px;color:#D8DFE2">一眼看上去，就知道它在向前</span></p>
  - elementId: design-callout
    elementType: text
    bounds: [62, 186, 270, 168]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:72px;font-weight:700;color:#FF6900">1:3</span></p>
        <p><span style="font-size:16px;color:#D8DFE2">头身比</span></p>
        <p style="margin-top:14px"><span style="font-size:17px">让 SUV 也有跑车的第一眼张力。</span></p>
  - elementId: design-labels
    elementType: text
    bounds: [58, 390, 460, 74]
    content:
      fontFamily: MiSans
      color: "$white"
      fontSize: 16
      lineHeight: 1.45
      text: |
        <p>3.11㎡ 蚌式铝机盖　｜　0.245 超低风阻</p>
        <p><span style="color:#C9D0D4">10 组贯穿式风道　｜　19 个风口　｜　流线型尾部</span></p>
  - elementId: design-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "数据来源：<a href=\"https://www.xiaomiev.com/yu7\">小米汽车官网 YU7 外观设计</a>；数据来自小米汽车实验室"
 animations:
  - elementId: design-title
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
  - elementId: design-callout
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: design-labels
    effect: fly-in
    direction: up
    trigger: afterPrevious
    durationMs: 500
@@ -0,0 +1,80 @@
 pageType: content
 background:
  type: image
  src: media/yu7-cabin.jpg
  fit: {mode: cover}
 elements:
  - elementId: cabin-wash
    elementType: shape
    bounds: [0, 0, 960, 540]
    shapeName: rect
    fill: {type: solid, color: "#00000055"}
  - elementId: cabin-panel
    elementType: shape
    bounds: [0, 0, 390, 540]
    shapeName: rect
    fill: {type: solid, color: "#11161AD9"}
  - elementId: cabin-index
    elementType: text
    bounds: [58, 42, 160, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "03 / CABIN"
  - elementId: cabin-title
    elementType: text
    bounds: [58, 91, 315, 132]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:40px;font-weight:700">座舱，</span></p>
        <p><span style="font-size:40px;font-weight:700">不只是屏幕</span></p>
        <p><span style="font-size:22px;color:#FF6900;font-weight:700">是第一排观景席</span></p>
  - elementId: cabin-body
    elementType: text
    bounds: [60, 240, 278, 100]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 16
      lineHeight: 1.5
      text: |
        <p>把导航、车况与娱乐信息</p>
        <p>放到自然视线里，</p>
        <p>让驾驶少一点低头，多一点从容。</p>
  - elementId: cabin-stats
    elementType: text
    bounds: [60, 380, 312, 92]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:31px;font-weight:700">1.1 m</span><span style="font-size:14px;color:#C9D0D4"> HyperVision 全景显示</span></p>
        <p><span style="font-size:17px;color:#C9D0D4">三块 Mini LED　｜　108 PPD 视网膜级清晰度</span></p>
  - elementId: cabin-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "资料来源：<a href=\"https://www.mi.com/global/discover/article?id=5174\">Xiaomi Global · YU7 cabin</a>；图源：小米汽车官网"
 animations:
  - elementId: cabin-title
    effect: fly-in
    direction: right
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: cabin-body
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
  - elementId: cabin-stats
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 500
@@ -0,0 +1,72 @@
 pageType: content
 background:
  type: image
  src: media/yu7-performance.jpg
  fit: {mode: cover}
 elements:
  - elementId: perf-wash
    elementType: shape
    bounds: [0, 0, 480, 540]
    shapeName: rect
    fill: {type: solid, color: "#071013D0"}
  - elementId: perf-index
    elementType: text
    bounds: [58, 42, 200, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "04 / PERFORMANCE"
  - elementId: perf-title
    elementType: text
    bounds: [58, 92, 390, 110]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:42px;font-weight:700">快，不必牺牲从容</span></p>
        <p><span style="font-size:20px;color:#FF6900;font-weight:700">YU7 Max · 性能旗舰</span></p>
  - elementId: perf-stats
    elementType: text
    bounds: [60, 250, 360, 150]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:59px;font-weight:700;color:#FF6900">3.23</span><span style="font-size:19px"> s</span><span style="font-size:15px;color:#C9D0D4">　0—100 km/h</span></p>
        <p><span style="font-size:32px;font-weight:700">508 kW</span><span style="font-size:15px;color:#C9D0D4">　最大功率</span></p>
        <p><span style="font-size:32px;font-weight:700">253 km/h</span><span style="font-size:15px;color:#C9D0D4">　最高时速</span></p>
  - elementId: perf-caption
    elementType: text
    bounds: [60, 435, 350, 38]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 14
      text: "性能被放进电机、底盘与整车稳定性里。"
  - elementId: perf-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "数据来源：<a href=\"https://www.mi.com/global/discover/article?id=4925\">Xiaomi Global · YU7 launch</a>；图片：小米汽车官网"
 animations:
  - elementId: perf-title
    effect: fly-in
    direction: right
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: perf-stats
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 650
    easing: ease-out
  - elementId: perf-caption
    effect: fade-in
    trigger: afterPrevious
    durationMs: 450
@@ -0,0 +1,71 @@
 pageType: content
 background:
  type: image
  src: media/yu7-hero.jpg
  fit: {mode: cover}
 elements:
  - elementId: range-wash
    elementType: shape
    bounds: [0, 0, 960, 540]
    shapeName: rect
    fill: {type: solid, color: "#00000070"}
  - elementId: range-index
    elementType: text
    bounds: [58, 42, 160, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "05 / RANGE"
  - elementId: range-title
    elementType: text
    bounds: [58, 95, 520, 90]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:44px;font-weight:700">长途，不应被充电打断</span></p>
        <p><span style="font-size:19px;color:#D8DFE2">高压平台，把“出发”交还给生活</span></p>
  - elementId: range-big
    elementType: text
    bounds: [58, 238, 490, 118]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:84px;font-weight:700;color:#FF6900">835</span><span style="font-size:25px"> km</span></p>
        <p><span style="font-size:17px;color:#C9D0D4">CLTC 最长续航（标准版）</span></p>
  - elementId: range-secondary
    elementType: text
    bounds: [60, 400, 460, 70]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:31px;font-weight:700">12 min</span><span style="font-size:15px;color:#C9D0D4">　10% → 80%</span></p>
        <p><span style="font-size:15px;color:#C9D0D4">15 分钟补能，最高可增加约 620 km 续航</span></p>
  - elementId: range-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "数据来源：<a href=\"https://www.xiaomiev.com/yu7\">小米汽车官网 YU7</a>；续航 / 充电数据以车型配置与测试条件为准"
 animations:
  - elementId: range-title
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
  - elementId: range-big
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 700
    easing: ease-out
  - elementId: range-secondary
    effect: fly-in
    direction: up
    trigger: afterPrevious
    durationMs: 500
@@ -0,0 +1,74 @@
 pageType: content
 background:
  type: image
  src: media/yu7-tech.jpg
  fit: {mode: cover}
 elements:
  - elementId: intel-wash
    elementType: shape
    bounds: [0, 0, 530, 540]
    shapeName: rect
    fill: {type: solid, color: "#05080CD9"}
  - elementId: intel-index
    elementType: text
    bounds: [58, 42, 230, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "06 / INTELLIGENCE"
  - elementId: intel-title
    elementType: text
    bounds: [58, 92, 420, 105]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:42px;font-weight:700">智能能力，藏在日常里</span></p>
        <p><span style="font-size:19px;color:#FF6900;font-weight:700">从“能用”到“好用”</span></p>
  - elementId: intel-body
    elementType: text
    bounds: [60, 230, 390, 118]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 16
      lineHeight: 1.45
      text: |
        <p>HyperVision 全景显示、智能座舱、</p>
        <p>高算力辅助驾驶硬件，</p>
        <p>共同把“信息”变成自然的体验。</p>
  - elementId: intel-stats
    elementType: text
    bounds: [60, 390, 410, 94]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:34px;font-weight:700;color:#FF6900">700 TOPS</span><span style="font-size:15px;color:#C9D0D4"> DRIVE AGX Thor</span></p>
        <p><span style="font-size:15px;color:#C9D0D4">LiDAR　｜　11 个高清摄像头　｜　12 个超声波雷达</span></p>
  - elementId: intel-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "资料来源：<a href=\"https://www.mi.com/global/discover/article?id=5174\">Xiaomi Global · YU7 intelligent cabin</a>；图片：小米汽车官网"
 animations:
  - elementId: intel-title
    effect: fly-in
    direction: right
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: intel-body
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
  - elementId: intel-stats
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 550
@@ -0,0 +1,80 @@
 pageType: final
 background:
  type: image
  src: media/yu7-exterior.jpg
  fit: {mode: cover}
 elements:
  - elementId: summary-wash
    elementType: shape
    bounds: [0, 0, 960, 540]
    shapeName: rect
    fill: {type: solid, color: "#071013A6"}
  - elementId: summary-rule
    elementType: shape
    bounds: [58, 44, 72, 4]
    shapeName: rect
    fill: {type: solid, color: "$orange"}
  - elementId: summary-index
    elementType: text
    bounds: [58, 58, 180, 22]
    content:
      fontFamily: MiSans
      color: "$orange"
      fontSize: 12
      bold: true
      letterSpacing: 2
      text: "07 / TAKEAWAY"
  - elementId: summary-title
    elementType: text
    bounds: [58, 106, 540, 90]
    content:
      fontFamily: MiSans
      color: "$white"
      text: |
        <p><span style="font-size:49px;font-weight:700">YU7 的答案，很简单</span></p>
        <p><span style="font-size:23px;color:#FF6900;font-weight:700">快 · 远 · 智能 · 从容</span></p>
  - elementId: summary-body
    elementType: text
    bounds: [60, 248, 620, 125]
    content:
      fontFamily: MiSans
      color: "$white"
      fontSize: 23
      lineHeight: 1.45
      text: |
        <p>它没有把 SUV 做成“更大的一台车”，</p>
        <p>而是把速度、空间与科技，重新排成了同一条路。</p>
  - elementId: summary-end
    elementType: text
    bounds: [60, 412, 500, 60]
    content:
      fontFamily: MiSans
      color: "$muted"
      fontSize: 17
      text: |
        <p>小米 YU7</p>
        <p>让每一次出发，都更接近“伟大旅程”。</p>
  - elementId: summary-source
    elementType: text
    bounds: [58, 508, 850, 16]
    content:
      fontFamily: MiSans
      color: "#D8DFE2"
      fontSize: 9
      text: "图片 / 资料：<a href=\"https://www.xiaomiev.com/yu7\">小米汽车官网 YU7</a>；本页为产品信息摘要"
 animations:
  - elementId: summary-title
    effect: zoom-in
    trigger: afterPrevious
    durationMs: 650
    easing: ease-out
  - elementId: summary-body
    effect: fly-in
    direction: up
    trigger: afterPrevious
    durationMs: 600
    easing: ease-out
  - elementId: summary-end
    effect: fade-in
    trigger: afterPrevious
    durationMs: 500
@@ -0,0 +1,30 @@
 version: v2
 title: 小米 YU7｜介绍
 size: [960, 540]
 theme:
  colors:
    orange: "#FF6900"
    white: "#FFFFFF"
    muted: "#C9D0D4"
    ink: "#11161A"
  textStyles:
    title:
      fontFamily: MiSans
      color: "$white"
      fontSize: 42
      bold: true
      lineHeight: 0.98
    body:
      fontFamily: MiSans
      color: "$white"
      fontSize: 18
      lineHeight: 1.35
 pages:
  - pages/01_cover.page
  - pages/02_position.page
  - pages/03_design.page
  - pages/04_cabin.page
  - pages/05_performance.page
  - pages/06_range.page
  - pages/07_intelligence.page
  - pages/08_summary.page
@@ -1,6 +1,6 @@
 {
  "name": "open-kimi-ppt-skills",
-  "version": "1.0.2",
+  "version": "1.1.0",
  "description": "Unofficial reverse-engineered Kimi Slides skill for AI coding agents with local PPTD editing and PPTX export.",
  "license": "MIT",
  "author": "binaryify",
@@ -37,7 +37,9 @@
    "skills/open-kimi-ppt/reference/",
    "skills/open-kimi-ppt/scripts/",
    "README.md",
-    "README_EN.md"
+    "README_EN.md",
    "theme.md",
    "theme_EN.md"
  ],
  "scripts": {
    "test": "node --test",
@@ -39,7 +39,7 @@ Understand the user's requirements based on the context:
 2. Then determine the design direction
  - Self-directed design: no preference, or only simple style constraints given; you need to fill in or create the design
-  - Design system: the user provides a complete and detailed design scheme covering all color, font, layout, and component specifications
+  - Design system: a preset design system from the skill (`reference/design_system/`) is specified, or the user provides a complete and detailed design scheme covering all color, font, layout, and component specifications
  - Use a template: a template is provided and must be used
  - Style transfer: a style reference source is provided (images, web pages, etc.)
@@ -49,10 +49,22 @@ Understand the user's requirements based on the context:
  - Outline: the user provides a page-by-page outline, speech script, or similar content
  * When the "user input type" is [Full document] or [Outline] and it is not specified whether expansion is allowed: since a page-by-page outline, speech script, or user document can hardly support the full content of a presentation, prefer using search to expand with more relevant material, cases, etc., unless the user explicitly says not to expand
-4. Page count
+4. Finally determine the exact page count
  - If the user requests a specific page count, the user's requirement takes priority
  - Page-by-page outline/script provided: match the number of pages in the outline/script
-  - When a complete and relatively structured document is provided / when only a topic is provided: decide the page count yourself based on the document content / search results
+  - When a complete and relatively structured document is provided: ask the user how much document content one page should cover, and give an estimated total page count; when only a topic is provided: suggest a recommended page count and confirm with the user
 #### Clarification and follow-up questions
 When any of the following situations arise, resolve them by asking the user (use the agent's ask/clarification tool when available)
 1. Requirements are ambiguous
 - The user's intent is unclear or hard to understand
 - The files/URLs provided by the user are inaccessible
 2. Conflicting intents
 - The user's intents contradict each other. For example:
  * A design system is selected while also requesting a style that is completely inconsistent with that design system (e.g., using a McKinsey style while requiring large areas of whitespace on pages) / using a template / referencing an image style
  * Requesting both "make 10 pages" and "deliver 30+ pages of output"
 3. Unable to determine the user's requirements on your own
 - When the purpose, design direction, input type, page count, etc. are hard to determine by yourself
 ### step3. Generate the presentation based on the user's requirements
@@ -60,7 +72,8 @@ Before generating, first read `reference/pptd.md` to understand the pptd format
 #### Replicating a PPT
 - Analyze the images to estimate element positions, fonts and sizes, etc., and **replicate 1:1 as closely as possible**.
- When an image contains elements that are hard to replicate directly and cannot be approximated with icons/shapes (e.g., photos, avatars), you may use tools such as bash or python to crop and screenshot the original image
+- For parts that are difficult to make out, use methods such as grid lines and close-up views to improve understanding.
 - Replicate simple content in the image with elements; icons may be approximated with icons provided by Font Awesome. For content that cannot be approximated with icons or shapes, such as photos and avatars, use tools such as bash or python to crop and split the original image, then add the resulting image elements to the presentation
 #### Editing a PPT
 - Convert the user's uploaded pptx file to .pptd format
@@ -79,8 +92,9 @@ When generating a PPT, adopt different production approaches for different user
 ##### Design system
 1. Read the general constraints section of the `reference/slides_categories.md` guide, and read the scenario document corresponding to the user's query as the design foundation
-2. Read the user-provided design system document as the presentation style. It is strictly forbidden to reference or mix in other design styles
+2. Read the specified design system as the presentation style: either the user-provided design scheme, or the matching preset under `reference/design_system/` (search by name / path the user specified; prefer the folder's `design.md` when present). It is strictly forbidden to reference or mix in other design styles
 3. Produce the presentation with reference to the above
 4. Do not auto-pick a preset during self-directed design; only use `reference/design_system/` when a preset is explicitly specified
 ##### Using a template
 1. Convert the user's uploaded pptx file into pptd form
@@ -93,6 +107,21 @@ When generating a PPT, adopt different production approaches for different user
 - If the user provides a style reference URL, do not only read the text content; refer to and learn from the page's visual effect more to help understand the style
 2. Produce the presentation using the reference file's style characteristics. You are encouraged to reuse illustrations, fonts, font-size hierarchies, elements, etc. from the original pdf/url
 ##### Images and Visual Materials
 1. Images are an effective way to enrich a presentation's visual impact. Appropriate images should be used not only on covers and section dividers, but also on body pages to enrich the page, aid understanding, or support decision-making
 2. Images are used to show concrete subjects, explain content, provide evidence, or establish a scene. Logos, icons, decorative textures, and very small thumbnails do not count as substantive imagery.
 3. When a page involves products, people, places, buildings, events, cases, interfaces, experimental subjects, or spatial environments, prioritize corresponding real images or screenshots. If real images and screenshots cannot be obtained, generated images may be used instead.
 4. Image priority: images provided by the user; images from official websites, official reports, and credible sources; searched images that are directly relevant to the content; images generated for conceptual expression or atmosphere.
 5. After deciding which images are needed, complete image search, generation, and downloading in a batch before designing pages around their proportions. Save images in the `media` directory, keep them clear, and never stretch or distort them.
 6. Analytical, technical, and academic PPTs should use corresponding evidence images when products, experiments, interfaces, cases, or on-site materials are available. Do not reduce every page to text, color blocks, and shapes.
 7. Do not add irrelevant images merely to meet a quantity target. Every image must be directly relevant to the page's conclusion or communication goal.
 ##### Content Guidelines
 1. Language style: unless the user explicitly requests otherwise, strictly avoid overly abstract expressions and uncommon metaphors
 - Do not overuse metaphors, slogans, or abstract jargon such as distribution, an N-step argument, everything at a glance, a closed loop, hands-on practice, verification, deconstruction, second-class citizens, poison pills, or wall clocks
 - Do not use common AI phrasing such as “not X, but Y,” “X is Y,” “why / based on what / how,” “key takeaway,” or “N battlefronts / paths”
 - Do not use overly colloquial expressions such as “where should the ammunition go,” “the Nth thing,” “can't pick the right one,” or “cannot be used as X”
 ### step4. PPT validation
 1. Validate the generated pptd against the format definition in `reference/pptd.md` (required fields, types, bounds, theme tokens, resource paths, etc.) and repair issues over multiple rounds
 2. Visual review with exported page images — **required before PPTX export when the model supports image input (multimodal)**:
@@ -162,3 +191,6 @@ When generating a PPT, adopt different production approaches for different user
 8. After export, verify that the output exists and report the generated path. Confirm that every slide has exactly one root-level fade transition in valid CT_Slide order (`cSld`, optional `clrMapOvr`, `transition`, optional `timing/extLst`) and that the PPTX ZIP passes integrity checks. A byte-string search for `<p:fade>` is insufficient because Office ignores transitions nested inside `cSld`. For higher-risk decks, additionally inspect font parts and representative rendered/opened pages as appropriate.
 9. When the user wants to open, edit, save, or export a PPTD project manually, start the local browser editor with `npx open-kimi-ppt-skills serve`. Ask the user to open `http://127.0.0.1:55173/` and authorize the complete PPTD project directory. Use a Chromium-based browser for writable access; folder-upload fallback is read-only. The local host only serves the editor shell, while the embedded public Kimi editor and remote assets still require network access.
 10. After completing and delivering any presentation, always end the final response with a concise optional next step telling the user that they can run `npx open-kimi-ppt-skills serve` to view or edit the PPTD project, configure slide transition animations, and export PPTX manually. Keep this reminder in addition to, not instead of, the required project and file links.
 11. Element animations (`page.animations` in PPTD — entrance / emphasis / exit / motion-path; see `reference/pptd.md` §6): use them only when the user explicitly requests animations, or when the deck is clearly intended for live presentation / slideshow playback and animation provides a clear benefit for staged disclosure, process demonstration, causal explanation, pacing, visual impact, or brand storytelling. By default, do not add element animations to reading-oriented, self-study, print, or primarily send-and-browse decks. Prefer 1–3 animation groups per page and simple effects such as fade, fly, and zoom. This is separate from the default PPTX slide-level fade page transition written by `export_pptx.py`.
 12. Speaker notes (`notes` on each `.page`): use them only when the user explicitly requests them; otherwise, do not add them.
 13. Parallel tool calls: during PPT production, make tool calls in parallel whenever possible; in each round, write multiple page files in parallel to reduce the number of steps.
@@ -0,0 +1,177 @@
 # Organization Name — The Productivity Payoff STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A consulting thought-leadership report-style PPT for executives, strategy teams, and research readers. It supports readable long-form text, quantitative charts, section navigation, and a branded, forward-looking visual feel; it is not a low-word-count sales pitch page or a visual-poster-style one-pager.
 Core page grammar:
 1. **Light blue report pages**: a soft pale blue–light purple gradient background carrying black long-form text, multi-column explanations, and purple key numbers.
 2. **Black-background evidence pages**: charts sit on a large black canvas, with white text and purple/pink/orange bars or lines creating strong contrast.
 3. **Dark photographic section dividers**: the cover and section transitions use "path forward" imagery such as light trails, ridgelines/roads/people.
 4. **Fixed report skeleton**: a white section-navigation strip at the bottom, a purple ">" identity mark at lower left, a vertical report name on the right edge, and a page number at lower right.
 Underlying principles:
 1. **Evidence takes precedence over visual drama**: charts, sources, numbers, and conclusions must be readable; black backgrounds, purple, and photographic light effects must not obscure data or weaken contrast.
 2. **High density must be disciplined by a stable skeleton**: multiple text paragraphs, multi-column modules, and complex charts are allowed, but every page must have a title area, a body area, footer navigation, and sufficient padding — avoid free-floating stacking.
 3. **Page variation serves section rhythm**: photography pages for openings and section transitions, black-background pages for models/data evidence, light blue pages for explanations and recommendations; do not invent a new template on every page just for variety.
 ## 2. Page Skeleton
 - **Canvas ratio**: widescreen 16:9; use the full rectangular canvas — no portrait or social-media ratios.
 - **Default margins**: content pages keep relatively wide outer margins; the body extends from upper left toward center-right, with a fixed navigation band reserved at the bottom. Black chart blocks and photography blocks may extend nearly full-bleed, but must still avoid the footer and page number.
 - **Background system**: content pages and the table of contents use pale blue, ice blue, and light purple gradients; chart pages overlay a black rectangular evidence area on the light blue page, or let a single black block occupy most of the page; sections/covers use full-bleed dark photography.
 - **Title area**: typically at upper left. Black or purple on light blue pages; white inside the black region on black-background chart pages; placed over dark or calm areas on photography pages.
 - **Body area**: divided into text explanation areas, chart evidence areas, image areas, and number-emphasis areas. Content pages are mostly 2–3 columns; chart pages are usually a large black-background chart + explanatory sidebar; case pages are usually text + a photo on the right or above.
 - **Header**: no strong header bar; the report name appears as vertical text on the right edge instead of a horizontal top header.
 - **Footer navigation**: most non-cover pages have a white navigation band at the bottom. A purple ">" symbol at lower left; section names laid out horizontally in the middle, separated by thin vertical lines; the current section darker or bolder; the page number at lower right. Keep it low-height, thin-lined, and in a stable position.
 - **Vertical report name on the right**: content pages, the table of contents, and some chart pages place the report title/subtitle along the right edge. Do not make it a prominent decoration — it should be small and unobtrusive.
 - **Logo**: on the cover's lower right, use the full brand wordmark (rendered as plain small text, writing the new topic name; do not draw a graphic logo); on content pages, the purple ">" identity mark mainly replaces the full wordmark; the back cover or closing page may restore the full brand wordmark.
 - **Table of contents page**: light blue gradient background, title at upper left, section entries laid out in multiple horizontal columns; page-number ranges placed above or near the section titles; key sections may carry a small thumbnail grid; columns separated by thin vertical lines.
 - **Author page**: light blue gradient background, purple title at upper left; author headshots arranged in a grid — headshot, name, title, and a small professional-social-platform icon form a standard author card.
 - **Default reading path**: top-left title/lead-in → body left-column text → central chart or number → right-column supplement/photo → bottom navigation confirming the section.
 ## 3. Content Organization
 - **Title style**: use report-style statements — a judgment sentence, a section name, or a "Figure X" chart caption; important section divider pages may use a large title to pose the question or direction. Do not chase short punchy slogans.
 - **Key message sentences**: place 1–2 explanatory sentences under the title or above a chart, stating the finding, definition, or how to read the chart. Do not make an entire page a single big-statement sentence unless it is a section photography page.
 - **Body text organization**: short paragraphs, left-aligned; single paragraphs medium-to-short in length; 2–4 paragraphs per column. Avoid long unbroken walls of text.
 - **Grouping logic**: includes "problem—evidence—implication", "model elements", "behavior/recommendation lists", "case explanations", and "number comparisons"; use columns, light-colored cards, black-background areas, or thin dividers to separate them — not large numbers of icons.
 - **Number of points per page**: a content page carries 1 main topic plus 2–4 supporting points; high-density pages may contain multiple sub-modules but must have one unified overall title and clear arrangement.
 - **Bullet style**: prefer subheadings + paragraph explanations; use traditional bullet lists sparingly; list items should be short, indentation restrained.
 - **Keyword emphasis**: use bold, purple numbers, or purple subheadings; avoid heavy colored highlighting. Highlight at most 1–2 keywords or numbers per module.
 - **Numbers/units/time frames**: large numbers may stand alone as purple or black info blocks with an explanation alongside; percentages, multiples, and time ranges must stay consistent with chart labels. Numbers must not be replaced by decorative graphics.
 - **Source footnotes**: place small source/notes at the bottom of charts and research pages or at chart edges, low-contrast but readable. Sources must not enter the main title hierarchy and must not grab attention with decorative colors.
 ## 4. Content Page Layout System
 ### A. Light blue multi-column report page
 For concept explanations, background, recommendations, case text, and a small number of key figures. Pale blue/light purple gradient background, title at upper left, body in 2–3 columns: the left column holds the lead-in or main argument, the middle column holds supplementary paragraphs/bullets, and the right column holds large numbers, images, or a short conclusion. Use purple numbers, bold subheadings, and clear column widths to establish focus, and keep paragraph spacing. If complex data comparison is needed, do not force it into this layout — switch to a black-background chart page.
 ### B. Black-background chart evidence page + explanatory sidebar
 For complex bar charts, line charts, grouped comparisons, model derivations, and "Figure"-type evidence. One side or the center is a large black rectangular chart area with a white title and caption inside; the other side keeps a light blue text column explaining the findings in black body text. The chart area is the visual center of gravity; use purple/pink/orange data series, white key annotations, and local arrows/connecting lines. If the chart carries only a single simple number, do not use a large black background — it would feel too heavy.
 ### C. Photography section/question page
 For covers, section transitions, important questions, or interim conclusions. Use full-bleed dark photography — ridgelines, roads, silhouettes, tech devices, purple light trails are common; a large white title sits over a dark area, with a smaller subtitle. Apart from the necessary title, a brief caption, and the brand wordmark (plain small text; do not draw a graphic logo), do not overlay long body text or complex charts.
 ### D. Text + image case page
 For industry cases, scenario descriptions, or concrete evidence. A real photo or a partial device/scene sits in a large rectangular area on the right or above; text sits in columns on the left or beside it. The image does not act as a full-page background, and no illustrations are used. If the photo background is busy, do not place text directly on it — put the text in a light-colored area.
 ### E. High-density module/framework page
 For 3–5 behaviors, elements, stages, or model components. Organize with horizontal cards, vertical columns, purple bottom labels, or a black-background formula area; each module contains a subheading, a short explanatory paragraph, and necessary numbers or keywords. When there are many modules, use equal-width columns and consistent padding; do not replace textual logic with complex SmartArt decoration.
 ## 5. Color System
 - **Light blue background**: approximately #D6ECFE / #E4F4FF / #DFF3FF. Used for the large background areas of content pages, table of contents, author, and case pages; may gently gradient into light purple but must not become oversaturated. Low replaceability — it is core to the style.
 - **Light purple background transition**: approximately #DAE3F9 / #D8E3FA / #C2A1BC. Used at background gradient edges, card bases, or local atmosphere; medium-to-low area. May be adjusted within the same color family; switching to a large warm-color base is not recommended.
 - **Black/near-black evidence base**: approximately #08151C / #201F20 / #000000. Used for chart canvases, formula models, and text-carrying areas of dark section pages; area may range from half a page to most of a page; must not be broken into fragments mixed with the light blue body text.
 - **Primary text black**: approximately #111111 / #201F20. Used for body text, subheadings, footer navigation, and table text on light blue backgrounds; high contrast is mandatory. Must not be replaced by light gray as the primary body color.
 - **Reversed-out white text**: #FFFFFF or near-white. Used for black-background charts, photography-page titles, and cover titles; only on dark backgrounds.
 - **Brand purple / accent purple**: approximately #A100FF / #8A00E6 / #7F35FF. Used for the ">" identity mark, key numbers, key chart series, labels, and a few subheadings; small-to-medium area. It may be fine-tuned toward the brand's primary color, but must not be replaced with multiple unrelated vivid colors.
 - **Pink-purple/magenta data color**: approximately #D000FF / #C000C8. Used for the second accent series in charts or black-background cards; serves data grouping only, never large blocks of body text.
 - **Orange/coral data color**: approximately #D38778 / #D7AA9F. Used for cover light effects, contrast series in charts, or warm accents; small area; must not become the primary body color.
 - **Gray support**: approximately #8C95A4 / #A8ABBC / #C7CAD6. Used for axes, dividers, notes, non-key labels, and navigation separators; keep it unobtrusive.
 - **Table base / light card base**: approximately #E8F3FC / #DCEFF8. Used for high-density tables or info boxes, slightly differentiated from the background.
 Keep a single page within the blue-purple family + black/white/gray + 1 warm data color. Status colors are not prominent; if positive/negative states are needed, prefer text labels and purple/gray depth variations, and introduce red/green cautiously.
 ## 6. Fonts and Text Hierarchy
 - **Font character**: the body mainly uses Liter (Arial-family sans-serif, built-in); titles, sections, or table-of-contents entries may use Unna (Times-class serif, built-in); branded special titles may use QuattrocentoSans Bold. Overall avoid script, handwriting, and rounded cartoon fonts.
 - **Body text**: 1x, used for paragraphs, explanations, author titles, and footer navigation.
 - **Footnotes/sources/page numbers**: about 0.6–0.8x, understated but readable; page numbers should not be enlarged into decorative numerals.
 - **Subheadings/module titles**: about 1.1–1.4x, may be bold or purple.
 - **Chart labels/axes**: about 0.7–0.9x, white/gray on black backgrounds, black/gray on light backgrounds; keep clear without competing with titles.
 - **Key message sentences/lead emphasis**: about 1.2–1.6x, sitting between the title and body size.
 - **Page titles**: about 2–3x, aligned top-left on content pages; table-of-contents/author-page titles may be slightly larger.
 - **Cover/section large titles**: about 3–5x, white or black depending on the background; the first visual level of the whole page.
 - **Large numbers**: about 2.5–4x, usually purple, paired with 0.9–1x explanatory text; numbers must carry a unit or context.
 Text is primarily left-aligned. Centered copy may appear sparingly only on the cover or photography section pages; avoid large centered blocks on content pages.
 ## 7. Chart Language
 The main chart types are bar charts, grouped bar charts, line/trend charts, formula/model-type diagrams, and a small number of matrix comparisons.
 - **Chart canvas**: prefer black or near-black rectangles with clean edges, no thick borders or shadows; a clear boundary from the light blue text area.
 - **Titles and numbering**: place "Figure X" plus an explanatory title at the upper left of the chart area, in white; the title should state the purpose of reading the chart, not just the chart type.
 - **Axes and gridlines**: use low-brightness thin gray lines, kept few in number. Do not create noise with dense grids.
 - **Data series**: primarily purple, pink-purple, and orange/coral; non-key series use gray or dark purple; the number of series should be limited — avoid rainbow colors.
 - **Labels**: key data may be marked directly at bar tops or near lines; small labels in white or light gray. Avoid stacking all labels into illegibility.
 - **Legends**: small and clear, placed to the right of or above the chart; color swatches/line segments must match the series.
 - **Key annotations**: white arrows, curved connectors, brackets, or short notes may emphasize trends/gaps; annotations must serve the conclusion, not decorate.
 - **Forecast/target/baseline lines**: use dashed lines, thin lines, or a single accent color with a text explanation; do not cover data with large semi-transparent bands.
 - **Boundaries**: on pages with few charts do not force charts in; when there is no data, use text modules or number cards instead.
 ## 8. Tables and High-Density Information
 - **Headers**: use white text on black, black text on light purple/light blue, or bold text; restrained height, left-aligned text.
 - **Row/column structure**: separate with thin gray lines or light base blocks; avoid heavy grids; allocate column widths by importance — the first column may be slightly wider.
 - **Row height**: accommodates 1–3 lines of text; high-density pages may compress, but text must never touch lines or overlap.
 - **Base colors**: light blue/light purple for ordinary cells, black backgrounds for high-contrast evidence tables; if zebra striping is used it should be very subtle.
 - **Key rows/columns**: highlight with purple text, purple bars, bold, or reversed white on dark bases; do not mark with multiple status colors simultaneously.
 - **Number alignment**: numbers, percentages, amounts, and years align by column with unified units; explanatory text is left-aligned.
 - **Symbols/rating dots**: simple dots, short dashes, checks, or purple marks may be used; they must be low-decoration and unambiguous. Avoid colorful icon rating systems.
 - **Summary rows**: handle with bold, a top divider, or a dark base — no raised shadows.
 ## 9. Components and Graphic Elements
 - **Bottom section navigation**: thin white band + purple ">" + horizontal section names + thin vertical lines + page number; must not be covered by body content.
 - **Vertical report name on the right**: small, near the edge, low contrast. Do not turn it into a large sidebar.
 - **Purple ">" brand symbol**: used at lower left and for local brand hints; small area — it must not become a large decorative arrow used everywhere.
 - **Title bar/chart title block**: at the upper left of the black chart area, composed of "Figure X + conclusion title", white text layered, compact and left-aligned.
 - **Number emphasis blocks**: a large purple percentage/value + short black explanatory text; usually 1–3 per page; avoid overuse.
 - **Light-colored info boxes**: for "knowledge at work"-style supplements, definitions, tips, or action recommendations; base color slightly deeper than the background, stable padding, medium text density.
 - **Purple labels/card bases**: for short recommendations or key sentences on model or behavior pages; suitable as strong emphasis inside black areas, but keep the count low.
 - **Image frames**: rectangular real photos with clean edges and no thick borders; may occupy half or a third of the page, zoned apart from text.
 - **Process arrows/model symbols**: use simple arrows, multiplication signs, plus signs, and connecting lines to express formulas or relationships; thin lines, colors mainly white, gray, purple.
 - **Icons**: use only a few functional small icons, such as professional-social-platform marks. Do not expand into a colorful icon system.
 ## 10. Texture and Prohibited Items
 A flat, restrained, report-like tech-consulting style that builds visual focus through dark photography, black-white contrast, purple brand accents, and data charts — not complex decoration.
 **Prohibited**:
 - emoji, cartoon stickers, social-media-style icons, large colorful illustrations.
 - 3D fonts, dimensional buttons, glowing outlines, heavy drop shadows, glassmorphism cards.
 - complex textured backgrounds, ornate borders, rainbow gradients, meaningless decorative lines.
 - large blocks of centered body text, text placed over busy photos, low-contrast light gray body text.
 - fake charts without data sources, dashboard components added purely for aesthetics.
 **Use with caution**:
 - Gradients: only light blue–light purple backgrounds or photographic light-trail atmosphere; no strong multi-color gradients.
 - Shadows: the source file barely relies on shadows; avoid them when generating; if used for image layering, keep them extremely subtle.
 - Rounded corners: not a primary feature; cards and images should have square or slightly rounded corners — do not become a rounded SaaS style.
 - Colorful icons: visible only in functional marks such as professional-social-platform icons on author pages; should not be heavily used in body pages.
 - Photos: may be used for cases or scenarios in content, but must be zoned; do not make every page a photographic background.
 **Usable on special pages**:
 - Full-bleed dark photos, strong light trails, large white titles: for covers and section transitions.
 - Large black backgrounds: for chart evidence, model derivations, and dark closing/appendix-style pages.
 - Full brand wordmark (plain small text, writing the new topic name; do not draw a graphic logo): more appropriate on the cover and back cover; content pages primarily use the purple ">".
 ## 11. Generation Checklist
 - Is it a 16:9 report page rather than a poster/social card?
 - Does the page type clearly belong to one of: light blue content page, black-background evidence, photography section, case text+image, author/table of contents?
 - Is the bottom white navigation band kept, with the purple ">" at lower left, section names, and page number; do content pages have the vertical report name on the right?
 - Are titles left-aligned and report-style; is the body text columned with paragraphs that are not overlong?
 - Is the palette mainly blue-purple-black-white-gray, with warm colors only supplementing a small amount of data/light trails?
 - Is purple used for brand, numbers, and key points rather than flooding large areas?
 - Do charts have titles, labels, legends/sources, and sufficient contrast on the black background?
 - Do tables use thin lines, unified alignment, and restrained base colors, with consistent number units?
 - Are images real photography and zoned apart from text, without long text pressed onto busy backgrounds?
 - Are emoji, 3D, heavy shadows, complex decoration, rainbow colors, and meaningless icons avoided?
 - Have you checked for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, covered footers, and wrong proportions?
 - Does each page have one main topic and a clear reading path, without information weakened by template repetition or element stacking?
 - No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution
 - No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion
@@ -0,0 +1,208 @@
 # PJ Mountain — Business DD Report (Organization Name) STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 For high-information-density scenarios such as commercial due diligence, market research, strategic diagnosis, and management decision reporting. It uses a white landscape canvas, black conclusion titles, thin gray dividers, deep navy structural blocks, blue data accents, and dense charts and tables. The title area states "this page's judgment/analysis topic"; bar charts, stacked bars, lines, heatmaps, matrices, and multi-column text provide the evidence; the footer fixedly holds sources, company name, and page number. Large images, illustrations, and decorative graphics rarely appear; brand color serves structure and emphasis only, never atmosphere.
 **Underlying principles**
 1. **Evidence takes precedence over decoration.** Charts, tables, footnotes, sources, and measurement-basis notes must be kept first; if a page is crowded, compress decoration and whitespace rather than deleting data labels or sources.
 2. **Consistency takes precedence over per-page variation.** Variants such as a right-side explanation column, a left dark opinion column, table-of-contents highlighting, or gray-based explanation areas are allowed, but the title area, footer, dividers, font hierarchy, and brand-color grammar must remain stable.
 3. **Brand color serves readability.** Deep navy is used for structure and key categories; bright blue for data emphasis and selected states; when brand color reduces contrast or confuses data, prefer black, gray, white, and clear labels.
 ## 2. Page Skeleton
 **Canvas ratio:** widescreen 16:9 landscape. White background by default; the table-of-contents page and explanation columns may use light gray; section/opinion pages may use deep navy vertical blocks. Content pages do not use full-bleed image backgrounds.
 **Margins and grid:** keep stable outer margins on left and right; the title area at top, the body's rectangular workspace below the title rule, and a fixed footer area at bottom. Body text commonly uses 2 columns, 3 columns, image-left-text-right, table-left-notes-right, or chart-on-top-footnotes-below.
 **Title area:** the main title at upper left is usually 1–2 lines, in large black serif bold or a bold title style; below it a sans-serif subtitle stating the subject, scope, unit, or measurement basis. A thin gray/black horizontal rule under the title separates the evidence area.
 **Body area:** carries charts, tables, flow/structure diagrams, parallel modules, and explanatory text. Usually the main evidence sits on the left; explanations, background, conclusions, or supplementary material on the right; multi-module pages read top-to-bottom, left-to-right.
 **Footer:** fixedly contains the source/footnotes, company name, and page number. Sources sit at lower left or below charts, in a size clearly smaller than body text; "Organization Name" and the page number sit at lower right. A thin line often separates the body above the footer.
 **Logo and branding:** the cover's upper left carries the brand wordmark as plain small text showing the new topic name or left blank — no graphic logo drawn; content pages convey the brand through the footer company name, not by repeating an enlarged logo in every module.
 **Page types:**
 - **Cover:** the left side holds the brand wordmark, project name, report type, date, and confidentiality statement; the right side features a blue linear-curve graphic as the only strong visual element. The cover does not use the content-page footer and page-number structure.
 - **Table of contents page:** large-size Contents on the left white area, section structure on the right light gray area; the current section may be highlighted with a deep navy horizontal bar. The TOC page emphasizes navigation and holds no data charts.
 - **Content pages:** mainly white background, top conclusion title + rule + body evidence + bottom source/page number.
 - **Section/progress pages:** reuse the Contents structure with a deep navy bar marking the current position; they may serve as transitions between sections but must not be generalized into ordinary content pages.
 - **High-density appendix/analysis pages:** smaller text, denser tables, and stronger columnization are allowed, but the title, footnotes, and page number are retained.
 **Default reading path:** title judgment → subtitle/units → largest difference in the chart or table → right-side/bottom explanation → sources and footnotes.
 ## 3. Content Organization
 **Title style:** use an analytical topic or conclusion sentence, not marketing slogans. The common structure is "subject + trend/judgment + key numbers/scope/reason", controlled to 1–2 lines; when the title already carries the conclusion, the subtitle only adds the measurement basis.
 **Key message sentences:** placed above or to the right of charts, stating data scope, units, CAGR, market definition, sample, or scenarios; they serve the chart directly — no abstract promotional lines.
 **Body organization:** use short paragraphs, bullets, numbering, or subheading groups, with each bullet expressing one fact or reason. Avoid long centered copy. Organize dense text with bold keywords, indentation, rules, and module titles.
 **Number of points per page:** a standard content page revolves around 1 main judgment and carries at most 2–4 supporting arguments. High-density pages may contain multiple evidence blocks, but they must share the same analytical question; do not collage unrelated charts onto one page.
 **Grouping logic:** group by market/customer/product/competition/organization, or by time, region, segment, growth driver, or degree of impact. Parallel modules must be isomorphic: title position, metric definition and basis, and color meaning consistent.
 **Keyword emphasis:** use bold, deep navy subheadings, bright blue numbers, and light gray base boxes. Avoid colored highlighters, emoji, exaggerated exclamation marks, or decorative underlines.
 **Numbers and units:** numbers must carry units, time ranges, and the necessary measurement basis; growth rates, CAGR, shares, and amounts are specified in chart titles, axis labels, or footnotes. Forecasts, targets, and actuals are distinguished by color, dashes, or labels — not by text explanation alone.
 **Source footnotes:** all data charts and tables must have Source/Note/measurement-basis notes. Use the smallest text level, placed at the bottom of charts or on the left of the footer; never at the visual center.
 ## 4. Content Page Layout System
 **A. Conclusion title + single main chart + right explanation column**
 For core trends or scale judgments. The left 65%–75% holds a bar, stacked-bar, or line chart; the right 20%–30% holds a light-gray-background explanation column or a white caption column with background, growth drivers, and management implications. Use a bright blue series, bold numbers, arrows, or a few elliptical labels for emphasis. Not suited for multi-topic side-by-side layouts or complex classification pages that need item-by-item expansion.
 **B. Conclusion title + multi-column text analysis page**
 For textual argumentation such as trends, market characteristics, drivers, and risk points. The body divides into 2–3 columns, each with a numbered subheading and a short paragraph of explanation; narrow spacing or thin lines between columns, with sparing bold keywords. This layout is information-dense but weak in visual evidence — do not use it for too many consecutive pages; if there are key numbers, switch to a chart page.
 **C. Chart + mechanism/flow explanation combination page**
 For migrations from a traditional state to a new state, value chains, business processes, or organizational transformation. A trend chart sits left or center; vertical flow blocks, arrows, or stage notes sit right; deep navy/bright blue blocks mark the target state, key steps, or emphasized links. Flow components aid explanation — they cannot replace data evidence.
 **D. High-density table/matrix page**
 For multi-dimensional comparison of customers, competitors, products, features, KBFs, or opportunity points. The body is a large table or matrix with clear headers and fine row/column separation; key cells use blue, gray bases, rating dots, or symbol marks. A deep navy opinion column may sit on the right summarizing 2–4 key findings. Not suited for telling a single trend, nor for content lacking comparable dimensions.
 **E. Dark sidebar opinion page**
 For section openings, strong-opinion summaries, or separating "explanation" from "evidence". A deep navy vertical column on the left or right takes about a quarter to a third of the width, with white text and bright blue subheadings inside; the other side holds white-background charts/tables. The dark column must not be abused as decorative background — use it only when guidance, conclusion pressure, or section identification is needed.
 **F. Table of contents / progress navigation page**
 For section transitions. Contents on the left, light gray content area on the right, current section highlighted in deep navy. It only takes on navigation — it carries no body analysis. When generating a new topic, preserve the section numbering, hierarchy, page ranges, and highlight-bar grammar.
 ## 5. Color System
 **Background white #FFFFFF**: the main background of content pages, largest area. Cannot be replaced by a colored background; large color bases are not recommended except for the TOC/explanation columns.
 **Light gray background #E6E6E6 / #E9E9E9**: for the right area of the TOC, side explanation columns, table bases, and local backgrounds. Used for structural distinction; lightness may be slightly adjusted, but replacing it with a high-saturation brand color is not recommended.
 **Primary text black #000000 / dark gray #222222**: for titles, body text, chart labels, and table text. Low-contrast gray must not replace body text.
 **Brand deep navy #051C2C**: for dark sidebars, key structural blocks, some bar series, title bars, and flow blocks. May be replaced by a corporate primary color of equal depth, but white text must remain readable.
 **Bright blue #2150FE / #1F5BFF**: for emphasized data series, current states, key labels, selected items, and key flow blocks. Must not be spread over large areas; if replaced by a brand color it must stay high-saturation, high-contrast, and distinct from deep navy.
 **Light blue #BBD5EE / #DAE7F3 / #E6EEF6**: for secondary data series, light area charts, cover linear graphics, and weak table emphasis. Cannot carry white body text; avoid going too light and losing edges.
 **Neutral grays #747474 / #8E9294 / #A4A4A4 / #D0D0D0**: for secondary bars, axes, gridlines, table lines, captions, and un-emphasized categories. Gray steps may be replaced, but the hierarchy must be maintained.
 **Status color boundary:** no red-green-yellow status system is established. When positive/negative states are needed, prefer depth variations, labels, and arrows; red/green may only be used cautiously and sparingly for explicit positives/negatives — they must not change the deck's calm blue-gray temperament.
 **Per-page primary-color limit:** content pages use black/white/gray + deep navy + bright/light blue. Unless data must be distinguished, do not introduce a third high-saturation color.
 ## 6. Fonts and Text Hierarchy
 **Font character:** body text and most labels use Arial-class sans-serif; the cover main title and content-page large titles may use Times New Roman Bold-class serif bold. Italic Arial is used sparingly for explanatory text in notes, footnotes, or source lines.
 **Relative hierarchy:**
 - **Cover project name:** about 3.5–4.5x body size, serif bold, one of the largest texts in the deck.
 - **Content-page main title:** about 2–3x body size, black, 1–2 lines allowed, conclusion first.
 - **Section/TOC title:** about 2–3x body size, often paired with generous whitespace or a light gray content area.
 - **Subtitle/chart title:** about 1.1–1.4x body size, may be bold; states the subject, units, and measurement basis.
 - **Body text and bullets:** defined as 1x, line spacing tight but never overlapping.
 - **Table text/chart labels:** about 0.75–1x body size; number labels may be slightly smaller but must remain readable.
 - **Notes, sources, footnotes, page numbers:** about 0.55–0.75x body size, complete in information but visually recessed.
 **Weight rules:** bold is used for titles, subheadings, table headers, keywords, and key numbers; do not bold large stretches of long body paragraphs. Italic is only for note tone or source attribution, not a primary emphasis device.
 **Alignment:** titles and body are mainly left-aligned; numbers are right-aligned or aligned on decimal places in tables, category text left-aligned. Avoid large centered blocks.
 ## 7. Chart Language
 Business analysis charts include bar charts, stacked bars, line/trend lines, combination charts, market-size forecasts, share/ranking charts, and a few scatter/bubble-type marks. Charts must prove the title — they are not decoration.
 **Axes and grids:** axes use thin gray or black; gridlines are very light and may be omitted when unnecessary. Axis labels are short; units go in the chart title or beside the axis. The horizontal axis is usually years, market segments, or categories; the vertical axis carries amounts, shares, indices, etc.
 **Series colors:** key series use deep navy or bright blue; secondary/historical/other categories use gray or light blue. The same color for the same category in stacked bars must stay consistent across pages — do not randomly change colors page to page.
 **Data labels:** directly mark key bars, the latest year, CAGR, forecast endpoints, and comparison differences. Keep labels close to data points; avoid making readers depend on complex legends.
 **Forecasts and baselines:** forecast years, CAGR, targets, or baselines may be distinguished with dashed lines, arrows, brackets, elliptical labels, or different gray-blue tones. Actual/forecast intervals must be stated — color alone is not enough.
 **Legends:** placed above the chart or in blank space inside it; with few series, prefer direct labels. Color swatches must match the graphics; text in small sans-serif.
 **Annotations:** sparing use of short arrows, brackets, CAGR labels, rounded/elliptical small marks. No glow, shadows, 3D bars, or perspective effects.
 ## 8. Tables and High-Density Information
 Tables are used for comparing competitors, customers, products, features, market attributes, and opportunity points — as analytical tools, not decorative lists.
 **Headers:** use bold, dark text, or deep navy/light gray bases. Column headings may run multiple lines but must use comparable definitions and measurement bases. If a header is very long, split it into a main heading + subheading — do not squeeze it into illegibility.
 **Rows/columns and separation:** mainly thin gray lines, more horizontal than vertical; light gray bases may distinguish headers, group rows, or explanation columns. Avoid heavy borders and complex grids.
 **Row height and density:** high density is allowed, but each row needs a stable baseline and enough spacing. Long text should be broken into lines or phrased as fragments — never overflow the cell.
 **Key marks:** key rows/columns may use deep navy bars, light blue bases, bright blue text, bold, rating dots, checks/symbols, or small labels. Wingdings-type symbols may be used sparingly for states/marks, but must not become a colorful icon system.
 **Alignment:** left-align text; right-align numbers or align on digit positions; keep percentages, amounts, and years in unified formats. Rankings, scores, and status dots are center-aligned.
 **Zebra striping and base colors:** light gray zebra striping or local light gray bases may improve scannability, but must not be too dark. Table base colors must keep black text high-contrast.
 **Summary and notes:** summary rows, averages, or key conclusions go at the bottom of the table or in a right-side note column; sources and measurement-basis notes sit immediately below the table.
 ## 9. Components and Graphic Elements
 **Thin horizontal rules:** separate the title area, body area, and footer. Lines are thin, gray or black; do not replace them with thick colored lines.
 **Deep navy sidebar:** for section opinions, conclusion summaries, explanation columns, or guidance beside high-density tables. White text, bright blue subheadings, and short bullets inside; it is an information container, not a decorative color block.
 **Light gray explanation box:** for background, growth drivers, assumptions, and supplementary notes. Placed on the right of the page or beside tables; must have a subheading.
 **TOC highlight bar:** a deep navy horizontal bar marks the current section with reversed white text. Only used on TOC/progress pages.
 **Data labels and badges:** CAGR, latest values, forecast values, and key categories may use small labels, ellipses, or capsule marks; colors stay deep navy, bright blue, or gray; keep them near the corresponding data.
 **Flow blocks and arrows:** for migration paths, stages, and mechanism explanations. Shapes are rectangles, rounded rectangles, or simple arrows in dark blue/bright blue/gray. No complex SmartArt styles, dimensional arrows, or gradient arrows.
 **Image frames:** if screenshots/system interfaces are used, embed them only as evidence material, keeping rectangular boundaries and captions — no large emotional imagery.
 **Icons:** colorful icons are not a stable language of this style. If a state must be shown, use simple symbols, dots, checks, arrows, or text labels in a single color or the blue-gray family.
 ## 10. Texture and Prohibited Items
 Overall a flat, restrained, data-driven, consulting-report texture, building professionalism through typography, lines, tables, charts, and limited color blocks.
 **Prohibited:**
 - large photo backgrounds, video-still backgrounds, or emotional full-bleed images;
 - emoji, cartoon illustrations, complex colorful icons, sticker-style decoration;
 - 3D charts, perspective bars, glow, strong shadows, glassmorphism, textured backgrounds;
 - large gradient color blocks as body backgrounds;
 - large centered copy, marketing-slogan titles, unsourced data;
 - random multi-color palettes or multiple high-saturation colors competing on one page.
 **Use with caution:**
 - Rounded corners: may be used for small labels, flow blocks, elliptical marks; must not generalize into a card-style UI style;
 - Shadows: the source file barely relies on them; if used on embedded screenshots, keep them extremely light;
 - Red/green status colors: only for explicit positive/negative/risk/opportunity, used sparingly;
 - Screenshots: only as factual evidence — they need a title, boundary, source, or caption.
 **Usable on special pages:** the cover may use the blue linear-curve graphic; the TOC may use a large light gray content area and deep navy highlight bar; section progress pages may strengthen whitespace and navigation, but must not introduce poster-like visuals.
 ## 11. Generation Checklist
 - Is it 16:9 landscape, mainly white background, with a stable title area, body area, and footer area?
 - Is the title an analytical topic or conclusion sentence rather than an empty slogan? Is it controlled to 1–2 lines?
 - Does the page have only one main judgment, with charts/tables directly supporting that judgment?
 - Are sources, footnotes, units, time ranges, and the actual-versus-forecast basis retained?
 - Is the palette limited to black/white/gray + deep navy + bright/light blue, with bright blue only on key points?
 - Is body text Arial-class sans-serif, with titles allowed in formal serif bold? Is dependence on specific point sizes avoided?
 - Do charts use flat bars, stacked bars, lines, labels, and thin gray axes, avoiding 3D, gradients, and excessive legends?
 - Do tables have clear headers, thin separators, unified alignment, readable row heights, and necessary key marks?
 - Does the right explanation column or dark sidebar carry a conclusion/background function rather than pure decoration?
 - Are photo backgrounds, emoji, complex icons, shadows, glow, textures, and random colors avoided?
 - Have you checked for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, and missing page numbers/sources?
 - When generating multiple pages, are TOC highlighting, footer, color grammar, chart encoding, and title hierarchy consistent — avoiding each page looking like a different template?
 - No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution
 - No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion
@@ -0,0 +1,151 @@
 # Organization Name · 2023.05 Report Name CEOs Roadmap on Generative AI STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 For consulting-firm presentations to CEOs, executives, and business leaders covering trend insights, strategic roadmaps, risk identification, and organizational action recommendations. It uses high-density business argumentation: each page gives its conclusion first, then supports it with charts, tables, comparison boxes, case excerpts, or action lists.
 Core design: a dark tech-photo banner carries the title; a white/extremely-light-gray body keeps reading easy; mint green and brand green organize hierarchy; a high-density grid with tiny footnotes maintains the report feel. The reading path is "argument first + evidence unfolded + sources as backstop".
 Underlying principles:
 - **Argument takes precedence over decoration**: the top of every page must be a judgment or action-oriented title that stands on its own; charts, tables, and components serve only that judgment.
 - **Green only for structure and emphasis**: light green for background zoning and callout blocks, deep green for key numbers, labels, paths, bars, and positive states; green must not be expanded into an arbitrary full-page decorative color.
 - **High density must be tamed by the grid**: multiple evidence points must sit in columns, rows, cards, matrices, flows, or tables; avoid free-floating scatter, unaligned collages, and arbitrarily enlarged local elements.
 ## 2. Page Skeleton
 - **Canvas ratio**: horizontal 16:9 widescreen, designed for report reading rather than large-type stage presentations.
 - **Default background**: content pages use white or extremely light gray; light gray is used for table bases, module bases, or a bottom summary band. Covers, back covers, and a few section/transition pages use darkened tech photography.
 - **Title area**: content pages have a fixed dark narrow banner across the top, embedding a darkened photo or near-black base color; the title is left-aligned, white, bold, a complete judgment sentence. Small section numbers or progress labels such as "1a / 1b / 2b" may appear at the lower edge of the title or the upper left of the body.
 - **Body area**: located below the banner. Common arrangements include left-right column splits, three-column cards, quadrants/matrices, chart + annotations, table + side notes, and central model + surrounding explanations; margins are compact and strictly aligned, separated by thin lines, light gray bases, or whitespace.
 - **Footer**: a tiny gray footnote/source/copyright area at the bottom, left-aligned; a small page number at lower right or along the bottom edge. Footnotes are separated from the body by whitespace or a thin line and never mixed into the body.
 - **Logo and branding**: on the cover's upper left, a plain-small-text combination of Organization Name and report name (writing the new topic name) or left blank; on the back cover, the brand wordmark over a darkened photo; neither draws a graphic logo. Content pages do not repeat the logo at large scale — the black banner, green system, and footnote style carry brand recognition.
 - **Cover skeleton**: full-bleed darkened photo; a light green brand block at upper left; a horizontal light green semi-transparent title block mid-page toward the left/center; title in black bold; the date at a small serif/italic level. The lower edge of the green block may carry thin vertical striping.
 - **Section/transition pages**: a light green block or a darkened photo block on the left carries the section topic, with a bullet list on the right; increase whitespace and keep left alignment.
 - **Closing/disclaimer pages**: the disclaimer page uses a white base, light green subheadings, and gray body blocks; the back cover returns to darkened photography and the white brand wordmark.
 - **Default reading path**: top banner conclusion → upper-left number/module title → main chart or central model → right-side/below explanation → footnote sources.
 ## 3. Content Organization
 - **Title style**: use conclusion sentences, judgment sentences, or action sentences — not mere nouns; express meanings like "what is happening", "why it matters", "how the CEO should act", "where the risks are". Titles may be longer but must stay readable within one to two lines inside the banner.
 - **Key message sentences**: below the title or at the upper left of the body, a "number + phrase" stage label may appear; numbers use green or black small labels.
 - **Body organization**: micro-points organized as short paragraphs and bullets. Avoid continuous full-bleed long paragraphs; break long explanations into cards, left-right columns, or table rows.
 - **Grouping logic**: prefer time/stage progression, left-right contrasts, matrix comparisons, and "three parallel columns", "two-category contrast", "core/non-core", "traditional/new-type", "opportunity/risk/action".
 - **Number of points per page**: one main judgment per page, with 3–6 evidence points, bullets, or comparison dimensions inside. If more than 6 parallel points are needed, convert to a table or split into two pages.
 - **Keyword emphasis**: use bold, green text, green labels, light green base blocks, rings, or borders; risks or warnings may use small-area magenta/rose marks. Do not use fluorescent multi-color, high-saturation red-blue mixing, or large rainbow emphasis.
 - **Numbers and units**: numbers sit directly beside bars, labels, table cells, or key conclusions; units and time frames go in chart titles, axis titles, or footnotes. Growth rates, years, market sizes, and share-type data should be more prominent than explanatory text.
 - **Quotes and cases**: external quotes use quotation marks, light green quote blocks, or news-excerpt boxes; quotes serve the evidence and must not replace the page's main conclusion.
 - **Source footnotes**: charts, market sizes, case screenshots, and quotes all keep their sources; use extremely small gray text, preferably left-aligned, staying out of the main reading flow.
 ## 4. Content Page Layout System
 ### A. Top banner + three/multi-column opinion cards
 For concept differences, capability traits, risk categories, and organizational requirements. The body divides into three or four columns, each with a small icon/subheading/short caption/a few bullets; column titles in green, columns separated by light gray vertical lines or whitespace. A key column may add a light green base or a deep green label; each column holds one small point and 2–4 supporting notes. Do not use this layout when continuous data or complex causal chains must be shown.
 ### B. Main chart + right-side evidence/explanation card
 For growth trends, market size, adoption rates, and budget changes. The chart takes about half to two-thirds; an explanation box, news excerpt, or key takeaway goes to the right or above. The chart uses a green primary series and gray secondary series with key data directly annotated; cards use a light gray or white base with thin borders and a few green titles. Only one main chart conclusion per page — avoid stacking multiple unrelated charts.
 ### C. Large opinion block on the left + action explanation on the right
 For CEO action recommendations, roadmap hints, and core problem definitions. A large light green base block on the left carries the core judgment, question, or classification model; the right side explains action implications with bullets, short paragraphs, or cases. Rings, double circles, arrows, or partition lines may connect them. If the page's focus is data proof, reduce the large opinion block's area to avoid squeezing the chart.
 ### D. Comparison matrix/table page
 For comparing technology stages, business use cases, risk dimensions, organizational capabilities, and departmental responsibilities. Use column titles + row dimensions; headers in light green or deep green, cells holding short phrases or bullets. Key columns/rows use a green base, bold, or graphic marks. If there are fewer dimensions than 2×2, use cards instead of a table.
 ### E. Central model + surrounding explanation
 For frameworks, capability systems, governance models, or value chains. A circle, ring, or matrix core sits at the center, with 4–8 explanatory nodes around it connected by thin lines, arrows, or spatial relations. The center is usually green, the periphery light gray/light green. This layout emphasizes structural relationships and is not suited for long text passages or precise values.
 ### F. Process/roadmap layout
 For action steps such as "discover—select—build—govern—scale". Use a horizontal or vertical step bar, green marking the current/key stage and gray marking auxiliary stages; a short caption sits below each step. Flow arrows should be lightweight and flat — no complex dimensional arrows. If the steps are not sequential, convert to a matrix or parallel cards.
 ### G. News/case collage page
 For external events, public sentiment, risk instances, or real-world evidence. News cards, screenshots, or excerpts must obey the grid boundaries and the unified title banner; screenshots should not fill the whole page and should carry explanatory labels. This layout is an evidence page and must not become a regular content template.
 ### H. Contact/appendix list page
 For teams, authors, contacts, and disclaimers. Use a headshot or text-card grid; names/titles in bold, with roles, emails, and links at a small level. Reduce charts and strong emphasis.
 ## 5. Color System
 - **Near-black / deep charcoal #0B0C0D, #0D0F0F, #191E1F**: for title banners, darkened photo overlays, back-cover backgrounds, and primary body text. Cannot be replaced by a bright brand color — that would destroy the consulting report's authority.
 - **White / extremely light gray #F1F1F1, #F2F2F0, #ECEDED**: for main page backgrounds, content bases, table blank areas, and card bases. May switch between white and light gray, but must not become a high-saturation colored background.
 - **Mint light green, approximately #9CDDAA, #92C9A0, #8FC49B, #BFEFD0**: for cover title blocks, section blocks, callout boxes, the large left opinion base, and weak table emphasis. Text must stay black/dark; replacement colors must also be low-saturation, light backgrounds.
 - **Brand primary green #23B871, #35BA7A, #408A5A**: for key bars, labels, key numbers, icons, current process steps, and core rings. Do not introduce several similar greens at once and create hierarchy confusion.
 - **Deep green #26633B, #2E6F47, #5F877B**: for small title labels, dark chart series, emphasis borders, and structural lines; not suitable as the base color for long body text.
 - **Mid grays #748687, #A6AB9E, #B7B7B7, #D2D2D2**: for dividers, table lines, axes, auxiliary text, non-key series, and disabled/baseline states; must not replace the primary text color.
 - **Magenta/rose, approximately #C2185B, #B0185A**: only for small-area marks of risks, counterexamples, warnings, and negative categories — rings, labels, keywords. Must not be used at large area as a second brand color.
 - **Chart series boundary**: the primary hue is green; only gray, light green, and a little magenta serve as auxiliaries. If data series exceed 3–4, prefer distinguishing with green depth steps and grays — do not introduce rainbow colors.
 ## 6. Fonts and Text Hierarchy
 - **Font character**: the body uses the QuattrocentoSans family, bold for titles and subheadings, italic for quotes or notes; the cover "Report Name" may use Unna (built-in serif).
 - **Page title**: 1.8–2.5x body size, bold, white, placed in the dark banner; long titles may wrap, staying left-aligned with tight line spacing.
 - **Cover main title**: 2.5–4x body size, black bold, placed on the light green semi-transparent block; date/series name smaller, may use italic or serif.
 - **Key message sentences/lead-ins**: 1.2–1.6x body size, may be bold or green, placed at the upper left of the body or on a light green block.
 - **Body text**: defined as 1x, regular QuattrocentoSans, tight line spacing, left-aligned; avoid centered long paragraphs.
 - **Subheadings/card titles**: 1.1–1.4x body size, bold, green, or dark; text short and explicit.
 - **Table and chart labels**: 0.75–1x body size; numbers may be bold or enlarged to 1.1–1.4x; axis labels and legends smaller, kept gray.
 - **Notes/footnotes/sources/page numbers**: 0.45–0.7x body size, gray. Footnotes must not grab attention with green.
 ## 7. Chart Language
 - **Types actually present**: mainly bar charts, stacked bars, line/trend charts, donut/bubble-style relation charts, and simplified coordinate charts.
 - **Axes and gridlines**: axis lines and gridlines extremely thin, light gray; background grids may be weakened or omitted, but necessary coordinate information is kept.
 - **Series colors**: the primary series uses brand green or a combination of green depths; auxiliary series use gray, light yellow-green, or light gray; forecasts, targets, or key years use deeper green with direct number annotations.
 - **Data labels**: key bars, endpoints, peaks, or growth rates are directly annotated; numbers in dark or green. Avoid making readers rely on the legend alone for the key points.
 - **Legends**: small size, placed above or below the chart. With only 1–2 series, label directly beside the graphics.
 - **Annotations and explanations**: use thin lines, arrows, light green boxes, or small text to explain key turning points; news excerpts may serve as supporting-evidence cards. Annotations must not cover the data body.
 - **Boundaries**: no 3D bars, gradient fills, heavy shadows, rainbow heat palettes, or complex animated chart effects; chart beauty must submit to data clarity.
 ## 8. Tables and High-Density Information
 - **Table role**: for multi-dimensional comparisons, risk lists, action responsibilities, capability assessments, and use-case screening; usually the page's main evidence structure, not decorative layout.
 - **Headers**: deep green, light green, or dark text, with backgrounds mainly light green/white/light gray; text short, emphasizing dimension names rather than long sentences.
 - **Row/column structure**: many columns are allowed, but strict alignment is required; use thin gray lines or light gray bases to separate rows — do not rely on thick black borders.
 - **Base colors and zebra striping**: weak light gray or light green base zones; zebra contrast should not be too strong.
 - **Key rows/columns**: emphasize with light green bases, green text, bold, dot ratings, or borders; risk/negative items use small magenta marks. No full-row bright red or high-saturation warning colors.
 - **Number and text alignment**: numbers right-aligned or centered, text left-aligned; short ratings, symbols, and dots may be centered; units uniformly stated in the column header or a footnote.
 - **Row height and density**: compact row heights; each cell limited to a phrase, short sentence, or 1–2 bullets. If a cell needs a long explanation, convert to a card page.
 - **Symbol marks**: minimal symbols such as dots, checks, short dashes, and level-color blocks may be used; a legend is required or semantics must stay consistent.
 ## 9. Components and Graphic Elements
 - **Dark title banner**: the core identifying component, spanning the top, containing a darkened tech photo or near-black base, carrying the white conclusion title; the preferred choice for all content pages.
 - **Light green title/opinion block**: for cover main titles, section hints, key questions, and action principles; rectangles or large color blocks, no complex effects.
 - **Number labels**: such as "1a / 1b / 2b", expressing roadmap progress; green/dark, placed at the upper left of the body.
 - **Cards**: white or light gray base, thin border or borderless, containing a subheading, short caption, icon/number; distinguished by alignment and whitespace, no heavy shadows.
 - **Dividers**: thin gray lines, light green lines, or whitespace gaps for between columns, between table rows, and isolating the footnote area; lines should be light and not create a caged-grid feel.
 - **Ring/double-circle/matrix marks**: for core/non-core, positive/negative, key/non-key; green means core or positive, magenta means non-core/risk/warning. Text inside rings must be short.
 - **Icons**: a small number of single-color green/gray linear icons or simplified symbols, only to aid module recognition. Colorful skeuomorphic icons are prohibited.
 - **Arrows and flow lines**: express processes, causality, or conversion relationships; flat thin lines, green or gray. Avoid thick dimensional arrows.
 - **Screenshot/news cards**: only on case-evidence pages, placed on white cards or light gray areas with short captions; must have boundaries and alignment — never freely tilted or stacked.
 ## 10. Texture and Prohibited Items
 A flat, restrained, consulting-report-style tech feel; the brand feel comes from brand green, dark photo banners, the QuattrocentoSans font system, and a rigorous grid — not complex decoration.
 - **Prohibited**: 3D charts, glow effects, heavy drop shadows, complex gradients, rainbow palettes, emoji, cartoon illustrations, colorful skeuomorphic icons, meaningless decorative lines, large blocks of centered copy, full-page grid-free free-form layout, low-contrast light text, and cover-style photo backgrounds abused across content pages.
 - **Use with caution**: photos, screenshots, magenta warning color, ring models, flow arrows, large light green base blocks. They must carry an evidence, classification, action, or emphasis function; if they only fill blank space, delete them.
 - **Usable on special pages**: covers, back covers, and section transition pages may use large darkened photos and light green blocks; case-evidence pages may use news-screenshot collages; contact pages may use headshot grids. Regular content pages should stay with white bases, the banner, and charts/tables/cards.
 - **Rounded corners and shadows**: cards should have only slight corner rounding or be nearly square; shadows are basically unused. Modules are separated by base color, lines, and whitespace.
 - **Image dependency**: content pages do not rely on large images to create mood; images appear only in the title banner or evidence cards. Every image needs darkening, cropping, and alignment, and must not break text readability.
 ## 11. Generation Checklist
 - Skeleton: is it 16:9; do content pages have the dark top banner; does the body fall into a clear grid; are footer source/copyright/page number at the small bottom level?
 - Copy: is the title a conclusion or action sentence; does each page have only one main judgment; are paragraphs broken into short sentences, bullets, cards, or tables?
 - Hierarchy: do title, key message, body, subheadings, chart labels, and footnotes form a relative size difference; are specific-point-size dependence and hierarchy-free stacking avoided?
 - Color: is the base white/light gray, text black, green the accent; is magenta used only for small risk areas; does each page stay within green + gray + a small amount of warning color?
 - Layout: do charts, tables, cards, and flows each do their own job; is competition between multiple unrelated main visuals avoided; are left-right/multi-column arrangements aligned?
 - Charts: is the flat green-gray family used; are axes and gridlines light; is key data directly annotated; are 3D, gradients, and excessive series colors forbidden?
 - Tables: are headers, rows/columns, separators, key rows/columns, and number/text alignment consistent; do cells avoid long-paragraph overflow?
 - Components: do the title banner, number labels, light green opinion blocks, cards, dividers, and ring/flow lines have explicit semantics; are icons single-color and simple?
 - Prohibited items: are there no emoji, cartoon illustrations, colorful skeuomorphic icons, glow, heavy shadows, complex decoration, large centered body blocks, or abused photo backgrounds?
 - Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, footnotes pressing on the body, and template repetition that mismatches the information structure.
 - No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution
 - No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion
@@ -0,0 +1,184 @@
 # F030 · Top-Tier Management Consulting and Strategy Full-Package PPT Template STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 For management reporting on strategic consulting, cost optimization, operational diagnosis, efficiency improvement, roadmap planning, opportunity assessment, and results review — aimed at management, project owners, or decision committees. It uses a "white consulting-report skeleton + high-saturation red focal point + grayscale data components": the cover is near-black/deep red with an oversized title; content pages use a white or extremely-light-gray base, titles at upper left or upper-left-of-center, chart-based proof, card-based summaries, and roadmap progression. Photos, illustrations, and decorative icons do not form the main visual.
 Underlying principles:
 - **One red focal point per page**: it may apply to a main card, a key bar, a keyword, the highest-intensity heatmap cell, or a CTA — do not spread it evenly across multiple areas of the same page.
 - **Structure before decoration**: organize pages with left-right column splits, card matrices, chart combinations, timelines, and heat maps; do not rely on textures, shadows, complex graphics, or large images.
 - **Data clarity over chart showmanship**: bar charts, donut charts, heat matrices, simple tables, and number cards serve the conclusion directly; weaken axes, legends, and gridlines to highlight comparison relationships and key values.
 ## 2. Page Skeleton
 The canvas is horizontal 16:9 business presentation ratio. Content pages default to a white or #F6F6F6-level extremely-light-gray background with relatively wide safe margins. The basic structure is "upper-left title area + central body area + small caption/footnote area", with the reading path running title, red focal point, chart/card/table details.
 Title area: usually at upper left, on a few chart pages at upper right or upper-center-left, carrying the topic, question, or conclusion — no decorative title bars. Below the title, 1–2 lines may state the analysis purpose, scope, or action implications; the body unfolds below or to its right.
 Body area: column-split and modular; common content includes large-type definitions, pie/donut charts, bar charts, heat matrices, roadmap cards, capsule-label flows, number metric cards, and table-style comparisons. Cards stay uniformly aligned and spaced; light gray blocks zone the page; red blocks mark priority.
 Header: not mandatory. A small brand wordmark or tiny mark may sit at upper left; a date, short note, or small caption may sit at upper right; it must keep a low presence and never form a heavy horizontal bar.
 Footer: carries no strong navigation; may hold footnotes, sources, contact information, or a small CTA. If a page number is added, use extremely small black-gray text tucked in a corner — it must not steal from the body.
 Dividers: use thin light gray lines, card boundaries, or background blocks. Avoid thick black lines and complex borders. Axes and reference lines also use pale gray low contrast.
 Cover: near-black/deep-red background, an oversized white bold title, red button-style labels, a dark-red large-character watermark, and a small amount of explanatory text on the right; this treatment must not migrate to ordinary content pages.
 Closing page: a large title with a few contact details/CTA, on a white or light gray base; red may emphasize key action words, but no photo walls or complex decoration should be added.
 ## 3. Content Organization
 Titles use question-type, topic-type, or action-type short phrases, such as "Why…Matters", "Objectives…", "Roadmap Overview", "Identifying…Opportunities". Prefer noun phrases or verb-object structures; avoid long full sentences.
 Place 1–2 lines of key message near the title, stating the conclusion, the analysis basis, or the next action — they cannot replace the body charts. Explanatory content is broken into short captions, bullet cards, or footnotes.
 Body content follows "one main point + three to five supporting points". Supporting points may be cards, process stages, metric columns, chart labels, or table rows; each card usually holds one small title and one compressed caption, distinguished by whitespace, a light gray base, and numbering.
 Keywords may use red text, white text on red, black capsule labels, bold subheadings, enlarged numbers, or local red chart elements. Red only corresponds to "key point, current, recommended, high value, risk, or action" — never to ordinary decoration.
 Numbers such as percentages, amounts, improvement magnitudes, savings, and stage numbers stand as independent blocks, with units and explanations immediately adjacent. Keep time, stages, and serial numbers consistent; roadmaps use clear numbering like 01/02/03/04 and do not mix in complex hierarchies.
 Sources and notes use extremely-small-level light gray or dark gray text, placed at the bottom, beside charts, or to the right of the title; they only state data sources, assumptions, or measurement bases — they do not carry key conclusions.
 ## 4. Content Page Layout System
 ### A. Large-type definition/opinion page
 For introducing concepts, defining problems, or stating strategic positions. A small lead-in sits at the top or upper left; the body states the viewpoint in oversized text with keywords marked red; below it may follow a row of metrics, categories, or keyword modules. Information density low to medium. If the text runs beyond a few lines or multiple data groups are needed, do not use this layout.
 ### B. Left title + right/center chart analysis page
 For current-state, distribution, trend, comparison, and cause analysis. The title and caption sit on the left or upper right; the body holds a donut chart, bar chart, combination bar-line chart, or small metric cards; key sectors, key bars, or current values use red, everything else gray. Suited for 1 main chart + 2–4 annotation points; not suited for cramming in multiple large charts of equal weight.
 ### C. Roadmap/stage card page
 For showing 3–5 stages, goals, tasks, or execution paths. One large red card marks stage 1, the current stage, or the core initiative; the rest are light gray cards; enlarged numbering sits at the top or on the left. Emphasize stage names, actions, and expected results. Beyond five stages, split across pages or convert to a timeline; not suited for unordered miscellaneous lists.
 ### D. Heat matrix / opportunity identification page
 For two-dimensional assessments of impact, complexity, priority, or savings headroom. The body is a red–pink–light-pink grid, deep red marking high intensity or priority, with a small legend, axis notes, and a red conclusion card beside it. The matrix serves relative positioning and clustering, not precise value reading; when precise values are needed, switch to a table or bar chart.
 ### E. Capsule-label flow + recommendation card page
 For process nodes, operational steps, category groupings, or optimization-opportunity lists. Black capsules mark first-level categories or path nodes, red capsules mark key nodes, light gray capsules mark ordinary items; 2–3 recommendation cards may sit at the bottom or on the right. Labels must be short and avoid wrapping; when there are too many labels, group them — no complex connecting lines.
 ### F. Multi-metric dashboard / case results page
 For results, cases, forecasts, savings, or performance changes. Composed of large number cards, bar charts, mini donut charts, and caption lists; a red number card or red chart element is the results focal point, gray cards provide the comparison. Every large number must come with an explanation — do not stack isolated metrics.
 ### G. Simple table / comparison matrix page
 For comparing initiatives, departments, cost items, time periods, or opportunity categories. The table occupies the lower-middle part of the body, with a simple header and key columns/rows in red or on a light red base. A title and a conclusion sentence are mandatory — the table must not become an unexplained data pile.
 ## 5. Color System
 Background colors:
 - **#FFFFFF**: the main content base, card interiors, and large whitespace areas — the largest area. Cannot be replaced by high-saturation colors.
 - **#F6F6F6 / #F7F7F7 / #F8F8F8**: full page background, light zoning, table bases, or chart container bases; must keep white cards clearly visible.
 Primary text colors:
 - **#070302 / #0F0605 / #1C0B0B**: titles, important body text, cover main title, and key chart text.
 - **#2F2929 / #454545 / #484545**: body captions, subheadings, legend text, and table text.
 Primary accent red:
 - **#FF4D4D / #FF5454 / #FF5C5B / #FE6464**: for red cards, key numbers, key chart bars, the current stage, important labels, and CTAs. At most one large-area red block per page; other red appears only as point-like echoes.
 - May be replaced by the brand primary color, but the "single high-saturation accent + grayscale system" must be kept, and white-text/black-text contrast must hold.
 Auxiliary pink-red:
 - **#FED8D8 / #FFC5C4 / #FFDFE0 / #FFF1F1 / #F1CCCC**: heat-map gradients, weak emphasis backgrounds, area-chart fills, and the light level of red cards. Must not be used for small-size primary body text — avoid low contrast.
 Auxiliary gray and separation:
 - **#BDBDBD / #C1C1C1 / #D9D6D6 / #DDDBDB / #E7E6E6**: axes, gridlines, card boundaries, ordinary bars, table lines, disabled or secondary states; must not compete with body text.
 Cover dark colors:
 - **#070302 / #120706 / #210E0D / #2F0505**: only for the cover or a very few dark-atmosphere section pages' backgrounds and dark-red watermarks. Content pages do not use large dark bases.
 A single page uses only one hue of red + grayscale. Chart series stay mainly red, pink, and gray; avoid introducing multi-color business charts in blue/green/purple, unless source-data states must be distinguished and stay low-saturation.
 ## 6. Fonts and Text Hierarchy
 A modern sans-serif business font. Body text mainly uses Liter (Chinese: MiSans); the cover's oversized title uses Archivo Black (an Arial Black-class ultra-heavy sans, brought in via customFonts). Overall clean, compact, rational — no handwriting fonts, decorative serif fonts, or cartoon fonts.
 Relative hierarchy:
 - Cover main title: about 5–6x body size, ultra-bold, white, tight line spacing.
 - Content-page main title: about 2.5–3x body size, regular or medium-weight, black, at upper left or top.
 - Large-type opinion/definition: about 3–4x body size, may span multiple lines, keywords in red.
 - Subheading/card title: about 1–1.2x body size, often bold or a deeper black.
 - Body captions: body=1x, short lines, low decoration.
 - Table text/chart labels: about 0.75–0.9x body size.
 - Footnotes, sources, header small text, page numbers: about 0.55–0.7x body size, gray or black-gray.
 - Number metrics: about 2–4x body size; units and explanations drop to body or note level.
 Text is mainly left-aligned; large centered passages are not part of the system; the cover may locally use a left-aligned oversized title. Avoid overlong paragraphs and avoid multi-level bullets inside cards. Use one consistent capitalization style within the same page.
 ## 7. Chart Language
 The charts actually appearing are mainly donut/pie charts, bar charts, combination bar-line charts, area/trend charts, heat matrices, small gauges, and metric cards — serving consulting analysis, not chasing complex visualization.
 Donut/pie charts: use red, deep red, gray, and black-gray sectors, with a short label or core value in the center; short outer annotations, low-presence legend. The red sector marks the key cost item or key object.
 Bar charts: red bars mark key points, current values, targets, or high values; gray bars are comparisons. Axes are minimal, gridlines pale gray, bar spacing clear; a short value or label may sit atop bars — avoid dense annotation. Lines in combination charts use thin strokes and small nodes as trend or target references.
 Heat matrices: light pink to red expresses intensity; axis text stays simple; grid boundaries are softened. Too many dark blocks defeat priority judgment. A legend or note explaining color intensity is required.
 Metric cards/mini charts: embedded in red cards, gray cards, or white containers. Large numbers stand out, with a short caption explaining why they changed. Mini bar and donut charts are only supplements — they must not become the page's second main focal point.
 Legends and annotations: legends stay small and close to the chart, colors matching the series. Key points may use red capsules, small dots, arrows, or short labels, but no complex callouts. Forecast, target, or baseline lines use pale gray lines or thin red lines with a short note.
 ## 8. Tables and High-Density Information
 Tables are used to "prove, compare, break down, and prioritize"; they usually sit in the lower-middle of the body or on the right, paired with a title and a conclusion sentence.
 Headers: light gray base, or white base with thin rules; text bolded or darkened. Key columns may use a red header or a red top bar, but the whole table must not go high-saturation.
 Rows and columns: even row heights, phrased as short sentences. Keep column counts low — prioritize name, metric, impact, action, and status fields. Long explanations should be broken out into cards or footnotes; avoid multi-line crowding inside cells.
 Separators and base colors: use thin light gray lines such as #E7E6E6, #DDDBDB; light gray blocks may group content; zebra striping is not a strong system — if used, keep it very subtle. Key rows/columns may use a light red base or a red bar mark.
 Alignment: text left-aligned, numbers right-aligned or visually aligned on decimals/units. Percentages, amounts, and change values keep consistent units. Status uses red dots, black dots, light gray labels, or short badges — no complex icon sets.
 Summary and key points: summary rows use darker text, a light gray base, or a thin red line. Do not mark levels with multiple colors at once; prefer the red/pink/gray three levels to express high/medium/low or key/ordinary/weak.
 ## 9. Components and Graphic Elements
 Title component: a large black title at upper left + a caption below or beside it — no heavy title bars. The cover title is a special oversized white-text exception.
 Red key card: for the current stage, key conclusions, core metrics, recommended actions, or CTAs; may be white text on red or black text on a red-to-lighter base. Keep only one main red card per page; other red elements downgrade to labels or chart points.
 Light gray/white cards: for parallel information, stage explanations, metric notes, and comparison content. Light boundaries, restrained rounding, no shadow dependence; uniform spacing and alignment form the grid.
 Capsule labels: three kinds — black, red, light gray. Black marks categories or main path nodes, red marks key nodes, light gray marks ordinary nodes. Label text is short, holds no long sentences, and does not wrap into multi-line capsules.
 Numbering component: use 01/02/03/04 or large numerals. White-on-red marks the current or primary stage; black-on-gray marks the rest. Numbers must be bound to card titles — never isolated decoration.
 Separators and axis lines: thin light gray lines organize charts, tables, and modules; they must not thicken or turn into decorative borders.
 Badges/buttons: the cover and CTAs may use red button-style labels; content pages may use small red/black labels. Buttons carry no real interactivity — no heavy shadows or highlights.
 Icons: colorful icons are not core to the system. If used, they can only be extremely small single-color functional marks — dots, arrows, plus signs, location points — for guidance or annotation; sets of colorful illustrated icons are forbidden.
 ## 10. Texture and Prohibited Items
 Overall flat, restrained, and consulting-report-like, building visual appeal through strong alignment, whitespace, a red focal point, and data structure.
 Prohibited:
 - Large-area photo backgrounds, large people images, or scene photography as the main visual of content pages.
 - emoji, cartoon illustrations, 3D graphics, glow, glossy glass textures, complex textures.
 - Colorful icon sets, mixing multiple brand colors like blue/green/purple, rainbow-style charts.
 - Heavy drop shadows, strong gradient backgrounds, complex borders, decorative curves and flourishes.
 - Large centered copy, hierarchy-free long paragraphs, full-page bullet lists.
 Use with caution:
 - Gradients: only for red-to-light-red card bases, heat maps, or area charts — not for full-page flare backgrounds.
 - Shadows: if cards must be distinguished, use an extremely subtle shadow or simply a light gray base instead; do not form a floating-card style.
 - Rounded corners: may be used on capsule labels and buttons; cards should have only slight corner rounding; must not turn into internet-UI style.
 - Icons/arrows: only for flow direction, key-point annotation, or status dots — few in number, single-color.
 Usable on special pages: the cover may use a dark background, dark-red watermark, oversized title, and button-style red labels; the closing page may use a larger CTA message with contact details. Section divider pages may sparingly adopt the cover's dark atmosphere or large-type-on-white, but cannot replace the content-page system.
 ## 11. Generation Checklist
 - Skeleton: is it a 16:9 horizontal business page; are the title area, body area, and caption/footnote area clear; does content keep off the edges?
 - Copy: does each page have only one main point; is the title short and specific; are captions controlled to 1–2 lines; is card text phrased as short sentences?
 - Hierarchy: do title, key message, body, chart labels, and footnotes show a clear relative size difference; is hierarchy-free text stacking avoided?
 - Color: does it keep white/light-gray background + black-gray text + a single red accent; does red only correspond to key points; are multi-color charts avoided?
 - Layout: was a suitable scheme chosen among large-type opinion, chart analysis, roadmap, heat matrix, label flow, metric case, or simple table; is unrelated information kept from being forced onto the same page?
 - Charts: does red mark only key series; are axes and gridlines softened; are labels readable; is the legend simple and near the chart?
 - Tables: are headers, separators, key rows/columns, and number alignment consistent; are long cell paragraphs and overly dense line frames avoided?
 - Components: do red key cards, light gray cards, capsule labels, numbering, and separators have clear functions; are no components added merely for decoration?
 - Prohibited items: are photo backgrounds, emoji, 3D, glow, heavy shadows, complex textures, colorful icons, and rainbow palettes absent?
 - Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, chart occlusion, empty cards, wrong proportions, excessive template sameness, or too many red focal points.
@@ -0,0 +1,163 @@
 # Organization Name · 2025.08 The GenAI Transformation of the Communications Function STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 For consulting-firm data packs, functional transformation assessments, AI/technology impact quantification, methodology explanations, and executive-level reporting. Aimed at business owners, communications/function leaders, and consulting project teams; each page must deliver its conclusion fast, while chart definitions and measurement bases, methodological assumptions, and sources remain traceable.
 Summary in one line: **a dark consulting data-pack style, where deep gray canvas and deep green tech atmosphere carry dense analysis, and teal-green data encoding highlights GenAI transformation opportunities and methodology levels.**
 Stable features: deep gray/deep green full base colors, the QuattrocentoSans font system, conclusion-style titles at upper left, large body charts/matrices, short-paragraph interpretation on the right, a tiny source/copyright line at the bottom, thin-line frames, fluorescent-green/teal-green accents, and the AI-portrait visuals on the cover/closing pages.
 - **Conclusion first, evidence as the body**: the title states the judgment directly; charts, tables, matrices, or flows do the persuading; decoration must not replace evidence.
 - **Dark and unified, green layered**: deep gray and deep green define the whole deck; bright green only marks key data, labels, chart series, and states — no meaningless color filling.
 - **High density but scannable**: use columns, dividers, headers, labels, footnotes, and alignment to build the reading path; avoid hierarchy-free text stacking.
 ## 2. Page Skeleton
 - **Canvas ratio**: widescreen landscape 16:9. All pages reserve bottom space for footnotes, copyright, and the page number.
 - **Default background**: content pages sit on deep gray #2C2C2C, overlaid with deep green #0A3021–#0D4430 zones or a green glow at upper right/right side; section divider and disclaimer pages may use near-pure deep gray.
 - **Margins**: narrow safe margins; labels and titles at top, sources and page number at bottom, the body filling the middle.
 - **Title area**: a small tab/hierarchy label at upper left, followed by the main title and one line of subtitle or key message. Left-aligned, spanning about half to full width at the top of the page; never centered.
 - **Body area**: content pages are mainly chart/table on the left or center + interpretation on the right; methodology pages use horizontal flows or matrices; concept pages use multi-column/node relationships. Tight spacing between title area and body.
 - **Header/navigation**: a small green label at upper left, such as Function Level, Task Level, Methodology; it only signals the section and analysis level — no large navigation bar.
 - **Footer**: fixed at the bottom with sources, assumption notes, and copyright in a size clearly smaller than body text; the page number at lower right. Footnotes may run horizontally across pages or gather below charts.
 - **Logo**: the brand mark mainly appears on the cover and closing page; content pages do not enlarge the Logo.
 - **Dividers**: thin lines, table lines, axis lines, rectangular outlines; colors in deep gray, gray-green, or low-saturation green — organizational function only.
 - **Background graphics**: covers and end pages may use AI portraits/generative visuals; content pages use only abstract green glows or gradients — no large people images.
 - **Page-type skeletons**:
  - Cover: deep gray brand and title blocks on the left, AI portrait with deep green light effects on the right; the title sits inside a thin-line frame or half-frame area.
  - Content data page: title at upper left, large central chart, interpretation on the right, sources at the bottom.
  - Methodology section divider: near-pure deep gray, large title at lower left/center-left, a few small squares as visual anchors.
  - Methodology content page: label + title at top, flow, matrix, or step cards below, supplementary measurement-basis notes at the bottom.
  - Disclaimer page: large title on the left, dense legal text on the right, deep gray background.
  - Closing page: brand mark combined with the AI portrait/green light effects, minimal information.
 - **Default reading path**: upper-left label → main title/subtitle → main chart or matrix core data → right-side interpretation → bottom sources/measurement-basis notes → page number.
 ## 3. Content Organization
 - **Title style**: use consulting-style conclusion sentences that directly state rankings, impact, opportunity, method scope, or comparative judgments; avoid vague titles like "Overview" or "Background". May include percentages, rankings, subjects, and results.
 - **Subtitle/key message**: below the main title, a smaller line states the quantification scope, stage, metric definition or basis, or "why it matters"; color in light green or light gray.
 - **Body structure**: short paragraphs, short sentences, and bullets; right-side interpretation is generally 2–4 paragraphs, each supporting one finding. Do not use large blocks of centered narrative.
 - **Grouping logic**: group by function, task category, impact type, AI type, automation stage, method step, cost pool, or workflow; titles prefer short noun phrases.
 - **Number of points per page**: 1 main point per page, paired with 2–4 sub-findings; high-density table pages may add more entries, but one title conclusion must lead them all.
 - **Body density**: more labels, footnotes, and data are allowed, layered by column widths, headers, row groups, and color blocks. When text exceeds 4–5 short paragraphs, split the page or switch to a table/matrix.
 - **Bullet style**: use short bullets, short dashes, semicolons, or line breaks; start with verbs or noun phrases; avoid complete long paragraphs.
 - **Keyword emphasis**: use bright green, teal-green, bold, or local highlights on dark bases for percentages, rankings, target objects, and stage names; no underlines, glowing outlines, or multi-color emphasis.
 - **Numbers/units/time frames**: highlight percentages, ranges, approximations, rankings, and stage differences. Numbers and units stay adjacent; annotate directly inside charts wherever possible rather than relying on legends.
 - **Source footnotes**: the bottom must keep sources, estimation assumptions, sample scope, copyright, etc.; multiple sources are compressed horizontally with semicolons or short phrases.
 ## 4. Content Page Layout System
 ### A. Left chart + right interpretation
 For quantitative conclusions such as rankings, cross-sectional comparisons, cost impact, productivity gains, and function benchmarking. The left or center 60–70% holds horizontal bar charts, stacked bars, or range bars; the right 20–30% holds explanatory text; the top carries the conclusion title and measurement basis, the bottom the sources. Target objects use bright green/teal-green, other objects gray-white or deep green; thin vertical lines may mark averages, targets, or stage boundaries. Not suited for scenes with too many dimensions whose labels cannot stay readable, nor for narrative pages needing long explanations.
 ### B. Full-width high-density table/matrix
 For task lists, workflows, AI-type comparisons, automation potential, cost pools, and method inputs/outputs. The body nearly fills the width; column headers on a deep green or teal-green base, row groups on a deep gray sidebar or color band. Text columns left-aligned, number columns right-aligned or centered, status columns with dots/checks-crosses/color blocks; emphasis via teal-green bases, bright green numbers, red/green status dots, or bold rows. Do not use this with less data than 3×3 — it would look empty; if the comparison is complex but numeric-light, switch to cards or a flow.
 ### C. Stacked-bar / waterfall-style decomposition
 For decomposing the total opportunity. Categories listed on the left, horizontal stacked bars on the right showing stages, types, or potential ranges, with a small swatch legend at the bottom explaining the series. Key row labels or bars use highlight green; non-key parts stay low-saturation. Do not use too many series colors — avoid turning the dark page into colored noise.
 ### D. Methodology flow
 For diagnostic models, assessment steps, quantification logic, and input-to-output paths. Use 4–5 horizontal step cards or nodes connected by arrows/lines; each step contains a short title, an icon-like circle or small card, and 2–3 explanatory points. Use green titles, circular nodes, thin-line arrows, and stage labels to express hierarchy. Not suited for carrying large amounts of precise numbers.
 ### E. Multi-column concept/comparison
 For impact types, Traditional AI/GenAI/Agentic AI differences, evaluation dimensions, or capability classifications. Use 3–4 columns, one concept per column, with short sentences, status marks, or small matrices inside; column titles use green bars, white cards, or circular color blocks. Suited for medium information density, not for complex financial modeling.
 ### F. Section divider / separator page
 For structural transitions such as Methodology and Disclaimer. Use an empty deep gray field, the large title left-aligned or positioned lower-left, keeping only minimal decorative squares/lines. Do not add charts, card groups, or explanatory paragraphs — that would break the section divider's rhythm.
 ## 5. Color System
 - **Primary background deep gray #2C2C2C**: the base color of content pages, section dividers, and disclaimer pages; cannot be replaced by a light background — the style would be falsified.
 - **Deep green background #0A3021 / #0B3928 / #0D4430**: for gradient zones on content pages, chart base plates, and the right-side atmosphere of cover/closing pages. May be used at large area with low saturation; may be fine-tuned within the same family — do not switch to blue-purple or orange-red.
 - **Mid green #125E42 / #176F4E / #197352**: for primary chart series, title labels, module bases, and grouping bars. Replaceable with a similar brand green, but sufficient contrast with the deep green background must hold.
 - **Bright teal-green #1A835B / #35AA7E / #74D1A9**: for key data, target objects, emphasized bars, status dots, legend highlights, and a few accent texts. Small-to-medium area — avoid filling entire pages; not for ordinary body text.
 - **White/near-white #F2F4F2**: for main titles, body text, table text, and chart labels. Do not replace all body text with plain gray — readability would drop.
 - **Light gray #B8B9B9 / #D7D7D7**: for secondary labels, non-key bars, axis labels, and footnotes.
 - **Dark gray-green #35594C / #5B7067 / #61746C**: for gridlines, table separation, weakened modules, and boundary lines — structural color only.
 - **Status red/pink, around #C83A5A**: only in matrices marking low capability, limitations, risks, or negative states, at very small area. Prohibited as a primary decorative color.
 - **Chart series boundary**: a single page stays in the green family with gray/white as reference; status red only as an exception. Do not introduce multiple blue/yellow/purple data series at once; if more series are unavoidable, prefer a brightness ladder of the same green.
 ## 6. Fonts and Text Hierarchy
 - **Font character**: the whole deck uses QuattrocentoSans, with QuattrocentoSans-Bold and Italic building hierarchy. Do not mix in serif or handwriting fonts.
 - **Hierarchy ratios**: body = 1x; main title about 1.7–2.4x; cover title about 2.5–3.2x; section divider large title about 3–4x; subtitle/key message about 1.2–1.5x; chart axis labels and table body about 0.8–1x; footnotes, copyright, page numbers about 0.45–0.65x.
 - **Titles**: left-aligned, tight line spacing, may be partially bolded or wrapped; no more than three lines.
 - **Key message/subtitle**: below the title, stating the measurement basis in light green or light gray — do not repeat the title.
 - **Body text**: mainly regular weight; key phrases may be bolded or bright-greened; short paragraphs, moderate line width, right-side interpretation left-aligned.
 - **Subheadings/labels**: smaller size, on green bases or in green text; keep the text short.
 - **Table text**: column headers may be bold, body regular; text columns left-aligned, number/percentage columns centered or right-aligned. No frequent italics inside tables.
 - **Chart labels**: axis labels and data labels smaller than body text but must stay clear; key data may enlarge close to body size with bright green emphasis.
 - **Notes/footnotes/page numbers**: extremely small level, at the bottom or in the right-edge vertical page-number area; must be legible and never mixed into the body.
 ## 7. Chart Language
 Charts are mainly horizontal bar charts, stacked bars, matrix comparisons, and a few flow/node diagrams — no complex multi-chart system.
 - **Bar charts**: dark base, horizontal layout; category labels on the left, bars and values on the right. Use a green ladder or light gray references, key bars in bright teal-green; axis lines and gridlines thin and low-contrast.
 - **Range/stage expression**: within the same row, parallel bars or range bars may express current vs. future stages, deploy vs. reinvent. Distinguish with different green brightness steps or gray-green bases, and annotate directly in the legend or on the bars.
 - **Stacked bars**: for task composition or workflow decomposition. Segments come from the same green sequence; labels are embedded or kept close to the bars, with a simple legend at the bottom.
 - **Matrix charts**: clear row/column headings, column headers may use green bars; cells use dots, checks/crosses, or short text phrases for states. Positive in green, negative/limited in red, ordinary reference in gray-white.
 - **Flow/node diagrams**: circular nodes, white cards, and thin-line arrows; nodes may hold simplified icons or initial-letter visuals, but they must serve the step's meaning.
 - **Legends**: above, below, or at the bottom of the chart, never at the visual center; swatches small and tidy, text short.
 - **Annotations**: use the right-side interpretation text instead of complex bubble callouts; inside the chart keep only necessary numbers, baselines, and stage notes. Floods of floating notes covering bars are prohibited.
 - **Chart boundaries**: no 3D charts, pie charts, donut charts, perspective charts, or decorative curve charts; there is no evidence supporting complex animated charts or illustrated charts.
 ## 8. Tables and High-Density Information
 - **Table role**: carrying methods, tasks, types, ratings, and multi-dimensional comparisons — the core evidence carrier.
 - **Headers**: deep green or mid-green base, white/near-white text, short column names; multi-level headers may use different green steps or thin-line zoning.
 - **Row/column structure**: row labels left-aligned, metric/status columns centered, value columns right-aligned or centered. Complex task descriptions get wider columns; ratings/potential get narrow columns.
 - **Row height and density**: compact row heights but keep separation; compress long text into short phrases — no full paragraphs in cells.
 - **Separators**: thin gray lines, gray-green lines, or dark boundaries to separate row groups, column groups, and headers — no heavy outer frames.
 - **Base colors**: deep gray as the base; group rows or key columns may use deep green/teal-green bases; large light bases are generally avoided to protect the dark system.
 - **Key rows/columns**: target rows, summary columns, and key percentages may use bright green, bold, base-color blocks, or borders; pick only 1–2 focal points — never highlight the whole table.
 - **Zebra striping**: extremely subtle deep gray/deep green alternation is allowed, never obviously showy; omit it when thin-line separation already exists.
 - **Symbol marks**: dots, checks/crosses, red-green status dots, and rating color blocks may express capability/risk/automation level; a legend is required or the meaning must be inferable from context.
 - **Summary/footnotes**: notes, sources, and assumptions may sit at the bottom of the table; summary rows or result columns must stand out from ordinary rows.
 ## 9. Components and Graphic Elements
 - **Upper-left tab**: a small green rectangle or text label showing Function Level, Task Level, Methodology, etc. Width follows the text — no long banner.
 - **Title frame / cover thin-line frame**: cover titles sit inside a green/gray-green thin-line frame or half-frame; content pages rarely use large title frames.
 - **Right-side interpretation column**: beside the chart, containing short paragraphs, keyword highlights, and a few numbers; it explains "so what" and does not repeat all the data.
 - **Cards/step blocks**: methodology pages use dark cards, small white cards, or green title bars holding step names and bullets; boundaries clear, rounding very restrained if any.
 - **Circular nodes**: for impact types or method steps, colored green, yellow-green, blue-green, or small red nodes. Few in number — not a flood of decorative bubbles.
 - **Separators and outlines**: for chart axes, table boundaries, and module zoning; thin, low-contrast, function-first.
 - **Legend swatches**: small rectangles/dots + short labels explaining stages, states, series; kept close to the chart's bottom or top.
 - **Page number/copyright vertical sidebar**: page number at lower right or along the right edge, copyright/sources along the bottom.
 - **Image frames**: carry the AI portrait only on the cover and closing pages; if an image appears on content pages, it must keep a deep green overlay — no screenshot collages.
 - **Icons**: methodology pages may use a few linear/simplified icons or circular icons. Colorful skeuomorphic icon libraries are prohibited; icons must relate directly to steps/states.
 ## 10. Texture and Prohibited Items
 The overall texture is **dark, flat, restrained, data-dense, tech-consulting**; visual focus comes from the green glow, data highlights, and structured information.
 - **Prohibited**: large light backgrounds, rainbow palettes, 3D charts, glowing outlined text, complex textures, emoji, cartoon illustrations, social-media-style stickers, meaningless large icons, long centered copy, decorative wave lines, over-rounded cards, strong-shadow floating layers.
 - **Use with caution**: gradients, shadows, circular nodes, icons, red states. Gradients only for deep green background atmosphere; shadows, if any, extremely weak; red only for negative/limitation states; icons only for methodology steps.
 - **Usable on special pages**: AI portraits/generative images only on the cover and closing page, as the theme visual; section dividers may use minimal geometric squares; the disclaimer page may use dense legal text.
 - **Image dependency boundary**: content pages do not rely on photos, screenshots, or illustrations to tell the story unless the image itself is data evidence; otherwise convert to charts, tables, or flows.
 - **Brand feel boundary**: the brand mark should not be enlarged and repeated on every page; the brand feel comes from the dark base, the green system, typography, and the footnote structure.
 - **Density control**: never sacrifice alignment, contrast, and footnote readability. If text overlaps, tables squeeze, or chart labels become illegible, cut content first rather than shrinking it into unreadability.
 ## 11. Generation Checklist
 - Is it a 16:9 dark consulting report page, not a poster, infographic, or social card?
 - Is there a clear label/title area at upper left, and is the title a conclusion sentence rather than a vague topic word?
 - Does the single page hold only 1 main point, proven by a chart, table, matrix, or flow?
 - Is the background mainly deep gray and deep green, with bright green used only for key data/labels?
 - Is the body organized as one of: left chart + right interpretation, full-width matrix, flow steps, or multi-column comparison?
 - Is the right-side interpretation short paragraphs with keyword highlights, not long-form body text?
 - Do charts use horizontal bars, stacked bars, matrices, or flow nodes; are 3D, pie charts, and showy series colors avoided?
 - Do tables have clear headers, grouping, alignment, thin separators, and key rows/columns?
 - Does the footer keep sources, assumptions, copyright, and page number without overlapping the body?
 - Does the type keep the QuattrocentoSans character, with hierarchy expressed through relative size, weight, and color?
 - Is photo/screenshot/illustration abuse avoided, with the AI portrait only on the cover or closing page?
 - Are there any occurrences of overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, or mechanical template repetition?
 - If the brand color is replaced, do the dark base, high-contrast white text, and single-primary-hue principles still hold?
@@ -0,0 +1,125 @@
 # Cartographic Strategy · Map Strategy STYLE DESIGN SYSTEM
 > Intended homepage tag: Strategic Planning / Strategy
 > Visual metaphor: contemporary atlas + strategy room
 ## 1. Style Positioning
 For internationalization, regional expansion, business portfolios, ecosystem layout, resource allocation, and long-term roadmaps. It is not a traditional consulting blue-and-white template, but a map-style narrative that "puts strategy into space": warm white paper, deep navy, restrained cobalt blue, and vermilion coordinates, building a sense of direction through routes, regions, scales, numbering, and legends.
 Underlying principles:
 1. Every page first answers one decision question, then shows location, path, or priority evidence.
 2. Map language serves comparison and sequence — contour lines and lat-long grids are not decorative wallpaper.
 3. One main map leads the page; captions, numbers, and labels are organized around it.
 4. When geographic information is insufficient, use abstract location diagrams, route maps, or composite maps — never fabricate precise boundaries.
 5. Titles read like judgments management would actually say — avoid vague slogans like "strategic blueprint" or "marching into the future together".
 ## 2. Page Skeleton
 The canvas is 16:9 landscape. Content pages are mainly warm white; section divider pages may use deep navy. Outer margins stay stable; tiny coordinate ticks may appear at the four corners, but content never touches the edges.
 The top is the title and page-number coordinate zone, about 14%–18% of the page; the middle is the main-map workspace, 65%–72%; the bottom reserves space for sources, assumptions, and the legend. No full-width thick rule under the title — position with short ticks, the page number, and thin lines instead.
 The cover uses "large title + abstract regional map + one main route". The title sits on the left or lower left; the map takes 45%–60% on the right. Content pages switch among maps, matrices, routes, and timelines, but always keep the same coordinate and legend grammar.
 ## 3. Content Organization
 Titles use conclusion sentences or explicit questions, e.g., "The Middle East offers the fastest first-entry validation window". The subtitle adds scope, years, evaluation dimensions, or data definitions and measurement basis.
 A single page carries only one strategic judgment, with at most 3 supporting pieces of evidence. Body text uses short sentences, numbering, and direct labels — no long explanatory passages.
 Spatial grouping prioritizes regions, markets, stages, entry modes, capability nodes, and risk levels. Every route must have an origin, a destination, a sequence, and a meaning; every color must be explained in the legend.
 Numbers sit immediately beside their objects, with units, time, and measurement basis. Sources and assumptions go in the footer, not hidden at the visual center.
 ## 4. Content Page Layout System
 ### A. Strategic map page
 The left 25%–32% holds the conclusion and 2–3 key explanations; the right holds an abstract regional map. Dots mark markets or capability nodes, line width expresses priority, solid/dashed lines distinguish what is in place from what must be built. Suited for market selection, network layout, and resource migration.
 ### B. Three-market comparison band
 The page divides horizontally into three parallel zones, each containing a market name, one main number, a small location map, and 2–3 evaluation dimensions. The three columns must be isomorphic; the recommended option may be emphasized with a cobalt edge line or vermilion coordinate point.
 ### C. Opportunity–difficulty matrix
 The matrix takes 60%–70% of the page, with the recommendation conclusion on the right. Point labels name the markets directly without depending on a complex legend. Quadrant names are actionable judgments such as "enter first", "build partnerships", "keep watching" — not abstract star/cash-cow clichés.
 ### D. Route and stage page
 One main route from lower left to upper right connects 3–5 stages. Each stage carries its timing, key actions, thresholds, and exit conditions. The route may turn corners; equal-width stacked process cards are not used.
 ### E. Capability network page
 A central capability anchors the page, connecting channel, delivery, compliance, product, and talent nodes. Connecting lines express dependencies; node size expresses priority. Show only the 5–8 nodes that genuinely affect implementation.
 ### F. Decision page
 One large conclusion on the left; on the right, a three-part list of "decide now / conditions to enter / 90-day actions". A scaled-down route map may review the whole journey — this is not an ordinary Thank You page.
 ## 5. Color System
 - Warm paper white #F4F0E8: primary content background.
 - Deep navy #0B1F33: titles, section bases, the main route, and core text.
 - Cobalt blue #2F5BFF: recommended options, key paths, and key numbers.
 - Vermilion #E4572E: risks, key coordinates, and must-decide nodes; its area stays strictly smaller than cobalt.
 - Mist cyan #9BD5D8: secondary regions, historical stages, and de-emphasized data.
 - Graphite gray #5B6570: captions, axes, sources, and unselected options.
 Regular pages use paper white + navy + cobalt; vermilion appears only once. Rainbow maps, fluorescent gradients, and large red-green oppositions are prohibited.
 ## 6. Fonts and Text Hierarchy
 Chinese uses MiSans; English uses Liter; page titles and conclusion emphasis use a serif ({latin: Unna, ea: 思源宋体}) as the atlas-style display face, with body and secondary information in sans; never mix more than two font families.
 - Cover title: 4–5x body size, bold, at most two lines.
 - Page title: 2–2.6x body size, left-aligned.
 - Key numbers: 2.5–3.5x body size, set in bold sans-serif.
 - Body text: 1x, short sentences.
 - Coordinates, legends, sources: 0.55–0.75x, kept readable.
 Numbers, years, and region codes may use JetBrains Mono (brought in via customFonts). No all-caps long sentences, italic long passages, or multi-layer shadows.
 ## 7. Chart Language
 Prefer dot plots, bubble charts, slope charts, path charts, two-dimensional matrices, regional small-multiple maps, and bar charts with direct annotations.
 Chart backgrounds stay transparent or paper white; gridlines use extremely fine mist gray. Key series use cobalt; history/baselines use mist cyan or gray; risk thresholds use a single vermilion line.
 Maps must carry a legend, a direction or scale cue. Abstract maps must be clearly marked as "schematic" — false administrative precision is not allowed. Key differences are annotated directly beside points, reducing standalone legends.
 ## 8. Tables and High-Density Information
 Tables serve market scoring, entry conditions, and risk lists. Headers use deep navy text or a light mist-cyan base; thin lines between rows, no heavy borders.
 Recommended rows are emphasized with a cobalt coordinate bar on the left; risk cells use small vermilion dots or text labels — never flood the whole cell red. Numbers right-aligned, text left-aligned, scoring criteria and basis noted at the table bottom.
 High-density content is preferably split into "map/matrix + right-side explanation" — do not crush it into a ten-column-wide table.
 ## 9. Components and Graphic Elements
 Stable components include coordinate points, routes, region outlines, short ticks, page-number codes, legends, scale-style separators, and thin-line annotations.
 Nodes use solid circles or concentric circles; lines divide into three types — main path, alternative path, and dependency line. Arrows appear only when direction matters.
 Photos are not a default element. If a city or scene photo is used, allow only one large image with desaturated treatment — no stock-photo collages.
 ## 10. Texture and Prohibited Items
 Overall like a contemporary strategy atlas: precise, quiet, clearly directed. The paper base may carry an extremely light texture; dark pages stay pure; no glassmorphism.
 Prohibited: default consulting blue card walls, random world-map watermarks, fake national borders, 3D globes, glowing routes, rainbow heat maps, rounded UI panels, emoji, decorative compasses, and full-page maps with no conclusion.
 ## 11. Generation Checklist
 - Can every page state in one sentence what decision it asks for?
 - Do the map, matrix, or route genuinely carry comparative relationships?
 - Do all colors, line styles, and node sizes have explicit meanings?
 - Are regions and paths clearly labeled, with no fabricated precise geographic information?
 - Is the recommended option clearly highlighted while alternatives remain visible?
 - Does the page keep the stable grammar of paper white, navy, cobalt, and vermilion?
 - Are the title, legend, sources, units, and assumptions complete?
 - Are card walls, 3D globes, random decorative lines, and template-like slogans avoided?
 - Have you checked for overlap, cropping, garbled characters, low contrast, and text wrapping?
@@ -0,0 +1,176 @@
 # Project Report Name — Organization Name Syndication Memo STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A private equity / investment banking memo-type, high-density report style, suitable for syndication memos, investment committee materials, due diligence summaries, deal approvals, financing packages, and management business plan materials. Aimed at finance and industry analysis readers, it supports rapid review of deal terms, investment logic, customer and market evidence, financial projections, valuation, risks, and execution plans; the goal is "reviewable, open to follow-up questioning, and traceable."
 Fixed style: a 16:9 landscape, high-utilization canvas; a light cream-white background; a thin orange vertical line on the left; gray / dark navy segmented section navigation at the top; a small brand wordmark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo); a large orange title; and a gray information sentence under the title. The body uses tables, bar charts, bridge charts, side-by-side modules, rating dots, process boxes, and textual evidence blocks. Fonts are absolutely dominated by the Arial family; bold is used for titles, table headers, field names, and key numbers; italics are used only for notes or special emphasis.
 Underlying principles:
 1. Information completeness comes first, but it must be structured into tables, columns, numbering, colored-block headings, footnotes, and thin divider systems; long passages of text must not float freely.
 2. Orange is used only for page titles, the current section, key data, key bars, the left vertical line, and a small number of labels; it is not used as a large-area decorative fill and does not sacrifice body readability.
 3. The body area may vary; the navigation, title area, identity mark, left boundary, and footnotes / page numbers remain stable. Chart aesthetics must be subordinate to data clarity, comparability, and traceability.
 ## 2. Page Skeleton
 The canvas is 16:9 landscape widescreen with narrow page margins, and the body area occupies the vast majority. The default background is a light cream-white / near-white, approximately `#FCF8F5`, `#FEFBF7`, `#F4F0EC`; a very faint brand geometric watermark or light gray graphic is allowed, but at low opacity so it does not affect the reading of figures.
 The cover uses a full-bleed deep blue city night-scene photograph overlaid with semi-transparent deep blue brand geometry. The title group sits in the right-middle area: the main title in white bold, the subtitle in white regular, and the date placed inside a small orange label; vertical confidentiality / time / email information is placed on the left, and the orange brand wordmark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo). The cover does not use the content-page top navigation.
 Section dividers use the light cream-white background, a left orange line, an identity mark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo), and generous whitespace. The section number is a large orange numeral, and the section title is large dark navy type; they only switch sections and do not carry complex argumentation. Examples include "Industry and Company Overview", "Business Plan", "Valuation and Exit", and "Financing, Diligence & Key IC Findings".
 Standard content-page skeleton:
 - Top navigation: a horizontal segmented arrow / band at the very top of the page; the current section has a dark navy background with white text, the other sections a light gray background or low-contrast gray text. Its height is very low and it serves only for orientation.
 - Upper-right identity mark: a small orange brand wordmark (plain small text presenting the new topic name; do not draw a graphic logo), fixed at the top right with clear space reserved around it, not overlapping chart titles or navigation.
 - Left orange line: most content pages keep a thin orange vertical line from top to bottom; content begins to its right.
 - Title area: left-aligned below the navigation; the main title is usually orange bold, followed by a single gray / dark gray information sentence.
 - Body area: immediately below the title, carrying tables, charts, modules, processes, side-by-side evidence, or long text, with a narrow footnote band reserved at the bottom.
 - Footer: sources, notes, confidentiality wording, and page numbers at the bottom. Footnotes are significantly smaller than body text and light gray; the page number is usually at the lower right or bottom edge.
 Reading path: top navigation → orange title → information sentence → body area left to right, top to bottom → bottom footnotes.
 ## 3. Content Organization
 Titles use judgment-type or topic-type phrases, such as "Deal Summary", "Executive Summary", "Why We Like Organization Name", "Customer Overview", "Business Plan: M&A"; strong conclusions may be stated directly, e.g., "Strong game release pipeline driving game development spend" — no marketing slogans.
 The information sentence under the title is usually one line, used to state the conclusion, the data basis, or the significance of the page; it is lighter in color than body text and professionally restrained in tone, with no exclamations, rhetoric, or large centered passages.
 Body rules:
 - Long text uses bold subheadings + body explanations + bullet / numbered points; every paragraph must have an explicit subheading or left-side label.
 - Summary pages may use a left vertical navigation card or numbered boxes with dense bullets on the right; each bullet gives a bold keyword first, then the explanation.
 - Group by professional dimensions such as deal terms, investment highlights, industry / customers, financials, valuation, risks, financing, and due diligence.
 - Compress a single page into 3–6 modules or 4–8 table rows; a page containing only one big statement is discouraged.
 - Use bold, orange numbers, dark blue table headers, light-filled boxes, or dots for emphasis; no fluorescent highlighting, hand-drawn circles, or exaggerated stickers.
 - Keep numbers, units, and time bases adjacent to the data, e.g., FY, CY, 24E, 25E, CAGR, EV, EBITDA, bps, %; table column headers explain the basis.
 - Source footnotes go at the bottom in small light-gray type; multiple bases are connected with superscripts or parentheses — do not pile long notes into the body.
 ## 4. Content Page Layout System
 ### A. Deal Summary / Term Sheet Type
 Used for deal overviews, capital structure, valuation, sources & uses, and key terms. The body is a large table: the left column holds dark or gray field names, the right side holds explanations and data; a small valuation table or sources & uses table with an orange header may be embedded in the middle. The reading order is field name → value → note. Suitable for multi-basis facts; not suitable for complex causality or multi-stage processes.
 ### B. Executive Summary / Multi-Conclusion Long-Text Type
 Used for investment highlights, key risks, and argument summaries. Vertical section cards / numbered modules sit on the left, dense bullets on the right; dark navy cards mark the major categories, orange cards mark the current or key item. Each bullet opens with a bold keyword. Suitable for scanning by professional readers; not suitable for non-professional audiences or talk-style presentations.
 ### C. Investment Rationale / Itemized Argument Type
 The typical page is "Why We Like Organization Name". The body organizes horizontal argument bands with circular A/B/C/D numbering or labels; each band contains a dark navy subtitle bar, an orange number, body bullets, and key figures. Suitable for 3–5 parallel reasons; not suitable for more than 6 items or content where each item requires complex charts.
 ### D. Horizontal Comparison Table / Peer Matrix Type
 Used to compare companies, customers, products, competitors, or peer metrics. The left column holds company names or category labels, the top holds the metrics, and the cells hold numbers, text, rating dots, or short labels. Headers may use light orange / dark blue; key rows and columns may use light blue or light orange fills. Suitable for horizontal comparison; not suitable for long qualitative explanation.
 ### E. Chart + Explanation Mixed Type
 Used for revenue trends, market size, growth rates, customer penetration, financial projections, bridge charts, and operating KPIs. The main chart occupies most of the width, with a conclusion bar / title above and an explanation box below or on the side. Orange highlights the core series, dark blue / teal is used for comparison series, and gray for background or historical items. Suitable for data argumentation; not suitable for conceptual diagrams without a clear data basis.
 ### F. Process / Business Plan Type
 Used for M&A pipelines, operational initiatives, and value creation plans. Built from horizontal process boxes, stage arrows, small tables, and a bottom chart; dark blue bars serve as stage titles, orange nodes mark key actions or key results, and light boxes carry explanations. Suitable for stages, paths, funnels, and execution levers; it should not be abused for ordinary lists.
 ### G. High-Density Side-by-Side Module Type
 Used for customer overviews, management / advisor viewpoints, risk mitigation, and due diligence findings. The page is divided into multiple same-size cards or horizontal modules, each containing a subtitle, short bullets, icon-style markers, or micro charts; module spacing is small, with thin lines and light fills for separation. Not suitable for a single large image or emotional storytelling.
 ## 5. Color System
 - Background colors: light cream-white / near-white `#FCF8F5`, `#FEFBF7`, `#F4F0EC`. Used for the large-area base of content pages; may be replaced with a warm white of the same lightness — do not switch to a high-saturation background.
 - Main text: dark gray `#4D4E53`, `#3E3E42`. Used for body text, table text, and note text; must maintain high contrast and must not be replaced with light gray.
 - Title / brand accent orange: `#C4794A`, `#D8752A`, `#F07A00`. Used for main titles, the left vertical line, date labels, current items, key numbers, important bars, and table headers; small-to-medium area. May be replaced with the brand primary color, but the warm-accent role must be retained.
 - Structural dark navy: `#12234E`, `#263660`, `#293B60`. Used for the current navigation section, dark sidebars, table headers, process stage bars, and cover overlays; usually paired with white text. May be replaced with a deep brand blue, but it must remain serious and high-contrast.
 - Auxiliary grays: `#BEB6B3`, `#D9D5D5`, `#E8E3E1`, `#C6C6C9`. Used for dividers, table borders, non-current navigation, fills, axes, and gridlines.
 - Auxiliary light blue / teal: `#5E9BB9`, `#9BA8AF`, `#C6CED6`. Used for secondary chart series, customer / competitor comparisons, key row blocks, or status areas; it must not compete with orange for the primary accent role.
 - Positive/negative / status colors: mainly orange, dark blue, teal, and gray, with a small amount of green for growth or positive figures. Green should be used cautiously for positive change; red is not part of the stable primary color system.
 Control the main hues of a single page to orange, dark blue, gray, and a small amount of teal-blue. Chart series should not expand into rainbow colors; status colors serve judgment only, not decoration.
 ## 6. Fonts and Text Hierarchy
 Fonts are dominated by Arial / Arial Bold. Helvetica Bold is used only for the cover or special confidentiality overlay text; Calibri, Segoe UI, and the like are not part of the main system. Prefer Arial or an equivalent sans-serif.
 - Cover main title: 3–4x body text, white bold.
 - Content-page main title: 2.5–3x body text, orange bold, left-aligned.
 - Section divider title: 3–4x body text, dark navy; the section number may be larger, in orange.
 - Information sentence / subtitle: 1–1.2x body text, gray regular or semi-bold, positioned under the title.
 - Body text: 1x, dark gray; line spacing is tight but must not overlap.
 - Subheadings / field names / table headers: 1–1.15x body text, bold; may be white text on a dark blue background or dark gray text on a light background.
 - Table and chart labels: 0.75–0.95x body text; compress when necessary but keep legible.
 - Notes, sources, page numbers: 0.55–0.7x body text, light gray.
 Text is predominantly left-aligned; table numbers are right-aligned or visually aligned by decimal point; column headers are centered or left-aligned according to data type. Large centered body passages are prohibited.
 ## 7. Chart Language
 Use stacked columns, grouped columns, horizontal bars, bridge charts, time-series column-line combinations, small rating / dot matrices, and mini charts inside matrix tables; charts are embedded in the body area of content pages rather than being full-screen single charts.
 Axis lines and gridlines use light gray; legends sit near the top of the chart or inline beside the title, using small color swatches + short labels. Data labels are placed directly at column or bar ends or inside table cells.
 Orange marks the core series, the current item, or key growth; dark blue marks baseline / historical / primary comparison; teal-blue marks the second comparison; gray marks background, other items, or non-key data. Forecast, target, and estimate years are expressed through E, FY, CY, dashed lines, light-shaded areas, or explicit labels and definitions in column headers — not through complex visual effects.
 Key data may use orange numbers, bold, annotation boxes, or dark labels. Do not use 3D charts, gradient columns, dimensional pie charts, heavy shadows, or decorative graphics without data labels. If a chart cannot express a comparison more clearly than a table, prefer the table.
 ## 8. Tables and High-Density Information
 Tables carry terms, financials, peers, customers, due diligence conclusions, and model assumptions. Headers use a dark navy background with white text, an orange background with white text, or a light orange background with dark text; the left field column uses a dark gray / dark blue background with white text, or a light gray background with bold text.
 Rows and columns are compact with low row height; borders are thin light-gray lines. Backgrounds alternate among white, light cream-white, light gray, light orange, and light blue to form zones; wide tables may use zebra striping, but it should not be too strong. Key rows and columns use orange headers, light orange fills, dark blue sidebars, or bold numbers; summary rows use a darker fill or a top border line.
 Amounts, percentages, multiples, and years are right-aligned or centered within their columns wherever possible; text is left-aligned; units are written in column headers or the first row, not repeated in every cell. Rating dots, circles, checkmarks, or short labels are visually centered within the same column.
 Footnotes and superscripts move down to the bottom and do not squeeze the data area. Avoid stuffing multi-line long sentences into cells; when explanation is necessary, use a note below the table or an explanation box on the right instead.
 ## 9. Components and Graphic Elements
 - Top section navigation bar: the current section is dark blue, the others gray; it must not be turned into a large menu or icon navigation.
 - Left orange vertical line: a brand boundary that carries no content; kept on most content pages.
 - Orange main title: the entry point to the page topic; must be left-aligned with clear spacing from the body.
 - Information sentence: a one-line judgment statement under the title.
 - Dark blue subtitle bars: used for groupings, argument bands, process stages, and table module titles, carrying short white-text titles.
 - Orange numbering / circular badges: used for A/B/C/D, steps, key points, or emphasized items.
 - Light-filled cards / module boxes: used for side-by-side evidence, customer modules, risks and mitigations; light gray borders, filled light cream / light gray / light orange.
 - Process arrows and connectors: used for M&A, pipelines, and value creation steps; lines are flat, with no shadows.
 - Company identifiers: used in the left column of tables on customer, peer, and competitor pages; presented as text names or neutral placeholder blocks at a uniform size, avoiding overshadowing the content — do not draw graphic logos.
 - Footnote / source band: located at the bottom, in small light-gray type.
 Colorful icons are not a stable language; if they must be used, use very few, in a single color or brand color, serving table recognition. Matrix markers, dot ratings, and checkmarks may be used but need a unified style.
 ## 10. Texture and Prohibited Items
 Overall, stay flat, restrained, professional, and lightly branded. Apart from the cover photo, content pages rely on almost no large image backgrounds; photos, screenshots, and illustrations are not the main language. Rounded corners are used only on a few labels or cards, with small radii; shadows, gradients, glows, 3D, and complex textures are not part of this style.
 Prohibited:
 - Large photo backgrounds on content pages or low-contrast text pressed over images.
 - 3D charts, gradient columns, glowing borders, heavy drop shadows, skeuomorphic buttons.
 - emoji, cartoon illustrations, social-media-style stickers, hand-drawn doodles, high-saturation rainbow icons.
 - Large stretches of centered copy, unstructured long paragraphs, pure-slogan pages.
 - Too many primary colors on one page, or strong colors that conflict with the orange / dark navy system.
 Use with caution:
 - Company identifiers and customer identifiers: only on comparison tables and customer pages, presented as text names or neutral placeholder blocks at a uniform size — do not draw graphic logos.
 - Light watermarks / brand geometry: may serve as a low-opacity background, but must not pass through text or tables.
 - Green / red status colors: used only with clear semantics such as growth, decline, or risk.
 - Rounded labels and small icons: they may only aid recognition; they do not replace textual evidence.
 Special pages: the cover may use a full-bleed deep blue photo with a semi-transparent geometric overlay; section dividers may use generous whitespace and large numerals; content pages must return to the tabulated, evidence-based, navigation-consistent system.
 ## 11. Generation Checklist
 - Skeleton: is it 16:9; do content pages keep the top navigation, upper-right brand wordmark, left orange line, title area, and bottom footnotes / page numbers?
 - Copy: are titles short and professional; does the information sentence state the judgment in one line; is the body organized with fields, bullets, tables, or modules?
 - Hierarchy: do orange titles, dark blue groupings, body text, and notes have clear relative size differences; is dependence on specific font sizes avoided?
 - Color: is the background light cream-white; are the primary colors limited to orange, dark blue, gray, and a small amount of teal-blue; is orange used only for emphasis?
 - Layout: is the body scannable left to right, top to bottom; does high-density content have columns, headers, numbering, and dividers?
 - Charts: are flat columns / bars / bridges / matrices used; are axes and grids light gray; is key data labeled directly; are 3D and rainbow colors avoided?
 - Tables: are headers, field columns, borders, fills, key rows and columns, number alignment, and unit bases consistent?
 - Components: are the navigation bar, dark blue title bars, orange numbering, light-filled cards, and footnote sources unified, not arbitrarily reshaped from page to page?
 - Prohibited items: are there no emoji, illustration-style icons, heavy shadows, gradients, glows, complex textures, or large-area photos on content pages?
 - Technical quality: check for no overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, or wrong proportions; when the same template is used consecutively, the body structure should vary while the skeleton does not.
 - No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions.
 - No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion.
@@ -0,0 +1,124 @@
 # PJ Mountain — Investment Memo (Organization Name Style) STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A high-density professional PPT style for private-equity investment committees, deal approvals, due diligence reporting, and investment memos, adapted for readers with backgrounds in finance, strategy, operations, and accounting. Each page builds a traceable "conclusion–evidence–assumption–source" chain, emphasizing data density, comparison dimensions, and reviewability.
 The core is a white-background full canvas, an upper-left title, an italic conclusion line under the title, purple structural bars, blue/teal/gray classification colors, thin-grid tables, compact QuattrocentoSans fonts, and bottom footnotes and page numbers. The body consists mainly of charts, tables, process boxes, side-by-side modules, and a small number of evidence images; decoration is minimal, and color only serves section, classification, data-series, and risk-alert functions.
 Underlying principles:
 1. Clarity over whitespace: prioritize keeping key conclusions, data, measurement bases, sources, and comparison dimensions, maintaining order through dividers, header bars, light-gray fills, and hierarchy.
 2. Color is an information dictionary, not decoration: purple is used for structure and titles; blue/teal/gray for business categories or chart series; red only for risks, differences, sensitive assumptions, or boxed emphasis.
 3. Pages may be complex, but the skeleton must stay stable: the body may mix charts, tables, flows, maps, and images, but the title area, conclusion line, bottom sources, page numbers, and color grammar stay consistent across the whole deck.
 ## 2. Page Skeleton
 The canvas is 16:9 landscape with a default white background; content pages use narrow margins and high content utilization. The top is the title area, the bottom is the footnote and page-number area, and the middle is the main evidence area. Reading path: upper-left section label/title → italic conclusion line under the title → main area left to right, top to bottom → bottom footnotes → lower-right page number.
 Cover page: on the left, a plain-text small-type identity mark (write the new topic name; do not draw a graphic logo), the project name, document type, and date; on the right, a large blue line-art abstract graphic; at the lower left, a red italic confidentiality note. It uses generous whitespace and brand line art, and does not adopt the content-page footnote system; this abstract linework suits only the cover and should not spread into content-page backgrounds.
 Disclaimer page: a large upper-left title; the body is a single column of dense small-type paragraphs with almost no color or graphics, keeping only the page number. Full disclosure takes priority; it must not be forced into display-type modules.
 Content pages: the upper left may hold a thin-bordered rectangle or a small numbered section label; the main title sits below it or to its right, in purple or dark gray; below the title, one italic gray conclusion line. The body divides into 2–4 modules, whose titles use purple horizontal bars or thin-bordered title bars. The bottom keeps sources, notes, and assumption statements, with a tiny page number at the lower right.
 Section/divider pages keep the white background and the upper-left title logic, with no large image backgrounds. There is no persistent top header navigation, no full-page watermark, and no large photo backgrounds. Sources and footnotes are a fixed bottom information layer and must not be covered by charts or tables.
 ## 3. Content Organization
 Titles use declarative, analytical "topic + judgment dimension" phrasing, such as company overview, market outlook, benchmarking analysis, structural solution, etc.; avoid advertising-style short titles. Under the title, one or two italic information lines express the most important judgment, finding, or question; they do not carry the full function of body text.
 The body is organized into evidence blocks. Every module must have a clear subtitle stating the comparison object, the metrics, or the direction of the conclusion; inside, use bullets, short sentences, numbers, tables, or charts. A single page may carry multiple points, but they must belong to one main question; when parallel points exceed 4 groups, use numbering, color bands, or columns to establish a path.
 Paragraphs should be short, preferring bullets and abbreviated expressions; each bullet contains one action/judgment + one factual basis; do not write continuous prose. Keywords may be emphasized with bold, purple, red boxes, or background color, but no more than two emphasis levels per page.
 Numbers, units, and time bases stay adjacent to the data and are stated in chart titles, table headers, or footnotes. Financial and operating data keep column alignment; percentages, multiples, years, and currency units must not be mixed. Source footnotes go at the bottom in small gray type; multiple external data sources are ordered by chart or module.
 ## 4. Content Page Layout System
 1. **Text-based summary page**: suited to Executive Summary, investment theses, and key findings. Structure: big title + italic overview + multiple groups of purple subtitles + bullets; each group carries only one judgment category, with subtitles, bold keywords, and sparse numbering providing emphasis; do not insert complex charts that break summary reading.
 2. **Left numbered navigation + right conclusion list**: suited to presenting side by side about 4 due-diligence topics, investment theses, or risk responses. The left side holds vertical color blocks or numbered labels; the right side holds the corresponding conclusions and bullets. Color blocks represent sections or question categories and must not be purely decorative; if the topics have no clear grouping relationship, do not use this layout.
 3. **Multi-chart dashboard page**: suited to multi-metric comparisons such as market size, business mix, cost benchmarking, and growth drivers. The body uses a 2×2 grid or a one-large-two-small vertical arrangement, each block with a purple title bar; short annotation boxes beside may explain outliers. Avoid collaging unrelated charts; all charts must jointly answer the information line under the title.
 4. **Chart + right-side explanation/annotation page**: suited to trend lines, column charts, box plots, and waterfall charts. Place the main chart on the left or in the middle; on the right, use light-filled boxes, red boxes, or short bullets to flag conclusions; red strokes, arrows, labels, or contrasting data points may be used for emphasis. If the chart itself is already crowded, move the explanatory text to the bottom or split the page.
 5. **Table/matrix page**: suited to financial models, comparable companies, deal structures, due diligence checklists, and earnings bridges. The body is a large table or several small tables; purple headers establish the primary grouping, and light-gray fills serve secondary headers or summary rows. Use only for information that naturally has row-column dimensions; do not force narrative text into tables.
 6. **Flow/structure diagram page**: suited to deal structures, financing paths, organizational relationships, or value-creation paths. Use rectangular boxes, thin-line arrows, and small amounts of color to distinguish stages or parties. Arrows represent real processes or capital/information flows and must not be used as decorative motion lines. Complex structure diagrams keep legends and footnote explanations.
 7. **Evidence image / name-text mixed page**: a small number of maps, office locations, people, customer name text lists, or business screenshots may be placed. Images must be constrained by borders, titles, and captions, and are usually smaller in area than the chart/table body; they are not emotional backgrounds or full-page visual protagonists.
 ## 5. Color System
 - **Background: #FFFFFF**. The absolute main background of all content pages, summary pages, and table pages. Cannot be replaced with a dark background; if modules need distinction, use light-gray fills rather than recoloring the whole page.
 - **Main text: #333333–#4A4A4A**. Used for body text, table content, and chart labels; may be slightly darkened per output device, but should not use pure black, which feels too oppressive.
 - **Title/structure purple: #470D59**. Used for content-page titles, section labels, module title bars, table headers, and key dividers, at small-to-medium areas; should not carpet entire pages. May be replaced with a dark brand color, but must keep high contrast and a financial-institution seriousness.
 - **Cover/business deep blue: #0020AC / #0126AE**. Used for the cover's abstract linework, some classification colors, column chart series, and emphasis blocks; may serve as a section color or main chart-series color, but its area on content pages should stay below the white and gray backgrounds.
 - **Auxiliary blue: #3E58B5 / #7B8DC7**. Used for secondary chart series, stacked columns, labels, and light-toned categories; must not compete with purple for the title role.
 - **Teal/blue-green: approximately #00A6B2–#20B8C6**. Used for business categories, process stages, chart series, and some module color bars; may be replaced with a brand auxiliary color, but must stay distinguishable from purple and deep blue.
 - **Light-gray backgrounds/table fills: #F2F2F3, #F6F7F7, #E8EAEB**. Used for table shading, module backgrounds, chart plot areas, and light zoning; may occupy large areas. Cannot be replaced with high-saturation colors.
 - **Divider/grid gray: #C8CACE, #D0D4D7, #BBBBBB**. Used for table lines, axes, module borders, and dividers; should be thin, light, and low-presence — avoid thick black lines.
 - **Emphasis/risk red: approximately #B00020–#C00000**. Used for the cover confidentiality note, negative alerts, sensitive assumptions, and red-box annotations; small areas only, not a regular series color.
 Keep a single page's main hues to purple + blue/teal + gray, with red for warnings only. Chart series colors keep a consistent dictionary on the same page; avoid the same color meaning different businesses or states.
 ## 6. Fonts and Text Hierarchy
 Fonts are dominated by QuattrocentoSans (Chinese: MiSans). Cover and large titles use Regular at large sizes, body and tables use Regular, key words and table headers use Bold, and conclusion lines and disclaimers use Italic. Do not introduce serif fonts, handwriting fonts, or strongly individual Chinese fonts.
 With body text = 1x: cover main title approx. 3–4x; content-page main title approx. 2–2.8x; page information line approx. 1.1–1.3x and mostly italic; module titles approx. 1–1.2x, often set inside color bars; body bullets at 1x; table content and chart labels approx. 0.75–0.9x; notes, sources, and page numbers approx. 0.45–0.65x. Disclaimer-page body text may be below normal body size, but must remain readable.
 Text is predominantly left-aligned. Numbers in tables are right-aligned or aligned by decimal place; years, categories, and metric names may be centered or left-aligned. Large stretches of centered copy do not belong to this style; outside of parts of the cover, it is not used.
 ## 7. Chart Language
 Real charts are mainly stacked columns, grouped columns, line charts, box plots/distribution charts, scatter/bubble charts, bridge charts, area/composition charts, and benchmark comparison charts. Charts are embedded in module frames, with a short title or purple title bar above, and data sources and measurement bases noted at the bottom.
 Axes and gridlines use light-gray thin lines; avoid thick black axes. Legends sit above, below, or to the right of the chart, using small-type text with series color swatches. Column chart series are led by deep blue, light blue, teal, gray, and purple; the stacking order stays stable. Line charts may place multiple lines in parallel, but color, line style, and end labels should reduce reading cost.
 Key data uses red stroke boxes, red annotation boxes, arrows, small labels, or dark data labels. Forecasts, targets, and baselines use dashed lines, light-colored lines, or separate labels, and must not be confused with actual data. Chart beautification must not sacrifice numerical clarity: avoid 3D, gradient columns, shadows, exaggerated rounded corners, and meaningless icons.
 ## 8. Tables and High-Density Information
 Headers use a deep-purple background with white text or a light-gray background with dark text; first-level grouping uses purple horizontal bars, second-level grouping uses light-gray fills. Row-column dividers are thin and light; table row height is compact, but text must not overlap itself.
 Number columns are right-aligned or aligned by decimal place; text columns are left-aligned; years, stages, and rating symbols may be centered. Important columns, summary rows, key assumptions, or output results may be emphasized with light-gray fills, purple text, bold, or borders. Negative values, risk items, or differences needing attention may use red, but the whole table must not turn red over large areas.
 Zebra striping is not mandatory; with many rows, extremely light gray alternating backgrounds may be used. Matrix-type pages may use dots, checkmarks, rating symbols, color blocks, and short labels, but every symbol must have a legend or be intuitively understandable. Tables carry the "evidence and model" role and must not be used as pure layout decoration.
 ## 9. Components and Graphic Elements
 - **Title bar / section label**: a small rectangular label at the upper left, often carrying a number, section name, and a purple/blue/teal border or fill. Its function is to locate the deck's structure; do not move it freely from page to page.
 - **Module title bar**: a deep-purple or section-color horizontal bar with white or dark text; compact bar height, width matching the module.
 - **Card/boxed modules**: white or light-gray backgrounds with thin gray borders, used for charts, explanations, maps, and process nodes. Rounding is imperceptible or absent; no drop shadows to create a card feel.
 - **Annotation/flag boxes**: red or purple thin borders with a short sentence explaining an anomaly, assumption, or risk. Only for locally high-value information; do not box every conclusion.
 - **Flow arrows**: thin-line arrows connecting rectangular nodes, indicating real sequence, causality, capital flow, or organizational relationships; colors follow the section color or gray. Avoid thick decorative arrows.
 - **Image frames and name grids**: images need boundaries, titles, and captions; customer, partner, or comparable-company names are arranged as plain-text small-type grids (or replaced with neutral placeholder blocks) as evidence — no graphic logos are drawn. Colorful icons as decorative selling points are forbidden.
 - **Dividers**: light-gray thin lines for tables, the upper edge of footnotes, and module separation. Thick purple lines are used only in table headers or module titles.
 ## 10. Texture and Prohibited Items
 Overall flat, restrained, institutional, high-density; almost no reliance on photos, illustrations, textures, light effects, or dimensional effects. Brand feel comes from purple structural bars, the blue cover line art, the fonts, and the footnote system.
 Prohibited: large-area image backgrounds, 3D charts, glows, complex gradients, heavy shadows, emoji, cartoon illustrations, decorative colorful icons, large stretches of centered copy, data charts without sources, low-contrast light text, and information-irrelevant background textures.
 Use with caution: photos, screenshots, maps, portraits, customer name text, red annotations, rounded cards. They must appear as evidence or explanatory tools, with area and quantity controlled.
 Special pages allowed: the cover may use large-area blue abstract linework and more whitespace; the disclaimer may use extremely high-density single-column legal text; appendix/model pages may use denser tables, but must still keep the title, sources, and page number.
 ## 11. Generation Checklist
 - Is it 16:9, white background, narrow margins, high content utilization, with the top title area and bottom footnote/page-number area preserved?
 - Is the title an analytical topic, with one clear italic conclusion line or page thesis under it?
 - Is purple used only for titles, sections, headers, and structural emphasis, with blue/teal/gray used stably by category or data series?
 - Do the page's points revolve around one main question, with clear grouping logic between modules?
 - Do charts have titles, legends, axes/labels, sources, and measurement bases, without 3D, gradients, shadows, or other decoration?
 - Are tables row-column aligned, with clear headers, light dividers, and restrained emphasis on key rows and columns?
 - Do components carry information functions: labels for positioning, color bars for grouping, frames for aggregation, arrows for flows, red boxes for risk alerts?
 - Are photo backgrounds, emoji, illustrative icons, complex textures, glare, and meaningless large color blocks avoided?
 - Have you checked for overflow, truncation, garbled text, overlap, low contrast, occlusion, empty modules, missing page numbers, wrong proportions, and missing sources?
 - Do template variations serve the information structure rather than making pages merely look different?
 - No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions.
 - No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion.
@@ -0,0 +1,179 @@
 # Organization Name — Report Name 2025 STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 An editorial annual-research-publication PPT style: warm rice-white paper, ultra-heavy black opinion headlines, section-color fluorescent highlighting, dense data charts, and a stable footer. Suited to industry annual reports, investment research, technology trends, market landscapes, and policy/ecosystem analysis. Every page gives the judgment first, then the evidence.
 Fixed characteristics: 16:9 landscape canvas; the body mostly uses a #F2EFE6-like warm-white background; a small section label at the upper left; a strong opinion headline at the top; keywords backed by section-color rectangles; the body uses charts, tables, timelines, cards, or case grids; the bottom carries a fixed brand wordmark, source, and copyright. Section dividers use dark/high-saturation backgrounds with pixel blocks, while content pages stay restrained.
 1. **Opinion first, evidence right behind.** Every page must have a judgment title that stands on its own; charts/tables/modules exist only to prove the judgment; no slogan pages without evidence.
 2. **High density comes from structure, not piled-up text.** Use columns, tables, cards, legends, notes, and footnotes to layer information, clearly separating the title area, the body area, and the footer area.
 3. **Color carries information roles.** Warm white, black, and gray handle reading; section colors handle recognition and emphasis; chart series colors distinguish data. Brand colors must not sacrifice the readability of axes, labels, and body text.
 ## 2. Page Skeleton
 **Canvas and margins**: standard widescreen 16:9. Content pages use stable, fairly narrow left, right, and top safety margins, with a footer band reserved at the bottom; the body spreads horizontally, avoiding centered narrow-column long text.
 **Default content-page skeleton**:
 - A small section label at the upper left: a small color block/short bar or small heading + an uppercase section name.
 - The upper-left title area occupies about 15%–25% of the page height; the ultra-heavy black judgment sentence may wrap, and keywords may be highlighted with semi-transparent section-color rectangles.
 - Below the title is the body area, carrying charts, tables, matrices, left-right columns, or case modules.
 - The footer spans the bottom: brand wordmark at the lower left, Source/Sources at the lower center-left, copyright at the lower right.
 - Reading path: upper-left section label → big-title judgment → highlighted keywords → body evidence → legend/annotations → source and copyright.
 **Cover**: warm-white background with horizontal green pixel blocks across the middle; an oversized black title stacked and centered, with `of` in italic serif; the year centered below. A few light-blue/purple semi-transparent squares may be overlaid. No photos, no textures, no complex backgrounds.
 **Disclosure/statement page**: a full-page high-saturation green background; a small periodical name at the upper left and an oversized black title; multiple small-type long-text paragraphs cover the lower-middle area. Only for legal disclosure — do not migrate to ordinary content pages.
 **Table of contents page**: warm-white background; a large CONTENTS title and green pixel blocks on the left; the right side holds the section list made of numbers, section names, thin rules, and small section-color blocks at the ends. No thumbnail-style table of contents.
 **Section dividers**: solid backgrounds in deep blue, purple, green, etc.; the left or middle holds the section number and a large title; pixel blocks may sit at the upper right or in a corner; no complex data.
 **Watermark/background graphics**: except for the pixel blocks on the cover, table of contents, and section dividers, content pages use no watermarks or large background graphics.
 ## 3. Content Organization
 **Title writing**: use complete opinion sentences, not noun labels, such as "a certain trend is growing/converging/dominating." Keep to two or three lines, highlight only one key phrase or word, and avoid coloring the whole sentence.
 **Information lines and body text**: use short paragraphs or small notes, placed beside or below charts or inside cards; they state the measurement basis, sample scope, exceptions, or what the conclusion means. Avoid large stretches of centered copy.
 **Grouping logic**: trend charts explain change over time, stacked charts explain composition, tables explain comparison, cards explain cases, and timelines explain stages. Multi-module pages use equal-width columns, equal-height cards, or unified table frames.
 **Number of points per page**: one main judgment per page, with 2–4 subordinate supporting points; do not place multiple unrelated conclusions in parallel.
 **Body density**: high density is allowed, but text blocks must be short, and chart labels and sources must be kept. Beyond one main chart, prefer left-right columns or two stacked evidence areas.
 **Bullet writing**: use traditional dot lists sparingly; prefer chart side-notes, card titles, table column headers, legends, and labels. Emphasize keywords with bold, color-block backing, or locally colored text — no underlines or fancy markers.
 **Numbers/units/time bases**: numbers stay close to charts or cards; units, time ranges, and estimation bases go into the subtitle, axes, or footnotes. Estimated ranges may use high-visibility colored text or leader lines.
 **Source footnotes**: every data page must have Source/Sources at the bottom; local chart annotations cannot replace the footer source.
 ## 4. Content Page Layout System
 **A. Single large chart + right explanation column**  
 The left/middle holds a large line, area, stacked-area, or column chart; the right narrow column holds a bold conclusion, key numbers, or legend explanations. Use title highlighting, in-chart annotation points, end labels, or a colored explanation box on the right for emphasis. Not suited to comparing multiple charts with different measurement bases.
 **B. Top opinion + full-width chart**  
 Title on top, chart spanning the full body width, with clear axes and gridlines. Suited to time series, market share, and long-term change; do not overlay too many cards on the chart.
 **C. Left-text-right-chart / left-chart-right-text two columns**  
 Used for "judgment + evidence + explanation." The text column holds short paragraphs, key numbers, and source supplements; the chart column is the main evidence, and the ratio may favor the chart. The text column must not turn into a long article — at most a few key notes.
 **D. High-density side-by-side modules/card grid**  
 Used for cases, companies, process chains or linkages, products, or metric comparisons. Cards are uniform in size, separated by light fills or thin lines; titles are bold black, interiors hold small images, numbers, or short notes; section-color small labels or card background colors may provide emphasis. If every card needs a long explanation, split the page.
 **E. Table/matrix-type page**  
 Used for multi-entity, multi-metric comparison. Clear headers, thin lines and light fills distinguishing rows and columns; key columns may use section color, dark fills, or icon dots. The table is the evidence protagonist and does not compete with a large chart for the same page.
 **F. Semi-circle/gauge-style estimation chart**  
 Used to express range estimates, hierarchical relationships, and nesting from a large population down to a smaller active group. Must pair with numeric labels and leader lines on the left; not suited to precise trend comparison.
 **G. Chart + case note card**  
 Place a specific project/case beside a trend chart. Case cards have light or white backgrounds with slightly rounded/near-rectangular corners, containing the project text name/product image, a short paragraph, and 2–3 key metrics. Case cards are auxiliary evidence and must not overshadow the main chart.
 ## 5. Color System
 **Background — warm rice-white #F2EFE6 / #F5F2E9**: used for page bases, light table fills, and chart backgrounds. Cannot be replaced with pure white or cool gray unless the source image/embedded chart requires it.
 **Main text — near-black #111111 / #1A1A1A**: used for titles, body text, key axis text, and the footer brand wordmark. Main titles must not be replaced with light gray.
 **Auxiliary text/lines — gray #83817D / #9B9D9D / #C5C0BA**: used for footnotes, sources, gridlines, table separators, and secondary labels; does not carry main conclusions.
 **Brand/section green — #52DA92 / #79D497**: used for cover pixel blocks, the disclosure-page background, table-of-contents pixel blocks, section colors, and title keyword highlighting. Large-area use is limited to the cover, table of contents, disclosure, or section pages; on content pages it serves only as small-area highlights, labels, and chart series.
 **Deep blue/section dark tones — approximately #342B56 / #39374F / #0B2D3A**: used for section-divider backgrounds, dark chart series, and emphasis blocks. Dark backgrounds use white or bright-colored text; use large areas cautiously on content pages.
 **Blue series — #2351EC / #4168C5 / #A4C9FE**: used for chart series, range fills, section colors, and emphasis labels. Light blue may fill large graphic areas; deep blue is used for lines and key series.
 **Orange series — #F6A031 / #F6931C / #F9961F**: used for important chart series, labels, positive growth, or one asset/category identifier. Should not appear alongside too many other high-saturation colors on one page.
 **Purple/magenta series — approximately #DB76ED / #9D8C7F / #7B3FF2**: used for section dividers, chart series, and label cards; pairs well in contrast with orange/blue, with area controlled on content pages.
 **Green chart series — approximately #70AF87 / #2FBF72**: used for area charts, growth trends, and status emphasis. Brand green is for sections/highlighting; data green is for series.
 **Per-page color boundary**: content pages are limited to 1 section color + 2–4 data series colors. High-saturation colors are only for data distinction, not casual decoration. No strong system of positive/negative status colors; when expressing rises and falls, prefer legend text explanations and avoid adopting the red-green finance convention.
 ## 6. Fonts and Text Hierarchy
 A strong sans-serif publishing system: titles in Archivo Black (via customFonts; Chinese titles in MiSans Bold), extremely bold, compact, and black; body and footnotes in Liter (Chinese: MiSans); `of` on the cover in Oranienbaum italic.
 - **Main title**: approx. 2.5–4x body text, ultra-heavy, tight leading, mainly left-aligned; the cover may be larger.
 - **Section-divider title/number**: may exceed 4x body text, bold black or white.
 - **Small section label**: approx. 0.7–0.9x body text, all caps or short phrase, often with a small color block.
 - **Body explanation**: body = 1x, black or dark-gray short paragraphs with relaxed line spacing; avoid long dense columns.
 - **Chart title/subtitle**: approx. 0.9–1.2x body text, bold or semi-bold, placed above the chart.
 - **Table text/legend labels**: approx. 0.75–0.95x body text; numbers may be semi-bold.
 - **Notes/sources/footer**: approx. 0.55–0.7x body text, gray or low-weight black; must remain readable.
 - **Page numbers**: not a prominent navigation device; if added, they should be subdued and folded into the footer — they must not become a visual focus.
 ## 7. Chart Language
 Main chart types: stacked area charts, line charts, column charts, combined column-line charts, semi-circular nested/gauge-style estimation charts, small time series, and comparison charts.
 **Axes and grids**: thin, gray axes; light, regular gridlines; warm-white or light backgrounds. Axis labels are small and clear; time axes usually run horizontally.
 **Legends and labels**: legends sit at the chart's inner edge or beside the chart, using color blocks/line samples + category names. Key data is labeled directly on the chart or in the right explanation column.
 **Series colors**: use high-distinction colors such as orange, blue, purple, green, and light blue. Stacked area charts must keep boundaries discernible; emphasis lines in line charts may be thicker or more saturated.
 **Emphasis annotations**: use section-color highlighting, horizontal baselines, explanation boxes, key-number labels, or local colored cards; annotations stay close to the relevant data points and do not float as decoration.
 **Forecast/target/baseline lines**: new forecasts use dashed lines/light-shaded ranges and are explained in the legend; do not confuse them with solid historical lines.
 **Boundaries**: no 3D charts, perspective charts, glowing charts, or overly skeuomorphic gauges. Axes and sources must not be omitted.
 ## 8. Tables and High-Density Information
 Tables are used for professional evidence and multi-entity comparison. Headers use bold text, light fills, or a top separator line; rows and columns are divided by thin gray lines; fills are warm white, light rice, or light gray; key cells may use section color or dark blocks.
 **Row and column rules**: compact row height without crowding; long text left-aligned, numbers right-aligned or visually aligned by decimal point/unit; column titles kept short; multi-column metrics keep unified units and time bases.
 **Emphasis treatment**: use highlighted columns, colored labels, bold numbers, dark summary rows, or small dot markers. Highlighting is only for key comparisons — do not pattern the whole table.
 **Zebra striping and separation**: prefer thin lines and light-fill zoning; if zebra striping is used, it must be very light. Avoid heavy borders.
 **High-density modules**: side-by-side cards, metric blocks, case grids, and tables must all have unified sizes, title levels, and spacing; each module holds only the necessary numbers, notes, and legends.
 ## 9. Components and Graphic Elements
 **Pixel blocks**: made of stepped rectangular blocks, commonly used on the cover, table of contents, and section dividers, and sparingly for navigation. Large-area use is limited to structural pages; on content pages, do not repeatedly carpet pixel blocks as background ornament.
 **Section labels**: a small color block + uppercase section name, fixed at the upper left for section positioning.
 **Title highlight bars**: semi-transparent or solid rectangles laid behind keywords, with straight edges like a highlighter pen. Highlight keywords or phrases only; never highlight entire body paragraphs.
 **Cards/callout boxes**: used for cases, legend explanations, key numbers, and category notes. Rectangular or slightly rounded corners; fill may be orange, purple, dark, or light, with high-contrast text; placed near the corresponding chart.
 **Dividers**: thin gray lines for the table of contents, tables, chart grids, and module boundaries. Lines are restrained and straight; no decorative curves.
 **Icons/identity marks**: used only sparingly as small category icons; brand/project identifiers are presented as plain small text (write the new topic name) — no graphic logos are drawn. Colorful icons are not a global language; they may only be used in case cards, legends, or project text identifiers.
 **Flow arrows/matrix markers**: used for flow or stage explanations; keep them flat, thin-lined, and few-colored; do not build complex flowcharts.
 **Image frames**: a small number of product/device images placed inside cards or beside charts, auxiliary only — never full-page backgrounds.
 ## 10. Texture and Prohibited Items
 Overall flat, publication-grade, restrained, high-density, with strong brand-color accents; recognition comes from type weight, the warm rice-white paper, pixel blocks, and section colors — not from photo spreads or dimensional textures.
 **Prohibited**: large-area photography backgrounds, complex illustration backgrounds, emoji, 3D charts, glow effects, glassmorphism, strong drop shadows, complex textures, lace ornament, casual gradients, large stretches of centered copy, unsourced data charts, low-contrast light text, and pure-image pages with no title judgment.
 **Use with caution**: colorful icons, product screenshots, rounded cards, full-page dark backgrounds, gradient fills, strongly saturated multi-color charts. They must serve an information function and be confined to case/chart/section-page scope.
 **Special pages allowed**: full-page high-saturation green for disclosure; full-page deep blue/purple/green backgrounds for section dividers; large-area pixel blocks on the cover and table of contents; a small number of physical/product images on case pages. Ordinary content pages still center on warm-white backgrounds and data evidence.
 ## 11. Generation Checklist
 - Skeleton: is it 16:9; does it keep the upper-left section label, the top opinion title, the body evidence area, and the bottom brand wordmark/source/copyright?
 - Copy: is the title a complete judgment sentence; is there one main point per page; is keyword highlighting restrained?
 - Hierarchy: do the title, chart titles, body text, notes, and footer have clear relative size differences; page numbers are not used as primary navigation.
 - Color: is the background warm rice-white; are section colors used only for recognition/emphasis; are there too many high-saturation colors on one page; is text contrast sufficient?
 - Layout: are charts, tables, and cards aligned; are margins stable; is the footer not squeezed by the body?
 - Charts: do they have axes, legends, units, time ranges, and sources; are emphasis annotations close to the data; no 3D/glow/meaningless decoration used?
 - Tables: are headers, dividers, number alignment, and unit bases clear; is highlighting used only for key rows and columns?
 - Components: are pixel blocks used only on the cover/table of contents/section dividers or for sparse navigation; do cards serve explanation; do icons have real-object meaning?
 - Prohibited items: no large image backgrounds, emoji, complex illustrations, heavy shadows, glassmorphism, excessive gradients, or large stretches of centered copy.
 - Quality: check overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong proportions, and mechanical template repetition.
 - No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions.
 - No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion.
@@ -0,0 +1,192 @@
 # Design System: Consumer Trend Monitor · Landscape Presentation Edition
 > Reverse-engineered from: the real visual evidence of a 36-page portrait (US Letter 612×792) investment-monitoring quarterly (cover + page-by-page images of all 35 pages).
 > This system keeps only its **visual methodology** — newspaper-style grids, serif headlines mixed with data charts, a teal/amber/crimson chart language, and paper-beige footers —
 > it does not copy any third-party logo, brand name, trademark, or source text; per the task requirements, the portrait report grammar is converted into a 16:9 landscape presentation system.
 > Any value that cannot be confirmed precisely from pixel evidence is marked "approximate."
 ---
 ## 1. Visual DNA (One Sentence)
 **A financial-newspaper-style data-monitoring report**: a restrained black-on-white layout + large serif headlines + dense column-line combination charts + a deep-sea-blue cover and beige footers; the overall temperament is a "trustworthy industry dashboard," not a marketing poster.
 Four executable principles:
 1. **Conclusions spoken in italic serif, evidence given by charts** — every information block is a pairing of "italic serif conclusion sentence + chart/body text."
 2. **Charts are the protagonists**: page area goes to charts first; text is the charts' annotation.
 3. **Color only encodes, never decorates**: teal = primary series, dark teal = secondary series, amber/yellow = comparison lines, crimson = warning or second theme, beige appears only in the footer and separator bands.
 4. **Dense but not crowded**: small type, multiple columns, tight leading — but with clear whitespace between modules.
 ---
 ## 2. Canvas and Grid (16:9 Landscape Conversion)
 | Item | Value | Note |
 |---|---|---|
 | Canvas | 960 × 540 px | 16:9 presentation standard |
 | Left/right margins | 44 px | Source portrait margins ≈ 7% of page width, carried into landscape (approximate) |
 | Content area | y = 20 ~ 508 | Above the beige footer band |
 | Footer band | y = 512 ~ 540 (28 high) | Beige horizontal band, see §9 |
 | Column system | 12-column mental grid, commonly split into 2 / 3 columns; gutter 24 px | Source body uses a fixed 3 narrow-column layout |
 | Baseline rhythm | multiples of 4 px | All spacing takes multiples of 4 (approximate) |
 Portrait → landscape conversion rules:
 - Source "full-page large image + three-column body below" → landscape becomes "left 60% chart + right 40% text column" or "chart on top, text below, chart spanning the full width."
 - Source 2×2 chart-matrix pages (vertically arranged) → landscape becomes a natural 2×2 grid — a native fit.
 - The source's only landscape page (regional map + stacked bars on both sides) proves this system supports landscape; align density to that page.
 ---
 ## 3. Font Hierarchy
 Map Chinese fonts as follows (font names must exactly match the library):
 | Role | Font | Size / style | Usage | Evidence |
 |---|---|---|---|---|
 | Display serif | `{latin: Oranienbaum, ea: 思源宋体}`, bold | cover 40~48 / page title 26~28 | Cover main title, each page's large headline | Source titles are Georgia-type bold serif (approximate mapping) |
 | Conclusion line / chart title | same as above, italic + bold | 14~15 | Each page's conclusion line, each chart's italic title | Source chart titles are italic serif (approximate) |
 | Sans-serif body (Sans) | `MiSans` | 10~10.5, line height 1.45~1.5 | Multi-column body, legends, axis labels | Source body ≈ 9px sans-serif in three columns (approximate) |
 | Eyebrow | `MiSans`, letterSpacing 2~3 | 9~10, all-caps feel replaced with bold | Column identifier above the page title | Source "DEALS BY SECTOR"-style small-type eyebrows |
 | Data labels | `MiSans` bold | 9~10 | Values inside columns / on lines | Source white bold values inside columns |
 | Big numbers (Stat) | display serif bold or MiSans bold | 28~36 | Key metric cards | Source back-cover and inner-page big-number treatment (approximate) |
 | Footer / source note | `MiSans` | 8~9, gray | Footer-band text, under-chart source notes | Source footer's small uppercase gray type |
 Rules:
 - Within one page, serif is used only for "titles + conclusion lines + chart titles"; body text and chart annotations are always sans-serif.
 - No fonts beyond the two families above; no calligraphic/handwritten faces.
 ---
 ## 4. Color Tokens (Hex; all are pixel-sampled approximations)
 | Token | HEX | Role | Sampling basis |
 |---|---|---|---|
 | `ink` deep sea blue | `#06223F` | Cover/section-page base, table headers, darkest chart series, emphasis text | Cover base #051C38, header #2C4057, darkest map state #001830 |
 | `ink-soft` | `#14324F` | Deep-blue auxiliary (cards, secondary headers) | approximate |
 | `teal` | `#2FBFC4` | Primary-series column color, main line, emphasis icons | Main-chart columns #30C0C0~#3CC0C0 |
 | `teal-dark` dark teal | `#1B6E72` | Secondary-series columns, second stacked segment | Dark-teal columns #186C6C~#246C78 |
 | `teal-pale` light teal | `#BFE5E6` | Lightest stacked segment, light area-chart layer, chart background blocks | Light-teal segment #C0E4E4 |
 | `amber` | `#D9A62E` | Comparison line (the "line" in column-line combos), growth-rate annotations | Gold line #CCA80C~#E4C09C |
 | `yellow` bright yellow | `#DCC83C` | Single-series yellow columns (industry-page primary color), stacked segments | Yellow columns #D6D470~#CCA80C |
 | `orange` | `#E5862E` | Third-theme column color, stacked segments | Orange columns #E48430 |
 | `crimson` | `#76101A` | Warning / second-theme column color, dark stacked segments | Deep-red columns #6C0000~#780C0C |
 | `salmon` | `#F0A89A` | Middle stacked segment (between crimson and light teal) | Pink-segment sample #FEF1EE brightened estimate (approximate) |
 | `slate` slate blue | `#5E84A0` | Map/chart mid-tones, auxiliary lines | Mid-tone map state #60849C |
 | `paper` paper white | `#FFFFFF` | Content-page base | — |
 | `beige` | `#EDE7D6` | Footer band, horizontal separator bands, note-box fills | Footer band #EFEBDE |
 | `beige-line` | `#D8D2C2` | Top edge of beige band, thin table lines | Band edge #D2D1C9 |
 | `text` body ink | `#262626` | Body text | approximate |
 | `muted` gray | `#8A8A8A` | Axis labels, legends, source notes, footer text | approximate |
 | `grid` grid gray | `#E7E7E7` | Table outer frames, thin dividers | approximate |
 Contrast floor: on `ink`, only white/light-teal text; data labels on deep `teal`/`crimson`/`orange` columns are white or placed above the column in dark gray; on the beige band, only text at `#6B6B6B` depth or darker.
 ---
 ## 5. Page Skeleton (Common to Content Pages)
 ```
 ┌─────────────────────────────────────────────────────────────────────┐
 │ ▪ wordmark "Specialty Coffee Consumption Monitor"                    │  ← header row y≈20~44
 │ version at right: 2026 Annual Insights · sample setting               │
 │                                                                      │
 │ Eyebrow (9px, wide letter spacing, gray)                             │  ← y≈56
 │ Serif display headline 26~28px                                       │  ← y≈74~104
 │ Italic serif conclusion line 14px (the page's only conclusion)       │  ← directly under the title
 │                                                                      │
 │ ┌────────────────── content area y≈130~486 ────────────────────────┐ │
 │ │  chart / multi-column body / table / cards (choose layout per §6) │ │
 │ └──────────────────────────────────────────────────────────────────┘ │
 │                page number (centered, 9px serif gray)                │  ← y≈496
 │ ▔▔▔▔▔▔▔▔▔▔ beige footer band: report name centered 9px ▔▔▔▔▔▔▔▔▔▔ │  ← y≈512~540
 └─────────────────────────────────────────────────────────────────────┘
 ```
 - Header left wordmark: a solid teal small square (10×10) + the bold sans-serif report name; on the right, a small gray version identifier. **Any real brand logo is forbidden.**
 - The page number is centered just above the beige band (source style); the footer band holds the centered full report name in small type.
 ---
 ## 6. Reusable Layouts (8)
 1. **Cover (deep sea blue)**: full-bleed `ink` base + concentric thin arcs/thin-line signal pattern on the right (low-opacity blue-gray elliptical strokes, entirely within the canvas) + large serif headline (may mix italic and roman) + one line of version info + a bottom key-numbers band (3 stats, teal/white text).
 2. **Conclusion page (cover variant)**: same skeleton as the cover, but the headline is the page's conclusion sentence, with 3~4 data stat bands below as evidence.
 3. **Large chart + text column**: left 55~60% holds one column-line combination chart (with italic chart title + legend + source note); right 40% holds one body-text column + one stat card or small chart.
 4. **Full-width chart + three-column body**: a full-width combo chart on top (occupying 45~50% of the height), three columns of 10px body text below, each column optionally opening with a bold lead-in sentence.
 5. **2×2 chart matrix**: one small chart per quadrant, each with "italic serif chart title + small-type subtitle + chart + source note," with 24px whitespace between quadrants.
 6. **Horizontal bars + right stat track**: left 60% a horizontal-bar ranking chart; right 40% a vertical stack of 2~3 stat cards (beige or light-teal fills, large serif numbers + small-type notes).
 7. **Comparison paired columns + interpretation column**: left-of-center comparison chart with 2~4 large columns (values labeled above and outside the columns), one interpretation-text column on the right + one "x-fold difference" arrow annotation.
 8. **Table page / card page**: a dark-teal-header white-text table (see §7) or 2~3 equal-width action cards (card = light-teal top bar + serif subtitle + sans-serif body + bottom data-anchor chip).
 ---
 ## 7. Chart and Table Language
 ### Charts in general
 - Chart title: italic serif bold 14px `ink`, left-aligned; the line below is a 9px gray subtitle (metric basis).
 - Axes: no y-axis gridlines (`gridLine: false`), no axis lines or only a thin `#E7E7E7` baseline; axis labels 9px `muted`; currency axes carry unit abbreviations.
 - Legend: horizontal below the chart, small color swatches + 9px gray text.
 - Source note: 8px gray text at the chart's lower right — "China Specialty Coffee Consumption Trend Monitor · sample data (internal estimates)."
 - Value labels: 9~10px; column-series labels preferably white bold inside the column, or dark gray above the column when they do not fit (if the renderer does not support position control, place them uniformly above and outside, treated as an approximation of the source).
 - Line-series labels sit above the endpoints, in `muted` gray.
 ### Chart-type recipes (ordered by evidence frequency)
 1. **Column-line combination (this system's signature chart)**: solid columns (one of `teal` / `crimson` / `orange` / `yellow`) + a contrasting thin line (`amber` or `teal`), dual axes; columns labeled with amounts, the line labeled with counts/ratios.
 2. **Multi-line**: 4~5 thin lines of 1.5~2px, color order `ink`→`teal`→`amber`→`crimson`→`slate`, with endpoint values labeled directly at the right ends.
 3. **100% stacked bars**: segment colors per theme from `teal`/`teal-pale`/`salmon`/`crimson` or `teal`/`teal-dark`/`ink`, with white % text inside segments.
 4. **Horizontal-bar ranking**: single color family (`teal` or `ink`), values labeled at bar ends, category axis on the left.
 5. **Layered area**: `ink`→`teal-dark`→`teal`→`yellow` bottom to top, used only for "stock accumulation" semantics.
 6. **Comparison paired columns**: two same-family columns in dark and light, with a "x-fold difference" arrow and text between them.
 ### Tables
 - Header: `ink` background, white bold 9~10px text, left-aligned (numeric columns right-aligned).
 - Data rows: white background, only a `#E7E7E7` 0.75~1px baseline between rows, no vertical lines, no zebra striping (source tables have no zebra striping).
 - Row height 22~26px, cell padding 8px left and right.
 - Tables also get a source note below.
 ---
 ## 8. Image Cropping and Graphic Components
 - **Images**: only covers/section pages may use full-frame images, always `fit: cover` full-bleed cropping; portrait images in landscape take only the middle band (`crop: {top, bottom}` trimming 15~25% each); content pages use no photos — charts and graphic components substitute. Source portraits are right-column small squares (about 120×150) + a gray-text bio; use a same-spec placeholder only when genuinely needed.
 - **Signal pattern (cover decoration)**: 3~4 concentric elliptical thin strokes (`slate`/`teal`, opacity 0.15~0.3), all bounds within the canvas; or one 2px teal "pulse" polyline.
 - **Stat cards**: `teal-pale` or `beige` fill (no stroke, no shadow), large serif `ink` number + 9px gray note; on deep-blue pages switch to a transparent fill + teal big numbers.
 - **Action cards**: white base + a 4px `teal` solid top bar + serif subtitle + 10px body + bottom data chip (`beige`-filled rounded small type).
 - **Icons**: only Font Awesome free solid (`fas:`), single color `teal` or `ink`, 16~20px, no mixed styles.
 - **Separation**: always a 1px `#E7E7E7` thin line or whitespace; no shadows, no gradient blocks (except the cover signal pattern).
 ---
 ## 9. Density, Spacing, and Footers
 - Information density aligns with the source: 1 conclusion + 1~2 charts + no more than 3 columns of body text per page; body 10px, line height 1.45, paragraph spacing 6~8px.
 - Module spacing: title area → content area 20~24px; chart-matrix quadrants 24px apart; cards 16~20px apart.
 - Footer: a beige band (`beige`, 28px high) spans the full width, holding the centered 9px `muted` report name "China Specialty Coffee Consumption Trend Monitor · 2026"; the page number is 9px serif gray centered 6px above the band.
 - The lower-right chart note on every page uses the unified §7 source-note phrasing.
 ---
 ## 10. Do-Nots
 1. No third-party logos, brand names, sponsor marks, trademarks, or source-manuscript original text.
 2. No pie/donut charts for share rankings (the source has no pie charts at all); shares always use 100% stacked bars or horizontal bars.
 3. No shadows, gradient fill blocks, frosted glass, 3D charts, or animation-flavored chart decoration.
 4. No cards with corner radius greater than 8px; chart columns stay right-angled.
 5. No text pressed over images, and no chart elements bleeding outside the canvas (all bounds must stay within 960×540).
 6. No large-area beige fill in body areas outside the beige footer band; beige is only a "band," never a "block."
 7. No fabricated numbers: all values must come from the task query; qualitative judgments must be marked "internal judgment."
 ---
 ## 11. Pre-Delivery Checklist
 - [ ] Every page has one and only one explicit conclusion, presented as an italic serif sentence directly under the title.
 - [ ] The 6 pages form a complete narrative: conclusion → market structure → consumer segmentation → channel and membership economics → opportunity map → action recommendations.
 - [ ] Every number can be traced one-to-one to query.md; nothing fabricated, no external data.
 - [ ] All colors come from the §4 tokens; chart coloring follows the §7 recipes; no gradients/shadows.
 - [ ] Only two font families: serif `{Oranienbaum, 思源宋体}` and sans-serif `MiSans`; sizes follow §3.
 - [ ] The header wordmark, beige footer band + page number, and under-chart source notes are present on every page at consistent positions.
 - [ ] `kimi-ppt check` reports no errors; page-by-page screenshots show no overlap, no cropping, no overflow, no unexpected line wraps; dark-background white-text contrast passes.
 - [ ] Final directory: `deck.pptx` (the only PPTX) + the complete PPTD bundle + `final-screenshots/pages/1.jpg~6.jpg`.
 - No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions.
 - No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion.
@@ -0,0 +1,163 @@
 # Organization Name — Q2 2025 Crypto Industry Report STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A dark, data-driven PPT design system for quarterly crypto-industry research reports, aimed at professional readers fluent in metrics across markets, assets, trading volume, ETFs, DeFi, NFTs, and exchanges, supporting high-density data, longer explanatory text, and multi-series charts. The body adopts a dark research dashboard with Organization Name's green visual identity; the cover, section dividers, and product/closing pages use high-saturation green or purple frames, large rounded cards, and mascot illustrations.
 The whole deck is a 16:9 landscape canvas; content pages use a near-black background with white ultra-heavy sans-serif titles (Archivo Black, via customFonts), body and footnotes in Inter (via customFonts); the header holds a fixed small brand wordmark; the footer contains the report name, copyright, sources, and page numbers. Main content includes line, column, stacked-column, and area charts, timelines, tables, and text lists/avatar matrices; accent colors are fluorescent green, purple, pink, yellow, and other high-saturation colors.
 Underlying principles:
 1. **Data over decoration.** Pages prioritize charts, tables, numbers, and explanatory text; illustrations, borders, bright colors, and identity marks are used only for brand recognition, classification, emphasis, or section transitions.
 2. **Body-skeleton consistency over layout showboating.** Ordinary data pages keep the black background, upper-left brand mark, white title, insight line on the right or above, and bottom sources and page numbers; large-area green/purple brand pages appear only at the cover, section dividers, product, or closing positions.
 3. **Accent colors must carry semantics.** Fluorescent green is used for the brand, positive/growth values, key series, or button-like components; purple/pink for insight lines, section transitions, and special annotations; red only for negative change or risk-type data. If bright colors hinder reading values, prioritize the clarity of axes, labels, units, and legends.
 ## 2. Page Skeleton
 The canvas is 16:9 landscape widescreen. Content-page backgrounds are pure black or near-black; covers/section/closing pages use a bright-green outer background, or a purple outer frame with a dark rounded inner card. Keep stable margins with no key data at the outer edges; high-density pages may approach full-bleed, but the header, title, and footer must keep their safety zones.
 **Cover page**: bright-green outer background with a large deep-green rounded card at the center, and a notch-style split or dual-card structure at the top. The upper left holds the identity mark — plain small text with the new topic name, or left blank; no graphic logo is drawn. The main title is huge, the year or keywords may be layered with a dark-green/light-green gradient feel, and the report name is in white/light green; the lower middle holds the Organization Name mascot illustration, a thin-line trend line, and halftone dots; the sponsor text list sits at the right or lower right, smaller in area than the main title and the mascot.
 **Table of contents page**: black background with a large "Content"-style title at the upper left; the body is a multi-column contents list, with level-one section titles larger and white, entries in small white/gray text, and page numbers right-aligned; author avatars, names, and titles may sit below. The contents page uses no large charts and little decoration.
 **Section dividers**: a bright-green or purple outer frame/background, with a large deep-green or deep-blue-black rounded card inside. The left holds the section name and a small label; the right or bottom holds the large Organization Name mascot and theme graphics. Section titles take the dominant level, with minimal information.
 **Content data pages**: a fixed small brand wordmark at the upper left, with the white page title below it or to its right; the title area occupies a compact horizontal band at the top. The insight line sits to the right of the title, at the page's upper right, or atop the explanation column, usually opening in purple and continuing in gray-white text. The body may use a single large chart, left-right columns, chart + explanation column, a timeline, a table, or a matrix. The bottom left holds the report name/copyright, Source sits below the chart or at the lower left, and the page number sits at the lower right. Reading path: brand and title → purple insight line/key information line → main chart or table → explanatory text/legend → source and page number.
 Dividers are used only for chart axes, table lines, card borders, and timeline rules — no heavy header rules are set. Content pages use no watermarks or large background graphics; backgrounds stay clean.
 ## 3. Content Organization
 Titles are object-type or metric-type, such as "a certain asset's price and trading volume," "a certain market share," "notable events," or "exchange trading volume," responsible for topic positioning; conclusions are expressed by the insight line. Titles should be 1 line, 2 lines if necessary; avoid more than two lines, which compresses the chart area.
 Each page prioritizes one information line, located to the right of the title or atop the explanation column, structured as "key change/conclusion + data definitions and measurement basis/time range + cause or impact." Use purple to highlight the opening phrase or core number, with the rest in gray-white. Do not stack multiple conclusions into one paragraph; each page prioritizes one main judgment.
 The body uses short paragraphs and bullets, usually in the narrow column to the left or right of a chart; each paragraph explains one cause, data finding, or impact. Keep paragraphs broken and line lengths moderate; the text column in left-right layouts exists to explain the chart and does not become a long article on its own.
 Group by market category, asset class, time, platform, chain, exchange, or metric definition and basis. High-density pages use subtitles, labels, legends, colored series, and thin-line separation. A single page carries one core question; it may contain multiple data series, but must not discuss multiple unrelated topics at once.
 Numbers and units stay close to data labels or axes, retaining the relevant formats and units — percentages, dollars, multiples, dates, and quarters. Time axes remain continuous and readable; big numbers may be highlighted in the insight line or chart annotations. Source footnotes sit below charts or in the footer, in small gray-white text that does not compete with the main data.
 ## 4. Content Page Layout System
 **A. Left explanation column + right large chart**  
 Suited to single-theme time series such as price, trading volume, index, and capital flows. The left column holds the title, insight line, 2–4 explanation paragraphs, and the source; the right large chart occupies most of the body width, complete with axes, legend, and data annotations. Emphasize with bright lines, peak labels, vertical annotation lines, or key-point text. Not suited to table-type content requiring extensive categorical comparison.
 **B. Top title-and-insight + full-width chart below**  
 Suited to horizontal time-axis charts such as multi-series lines, stacked columns, and market-share change. A compact title and one insight line sit on top; the main chart spans the page; the legend stays near the chart's top or right, and series colors keep high contrast. If there is too much explanation, switch to left-right columns to avoid compressing chart height.
 **C. Large chart + right annotation/sponsor/note column**  
 Suited to pages needing supplementary event background, such as IPOs, ETFs, and trading volume. The main chart sits on the left or in the middle; the right narrow column holds short notes, wordmarks, or secondary legends; the right column must not exceed the main chart in width. This layout is not suited to multiple long paragraphs or multiple unrelated wordmarks.
 **D. Timeline/event-band layout**  
 Suited to "Notable Events"-type content. Use multiple rows of horizontal date bars; date blocks distinguish periods or categories with high-saturation green, pink, purple, etc., with small-size event notes beneath; the title area is minimal. Do not add complex charts; event copy must be short — long explanations break the timeline rhythm.
 **E. Table/ranking/matrix page**  
 Suited to asset returns, stablecoins, exchanges, chain ecosystems, and team or platform comparisons. The body uses dark tables, ranking bars, text lists, or multi-column cards; a note column may sit on the left, and colored bars, dots, icons, or text color highlight positive/negative change inside the table. This layout suits high-density classification, not continuous trends.
 **F. Brand/product/section-style body variant**  
 Uses green or purple cards, buttons, screenshot-style interfaces, and the mascot for product promotion, section intros, or closing pages; lower information content than data pages. Must not be abused as a template for ordinary research pages.
 ## 5. Color System
 **Background black / near-black #000000–#080808**: the main background of content pages, largest in area. Cannot be replaced with light colors; even if the new theme uses a brand color, keep body backgrounds dark.
 **Deep-green cards #183F2D / #1A412E**: the main base color of covers, section dividers, and brand cards, usually paired with bright-green outer frames. Brand pages may use it over large areas; ordinary content pages use only small amounts for labels or borders — it should not replace the black background over large areas.
 **Fluorescent green #A6F05F / #9EE45A / #4BCC00**: used for the cover outer base, section frames, identity marks, positive values, key data lines, button-like labels, and a few chart series. Area may be large on brand pages and small-to-medium on content pages. It may be replaced with a new brand primary color, but must keep dark-background high contrast and consistent "positive/key" semantics.
 **White #FFFFFF / light gray-white #DDE5E0**: used for titles, key labels, main axis text, and high-priority numbers. Cannot be replaced by low-contrast colors.
 **Gray-blue/gray-green text #8A9492 / #B9BCA6 / #808963**: used for body text, notes, secondary legend text, axis labels, sources, and footers; low brightness, but never so low as to be unreadable.
 **Purple #7A54FF / #6B4CFF**: used for section dividers, insight-line openings, key lines, labels, and brand variants, at small-to-medium areas; it does not represent positive/negative status by default.
 **Pink #F19EE2 / #F4A0E5**: used for event timelines, chart series, and emphasis blocks, at small areas, expressing categories. Avoid large simultaneous use with purple, which becomes garish.
 **Yellow #FAEB6A / #E7D84A**: used for column charts, key values, event or return-type series; not for long text passages.
 **Red/coral #FF5A6A / #BE827F**: used for negative returns, declines, risks, or negative values. For status/data only, never as decoration.
 Content pages keep their main hues to black-white-gray + 1 brand accent + 2–4 data series colors. Multi-series charts may add colors, but legends must stay clear; color serves classification/status only — no meaningless decoration.
 ## 6. Fonts and Text Hierarchy
 Fonts are modern sans-serif: titles use Archivo Black (via customFonts); body is dominated by Inter (via customFonts), with weights handled through the bold field. Do not mix in serif or handwritten fonts; special sponsor/logo fonts exist only as images or marks.
 With body note text = 1x:
 - **Cover main title/year**: approx. 4–6x, bold or semi-bold, tight letter spacing allowed.
 - **Section titles**: approx. 3–5x, white or light green, usually 1–2 lines.
 - **Content-page titles**: approx. 2–3x, white, medium-bold to bold.
 - **Insight line/information line**: approx. 1.4–2x, usually medium-bold, purple keywords + gray-white continuation.
 - **Subtitles/group titles**: approx. 1.1–1.4x, medium-bold or semi-bold, white/light gray.
 - **Body paragraphs and bullets**: 1x, regular weight, gray-white or gray-blue.
 - **Table text/chart labels**: approx. 0.7–1x, compress per space, keeping numbers readable.
 - **Footnotes, sources, footers, page numbers**: approx. 0.6–0.8x, gray, low-level but never absent.
 Numeric labels use the same fonts as body text, with increased weight or a different color; no ornamental numeral forms. Titles and body build hierarchy through size, weight, and color, without relying on shadows or strokes.
 ## 7. Chart Language
 Core charts include line charts, column charts, stacked columns, area charts, dual-axis price/volume charts, horizontal-bar rankings, timelines, share/market-share charts, donut/pie mini-widgets, and tabular leaderboards.
 Charts use dark bases; axes and gridlines are low-brightness gray thin lines; no white-background chart boxes. Main data lines use high-contrast colors such as fluorescent green, yellow, purple, pink, and cyan; secondary series lower saturation or line width. Column charts use bright columns against the dark grid, and volume columns may combine with price lines. Multi-series stacked columns need clear legends, placed above the chart, to the right, or in empty chart areas.
 Key data uses peak/trough labels, vertical event lines, endpoint values, local text annotations, color brightening, and red for negative values. Annotations stay close to their points and should not form long passages. Forecasts, targets, or baselines use dashed/thin lines and explicit labels, distinguished from historical data; never let a forecast line blur into an actual line.
 Axes keep units and time bases — especially dollars, percentages, quarters, dates, and trading volume. Gridlines must be thin, dark, and few; no heavy borders. The page title states the chart's subject; the chart itself keeps only the necessary subtitle and legend, avoiding repetition.
 ## 8. Tables and High-Density Information
 Tables are used for rankings, asset comparisons, exchange/chain/protocol metrics, returns, market share, and team/author information. They adopt a dark-base, high-density style: headers in white or light-gray medium-bold text, row-column dividers in low-brightness thin gray, and cells usually without obvious fills; when necessary, use dark gray/deep green for light zoning.
 Number columns are right-aligned or visually aligned by decimal point; text columns left-aligned; name columns may add small icons or circular token placeholder blocks. Positive/negative values are distinguished in green/red; rankings or strength may use horizontal bars, color-block lengths, heat colors, or small dots. Summary rows or key rows use brighter text, thin borders, or a light fill — but no heavy highlight fills.
 High-density side-by-side modules use cards, column groups, text lists, or small chart collections. Each module keeps a title, a key value, and one minimal explanation; modules are separated by alignment, spacing, and thin lines — no large shadows. Zebra striping is not a primary language; extremely low-contrast dark gray may be used cautiously, and where dividers suffice, no zebra striping is added.
 If a table exceeds what one screen can scan, split it into multiple pages or focus on the Top N — do not compress it into illegibility.
 ## 9. Components and Graphic Elements
 **Brand wordmark header**: fixed at the upper left of content pages, small in size, white brand word + green "Research." Keep it on new pages; do not enlarge it into decoration.
 **Insight line component**: purple keyword/opening + gray-white explanation, located to the right of the title or atop the body column; at most one main insight per page — avoid multiple purple sentences competing.
 **Rounded brand cards**: covers, section pages, and product pages use large rounded deep-green/deep-blue cards with bright-green or purple outer frames. Content data pages do not by default frame all content in large cards.
 **Labels/badges**: used for section codes, asset symbols, button-like CTAs, or chart categories; outlined rounded rectangles or bright fills with short text. Cannot carry long sentences.
 **Thin dividers and axis lines**: low-brightness gray lines for tables, charts, and timelines; thin and restrained — no decorative thick lines.
 **Event timeline blocks**: horizontal date color blocks + event notes beneath, colored by date period or category. Suited to event lists, not numeric trends.
 **Text lists/avatar matrices**: used for contents-page authors, sponsors, exchanges, ecosystem projects, etc.; institution names are presented as text lists or neutral placeholder blocks, avatars may remain; unified sizes, alignment, and label text. Do not mix in colorful icon decoration; no graphic logos are drawn.
 **Mascot illustrations**: the Organization Name green/purple character is used on covers, section dividers, and closing pages. On ordinary data pages it may appear only on special brand/product pages, and must not cover charts.
 ## 10. Texture and Prohibited Items
 Overall flat, dark, data-driven, and restrainedly branded; content pages rely on color contrast, type-size hierarchy, chart density, and alignment — not photography, complex textures, shadows, or 3D.
 **Prohibited**: on ordinary content pages, large-area photo backgrounds, complex gradient backgrounds, 3D graphics, glowing strokes, emoji, garish illustrations, decorative colorful icons, large stretches of centered copy, heavy shadows, low-contrast gray text, unsourced charts, unit-less numbers, or decorations covering axes.
 **Use with caution**: rounded cards, large-area bright-green bases, large purple blocks, text lists, avatars, screenshot-style interfaces, donut mini-charts, zebra-striped tables. They must serve an information function or a brand-node function — never added just to fill whitespace.
 **Special pages allowed**: covers, section dividers, product pages, and closing pages may use the mascot, large rounded cards, bright-green/purple outer frames, halftone dots, trend-line backgrounds, and sponsor text lists. Even on special pages, keep the title readable and never let brand elements overshadow the main information.
 Images/screenshots are not the core language of the body; if they must be used, place them within fixed boundaries with a title and a source — no fullscreen photographic storytelling. If gradients appear, they are limited to subtle treatment of the cover title or brand atmosphere, not a body-background system.
 ## 11. Generation Checklist
 - Skeleton: is it 16:9; are content pages black-based; is there a small brand wordmark at the upper left; does the footer include the report name/copyright, sources, and page numbers?
 - Copy: is the title a clear object/metric; is there only one main insight per page; is the body in short paragraphs or bullets; do numbers carry units, time ranges, and measurement bases?
 - Hierarchy: are the title, insight line, body, chart labels, and footnotes separated by relative sizes and colors; is dependence on specific font sizes avoided?
 - Color: does it stay at black-white-gray + fluorescent green/purple + necessary data colors; are positive/negative states clearly green/red; are there too many bright colors on one page?
 - Layout: does the main chart/table occupy the largest area; does the explanation column assist the chart; is there meaningless whitespace or overcrowding?
 - Charts: are axes, units, legends, gridlines, data labels, and emphasis annotations complete; are multi-series colors distinguishable; are forecasts/baselines marked?
 - Tables: are headers, alignment, dividers, key rows/columns, and positive/negative colors consistent; is text readable; is over-compression avoided?
 - Components: do rounded cards, labels, timelines, wordmarks, and the mascot appear only on appropriate pages; do they serve information rather than decoration?
 - Prohibited items: no photo backgrounds, emoji, 3D, glow, heavy shadows, complex textures, meaningless icons, or large stretches of centered copy.
 - Quality: check overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong chart proportions, missing page numbers, missing sources, and mechanical template repetition.
 - No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions.
 - No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion.
@@ -0,0 +1,172 @@
 # F001 · Tech-Style Orange Annual Report & Business Insight Plan Proposal PPT Template STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 Suited to formal business reports such as annual performance reviews, business insights, business retrospectives, strategic plan proposals, and investor/management updates. Aimed at readers with business and data backgrounds, it presents conclusions through large titles, key numbers, charts, tables, and short explanatory paragraphs.
 Information density is moderate and restrained: white-background content pages keep generous whitespace, usually holding only one main chart or structured module with short cards beside it; table pages and roadmap pages may be locally high-density, but avoid full-bleed packing.
 - White/light-gray content pages are used for data analysis;
 - Orange is the only high-saturation primary accent, used for charts, key numbers, circular relationship diagrams, nodes, and light effects on black backgrounds;
 - Black-background pages use orange gradient light bands, concentric-circle/arc wireframes, and minimal text, for covers, transitions, quotable lines, and closing pages.
 Underlying principles:
 - **One page sets only one visual anchor.** A large title, a core percentage, a circular relationship diagram, a column chart, a donut, a table, or a quotation takes the lead — the rest is an explanation layer.
 - **Brand orange serves information hierarchy, not decorative stacking.** It is used first for data series, key rows, nodes, keywords, and important numbers; large-area backgrounds use white, near-black, or light gray.
 - **Structural clarity over information exhaustiveness.** Keep the conclusion, key metrics, and a few supporting points; complex details are split into separate pages or demoted to notes — do not fill the picture with body paragraphs and small labels.
 ## 2. Page Skeleton
 The canvas is 16:9 landscape widescreen. It uses wide margins, low-noise backgrounds, and left-right columns; the common reading path is "upper-left title → center/left main visual → right explanation cards/numbers → bottom footnotes." The main body sits in the middle of the picture with clear whitespace on all sides, avoiding edge-hugging arrangements.
 ### Cover/closing page skeleton
 - A near-black full-page background, with an orange gradient light band at the bottom or at the top and bottom edges; locally overlaid dark rectangular frames, thin-line concentric circles, or arc textures.
 - A small brand mark sits at the upper left; the main title is centered or nearly centered, may break into multiple lines, and may include slight type variations; the tagline and signature sit at the bottom or lower right, far smaller than the main title.
 - A central dark transparent frame may carry the title, but must not form a heavy border.
 ### Black-background section/quotable-line page skeleton
 - Near-black background, orange glow, text centered or nearly centered, extremely low content volume.
 - Low-contrast concentric-circle wireframes may form a focus, without competing with the text's level.
 - Does not carry complex charts, tables, or dense small type.
 ### Regular content page skeleton
 - White or very light gray-white background; the upper left is the title area, with a short note allowed under the title.
 - Charts or structural diagrams go on the left/in the middle; explanation cards, key numbers, or short paragraphs go on the right.
 - Light-gray thin lines, table lines, and timeline lines serve organization only — they are not the decorative protagonists.
 - Page numbers have no stable, prominent style and should not be force-generated; sources/footnotes use tiny gray text at the bottom or near the chart.
 ### Table of contents/navigation and watermarks
 The source file shows no strong table-of-contents page and no persistent header navigation; do not add progress bars, section navigation, page-number bars, or large watermarks by default. Section cues use black-background transition pages, not top navigation on every page.
 ## 3. Content Organization
 Titles lean toward concise business phrases, usually noun groups of 2–3 words or short topic names, such as overview, financials, revenue breakdown, timeline, product performance, next steps, etc. The tone is calm — no exaggerated questions or marketing slogans; regular-page titles sit at the upper left, while section/quotable-line pages may be centered.
 Information comes in three layers:
 - **Manifesto/quotation lines:** used for the opening after the cover, quotable lines, and closing pages; significantly larger than body text, may break into 2–4 lines, local italics allowed.
 - **Short explanatory paragraphs:** under the title or beside the chart, explaining the page's purpose, the conclusion's background, or metric meanings.
 - **Card key points:** in the right explanation area, usually 2–4 items, each a subtitle/keyword + one sentence of explanation.
 One page = 1 main conclusion + 2–4 supporting points. Lists should not exceed 4 items; timelines are most stable at Q1–Q4 or 3–4 stages; circular relationship diagrams center on 3 circles or 3 nodes. The body stays in short paragraphs, avoiding long stretches of centered layout. Keywords may be emphasized with orange text, small black capsule labels, bold sans-serif, orange numbers, or light-orange row fills.
 Percentages, currencies, quarters, years, and growth rates should stay near their corresponding figures or conclusions; main numbers are larger than body text, with units and notes smaller and adjacent. Sources, notes, and measurement bases use low-contrast gray text at the page bottom or near the chart, without breaking the main reading path.
 ## 4. Content Page Layout System
 ### A. Left title + center chart + right explanation cards
 Suited to financial overviews, revenue composition, costs and profits, and market performance. The upper left holds the title and a short lead-in, the middle holds a column chart, donut, area chart, or horizontal bars, and the right holds 2–4 light-gray explanatory cards; the chart provides evidence and the cards explain causes, actions, or impacts. Use primary-orange graphics, small black labels, and orange numbers for emphasis. If data dimensions exceed 5 groups or explanations exceed 4 items, split the page.
 ### B. Central circular relationship/capability model
 Suited to non-precise comparison content such as company overviews, capability portfolios, team composition, and strategic relationships. The main body uses 3 semi-transparent orange circles intersecting, or a single glowing circular node, with text placed at the circle centers or near the intersections; the right may hold one large percentage and a short note. This layout emphasizes relationships and combinations, and is not suited to precise numeric rankings or complex process dependencies.
 ### C. Timeline/milestone page
 Suited to quarterly results, phase progression, and key-event reviews. The left holds the title and background notes; the body separates stages with thin light-gray lines; Q1–Q4 nodes use light-orange quarter markers and light-gray event cards. Keep a single-line narrative, left to right or top to bottom. Do not expand it into a multi-project Gantt chart, and do not place multiple paragraphs at every node.
 ### D. Large chart + side-note explanation page
 Suited to profit curves, trend changes, and ranking comparisons. The large chart occupies the left half or the central main area; side notes explain peaks, inflection points, growth rates, and management implications. Area charts use deep-to-light orange tiers, bar charts use orange bars sorted by length. Side notes stay short and must not outshine the chart.
 ### E. Table comparison page
 Suited to product performance, metric comparisons, and capability checklists. Title at the upper left; the table spreads center-left or centered; a brief conclusion may sit at the right or above. Keep only key columns; key rows or key cells use light-orange fills. If there are too many details, use a summary table + notes instead of shrinking type to fill the page.
 ### F. High-density side-by-side module page
 Suited to multi-dimensional summaries such as team structure, cost distribution, and capital deployment. Multiple light-gray cards, short lists, or small number blocks sit side by side, with unified widths, row heights, and alignment baselines; each module carries one metric or one group of short text. Do not mix in too many icons, photos, or complex borders.
 ### G. Black-background mood/transition page
 Suited to covers, section breaks, strategic quotable lines, and closing thanks. The core is a near-black background + orange glow + a small amount of centered copy, usually one statement or thank-you line plus a tiny signature. Not suited to regular data pages, table pages, or small-type note pages.
 ## 5. Color System
 - **Near-black background #1D1D1D / #191919**: used for full-page backgrounds of covers, transitions, quotable lines, and closing pages. White content pages must not use near-black over large areas — only for small labels, legend dots, or high-contrast text.
 - **Main text black #111111–#222222**: used for content-page titles, key notes, table body text, and main labels; it must not be replaced by orange for long body text.
 - **Neutral gray #5B5B5B / #837571 / #A09C9A**: used for explanatory text, chart auxiliary labels, footnotes, and secondary information. Must keep contrast against the white base; not for key numbers.
 - **Light-gray backgrounds #F7F7F7 / #F1EFEF / #E9E9EA**: used for card fills, table areas, light page zoning, and information containers; area may be medium, but must not outweigh the white space. May be replaced with a same-lightness brand light gray.
 - **Divider gray #D0D0D1 / #E1DEDC**: used for table lines, timelines, card borders, and auxiliary axis lines. Thin and low-contrast — no thick black frames.
 - **Primary orange #FC7C3D / #F16736 / #FA8555**: used for column charts, donut primary series, key numbers, nodes, key words, and button-like small labels. On white pages it serves as a local main visual and must not carpet large background areas. May be replaced with a brand primary color, provided high recognizability and sufficient lightness difference are kept.
 - **Deep orange/red-orange #DC4A21 / #C22B0C / #BF5732**: used for chart high-value areas, deep area-chart layers, donut segments, and the dark parts of black-base light effects; not for long text.
 - **Light orange #FECEAA / #FDAA74 / #FCC8B3 / #FBE6DC**: used for semi-transparent circles, secondary chart series, table key rows, soft background blocks, and forecast or de-emphasized series. Area may be slightly larger than primary orange, but must stay light — never let the page turn orange-based.
 - **White #FFFFFF / near-white #F8F8F9**: used for content-page main backgrounds and reversed-white text on black pages.
 Within one page, use only orange + neutrals — do not introduce extra primary hues such as blue, green, or purple. Data series are distinguished by orange's shades and tints; no independent red-green system for positive/negative states — if positive/negative must be expressed, prefer label text and arrows/symbols, and do not add vivid green or warning red on your own.
 ## 6. Fonts and Text Hierarchy
 A modern sans-serif business style, with Liter as the main body and Archivo Black (via customFonts) for page titles, plus small amounts of light and italic faces for the cover or quotations. For Chinese, use MiSans; avoid calligraphic, handwritten, and strongly decorative fonts.
 - **Cover main title:** approx. 5–7x body text, centered, multi-line phrasing, local light or italic parts allowed.
 - **Section/quotable-line big sentences:** approx. 3–4x body text, relaxed line spacing, low word count.
 - **Content-page titles:** approx. 2.5–3.5x body text, upper-left aligned, in the Archivo Black ultra-heavy weight — the strongest visual anchor on the page, no thick strokes.
 - **Key information numbers:** approx. 2–3x body text, may be slightly smaller than the title or on par, with small unit/note text.
 - **Subtitles/card titles:** approx. 1–1.2x body text, bolded; keep them short.
 - **Body notes:** 1x, the proportional baseline; control line length and avoid full-width long paragraphs.
 - **Chart labels/table text:** approx. 0.8–1x body text; keep legible — do not shrink excessively to cram content.
 - **Notes/sources/footers:** approx. 0.55–0.7x body text, low-contrast gray.
 Text is predominantly left-aligned; black-background mood pages and the cover may be centered. Keep clear spacing between title and body; do not mix too many weights on one page — usually regular, bold, and italic suffice.
 ## 7. Chart Language
 Main chart types are column charts, horizontal bars, donuts, area/waterfall-feel trend charts, circular relationship diagrams, and a few small metric charts. Charts are simplified, with few grids and little axis decoration, highlighting orange areas and direct labels.
 - **Column charts:** mostly 2–4 columns with square or slightly rounded corners; main columns in primary orange, secondary columns in light orange. Value labels sit atop or beside the columns; small black capsules may mark key amounts/values. Axes and gridlines are extremely weak — direct labeling takes priority.
 - **Donuts:** for composition ratios, center left empty, segments in primary orange, deep orange, and light orange. Legend at the bottom or beside, using small color dots + short labels. Do not introduce too many segments — beyond 4–5 categories, recognition drops.
 - **Area/trend charts:** use deep orange, primary orange, and light orange for layering or a fading effect, annotating growth rates, inflection points, or key stages; gridlines barely visible, horizontal-axis labels short. Suited to trends and profit structures, not precise readings.
 - **Horizontal bars:** orange bars sorted by length, with short labels or values beside; keep to 3–5 bars.
 - **Circular relationship diagrams:** semi-transparent orange circles overlapping to express intersections, portfolios, and capability relationships. They are not strict data charts — do not attach precise axes or complex scales.
 Chart emphasis is achieved through color shades, label positions, and local big numbers; do not use 3D charts, heavy shadows, dimensional pie charts, rainbow series, dense gridlines, or complex legends.
 ## 8. Tables and High-Density Information
 Tables serve "management comparison" and "metric summaries" — they are not detail databases. Headers are light-gray or white with bold black text and short column names; the body uses black/dark-gray text. Text columns left-aligned, numbers and percentages neatly aligned, numeric columns may be centered or right-aligned.
 - Dividers use light-gray thin lines; avoid thick black borders and fully enclosed heavy frames.
 - Row heights are relaxed, with obvious whitespace around the table — not edge-to-edge.
 - Key rows, key cells, or the current item use light-orange fills, with restrained emphasis area.
 - A pale-gray base may carry the table area, but do not cover the whole table with a high-saturation fill.
 - Zebra striping is not a strong feature and may be omitted; if used, only extremely light gray alternation.
 - Summary/conclusion rows may be bolded or given light-orange fills, but no complex multi-level headers.
 High-density side-by-side information uses light-gray cards, short lists, quarter nodes, and metric blocks. Blocks keep unified sizes and alignment, with short titles and explanations within one sentence. Symbols use small black dots, small color dots, thin lines, and short labels — no large sets of colorful icons or emoji.
 ## 9. Components and Graphic Elements
 - **Small black capsule labels:** mark key amounts, chart highs, or small categories; reversed-white text, small area. They should not pile up in groups across the page.
 - **Light-gray explanatory cards:** used for right-side explanation lists, timeline events, and supplementary notes; light-gray fill with no obvious shadow, containing a subtitle and one sentence. Keep the count to 2–4.
 - **Orange circles/semi-transparent circles:** used for relationship models, nodes, and key visuals; they may overlap into intersections, but text must stay readable. Do not turn the circles into complex bubble charts.
 - **Thin dividers/timelines:** used for stage separation, table rows and columns, and layout zoning; light colors, thin lines.
 - **Ring/concentric-circle wireframes:** used on black-background transitions, tech-feel pages, or a few centered-visual pages; low contrast, never the main body of an infographic.
 - **Orange light bands/glow:** only for black-background covers, section pages, closings, and other mood pages. White content pages use no large-area light effects.
 - **Title bars/navigation:** no persistent header navigation has been established and must not be forced onto every page. The title itself is the primary navigation.
 - **Image frames:** only a slight tendency toward placeholder rectangles/gray blocks is seen — this is not a photo-driven style. If images are used, keep them restrained rectangular aids that never seize the level of charts and text.
 ## 10. Texture and Prohibited Items
 Overall flat, restrained, and businesslike; black-background pages may use subtle tech light effects, while content pages rely on typesetting, whitespace, charts, and orange emphasis.
 Prohibited:
 - 3D charts, dimensional pie charts, perspective columns, glowing stroked text, strong drop shadows, metallic textures, large glassmorphism components;
 - rainbow palettes, mixed multi-brand colors, emoji, cartoon illustrations, hand-drawn arrows, exaggerated icon stacking;
 - large stretches of centered body text, full pages of dense small type, complex multi-layer borders, heavy table lines;
 - large-area image backgrounds or black-background small-type tables on regular data pages.
 Use with caution:
 - Gradients: only for black-base orange glow, soft area-chart layering, and light-orange transitions; never full-page colorful gradient backgrounds.
 - Shadows: the source file does not rely on shadows; if hierarchy must be distinguished, use only extremely subtle shadows or switch to light-gray fills.
 - Rounded corners: may lightly soften cards or columns, but this is not a heavy rounded-card style.
 - Icons: if they must be used, only minimal line icons or small symbols, in black/gray/orange — no multi-colored icons.
 - Photos/screenshots: may serve as auxiliary evidence or placeholders, but are not the core language; they need rectangular cropping, low decoration, and no full-bleed backgrounds.
 Special pages may use black-base light effects, concentric circles, low-contrast tech wireframes, centered quotable lines, minimal italics, and reversed-white text — only for covers, sections, quotations, and closing pages.
 ## 11. Generation Checklist
 - Skeleton: is it 16:9; are content pages white/light-gray-based, and covers/transitions near-black + orange light effects; are margins sufficient?
 - Copy: are titles phrasal; does each page have only 1 main conclusion; is explanation controlled to short paragraphs or 2–4 cards?
 - Hierarchy: do the title, main number, body text, and footnotes have clear relative proportions; are specific font-size dependencies and hierarchy confusion avoided?
 - Color: only orange + neutrals used; is orange used for emphasis rather than flooding the page; is low-contrast gray text still readable?
 - Layout: is there a clear reading path; do the main visual, explanation area, and footnotes each do their job; are multiple competing anchors avoided?
 - Charts: are simplified columns/donuts/area charts/horizontal bars/circular relationship diagrams used; are 3D, rainbow colors, dense grids, and complex legends avoided?
 - Tables: are the header, rows and columns, and key rows clear; are lines light and thin; are numbers aligned; is detail overload avoided?
 - Components: do light-gray cards, black capsules, orange nodes, and thin lines serve information; were page numbers, navigation, and watermarks never force-added?
 - Prohibited items: no emoji, cartoon illustrations, heavy shadows, complex decoration, large image backgrounds, thick borders, or glowing text.
 - Quality: check for text overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong proportions, and an overly repetitive template feel.
@@ -0,0 +1,128 @@
 # Civic Brief · Public Service Brief STYLE DESIGN SYSTEM
 > Intended homepage tag: Work report
 > Visual metaphor: civic wayfinding system + public-service operations brief
 ## 1. Style Positioning
 Suitable for quarterly reviews, public-service operations, project progress updates, cross-department reports, and grassroots work summaries. Pages should feel like a clear, trustworthy civic wayfinding system: a warm-white base, deep indigo text, sky-blue routes, and sparing safety-yellow cues, using stations, routes, numbers, and statuses to make clear "what was done, what worked, and what to change next."
 Underlying principles:
 1. A work report leads with the operating conclusion, then gives evidence on coverage, efficiency, problems, and actions.
 2. Wayfinding language must carry location, sequence, responsibility, or status; it must not degrade into decorative icons.
 3. One page carries only one management question and highlights at most 3 numbers or actions.
 4. Achievements, problems, and pending decisions use distinct but stable visual semantics.
 5. Do not imitate government official documents, emblems, or the red-and-gold ceremonial style; do not manufacture a false sense of authority.
 ## 2. Page Skeleton
 The canvas is 16:9 landscape. Content pages are predominantly warm white; section divider or conclusion pages may use deep indigo. Pages keep wide safe margins; a narrow "route number strip" may run down the left side, with the title, quarter, and page number at the top, and data-definition, measurement-basis, and responsibility information at the bottom.
 The title zone takes 15%–20%, the main work area 65%–72%, and the footer 6%–8%. Do not use a thick horizontal bar under the title; locate it instead with a short blue line segment or a station number.
 The cover uses "a large title + one service route + 3 key stations." Content pages switch among the coverage map, demand band, operating route, problem diagnosis, and action list; avoid repeating a three-column card layout on every page.
 ## 3. Content Organization
 Titles use management conclusions, for example "Demand is now covered district-wide, but Monday morning remains the most pronounced congestion point." Subtitles state the region, period, audience, and data definition or measurement basis.
 Each page is organized as "current state — evidence — implication — next step." Achievements must state what they mean for the people served; problems must be linked to a cause or the accountable process step or owner; actions must carry a deadline, an owner, or acceptance criteria.
 Numbers sit next to their corresponding station, process, or population, and must keep units, period, and denominator. Do not compare visit counts, ratios, and percentage points on the same scale.
 ## 4. Content Page Layout System
 ### A. Operations Overview Page
 Use one horizontal service line to connect the 4 nodes of coverage, processing, resolution, and feedback. Each node holds only one primary number and one judgment; the end of the line gives the overall assessment for the quarter. Suited to the opening; do not build a KPI card wall.
 ### B. Coverage and Foot Traffic Page
 Place a simplified district map or service-point network on the left, and the foot-traffic structure and peak hours on the right. The map only conveys hubs, mobile stations, and pressure points; do not fabricate precise geographic boundaries.
 ### C. Demand Composition Band
 Use a horizontal band whose width varies with share to show the main service types; below it, use 2–3 direct annotations to explain where demand concentrates. Merge minor categories into "Other" to preserve the primary–secondary hierarchy.
 ### D. Service Process Page
 Treat resident arrival, ticket pickup, case handling, transfer, and completion as one continuous path. Times or pass rates appear above the nodes, obstacles below. Draw connecting lines before the nodes; lines must not cross text.
 ### E. Problem–Responsibility Page
 The left side lists three problems with their evidence; the right side links each problem to material, system, or coordination responsibility. Use safety yellow for matters needing attention; reserve vermilion orange only for issues that genuinely block service.
 ### F. Next-Quarter Action Page
 Use 3 action routes to present "action / owner / deadline / acceptance criteria"; list items requiring leadership sign-off separately in the bottom-right corner. End with a clear work decision rather than a generic thank-you page.
 ## 5. Color System
 - Warm white #F5F2EA: main background of content pages.
 - Deep indigo #17324D: titles, body text, section dividers, and the main route.
 - Sky blue #3D8CC9: normal operation, primary routes, and key data.
 - Safety yellow #F2C14E: points of attention, waiting states, and matters pending coordination.
 - Service green #4D8B72: completed items, effective pilots, and stable states.
 - Vermilion orange #D95D39: blockages, complaints, and issues that must be escalated; area strictly limited.
 - Road gray #A8AFB5: secondary lines, baselines, and sources.
 A single page typically uses indigo plus one status color. Red and green must not be the only differentiator; they must be paired with text or symbols. Large red backgrounds, blue-violet gradients, and five-color status lights are forbidden.
 ## 6. Typography and Text Hierarchy
 Use MiSans for Chinese and Liter for English; numbers, codes, and times may use JetBrains Mono (brought in via customFonts). No more than two font-family roles across the deck.
 - Cover title: 4–5x body size, at most two lines.
 - Page title: 2–2.6x body size, left-aligned.
 - Primary numbers: 3–4x body size, with the unit immediately adjacent.
 - Action headings: 1.2–1.5x body size.
 - Body text: 1x, in short sentences.
 - Footers, data-definition and measurement-basis notes, and route codes: 0.6–0.75x, but must remain legible.
 Hierarchy relies primarily on font size, weight, and position — not colored rounded backing boxes. Never shrink a title into small text to fit a long sentence; trim the copy first.
 ## 7. Chart Language
 Prefer service-route diagrams, directly labeled bar charts, time-heat bands, dot plots, slope charts, simplified coverage networks, and 100% stacked bars.
 Use sky blue or service green for normal operation, safety yellow for pressure points, and vermilion orange only for severe blockages. Gridlines are extremely thin gray lines; chart titles must state the finding.
 Time and ratios must not share the same axis. State percentage-point changes explicitly as "percentage points"; do not write them as percentage growth. Every chart must indicate its period, sample definition, and sampling basis.
 ## 8. Tables and High-Density Information
 Tables are used only for service-center comparisons, problem lists, and action ledgers. Headers use deep indigo text with a thin bottom rule; leave breathing room between rows; do not use closed heavy borders.
 Status is expressed jointly by small squares, short labels, and text; problem rows may get a safety-yellow left marker, and vermilion orange is reserved for overdue or blocked rows. Owner, deadline, and acceptance criteria must sit on the same reading line.
 If a table exceeds 6 columns, prefer splitting it into "a main-conclusion chart + a condensed ledger"; do not cram the full backend table into one page.
 ## 9. Components and Graphic Elements
 Stable components include route lines, station dots, service numbers, directional arrows, status squares, short ticks, district outlines, and responsibility tags.
 Station size indicates hierarchy, not arbitrary aesthetics; line styles distinguish normal, pilot, and not-yet-connected routes. Keep the icon count low; use only clear public-service line symbols.
 Photos are not a default element. If a service-scene photo is used, place a single documentary crop and label whether it is illustrative or a real source; do not use staged stock-photo collages.
 ## 10. Texture and Prohibited Items
 The overall feel is a modern urban-service operations brief: restrained, clear, accountable to the public. The visual center of gravity is routes and actions, not decoration.
 Prohibited: red-and-gold government templates, fake badges and seals, leadership-speech-style covers, KPI card walls, rounded SaaS panels, cartoon characters, rainbow icons, 3D maps, dial gauges, full-page slogans, and reporting achievements without problems.
 ## 11. Generation Checklist
 - Does each page first state one operating conclusion or management question?
 - Do coverage, efficiency, problems, and actions form a complete review chain?
 - Do all routes, stations, and statuses carry business meaning?
 - Do numbers carry period, unit, denominator, and correct percentage-point phrasing?
 - Are problems linked to accountable process steps or owners, and do actions carry owners and acceptance criteria?
 - Are colors supplemented with text/symbols to avoid relying on red-versus-green alone?
 - Is the stable grammar of warm white, indigo, and a single status color maintained?
 - Are official-document imitation, card walls, dashboards, and empty achievement slogans avoided?
 - Have overlap, cropping, line wrapping, low contrast, garbled characters, and undersized footers been checked?
 - No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution
 - No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion
@@ -0,0 +1,187 @@
 # Report Name STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 An editorial-style research-report PPT aimed at readers in travel, hospitality, destinations, and industry decision-making. It organizes "viewpoint — evidence — explanation" with a magazine reading experience: travel/hotel scene photography sets the context, light blue and deep navy blue form the report interface, and paragraphs, expert quotes, survey data, and chapter narratives advance in alternation. It is neither a sales-oriented presentation nor a pure data dashboard.
 It employs a landscape widescreen canvas, a brand-custom low-ornamentation sans-serif typeface, brand colors of deep blue/bright blue/light report blue, large rectangular photos and color blocks, an understated footer, oversized Part numbers with half-screen photography on section dividers, a contents page of list items with jump arrows, blue-violet graphics, and hairline-separated data pages. Relatively high information density is allowed, but clarity is maintained through rectangular zoning, wide margins, title hierarchy, and photographic whitespace.
 Underlying principles:
 1. **Scene first, information embedded**: use real travel/hotel photos to build the scene; place text, quotes, and data on separate color blocks or white cards, avoiding laying them directly on complex photos.
 2. **Brand blue serves reading, never steals it**: deep blue is used for the highest emphasis and reversed-out zones, light blue carries long text and chapter base plates, and bright blue is used only for navigation, labels, and small-area accents; body readability must not be reduced.
 3. **Publication consistency beats page showmanship**: photos, two-column layouts, tables, and charts may vary, but title position, footer, rectangular zoning, typographic hierarchy, and the cool blue palette must stay consistent across the deck.
 ## 2. Page Skeleton
 - **Canvas ratio**: a uniform landscape widescreen report page, close to PDF/magazine typesetting; do not use big-type, wide-whitespace presentation templates. Keep visible outer margins; content never touches the page edge.
 - **Base margins**: content pages keep a stable white or light-blue border on all four sides; left, right, and top margins preserve the magazine feel, and the bottom margin reserves room for the footer, report name, or page number. Large images may approach the edge of the content area but must not break the safe boundary.
 - **Title zone**: body titles sit at the top-left or top, using short question sentences, chapter names, or conclusive short sentences; section-divider titles may occupy the left half of the screen or a large light-blue field; cover titles are set in a deep-blue info card overlaid on a photo. Layering is achieved only through font size, position, background color, and horizontal rules.
 - **Body zone**: organized on a rectangular grid — commonly left/right two columns, upper/lower two bands, photo + text card, deep-blue sidebar, a full light-blue base plate, and multi-column text/chart combinations. Separate blocks with whitespace or hairlines; do not stack floating elements.
 - **Header**: regular content pages have no complex header navigation; chapter information blends into the title or footer as small text. Do not add a persistent top navigation bar.
 - **Footer and page number**: the bottom of content pages stably carries the brand-insight mark, report name, and page number. The type is clearly smaller than body text, in deep blue/gray-black; the page number sits near the bottom edge and does not compete with the main charts for attention.
 - **Logo**: an identity mark appears at the top-left of the cover, rendered as small plain text (write the new topic name), with no graphic logo drawn; interior pages de-emphasize it via small footer text or brand information; the back cover/closing page may strengthen the brand wordmark. Do not place a large logo on every page.
 - **Contents navigation**: a narrow blue-gradient/abstract curved-surface graphic on the left + a contents list on the right. Entries consist of the chapter name, a numeric page number near the start or in a left-side column, and a "↗" on the right/at the trailing end; entries are separated by hairlines.
 - **Divider lines**: thin gray/light-blue lines are used in the contents, between columns, in tables, for quote attributions, and in data lists; they are hairline-weight and low-contrast, not decorative heavy borders.
 - **Watermarks and background graphics**: light-blue section dividers may use very faint arc/curve shading; deep-blue pages may use low-contrast textures or linear backgrounds. These serve only as background and must not impair legibility of body text and photos.
 - **Default reading path**: top-left title or Part number → main photo/dark emphasis zone → body text or charts → footnotes and footer. Two-column layouts read left to right, top to bottom; in photo + sidebar layouts, the photo comes first, followed by key data or a quote.
 ## 3. Content Organization
 - **How titles are written**: the cover uses a main title + subtitle + series/brand label; the contents page lists chapters; section dividers use "Part X" + one sentence of chapter theme; body pages use question sentences or clear topic sentences. Be specific and readable; no exaggerated marketing slogans.
 - **Information sentences**: viewpoint and quote pages may use full report-style paragraphs rather than being chopped into many clipped slogans. Highlighted sentences use oversized quotation marks, a light-blue quote box, or a deep-blue reversed-out zone.
 - **Body organization**: short paragraphs, narrow line lengths, and clear paragraph spacing; foreword/methodology pages may be densely set in 2–3 columns. Do not stretch long paragraphs across the full page width.
 - **Grouping logic**: the deck is divided into chapters by Part; each page is organized as "topic title — explanatory paragraph — photo/quote — data or list." Every page revolves around one main question; no unrelated topics are mixed in.
 - **Number of viewpoints per page**: a regular content page carries 1 main viewpoint, optionally accompanied by 1 expert quote or 1 set of data; a data-composite page may juxtapose 2–4 metrics/charts, but they must share the same question, definitions, and measurement basis.
 - **How bullet points are written**: prefer short headings, percentages, hairline separators, icons/small markers, or side-by-side cards — not traditional large bullet dots; keep items similar in length and avoid any single item growing into a long paragraph.
 - **Keyword emphasis**: use bold, color blocks, font size, position, and enlarged data; use in-text color highlighting sparingly. Italics are used only for report names, quote sources, or tonal emphasis — never over large areas.
 - **Number/unit/time basis**: percentages, years, sample sizes, and their explanations stay adjacent; large numbers must come with a short explanation of their definition and measurement basis. Units are set smaller than the number but must remain legible.
 - **Source footnotes**: chart sources, survey sample definitions, and methodology notes are placed below the chart, at the bottom of the page, or at the bottom of a sidebar; low-contrast but clear, and not to be confused with the footer.
 ## 4. Content Page Layout System
 ### A. Large Photography + Deep-Blue Info Sidebar
 Used for expert viewpoints, key findings, ranked lists, and percentage data. One side holds a travel/hotel scene photo; the other side is a deep-navy rectangular sidebar set with white text, thin light-blue lines, small icons, or a percentage list. The key point goes at the top; a quote may open with oversized quotation marks, with the attribution at the bottom.
 It carries 1 quote or 4–6 short data items; the photo and sidebar must not overlap each other. If the text needs a long-form explanation or a complex table, do not use this layout.
 ### B. Light-Blue Base Plate + Photo/Text Two Columns
 Used for chapter openers, personal quotes, longer explanatory passages, and methodology notes. Light report blue serves as a full-page base plate or a half-page carrier layer, with a photo on one side and title, paragraphs, and attribution on the other; text is deep blue/near-black, with a divider line separating the attribution from the body.
 Emphasis comes from large titles, left alignment, and light-blue space. If the page contains multicolored data charts, reduce the light-blue area or switch to a white background to avoid color mixing.
 ### C. White Report Page + Multi-Column Body
 Used for forewords, introductions, methodology, and explanatory chapters. A large title goes at the top or top-left; the body is set in 2–3 columns, optionally flanked by a portrait photo, a light-blue author info box, or a small note card; columns are separated by whitespace or hairlines.
 Keep column width under control; avoid full-width long lines. This layout is not suited to emotional chapter transitions, nor to presenting large numbers that need strong visual impact.
 ### D. Section Divider: Oversized Part Number + Half-Screen Photography
 Used to separate chapters. An oversized "Part X" sits on a light-blue field on the left or upper layer, with the chapter theme sentence below; the right side or half of the screen carries a portrait/travel-scene photo. The light-blue field may include very faint curves.
 It serves only navigation and chapter atmosphere — no complex body text, charts, footnotes, or multiple viewpoints. The Part number is clearly larger than the chapter theme.
 ### E. Data-Composite Page: Topic Explanation + Multiple Charts/Metrics
 Used for survey results, investment directions, and preference comparisons. The top holds the topic title and a brief description; the body divides into a chart zone, a numeric-metric zone, and an explanatory-text zone. Common elements include donut charts, bar lists, percentage cards, and small icon lists, colored mainly in blue-violet and deep blue.
 Emphasis comes from large percentages, white text on deep-blue grounds, and bright-blue/purple series colors. If the data definitions or measurement bases are complex or annotations are numerous, split the page or convert it into a table/methodology page.
 ### F. High-Density Parallel-Module Page
 Used for horizontal comparison of multiple findings, multiple markets/segments, or multiple strategic dimensions. Use 2–4 equal-width cards or columns, each containing a subheading, a short paragraph, a number, or a small chart; align strictly, organize with light divider lines, and alternate background colors between white and light blue.
 Not suitable for large emotional photos; photos may appear only as small thumbnails to aid classification. All modules must share the same grammar, or the report's consistency breaks.
 ## 5. Color System
 - **Deep navy blue #000735 / #020D3E / #051954**: used for cover info cards, deep-blue sidebars, emphasis zones, the back cover, dark chart backgrounds, and title text; area can range from small labels to half-page/full-page dark blocks. It may be replaced with another brand dark color, but white text must keep high contrast, and the color must not shift so gray or black that its blue identity is lost.
 - **Light report blue #C6D4F9 / #C7D5FA**: used for section-divider base plates, quote-page backgrounds, methodology/note boxes, light table fills, and large carrier layers — up to half a page or even a full page. It may be replaced with a low-saturation brand light color, but it must stay cool-toned with sufficient lightness.
 - **Bright brand blue #1E77F8 / #3781F9 / #5D8DF4**: used for the abstract graphic on the left of the contents page, labels, small accents, link-styled arrows, and chart series colors; it serves only as small-area guidance. It must not be spread over large areas in place of light blue, or the result becomes overly tech-flavored and loses the magazine feel.
 - **White #FFFFFF / near-white #F1F3FA**: used for content-page backgrounds, cards, chart backgrounds, and whitespace areas; text on them is deep blue or near-black.
 - **Primary text near-black-blue #030208 / #07090F / #2B3A5C**: used for body text, titles, table text, and chart labels. Light gray must not be used as the primary body color.
 - **Neutral gray #8D92A1 / #9FA0A9 / #B3B6C3**: used for divider lines, auxiliary labels, axes, footnotes, and non-essential information; small in area, low-contrast but discernible. It must not carry critical information.
 - **Photo warm tones #A87C39 / #C06712 / #CB9742 / the tan-brown family**: these come mainly from travel/hotel photography and are not system primary colors; they may only echo a chart or local accent in small amounts — do not promote them to primary brand colors.
 - **Purple/blue-violet auxiliary colors**: used for a small number of chart series, key metrics, or comparison groups; their area is controlled and must not compete with bright blue and deep blue at the same time.
 Each single page centers on the blue family; apart from the natural colors of photos, system colors should number no more than 2–3 hues. Positive/negative states are explained first through light/dark contrast, label text, arrows, or legends; introduce red and green cautiously, and never use highly saturated red-green combinations that break the report's cool tone.
 ## 6. Typography and Text Hierarchy
 Use a modern sans-serif typeface: Liter (Chinese: MiSans). Regular accounts for the overwhelming majority; Bold is used sparingly for titles/emphasis, Regular Italic for report names or quote emphasis, and Medium/Light only rarely. Regular weight dominates; avoid over-bolding.
 - **Cover main title**: 3.5–4.5x body size, set inside the deep-blue info card or in a clearly defined area above the photo; line spacing tight but not crowded.
 - **Cover subtitle / series label**: the subtitle is 1.5–2x body size; the series/label is 0.7–0.9x body size, often set inside a bright-blue or light-blue bar.
 - **Section-divider Part number**: 4–6x body size, in a light or regular weight — it need not be bold.
 - **Chapter theme sentence**: 1.6–2.5x body size, left-aligned, breaking naturally across multiple lines.
 - **Content-page title**: 1.5–2.2x body size, usually in regular weight; short titles may be enlarged. Do not use overly heavy titles that create a commercial-poster feel.
 - **Body text**: 1x; generous leading with clear paragraph spacing.
 - **Subheadings / card titles**: 1–1.2x body size, may be Bold or Medium.
 - **Chart labels / table text**: 0.75–0.95x body size; key numbers may be enlarged to 1.5–3x.
 - **Quote text**: long quotes are 1–1.2x body size; quotation marks may be enlarged to 2–3x and set in deep blue.
 - **Notes, sources, footers, page numbers**: 0.55–0.75x body size, understated but clear. Footnotes must not become too small to read.
 Text is left-aligned by default. Except for localized areas of the cover info card, do not use large blocks of centered copy. Titles may use title case or sentence case, but the same level must be uniform.
 ## 7. Chart Language
 Charts are evidence components embedded in the report narrative, not dominant dashboards. Styles include donut/ring percentages, bar/ranking lists, multi-metric cards, small icon lists, tabularized comparisons, and a small number of coordinate charts.
 - **Chart types**: prefer percentage rings, horizontal bars, ranking bars, metric cards, simple columns/lines, and comparison tables. Avoid complex interactive dashboards, radar charts, 3D pie charts, and line charts with too many series.
 - **Axes and gridlines**: use light-gray/light-blue low-contrast lines; gridlines only aid reading. Axis labels are smaller than body text, in neutral gray or deep blue.
 - **Labels and legends**: label values directly near the graphic wherever possible and minimize distant legends; keep percentages close to their metric names; legend swatches are small and tidy.
 - **Series colors**: use deep blue, bright blue, light blue, and blue-violet, and control the number of series per page. Photo warm tones do not enter regular data series unless they echo local content.
 - **Key data**: use large numbers, white text on deep-blue grounds, thick lines, or high-saturation blue-violet. Do not stack multiple emphases such as shadows, exploded pie charts, and fluorescent colors at the same time.
 - **Forecast/target/baseline lines**: use thin dashed or thin solid lines with short labels. Do not add complex gradient fills.
 - **Annotations**: use white cards or light-blue boxes with thin lines, and use arrows sparingly; they must not obscure the chart's primary readings.
 Keep charts few and refined; if the amount on one page cannot be grasped quickly, split the page or move it to an appendix table.
 ## 8. Tables and High-Density Information
 Tables are used for methodology, sample descriptions, market/metric comparisons, and condensing high-density information. They use light borders, subtle background tints, and report-style typesetting — not the default heavy grids of office software.
 - **Header**: use light blue, near-white, or white-on-deep-blue; text may be slightly bolded, at a size close to body text or slightly smaller; keep sufficient height and whitespace.
 - **Row/column structure**: allocate column widths by content function; the left side usually holds categories/dimensions and the right side values or explanations; separate with hairlines or whitespace.
 - **Divider lines**: use thin light-gray/light-blue lines and avoid heavy all-black borders. Horizontal rules are more common than vertical ones; keep vertical separators only when strong comparison is needed.
 - **Background fills**: use white, light blue, or subtle zebra striping; zebra striping must be low-contrast and only aid scanning.
 - **Key rows/columns**: highlight with deep-blue text, a light-blue fill, bold, or a small label. Do not fill large areas with highly saturated colors.
 - **Summary rows**: distinguish with a slightly deeper light-blue fill or a thin rule above — not heavy borders.
 - **Number alignment**: right-align or decimal-align percentages, amounts, years, and the like; left-align text; units follow the number immediately or move into the column header.
 - **Symbol markers / rating dots**: small dots, checkmarks, arrows, or short labels may be used, staying within a monochrome blue/gray system. Colorful icons are not the default table markers.
 Keep titles, descriptions, and footnotes; do not let the table fill the entire page. Tables compress evidence; they do not replace narrative.
 ## 9. Components and Graphic Elements
 - **Deep-blue info card / sidebar**: used for key conclusions, quotes, and data lists; white text and thin light-blue lines inside, no shadows; well suited to sit alongside photos.
 - **Light-blue carrier box**: used for long quotes, chapter themes, explanatory paragraphs, and methodology information; text is deep blue/near-black; it may have no outline, with zones defined by color blocks and whitespace.
 - **Cover title card**: a deep-blue rectangular card overlaid on the photo, optionally with a bright-blue/light-blue label strip on top; right-angled, positioned right-of-center or center-right, avoiding covering people's faces.
 - **Contents entries**: composed of page number, chapter name, hairline separator, and "↗"; may be used sparingly for navigation, but should not flood every list in the body.
 - **Oversized quotation-mark component**: used for expert quotes or viewpoint excerpts; the quotation marks are deep blue or white and significantly larger than body text; the paragraph follows, with the attribution at the bottom.
 - **Percentage / metric list**: each item contains a small icon or short label, a percentage, and explanatory text; items are separated by hairlines or whitespace; suited to deep-blue sidebars or white cards.
 - **Image frame**: rectangular, right-angled crops, often occupying half a page or a large area; subjects are people, hotels, nature, transport/travel scenes. Separated from text by straight edges, with no photo-frame shadows.
 - **Abstract blue curved surfaces / curves**: the contents and section-divider pages may use blue-gradient curved surfaces or faint lines; these are for chapter/navigation atmosphere only, not decoration on every page.
 - **Hairline dividers**: low-contrast, with lengths following the width of the content block; never full-page heavy decorative lines.
 ## 10. Texture and Prohibited Items
 The overall texture is flat, restrained, and editorial-magazine-like, with pages organized through photography, rectangular color blocks, typographic hierarchy, and the blue system.
 **Prohibited**:
 - 3D charts, perspective text, glowing outlines, neon effects, complex textures, heavy shadows, and glassmorphism.
 - emoji, cartoon stickers, large numbers of colorful icons, and social-media-style emoticons.
 - Large blocks of centered copy, poster-style slogan stacking, and full-page unstructured oversized text.
 - Laying long body text directly over complex photos, or covering the people/scene subject with low-contrast text.
 - Using highly saturated red, green, or yellow as large-area status colors that break the blue report system.
 **Use with caution**:
 - Gradients: limited to contents-page abstract graphics, blue curved surfaces, or extremely subtle backgrounds; not for buttons or large-area body grounds.
 - Shadows: the source style barely relies on shadows; if a white card must be distinguished, use only a very light drop shadow or switch to whitespace/background color.
 - Rounded corners: the source files are dominated by right-angled rectangles; rounded corners must not become a system feature.
 - Icons: small monochrome line icons may be used in data lists; large colorful icons are unsuitable.
 - Illustration: not observed as a core language; it must not replace real photography.
 **Allowed on special pages**:
 - Large-area photographic backgrounds may be used on covers, section dividers, closing pages, or a few emotional transitions; long-text body pages should not use full-image backgrounds.
 - Abstract blue-gradient shapes may be used on contents or navigation pages; ordinary content pages should be restrained.
 - Full-page or half-page deep blue may be used to emphasize conclusions/quotes/the back cover, but content volume must be small and reversed-out text must remain legible.
 ## 11. Generation Checklist
 - Skeleton: is it a uniform landscape widescreen? Are outer margins and the bottom footer preserved? Are the title zone, body zone, and footnote zone clearly divided?
 - Copy grammar: are titles concrete topics/questions/chapter sentences? Does each page carry only one main viewpoint? Are paragraphs too long or stretched too wide?
 - Hierarchy: are the relative sizes of cover, Part, content-page titles, body text, chart labels, and footnotes clearly defined? Is Bold being overused?
 - Color: is the core palette deep blue, light report blue, bright blue, and white/near-black? Are there too many system colors on one page? Is text contrast on dark grounds sufficient?
 - Layout: are photos, text, and charts aligned to the rectangular grid? Is there any random floating, covered faces, or inconsistent margins?
 - Charts: are charts simple and readable? Are percentages and their definitions and measurement bases adjacent? Are legends, axes, and gridlines understated? Is there any 3D or excessive decoration?
 - Tables: are headers, rows/columns, divider lines, number alignment, and footnotes standardized? Are heavy black grids or highly saturated fills used?
 - Components: do deep-blue sidebars, light-blue carrier boxes, contents arrows, quotation marks, and metric lists carry information rather than mere decoration?
 - Prohibited items: are emoji, complex illustrations, large colorful icons, strong shadows, glows, 3D, complex textures, and large blocks of centered copy avoided?
 - Readability: are there problems such as overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong image aspect ratios, or the footer pressing into the body?
 - Consistency: pages may vary, but do they still keep the blue system, footer, right-angled rectangles, left alignment, and the report-magazine character? Avoid making each page an unrelated template.
 - No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution
 - No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion
@@ -0,0 +1,170 @@
 # Organization Name AR 23 24 · Annual report 2023 24 STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A landscape report-style PPT for listed-company annual reports, investor relations, ESG and governance disclosure, financial notes, and audit statements. It serves investors, boards, regulators, and internal management, emphasizing long-form reading, quick navigation, reviewability, and traceability. Body text, tables, footnotes, and charts are organized with a warm off-white paper background, a stable grid, small-size dense typesetting, QuattrocentoSans/Unna, black-gray text, thin gray lines, and a small amount of golden brown. Photography is used only on the cover, contents/section pages, or a few brand pages; body pages are dominated by multi-column text, data metrics, donut/column charts, wide tables, and governance matrices.
 Underlying principles:
 - **Disclosure reading beats visual performance**: titles, body text, data, footnotes, and sources must read continuously along the grid; decoration, images, and color blocks must not break the review path.
 - **Low-saturation consistency beats strong stimulation**: the deck is dominated by off-white, black-gray, light gray, and golden brown; only the black back cover, photography pages, and necessary charts may show stronger contrast.
 - **Information is layered through position, size ratios, lines, and whitespace**: use few large-area color modules and no strong shadows or complex graphics; high-density pages organize information through column widths, hairline dividers, subheadings, and table headers.
 ## 2. Page Skeleton
 - **Canvas ratio**: a landscape widescreen report page, close to 16:9; treat it as a "printable annual-report page," not a stage-presentation page.
 - **Default background**: the entire body page is warm off-white, approximately `#FBF9ED`; textures, gradients, or patterns are generally not layered onto the background.
 - **Margins**: stable whitespace on all four sides; the top margin holds a small chapter/report mark, the bottom margin the page number and report name; the body is inset as a multi-column grid.
 - **Header**: the top-left commonly shows a three-short-bars/chapter-name mini navigation; an "Annual Report 2023/24"-style report mark sits at the top center or top-right; extremely small and low-contrast.
 - **Footer and page number**: a small page number, page name, or report information sits at a bottom corner, in black-gray or light gray. The footer must be light and must not compete with the body for attention.
 - **Title zone**: the title sits at the top-left or upper left; body pages use short report-style titles, while chapter/contents pages may overlay photography or sit alongside it. Data or text follows the title directly, with no exaggerated decoration.
 - **Body zone**: a 2–4 column grid. Text pages use equal-width multi-column; data pages put key metrics on the left and explanations/charts/tables on the right; wide tables occupy the lower-middle of the page or a large zone on the right.
 - **Divider lines**: thin lines are used between columns, in tables, footnotes, metric zones, note boxes, and chart baselines; light gray/medium gray, with restrained weight.
 - **Logo**: the identity mark (small plain text spelling the report name; no graphic logo is drawn) appears mainly on the cover/back cover or a few brand positions. Body pages must not enlarge the logo on every page — at most it appears as extremely small report information.
 - **Navigation**: the contents page is composed of chapter titles, entries, and page numbers; section pages may use a large image + a contents-style list. Body pages keep only a light header — no colorful progress bars.
 - **Watermarks/background graphics**: body pages have no stable watermark; circular product/brand thumbnails or photos appear only as elements on a few pages.
 - **Default reading path**: top-left header/chapter and title → key metrics on the left or the first body column → left to right, top to bottom → charts, table notes, and footer sources.
 Page-type skeletons:
 - **Cover**: a full-page or large-area interior/product photograph with an oversized title overlaid slightly left of center, white text at high contrast, and the identity mark at the bottom (small plain text spelling the report name; no graphic logo is drawn).
 - **Contents page**: a vertical photography column on the left carrying an overlaid title, and a off-white zone on the right holding a multi-column contents list; chapter titles are bold, entries are small, and page numbers are right-aligned.
 - **Body report page**: off-white background, light header and footer, top-left title, multi-column text/charts/tables.
 - **Chapter/Notes page**: photography or a tonally unified image on the left, and a contents-style entry list on the right.
 - **Back cover / special closing page**: may use a black background with a white identity mark (small plain text; no graphic logo is drawn); this is a special page and must not be applied to body pages.
 ## 3. Content Organization
 - **How titles are written**: short, objective, report-style — such as overview, outlook, region names, governance topics, audit/notes titles. Avoid marketing slogans, long question sentences, and overly emotional wording.
 - **Information sentences**: 1–3 lines of description or summary may sit under the title; do not make a large block of centered copy the main body of a content page.
 - **Body organization**: use short paragraphs, subheadings, and necessary bullets. Long financial, governance, and audit texts are split into 2–4 columns; avoid single-column long lines.
 - **Grouping logic**: organize by annual-report chapters, management review, strategic outlook, governance, financials, notes, and audit; information at the same level uses unified title styles, column widths, and spacing.
 - **Number of viewpoints per page**: a regular business page carries one main theme + 3–5 subsections/metrics; pure disclosure pages may add more text, but every column must have subheadings or paragraph breaks. Large-type viewpoint pages are not the mainstream and must not be overused.
 - **How bullet points are written**: use dashes, dots, or indentation with no more than two levels; group with whitespace and thin lines, and use colorful icons sparingly.
 - **Keyword emphasis**: use bold, position, enlarged numbers, golden brown, or table background fills. Do not use fluorescent highlighting, stacked underlines, or multicolor emphasis.
 - **Numbers/units/time**: key numbers form independent blocks and are larger than their explanatory text; units stay tight against the number or sit as small labels above/below it. Financial ranges, percentages, DKK, years, and the like must retain their definition and measurement-basis notes.
 - **Source footnotes**: footnotes, asterisks, parenthetical notes, and regulatory citations are placed at the bottom or below tables, set smaller than body text, low-contrast but readable.
 ## 4. Content Page Layout System
 ### A. Multi-Column Report Body Page
 Suited to audit opinions, governance statements, policy notes, ESG disclosure, financial notes, and other long texts. A short title at the top-left; the body is 3–4 equal-width columns of text, each column using subheadings + dense paragraphs; columns are separated by whitespace or thin lines, not color blocks. Emphasis relies on bolded subheadings, first-paragraph position, and paragraph spacing. If the content needs strong visual storytelling, a single large viewpoint, or many images, do not use this layout.
 ### B. Company/Topic Overview Page
 Suited to "at a glance"-style summaries, business composition, product categories, and channel/market profiles. A donut chart or core explanation goes in the middle; key numbers, short descriptions, category labels, or minimal graphics sit to the left and right. The donut chart expresses compositional relationships and is not responsible for precise comparison; use column charts/tables instead when precise trends, rankings, or multi-dimensional comparison are needed.
 ### C. Outlook and Assumptions Page
 Suited to annual outlook, target ranges, assumptions, sensitivities, and risk notes. A vertical key-metrics zone on the left holds 2–4 large numbers/ranges; the right side is split into "assumptions," "notes," "sensitivities," or small tables. Golden brown is used for target ranges or key values; gray-filled boxes carry additional conditions. Do not force content into an outlook page when there is no clear quantified conclusion.
 ### D. Region/Business Review Page
 Suited to reviews of regions, business units, or business lines. Region names and key data go on the left, small column charts/metric comparisons in the middle, and 2–3 columns on the right explaining causes, actions, and results. The entry point is the region name and numbers, not photography. If there is only narrative without metrics, switch to a multi-column body page.
 ### E. Wide-Table Disclosure Page
 Suited to financial statements, governance matrices, board information, and compensation/audit details. A short title and description go at the top; the horizontal wide table takes the largest area; when necessary, explanation on the left and the table on the right. Key columns, total rows, or headers use gray fills, bold, or darker gray rules. If a table is compressed to unreadability, it must be split across pages.
 ### F. People/Governance Card Page
 Suited to information on directors, management, and committees. Use equal-width vertical cards: a black-and-white or low-saturation portrait at the top, with name, role, tenure, responsibilities, and committee information below, and thin vertical lines between cards. Photos are uniformly cropped and grayscaled/low-saturated; no colorful avatar-wall social-media style.
 ### G. Photography Section Page
 Suited to the cover, contents, Notes, and chapter openers. Interior/product photography fills the left side or the whole page, with the chapter title and a contents list on the right or in an overlay zone. The photography must have low-noise areas to carry text, and its tone must agree with off-white/golden brown. Body disclosure pages must not rely on large image backgrounds.
 ## 5. Color System
 - **Paper-background off-white `#FBF9ED` / `#FEFCF0`**: the main background of body pages. It must not be replaced with pure white or a highly saturated light color; when migrating brands, it may be replaced with an equally low-saturation warm white.
 - **Primary text black-gray `#171717`–`#2B2B2B`**: the main text of titles, body, and tables. Light gray must not replace body text, to avoid low contrast.
 - **Auxiliary text gray `#5A5E6B` / `#7D7A72`**: headers, footers, notes, chart labels, and secondary notes. Used to lower hierarchy; should not be used for the main body of long paragraphs.
 - **Divider light gray `#D9D7CB` / `#C6C4BB`**: column rules, table gridlines, chart axes, and note-box boundaries. Avoid thick pure-black lines.
 - **Table/note-box gray fill `#A09C93`, light gray fill `#E5E3D8`**: used for headers, summary areas, sensitivity boxes, or tables needing emphasis; the deeper gray fill pairs with light text, the light gray fill provides secondary differentiation. Do not cover an entire page at large scale.
 - **Brand golden brown `#B59D71` / `#AB8F62` / `#97754C`**: key numbers, donut-chart emphasis, some chart series, and echoes of photographic tones; small to medium in area. It may be migrated to the brand's primary color, but must remain low-saturation, warm-toned, and harmonious with off-white.
 - **Deep gold/brown-black around `#6F5435`**: used only for deeper levels within the golden-brown system or for chart contrast; use cautiously.
 - **Black special color `#000000` / deep black-gray**: the background of the back cover or a very few closing pages, paired with a white identity mark (small plain text; no graphic logo is drawn)/text. Large black backgrounds are forbidden on body pages.
 - **Chart series colors**: use golden brown, dark gray, light gray, and black-gray; usually no more than 2 primary hues per page, varying by lightness and transparency. If positive/negative states appear, differentiate them first with text/symbols and light/dark contrast; do not introduce a red-green strong-contrast system unless data compliance requires it.
 ## 6. Typography and Text Hierarchy
 - **Type character**: Unna (serif body) and QuattrocentoSans (humanist sans) are the mainstays — both built-in — with QuattrocentoSans Bold for subheadings/section emphasis. The type does not pursue a tech or handwritten feel.
 - **Body = 1x**: the deck-wide baseline; high-density, compact but readable; long text uses regular weight.
 - **Footnotes/headers/page numbers = 0.75–0.9x**: report name, page numbers, notes, sources, and regulatory citations, in lighter colors.
 - **Subheadings/table headers = 1.2–1.6x**: subsections within chapters, table headers, card names, or contents chapter names; may be bolded.
 - **Body-page title = 2–3x**: top-left aligned, black-gray; no exaggerated decoration needed.
 - **Chapter/cover large title = 4–6x**: used only on the cover, the contents photography zone, and Notes/chapter-opening pages; may be white text overlaid on imagery or black text in a off-white zone.
 - **Key numbers = 2.5–4x**: used on outlook, overview, and region pages; units and notes are 0.8–1x, sitting tight against the number.
 - **Chart labels = 0.8–1x**: axes, legends, and data labels are small and clear; key ones may be bolded or use golden brown.
 - **Table text = 0.8–1x**: may be slightly smaller than body text, but must never become too small to read; headers and summary rows may be bolded.
 ## 7. Chart Language
 Mainly donut charts, small column charts, tabularized data, and a small number of metric zones — no complex visualization systems.
 - **Donut charts**: used for compositional shares or category proportions. Place in the middle or lower part of the page; golden brown marks the key categories, gray/black-gray the others. Labels wrap around the ring and lines are few; avoid exploded pie charts, 3D pie charts, and too many slices.
 - **Column charts**: used for regional or yearly comparisons. Bars are narrow and clean, layered in golden brown, black-gray, and light gray; axes and gridlines are extremely faint. Small column charts may corroborate metrics but do not carry the visuals of an entire page.
 - **Metric zones**: large number + small note + unit/time basis, usually on the left; key values may use golden brown. Explanatory text must sit tight against the number — avoid leaving numbers isolated.
 - **Axes and grid**: axis lines, ticks, and gridlines are low-contrast; chart frames are kept light wherever possible.
 - **Legends**: placed near the chart, with small text and simple swatches. A legend must not become an independent colorful decorative strip.
 - **Annotations**: forecasts, targets, and baselines use thin lines, light-gray boxes, or small notes; do not use big arrows, glowing markers, or exaggerated callouts.
 - **Boundaries**: do not introduce colorful infographics, complex maps, animated graphics, or skeuomorphic dashboards. Chart aesthetics defer to data clarity and complete definitions, scope, and calculation bases.
 ## 8. Tables and High-Density Information
 - **Table role**: as precise disclosure and evidentiary tools for financials, governance, board, compensation, audit, ESG metrics, and the like; they may carry the main body of a page.
 - **Header**: use a light-gray or medium-gray fill with bolded text; a dark-gray header pairs with light text. Compact in height and clearly distinguished from data rows.
 - **Row/column structure**: light-gray thin gridlines; narrow number columns and wide text columns. Avoid heavy borders and excessive zebra striping.
 - **Row height**: high-density but not crowded; long text may wrap and must not be force-compressed into truncation.
 - **Key rows/columns**: totals, key years, committee affiliation, or status columns may use bold, gray fills, or darker divider lines. Do not mark them with multiple bright background colors.
 - **Number alignment**: numbers right-aligned or aligned by decimal place/unit, text left-aligned; percentages, currencies, and years use consistent formats and measurement bases.
 - **Symbol markers**: understated symbols such as small dots, asterisks, and checkmarks/rating dots may be used; Wingdings/Symbol characters are auxiliary only, not a colorful icon system.
 - **Zebra striping**: if used, only an extremely shallow gray/off-white lightness difference. Large dark row fills are reserved for headers or summary areas.
 ## 9. Components and Graphic Elements
 - **Light header component**: top-left mini navigation/three short bars + chapter name, with the report name at the top-right or top; used only for orientation and must not be bolded or enlarged.
 - **Contents component**: bold chapter titles, small entries, right-aligned page numbers, arranged in multiple columns; suited to contents and Notes pages, and may combine with a photography column on the left.
 - **Key-number component**: large number, unit, and short note combined vertically; used on overview, outlook, and region pages. Use black-gray and golden brown, with whitespace forming the entry point.
 - **Hairline divider component**: horizontal lines, vertical lines, table grids, and column rules establish order — they are not decorative filigree.
 - **Gray-filled note box**: used for assumptions, sensitivities, footnote reinforcement, or local table notes; low-saturation fill, small text, clear boundaries. Multiple strongly colored alert boxes must not be stacked.
 - **Cards/people columns**: portrait on top, text below, thin lines between columns; no visible shadows — boundaries are defined by grid and whitespace.
 - **Image frame**: photography uses rectangular crops with clean edges, no rounded corners or shadows; used on covers, contents, section pages, and a few brand/people pages.
 - **Icons**: only a small number of minimal symbols/social marks/status dots. Colorful icons, emoji, and illustrations do not belong to this system.
 - **Process arrows/SmartArt**: not a stable primary component. If a process must be expressed, use only thin lines, numbering, and text boxes; avoid dimensional arrows and templated SmartArt.
 ## 10. Texture and Prohibited Items
 The overall feel remains flat, restrained, paper-like, and low-saturation; rounded corners, shadows, gradients, glows, 3D, and complex decoration are not evidence of the primary style.
 **Prohibited:**
 - Large-area gradients, glows, 3D, drop-shadow cards, glassmorphism, or complex textures on body pages.
 - Rainbow charts, fluorescent highlighting, emoji, cartoon illustrations, and social-media-style colorful icons.
 - Typesetting long paragraphs centered, or replacing report content with presentation-poster-scale giant text.
 - Repeatedly enlarging the logo on body pages, using full-page black backgrounds, or covering the off-white paper system with strong color blocks.
 - Truncated, overlapping, or low-contrast text in tables, or sacrificing data definitions or measurement bases for decoration.
 **Use with caution:**
 - Photography: only on covers, contents, chapters, people, or brand-related pages; body disclosure pages should use it sparingly.
 - Golden-brown emphasis: may be used for key numbers and chart series, but do not sprinkle it all over a page.
 - Gray-filled boxes: for notes/headers/summaries; do not turn them into a dense card wall.
 - Icons and symbols: for orientation or status support only; keep them monochrome and small.
 **Allowed on special pages:**
 - The cover may use a full-image background with a large white title.
 - The back cover may use a black background with a white identity mark (small plain text; no graphic logo is drawn).
 - Chapter openers/Notes may use large photography on the left + a contents list on the right.
 ## 11. Generation Checklist
 - Skeleton: is it a landscape report page; is the off-white background dominant; are header, footer, and page number lightweight and aligned?
 - Copy: are titles short and report-like; is body text organized by subheadings, paragraphs, and lists; are marketing slogans and large blocks of centered copy avoided?
 - Hierarchy: is body=1x clear; do titles, key numbers, subheadings, and footnotes build hierarchy by relative proportions, without exaggerated changes beyond the size logic?
 - Color: is each page controlled around off-white, black-gray, light gray, and golden brown; are highly saturated multicolor and purely decorative colors avoided?
 - Layout: is a 2–4 column grid used; are the functions of key metrics, text, charts, and tables each clearly defined; does the reading path flow smoothly from top-left to bottom-right?
 - Charts: are only the source style's donuts, small column charts, metric zones, and tabularized data used; are axes, legends, and labels understated and readable?
 - Tables: are headers, grids, number alignment, summary rows, and footnotes clear; is there no truncation, garbled characters, overlap, over-density, or low contrast?
 - Components: do hairlines, gray-filled boxes, contents, key numbers, and people cards serve information; is there no templated SmartArt or stacked colorful icons?
 - Prohibited items: no shadows, gradients, glows, 3D, emoji, complex illustrations, social-media card style, or large black-background body pages?
 - Completeness: check for no empty content, occlusion, wrong proportions, low-quality stretched images, misplaced page numbers, overflowing titles, or meaningless pages caused by repeated templates.
 - No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution
 - No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion
@@ -0,0 +1,167 @@
 # T035 · The 2023 Impact Summary STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 Suited to long-form, externally communicated PPTs such as listed-company impact summaries, responsibility reports, ESG/AI governance, social value, skills outreach, and environmental action, aimed at policymakers, investors, partners, media, and employees. It builds institutional accountability through "a credible report + human stories + data evidence," not sales-roadshow-style visual shock.
 Content pages allow 3–5 columns of text, footnote links, quotes, and small data cards to coexist. Core visuals: a `#FFF9F3` off-white background, Arial sans-serif body text, occasional Times New Roman serif display titles, colored chapter strips/capsule navigation, photos of real people or scenes, and flat rectangular data cards.
 Underlying principles:
 - **Credibility beats visual showmanship**: persuade with text, sources, attributions, photos, and data; decoration defers to reading — no complex backgrounds or a sense of motion.
 - **Chapter colors serve navigation, not chromatic display**: each topic has one primary color used for the top strip, the current navigation item, data cards, or quote backgrounds; avoid multiple highly saturated colors competing on the same page.
 - **High density must be structured**: split content with columns, hairlines, cards, subheadings, and footnotes; do not pile on content by shrinking text or compressing line spacing.
 ## 2. Page Skeleton
 - **Canvas ratio**: landscape widescreen 16:9.
 - **Global background**: main pages use warm off-white `#FFF9F3` / `#FFFAF4`; do not change it to pure white, dark, or gradient backgrounds. Section divider pages and some viewpoint pages may use a solid-color strip occupying the top 20%–30% of height.
 - **Margins**: a relatively wide starting margin at the top-left, relaxed outer margins and clear column gaps; no edge-to-edge typesetting; small space for a page number or small symbol reserved at the top-right.
 - **Title zone**:
  - Chapter/methodology pages: a top colored strip carries the chapter title, a short description, and capsule navigation, left-aligned.
  - Case/viewpoint pages: a large title on the left or top-left, a photo on the right or right half; the title may be set in a serif face.
  - Regular content pages: a top-left title followed by multi-column body or a card zone, with clear spacing.
 - **Body zone**: multi-column body text, left/right splits, text-image juxtaposition, and embedded data cards; reads left to right, top to bottom.
 - **Header navigation**: rounded capsule labels along the top; the current chapter uses a filled or highlight color, the others a white/off-white ground with a thin outline. Low in height so it does not steal title hierarchy.
 - **Footer and page number**: the page number sits at the top-right corner or a corner, at an extremely low level; the cover/back cover may carry a plain-text identity mark (write the new topic name; no graphic logo is drawn) and a date. Content pages do not require a large logo and have no heavy footer bar.
 - **Identity mark**: the identity mark (small plain text spelling the organization name; no graphic logo is drawn) appears mainly on the cover, back cover, or report identity pages; on content pages it should be small and quiet — avoid brand-watermark-style repetition.
 - **Sources/links**: placed at the end of body text, the bottom of cards, or the lower part of the page, at a smaller level with blue/purple underlines.
 - **Background graphics**: no persistent geometric textures, watermarks, or decorative patterns; rely on solid colors, photos, and rectangular color blocks. The cover may use a colorful photo wall of square tiles.
 Default path: top chapter color and navigation → top-left title/question sentence → columned body → photos, quotes, data cards, and footnote links on the right.
 ## 3. Content Organization
 - **How titles are written**: short sentences, question sentences, or action statements, such as "How we work," "Our approach to responsible AI," "How can we protect fundamental rights?"; do not stack marketing subtitles.
 - **Information sentences**: one line of context, a person's name, or a role note may sit under the title — supplementing context without repeating the title.
 - **Body organization**: mainly report paragraphs with a few bullets; left-aligned, narrow columns, small gaps between paragraphs.
 - **Grouping logic**: organize by commitment, action, progress, case, and outlook; parallel modules usually number 3–5, each containing a subheading, body text, a link/source, or a small piece of data.
 - **Number of viewpoints per page**: a high-density content page may contain 3–5 parallel topics; a case page focuses on one question, one photo, one quote, or one piece of data evidence; a large-type viewpoint page keeps only one core question/position.
 - **How bullet points are written**: subheadings are short, body text uses complete sentences; do not turn a whole page into fragmented slogans. Bullets should be short — avoid multi-level indentation.
 - **Keyword emphasis**: use Arial Bold for local bolding; links use blue/purple underlines. Avoid highlighter effects, outlined text, and rainbow-style emphasis.
 - **Number definitions and measurement basis**: large-number cards present important figures; the number is tightly grouped with its unit — millions, billions, currency symbols, percentages — with one explanatory sentence below. Do not mix figures with different definitions or measurement bases in the same number card.
 - **Time and sources**: years, reporting periods, and source links use small levels; footnotes must be readable. Quotes need a name/title/attribution or a supporting photo.
 ## 4. Content Page Layout System
 ### A. Colored Chapter Strip + Multi-Column Commitment Page
 Used for methodology, working principles, annual priorities, and responsibility frameworks. The top 20%–30% is a chapter-colored strip containing capsule navigation, a title, and a short description; below are 4–5 body columns, each with a subheading, paragraphs, links, or footnotes. Emphasis comes from the current navigation item, highlighted links, and local bolding. Do not use it for single-story pages or content needing large-image emotional impact.
 ### B. Off-White Multi-Column Body + Embedded Data Cards
 Used for "action + results + investment" evidence pages. The body is 3–4 columns of text, with 1–2 colored data cards embedded at the lower right or lower middle; each card holds an oversized number, a short explanation, and a small icon/marker. If there are more than 3 data points needing horizontal comparison, switch to a table or chart — do not cram the page with cards.
 ### C. Left-Text/Right-Image Case Page
 Used for cases about people, communities, education, environment, and philanthropy. The left off-white zone holds a large title/question sentence, short paragraphs, a link button, or a quote; the right 40%–55% holds a real photo, either full-height or as a large rectangle. The photo must be directly related to the case — no unrelated stock imagery.
 ### D. Viewpoint Question Page / Large Serif Page
 Used for chapter transitions, core questions, and value positions. The serif title is far larger than body text and left-aligned; it may be paired with a short colored underline or a color-block button, with a photo on the right and only a small amount of explanation. Do not place 4-column body text or complex charts here.
 ### E. Signed Letter / Leadership Message Page
 Used for opening positions and messages from leaders. Two- or three-column long text, paired with a circular portrait, name and title, and a handwritten signature; the large title may be serif, the body is Arial. Do not apply this layout when there is no signature, portrait, or clearly identified speaker.
 ### F. Cover and Back-Cover Identity Pages
 The cover holds a plain-text identity mark (write the organization name; no graphic logo is drawn), the report title, and a date on the left, and a colorful photo wall of square tiles on the right; the back cover or closing page closes with a narrow photo wall and links/report name. Used only for opening and closing pages — not replicated repeatedly inside the body.
 ## 5. Color System
 - **Background paper color `#FFF9F3` / `#FFFAF4`**: the deck-wide main background. It must not be replaced with pure black or strong gray; in print it may approach white but must retain its warm tone.
 - **Primary text black `#131323` / `#1E171F`**: the primary color of body text, titles, and table text. Light gray must not replace body text.
 - **Neutral grays `#9E9E9F`, `#C5BFBB`, `#EDE8E4`**: hairline dividers, table rules, secondary notes, photo boundaries, and weak backgrounds; they do not carry primary information.
 - **Chapter purple `#6F2572`**: top strips, current navigation, quotes, or emphasis cards for AI/responsibility chapters; in body text it appears only as links, labels, or data emphasis. When replacing it, keep sufficient depth and white-text contrast.
 - **Chapter yellow `#FFB901`**: top strips, data cards, and right-side emphasis blocks for skills/learning chapters; paired with black text — avoid low-contrast white text on yellow.
 - **Light purple `#C6B3E4` / `#C5B3E3`**: quote boxes, auxiliary data cards, and soft emphasis zones; it carries black or deep-purple text and is not spread at large scale as the base of main body text.
 - **Blue `#0978DE`**: links, a small number of chart series, emphasis marks, or the brand color within cover photos; small in area.
 - **Green/teal `#6D7A62`, `#B8DCD2`, `#152C27`**: environment or sustainability chapters, data cards, and photo echoes; deep teal card grounds pair with light text, light teal serves as an auxiliary ground.
 - **Orange-red family (near `#FF5A3D`)**: chapter strips, labels, or emphasis lines; use one primary color per page and do not let it compete at large scale with yellow and purple at the same time.
 One page should have only 1 chapter primary color + off-white + black-gray; data cards may add 1 auxiliary color. Do not invent a red-green up/down system out of thin air. Brand colors may replace chapter colors, but the "top strip/navigation/cards" roles remain unchanged.
 ## 6. Typography and Text Hierarchy
 - **Type character**: body text is dominated by Arial; titles and viewpoint pages occasionally use Times New Roman. Do not mix decorative or handwritten fonts into body text.
 - **Body text**: 1x — the baseline for multi-column paragraphs, table notes, and case text.
 - **Subheadings/column headings**: about 1.1–1.3x, commonly Arial Bold.
 - **Page titles**: regular content pages about 2–3x; chapter-strip titles may reach 3–4x, left-aligned.
 - **Serif display titles**: Times New Roman titles may reach 3.5–5x, with tight but non-overlapping line spacing.
 - **Data numbers**: about 4–6x; units grouped with the number; explanatory text at 0.8–1x.
 - **Information sentences/attributions**: about 0.9–1x.
 - **Footnotes/links/page numbers**: about 0.55–0.75x; page numbers extremely weak, footnotes readable.
 - **Emphasis methods**: prefer Bold, color-block grounds, and link colors; do not use outlined text, drop-shadow text, gradient text, or large blocks of centered typesetting.
 ## 7. Chart Language
 Charts are kept simple, dominated by data cards, small tables, and a small number of simplified graphics.
 - **Type boundaries**: suited to small column/bar charts, progress bars, simple comparisons, and data-label cards; not suited to complex dashboards, radar charts, 3D pie charts, or multi-axis financial charts.
 - **Axes and grid**: gridlines are extremely faint, in neutral gray; axes are de-emphasized — avoid thick black axis lines. When values can be labeled directly, a legend is not mandatory.
 - **Series colors**: the current chapter's primary color + light gray/light auxiliary colors; a single chart should not exceed 3–4 colors.
 - **Data labels**: key values sit close to the graphic or on cards; key data uses the chapter color or oversized numbers.
 - **Baseline/target lines**: use thin lines with short callouts — avoid red-alarm-style thick lines.
 - **Legends**: small, close to the chart, with simple swatches; do not build a large standalone legend zone.
 ## 8. Tables and High-Density Information
 - **Header**: subheading-level and Bold; background is off-white, light gray, or a light chapter tint. Avoid dark headers dominating the visual.
 - **Row/column structure**: thin light-gray lines, separating with whitespace and hairlines; row height remains readable, not compressed into a dense-database feel.
 - **Background fills**: large areas of off-white; key cells may be card-ified in light purple, yellow, light green, or blue.
 - **Number alignment**: numbers right-aligned or unified by decimal point/unit, text left-aligned; large numbers may become standalone cards.
 - **Key rows/columns**: use small chapter-colored labels, light fills, or Bold; avoid filling entire rows with highly saturated color.
 - **Zebra striping**: not a strong rule; if used, only an extremely shallow gray/off-white difference.
 - **Symbols and ratings**: small dots, dashes, checkmarks, or short color bars may be used, but must not develop into a complex icon system.
 - **Overflow control**: rather split into multiple columns or two pages than let text touch the edge, footnotes overlap, or a table cover the page number.
 ## 9. Components and Graphic Elements
 - **Capsule navigation**: small rounded labels across the top; the current chapter is filled with the chapter color or highlighted, the others have white/off-white grounds with thin outlines. Text is extremely short — it must not become a secondary contents list.
 - **Chapter color strip**: about one-fifth to one-third of the page height at the top, carrying title, description, and navigation. Do not stack multiple large color strips on the same page.
 - **Data cards**: rectangular or slightly rounded, filled with yellow, light purple, green, blue, etc.; containing a large number, a short explanation, and a small marker. Suited to 1–2 core numbers — not suited to being piled into a nine-square grid.
 - **Quote boxes**: light purple, off-white, or chapter-colored blocks containing quotation marks, a short sentence, and a name/portrait/signature; they must have a source.
 - **Photo frames**: real photos in rectangular crops, often occupying a large zone on the right, and may be spliced with color blocks. Photos get no thick borders, shadows, or complex masks.
 - **Link buttons/source bars**: small colored rounded bars or underlined text, sitting close to the relevant body text — never floating.
 - **Divider lines**: thin gray lines or short colored lines, used between columns, for title emphasis, and at table boundaries; lines should be light and must not form a caged grid.
 - **Portraits and signatures**: used on leadership-message and quote pages; must not be overused on ordinary data pages.
 - **Icons**: only a few small markers/simple symbols; they must not expand into a large colorful icon collection; they must support labels and must not express complex concepts alone.
 ## 10. Texture and Prohibited Items
 The overall feel is flat, restrained, and report-like — typesetting, color blocks, photos, and data — without relying on visual effects.
 **Prohibited:**
 - Large-area gradient backgrounds, glows, 3D, skeuomorphic buttons, thick shadows, glassmorphism, and complex textures.
 - emoji, cartoon illustrations, unsourced decorative icons, and social-media-poster-style large centered slogans.
 - Pressing large amounts of body text directly onto full-image backgrounds, or using low-contrast light-gray body text.
 - Multiple highly saturated chapter colors juxtaposed on the same page competing for the main visual.
 **Use with caution:**
 - Rounded corners: navigation capsules, buttons, and data cards may be slightly rounded; large body containers should not all become rounded cards.
 - Photos: should be evidence of real people/scenes; no staged stock shots unrelated to the content.
 - Colorful icons: only as extremely small auxiliary markers — they cannot become the main visual system.
 - Tables/charts: used only when a genuine data-comparison need exists, keeping light lines and direct labels.
 **Allowed on special pages:**
 - Cover/back cover may use a colorful photo wall of square tiles or large-image collages.
 - Viewpoint pages may use oversized serif titles, short colored underlines, and half-page photos.
 - Leadership-message pages may use portraits, signatures, and long-text typesetting.
 ## 11. Generation Checklist
 - Is it a 16:9 warm off-white report ground, without mistakenly using pure white/dark/gradient backgrounds?
 - Does the page have a clear top-left title, a body reading path, and sufficient outer margins and column gaps?
 - Do section divider pages use a single chapter-colored strip with capsule navigation, and is the current item highlighted?
 - Is the copy issue-styled short titles + report paragraphs/parallel subheadings, rather than stacked marketing slogans?
 - Is body text based on Arial 1x, with title, number, and footnote levels relatively clear and free of absolute font-size dependencies?
 - Is the single-page primary color controlled to 1 chapter color + a neutral base, with restrained link/data emphasis?
 - Is the multi-column body free of edge-touching, overlap, truncation, garbled characters, over-tight line spacing, or low contrast?
 - Are photos real, relevant, and rectangularly cropped, without thick shadows or complex masks?
 - Do data cards highlight only a few key numbers, with number/unit/explanation complete?
 - Are charts light-gridded, weakly axised, and directly labeled, without 3D, multiple axes, or too many series colors?
 - Are tables thin-lined and lightly filled, with text left-aligned/numbers uniformly aligned, without excessive filling?
 - Do components come from the system — capsule navigation, chapter strips, data cards, quote boxes, photo frames, hairline dividers — rather than newly added decoration?
 - Are emoji, complex illustrations, glows, gradients, thick shadows, large blocks of centered body text, and empty-content placeholders avoided?
 - Do cover, body, chapter, case, and closing pages vary while still keeping the same report skeleton?
 - No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution
 - No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion
@@ -0,0 +1,157 @@
 # C007 · 2023 Organization Name impact report highlights STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 Suited for corporate impact reports, ESG/sustainability summaries, and technology-product-and-environmental-data narratives, aimed at investors, media, policy/industry observers, and internal management. Information density is medium to slightly high, alternating between "readable report pages" and "immersive photography pages." Core visuals: near-white background, black/gray sans-serif text, extremely thin light-gray lines, low-saturation green accents, real automotive/factory/nature/crowd photography, minimal decoration, generous whitespace.
 Underlying principles:
 - **Credibility over decoration**: pages should feel like a formal report rather than a marketing poster; elements must serve the argument, the data definitions and measurement basis, or real-scene evidence.
 - **Whitespace over filling**: when there is too much information, split pages, use columns, or use tables — do not shrink font size or cram in components.
 - **Green is used only for positive/environmental/data emphasis**: it must not expand into a large decorative background color or meaningless highlighting.
 ## 2. Page Skeleton
 - **Canvas ratio**: widescreen 16:9 landscape. Content pages are mostly near-white/white backgrounds; the cover, section transitions, and closing page may use full-bleed dark photography or a black background.
 - **Margin system**: wide margins on all four sides — content never touches the edge; titles, body text, charts, and photos all have a clear outer boundary. Photos may approach half the page width but must retain breathing room.
 - **Title area**: located at upper left or center-upper-left, using a black/dark-gray short phrase or a complete judgment sentence; followed by 1–2 paragraphs of light-gray explanation. The title area does not use colored bars, bold frames, or large background panels.
 - **Body area**: carries photos, charts, metric groups, product relationship diagrams, or multi-column text. Common structures: text left / image right, image left / text right, title on top / chart below, a central relationship diagram, or horizontal metric cards.
 - **Header**: at the very top, an extremely small light-gray report name/section name/auxiliary navigation aligned left or centered — no prominent navigation bar.
 - **Footer and page number**: page numbers usually sit at the upper right or edge, rendered extremely small and light gray; footnotes/sources sit at the bottom or near the chart.
 - **Logo**: the brand logo does not repeatedly appear as a large logo on every page.
 - **Cover/section pages**: full-bleed or large-scale photography, with text overlaid at lower left/left side. The cover may separate the large title and year; section pages may use a darkened photo overlaid with white text.
 - **Dividers**: used only between chart axes, tables, metric cards, or text columns, using extremely thin light-gray lines. Thick lines, colored horizontal bars, and decorative borders are prohibited.
 - **Watermarks/background graphics**: by default, no abstract watermarks, textures, or geometric backgrounds are used; dark atmosphere comes from photography or a pure black background.
 - **Default reading path**: top-left title → subtext/metric explanation → evidence area on the right or below → footnote source.
 ## 3. Content Organization
 - **Title style**: use a self-contained conclusion sentence, action sentence, or thesis sentence, e.g. "a product delivers a certain impact" or "an action reduces a certain footprint." Avoid vague slogans and word-stacking.
 - **Key message sentences**: below the title, use a short, report-style explanation of background, measurement basis, or causation, in a color lighter than the title.
 - **Body text organization**: use short paragraphs, 2–3 text columns, or a small number of bullet points; long policy/explanatory content may be split into columns with generous line spacing and column gaps.
 - **Number of points per page**: one core point per page, supplemented by at most one photo, one chart, or one group of metrics. Multiple sub-points use horizontal cards, columns, or tables rather than scattered placement.
 - **Bullet style**: use traditional bullet lists sparingly; prefer short paragraphs, subheadings, metric cards, and table cells; when bullets must be used, the markers should be small, light, and restrained.
 - **Keyword emphasis**: use large numbers, dark/light contrast, low-saturation green, and whitespace. Do not use neon highlighting, underlines, or multi-color emphasis within body text.
 - **Numbers/units/time frames**: key numbers may be enlarged and stand alone; units follow directly after the number or appear as a small label. Percentages, tonnage, mileage, years, etc. must retain their definitions and measurement-basis notes; timelines or years should align with data charts.
 - **Source footnotes**: data pages must include an extremely small light-gray footnote or source note, placed at the bottom or below the chart; it only supplements the measurement basis and does not carry the main narrative.
 ## 4. Content Page Layout System
 ### A. Text-left/image-right or image-left/text-right type
 For product scenarios, manufacturing facilities, energy facilities, and evidence involving people or locations. The text side holds a title, 1–2 explanatory paragraphs, a footnote, or a small status dot; the image side holds one real photo occupying about 40%–55% of the page's visual width. Images are rectangular or slightly rounded, cleanly cropped. Text delivers the conclusion; the photo delivers scene evidence. Not suitable for multi-set data comparison, complex processes, or long body text.
 ### B. Large-image immersive type
 For covers, section pages, theme transitions, manifesto-style closings, and mood pages. The photo fills the entire page or most of the canvas, with text overlaid at lower left/left side; darken the photo when necessary to ensure white text remains readable. May use a larger title and year/section information. Not suitable for large amounts of numbers, tables, or fine-grained charts.
 ### C. Title + horizontal metric group type
 For summaries such as climate impact, emissions share, cumulative results, and efficiency metrics. Place the title and a brief explanation at the top or upper left, with 4–6 metrics arranged horizontally below; each contains a large number and a small unit/explanation, separated by extremely light backgrounds or thin lines. Highlight key numbers in mint green, others in dark or light gray. Should not be used when metric definitions or measurement bases differ too much or explanatory text is too long.
 ### D. Chart-argument type
 For a single quantitative argument such as trend change, cumulative impact, amount avoided, or efficiency decline. The title sits at upper left or top, with the chart occupying the lower half or a large area on the right. Use light-gray grids, extremely thin axis lines, few series colors, and direct labels; a green trend line/baseline expresses the core conclusion. Do not use multi-color business-dashboard-style charts; split the page or simplify when there are more than 2–3 series.
 ### E. Central relationship / product-substitution diagram type
 For product ecosystems, substitution relationships, and energy-system composition. Built around a central node, small product images, or simplified objects, connected by extremely thin light-gray lines; text labels are very small, background is white. Rely on central position, whitespace, and connection relationships for emphasis — do not use colored icons. Should not be used when there are too many nodes, complex crossings, or many process steps.
 ### F. Multi-column report text type
 For reading-oriented content such as policy explanations, supply chain, ethics, workforce, and materials. Title placed at upper left, body text split into 2–3 columns with balanced column widths and wide column gaps; a small photo may be added at the side or bottom. Use subheadings or green numbers to extract key points — do not use large background color blocks. Not suitable for presentation scenarios or quick-scan pages.
 ### G. Table / high-density comparison type
 For structured comparisons such as vehicle models, metrics, regions, or project status. Title on top, table centered or occupying a large area below; organize with light-gray lines and light background colors, using heavy borders sparingly. Highlight only key columns, summary rows, or status dots. If the explanatory text exceeds the table itself, switch to a multi-column text page instead.
 ## 5. Color System
 - **Primary background white / near-white**: #FAF9F7, #F8F8F8, #F5F6F6, #F1F2F2. Used for most content pages and occupies the largest area. Must not be replaced with a colored background; branding may only slightly adjust the warmth/coolness of the white.
 - **Primary text black/gray**: #111111, #111215, #23272E, #262F35. Used for titles, key numbers, axis labels, and body emphasis; titles are near-black, body text may be dark gray. Must not be replaced with colored titles.
 - **Secondary text gray**: #64726D, #93A299, #ABB3B1, #BCC8C5. Used for subtitles, paragraphs, footnotes, weak labels, and axis text; must not be so light that it disappears.
 - **Dividers / grid gray**: #EDEFEE, #ECEDED, #D6DAD9, #C6C9C9. Used for chart grids, table lines, card dividers, and light backgrounds; contrast must be low to avoid a heavy, table-like feel.
 - **Environmental accent green / mint green**: #95BFA9, #BBE6D1, #65A889, #2E9B73. Used for key percentages, environmental metrics, trend lines, positive status dots, and small labels. Small-to-medium area; not used as a full-page background color or ordinary decoration.
 - **Dark photo / black-background pages**: #060608, #0D1708, #121C25, #202611, #404720. Used for night scenes, forests, factories, darkened photos, immersive pages, and manifesto pages; text uses white/light gray.
 - **Natural photo colors**: forest green, road black, sky blue-gray, factory gray, and vehicle white/black/red come from real photography and are not elevated to component colors. Photo colors must not be arbitrarily extracted as chart series colors.
 - **Chart series color boundary**: keep a single page's main hue within black/gray + green; for multiple series, use different gray brightness levels plus one green accent. Avoid multi-color legends such as red/orange/purple/blue unless the original data states genuinely require distinction.
 - **Positive/negative status**: positive/improving uses green; negative/risk defaults to dark-gray text or annotation notes — introduce red cautiously.
 ## 6. Fonts and Text Hierarchy
 Use a modern sans-serif typeface with a clean, technological, report-like feel, consistent with the visual tone of the organization or an industrial-technology brand. Serif fonts, handwriting fonts, cartoon fonts, or decorative fonts must not be used.
 - **Body text = 1x**: paragraph explanations and table body text, dark gray or medium gray, with relatively loose line spacing.
 - **Titles = 2.5–4x**: the page's main point, black/dark gray, medium-to-slightly-bold weight; cover/section pages may be larger.
 - **Key message/subtitle = 1.1–1.4x**: below the title, in a color lighter than the title.
 - **Subheadings/group titles = 1.1–1.6x**: used above tables, chart titles, and column lead-ins, with slightly stronger weight.
 - **Key numbers = 3–6x**: paired with units and small labels; no additional bold frame is needed.
 - **Chart labels/table text = 0.8–1x**: clear but weaker than body titles; chart axis labels may be even lighter.
 - **Annotations/footnotes/page numbers = 0.5–0.7x**: extremely small, light gray, near the edge.
 - **Text layout**: text-heavy or numeric pages are mostly left-aligned; avoid large centered blocks. Title line breaks follow semantic divisions.
 ## 7. Chart Language
 Uses report-style concise line charts, bar/small metric charts, share indicators, and a small number of relationship diagrams — no business dashboards.
 - **Chart types**: line trends, simple horizontal/vertical bars, percentage metric cards, a single baseline or comparison line. Relationship diagrams use small product images + thin connecting lines.
 - **Axes**: extremely thin axis lines, in light gray or dark gray with low opacity; few tick marks, avoiding dense scales.
 - **Gridlines**: extremely light thin gray lines, only to aid reading values, not forming a grid background.
 - **Labels**: prefer labeling key values directly or placing small labels near data points, reducing legends; use gray, dark gray, and green for emphasis.
 - **Series colors**: the core series uses a mint/green line, comparison series use light gray or dark gray. Do not use large numbers of highly saturated colors in the same chart.
 - **Key data**: emphasize via a green line, an enlarged number, local bolding, or a side note. Do not use explosion shapes, glow, or thick arrows.
 - **Forecast/target/baseline lines**: use thin dashed lines or light-gray lines, with small explanatory text near the line. Do not add gradient forecast bands.
 - **Chart boundaries**: keep ample whitespace and a clear title. This style is not suitable when long legends, multi-layer filters, or complex interaction explanations are required.
 ## 8. Tables and High-Density Information
 - **Headers**: use light-gray text or slightly heavier weight, with a near-white/extremely-light-gray background. Headers do not use a dark background with reversed white text.
 - **Row/column structure**: separate with thin light-gray lines, weaken outer borders, and give ample whitespace between columns to avoid crowding.
 - **Row height**: relatively loose; even high-density pages should not be compressed into a dense financial-statement-style grid.
 - **Base colors**: extremely light-gray blocks may distinguish headers, summaries, or card areas; zebra striping, if used, must be very subtle.
 - **Key rows/columns**: mark with green numbers, small status dots, a light background, or bolder weight. Avoid filling an entire row with a strong color.
 - **Number and text alignment**: text is left-aligned; numbers are right-aligned by column or aligned by decimal place; units, definitions, and measurement bases are consistent for percentages, tonnage, quantities, etc.
 - **Symbol markers**: small dots, short dashes, or minimalist status symbols may be used; do not use colorful, complex icons.
 - **Page role**: a table must have a clear point-of-view title above it, and may have a footnote below explaining the measurement basis.
 ## 9. Components and Graphic Elements
 - **Title bar/header micro-navigation**: an extremely small light-gray report name, section name, or page number at the top edge, used only for orientation.
 - **Metric cards**: composed of a large number, a small label, a light background, or a thin divider; suitable for 3–6 parallel metrics; green is used only for key numbers or positive values.
 - **Small status dots/badges**: small green dots or simplified marks, paired with a footnote, explanation, or positive status; small in size — must not develop into a large icon system.
 - **Photo frames**: real photography uses a rectangular or slightly rounded frame, cleanly cropped; rounded corners should be small and modern. Photos have no thick borders or shadows added.
 - **Tip/explanation blocks**: grouped with a light-gray background or whitespace, reducing the text's visual weight by using a lighter gray. Colorful warning boxes or speech-bubble dialogs must not be used.
 - **Dividers**: extremely thin light-gray lines used for tables, charts, column separation, and relationship connections. All lines stay lightweight — no thick arrows or heavy strokes.
 - **Process/relationship arrows**: use thin lines, faint arrows, or node connections to express substitution relationships or flow; prioritize reducing nodes and line crossings.
 - **Product images/small objects**: use real product renders or cropped photo objects as nodes, in preference to generic icons. Colorful illustration-style icons should not replace them.
 ## 10. Texture and Prohibited Items
 Overall keep it flat, restrained, report-like, and driven by real photography, creating page variation through layout and photos.
 **Prohibited:**
 - Large gradient backgrounds, glow, 3D decoration, glassmorphism, complex textures, neon lines.
 - Cartoon illustrations, emoji, social-media stickers, exaggerated colorful icons, hand-drawn arrows.
 - Heavy borders, strong shadows, thick colored title bars, full-page brand-color backgrounds.
 - Large centered blocks of copy, large numbers without a source, data decorated without a stated definition or measurement basis.
 - Multi-color legend stacking, dashboard-style complex charts, low-contrast text overlaid on bright areas of a photo.
 **Use with caution:**
 - Rounded corners: only for photo frames or light cards, with a small radius — must not become cartoonish.
 - Shadows: the source file shows no stable shadow system; do not use by default; if needed for image layering, keep it extremely subtle.
 - Colorful vehicle/photo colors: may come from real photography, but must not expand into the page's color system.
 - Dark pages: used only for the cover, sections, closing, or strong emotional transitions — should not be widely used for content data pages.
 **Usable on special pages:**
 - A full-bleed photo background with overlaid white text, for cover/section/closing pages.
 - A black-background manifesto page, for the final summary or a strong point-of-view statement.
 - High-density multi-column text pages, for report-reading scenarios, but must keep clear column spacing and footnotes.
 ## 11. Generation Checklist
 - Is it 16:9 landscape, with content pages defaulting to a near-white background and wide margins?
 - Is the title a clear point-of-view sentence, positioned at the upper-left/left reading start point?
 - Does each page carry only one core point, with the evidence area choosing just one of photo, chart, metric group, or table as the primary element?
 - Is the body text organized in short paragraphs/columns, avoiding large centered blocks and dense lists?
 - Is color kept within black/gray/white + low-saturation green, without introducing an unfounded multi-color system?
 - Is green used only for environmental, positive, or key-data emphasis, with a restrained area?
 - Do charts use thin axis lines, light grids, few series, and direct labels, avoiding a dashboard feel?
 - Do tables use thin lines, light backgrounds, and generous row height, with emphasis limited to green numbers or light background marks?
 - Are photos real, cleanly cropped, free of thick borders or shadows, with sufficient contrast where text overlays them?
 - Are the header, page number, and footnotes small and light, without becoming prominent decoration?
 - Are gradients, glow, 3D, complex illustrations, emoji, strong shadows, and thick borders avoided?
 - Have you checked for overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, and mechanical template repetition?
 - No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution
 - No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion
@@ -0,0 +1,186 @@
 # Organization Name · Business Report STYLE DESIGN SYSTEM
 ## 1. Style Positioning
 A landscape PPT aimed at consulting-firm employer branding, talent attraction, corporate culture, and organizational-capability messaging. The audience is external candidates, employees, or a general business crowd; it conveys a credible, global, people-centered brand image through a small number of facts, awards, maps, photos, and strong slogans.
 - **One thesis per page, evidence serves the thesis**: each page sets only one explicit headline or conclusion; photos, maps, awards, logos, charts, or triptych components all revolve around that conclusion — do not let multiple points compete.
 - **Red is used for brand tone-setting and conclusion landing points**: it may be used for the cover, transitions, title bands, bottom conclusion bars, or icon cores, without fragmenting into many small decorative dots.
 - **Readability over decoration**: black-and-white/grayscale visuals, white-background information areas, and QuattrocentoSans bold large titles form high contrast; photos, badges, and charts must not overpower the text conclusion.
 ## 2. Page Skeleton
 - **Canvas ratio**: landscape widescreen presentation ratio; primarily full-bleed landscape composition, alternating between white-background content pages, red-background slogan pages, black-and-white photo pages, and mixed collage pages.
 - **Margin system**: red bars, photos, and cover diagonal-cut color blocks may approach the canvas edge; body text, logo walls, maps, and badge groups keep clear outer margins. The bottom red bar often spans most of the width, carrying the conclusion.
 - **Title area**:
  - A top red horizontal bar with a white, all-caps, bold title, used for sections/themes.
  - A large red title at upper left on a white background, used for opinion or vision pages.
  - Special slogan pages use large white text centered or at the bottom, without relying on a traditional header.
 - **Body area**: uses black-and-white photos, maps, award badges, logo walls, circular triptychs, simple line/area charts, or large numbers; a single page retains only one primary visual logic.
 - **Header/footer**: a few consulting content pages may place an extremely small confidentiality notice, document description, or footer information at the bottom edge; communication pages usually have no complex header navigation.
 - **Page numbers**: no explicit page-number system; new pages may omit them, or place them only at a weakened footnote level.
 - **Logo**: the brand logo is used on identity pages such as the cover and closing page. The closing page is a red background with a centered white logo and a small tagline; the logo is not repeated and enlarged on every page.
 - **Navigation/watermark**: there is no stable table-of-contents navigation, section progress bar, or watermark system — none should be forced in.
 - **Dividers and background graphics**: use solid red rectangles, diagonally cut red blocks, black horizontal bands, and circular crops; do not use complex wireframe backgrounds, gradient textures, or abstract decorative networks.
 - **Default reading path**: first read the red title band or large slogan, then view the primary visual evidence, then read small annotations/footnotes. On image-left/text-right pages, view the photo first, then read the bullets and bolded keywords on the right.
 ## 3. Content Organization
 - **Title style**: mostly concise, action-oriented verb or noun phrases, often set in all caps when appropriate. Usually 1 line, at most 2; avoid long sentences, Q&A-style titles, and stacked multi-level subtitles.
 - **Key message sentences**: QuattrocentoSans Bold carries short labels, quote-style slogans, or small group names — not formal long body text.
 - **Body text organization**: left-aligned bullets, 3–5 items per page, each spanning 1–3 lines; keywords are locally bolded with QuattrocentoSans Bold, not relying on colored highlighting.
 - **Grouping logic**: three-way groupings are used for parallel evidence, awards, or result categories; two-way groupings are used for photo + text, red block + photo, or title + proof; logo walls are arranged by visual weight rather than a strict grid.
 - **Number of points per page**: by default 1 main point + 1 category of evidence; complex pages may have 2–4 evidence points, but they must all revolve around the same conclusion. Do not simultaneously place vision, metrics, process, cases, and multiple charts.
 - **Numbers and units**: key numbers use oversized bold text, combined with the conclusion phrase into "quantity + object + scope"; may be placed on the bottom red bar or at the page center.
 - **Source footnotes**: confidentiality notices, sources, and annotations are placed at the bottom or near the chart, using extremely small text that only explains the source and limitations without expanding into business narrative.
 ## 4. Content Page Layout System
 ### A. Image-left/text-right intro page
 For institutional facts, capability scope, or background information. The left side holds a black-and-white or low-saturation photo; the right side, on a white background, holds a bold small heading and a bullet list, with black body text and bolded key phrases. Suitable for a moderate amount of text; not suitable for complex tables, multiple charts, or too many small icons.
 ### B. Map + bottom red conclusion bar
 For global coverage, offices, or regional distribution. The body is a light-gray dot-matrix/line-drawn map, with locations marked by red dots and thin lines, and city labels in small black/gray text; the bottom red bar carries a large-number white-text conclusion. Not suitable for precise geographic analysis or dense route explanations.
 ### C. Red-background large slogan page
 For section transitions, thematic emphasis, or value propositions. A large solid-red background, with large white QuattrocentoSans Bold text centered or off-center, possibly paired with a large symbol or short phrase. Expresses only one thesis; bullets, long paragraphs, or complex charts must not be layered on.
 ### D. White-background opinion + red block/photo collage page
 For talent vision, culture statements, and emotional expression. A large red title on a white background at the top; below, red rectangular text blocks and black-and-white portrait photos placed side by side. Red blocks carry short white bold phrases; not suitable for fine-grained data explanations.
 ### E. Award badge/logo evidence wall page
 For external endorsements, partners, or recognition. Primarily white background, with a red bar at top or bottom stating the theme; badges/logos arranged in 2–3 rows, sizes fine-tuned by brand visual weight. Very little text explanation, preserving whitespace. Not suitable for long explanations or forcing logos to equal size, causing crowding.
 ### F. Three-circle parallel evidence page
 For three categories of results, three challenges, or three types of recognition. Three circular visual objects divided evenly horizontally, with bold labels at the top; the circles may hold black-and-white photos, red graphic icons, or grayscale portraits. Suitable for up to three items; more than three should switch to a list or grouped wall.
 ### G. Chart + horizontal emphasis band page
 For a small amount of trend data. A short heading-style explanation at the top, with a concise line/area chart as the body, overlaid with a black horizontal band carrying a white-text conclusion. The chart serves as evidence, the band as explanation; do not use when there are too many data series or precise readings are needed.
 ### H. Black-and-white photo slogan page
 For culture statements or emotional closure. The photo fills the body or most of the frame, with large bold white all-caps text placed over a dark area, possibly paired with a bottom red bar. Must ensure the photo is dark enough and text contrast is sufficient; white text must not sit directly over a bright area.
 ### I. Text + bottom red conclusion page
 For support systems, principle lists, or action commitments. A red bold title at the top or left, with bullets beside it; the bottom red bar carries the final commitment. Used to converge supporting points into one slogan; not suitable for listing more than 5–6 sub-items.
 ## 5. Color System
 - **Background white: #FFFFFF**
  - Used as the primary background for content pages, evidence walls, map pages, badge pages, chart pages, and most information pages.
  - Do not add warm paper textures, light color gradients, or complex background patterns; must not be casually replaced with a brand light color.
 - **Brand primary red: #CC0001 / #C00000 / #CE2222**
  - Used for cover overlays, full-page red backgrounds, title bars, bottom conclusion bars, key graphics, and red text titles.
  - May be used as a small accent or across the full page; transitions/back covers may be dominated by it, while content pages typically use it for 10%–30% of the area.
  - Do not compete with other highly saturated primary colors; do not use for long body text.
  - When migrating brands, it may be replaced by the new brand's single primary color, but high saturation, strong contrast, and consistent use must be maintained.
 - **Primary text black: #111111 / #1B1B1B / #292929**
  - Used for body text, bullets, labels, chart text, and dark text on photo pages.
  - Avoid using light gray for body text; black text is placed only on white or light-gray backgrounds; colored body text is not recommended.
 - **Neutral gray: #4B4B4B / #747474 / #B6B5B5 / #D7D7D7**
  - Used for black-and-white photos, map background textures, chart coordinates, city labels, and divider auxiliary elements.
  - May be used across large areas on photo and map pages; grayscale should only be supportive — it should not make the overall page low-contrast, nor turn into a colorful illustration background.
 - **Black accent band: #222222 / #2A2A2A**
  - Used for horizontal explanatory bands on chart pages and some photo text overlays, carrying white conclusion text.
  - Do not use it as a title of equal rank alongside the red bar, to avoid competing focal points.
 - **Evidence green: #53951A / #306937**
  - Used only as the genuine source color of award badges — it is the original color of external certifications.
  - Not a global accent color; must not be expanded into a chart's primary color or a title color.
 - **Chart/status color boundary**: a single page's main hue is usually only red plus black/white/gray; badges/logos may keep their original colors but must not be expanded further. Positive/negative status prefers text, arrows, and red emphasis rather than a multi-color traffic-light system.
 ## 6. Fonts and Text Hierarchy
 - **Font character**: the whole deck uses QuattrocentoSans (a Verdana-class humanist sans, built-in), layered through Regular/Bold; no handwriting-style fonts.
 - **Title hierarchy**: main titles use QuattrocentoSans Bold, all-caps, about 2.5–4x the body size; red backgrounds use white text, white backgrounds usually use red text; line spacing is tight.
 - **Slogan/large-number hierarchy**: covers, transitions, map conclusions, and photo slogans may reach 3–5x the body size, and must be short and bold.
 - **Key message/subtitle**: about 1.2–1.8x the body size, may be regular or bold, must not overpower the main title.
 - **Body bullets**: body text = 1x, primarily QuattrocentoSans regular, with key phrases bolded in QuattrocentoSans Bold at the same size; bullet markers are simple with shallow indentation.
 - **Subheadings/group labels**: QuattrocentoSans Bold, about 0.9–1.3x the body size.
 - **Table/chart labels**: about 0.55–0.8x the body size, in black/gray, must not compete with the main title for attention.
 - **Annotations, footnotes, confidentiality notices**: about 0.25–0.35x the body size, placed at the bottom, in gray-black, extremely low visual weight.
 - **Page numbers**: if present, at the same level as footnotes, not constituting a visual element.
 ## 7. Chart Language
 - **Chart types**: use a single trend chart, or an overlaid line/area chart, to prove "results changing over time"; do not build complex multi-chart dashboards.
 - **Axes and gridlines**: axes are thin, gray-black; gridlines are weakened or minimal; axis labels are small.
 - **Series colors**: the data body uses a red area/line, paired with a black/gray baseline when necessary; do not introduce multiple series colors.
 - **Key data**: emphasize with a red data area, a peak marker, or a horizontal black explanatory band; avoid a large number of callout bubbles.
 - **Legends**: omit or keep extremely minimal wherever possible; when there are only one or two data categories, label directly within the chart.
 - **Forecast/target/baseline lines**: there is no stable forecast-line system; if needed, use a thin gray or black line — do not use flashy dashed lines.
 - **Annotation language**: white-text horizontal bands may express short conclusions; charts serve as proof, not as the full narrative.
 ## 8. Tables and High-Density Information
 There is no traditional large-table system; high-density information is mainly carried by bullet lists, logo walls, city-labeled maps, and badge collections.
 - **Table usage boundary**: when a table must be used, keep a white background, black/gray text, and thin gray dividers; red is used only for the header or summary conclusion, without heavy borders or multi-colored backgrounds.
 - **Headers**: may use a red background with white text, or black/gray bold text; kept compact, avoiding decorative gradients.
 - **Rows and columns**: row height prioritizes readability, column count should not be excessive; text is left-aligned, numbers are right-aligned or aligned by decimal place.
 - **Dividers**: use thin light-gray lines; do not use heavy black grids or many vertical lines.
 - **Base color**: default white background; extremely light gray may distinguish groups; overly strong zebra striping is not recommended.
 - **Key rows/columns**: highlight summaries with a red bar, red title text, or bold — do not fill many parts of the table with red.
 - **Symbols/rating dots**: there is no stable rating system; if needed, limit to black, gray, and red, paired with text explanation.
 - **Page role**: a table can only serve as an evidence module — it should not replace the one-page-one-thesis structure.
 ## 9. Components and Graphic Elements
 - **Red title band**: a horizontal rectangle carrying a white, all-caps, bold title, placed at the top or bottom; used to state the theme or conclusion, not for ordinary section decoration.
 - **Bottom red conclusion bar**: used on map, award, and support-system pages, holding a large number or one promise; serves as the reading endpoint, kept as a short, high-contrast phrase.
 - **Diagonally cut red cover block**: a red block covering the left side, cutting into the photo along a diagonal edge; suitable for cover/identity pages, not for repetition on every page.
 - **Black-and-white photo frames**: grayscale portrait or scene photos, which may be full-bleed rectangular, half-page, or circularly cropped, serving the red-black-white brand contrast.
 - **Circular crop components**: used for three-way parallel evidence, may hold photos, headshots, or red graphic symbols; evenly spaced with no heavy outlines added.
 - **Handwriting-style labels**: used for group names, emotional phrases, and chart horizontal-band captions; used only for short phrases — cannot replace formal titles and body text.
 - **Badge/logo wall**: preserves external logos in their original form, arranged around the red theme bar; logo sizes adjusted by visual weight.
 - **Simple graphic icons**: including red arrows, grids, and flattened, simplified symbols such as people/globe; icons must be large, few, and conceptually clear; avoid colorful icon sets.
 - **Map annotations**: gray map base + red dots + thin lines + city labels; not suitable for complex geographic data encoding.
 - **Dividers and overlays**: use black horizontal bands, red rectangles, and dark areas of photos; do not use shadowed cards or glassmorphism.
 ## 10. Texture and Prohibited Items
 Keep it flat, high-contrast, and consulting-style restrained; decoration comes only from color blocks, photo cropping, circular composition, and font hierarchy.
 - **Prohibited**:
  - Large colorful illustrations, emoji, 3D graphics, glow, neon, complex textures, glassmorphism, skeuomorphic buttons.
  - Multi-color icon sets, rainbow-style charts, fancy gradient backgrounds.
  - Large centered blocks of copy, long paragraphs filling a red background, low-contrast gray body text.
  - A large logo repeated on every page, complex navigation bars, social-media-card-style sticker decoration.
 - **Use with caution**:
  - Shadows: the source file barely relies on shadows; do not add them proactively except for effects already inherent in external badges.
  - Rounded corners: circular crops are usable, but rounded card corners are not the primary style.
  - Colorful logos/badges: preserved only as external evidence in their original form; not expanded into the page's color scheme.
  - Handwriting-style font: used only for short labels and emotional slogans; overuse weakens the consulting feel.
  - Large-area photos: must be black-and-white or low-saturation, ensuring text readability.
 - **Usable on special pages**:
  - Full-page red background: used for transitions, back cover, and strong slogans, not for carrying information-dense body text.
  - Full-bleed black-and-white photo: used for culture statements or emotional closure, paired with large white text or a red conclusion bar.
  - Diagonally cut red cover block: used for establishing identity at the opening; should not become the template for all content pages.
 ## 11. Generation Checklist
 - Skeleton: is it landscape widescreen; is the white-background/red-bar/black-and-white-photo structure preserved; is there no forced table-of-contents navigation or watermark.
 - Copy: is there one thesis per page; is the title short, direct, and inclined toward all-caps; is the body text bulleted, with keywords bolded rather than randomly colored.
 - Hierarchy: do the main title, slogan/number, body text, labels, and footnotes form a clear relative proportion; is key information avoided in small, hard-to-read text.
 - Color: is red + black/white/gray the primary palette; are external logo/badge colors confined to the evidence area; is there no competition among multiple primary colors.
 - Layout: is a real layout chosen based on content — image-left/text-right, map+conclusion bar, red-background slogan, three-circle parallel, logo wall, chart+band, etc.; is mixing multiple templates avoided.
 - Charts: are they concise, with few series, weak grids, and red emphasis; has a promotional page avoided becoming a complex dashboard.
 - Tables: if a table is used, is it white-background with thin gray lines, with red only highlighting the header/summary; is there no heavy grid or multi-colored background.
 - Components: do the red title band, bottom conclusion bar, circular crops, and black-and-white photos serve information function rather than piling up as decoration.
 - Prohibited items: is there no emoji, 3D, glow, complex gradients, colorful icon sets, glassmorphism, or large centered copy.
 - Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, photos occluding text, empty placeholders, stretched proportions, distorted logos, and monotonous rhythm from template repetition.
@@ -0,0 +1,127 @@
 # Culture Collage · Cultural Collage STYLE DESIGN SYSTEM
 > Intended homepage tag: Promotion
 > Visual metaphor: contemporary culture poster + tactile editorial collage
 ## 1. Style Positioning
 Suitable for culture festivals, city events, brand collaborations, exhibition recruitment, community promotion, and partner invitations. The pages feel like a series of contemporary culture posters that can be flipped through continuously: bold typography, cropped imagery, paper-piece color blocks, offset numbering, and handcrafted textures together build the mood, while information can still be found quickly.
 Underlying principles:
 1. Each page first creates a clear feeling, then lets the date, venue, programs, and actions fall naturally into place.
 2. The collage must be organized around a theme, a route, or a rhythm — no piles of random stickers.
 3. Type, color blocks, and image scale must form a clear hierarchy; key facts must not hide inside artistic effects.
 4. A single page uses at most one primary color and one contrast color — avoid equating "youthful" with full color.
 5. When the event is a fictional concept, use only original abstract imagery, licensed assets, or honest placeholders — do not appropriate existing brand visuals.
 ## 2. Page Skeleton
 16:9 landscape. Elements may have controlled bleed and offset, but all key information must stay within the safe area. The background switches among cream white, ink black, and a single high-saturation color.
 Pages do not fix a traditional title bar. The title may run vertically, span columns, or sit close to the main image, but every page still needs a clear first reading point. Dates, page numbers, and route numbers serve as stable navigation, fixed at edges or corners.
 The cover is like the main poster: the event name occupies 35%–55% of the frame, paired with one original key visual and one concrete invitation. The body forms a fast-slow rhythm among program collages, route posters, schedule strips, ticketing info, and partner actions.
 ## 3. Content Organization
 Titles use invitations or statements the audience could say out loud, such as "Seven nights to hear the city anew." Subtitles add the date, venue, or how to participate.
 Each page carries at most one main narrative and 3–5 essential facts. Use short sentences, dates, verbs, and direct labels — no long brand manifestos.
 Content is organized as "get attracted — understand the experience — choose a route — plan participation — check participation requirements or eligibility — act now". Production notes, promotional strategies, and design remarks from the organizer's perspective must not appear on audience-facing pages.
 ## 4. Content Page Layout System
 ### A. Main Poster Page
 The event name, date, and one invitation sentence form the large typography, with the key visual occupying more than half. Information is sparse and clear — do not list every program and partner on the cover.
 ### B. Program Collage Page
 Form a group of 3–5 images or color blocks at different scales, with program counts and categories embedded in the composition as large numerals. Each category keeps only its name, count, and one representative action.
 ### C. Themed Route Page
 Present the three themed routes as three visual trajectories in different directions, each with one experience description, its main programs, and the suitable audience. The three routes need not be equal-width cards, but they must be comparable.
 ### D. City Schedule Page
 Organize dates and venues with a horizontal seven-day rhythm strip or a four-zone map. Highlight key sessions by enlarging type size or using cropped color blocks — do not use dense calendar tables.
 ### E. Participation Info Page
 Ticket prices, free-admission ratio, capacity, and how to register are arranged around one main image. Numbers must be clear — rotation, textures, or occlusion must not sacrifice their readability.
 ### F. Partners & Action Page
 The left side states what partners can take part in; the right side gives promotional assets, deadlines, and a clear contact action. The ending must be a concrete verb such as "Register / Submit / Contact / Attend" — no vague thank-yous.
 ## 5. Color System
 - Cream paper #F3E8D4: the light main background.
 - Ink black #171717: titles, body text, and dark pages.
 - Poster orange #F05A38: main invitations, dates, and energy focal points.
 - Ultramarine #2557D6: routes, nighttime content, and contrasting information.
 - Acid lime yellow #D9F04A: very small amounts of highlight, stickers, and action prompts.
 - Pink mist #E8A7B3: secondary paper pieces and soft backgrounds.
 - Paper gray #B8B0A4: captions, page numbers, and textures.
 A page uses cream paper/black as its base and picks only orange or ultramarine as the primary color; acid lime yellow covers less than 5% of the page. Rainbow gradients, purple-pink neon, and multiple high-saturation colors evenly distributed are forbidden.
 ## 6. Fonts and Text Hierarchy
 Chinese pairs MiSans Bold with MiSans; English titles use Archivo Black (a compact ultra-heavy grotesk, via customFonts), body uses Liter; when necessary, Unna may serve as very short cultural footnotes. At most three typeface roles.
 - Event name: 6–9x body text; may break across lines, but the main word must not be split.
 - Page title: 2.5–4x body text.
 - Dates and key numbers: 3–6x body text.
 - Program labels: 1–1.3x body text.
 - Descriptions and ticketing: 1x; must remain comfortably readable.
 - Page numbers and footnotes: 0.6–0.75x.
 A small amount of text may be rotated 90 degrees as navigation, but body text, prices, dates, and action information must never be rotated. Do not use handwriting-style fonts to carry key information.
 ## 7. Chart Language
 Promotional pages do not use business charts by default. Quantitative relationships are preferably expressed through big numbers, proportional strips, program matrices, time rhythms, and zone distributions.
 When comparison is needed, use directly labeled single-series bars, stacked strips, or bubbles, with no redundant axes. Data graphics should blend into the poster layout, but values must remain precise.
 Do not use 3D pie charts, dashboards, complex radar charts, or waveform decorations that carry no information.
 ## 8. Tables and High-Density Information
 Schedules and partner information use editorial-style lists: generous line spacing, clear dates, venues, and program names — no Excel-style full borders.
 Key sessions may be emphasized with a poster-orange block or a thick black underline; other items stay black and white. A full schedule of more than 10 entries should not be shrunk to cram into one page — present selectable main threads and the registration entry instead.
 Ticket prices and capacity must appear in normal orientation at large type sizes. Partnership benefits are not built into a pricing-card wall.
 ## 9. Components and Graphic Elements
 Stable components include cropped photo frames, torn-edge paper pieces, misregistered overprints, route arrows, date stamps, oversized numerals, short underlines, and small starbursts.
 Use at most two texture techniques per page. Torn edges, grain, and misregistration are only light tactile touches and must not reduce the clarity of text or photos.
 The key visual may consist of original abstract photography, object close-ups, paper sculpture, or geometric constructions. If people appear, they must come from usable assets, without fabricated identities, quotes, or stories.
 ## 10. Texture and Forbidden Items
 The whole should feel like a complete visual identity from an independent cultural institution: tactile, rhythmic, with a clear invitation. The anti-template feel comes from composition and scale, not deliberate messiness.
 Forbidden: random sticker packs, full-page torn paper, stacked retro filters, purple-blue neon, emoji arrays, social-media UI mockups, rounded-card walls, irrelevant trendy people, stolen brand posters, occluded key information, and mood with no way to participate.
 ## 11. Generation Checklist
 - Does the cover communicate the event name, date, and appeal within 3 seconds?
 - Do the six pages form a continuous path from attraction to actual participation?
 - Does every image, color block, and numeral in the collage serve the theme or navigation?
 - Are date, venue, price, capacity, and actions complete and readable?
 - Does each page keep a single primary color without devolving into a rainbow poster?
 - Are original/usable visuals used, without appropriating existing brands or fabricating people's stories?
 - Are card walls, social UI, random stickers, and vague brand manifestos avoided?
 - Have bleed safety, text occlusion, rotation misuse, overlap, cropping, and garbled text been checked?
 - No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions
 - No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion
--- a/Show More
+++ b/Show More