④段整套同步（六节＋ P/S/F/J ＋模板）＋ open-design 移到技能根

一、④段整套同步（用户选候选 A） - 新增 `references/stage-proto-doc/assets/产品文档模板.html`（16 KB／247 行，从备份拷、转 LF）。 - ④段 SKILL.md 换成备份 15:28 那版，并按模板口径改齐： · 「产品文档框架」从「四块＋一附录」改成**六节** —— 页面结构／功能清单／使用场景／操作流程／跨页与界面状态／待确认与偏离；与模板同构，⛔ 不从空白页重写结构。 · 编号从 R/S/F 改成 **P 页面／S 场景／F 功能／J 二级功能**，各自唯一、按展示顺序通排。 · 保留旧版有价值的要求：每项功能补齐做什么／入口在哪／输入边界／异常与恢复；重点功能三处标红；横向流程图每步写清页面／功能／操作／完成判据。 · 完成标准「七节」→「六节」，自查清单同步换掉「需求」那批条目，补模板与配图两条。 · 路径 `designs/<项目>/` → `docs/pm/<项目>/ui/`（2 处）。 · 补回本机那条「每份产出文档开头都要有一张图」的引用（指向主 skill，段内不复述）。 - 主 skill 同步：四段结构表④行、④段沿革、画图小节（④段画页面结构图＋用户路径）。二、open-design 移到技能根（用户选候选 A） - `git mv product-planning/references/stage-delivery/assets/open-design → open-design/`（4178 文件）。 - `.gitignore` 白名单加 `!/open-design/` —— 否则移出去就不再纳入版本控制。 - 引用改 11 处：路径形态 `assets/open-design/...` → `<技能根>/open-design/...`；「随段携带的自带件」改称「同根技能」；「路径怎么找」那条改成自带件（段内相对路径）与同根技能（`<技能根>/<技能名>/`）两类分开写。 - open-design 自己的 ATTRIBUTION.md 两处同步（它现在与 oil-ui-pro 同层）。 - 副作用（有益）：命名闸门读数由 2063 降到 225 —— 此前它把 open-design 里 919 个第三方 md 当成规则一起扫了；现在只扫本包 23 个 md。已确认④段的 H1 与 4a/4b/4c 子步仍在检查范围内。三、验收 - check_naming.py --ws E:/ProgramData/AIProject/contentm_agent ＝通过 225 / 失败 0 / 提示 27。 - 活文件里 `assets/open-design` 残留 0；工作区 CRLF 文件 0。
2026-10-15 21:17:28 +08:00
1 parent fa0a9026c8
commit 5afeb6b78a
@@ -0,0 +1,233 @@
+---
+name: kami-landing
+description: >
+  Produce a print-grade single-page kami (紙 / 纸) document — warm
+  parchment canvas, ink-blue accent, serif at one weight, no italic,
+  no cool grays. The output reads like a professional white paper or
+  studio one-pager, not an app UI. Multilingual by design (EN ·
+  zh-CN · ja). One self-contained HTML file, zero dependencies.
+triggers:
+  - kami
+  - 紙
+  - 纸
+  - paper one-pager
+  - 白皮书
+  - white paper
+  - parchment landing
+  - editorial document
+  - print-grade page
+  - kami landing
+od:
+  category: brand-page
+  surface: web
+  mode: prototype
+  platform: desktop
+  scenario: marketing
+  audience: founders, design studios, OSS maintainers, researchers
+  tone: editorial, restrained, print-first
+  scale: viewport-anchored long-form single page
+  preview:
+    type: html
+    entry: index.html
+    reload: debounce-100
+  design_system:
+    requires: false
+  craft:
+    requires:
+      - typographic-rhythm
+      - pixel-discipline
+inputs:
+  - id: brand
+    label: Brand identity
+    description: Name, tagline, location, edition / version, primary URL.
+  - id: hero
+    label: Hero / cover block
+    description: Eyebrow + headline (one line, ≤ 6 words at display size) + tagline + 3 hero meta tokens.
+  - id: manifesto
+    label: Manifesto paragraph + signature
+  - id: metrics
+    label: 3-6 metric tiles (value · label · sub)
+  - id: chapters
+    label: 3-5 numbered chapters (title + lede + body)
+  - id: footer
+    label: License · year · contact + 3-column site index
+parameters:
+  output_format:
+    type: enum
+    values: [standalone-html]
+    default: standalone-html
+  language:
+    type: enum
+    values: [en, zh-CN, ja]
+    default: en
+    description: >
+      Sets the primary serif stack on `:root`. EN uses Charter,
+      zh-CN uses TsangerJinKai02 / Source Han Serif, ja uses
+      YuMincho. Mixed-script content is allowed inline; the browser
+      resolves per-glyph fallback automatically.
+outputs:
+  - path: <out>/index.html
+    description: Self-contained HTML, kami CSS inlined, zero JS, zero external dependencies beyond Google Fonts.
+capabilities_required:
+  - file-write
+example_prompt: |
+  Build me a kami-style one-pager for "Lumen Field", an indie studio
+  shipping a soundscape app for focus. Hero headline "Soundscapes for
+  focused work.", manifesto paragraph + signature "by Lumen Field,
+  Berlin", 3 metric tiles (12 soundscapes / 4 presets / 1 daily ritual),
+  three numbered chapters covering the studio, the app, and the roadmap.
+  English-language stack.
+---
+
+# kami-landing
+
+Produce a single-page document in the **kami (紙 / 纸)** design system.
+The aesthetic borrows from editorial print, technical white papers,
+and old typewritten correspondence — the goal is *good content on
+good paper*, not *modern app UI*.
+
+> **Design system source of truth:** [`design-systems/kami/DESIGN.md`](../../design-systems/kami/DESIGN.md).
+> Read it before shipping. Tokens, type rules, the "ten invariants",
+> and forbidden colors all live there.
+
+## What you get
+
+A single self-contained HTML file with:
+
+- **Warm parchment canvas** (`#f5f4ed`) — never `#ffffff`.
+- **Single chromatic accent** — ink-blue (`#1B365D`), used on the
+  section number, the headline accent word, the left rule of the
+  manifesto, and the metric values. Anywhere else, ink-blue must
+  cover ≤ 5% of the document surface area.
+- **Serif at one weight (500) for hierarchy** — Charter (EN),
+  TsangerJinKai02 / Source Han Serif (CN), or YuMincho (JA),
+  selected by the `language` parameter. **No italic anywhere.**
+- **Tight print rhythm** — line-heights 1.10–1.55, letter-spacing
+  per language (0 for EN, 0.35px for CN, 0.02em for JA).
+- **Numeric stacks set in `font-variant-numeric: tabular-nums`** so
+  metric columns and pagination digits sit cleanly aligned.
+- **Depth via 1px rings + whisper shadows** (`0 4px 24px rgba(0,0,0,0.05)`).
+  No hard drop shadows, no neumorphism, no backdrop-filter blurs.
+- **Tag fills as solid hex** (e.g. `#E4ECF5`), never `rgba()` —
+  print renderers double-paint alpha tags.
+- **Responsive** at 1280 / 980 / 768 / 560.
+
+## Page structure
+
+```text
+1. Eyebrow row     — locale switcher · edition · version (12px sans uppercase)
+2. Hero            — display headline (96–106px serif 500), tagline (21px),
+                     three hero-token chips (paper-tinted)
+3. Manifesto       — pull paragraph in serif 400, 20px, 1.65 LH, with
+                     ink-blue left-rule and signature footer
+4. Metrics row     — 3-6 cells: value (24px serif 500 ink-blue, tabular-nums),
+                     label (12px serif 500 olive)
+5. Chapters        — numbered (`01`, `02`, …) ink-blue serif 500 14px,
+                     section title 28-32px, body 14-15px
+6. Footer          — kicker word (mega serif 500), license · year · contact,
+                     three-column site index in 12px serif 500
+```
+
+## Workflow contract
+
+### 1. Gather brand brief
+
+Use `AskQuestion` (or equivalent) to collect the brand brief in
+chunks. Don't dump the whole input list on the user; ask in two
+rounds:
+
+1. Identity round — name, tagline, location, edition / version,
+   primary URL, dominant language.
+2. Content round — manifesto paragraph + signature, 3-6 metric
+   tiles, 3-5 chapter (title + lede + body) entries.
+
+### 2. Pick the language stack
+
+The `language` parameter controls which `--serif` stack is set on
+`:root`. Pick based on the dominant language of the manifesto and
+chapter body copy:
+
+| `language` | `--serif`                                                 | Notes                                  |
+| :--------- | :-------------------------------------------------------- | :------------------------------------- |
+| `en`       | Charter, Georgia, Palatino, Times New Roman, serif         | default                                |
+| `zh-CN`    | TsangerJinKai02, Source Han Serif SC, Songti SC, Georgia   | letter-spacing 0.35px on body          |
+| `ja`       | YuMincho, Hiragino Mincho ProN, Source Han Serif JP        | also override `--olive` to `#4d4c48` (YuMincho strokes are thinner) |
+
+Inline mixed-script content is fine — the browser per-glyph fallback
+chain handles it. Do **not** chain all three families inside one
+`font-family` declaration; that dilutes character.
+
+### 3. Write `index.html`
+
+Output a single file with all CSS inline. Mirror the structure of
+[`example.html`](./example.html) and use only the tokens from
+`design-systems/kami/DESIGN.md`. Do **not** invent new colors,
+weights, or font families.
+
+Component primitives the agent can drop in (all defined in the
+example's `<style>` block):
+
+- `.eyebrow`, `.label` — sans-serif overlines
+- `.metric` — value + label vertical pair
+- `.section-num` + `.section-title` + `.section-lede`
+- `.tag.standard`, `.tag.brush` — solid-hex tags (one brush max per page)
+- `.quote` — left-rule serif 500 quote
+- `ul.dash` — en-dash bullets in ink-blue
+- `.code` — ivory-bg, 1px-border code block
+- `.footer-kicker` — mega serif 500 word
+
+Tag every editable element with `data-od-id="<unique-slug>"` so the
+host app's comment mode can target it.
+
+### 4. Self-check before delivering
+
+- [ ] Page background is parchment (`#f5f4ed`), never `#ffffff`.
+- [ ] Ink-blue (`#1B365D`) covers ≤ 5% of visible surface — count
+      section numbers, the manifesto rule, the metric values, the
+      headline accent. Total ≤ 5%.
+- [ ] All grays are warm (R ≈ G > B). No `slate-*`, no `#f3f4f6`.
+- [ ] Serif weight stays at 500 — no `font-weight: 700` or `900`
+      anywhere on serif text.
+- [ ] No `font-style: italic` anywhere. Emphasis swaps to ink-blue
+      color or a `.tag` instead.
+- [ ] All numeric stacks (metric values, pagination, dates, financial
+      figures) carry `font-variant-numeric: tabular-nums`.
+- [ ] All tag fills are solid hex (e.g. `#E4ECF5`), never `rgba()`.
+- [ ] Shadows: at most a `1px` ring or a `0 4px 24px rgba(0,0,0,0.05)`
+      whisper. No hard drop shadows.
+- [ ] Headline ≤ 6 words at display size; CJK ≤ 8 characters.
+- [ ] At 768px and 560px the layout collapses to one column without
+      horizontal scroll.
+
+## Files in this skill
+
+```text
+design-templates/kami-landing/
+├── SKILL.md                 # this contract
+├── README.md                # human quick-start
+└── example.html             # canonical OpenDesign rendering
+```
+
+## Boundaries
+
+- **Do not** invent new colors or typefaces. The kami palette is
+  fixed; if a brief demands a brand color, push back or render the
+  brand color as a single `.tag.brush` accent.
+- **Do not** introduce a second accent color. Pick ink-blue or pick
+  nothing.
+- **Do not** mix all three font stacks in one declaration; pick the
+  dominant language, override `--serif` on `:root`, and let the
+  browser per-glyph fallback resolve mixed-script inline content.
+- **Do not** use `rgba()` for tag fills — print renderers
+  double-paint alpha tags. Use the pre-blended solid hex from the
+  table in `design-systems/kami/DESIGN.md` §2.
+- **Do not** add JavaScript for animation. The page is paper, not
+  an app — motion belongs to the reader scrolling.
+
+## See also
+
+- [`design-systems/kami/DESIGN.md`](../../design-systems/kami/DESIGN.md) — the full token spec.
+- [`design-templates/kami-deck/`](../kami-deck/) — sister skill that produces a
+  slide deck in the same kami language.
+- Upstream: [`tw93/kami`](https://github.com/tw93/kami) — original
+  Claude skill (MIT) that the design system adapts.