:root {
  /* Tokeny (Primitíva) */
  --clr-alabaster: #F7F4EF;
  --clr-slate: #424A57;
  --clr-gold: #C2A66B;
  --clr-powder: #E7C4C4;

  /* Sémantika (Systém) - Light theme */
  --color-surface: var(--clr-alabaster);
  --color-text: var(--clr-slate);
  --color-primary: var(--clr-gold);
  --color-accent: var(--clr-powder);

  /* Fonts */
  --font-serif: 'Playfair Display', ui-serif, Georgia, 'Times New Roman', serif;
  --font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

  /* Spacing */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-s: 0.75rem;
  --space-m: 1rem;
  --space-l: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;

  /* Typography scale */
  --size-step-0: clamp(0.95rem, 0.2vw + 0.9rem, 1.05rem);
  --size-step-1: clamp(1.25rem, 0.6vw + 1.1rem, 1.5rem);
  --size-step-2: clamp(1.6rem, 1.2vw + 1.2rem, 2rem);
  --size-step-3: clamp(2.25rem, 2vw + 1.6rem, 2.8rem);
  --size-step-4: clamp(3rem, 3.5vw + 2rem, 4rem);

  --max-content: 62ch;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* Sémantika (Systém) - Dark theme */
    --color-surface: #171717; /* near-black for dark background */
    --color-text: #E6E6E6;     /* light text */
    --color-primary: #D4B880;  /* slightly brighter gold */
    --color-accent: #E4AEB7;   /* deeper pink */
  }
}

body {
  margin: 0;
  background: var(--color-surface);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: var(--size-step-0);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}