/**
 * 设计 token —— 工作台唯一的颜色/尺寸来源
 *
 * 规则：组件样式只引用变量，不写死色值。这样明暗两套主题只需要在这一处切换。
 * 命名沿用 AlphaLens 主站的 --app-* 体系，两站之间搬页面时不用改色。
 */
:root {
  color-scheme: light;

  /* ── 中性色 ───────────────────────────────────────── */
  --app-bg: #f6f7f9;
  --app-surface: #ffffff;
  --app-surface-muted: #f1f3f6;
  --app-surface-elevated: #ffffff;
  --app-sidebar-bg: #ffffff;

  --app-text: #111827;
  --app-text-2: #374151;
  --app-text-3: #6b7280;
  --app-text-4: #9ca3af;

  --app-border: #e5e7eb;
  --app-border-soft: #f1f3f5;
  --app-row-hover: #f8fafc;

  /* ── 品牌色 ───────────────────────────────────────── */
  --app-primary: #2563eb;
  --app-primary-hover: #1d4ed8;
  --app-primary-soft: #eff6ff;
  --app-primary-ring: #bfdbfe;

  /* ── 语义色（A 股惯例：红涨绿跌） ─────────────────── */
  --app-up: #e5484d;
  --app-up-soft: rgba(229, 72, 77, 0.12);
  --app-down: #12a594;
  --app-down-soft: rgba(18, 165, 148, 0.12);
  --app-warn: #d97706;
  --app-warn-soft: rgba(217, 119, 6, 0.12);

  /* ── 图表专用（ECharts 从这些变量读色，切主题后重绘） ─ */
  --app-chart-axis: #94a3b8;
  --app-chart-split: #eef2f6;
  --app-chart-trend: rgba(100, 116, 139, 0.38);
  --app-chart-up: #e5484d;
  --app-chart-down: #12a594;
  --app-chart-mid: #cbd5e1;

  /* ── 圆角 / 阴影 ──────────────────────────────────── */
  --app-radius-sm: 5px;
  --app-radius: 8px;
  --app-radius-lg: 14px;
  --app-radius-pill: 999px;

  --app-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --app-shadow: 0 6px 20px rgba(16, 24, 40, 0.1);

  /* ── 字体 / 动效 ──────────────────────────────────── */
  --app-font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans",
    "PingFang SC", "Microsoft YaHei", sans-serif;
  --app-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas,
    "Liberation Mono", monospace;
  --app-transition: 0.18s cubic-bezier(0.645, 0.045, 0.355, 1);

  /* ── 骨架尺寸 ─────────────────────────────────────── */
  --app-sidebar-w: 232px;
  --app-topbar-h: 56px;
  --app-gap: 16px;
}

html.dark {
  color-scheme: dark;

  --app-bg: #0d0f13;
  --app-surface: #15181e;
  --app-surface-muted: #1b1f26;
  --app-surface-elevated: #1f242c;
  --app-sidebar-bg: #111419;

  --app-text: #f2f5fa;
  --app-text-2: #ccd3de;
  --app-text-3: #8f9aab;
  --app-text-4: #6b7688;

  --app-border: #272d37;
  --app-border-soft: #1f242c;
  --app-row-hover: #1d222a;

  --app-primary: #5aa2ff;
  --app-primary-hover: #8fc0ff;
  --app-primary-soft: rgba(90, 162, 255, 0.14);
  --app-primary-ring: rgba(90, 162, 255, 0.34);

  --app-up: #f87171;
  --app-up-soft: rgba(248, 113, 113, 0.14);
  --app-down: #34d399;
  --app-down-soft: rgba(52, 211, 153, 0.14);
  --app-warn: #fbbf24;
  --app-warn-soft: rgba(251, 191, 36, 0.14);

  --app-chart-axis: #6b7688;
  --app-chart-split: #232932;
  --app-chart-trend: rgba(148, 163, 184, 0.3);
  --app-chart-up: #f87171;
  --app-chart-down: #34d399;
  --app-chart-mid: #475569;

  --app-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --app-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
}