/* ===== 页面样式: 门店实况 ===== */

/* ============================================================
   MartFlow — 品牌设计 Token
   依据：设计方案 §5.2 色彩体系 / §5.3 字体规范 / §5.4 间距栅格 / §5.8 阴影层级
   品牌前缀：rm
   ============================================================ */

/* ---------- 深色模式（默认） ---------- */
:root {
  /* 背景层 */
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;

  /* 边框 */
  --rm-line: #334155;

  /* 文字 */
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;

  /* 品牌色（单一主色） */
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;

  /* 状态色（仅语义状态使用） */
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;

  /* 数据可视化 */
  --rm-chart-flow: #00D4FF;
  --rm-chart-flow-2: #0EA5E9;
  --rm-chart-temp: #F59E0B;
  --rm-chart-temp-2: #EF4444;

  /* 阴影层级（静态阴影 alpha<=0.05，浮动层阴影用于 modal/popover/dropdown） */
  --rm-shadow-1: 0 1px 3px rgba(0,0,0,0.05);
  --rm-shadow-2: 0 4px 12px rgba(0,0,0,0.08);
  --rm-shadow-3: 0 8px 32px rgba(0,0,0,0.12);
  --rm-shadow-alert: 0 0 16px rgba(239,68,68,0.08);
  --rm-shadow-ai: 0 0 12px rgba(0,212,255,0.05);

  /* ---- 语义别名（apply-html-head-contract.mjs 要求） ---- */
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
  --rm-radius-small: 6px;
  --rm-radius-medium: 12px;
  --rm-radius-large: 16px;
}

.dark {
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;
  --rm-line: #334155;
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ---------- 高对比度模式（浅色，§5.2 评审决议 R-04） ---------- */
.light {
  --rm-bg: #F8FAFC;
  --rm-surface: #FFFFFF;
  --rm-surface-2: #F1F5F9;

  --rm-line: #CBD5E1;

  --rm-ink: #0F172A;
  --rm-ink-2: #475569;
  --rm-ink-3: #94A3B8;

  --rm-brand: #0284C7;
  --rm-brand-hover: #0369A1;
  --rm-brand-active: #075985;
  --rm-brand-ink: #FFFFFF;

  --rm-state-success: #059669;
  --rm-state-warning: #D97706;
  --rm-state-error: #DC2626;
  --rm-state-info: #7C3AED;

  --rm-shadow-1: 0 1px 3px rgba(15,23,42,0.05);
  --rm-shadow-2: 0 4px 12px rgba(15,23,42,0.08);
  --rm-shadow-3: 0 8px 32px rgba(15,23,42,0.12);
  --rm-shadow-alert: 0 0 16px rgba(220,38,38,0.05);
  --rm-shadow-ai: 0 0 12px rgba(2,132,199,0.05);

  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ============================================================
   字体系统（§5.3）
   ============================================================ */
:root {
  --rm-font-sans: "HarmonyOS Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --rm-font-mono: "DIN Alternate", "Roboto Mono", "JetBrains Mono", monospace;
}

/* 字体角色类 */
.rm-text-display {
  font-family: var(--rm-font-sans);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.rm-text-card-title {
  font-family: var(--rm-font-sans);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
}

.rm-text-body-strong {
  font-family: var(--rm-font-sans);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.rm-text-body {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.rm-text-caption {
  font-family: var(--rm-font-sans);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.005em;
}

.rm-text-data-lg {
  font-family: var(--rm-font-mono);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
}

.rm-text-data-md {
  font-family: var(--rm-font-mono);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
}

.rm-text-llm {
  font-family: var(--rm-font-sans);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
}

/* ============================================================
   间距体系（§5.4，8px 基准）
   ============================================================ */
:root {
  --rm-space-xs: 4px;
  --rm-space-sm: 8px;
  --rm-space-md: 16px;
  --rm-space-lg: 24px;
  --rm-space-xl: 32px;
  --rm-space-2xl: 48px;
}

/* ============================================================
   圆角体系（§5.4）
   ============================================================ */
:root {
  --rm-radius-sm: 6px;
  --rm-radius-md: 12px;
  --rm-radius-lg: 16px;
  --rm-radius-full: 9999px;
}

/* ============================================================
   布局尺寸（§5.4 / §5.6）
   ============================================================ */
:root {
  --rm-layout-header-h: 56px;
  --rm-layout-sidebar-w: 220px;
  --rm-layout-sidebar-collapsed-w: 64px;
  --rm-layout-ai-bar-h: 72px;
  --rm-layout-ai-bar-expanded-h: 320px;
  --rm-layout-card-min-h: 120px;
  --rm-layout-card-padding: 16px;
  --rm-layout-grid-cols: 12;
  --rm-layout-grid-gap: 24px;
  --rm-layout-max-w: 1920px;
  --rm-layout-content-padding: 32px;
}

/* ============================================================
   组件状态规范（§7.5）
   ============================================================ */

/* 按钮基础 */
.rm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rm-space-xs);
  height: 40px;
  padding: 0 24px;
  border-radius: var(--rm-radius-sm);
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1),
              transform 120ms cubic-bezier(.2,.8,.2,1);
  border: none;
  outline: none;
  white-space: nowrap;
  user-select: none;
}

.rm-btn:active {
  transform: scale(0.98);
}

.rm-btn:focus-visible {
  box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
}

/* 主按钮 */
.rm-btn-primary {
  background-color: var(--rm-brand);
  color: var(--rm-brand-ink);
}
.rm-btn-primary:hover {
  background-color: var(--rm-brand-hover);
}

/* 次按钮 */
.rm-btn-secondary {
  background-color: transparent;
  border: 1px solid var(--rm-line);
  color: var(--rm-ink);
}
.rm-btn-secondary:hover {
  border-color: var(--rm-brand);
}

/* 危险按钮 */
.rm-btn-danger {
  background-color: var(--rm-state-error);
  color: #FFFFFF;
}
.rm-btn-danger:hover {
  background-color: #DC2626;
}

/* 禁用态 */
.rm-btn:disabled,
.rm-btn-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* 紧凑尺寸 */
.rm-btn-sm {
  height: 32px;
  padding: 0 16px;
  font-size: 13px;
}

/* 大号尺寸 */
.rm-btn-lg {
  height: 48px;
  padding: 0 32px;
  font-size: 16px;
}

/* ============================================================
   卡片基础（§5.8 阴影与层级）
   ============================================================ */
.rm-card {
  background-color: var(--rm-surface);
  border: 1px solid var(--rm-line);
  border-radius: var(--rm-radius-md);
  padding: var(--rm-layout-card-padding);
  min-height: var(--rm-layout-card-min-h);
  transition: box-shadow 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1);
}

.rm-card:hover {
  box-shadow: var(--rm-shadow-2);
}

/* 告警卡片 */
.rm-card-alert {
  border-color: var(--rm-state-error);
  box-shadow: var(--rm-shadow-alert);
  animation: rm-pulse-alert 1.5s ease-in-out infinite;
}

@keyframes rm-pulse-alert {
  0%, 100% { box-shadow: 0 0 16px rgba(239,68,68,0.3); }
  50% { box-shadow: 0 0 24px rgba(239,68,68,0.5); }
}

/* AI 卡片微光 */
.rm-card-ai {
  box-shadow: var(--rm-shadow-ai);
}

/* ============================================================
   骨架屏 shimmer（§5.5）
   ============================================================ */
.rm-skeleton {
  background: linear-gradient(
    90deg,
    var(--rm-surface) 0%,
    var(--rm-surface-2) 50%,
    var(--rm-surface) 100%
  );
  background-size: 200% 100%;
  animation: rm-shimmer 1.5s linear infinite;
  border-radius: var(--rm-radius-sm);
}

@keyframes rm-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   AI 光球动画（§5.5）
   ============================================================ */
.rm-ai-orb {
  display: inline-block;
  width: 40px;
  height: 40px;
  border-radius: var(--rm-radius-full);
  background: radial-gradient(circle at 35% 35%, var(--rm-brand) 0%, var(--rm-brand-active) 60%, transparent 100%);
  box-shadow: 0 0 16px rgba(0,212,255,0.3);
  animation: rm-orb-breathe 3s ease-in-out infinite;
}

.rm-ai-orb--thinking {
  animation: rm-orb-rotate 2s linear infinite;
}

.rm-ai-orb--offline {
  background: radial-gradient(circle at 35% 35%, var(--rm-ink-3) 0%, var(--rm-ink-3) 60%, transparent 100%);
  box-shadow: none;
  animation: none;
  opacity: 0.5;
}

@keyframes rm-orb-breathe {
  0%, 100% { transform: scale(1); box-shadow: 0 0 16px rgba(0,212,255,0.3); }
  50% { transform: scale(1.05); box-shadow: 0 0 24px rgba(0,212,255,0.5); }
}

@keyframes rm-orb-rotate {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.05); }
  100% { transform: rotate(360deg) scale(1); }
}

/* ============================================================
   状态点（§5.2）
   ============================================================ */
.rm-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--rm-radius-full);
  flex-shrink: 0;
}

.rm-status-dot--success { background-color: var(--rm-state-success); box-shadow: 0 0 8px rgba(16,185,129,0.3); }
.rm-status-dot--warning { background-color: var(--rm-state-warning); box-shadow: 0 0 8px rgba(245,158,11,0.3); }
.rm-status-dot--error { background-color: var(--rm-state-error); box-shadow: 0 0 8px rgba(239,68,68,0.3); }
.rm-status-dot--info { background-color: var(--rm-state-info); }
.rm-status-dot--brand { background-color: var(--rm-brand); }

/* ============================================================
   全局重置
   ============================================================ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  color: var(--rm-ink);
  background-color: var(--rm-bg);
}

body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--rm-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--rm-line);
  border-radius: var(--rm-radius-full);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--rm-ink-3);
}

/* 选中文本 */
::selection {
  background-color: rgba(0,212,255,0.25);
  color: var(--rm-ink);
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
/* @theme removed for v3 compat */

    td, th { /* @apply removed */ word-break: break-all; word-break: auto-phrase; }
    th { /* @apply removed */ }
  }
.bg-background { background-color: var(--rm-background); }
      .text-background { color: var(--rm-background); }
      .border-background { border-color: var(--rm-background); }
      .ring-background { --tw-ring-color: var(--rm-background); }
      .bg-foreground { background-color: var(--rm-foreground); }
      .text-foreground { color: var(--rm-foreground); }
      .border-foreground { border-color: var(--rm-foreground); }
      .ring-foreground { --tw-ring-color: var(--rm-foreground); }
      .bg-card { background-color: var(--rm-card); }
      .text-card { color: var(--rm-card); }
      .border-card { border-color: var(--rm-card); }
      .ring-card { --tw-ring-color: var(--rm-card); }
      .bg-card-foreground { background-color: var(--rm-card-foreground); }
      .text-card-foreground { color: var(--rm-card-foreground); }
      .border-card-foreground { border-color: var(--rm-card-foreground); }
      .ring-card-foreground { --tw-ring-color: var(--rm-card-foreground); }
      .bg-popover { background-color: var(--rm-popover); }
      .text-popover { color: var(--rm-popover); }
      .border-popover { border-color: var(--rm-popover); }
      .ring-popover { --tw-ring-color: var(--rm-popover); }
      .bg-popover-foreground { background-color: var(--rm-popover-foreground); }
      .text-popover-foreground { color: var(--rm-popover-foreground); }
      .border-popover-foreground { border-color: var(--rm-popover-foreground); }
      .ring-popover-foreground { --tw-ring-color: var(--rm-popover-foreground); }
      .bg-primary { background-color: var(--rm-primary); }
      .text-primary { color: var(--rm-primary); }
      .border-primary { border-color: var(--rm-primary); }
      .ring-primary { --tw-ring-color: var(--rm-primary); }
      .bg-primary-foreground { background-color: var(--rm-primary-foreground); }
      .text-primary-foreground { color: var(--rm-primary-foreground); }
      .border-primary-foreground { border-color: var(--rm-primary-foreground); }
      .ring-primary-foreground { --tw-ring-color: var(--rm-primary-foreground); }
      .bg-muted { background-color: var(--rm-muted); }
      .text-muted { color: var(--rm-muted); }
      .border-muted { border-color: var(--rm-muted); }
      .ring-muted { --tw-ring-color: var(--rm-muted); }
      .bg-muted-foreground { background-color: var(--rm-muted-foreground); }
      .text-muted-foreground { color: var(--rm-muted-foreground); }
      .border-muted-foreground { border-color: var(--rm-muted-foreground); }
      .ring-muted-foreground { --tw-ring-color: var(--rm-muted-foreground); }
      .bg-border { background-color: var(--rm-border); }
      .text-border { color: var(--rm-border); }
      .border-border { border-color: var(--rm-border); }
      .ring-border { --tw-ring-color: var(--rm-border); }
      .bg-input { background-color: var(--rm-input); }
      .text-input { color: var(--rm-input); }
      .border-input { border-color: var(--rm-input); }
      .ring-input { --tw-ring-color: var(--rm-input); }
      .bg-ring { background-color: var(--rm-ring); }
      .text-ring { color: var(--rm-ring); }
      .border-ring { border-color: var(--rm-ring); }
      .ring-ring { --tw-ring-color: var(--rm-ring); }
.no-scrollbar::-webkit-scrollbar { display: none; }
      .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
      [data-icon] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        background-color: currentColor;
      }
