openyida 2026.9.21 → 2026.9.22-beta.2

package/yida-skills/skills/yida-design/templates/design-themes/hairline-soft-blocks/design.md

@@ -1,409 +0,0 @@
----
-name: "{{PROJECT_NAME}}"
-description: "独立导航与白色画布相邻，以浅灰平面块、细描边白色面板和开放表格区分内容；无衬线大数字保持中等字重，主题色集中于小型标记、细折线及等距刻度，主题派生分类色、独立类别色与状态色按角色使用。"
-themeId: hairline-soft-blocks
-navTheme: light
-tokens:
-  application-global:
-    appearance:
-      surfaces:
-        "--pod-app-root-bg-color": "#FFFFFF" # neutral-gray；应用根节点兜底
-        "--pod-app-root-bg-image": "none" # 无全局背景图或纹理
-        "--pod-page-bg-color": "#FFFFFF" # neutral-gray；内容画布
-        "--pod-card-bg-color": "#FFFFFF" # neutral-gray；一级卡片、表单和详情面板
-        "--pod-table-cell-color": "var(--pod-card-bg-color)"
-      navigation:
-        "--pod-shell-theme-bg-color": "#FFFFFF"
-        "--pod-nav-item-text-color": "#484848"
-        "--pod-nav-item-text-hover-color": "#262626"
-        "--pod-nav-item-text-selected-color": "#171717"
-        "--pod-nav-menu-bg-hover-color": "#FAFAFA"
-        "--pod-nav-menu-bg-selected-color": "#F6F6F6"
-        "--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": "#DEDEDE"
-        "--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 #DEDEDE"
-        "--pod-nav-logo-border-radius": "8px"
-        "--pod-nav-sub-divider-color": "#DEDEDE"
-        "--pod-nav-item-text-disabled-color": "rgba(24,28,31,.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": "#DEDEDE"
-        "--pod-nav-popup-bg-color": "var(--pod-shell-theme-bg-color)"
-        "--pod-nav-popup-border-radius": "8px"
-        "--pod-nav-popup-shadow": "0 8px 24px rgba(24,28,31,.10)"
-        "--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": "#DEDEDE"
-        "--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": "#DEDEDE"
-        "--pod-nav-action-border": "1px solid #DEDEDE"
-        "--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": "42px"
-        "--pod-nav-menu-item-radius": "8px"
-        "--pod-nav-menu-item-border": "1px solid transparent"
-        "--pod-nav-menu-item-hover-border": "1px solid #DEDEDE"
-        "--pod-nav-menu-item-selected-border": "1px solid #A6A6A6"
-        "--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": "8px"
-    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% + #FFFFFF 74%，sRGB 逐通道混合>" # 主题色交互禁用
-      "--color-line1-1": "#EFEFEF" # neutral-gray；行分隔、轻网格及弱面板边界
-      "--color-line1-2": "#E5E5E5" # neutral-gray；控件和面板细描边
-      "--color-fill1-1": "#FFFFFF" # neutral-gray；输入基础表面，中性悬停保持白面
-      "--color-fill1-2": "#F2F2F2" # neutral-gray；中性按下与选中填充
-      "--color-fill1-3": "#EAEAEA" # neutral-gray；较重填充和进度轨道
-      "--color-fill1-5": "#FFFFFF" # neutral-gray；独立 pop-up 表面
-      "--color-fill1-10": "#262626" # neutral-gray；固定短 Tooltip 深底
-      "--color-text1-5": "#FFFFFF" # neutral-gray；固定短 Tooltip 反色字
-      "--color-text1-4": "#202020" # neutral-gray；标题、正文与数值
-      "--color-text1-10": "#606060" # neutral-gray；表头、placeholder
-      "--color-text1-3": "#737373" # neutral-gray；二级说明和轴标签
-      "--color-text1-2": "#ADADAD" # neutral-gray；仅禁用文字
-      "--color-text1-1": "#D6D6D6" # 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": 8px # 输入、菜单、普通按钮、表头外端
-      "--corner-3": 12px # 独立浮层、气泡、弹窗
-      "--corner-4": 14px # 浅灰摘要组外轮廓
-      "--corner-5": 18px # 大面板、卡片、抽屉外露边角
-      "--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-subtle-block-bg": "#F6F6F6" # neutral-gray；摘要平面块、表头带与静态分组底面
-      "--oyd-nav-current-accent": "var(--color-brand1-6)" # 自绘导航强调；随当前主题色更新，保留深字浅底的菜单配对
-      "--oyd-chart-series-main": "var(--color-brand1-6)" # 主序列始终随品牌种子更新，不随交互状态变化
-      "--oyd-category-1": "#1FC16B" # 独立类别色：绿色，不代表成功
-      "--oyd-category-2": "#F7B420" # 独立类别色：琥珀色，不代表警告
-      "--oyd-category-3": "<生成实际色值：--color-brand1-6 28% + #FFFFFF 72%，sRGB 逐通道混合>" # 同主题分类浅色阶；随品牌种子重新派生
-      "--oyd-category-4": "<生成实际色值：--color-brand1-6 58% + #FFFFFF 42%，sRGB 逐通道混合>" # 同主题分类中色阶；随品牌种子重新派生
-    typography:
-      "--oyd-font-size-metric": "28px" # 独立数值展示，推断；不改变全局标题规格
-      "--oyd-font-weight-metric": 500
-      "--oyd-font-lineheight-metric": 1.15
-    shadow:
-      "--oyd-shadow-hairline-lift": "0px 1px 2px 0px rgba(0, 0, 0, 0.025)" # 局部控件和面板可选微阴影，推断
----
-
-# {{PROJECT_NAME}} design.md
-
-## 1. 风格摘要
-
-**细线白面 · 浅灰拼块（hairline-soft-blocks）**
-
-导航与白色内容区以一条轻分界线建立区域关系，导航明暗采用本模板 navTheme。内容由浅灰平面摘要块、细描边白色面板和直接展开在画布上的表格组成；不同内容采用不同边界强度。无衬线字体贯穿页面，核心数字通过字号与留白突出，字重保持克制。主题色只占少量面积，主要落在图标标记、细折线和刻度条上。
-
-| 核心特征 | 可见表现 | 主要偏离风险 |
-| --- | --- | --- |
-| 同白画布与轻分界 | 页头和正文同为白色，以细线及留白区分；导航独立配色 | 内容突然变成大面积深底、暖灰底，会改变整体轻盈感 |
-| 平面块与轮廓卡并存 | 摘要信息用浅灰实面；复杂内容用白色圆角细框；集合可无外框 | 所有模块统一套卡片，或全部无边界，会丢失层次分工 |
-| 轻字重与清晰数值 | 短标题和正文为自然无衬线，大数字清楚但不厚重，比较信息紧随其后 | 等宽字体、大面积粗黑标题或过密大写字母会改变文字节奏 |
-| 局部主题色焦点 | 主题强调色用于小型导航标记和少量数据线，界面大部分保持中性 | 将面板、导航项和表格选中行整块染为主题色，会放大强调面积 |
-| 开放集合与圆形标识 | 表格以浅灰表头、横线和充足行内留白组织，圆形图标或头像帮助识别对象 | 把连续表格拆为圆角散卡，或给每个图标加底盒，会削弱比较效率 |
-
-这些基础机制可用于表单、列表、详情等不同页面。指标、折线、分段刻度和占比条属于按内容启用的表达，不是所有页面的必备模块。尺寸、替代字体与未展示的状态为实现推断，不把图片物理像素当作 CSS 尺寸。
-
-## 2. 页面视觉系统
-
-### 2.1 表面、区块与层次
-
-主题靠浅灰块、细线和留白形成层次，不靠连续嵌套容器或明显投影。静态浅灰内容块和白色描边面板并列存在；前者承载简短摘要，后者承载需要完整边界的多元素内容。表格等集合允许直接处于页面画布。
-
-| 对象 | 背景变量 | 边界、形状与阴影 | 前景与用途 |
-| --- | --- | --- | --- |
-| 应用根背景 | `--pod-app-root-bg-color`、`--pod-app-root-bg-image` | 无背景图、噪点或渐变 | 仅作用于根节点，提供白色兜底 |
-| 页面画布 | `--pod-page-bg-color`；自定义页使用 `--oyd-page-bg` | 默认无外框和投影 | 正文使用 `--color-text1-4` |
-| 一级卡片、表单与详情面板 | `--pod-card-bg-color` | `--color-line1-2` 细框、`--corner-5`；默认无阴影，可用局部微阴影 | 标题和主要值使用 `--color-text1-4`，说明用 `--color-text1-3` |
-| 摘要块、表头带和静态分组面 | `--oyd-subtle-block-bg` | 不叠加描边和阴影；摘要组外角用 `--corner-4`，表头外端用 `--corner-2` | 内容前景仍按正文和说明角色，不整体降透明度 |
-| 表格正文 | `--pod-table-cell-color` | 单元格 `--corner-zero`；横向分隔用 `--color-line1-1` | 外部可直接展开，不额外借面板底色制造套框 |
-| 输入控件 | `--color-fill1-1` | `--color-line1-2`、`--corner-2` | 值为一级前景，placeholder 使用 `--color-text1-10` |
-| 中性按下、选中 | `--color-fill1-2` | 保留原组件轮廓 | 不承担数据类别或序列语义 |
-| 较重填充、进度轨道 | `--color-fill1-3` | 以平面填充为主 | 仅表达底轨和较重中性结构 |
-| 下拉、气泡、弹出日历、弹窗、导航弹出层 | `--color-fill1-5` | `--color-line1-2`、`--corner-3`；小浮层用 `--shadow-1`，弹窗可用 `--shadow-2` | 使用白色覆盖层自己的主次前景；内部菜单仍用 `--corner-2` |
-| 抽屉 | `--color-fill1-5` | 外露角 `--corner-5`，贴边 `--corner-zero`；按层级用 `--shadow-2` | 不直接套用导航的前景和状态色 |
-| 数据读数浮层 | `--color-fill1-5` | `--color-line1-2`、`--corner-3`、`--shadow-1` | 全白内面，日期/类别在上、读数在下；不加额外灰色标题带 |
-| 简短 Tooltip | `--color-fill1-10` | `--corner-3`，紧凑内边距 | 固定与 `--color-text1-5` 配对，区别于多行读数浮层 |
-
-细描边按约 1 CSS px 实现（推断），优先保证连续但低强度的轮廓。`--oyd-shadow-hairline-lift` 仅用于需要极轻离地感的白色面板、按钮或圆形图标盒；同一区域不层层叠加。常规摘要块和表格无阴影，`--shadow-3` 不用于普通内容卡。
-
-`--color-white` 是全应用基础表面，当前随白色内容主面，不能当作固定白字；内容明暗切换时随主面同步。应用根背景图只作用于根节点，输入与卡片不继承其材质。浅灰分组面有自己的独立角色；不能因为当前颜色相近，就让它和 hover、disabled 或进度底轨共用语义。
-
-### 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 页面标题与操作
-
-页面标题和已有说明直接放在白色画布上，形成清楚的起始点，不另包一层卡片。标题用全局 subhead，说明用正文或 caption；两者之间采用 `--s-1` 或 `--s-2`。标题区与主体通常留 `--s-6`。
-
-已有的全局搜索、通知等轻工具可放在另一侧，使用无底盒或轻框的线性图标。页头仅承担当前页面身份和已有操作，不因存在欢迎文案而新建导航或固定用户姓名区域。
-
-区块标题可位于面板内部，也可作为开放表格的独立标题行。后者允许圆形功能图标在左，标题与短说明并列成组，搜索和已有查看操作在另一侧。图标不是每个标题的必需元素，没有说明或操作时收回相应留白。
-
-空间不足时保持标题先、说明次、操作后的阅读顺序，工具组可另起一行。具体排列和窄屏顺序由第五部分逐页确定，不压缩字号维持桌面结构。
-
-### 2.4 排版、间距与形状
-
-字体以 `--font-family-base` 贯穿全页。数字仍为无衬线，仅启用等宽数字特性（`tabular-nums`）辅助对齐，不使用整套等宽字体。大数值以字号、留白建立重点，避免全部升为极粗字重。
-
-| 角色 | 字号 | 字重与行高 | 前景及表达 |
-| --- | --- | --- | --- |
-| 普通页面标题 | `--font-size-subhead` | `--font-weight-subhead`、`--font-lineheight-subhead` | `--color-text1-4` |
-| 重要区块标题、对象名称 | `--font-size-body-2` | `--font-weight-body-2`、`--font-lineheight-body-2` | 一级前景，层次轻于核心数字 |
-| 面板标签、正文、按钮与输入 | `--font-size-body-1` | `--font-weight-body-1`、`--font-lineheight-body-1` | 正文一级前景；标签可用 `--color-text1-10` |
-| 表格正文与表头 | `--font-size-table` | `--font-weight-table`、`--font-lineheight-table` | 正文一级前景，表头用 `--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` | 一级前景；单位及比较说明另用 caption |
-
-百分比、金额、数量的符号、精度与千分位保持同口径；比较值与说明相邻，但颜色只施加于有意义的短数字或标签。图表读数浮层中的值可用 subhead 或 body-2，不必和顶部指标同样大。
-
-页面边距一般使用 `--s-8`，空间紧凑时使用 `--s-6`；邻接独立区块间使用 `--s-5` 或 `--s-6`，面板内使用 `--s-5`。标签至值采用 `--s-2`，图文之间采用 `--s-2` 或 `--s-3`。开放集合与上方内容用 `--s-6` 至 `--s-8` 留白分隔，表格内部通过自然行高维持从容节奏。
-
-主要白色面板用 `--corner-5`，浅灰摘要组用 `--corner-4`，浮层用 `--corner-3`，按钮和输入用 `--corner-2`，小复选框和键帽用 `--corner-1`。圆形头像和对象图标盒用 `--corner-circle`；`--corner-semicircle` 只用于少量变化标签，不把所有按钮和面板胶囊化。拼接内边与细刻度使用 `--corner-zero`。
-
-页面列数、主辅比例、固定高度、等高范围与窄屏顺序均由实际内容决定，不把某一张看板的两列或四指标结构固化为主题规则。
-
-### 2.5 色彩、图标与点缀
-
-主题色用于局部强调，其实际色相由当前项目主题确定。中性画布不随主色染色；`--color-brand1-3`、`--color-brand1-5` 保留主题色派生浅色与深色，只有需要主题色的外观角色才引用。主数据线使用 `--oyd-chart-series-main` 直接关联主题色种子，换主题时同步变化；交互 hover/active 不改变数据序列颜色。
-
-分类图形使用 `--oyd-category-1` 至 `--oyd-category-4` 的明确映射。第一、第二项保留非主题的绿色和琥珀色类别编码，不借用平台成功或警告状态；第三、第四项采用品牌派生的不同明度色阶，随主题种子更新，也不等于信息态或禁用态。图形与图例必须一一对应，并通过文字、百分比和总量提供含义，不能靠颜色猜测。分类数量和映射以项目实际数据为准。
-
-成功、警告、错误和信息反馈采用平台既有语义，不另建页面同义状态 Token。正负变化是否有利由业务解释，绿色不等于所有正数，红色也不等于所有负数。小幅变化可用着色文字，重点比较可使用由平台状态色派生的浅底标签，正文仍保持可读。
-
-图标使用同一套轻线性家族，推断以 16–20 CSS px 和约 1.5 CSS px 描线为基础。导航图标和页头工具直接放在白面；记录对象或集合标题需要识别锚点时才使用白底细框圆形图标盒。图例小圆点使用分类色，人物使用真实圆头像，不能用头像占位替代对象类型。
-
-主题无全局渐变、玻璃效果、纸纹或像素底纹。小型情绪图形可作为已有评价的辅助表达，但必须伴随明确文字，不能承担唯一含义；没有真实评级映射就省略。标识、头像和图形素材来自项目，不沿用示例人物、品牌或联系方式。
-
-## 3. 基础组件表达
-
-本节规定组件出现时的样式，不构成项目必须具备的组件清单。未列出的组件按任务、表面、文字、形状和状态推导。
-
-### 3.1 内容面板与平面分组
-
-白色面板承载需要明确边界的图表、表单或多元素详情，标题与已有操作在同一行，内容使用自然高度。仅有短摘要时可以使用浅灰平面块，不叠加白色内面、灰色外托或双重轮廓。
-
-开放区块靠标题、留白和横线组织，适合连续表格或记录集合；没有完整边界的需要时不增加装饰卡框。分组之间不必等高，不通过空白占位强行拉齐不同内容量。
-
-### 3.2 按钮与轻操作
-
-普通查看、详情、周期筛选等操作优先白底细框：背景 `--color-white`，描边 `--color-line1-2`，文字 `--color-text1-4`，圆角 `--corner-2`；必要时使用局部微阴影。按钮轮廓存在感低于主要内容，不能将每个次级动作都变为实色按钮。
-
-只有任务明确需要主要提交或推进动作时，才采用 `--color-brand1-6` 实底；前景沿该操作已确定的设计配对，替换主色不触发黑白选择。其悬停、按下、禁用分别使用对应 Brand Token。这是未展示组件的推断扩展，不为页面增加额外主动作。
-
-按钮使用 `--s-7` 至 `--s-10` 四档高度，同一工具组统一档位；常规详情操作可用 `--s-8`，搜索旁操作可用 `--s-9` 或 `--s-10`。图标按钮与相邻控件匹配尺寸，行内更多操作可直接显示小型竖向省略号，无需为每行增加厚重按钮盒。
-
-中性悬停保持 `--color-fill1-1` 白面，并增强现有图文或边界；按下使用 `--color-fill1-2`。不要为了让白底 hover 明显而借用浅灰摘要面，造成结构角色与交互状态联动。
-
-### 3.3 输入、搜索与筛选
-
-输入使用 `--color-fill1-1`、`--color-line1-2` 和 `--corner-2`，保留白色内面。前置图标与 placeholder 使用说明或表头前景，值使用一级前景。高度仅用 `--s-8` 至 `--s-10` 三档，不按大幅导出图片增加规格。
-
-搜索中的快捷键键帽只在存在真实快捷键时呈现，使用小圆角、细框与弱文字。选择器的展开箭头靠近当前值，保持紧凑；日历与选项菜单打开后使用独立白色 pop-up。
-
-聚焦采用清楚的主题色边界或外轮廓，推断约 2 CSS px，不以细微阴影单独传达焦点。校验状态沿用平台语义，并给出文字说明。没有搜索或筛选需求时不保留空输入框。
-
-### 3.4 表格与独立记录列表
-
-表格直接展开在白色画布或必要的内容面内，默认不加外包卡框。标题、说明和已有搜索操作在表格外形成一条开放工具行。表头使用 `--oyd-subtle-block-bg`，外侧端角 `--corner-2`，内部单元格连续；表头文字用 `--color-text1-10`，排序箭头保持次要。
-
-正文单元格背景使用 `--pod-table-cell-color`，通过 `var(--pod-card-bg-color)` 跟随卡片背景。仅用 `--color-line1-1` 横线分隔，避免粗竖线、密集网格、每行单独圆角以及强烈斑马纹。推断行内垂直留白优先 `--s-4`，水平留白用 `--s-3` 或 `--s-4`；多行内容自然扩展，不用固定行高截掉信息。
-
-第一列若表示对象，可组合小圆形线性图标或真实头像与对象名称。类型图标、头像和文字之间采用 `--s-3`，只给具备识别价值的对象加图标。日期、账户等普通字段维持纯文字。金额保留符号并启用等宽数字，同列对齐一致；需要连续金额比较时优先右对齐，其余文本列左对齐。
-
-复选框、排序、行操作仅在实际功能存在时显示。选中行使用 `--color-fill1-2` 与必要的主题色复选标记，不改变所有单元格文字为主题色。只读或历史记录并不等于禁用，不将整行弱化到不可读。
-
-独立记录列表复用开放白面、轻分隔与图文节奏，按内容自然排列；不要求列表具备表头或数值列，也不因列表造型而拆散本应连续比较的表格。
-
-### 3.5 图表、图例与读数
-
-图表底色保持白色，主线或主要数据图形使用 `--oyd-chart-series-main`。细辅助线用 `--color-line1-1`，更需要定位的引导线可用 `--color-line1-2`；轴标签为 `--color-text1-3`。不默认添加面积填充、渐变阴影、每个点的永久标记或多余外边框。
-
-浮层用全白内面：顶部是较弱的日期或类别，下面是较大的当前值和有依据的比较说明。只有真实可计算的比较才显示着色变化值，缺失比较时收回相应空间。浮层使用 pop-up 表面，不与固定深底短 Tooltip 混为一类。
-
-图例、图形、悬停/选中读数和可读数据入口必须同源。时间轴范围与聚合周期一致，单位明确，零值与缺失分开处理；不得把不连续观测点补成随机曲线。浅色分类条、图例点都需要邻近的名称与数值，不能将浅色当作低权重或禁用语义。
-
-进度或等级底轨使用 `--color-fill1-3`，不是图表数据序列。存在目标区间时才映射长度，未定义最大值、阈值或方向时不自行解释一个分数。
-
-### 3.6 状态与反馈
-
-| 状态 | 表达 |
-| --- | --- |
-| Hover | 中性控件保持白色基础面，通过已有边界、图文增强识别；导航使用专用 hover 配色 |
-| Active | 中性操作 `--color-fill1-2`，主题色操作用 `--color-brand1-9`；不移动整块内容 |
-| Focus | 独立清楚的主题色轮廓，浅底与前景成套，不以颜色微差作为唯一线索 |
-| Selected | 中性行和选项用 `--color-fill1-2`；导航单独按其专用映射 |
-| Disabled | `--color-text1-2` 与浅中性面配合；主按钮使用 `--color-brand1-10`，仅用于实际不可操作对象 |
-| Error / Warning / Success / Info | 平台已有语义色配文字或图标；不使用分类色冒充状态 |
-| Loading | 保持内容结构的静态浅灰占位，不填入假数值和模拟曲线 |
-| Empty / No results | 在原区域显示简短说明；有真实可用操作才显示入口，不留下占满空间的空图形 |
-
-未展示的状态按以上关系推断。局部反馈保持短促、轻微，颜色或透明度过渡即可；不使用反复发光、弹跳数字或大幅缩放面板。
-
-### 表单组件与版式结构
-
-表单使用与自定义页面相同的应用全局样式，字体、色彩、表面、边界、圆角、密度和状态延续本主题。表单支持在顶部、左侧、主体、右侧和字段之间组合 Tab/切换、按钮组/操作入口、图片/图形、状态区、标题与 `Divider`、`ColumnContainer`、辅助内容和业务字段。各组件承担导航、操作、视觉焦点、反馈、层级、节奏、装饰或采集作用。普通业务分组和章节分隔使用 `Divider`，横向字段组合使用 `ColumnContainer`。每张表单在项目 `design.md` 写清组件位置与作用、列比例、标签位置、字段与章节间距、底栏、详情延续和窄屏重排。
-
-## 4. 特色表达配方
-
-### R1 连续浅灰摘要拼块
-
-**适用内容：** 存在一组需要并列阅读、层级相近的简短指标或摘要。数量和布局由真实内容决定，单项也可以使用同类平面表达。
-
-**继承基础：** 采用浅灰分组面、数值排版、状态语义与间距规则，不依赖其他配方。
-
-**特殊组合：** 将摘要单元放在近乎连续的浅灰平面组中，以窄白色缝隙区分，避免逐张加边框和阴影。缝隙推断约 2 CSS px，属于组合局部参数；内容留白仍用 `--s-4` 或 `--s-5`。组合外缘用 `--corner-4`，内侧接缝接近直角。标签在上，核心值在下，有比较信息时紧随数值，以小字号变化值和较弱说明构成一行或自然换行。
-
-**无匹配时：** 指标优先级差异大、说明较长或含复杂操作时，改用基础面板或普通分组。没有比较信息就只保留真实值和口径，不补造上期变化；不固定为两行两列。
-
-### R2 等距细刻度量表
-
-**适用内容：** 有明确最小值、最大值、方向与阈值的连续指标、完成度或评分，并有可读数值或等级说明。分数本身不能自动推导百分比。
-
-**继承基础：** 采用白色细框面板、正文与数值排版、平台状态和中性轨道规则。
-
-**特殊组合：** 以等宽、等距、细长的垂直短条排列成水平量表，已覆盖部分使用 `--oyd-chart-series-main`，剩余部分使用 `--color-fill1-3`。推断每条宽 3–5 CSS px、间隔 3–4 CSS px，条高约 `--s-8`；根据可用宽度调整条数后，保持单图内条宽和间隔一致。
-
-长度按 `(value − min) / (max − min)` 计算并处理越界提示，不凭视觉估计补充最大值。量表是整体比例的离散呈现，不将每条误解为一次事件；可用末条部分填充或明确的取整策略，数值文字仍展示真实精度。若存在实际等级解释，可在量表上方展示文本；情绪图形只作为已有评价的辅助，不能代替阈值说明。
-
-**无匹配时：** 缺少量纲、范围或等级映射时仅展示原值及说明，省略刻度与情绪图形。离散事件数量应采用其实际任务需要的列表或统计图，不套用连续量表。
-
-### R3 细折线与白色读数卡
-
-**适用内容：** 有序时间或连续横轴上的真实序列，观测密度足以表达变化，聚合周期与轴标签明确。
-
-**继承基础：** 采用基础图表的主序列色、轴线、浮层和读数规则，以及白色细框面板。
-
-**特殊组合：** 用约 2–3 CSS px 的折线连接真实点（推断），保留真实波动的折角，不默认使用平滑插值或面积填充。水平方向弱实线辅助比较，周期边界可用轻竖虚线；选择定位时仅强调当前点，以同色圆点和白色外缘提高辨认。
-
-白色读数卡位于定位点附近，日期在上、读数及有依据的变化在下；具体触发方式与避让位置属于项目实现决策。面板标题下可显示与该图同口径的概要值及轻变化标签；没有对应概要就省略，不能自行将各时点相加。
-
-**无匹配时：** 不连续分类、无效时间序列或缺失严重时使用合适的基础图表或数据表，不插入随机点维持锯齿形。没有当前定位时，不永久显示圆点或遮挡图形的读数卡。
-
-### R4 彩色比例带与对照明细
-
-**适用内容：** 同一整体内互斥且可加总的非负分类，拥有明确总量与分母；适合紧凑地展示组成。
-
-**继承基础：** 采用白色细框面板、独立类别配色、图例、表格对齐与说明文字规则。
-
-**特殊组合：** 顶部是一条低高度的水平分类带，各段为近矩形色块，端角用 `--corner-1`，段间仅留细白缝。下方以轻量对照行列出色点、分类名称、百分比和总量；行内对齐，不把每一项再包成卡片。色带、图例点与明细始终共享同一分类映射。
-
-色段宽度按同一分母的实际比例计算；先扣除固定缝隙，再将剩余可用宽度按比例分配，避免空隙改变占比。百分比的显示精度与总和处理必须一致，真实零值不分配最小装饰宽度，未知分类不可静默计为零。分类数量由数据决定，超过既有色数时需明确可区分的扩展方案或更合适的图形。
-
-**无匹配时：** 分类重叠、数值有正有负、统计口径不一或缺少总量时，改用带数值的普通明细或独立条形比较，不显示假的整体占比。没有百分比任务时不为了彩色条而新增统计字段。
-
-## 5. 项目应用与调整规则
-
-### 变量、平台与优先级
-
-YAML 是变量值的唯一事实源，正文说明角色及消费关系。平台基础与项目扩展按职责组织，递归读取以双连字符开头的标量叶子，分组名不拼进变量名；平台基础与项目扩展均在主题中声明，可无环引用，并按实际设计补充变量。`--oyd-page-bg` 单向桥接 `--pod-page-bg-color`，`--pod-table-cell-color` 单向引用 `--pod-card-bg-color`。
-
-`--oyd-subtle-block-bg` 表示静态结构面，与输入基础面、中性选择、进度轨道分别维护；相同或相近颜色不代表可互换的职责。本模板扩展了图形、分组面、独立导航点缀和数值展示语义，项目可按实际需求继续补充。
-
-需求决定页面与内容，平台限制实际接口，主题决定视觉语言。原生导航仅采用六项开放配色；主题强调色图标和边缘标记是自绘导航的条件补充。内容区换色与导航换色独立处理，不以主题色派生色代替框架背景。无明确变量名的状态色沿用平台语义，不杜撰接口。
-
-固定的字体 16 项与间距 10 项保持不变。局部线宽、图形密度、缝隙和未展示的交互状态属于推断，可在页面实现时调整；调整仍应保留白面、浅灰平面块、细轮廓与克制强调。实际内容增长优先于等高卡片、固定图表比例或装饰性布局。
-
-### 主题色与图形色实例化
-
-- 色彩来源：{{COLOR_SOURCE}}。
-- `{{PRIMARY_COLOR}}` 是唯一主题色种子。按“用户明确指定 → 项目已配置 → 平台当前主题”的顺序取得实际值，不回退到参考图的具体色相。没有可用种子时保留主题色占位，由项目实例化补齐，不擅自设置固定色。中性灰均为固定 `neutral-gray`，不随主题色变化。换主题色保留白色画布、浅灰分区、深色文字及既有状态色和非主题分类色，所有品牌关联角色同步更新。
-- 所有派生标记采用 sRGB 编码通道逐通道混合：`round(seed × 种子权重 + base × 基底权重)`，两项权重之和为 1，结果输出为不透明十六进制颜色。种子、基底和比例以各 Token 的 YAML 标记为准，不额外混入 HSL 调整或伽马变换。
-- 七个主题色变量分别保留悬停、平台预留浅色、派生浅色、派生深色、主色、按下、禁用的既定职责。实例化时将生成标记转换为实际颜色，默认、悬停、按下和禁用继续使用各自已确定的表面与前景配对。
-- 主数据序列直接引用 `--color-brand1-6`，持续保留主题依赖，不绑定任何交互按下色。用户另有数据色规范时，在项目文档中确定实际序列映射，不自行增加序列。
-- 自绘导航强调直接引用 `--color-brand1-6`，主题色变化时随引用更新，菜单的深色文字和浅色底面配对保持不变。六项导航中性配色保留自身角色；若项目为其中任何项启用主题强调，引用对应 Brand Token，不填入旧主题色值或内容 Text／Fill。
-- 类别一与二保留独立分类编码；类别三与四由品牌种子混合无色相白得到不同明度，换种子时同步重算，不能冻结旧结果。所有类别色不能借作状态语义或文字可读性兜底；项目明确映射，保留图例、条带和明细的既定表达，不因替换主色增加纹理或调整明暗。
-- 沿用设计稿的深字浅底及各状态配对，换主色只更新关联的图标、标记与图形色，不自动挑选黑白前景或改变灰阶、边界和强调形式。状态反馈继续使用平台语义，分类与业务状态分开解释。
-
-### 项目页面设计
-
-实例化时，仅为需求中的实际页面给出确定方案；不带入示例名称、个人信息、字段、分数、金额或固定的模块数量。每页包括：
-
-- **页面内容：** 页面名称、主要阅读或操作任务、真实内容、数据来源和已有操作。
-- **首屏印象：** 第一眼的焦点，以及白色留白、浅灰平面块、细框面板和文字尺度如何形成主次；普通表单也可用清楚分组建立焦点。
-- **布局安排：** 各区块具体位置、宽度、列数、高度策略、必要的等高对象和对齐关系；确定窄屏后的内容顺序。不要沿用示例的四摘要、主辅两列等数量作为默认需求。
-- **视觉表达：** 每个区块采用开放区、浅灰平面或细框白卡中的哪一种，使用哪些文字与控件规则；采用配方时明确编号、位置及数据前提。
-- **标志性时刻：** 确定一处静态构图或真实反馈，例如浅灰摘要组与下方开放集合的明确层次，或选中折线点后出现白色读数卡；写清位置、触发条件和任务价值。
-
-首屏印象与标志性时刻可以来自同一处静态画面，不要求增加动画或新操作。素材来源、缺失处理和平台特殊限制直接写入对应页面，最终方案给出确定选择，不留下“根据情况决定”的未完成布局。
-
-{{PAGE_APPLICATIONS}}
-
-### 页面设计验收
-
-以下保留为实际页面渲染后的验收要求，文档生成阶段不视为已完成。
-
-- [ ] **首屏印象：** 焦点、主次与页面方案一致，白色画布和留白占主导，主题色保持局部强调。
-- [ ] **布局安排：** 分区、比例、列数、高度、对齐和窄屏重排符合确定方案；不缩小固定字号维持原列数。
-- [ ] **风格表达：** 浅灰平面块、细框白面与开放集合按实际内容分工，文字保持无衬线与轻字重；导航、分类色和状态色各自清楚，未采用配方也能体现基础主题。
-- [ ] **标志性时刻：** 约定画面或反馈在正确位置与条件下出现；读数、比例、量表范围与实际数据一致，并帮助理解内容或完成操作。

package/yida-skills/skills/yida-design/templates/design-themes/hairline-soft-blocks/form-layout.json

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