/* 迷毂 平台主题：可切换色板 (v1.9)
 * 默认主题：industrial-purple (星云紫 · 紫主色 + 蓝紫辅助 · 霓虹磨砂玻璃)
 * 所有品牌相关颜色全部走 --mg-* CSS 变量，可由 src/styles/themes.ts 在运行时切换
 *
 * 设计系统规范见 design-system/MASTER.md (由 ui-ux-pro-max skill 推导)
 */

/* JetBrains Mono · 用于 KPI / 坐标 / ID 等数据数字（tabular-nums）*/
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root {
  /* ── 状态色（与品牌色解耦，跨主题保持语义） ── */
  --mg-status-success: #22c55e;
  --mg-status-success-rgb: 34, 197, 94;
  --mg-status-warning: #f59e0b;
  --mg-status-warning-rgb: 245, 158, 11;
  --mg-status-danger:  #ef4444;
  --mg-status-danger-rgb: 239, 68, 68;
  --mg-status-info:    #3b82f6;
  --mg-status-info-rgb: 59, 130, 246;
  --mg-status-idle:    #94a3b8;
  --mg-status-idle-rgb: 148, 163, 184;

  /* ── 数据可视化色板（ECharts / Progress 等） ── */
  --mg-data-c1: #3b82f6;
  --mg-data-c2: #22c55e;
  --mg-data-c3: #a855f7;
  --mg-data-c4: #f59e0b;
  --mg-data-c5: #ef4444;
  --mg-data-c6: #06b6d4;
  --mg-data-c7: #ec4899;
  --mg-data-c8: #84cc16;

  /* ── 字体栈 ── */
  --mg-font-sans: 'PingFang SC', 'Microsoft YaHei', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mg-font-mono: 'JetBrains Mono', 'Cascadia Mono', 'SF Mono', Menlo, Consolas, monospace;

  /* ── 品牌主色（默认 = 星云紫，可被 themes.ts 注入覆盖） ── */
  --mg-primary:        #7c3aed;
  --mg-primary-rgb:    124, 58, 237;
  --mg-primary-hover:  #8b5cf6;
  --mg-primary-hover-rgb: 139, 92, 246;
  --mg-primary-active: #5b21b6;
  --mg-accent:         #c4b5fd;
  --mg-accent-rgb:     196, 181, 253;

  --mg-primary-light-3: #9d6cf2;
  --mg-primary-light-5: #b594f7;
  --mg-primary-light-7: #6f4eab;
  --mg-primary-light-8: #4c357a;
  --mg-primary-light-9: #2d1f55;
  --mg-primary-dark-2:  #4c1d95;

  /* ── 背景：深紫黑底 ── */
  --mg-bg-app-1:        #0e0a24;
  --mg-bg-app-2:        #1f1147;
  --mg-bg-app-3:        #06031a;
  --mg-bg-app-deep-rgb: 6, 3, 26;

  --mg-bg-aside-1:      #0c0820;
  --mg-bg-aside-2:      #03020e;
  --mg-bg-aside-rgb:    10, 6, 30;

  --mg-bg-card-rgb:         38, 24, 78;
  --mg-bg-card-hi-rgb:      58, 38, 110;
  --mg-bg-card-darker-rgb:  20, 12, 48;
  --mg-shadow-rgb:          8, 2, 24;

  --mg-text-tint-rgb:   242, 232, 255;
  --mg-text-hi-rgb:     220, 200, 252;

  --mg-orb-a-opacity: 0.55;
  --mg-orb-b-opacity: 0.50;
  --mg-orb-c-opacity: 0.40;

  /* ── 玻璃设计令牌（霓虹磨砂玻璃体系，主色感知更明显） ── */
  --mg-glass-bg:        rgba(255, 255, 255, 0.06);
  --mg-glass-bg-hover:  rgba(255, 255, 255, 0.10);
  --mg-glass-bg-active: rgba(255, 255, 255, 0.14);
  --mg-glass-border:    rgba(255, 255, 255, 0.18);
  --mg-glass-border-hi: rgba(255, 255, 255, 0.28);
  --mg-glass-shadow:
    0 10px 28px rgba(var(--mg-shadow-rgb), 0.55),
    0 0 22px rgba(var(--mg-primary-rgb), 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.06) inset,
    0 1px 0 rgba(255, 255, 255, 0.12) inset;
  --mg-glass-shadow-hi:
    0 18px 44px rgba(var(--mg-shadow-rgb), 0.70),
    0 0 36px rgba(var(--mg-primary-hover-rgb), 0.30),
    0 0 0 1px rgba(var(--mg-accent-rgb), 0.25) inset,
    0 1px 0 rgba(255, 255, 255, 0.22) inset;
  --mg-glass-blur:      blur(20px) saturate(160%);
  --mg-glass-blur-hi:   blur(30px) saturate(180%);

  --mg-radius-sm: 8px;
  --mg-radius:    14px;
  --mg-radius-lg: 20px;
  --mg-radius-xl: 24px;

  /* ── 文字 ── */
  --mg-text-light:  #ffffff;
  --mg-text-muted:  rgba(255, 255, 255, 0.7);
  --mg-text-dim:    rgba(255, 255, 255, 0.5);
  --mg-text-faint:  rgba(255, 255, 255, 0.35);
  --mg-divider:     rgba(255, 255, 255, 0.08);

  /* ── Element Plus 主色覆盖 ── */
  --el-color-primary:        var(--mg-primary);
  --el-color-primary-rgb:    var(--mg-primary-rgb);
  --el-color-primary-light-3: var(--mg-primary-light-3);
  --el-color-primary-light-5: var(--mg-primary-light-5);
  --el-color-primary-light-7: var(--mg-primary-light-7);
  --el-color-primary-light-8: var(--mg-primary-light-8);
  --el-color-primary-light-9: var(--mg-primary-light-9);
  --el-color-primary-dark-2:  var(--mg-primary-dark-2);

  --mg-transition: all .25s cubic-bezier(.25, .8, .25, 1);

  /* ── 通用「内嵌表面」veil 令牌 ──
   * 面板里的嵌套行 / 子卡 / 统计项常用 rgba(255,255,255,.0x) 当作浅色微透表面，
   * 在深色主题里是「白色微透」效果；但 fame-lavender 浅紫主题切到白底后这些白veil
   * 直接消失（白叠白）。把它们抽成令牌：深色主题保持白微透，fame-lavender 翻成紫微透，
   * 这样所有引用处自动双主题可见，且不影响 6 套深色主题观感。 */
  --mg-veil-1: rgba(255, 255, 255, 0.05);
  --mg-veil-2: rgba(255, 255, 255, 0.08);
  --mg-veil-3: rgba(255, 255, 255, 0.12);
  --mg-veil-border: rgba(255, 255, 255, 0.12);
  --mg-veil-border-hi: rgba(255, 255, 255, 0.20);

  /* ── 面板「动作按钮」令牌 ──
   * 深色主题：半透明紫玻璃底 + 白字；fame-lavender：实色紫底 + 白字（对比足够）。 */
  --mg-action-bg: rgba(76, 29, 149, 0.45);
  --mg-action-bg-hover: rgba(109, 40, 217, 0.75);
  --mg-action-border: rgba(167, 139, 250, 0.55);
  --mg-action-border-hi: rgba(196, 181, 253, 0.9);
}

html {
  --el-color-primary:        var(--mg-primary) !important;
  --el-color-primary-rgb:    var(--mg-primary-rgb) !important;
  --el-color-primary-light-3: var(--mg-primary-light-3) !important;
  --el-color-primary-light-5: var(--mg-primary-light-5) !important;
  --el-color-primary-light-7: var(--mg-primary-light-7) !important;
  --el-color-primary-light-8: var(--mg-primary-light-8) !important;
  --el-color-primary-light-9: var(--mg-primary-light-9) !important;
  --el-color-primary-dark-2:  var(--mg-primary-dark-2) !important;
}

body {
  margin: 0;
  font-family: var(--mg-font-sans);
  color: var(--mg-text-light);
  background:
    radial-gradient(ellipse at 20% 0%, rgba(var(--mg-primary-hover-rgb), 0.45) 0%, transparent 55%),
    radial-gradient(ellipse at 80% 100%, rgba(var(--mg-bg-card-rgb), 0.65) 0%, transparent 55%),
    linear-gradient(135deg, var(--mg-bg-app-1) 0%, var(--mg-bg-app-2) 50%, var(--mg-bg-app-3) 100%);
  background-attachment: fixed;
  min-height: 100vh;
  transition: background-color .35s ease;
}

#app { min-height: 100vh; position: relative; }

