/* =====================================================
 * 1. 设计 Token —— 统一设计变量
 * 浅色（默认）与 [data-theme="dark"] 深色双主题
 * ===================================================== */

:root {
  /* ---- 1.1 品牌色（主色 + 强调色，跨主题一致） ---- */
  --color-primary:        #2c5cf6;
  --color-primary-hover:  #1f4ce0;
  --color-primary-active: #1a40c5;
  --color-primary-soft:   #e8efff;
  --color-primary-soft-2: #c7d6fd;

  --color-accent:         #7c3aed;
  --color-accent-soft:    #f0e6ff;
  --color-cyan:           #0891b2;
  --color-cyan-soft:      #d9f1f8;

  /* ---- 1.2 状态色 ---- */
  --color-success:        #16a34a;
  --color-success-hover:  #15803d;
  --color-success-soft:   #dcfce7;

  --color-warning:        #d97706;
  --color-warning-hover:  #b45309;
  --color-warning-soft:   #fef3c7;

  --color-danger:         #dc2626;
  --color-danger-hover:   #b91c1c;
  --color-danger-soft:    #fee2e2;

  --color-info:           #2563eb;
  --color-info-soft:      #dbeafe;

  /* ---- 1.3 中性背景（4 层）：浅色 ---- */
  --bg-1: #f5f7fb;   /* 页面底色 */
  --bg-2: #ffffff;   /* 卡片底色 */
  --bg-3: #f0f3f9;   /* 表头 / 卡片悬浮 */
  --bg-4: #ffffff;   /* 下拉 / 弹窗 */
  --bg-overlay: rgba(15, 23, 42, 0.4);

  /* ---- 1.4 文字（4 层）：浅色 ---- */
  --text-1: #0f172a;   /* 标题 / 主文 */
  --text-2: #334155;   /* 次级文本 */
  --text-3: #64748b;   /* 辅助说明 */
  --text-4: #94a3b8;   /* 占位 / 禁用 */
  --text-on-primary: #ffffff;

  /* ---- 1.5 边框：浅色 ---- */
  --border-1: #e2e8f0;   /* 默认 */
  --border-2: #cbd5e1;   /* 强调 / 分割 */
  --border-3: #94a3b8;   /* hover */

  /* ---- 1.6 阴影：浅色 ---- */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 2px 6px rgba(15, 23, 42, 0.08);
  --shadow-md: 0 8px 20px rgba(15, 23, 42, 0.10);
  --shadow-lg: 0 16px 36px rgba(15, 23, 42, 0.14);
  --shadow-focus: 0 0 0 3px var(--color-primary-soft-2);

  /* ---- 1.7 圆角 ---- */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 999px;

  /* ---- 1.8 间距（4px 步长） ---- */
  --sp-1: 4px;  --sp-2: 8px;   --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px;  --sp-7: 32px; --sp-8: 40px;
  --sp-9: 48px; --sp-10: 64px;

  /* ---- 1.9 字号阶梯 ---- */
  --fs-10: 10px; --fs-11: 11px; --fs-12: 12px; --fs-13: 13px;
  --fs-14: 14px; --fs-15: 15px; --fs-16: 16px; --fs-18: 18px;
  --fs-20: 20px; --fs-24: 24px; --fs-28: 28px; --fs-32: 32px;

  /* ---- 1.10 字重 ---- */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ---- 1.11 动效 ---- */
  --t-fast: 120ms;
  --t-normal: 200ms;
  --t-slow: 320ms;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);

  /* ---- 1.12 布局尺寸 ---- */
  --sidebar-w: 224px;
  --sidebar-w-collapsed: 64px;
  --header-h: 56px;
  --footer-h: 32px;
  --content-max: 100%;

  /* ---- 1.13 ECharts 文字色（跟随主题） ---- */
  --chart-text: #475569;
  --chart-axis: #cbd5e1;
  --chart-grid: #e2e8f0;
  --chart-tooltip-bg: rgba(15, 23, 42, 0.92);

  /* ---- 1.14 字体族 ---- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}

/* ---- 深色主题覆盖 ---- */
[data-theme="dark"] {
  --color-primary:        #5b8def;
  --color-primary-hover:  #7ba2f5;
  --color-primary-active: #3d6dd9;
  --color-primary-soft:   rgba(91, 141, 239, 0.14);
  --color-primary-soft-2: rgba(91, 141, 239, 0.28);

  --color-accent:         #a78bfa;
  --color-accent-soft:    rgba(167, 139, 250, 0.16);
  --color-cyan:           #22d3ee;
  --color-cyan-soft:      rgba(34, 211, 238, 0.16);

  --color-success:        #34d399;
  --color-success-hover:  #10b981;
  --color-success-soft:   rgba(52, 211, 153, 0.14);

  --color-warning:        #fbbf24;
  --color-warning-hover:  #f59e0b;
  --color-warning-soft:   rgba(251, 191, 36, 0.16);

  --color-danger:         #f87171;
  --color-danger-hover:   #ef4444;
  --color-danger-soft:    rgba(248, 113, 113, 0.16);

  --color-info:           #60a5fa;
  --color-info-soft:      rgba(96, 165, 250, 0.16);

  --bg-1: #0b1220;
  --bg-2: #131a2b;
  --bg-3: #1a2336;
  --bg-4: #1f2a40;
  --bg-overlay: rgba(0, 0, 0, 0.6);

  --text-1: #e6edf7;
  --text-2: #c2cad8;
  --text-3: #8d99ad;
  --text-4: #5b667a;

  --border-1: #1f2a40;
  --border-2: #2c3a55;
  --border-3: #3d4d6b;

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 8px 20px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 16px 36px rgba(0, 0, 0, 0.6);

  --chart-text: #c2cad8;
  --chart-axis: #3d4d6b;
  --chart-grid: #1f2a40;
  --chart-tooltip-bg: rgba(15, 23, 42, 0.94);
}

/* =====================================================
 * 2. 全局重置
 * ===================================================== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  font-family: var(--font-sans);
  background: var(--bg-1);
  color: var(--text-1);
  font-size: var(--fs-14);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color var(--t-normal) var(--ease), color var(--t-normal) var(--ease);
}

#app {
  height: 100vh;
  width: 100%;
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: var(--r-pill); }
::-webkit-scrollbar-thumb:hover { background: var(--border-3); }

/* =====================================================
 * 3. 通用页面骨架
 * ===================================================== */
.page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
  flex-wrap: wrap;
}

.page-title {
  font-size: var(--fs-20);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  letter-spacing: 0.3px;
  line-height: 1.3;
}

.page-subtitle {
  font-size: var(--fs-12);
  color: var(--text-3);
  margin-top: var(--sp-1);
}

.section-title {
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  margin: var(--sp-5) 0 var(--sp-3);
  padding-left: var(--sp-2);
  border-left: 3px solid var(--color-primary);
}

.tip-block {
  display: block;
  padding: var(--sp-3) var(--sp-4);
  background: var(--color-primary-soft);
  border: 1px solid var(--color-primary-soft-2);
  border-radius: var(--r-md);
  color: var(--text-2);
  font-size: var(--fs-13);
  line-height: 1.7;
  margin-bottom: var(--sp-4);
}
/* 图标行内化：保证含 <strong>/<b>/<code> 的段落整体正常换行 */
.tip-block .icon {
  display: inline-flex;
  align-items: center;
  vertical-align: -3px;
  margin-right: var(--sp-2);
  color: var(--color-primary);
}
.tip-block strong { color: var(--text-1); }

/* 空状态 */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--sp-9) var(--sp-5);
  color: var(--text-3);
  font-size: var(--fs-13);
  gap: var(--sp-2);
}
.empty-state .empty-icon { font-size: 36px; color: var(--text-4); }
.empty-state .empty-text { font-size: var(--fs-13); color: var(--text-3); }
.empty-state .empty-action { margin-top: var(--sp-3); }

/* 通用工具类 */
.text-dim { color: var(--text-3); }
.text-muted { color: var(--text-4); }
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
.text-danger { color: var(--color-danger); }
.text-primary { color: var(--color-primary); }
.fw-semibold { font-weight: var(--fw-semibold); }
.fs-12 { font-size: var(--fs-12); }
.fs-13 { font-size: var(--fs-13); }

/* =====================================================
 * 4. 应用布局（侧边栏 + 顶栏 + 内容区）
 * ===================================================== */
.app-layout {
  display: flex;
  height: 100vh;
  width: 100%;
  background: var(--bg-1);
  color: var(--text-1);
}

/* ---- 4.1 侧边栏 ---- */
.app-sidebar {
  width: var(--sidebar-w);
  background: var(--bg-2);
  border-right: 1px solid var(--border-1);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  transition: width var(--t-normal) var(--ease);
  position: relative;
  z-index: 100;
}
.app-sidebar.is-collapsed { width: var(--sidebar-w-collapsed); }

.sidebar-logo {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  height: var(--header-h);
  padding: 0 var(--sp-4);
  border-bottom: 1px solid var(--border-1);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-15);
  color: var(--text-1);
  letter-spacing: 0.4px;
}
.sidebar-logo .logo-mark {
  width: 28px; height: 28px;
  border-radius: var(--r-sm);
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
  color: var(--text-on-primary);
  display: flex; align-items: center; justify-content: center;
  font-weight: var(--fw-bold);
  font-size: var(--fs-14);
  box-shadow: 0 4px 10px rgba(44, 92, 246, 0.25);
  flex-shrink: 0;
}
.app-sidebar.is-collapsed .sidebar-logo span:not(.logo-mark) { display: none; }

.sidebar-menu {
  flex: 1;
  overflow-y: auto;
  padding: var(--sp-3) var(--sp-2);
}

