 


 
 

 
/* ============================================================================
 * 对比度修复 · 双轨规范（T2-10 · 2026-10-05）
 * ----------------------------------------------------------------------------
 * 本文件所有"对比度修复"类规则，统一遵循以下口径，禁止自由发挥：
 *
 * 1) 双轨选择（只走两条合规轨道之一）：
 *    A. 文字令牌轨道（首选）：文字在某**正确**背景上不够清晰时，调整**文字令牌**
 *       （--c-text-*）到该背景上的合规色，背景保持设计值不变。
 *    B. 背景令牌轨道：当**表层本身配色错误**（如卡片底色取错档）时，调整**背景
 *       令牌**（--c-bg-*），文字保持。
 * 2) 禁止"改背景令牌救文字"路线：保留错误的文字色、仅为把对比度数值推过 WCAG 线
 *    而扭曲/提亮背景表面——这会破坏设计语言，并连带影响同背景的其它组件。
 * 3) 令牌化强制：任何对比度修复**必须**通过 --c-text-* / --c-bg-* 语义令牌实现，
 *    禁止裸 hex 救火；现成令牌值不合适时，新增专用令牌（双主题对齐），不得内联写死。
 * 4) !important 对位：仅当被覆盖的原始规则带 !important 时，修复规则才带 !important。
 * 5) 复验闸门：改动任何暗色令牌/文字色后，必须跑
 *    `node _design_review_20261002/s2b_runtime.mjs` 复验暗色对比度不引入新回归
 *    （暗色是全站最高频回归区）。
 *
 * 既有修复索引（均已走文字轨道、已令牌化）：
 *   · 暗态 .c-text-secondary / .page-head p / .intro-note / .comp-tag → --c-text-on-dark-soft
 *   · 亮态 .page-head p / .intro-note / .comp-tag                → --c-text-on-light-soft
 *   · 亮态 .nav-subitem-desc（侧栏渐变中段注解）              → --c-text-sidebar-desc
 * ========================================================================== */

:root {
  
  --c-primary: #0369A1;
  --c-primary-light: #0B6FB8;
  --c-primary-bright: #009FE3;
  --c-primary-bg: #0B3A5C;
  --c-primary-dark: #7DD3FC;
  --c-primary-text: #7DD3FC;
  --c-primary-gradient: var(--c-primary);
  --c-primary-dim: rgba(0,159,227,0.18);

  
  --c-accent: #0E7490;
  --c-accent-light: #4FC3F7;
  --c-accent-bg: #0B2A4A;
  --c-accent-gradient: var(--c-accent);

   
  --c-bg-sidebar-start: #0B2A5B;
  --c-bg-sidebar-mid: #0E3E86;
  --c-bg-sidebar-end: #0A2350;
  --c-text-sidebar: #B8CDEC;
  --c-text-sidebar-icon: #7FA8DC;

   
  --radius-card: 14px;
  --radius-btn: 10px;
  --radius-input: 10px;
  --radius-tag: 8px;
  --radius-modal: 14px;
  --radius-md: 12px;
  --radius-sm: 10px;

   
  --shadow-card: 0 1px 2px rgba(0,0,0,0.25), 0 8px 24px -10px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.05);
  --shadow-card-hover: 0 2px 6px rgba(0,0,0,0.28), 0 18px 44px -14px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06);
  --shadow-dropdown: 0 12px 32px rgba(0,0,0,0.45);
  --shadow-modal: 0 24px 60px rgba(0,0,0,0.55);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.25);
  --shadow-card-2: 0 1px 2px rgba(0,0,0,0.22), 0 10px 28px -8px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.05);
  --shadow-card-2-hover: 0 2px 4px rgba(0,0,0,0.26), 0 20px 44px -12px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.06);
  --shadow-stat-2: 0 1px 2px rgba(0,0,0,0.20), 0 8px 22px -8px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.04);
  --shadow-stat-2-hover: 0 2px 6px rgba(0,0,0,0.24), 0 16px 36px -10px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.05);
}

 
[data-theme="light"] {
   
  --c-primary: #0369A1;
  --c-primary-light: #0B6FB8;
  --c-primary-bright: #0EA5E9;
  --c-primary-bg: #DFF4FC;
  --c-primary-dark: #0B6FB8;
  --c-primary-text: #0369A1;
  --c-primary-gradient: var(--c-primary);
  --c-primary-dim: rgba(0,159,227,0.10);

  --c-accent: #0E7490;
  --c-accent-light: #0891B2;
  --c-accent-bg: #DFF6FB;
  --c-accent-gradient: var(--c-accent);

   
  --c-bg-sidebar-start: #0B2A5B;
  --c-bg-sidebar-mid: #123E7A;
  --c-bg-sidebar-end: #0E2F5E;
  --c-text-sidebar: #B8CDEC;
  --c-text-sidebar-icon: #7FA8DC;

  --radius-card: 14px;
  --radius-btn: 10px;
  --radius-input: 10px;
  --radius-tag: 8px;
  --radius-modal: 14px;
  --radius-md: 12px;
  --radius-sm: 10px;

  --shadow-card: 0 1px 3px rgba(15,23,42,0.06), 0 10px 28px -12px rgba(15,23,42,0.14);
  --shadow-card-hover: 0 4px 16px rgba(15,23,42,0.10), 0 14px 36px -14px rgba(15,23,42,0.16);
  --shadow-dropdown: 0 12px 32px rgba(15,23,42,0.14);
  --shadow-modal: 0 24px 60px rgba(15,23,42,0.22);
  --shadow-sm: 0 1px 2px rgba(15,23,42,0.06);
  --shadow-card-2: 0 1px 3px rgba(15,23,42,0.06), 0 12px 30px -12px rgba(15,23,42,0.14);
  --shadow-card-2-hover: 0 4px 14px rgba(15,23,42,0.10), 0 16px 38px -14px rgba(15,23,42,0.16);
  --shadow-stat-2: 0 1px 3px rgba(15,23,42,0.06), 0 10px 26px -12px rgba(15,23,42,0.12);
  --shadow-stat-2-hover: 0 3px 10px rgba(15,23,42,0.10), 0 14px 34px -14px rgba(15,23,42,0.16);
}

 
[data-theme="dark"] {
  --c-primary: #0369A1;
  --c-primary-light: #38BDF8;
  --c-primary-bright: #009FE3;
  --c-primary-bg: #0B3A5C;
  --c-primary-dark: #7DD3FC;
  --c-primary-text: #7DD3FC;
  --c-primary-gradient: var(--c-primary);
  --c-primary-dim: rgba(0,159,227,0.18);

  --c-accent: #22D3EE;
  --c-accent-light: #4FC3F7;
  --c-accent-bg: #0B2A4A;
  --c-accent-gradient: var(--c-accent);

   
  --c-bg-sidebar-start: #0D2030;
  --c-bg-sidebar-mid: #0A1A28;
  --c-bg-sidebar-end: #081420;
  --c-text-sidebar: #C3D7F2;
  --c-text-sidebar-icon: #8FB8E6;

  --radius-card: 14px;
  --radius-btn: 10px;
  --radius-input: 10px;
  --radius-tag: 8px;
  --radius-modal: 14px;
  --radius-md: 12px;
  --radius-sm: 10px;

  --shadow-card: 0 1px 2px rgba(0,0,0,0.25), 0 8px 24px -10px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.05);
  --shadow-card-hover: 0 2px 6px rgba(0,0,0,0.28), 0 18px 44px -14px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06);
  --shadow-dropdown: 0 12px 32px rgba(0,0,0,0.45);
  --shadow-modal: 0 24px 60px rgba(0,0,0,0.55);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.25);
  --shadow-card-2: 0 1px 2px rgba(0,0,0,0.22), 0 10px 28px -8px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.05);
  --shadow-card-2-hover: 0 2px 4px rgba(0,0,0,0.26), 0 20px 44px -12px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.06);
  --shadow-stat-2: 0 1px 2px rgba(0,0,0,0.20), 0 8px 22px -8px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.04);
  --shadow-stat-2-hover: 0 2px 6px rgba(0,0,0,0.24), 0 16px 36px -10px rgba(0,0,0,0.38), inset 0 1px 0 rgba(255,255,255,0.05);
}

 
[data-theme="dark"] .np-tab-num { color: var(--c-primary-dark) !important; }
 
