Minimalist Essential 极简 essentials

/* Default = minimalist-essential — 只链接这一份即最快 apply */
/* Minimalist Essential 极简 essentials — 删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务 */
/* 语义变量与 --theme-* 别名双发;字体/圆角透传源令牌 */

:root,
[data-theme="minimalist-essential"],
.theme-minimalist-essential {
  color-scheme: light;
  --bg: #FAFAF8;
  --theme-bg: #FAFAF8;
  --bg-deep: #F1F0EC;
  --theme-bg-deep: #F1F0EC;
  --surface: #FFFFFF;
  --theme-surface: #FFFFFF;
  --surface-2: #F4F3EF;
  --theme-surface-2: #F4F3EF;
  --border: #E8E6E1;
  --theme-border: #E8E6E1;
  --ink: #111111;
  --theme-ink: #111111;
  --ink-muted: #6B6B6B;
  --theme-ink-muted: #6B6B6B;
  --ink-dim: #B5B5B5;
  --theme-ink-dim: #B5B5B5;
  --accent: #0F62FE;
  --theme-accent: #0F62FE;
  --accent-2: #0043CE;
  --theme-accent-2: #0043CE;
  --on-accent: #FFFFFF;
  --theme-on-accent: #FFFFFF;
  --red: #C81E1E;
  --theme-red: #C81E1E;
  --green: #1E7E34;
  --theme-green: #1E7E34;
  --blue: #0F62FE;
  --theme-blue: #0F62FE;
  --purple: #8E4EC6;
  --theme-purple: #8E4EC6;
  --link: #0F62FE;
  --theme-link: #0F62FE;
  --code-bg: #141414;
  --theme-code-bg: #141414;
  --shadow: 0 1px 2px rgba(0,0,0,.06);
  --theme-shadow: 0 1px 2px rgba(0,0,0,.06);
  --radius-lg: 10px;
  --theme-radius-lg: 10px;
  --radius-md: 10px;
  --theme-radius-md: 10px;
  --radius-sm: 6px;
  --theme-radius-sm: 6px;
  --font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --theme-font-mono: "JetBrains Mono", ui-monospace, monospace;
}

/* Minimalist Essential 极简 essentials — 全部变体 + 基础 chrome */
/* 删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务 */
/* 含 :root:单主题整站直接链接本文件 */

:root,
[data-theme="minimalist-essential"],
.theme-minimalist-essential {
  color-scheme: light;
  --bg: #FAFAF8;
  --theme-bg: #FAFAF8;
  --bg-deep: #F1F0EC;
  --theme-bg-deep: #F1F0EC;
  --surface: #FFFFFF;
  --theme-surface: #FFFFFF;
  --surface-2: #F4F3EF;
  --theme-surface-2: #F4F3EF;
  --border: #E8E6E1;
  --theme-border: #E8E6E1;
  --ink: #111111;
  --theme-ink: #111111;
  --ink-muted: #6B6B6B;
  --theme-ink-muted: #6B6B6B;
  --ink-dim: #B5B5B5;
  --theme-ink-dim: #B5B5B5;
  --accent: #0F62FE;
  --theme-accent: #0F62FE;
  --accent-2: #0043CE;
  --theme-accent-2: #0043CE;
  --on-accent: #FFFFFF;
  --theme-on-accent: #FFFFFF;
  --red: #C81E1E;
  --theme-red: #C81E1E;
  --green: #1E7E34;
  --theme-green: #1E7E34;
  --blue: #0F62FE;
  --theme-blue: #0F62FE;
  --purple: #8E4EC6;
  --theme-purple: #8E4EC6;
  --link: #0F62FE;
  --theme-link: #0F62FE;
  --code-bg: #141414;
  --theme-code-bg: #141414;
  --shadow: 0 1px 2px rgba(0,0,0,.06);
  --theme-shadow: 0 1px 2px rgba(0,0,0,.06);
  --radius-lg: 10px;
  --theme-radius-lg: 10px;
  --radius-md: 10px;
  --theme-radius-md: 10px;
  --radius-sm: 6px;
  --theme-radius-sm: 6px;
  --font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --theme-font-mono: "JetBrains Mono", ui-monospace, monospace;
}

