openyida 2026.9.21 → 2026.9.22-beta.2

package/yida-skills/skills/yida-design/templates/design-themes/dark-inset-hairline/design.md

@@ -1,382 +0,0 @@
----
-name: "{{PROJECT_NAME}}"
-description: "墨黑画布上分布炭灰卡片，成组内容在卡片内回落为黑色内嵌面，以细边界形成轻微内凹层次；浅灰文字组织信息，色彩集中于品牌标识、数据细线和小型状态反馈。"
-themeId: dark-inset-hairline
-navTheme: dark
-tokens:
-  application-global:
-    appearance:
-      surfaces:
-        "--pod-app-root-bg-color": "#000000" # neutral-gray；应用根背景与加载兜底
-        "--pod-app-root-bg-image": "none" # 根节点专属背景图；本主题无背景图
-        "--pod-page-bg-color": "#000000" # neutral-gray；页面画布
-        "--pod-card-bg-color": "#0E0E0E" # neutral-gray；常规卡片、分组容器、表单与详情主面，比页面稍亮
-        "--pod-table-cell-color": "var(--pod-card-bg-color)" # 表格正文跟随卡片
-      navigation:
-        "--pod-shell-theme-bg-color": "#0E0E0E"
-        "--pod-nav-item-text-color": "#A8A8A8"
-        "--pod-nav-item-text-hover-color": "#DDDDDD"
-        "--pod-nav-item-text-selected-color": "#ECECEC"
-        "--pod-nav-menu-bg-hover-color": "#171717"
-        "--pod-nav-menu-bg-selected-color": "#202020"
-        "--pod-nav-menu-item-selected-shadow": "none"
-        "--pod-page-header-bg-color": "var(--pod-shell-theme-bg-color)"
-        "--pod-nav-l-sub-main-bg-color": "var(--pod-shell-theme-bg-color)"
-        "--pod-nav-top-main-border-width": "1px"
-        "--pod-nav-top-main-border-color": "#353535"
-        "--pod-nav-top-tab-indicator-width": "0px"
-        "--pod-nav-logo-text": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-logo-bg": "var(--pod-nav-menu-bg-selected-color)"
-        "--pod-nav-logo-icon": "var(--pod-nav-item-text-selected-color)"
-        "--pod-nav-logo-border": "1px solid #353535"
-        "--pod-nav-logo-border-radius": "6px"
-        "--pod-nav-sub-divider-color": "#353535"
-        "--pod-nav-item-text-disabled-color": "rgba(255,255,255,.30)"
-        "--pod-nav-l-container-bg": "var(--pod-shell-theme-bg-color)"
-        "--pod-nav-l-group-label-color": "var(--pod-nav-item-text-color)"
-        "--pod-nav-l-search-border-color": "#353535"
-        "--pod-nav-popup-bg-color": "var(--pod-shell-theme-bg-color)"
-        "--pod-nav-popup-border-radius": "6px"
-        "--pod-nav-popup-shadow": "0 8px 24px rgba(0,0,0,.24)"
-        "--pod-nav-tab-line-hover-color": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-tab-line-selected-color": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-search-bg-color": "var(--pod-nav-menu-bg-hover-color)"
-        "--pod-nav-search-bg-hover-color": "var(--pod-nav-menu-bg-hover-color)"
-        "--pod-nav-search-bg-active-color": "var(--pod-nav-menu-bg-hover-color)"
-        "--pod-nav-search-placeholder-color": "var(--pod-nav-item-text-color)"
-        "--pod-nav-search-text-color": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-search-icon-color": "var(--pod-nav-item-text-color)"
-        "--pod-nav-search-border-color": "#353535"
-        "--pod-nav-search-border-hover-color": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-search-border-active-color": "var(--pod-nav-item-text-hover-color)"
-        "--pod-nav-action-icon-color": "var(--pod-nav-item-text-color)"
-        "--pod-nav-action-border-color": "#353535"
-        "--pod-nav-action-border": "1px solid #353535"
-        "--pod-nav-action-bg-hover-color": "var(--pod-nav-menu-bg-hover-color)"
-        "--pod-nav-action-bg-active-color": "var(--pod-nav-menu-bg-hover-color)"
-        "--pod-nav-menu-item-height": "38px"
-        "--pod-nav-menu-item-radius": "6px"
-        "--pod-nav-menu-item-border": "1px solid transparent"
-        "--pod-nav-menu-item-hover-border": "1px solid #424242"
-        "--pod-nav-menu-item-selected-border": "1px solid #626262"
-        "--pod-nav-menu-font-size": "14px"
-        "--pod-nav-menu-item-selected-font-weight": "500"
-        "--pod-nav-menu-line-height": "20px"
-        "--pod-nav-menu-gap": "8px"
-        "--pod-shell-lshape-border-radius": "6px"
-    colors:
-      "--color-white": "var(--pod-card-bg-color)" # 全应用基础表面，随暗色内容面；不是固定白字或亮色按钮背景
-      "--color-brand1-1": "<生成实际色值：--color-brand1-6 88% + #FFFFFF 12%，sRGB 逐通道混合>" # 品牌悬停
-      "--color-brand1-2": "<生成实际色值：--color-brand1-6 12% + #FFFFFF 88%，sRGB 逐通道混合>" # 平台预留品牌浅色
-      "--color-brand1-3": "<生成实际色值：--color-brand1-6 4% + #FFFFFF 96%，sRGB 逐通道混合>" # 品牌派生浅色；需要主题浅色的角色可引用
-      "--color-brand1-5": "<生成实际色值：--color-brand1-6 38% + #171717 62%，sRGB 逐通道混合>" # 品牌派生深色；需要主题深色的角色可引用
-      "--color-brand1-6": "{{PRIMARY_COLOR}}" # 唯一主题主色种子；按项目输入实例化，不保留固定色相兜底
-      "--color-brand1-9": "<生成实际色值：--color-brand1-6 76% + #000000 24%，sRGB 逐通道混合>" # 品牌按下
-      "--color-brand1-10": "<生成实际色值：--color-brand1-6 26% + #202020 74%，sRGB 逐通道混合>" # 品牌禁用
-      "--color-line1-1": "#202020" # neutral-gray；分区、行分隔、辅助网格
-      "--color-line1-2": "#303030" # neutral-gray；控件与浮层常规边界
-      "--color-fill1-1": "#111111" # neutral-gray；输入基础表面、中性悬停及弱填充
-      "--color-fill1-2": "#242424" # neutral-gray；中性按下、选中填充
-      "--color-fill1-3": "#333333" # neutral-gray；较重中性填充、进度轨道
-      "--color-fill1-5": "#303030" # neutral-gray；独立 pop-up 表面
-      "--color-fill1-10": "#262626" # neutral-gray；固定短 Tooltip 表面
-      "--color-text1-5": "#FFFFFF" # neutral-gray；固定短 Tooltip 前景
-      "--color-text1-4": "#E6E6E6" # neutral-gray；标题、正文重点、核心数值
-      "--color-text1-10": "#B8B8B8" # neutral-gray；表头、placeholder
-      "--color-text1-3": "#A0A0A0" # neutral-gray；说明、坐标、元信息
-      "--color-text1-2": "#646464" # neutral-gray；仅禁用文字
-      "--color-text1-1": "#383838" # neutral-gray；仅水印文字
-    typography:
-      "--font-family-base": "Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif"
-      "--font-size-subhead": "18px"
-      "--font-weight-subhead": 500
-      "--font-lineheight-subhead": 1.3
-      "--font-size-body-2": "16px"
-      "--font-weight-body-2": 500
-      "--font-lineheight-body-2": 1.45
-      "--font-size-body-1": "14px"
-      "--font-weight-body-1": 400
-      "--font-lineheight-body-1": 1.5
-      "--font-size-table": "13px"
-      "--font-weight-table": 400
-      "--font-lineheight-table": 1.45
-      "--font-size-caption": "12px"
-      "--font-weight-caption": 400
-      "--font-lineheight-caption": 1.4
-    spacing:
-      "--s-1": 4px
-      "--s-2": 8px
-      "--s-3": 12px
-      "--s-4": 16px
-      "--s-5": 20px
-      "--s-6": 24px
-      "--s-7": 28px
-      "--s-8": 32px
-      "--s-9": 36px
-      "--s-10": 40px
-    rounded:
-      "--corner-zero": 0px # 贴边区域、表格拼接
-      "--corner-1": 4px # 小标签与字母标识
-      "--corner-2": 6px # 输入、菜单项、常规矩形按钮
-      "--corner-3": 8px # 浮层、气泡与弹窗
-      "--corner-4": 10px # 同组内部的小型任务面
-      "--corner-5": 12px # 一级卡片、分组底板与抽屉
-      "--corner-circle": 50% # 头像、圆点与等宽高图标底
-      "--corner-semicircle": 500px # 胶囊搜索、状态胶囊与圆形按钮
-    shadow:
-      "--shadow-1": "0px 2px 4px 0px rgba(0, 0, 0, 0.12)"
-      "--shadow-2": "0px 4px 20px -1px rgba(0, 0, 0, 0.16)"
-      "--shadow-3": "0px 10px 28px -2px rgba(0, 0, 0, 0.24)"
-  custom-page:
-    colors:
-      "--oyd-page-bg": "var(--pod-page-bg-color)" # 页面画布的单向桥接
-      "--oyd-inset-surface": "#000000" # neutral-gray；卡片内部的指标、图表与明细内嵌面，独立于页面背景职责
-      "--oyd-workspace-surface": "#141414" # neutral-gray；持续交互工作区的稍亮表面，内部编辑区回落为黑色
-      "--oyd-bright-action-bg": "#E6E6E6" # neutral-gray；局部明亮中性操作底，不承担基础表面
-      "--oyd-on-bright-color": "#111111" # neutral-gray；设计稿中亮底操作的深色前景，与根背景独立
-      "--oyd-chart-series-1": "#9278D0" # 独立紫色数据序列，不是品牌或状态色
-      "--oyd-chart-series-2": "<生成实际色值：--color-brand1-6 70% + #A0A0A0 30%，sRGB 逐通道混合>" # 主题派生数据序列；独立数据角色，同源于品牌主色，不借用交互状态
-      "--oyd-chart-series-3": "#8A8A8A" # neutral-gray；第三数据序列
-    typography:
-      "--oyd-font-size-metric": "28px" # 核心指标独立规格，推断
-      "--oyd-font-weight-metric": 500
-      "--oyd-font-lineheight-metric": 1.2
----
-
-# {{PROJECT_NAME}} design.md
-
-## 1. 风格摘要
-
-**暗面内凹 · Dark Inset Hairline**
-
-页面以墨黑为底，常规卡片与分组容器呈炭灰；需要容纳多个数据区块时，内部指标、图表和明细回落为黑色，形成轻微内凹的层次。独立摘要和操作卡片保持炭灰，不套用内部黑色数据面的背景。细线界定区域，浅灰文字组织阅读顺序，数值通过字号而非高饱和大底色成为焦点。整体紧凑，品牌、数据和状态色只占局部面积。
-
-| 核心特征             | 可见表现                                                           | 主要偏离风险                                             |
-| -------------------- | ------------------------------------------------------------------ | -------------------------------------------------------- |
-| 明暗交替的嵌入式表面 | 黑色页面、炭灰卡片、按内容启用的黑色内嵌面形成三段关系             | 把全部卡片设成页面黑色会丢失分区；逐层提亮又会失去内凹感 |
-| 低反差边界与稳定节奏 | 细分隔线配合短间距组织密集内容，面板边缘圆润而克制                 | 亮白描边、厚边框、强投影会抢夺内容焦点                   |
-| 灰阶阅读层级         | 标题和数值最亮，字段、说明和元信息逐级退后，字重变化有限           | 大量纯白粗体或把说明降为禁用灰，会破坏层级与可读性       |
-| 局部彩色信号         | 小状态胶囊、数据细线与真实完成比例承担色彩；品牌标识只作小范围点睛 | 满屏品牌渐变、霓虹发光、随机彩色卡片会改变主题性格       |
-
-基础风格由表面、细边界、文字与间距共同建立，普通表单和列表也应成立。数据曲线、分段进度、快捷操作和对话仅在真实需求存在时启用；主题不规定业务名称、模块数量或固定页面结构。
-
-## 2. 页面视觉系统
-
-YAML 是变量值事实源。本节定义视觉对象如何消费变量；局部尺寸、图形粗细和未展示的交互外观属于实施推断，不视作精确测量值。
-
-### 2.1 表面、区块与层次
-
-层次主要依靠底色差、细线和留白。大范围表面保持不透明、无纹理；不用背景模糊或玻璃材质补充层次。
-
-| 对象                                         | 背景与前景                                                                                            | 边界、圆角与阴影                                                                   |
-| -------------------------------------------- | ----------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------- |
-| 应用根背景                                   | 背景 `--pod-app-root-bg-color`；背景图 `--pod-app-root-bg-image` 仅限根节点                           | 应用填满实际承载区域，不添加展示用的灰色外衬                                       |
-| 页面画布                                     | `--pod-page-bg-color`，自定义页通过 `--oyd-page-bg` 桥接；主要前景 `--color-text1-4`                  | 贴边处使用 `--corner-zero`，不强制外围留出设备展示边框                             |
-| 常规卡片、分组容器、表单与详情主面           | 炭灰 `--pod-card-bg-color`；主要前景 `--color-text1-4`，说明 `--color-text1-3`                        | `--corner-5` 与 `--color-line1-1` 细边界，无阴影；独立摘要与操作卡片沿用此面       |
-| 卡片内的指标、图表与自绘明细区               | 黑色 `--oyd-inset-surface`，前景沿用内容 Text 角色                                                    | 外围露出炭灰承载层；大内容面用 `--corner-5`，小型单元用 `--corner-4`，以细边界收口 |
-| 普通表格正文                                 | `--pod-table-cell-color` 单向跟随常规卡片；自绘内嵌明细的容器、表头与行统一使用 `--oyd-inset-surface` | 连续单元格不逐格圆角；行间仅使用 `--color-line1-1`                                 |
-| 持续交互工作区                               | 稍亮的 `--oyd-workspace-surface`，正文 `--color-text1-4`、说明 `--color-text1-3`                      | 单个完整外壳用 `--corner-5`；标题与正文之间保留细分隔                              |
-| 内部分段与辅助信息                           | 优先沿用所在表面，通过留白与分隔线分组；确需弱填充时用 `--color-fill1-1`                              | 不因增加一个字段组就再嵌套整张卡片                                                 |
-| 下拉、浮层、气泡、弹窗、弹出日历及导航弹出层 | 独立背景 `--color-fill1-5`；主文字 `--color-text1-4`，说明 `--color-text1-3`                          | `--color-line1-2` 边界，`--corner-3`；小浮层用 `--shadow-1`，弹窗用 `--shadow-2`   |
-| 抽屉                                         | `--color-fill1-5` 与对应内容前景                                                                      | `--corner-5` 用于外露角，贴边角归零；`--color-line1-2`、`--shadow-2`               |
-| 图表读数浮层                                 | `--color-fill1-5`；读数 `--color-text1-4`，时间及单位 `--color-text1-3`                               | `--corner-3`、`--color-line1-2`、`--shadow-1`；比图形承载面明显提亮                |
-| 简短 Tooltip                                 | 固定背景 `--color-fill1-10` 与固定前景 `--color-text1-5` 配对                                         | `--corner-3`，必要时 `--shadow-1`；与数据读数卡分开使用                            |
-
-细边界默认 1 CSS px（推断）。普通卡片不使用全局阴影；`--shadow-3` 保留为平台档位，本主题默认不启用。内凹感来自表面交替，不叠加 inset 阴影、内发光或立体倒角。
-
-普通页面直接使用黑色画布与炭灰卡片两层。只有内容确实需要分组时，才在同一炭灰容器内安排黑色内嵌面；卡片内部不继续机械增加层级。`--color-white` 随常规卡片表面，明亮操作底仍使用自己的角色。持久内容面不借用覆盖层背景。
-
-### 2.2 应用导航
-
-炭灰导航接续黑色画布，菜单以更亮的内嵌暗面标出当前页面；细边界、小圆角和紧凑行距延续内容区。
-
-菜单轮廓使用 --pod-nav-menu-item-radius、--pod-nav-menu-item-border、--pod-nav-menu-item-hover-border、--pod-nav-menu-item-selected-border。侧栏和顶部菜单共用轮廓，各状态保持相同边框宽度，文字位置稳定；具体数值以本项目 Token 为准。
-
-导航与应用框架、表单、自定义页面和详情页共用设计语言。先按业务入口安排菜单、分组、搜索、品牌区与常用操作，再一起确定导航与正文的明暗、表面、字体、边界、圆角和密度。平台导航使用真实页面菜单；自绘导航按同一套导航 Token 实现。命名模板沿用自身 navTheme，换主色保持导航明暗与内容画布；需要另一导航明暗时改选主题，自由创意按项目明确设计。
-
-导航底色使用 --pod-shell-theme-bg-color；普通、悬停和选中文字分别使用 --pod-nav-item-text-color、--pod-nav-item-text-hover-color、--pod-nav-item-text-selected-color；悬停和选中背景使用 --pod-nav-menu-bg-hover-color、--pod-nav-menu-bg-selected-color。图标跟随对应文字状态，当前入口同时用背景或字重表达。
-
-菜单高度、圆角与间距使用 --pod-nav-menu-item-height、--pod-nav-menu-item-radius、--pod-nav-menu-gap；搜索、品牌区、分组、操作和弹出菜单使用 navigation 分组中的对应 Token。弹出菜单的底色、文字与搜索状态成组配套，导航与内容可以分别选择明暗。选中项使用 --pod-nav-menu-item-selected-shadow：none 关闭额外标记，完整 box-shadow 值可表达左、右或底部内阴影，不占据菜单布局空间；该 Token 独立于导航明暗。菜单高度、文字行高、内距和框架留白一起调整，给外阴影、长标题与键盘焦点留出空间。
-
-桌面检查菜单、搜索、选中态与表单的协调；折叠后保留可识别图标和入口名称；窄屏保持菜单可展开、当前页面可定位、键盘焦点可见。提交、编辑、详情与自定义页都沿用这一导航设计。
-
-### 2.3 页面标题与操作
-
-标题区与页面画布连成一体，底部可用 `--color-line1-1` 分界，不默认包进额外卡片。左侧以页面标题为主；已有的说明、同步信息或简短状态在其下方，间隔 `--s-1`。状态圆点只代表真实状态。
-
-已有搜索、主操作、通知或用户信息组成尾部操作区，组内间距 `--s-3`，与标题保留 `--s-6` 呼吸空间。搜索使用输入基础表面，搜索文本不盖过标题；主要操作通过明确标签和边界体现，不要求宽幅彩色按钮。
-
-空间不足时操作区可另起一行，标题与说明保持连续阅读。没有说明、搜索或操作时不保留空壳。页面标题、面板标题及按钮分别沿用下节和第三部分的角色规则。
-
-### 2.4 排版、间距与形状
-
-全局字体使用 `--font-family-base`；中文由可用系统无衬线字体回退。数字优先使用等宽数字特性，表格数值按列对齐；金额、百分比和单位保持相同精度策略，不为制造视觉差异重复改变字体。
-
-| 文字角色                     | 字号 / 字重 / 行高                                                                     | 前景与用途                                         |
-| ---------------------------- | -------------------------------------------------------------------------------------- | -------------------------------------------------- |
-| 页面标题                     | `--font-size-subhead` / `--font-weight-subhead` / `--font-lineheight-subhead`          | `--color-text1-4`；不升级成展示性巨标题            |
-| 面板标题与重要记录名称       | `--font-size-body-2` / `--font-weight-body-2` / `--font-lineheight-body-2`             | `--color-text1-4`                                  |
-| 正文、字段标签与普通操作文案 | `--font-size-body-1` / `--font-weight-body-1` / `--font-lineheight-body-1`             | 正文 `--color-text1-4`；辅助说明 `--color-text1-3` |
-| 连续比较的表格文字           | `--font-size-table` / `--font-weight-table` / `--font-lineheight-table`                | 正文 `--color-text1-4`；表头 `--color-text1-10`    |
-| 元信息、图例、坐标与小标签   | `--font-size-caption` / `--font-weight-caption` / `--font-lineheight-caption`          | `--color-text1-3`；不得降为禁用灰                  |
-| 独立核心指标                 | `--oyd-font-size-metric` / `--oyd-font-weight-metric` / `--oyd-font-lineheight-metric` | `--color-text1-4`；只用于页面已有的重点数值        |
-
-页面边距优先 `--s-4` 至 `--s-6`，模块之间用 `--s-4`，分组之间用 `--s-6`；分组底板内缩 `--s-3`，卡片内边距 `--s-4`。标题到主体内容通常为 `--s-4`，图标到文案用 `--s-2`，同一行紧密信息用 `--s-1`。密度由间距与内容优先级控制，不缩小固定字体。
-
-圆角角色按 YAML 分工：大容器用 `--corner-5`，组内小任务面用 `--corner-4`，浮层用 `--corner-3`，输入和菜单用 `--corner-2`，小标签用 `--corner-1`。头像与状态点用 `--corner-circle`；胶囊搜索、轻量状态胶囊和圆形图标按钮可用 `--corner-semicircle`。普通数据卡与表格不胶囊化。
-
-具体页面的宽度、列数、面板高度和等高对象在第五部分确定。文本与记录增长应自然撑开容器，主题不统一锁高，也不要求每个面板各自滚动。
-
-### 2.5 色彩、图标与点缀
-
-品牌色主要用于已有品牌标识、需要强调的少量操作和焦点反馈。页面、卡片与内嵌面保持中性灰阶；品牌浅深档仅由需要主题色的角色引用，保留浅色接口不等于在暗色页面铺设大片浅色面板。
-
-内容中性色采用固定 `neutral-gray`，不随主色染色。数据序列使用 `--oyd-chart-series-1`、`--oyd-chart-series-2`、`--oyd-chart-series-3`，映射在同一项目内保持稳定；三色不是强制序列数量。真实数据需要更多类别时另行确定可区分的调色板，不循环套色造成歧义。
-
-成功、警告、错误与信息反馈使用平台已有状态色及其暗色配套前景；不在页面层复制同义 Token。数值变动方向不自动等于好坏，只有业务语义成立时才使用对应状态色。`--oyd-chart-series-2` 与主题主色同源并随其重算；紫色比较序列与无色相灰序列保留独立分类身份。项目主色若与独立比较色接近，应以线型和直接标签保持区分，必要时按真实类别重新选定对比色。
-
-图标采用同一家族的细线样式，视觉尺寸建议 16–20 CSS px、线宽 1.5 CSS px（推断）。导航及记录行通常不设底盒；用于识别小型指标或快捷操作时，允许弱填充圆底，尺寸取 `--s-6` 或 `--s-7`。图标不逐项染成不同颜色。
-
-大面积表面不使用渐变。若采用面积图，只在数据曲线下方使用本序列颜色向透明的垂直渐变，顶部不透明度建议 16%–20%、底部为 0（推断），且不能跨越图形边界。没有真实媒体需求时不补充背景照片、纹理、插画或仿造标识。
-
-## 3. 基础组件表达
-
-本节定义组件存在时的表达，不构成项目必备清单。未列出的组件按任务结构、表面层级、文字角色、控件形状和状态顺序推导。
-
-### 面板与数值单元
-
-常规面板使用炭灰 `--pod-card-bg-color`。头部为标题与已有辅助操作，内容自然接续；只有功能明确时才出现角落箭头或更多菜单。放在分组容器内的小型数值单元使用黑色 `--oyd-inset-surface`，采用“含义标签 → 核心数值 → 补充说明”的阅读顺序；单位紧贴数值，变化量或真实状态以小胶囊辅助。无对比基线时不添加增长率，无操作时不显示跳转箭头。
-
-独立摘要、说明与操作卡保持炭灰；内嵌数据面才使用黑色。简单页面无需增加内嵌层，不为构成网格补造空指标，也不把每段说明都围成卡片。
-
-### 按钮、搜索与输入
-
-| 组件               | 表达规则                                                                                                                                  |
-| ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------- |
-| 常规中性按钮       | 使用 `--color-fill1-3` 与 `--color-text1-4`，边界 `--color-line1-2`，圆角 `--corner-2`；次要操作可弱化为弱填充或透明底                    |
-| 品牌主操作         | 只在任务需要时使用 `--color-brand1-6`，前景使用 `--oyd-on-bright-color`；这是未展示的品牌实底按钮表达推断，现有中性操作仍保持原稿灰底浅字 |
-| 图标按钮           | 等宽高，轮廓清晰；矩形更多菜单用 `--corner-2`，圆形发送等局部操作用 `--corner-semicircle`；不得仅凭亮色暗示未知功能                       |
-| 输入、筛选与选择器 | 默认背景 `--color-fill1-1`，常规边界 `--color-line1-2`，输入文字 `--color-text1-4`，placeholder `--color-text1-10`，圆角 `--corner-2`     |
-| 搜索框             | 沿用输入语义，可使用 `--corner-semicircle`；图标与文本同基线，避免默认填入示例查询                                                        |
-| 多行输入           | 沿用输入基础表面，按真实输入长度增长；工具区和正文以 `--s-3` 留白区隔                                                                     |
-
-按钮高度按用途选用 `--s-7`、`--s-8`、`--s-9`、`--s-10`，默认普通操作为 `--s-8`；输入与筛选控件使用 `--s-8` 至 `--s-10`，默认 `--s-9`。不将独立操作卡的整个高度当作按钮高度。
-
-### 表单、表格与记录集合
-
-字段标签在输入上方，辅助说明贴近相应字段，错误信息使用平台错误语义。必填标记与字段校验结果只在实际规则存在时出现。字段组用标题、`--s-6` 间距和必要的细分隔线组织；不能以亮色填满整个表单。
-
-普通表格正文消费 `--pod-table-cell-color`，通过既定桥接跟随常规卡片。需要嵌入分组容器的自绘明细采用局部黑色 `--oyd-inset-surface`，容器、表头与数据行同底，不改写全局表格色。表头使用 `--color-text1-10`；仅保留细横分隔线，不逐格添加垂直网格或默认斑马底色。行内垂直留白用 `--s-3`，字段间使用 `--s-4`；数值列右对齐，文本列左对齐，状态列保持一致锚点。
-
-包含真实人物或实体标识时，可采用头像／标识、主名称、次级说明的复合单元格；没有头像素材时使用真实名称首字或已有实体图标。不沿用示例人物、邮件、公司或数据。状态标签采用平台状态色的小面积填充与清晰文字，不以整行染色代替标签。
-
-独立记录列表允许更宽松的两行信息，仍靠细线而非每行卡片分隔。需要批量编辑、跨行比较或合并的表格保留连续结构，不转成互相孤立的磁贴。
-
-### 小型反馈、进度与图形
-
-小标签使用 `--corner-1`，轻量计数或在线状态可用 `--corner-semicircle`；状态点加文字共同表达。平台状态色衍生底面可按对应状态色与所在表面混合，状态色占 12%–18%（推断），标签文字须单独确认可读性，不能只把整枚标签降低透明度。
-
-基础进度以 `--color-fill1-3` 为未完成轨道，已完成部分根据真实含义选择品牌或平台状态色。必须有当前量、分母或目标及有效范围；未知比例显示明确的未知状态，不填随机条形，也不把缺失值当作零。
-
-数据图形的坐标、辅助线与图例分别沿用文字、线条和序列色角色。每条序列的图例、线条、数据点和读数标记保持同色；序列不借用品牌按下色、disabled 色或 hover 色。量纲、统计周期和比较口径明确，显示值与可读明细来自同一份数据；缺失数据断开或标注缺失，不伪造平滑走势。
-
-### 组件状态
-
-交互状态为实施推断，沿用主题的轻微明暗变化，不产生整张卡片位移。
-
-| 状态                             | 视觉表达                                                                                            |
-| -------------------------------- | --------------------------------------------------------------------------------------------------- |
-| Hover                            | 中性透明元素叠加 `--color-fill1-1`；已有填充的控件可加强边界与文字；品牌操作使用 `--color-brand1-1` |
-| Active                           | 中性控件用 `--color-fill1-2`，品牌操作用 `--color-brand1-9`；不改变布局                             |
-| Focus                            | 使用可见的品牌焦点轮廓，建议 2 CSS px、外偏移 2 CSS px（推断）；不足以区分相邻面时增加中性分隔      |
-| Selected                         | 中性底 `--color-fill1-2` 配合明确的勾选、文字或选中标识；导航单独使用专属六项颜色                   |
-| Disabled                         | 使用 `--color-text1-2`、弱边界和对应禁用填充，不保留可操作高亮；`--color-text1-1` 不用于说明正文    |
-| Error / Warning / Success / Info | 使用平台已有状态前景、边界与文字说明；同时保留文本语义，不能只依赖颜色                              |
-| Loading / Empty                  | 保留内容区的布局语义；加载占位用中性 Fill 层级，空状态用可读说明和已有可行操作，不伪造数值或曲线    |
-
-浮层内的控件仍各自消费输入、悬停、选中等角色，不因外层变亮就套用导航色。颜色过渡建议 120–180 ms（推断）；禁止持续闪烁的状态点、发光扫描线和与任务无关的动画。
-
-### 表单组件与版式结构
-
-表单使用与自定义页面相同的应用全局样式，字体、色彩、表面、边界、圆角、密度和状态延续本主题。表单支持在顶部、左侧、主体、右侧和字段之间组合 Tab/切换、按钮组/操作入口、图片/图形、状态区、标题与 `Divider`、`ColumnContainer`、辅助内容和业务字段。各组件承担导航、操作、视觉焦点、反馈、层级、节奏、装饰或采集作用。普通业务分组和章节分隔使用 `Divider`，横向字段组合使用 `ColumnContainer`。每张表单在项目 `design.md` 写清组件位置与作用、列比例、标签位置、字段与章节间距、底栏、详情延续和窄屏重排。
-
-## 4. 特色表达配方
-
-### R1 细分刻度进度
-
-**适用内容：** 已有可计算的比例、进度、利用率或目标完成度，且分母和范围确定。
-
-**继承基础：** 使用第三部分数值单元、进度语义与平台状态表达；在分组容器中采用黑色内嵌面，独立使用时沿用常规炭灰卡片。
-
-**特殊组合：** 上部放名称及简短口径，中部显示清晰的百分比，下部用等宽、等距的细竖条替代连续粗进度条；尾部两端可放真实的总量与剩余量。竖条建议宽 2 CSS px、间距 3 CSS px、高 20 CSS px（推断），未完成部分消费 `--color-fill1-3`，已完成部分只使用一种有明确语义的颜色。根据可用宽度确定条数 N，将真实比例 p 限制在 0–1 得到绘制比例 q，令 k = floor(N × q)：前 k 条完全点亮；仅当 k < N 且余量 N × q − k > 0 时，按该余量填充第 k + 1 条，其余保留轨道色。显示数字使用真实 p，不从绘制比例或条数反推数值。条纹仅编码比例，不暗示每条代表一个实体。
-
-**无匹配时：** 无分母时只显示已知量及解释；空间不足时使用基础连续进度，不缩小文字。数据不适合比例时不采用本配方。超出目标的值保留真实数字并说明超额，轨道最多填满，不截改真实数值。
-
-### R2 暗底细线面积趋势
-
-**适用内容：** 有连续且可比较的时间或有序数据；多个系列叠加时需共享量纲与统计口径。
-
-**继承基础：** 使用第三部分数据图形规则，配色和渐变沿用 2.5，图表读数浮层沿用 2.1。
-
-**特殊组合：** 图形容器与绘图区统一使用黑色 `--oyd-inset-surface`，外围露出炭灰承载面；细曲线、稀疏水平辅助线和向下消隐的面积填充构成主体。图例以细竖色标配文字放在标题区域，避免大色块图例。曲线建议 1–1.5 CSS px（推断），真实数据允许时使用不产生额外极值的单调插值，离散数据采用折线。面积基线必须标明，默认取有业务意义的零值；有正负值时围绕零线填充。多个序列独立叠加，不因重叠产生可加总的暗示。读数卡显示每个可见序列的名称、数值和时间，小竖色标与系列绑定。
-
-**无匹配时：** 类别比较使用基础条形图或表格；不同量纲拆分呈现；数据不足时给出真实空状态，不以装饰曲线补齐。没有时间数据的页面不需要保留图表区。
-
-### R3 留白式操作磁贴
-
-**适用内容：** 已存在一组短路径操作，用户需要直接选择并触发，且有清楚的动作名称。
-
-**继承基础：** 沿用第三部分面板、图标与按钮状态，尺寸由内容决定。
-
-**特殊组合：** 磁贴使用炭灰 `--pod-card-bg-color`，不套用黑色数据内嵌面。小型线性图标靠左上，动作名称位于其下，间隔 `--s-3`；较长名称自然换行，不将文字挤成小字号。边界保持细线，通过边界与文字亮度提供交互反馈。只有整块均触发同一操作时才整块可点击，图标底圈不另造第二个动作。
-
-**无匹配时：** 单个操作回到普通按钮，多步骤内容回到对应流程入口；不为填满固定网格新增操作，数量和列数由项目页面决定。
-
-### R4 内嵌对话工作区
-
-**适用内容：** 需求明确存在对话、助理或记录讨论能力，且输入和回复有真实承接方式。
-
-**继承基础：** 沿用 2.1 的工作区表面、黑色内嵌面和第三部分文字状态，不改变页面全局表面规则。
-
-**特殊组合：** 用稍亮的 `--oyd-workspace-surface` 形成单个工作区，头部标题与正文以细线分隔。发起方短消息靠右，使用较重中性填充 `--color-fill1-3` 与 `--corner-3`；回复方直接排在工作区底面上，小型标识只用于识别来源。底部编辑区使用黑色 `--oyd-inset-surface`，输入本体透明，正文与工具行共用这一底面；这是对话编辑区的局部组合，普通表单输入仍使用 `--color-fill1-1`。已有附加功能以小图标放在工具行，发送使用明亮中性圆按钮，表面 `--oyd-bright-action-bg` 与前景 `--oyd-on-bright-color` 配对。通过对齐、表面差和文字间距区分角色，不把每段回复包进气泡。工作区的位置由项目内容决定。
-
-**无匹配时：** 没有真实对话能力时不渲染聊天窗口；只有静态说明时使用普通文本面板。麦克风、附件与发送动作只在实际功能可用时出现，不展示不可用的示范输入。
-
-## 5. 项目应用与调整规则
-
-### 变量与项目换色
-
-YAML 是 Token 数值的唯一来源。全局变量供原生及自定义页面使用，本模板的扩展包含黑色内嵌面、工作区表面、操作前景、明亮中性操作底、数据序列和独立指标字号等缺失语义；递归读取以 `--` 开头的标量叶子，分组名不拼入 CSS 变量名，不重复定义同一变量。平台基础与项目扩展均在主题中声明，可无环引用，并按实际设计补充变量。
-
-需求决定内容和操作，平台约束限定可用能力，主题负责视觉表达。原生导航仅消费开放的六项颜色；项目确定自绘导航时才应用相应补充。不因暗色截图新增导航、设置入口、付费推广或助理功能。
-
-- 色彩来源：{{COLOR_SOURCE}}。
-- 品牌种子为 `{{PRIMARY_COLOR}}`。用户未提供时从项目已选品牌或明确的色彩来源确定种子并记录，不从本模板读取固定色相兜底；用户提供的种子不静默替换。
-- 品牌派生色按 YAML 指定比例生成：把种子与基底解析为 8 位 sRGB 通道，每通道计算 round(a × seed + b × base)，a + b = 1，限制在 0–255 并输出六位十六进制。该算法直接混合编码后的 sRGB 值，不做线性光转换；所有生成标记在项目阶段替换为实际颜色。
-- 七个 Brand Token 保留各自用途；中性表面与中性导航保持灰阶；主题数据序列随主色重算，独立比较序列及平台状态保留自身语义。换主色保留设计稿确定的导航、内容及 pop-up 明暗配对，只更新已经关联主题色的角色。
-- 换色保留设计稿既定的文字、底色和状态配对；主题值按既定公式关联主色，不按主色亮度自动挑选黑白前景、反转明暗或修改中性色值。文字、边界与状态表达仍按各自角色消费。
-
-正文中的局部尺寸与动效推断可按平台能力调整，但保留黑色页面、炭灰常规卡片及按内容启用的黑色内嵌面。固定全局字体及间距档位保持不变；没有图表或特色配方的页面仍需体现基础风格。
-
-### 项目页面设计
-
-实例化时仅为实际需要的页面填写以下确定结果；不照搬任何示例中的业务、人物、数字或模块数量。
-
-- **页面内容：** 页面名称、主要任务、真实信息与已有操作。
-- **首屏印象：** 第一视觉焦点、主次关系，以及通过暗面层次、文字、局部颜色和留白建立焦点的具体安排。
-- **布局安排：** 各区块的位置、宽度、列数、高度、对齐关系及必要的等高对象；明确窄屏后的顺序和重排，不统一套用三栏或固定侧部面板。
-- **视觉表达：** 每个区块采用的表面、组件及文字角色；使用特色配方时注明编号、位置和满足的数据或功能条件。
-- **标志性时刻：** 一处明确的静态画面或关键反馈，说明所在位置或触发条件、具体表现，以及对理解信息或完成任务的帮助。
-
-首屏焦点与标志性时刻可以来自同一处。布局必须服务真实内容增长；图片、头像、图标和品牌素材的来源、缺口处理与特殊约束写在对应页面。最终项目方案给出确定安排，不留下未完成选择，也不为套用配方扩充业务。
-
-{{PAGE_APPLICATIONS}}
-
-### 页面设计验收
-
-仅验收该页面实际采用的内容；尚未渲染时保留为待执行要求。
-
-- [ ] **首屏印象：** 焦点和内容主次符合页面方案；大面积保持安静，浅灰文字与少量彩色信号承担注意力。
-- [ ] **布局安排：** 分区、比例、列数、高度、对齐与窄屏顺序符合方案，信息增长不造成截断或互相遮挡。
-- [ ] **风格表达：** 暗面交替、细边界、文字层级成立，覆盖层可辨认；真实数据、状态与分类仍可区分，普通表单或列表也保留主题特征。
-- [ ] **标志性时刻：** 指定画面或反馈在约定位置或条件下出现，帮助理解信息或完成操作；没有以装饰数据或不可用功能替代真实内容。

package/yida-skills/skills/yida-design/templates/design-themes/dark-inset-hairline/form-layout.json

@@ -1,13 +0,0 @@
-[
-  {
-    "type": "ColumnContainer",
-    "layout": "12",
-    "columnGap": "16px",
-    "rowGap": "16px",
-    "display": "VERTICAL",
-    "mobileRowGap": "16px",
-    "children": [
-      []
-    ]
-  }
-]