/* ============================================================ NeuralRun — Global Navigation (shared component) Paired with nav.js. Context set via : "hub" → dashboard / profile / settings (expanded sidebar on desktop) "app" → games / tools (collapsed icon rail + peek on desktop) Relies on CSS custom properties already defined in each page's :root (--accent-creation, --text-main, --text-dim, etc.) ============================================================ */ /* ── THE NAV OWNS ITS TYPEFACE ── The nav used to render `font-family: var(--nrnav-font)`, which sounds safe but isn't: --font-ui is defined by each PAGE's stylesheet, so the fallback never fired and the "global" nav rendered in whatever the app happened to declare. Measured: Roboto Mono on misfire/marathon/glowgrid, Fira Code on discover/infinite-room/live-poll, and — because smart-lists.css:33 sets --font-ui to a system sans stack — SANS-SERIF on Smart Lists. Three typefaces for one component. Own it here instead. Roboto Mono leads because it carries a true 500 and is loaded on the most pages; Fira Code is the second stop (it's the only mono loaded on Smart Lists), then system mono. The stack can vary slightly by page depending on what's linked, but it can no longer fall out of monospace. Weight note: Roboto Mono ships 400/500/700, Fira Code ships 400/600/700. 600 is the ONLY value that resolves to a real bold-ish face in both (Fira 600, Roboto rounds to 700). Asking for 500 silently degrades to 400 on Fira Code pages, so nav chrome uses 600 and never 500. */ :root { --nrnav-font: 'Roboto Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace; /* Idle nav-link ink. Own token rather than --text-dim because the nav needs a contrast floor it controls: #a8a8ba is 8.45:1 on the dark drawer (AAA), where the inherited --text-dim #858595 was only 5.45:1 (AA). Overridden for light theme further down — #a8a8ba on the #f7f8fc drawer is 2.20:1, a hard fail, so this token MUST be re-set anywhere the drawer surface flips. */ --nrnav-link: #a8a8ba; } /* Restore the HTML `hidden` attribute semantic globally. Class-level rules like `.btn { display: inline-flex }` beat the user-agent default `[hidden] { display: none }`, leaving `