/*
 * MMAT design tokens — the single source of visual truth.
 *
 * One rule governs the palette: colour means provenance and trust, never
 * decoration. Green and red are reserved exclusively for market direction.
 * Amber is reserved exclusively for degraded trust. Exactly one accent marks
 * things an operator can act on. Anything that is merely surface is achromatic,
 * so that a coloured pixel on this screen always carries information.
 */

:root {
  /* -- canvas and surfaces -------------------------------------------
     A cool ink rather than neutral black. Surfaces step in luminance only,
     never in hue, so layering never competes with semantic colour. */
  --ink-900: #070910;
  --ink-800: #0b0e17;
  --ink-700: #10141f;
  --ink-600: #161b28;
  --ink-500: #1d2331;
  --ink-400: #262d3d;

  --line: #1f2634;
  --line-strong: #2e3648;

  /* -- type ----------------------------------------------------------- */
  --text: #dfe5f0;
  --text-strong: #ffffff;
  --text-muted: #8790a4;
  --text-faint: #5a6379;

  /* -- market direction. Reserved. ------------------------------------ */
  --up: #2bbf7e;
  --up-wash: rgba(43, 191, 126, 0.12);
  --down: #ef5a54;
  --down-wash: rgba(239, 90, 84, 0.12);

  /* -- trust. Reserved. ----------------------------------------------- */
  --trust-ok: #2bbf7e;
  --trust-degraded: #e6a338;
  --trust-degraded-wash: rgba(230, 163, 56, 0.13);
  --trust-absent: #6b7488;
  --trust-blocked: #ef5a54;

  /* -- interaction. The only accent. ---------------------------------- */
  --accent: #5b8cff;
  --accent-wash: rgba(91, 140, 255, 0.14);
  --focus: #6f9bff;

  /* -- spacing: 4px scale --------------------------------------------- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 20px; --s6: 24px; --s7: 28px; --s8: 32px;
  --s10: 40px; --s12: 48px;

  /* -- radii ----------------------------------------------------------
     A larger panel radius reads as a product surface rather than a dialog
     box; the tighter one is for controls sitting inside a panel. */
  --r: 10px;
  --r-sm: 6px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* -- elevation ------------------------------------------------------
     Depth comes from shadow and a top highlight, not from heavier borders.
     A 1px line on every edge is what made the previous pass read flat. */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .30);
  --shadow-2: 0 6px 20px -6px rgba(0, 0, 0, .55);
  --shadow-3: 0 18px 48px -12px rgba(0, 0, 0, .65);
  --edge-top: inset 0 1px 0 rgba(255, 255, 255, .045);

  /* Panel fills. A gentle vertical lift, never a coloured gradient. */
  --panel-fill: linear-gradient(180deg, #10141f 0%, #0d111a 100%);
  --panel-fill-raised: linear-gradient(180deg, #161b28 0%, #11151f 100%);

  /* -- type scale ----------------------------------------------------- */
  --font-ui: ui-sans-serif, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo,
    "Roboto Mono", "Courier New", monospace;

  /* Scale lifted a step throughout: the previous pass leaned on 10-13px for
     almost everything, which is where the spreadsheet feeling came from. */
  --t-micro: 11px; --t-xs: 12px; --t-sm: 13px; --t-base: 14px;
  --t-md: 16px;  --t-lg: 20px;  --t-xl: 27px;  --t-2xl: 38px;

  --w-reg: 400; --w-med: 500; --w-semi: 600;
  --track: 0.07em;

  /* -- motion --------------------------------------------------------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --fast: 110ms;
  --normal: 180ms;

  /* -- layering ------------------------------------------------------- */
  --z-base: 1; --z-sticky: 100; --z-drawer: 200; --z-modal: 300;

  /* -- shell metrics -------------------------------------------------- */
  --rail-h: 56px;
  --nav-w: 232px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --fast: 1ms; --normal: 1ms; }
}