/* ====== 应用框架布局：无左侧菜单，顶部通栏 + 主内容区 ====== */
    .rm-app {
      display: flex;
      flex-direction: column;
      height: 100vh;
      background-color: var(--rm-bg);
      overflow: hidden;
    }

    /* 顶部状态栏 */
    .rm-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--rm-layout-header-h);
      padding: 0 var(--rm-layout-content-padding);
      background-color: var(--rm-surface);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
      z-index: 100;
    }

    .rm-header__left {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
    }

    .rm-header__logo {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__logo-icon {
      width: 28px;
      height: 28px;
      border-radius: var(--rm-radius-sm);
      background: linear-gradient(135deg, var(--rm-brand) 0%, var(--rm-brand-active) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      font-weight: 700;
      color: var(--rm-brand-ink);
    }

    .rm-header__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-header__right {
      display: flex;
      align-items: center;
      gap: var(--rm-space-lg);
    }

    .rm-header__status {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-header__status-value {
      color: var(--rm-state-success);
      font-weight: 600;
    }

    .rm-header__actions {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid transparent;
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-header__btn:hover {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
      border-color: var(--rm-line);
    }

    .rm-header__btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    /* 主内容区 */
    .rm-body {
      flex: 1;
      overflow: hidden;
      position: relative;
    }

    .rm-content {
      width: 100%;
      height: 100%;
      overflow-y: auto;
      padding: var(--rm-layout-content-padding);
      background-color: var(--rm-bg);
    }

    .rm-content__inner {
      max-width: var(--rm-layout-max-w);
      margin: 0 auto;
      height: 100%;
    }

    /* 智能问答抽屉（左侧展开，宽度满足对话窗口） */
    .rm-ai-drawer {
      position: fixed;
      left: 0;
      top: 0;
      bottom: 0;
      width: 50vw;
      max-width: 90vw;
      background-color: var(--rm-surface);
      border-right: 1px solid var(--rm-line);
      box-shadow: var(--rm-shadow-3);
      transform: translateX(-100%);
      transition: transform 250ms cubic-bezier(.3,0,0,1);
      z-index: 150;
      display: flex;
      flex-direction: column;
    }

    .rm-ai-drawer[data-open="true"] {
      transform: translateX(0);
    }

    .rm-ai-drawer__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-ai-drawer__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    /* AI抽屉模态遮罩 */
    .rm-ai-drawer__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(2px);
      -webkit-backdrop-filter: blur(2px);
      opacity: 0;
      visibility: hidden;
      transition: opacity 250ms cubic-bezier(.3,0,0,1), visibility 250ms;
      z-index: 140;
    }
    .rm-ai-drawer__overlay[data-open="true"] {
      opacity: 1;
      visibility: visible;
    }

    /* 收起按钮：纯图标方形按钮，紧凑居中 */
    .rm-ai-drawer__close {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      padding: 0;
      border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-brand);
      background-color: transparent;
      color: var(--rm-brand);
      cursor: pointer;
      transition: background-color 150ms cubic-bezier(.2,.8,.2,1), color 150ms;
    }
    .rm-ai-drawer__close:hover {
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
    }
    .rm-ai-drawer__close svg {
      transition: transform 150ms ease;
    }
    .rm-ai-drawer__close:hover svg {
      transform: translateX(-2px);
    }

    .rm-ai-drawer__body {
      flex: 1;
      overflow-y: auto;
      padding: var(--rm-space-lg);
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-ai-drawer__footer {
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-top: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-ai-drawer__input-wrapper {
      display: flex;
      align-items: flex-end;
      gap: var(--rm-space-sm);
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      padding: var(--rm-space-sm) var(--rm-space-md);
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-ai-drawer__input-wrapper:focus-within {
      border-color: var(--rm-brand);
    }

    .rm-ai-drawer__textarea {
      flex: 1;
      background: none;
      border: none;
      outline: none;
      resize: none;
      overflow-y: auto;
      color: var(--rm-ink);
      font-family: var(--rm-font-sans);
      font-size: 14px;
      line-height: 1.5;
      min-height: 44px;
      max-height: 120px;
    }

    .rm-ai-drawer__send {
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-full);
      border: none;
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    /* 历史报表侧边抽屉 */
    .rm-history-drawer {
      position: fixed;
      right: 0;
      top: var(--rm-layout-header-h);
      bottom: 0;
      width: 520px;
      max-width: 90vw;
      background-color: var(--rm-surface);
      border-left: 1px solid var(--rm-line);
      box-shadow: var(--rm-shadow-3);
      transform: translateX(100%);
      transition: transform 250ms cubic-bezier(.3,0,0,1);
      z-index: 140;
      display: flex;
      flex-direction: column;
    }

    .rm-history-drawer[data-open="true"] {
      transform: translateX(0);
    }

    /* ====== 智能问答侧滑入口（与设备控制拉手按钮样式统一） ====== */
    .rm-qa-trigger {
      position: fixed;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      z-index: 8999;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 14px 8px;
      border: 1px solid var(--rm-line);
      border-left: none;
      border-radius: 0 10px 10px 0;
      /* 渐变背景与右侧拉手按钮保持一致 */
      background: linear-gradient(135deg, var(--rm-surface, #1a2332) 0%, var(--rm-bg-2, #0f1828) 100%);
      color: var(--rm-brand);
      cursor: pointer;
      /* 左侧拉手阴影方向镜像右侧 */
      box-shadow: 3px 0 12px rgba(0, 0, 0, 0.35);
      transition: all 200ms cubic-bezier(.2, .8, .2, 1);
    }

    .rm-qa-trigger:hover {
      /* 悬停时品牌色渐变光晕，与右侧拉手一致 */
      background: linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 212, 255, 0.04) 100%);
      border-color: var(--rm-brand);
      box-shadow: 4px 0 20px rgba(0, 212, 255, 0.2);
      padding-left: 12px;
    }

    .rm-qa-trigger svg {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      /* 脉冲动画提醒可点击，与右侧拉手共用关键帧 */
      animation: rm-fab-pulse 3s ease-in-out infinite;
      transition: transform 300ms cubic-bezier(.2, .8, .2, 1);
    }

    /* 悬停时图标缩放+轻微旋转，增强炫酷动态交互感 */
    .rm-qa-trigger:hover svg {
      transform: scale(1.15) rotate(15deg);
    }

    .rm-qa-trigger__label {
      writing-mode: vertical-rl;
      text-orientation: upright;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 2px;
      color: var(--rm-ink-2);
      line-height: 1;
      transition: color 200ms ease;
    }

    .rm-qa-trigger:hover .rm-qa-trigger__label {
      color: var(--rm-brand);
    }

    /* 抽屉打开时隐藏拉手按钮，与右侧拉手隐藏机制一致 */
    .rm-qa-trigger[data-hidden="true"] {
      opacity: 0;
      pointer-events: none;
      transform: translateY(-50%) translateX(-100%);
    }

    /* 响应式 */
    @media (max-width: 1279px) {
      .rm-header {
        padding: 0 var(--rm-space-md);
      }
      .rm-content {
        padding: var(--rm-space-md);
      }
    }

    @media (max-width: 767px) {
      .rm-header__title {
        display: none;
      }
      .rm-ai-drawer {
        width: 100vw;
        max-width: 100vw;
      }
      .rm-history-drawer {
        width: 100vw;
        max-width: 100vw;
      }
      .rm-qa-trigger {
        padding: 10px 6px;
      }
      .rm-qa-trigger__label {
        font-size: 11px;
        letter-spacing: 1px;
      }
    }

    /* ====== 区域卡片重构样式 ====== */
    .rm-region-card {
      display: grid;
      grid-template-areas:
        "header header"
        "flow trend"
        "keymetric keymetric"
        "metrics metrics"
        "devices devices";
      grid-template-columns: auto 1fr;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      cursor: pointer;
      transition: transform 150ms cubic-bezier(.2,.8,.2,1),
                  box-shadow 150ms cubic-bezier(.2,.8,.2,1),
                  border-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-region-card__header { grid-area: header; }
    .rm-region-card__flow { grid-area: flow; }
    .rm-mini-trend { grid-area: trend; }
    .rm-region-card__key-metric { grid-area: keymetric; }
    .rm-region-card__metrics { grid-area: metrics; }
    .rm-region-card__devices-data { grid-area: devices; }

    .rm-region-card:hover {
      transform: translateY(-2px);
      box-shadow: var(--rm-shadow-2);
      border-color: var(--rm-brand);
    }

    .rm-region-card__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 22px;
    }

    .rm-region-card__alerts {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      flex-wrap: wrap;
    }

    .rm-region-card__alert {
      display: inline-flex;
      align-items: center;
      padding: 2px 8px;
      border-radius: var(--rm-radius-full);
      font-size: 11px;
      font-weight: 600;
      line-height: 1.4;
    }

    .rm-region-card__alert--error {
      background-color: rgba(239, 68, 68, 0.15);
      color: var(--rm-state-error);
      border: 1px solid rgba(239, 68, 68, 0.3);
    }

    .rm-region-card__alert--warning {
      background-color: rgba(245, 158, 11, 0.15);
      color: var(--rm-state-warning);
      border: 1px solid rgba(245, 158, 11, 0.3);
    }

    .rm-region-card__header-right {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
    }

    .rm-region-card__name {
      font-size: 15px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-region-card__flow {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: var(--rm-space-sm);
    }

    .rm-region-card__flow-main {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .rm-region-card__flow-label {
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    .rm-region-card__flow-value {
      font-family: var(--rm-font-mono);
      font-size: 32px;
      font-weight: 700;
      color: var(--rm-brand);
      line-height: 1.1;
    }

    .rm-region-card__compare {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 6px;
      background-color: transparent;
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      color: var(--rm-ink-2);
      cursor: pointer;
      align-self: flex-start;
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1),
                  background-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-region-card__compare:hover {
      border-color: var(--rm-brand);
      background-color: var(--rm-surface-2);
    }

    .rm-region-card__compare-arrow {
      font-size: 9px;
      line-height: 1;
    }

    .rm-region-card__compare-value {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-region-card__compare-value--up {
      color: var(--rm-state-success);
    }

    .rm-region-card__compare-value--down {
      color: var(--rm-state-error);
    }

    .rm-region-card__compare-label {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
    }

    .rm-mini-trend {
      position: relative;
      width: 100%;
      min-width: 0;
      display: flex;
      flex-direction: column;
    }

    .rm-mini-trend__svg {
      width: 100%;
      height: 44px;
      overflow: visible;
      flex-shrink: 0;
    }

    .rm-mini-trend__labels {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 9px;
      font-family: var(--rm-font-mono);
      color: var(--rm-ink-3);
      line-height: 1;
      margin-top: 2px;
      gap: var(--rm-space-xs);
    }

    .rm-mini-trend__max {
      color: var(--rm-brand);
      font-weight: 600;
    }

    .rm-mini-trend__legend {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 10px;
      color: var(--rm-ink-3);
      margin-top: 2px;
    }

    .rm-mini-trend__legend-item {
      display: inline-flex;
      align-items: center;
      gap: 3px;
    }

    .rm-mini-trend__legend-line {
      display: inline-block;
      width: 16px;
      height: 0;
      border-top: 1px solid var(--rm-brand);
    }

    .rm-mini-trend__legend-line--ref {
      border-top: 1px dashed var(--rm-ink-2);
      opacity: 0.7;
    }

    .rm-mini-trend__legend-line--lastweek {
      border-top: 1.5px dotted var(--rm-state-info);
      opacity: 0.95;
    }

    .rm-mini-trend--empty {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-region-card__metrics--3col {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rm-space-xs);
      padding: var(--rm-space-sm);
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-sm);
    }

    .rm-region-card__metrics--3col .rm-region-card__metric {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 2px;
      padding: 0 var(--rm-space-xs);
      border-right: 1px solid var(--rm-line);
    }

    .rm-region-card__metrics--3col .rm-region-card__metric:last-child {
      border-right: none;
    }

    .rm-region-card__metric-label {
      font-size: 11px;
      color: var(--rm-ink-3);
      line-height: 1.3;
    }

    .rm-region-card__metric-value {
      font-family: var(--rm-font-mono);
      font-size: 14px;
      font-weight: 600;
      color: var(--rm-ink);
      line-height: 1.3;
    }

    .rm-region-card__metric-delta {
      font-size: 11px;
      font-weight: 600;
      line-height: 1.3;
      color: var(--rm-ink-2);
    }

    .rm-region-card__metric-delta--up {
      color: var(--rm-state-success);
    }

    .rm-region-card__metric-delta--down {
      color: var(--rm-state-error);
    }

    .rm-region-card__metric-status {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      color: var(--rm-ink-2);
    }

    .rm-region-card__metric-status .rm-status-dot {
      width: 6px;
      height: 6px;
    }

    .rm-region-card__devices-data {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding-top: var(--rm-space-xs);
      border-top: 1px solid var(--rm-line);
    }

    /* 卡片重点指标：兼顾各区域差异数据 */
    .rm-region-card__key-metric {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      padding: 4px 8px;
      background-color: var(--rm-surface-2);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      font-size: 12px;
    }

    .rm-region-card__key-label {
      color: var(--rm-ink-2);
    }

    .rm-region-card__key-value {
      margin-left: auto;
      font-weight: 700;
      color: var(--rm-brand);
    }

    .rm-region-card__key-delta {
      font-size: 11px;
      color: var(--rm-state-success);
    }

    .rm-region-card__key-delta.rm-region-card__key-delta--down {
      color: var(--rm-state-error);
    }

    /* ====== 区域详情页重构样式 ====== */
    .rm-region-detail__header {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
    }

    .rm-region-detail__status {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin-left: auto;
      padding: 4px 10px;
      background-color: var(--rm-surface-2);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-full);
      font-size: 12px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-region-detail__status .rm-status-dot {
      width: 7px;
      height: 7px;
    }

    .rm-detail-metrics {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: var(--rm-space-sm);
    }

    .rm-detail-metric {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-xs);
      padding: var(--rm-space-sm) var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      min-width: 0;
    }

    .rm-detail-metric__label {
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-detail-metric__value {
      font-family: var(--rm-font-mono);
      font-size: 24px;
      font-weight: 700;
      color: var(--rm-ink);
      line-height: 1.2;
      word-break: break-all;
    }

    .rm-detail-metric__delta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 4px;
      font-size: 12px;
      color: var(--rm-state-success);
    }

    .rm-detail-metric__delta span:first-child.rm-region-card__metric-delta--down,
    .rm-detail-metric__delta span:first-child[style*="color"] {
      color: var(--rm-state-error);
    }

    .rm-detail-metric__tag {
      padding: 2px 6px;
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-full);
      font-size: 10px;
      color: var(--rm-ink-3);
    }

    .rm-card-trend .rm-report-section {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-trend-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      flex-wrap: wrap;
    }

    .rm-trend-tabs {
      display: flex;
      align-items: center;
      gap: 4px;
      padding: 3px;
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-sm);
    }

    .rm-trend-tab {
      padding: 5px 12px;
      background-color: transparent;
      border: none;
      border-radius: var(--rm-radius-sm);
      font-size: 13px;
      font-weight: 500;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-trend-tab:hover {
      color: var(--rm-ink);
    }

    .rm-trend-tab--active {
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink) !important;
      font-weight: 600;
    }

    .rm-trend-chart {
      position: relative;
      height: 200px;
      min-height: 160px;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      overflow: hidden;
    }

    .rm-trend-chart svg {
      width: 100%;
      height: 100%;
    }

    .rm-trend-chart__point {
      cursor: pointer;
      transition: r 120ms ease;
    }

    .rm-trend-chart__point:hover {
      r: 6;
    }

    .rm-trend-chart__tooltip {
      position: absolute;
      display: none;
      padding: 6px 10px;
      background-color: var(--rm-surface-2);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      font-size: 12px;
      color: var(--rm-ink);
      pointer-events: none;
      box-shadow: var(--rm-shadow-2);
      z-index: 10;
      white-space: nowrap;
    }

    .rm-trend-legend {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    .rm-trend-legend__item {
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }

    .rm-trend-legend__line {
      width: 20px;
      height: 3px;
      border-radius: 2px;
    }

    .rm-trend-legend__line--today {
      background-color: var(--rm-brand);
    }

    .rm-trend-legend__line--yesterday {
      background-color: var(--rm-ink-2);
      background-image: linear-gradient(90deg, var(--rm-ink-2) 50%, transparent 50%);
      background-size: 8px 100%;
    }

    .rm-trend-legend__line--lastweek {
      background-color: var(--rm-state-info);
      background-image: linear-gradient(90deg, var(--rm-state-info) 50%, transparent 50%);
      background-size: 4px 100%;
    }

    .rm-insights-header {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-insights-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-insights-item {
      position: relative;
      padding-left: 16px;
      font-size: 14px;
      line-height: 1.6;
      color: var(--rm-ink);
    }

    .rm-insights-item::before {
      content: "";
      position: absolute;
      left: 0;
      top: 9px;
      width: 6px;
      height: 6px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
    }

    .rm-insights-source {
      margin-top: var(--rm-space-sm);
      font-size: 11px;
      color: var(--rm-ink-3);
    }

    .rm-device-detail-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-device-detail-item {
      display: grid;
      grid-template-columns: 1.2fr 1fr auto;
      align-items: center;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-sm) var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      font-size: 13px;
    }

    .rm-device-detail-item__name {
      display: inline-flex;
      align-items: center;
      gap: var(--rm-space-sm);
      color: var(--rm-ink);
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .rm-device-detail-item__data {
      color: var(--rm-brand);
      font-weight: 600;
    }

    .rm-device-detail-item__sync {
      color: var(--rm-ink-3);
      font-size: 12px;
      white-space: nowrap;
    }

    .rm-event-timeline {
      list-style: none;
      position: relative;
      padding-left: 0;
    }

    .rm-event-timeline::before {
      content: "";
      position: absolute;
      left: 34px;
      top: 8px;
      bottom: 8px;
      width: 1px;
      background-color: var(--rm-line);
    }

    .rm-event-timeline__item {
      position: relative;
      display: grid;
      grid-template-columns: 52px 1fr auto;
      align-items: flex-start;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-sm) 0;
      min-width: 0;
    }

    .rm-event-timeline__item::before {
      content: "";
      position: absolute;
      left: 29px;
      top: 16px;
      width: 10px;
      height: 10px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-surface);
      border: 2px solid var(--rm-brand);
      z-index: 1;
    }

    .rm-event-timeline__time {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      color: var(--rm-ink-2);
      text-align: right;
      padding-right: 18px;
    }

    .rm-event-timeline__content {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .rm-event-timeline__text {
      font-size: 13px;
      color: var(--rm-ink);
    }

    .rm-event-timeline__impact {
      font-size: 11px;
      color: var(--rm-ink-3);
    }

    .rm-event-timeline__status {
      padding: 2px 8px;
      border-radius: var(--rm-radius-full);
      font-size: 11px;
      font-weight: 600;
      white-space: nowrap;
    }

    .rm-event-timeline__status--resolved {
      background-color: rgba(16, 185, 129, 0.12);
      color: var(--rm-state-success);
    }

    .rm-event-timeline__status--pending {
      background-color: rgba(245, 158, 11, 0.12);
      color: var(--rm-state-warning);
    }

    @media (max-width: 1200px) {
      .rm-detail-metrics {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
      }
    }

    @media (max-width: 768px) {
      .rm-detail-metrics {
        grid-template-columns: 1fr;
      }
      .rm-device-detail-item {
        grid-template-columns: 1fr;
        gap: var(--rm-space-xs);
      }
      .rm-event-timeline__item {
        grid-template-columns: 44px 1fr;
        gap: var(--rm-space-sm);
      }
      .rm-event-timeline__status {
        grid-column: 2;
        justify-self: flex-start;
      }
      .rm-trend-chart {
        height: 160px;
      }
    }
/* ====== 首页主布局：左侧AI报告 + 右侧门店实况 ====== */
    .rm-home-layout {
      display: flex;
      flex-direction: row;
      gap: var(--rm-space-lg);
      height: 100%;
      min-height: 0;
    }

    .rm-ai-report {
      flex: 1.2;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
      overflow-y: auto;
    }

    .rm-store-live {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
      overflow: hidden;
    }

    /* 门店实况 Tab 切换（按钮式，居中） */
    .rm-live-tabs {
      display: flex;
      align-items: center;
      gap: 4px;
      background-color: var(--rm-bg-2, rgba(255,255,255,0.04));
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-full, 999px);
      padding: 3px;
      flex-shrink: 0;
    }

    .rm-live-tab {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 5px 16px;
      background: none;
      border: none;
      border-radius: var(--rm-radius-full, 999px);
      color: var(--rm-ink-2);
      font-family: var(--rm-font-sans);
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      transition: all 200ms cubic-bezier(.2,.8,.2,1);
      white-space: nowrap;
    }

    .rm-live-tab svg {
      flex-shrink: 0;
    }

    .rm-live-tab:hover {
      color: var(--rm-ink);
    }

    .rm-live-tab[data-active="true"] {
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink, #0f1419);
      font-weight: 600;
    }

    /* 面板容器：填满剩余空间，无滚动条 */
    .rm-live-panel {
      display: none;
      flex: 1;
      min-height: 0;
      flex-direction: column;
      gap: var(--rm-space-md);
      overflow: hidden;
    }

    .rm-live-panel[data-active="true"] {
      display: flex;
    }

    /* 视频网格：自适应列数，16:9 比例卡片 */
    .rm-video-grid {
      display: grid;
      grid-template-columns: repeat(var(--rm-video-cols, 3), 1fr);
      grid-auto-rows: min-content;
      align-content: start;
      gap: var(--rm-space-md);
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 4px 2px;
      margin: -4px -2px;
    }

    .rm-video-tile {
      position: relative;
      width: 100%;
      aspect-ratio: 16 / 9;
      border-radius: var(--rm-radius-md);
      border: 1px solid var(--rm-line);
      background-color: #0f172a;
      overflow: hidden;
      cursor: pointer;
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1),
                  box-shadow 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-video-tile:hover {
      border-color: var(--rm-brand);
      box-shadow: var(--rm-shadow-2);
    }

    /* 全屏按钮 */
    .rm-video-tile__fullscreen {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 3;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: var(--rm-radius-sm);
      border: none;
      background-color: rgba(0, 0, 0, 0.5);
      color: rgba(255, 255, 255, 0.8);
      cursor: pointer;
      opacity: 0;
      transition: opacity 150ms ease, background-color 150ms ease;
    }

    .rm-video-tile:hover .rm-video-tile__fullscreen {
      opacity: 1;
    }

    .rm-video-tile__fullscreen:hover {
      background-color: rgba(0, 212, 255, 0.3);
      color: #fff;
    }

    /* 全屏覆盖层 */
    .rm-video-fullscreen-layer {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9999;
      background-color: #000;
      align-items: center;
      justify-content: center;
      padding: var(--rm-space-lg);
    }

    .rm-video-fullscreen-layer[data-active="true"] {
      display: flex;
    }

    .rm-video-fullscreen-layer__inner {
      position: relative;
      width: 100%;
      height: 100%;
      max-width: 100vw;
      max-height: 100vh;
      aspect-ratio: 16 / 9;
      margin: auto;
    }

    .rm-video-fullscreen-layer__close {
      position: absolute;
      top: 16px;
      right: 16px;
      z-index: 10;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      border-radius: var(--rm-radius-full, 999px);
      border: none;
      background-color: rgba(255, 255, 255, 0.15);
      color: #fff;
      cursor: pointer;
      transition: background-color 150ms ease;
    }

    .rm-video-fullscreen-layer__close:hover {
      background-color: rgba(239, 68, 68, 0.6);
    }

    .rm-video-tile__stream {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    }

    .rm-video-tile__placeholder {
      color: rgba(148, 163, 184, 0.5);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* 扫描线动画：模拟实时视频效果 */
    .rm-video-tile__scanline {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(0, 212, 255, 0.4), transparent);
      animation: rm-scanline 3s linear infinite;
    }

    @keyframes rm-scanline {
      0% { top: 0; opacity: 0; }
      10% { opacity: 1; }
      90% { opacity: 1; }
      100% { top: 100%; opacity: 0; }
    }

    .rm-video-tile__overlay {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: var(--rm-space-sm) var(--rm-space-md);
      background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
      z-index: 2;
    }

    .rm-video-tile__info {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .rm-video-tile__name {
      font-size: 13px;
      font-weight: 600;
      color: #f1f5f9;
    }

    .rm-video-tile__region {
      font-size: 11px;
      color: rgba(148, 163, 184, 0.9);
    }

    .rm-video-tile__live {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      font-weight: 600;
      color: #4ade80;
      font-family: var(--rm-font-mono);
      letter-spacing: 0.5px;
    }

    /* ====== 设备控制浮动拉手按钮 ====== */
    .rm-device-fab {
      position: fixed;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      z-index: 8999;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 14px 8px;
      border: 1px solid var(--rm-line);
      border-right: none;
      border-radius: 10px 0 0 10px;
      background: linear-gradient(135deg, var(--rm-surface, #1a2332) 0%, var(--rm-bg-2, #0f1828) 100%);
      color: var(--rm-brand);
      cursor: pointer;
      box-shadow: -3px 0 12px rgba(0, 0, 0, 0.35);
      transition: all 200ms cubic-bezier(.2, .8, .2, 1);
    }

    .rm-device-fab:hover {
      background: linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 212, 255, 0.04) 100%);
      border-color: var(--rm-brand);
      box-shadow: -4px 0 20px rgba(0, 212, 255, 0.2);
      padding-right: 12px;
    }

    .rm-device-fab svg {
      flex-shrink: 0;
      animation: rm-fab-pulse 3s ease-in-out infinite;
      transition: transform 300ms cubic-bezier(.2, .8, .2, 1);
    }

    /* 悬停时图标缩放+轻微旋转（与左侧拉手镜像对称） */
    .rm-device-fab:hover svg {
      transform: scale(1.15) rotate(-15deg);
    }

    /* 拉手按钮脉冲动画，提醒用户可点击 */
    @keyframes rm-fab-pulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.55; }
    }

    .rm-device-fab__label {
      writing-mode: vertical-rl;
      text-orientation: upright;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 2px;
      color: var(--rm-ink-2);
      line-height: 1;
    }

    .rm-device-fab:hover .rm-device-fab__label {
      color: var(--rm-brand);
    }

    /* 抽屉打开时隐藏拉手按钮 */
    .rm-device-fab[data-hidden="true"] {
      opacity: 0;
      pointer-events: none;
      transform: translateY(-50%) translateX(100%);
    }

    /* ====== 设备控制抽屉 ====== */
    .rm-device-drawer__overlay {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.5);
      z-index: 9000;
      opacity: 0;
      pointer-events: none;
      transition: opacity 200ms ease;
    }

    .rm-device-drawer__overlay[data-active="true"] {
      opacity: 1;
      pointer-events: auto;
    }

    .rm-device-drawer {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      width: 460px;
      max-width: 92vw;
      background-color: var(--rm-surface, #1a2332);
      border-left: 1px solid var(--rm-line);
      box-shadow: -4px 0 24px rgba(0, 0, 0, 0.3);
      z-index: 9001;
      display: flex;
      flex-direction: column;
      transform: translateX(100%);
      transition: transform 300ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-device-drawer[data-active="true"] {
      transform: translateX(0);
    }

    .rm-device-drawer__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-device-drawer__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-device-drawer__title svg {
      color: var(--rm-brand);
    }

    .rm-device-drawer__close {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line);
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms ease;
    }

    .rm-device-drawer__close:hover {
      border-color: var(--rm-state-error);
      color: var(--rm-state-error);
    }

    .rm-device-drawer__body {
      flex: 1;
      overflow-y: auto;
      padding: var(--rm-space-md) var(--rm-space-lg);
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    /* 设备分组 */
    .rm-device-group {
      display: flex;
      flex-direction: column;
      gap: 2px;
      padding: var(--rm-space-sm) 0;
    }

    .rm-device-group--master {
      background-color: rgba(0, 212, 255, 0.04);
      border: 1px solid rgba(0, 212, 255, 0.15);
      border-radius: var(--rm-radius-md);
      padding: var(--rm-space-sm) var(--rm-space-md);
    }

    .rm-device-group__header {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: var(--rm-space-xs) 0;
      color: var(--rm-ink-2);
    }

    .rm-device-group__header svg {
      color: var(--rm-ink-3);
    }

    .rm-device-group__title {
      font-size: 12px;
      font-weight: 600;
      color: var(--rm-ink-3);
      text-transform: uppercase;
      letter-spacing: 0.5px;
    }

    /* 设备控制行 */
    .rm-device-control {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      padding: 10px 0;
      border-bottom: 1px solid var(--rm-line);
    }

    .rm-device-control:last-child {
      border-bottom: none;
    }

    .rm-device-control--slider {
      flex-direction: column;
      align-items: stretch;
      gap: var(--rm-space-sm);
    }

    .rm-device-control__info {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      flex: 1;
      min-width: 0;
    }

    .rm-device-control__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-sm);
      background-color: var(--rm-bg-2, rgba(255,255,255,0.04));
      color: var(--rm-ink-2);
      flex-shrink: 0;
    }

    .rm-device-control__icon--master {
      background-color: rgba(0, 212, 255, 0.1);
      color: var(--rm-brand);
    }

    .rm-device-control__text {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
    }

    .rm-device-control__name {
      font-size: 14px;
      font-weight: 500;
      color: var(--rm-ink);
    }

    .rm-device-control__desc {
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-device-control__status {
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    .rm-device-control__status--error {
      color: var(--rm-state-error);
      font-weight: 500;
    }

    .rm-device-control__status--warning {
      color: var(--rm-state-warning, #f59e0b);
      font-weight: 500;
    }

    /* 开关组件 */
    .rm-switch {
      position: relative;
      display: inline-block;
      cursor: pointer;
      flex-shrink: 0;
    }

    .rm-switch input {
      opacity: 0;
      position: absolute;
      width: 0;
      height: 0;
    }

    .rm-switch__track {
      display: flex;
      align-items: center;
      width: 44px;
      height: 24px;
      border-radius: 12px;
      background-color: var(--rm-line);
      transition: background-color 200ms cubic-bezier(.2,.8,.2,1);
      padding: 2px;
    }

    .rm-switch__thumb {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background-color: #fff;
      box-shadow: 0 1px 3px rgba(0,0,0,0.2);
      transition: transform 200ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-switch input:checked + .rm-switch__track {
      background-color: var(--rm-brand);
    }

    .rm-switch input:checked + .rm-switch__track .rm-switch__thumb {
      transform: translateX(20px);
    }

    .rm-switch--large .rm-switch__track {
      width: 52px;
      height: 28px;
      border-radius: 14px;
    }

    .rm-switch--large .rm-switch__thumb {
      width: 24px;
      height: 24px;
    }

    .rm-switch--large input:checked + .rm-switch__track .rm-switch__thumb {
      transform: translateX(24px);
    }

    /* 温度滑块 */
    .rm-device-slider {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .rm-device-slider input[type="range"] {
      width: 100%;
      height: 6px;
      border-radius: 3px;
      background: var(--rm-line);
      -webkit-appearance: none;
      appearance: none;
      outline: none;
    }

    .rm-device-slider input[type="range"]::-webkit-slider-thumb {
      -webkit-appearance: none;
      appearance: none;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--rm-brand);
      cursor: pointer;
      border: 2px solid #fff;
      box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    }

    .rm-device-slider input[type="range"]::-moz-range-thumb {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--rm-brand);
      cursor: pointer;
      border: 2px solid #fff;
    }

    .rm-device-slider__labels {
      display: flex;
      justify-content: space-between;
      font-size: 11px;
      color: var(--rm-ink-3);
    }

    /* ====== 设备控制面板增强样式 ====== */

    /* 场景模式按钮容器（2列网格） */
    .rm-device-scenes {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin-bottom: 4px;
    }

    /* 场景按钮 */
    .rm-device-scene {
      padding: 10px 12px;
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      background-color: transparent;
      color: var(--rm-ink-2);
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      transition: all 150ms ease;
      text-align: center;
    }

    .rm-device-scene:hover {
      border-color: var(--rm-brand);
      color: var(--rm-ink);
    }

    /* 激活场景按钮 */
    .rm-device-scene--active {
      border-color: var(--rm-brand);
      background-color: rgba(0, 212, 255, 0.1);
      color: var(--rm-brand);
    }

    /* 危险场景按钮（全部关闭，红色边框） */
    .rm-device-scene--danger {
      border-color: rgba(248, 113, 113, 0.3);
      color: var(--rm-state-error);
    }

    .rm-device-scene--danger:hover {
      border-color: var(--rm-state-error);
      background-color: rgba(248, 113, 113, 0.08);
    }

    .rm-device-scene--danger.rm-device-scene--active {
      border-color: var(--rm-state-error);
      background-color: rgba(248, 113, 113, 0.12);
      color: var(--rm-state-error);
    }

    /* 可折叠组标题增强 */
    .rm-device-group__header {
      cursor: pointer;
      user-select: none;
    }

    .rm-device-group__header:hover {
      color: var(--rm-ink);
    }

    /* 组开启数量统计 */
    .rm-device-group__count {
      margin-left: auto;
      font-size: 11px;
      color: var(--rm-ink-3);
      font-family: var(--rm-font-mono);
      letter-spacing: 0.3px;
    }

    /* 展开箭头（旋转动画） */
    .rm-device-group__arrow {
      color: var(--rm-ink-3);
      transition: transform 200ms ease;
      flex-shrink: 0;
    }

    .rm-device-group--collapsed .rm-device-group__arrow {
      transform: rotate(-90deg);
    }

    /* 组内容容器 */
    .rm-device-group__body {
      display: flex;
      flex-direction: column;
    }

    /* 收起状态隐藏内容 */
    .rm-device-group--collapsed .rm-device-group__body {
      display: none;
    }

    /* 可展开设备行（纵向排列行+展开区） */
    .rm-device-control--expandable {
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      padding: 0;
    }

    /* 设备行（toggle行） */
    .rm-device-control__row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      padding: 10px 0;
    }

    /* 展开内容区域 */
    .rm-device-control__expand {
      padding: 0 0 10px 44px;
    }

    /* 模式/风速按钮容器 */
    .rm-device-modes {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 10px;
    }

    .rm-device-modes__label {
      font-size: 12px;
      color: var(--rm-ink-3);
      margin-right: 4px;
    }

    /* 模式按钮 */
    .rm-device-mode {
      padding: 4px 12px;
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      background-color: transparent;
      color: var(--rm-ink-2);
      font-size: 12px;
      cursor: pointer;
      transition: all 150ms ease;
    }

    .rm-device-mode:hover {
      border-color: var(--rm-brand);
      color: var(--rm-ink);
    }

    /* 激活模式按钮 */
    .rm-device-mode--active {
      border-color: var(--rm-brand);
      background-color: rgba(0, 212, 255, 0.1);
      color: var(--rm-brand);
    }

    /* 滑块标题行（标签+当前值） */
    .rm-device-slider__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 6px;
    }

    .rm-device-slider__header span:first-child {
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    /* 滑块当前值 */
    .rm-device-slider__value {
      font-size: 13px;
      font-weight: 600;
      color: var(--rm-brand);
      font-family: var(--rm-font-mono);
    }

    /* 禁用状态（主电源关闭时） */
    .rm-device-control--disabled {
      opacity: 0.35;
      pointer-events: none;
    }

    /* 确认对话框遮罩 */
    .rm-device-confirm {
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.6);
      z-index: 9100;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transition: opacity 200ms ease;
    }

    .rm-device-confirm[data-active="true"] {
      opacity: 1;
      pointer-events: auto;
    }

    /* 对话框 */
    .rm-device-confirm__dialog {
      width: 320px;
      max-width: 90vw;
      background-color: var(--rm-surface, #1a2332);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      padding: 20px;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    }

    .rm-device-confirm__msg {
      font-size: 14px;
      color: var(--rm-ink);
      line-height: 1.6;
      margin-bottom: 18px;
    }

    .rm-device-confirm__actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
    }

    .rm-device-confirm__btn {
      padding: 6px 16px;
      border-radius: var(--rm-radius-sm);
      font-size: 13px;
      cursor: pointer;
      transition: all 150ms ease;
      border: 1px solid var(--rm-line);
    }

    .rm-device-confirm__btn--cancel {
      background-color: transparent;
      color: var(--rm-ink-2);
    }

    .rm-device-confirm__btn--cancel:hover {
      color: var(--rm-ink);
      border-color: var(--rm-ink-3);
    }

    .rm-device-confirm__btn--ok {
      background-color: var(--rm-brand);
      border-color: var(--rm-brand);
      color: #0a1929;
      font-weight: 600;
    }

    .rm-device-confirm__btn--ok:hover {
      filter: brightness(1.1);
    }

    /* Toast提示（抽屉底部浮动） */
    .rm-device-toast {
      position: absolute;
      bottom: 16px;
      left: 50%;
      transform: translateX(-50%) translateY(20px);
      padding: 8px 16px;
      background-color: rgba(15, 23, 42, 0.92);
      border-left: 3px solid var(--rm-brand);
      border-radius: var(--rm-radius-sm);
      color: var(--rm-ink);
      font-size: 12px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 200ms ease, transform 200ms ease;
      z-index: 10;
    }

    /* Toast显示状态 */
    .rm-device-toast--show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

    /* 报告 Tab 切换 */
    .rm-report-tabs {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-report-tab {
      position: relative;
      padding: var(--rm-space-sm) 0;
      background: none;
      border: none;
      color: var(--rm-ink-2);
      font-family: var(--rm-font-sans);
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      transition: color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-report-tab:hover {
      color: var(--rm-ink);
    }

    .rm-report-tab[data-active="true"] {
      color: var(--rm-brand);
      font-weight: 600;
    }

    .rm-report-tab[data-active="true"]::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: -1px;
      height: 2px;
      background-color: var(--rm-brand);
      border-radius: 2px 2px 0 0;
    }

    /* 报告内容面板 */
    .rm-report-panels {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
    }

    .rm-report-panel {
      display: none;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-report-panel[data-active="true"] {
      display: flex;
    }

    .rm-report-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
    }

    .rm-report-header__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-report-header__date {
      color: var(--rm-ink-2);
      font-size: 13px;
    }

    .rm-report-section {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-report-section__title {
      font-size: 14px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-bullet-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-bullet-list li {
      position: relative;
      padding-left: 18px;
      color: var(--rm-ink-2);
      font-size: 14px;
      line-height: 1.6;
    }

    .rm-bullet-list li::before {
      content: "";
      position: absolute;
      left: 0;
      top: 9px;
      width: 6px;
      height: 6px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
    }

    .rm-security-card {
      border-left: 3px solid var(--rm-state-warning);
    }

    .rm-security-card p {
      color: var(--rm-ink-2);
      font-size: 14px;
      line-height: 1.6;
    }

    .rm-security-card p + p {
      margin-top: var(--rm-space-sm);
    }

    /* 数据对比卡片 */
    .rm-compare-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: var(--rm-space-md);
    }

    .rm-compare-card {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-xs);
    }

    .rm-compare-card__label {
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-compare-card__value {
      display: flex;
      align-items: baseline;
      gap: var(--rm-space-sm);
    }

    .rm-compare-card__number {
      font-family: var(--rm-font-mono);
      font-size: 24px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-compare-card__delta {
      display: inline-flex;
      align-items: center;
      gap: 2px;
      font-size: 13px;
      font-weight: 600;
      color: var(--rm-state-success);
    }

    .rm-compare-card__delta svg {
      width: 12px;
      height: 12px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2.5;
    }

    /* AI 分析段落 */
    .rm-ai-analysis {
      border: 1px solid var(--rm-line);
    }

    .rm-ai-analysis p {
      color: var(--rm-ink-2);
      font-size: 15px;
      line-height: 1.7;
    }

    /* 数据表格 */
    .rm-data-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 14px;
    }

    .rm-data-table th,
    .rm-data-table td {
      padding: var(--rm-space-sm) var(--rm-space-md);
      text-align: left;
      border-bottom: 1px solid var(--rm-line);
    }

    .rm-data-table th {
      color: var(--rm-ink-2);
      font-weight: 500;
      background-color: var(--rm-surface-2);
    }

    .rm-data-table td {
      color: var(--rm-ink);
    }

    .rm-data-table__delta {
      color: var(--rm-state-success);
      font-weight: 600;
    }

    /* 建议标签 */
    .rm-suggestion-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-suggestion-list li {
      display: flex;
      align-items: flex-start;
      gap: var(--rm-space-sm);
      color: var(--rm-ink-2);
      font-size: 14px;
      line-height: 1.6;
    }

    .rm-priority-tag {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 2px 8px;
      border-radius: var(--rm-radius-sm);
      font-size: 12px;
      font-weight: 600;
      flex-shrink: 0;
    }

    .rm-priority-tag--high {
      background-color: rgba(239, 68, 68, 0.15);
      color: var(--rm-state-error);
    }

    .rm-priority-tag--medium {
      background-color: rgba(245, 158, 11, 0.15);
      color: var(--rm-state-warning);
    }

    .rm-priority-tag--low {
      background-color: rgba(16, 185, 129, 0.15);
      color: var(--rm-state-success);
    }

    /* 待处理事项 */
    .rm-todo-card {
      flex-shrink: 0;
    }

    .rm-todo-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: var(--rm-space-md);
    }

    .rm-todo-header__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 22px;
      height: 22px;
      padding: 0 6px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      font-size: 12px;
      font-weight: 700;
    }

    .rm-todo-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-todo-item {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
      padding: var(--rm-space-sm) 0;
      border-bottom: 1px solid var(--rm-line);
    }

    .rm-todo-item:last-child {
      border-bottom: none;
    }

    .rm-todo-item__bar {
      width: 3px;
      height: 36px;
      border-radius: 2px;
      flex-shrink: 0;
    }

    .rm-todo-item__bar--high { background-color: var(--rm-state-error); }
    .rm-todo-item__bar--medium { background-color: var(--rm-state-warning); }
    .rm-todo-item__bar--low { background-color: var(--rm-state-success); }

    .rm-todo-item__content {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .rm-todo-item__desc {
      color: var(--rm-ink);
      font-size: 14px;
      font-weight: 500;
    }

    .rm-todo-item__meta {
      color: var(--rm-ink-3);
      font-size: 12px;
    }

    .rm-todo-item__action {
      flex-shrink: 0;
    }

    /* 门店实况 */
    .rm-live-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      flex-shrink: 0;
    }

    .rm-live-header__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 18px;
      font-weight: 600;
      color: var(--rm-ink);
      flex-shrink: 0;
    }

    .rm-live-header__actions {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      flex-shrink: 0;
    }

    .rm-live-header__clock {
      color: var(--rm-ink-2);
      font-size: 14px;
      font-family: var(--rm-font-mono);
    }

    .rm-live-header__icon-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line);
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-live-header__icon-btn:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
    }

    .rm-live-header__icon-btn svg {
      width: 16px;
      height: 16px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    /* 区域卡片网格：自适应列数，无滚动条 */
    .rm-region-grid {
      display: grid;
      grid-template-columns: repeat(var(--rm-grid-cols, 2), 1fr);
      grid-auto-rows: 1fr;
      gap: var(--rm-space-md);
      flex: 1;
      min-height: 0;
      /* 为卡片 hover 上移与阴影留出空间，避免首行上沿被裁剪；负 margin 抵消保持布局 */
      padding: 4px 2px;
      margin: -4px -2px;
      overflow: hidden;
    }

    .rm-region-card {
      display: grid;
      grid-template-areas:
        "header header"
        "flow trend"
        "keymetric keymetric"
        "metrics metrics"
        "devices devices";
      grid-template-columns: auto 1fr;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      cursor: pointer;
      min-height: 0;
      overflow: hidden;
      transition: transform 150ms cubic-bezier(.2,.8,.2,1),
                  box-shadow 150ms cubic-bezier(.2,.8,.2,1),
                  border-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-region-card:hover {
      transform: translateY(-2px);
      box-shadow: var(--rm-shadow-2);
      border-color: var(--rm-brand);
    }

    .rm-region-card__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .rm-region-card__name {
      font-size: 15px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-region-card__flow {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 2px;
      min-width: 80px;
    }

    .rm-region-card__flow-label {
      font-size: 11px;
      color: var(--rm-ink-2);
      white-space: nowrap;
    }

    .rm-region-card__flow-value {
      font-family: var(--rm-font-mono);
      font-size: 30px;
      font-weight: 700;
      color: var(--rm-brand);
      line-height: 1.1;
    }

    .rm-mini-trend {
      align-self: stretch;
      min-width: 0;
      justify-content: center;
    }

    .rm-region-card__metrics {
      display: flex;
      flex-wrap: wrap;
      gap: var(--rm-space-sm);
    }

    .rm-region-card__metric {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    .rm-region-card__metric svg {
      width: 14px;
      height: 14px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    .rm-region-card__footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: auto;
      padding-top: var(--rm-space-sm);
      border-top: 1px solid var(--rm-line);
    }

    .rm-region-card__devices {
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    /* 区域展开态 */
    .rm-region-detail {
      display: none;
      flex-direction: column;
      gap: var(--rm-space-md);
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 4px 2px;
      margin: -4px -2px;
    }

    .rm-region-detail[data-active="true"] {
      display: flex;
    }

    .rm-region-detail__header {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
    }

    .rm-region-detail__back {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line);
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-region-detail__back:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
    }

    .rm-region-detail__back svg {
      width: 16px;
      height: 16px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    .rm-region-detail__title {
      font-size: 18px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-region-detail__hero {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: var(--rm-space-md);
    }

    .rm-region-detail__metric {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-xs);
      padding: var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
    }

    .rm-region-detail__metric-label {
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-region-detail__metric-value {
      font-family: var(--rm-font-mono);
      font-size: 32px;
      font-weight: 700;
      color: var(--rm-ink);
    }

    .rm-region-detail__metric-sub {
      font-size: 12px;
      color: var(--rm-state-success);
    }

    /* 迷你柱状图 */
    .rm-mini-chart {
      display: flex;
      align-items: flex-end;
      gap: 4px;
      height: 40px;
    }

    .rm-mini-chart__bar {
      flex: 1;
      border-radius: 2px 2px 0 0;
      background-color: var(--rm-brand);
      opacity: 0.7;
    }

    .rm-mini-chart__bar:nth-child(odd) {
      opacity: 0.9;
    }

    /* 温湿度曲线示意 */
    .rm-temp-curve {
      height: 80px;
      padding: var(--rm-space-sm);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      position: relative;
      overflow: hidden;
    }

    .rm-temp-curve svg {
      width: 100%;
      height: 100%;
    }

    /* 设备列表 */
    .rm-device-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-device-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: var(--rm-space-sm) var(--rm-space-md);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
    }

    .rm-device-item__name {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 14px;
      color: var(--rm-ink);
    }

    .rm-device-item__status {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      font-size: 12px;
      color: var(--rm-ink-2);
    }

    /* 时间轴 */
    .rm-timeline {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
      position: relative;
      padding-left: 16px;
    }

    .rm-timeline::before {
      content: "";
      position: absolute;
      left: 5px;
      top: 6px;
      bottom: 6px;
      width: 2px;
      background-color: var(--rm-line);
    }

    .rm-timeline__item {
      position: relative;
      padding-left: var(--rm-space-md);
    }

    .rm-timeline__item::before {
      content: "";
      position: absolute;
      left: -11px;
      top: 5px;
      width: 8px;
      height: 8px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
    }

    .rm-timeline__time {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-timeline__text {
      font-size: 13px;
      color: var(--rm-ink-2);
      line-height: 1.5;
    }

    /* AI 对话气泡 */
    .rm-chat-message {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-xs);
      max-width: 85%;
    }

    .rm-chat-message--user {
      align-self: flex-end;
    }

    .rm-chat-message--ai {
      align-self: flex-start;
    }

    .rm-chat-message__bubble {
      padding: var(--rm-space-sm) var(--rm-space-md);
      border-radius: var(--rm-radius-md);
      font-size: 14px;
      line-height: 1.6;
    }

    .rm-chat-message--user .rm-chat-message__bubble {
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      border-bottom-right-radius: var(--rm-radius-sm);
    }

    .rm-chat-message--ai .rm-chat-message__bubble {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
      border: 1px solid var(--rm-brand);
      border-bottom-left-radius: var(--rm-radius-sm);
    }

    .rm-chat-message__time {
      font-size: 11px;
      color: var(--rm-ink-3);
    }

    .rm-chat-suggestions {
      display: flex;
      flex-wrap: wrap;
      gap: var(--rm-space-sm);
      margin-top: var(--rm-space-sm);
    }

    .rm-chat-suggestion {
      padding: var(--rm-space-xs) var(--rm-space-sm);
      border-radius: var(--rm-radius-full);
      border: 1px solid var(--rm-line);
      background-color: transparent;
      color: var(--rm-ink-2);
      font-size: 13px;
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-chat-suggestion:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
    }

    /* 历史报表抽屉内容 */
    .rm-history-header {
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-history-list {
      flex: 1;
      overflow-y: auto;
      padding: var(--rm-space-md) var(--rm-space-lg);
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-history-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: var(--rm-space-md);
      background-color: var(--rm-surface-2);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      cursor: pointer;
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-history-item:hover {
      border-color: var(--rm-brand);
    }

    .rm-history-item__title {
      font-size: 14px;
      font-weight: 500;
      color: var(--rm-ink);
    }

    .rm-history-item__date {
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    /* 响应式：MD以下改为上下堆叠，左侧在上 */
    @media (max-width: 1023px) {
      .rm-home-layout {
        flex-direction: column;
      }

      .rm-ai-report,
      .rm-store-live {
        flex: none;
        width: 100%;
        overflow: visible;
      }

      .rm-live-panel {
        overflow: visible;
        flex: none;
      }

      .rm-region-grid {
        grid-template-columns: repeat(var(--rm-grid-cols, 2), 1fr);
      }

      .rm-video-grid {
        min-height: 400px;
      }
    }

    @media (max-width: 767px) {
      .rm-compare-grid,
      .rm-region-detail__hero {
        grid-template-columns: 1fr;
      }
    }
/* 可拖拽分栏：AI 报告 25%（1 份），门店实况 75%（3 份） */
    .rm-home-layout {
      gap: 0;
    }

    .rm-ai-report {
      flex: none;
      width: 25%;
      min-width: 280px;
      max-width: 60%;
      overflow: hidden;
      padding-right: var(--rm-space-sm);
    }

    .rm-store-live {
      flex: 1;
      min-width: 0;
      overflow: hidden;
      padding-left: var(--rm-space-sm);
    }

    .rm-divider {
      width: 10px;
      flex-shrink: 0;
      cursor: col-resize;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      z-index: 5;
    }

    .rm-divider::after {
      content: "";
      width: 2px;
      height: 48px;
      border-radius: 1px;
      background-color: var(--rm-line);
      transition: background-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-divider:hover::after,
    .rm-divider:active::after {
      background-color: var(--rm-brand);
    }

    /* 左侧 AI 报告大卡片 */
    .rm-ai-report-card {
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      overflow: hidden;
      padding: 0;
    }

    .rm-ai-report-card__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-ai-report-card__title {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-ai-report-card__date {
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    /* 时间流式混排 */
    .rm-feed {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: var(--rm-space-md) var(--rm-space-lg);
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-feed-item {
      position: relative;
      padding-left: var(--rm-space-lg);
      border-left: 2px solid var(--rm-line);
    }

    .rm-feed-item::before {
      content: "";
      position: absolute;
      left: -5px;
      top: 4px;
      width: 8px;
      height: 8px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
      border: 2px solid var(--rm-surface);
    }

    .rm-feed-item--alert::before {
      background-color: var(--rm-state-error);
    }

    .rm-feed-item__meta {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      margin-bottom: var(--rm-space-xs);
    }

    .rm-feed-item__time {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-feed-item__badge {
      display: inline-flex;
      align-items: center;
      padding: 2px 8px;
      border-radius: var(--rm-radius-sm);
      font-size: 11px;
      font-weight: 600;
    }

    .rm-feed-item__badge--morning {
      background-color: rgba(0, 212, 255, 0.12);
      color: var(--rm-brand);
    }

    .rm-feed-item__badge--noon {
      background-color: rgba(245, 158, 11, 0.12);
      color: var(--rm-state-warning);
    }

    .rm-feed-item__badge--evening {
      background-color: rgba(139, 92, 246, 0.12);
      color: var(--rm-state-info);
    }

    .rm-feed-item__badge--alert {
      background-color: rgba(239, 68, 68, 0.15);
      color: var(--rm-state-error);
    }

    .rm-feed-item__badge--advice {
      background-color: rgba(16, 185, 129, 0.15);
      color: var(--rm-state-success);
    }

    .rm-feed-item__title {
      font-size: 15px;
      font-weight: 600;
      color: var(--rm-ink);
      margin-bottom: var(--rm-space-sm);
    }

    /* 报告卡片：概要/详细模式切换 */
    .rm-feed-item__head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: var(--rm-space-sm);
    }
    .rm-feed-item__head .rm-feed-item__title { margin-bottom: 0; }
    .rm-feed-item__toggle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 28px;
      height: 28px;
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: border-color 150ms ease, color 150ms ease;
    }
    .rm-feed-item__toggle:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
    }
    .rm-feed-item__toggle svg {
      width: 16px;
      height: 16px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      transition: transform 200ms ease;
    }
    .rm-feed-item[data-expanded="true"] .rm-feed-item__toggle svg {
      transform: rotate(180deg);
    }
    /* 概要模式：显示 summary，隐藏 detail */
    .rm-feed-item:not([data-expanded="true"]) .rm-feed-item__detail { display: none; }
    .rm-feed-item:not([data-expanded="true"]) .rm-feed-item__summary { display: block; }
    /* 详细模式：显示 detail，隐藏 summary */
    .rm-feed-item[data-expanded="true"] .rm-feed-item__summary { display: none; }
    .rm-feed-item[data-expanded="true"] .rm-feed-item__detail { display: block; }
    .rm-feed-item__summary {
      font-size: 14px;
      color: var(--rm-ink-2);
      line-height: 1.6;
    }

    .rm-feed-item__content {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-feed-section__title {
      font-size: 13px;
      font-weight: 600;
      color: var(--rm-ink-2);
      margin-bottom: var(--rm-space-xs);
    }

    .rm-feed-section p {
      color: var(--rm-ink-2);
      font-size: 14px;
      line-height: 1.6;
    }

    .rm-feed-section p + p {
      margin-top: var(--rm-space-sm);
    }

    /* 时间流内部紧凑对比网格 */
    .rm-compare-grid--compact {
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rm-space-sm);
    }

    .rm-compare-grid--compact .rm-compare-card__number {
      font-size: 18px;
    }

    .rm-compare-grid--compact .rm-compare-card__delta {
      font-size: 12px;
    }

    /* 嵌入大卡片内的待处理事项 */
    .rm-ai-report-card .rm-todo-card {
      border-top: 1px solid var(--rm-line);
      border-radius: 0;
      background-color: transparent;
      border-left: none;
      border-right: none;
      border-bottom: none;
      flex-shrink: 0;
      padding: var(--rm-space-md) var(--rm-space-lg);
    }

    /* ====== AI 建议卡片（时间流内嵌） ====== */

    /* 时间线优先级圆点 */
    .rm-feed-item--advice-high::before { background-color: var(--rm-state-error); }
    .rm-feed-item--advice-medium::before { background-color: var(--rm-state-warning); }
    .rm-feed-item--advice-low::before { background-color: var(--rm-brand); }

    /* feed-item__head 在建议卡片中：标题 + ID 右对齐 */
    .rm-feed-item--advice-high .rm-feed-item__head,
    .rm-feed-item--advice-medium .rm-feed-item__head,
    .rm-feed-item--advice-low .rm-feed-item__head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: var(--rm-space-sm);
    }

    .rm-feed-item--advice-high .rm-feed-item__title,
    .rm-feed-item--advice-medium .rm-feed-item__title,
    .rm-feed-item--advice-low .rm-feed-item__title {
      font-size: 15px;
      font-weight: 600;
      color: var(--rm-ink);
      margin-bottom: 0;
      flex: 1;
      min-width: 0;
    }

    /* 优先级标签 */
    .rm-advice-priority {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px var(--rm-space-sm);
      border-radius: var(--rm-radius-full);
      font-size: 11px;
      font-weight: 600;
      font-family: var(--rm-font-sans);
    }
    .rm-advice-priority--high { background-color: rgba(239,68,68,0.15); color: var(--rm-state-error); }
    .rm-advice-priority--medium { background-color: rgba(245,158,11,0.15); color: var(--rm-state-warning); }
    .rm-advice-priority--low { background-color: rgba(0,212,255,0.15); color: var(--rm-brand); }

    /* 建议编号 */
    .rm-advice-card__id {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      color: var(--rm-ink-3);
      flex-shrink: 0;
    }

    /* AI 解读区 */
    .rm-advice-insight {
      background-color: rgba(0,212,255,0.04);
      border: 1px solid rgba(0,212,255,0.18);
      border-radius: var(--rm-radius-sm);
      padding: var(--rm-space-md);
      display: flex;
      gap: var(--rm-space-md);
      box-shadow: var(--rm-shadow-ai);
      margin-top: var(--rm-space-sm);
    }
    .rm-advice-insight__icon {
      width: 28px;
      height: 28px;
      flex-shrink: 0;
      border-radius: var(--rm-radius-sm);
      background: radial-gradient(circle at 35% 35%, var(--rm-brand) 0%, var(--rm-brand-active) 70%, transparent 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 10px rgba(0,212,255,0.35);
    }
    .rm-advice-insight__icon svg {
      width: 16px;
      height: 16px;
      stroke: var(--rm-brand-ink);
      fill: none;
      stroke-width: 2.2;
    }
    .rm-advice-insight__body { flex: 1; min-width: 0; }
    .rm-advice-insight__body--no-icon { padding-left: 0; }
    .rm-advice-insight__label {
      font-size: 12px;
      font-weight: 600;
      color: var(--rm-brand);
      margin-bottom: 6px;
      font-family: var(--rm-font-sans);
    }
    .rm-advice-insight__text { color: var(--rm-ink); }

    /* 概要/详细模式切换 */
    .rm-advice-insight__text--summary { display: block; }
    .rm-advice-insight__text--detail { display: none; }
    .rm-feed-item[data-expanded="true"] .rm-advice-insight__text--summary { display: none; }
    .rm-feed-item[data-expanded="true"] .rm-advice-insight__text--detail { display: block; }
    .rm-feed-item[data-expanded="true"] .rm-advice-toggle__text::before { content: "收起"; }
    .rm-advice-toggle__text::before { content: "展开详情"; }

    /* 展开收起按钮 */
    .rm-advice-toggle {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      margin-top: 8px;
      padding: 2px 0;
      border: none;
      background: none;
      color: var(--rm-brand);
      font-family: var(--rm-font-sans);
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      transition: opacity 150ms ease;
    }
    .rm-advice-toggle:hover { opacity: 0.8; }
    .rm-advice-toggle svg {
      width: 14px;
      height: 14px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      transition: transform 200ms ease;
    }
    .rm-feed-item[data-expanded="true"] .rm-advice-toggle svg {
      transform: rotate(180deg);
    }

    /* 底部信息行 */
    .rm-advice-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      flex-wrap: wrap;
      margin-top: var(--rm-space-sm);
    }
    .rm-advice-meta__left {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
      flex-wrap: wrap;
      flex: 1;
      min-width: 0;
    }
    .rm-advice-meta__tags {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      flex-wrap: wrap;
    }
    .rm-channel-tag {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 3px var(--rm-space-sm);
      border-radius: var(--rm-radius-sm);
      font-size: 11px;
      font-weight: 600;
      font-family: var(--rm-font-sans);
    }
    .rm-channel-tag--safe {
      background-color: rgba(139,92,246,0.15);
      color: var(--rm-state-info);
      border: 1px solid rgba(139,92,246,0.3);
    }
    .rm-channel-tag--ops {
      background-color: rgba(0,212,255,0.12);
      color: var(--rm-brand);
      border: 1px solid rgba(0,212,255,0.3);
    }
    .rm-advice-meta__stat {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      color: var(--rm-ink-2);
      font-family: var(--rm-font-sans);
    }
    .rm-advice-meta__stat-value {
      font-family: var(--rm-font-mono);
      font-weight: 600;
      color: var(--rm-ink);
    }
    .rm-advice-meta__time {
      font-size: 12px;
      color: var(--rm-ink-3);
    }
    .rm-advice-actions {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      flex-shrink: 0;
    }

    /* 忽略按钮：纯文字风格 */
    .rm-advice-btn-ignore {
      border: none !important;
      background: none !important;
      color: var(--rm-ink-3) !important;
      padding: 0 4px !important;
      height: 28px;
    }
    .rm-advice-btn-ignore:hover {
      color: var(--rm-state-error) !important;
      background: none !important;
      border: none !important;
    }

    /* 门店实况重点提醒消息框 */
    .rm-live-alert {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md) var(--rm-space-lg);
      background-color: rgba(239, 68, 68, 0.08);
      border: 1px solid rgba(239, 68, 68, 0.35);
      border-radius: var(--rm-radius-md);
      position: relative;
      animation: rm-pulse-alert 1.5s ease-in-out infinite;
    }

    .rm-live-alert__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-full);
      background-color: rgba(239, 68, 68, 0.15);
      color: var(--rm-state-error);
    }

    .rm-live-alert__content {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-xs);
    }

    .rm-live-alert__title {
      font-size: 14px;
      font-weight: 600;
      color: var(--rm-state-error);
    }

    .rm-live-alert__text {
      font-size: 13px;
      color: var(--rm-ink-2);
      line-height: 1.5;
    }

    .rm-live-alert__time {
      font-size: 12px;
      color: var(--rm-ink-3);
      flex-shrink: 0;
    }

    .rm-live-alert__close {
      width: 24px;
      height: 24px;
      border-radius: var(--rm-radius-sm);
      border: none;
      background-color: transparent;
      color: var(--rm-ink-3);
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .rm-live-alert__close:hover {
      background-color: rgba(239, 68, 68, 0.15);
      color: var(--rm-state-error);
    }

    /* 响应式：中屏以下取消拖拽，恢复上下堆叠 */
    @media (max-width: 1023px) {
      .rm-ai-report {
        width: 100% !important;
        min-width: 0;
        padding-right: 0;
      }

      .rm-store-live {
        flex: none;
        width: 100%;
        overflow: visible;
        padding-left: 0;
      }

      .rm-divider {
        display: none;
      }
    }

    /* ====== AI助手富对话样式（移植自 qa-panel） ====== */
    .rm-qa-conversation {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-lg);
      padding-bottom: var(--rm-space-md);
    }
    .rm-qa-turn {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }
    .rm-qa-msg--user {
      align-self: flex-end;
      max-width: 80%;
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-lg) var(--rm-radius-lg) var(--rm-radius-sm) var(--rm-radius-lg);
      padding: 10px 14px;
      color: var(--rm-ink);
      font-size: 14px;
      line-height: 1.5;
      box-shadow: var(--rm-shadow-1);
    }
    .rm-qa-msg--ai {
      align-self: flex-start;
      max-width: 92%;
    }
    .rm-qa-ai-bubble {
      background-color: var(--rm-surface);
      border-left: 3px solid var(--rm-brand);
      border-radius: var(--rm-radius-sm) var(--rm-radius-md) var(--rm-radius-md) var(--rm-radius-md);
      padding: 14px 16px;
      box-shadow: var(--rm-shadow-ai);
      color: var(--rm-ink);
      font-family: var(--rm-font-sans);
      font-size: 14px;
      line-height: 1.6;
    }
    .rm-qa-ai-bubble p { margin: 0; }
    .rm-qa-ai-bubble p + p { margin-top: 8px; }
    .rm-qa-data-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rm-space-sm);
      margin: 10px 0;
    }
    .rm-qa-data-item {
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-sm);
      padding: 8px 10px;
    }
    .rm-qa-data-label {
      font-size: 11px;
      color: var(--rm-ink-2);
      line-height: 1.4;
    }
    .rm-qa-data-value {
      font-family: var(--rm-font-mono);
      font-size: 18px;
      font-weight: 600;
      color: var(--rm-ink);
      margin-top: 2px;
      line-height: 1.2;
    }
    .rm-qa-data-value--up { color: var(--rm-state-success); }
    .rm-qa-data-value--down { color: var(--rm-state-error); }
    .rm-qa-data-value--warn { color: var(--rm-state-warning); }
    .rm-qa-table {
      width: 100%;
      border-collapse: collapse;
      margin: 10px 0;
      font-size: 13px;
    }
    .rm-qa-table th {
      text-align: left;
      padding: 6px 8px;
      background-color: var(--rm-surface-2);
      color: var(--rm-ink-2);
      font-weight: 600;
      border-bottom: 1px solid var(--rm-line);
      white-space: nowrap;
    }
    .rm-qa-table td {
      padding: 6px 8px;
      border-bottom: 1px solid var(--rm-line);
      color: var(--rm-ink);
    }
    .rm-qa-table td.rm-is-num {
      font-family: var(--rm-font-mono);
      text-align: right;
    }
    .rm-qa-table tr.rm-is-highlight td {
      color: var(--rm-brand);
      font-weight: 600;
      background-color: rgba(0,212,255,0.06);
    }
    .rm-qa-num {
      font-family: var(--rm-font-mono);
      font-weight: 600;
    }
    .rm-qa-num--up { color: var(--rm-state-success); }
    .rm-qa-num--warn { color: var(--rm-state-warning); }
    .rm-qa-num--danger { color: var(--rm-state-error); }
    .rm-qa-action-link {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      color: var(--rm-brand);
      font-size: 13px;
      font-weight: 500;
      text-decoration: none;
      margin-top: 8px;
      cursor: pointer;
      background: none;
      border: none;
      padding: 0;
      font-family: var(--rm-font-sans);
    }
    .rm-qa-action-link:hover {
      color: var(--rm-brand-hover);
      text-decoration: underline;
    }
    .rm-qa-action-link svg {
      width: 14px;
      height: 14px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }
    .rm-qa-meta {
      font-size: 11px;
      color: var(--rm-ink-3);
      margin-top: 4px;
    }
    .rm-qa-meta--user { text-align: right; }
    .rm-qa-suggested {
      padding: var(--rm-space-md) 0 var(--rm-space-sm);
      border-top: 1px solid var(--rm-line);
    }
    .rm-qa-suggested__title {
      font-size: 13px;
      font-weight: 600;
      color: var(--rm-ink-2);
      margin-bottom: var(--rm-space-sm);
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
    }
    .rm-qa-suggested__title svg {
      width: 14px;
      height: 14px;
      stroke: var(--rm-brand);
      fill: none;
      stroke-width: 2;
    }
    .rm-qa-suggested__tags {
      display: flex;
      flex-wrap: wrap;
      gap: var(--rm-space-sm);
    }
    .rm-qa-suggested-tag {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-full);
      color: var(--rm-ink);
      font-size: 12px;
      cursor: pointer;
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1), color 150ms cubic-bezier(.2,.8,.2,1), background-color 150ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-qa-suggested-tag:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
      background-color: rgba(0,212,255,0.08);
    }
    .rm-qa-suggested-tag svg {
      width: 12px;
      height: 12px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }
    /* 抽屉内对话区域滚动优化 */
    .rm-ai-drawer__body {
      flex: 1;
      overflow-y: auto;
      padding: var(--rm-space-md) var(--rm-space-lg);
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    /* ====== 操作按钮：忽略左对齐 + 采纳/处理右对齐 ====== */
    .rm-mini-advice-card__actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      margin-top: var(--rm-space-sm);
    }
    .rm-feed-item__actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      margin-top: var(--rm-space-sm);
    }
    /* 忽略按钮：纯文字风格，无边框无竖线 */
    .rm-mini-advice-card__actions .rm-btn-secondary,
    .rm-feed-item__actions .rm-btn-secondary {
      border: none;
      background: none;
      color: var(--rm-ink-3);
      padding: 0 4px;
      height: 28px;
    }
    .rm-mini-advice-card__actions .rm-btn-secondary:hover,
    .rm-feed-item__actions .rm-btn-secondary:hover {
      color: var(--rm-state-error);
      background: none;
      border: none;
    }

    /* ====== 区域卡片设备-数据关联 ====== */
    .rm-region-card__devices-data {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: var(--rm-space-xs) 0;
    }
    .rm-device-chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 3px 10px;
      background-color: var(--rm-surface-2);
      border-radius: var(--rm-radius-full);
      font-size: 11px;
      color: var(--rm-ink-2);
      line-height: 1.4;
    }
    .rm-device-chip .rm-status-dot {
      width: 6px;
      height: 6px;
    }
    .rm-device-chip__arrow {
      color: var(--rm-ink-3);
    }
    .rm-device-chip__data {
      color: var(--rm-brand);
      font-weight: 600;
    }

    /* ====== AI 智能图标（六边形芯片 + 神经网络 + 发光核心） ====== */
    .rm-ai-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    .rm-ai-icon svg {
      width: 100%;
      height: 100%;
      display: block;
    }
    .rm-ai-icon--sm { width: 28px; height: 28px; }
    .rm-ai-icon--xs { width: 24px; height: 24px; }
    .rm-ai-icon--lg { width: 40px; height: 40px; }

    /* 外环旋转 */
    .rm-ai-icon__ring {
      transform-box: view-box;
      transform-origin: center;
      animation: rm-ai-spin 8s linear infinite;
    }
    /* 六边形脉冲 */
    .rm-ai-icon__hex {
      transform-box: view-box;
      transform-origin: center;
      animation: rm-ai-hex-pulse 3s ease-in-out infinite;
    }
    /* 中心核心呼吸 */
    .rm-ai-icon__core {
      transform-box: view-box;
      transform-origin: center;
      animation: rm-ai-breathe 2s ease-in-out infinite;
    }
    /* 神经节点闪烁 */
    .rm-ai-icon__node {
      animation: rm-ai-blink 1.5s ease-in-out infinite;
    }
    .rm-ai-icon__node:nth-child(2) { animation-delay: 0.3s; }
    .rm-ai-icon__node:nth-child(3) { animation-delay: 0.6s; }
    .rm-ai-icon__node:nth-child(4) { animation-delay: 0.9s; }
    /* 光晕呼吸 */
    .rm-ai-icon__glow {
      transform-box: view-box;
      transform-origin: center;
      animation: rm-ai-glow 2.5s ease-in-out infinite;
    }

    @keyframes rm-ai-spin {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }
    @keyframes rm-ai-hex-pulse {
      0%, 100% { opacity: 0.6; }
      50% { opacity: 1; }
    }
    @keyframes rm-ai-breathe {
      0%, 100% { opacity: 0.7; transform: scale(0.85); }
      50% { opacity: 1; transform: scale(1.15); }
    }
    @keyframes rm-ai-blink {
      0%, 100% { opacity: 0.4; }
      50% { opacity: 1; }
    }
    @keyframes rm-ai-glow {
      0%, 100% { opacity: 0.5; transform: scale(0.95); }
      50% { opacity: 1; transform: scale(1.1); }
    }

    /* ====== 锁屏浮层 ====== */
    .rm-lock-fab {
      position: fixed;
      right: 24px;
      bottom: 24px;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      border: none;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 4px 16px rgba(0, 212, 255, 0.25), 0 8px 24px rgba(0, 0, 0, 0.2);
      z-index: 9998;
      transition: transform 150ms ease, box-shadow 150ms ease;
    }
    .rm-lock-fab:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(0, 212, 255, 0.35), 0 10px 28px rgba(0, 0, 0, 0.25);
    }
    .rm-lock-fab svg {
      width: 22px;
      height: 22px;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
    }
    .rm-lock-fab__tooltip {
      position: absolute;
      right: 58px;
      top: 50%;
      transform: translateY(-50%);
      padding: 6px 10px;
      background-color: rgba(15, 23, 42, 0.95);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-small);
      color: var(--rm-ink);
      font-size: 12px;
      white-space: nowrap;
      opacity: 0;
      pointer-events: none;
      transition: opacity 150ms ease;
    }
    .rm-lock-fab:hover .rm-lock-fab__tooltip {
      opacity: 1;
    }
    /* 设备控制抽屉打开时，锁屏按钮移到抽屉下方且不遮挡 */
    body.rm-device-drawer-open .rm-lock-fab {
      right: calc(50% - 480px);
      z-index: 8999;
      transition: right 300ms cubic-bezier(.2,.8,.2,1), z-index 0s;
    }
    @media (max-width: 1024px) {
      body.rm-device-drawer-open .rm-lock-fab {
        right: 50%;
        transform: translateX(50%);
      }
    }
    #lockScreenOverlay {
      position: fixed;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      background-color: rgba(15, 23, 42, 0.72);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      z-index: 9999;
    }
    #lockScreenOverlay[data-active="true"] {
      display: flex;
    }
    .rm-lock-overlay__content {
      width: 100%;
      max-width: 360px;
      margin: 20px;
      padding: 40px 32px;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-large);
      box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
      text-align: center;
    }
    .rm-lock-overlay__icon {
      width: 64px;
      height: 64px;
      margin: 0 auto 20px;
      color: var(--rm-brand);
    }
    .rm-lock-overlay__icon svg {
      width: 100%;
      height: 100%;
      stroke: currentColor;
      stroke-width: 1.5;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
    }
    .rm-lock-overlay__title {
      margin: 0 0 24px;
      font-size: 20px;
      font-weight: 600;
      color: var(--rm-ink);
      letter-spacing: 0.5px;
    }
    .rm-lock-overlay__input {
      width: 100%;
      height: 44px;
      padding: 0 14px;
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-medium);
      color: var(--rm-ink);
      font-size: 14px;
      outline: none;
      box-sizing: border-box;
      transition: border-color 150ms ease, box-shadow 150ms ease;
    }
    .rm-lock-overlay__input:focus {
      border-color: var(--rm-brand);
      box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.12);
    }
    .rm-lock-overlay__error {
      min-height: 20px;
      margin: 10px 0 0;
      font-size: 12px;
      color: var(--rm-state-error);
      text-align: left;
      opacity: 0;
      transition: opacity 150ms ease;
    }
    .rm-lock-overlay__error[data-visible="true"] {
      opacity: 1;
    }
    .rm-lock-overlay__hint {
      margin: 10px 0 24px;
      font-size: 12px;
      color: var(--rm-ink-3);
      text-align: left;
    }
    .rm-lock-overlay__unlock-btn {
      width: 100%;
      height: 44px;
      border: none;
      border-radius: var(--rm-radius-medium);
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      transition: background-color 150ms ease, transform 150ms ease;
    }
    .rm-lock-overlay__unlock-btn:hover {
      background-color: var(--rm-brand-hover);
    }
    .rm-lock-overlay__unlock-btn:active {
      transform: scale(0.98);
    }
    .rm-lock-toast {
      position: fixed;
      top: 24px;
      left: 50%;
      transform: translateX(-50%) translateY(-20px);
      padding: 10px 18px;
      background-color: rgba(15, 23, 42, 0.95);
      border-left: 3px solid var(--rm-brand);
      border-radius: var(--rm-radius-medium);
      color: var(--rm-ink);
      font-size: 13px;
      opacity: 0;
      pointer-events: none;
      transition: opacity 200ms ease, transform 200ms ease;
      z-index: 10000;
    }
    .rm-lock-toast[data-visible="true"] {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

/* ===== 页面样式: 设置中心 ===== */

/* ============================================================
   MartFlow — 品牌设计 Token
   依据：设计方案 §5.2 色彩体系 / §5.3 字体规范 / §5.4 间距栅格 / §5.8 阴影层级
   品牌前缀：rm
   ============================================================ */

/* ---------- 深色模式（默认） ---------- */
:root {
  /* 背景层 */
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;

  /* 边框 */
  --rm-line: #334155;

  /* 文字 */
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;

  /* 品牌色（单一主色） */
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;

  /* 状态色（仅语义状态使用） */
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;

  /* 数据可视化 */
  --rm-chart-flow: #00D4FF;
  --rm-chart-flow-2: #0EA5E9;
  --rm-chart-temp: #F59E0B;
  --rm-chart-temp-2: #EF4444;

  /* 阴影层级（静态阴影 alpha<=0.05，浮动层阴影用于 modal/popover/dropdown） */
  --rm-shadow-1: 0 1px 3px rgba(0,0,0,0.05);
  --rm-shadow-2: 0 4px 12px rgba(0,0,0,0.08);
  --rm-shadow-3: 0 8px 32px rgba(0,0,0,0.12);
  --rm-shadow-alert: 0 0 16px rgba(239,68,68,0.08);
  --rm-shadow-ai: 0 0 12px rgba(0,212,255,0.05);

  /* ---- 语义别名（apply-html-head-contract.mjs 要求） ---- */
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
  --rm-radius-small: 6px;
  --rm-radius-medium: 12px;
  --rm-radius-large: 16px;
}

.dark {
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;
  --rm-line: #334155;
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ---------- 高对比度模式（浅色，§5.2 评审决议 R-04） ---------- */
.light {
  --rm-bg: #F8FAFC;
  --rm-surface: #FFFFFF;
  --rm-surface-2: #F1F5F9;

  --rm-line: #CBD5E1;

  --rm-ink: #0F172A;
  --rm-ink-2: #475569;
  --rm-ink-3: #94A3B8;

  --rm-brand: #0284C7;
  --rm-brand-hover: #0369A1;
  --rm-brand-active: #075985;
  --rm-brand-ink: #FFFFFF;

  --rm-state-success: #059669;
  --rm-state-warning: #D97706;
  --rm-state-error: #DC2626;
  --rm-state-info: #7C3AED;

  --rm-shadow-1: 0 1px 3px rgba(15,23,42,0.05);
  --rm-shadow-2: 0 4px 12px rgba(15,23,42,0.08);
  --rm-shadow-3: 0 8px 32px rgba(15,23,42,0.12);
  --rm-shadow-alert: 0 0 16px rgba(220,38,38,0.05);
  --rm-shadow-ai: 0 0 12px rgba(2,132,199,0.05);

  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ============================================================
   字体系统（§5.3）
   ============================================================ */
:root {
  --rm-font-sans: "HarmonyOS Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --rm-font-mono: "DIN Alternate", "Roboto Mono", "JetBrains Mono", monospace;
}

/* 字体角色类 */
.rm-text-display {
  font-family: var(--rm-font-sans);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.rm-text-card-title {
  font-family: var(--rm-font-sans);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
}

.rm-text-body-strong {
  font-family: var(--rm-font-sans);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.rm-text-body {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.rm-text-caption {
  font-family: var(--rm-font-sans);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.005em;
}

.rm-text-data-lg {
  font-family: var(--rm-font-mono);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
}

.rm-text-data-md {
  font-family: var(--rm-font-mono);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
}

.rm-text-llm {
  font-family: var(--rm-font-sans);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
}

/* ============================================================
   间距体系（§5.4，8px 基准）
   ============================================================ */
:root {
  --rm-space-xs: 4px;
  --rm-space-sm: 8px;
  --rm-space-md: 16px;
  --rm-space-lg: 24px;
  --rm-space-xl: 32px;
  --rm-space-2xl: 48px;
}

/* ============================================================
   圆角体系（§5.4）
   ============================================================ */
:root {
  --rm-radius-sm: 6px;
  --rm-radius-md: 12px;
  --rm-radius-lg: 16px;
  --rm-radius-full: 9999px;
}

/* ============================================================
   布局尺寸（§5.4 / §5.6）
   ============================================================ */
:root {
  --rm-layout-header-h: 56px;
  --rm-layout-sidebar-w: 220px;
  --rm-layout-sidebar-collapsed-w: 64px;
  --rm-layout-ai-bar-h: 72px;
  --rm-layout-ai-bar-expanded-h: 320px;
  --rm-layout-card-min-h: 120px;
  --rm-layout-card-padding: 16px;
  --rm-layout-grid-cols: 12;
  --rm-layout-grid-gap: 24px;
  --rm-layout-max-w: 1920px;
  --rm-layout-content-padding: 32px;
}

/* ============================================================
   组件状态规范（§7.5）
   ============================================================ */

/* 按钮基础 */
.rm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rm-space-xs);
  height: 40px;
  padding: 0 24px;
  border-radius: var(--rm-radius-sm);
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1),
              transform 120ms cubic-bezier(.2,.8,.2,1);
  border: none;
  outline: none;
  white-space: nowrap;
  user-select: none;
}

.rm-btn:active {
  transform: scale(0.98);
}

.rm-btn:focus-visible {
  box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
}

/* 主按钮 */
.rm-btn-primary {
  background-color: var(--rm-brand);
  color: var(--rm-brand-ink);
}
.rm-btn-primary:hover {
  background-color: var(--rm-brand-hover);
}

/* 次按钮 */
.rm-btn-secondary {
  background-color: transparent;
  border: 1px solid var(--rm-line);
  color: var(--rm-ink);
}
.rm-btn-secondary:hover {
  border-color: var(--rm-brand);
}

/* 危险按钮 */
.rm-btn-danger {
  background-color: var(--rm-state-error);
  color: #FFFFFF;
}
.rm-btn-danger:hover {
  background-color: #DC2626;
}

/* 禁用态 */
.rm-btn:disabled,
.rm-btn-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* 紧凑尺寸 */
.rm-btn-sm {
  height: 32px;
  padding: 0 16px;
  font-size: 13px;
}

/* 大号尺寸 */
.rm-btn-lg {
  height: 48px;
  padding: 0 32px;
  font-size: 16px;
}

/* ============================================================
   卡片基础（§5.8 阴影与层级）
   ============================================================ */
.rm-card {
  background-color: var(--rm-surface);
  border: 1px solid var(--rm-line);
  border-radius: var(--rm-radius-md);
  padding: var(--rm-layout-card-padding);
  min-height: var(--rm-layout-card-min-h);
  transition: box-shadow 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1);
}

.rm-card:hover {
  box-shadow: var(--rm-shadow-2);
}

/* 告警卡片 */
.rm-card-alert {
  border-color: var(--rm-state-error);
  box-shadow: var(--rm-shadow-alert);
  animation: rm-pulse-alert 1.5s ease-in-out infinite;
}

@keyframes rm-pulse-alert {
  0%, 100% { box-shadow: 0 0 16px rgba(239,68,68,0.3); }
  50% { box-shadow: 0 0 24px rgba(239,68,68,0.5); }
}

/* ============================================================
   骨架屏 shimmer（§5.5）
   ============================================================ */
.rm-skeleton {
  background: linear-gradient(
    90deg,
    var(--rm-surface) 0%,
    var(--rm-surface-2) 50%,
    var(--rm-surface) 100%
  );
  background-size: 200% 100%;
  animation: rm-shimmer 1.5s linear infinite;
  border-radius: var(--rm-radius-sm);
}

@keyframes rm-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   状态点（§5.2）
   ============================================================ */
.rm-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--rm-radius-full);
  flex-shrink: 0;
}

