@lark-apaas/coding-steering 0.1.70 → 0.1.71

package/steering/nestjs-react-fullstack/skills/design-guide/references/digital-e-guide.md

@@ -1,349 +0,0 @@
----
-version: alpha
-name: digital-e-guide
-name_zh: 暖陶刊物
-description: >
-  暖陶色数字刊物风响应式内容应用：奶油纸卡铺在暖陶粉径向渐变底上，相邻卡片轻微反向旋转，
-  营造"桌面上的杂志"质感。超大 Cormorant 衬线展示标题与斜体章节标题建立编辑层级，mono 仅用于
-  眉标、统计、页码、图例和表头等元信息，正文一律 DM Serif Text 衬线。马克红为主强调、暖橙
-  为次强调，发丝线分区、大量留白，圆角 4px 纸卡叠柔和长阴影。纸卡数量、内容顺序、分栏方式
-  与组件组合服从实际任务，不把来源中的封面、跨页或章节示例固化成页面骨架。
-colors:
-  background: "#d8c8c0"
-  card: "#faf3ea"
-  paper2: "#f4ecdf"
-  foreground: "#1f1c14"
-  muted-foreground: "#837964"
-  border: "#d3c9b3"
-  primary: "#c44a47"
-  primary-2: "#e07d52"
-typography:
-  title:
-    fontFamily: "'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "clamp(60px, 7.5vw, 92px)"
-    fontWeight: 700
-    lineHeight: 0.96
-    letterSpacing: "-0.01em"
-  displayHead:
-    fontFamily: "'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "44px"
-    fontWeight: 700
-    fontStyle: italic
-    lineHeight: 1
-    letterSpacing: "-0.005em"
-  insideHead:
-    fontFamily: "'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "36px"
-    fontWeight: 700
-    fontStyle: italic
-    lineHeight: 1
-  statNum:
-    fontFamily: "'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "36px"
-    fontWeight: 700
-    lineHeight: 1
-    letterSpacing: "-0.005em"
-  pullquote:
-    fontFamily: "'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "22px"
-    fontWeight: 700
-    fontStyle: italic
-    lineHeight: 1.2
-  deck:
-    fontFamily: "'DM Serif Text', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "16px"
-    fontStyle: italic
-    lineHeight: 1.5
-  body:
-    fontFamily: "'DM Serif Text', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "14.5px"
-    lineHeight: 1.6
-  tocItem:
-    fontFamily: "'DM Serif Text', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: "14.5px"
-    lineHeight: 1.4
-  monoLabel:
-    fontFamily: "'IBM Plex Mono', ui-monospace, 'PingFang SC', monospace"
-    fontSize: "10.5px"
-    lineHeight: 1
-    letterSpacing: "0.18em"
-    upper: true
-  statLabel:
-    fontFamily: "'IBM Plex Mono', ui-monospace, 'PingFang SC', monospace"
-    fontSize: "10px"
-    lineHeight: 1.4
-    letterSpacing: "0.16em"
-    upper: true
-  stepNum:
-    fontFamily: "'IBM Plex Mono', ui-monospace, 'PingFang SC', monospace"
-    fontSize: "12px"
-    fontWeight: 700
-    lineHeight: 1
-    letterSpacing: "0.08em"
-rounded:
-  card: "4px"
-spacing:
-  bodyPad: "60px 40px"
-  pageGap: "36px"
-  pagePad: "44px 44px 36px"
-  statsGap: "18px"
-  tocGap: "20px 36px"
-  colGap: "24px"
-components:
-  page:
-    description: "奶油纸卡：可按内容层级选择 card 或 paper2 底，4px 圆角，柔和双层长阴影；相邻卡可交替旋转 -0.6°/+0.6°"
-    background: "{colors.card}"
-    borderRadius: "{rounded.card}"
-    boxShadow: "0 30px 60px rgba(31,28,20,0.18), 0 4px 8px rgba(31,28,20,0.06)"
-    transform: "相邻纸卡可按 -0.6°/+0.6° 交替微旋，单卡场景任选一个方向"
-  eyebrow:
-    description: "眉标栏：mono 大写小字左右分布，左侧前置一个 primary 小圆点，下方 1px border 发丝线收口"
-    fontFamily: "{typography.monoLabel.fontFamily}"
-    color: "{colors.muted-foreground}"
-    borderBottom: "1px solid {colors.border}"
-    dot: "6px 圆点 background {colors.primary}"
-  coverTitle:
-    description: "主展示标题使用超大衬线与混合字重；可含一处斜体 primary 强调词，含 & 时可用 primary-2 斜体处理"
-    fontFamily: "{typography.title.fontFamily}"
-    color: "{colors.foreground}"
-    accentWord: "font-style italic, color {colors.primary}"
-    ampWord: "font-style italic, font-weight 500, color {colors.primary-2}"
-  author:
-    description: "作者署名条：mono 大写，muted-foreground 字，姓名部分 foreground 加重"
-    fontFamily: "{typography.monoLabel.fontFamily}"
-    color: "{colors.muted-foreground}"
-    nameColor: "{colors.foreground}"
-  stats:
-    description: "可选统计组：大 Cormorant 数字 + mono 大写小标签，上下 1px border 发丝线夹住；数量和列数按内容决定"
-    borderTop: "1px solid {colors.border}"
-    borderBottom: "1px solid {colors.border}"
-    numFont: "{typography.statNum.fontFamily}"
-    labelFont: "{typography.statLabel.fontFamily}"
-  toc:
-    description: "可选目录：条目使用斜体章名、点线 leader 与 mono 序号；列数按空间决定"
-    leader: "1px dotted {colors.muted-foreground}"
-    nameStyle: "italic, color {colors.foreground}"
-    pageNum: "{typography.monoLabel.fontFamily}, color {colors.muted-foreground}"
-  sticker:
-    description: "可选角落装饰贴纸：primary-2 实心圆，白字斜体衬线，旋转 8°，内嵌一圈虚线描边"
-    background: "{colors.primary-2}"
-    color: "#fff"
-    fontFamily: "{typography.insideHead.fontFamily}"
-    innerRing: "1px dashed rgba(255,255,255,0.5)"
-    transform: "rotate(8deg)"
-  spreadHead:
-    description: "内容区斜体标题，末词可用 primary 强调；换行方式由标题长度和可用宽度决定"
-    fontFamily: "{typography.displayHead.fontFamily}"
-    color: "{colors.foreground}"
-    accentWord: "{colors.primary}"
-  columns:
-    description: "章节内容可按关系并排或顺排；段落首字母 dropcap 为斜体 primary 大写字"
-    borderTop: "1px solid {colors.border}"
-    dropcap: "font 38px, float left, italic, color {colors.primary}"
-  steps:
-    description: "编号步骤行：mono primary 序号 + 衬线正文，行间 1px dashed border 分隔"
-    numColor: "{colors.primary}"
-    numFont: "{typography.stepNum.fontFamily}"
-    divider: "1px dashed {colors.border}"
-  pullquote:
-    description: "可选斜转引文卡：card 底、border 描边、柔和阴影、旋转 2.4°，超大 primary 开引号，mono 署名"
-    background: "{colors.card}"
-    border: "1px solid {colors.border}"
-    borderRadius: "{rounded.card}"
-    boxShadow: "0 8px 18px rgba(31,28,20,0.10)"
-    fontFamily: "{typography.pullquote.fontFamily}"
-    openQuote: "56px, color {colors.primary}"
-    byline: "{typography.monoLabel.fontFamily}, color {colors.muted-foreground}"
-    transform: "rotate(2.4deg)"
-  dataViz:
-    description: "折线/柱状/堆叠柱/环形/雷达图容器：paper2 底、border 网格发丝线、mono 图例；序列色按序取用（≤5 类）{colors.primary}→{colors.primary-2}→{colors.muted-foreground}→{colors.border}→foreground@20%，禁止渐变填充与 boxShadow"
-  table:
-    description: "数据表格：表头 mono 大写 muted-foreground + 1px border 底线，行间 1px border 发丝线分隔，无斑马纹填充，无阴影"
-  tag:
-    description: "状态标签徽标（如风险等级）：mono 大写小字胶囊，primary 描边+极淡底 或 muted-foreground 描边+极淡底二选一，不叠加其它色"
-  exercise:
-    description: "练习条/高亮提示框：primary 描边 + 极淡 primary 底，mono 描边标签胶囊 + 斜体正文。可用于练习、金句、结论或风险提示，同一内容区至多一处，无 boxShadow 不旋转"
-    border: "1px solid {colors.primary}"
-    background: "rgba(196,74,71,0.05)"
-    label: "{typography.monoLabel.fontFamily}, color {colors.primary}, border 1px solid {colors.primary}"
-    text: "{typography.deck.fontFamily}, italic, color {colors.foreground}"
-  footer:
-    description: "可选尾注：mono 大写小字左右分布（栏目名 / 页码或序号），顶部 1px border 发丝线"
-    borderTop: "1px solid {colors.border}"
-    color: "{colors.muted-foreground}"
-    fontFamily: "{typography.monoLabel.fontFamily}"
-anchors:
-  - id: twin-paper-cards
-    type: pattern
-    desc: "奶油纸卡铺在暖陶粉径向渐变底上，相邻卡片可交替微旋成桌面杂志感；排列方式按内容决定"
-  - id: mixed-weight-display-title
-    type: component
-    desc: "超大 Cormorant 衬线标题配混合字重与克制的斜体强调词（见 colors.primary）"
-  - id: mono-meta-system
-    type: pattern
-    desc: "mono 大写小字专用于眉标/署名/统计标签/目录页码/图例/表头/页脚，正文一律衬线"
-  - id: dotted-leader-toc
-    type: component
-    desc: "双列目录，斜体章名 + 点线 leader + mono 页码"
-  - id: pinned-pullquote
-    type: component
-    desc: "可置于内容边缘、旋转 2.4° 的斜转引文纸卡，超大开引号用强调色"
-  - id: accent-dropcap
-    type: component
-    desc: "正文段落可用斜体强调色大写 dropcap 建立刊物感"
-  - id: circular-sticker
-    type: component
-    desc: "可选暖橙实心圆贴纸，内嵌白色虚线圈并轻微旋转"
-gaps:
-  - "补充项：typography.fontFamily 末尾追加 Songti SC / Noto Serif SC / PingFang SC 作 CJK 兜底（源为纯拉丁字体栈），供中文渲染，需确认。"
-  - "深色模式未定义（源仅暖陶浅色纸底）。"
-  - "sans 字体族（-apple-system, system-ui, Inter）在源 :root 定义但实现中未实际使用，未收进 typography 角色。"
-  - "背景径向渐变的两处色停 #e8d4cc / #c79a8e 为装饰底噪，仅在 Layout 描述，未提升为命名 token。"
-  - "来源示例使用 540px × 740px 纸卡比例；接入网页时只作视觉参考，宽高必须按容器与内容自适应。"
-  - "封面/章节页正文（标题、目录、步骤、引文）均为示例文案，非风格 token。"
-  - "补充项：dataViz/table/tag 为本版新增组件规格，源文件未直接给出对应视觉稿，按已验证的色板/mono 语言外推，标注为补充项。"
-exceptions:
-  - "每个内容区至多使用一组斜体强调；标题中的强调词与紧邻的 & 号可视为同一组。"
-  - "纸卡（含章节重复卡）与引文卡是仅有的允许投影元素；引文卡、练习条各自最多一层小阴影/无阴影，dataViz/table/tag 禁止阴影。"
-  - "练习条底色 rgba(196,74,71,0.05) 是唯一允许的 primary 大面积（极淡）铺底。"
-  - "dataViz 多序列图表中 primary-2 可作为第二数据序列色使用，是色彩使用限制的场景化例外（仅限图表容器内）。"
----
-
-## Overview
-
-数字刊物风响应式内容应用，生活方式/创作者品牌刊物气质。奶油纸卡铺在暖陶粉径向渐变背景
-`{colors.background}` 上，相邻纸卡可交替微旋 ±0.6° 制造"桌面上摊开的杂志"感。字体驱动、大量留白：
-**超大 Cormorant 衬线展示标题**建立主焦点，斜体标题划分内容区；mono 只出现在眉标、统计、目录
-序号、图例、表头、尾注这类元信息上，正文一律 DM Serif Text 衬线。强调色克制——`{colors.primary}`
-马克红为主、`{colors.primary-2}` 暖橙为次，每个内容区至多一组斜体强调。
-
-眉标、署名、统计、目录、贴纸、引文、练习条和尾注都是可选刊物组件，只在内容需要时使用。纸卡数量、排列方式、组件顺序和内部结构按实际信息量与阅读关系确定，避免为套模板补齐无关模块。
-
-## Colors
-
-角色 × 值 × 用法（中文）：
-
-- **background `#d8c8c0`**：页面最底暖陶粉背景，纸卡铺在其上；其上叠两处径向渐变色停
-  `#e8d4cc`（上部）与 `#c79a8e`（右下），营造暖光晕。
-- **card `#faf3ea`**：主要纸卡和引文卡底色，最亮的奶油纸调。
-- **paper2 `#f4ecdf`**：次级纸卡和图表容器底色，比 card 略深半档，可区分内容层级。
-- **foreground `#1f1c14`**：主文字色，标题、正文、作者名、目录章名、步骤强调。
-- **muted-foreground `#837964`**：mono 元信息文字（眉标/署名/统计标签/页码/图例/表头/页脚/引文署名）、目录点线 leader。
-- **border `#d3c9b3`**：发丝分隔线，眉标底线、统计上下线、双栏顶线、步骤 dashed 分隔、图表网格线、表格行线、页脚顶线、引文卡描边。
-- **primary `#c44a47`**：马克红主强调，仅用于——展示标题斜体强调词、内容标题强调词、段落 dropcap、
-  步骤序号、引文开引号、练习条描边与标签、眉标圆点、数据图表第一序列色、标签徽标 primary 变体。每个内容区克制点缀。
-- **primary-2 `#e07d52`**：暖橙次强调，用于展示标题中的斜体 `&` 号、圆贴纸底色，以及数据图表的第二序列色（场景化例外，见 Exceptions），出现极少。
-
-## Typography
-
-**@import（原样写入全局样式首行，HARD REQUIREMENT：禁止替换字体族与来源）**：
-
-```
-@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,700;1,500;1,700&family=DM+Serif+Text:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap');
-```
-
-三套字体族：
-- **展示衬线**（标题 / 统计数字 / 章节标题 / 引文）：`'Cormorant Garamond', 'Iowan Old Style', Georgia, 'Songti SC', 'Noto Serif SC', serif`。
-- **正文衬线**（导语 / 正文 / 目录 / 步骤正文 / 练习正文）：`'DM Serif Text', Georgia, 'Songti SC', 'Noto Serif SC', serif`。
-- **mono**（眉标 / 署名 / 统计标签 / 目录页码 / 步骤序号 / 图例 / 表头 / 页脚 / 练习标签）：`'IBM Plex Mono', ui-monospace, 'PingFang SC', monospace`。
-
-CJK 兜底名为**补充项**（源为纯拉丁栈），拉丁字形优先、中文回落到系统衬线/黑体。
-
-角色字号（verbatim）：
-- 主展示标题 `{typography.title.fontSize}`（clamp 60→92px），weight 700，line-height 0.96，letter-spacing -0.01em。
-- 章节标题 italic 44px / 1，weight 700，letter-spacing -0.005em，max-width 18ch。
-- "What's inside" 标题 italic 700 36px / 1；统计数字 700 36px / 1，letter-spacing -0.005em。
-- 引文 italic 700 22px / 1.2。
-- 导语 italic 16px / 1.5（DM Serif Text），max-width 50ch。
-- 正文 14.5px / 1.6；目录条目 14.5px / 1.4（章名斜体）。
-- mono 元信息基准 10.5px / 1，letter-spacing 0.18em，全大写（眉标/页脚/署名 12px、0.18em）。
-- 统计标签 mono 10px / 1.4，letter-spacing 0.16em，全大写，max-width 16ch。
-- 步骤序号 mono 700 12px / 1，letter-spacing 0.08em；步骤正文 14px / 1.45。
-- 练习条标签 mono 10.5px / 1，letter-spacing 0.2em，全大写；练习条正文 italic 14px / 1.4。
-
-## Layout
-
-**纸卡式响应内容界面**。外层可参考 `body` padding `{spacing.bodyPad}`（60/40）与
-`gap {spacing.pageGap}`（36px），按内容关系选择单列、并排或自然换行。背景为
-`{colors.background}` 叠两层径向渐变（上部 `#e8d4cc`、右下 `#c79a8e`）。
-
-纸卡 `.page`：宽度跟随容器，不设固定高度；540px × 740px 仅是来源示例的刊物比例，不是实现约束。
-padding 可参考 `{spacing.pagePad}`（44/44/36），使用 4px 圆角。相邻纸卡可交替 `rotate(-0.6deg)` /
-`rotate(0.6deg)`；单卡场景保留轻微旋转即可。贴纸、引文卡等装饰元素不得遮挡正文。
-
-纸卡数量与内部模块按信息量确定，间距参考 `{spacing.pageGap}`。统计、目录和正文可使用自适应网格，列数由内容和可用宽度决定。引文卡可轻微越出纸面形成贴附感，但不得遮挡正文，也不固定坐标。
-
-响应式：≤768px 时 `body` padding 收为 20px，多列内容按阅读顺序收敛，引文卡回到正常文档流。
-
-## Elevation & Depth
-
-深度语言两层：①**纸卡长柔阴影**——`0 30px 60px rgba(31,28,20,0.18)` + `0 4px 8px rgba(31,28,20,0.06)`
-双层叠加，把每张纸卡从暖陶底上抬起；②**引文卡小阴影** `0 8px 18px rgba(31,28,20,0.10)`，比纸卡更贴近页面、
-配 2.4° 旋转做浮起。纸卡内分区一律靠 `{colors.border}` 发丝线，不再叠投影——图表容器、表格、标签徽标、
-练习条均无 boxShadow。微旋（纸卡交替 ±0.6°、贴纸 8°、引文 2.4°）是核心深度/趣味语言。
-
-## Shapes
-
-矩形纸卡 + 圆角 `{rounded.card}`（4px）为主形。圆形仅两处：眉标 6px primary 圆点、角落 92px primary-2
-实心圆贴纸（内嵌虚线圈、旋转 8°）。引文卡、练习条、标签徽标、纸卡同用 4px 圆角。目录 leader
-是点线、步骤分隔与图表网格线是 dashed/1px 发丝线。整体印刷/杂志版式语言，靠发丝线与微旋而非厚重形状。
-
-## Components
-
-- **纸卡 page**：按内容层级选择 `{colors.card}` / `{colors.paper2}` 底，4px 圆角，双层长阴影；相邻卡可交替微旋 ±0.6°。
-- **眉标 eyebrow**：mono 大写左右分布，左前置 6px `{colors.primary}` 圆点，下方 1px `{colors.border}` 收口。
-- **主展示标题 coverTitle**：超大 Cormorant，混合字重；`.creator` 可用斜体 `{colors.primary}`，含 `&` 时
-  `.amp` 可用斜体 `{colors.primary-2}` weight 500。
-- **作者署名 author**：mono 大写 muted-foreground，姓名部分 `{colors.foreground}` 加重。
-- **统计 stats**：自适应排列的大 Cormorant 数字 + mono 大写小标签，上下 1px `{colors.border}` 线夹住。
-- **目录 toc**：斜体章名（`{colors.foreground}`）+ 点线 leader（1px dotted `{colors.muted-foreground}`）+ mono 序号，列数按空间调整。
-- **贴纸 sticker**：`{colors.primary-2}` 实心圆、白字斜体衬线、旋转 8°、内嵌 1px 虚线白圈。
-- **内容标题 spreadHead**：斜体 Cormorant，末词可染 `{colors.primary}`，换行方式随标题与空间调整。
-- **内容分组 columns**：正文、编号步骤或图表可并排也可顺排；正文可使用斜体 `{colors.primary}` 38px dropcap，顶 1px `{colors.border}` 线。
-- **步骤 steps**：`28px 1fr` 行，mono `{colors.primary}` 序号 + 衬线正文（强调词斜体加重），行间 1px dashed `{colors.border}`。
-- **引文卡 pullquote**：可置于内容边缘并旋转 2.4°，`{colors.card}` 底 + 1px `{colors.border}` 描边 + 小阴影，
-  超大 `{colors.primary}` 开引号，mono muted-foreground 署名。
-- **数据图表 dataViz**：折线/柱状/堆叠柱/环形/雷达，容器 `{colors.paper2}` 底、`{colors.border}` 1px 网格线，
-  图例/坐标 mono；序列色按序取用 `{colors.primary} → {colors.primary-2} → {colors.muted-foreground} → {colors.border} → foreground@20%`
-  （不超过 5 类），禁止渐变填充与 boxShadow。
-- **数据表格 table**：表头 mono 大写 `{colors.muted-foreground}` + 1px `{colors.border}` 底线，行间 1px `{colors.border}`
-  发丝线分隔，无斑马纹填充，无阴影。
-- **标签徽标 tag**：mono 大写小字胶囊，primary 描边+极淡 primary 底 或 muted-foreground 描边+极淡 muted-foreground 底二选一，不叠加其它色。
-- **练习条 exercise**：1px `{colors.primary}` 描边 + `rgba(196,74,71,0.05)` 极淡底，mono `{colors.primary}`
-  描边标签胶囊 + 斜体正文。
-- **尾注 footer**：mono 大写左右分布（栏目名 / 页码或序号），顶 1px `{colors.border}` 线。
-
-## Do's and Don'ts
-
-**Do**
-- 让展示标题独占视觉，内容标题可用斜体建立层级，字号与留白都倾斜给它。
-- mono 只留给元信息（眉标、统计、页码、图例、表头、步骤序号、练习条标签），正文永远衬线。
-- 用发丝线 `{colors.border}` 与相邻卡片微旋制造桌面杂志感，保持纸面干净；页面结构由内容决定，不照搬封面或双页示例。
-
-**Don't**
-- 别给卡内元素加投影——投影只属纸卡与引文卡，图表/表格/标签/练习条一律不加。
-- 别让 `{colors.primary}` / `{colors.primary-2}` 铺开——它们只点缀强调词、序号、竖边、贴纸、图表序列色、标签徽标。
-- 正文别用占位 lorem，写真实、有观点的创作者口吻文字。
-
-## Hard Rules
-
-- 每个内容区**至多一组斜体强调**；标题内强调词（`.creator`）与紧邻的斜体 `&` 号可视为同一组。
-- `@import` 行原样写入全局样式首行，**禁止替换**字体族或来源。
-- mono 字体**禁止**用于正文/导语/目录章名，只用于眉标、署名、统计标签、页码、图例、表头、步骤序号、
-  练习条标签、页脚。
-- **禁止 boxShadow 出现在纸卡以外的任何元素**：投影只允许每张纸卡（长柔双层阴影）与引文卡（小阴影）；
-  图表容器、表格、标签徽标、练习条一律无阴影，靠 `{colors.border}` 发丝线分区。
-- `{colors.primary-2}` 暖橙**只允许**出现在展示标题 `&` 号、圆贴纸底色、数据图表第二序列色三处，不得他用。
-- `{colors.primary}` 只允许出现在：展示标题强调词、内容标题强调词、dropcap、步骤序号、引文开引号、练习条
-  描边与标签、眉标圆点、数据图表第一序列色、标签徽标 primary 变体；**禁止**作大面积背景（练习条
-  极淡底除外）或正文色。
-- 多纸卡场景中相邻卡交替微旋 ±0.6°；单卡任选一个方向。贴纸 8°、引文卡 2.4°，**保留旋转**，不得全部摆正。
-- 除 4px 圆角纸卡/引文卡/练习条/标签徽标与两处圆形（眉标点、贴纸）外，其余分隔一律发丝直线，
-  含图表网格线与表格行线。
-
-## Exceptions
-
-- 展示标题内允许 `.creator`（斜体 primary）+ `.amp`（斜体 primary-2 的 &）两处特殊排版，视作一组强调。
-- 引文卡带一层比纸卡更小的阴影（`0 8px 18px rgba(31,28,20,0.10)`），是纸卡以外唯一允许的浮起投影例外。
-- 练习条 `rgba(196,74,71,0.05)` 是 `{colors.primary}` 唯一允许的大面积（极淡）铺底例外。
-- 数据图表容器内 `{colors.primary-2}` 可作第二数据序列色使用，是色彩使用限制在图表场景下的例外，不外溢到其它组件。

