/* ──────────────────────────────────────────────────────────────
   Airspeed — Color
   "Warm paper. Sharp ink. A sunrise when it matters."
   Editorial palette dominates: paper, ink, muted grey, one pink dot.
   The expressive system adds the sunrise gradient (purple → gold) for
   standout moments only. Proportion guide: ~70% paper, ~20% surface,
   ~9% ink, ~1% accent.
   ────────────────────────────────────────────────────────────── */

:root {
  /* ---- Base: paper & surface ---- */
  --paper:        #FAFAF7; /* default page background — never pure white */
  --paper-2:      #F4F3EE; /* alternate / banded sections */
  --surface:      #FFFFFF; /* cards, panels, sparkles, live pill, photo ring */
  --white:        #FFFFFF; /* explicit white for gradient-borne elements */

  /* ---- Base: ink (text + dark fills) ---- */
  --ink:          #0E0E0C; /* primary text, pill, wordmark, dark fills */
  --ink-2:        #3A3A37; /* secondary text */
  --ink-3:        #5B5B54; /* muted grey — eyebrows, captions */
  --ink-4:        #9A9A93; /* disabled, hints */
  --ink-muted:    #B4AFA6; /* the quiet half of a two-tone headline */
  --hairline:     #E7E5DE; /* 1px borders */

  /* ---- Accents ---- */
  --pink:         #FF7BAC; /* the accent · eyebrow dot · highlight · hero CTA */
  --pink-ink:     #D6357B; /* pink used as text on paper (contrast-safe) */
  --live:         #22A06B; /* green "live" dot */

  /* ---- Semantic — product UI & data only ---- */
  --indigo:       #4F46E5; /* AI features + links */
  --green:        #22A06B; /* positive */
  --rose:         #E14B4B; /* risk / negative */
  --amber:        #FFC267; /* data only: partial coverage, best-case */
  --soft:         #EEF0FF; /* indigo tint — meta chips, soft fills */

  /* ---- Sunrise gradient stops (bottom-left → top-right) ---- */
  --sun-purple:   #C86DD7;
  --sun-pink:     #F473B9;
  --sun-coral:    #FF8A6B;
  --sun-peach:    #FFB86B;
  --sun-gold:     #FFD98A;

  /* The canonical expressive ramp. Origin lower-left, like sunrise.
     Never recolor or change direction — and never paint it flat across
     a whole surface with white text on top. */
  --gradient-sunrise: radial-gradient(135% 135% at 12% 100%,
      var(--sun-purple) 0%,
      var(--sun-pink) 22%,
      var(--sun-coral) 48%,
      var(--sun-peach) 72%,
      var(--sun-gold) 100%);

  /* The panel ramp — a smooth soft sunrise for BOUNDED areas: a
     right-hand panel, a rounded gradient card, a photo field. Peach
     and gold at the top, purple at the bottom. */
  --gradient-panel: linear-gradient(200deg,
      var(--sun-gold) 0%,
      var(--sun-peach) 22%,
      var(--sun-coral) 46%,
      var(--sun-pink) 72%,
      var(--sun-purple) 100%);

  /* Headline highlight — the same sunrise, run left→right through
     text via background-clip. Pink #FF7BAC carries the middle. */
  --gradient-headline: linear-gradient(90deg,
      var(--sun-purple) 0%,
      var(--pink) 42%,
      var(--sun-coral) 72%,
      var(--sun-peach) 100%);

  /* ============================================================
     SEMANTIC ALIASES — prefer these in components & layouts
     ============================================================ */
  --bg-page:          var(--paper);
  --bg-alt:           var(--paper-2);
  --surface-card:     var(--surface);

  --text-strong:      var(--ink);
  --text-body:        var(--ink-2);
  --text-muted:       var(--ink-3);
  --text-faint:       var(--ink-4);
  --text-eyebrow:     var(--ink-3);
  --text-link:        var(--indigo);
  --text-on-gradient: var(--white);

  --border-hairline:  var(--hairline);

  --accent:           var(--pink);
  --accent-text:      var(--pink-ink);
  --on-accent:        var(--ink);   /* ink text sits on pink, never white */

  --positive:         var(--green);
  --negative:         var(--rose);
  --ai:               var(--indigo);
}