/* ============================================================
   筱冉坊工作台 · 设计令牌 v1.0（批次 UX-1）
   基座：B「晨雾」（用户 2026-11-03 拍板）＋ A「静水面」数字规范
   规则：本文件在壳层内联样式之后加载——同名令牌覆盖、旧变量重映射，
   58 台内容层引用 var(--panel)/--border/--accent 等自动换肤，零逻辑变更。
   硬规则：界面禁 emoji 图标（由 wa-icons.js 自动替换为 SVG 线性图标 stroke 1.7）。
   ============================================================ */

:root{
  /* —— 晨雾 基础色 —— */
  --bg:#f4f6fb;
  --bg-soft:#f8fafe;
  --surface:#ffffff;
  --surface-2:#f5f8fc;
  --line:#e6eaf2;
  --line-soft:#eef1f7;
  --ink:#1f2740;
  --ink-2:#57627c;
  --ink-3:#66738f;
  /* —— 品牌 —— */
  --brand:#2e6be6;
  --brand-hover:#2559cf;
  --brand-ink:#1d4fc0;
  --brand-tint:#e7effe;
  --brand-line:#cfdffb;
  /* —— 六域语义色（涨跌/成败/警示） —— */
  --up:#0e7a44;      --up-tint:#e4f5ea;
  --down:#c53040;    --down-tint:#fcebee;
  --warn:#b45309;    --warn-tint:#fdf3df;
  --info:#2e6be6;    --info-tint:#e7effe;
  --neutral:#57627c; --neutral-tint:#eef1f7;
  --gold:#b45309;
  --demo-ink:#8a5a10; --demo-tint:#fdf3df; --demo-line:#f2e2bd;
  /* —— 圆角/阴影（静水面：克制） —— */
  --r-card:14px; --r-xl:18px; --r-ctl:10px;
  --shadow-1:0 1px 2px rgba(23,32,64,.05),0 10px 28px -20px rgba(23,32,64,.14);
  --shadow-2:0 2px 6px rgba(23,32,64,.06),0 18px 44px -24px rgba(23,32,64,.20);
  --shadow-pop:0 24px 70px -30px rgba(23,32,64,.35);

  /* —— 旧变量重映射（58 台内容层自动换肤的机关） —— */
  --panel:#ffffff;
  --border:var(--line);
  --text:var(--ink);
  --muted:var(--ink-2);
  --accent:var(--brand);
  --accent-light:var(--brand-tint);
  --green:var(--up);
  --red:var(--down);
}

/* —— 静水面数字规范 —— */
td, .kpi .value, .num, .badge, .rec-badge, .kanban-count,
.form-grid input, .toolbar input, .toolbar select,
#aiDrawer .aiw-input, #aiDrawer .aiw-card td {
  font-variant-numeric:tabular-nums;
}
:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; border-radius:6px; }

/* —— 图标基元（wa-icons.js 注入 SVG） —— */
.wa-ic{ width:18px; height:18px; flex:0 0 auto; display:inline-block; vertical-align:-3px; }
.nav-item .wa-ic{ width:18px; height:18px; opacity:.9; }
.nav-item.active .wa-ic{ opacity:1; }

/* ============================================================
   壳层：侧边栏（深色 → 晨雾浅色）
   ============================================================ */
