/* BRX Digital Design System — Tokens
 * Source of truth: BRX Digital Brand Guidelines v3.0 (April 2026) §19
 * PORTABLE: this file may be copied verbatim into downstream BRX tools.
 * Do not add selectors beyond :root / @media here. Component styles live in components.css.
 */

:root {
  /* Canvas & paper */
  --canvas:    #EEF1F8;
  --canvas-2:  #E6EAF3;
  --paper:     #FFFFFF;
  --paper-2:   #F7F8FC;
  --paper-3:   #EFF1F6;

  /* Ink (cool near-blacks, navy-leaning) */
  --ink-900:   #0E1726;
  --ink-800:   #1C2638;
  --ink-700:   #2E3A4D;
  --ink-600:   #4A5568;
  --ink-500:   #6B7280;
  --ink-400:   #9AA3AF;
  --ink-300:   #C8CCD6;
  --ink-200:   #DDE0E8;
  --ink-150:   #E7EAF0;

  /* Brand */
  --brx-navy:       #032133;
  --brx-navy-2:     #0A2F44;
  --brx-green:      #95D600;   /* FILL ONLY — 1.7:1 on white, fails contrast for text */
  --brx-green-ink:  #4F7400;   /* 5.5:1 AA — the only green safe for text */
  --brx-green-soft: #EAF6C7;

  /* Avatar chip palette (exact brand hexes, §3 Avatar chips) */
  --ac-mint:   #7FC9A8;
  --ac-sky:    #6AA3E0;
  --ac-lilac:  #B494D8;
  --ac-coral:  #E68B82;
  --ac-amber:  #E8B264;
  --ac-sage:   #9BB07A;

  /* Semantic */
  --sky:       #2F6BC7;
  --sky-soft:  #DBE6F7;
  --sun:       #D68F1E;
  --sun-soft:  #FBEAD0;
  --rose:      #D04D4D;
  --rose-soft: #F7DCD9;
  --moss:      #2F7D32;
  --plum:      #6B4FBF;   /* charts only */

  /* Shape */
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   18px;
  --r-xl:   24px;
  --r-pill: 999px;

  /* Elevation */
  --shadow-1: 0 1px 2px rgba(14,23,38,.05), 0 1px 3px rgba(14,23,38,.04);
  --shadow-2: 0 6px 16px -6px rgba(14,23,38,.10), 0 2px 6px -2px rgba(14,23,38,.05);
  --shadow-3: 0 22px 44px -12px rgba(14,23,38,.16), 0 6px 12px -6px rgba(14,23,38,.06);

  /* Focus ring — brand-consistent, AA-visible */
  --focus-ring: 0 0 0 3px var(--sky-soft);

  /* Type */
  --font-head: 'Poppins', system-ui, sans-serif;
  --font-body: 'Montserrat', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
  --font-edit: 'Instrument Serif', Georgia, serif;

  /* Motion */
  --ease-out: cubic-bezier(.2, .7, .15, 1);
  --ease-in:  cubic-bezier(.4, 0,  1,  1);
  --dur-120:  120ms;
  --dur-180:  180ms;
  --dur-240:  240ms;
  --dur-320:  320ms;

  /* Shell layout (BRX One specific; declared here so tools that embed the shell can read it) */
  --sidebar-w: 240px;
  --topbar-h:   56px;
}

/* Reduced motion: collapse all animation durations to zero.
 * Sound system reads the same media query via matchMedia and suppresses audio. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-120: 0ms;
    --dur-180: 0ms;
    --dur-240: 0ms;
    --dur-320: 0ms;
  }
}
