/* ============================================================
   RUSTLE — BRAND TOKENS  (Rosé Pine Moon)
   The official, locked palette + type + spacing for rustle.cloud.
   Dark-only: the single Rosé Pine Moon palette.
   ============================================================ */

:root {
  /* ---- Rosé Pine Moon (dark) ---- */
  --base:        #232136;
  --surface:     #2a273f;
  --overlay:     #393552;
  --text:        #e0def4;
  --subtle:      #908caa;
  --muted:       #6e6a86;
  --iris:        #c4a7e7;   /* PRIMARY accent — interactive only */
  --on-iris:     #232136;   /* text/icon sitting on an iris fill */
  --foam:        #9ccfd8;   /* status: delivered */
  --gold:        #f6c177;   /* status: retrying  */
  --love:        #eb6f92;   /* status: failed    */
  --pine:        #3e8fb0;
  --rose:        #ea9a97;

  --line:        rgba(224,222,244,0.10);
  --line-strong: rgba(224,222,244,0.16);
  --dot:         rgba(224,222,244,0.05);
  --iris-soft:   rgba(196,167,231,0.13);
  --shadow-card: 0 18px 44px rgba(0,0,0,.16);

  /* ---- Type pairing ---- */
  --font-display: 'Source Serif 4', Georgia, serif;          /* headlines */
  --font-body:    'Hanken Grotesk', system-ui, sans-serif;   /* UI + body + buttons */
  --font-mono:    'Spline Sans Mono', ui-monospace, monospace;/* event names, labels, code, .cloud */

  /* type scale */
  --t-display: 74px;   /* h1 hero          (serif 500, lh 1.0, -.02em) */
  --t-h2:      44px;
  --t-h3:      28px;
  --t-lead:    18px;   /* subhead / lead body (lh 1.66) */
  --t-body:    16px;
  --t-label:   13px;   /* mono nav / labels */
  --t-eyebrow: 12px;   /* mono uppercase, .16em tracking */
  --t-micro:   11.5px; /* card meta */

  /* ---- Spacing scale (4px base) ---- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 22px; --sp-6: 28px; --sp-7: 36px; --sp-8: 44px;
  --sp-9: 56px;
  --pad-frame: 38px 56px 44px;  /* hero / page frame padding */
  --gap-columns: 56px;          /* asymmetric two-column gap */

  /* ---- Radii ---- */
  --r-card: 8px;
  --r-btn:  7px;
  --r-chip: 3px;
}
