/* =============================================================================
   Global Exchange — Design Tokens
   Single source of truth for the regulated operations cockpit visual language.
   Derived from the static prototype brand (crimson -> navy, forest green,
   amber, bone background) and extended into a full token scale.
   ============================================================================= */

:root {
  color-scheme: light;

  /* ---- Brand palette ----------------------------------------------------- */
  --gx-crimson: #b1272e;
  --gx-crimson-deep: #7f0d14;
  --gx-crimson-ink: #5c080d;
  --gx-navy: #051641;
  --gx-forest: #163300;
  --gx-amber: #b87419;
  --gx-red: #9f1112;
  --gx-red-bright: #dd2222;

  /* ---- Neutrals (warm, paper-like) -------------------------------------- */
  --gx-bone: #f3f1ef;
  --gx-surface: #ffffff;
  --gx-surface-soft: #f8f6f5;
  --gx-surface-sunk: #f2efed;
  --gx-ink: #190000;
  --gx-ink-soft: #3b3431;
  --gx-muted: #69615f;
  --gx-faint: #9a908d;
  --gx-line: #ded7d5;
  --gx-line-soft: #ebe5e3;

  /* ---- Semantic status (text / surface / border triplets) --------------- */
  --gx-ok-ink: #163300;
  --gx-ok-surface: #e4efd9;
  --gx-ok-border: #c4dcab;

  --gx-warn-ink: #7b4a0f;
  --gx-warn-surface: #fff0d4;
  --gx-warn-border: #f0d9a8;

  --gx-danger-ink: #7d000a;
  --gx-danger-surface: #ffe2e2;
  --gx-danger-border: #f3c5c5;

  --gx-info-ink: #1c2e63;
  --gx-info-surface: #e7ecf8;
  --gx-info-border: #c4d0ec;

  --gx-neutral-ink: #4e5161;
  --gx-neutral-surface: #ebeef5;
  --gx-neutral-border: #d6dae6;

  --gx-process-ink: #5a3a86;
  --gx-process-surface: #efe7fb;
  --gx-process-border: #d8c7f0;

  /* ---- Typography -------------------------------------------------------- */
  --gx-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --gx-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

  --gx-text-2xs: 11px;
  --gx-text-xs: 12px;
  --gx-text-sm: 13px;
  --gx-text-base: 14px;
  --gx-text-md: 16px;
  --gx-text-lg: 18px;
  --gx-text-xl: 21px;
  --gx-text-2xl: 26px;
  --gx-text-3xl: 32px;

  --gx-weight-regular: 450;
  --gx-weight-medium: 600;
  --gx-weight-bold: 750;
  --gx-weight-black: 850;

  /* ---- Spacing scale (4px base) ----------------------------------------- */
  --gx-space-1: 4px;
  --gx-space-2: 8px;
  --gx-space-3: 12px;
  --gx-space-4: 16px;
  --gx-space-5: 20px;
  --gx-space-6: 24px;
  --gx-space-8: 32px;
  --gx-space-10: 40px;

  /* ---- Radius ------------------------------------------------------------ */
  --gx-radius-xs: 3px;
  --gx-radius-sm: 4px;
  --gx-radius-md: 6px;
  --gx-radius-lg: 8px;
  --gx-radius-pill: 999px;

  /* ---- Elevation --------------------------------------------------------- */
  --gx-shadow-sm: 0 1px 4px rgba(35, 45, 39, 0.08);
  --gx-shadow-md: 0 15px 45px rgba(22, 29, 25, 0.10);
  --gx-shadow-lg: 0 24px 70px rgba(80, 4, 4, 0.18);
  --gx-ring-focus: 0 0 0 3px rgba(177, 39, 46, 0.28);

  /* ---- Layout ------------------------------------------------------------ */
  --gx-sidebar-width: 264px;
  --gx-sidebar-width-collapsed: 84px;
  --gx-topbar-height: 64px;
  --gx-content-max: 1480px;

  /* ---- Brand gradients --------------------------------------------------- */
  --gx-gradient-brand: linear-gradient(168deg, #b1272e 0%, #7f0d14 54%, #051641 118%);
  --gx-gradient-sidebar: linear-gradient(168deg, rgba(177, 39, 46, 0.97) 0%, rgba(127, 13, 20, 0.98) 52%, rgba(5, 22, 65, 0.97) 125%);
  --gx-gradient-command:
    radial-gradient(circle at 72% 18%, rgba(221, 34, 34, 0.34), transparent 34%),
    linear-gradient(168deg, #b1272e 0%, #7f0d14 54%, #051641 118%);
  --gx-ledger-grid:
    linear-gradient(90deg, rgba(127, 13, 20, 0.04) 1px, transparent 1px),
    linear-gradient(180deg, rgba(22, 51, 0, 0.035) 1px, transparent 1px);
}