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

/* === PRIMITIVES === */
:root {
  --primitive-color-pink-100: #f9a8d4;
  --primitive-color-pink-500: #ec4899;
  --primitive-color-pink-600: #c2367a;
  --primitive-color-violet-500: #8b5cf6;
  --primitive-color-neutral-bg: #fdf2f8;
  --primitive-color-neutral-surface: #ffffff;
  --primitive-color-neutral-ink: #2b1320;
  --primitive-color-neutral-ink-soft: #6b5560;
  --primitive-radius-pill: 999px;
  --primitive-radius-card: 20px;
  --primitive-shadow-soft: 0 16px 40px rgba(43, 19, 32, 0.10);
  --primitive-shadow-lift: 0 24px 55px rgba(43, 19, 32, 0.16);
}

/* === SEMANTIC === */
:root {
  --color-background: #fdf2f8;
  --color-surface: #ffffff;
  --color-foreground: #2b1320;
  --color-foreground-muted: #6b5560;
  --color-primary: #ec4899;
  --color-primary-hover: #c2367a;
  --color-accent: #8b5cf6;
  --color-border: rgba(236, 72, 153, 0.16);
}

/* === COMPONENTS === */
:root {
  --header-bg-solid: #c2367a;
  --card-bg: #ffffff;
  --card-border: rgba(236, 72, 153, 0.16);
  --card-radius: 20px;
  --card-shadow: 0 16px 40px rgba(43, 19, 32, 0.10);
  --card-shadow-hover: 0 24px 55px rgba(43, 19, 32, 0.16);
  --button-radius: 999px;
  --button-primary-bg: #ec4899;
  --button-primary-bg-hover: #c2367a;
}