/* Element Plus el-menu 主题化 */
.app-sidebar .el-menu {
  border-right: none !important;
  background: transparent !important;
}
.app-sidebar .el-menu-item {
  height: 40px;
  line-height: 40px;
  margin: 2px 0;
  padding: 0 var(--sp-3) !important;
  border-radius: var(--r-sm);
  color: var(--text-2) !important;
  font-size: var(--fs-13);
  font-weight: var(--fw-medium);
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.app-sidebar .el-menu-item .el-icon {
  font-size: 16px;
  color: var(--text-3);
  margin-right: var(--sp-2);
  transition: color var(--t-fast) var(--ease);
}
.app-sidebar .el-menu-item:hover {
  background: var(--bg-3) !important;
  color: var(--text-1) !important;
}
.app-sidebar .el-menu-item:hover .el-icon { color: var(--color-primary); }
.app-sidebar .el-menu-item.is-active {
  background: var(--color-primary-soft) !important;
  color: var(--color-primary) !important;
  font-weight: var(--fw-semibold);
}
.app-sidebar .el-menu-item.is-active .el-icon { color: var(--color-primary); }
.app-sidebar.is-collapsed .el-menu-item span { display: none; }
.app-sidebar.is-collapsed .el-menu-item { padding: 0 !important; justify-content: center; }

.sidebar-collapse-btn {
  height: 40px;
  display: flex; align-items: center; justify-content: center;
  border-top: 1px solid var(--border-1);
  color: var(--text-3);
  cursor: pointer;
  transition: color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.sidebar-collapse-btn:hover { color: var(--color-primary); background: var(--bg-3); }

/* ---- 4.2 主区域 ---- */
.app-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* ---- 4.3 顶栏 ---- */
.app-header {
  height: var(--header-h);
  background: var(--bg-2);
  border-bottom: 1px solid var(--border-1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--sp-5);
  gap: var(--sp-4);
  flex-shrink: 0;
}

.header-breadcrumb {
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: var(--fs-13);
  color: var(--text-3);
}
.header-breadcrumb .crumb-icon { color: var(--text-4); }
.header-breadcrumb .crumb-current {
  color: var(--text-1);
  font-weight: var(--fw-medium);
}

.header-title {
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}

.header-info {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}

.header-icon-btn {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm);
  color: var(--text-2);
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.header-icon-btn:hover {
  background: var(--bg-3);
  color: var(--color-primary);
}
.header-icon-btn .el-icon { font-size: 18px; }

.header-divider {
  width: 1px;
  height: 20px;
  background: var(--border-1);
}

.user-info {
  display: flex; align-items: center; gap: var(--sp-2);
  padding: var(--sp-1) var(--sp-2);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease);
}
.user-info:hover { background: var(--bg-3); }
.user-info .el-icon { color: var(--text-3); font-size: 16px; }
.user-info span { font-size: var(--fs-13); color: var(--text-1); font-weight: var(--fw-medium); }

.user-avatar {
  width: 28px; height: 28px;
  border-radius: var(--r-pill);
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: var(--text-on-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: var(--fs-12);
  font-weight: var(--fw-semibold);
}

/* ---- 4.4 内容区 ---- */
.app-content {
  flex: 1;
  padding: var(--sp-5) var(--sp-6);
  overflow-y: auto;
  background: var(--bg-1);
  max-width: var(--content-max);
  width: 100%;
  margin: 0 auto;
}

/* =====================================================
 * 5. 卡片
 * ===================================================== */
.app-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-xs);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-normal) var(--ease), transform var(--t-fast) var(--ease);
}
.app-card.is-hoverable:hover {
  border-color: var(--border-2);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}

.app-card-pad {
  padding: var(--sp-5);
}

.app-card-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-4) var(--sp-5);
  border-bottom: 1px solid var(--border-1);
}
.app-card-head .head-title {
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  display: flex; align-items: center; gap: var(--sp-2);
}
.app-card-head .head-title .head-icon {
  color: var(--color-primary);
  font-size: 16px;
}
.app-card-head .head-extra {
  font-size: var(--fs-12);
  color: var(--text-3);
}
.app-card-body { padding: var(--sp-5); }

/* chart-box 兼容旧样式 */
.chart-box {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-xs);
  display: flex; flex-direction: column;
  min-height: 280px;
}
.chart-box:hover { border-color: var(--border-2); }
/* 非图表的卡片容器：高度按内容自适应，避免 chart-box 的 280px 最小高度留白 */
.chart-box.chart-box--auto { min-height: auto; }
.chart-title {
  font-size: var(--fs-14);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  margin-bottom: var(--sp-3);
  display: flex; align-items: center; justify-content: space-between;
}
.chart-title .el-tag { font-size: var(--fs-11); }
.chart-canvas { flex: 1; min-height: 240px; }
.chart-container { width: 100%; height: 100%; min-height: 260px; }
.chart-container-sm { min-height: 240px; }
.chart-box .chart-container,
.chart-box .chart-container-sm { width: 100%; height: 100%; }

/* 驾驶舱风险列表 */
.risk-list { display: flex; flex-direction: column; gap: var(--sp-2); }
.risk-item {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-3);
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.risk-item:hover { border-color: var(--color-primary); background: var(--bg-2); }
.risk-item.risk-blocked { border-left: 3px solid var(--color-danger); }
.risk-tag {
  display: inline-flex; align-items: center;
  padding: 2px 8px;
  border-radius: var(--r-sm);
  font-size: var(--fs-11);
  font-weight: var(--fw-semibold);
  flex-shrink: 0;
}
.risk-tag.risk-high { background: var(--color-danger-soft); color: var(--color-danger); }
.risk-tag.risk-mid  { background: var(--color-warning-soft); color: var(--color-warning); }
.risk-content { flex: 1; font-size: var(--fs-13); color: var(--text-1); font-weight: var(--fw-medium); }
.risk-owner { font-size: var(--fs-11); color: var(--text-3); flex-shrink: 0; }

/* 空/通用提示 */
.empty-tip {
  text-align: center;
  color: var(--text-4);
  font-size: var(--fs-12);
  padding: var(--sp-5);
}

/* =====================================================
 * 24. 通用业务布局类（视图补遗）
 * ===================================================== */
.kpi-row-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.section-title {
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  margin: var(--sp-4) 0 var(--sp-3);
  display: flex; align-items: center; gap: var(--sp-2);
}

.list-toolbar { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.list-toolbar .toolbar-left { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.list-toolbar .toolbar-right { display: flex; align-items: center; gap: var(--sp-2); margin-left: auto; }
.list-filters { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.selector-label { color: var(--text-3); font-size: var(--fs-13); margin-right: var(--sp-2); }

/* 登录页 */
.login-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.login-brand { font-size: var(--fs-13); color: var(--text-3); margin-top: var(--sp-3); text-align: center; }
.login-submit { width: 100%; }

/* 详情页 */
.detail-page {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: var(--sp-4);
}
.detail-side {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  height: fit-content;
  box-shadow: var(--shadow-xs);
}
.detail-back { display: inline-flex; align-items: center; gap: 4px; color: var(--color-primary); cursor: pointer; margin-bottom: var(--sp-3); font-size: var(--fs-13); }
/* 常规事项详情：结构化字段布局（替代原先带项目符号的 ul 列表） */
.rd-wrap { display: flex; flex-direction: column; gap: var(--sp-3); }

.rd-head {
  background: var(--bg-3);
  border: 1px solid var(--border-2);
  border-radius: var(--r-lg);
  padding: var(--sp-3) var(--sp-4);
  display: flex; flex-direction: column; gap: var(--sp-2);
}
.rd-title-row { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.rd-title {
  font-size: var(--fs-16); font-weight: var(--fw-semibold); color: var(--text-1);
  line-height: 1.5; word-break: break-word; min-width: 0;
}
.rd-meta {
  display: flex; align-items: center; gap: var(--sp-1) var(--sp-4); flex-wrap: wrap;
  font-size: var(--fs-12); color: var(--text-3); line-height: 1.6;
}
.rd-meta-item { display: inline-flex; align-items: center; gap: 4px; min-width: 0; word-break: break-word; }
.rd-meta-item .el-icon { font-size: 14px; color: var(--text-4); flex-shrink: 0; }

.rd-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.rd-cell {
  background: var(--bg-2);
  border: 1px solid var(--border-2);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
.rd-lbl { font-size: var(--fs-12); color: var(--text-3); line-height: 1.5; }
.rd-val {
  font-size: var(--fs-14); font-weight: var(--fw-semibold); color: var(--text-1);
  line-height: 1.6; font-variant-numeric: tabular-nums; word-break: break-word;
}
.rd-val.is-danger { color: var(--color-danger); }
.rd-val.is-muted, .rd-block-text.is-muted { color: var(--text-4); font-weight: var(--fw-regular); }

.rd-block {
  background: var(--bg-2);
  border: 1px solid var(--border-2);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  display: flex; flex-direction: column; gap: 2px;
}
.rd-block.is-warn { border-left-color: var(--color-danger); }
.rd-block-lbl { font-size: var(--fs-12); color: var(--text-3); line-height: 1.5; }
.rd-block-text {
  font-size: var(--fs-13); color: var(--text-1); line-height: 1.7;
  white-space: pre-wrap; word-break: break-word;
}
.rd-block.is-warn .rd-block-text { color: var(--color-danger); }
.rd-dialog .el-dialog__body { padding-top: var(--sp-3); }

/* 标签页 / tab-card */
.tab-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4);
  box-shadow: var(--shadow-xs);
}

/* 月度账单面板 */
.month-bill-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-3);
}
.month-bill-item {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: flex; flex-direction: column; gap: 4px;
}

/* 会议行动项面板 */
/* 行动项看板：四列纵向分组（待开始 / 进行中 / 已完成 / 逾期） */
.action-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3);
  align-items: start;
}
.ab-col {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  min-height: 120px;
  min-width: 0;
}
.ab-head {
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--text-1);
  padding-bottom: var(--sp-2); margin-bottom: var(--sp-2);
  border-bottom: 1px solid var(--border-1);
}
.ab-head.ab-not_started { color: var(--text-2); }
.ab-head.ab-in_progress { color: var(--color-primary); }
.ab-head.ab-completed  { color: var(--color-success); }
.ab-head.ab-overdue    { color: var(--color-danger); }
.ab-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--r-sm);
  padding: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-2);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.ab-card:hover { border-color: var(--color-primary); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.ab-content { font-size: var(--fs-13); color: var(--text-1); line-height: 1.5; word-break: break-word; }
/* 完成结果（行动项卡片/表格共用） */
.ab-result {
  font-size: var(--fs-11); color: var(--color-success); line-height: 1.5;
  margin-top: var(--sp-1); padding-left: var(--sp-2);
  border-left: 2px solid var(--color-success);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ab-foot {
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--fs-11); color: var(--text-3); margin-top: var(--sp-1);
}
.ab-empty { text-align: center; color: var(--text-4); font-size: var(--fs-12); padding: var(--sp-3) 0; }
/* 行动项表「完成结果」列 */
.ac-result { font-size: var(--fs-12); color: var(--text-1); line-height: 1.5; word-break: break-word; }
.ac-result.is-empty { color: var(--text-4); }
.ac-time { font-size: var(--fs-11); color: var(--text-3); font-variant-numeric: tabular-nums; margin-top: 1px; }
.action-stat-bar {
  display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap;
  margin-bottom: var(--sp-4);
}
.action-stat-bar > span:first-child {
  font-size: var(--fs-12); color: var(--text-3); margin-right: var(--sp-1);
}
.meeting-section { margin-bottom: var(--sp-5); }
.meeting-section .section-title { padding-left: var(--sp-3); border-left: 3px solid var(--color-primary); }
.meeting-tools { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-3); flex-wrap: wrap; }
.meeting-sub { font-size: var(--fs-12); color: var(--text-3); margin-bottom: var(--sp-2); }
.minutes-content {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-4);
  font-size: var(--fs-13);
  line-height: 1.7;
  color: var(--text-1);
  white-space: pre-wrap;
  min-height: 120px;
}
.meeting-title { font-size: var(--fs-14); font-weight: var(--fw-semibold); color: var(--text-1); }

/* 纪要编辑：正文 + 识别预览 左右并排（窄屏自动堆叠，见下方媒体查询） */
.minutes-edit-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  gap: var(--sp-3);
  align-items: stretch;
}
.minutes-edit-grid .el-textarea { min-width: 0; }
@media (max-width: 1180px) {
  .minutes-edit-grid { grid-template-columns: minmax(0, 1fr); }
}