.rm-status-dot--success { background-color: var(--rm-state-success); box-shadow: 0 0 8px rgba(16,185,129,0.3); }
.rm-status-dot--warning { background-color: var(--rm-state-warning); box-shadow: 0 0 8px rgba(245,158,11,0.3); }
.rm-status-dot--error { background-color: var(--rm-state-error); box-shadow: 0 0 8px rgba(239,68,68,0.3); }
.rm-status-dot--info { background-color: var(--rm-state-info); }
.rm-status-dot--brand { background-color: var(--rm-brand); }

/* ============================================================
   全局重置
   ============================================================ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  color: var(--rm-ink);
  background-color: var(--rm-bg);
}

body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--rm-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--rm-line);
  border-radius: var(--rm-radius-full);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--rm-ink-3);
}

/* 选中文本 */
::selection {
  background-color: rgba(0,212,255,0.25);
  color: var(--rm-ink);
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
/* @theme removed for v3 compat */

    td, th { /* @apply removed */ word-break: break-all; word-break: auto-phrase; }
    th { /* @apply removed */ }
  }
.bg-background { background-color: var(--rm-background); }
      .text-background { color: var(--rm-background); }
      .border-background { border-color: var(--rm-background); }
      .ring-background { --tw-ring-color: var(--rm-background); }
      .bg-foreground { background-color: var(--rm-foreground); }
      .text-foreground { color: var(--rm-foreground); }
      .border-foreground { border-color: var(--rm-foreground); }
      .ring-foreground { --tw-ring-color: var(--rm-foreground); }
      .bg-card { background-color: var(--rm-card); }
      .text-card { color: var(--rm-card); }
      .border-card { border-color: var(--rm-card); }
      .ring-card { --tw-ring-color: var(--rm-card); }
      .bg-card-foreground { background-color: var(--rm-card-foreground); }
      .text-card-foreground { color: var(--rm-card-foreground); }
      .border-card-foreground { border-color: var(--rm-card-foreground); }
      .ring-card-foreground { --tw-ring-color: var(--rm-card-foreground); }
      .bg-popover { background-color: var(--rm-popover); }
      .text-popover { color: var(--rm-popover); }
      .border-popover { border-color: var(--rm-popover); }
      .ring-popover { --tw-ring-color: var(--rm-popover); }
      .bg-popover-foreground { background-color: var(--rm-popover-foreground); }
      .text-popover-foreground { color: var(--rm-popover-foreground); }
      .border-popover-foreground { border-color: var(--rm-popover-foreground); }
      .ring-popover-foreground { --tw-ring-color: var(--rm-popover-foreground); }
      .bg-primary { background-color: var(--rm-primary); }
      .text-primary { color: var(--rm-primary); }
      .border-primary { border-color: var(--rm-primary); }
      .ring-primary { --tw-ring-color: var(--rm-primary); }
      .bg-primary-foreground { background-color: var(--rm-primary-foreground); }
      .text-primary-foreground { color: var(--rm-primary-foreground); }
      .border-primary-foreground { border-color: var(--rm-primary-foreground); }
      .ring-primary-foreground { --tw-ring-color: var(--rm-primary-foreground); }
      .bg-muted { background-color: var(--rm-muted); }
      .text-muted { color: var(--rm-muted); }
      .border-muted { border-color: var(--rm-muted); }
      .ring-muted { --tw-ring-color: var(--rm-muted); }
      .bg-muted-foreground { background-color: var(--rm-muted-foreground); }
      .text-muted-foreground { color: var(--rm-muted-foreground); }
      .border-muted-foreground { border-color: var(--rm-muted-foreground); }
      .ring-muted-foreground { --tw-ring-color: var(--rm-muted-foreground); }
      .bg-border { background-color: var(--rm-border); }
      .text-border { color: var(--rm-border); }
      .border-border { border-color: var(--rm-border); }
      .ring-border { --tw-ring-color: var(--rm-border); }
      .bg-input { background-color: var(--rm-input); }
      .text-input { color: var(--rm-input); }
      .border-input { border-color: var(--rm-input); }
      .ring-input { --tw-ring-color: var(--rm-input); }
      .bg-ring { background-color: var(--rm-ring); }
      .text-ring { color: var(--rm-ring); }
      .border-ring { border-color: var(--rm-ring); }
      .ring-ring { --tw-ring-color: var(--rm-ring); }
