/* ============================================================================
 * admin_v8_skin.css —— 后台「重皮」皮肤层 v1   2026-10-05
 * ----------------------------------------------------------------------------
 * 目的：把后台外观改成客户给的参考界面那种风格（现代中后台）
 *   · 深色侧栏 + 线性图标 + 蓝色圆角选中块
 *   · 顶栏面包屑 + 页签式导航(可切可关) + 铃铛/头像
 *   · 筛选区白底卡片 · 两行 · label 90px 右对齐 · 输入框 32px
 *   · 表格 40px 行高 · 表头浅灰 · 极淡横线 · 状态彩色 pill
 *   · 字号统一 13px（页面标题 16px / 侧栏 13px）· 圆角 4-6px · 极淡阴影
 *
 * ★★ 本文件【只写样式】✗ 不含任何业务逻辑 ✗✗
 *    不改 admin_v7.css / admin_v7.js ✗（靠更高特异性覆盖，见下方每段的说明）
 *
 * ★★ 闸门（重要）：所有规则都挂在 html[data-ds-skin="on"] 或 #page-orders 下面。
 *    这个属性由 admin_v8_skin.js 只在【订单管理】页加上 =>
 *      其余 11 页 = 100% 原样渲染（连顶栏的 DOM 顺序都还原，见 .ds-tb-row1 的 display:contents）
 *    第二步铺开全站：把 admin_v8_skin.js 里 DS_PAGES_ONLY 改成 [] 即可（一行）
 *
 * ★ 加载顺序：必须在 admin_v8_light.css【之后】（index.html 里已排在最后）
 *   本文件内所有覆盖都靠 "更高特异性 + 后加载" 生效，不改别人文件
 * ==========================================================================*/

/* ==========================================================================
 * ① 变量 / 令牌
 * ========================================================================*/
html[data-ds-skin="on"]{
  /* 配色（现代后台那一套，取自客户参考界面） */
  --ds-primary:        #1677ff;
  --ds-primary-hover:  #4096ff;
  --ds-primary-active: #0958d9;
  --ds-text:           #1f2329;
  --ds-text-2:         #646a73;
  --ds-text-3:         #6b7280;   /* 2026-10-07 对比度整改：2.83:1 -> 4.54:1 (WCAG AA) */
  --ds-border:         #e5e6eb;
  --ds-border-2:       #f0f1f3;
  --ds-th:             #f7f8fa;
  --ds-hover:          #f7f8fa;
  --ds-ok:             #00b42a;
  --ds-danger:         #f53f3f;
  /* 深色侧栏（近黑/深灰蓝，客户点名 #1f2937 / #1b2434 那一档） */
  --ds-side:           #1f2937;
  --ds-side-2:         #1b2434;
  --ds-side-text:      rgba(255,255,255,.72);
  --ds-side-text-hi:   #ffffff;
  --ds-side-hover:     rgba(255,255,255,.07);
  --ds-side-line:      rgba(255,255,255,.07);

  /* 覆盖 v8 主色（原来是 GitHub 蓝 #0969da / 橙）-> 参考界面的 #1677ff */
  --v8-accent:        #1677ff;
  --v8-accent-hover:  #4096ff;
  --v8-accent-2:      #4096ff;
  --v8-accent-soft:   rgba(22,119,255,.10);
  --v8-accent-line:   rgba(22,119,255,.30);
  --v8-sh-focus:      0 0 0 3px rgba(22,119,255,.10);

  /* 布局：侧栏 200 -> 176px；顶栏 40 -> 76px（40 面包屑行 + 36 页签行）
     ★ .main 的 padding-top / .v7-topbar 的 left 都是 var() 取值 -> 改这两行全自动跟着走 ✓ */
  --v7-sidebar-width:  176px;
  --v7-topbar-height:  76px;
}

/* ==========================================================================
 * ② 侧栏 —— ★★ 浅色 -> 深色
 *   覆盖 admin_v8_light.css §3 / §5(变体) / §9.1，所以必须带上那两个变体选择器
 * ========================================================================*/
html[data-ds-skin="on"] .sidebar,
html[data-ds-skin="on"][data-v8-side="gray"] .sidebar,
html[data-ds-skin="on"][data-v8-side="white"] .sidebar{
  background: var(--ds-side) !important;
  color: var(--ds-side-text) !important;
  /* ★ 客户点名：深色侧栏与内容区之间【没有明显分隔线】 */
  border-right: 0 !important;
  box-shadow: none !important;
}
/* 顶部品牌名 */
html[data-ds-skin="on"] .sidebar h1.sb-brand{
  height: 44px !important; min-height: 44px !important;
  padding: 0 14px !important;
  color: #fff !important;
  font-size: 14px !important; font-weight: 600 !important;
  letter-spacing: .2px !important;
  border-bottom: 0 !important;          /* 深色侧栏里不要分隔线 */
}
html[data-ds-skin="on"] .sidebar h2{color:rgba(255,255,255,.45)!important}

/* 应用切换器 */
html[data-ds-skin="on"] .v8-switcher{padding: 0 8px 10px !important}
html[data-ds-skin="on"] .v8-sw-hint{color:rgba(255,255,255,.4)!important;font-size:11px!important;padding:2px 4px 6px!important}
html[data-ds-skin="on"] .v8-sw-btn,
html[data-ds-skin="on"][data-v8-side="gray"] .v8-sw-btn{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 6px !important;
  color: #fff !important;
  height: 32px !important;
  padding: 0 8px !important;
  gap: 6px !important;
  font-size: 11.5px !important;
}
html[data-ds-skin="on"] .v8-sw-btn .v8-sw-ico{
  background: var(--ds-primary) !important; color:#fff !important;
  width:16px !important; height:16px !important; flex:0 0 16px !important;
  border-radius:4px !important; font-size:9.5px !important;
}
/* ★ 实测（改后截图）：176px 侧栏里 "Adobe 安装助手" 会折成两行 ✗
   -> 单行 + 省略号（完整名字仍在 title 里 ✓ 可悬停查看） */
html[data-ds-skin="on"] .v8-sw-btn .v8-sw-n{
  color:rgba(255,255,255,.9)!important;
  min-width:0 !important; white-space:nowrap !important;
  overflow:hidden !important; text-overflow:ellipsis !important;
}
html[data-ds-skin="on"] .v8-sw-btn .v8-sw-c{color:rgba(255,255,255,.45)!important;flex:0 0 auto!important}

/* 导航容器 */
html[data-ds-skin="on"] .v8-side-nav{padding:2px 0 8px !important}

/* 父项（可展开）：一行 = 线性图标 + 标题 + 右侧小三角 */
html[data-ds-skin="on"] .v8-nav-par{
  height: 32px !important;
  margin: 2px 8px !important;
  padding: 0 10px !important;
  border-radius: 5px !important;
  border-left: 0 !important;
  color: var(--ds-side-text) !important;
  font-size: 13px !important; font-weight: 500 !important;
  gap: 8px !important;
}
html[data-ds-skin="on"] .v8-nav-par:hover{background:var(--ds-side-hover)!important;color:#fff!important}
html[data-ds-skin="on"] .v8-nav-par .v8-par-ic{flex:0 0 16px!important;width:16px!important;height:16px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:12.5px!important;color:inherit!important}
html[data-ds-skin="on"] .v8-nav-par .v8-par-cv{color:rgba(255,255,255,.40)!important;font-size:10px!important}
/* 当前页所在父级 */
html[data-ds-skin="on"] .v8-nav-par.onpath{
  background: rgba(255,255,255,.05) !important;
  color: #fff !important;
}
html[data-ds-skin="on"] .v8-nav-par.onpath .v8-par-cv{color:rgba(255,255,255,.6)!important}

/* 子项：缩进 + 线性图标；✗ 去掉 light.css 那条 1px 竖线（深色侧栏里是脏线） */
html[data-ds-skin="on"] .v8-nav-sub::before{display:none !important}
html[data-ds-skin="on"] #v8SideNav .nav-item{
  height: 32px !important;
  margin: 1px 8px !important;
  padding: 0 10px 0 26px !important;
  border-radius: 5px !important;
  border-left: 0 !important;
  color: var(--ds-side-text) !important;
  font-size: 13px !important; font-weight: 400 !important;
  gap: 8px !important;
}
html[data-ds-skin="on"] #v8SideNav .nav-item:hover{
  background: var(--ds-side-hover) !important; color:#fff !important; padding-left:26px !important;
}
/* ★ 选中项 = 蓝色圆角高亮块 + 白字 */
html[data-ds-skin="on"] #v8SideNav .nav-item.active,
html[data-ds-skin="on"][data-v8-side="gray"] #v8SideNav .nav-item.active{
  background: var(--ds-primary) !important;
  background-image: none !important;
  color: #fff !important;
  border-left: 0 !important;
  border-radius: 5px !important;
  font-weight: 500 !important;
}
html[data-ds-skin="on"] #v8SideNav .nav-item.active .ds-nav-ic{color:#fff!important}

/* 侧栏底部信息 */
html[data-ds-skin="on"] .v8-side-foot{
  border-top: 1px solid var(--ds-side-line) !important;
  padding: 8px 12px 10px !important;
  color: rgba(255,255,255,.40) !important;
}
html[data-ds-skin="on"] .v8-side-foot .r{font-size:11px !important;color:rgba(255,255,255,.40)!important}
html[data-ds-skin="on"] .v8-side-foot b{color:rgba(255,255,255,.65)!important;font-weight:500!important}
html[data-ds-skin="on"] .v8-side-foot .v8-dot-ok{color:var(--ds-ok)!important}

/* 侧栏滚动条（深色细条） */
html[data-ds-skin="on"] .v8-side-nav::-webkit-scrollbar{width:6px}
html[data-ds-skin="on"] .v8-side-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:3px}
html[data-ds-skin="on"] .v8-side-nav::-webkit-scrollbar-track{background:transparent}

/* 导航线性图标：关闸时完全隐藏 -> 回到原来的 emoji，保证其余 11 页零变化 ✓ */
html:not([data-ds-skin="on"]) .ds-nav-ic{display:none !important}
html[data-ds-skin="on"] .ds-nav-emoji{display:none !important}
html[data-ds-skin="on"] .ds-nav-ic{
  flex:0 0 14px; width:14px; height:14px; display:inline-flex; align-items:center; justify-content:center;
  color: rgba(255,255,255,.62);
}
html[data-ds-skin="on"] .ds-nav-ic svg{width:14px;height:14px;display:block}
html[data-ds-skin="on"] #v8SideNav .nav-item:hover .ds-nav-ic{color:#fff}
html[data-ds-skin="on"] .v8-nav-par .ds-nav-ic{color:rgba(255,255,255,.62)}

/* ==========================================================================
 * ③ 顶栏 —— 40px 单行 -> 76px 两行（面包屑行 + 页签行）
 *   DOM 结构由 admin_v8_skin.js 包一层：
 *     .v7-topbar > .ds-tb-row1[原有子元素] + .ds-tb-row2[页签]
 *   ★ 关闸时 .ds-tb-row1 用 display:contents -> 子元素直接参与 .v7-topbar 的 flex，
 *     与改造前【逐像素一致】✓（这就是"其余 11 页零回归"的保证）
 * ========================================================================*/
html:not([data-ds-skin="on"]) .ds-tb-row1{display:contents !important}
html:not([data-ds-skin="on"]) .ds-tb-row2,
html:not([data-ds-skin="on"]) .ds-bell{display:none !important}

html[data-ds-skin="on"] .v7-topbar{
  height: 76px !important;
  padding: 0 !important;
  gap: 0 !important;
  display: block !important;
  background: #fff !important;
  border-bottom: 1px solid var(--ds-border) !important;
  box-shadow: none !important;
  z-index: 100 !important;
}
html[data-ds-skin="on"] .ds-tb-row1{
  height: 40px; display:flex; align-items:center; gap:10px; padding:0 16px;
}
html[data-ds-skin="on"] .ds-tb-row2{
  height: 36px; display:flex; align-items:center; gap:6px; padding:0 12px;
  background: var(--ds-th);
  border-top: 1px solid var(--ds-border-2);
  overflow-x: auto; overflow-y: hidden;
}
html[data-ds-skin="on"] .ds-tb-row2::-webkit-scrollbar{height:0}

/* 汉堡：☰ -> 线性图标（用背景 SVG，避免动 admin_v7.js 的 DOM） */
html[data-ds-skin="on"] .v7-topbar .v7-hamburger{
  width:28px !important; height:28px !important; padding:0 !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  color: transparent !important;
  border-radius:5px !important;
  background-color: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%231f2329'%20stroke-width='2'%20stroke-linecap='round'><line%20x1='3'%20y1='6'%20x2='21'%20y2='6'/><line%20x1='3'%20y1='12'%20x2='21'%20y2='12'/><line%20x1='3'%20y1='18'%20x2='21'%20y2='18'/></svg>");
  background-repeat: no-repeat; background-position: center; background-size: 16px 16px;
}
html[data-ds-skin="on"] .v7-topbar .v7-hamburger:hover{background-color:var(--ds-hover)}

/* 面包屑：灰字 + 斜杠分隔 */
html[data-ds-skin="on"] .v7-breadcrumb{
  font-size: 13px !important; font-weight: 400 !important;
  color: var(--ds-text-3) !important;
}
html[data-ds-skin="on"] .v7-breadcrumb .v7-crumb-current{
  color: var(--ds-text) !important; font-weight: 500 !important;
}
/* 全局搜索 */
html[data-ds-skin="on"] .v7-search input{
  width: 200px !important; height: 30px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  border: 1px solid var(--ds-border) !important; border-radius: 4px !important;
  background: #fff !important; color: var(--ds-text) !important;
}
html[data-ds-skin="on"] .v7-search input::placeholder{color:var(--ds-text-3)!important}
html[data-ds-skin="on"] .v7-search input:focus{border-color:var(--ds-primary)!important;box-shadow:0 0 0 2px rgba(22,119,255,.10)!important}
html[data-ds-skin="on"] .v7-clock{font-size:12px !important;color:var(--ds-text-3)!important;font-weight:400!important}

/* 铃铛（纯装饰图标：✗ 无红点 —— 我们没有站内消息数据源，画红点=谎报有未读 ✗） */
html[data-ds-skin="on"] .ds-bell{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:5px; color:var(--ds-text-2); cursor:default;
}
html[data-ds-skin="on"] .ds-bell svg{width:17px;height:17px;display:block}

/* 用户区：头像 + admin（★ 保留原有 "退出" 文案与点击=退出的老行为，不动 ✓） */
html[data-ds-skin="on"] .v7-user{
  height: 30px !important; padding: 0 8px 0 4px !important;
  border-radius: 5px !important;
  background: transparent !important;
  border: 0 !important;
  gap: 7px !important;
}
html[data-ds-skin="on"] .v7-user:hover{background:var(--ds-hover)!important}
html[data-ds-skin="on"] .v7-user-avatar,
html[data-ds-skin="on"] .v7-user .avatar{
  width:24px !important; height:24px !important; border-radius:50% !important;
  background: var(--ds-primary) !important;
  background-image: none !important;
  color:#fff !important; font-size:11px !important; font-weight:500 !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
}
html[data-ds-skin="on"] .v7-user-name{font-size:13px !important;color:var(--ds-text)!important;font-weight:400!important}

/* ---- 页签式导航（★ 视觉新增：最近访问页签 + 可点可关） ---- */
html[data-ds-skin="on"] .ds-tab{
  display:inline-flex; align-items:center; gap:6px;
  height:26px; padding:0 6px 0 10px; flex:0 0 auto;
  border:1px solid transparent; border-radius:4px;
  background:transparent; color:var(--ds-text-2);
  font-size:13px; line-height:1; cursor:pointer; white-space:nowrap;
}
html[data-ds-skin="on"] .ds-tab:hover{background:#fff;color:var(--ds-text)}
html[data-ds-skin="on"] .ds-tab.active{
  background:#fff; color:var(--ds-primary);
  border-color:var(--ds-border);
  box-shadow:0 1px 2px rgba(31,35,41,.04);
}
html[data-ds-skin="on"] .ds-tab-x{
  width:15px; height:15px; border-radius:3px;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--ds-text-3); flex:0 0 15px;
}
html[data-ds-skin="on"] .ds-tab:hover .ds-tab-x{background:rgba(31,35,41,.06);color:var(--ds-text)}
html[data-ds-skin="on"] .ds-tab-x svg{width:10px;height:10px;display:block}

/* ==========================================================================
 * ④ 内容区 / 页面头
 * ========================================================================*/
/* ★ 字号统一压到 13px（客户点名）。只在本页的闸门下生效，其余 11 页仍是原来的 14px ✓ */
html[data-ds-skin="on"] body{font-size: 13px !important}
html[data-ds-skin="on"] .page-title{
  font-size: 16px !important; font-weight: 600 !important;
  color: var(--ds-text) !important;
}
html[data-ds-skin="on"] .page-subtitle,
html[data-ds-skin="on"] #page-orders .page-subtitle{
  font-size: 12px !important; font-weight: 400 !important; color: var(--ds-text-3) !important;
}
html[data-ds-skin="on"] #page-orders .page-header{margin: 0 0 14px 0 !important}

/* 通用小按钮（刷新 / 重置 / 上一页 …）：白底 1px 浅灰边 */
html[data-ds-skin="on"] #page-orders .btn,
html[data-ds-skin="on"] #page-orders .v8-btn{
  height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important;
  font-size: 13px !important; line-height: 30px !important; font-weight: 400 !important;
  border-radius: 4px !important;
  background: #fff !important; color: var(--ds-text) !important;
  border: 1px solid var(--ds-border) !important;
  box-shadow: none !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 5px !important;
}
html[data-ds-skin="on"] #page-orders .btn:hover,
html[data-ds-skin="on"] #page-orders .v8-btn:hover{
  border-color: var(--ds-primary) !important; color: var(--ds-primary) !important;
}
/* 主按钮：蓝色实心 */
html[data-ds-skin="on"] #page-orders .btn-primary,
html[data-ds-skin="on"] #page-orders .v8-btn-primary,
html[data-ds-skin="on"] #page-orders .v8-btn.primary{
  background: var(--ds-primary) !important;
  border-color: var(--ds-primary) !important;
  color: #fff !important;
}
html[data-ds-skin="on"] #page-orders .btn-primary:hover,
html[data-ds-skin="on"] #page-orders .v8-btn-primary:hover{
  background: var(--ds-primary-hover) !important; border-color: var(--ds-primary-hover) !important; color:#fff !important;
}
/* 危险按钮：红色实心（本页暂无；第二步铺到【真正有删除】的页面时直接生效 ✓） */
html[data-ds-skin="on"] .ds-btn-danger{
  background: var(--ds-danger) !important; border-color: var(--ds-danger) !important; color:#fff !important;
}
html[data-ds-skin="on"] #page-orders .btn svg,
html[data-ds-skin="on"] #page-orders .v8-btn svg{width:14px;height:14px;display:block}

/* 明细/汇总 切换：分段控件（与顶栏页签区分开，它是【页内】切换） */
html[data-ds-skin="on"] #page-orders .orders-tab-bar{
  height: 34px !important; padding: 3px !important;
  background: var(--ds-th) !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important;
  margin-bottom: 12px !important;
}
html[data-ds-skin="on"] #page-orders .orders-tab-bar .tab-btn{
  height: 26px !important; padding: 0 12px !important;
  font-size: 13px !important; font-weight: 400 !important;
  border-radius: 4px !important; border: 0 !important;
  background: transparent !important; color: var(--ds-text-2) !important;
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
}
html[data-ds-skin="on"] #page-orders .orders-tab-bar .tab-btn svg{width:14px;height:14px;display:block}
html[data-ds-skin="on"] #page-orders .orders-tab-bar .tab-btn.active{
  background: #fff !important; color: var(--ds-primary) !important; font-weight: 500 !important;
  box-shadow: 0 1px 2px rgba(31,35,41,.05);
}

/* ==========================================================================
 * ⑤ KPI 统计条（保持一条 40 -> 52px，字号按 13px 体系）
 * ========================================================================*/
html[data-ds-skin="on"] #v8OrdersKpi{margin-bottom:12px !important}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpis{
  height: 52px !important; min-height:52px !important; max-height:52px !important;
  background:#fff !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important;
  gap: 0 !important;
  margin: 0 !important;
}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi{
  height: 52px !important; padding: 0 16px !important;
  border-right: 1px solid var(--ds-border-2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  display:flex !important; align-items:baseline !important; gap:8px !important;
}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi:last-child{border-right:0 !important}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi-l{font-size:13px !important;font-weight:400 !important;color:var(--ds-text-2)!important}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi-v{
  font-size:18px !important; font-weight:600 !important; color:var(--ds-text) !important;
  font-variant-numeric: tabular-nums; font-feature-settings:"tnum" 1;
}
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi-s{font-size:12px !important;color:var(--ds-text-3)!important}

/* ==========================================================================
 * ⑥ 筛选区 —— 34px 单行工具条 -> 白底卡片 · 两行 · label 90px 右对齐
 *   布局：由 admin_v8_skin.js 插入一个 .ds-flt-break 强制换行（纯布局元素）
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders .orders-filter-bar{
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px 14px !important;
  height: auto !important; min-height: 0 !important; max-height: none !important;
  padding: 16px !important;
  margin: 0 0 12px !important;
  background: #fff !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .ds-flt-break{
  flex: 0 0 100% !important; width: 100% !important; height: 0 !important; margin: 0 !important; padding: 0 !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group{
  display: flex !important; flex-direction: row !important; align-items: center !important;
  gap: 0 !important; margin: 0 !important; min-width: 0 !important;
  flex: 0 0 auto !important; height: 32px !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > label{
  flex: 0 0 90px !important; width: 90px !important;
  text-align: right !important;
  padding: 0 10px 0 0 !important;
  font-size: 13px !important; font-weight: 400 !important;
  color: var(--ds-text-2) !important;
  line-height: 32px !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
  letter-spacing: 0 !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar input,
html[data-ds-skin="on"] #page-orders .orders-filter-bar select{
  height: 32px !important; min-height: 32px !important;
  padding: 0 10px !important;
  font-size: 13px !important; line-height: 30px !important; font-weight: 400 !important;
  color: var(--ds-text) !important;
  background: #fff !important;
  border: 1px solid var(--ds-border) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  width: auto !important;
  margin: 0 !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar input:focus,
html[data-ds-skin="on"] #page-orders .orders-filter-bar select:focus{
  border-color: var(--ds-primary) !important;
  box-shadow: 0 0 0 2px rgba(22,119,255,.10) !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar input::placeholder{color:var(--ds-text-3)!important}
/* 宽度按内容，✗ 不铺满 */
html[data-ds-skin="on"] #page-orders #ordKw{width:220px !important}
html[data-ds-skin="on"] #page-orders #ordStatus,
html[data-ds-skin="on"] #page-orders #ordType{width:120px !important}
html[data-ds-skin="on"] #page-orders #ordProductId{width:160px !important}
html[data-ds-skin="on"] #page-orders #ordVersionId{width:200px !important}
html[data-ds-skin="on"] #page-orders #ordDateFrom,
html[data-ds-skin="on"] #page-orders #ordDateTo{width:130px !important}

/* 行末：查询（蓝实心+放大镜） / 重置（白底+循环图标） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions{
  order: 2 !important;
  margin-left: 0 !important;
  display: flex !important; gap: 8px !important; align-items: center !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn{height:32px !important}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn svg{width:14px;height:14px}
/* 今天/本周/本月 + 口径说明：排到"查询/重置"前面，并靠右 */
html[data-ds-skin="on"] #page-orders #v8OrdPresets{
  order: 1 !important;
  margin-left: auto !important;
  display: flex !important; align-items: center !important; gap: 6px !important;
}
html[data-ds-skin="on"] #page-orders #v8OrdPresets .v8-btn{
  height: 28px !important; min-height:28px !important; padding: 0 10px !important; font-size: 12px !important;
}
html[data-ds-skin="on"] #page-orders .v8-caliber{font-size:12px !important;color:var(--ds-text-3)!important}
html[data-ds-skin="on"] #page-orders .v8-caliber:hover{color:var(--ds-primary)!important}