/* 基础 chrome(opt-in):<body class="theme-apply"> 或 [data-theme-apply] 上底色与基础件 */
.theme-apply,
[data-theme-apply] {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body, system-ui, sans-serif);
  line-height: 1.6;
}

.theme-apply a,
[data-theme-apply] a {
  color: var(--link, var(--accent));
}

.theme-apply code,
.theme-apply pre,
[data-theme-apply] code,
[data-theme-apply] pre {
  font-family: var(--font-mono, ui-monospace, monospace);
  background: var(--code-bg, var(--surface2, var(--surface)));
  border-radius: var(--radius-sm, 4px);
}

.theme-apply .panel,
[data-theme-apply] .panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 6px);
  box-shadow: var(--shadow, 0 1px 2px rgba(0,0,0,.06));
}

.theme-apply .btn-primary,
[data-theme-apply] .btn-primary {
  background: var(--accent);
  color: var(--on-accent);
  border-radius: var(--radius-sm, 4px);
}

/* Minimalist Essential 极简 essentials · 共存版:只出 [data-theme] / .theme-<id> 作用域,不含 :root
   多主题应用(站点自带主题切换器)用这一份,避免全局覆盖项目自己的 token;
   单主题直接应用请用 css/default.css。color-scheme 只在 [data-theme] 块里给。 */

[data-theme="minimalist-essential"],
.theme-minimalist-essential {
  color-scheme: light;
  --bg: #FAFAF8;
  --theme-bg: #FAFAF8;
  --bg-deep: #F1F0EC;
  --theme-bg-deep: #F1F0EC;
  --surface: #FFFFFF;
  --theme-surface: #FFFFFF;
  --surface-2: #F4F3EF;
  --theme-surface-2: #F4F3EF;
  --border: #E8E6E1;
  --theme-border: #E8E6E1;
  --ink: #111111;
  --theme-ink: #111111;
  --ink-muted: #6B6B6B;
  --theme-ink-muted: #6B6B6B;
  --ink-dim: #B5B5B5;
  --theme-ink-dim: #B5B5B5;
  --accent: #0F62FE;
  --theme-accent: #0F62FE;
  --accent-2: #0043CE;
  --theme-accent-2: #0043CE;
  --on-accent: #FFFFFF;
  --theme-on-accent: #FFFFFF;
  --red: #C81E1E;
  --theme-red: #C81E1E;
  --green: #1E7E34;
  --theme-green: #1E7E34;
  --blue: #0F62FE;
  --theme-blue: #0F62FE;
  --purple: #8E4EC6;
  --theme-purple: #8E4EC6;
  --link: #0F62FE;
  --theme-link: #0F62FE;
  --code-bg: #141414;
  --theme-code-bg: #141414;
  --shadow: 0 1px 2px rgba(0,0,0,.06);
  --theme-shadow: 0 1px 2px rgba(0,0,0,.06);
  --radius-lg: 10px;
  --theme-radius-lg: 10px;
  --radius-md: 10px;
  --theme-radius-md: 10px;
  --radius-sm: 6px;
  --theme-radius-sm: 6px;
  --font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-body: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --theme-font-display: "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --theme-font-mono: "JetBrains Mono", ui-monospace, monospace;
}

/* 基础 chrome(opt-in):<body class="theme-apply"> 或 [data-theme-apply] 上底色与基础件 */
.theme-apply,
[data-theme-apply] {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body, system-ui, sans-serif);
  line-height: 1.6;
}

.theme-apply a,
[data-theme-apply] a {
  color: var(--link, var(--accent));
}

.theme-apply code,
.theme-apply pre,
[data-theme-apply] code,
[data-theme-apply] pre {
  font-family: var(--font-mono, ui-monospace, monospace);
  background: var(--code-bg, var(--surface2, var(--surface)));
  border-radius: var(--radius-sm, 4px);
}

.theme-apply .panel,
[data-theme-apply] .panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 6px);
  box-shadow: var(--shadow, 0 1px 2px rgba(0,0,0,.06));
}

.theme-apply .btn-primary,
[data-theme-apply] .btn-primary {
  background: var(--accent);
  color: var(--on-accent);
  border-radius: var(--radius-sm, 4px);
}

