# AGENTS.md — @app/design-tokens

## 职责

Monorepo 共享 **CSS 设计令牌**（Tailwind CSS v4 + shadcn/ui 语义色）。无 JS，构建只是把 `tokens.css` 拷到 `dist/`。

## 结构

```
src/tokens.css      # 唯一真源
scripts/build.mjs   # copy → dist/tokens.css
scripts/clean.mjs
README.md
```

## 消费方式

```css
@import "tailwindcss";
@import "@app/design-tokens/tokens.css";
```

（`web/src/styles/globals.css` 已如此。）导出：`.` 与 `./tokens.css`。

## 设计语义（改令牌前必读）

- 近黑中控 + 信号黄；**小圆角**（3–12px，拒绝大圆角 SaaS）；数字等宽。
- 亮色/暗色两套：`:root, .light` 与 `.dark`。
- 语义变量：`--paper` `--panel` `--sink` `--line` `--line-strong` `--ink` `--ink-2` `--ink-3` `--edge`（及 `--edge-*` 派生）`--err` `--ok` `--warn`。
- 同时映射 shadcn 名：`--color-background` `--color-primary` `--color-border` 等，供 `ui/*` 组件使用。
- 视觉方向的更高层说明见根目录 `DESIGN.md`（注意：DESIGN 色值与 tokens 现值不完全一致时，**以 `tokens.css` 为准**）。

## 修改指南

- 只改 `src/tokens.css`，然后 `yarn workspace @app/design-tokens build`。
- 新增语义色：同时补 `.light` / `.dark`，并按需映射 `--color-*`。
- 不要在组件里 `@import` 单个片段或复制色值；一律用 CSS 变量。
- 圆角保持小尺度（sm 3px / md 6px / lg 8px / xl 12px），禁止大圆角 SaaS 卡。

## 命令

```bash
yarn workspace @app/design-tokens build
yarn workspace @app/design-tokens clean
```