.no-scrollbar::-webkit-scrollbar { display: none; }
      .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
      [data-icon] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        background-color: currentColor;
      }
/* ====== 应用框架布局：无左侧菜单，顶部通栏 + 主内容区 ====== */
    .rm-app {
      display: flex;
      flex-direction: column;
      height: 100vh;
      background-color: var(--rm-bg);
      overflow: hidden;
    }

    /* 顶部状态栏 */
    .rm-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--rm-layout-header-h);
      padding: 0 var(--rm-layout-content-padding);
      background-color: var(--rm-surface);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
      z-index: 100;
    }

    .rm-header__left {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
    }

    .rm-header__logo {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__logo-icon {
      width: 28px;
      height: 28px;
      border-radius: var(--rm-radius-sm);
      background: linear-gradient(135deg, var(--rm-brand) 0%, var(--rm-brand-active) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      font-weight: 700;
      color: var(--rm-brand-ink);
    }

    .rm-header__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-header__right {
      display: flex;
      align-items: center;
      gap: var(--rm-space-lg);
    }

    .rm-header__status {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-header__status-value {
      color: var(--rm-state-success);
      font-weight: 600;
    }

    .rm-header__actions {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid transparent;
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-header__btn:hover {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
      border-color: var(--rm-line);
    }

    .rm-header__btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    /* 主内容区 */
    .rm-body {
      flex: 1;
      overflow: hidden;
      position: relative;
    }

    .rm-content {
      width: 100%;
      height: 100%;
      overflow-y: auto;
      padding: var(--rm-layout-content-padding);
      background-color: var(--rm-bg);
    }

    .rm-content__inner {
      max-width: var(--rm-layout-max-w);
      margin: 0 auto;
      min-height: 100%;
      display: flex;
      flex-direction: column;
    }

    /* ====== 设置中心页面关键布局 ====== */

    /* 页面标题区 */
    .rm-config-header {
      display: flex;
      align-items: center;
      gap: var(--rm-space-lg);
      margin-bottom: var(--rm-space-xl);
    }

    .rm-back-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: var(--rm-space-xs);
      height: 36px;
      padding: 0 16px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line);
      background-color: transparent;
      color: var(--rm-ink-2);
      font-family: var(--rm-font-sans);
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
      flex-shrink: 0;
    }

    .rm-back-btn:hover {
      border-color: var(--rm-brand);
      color: var(--rm-brand);
      background-color: rgba(0, 212, 255, 0.06);
    }

    .rm-back-btn:focus-visible {
      box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
      outline: none;
    }

    .rm-back-btn svg {
      stroke: currentColor;
    }

    .rm-config-header__text {
      flex: 1;
      min-width: 0;
    }

    .rm-config-header__title {
      font-size: 24px;
      font-weight: 700;
      color: var(--rm-ink);
      letter-spacing: -0.01em;
      line-height: 1.3;
    }

    .rm-config-header__subtitle {
      font-size: 13px;
      color: var(--rm-ink-2);
      margin-top: 4px;
    }

    /* 设置入口卡片网格 */
    .rm-settings-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rm-space-lg);
      flex: 1;
      align-content: flex-start;
    }

    .rm-setting-card {
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      padding: var(--rm-space-lg);
      cursor: pointer;
      transition: box-shadow 150ms cubic-bezier(.2,.8,.2,1),
                  border-color 150ms cubic-bezier(.2,.8,.2,1),
                  transform 120ms cubic-bezier(.2,.8,.2,1);
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
      position: relative;
    }

    .rm-setting-card:hover {
      box-shadow: var(--rm-shadow-2);
      border-color: var(--rm-brand);
    }

    .rm-setting-card:active {
      transform: scale(0.99);
    }

    .rm-setting-card:focus-visible {
      outline: none;
      box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
    }

    .rm-setting-card--warning {
      border-color: rgba(245, 158, 11, 0.4);
    }

    .rm-setting-card--warning:hover {
      border-color: var(--rm-state-warning);
      box-shadow: 0 4px 12px rgba(245, 158, 11, 0.12);
    }

    .rm-setting-card__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-sm);
      margin-bottom: 4px;
    }

    .rm-setting-card__icon {
      width: 40px;
      height: 40px;
      border-radius: var(--rm-radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--rm-ink);
      flex-shrink: 0;
    }

    .rm-setting-card__icon--cyan {
      background-color: rgba(0, 212, 255, 0.12);
      color: var(--rm-brand);
    }

    .rm-setting-card__icon--brand {
      background-color: rgba(139, 92, 246, 0.12);
      color: var(--rm-state-info);
    }

    .rm-setting-card__icon--warning {
      background-color: rgba(245, 158, 11, 0.12);
      color: var(--rm-state-warning);
    }

    .rm-setting-card__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-setting-card__desc {
      font-size: 13px;
      color: var(--rm-ink-2);
      line-height: 1.5;
    }

    .rm-setting-card__lang {
      font-size: 12px;
      color: var(--rm-ink-3);
      font-weight: 500;
    }

    /* 状态徽章 */
    .rm-status-badge {
      display: inline-flex;
      align-items: center;
      padding: 3px 10px;
      border-radius: var(--rm-radius-full);
      font-size: 12px;
      font-weight: 600;
      line-height: 1.4;
      flex-shrink: 0;
    }

    .rm-status-badge--muted {
      background-color: rgba(100, 116, 139, 0.2);
      color: var(--rm-ink-2);
    }

    .rm-status-badge--success {
      background-color: rgba(16, 185, 129, 0.15);
      color: var(--rm-state-success);
    }

    .rm-status-badge--warning {
      background-color: rgba(245, 158, 11, 0.15);
      color: var(--rm-state-warning);
    }

    /* 底部信息栏 */
    .rm-config-footer {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: var(--rm-space-xl);
      margin-top: var(--rm-space-xl);
      padding-top: var(--rm-space-md);
      border-top: 1px solid var(--rm-line);
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-config-footer__item {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
    }

    .rm-config-footer__label {
      color: var(--rm-ink-3);
    }

    .rm-config-footer__value {
      color: var(--rm-ink-2);
      font-weight: 500;
    }

    /* ====== 模态框 ====== */
    .rm-modal {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: var(--rm-space-md);
      opacity: 0;
      visibility: hidden;
      transition: opacity 180ms cubic-bezier(.2,.8,.2,1),
                  visibility 180ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-modal.is-open {
      opacity: 1;
      visibility: visible;
    }

    .rm-modal__backdrop {
      position: absolute;
      inset: 0;
      background-color: rgba(15, 23, 42, 0.72);
      cursor: pointer;
    }

    .rm-modal__dialog {
      position: relative;
      width: 100%;
      max-width: 420px;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      box-shadow: var(--rm-shadow-3);
      display: flex;
      flex-direction: column;
      transform: translateY(8px);
      transition: transform 180ms cubic-bezier(.2,.8,.2,1);
      max-height: calc(100vh - var(--rm-space-lg) * 2);
      overflow: hidden;
    }

    .rm-modal.is-open .rm-modal__dialog {
      transform: translateY(0);
    }

    .rm-modal__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
    }

    .rm-modal__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-modal__close {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: var(--rm-radius-sm);
      border: none;
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
      flex-shrink: 0;
    }

    .rm-modal__close:hover {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
    }

    .rm-modal__close:focus-visible {
      outline: none;
      box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
    }

    .rm-modal__body {
      padding: var(--rm-space-lg);
      overflow-y: auto;
    }

    .rm-modal__footer {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-top: 1px solid var(--rm-line);
    }

    /* 表单字段 */
    .rm-form-field {
      margin-bottom: var(--rm-space-md);
    }

    .rm-form-field:last-child {
      margin-bottom: 0;
    }

    .rm-form-field__label {
      display: block;
      font-size: 13px;
      color: var(--rm-ink-2);
      margin-bottom: 6px;
      font-weight: 500;
    }

    .rm-form-field__input {
      width: 100%;
      height: 40px;
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      color: var(--rm-ink);
      padding: 0 var(--rm-space-sm);
      font-size: 14px;
      font-family: var(--rm-font-sans);
      transition: border-color 150ms cubic-bezier(.2,.8,.2,1),
                  box-shadow 150ms cubic-bezier(.2,.8,.2,1);
      outline: none;
    }

    .rm-form-field__input::placeholder {
      color: var(--rm-ink-3);
    }

    .rm-form-field__input:focus {
      border-color: var(--rm-brand);
      box-shadow: 0 0 0 2px rgba(0, 212, 255, 0.1);
    }

    /* 语言选项列表 */
    .rm-language-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-language-option {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md);
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-language-option:hover {
      border-color: var(--rm-brand);
      background-color: rgba(0, 212, 255, 0.04);
    }

    .rm-language-option:focus-visible {
      outline: none;
      box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
    }

    .rm-language-option.is-selected {
      border-color: var(--rm-brand);
      background-color: rgba(0, 212, 255, 0.08);
    }

    .rm-language-option__label {
      font-size: 14px;
      color: var(--rm-ink);
      font-weight: 500;
    }

    .rm-language-option__check {
      width: 20px;
      height: 20px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-brand);
      color: var(--rm-brand-ink);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transform: scale(0.8);
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-language-option.is-selected .rm-language-option__check {
      opacity: 1;
      transform: scale(1);
    }

    /* QR 占位区 */
    .rm-qr-placeholder {
      width: 160px;
      height: 160px;
      margin: 0 auto var(--rm-space-lg);
      border: 1px dashed var(--rm-line);
      border-radius: var(--rm-radius-sm);
      background-color: var(--rm-bg);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: var(--rm-space-sm);
      color: var(--rm-ink-3);
    }

    .rm-qr-placeholder__text {
      font-size: 12px;
      color: var(--rm-ink-3);
      text-align: center;
    }

    .rm-engineering-actions {
      margin-top: var(--rm-space-md);
    }

    .rm-engineering-actions__entry {
      width: 100%;
    }

    /* Toast */
    .rm-toast {
      position: fixed;
      top: var(--rm-space-lg);
      left: 50%;
      transform: translateX(-50%) translateY(-16px);
      z-index: 1100;
      display: inline-flex;
      align-items: center;
      gap: var(--rm-space-sm);
      padding: 12px 20px;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      box-shadow: var(--rm-shadow-3);
      color: var(--rm-ink);
      font-size: 14px;
      opacity: 0;
      visibility: hidden;
      transition: opacity 180ms cubic-bezier(.2,.8,.2,1),
                  transform 180ms cubic-bezier(.2,.8,.2,1),
                  visibility 180ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-toast.is-visible {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
    }

    .rm-toast__icon {
      width: 20px;
      height: 20px;
      border-radius: var(--rm-radius-full);
      background-color: rgba(16, 185, 129, 0.15);
      color: var(--rm-state-success);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .rm-toast__text {
      white-space: nowrap;
    }

    /* 响应式 */
    @media (max-width: 1279px) {
      .rm-header {
        padding: 0 var(--rm-space-md);
      }
      .rm-content {
        padding: var(--rm-space-md);
      }
      .rm-settings-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 767px) {
      .rm-header__title {
        display: none;
      }
      .rm-config-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--rm-space-md);
      }
      .rm-settings-grid {
        grid-template-columns: 1fr;
      }
      .rm-config-footer {
        gap: var(--rm-space-md);
      }
      .rm-modal__dialog {
        max-width: 100%;
      }
      .rm-modal__footer {
        flex-direction: column-reverse;
      }
      .rm-modal__footer .rm-btn {
        width: 100%;
      }
    }

/* ===== 页面样式: 工程模式 ===== */

/* ============================================================
   MartFlow — 品牌设计 Token
   依据：设计方案 §5.2 色彩体系 / §5.3 字体规范 / §5.4 间距栅格 / §5.8 阴影层级
   品牌前缀：rm
   ============================================================ */

/* ---------- 深色模式（默认） ---------- */
:root {
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;

  --rm-line: #334155;

  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;

  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;

  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;

  --rm-chart-flow: #00D4FF;
  --rm-chart-flow-2: #0EA5E9;
  --rm-chart-temp: #F59E0B;
  --rm-chart-temp-2: #EF4444;

  --rm-shadow-1: 0 1px 3px rgba(0,0,0,0.05);
  --rm-shadow-2: 0 4px 12px rgba(0,0,0,0.08);
  --rm-shadow-3: 0 8px 32px rgba(0,0,0,0.12);
  --rm-shadow-alert: 0 0 16px rgba(239,68,68,0.08);
  --rm-shadow-ai: 0 0 12px rgba(0,212,255,0.05);

  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
  --rm-radius-small: 6px;
  --rm-radius-medium: 12px;
  --rm-radius-large: 16px;
}

.dark {
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;
  --rm-line: #334155;
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

.light {
  --rm-bg: #F8FAFC;
  --rm-surface: #FFFFFF;
  --rm-surface-2: #F1F5F9;

  --rm-line: #CBD5E1;

  --rm-ink: #0F172A;
  --rm-ink-2: #475569;
  --rm-ink-3: #94A3B8;

  --rm-brand: #0284C7;
  --rm-brand-hover: #0369A1;
  --rm-brand-active: #075985;
  --rm-brand-ink: #FFFFFF;

  --rm-state-success: #059669;
  --rm-state-warning: #D97706;
  --rm-state-error: #DC2626;
  --rm-state-info: #7C3AED;

  --rm-shadow-1: 0 1px 3px rgba(15,23,42,0.05);
  --rm-shadow-2: 0 4px 12px rgba(15,23,42,0.08);
  --rm-shadow-3: 0 8px 32px rgba(15,23,42,0.12);
  --rm-shadow-alert: 0 0 16px rgba(220,38,38,0.05);
  --rm-shadow-ai: 0 0 12px rgba(2,132,199,0.05);

  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

:root {
  --rm-font-sans: "HarmonyOS Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --rm-font-mono: "DIN Alternate", "Roboto Mono", "JetBrains Mono", monospace;
}

:root {
  --rm-space-xs: 4px;
  --rm-space-sm: 8px;
  --rm-space-md: 16px;
  --rm-space-lg: 24px;
  --rm-space-xl: 32px;
  --rm-space-2xl: 48px;
}

:root {
  --rm-radius-sm: 6px;
  --rm-radius-md: 12px;
  --rm-radius-lg: 16px;
  --rm-radius-full: 9999px;
}

:root {
  --rm-layout-header-h: 56px;
  --rm-layout-sidebar-w: 220px;
  --rm-layout-sidebar-collapsed-w: 64px;
  --rm-layout-ai-bar-h: 72px;
  --rm-layout-ai-bar-expanded-h: 320px;
  --rm-layout-card-min-h: 120px;
  --rm-layout-card-padding: 16px;
  --rm-layout-grid-cols: 12;
  --rm-layout-grid-gap: 24px;
  --rm-layout-max-w: 1920px;
  --rm-layout-content-padding: 32px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-family: var(--rm-font-sans); font-size: 14px; color: var(--rm-ink); background-color: var(--rm-bg); }
body { min-height: 100vh; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--rm-bg); }
::-webkit-scrollbar-thumb { background: var(--rm-line); border-radius: var(--rm-radius-full); }
::-webkit-scrollbar-thumb:hover { background: var(--rm-ink-3); }

::selection { background-color: rgba(0,212,255,0.25); color: var(--rm-ink); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
/* @theme removed for v3 compat */

    td, th { /* @apply removed */ word-break: break-all; word-break: auto-phrase; }
    th { /* @apply removed */ }
  }
.bg-background { background-color: var(--rm-background); }
      .text-background { color: var(--rm-background); }
      .border-background { border-color: var(--rm-background); }
      .ring-background { --tw-ring-color: var(--rm-background); }
      .bg-foreground { background-color: var(--rm-foreground); }
      .text-foreground { color: var(--rm-foreground); }
      .border-foreground { border-color: var(--rm-foreground); }
      .ring-foreground { --tw-ring-color: var(--rm-foreground); }
      .bg-card { background-color: var(--rm-card); }
      .text-card { color: var(--rm-card); }
      .border-card { border-color: var(--rm-card); }
      .ring-card { --tw-ring-color: var(--rm-card); }
      .bg-card-foreground { background-color: var(--rm-card-foreground); }
      .text-card-foreground { color: var(--rm-card-foreground); }
      .border-card-foreground { border-color: var(--rm-card-foreground); }
      .ring-card-foreground { --tw-ring-color: var(--rm-card-foreground); }
      .bg-popover { background-color: var(--rm-popover); }
      .text-popover { color: var(--rm-popover); }
      .border-popover { border-color: var(--rm-popover); }
      .ring-popover { --tw-ring-color: var(--rm-popover); }
      .bg-popover-foreground { background-color: var(--rm-popover-foreground); }
      .text-popover-foreground { color: var(--rm-popover-foreground); }
      .border-popover-foreground { border-color: var(--rm-popover-foreground); }
      .ring-popover-foreground { --tw-ring-color: var(--rm-popover-foreground); }
      .bg-primary { background-color: var(--rm-primary); }
      .text-primary { color: var(--rm-primary); }
      .border-primary { border-color: var(--rm-primary); }
      .ring-primary { --tw-ring-color: var(--rm-primary); }
      .bg-primary-foreground { background-color: var(--rm-primary-foreground); }
      .text-primary-foreground { color: var(--rm-primary-foreground); }
      .border-primary-foreground { border-color: var(--rm-primary-foreground); }
      .ring-primary-foreground { --tw-ring-color: var(--rm-primary-foreground); }
      .bg-muted { background-color: var(--rm-muted); }
      .text-muted { color: var(--rm-muted); }
      .border-muted { border-color: var(--rm-muted); }
      .ring-muted { --tw-ring-color: var(--rm-muted); }
      .bg-muted-foreground { background-color: var(--rm-muted-foreground); }
      .text-muted-foreground { color: var(--rm-muted-foreground); }
      .border-muted-foreground { border-color: var(--rm-muted-foreground); }
      .ring-muted-foreground { --tw-ring-color: var(--rm-muted-foreground); }
      .bg-border { background-color: var(--rm-border); }
      .text-border { color: var(--rm-border); }
      .border-border { border-color: var(--rm-border); }
      .ring-border { --tw-ring-color: var(--rm-border); }
      .bg-input { background-color: var(--rm-input); }
      .text-input { color: var(--rm-input); }
      .border-input { border-color: var(--rm-input); }
      .ring-input { --tw-ring-color: var(--rm-input); }
      .bg-ring { background-color: var(--rm-ring); }
      .text-ring { color: var(--rm-ring); }
      .border-ring { border-color: var(--rm-ring); }
      .ring-ring { --tw-ring-color: var(--rm-ring); }
/* ====== 应用框架布局 ====== */
    .rm-app {
      display: flex;
      flex-direction: column;
      height: 100vh;
      background-color: var(--rm-bg);
      overflow: hidden;
    }

    /* 顶部状态栏 */
    .rm-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--rm-layout-header-h);
      padding: 0 var(--rm-layout-content-padding);
      background-color: var(--rm-surface);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
      z-index: 100;
    }

    .rm-header__left {
      display: flex;
      align-items: center;
      gap: var(--rm-space-md);
    }

    .rm-header__logo {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__logo-icon {
      width: 28px;
      height: 28px;
      border-radius: var(--rm-radius-sm);
      background: linear-gradient(135deg, var(--rm-brand) 0%, var(--rm-brand-active) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      font-weight: 700;
      color: var(--rm-brand-ink);
    }

    .rm-header__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-header__right {
      display: flex;
      align-items: center;
      gap: var(--rm-space-lg);
    }

    .rm-header__status {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-header__status-value {
      color: var(--rm-state-success);
      font-weight: 600;
    }

    .rm-header__actions {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
    }

    .rm-header__btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      border-radius: var(--rm-radius-sm);
      border: 1px solid transparent;
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-header__btn:hover {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
      border-color: var(--rm-line);
    }

    .rm-header__btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    /* 主内容区 */
    .rm-body {
      flex: 1;
      overflow: hidden;
      position: relative;
    }

    .rm-content {
      width: 100%;
      height: 100%;
      overflow-y: auto;
      padding: var(--rm-layout-content-padding);
      background-color: var(--rm-bg);
    }

    .rm-content__inner {
      max-width: var(--rm-layout-max-w);
      margin: 0 auto;
    }

    /* 页面标题区 */
    .rm-engineering-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: var(--rm-space-md);
      margin-bottom: var(--rm-space-lg);
    }

    .rm-engineering-header__title {
      font-size: 24px;
      font-weight: 700;
      color: var(--rm-ink);
      letter-spacing: -0.01em;
    }

    .rm-engineering-header__subtitle {
      font-size: 13px;
      color: var(--rm-ink-2);
      margin-top: 4px;
    }

    .rm-engineering-header__back {
      display: inline-flex;
      align-items: center;
      gap: var(--rm-space-xs);
    }

    /* 警告横幅 */
    .rm-warning-banner {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md) var(--rm-space-lg);
      margin-bottom: var(--rm-space-lg);
      background-color: rgba(245,158,11,0.1);
      border: 1px solid rgba(245,158,11,0.35);
      border-radius: var(--rm-radius-md);
      color: var(--rm-state-warning);
    }

    .rm-warning-banner__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 20px;
      height: 20px;
      flex-shrink: 0;
    }

    .rm-warning-banner__icon svg {
      width: 20px;
      height: 20px;
    }

    .rm-warning-banner__text {
      font-size: 14px;
      font-weight: 600;
    }

    /* 工程操作卡片网格（静态 CSS，不依赖 Tailwind） */
    .rm-engineering-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--rm-space-lg);
      margin-bottom: var(--rm-space-xl);
    }

    .rm-engineering-card {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      padding: var(--rm-space-lg);
      min-height: 200px;
      transition: box-shadow 150ms cubic-bezier(.2,.8,.2,1), border-color 150ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-engineering-card:hover {
      box-shadow: var(--rm-shadow-2);
      border-color: rgba(0,212,255,0.25);
    }

    .rm-engineering-card__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      border-radius: var(--rm-radius-md);
      margin-bottom: var(--rm-space-md);
    }

    .rm-engineering-card__icon svg {
      width: 24px;
      height: 24px;
    }

    .rm-engineering-card__icon--brand { background-color: rgba(0,212,255,0.12); color: var(--rm-brand); }
    .rm-engineering-card__icon--warning { background-color: rgba(245,158,11,0.12); color: var(--rm-state-warning); }
    .rm-engineering-card__icon--success { background-color: rgba(16,185,129,0.12); color: var(--rm-state-success); }
    .rm-engineering-card__icon--info { background-color: rgba(139,92,246,0.12); color: var(--rm-state-info); }
    .rm-engineering-card__icon--muted { background-color: rgba(100,116,139,0.15); color: var(--rm-ink-2); }

    .rm-engineering-card__title {
      font-size: 17px;
      font-weight: 600;
      color: var(--rm-ink);
      margin-bottom: var(--rm-space-xs);
    }

    .rm-engineering-card__desc {
      font-size: 13px;
      color: var(--rm-ink-2);
      line-height: 1.5;
      margin-bottom: var(--rm-space-md);
      flex: 1;
    }

    .rm-engineering-card__btn {
      width: 100%;
      margin-top: auto;
    }

    /* 底部信息栏 */
    .rm-engineering-footer {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: var(--rm-space-xl);
      padding-top: var(--rm-space-md);
      border-top: 1px solid var(--rm-line);
      font-size: 12px;
      color: var(--rm-ink-3);
    }

    .rm-engineering-footer__item {
      display: flex;
      align-items: center;
      gap: var(--rm-space-xs);
    }

    .rm-engineering-footer__value {
      color: var(--rm-ink-2);
      font-weight: 500;
    }

    /* ====== 按钮组件 ====== */
    .rm-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: var(--rm-space-xs);
      height: 40px;
      padding: 0 24px;
      border-radius: var(--rm-radius-sm);
      font-family: var(--rm-font-sans);
      font-size: 14px;
      font-weight: 600;
      cursor: pointer;
      transition: background-color 150ms cubic-bezier(.2,.8,.2,1), border-color 150ms cubic-bezier(.2,.8,.2,1), transform 120ms cubic-bezier(.2,.8,.2,1);
      border: none;
      outline: none;
      white-space: nowrap;
      user-select: none;
    }

    .rm-btn:active { transform: scale(0.98); }
    .rm-btn:focus-visible { box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand); }

    .rm-btn-primary { background-color: var(--rm-brand); color: var(--rm-brand-ink); }
    .rm-btn-primary:hover { background-color: var(--rm-brand-hover); }

    .rm-btn-secondary { background-color: transparent; border: 1px solid var(--rm-line); color: var(--rm-ink); }
    .rm-btn-secondary:hover { border-color: var(--rm-brand); }

    .rm-btn-danger { background-color: var(--rm-state-error); color: #FFFFFF; }
    .rm-btn-danger:hover { background-color: #DC2626; }

    .rm-btn:disabled, .rm-btn-disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

    .rm-btn-sm { height: 32px; padding: 0 16px; font-size: 13px; }

    /* ====== 模态框 ====== */
    .rm-modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: var(--rm-space-md);
      background-color: rgba(15,23,42,0.7);
      opacity: 0;
      visibility: hidden;
      transition: opacity 200ms cubic-bezier(.2,.8,.2,1), visibility 200ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-modal-backdrop[data-visible="true"] {
      opacity: 1;
      visibility: visible;
    }

    .rm-modal {
      width: 100%;
      max-width: 640px;
      max-height: calc(100vh - var(--rm-space-lg) * 2);
      background-color: var(--rm-surface);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      box-shadow: var(--rm-shadow-3);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      transform: translateY(12px);
      transition: transform 200ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-modal-backdrop[data-visible="true"] .rm-modal {
      transform: translateY(0);
    }

    .rm-modal__header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    .rm-modal__title {
      font-size: 16px;
      font-weight: 600;
      color: var(--rm-ink);
    }

    .rm-modal__close {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 32px;
      height: 32px;
      border-radius: var(--rm-radius-sm);
      border: none;
      background-color: transparent;
      color: var(--rm-ink-2);
      cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
      flex-shrink: 0;
    }

    .rm-modal__close:hover {
      background-color: var(--rm-surface-2);
      color: var(--rm-ink);
    }

    .rm-modal__close svg {
      width: 18px;
      height: 18px;
    }

    .rm-modal__body {
      padding: var(--rm-space-lg);
      overflow-y: auto;
      flex: 1;
    }

    .rm-modal__footer {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: var(--rm-space-sm);
      padding: var(--rm-space-md) var(--rm-space-lg);
      border-top: 1px solid var(--rm-line);
      flex-shrink: 0;
    }

    /* 模态框内通用样式 */
    .rm-modal__text {
      font-size: 14px;
      color: var(--rm-ink-2);
      line-height: 1.6;
      margin-bottom: var(--rm-space-md);
    }

    .rm-modal__text:last-child { margin-bottom: 0; }

    /* 进度条 */
    .rm-progress {
      width: 100%;
      height: 8px;
      background-color: var(--rm-bg);
      border-radius: var(--rm-radius-full);
      overflow: hidden;
      margin-bottom: var(--rm-space-md);
    }

    .rm-progress__bar {
      height: 100%;
      width: 0%;
      background: linear-gradient(90deg, var(--rm-brand) 0%, var(--rm-brand-hover) 100%);
      border-radius: var(--rm-radius-full);
      transition: width 300ms cubic-bezier(.2,.8,.2,1);
    }

    .rm-progress__steps {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-sm);
    }

    .rm-progress__step {
      display: flex;
      align-items: center;
      gap: var(--rm-space-sm);
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-progress__step[data-active="true"] {
      color: var(--rm-ink);
      font-weight: 500;
    }

    .rm-progress__step[data-done="true"] {
      color: var(--rm-state-success);
    }

    .rm-progress__dot {
      width: 8px;
      height: 8px;
      border-radius: var(--rm-radius-full);
      background-color: var(--rm-line);
      flex-shrink: 0;
    }

    .rm-progress__step[data-active="true"] .rm-progress__dot {
      background-color: var(--rm-brand);
      box-shadow: 0 0 8px rgba(0,212,255,0.4);
    }

    .rm-progress__step[data-done="true"] .rm-progress__dot {
      background-color: var(--rm-state-success);
    }

    /* 数据表格 */
    .rm-data-table-wrapper {
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
      overflow: hidden;
    }

    .rm-data-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 14px;
    }

    .rm-data-table th,
    .rm-data-table td {
      padding: 12px var(--rm-space-md);
      text-align: left;
      border-bottom: 1px solid var(--rm-line);
      vertical-align: middle;
    }

    .rm-data-table thead th {
      font-weight: 600;
      color: var(--rm-ink-2);
      background-color: var(--rm-surface-2);
      font-size: 13px;
    }

    .rm-data-table tbody tr:nth-child(even) {
      background-color: rgba(0,0,0,0.05);
    }

    .rm-data-table tbody tr:last-child td {
      border-bottom: none;
    }

    .rm-data-table__status {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      font-weight: 500;
    }

    .rm-data-table__dot {
      width: 8px;
      height: 8px;
      border-radius: var(--rm-radius-full);
    }

    .rm-data-table__dot--online { background-color: var(--rm-state-success); box-shadow: 0 0 6px rgba(16,185,129,0.4); }
    .rm-data-table__dot--offline { background-color: var(--rm-state-error); box-shadow: 0 0 6px rgba(239,68,68,0.4); }
    .rm-data-table__dot--warning { background-color: var(--rm-state-warning); box-shadow: 0 0 6px rgba(245,158,11,0.4); }

    .rm-data-table__action {
      background: none;
      border: none;
      color: var(--rm-brand);
      font-size: 13px;
      font-weight: 500;
      cursor: pointer;
      padding: 0;
      font-family: var(--rm-font-sans);
    }

    .rm-data-table__action:hover { color: var(--rm-brand-hover); text-decoration: underline; }

    /* 日志列表 */
    .rm-log-list {
      display: flex;
      flex-direction: column;
      gap: var(--rm-space-md);
    }

    .rm-log-item {
      display: flex;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md);
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm);
    }

    .rm-log-item__time {
      font-family: var(--rm-font-mono);
      font-size: 12px;
      color: var(--rm-ink-3);
      white-space: nowrap;
      flex-shrink: 0;
      min-width: 130px;
    }

    .rm-log-item__content {
      flex: 1;
    }

    .rm-log-item__title {
      font-size: 14px;
      font-weight: 600;
      color: var(--rm-ink);
      margin-bottom: 2px;
    }

    .rm-log-item__desc {
      font-size: 13px;
      color: var(--rm-ink-2);
    }

    .rm-log-item__tag {
      display: inline-flex;
      align-items: center;
      padding: 2px 8px;
      border-radius: var(--rm-radius-sm);
      font-size: 11px;
      font-weight: 600;
      flex-shrink: 0;
      align-self: flex-start;
    }

    .rm-log-item__tag--init { background-color: rgba(0,212,255,0.12); color: var(--rm-brand); }
    .rm-log-item__tag--device { background-color: rgba(139,92,246,0.12); color: var(--rm-state-info); }
    .rm-log-item__tag--maintain { background-color: rgba(100,116,139,0.15); color: var(--rm-ink-2); }

    /* 确认框 */
    .rm-confirm-box {
      display: flex;
      align-items: flex-start;
      gap: var(--rm-space-md);
      padding: var(--rm-space-md);
      background-color: rgba(239,68,68,0.08);
      border: 1px solid rgba(239,68,68,0.25);
      border-radius: var(--rm-radius-sm);
      margin-bottom: var(--rm-space-md);
    }

    .rm-confirm-box__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 24px;
      height: 24px;
      color: var(--rm-state-error);
      flex-shrink: 0;
    }

    .rm-confirm-box__icon svg { width: 24px; height: 24px; }

    .rm-confirm-box__text {
      font-size: 14px;
      color: var(--rm-ink);
      line-height: 1.5;
    }

    /* 响应式 */
    @media (max-width: 1279px) {
      .rm-header { padding: 0 var(--rm-space-md); }
      .rm-content { padding: var(--rm-space-md); }
      .rm-engineering-grid { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 767px) {
      .rm-engineering-grid { grid-template-columns: 1fr; }
      .rm-engineering-header { flex-direction: column; align-items: flex-start; }
      .rm-engineering-header__back { width: 100%; justify-content: center; }
      .rm-header__title { display: none; }
      .rm-modal { max-height: calc(100vh - var(--rm-space-md) * 2); }
      .rm-data-table-wrapper { overflow-x: auto; }
      .rm-data-table { min-width: 520px; }
      .rm-log-item { flex-direction: column; gap: var(--rm-space-sm); }
      .rm-log-item__time { min-width: auto; }
    }

/* ===== 页面样式: 历史报表 ===== */

/* ============================================================
   MartFlow — 品牌设计 Token
   依据：设计方案 §5.2 色彩体系 / §5.3 字体规范 / §5.4 间距栅格 / §5.8 阴影层级
   品牌前缀：rm
   ============================================================ */

/* ---------- 深色模式（默认） ---------- */
:root {
  /* 背景层 */
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;

  /* 边框 */
  --rm-line: #334155;

  /* 文字 */
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;

  /* 品牌色（单一主色） */
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;

  /* 状态色（仅语义状态使用） */
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;

  /* 数据可视化 */
  --rm-chart-flow: #00D4FF;
  --rm-chart-flow-2: #0EA5E9;
  --rm-chart-temp: #F59E0B;
  --rm-chart-temp-2: #EF4444;

  /* 阴影层级（静态阴影 alpha<=0.05，浮动层阴影用于 modal/popover/dropdown） */
  --rm-shadow-1: 0 1px 3px rgba(0,0,0,0.05);
  --rm-shadow-2: 0 4px 12px rgba(0,0,0,0.08);
  --rm-shadow-3: 0 8px 32px rgba(0,0,0,0.12);
  --rm-shadow-alert: 0 0 16px rgba(239,68,68,0.08);
  --rm-shadow-ai: 0 0 12px rgba(0,212,255,0.05);

  /* ---- 语义别名（apply-html-head-contract.mjs 要求） ---- */
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
  --rm-radius-small: 6px;
  --rm-radius-medium: 12px;
  --rm-radius-large: 16px;
}

.dark {
  --rm-bg: #1E293B;
  --rm-surface: #243447;
  --rm-surface-2: #2D3F56;
  --rm-line: #334155;
  --rm-ink: #F1F5F9;
  --rm-ink-2: #94A3B8;
  --rm-ink-3: #64748B;
  --rm-brand: #00D4FF;
  --rm-brand-hover: #0EA5E9;
  --rm-brand-active: #0284C7;
  --rm-brand-ink: #0F172A;
  --rm-state-success: #10B981;
  --rm-state-warning: #F59E0B;
  --rm-state-error: #EF4444;
  --rm-state-info: #8B5CF6;
  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ---------- 高对比度模式（浅色，§5.2 评审决议 R-04） ---------- */
.light {
  --rm-bg: #F8FAFC;
  --rm-surface: #FFFFFF;
  --rm-surface-2: #F1F5F9;

  --rm-line: #CBD5E1;

  --rm-ink: #0F172A;
  --rm-ink-2: #475569;
  --rm-ink-3: #94A3B8;

  --rm-brand: #0284C7;
  --rm-brand-hover: #0369A1;
  --rm-brand-active: #075985;
  --rm-brand-ink: #FFFFFF;

  --rm-state-success: #059669;
  --rm-state-warning: #D97706;
  --rm-state-error: #DC2626;
  --rm-state-info: #7C3AED;

  --rm-shadow-1: 0 1px 3px rgba(15,23,42,0.05);
  --rm-shadow-2: 0 4px 12px rgba(15,23,42,0.08);
  --rm-shadow-3: 0 8px 32px rgba(15,23,42,0.12);
  --rm-shadow-alert: 0 0 16px rgba(220,38,38,0.05);
  --rm-shadow-ai: 0 0 12px rgba(2,132,199,0.05);

  --rm-background: var(--rm-bg);
  --rm-foreground: var(--rm-ink);
  --rm-card: var(--rm-surface);
  --rm-card-foreground: var(--rm-ink);
  --rm-popover: var(--rm-surface-2);
  --rm-popover-foreground: var(--rm-ink);
  --rm-primary: var(--rm-brand);
  --rm-primary-foreground: var(--rm-brand-ink);
  --rm-muted: var(--rm-surface-2);
  --rm-muted-foreground: var(--rm-ink-2);
  --rm-border: var(--rm-line);
  --rm-input: var(--rm-line);
  --rm-ring: var(--rm-brand);
}

/* ============================================================
   字体系统（§5.3）
   ============================================================ */
:root {
  --rm-font-sans: "HarmonyOS Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --rm-font-mono: "DIN Alternate", "Roboto Mono", "JetBrains Mono", monospace;
}

/* 字体角色类 */
.rm-text-display {
  font-family: var(--rm-font-sans);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.rm-text-card-title {
  font-family: var(--rm-font-sans);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
}

.rm-text-body-strong {
  font-family: var(--rm-font-sans);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.rm-text-body {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.rm-text-caption {
  font-family: var(--rm-font-sans);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.005em;
}

.rm-text-data-lg {
  font-family: var(--rm-font-mono);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.2;
}

.rm-text-data-md {
  font-family: var(--rm-font-mono);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
}

.rm-text-llm {
  font-family: var(--rm-font-sans);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
}

/* ============================================================
   间距体系（§5.4，8px 基准）
   ============================================================ */
:root {
  --rm-space-xs: 4px;
  --rm-space-sm: 8px;
  --rm-space-md: 16px;
  --rm-space-lg: 24px;
  --rm-space-xl: 32px;
  --rm-space-2xl: 48px;
}

/* ============================================================
   圆角体系（§5.4）
   ============================================================ */
:root {
  --rm-radius-sm: 6px;
  --rm-radius-md: 12px;
  --rm-radius-lg: 16px;
  --rm-radius-full: 9999px;
}

/* ============================================================
   布局尺寸（§5.4 / §5.6）
   ============================================================ */
:root {
  --rm-layout-header-h: 56px;
  --rm-layout-sidebar-w: 220px;
  --rm-layout-sidebar-collapsed-w: 64px;
  --rm-layout-ai-bar-h: 72px;
  --rm-layout-ai-bar-expanded-h: 320px;
  --rm-layout-card-min-h: 120px;
  --rm-layout-card-padding: 16px;
  --rm-layout-grid-cols: 12;
  --rm-layout-grid-gap: 24px;
  --rm-layout-max-w: 1920px;
  --rm-layout-content-padding: 32px;
}

/* ============================================================
   组件状态规范（§7.5）
   ============================================================ */

/* 按钮基础 */
.rm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rm-space-xs);
  height: 40px;
  padding: 0 24px;
  border-radius: var(--rm-radius-sm);
  font-family: var(--rm-font-sans);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1),
              transform 120ms cubic-bezier(.2,.8,.2,1);
  border: none;
  outline: none;
  white-space: nowrap;
  user-select: none;
}

.rm-btn:active {
  transform: scale(0.98);
}

.rm-btn:focus-visible {
  box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand);
}

/* 主按钮 */
.rm-btn-primary {
  background-color: var(--rm-brand);
  color: var(--rm-brand-ink);
}
.rm-btn-primary:hover {
  background-color: var(--rm-brand-hover);
}

/* 次按钮 */
.rm-btn-secondary {
  background-color: transparent;
  border: 1px solid var(--rm-line);
  color: var(--rm-ink);
}
.rm-btn-secondary:hover {
  border-color: var(--rm-brand);
}

/* 危险按钮 */
.rm-btn-danger {
  background-color: var(--rm-state-error);
  color: #FFFFFF;
}
.rm-btn-danger:hover {
  background-color: #DC2626;
}

/* 禁用态 */
.rm-btn:disabled,
.rm-btn-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* 紧凑尺寸 */
.rm-btn-sm {
  height: 32px;
  padding: 0 16px;
  font-size: 13px;
}

/* 大号尺寸 */
.rm-btn-lg {
  height: 48px;
  padding: 0 32px;
  font-size: 16px;
}

/* ============================================================
   卡片基础（§5.8 阴影与层级）
   ============================================================ */
.rm-card {
  background-color: var(--rm-surface);
  border: 1px solid var(--rm-line);
  border-radius: var(--rm-radius-md);
  padding: var(--rm-layout-card-padding);
  min-height: var(--rm-layout-card-min-h);
  transition: box-shadow 150ms cubic-bezier(.2,.8,.2,1),
              border-color 150ms cubic-bezier(.2,.8,.2,1);
}

.rm-card:hover {
  box-shadow: var(--rm-shadow-2);
}

/* 告警卡片 */
.rm-card-alert {
  border-color: var(--rm-state-error);
  box-shadow: var(--rm-shadow-alert);
  animation: rm-pulse-alert 1.5s ease-in-out infinite;
}

@keyframes rm-pulse-alert {
  0%, 100% { box-shadow: 0 0 16px rgba(239,68,68,0.3); }
  50% { box-shadow: 0 0 24px rgba(239,68,68,0.5); }
}

/* ============================================================
   骨架屏 shimmer（§5.5）
   ============================================================ */
.rm-skeleton {
  background: linear-gradient(
    90deg,
    var(--rm-surface) 0%,
    var(--rm-surface-2) 50%,
    var(--rm-surface) 100%
  );
  background-size: 200% 100%;
  animation: rm-shimmer 1.5s linear infinite;
  border-radius: var(--rm-radius-sm);
}

@keyframes rm-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   状态点（§5.2）
   ============================================================ */
.rm-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--rm-radius-full);
  flex-shrink: 0;
}

