/* Nyman Investment — design tokens. THE ONE PLACE for colours, type sizes, spacing and layout sizes.
   The values are the Finance Hub's (project-finance-hub frontend/src/index.css :root, docs/designsystem/), so the two
   apps read as one product. Every other stylesheet and every script uses these names; scripts/check.mjs fails on a
   raw colour (hex, rgb(), rgba(), hsl()) anywhere else in css/ or js/. Rules for using them: docs/design/DESIGN_SYSTEM.md.

   Colour rules (owner, 6 Nov 2026): neutrals do the work; --accent only for selection, actions, links and focus;
   --pos/--neg only for P&L/direction and ok/fail; --warn ONLY for "stale or broken and you can fix it";
   DEMO / MOCK / READ-ONLY are neutral labels. No gold, brass or bronze anywhere. */
:root {
  /* Surfaces and lines (Hub) */
  --ink: #0A0C10;
  --surface: #11151B;
  --raised: #161C24;
  --line: #222A35;
  --line-soft: #1A212A;
  /* Text (Hub): three levels, no more */
  --text: #DCE3EA;
  --muted: #78838F;
  --dim: #4E5866;
  /* Accent and meaning (Hub) */
  --accent: #5BA3F5;
  --accent-bg: rgba(91, 163, 245, .10);
  --accent-ink: #07101C;
  --pos: #35C48E;
  --neg: #F0645F;
  --warn: #E0A33C;
  --back: #5BA3F5;
  --back-bg: rgba(91, 163, 245, .10);
  --lay: #F58BB0;
  --lay-bg: rgba(245, 139, 176, .10);

  /* Derived: the 35 % borders and faint fills the Hub writes inline, named once here */
  --accent-line: rgba(91, 163, 245, .45);
  --accent-glow: rgba(91, 163, 245, .13);
  --accent-glow-2: rgba(91, 163, 245, .04);
  --pos-line: rgba(53, 196, 142, .35);
  --pos-bg: rgba(53, 196, 142, .07);
  --pos-halo: rgba(53, 196, 142, .14);
  --pos-clear: rgba(53, 196, 142, 0);
  --neg-line: rgba(240, 100, 95, .35);
  --neg-bg: rgba(240, 100, 95, .06);
  --warn-line: rgba(224, 163, 60, .35);
  --warn-bg: rgba(224, 163, 60, .06);
  --scrim: rgba(4, 6, 9, .72);
  --glass: rgba(10, 12, 16, .76);
  --glass-card: rgba(17, 21, 27, .88);
  --sheen: rgba(255, 255, 255, .02);
  --shadow-pop: 0 18px 50px rgba(0, 0, 0, .5);
  --shadow-card: 0 30px 80px rgba(0, 0, 0, .55);
  --shadow-drawer: -12px 0 30px rgba(0, 0, 0, .35);
  --mask: #000;

  /* Data visualisation: cool, desaturated, no yellow/gold/brown. Prefer highlighting over colouring everything. */
  --viz-edge: #2B3646;
  --viz-relation: #7FA7C9;
  --viz-1: #6F93C0;
  --viz-2: #5FA39A;
  --viz-3: #9A88C2;
  --viz-4: #7E8EA3;
  --viz-5: #5FA8B8;
  --viz-6: #C27F86;
  --viz-7: #79A88C;
  --viz-8: #8A9FC9;

  /* Type (Hub): fonts and the one scale */
  --disp: "Space Grotesk", "IBM Plex Sans", sans-serif;
  --disp-tracking: -.025em;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --sans: "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --t-hero: 32px;     /* .v-main: a money figure */
  --t-title: 22px;    /* page title (.side-hd h1) */
  --t-dialog: 15.5px; /* dialog title, brand */
  --t-input: 15px;    /* palette input */
  --t-body: 14px;     /* body, reading text */
  --t-ui: 13px;       /* card title, rail item, fields, list rows */
  --t-table: 12.5px;  /* tables, kv rows, buttons, tabs, page sub */
  --t-small: 11.5px;  /* notes, small buttons */
  --t-meta: 11px;     /* card subtitles, mono meta */
  --t-label: 10px;    /* eyebrow, field label, status line */
  --t-micro: 9.5px;   /* badges, table heads */

  /* Space, shape and layout (Hub) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px;
  --r: 3px;
  --rail-w: 216px;
  --top-h: 48px;       /* the top bar with the room switch (two rooms, 7 Nov 2026) */
  --status-h: 30px;
  --related-w: 320px;
  color-scheme: dark;
}