/* Design Tokens - Auto-generated */
/* Do not edit directly - modify tokens.json instead */

/* === PRIMITIVES === */
:root {
  --primitive-color-magenta-500: #a62fae;
  --primitive-color-magenta-600: #7d2283;
  --primitive-color-magenta-700: #5b1f60;
  --primitive-color-violet-400: #895eb0;
  --primitive-color-violet-600: #6f469a;
  --primitive-color-pink-50: #f7f0f9;
  --primitive-color-pink-100: #fde4ef;
  --primitive-color-gray-50: #fafafa;
  --primitive-color-gray-100: #f5f5f5;
  --primitive-color-gray-200: #eeeeee;
  --primitive-color-gray-300: #e4dbe9;
  --primitive-color-gray-500: #6b5f70;
  --primitive-color-gray-700: #5a4a5e;
  --primitive-color-gray-900: #3a2a3d;
  --primitive-color-white: #ffffff;
  --primitive-font-heading: Poppins, system-ui, sans-serif;
  --primitive-font-body: Roboto, system-ui, Arial, sans-serif;
  --primitive-fontSize-xs: 0.75rem;
  --primitive-fontSize-sm: 0.875rem;
  --primitive-fontSize-base: 1rem;
  --primitive-fontSize-lg: 1.125rem;
  --primitive-fontSize-xl: 1.375rem;
  --primitive-fontSize-2xl: 1.75rem;
  --primitive-fontSize-3xl: 2.25rem;
  --primitive-spacing-1: 0.25rem;
  --primitive-spacing-2: 0.5rem;
  --primitive-spacing-3: 0.75rem;
  --primitive-spacing-4: 1rem;
  --primitive-spacing-6: 1.5rem;
  --primitive-spacing-8: 2rem;
  --primitive-radius-none: 0;
  --primitive-radius-sm: 0.5rem;
  --primitive-radius-md: 0.625rem;
  --primitive-radius-lg: 1rem;
  --primitive-radius-pill: 999px;
  --primitive-shadow-sm: 0 2px 10px rgba(58,42,61,.05);
  --primitive-shadow-md: 0 6px 18px rgba(0,0,0,.06);
  --primitive-shadow-lg: 0 14px 30px rgba(58,42,61,.12);
  --primitive-shadow-focus: 0 0 0 4px rgba(166,47,174,.14);
  --primitive-duration-fast: 150ms;
  --primitive-duration-normal: 200ms;
}

/* === SEMANTIC === */
:root {
  --color-background: #fafafa;
  --color-surface: #ffffff;
  --color-foreground: #3a2a3d;
  --color-primary: #a62fae;
  --color-primary-hover: #7d2283;
  --color-primary-active: #5b1f60;
  --color-primary-foreground: #ffffff;
  --color-secondary: #895eb0;
  --color-secondary-hover: #6f469a;
  --color-secondary-foreground: #ffffff;
  --color-accent-subtle: #fde4ef;
  --color-muted: #f5f5f5;
  --color-muted-foreground: #6b5f70;
  --color-border: #eeeeee;
  --color-ring: #a62fae;
  --typography-font-heading: Poppins, system-ui, sans-serif;
  --typography-font-body: Roboto, system-ui, Arial, sans-serif;
}

/* === COMPONENTS === */
:root {
  --button-bg: #a62fae;
  --button-fg: #ffffff;
  --button-hover-bg: #7d2283;
  --button-active-bg: #5b1f60;
  --button-padding-x: 1.5rem;
  --button-padding-y: 0.75rem;
  --button-radius: 999px;
  --button-font-size: 0.875rem;
  --chip-bg: #ffffff;
  --chip-fg: #a62fae;
  --chip-border: #a62fae;
  --chip-active-bg: #a62fae;
  --chip-active-fg: #ffffff;
  --chip-radius: 999px;
  --input-bg: #ffffff;
  --input-border: #e4dbe9;
  --input-focus-ring: 0 0 0 4px rgba(166,47,174,.14);
  --input-padding-x: 1rem;
  --input-padding-y: 0.75rem;
  --input-radius: 999px;
  --card-bg: #ffffff;
  --card-border: #eeeeee;
  --card-shadow: 0 2px 10px rgba(58,42,61,.05);
  --card-hover-shadow: 0 14px 30px rgba(58,42,61,.12);
  --card-padding: 1.5rem;
  --card-radius: 1rem;
  --badge-bg: #fde4ef;
  --badge-fg: #a62fae;
  --badge-radius: 0.5rem;
}