
/* Self-hosted so no third-party outage can strip the site's typography. */
@font-face {
  font-family: "Inter var";
  src: url("/assets/fonts/inter-var.woff2") format("woff2-variations"),
       url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
/*
  Abakos design tokens: single source of truth for color, type and shape.
  Rule: nothing outside this file may hardcode a brand color. site.css and
  site.js must reference these variables (JS reads them via
  getComputedStyle) so the palette can never drift out of sync between
  components, breakpoints or files.
*/
:root {
  /* Tells the browser this page is intentionally dark, so mobile browsers
     stop applying their own auto dark-mode color adjustments to native
     controls (inputs, scrollbars, form autofill) that otherwise render
     inconsistently between devices. */
  color-scheme: dark;

  /* Brand blue, sampled from the logo mark. One hue, three stops so
     gradients/glows/hover states stay inside the same family instead of
     introducing a second, competing color. */
  --abk-brand: #7C46FF;
  --abk-brand-rgb: 124, 70, 255;
  --abk-brand-light: #B18CFF;
  --abk-brand-light-rgb: 177, 140, 255;
  --abk-brand-dark: #4A17C8;

  /* Cyan. Only ever the far end of a brand gradient, never used alone. */
  --abk-accent: #00CFFF;
  --abk-accent-rgb: 0, 207, 255;

  /* Semantic accents: each has exactly one job, never decorative */
  --abk-green: #4ade80;   /* "this is genuinely live/proven today" only */
  --abk-green-rgb: 74, 222, 128;
  --abk-red: #ff5d6c;     /* errors only */

  /* Surfaces, darkest to lightest */
  --abk-bg: #07060E;
  --abk-surface: #12101F;
  --abk-card: #0D0B17;
  --abk-line: #241E3A;

  /* Text, brightest to dimmest */
  --abk-text: #F6F7FB;
  --abk-text-soft: #BDBACD;
  --abk-text-muted: #8E8AA3;

  /* Shape scale: consistent radii instead of ad-hoc 3/4/5/6px per component */
  --abk-radius-sm: 4px;
  --abk-radius-md: 8px;
  --abk-radius-lg: 16px;

  /* Motion */
  --abk-ease: cubic-bezier(.22, .8, .28, 1);

  /* Type */
  --abk-font-display: "Inter var", Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --abk-font-body: "Inter var", Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --abk-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --abk-maxw: 1200px;
}