/* 纪要编辑：行动项识别预览（避免"保存后才发现一条都没识别出来"） */
.parse-preview {
  border: 1px solid var(--border-2);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--r-md);
  background: var(--bg-3);
  padding: var(--sp-2) var(--sp-3);
  display: flex; flex-direction: column; gap: var(--sp-2);
  min-width: 0;
}
.parse-preview.is-empty { border-left-color: var(--color-warning); }
.parse-preview.is-ok { border-left-color: var(--color-success); }
.parse-preview .pp-head {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--fs-12); color: var(--text-2); line-height: 1.6;
}
.parse-preview .pp-head .el-icon { color: var(--text-3); flex-shrink: 0; }
.parse-preview.is-ok .pp-head .el-icon { color: var(--color-success); }
.parse-preview.is-empty .pp-head .el-icon { color: var(--color-warning); }
.parse-preview .pp-head b { color: var(--color-primary); font-variant-numeric: tabular-nums; }
.parse-preview .pp-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow-y: auto; }
.parse-preview .pp-item {
  display: flex; align-items: center; gap: var(--sp-2);
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-sm);
  padding: 3px var(--sp-2);
  font-size: var(--fs-12);
  min-width: 0;
}
.parse-preview .pp-idx {
  flex: 0 0 20px; text-align: center; color: var(--text-3);
  font-variant-numeric: tabular-nums;
}
.parse-preview .pp-text { flex: 1 1 auto; min-width: 0; color: var(--text-1); word-break: break-word; }
.parse-preview .pp-owner, .parse-preview .pp-due {
  flex: 0 0 auto; white-space: nowrap;
  color: var(--text-2); font-variant-numeric: tabular-nums;
}
.parse-preview .pp-owner.is-empty, .parse-preview .pp-due.is-empty { color: var(--color-warning); }
/* 识别预览：完成结果 / 已完成标记 */
.parse-preview .pp-result {
  display: block; margin-top: 1px;
  font-size: var(--fs-11); color: var(--color-success); word-break: break-word;
}
.parse-preview .pp-done {
  flex: 0 0 auto; white-space: nowrap;
  font-size: var(--fs-11); color: var(--color-success);
  border: 1px solid var(--color-success); border-radius: var(--r-sm);
  padding: 0 4px; line-height: 1.6;
}
.parse-preview .pp-more { font-size: var(--fs-11); color: var(--text-3); padding-left: 20px; }
.parse-preview .pp-tip {
  font-size: var(--fs-11); color: var(--text-3); line-height: 1.9;
  background: var(--bg-2);
  border: 1px dashed var(--border-2);
  border-radius: var(--r-sm);
  padding: var(--sp-2) var(--sp-3);
}
.parse-preview .pp-tip code { color: var(--text-2); }

/* 会议列表项 */
.mi-name {
  font-size: var(--fs-13); font-weight: var(--fw-medium); color: var(--text-1);
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mi-meta { font-size: var(--fs-11); color: var(--text-3); margin-top: 2px; }
.mi-stat { display: flex; gap: var(--sp-2); margin-top: 4px; flex-wrap: wrap; }
.mi-head { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; }

/* 时间线 */
.timeline {
  display: flex; flex-direction: column; gap: var(--sp-2);
  border-left: 2px solid var(--border-1);
  padding-left: var(--sp-4);
}
.timeline-item { position: relative; padding-left: var(--sp-3); }
.timeline-item::before {
  content: '';
  position: absolute;
  left: -7px; top: 4px;
  width: 12px; height: 12px;
  /* 默认 = 未到达阶段，一律灰色 */
  background: var(--border-2);
  border-radius: var(--r-pill);
  border: 2px solid var(--bg-2);
}
/* 已走过（已完成）阶段：绿点 + 绿字 */
.timeline-item.done::before { background: var(--color-success); }
.timeline-item.done .timeline-time { color: var(--color-success); }
/* 当前阶段：蓝点 + 高亮环，文字用主色 */
.timeline-item.current::before {
  background: var(--color-primary);
  box-shadow: var(--shadow-focus);
}
.timeline-item.current .timeline-time { color: var(--color-primary); font-weight: 600; }
/* 未到达阶段：整体灰色，不抢主色 */
.timeline-item:not(.done):not(.current) .timeline-time { color: var(--text-4); }
.timeline-time { font-size: var(--fs-12); color: var(--text-3); }

/* 内嵌表格 */
/* 注意：本类挂在 <el-table> 根节点上，不能加 padding ——
   会与 el-table 内部 100% 宽度的 wrapper 叠加，导致表格比容器宽 24px、末列被裁 */
.inner-table { background: var(--bg-3); border-radius: var(--r-md); }
.inner-table .el-table { background: var(--bg-2) !important; }

/* tariff 块 */
.tariff-block { background: var(--bg-3); border: 1px solid var(--border-1); border-radius: var(--r-md); padding: var(--sp-4); }
.tariff-block-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--sp-3); }
.tariff-empty { color: var(--text-3); font-size: var(--fs-13); padding: var(--sp-4) 0; text-align: center; }
.tariff-hot-name { font-weight: var(--fw-semibold); color: var(--text-1); font-size: var(--fs-13); }

/* =====================================================
 * 6. KPI 卡片
 * ===================================================== */
.kpi-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
}
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
}

