/* ========== 设计 Token ==========
   所有颜色 / 间距 / 圆角 / 阴影 / 字号统一从这里取值，组件不写魔法数。 */
:root {
  /* 品牌与语义色 */
  --primary: #5b61f0;
  --primary-hover: #4d53e0;
  --primary-soft: #eef0ff;
  --primary-ring: rgba(91, 97, 240, .18);

  --success: #059669;      --success-soft: #e6f7f0;
  --warning: #d97706;      --warning-soft: #fff4e0;
  --danger:  #ef4444;      --danger-soft:  #fdecec;
  --info:    #3b82f6;      --info-soft:    #e8f1fe;
  --violet:  #8b5cf6;      --violet-soft:  #f1ecfe;
  --neutral: #64748b;      --neutral-soft: #eef1f5;

  /* 表面与文字 */
  --bg: #f4f6fa;
  --surface: #ffffff;
  --surface-2: #f8f9fc;
  --line: #e6e9f0;
  --line-strong: #d5dae4;
  --text: #16203a;
  --text-2: #4b5670;
  --text-3: #8791a5;
  --text-inverse: #ffffff;

  /* 图表 */
  --chart-bar: #5b61f0;
  --chart-bar-hover: #7a7ff5;
  --chart-grid: #eceff5;
  --chart-axis: #d5dae4;

  /* 间距 (4pt 网格) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px;

  /* 圆角 */
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-full: 999px;

  /* 阴影 */
  --shadow-1: 0 1px 2px rgba(22, 32, 58, .04), 0 1px 3px rgba(22, 32, 58, .05);
  --shadow-2: 0 4px 12px rgba(22, 32, 58, .06), 0 2px 4px rgba(22, 32, 58, .04);
  --shadow-3: 0 12px 32px rgba(22, 32, 58, .12), 0 4px 8px rgba(22, 32, 58, .06);

  /* 字号 / 行高 */
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 14px; --fs-lg: 16px; --fs-xl: 20px; --fs-2xl: 26px;
  --font: Inter, "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* 动效 */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur-fast: 120ms; --dur: 180ms; --dur-slow: 280ms;

  /* 布局 */
  --sidebar-w: 88px;
  --content-max: 1440px;
  --control-h: 36px;
  --control-h-lg: 42px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
  *, *::before, *::after { animation-duration: 0s !important; animation-iteration-count: 1 !important; transition-duration: 0s !important; }
}