/* ==========================================================================
 * ⑦ 表格 —— 行高 32 -> 40px · 表头浅灰 · 只留极淡横线 · 字号 13px
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders .v8-tbl{
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #fff !important;
}
html[data-ds-skin="on"] #page-orders .v8-tbl thead th{
  height: 40px !important;
  padding: 0 12px !important;
  background: var(--ds-th) !important;
  color: #4e5969 !important;            /* 深灰字 */
  font-size: 13px !important; font-weight: 500 !important;
  line-height: 1.4 !important;
  text-align: left !important;
  letter-spacing: 0 !important;
  border-bottom: 1px solid var(--ds-border) !important;
  border-right: 0 !important;
  border-top: 0 !important;
  white-space: nowrap !important;
}
html[data-ds-skin="on"] #page-orders .v8-tbl tbody td{
  height: 40px !important;
  padding: 0 12px !important;
  font-size: 13px !important; font-weight: 400 !important;
  color: var(--ds-text) !important;
  line-height: 1.5 !important;          /* ★ 无单位比例：固定 px 会被 .v8-chip 继承 -> 撑高整行 ✗ */
  border-bottom: 1px solid var(--ds-border-2) !important;   /* 只留极淡横线 */
  border-right: 0 !important;                               /* ✗ 无竖线 */
  background: transparent !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}
html[data-ds-skin="on"] #page-orders .v8-tbl tbody tr,
html[data-ds-skin="on"] #page-orders .v8-tbl tbody tr:nth-child(even){
  background: #fff !important;          /* ✗ 去掉斑马纹 */
}
html[data-ds-skin="on"] #page-orders .v8-tbl tbody tr:hover{background: var(--ds-hover) !important}
html[data-ds-skin="on"] #page-orders .v8-tbl tbody tr:last-child td{border-bottom: 0 !important}
html[data-ds-skin="on"] #page-orders .v8-tbl .mono{
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text) !important;
}
html[data-ds-skin="on"] #page-orders .v8-tbl .num{
  text-align: right !important;
  font-variant-numeric: tabular-nums !important; font-feature-settings:"tnum" 1 !important;
  font-weight: 500 !important;
}
html[data-ds-skin="on"] #page-orders .v8-tbl .strong{font-weight:500 !important;color:var(--ds-text)!important}
html[data-ds-skin="on"] #page-orders .v8-tbl td:first-child{color:var(--ds-text-3)!important}
/* 卡片头（订单列表 · 本页 20 条 / 共 22 条） */
html[data-ds-skin="on"] #page-orders .v8-card{
  border: 1px solid var(--ds-border) !important; border-radius: 6px !important;
  box-shadow: none !important; background:#fff !important;
}
html[data-ds-skin="on"] #page-orders .v8-card-h{
  height: 44px !important; padding: 0 16px !important;
  border-bottom: 1px solid var(--ds-border-2) !important;
}
html[data-ds-skin="on"] #page-orders .v8-card-t{font-size:14px !important;font-weight:600 !important;color:var(--ds-text)!important}
html[data-ds-skin="on"] #page-orders .v8-card-t small{font-size:12px !important;font-weight:400 !important;color:var(--ds-text-3)!important}

/* ==========================================================================
 * ⑧ 状态 pill 体系（★★ 客户要求：彩色小标签，同一套）
 *   已支付 = 蓝底白字 ／ 待支付 = 红底白字 ／ 已取消·已退款 = 灰底白字
 *   类型(会员/产品) = 浅底同色字（它跟状态不是一回事，别抢视觉）
 *   ★ 用 #ordersListTab td:nth-child(8) 锁定【明细表的第 8 列=状态列】，
 *     避免误伤同用 .v8-chip-gray 的类型列、以及「订单汇总」子页的其它表格
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td .v8-chip{
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 20px !important; padding: 0 9px !important;
  border: 0 !important; border-radius: 10px !important;
  font-size: 12px !important; font-weight: 400 !important; line-height: 1 !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}
/* 状态列（第 8 列）—— 实心 pill */
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(8) .v8-chip-ok{
  background: var(--ds-primary) !important; color: #fff !important;
}
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(8) .v8-chip-warn{
  background: var(--ds-danger) !important; color: #fff !important;
}
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(8) .v8-chip-gray{
  background: #a9aeb8 !important; color: #fff !important;
}
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(8) .v8-chip-info{
  background: #ff7d00 !important; color: #fff !important;
}
/* 类型列（第 3 列）—— 浅底 pill */
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(3) .v8-chip{
  height: 20px !important; padding: 0 8px !important; border-radius: 4px !important;
  background: #f2f3f5 !important; color: var(--ds-text-2) !important;
}
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl tbody td:nth-child(3) .v8-chip-accent{
  background: #e8f3ff !important; color: var(--ds-primary) !important;
}
/* 状态列宽固定，pill 不换行 */
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl td:nth-child(8),
html[data-ds-skin="on"] #page-orders #ordersListTab .v8-tbl th:nth-child(8){width: 90px !important; white-space: nowrap !important}

/* ==========================================================================
 * ⑧b 「订单汇总」子页（老页面 · .table）—— 同步到 13px / 40px 体系，
 *     免得同一个订单页里出现两套字号（子页逻辑 ✗ 一行没动 ✓）
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders #ordersSummaryTab .table thead th{
  height: 40px !important; padding: 0 12px !important;
  background: var(--ds-th) !important; color: #4e5969 !important;
  font-size: 13px !important; font-weight: 500 !important;
  border-bottom: 1px solid var(--ds-border) !important;
}
html[data-ds-skin="on"] #page-orders #ordersSummaryTab .table tbody td{
  height: 40px !important; padding: 0 12px !important;
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text) !important;
  border-bottom: 1px solid var(--ds-border-2) !important;
}
html[data-ds-skin="on"] #page-orders #ordersSummaryTab .btn{
  height: 32px !important; padding: 0 12px !important; font-size: 13px !important; border-radius: 4px !important;
}
html[data-ds-skin="on"] #page-orders .summary-section-title{
  background: var(--ds-th) !important; background-image: none !important;
  color: var(--ds-text) !important; border-radius: 6px 6px 0 0 !important;
  font-size: 13px !important; font-weight: 500 !important; padding: 10px 16px !important;
}
html[data-ds-skin="on"] #page-orders .kpi-label{font-size:13px !important;font-weight:400 !important;color:var(--ds-text-2)!important}
html[data-ds-skin="on"] #page-orders .kpi-value{font-size:18px !important;font-weight:600 !important;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* ==========================================================================
 * ⑨ 行内操作（⋯ 菜单）—— 24 -> 28px 方形图标按钮 + 浅边
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders .v8-tbl .rowacts{justify-content:flex-end !important}
html[data-ds-skin="on"] #page-orders .v8-ract{
  width: 28px !important; height: 28px !important; flex: 0 0 28px !important;
  border: 1px solid var(--ds-border) !important; border-radius: 4px !important;
  background: #fff !important; color: var(--ds-text-2) !important;
  font-size: 14px !important; line-height: 1 !important;
}
html[data-ds-skin="on"] #page-orders .v8-ract:hover{border-color:var(--ds-primary)!important;color:var(--ds-primary)!important;background:#fff!important}
html[data-ds-skin="on"] #page-orders .v8-rm-it{
  font-size: 13px !important; height: 30px !important; border-radius: 4px !important;
}

/* ==========================================================================
 * ⑩ 分页 —— 挪到右下（页码 + 总数）
 * ========================================================================*/
html[data-ds-skin="on"] #v8OrdersPager{margin-top: 0 !important}
html[data-ds-skin="on"] #page-orders .v8-pager{
  display: flex !important; align-items: center !important; justify-content: flex-end !important;
  gap: 8px !important;
  margin: 12px 0 0 0 !important;
  padding: 0 !important;
  background: transparent !important; border: 0 !important;
}
html[data-ds-skin="on"] #page-orders .v8-pager .v8-pager-i{
  order: 3 !important; margin-left: 4px !important;
  font-size: 13px !important; color: var(--ds-text-2) !important;
}
html[data-ds-skin="on"] #page-orders .v8-pager .v8-btn{order: 1 !important}
html[data-ds-skin="on"] #page-orders .v8-pager .v8-btn[data-v8pg="next"]{order: 2 !important}
html[data-ds-skin="on"] #page-orders .v8-pager .v8-btn{
  height: 30px !important; min-height: 30px !important; padding: 0 12px !important; font-size: 13px !important;
}
html[data-ds-skin="on"] #page-orders .v8-pager .v8-btn[disabled]{
  color: var(--ds-text-3) !important; border-color: var(--ds-border-2) !important; background:#fafafa !important;
}

/* ==========================================================================
 * ⑪ 空态 / 弹层 / 滚动条兜底
 * ========================================================================*/
html[data-ds-skin="on"] #page-orders .v8-empty{padding: 40px 16px !important}
html[data-ds-skin="on"] #page-orders .v8-empty-t{font-size:14px !important;font-weight:500 !important;color:var(--ds-text-2)!important}
html[data-ds-skin="on"] #page-orders .v8-empty-s{font-size:13px !important;color:var(--ds-text-3)!important}
html[data-ds-skin="on"] #page-orders .v8-empty-ico{font-size:28px !important;opacity:.5 !important}

html[data-ds-skin="on"] #page-orders ::-webkit-scrollbar{width:8px;height:8px}
html[data-ds-skin="on"] #page-orders ::-webkit-scrollbar-thumb{background:#d8dbe0;border-radius:4px}
html[data-ds-skin="on"] #page-orders ::-webkit-scrollbar-track{background:transparent}

/* ============================================================================
 * §12 全站铺开（第二步，2026-10-05）—— 把订单页那套视觉语言铺到其余 11 页
 * ----------------------------------------------------------------------------
 * 前提：admin_v8_skin.js 里 DS_PAGES_ONLY 改成 [] 后，闸门 html[data-ds-skin="on"] 全站为真。
 * 原则：
 *   ① 只统一「形状 / 字号 / 间距 / 颜色」✗ 不动任何布局语义、不动 JS
 *   ② 订单页原有 #page-orders 规则特异性更高 -> 依然优先 ✓（这段不会把它改坏）
 *   ③ ★ 排除 .v8-stv-tbl / .v8-stv-mini（「站点与转化」的多行表/迷你表是客户已认可的
 *      专用设计，行高按内容自适应）✗ 绝不套 40px 固定行高
 *   ④ 状态 pill 的【实心配色】仍只作用于订单页状态列；其它页保留原来的软色语义
 *      （绿=OK/启用、黄=注意、红=危险）—— 这是有意取舍，已写入《后台_已知限制与设计取舍.md》
 * ==========================================================================*/

/* ---- 12.1 通用表格：40px 行高 · 13px · 表头浅灰 · 极淡横线 · ✗ 无竖线 ---- */
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini){
  border-collapse: separate !important; border-spacing: 0 !important; background: #fff !important;
}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) thead th{
  height: 40px !important; padding: 0 12px !important;
  background: var(--ds-th) !important; color: #4e5969 !important;
  font-size: 13px !important; font-weight: 500 !important; line-height: 1.4 !important;
  text-align: left !important; letter-spacing: 0 !important;
  border-bottom: 1px solid var(--ds-border) !important;
  border-top: 0 !important; border-right: 0 !important; white-space: nowrap !important;
}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) tbody td{
  height: 40px !important; padding: 0 12px !important;
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text) !important;
  line-height: 1.5 !important;                     /* ★ 无单位比例，避免被子元素继承成固定高 */
  border-bottom: 1px solid var(--ds-border-2) !important;
  border-right: 0 !important; background: transparent !important;
  white-space: nowrap !important; vertical-align: middle !important;
}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) tbody tr,
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) tbody tr:nth-child(even){
  background: #fff !important;
}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) tbody tr:hover{background: var(--ds-hover) !important}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) tbody tr:last-child td{border-bottom: 0 !important}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) .mono{font-size: 13px !important; font-weight: 400 !important}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) .num{
  text-align: right !important; font-weight: 500 !important;
  font-variant-numeric: tabular-nums !important; font-feature-settings:"tnum" 1 !important;
}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) .strong{font-weight: 500 !important}
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) .empty-row td,
html[data-ds-skin="on"] .v8-tbl:not(.v8-stv-tbl):not(.v8-stv-mini) td.empty{
  height: auto !important; color: var(--ds-text-3) !important; font-size: 13px !important;
}

/* ---- 12.2 老表格 .table（套餐页 / 订单汇总子页 / 用户页旧表）同样收敛 ---- */
html[data-ds-skin="on"] .table thead th{
  height: 40px !important; padding: 0 12px !important;
  background: var(--ds-th) !important; color: #4e5969 !important;
  font-size: 13px !important; font-weight: 500 !important; line-height: 1.4 !important;
  letter-spacing: 0 !important; border-bottom: 1px solid var(--ds-border) !important;
}
html[data-ds-skin="on"] .table tbody td{
  height: 40px !important; padding: 0 12px !important;
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text) !important;
  line-height: 1.5 !important; border-bottom: 1px solid var(--ds-border-2) !important;
  background: transparent !important;
}
html[data-ds-skin="on"] .table tbody tr:hover{background: var(--ds-hover) !important}
html[data-ds-skin="on"] .table tbody tr:last-child td{border-bottom: 0 !important}

/* ---- 12.3 卡片：6px 圆角 · 1px 浅边 · ✗ 无阴影 · 卡头 44px ---- */
html[data-ds-skin="on"] .v8-card{
  background: #fff !important; border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important; box-shadow: none !important;
}
html[data-ds-skin="on"] .v8-card-h{
  min-height: 44px !important; padding: 10px 16px !important;
  border-bottom: 1px solid var(--ds-border-2) !important;
}
html[data-ds-skin="on"] .v8-card-t{font-size: 14px !important; font-weight: 600 !important; color: var(--ds-text) !important}
html[data-ds-skin="on"] .v8-card-t small{font-size: 12px !important; font-weight: 400 !important; color: var(--ds-text-3) !important}
html[data-ds-skin="on"] .v8-card-b{padding: 16px !important}
html[data-ds-skin="on"] .v8-card-b.flush{padding: 0 !important}

/* ---- 12.4 按钮：32px 白底细边 · 主按钮蓝实心 · 图标 14px ---- */
html[data-ds-skin="on"] .v8-btn,
html[data-ds-skin="on"] .btn{
  height: 32px !important; min-height: 32px !important; padding: 0 12px !important;
  font-size: 13px !important; line-height: 30px !important; font-weight: 400 !important;
  border-radius: 4px !important; border: 1px solid var(--ds-border) !important;
  background: #fff !important; color: var(--ds-text) !important; box-shadow: none !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: 5px !important; white-space: nowrap !important;
}
html[data-ds-skin="on"] .v8-btn:hover,
html[data-ds-skin="on"] .btn:hover{border-color: var(--ds-primary) !important; color: var(--ds-primary) !important}
html[data-ds-skin="on"] .v8-btn.sm{height: 28px !important; min-height: 28px !important; padding: 0 10px !important; font-size: 12px !important; line-height: 26px !important}
html[data-ds-skin="on"] .v8-btn-primary,
html[data-ds-skin="on"] .v8-btn.primary,
html[data-ds-skin="on"] .btn-primary{
  background: var(--ds-primary) !important; border-color: var(--ds-primary) !important; color: #fff !important;
}
html[data-ds-skin="on"] .v8-btn-primary:hover,
html[data-ds-skin="on"] .btn-primary:hover{
  background: var(--ds-primary-hover) !important; border-color: var(--ds-primary-hover) !important; color: #fff !important;
}
html[data-ds-skin="on"] .v8-btn svg, html[data-ds-skin="on"] .btn svg{width: 14px; height: 14px; display: block}

/* ---- 12.5 筛选工具条 .v8-toolbar（其余页都是 .v8-filters.v8-toolbar + .v8-f）
 *      ★ 只认 .v8-toolbar；「转化对接设置」里那个内联样式的 .v8-filters
 *        （class 里没有 v8-toolbar）✗ 不受影响、不会被破坏 ✓ ---- */
html[data-ds-skin="on"] .v8-toolbar{
  display: flex !important; flex-wrap: wrap !important; align-items: center !important;
  gap: 12px 14px !important;
  height: auto !important; min-height: 0 !important; max-height: none !important;
  padding: 16px !important; margin: 0 0 12px !important;
  background: #fff !important; border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important; box-shadow: none !important; overflow: visible !important;
}
html[data-ds-skin="on"] .v8-toolbar .v8-f,
html[data-ds-skin="on"] .v8-toolbar .filter-group{
  display: flex !important; flex-direction: row !important; align-items: center !important;
  gap: 0 !important; margin: 0 !important; min-width: 0 !important;
  flex: 0 0 auto !important; height: 32px !important;
}
html[data-ds-skin="on"] .v8-toolbar .v8-f > label,
html[data-ds-skin="on"] .v8-toolbar .filter-group > label{
  flex: 0 0 90px !important; width: 90px !important;
  text-align: right !important; padding: 0 10px 0 0 !important;
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text-2) !important;
  line-height: 32px !important; white-space: nowrap !important;
  overflow: hidden !important; text-overflow: ellipsis !important; letter-spacing: 0 !important;
}
html[data-ds-skin="on"] .v8-toolbar input,
html[data-ds-skin="on"] .v8-toolbar select{
  height: 32px !important; min-height: 32px !important; padding: 0 10px !important;
  font-size: 13px !important; line-height: 30px !important; font-weight: 400 !important;
  color: var(--ds-text) !important; background: #fff !important;
  border: 1px solid var(--ds-border) !important; border-radius: 4px !important;
  box-shadow: none !important; width: auto !important; margin: 0 !important;
}
html[data-ds-skin="on"] .v8-toolbar input:focus,
html[data-ds-skin="on"] .v8-toolbar select:focus{
  border-color: var(--ds-primary) !important; box-shadow: 0 0 0 2px rgba(22,119,255,.10) !important;
}
html[data-ds-skin="on"] .v8-toolbar input[type="text"]{width: 170px !important}
html[data-ds-skin="on"] .v8-toolbar input[type="date"]{width: 140px !important}
html[data-ds-skin="on"] .v8-toolbar .v8-f select{width: 140px !important}
html[data-ds-skin="on"] .v8-toolbar .v8-grow{flex: 1 1 240px !important; min-width: 200px !important}
html[data-ds-skin="on"] .v8-toolbar .v8-grow input[type="text"]{width: 100% !important}
html[data-ds-skin="on"] .v8-toolbar .v8-facts,
html[data-ds-skin="on"] .v8-toolbar .filter-actions{
  margin-left: auto !important; display: flex !important; align-items: center !important; gap: 8px !important;
}
html[data-ds-skin="on"] .v8-toolbar .v8-btn,
html[data-ds-skin="on"] .v8-toolbar .btn{height: 32px !important; min-height: 32px !important; padding: 0 12px !important}

/* ---- 12.6 pill：只统一"形状/字号"（配色保持各页原有语义软色 ✓） ---- */
html[data-ds-skin="on"] .v8-chip{
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 20px !important; padding: 0 9px !important;
  border-radius: 10px !important; font-size: 12px !important; font-weight: 400 !important;
  line-height: 1 !important; vertical-align: middle !important; white-space: nowrap !important;
}
html[data-ds-skin="on"] .v8-chip-accent{border-radius: 4px !important}

/* ---- 12.7 行内操作 ⋯ / 分页（其余页也有） ---- */
html[data-ds-skin="on"] .v8-ract{
  width: 28px !important; height: 28px !important; flex: 0 0 28px !important;
  border: 1px solid var(--ds-border) !important; border-radius: 4px !important;
  background: #fff !important; color: var(--ds-text-2) !important; font-size: 14px !important; line-height: 1 !important;
}
html[data-ds-skin="on"] .v8-ract:hover{border-color: var(--ds-primary) !important; color: var(--ds-primary) !important}
html[data-ds-skin="on"] .v8-rm-it{font-size: 13px !important; height: 30px !important; border-radius: 4px !important}
html[data-ds-skin="on"] .v8-pager{
  display: flex !important; align-items: center !important; justify-content: flex-end !important;
  gap: 8px !important; margin: 12px 0 0 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
}
html[data-ds-skin="on"] .v8-pager .v8-pager-i{order: 3 !important; margin-left: 4px !important; font-size: 13px !important; color: var(--ds-text-2) !important}
html[data-ds-skin="on"] .v8-pager .v8-btn{order: 1 !important; height: 30px !important; min-height: 30px !important; padding: 0 12px !important; font-size: 13px !important}
html[data-ds-skin="on"] .v8-pager .v8-btn[data-v8pg="next"]{order: 2 !important}
html[data-ds-skin="on"] .v8-pager .v8-btn[disabled]{color: var(--ds-text-3) !important; border-color: var(--ds-border-2) !important; background: #fafafa !important}

/* ---- 12.8 KPI 统计条（全站同一条 52px）---- */
html[data-ds-skin="on"] .v8-kpis,
html[data-ds-skin="on"] .kpi-grid{
  height: 52px !important; min-height: 52px !important; max-height: 52px !important;
  background: #fff !important; border: 1px solid var(--ds-border) !important;
  border-radius: 6px !important; gap: 0 !important; margin: 0 0 12px !important;
}
html[data-ds-skin="on"] .v8-kpis .v8-kpi,
html[data-ds-skin="on"] .kpi-grid .kpi{
  height: 52px !important; padding: 0 16px !important;
  border-right: 1px solid var(--ds-border-2) !important; border-radius: 0 !important;
  background: transparent !important; display: flex !important; align-items: baseline !important; gap: 8px !important;
}
html[data-ds-skin="on"] .v8-kpis .v8-kpi:last-child,
html[data-ds-skin="on"] .kpi-grid .kpi:last-child{border-right: 0 !important}
html[data-ds-skin="on"] .v8-kpi-l, html[data-ds-skin="on"] .kpi-label{font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text-2) !important}
html[data-ds-skin="on"] .v8-kpi-v, html[data-ds-skin="on"] .kpi-value{
  font-size: 18px !important; font-weight: 600 !important; color: var(--ds-text) !important;
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}
html[data-ds-skin="on"] .v8-kpi-s, html[data-ds-skin="on"] .kpi-sub{font-size: 12px !important; color: var(--ds-text-3) !important}

