:root {
  --bg-main: #f3f6fb;
  --surface: #f3f6fb;
  --surface-strong: #ffffff;
  --text-primary: #172033;
  --text-secondary: #667085;
  --text-soft: #98a2b3;
  --primary: #2f7df4;
  --primary-hover: #2369d8;
  --primary-soft: rgba(47, 125, 244, 0.10);
  --success: #18a66a;
  --success-soft: rgba(24, 166, 106, 0.10);
  --warning: #d99a23;
  --warning-soft: rgba(217, 154, 35, 0.12);
  --danger: #e04f5f;
  --danger-soft: rgba(224, 79, 95, 0.10);
  --border-soft: rgba(23, 32, 51, 0.07);
  --shadow-out:
    8px 8px 18px rgba(31, 45, 74, 0.08),
    -8px -8px 18px rgba(255, 255, 255, 0.88);
  --shadow-hover:
    10px 10px 24px rgba(31, 45, 74, 0.10),
    -10px -10px 24px rgba(255, 255, 255, 0.94);
  --shadow-in:
    inset 4px 4px 10px rgba(31, 45, 74, 0.07),
    inset -4px -4px 10px rgba(255, 255, 255, 0.92);
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-xl: 28px;
  --header-h: 72px;
  --sidebar-w: 240px;
  --content-max: 1600px;
  --ease: 180ms ease;
}