:root {
  --color-ink: #17141f;
  --color-surface: #fffaf5;
  --color-white: #ffffff;
  --color-purple: #6d3ee8;
  --color-purple-dark: #5420bd;
  --color-yellow: #ffd84d;
  --color-pink: #ff4f9a;
  --color-blue: #55c8ff;
  --color-mint: #64dfc4;
  --color-orange: #ff8a4c;
  --color-muted: #706977;
  --color-border: #e7e0eb;
  --color-soft-purple: #eee7ff;
  --color-soft-pink: #ffe5f0;
  --color-soft-blue: #e6f7ff;
  --color-soft-yellow: #fff5c8;
  --radius-small: 16px;
  --radius-medium: 26px;
  --radius-large: 40px;
  --shadow-card: 0 18px 50px rgba(41, 28, 62, 0.1);
  --shadow-card-hover: 0 26px 70px rgba(41, 28, 62, 0.16);
  --layer-header: 100;
  --layer-floating: 400;
  --layer-overlay: 500;
  --layer-toast: 600;
}