/* ---- 12.9 页头 / 空态 / 说明文字 ---- */
html[data-ds-skin="on"] .v8-head{min-height: 34px !important}
html[data-ds-skin="on"] .v8-head h1{font-size: 16px !important; font-weight: 600 !important; color: var(--ds-text) !important}
html[data-ds-skin="on"] .v8-head p{font-size: 12px !important; color: var(--ds-text-3) !important}
html[data-ds-skin="on"] .v8-caliber{font-size: 12px !important; color: var(--ds-text-3) !important}
html[data-ds-skin="on"] .v8-empty-t{font-size: 14px !important; font-weight: 500 !important; color: var(--ds-text-2) !important}
html[data-ds-skin="on"] .v8-empty-s{font-size: 13px !important; color: var(--ds-text-3) !important}
html[data-ds-skin="on"] .v8-wrap{gap: 12px !important}
/* ---- 12.1b 收款账户表 .v8-pacc-tbl（多行单元格设计：只统一字号/底色/线，✗ 不套 40px 行高） ---- */
html[data-ds-skin="on"] .v8-pacc-tbl{
  border-collapse: separate !important; border-spacing: 0 !important; background: #fff !important;
}
html[data-ds-skin="on"] .v8-pacc-tbl thead th{
  height: 40px !important; padding: 0 12px !important;
  background: var(--ds-th) !important; color: #4e5969 !important;
  font-size: 13px !important; font-weight: 500 !important; line-height: 1.4 !important;
  letter-spacing: 0 !important; text-align: left !important;
  border-bottom: 1px solid var(--ds-border) !important; border-top: 0 !important; border-right: 0 !important;
}
html[data-ds-skin="on"] .v8-pacc-tbl tbody td{
  height: auto !important; padding: 10px 12px !important;      /* ★ 保持按内容自适应 */
  font-size: 13px !important; font-weight: 400 !important; color: var(--ds-text) !important;
  line-height: 1.5 !important;
  border-bottom: 1px solid var(--ds-border-2) !important; border-right: 0 !important;
  background: transparent !important; vertical-align: middle !important;
}
html[data-ds-skin="on"] .v8-pacc-tbl tbody tr:hover{background: var(--ds-hover) !important}
html[data-ds-skin="on"] .v8-pacc-tbl tbody tr:last-child td{border-bottom: 0 !important}
html[data-ds-skin="on"] .v8-pacc-tbl .num,
html[data-ds-skin="on"] .v8-pacc-tbl .mono{
  font-variant-numeric: tabular-nums !important; font-feature-settings:"tnum" 1 !important;
}
html[data-ds-skin="on"] .v8-pacc-nm b{font-size: 13px !important}
html[data-ds-skin="on"] .v8-pacc-tbl .v8-chip{height: 20px !important; border-radius: 10px !important; font-size: 12px !important}
/* ---- 12.10 「删除」= 红色实心小按钮（参考图要求；★ 二次确认逻辑一行没动 ✓） ---- */
html[data-ds-skin="on"] [data-pacc-act="del"],
html[data-ds-skin="on"] .v8-link.danger{
  background: var(--ds-danger) !important;
  border: 1px solid var(--ds-danger) !important;
  color: #fff !important;
  height: 28px !important; min-height: 28px !important;
  padding: 0 10px !important; border-radius: 4px !important;
  font-size: 12px !important; font-weight: 400 !important; line-height: 26px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  text-decoration: none !important; white-space: nowrap !important;
}
html[data-ds-skin="on"] [data-pacc-act="del"]:hover,
html[data-ds-skin="on"] .v8-link.danger:hover{
  background: #d92c2c !important; border-color: #d92c2c !important; color: #fff !important;
  text-decoration: none !important;
}
/* 停用/禁用：保持原来的描边红（✗ 不改），只把它收敛到同一档尺寸 */
html[data-ds-skin="on"] [data-pacc-act="disable"],
html[data-ds-skin="on"] [data-pacc-act="enable"]{
  height: 28px !important; min-height: 28px !important; padding: 0 10px !important; font-size: 12px !important;
}

/* ============================================================================
 * §13 左侧栏「层次感」强化（客户反馈：左边层次感不明显）
 *   4 个层级信号 + 1 条引导线 + 分组呼吸；✗ 不改结构/JS，✗ 不加"侧栏与内容区的分隔线"
 * ==========================================================================*/

/* 13.1 侧栏纵深：极淡纵向渐变（#232f3f -> #1f2937 -> #1b2434） */
html[data-ds-skin="on"] .sidebar,
html[data-ds-skin="on"][data-v8-side="gray"] .sidebar,
html[data-ds-skin="on"][data-v8-side="white"] .sidebar{
  background: linear-gradient(180deg, #232f3f 0%, #1f2937 38%, #1b2434 100%) !important;
  border-right: 0 !important;
}
/* 13.2 品牌区与菜单区分开一点（内部极细分隔线，不是侧栏与内容区之间那条 ✗） */
html[data-ds-skin="on"] .sidebar h1.sb-brand{
  height: 46px !important; min-height: 46px !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
html[data-ds-skin="on"] .v8-side-nav{padding: 6px 0 10px !important}

/* 13.3 父级 = 组标题条：更高、更亮、有浅底、组前留呼吸 */
html[data-ds-skin="on"] .v8-nav-par{
  height: 34px !important;
  margin: 12px 8px 4px !important;                 /* ★ 组前 12px -> 一眼看出"新的一组" */
  padding: 0 10px !important;
  background: rgba(255,255,255,.045) !important;
  color: #fff !important;
  font-size: 13px !important; font-weight: 600 !important;
  border-radius: 5px !important;
  letter-spacing: .2px !important;
}
html[data-ds-skin="on"] .v8-side-nav > .v8-nav-par:first-child{margin-top: 2px !important}
html[data-ds-skin="on"] .v8-nav-par:hover{background: rgba(255,255,255,.09) !important}
html[data-ds-skin="on"] .v8-nav-par .v8-par-ic{color: rgba(255,255,255,.85) !important}
html[data-ds-skin="on"] .v8-nav-par .v8-par-cv{color: rgba(255,255,255,.35) !important; font-size: 9px !important}

/* 13.4 当前页所在父级：蓝色浅底 + 左侧 3px 蓝竖条 + 图标变蓝 */
html[data-ds-skin="on"] .v8-nav-par.onpath{
  background: rgba(22,119,255,.16) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 0 var(--ds-primary) !important;
}
html[data-ds-skin="on"] .v8-nav-par.onpath .v8-par-ic{color: #7bb8ff !important}
html[data-ds-skin="on"] .v8-nav-par.onpath .v8-par-cv{color: rgba(123,184,255,.8) !important}

/* 13.5 子级组：左侧竖向引导线（位置 = 父级图标中心 26px） */
html[data-ds-skin="on"] .v8-nav-sub{position: relative !important}
html[data-ds-skin="on"] .v8-nav-sub::before{
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 26px !important; top: 1px !important; bottom: 1px !important;
  width: 1px !important;
  background: rgba(255,255,255,.13) !important;
}

/* 13.6 子级：比父级矮一点、暗一档、缩进更明显、图标更小 */
html[data-ds-skin="on"] #v8SideNav .nav-item{
  height: 30px !important;
  margin: 1px 8px !important;
  padding: 0 8px 0 26px !important;                /* 图标落在 34px，文字 56px */
  border-radius: 5px !important;
  color: rgba(255,255,255,.60) !important;
  font-size: 13px !important; font-weight: 400 !important;
  gap: 8px !important;
}
html[data-ds-skin="on"] #v8SideNav .nav-item:hover{
  background: rgba(255,255,255,.07) !important; color: #fff !important; padding-left: 26px !important;
}
html[data-ds-skin="on"] #v8SideNav .nav-item > .ds-nav-ic{color: rgba(255,255,255,.45) !important}
html[data-ds-skin="on"] #v8SideNav .nav-item:hover > .ds-nav-ic{color: rgba(255,255,255,.85) !important}
html[data-ds-skin="on"] #v8SideNav .nav-item > .ds-nav-ic svg{width: 13px !important; height: 13px !important}
html[data-ds-skin="on"] .v8-nav-par .ds-nav-ic svg{width: 16px !important; height: 16px !important}

/* 13.7 选中子项：保持蓝色实心块（客户点名），只把圆角/阴影做得更像"抬起" */
html[data-ds-skin="on"] #v8SideNav .nav-item.active,
html[data-ds-skin="on"][data-v8-side="gray"] #v8SideNav .nav-item.active{
  background: var(--ds-primary) !important; color: #fff !important;
  border-radius: 5px !important; font-weight: 500 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.22) !important;
}
html[data-ds-skin="on"] #v8SideNav .nav-item.active > .ds-nav-ic{color: #fff !important}

/* 13.8 侧栏底部：压暗一档，和菜单区分层 */
html[data-ds-skin="on"] .v8-side-foot{
  border-top: 1px solid rgba(255,255,255,.06) !important;
  background: rgba(0,0,0,.10) !important;
}

/* ============================================================================
 * §14 修「文案没居中在框里」（客户反馈）—— 定位方式见 patch_skin_center.py 头部说明
 * ==========================================================================*/

/* 14.1 ★★ KPI 统计条：基线对齐(贴顶) -> 垂直居中
 *   40px 时 text 20px 看不出问题；加到 52px 后偏了 16.8px ✗ 全站 66 处
 *   ★ 订单页那条 (#v8OrdersKpi) 在 §5 里也写死了 baseline，必须一起覆盖 ↓ */
html[data-ds-skin="on"] .v8-kpis .v8-kpi,
html[data-ds-skin="on"] .kpi-grid .kpi,
html[data-ds-skin="on"] #v8OrdersKpi .v8-kpi{
  align-items: center !important;
}
html[data-ds-skin="on"] .v8-kpi-l,
html[data-ds-skin="on"] .v8-kpi-v,
html[data-ds-skin="on"] .v8-kpi-s,
html[data-ds-skin="on"] .kpi-label,
html[data-ds-skin="on"] .kpi-value,
html[data-ds-skin="on"] .kpi-sub{
  line-height: 1.25 !important;      /* ✗ 不要让 20.15px 的继承行高把基线算歪 */
}

/* 14.2 活动 Banner 预览手机里的 tab 行：下内边距 8px 把文字顶高了 -> 归零并垂直居中 */
html[data-ds-skin="on"] .v8-bn-nav{
  padding-bottom: 0 !important;
  align-items: center !important;
}

/* 14.3 legacy 卡片头（.card-header/.card-title，用于总览"产品分布"、落地页卡片）
 *   实测：emoji 字形把 .card-title 的行盒撑到 40px -> 卡片头变 60px 高、标题看起来高 7.4px ✗
 *   修：定住行高 1.3 + 头最小高 44px -> 标题落在正中 ✓（✗ 不动任何内容/结构） */
html[data-ds-skin="on"] .card-header{
  min-height: 44px !important;
  margin-bottom: 12px !important;
  align-items: center !important;
}
html[data-ds-skin="on"] .card-title{
  line-height: 1.3 !important;
  min-height: 0 !important;
  align-items: center !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* ============================================================================
 * §15 emoji 字形盒子（修"带 emoji 的文字看着没居中"）
 *   实测：Windows emoji 字体的度量会把外层行盒撑高 6~8px，改 line-height 无效 ✗
 *   -> 把 emoji 包进 .ds-em（inline-block + 固定 1.2em 行盒 + vertical-align 定值），
 *      emoji 的度量就不再参与外层行盒计算 ✓（由 admin_v8_skin.js 自动包，幂等）
 * ==========================================================================*/
html[data-ds-skin="on"] .ds-em{
  display: inline-block !important;
  width: 1.2em !important; height: 1.2em !important;
  line-height: 1.2em !important;
  font-size: 1em !important;
  vertical-align: -0.2em !important;
  text-align: center !important;
  overflow: visible !important;      /* 字形可以略微溢出，但不影响行盒 */
}

/* 15b legacy 卡片标题：去掉那条 14px 下内边距
 *   实测：.card-title{padding-bottom:14px} 把外框垫到 33px，文字在 18px 内容盒里本来是居中的
 *   -> 墨迹看着比外框中心高 7px ✗（✗ 与 emoji 无关 —— 先前判断在这一处错了，此处更正）
 *   间距改由 .card-header 的 margin-bottom 负责 ✓ */
html[data-ds-skin="on"] .card-title{
  padding: 0 !important;
  border-bottom: 0 !important;
}

/* ============================================================================
 * §16 订单筛选区：两行 -> 一行（客户反馈「排列很丑，弄成一行吧」）
 *   ★ 实测：容器可用宽 1414px，两行合计约 2111px；主因是 7 个 90px 固定 label = 630px ✗
 *   改法：label 内联紧凑 + 字段组 flex 可伸缩（自动分配剩余宽度，✗ 不溢出、✗ 不留大缝）
 *   ✗ 不动任何 id / 输入框 / select / 查询逻辑 ✓
 * ==========================================================================*/
html[data-ds-skin="on"] #page-orders .orders-filter-bar{
  flex-wrap: nowrap !important;              /* ★ 一行 */
  gap: 8px 10px !important;
  padding: 12px 16px !important;
  align-items: center !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .ds-flt-break{display: none !important}

/* 字段组：可伸缩（按内容给不同权重，剩余空间自动分掉） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group{
  display: flex !important; align-items: center !important;
  height: 32px !important; min-width: 0 !important; gap: 6px !important;
  flex: 1 1 120px !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-kw{flex: 1.5 1 180px !important}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-ver{flex: 1.2 1 140px !important}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-date{flex: 0 1 auto !important}

/* label：内联紧凑（✗ 不再 90px 定宽右对齐） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > label{
  flex: 0 0 auto !important; width: auto !important; min-width: 0 !important;
  padding: 0 !important; text-align: left !important;
  font-size: 12px !important; color: var(--ds-text-3) !important;
  line-height: 32px !important; white-space: nowrap !important;
  overflow: visible !important; text-overflow: clip !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > label.ds-hide{display: none !important}

/* 输入框/下拉：吃掉 label 之外的剩余宽度 */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > input,
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > select{
  flex: 1 1 auto !important; width: auto !important; min-width: 0 !important;
}
/* 日期：固定窄宽度（不参与拉伸，免得占掉别人的空间） */
html[data-ds-skin="on"] #page-orders #ordDateFrom,
html[data-ds-skin="on"] #page-orders #ordDateTo{
  flex: 0 0 108px !important; width: 108px !important;
}
html[data-ds-skin="on"] #page-orders .ds-date-sep{
  flex: 0 0 auto !important; color: var(--ds-text-3) !important;
  font-size: 12px !important; line-height: 32px !important; padding: 0 2px !important;
}
/* 「今天/本周/本月」并到时间后面（紧凑一档） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets{
  order: 0 !important; margin-left: 2px !important;
  display: flex !important; align-items: center !important; gap: 4px !important;
  flex: 0 0 auto !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets .v8-btn{
  height: 28px !important; min-height: 28px !important;
  padding: 0 7px !important; font-size: 12px !important;
}
/* 行末：查询/重置靠右；口径说明跟在最后 */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions{
  order: 9 !important; margin-left: auto !important; flex: 0 0 auto !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn{
  height: 32px !important; padding: 0 9px !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .v8-caliber{order: 10 !important; flex: 0 0 auto !important}

/* 窄屏兜底：真放不下就回到折行（✗ 不出现横向滚动条） */
@media (max-width: 1460px){
  html[data-ds-skin="on"] #page-orders .orders-filter-bar{flex-wrap: wrap !important}
}

/* 16b 收尾：ⓘ 口径说明只留图标（完整说明在 title 悬浮提示里 ✓ 信息不丢），
 *     把省下的 ~70px 还给输入框（实测一行里"订单号/手机"输入框被挤到只剩 106px ✗） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .v8-caliber{
  max-width: 1.15em !important; overflow: hidden !important;
  white-space: nowrap !important; cursor: help !important;
  font-size: 13px !important; color: var(--ds-text-3) !important;
}

/* 16c 日期框 108px 会截断 "2026/10/01"+日历图标（实测截断 ✗）-> 加宽到 124px，
 *     差额从"间距/预设按钮/操作按钮/版本权重"里省出来（✗ 未改任何文案） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar{gap: 8px 6px !important}
html[data-ds-skin="on"] #page-orders #ordDateFrom,
html[data-ds-skin="on"] #page-orders #ordDateTo{
  flex: 0 0 124px !important; width: 124px !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets .v8-btn{padding: 0 6px !important}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn{padding: 0 8px !important}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-ver{flex: 1.1 1 130px !important}

/* ============================================================================
 * §17 日期框：点【整个框】就能弹出日期选择器（客户：那个小图标按钮太小了）
 *    native 只在右边小日历图标上才开 ✗ -> 由 admin_v8_skin.js 绑 click + showPicker()
 *    这里只负责"看起来可点"：手型光标 + 给整框一点可点提示
 * ==========================================================================*/
html[data-ds-skin="on"] #page-orders #ordDateFrom,
html[data-ds-skin="on"] #page-orders #ordDateTo{
  cursor: pointer !important;
}
/* 预设按钮放大一档（上一版压到 28px/6px 内边距偏小） */
html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets .v8-btn{
  height: 30px !important; min-height: 30px !important;
  padding: 0 8px !important; font-size: 12px !important;
}


/* ============================================================================
 * §18 ★ 侧栏「悬浮岛」 —— 客户 2026-10-07 要求
 *   圆角卡片 + 离边留白 + 阴影强调层级
 * ----------------------------------------------------------------------------
 *   ★ 纯外观改动：不动任何 id / class / data-* / DOM 结构 / JS
 *     切页(showPage) / 父级折叠(v8-nav-par, 落盘 csdmxx_adm_nav_collapsed_v1)
 *     / 当前项高亮(.nav-item.active / .v8-nav-par.onpath) 逻辑零接触 ✓
 *   ★ 只作用于 html[data-ds-skin="on"]（皮肤关掉即完全回到旧样子 = 天然退路 ✓）
 *   ★ 只在 ≥1025px 生效：≤1024px 侧栏是抽屉(.sidebar 走 translateX(-100%))，
 *     保持贴边不做成岛，避免把抽屉做成一条悬空的缝 ✗
 * ----------------------------------------------------------------------------
 *   岛外轨道 176 -> 196px：岛内净宽仍是 176px（侧栏文案一行都不用重排 ✓）
 *     .main{margin-left} 与 .v7-topbar{left} 都取 var(--v7-sidebar-width)
 *     -> 内容区自动让出 10(左) + 10(右) = 20px，不需要改第二处 ✓
 * ==========================================================================*/
@media (min-width: 1025px) {

  /* ① 岛外轨道加宽：左留白 10 + 岛 176 + 右留白 10 = 196 */
  html[data-ds-skin="on"] { --v7-sidebar-width: 196px; }

  /* ② 侧栏 = 悬浮岛（圆角 + 四边留白 + 投影分层） */
  html[data-ds-skin="on"] .sidebar,
  html[data-ds-skin="on"][data-v8-side="gray"] .sidebar,
  html[data-ds-skin="on"][data-v8-side="white"] .sidebar {
    left: 10px !important;
    top: 10px !important;
    bottom: 10px !important;
    height: auto !important;            /* 高度交给 top/bottom -> 上下各留白 10px */
    min-height: 0 !important;
    width: 176px !important;
    border-radius: 12px !important;
    border-right: 0 !important;         /* 客户口径：岛与内容区之间不要分隔线，用影子表达层级 */
    overflow: hidden !important;        /* 圆角裁切内部（导航滚动区照旧可滚 ✓） */
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .06),          /* 顶边极细高光：坐实"抬起"的实感 */
      0 14px 30px -12px rgba(15, 23, 42, .55),         /* 主投影：说明岛在内容区之上 */
      0 4px 10px -4px rgba(15, 23, 42, .30) !important;/* 贴地投影：边缘不糊 */
  }
}

/* ============================================================================
 * §19 ★ 产品栏 ①② 业务线徽标（客户 2026-10-07：「产品栏那里很多重复的软件」）
 *   根因：AutoCAD / 3ds Max / Maya / Office 在 products 表里各有 2 行（标题一字不差），
 *         因为一个软件有【两条业务线】：
 *           app_id 不带 -off = ① 下载安装包线（install_type=remote）
 *           app_id 带  -off = ② 官方包部署+发账号线（install_type=semi）
 *   做法：只给产品栏/下拉项加一个 ①② 徽标 + 悬停全称。✗ 不动数据、不动 app_id、不动接口 ✓
 *   退路：删掉本段 + features.js 里的 swLineOf 调用即回到原样 ✓
 * ==========================================================================*/
.v8-swlist .v8-swchip{max-width:196px}
.v8-swlist .v8-swchip .nm{max-width:118px}
.v8-swlist .v8-swchip .ln,
.v8-psel-list .v8-psel-it .ln{
  flex:0 0 auto; font-size:9.5px; font-weight:700; line-height:15px; padding:0 4px;
  border-radius:7px; background:rgba(0,0,0,.06); color:var(--v8-text-2);
}
.v8-swlist .v8-swchip.on .ln{background:rgba(9,105,218,.16); color:var(--v8-accent)}
.v8-psel-list .v8-psel-it.on .ln{background:rgba(9,105,218,.16); color:var(--v8-accent)}
/* §19b ★ ①② 徽标按业务线着色（① 下载安装包线 = 蓝 / ② 官方包部署+发账号线 = 琥珀）
   —— 让两条线在截图里一眼分得开，不用悬停 ✓ */