/* ── 全局科幻网格层 (默认开启,主题可单独关闭) ── */
#app::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(var(--mg-accent-rgb), 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--mg-accent-rgb), 0.05) 1px, transparent 1px);
  background-size: 48px 48px, 48px 48px;
  mask-image: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.85) 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.85) 0%, transparent 75%);
  opacity: 0.55;
}
/* ── 极淡扫描线（增加科技感） ── */
#app::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.018) 0,
    rgba(255, 255, 255, 0.018) 1px,
    transparent 1px,
    transparent 3px
  );
  mix-blend-mode: overlay;
}

/* 让所有 router 内容在背景层之上 */
.app-shell, .login-page { position: relative; z-index: 1; }

/* ── 玻璃卡片复用类 ── */
.mg-glass {
  background: var(--mg-glass-bg);
  border: 1px solid var(--mg-glass-border);
  border-radius: var(--mg-radius);
  backdrop-filter: var(--mg-glass-blur);
  -webkit-backdrop-filter: var(--mg-glass-blur);
  box-shadow: var(--mg-glass-shadow);
  transition: var(--mg-transition);
}
.mg-glass:hover {
  background: var(--mg-glass-bg-hover);
  border-color: var(--mg-glass-border-hi);
  box-shadow: var(--mg-glass-shadow-hi);
  transform: translateY(-2px);
}
.mg-glass-lg {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: var(--mg-radius-lg);
  backdrop-filter: var(--mg-glass-blur-hi);
  -webkit-backdrop-filter: var(--mg-glass-blur-hi);
  box-shadow:
    0 30px 80px rgba(var(--mg-shadow-rgb), 0.55),
    0 0 0 1px rgba(255, 255, 255, 0.25) inset,
    0 1px 0 rgba(255, 255, 255, 0.4) inset;
}

/* ── 主按钮统一 ── */
.el-button--primary {
  --el-button-bg-color: var(--mg-primary);
  --el-button-border-color: var(--mg-primary);
  --el-button-hover-bg-color: var(--mg-primary-hover);
  --el-button-hover-border-color: var(--mg-primary-hover);
  --el-button-active-bg-color: var(--mg-primary-active);
  --el-button-active-border-color: var(--mg-primary-active);
}

/* ── 滚动条 ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb {
  background: rgba(var(--mg-accent-rgb), 0.4);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: rgba(var(--mg-accent-rgb), 0.7); }
::-webkit-scrollbar-track { background: transparent; }

::selection { background: rgba(var(--mg-accent-rgb), 0.4); color: #fff; }

a { color: var(--mg-accent); }
a:hover { color: rgba(var(--mg-accent-rgb), 0.85); }

/* ── 玻璃语境下 Element Plus 全局填充/背景变量暗化（会话 N+2 UI 修复）──
 * 问题：默认 industrial-purple (星云紫) 主题下，`.mg-content` 把 `--el-text-color-primary`
 * 改成白色 (line ~290) 让卡片/Table 等深底组件的字可读，但 element-plus 内部仍然有
 * `var(--el-fill-color-light)` (#f5f7fa)、`var(--el-bg-color)` (#fff) 等浅色填充值。
 * 任何组件（如 FieldMemberEditor `.fme-desc`、ProjectPropertiesView .pp-desc）用
 * `background: var(--el-fill-color-light)` + `color: var(--el-text-color-primary)` 就撞出
 * 「浅灰底 + 白字」不可读。
 *
 * 解法：把 element-plus 填充/背景变量改成基于 `--mg-bg-card-rgb` 的半透明：
 *   - industrial-purple 时 --mg-bg-card-rgb = "38, 24, 78"  → 暗紫 35-55% 透明，深底+白字 OK；
 *   - fame-lavender    时 --mg-bg-card-rgb = "255, 255, 255" → 白色 35-55% 透明，配 fame-lavender
 *     的 #2d1b69 深字（line ~1069 已配）也清楚。
 * 边框、占位符同步走「主色感知」的灰阶。 */
.mg-content {
  --el-fill-color-blank: transparent;
  --el-fill-color-light: rgba(var(--mg-bg-card-rgb), 0.45);
  --el-fill-color-lighter: rgba(var(--mg-bg-card-rgb), 0.35);
  --el-fill-color: rgba(var(--mg-bg-card-rgb), 0.55);
  --el-fill-color-dark: rgba(var(--mg-bg-card-rgb), 0.65);
  --el-fill-color-darker: rgba(var(--mg-bg-card-rgb), 0.75);
  --el-bg-color: rgba(var(--mg-bg-card-rgb), 0.55);
  --el-bg-color-page: transparent;
  --el-bg-color-overlay: rgba(var(--mg-bg-card-rgb), 0.92);
  --el-border-color: rgba(255, 255, 255, 0.14);
  --el-border-color-light: rgba(255, 255, 255, 0.10);
  --el-border-color-lighter: rgba(255, 255, 255, 0.08);
  --el-border-color-extra-light: rgba(255, 255, 255, 0.06);
  --el-text-color-secondary: rgba(var(--mg-text-hi-rgb), 0.7);
  --el-text-color-placeholder: rgba(255, 255, 255, 0.40);
  --el-text-color-disabled: rgba(255, 255, 255, 0.30);
}

/* FieldMemberEditor / ProjectPropertiesView 的「描述长条」专项修复 ─
 * 组件 scoped css 写 `background: var(--el-fill-color-light)` + `color: var(--el-text-color-primary)`，
 * 即便上面 `.mg-content` 已经把变量改基于 --mg-bg-card-rgb，组件本身仍可能因 Vue scoped 选择器
 * 优先级把变量「冻结」住。这里直接给 `.fme-desc` 在 .mg-content 上下文里写绝对色，杜绝歧义。 */
.mg-content .fme-desc {
  background: rgba(var(--mg-bg-card-rgb), 0.55) !important;
  color: var(--mg-text-light) !important;
  border-left-color: var(--mg-accent) !important;
}
.mg-content .fme-path { color: var(--mg-text-light) !important; }
.mg-content .fme-path-empty { color: var(--mg-text-muted) !important; }

/* ─── 「admin 风格 tabs」共享样式（会话 N+2 用户反馈） ────────────────────────────
 * 把「场景管理」(SceneManagerView) 里的 type="border-card" + 紫色高亮 tabs 抽成
 * 全局 .admin-tabs 类，让项目属性 / 车辆管理 / 后续配置中心等多 tab 页面统一外观。
 *
 * 用法：<el-tabs class="admin-tabs" type="border-card"> ... </el-tabs>
 * - 容器：透明背景 + 紫色微辉边框；
 * - tab 头：透明 + 浅紫边线；
 * - tab 项：未激活淡紫白；hover 加亮；激活时紫色高亮底 + 紫色底边。
 * 仅在 .mg-content 内生效，避免污染登录页等非主区组件。 */
