/* ============================================================
   HABIT PLANET — design tokens
   Generated from DESIGN.md (the SSOT). Components read these;
   nothing re-declares a brand value.
   Provenance: [context] extracted from lib/theme/theme.dart and
   the app source; [derived] computed from extracted material;
   [invented] this run's taste, flagged and awaiting review.
   ============================================================ */

:root {
  /* ---- The gemstone palette — light / base / dark ramps
          [context: lib/theme/theme.dart, verbatim] ---- */
  --amethyst-light: #CC99FF;
  --amethyst:       #9966CC;
  --amethyst-dark:  #663399;

  --opal-light:     #D3E0DB;
  --opal:           #A8C3BC;
  --opal-dark:      #7A8C89;

  --sapphire-light: #4D7EBB;
  --sapphire:       #0F52BA;
  --sapphire-dark:  #0A3A6B;

  --ruby-light:     #C9404A;
  --ruby:           #9B111E;
  --ruby-dark:      #700D16;

  --emerald-light:  #76D7A4;
  --emerald:        #50C878;
  --emerald-dark:   #32965D;

  --gold-light:     #E8C55F;
  --gold:           #D4AF37;
  --gold-dark:      #A78B2C;

  --onyx-light:     #5F6163;
  --onyx:           #353839;
  --onyx-dark:      #1F2123;

  /* ---- Surfaces [context: backgroundColor #232A35; app cards are white] ---- */
  --space:      #232A35;   /* the app's one background — deep space */
  --space-deep: #181E27;   /* [derived] one step deeper, cover only */
  --paper:      #FFFFFF;
  --tint:       #EDF3F0;   /* [derived] wash of lightOpal for section alternation */

  /* ---- Text ---- */
  --ink:    var(--onyx-dark);   /* [context: onyx ramp] */
  --muted:  var(--onyx-light);
  --subtle: var(--opal-dark);

  /* ---- Semantic roles [context: usage — emerald = progress/positive,
          ruby = close/error, gold = flourish] ---- */
  --accent:       var(--emerald);
  --accent-light: var(--emerald-light);
  --accent-dark:  var(--emerald-dark);
  --danger:       var(--ruby);
  --flourish:     var(--gold);
  --flourish-light: var(--gold-light);

  /* ---- The planet [derived: sampled from assets/icon/icon.png] ---- */
  --planet-orange: #F0944B;
  --planet-pink:   #E8476B;
  --planet-teal:   #3FC98F;
  --gradient-planet: linear-gradient(160deg, var(--planet-orange), var(--planet-pink) 45%, var(--planet-teal));

  /* ---- Typography — NO font family exists in the source
          [invented: Space Grotesk + Inter proposal; the app ships
          the system face — see the encoded alternate] ---- */
  --font-display: 'Space Grotesk', 'Avenir Next', sans-serif;
  --font-body:    'Inter', 'Helvetica Neue', sans-serif;
  --font-mono:    'JetBrains Mono', 'Courier New', monospace;
  --font-system:  -apple-system, 'SF Pro Text', 'Roboto', 'Segoe UI', sans-serif; /* what the app actually ships [context] */

  /* App scale [context]: 32 welcome · 24 bodyLarge · 18 bodyMedium ·
     16 · 14 bodySmall · 10 fine print — bold-heavy */
  --text-hero:    clamp(2.5rem, 1.8rem + 3.5vw, 4.5rem);
  --text-h1:      clamp(1.8rem, 1.35rem + 2vw, 2.6rem);
  --text-h2:      clamp(1.35rem, 1.1rem + 1.2vw, 1.9rem);
  --text-h3:      clamp(1.1rem, 1rem + 0.6vw, 1.35rem);
  --text-h4:      1.02rem;
  --text-body-lg: clamp(1.02rem, 0.94rem + 0.45vw, 1.15rem);
  --text-body:    clamp(0.94rem, 0.88rem + 0.35vw, 1.02rem);
  --text-body-sm: 0.87rem;
  --text-caption: 0.78rem;
  --text-label:   0.7rem;

  /* ---- Spacing [context: paddings observed at 8 / 16 / 24 — 8px base] ---- */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4rem;
  --sp-8: 6rem;
  --section-pad: clamp(4rem, 8vw, 7rem);

  /* ---- Radii [context: chips 8 · cards 10 · checkbox/FAB circular] ---- */
  --r-sm:    8px;
  --r-card:  10px;
  --r-lg:    16px;
  --r-pill:  999px;
  --r-round: 50%;

  /* ---- Borders [context: 2px black @ 50% on cards; inputs 2px black,
          3px black when focused] ---- */
  --line:        rgba(31, 33, 35, 0.5);
  --line-strong: var(--onyx-dark);
  --border-w:       2px;
  --border-w-focus: 3px;
  --border:       var(--border-w) solid var(--line);
  --border-focus: var(--border-w-focus) solid var(--line-strong);
  --border-hair:  1px solid rgba(31, 33, 35, 0.12);

  /* ---- Shadows [context: Material elevation 5 is the app's one
          elevation; checked states drop to 0] ---- */
  --sh-rest:  0 3px 6px rgba(24, 30, 39, 0.16), 0 2px 4px rgba(24, 30, 39, 0.12); /* elevation 5 */
  --sh-lift:  0 8px 18px rgba(24, 30, 39, 0.2), 0 3px 6px rgba(24, 30, 39, 0.12); /* [derived] hover */
  --sh-none:  none;                                                               /* completed = flat */
  --sh-glow:  0 0 24px rgba(80, 200, 120, 0.35);                                  /* [invented] dark-surface accent glow */

  /* ---- Motion — real measured app values [context: orbital_indicator.dart,
          level_up_overlay.dart] ---- */
  --dur-breathe: 20s;    /* orbital ring breathing cycle */
  --dur-wave:    5s;     /* sine-wave sway */
  --dur-enter:   2s;     /* entry fade-in */
  --dur-rain:    3s;     /* level-up emoji rain */
  --dur-fast:    150ms;  /* [invented] doc micro-interactions */
  --dur-normal:  300ms;  /* [invented] doc transitions */
  --dur-slow:    600ms;  /* [invented] doc reveals */
  --ease-out:      cubic-bezier(0, 0, 0.2, 1);
  --ease-orbit:    linear;                             /* orbits do not ease [derived] */
  --ease-celebrate: cubic-bezier(0.34, 1.56, 0.64, 1); /* [invented] overshoot for check-ins */

  /* ---- Layout [context: portrait-locked app, single column] ---- */
  --max-w:        72rem;
  --max-w-narrow: 46rem;
  --max-w-wide:   88rem;
  --nav-w:        232px;
  --phone-w:      320px;
}