.kpi-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4) var(--sp-5);
  position: relative;
  overflow: hidden;
  transition: transform var(--t-normal) var(--ease),
              border-color var(--t-normal) var(--ease),
              box-shadow var(--t-normal) var(--ease);
  cursor: default;
}
.kpi-card:hover {
  transform: translateY(-2px);
  border-color: var(--color-primary-soft-2);
  box-shadow: var(--shadow-md);
}
.kpi-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-accent) 100%);
}
.kpi-card.kpi-success::before { background: linear-gradient(90deg, var(--color-success) 0%, #059669 100%); }
.kpi-card.kpi-warning::before { background: linear-gradient(90deg, var(--color-warning) 0%, var(--color-danger) 100%); }
.kpi-card.kpi-danger::before  { background: linear-gradient(90deg, var(--color-danger) 0%, #b91c1c 100%); }

.kpi-label {
  font-size: var(--fs-12);
  color: var(--text-3);
  margin-bottom: var(--sp-2);
  display: flex; align-items: center; justify-content: space-between;
}
.kpi-label .kpi-icon { color: var(--color-primary); font-size: 16px; }

.kpi-value {
  font-size: var(--fs-28);
  font-weight: var(--fw-bold);
  color: var(--text-1);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.5px;
}
.kpi-unit {
  font-size: var(--fs-14);
  color: var(--text-3);
  font-weight: var(--fw-regular);
  margin-left: var(--sp-1);
}

.kpi-trend {
  font-size: var(--fs-12);
  color: var(--color-success);
  margin-top: var(--sp-2);
  display: flex; align-items: center; gap: 4px;
}
.kpi-trend.down { color: var(--color-danger); }

/* 紧凑数字统计 */
.kpi-mini {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-3);
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.kpi-mini:hover { border-color: var(--border-2); background: var(--bg-3); }
.kpi-mini .kpi-mini-label { font-size: var(--fs-12); color: var(--text-3); }
.kpi-mini .kpi-mini-value { font-size: var(--fs-22); font-weight: var(--fw-bold); color: var(--text-1); line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi-mini.kpi-mini-primary .kpi-mini-value { color: var(--color-primary); }
.kpi-mini.kpi-mini-success .kpi-mini-value { color: var(--color-success); }
.kpi-mini.kpi-mini-warning .kpi-mini-value { color: var(--color-warning); }
.kpi-mini.kpi-mini-danger  .kpi-mini-value { color: var(--color-danger); }

/* =====================================================
 * 7. 状态标签 / 状态色板
 * ===================================================== */
.status-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 10px;
  border-radius: var(--r-sm);
  font-size: var(--fs-12);
  font-weight: var(--fw-semibold);
  line-height: 1.5;
  letter-spacing: 0.2px;
  cursor: default;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: max-content;
}

.status-dot {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: var(--r-pill);
  flex-shrink: 0;
}

.status-pending   { background: var(--bg-3);       color: var(--text-2);    border: 1px solid var(--border-2); }
.status-progress  { background: var(--color-primary-soft);  color: var(--color-primary);  border: 1px solid var(--color-primary-soft-2); }
.status-completed { background: var(--color-success-soft);  color: var(--color-success);  border: 1px solid rgba(22,163,74,0.35); }
.status-suspended { background: var(--color-warning-soft);  color: var(--color-warning);  border: 1px solid rgba(217,119,6,0.35); }
.status-blocked   { background: var(--color-danger-soft);   color: var(--color-danger);   border: 1px solid rgba(220,38,38,0.35); }
.status-risk      { background: var(--color-danger-soft);   color: var(--color-danger);   border: 1px solid rgba(220,38,38,0.35); }
.status-overdue   {
  background: var(--color-danger-soft);
  color: var(--color-danger);
  border: 1px solid var(--color-danger);
  animation: pulse 1.8s var(--ease) infinite;
}
[data-theme="dark"] .status-overdue { color: #fca5a5; }

.status-cancelled {
  background: var(--bg-3);
  color: var(--text-3);
  border: 1px solid var(--border-2);
  text-decoration: line-through;
}

.status-registered {
  background: var(--color-accent-soft);
  color: var(--color-accent);
  border: 1px solid var(--color-accent-soft-2);
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}

/* 状态点 */
.status-dot.pending    { background: var(--text-3); }
.status-dot.progress   { background: var(--color-primary); }
.status-dot.completed  { background: var(--color-success); }
.status-dot.suspended  { background: var(--color-warning); }
.status-dot.blocked,
.status-dot.risk,
.status-dot.overdue    { background: var(--color-danger); }
.status-dot.cancelled  { background: var(--text-4); }
.status-dot.registered  { background: var(--color-accent); }
.status-dot.normal,
.status-dot.primary    { background: var(--color-primary); }
.status-dot.paying     { background: var(--color-warning); }
.status-dot.not_started{ background: var(--text-3); }
.status-dot.in_progress{ background: var(--color-primary); }

/* 下拉项 */
.el-dropdown-menu {
  background: var(--bg-4) !important;
  border: 1px solid var(--border-2) !important;
  box-shadow: var(--shadow-md) !important;
  border-radius: var(--r-md) !important;
  padding: var(--sp-1) !important;
}
.el-dropdown-menu__item {
  color: var(--text-1) !important;
  border-radius: var(--r-xs) !important;
  font-size: var(--fs-13) !important;
  padding: 8px 12px !important;
  margin: 1px 0 !important;
}
.el-dropdown-menu__item:not(.is-disabled):hover,
.el-dropdown-menu__item:focus {
  background: var(--bg-3) !important;
  color: var(--color-primary) !important;
}
.el-dropdown-menu__item--divided {
  border-top: 1px solid var(--border-1) !important;
  margin-top: 4px !important;
}

/* =====================================================
 * 8. 按钮（Element Plus 主题化）
 * ===================================================== */
.el-button {
  font-weight: var(--fw-medium);
  border-radius: var(--r-sm);
  transition: background-color var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease),
              color var(--t-fast) var(--ease),
              box-shadow var(--t-fast) var(--ease);
}
.el-button:focus { box-shadow: var(--shadow-focus) !important; }
.el-button--small { font-size: var(--fs-12); padding: 6px 12px; }
.el-button + .el-button { margin-left: var(--sp-2); }

.el-button--primary {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--text-on-primary);
}
.el-button--primary:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  color: var(--text-on-primary);
}
.el-button--primary:active {
  background: var(--color-primary-active);
  border-color: var(--color-primary-active);
  color: var(--text-on-primary);
}
.el-button--primary.is-disabled,
.el-button--primary.is-disabled:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  opacity: 0.5;
}

.el-button--success {
  background: var(--color-success);
  border-color: var(--color-success);
  color: var(--text-on-primary);
}
.el-button--success:hover { background: var(--color-success-hover); border-color: var(--color-success-hover); }

.el-button--warning {
  background: var(--color-warning);
  border-color: var(--color-warning);
  color: var(--text-on-primary);
}
.el-button--warning:hover { background: var(--color-warning-hover); border-color: var(--color-warning-hover); }

.el-button--danger {
  background: var(--color-danger);
  border-color: var(--color-danger);
  color: var(--text-on-primary);
}
.el-button--danger:hover { background: var(--color-danger-hover); border-color: var(--color-danger-hover); }

.el-button--info {
  background: var(--bg-3);
  border-color: var(--border-2);
  color: var(--text-1);
}
.el-button--info:hover {
  background: var(--bg-3);
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.el-button--default {
  background: var(--bg-2);
  border-color: var(--border-2);
  color: var(--text-1);
}
.el-button--default:hover {
  background: var(--bg-3);
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.el-button--default:active {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

/* 注意：Element Plus 对「未指定 type」的按钮并不会输出 .el-button--default 类，
   上面 3 条规则实际永不命中；非链接按钮会沿用 EP 浅色主题的白底，
   在深色主题下表现为刺眼的白按钮。以下用 :not 组合真正命中这类按钮。 */
[data-theme="dark"] .el-button:not(.is-link):not(.is-text):not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info) {
  background: var(--bg-2);
  border-color: var(--border-2);
  color: var(--text-1);
}
[data-theme="dark"] .el-button:not(.is-link):not(.is-text):not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info):hover {
  background: var(--bg-3);
  border-color: var(--color-primary);
  color: var(--color-primary);
}
[data-theme="dark"] .el-button:not(.is-link):not(.is-text):not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--info):active {
  background: var(--color-primary-soft);
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.el-button.is-link, .el-button--text {
  background: transparent;
  border: none;
  padding: 2px 6px;
}
.el-button.is-link, .el-button--text { color: var(--color-primary); }
.el-button.is-link:hover, .el-button--text:hover { color: var(--color-primary-hover); }
/* 链接型按钮按语义着色：此前被上一条规则统一覆盖为 `--color-primary`，
   导致「删除 / 编辑 / 完成 / 作废」等操作按钮全部同一蓝色、无法区分（观感"乱"）。
   用复合选择器提高优先级，让 type 语义色生效。 */
.el-button.is-link.el-button--success { color: var(--color-success); }
.el-button.is-link.el-button--warning { color: var(--color-warning); }
.el-button.is-link.el-button--danger  { color: var(--color-danger); }
.el-button.is-link.el-button--info    { color: var(--text-2); }
.el-button.is-link.el-button--success:hover { color: var(--color-success-hover); }
.el-button.is-link.el-button--warning:hover { color: var(--color-warning-hover); }
.el-button.is-link.el-button--danger:hover  { color: var(--color-danger-hover); }
.el-button.is-link.is-disabled,
.el-button.is-link.is-disabled:hover,
.el-button--text.is-disabled { color: var(--text-4) !important; opacity: .55; cursor: not-allowed; }

/* =====================================================
 * 9. 表单（Element Plus 主题化）
 * ===================================================== */
.el-form-item__label {
  color: var(--text-2) !important;
  font-size: var(--fs-13) !important;
  font-weight: var(--fw-medium) !important;
  line-height: 32px !important;
}

.el-input__wrapper,
.el-textarea__inner,
.el-select__wrapper,
.el-date-editor.el-input__wrapper {
  background: var(--bg-2) !important;
  box-shadow: 0 0 0 1px var(--border-2) inset !important;
  border-radius: var(--r-sm) !important;
  transition: box-shadow var(--t-fast) var(--ease) !important;
}
.el-input__wrapper:hover,
.el-textarea__inner:hover,
.el-select__wrapper:hover {
  box-shadow: 0 0 0 1px var(--color-primary) inset !important;
}
.el-input__wrapper.is-focus,
.el-textarea__inner:focus,
.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 2px var(--color-primary) inset, 0 0 0 3px var(--color-primary-soft) !important;
}
.el-input__inner,
.el-textarea__inner {
  color: var(--text-1) !important;
  font-size: var(--fs-13) !important;
}
.el-input__inner::placeholder,
.el-textarea__inner::placeholder { color: var(--text-4) !important; }

.el-select__placeholder { color: var(--text-4) !important; }

.el-checkbox__label, .el-radio__label { color: var(--text-1) !important; font-size: var(--fs-13) !important; }
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-radio__input.is-checked .el-radio__inner {
  background: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

.el-form-item.is-error .el-input__wrapper {
  box-shadow: 0 0 0 1px var(--color-danger) inset !important;
}

.el-form-item__error {
  color: var(--color-danger) !important;
  font-size: var(--fs-12) !important;
  padding-top: 2px !important;
}

/* =====================================================
 * 10. 表格（Element Plus 主题化）
 * ===================================================== */
.el-table {
  --el-table-bg-color: var(--bg-2);
  --el-table-tr-bg-color: var(--bg-2);
  --el-table-header-bg-color: var(--bg-3);
  --el-table-border-color: var(--border-1);
  --el-table-header-text-color: var(--text-1);
  --el-table-text-color: var(--text-1);
  --el-table-row-hover-bg-color: var(--bg-3);
  --el-table-border: 1px solid var(--border-1);
  --el-table-fixed-box-shadow: 0 0 10px rgba(15,23,42,0.06);
  background: var(--bg-2) !important;
  color: var(--text-1) !important;
  border-radius: var(--r-md) !important;
  overflow: hidden;
  font-size: var(--fs-13);
  border: 1px solid var(--border-1);
}
.el-table th.el-table__cell {
  background: var(--bg-3) !important;
  color: var(--text-1) !important;
  border-bottom: 1px solid var(--border-1) !important;
  font-weight: var(--fw-semibold) !important;
  font-size: var(--fs-13) !important;
  height: 44px !important;
}
.el-table td.el-table__cell {
  border-bottom: 1px solid var(--border-1) !important;
  font-size: var(--fs-13) !important;
  color: var(--text-1) !important;
  word-break: keep-all;
  background: var(--bg-2) !important;
  padding: 10px 0 !important;
}
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background: var(--bg-3) !important;
}
.el-table__empty-block { background: var(--bg-2) !important; }
.el-table .row-overdue { background: rgba(220,38,38,0.06) !important; }
.el-table .row-overdue:hover { background: rgba(220,38,38,0.12) !important; }
.el-table .cell { color: var(--text-1); }

/* 宽表格：Element Plus 用自定义滚动条（悬停/滚动时出现），横向滚动可访问全部列。
   此处仅加深滚动条颜色以提升可见性。 */
.el-table .el-scrollbar__bar.is-horizontal > div {
  background: var(--border-3);
}

/* 表格工具条 */
.table-toolbar {
  display: flex; align-items: center; gap: var(--sp-2);
  margin-bottom: var(--sp-3);
  flex-wrap: wrap;
}
.table-toolbar .toolbar-left { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.table-toolbar .toolbar-right { display: flex; align-items: center; gap: var(--sp-2); margin-left: auto; }

/* =====================================================
 * 11. Element Plus 弹窗 / 下拉面板 / 消息
 * ===================================================== */
.el-dialog {
  background: var(--bg-2) !important;
  border: 1px solid var(--border-1) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  overflow: hidden;
}
.el-dialog__header {
  background: var(--bg-2);
  padding: var(--sp-4) var(--sp-5) !important;
  border-bottom: 1px solid var(--border-1);
}
.el-dialog__title {
  color: var(--text-1) !important;
  font-size: var(--fs-15) !important;
  font-weight: var(--fw-semibold);
}
.el-dialog__headerbtn .el-dialog__close { color: var(--text-3); font-size: 18px; }
.el-dialog__body {
  color: var(--text-1) !important;
  padding: var(--sp-5) !important;
  background: var(--bg-2);
}
.el-dialog__footer {
  background: var(--bg-2);
  padding: var(--sp-3) var(--sp-5) var(--sp-4) !important;
  border-top: 1px solid var(--border-1);
}

.el-popper.is-light,
.el-select-dropdown,
.el-dropdown-menu,
.el-autocomplete-suggestion {
  background: var(--bg-4) !important;
  border: 1px solid var(--border-2) !important;
  box-shadow: var(--shadow-md) !important;
  border-radius: var(--r-md) !important;
  padding: var(--sp-1) !important;
}
.el-select-dropdown__item {
  color: var(--text-1) !important;
  font-size: var(--fs-13) !important;
  border-radius: var(--r-xs) !important;
  padding: 6px 12px !important;
}
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
  background: var(--bg-3) !importantimportant;
  color: var(--color-primary) !important;
}
.el-select-dropdown__item.selected {
  background: var(--color-primary-soft) !important;
  color: var(--color-primary) !important;
  font-weight: var(--fw-medium) !important;
}

.el-message {
  background: var(--bg-4) !important;
  border: 1px solid var(--border-2) !important;
  color: var(--text-1) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow-md) !important;
}
.el-message .el-message__content { color: var(--text-1) !important; font-size: var(--fs-13) !important; }
.el-message--success { border-left: 3px solid var(--color-success) !important; }
.el-message--warning { border-left: 3px solid var(--color-warning) !important; }
.el-message--error   { border-left: 3px solid var(--color-danger)  !important; }
.el-message--info    { border-left: 3px solid var(--color-info)    !important; }

.el-message-box {
  background: var(--bg-2) !important;
  border: 1px solid var(--border-2) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-lg) !important;
}
.el-message-box__title { color: var(--text-1) !important; }
.el-message-box__content { color: var(--text-2) !important; }
.el-message-box__btns .el-button--primary {
  background: var(--color-primary); border-color: var(--color-primary); color: var(--text-on-primary);
}

.el-tabs__item {
  color: var(--text-2) !important;
  font-size: var(--fs-13);
  font-weight: var(--fw-medium);
}
.el-tabs__item.is-active { color: var(--color-primary) !important; }
.el-tabs__active-bar { background: var(--color-primary) !important; }

.el-tag {
  border-radius: var(--r-sm);
  font-size: var(--fs-12);
  font-weight: var(--fw-medium);
}
.el-tag--primary { background: var(--color-primary-soft); color: var(--color-primary); border-color: var(--color-primary-soft-2); }
.el-tag--success { background: var(--color-success-soft); color: var(--color-success); border-color: rgba(22,163,74,0.3); }
.el-tag--warning { background: var(--color-warning-soft); color: var(--color-warning); border-color: rgba(217,119,6,0.3); }
.el-tag--danger  { background: var(--color-danger-soft); color: var(--color-danger); border-color: rgba(220,38,38,0.3); }
.el-tag--info    { background: var(--bg-3); color: var(--text-2); border-color: var(--border-2); }
.el-tag.is-hit   { border-color: var(--color-primary); }

.el-progress__text { color: var(--text-2) !important; font-size: var(--fs-12) !important; }
.el-progress-bar__outer { background: var(--bg-3) !important; }

