/* ==========================================================================
 * tokens.css — 全站唯一设计令牌真源（批次31 · U1 设计令牌单源）
 * --------------------------------------------------------------------------
 * 引用方式：必须放在各页面自身样式之前：
 *   <link rel="stylesheet" href="/static/tokens.css">
 * 契约说明见 docs/design/tokens.md。
 * 本文件是令牌变量与少量派生工具类的唯一定义处；
 * 其它页面/agent 不得另行定义同名或同义变量、不得新增同义 class。
 * ========================================================================== */

:root {
  /* ---- 品牌 ---- */
  --brand: #4B3FE3;
  --brand-lite: #7C74FF;
  --brand-soft: #F2F7FF;

  /* ---- 状态语义色（大屏/后台共用，不得分裂，暗色下不翻转） ---- */
  --ok: #34D399;
  --warn: #FFB020;
  --danger: #FF3B5C;
  --info: #22D3EE;

  /* ---- 字体 ---- */
  --font: -apple-system, "SF Pro SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --mono: "SF Mono", "JetBrains Mono", Consolas, monospace;
  /* --font-floor：全局字号下限（批次57a，用户授权的 a11y 可读性收敛）。
   * 控件库/壳层一律不得出现 <12px 的 font-size，小字号档统一写 var(--font-floor)。
   * 唯二例外：.ui-table/.tbl th 与裸 code 保持 11px —— 设计稿同值（11px）且被
   * _b36_parity_probe「表头」「内联代码」两角色 MATCH 锁定，抬到 12px 会新增 parity DIFF。 */
  --font-floor: 12px;

/* ---- 间距刻度（唯一真源，全仓一律用变量，禁止散值）----
   * 使用规范：
   *   --s1 4px   元素内微距：标签内图标、日期表内部、分段控件内部（最小可感知间隔）
   *   --s2 8px   图标↔文字间距、按钮内图标、标签页内容区内、勾选框与文字（组件内标准间隔）
   *   --s3 12px  组件间最小间隔：工具条/表单行/按钮组、弹窗正文块、相邻小组件（默认最小间隔）
   *   --s4 16px  区块内边距：卡片内距、栅格列间距、表单字段间距
   *   --s5 24px  区块外边距：页面留景、区块间纵向节奏、壳层间隙
   *   --s6 32px  大板块间距：跨区块分隔、模态弹层与视口留边
   * 边界：icon↔text 用 --s2；组件间最小间隔用 --s3；压紧值（2/3px）仅限 segmented/日期表等
   *       像素级控件内部，不得扩散；9px/10px 属历史散值，应逐步收敛，不得新增。 */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;

  /* ---- 缓动 ---- */
  --ease: cubic-bezier(.32, .72, 0, 1);

  /* ---- 批次58 · UI 2.0 扩展（动效体系 + 第二强调色 + 品牌渐变，与大屏同源） ---- */
  --accent-2: #2DD4BF;                                   /* 青：第二强调（大屏同源） */
  --accent-2-ink: #0F9D8F;                               /* 青作文字时的浅底档（4.6:1+） */
  --grad-brand: linear-gradient(135deg, #4B3FE3 0%, #6D5CFF 55%, #2DD4BF 100%);
  --grad-brand-soft: linear-gradient(135deg, rgba(75,63,227,.10), rgba(45,212,191,.08));
  --dur-1: .18s;                                          /* 微交互（hover/按压） */
  --dur-2: .32s;                                          /* 组件过渡（卡片/面板） */
  --dur-3: .6s;                                           /* 页面级入场 */
  --ease-out-soft: cubic-bezier(.2, .7, .3, 1);
  --lift-shadow: 0 10px 28px rgba(75,63,227,.16), 0 2px 8px rgba(0,0,0,.08);

  /* ---- 后台浅色真值（与 layout.html 现值逐字一致，仅搬迁） ---- */
  --bg: #f4f5fa;
  --card: #fff;
  --line: #e7e9f2;
  /* --line-strong：可感知边界（控件边框/焦点环），WCAG 1.4.11 要求 ≥3:1；
     --line 只做分隔线，两者必须分开——直接把 --line 调深会让全站分隔线变重 */
  --line-strong: #7A8094;
  --text: #1f2430;
  /* #7a8094 按观感取值，浅色主题上只有 3.57–3.93:1，被 12 处选择器直接消费 →
     UX-14 运行时 466 条对比度违例里 281 条来自它。#676d82 白底 5.14:1。
     批次35 再加深到 #5A6072（设计稿同款次级灰）：浅色主题从"近实底卡片"改成
     "壁纸 + 半透白玻璃"后，次级灰会压在更淡的衬底上，46% 白玻璃底实测 5.0:1。 */
  --muted: #5A6072;
  --danger-ink: #D6133F;
  /* --danger-ink-glass：危险色文字**压在玻璃卡上**时的档位（批次39 控件库新增）。
   * 与 --link-ink 之于 --brand-ink 同理：暗色玻璃卡实测底约 #34363C，
   * --danger-ink #FF6B85 在该底上只有 4.44（11.5px 小字要 4.5），故暗色抬到 #FF7A90（4.86）。
   * 浅色底本身够亮，继续等同 --danger-ink。 */
  --danger-ink-glass: var(--danger-ink);
  /* --brand-ink：品牌色用作「文字/控件描边」时的档位。#4B3FE3 在白底 6.6:1 达标，
     但在暗色卡片底只有 2.36:1（1.4.3/1.4.11 双违），故暗色翻到 #8E86FF（暗底 5.4:1）。
     实心品牌底 + 白字的场合继续用 --brand，不翻转。 */
  --brand-ink: #4B3FE3;
  /* --link-ink：文字链 / 排序头 / 徽标小框在"卡片玻璃底 + 可能的品牌色 hover 层"上的档位。
     批次35 暗色改真玻璃后，--brand-ink #8E86FF 压在 20% 品牌亮色 hover 层上只有 4.15:1，
     故暗色再抬一档到 #A5A0FF（同一底实测 5.36:1）；浅色无需抬（6.6:1）。 */
  --link-ink: #4B3FE3;
  /* --danger-fill：实心危险按钮的底。#FF3B5C 上放白字只有 3.48:1（1.4.3 不达标），
     #D6133F 上白字 5.22:1；语义色 --danger 本身继续用于描边/色点，不翻转。 */
  --danger-fill: #D6133F;
  --radius: 10px;

  /* ---- 大屏深色 ---- */
  --deep: #060A14;
  --deep2: #0B1220;
  --cyan: #22D3EE;
  --violet: #8B5CF6;

  /* ---- 玻璃层原语 ---- */
  --glass-bg: rgba(255, 255, 255, .06);
  --glass-line: rgba(255, 255, 255, .18);
  --glass-blur: blur(20px) saturate(180%);

  /* ---- 玻璃两级合成值（背景色档位，须与 --glass-line/--glass-blur 搭配） ----
   * --glass-1 强玻璃：外壳/顶栏；--glass-2 弱玻璃：卡片 */
  --glass-1: rgba(255, 255, 255, .10);
  --glass-2: rgba(255, 255, 255, .05);

  /* ---- 两级阴影 ---- */
  --shadow-1: 0 1px 3px rgba(20, 20, 50, .06);
  --shadow-2: 0 8px 24px rgba(16, 24, 64, .18);

  /* ---- 批次35 材质制度（对齐设计稿 docs/design/aigeo-ui-preview.html .admin）----
   * 设计稿的观感来自三件事，缺一不可：① 壁纸（3 团品牌光斑 + 斜向底色渐变）；
   * ② 卡片是"透壁纸的白玻璃"而不是近实底；③ 交互控件一律胶囊圆角 + 大投影/品牌辉光。
   * 批次33 只做了 ① 的加强版（4 团、α .34）+ 一个不透的白衬底，所以"形似神不似"。
   *
   * AA 红线（浅色）：--muted #5A6072 压在 46% 白玻璃上实测 5.0:1；卡片 62% 上 5.4:1。
   * 暗色走真玻璃（.06/.045 白透）——浅色字压在暗底 + 光斑上余量 >5:1，故暗色可以比浅色透得多。
   * 光斑只由 admin-glass.css / tenant-glass.css 的 body 背景消费，页内不得另铺底纹。 */
  --base-grad: linear-gradient(160deg, #EEF1F8, #E6EAF5);
  --amb-1: rgba(75, 63, 227, .16);
  --amb-2: rgba(139, 92, 246, .12);
  --amb-3: transparent;   /* 设计稿 .admin.light 只有 2 团光斑（:198-201），第 3 团只在暗色出现 */
  --sheet-a: 55%;
  --card-a: 55%;   /* 设计稿 .admin.light 把 .glass 与 .glass-soft 定成同一档 .55 白 */
  --blur-sheet: blur(20px) saturate(180%);
  --blur-card: blur(16px) saturate(160%);
  --spec-top: rgba(255, 255, 255, .9);
  --spec-edge: rgba(255, 255, 255, .8);
  --depth-sheet: 0 1px 2px rgba(30, 34, 60, .05), 0 12px 36px rgba(30, 34, 60, .12), 0 32px 80px rgba(30, 34, 60, .07);
  --depth-card: 0 1px 2px rgba(30, 34, 60, .05), 0 10px 30px rgba(30, 34, 60, .12), 0 28px 70px rgba(30, 34, 60, .07);
  --card-sheen: radial-gradient(120% 90% at 20% 0%, rgba(255, 255, 255, .35), transparent 55%);
  /* 玻璃填充色的统一写法：白 + 主题档位（浅色 46/62%，暗色 6/4.5%） */
  --sheet-fill: color-mix(in srgb, #fff var(--sheet-a), transparent);
  --card-fill: color-mix(in srgb, #fff var(--card-a), transparent);
  /* .wrap 托底：比 sheet 更淡的一层，只给裸文字抬亮度（浅色实测 --muted 4.85:1），暗色 3% */
  --wrap-fill: rgba(255, 255, 255, .30);

  /* ---- 批次35 圆角制度（设计稿：卡片 20 / 弱玻璃 16 / 行卡 14 / 表格 12 / 控件 999）---- */
  --r-card: 20px;
  --r-soft: 16px;
  --r-row: 14px;
  --r-table: 12px;
  --r-pill: 999px;

  /* ---- 批次35 辉光（设计稿 .btn.pri / .tabs button.on 的品牌光）---- */
  --glow-brand: 0 2px 12px rgba(75, 63, 227, .42);
  --glow-brand-strong: 0 2px 12px rgba(75, 63, 227, .45);
  --glow-lite: 0 0 12px rgba(124, 116, 255, .35);
  /* 表格面板与中性 chip 的填充（设计稿 .tbl / code 制度）。表格仍走"不透明感"面板，不是玻璃。 */
  --tbl-fill: rgba(255, 255, 255, .60);
  --chip-fill: rgba(30, 34, 60, .07);
  /* 设计稿 .admin.light 的另两档（:215/:221）：页签条与幽灵按钮 = .66 白；行卡（.todo/.al）= .50 白 */
  --sheet-strong: rgba(255, 255, 255, .66);
  --row-fill: rgba(255, 255, 255, .50);
  /* ---- 批次37 基础组件档（输入框底 / 进度条轨道 / 滚动条）----
   * 输入框底取设计稿 .inp（亮 .78 白、暗 rgba(0,0,0,.18)）；描边继续走 --line-strong，
   * 因为设计稿的 .14 白描边在暗底上只有 1.2:1，破 WCAG 1.4.11（非文本对比 ≥3:1）。
   * 滚动条设计稿未定义，此处按同一套中性色补，避免 Windows 默认灰条把玻璃面切断。 */
  --inp-fill: rgba(255, 255, 255, .78);
  --track-fill: rgba(30, 34, 60, .08);
  --scroll-thumb: rgba(102, 110, 134, .45);
  --scroll-thumb-hover: rgba(102, 110, 134, .70);

  /* ---- 批次39 控件库基座（aigeo-ui.css 消费；设计稿未定义弹层/图标，以下均为推导值）----
   * 弹层层级制度：页内不得自写 z-index，一律吃这四档，否则下拉会被模态盖住、toast 会被弹层吃。
   * 玻璃层数 ≤2 是批次35 硬约束：模态 = 遮罩(1) + 面板(1) 已经用满，
   * 所以模态内部**禁止**再嵌第三层 backdrop-filter（下拉面板在弹层里退化为实底）。
   * 批次62k：drop 档 40→70——下拉/日期/菜单三种浮层已 portal 到 body（脱离卡片层叠上下文），
   * 必须盖过 modal(60) 与 drawer(65)，否则"模态内打开下拉/日期"会被自己的遮罩压住。 */
  --z-ui-drop: 70;
  --z-ui-modal: 60;
  --z-ui-drawer: 65;
  --z-ui-toast: 80;
  --scrim: rgba(30, 34, 60, .38);
  --scrim-blur: blur(6px);
  /* 控件标准高三档：sm 用于表格内联操作，md 是默认，lg 用于登录/主 CTA */
  --ui-h-sm: 26px;
  --ui-h-md: 32px;
  --ui-h-lg: 38px;
  /* 弹层面板底：遮罩/卡片之上必须"读得清"。批次62k：.86→.97——浮层面板禁用 backdrop-filter（契约 §13），
   * 低于 ~.95 时底层卡片文字会透上来，选项文字对比度不达标（用户实测）。仍是一层玻璃（不透明度预混）。 */
  --pop-fill: rgba(255, 255, 255, .97);
  --pop-line: rgba(30, 34, 60, .12);
  --pop-depth: 0 18px 48px rgba(30, 34, 60, .22);

  /* ---- 批次35 侧栏导轨：跟随主题的玻璃卡（设计稿 .side 用 .glass，不再是恒深导轨）----
   * 浅色用深字（--rail-fg 即正文色），暗色用浅字；选中态是"半透明品牌光"而非实心色块。 */
  --rail-fill: rgba(255, 255, 255, .55);
  --rail-line: rgba(255, 255, 255, .85);
  --rail-blur: blur(20px) saturate(180%);
  --rail-fg: #1F2430;
  --rail-fg-dim: #5A6072;
  --rail-hover: rgba(30, 34, 60, .06);
  --rail-active: rgba(75, 63, 227, .14);
  --rail-active-fg: #3228B3;
}

/* ==========================================================================
 * 后台暗色主题（U6 亮暗成套翻转）：仅翻转浅色五件套 + radius 不动；
 * 品牌色与语义色（--ok/--warn/--danger/--info）保持不变。
 * 挂 [data-theme="dark"] 或 .theme-dark，不改任何既有 class 名。
 * ========================================================================== */
[data-theme="dark"],
.theme-dark {
  --bg: #12141c;
  --card: #1a1d28;
  --line: #2b3040;
  --line-strong: rgba(255, 255, 255, .40);
  --text: #E5E7EB;   /* 设计稿 .admin 正文色 */
  --muted: #A3AABD;
  /* 暗色下 --brand #4B3FE3 作文字只有 2.25–2.49:1，--brand-lite #7C74FF 在 12px 下也仅 4.19:1 */
  --brand-ink-dark: #8E86FF;
  --brand-ink: #8E86FF;
  --link-ink: #A5A0FF;
  --wrap-fill: rgba(255, 255, 255, .03);
  --danger-ink: #FF6B85;
  --danger-ink-glass: #FF7A90;

  /* 批次35 暗色成套：**真玻璃**（设计稿默认态）——壁纸用斜向深色渐变 + 3 团可辨光斑，
   * 玻璃片只用 6% / 4.5% 的白透，靠"透出壁纸"而不是"盖住壁纸"取得层次。
   * 浅色字（#e9ebf3 / --muted #9aa1b5）压在暗底 + 光斑上余量 >5:1，所以暗色可以远比浅色透。 */
  --base-grad: linear-gradient(160deg, #0F1115, #161A22);
  --amb-1: rgba(75, 63, 227, .26);
  --amb-2: rgba(139, 92, 246, .18);
  --amb-3: rgba(34, 211, 238, .12);
  --sheet-a: 6%;
  --card-a: 4.5%;
  --tbl-fill: rgba(0, 0, 0, .16);
  --chip-fill: rgba(255, 255, 255, .07);
  --sheet-strong: rgba(255, 255, 255, .06);
  --row-fill: rgba(255, 255, 255, .045);
  --inp-fill: rgba(0, 0, 0, .18);
  --track-fill: rgba(255, 255, 255, .06);
  --scroll-thumb: rgba(255, 255, 255, .18);
  --scroll-thumb-hover: rgba(255, 255, 255, .30);
  /* 批次39 暗色成套：遮罩加深、弹层面板改用"读得清的深玻璃"（不能用浅色那套白透，
   * 否则弹层会和它身后的白玻璃卡糊成一片，失去层级）。 */
  --scrim: rgba(0, 0, 0, .58);
  --pop-fill: #1c202b;
  --pop-line: rgba(255, 255, 255, .14);
  --pop-depth: 0 18px 48px rgba(0, 0, 0, .55);
  --spec-top: rgba(255, 255, 255, .25);
  --spec-edge: rgba(255, 255, 255, .18);
  --depth-sheet: 0 1px 3px rgba(0, 0, 0, .40), 0 14px 40px rgba(0, 0, 0, .38), 0 34px 90px rgba(0, 0, 0, .28);
  --depth-card: 0 1px 3px rgba(0, 0, 0, .35), 0 12px 34px rgba(0, 0, 0, .34), 0 30px 80px rgba(0, 0, 0, .25);
  --card-sheen: radial-gradient(120% 90% at 20% 0%, rgba(255, 255, 255, .03), transparent 50%);
  --blur-sheet: blur(20px) saturate(180%);
  --blur-card: blur(16px) saturate(160%);
  /* 暗色导轨玻璃与浅字成套 */
  --rail-fill: rgba(255, 255, 255, .06);
  --rail-line: rgba(255, 255, 255, .18);
  --rail-fg: #C7C7CC;
  --rail-fg-dim: #9AA1B5;
  --rail-hover: rgba(255, 255, 255, .06);
  --rail-active: rgba(124, 116, 255, .22);
  --rail-active-fg: #fff;
}

/* ==========================================================================
 * 派生工具类（本批新增仅此六个，其余 agent 不得再造同义类名）
 * 玻璃工具类：.glass（强，外壳/顶栏） .glass-soft（弱，卡片） .nav-pill
 * 批次57a 单源化：.glass/.glass-soft 是**全站唯一**类定义（消费上方 --glass-* 原语组
 * 与批次35 材质档 --sheet-fill、--card-fill、--blur-*、--spec-*、--depth-*，--card-sheen 即玻璃光泽位），
 * admin-glass.css 里的逐字重复副本已删除——两端+大屏只认这一份。
 * 表格区不得用玻璃底：标准表格一律 .tbl。
 * ========================================================================== */
.glass {
  /* 注意用 background-color 长写、不用 background 简写：admin-glass 副本删除后（批次57a 单源），
     静态审计按 background-color 解析玻璃合成底，简写会令其解析不到而错判 AA（实测 3.87 vs 4.58）。 */
  background-color: var(--sheet-fill);
  border: 1px solid var(--spec-edge);
  backdrop-filter: var(--blur-sheet);
  -webkit-backdrop-filter: var(--blur-sheet);
  border-radius: var(--r-card);
  box-shadow: var(--depth-sheet), inset 0 1px 0 var(--spec-top);
}
.glass-soft {
  background-color: var(--card-fill);
  border: 1px solid var(--spec-edge);
  backdrop-filter: var(--blur-card);
  -webkit-backdrop-filter: var(--blur-card);
  border-radius: var(--r-soft);
  box-shadow: var(--depth-card), inset 0 1px 0 var(--spec-top);
}
.nav-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  padding: var(--s2) var(--s3);
  border-radius: 999px;
  background: var(--glass-2);
  border: 1px solid var(--glass-line);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  color: #fff;
  font-size: 13px;
}
.tbl {
  width: 100%;
  border-collapse: collapse;
  background: var(--card); /* 实底，禁止玻璃底 */
}
.tbl th,
.tbl td {
  padding: var(--s2) var(--s3);
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-size: 12.5px;
}
.tbl th {
  color: var(--muted);
  font-weight: 500;
  background: var(--brand-soft);
}
.tbl td {
  color: var(--text);
}
[data-theme="dark"] .tbl th,
.theme-dark .tbl th {
  background: var(--card);
}
.num {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.cell-ops {
  display: flex;
  align-items: center;
  gap: var(--s2);
}

/* ==========================================================================
 * 批次38 · 版式原语（两端共用，故放在 tokens.css：平台端与租户端都只 link 这一份）
 * 设计稿概览页骨架是"KPI 带 → 左右两栏 1.6fr:1fr（.two）"，我们此前是一列全宽块堆到底。
 * 这些类只给栅格与栏比，不带任何视觉装饰；≤1200px 一律塌成单列，避免窄屏半宽卡。
 * ========================================================================== */
.cols-main { display: grid; grid-template-columns: 1.6fr 1fr; gap: var(--s5); align-items: start; margin-bottom: var(--s4); min-width: 0; }
.cols-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); align-items: start; }
.cols-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s4); align-items: start; }
.cols-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s4); align-items: start; }
.cols-5 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s4); align-items: start; }
.flow-col { display: flex; flex-direction: column; gap: var(--s4); min-width: 0; }
/* 批次42：.flow-col 也要归零子卡外距——否则 gap16 + margin16 = 32px 叠距（原清单漏了它） */
.cols-main > .card, .cols-2 > .card, .cols-3 > .card, .cols-4 > .card, .cols-5 > .card, .flow-col > .card { margin-bottom: 0; min-width: 0; }
/* 两栏里放表格时，窄栏（1366 视口实测右栏仅 ~425px）下让表卡在卡内横滚，
   而不是把表头逐字折成竖排——子卡已 min-width:0，不加滚动容器内容会直接溢出。 */
