/* =========================================================
   ANGARA OS — DESIGN TOKENS  (v79-aligned)
   Ember/coal/cream palette, glass layers, timing system.
   Dark is the default register. light.css overrides.
   ========================================================= */

:root {
  /* ── Primitive palette ──────────────────────────────── */
  --coal:   #110d0a;      /* page background — warm near-black     */
  --coal-2: #1a1410;      /* lifted dark surface                   */
  --coal-3: #221b16;      /* highest dark surface / modal bg       */
  --cream:  #f5efe2;      /* primary text on dark                  */
  --bone:   #fdfbf6;      /* light-mode page bg                    */

  /* Accent — ember (warm terracotta) */
  --ember:     #b06640;
  --ember-2:   #995838;
  --ember-3:   #c97848;
  --ember-soft: rgba(176,102,64,0.10);
  --ember-glass: rgba(176,102,64,0.06);

  /* Semantic money colours */
  --bay:     #5a8067;   /* profit / income / positive             */
  --cinder:  #9a4434;   /* loss / expense / negative              */
  --saffron: #a88838;   /* pending / pipeline / suspended         */

  /* ── Surfaces ───────────────────────────────────────── */
  --void:   var(--coal);
  --void-2: var(--coal-2);
  --void-3: var(--coal-3);

  /* Semantic surface aliases */
  --surface-1: var(--void);
  --surface-2: var(--void-2);

  /* ── Hairlines ──────────────────────────────────────── */
  --hl-1: rgba(245,239,226,0.08);
  --hl-2: rgba(245,239,226,0.15);

  /* Glass layers (content over Silk) */
  --glass-1:            rgba(245,239,226,0.025);
  --glass-2:            rgba(245,239,226,0.045);
  --glass-3:            rgba(245,239,226,0.075);
  --glass-border:       var(--hl-1);
  --glass-border-bright:var(--hl-2);
  --hairline:           var(--hl-1);
  --hairline-strong:    var(--hl-2);

  /* ── Text ───────────────────────────────────────────── */
  --text:   var(--cream);
  --text-1: var(--cream);
  --text-2: rgba(245,239,226,0.70);
  --text-3: rgba(245,239,226,0.46);
  --text-4: rgba(245,239,226,0.28);

  /* ── Accent aliases (maps to ember) ────────────────── */
  --accent:        var(--ember);
  --accent-2:      var(--ember-2);
  --accent-3:      var(--ember-3);
  --accent-soft:   var(--ember-soft);
  --accent-strong: rgba(176,102,64,0.20);
  --accent-glow:   rgba(176,102,64,0.45);
  --on-accent:     var(--bone);

  /* ── Semantic palette (mapped to money colours) ────── */
  --green:  var(--bay);    --green-glass:  rgba(90,128,103,0.10);
  --red:    var(--cinder); --red-glass:    rgba(154,68,52,0.10);
  --yellow: var(--saffron);--yellow-glass: rgba(168,136,56,0.10);
  --blue:   var(--ember);  --blue-glass:   var(--ember-soft);
  --purple: var(--ember);  --purple-glass: var(--ember-soft);
  --rouge:  var(--cinder); --rouge-glass:  rgba(154,68,52,0.10);

  /* ── Effects ────────────────────────────────────────── */
  --blur:    blur(40px) saturate(160%);
  --blur-sm: blur(20px) saturate(140%);
  --blur-xs: blur(10px) saturate(130%);

  /* ── Motion ─────────────────────────────────────────── */
  --ease-out:      cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast:  180ms;
  --t-base:  280ms;
  --t-slow:  520ms;

  /* ── Geometry ───────────────────────────────────────── */
  --radius:    14px;
  --radius-sm: 10px;
  --radius-xs:  6px;
  --radius-pill: 999px;

  /* ── Typography ─────────────────────────────────────── */
  --display: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
  --sans:    'Inter', system-ui, sans-serif;
  --mono:    'JetBrains Mono', ui-monospace, monospace;
  /* serif alias kept for any old code refs — maps to display */
  --serif:   var(--display);
}