.mg-content .admin-tabs.el-tabs--border-card {
  height: 100%;
  background: rgba(var(--mg-bg-card-rgb), 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: var(--mg-radius);
  box-shadow: var(--mg-glass-shadow);
  backdrop-filter: var(--mg-glass-blur);
  -webkit-backdrop-filter: var(--mg-glass-blur);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header {
  background: rgba(var(--mg-bg-card-darker-rgb), 0.35) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
  margin: 0;
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__nav {
  border: 0 !important;
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item {
  background: transparent !important;
  color: rgba(220, 200, 240, 0.75) !important;
  border: 0 !important;
  height: 42px;
  line-height: 42px;
  font-size: 13.5px;
  letter-spacing: 0.5px;
  padding: 0 18px !important;
  transition: background .2s ease, color .2s ease;
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item:hover {
  background: rgba(var(--mg-accent-rgb), 0.10) !important;
  color: #fff !important;
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
  background: rgba(var(--mg-accent-rgb), 0.18) !important;
  color: #fff !important;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 0 var(--mg-accent);
}
.mg-content .admin-tabs.el-tabs--border-card > .el-tabs__content {
  flex: 1;
  padding: 14px;
  overflow: auto;
  background: transparent !important;
}
.mg-content .admin-tabs.el-tabs--border-card .el-tab-pane {
  height: 100%;
}

/* fame-lavender 主题下 admin-tabs 反白：浅紫底 + 深紫字 + 紫色高亮 */
:root[data-theme="fame-lavender"] .mg-content .admin-tabs.el-tabs--border-card {
  background: #ffffff !important;
  border: 1px solid rgba(124, 58, 237, 0.18) !important;
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.06) !important;
}
:root[data-theme="fame-lavender"] .mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header {
  background: rgba(124, 58, 237, 0.04) !important;
  border-bottom: 1px solid rgba(124, 58, 237, 0.14) !important;
}
:root[data-theme="fame-lavender"] .mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item {
  color: #4a3d6e !important;
}
:root[data-theme="fame-lavender"] .mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item:hover {
  background: rgba(124, 58, 237, 0.08) !important;
  color: #7c3aed !important;
}
:root[data-theme="fame-lavender"] .mg-content .admin-tabs.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
  background: rgba(124, 58, 237, 0.14) !important;
  color: #7c3aed !important;
}

/* ── 玻璃语境下 Element Plus 的常见组件调整 ── */
.mg-content .el-card {
  background: linear-gradient(135deg, rgba(var(--mg-bg-card-rgb), 0.55) 0%, rgba(var(--mg-bg-app-deep-rgb), 0.6) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--mg-radius);
  backdrop-filter: var(--mg-glass-blur);
  -webkit-backdrop-filter: var(--mg-glass-blur);
  box-shadow: var(--mg-glass-shadow);
  color: var(--mg-text-light);
  transition: var(--mg-transition);
  overflow: hidden;
}
.mg-content .el-card:hover {
  background: linear-gradient(135deg, rgba(var(--mg-bg-card-hi-rgb), 0.65) 0%, rgba(var(--mg-bg-card-darker-rgb), 0.67) 100%) !important;
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: var(--mg-glass-shadow-hi);
  transform: translateY(-2px);
}
.mg-content .el-card.no-hover:hover {
  transform: none;
}
.mg-content .el-card__header {
  background: rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--mg-text-light);
  font-weight: 600;
  padding: 14px 18px;
}
.mg-content .el-card__body {
  background: transparent !important;
  color: var(--mg-text-light);
}

/* 嵌套的 card（如 ConfigPageBase 内层）使用更浅的透明度 */
.mg-content .el-card .el-card {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: none;
}
.mg-content .el-card .el-card:hover {
  background: rgba(255, 255, 255, 0.06) !important;
  transform: none;
  box-shadow: none;
}

.mg-content h1,
.mg-content h2,
.mg-content h3 { color: var(--mg-text-light); margin-top: 0; }
.mg-content p { color: var(--mg-text-muted); }

/* el-statistic 在玻璃语境下 */
.mg-content .el-statistic__head { color: var(--mg-text-muted); }
.mg-content .el-statistic__number { color: var(--mg-text-light); }
.mg-content .el-statistic__content { color: var(--mg-text-light); }

/* el-tabs 玻璃语境（SimpleLite 监控台：地图/进程/场景等） */
.mg-content .el-tabs {
  --el-text-color-primary: #fff;
}
.mg-content .el-tabs__item {
  color: rgba(255, 255, 255, 0.82) !important;
}
.mg-content .el-tabs__item:hover {
  color: #fff !important;
}
.mg-content .el-tabs__item.is-active {
  color: #fff !important;
  font-weight: 600;
}
.mg-content .el-tabs__active-bar {
  background-color: var(--mg-accent) !important;
}
.mg-content .el-tabs__nav-wrap::after {
  background-color: rgba(255, 255, 255, 0.14) !important;
}

/* el-table 在玻璃语境下 */
.mg-content .el-table,
.mg-content .el-table tr,
.mg-content .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: transparent !important;
}
.mg-content .el-table {
  --el-table-bg-color: transparent;
  --el-table-tr-bg-color: transparent;
  --el-table-header-bg-color: transparent;
  --el-table-row-hover-bg-color: rgba(var(--mg-accent-rgb), 0.18);
  --el-table-border-color: rgba(255, 255, 255, 0.1);
  --el-table-header-text-color: rgba(255, 255, 255, 0.7);
  --el-table-text-color: var(--mg-text-light);
  --el-fill-color-blank: transparent;
  --el-fill-color-light: rgba(255, 255, 255, 0.04);
  color: var(--mg-text-light) !important;
}
.mg-content .el-table th.el-table__cell {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.75) !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}
.mg-content .el-table td.el-table__cell {
  background: transparent !important;
  color: var(--mg-text-light) !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}
.mg-content .el-table--striped .el-table__body tr:nth-child(2n) td.el-table__cell {
  background: rgba(255, 255, 255, 0.03) !important;
}
.mg-content .el-table tr:hover > td.el-table__cell,
.mg-content .el-table__body tr.hover-row > td.el-table__cell {
  background: rgba(var(--mg-accent-rgb), 0.18) !important;
}
.mg-content .el-table__empty-block { background: transparent; color: var(--mg-text-dim); }
.mg-content .el-table__inner-wrapper::before,
.mg-content .el-table::before { background: rgba(255, 255, 255, 0.1) !important; }

/* el-input 在玻璃语境下 (admin 区表单) */
.mg-content .el-input__wrapper,
.mg-content .el-textarea__inner {
  background: rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset !important;
}
.mg-content .el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px rgba(var(--mg-accent-rgb), 0.7) inset, 0 0 16px rgba(var(--mg-primary-hover-rgb), 0.35) !important;
}
.mg-content .el-input__inner { color: var(--mg-text-light) !important; }
.mg-content .el-input__inner::placeholder { color: var(--mg-text-faint); }

/* el-form-item label */
.mg-content .el-form-item__label { color: var(--mg-text-muted) !important; }

/* el-divider */
.mg-content .el-divider__text { background: transparent !important; color: var(--mg-text-muted); }
.mg-content .el-divider { background: var(--mg-divider); }

/* el-tag 在玻璃语境下保持主题色 */
.mg-content .el-tag {
  background: rgba(var(--mg-accent-rgb), 0.18);
  color: rgba(var(--mg-text-tint-rgb), 1);
  border-color: rgba(var(--mg-accent-rgb), 0.4);
}
.mg-content .el-tag--success {
  background: rgba(111, 143, 76, 0.22);
  color: #c0d99c;
  border-color: rgba(111, 143, 76, 0.5);
}
.mg-content .el-tag--warning {
  background: rgba(201, 138, 29, 0.22);
  color: #f5cf85;
  border-color: rgba(201, 138, 29, 0.5);
}
.mg-content .el-tag--danger {
  background: rgba(179, 50, 79, 0.22);
  color: #ff9bb8;
  border-color: rgba(179, 50, 79, 0.5);
}
.mg-content .el-tag--info {
  background: rgba(122, 107, 135, 0.22);
  color: #c9bdd6;
  border-color: rgba(122, 107, 135, 0.5);
}

/* el-descriptions 在玻璃语境 */
.mg-content .el-descriptions {
  --el-text-color-primary: #fff;
  --el-text-color-regular: var(--mg-text-muted);
  --el-border-color-lighter: rgba(255, 255, 255, 0.12);
  --el-fill-color-blank: transparent;
  color: var(--mg-text-light);
}
.mg-content .el-descriptions__body,
.mg-content .el-descriptions__table {
  background: transparent !important;
}
.mg-content .el-descriptions__label,
.mg-content .el-descriptions__cell.is-bordered-label {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--mg-text-muted) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}
.mg-content .el-descriptions__content,
.mg-content .el-descriptions__cell.is-bordered-content {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}
.mg-content .el-descriptions__title { color: #fff; }

/* el-progress 主题色 */
.mg-content .el-progress-bar__outer {
  background: rgba(255, 255, 255, 0.1);
}
.mg-content .el-progress-bar__inner {
  background: linear-gradient(90deg, var(--mg-primary-hover) 0%, var(--mg-accent) 100%);
}

/* el-alert 玻璃化 */
.mg-content .el-alert {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--mg-text-light);
}
.mg-content .el-alert__title,
.mg-content .el-alert__description { color: var(--mg-text-light) !important; }

/* el-collapse 玻璃化 */
.mg-content .el-collapse {
  border-color: rgba(255, 255, 255, 0.1);
  --el-collapse-header-bg-color: transparent;
  --el-collapse-content-bg-color: transparent;
  --el-collapse-header-text-color: #fff;
  --el-collapse-content-text-color: var(--mg-text-light);
}
.mg-content .el-collapse-item__header,
.mg-content .el-collapse-item__wrap {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: var(--mg-text-light) !important;
}

/* el-radio / el-checkbox 在玻璃语境下 */
.mg-content .el-radio__label,
.mg-content .el-checkbox__label { color: var(--mg-text-light) !important; }
.mg-content .el-radio__inner,
.mg-content .el-checkbox__inner {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.32);
}

/* el-radio-button */
.mg-content .el-radio-button__inner {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: var(--mg-text-light) !important;
}
.mg-content .el-radio-button.is-active .el-radio-button__inner {
  background: var(--mg-primary) !important;
  border-color: var(--mg-primary) !important;
  color: #fff !important;
}

/* el-select 玻璃化 */
.mg-content .el-select .el-input__wrapper {
  background: rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset !important;
}

/* el-input-number 玻璃化 */
.mg-content .el-input-number .el-input-number__decrease,
.mg-content .el-input-number .el-input-number__increase {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--mg-text-muted) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* el-switch 主题色 */
.mg-content .el-switch.is-checked .el-switch__core {
  background: var(--mg-primary);
  border-color: var(--mg-primary);
}

/* el-statistic 颜色重置 */
.mg-content .el-statistic .el-statistic__head {
  color: var(--mg-text-muted);
  font-size: 13px;
}
.mg-content .el-statistic .el-statistic__number,
.mg-content .el-statistic .el-statistic__content {
  color: #fff;
  font-weight: 600;
  text-shadow: 0 2px 8px rgba(var(--mg-primary-hover-rgb), 0.4);
}