.v8-swlist .v8-swchip .ln-dl,
.v8-psel-list .v8-psel-it .ln-dl{background:rgba(9,105,218,.12); color:#0a58ca}
.v8-swlist .v8-swchip .ln-off,
.v8-psel-list .v8-psel-it .ln-off{background:rgba(154,103,0,.15); color:#9a6700}
.v8-swlist .v8-swchip.on .ln-dl{background:rgba(9,105,218,.20); color:var(--v8-accent)}
.v8-swlist .v8-swchip.on .ln-off{background:rgba(154,103,0,.22); color:#8a5b00}

/* ============================================================================
 * §20 ★★ 「软件与版本」页重设计（方向 B · 左侧产品栏）—— 2026-10-07
 * ----------------------------------------------------------------------------
 * 作用域：html[data-v8-srail="on"] #softwareFocus
 *   （该属性由 admin_v8_features.js 在左栏生效时挂上；删掉属性 = 立刻回到旧布局 ✓）
 * 依据（实测 _adm_island/ui_audit.json）：
 *   · 字重 600 占 48% / 字号 13 档 / 投影 1~2 种 / 字体栈首项在 Windows 不生效
 * 内容：① 令牌（墨色·表面·高度·圆角·间距）② 排版三级 ③ 左栏 ④ 产品头
 *       ⑤ 统计带 ⑥ 版本表 ⑦ 空态 ⑧ 图标（平台/家族=文字徽章，操作=内联 SVG）
 * 退路：localStorage['csdmxx_adm_sw_rail_off']='1' + 刷新 ✓
 * ==========================================================================*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：html[data-v8-srail="on"] #softwareFocus（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

html[data-v8-srail="on"] #softwareFocus {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
  display: flex; flex-direction: column; gap: 0;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
html[data-v8-srail="on"] #softwareFocus, html[data-v8-srail="on"] #softwareFocus * { font-weight: 400 !important; letter-spacing: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .pfh-title, html[data-v8-srail="on"] #softwareFocus .v8-card-t, html[data-v8-srail="on"] #softwareFocus .v8-kpi-v,
html[data-v8-srail="on"] #softwareFocus .ui-strong { font-weight: 600 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl thead th, html[data-v8-srail="on"] #softwareFocus .v8-swchip, html[data-v8-srail="on"] #softwareFocus .ui-pitem,
html[data-v8-srail="on"] #softwareFocus .v8-tbl td strong, html[data-v8-srail="on"] #softwareFocus .ui-btn, html[data-v8-srail="on"] #softwareFocus .ui-plat,
html[data-v8-srail="on"] #softwareFocus .v8-pitem-fam, html[data-v8-srail="on"] #softwareFocus .ui-fchip { font-weight: 500 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-swchip.on, html[data-v8-srail="on"] #softwareFocus .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
html[data-v8-srail="on"] #softwareFocus .v8-swlist, html[data-v8-srail="on"] #softwareFocus .v8-swlist * { font-size: var(--fs-12) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-swlist-lb b { font-size: var(--fs-12) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-swchip { font-size: var(--fs-12) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-swchip .bd, html[data-v8-srail="on"] #softwareFocus .v8-swchip .ln { font-size: 10px !important; }
html[data-v8-srail="on"] #softwareFocus .pfh-title { font-size: var(--fs-16) !important; }
html[data-v8-srail="on"] #softwareFocus .pfh-meta, html[data-v8-srail="on"] #softwareFocus .v8-caliber, html[data-v8-srail="on"] #softwareFocus .v8-card-t small,
html[data-v8-srail="on"] #softwareFocus .v8-empty-s, html[data-v8-srail="on"] #softwareFocus .ui-inline-note { font-size: var(--fs-12) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-line, html[data-v8-srail="on"] #softwareFocus .ui-plat, html[data-v8-srail="on"] #softwareFocus .v8-kpi-l,
html[data-v8-srail="on"] #softwareFocus .v8-kpi-s, html[data-v8-srail="on"] #softwareFocus .v8-tbl thead th, html[data-v8-srail="on"] #softwareFocus .ui-fam,
html[data-v8-srail="on"] #softwareFocus .v8-help { font-size: var(--fs-11) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-kpi-v { font-size: var(--fs-16) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-card-t { font-size: var(--fs-16) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl tbody td, html[data-v8-srail="on"] #softwareFocus .ui-btn, html[data-v8-srail="on"] #softwareFocus .v8-psel-btn,
html[data-v8-srail="on"] #softwareFocus .v8-psel-it, html[data-v8-srail="on"] #softwareFocus .v8-psel-search, html[data-v8-srail="on"] #softwareFocus .v8-empty-t,
html[data-v8-srail="on"] #softwareFocus .ui-pitem, html[data-v8-srail="on"] #softwareFocus .ui-fchip { font-size: var(--fs-13) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-psel-it .bd, html[data-v8-srail="on"] #softwareFocus .ui-pitem .bd, html[data-v8-srail="on"] #softwareFocus .ui-fchip b { font-size: var(--fs-11) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem .ln { font-size: 10px !important; }
html[data-v8-srail="on"] #softwareFocus .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
html[data-v8-srail="on"] #softwareFocus .bd, html[data-v8-srail="on"] #softwareFocus .v8-kpi-v, html[data-v8-srail="on"] #softwareFocus .v8-caliber,
html[data-v8-srail="on"] #softwareFocus .v8-tbl td, html[data-v8-srail="on"] #softwareFocus .v8-tbl th, html[data-v8-srail="on"] #softwareFocus .ui-pitem .bd,
html[data-v8-srail="on"] #softwareFocus .ui-grp-hd .n, html[data-v8-srail="on"] #softwareFocus .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
html[data-v8-srail="on"] #softwareFocus .ui-btn,
html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn,
html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
html[data-v8-srail="on"] #softwareFocus .ui-btn:hover,
html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-btn:active { transform: translateY(1px); }
html[data-v8-srail="on"] #softwareFocus .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
html[data-v8-srail="on"] #softwareFocus .ui-btn-pri,
html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-btn-pri:hover,
html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
html[data-v8-srail="on"] #softwareFocus .ui-btn svg, html[data-v8-srail="on"] #softwareFocus .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
html[data-v8-srail="on"] #softwareFocus .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
html[data-v8-srail="on"] #softwareFocus .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
html[data-v8-srail="on"] #softwareFocus .product-focus-header .back-btn { display: none !important; }
html[data-v8-srail="on"] #softwareFocus .product-focus-header .big-icon,
html[data-v8-srail="on"] #softwareFocus .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
html[data-v8-srail="on"] #softwareFocus .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
html[data-v8-srail="on"] #softwareFocus .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
html[data-v8-srail="on"] #softwareFocus .pfh-meta { color: var(--ink-3) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
html[data-v8-srail="on"] #softwareFocus .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
html[data-v8-srail="on"] #softwareFocus .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
html[data-v8-srail="on"] #softwareFocus .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
html[data-v8-srail="on"] #softwareFocus #v8SwKpi { margin: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
html[data-v8-srail="on"] #softwareFocus .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
html[data-v8-srail="on"] #softwareFocus .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
html[data-v8-srail="on"] #softwareFocus .v8-swtbl-h, html[data-v8-srail="on"] #softwareFocus .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
html[data-v8-srail="on"] #softwareFocus .v8-card-t small { color: var(--ink-3) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-caliber { color: var(--ink-3) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
html[data-v8-srail="on"] #softwareFocus .v8-tbl { width: 100%; border-collapse: collapse !important; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
html[data-v8-srail="on"] #softwareFocus .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl td:first-child, html[data-v8-srail="on"] #softwareFocus .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
html[data-v8-srail="on"] #softwareFocus .v8-tbl td.ui-num, html[data-v8-srail="on"] #softwareFocus .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
html[data-v8-srail="on"] #softwareFocus .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
html[data-v8-srail="on"] #softwareFocus .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
html[data-v8-srail="on"] #softwareFocus .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
html[data-v8-srail="on"] #softwareFocus .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
html[data-v8-srail="on"] #softwareFocus .v8-empty-t { color: var(--ink-1) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
html[data-v8-srail="on"] #softwareFocus .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ---- 左栏主从布局（= 预览 B.css）---- */
/* ============================================================================
 * 方案 B ·「左侧产品栏 + 右侧工作区」（主从布局）
 *   27 个产品从顶部搬进左栏：顶部零堆积；切换 = 左栏扫读（按家族分组 + 版本数 + 搜索）
 *   右侧只留：产品头（身份 + 操作）→ 统计带 → 版本表
 * ==========================================================================*/

html[data-v8-srail="on"] #softwareFocus {
  display: grid !important;
  grid-template-columns: 236px minmax(0, 1fr);
  gap: var(--sp-5);
  align-items: start;
  padding-top: var(--sp-4);
  flex-direction: row !important;
}
html[data-v8-srail="on"] #softwareFocus .v8-swlist { display: none !important; }   /* 顶部 chip 云退役 */
html[data-v8-srail="on"] #softwareFocus > .ui-work { min-width: 0; display: flex; flex-direction: column; }

/* ---- 左栏 ---- */
html[data-v8-srail="on"] #softwareFocus .ui-prod {
  position: sticky; top: 0;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-3); box-shadow: var(--e1); overflow: hidden;
}
html[data-v8-srail="on"] #softwareFocus .ui-prod-hd {
  display: flex; align-items: center; justify-content: space-between;
  height: 40px; padding: 0 var(--sp-3); border-bottom: 1px solid var(--line-2);
}
html[data-v8-srail="on"] #softwareFocus .ui-prod-hd h2 { font-size: var(--fs-12) !important; font-weight: 600 !important; color: var(--ink-1) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-prod-hd span { color: var(--ink-3) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-prod-search {
  display: flex !important; align-items: center !important; gap: 6px;
  margin: var(--sp-2) var(--sp-2) var(--sp-1); padding: 0 var(--sp-2);
  height: 30px; border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface-2);
}
html[data-v8-srail="on"] #softwareFocus .ui-prod-search svg { width: 14px; height: 14px; flex: 0 0 14px; stroke: var(--ink-3); fill: none; stroke-width: 1.6; }
html[data-v8-srail="on"] #softwareFocus .ui-prod-search input {
  flex: 1; min-width: 0; border: 0; background: transparent; outline: none;
  font: 400 var(--fs-12)/1 var(--ui-font); color: var(--ink-1);
}
html[data-v8-srail="on"] #softwareFocus .ui-prod-search input::placeholder { color: var(--ink-3); }
html[data-v8-srail="on"] #softwareFocus .ui-prod-body { max-height: 566px; overflow-y: auto; padding: var(--sp-1) 0 var(--sp-2); }

html[data-v8-srail="on"] #softwareFocus .ui-grp { padding-top: var(--sp-1); }
html[data-v8-srail="on"] #softwareFocus .ui-grp-hd {
  display: flex !important; align-items: center !important; gap: 6px;
  padding: var(--sp-1) var(--sp-3) 2px; color: var(--ink-3) !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-grp-hd .ui-fam { width: 15px; height: 15px; flex: 0 0 15px; font-size: 8.5px !important; }
html[data-v8-srail="on"] #softwareFocus .ui-grp-hd .n { margin-left: auto; }

html[data-v8-srail="on"] #softwareFocus .ui-pitem {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  width: calc(100% - 8px); margin: 1px 4px; height: 30px; padding: 0 var(--sp-2) 0 var(--sp-3) !important;
  border: 0 !important; border-radius: var(--r-2) !important; background: transparent !important;
  color: var(--ink-1) !important; text-align: left; cursor: pointer; position: relative;
  transition: background-color .15s ease-out, color .15s ease-out;
}
html[data-v8-srail="on"] #softwareFocus .ui-pitem .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem .ln {
  flex: 0 0 auto; height: 15px; line-height: 15px; padding: 0 4px; border-radius: 7px;
  background: rgba(0, 0, 0, .05); color: var(--ink-3) !important;
}
html[data-v8-srail="on"] #softwareFocus .ui-pitem .ln-dl { background: rgba(11, 95, 208, .12); color: #0B5FD0 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem .ln-off { background: rgba(183, 121, 31, .15); color: #8A5A12 !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem .bd { flex: 0 0 auto; min-width: 16px; text-align: right; color: var(--ink-3) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem:hover { background: var(--surface-3) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem.on { background: var(--accent-soft) !important; color: var(--ink-accent) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem.on .bd { color: var(--ink-accent) !important; }
html[data-v8-srail="on"] #softwareFocus .ui-pitem.on::before {
  content: ""; position: absolute; left: 0; top: 6px; bottom: 6px;
  width: 2px; border-radius: 0 2px 2px 0; background: var(--accent);
}
html[data-v8-srail="on"] #softwareFocus .ui-pitem:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

/* ---- 右栏节奏：产品头 → 统计带 → 表格（不要再额外加间距）---- */
html[data-v8-srail="on"] #softwareFocus > .ui-work > * + * { margin-top: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .product-focus-header { padding-top: 0 !important; }
html[data-v8-srail="on"] #softwareFocus .v8-psel { display: none !important; }   /* 左栏就是选择器，去掉重复入口 */


/* ---- 行级操作图标（内联 SVG）与图标基线 ---- */
html[data-v8-srail="on"] #softwareFocus .v8-ract svg,
html[data-v8-srail="on"] #softwareFocus .v8-rm-it svg,
html[data-v8-srail="on"] #softwareFocus .v8-rm-btn svg {
  width: 14px; height: 14px; display: block; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
html[data-v8-srail="on"] #softwareFocus .ui-back { color: var(--ink-2) !important; }
html[data-v8-srail="on"] #softwareFocus .v8-ract {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  height: 28px; min-width: 28px; padding: 0 6px; border-radius: var(--r-2);
  border: 1px solid transparent; background: transparent; color: var(--ink-3) !important;
  cursor: pointer;
}
html[data-v8-srail="on"] #softwareFocus .v8-ract:hover { background: var(--surface-3); color: var(--ink-1) !important; }

/* §20b 收尾：数字列（价格）右对齐 + 等宽；版本数/计数一律 tabular-nums ✓ */
html[data-v8-srail="on"] #softwareFocus .v8-tbl thead th:nth-child(3),
html[data-v8-srail="on"] #softwareFocus .v8-tbl td[data-field="price"] {
  text-align: right !important;
}
html[data-srail="on"] #softwareFocus .v8-tbl td[data-field="price"] { font-variant-numeric: tabular-nums; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl td[data-field="price"] { font-variant-numeric: tabular-nums; }
html[data-v8-srail="on"] #softwareFocus .v8-tbl td.num,
html[data-v8-srail="on"] #softwareFocus .v8-tbl th.num { text-align: right !important; }

/* ============================================================================
 * §22 ★ 「订单管理」页：层次感 + 可视化（2026-10-07）
 *   作用域 #page-orders；非激活时显式隐藏（§21 那次教训，双保险）
 * ==========================================================================*/
#page-orders:not(.active) { display: none !important; }

/* 页题 */
#page-orders .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-orders .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-orders .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }

/* 标签页（订单明细 / 订单汇总）*/
#page-orders .orders-tab-bar { background: #F1F3F5 !important; padding: 3px !important; border-radius: 8px !important; height: 32px !important; }
#page-orders .tab-btn { height: 26px !important; font-size: .8125rem !important; font-weight: 500 !important; color: #4B5563 !important; border-radius: 6px !important; }
#page-orders .tab-btn.active { background: #fff !important; color: #111827 !important; box-shadow: 0 1px 2px rgba(16,24,40,.08) !important; }

/* KPI -> 单行统计带（与总览/软件页同一形态）*/
#page-orders #v8OrdersKpi .v8-kpis { display: flex !important; height: auto !important; min-height: 56px !important; padding: 0 !important;
  border-bottom: 1px solid #E5E7EB !important; background: transparent !important; }
#page-orders #v8OrdersKpi .v8-kpi { flex: 1 1 0 !important; min-height: 56px !important; padding: 0 16px !important;
  background: transparent !important; border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important;
  box-shadow: none !important; display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: 12px !important; }
#page-orders #v8OrdersKpi .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-orders #v8OrdersKpi .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-orders #v8OrdersKpi .v8-kpi-s { grid-column: 1; grid-row: 2; font-size: .6875rem !important; font-weight: 400 !important; color: #6B7280 !important; margin: 0 !important; }
#page-orders #v8OrdersKpi .v8-kpi-v { grid-column: 2; grid-row: 1 / span 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }

/* 筛选工具条 + 数据表 */
#page-orders .orders-filter-bar { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; padding: 14px 16px !important;
  display: flex !important; flex-wrap: wrap !important; align-items: flex-end !important; gap: 10px 12px !important; }
/* —— 一致性：筛选条里每个控件都是同一套（高 32 / 圆角 6 / 发丝边 / 同一个 focus 环）—— */
#page-orders .orders-filter-bar .filter-group { display: flex !important; flex-direction: column !important; gap: 6px !important; min-width: 0 !important; }
#page-orders .orders-filter-bar label { font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; line-height: 1 !important; }
#page-orders .orders-filter-bar input, #page-orders .orders-filter-bar select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important;
  color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important;
  font-variant-numeric: tabular-nums; }
#page-orders .orders-filter-bar input::placeholder { color: #9CA3AF !important; }
#page-orders .orders-filter-bar input:focus, #page-orders .orders-filter-bar select:focus {
  border-color: #1677FF !important; box-shadow: 0 0 0 3px rgba(22,119,255,.10) !important; outline: none !important; }
/* —— 主次动作：查询/重置成组靠右，与控件同一基线 —— */
#page-orders .orders-filter-bar .filter-actions { margin-left: auto !important; display: flex !important; align-items: flex-end !important; gap: 8px !important; }
#page-orders .orders-filter-bar .filter-actions .btn { height: 32px !important; }
#page-orders .orders-filter-bar .btn-secondary { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
#page-orders .orders-filter-bar .btn-secondary:hover { background: #F1F3F5 !important; color: #111827 !important; }
/* —— 分页条：统一字号与按钮 —— */
#page-orders .v8-pager { display: flex !important; align-items: center !important; justify-content: space-between !important;
  margin-top: 10px !important; font-size: .75rem !important; color: #6B7280 !important; }
#page-orders .v8-pager b { color: #111827 !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; }
#page-orders .v8-pager .v8-btn { height: 28px !important; padding: 0 10px !important; border-radius: 6px !important;
  border: 1px solid #E5E7EB !important; background: #fff !important; color: #4B5563 !important; font-size: .75rem !important; }
#page-orders .v8-pager .v8-btn:hover:not([disabled]) { background: #F1F3F5 !important; color: #111827 !important; }
#page-orders .v8-pager .v8-btn[disabled] { opacity: .45 !important; cursor: not-allowed !important; }
/* —— 行内操作：统一 28px 触达区 + 一致图标色 —— */
#page-orders .rowacts { display: inline-flex !important; align-items: center !important; gap: 6px !important; }
#page-orders .rowacts .v8-ract { height: 28px !important; min-width: 28px !important; border-radius: 6px !important;
  color: #6B7280 !important; border: 1px solid transparent !important; background: transparent !important; }
#page-orders .rowacts .v8-ract:hover { background: #F1F3F5 !important; color: #111827 !important; }
/* —— 金额/时间列对齐 —— */
#page-orders table.table td.num, #page-orders table.table th.num { text-align: right !important; font-variant-numeric: tabular-nums; }
#page-orders table.table thead th { height: 34px !important; padding: 0 16px !important; background: #F7F8FA !important;
  font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; border-bottom: 1px solid #E5E7EB !important;
  text-transform: none !important; letter-spacing: .02em !important; }
#page-orders table.table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
#page-orders table.table tbody tr:hover td { background: #FAFBFC !important; }
#page-orders table.table .num, #page-orders table.table td:last-child { font-variant-numeric: tabular-nums; }
#page-orders .mono { font-family: "Cascadia Mono", Consolas, monospace !important; font-size: .75rem !important; color: #4B5563 !important; }
#page-orders .v8-chip { height: 20px !important; line-height: 18px !important; border-radius: 10px !important; font-size: .6875rem !important; font-weight: 500 !important; padding: 0 8px !important; }
#page-orders .v8-chip-ok { background: #EAF7F0 !important; color: #1F7A4D !important; border: 1px solid #CBE9D9 !important; }
#page-orders .v8-chip-warn { background: #FDF6E7 !important; color: #8A5A12 !important; border: 1px solid #F0DCB4 !important; }
#page-orders .v8-chip-danger { background: #FDECEC !important; color: #B42318 !important; border: 1px solid #F3C9C5 !important; }
#page-orders .v8-chip-gray { background: #F1F3F5 !important; color: #4B5563 !important; border: 1px solid #E5E7EB !important; }

@media (max-width: 1280px) { #page-orders .ord-viz { grid-template-columns: 1fr; } }

/* ============================================================================
 * §23 ★ 订单管理页整改（2026-10-07）：依据 _订单管理_UI审查报告.md 的 P1
 *   对比度已通过 token --ds-text-3 修复（见上）；这里补：表格能力 + 焦点可见 + 播报区
 * ==========================================================================*/
:root { --text-tertiary: #6b7280; }          /* 与 --ds-text-3 对齐，避免两套灰 */

/* 横向滚动包裹层（UX 规则 Table Handling：overflow-x:auto，窄屏横滑而不是挤压） */
#page-orders .ord-x { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
#page-orders .ord-x > table { min-width: 1180px; }

/* 表头吸顶（data-dense-dashboard：sticky headers） */
#page-orders .ord-x thead th { position: sticky; top: 0; z-index: 2; background: #F7F8FA; }
#page-orders table thead th[data-sortable] { cursor: pointer; user-select: none; }
#page-orders table thead th[data-sortable]:hover { color: #111827 !important; background: #F1F3F5 !important; }
#page-orders table thead th.is-sorted { color: #111827 !important; }
#page-orders table thead th[data-sortable]::after {
  content: "\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
#page-orders table thead th.is-sorted::after { content: "\2193"; color: #1677FF; }
#page-orders table thead th.is-sorted.is-desc::after { content: "\2193"; }
#page-orders table thead th.is-sorted:not(.is-desc)::after { content: "\2191"; }

/* 列宽固定（金额右对齐、时间/手机号等宽） */
#page-orders .ord-x table th:nth-child(1), #page-orders .ord-x table td:nth-child(1) { width: 64px; }
#page-orders .ord-x table th:nth-child(2), #page-orders .ord-x table td:nth-child(2) { width: 160px; }
#page-orders .ord-x table th:nth-child(3), #page-orders .ord-x table td:nth-child(3) { width: 80px; }
#page-orders .ord-x table th:nth-child(4), #page-orders .ord-x table td:nth-child(4) { width: 220px; }
#page-orders .ord-x table th:nth-child(5), #page-orders .ord-x table td:nth-child(5) { width: 120px; }
#page-orders .ord-x table th:nth-child(6), #page-orders .ord-x table td:nth-child(6) { width: 100px; text-align: right; }
#page-orders .ord-x table th:nth-child(7), #page-orders .ord-x table td:nth-child(7) { width: 150px; }
#page-orders .ord-x table th:nth-child(8), #page-orders .ord-x table td:nth-child(8) { width: 84px; }
#page-orders .ord-x table th:nth-child(9), #page-orders .ord-x table td:nth-child(9) { width: 120px; }

/* 焦点可见（WCAG 2.4.7）：筛选控件 + 日期控件外壳 + 可排序表头 */
#page-orders .orders-filter-bar .ds-w-date:focus-within,
#page-orders .orders-filter-bar input:focus-visible,
#page-orders .orders-filter-bar select:focus-visible,
#page-orders table thead th[data-sortable]:focus-visible,
#page-orders .tab-btn:focus-visible,
#page-orders .v8-pager button:focus-visible {
  outline: 2px solid #1677FF !important; outline-offset: 1px !important;
}
#page-orders .orders-filter-bar .ds-w-date:focus-within { border-color: #1677FF !important; box-shadow: 0 0 0 3px rgba(22,119,255,.10) !important; }

/* 结果播报区：视觉上就是一行小字，屏幕阅读器可读 */
#page-orders .ord-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* ============================================================================
 * §24 ★ 订单页整改 第 2 批（2026-10-07）：状态芯片 / 批量操作 / 骨骼屏 / 按钮尺寸
 * ==========================================================================*/
/* ① 状态芯片带计数（替代下拉的"一堵墙"，少一次点击还顺带讲清分布） */
#page-orders .ord-chips { display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px;
  width: 100%; padding-bottom: 10px; margin-bottom: 2px; border-bottom: 1px solid #EEF0F3; }
#page-orders .ord-chips-lb { font-size: .6875rem; font-weight: 500; color: #6B7280; margin-right: 2px; }
#page-orders .ord-chip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px;
  border: 1px solid #E5E7EB; border-radius: 14px; background: #fff; color: #4B5563;
  font-size: .8125rem; font-weight: 500; cursor: pointer; transition: background-color .15s ease-out, color .15s ease-out; }
#page-orders .ord-chip:hover { background: #F1F3F5; color: #111827; }
#page-orders .ord-chip b { font-weight: 600; color: #6B7280; font-variant-numeric: tabular-nums; }
#page-orders .ord-chip.on { background: #EAF2FE; border-color: #BBD5FB; color: #0B5FD0; }
#page-orders .ord-chip.on b { color: #0B5FD0; }
#page-orders .ord-chip:focus-visible { outline: 2px solid #1677FF; outline-offset: 1px; }

/* ② 批量操作：复选框列 + 选中操作条 */
#page-orders .ord-x table th.ord-chk, #page-orders .ord-x table td.ord-chk { width: 40px !important; padding: 0 0 0 16px !important; }
#page-orders .ord-x table .ord-chk input { width: 15px; height: 15px; accent-color: #1677FF; cursor: pointer; vertical-align: middle; }
#page-orders .ord-x table tbody tr.is-sel td { background: #F5F9FF !important; }
#page-orders .ord-bulk { display: flex !important; align-items: center; gap: 8px; margin: 10px 0 0;
  padding: 8px 12px; background: #F5F9FF; border: 1px solid #BBD5FB; border-radius: 8px; }
#page-orders .ord-bulk-n { font-size: .8125rem; color: #4B5563; }
#page-orders .ord-bulk-n b { color: #0B5FD0; font-weight: 600; font-variant-numeric: tabular-nums; }
#page-orders .ord-bulk .btn { height: 28px !important; font-size: .75rem !important; }
#page-orders .ord-bulk .btn-quiet { background: transparent !important; border-color: transparent !important; color: #6B7280 !important; margin-left: auto; }

/* 列宽随新增的复选框列整体后移一位 */
#page-orders .ord-x table.has-bulk th:nth-child(1), #page-orders .ord-x table.has-bulk td:nth-child(1) { width: 40px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(2), #page-orders .ord-x table.has-bulk td:nth-child(2) { width: 64px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(3), #page-orders .ord-x table.has-bulk td:nth-child(3) { width: 160px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(4), #page-orders .ord-x table.has-bulk td:nth-child(4) { width: 80px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(5), #page-orders .ord-x table.has-bulk td:nth-child(5) { width: 220px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(6), #page-orders .ord-x table.has-bulk td:nth-child(6) { width: 120px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(7), #page-orders .ord-x table.has-bulk td:nth-child(7) { width: 100px !important; text-align: right; }
#page-orders .ord-x table.has-bulk th:nth-child(8), #page-orders .ord-x table.has-bulk td:nth-child(8) { width: 150px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(9), #page-orders .ord-x table.has-bulk td:nth-child(9) { width: 84px !important; }
#page-orders .ord-x table.has-bulk th:nth-child(10), #page-orders .ord-x table.has-bulk td:nth-child(10) { width: 120px !important; }

/* ③ 行内操作 28 -> 32px（鼠标密度不变，触屏可点） */
html[data-ds-skin] #page-orders[class] .rowacts .v8-ract,
html[data-ds-skin] #page-orders[class] .rowacts .v8-rm { height: 32px !important; min-width: 32px !important; line-height: 30px !important; }
#page-orders .v8-pager .v8-btn { height: 30px !important; }

/* ④ 加载骨骼屏（prefers-reduced-motion 下不动画） */
#page-orders .ord-skel { padding: 8px 0; }
#page-orders .ord-sk-row { height: 40px; margin-bottom: 2px; border-radius: 6px;
  background: linear-gradient(90deg, #F1F3F5 25%, #F8F9FB 37%, #F1F3F5 63%);
  background-size: 400% 100%; animation: ordSk 1.4s ease-in-out infinite; }
