/**
 * rovvi.css — the ONE Rovvi design-token set (`--rv-*`).
 *
 * This is the single source of truth for the site-wide visual unification
 * (see upcoming-projects/design-unification-plan.md). It REPLACES, over time,
 * the three legacy token systems: tokens.css `--accent*` (flat blue),
 * `--amb-*` (ambassador glass, defined in lib/hub-nav.ts), and the copy-pasted
 * `--accent1/2/3` aurora block in the course/projects pages.
 *
 * PHASE 0 CONTRACT — this file is INERT.
 *   It ONLY defines `--rv-*` custom properties. It has NO element selectors,
 *   NO resets, and does NOT reassign any legacy token. Loading it therefore
 *   changes nothing visually until a page opts in by referencing `var(--rv-*)`.
 *   Per-surface migration (Phase 2) is where a page switches to `--rv-*` and,
 *   if needed, adds local back-compat aliases (e.g. `--amb-brand: var(--rv-brand)`).
 *   Do NOT add global aliases here — that would recolor the whole site at once.
 *
 * DESIGN DIRECTION (locked 2026-07-05, Opus + Fable):
 *   - TEAL-LED brand: teal is the primary/identity/action + trust color;
 *     indigo is demoted to the atmospheric "glow" role (gradients, orbs, focus).
 *   - WARM paper in light mode (not blue-white). Deep navy kept in dark.
 *   - GOLD is a reserved trust/credential accent — never decorative.
 *   - Fonts point at SYSTEM STACKS in Phase 0; the brand faces (Fraunces
 *     display / Figtree body / JetBrains Mono) flip in Phase 1 via @font-face.
 *   - Radius is a SCALE (input < card < pill), not one value.
 *
 * THEME SIGNAL: dark is keyed off BOTH `html[data-theme="dark"]` (ambassador +
 * course) AND `:root.dark` (BaseLayout) during the migration window, so `--rv-*`
 * resolves correctly whichever legacy signal a page still carries.
 * Contrast: text-vs-surface pairs target ≥ 4.5:1, UI ≥ 3:1 (light + dark).
 */

