:root {
  --color-rosewater: rgb(220, 138, 120);
  --color-flamingo: rgb(221, 120, 120);
  --color-pink: rgb(234, 118, 203);
  --color-mauve: rgb(136, 57, 239);
  --color-red: rgb(210, 15, 57);
  --color-maroon: rgb(230, 69, 83);
  --color-peach: rgb(254, 100, 11);
  --color-yellow: rgb(223, 142, 29);
  --color-green: rgb(64, 160, 43);
  --color-teal: rgb(23, 146, 153);
  --color-sky: rgb(4, 165, 229);
  --color-sapphire: rgb(32, 159, 181);
  --color-blue: rgb(30, 102, 245);
  --color-lavender: rgb(114, 135, 253);

  --color-text: rgb(76, 79, 105);
  --color-subtext1: rgb(92, 95, 119);
  --color-subtext0: rgb(108, 111, 133);
  --color-overlay2: rgb(124, 127, 147);
  --color-overlay1: rgb(140, 143, 161);
  --color-overlay0: rgb(156, 160, 176);
  --color-surface2: rgb(172, 176, 190);
  --color-surface1: rgb(188, 192, 204);
  --color-surface0: rgb(204, 208, 218);
  --color-base: rgb(239, 241, 245);
  --color-mantle: rgb(230, 233, 239);
  --color-crust: rgb(220, 224, 232);

  --color-primary: var(--color-blue);
  --color-primary-light: rgba(30, 102, 245, 0.8);
  --color-primary-lighter: rgba(30, 102, 245, 0.7);
  --color-secondary: var(--color-blue);
  --color-success: var(--color-green);
  --color-error: var(--color-red);
  --color-selected: rgba(var(--color-overlay2), 0.3);
  --color-pressed: rgba(var(--color-overlay2), 0.2);
  --color-border: var(--color-subtext1);

  --border-radius: 0.75rem;
  --border-radius-sm: 0.5rem;
  --border-color: var(--color-surface1);
  --border-color-light: var(--color-surface0);
  --border-width: 1px;

  --font-family: sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size: 1rem;
  --font-size-lg: 1.2rem;
  --font-size-xl: 1.4rem;
  --font-weight-sm: 300;
  --font-weight-md: 500;

  --gap-xs: 0.25rem;
  --gap-sm: 0.5rem;
  --gap-md: 1rem;
  --gap-lg: 1.5rem;
  --gap-xl: 3rem;
  --gap-2xl: 4rem;
  --gap-3xl: 6rem;

  --line-height-sm: 1.25rem;

  --padding-x: var(--gap-md);
  --padding-y: var(--gap-sm);

  --tracking-lg: 0.025em;
}

@font-face {
  font-family: "Inter Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(https://cdn.jsdelivr.net/fontsource/fonts/inter:vf@latest/latin-wght-normal.woff2)
    format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}