@keyframes ordSk { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
@media (prefers-reduced-motion: reduce) { #page-orders .ord-sk-row { animation: none; } }

/* ⑤ 轻提示 */
.ord-toast { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 12px);
  padding: 9px 16px; background: #111827; color: #fff; font-size: .8125rem; border-radius: 8px;
  box-shadow: 0 8px 24px rgba(16,24,40,.18); opacity: 0; pointer-events: none;
  transition: opacity .18s ease-out, transform .18s ease-out; z-index: 60; }
.ord-toast.on { opacity: 1; transform: translate(-50%, 0); }

/* ============================================================================
 * §25 ★ 跨页共用原子（2026-10-07 从已下线的总览页 §21 里救出来的公共类）
 *   .ui-plat  平台文字徽章（Windows / macOS / Win / Mac 通用 / 平台未知）
 *   .ui-fam   家族字母块（Ad / At / Of / Sk），.ui-fam-lg 是产品头用的大号
 *   ★ 这些类被「软件与版本」页与订单页共用 —— 谁都不许再把它们塞进页面专属段里
 * ==========================================================================*/
/* ---- 全局：平台/家族徽章（platformChip() 是全局函数，多页共用）---- */
.ui-plat {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid #E5E7EB; border-radius: 10px; background: #fff;
  font-size: 11px; font-weight: 500; color: #4B5563; white-space: nowrap; line-height: 1;
  font-variant-numeric: tabular-nums;
}
.ui-plat.is-mac { color: #8A4B6B; border-color: #EBD3DF; background: #FDF6F9; }
.ui-plat.is-warn { color: #8A5A12; border-color: #EBD9B8; background: #FDF8EE; }
.ui-fam {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 4px; flex: 0 0 20px;
  font-size: 9.5px; font-weight: 600; letter-spacing: 0;
  background: #F1F3F5; color: #4B5563;
}
.ui-fam.adb { background: #FDECEF; color: #B42318; }
.ui-fam.atd { background: #E8F1FE; color: #0B5FD0; }
.ui-fam.off { background: #EAF6EF; color: #1F7A4D; }
.ui-fam-lg { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 6px; font-size: 12px; }

/* §26 = base 层（作用域 #page-users，已剔除 display 那句）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-users（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-users {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-users, #page-users * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-users .pfh-title, #page-users .v8-card-t, #page-users .v8-kpi-v,
#page-users .ui-strong { font-weight: 600 !important; }
#page-users .v8-tbl thead th, #page-users .v8-swchip, #page-users .ui-pitem,
#page-users .v8-tbl td strong, #page-users .ui-btn, #page-users .ui-plat,
#page-users .v8-pitem-fam, #page-users .ui-fchip { font-weight: 500 !important; }
#page-users .v8-swchip.on, #page-users .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-users .v8-swlist, #page-users .v8-swlist * { font-size: var(--fs-12) !important; }
#page-users .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-users .v8-swchip { font-size: var(--fs-12) !important; }
#page-users .v8-swchip .bd, #page-users .v8-swchip .ln { font-size: 10px !important; }
#page-users .pfh-title { font-size: var(--fs-16) !important; }
#page-users .pfh-meta, #page-users .v8-caliber, #page-users .v8-card-t small,
#page-users .v8-empty-s, #page-users .ui-inline-note { font-size: var(--fs-12) !important; }
#page-users .ui-line, #page-users .ui-plat, #page-users .v8-kpi-l,
#page-users .v8-kpi-s, #page-users .v8-tbl thead th, #page-users .ui-fam,
#page-users .v8-help { font-size: var(--fs-11) !important; }
#page-users .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-users .v8-card-t { font-size: var(--fs-16) !important; }
#page-users .v8-tbl tbody td, #page-users .ui-btn, #page-users .v8-psel-btn,
#page-users .v8-psel-it, #page-users .v8-psel-search, #page-users .v8-empty-t,
#page-users .ui-pitem, #page-users .ui-fchip { font-size: var(--fs-13) !important; }
#page-users .v8-psel-it .bd, #page-users .ui-pitem .bd, #page-users .ui-fchip b { font-size: var(--fs-11) !important; }
#page-users .ui-pitem .ln { font-size: 10px !important; }
#page-users .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-users .bd, #page-users .v8-kpi-v, #page-users .v8-caliber,
#page-users .v8-tbl td, #page-users .v8-tbl th, #page-users .ui-pitem .bd,
#page-users .ui-grp-hd .n, #page-users .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-users .ui-btn,
#page-users .product-focus-header .btn,
#page-users .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-users .ui-btn:hover,
#page-users .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-users .ui-btn:active { transform: translateY(1px); }
#page-users .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-users .ui-btn-pri,
#page-users .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-users .ui-btn-pri:hover,
#page-users .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-users .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-users .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-users .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-users .ui-btn svg, #page-users .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-users .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-users .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-users .product-focus-header .back-btn { display: none !important; }
#page-users .product-focus-header .big-icon,
#page-users .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-users .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-users .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-users .pfh-meta { color: var(--ink-3) !important; }
#page-users .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-users .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-users .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-users .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-users #v8SwKpi { margin: 0 !important; }
#page-users .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-users .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-users .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-users .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-users .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-users .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-users .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-users .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-users .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-users .v8-swtbl-h, #page-users .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-users .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-users .v8-card-t small { color: var(--ink-3) !important; }
#page-users .v8-caliber { color: var(--ink-3) !important; }
#page-users .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-users .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-users .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-users .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-users .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-users .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-users .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-users .v8-tbl td:first-child, #page-users .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-users .v8-tbl td.ui-num, #page-users .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-users .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-users .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-users .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-users .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-users .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-users .v8-empty-t { color: var(--ink-1) !important; }
#page-users .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-users .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-users .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-users .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-users .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §26 ★ 「用户与会员」（#page-users）—— 复用已验证配方（见 _皮肤规则收敛规范.md）
 *   制胜前缀：html[data-ds-skin="on"] #page-users[class] …（属性+id+白送一级 class 权重）
 * ==========================================================================*/
#page-users:not(.active) { display: none !important; }
#page-users .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-users .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-users .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }

/* 控件统一（高 32 / 圆角 6 / 发丝边 / 可见焦点） */
html[data-ds-skin="on"] #page-users[class] input[type=text],
html[data-ds-skin="on"] #page-users[class] input[type=search],
html[data-ds-skin="on"] #page-users[class] select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important;
  color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
html[data-ds-skin="on"] #page-users[class] input::placeholder { color: #9CA3AF !important; }
html[data-ds-skin="on"] #page-users[class] input:focus-visible,
html[data-ds-skin="on"] #page-users[class] select:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }

/* 表格：吸顶 + 44px 行 + 发丝线 + hover（用制胜前缀，避免又打优先级仗） */
#page-users .ui-x { width: 100%; overflow-x: auto; }
#page-users .ui-x > table { min-width: 1000px; }
html[data-ds-skin="on"] #page-users[class] table thead th {
  height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important;
  color: #6B7280 !important; border-bottom: 1px solid #E5E7EB !important;
  position: sticky !important; top: 0; z-index: 2; text-transform: none !important; letter-spacing: .02em !important; }
html[data-ds-skin="on"] #page-users[class] table tbody td {
  height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-users[class] table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-users[class] table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-users[class] table thead th[data-sortable]:hover { color: #111827 !important; background: #F1F3F5 !important; }
html[data-ds-skin="on"] #page-users[class] table thead th[data-sortable]::after { content: "\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-users[class] table thead th.is-sorted::after { content: "\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-users[class] table thead th.is-sorted.is-desc::after { content: "\2193"; }

/* 行内操作 32px + 数字等宽 */
html[data-ds-skin="on"] #page-users[class] .rowacts .v8-ract,
html[data-ds-skin="on"] #page-users[class] .rowacts .v8-rm,
html[data-ds-skin="on"] #page-users[class] table .btn-sm { height: 32px !important; min-width: 32px !important; }
html[data-ds-skin="on"] #page-users[class] table .mono { font-family: "Cascadia Mono", Consolas, monospace !important; font-size: .75rem !important; }
#page-users .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* §27 = base 层（作用域 #page-software-accounts，已剔除 display 那句）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-software-accounts（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-software-accounts {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-software-accounts, #page-software-accounts * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-software-accounts .pfh-title, #page-software-accounts .v8-card-t, #page-software-accounts .v8-kpi-v,
#page-software-accounts .ui-strong { font-weight: 600 !important; }
#page-software-accounts .v8-tbl thead th, #page-software-accounts .v8-swchip, #page-software-accounts .ui-pitem,
#page-software-accounts .v8-tbl td strong, #page-software-accounts .ui-btn, #page-software-accounts .ui-plat,
#page-software-accounts .v8-pitem-fam, #page-software-accounts .ui-fchip { font-weight: 500 !important; }
#page-software-accounts .v8-swchip.on, #page-software-accounts .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-software-accounts .v8-swlist, #page-software-accounts .v8-swlist * { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swchip { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swchip .bd, #page-software-accounts .v8-swchip .ln { font-size: 10px !important; }
#page-software-accounts .pfh-title { font-size: var(--fs-16) !important; }
#page-software-accounts .pfh-meta, #page-software-accounts .v8-caliber, #page-software-accounts .v8-card-t small,
#page-software-accounts .v8-empty-s, #page-software-accounts .ui-inline-note { font-size: var(--fs-12) !important; }
#page-software-accounts .ui-line, #page-software-accounts .ui-plat, #page-software-accounts .v8-kpi-l,
#page-software-accounts .v8-kpi-s, #page-software-accounts .v8-tbl thead th, #page-software-accounts .ui-fam,
#page-software-accounts .v8-help { font-size: var(--fs-11) !important; }
#page-software-accounts .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-software-accounts .v8-card-t { font-size: var(--fs-16) !important; }
#page-software-accounts .v8-tbl tbody td, #page-software-accounts .ui-btn, #page-software-accounts .v8-psel-btn,
#page-software-accounts .v8-psel-it, #page-software-accounts .v8-psel-search, #page-software-accounts .v8-empty-t,
#page-software-accounts .ui-pitem, #page-software-accounts .ui-fchip { font-size: var(--fs-13) !important; }
#page-software-accounts .v8-psel-it .bd, #page-software-accounts .ui-pitem .bd, #page-software-accounts .ui-fchip b { font-size: var(--fs-11) !important; }
#page-software-accounts .ui-pitem .ln { font-size: 10px !important; }
#page-software-accounts .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-software-accounts .bd, #page-software-accounts .v8-kpi-v, #page-software-accounts .v8-caliber,
#page-software-accounts .v8-tbl td, #page-software-accounts .v8-tbl th, #page-software-accounts .ui-pitem .bd,
#page-software-accounts .ui-grp-hd .n, #page-software-accounts .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-software-accounts .ui-btn,
#page-software-accounts .product-focus-header .btn,
#page-software-accounts .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-software-accounts .ui-btn:hover,
#page-software-accounts .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-software-accounts .ui-btn:active { transform: translateY(1px); }
#page-software-accounts .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-software-accounts .ui-btn-pri,
#page-software-accounts .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-software-accounts .ui-btn-pri:hover,
#page-software-accounts .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-software-accounts .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-software-accounts .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-software-accounts .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-software-accounts .ui-btn svg, #page-software-accounts .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-software-accounts .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-software-accounts .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-software-accounts .product-focus-header .back-btn { display: none !important; }
#page-software-accounts .product-focus-header .big-icon,
#page-software-accounts .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-software-accounts .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-software-accounts .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-software-accounts .pfh-meta { color: var(--ink-3) !important; }
#page-software-accounts .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-software-accounts .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-software-accounts .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-software-accounts .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-software-accounts #v8SwKpi { margin: 0 !important; }
#page-software-accounts .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-software-accounts .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-software-accounts .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-software-accounts .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-software-accounts .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-software-accounts .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-software-accounts .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-software-accounts .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-software-accounts .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-software-accounts .v8-swtbl-h, #page-software-accounts .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-software-accounts .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-software-accounts .v8-card-t small { color: var(--ink-3) !important; }
#page-software-accounts .v8-caliber { color: var(--ink-3) !important; }
#page-software-accounts .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-software-accounts .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-software-accounts .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-software-accounts .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-software-accounts .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-software-accounts .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-software-accounts .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-software-accounts .v8-tbl td:first-child, #page-software-accounts .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-software-accounts .v8-tbl td.ui-num, #page-software-accounts .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-software-accounts .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-software-accounts .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-software-accounts .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-software-accounts .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-software-accounts .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-software-accounts .v8-empty-t { color: var(--ink-1) !important; }
#page-software-accounts .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-software-accounts .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-software-accounts .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-software-accounts .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-software-accounts .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §27 ★ 「账号池」（#page-software-accounts）—— 复用已验证配方（_皮肤规则收敛规范.md）
 * ==========================================================================*/
#page-software-accounts:not(.active) { display: none !important; }
#page-software-accounts .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-software-accounts .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-software-accounts .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }

html[data-ds-skin="on"] #page-software-accounts[class] input[type=text],
html[data-ds-skin="on"] #page-software-accounts[class] input[type=search],
html[data-ds-skin="on"] #page-software-accounts[class] select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important;
  color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
html[data-ds-skin="on"] #page-software-accounts[class] input:focus-visible,
html[data-ds-skin="on"] #page-software-accounts[class] select:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }

#page-software-accounts .ui-x { width: 100%; overflow-x: auto; }
#page-software-accounts .ui-x > table { min-width: 1000px; }
html[data-ds-skin="on"] #page-software-accounts[class] table thead th {
  height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important;
  color: #6B7280 !important; border-bottom: 1px solid #E5E7EB !important;
  position: sticky !important; top: 0; z-index: 2; text-transform: none !important; letter-spacing: .02em !important; }
html[data-ds-skin="on"] #page-software-accounts[class] table tbody td {
  height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-software-accounts[class] table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-software-accounts[class] table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-software-accounts[class] table thead th[data-sortable]::after { content: "\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-software-accounts[class] table thead th.is-sorted::after { content: "\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-software-accounts[class] table thead th.is-sorted.is-desc::after { content: "\2193"; }
html[data-ds-skin="on"] #page-software-accounts[class] .rowacts .v8-ract,
html[data-ds-skin="on"] #page-software-accounts[class] .rowacts .v8-rm,
html[data-ds-skin="on"] #page-software-accounts[class] table .btn-sm { height: 32px !important; min-width: 32px !important; }
#page-software-accounts .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* §28 = base 层（作用域 #page-software-accounts，剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-software-accounts（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-software-accounts {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-software-accounts, #page-software-accounts * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-software-accounts .pfh-title, #page-software-accounts .v8-card-t, #page-software-accounts .v8-kpi-v,
#page-software-accounts .ui-strong { font-weight: 600 !important; }
#page-software-accounts .v8-tbl thead th, #page-software-accounts .v8-swchip, #page-software-accounts .ui-pitem,
#page-software-accounts .v8-tbl td strong, #page-software-accounts .ui-btn, #page-software-accounts .ui-plat,
#page-software-accounts .v8-pitem-fam, #page-software-accounts .ui-fchip { font-weight: 500 !important; }
#page-software-accounts .v8-swchip.on, #page-software-accounts .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-software-accounts .v8-swlist, #page-software-accounts .v8-swlist * { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swchip { font-size: var(--fs-12) !important; }
#page-software-accounts .v8-swchip .bd, #page-software-accounts .v8-swchip .ln { font-size: 10px !important; }
#page-software-accounts .pfh-title { font-size: var(--fs-16) !important; }
#page-software-accounts .pfh-meta, #page-software-accounts .v8-caliber, #page-software-accounts .v8-card-t small,
#page-software-accounts .v8-empty-s, #page-software-accounts .ui-inline-note { font-size: var(--fs-12) !important; }
#page-software-accounts .ui-line, #page-software-accounts .ui-plat, #page-software-accounts .v8-kpi-l,
#page-software-accounts .v8-kpi-s, #page-software-accounts .v8-tbl thead th, #page-software-accounts .ui-fam,
#page-software-accounts .v8-help { font-size: var(--fs-11) !important; }
#page-software-accounts .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-software-accounts .v8-card-t { font-size: var(--fs-16) !important; }
#page-software-accounts .v8-tbl tbody td, #page-software-accounts .ui-btn, #page-software-accounts .v8-psel-btn,
#page-software-accounts .v8-psel-it, #page-software-accounts .v8-psel-search, #page-software-accounts .v8-empty-t,
#page-software-accounts .ui-pitem, #page-software-accounts .ui-fchip { font-size: var(--fs-13) !important; }
#page-software-accounts .v8-psel-it .bd, #page-software-accounts .ui-pitem .bd, #page-software-accounts .ui-fchip b { font-size: var(--fs-11) !important; }
#page-software-accounts .ui-pitem .ln { font-size: 10px !important; }
#page-software-accounts .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-software-accounts .bd, #page-software-accounts .v8-kpi-v, #page-software-accounts .v8-caliber,
#page-software-accounts .v8-tbl td, #page-software-accounts .v8-tbl th, #page-software-accounts .ui-pitem .bd,
#page-software-accounts .ui-grp-hd .n, #page-software-accounts .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-software-accounts .ui-btn,
#page-software-accounts .product-focus-header .btn,
#page-software-accounts .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-software-accounts .ui-btn:hover,
#page-software-accounts .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-software-accounts .ui-btn:active { transform: translateY(1px); }
#page-software-accounts .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-software-accounts .ui-btn-pri,
#page-software-accounts .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-software-accounts .ui-btn-pri:hover,
#page-software-accounts .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-software-accounts .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-software-accounts .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-software-accounts .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-software-accounts .ui-btn svg, #page-software-accounts .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-software-accounts .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-software-accounts .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-software-accounts .product-focus-header .back-btn { display: none !important; }
#page-software-accounts .product-focus-header .big-icon,
#page-software-accounts .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-software-accounts .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-software-accounts .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-software-accounts .pfh-meta { color: var(--ink-3) !important; }
#page-software-accounts .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-software-accounts .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-software-accounts .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-software-accounts .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-software-accounts #v8SwKpi { margin: 0 !important; }
#page-software-accounts .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-software-accounts .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-software-accounts .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-software-accounts .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-software-accounts .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-software-accounts .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-software-accounts .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-software-accounts .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-software-accounts .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-software-accounts .v8-swtbl-h, #page-software-accounts .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-software-accounts .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-software-accounts .v8-card-t small { color: var(--ink-3) !important; }
#page-software-accounts .v8-caliber { color: var(--ink-3) !important; }
#page-software-accounts .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-software-accounts .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-software-accounts .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-software-accounts .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-software-accounts .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-software-accounts .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-software-accounts .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-software-accounts .v8-tbl td:first-child, #page-software-accounts .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-software-accounts .v8-tbl td.ui-num, #page-software-accounts .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-software-accounts .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-software-accounts .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-software-accounts .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-software-accounts .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-software-accounts .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-software-accounts .v8-empty-t { color: var(--ink-1) !important; }
#page-software-accounts .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-software-accounts .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-software-accounts .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-software-accounts .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-software-accounts .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §28 ★ 「账号池」（#page-software-accounts）正式实现（2026-10-07）
 *   形状：KPI 带 + 卡片 + 空态（无表格）—— 见 _账号池_体检与设计方向.md
 * ==========================================================================*/
#page-software-accounts:not(.active) { display: none !important; }
#page-software-accounts .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }

/* ① KPI -> 统计带（与订单页/软件页同一形态：单行 · 发丝线 · 标签小灰 · 数值墨色等宽） */
#page-software-accounts .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-software-accounts .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-software-accounts .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-software-accounts .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-software-accounts .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important;
  color: #111827 !important; line-height: 1.1 !important; font-variant-numeric: tabular-nums; }

/* ② 卡片：白底 + 发丝边 + e1 投影 + 统一内边距 */
#page-software-accounts .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important;
  border-radius: 8px !important; box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-software-accounts .v8-card-h { min-height: 48px !important; padding: 0 16px !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 12px !important; border-bottom: 1px solid #EEF0F3 !important; }
#page-software-accounts .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-software-accounts .v8-card-b { padding: 16px !important; }

/* ③ 空态：去 emoji 图标 · 说明居中 · 出路按钮 */
#page-software-accounts .v8-empty { display: flex !important; flex-direction: column !important;
  align-items: center !important; gap: 8px !important; padding: 32px 16px !important; text-align: center !important; }
#page-software-accounts .v8-empty-ico { display: none !important; }        /* 原本是 🔒 🔑 emoji */
#page-software-accounts .v8-empty-t { font-size: .8125rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-software-accounts .v8-empty-s { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-software-accounts .swa-cta { margin-top: 6px; }

/* ④ 按钮三档：主（实心）/ 次（发丝边），统一高 32 圆角 6 */
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn {
  height: 32px !important; min-height: 32px !important; padding: 0 12px !important; border-radius: 6px !important;
  font-size: .8125rem !important; font-weight: 500 !important; display: inline-flex !important;
  align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn-pri {
  background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn-pri:hover { background: #0B5FD0 !important; border-color: #0B5FD0 !important; }
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn:not(.v8-btn-pri) {
  background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn:not(.v8-btn-pri):hover {
  background: #F1F3F5 !important; color: #111827 !important; }
html[data-ds-skin="on"] #page-software-accounts[class] .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }

/* ⑤ 排版收口 + 修 font-size:0px 的脏元素 */
#page-software-accounts .v8-card, #page-software-accounts .v8-empty, #page-software-accounts .v8-kpi { font-size: .8125rem !important; }
#page-software-accounts [style*="font-size: 0"], #page-software-accounts [style*="font-size:0"] { display: none !important; }

/* §29 = base 层（作用域 #page-pay-accounts，剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-pay-accounts（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-pay-accounts {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-pay-accounts, #page-pay-accounts * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-pay-accounts .pfh-title, #page-pay-accounts .v8-card-t, #page-pay-accounts .v8-kpi-v,
#page-pay-accounts .ui-strong { font-weight: 600 !important; }
#page-pay-accounts .v8-tbl thead th, #page-pay-accounts .v8-swchip, #page-pay-accounts .ui-pitem,
#page-pay-accounts .v8-tbl td strong, #page-pay-accounts .ui-btn, #page-pay-accounts .ui-plat,
#page-pay-accounts .v8-pitem-fam, #page-pay-accounts .ui-fchip { font-weight: 500 !important; }
#page-pay-accounts .v8-swchip.on, #page-pay-accounts .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-pay-accounts .v8-swlist, #page-pay-accounts .v8-swlist * { font-size: var(--fs-12) !important; }
#page-pay-accounts .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-pay-accounts .v8-swchip { font-size: var(--fs-12) !important; }
#page-pay-accounts .v8-swchip .bd, #page-pay-accounts .v8-swchip .ln { font-size: 10px !important; }
#page-pay-accounts .pfh-title { font-size: var(--fs-16) !important; }
#page-pay-accounts .pfh-meta, #page-pay-accounts .v8-caliber, #page-pay-accounts .v8-card-t small,
#page-pay-accounts .v8-empty-s, #page-pay-accounts .ui-inline-note { font-size: var(--fs-12) !important; }
#page-pay-accounts .ui-line, #page-pay-accounts .ui-plat, #page-pay-accounts .v8-kpi-l,
#page-pay-accounts .v8-kpi-s, #page-pay-accounts .v8-tbl thead th, #page-pay-accounts .ui-fam,
#page-pay-accounts .v8-help { font-size: var(--fs-11) !important; }
#page-pay-accounts .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-pay-accounts .v8-card-t { font-size: var(--fs-16) !important; }
#page-pay-accounts .v8-tbl tbody td, #page-pay-accounts .ui-btn, #page-pay-accounts .v8-psel-btn,
#page-pay-accounts .v8-psel-it, #page-pay-accounts .v8-psel-search, #page-pay-accounts .v8-empty-t,
#page-pay-accounts .ui-pitem, #page-pay-accounts .ui-fchip { font-size: var(--fs-13) !important; }
#page-pay-accounts .v8-psel-it .bd, #page-pay-accounts .ui-pitem .bd, #page-pay-accounts .ui-fchip b { font-size: var(--fs-11) !important; }
#page-pay-accounts .ui-pitem .ln { font-size: 10px !important; }
#page-pay-accounts .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-pay-accounts .bd, #page-pay-accounts .v8-kpi-v, #page-pay-accounts .v8-caliber,
#page-pay-accounts .v8-tbl td, #page-pay-accounts .v8-tbl th, #page-pay-accounts .ui-pitem .bd,
#page-pay-accounts .ui-grp-hd .n, #page-pay-accounts .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-pay-accounts .ui-btn,
#page-pay-accounts .product-focus-header .btn,
#page-pay-accounts .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-pay-accounts .ui-btn:hover,
#page-pay-accounts .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-pay-accounts .ui-btn:active { transform: translateY(1px); }
#page-pay-accounts .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-pay-accounts .ui-btn-pri,
#page-pay-accounts .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-pay-accounts .ui-btn-pri:hover,
#page-pay-accounts .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-pay-accounts .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-pay-accounts .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-pay-accounts .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-pay-accounts .ui-btn svg, #page-pay-accounts .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-pay-accounts .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-pay-accounts .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-pay-accounts .product-focus-header .back-btn { display: none !important; }
#page-pay-accounts .product-focus-header .big-icon,
#page-pay-accounts .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-pay-accounts .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-pay-accounts .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-pay-accounts .pfh-meta { color: var(--ink-3) !important; }
#page-pay-accounts .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-pay-accounts .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-pay-accounts .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-pay-accounts .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-pay-accounts #v8SwKpi { margin: 0 !important; }
#page-pay-accounts .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-pay-accounts .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-pay-accounts .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-pay-accounts .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-pay-accounts .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-pay-accounts .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-pay-accounts .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-pay-accounts .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-pay-accounts .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-pay-accounts .v8-swtbl-h, #page-pay-accounts .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-pay-accounts .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-pay-accounts .v8-card-t small { color: var(--ink-3) !important; }
#page-pay-accounts .v8-caliber { color: var(--ink-3) !important; }
#page-pay-accounts .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-pay-accounts .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-pay-accounts .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-pay-accounts .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-pay-accounts .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-pay-accounts .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-pay-accounts .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-pay-accounts .v8-tbl td:first-child, #page-pay-accounts .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-pay-accounts .v8-tbl td.ui-num, #page-pay-accounts .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-pay-accounts .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-pay-accounts .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-pay-accounts .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-pay-accounts .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-pay-accounts .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-pay-accounts .v8-empty-t { color: var(--ink-1) !important; }
#page-pay-accounts .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-pay-accounts .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-pay-accounts .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-pay-accounts .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-pay-accounts .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §29 ★ 「收款账户」（#page-pay-accounts）—— 复用 §28 已验证配方（.v8-* 卡片页）
 * ==========================================================================*/
#page-pay-accounts:not(.active) { display: none !important; }
#page-pay-accounts .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-pay-accounts .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-pay-accounts .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-pay-accounts .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-pay-accounts .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-pay-accounts .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important;
  color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-pay-accounts .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important;
  border-radius: 8px !important; box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-pay-accounts .v8-card-h { min-height: 48px !important; padding: 0 16px !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 12px !important; border-bottom: 1px solid #EEF0F3 !important; }
#page-pay-accounts .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-pay-accounts .v8-card-b { padding: 16px !important; }
#page-pay-accounts .v8-empty { display: flex !important; flex-direction: column !important;
  align-items: center !important; gap: 8px !important; padding: 32px 16px !important; text-align: center !important; }
#page-pay-accounts .v8-empty-ico { display: none !important; }
#page-pay-accounts .v8-empty-t { font-size: .8125rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-pay-accounts .v8-empty-s { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn {
  height: 32px !important; min-height: 32px !important; padding: 0 12px !important; border-radius: 6px !important;
  font-size: .8125rem !important; font-weight: 500 !important; display: inline-flex !important;
  align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn-pri:hover { background: #0B5FD0 !important; border-color: #0B5FD0 !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn:not(.v8-btn-pri):hover { background: #F1F3F5 !important; color: #111827 !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-pay-accounts[class] input[type=text],
html[data-ds-skin="on"] #page-pay-accounts[class] input[type=search],
html[data-ds-skin="on"] #page-pay-accounts[class] select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important; color: #111827 !important;
  background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
#page-pay-accounts .v8-card, #page-pay-accounts .v8-empty, #page-pay-accounts .v8-kpi { font-size: .8125rem !important; }
/* base 层（作用域 #page-activation-requests，已剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-activation-requests（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-activation-requests {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-activation-requests, #page-activation-requests * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-activation-requests .pfh-title, #page-activation-requests .v8-card-t, #page-activation-requests .v8-kpi-v,
#page-activation-requests .ui-strong { font-weight: 600 !important; }
#page-activation-requests .v8-tbl thead th, #page-activation-requests .v8-swchip, #page-activation-requests .ui-pitem,
#page-activation-requests .v8-tbl td strong, #page-activation-requests .ui-btn, #page-activation-requests .ui-plat,
#page-activation-requests .v8-pitem-fam, #page-activation-requests .ui-fchip { font-weight: 500 !important; }
#page-activation-requests .v8-swchip.on, #page-activation-requests .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-activation-requests .v8-swlist, #page-activation-requests .v8-swlist * { font-size: var(--fs-12) !important; }
#page-activation-requests .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-activation-requests .v8-swchip { font-size: var(--fs-12) !important; }
#page-activation-requests .v8-swchip .bd, #page-activation-requests .v8-swchip .ln { font-size: 10px !important; }
#page-activation-requests .pfh-title { font-size: var(--fs-16) !important; }
#page-activation-requests .pfh-meta, #page-activation-requests .v8-caliber, #page-activation-requests .v8-card-t small,
#page-activation-requests .v8-empty-s, #page-activation-requests .ui-inline-note { font-size: var(--fs-12) !important; }
#page-activation-requests .ui-line, #page-activation-requests .ui-plat, #page-activation-requests .v8-kpi-l,
#page-activation-requests .v8-kpi-s, #page-activation-requests .v8-tbl thead th, #page-activation-requests .ui-fam,
#page-activation-requests .v8-help { font-size: var(--fs-11) !important; }
#page-activation-requests .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-activation-requests .v8-card-t { font-size: var(--fs-16) !important; }
#page-activation-requests .v8-tbl tbody td, #page-activation-requests .ui-btn, #page-activation-requests .v8-psel-btn,
#page-activation-requests .v8-psel-it, #page-activation-requests .v8-psel-search, #page-activation-requests .v8-empty-t,
#page-activation-requests .ui-pitem, #page-activation-requests .ui-fchip { font-size: var(--fs-13) !important; }
#page-activation-requests .v8-psel-it .bd, #page-activation-requests .ui-pitem .bd, #page-activation-requests .ui-fchip b { font-size: var(--fs-11) !important; }
#page-activation-requests .ui-pitem .ln { font-size: 10px !important; }
#page-activation-requests .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-activation-requests .bd, #page-activation-requests .v8-kpi-v, #page-activation-requests .v8-caliber,
#page-activation-requests .v8-tbl td, #page-activation-requests .v8-tbl th, #page-activation-requests .ui-pitem .bd,
#page-activation-requests .ui-grp-hd .n, #page-activation-requests .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-activation-requests .ui-btn,
#page-activation-requests .product-focus-header .btn,
#page-activation-requests .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-activation-requests .ui-btn:hover,
#page-activation-requests .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-activation-requests .ui-btn:active { transform: translateY(1px); }
#page-activation-requests .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-activation-requests .ui-btn-pri,
#page-activation-requests .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-activation-requests .ui-btn-pri:hover,
#page-activation-requests .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-activation-requests .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-activation-requests .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-activation-requests .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-activation-requests .ui-btn svg, #page-activation-requests .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-activation-requests .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-activation-requests .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-activation-requests .product-focus-header .back-btn { display: none !important; }
#page-activation-requests .product-focus-header .big-icon,
#page-activation-requests .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-activation-requests .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-activation-requests .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-activation-requests .pfh-meta { color: var(--ink-3) !important; }
#page-activation-requests .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-activation-requests .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-activation-requests .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-activation-requests .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-activation-requests #v8SwKpi { margin: 0 !important; }
#page-activation-requests .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-activation-requests .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-activation-requests .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-activation-requests .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-activation-requests .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-activation-requests .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-activation-requests .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-activation-requests .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-activation-requests .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-activation-requests .v8-swtbl-h, #page-activation-requests .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-activation-requests .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-activation-requests .v8-card-t small { color: var(--ink-3) !important; }
#page-activation-requests .v8-caliber { color: var(--ink-3) !important; }
#page-activation-requests .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-activation-requests .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-activation-requests .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-activation-requests .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-activation-requests .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-activation-requests .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-activation-requests .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-activation-requests .v8-tbl td:first-child, #page-activation-requests .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-activation-requests .v8-tbl td.ui-num, #page-activation-requests .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-activation-requests .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-activation-requests .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-activation-requests .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-activation-requests .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-activation-requests .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-activation-requests .v8-empty-t { color: var(--ink-1) !important; }
#page-activation-requests .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-activation-requests .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-activation-requests .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-activation-requests .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-activation-requests .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §30 ★ 「激活申请」（2026-10-07）—— 复用 §28/§29 配方
 *   ★ 注意：**不要用逗号写多页选择器**！`#a, #b .child` 会让 #a 变成裸选择器，
 *     把 display 加到 section 上 -> 串页（2026-10-07 踩过，见规范 §六）
 * ==========================================================================*/
#page-activation-requests:not(.active) { display: none !important; }
#page-activation-requests .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-activation-requests .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-activation-requests .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-activation-requests .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-activation-requests .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-activation-requests .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-activation-requests .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-activation-requests .v8-card-h { min-height: 48px !important; padding: 0 16px !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  border-bottom: 1px solid #EEF0F3 !important; }
#page-activation-requests .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-activation-requests .v8-card-b { padding: 16px !important; }
#page-activation-requests .v8-empty { display: flex !important; flex-direction: column !important; align-items: center !important;
  gap: 8px !important; padding: 32px 16px !important; text-align: center !important; }
#page-activation-requests .v8-empty-ico { display: none !important; }
#page-activation-requests .v8-empty-t { font-size: .8125rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-activation-requests .v8-empty-s { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
html[data-ds-skin="on"] #page-activation-requests .v8-btn { height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important; border-radius: 6px !important; font-size: .8125rem !important; font-weight: 500 !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-activation-requests .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-activation-requests .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-activation-requests .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-activation-requests input[type=text], html[data-ds-skin="on"] #page-activation-requests select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important; color: #111827 !important;
  background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
#page-activation-requests .ui-x { width: 100%; overflow-x: auto; }
#page-activation-requests .ui-x > table { min-width: 900px; }
html[data-ds-skin="on"] #page-activation-requests table thead th { height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important;
  border-bottom: 1px solid #E5E7EB !important; position: sticky !important; top: 0; z-index: 2; text-transform: none !important; }
html[data-ds-skin="on"] #page-activation-requests table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-activation-requests table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-activation-requests table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-activation-requests table thead th[data-sortable]::after { content: "\\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-activation-requests table thead th.is-sorted::after { content: "\\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-activation-requests table thead th.is-sorted.is-desc::after { content: "\\2193"; }
#page-activation-requests .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* base 层（作用域 #page-software-accounts-expiring，已剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-software-accounts-expiring（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-software-accounts-expiring {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-software-accounts-expiring, #page-software-accounts-expiring * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-software-accounts-expiring .pfh-title, #page-software-accounts-expiring .v8-card-t, #page-software-accounts-expiring .v8-kpi-v,
#page-software-accounts-expiring .ui-strong { font-weight: 600 !important; }
#page-software-accounts-expiring .v8-tbl thead th, #page-software-accounts-expiring .v8-swchip, #page-software-accounts-expiring .ui-pitem,
#page-software-accounts-expiring .v8-tbl td strong, #page-software-accounts-expiring .ui-btn, #page-software-accounts-expiring .ui-plat,
#page-software-accounts-expiring .v8-pitem-fam, #page-software-accounts-expiring .ui-fchip { font-weight: 500 !important; }
#page-software-accounts-expiring .v8-swchip.on, #page-software-accounts-expiring .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-software-accounts-expiring .v8-swlist, #page-software-accounts-expiring .v8-swlist * { font-size: var(--fs-12) !important; }
#page-software-accounts-expiring .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-software-accounts-expiring .v8-swchip { font-size: var(--fs-12) !important; }
#page-software-accounts-expiring .v8-swchip .bd, #page-software-accounts-expiring .v8-swchip .ln { font-size: 10px !important; }
#page-software-accounts-expiring .pfh-title { font-size: var(--fs-16) !important; }
#page-software-accounts-expiring .pfh-meta, #page-software-accounts-expiring .v8-caliber, #page-software-accounts-expiring .v8-card-t small,
#page-software-accounts-expiring .v8-empty-s, #page-software-accounts-expiring .ui-inline-note { font-size: var(--fs-12) !important; }
#page-software-accounts-expiring .ui-line, #page-software-accounts-expiring .ui-plat, #page-software-accounts-expiring .v8-kpi-l,
#page-software-accounts-expiring .v8-kpi-s, #page-software-accounts-expiring .v8-tbl thead th, #page-software-accounts-expiring .ui-fam,
#page-software-accounts-expiring .v8-help { font-size: var(--fs-11) !important; }
#page-software-accounts-expiring .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-software-accounts-expiring .v8-card-t { font-size: var(--fs-16) !important; }
#page-software-accounts-expiring .v8-tbl tbody td, #page-software-accounts-expiring .ui-btn, #page-software-accounts-expiring .v8-psel-btn,
#page-software-accounts-expiring .v8-psel-it, #page-software-accounts-expiring .v8-psel-search, #page-software-accounts-expiring .v8-empty-t,
#page-software-accounts-expiring .ui-pitem, #page-software-accounts-expiring .ui-fchip { font-size: var(--fs-13) !important; }
#page-software-accounts-expiring .v8-psel-it .bd, #page-software-accounts-expiring .ui-pitem .bd, #page-software-accounts-expiring .ui-fchip b { font-size: var(--fs-11) !important; }
#page-software-accounts-expiring .ui-pitem .ln { font-size: 10px !important; }
#page-software-accounts-expiring .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-software-accounts-expiring .bd, #page-software-accounts-expiring .v8-kpi-v, #page-software-accounts-expiring .v8-caliber,
#page-software-accounts-expiring .v8-tbl td, #page-software-accounts-expiring .v8-tbl th, #page-software-accounts-expiring .ui-pitem .bd,
#page-software-accounts-expiring .ui-grp-hd .n, #page-software-accounts-expiring .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-software-accounts-expiring .ui-btn,
#page-software-accounts-expiring .product-focus-header .btn,
#page-software-accounts-expiring .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-software-accounts-expiring .ui-btn:hover,
#page-software-accounts-expiring .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-software-accounts-expiring .ui-btn:active { transform: translateY(1px); }
#page-software-accounts-expiring .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-software-accounts-expiring .ui-btn-pri,
#page-software-accounts-expiring .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-software-accounts-expiring .ui-btn-pri:hover,
#page-software-accounts-expiring .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-software-accounts-expiring .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-software-accounts-expiring .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-software-accounts-expiring .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-software-accounts-expiring .ui-btn svg, #page-software-accounts-expiring .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-software-accounts-expiring .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-software-accounts-expiring .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-software-accounts-expiring .product-focus-header .back-btn { display: none !important; }
#page-software-accounts-expiring .product-focus-header .big-icon,
#page-software-accounts-expiring .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-software-accounts-expiring .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-software-accounts-expiring .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-software-accounts-expiring .pfh-meta { color: var(--ink-3) !important; }
#page-software-accounts-expiring .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-software-accounts-expiring .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-software-accounts-expiring .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-software-accounts-expiring .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-software-accounts-expiring #v8SwKpi { margin: 0 !important; }
#page-software-accounts-expiring .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-software-accounts-expiring .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-software-accounts-expiring .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-software-accounts-expiring .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-software-accounts-expiring .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-software-accounts-expiring .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-software-accounts-expiring .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-software-accounts-expiring .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-software-accounts-expiring .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-software-accounts-expiring .v8-swtbl-h, #page-software-accounts-expiring .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-software-accounts-expiring .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-software-accounts-expiring .v8-card-t small { color: var(--ink-3) !important; }
#page-software-accounts-expiring .v8-caliber { color: var(--ink-3) !important; }
#page-software-accounts-expiring .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-software-accounts-expiring .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-software-accounts-expiring .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-software-accounts-expiring .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-software-accounts-expiring .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-software-accounts-expiring .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-software-accounts-expiring .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-software-accounts-expiring .v8-tbl td:first-child, #page-software-accounts-expiring .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-software-accounts-expiring .v8-tbl td.ui-num, #page-software-accounts-expiring .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-software-accounts-expiring .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-software-accounts-expiring .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-software-accounts-expiring .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-software-accounts-expiring .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-software-accounts-expiring .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-software-accounts-expiring .v8-empty-t { color: var(--ink-1) !important; }
#page-software-accounts-expiring .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-software-accounts-expiring .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-software-accounts-expiring .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-software-accounts-expiring .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-software-accounts-expiring .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §30 ★ 「快到期名单」（2026-10-07）—— 复用 §28/§29 配方
 *   ★ 注意：**不要用逗号写多页选择器**！`#a, #b .child` 会让 #a 变成裸选择器，
 *     把 display 加到 section 上 -> 串页（2026-10-07 踩过，见规范 §六）
 * ==========================================================================*/
#page-software-accounts-expiring:not(.active) { display: none !important; }
#page-software-accounts-expiring .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-software-accounts-expiring .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-software-accounts-expiring .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-software-accounts-expiring .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-software-accounts-expiring .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-software-accounts-expiring .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-software-accounts-expiring .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-software-accounts-expiring .v8-card-h { min-height: 48px !important; padding: 0 16px !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  border-bottom: 1px solid #EEF0F3 !important; }
#page-software-accounts-expiring .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-software-accounts-expiring .v8-card-b { padding: 16px !important; }
#page-software-accounts-expiring .v8-empty { display: flex !important; flex-direction: column !important; align-items: center !important;
  gap: 8px !important; padding: 32px 16px !important; text-align: center !important; }
#page-software-accounts-expiring .v8-empty-ico { display: none !important; }
#page-software-accounts-expiring .v8-empty-t { font-size: .8125rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-software-accounts-expiring .v8-empty-s { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring .v8-btn { height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important; border-radius: 6px !important; font-size: .8125rem !important; font-weight: 500 !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-software-accounts-expiring .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring input[type=text], html[data-ds-skin="on"] #page-software-accounts-expiring select {
  height: 32px !important; padding: 0 10px !important; font-size: .8125rem !important; color: #111827 !important;
  background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
#page-software-accounts-expiring .ui-x { width: 100%; overflow-x: auto; }
#page-software-accounts-expiring .ui-x > table { min-width: 900px; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th { height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important;
  border-bottom: 1px solid #E5E7EB !important; position: sticky !important; top: 0; z-index: 2; text-transform: none !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th[data-sortable]::after { content: "\\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th.is-sorted::after { content: "\\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th.is-sorted.is-desc::after { content: "\\2193"; }
#page-software-accounts-expiring .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* §31 base 层（作用域 #page-vip，已剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-vip（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-vip {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-vip, #page-vip * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-vip .pfh-title, #page-vip .v8-card-t, #page-vip .v8-kpi-v,
#page-vip .ui-strong { font-weight: 600 !important; }
#page-vip .v8-tbl thead th, #page-vip .v8-swchip, #page-vip .ui-pitem,
#page-vip .v8-tbl td strong, #page-vip .ui-btn, #page-vip .ui-plat,
#page-vip .v8-pitem-fam, #page-vip .ui-fchip { font-weight: 500 !important; }
#page-vip .v8-swchip.on, #page-vip .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-vip .v8-swlist, #page-vip .v8-swlist * { font-size: var(--fs-12) !important; }
#page-vip .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-vip .v8-swchip { font-size: var(--fs-12) !important; }
#page-vip .v8-swchip .bd, #page-vip .v8-swchip .ln { font-size: 10px !important; }
#page-vip .pfh-title { font-size: var(--fs-16) !important; }
#page-vip .pfh-meta, #page-vip .v8-caliber, #page-vip .v8-card-t small,
#page-vip .v8-empty-s, #page-vip .ui-inline-note { font-size: var(--fs-12) !important; }
#page-vip .ui-line, #page-vip .ui-plat, #page-vip .v8-kpi-l,
#page-vip .v8-kpi-s, #page-vip .v8-tbl thead th, #page-vip .ui-fam,
#page-vip .v8-help { font-size: var(--fs-11) !important; }
#page-vip .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-vip .v8-card-t { font-size: var(--fs-16) !important; }
#page-vip .v8-tbl tbody td, #page-vip .ui-btn, #page-vip .v8-psel-btn,
#page-vip .v8-psel-it, #page-vip .v8-psel-search, #page-vip .v8-empty-t,
#page-vip .ui-pitem, #page-vip .ui-fchip { font-size: var(--fs-13) !important; }
#page-vip .v8-psel-it .bd, #page-vip .ui-pitem .bd, #page-vip .ui-fchip b { font-size: var(--fs-11) !important; }
#page-vip .ui-pitem .ln { font-size: 10px !important; }
#page-vip .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-vip .bd, #page-vip .v8-kpi-v, #page-vip .v8-caliber,
#page-vip .v8-tbl td, #page-vip .v8-tbl th, #page-vip .ui-pitem .bd,
#page-vip .ui-grp-hd .n, #page-vip .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-vip .ui-btn,
#page-vip .product-focus-header .btn,
#page-vip .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-vip .ui-btn:hover,
#page-vip .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-vip .ui-btn:active { transform: translateY(1px); }
#page-vip .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-vip .ui-btn-pri,
#page-vip .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-vip .ui-btn-pri:hover,
#page-vip .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-vip .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-vip .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-vip .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-vip .ui-btn svg, #page-vip .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-vip .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-vip .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-vip .product-focus-header .back-btn { display: none !important; }
#page-vip .product-focus-header .big-icon,
#page-vip .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-vip .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-vip .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-vip .pfh-meta { color: var(--ink-3) !important; }
#page-vip .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-vip .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-vip .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-vip .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-vip #v8SwKpi { margin: 0 !important; }
#page-vip .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-vip .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-vip .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-vip .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-vip .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-vip .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-vip .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-vip .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-vip .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-vip .v8-swtbl-h, #page-vip .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-vip .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-vip .v8-card-t small { color: var(--ink-3) !important; }
#page-vip .v8-caliber { color: var(--ink-3) !important; }
#page-vip .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-vip .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-vip .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-vip .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-vip .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-vip .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-vip .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-vip .v8-tbl td:first-child, #page-vip .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-vip .v8-tbl td.ui-num, #page-vip .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-vip .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-vip .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-vip .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-vip .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-vip .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-vip .v8-empty-t { color: var(--ink-1) !important; }
#page-vip .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-vip .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-vip .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-vip .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-vip .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §31 ★ 「套餐管理」（2026-10-07）—— 复用 §28/§29 配方
 *   ★ 见规范 §八：**不要用逗号写多页选择器**（`#a, #b .child` 会让 #a 变裸选择器 -> 串页）
 * ==========================================================================*/
#page-vip:not(.active) { display: none !important; }
#page-vip .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-vip .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-vip .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-vip .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }
#page-vip .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-vip .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-vip .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-vip .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-vip .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-vip .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-vip .v8-card-h { min-height: 48px !important; padding: 0 16px !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  border-bottom: 1px solid #EEF0F3 !important; }
#page-vip .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-vip .v8-card-b { padding: 16px !important; }
#page-vip .v8-empty-ico { display: none !important; }
html[data-ds-skin="on"] #page-vip .v8-btn { height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important; border-radius: 6px !important; font-size: .8125rem !important; font-weight: 500 !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-vip .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-vip .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-vip .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-vip input[type=text], html[data-ds-skin="on"] #page-vip input[type=number],
html[data-ds-skin="on"] #page-vip input[type=search], html[data-ds-skin="on"] #page-vip select, html[data-ds-skin="on"] #page-vip textarea {
  font-size: .8125rem !important; color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
html[data-ds-skin="on"] #page-vip input[type=text], html[data-ds-skin="on"] #page-vip input[type=number],
html[data-ds-skin="on"] #page-vip input[type=search], html[data-ds-skin="on"] #page-vip select { height: 32px !important; padding: 0 10px !important; }
html[data-ds-skin="on"] #page-vip input:focus-visible, html[data-ds-skin="on"] #page-vip select:focus-visible,
html[data-ds-skin="on"] #page-vip textarea:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
#page-vip .ui-x { width: 100%; overflow-x: auto; }
#page-vip .ui-x > table { min-width: 900px; }
html[data-ds-skin="on"] #page-vip table thead th { height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important;
  border-bottom: 1px solid #E5E7EB !important; position: sticky !important; top: 0; z-index: 2; text-transform: none !important; }
html[data-ds-skin="on"] #page-vip table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-vip table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-vip table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-vip table thead th[data-sortable]::after { content: "\\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-vip table thead th.is-sorted::after { content: "\\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-vip table thead th.is-sorted.is-desc::after { content: "\\2193"; }
#page-vip .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* §31 base 层（作用域 #page-banners，已剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-banners（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-banners {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-banners, #page-banners * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-banners .pfh-title, #page-banners .v8-card-t, #page-banners .v8-kpi-v,
#page-banners .ui-strong { font-weight: 600 !important; }
#page-banners .v8-tbl thead th, #page-banners .v8-swchip, #page-banners .ui-pitem,
#page-banners .v8-tbl td strong, #page-banners .ui-btn, #page-banners .ui-plat,
#page-banners .v8-pitem-fam, #page-banners .ui-fchip { font-weight: 500 !important; }
#page-banners .v8-swchip.on, #page-banners .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-banners .v8-swlist, #page-banners .v8-swlist * { font-size: var(--fs-12) !important; }
#page-banners .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-banners .v8-swchip { font-size: var(--fs-12) !important; }
#page-banners .v8-swchip .bd, #page-banners .v8-swchip .ln { font-size: 10px !important; }
#page-banners .pfh-title { font-size: var(--fs-16) !important; }
#page-banners .pfh-meta, #page-banners .v8-caliber, #page-banners .v8-card-t small,
#page-banners .v8-empty-s, #page-banners .ui-inline-note { font-size: var(--fs-12) !important; }
#page-banners .ui-line, #page-banners .ui-plat, #page-banners .v8-kpi-l,
#page-banners .v8-kpi-s, #page-banners .v8-tbl thead th, #page-banners .ui-fam,
#page-banners .v8-help { font-size: var(--fs-11) !important; }
#page-banners .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-banners .v8-card-t { font-size: var(--fs-16) !important; }
#page-banners .v8-tbl tbody td, #page-banners .ui-btn, #page-banners .v8-psel-btn,
#page-banners .v8-psel-it, #page-banners .v8-psel-search, #page-banners .v8-empty-t,
#page-banners .ui-pitem, #page-banners .ui-fchip { font-size: var(--fs-13) !important; }
#page-banners .v8-psel-it .bd, #page-banners .ui-pitem .bd, #page-banners .ui-fchip b { font-size: var(--fs-11) !important; }
#page-banners .ui-pitem .ln { font-size: 10px !important; }
#page-banners .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-banners .bd, #page-banners .v8-kpi-v, #page-banners .v8-caliber,
#page-banners .v8-tbl td, #page-banners .v8-tbl th, #page-banners .ui-pitem .bd,
#page-banners .ui-grp-hd .n, #page-banners .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-banners .ui-btn,
#page-banners .product-focus-header .btn,
#page-banners .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-banners .ui-btn:hover,
#page-banners .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-banners .ui-btn:active { transform: translateY(1px); }
#page-banners .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-banners .ui-btn-pri,
#page-banners .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-banners .ui-btn-pri:hover,
#page-banners .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-banners .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-banners .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-banners .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-banners .ui-btn svg, #page-banners .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-banners .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-banners .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-banners .product-focus-header .back-btn { display: none !important; }
#page-banners .product-focus-header .big-icon,
#page-banners .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-banners .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-banners .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-banners .pfh-meta { color: var(--ink-3) !important; }
#page-banners .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-banners .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-banners .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-banners .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-banners #v8SwKpi { margin: 0 !important; }
#page-banners .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-banners .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-banners .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-banners .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-banners .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-banners .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-banners .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-banners .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-banners .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-banners .v8-swtbl-h, #page-banners .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-banners .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-banners .v8-card-t small { color: var(--ink-3) !important; }
#page-banners .v8-caliber { color: var(--ink-3) !important; }
#page-banners .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-banners .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-banners .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-banners .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-banners .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-banners .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-banners .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-banners .v8-tbl td:first-child, #page-banners .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-banners .v8-tbl td.ui-num, #page-banners .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-banners .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-banners .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-banners .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-banners .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-banners .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-banners .v8-empty-t { color: var(--ink-1) !important; }
#page-banners .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-banners .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-banners .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-banners .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-banners .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §31 ★ 「活动 Banner」（2026-10-07）—— 复用 §28/§29 配方
 *   ★ 见规范 §八：**不要用逗号写多页选择器**（`#a, #b .child` 会让 #a 变裸选择器 -> 串页）
 * ==========================================================================*/
#page-banners:not(.active) { display: none !important; }
#page-banners .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-banners .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-banners .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-banners .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }
#page-banners .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-banners .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-banners .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-banners .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-banners .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-banners .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-banners .v8-card-h { min-height: 48px !important; padding: 0 16px !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  border-bottom: 1px solid #EEF0F3 !important; }
#page-banners .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-banners .v8-card-b { padding: 16px !important; }
#page-banners .v8-empty-ico { display: none !important; }
html[data-ds-skin="on"] #page-banners .v8-btn { height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important; border-radius: 6px !important; font-size: .8125rem !important; font-weight: 500 !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-banners .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-banners .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-banners .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-banners input[type=text], html[data-ds-skin="on"] #page-banners input[type=number],
html[data-ds-skin="on"] #page-banners input[type=search], html[data-ds-skin="on"] #page-banners select, html[data-ds-skin="on"] #page-banners textarea {
  font-size: .8125rem !important; color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
html[data-ds-skin="on"] #page-banners input[type=text], html[data-ds-skin="on"] #page-banners input[type=number],
html[data-ds-skin="on"] #page-banners input[type=search], html[data-ds-skin="on"] #page-banners select { height: 32px !important; padding: 0 10px !important; }
html[data-ds-skin="on"] #page-banners input:focus-visible, html[data-ds-skin="on"] #page-banners select:focus-visible,
html[data-ds-skin="on"] #page-banners textarea:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
#page-banners .ui-x { width: 100%; overflow-x: auto; }
#page-banners .ui-x > table { min-width: 900px; }
html[data-ds-skin="on"] #page-banners table thead th { height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important;
  border-bottom: 1px solid #E5E7EB !important; position: sticky !important; top: 0; z-index: 2; text-transform: none !important; }
html[data-ds-skin="on"] #page-banners table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-banners table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-banners table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-banners table thead th[data-sortable]::after { content: "\\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-banners table thead th.is-sorted::after { content: "\\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-banners table thead th.is-sorted.is-desc::after { content: "\\2193"; }
#page-banners .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }

/* §31 base 层（作用域 #page-conversion-settings，已剔 display）*/
/* ============================================================================
 * 后台重设计 · BASE 层（令牌 / 排版 / 表面 / 控件）—— v2
 * 作用域：#page-conversion-settings（页面内容挂载点）
 * ----------------------------------------------------------------------------
 * 实测依据 _adm_island/ui_audit.json：
 *   · 字重 600 占 85%（182+36+2 个元素 >=600）-> 层级被抹平
 *   · 字号 13 档：9 / 9.5 / 10 / 10.5 / 11 / 11.5 / 12 / 12.5 / 13 / 14 / 14.5 / 18 / 30
 *   · 投影只有 1~2 种，圆角 8 种 -> 「没有层次感」的根因是**没有高度词汇**
 *   · 字体栈首项 -apple-system 在 Windows 不生效 -> 拉丁字母落到微软雅黑
 * ==========================================================================*/

#page-conversion-settings {
  --ui-font: "Segoe UI Variable Text", "Segoe UI", -apple-system, BlinkMacSystemFont,
             "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei",
             system-ui, sans-serif;
  --ui-mono: "Cascadia Mono", "Consolas", "SF Mono", Menlo, monospace;

  --ink-1: #111827;   /* on #FFF = 15.6:1 */
  --ink-2: #4B5563;   /*        7.6:1 */
  --ink-3: #6B7280;   /*        4.8:1  ← 小字下限，不许再浅 */
  --ink-accent: #0B5FD0;

  --surface: #FFFFFF;
  --surface-2: #F7F8FA;
  --surface-3: #F1F3F5;
  --line: #E5E7EB;
  --line-2: #EEF0F3;

  --accent: #1677FF;
  --accent-soft: rgba(22, 119, 255, .08);
  --accent-line: rgba(22, 119, 255, .30);

  --e1: 0 1px 2px rgba(16, 24, 40, .06);
  --e2: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --e3: 0 12px 28px -14px rgba(16, 24, 40, .22);

  --r-1: 4px; --r-2: 6px; --r-3: 8px;

  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-16: 1rem; --fs-20: 1.25rem;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  font-family: var(--ui-font) !important;
  font-size: var(--fs-13) !important;
  line-height: 1.5 !important;
  color: var(--ink-1) !important;
  letter-spacing: 0 !important;
}

/* ---- 字重：只有三种角色（正文 400 / 标签与选中 500 / 区块标题与页题 600）---- */
#page-conversion-settings, #page-conversion-settings * { font-weight: 400 !important; letter-spacing: 0 !important; }
#page-conversion-settings .pfh-title, #page-conversion-settings .v8-card-t, #page-conversion-settings .v8-kpi-v,
#page-conversion-settings .ui-strong { font-weight: 600 !important; }
#page-conversion-settings .v8-tbl thead th, #page-conversion-settings .v8-swchip, #page-conversion-settings .ui-pitem,
#page-conversion-settings .v8-tbl td strong, #page-conversion-settings .ui-btn, #page-conversion-settings .ui-plat,
#page-conversion-settings .v8-pitem-fam, #page-conversion-settings .ui-fchip { font-weight: 500 !important; }
#page-conversion-settings .v8-swchip.on, #page-conversion-settings .ui-pitem.on { font-weight: 600 !important; }

/* ---- 字号：每个角色一个值（原来 13 档，现在 6 档）---- */
#page-conversion-settings .v8-swlist, #page-conversion-settings .v8-swlist * { font-size: var(--fs-12) !important; }
#page-conversion-settings .v8-swlist-lb b { font-size: var(--fs-12) !important; }
#page-conversion-settings .v8-swchip { font-size: var(--fs-12) !important; }
#page-conversion-settings .v8-swchip .bd, #page-conversion-settings .v8-swchip .ln { font-size: 10px !important; }
#page-conversion-settings .pfh-title { font-size: var(--fs-16) !important; }
#page-conversion-settings .pfh-meta, #page-conversion-settings .v8-caliber, #page-conversion-settings .v8-card-t small,
#page-conversion-settings .v8-empty-s, #page-conversion-settings .ui-inline-note { font-size: var(--fs-12) !important; }
#page-conversion-settings .ui-line, #page-conversion-settings .ui-plat, #page-conversion-settings .v8-kpi-l,
#page-conversion-settings .v8-kpi-s, #page-conversion-settings .v8-tbl thead th, #page-conversion-settings .ui-fam,
#page-conversion-settings .v8-help { font-size: var(--fs-11) !important; }
#page-conversion-settings .v8-kpi-v { font-size: var(--fs-16) !important; }
#page-conversion-settings .v8-card-t { font-size: var(--fs-16) !important; }
#page-conversion-settings .v8-tbl tbody td, #page-conversion-settings .ui-btn, #page-conversion-settings .v8-psel-btn,
#page-conversion-settings .v8-psel-it, #page-conversion-settings .v8-psel-search, #page-conversion-settings .v8-empty-t,
#page-conversion-settings .ui-pitem, #page-conversion-settings .ui-fchip { font-size: var(--fs-13) !important; }
#page-conversion-settings .v8-psel-it .bd, #page-conversion-settings .ui-pitem .bd, #page-conversion-settings .ui-fchip b { font-size: var(--fs-11) !important; }
#page-conversion-settings .ui-pitem .ln { font-size: 10px !important; }
#page-conversion-settings .v8-empty-ico { font-size: 0 !important; }

/* 数字等宽 */
#page-conversion-settings .bd, #page-conversion-settings .v8-kpi-v, #page-conversion-settings .v8-caliber,
#page-conversion-settings .v8-tbl td, #page-conversion-settings .v8-tbl th, #page-conversion-settings .ui-pitem .bd,
#page-conversion-settings .ui-grp-hd .n, #page-conversion-settings .ui-fchip b {
  font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1;
}

/* ---- 控件：一套按钮词汇 ---- */
#page-conversion-settings .ui-btn,
#page-conversion-settings .product-focus-header .btn,
#page-conversion-settings .product-focus-header .btn-icon {
  display: inline-flex !important; align-items: center; gap: 6px;
  height: 30px !important; padding: 0 10px !important;
  font-family: var(--ui-font) !important;
  color: var(--ink-1) !important; background: var(--surface) !important;
  border: 1px solid var(--line) !important; border-radius: var(--r-2) !important;
  cursor: pointer; white-space: nowrap; box-shadow: none !important;
  transition: background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
#page-conversion-settings .ui-btn:hover,
#page-conversion-settings .product-focus-header .btn:hover { background: var(--surface-3) !important; border-color: #D8DCE2 !important; }
#page-conversion-settings .ui-btn:active { transform: translateY(1px); }
#page-conversion-settings .ui-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#page-conversion-settings .ui-btn-pri,
#page-conversion-settings .product-focus-header .btn-primary {
  background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
}
#page-conversion-settings .ui-btn-pri:hover,
#page-conversion-settings .product-focus-header .btn-primary:hover { background: #0E6AE8 !important; border-color: #0E6AE8 !important; }
#page-conversion-settings .ui-btn-danger { color: #B42318 !important; border-color: #F0C9C4 !important; }
#page-conversion-settings .ui-btn-danger:hover { background: #FEF3F2 !important; border-color: #E9A9A1 !important; }
#page-conversion-settings .ui-btn-ico { width: 30px !important; padding: 0 !important; justify-content: center; }
#page-conversion-settings .ui-btn svg, #page-conversion-settings .product-focus-header .btn svg {
  width: 14px; height: 14px; flex: 0 0 14px; stroke: currentColor; fill: none;
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
#page-conversion-settings .v8-actsep { display: none !important; }

/* ---- 产品头：两行式（图标 + 名称 + 业务线 / meta + 操作组）---- */
#page-conversion-settings .product-focus-header {
  display: flex !important; align-items: center !important; gap: var(--sp-4) !important;
  height: auto !important; padding: var(--sp-4) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
#page-conversion-settings .product-focus-header .back-btn { display: none !important; }
#page-conversion-settings .product-focus-header .big-icon,
#page-conversion-settings .product-focus-header img {
  width: 40px !important; height: 40px !important; flex: 0 0 40px !important;
  border-radius: var(--r-3) !important; background: var(--surface-3) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  font-size: var(--fs-16) !important; font-weight: 600 !important; color: var(--ink-2) !important;
  object-fit: contain; border: 1px solid var(--line-2) !important;
}
#page-conversion-settings .pfh-main { flex: 1 1 auto !important; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#page-conversion-settings .pfh-title {
  display: flex !important; align-items: center !important; gap: var(--sp-2) !important;
  font-size: var(--fs-16) !important; line-height: 1.25 !important; color: var(--ink-1) !important;
}
#page-conversion-settings .pfh-meta { color: var(--ink-3) !important; }
#page-conversion-settings .ui-acts { display: flex !important; align-items: center !important; gap: var(--sp-2) !important; flex: 0 0 auto; }
#page-conversion-settings .ui-acts .ui-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* 业务线标签：文字，不靠颜色猜 */
#page-conversion-settings .ui-line {
  display: inline-flex !important; align-items: center; height: 18px; padding: 0 6px;
  border-radius: var(--r-1); background: var(--accent-soft); color: var(--ink-accent) !important;
  white-space: nowrap;
}
#page-conversion-settings .ui-line.is-off { background: rgba(183, 121, 31, .12); color: #8A5A12 !important; }

/* ---- 统计带：4 个无间隙盒子 -> 一条单行、发丝线分隔的统计带（无卡片）---- */
#page-conversion-settings #v8SwKpi { margin: 0 !important; }
#page-conversion-settings .v8-kpis {
  display: flex !important; align-items: stretch !important; gap: 0 !important;
  height: 48px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--line) !important; box-shadow: none !important;
}
#page-conversion-settings .v8-kpi {
  flex: 1 1 0 !important; min-width: 0; height: 48px !important;
  padding: 0 var(--sp-4) !important; gap: 0 !important;
  background: transparent !important; border: 0 !important;
  border-left: 1px solid var(--line-2) !important; border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important; grid-template-columns: 1fr auto !important;
  align-items: center !important; column-gap: var(--sp-2) !important;
}
#page-conversion-settings .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-conversion-settings .v8-kpi-l { grid-column: 1; color: var(--ink-3) !important; white-space: nowrap; }
#page-conversion-settings .v8-kpi-v { grid-column: 2; color: var(--ink-1) !important; line-height: 1.1 !important; }
#page-conversion-settings .v8-kpi-s { display: none !important; }          /* 副标题与标签重复，删掉 */
/* 「全部产品」这一格是上下文说明，不是指标：不做大数字 */
#page-conversion-settings .ui-kpi-global {
  flex: 0 0 auto !important; display: flex !important; align-items: center !important;
  padding-right: 0 !important; padding-left: var(--sp-4) !important;
}
#page-conversion-settings .ui-kpi-global .v8-kpi-l {
  grid-column: auto; color: var(--ink-3) !important; font-weight: 400 !important;
}
#page-conversion-settings .ui-kpi-global .v8-kpi-l b { font-weight: 600 !important; color: var(--ink-2) !important; }

