:root {
  /* White */
  --white-00: rgba(255, 255, 255, 0);
  --white-25: rgba(255, 255, 255, 0.25);
  --white-50: rgba(255, 255, 255, 0.5);
  --white-75: rgba(255, 255, 255, 0.75);
  --white-100: #FFFFFF;

  /* Black */
  --black-00: rgba(0, 0, 0, 0);
  --black-25: rgba(0, 0, 0, 0.25);
  --black-50: rgba(0, 0, 0, 0.5);
  --black-75: rgba(0, 0, 0, 0.75);
  --black-100: #000000;

  /* Warm */
  --warm-100: #FAF8F3;
  --warm-200: #F0EBE1;
  --warm-300: #DED9D0;
  --warm-400: #C8B99A;
  --warm-500: #A89275;
  --warm-600: #84775D;
  --warm-700: #665C48;
  --warm-800: #484132;
  --warm-900: #2A2218;

  /* Neutral */
  --neutral-100: #F8F8F8;
  --neutral-200: #F0F0F0;
  --neutral-300: #E0E0E0;
  --neutral-400: #C0C0C0;
  --neutral-500: #A0A0A0;
  --neutral-600: #787878;
  --neutral-700: #585858;
  --neutral-800: #383838;
  --neutral-900: #1A1A1A;

  /* Cold */
  --cold-100: #F4F6F8;
  --cold-200: #E8ECF0;
  --cold-300: #D0D7E0;
  --cold-400: #B0BAC8;
  --cold-500: #8090A8;
  --cold-600: #607088;
  --cold-700: #485870;
  --cold-800: #304050;
  --cold-900: #1A2835;

  /* Red */
  --red-100: #F9E8E5;
  --red-500: #B84035;
  --red-800: #5C1A15;

  /* Orange */
  --orange-100: #FFF5EC;
  --orange-500: #F0930A;
  --orange-800: #632E00;

  /* Green */
  --green-100: #ECF3ED;
  --green-500: #4A7C5A;
  --green-800: #2A4A35;

  /* Blue */
  --blue-100: #D3E8F3;
  --blue-500: #1D84B7;
  --blue-800: #003C5A;

  /* Font sizes */
  --font-2xs: 11px;
  --font-xs: 12px;
  --font-sm: 14px;
  --font-md: 16px;
  --font-lg: 18px;
  --font-xl: 20px;
  --font-2xl: 24px;
  --font-3xl: 28px;
  --font-4xl: 32px;
  --font-5xl: 40px;
  --font-6xl: 48px;
  --font-7xl: 56px;
  --font-8xl: 64px;
  --font-9xl: 72px;

  /* Icon sizes */
  --icon-xs: 12px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --icon-xl: 32px;

  /* Radius */
  --radius-none: 0px;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  /* Space */
  --space-3xs: 4px;
  --space-2xs: 8px;
  --space-xs: 12px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 40px;
  --space-2xl: 48px;
  --space-3xl: 72px;
  --space-4xl: 88px;
  --space-5xl: 96px;
  --space-6xl: 128px;
  --space-7xl: 160px;
  --space-8xl: 200px;

  /* Stroke */
  --stroke-sm: 1px;
  --stroke-md: 1.5px;
  --stroke-lg: 2px;
}