.rm-status-dot--success { background-color: var(--rm-state-success); box-shadow: 0 0 8px rgba(16,185,129,0.3); }
.rm-status-dot--warning { background-color: var(--rm-state-warning); box-shadow: 0 0 8px rgba(245,158,11,0.3); }
.rm-status-dot--error { background-color: var(--rm-state-error); box-shadow: 0 0 8px rgba(239,68,68,0.3); }
.rm-status-dot--info { background-color: var(--rm-state-info); }
.rm-status-dot--brand { background-color: var(--rm-brand); }

/* ============================================================
   全局重置
   ============================================================ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: var(--rm-font-sans);
  font-size: 14px;
  color: var(--rm-ink);
  background-color: var(--rm-bg);
}

body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--rm-bg);
}
::-webkit-scrollbar-thumb {
  background: var(--rm-line);
  border-radius: var(--rm-radius-full);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--rm-ink-3);
}

/* 选中文本 */
::selection {
  background-color: rgba(0,212,255,0.25);
  color: var(--rm-ink);
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
/* @theme removed for v3 compat */

    td, th { /* @apply removed */ word-break: break-all; word-break: auto-phrase; }
    th { /* @apply removed */ }
  }
.bg-background { background-color: var(--rm-background); }
      .text-background { color: var(--rm-background); }
      .border-background { border-color: var(--rm-background); }
      .ring-background { --tw-ring-color: var(--rm-background); }
      .bg-foreground { background-color: var(--rm-foreground); }
      .text-foreground { color: var(--rm-foreground); }
      .border-foreground { border-color: var(--rm-foreground); }
      .ring-foreground { --tw-ring-color: var(--rm-foreground); }
      .bg-card { background-color: var(--rm-card); }
      .text-card { color: var(--rm-card); }
      .border-card { border-color: var(--rm-card); }
      .ring-card { --tw-ring-color: var(--rm-card); }
      .bg-card-foreground { background-color: var(--rm-card-foreground); }
      .text-card-foreground { color: var(--rm-card-foreground); }
      .border-card-foreground { border-color: var(--rm-card-foreground); }
      .ring-card-foreground { --tw-ring-color: var(--rm-card-foreground); }
      .bg-popover { background-color: var(--rm-popover); }
      .text-popover { color: var(--rm-popover); }
      .border-popover { border-color: var(--rm-popover); }
      .ring-popover { --tw-ring-color: var(--rm-popover); }
      .bg-popover-foreground { background-color: var(--rm-popover-foreground); }
      .text-popover-foreground { color: var(--rm-popover-foreground); }
      .border-popover-foreground { border-color: var(--rm-popover-foreground); }
      .ring-popover-foreground { --tw-ring-color: var(--rm-popover-foreground); }
      .bg-primary { background-color: var(--rm-primary); }
      .text-primary { color: var(--rm-primary); }
      .border-primary { border-color: var(--rm-primary); }
      .ring-primary { --tw-ring-color: var(--rm-primary); }
      .bg-primary-foreground { background-color: var(--rm-primary-foreground); }
      .text-primary-foreground { color: var(--rm-primary-foreground); }
      .border-primary-foreground { border-color: var(--rm-primary-foreground); }
      .ring-primary-foreground { --tw-ring-color: var(--rm-primary-foreground); }
      .bg-muted { background-color: var(--rm-muted); }
      .text-muted { color: var(--rm-muted); }
      .border-muted { border-color: var(--rm-muted); }
      .ring-muted { --tw-ring-color: var(--rm-muted); }
      .bg-muted-foreground { background-color: var(--rm-muted-foreground); }
      .text-muted-foreground { color: var(--rm-muted-foreground); }
      .border-muted-foreground { border-color: var(--rm-muted-foreground); }
      .ring-muted-foreground { --tw-ring-color: var(--rm-muted-foreground); }
      .bg-border { background-color: var(--rm-border); }
      .text-border { color: var(--rm-border); }
      .border-border { border-color: var(--rm-border); }
      .ring-border { --tw-ring-color: var(--rm-border); }
      .bg-input { background-color: var(--rm-input); }
      .text-input { color: var(--rm-input); }
      .border-input { border-color: var(--rm-input); }
      .ring-input { --tw-ring-color: var(--rm-input); }
      .bg-ring { background-color: var(--rm-ring); }
      .text-ring { color: var(--rm-ring); }
      .border-ring { border-color: var(--rm-ring); }
      .ring-ring { --tw-ring-color: var(--rm-ring); }