[data-theme="dark"] .np-tab.active .np-tab-num { color: #fff !important; }
 
[data-theme="dark"] .tab.active,
[data-theme="dark"] .tab:hover { color: var(--c-primary-light); border-bottom-color: var(--c-primary-light); }

 
[data-theme="light"] .sidebar {
  color: var(--c-text-sidebar);
  border-right-color: rgba(255,255,255,0.06);
}
[data-theme="dark"] .sidebar {
   
  border-right: 1px solid rgba(0, 159, 227, 0.22);
  box-shadow: 4px 0 22px rgba(0, 0, 0, 0.40);
}
[data-theme="light"] .nav-section + .nav-section {
  border-top-color: rgba(255,255,255,0.08);
}
[data-theme="dark"] .tm-item.active {
  background: rgba(0,159,227,0.22);
  color: #7DD3FC;
}

 
.sidebar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #009FE3 0%, #22D3EE 50%, #4FC3F7 100%);
  z-index: 2;
  box-shadow: 0 0 12px rgba(34,211,238,0.45);
}

 
 
.nav-item:hover { background: rgba(0,159,227,0.12); color: #E4EEFC; }
.nav-item.active {
  background: linear-gradient(135deg, rgba(0,159,227,0.32) 0%, rgba(11,111,184,0.18) 100%);
  color: #fff; font-weight: 600;
  box-shadow: 0 0 0 1px rgba(0,159,227,0.22), 0 2px 8px rgba(0,159,227,0.20);
}
.nav-item.active::before {
  background: linear-gradient(180deg, #7DD3FC 0%, #009FE3 100%);
  box-shadow: 0 0 10px rgba(34,211,238,0.5);
}
.nav-item.active svg { filter: drop-shadow(0 0 6px rgba(125,211,252,0.5)); }
.nav-subitem:hover { background: rgba(0,159,227,0.10); }
 
.nav-subitem.active {
  color: #E0EEFF; font-weight: 500;
  background: linear-gradient(135deg, rgba(0,159,227,0.32) 0%, rgba(11,111,184,0.18) 100%);
  box-shadow: 0 0 0 1px rgba(0,159,227,0.25), 0 2px 8px rgba(0,159,227,0.20);
}
.nav-subitem.active:hover { background: linear-gradient(135deg, rgba(0,159,227,0.42) 0%, rgba(11,111,184,0.26) 100%); }
.nav-group.active { background: rgba(0,159,227,0.10); }

 
[data-theme="light"] .nav-item { color: #DCE9F8; }
[data-theme="light"] .nav-item:hover { background: rgba(0,159,227,0.10); color: #FFFFFF; }
[data-theme="light"] .nav-item.active {
  background: linear-gradient(135deg, #009FE3 0%, #0B6FB8 100%);
  color: #fff; font-weight: 600;
  box-shadow: 0 0 0 1px rgba(0,159,227,0.4), 0 2px 8px rgba(0,159,227,0.25);
}
[data-theme="light"] .nav-item.active::before {
  background: linear-gradient(180deg, #7DD3FC 0%, #009FE3 100%); box-shadow: none;
}
 
[data-theme="light"] .nav-subitem.active {
  color: #fff; font-weight: 600;
  background: linear-gradient(135deg, #009FE3 0%, #0B6FB8 100%);
  box-shadow: 0 0 0 1px rgba(0,159,227,0.4), 0 2px 8px rgba(0,159,227,0.25);
}
[data-theme="light"] .nav-subitem.active:hover {
  background: linear-gradient(135deg, #00B8F0 0%, #0C84D0 100%);
}
[data-theme="light"] .nav-group.active { background: rgba(0,159,227,0.10); }

 
 
[data-theme="light"] .nav-subitem { color: #DCE9F8; }
[data-theme="light"] .nav-subitem:hover { color: #FFFFFF; background: rgba(0,159,227,0.10); }
[data-theme="light"] .nav-group { color: #DCE9F8; }
[data-theme="light"] .nav-group:hover { color: #FFFFFF; background: rgba(0,159,227,0.10); }
[data-theme="light"] .nav-section-label { color: #C2D6F0; }
[data-theme="light"] .nav-subgroup { color: #C2D6F0; }
 
.nav-section-label { color: #B8CDEC; }
.nav-subgroup { color: #B8CDEC; }
 
[data-theme="dark"] .nav-item.active,
[data-theme="dark"] .nav-subitem.active,
[data-theme="dark"] .nav-group.active,
[data-theme="dark"] .nav-group:hover { color: #FFFFFF !important; }

 

.project-selector:hover {
   
  border-color: var(--c-primary-light); background: #fff; box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.08);
}

.tenant-switcher:hover {
   
  border-color: var(--c-primary-light); background: #fff; box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.08);
}

.tm-item.active {
   
  background: rgba(0, 159, 227, 0.1); color: var(--c-primary-text); font-weight: 600;
}

.search-box:focus-within {
   
  border-color: var(--c-primary-light); background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.1);
}

.user-avatar {
   
  width: 34px; height: 34px; border-radius: 50%;
    background: linear-gradient(135deg, #009FE3 0%, #0B6FB8 60%, #7DD3FC 100%);
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 600;
    box-shadow: 0 2px 6px rgba(0, 159, 227, 0.25);
}

.nav-childitem:hover {
   
  color: #BCD4EE; background: rgba(0, 159, 227, 0.07);
}

.nav-childitem.active {
   
  color: #D6E8FF; font-weight: 500; background: rgba(0, 159, 227, 0.12);
}

[data-theme="light"] .nav-childitem:hover {
   
  color: #009FE3; background: rgba(0, 159, 227, 0.07);
}

[data-theme="light"] .nav-childitem.active {
   
  color: #009FE3; font-weight: 600; background: rgba(0, 159, 227, 0.12);
}

[data-theme="light"] .stat-card:nth-child(1) .stat-icon {
   
  background: #DFF4FC; color: #0369A1;
}

[data-theme="light"] .stat-card:nth-child(3) .stat-icon {
   
  background: #E0F2FE; color: #0369A1;
}

.stat-card:nth-child(1) .stat-sparkline .bar {
   
  background: #4FC3F7; opacity: 0.5;
}

.section-title .dot {
   
  width: 4px; height: 22px; border-radius: 2px;
    background: linear-gradient(180deg, #7DD3FC 0%, #4FC3F7 100%);
}

.tag-blue {
   
   
  background: #DFF4FC; color: #0369A1;
}

.btn-primary {
   
  background: var(--c-primary); color: #fff;
    box-shadow: 0 2px 8px rgba(0, 159, 227, 0.25);
}

.btn-primary:hover {
   
  box-shadow: 0 4px 14px rgba(0, 159, 227, 0.35); filter: brightness(1.05);
}

.form-input:focus {
   
  outline: none; border-color: var(--c-primary-light); box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.12);
}

[data-theme="dark"] .form-input:focus {
   
  border-color: var(--c-primary-light); box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.2);
}

[data-theme="dark"] .tag-blue {
   
  background: rgba(0, 159, 227, 0.15); color: #7DD3FC;
}

[data-theme="dark"] .tm-item.active {
   
  background: rgba(0, 159, 227, 0.2); color: #7DD3FC;
}

[data-theme="dark"] .prog-bg-blue {
   
  background: rgba(0, 159, 227, 0.12);
}

.nav-module-header:hover {
   
  background: rgba(0, 159, 227, 0.08);
}

[data-theme="light"] .nav-module-header:hover {
   
  background: rgba(0, 159, 227, 0.08); color: #009FE3;
}

 
[data-theme="light"] .nav-module-header { color: #C2D6F0; }
 
[data-theme="light"] .sidebar .nav-module-header,
[data-theme="light"] .sidebar-footer,
[data-theme="light"] .sidebar-footer * { color: #F0F6FE !important; }

.project-dropdown-item.active {
   
  background: rgba(0, 159, 227, 0.08); color: var(--c-primary-text); font-weight: 600;
}

.project-dropdown-add:hover {
   
  border-color: var(--c-primary-text); background: rgba(0, 159, 227, 0.04);
}

[data-theme="dark"] .project-dropdown-item.active {
   
  background: rgba(0, 159, 227, 0.15); color: #7DD3FC;
}

[data-theme="dark"] .project-dropdown-add {
   
  border-color: rgba(255,255,255,0.1); color: #7DD3FC;
}

[data-theme="dark"] .project-dropdown-add:hover {
   
  border-color: #7DD3FC; background: rgba(0, 159, 227, 0.1);
}

.level-toggle-btn.active {
   
  background: var(--c-primary-gradient); color: #fff; box-shadow: 0 2px 6px rgba(0, 159, 227, 0.25);
}

.kpi-cat-tab.active {
   
  background: var(--c-primary); color: #fff; border-color: transparent; box-shadow: 0 2px 8px rgba(0, 159, 227, 0.3);
}

.kpi-summary-toggle:hover {
   
  background: rgba(0, 159, 227, 0.04);
}

.kpi-report-tpl-card:hover {
   
  border-color: var(--c-primary-text); box-shadow: 0 4px 20px rgba(0, 159, 227, 0.1); transform: translateY(-2px);
}

[data-theme="dark"] .kpi-report-tpl-card:hover {
   
  box-shadow: 0 4px 20px rgba(0, 159, 227, 0.15);
}

.kpi-preset-card:hover {
   
  border-color: var(--c-primary-text); box-shadow: 0 2px 12px rgba(0, 159, 227, 0.08);
}

.kpi-preset-formula code {
   
  background: rgba(0, 159, 227, 0.1); color: var(--c-primary-light); padding: 1px 6px; border-radius: 3px; font-size: 12px;
}

.kpi-field-chip {
   
  display: inline-block; padding: 3px var(--sp-sm); background: rgba(0, 159, 227, 0.08); border: 1px solid rgba(0, 159, 227, 0.2); border-radius: 6px; font-size: 12px; color: var(--c-primary-light); cursor: pointer; transition: all .15s;
}

.kpi-field-chip:hover {
   
  background: rgba(0, 159, 227, 0.18); border-color: var(--c-primary-text);
}

.kpi-formula-preview {
   
  margin-top: 12px; padding: var(--sp-sm) var(--sp-md); background: rgba(0, 159, 227, 0.06); border-radius: 6px; min-height: 32px; display: flex; align-items: center;
}

[data-theme="dark"] .kpi-field-chip {
   
  background: rgba(0, 159, 227, 0.12);
}

[data-theme="dark"] .kpi-preset-card:hover {
   
  box-shadow: 0 2px 12px rgba(0, 159, 227, 0.15);
}

.aqa-btn:hover {
   
  border-color: var(--c-primary-text); background: rgba(0, 159, 227, 0.04); color: var(--c-primary-text);
}

.apg-card:hover {
   
  border-color: var(--c-primary-text); box-shadow: 0 4px 14px rgba(0, 159, 227, 0.08); transform: translateY(-2px);
}

.is-step.active {
   
  background: rgba(0, 159, 227, 0.08);
}

.atc-card:hover {
   
  border-color: var(--c-primary-text); background: rgba(0, 159, 227, 0.03);
}

.import-dropzone:hover, .import-dropzone.drag-over {
   
  border-color: var(--c-primary-text); background: rgba(0, 159, 227, 0.03);
}

[data-theme="dark"] .apg-card:hover {
   
  box-shadow: 0 4px 14px rgba(0, 159, 227, 0.18);
}

[data-theme="dark"] .import-dropzone:hover, [data-theme="dark"] .import-dropzone.drag-over {
   
  background: rgba(0, 159, 227, 0.06);
}

[data-theme="dark"] .aqa-btn:hover {
   
  background: rgba(0, 159, 227, 0.08);
}

[data-theme="dark"] .atc-card:hover {
   
  background: rgba(0, 159, 227, 0.05);
}

.search-highlight {
   
  color: var(--c-primary-light); font-weight: 600; background: rgba(0, 159, 227, 0.12); border-radius: 2px; padding: 0 1px;
}

[data-theme="dark"] .stat-card:nth-child(1) .stat-icon {
   
  background: rgba(0, 159, 227, 0.16); color: #7DD3FC;
}

[data-theme="dark"] .stat-card:nth-child(3) .stat-icon {
   
  background: rgba(14,165,233,0.16); color: #009FE3;
}

.form-input:focus {
   
  box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.18);
}

.search-box:focus-within {
   
  box-shadow: 0 0 0 3px rgba(0, 159, 227, 0.15);
    border-color: rgba(0, 159, 227, 0.35);
}

[data-theme="dark"] .phase-build {
   
  background: rgba(0, 159, 227, 0.16) !important; color: #7DD3FC !important;
}

[data-theme="dark"] .proj-stat-primary {
   
  color: #7DD3FC !important; background: rgba(11, 111, 184, 0.18) !important; border-color: rgba(125, 211, 252, 0.25) !important;
}

[data-theme="dark"] .sla-tile {
   
  background: rgba(11, 111, 184, 0.12) !important; border-color: rgba(125, 211, 252, 0.18) !important;
}

[data-theme="dark"] .sla-tile-value {
   
  color: #7DD3FC !important;
}

 

 
[data-theme="dark"] .section-tab.active {
  background: rgba(0, 159, 227, 0.18) !important;
  color: #7DD3FC !important;
  border: 1px solid rgba(0, 159, 227, 0.35) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
}

 
[data-theme="dark"] .avatar-large {
  background-image: linear-gradient(135deg, #22D3EE 0%, #009FE3 60%, #0B6FB8 100%) !important;
  box-shadow: 0 4px 12px rgba(0, 159, 227, 0.30) !important;
}

 
[data-theme="dark"] .avatar-cell.a0 {
  background-image: linear-gradient(135deg, #22D3EE 0%, #009FE3 100%) !important;
}
[data-theme="dark"] .avatar-cell.a6 {
  background-image: linear-gradient(135deg, #38BDF8 0%, #0B6FB8 100%) !important;
}

 
[data-theme="dark"] .partner-icon.c0 {
  background-image: linear-gradient(135deg, #22D3EE 0%, #009FE3 100%) !important;
}
[data-theme="dark"] .partner-icon.c6 {
  background-image: linear-gradient(135deg, #38BDF8 0%, #0B6FB8 100%) !important;
}

 
[data-theme="dark"] .kpi-ob-fill {
  background-image: linear-gradient(90deg, #38BDF8, #009FE3) !important;
}

 
[data-theme="dark"] [style*="linear-gradient(135deg,#1D4ED8 0%"],
[data-theme="dark"] [style*="linear-gradient(135deg, #1D4ED8 0%"] {
  background-image: linear-gradient(135deg, #22D3EE 0%, #009FE3 60%, #0B6FB8 100%) !important;
  box-shadow: 0 4px 12px rgba(0, 159, 227, 0.30) !important;
}

 
[data-theme="dark"] .approval-rules-header {
  background: linear-gradient(135deg, #38BDF8 0%, #22D3EE 60%, #009FE3 100%) !important;
}

 
[data-theme="dark"] .phase-build,
[data-theme="dark"] .project-header.phase-build {
  background: rgba(0, 159, 227, 0.16) !important;
  color: #7DD3FC !important;
  border-color: rgba(125, 211, 252, 0.35) !important;
}
[data-theme="dark"] .phase-tab.active {
  color: #7DD3FC !important;
  border-color: rgba(125, 211, 252, 0.30) !important;
}

 
[data-theme="dark"] .login-bg-decor:nth-child(1) {
  background: #009FE3 !important;
}


 
 

 
:root {
  --u-grad-primary: var(--c-primary);
  --u-grad-accent:  linear-gradient(135deg, #4FC3F7 0%, #22D3EE 58%, #009FE3 100%);
  --u-grad-success: linear-gradient(135deg, #34D399 0%, #10B981 100%);

   
  --u-shadow-card:   0 1px 2px rgba(8,18,34,.40), 0 12px 32px -14px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  --u-shadow-hover:  0 6px 18px -6px rgba(0,159,227,.32), 0 22px 50px -18px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08);
  --u-shadow-pop:    0 10px 30px -8px rgba(0,159,227,.28), 0 26px 60px -20px rgba(0,0,0,.55);

  --u-ring:          0 0 0 3px rgba(0,159,227,.30);
  --u-ease:          cubic-bezier(.22,.61,.36,1);
  --u-ease-out:      cubic-bezier(.16,1,.3,1);

   
  --u-grid:          rgba(255,255,255,.07);
  --u-track:         rgba(255,255,255,.06);
}

[data-theme="light"] {
  --u-shadow-card:   0 1px 2px rgba(15,40,70,.08), 0 12px 28px -14px rgba(15,50,90,.22), inset 0 1px 0 rgba(255,255,255,.7);
  --u-shadow-hover:  0 8px 20px -8px rgba(0,150,220,.30), 0 22px 46px -18px rgba(20,60,110,.25), inset 0 1px 0 rgba(255,255,255,.8);
  --u-shadow-pop:    0 10px 28px -8px rgba(0,150,220,.26), 0 24px 54px -20px rgba(20,60,110,.22);
  --u-ring:          0 0 0 3px rgba(0,159,227,.25);
  --u-grid:          rgba(15,50,90,.10);
  --u-track:         rgba(15,50,90,.07);
}

 
html { -webkit-text-size-adjust: 100%; }
body, .content {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "tnum" 1, "kern" 1;
}
 
h1, h2, h3, h4, .page-head h1, .section-title h2, .card-head h3, .comp-head h3 {
  letter-spacing: .2px;
  line-height: 1.32;
}
.page-head h1 { font-size: var(--fs-h1); }
.page-head p { line-height: 1.6; }
p, li, .card-body, td, th, label, .form-label { line-height: 1.62; }
 
[data-theme="dark"] .c-text-secondary, [data-theme="dark"] .text-secondary,
[data-theme="dark"] .page-head p, [data-theme="dark"] .intro-note, [data-theme="dark"] .comp-tag {
  color: var(--c-text-on-dark-soft);
}
 
code, .k {
  font-family: var(--font-mono);
  font-size: .92em;
  padding: 1px 6px;
  border-radius: 6px;
  background: var(--u-track);
  color: var(--c-primary-light);
}

 
.kpi-value, .metric, .metric-value, .stat-num, .dc-val,
[class*="value"], [class*="num"], [class*="count"],
.fs-number, .trend-num, .score-num, .indicator-val {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: -.01em;
}
.dc-val { font-size: 24px; font-weight: 800; letter-spacing: -.02em; }

 
.card {
  border-radius: var(--radius-card);
  box-shadow: var(--u-shadow-card);
  border: 1px solid var(--c-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0) 40%),
    var(--c-bg-card);
  transition: transform var(--transition-base) var(--u-ease),
              box-shadow var(--transition-base) var(--u-ease),
              border-color var(--transition-base) var(--u-ease);
  overflow: hidden;
}
.card::before {
  content: "";
  position: absolute; inset: 0 0 auto 0; height: 2px;
  background: var(--u-grad-primary);
  opacity: 0; transition: opacity var(--transition-base) var(--u-ease);
  pointer-events: none;
}
.card:hover {
  transform: translateY(-3px);
  box-shadow: var(--u-shadow-hover);
  border-color: rgba(0,159,227,.28);
}
.card:hover::before { opacity: .9; }
.card-grid { gap: var(--sp-lg); }
.card-body { padding: var(--sp-lg); }
.card-head, .comp-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: var(--sp-md);
}
.card-head h3, .comp-head h3 {
  font-size: var(--fs-md); font-weight: 650; color: var(--c-text-primary);
}

 
.section-title { display: flex; align-items: center; gap: var(--sp-sm); margin: var(--sp-lg) 0 var(--sp-md); }
.section-title .bar {
  width: 4px; height: 18px; border-radius: 99px;
  background: var(--u-grad-primary);
  box-shadow: 0 0 10px rgba(0,159,227,.5);
}
.section-title h2 { font-size: var(--fs-lg); font-weight: 650; }

 
.btn {
  border-radius: var(--radius-btn);
  font-weight: 600; letter-spacing: .2px;
  transition: transform var(--transition-fast) var(--u-ease),
              box-shadow var(--transition-fast) var(--u-ease),
              background var(--transition-fast) var(--u-ease),
              border-color var(--transition-fast) var(--u-ease);
}
.btn:active { transform: translateY(1px) scale(.99); }
.btn-primary {
  background: var(--c-primary);
  color: #fff;
}
.btn-primary:hover { filter: brightness(0.95); }
.btn-ghost { background: var(--u-track); border: 1px solid var(--c-border); color: var(--c-text-secondary); }
.btn-ghost:hover { color: var(--c-text-primary); border-color: rgba(0,159,227,.3); background: rgba(0,159,227,.08); }

 
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, .nav-item:focus-visible,
[tabindex]:focus-visible {
  outline: none;
  box-shadow: var(--u-ring);
  border-radius: var(--radius-btn);
}
::selection { background: rgba(0,159,227,.30); color: #fff; }
[data-theme="light"] ::selection { background: rgba(0,159,227,.20); color: #06314d; }

 
* { scrollbar-width: thin; scrollbar-color: rgba(0,159,227,.35) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(0,159,227,.45), rgba(0,159,227,.25));
  border-radius: 99px; border: 2px solid transparent; background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(0,159,227,.6); background-clip: padding-box; }
::-webkit-scrollbar-track { background: transparent; }

 
table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; }th {
  font-size: var(--fs-xs); font-weight: 650; letter-spacing: .4px;
  text-transform: none; color: var(--c-text-secondary);
  background: var(--c-th-bg);
  padding: 12px var(--sp-md); text-align: left;
  border-bottom: 1px solid var(--c-border);
  position: sticky; top: 0; z-index: 1;
}
td { padding: 12px var(--sp-md); border-bottom: 1px solid var(--c-border-light); color: var(--c-text-primary); }
tbody tr { transition: background var(--transition-fast) var(--u-ease); }
tbody tr:hover { background: rgba(0,159,227,.07); }
tbody tr:last-child td { border-bottom: none; }
 
tbody tr:nth-child(even) { background: rgba(255,255,255,.015); }
[data-theme="light"] tbody tr:nth-child(even) { background: rgba(15,50,90,.025); }

 
.tag, .badge, .status, .pill, .comp-tag {
  display: inline-flex; align-items: center; gap: 5px;
  border-radius: 99px; padding: 3px var(--sp-sm); font-size: var(--fs-xs);
  font-weight: 600; letter-spacing: .2px; line-height: 1.6;
  border: 1px solid transparent;
}
.tag::before, .badge::before, .status::before, .pill::before {
  content: ""; width: 6px; height: 6px; border-radius: 99px; background: currentColor; opacity: .9;
}
.comp-tag {
  background: var(--u-track); color: var(--c-text-secondary);
  border-radius: 8px; padding: 2px 8px; font-family: var(--font-mono); font-size: 12px;
}

 
.form-input, select, textarea, input[type="text"], input[type="number"], input[type="search"] {
  border-radius: var(--radius-input);
  border: 1px solid var(--c-border);
  background: var(--c-bg-soft);
  color: var(--c-text-primary);
  padding: 9px 12px;
  transition: border-color var(--transition-fast) var(--u-ease),
              box-shadow var(--transition-fast) var(--u-ease),
              background var(--transition-fast) var(--u-ease);
  font-size: var(--fs-md);
}
.form-input::placeholder, input::placeholder, textarea::placeholder { color: var(--c-text-tertiary); }
.form-input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--c-primary-text);
  box-shadow: var(--u-ring); background: var(--c-bg-card);
}
.form-label, label { font-weight: 600; color: var(--c-text-primary); font-size: var(--fs-sm); }

 
 
.sidebar svg, .topbar svg, .nav-item svg, .nav-ico svg,
.breadcrumb svg, .intro-note svg, .toolbar svg, .action-bar svg {
  width: 18px; height: 18px; flex: none;
  stroke: currentColor; stroke-width: 1.8;
  fill: none; stroke-linecap: round; stroke-linejoin: round;
  transition: transform var(--transition-base) var(--u-ease), color var(--transition-base) var(--u-ease);
}
 
.nav-item.active { position: relative; }
.nav-item.active svg { color: var(--c-primary-light); transform: scale(1.06); }
 
.sidebar .nav-item.active {
  background: linear-gradient(90deg, rgba(0,159,227,.18), rgba(0,159,227,.04));
  box-shadow: inset 3px 0 0 var(--c-primary);
}
.sidebar .nav-item.active::after {
  content: ""; position: absolute; left: 0; top: 12%; bottom: 12%; width: 3px;
  border-radius: 0 3px 3px 0; background: var(--u-grad-primary);
  box-shadow: 0 0 10px rgba(0,159,227,.6);
}
.nav-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 8px; flex: none;
  background: var(--u-track); color: var(--c-text-sidebar-icon);
}
.nav-item.active .nav-ico {
  background: var(--u-grad-primary);
  color: #fff;
  box-shadow: 0 4px 12px -4px rgba(0,159,227,.6);
}
 
.breadcrumb svg { width: 14px; height: 14px; opacity: .6; }

 
 
.chart-box {
  height: auto; min-height: 176px;
  padding: var(--sp-md);
  border-radius: 8px;
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(0,159,227,.06), rgba(0,159,227,0) 55%),
    var(--u-track);
  border: 1px solid var(--c-border-light);
}
.chart-box svg { width: 100%; height: auto; display: block; }

 
svg rect, svg circle, svg polyline, svg polygon, svg line, svg path {
  stroke-linecap: round;
  stroke-linejoin: round;
}
 
svg rect { rx: 6; ry: 6; }
 
.chart-box svg line {
  stroke: var(--u-grid) !important;
  stroke-dasharray: 3 6 !important;
  opacity: .8;
}
 
.chart-box svg polygon[style*="fill:var(--c-primary)"],
.chart-box svg polygon[style*="fill:var(--c-accent)"],
.chart-box svg polygon[style*="fill:#"] {
  opacity: .16 !important;
}
.chart-box svg polyline {
  stroke-width: 3 !important;
  filter: drop-shadow(0 3px 8px rgba(0,159,227,.35));
}
.chart-box svg circle[style*="stroke:var(--c-primary)"] { filter: drop-shadow(0 0 6px rgba(0,159,227,.4)); }

 
div[style*="border-radius: 99px"][style*="background:var(--c-primary)"],
div[style*="border-radius:99px"][style*="background:var(--c-primary)"] {
  background: var(--u-grad-primary) !important;
  box-shadow: 0 2px 8px -2px rgba(0,159,227,.5);
}
div[style*="border-radius: 99px"][style*="background:var(--c-accent)"] {
  background: var(--u-grad-accent) !important;
}
div[style*="height:8px"][style*="background:var(--c-surface-2)"],
div[style*="height:8px"][style*="background:var(--c-track)"] {
  background: var(--u-track) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.15);
}

 
.donut { filter: drop-shadow(0 6px 16px rgba(0,0,0,.28)); }
.donut svg circle[style*="stroke:var(--c-primary)"],
.donut svg circle[style*="stroke:var(--c-accent)"],
.donut svg circle[style*="stroke:var(--c-success)"] {
  filter: drop-shadow(0 0 5px rgba(0,159,227,.30));
}
.donut-center { gap: 2px; }
.dc-label { letter-spacing: .3px; }

 
.legend { gap: var(--sp-md); margin-top: var(--sp-sm); }
.legend i {
  width: 11px; height: 11px; border-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.legend span { font-size: var(--fs-xs); color: var(--c-text-secondary); letter-spacing: .2px; }

 
.dim-node { transition: color var(--transition-fast) var(--u-ease); }
.dim-node:hover { color: var(--c-primary-light); }
.dim-children { border-left: 1px solid var(--u-grid); }
.dim-leaf::before { content: ""; }

 
.empty-wrap, .error-wrap { padding: var(--sp-2xl) var(--sp-lg); }
.empty-wrap svg, .error-wrap svg {
  width: 92px; height: 92px; opacity: .9;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,.3));
}
.empty-wrap h3, .error-wrap h3 { font-size: var(--fs-lg); font-weight: 650; margin-top: var(--sp-md); }
.empty-wrap p, .error-wrap p { color: var(--c-text-secondary); max-width: 360px; margin: 6px auto 0; }

 
.placeholder {
  position: relative; overflow: hidden;
  background: var(--u-track); border-radius: 8px;
}
.placeholder::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);
  transform: translateX(-100%);
  animation: u-shimmer 1.4s infinite;
}
[data-theme="light"] .placeholder::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent); }
@keyframes u-shimmer { 100% { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
  .placeholder::after { animation: none; }
  * { scroll-behavior: auto !important; }
}

 
.topbar {
  box-shadow: 0 1px 0 var(--c-border), 0 8px 24px -16px rgba(0,0,0,.5);
  backdrop-filter: saturate(140%);
}
.sidebar .nav-module-header {
  font-size: 14px; letter-spacing: .4px; font-weight: 700;
  color: #F0F6FE; opacity: 1;
  padding: 7px var(--sp-sm); margin-top: var(--sp-sm);
}
.nav-item {
  border-radius: 8px;
  transition: background var(--transition-fast) var(--u-ease), color var(--transition-fast) var(--u-ease);
}
.nav-item:hover { background: rgba(255,255,255,.06); }

 
@keyframes u-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.card, .stat-card, .metric-card, .kpi-card {
  animation: u-rise .42s var(--u-ease-out) both;
}
@media (prefers-reduced-motion: reduce) {
  .card, .stat-card, .metric-card, .kpi-card { animation: none; }
}

 
 
.login-bg-decor { display: none; }
 
.login-wrapper {
  display: flex; flex-direction: row; align-items: stretch; justify-content: flex-start;
  min-height: 100vh; padding: 0;
}
.login-brand {
  flex: 0 0 56%; position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center;
  padding: 52px 72px; color: #fff;
   
  background: linear-gradient(180deg, var(--c-bg-sidebar-start) 0%, var(--c-bg-sidebar-mid) 40%, var(--c-bg-sidebar-end) 100%);
}
.login-brand::before,
.login-brand::after {
  content: ""; position: absolute; border-radius: 50%; pointer-events: none;
  background: rgba(255,255,255,0.12); filter: blur(2px);
}
.login-brand::before { width: 380px; height: 380px; top: -120px; right: -80px; }
.login-brand::after  { width: 260px; height: 260px; bottom: -90px; left: -60px; background: rgba(255,255,255,0.08); }
.brand-logo {
  width: 60px; height: 60px; border-radius: 8px;
  background: rgba(255,255,255,0.16); backdrop-filter: blur(4px);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 26px; font-weight: 700; margin-bottom: 18px;
  border: 1px solid rgba(255,255,255,0.25);
}
.brand-title { font-size: 30px; font-weight: 700; letter-spacing: 1px; margin-bottom: var(--sp-sm); }
.brand-tag   { font-size: 16px; color: rgba(255,255,255,0.85); margin-bottom: 22px; }
.brand-desc  {
  font-size: 14px; line-height: 1.7; color: rgba(255,255,255,0.82);
  max-width: 440px; margin-bottom: 26px;
}
.brand-feats { display: flex; flex-direction: column; gap: 13px; margin-bottom: auto; }
.brand-feat  { display: flex; gap: var(--sp-md); align-items: flex-start; }
.brand-feat .bf-ico {
  width: 42px; height: 42px; border-radius: 8px; flex-shrink: 0;
  background: rgba(255,255,255,0.16);
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.22);
}
.brand-feat .bf-ico svg { width: 22px; height: 22px; color: #fff; }
.brand-feat .bf-t { font-size: 16px; font-weight: 600; margin-bottom: 3px; }
.brand-feat .bf-s { font-size: 12px; color: rgba(255,255,255,0.78); line-height: 1.6; }
.brand-trust {
  margin-top: 26px; padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,0.22);
  display: flex; gap: 22px; flex-wrap: wrap;
  font-size: 12px; color: rgba(255,255,255,0.85);
}
.brand-trust span { display: inline-flex; align-items: center; gap: 7px; }
.brand-trust svg  { width: 15px; height: 15px; }
 
.login-pane {
  flex: 1; display: flex; align-items: center; justify-content: center;
  background: var(--c-bg-card); padding: 40px; overflow: auto;
}
.login-pane .login-card {
  width: 100%; max-width: 420px;
  box-shadow: none; border: none; background: transparent;
  padding: 8px 4px;
}
@media (max-width: 1023px) {
  .login-brand { flex-basis: 48%; padding: 56px 48px; }
}
@media (max-width: 767px) {
  .login-wrapper { flex-direction: column; }
  .login-brand   { flex: 0 0 auto; padding: 40px 28px; }
  .brand-desc, .brand-feats { display: none; }
  .brand-title   { font-size: 24px; }
  .login-pane    { padding: 28px 20px; }
}

 
 
.demo-accounts {
  margin-top: 22px;
  padding-top: 0;
  border-top: none;
  list-style: none;  
}
 
.demo-accounts > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  padding: var(--sp-sm) 2px;
  background: transparent;
  border: none;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text-secondary);
  user-select: none;
  transition: color 150ms;
}
.demo-accounts > summary::-webkit-details-marker { display: none; }
.demo-accounts > summary:hover { color: var(--c-primary-light); }
.demo-accounts > summary > svg:first-of-type {
  width: 16px; height: 16px;
  color: var(--c-primary-light);
  flex-shrink: 0;
}
.demo-summary-text { flex: 1; }
.demo-chevron {
  width: 14px; height: 14px;
  color: var(--c-text-tertiary);
  transition: transform 220ms ease;
  flex-shrink: 0;
}
.demo-accounts[open] > summary .demo-chevron { transform: rotate(180deg); }
 
.demo-accounts-body {
  margin-top: 8px;
  padding: 16px var(--sp-md);
  border: 1px solid var(--c-border);
  border-radius: 8px;
  background: var(--c-bg-card-hover);
}

 

 
:root,
[data-theme="light"],
[data-theme="dark"] {
  --u-primary-strong: #0B6FB8;
  --u-primary-strong-grad: var(--c-primary);
   
  --c-primary-gradient: var(--c-primary);
}

 
.btn-primary {
  background: var(--c-primary);
  color: #fff;
}
.btn-primary:hover { filter: brightness(1.06); }

 
.np-tab.active,
.filter-tab.active,
.demo-cat.active,
.kpi-cat-tab.active,
.proj-stat-primary,
.up-avatar,
.page-btn.active,
.view-btn.active,
.wiz-step.active .num,
.is-step.active .is-num,
.rpp-tab.active,
.stat-card[style*="cursor:pointer"]:hover .stat-arrow,
.kpi-check-wrap input:checked + .kpi-check-mark,
.btn-outline-primary:hover {
  background: var(--u-primary-strong) !important;
  border-color: var(--u-primary-strong) !important;
  color: #fff !important;
}

 
[data-theme="light"] .app-container {
  color: var(--c-text);
  --c-bg: #F0F4FA;
  --c-surface: #FFFFFF;
  --c-surface-alt: #EAF1F8;
  --c-border: rgba(12,20,32,0.10);
  --c-border-light: rgba(12,20,32,0.06);
  --c-primary: #0369A1;
  --c-primary-light: #0B6FB8;
  --c-primary-gradient: var(--c-primary);
  --c-accent: #0E7490;
  --c-accent-gradient: var(--c-accent);
  --c-success: #047857;
  --c-success-bg: rgba(16,185,129,0.12);
  --c-warning: #B45309;
  --c-warning-bg: rgba(245,158,11,0.12);
  --c-error: #DC2626;
  --c-error-bg: rgba(239,68,68,0.12);
  --c-text: #0B1324;
  --c-text-secondary: #475569;
  --c-text-tertiary: #51607A;
  --c-header-bg: rgba(240,244,250,0.92);
  --c-bottom-bar: rgba(255,255,255,0.94);
}
 
.app-container .header-back { background: rgba(12,20,32,0.06); }
.app-container .m-card:active,
.app-container .m-list-item:active,
.app-container .m-notif-item:active { background: rgba(12,20,32,0.04); }
.app-container .m-tag.blue { color: #1D4ED8; }


 
 

.sidebar {
  padding: 18px 0;             
}

.nav-item {
  font-size: 16px;            
   
  padding-top: .. .. 重置四边 → 否则会把 .nav-subitem/.nav-childitem 的 padding-left:40/58 覆盖掉 */
  padding-top: 11px;          
  padding-bottom: 11px;       
  gap: 11px;                  
}

.nav-item svg {
  width: 20px;                
  height: 20px;
}

.nav-subitem {
  font-size: 14px;            
}

/* U1（评审）：导航副标题——标签下方 12 字内说明，降低同名入口歧义 */
.nav-subitem-text { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.nav-subitem-desc {
  font-size: 12px;
  font-weight: 400;
  color: var(--c-text-sidebar-icon, #94a3b8);
  margin-top: 2px;
  white-space: normal;
}

/* 2026-09-21 修复：light 主题侧栏渐变中段（#123E7A）下，注解实测对比度仅 4.28:1，
   低于 11px 小字所需的 WCAG AA 4.5:1（令牌 --c-text-sidebar-icon 的 light 值 #7FA8DC
   是按深色侧栏给的，未随 light 侧栏中段变亮而调整）。
   提亮到 #8FB8E6（与 dark 主题现用同值）后，三个渐变停靠色实测 6.79 / 5.09 / 6.41，
   最差 5.09:1 达标。仅作用于本注解，不影响 .nav-subitem 标签与其它取该令牌的组件。 */
[data-theme="light"] .nav-subitem-desc {
  color: var(--c-text-sidebar-desc);
}

/* 2026-09-22：工作台首页信息流「点击直达详情页」——与顶栏铃铛同源。
   带 data-feed-link 的 item 整行可点（委托处理器见 shared/feed-click.js）。
   仅提供指针与 hover 反馈，不改变布局，双主题兼容。 */
[data-feed-link] { cursor: pointer; transition: background-color .15s ease; }
[data-theme="light"] [data-feed-link]:hover { background-color: rgba(14,165,233,.08); }
[data-theme="dark"] [data-feed-link]:hover { background-color: rgba(56,189,248,.10); }

 
.sidebar .nav-module-header {
  font-size: 16px;            
}

.nav-childitem {
  font-size: 14px;          
}

.nav-section-label,
.nav-subgroup {
  font-size: 12px;          
}

 
.topbar-logo span {
  font-size: 16px;            
  font-weight: 700;          
  letter-spacing: .3px;
}
.topbar-logo svg {
  width: 32px;               
  height: 32px;
}


 
 
.form-select,
.demo-select,
.filter-select {
   
  min-width: 140px !important;
}


 
 

 
.kpi-mini-card        { border-radius: var(--radius-card, 14px); }
.kpi-form-section     { border-radius: var(--radius-card, 14px); }
.kpi-report-tpl-card  { border-radius: var(--radius-card, 14px); }
.kpi-preset-card      { border-radius: var(--radius-card, 14px); }
.kpi-sys-summary-card { border-radius: var(--radius-card, 14px); }
.kpi-overview-bar     { border-radius: var(--radius-card, 14px); }
 
.kpi-period-table     { border-radius: 8px; }

 
 
.kpi-mini-card        { box-shadow: var(--u-shadow-card); }
.kpi-mini-card:hover  { box-shadow: var(--u-shadow-hover); }
 
.kpi-report-tpl-card        { box-shadow: var(--u-shadow-card); }
.kpi-report-tpl-card:hover  {
  border-color: var(--c-primary-text);
  box-shadow: var(--u-shadow-hover), 0 0 0 1px rgba(0,159,227,.12);
  transform: translateY(-2px);
}
 
.kpi-preset-card        { box-shadow: var(--u-shadow-card); }
.kpi-preset-card:hover  {
  border-color: var(--c-primary-text);
  box-shadow: var(--u-shadow-hover);
}
 
.kpi-sys-summary-card        { box-shadow: var(--u-shadow-card); }
.kpi-sys-summary-card:hover  { box-shadow: var(--u-shadow-hover); }
 
.kpi-overview-bar     { box-shadow: var(--u-shadow-card); }

 
 
.kpi-entry-tab.active {
  box-shadow: 0 2px 8px rgba(0,159,227,.30);
}
 
.kpi-modal-body .field input:focus,
.kpi-modal-body .field select:focus,
.kpi-modal-body .field textarea:focus {
  box-shadow: 0 0 0 2px rgba(0,159,227,.20);
}
 
.kpi-check-wrap input:checked + .kpi-check-mark {
  box-shadow: 0 1px 4px rgba(0,159,227,.30);
}
 
.kpi-ob-fill {
  background: linear-gradient(90deg, #5BB8E5 0%, #009FE3 100%);
}
 
#kpiTimeCard tbody tr:hover { background: rgba(0,159,227,.06); }
.kpi-summary-toggle:hover   { background: rgba(0,159,227,.05); }

/* ===== T1 对比度治理 · 安全修正（2026-09-22，整块可整体回退） ===== */
/* 1) 亮色态危险红 #F87171 过浅：白字仅 2.77:1 → 加深到 red-600 #DC2626，白字达 WCAG AA 4.5:1，危险语义不变（仅改 --c-error，不动 --c-error-light 以免误伤浅红底文字控件） */
[data-theme="light"] { --c-error: #DC2626; }
/* 2) 暗色态通知徽标本就 broken（--c-error 被上游覆盖回 #F87171）：显式加深到 red-700 #B91C1C，白字达 4.5:1 */
[data-theme="dark"]  { --c-error: #B91C1C; }
/* 3) 暗色态次级灰 #5A6B80 压深蓝底仅 3.0:1 → 提亮到 slate-400 #8A9BB0，达 WCAG AA 4.5:1（仅暗色作用域，不误伤亮色态） */
[data-theme="dark"]  { --c-text-on-dark-muted: #8A9BB0; }
/* 4) 品牌主色 --c-primary #009FE3 白字仅 2.84:1（约 162 处违规）→ 加深到 #0369A1（同文件暗色块已在用），白字达 4.56:1；保持品牌同一色系，亮/暗双主题统一 */
[data-theme="light"] { --c-primary: #0369A1; }
/* 5) 品牌青 --c-accent #0891B2 青字压浅底 2.97:1（约 13 处）→ #0E7490（白字 5.39:1）；仅亮色，避免加深误伤暗色态青字 */
[data-theme="light"] { --c-accent: #0E7490; }
/* 6) 成功绿 --c-success #10B981 白字/绿字压浅底 2.3:1（约 13 处）→ #047857（白字 4.6:1）；仅亮色，暗色态本就达标不动 */
[data-theme="light"] { --c-success: #047857; }
/* 7) 暗色态 --c-primary 同步加深到 #0369A1（白字 2.97:1→4.56:1，119 处主按钮/激活态违规清零）；暗色主色文字/链接压深蓝底可读性略降（约 74 处，2.6:1，仍清晰可辨，属品牌色加深的已知代价） */
[data-theme="dark"]  { --c-primary: #0369A1; }

/* ============================================================
   T4 · system 模块对比度治理（2026-09-22）
   system 模块 12 页共 34 处对比度违规，根因两类，统一在此收口：
   A) 令牌作「文字」压深底（--c-primary / --c-error 在暗态过深）→ 暗态改用亮色令牌；
   B) 亮态浅灰/亮色文字压浅底 → 加深。
   全部以 probe_s2_v4 双主题探针回归为准（viol 口径，非 count）。
   ============================================================ */

/* —— 主题安全「文字」令牌（与「背景」令牌解耦，避免暗态红/绿作文字时过深） —— */
[data-theme="light"] { --c-error-text: #C62828; --c-amber-text: #B45309; --c-success-text: #047857; }  /* 深红/深琥珀/深绿，白底 ≥5:1 */
[data-theme="dark"]  { --c-error-text: #F87171; --c-amber-text: #FBBF24; --c-success-text: #34D399; }  /* 亮红/亮琥珀/亮绿，深蓝底 ≥5:1 */

/* feedback-admin「采纳」按钮（.btn-success 白字压亮绿底 #10B981）：仅暗态把按钮背景加深到 #047857（白字 5.48:1）；
   不改 --c-success 令牌本身——令牌在暗态还被 hr .sum-value 等当作「压深底文字」使用，改深会外溢成回归 */
[data-theme="dark"] .btn-success { background: #047857 !important; }
/* 审批流头像/图标也用 --c-success 作背景 + 白字：暗态同样加深到 #047857（白字 5.48:1），
   否则令牌回退为亮绿 #10B981 后白字仅 2.54，外溢成 hr-onboarding-detail 回归 */
[data-theme="dark"] .avatar-circle.approved,
[data-theme="dark"] .ah-icon.approved { background: #047857 !important; }

/* —— A-1 暗态主色蓝文字压深蓝面板：改用亮蓝 #60A5FA（≥4.5:1） —— */
[data-theme="dark"][data-page="workbench-config"] .wc-tab.is-active,
[data-theme="dark"] .wk-tab.active,
[data-theme="dark"][data-page="user-create"]       .ctx-guide-item .num,
[data-theme="dark"][data-page="settings-roles"]    .rc-code,
[data-theme="dark"][data-page="platform-overview"] a.mh-anchor-item.is-active,
[data-theme="dark"][data-page="chart-components"]  .code-block .k { color: #60A5FA !important; }

/* —— A-2 暗态红字（--c-error #B91C1C 压深蓝面板）：危险 ghost 按钮 + 平台概览 mini-val —— */
[data-theme="dark"]  .btn-ghost[style*="--c-error"] { color: #F87171 !important; }
[data-theme="light"] .btn-ghost[style*="--c-error"] { color: #C62828 !important; }
[data-theme="dark"][data-page="platform-overview"] .mini.bad .mini-val { color: #F87171 !important; }

/* —— A-3 暗态描边主按钮（.btn-outline-primary 用 --c-primary #0369A1 压深蓝面板，仅 2.66:1）→ 暗态改用亮蓝 #60A5FA ≥5.7:1 —— */
[data-theme="dark"] .btn-outline-primary { color: #60A5FA !important; border-color: #60A5FA !important; }

/* —— B 亮态浅灰文字压浅底（.comp-tag / .page-head p / .intro-note）统一加深 —— */
[data-theme="light"] .page-head p,
[data-theme="light"] .intro-note,
[data-theme="light"] .comp-tag { color: var(--c-text-on-light-soft) !important; }

/* —— PORTAL 双主题对比度收口（T6） —— */
/* 暗态主色文字（var(--c-primary) #0369A1 压深蓝面板 2.6~3.1:1）→ 亮蓝 #60A5FA ≥5:1 */
[data-theme="dark"][data-page="portal-home"] .mh-more,
[data-theme="dark"] .pp-pill.week,
[data-theme="dark"] .pp-cnt,
[data-theme="dark"] .pp-badge.delay-blue,
[data-theme="dark"] .pph-caret,
[data-theme="dark"] .mh-anchor-item.is-active,
[data-theme="dark"] .pp-acc-ic { color: #60A5FA !important; }

/* 暗态红字（var(--c-error) #B91C1C 压深蓝面板 2.4~2.6:1）→ 亮红 #F87171 ≥5:1 */
[data-theme="dark"] .pp-trend.down,
[data-theme="dark"] .pp-pill.overdue,
[data-theme="dark"] .pp-dhead-sub[data-st="err"] .pp-muted,
[data-theme="dark"] .pp-tl .pp-it.err b,
[data-theme="dark"] .pp-modal-err,
[data-theme="dark"] .pp-proj-stats .s-delay b,
[data-theme="dark"] .pp-status-pill.err,
[data-theme="dark"] .pp-col.delay .pp-cnt { color: #F87171 !important; }

/* 暗态白字压过亮背景（青/绿/紫徽章与头像底）→ 加深背景使白字 ≥4.5:1 */
[data-theme="dark"] .pp-ava,
[data-theme="dark"] .pp-atab-badge { background: #0E7490 !important; color: #fff !important; }
[data-theme="dark"] .pp-atab-badge.ghost { color: #E0F2FE !important; }
[data-theme="dark"] .pp-badge.done { background: #047857 !important; }
[data-theme="dark"] .pp-badge.appr { background: #7C3AED !important; }
[data-theme="dark"] .btn-ghost { color: #E0F2FE !important; }

/* 亮态红字压浅粉（#DC2626 3.95 → #B91C1C ≥4.8:1） */
[data-theme="light"] .pp-pill.overdue,
[data-theme="light"] .pp-cnt { color: #B91C1C !important; }

/* 暗态 KPI 数值（JS 内联 var(--c-error)/var(--c-warning)，深红/橙压深蓝卡 2.4~2.6:1）→ 亮红/亮橙 ≥5:1 */
[data-theme="dark"] .pp-kpi-val.pp-v-err { color: #F87171 !important; }
[data-theme="dark"] .pp-kpi-val.pp-v-warn { color: #FBBF24 !important; }

/* 暗态逾期数 <b>（内联 var(--c-danger) 压深蓝卡 2.59:1）→ 亮红 #F87171 ≥5:1 */
[data-theme="dark"] .rh-mini-sub b.rh-ov { color: #F87171 !important; }

/* 暗态计数徽章压饱和彩色列底（蓝字压绿底 3.82:1）→ 白字 ≥9:1 */
[data-theme="dark"] .pp-col.doing .pp-cnt,
[data-theme="dark"] .pp-col.appr .pp-cnt,
[data-theme="dark"] .pp-col.done .pp-cnt,
[data-theme="dark"] .pp-col.delay .pp-cnt { color: #fff !important; }

/* ============================================================
   T‑新31 · 子项入口卡奇数自适应（作用域 #subCards，主站仅 4 个总览页命中）
   · 卡片数由 filterSubCardsByPerm 按角色过滤，实测 14 角色 × 4 页共 56 格位中
     21 格为奇数（含 PA/asset=0、PA 与 CUST/kpi=1 两个极端）
   · 奇数 → 末项跨两列，零留白；跨列后卡内横向重排，避免右半发空
   · 0 张 → 容器 :empty 整体隐藏，避免空网格白占一屏（上方无板块标题，仅注释）
   · 硬约束：不可改 .card-grid-2 基类（全站 534 处，含 7fr 5fr 非对称复用）
   ============================================================ */
#subCards:empty { display: none; }

#subCards > .card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  flex-direction: row !important;
  align-items: center !important;
  gap: var(--sp-md) !important;
}
#subCards > .card:last-child:nth-child(odd) > div:first-child {
  flex: 0 0 auto;
  min-width: 200px;
}
#subCards > .card:last-child:nth-child(odd) > div:nth-child(2) {
  flex: 1 1 auto;
  min-width: 0;
}
#subCards > .card:last-child:nth-child(odd) > a {
  flex: 0 0 auto;
  margin-top: 0 !important;
  white-space: nowrap;
}

/* ≤1100px 时 .card-grid-2 已降为单列（dashboard-uplift.css），撤回横向重排 */
@media (max-width: 1100px) {
  #subCards > .card:last-child:nth-child(odd) {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: var(--sp-xs) !important;
  }
  #subCards > .card:last-child:nth-child(odd) > div:first-child { min-width: 0; }
  #subCards > .card:last-child:nth-child(odd) > a { margin-top: var(--sp-xs) !important; }
}

/* ============================================================
   T‑新32 · 四总览页复审整改（美观度 + 交互易用性）
   1) 统计卡「假可点击」：#statCards / #whHealthCards 内的 .stat-card 继承了
      design-system.css:681 的 cursor:pointer 与 :hover translateY 抬升，
      但四页均未绑定点击（实测：点击无导航、无弹窗），且是 div 非原生可聚焦元素
      → 键盘与读屏用户完全不可达，鼠标用户被「手型+抬升」双重误导。
      按「视觉暗示必须与真实行为一致」原则：改 default + 去掉抬升，保留 hover 阴影质感。
      ⚠️ 作用域限定，禁止改 .stat-card 基类：profile-home / manager-home /
      partner-home 等页的 stat-card 靠「内联 cursor:pointer + .stat-arrow」实现真跳转，
      动基类会波及全站。
   2) 点击区过小：面包屑 a 实测 19px、预警动作 a.link 18px（WCAG 2.5.8 目标 ≥24px）。
      inline 元素加垂直 padding 只扩大命中区、不撑开 line box，布局零变化。
   ============================================================ */
#statCards > .stat-card,
#whHealthCards > .stat-card { cursor: default; }
#statCards > .stat-card:hover,
#whHealthCards > .stat-card:hover { transform: none; }

.content .breadcrumb > a,
.content a.link { padding-top: 3px; padding-bottom: 3px; }
