/* ============================================================
   Mojo AI Services — Redesign tokens
   Prior: P6 Technical / Industrial (instrument-panel)
   Palette built in OKLCH from one warm-neutral hue (H=95) plus
   two signal hues used like indicator lights. See DESIGN.lock.
   Every color/type/space decision downstream derives from here.
   ============================================================ */
:root {
  /* ============================================================
     BRAND PALETTE — Dark Navy + Copper (×3) + Off-White
     #0D1B2A · #B87333 · #D4A373 · #8B4513 · #F0EDE8
     ============================================================ */
  /* Substrate (off-white) */
  --paper:        #F0EDE8;   /* page background — brand off-white */
  --panel:        #F7F4EF;   /* raised panel surface */
  --well:         #E7E0D4;   /* recessed well */
  --line:         #DCD4C6;   /* hairline divider */
  --line-strong:  #BEB4A1;   /* emphasized rule / dot-grid */

  /* Ink (dark navy) */
  --ink:          #0D1B2A;   /* primary text + dark surfaces — brand navy (~15:1 on paper) */
  --ink-2:        #4C5763;   /* secondary text — AA on paper (~6.3:1) */
  --ink-3:        #717A84;   /* faint labels — large text only */

  /* Copper accent family (brand) */
  --copper:       #B87333;   /* brand copper — indicators, caret, on-dark large text */
  --copper-ink:   #8B4513;   /* brand copper-dark — AA accent text + CTA fills */
  --copper-deep:  #6E3A12;   /* deeper copper — hover / active */
  --copper-light: #D4A373;   /* brand copper-light — on-dark soft accents */
  --copper-wash:  rgba(184, 115, 51, 0.12);
  /* aliases: prior "signal"/"orange" usages now resolve to brand copper */
  --signal:       var(--copper);
  --signal-ink:   var(--copper-ink);
  --orange:       var(--copper);
  --orange-ink:   var(--copper-ink);
  --orange-wash:  var(--copper-wash);

  /* Indicator dots — brand copper variants */
  --status:       var(--copper);
  --status-ink:   var(--copper-ink);  /* links */
  --ok:           var(--copper);      /* live / online pulse */
  --warn:         var(--copper-light);

  /* Dark chrome strips (navy) */
  --ink-panel:    #0D1B2A;
  --on-ink:       #F0EDE8;
  --on-ink-dim:   #AEB4BA;

  /* ---- Type ---- */
  --font-grotesk: 'Hanken Grotesk', 'Inter Tight', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'Spline Sans Mono', ui-monospace, 'SF Mono', 'JetBrains Mono', 'Cascadia Code', Menlo, monospace;

  /* type scale — 1.2 minor third, base 16px */
  --t-micro:   0.6875rem;  /* 11px — readout captions */
  --t-label:   0.75rem;    /* 12px — mono labels */
  --t-body:    1rem;       /* 16px */
  --t-lead:    1.1875rem;  /* 19px */
  --t-h3:      1.25rem;    /* 20px */
  --t-h2:      clamp(1.6rem, 1.15rem + 1.7vw, 2.25rem);
  --t-display: clamp(2.75rem, 1.3rem + 6.1vw, 5.75rem);

  /* ---- Spacing: 8px base ---- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;

  /* ---- Radius: instrument = small only, never reflexive 2xl ---- */
  --r-1: 2px; --r-2: 4px; --r-3: 6px;

  /* ---- Motion: mechanical, short, precise ---- */
  --e-precise: cubic-bezier(0.2, 0, 0, 1);
  --d-1: 120ms; --d-2: 200ms; --d-3: 320ms;

  /* ---- Layout ---- */
  --maxw: 1200px;
  --gutter: clamp(20px, 5vw, 56px);
}