.no-scrollbar::-webkit-scrollbar { display: none; }
      .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
      [data-icon] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        -webkit-mask-size: contain;
        mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        background-color: currentColor;
      }
/* ====== 应用框架布局 ====== */
    .rm-app {
      display: flex;
      flex-direction: column;
      height: 100vh;
      background-color: var(--rm-bg);
      overflow: hidden;
    }

    /* 顶部状态栏 */
    .rm-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--rm-layout-header-h);
      padding: 0 var(--rm-layout-content-padding);
      background-color: var(--rm-surface);
      border-bottom: 1px solid var(--rm-line);
      flex-shrink: 0;
      z-index: 100;
    }
    .rm-header__left { display: flex; align-items: center; gap: var(--rm-space-md); }
    .rm-header__logo { display: flex; align-items: center; gap: var(--rm-space-sm); }
    .rm-header__logo-icon {
      width: 28px; height: 28px; border-radius: var(--rm-radius-sm);
      background: linear-gradient(135deg, var(--rm-brand) 0%, var(--rm-brand-active) 100%);
      display: flex; align-items: center; justify-content: center;
      font-size: 16px; font-weight: 700; color: var(--rm-brand-ink);
    }
    .rm-header__title { font-size: 16px; font-weight: 600; color: var(--rm-ink); }
    .rm-header__right { display: flex; align-items: center; gap: var(--rm-space-lg); }
    .rm-header__status { display: flex; align-items: center; gap: var(--rm-space-xs); font-size: 13px; color: var(--rm-ink-2); }
    .rm-header__status-value { color: var(--rm-state-success); font-weight: 600; }
    .rm-header__actions { display: flex; align-items: center; gap: var(--rm-space-sm); }
    .rm-header__btn {
      display: flex; align-items: center; justify-content: center;
      width: 36px; height: 36px; border-radius: var(--rm-radius-sm);
      border: 1px solid transparent; background-color: transparent;
      color: var(--rm-ink-2); cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-header__btn:hover { background-color: var(--rm-surface-2); color: var(--rm-ink); border-color: var(--rm-line); }
    .rm-header__btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; }

    /* 主内容区 */
    .rm-body { flex: 1; overflow: hidden; position: relative; display: flex; }
    .rm-content {
      flex: 1; height: 100%; overflow-y: auto; padding: var(--rm-layout-content-padding);
      background-color: var(--rm-bg);
    }
    .rm-content__inner { max-width: var(--rm-layout-max-w); margin: 0 auto; min-height: 100%; }

    /* ====== 页面标题 ====== */
    .rm-page-title {
      display: flex; align-items: flex-start; justify-content: space-between;
      flex-wrap: wrap; gap: var(--rm-space-md); margin-bottom: var(--rm-space-xl);
    }
    .rm-page-title__left { display: flex; align-items: center; gap: var(--rm-space-md); }
    .rm-back-btn {
      display: inline-flex; align-items: center; justify-content: center; gap: var(--rm-space-xs);
      height: 36px; padding: 0 16px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: transparent;
      color: var(--rm-ink-2); font-family: var(--rm-font-sans); font-size: 13px; font-weight: 500; cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1); flex-shrink: 0;
    }
    .rm-back-btn:hover { border-color: var(--rm-brand); color: var(--rm-brand); background-color: rgba(0, 212, 255, 0.06); }
    .rm-back-btn:focus-visible { box-shadow: 0 0 0 2px var(--rm-bg), 0 0 0 4px var(--rm-brand); outline: none; }
    .rm-back-btn svg { stroke: currentColor; }
    .rm-page-title__h1 { font-size: 22px; font-weight: 700; color: var(--rm-ink); line-height: 1.3; }
    .rm-page-title__sub { font-size: 13px; color: var(--rm-ink-2); margin-top: var(--rm-space-xs); }

    /* 状态演示 */
    .rm-state-demo { position: relative; display: inline-flex; align-items: center; gap: var(--rm-space-xs); }
    .rm-state-demo__tip {
      position: absolute; top: calc(100% + 8px); right: 0; z-index: 110;
      width: 280px; max-width: calc(100vw - 32px);
      background-color: var(--rm-surface-2); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); padding: var(--rm-space-sm);
      box-shadow: var(--rm-shadow-3); font-size: 12px; line-height: 1.5;
      color: var(--rm-ink-2); opacity: 0; visibility: hidden;
      transition: opacity 150ms ease, visibility 150ms ease;
    }
    .rm-state-demo:hover .rm-state-demo__tip,
    .rm-state-demo__tip:hover { opacity: 1; visibility: visible; }
    .rm-state-demo__tip strong { color: var(--rm-ink); }
    .rm-state-demo__badge {
      display: inline-flex; align-items: center; height: 20px; padding: 0 8px;
      border-radius: var(--rm-radius-sm); background-color: var(--rm-brand);
      color: var(--rm-brand-ink); font-size: 11px; font-weight: 600;
    }

    /* ====== 全局查询栏 ====== */
    .rm-query-bar { margin-bottom: var(--rm-space-lg); padding: var(--rm-space-md); }
    .rm-query-row { display: flex; align-items: flex-end; flex-wrap: wrap; gap: var(--rm-space-md); }
    .rm-query-row--primary {
      display: grid;
      /* 4列布局：数据源(固定340+弹性) → 时间范围(最宽6个按钮) → 关键字(搜索框) → 操作按钮(auto紧排) */
      grid-template-columns: minmax(340px, 1.05fr) minmax(340px, 1.4fr) minmax(260px, 1fr) auto;
      align-items: end;
      gap: var(--rm-space-md);
      /* 使用grid-template-areas精确定位，避免2列模式下元素顺序不合理 */
      grid-template-areas: "sources time search actions";
    }
    /* 为每个查询字段指定grid-area，用于后续响应式重排 */
    .rm-query-field--sources { grid-area: sources; }
    .rm-query-field--time    { grid-area: time; }
    .rm-query-field--search  { grid-area: search; }
    .rm-query-field--actions { grid-area: actions; }

    .rm-query-field { display: flex; flex-direction: column; gap: var(--rm-space-xs); min-width: 0; }
    .rm-query-field__label { font-size: 12px; color: var(--rm-ink-2); font-weight: 500; }
    /* 数据源区域：足够宽度容纳5个Chip(全部+运营+CV+IoT+AI运营) */
    .rm-query-field--sources { min-width: 320px; }
    .rm-query-field--time { min-width: 320px; position: relative; }
    .rm-query-field--search { min-width: 240px; position: relative; }
    .rm-query-field--actions { flex: 0 0 auto; white-space: nowrap; }
    .rm-query-actions { display: flex; gap: var(--rm-space-xs); }

    /* ===== 响应式断点（三档）===== */
    /* (1) 宽屏 >=1024px：标准4列布局，数据源窄(1.05fr) / 时间最宽(1.4fr) / 搜索中 / 按钮紧排 */
    @media (min-width: 1024px) {
      .rm-query-row--primary {
        grid-template-columns: minmax(340px, 1.05fr) minmax(360px, 1.4fr) minmax(260px, 1fr) auto;
        grid-template-areas: "sources time search actions";
      }
    }
    /* (2) 中等屏幕 680~1023px：2×2 不均匀网格（左列42%：数据源/搜索；右列58%：时间/操作右对齐） */
    @media (max-width: 1023px) and (min-width: 680px) {
      .rm-query-row--primary {
        grid-template-columns: 42% 58%;
        grid-template-areas:
          "sources time"
          "search  actions";
      }
      .rm-query-field--actions { justify-self: end; }
    }
    /* (3) 窄屏 <680px：单列堆叠，按钮铺满 */
    @media (max-width: 679px) {
      .rm-query-row--primary {
        grid-template-columns: 1fr;
        grid-template-areas:
          "sources"
          "time"
          "search"
          "actions";
      }
      .rm-query-field--sources { min-width: 0; }
      .rm-query-field--time    { min-width: 0; }
      .rm-query-field--search  { min-width: 0; }
      .rm-query-field--actions { justify-self: stretch; }
      .rm-query-actions        { width: 100%; }
      .rm-query-actions .rm-btn { flex: 1; }
    }

    /* 数据源切换 */
    .rm-source-chips { display: flex; flex-wrap: wrap; gap: var(--rm-space-xs); }
    .rm-source-chip {
      display: inline-flex; align-items: center; gap: var(--rm-space-xs);
      height: 36px; padding: 0 14px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: transparent;
      color: var(--rm-ink-2); font-size: 13px; font-weight: 600; cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-source-chip:hover { border-color: var(--rm-brand); color: var(--rm-ink); }
    .rm-source-chip--active { background-color: var(--rm-brand); border-color: var(--rm-brand); color: var(--rm-brand-ink); }

    /* 时间范围 */
    .rm-date-range {
      display: inline-flex; align-items: center; flex-wrap: wrap;
      background-color: var(--rm-bg);
      border: 1px solid var(--rm-line); border-radius: var(--rm-radius-sm); overflow: hidden;
    }
    .rm-date-range__btn {
      height: 34px; padding: 0 12px; border: none; background-color: transparent;
      color: var(--rm-ink-2); font-size: 12px; font-weight: 500; cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1); white-space: nowrap;
    }
    .rm-date-range__btn:hover { background-color: var(--rm-surface-2); color: var(--rm-ink); }
    .rm-date-range__btn--active { background-color: var(--rm-brand); color: var(--rm-brand-ink); }
    .rm-date-range__btn--active:hover { background-color: var(--rm-brand-hover); color: var(--rm-brand-ink); }
    .rm-date-range__btn--custom { border-left: 1px solid var(--rm-line); }

    /* 自定义时间范围面板 */
    .rm-custom-date {
      position: absolute; top: calc(100% + 6px); left: 0; z-index: 100;
      width: 360px; max-width: calc(100vw - 32px);
      background-color: var(--rm-surface-2); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); padding: var(--rm-space-md);
      box-shadow: var(--rm-shadow-3);
    }
    .rm-custom-date__head {
      display: flex; align-items: center; justify-content: space-between;
      margin-bottom: var(--rm-space-sm);
    }
    .rm-custom-date__title { font-size: 13px; font-weight: 600; color: var(--rm-ink); }
    .rm-custom-date__close {
      display: inline-flex; align-items: center; justify-content: center;
      width: 24px; height: 24px; border: none; border-radius: var(--rm-radius-sm);
      background: transparent; color: var(--rm-ink-2); cursor: pointer;
    }
    .rm-custom-date__close:hover { background-color: var(--rm-surface); color: var(--rm-ink); }
    .rm-custom-date__row { display: flex; align-items: flex-end; gap: var(--rm-space-xs); margin-bottom: var(--rm-space-sm); }
    .rm-custom-date__field { flex: 1; display: flex; flex-direction: column; gap: 4px; }
    .rm-custom-date__field label { font-size: 11px; color: var(--rm-ink-2); }
    .rm-custom-date__sep { padding-bottom: 8px; font-size: 12px; color: var(--rm-ink-3); }
    .rm-custom-date__actions { display: flex; justify-content: flex-end; gap: var(--rm-space-xs); }
    @media (max-width: 768px) {
      .rm-custom-date { left: auto; right: 0; width: calc(100vw - 32px); }
      .rm-custom-date__row { flex-direction: column; align-items: stretch; }
      .rm-custom-date__sep { text-align: center; padding: 4px 0; }
    }

    /* 搜索框 */
    .rm-search-box {
      display: flex; align-items: center; gap: var(--rm-space-xs);
      height: 36px; padding: 0 12px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: var(--rm-bg);
      min-width: 260px;
    }
    .rm-search-box__icon { color: var(--rm-ink-3); }
    .rm-search-box__input {
      flex: 1; border: none; background: transparent; color: var(--rm-ink); font-size: 13px; outline: none;
    }
    .rm-search-box__input::placeholder { color: var(--rm-ink-3); }
    .rm-search-box__history {
      display: flex; align-items: center; justify-content: center;
      width: 24px; height: 24px; border-radius: var(--rm-radius-sm);
      border: none; background: transparent; color: var(--rm-ink-2); cursor: pointer;
    }
    .rm-search-box__history:hover { color: var(--rm-brand); }

    /* 搜索历史占位 */
    .rm-search-history {
      position: absolute; top: calc(100% + 4px); left: 0; right: 0;
      background-color: var(--rm-surface-2); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-sm); padding: var(--rm-space-sm);
      box-shadow: var(--rm-shadow-3); z-index: 90; display: none;
    }
    .rm-search-history__title { font-size: 12px; color: var(--rm-ink-3); margin-bottom: var(--rm-space-xs); }
    .rm-search-history__item {
      padding: 6px 8px; border-radius: var(--rm-radius-sm); color: var(--rm-ink); font-size: 13px;
      cursor: pointer;
    }
    .rm-search-history__item:hover { background-color: var(--rm-surface); color: var(--rm-brand); }

    /* 高级筛选面板 */
    .rm-advanced-panel {
      max-height: 0; overflow: hidden; transition: max-height 300ms ease;
      border-top: 1px solid transparent;
    }
    .rm-advanced-panel--open {
      max-height: 600px; border-top-color: var(--rm-line); margin-top: var(--rm-space-md); padding-top: var(--rm-space-md);
    }
    .rm-advanced-panel__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--rm-space-md); }
    .rm-btn--active { border-color: var(--rm-brand); color: var(--rm-brand); }

    /* ====== 左侧筛选面板 ====== */
    .rm-filter-panel {
      width: var(--rm-layout-sidebar-w); flex-shrink: 0;
      background-color: var(--rm-surface); border-right: 1px solid var(--rm-line);
      display: flex; flex-direction: column;
      transition: transform 250ms ease;
    }
    .rm-filter-panel__header {
      display: flex; align-items: center; justify-content: space-between;
      padding: var(--rm-space-md) var(--rm-space-lg); border-bottom: 1px solid var(--rm-line);
    }
    .rm-filter-panel__title { font-size: 15px; font-weight: 600; color: var(--rm-ink); }
    .rm-filter-panel__close {
      display: none; align-items: center; justify-content: center;
      width: 28px; height: 28px; border-radius: var(--rm-radius-sm);
      border: none; background: transparent; color: var(--rm-ink-2); cursor: pointer;
    }
    .rm-filter-panel__body { flex: 1; overflow-y: auto; padding: var(--rm-space-md) var(--rm-space-lg); }
    .rm-filter-panel__footer {
      display: flex; flex-direction: column; gap: var(--rm-space-sm);
      padding: var(--rm-space-md) var(--rm-space-lg); border-top: 1px solid var(--rm-line);
    }
    .w-full { width: 100%; }

    .rm-filter-group { margin-bottom: var(--rm-space-lg); }
    .rm-filter-group__label { font-size: 13px; font-weight: 600; color: var(--rm-ink); margin-bottom: var(--rm-space-sm); }
    .rm-filter-group__options { display: flex; flex-wrap: wrap; gap: var(--rm-space-xs); }
    .rm-filter-group__options--inline { justify-content: flex-end; }
    .rm-check-chip {
      display: inline-flex; align-items: center; gap: var(--rm-space-xs);
      height: 28px; padding: 0 10px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: transparent;
      color: var(--rm-ink-2); font-size: 12px; cursor: pointer;
      transition: all 150ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-check-chip:hover { border-color: var(--rm-brand); color: var(--rm-ink); }
    .rm-check-chip input { accent-color: var(--rm-brand); cursor: pointer; }
    .rm-check-chip--ghost { background-color: var(--rm-bg); }
    .rm-check-chip--p0 { border-color: rgba(239,68,68,0.4); color: var(--rm-state-error); }
    .rm-check-chip--p1 { border-color: rgba(245,158,11,0.4); color: var(--rm-state-warning); }
    .rm-check-chip--p2 { border-color: rgba(139,92,246,0.4); color: var(--rm-state-info); }
    .rm-check-chip--p3 { border-color: rgba(100,116,139,0.4); color: var(--rm-ink-2); }
    .rm-check-chip--info { border-color: rgba(0,212,255,0.4); color: var(--rm-brand); }

    .rm-range-inputs { display: flex; align-items: center; gap: var(--rm-space-xs); }
    .rm-range-inputs__sep { color: var(--rm-ink-3); }
    .rm-input {
      height: 36px; padding: 0 12px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: var(--rm-bg);
      color: var(--rm-ink); font-size: 13px; outline: none; width: 100%;
    }
    .rm-input--sm { height: 32px; font-size: 12px; }
    .rm-input:focus { border-color: var(--rm-brand); }
    .mt-2 { margin-top: var(--rm-space-sm); }
    .mt-4 { margin-top: var(--rm-space-md); }
    .mt-6 { margin-top: var(--rm-space-lg); }

    /* ====== 统计摘要卡片 ====== */
    .rm-summary-cards {
      display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--rm-space-lg);
      margin-bottom: var(--rm-space-xl);
    }
    .rm-summary-card {
      background-color: var(--rm-surface); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); padding: var(--rm-space-lg);
      transition: box-shadow 150ms ease;
    }
    .rm-summary-card:hover { box-shadow: var(--rm-shadow-2); }
    .rm-summary-card__label { font-size: 13px; color: var(--rm-ink-2); margin-bottom: var(--rm-space-sm); }
    .rm-summary-card__value {
      font-family: var(--rm-font-mono); font-size: 28px; font-weight: 700;
      color: var(--rm-ink); margin-bottom: var(--rm-space-xs);
    }
    .rm-summary-card__change { display: inline-flex; align-items: center; gap: var(--rm-space-xs); font-size: 12px; color: var(--rm-ink-2); }
    .rm-summary-card--alert { border-left: 3px solid var(--rm-state-error); }
    .rm-summary-card--pending { border-left: 3px solid var(--rm-state-warning); }
    .rm-summary-card--resolved { border-left: 3px solid var(--rm-state-success); }

    /* ====== 视图 Tab ====== */
    .rm-view-tabs {
      display: flex; align-items: center; gap: var(--rm-space-xs);
      margin-bottom: var(--rm-space-xl); border-bottom: 1px solid var(--rm-line);
      padding-bottom: var(--rm-space-sm);
    }
    .rm-view-tabs__btn {
      display: inline-flex; align-items: center; gap: var(--rm-space-xs);
      height: 40px; padding: 0 18px; border: none; border-radius: var(--rm-radius-sm);
      background-color: transparent; color: var(--rm-ink-2); font-size: 14px;
      font-weight: 600; cursor: pointer; transition: all 150ms cubic-bezier(.2,.8,.2,1);
      position: relative;
    }
    .rm-view-tabs__btn:hover { background-color: var(--rm-surface); color: var(--rm-ink); }
    .rm-view-tabs__btn--active { background-color: var(--rm-surface); color: var(--rm-brand); }
    .rm-view-tabs__btn--active::after {
      content: ''; position: absolute; left: 12px; right: 12px; bottom: -9px;
      height: 2px; background-color: var(--rm-brand); border-radius: 1px;
    }

    /* ====== 视图面板 ====== */
    .rm-view-panel { display: none; }
    .rm-view-panel--active { display: block; animation: rm-fade-in 200ms ease-out; }
    @keyframes rm-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

    .rm-panel-toolbar {
      display: flex; align-items: center; justify-content: space-between;
      flex-wrap: wrap; gap: var(--rm-space-md); margin-bottom: var(--rm-space-lg);
    }
    .rm-panel-toolbar__left { display: flex; align-items: center; gap: var(--rm-space-sm); }
    .rm-panel-toolbar__title { font-size: 15px; font-weight: 600; color: var(--rm-ink); }
    .rm-panel-toolbar__count { font-size: 13px; color: var(--rm-ink-3); }
    .rm-panel-toolbar__right { display: flex; align-items: center; gap: var(--rm-space-xs); flex-wrap: wrap; }

    /* ====== 通用状态占位 ====== */
    .rm-state {
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      gap: var(--rm-space-md); padding: var(--rm-space-2xl); color: var(--rm-ink-3);
      text-align: center; background-color: var(--rm-surface); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md);
    }
    .rm-state--compact { padding: var(--rm-space-xl); }
    .rm-state__title { font-size: 16px; font-weight: 600; color: var(--rm-ink); }
    .rm-state__desc { font-size: 13px; color: var(--rm-ink-2); max-width: 480px; }
    .rm-state--error .rm-state__title { color: var(--rm-state-error); }
    .rm-state--boundary .rm-state__title { color: var(--rm-state-warning); }

    /* ====== 综合时间轴 ====== */
    .rm-timeline { position: relative; padding-left: 28px; }
    .rm-timeline::before {
      content: ''; position: absolute; left: 7px; top: 8px; bottom: 8px;
      width: 2px; background-color: var(--rm-line); border-radius: 1px;
    }
    .rm-timeline__group { margin-bottom: var(--rm-space-xl); }
    .rm-timeline__date {
      font-family: var(--rm-font-mono); font-size: 13px; font-weight: 600;
      color: var(--rm-ink); margin-bottom: var(--rm-space-md); margin-left: -28px;
    }
    .rm-timeline__items { display: flex; flex-direction: column; gap: var(--rm-space-lg); }
    .rm-timeline__item { position: relative; cursor: pointer; }
    .rm-timeline__dot {
      position: absolute; left: -24px; top: 14px; width: 12px; height: 12px;
      border-radius: var(--rm-radius-full); background-color: var(--rm-surface);
      border: 2px solid var(--rm-line); z-index: 1;
    }
    .rm-timeline__item--operation .rm-timeline__dot { border-color: var(--rm-brand); background-color: var(--rm-brand); }
    .rm-timeline__item--cv .rm-timeline__dot { border-color: var(--rm-state-info); background-color: var(--rm-state-info); }
    .rm-timeline__item--iot .rm-timeline__dot { border-color: var(--rm-state-warning); background-color: var(--rm-state-warning); }
    /* AI运营报告时间轴点：紫色标识 */
    .rm-timeline__item--aireport .rm-timeline__dot { border-color: #8b5cf6; background-color: #8b5cf6; }
    .rm-timeline__item--alert .rm-timeline__card { border-color: var(--rm-state-error); box-shadow: var(--rm-shadow-alert); }
    .rm-timeline__card {
      background-color: var(--rm-surface); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); padding: var(--rm-space-md);
      transition: box-shadow 150ms ease, border-color 150ms ease;
    }
    .rm-timeline__item:hover .rm-timeline__card { box-shadow: var(--rm-shadow-2); border-color: var(--rm-brand); }
    .rm-timeline__header {
      display: flex; align-items: center; gap: var(--rm-space-sm); flex-wrap: wrap;
      margin-bottom: var(--rm-space-sm);
    }
    .rm-timeline__source {
      display: inline-flex; align-items: center; gap: var(--rm-space-xs);
      font-size: 12px; font-weight: 600; color: var(--rm-ink-2);
    }
    .rm-timeline__time { font-family: var(--rm-font-mono); font-size: 12px; color: var(--rm-ink-3); }
    .rm-timeline__title { font-size: 15px; font-weight: 600; color: var(--rm-ink); margin-bottom: var(--rm-space-xs); }
    .rm-timeline__desc { font-size: 13px; color: var(--rm-ink-2); line-height: 1.6; }

    /* ====== 数据表格 ====== */
    .rm-table-wrap { background-color: var(--rm-surface); border: 1px solid var(--rm-line); border-radius: var(--rm-radius-md); overflow: hidden; }
    .rm-table { width: 100%; border-collapse: collapse; font-size: 13px; }
    .rm-table th, .rm-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--rm-line); }
    .rm-table th { background-color: var(--rm-surface-2); color: var(--rm-ink-2); font-weight: 600; }
    .rm-table tr:last-child td { border-bottom: none; }
    .rm-table td { color: var(--rm-ink); }
    .rm-table tr:hover td { background-color: rgba(0,212,255,0.04); }
    .rm-table__num { font-family: var(--rm-font-mono); font-variant-numeric: tabular-nums; }
    .rm-table__mono { font-family: var(--rm-font-mono); }
    .rm-table__check { width: 40px; text-align: center; }
    .rm-table__actions { display: flex; align-items: center; gap: var(--rm-space-xs); }
    .rm-table__actions .rm-btn-sm { height: 28px; padding: 0 12px; font-size: 12px; }
    .rm-table__ellipsis {
      max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .rm-table__row--alert { background-color: rgba(239,68,68,0.06); }

    /* ====== 标签徽章 ====== */
    .rm-badge {
      display: inline-flex; align-items: center; gap: var(--rm-space-xs);
      height: 22px; padding: 0 10px; border-radius: var(--rm-radius-full);
      font-size: 12px; font-weight: 500;
    }
    .rm-badge--p0 { background-color: rgba(239,68,68,0.15); color: var(--rm-state-error); }
    .rm-badge--p1 { background-color: rgba(245,158,11,0.15); color: var(--rm-state-warning); }
    .rm-badge--p2 { background-color: rgba(139,92,246,0.15); color: var(--rm-state-info); }
    .rm-badge--p3 { background-color: rgba(100,116,139,0.15); color: var(--rm-ink-2); }
    .rm-badge--info { background-color: rgba(0,212,255,0.15); color: var(--rm-brand); }
    .rm-badge--status { background-color: var(--rm-surface-2); color: var(--rm-ink-2); }
    .rm-badge--error { background-color: rgba(239,68,68,0.15); color: var(--rm-state-error); }
    .rm-source-tag {
      display: inline-flex; align-items: center; height: 24px; padding: 0 10px;
      border-radius: var(--rm-radius-sm); font-size: 12px; font-weight: 600;
    }
    .rm-source-tag--operation { background-color: rgba(0,212,255,0.12); color: var(--rm-brand); }
    .rm-source-tag--cv { background-color: rgba(37,99,235,0.12); color: #2563eb; } /* 深蓝（避免和原AI报告紫色撞色） */
    .rm-source-tag--iot { background-color: rgba(245,158,11,0.12); color: var(--rm-state-warning); }
    /* ====== 新增五分类独立颜色：AI报告=靛青 / AI建议=粉紫 ====== */
    .rm-source-tag--aireport { background-color: rgba(139,92,246,0.12); color: #8b5cf6; } /* 兼容旧类：紫 */
    .rm-source-tag--ai-report { background-color: rgba(99,102,241,0.12); color: #6366f1; } /* AI报告（周期）：靛青 */
    .rm-source-tag--ai-advice { background-color: rgba(236,72,153,0.12); color: #ec4899; } /* AI建议（实时）：粉紫 */

    /* ====== 分页 ====== */
    .rm-pagination {
      display: flex; align-items: center; justify-content: space-between;
      flex-wrap: wrap; gap: var(--rm-space-md); margin-top: var(--rm-space-lg);
    }
    .rm-pagination__info { font-size: 13px; color: var(--rm-ink-2); }
    .rm-pagination__size { display: flex; align-items: center; gap: var(--rm-space-xs); font-size: 13px; color: var(--rm-ink-2); }
    .rm-pagination__pages { display: flex; align-items: center; gap: var(--rm-space-xs); }
    .rm-pagination__btn {
      display: inline-flex; align-items: center; justify-content: center;
      min-width: 32px; height: 32px; padding: 0 8px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: var(--rm-surface);
      color: var(--rm-ink); font-size: 13px; cursor: pointer;
    }
    .rm-pagination__btn:hover:not(:disabled) { border-color: var(--rm-brand); color: var(--rm-brand); }
    .rm-pagination__btn--active { background-color: var(--rm-brand); border-color: var(--rm-brand); color: var(--rm-brand-ink); }
    .rm-pagination__btn:disabled { opacity: 0.4; cursor: not-allowed; }
    .rm-pagination__ellipsis { color: var(--rm-ink-3); padding: 0 4px; }

    /* ====== 经营趋势 ====== */
    .rm-trend-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--rm-space-lg); margin-bottom: var(--rm-space-xl); }
    .rm-trend-card {
      background-color: var(--rm-surface); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); padding: var(--rm-space-lg);
    }
    .rm-trend-card__label { font-size: 13px; color: var(--rm-ink-2); margin-bottom: var(--rm-space-sm); }
    .rm-trend-card__value { font-family: var(--rm-font-mono); font-size: 28px; font-weight: 700; color: var(--rm-ink); margin-bottom: var(--rm-space-xs); }
    .rm-trend-card__change { display: inline-flex; align-items: center; gap: var(--rm-space-xs); font-size: 13px; font-weight: 500; }
    .rm-trend-card__change--up { color: var(--rm-state-success); }
    .rm-trend-card__change--down { color: var(--rm-state-error); }

    .rm-metric-config { display: flex; flex-wrap: wrap; gap: var(--rm-space-xs); }
    .rm-chart-type { display: flex; gap: var(--rm-space-xs); }
    .rm-chart-type__btn {
      display: inline-flex; align-items: center; justify-content: center;
      width: 32px; height: 32px; border-radius: var(--rm-radius-sm);
      border: 1px solid var(--rm-line); background-color: var(--rm-surface);
      color: var(--rm-ink-2); cursor: pointer;
    }
    .rm-chart-type__btn:hover { border-color: var(--rm-brand); color: var(--rm-brand); }
    .rm-chart-type__btn--active { background-color: var(--rm-brand); border-color: var(--rm-brand); color: var(--rm-brand-ink); }

    .rm-chart-card__header {
      display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--rm-space-md);
    }
    .rm-chart-card__title { font-size: 14px; font-weight: 600; color: var(--rm-ink); }
    .rm-chart-card__hint { font-size: 12px; color: var(--rm-ink-3); }
    .rm-chart-placeholder {
      position: relative; height: 240px; background-color: var(--rm-bg);
      border-radius: var(--rm-radius-sm); overflow: hidden;
      display: flex; flex-direction: column; align-items: center; justify-content: center;
    }
    .rm-chart-placeholder__svg {
      position: absolute; inset: 0; width: 100%; height: 100%;
    }
    .rm-chart-placeholder__legend {
      position: relative; z-index: 1; display: flex; gap: var(--rm-space-lg);
      background-color: rgba(30,41,59,0.85); padding: 6px 14px;
      border-radius: var(--rm-radius-full); font-size: 12px; color: var(--rm-ink-2);
    }
    .rm-chart-placeholder__legend span { display: inline-flex; align-items: center; gap: var(--rm-space-xs); }

    /* ====== CV 事件 ====== */
    .rm-cv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--rm-space-lg); }
    .rm-cv-card { display: flex; flex-direction: column; cursor: pointer; }
    .rm-cv-card__thumb {
      position: relative; height: 160px; background-color: var(--rm-bg);
      border-radius: var(--rm-radius-sm); display: flex; align-items: center;
      justify-content: center; color: var(--rm-ink-3); margin-bottom: var(--rm-space-md);
      border: 1px dashed var(--rm-line);
    }
    .rm-cv-card__badge {
      position: absolute; top: 10px; right: 10px;
      height: 24px; padding: 0 10px; border-radius: var(--rm-radius-full);
      background-color: var(--rm-state-warning); color: var(--rm-brand-ink);
      font-size: 12px; font-weight: 600; display: inline-flex; align-items: center;
    }
    .rm-cv-card__badge--resolved { background-color: var(--rm-state-success); color: #fff; }
    .rm-cv-card__body { flex: 1; margin-bottom: var(--rm-space-md); }
    .rm-cv-card__meta { display: flex; align-items: center; gap: var(--rm-space-sm); margin-bottom: var(--rm-space-xs); }
    .rm-cv-card__time { font-family: var(--rm-font-mono); font-size: 12px; color: var(--rm-ink-3); }
    .rm-cv-card__title { font-size: 15px; font-weight: 600; color: var(--rm-ink); margin-bottom: var(--rm-space-xs); }
    .rm-cv-card__desc { font-size: 13px; color: var(--rm-ink-2); }
    .rm-cv-card__actions { display: flex; gap: var(--rm-space-xs); }

    /* 视频回放占位 */
    .rm-video-player__header {
      display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--rm-space-md);
    }
    .rm-video-player__title { font-size: 14px; font-weight: 600; color: var(--rm-ink); }
    .rm-video-player__hint { font-size: 12px; color: var(--rm-ink-3); }
    .rm-video-player__screen {
      height: 320px; background: linear-gradient(135deg, var(--rm-surface-2) 0%, var(--rm-bg) 100%);
      border-radius: var(--rm-radius-sm); display: flex; flex-direction: column;
      align-items: center; justify-content: center; gap: var(--rm-space-md); color: var(--rm-ink-3);
    }

    /* ====== IoT 异常高亮 ====== */
    .rm-table__row--alert td { background-color: rgba(239,68,68,0.06); }
    .rm-table__row--alert:hover td { background-color: rgba(239,68,68,0.1); }

    /* ====== 详情抽屉 ====== */
    .rm-drawer-overlay {
      position: fixed; inset: 0; background-color: rgba(0,0,0,0.5);
      opacity: 0; visibility: hidden; transition: all 250ms ease; z-index: 150;
    }
    .rm-drawer-overlay--open { opacity: 1; visibility: visible; }
    .rm-drawer {
      position: fixed; top: 0; right: 0; bottom: 0; width: 520px;
      background-color: var(--rm-surface); border-left: 1px solid var(--rm-line);
      box-shadow: var(--rm-shadow-3); z-index: 160;
      display: flex; flex-direction: column;
      transform: translateX(100%); transition: transform 300ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-drawer--open { transform: translateX(0); }
    .rm-drawer-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: var(--rm-space-md) var(--rm-space-lg); border-bottom: 1px solid var(--rm-line); flex-shrink: 0;
    }
    .rm-drawer-header__left { display: flex; align-items: center; gap: var(--rm-space-sm); }
    .rm-drawer-header__title { font-size: 16px; font-weight: 600; color: var(--rm-ink); }
    .rm-drawer-header__close {
      display: flex; align-items: center; justify-content: center;
      width: 32px; height: 32px; border-radius: var(--rm-radius-sm);
      border: none; background: transparent; color: var(--rm-ink-2); cursor: pointer;
    }
    .rm-drawer-header__close:hover { background-color: var(--rm-surface-2); color: var(--rm-ink); }
    .rm-drawer-body { flex: 1; overflow-y: auto; padding: var(--rm-space-lg); }
    .rm-drawer-section { margin-bottom: var(--rm-space-xl); }
    .rm-drawer-section__title { font-size: 14px; font-weight: 600; color: var(--rm-ink); margin-bottom: var(--rm-space-md); }
    .rm-drawer-kv {
      display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--rm-space-sm);
      background-color: var(--rm-bg); border-radius: var(--rm-radius-sm); padding: var(--rm-space-md);
    }
    .rm-drawer-kv__item { display: flex; flex-direction: column; gap: 2px; }
    .rm-drawer-kv__label { font-size: 12px; color: var(--rm-ink-3); }
    .rm-drawer-kv__value { font-size: 13px; color: var(--rm-ink); }
    .rm-drawer-kv__value--mono { font-family: var(--rm-font-mono); }
    .rm-drawer-desc { margin-top: var(--rm-space-md); }
    .rm-drawer-desc__label { font-size: 12px; color: var(--rm-ink-3); margin-bottom: var(--rm-space-xs); }
    .rm-drawer-desc__text { font-size: 13px; color: var(--rm-ink-2); line-height: 1.7; }
    .rm-drawer-metrics {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--rm-space-md);
    }
    .rm-drawer-metric {
      background-color: var(--rm-bg); border-radius: var(--rm-radius-sm); padding: var(--rm-space-md); text-align: center;
    }
    .rm-drawer-metric__label { font-size: 12px; color: var(--rm-ink-3); margin-bottom: var(--rm-space-xs); }
    .rm-drawer-metric__value { font-family: var(--rm-font-mono); font-size: 20px; font-weight: 600; color: var(--rm-ink); }
    .rm-media-placeholder {
      height: 180px; background-color: var(--rm-bg); border-radius: var(--rm-radius-sm);
      border: 1px dashed var(--rm-line); display: flex; flex-direction: column;
      align-items: center; justify-content: center; gap: var(--rm-space-sm); color: var(--rm-ink-3);
    }
    .rm-drawer-footer {
      display: flex; flex-wrap: wrap; gap: var(--rm-space-xs);
      padding: var(--rm-space-md) var(--rm-space-lg); border-top: 1px solid var(--rm-line); flex-shrink: 0;
    }
    .rm-drawer-footer .rm-btn { flex: 1; min-width: 80px; }

    /* ====== 批量操作栏 ====== */
    .rm-batch-bar {
      position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(calc(100% + 48px));
      display: flex; align-items: center; justify-content: space-between;
      gap: var(--rm-space-md); flex-wrap: wrap;
      max-width: 960px; width: calc(100% - var(--rm-space-xl));
      padding: var(--rm-space-md) var(--rm-space-lg);
      background-color: var(--rm-surface-2); border: 1px solid var(--rm-line);
      border-radius: var(--rm-radius-md); box-shadow: var(--rm-shadow-3);
      z-index: 140; transition: transform 300ms cubic-bezier(.2,.8,.2,1);
    }
    .rm-batch-bar--visible { transform: translateX(-50%) translateY(0); }
    .rm-batch-bar__left { display: flex; align-items: center; gap: var(--rm-space-md); }
    .rm-batch-bar__count { font-size: 14px; color: var(--rm-ink); }
    .rm-batch-bar__clear { font-size: 13px; color: var(--rm-ink-3); background: transparent; border: none; cursor: pointer; }
    .rm-batch-bar__clear:hover { color: var(--rm-brand); }
    .rm-batch-bar__right { display: flex; flex-wrap: wrap; gap: var(--rm-space-xs); }

    /* ====== 移动端底部 Tab ====== */
    .rm-mobile-tabs {
      display: none; position: fixed; left: 0; right: 0; bottom: 0;
      height: 60px; background-color: var(--rm-surface); border-top: 1px solid var(--rm-line);
      z-index: 130;
    }
    .rm-mobile-tabs__btn {
      flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
      gap: 2px; border: none; background: transparent; color: var(--rm-ink-3); font-size: 11px; cursor: pointer;
    }
    .rm-mobile-tabs__btn--active { color: var(--rm-brand); }

    /* ====== AI 光球动画 ====== */
    .rm-ai-orb {
      display: inline-block; width: 48px; height: 48px; border-radius: var(--rm-radius-full);
      background: radial-gradient(circle at 35% 35%, var(--rm-brand) 0%, var(--rm-brand-active) 60%, transparent 100%);
      box-shadow: 0 0 16px rgba(0,212,255,0.3); animation: rm-orb-breathe 3s ease-in-out infinite;
    }
    @keyframes rm-orb-breathe {
      0%, 100% { transform: scale(1); box-shadow: 0 0 16px rgba(0,212,255,0.3); }
      50% { transform: scale(1.05); box-shadow: 0 0 24px rgba(0,212,255,0.5); }
    }

    /* ====== 响应式断点 ====== */
    /* 1280-1439px：筛选面板可折叠，表格列默认隐藏次要列 */
    @media (max-width: 1439px) {
      .rm-filter-panel { position: fixed; left: 0; top: var(--rm-layout-header-h); bottom: 0; z-index: 120; transform: translateX(-100%); }
      .rm-filter-panel--open { transform: translateX(0); }
      .rm-filter-panel__close { display: flex; }
      .rm-table__col-secondary { display: none; }
    }

    /* ≥1440px 显示左侧筛选面板 */
    @media (min-width: 1440px) {
      .rm-filter-panel { position: relative; top: auto; transform: none; }
      .rm-filter-panel__close { display: none; }
    }

    /* 768-1279px：筛选面板顶部抽屉/折叠，时间轴单列，表格横向滚动 */
    @media (max-width: 1279px) {
      .rm-content { padding: var(--rm-space-md); }
      .rm-header { padding: 0 var(--rm-space-md); }
      .rm-page-title { margin-bottom: var(--rm-space-lg); }
      .rm-summary-cards { grid-template-columns: repeat(2, 1fr); }
      .rm-query-row { flex-direction: column; align-items: stretch; }
      .rm-query-field--time { overflow-x: auto; }
      .rm-date-range { width: max-content; }
      .rm-trend-grid { grid-template-columns: repeat(2, 1fr); }
      .rm-table-wrap { overflow-x: auto; }
      .rm-table--list { min-width: 900px; }
      .rm-panel-toolbar__right { width: 100%; justify-content: flex-start; }
    }

    /* <768px：顶部简化筛选，视图切换为底部 Tab，详情抽屉全屏 */
    @media (max-width: 767px) {
      .rm-header__title { display: none; }
      .rm-page-title__h1 { font-size: 18px; }
      .rm-page-title__right { display: none; }
      .rm-summary-cards { grid-template-columns: repeat(2, 1fr); gap: var(--rm-space-sm); }
      .rm-summary-card { padding: var(--rm-space-md); }
      .rm-summary-card__value { font-size: 22px; }
      .rm-view-tabs { display: none; }
      .rm-mobile-tabs { display: flex; }
      .rm-content { padding-bottom: calc(var(--rm-space-md) + 60px); }
      .rm-timeline { padding-left: 0; }
      .rm-timeline::before { display: none; }
      .rm-timeline__date { margin-left: 0; }
      .rm-timeline__item::before { display: none; }
      .rm-timeline__dot { position: static; margin-bottom: var(--rm-space-xs); }
      .rm-trend-grid { grid-template-columns: 1fr; }
      .rm-cv-grid { grid-template-columns: 1fr; }
      .rm-drawer { width: 100%; }
      .rm-batch-bar {
        left: var(--rm-space-sm); right: var(--rm-space-sm); bottom: 72px;
        transform: translateY(calc(100% + 80px)); width: auto; max-width: none;
      }
      .rm-batch-bar--visible { transform: translateY(0); }
      .rm-batch-bar__left, .rm-batch-bar__right { width: 100%; }
      .rm-batch-bar__right .rm-btn { flex: 1; }
      .rm-panel-toolbar { flex-direction: column; align-items: flex-start; }
      .rm-panel-toolbar__right { flex-wrap: wrap; }
      .rm-filter-group__options--inline { justify-content: flex-start; }
    }

    /* 1023px 以下趋势卡片单列 */
    @media (max-width: 1023px) {
      .rm-trend-grid { grid-template-columns: 1fr; }
    }

/* ===== 冲突修复：历史报表页面隐藏多余的 ::before 时间轴圆点 ===== */
.page-history .rm-timeline__item::before { display: none !important; }