/* ═══════════════════════════════════════════════════════════════════
   Paxeer Design Tokens — Brand Identity System v3.0 · 2026
   The settlement layer for the machine economy.

   Drop-in custom properties for the Paxeer brand. Two co-equal brand
   blues, cool obsidian neutrals, cinematic depth, premium motion.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* ——— Brand blues — co-equal ——————————————————————————————— */
  --pax-blue:        #004CED;   /* Paxeer Blue — electric, original */
  --pax-ink:         #2841B8;   /* Paxeer Ink  — sophisticated, deep */
  --pax-blue-deep:   #0042D1;   /* Blue press / hover */
  --pax-ink-deep:    #1F3294;   /* Ink press / hover */
  --blue-fore:       #8E9AE0;   /* readable accent text on dark */
  --blue-tint:       #E5E8F8;   /* pale tint surface */
  --brand-grad:      linear-gradient(118deg, #2841B8 0%, #004CED 100%);
  --accent-tint:     rgba(0, 76, 237, 0.12);
  --ink-tint:        rgba(40, 65, 184, 0.16);

  /* ——— Neutrals — cool obsidian (slate-tinted) ——————————————— */
  --black:           #04050A;
  --bg:              #0A0C10;   /* page canvas — obsidian */
  --bg-elev:         #11141B;   /* cards, panels */
  --bg-sub:          #14171F;   /* inputs, recessed */
  --graphite:        #1A1E27;
  --storm:           #3A4151;
  --slate:           #6F7686;
  --mist:            #9DA3B2;
  --smoke:           #CFD3DB;
  --porcelain:       #EFF1F5;
  --white:           #FFFFFF;

  --border:          rgba(255, 255, 255, 0.07);
  --border-strong:   rgba(255, 255, 255, 0.12);

  /* ——— Text roles (dark-first) ——————————————————————————————— */
  --fg:              #ECEEF4;   /* primary text on dark */
  --fg-muted:        #9DA3B2;   /* secondary */
  --fg-subtle:       #6F7686;   /* tertiary */
  --fg-faint:        #3A4151;   /* quaternary */
  --fg-inverse:      #04050A;   /* text on light surfaces */

  /* ——— System colours ———————————————————————————————————————— */
  --success:         #2F9F75;
  --danger:          #D14D5E;
  --warning:         #CB7C25;
  --legacy:          #00E0FF;   /* deprecated — do not use in new work */

  /* ——— Type ——————————————————————————————————————————————————— */
  --font-display:    'Paxeer Grand Sans', 'Inter', system-ui, sans-serif;
  --font-body:       'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:       'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  --track-display:   -0.028em;
  --track-tight:     -0.02em;
  --track-body:      -0.008em;
  --track-meta:      0.16em;

  /* ——— Radii ——————————————————————————————————————————————————— */
  --r-sm:    6px;
  --r-md:    10px;
  --r-lg:    16px;
  --r-xl:    24px;
  --r-2xl:   34px;
  --r-pill:  999px;

  /* ——— Cinematic shadows ——————————————————————————————————————— */
  --sh-1: 0 1px 2px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.04);
  --sh-2: 0 2px 6px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.05);
  --sh-3: 0 6px 16px rgba(0,0,0,0.28), 0 1px 2px rgba(0,0,0,0.14), inset 0 1px 0 rgba(255,255,255,0.05);
  --sh-4: 0 14px 32px rgba(0,0,0,0.36), 0 4px 10px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.06);
  --sh-5: 0 28px 64px rgba(0,0,0,0.46), 0 10px 20px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.06);

  /* ——— Motion — premium "glassy" easing ———————————————————————— */
  --ease:       cubic-bezier(0.32, 0.72, 0, 1);
  --ease-emph:  cubic-bezier(0.22, 1, 0.36, 1);
  --dur-1:      120ms;
  --dur-2:      220ms;
  --dur-3:      340ms;
  --dur-4:      560ms;
}