.el-loading-mask {
  background-color: var(--bg-overlay) !important;
}

.el-pagination {
  color: var(--text-2) !important;
  font-size: var(--fs-13);
}
.el-pagination .btn-prev,
.el-pagination .btn-next,
.el-pagination .el-pager li {
  background: var(--bg-2) !important;
  color: var(--text-2) !important;
  border: 1px solid var(--border-1) !important;
}
.el-pagination .el-pager li.is-active {
  background: var(--color-primary) !important;
  color: var(--text-on-primary) !important;
  border-color: var(--color-primary) !important;
}

.el-switch__core {
  border: 1px solid var(--border-2) !important;
  background: var(--border-2) !important;
}
.el-switch.is-checked .el-switch__core {
  background: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

/* =====================================================
 * 12. 项目档案 / CRM 看板
 * ===================================================== */
.crm-board {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp-3);
  overflow-x: auto;
  padding-bottom: var(--sp-2);
}
.crm-col {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  display: flex; flex-direction: column;
  min-width: 220px;
  transition: border-color var(--t-fast) var(--ease);
  box-shadow: var(--shadow-xs);
}
.crm-col:hover { border-color: var(--border-2); box-shadow: var(--shadow-sm); }

.crm-col-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sp-3) var(--sp-4);
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  border-bottom: 1px solid var(--border-1);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  background: var(--bg-3);
}
/* 看板列头计数徽标：实底（阶段色，由模板内联给出）+ 高对比数字。
   文字色必须在这里显式指定：全局 `.el-tag--*` 规则（见第 23 节）会把标签文字色拉成
   var(--color-primary)，并且优先级高于 Element Plus 的 `effect="dark"`，
   导致「准备签约」列出现蓝底(#2c5cf6)蓝字(#2c5cf6) —— 数字完全看不见。 */
.crm-col-head .el-tag.crm-col-count {
  color: #fff;
  min-width: 24px;
  justify-content: center;
  text-align: center;
  font-weight: var(--fw-semibold);
}
/* 深色主题的阶段色是浅色调（如 --color-warning #fbbf24、--color-success #34d399），
   白字对比不足 2:1，故改用页面底色作字色（各阶段均 ≥5:1）。 */
[data-theme="dark"] .crm-col-head .el-tag.crm-col-count { color: var(--bg-1); }

.crm-col-body {
  padding: var(--sp-3);
  display: flex; flex-direction: column; gap: var(--sp-2);
  max-height: 640px;
  overflow-y: auto;
}

.crm-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease),
              box-shadow var(--t-fast) var(--ease);
}
.crm-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.crm-card-title {
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  margin-bottom: var(--sp-2);
  line-height: 1.4;
}
.crm-card-meta { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-2); flex-wrap: wrap; }
.crm-region { font-size: var(--fs-11); color: var(--text-3); }
.crm-card-line { font-size: var(--fs-12); color: var(--text-3); margin-bottom: var(--sp-2); line-height: 1.5; }
.crm-card-foot {
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--fs-11);
  color: var(--text-4);
  padding-top: var(--sp-2);
  border-top: 1px solid var(--border-1);
}
.crm-amount { color: var(--color-success); font-weight: var(--fw-semibold); }
/* 「单价待定」这类未填提示：需能被看清（--text-4 在 11px 小字下白底仅 2.56:1，过淡），
   提到 --text-3 提升到 ~4.7:1；保持 regular 字重以区别于已填单价的 semibold。 */
.crm-amount.dim { color: var(--text-3); font-weight: var(--fw-regular); }
/* 看板卡片行内操作（编辑/删除） */
.crm-card-actions {
  display: flex; align-items: center; justify-content: flex-end; gap: var(--sp-2);
  margin-top: var(--sp-1);
}

/* =====================================================
 * 13. IPD 计划
 * ===================================================== */
.ipd-drop {
  background: var(--bg-2);
  border: 1px dashed var(--border-2);
  border-radius: var(--r-md);
  padding: var(--sp-4);
}
.plan-card-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-3);
  border-radius: var(--r-md);
}
.plan-card-head .plan-name { font-size: var(--fs-14); font-weight: var(--fw-semibold); color: var(--text-1); margin-right: var(--sp-3); }
.plan-card-head .plan-actions { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.plan-actions .el-progress { width: 110px; flex: none; }
.plan-actions .plan-progress-text {
  font-size: var(--fs-12); color: var(--text-3); white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.project-selector-bar {
  display: flex; align-items: center; gap: var(--sp-3);
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  margin-bottom: var(--sp-4);
}
.project-selector-bar .bar-label { color: var(--text-3); font-size: var(--fs-13); }
.project-selector-bar .el-select { width: 280px; }

/* =====================================================
 * 14. 常规事项统计卡片
 * ===================================================== */
.routine-stats {
  display: grid;
  /* 5 张卡片：全部 / 进行中 / 未启动 / 已完成 / 逾期（需求 V3.5 常规事项统计口径） */
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
}
.stat-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4) var(--sp-5);
  display: flex; align-items: center; gap: var(--sp-4);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
  box-shadow: var(--shadow-xs);
}
.stat-card:hover { border-color: var(--border-2); box-shadow: var(--shadow-sm); }
.stat-card .stat-icon {
  width: 44px; height: 44px;
  border-radius: var(--r-md);
  display: flex; align-items: center; justify-content: center;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  font-size: 22px;
}
.stat-card.stat-success .stat-icon { background: var(--color-success-soft); color: var(--color-success); }
.stat-card.stat-warning .stat-icon { background: var(--color-warning-soft); color: var(--color-warning); }
.stat-card.stat-danger  .stat-icon { background: var(--color-danger-soft);  color: var(--color-danger); }
.stat-card .stat-body { flex: 1; min-width: 0; }
.stat-card .stat-value {
  font-size: var(--fs-24);
  font-weight: var(--fw-bold);
  color: var(--text-1);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.5px;
}
.stat-card .stat-label { font-size: var(--fs-12); color: var(--text-3); margin-top: 2px; }

/* =====================================================
 * 15. 运营 / 财务 / 详情页
 * ===================================================== */
.finance-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: var(--sp-2) 0;
  font-size: var(--fs-13);
  border-bottom: 1px dashed var(--border-1);
}
.finance-row:last-child { border-bottom: none; }
.finance-row .finance-label { color: var(--text-3); }
.finance-row .finance-value { color: var(--text-1); font-weight: var(--fw-semibold); }
.finance-row .finance-value.highlight { color: var(--color-primary); }
.finance-row .finance-value.warn { color: var(--color-warning); }

.cell-amount {
  font-weight: var(--fw-semibold);
  font-variant-numeric: tabular-nums;
}
.cell-amount.success { color: var(--color-success) !important; }
.cell-amount.warning { color: var(--color-warning) !important; }
.cell-amount.danger  { color: var(--color-danger)  !important; }
.cell-amount.primary { color: var(--color-primary) !important; }

.detail-row {
  display: flex; align-items: flex-start; gap: var(--sp-3);
  padding: var(--sp-2) 0;
  font-size: var(--fs-13);
  border-bottom: 1px dashed var(--border-1);
}
.detail-row:last-child { border-bottom: none; }
.detail-row .label {
  color: var(--text-3);
  width: 96px;
  flex-shrink: 0;
}
.detail-row .value {
  color: var(--text-1);
  flex: 1;
}

/* =====================================================
 * 16. 会议管理
 * ===================================================== */
.meeting-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: var(--sp-4);
}
.meeting-side {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  display: flex; flex-direction: column;
  max-height: 70vh;
  box-shadow: var(--shadow-xs);
}
.meeting-side .meeting-search {
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--border-1);
}
.meeting-side .meeting-list { flex: 1; overflow-y: auto; padding: var(--sp-2); }
.meeting-side .meeting-item {
  display: block;
  padding: var(--sp-3);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease);
}
.meeting-side .meeting-item:hover { background: var(--bg-3); }
.meeting-side .meeting-item.active {
  background: var(--color-primary-soft);
}
.meeting-side .meeting-item.active .mi-name { color: var(--color-primary); }
.meeting-side .meeting-title { font-size: var(--fs-13); font-weight: var(--fw-medium); color: var(--text-1); }
.meeting-side .meeting-time { font-size: var(--fs-11); color: var(--text-3); margin-top: 2px; }

.meeting-main {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-5);
  box-shadow: var(--shadow-xs);
  min-height: 70vh;
}
.meeting-head {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border-1);
  margin-bottom: var(--sp-4);
}
.meeting-head .meeting-title-main {
  font-size: var(--fs-18);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}
.meeting-head .meeting-meta { color: var(--text-3); font-size: var(--fs-12); margin-top: 4px; }

.action-item {
  display: flex; align-items: center; gap: var(--sp-3);
  padding: var(--sp-3);
  border-radius: var(--r-md);
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  margin-bottom: var(--sp-2);
}
.action-item .action-content { flex: 1; }
.action-item .action-title { font-size: var(--fs-13); color: var(--text-1); font-weight: var(--fw-medium); }
.action-item .action-meta { font-size: var(--fs-11); color: var(--text-3); margin-top: 2px; }

/* =====================================================
 * 17. 课题详情 / 任务管理
 * ===================================================== */
.topic-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--sp-4);
}
.topic-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4) var(--sp-5);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease),
              box-shadow var(--t-fast) var(--ease);
  box-shadow: var(--shadow-xs);
}
.topic-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
/* 卡片 = 纯详情入口：卡片整体可点，不再排布操作按钮（操作统一收进详情弹窗） */
.topic-card-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: var(--sp-3); margin-bottom: var(--sp-3);
}
.topic-card-title { min-width: 0; }
.topic-card-name {
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  line-height: 1.4;
  word-break: break-word;
}
.topic-card-meta {
  font-size: var(--fs-12);
  color: var(--text-3);
  margin-top: 2px;
}
.topic-card-sub {
  font-size: var(--fs-12);
  color: var(--text-3);
  margin-bottom: var(--sp-2);
}
.topic-card-tags {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  min-height: 24px;
}
.topic-card-more {
  display: flex; align-items: center; justify-content: flex-end; gap: 4px;
  margin-top: var(--sp-3); padding-top: var(--sp-3);
  border-top: 1px dashed var(--border-1);
  font-size: var(--fs-12);
  color: var(--color-primary);
  opacity: 0.72;
  transition: opacity var(--t-fast) var(--ease);
}
.topic-card:hover .topic-card-more { opacity: 1; }

/* =====================================================
 * 18. 设备台账
 * ===================================================== */
.tariff-block {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-4);
}
.tariff-hot-row {
  display: grid;
  grid-template-columns: 1fr 32px;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
  padding: var(--sp-3);
  background: var(--bg-2);
  border-radius: var(--r-sm);
  border: 1px solid var(--border-1);
}
.tariff-hot-row + .tariff-users { padding-left: var(--sp-4); border-left: 2px solid var(--border-1); margin-left: var(--sp-3); }
.tariff-user-row {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 32px;
  gap: var(--sp-2);
  margin-bottom: var(--sp-2);
}
.tariff-user-row .el-input__wrapper { background: var(--bg-2); }