{
  "id": "minimalist-essential",
  "name": "Minimalist Essential 极简 essentials",
  "mode": "light",
  "signature": "删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务",
  "source": "themes/minimalist-essential.json",
  "colors": {
    "accent": "#0F62FE",
    "accent2": "#0043CE",
    "bg": "#FAFAF8",
    "bgDeep": "#F1F0EC",
    "blue": "#0F62FE",
    "border": "#E8E6E1",
    "codeBg": "#141414",
    "green": "#1E7E34",
    "ink": "#111111",
    "inkDim": "#B5B5B5",
    "inkMuted": "#6B6B6B",
    "link": "#0F62FE",
    "onAccent": "#FFFFFF",
    "purple": "#8E4EC6",
    "red": "#C81E1E",
    "shadow": "0 1px 2px rgba(0,0,0,.06)",
    "surface": "#FFFFFF",
    "surface2": "#F4F3EF"
  }
}

{
  "default": "minimalist-essential",
  "themes": [
    {
      "id": "minimalist-essential",
      "name": "Minimalist Essential 极简 essentials",
      "mode": "light",
      "path": "tokens/semantic/minimalist-essential.json",
      "default": true
    }
  ]
}

{
  "id": "minimalist-essential",
  "name": "Minimalist Essential 极简 essentials",
  "mode": "light",
  "signature": "删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务",
  "colors": {
    "bg": "#FAFAF8",
    "bgDeep": "#F1F0EC",
    "surface": "#FFFFFF",
    "surface2": "#F4F3EF",
    "border": "#E8E6E1",
    "ink": "#111111",
    "inkMuted": "#6B6B6B",
    "inkDim": "#B5B5B5",
    "accent": "#0F62FE",
    "accent2": "#0043CE",
    "onAccent": "#FFFFFF",
    "red": "#C81E1E",
    "green": "#1E7E34",
    "blue": "#0F62FE",
    "purple": "#8E4EC6",
    "link": "#0F62FE",
    "codeBg": "#141414",
    "shadow": "0 1px 2px rgba(0,0,0,.06)"
  },
  "fonts": {
    "body": "\"Inter\", system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
    "display": "\"Inter\", system-ui, \"PingFang SC\", \"Microsoft YaHei\", sans-serif",
    "mono": "\"JetBrains Mono\", ui-monospace, monospace"
  },
  "radius": {
    "lg": "10px",
    "md": "10px",
    "sm": "6px"
  },
  "derived": {
    "bg": "bg",
    "bgDeep": "bgDeep",
    "surface": "surface",
    "surface2": "surface2",
    "border": "border",
    "ink": "ink",
    "inkMuted": "inkMuted",
    "inkDim": "inkDim",
    "accent": "accent",
    "accent2": "accent2",
    "onAccent": "onAccent",
    "red": "red",
    "green": "green",
    "blue": "blue",
    "purple": "purple",
    "link": "link",
    "codeBg": "codeBg"
  },
  "a11y": {
    "contrast_min": 4.5,
    "pairs": {
      "ink/bg": 18.07,
      "onAccent/accent": 5.0
    },
    "adjusted": false,
    "notes": [
      "源里 --link 与 --accent 同为 #0F62FE(照源发;同屏同时出现时用 --accent-2 或下划线区分)"
    ]
  }
}

# Minimalist Essential 极简 essentials · 用法与配对规则

`minimalist-essential` · mode `light` · 默认变体 `minimalist-essential`

**signature**:删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务

- 原色表:`tokens/absolute.json`(源盘 `colors` 原样,不改名不近似)。
- 语义映射:`tokens/semantic/minimalist-essential.json`(`derived` 记每个语义键取自哪个源键;`a11y` 记对比度实测)。
- 变量双发:裸语义名(`--bg`)与 `--theme-` 前缀别名(`--theme-bg`)同值,便于接既有项目。
- 你不需要发明 hex:缺哪个角色就用对应变量,不要拿别的色近似。

## 变体表

| id | mode | 何时用 |
|---|---|---|
| `minimalist-essential` | `light` | **默认**;删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务 |

## 变量表(语义名 ↔ 前缀别名)