body{
  background:
    radial-gradient(1100px 480px at 12% -6%, rgba(46,107,230,.07), transparent 62%),
    radial-gradient(900px 420px at 88% -4%, rgba(23,164,95,.055), transparent 58%),
    linear-gradient(180deg,#f7f9fd 0%,#f2f5fa 100%);
  background-attachment:fixed;
}
.sidebar{
  background:rgba(251,252,255,.92);
  border-right:1px solid var(--line);
  color:var(--ink-2);
  backdrop-filter:saturate(1.1);
}
.sidebar .brand{ border-bottom:1px solid var(--line-soft); }
.sidebar .brand .ws{ color:var(--ink); }
.sidebar .brand .tier{
  background:var(--brand-tint); color:var(--brand-ink);
  border:1px solid var(--brand-line); border-radius:999px;
}
.sidebar .brand .tier.pro{ background:var(--info-tint); color:var(--brand-ink); border-color:var(--brand-line); }
.sidebar .brand .tier.vip,
.sidebar .brand .tier.top{ background:var(--demo-tint); color:var(--demo-ink); border-color:var(--demo-line); }
.sidebar .brand .back{ color:var(--ink-3); }
.sidebar .brand .back:hover{ color:var(--ink); }
.sidebar .brand .ver{ color:var(--ink-3); }

.nav-item{
  color:var(--ink-2);
  border-left:3px solid transparent;
  border-radius:0 var(--r-ctl) var(--r-ctl) 0;
  margin:1px 8px; padding:9px 12px;
  transition:background .12s ease, color .12s ease;
}
.nav-item:hover{ color:var(--ink); background:var(--surface-2); }
.nav-item.active{
  color:var(--brand-ink); background:var(--brand-tint);
  border-left-color:var(--brand); font-weight:600;
}
.nav-item .icon{ width:20px; text-align:center; color:var(--ink-3); }
.nav-item:hover .icon{ color:var(--ink-2); }
.nav-item.active .icon{ color:var(--brand); }
.nav-item .lock{ color:var(--gold); }
.nav-group-title{ color:var(--ink-3); }
.nav-group-title:hover{ color:var(--ink-2); }
.nav-cat-title{ color:var(--ink-3); }
.nav-search input{
  background:var(--surface-2); color:var(--ink);
  border:1px solid var(--line);
}
.nav-search input:focus{ border-color:var(--brand); background:var(--surface); }
.nav-search input::placeholder{ color:var(--ink-3); }
.nav-market{ color:var(--brand-ink); border-top:1px solid var(--line-soft); }
.nav-market:hover{ background:var(--brand-tint); }
.nav-item.plugin{ border-left:2px solid var(--gold); }
.rec-badge{ background:linear-gradient(135deg,#e8f0fe,#dbe9fd); color:var(--brand-ink); font-weight:700; }

/* ============================================================
   壳层：顶栏 / 主区 / 常用原子
   ============================================================ */
.main-head{ background:var(--surface); border-bottom:1px solid var(--line); }
.btn{ border-radius:var(--r-ctl); }
.btn-primary{ background:var(--brand); }
.btn-primary:hover{ background:var(--brand-hover); }
.btn-outline{ background:var(--surface); color:var(--brand-ink); border:1px solid var(--brand-line); }
.btn-outline:hover{ border-color:var(--brand); background:var(--brand-tint); }
.toolbar input:focus, .toolbar select:focus{ border-color:var(--brand); }
th{ background:var(--surface-2); color:var(--ink-2); }
tr:hover td{ background:var(--surface-2); }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus{ border-color:var(--brand); }
.biz-add{ border-color:var(--brand-line); background:var(--surface); }
.kpi{ background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-1); }
.kpi .value{ color:var(--ink); }
.market-card{ background:var(--surface); border-color:var(--line); box-shadow:var(--shadow-1); }
.chip{ background:var(--surface-2); color:var(--ink-2); }
.badge-green{ background:var(--up-tint); color:var(--up); }
.badge-red{ background:var(--down-tint); color:var(--down); }
.badge-amber{ background:var(--warn-tint); color:var(--warn); }
.ws-fde-banner{ background:linear-gradient(135deg,var(--brand-tint),var(--info-tint)); border-color:var(--brand-line); }

/* —— 智能顾问悬浮球/面板 → 晨雾 —— */
.advisor-fab{ background:var(--brand); color:#fff; box-shadow:var(--shadow-2); }
.advisor-panel{ background:var(--surface); color:var(--ink); box-shadow:var(--shadow-pop); }

/* —— 首访引导 → 晨雾 —— */
.fv-card .fv-emoji{
  background:var(--brand-tint); border-radius:14px; width:56px; height:56px;
  display:flex; align-items:center; justify-content:center; margin:0 auto 10px;
  color:var(--brand);
}

/* —— wa-icons toast 图标尺寸 —— */
.wx-ico .wa-ic{ width:15px; height:15px; vertical-align:-2px; }

/* —— wa-icons toast 图标尺寸 —— */
.wx-ico .wa-ic{ width:15px; height:15px; vertical-align:-2px; }

/* —— renderTable 增强（搜索/排序/导出） —— */
.rt-wrap{ margin-bottom:14px; }
.rt-bar{ display:flex; gap:8px; margin-bottom:10px; align-items:center; }
.rt-search{ padding:7px 12px; border:1px solid var(--line); border-radius:var(--r-ctl); font-size:13px; min-width:200px; background:var(--surface); color:var(--ink); outline:none; }
.rt-search:focus{ border-color:var(--brand); }
.rt-exp{ padding:7px 14px; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-ctl); font-size:12px; cursor:pointer; color:var(--ink-2); }
.rt-exp:hover{ background:var(--brand-tint); color:var(--brand-ink); border-color:var(--brand-line); }
.rt-table-box{ overflow-x:auto; }
.rt-table th{ cursor:pointer; user-select:none; }
.rt-table th:hover{ background:var(--surface-2); }

/* —— 移动端 —— */
@media (max-width:900px){
  .sidebar{ box-shadow:var(--shadow-pop); }
}

/* ============================================================
   UX-2 增补（批次 UX-2 · v2.40.0）：login / marketing / provider / index 换装
   机制不变：本文件后加载，令牌覆盖 + 旧变量重映射，页面零逻辑变更。
   ============================================================ */
:root{
  --brand-2:#0f9b8e;            /* 晨雾青：渐变副色（蓝→青） */
  --card:var(--surface);
  --bg-soft:var(--surface-2);
  --border-strong:#d3dbee;
  --faint:var(--ink-3);
  --amber:var(--warn);
  --amber-soft:var(--warn-tint);
  --green-soft:var(--up-tint);
  --red-soft:var(--down-tint);
  --acc:var(--brand);
  --acc2:var(--brand-2);
  --accent-2:var(--brand-hover);
  --accent-3:var(--brand-2);
  --accent-hover:var(--brand-hover);
  --accent-soft:var(--brand-tint);
  --accent-text:var(--brand-ink);
  --bg-grad:linear-gradient(135deg,#101a33 0%,#16305f 55%,#2e6be6 120%);
}

/* —— login：品牌面板 深蓝紫 → 晨雾夜蓝（AI 视觉层保留，仅重着色） —— */
.brand-panel{
  background:radial-gradient(120% 120% at 20% 0%, #0b1226 0%, #0e1c3f 34%, #16305f 62%, #123a63 100%);
}
.brand-panel::before{ background:radial-gradient(circle, #2e6be6 0%, transparent 70%); }
.brand-panel::after{ background:radial-gradient(circle, #0f9b8e 0%, transparent 70%); }
.ai-grid{
  background-image:
    linear-gradient(rgba(110,150,235,0.22) 1px, transparent 1px),
    linear-gradient(90deg, rgba(110,150,235,0.22) 1px, transparent 1px);
}
.ai-core .orb{
  background:radial-gradient(circle at 32% 30%, #ffffff 0%, #9dbcf7 18%, #2e6be6 48%, #1d3f8f 78%, rgba(29,63,143,0) 100%);
  box-shadow:0 0 40px rgba(46,107,230,.75), 0 0 120px rgba(15,155,142,.45), inset 0 0 60px rgba(255,255,255,.35);
}
.ai-core .ring{ border-color:rgba(157,188,247,.55); box-shadow:0 0 18px rgba(46,107,230,.4), inset 0 0 18px rgba(46,107,230,.25); }
.ai-core .ring.r2{ border-color:rgba(31,178,166,.45); }
.ai-core .dot{ background:#cdddfb; box-shadow:0 0 12px #9dbcf7; }
@keyframes orbPulse{
  0%,100%{ transform:scale(1); box-shadow:0 0 40px rgba(46,107,230,.75), 0 0 120px rgba(15,155,142,.45), inset 0 0 60px rgba(255,255,255,.35); }
  50%{ transform:scale(1.08); box-shadow:0 0 60px rgba(46,107,230,.95), 0 0 160px rgba(15,155,142,.65), inset 0 0 80px rgba(255,255,255,.5); }
}
.ai-scan{ background:linear-gradient(180deg, transparent, rgba(110,150,235,0.16), transparent); }
.brand-logo .mark{ background:linear-gradient(135deg, #2e6be6, #0f9b8e); box-shadow:0 8px 24px rgba(46,107,230,.45); }
.brand-logo .name span{ color:#9dbcf7; }
.brand-copy h1 .hl{ background:linear-gradient(90deg, #6d9bf5, #2fc4b0); }
.form-card .field input:focus{ border-color:var(--brand); box-shadow:0 0 0 4px rgba(46,107,230,.12); }
.form-card .btn{ box-shadow:0 8px 20px rgba(46,107,230,.28); }
.form-card .btn:hover{ box-shadow:0 12px 26px rgba(46,107,230,.36); }
.form-card .btn-code:hover{ background:var(--brand-tint); }
.form-card .msg.err{ color:var(--down); }
.form-card .msg.ok{ color:var(--up); }
.feature .ic .wa-ic{ width:20px; height:20px; }

/* —— marketing：渐变与按钮色已随 --acc/--acc2 重映射为 蓝→青，仅补图标尺寸 —— */
.chain .step .si .wa-ic{ width:26px; height:26px; }
.cell b .wa-ic, .sec h2 .wa-ic{ width:18px; height:18px; vertical-align:-3px; }

/* —— provider：顶栏与徽章 → 晨雾 —— */
.topbar{ background:linear-gradient(135deg, #1a2340, #22345e); }
.topbar h1 .wa-ic{ width:18px; height:18px; vertical-align:-3px; }
.stat{ border-radius:var(--r-card); }
.stat .num{ color:var(--ink); }
.badge-active{ background:var(--up-tint); color:var(--up); }
.badge-expired{ background:var(--down-tint); color:var(--down); }
.badge-warn{ background:var(--warn-tint); color:var(--warn); }
.badge-info{ background:var(--brand-tint); color:var(--brand-ink); }
.badge-nosub{ background:var(--neutral-tint); color:var(--ink-3); }

/* —— index 门户：品牌点与玻璃顶栏（其余随变量重映射自动换肤） —— */
.header .left .logo-mark{ background:var(--brand); }

/* ============================================================
   UX-3 增补（批次 UX-3 · v2.41.0）：管理后台 / 存储扩容 / 防伪验证页
   侧栏与徽章随既有规则自动换肤；此处只补图标尺寸与零散锚点。
   ============================================================ */
.sidebar .logo{ color:var(--ink); font-weight:700; }
.badge .wa-ic{ width:13px; height:13px; vertical-align:-2px; }
.tips .wa-ic, .chart-sub .wa-ic, .secret-hint .wa-ic{ width:14px; height:14px; vertical-align:-2px; }
h1 .wa-ic, h2 .wa-ic{ width:17px; height:17px; vertical-align:-3px; }
.msg .wa-ic{ width:14px; height:14px; vertical-align:-2px; }

/* ============================================================
   UX-9 增补（批次 UX-9 · v2.51.0）：移动端适配加固
   原则：只在窄断点收窄/隐藏次要元素，不改桌面布局。
   ============================================================ */
@media (max-width: 640px){
  /* FDE 横幅窄屏换行（避免链路节点横挤） */
  .ws-fde-banner{ flex-wrap:wrap; row-gap:8px; }
}
@media (max-width: 520px){
  /* 门户 header：右侧簇收窄，绝不横向溢出——单行装不下时自动换两行 */
  .header{ padding:6px 10px; height:auto; min-height:52px; flex-wrap:wrap; row-gap:4px; }
  .header .left{ flex:1 1 auto; min-width:0; }
  .header .left h1{ max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .header .right{ gap:4px; min-width:0; flex-wrap:wrap; }
  .org-btn{ max-width:150px; }
  #orgName{ display:inline-block; max-width:104px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }
  #storageBadge{ display:none; }
  #adminBtn{ font-size:0; }
  #adminBtn svg{ width:16px; height:16px; }
  .btn-logout{ padding:6px 8px; font-size:12px; }
  /* 工作台壳顶栏两行布局的行距与右对齐（UX-9 补强） */
  .main-head{ row-gap:6px; }
  .main-head .user{ margin-left:auto; }
}

/* ============================================================
   UX-5 增补（批次 UX-5 · v2.46.0）：智能感层（V2 原型落生产 · 克制版）
   原则：科技层 ≤15% 版面；纯 CSS 零逻辑变更；prefers-reduced-motion 全静态。
   ============================================================ */

/* —— 全局：极淡点阵背景（叠加在晨雾渐变之上） —— */
body{
  background-image:
    radial-gradient(rgba(46,107,230,.05) 1px, transparent 1px),
    radial-gradient(1100px 480px at 12% -6%, rgba(46,107,230,.07), transparent 62%),
    radial-gradient(900px 420px at 88% -4%, rgba(23,164,95,.055), transparent 58%),
    linear-gradient(180deg,#f7f9fd 0%,#f2f5fa 100%);
  background-size: 24px 24px, auto, auto, auto;
}

/* —— 顶栏玻璃拟态（工作台壳） —— */
.main-head{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(10px) saturate(1.15);
  -webkit-backdrop-filter:blur(10px) saturate(1.15);
}

/* —— FDE 证据横幅：引擎运转感（aurora 光晕 + 缓慢扫光） —— */
.ws-fde-banner{
  border-color:var(--brand-line);
  box-shadow:0 12px 32px -18px rgba(46,107,230,.35), 0 12px 32px -18px rgba(15,155,142,.22);
  position:relative;
  overflow:hidden;
}
.ws-fde-banner::after{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  background:linear-gradient(110deg, transparent 32%, rgba(255,255,255,.55) 50%, transparent 68%);
  transform:translateX(-120%);
  animation:waSweep 7s ease-in-out infinite;
}
@keyframes waSweep{
  0%{ transform:translateX(-120%); }
  55%,100%{ transform:translateX(120%); }
}

/* —— 智能顾问悬浮球：呼吸光晕 —— */
.advisor-fab{
  animation:waBreath 3.6s ease-in-out infinite;
}
@keyframes waBreath{
  0%,100%{ box-shadow:var(--shadow-2); }
  50%{ box-shadow:0 0 0 7px rgba(46,107,230,.16), var(--shadow-2); }
}

/* —— KPI 卡：轻悬浮反馈 —— */
.kpi{ transition:box-shadow .18s ease, transform .18s ease; }
.kpi:hover{ box-shadow:var(--shadow-2); transform:translateY(-1px); }

/* —— 减少动态：全静态 —— */
@media (prefers-reduced-motion: reduce){
  .ws-fde-banner::after{ animation:none; display:none; }
  .advisor-fab{ animation:none; }
  .kpi{ transition:none; }
  .kpi:hover{ transform:none; }
}

/* —— UX-19 组合AB基建：密度体系 + AI小队令牌（只增不废；密度 UX-21 全站生效） —— */
:root{
  --row-h:48px; --row-h-c:38px;              /* 表格行高：舒适/紧凑 */
  --row-pad:12px; --row-pad-c:8px;           /* 行内边距：舒适/紧凑 */
  --surf-0:#f4f6fb; --surf-1:#ffffff; --surf-2:#f8fafd; --surf-3:#eef2f9; /* 表面分层 S0~S3 */
  --role-emp:#2e6be6;                        /* AI 角色·数字员工（蓝） */
  --role-fde:#b07908;                        /* AI 角色·FDE 筱匠（琥珀，复用既有暖色） */
  --role-ai:#0f9b8e;                         /* AI 角色·台AI（青） */
  --ai-grad:linear-gradient(135deg,#2e6be6 0%,#0f9b8e 100%); /* AI 渐变（面板/头像/身份条） */
  --ai-rail-w:48px; --ai-panel-w:340px;      /* AI 面板：收起/展开宽 */
  --detail-w:300px;                          /* 右侧详情面板宽（UX-21） */
  --work-min-w:620px;                        /* 工作区最小可用宽（红线：<1280 保底） */
}
[data-density="compact"]{ --row-h:var(--row-h-c); --row-pad:var(--row-pad-c); }

/* ============================================================
   UX-C 增补（UX-23 · 内容页色彩体系（专家C方案落地，用户拍板开工））：内容页色彩体系
   原则：只增不废；纯 CSS 零逻辑变更；工具感优先（中性承载仍最大层）；
   科技层 ≤15% 版面红线不变；prefers-contrast:more 回退纯中性。
   机制：同 UX-1/UX-5，本文件后加载，令牌覆盖 + 选择器覆盖即生效。
   ============================================================ */

/* —— C1. 行业域色族（8 族，色值取自 demo.html 已验证 wtile 色板） —— */
:root{
  --dom-blue:#1d4fc0;    --dom-blue-tint:#e7effe;    --dom-blue-line:#cfdffb;
  --dom-teal:#0d7d78;    --dom-teal-tint:#e0f4f2;    --dom-teal-line:#c5e9e5;
  --dom-green:#0c7a43;   --dom-green-tint:#e4f5ea;   --dom-green-line:#cdebd8;
  --dom-amber:#a85e08;   --dom-amber-tint:#fdf0dd;   --dom-amber-line:#f2e2bd;
  --dom-rose:#bb3361;    --dom-rose-tint:#fceaf0;    --dom-rose-line:#f7d6e2;
  --dom-violet:#5b47c2;  --dom-violet-tint:#ece9fb;  --dom-violet-line:#ddd6f6;
  --dom-indigo:#2f549d;  --dom-indigo-tint:#e8eefb;  --dom-indigo-line:#d4e0f6;
  --dom-graphite:#47577a;--dom-graphite-tint:#edf0f6;--dom-graphite-line:#dde3ee;

  /* 当前台域色：缺省岩蓝；由 workspace-app.js 启动时按台 code 切换（见 4.4） */
  --dom:var(--dom-blue);
  --dom-tint:var(--dom-blue-tint);
  --dom-line:var(--dom-blue-line);

  /* —— C2. 页面头（内容页色彩叙事的锚点） —— */
  --pagehead-wash:linear-gradient(118deg,var(--dom-tint) 0%,rgba(255,255,255,0) 72%);
  --pagehead-rail:linear-gradient(90deg,var(--dom) 0%,var(--dom-line) 46%,rgba(255,255,255,0) 100%);

  /* —— C3. 卡片光影（微 sheen + 色温阴影 + 顶亮边） —— */
  --card-sheen:linear-gradient(180deg,#ffffff 0%,#fafcff 100%);
  --card-topline:inset 0 1px 0 rgba(255,255,255,.9);
  --shadow-t1:0 1px 2px rgba(23,32,64,.04),0 10px 26px -18px rgba(46,107,230,.18);
  --shadow-t2:0 2px 6px rgba(23,32,64,.05),0 16px 40px -22px rgba(46,107,230,.28);
  --kpi-lead-shadow:0 12px 34px -24px rgba(46,107,230,.5),0 1px 2px rgba(23,32,64,.04);

  /* —— C4. 表格氛围 —— */
  --th-bg:linear-gradient(180deg,#f3f7fe 0%,#eef3fb 100%);
  --th-ink:var(--ink-2);
  --th-rule:2px solid var(--dom-line);
  --row-hover:#f2f6fd;

  /* —— C5. 状态轨与焦点数字 —— */
  --rail-w:3px;
  --grad-focus:linear-gradient(100deg,#1d4fc0 8%,#0d7d78 52%,#0c7a43 92%);
}

/* —— C6. 暗色模式（内容层首个暗色层：html[data-theme="dark"]） —— */
[data-theme="dark"]{
  --bg:#0c1220; --bg-soft:#0f1526; --surface:#121a2e; --surface-2:#182238;
  --surf-0:#0c1220; --surf-1:#121a2e; --surf-2:#182238; --surf-3:#1d2842;
  --line:#24304c; --line-soft:#1d2740;
  --ink:#e8edfa; --ink-2:#aab6d3; --ink-3:#7f8cad;
  --brand:#5a8cf0; --brand-hover:#7aa2f5; --brand-ink:#9dbcf7;
  --brand-tint:rgba(90,140,240,.16); --brand-line:rgba(90,140,240,.32);
  --up:#4cc38a;    --up-tint:rgba(76,195,138,.16);
  --down:#f08a97;  --down-tint:rgba(240,138,151,.14);
  --warn:#e5b566;  --warn-tint:rgba(229,181,102,.14);
  --neutral-tint:rgba(175,188,214,.14);
  /* 域色暗色值（提亮至可作文字/线；tint 转 alpha 形态自动贴合暗面） */
  --dom-blue:#8fb2f9;    --dom-blue-tint:rgba(77,124,243,.16);   --dom-blue-line:rgba(77,124,243,.34);
  --dom-teal:#6fd3c9;    --dom-teal-tint:rgba(13,125,120,.22);   --dom-teal-line:rgba(13,125,120,.42);
  --dom-green:#7fd3a3;   --dom-green-tint:rgba(12,122,67,.24);   --dom-green-line:rgba(12,122,67,.44);
  --dom-amber:#e5b566;   --dom-amber-tint:rgba(168,94,8,.22);    --dom-amber-line:rgba(168,94,8,.42);
  --dom-rose:#f095b5;    --dom-rose-tint:rgba(187,51,97,.20);    --dom-rose-line:rgba(187,51,97,.40);
  --dom-violet:#b3a8f2;  --dom-violet-tint:rgba(91,71,194,.22);  --dom-violet-line:rgba(91,71,194,.42);
  --dom-indigo:#a3b8e8;  --dom-indigo-tint:rgba(47,84,157,.26);  --dom-indigo-line:rgba(47,84,157,.46);
  --dom-graphite:#aebad0;--dom-graphite-tint:rgba(71,87,122,.26);--dom-graphite-line:rgba(71,87,122,.46);
  /* C2-C5 暗色映射 */
  --pagehead-wash:linear-gradient(118deg,var(--dom-tint) 0%,rgba(12,18,32,0) 72%);
  --pagehead-rail:linear-gradient(90deg,var(--dom) 0%,var(--dom-line) 46%,rgba(12,18,32,0) 100%);
  --card-sheen:linear-gradient(180deg,#15203a 0%,#121a2e 100%);
  --card-topline:inset 0 1px 0 rgba(255,255,255,.06);
  --shadow-t1:0 1px 2px rgba(0,0,0,.32),0 10px 26px -18px rgba(0,0,0,.5);
  --shadow-t2:0 2px 6px rgba(0,0,0,.36),0 16px 40px -22px rgba(0,0,0,.62);
  --kpi-lead-shadow:0 12px 34px -24px rgba(77,124,243,.55),0 1px 2px rgba(0,0,0,.32);
  --th-bg:linear-gradient(180deg,#151f38 0%,#111a30 100%);
  --th-rule:2px solid var(--dom-line);
  --row-hover:#17223c;
  --grad-focus:linear-gradient(100deg,#9dbcf7 8%,#6fd3c9 52%,#7fd3a3 92%);
}
[data-theme="dark"] body{
  background:
    radial-gradient(1100px 480px at 12% -6%, rgba(77,124,243,.10), transparent 62%),
    radial-gradient(900px 420px at 88% -4%, rgba(13,125,120,.08), transparent 58%),
    linear-gradient(180deg,#0d1424 0%,#0b111f 100%);
  background-attachment:fixed;
}

/* —— C7. 内容层选择器覆盖（58 台零逻辑变更，同 UX-5 机制） —— */
/* 页面头：行业色洗染 + 域色下缘光轨（每页一处） */
.main-head{
  background:var(--pagehead-wash),var(--surface);
  border-bottom:1px solid var(--line);
  position:relative;
}
.main-head::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--pagehead-rail);opacity:.6;pointer-events:none;
}
.kpi-grid > .kpi-card:first-child{
  border-color:var(--brand-line);
  box-shadow:var(--card-topline),var(--kpi-lead-shadow);
}
/* 表格：域色表头 + 色温悬浮 */
th{
  background:var(--th-bg);
  color:var(--th-ink);
  border-bottom:var(--th-rule);
  font-weight:600;
  letter-spacing:.01em;
}
tr:hover td{ background:var(--row-hover); }
table{ box-shadow:var(--shadow-t1); }
/* 工具条与表单：品牌焦点光环 */
.toolbar input:focus,.toolbar select:focus,
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(46,107,230,.12);
}
/* 新建区：域色淡染，标识「可写区」 */
.biz-add{
  background:linear-gradient(180deg,var(--dom-tint) 0%,var(--surface) 42%);
  border-color:var(--dom-line);
}
/* 徽章对齐品牌（badge-blue 不再吃 THEMES 的 --accent） */
.badge-blue{ background:var(--brand-tint); color:var(--brand-ink); }
/* 看板列：晨雾分层 */
.kanban-col{ background:var(--surface-2); }
.kanban-count{ background:var(--brand-tint); color:var(--brand-ink); }
/* 行状态轨钩子（P2：待回款/异常行由模板加 data-st="down|warn"） */
tr[data-st="down"] td:first-child{ box-shadow:inset var(--rail-w) 0 0 var(--down); }
tr[data-st="warn"] td:first-child{ box-shadow:inset var(--rail-w) 0 0 var(--warn); }
/* 高对比偏好：回退纯中性 */
@media (prefers-contrast: more){
  .main-head{ background:var(--surface); }
  .main-head::after{ display:none; }
  .kpi-card,.biz-add{ background:var(--surface); }
  th{ background:var(--surface-2); border-bottom:1px solid var(--line); }
}

/* —— UX-23 P0 止血：B58 四台总览 KPI 卡结构（专家B方案，此前零定义裸 div 渲染）—— */
.kpi-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin:12px 0 20px; }
.kpi-card{ background:var(--card-sheen,#fff); border:1px solid var(--line); border-radius:12px; padding:15px 16px 12px; box-shadow:var(--card-topline,none),var(--shadow-t1,none); min-height:112px; transition:box-shadow .18s ease, transform .18s ease; }
.kpi-card:hover{ box-shadow:var(--card-topline,none),var(--shadow-t2,none); transform:translateY(-1px); }
.kpi-label{ font-size:12.5px; color:var(--ink-2,#5a6478); font-weight:600; }
.kpi-value{ font-size:26px; font-weight:700; letter-spacing:-.5px; color:var(--ink,#1a2337); margin-top:6px; font-variant-numeric:tabular-nums; }
.kpi-sub{ font-size:11.5px; color:var(--ink-3,#8a94ad); margin-top:6px; }

/* ============================================================
   UX-24（B70）：台账页美学（专家A方案 M1-M4/M6）——卡头/空态三件套/数字列/状态chip/合计行
   ============================================================ */
/* M1 卡头与分组 */
.toolbar.lc-head{ align-items:center; gap:10px; }
.lc-title{ display:flex; align-items:baseline; gap:8px; }
.lc-count{ font-size:11.5px; color:var(--ink-3,#8a94ad); font-weight:500; }
.lc-groups{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.lc-ghost{ border-style:dashed; }
.lc-menu{ position:relative; display:inline-block; }
.lc-drop{ position:absolute; right:0; top:calc(100% + 4px); z-index:30; min-width:148px; background:var(--surface,#fff); border:1px solid var(--line,#e4e8f2); border-radius:10px; box-shadow:0 10px 28px -12px rgba(15,23,42,.22); padding:5px; }
.lc-drop button{ display:block; width:100%; text-align:left; border:none; background:none; font-size:12.5px; padding:8px 12px; border-radius:7px; cursor:pointer; color:var(--ink,#1a2337); }
.lc-drop button:hover{ background:var(--brand-tint,rgba(46,107,230,.08)); color:var(--brand-ink,#1f57cc); }
/* M2 空态三件套 */
.eg-grid{ display:grid; grid-template-columns:110px 1fr 190px; gap:18px; align-items:center; padding:26px 22px; }
.eg-art{ display:flex; align-items:center; justify-content:center; }
.eg-main{ min-width:0; }
.eg-steps{ display:flex; gap:14px; margin-top:12px; font-size:11.5px; color:var(--ink-3,#8a94ad); flex-wrap:wrap; }
.eg-steps b{ display:inline-block; width:16px; height:16px; line-height:16px; text-align:center; border-radius:50%; background:var(--dom-tint,#e7effe); color:var(--dom,#1d4fc0); font-size:10px; margin-right:4px; }
.eg-ghost{ background:var(--surface-2,#f8fafc); border:1px dashed var(--line,#e4e8f2); border-radius:10px; padding:10px 12px; }
.eg-g-title{ font-size:10.5px; color:var(--ink-3,#8a94ad); margin-bottom:6px; letter-spacing:.04em; }
.eg-g-row{ display:flex; align-items:center; gap:7px; padding:4px 0; }
.eg-g-row i{ width:9px; height:9px; border-radius:3px; background:var(--dom-line,#cfdffb); }
.eg-g-row b{ font-size:11px; color:var(--ink-2,#5a6478); font-weight:500; }
@media (max-width:900px){ .eg-grid{ grid-template-columns:1fr; } .eg-ghost{ display:none; } }
/* M3 数字列 */
th.c-num, td.c-num{ text-align:right; font-variant-numeric:tabular-nums; }
td.c-num{ font-weight:560; letter-spacing:-.01em; }
/* M4 状态 chip */
.st{ display:inline-block; font-size:11px; font-weight:600; border-radius:8px; padding:2px 9px; line-height:1.55; white-space:nowrap; }
.st-up{ background:var(--up-tint,rgba(16,163,74,.12)); color:var(--up,#0f7b3d); }
.st-down{ background:var(--down-tint,rgba(207,58,63,.10)); color:var(--down,#cf3a3f); }
.st-warn{ background:var(--warn-tint,rgba(214,138,7,.13)); color:#a85e08; }
.st-neutral{ background:var(--neutral-tint,#eef1f6); color:var(--ink-2,#5a6478); }
.yen{ font-size:.82em; color:var(--ink-3,#8a94ad); margin-right:1px; font-weight:400; }
/* M6 合计行 */
tfoot td{ background:var(--surface-2,#f6f8fc); font-weight:650; font-variant-numeric:tabular-nums; border-top:2px solid var(--dom-line,#dfe6f3); }
tfoot td.c-num{ text-align:right; }

/* ============================================================
   UX-25（B71）：总览页 KPI 升级（专家B方案 P1）——图标chip/环比/微图/量纲/AI洞察条
   ============================================================ */
.kpi-card .db-kpi-ic{ display:inline-flex; width:22px; height:22px; border-radius:7px; background:var(--dom-tint,#e7effe); color:var(--dom,#1d4fc0); align-items:center; justify-content:center; margin-right:7px; vertical-align:-5px; }
.kpi-card .db-kpi-ic svg{ width:13px; height:13px; }
.kpi-card .db-scope{ float:right; font-size:10px; color:var(--ink-3,#8a94ad); font-weight:400; margin-top:2px; }
.kpi-card .db-unit{ font-size:14px; font-weight:400; color:var(--ink-2,#5a6478); margin-left:3px; }
.db-delta-row{ margin-top:4px; }
.db-delta{ font-size:11px; font-weight:600; border-radius:6px; padding:1.5px 7px; }
.db-delta.up{ background:var(--up-tint,rgba(16,163,74,.12)); color:var(--up,#0f7b3d); }
.db-delta.down{ background:var(--down-tint,rgba(207,58,63,.10)); color:var(--down,#cf3a3f); }
.db-delta.warn{ background:var(--warn-tint,rgba(214,138,7,.13)); color:#a85e08; }
.db-delta.flat{ background:#eef1f6; color:var(--ink-2,#5a6478); }
.kpi-card.kpi-zero .kpi-value{ color:var(--ink-3,#a0aac0); }
.kpi-card.kpi-zero{ border-style:dashed; }
/* AI 洞察条 */
.db-ai{ display:flex; align-items:center; gap:12px; background:linear-gradient(100deg,var(--dom-tint,#e7effe) 0%,var(--surface,#fff) 45%); border:1px solid var(--dom-line,#cfdffb); border-radius:12px; padding:11px 16px; margin-bottom:16px; font-size:13px; line-height:1.65; }
.db-ai .db-ai-ic{ flex:0 0 30px; height:30px; border-radius:9px; background:var(--grad-focus,linear-gradient(100deg,#1d4fc0,#0d7d78)); display:flex; align-items:center; justify-content:center; color:#fff; }
.db-ai .db-ai-ic svg{ width:16px; height:16px; }
.db-ai b{ color:var(--dom,#1d4fc0); }

/* ============================================================
   UX-26（P2）：图表区四件套 + AI 洞察条
   ============================================================ */
.db-chart{ display:flex; align-items:center; gap:14px; }
.db-legend{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.db-legend-item{ font-size:11.5px; color:var(--ink-2,#5a6478); display:flex; align-items:center; gap:6px; white-space:nowrap; }
.db-legend-item i{ width:9px; height:9px; border-radius:3px; flex:0 0 auto; }
.db-legend-item b{ color:var(--ink,#1a2337); font-weight:600; font-variant-numeric:tabular-nums; }
.db-hbar-row{ display:flex; align-items:center; gap:10px; margin-bottom:7px; }
.db-hbar-lbl{ flex:0 0 110px; font-size:12px; color:var(--ink-2,#5a6478); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.db-hbar-track{ flex:1; height:16px; background:var(--surface-2,#f0f3f9); border-radius:5px; overflow:hidden; }
.db-hbar-fill{ height:100%; background:linear-gradient(90deg,var(--dom,#2e6be6),var(--dom,#2e6be6)cc); border-radius:5px 3px 3px 5px; min-width:3px; transition:width .5s ease; }
.db-hbar-val{ flex:0 0 auto; font-size:12px; font-weight:600; color:var(--ink,#1a2337); font-variant-numeric:tabular-nums; min-width:52px; }
.db-dv-row{ display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.db-dv-track{ flex:1; display:flex; height:18px; }
.db-dv-l{ flex:1; display:flex; align-items:center; justify-content:flex-end; position:relative; }
.db-dv-lf{ height:100%; background:#c8cfdd; border-radius:4px 0 0 4px; }
.db-dv-l i{ position:absolute; right:6px; font-size:10.5px; color:#5a6478; font-style:normal; font-variant-numeric:tabular-nums; }
.db-dv-r{ flex:1; display:flex; align-items:center; position:relative; }
.db-dv-rf{ height:100%; background:var(--dom,#2e6be6); border-radius:0 4px 4px 0; }
.db-dv-rf.db-dv-over{ background:var(--warn,#d68a07); }
.db-dv-r i{ position:absolute; left:6px; font-size:10.5px; color:#1a2337; font-style:normal; font-weight:600; font-variant-numeric:tabular-nums; }
@media (prefers-reduced-motion: reduce){ .db-hbar-fill{ transition:none; } }

/* ============================================================
   UX-27（P3）：图表色序令牌 + M7 表单升级 + M8 编辑弹层 + 暗色开关
   ============================================================ */
:root{
  --chart-1:#2e6be6; --chart-2:#0d7d78; --chart-3:#7c5cf0;
  --chart-4:#a85e08; --chart-5:#0e7490; --chart-6:#bb3361;
}
[data-theme="dark"]{
  --chart-1:#6d9df5; --chart-2:#5fc4b9; --chart-3:#a78ef5;
  --chart-4:#e5b566; --chart-5:#5db8d4; --chart-6:#e58ab0;
}
/* M7：新增/编辑表单升级 */
.biz-add{ border-radius:14px; }
.biz-add-head{ font-size:14px; font-weight:700; display:flex; align-items:center; gap:8px; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line,#e4e8f2); }
.biz-add-head::before{ content:""; width:4px; height:18px; border-radius:3px; background:var(--dom,#2e6be6); }
.form-grid{ grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px 14px; }
.form-grid label{ font-size:12px; font-weight:600; color:var(--ink-2,#5a6478); margin-bottom:5px; display:block; }
.form-grid input, .form-grid select, .form-grid textarea{
  border:1px solid var(--line,#d5dae6); border-radius:9px; padding:9px 12px; font-size:13px;
  background:var(--surface,#fff); color:var(--ink,#1a2337); outline:none; transition:border-color .15s ease,box-shadow .15s ease;
}
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus{
  border-color:var(--dom,#2e6be6); box-shadow:0 0 0 3px var(--dom-tint,rgba(46,107,230,.10));
}
.biz-actions{ display:flex; gap:8px; justify-content:flex-end; margin-top:14px; padding-top:12px; border-top:1px solid var(--line-soft,#eef1f6); }
/* M8：编辑弹层 */
.biz-modal-mask{ position:fixed; inset:0; z-index:200; background:rgba(15,23,42,.42); display:flex; align-items:center; justify-content:center; backdrop-filter:blur(2px); }
.biz-modal{ background:var(--surface,#fff); border-radius:16px; max-width:640px; width:92%; max-height:82vh; overflow:auto; padding:22px 24px; box-shadow:0 24px 60px -20px rgba(15,23,42,.25); }
.biz-modal h3{ font-size:15px; font-weight:700; margin:0 0 16px; display:flex; align-items:center; gap:8px; }
.biz-modal h3::before{ content:""; width:4px; height:18px; border-radius:3px; background:var(--dom,#2e6be6); }
[data-theme="dark"] .biz-modal-mask{ background:rgba(0,0,0,.55); }
[data-theme="dark"] .biz-modal{ background:var(--surface,#121a2e); }
/* 暗色开关 pill */
.theme-toggle{ position:fixed; bottom:18px; right:18px; z-index:50; width:42px; height:42px; border-radius:50%; border:1px solid var(--line,#d5dae6); background:var(--surface,#fff); color:var(--ink-2,#5a6478); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:18px; box-shadow:0 4px 14px -4px rgba(15,23,42,.15); transition:transform .15s ease; }
.theme-toggle:hover{ transform:scale(1.08); }

/* UX-29：钉住引导脉冲动画 */
@keyframes wa-pin-pulse { 0%,100% { opacity:1; } 50% { opacity:.3; background:rgba(46,107,230,.18); } }