:root {
  --color-ink: oklch(24% 0.055 250);
  --color-paper: oklch(97% 0.01 80);
  --color-surface: oklch(99% 0.006 245);
  --color-surface-soft: oklch(97% 0.018 245);
  --color-accent: oklch(70% 0.17 250);
  --color-accent-strong: oklch(57% 0.18 250);
  --color-accent-ink: oklch(23% 0.06 250);
  --color-focus: var(--color-accent-strong);
  --color-accent-bright: oklch(78% 0.13 245);
  --color-band-dark: oklch(28% 0.07 250);
  --color-band-blue: oklch(35% 0.08 250);
  --color-coral: oklch(67% 0.18 10);
  --color-blue-soft: oklch(96% 0.025 245);
  --color-navy: oklch(23% 0.06 250);
  --color-muted: oklch(52% 0.035 250);
  --color-rule: oklch(24% 0.055 250 / 0.12);
  --color-chip: oklch(99% 0.006 245 / 0.94);
  --color-chip-border: oklch(70% 0.17 250 / 0.28);
  --ink: var(--color-ink);
  --paper: var(--color-paper);
  --cream: var(--color-surface);
  --mint-soft: var(--color-surface-soft);
  --water-accent: var(--color-accent);
  --aqua: var(--color-accent);
  --aqua-bright: var(--color-accent-bright);
  --band-dark: var(--color-band-dark);
  --band-teal: var(--color-band-blue);
  --band-blue: var(--color-band-blue);
  --coral: var(--color-coral);
  --yellow: var(--color-blue-soft);
  --navy: var(--color-navy);
  --muted: var(--color-muted);
  --line: var(--color-rule);
  --fine-border: var(--color-rule);
  --chip-surface: var(--color-chip);
  --chip-border: var(--color-chip-border);
  --font-display: "Avenir Next", "Trebuchet MS", ui-sans-serif, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --shadow-soft: 0 8px 20px oklch(24% 0.055 250 / 0.08);
  --shadow-card: 0 18px 42px oklch(24% 0.055 250 / 0.1);
  --shadow-float: 0 28px 70px oklch(20% 0.06 250 / 0.18);
  --shadow-cat: 0 12px 18px oklch(24% 0.055 250 / 0.12);
  --radius-card: 12px;
  --radius-control: 999px;
  --radius-panel: 20px;
  --r-card: var(--radius-card);
  --r-control: var(--radius-control);
  --r-panel: var(--radius-panel);
  --page-pad: clamp(16px, 4vw, 48px);
  --section-y: clamp(64px, 9vw, 112px);
  --card-gap: clamp(16px, 3vw, 32px);
  --text-display: clamp(2.6rem, 9vw, 5.6rem);
  --text-section: clamp(2rem, 5vw, 3.8rem);
  --text-card: clamp(1.12rem, 2vw, 1.5rem);
  --text-body: 1.05rem;
  --text-label: 0.78rem;
  --hero-display: var(--text-display);
  --section-title: var(--text-section);
  --title: var(--text-section);
  --card-title: var(--text-card);
  --body: var(--text-body);
  --label: var(--text-label);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease: var(--ease-out);
  --dur-fast: 140ms;
  --dur-medium: 220ms;
  --rule-hair: 1px;
}

/* Sparkish hub: namespaced tokens leave product themes unchanged. */
:root {
  --hub-paper: oklch(97.5% 0.008 110);
  --hub-ink: oklch(22% 0.018 160);
  --hub-muted: oklch(47% 0.017 160);
  --hub-rule: oklch(84% 0.013 150);
  --hub-mint: oklch(92.5% 0.041 168);
  --hub-teal: oklch(35% 0.07 176);
  --hub-night: oklch(13.415578% 0.01724050 262.165968);
  --hub-green: oklch(86% 0.19 140);
  --hub-light: oklch(97% 0.013 140);
  --hub-focus: oklch(45% 0.14 245);
  --hub-radius: 20px;
  --hub-gap: clamp(20px, 3vw, 40px);
  --hub-gutter: clamp(20px, 5vw, 72px);
  --hub-display: clamp(48px, 7.5vw, 104px);
}
