/* SYNTAX — design tokens. See /DESIGN.md */

@font-face { font-family: "Newsreader"; src: url(/fonts/newsreader-normal.woff2) format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url(/fonts/newsreader-italic.woff2) format("woff2"); font-weight: 200 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url(/fonts/instrument-sans-normal.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url(/fonts/instrument-sans-italic.woff2) format("woff2"); font-weight: 400 700; font-stretch: 75% 100%; font-style: italic; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url(/fonts/jetbrains-mono-normal.woff2) format("woff2"); font-weight: 100 800; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url(/fonts/jetbrains-mono-italic.woff2) format("woff2"); font-weight: 100 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Mona Sans"; src: url(/fonts/mona-sans-normal.woff2) format("woff2"); font-weight: 200 900; font-stretch: 75% 125%; font-style: normal; font-display: swap; }
@font-face { font-family: "Mona Sans"; src: url(/fonts/mona-sans-italic.woff2) format("woff2"); font-weight: 200 900; font-stretch: 75% 125%; font-style: italic; font-display: swap; }

:root {
  color-scheme: dark;

  /* surfaces */
  --void: #050506;
  --ink-0: #09090B;
  --ink-1: #0F1013;
  --ink-2: #16171B;
  --ink-3: #1F2025;

  /* text */
  --bone: #ECE8E1;
  --bone-2: #A9A59D;
  --bone-3: #827E77;
  --bone-4: #45433F;

  /* hairlines */
  --line: rgba(236, 232, 225, .08);
  --line-2: rgba(236, 232, 225, .14);
  --line-3: rgba(236, 232, 225, .24);

  /* the one UI accent: brand gold — human sign-off, focus */
  --signal: #FAB31F;
  --signal-ink: #1A1305;

  /* the logo's bracket colours — simulations, data and HUD corners only */
  --b-red: #E65756;
  --b-green: #89BE43;
  --b-teal: #6EC1B1;
  --b-cyan: #4AC0E4;

  /* type */
  --f-display: "Newsreader", "Iowan Old Style", "Times New Roman", serif;
  --f-sans: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --display-weight: 300;
  --display-opsz: "opsz" 72;
  --display-track: -.035em;
  --display-stretch: 100%;

  --t-hero: clamp(54px, 8.6vw, 148px);
  --t-h1: clamp(44px, 6.2vw, 104px);
  --t-h2: clamp(36px, 4.6vw, 76px);
  --t-h3: clamp(25px, 2.3vw, 36px);
  --t-lede: clamp(18px, 1.42vw, 22px);
  --t-body: 16.5px;
  --t-small: 14px;
  --t-mono: 11.5px;

  /* space */
  --gutter: clamp(20px, 4vw, 64px);
  --section: clamp(104px, 14vw, 208px);
  --maxw: 1480px;
  --nav-h: 68px;

  /* motion */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur: .9s;
}

/* Alternate type set B — "Frontier": Mona Sans wide. Switch with ?type=b */
:root[data-type="b"] {
  --f-display: "Mona Sans", "Instrument Sans", sans-serif;
  --f-sans: "Mona Sans", "Instrument Sans", sans-serif;
  --display-weight: 300;
  --display-opsz: normal;
  --display-track: -.045em;
  --display-stretch: 116%;
}
