:root {
  /* Color Palette - Lab/Research Journal Aesthetic */
  --color-paper: #F8F9FA;
  --color-ink: #111827;
  --color-cobalt: #0033A0;
  --color-cobalt-light: #E6EDFA;
  --color-alert-red: #D9230F;
  --color-slate: #4B5563;
  --color-slate-light: #E5E7EB;
  --color-canvas: #FFFFFF;

  /* Typography */
  --font-display: 'IBM Plex Serif', Georgia, serif;
  --font-body: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', Consolas, Monaco, monospace;

  /* Typographic Scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --text-7xl: 4.5rem;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Layout */
  --max-width: 72rem;
  --content-width: 48rem;

  /* Borders */
  --border-thin: 1px solid var(--color-slate-light);
  --border-thick: 2px solid var(--color-ink);
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-paper: #111827;
    --color-ink: #F8F9FA;
    --color-cobalt: #60A5FA;
    --color-cobalt-light: #1E3A8A;
    --color-alert-red: #F87171;
    --color-slate: #9CA3AF;
    --color-slate-light: #374151;
    --color-canvas: #030712;
  }
}