:root {

  /* Neutral tones */
  --color-neutral-50 : oklch(98.5% 0 0);
  --color-neutral-100: oklch(97% 0 0);
  --color-neutral-200: oklch(92.2% 0 0);
  --color-neutral-300: oklch(87% 0 0);
  --color-neutral-400: oklch(70.8% 0 0);
  --color-neutral-500: oklch(55.6% 0 0);
  --color-neutral-600: oklch(43.9% 0 0);
  --color-neutral-700: oklch(37.1% 0 0);
  --color-neutral-800: oklch(26.9% 0 0);
  --color-neutral-900: oklch(20.5% 0 0);
  --color-neutral-950: oklch(14.5% 0 0);

  /* Semantic colors */
  --color-dark: var(--color-neutral-900);
  --color-light: #fff;

  --color-fg: var(--color-dark);
  --color-bg: var(--color-light);


  /* Borders */
  --border-dark: 1px solid var(--color-neutral-700);
  --border-card: 1px solid var(--color-neutral-300);
  --border-thin: 1px solid var(--color-neutral-200);


  /* Fonts */
  --font-sans: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;


  /* Infinite Radius */
  --radius-inf: 200vw;

  /* Forms */
  --field-radius: var(--radius);

  /* Buttons */
  --btn-radius: 3rem;

  /* Tabs */
  --tab-radius: var(--radius);
}