/* MARK AI · Design tokens
   ─────────────────────────────────────────────────────────────
   Fuente de verdad de la marca: PRODUCT.md + DESIGN.md
*/

:root {
  /* ── Surfaces (dark, slight cool tint) ── */
  --bg:           oklch(0.11 0.012 268);
  --bg-elev:      oklch(0.14 0.014 268);
  --surface:      oklch(0.17 0.015 268);
  --surface-hi:   oklch(0.21 0.017 268);
  --line:         oklch(0.30 0.018 268);
  --line-hi:      oklch(0.42 0.022 268);

  /* ── Texto ── */
  --ink:          oklch(0.97 0.004 260);
  --ink-soft:     oklch(0.88 0.006 262);
  --muted:        oklch(0.68 0.014 265);
  --faint:        oklch(0.52 0.014 268);

  /* ── Brand ── */
  --brand-purple:    oklch(0.62 0.22 290);
  --brand-purple-hi: oklch(0.70 0.22 290);
  --brand-blue:      oklch(0.72 0.18 235);
  --brand-blue-hi:   oklch(0.80 0.16 230);

  --grad-brand:      linear-gradient(135deg, var(--brand-purple) 0%, var(--brand-blue) 100%);
  --grad-brand-soft: linear-gradient(135deg, oklch(0.62 0.22 290 / 0.14) 0%, oklch(0.72 0.18 235 / 0.14) 100%);
  --grad-brand-glow: radial-gradient(60% 50% at 50% 0%, oklch(0.62 0.22 290 / 0.22) 0%, transparent 70%);

  /* ── Estado ── */
  --success:      oklch(0.74 0.15 155);
  --warn:         oklch(0.80 0.16 78);
  --danger:       oklch(0.66 0.22 25);
  --info:         var(--brand-blue);

  /* ── Sombras ── */
  --shadow-sm:    0 1px 2px 0 oklch(0 0 0 / 0.40);
  --shadow-md:    0 4px 16px -2px oklch(0 0 0 / 0.50);
  --shadow-lg:    0 24px 48px -12px oklch(0 0 0 / 0.60);
  --glow-brand:   0 0 0 1px oklch(0.62 0.22 290 / 0.28),
                  0 12px 40px -8px oklch(0.62 0.22 290 / 0.40);
  --focus-ring:   0 0 0 2px var(--bg), 0 0 0 4px var(--brand-blue);

  /* ── Tipografía ── */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.375rem;
  --text-xl:   1.75rem;
  --text-2xl:  clamp(1.85rem, 4vw, 2.75rem);
  --text-3xl:  clamp(2.25rem, 6vw, 3.5rem);

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --tracking-tight: -0.025em;
  --tracking-base:  0;
  --tracking-wide:  0.18em;

  --lh-tight:   1.1;
  --lh-snug:    1.3;
  --lh-normal:  1.55;
  --lh-relaxed: 1.7;

  /* ── Spacing ── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* ── Radii ── */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-full: 999px;

  /* ── Motion ── */
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 150ms;
  --dur-base: 220ms;
  --dur-slow: 400ms;

  /* ── Layout ── */
  --container: 720px;
  --container-wide: 960px;

  /* ── Z-index scale ── */
  --z-base:    1;
  --z-sticky:  10;
  --z-overlay: 50;
  --z-modal:   100;
  --z-toast:   200;
}