/* KPI 玻璃卡片：<el-row class="kpi-row"> 内的 el-statistic 自动玻璃化 */
.mg-content .kpi-row .el-statistic,
.mg-content .kpi-card {
  background: linear-gradient(135deg, rgba(var(--mg-bg-card-rgb), 0.55) 0%, rgba(var(--mg-bg-app-deep-rgb), 0.6) 100%);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--mg-radius);
  padding: 16px 18px;
  backdrop-filter: var(--mg-glass-blur);
  -webkit-backdrop-filter: var(--mg-glass-blur);
  box-shadow: var(--mg-glass-shadow);
  transition: var(--mg-transition);
}
.mg-content .kpi-row .el-statistic:hover,
.mg-content .kpi-card:hover {
  background: linear-gradient(135deg, rgba(var(--mg-bg-card-hi-rgb), 0.65) 0%, rgba(var(--mg-bg-card-darker-rgb), 0.67) 100%);
  transform: translateY(-2px);
  box-shadow: var(--mg-glass-shadow-hi);
  border-color: rgba(255, 255, 255, 0.22);
}

/* el-pagination 玻璃化 */
.mg-content .el-pagination {
  --el-pagination-bg-color: transparent;
  --el-pagination-button-bg-color: rgba(255, 255, 255, 0.06);
  --el-pagination-button-color: var(--mg-text-light);
  --el-pagination-hover-color: var(--mg-accent);
  color: var(--mg-text-muted);
}

/* el-dropdown-menu 暗化 */
.el-dropdown-menu {
  background: rgba(var(--mg-bg-aside-rgb), 0.92) !important;
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.el-dropdown-menu__item {
  color: rgba(255, 255, 255, 0.8) !important;
}
.el-dropdown-menu__item:hover {
  background: rgba(var(--mg-accent-rgb), 0.18) !important;
  color: #fff !important;
}

/* el-message / 全局消息提示沿用 Element Plus 默认浅色（在暗背景上更易读） */

/* el-button default 按钮在玻璃语境下 */
.mg-content .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--text) {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  color: var(--mg-text-light);
}
.mg-content .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--text):hover {
  background: rgba(var(--mg-accent-rgb), 0.18);
  border-color: rgba(var(--mg-accent-rgb), 0.5);
  color: #fff;
}

/* h2 在浅色页面（如对话框）保留主题深色 */
.el-dialog h2 { color: var(--mg-primary-active); }
.el-dialog { border-radius: var(--mg-radius); }

/* ─────────────── 星云紫专项：深紫底 + 蓝紫辉光 + 霓虹高光 ─────────────── */
:root[data-theme="industrial-purple"] {
  --mg-orb-a-opacity: 0.55;
  --mg-orb-b-opacity: 0.50;
  --mg-orb-c-opacity: 0.42;
  --mg-glass-bg:        rgba(28, 14, 62, 0.62);
  --mg-glass-bg-hover:  rgba(44, 22, 88, 0.72);
  --mg-glass-border:    rgba(var(--mg-accent-rgb), 0.18);
  --mg-glass-border-hi: rgba(var(--mg-accent-rgb), 0.55);
  --mg-glass-shadow:
    0 12px 32px rgba(0, 0, 0, 0.55),
    0 0 24px rgba(var(--mg-primary-rgb), 0.25),
    0 0 0 1px rgba(var(--mg-accent-rgb), 0.10) inset,
    0 1px 0 rgba(255, 255, 255, 0.14) inset;
  --mg-glass-shadow-hi:
    0 20px 50px rgba(0, 0, 0, 0.68),
    0 0 42px rgba(var(--mg-primary-hover-rgb), 0.42),
    0 0 0 1px rgba(var(--mg-accent-rgb), 0.32) inset,
    0 1px 0 rgba(255, 255, 255, 0.24) inset;
  --mg-text-muted:      rgba(255, 255, 255, 0.86);
  --mg-text-dim:        rgba(220, 200, 252, 0.70);
}

:root[data-theme="industrial-purple"] body {
  background:
    radial-gradient(circle at 8% 8%, rgba(var(--mg-primary-hover-rgb), 0.55) 0%, transparent 48%),
    radial-gradient(ellipse at 92% 18%, rgba(var(--mg-accent-rgb), 0.28) 0%, transparent 42%),
    radial-gradient(circle at 78% 88%, rgba(var(--mg-primary-rgb), 0.55) 0%, transparent 46%),
    radial-gradient(ellipse at 18% 92%, rgba(99, 102, 241, 0.30) 0%, transparent 48%),
    linear-gradient(135deg, var(--mg-bg-app-1) 0%, var(--mg-bg-app-2) 48%, var(--mg-bg-app-3) 100%);
}

/* 星云紫主题下:网格更紫,扫描线更明显 */
:root[data-theme="industrial-purple"] #app::before {
  background-image:
    linear-gradient(rgba(var(--mg-accent-rgb), 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--mg-accent-rgb), 0.07) 1px, transparent 1px);
  opacity: 0.85;
}
:root[data-theme="industrial-purple"] #app::after {
  background-image: repeating-linear-gradient(
    0deg,
    rgba(var(--mg-accent-rgb), 0.03) 0,
    rgba(var(--mg-accent-rgb), 0.03) 1px,
    transparent 1px,
    transparent 3px
  );
}

/* 卡片：紫色玻璃质感 */
:root[data-theme="industrial-purple"] .mg-content .el-card,
:root[data-theme="industrial-purple"] .mg-content .kpi-row .el-statistic,
:root[data-theme="industrial-purple"] .mg-content .kpi-card {
  position: relative;
  background:
    linear-gradient(145deg,
      rgba(var(--mg-bg-card-rgb), 0.78) 0%,
      rgba(var(--mg-bg-app-deep-rgb), 0.86) 100%) !important;
  border: 1px solid rgba(var(--mg-accent-rgb), 0.14) !important;
  border-radius: var(--mg-radius) !important;
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.5),
    0 0 22px rgba(var(--mg-primary-rgb), 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  overflow: hidden;
}
/* 顶部 1px 高光线 → 玻璃质感的灵魂 */
:root[data-theme="industrial-purple"] .mg-content .el-card::before,
:root[data-theme="industrial-purple"] .mg-content .kpi-card::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(var(--mg-accent-rgb), 0.55) 30%,
    rgba(255, 255, 255, 0.85) 50%,
    rgba(var(--mg-accent-rgb), 0.55) 70%,
    transparent 100%);
  pointer-events: none;
  opacity: 0.7;
}