.cols-main .card { overflow-x: auto; }
.cols-main table { min-width: 480px; }
@media (max-width: 1200px) {
  .cols-main, .cols-2, .cols-3, .cols-4, .cols-5 { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
 * 全局焦点环：品牌亮色不随换肤翻转，任何主题下保持可见。
 * ========================================================================== */
:focus-visible {
  outline: 2px solid var(--brand-lite);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ==========================================================================
 * 性能模式开关：由页面 JS 切换 body.perf-mode。
 * 关闭一切 backdrop-filter 与网格纹理（纹理约定只允许挂在玻璃层的
 * background-image 上，此处一并关闭），玻璃降级为纯色。
 * ========================================================================== */
body.perf-mode * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.perf-mode .glass,
body.perf-mode .glass-soft {
  background: var(--card, #fff);
  background-image: none !important;
  border-color: var(--line, #e7e9f2);
  box-shadow: none;
}
/* 批次33：性能模式连环境光斑一起关（body 背景是光斑唯一载体），玻璃衬底退为实底 */
body.perf-mode { background-image: none !important; }
body.perf-mode .wrap {
  background-color: var(--bg, #f4f5fa);
  background-image: none;
  border-color: var(--line, #e7e9f2);
  box-shadow: none;
}

/* ==========================================================================
 * 减少动效（系统级偏好）
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}

/* ---- 批次50：全局隐藏滚动条（保留滚轮/触摸滚动；用户拍板"去掉滑动条"） ----
 * tokens 层生效于两端+大屏；Chrome/Edge 走 ::-webkit-scrollbar，Firefox 走 scrollbar-width。 */
* { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { width: 0; height: 0; display: none; }

/* ==========================================================================
 * 批次58 · UI 2.0 微交互基座（中央类，两端通用；页面零改动即可获得基础动效）
 * 契约：只提供类，不强制；页面级动效（页面切换/骨架屏接线）由各壳层消费。
 * ========================================================================== */

/* 卡片浮起：.ui-lift 悬停上浮+品牌投影（挂在卡片/可点卡上） */
.ui-lift { transition: transform var(--dur-2) var(--ease-out-soft), box-shadow var(--dur-2) var(--ease-out-soft), border-color var(--dur-2) var(--ease-out-soft); }
.ui-lift:hover { transform: translateY(-2px); box-shadow: var(--lift-shadow); border-color: color-mix(in srgb, var(--brand) 38%, transparent); }
.ui-lift:active { transform: translateY(0) scale(.995); }

/* 按压反馈：可点元素按压缩放（按钮类基座已由 .ui-btn 提供 focus，这里补 active） */
.ui-press { transition: transform var(--dur-1) var(--ease-out-soft); }
.ui-press:active { transform: scale(.97); }

/* 品牌渐变强调：标题/数字/进度可用（与大屏同源渐变） */
.ui-grad-text { background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* 骨架屏：.ui-skeleton（shimmer 流光占位，配合宽高使用） */
.ui-skeleton { position: relative; overflow: hidden; background: color-mix(in srgb, var(--muted, #5A6072) 14%, transparent); border-radius: 8px; min-height: 14px; }
.ui-skeleton::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--brand) 12%, transparent), transparent);
  animation: ui-shimmer 1.4s infinite; }
@keyframes ui-shimmer { to { transform: translateX(100%); } }

/* 页面入场：.ui-pagein（壳层页面切换时挂上，淡入+上移） */
.ui-pagein { animation: ui-pagein var(--dur-3) var(--ease-out-soft); }
@keyframes ui-pagein { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* 数字滚动场景的等宽防抖（KPI/计数） */
.ui-num { font-variant-numeric: tabular-nums; }