@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-var.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/plexsans-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/plexsans-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/plexsans-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/plexmono-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/plexmono-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

:root {
  --color-ink: #07101f;
  --color-panel: #0b1830;
  --color-surface: #0e1c38;
  --color-surface-raised: #122342;
  --color-line: rgba(148, 178, 255, 0.14);
  --color-line-strong: rgba(148, 178, 255, 0.28);
  --color-text: #eef3fb;
  --color-muted: #a9b9d0;
  --color-muted-strong: #c7d2e2;
  --color-red: #e2262f;
  --color-red-hot: #ff4d55;
  --color-error-bg: #2a121c;

  --disp: "Archivo", sans-serif;
  --sans: "IBM Plex Sans", sans-serif;
  --mono: "IBM Plex Mono", monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: clamp(2rem, 4vw, 3.25rem);
  --text-3xl: clamp(3rem, 7vw, 6rem);

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 7.5rem;

  --container: 77.5rem;
  --header-height: 4.75rem;
  --transition: 220ms ease;
  --shadow-panel: 0 1.5rem 4rem rgba(1, 7, 18, 0.34);
  --z-grid: 0;
  --z-content: 1;
  --z-float: 90;
  --z-header: 100;
  --z-backdrop: 101;
  --z-drawer: 102;
  --z-skip: 110;
}