/* Unified Legends of Laswynd palette and type rhythm.
   Parchment reading sections and character-specific scouting accents stay distinct. */
:root {
  --laswynd-night: #1b1425;
  --laswynd-panel: #281b34;
  --laswynd-panel-hover: #352444;
}

body { background: var(--laswynd-night); }
.site-header {
  background: linear-gradient(180deg, rgba(22, 13, 32, .75), rgba(22, 13, 32, .17));
}
.site-header.scrolled { background: rgba(28, 18, 38, .96); }
.brand-type, .footer-brand { color: var(--gold-bright); }
.mobile-nav { background: var(--laswynd-purple-deep); }
.mobile-nav a {
  font: 600 14px/1.4 var(--sans);
  letter-spacing: .08em;
  padding-top: 17px;
  padding-bottom: 17px;
}

/* The fantasy imagery retains its natural colors behind a subtle plum veil. */
.hero { background: var(--laswynd-night); }
.hero-fog {
  background:
    linear-gradient(90deg, rgba(23, 13, 35, .92), rgba(24, 14, 36, .84) 28%, rgba(23, 13, 35, .55) 49%, rgba(22, 11, 29, .03) 80%),
    linear-gradient(0deg, var(--laswynd-night), transparent 22%, transparent 76%, rgba(20, 10, 31, .29));
}
.intro-section { background: #221828; }
.quote-section {
  background: radial-gradient(circle at 50% 48%, #4a2e60 0%, #30203e 38%, #1b1425 92%);
}

/* Place browsing is richly violet; each landscape photograph is unchanged. */
.world-section { background: #1c1527; }
.world-explorer { background: var(--laswynd-panel); }
.world-tabs button { color: #d0c6d5; }
.world-tabs button:hover,
.world-tabs button[aria-selected="true"] {
  background: var(--laswynd-panel-hover);
  color: var(--gold-bright);
}

/* Collector gallery: the frame belongs to the brand, each portrait to its character. */
.characters-section { background: #1b1425; }
.character-card {
  background: linear-gradient(155deg, #30213e, #22182c 72%);
}
.character-card:hover { background: #392749; }
.character-card .character-topline { color: #d2bea3; }
.character-dialog { background: #1d1427; }
.dossier-art { background: #261a32; }
.dossier-details {
  background: radial-gradient(ellipse at 90% 0%, rgba(134, 85, 155, .11), transparent 48%),
    linear-gradient(160deg, #2a1d36, #1c1426 70%);
}
.dossier-rating-segment { background: linear-gradient(145deg, #46374f, #2d2337); }

/* The Peoples Atlas previously read as a separate teal site. Retain species
   portraits and individual modal accents, but align shared field-guide UI. */
.creatures-section {
  background: radial-gradient(ellipse at 79% 10%, rgba(102, 66, 132, .28), transparent 46%), #21172c;
}
.creatures-section .eyebrow { color: var(--gold); }
.creature-feature { background: var(--laswynd-panel); }
.creature-feature-copy {
  background: linear-gradient(150deg, rgba(54, 37, 65, .97), rgba(32, 23, 43, .99));
}
.creature-image-caption { background: rgba(31, 20, 42, .76); }
.creature-index span { color: #e0c58d; }
.creature-description { color: #d7cfda; font-size: 14px; line-height: 1.75; }
.creature-mini-stat > span:first-child { font-size: 10px; }
.creature-mini-meter {
  background: linear-gradient(to right, var(--gold) var(--score), rgba(213, 183, 121, .15) var(--score));
  border-color: rgba(213, 183, 121, .4);
}
.creature-mini-meter::after {
  background: repeating-linear-gradient(90deg, transparent 0, transparent calc(10% - 2px), rgba(36, 24, 49, .94) calc(10% - 2px), rgba(36, 24, 49, .94) 10%);
}
.creatures-section .concept-note { color: #bcb1c7; }

/* Editorial parchment is intentional relief between dark illustrated sections. */
.book-copy h2 { color: var(--laswynd-purple-deep); }
.book-copy h2 em { color: #805d35; }
.author-copy h2 em { color: #805d35; }
.book-copy .eyebrow, .author-copy .eyebrow { color: #805d35; }

.rift-section {
  background: radial-gradient(ellipse at center, rgba(115, 74, 146, .5), transparent 48%),
    linear-gradient(#251a32, #1a1223);
}
.closing-section { background: var(--laswynd-night); }
.site-footer { background: #17101f; }
.story-dialog:not(.character-dialog) { background: #23182f; }

@media (max-width: 780px) {
  .hero-fog {
    background: linear-gradient(90deg, rgba(26, 14, 39, .92), rgba(28, 16, 39, .57) 70%, rgba(22, 12, 35, .38)),
      linear-gradient(0deg, var(--laswynd-night), transparent 24%);
  }
}