/* ─────────────────────────────────────────────
   Reverie · design system tokens — SINGLE SOURCE OF TRUTH.
   Prefix: --rv-*. Theme: warm-dark. Accent: warm gold (lamplight).
   See DESIGN.md for the rules that govern these tokens.
   ───────────────────────────────────────────── */

:root {
  color-scheme: dark;

  /* ── Primitive color · accent (warm gold) ── */
  --rv-gold:     #E3A766;   /* Lamplight — primary accent */
  --rv-gold-hi:  #F4D9A8;   /* Candle — highlight */
  --rv-gold-dim: #8A6A4A;   /* Ember — muted accent */

  /* ── Primitive color · background scale (warms as it lifts, never #000) ── */
  --rv-bg-0: #0E0B0A;   /* Night — app / page background (the rain sits on this) */
  --rv-bg-1: #18130F;   /* Hearth — surface: cards, panels, the artifact frame */
  --rv-bg-2: #241C15;   /* Firelight — elevated: hover, popovers, menus */

  /* ── Primitive color · text + lines ── */
  --rv-text:       #EDE6DA;                       /* Paper — primary text (warm off-white) */
  --rv-text-muted: #8A8178;                       /* Dusk — secondary / labels */
  --rv-hairline:        rgba(237, 230, 218, 0.08);
  --rv-hairline-strong: rgba(237, 230, 218, 0.16);

  /* ── Semantic color ── */
  --rv-color-canvas:        var(--rv-bg-0);
  --rv-color-surface:       var(--rv-bg-1);
  --rv-color-elevated:      var(--rv-bg-2);
  --rv-color-text:          var(--rv-text);
  --rv-color-text-muted:    var(--rv-text-muted);
  --rv-color-border:        var(--rv-hairline);
  --rv-color-primary:       var(--rv-gold);
  --rv-color-primary-hover: var(--rv-gold-hi);
  --rv-color-on-primary:    var(--rv-bg-1);
  --rv-color-focus:         var(--rv-gold);

  /* ── Typography · fonts ──
     serif carries the VOICE; mono is for CHROME only (see The Voice-in-Serif Rule).
     Charter is a stand-in; final serif chosen at build via the font procedure. */
  --rv-font-serif: "Charter", "Iowan Old Style", Georgia, serif;
  --rv-font-mono:  "SF Mono", "Fira Code", ui-monospace, monospace;

  /* ── Typography · scale (rem-based; voice in serif, chrome in mono) ── */
  --rv-display-size: clamp(2.5rem, 6vw, 4rem);    --rv-display-line: 1;    --rv-display-tracking: -0.01em;
  --rv-title-size:   clamp(2rem, 4vw, 3.25rem);   --rv-title-line: 1.1;    --rv-title-tracking: -0.01em;
  --rv-body-size:    1.375rem;                    --rv-body-line: 1.55;
  --rv-body-sm-size: 1rem;                        --rv-body-sm-line: 1.5;
  --rv-label-size:   0.8rem;                      --rv-label-line: 1.6;    --rv-label-tracking: 0.06em;
  --rv-kicker-size:  0.8125rem;                   --rv-kicker-tracking: 0.04em;

  /* ── Typography · weights ── */
  --rv-weight-regular:  400;
  --rv-weight-medium:   500;
  --rv-weight-semibold: 600;

  /* ── Spacing ── */
  --rv-space-1: 4px;
  --rv-space-2: 8px;
  --rv-space-3: 12px;
  --rv-space-4: 16px;
  --rv-space-5: 24px;
  --rv-space-6: 32px;
  --rv-space-8: 48px;
  --rv-space-10: 64px;
  --rv-space-12: 96px;
  --rv-space-16: 128px;

  /* ── Shape · radius ── */
  --rv-radius-sm:   6px;
  --rv-radius-md:   10px;
  --rv-radius-lg:   16px;    /* cards, the artifact frame */
  --rv-radius-xl:   24px;
  --rv-radius-full: 9999px;  /* pills (buttons) */

  /* ── Elevation ──
     Depth is tonal first (move up the bg scale). On near-black, dark drop
     shadows barely read, so the signature lift is a warm GOLD GLOW (the lamp).
     Dark shadows are reserved for genuinely floating layers. */
  --rv-shadow-none: none;
  --rv-shadow-soft: 0 8px 30px rgba(0, 0, 0, 0.45);     /* taster result, popovers */
  --rv-shadow-pop:  0 18px 50px rgba(0, 0, 0, 0.55);    /* modals, menus */
  --rv-glow-gold:      0 0 28px rgba(227, 167, 102, 0.30);  /* warm lift on key gold elements */
  --rv-glow-gold-soft: 0 0 14px rgba(227, 167, 102, 0.18);

  /* ── Motion ── */
  --rv-motion-fast:   140ms;
  --rv-motion-medium: 260ms;
  --rv-motion-slow:   520ms;   /* the inner-voice rain's limb-extend feel */
  --rv-ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --rv-ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);

  /* ── Opacity ── */
  --rv-opacity-5:  0.05;
  --rv-opacity-10: 0.10;
  --rv-opacity-20: 0.20;
  --rv-opacity-40: 0.40;
  --rv-opacity-60: 0.60;
  --rv-opacity-75: 0.75;
  --rv-opacity-90: 0.90;

  /* ── Component aliases ── */
  --rv-button-primary-bg:       var(--rv-color-primary);
  --rv-button-primary-hover-bg: var(--rv-color-primary-hover);
  --rv-button-primary-text:     var(--rv-color-on-primary);
  --rv-button-primary-padding:  10px 22px;
  --rv-link-accent:             var(--rv-gold);
  --rv-control-padding:         10px 16px;
}