/* 合同信息：热源采购合同 / 用户销售合同（各自独立编号与期限） */
.contract-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3) var(--sp-4);
  padding: var(--sp-3);
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-sm);
}
.contract-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.contract-item.wide { grid-column: 1 / -1; }
.contract-item .label { font-size: var(--fs-11); color: var(--text-3); }
.contract-item .value { font-size: var(--fs-13); color: var(--text-1); word-break: break-all; line-height: 1.5; }
.contract-item .value.strong {
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  font-variant-numeric: tabular-nums;
}
.contract-sub-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: var(--sp-4) 0 var(--sp-2);
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}
.contract-sub-title::before {
  content: '';
  width: 3px;
  height: 13px;
  border-radius: 2px;
  background: var(--color-primary);
}

/* 新建项目弹窗内的合同录入栅格 */
.contract-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-3) var(--sp-4);
}
.cfg-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cfg-item > label { font-size: var(--fs-12); color: var(--text-3); }
.cfg-item > label em { color: var(--color-danger); font-style: normal; margin-left: 2px; }

/* =====================================================
 * 19. 驾驶舱 / Chart 网格
 * ===================================================== */
.cockpit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp-4);
  margin-bottom: var(--sp-4);
}
.cockpit-row-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-4);
  margin-bottom: var(--sp-4);
}
.chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); }
/* ---- AI 接口配置：额度总览卡 ---- */
.ai-stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3); margin-bottom: var(--sp-4);
}
.ai-stat {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0;
}
.ai-stat .as-label { font-size: var(--fs-12); color: var(--text-3); }
.ai-stat .as-value {
  font-size: var(--fs-20); font-weight: var(--fw-semibold);
  color: var(--text-1); font-variant-numeric: tabular-nums; line-height: 1.3;
}
.ai-stat .as-value .as-unit { font-size: var(--fs-12); font-weight: var(--fw-regular); color: var(--text-3); margin-left: 4px; }
.ai-stat .as-value.is-ok     { color: var(--color-success); }
.ai-stat .as-value.is-warn   { color: var(--color-warning); }
.ai-stat .as-value.is-danger { color: var(--color-danger); }
.ai-stat .as-value.is-off    { color: var(--text-3); }
.ai-stat .as-sub { font-size: var(--fs-11); color: var(--text-4); line-height: 1.5; word-break: break-word; }
.chart-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }

/* 驾驶舱 · 设备状态统计卡片 */
.equip-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: var(--sp-3);
}
.equip-stat {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.equip-stat:hover { border-color: var(--border-2); transform: translateY(-1px); }
.equip-stat .es-dot {
  width: 8px; height: 8px; border-radius: var(--r-pill);
  background: var(--text-3); margin-bottom: 4px;
}
.equip-stat .es-label { font-size: var(--fs-12); color: var(--text-3); }
.equip-stat .es-value {
  font-size: var(--fs-22); font-weight: var(--fw-bold); color: var(--text-1);
  line-height: 1.2; font-variant-numeric: tabular-nums;
}
.equip-stat .es-unit { font-size: var(--fs-12); font-weight: var(--fw-regular); color: var(--text-3); margin-left: 3px; }
.equip-stat .es-dot.status-registered { background: var(--color-accent); }
.equip-stat .es-dot.status-completed  { background: var(--color-success); }
.equip-stat .es-dot.status-pending    { background: var(--color-info); }
.equip-stat .es-dot.status-progress   { background: var(--color-primary); }
.equip-stat .es-dot.status-suspended  { background: var(--color-warning); }
.equip-stat .es-dot.status-blocked    { background: var(--color-danger); }

/* =====================================================
 * 20. 登录页
 * ===================================================== */
.login-bg {
  min-height: 100vh;
  background:
    radial-gradient(1200px 600px at 10% 0%, var(--color-primary-soft) 0%, transparent 60%),
    radial-gradient(1000px 500px at 90% 100%, var(--color-accent-soft) 0%, transparent 60%),
    var(--bg-1);
  display: flex; align-items: center; justify-content: center;
  padding: var(--sp-5);
}
.login-card {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lg);
  padding: var(--sp-9) var(--sp-7);
  width: 100%;
  max-width: 420px;
}
.login-brand-mark {
  width: 56px; height: 56px;
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
  color: var(--text-on-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: var(--fs-24);
  font-weight: var(--fw-bold);
  margin: 0 auto var(--sp-4);
  box-shadow: 0 8px 24px rgba(44,92,246,0.25);
}
.login-title {
  font-size: var(--fs-20);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  text-align: center;
  margin-bottom: var(--sp-1);
}
.login-subtitle {
  font-size: var(--fs-13);
  color: var(--text-3);
  text-align: center;
  margin-bottom: var(--sp-6);
}
.login-tip {
  font-size: var(--fs-11);
  color: var(--text-4);
  text-align: center;
  margin-top: var(--sp-4);
}

/* =====================================================
 * 21. 响应式断点
 * ===================================================== */
@media (max-width: 1280px) {
  .kpi-row, .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .routine-stats { grid-template-columns: repeat(2, 1fr); }
  .chart-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .cockpit-row, .cockpit-row-3 { grid-template-columns: repeat(2, 1fr); }
  .cockpit-row-3 > :first-child { grid-column: span 2; }
  .action-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  :root { --sidebar-w: 64px; }
  .sidebar-logo span:not(.logo-mark) { display: none; }
  .app-sidebar .el-menu-item span { display: none; }
  .app-sidebar .el-menu-item { padding: 0 !important; justify-content: center; }
  .app-content { padding: var(--sp-3) var(--sp-4); }
  .kpi-row, .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .chart-grid { grid-template-columns: 1fr; }
  .chart-grid-3 { grid-template-columns: 1fr; }
  .detail-page { grid-template-columns: 1fr; }
  .meeting-layout { grid-template-columns: 1fr; }
  .meeting-side { max-height: 320px; }
  .crm-board { grid-template-columns: 1fr; }
  .topic-grid { grid-template-columns: 1fr; }
  .cockpit-row, .cockpit-row-3 { grid-template-columns: 1fr; }
  .cockpit-row > :first-child { grid-column: span 1; }
  .action-board { grid-template-columns: 1fr; }
  .contract-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contract-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .kpi-row, .kpi-grid { grid-template-columns: 1fr; }
  .routine-stats { grid-template-columns: 1fr; }
  .page-header { flex-direction: column; align-items: flex-start; }
  .header-info .header-icon-btn span { display: none; }
  .app-content { padding: var(--sp-3) var(--sp-2); }
  .meeting-head { flex-direction: column; align-items: flex-start; }
  .detail-row { flex-direction: column; }
  .detail-row .label { width: 100%; margin-bottom: 4px; }
  .tariff-user-row { grid-template-columns: 1fr; }
  .contract-grid, .contract-form-grid { grid-template-columns: 1fr; }
  .stat-card { padding: var(--sp-3) var(--sp-4); }
}

/* =====================================================
 * 22. ECharts 主题（CSS 变量联动）
 * ===================================================== */
.echarts-tooltip {
  background: var(--chart-tooltip-bg) !important;
  color: var(--text-on-primary) !important;
  border: none !important;
  box-shadow: var(--shadow-md) !important;
}

/* =====================================================
 * 23. 动效工具类
 * ===================================================== */
.fade-enter-active, .fade-leave-active {
  transition: opacity var(--t-normal) var(--ease);
}
.fade-enter, .fade-leave-to { opacity: 0; }

@keyframes spin { from { transform: rotate(0); } to { transform: rotate(360deg); } }
.spin { animation: spin 1s linear infinite; }

/* =====================================================
 * 25. 视图补遗样式（2026-09-10 补）
 * 说明：以下 class 在视图模板中被使用，但 V3.3 重写 main.css
 *       时丢失定义，导致对应区域无样式。补齐时全部基于设计
 *       Token，浅色/深色自动跟随；不改 Element Plus 组件盒模型。
 * ===================================================== */

/* ---- 25.1 状态下拉选项（各页状态筛选/表单，13 处用法） ---- */
.el-select-dropdown__item .status-dot { vertical-align: middle; }
.status-dropdown-item {
  display: inline-block;
  vertical-align: middle;
  margin-left: var(--sp-2);
}

/* ---- 25.2 运营账单详情：月份块 + 指标行 ---- */
.bill-month {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2);
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  padding-bottom: var(--sp-2);
  margin-bottom: var(--sp-2);
  border-bottom: 1px solid var(--border-2);
}
.bill-row {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  padding: 2px 0;
  font-size: var(--fs-12);
  line-height: 1.5;
}
.bill-row .lbl { color: var(--text-3); flex-shrink: 0; }
.bill-row .val {
  color: var(--text-1);
  font-weight: var(--fw-semibold);
  font-variant-numeric: tabular-nums;
  text-align: right;
  min-width: 0;
}
.bill-row .val.good { color: var(--color-success); }
.bill-row .val.warn { color: var(--color-danger); }

/* 历史账单卡片：当前月 / 逾期 的高亮修饰（只改颜色，不动盒模型） */
.month-bill-item.bill-current {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-soft);
}
.month-bill-item.bill-overdue { border-color: var(--color-danger); }

/* ---- 25.3 会议详情小节标题（会议页 3 处用法） ---- */
.sec-head {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  flex-wrap: wrap;
  margin-bottom: var(--sp-3);
}
.sec-title {
  margin: 0;
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  line-height: 1.4;
  color: var(--text-1);
  padding-left: var(--sp-2);
  border-left: 3px solid var(--color-primary);
}

/* ---- 25.4 课题卡片进度（百分比 + 进度条同行） ---- */
.topic-progress { display: flex; align-items: center; gap: var(--sp-3); }
.topic-progress .num {
  flex-shrink: 0;
  min-width: 52px;
  font-size: var(--fs-24);
  font-weight: var(--fw-bold);
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--color-primary);
}
.topic-progress .el-progress { flex: 1; min-width: 0; }

/* ---- 25.5 常规事项统计卡片的图标配色变体 ----
 * 视图用 .stat-icon.info / .primary / .warning / .success 着色，
 * 但 CSS 只写了 .stat-card.stat-* 的写法，导致 4 张卡片图标全为同一色。
 * ---- */
.stat-icon.info    { background: var(--color-info-soft);    color: var(--color-info); }
.stat-icon.primary { background: var(--color-primary-soft); color: var(--color-primary); }
.stat-icon.success { background: var(--color-success-soft); color: var(--color-success); }
.stat-icon.warning { background: var(--color-warning-soft); color: var(--color-warning); }
.stat-icon.danger  { background: var(--color-danger-soft);  color: var(--color-danger); }

/* ---- 25.6 空态内的图标与补充说明（项目详情"合同与单价"空态） ---- */
.empty-state .icon { font-size: 36px; color: var(--text-4); }
.empty-state .desc {
  font-size: var(--fs-12);
  color: var(--text-4);
  line-height: 1.6;
  max-width: 460px;
  text-align: center;
}

/* ==========================================================================
   26. 权限配置抽屉（RBAC + 资源级）
   容器与子元素样式成套定义，避免"只有容器没子元素"导致样式丢失
   ========================================================================== */
