/* Astromika — design tokens. Source: Developer/Astromika/ui-kit/. Edit here only; sync.mjs copies it. */
@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/space-grotesk-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("../fonts/space-grotesk-latin-500-normal.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}

:root {
  /* ink */
  --black: #000000;
  --black-900: #0b0b0b;
  --black-800: #161616;
  --white: #ffffff;
  --grey-400: #8a8a8a;
  --grey-600: #5a5a5a;

  /* roles */
  --bg: var(--black);
  --fg: var(--white);
  --muted: var(--grey-400);
  --line: #262626;

  /* type */
  --font: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --text-12: 12px;
  --text-14: 14px;
  --text-16: 16px;
  --text-20: 20px;
  --tracking-wide: 0.24em;

  /* space: 0, 2, then multiples of 4 */
  --s-2: 2px; --s-4: 4px; --s-8: 8px; --s-12: 12px; --s-16: 16px;
  --s-24: 24px; --s-32: 32px; --s-48: 48px; --s-64: 64px; --s-96: 96px;

  --radius-pill: 999px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}