/* ---- 版本列表 ---- */
#page-conversion-settings .v8-swtbl-h, #page-conversion-settings .v8-card-h {
  padding: var(--sp-4) 0 var(--sp-2) !important; border-bottom: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
#page-conversion-settings .v8-card-t { color: var(--ink-1) !important; gap: var(--sp-2) !important; align-items: baseline !important; }
#page-conversion-settings .v8-card-t small { color: var(--ink-3) !important; }
#page-conversion-settings .v8-caliber { color: var(--ink-3) !important; }
#page-conversion-settings .v8-help {
  width: 15px; height: 15px; border: 1px solid var(--line) !important; border-radius: 50%;
  color: var(--ink-3) !important; background: var(--surface-2) !important;
}
#page-conversion-settings .v8-card {
  border: 1px solid var(--line) !important; border-radius: var(--r-3) !important;
  box-shadow: var(--e1) !important; background: var(--surface) !important; overflow: hidden;
}
#page-conversion-settings .v8-tbl { width: 100%; border-collapse: collapse !important; }
#page-conversion-settings .v8-tbl thead th {
  height: 34px !important; padding: 0 var(--sp-4) !important; text-align: left;
  color: var(--ink-3) !important; text-transform: none !important; letter-spacing: .02em !important;
  background: var(--surface-2) !important; border-bottom: 1px solid var(--line) !important;
  white-space: nowrap;
}
#page-conversion-settings .v8-tbl tbody td {
  height: 42px !important; padding: 0 var(--sp-4) !important;
  color: var(--ink-1) !important; background: transparent;
  border-bottom: 1px solid var(--line-2) !important; vertical-align: middle !important;
}
#page-conversion-settings .v8-tbl tbody tr:last-child td { border-bottom: 0 !important; }
#page-conversion-settings .v8-tbl tbody tr:hover td { background: #FAFBFC !important; }
#page-conversion-settings .v8-tbl td:first-child, #page-conversion-settings .v8-tbl th:first-child { padding-left: var(--sp-4) !important; }
/* 价格右对齐（数字列） */
#page-conversion-settings .v8-tbl td.ui-num, #page-conversion-settings .v8-tbl th.ui-num { text-align: right !important; }

