/* ============================================================
   FUSD — COLOR TOKENS
   Anchored on the brand board palette; scales filled
   harmonically for a dark-first, glow-forward DeFi system.
   ============================================================ */
:root {
  /* ---- Brand: Signal Teal (primary) ---- */
  --teal-200: #A6E4E7;
  --teal-300: #74D0D4;
  --teal-400: #54B8BD;
  --teal-500: #40A2A7;   /* Signal Teal — primary brand */
  --teal-600: #33848A;
  --teal-700: #276469;
  --teal-800: #1C4A4E;

  /* ---- Blues (interactive + accents) ---- */
  --blue-300: #5C8AD6;
  --blue-400: #2B5FAF;   /* Volt Blue — interactive */
  --blue-500: #25478B;   /* Horizon Blue — support */
  --blue-600: #1F3067;   /* Deep Navy — deep accent */
  --blue-700: #182645;

  /* ---- Ink / dark neutrals (surfaces) ---- */
  --ink-950: #0A0E1A;    /* deepest background */
  --ink-900: #0F1525;    /* app background */
  --ink-850: #141C33;
  --ink-800: #1A223B;    /* Midnight Ink — base surface */
  --ink-700: #232D4B;
  --ink-600: #2E3A5C;
  --ink-500: #3A4870;

  /* ---- Cool grays (text + muted) ---- */
  --gray-500: #718096;   /* Steel Gray — muted neutral */
  --gray-400: #8C9AAE;
  --gray-300: #AAB7C7;
  --gray-200: #C6D2DD;
  --mist-100: #DCE7EB;   /* Mist White — light neutral */
  --white: #F4F9FB;

  /* ---- Semantic status ---- */
  --green-500: #2FAE83;  /* healthy / success */
  --green-400: #44C99A;
  --amber-500: #E2A33C;  /* caution / warning */
  --amber-400: #F0B95C;
  --red-500: #E0555A;    /* liquidation / danger */
  --red-400: #ED7378;

  /* ============================================================
     SEMANTIC ALIASES — reference these in product UI
     ============================================================ */
  /* Backgrounds & surfaces */
  --bg-base: var(--ink-950);
  --bg-app: var(--ink-900);
  --surface-card: var(--ink-800);
  --surface-raised: var(--ink-700);
  --surface-sunken: var(--ink-850);
  --surface-overlay: rgba(10, 14, 26, 0.72);

  /* Text */
  --text-primary: var(--white);
  --text-secondary: var(--gray-200);
  --text-muted: var(--gray-500);
  --text-brand: var(--teal-400);
  --text-inverse: var(--ink-950);

  /* Borders */
  --border-subtle: rgba(220, 231, 235, 0.08);
  --border-default: rgba(220, 231, 235, 0.14);
  --border-strong: rgba(220, 231, 235, 0.24);
  --border-brand: rgba(64, 162, 167, 0.55);

  /* Brand / interactive */
  --brand: var(--teal-500);
  --brand-hover: var(--teal-400);
  --brand-active: var(--teal-600);
  --brand-contrast: var(--ink-950);
  --interactive: var(--blue-400);
  --interactive-hover: var(--blue-300);

  /* Status semantic */
  --status-healthy: var(--green-500);
  --status-caution: var(--amber-500);
  --status-danger: var(--red-500);
  --status-info: var(--blue-400);

  /* Focus */
  --focus-ring: rgba(64, 162, 167, 0.55);
}