@wycm9527/morganite 0.0.0-stage → 0.3.3

package/bridge/element-plus.css

@@ -0,0 +1,785 @@
+/* Element Plus 桥接：把 Element Plus 的全局 CSS 变量指向设计系统的语义 token。
+   引入顺序：element-plus/dist/index.css → design-system/dist/index.css → 本文件。
+   不要引入 element-plus/theme-chalk/dark/css-vars.css：暗色由 dist/themes/dark.css 通过 var() 间接生效。
+   实测发现的"组件库自带主见"都在下面用注释标出，它们就是这份桥接存在的理由。 */
+
+@import "./fonts.css";
+
+:root {
+  /* 品牌 / 主色：Element 用 light-3 做 hover、dark-2 做 active、light-9 做选中底 */
+  --el-color-primary: var(--color-action-primary);
+  --el-color-primary-light-3: var(--color-action-primary-hover);
+  --el-color-primary-light-5: var(--color-border-strong);   /* 主色不拿来做浅调：Element 需要的"浅一点的主色"一律给中性灰（走语义 token，暗色随之切换） */
+  --el-color-primary-light-7: var(--color-border-default);
+  --el-color-primary-light-8: var(--color-bg-selected);
+  --el-color-primary-light-9: var(--color-bg-selected-subtle);
+  --el-color-primary-dark-2: var(--color-action-primary-active);
+
+  /* 状态色：Element 的 info 是灰色（中性），对应我们的 status.neutral；青色 info 不走 Element 语义 */
+  --el-color-success: var(--color-status-success);
+  --el-color-success-light-9: var(--color-status-success-bg);
+  --el-color-success-light-8: var(--color-status-success-bg);
+  --el-color-success-light-7: var(--color-status-success-bg);
+  --el-color-warning: var(--color-status-warning);
+  --el-color-warning-light-9: var(--color-status-warning-bg);
+  --el-color-warning-light-8: var(--color-status-warning-bg);
+  --el-color-warning-light-7: var(--color-status-warning-bg);
+  --el-color-danger: var(--color-status-error);
+  --el-color-danger-light-9: var(--color-status-error-bg);
+  --el-color-danger-light-8: var(--color-status-error-bg);
+  --el-color-danger-light-7: var(--color-status-error-bg);
+  --el-color-error: var(--color-status-error);
+  --el-color-error-light-9: var(--color-status-error-bg);
+  --el-color-info: var(--color-status-neutral);
+  --el-color-info-light-9: var(--color-status-neutral-bg);
+  --el-color-info-light-8: var(--color-status-neutral-bg);
+  --el-color-info-light-7: var(--color-status-neutral-bg);
+  /* light-3 / light-5 / dark-2：Element 用它们做 hover（链接、朴素按钮）、active 与朴素边线。不接管就会漏出 Element 自己的浅红浅绿。
+     状态色是文字色，hover 不变浅：三档一律指回文字色；danger 的 hover / active 走 action.danger 的推导值 */
+  --el-color-success-light-3: var(--color-status-success); --el-color-success-light-5: var(--color-status-success); --el-color-success-dark-2: var(--color-status-success);
+  --el-color-warning-light-3: var(--color-status-warning); --el-color-warning-light-5: var(--color-status-warning); --el-color-warning-dark-2: var(--color-status-warning);
+  --el-color-danger-light-3: var(--color-action-danger-hover); --el-color-danger-light-5: var(--color-status-error); --el-color-danger-dark-2: var(--color-action-danger-active);
+  --el-color-error-light-3: var(--color-action-danger-hover); --el-color-error-light-5: var(--color-status-error); --el-color-error-light-8: var(--color-status-error-bg); --el-color-error-light-7: var(--color-status-error-bg); --el-color-error-dark-2: var(--color-action-danger-active);
+  --el-color-info-light-3: var(--color-status-neutral); --el-color-info-light-5: var(--color-status-neutral); --el-color-info-dark-2: var(--color-status-neutral);
+
+  /* 底色与文字 */
+  --el-bg-color: var(--color-bg-surface);
+  --el-bg-color-page: var(--color-bg-page);
+  --el-bg-color-overlay: var(--color-bg-elevated);
+  --el-text-color-primary: var(--color-text-primary);
+  --el-text-color-regular: var(--color-text-primary);
+  --el-text-color-secondary: var(--color-text-secondary);
+  --el-text-color-placeholder: var(--color-text-placeholder);
+  --el-text-color-disabled: var(--color-text-muted);
+
+  /* 边线与填充。Element 的普通边线全部走 --el-border-width；我们把它接到 border.width.default（0.6px 发丝线） */
+  --el-border-width: var(--border-width-default);
+  --el-border: var(--border-width-default) var(--el-border-style) var(--el-border-color);
+  --el-border-color: var(--color-border-strong);
+  --el-border-color-light: var(--color-border-default);
+  --el-border-color-lighter: var(--color-border-default);
+  --el-border-color-extra-light: var(--color-border-default);
+  --el-border-color-dark: var(--color-border-strong);
+  --el-border-color-darker: var(--color-border-strong);
+  --el-border-color-hover: var(--color-border-strong);
+  --el-fill-color: var(--color-bg-hover);
+  --el-fill-color-light: var(--color-bg-subtle);
+  --el-fill-color-lighter: var(--color-bg-subtle);
+  --el-fill-color-extra-light: var(--color-bg-subtle);
+  --el-fill-color-dark: var(--color-bg-hover);
+  --el-fill-color-darker: var(--color-border-default);
+  --el-fill-color-blank: var(--color-bg-surface);
+  --el-disabled-bg-color: var(--color-bg-readonly);
+  --el-disabled-text-color: var(--color-text-muted);
+  --el-disabled-border-color: var(--color-border-default);
+
+  /* 圆角、字体、字号：Element 默认圆角 4/2px 偏小。嵌套规则（DESIGN「圆角」）：卡片 / 弹窗 / 抽屉 lg > 控件 md > 标签 sm > 勾选框 xs */
+  --el-border-radius-base: var(--radius-md);
+  --el-border-radius-small: var(--radius-sm);
+  --el-border-radius-round: var(--radius-full);
+  --el-font-family: var(--font-family-body);
+  --el-font-size-extra-large: var(--text-heading-size);
+  --el-font-size-large: var(--text-title-size);
+  --el-font-size-medium: var(--text-title-sm-size);
+  --el-font-size-base: var(--text-body-size);
+  --el-font-size-small: var(--text-body-sm-size);
+  --el-font-size-extra-small: var(--text-small-size);
+  --el-font-weight-primary: var(--text-weight-strong);  /* Element 用 500 做标题；雅黑无 500，直接给 600 */
+
+  /* 阴影：拆分式 elevation 组合 */
+  --el-box-shadow: 0 var(--elevation-modal-y) var(--elevation-modal-blur) var(--elevation-modal-color);
+  --el-box-shadow-light: 0 var(--elevation-popover-y) var(--elevation-popover-blur) var(--elevation-popover-color);
+  --el-box-shadow-lighter: 0 var(--elevation-card-y) var(--elevation-card-blur) var(--elevation-card-color);
+  --el-box-shadow-dark: 0 var(--elevation-modal-y) var(--elevation-modal-blur) var(--elevation-modal-color);
+
+  /* 遮罩 */
+  --el-overlay-color: var(--color-bg-overlay);
+  --el-overlay-color-light: var(--color-bg-overlay);
+  --el-overlay-color-lighter: var(--color-bg-overlay);
+  --el-mask-color: var(--color-bg-mask);   /* 局部加载遮罩是"变淡"不是"压暗"：接 bg.mask（surface 90%），不是弹窗的 bg.overlay */
+
+  /* 控件尺寸三档：control.height.lg / md / sm */
+  --el-component-size-large: var(--control-height-lg);
+  --el-component-size: var(--control-height-md);
+  --el-component-size-small: var(--control-height-sm);
+
+  /* hover / focus 反馈变量：Element 默认全部指向主色；本系统悬停不引入主色，聚焦边线走 border.focus */
+  --el-input-focus-border-color: var(--color-border-focus);
+
+  /* 动效与层级 */
+  --el-transition-duration: var(--motion-duration-normal);
+  --el-transition-duration-fast: var(--motion-duration-fast);
+  --el-index-normal: var(--layer-sticky);
+  --el-index-top: var(--layer-modal);
+  --el-index-popper: var(--layer-toast);
+}
+
+/* ---- 主按钮：金底白字；悬停 action.primary-hover、按下 action.primary-active，边线始终与底同色（DESIGN「按钮四层」，同效果预览 .btn.primary） ---- */
+.el-button--primary {
+  --el-button-text-color: var(--color-text-on-primary);
+  --el-button-hover-text-color: var(--color-text-on-primary);
+  --el-button-active-text-color: var(--color-text-on-primary);
+  --el-button-hover-bg-color: var(--color-action-primary-hover);
+  --el-button-hover-border-color: var(--color-action-primary-hover);
+  --el-button-active-bg-color: var(--color-action-primary-active);
+  --el-button-active-border-color: var(--color-action-primary-active);
+  --el-button-disabled-text-color: var(--color-text-on-primary);
+}
+/* 危险按钮：填充必须用 action.danger，而不是 status.error（暗色下变浅会让白字糊掉） */
+.el-button--danger {
+  --el-button-bg-color: var(--color-action-danger);
+  --el-button-border-color: var(--color-action-danger);
+  --el-button-hover-bg-color: var(--color-action-danger-hover);
+  --el-button-hover-border-color: var(--color-action-danger-hover);
+  --el-button-active-bg-color: var(--color-action-danger-active);
+  --el-button-active-border-color: var(--color-action-danger-active);
+  --el-button-text-color: var(--color-text-on-danger);
+  /* 文字色按状态穷举：MessageBox 的确认按钮是 primary + danger 双类，缺哪个状态就会从 primary 块漏进主按钮的变量 */
+  --el-button-hover-text-color: var(--color-text-on-danger);
+  --el-button-active-text-color: var(--color-text-on-danger);
+  --el-button-disabled-text-color: var(--color-text-on-danger);
+}
+.el-button--danger.is-plain { --el-button-text-color: var(--color-status-error); --el-button-bg-color: var(--color-status-error-bg); --el-button-border-color: var(--color-status-error-bg); }
+.el-button.el-button--danger.is-plain { --el-button-hover-bg-color: var(--color-action-danger); --el-button-hover-border-color: var(--color-action-danger); --el-button-active-bg-color: var(--color-action-danger-active); --el-button-active-border-color: var(--color-action-danger-active); }   /* hover 填充走 action.danger（与实心危险按钮同一填充）；Element 默认填 --el-color-danger = status.error，dark 下是为可读性调浅的红，白字只有 3.2:1 */
+/* 行内危险操作（表格操作列、下拉项）：type="danger" 的文字 / 链接按钮 = quiet 浅底 + text.danger 文字，hover 不变色；实底危险按钮只留给最终确认 */
+.el-button.el-button--danger.is-link, .el-button.el-button--danger.is-text { --el-button-text-color: var(--color-text-danger); --el-button-hover-text-color: var(--color-text-danger); --el-button-hover-link-text-color: var(--color-text-danger); --el-button-active-text-color: var(--color-text-danger); --el-button-disabled-text-color: var(--color-text-danger); }   /* 特异性压过下方通用的 .el-button.is-text（正文色），否则危险与普通操作同色 */
+/* 彩色文字不落在灰底上（用户规则）：危险文字按钮不用 quiet 灰底，而是 error 成对——红字 + 浅红底；hover 反馈用同色发丝边，不换色 */
+.el-button.el-button--danger.is-text:not(.is-disabled), .el-button.el-button--danger.is-text.is-disabled, .el-button.el-button--danger.is-text.is-disabled:hover { background-color: var(--color-status-error-bg); }   /* (0,4,0)：要压过 quiet 的 .el-button.is-text:not(.is-disabled) */
+.el-button.el-button--danger.is-text:not(.is-disabled):hover, .el-button.el-button--danger.is-text:not(.is-disabled):active { background-color: var(--color-status-error-bg); box-shadow: inset 0 0 0 var(--border-width-control) var(--color-status-error); }
+/* 次要（默认）按钮：hover 只换底色（action.secondary-hover），文字不变色 */
+.el-button:not(.el-button--primary):not(.el-button--danger):not(.el-button--success):not(.el-button--warning):not(.el-button--info):not(.is-link):not(.is-text) {
+  --el-button-hover-text-color: var(--color-text-primary);
+  --el-button-hover-bg-color: var(--color-action-secondary-hover);
+  --el-button-hover-border-color: var(--color-border-strong);
+  --el-button-active-text-color: var(--color-text-primary);
+  --el-button-active-border-color: var(--color-border-strong);
+}
+/* 链接型按钮：走 text.link（DESIGN「链接」：深金字、无下划线）；Element 的 primary 型链接是主色字，白底不可读 */
+.el-button.is-link { --el-button-text-color: var(--color-text-link); --el-button-hover-text-color: var(--color-text-link-hover); --el-button-hover-link-text-color: var(--color-text-link-hover);   /* Element 的 .is-link:hover 读的是 hover-link-text-color，类型级默认 primary-light-5（本桥接映射为冷灰 border.strong）→ 白底 1.5:1 */ --el-button-active-text-color: var(--color-text-link-hover); text-decoration: var(--text-link-decoration); font-style: var(--text-link-style); }
+/* 文字按钮（DESIGN「文字按钮」）：正文色 text.primary，不是链接色；静息 action.quiet（透明）、悬停 action.quiet-hover 浅底。
+   Element 给 is-text 写死 background-color（不走变量），必须属性级覆盖 */
+.el-button.is-text { --el-button-text-color: var(--color-text-primary); --el-button-hover-text-color: var(--color-text-primary); --el-button-active-text-color: var(--color-text-primary); }
+.el-button.is-text:not(.is-disabled) { background-color: var(--color-action-quiet); }
+.el-button.is-text:not(.is-disabled):hover, .el-button.is-text:not(.is-disabled):active { background-color: var(--color-action-quiet-hover); }
+.el-table .el-button.is-text:not(.is-disabled):not(.el-button--danger):hover, .el-table .el-button.is-text:not(.is-disabled):not(.el-button--danger):active { background-color: transparent; }   /* 表格里只变色不叠底（antd 表格操作链接）：行悬停已有底色，再叠一层会把文字压到 4.5 以下——暗色选中行再悬停曾只有 3.41:1 */
+.el-button { font-weight: var(--text-weight-label); }
+/* 并排按钮：同一行相邻元素的间距是 space.inline（Element 用相邻选择器写死 12px）；配方里自带 gap 的容器不再叠外边距 */
+.el-button + .el-button { margin-left: var(--space-inline); }
+:is(.page-head .actions, .section-head .right, .card-head .right, .filter, .filter .conds, .filter .acts, .batch .right, .form-foot, .result .acts, .confirm-bar, .act-group, .login-alt, .code-row, .hform .foot) > .el-button + .el-button { margin-left: 0; }
+/* 通栏按钮（登录、手机底部主操作）：is-block 撑满容器，同效果预览 .btn--block；Element 没有这个属性 */
+.el-button.is-block { width: 100%; }
+.el-button + .el-button.is-block { margin-left: 0; }
+.el-button { --el-button-outline-color: var(--color-border-focus); }   /* Element 默认取 primary-light-5，被我们映射成了中性灰 */
+.el-button:focus-visible, .el-button.is-text:not(.is-disabled):focus-visible, .el-button.is-link:not(.is-disabled):focus-visible { outline: var(--border-width-active) solid var(--color-border-focus); outline-offset: 1px; }
+
+/* ---- 输入类：Element 用 inset box-shadow 画边线且写死 1px，各状态的选择器特异性从 (0,1,0) 到 (0,4,0) 不一——
+   日期范围、级联、输入数字、表单出错态各有一套。这里按状态统一接管，用 !important 压过全部特异性，边线走 border.width.default（发丝线）。 ---- */
+.el-input, .el-textarea, .el-select, .el-input-number, .el-date-editor, .el-range-editor, .el-input-tag {
+  --el-input-border-color: var(--color-border-input);
+  --el-input-hover-border-color: var(--color-border-strong);
+  --el-input-focus-border-color: var(--color-border-focus);
+  --el-input-bg-color: var(--color-bg-input);
+  --el-input-text-color: var(--color-text-primary);
+  --el-input-placeholder-color: var(--color-text-placeholder);
+  --el-input-icon-color: var(--color-text-muted);   /* 前后缀（¥、元、搜索图标）：Element 默认取占位符色，填充底上只有 3.3:1，前后缀是有意义的文字 */
+  --el-input-border-radius: var(--radius-md);
+}
+/* 默认 */
+.el-input__wrapper, .el-select__wrapper, .el-textarea__inner, .el-date-editor.el-input__wrapper, .el-range-editor.el-input__wrapper, .el-input-tag, .el-input-number .el-input__wrapper {
+  box-shadow: 0 0 0 var(--border-width-default) var(--el-input-border-color) inset !important;
+}
+/* 悬停 */
+.el-input__wrapper:hover, .el-select__wrapper.is-hovering:not(.is-focused), .el-textarea__inner:hover, .el-date-editor.el-input__wrapper:hover, .el-range-editor.el-input__wrapper:hover, .el-input-tag.is-hovering:not(.is-focused),
+.el-input-number__decrease:hover ~ .el-input:not(.is-disabled) .el-input__wrapper, .el-input-number__increase:hover ~ .el-input:not(.is-disabled) .el-input__wrapper {
+  box-shadow: 0 0 0 var(--border-width-default) var(--el-input-hover-border-color) inset !important;
+}
+/* 聚焦：只把边线换成更深的 border.focus，线宽与悬停相同，不加外环（光标本身提示焦点） */
+.el-input__wrapper.is-focus, .el-input.is-active .el-input__wrapper, .el-select__wrapper.is-focused, .el-textarea__inner:focus, .el-date-editor.is-focus .el-input__wrapper, .el-range-editor.is-active, .el-range-editor.is-active:hover, .el-input-tag.is-focused {
+  box-shadow: 0 0 0 var(--border-width-default) var(--color-border-focus) inset !important;
+}
+/* 出错：聚焦时也保持这条红线，不加外环（选择器比上面的聚焦规则更具体，聚焦时仍是红线） */
+.el-form-item.is-error .el-form-item__content .el-input__wrapper, .el-form-item.is-error .el-form-item__content .el-select__wrapper, .el-form-item.is-error .el-form-item__content .el-textarea__inner, .el-form-item.is-error .el-form-item__content .el-range-editor, .el-form-item.is-error .el-form-item__content .el-input-tag {
+  box-shadow: 0 0 0 1px var(--color-status-error) inset !important;   /* 出错也是必须一眼可见的状态，用 1px */
+}
+/* 禁用 / 只读 */
+.el-input.is-disabled .el-input__wrapper, .el-select__wrapper.is-disabled, .el-input-tag.is-disabled {
+  box-shadow: 0 0 0 var(--border-width-default) var(--el-disabled-border-color) inset !important;
+}
+.el-input.is-disabled .el-input__wrapper { background: var(--color-bg-readonly); }
+/* 选择器、标签输入与输入框同为填充式 bg.input（DESIGN「输入框 / 选择器」）；Element 默认取 fill-color-blank（白底） */
+.el-select__wrapper, .el-input-tag { background-color: var(--color-bg-input); }
+.el-select__wrapper.is-disabled, .el-input-tag.is-disabled { background-color: var(--color-bg-readonly); }
+/* 多行输入：内边距同单行（spacing.2 / spacing.3），表单里最小三行控件高（同效果预览 .textarea）。Element 按 rows 算出的最小高写在行内 style 上 */
+.el-textarea__inner { padding: var(--spacing-2) var(--spacing-3); line-height: var(--text-body-line-height); }
+.el-form-item .el-textarea__inner { min-height: calc(var(--control-height-md) * 3) !important; }
+/* 表单里的控件撑满栏宽（同效果预览 .input）；Element 给级联、日期、数字输入写死了固定宽。行内表单（筛选栏）不在此列，宽度走 .w-* 档 */
+.el-form:not(.el-form--inline) .el-form-item__content > :is(.el-cascader, .el-date-editor, .el-input-number) { width: 100%; }
+
+/* ---- 选择类 ---- */
+/* 勾选框 / 单选：icon.size.lg（16px）见方，文字常规字重（同效果预览 .check / .radio） */
+.el-checkbox { --el-checkbox-input-width: var(--icon-size-lg); --el-checkbox-input-height: var(--icon-size-lg); --el-checkbox-font-weight: var(--font-weight-regular); --el-checkbox-checked-bg-color: var(--color-action-primary); --el-checkbox-checked-input-border-color: var(--color-action-primary); --el-checkbox-checked-icon-color: var(--color-text-on-primary); --el-checkbox-checked-text-color: var(--color-text-primary); --el-checkbox-input-border: var(--border-width-control) solid var(--color-border-strong); --el-checkbox-border-radius: var(--radius-xs); }  /* 16px 的框只能用最小一档，否则接近圆形 */
+.el-checkbox__inner::after { box-sizing: border-box; width: calc(var(--icon-size-lg) * 0.3); height: calc(var(--icon-size-lg) * 0.55); border-width: 0 var(--border-width-bold) var(--border-width-bold) 0; }   /* 勾随框放大、线宽 border.width.bold；Element 的定位与旋转不变 */
+.el-checkbox__input.is-indeterminate .el-checkbox__inner::before { top: calc(50% - var(--border-width-bold) / 2); left: 25%; right: 25%; height: var(--border-width-bold); transform: none; }
+.el-radio { --el-radio-input-width: var(--icon-size-lg); --el-radio-input-height: var(--icon-size-lg); --el-radio-font-weight: var(--font-weight-regular); --el-radio-input-border-color-hover: var(--color-action-primary-active); }
+/* 单选选中：主色外圈 + 主色圆点，圈内保持表面色（同效果预览与 antd）；Element 默认是实心填满 + 白点 */
+.el-radio__input.is-checked .el-radio__inner { border-color: var(--color-action-primary); background: var(--color-bg-surface); }
+.el-radio__inner::after { width: calc(var(--icon-size-lg) * 0.5); height: calc(var(--icon-size-lg) * 0.5); }
+.el-radio__input.is-checked .el-radio__inner::after { background-color: var(--color-action-primary); }
+.el-radio__input.is-checked + .el-radio__label { color: var(--color-text-primary); }
+/* 分段选择器（radio-button 组，DESIGN「分段选择器 / 按钮组」，同效果预览 .seg）：灰轨道 bg.hover、不描边，内缩 control.segmented-inset；
+   选中项是 action.selected 的内胶囊，未选项透明、text.secondary；文字 text.body-sm、常规字重，选中也不加粗。
+   不依赖 :has()：轨道由每个 label 的底色与首尾圆角拼成，label 之间无间隙；选择器与 Element 首尾项规则同形，靠后置覆盖。 */
+.el-radio-button { --el-radio-button-checked-bg-color: var(--color-action-selected); --el-radio-button-checked-text-color: var(--color-text-on-selected); --el-radio-button-checked-border-color: var(--color-action-selected);
+  background: var(--color-bg-hover); padding: var(--control-segmented-inset) 0; }
+.el-radio-button:first-child { border-radius: var(--radius-full) 0 0 var(--radius-full); padding-left: var(--control-segmented-inset); }
+.el-radio-button:last-child { border-radius: 0 var(--radius-full) var(--radius-full) 0; padding-right: var(--control-segmented-inset); }
+.el-radio-button:first-child:last-child { border-radius: var(--radius-full); }
+.el-radio-button__inner, .el-radio-button:first-child .el-radio-button__inner, .el-radio-button:last-child .el-radio-button__inner {
+  border: 0; outline: 0; box-shadow: none; background: transparent; color: var(--color-text-secondary); border-radius: var(--radius-full); font-size: var(--text-body-sm-size); font-weight: var(--font-weight-regular);
+  height: calc(var(--control-height-md) - 2 * var(--control-segmented-inset)); line-height: 1; padding: 0 var(--spacing-3-5); display: inline-flex; align-items: center; }
+.el-radio-button--small .el-radio-button__inner, .el-radio-button--small:first-child .el-radio-button__inner, .el-radio-button--small:last-child .el-radio-button__inner { height: calc(var(--control-height-sm) - 2 * var(--control-segmented-inset)); font-size: var(--text-small-size); padding: 0 var(--spacing-2-5); border-radius: var(--radius-full); }   /* 首尾项选择器特异性与上面持平，小尺寸才压得过；border-radius 必须在这里重申——Element 的 --small 规则 (0,2,0) 会把中间项压回直角 */
+.el-radio-button__inner:hover { color: var(--color-text-primary); }
+.el-radio-button__original-radio:checked + .el-radio-button__inner { background: var(--color-action-selected); color: var(--color-text-on-selected); box-shadow: none; font-weight: var(--font-weight-regular); }
+.el-radio-button__original-radio:disabled + .el-radio-button__inner { background: transparent; color: var(--color-text-secondary); opacity: var(--opacity-disabled); }
+.el-radio-button__original-radio:disabled:checked + .el-radio-button__inner { background: var(--color-action-selected); color: var(--color-text-on-selected); }
+/* 开关：44 × 22（宽为 control.height.xs 的两倍），无边线，滑块 control.knob 内缩 spacing.0.5（同效果预览 .switch）；大 / 小尺寸沿用 Element 的几何 */
+.el-switch { --el-switch-on-color: var(--color-action-primary); --el-switch-off-color: var(--color-border-strong); }
+.el-switch__core { min-width: calc(var(--control-height-xs) * 2); height: var(--control-height-xs); border: 0; border-radius: var(--radius-full); }
+.el-switch__core .el-switch__action { left: var(--spacing-0-5); width: calc(var(--control-height-xs) - var(--spacing-0-5) * 2); height: calc(var(--control-height-xs) - var(--spacing-0-5) * 2); background-color: var(--color-control-knob); }
+.el-switch.is-checked .el-switch__core .el-switch__action { left: calc(100% - var(--control-height-xs) + var(--spacing-0-5)); }
+.el-slider { --el-slider-main-bg-color: var(--color-action-primary-active); --el-slider-runway-bg-color: var(--color-bg-selected); --el-slider-button-size: var(--icon-size-md); }
+/* 进度填充渐变（DESIGN 图表条）：起点深、末端浅，左深右浅。品牌金用指定两色 chart.gradient.start → end；
+   状态 / 中性填充是同色饱和度渐变：HSB 明度不变，右端饱和度 × chart.gradient.saturation；状态类只换 --fill。
+   先写实色兜底（不支持相对颜色语法时用它）；状态规则也写整段 background，免得 Element 自带的状态 background-color 垫在渐变下面 */
+.el-progress-bar__inner { --fill: var(--color-action-primary-active); background: var(--color-chart-gradient-start); background: linear-gradient(to right, var(--color-chart-gradient-start), var(--color-chart-gradient-end)); }
+.el-progress.is-success .el-progress-bar__inner, .el-progress.is-exception .el-progress-bar__inner, .el-progress.is-warning .el-progress-bar__inner, .el-progress.is-muted .el-progress-bar__inner { background: var(--fill); background: linear-gradient(to right, var(--fill), hwb(from var(--fill) h calc(w + (100 - w - b) * (1 - var(--chart-gradient-saturation))) b)); }
+.el-progress.is-success .el-progress-bar__inner { --fill: var(--color-status-success); }
+.el-progress.is-exception .el-progress-bar__inner { --fill: var(--color-status-error); }
+.el-progress.is-warning .el-progress-bar__inner { --fill: var(--color-status-warning); }
+.el-progress-bar__outer { background-color: var(--color-bg-selected); }
+/* 进度条颜色跟状态走：金只给"正在发生"的；已结束 / 已下线 / 草稿等非进行中用桥接约定类 is-muted 变灰 */
+.el-progress.is-muted .el-progress-bar__inner { --fill: var(--color-data-inactive); }
+.el-progress.is-muted .el-progress-circle__path { stroke: var(--color-data-inactive); }
+/* 条内百分比（text-inside）贴在填充末端，末端是浅色，白字不够（金 2.1:1）：这时改实色 --fill（金是 action.primary-active，白字 5.27:1） */
+.el-progress.el-progress--text-inside .el-progress-bar__inner { background: var(--fill); }
+
+/* ---- 表格 ---- */
+.el-table {
+  --el-table-border-color: var(--color-border-default);
+  --el-table-border: var(--border-width-default) solid var(--color-border-default);
+  --el-table-text-color: var(--color-text-primary);
+  --el-table-header-text-color: var(--color-text-secondary);
+  --el-table-header-bg-color: var(--color-bg-subtle);
+  --el-table-row-hover-bg-color: var(--color-bg-hover);
+  --el-table-current-row-bg-color: var(--color-bg-hover);
+  --el-table-bg-color: var(--color-bg-surface);
+  --el-table-tr-bg-color: var(--color-bg-surface);
+  --el-table-expanded-cell-bg-color: var(--color-bg-subtle);
+  /* 固定列阴影：Element 把它画在 10px 宽的伪元素上，几何必须沿用它的 inset ±10px / -10px 扩散，只换颜色，否则会糊成一条灰带 */
+  --el-table-fixed-left-column: inset 10px 0 10px -10px var(--elevation-popover-color);
+  --el-table-fixed-right-column: inset -10px 0 10px -10px var(--elevation-popover-color);
+}
+/* 正文 text.body-sm、表头 text.small（同配方 .table 与效果预览）；行高随正文行高 */
+.el-table { font-size: var(--text-body-sm-size); }
+.el-table th.el-table__cell { font-weight: var(--text-weight-label); font-size: var(--text-small-size); }
+.el-table .cell { padding: 0 var(--table-cell-padding-x); line-height: var(--text-body-line-height); }
+.el-table td.el-table__cell, .el-table th.el-table__cell { padding: var(--table-cell-padding-y) 0; }
+/* 勾选列：Element 把这一格写死成 23px 高的行内 flex（它自己的行高），比上面的正文行高高，还压在基线上，表头因此被撑高约 6px；改成块级、高度随内容 */
+.el-table .el-table__cell.el-table-column--selection > .cell { display: flex; height: auto; }
+/* 卡片里贴边的表格：首尾列内边距 space.card，与卡片标题、筛选栏、分页对齐（同效果预览 .panel .table）。
+   只认贴边位置（卡片内容区或标签页面板的直接子元素）；放在有内边距的容器里的表格不加。勾选列因此要留 48px 宽 */
+:is(.el-card.flat > .el-card__body, .el-card.flat .el-tab-pane) > .el-table .el-table__cell:first-child > .cell { padding-left: var(--space-card); }
+:is(.el-card.flat > .el-card__body, .el-card.flat .el-tab-pane) > .el-table .el-table__cell:last-child > .cell { padding-right: var(--space-card); }
+/* 选中行与悬停同色（中性灰），再悬停深一档。el-table 不给选中行加类，用 :has() 读勾选框状态，不依赖页面自己维护 row-class-name */
+.el-table__body tr.is-selected > td.el-table__cell, .el-table__body tr:has(> td .el-checkbox.is-checked) > td.el-table__cell { background: var(--color-bg-hover); }
+.el-table__body tr.is-selected:hover > td.el-table__cell, .el-table__body tr:has(> td .el-checkbox.is-checked):hover > td.el-table__cell { background: var(--color-bg-selected-hover); }
+.el-table .sort-caret.ascending { border-bottom-color: var(--color-text-muted); }
+.el-table .sort-caret.descending { border-top-color: var(--color-text-muted); }
+.el-table .ascending .sort-caret.ascending { border-bottom-color: var(--color-text-selected); }
+.el-table .descending .sort-caret.descending { border-top-color: var(--color-text-selected); }
+
+/* ---- 卡片、弹窗、抽屉、浮层 ---- */
+.el-card { border-width: var(--border-width-default); --el-card-border-color: var(--color-border-default); --el-card-border-radius: var(--radius-lg); --el-card-bg-color: var(--color-bg-surface); --el-card-padding: var(--space-card); }  /* 卡片靠 border.default 发丝线与页面底色差定形（DESIGN「卡片」） */
+.el-card.is-always-shadow, .el-card.is-hover-shadow:hover { box-shadow: 0 var(--elevation-card-y) var(--elevation-card-blur) var(--elevation-card-color); }
+.el-card__header { font-size: var(--text-body-size); font-weight: var(--text-weight-strong); color: var(--color-text-card-title); }   /* 同配方 .card-head h2 */
+/* 弹窗 / 抽屉与卡片同档 radius.lg（DESIGN「圆角」） */
+.el-dialog { --el-dialog-bg-color: var(--color-bg-elevated); --el-dialog-border-radius: var(--radius-lg); --el-dialog-padding-primary: var(--space-card); --el-dialog-box-shadow: 0 var(--elevation-modal-y) var(--elevation-modal-blur) var(--elevation-modal-color); --el-dialog-title-font-size: var(--text-title-size); }
+.el-message-box { --el-messagebox-border-radius: var(--radius-lg); }
+.el-drawer { background: var(--color-bg-elevated); box-shadow: calc(-1 * var(--elevation-modal-y)) 0 var(--elevation-modal-blur) var(--elevation-modal-color); }
+.el-drawer.rtl { border-radius: var(--radius-lg) 0 0 var(--radius-lg); }  /* 右侧抽屉：贴边的两个角不圆 */
+.el-drawer__header { margin-bottom: 0; padding: var(--spacing-4) var(--space-card); border-bottom: var(--border-width-default) solid var(--color-border-default); color: var(--color-text-primary); font-weight: var(--text-weight-strong); }
+.el-drawer__body { padding: var(--space-card); }
+.el-drawer__footer { padding: var(--spacing-3) var(--space-card); border-top: var(--border-width-default) solid var(--color-border-default); }
+.el-popper.is-light { border-color: var(--color-border-default); box-shadow: 0 var(--elevation-popover-y) var(--elevation-popover-blur) var(--elevation-popover-color); }
+.el-popper.is-dark { background: var(--color-bg-inverse); color: var(--color-text-inverse); border-color: var(--color-bg-inverse); }
+.el-popper.is-dark .el-popper__arrow::before { background: var(--color-bg-inverse); border-color: var(--color-bg-inverse); }
+.el-select-dropdown__item.is-selected { color: var(--color-text-selected); background: var(--color-bg-selected); font-weight: var(--text-weight-strong); }
+.el-select-dropdown__item.is-hovering { background: var(--color-bg-hover); }
+.el-dropdown-menu__item:not(.is-disabled):hover, .el-dropdown-menu__item:not(.is-disabled):focus { background: var(--color-bg-hover); color: var(--color-text-primary); }
+/* 下拉里的危险项：桥接约定类 is-danger（Element 的 dropdown-item 没有 type）。红字；hover 底是浅红而不是灰——彩色文字不落在灰底上 */
+.el-dropdown-menu__item.is-danger { color: var(--color-text-danger); }
+.el-dropdown-menu__item.is-danger:not(.is-disabled):hover, .el-dropdown-menu__item.is-danger:not(.is-disabled):focus { background: var(--color-status-error-bg); color: var(--color-text-danger); }
+
+/* ---- 统计数字（el-statistic）：数据大字走 text.display 的 D-DIN 系字体 ---- */
+.el-statistic__number { font-family: var(--text-display-family); font-weight: var(--text-display-weight); letter-spacing: var(--text-display-tracking); }
+
+/* ---- 菜单（侧栏，同配方 .nav 与效果预览）：项高 layout.sidebar.item-height、左右外边距 spacing.2、同组相邻项之间 layout.sidebar.item-gap、字重 text.weight.nav；图标 icon.size.lg、图文间距 spacing.2.5 ---- */
+.el-menu {
+  --el-menu-bg-color: var(--color-bg-sidebar);
+  --el-menu-text-color: var(--color-text-sidebar);
+  --el-menu-active-color: var(--color-text-sidebar-selected);
+  --el-menu-hover-bg-color: var(--color-bg-sidebar-hover);
+  --el-menu-hover-text-color: var(--color-text-sidebar-strong);
+  --el-menu-border-color: var(--color-border-sidebar);
+  --el-menu-item-height: var(--layout-sidebar-item-height);
+  --el-menu-sub-item-height: var(--layout-sidebar-item-height);
+  --el-menu-item-font-size: var(--text-body-size);
+  --el-menu-base-level-padding: var(--spacing-3);
+  --el-menu-level-padding: var(--spacing-3);
+  --el-menu-icon-width: var(--icon-size-lg);
+}
+.el-menu-item.is-active, .el-menu-item.is-active:hover { background: var(--color-bg-sidebar-selected); color: var(--color-text-sidebar-selected); font-weight: var(--text-weight-nav); } /* 亮色主色底块 + 白字白图标、暗色金色暗底 + 亮金字；hover 不再变，与其他项同字重、不加指示条 */
+.el-menu-item { margin: 0 var(--spacing-2); border-radius: var(--radius-md); }
+.el-menu-item, .el-sub-menu__title { font-weight: var(--text-weight-nav); }
+.el-menu--vertical .el-menu-item + .el-menu-item { margin-top: var(--layout-sidebar-item-gap); }
+.el-menu-item .el-icon, .el-sub-menu__title .el-icon { font-size: var(--icon-size-lg); width: var(--icon-size-lg); height: var(--icon-size-lg); margin-right: var(--spacing-2-5); }
+.el-menu .el-icon .i-icon { font-size: inherit; }   /* IconPark 的 .i-icon 自带 md 字号，跟随 .el-icon */
+.el-menu-item-group__title { font-size: var(--text-caption-size); line-height: var(--text-body-line-height); color: var(--color-text-sidebar-muted); padding: var(--spacing-3-5) calc(var(--spacing-2) + var(--spacing-3)) var(--spacing-1-5); }   /* 与项内文字左对齐：项外边距 + 项内边距 */
+/* 折叠侧栏：Element 用「图标宽 + 两侧 padding」推算折叠宽度，与 layout.sidebar.collapsed-width 对不上。
+   折叠宽度显式取 token；项撑满侧栏宽减两侧外边距、图标居中；分组标题隐藏。选择器与 Element 原规则同形，靠后置覆盖。 */
+.el-menu--collapse { width: var(--layout-sidebar-collapsed-width); }
+.el-menu--collapse > .el-menu-item, .el-menu--collapse > .el-sub-menu > .el-sub-menu__title, .el-menu--collapse > .el-menu-item-group > ul > .el-menu-item, .el-menu--collapse > .el-menu-item-group > ul > .el-sub-menu > .el-sub-menu__title { width: auto; margin-left: var(--spacing-2); margin-right: var(--spacing-2); padding: 0; justify-content: center; }
+.el-menu--collapse .el-menu-item-group__title { display: none; }
+.el-menu--collapse > .el-menu-item-group:not(:first-child) { margin-top: var(--layout-sidebar-item-gap); }   /* 标题隐藏后相邻两组的项会贴在一起：组与组之间也留同样的项间距 */
+.el-menu--collapse .el-menu-item .el-icon, .el-menu--collapse .el-sub-menu__title .el-icon { margin: 0; }
+/* Element 折叠时把内容包进 .el-menu-tooltip__trigger（绝对定位铺满、左右各带内边距），图标会偏离中心。内边距清零、居中 */
+.el-menu--collapse .el-menu-item .el-menu-tooltip__trigger, .el-menu--collapse .el-sub-menu__title .el-menu-tooltip__trigger { padding: 0; justify-content: center; }
+
+/* ---- 其他：标签、分页、步骤、标签页、提示、消息 ---- */
+.el-tag { --el-tag-border-radius: var(--radius-sm); font-weight: var(--font-weight-regular); }   /* 标签 / 胶囊 400：浅色底已提供识别 */
+.el-tag--info { --el-tag-text-color: var(--color-status-neutral); --el-tag-bg-color: var(--color-status-neutral-bg); --el-tag-border-color: transparent; }
+/* 分页（DESIGN「分页」，同配方 .pagination）：页码方块 control.height.md、radius.md，项间距 spacing.1；当前页金底白字；总数 text.secondary */
+.el-pagination { --el-pagination-button-bg-color: transparent; --el-pagination-hover-color: var(--color-text-primary); --el-pagination-font-size: var(--text-body-sm-size); --el-pagination-font-size-small: var(--text-small-size); --el-pagination-border-radius: var(--radius-md);
+  --el-pagination-button-width: var(--control-height-md); --el-pagination-button-height: var(--control-height-md); --el-pagination-button-width-small: var(--control-height-sm); --el-pagination-button-height-small: var(--control-height-sm); }
+.el-pager li { padding: 0 var(--spacing-2); }
+.el-pagination.is-background .el-pager li, .el-pagination.is-background .btn-prev, .el-pagination.is-background .btn-next { border-radius: var(--radius-md); margin: 0 calc(var(--spacing-1) / 2); }
+.el-pagination.is-background .el-pager li.is-active { background: var(--color-action-primary); color: var(--color-text-on-primary); font-weight: var(--text-weight-strong); }
+.el-pagination.is-background .el-pager li:not(.is-active):hover { background: var(--color-bg-hover); color: var(--color-text-primary); }
+.el-pagination .el-pager li.is-active { background: var(--color-action-primary); color: var(--color-text-on-primary); font-weight: var(--text-weight-strong); border-radius: var(--radius-md); }   /* 当前页金底白字，不带底色的分页也一样 */
+.el-pagination__total { color: var(--color-text-secondary); }
+/* ---- 步骤条（DESIGN「步骤条」，同效果预览 .steps）----
+   圆点 control.height.sm：当前步主色实心 + 白序号；已完成 border.current 描边 + text.selected 的勾（finish-status="success" 才出勾）；未开始 border.strong + text.muted 序号。
+   标题 text.body：已完成 / 当前 text.primary、未开始 text.secondary，均为常规字重；说明 text.small × text.muted */
+.el-steps { --el-text-color-placeholder: var(--color-text-muted); }
+.el-step__icon { width: var(--control-height-sm); height: var(--control-height-sm); background: var(--color-bg-surface); font-size: var(--text-body-sm-size); font-variant-numeric: var(--text-numeric-variant); }
+.el-step__icon.is-text { border: var(--border-width-control) solid; }
+.el-step__icon-inner.is-status { font-size: var(--icon-size-md); }
+.el-step__head.is-wait .el-step__icon { border-color: var(--color-border-strong); color: var(--color-text-muted); }
+.el-step__head.is-finish, .el-step__head.is-success { color: var(--color-text-selected); border-color: var(--color-border-current); }
+.el-step__head.is-finish .el-step__icon, .el-step__head.is-success .el-step__icon { border-color: var(--color-border-current); color: var(--color-text-selected); }
+.el-step__head.is-process .el-step__icon { background: var(--color-action-primary); border-color: var(--color-action-primary); color: var(--color-text-on-primary); }
+.el-step__head.is-error .el-step__icon { border-color: var(--color-status-error); color: var(--color-status-error); }
+.el-step__title { font-size: var(--text-body-size); line-height: var(--text-body-line-height); font-weight: var(--text-weight-label); color: var(--color-text-secondary); }
+.el-step__title.is-finish, .el-step__title.is-success, .el-step__title.is-process { color: var(--color-text-primary); font-weight: var(--text-weight-label); }
+.el-step__title.is-error { color: var(--color-status-error); }
+.el-step__description, .el-step__description.is-wait, .el-step__description.is-process, .el-step__description.is-finish, .el-step__description.is-success { color: var(--color-text-muted); font-size: var(--text-small-size); line-height: var(--text-body-line-height); margin-top: 0; }
+.el-step__description.is-error { color: var(--color-status-error); }
+.el-step__line { background-color: var(--color-border-default); }
+/* 横向排法：圆点与标题同一行，连线接在标题后面、撑满到下一步（Element 默认圆点在上、连线穿过圆点、标题在下）。
+   居中（align-center）与简洁（simple）两种变体保留 Element 的排法；每步的 flex-basis / max-width 是 Element 写在行内 style 上的，必须 !important */
+.el-steps--horizontal > .el-step.is-horizontal:not(.is-center) { display: flex; align-items: flex-start; gap: var(--spacing-2-5); flex: 1 1 0 !important; max-width: none !important; min-width: 0; }
+.el-steps--horizontal > .el-step.is-horizontal:not(.is-center):not(:last-of-type) { margin-right: var(--spacing-3); }
+.el-step.is-horizontal:not(.is-center) .el-step__head { width: auto; flex: none; }
+.el-step.is-horizontal:not(.is-center) .el-step__line { display: none; }
+.el-step.is-horizontal:not(.is-center) .el-step__main { flex: 1; min-width: 0; }
+.el-step.is-horizontal:not(.is-center) .el-step__title { display: flex; align-items: center; gap: var(--spacing-3); min-height: var(--control-height-sm); white-space: nowrap; }
+.el-step.is-horizontal:not(.is-center) .el-step__title::after { content: ""; flex: 1; height: var(--border-width-default); background: var(--color-border-default); }
+.el-step.is-horizontal:not(.is-center) .el-step__title.is-finish::after, .el-step.is-horizontal:not(.is-center) .el-step__title.is-success::after { background: var(--color-border-current); }
+.el-step.is-horizontal:not(.is-center):last-of-type .el-step__title::after { display: none; }
+.el-step.is-horizontal:not(.is-center) .el-step__description { padding-right: 0; }
+/* ---- 标签页（DESIGN「标签页」，同效果预览 .tabs）：默认 text.secondary、选中 text.selected，均为常规字重；选中下划线 border.current × border.width.active。
+   上下边的普通标签页：项不留左右内边距、项间距 spacing.6、上下内边距 spacing.3；卡片式 / 边框卡片式保留 Element 的几何 ---- */
+.el-tabs { --el-tabs-header-height: var(--control-height-lg); }
+.el-tabs__nav-wrap::after { height: var(--border-width-default); }  /* Element 的标签页底线写死 2px */
+.el-tabs__item { font-weight: var(--text-weight-label); color: var(--color-text-secondary); }
+.el-tabs__item:hover { color: var(--color-text-primary); }
+.el-tabs__item.is-active { color: var(--color-text-selected); font-weight: var(--text-weight-label); }
+.el-tabs__active-bar { background: var(--color-border-current); height: var(--border-width-active); border-radius: var(--radius-full); }
+:is(.el-tabs--top, .el-tabs--bottom):not(.el-tabs--card):not(.el-tabs--border-card) > .el-tabs__header .el-tabs__nav { gap: var(--spacing-6); }
+/* 行高 normal 同效果预览的标签（按钮的默认行高）：上下 spacing-3 加一行字，比正文行高矮 2px */
+:is(.el-tabs--top, .el-tabs--bottom):not(.el-tabs--card):not(.el-tabs--border-card) > .el-tabs__header .el-tabs__item { height: auto; padding: var(--spacing-3) 0; line-height: normal; }
+/* ---- 提示条（DESIGN「徽标 / 提示条」，同效果预览 .alert）：status.<x>-bg 底 + status.<x> 字、radius.lg；文字 text.body-sm，内边距 spacing.3 / spacing.4；
+   图标 icon.size.lg 对齐首行、与文字间距 spacing.2.5；有说明时标题加粗，图标不放大 ---- */
+.el-alert { --el-alert-padding: var(--spacing-3) var(--spacing-4); --el-alert-border-radius-base: var(--radius-lg); --el-alert-title-font-size: var(--text-body-sm-size); --el-alert-title-with-description-font-size: var(--text-body-sm-size); --el-alert-description-font-size: var(--text-body-sm-size); --el-alert-icon-size: var(--icon-size-lg); --el-alert-icon-large-size: var(--icon-size-lg);
+  align-items: flex-start; gap: var(--spacing-2-5); line-height: var(--text-body-line-height); }
+.el-alert .el-alert__icon, .el-alert .el-alert__icon.is-big { margin: var(--spacing-0-5) 0 0; }
+.el-alert__content { gap: 0; }
+.el-alert__title { line-height: var(--text-body-line-height); }
+.el-alert__title.with-description { font-weight: var(--text-weight-strong); }
+.el-alert--info.is-light { background: var(--color-status-info-bg); color: var(--color-status-info); }   /* Element 的 info 是灰的，提示条的 info 要青 */
+.el-alert--info.is-light .el-alert__title, .el-alert--info.is-light .el-alert__description { color: var(--color-status-info); }
+.el-message { --el-message-bg-color: var(--color-bg-inverse); --el-message-border-color: var(--color-bg-inverse); --el-message-text-color: var(--color-text-inverse); box-shadow: 0 var(--elevation-popover-y) var(--elevation-popover-blur) var(--elevation-popover-color); }
+.el-message .el-message__icon { display: none; }
+.el-badge { --el-badge-bg-color: var(--color-action-danger); --el-badge-font-size: var(--text-caption-size); }   /* 计数徽标 = 危险填充 + 白字（同顶栏通知计数配方）；Element 默认类型就是 danger */
+.el-badge__content, .el-badge__content--danger { background-color: var(--color-action-danger); color: var(--color-text-on-danger); font-weight: var(--text-weight-strong); }
+.el-badge__content--primary { background-color: var(--color-action-primary); color: var(--color-text-on-primary); }   /* 主色徽标 = 金底白字（同主按钮）；action.selected 在本系统是白块，不能当底 */
+.el-badge__content--info { background-color: var(--color-status-neutral); color: var(--color-text-inverse); }
+.el-skeleton { --el-skeleton-color: var(--color-bg-skeleton); --el-skeleton-to-color: var(--color-bg-skeleton-highlight); }
+/* ---- 描述列表（同效果预览 .desc）：标签 text.small × text.secondary、值 text.primary；无边框时列宽均分、列间距 spacing.6、行距 spacing.5，
+   纵向排法（direction="vertical"）标签在上、与值相距 spacing.1。Element 的标签选择器特异性从 (0,2,0) 到 (0,5,0)，逐条同形后置 ---- */
+.el-descriptions { --el-descriptions-item-bordered-label-background: var(--color-bg-subtle); }
+.el-descriptions__table.is-bordered .el-descriptions__cell { border-width: var(--border-width-default); }
+.el-descriptions__label:not(.is-bordered-label) { color: var(--color-text-secondary); font-weight: var(--text-weight-label); margin-right: var(--spacing-4); }
+.el-descriptions__body .el-descriptions__table .el-descriptions__label:not(.is-bordered-label) { font-size: var(--text-small-size); }
+.el-descriptions__label.is-bordered-label { color: var(--color-text-secondary); font-weight: var(--text-weight-label); }
+.el-descriptions__content:not(.is-bordered-label) { color: var(--color-text-primary); }
+.el-descriptions__body .el-descriptions__table:not(.is-bordered) { table-layout: fixed; }
+.el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell { padding: 0 var(--spacing-6) var(--spacing-5) 0; line-height: var(--text-body-line-height); }
+.el-descriptions__body .el-descriptions__table:not(.is-bordered) .el-descriptions__cell:last-child { padding-right: 0; }
+.el-descriptions__body .el-descriptions__table:not(.is-bordered) tr:last-child .el-descriptions__cell { padding-bottom: 0; }
+.el-descriptions__label.el-descriptions__cell:not(.is-bordered-label).is-vertical-label { padding-bottom: var(--spacing-1); }
+/* ---- 时间线（DESIGN「时间线」，同效果预览 .timeline）：节点是 spacing.2.5 见方的空心圆（bg.surface + border.width.active 描边），对齐首行中线；
+   type="primary"（当前）描边主色、type="danger"（异常）status.error，其余 border.strong；竖线 border.default 发丝线；
+   事件 text.primary，时间 text.small × text.muted 紧跟在下 ---- */
+.el-timeline-item { padding-bottom: var(--spacing-5); }
+.el-timeline-item:last-child { padding-bottom: 0; }
+.el-timeline-item__node, .el-timeline-item__node--normal, .el-timeline-item__node--large { width: var(--spacing-2-5); height: var(--spacing-2-5); top: calc((var(--text-body-size) * var(--text-body-line-height) - var(--spacing-2-5)) / 2); background: var(--color-bg-surface); border: var(--border-width-active) solid var(--color-border-strong); }
+.el-timeline-item__node.is-hollow { background: var(--color-bg-surface); }
+.el-timeline-item__node--primary { border-color: var(--color-action-primary); }
+.el-timeline-item__node--danger { border-color: var(--color-status-error); }
+.el-timeline-item.is-start .el-timeline-item__node--normal, .el-timeline-item.is-start .el-timeline-item__node--large { left: 0; }
+.el-timeline-item__tail { top: calc((var(--text-body-size) * var(--text-body-line-height) + var(--spacing-2-5)) / 2 + var(--spacing-1)); bottom: var(--spacing-1); height: auto; border-left: var(--border-width-default) solid var(--color-border-default); }
+.el-timeline-item.is-start .el-timeline-item__tail { left: calc(var(--spacing-2-5) / 2); }
+.el-timeline-item__wrapper { top: 0; }
+.el-timeline-item.is-start .el-timeline-item__wrapper { padding-left: var(--spacing-6); }
+.el-timeline-item__content { color: var(--color-text-primary); line-height: var(--text-body-line-height); }
+.el-timeline-item__timestamp { color: var(--color-text-muted); font-size: var(--text-small-size); line-height: var(--text-body-line-height); }
+.el-timeline-item__timestamp.is-bottom { margin-top: 0; }
+.el-timeline-item__timestamp.is-top { margin-bottom: var(--spacing-1); padding-top: 0; }
+/* ---- 面包屑（同配方 .crumbs）：text.body-sm；链接 text.secondary、当前页 text.primary，均为常规字重；
+   分隔符是细箭头：el-breadcrumb 仍传 separator="/"，span 本身 visibility: hidden（「/」从视觉与无障碍树里消失，文字扫描也不再把它当小字），箭头在 ::before 上设回 visible、用遮罩画在 text.muted 上
+   （icon.size.sm 见方，描边 1.4 同 icon.stroke.width，遮罩里写不了 var()），左右 spacing.2 ---- */
+.el-breadcrumb { font-size: var(--text-body-sm-size); line-height: var(--text-body-line-height); }
+.el-breadcrumb__inner, .el-breadcrumb__inner a, .el-breadcrumb__inner.is-link { color: var(--color-text-secondary); font-weight: var(--text-weight-label); }
+.el-breadcrumb__item:last-child .el-breadcrumb__inner, .el-breadcrumb__item:last-child .el-breadcrumb__inner a, .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover, .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover { color: var(--color-text-primary); font-weight: var(--text-weight-label); }
+.el-breadcrumb__separator { display: inline-flex; color: var(--color-text-muted); margin: 0 var(--spacing-2); width: var(--size-icon-sm); height: var(--size-icon-sm); font-size: 0; visibility: hidden; }
+.el-breadcrumb__separator::before { content: ""; visibility: visible; display: block; width: 100%; height: 100%; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4.5 2.5 8 6l-3.5 3.5' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M4.5 2.5 8 6l-3.5 3.5' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
+.el-upload-dragger { background: var(--color-bg-subtle); border-color: var(--color-border-strong); border-radius: var(--radius-md); }
+.el-upload-dragger:hover { border-color: var(--color-border-strong); background: var(--color-bg-hover); }   /* 同配方 .upload-zone：悬停只换底，拖入时才换焦点色边线 */
+.el-upload-dragger.is-dragover { border-color: var(--color-border-focus); background: var(--color-bg-selected); }
+.el-empty__description p { color: var(--color-text-muted); }
+.el-result__title p { font-size: var(--text-title-size); font-weight: var(--text-weight-strong); }
+.el-form-item__label { color: var(--color-text-primary); font-weight: var(--text-weight-label); font-size: var(--text-body-sm-size); }   /* 表单标签 text.body-sm（同效果预览 .field > label） */
+.el-form--label-top .el-form-item .el-form-item__label, .el-form-item.el-form-item--label-top .el-form-item__label { line-height: var(--text-body-line-height); margin-bottom: var(--spacing-1-5); }
+.el-form-item__error { color: var(--color-status-error); font-size: var(--text-small-size); }
+.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before { color: var(--color-status-error); }
+
+/* Element 内置图标（下拉箭头、关闭、勾）是自带的 SVG，与 IconPark 风格并存——这是接入真实组件库不可避免的妥协，见 DESIGN.md 图标一节 */
+
+/* ---- 手机（≤ 768，layout.breakpoint.mobile 的字面镜像）：浮层全宽化。宽度覆盖组件内联 style 必须 !important（桥接层允许，页面层禁止） ---- */
+@media (max-width: 768px) {
+  .el-dialog, .el-dialog.is-sm, .el-dialog.is-md { width: 100vw !important; max-width: 100vw; margin: auto 0 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }   /* 贴底、只留顶部圆角 */
+  .el-overlay-dialog { display: flex; align-items: flex-end; }
+  .el-dialog__body { max-height: 70dvh; overflow: auto; }
+  .el-drawer.rtl, .el-drawer.ltr { width: 100% !important; border-radius: 0; }
+  .el-message-box { width: calc(100vw - var(--spacing-4) * 2); max-width: calc(100vw - var(--spacing-4) * 2); }
+  .el-pagination { flex-wrap: wrap; row-gap: var(--spacing-2); justify-content: center; }
+  .el-pagination .el-pagination__sizes, .el-pagination .el-pagination__jump { display: none; }   /* 手机收敛：页码为主 */
+  .el-breadcrumb__item:not(:last-child) { display: none; }   /* 顶栏面包屑只留当前页 */
+  .el-steps--horizontal { flex-direction: column; row-gap: var(--spacing-3); }   /* 步骤条竖排，连线去掉（同效果预览） */
+  .el-steps--horizontal > .el-step.is-horizontal:not(.is-center):not(:last-of-type) { margin-right: 0; }
+  .el-step.is-horizontal:not(.is-center) .el-step__title::after { display: none; }
+}
+
+/* ---- 键盘焦点：全局兜底 ----
+   Element 自带的焦点环用主色画（复选框、开关、分页、单选按钮组），主色在白底上只有 3:1；菜单项、标签页、下拉项又被写死 outline:none。
+   统一为 border.focus 实线 + 1px 偏移；行内型控件（菜单项、标签页、下拉项）改为内缩，避免被容器裁掉。 */
+:where(a, button, [role="button"], [role="menuitem"], [role="tab"], summary, [tabindex]:not([tabindex="-1"]):not(input, textarea, select)):focus-visible {
+  outline: var(--border-width-active) solid var(--color-border-focus); outline-offset: 1px;
+}
+/* Chrome 把可滚动容器也纳入 Tab 序列（keyboard-focusable scrollers），默认画浏览器蓝色焦点环；Element 的滚动容器统一改为 border.focus、内缩 */
+.el-scrollbar__wrap:focus-visible { outline: var(--border-width-active) solid var(--color-border-focus); outline-offset: -2px; }
+.el-menu-item:focus-visible, .el-sub-menu__title:focus-visible, .el-tabs__item:focus-visible, .el-dropdown-menu__item:focus-visible, .el-select-dropdown__item:focus-visible {
+  outline: var(--border-width-active) solid var(--color-border-focus); outline-offset: -2px; box-shadow: none;   /* 标签页的焦点 Element 还用主色 inset 阴影画了一遍 */
+}
+.el-checkbox input:focus-visible + .el-checkbox__inner,
+.el-radio__original:focus-visible + .el-radio__inner,
+.el-radio-button__original-radio:focus-visible + .el-radio-button__inner,
+.el-switch__input:focus-visible ~ .el-switch__core,
+.el-pagination .btn-prev:focus-visible, .el-pagination .btn-next:focus-visible, .el-pager li:focus-visible,
+.el-table .caret-wrapper:focus-visible, .el-tag .el-tag__close:focus-visible, .el-dialog__headerbtn:focus-visible, .el-drawer__close-btn:focus-visible,
+.el-table__column-filter-trigger:focus-visible, .el-table__expand-icon:focus-visible, .el-table-filter__bottom button:focus-visible, .el-table-v2__sort-icon:focus-visible, .el-table-v2__expand-icon:focus-visible,
+.el-anchor__link:focus-visible, .el-check-tag:focus-visible, .el-segmented__item-selected.is-focus-visible::before,
+.el-color-predefine__color-selector:focus-visible, .el-color-hue-slider__thumb:focus-visible, .el-color-svpanel__cursor:focus-visible, .el-color-alpha-slider__thumb:focus-visible, .el-color-picker:focus-visible:not(.is-disabled) .el-color-picker__trigger {
+  outline: var(--border-width-active) solid var(--color-border-focus); outline-offset: 1px;
+}
+/* 焦点环立即出现，同效果预览：Element 的勾选框把 outline 也放进过渡（回弹曲线，中途会冲到 3px），单选按钮组是 all 过渡，焦点环都会从 0 长出来 */
+.el-checkbox__inner { transition-property: border-color, background-color; }
+.el-radio-button__inner { transition-property: color, background-color, box-shadow; }
+
+/* ---- 最小命中区：关闭 ×、更多 ⋯ 这类视觉很小的控件，命中区不小于 control.hit-min（24px），用伪元素外扩，不改视觉 ---- */
+.el-tag__close, .el-select__caret, .el-input__clear, .el-table .caret-wrapper { position: relative; }
+.el-drawer__close-btn, .el-dialog__headerbtn { min-width: var(--control-hit-min); min-height: var(--control-hit-min); }
+.el-tag__close::after, .el-input__clear::after, .el-table .caret-wrapper::after { content: ""; position: absolute; inset: 50% auto auto 50%; width: var(--control-hit-min); height: var(--control-hit-min); transform: translate(-50%, -50%); }
+
+/* ---- 减少动态效果：DESIGN.md 的约定"所有时长视为 0"在这里落地；三档 duration 归零，Element 的 transition 变量随之归零 ---- */
+@media (prefers-reduced-motion: reduce) {
+  :root { --motion-duration-fast: 0ms; --motion-duration-normal: 0ms; --motion-duration-slow: 0ms; }
+  *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
+}
+
+/* ---- 文字渲染基线 ----
+   1. 不要 -webkit-font-smoothing: antialiased：Mac 上它会去掉字形的加粗补偿，把中文削细一档。让系统按默认方式渲染。
+   2. 浏览器给 button / input / select / textarea 的默认字体、字号、颜色不随正文（Element 也没有覆盖）；一律继承。
+   3. 标题的字号、行高、字重同 base.css（浏览器默认 700、行高随正文）：配方只改字号的标题（如卡片标题）靠这里的行高与效果预览同高。
+   这是 base.css 里对 Element 安全的子集——base.css 的全局 :disabled 透明度与外边距重置会与 Element 冲突，Element 入口不引入它 */
+html { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }
+button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
+h1 { font-size: var(--text-display-size, var(--text-heading-size)); line-height: var(--text-heading-line-height); letter-spacing: var(--text-display-tracking, normal); }
+h2 { font-size: var(--text-heading-size); line-height: var(--text-heading-line-height); }
+h3 { font-size: var(--text-title-size); }
+h4 { font-size: var(--text-title-sm-size); }
+h1, h2, h3 { font-weight: var(--text-weight-strong); }
+h4, h5, h6 { font-weight: var(--text-weight-label); }
+code, kbd, pre, samp { font-family: var(--font-family-code); }
+
+/* ---- 悬停不引入主色（DESIGN「按钮四层」）----
+   主色只出现在静息的主操作面上；hover 反馈交给中性色（文字加深、边线加深、底色 bg.hover）。
+   Element 有 20+ 处 hover / focus 直接取 --el-color-primary，按其原选择器同形逐条接管；
+   分页（--el-pagination-hover-color）与日期面板（--el-datepicker-*）走上方变量接管。 */
+.el-message-box__headerbtn:focus .el-message-box__close, .el-message-box__headerbtn:hover .el-message-box__close,
+.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close,
+.el-drawer__close-btn:focus i, .el-drawer__close-btn:hover i,
+.el-tour__closebtn:focus .el-tour__close, .el-tour__closebtn:hover .el-tour__close,
+.el-breadcrumb__inner.is-link:hover, .el-breadcrumb__inner a:hover,
+.el-tabs__item:hover, .el-tabs--border-card > .el-tabs__header .el-tabs__item:not(.is-disabled):hover, .el-tabs__new-tab:hover,
+.el-checkbox-button__inner:hover,
+.el-time-spinner__arrow:hover,
+.el-input-number__increase:hover, .el-input-number__decrease:hover,
+.el-table-filter__bottom button:hover,
+.el-transfer-panel__item:hover,
+.el-collapse-item__header.focusing:focus:not(:hover),
+.el-upload-list__item .el-icon--close:hover, .el-upload-list__item-delete:hover,
+.el-upload-list__item.is-success .el-upload-list__item-name:hover, .el-upload-list__item.is-success .el-upload-list__item-name:focus,
+.el-button--text:not(.is-disabled):hover {
+  color: var(--color-text-primary);
+}
+.el-table-filter__list-item:hover, .el-table-filter__list-item:focus { background: var(--color-bg-hover); color: var(--color-text-primary); }
+.el-upload--picture-card:hover { border-color: var(--color-border-strong); color: var(--color-text-primary); }
+.el-drawer__dragger:hover::before { background-color: var(--color-border-strong); }
+
+/* ---- 日期面板：选中日金底白字、范围内奶金浅底、今天正文色（主色不做文字）----
+   --el-datepicker-* 变量定义在 .el-date-picker / .el-date-range-picker 组件级，在 :root 覆盖会被组件级声明压掉——必须在同级或更近处覆盖。 */
+.el-picker-panel, .el-date-picker, .el-date-range-picker {
+  --el-datepicker-active-color: var(--color-action-primary);   /* 选中日：金底白字圆块（同主按钮）；action.selected 在本系统是白块，Element 的白字压上去看不见 */
+  --el-datepicker-hover-text-color: var(--color-text-primary);
+  --el-datepicker-inrange-bg-color: var(--color-bg-selected-subtle);   /* 范围内：奶金浅底（同 antd 范围选择）；Element 默认取边线色，是一条灰带 */
+  --el-datepicker-inrange-hover-bg-color: var(--color-bg-selected-subtle);
+}
+/* 「今天」与月 / 年面板的 today：Element 写死主色字，白底只有 3:1 → 正文色 + medium */
+.el-date-table td.today .el-date-table-cell__text,
+.el-month-table td.today .el-date-table-cell__text,
+.el-year-table td.today .el-date-table-cell__text { color: var(--color-text-primary); font-weight: var(--font-weight-medium); }
+/* today 同时是选中端点时，金底上转白字 */
+.el-date-table td.today.start-date .el-date-table-cell__text, .el-date-table td.today.end-date .el-date-table-cell__text,
+.el-month-table td.today.start-date .el-date-table-cell__text, .el-month-table td.today.end-date .el-date-table-cell__text,
+.el-year-table td.today.start-date .el-date-table-cell__text, .el-year-table td.today.end-date .el-date-table-cell__text { color: var(--color-text-on-primary); }
+
+/* ---- 阴影与焦点环不被裁切 ----
+   Element 给 .el-tabs__content 设 overflow: hidden，贴住 pane 边缘的内容会被裁掉一截。
+   pane 切换靠 display: none 而不是 overflow 收纳，放开是安全的。 */
+.el-tabs__content { overflow: visible; }
+/* 贴在卡片顶部的标签页当卡片标题头用（同效果预览 .panel > .tabs）：标签文字与卡片内边距 space.card 对齐、上下 spacing.4（与带标题的 .card-head 同高，约 52px），
+   底线贯穿卡片左右边缘——左右内边距放在 nav-wrap 上，Element 画底线的 nav-wrap::after 跟着 padding box 走；标签栏下直接接内容，内容自己带内边距 */
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header { margin-bottom: 0; }
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header .el-tabs__nav-wrap { padding: 0 var(--space-card); }
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header .el-tabs__nav-wrap.is-scrollable { padding: 0 calc(var(--space-card) + var(--spacing-5)); }   /* 标签放不下出现前后翻页箭头时（Element 写死 20px），箭头留在内边距里 */
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header .el-tabs__nav-prev { left: var(--space-card); }
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header .el-tabs__nav-next { right: var(--space-card); }
+.el-card.flat > .el-card__body > .el-tabs > .el-tabs__header .el-tabs__item { padding: var(--spacing-4) 0; }
+/* 看板卡（配方 .panel）用 el-card 承载时，内容区跟着纵向撑满 */
+.el-card.panel > .el-card__body { flex: 1; display: flex; flex-direction: column; min-height: 0; }
+
+
+/* ---- 全组件走查：Element 全部组件铺开扫描后补的接管 ----
+   两类：① 用主色表达"选中 / 当前 / 强调"的地方 → 分段类（单选 / 多选按钮组、el-segmented）是灰轨道上的白色内胶囊；其余按 antd 走主色系：实心选中金底白字（选中日、主色徽标、深色标签、勾选标签、引导点）、列表当前项奶金浅底（树、拖放目标）或同下拉选中项（表格筛选）、文字类深金字（级联、时间选择、锚点）；
+   ② 用主色做文字或 hover 的地方 → 中性色（Link / Text 的 primary、上传区文案、加载文字、开关文案、评分、朴素按钮）。
+   Element 的 success / warning / info 型按钮在这套系统里不存在（状态色是文字色，不是填充色；实底按钮只有主与危险）——退化为次要按钮，语义靠文案。 */
+.el-link { --el-link-hover-text-color: var(--color-text-link-hover); }
+.el-link.el-link--primary { --el-link-text-color: var(--color-text-link); --el-link-hover-text-color: var(--color-text-link-hover); }
+.el-link.el-link--danger { --el-link-text-color: var(--color-text-danger); --el-link-hover-text-color: var(--color-text-danger); }   /* 危险链接 hover 不变浅（暗色下变深会掉对比），反馈靠下划线 */
+.el-text.el-text--primary { --el-text-color: var(--color-text-primary); }
+.el-button--primary.is-plain, .el-button--success, .el-button--success.is-plain, .el-button--warning, .el-button--warning.is-plain, .el-button--info, .el-button--info.is-plain {
+  --el-button-text-color: var(--color-text-primary); --el-button-bg-color: var(--color-bg-surface); --el-button-border-color: var(--color-border-strong);
+  --el-button-hover-text-color: var(--color-text-primary); --el-button-hover-bg-color: var(--color-action-secondary-hover); --el-button-hover-border-color: var(--color-border-strong);
+  --el-button-active-text-color: var(--color-text-primary); --el-button-active-bg-color: var(--color-action-secondary-hover); --el-button-active-border-color: var(--color-border-strong);
+  --el-button-disabled-text-color: var(--color-text-primary); --el-button-disabled-bg-color: var(--color-bg-surface); --el-button-disabled-border-color: var(--color-border-strong);
+}
+.el-button--success.is-link, .el-button--warning.is-link, .el-button--info.is-link { --el-button-text-color: var(--color-text-link); --el-button-hover-text-color: var(--color-text-link-hover); --el-button-hover-link-text-color: var(--color-text-link-hover); --el-button-active-text-color: var(--color-text-link-hover); }
+.el-button--success.is-text, .el-button--warning.is-text, .el-button--info.is-text { --el-button-text-color: var(--color-text-primary); --el-button-hover-text-color: var(--color-text-primary); --el-button-active-text-color: var(--color-text-primary); }   /* 同 .el-button.is-text：文字按钮是正文色 + 浅底，不是链接 */
+/* 标签：Element 默认类型是 primary（主色字浅底）→ 按中性状态胶囊（中性底是半透明，边线透明，免得叠出深一圈）；dark 效果 = 金底白字；plain = 描边 */
+.el-tag.el-tag--primary { --el-tag-text-color: var(--color-status-neutral); --el-tag-bg-color: var(--color-status-neutral-bg); --el-tag-border-color: transparent; --el-tag-hover-color: var(--color-text-muted); }
+.el-tag--dark.el-tag--primary { --el-tag-text-color: var(--color-text-on-primary); --el-tag-bg-color: var(--color-action-primary); --el-tag-border-color: var(--color-action-primary); --el-tag-hover-color: var(--color-action-primary-active); }
+.el-tag--plain.el-tag--primary { --el-tag-text-color: var(--color-text-secondary); --el-tag-bg-color: var(--color-bg-surface); --el-tag-border-color: var(--color-border-strong); }
+.el-tag.is-hit, .el-tag.el-tag--primary.is-hit { border-color: var(--color-border-focus); }
+.el-check-tag { border-radius: var(--radius-full); }
+.el-check-tag.el-check-tag--primary.is-checked { background-color: var(--color-action-primary); color: var(--color-text-on-primary); }
+.el-check-tag.el-check-tag--primary.is-checked:hover { background-color: var(--color-action-primary-hover); }
+/* 勾选按钮组（多选分段）：与单选分段同一配方——灰轨道 bg.hover、不描边，选中项 action.selected 内胶囊，常规字重 */
+.el-checkbox-button { --el-checkbox-button-checked-bg-color: var(--color-action-selected); --el-checkbox-button-checked-text-color: var(--color-text-on-selected); --el-checkbox-button-checked-border-color: var(--color-action-selected);
+  background: var(--color-bg-hover); padding: var(--control-segmented-inset) 0; }
+.el-checkbox-button:first-child { border-radius: var(--radius-full) 0 0 var(--radius-full); padding-left: var(--control-segmented-inset); }
+.el-checkbox-button:last-child { border-radius: 0 var(--radius-full) var(--radius-full) 0; padding-right: var(--control-segmented-inset); }
+.el-checkbox-button:first-child:last-child { border-radius: var(--radius-full); }
+.el-checkbox-button__inner, .el-checkbox-button:first-child .el-checkbox-button__inner, .el-checkbox-button:last-child .el-checkbox-button__inner {
+  border: 0; outline: 0; box-shadow: none; background: transparent; color: var(--color-text-secondary); border-radius: var(--radius-full); font-size: var(--text-body-sm-size); font-weight: var(--font-weight-regular);
+  height: calc(var(--control-height-md) - 2 * var(--control-segmented-inset)); line-height: 1; padding: 0 var(--spacing-3-5); display: inline-flex; align-items: center; }
+.el-checkbox-button--small .el-checkbox-button__inner, .el-checkbox-button--small:first-child .el-checkbox-button__inner, .el-checkbox-button--small:last-child .el-checkbox-button__inner { height: calc(var(--control-height-sm) - 2 * var(--control-segmented-inset)); font-size: var(--text-small-size); padding: 0 var(--spacing-2-5); border-radius: var(--radius-full); }   /* 与 radio-button 分段同形；Element 的 --small 规则 (0,2,0) 会给直角 + 5px 内边距，必须在同特异性上重申 */
+.el-checkbox-button__inner:hover { color: var(--color-text-primary); }
+.el-checkbox-button.is-checked .el-checkbox-button__inner, .el-checkbox-button.is-checked:first-child .el-checkbox-button__inner { background-color: var(--color-action-selected); color: var(--color-text-on-selected); border-color: transparent; box-shadow: none; font-weight: var(--font-weight-regular); }
+.el-checkbox-button.is-disabled .el-checkbox-button__inner { background: transparent; color: var(--color-text-secondary); opacity: var(--opacity-disabled); border-color: transparent; }
+.el-checkbox-button.is-focus .el-checkbox-button__inner { border-color: transparent; }
+.el-checkbox.is-bordered.is-checked, .el-radio.is-bordered.is-checked { border-color: var(--color-border-focus); }   /* 带边框的勾选 / 单选：容器选中用焦点色边线（border.focus），不用主色 */
+/* 分段选择器组件（el-segmented）：与 radio-button 分段同一配方——灰轨道 bg.hover、不描边；未选项 hover 只换字色（轨道已是 hover 灰） */
+.el-segmented { --el-segmented-bg-color: var(--color-bg-hover); --el-segmented-color: var(--color-text-secondary); --el-segmented-item-selected-bg-color: var(--color-action-selected); --el-segmented-item-selected-color: var(--color-text-on-selected);
+  --el-segmented-item-hover-bg-color: transparent; --el-segmented-item-hover-color: var(--color-text-primary); --el-segmented-item-active-bg-color: transparent; --el-segmented-padding: var(--control-segmented-inset);
+  border-radius: var(--radius-full); font-size: var(--text-body-sm-size); }
+.el-segmented__item, .el-segmented__item-selected, .el-segmented--small .el-segmented__item, .el-segmented--small .el-segmented__item-selected, .el-segmented--large .el-segmented__item, .el-segmented--large .el-segmented__item-selected { border-radius: var(--radius-full); }
+.el-segmented__item.is-selected { font-weight: var(--font-weight-regular); }
+.el-segmented--small { font-size: var(--text-small-size); }
+/* 开关：选中态的文案用正文色，不用主色字；滑块是 control.knob 白底，选中时的加载图标用主色深一档 action.primary-active（5.3:1），text.on-primary 是白色会看不见 */
+.el-switch__label.is-active { color: var(--color-text-primary); }
+.el-switch.is-checked .el-switch__core .el-switch__action { color: var(--color-action-primary-active); }
+/* 评分：填充星用品牌金（antd 是黄星），空星冷灰；焦点外框用焦点色 */
+.el-rate { --el-rate-fill-color: var(--color-action-primary); --el-rate-void-color: var(--color-border-strong); --el-rate-disabled-void-color: var(--color-border-default); --el-rate-text-color: var(--color-text-secondary); --el-rate-outline-color: var(--color-border-focus); }
+/* 级联 / 树选择 / 时间选择：选中项深金字（text.selected） */
+.el-cascader-panel, .el-cascader, .el-cascader__dropdown { --el-cascader-menu-selected-text-color: var(--color-text-selected); }
+.time-select .time-select-item.selected:not(.disabled) { color: var(--color-text-selected); }
+.el-time-panel__btn.confirm { color: var(--color-text-primary); font-weight: var(--text-weight-label); }
+.el-select-dropdown.is-multiple .el-select-dropdown__item.is-selected::after { background-color: var(--color-text-selected); }
+.el-tree__drop-indicator, .el-input-tag__drop-indicator { background-color: var(--color-border-focus); }
+.el-tree-node.is-drop-inner > .el-tree-node__content .el-tree-node__label { background-color: var(--color-bg-selected-subtle); color: var(--color-text-primary); }
+/* 日历：今天与选中日同日期面板的规则 */
+.el-calendar-table td.is-today { color: var(--color-text-primary); font-weight: var(--font-weight-medium); }
+.el-calendar-table td.is-selected { background-color: var(--color-bg-selected); }
+/* 表格：筛选面板选中项、表头高亮 */
+.el-table-filter__list-item.is-active { background-color: var(--color-bg-selected); color: var(--color-text-selected); }   /* 同下拉选中项 */
+.el-table th.el-table__cell > .cell.highlight { color: var(--color-text-selected); }
+/* 标签页：边框卡片变体的选中文字同普通标签页 text.selected（Element 的选择器特异性更高，需单独接管）；无 active-bar 时的伪元素下划线 */
+.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active { color: var(--color-text-selected); }
+.el-tabs__active-bar.is-hidden ~ .is-active::after { background-color: var(--color-border-current); }
+/* 锚点：当前项深金字（text.selected），标记条是品牌指示条 */
+.el-anchor { --el-anchor-active-color: var(--color-text-selected); --el-anchor-marker-bg-color: var(--color-brand-indicator); }
+/* 上传：文案链接化、聚焦用焦点色（border.focus） */
+.el-upload-dragger .el-upload__text em { color: var(--color-text-link); text-decoration: var(--text-link-decoration); font-style: var(--text-link-style); }
+.el-upload:focus { border-color: var(--color-border-focus); color: var(--color-text-primary); }
+.el-upload:focus .el-upload-dragger { border-color: var(--color-border-focus); }
+.el-upload-list__item .el-icon--close-tip { color: var(--color-text-secondary); }
+/* 加载、结果、消息类的 primary 变体 */
+.el-loading-spinner .el-loading-text { color: var(--color-text-secondary); }
+.el-loading-spinner .path { stroke: var(--color-icon-default); }   /* 遮罩转圈不跟主色：金色只给 DESIGN 列出的位置（加载本该用骨架屏） */
+.el-loading-spinner i { color: var(--color-icon-default); }
+.el-result .icon-primary { --el-result-color: var(--color-icon-brand); }
+.el-message-box__status.el-message-box-icon--primary { --el-messagebox-color: var(--color-text-primary); }
+.el-notification .el-notification--primary { --el-notification-icon-color: var(--color-text-primary); }
+.el-alert--primary.is-light { background-color: var(--color-status-info-bg); color: var(--color-status-info); }
+.el-alert--primary.is-light .el-alert__title, .el-alert--primary.is-light .el-alert__description { color: var(--color-status-info); }
+.el-alert--primary.is-dark { background-color: var(--color-bg-inverse); color: var(--color-text-inverse); }
+/* 取色器、OTP 输入、回到顶部、Tour、抽屉拖柄 */
+.el-color-picker.is-focused .el-color-picker__trigger { border-color: var(--color-border-focus); }
+.el-color-predefine__color-selector.selected { box-shadow: 0 0 3px 2px var(--color-border-focus); }
+.el-input-otp--outlined .el-input-otp__input-field:hover { box-shadow: 0 0 0 var(--border-width-control) var(--color-border-strong) inset; }
+.el-input-otp--outlined .el-input-otp__input-field:focus-within, .el-input-otp--filled .el-input-otp__input-field:focus-within { box-shadow: 0 0 0 1px var(--color-border-focus) inset; }
+.el-input-otp--underlined .el-input-otp__input-field:hover::after { background-color: var(--color-border-strong); }
+.el-input-otp--underlined .el-input-otp__input-field:focus-within::after { background-color: var(--color-border-focus); }
+.el-backtop { --el-backtop-text-color: var(--color-text-primary); --el-backtop-hover-bg-color: var(--color-bg-hover); }
+.el-tour__content .el-tour-indicator.is-active { background: var(--color-action-primary); }
+/* 圆形 / 仪表盘进度：Element 在 JS 里写死一张颜色表（默认 #20a0ff 蓝、success #13ce66…）当 SVG 的 stroke 属性，不走任何变量；CSS 属性能压过它。
+   代价：progress 的 color 属性（自定义色）也会被压掉——进度色不属于可自定义项，与直线进度条同一规则 */
+.el-progress-circle__path { stroke: var(--color-action-primary-active); }
+.el-progress.is-success .el-progress-circle__path { stroke: var(--color-status-success); }
+.el-progress.is-exception .el-progress-circle__path { stroke: var(--color-status-error); }
+.el-progress.is-warning .el-progress-circle__path { stroke: var(--color-status-warning); }
+.el-progress-circle__track { stroke: var(--color-bg-selected); }
+/* 空状态插图：Element 自带 10 档灰（暖灰倾向），换成同族冷灰，暗色随 token 变化 */
+.el-empty { --el-empty-fill-color-0: var(--color-bg-surface); --el-empty-fill-color-1: var(--color-bg-subtle); --el-empty-fill-color-2: var(--color-bg-subtle); --el-empty-fill-color-3: var(--color-bg-page);
+  --el-empty-fill-color-4: var(--color-bg-page); --el-empty-fill-color-5: var(--color-border-default); --el-empty-fill-color-6: var(--color-border-default); --el-empty-fill-color-7: var(--color-border-default); --el-empty-fill-color-8: var(--color-border-strong); --el-empty-fill-color-9: var(--color-border-strong); }
+/* 日历：上 / 下月的日期不是占位符，用 text.muted（暗色下占位符色 hover 掉到 2.9:1） */
+.el-calendar-table:not(.is-range) td.next, .el-calendar-table:not(.is-range) td.prev { color: var(--color-text-muted); }
+/* 进度条内嵌文字：Element 写死白字，接到 text.on-primary（内嵌文字时填充是实色，主色深一档） */
+.el-progress-bar__innerText { color: var(--color-text-on-primary); }
+/* 头像：同配方 .avatar——不透明的奶金浅底 bg.selected-subtle + 深一档的 text.selected（亮 4.8:1、暗 6.6:1）；不透明底叠在悬停底上也不变色。Element 默认灰底白字暗色下只有 2.5:1 */
+.el-avatar { --el-avatar-bg-color: var(--color-bg-selected-subtle); --el-avatar-text-color: var(--color-text-selected); }
+/* 标签 / 提示条的 dark 效果（状态色实底 + 白字）违反"状态色是文字色"：退化为浅色成对；主色的 dark 标签是金底白字，不在此列 */
+.el-tag--dark.el-tag--success { --el-tag-bg-color: var(--color-status-success-bg); --el-tag-border-color: var(--color-status-success-bg); --el-tag-text-color: var(--color-status-success); --el-tag-hover-color: var(--color-status-success); }
+.el-tag--dark.el-tag--warning { --el-tag-bg-color: var(--color-status-warning-bg); --el-tag-border-color: var(--color-status-warning-bg); --el-tag-text-color: var(--color-status-warning); --el-tag-hover-color: var(--color-status-warning); }
+.el-tag--dark.el-tag--danger, .el-tag--dark.el-tag--error { --el-tag-bg-color: var(--color-status-error-bg); --el-tag-border-color: var(--color-status-error-bg); --el-tag-text-color: var(--color-status-error); --el-tag-hover-color: var(--color-status-error); }
+.el-tag--dark.el-tag--info { --el-tag-bg-color: var(--color-status-neutral-bg); --el-tag-border-color: transparent; --el-tag-text-color: var(--color-status-neutral); --el-tag-hover-color: var(--color-status-neutral); }
+.el-alert--success.is-dark { background-color: var(--color-status-success-bg); color: var(--color-status-success); }
+.el-alert--warning.is-dark { background-color: var(--color-status-warning-bg); color: var(--color-status-warning); }
+.el-alert--error.is-dark { background-color: var(--color-status-error-bg); color: var(--color-status-error); }
+.el-alert--info.is-dark { background-color: var(--color-status-info-bg); color: var(--color-status-info); }
+.el-alert.is-dark .el-alert__description { color: inherit; }
+/* 横向菜单：选中同侧栏当前项（主色底块白字） */
+.el-menu.el-menu--horizontal .el-menu-item:not(.is-disabled):not(.is-active):hover, .el-menu.el-menu--horizontal .el-menu-item:not(.is-disabled):not(.is-active):focus { color: var(--el-menu-hover-text-color); }
+.el-menu.el-menu--horizontal .el-menu-item.is-active:hover, .el-menu.el-menu--horizontal .el-menu-item.is-active:focus { background: var(--color-bg-sidebar-selected); color: var(--color-text-sidebar-selected); }   /* 选中项 hover 保持主色底块：Element 横向 hover（0,4,0）会把底换成浅灰而字仍是白 */   /* Element 横向菜单 hover 文字取 active-color（底块上的白字）配 hover-bg（浅灰）→ 1.1:1；与侧栏一致用 hover-text-color */
+/* ---- 禁用态 = opacity.disabled，不另造一套灰 ----
+   Element 的按钮禁用靠一组 disabled 变量换色（主按钮退成 primary-light-5，被我们映射成边线灰，看起来像次要按钮）。
+   把禁用色接回常态色，只留透明度；加载中也不再盖一层淡色——转圈本身就是状态。 */
+.el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus { opacity: var(--opacity-disabled); }
+.el-button--primary { --el-button-disabled-bg-color: var(--color-action-primary); --el-button-disabled-border-color: var(--color-action-primary); }
+.el-button--danger { --el-button-disabled-bg-color: var(--color-action-danger); --el-button-disabled-border-color: var(--color-action-danger); }
+.el-button:not(.el-button--primary):not(.el-button--danger):not(.is-link):not(.is-text) { --el-button-disabled-text-color: var(--color-text-primary); --el-button-disabled-bg-color: var(--color-bg-surface); --el-button-disabled-border-color: var(--color-border-strong); }
+.el-button.is-link { --el-button-disabled-text-color: var(--color-text-link); }
+.el-button.is-text { --el-button-disabled-text-color: var(--color-text-primary); }   /* 文字按钮常态是正文色（见上方 .el-button.is-text），禁用只压透明度 */
+.el-button.is-text.is-disabled, .el-button.is-text.is-disabled:hover, .el-button.is-text.is-disabled:focus { background-color: var(--color-action-quiet); }   /* 禁用的文字按钮也保留浅底，不裸放 */
+.el-button.is-loading::before { background-color: transparent; }
+
+/* ---- 控件高度共用 control.height.* ----
+   Element 只有输入类组件读 --el-component-size；按钮、下拉、级联、取色器、单选、开关、滑杆、评分、表单标签行高、分段器、分页的高度
+   是各尺寸类自己写死的 32 / 24 / 40。结果是按钮 32 vs 输入框 34，规则"共用 control.height"一直没真正成立。
+   按其原选择器同形逐条接回 token。 */
+.el-button { --el-button-size: var(--control-height-md); height: var(--el-button-size); }
+.el-button--large { --el-button-size: var(--control-height-lg); }
+.el-button--small { --el-button-size: var(--control-height-sm); }
+.el-select__wrapper { min-height: var(--control-height-md); }
+.el-select--large .el-select__wrapper { min-height: var(--control-height-lg); }
+.el-select--small .el-select__wrapper { min-height: var(--control-height-sm); }
+.el-cascader { line-height: var(--control-height-md); }
+.el-cascader--large { line-height: var(--control-height-lg); }
+.el-cascader--small { line-height: var(--control-height-sm); }
+.el-color-picker, .el-radio, .el-switch, .el-slider, .el-rate { height: var(--control-height-md); }
+.el-color-picker--large, .el-radio.el-radio--large, .el-switch--large, .el-slider--large, .el-rate--large { height: var(--control-height-lg); }
+.el-color-picker--small, .el-radio.el-radio--small, .el-switch--small, .el-slider--small, .el-rate--small { height: var(--control-height-sm); }
+.el-form-item__label, .el-form-item--default .el-form-item__label { height: var(--control-height-md); line-height: var(--control-height-md); }
+.el-form-item__content, .el-form-item--default .el-form-item__content { line-height: var(--control-height-md); }
+.el-form-item--large .el-form-item__label { height: var(--control-height-lg); line-height: var(--control-height-lg); }
+.el-form-item--large .el-form-item__content { line-height: var(--control-height-lg); }
+.el-form-item--small .el-form-item__label { height: var(--control-height-sm); line-height: var(--control-height-sm); }
+.el-form-item--small .el-form-item__content { line-height: var(--control-height-sm); }
+.el-segmented { min-height: var(--control-height-md); }
+.el-segmented--large { min-height: var(--control-height-lg); }
+.el-segmented--small { min-height: var(--control-height-sm); }
+.el-input-number { line-height: calc(var(--control-height-md) - 2px); }
+.el-input-number--small { line-height: calc(var(--control-height-sm) - 2px); }
+.el-input-number--large { line-height: calc(var(--control-height-lg) - 2px); }
+
+/* ── 树、标签页头间距、合计行、弹窗尺寸档、加载中的按钮 ── */
+/* 树：当前节点用奶金浅底（color.bg.selected-subtle，同 antd 树的选中底）+ 500 字重；行高进控件档；展开箭头用 icon.muted（占位符灰只有 2.5:1） */
+.el-tree { --el-tree-node-content-height: var(--control-height-md); --el-tree-expand-icon-color: var(--color-icon-muted); --el-tree-node-hover-bg-color: var(--color-bg-hover); }
+.el-tree-node__content { border-radius: var(--radius-md); }
+.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content { background-color: var(--color-bg-selected-subtle); color: var(--color-text-primary); font-weight: var(--font-weight-medium); }
+.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content .el-tree-node__expand-icon, .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content .el-tree-node__label, .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content .el-text { color: inherit; }   /* 标签用 el-text 渲染时自带正文色，当前项上跟随 */
+.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content:hover { background-color: var(--color-bg-selected-subtle); }
+/* 标签页头与内容的间距：Element 写死 15px，接到间距阶梯 */
+.el-tabs__header { margin: 0 0 var(--spacing-4); }
+.el-tabs--border-card > .el-tabs__header { margin: 0; }
+/* 直接放在内容区的标签栏（报表页这类只切换下方内容、pane 为空的页面级标签）：下边距交给内容区的 gap，不与它叠成两倍（同配方 .content > .stat-strip） */
+.content > .el-tabs > .el-tabs__header { margin-bottom: 0; }
+/* 表格合计行（show-summary）：Element 用行 hover 色做底、字重同正文，压不住正文行 → 浅底 + 500 + 等宽数字（DESIGN 表格配方「合计行」） */
+.el-table__footer-wrapper td.el-table__cell { background-color: var(--color-bg-subtle); color: var(--color-text-primary); font-weight: var(--font-weight-medium); font-family: var(--text-numeric-family); font-variant-numeric: var(--text-numeric-variant); }
+/* 弹窗尺寸档：用 class 而不是 :width="'var(--…)'" 传字符串——确认类 sm、带表单 md */
+.el-dialog.is-sm { --el-dialog-width: var(--layout-modal-width-sm); }
+.el-dialog.is-md { --el-dialog-width: var(--layout-modal-width-md); }
+/* 加载中的按钮不压淡：Element 在 loading 时同时加 is-disabled，正在处理的主按钮不应像禁用态 */
+.el-button.is-loading.is-disabled, .el-button.is-loading.is-disabled:hover { opacity: 1; }