/* ===========================================================================
   Rain Analytics — Color tokens
   Extracted from the Rain Analytics pitch deck (v20260701).
   The brand is dark-first: deep ink canvases lit by a cyan→purple→orange
   accent trio pulled straight from the raindrop logo.
   =========================================================================== */
:root {
  /* --- Ink / dark canvases ---------------------------------------------- */
  --ink-900: #0A0B12;   /* deepest — full-bleed slide / hero backdrop      */
  --ink-800: #0E0F18;   /* raised panel on ink                             */
  --ink-700: #13141E;   /* base dark surface                               */
  --ink-600: #1B1D2A;   /* card on dark                                    */
  --ink-500: #262838;   /* hairline / border on dark                       */

  /* --- Mist / light canvases -------------------------------------------- */
  --mist-000: #FFFFFF;  /* pure white surface                              */
  --mist-050: #EDEFF5;  /* light page background                           */
  --mist-100: #E4E7F0;  /* light card / rule                               */

  /* --- Neutral ramp (cool blue-grey) ------------------------------------ */
  --neutral-100: #CDD1DE;
  --neutral-200: #B8BDCD;
  --neutral-300: #A6ABBC;
  --neutral-400: #9AA0B2;
  --neutral-500: #8E93A4;
  --neutral-600: #7B8197;
  --neutral-700: #5B6076;

  /* --- Brand accents (the logo trio) ------------------------------------ */
  --cyan-500: #3FC6FF;   --cyan-400: #5FA8FF;   --cyan-300: #7FD6FF;
  --purple-500: #B14BFF; --purple-400: #C964D6; --purple-300: #D9B6FF;
  --orange-500: #FF7A3D; --orange-400: #E0673B; --orange-300: #FF9E70;

  /* --- Signature gradient (raindrop sweep) ------------------------------ */
  --grad-rain: linear-gradient(120deg, var(--cyan-500) 0%, var(--purple-500) 52%, var(--orange-500) 100%);
  --grad-rain-soft: linear-gradient(120deg, rgba(63,198,255,.18) 0%, rgba(177,75,255,.18) 52%, rgba(255,122,61,.18) 100%); /* @kind color */
  --grad-ink: radial-gradient(120% 120% at 50% -10%, #1B1D2A 0%, var(--ink-700) 45%, var(--ink-900) 100%);

  /* --- Semantic aliases (dark-first defaults) --------------------------- */
  --bg-canvas:      var(--ink-900);
  --bg-surface:     var(--ink-700);
  --bg-raised:      var(--ink-600);
  --border-subtle:  var(--ink-500);
  --border-strong:  var(--neutral-700);

  --text-strong:    var(--mist-000);
  --text-body:      var(--neutral-200);
  --text-muted:     var(--neutral-400);
  --text-faint:     var(--neutral-600);

  --accent:         var(--purple-500);
  --accent-cyan:    var(--cyan-500);
  --accent-orange:  var(--orange-500);
  --accent-contrast:var(--mist-000);

  /* --- Feedback --------------------------------------------------------- */
  --success: #3FBF8F;
  --warning: var(--orange-500);
  --danger:  #FF5C5C;
  --info:    var(--cyan-500);
}

/* Light-canvas scope — flip semantics when placed on a mist background. */
.ra-on-light {
  --bg-canvas:     var(--mist-050);
  --bg-surface:    var(--mist-000);
  --bg-raised:     var(--mist-000);
  --border-subtle: var(--mist-100);
  --border-strong: var(--neutral-200);
  --text-strong:   var(--ink-700);
  --text-body:     var(--neutral-700);
  --text-muted:    var(--neutral-500);
  --text-faint:    var(--neutral-400);
}