/**
 * Pulseform: design tokens
 * Single source for all CSS custom properties. See design/DESIGN_SYSTEM.md.
 */
:root {
  /* ── Surfaces ─────────────────────────────────────── */
  --color-bg-base:     #060c16;
  --color-bg-elevated: #0b1424;
  --color-bg-card:     rgba(12, 20, 36, 0.75);

  /* ── Borders ──────────────────────────────────────── */
  --color-border-subtle: rgba(100, 160, 220, 0.1);
  --color-border-mid:    rgba(100, 160, 220, 0.18);
  --color-border-strong: rgba(61, 212, 168, 0.3);

  /* ── Text ─────────────────────────────────────────── */
  --color-text-primary: #e6edf6;
  --color-text-muted:   rgba(230, 237, 246, 0.62);
  --color-text-faint:   rgba(230, 237, 246, 0.38);

  /* ── Accents (mirroring iOS: teal-green + cool blue) ─ */
  --color-accent-green:     #3dd4a8;
  --color-accent-green-dim: rgba(61, 212, 168, 0.14);
  --color-accent-blue:      #5eb3ff;
  --color-accent-blue-dim:  rgba(94, 179, 255, 0.14);

  /* ── Atmospheric glows ────────────────────────────── */
  --glow-green: rgba(61, 212, 168, 0.11);
  --glow-blue:  rgba(70, 140, 255, 0.09);

  /* ── Typography ───────────────────────────────────── */
  --font-sans: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;

  --fw-light:    300;
  --fw-regular:  400;
  --fw-semibold: 600;
  --fw-bold:     700;

  --fs-display: clamp(2.25rem, 5vw, 3.5rem);
  --fs-h1:      clamp(1.5rem, 2.5vw, 1.875rem);
  --fs-h2:      1.25rem;
  --fs-body:    1.0625rem;
  --fs-small:   0.875rem;
  --fs-xsmall:  0.8125rem;

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-body:  1.6;

  --measure: 38rem;

  /* ── Spacing scale ────────────────────────────────── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-8:  3rem;
  --space-10: 4.5rem;
  --space-12: 6rem;

  /* ── Layout ───────────────────────────────────────── */
  --content-max: 72rem;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-xl: 24px;

  /* ── Accessibility ────────────────────────────────── */
  --focus-ring: 0 0 0 2px var(--color-bg-base), 0 0 0 4px var(--color-accent-blue);

  /* ── Motion ───────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:    140ms;
  --dur-base:    220ms;
}