:root {
  --bg: #f3f7ff;
  --surface: #ffffff;
  --surface-soft: #f8faff;
  --line: #e2e9f7;
  --line-strong: #ced9ee;
  --text: #17213a;
  --muted: #6f7c96;
  --muted-soft: #98a5bd;
  --primary: #5878ff;
  --primary-dark: #4653dc;
  --primary-weak: #e9efff;
  --primary-mid: #bfd0ff;
  --blue-weak: #e8f5ff;
  --purple-weak: #f0edff;
  --green: #16a34a;
  --green-weak: #e9f8ef;
  --amber: #d97706;
  --amber-weak: #fff3dc;
  --red: #dc2626;
  --red-weak: #fff0ef;
  --cyan: #0891b2;
  --cyan-weak: #e6f8fb;
  --violet: #6d5dfc;
  --violet-weak: #f0edff;
  --shadow: 0 10px 24px rgba(57, 78, 136, 0.08);
  --radius: 10px;
  --control-height: 38px;
}