/* ==========================================================================
   ActionRouter — design tokens
   Transcribed from docs/brand.md v1.0. Do not invent values here; if a value
   is missing, add it to brand.md first and then bring it across.
   ========================================================================== */

:root {
  /* --- Green ramp (SearchX brand, brand.md §2.1) ------------------------- */
  --ar-green-50:   #B3F9D2;
  --ar-green-100:  #90F5BD;
  --ar-green-200:  #6EF1A8;
  --ar-green-300:  #4DEC93;
  --ar-green-400:  #3EFF94;
  --ar-green-500:  #2CE67E;
  --ar-green-600:  #1BD26A;  /* primary */
  --ar-green-700:  #18AE59;
  --ar-green-800:  #169049;
  --ar-green-900:  #147239;
  --ar-green-950:  #10552B;
  --ar-green-1000: #0C391D;
  --ar-green-1100: #071E0F;

  /* --- Neutrals (brand.md §2.2) ----------------------------------------- */
  --ar-ink:          #0A0D12;
  --ar-ink-plum:     #1B0C25;
  --ar-grey-900:     #252B37;
  --ar-grey-700:     #414651;
  --ar-grey-600:     #535862;
  --ar-grey-500:     #717680;
  --ar-grey-400:     #A4A7AE;
  --ar-grey-300:     #D5D7DA;
  --ar-grey-200:     #E9EAEB;
  --ar-grey-100:     #F5F5F5;
  --ar-grey-50:      #FAFAFA;
  --ar-surface:      #FFFFFF;
  --ar-surface-warm: #F7F6F7;
  --ar-surface-cool: #F9F9FC;

  /* --- Status (brand.md §2.4). Amber/red/blue are ours, not SearchX's. --- */
  --ar-success:      #1BD26A;
  --ar-success-tint: #B3F9D2;
  --ar-success-text: #10552B;

  --ar-info:         #1EA0EE;
  --ar-info-tint:    #DDF1FD;
  --ar-info-text:    #0B5A87;

  --ar-warning:      #F5A524;
  --ar-warning-tint: #FDF0D5;
  --ar-warning-text: #7A4A00;

  --ar-danger:       #E5484D;
  --ar-danger-tint:  #FCE4E4;
  --ar-danger-text:  #8C1C20;

  --ar-neutral:      #717680;
  --ar-neutral-tint: #F0F0F1;
  --ar-neutral-text: #414651;

  /* --- Semantic surfaces ------------------------------------------------- */
  --ar-page-bg:      var(--ar-grey-50);
  --ar-card-bg:      var(--ar-surface);
  --ar-card-border:  var(--ar-grey-200);
  --ar-input-border: var(--ar-grey-300);
  --ar-text:         var(--ar-ink);
  --ar-text-2:       var(--ar-grey-700);
  --ar-text-3:       var(--ar-grey-600);
  --ar-text-muted:   var(--ar-grey-500);

  /* --- Type (brand.md §3) ------------------------------------------------
     B1 [CHECK]: American Grotesk Condensed Heavy is commercial and unlicensed
     for our use. Archivo at a condensed width is the agreed stand-in. -------- */
  --ar-font-display: "Archivo", "Archivo Condensed", "Inter Tight", sans-serif;
  --ar-font-ui:      "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ar-font-mono:    ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --ar-text-display: 56px;
  --ar-text-metric:  36px;
  --ar-text-h1:      28px;
  --ar-text-h2:      20px;
  --ar-text-h3:      16px;
  --ar-text-body:    14px;   /* base — dense operational tool */
  --ar-text-small:   13px;
  --ar-text-micro:   12px;

  /* --- Radius (brand.md §4) --------------------------------------------- */
  --ar-radius-control: 8px;
  --ar-radius-card:    12px;
  --ar-radius-modal:   16px;
  --ar-radius-pill:    9999px;

  /* --- Elevation — two only --------------------------------------------- */
  --ar-shadow-card:  0 1px 2px rgb(10 13 18 / 0.05);
  --ar-shadow-float: 0 12px 32px rgb(10 13 18 / 0.12);

  /* --- Spacing (4px base) ------------------------------------------------ */
  --ar-space-1: 4px;
  --ar-space-2: 8px;
  --ar-space-3: 12px;
  --ar-space-4: 16px;
  --ar-space-6: 24px;
  --ar-space-8: 32px;
  --ar-space-12: 48px;

  /* --- Layout ------------------------------------------------------------ */
  --ar-rail-width:    240px;
  --ar-rail-collapsed: 64px;
  --ar-topbar-height: 56px;
  --ar-banner-height: 32px;
  --ar-row-height:    44px;
  --ar-row-compact:   36px;

  /* --- Motion (brand.md §9) ---------------------------------------------- */
  --ar-transition: 150ms ease-out;

  /* --- Chart palette (brand.md §6) --------------------------------------- */
  --ar-chart-1: #1BD26A;
  --ar-chart-2: #1EA0EE;
  --ar-chart-3: #D37BFF;
  --ar-chart-4: #F5A524;
  --ar-chart-5: #717680;
  --ar-chart-6: #147239;
}

@media (prefers-reduced-motion: reduce) {
  :root { --ar-transition: 0ms; }
}