:root {
  --primary: #c8b1d1;                /* Dusty Lavender */
  --primary-100: #dbc8e2;
  --primary-200: #eadcf1;
  --primary-300: #f3edfa;
  --primary-hover: #a088b3;

  --secondary: #fff9f3;
  --secondary-100: #f9ebd8;
  --secondary-200: #fcf4e7;
  --secondary-300: #f6e2c9;

  --tertiary: #e9bdc9;               /* Blush Pink */
  --tertiary-100: #f7d9e1;
  --tertiary-200: #fde7ed;
  --tertiary-300: #f1cbd5;

  --quaternary: #c0d887;             /* Soft Olive Green */
  --quaternary-100: #d6eaa3;
  --quaternary-200: #e1f3b1;
  --quaternary-300: #cbe195;

  --accent: #82c1bb;                 /* Muted Teal */
  --accent-100: #a4d5d1;
  --accent-200: #c7e7e5;
  --accent-300: #e9f9f8;
  --accent-hover: #4ea7a0;

  --light: #f9faef;                  /* Off White */
  --light-100: #ffffff;
  --light-200: #fefefc;
  --light-300: #f6f7ed;

  --default: #444;
  --primary-inverse: #ffffff;
  --accent-inverse: #ffffff;
  --tertiary-inverse: #4b4b4b;
  --quaternary-inverse: #ffffff;
  --light-inverse: #4b4b4b;

  --border-radius: 6px;
  --border-radius2x: 12px;
}

/* Optional RGBA Scales for Accent (Hover/Focus Effects) */
:root {
  --accent-rgba-10: rgba(130, 193, 187, 0.1);
  --accent-rgba-20: rgba(130, 193, 187, 0.2);
  --accent-rgba-30: rgba(130, 193, 187, 0.3);
  --accent-rgba-40: rgba(130, 193, 187, 0.4);
  --accent-rgba-50: rgba(130, 193, 187, 0.5);
  --accent-rgba-60: rgba(130, 193, 187, 0.6);
  --accent-rgba-70: rgba(130, 193, 187, 0.7);
  --accent-rgba-80: rgba(130, 193, 187, 0.8);
  --accent-rgba-90: rgba(130, 193, 187, 0.9);
}