:root {
  color-scheme: light;
  --font-body: "Nunito Sans";
  --font-display: "Baloo 2";
  --font-adventure: "Baloo 2";
  --hero-title: clamp(2.65rem, 4vw, 4.25rem);
  --page-title: clamp(2.1rem, 3.2vw, 3.6rem);
  --section-title: clamp(1.35rem, 1.8vw, 1.9rem);
  --ink-950: #081749;
  --ink-800: #1b2c61;
  --ink-600: #52618c;
  --ink-400: #8793b3;
  --surface: #ffffff;
  --surface-soft: #f6f9ff;
  --surface-blue: #eef5ff;
  --line: #dfe7f5;
  --blue-700: #0759e6;
  --blue-500: #1477ff;
  --blue-100: #e8f2ff;
  --violet-600: #7739ee;
  --violet-100: #f1ebff;
  --green-600: #21a847;
  --green-100: #eaf9ed;
  --orange-600: #f26a0a;
  --orange-100: #fff0e6;
  --yellow-500: #ffb800;
  --yellow-100: #fff7d6;
  --red-600: #d9364f;
  --red-100: #ffeaed;
  --shadow-sm: 0 4px 16px rgba(19, 52, 118, 0.08);
  --shadow-md: 0 12px 32px rgba(19, 52, 118, 0.12);
  --shadow-lg: 0 22px 52px rgba(19, 52, 118, 0.16);
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --sidebar-width: 184px;
  --rail-width: 238px;
  --control-height: 48px;
  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
}

@media (max-width: 1180px) {
  :root { --sidebar-width: 176px; --rail-width: 224px; }
}