/* ── Colour ──────────────────────────────────────────────────────────────────
   Ontolo runs on a deep navy neutral ramp and one saturated cobalt. The
   neutrals are cool with a blue cast — never a true grey, never warm. Cobalt is
   the single working colour: active, selected, live, asserted. Vermilion has
   exactly one meaning, the evidence gap. Steel supports data; sand is ballast
   and is currently unused on any shipped surface.

   ONE ACCENT PER VIEW. If --signal-400 is on the active element, nothing else
   on screen is --signal-400. */
:root {
  /* ink and paper */
  --n-000:#ffffff;
  --n-025:#fafbfd;
  --n-050:#f2f5f9;
  --n-100:#e5eaf1;
  --n-200:#cfd7e3;
  --n-300:#aab5c6;
  --n-400:#8590a3;
  --n-500:#66718a;
  --n-600:#4a5568;
  --n-700:#333d4e;
  --n-800:#212a38;
  --n-900:#141b26;
  --n-950:#0b111a;

  /* signal — cobalt, the working colour */
  --signal-100:#e8efff;
  --signal-200:#c8daff;
  --signal-300:#6f9dff;
  --signal-400:#2563eb;
  --signal-500:#1d4ed8;
  --signal-600:#1e40af;
  --signal-700:#1a3785;

  /* steel — data support only, never a large brand field */
  --steel-100:#e9eff7;
  --steel-200:#cddbec;
  --steel-300:#9db4d4;
  --steel-400:#6b8bbd;
  --steel-500:#4468a3;
  --steel-600:#33507e;
  --steel-800:#1a2740;

  /* port — vermilion. The evidence gap, and nothing else. */
  --port-100:#fde8e3;
  --port-200:#f9c8bc;
  --port-300:#f4795e;
  --port-400:#e8543a;
  --port-500:#d8432b;
  --port-600:#b13520;

  /* sand — warm ballast, 2-3% of a layout at most */
  --sand-100:#f6f2ea;
  --sand-200:#eae2d3;

  /* ── semantic aliases ──────────────────────────────────────────────────── */

  /* grounds: the page alternates paper and pale between bands */
  --surface-page:var(--n-025);
  --surface-band:var(--n-050);
  --surface-card:var(--n-000);
  --surface-sunken:var(--n-025);
  --surface-ink:var(--n-950);
  --surface-cold:var(--steel-100);

  /* text — NOTE the --fg-* prefix: --text-* is the SIZE ramp in typography.css,
     and a colour sharing that prefix silently loses to it */
  --fg-primary:var(--n-950);
  --fg-body:var(--n-600);
  --fg-muted:var(--n-500);
  --fg-label:var(--n-400);
  --fg-on-ink:#ffffff;
  --fg-on-signal:#ffffff;

  /* accent, as text vs as fill — cobalt 400 fails contrast as small text */
  --accent-fill:var(--signal-400);
  --accent-fill-hover:var(--signal-500);
  --accent-text:var(--signal-600);
  --accent-text-strong:var(--signal-700);
  --accent-wash:var(--signal-100);
  --accent-wash-border:var(--signal-200);
  --accent-return:var(--signal-300);

  /* the gap */
  --danger-mark:var(--port-500);
  --danger-text:var(--port-600);
  --danger-wash:var(--port-100);

  /* lines */
  --border-hairline:var(--n-100);
  --border-rule:var(--n-200);
  --border-strong:var(--n-300);
  --border-ink:var(--n-950);

  /* the signature interaction */
  --cell-rest:transparent;
  --cell-hover:var(--n-000);
  --cell-sideline:var(--signal-400);

  --focus-ring:var(--n-950);
  --focus-ring-ink:var(--signal-300);
}