package/steering/nestjs-react-fullstack/skills/design-guide/references/finance-report.md

@@ -1,169 +0,0 @@
----
-version: alpha
-name: finance-report
-name_zh: 财报纸本
-description: >-
-  米白画布、白色内容面与近黑文字，青蓝仅标记图表主序列、进度和关键结论。
-  衬线标题和关键数字、等宽标签和右对齐数字列、无阴影数据块、粗表头线和墨线合计行构成报告层级。
-colors:
-  background: "#F7F6F2"
-  card: "#FFFFFF"
-  foreground: "#11141A"
-  muted-foreground: "#5F6573"
-  border: "#E6E3DD"
-  lineStrong: "#C8C2B6"
-  primary: "#1F6E8C"
-  primary-2: "#2C98C5"
-  accent: "#E7F0F4"
-  positive: "#1F8C5C"
-  negative: "#B13B3B"
-  warning: "#8A6912"
-typography:
-  display:
-    fontFamily: "'Iowan Old Style', 'Charter', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: 32px
-    fontWeight: 700
-    lineHeight: 1.15
-  heading:
-    fontFamily: "'Iowan Old Style', 'Charter', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: 19px
-    fontWeight: 700
-  metric:
-    fontFamily: "'Iowan Old Style', 'Charter', Georgia, 'Songti SC', 'Noto Serif SC', serif"
-    fontSize: 28px
-    fontWeight: 700
-    lineHeight: 1
-  body:
-    fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, 'PingFang SC', 'Microsoft YaHei', sans-serif"
-    fontSize: 14px
-    lineHeight: 1.55
-  label:
-    fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace"
-    fontSize: 11px
-    letterSpacing: 0.06em
-  number:
-    fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace"
-    fontSize: 13px
-    fontVariantNumeric: tabular-nums
-rounded:
-  paper: 12px
-  card: 8px
-  callout: 6px
-  tag: 999px
-spacing:
-  compact-gap: 8px
-  content-gap: 14px
-  section-gap: 32px
-  card-padding: 18px
-  page-padding: "clamp(20px, 5vw, 56px)"
-components:
-  paper:
-    background: "{colors.card}"
-    border: "1px solid {colors.border}"
-    borderRadius: "{rounded.paper}"
-    boxShadow: "0 16px 40px rgba(28, 27, 26, 0.06)"
-  reportHeader:
-    borderBottom: "2px solid {colors.foreground}"
-    description: 衬线标题配等宽期间或版本信息
-  metric:
-    background: "{colors.card}"
-    border: "1px solid {colors.border}"
-    borderRadius: "{rounded.card}"
-    description: 等宽标签、衬线数值和等宽变化量
-  ledgerTable:
-    rowBorder: "1px solid {colors.border}"
-    description: 等宽数字右对齐；表头使用强分隔线，合计行使用 2px 墨线上边界
-  callout:
-    background: "{colors.accent}"
-    borderLeft: "3px solid {colors.primary}"
-    borderRadius: "{rounded.callout}"
-    description: 每个视图最多一个，用于关键结论
-  status:
-    borderRadius: "{rounded.tag}"
-    description: 颜色必须配文字、符号或方向标记
-anchors:
-  - id: paper-and-ink
-    type: token
-    desc: 米白画布、白色内容面、近黑文字、细线和单层纸面柔影
-  - id: serif-metric-hierarchy
-    type: token
-    desc: 衬线体用于标题和关键数字，无衬线体用于正文，等宽体用于标签和数字列
-  - id: ledger-table
-    type: component
-    desc: 细行线、强表头线、右对齐数字和墨线合计行
-  - id: restrained-accent
-    type: pattern
-    desc: 青蓝只用于图表主序列、进度和关键结论强调
-  - id: flat-report-sections
-    type: pattern
-    desc: 内容块不使用阴影，以边框、留白和粗细线建立层级
----
-
-## Overview
-
-报告型界面。米白画布承托白色内容面，近黑文字与细线组织高密度数据，青蓝只用于少量重点。标题和关键数字使用衬线体，正文使用无衬线体，标签和数字列使用等宽体。
-
-## Colors
-
-| 角色 | Token | 用法 |
-|------|-------|------|
-| 画布 | `{colors.background}` | 内容面外部背景 |
-| 内容面 | `{colors.card}` | 正文、表格和数据块背景 |
-| 主文字 | `{colors.foreground}` | 标题、正文、关键数字和粗分隔线 |
-| 次文字 | `{colors.muted-foreground}` | 标签、说明和元信息 |
-| 细线 | `{colors.border}` | 普通边框和行分隔 |
-| 强线 | `{colors.lineStrong}` | 表头和主要分组边界 |
-| 青蓝 | `{colors.primary}` | 图表主序列、进度和关键结论 |
-| 淡蓝 | `{colors.accent}` | 结论框和进度底槽 |
-| 语义色 | `{colors.positive}` / `{colors.negative}` / `{colors.warning}` | 涨跌、风险和状态 |
-
-除语义状态外，图表优先使用青蓝同色阶；不增加无语义的高饱和色。
-
-## Typography
-
-```css
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
-```
-
-- 标题和关键数字使用 display 衬线栈；正文和操作使用系统无衬线栈。
-- 标签、表头、期间和数字列使用等宽栈；数字启用等宽数字并右对齐。
-- 英文短标签可使用大写和 0.06em 字距；中文标签不转大写。
-- 保持 display、body、label 三种角色，不要求固定标题级数或模块数量。
-
-## Layout
-
-- 内容面宽度、分栏和区块顺序由内容决定，不固定页面宽高或纸张比例。
-- 使用 `{spacing.page-padding}` 作为响应式内边距；窄屏减少列数，不缩小正文维持多列。
-- 指标、图表、表格和结论按信息依赖组合，不固定数量或位置。
-- 宽表格可在自身容器内横向滚动，页面本身不得横向滚动。
-- 不固定报头、侧栏、Hero、双栏比例或结尾模块。
-
-## Elevation & Depth
-
-- 最外层纸面可使用 `{components.paper}` 的单层柔影。
-- 内部数据块、指标和表格不使用阴影，以 1px 细线和留白分层。
-- 报告标题分隔和表格合计行可使用 2px `{colors.foreground}` 墨线。
-
-## Shapes
-
-- 纸面使用 12px 圆角，普通内容块使用 8px，结论框使用 6px。
-- 状态标签可使用全圆角；表格、图表和普通数据不使用胶囊容器。
-
-## Components
-
-- **报头** `{components.reportHeader}`：需要标题和期间信息时使用，不固定位置。
-- **指标** `{components.metric}`：等宽标签、衬线数值、等宽变化量；数量与列数由数据决定。
-- **台账表** `{components.ledgerTable}`：数字右对齐，普通行用细线，合计行用 2px 墨线上边界。
-- **结论框** `{components.callout}`：淡蓝底和青蓝左线，每个视图最多一个。
-- **状态** `{components.status}`：涨跌、风险和状态同时使用颜色与文字、符号或方向。
-- **图表**：主序列使用青蓝，对比序列使用近黑透明色；多分类使用青蓝同色阶和必要的语义色。
-
-## Hard Rules
-
-1. 保持米白画布、白色内容面、近黑文字和克制青蓝的颜色角色。
-2. 衬线体只用于标题和关键数字，无衬线体用于正文，等宽体用于标签和数字列。
-3. 青蓝只用于图表主序列、进度和关键结论，不用于正文或大面积背景。
-4. 内部数据块、指标和表格禁止阴影；只有最外层纸面可使用一层柔影。
-5. 数字列使用等宽数字并右对齐；涨跌和状态不得只靠颜色表达。
-6. 禁止固定页面宽高、指标数量、分栏比例、区块顺序、报头位置或结尾模块。
-7. 禁止为装饰增加无语义色、重复结论框或额外卡片层级。