/* style — fonts, resets and the app shell.
   One section of the old style.css. The pieces load in filename order
   and that order is the cascade, so do not rearrange them. */
/* FONTS: MONTSERRAT (UI) + GEIST MONO (numbers and code), BOTH BUNDLED.

   Simon: "change font to montserrat instead of where figtree is used."

   THE BUNDLING IS NOT INCIDENTAL, and it has been lost once already. This
   was an `@import` from fonts.googleapis.com, which has two problems: an
   @import at the top of a stylesheet blocks the first paint until it
   answers, and on a machine with no internet — a locked-down edit suite,
   a laptop on a plane — it never answers at all, so the app needs the
   network to draw itself. `068011f` fixed that by bundling the faces as
   files; `e9f6692`, forty minutes later and about a header pill, wiped the
   whole block out and put the @import back. Nobody noticed for weeks: the
   font files stayed in fonts/, the --font-ui token stayed in tokens.css,
   and neither was referenced by anything. tests/fonts-bundled.mjs exists
   so that cannot happen quietly a second time.

   MONTSERRAT REPLACES FIGTREE at the same five weights this UI actually
   uses (400/500/600/700/800) plus the one italic, latin subset, from
   @fontsource/montserrat. Geist Mono stays for anything where digits have
   to hold a column — timecode, costs, tokens: Montserrat is not a
   monospace and a running timecode in it jitters as the numerals change
   width. */
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 400; font-display: swap;
             src: url('../../fonts/montserrat-400.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 500; font-display: swap;
             src: url('../../fonts/montserrat-500.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: swap;
             src: url('../../fonts/montserrat-600.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap;
             src: url('../../fonts/montserrat-700.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 800; font-display: swap;
             src: url('../../fonts/montserrat-800.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: italic; font-weight: 400; font-display: swap;
             src: url('../../fonts/montserrat-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'Geist Mono'; font-style: normal; font-weight: 400; font-display: swap;
             src: url('../../fonts/geist-mono-400.woff2') format('woff2'); }
@font-face { font-family: 'Geist Mono'; font-style: normal; font-weight: 500; font-display: swap;
             src: url('../../fonts/geist-mono-500.woff2') format('woff2'); }

/* Fal Studio — card design, near-black theme, crimson accent (compact) */
/* The design tokens moved to css/tokens.css, which loads before this file.
   Change a colour, radius, spacing step or stacking layer there. */

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  /* Through the token rather than written out again — --font-ui in
     css/tokens.css is where the UI face is chosen, and it spent weeks
     naming a font nothing read because this line named a different one. */
  font-family: var(--font-ui);
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  background: var(--bg);
  color: var(--text);
  overflow-y: auto;
  user-select: none;
}
#app { padding: 0 14px 18px 22px; }  /* extra left padding so it's not squashed */