.perm-group {
  margin-bottom: 18px;
}
.perm-group-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-1);
  padding-bottom: 8px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border-1);
}
.perm-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.perm-item {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border: 1px solid var(--border-1);
  border-radius: 8px;
  background: var(--bg-2);
  min-height: 40px;
}
.perm-item .el-checkbox {
  height: auto;
  margin-right: 0;
}
.perm-item .el-checkbox__label {
  padding-left: 6px;
}
.perm-name {
  font-size: 13px;
  color: var(--text-1);
}
.perm-desc {
  flex: 0 0 100%;
  font-size: 12px;
  color: var(--text-3);
  line-height: 1.5;
}

/* =====================================================
   27. 顶栏 · 待办提醒面板（
   容器 .notice-panel 与其全部子元素样式必须成套定义
   ===================================================== */
.notice-badge {
  display: inline-flex;
  align-items: center;
}
.notice-panel {
  display: block;
}
.notice-head {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-bottom: 9px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--border-1);
}
.notice-head > span:first-child {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-1);
}
.notice-sub {
  font-size: 12px;
  color: var(--text-3);
  line-height: 1.5;
}
.notice-empty {
  padding: 22px 0;
  text-align: center;
  font-size: 13px;
  color: var(--text-3);
}
.notice-groups {
  display: block;
}
.notice-group {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 8px;
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background 0.15s;
}
.notice-group:hover {
  background: var(--bg-3);
}
.notice-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.notice-label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13px;
  color: var(--text-1);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notice-count {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-1);
}
.notice-arrow {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--color-primary);
}
/* =====================================================
 * 26. 课题详情 · 子任务工具区（2026-09-10 重构）
 * 目的：工具条独立成行，按钮永不被弹窗右边缘裁切；
 *       空态直接给出「新建任务 / 批量粘贴」入口。
 * ===================================================== */
.task-pane { min-width: 0; }

.task-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  flex-wrap: wrap;
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--border-1);
  margin-bottom: var(--sp-3);
}
.task-toolbar-title {
  display: flex;
  align-items: baseline;
  gap: var(--sp-2);
  min-width: 0;
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}
.task-toolbar-title .task-count {
  font-size: var(--fs-12);
  font-weight: var(--fw-regular);
  color: var(--text-3);
}
.task-toolbar-actions {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
  margin-left: auto;
}

/* 工具栏左区：标题 + 统计标签合并成"一根工具栏"，避免出现上下两条横条（双导航栏） */
.task-toolbar-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.task-stat-row {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
}
/* 统计标签可点击即筛选（再点一次取消），并高亮当前筛选态 */
.task-stat-tag { cursor: pointer; user-select: none; }
.task-stat-tag:hover { opacity: .85; }
.task-stat-tag.is-active { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.task-stat-tag.clear { cursor: pointer; }

/* 状态单元格：状态标签 + 派生的「逾期」徽标同排显示 */
.task-status-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex-wrap: wrap;
}

/* 表单字段下方的说明文字（如"逾期自动判定"提示） */
.form-hint {
  font-size: var(--fs-12);
  color: var(--text-3);
  line-height: 1.5;
  margin-top: 2px;
}

/* 逾期日期高亮（派生口径：计划完成日期 < 今天且未完成） */
.cell-danger { color: var(--color-danger); font-weight: var(--fw-medium); }

.task-table-wrap { overflow-x: auto; }

.task-empty { text-align: center; padding: var(--sp-1) 0; }
.task-empty-title { font-size: var(--fs-13); color: var(--text-3); margin-bottom: var(--sp-3); }
.task-empty-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
}

@media (max-width: 1280px) {
  .task-toolbar-actions { width: 100%; margin-left: 0; }
}


/* =====================================================
 * 26. AI 智能分析（问数 / 归因）
 * ===================================================== */
.ai-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
}
.stat-icon.ok   { background: var(--color-success-soft); color: var(--color-success); }
.stat-icon.warn { background: var(--color-warning-soft); color: var(--color-warning); }
.stat-card .stat-value.is-ok   { color: var(--color-success); }
.stat-card .stat-value.is-warn { color: var(--color-warning); }

/* 三块面板共用的卡片样式（项目里没有通用 .card，这里成套定义） */
.ai-plan, .ai-ask, .ai-insight {
  background: var(--bg-2);
  border: 1px solid var(--border-1);
  border-radius: var(--r-lg);
  padding: var(--sp-4) var(--sp-5) var(--sp-5);
  margin-bottom: var(--sp-5);
  box-shadow: var(--shadow-xs);
}
.ai-plan .section-title, .ai-ask .section-title, .ai-insight .section-title { margin-top: 0; }

.ai-plan-desc {
  font-size: var(--fs-13);
  color: var(--text-2);
  line-height: 1.8;
  margin-bottom: var(--sp-3);
}
.ai-plan-desc b { color: var(--text-1); }

/* ---- 问数输入 ---- */
.ai-ask-row { display: flex; align-items: center; gap: var(--sp-3); }
.ai-ask-row .el-input { flex: 1; }
.ai-samples {
  display: flex; align-items: center; gap: var(--sp-3);
  flex-wrap: wrap;
  margin: var(--sp-3) 0 0;
  font-size: var(--fs-12);
  color: var(--text-3);
}
.ai-samples .lbl { flex: 0 0 auto; }
.ai-samples a {
  color: var(--color-primary);
  cursor: pointer;
  padding: 1px 8px;
  border-radius: var(--r-sm);
  background: var(--color-primary-soft);
  white-space: nowrap;
}
.ai-samples a:hover { text-decoration: underline; }

/* ---- 结果 ---- */
.ai-result { margin-top: var(--sp-4); }
.ai-result-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-3); flex-wrap: wrap;
  font-size: var(--fs-13); color: var(--text-1);
  margin-bottom: var(--sp-2);
}
.ai-badge {
  display: inline-block;
  font-size: var(--fs-11);
  color: var(--color-primary);
  background: var(--color-primary-soft);
  border-radius: var(--r-sm);
  padding: 1px 6px;
  margin-right: 6px;
}
.ai-route { color: var(--text-3); font-size: var(--fs-12); }
.ai-params { display: flex; gap: 6px; flex-wrap: wrap; }
.ai-summary {
  font-size: var(--fs-13);
  color: var(--text-1);
  line-height: 1.8;
  background: var(--bg-3);
  border-left: 3px solid var(--color-primary);
  border-radius: var(--r-sm);
  padding: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-3);
}
.ai-empty {
  font-size: var(--fs-12);
  color: var(--text-4);
  text-align: center;
  padding: var(--sp-4) 0;
}
.ai-note {
  font-size: var(--fs-12);
  color: var(--text-3);
  line-height: 1.7;
  margin-top: var(--sp-2);
}
.ai-note.is-warn { color: var(--color-warning); }
.ai-result-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-3); flex-wrap: wrap;
  margin-top: var(--sp-3);
}
.ai-src { font-size: var(--fs-11); color: var(--text-4); word-break: break-all; }

/* ---- AI 解读 ---- */
.ai-narrate {
  margin-top: var(--sp-3);
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-left: 3px solid var(--color-success);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4);
}
.ai-narrate-head {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--fs-12);
  font-weight: var(--fw-semibold);
  color: var(--color-success);
  margin-bottom: var(--sp-2);
}
.ai-narrate-body {
  font-size: var(--fs-13);
  color: var(--text-1);
  line-height: 1.85;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ---- 候选指标 ---- */
.ai-cands {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-3);
  margin-top: var(--sp-3);
}
.ai-cand {
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  background: var(--bg-2);
  padding: var(--sp-3);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.ai-cand:hover { border-color: var(--color-primary); box-shadow: var(--shadow-sm); }
.ai-cand-name { font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--text-1); }
.ai-cand-desc { font-size: var(--fs-12); color: var(--text-3); line-height: 1.6; margin-top: 4px; }

/* ---- 归因事实 ---- */
.ai-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-3);
  margin-bottom: var(--sp-3);
}
.ai-fact {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3);
}
.ai-fact-v {
  font-size: var(--fs-20);
  font-weight: var(--fw-bold);
  color: var(--text-1);
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.ai-fact-l { font-size: var(--fs-12); color: var(--text-3); margin-top: 4px; line-height: 1.6; }
.ai-sub-title {
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
  margin: var(--sp-4) 0 var(--sp-2);
}

@media (max-width: 1440px) {
  .ai-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-cands { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .ai-stats, .ai-cands, .ai-facts { grid-template-columns: minmax(0, 1fr); }
}

/* 纪要编辑：AI 兜底识别结果标记与提示 */
.parse-preview .pp-from {
  display: inline-block;
  margin-left: 6px;
  font-size: var(--fs-11);
  color: var(--color-primary);
  background: var(--color-primary-soft);
  border-radius: var(--r-sm);
  padding: 0 5px;
  vertical-align: 1px;
}
.parse-preview .pp-ai-note {
  font-size: var(--fs-12);
  color: var(--text-2);
  line-height: 1.7;
  background: var(--bg-2);
  border: 1px dashed var(--border-2);
  border-radius: var(--r-sm);
  padding: var(--sp-2) var(--sp-3);
  white-space: pre-wrap;
}


/* =====================================================
 * 27. 推送文案预览（通知配置 → 试运行 / 立即执行）
 * ===================================================== */
.np-meta {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
  margin-bottom: var(--sp-2);
  font-size: var(--fs-12);
  color: var(--text-3);
}
.np-meta .np-bytes { font-variant-numeric: tabular-nums; }
.np-meta .np-ok { color: var(--color-success); }
.np-meta .np-warn { color: var(--color-warning); }
.np-body {
  margin: 0;
  max-height: 420px;
  overflow: auto;
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: var(--fs-12);
  line-height: 1.75;
  color: var(--text-1);
  white-space: pre-wrap;
  word-break: break-word;
}


/* =====================================================
 * 28. AI 额度（token 计量的展示细节）
 * ===================================================== */
/* 统计卡里的 token 单位：主数字是 fs-24，单位必须降级，否则一行撑爆卡片 */
.stat-card .stat-value .as-unit {
  font-size: var(--fs-13);
  font-weight: var(--fw-regular);
  color: var(--text-3);
  margin-left: 4px;
  letter-spacing: 0;
}
/* 「估」标记：平台没返回 usage、token 是按字符估算出来的 */
.ai-est {
  display: inline-block;
  margin-left: 3px;
  padding: 0 3px;
  font-size: var(--fs-11);
  color: var(--color-warning);
  background: var(--color-warning-soft);
  border-radius: var(--r-sm);
  vertical-align: 1px;
}
/* 场景表里的 token 列右对齐数字 */
.ai-stat-table .el-table__cell { font-variant-numeric: tabular-nums; }
/* 「已保存：sk-1***abcd · 留空保存不会改动它」与右侧按钮的间距（挤在一起读不清是两个控件） */
.form-hint .key-clear { margin-left: 10px; vertical-align: 1px; }


/* =====================================================
 * 29. AI 模型名：自由输入 + 候选建议（el-autocomplete）
 * ===================================================== */
/* 输入框与「拉取模型」按钮同一行：flex 里必须给 input 包裹层 flex:1，
   否则 el-autocomplete 默认宽度会把按钮挤到下一行 */
.model-row { display: flex; align-items: center; gap: var(--sp-2); width: 100%; }
.model-row .model-input { flex: 1 1 auto; min-width: 0; }
.model-row .el-button { flex: 0 0 auto; }
/* 下拉候选项：模型名左、来源右，来源「平台」用主色区分（内置名单可能是过期的） */
.model-item { color: var(--text-1); }
.model-src {
  float: right;
  font-size: var(--fs-11);
  color: var(--text-4);
  padding-left: var(--sp-2);
}
.model-src.is-live { color: var(--color-primary); }
.form-hint .is-ok { color: var(--color-success); }

/* =====================================================
   下拉菜单项上色：穿透 Element Plus 内部样式
   用 popper-class="routine-dropdown" + data-color 属性
   ===================================================== */
.routine-dropdown .el-dropdown-menu__item[data-color="success"] {
  color: var(--el-color-success) !important;
}
.routine-dropdown .el-dropdown-menu__item[data-color="primary"] {
  color: var(--el-color-primary) !important;
}
.routine-dropdown .el-dropdown-menu__item[data-color="warning"] {
  color: var(--el-color-warning) !important;
}
.routine-dropdown .el-dropdown-menu__item[data-color="danger"] {
  color: var(--el-color-danger) !important;
}
/* hover 时反色，保证可读性 */
.routine-dropdown .el-dropdown-menu__item[data-color]:hover {
  color: var(--el-color-white) !important;
  background-color: var(--el-color-primary) !important;
}

/* 附件下载链接：a 标签包 el-tag 时不要下划线/蓝色，保持 tag 原样 */
.attachment-link {
  display: inline-flex;
  align-items: center;
  text-decoration: none !important;
  color: inherit !important;
}
.attachment-link:hover {
  text-decoration: none !important;
  opacity: 0.85;
}

/* =====================================================
 * 26. 运维看板（Monitor）专用样式
 *     对齐 cockpit 视觉语言：kpi-card / chart-box /
 *     equip-stat / risk-list / empty-tip / 设计 Token
 * ===================================================== */

/* ---- 26.1 分区标题 ---- */
.monitor-page { padding-bottom: var(--sp-5); }
.monitor-section-title {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin: var(--sp-4) 0 var(--sp-3);
  font-size: var(--fs-15);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}
.monitor-section-title .ms-bar {
  display: inline-block;
  width: 4px;
  height: 16px;
  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-accent) 100%);
  border-radius: 2px;
}
.monitor-section-title .ms-text { color: var(--text-1); }
.monitor-section-title .ms-sub {
  font-size: var(--fs-12);
  font-weight: var(--fw-regular);
  color: var(--text-3);
  margin-left: var(--sp-2);
}
.monitor-section-title:first-child { margin-top: 0; }

