*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --bg-primary: #0a0a0c;
  --bg-secondary: #0f0d0a;
  --bg-card: #1a1714;
  --gold: #c9a96e;
  --gold-dim: rgba(201, 169, 110, 0.4);
  --gold-glow: rgba(201, 169, 110, 0.15);
  --gold-subtle: rgba(201, 169, 110, 0.08);
  --text-primary: #d4d0c8;
  --text-secondary: #b0a890;
  --text-dim: #888;
  --type-literary: #7ba4c9;
  --type-mythological: #b07bc9;
  --type-historical: #c9967b;
  --type-technique: #7bc99a;
  --type-meta: #c9a96e;
  --font-poem: 'Georgia', 'Times New Roman', serif;
  --font-ui: -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --max-width: 800px;
  --max-width-split: 1100px;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--bg-primary);
  color: var(--text-primary);
  font-family: var(--font-poem);
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
}

a {
  color: var(--gold);
  text-decoration: none;
}

::selection {
  background: var(--gold-dim);
  color: var(--text-primary);
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .poem-line {
    font-size: 17px;
  }

  .intro-sections {
    padding: 0 8px;
  }

  .meta-cards-grid {
    justify-content: center;
  }

  .meta-card-collection,
  .meta-locked {
    width: 150px;
    height: 225px;
  }
}