/* PasaRonda design tokens. Source of truth for values; see design/design-system.md for intent. */
:root {
  /* Paper: page and section backgrounds */
  --bg: #fbfaf7;
  --bg-band: #f4f2ec;

  /* Surfaces */
  --surface: #ffffff;
  --surface-2: #f8f7f3;
  --surface-3: #f1efe9;

  /* Lines */
  --line: rgb(22 34 45 / 0.08);
  --line-strong: rgb(22 34 45 / 0.15);

  /* Text */
  --text-strong: #13202b;
  --text: #2b3743;
  --text-muted: #56616d;
  --text-faint: #7d8691;

  /* Brand: indigo. Buttons, links, headline accents, focus, PasaRonda's voice. */
  --brand: #4f46e5;
  --brand-strong: #4338ca;
  --brand-bright: #6366f1;   /* live indicators: listening dot, waveform, progress */
  --brand-soft: #ecebfd;
  --brand-softer: #f5f4ff;
  --on-brand: #ffffff;
  --brand-rgb: 79 70 229;

  /* Accent: coral. The key point, the first cue, playful marks. */
  --coral: #ff7a59;
  --coral-text: #b93e1c;
  --coral-soft: #ffe9e1;

  /* Status (meaning only, never decoration) */
  --success: #15803d;        /* confirmed, OK, available */
  --success-soft: #dcfce7;
  --info: #0e7490;           /* inferred; "you" in transcripts */
  --info-soft: #dff4f8;
  --rose: #b93f3f;           /* missing, unconfirmed, error */
  --rose-soft: #fbe8e6;

  /* Pastel washes for backgrounds, cards, avatars, stickers */
  --wash-brand: #e0defc;
  --wash-coral: #ffe1d6;
  --wash-sun: #fff0c7;
  --wash-sky: #dcebfd;

  /* Type */
  --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Instrument Serif", ui-serif, Georgia, serif;
  --font-mono: "Geist Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;

  --fs-eyebrow: 0.75rem;
  --fs-small: 0.875rem;
  --fs-body: 1rem;
  --fs-lead: clamp(1.0625rem, 0.98rem + 0.4vw, 1.25rem);
  --fs-h3: clamp(1.125rem, 1.05rem + 0.3vw, 1.3rem);
  --fs-h2: clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --fs-h1: clamp(2.6rem, 1.6rem + 4.4vw, 5.25rem);

  --lh-tight: 1.04;
  --lh-snug: 1.2;
  --lh-body: 1.6;
  --tracking-tight: -0.035em;
  --tracking-eyebrow: 0.14em;

  /* Space (4px base) */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;
  --section-y: clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2rem);
  --max-w: 1200px;

  /* Shape */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* Elevation: soft, slightly cool shadows on warm paper */
  --shadow-1: 0 1px 2px rgb(22 34 45 / 0.05), 0 4px 14px -4px rgb(22 34 45 / 0.08);
  --shadow-2: 0 2px 4px rgb(22 34 45 / 0.04), 0 18px 40px -16px rgb(22 34 45 / 0.16);
  --shadow-3: 0 2px 6px rgb(22 34 45 / 0.05), 0 40px 90px -30px rgb(22 34 45 / 0.28);
  --ring-brand: 0 0 0 4px rgb(79 70 229 / 0.14);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 140ms;
  --t-base: 240ms;
  --t-slow: 520ms;

  color-scheme: light;
}