/* ============================================================
   uplitMD · COLORS
   Extracted from uplitmd.tv (live), the D6 homepage mockup, and
   the produced episode thumbnails. Dark-first brand: deep navy
   canvas, one neon-green action color, warm per-stage accents.
   ============================================================ */
:root {
  /* ---- Core navy ramp (surfaces, dark → light) ---- */
  --navy-900: #0b0e1c;   /* deepest — footers, video letterbox */
  --navy-800: #0e0e24;   /* deep bands, section alternation */
  --navy-700: #151530;   /* PRIMARY brand background */
  --navy-600: #1e1e42;   /* panel / card surface */
  --navy-500: #242452;   /* raised panel, avatar wells, inputs */
  --navy-400: #33336a;   /* hover on panels */

  /* ---- Signal green (the single action color) ---- */
  --green-500: #7ef86f;  /* PRIMARY — buttons, links, accents */
  --green-400: #98ff8a;  /* hover (lighter) */
  --green-600: #62d954;  /* pressed (darker) */
  --green-icon: #8bf67c; /* the logo burst glyph */
  --green-ink:  #0b2607; /* text/icon ON green fills */

  /* ---- Neutrals / ink ---- */
  --white:     #ffffff;
  --ink-100:   #ffffff;  /* primary text on navy */
  --ink-200:   #d7dbef;  /* secondary text */
  --ink-300:   #b9bed6;  /* muted / captions */
  --ink-400:   #8b90ab;  /* placeholder, disabled */

  /* ---- Hairlines & scrims ---- */
  --line:        rgba(255,255,255,0.12);  /* default border on navy */
  --line-strong: rgba(255,255,255,0.22);  /* focus-adjacent, active */
  --line-soft:   rgba(255,255,255,0.06);  /* hover fill on ghost items */
  --scrim:       rgba(11,14,28,0.55);      /* image protection gradient base */

  /* ---- Stage accents (the journey has a color per stage) ----
     Used as episode-thumbnail backgrounds & stage tags. */
  --stage-expecting-1: #1f6a4a;  --stage-expecting-2: #2a9d68;  /* teal-green */
  --stage-newborn-1:   #48246e;  --stage-newborn-2:   #6e3a9d;  /* violet */
  --stage-firstweeks-1:#20456e;  --stage-firstweeks-2:#2d6a8f;  /* ocean blue */
  --stage-months24-1:  #6e3a20;  --stage-months24-2:  #a05c2d;  /* amber */

  /* ---- Semantic aliases (author against these) ---- */
  --bg:              var(--navy-700);
  --bg-deep:         var(--navy-800);
  --bg-deepest:      var(--navy-900);
  --surface-card:    var(--navy-600);
  --surface-raised:  var(--navy-500);
  --surface-input:   var(--navy-700);

  --text-strong:     var(--ink-100);
  --text-body:       var(--ink-300);
  --text-muted:      var(--ink-400);
  --text-on-accent:  var(--green-ink);

  --accent:          var(--green-500);
  --accent-hover:    var(--green-400);
  --accent-press:    var(--green-600);

  --border:          var(--line);
  --border-strong:   var(--line-strong);
  --focus-ring:      var(--green-500);
}