| 语义键 | CSS 变量 | 别名 |
|---|---|---|
| `bg` | `--bg` | `--theme-bg` |
| `bgDeep` | `--bg-deep` | `--theme-bg-deep` |
| `surface` | `--surface` | `--theme-surface` |
| `surface2` | `--surface-2` | `--theme-surface-2` |
| `border` | `--border` | `--theme-border` |
| `ink` | `--ink` | `--theme-ink` |
| `inkMuted` | `--ink-muted` | `--theme-ink-muted` |
| `inkDim` | `--ink-dim` | `--theme-ink-dim` |
| `accent` | `--accent` | `--theme-accent` |
| `accent2` | `--accent-2` | `--theme-accent-2` |
| `onAccent` | `--on-accent` | `--theme-on-accent` |
| `red` | `--red` | `--theme-red` |
| `green` | `--green` | `--theme-green` |
| `blue` | `--blue` | `--theme-blue` |
| `purple` | `--purple` | `--theme-purple` |
| `link` | `--link` | `--theme-link` |
| `codeBg` | `--code-bg` | `--theme-code-bg` |
| `shadow` | `--shadow` | `--theme-shadow` |

## 配对规则(谁配谁)

| 用途 | 变量 | 口径 |
|---|---|---|
| 正文 / 段落 | `--ink` | 页面主文字色,始终用于 `--bg` 之上 |
| 次要文字 | `--ink-muted` / `--ink-dim` | 说明、元信息、时间戳;`--ink-muted` 比 `--ink-dim` 更接近正文 |
| 卡面 / 面板 | `--surface` + `--border` | 卡底用 `--surface`,描边用 `--border`;需要抬升时 `--surface-2` |
| 主按钮 | `--accent` + `--on-accent` | 一个视区只放一个主 CTA;文字色必须用 `--on-accent`(实测 5.00:1) |
| 链接 | `--link` | 链接一律用 `--link`;**强调色(`--accent`)不与链接同色** —— 本主题源里 `--link` 与 `--accent` 同为 `#0F62FE`;同屏同时出现时,链接补下划线或改用 `--accent-2`,按钮保持 `--accent` |
| 危险 / 破坏性 | `--red` | 删除、错误、警报 |
| 成功 | `--green` | 通过、已完成 |
| 页面底 | `--bg` / `--bg-deep` | 大底用 `--bg`,更深的分层用 `--bg-deep` |

一行口径:正文 `--ink`,次要 `--ink-muted`/`--ink-dim`,卡面 `--surface`+`--border`,主按钮 `--accent`+`--on-accent`,链接 `--link`,危险 `--red`,成功 `--green`;强调色不做链接色。

## 字体配方(源 `fonts` 透传)

| 角色 | 变量 | 栈 |
|---|---|---|
| `body` | `--font-body` | "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif |
| `display` | `--font-display` | "Inter", system-ui, "PingFang SC", "Microsoft YaHei", sans-serif |
| `mono` | `--font-mono` | "JetBrains Mono", ui-monospace, monospace |

- 标题用 `var(--font-display)`,正文 `var(--font-body)`,代码/数字 `var(--font-mono)`;字重与字号档位不在本包内,按下方 `do` 的约束落地。

## 圆角(源 `radius` 透传)

| 变量 | 值 |
|---|---|
| `--radius-lg` | 10px |
| `--radius-md` | 10px |
| `--radius-sm` | 6px |

## 推荐做法(源 `do`)

- 中性色做 90% 面积 + 1 个强调色只占 ≤10%，强调色只给主 CTA 与关键高亮
- 单无衬线家族 + ≤3 字重 + 等比字阶（12/14/16/20/24/32/48），Display 可用 clamp 流体
- 8pt 间距只用 4/8/16/24/32/48/64/96/128；section 上下只用 64/96/128（mobile 48/56/64）
- 单列信息流 + 大负空间 + 少而大的图 + 零装饰；正文单列 max-width 600-720px
- 首屏只答 1 个问题 + 只给 1 个主 CTA（落地页唯一可双 CTA 例外）
- 顶导 ≤5 项、深度 ≤3 层；超限进 mega / 着陆页 / 搜索 / 页脚
- 动效只动 transform/opacity：按压 100-150ms、切换 150-200ms、转场 200-300ms
- 内容多时靠折叠 + 搜索 + 本地导航 + 面包屑做密度极简，不靠留白最大化
- 留白占比 40-60% 是甜点，>75% 按空洞页返工

## 反模式(源 `dont`)