/* ---- 26.2 服务器信息网格 ---- */
.monitor-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-2) var(--sp-4);
}
.mi-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2);
  padding: 6px 0;
  border-bottom: 1px dashed var(--border-1);
  font-size: var(--fs-12);
}
.mi-item:last-child, .mi-item:nth-last-child(2) { border-bottom: none; }
.mi-k { color: var(--text-3); flex-shrink: 0; }
.mi-v {
  color: var(--text-1);
  font-weight: var(--fw-semibold);
  font-variant-numeric: tabular-nums;
  text-align: right;
  word-break: break-all;
}

/* ---- 26.3 TCP 连接卡片网格 ---- */
.monitor-conn-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3);
}
.mc-item {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-2);
  text-align: center;
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.mc-item.mc-success { border-color: var(--color-success-soft); background: var(--color-success-soft); }
.mc-item.mc-warning { border-color: var(--color-warning-soft); background: var(--color-warning-soft); }
.mc-item.mc-info    { border-color: var(--color-info-soft, var(--color-primary-soft)); background: var(--color-primary-soft); }
.mc-item.mc-primary {
  border-color: var(--color-primary);
  background: linear-gradient(135deg, var(--color-primary-soft) 0%, var(--color-accent-soft, var(--color-primary-soft)) 100%);
}
.mc-num {
  font-size: var(--fs-22);
  font-weight: var(--fw-bold);
  color: var(--text-1);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.mc-success .mc-num { color: var(--color-success); }
.mc-warning .mc-num { color: var(--color-warning); }
.mc-info    .mc-num { color: var(--color-primary); }
.mc-primary .mc-num { color: var(--color-primary); }
.mc-lbl {
  font-size: var(--fs-11);
  color: var(--text-3);
  margin-top: 4px;
  line-height: 1.4;
}

/* ---- 26.4 网络 I/O ---- */
.monitor-net-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-3);
}
.mn-item {
  background: var(--bg-3);
  border: 1px solid var(--border-1);
  border-radius: var(--r-md);
  padding: var(--sp-2) var(--sp-3);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mn-lbl {
  font-size: var(--fs-11);
  color: var(--text-3);
  display: flex;
  align-items: center;
  gap: 4px;
}
.mn-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
}
.mn-dot.mn-rx { background: var(--color-success); }
.mn-dot.mn-tx { background: var(--color-primary); }
.mn-val {
  font-size: var(--fs-16);
  font-weight: var(--fw-bold);
  color: var(--text-1);
  font-variant-numeric: tabular-nums;
}
.net-if-list {
  margin-top: var(--sp-3);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.net-if-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 8px;
  background: var(--bg-3);
  border-radius: var(--r-sm);
  font-size: var(--fs-12);
}
.net-if-name {
  color: var(--text-2);
  font-weight: var(--fw-medium);
  font-family: var(--font-mono, monospace);
}
.net-if-stat {
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
}

/* ---- 26.5 在线用户列表 ---- */
.monitor-user-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.mu-row {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-3);
  border-radius: var(--r-md);
  border: 1px solid var(--border-1);
  transition: border-color var(--t-fast) var(--ease);
}
.mu-row:hover { border-color: var(--color-primary-soft-2); }
.mu-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
  color: var(--text-on-primary);
  font-weight: var(--fw-bold);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-14);
  flex-shrink: 0;
}
.mu-name {
  flex: 1;
  font-size: var(--fs-13);
  font-weight: var(--fw-semibold);
  color: var(--text-1);
}
.mu-sub {
  font-style: normal;
  font-size: var(--fs-11);
  color: var(--text-3);
  font-weight: var(--fw-regular);
  margin-left: var(--sp-1);
}
.mu-stats {
  font-size: var(--fs-12);
  color: var(--color-primary);
  font-weight: var(--fw-medium);
  font-variant-numeric: tabular-nums;
}
.mu-last {
  font-size: var(--fs-11);
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
}

/* ---- 26.6 登录日志列表 ---- */
.monitor-login-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ml-row {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 6px var(--sp-2);
  border-radius: var(--r-sm);
  font-size: var(--fs-12);
  transition: background-color var(--t-fast) var(--ease);
}
.ml-row:hover { background: var(--bg-3); }
.ml-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--color-success);
  flex-shrink: 0;
}
.ml-name {
  flex: 1;
  color: var(--text-1);
  font-weight: var(--fw-medium);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ml-ip {
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
  font-family: var(--font-mono, monospace);
  font-size: var(--fs-11);
}
.ml-time {
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
  font-size: var(--fs-11);
}

/* ---- 26.7 安全预警列表 ---- */
.monitor-alert-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ma-item {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  background: var(--color-danger-soft);
  border: 1px solid var(--color-danger-soft-2, var(--color-danger-soft));
  border-left: 3px solid var(--color-danger);
  border-radius: var(--r-md);
}
.ma-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  background: var(--color-danger);
  color: var(--text-on-primary);
  border-radius: var(--r-sm);
  font-size: var(--fs-11);
  font-weight: var(--fw-semibold);
  flex-shrink: 0;
}
.ma-ip {
  font-family: var(--font-mono, monospace);
  font-size: var(--fs-13);
  font-weight: var(--fw-bold);
  color: var(--color-danger);
  flex-shrink: 0;
  min-width: 110px;
}
.ma-body {
  flex: 1;
  font-size: var(--fs-12);
  color: var(--text-2);
}
.ma-body strong { color: var(--color-danger); }
.ma-time {
  font-size: var(--fs-11);
  color: var(--text-3);
  font-variant-numeric: tabular-nums;
}

/* ---- 26.8 KPI 卡彩色图标（对齐 cockpit 设计 Token） ---- */
.kpi-label .kpi-ic {
  font-size: 18px;
  transition: transform var(--t-fast) var(--ease);
}
.kpi-card:hover .kpi-ic { transform: scale(1.12); }
/* CPU — 主蓝色 */
.kpi-ic.kpi-ic-cpu   { color: var(--color-primary); }
/* 内存 — 成功绿色 */
.kpi-ic.kpi-ic-mem   { color: var(--color-success); }
/* 磁盘 — 警告橙色 */
.kpi-ic.kpi-ic-disk  { color: var(--color-warning); }
/* 负载 — 紫色 */
.kpi-ic.kpi-ic-load  { color: var(--color-accent); }
/* RSS — 主蓝色 */
.kpi-ic.kpi-ic-rss   { color: var(--color-primary); }
/* V8 堆 — 紫色渐变感 */
.kpi-ic.kpi-ic-heap  { color: var(--color-accent); }
/* 外部内存 — 青色 */
.kpi-ic.kpi-ic-ext   { color: var(--color-cyan, var(--color-primary)); }
/* 运行时长 — 警告橙 */
.kpi-ic.kpi-ic-uptime{ color: var(--color-warning); }
/* 线程 — 主蓝 */
.kpi-ic.kpi-ic-thread{ color: var(--color-primary); }
/* 连接 — 青色 */
.kpi-ic.kpi-ic-conn  { color: var(--color-cyan, var(--color-primary)); }
/* 成功 ✓ — 绿色 */
.kpi-ic.kpi-ic-ok    { color: var(--color-success); }
/* 错误 ✗ — 红色 */
.kpi-ic.kpi-ic-err   { color: var(--color-danger); }
/* 警告 ⚠ — 橙色 */
.kpi-ic.kpi-ic-warn  { color: var(--color-warning); }
/* 审计 — 主蓝 */
.kpi-ic.kpi-ic-audit { color: var(--color-primary); }
/* 信息 — 青色 */
.kpi-ic.kpi-ic-info  { color: var(--color-cyan, var(--color-primary)); }

/* ---- 26.8b KPI 卡进度条跟随卡片着色 ---- */
.kpi-card .el-progress-bar__inner {
  /* Element Plus 自动读取 :color 绑定值，这里给 fallback */
}
.kpi-card.kpi-success .el-progress-bar__inner { background-color: var(--color-success); }
.kpi-card.kpi-warning .el-progress-bar__inner { background-color: var(--color-warning); }
.kpi-card.kpi-danger  .el-progress-bar__inner { background-color: var(--color-danger); }
.kpi-card.kpi-primary .el-progress-bar__inner { background-color: var(--color-primary); }
.kpi-card .el-progress-bar__outer { background-color: var(--bg-3); }

/* ---- 26.9 通用 chart 副标题 ---- */
.chart-sub {
  font-size: var(--fs-12);
  font-weight: var(--fw-regular);
  color: var(--text-3);
}

/* ---- 26.9 响应式（继承 cockpit 断点规则） ---- */
@media (max-width: 1280px) {
  .monitor-conn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .monitor-info-grid { grid-template-columns: 1fr; }
  .monitor-conn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .monitor-net-grid  { grid-template-columns: 1fr; }
  .monitor-section-title .ms-sub { display: block; margin-left: 0; margin-top: 2px; }
}