/* Center Deep / Magic Unicorn family tokens.
   Type and scale are shared by all three static routes. */
:root,
html[data-site="center-deep"] {
  --cd-bg: #051937;
  --cd-surface: #0b2445;
  --cd-raised: #123251;
  --cd-ink: #ffffff;
  --cd-muted: #c5d5e4;
  --cd-cyan: #22d3ee;
  --cd-cyan-deep: #0891b2;
  --cd-focus: #67e8f9;
  --cd-border: rgba(197, 213, 228, .18);
  --cd-border-strong: rgba(197, 213, 228, .34);
  --cd-glow: rgba(8, 145, 178, .34);
  --cd-glow-bright: rgba(34, 211, 238, .22);
  --cd-gradient: linear-gradient(100deg, var(--cd-cyan-deep), var(--cd-cyan));

  --font-display: "Bricolage Grotesque", "Instrument Sans", system-ui, sans-serif;
  --font-body: "Instrument Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1.0625rem;
  --text-lg: clamp(1.125rem, 1.3vw + .65rem, 1.25rem);
  --text-xl: clamp(1.45rem, 2vw + .65rem, 2rem);
  --text-2xl: clamp(2rem, 3.6vw, 3rem);
  --text-3xl: clamp(2.8rem, 7.5vw, 6.8rem);
  --leading-body: 1.55;
  --leading-tight: .94;

  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .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;

  --radius-sm: .5rem;
  --radius-md: .875rem;
  --radius-lg: 1.125rem;
  --radius-pill: 999px;
  --content-max: 1180px;
  --reading-max: 42rem;
  --gutter: clamp(1rem, 3vw, 2rem);
  --header-height: 64px;
  --shadow-frame: 0 30px 80px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .14);
  --duration-fast: 180ms;
  --duration-base: 280ms;
  --ease: cubic-bezier(.2, .75, .25, 1);

  /* Legacy aliases keep existing page markup and structured content stable. */
  --family-canvas: var(--cd-bg);
  --family-surface: var(--cd-surface);
  --family-raised: var(--cd-raised);
  --family-text: var(--cd-ink);
  --family-muted: var(--cd-muted);
  --family-accent: var(--cd-cyan);
  --family-accent-end: #67e8f9;
  --family-on-accent: var(--cd-bg);
  --family-focus: var(--cd-focus);
  --family-border: #28445f;
  --family-control-border: #8aa4bd;
  --family-font-body: var(--font-body);
  --family-font-mono: var(--font-mono);
  --family-gradient: var(--cd-gradient);
  --primary-dark: var(--cd-surface);
  --primary-darker: var(--cd-bg);
  --primary-blue: var(--cd-cyan);
  --primary-cyan: var(--cd-cyan);
  --accent-purple: var(--cd-cyan-deep);
  --accent-pink: var(--cd-cyan);
  --text-primary: var(--cd-ink);
  --text-secondary: var(--cd-muted);
  --text-muted: #9fb7cb;
  --border-color: var(--cd-border);
  --card-bg: rgba(11, 36, 69, .82);
  --card-hover: var(--cd-raised);
  --gradient-primary: var(--cd-gradient);
  --font-primary: var(--font-body);
  --transition-fast: var(--duration-fast) var(--ease);
  --transition-normal: var(--duration-base) var(--ease);
  color-scheme: dark;
}

html[data-site="center-deep"] {
  background: var(--cd-bg);
}