/* ---------------------------------------------------------------------------
   Primitives that every page declared for itself, verbatim, six times over.
   Nothing here is new; --wrap and --lh carry the only values that ever
   legitimately differed between pages.
   --------------------------------------------------------------------------- */
/* Any class selector that sets `display` silently outranks the UA stylesheet's
   [hidden]{display:none}, so an element with the `hidden` attribute stays on
   screen. This has now bitten three times (signin.html and lauther-demo.js
   each carry a local copy of this rule; the console's key modal shipped
   permanently open). One guard, site-wide. */
[hidden] { display: none !important; }

* { box-sizing: border-box; margin: 0; }

body {
  background: var(--graphite);
  color: var(--body);
  font-family: "Space Grotesk", system-ui, sans-serif;
  line-height: var(--lh);
}

a { color: var(--amp); text-decoration: none; }

.mono { font-family: "JetBrains Mono", ui-monospace, monospace; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }

.eyebrow {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px; font-weight: 700; letter-spacing: 1.4px;
  text-transform: uppercase; color: var(--muted);
}
.eyebrow::before {
  content: ""; display: inline-block; width: 12px; height: 1px;
  background: var(--amp); vertical-align: middle; margin-right: 8px;
}