:root {
  /* ── Brand — TEAL-LED ─────────────────────────────────────────────── */
  --rv-brand:        #0c6b60; /* primary teal — actions, identity, links (5.6:1 on paper) */
  --rv-brand-strong: #0a564d; /* hover/active */
  --rv-brand-soft:   #e4f2ef; /* teal wash — chips, subtle fills */
  --rv-on-brand:     #ffffff; /* text/icon on a teal fill */

  /* Glow — indigo, atmospheric ONLY (gradients, orbs, focus ring) */
  --rv-glow:         #5b4be0;
  --rv-glow-2:       #36d1c4; /* bright teal — the far end of brand gradients */

  /* Trust gold — verification, credentials, tiers, certificate seals */
  --rv-gold:         #b0872f;
  --rv-gold-ink:     #7a5c1e; /* gold text on light (4.9:1) */
  --rv-gold-soft:    #f6edd8;
  --rv-gold-hi:      #f0cf87; /* gold highlight (seal/dot gradient top) */

  /* ── Neutrals — WARM paper / ink ramp (light) ─────────────────────── */
  --rv-paper:        #faf8f5; /* page background — warm off-white */
  --rv-surface:      #fffdfb; /* cards / raised surfaces */
  --rv-surface-2:    #f2efe9; /* inset / secondary fill */
  --rv-ink:          #1c1a17; /* primary text (15.6:1 on paper) */
  --rv-ink-2:        #4d4842; /* secondary text (7.7:1) */
  --rv-muted:        #6f6a62; /* muted text (4.9:1) */
  --rv-line:         #e6e1d8; /* borders / hairlines */
  --rv-line-strong:  #d4cec2;

  /* ── Semantic states ──────────────────────────────────────────────── */
  --rv-success:      #047857; --rv-on-success: #ffffff;
  --rv-danger:       #b3213a; --rv-on-danger:  #ffffff;
  --rv-warning:      #b45309; --rv-on-warning: #ffffff;
  --rv-info:         #0369a1; --rv-on-info:    #ffffff;

  /* Focus ring — glow indigo, high-visibility */
  --rv-focus:        #5b4be0;

  /* ── Brand gradient (the signature; teal → indigo glow) ───────────── */
  --rv-gradient:     linear-gradient(120deg, var(--rv-brand), var(--rv-glow));
  --rv-gradient-soft:linear-gradient(120deg, #17998c, #6a5cff);

  /* ── Typography — brand faces self-hosted in fonts.css (Phase 1) ── */
  --rv-font-display: "Fraunces", Georgia, "Times New Roman", ui-serif, serif;                 /* warm editorial serif */
  --rv-font-sans:    "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --rv-font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;                     /* JetBrains Mono deferred */
  --rv-font-cert:    "Fraunces", Georgia, "Times New Roman", ui-serif, serif;                 /* certificate italic */

  /* Type scale (fluid-friendly rem) */
  --rv-text-display: 2.6rem;
  --rv-text-h1:      1.9rem;
  --rv-text-h2:      1.45rem;
  --rv-text-h3:      1.2rem;
  --rv-text-body:    1rem;
  --rv-text-small:   0.875rem;
  --rv-text-tiny:    0.78rem;
  --rv-leading:      1.6;
  --rv-tracking-kick:0.14em; /* letter-spaced uppercase kickers */

  /* ── Spacing (rem, zoom-safe; linear N × 0.25rem) ─────────────────── */
  --rv-space-1: 0.25rem;  --rv-space-2: 0.5rem;   --rv-space-3: 0.75rem;
  --rv-space-4: 1rem;     --rv-space-5: 1.25rem;  --rv-space-6: 1.5rem;
  --rv-space-7: 1.75rem;  --rv-space-8: 2rem;     --rv-space-10: 2.5rem;
  --rv-space-12: 3rem;    --rv-space-14: 3.5rem;  --rv-space-16: 4rem;

  /* ── Radius SCALE (per Fable — not one value) ─────────────────────── */
  --rv-radius-input: 10px;
  --rv-radius-sm:    12px;
  --rv-radius-card:  18px;
  --rv-radius-pill:  999px;

  /* ── Elevation — soft, ink-tinted ────────────────────────────────── */
  --rv-shadow-sm:   0 1px 2px rgba(20,26,48,.06);
  --rv-shadow-card: 0 24px 60px -34px rgba(20,26,48,.20);
  --rv-shadow-pop:  0 18px 44px -20px rgba(20,26,48,.28);
  --rv-glass-blur:  blur(16px) saturate(140%);

  /* ── Motion ──────────────────────────────────────────────────────── */
  --rv-ease:  cubic-bezier(.2,.7,.2,1);
  --rv-dur:   200ms;
  --rv-dur-lg:360ms;
}

/* ── Dark — deep navy kept; teal brightens, indigo brightens ───────── */
html[data-theme="dark"],
:root.dark {
  --rv-brand:        #36d1c4; /* bright teal on navy */
  --rv-brand-strong: #5fe0d5;
  --rv-brand-soft:   rgba(54,209,196,.10);
  --rv-on-brand:     #04211e;

  --rv-glow:         #7c6cff;
  --rv-glow-2:       #36d1c4;

  --rv-gold:         #e3b04b;
  --rv-gold-ink:     #f0c877;
  --rv-gold-soft:    rgba(227,176,75,.12);
  --rv-gold-hi:      #f6d9a0;

  --rv-paper:        #0b0f1a;
  --rv-surface:      rgba(255,255,255,.045);
  --rv-surface-2:    rgba(255,255,255,.07);
  --rv-ink:          #eef2ff;
  --rv-ink-2:        #c3cbe4;
  --rv-muted:        #9aa6c7;
  --rv-line:         rgba(255,255,255,.10);
  --rv-line-strong:  rgba(255,255,255,.18);

  --rv-success:      #34d399; --rv-on-success: #04211a;
  --rv-danger:       #ff8a9b; --rv-on-danger:  #2a0710;
  --rv-warning:      #fbbf24; --rv-on-warning: #241a03;
  --rv-info:         #7cc7f5; --rv-on-info:    #04121d;

  --rv-focus:        #7c6cff;
  --rv-gradient-soft:linear-gradient(120deg, #36d1c4, #7c6cff);

  --rv-shadow-sm:   0 1px 2px rgba(0,0,0,.4);
  --rv-shadow-card: 0 30px 70px -40px rgba(0,0,0,.6);
  --rv-shadow-pop:  0 20px 50px -22px rgba(0,0,0,.6);
}