:root[data-theme="industrial-purple"] .mg-content .el-card:hover,
:root[data-theme="industrial-purple"] .mg-content .kpi-row .el-statistic:hover,
:root[data-theme="industrial-purple"] .mg-content .kpi-card:hover {
  background:
    linear-gradient(145deg,
      rgba(var(--mg-bg-card-hi-rgb), 0.85) 0%,
      rgba(var(--mg-bg-card-darker-rgb), 0.92) 100%) !important;
  border-color: rgba(var(--mg-accent-rgb), 0.42) !important;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.6),
    0 0 38px rgba(var(--mg-primary-hover-rgb), 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

:root[data-theme="industrial-purple"] .mg-content .el-card .el-card {
  background: rgba(var(--mg-bg-card-darker-rgb), 0.55) !important;
}
:root[data-theme="industrial-purple"] .mg-content .el-card .el-card::before {
  display: none;
}

:root[data-theme="industrial-purple"] .mg-content .el-statistic__head {
  color: rgba(255, 255, 255, 0.78) !important;
}
:root[data-theme="industrial-purple"] .mg-content .el-statistic__number,
:root[data-theme="industrial-purple"] .mg-content .el-statistic__content {
  background: linear-gradient(135deg, #ffffff 0%, rgba(var(--mg-accent-rgb), 1) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  text-shadow: 0 0 24px rgba(var(--mg-primary-hover-rgb), 0.5);
}

:root[data-theme="industrial-purple"] .mg-content .el-table th.el-table__cell {
  background: rgba(var(--mg-bg-card-darker-rgb), 0.75) !important;
}

:root[data-theme="industrial-purple"] .mg-content .el-input__wrapper,
:root[data-theme="industrial-purple"] .mg-content .el-textarea__inner {
  background: rgba(var(--mg-bg-card-darker-rgb), 0.55) !important;
  box-shadow: 0 0 0 1px rgba(var(--mg-accent-rgb), 0.18) inset !important;
}

/* 主按钮：紫色霓虹脉冲 */
:root[data-theme="industrial-purple"] .el-button--primary {
  background: linear-gradient(135deg,
    var(--mg-primary) 0%,
    var(--mg-primary-hover) 100%) !important;
  border: none !important;
  box-shadow:
    0 8px 22px rgba(var(--mg-primary-rgb), 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.18) inset !important;
  position: relative;
  overflow: hidden;
}
:root[data-theme="industrial-purple"] .el-button--primary::after {
  content: '';
  position: absolute;
  top: 0; left: -120%;
  width: 80%; height: 100%;
  background: linear-gradient(110deg,
    transparent 0%,
    rgba(255, 255, 255, 0.0) 30%,
    rgba(255, 255, 255, 0.35) 50%,
    rgba(255, 255, 255, 0.0) 70%,
    transparent 100%);
  transition: left .6s cubic-bezier(.25, .8, .25, 1);
}
:root[data-theme="industrial-purple"] .el-button--primary:hover::after { left: 120%; }
:root[data-theme="industrial-purple"] .el-button--primary:hover {
  box-shadow:
    0 12px 32px rgba(var(--mg-primary-rgb), 0.6),
    0 0 28px rgba(var(--mg-primary-hover-rgb), 0.55),
    0 0 0 1px rgba(var(--mg-accent-rgb), 0.4) inset !important;
  transform: translateY(-1px);
}

/* el-tag 增强紫色感 */
:root[data-theme="industrial-purple"] .mg-content .el-tag {
  background: linear-gradient(135deg, rgba(var(--mg-primary-rgb), 0.25), rgba(var(--mg-accent-rgb), 0.18));
  color: #fff;
  border-color: rgba(var(--mg-accent-rgb), 0.45);
}

/* 工具类：霓虹文字（卡片标题、KPI数值可用） */
.mg-neon-text {
  background: linear-gradient(135deg, #ffffff 0%, var(--mg-accent) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 0 18px rgba(var(--mg-primary-hover-rgb), 0.45);
}

/* 工具类：浮动 orb 节奏可视化（其他组件可用） */
@keyframes mg-pulse-glow {
  0%, 100% {
    box-shadow:
      0 0 0 0 rgba(var(--mg-accent-rgb), 0.35),
      0 0 28px rgba(var(--mg-primary-hover-rgb), 0.35);
  }
  50% {
    box-shadow:
      0 0 0 6px rgba(var(--mg-accent-rgb), 0),
      0 0 38px rgba(var(--mg-primary-hover-rgb), 0.55);
  }
}

/* ════════════════════════════════════════════════════════════════════
 *  迷毂浅紫 (fame-lavender) ─ 参考 FAME 系统的浅色变体
 *  设计目标：长时间使用不刺眼；右侧主区采用浅紫白底，深紫字色；
 *           侧栏保留深紫渐变以维持品牌一致性；
 *           关闭所有 orb / 网格 / 扫描线 / 霓虹光效。
 * ════════════════════════════════════════════════════════════════════ */
:root[data-theme="fame-lavender"] {
  --mg-glass-bg:        rgba(255, 255, 255, 0.95);
  --mg-glass-bg-hover:  rgba(249, 246, 255, 1);
  --mg-glass-bg-active: rgba(245, 240, 251, 1);
  --mg-glass-border:    rgba(124, 58, 237, 0.14);
  --mg-glass-border-hi: rgba(124, 58, 237, 0.35);
  --mg-glass-shadow:
    0 4px 14px rgba(45, 27, 105, 0.06),
    0 0 0 1px rgba(124, 58, 237, 0.06);
  --mg-glass-shadow-hi:
    0 8px 24px rgba(45, 27, 105, 0.10),
    0 0 0 1px rgba(124, 58, 237, 0.15);
  --mg-glass-blur:      none;
  --mg-glass-blur-hi:   none;

  /* 文字层级（v2 升级：对比度从 4.5:1 提至 7-15:1，关键提升正文清晰度） */
  --mg-text-light:  #1a0f3d;   /* 主标题 / KPI 数字 · 对比 ~15:1 */
  --mg-text-muted:  #4a3d6e;   /* 正文 / 说明文字 · 对比 ~9:1 (旧 #606266 在浅紫底上仅 5:1) */
  --mg-text-dim:    #7a6b9a;   /* 次要信息 / 时间戳 / 占位 · 对比 ~5:1 */
  --mg-text-faint:  #a8a0c0;   /* 禁用 / 装饰文字 · 对比 ~3:1 */
  --mg-divider:     #e8e1f0;   /* 分割线 / 卡片描边（比 #ebe5f4 略冷略深，更清晰） */

  /* 浅色主题状态色 (WCAG AA 兼容) */
  --mg-status-success: #15803d;
  --mg-status-success-rgb: 21, 128, 61;
  --mg-status-warning: #b45309;
  --mg-status-warning-rgb: 180, 83, 9;
  --mg-status-danger:  #b91c1c;
  --mg-status-danger-rgb: 185, 28, 28;
  --mg-status-info:    #1d4ed8;
  --mg-status-info-rgb: 29, 78, 216;
  --mg-status-idle:    #64748b;
  --mg-status-idle-rgb: 100, 116, 139;

  /* 内嵌表面 veil：浅紫主题翻成紫色微透，保证白底卡片内的嵌套行 / 子卡可见 */
  --mg-veil-1: rgba(124, 58, 237, 0.05);
  --mg-veil-2: rgba(124, 58, 237, 0.10);
  --mg-veil-3: rgba(124, 58, 237, 0.16);
  --mg-veil-border: rgba(124, 58, 237, 0.16);
  --mg-veil-border-hi: rgba(124, 58, 237, 0.32);

  /* 动作按钮：实色紫底 + 白字（对比 ~6.9:1，WCAG AA 通过） */
  --mg-action-bg: #7c3aed;
  --mg-action-bg-hover: #6d28d9;
  --mg-action-border: #7c3aed;
  --mg-action-border-hi: #6d28d9;
}

/* body：纯净紫白渐变（更柔和、长时间阅读不刺眼） */
:root[data-theme="fame-lavender"] body {
  background:
    linear-gradient(160deg, #edeaf5 0%, #e7e4f1 55%, #f1eef8 100%) !important;
  color: #1a0f3d;
}

/* 关闭全局背景网格与扫描线 */
:root[data-theme="fame-lavender"] #app::before,
:root[data-theme="fame-lavender"] #app::after {
  display: none !important;
}

/* 关闭 AppShell 中的浮动 orb */
:root[data-theme="fame-lavender"] .bg-orbs { display: none !important; }

/* 侧栏：宝石紫渐变 + 高可读性 menu 状态（v2 优化对比度与层级） */
:root[data-theme="fame-lavender"] .aside {
  background: linear-gradient(180deg, #2e1065 0%, #1c0a4d 100%) !important;
  border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 4px 0 24px rgba(45, 27, 105, 0.18) !important;
}
:root[data-theme="fame-lavender"] .aside::before { display: none !important; }
:root[data-theme="fame-lavender"] .aside .logo {
  background: transparent !important;
  border-bottom: 1px solid rgba(196, 181, 253, 0.12) !important;
}
:root[data-theme="fame-lavender"] .aside .logo-title-zh {
  background: linear-gradient(135deg, #ffffff 0%, #c4b5fd 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  text-shadow: none !important;
  font-weight: 700;
}

/* inactive menu item：浅紫白文字（提高可读性，比纯白稍柔和）
 * 会话 14：原规则同样误用了 Vue scoped 专属的 :deep()，在全局 css 中无效。
 * 去掉 :deep() 后规则才能落到 element-plus 渲染出的 .el-menu-item / .el-sub-menu__title 上。 */
:root[data-theme="fame-lavender"] .aside .el-menu {
  background: transparent !important;
  border-right: none !important;
}
:root[data-theme="fame-lavender"] .aside .el-menu-item,
:root[data-theme="fame-lavender"] .aside .el-sub-menu__title {
  color: #d4cae8 !important;
  font-weight: 500 !important;
  background: transparent !important;
}
:root[data-theme="fame-lavender"] .aside .el-menu-item:hover,
:root[data-theme="fame-lavender"] .aside .el-sub-menu__title:hover {
  background: rgba(196, 181, 253, 0.10) !important;
  color: #ffffff !important;
}
:root[data-theme="fame-lavender"] .aside .el-menu-item.is-active,
:root[data-theme="fame-lavender"] .aside .el-sub-menu.is-active > .el-sub-menu__title {
  background: linear-gradient(90deg, rgba(168, 85, 247, 0.30) 0%, rgba(124, 58, 237, 0.16) 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  box-shadow: inset 3px 0 0 #c4b5fd !important;
  text-shadow: none !important;
}

/* 子菜单 active 区分（左条更细更柔和） */
:root[data-theme="fame-lavender"] .aside .el-menu .el-menu-item.is-active {
  background: linear-gradient(90deg, rgba(168, 85, 247, 0.22) 0%, transparent 100%) !important;
  box-shadow: inset 2px 0 0 #a855f7 !important;
}

/* 顶部 header：白色卡片质感 */
:root[data-theme="fame-lavender"] .header {
  background: #fff !important;
  border-bottom: 1px solid #ebe5f4 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 1px 6px rgba(45, 27, 105, 0.05) !important;
}
:root[data-theme="fame-lavender"] .header::after { display: none !important; }
/* 会话 14：原规则误用 Vue scoped 专属的 :deep() 伪类写在全局 css 里，浏览器不识别 → 整条规则
 * 被丢弃，AppShell.vue scoped 中的白色面包屑文字在 fame-lavender 白底 header 上完全看不见。
 * 这里去掉 :deep()，直接用普通后代选择器；特异性 (0,4,0) + !important 足以覆盖 scoped 的 (0,2,0)。
 * 同时补上面包屑分隔符 "/" 的色，原默认是 rgba(255,255,255,.35)，在白底上也不可见。 */
:root[data-theme="fame-lavender"] .header .el-breadcrumb__inner { color: #4a3d6e !important; font-weight: 500; }
:root[data-theme="fame-lavender"] .header .el-breadcrumb__item:last-child .el-breadcrumb__inner {
  color: #7c3aed !important;
  font-weight: 700;
}
:root[data-theme="fame-lavender"] .header .el-breadcrumb__separator { color: #a8a0c0 !important; }
:root[data-theme="fame-lavender"] .header .el-breadcrumb__inner:hover { color: #7c3aed !important; }
:root[data-theme="fame-lavender"] .header .icon-btn {
  border-color: #ebe5f4 !important;
  color: #7c3aed !important;
  background: #f8f4fc !important;
}
:root[data-theme="fame-lavender"] .header .icon-btn:hover {
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
  color: #5b21b6 !important;
}
:root[data-theme="fame-lavender"] .header .runmode-tag {
  background: #f5f3ff !important;
  border-color: #ddd6fe !important;
  color: #5b21b6 !important;
}
:root[data-theme="fame-lavender"] .header .runmode-tag.WebEnabled {
  background: #ecfdf5 !important;
  border-color: #bbf7d0 !important;
  color: #047857 !important;
}
/* 会话 N+2：补 WebOnly 适配。原默认深主题 .runmode-tag.WebOnly 用 var(--mg-accent) 浅紫白字，
   在 fame-lavender 白色 header 上跟背景同色 → 完全看不见。这里强制为「紫色描边 + 深紫字」。 */
:root[data-theme="fame-lavender"] .header .runmode-tag.WebOnly {
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
  color: #6d28d9 !important;
}

/* 会话 N+2：header 内 ScopeSwitcher (el-radio-button) 在 fame-lavender 白底下的适配。
 * 默认深主题下 .mg-content .el-radio-button 已配深底白字，但 header 不在 .mg-content 里，
 * 所以 fame-lavender 切到白底 header 时 element-plus 默认样式 (#fff 底 + #606266 字) 接管，
 * 看起来"灰色椭圆 + 几乎不可读" —— 这里强制改成紫色描边 + 深紫字，激活态紫底白字。 */
:root[data-theme="fame-lavender"] .header .el-radio-button__inner {
  background: #fff !important;
  border-color: #ddd6fe !important;
  color: #5b21b6 !important;
  font-weight: 500;
}
:root[data-theme="fame-lavender"] .header .el-radio-button__inner:hover {
  color: #6d28d9 !important;
  border-color: #c4b5fd !important;
  background: #f5f3ff !important;
}
:root[data-theme="fame-lavender"] .header .el-radio-button.is-active .el-radio-button__inner {
  background: #7c3aed !important;
  border-color: #7c3aed !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.25);
}
:root[data-theme="fame-lavender"] .header .user-link {
  background: #f8f4fc !important;
  border-color: #ebe5f4 !important;
  color: #2d1b69 !important;
}
:root[data-theme="fame-lavender"] .header .user-link:hover {
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
}
:root[data-theme="fame-lavender"] .header .user-name { color: #2d1b69 !important; }

/* 主内容区：纯净紫白底 + 高对比深字（v2 文字层级清晰化） */
:root[data-theme="fame-lavender"] .main,
:root[data-theme="fame-lavender"] .mg-content {
  background: transparent !important;
  color: #1a0f3d !important;
}
:root[data-theme="fame-lavender"] .mg-content h1,
:root[data-theme="fame-lavender"] .mg-content h2,
:root[data-theme="fame-lavender"] .mg-content h3 {
  color: #1a0f3d !important;
  font-weight: 700;
}
:root[data-theme="fame-lavender"] .mg-content p { color: #4a3d6e !important; }
:root[data-theme="fame-lavender"] .mg-content small,
:root[data-theme="fame-lavender"] .mg-content .text-secondary { color: #7a6b9a !important; }

/* footer */
:root[data-theme="fame-lavender"] .footer {
  background: rgba(255, 255, 255, 0.7) !important;
  border-top: 1px solid #ebe5f4 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #909399 !important;
}

/* el-card：白底紫描边 + 双层阴影（紫色阴影更显品牌） */
:root[data-theme="fame-lavender"] .mg-content .el-card {
  background: #ffffff !important;
  border: 1px solid #e2dbf0 !important;
  border-radius: 14px !important;
  box-shadow:
    0 1px 2px rgba(45, 27, 105, 0.05),
    0 10px 26px rgba(108, 71, 200, 0.10) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #1a0f3d !important;
  overflow: hidden;
}
:root[data-theme="fame-lavender"] .mg-content .el-card::before { display: none !important; }
:root[data-theme="fame-lavender"] .mg-content .el-card:hover {
  background: #ffffff !important;
  border-color: #c4b5fd !important;
  box-shadow:
    0 4px 14px rgba(45, 27, 105, 0.10),
    0 18px 40px rgba(108, 71, 200, 0.16) !important;
  transform: translateY(-2px) !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-card .el-card {
  background: #faf7fd !important;
  border-color: #f0eaf6 !important;
  box-shadow: none !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-card__header {
  background: #faf7fd !important;
  border-bottom: 1px solid #e8e1f0 !important;
  color: #1a0f3d !important;
  font-weight: 600;
}
:root[data-theme="fame-lavender"] .mg-content .el-card__body {
  background: transparent !important;
  color: #1a0f3d !important;
}

/* KPI 玻璃卡片：浅底化 */
:root[data-theme="fame-lavender"] .mg-content .kpi-row .el-statistic,
:root[data-theme="fame-lavender"] .mg-content .kpi-card {
  background: #fff !important;
  border: 1px solid #e2dbf0 !important;
  border-radius: 12px !important;
  box-shadow:
    0 1px 2px rgba(45, 27, 105, 0.05),
    0 8px 22px rgba(108, 71, 200, 0.10) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 16px 18px !important;
}
:root[data-theme="fame-lavender"] .mg-content .kpi-row .el-statistic:hover,
:root[data-theme="fame-lavender"] .mg-content .kpi-card:hover {
  background: #fff !important;
  border-color: #c4b5fd !important;
  box-shadow:
    0 4px 14px rgba(45, 27, 105, 0.09),
    0 14px 32px rgba(108, 71, 200, 0.15) !important;
  transform: translateY(-2px) !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-statistic__head { color: #4a3d6e !important; font-weight: 500; }
:root[data-theme="fame-lavender"] .mg-content .el-statistic__number,
:root[data-theme="fame-lavender"] .mg-content .el-statistic__content {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: #1a0f3d !important;
  text-shadow: none !important;
  font-family: var(--mg-font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

/* el-table：浅底高对比 + 紫色 hover */
:root[data-theme="fame-lavender"] .mg-content .el-table {
  --el-table-bg-color: #ffffff;
  --el-table-tr-bg-color: #ffffff;
  --el-table-header-bg-color: #faf7fd;
  --el-table-row-hover-bg-color: #f5f3ff;
  --el-table-border-color: #e8e1f0;
  --el-table-header-text-color: #1a0f3d;
  --el-table-text-color: #1a0f3d;
  --el-fill-color-blank: #ffffff;
  --el-fill-color-light: #faf7fd;
  color: #1a0f3d !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-table,
:root[data-theme="fame-lavender"] .mg-content .el-table tr {
  background: #ffffff !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-table th.el-table__cell {
  background: #faf7fd !important;
  color: #1a0f3d !important;
  border-bottom-color: #e8e1f0 !important;
  font-weight: 600;
}
:root[data-theme="fame-lavender"] .mg-content .el-table td.el-table__cell {
  background: #ffffff !important;
  color: #1a0f3d !important;
  border-bottom-color: #f0eaf6 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-table--striped .el-table__body tr:nth-child(2n) td.el-table__cell {
  background: #faf7fd !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-table tr:hover > td.el-table__cell {
  background: #f5f3ff !important;
}

/* el-input / el-textarea / el-select：浅底 + 深字 + 焦点紫光晕 */
:root[data-theme="fame-lavender"] .mg-content .el-input__wrapper,
:root[data-theme="fame-lavender"] .mg-content .el-textarea__inner,
:root[data-theme="fame-lavender"] .mg-content .el-select .el-input__wrapper {
  background: #ffffff !important;
  box-shadow: 0 0 0 1px #e0d4f5 inset !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-input__wrapper:hover {
  box-shadow: 0 0 0 1px #c4b5fd inset !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-input__wrapper.is-focus {
  box-shadow:
    0 0 0 1px #7c3aed inset,
    0 0 0 3px rgba(124, 58, 237, 0.15) !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-input__inner,
:root[data-theme="fame-lavender"] .mg-content .el-textarea__inner { color: #1a0f3d !important; font-weight: 500; }
:root[data-theme="fame-lavender"] .mg-content .el-input__inner::placeholder,
:root[data-theme="fame-lavender"] .mg-content .el-textarea__inner::placeholder { color: #a8a0c0 !important; }
:root[data-theme="fame-lavender"] .mg-content .el-form-item__label { color: #4a3d6e !important; font-weight: 500; }

/* el-tabs：紫色活跃 + 高对比 */
/* 浅色主题下 el-tabs 容器内不再继承玻璃主题强制白字，恢复深色 primary，
   避免 .mg-content .el-tabs { --el-text-color-primary: #fff } 把内部 h2 / label
   一并染白后出现"白底白字"（车辆管理标题、其他 tabs 内 .ref-mgr-title 同理）。 */
:root[data-theme="fame-lavender"] .mg-content .el-tabs {
  --el-text-color-primary: #2d1b69 !important;
  --el-text-color-regular: #303133 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-tabs__item { color: #4a3d6e !important; font-weight: 500; }
:root[data-theme="fame-lavender"] .mg-content .el-tabs__item:hover { color: #7c3aed !important; }
:root[data-theme="fame-lavender"] .mg-content .el-tabs__item.is-active {
  color: #7c3aed !important;
  font-weight: 700;
}
/* 兜底：element-plus 内部 css 改版后曾出现「.el-tabs__item 不在 .mg-content 路径下」的场景，
   再加一组不带 .mg-content 限定的规则，避免在 dialog / drawer 中弹出的 tabs 仍然白字。 */
:root[data-theme="fame-lavender"] .el-tabs__item { color: #4a3d6e !important; }
:root[data-theme="fame-lavender"] .el-tabs__item:hover { color: #7c3aed !important; }
:root[data-theme="fame-lavender"] .el-tabs__item.is-active { color: #7c3aed !important; font-weight: 700; }
:root[data-theme="fame-lavender"] .mg-content .el-tabs__active-bar {
  background-color: #7c3aed !important;
  height: 3px !important;
  border-radius: 2px;
}
:root[data-theme="fame-lavender"] .mg-content .el-tabs__nav-wrap::after { background-color: #e8e1f0 !important; }

/* ─────────────────────────────────────────────────────────────────────────
 *  ReflectionManagerPanel / CarPanelView 等 tabs 内长标题（会话 N+2 UI 修复）
 *  问题：组件 scoped CSS 写 `color: var(--el-text-color-primary, #fff)`，
 *  但在 el-tab-pane 嵌套层级里变量没下传，回退到 #fff → 浅紫背景白字看不清。
 *  解法：在 fame-lavender 主题下直接给关键文字类「深紫色 #2d1b69」+ !important，
 *  优先级压过 scoped css。同时把面板卡片底色从深紫透明改成白色，对比足够。
 * ───────────────────────────────────────────────────────────────────────── */
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-page,
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-title,
:root[data-theme="fame-lavender"] .mg-content .field-section-title,
:root[data-theme="fame-lavender"] .mg-content .detail-name {
  color: #2d1b69 !important;
}
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-title { font-weight: 700; }
:root[data-theme="fame-lavender"] .mg-content .detail-id,
:root[data-theme="fame-lavender"] .mg-content .ref-type-asm,
:root[data-theme="fame-lavender"] .mg-content .field-empty {
  color: #7a6b9a !important;
}
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-list-card,
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-detail-card {
  background: #ffffff !important;
  border: 1px solid rgba(124, 58, 237, 0.16) !important;
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.06) !important;
}
:root[data-theme="fame-lavender"] .mg-content .ref-mgr-header,
:root[data-theme="fame-lavender"] .mg-content .detail-header {
  border-color: rgba(124, 58, 237, 0.18) !important;
}
:root[data-theme="fame-lavender"] .mg-content .field-section {
  color: #303133;
}
:root[data-theme="fame-lavender"] .mg-content .status-value {
  color: #303133 !important;
}

/* el-tag：浅紫 */
:root[data-theme="fame-lavender"] .mg-content .el-tag {
  background: #ede9fe !important;
  color: #5b21b6 !important;
  border-color: #ddd6fe !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-tag--success {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border-color: #bbf7d0 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-tag--warning {
  background: #fffbeb !important;
  color: #b45309 !important;
  border-color: #fde68a !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-tag--danger {
  background: #fef2f2 !important;
  color: #b91c1c !important;
  border-color: #fecaca !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-tag--info {
  background: #f3f4f6 !important;
  color: #4b5563 !important;
  border-color: #e5e7eb !important;
}

/* el-descriptions */
:root[data-theme="fame-lavender"] .mg-content .el-descriptions {
  --el-text-color-primary: #2d1b69;
  --el-text-color-regular: #606266;
  --el-border-color-lighter: #ebe5f4;
  --el-fill-color-blank: #fff;
  color: #303133 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-descriptions__label,
:root[data-theme="fame-lavender"] .mg-content .el-descriptions__cell.is-bordered-label {
  background: #faf7fd !important;
  color: #606266 !important;
  border-color: #ebe5f4 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-descriptions__content,
:root[data-theme="fame-lavender"] .mg-content .el-descriptions__cell.is-bordered-content {
  background: #fff !important;
  color: #303133 !important;
  border-color: #ebe5f4 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-descriptions__title { color: #2d1b69 !important; }

/* el-alert / collapse / radio / checkbox 浅化 */
:root[data-theme="fame-lavender"] .mg-content .el-alert {
  background: #faf7fd !important;
  border: 1px solid #ebe5f4 !important;
  color: #303133 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-alert__title,
:root[data-theme="fame-lavender"] .mg-content .el-alert__description { color: #303133 !important; }

:root[data-theme="fame-lavender"] .mg-content .el-collapse {
  border-color: #ebe5f4 !important;
  --el-collapse-header-text-color: #2d1b69;
  --el-collapse-content-text-color: #303133;
}
:root[data-theme="fame-lavender"] .mg-content .el-collapse-item__header,
:root[data-theme="fame-lavender"] .mg-content .el-collapse-item__wrap {
  background: #fff !important;
  border-color: #ebe5f4 !important;
  color: #303133 !important;
}

:root[data-theme="fame-lavender"] .mg-content .el-radio__label,
:root[data-theme="fame-lavender"] .mg-content .el-checkbox__label { color: #303133 !important; }
:root[data-theme="fame-lavender"] .mg-content .el-radio__inner,
:root[data-theme="fame-lavender"] .mg-content .el-checkbox__inner {
  background: #fff !important;
  border-color: #c4b5fd !important;
}

:root[data-theme="fame-lavender"] .mg-content .el-radio-button__inner {
  background: #fff !important;
  border-color: #ddd6fe !important;
  color: #5b21b6 !important;
}
:root[data-theme="fame-lavender"] .mg-content .el-radio-button.is-active .el-radio-button__inner {
  background: #7c3aed !important;
  border-color: #7c3aed !important;
  color: #fff !important;
}

/* el-button--primary：紫色稳重 + 高对比白字（去霓虹动画） */
:root[data-theme="fame-lavender"] .el-button--primary {
  background: #7c3aed !important;
  border: 1px solid #7c3aed !important;
  color: #ffffff !important;
  font-weight: 600;
  box-shadow:
    0 1px 2px rgba(45, 27, 105, 0.08),
    0 2px 6px rgba(124, 58, 237, 0.22) !important;
}
:root[data-theme="fame-lavender"] .el-button--primary::after { display: none !important; }
:root[data-theme="fame-lavender"] .el-button--primary:hover {
  background: #6d28d9 !important;
  border-color: #6d28d9 !important;
  box-shadow:
    0 2px 6px rgba(45, 27, 105, 0.12),
    0 4px 14px rgba(124, 58, 237, 0.32) !important;
  transform: translateY(-1px) !important;
}
:root[data-theme="fame-lavender"] .el-button--primary:active {
  background: #5b21b6 !important;
  border-color: #5b21b6 !important;
  transform: translateY(0) !important;
}

/* default 按钮：白底紫描边 + hover 浅紫底 */
:root[data-theme="fame-lavender"] .mg-content .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--text) {
  background: #ffffff !important;
  border-color: #ddd6fe !important;
  color: #5b21b6 !important;
  font-weight: 500;
}
:root[data-theme="fame-lavender"] .mg-content .el-button:not(.el-button--primary):not(.el-button--success):not(.el-button--warning):not(.el-button--danger):not(.el-button--text):hover {
  background: #f5f3ff !important;
  border-color: #a78bfa !important;
  color: #5b21b6 !important;
  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.10) !important;
}

/* el-progress */
:root[data-theme="fame-lavender"] .mg-content .el-progress-bar__outer { background: #ede9fe !important; }
:root[data-theme="fame-lavender"] .mg-content .el-progress-bar__inner {
  background: linear-gradient(90deg, #7c3aed 0%, #a855f7 100%) !important;
}

/* el-pagination 浅化 */
:root[data-theme="fame-lavender"] .mg-content .el-pagination {
  --el-pagination-bg-color: #fff;
  --el-pagination-button-bg-color: #faf7fd;
  --el-pagination-button-color: #2d1b69;
  --el-pagination-hover-color: #7c3aed;
  color: #606266 !important;
}

/* el-dropdown 菜单 浅化（影响 header 用户菜单） */
:root[data-theme="fame-lavender"] .el-dropdown-menu {
  background: #fff !important;
  backdrop-filter: none !important;
  border: 1px solid #ebe5f4 !important;
  box-shadow: 0 6px 16px rgba(45, 27, 105, 0.10) !important;
}
:root[data-theme="fame-lavender"] .el-dropdown-menu__item {
  color: #303133 !important;
}
:root[data-theme="fame-lavender"] .el-dropdown-menu__item:hover {
  background: #f5f3ff !important;
  color: #7c3aed !important;
}

/* el-switch */
:root[data-theme="fame-lavender"] .mg-content .el-switch.is-checked .el-switch__core {
  background: #7c3aed !important;
  border-color: #7c3aed !important;
}

/* el-dialog 上的 h2 */
:root[data-theme="fame-lavender"] .el-dialog h2 { color: #2d1b69 !important; }
:root[data-theme="fame-lavender"] .el-dialog { background: #fff !important; }
:root[data-theme="fame-lavender"] .el-dialog__title { color: #2d1b69 !important; }
:root[data-theme="fame-lavender"] .el-dialog__body { color: #303133 !important; }

/* 滚动条：紫色半透明（与 FAME 一致） */
:root[data-theme="fame-lavender"] ::-webkit-scrollbar-thumb {
  background: rgba(124, 58, 237, 0.25);
}
:root[data-theme="fame-lavender"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(124, 58, 237, 0.45);
}

/* ════════════════════════════════════════════════════════════════════
 *  通用工具类（基于 design-system tokens · 见 design-system/MASTER.md）
 * ════════════════════════════════════════════════════════════════════ */

/* 等宽数字：KPI 数值 / 坐标 / ID / 时间戳 */
.mg-mono,
.mg-num {
  font-family: var(--mg-font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}

/* 状态徽章（pill 样式，胶囊状） */
.mg-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.3px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.mg-pill.is-success {
  background: rgba(var(--mg-status-success-rgb), 0.15);
  color: var(--mg-status-success);
  border-color: rgba(var(--mg-status-success-rgb), 0.40);
}
.mg-pill.is-warning {
  background: rgba(var(--mg-status-warning-rgb), 0.15);
  color: var(--mg-status-warning);
  border-color: rgba(var(--mg-status-warning-rgb), 0.40);
}
.mg-pill.is-danger {
  background: rgba(var(--mg-status-danger-rgb), 0.15);
  color: var(--mg-status-danger);
  border-color: rgba(var(--mg-status-danger-rgb), 0.40);
}
.mg-pill.is-info {
  background: rgba(var(--mg-status-info-rgb), 0.15);
  color: var(--mg-status-info);
  border-color: rgba(var(--mg-status-info-rgb), 0.40);
}
.mg-pill.is-idle {
  background: rgba(var(--mg-status-idle-rgb), 0.15);
  color: var(--mg-status-idle);
  border-color: rgba(var(--mg-status-idle-rgb), 0.40);
}

/* 实时脉动指示点：<span class="mg-live-dot is-success"/> */
.mg-live-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mg-status-info);
  position: relative;
}
.mg-live-dot::after {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid currentColor;
  opacity: 0;
  animation: mg-live-pulse 1.6s ease-out infinite;
}
.mg-live-dot.is-success { background: var(--mg-status-success); color: var(--mg-status-success); }
.mg-live-dot.is-warning { background: var(--mg-status-warning); color: var(--mg-status-warning); }
.mg-live-dot.is-danger  { background: var(--mg-status-danger);  color: var(--mg-status-danger);  }
.mg-live-dot.is-info    { background: var(--mg-status-info);    color: var(--mg-status-info);    }
.mg-live-dot.is-idle    { background: var(--mg-status-idle);    color: var(--mg-status-idle); }
.mg-live-dot.is-idle::after { animation: none; }

@keyframes mg-live-pulse {
  0%   { transform: scale(0.6); opacity: 0.55; }
  70%  { transform: scale(1.5); opacity: 0; }
  100% { transform: scale(1.8); opacity: 0; }
}

/* 尊重用户的减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  .mg-live-dot::after { animation: none; }
  .bg-orb,
  .hero-orb,
  .hero-scene .agv-1,
  .hero-scene .agv-2,
  .hero-scene .float-data { animation: none !important; }
}

/* ─────────────────────────────────────────────────────────────────────────
 *  fame-lavender 下 ReflectionManagerPanel 自定义按钮反差修复
 *
 *  问题：组件 scoped css 把 .method-btn / .header-action-btn / .add-field-btn 写成
 *  「半透明紫底 + 白字」(rgba(170,110,250,0.30) 衬 #fff)，本来是给星云紫深底主题设计的。
 *  fame-lavender 切到白色卡片底后，半透明紫直接糊在白底 → 浅紫；白字糊在浅紫
 *  → 对比度 ~1.5:1，"动作 / 方法" 区按钮文字几乎不可见（见会话 N+3 用户反馈截图）。
 *
 *  策略：与 fame-lavender 下 .el-button--primary 保持一致 ——
 *  实色 #7c3aed 紫底 + #ffffff 白字 + 紫色双层阴影，对比度 ~6.9:1（WCAG AA 通过）。
 *  「+ 添加字段」(.add-field-btn) 偏次要等级，改为白底紫描边紫字（与 default 按钮一致）。
 *
 *  特异性：:root[data-theme] .mg-content .x  = (0,3,0)，加 !important 足以压过 Vue
 *  scoped css 的 .x[data-v-xxx] = (0,2,0)。
 * ───────────────────────────────────────────────────────────────────────── */
:root[data-theme="fame-lavender"] .mg-content .method-btn,
:root[data-theme="fame-lavender"] .mg-content .header-action-btn {
  background: #7c3aed !important;
  border: 1px solid #7c3aed !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow:
    0 1px 2px rgba(45, 27, 105, 0.08),
    0 2px 6px rgba(124, 58, 237, 0.22) !important;
}
:root[data-theme="fame-lavender"] .mg-content .method-btn:hover:not(:disabled),
:root[data-theme="fame-lavender"] .mg-content .header-action-btn:hover {
  background: #6d28d9 !important;
  border-color: #6d28d9 !important;
  color: #ffffff !important;
  box-shadow:
    0 2px 6px rgba(45, 27, 105, 0.12),
    0 4px 14px rgba(124, 58, 237, 0.32) !important;
}
:root[data-theme="fame-lavender"] .mg-content .method-btn:active:not(:disabled) {
  background: #5b21b6 !important;
  border-color: #5b21b6 !important;
}
:root[data-theme="fame-lavender"] .mg-content .method-btn:disabled {
  background: #c4b5fd !important;
  border-color: #c4b5fd !important;
  color: #ffffff !important;
  box-shadow: none !important;
  opacity: 0.85 !important;
}
:root[data-theme="fame-lavender"] .mg-content .method-btn .method-btn-icon,
:root[data-theme="fame-lavender"] .mg-content .method-btn .method-btn-spin {
  color: rgba(255, 255, 255, 0.92) !important;
}
:root[data-theme="fame-lavender"] .mg-content .method-btn .method-btn-tag {
  background: rgba(255, 255, 255, 0.24) !important;
  color: #ffffff !important;
}

/* 「+ 添加字段」次级按钮：与 default 按钮同视觉等级（白底紫描边紫字），避免与 primary 等高。 */
:root[data-theme="fame-lavender"] .mg-content .add-field-btn {
  background: #ffffff !important;
  border: 1px dashed #a78bfa !important;
  color: #5b21b6 !important;
  font-weight: 500 !important;
}
:root[data-theme="fame-lavender"] .mg-content .add-field-btn:hover {
  background: #f5f3ff !important;
  border-color: #7c3aed !important;
  color: #5b21b6 !important;
}