@font-face {
  font-family: 'Commit Mono';
  src: url('../fonts/CommitMono.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}

:root {
  --color-foreground-primary: #222222;
  --color-foreground-secondary: #6e6e6e;
  --color-foreground-70: rgba(34, 34, 34, 0.7);
  --color-foreground-30: rgba(34, 34, 34, 0.3);
  --color-border-subtle: rgba(34, 34, 34, 0.15);
  --color-background: #E4E3E1;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-red: #ED381C;

  --content-max-width: 1800px;

  --font: 'Commit Mono', monospace;

  --text-16: 16px;
  --text-16-regular: 400;
  --text-14: 14px;
  --text-14-regular: 400;
  --text-12: 12px;
  --text-12-bold: 700;
  --text-12-regular: 400;

  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-112: 112px;
  --space-124: 124px;
  --space-144: 144px;

  --shadow-sm:
    0 0 0 1px rgba(22, 22, 32, 0.03),
    0 2px 4px rgba(22, 22, 32, 0.1),
    0 4px 8px rgba(22, 22, 32, 0.07);
  --shadow-tooltip:
    0 0 0 1px rgba(22, 22, 32, 0.06),
    0 4px 16px rgba(22, 22, 32, 0.08);

  --radius-none: 0px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 999px;
}