- 为白而白的空洞页：无层级的空 = 荒，不是极简
- 低对比浅灰字：正文 <4.5:1、大字 <3:1 直接返工
- 桌面端也藏导航（汉堡）：可找性 > 完整性
- 把粗野当极简：粗野是叛逆版，不是删到本质
- 一屏多 CTA 轰炸 / 自动轮播 / 弹窗
- 装饰三件套叠加：分割线 / 阴影 / 圆角只用最低值三选一
- 字族 >2、字重 >3 档；全站裸色值 / 裸 px（必须走 token）

## 对比度实测(WCAG,自写公式)

| 组合 | 实测 | 门槛 |
|---|---|---|
| `ink` on `bg` | 18.07:1 | ≥ 4.5:1 |
| `onAccent` on `accent` | 5.00:1 | ≥ 4.5:1 |

### 语义层留痕(透明记录)

- 源里 --link 与 --accent 同为 #0F62FE(照源发;同屏同时出现时用 --accent-2 或下划线区分)

## 应用片段

```css
/* 单主题:把 css/default.css 全文贴进项目,或在 <head> 里 link 它 */
/* 多主题共存:link css/themes.css,用 <html data-theme="minimalist-essential"> 决定何时生效(无 :root,不覆盖项目 token) */
```

```html
<html data-theme="minimalist-essential" class="theme-minimalist-essential" lang="zh-CN">
  <link rel="stylesheet" href="css/default.css">
```

## 来源 / Provenance

- (源 JSON 未登记来源)

---
name: minimalist-essential
description: "Minimalist Essential 极简 essentials(light 删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务)。触发:Minimalist Essential 极简 essentials / minimalist-essential / 删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务。不做整站重构。"

---

# minimalist-essential

让任何网页/面板变成 **Minimalist Essential 极简 essentials** 的样子,不用 agent 自己编 hex。

删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务

## When to use

- 用户点名 Minimalist Essential 极简 essentials / minimalist-essential / 删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务
- 需要整套配色(bg / bg-deep / surface / ink / accent / 状态色)而不是单个色值
- 需要 中性色做 90% 面积 + 1 个强调色只占 ≤10%，强调色只给主 CTA 与关键高亮
- 需要 单无衬线家族 + ≤3 字重 + 等比字阶（12/14/16/20/24/32/48），Display 可用 clamp 流体
- 需要 8pt 间距只用 4/8/16/24/32/48/64/96/128；section 上下只用 64/96/128（mobile 48/56/64）
- 需要 单列信息流 + 大负空间 + 少而大的图 + 零装饰；正文单列 max-width 600-720px
- 需要 首屏只答 1 个问题 + 只给 1 个主 CTA（落地页唯一可双 CTA 例外）
- 需要 顶导 ≤5 项、深度 ≤3 层；超限进 mega / 着陆页 / 搜索 / 页脚
- 需要 动效只动 transform/opacity：按压 100-150ms、切换 150-200ms、转场 200-300ms
- 需要 内容多时靠折叠 + 搜索 + 本地导航 + 面包屑做密度极简，不靠留白最大化
- 需要 留白占比 40-60% 是甜点，>75% 按空洞页返工

## When not to use

- 整站品牌设计系统(要自定义组件/字体体系)→ 用设计类 skill
- 别的主题族(用户点名其它风格)
- 为白而白的空洞页：无层级的空 = 荒，不是极简
- 低对比浅灰字：正文 <4.5:1、大字 <3:1 直接返工
- 桌面端也藏导航（汉堡）：可找性 > 完整性
- 把粗野当极简：粗野是叛逆版，不是删到本质
- 一屏多 CTA 轰炸 / 自动轮播 / 弹窗
- 装饰三件套叠加：分割线 / 阴影 / 圆角只用最低值三选一
- 字族 >2、字重 >3 档；全站裸色值 / 裸 px（必须走 token）

## Default

**`minimalist-essential`**(mode `light`)

| role | hex |
|---|---|
| `bg` | `#FAFAF8` |
| `bgDeep` | `#F1F0EC` |
| `surface` | `#FFFFFF` |
| `ink` | `#111111` |
| `accent` | `#0F62FE` |
| `link` | `#0F62FE` |
| `red` | `#C81E1E` |

## Sub-themes (id → when)