/* 平台徽章（替代 🪟 / 🍎 emoji） */
#page-conversion-settings .ui-plat {
  display: inline-flex !important; align-items: center; height: 20px; padding: 0 7px;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink-2) !important; white-space: nowrap;
}
#page-conversion-settings .ui-plat.is-mac { color: #8A4B6B !important; border-color: #EBD3DF !important; background: #FDF6F9 !important; }

/* ---- 空态：去掉 30px emoji ---- */
#page-conversion-settings .v8-empty {
  padding: var(--sp-6) var(--sp-5) !important; display: flex !important;
  flex-direction: column !important; align-items: center !important; gap: var(--sp-2) !important;
  background: var(--surface) !important;
}
#page-conversion-settings .v8-empty-ico { width: 28px; height: 28px; margin-bottom: var(--sp-1); }
#page-conversion-settings .v8-empty-ico::before {
  content: "" !important; display: block; width: 28px; height: 28px;
  background: no-repeat center/28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpath d='M3.3 7 12 12l8.7-5M12 22V12'/%3E%3C/svg%3E");
}
#page-conversion-settings .v8-empty-t { color: var(--ink-1) !important; }
#page-conversion-settings .v8-empty-s { color: var(--ink-3) !important; max-width: 46ch; text-align: center; }

/* ---- 家族徽标（替代 emoji 图标）---- */
#page-conversion-settings .ui-fam {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-1); flex: 0 0 18px;
  background: var(--surface-3) !important; color: var(--ink-2) !important; letter-spacing: 0 !important;
}
#page-conversion-settings .ui-fam.adb { background: #FDECEF !important; color: #B42318 !important; }
#page-conversion-settings .ui-fam.atd { background: #E8F1FE !important; color: #0B5FD0 !important; }
#page-conversion-settings .ui-fam.off { background: #EAF6EF !important; color: #1F7A4D !important; }


/* ============================================================================
 * §31 ★ 「转化对接设置」（2026-10-07）—— 复用 §28/§29 配方
 *   ★ 见规范 §八：**不要用逗号写多页选择器**（`#a, #b .child` 会让 #a 变裸选择器 -> 串页）
 * ==========================================================================*/
#page-conversion-settings:not(.active) { display: none !important; }
#page-conversion-settings .v8-wrap { display: flex !important; flex-direction: column !important; gap: 16px !important; }
#page-conversion-settings .page-title { font-size: 1.25rem !important; font-weight: 600 !important; color: #111827 !important; letter-spacing: -.01em !important; }
#page-conversion-settings .page-subtitle { font-size: .75rem !important; font-weight: 400 !important; color: #6B7280 !important; }
#page-conversion-settings .page-header { padding: 24px 0 12px !important; border-bottom: 1px solid #E5E7EB; align-items: flex-end; }
#page-conversion-settings .v8-kpis { display: flex !important; align-items: stretch !important; gap: 0 !important;
  min-height: 56px !important; background: transparent !important; border-bottom: 1px solid #E5E7EB !important;
  border-radius: 0 !important; box-shadow: none !important; }
#page-conversion-settings .v8-kpi { flex: 1 1 0 !important; min-width: 0 !important; min-height: 56px !important;
  display: grid !important; grid-template-columns: 1fr auto !important; align-items: center !important;
  column-gap: 12px !important; padding: 0 16px !important; background: transparent !important;
  border: 0 !important; border-left: 1px solid #EEF0F3 !important; border-radius: 0 !important; box-shadow: none !important; }
