/* Lore page specific styles - keep lightweight and complementary to base.css */
.hero-lore {
  position: relative;
  padding: 0 0 var(--space-12) 0;
  background: linear-gradient(180deg, rgba(10,10,15,0.2) 0%, rgba(10,10,15,0.8) 70%, rgba(10,10,15,1) 100%);
}
.hero-lore .hero-media img {
  width: 100%;
  height: 42vh;
  object-fit: cover;
  filter: contrast(1.05) saturate(0.9) brightness(0.85);
}
.hero-lore .hero-content {
  margin-top: calc(-1 * var(--space-12));
  position: relative;
}
.hero-lore h1 { margin-bottom: var(--space-3); }
.hero-lore .hero-subtitle { color: var(--color-text-muted); max-width: 72ch; }
.hero-actions { margin-top: var(--space-4); display: flex; gap: var(--space-3); flex-wrap: wrap; }

.lore-tools { padding: var(--space-8) 0 var(--space-4); }
.lore-search { margin-bottom: var(--space-6); }

.toc { border-top: 1px solid var(--color-border-subtle); border-bottom: 1px solid var(--color-border-subtle); background: var(--color-background-elevated); box-shadow: var(--shadow-inner); }
.toc-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); padding: var(--space-4) 0; }
.toc-list a { display: block; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-base); color: var(--color-text); background: linear-gradient(180deg, rgba(201,169,97,0.05) 0%, transparent 100%); transition: all var(--transition-base); }
.toc-list a:hover { border-color: var(--color-gold); color: var(--color-gold-light); }
.toc-list a.active { border-color: var(--color-gold); box-shadow: var(--shadow-glow); color: var(--color-gold-light); }

.content { padding: var(--space-8) 0 var(--space-12); }
.lore-section { margin-bottom: var(--space-12); }
.section-header { margin-bottom: var(--space-4); }
.lore-list { list-style: none; display: grid; gap: var(--space-3); }
.lore-glossary dt { margin-top: var(--space-3); }
.lore-glossary dd { color: var(--color-text-muted); margin-left: 0; }

.qa .qa-item { border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-background-elevated); margin-bottom: var(--space-3); overflow: hidden; }
.qa .qa-item > summary { list-style: none; cursor: pointer; padding: var(--space-4) var(--space-5); display: flex; align-items: center; }
.qa .qa-item > summary::-webkit-details-marker { display: none; }
.qa .qa-item h3 { margin: 0; font-size: var(--font-size-lg); }
.qa .qa-content { padding: 0 var(--space-5) var(--space-5); color: var(--color-text-muted); }

.related { padding-bottom: var(--space-12); }

.back-to-top { position: fixed; right: var(--space-4); bottom: var(--space-4); opacity: 0; pointer-events: none; transition: opacity var(--transition-base), transform var(--transition-base); transform: translateY(8px); }
.back-to-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }

@media (max-width: 1024px) {
  .toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .hero-lore .hero-media img { height: 36vh; }
  .toc-list { grid-template-columns: 1fr; }
}