/*
  The two faces, self-hosted.

  ## Why this is its own file

  The same reason `cards.css` is: two surfaces need it and they do not share a
  stylesheet. `base.html` links `app.css`, and `tv.html` deliberately extends
  nothing and carries its own inline `<style>` so a television loads one
  document with no chrome in it. Declaring the faces in `app.css` would leave
  the TV setting type in the system font; inlining them in `tv.html` would be a
  second copy to drift.

  ## Why self-hosted, and why these exact files

  These are byte-for-byte GameBrain's own `static/fonts/*.woff2`. The Rules tab
  embeds GameBrain inside this app's chrome, so the frame and the page inside it
  had better be setting type in the same font *files* — not merely the same
  family name resolved by two different services. It also means the app has no
  third-party request on its critical path, which matters on a game day in a
  hall with hotel wifi.

  ## Why `swap`

  A television across the room and a phone over a crowded table both want text
  now and the right text a moment later. The fallback stacks in `--font` /
  `--font-mono` are chosen so the swap is a change of face, not of layout.

  Only the weights actually used are shipped: 400/500/600/700 of the UI face and
  400/500/600 of the mono. Adding a weight means adding a file — the browser
  will otherwise synthesise it, which on a condensed geometric face looks wrong
  in a way that is hard to name and easy to see.
*/

@font-face {
  font-family: 'Space Grotesk';
  src: url('/static/fonts/space-grotesk-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Space Grotesk';
  src: url('/static/fonts/space-grotesk-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Space Grotesk';
  src: url('/static/fonts/space-grotesk-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Space Grotesk';
  src: url('/static/fonts/space-grotesk-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/jetbrains-mono-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/jetbrains-mono-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/static/fonts/jetbrains-mono-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