#page-conversion-settings .v8-kpi:first-child { border-left: 0 !important; padding-left: 0 !important; }
#page-conversion-settings .v8-kpi-l { grid-column: 1; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important; }
#page-conversion-settings .v8-kpi-v { grid-column: 2; font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; font-variant-numeric: tabular-nums; }
#page-conversion-settings .v8-card { background: #fff !important; border: 1px solid #E5E7EB !important; border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.06) !important; overflow: hidden !important; }
#page-conversion-settings .v8-card-h { min-height: 48px !important; padding: 0 16px !important; display: flex !important;
  align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  border-bottom: 1px solid #EEF0F3 !important; }
#page-conversion-settings .v8-card-t { font-size: 1rem !important; font-weight: 600 !important; color: #111827 !important; }
#page-conversion-settings .v8-card-b { padding: 16px !important; }
#page-conversion-settings .v8-empty-ico { display: none !important; }
html[data-ds-skin="on"] #page-conversion-settings .v8-btn { height: 32px !important; min-height: 32px !important;
  padding: 0 12px !important; border-radius: 6px !important; font-size: .8125rem !important; font-weight: 500 !important;
  display: inline-flex !important; align-items: center !important; gap: 6px !important; box-shadow: none !important; white-space: nowrap; }
html[data-ds-skin="on"] #page-conversion-settings .v8-btn-pri { background: #1677FF !important; border: 1px solid #1677FF !important; color: #fff !important; }
html[data-ds-skin="on"] #page-conversion-settings .v8-btn:not(.v8-btn-pri) { background: #fff !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
html[data-ds-skin="on"] #page-conversion-settings .v8-btn:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
html[data-ds-skin="on"] #page-conversion-settings input[type=text], html[data-ds-skin="on"] #page-conversion-settings input[type=number],
html[data-ds-skin="on"] #page-conversion-settings input[type=search], html[data-ds-skin="on"] #page-conversion-settings select, html[data-ds-skin="on"] #page-conversion-settings textarea {
  font-size: .8125rem !important; color: #111827 !important; background: #fff !important;
  border: 1px solid #E5E7EB !important; border-radius: 6px !important; box-shadow: none !important; }
html[data-ds-skin="on"] #page-conversion-settings input[type=text], html[data-ds-skin="on"] #page-conversion-settings input[type=number],
html[data-ds-skin="on"] #page-conversion-settings input[type=search], html[data-ds-skin="on"] #page-conversion-settings select { height: 32px !important; padding: 0 10px !important; }
html[data-ds-skin="on"] #page-conversion-settings input:focus-visible, html[data-ds-skin="on"] #page-conversion-settings select:focus-visible,
html[data-ds-skin="on"] #page-conversion-settings textarea:focus-visible { outline: 2px solid #1677FF !important; outline-offset: 1px !important; }
#page-conversion-settings .ui-x { width: 100%; overflow-x: auto; }
#page-conversion-settings .ui-x > table { min-width: 900px; }
html[data-ds-skin="on"] #page-conversion-settings table thead th { height: 34px !important; padding: 0 16px !important; text-align: left !important;
  background: #F7F8FA !important; font-size: .6875rem !important; font-weight: 500 !important; color: #6B7280 !important;
  border-bottom: 1px solid #E5E7EB !important; position: sticky !important; top: 0; z-index: 2; text-transform: none !important; }
html[data-ds-skin="on"] #page-conversion-settings table tbody td { height: 44px !important; padding: 0 16px !important; font-size: .8125rem !important;
  color: #111827 !important; border-bottom: 1px solid #EEF0F3 !important; vertical-align: middle !important; }
html[data-ds-skin="on"] #page-conversion-settings table tbody tr:hover td { background: #FAFBFC !important; }
html[data-ds-skin="on"] #page-conversion-settings table thead th[data-sortable] { cursor: pointer; user-select: none; }
html[data-ds-skin="on"] #page-conversion-settings table thead th[data-sortable]::after { content: "\\2195"; margin-left: 6px; font-size: 10px; color: #B4B9C2; }
html[data-ds-skin="on"] #page-conversion-settings table thead th.is-sorted::after { content: "\\2191"; color: #1677FF; }
html[data-ds-skin="on"] #page-conversion-settings table thead th.is-sorted.is-desc::after { content: "\\2193"; }
#page-conversion-settings .ui-live { font-size: .75rem; color: #6B7280; margin: 8px 0 0; }


/* ============================================================================
 * §25 ★ 订单页表头吸顶修复（2026-10-12）
 *
 * 【症状】滚动订单明细时，表头被顶部固定栏逐级切掉，滚到底整行消失
 *          —— 用户反馈的"订单管理界面表头显示不全"
 *          scrollY  440 -> 表头 y=79  可见 40px（完整）
 *          scrollY  460 -> 表头 y=59  被盖 17px 可见 23px
 *          scrollY  480 -> 表头 y=39  被盖 37px 可见  3px
 *          scrollY >=500 -> 被盖 40px 可见  0px（全无）
 *
 * 【根因】th 的 position:sticky 从来没生效过 —— 被两层 overflow 吃掉：
 *         ① #page-orders .v8-tbl   overflow:hidden   （index.html 的 .table 规则，为圆角裁切）
 *         ② #page-orders .ord-x     overflow-x:auto  （§23 为窄屏横滑加的包裹层）
 *         最近的"非 visible 祖先"因此成了滚不动的滚动容器，sticky 变成空操作。
 *         ★ admin_v8_light.css:1661 早就记录过这个坑：
 *           "admin_v7.css:327 有【全局 table{overflow:hidden}】-> 会让 sticky 表头失效/被裁 ✗"
 *         ③ 即使生效，§23 写的 top:0 / z-index:2 也会钻进固定顶栏
 *           （.v7-topbar 是 position:fixed; z-index:100; height:76px）底下 ✗
 *
 * 【修法】放开这两层 overflow，让 sticky 相对页面滚动容器生效；
 *         吸顶偏移改用现成变量 --v7-topbar-height(76px)，正好停在顶栏下沿；
 *         overflow:visible 会丢掉表格 8px 圆角裁切 -> 用单元格圆角补回
 *         （角部像素差 125px -> 2px，观感与修复前一致 ✓）
 *
 * 【窄屏兜底】≤1400px 横滑优先（回到修复前行为），并把 top 复位为 0：
 *         窄屏下 .ord-x 仍是滚动容器，sticky 无效；若保留 top:76px，
 *         sticky 会把表头往下推 76px 压在数据行上 ✗
 *
 * 【实测】1440/1680/1920 全部滚动位置：表头 y=76，被盖 0px，可见 40px（完整）✓
 *         1280 与修复前逐项一致（容器内横滑 146px，页面 0 横向溢出）✓
 *
 * 【回退】cp -p _bak_hdrfix_<时间戳>.admin_v8_skin.css admin_v8_skin.css
 *         cp -p _bak_hdrfix_<时间戳>.index.html       index.html
 * ==========================================================================*/
#page-orders table.v8-tbl { overflow: visible !important; }
#page-orders .ord-x { overflow: visible !important; }
#page-orders .ord-x thead th {
  top: var(--v7-topbar-height, 76px) !important;
  z-index: 3 !important;
}
/* overflow:visible 之后，圆角裁切改由单元格自己承担（保持 8px 外观不变） */
#page-orders .ord-x thead th:first-child { border-top-left-radius: 8px !important; }
#page-orders .ord-x thead th:last-child  { border-top-right-radius: 8px !important; }
#page-orders .ord-x tbody tr:last-child td:first-child { border-bottom-left-radius: 8px !important; }
#page-orders .ord-x tbody tr:last-child td:last-child  { border-bottom-right-radius: 8px !important; }

/* 窄屏兜底：横滑优先（回到修复前行为），并复位吸顶偏移 */
@media (max-width: 1400px) {
  #page-orders .ord-x { overflow-x: auto !important; }
  #page-orders .ord-x thead th { top: 0 !important; }
}

/* ============================================================================
 * §26 ★ 订单筛选条「挤在一起」修复（2026-10-12）  方案 B2：地板修正版
 *
 * 【症状】宽屏下筛选条整条挤成一团：订单号/手机 输入框只剩 22-33px、
 *         状态下拉只剩一个箭头、日期框显示不全 —— 客户反馈「这里还是挤在一起」
 *         实测：视口 1520-2560 全部 5 个控件被压到 22-36px（<78px 即不可用）✗
 *
 * 【根因】两条规则互相打架，不是某一处写错：
 *         ① §16 写死 flex-wrap: nowrap !important（注释写着「★ 一行」），
 *            只在 <=1460px 才回退折行 -> 宽屏反而比窄屏更挤 ✗
 *         ② §24 后加的状态芯片行 .ord-chips 本是 width:100% 的整行设计，
 *            却是 .orders-filter-bar 的直接子元素 -> nowrap 下它和 8 个筛选控件
 *            抢同一行，实测独占 1244px，把其余控件挤到 22px ✗
 *
 * 【本方案】B 的意图 + 修掉 B 的两个实测缺陷：
 *         ① 解开 §16 的强制单行，把状态芯片行放回它自己的整行（发丝线分隔）
 *         ② 宽度地板加在「承载文字」的控件上：select 104 / 关键词 170 / 日期各 132
 *            ★ 关键：不动 .filter-group 的 flex（保留 §16 的 flex:1 1 120px 可收缩）
 *              否则各字段组按内容自然宽度排版，1440 下整行需要 1247px > 可用 1164px，
 *              会把「时间 起 ~ 止」挤到两行 ✗（实测踩过）
 *         ③ 作者化断点：<=1420px 收一点地板，保证 >=1366 日期范围都不被拆
 *         ④ 口径说明恢复完整文案（上一轮 max-width:1.15em 把它压成一个「订」）
 *
 * 【实测 · 1100→2560 全宽度扫频】
 *         修复前：1520 1600 1760 1920 2100 2436 2560 全部「挤 5 个」✗
 *         修复后：与「方案 A」问题面完全一致（仅 1200/1280 日期拆行，与修复前相同，非本次引入）
 *                 1366 / 1440 / 1520 / 1600 / 1760 / 1920 / 2100 / 2436 / 2560 全部 OK ✓
 *         最窄控件：宽屏 132px（修复前 33px）；条高：>=1760 为 107px（修复前 67px）
 *         对比：同族的「B」会在 1366（常见笔记本宽）把日期范围拆到两行 ✗，B2 不会
 *
 * 【回退】cp -p _bak_fltfix_<时间戳>.admin_v8_skin.css admin_v8_skin.css
 *         cp -p _bak_fltfix_<时间戳>.index.html       index.html
 * ==========================================================================*/
html[data-ds-skin="on"] #page-orders .orders-filter-bar{
  flex-wrap: wrap !important; gap: 8px 12px !important;
  align-items: center !important; justify-content: flex-start !important;
}
html[data-ds-skin="on"] #page-orders .ord-chips{
  flex: 0 0 100% !important; padding-bottom: 10px !important;
  border-bottom: 1px solid #EEF0F3 !important; margin-bottom: 2px !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar input,
html[data-ds-skin="on"] #page-orders .orders-filter-bar select{
  box-sizing: border-box !important; white-space: nowrap !important; overflow: visible !important;
}
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > select{ min-width: 104px !important; max-width: 220px !important; }
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-kw > input{ min-width: 170px !important; max-width: 360px !important; }
html[data-ds-skin="on"] #page-orders #ordDateFrom,
html[data-ds-skin="on"] #page-orders #ordDateTo{ flex: 0 0 132px !important; width: 132px !important; min-width: 132px !important; }
html[data-ds-skin="on"] #page-orders .ds-date-sep{ flex: 0 0 auto !important; margin: 0 4px !important; }
html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets{ flex: 0 0 auto !important; margin-left: 2px !important; }
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions{ flex: 0 0 auto !important; margin-left: auto !important; gap: 8px !important; }
html[data-ds-skin="on"] #page-orders .orders-filter-bar .v8-caliber{
  max-width: none !important; width: auto !important; overflow: visible !important;
  white-space: nowrap !important; flex: 0 0 auto !important;
}
@media (max-width: 1420px){
  html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group > select{ min-width: 96px !important; }
  html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-kw > input{ min-width: 150px !important; }
  html[data-ds-skin="on"] #page-orders #ordDateFrom,
  html[data-ds-skin="on"] #page-orders #ordDateTo{ flex: 0 0 126px !important; width: 126px !important; min-width: 126px !important; }
}

/* ============================================================================
 * §27 ★ 其它页面的 sticky 表头修复（2026-10-12）
 *
 * 【背景】订单页的表头吸顶问题（§25）修完后逐页体检，发现另外 7 个页面是
 *         同一套写法、同一个病根。其中「用户与会员」今天就是坏的：
 *           · 50 行数据、页面可滚 1820px
 *           · 滚到 910 / 1820 时表头**完全看不见**（可见 0 / 34px）✗
 *         其余 6 页现在"看着正常"只是因为数据还不够长没滚起来，
 *         构造完全一样，数据一多就会同样坏。
 *
 * 【根因】和订单页同源，但这里多一层 —— 表头到页面之间有【三层】overflow：
 *           table.v8-tbl  overflow:hidden   （圆角裁切 + admin_v7.css:327 全局 table{overflow:hidden}）
 *           div.ui-x      overflow:auto     （横向滚动包裹层）
 *           div.v8-card   overflow:hidden   （卡片圆角裁切）
 *         三层任意一层不是 visible，sticky 的"最近滚动容器"就变成那个滚不动的盒子，
 *         position:sticky 退化成空操作 ✗
 *         另外 §12 里给这些页写的 top:0 也会让表头钻进 76px 高的固定顶栏底下 ✗
 *
 * 【修法】用 `*:has(table)` 一次清掉该页里【所有】指向表格的 overflow 祖先 ——
 *         不再靠手工枚举类名（实测踩过坑：漏掉一个匿名 div 就会让 sticky 生效，
 *         但 top:76px 会把表头往下推 42px、压在数据行上 ✗，激活申请页复现过）。
 *         吸顶偏移用现成变量 --v7-topbar-height(76px)，正好停在顶栏下沿。
 *
 * 【实测 · 1440x900，改前 / 改后 对照】
 *           页面          可滚   改后吸顶   表头压数据行   像素差异
 *           用户与会员     1820   是 ✓       否 ✓          0.088%
 *           账号池         194    不需要     否 ✓          0.216%
 *           激活申请       0      不需要     否 ✓          0.241%
 *           VIP套餐        140    不需要     否 ✓          0.203%
 *           转化对接设置   481    不需要     否 ✓          0.000%
 *           （截图噪声基线实测为 0 像素，上表差异为真实变化，均在表头背景/圆角处）
 *         修复前「用户与会员」滚到底表头可见 0/34px -> 修复后吸顶在 y=76 ✓
 *
 * 【回退】cp -p _bak_sticky7_<时间戳>.admin_v8_skin.css admin_v8_skin.css
 *         cp -p _bak_sticky7_<时间戳>.index.html       index.html
 * ==========================================================================*/

/* ---- 用户与会员 ---- */
html[data-ds-skin="on"] #page-users *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-users table { overflow: visible !important; }
html[data-ds-skin="on"] #page-users table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- 账号池 ---- */
html[data-ds-skin="on"] #page-software-accounts *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-software-accounts table { overflow: visible !important; }
html[data-ds-skin="on"] #page-software-accounts table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- 快到期名单 ---- */
html[data-ds-skin="on"] #page-software-accounts-expiring *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring table { overflow: visible !important; }
html[data-ds-skin="on"] #page-software-accounts-expiring table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- 激活申请 ---- */
html[data-ds-skin="on"] #page-activation-requests *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-activation-requests table { overflow: visible !important; }
html[data-ds-skin="on"] #page-activation-requests table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- VIP套餐 ---- */
html[data-ds-skin="on"] #page-vip *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-vip table { overflow: visible !important; }
html[data-ds-skin="on"] #page-vip table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- 活动Banner ---- */
html[data-ds-skin="on"] #page-banners *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-banners table { overflow: visible !important; }
html[data-ds-skin="on"] #page-banners table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ---- 转化对接设置 ---- */
html[data-ds-skin="on"] #page-conversion-settings *:has(table) { overflow: visible !important; }
html[data-ds-skin="on"] #page-conversion-settings table { overflow: visible !important; }
html[data-ds-skin="on"] #page-conversion-settings table thead th {
  top: var(--v7-topbar-height, 76px) !important; z-index: 3 !important; }

/* ============================================================================
 * §27b ★ §27 的窄屏收口（2026-10-12）
 *
 * 【问题】§27 把表格的横滑包裹层 div.ui-x 的 overflow 放开后，窄屏下表格不再
 *         在包裹层里横滑，而是把【整个页面】撑出横向滚动条：
 *           1280px：账号池 +27px / 激活申请 +66px / 转化对接设置 +87px ✗
 *           1366px：转化对接设置 +1px
 *         实测 >=1400px 时全部页面 0 横向溢出 ✓
 *
 * 【修法】<=1399px 时，给这三页恢复"包裹层横滑"（回到修复前行为），
 *         并把吸顶偏移复位为 0（此时包裹层又是滚动容器，sticky 本就不生效；
 *         若保留 top:76px，sticky 会把表头往下推、压在数据行上 ✗）
 *
 * 【为什么只收这三页】实测 1280px 下：
 *           用户与会员  0 横向溢出 -> 保留全程吸顶 ✓
 *           VIP套餐    0 横向溢出 -> 保留全程吸顶 ✓
 *           账号池/激活申请/转化对接设置  会被撑出 -> 窄屏收口
 *
 * 【实测】收口后 1280 / 1366 / 1400 / 1440 / 1600 / 1920 / 2436 全部 0 横向溢出；
 *         >=1400px 时「用户与会员」表头正常吸顶在 y=76 ✓
 *
 * 【回退】cp -p _bak_sticky7b_<时间戳>.admin_v8_skin.css admin_v8_skin.css
 * ==========================================================================*/
@media (max-width: 1399px) {
  html[data-ds-skin="on"] #page-software-accounts *:has(> table),
  html[data-ds-skin="on"] #page-activation-requests *:has(> table),
  html[data-ds-skin="on"] #page-conversion-settings *:has(> table) {
    overflow-x: auto !important; }
  html[data-ds-skin="on"] #page-software-accounts table thead th,
  html[data-ds-skin="on"] #page-activation-requests table thead th,
  html[data-ds-skin="on"] #page-conversion-settings table thead th {
    top: 0 !important; }
}

/* ============================================================================
 * §28 ★ 订单筛选条 · 审美三项（2026-10-12）  方案 V1+（独立评审 8/10 的方案 + 三条改进）
 *
 * 【背景】评审 agent 提了 11 条改法，客户挑出 3 条"纯审美"项：
 *           ① 重置按钮做安静   ② 状态芯片改胶囊   ③ 显式 1/2/3 行断点
 *
 * 【先量准现状，两条其实已经达标 —— 避免"改了个已经存在的东西"】
 *   · 芯片【已经是完美胶囊】：实测 .ord-chip 高 28px、border-radius 14px
 *     （正好 = 高度一半，几何上就是胶囊）-> 本次只调选中态的配色，不动形状
 *   · 条高【已经是干净的 2 档】：>=1800px = 107px；1400-1799px = 147px
 *     评审说的"67/107/147 混乱"是 §26 修复【之前】的状态，现已不成立
 *   · 真正剩下的缺陷只有一个：<=1399px（如 1280）「时间 起 ~ 止」被拆到两行 ✗
 *
 * 【本方案实际做的】
 *   ① 重置按钮：去掉底与边框（边框保留 1px 透明以锁住 32px 高度与基线），
 *      字色落到 --ds-text-3 #6B7280（实测 4.83:1，过 WCAG AA）+ 内距 10px 与芯片对齐
 *   ② 选中芯片：底色与边框同值 = 视觉无边（原来的深色边让人误以为是 focus ring），
 *      文字沿用现有选中色 #0B5FD0，把"三色套娃"收成"浅蓝垫底 + 蓝字"两段
 *   ③ 显式断点：>=1400 两档显式声明（现状已正确，仅防漂移）；<=1399 用 order 把
 *      「时间 起 ~ 止」挪到尾行（该行有富余宽度）-> 日期成对不再拆行，零高度代价
 *
 * 【★ 评审建议里的一处错误，已修正】
 *   评审让我把芯片字色改成 #1677FF，并自称 #1D6FF2 on #EEF4FF = 5.18:1。
 *   实测（真实算对比度）：#1677FF on #EEF4FF = 3.72:1 ✗；#1D6FF2 on #EEF4FF = 4.13:1 ✗
 *   两个都过不了 AA 4.5:1。改用现有选中色 #0B5FD0 -> 实测 5.34:1 ✓，且零新增颜色。
 *
 * 【实测 · 1100 / 1280 / 1366 / 1440 / 1800 / 2436 全宽度】
 *   条高：107 / 147，与修复前逐档完全一致（零回归）
 *   日期拆行：修复前 1280 = 拆 ✗  ->  修复后全宽度不拆 ✓
 *   重置按钮对比度 15.78:1 -> 4.83:1（过 AA，且不再与「查询」抢权重）
 *   重置"实体盒面积" 2016px² -> 0（不再造出第三个带框矩形）
 *   选中芯片对比度 5.23:1 -> 5.34:1 ✓
 *   页面横向溢出：全宽度 0 ✓
 *
 * 【回退】cp -p _bak_aes28_<时间戳>.admin_v8_skin.css admin_v8_skin.css
 *         cp -p _bak_aes28_<时间戳>.index.html       index.html
 * ==========================================================================*/

/* ===== ③ 显式断点：把条高钉成确定的档位，不再靠"碰巧折行" =====
 *   >=1800px  : 芯片行 + 控件行       = 2 行（实测 107px）
 *   1400-1799 : 芯片行 + 控件行       = 2 行（实测 147px）
 *   <=1399    : 芯片行 + 控件行 + 尾行 = 3 行（实测 147px，与上一档同高）
 * 只有 <=1399 需要真的改结构，见下；上面两档现状已经正确，仅显式声明防漂移 */
@media (min-width: 1400px){
  html[data-ds-skin="on"] #page-orders .orders-filter-bar{ row-gap: 8px !important; }
}
/* <=1399：用 order 把「时间 起 ~ 止」挪到尾行（与 今天/本周/本月 + 查询/重置 同行）。
 * 尾行宽度实测有富余，三个元素不会再被拆到两行 ✗（现状 1280px 就拆）
 * 为什么不改成 grid：实测 4 列网格虽也能治拆行，但条高从 147px 涨到 235px（+88px），不划算 */
@media (max-width: 1399px){
  html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-group.ds-w-date,
  html[data-ds-skin="on"] #page-orders .orders-filter-bar .ds-date-sep{ order: 5 !important; }
  html[data-ds-skin="on"] #page-orders .orders-filter-bar #v8OrdPresets{ order: 4 !important; }
}

/* ===== ① 重置按钮：纯文字（透明底 + 透明边；保留 1px 边框宽度以锁住 32px 高度与基线） =====
 * 字色 #6B7280 = 既有 token --ds-text-3，实测在 2 白底上 4.83:1，过 WCAG AA 4.5:1 */
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn-secondary{
  background: transparent !important; border-color: transparent !important;
  color: #6B7280 !important; font-weight: 400 !important; padding: 0 10px !important; }
html[data-ds-skin="on"] #page-orders .orders-filter-bar .filter-actions .btn-secondary:hover{
  background: #F1F3F5 !important; color: #1F2329 !important; }

/* ===== ② 选中芯片：底色与边框同值 = 视觉无边；字色沿用现有 #0B5FD0（5.34:1 ✓） =====
 * 原来底 #EAF2FE + 边 #BBD5FB + 字 #0B5FD0 是"三色套娃"，那道深边看着像 focus ring */
html[data-ds-skin="on"] #page-orders .ord-chip.on{
  background: #EEF4FF !important; border-color: #EEF4FF !important; color: #0B5FD0 !important; }
html[data-ds-skin="on"] #page-orders .ord-chip.on b{ color: #0B5FD0 !important; }
html[data-ds-skin="on"] #page-orders .ord-chip.on:hover{ background: #E3EDFF !important; }