/* Design tokens (light, dark), resets and type. */
/* Layout: navy command rail on desktop, bottom tab bar on phones; chart-paper ground, brass for the one accent. */
:root {
  --paper: #EDF0EE;
  --surface: #FFFFFF;
  --sunk: #F5F7F6;
  --ink: #12213B;
  --ink-2: #4B5870;
  --ink-3: #7A869A;
  --line: #D3D9DF;
  --rail: #13223F;
  --rail-ink: #C9D3E3;
  --brass: #A2761C;
  --brass-ink: #FFFFFF;
  --brass-soft: #F4EAD2;
  --ok: #1B7A4B;
  --ok-soft: #E1F2E8;
  --bad: #B42318;
  --bad-soft: #FBE6E3;
  --warn: #8A6100;
  --p1: #2C5A8C; --p2: #3E7F78; --p3: #8A5A2B; --p4: #6A4C8C;
  --f-display: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
  --f-body: "IBM Plex Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --r: 8px;
  --rail-w: 232px;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --paper: #0C1422; --surface: #132036; --sunk: #0F1A2D; --ink: #E5EAF2; --ink-2: #A3AFC2; --ink-3: #75839A;
  --line: #24334D; --rail: #08101D; --rail-ink: #AFBBD0; --brass: #D9A645; --brass-ink: #1A1405; --brass-soft: #2D2513;
  --ok: #4CC38A; --ok-soft: #12301F; --bad: #F08A80; --bad-soft: #3A1714; --warn: #E3B341;
  --p1: #5B8FCB; --p2: #5FB3A9; --p3: #C58B55; --p4: #9C7FC4; color-scheme: dark; } }
:root[data-theme="dark"] {
  --paper: #0C1422; --surface: #132036; --sunk: #0F1A2D; --ink: #E5EAF2; --ink-2: #A3AFC2; --ink-3: #75839A;
  --line: #24334D; --rail: #08101D; --rail-ink: #AFBBD0; --brass: #D9A645; --brass-ink: #1A1405; --brass-soft: #2D2513;
  --ok: #4CC38A; --ok-soft: #12301F; --bad: #F08A80; --bad-soft: #3A1714; --warn: #E3B341;
  --p1: #5B8FCB; --p2: #5FB3A9; --p3: #C58B55; --p4: #9C7FC4; color-scheme: dark; }

*, *::before, *::after { box-sizing: border-box; }
html, body { min-height: 100%; }
body { background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 15px; line-height: 1.5; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--rail); }
button, input, select { font: inherit; color: inherit; }
/* iPhone: form controls under 16px make Safari zoom in on tap and leave the page shifted sideways. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-x: hidden; }
@media (pointer: coarse) { input, select, textarea { font-size: max(16px, 1em) !important; } }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
h1, h2, h3, h4 { margin: 0; text-wrap: balance; }
p { margin: 0; }
.mono { font-family: var(--f-mono); font-variant-numeric: tabular-nums; }
.eyebrow { font-family: var(--f-display); font-weight: 600; font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }