:root {
  /* ZUNO — Reference Dark (Manrope + radial 72% 45%) — from hero section.hero:252 */
  --hero-bg-1: rgb(35, 48, 58);
  --hero-bg-2: rgb(16, 20, 29);
  --hero-ink: rgb(245, 247, 240);
  --hero-muted: #555d6f; /* .hero-index DM Mono */
  --primary-denim: #2B4C7E;
  --secondary-wash: #4A6FA5;
  --light-indigo: #E9EEF5;
  --dark-charcoal: rgb(16, 20, 29);
  --pure-white: rgb(245, 247, 240);

  /* ZUNO legacy tokens → mapped to Dark for backwards compat */
  --zuno-primary: var(--hero-bg-1);
  --zuno-primary-600: var(--secondary-wash);
  --zuno-primary-700: var(--dark-charcoal);
  --zuno-primary-50: #1e293b;
  --zuno-primary-100: #233040;
  --zuno-accent: var(--hero-bg-1);
  --zuno-accent-50: rgba(35,48,58,0.12);
  --zuno-success: #16A34A;
  --zuno-success-50: #f0fdf4;
  --zuno-danger: #dc2626;
  --zuno-danger-50: #fef2f2;
  --zuno-warning: #d97706;
  --zuno-warning-50: #fffbeb;

  /* Neutrals — dark-tinted (reference 16,20,29) — tuned for contrast */
  --ink-900: var(--hero-ink);
  --ink-800: #e6e9ee;
  --ink-700: #cbd5e1;
  --ink-600: #9aa8c0;
  --ink-500: #8a94a8;
  --ink-400: #7a8599;
  --ink-300: #2a3347;
  --ink-200: #232e3f;
  --ink-100: #1e293b;
  --ink-50: #0f141e;
  --surface: rgb(22, 27, 38);
  --surface-2: rgb(28, 34, 48);
  --bg: var(--dark-charcoal);
  --bg-soft: #0f141e;

  /* Typography — Reference Manrope / DM Mono */
  --font: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-display: "Manrope", sans-serif;
  --font-mono: "DM Mono", monospace;
  --fs-xs: 0.7rem;
  --fs-sm: 0.8rem;
  --fs-md: 0.9375rem;
  --fs-lg: 1.0625rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.85rem;
  --fs-3xl: 2.5rem;
  --fs-4xl: 3.5rem;
  --fs-hero: clamp(2.8rem, 8vw, 5.5rem);

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;
  --sp-9: 56px;
  --sp-10: 72px;

  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-2xl: 20px;
  --r-full: 999px;

  --shadow-xs: 0 1px 2px rgba(28,37,65,0.04);
  --shadow-sm: 0 2px 12px rgba(28,37,65,0.06);
  --shadow-md: 0 8px 32px rgba(28,37,65,0.12);
  --shadow-lg: 0 16px 40px rgba(28,37,65,0.16);

  --nav-h: 72px;
  --bottom-nav-h: 64px;
  --maxw: 1320px;
  --maxw-narrow: 880px;

  --ease: 0.2s ease-in;
  --ease-out: cubic-bezier(0.22,1,0.36,1);
  --dur: 200ms;
  --dur-slow: 400ms;
}

[data-theme="dark"] {
  --surface: #0f172e;
  --surface-2: #1a2542;
  --bg: #0f172e;
  --bg-soft: #1C2541;
  --ink-900: #E9EEF5;
  --ink-800: #c9d2e3;
  --ink-700: #a3b1cc;
  --ink-600: #7a8aa6;
  --ink-500: #5a6d8a;
  --ink-400: #344a6e;
  --ink-300: #23395d;
  --ink-200: #1C2541;
  --ink-100: #16213a;
  --ink-50: #0f172e;
  --zuno-primary-50: #16213a;
  --shadow-sm: 0 2px 12px rgba(0,0,0,0.3);
  --shadow-md: 0 8px 32px rgba(0,0,0,0.4);
}