:root{
  --red-50: #FFF0F3;
  --red-100: #FFDDE4;
  --red-200: #FFB8C6;
  --red-300: #FB8AA0;
  --red-400: #F2506F;
  --red-500: #E61E48;
  --red-600: #C81440;
  --red-700: #A81038;
  --red-800: #850D2E;
  --red-900: #5E0A22;
  --plum-50: #FBF1F5;
  --plum-100: #F3DCE5;
  --plum-200: #E3B3C6;
  --plum-300: #CC819F;
  --plum-400: #AE4A72;
  --plum-500: #911744;
  --plum-600: #7A123A;
  --plum-700: #63102F;
  --plum-800: #4A0D25;
  --plum-900: #33091A;
  --n-0: #FFFFFF;
  --n-50: #FAFAFB;
  --n-100: #F4F4F6;
  --n-200: #E8E8EC;
  --n-300: #D5D5DB;
  --n-400: #A9A9B4;
  --n-500: #7C7C89;
  --n-600: #5B5B67;
  --n-700: #41414B;
  --n-800: #2A2A32;
  --n-900: #17171C;
  --ok-500: #1F9D57;
  --ok-50: #E7F6EE;
  --ok-700: #14713D;
  --warn-500: #C77700;
  --warn-50: #FDF3DF;
  --warn-700: #8F5500;
  --err-500: #B42318;
  --err-50: #FDECEA;
  --err-700: #8A1A11;
  --info-500: #2563A8;
  --info-50: #E8F0FA;
  --info-700: #1A4779;

  --color-brand: var(--red-500); --color-brand-hover: var(--red-600); --color-brand-press: var(--red-700); --color-brand-soft: var(--red-50);
  --color-accent: var(--plum-500); --color-heading: var(--plum-800);
  --color-text: var(--n-800); --color-text-muted: var(--n-600);
  --color-border: var(--n-200); --color-border-input: var(--n-300);
  --color-bg: var(--n-50); --color-surface: var(--n-0);
  --color-success: var(--ok-500); --color-warning: var(--warn-500); --color-danger: var(--err-500); --color-info: var(--info-500);

  --font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-7: 32px; --space-8: 40px; --space-9: 48px; --space-10: 64px;
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 12px; --radius-xl: 16px; --radius-2xl: 24px; --radius-full: 999px;
  --control-h-sm: 32px; --control-h-md: 40px; --control-h-lg: 48px;
  --sidebar-w: 240px; --sidebar-w-collapsed: 72px; --topbar-h: 64px; --bottomnav-h: 72px;
  --elevation-1: 0 1px 2px rgba(74,13,37,.06); --elevation-2: 0 8px 24px rgba(74,13,37,.10); --elevation-3: 0 24px 48px rgba(74,13,37,.16);
  --motion-fast: 120ms ease-out; --motion-base: 200ms ease-out;
  --focus-ring: 0 0 0 3px var(--red-200);
}