/* ==========================================================
   SALT ESCAPES — INVESTOR PORTAL DESIGN TOKENS (v2)
   Single source of truth for the investor portal design system.
   Do NOT hardcode colours, fonts, sizes, radii or durations in
   component CSS — reference these tokens. See STYLE-GUIDE.md.
   ========================================================== */
:root{

  /* ----- Palette · strict monochrome ----- */
  --color-ink:        #141413;   /* primary text, solid buttons, accent bars */
  --color-ink-soft:   #3a3936;   /* secondary text */
  --color-muted:      #6f6b64;   /* tertiary text, labels, captions */
  --color-hairline:   #e4e2dd;   /* borders, dividers, chart gridlines */
  --color-paper:      #fafaf8;   /* page background */
  --color-card:       #ffffff;   /* card / panel surfaces */
  --color-wash:       #f1f0ec;   /* hover fills, hints, subtle blocks */
  --color-black:      #000000;   /* solid-button hover only */
  --color-white:      #ffffff;   /* text on dark */
  --color-chart-muted:#c9c6bf;   /* prior-period chart bars */
  --color-chart-accent:#244447; /* current-period chart bars — brand teal */

  /* ----- Alpha layers ----- */
  --overlay-ink-10:rgba(20,20,19,.1);
  --overlay-ink-15:rgba(20,20,19,.15);
  --overlay-ink-65:rgba(20,20,19,.65);
  --overlay-ink-72:rgba(20,20,19,.72);
  --surface-paper-blur:rgba(250,250,248,.92);  /* sticky topbar */
  --on-dark-70:rgba(255,255,255,.7);
  --on-dark-82:rgba(255,255,255,.82);
  --on-dark-85:rgba(255,255,255,.85);

  /* ----- Typography ----- */
  --font-display:'Unbounded', sans-serif;                    /* headings: ALWAYS uppercase, weight 300/400 only */
  --font-body:'Helvetica Neue', Helvetica, Arial, sans-serif;
  --weight-display-light:300;
  --weight-display:400;      /* Unbounded max weight — never heavier */
  --weight-medium:500;

  /* Body type scale */
  --text-2xs:.65rem;   /* eyebrows, pins */
  --text-xs:.72rem;    /* nav links, chips, field labels, buttons */
  --text-sm:.8rem;     /* metadata, deltas, toasts, chart notes */
  --text-md:.9rem;     /* list rows, secondary copy */
  --text-base:.95rem;  /* body copy */
  --text-lg:1rem;      /* card titles, base */

  /* Display (fluid) scale */
  --display-sm:clamp(1.1rem,2vw,1.6rem);      /* strip/feature headings */
  --display-md:clamp(1.4rem,2.6vw,2.2rem);    /* gate visual heading */
  --display-lg:clamp(1.5rem,2.4vw,2rem);      /* gate form h1 */
  --display-xl:clamp(1.6rem,3.4vw,2.6rem);    /* view headings */
  --display-kpi:clamp(1.4rem,2.4vw,2rem);     /* KPI numbers */
  --display-ghost:clamp(2.4rem,6vw,4.5rem);   /* oversized quarter marker */

  /* Letter spacing */
  --track-display:.04em;   /* large display headings */
  --track-heading:.06em;   /* card/section headings */
  --track-panel:.1em;      /* panel headings */
  --track-label:.14em;     /* labels, small links */
  --track-nav:.16em;       /* nav links */
  --track-button:.18em;    /* buttons, wordmark, pins */
  --track-date:.2em;       /* dates */
  --track-eyebrow:.28em;   /* eyebrows */
  --track-wordmark-sub:.32em;

  --leading-tight:1.15;
  --leading-body:1.6;

  /* ----- Spacing ----- */
  --space-1:.25rem;
  --space-2:.5rem;
  --space-3:.75rem;
  --space-4:1rem;
  --space-5:1.5rem;
  --space-6:2rem;
  --space-7:2.5rem;
  --space-8:3.5rem;
  --space-9:5rem;
  --pad-page:clamp(1.25rem,4vw,3rem);   /* page gutters */
  --pad-gate:clamp(2rem,6vw,6rem);      /* auth gate padding */

  /* ----- Shape & borders ----- */
  --radius:2px;                                /* global corner radius */
  --border:1px solid var(--color-hairline);
  --border-accent:2px solid var(--color-ink);

  /* ----- Layout ----- */
  --content-max:1240px;
  --tap-min:44px;       /* minimum tap target */
  --control-min:48px;   /* primary controls */

  /* ----- Motion ----- */
  --dur-fast:.15s;
  --dur-med:.25s;
  --dur-slow:.45s;
  --ease:ease;
  --ease-out:ease-out;

  /* ----- Legacy aliases (keep old names wired to tokens) ----- */
  --ink:var(--color-ink);
  --ink-soft:var(--color-ink-soft);
  --muted:var(--color-muted);
  --hairline:var(--color-hairline);
  --paper:var(--color-paper);
  --card:var(--color-card);
  --wash:var(--color-wash);
  --display:var(--font-display);
  --body:var(--font-body);
}