| id | mode | contrast | pick when |
|---|---|---|---|
| `minimalist-essential` | `light` | — | **默认**;删到不能再删：中性底 + 单强调色 + 8pt 网格 + 单列信息流；一屏一任务 |

## Files

| path | use |
|---|---|
| `tokens/absolute.json` | 源盘原色表(原样,含未参与语义映射的色) |
| `tokens/index.json` | 变体目录 + default |
| `tokens/semantic/minimalist-essential.json` | 语义映射 + `derived`(取源哪个键)+ `a11y`(对比度实测) |
| `css/default.css` | 默认变体一份,含 `:root`,最快 apply |
| `css/all.css` | 全部变体 + 基础 chrome,含 `:root` |
| `css/themes.css` | 共存版:同 all.css 但**无 `:root`**,只 `[data-theme]` / `.theme-<id>` 作用域 |
| `docs/usage.md` | 配对规则 / 字体配方 / 反模式(中文) |
| `preview/index.html` | `null`(本包无活预览) |

## Agent apply steps

1. **Pick variant** — 用户点名变体就用它;否则 `minimalist-essential`。
2. **Read tokens** — `tokens/semantic/minimalist-essential.json`(`colors` 是语义键,`derived` 说明它取自源盘哪个键)。
3. **写入 CSS 变量** — 项目已有 `--bg/--ink/--accent` 就沿用同名;否则整份贴,或同时写 `--theme-*` 别名。
4. **挂主题作用域** — `<html data-theme="minimalist-essential" class="theme-minimalist-essential">`;多主题站点用 `css/themes.css`。
5. **选文件** — 单主题 `css/default.css`;多主题 `css/all.css`(带 `:root`)或 `css/themes.css`(不带)。
6. **按角色套件**:
   - 页面底 → `--bg` / `--bg-deep`
   - 卡面面板 → `--surface` + `--border`
   - 正文 → `--ink`;次要 → `--ink-muted` / `--ink-dim`
   - 主按钮 → `--accent` + `--on-accent`(一屏一个 CTA)
   - 链接 → `--link`(**不**用 `--accent`,强调色不做链接色)
   - 危险 → `--red`;成功 → `--green`
7. **不要发明 hex** — 颜色只能来自 `tokens/absolute.json`;缺角色就跳过该变量。
8. **自检** — `python scripts/assert_tokens.py` 必须打印 `PASS assert_tokens minimalist-essential`。

### Minimal `:root` snippet (`minimalist-essential`)

```css
:root {
  color-scheme: light;
  --bg: #FAFAF8;
  --bg-deep: #F1F0EC;
  --surface: #FFFFFF;
  --surface-2: #F4F3EF;
  --border: #E8E6E1;
  --ink: #111111;
  --ink-muted: #6B6B6B;
  --ink-dim: #B5B5B5;
  --accent: #0F62FE;
  --accent-2: #0043CE;
  --on-accent: #FFFFFF;
  --red: #C81E1E;
  --green: #1E7E34;
  --blue: #0F62FE;
  --purple: #8E4EC6;
  --link: #0F62FE;
  --code-bg: #141414;
  --shadow: 0 1px 2px rgba(0,0,0,.06);
}
```

### HTML switch

```html
<html data-theme="minimalist-essential" class="theme-minimalist-essential">
  <link rel="stylesheet" href="css/default.css">
```

## Hard rules

- **Never** 为白而白的空洞页：无层级的空 = 荒，不是极简(源 `dont`)
- **Never** 低对比浅灰字：正文 <4.5:1、大字 <3:1 直接返工(源 `dont`)
- **Never** 桌面端也藏导航（汉堡）：可找性 > 完整性(源 `dont`)
- **Never** 把粗野当极简：粗野是叛逆版，不是删到本质(源 `dont`)
- **Never** 一屏多 CTA 轰炸 / 自动轮播 / 弹窗(源 `dont`)
- **Never** 装饰三件套叠加：分割线 / 阴影 / 圆角只用最低值三选一(源 `dont`)
- **Never** 字族 >2、字重 >3 档；全站裸色值 / 裸 px（必须走 token）(源 `dont`)

## Notes

- 预览:本包**无活预览**(`pack.json.files.preview = null`):源库无对应 demo 目录,按 `css/default.css` 与 `docs/usage.md` 落地即可
- 来源与语义层修正:`docs/usage.md` 末节。