openyida 2026.9.21 → 2026.9.22-beta.2

package/yida-skills/skills/yida-design/templates/design-themes/soft-outline-rhythm/design.md

@@ -1,455 +0,0 @@
----
-name: "{{PROJECT_NAME}}"
-description: "近白画布上的细描边柔圆面板，通过组间留缝、组内浅底分段和有分工的形状尺度形成清楚、舒展的内容节奏；有对应数据图形时，以同色轻渐变形成柔和层次。具体组件与页面结构由真实需求决定。"
-themeId: soft-outline-rhythm
-navTheme: light
-tokens:
-  application-global:
-    appearance: # 应用外观：应用背景、内容表面与完整导航设计
-      surfaces: # 应用背景与内容表面
-        "--pod-app-root-bg-color": "#FAFAFA" # neutral-gray；应用根背景，刷新与内容未挂载时兜底
-        "--pod-app-root-bg-image": "none" # 应用根背景图；支持 none、完整 url("...") 或 CSS 渐变，只作用于根节点
-        "--pod-page-bg-color": "#FFFFFF" # neutral-gray；全局页面画布背景事实源
-        "--pod-card-bg-color": "#FFFFFF" # 一级卡片、表单主容器、详情面板表面
-        "--pod-table-cell-color": "var(--pod-card-bg-color)" # 表格正文单元格背景；跟随卡片背景
-      navigation:
-        "--pod-shell-theme-bg-color": "#FAFAFA"
-        "--pod-nav-item-text-color": "#737373"
-        "--pod-nav-item-text-hover-color": "#202020"
-        "--pod-nav-item-text-selected-color": "#202020"
-        "--pod-nav-menu-bg-hover-color": "rgba(0, 0, 0, 0.02)"
-        "--pod-nav-menu-bg-selected-color": "#F3F3F3"
-        "--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": "12px"
-        "--pod-nav-menu-item-border": "1px solid #DEDEDE"
-        "--pod-nav-menu-item-hover-border": "1px solid #A6A6A6"
-        "--pod-nav-menu-item-selected-border": "1px solid #737373"
-        "--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": "#EEEEEE" # neutral-gray；弱边界、图表辅助线、行分隔线
-      "--color-line1-2": "#E3E3E3" # neutral-gray；按钮、输入框与容器常规边界
-      "--color-fill1-1": "#FAFAFA" # neutral-gray；控件内部默认浅填充、菜单悬停与弱状态
-      "--color-fill1-2": "#F3F3F3" # neutral-gray；点击或中性选中填充
-      "--color-fill1-3": "#D6D6D6" # 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-fill1-10 配套
-      "--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: # 按组件用途选择 Token；修改数值会同步影响所有引用该 Token 的组件
-      # 调整风格时保留用途映射；常规圆角增大更圆润、减小更利落，各数值档位保持递增
-      "--corner-zero": 0px # 直角；用于贴边、拼接和不需要圆角的区域
-      "--corner-1": 4px # 微圆角；用于小标签、复选框、离散矩阵格，控制细小元素的轮廓
-      "--corner-2": 8px # 控件圆角；用于输入控件（input）、菜单项（menu-item），统一输入与菜单的形状
-      "--corner-3": 12px # 浮层圆角；用于浮层、气泡层、弹窗的外轮廓，内部菜单项仍用 --corner-2
-      "--corner-4": 16px # 中间档圆角；沿用本主题已有的摘要图标盒、独立数据行映射，不自动扩展到其他组件
-      "--corner-5": 20px # 大容器圆角；用于页面、卡片、抽屉的外轮廓，控制整体容器的柔和程度
-      "--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-on-brand-light": "#FFFFFF" # neutral-gray；设计稿主按钮的浅字前景，与基础表面和 Tooltip 独立
-      "--chart-series-main": "<生成实际色值：--color-brand1-6 72% + #171717 28%，sRGB 逐通道混合>" # 持续显示的主数据序列与强度最高档；不是交互按下色
-      "--chart-series-comparison": "#00B8A9" # 独立对比数据序列；不作通用主题强调或成功色
-      "--chart-category-accent": "#F2A000" # 独立分类序列强调，不表达警告；必须与真实分类稳定绑定
-      "--chart-heat-step-1": "<生成实际色值：--color-brand1-6 14% + #FFFFFF 86%，sRGB 逐通道混合>" # 同色相强度阶第一级；非交互状态
-      "--chart-heat-step-2": "<生成实际色值：--color-brand1-6 32% + #FFFFFF 68%，sRGB 逐通道混合>" # 同色相强度阶第二级
-      "--chart-heat-step-3": "<生成实际色值：--color-brand1-6 58% + #FFFFFF 42%，sRGB 逐通道混合>" # 同色相强度阶第三级
-    typography:
-      "--font-size-metric-primary": "24px" # inferred；独立核心数值语义，不覆盖页面标题
-      "--font-weight-metric-primary": 600
-      "--font-lineheight-metric-primary": 1.2
----
-
-# {{PROJECT_NAME}} design.md
-
-## 1. 风格摘要
-
-**柔边节奏 · soft-outline-rhythm**
-
-近白画布上的细描边柔圆面板，通过组间留缝和组内浅底分段形成清楚、舒展的内容节奏。默认采用中等信息密度，颜色集中在少量操作与数据焦点；有柱体、条形或环形分段时，以同色轻渐变增加图形内部的柔和层次。
-
-| 核心特征 | 可见表现 | 主要偏离风险 |
-| --- | --- | --- |
-| C1 同底细描边，阴影退后 | 画布与面板色差很小，细边框和留白负责分区，普通内容不依赖浮起效果 | 普通卡片使用深投影或浓背景，层层加重边界 |
-| C2 组间留缝，组内分段 | 独立内容组之间留白，组内标题、主体和辅助信息通过细线或浅底区分 | 每组文字再次套卡，或把不同层级内容无差别堆叠 |
-| C3 柔圆轮廓，尺度有分工 | 外层面板舒展，输入与菜单紧凑，按钮呈胶囊形，细小标记保持小圆角 | 所有元素使用同一大圆角，图标装饰抢过内容 |
-| C4 同色轻渐变数据填充（按内容启用） | 柱体、条形或环形分段围绕自身系列色作轻微过渡，图形有层次，数值端点和类别边界仍清楚 | 跨类别混色、过度渐隐，或把图形渐变扩散到整张面板 |
-
-### 风格应用原则
-
-- 页面结构、所需组件和内容优先级根据项目需求确定；导航沿用项目已确定的实现方式与结构。
-- 纯表单、详情或列表同样沿用这套视觉系统；特色配方只应用于真实存在的内容，不为体现风格补造模块。
-- C4 只在已有内容需要相应数据图形时应用；没有这类图形的页面通过 C1–C3 保持风格一致。
-
-## 2. 页面视觉系统
-
-YAML 定义变量值；本部分说明变量用于哪些视觉对象，以及对象之间如何形成层次。组件组合在第三部分定义，特色配方只补充特殊做法。正文保留映射和使用条件，不重复维护已有 Token 的具体值。
-
-### 2.1 表面、区块与层次
-
-| 对象 | 默认视觉表现 | 使用变量与范围 |
-| --- | --- | --- |
-| 应用整体背景 | 近白底色作为页面尚未加载时的兜底，默认无背景图 | `--pod-app-root-bg-color`、`--pod-app-root-bg-image`；图像只作用于应用根节点 |
-| 页面画布 | 白色、连续的内容底面 | `--pod-page-bg-color`；自定义页通过 `--oyd-page-bg` 继承 |
-| 一级内容面板 | 接近画布的白色表面，以细描边和外部留白区分独立内容，默认无阴影 | 背景 `--pod-card-bg-color`，常规边界 `--color-line1-2` |
-| 面板内部分隔 | 用细线区分同组内确有区别的内容层次 | `--color-line1-1` |
-| 辅助信息带 | 在白色主体旁形成较弱的浅底分段 | 背景 `--color-fill1-1`；需要分隔时使用上述弱边界 |
-| 下拉菜单、浮层、气泡层、弹窗、弹出日历 | 白色细边界表面，以覆盖层阴影表达浮起关系 | 背景 `--color-fill1-5`，边界 `--color-line1-2`，外层圆角 `--corner-3`；内部菜单项圆角 `--corner-2` |
-| 抽屉 | 白色细边界表面，使用较大圆角与覆盖层阴影 | 背景 `--color-fill1-5`，边界 `--color-line1-2`，圆角 `--corner-5` |
-| 图表读数浮层 | 白色表面，一级与二级文字、弱分隔与数值对齐，使用覆盖层阴影 | 背景 `--color-fill1-5`，边界 `--color-line1-2`，内部分隔 `--color-line1-1`，圆角 `--corner-3` |
-| 短提示 Tooltip | 固定深底浅字，不随品牌或导航明暗变化 | 背景 `--color-fill1-10`，文字 `--color-text1-5`，圆角 `--corner-3` |
-
-- **区块之间：** 具有独立标题、任务或阅读目的的内容可以使用外容器，组间通过统一留白分开；不因字段或说明变多就逐层套卡。
-- **区块内部：** 关联紧密的内容优先通过留白组织。确有标题区、主体和辅助信息时，再使用分隔线或辅助带；没有相应内容就取消该分段。
-- **边界与阴影：** 描边默认 1px；表中标明“覆盖层阴影”的对象统一使用 `0 8px 24px rgb(0 0 0 / 0.07)`（推断局部参数），嵌套内容不累加投影。
-- **文字：** 业务表面的文字沿用 2.4 的对应角色；短提示 Tooltip 使用表中的专用文字色。
-- **材质边界：** 普通表面不使用玻璃、发光、大面积渐变或纹理；不在页面底部加遮挡内容的渐隐遮罩。
-
-### 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 页面标题与操作
-
-本节用于自定义页面中的标题、说明和页内操作，采用原生导航或自绘导航均适用。仅呈现需求中已有的内容。
-
-- **底色：** 标题与操作直接放在页面背景上，沿用 2.1 的页面画布，不额外包一张卡片。
-- **排列：** 标题放在左侧，说明放在标题下方；页内操作放在右侧，空间不足时换到下一行。没有说明或操作时，不为它们留空位。
-- **对齐：** 标题区与下面正文的左右边缘一致，均以内容区为准；边距和间距沿用 2.4。
-- **文字与按钮：** 标题使用 2.4 的“页面标题”排版，说明使用“说明、时间、坐标与图例”排版；按钮样式与主次关系按 3.2。
-
-页面标题区不负责切换应用页面。项目还需要自行绘制全局工具栏时，才使用 R1 将两者上下组织。
-
-### 2.4 排版、间距与形状
-
-**文字层级**
-
-| 文字角色 | 字号 / 字重 / 行高 | 文字色与用途 |
-| --- | --- | --- |
-| 页面标题 | `--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`；次要操作的颜色由对应组件规则定义 |
-| 表格文本 | `--font-size-table` / `--font-weight-table` / `--font-lineheight-table` | 内容用一级文字，表头用 `--color-text1-10` |
-| 说明、时间、坐标与图例 | `--font-size-caption` / `--font-weight-caption` / `--font-lineheight-caption` | `--color-text1-3`；不能用禁用色替代说明色 |
-| 真实核心数值 | `--font-size-metric-primary` / `--font-weight-metric-primary` / `--font-lineheight-metric-primary` | `--color-text1-4`；仅指标或图表总量使用，不覆盖标题 |
-
-页面文字使用 `--font-family-base`；自绘导航文字的状态差异以 2.2 为准。数值启用 `font-variant-numeric: tabular-nums`，统一单位、小数位和千分位；数值按列右对齐，文字按列左对齐。
-
-**间距与密度**
-
-- 页面边距宽屏用 `--s-8`、中屏用 `--s-6`、窄屏用 `--s-4`；区块间距用 `--s-6`，同组内容用 `--s-2` 至 `--s-4`，保持组间间距大于紧密关联元素的间距。
-- 一级面板内边距默认用 `--s-6`；需要提高密度时，同一区域可统一用 `--s-5`。
-- 默认中等密度，容器内部留白充足。连续比较或批量编辑可以收紧行内留白，仍使用平台间距档位；不能通过缩小固定字体提高密度。
-
-**形状关系**
-
-外层面板使用舒展的大圆角，内部输入和菜单使用较小圆角，按钮保留胶囊轮廓；图标盒和小标签依各自用途选档，不对所有元素套同一圆角。YAML 保留各档用途注释，自绘导航的组件样式见 2.2，基础组件见第三部分，配方中的特殊轮廓见第四部分。
-
-普通内部分段不增加独立圆角；贴边拼接可使用 `--corner-zero`。浅底辅助带沿外容器底部裁切，焦点轮廓、展开内容和浮层不可被误裁切。
-
-### 2.5 色彩、图标与点缀
-
-- 品牌主色 `--color-brand1-6` 用于主要操作、链接、焦点和有真实含义的进度；成功、警告、错误、信息使用平台状态语义，不从图表色猜测状态。
-- 普通画布与面板保持中性。装饰和交互强调面积以首屏约 10% 为推断参考，用于约束强调强度，不限制真实数据图形的面积。
-- 图标使用同一套圆端线性图标，线宽建议 1.5–1.75 CSS px（推断）。行内图标用 `--s-4`，主要控件图标用 `--s-5`，摘要和快捷入口图标用 `--s-6`；图文间距用 `--s-2`。
-- 图标默认直接随文字排布并跟随文字色；需要独立识别的摘要或快捷入口才使用 3.4 的描边图标盒，普通标题不统一加色条、徽章或图标底盒。
-- 点缀来自已有图标、真实数据标记和必要的选择反馈。没有数据时不增加装饰折线、随机矩阵或虚构进度；数据图形的共用规则见 3.6，特殊做法见第四部分。
-
-## 3. 基础组件表达
-
-本部分将第二部分的视觉系统落实为组件。未说明的表面、文字和间距沿用全局规则；每项只补充自身结构、尺寸及关键变量。组件按真实需求出现，状态视觉统一见 3.7。
-
-### 3.1 面板与内容分组
-
-- 一级面板继承 2.1 的背景、边界与无阴影默认值，圆角使用 `--corner-5`，内边距使用 2.4 的统一档位。
-- 有独立标题区时，标题用面板标题排版，现有工具与标题保持基线对齐；有辅助信息时再启用 2.1 的辅助带。
-- 字段组或详情分组使用现有标题、留白和分隔组织，不为每个字段加独立大卡。各面板的高度与对齐关系遵循第五部分的“项目页面设计”。
-- 示例：一个已有详情面板可包含主体和辅助记录两个分段；没有辅助记录时使用单段面板。这个示例不要求项目新增详情页。
-
-### 3.2 按钮、工具栏与选择
-
-- 按钮四档高度依次使用 `--s-7`、`--s-8`、`--s-9`、`--s-10`；图标按钮取同档正方形，圆角统一使用 `--corner-semicircle`，文字沿用正文。
-- 主按钮背景用 `--color-brand1-6`，沿用浅字前景 `--oyd-on-brand-light`；`--color-white` 只承担基础表面。次级按钮用 `--color-fill1-1` 背景、`--color-line1-2` 边界和 `--color-text1-10` 文字，各状态保留设计稿配对。
-- 按钮横向内边距默认用 `--s-4`，紧凑区域可统一用 `--s-3`；图文间距沿用全局规则。一组操作保留一个视觉主操作，其他操作降低强调程度。
-- 工具栏按任务分组，组内间距用 `--s-2`，组间用 `--s-4`。视图与筛选在前、搜索与主操作在后是可用示例；实际顺序沿用页面规划。
-- 批量选择、导出、排序和视图切换只在需求定义时出现。导航和输入式选择器使用各自控件形状，不因可点击就改成胶囊按钮。
-
-### 3.3 输入与字段反馈
-
-- 紧凑、常规、宽松输入高度分别用 `--s-8`、`--s-9`、`--s-10`；多行输入随行数增长。背景用 `--color-fill1-1`，边界用 `--color-line1-2`，圆角用 `--corner-2`。
-- 正文沿用正文排版，placeholder 用 `--color-text1-10`。标签、帮助说明和校验信息保持稳定顺序。
-- 错误信息位于对应字段下方。聚焦、禁用和选中分别遵循 3.7 的状态视觉，边框宽度始终不变。
-- 日期选择器的输入部分继承本节，弹出日历的表面规则见 2.1；组件的具体数据结构与操作由需求决定。
-
-### 3.4 共用图标盒、标签与进度
-
-| 基础表达 | 默认结构与关键变量 | 使用条件 |
-| --- | --- | --- |
-| 描边图标盒 | 边长 `--s-10`，圆角 `--corner-4`，背景 `--pod-card-bg-color`，边界 `--color-line1-2`；图标尺寸及线型继承 2.5 | 摘要或快捷入口确实需要独立图标识别时使用，不给所有图标增加底盒 |
-| 状态小标签 | 圆角 `--corner-1`，水平内边距 `--s-2`，文字用说明排版；平台状态色用于文字、图标或细边界 | 只有真实状态字段才出现，同时保留可读文案 |
-| 细进度条 | 轨道高 `--s-1`，底色 `--color-fill1-3`，填充 `--color-brand1-6`，端点用 `--corner-semicircle`；数值与轨道间距 `--s-2` | 有真实进度及明确范围时使用，进度值同时可读 |
-| 头像或圆形标记 | 头像尺寸 `--s-8`，圆角 `--corner-circle`，图文间距 `--s-2`，固定尺寸不收缩 | 真实身份内容或已定义标记需要时出现 |
-
-图标盒默认无阴影；需要微弱独立层次时可使用 `0 1px 3px rgb(0 0 0 / 0.045)`（推断局部参数）。需要强调的非状态图标与可操作焦点使用 `--color-brand1-6`；对比序列色只用于对应数据及图例，不作通用主题强调。图标颜色不承担未知状态含义。R2 与 R7 均直接引用本节，不互相依赖。
-
-### 3.5 集合、表格与列表
-
-- 连续单元格比较、跨行合并或批量网格编辑采用连续表格；记录可独立阅读时，才按第四部分 R3 的条件采用留缝轮廓。
-- 连续表格的表头背景用 `--color-fill1-1`，表头文字用 `--color-text1-10`；正文单元格背景用 `--pod-table-cell-color`，通过引用 `--pod-card-bg-color` 与卡片背景保持一致，正文文字用 `--color-text1-4`。
-- 必要的行分隔用 `--color-line1-1`。不要求每行圆角或留缝，不给每个单元格加重边框。
-- 表头高度用 `--s-10`，同一区域保持统一行密度；身份列分配主要宽度，图标与操作列按实际内容预留宽度。
-- 表头和内容共享列轨道，数值、日期和文字按 2.4 的规则对齐。真实状态、进度和头像直接使用 3.4 的对应表达。
-- 排序、选择和筛选按项目实际字段与能力配置。
-
-### 3.6 图表与数据读数
-
-- 主序列用 `--chart-series-main`，独立对比序列用 `--chart-series-comparison`，分类强调用 `--chart-category-accent`；颜色与同一序列或类别稳定绑定。对比色不表达成功，分类色不表达警告。
-- 持续数据序列不借用交互按下色，热力阶不借用 hover 或 disabled 色。更多真实类别通过平台图表调色方案、文字及图例补足辨识，不静默合并。
-- 日期、数值、单位、图例、提示值和可读数据入口保持同源；缺失与零分开处理。不同量纲或比较口径先拆分或明确标识，折线不能平滑超调制造未出现极值。
-- 轴标签与图例使用说明排版；图表预留稳定绘图区并提供同源文字摘要或数据表。读数浮卡使用 2.1 的图表读数浮层，不另建一套背景和文字颜色。
-- 具体线型、柱形、环形和强度矩阵的特殊组合按对应配方处理；页面不需要图表时，不因存在这些规则而新增图表。
-
-**同色轻渐变数据填充**
-
-适用于柱体、条形和环形分段等具有填充面积的数据图形。以各自稳定的系列或类别色为基色，仅在图形内部形成轻微明暗层次；渐变增加材质细节，不编码额外数值、状态或重要程度。
-
-| 规则 | 默认做法与边界 |
-| --- | --- |
-| 颜色来源 | 沿用本节已有的数据色映射，渐变两端来自同一基色，不混入其他类别色，也不借用交互或状态色 |
-| 过渡强度 | 默认通过不透明度（alpha）变化实现，由浅端 0.8 线性过渡到实端 1.0；这是推断的局部绘制起点，需要根据实际背景和图形尺寸检查，不是截图测量值 |
-| 图内一致性 | 同一张图采用统一的过渡方式和强度；每个数据图形使用自身的局部范围，不能因类别、数值大小或排序变化随机改变渐变参数 |
-| 数值与类别可读性 | 长度、角度和分段边界保持不变，数值端点不得渐隐至不可辨；图例使用对应基色的纯色标记并配文字，不能把渐变端色当成额外类别 |
-| 简化方式 | 小图形、细小分段或低对比情况下，先减弱渐变，仍影响辨识则用纯色；同类图形采用一致的简化条件 |
-| 使用范围 | 仅作用于对应数据图形的填充内部；折线描边、热力矩阵的数值色阶，以及页面和面板背景继续沿用各自规则，不自动套用本渐变 |
-
-方向与分段方式由 R6 补充；不为展示渐变新增图表或虚构数据。
-
-### 3.7 交互状态的视觉表现
-
-以下定义本主题组件的状态配色、轮廓和动效；自绘导航壳层内菜单的文字与背景使用 2.2 的专用映射。
-
-| 状态 | 视觉表达 |
-| --- | --- |
-| hover | 中性操作背景使用 `--color-fill1-1`，文字提升为 `--color-text1-4`；品牌操作背景使用 `--color-brand1-1`。普通信息卡不浮起、不伪装可点击 |
-| active | 中性操作用 `--color-fill1-2`，品牌操作用 `--color-brand1-9`；不平移、缩放或改变边框宽度 |
-| focus | 2px `--color-brand1-6` 轮廓与 2px 偏移（推断），与细描边组件形成清楚的层次 |
-| selected | 中性浅底、一级文字与勾选等符号；自绘导航壳层内菜单遵循专用映射 |
-| disabled | 品牌背景用 `--color-brand1-10`，禁用文字用 `--color-text1-2`；水印色 `--color-text1-1` 不挪作普通说明 |
-| error | 平台错误色用于对应文字、图标与字段边界，不把整个内容面染成错误色 |
-
-过渡建议 120–160ms，图表更新可用 180ms（推断），保持轻量，不加入弹跳或发光动效。
-
-### 3.8 未列出组件的推导方法
-
-依次确定“任务需要的结构 → 所在表面层级 → 文字角色 → 控件形状 → 状态表达”，优先组合第三部分已有规则。只有现有规则无法表达新职责时，才补充局部做法并标记为推断，不新建同义 Token。
-
-例如，树形选择器保留层级缩进与展开操作：输入部分沿用 3.3，节点文字与对齐沿用 3.5，选择反馈沿用 3.7；不把每个节点改成独立大卡。这个例子只说明推导方式，不要求项目新增树组件。
-
-### 表单组件与版式结构
-
-表单使用与自定义页面相同的应用全局样式，字体、色彩、表面、边界、圆角、密度和状态延续本主题。表单支持在顶部、左侧、主体、右侧和字段之间组合 Tab/切换、按钮组/操作入口、图片/图形、状态区、标题与 `Divider`、`ColumnContainer`、辅助内容和业务字段。各组件承担导航、操作、视觉焦点、反馈、层级、节奏、装饰或采集作用。普通业务分组和章节分隔使用 `Divider`，横向字段组合使用 `ColumnContainer`。每张表单在项目 `design.md` 写清组件位置与作用、列比例、标签位置、字段与章节间距、底栏、详情延续和窄屏重排。
-
-## 4. 特色表达配方
-
-配方继承第二部分的整体视觉、第三部分的基础组件与状态，只补充适用条件、特殊组合和不适用时的处理。需要的共用表达直接引用基础组件，不引用其他可选配方。模板保存配方不代表项目必须渲染。
-
-### R1 全局工具栏与页面标题区
-
-- **适用内容：** 自定义页面需要同时绘制全局工具栏和页面标题区，且两者分别承担跨页通用操作与当前页面说明、操作；目标为已有 `global_actions` 与 `page_identity`。
-- **继承基础：** 全局工具栏中的普通操作沿用 2.4 的正文排版和 3.2 的按钮样式；不承载应用导航的工具栏背景沿用 2.1 的页面画布。包含应用导航时，导航所在区域的背景、菜单文字与状态成组按 2.2 处理；独立页面标题区沿用 2.3。
-- **特殊组合：** `自绘全局工具栏 → 细分隔线 → 页面标题/说明 + 页内操作`。分隔线使用 `--color-line1-1`。页面标题区最小高建议 72–96px（推断），长文案与多操作允许增高，标题与正文边缘保持对齐。
-- **无匹配时：** 平台已提供相同全局工具时不重复绘制；只需页内标题和操作时，直接使用 2.3。自绘两层职责重复时合并为一层。不得为构图增加账户、通知数量、更新时间、侧栏或第二份标题。
-
-### R2 分体摘要卡
-
-- **适用内容：** 已有可独立阅读的核心数值；辅助栏另需真实比较值或说明。目标为 `primary_metrics`、`primary_summary`。
-- **继承基础：** 外容器用 3.1 面板；图标盒用 3.4；标签用正文和二级文字，数值用 2.4 的核心数值排版。
-- **特殊组合：** `图标盒（需要时）→ 标签 → 核心数值`；存在辅助内容时追加 `全宽弱分隔 → 浅底辅助栏`。内部纵向节奏用 `--s-3` 与 `--s-2`，主体和辅助栏的左右边缘一致。
-- 辅助栏采用 2.1 的浅底带；真实摘要与比较说明两端对齐。同排同类卡片对齐数值和辅助栏基线，数量按真实内容和可用宽度决定。
-- 含辅助栏时，整体最小高建议 156–176px、辅助栏最小高建议 36px（推断）；内容需要时可一致增高。
-- **无匹配时：** 无辅助内容则取消辅助栏，并解除对应最小高度；仅标签和数值是合法简化。无核心数值不启用，不凑卡片数量、不编造变化率或保留空底栏。
-
-### R3 留缝的独立记录行
-
-- **适用内容：** 已有字段明确、可逐条独立阅读的记录集合，不依赖跨行合并、连续单元格比较或批量网格编辑；目标为已有 `detail_table` 或 `detail_list`。
-- **继承基础：** 字段排版、列对齐与操作区域沿用 3.5；状态、进度和头像直接沿用 3.4。
-- **特殊组合：** `现有工具栏 → 独立浅底表头 → 共用列轨道的留缝圆角记录行`。表头沿用基础浅底，增加 `--corner-3` 圆角；记录行背景用 `--pod-card-bg-color`，轮廓用 `--color-line1-2`，圆角用 `--corner-4`，行间距用 `--s-3`。
-- 每条记录形成独立、闭合的整行轮廓，所有记录与表头共享列轨道。
-- 舒展行最小高建议 60–68px（推断），水平内边距默认用 `--s-4`，紧凑时同区统一用 `--s-3`；长内容允许增高。
-- **无匹配时：** 使用 3.5 的连续表格或普通列表，只继承浅表头、细边界和文字层级，不迁移留缝轮廓。不创建需求中不存在的人员、状态、进度或选择字段。
-
-### R4 轻网格比较图
-
-- **适用内容：** 已有真实时序数据及趋势或比较阅读任务；周期控件、比较说明与图例仅在对应数据与能力具备时出现。
-- **继承基础：** 外容器用 3.1，数据与排版沿用 3.6，读数浮卡用 2.1。
-- **特殊组合：** `标题与已有周期控件 → 弱分隔 → 真实摘要与图例 → 留白绘图区`。主次序列以实线和虚线补足辨识，不要求配套右栏或矩阵。
-- 网格用 `--color-line1-1`，建议 1px、虚线 `4 5`；数据线建议 2px，对比虚线 `6 5`，定位点建议空心、半径 3–4px（推断）；普通折线不加实心面积底色。
-- 面板起始高建议 348–400px、绘图区 216–248px（推断）。绘图区高度稳定，图例换行时增加外面板高度。
-- **无匹配时：** 不绘制示意趋势；已有空数据面板显示真实空态。单序列不加对比线，无辅助信息时释放空间，不补造洞察或第二张图。
-
-### R5 同色相离散强度矩阵
-
-- **适用内容：** 已有明确离散日期或区间、完整索引和真实强度值，任务需要读取频次或强度分布。
-- **继承基础：** 外容器用 3.1，数据与可读入口沿用 3.6，读数浮卡用 2.1。
-- **特殊组合：** `标题 → 已有总量/说明 → 时间标签 → 等距强度格 → 带取值范围的图例`。格子用 `--corner-1`，格距用 `--s-1`，边长建议 16–20px（推断），行列数量由真实日期域与聚合规则决定。
-- 色阶依次为 `--color-fill1-1`、`--chart-heat-step-1`、`--chart-heat-step-2`、`--chart-heat-step-3`、`--chart-series-main`；按实际区间映射并验证明度顺序。第一档表示已知最低区间，缺失值用边界与缺失标记单独表示。
-- 窄屏保留格子的可辨尺寸和间距，不把整个矩阵缩成密集点阵。
-- **无匹配时：** 不渲染矩阵，不把日期选择器或普通状态列表改成强度格；索引缺漏时保留缺失语义，不补零、不随机填格。
-
-### R6 分类比较与构成图
-
-- **适用内容：** 分类柱需要真实类别与数值；环形图需要同一整体中可加总的非负部分。分别用于已有比较或构成槽位，不强制成对出现。
-- **继承基础：** 外容器用 3.1，数据配色、同色轻渐变、排版与可读入口沿用 3.6。
-- **特殊组合：** 分类柱采用 `类别标签 + 横向数据柱 + 可读值`；环形图采用 `环形分段 + 对齐的类别/数值图例`，中心仅放真实总量或摘要。
-- 横柱类别间距用 `--s-4`，圆角用 `--corner-3`，长标签预留文本区域，数值轴从零开始；环形内半径建议为外半径的 72%–78%（推断），分段之间保持可辨缝隙。
-- 柱体或条形的渐变沿数值延伸方向，由基线处浅端过渡到数值末端实端，保持末端清晰。横向、纵向及负值柱均按“基线 → 数值末端”的关系处理，不固定为屏幕上的某一个方向。
-- 环形图在每个分段内部，沿分段自身的起点到终点作轻微过渡；每段独立使用所属类别的基色和同一过渡规则，不对整个圆环施加跨类别渐变。实现无法保持分段边界和类别辨识时按 3.6 使用纯色。
-- 上述渐变方向与局部范围为推断的实现规则；与 3.6 的强度参数一起在实际图形中验证，不改变数据对应的长度、角度或排序。
-- **无匹配时：** 使用已有内容的合适表达；不能用不可加总指标拼环形图、创造分类或借状态色当随机分类色。
-
-### R7 快捷入口
-
-- **适用内容：** 需求已有明确高频操作和独立 `quick_actions` 槽位；没有对应槽位时不渲染。该配方为推断。
-- **继承基础：** 容器用 3.1，共用图标盒直接用 3.4，点击与禁用等状态用 3.7；不依赖是否存在摘要卡。
-- **特殊组合：** `浅表面容器 → 图标盒 + 入口文字 + 真实辅助说明（可选）`。标签用正文排版，辅助说明用说明排版，条目间距用 `--s-3`，条目最小高建议 64–80px（推断），长内容可增高。
-- 位置服从已有任务优先级，不塞入无关的表格工具栏或导航尾部。数量按真实操作决定，宽屏根据容器宽度排布，窄屏单列；仅真正可选择的入口使用 selected。
-- **无匹配时：** 不新增快捷区或虚构操作。无辅助说明则取消说明层，不做彩色宫格、超大插画或占位按钮墙。
-
-## 5. 项目应用与调整规则
-
-### 数值来源、平台接口与规则优先级
-
-- front matter 保留 `name`、`description`、`themeId`、`tokens` 四个顶层字段；品牌生成期标记是模板占位，实例化后替换为实际值。
-- YAML 是已有变量值的唯一来源，实现使用 `var(--完整变量名)`。全局阴影档位由 `--shadow-1`、`--shadow-2`、`--shadow-3` 定义；正文明确给出的局部弱阴影保留其参数，不自动替换为全局档位。尺寸范围、线型及局部弱阴影在同一项目中统一使用，不逐组件随意变化。
-- `tokens.application-global` 作用于原生页面和自定义页面；字体 16 项与间距 10 项保持平台固定值。自定义页仅补充已有背景桥接、核心数值与数据颜色语义，不新增同义别名。
-- `appearance.surfaces` 的 5 项与 `appearance.navigation` 的 6 项分别注入对应作用域；`colors` 与 `appearance` 同级。递归读取以 `--` 开头的变量，分组名不拼入变量名。
-- 应用根背景用于兜底；导航壳层、页面画布、卡片和 pop-up 分别使用各自的背景变量，不因导航换色而联动。`--oyd-page-bg` 单向引用 `--pod-page-bg-color`，平台基础与项目扩展均在主题中声明，可无环引用，并按实际设计补充变量。
-- 导航配色变量映射以 2.2 为准，实现时成组应用；组件状态视觉以 3.7 为准，不再定义另一套导航配色。
-- 导航六色沿用设计稿中普通、悬停和选中状态的文字与背景配对；主题相关角色关联 Brand Token，其余配色保持原样。
-- 需求决定页面和功能是否存在；平台接口限定允许的值与能力；C1–C3 约束跨页视觉一致性，C4 按对应数据图形启用；组件规则负责表达；配方只有满足条件时才生效。配方的尺寸建议不能覆盖表单自然增长、真实数据语义或明确平台约束。
-
-### 品牌色与数据色实例化
-
-- 色彩来源：{{COLOR_SOURCE}}。解析 `{{PRIMARY_COLOR}}` 后，在 sRGB 编码通道按 YAML 比例加权并四舍五入，生成七个 Brand Token 及主序列、三个热力中间阶的实际 Hex。
-- `{{PRIMARY_COLOR}}` 由用户、项目品牌或平台当前主题确定；缺少输入时在项目阶段确定并记录来源，不回填参考图固定色。主题强调及相近色均直接或间接关联 `--color-brand1-6`，派生基底只使用黑、白或无色相灰，保留设计稿的明暗层次。
-- 固定中性 Hex 保持三通道相等；本主题不默认给画布和普通面板染上品牌浅色。`--color-brand1-2` 保留平台预留语义，自定义页不主动重绑用途。
-- 任意品牌种子的派生结果都需检查文字、焦点及图形对比和热力顺序；公式输出不等于视觉验证已经通过。
-
-### 项目页面设计
-
-根据用户需求，为每个实际页面写出具体设计方案，填入下方占位符。每页说明：
-
-- **页面内容：** 页面名称、主要任务，以及需要呈现的内容与操作。
-- **首屏印象：** 用户进入页面第一眼应关注什么、整体应感受到什么，以及通过构图、视觉层次、色彩和留白形成这种印象的具体安排。
-- **布局安排：** 各区块的位置与主次、宽度和列数、高度与对齐关系，以及窄屏下的排列顺序。仅说明本页实际涉及的事项。
-- **视觉表达：** 各区块如何使用前文的表面、排版与组件规则；采用特色配方时注明编号及应用位置。
-- **标志性时刻：** 本页最有记忆点的一处画面或关键交互。写清出现位置或触发条件、具体视觉表现，以及如何帮助用户理解信息或完成操作；可以是静态构图、数据表达，也可以是操作后的反馈。
-
-首屏焦点和标志性时刻可以来自同一处设计。
-
-所需素材的来源、缺口处理及特殊约束直接写入对应页面。给出确定的设计安排，不保留“根据内容决定”等待定表述，也不为套用主题补充需求之外的模块。
-
-{{PAGE_APPLICATIONS}}
-
-### 页面设计验收
-
-按“项目页面设计”逐页检查实际呈现效果，仅检查本页实际采用的内容与表达。
-
-- [ ] **首屏印象：** 第一眼的视觉焦点、内容主次和整体感受符合本页设计，构图、色彩与留白共同支撑这一印象。
-- [ ] **布局安排：** 内容分区、宽度与比例、列数、对齐及高度关系符合方案；窄屏下的内容顺序与重排方式按设计呈现。
-- [ ] **风格表达：** 细描边、组间留缝、组内分段与柔圆轮廓落实到对应区域；使用同色轻渐变时，系列或类别仍清楚，数值端点与分段边界可辨。
-- [ ] **标志性时刻：** 指定的画面或关键交互在对应位置或条件下呈现，视觉表现符合方案，并帮助用户理解信息或完成操作。

package/yida-skills/skills/yida-design/templates/design-themes/soft-outline-rhythm/form-layout.json

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