/* The document's custom properties, and the reason this file still exists.
   Every rule the shell owned moved to the Tailwind entry, but these values
   stayed here for a mechanical reason worth writing down: the page links this
   stylesheet first, and the W3C validator resolves `var()` in a `max()` or
   `calc()` against the first stylesheet's unlayered `:root` only. With the
   block in the generated theme it reported `Invalid type: 50% - var(--wrap) / 2`
   on four page rules that had not changed since, on /company/ and /jobs/.
   `scripts/gen_tailwind_theme.py` reads this block, so the theme's tokens and
   these are one source, and a page's own `:root` is unlayered and still wins
   on source order for the ones it retunes (--gut 48px on /products/*, 16px on
   /red-teaming/; --wrap on /red-teaming/ and /products/review/). */
:root {
  --bg:#F5F2EA; --bg-2:#EDE8DC; --border:#DBD5C7; --border-soft:#E4DECF;
  --border-strong:#8A8069; --fg:#14120C; --body:#514E44; --muted:#6B6558;
  --surface:#FBFAF6;
  --accent:#086B47; --accent-mark:#0E9E68; --accent-deep:#064A34; --caution:#AF432C;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,"DejaVu Sans Mono",monospace;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Noto Serif",Georgia,serif;
  --wrap:1200px;
  --gut:40px;
  /* The section rail's column and the gap past it, one pair for every railed
     page (styles/rail.css .railed). */
  --rail-w:150px;
  --rail-gap:48px;
  /* The nav shell measure. Pages retune --gut and --wrap for their own
     content; the nav reads these instead so the logo never moves between pages. */
  --shell-wrap:1200px;
  --shell-gut:40px;
  --navh:75px;
  --nav-h:var(--navh);
  --tscroll-fade:26px;
}

/* The gutters tighten once the shell measure no longer fits its own padding,
   and the bar's own height: 98px for the two-row bar from 960px down, 0 from
   560px where the bar stops sticking and the links sit three by two. Those
   heights are the --nav-h the page bars pin under. */
@media (max-width:1140px) {
  :root { --gut:36px; --shell-gut:36px; }
}
@media (max-width:960px) {
  :root { --navh:98px; }
}
@media (max-width:560px) {
  :root { --navh:0px; }
}
@media (max-width:760px) {
  :root { --gut:22px; --shell-gut:22px; }
}
