/* GAIA edition: soft earth tones and light, with the existing catalogue intact. */
:root {
  --ink: #e8eadb;
  --ink-soft: #e0e5d3;
  --paper: #28382d;
  --muted: #586651;
  --line: rgba(40, 56, 45, .19);
  --red: #667a48;
  --red-bright: #4b683b;
  --panel: rgba(249, 248, 230, .8);
}
.grain { opacity: .022; }
.hero {
  display: block;
  min-height: 0;
  padding-bottom: 2.5rem;
  background: radial-gradient(ellipse at 72% 32%, #fff0bd55, transparent 52%), linear-gradient(145deg, #dce4ce, #f4f0d9 65%, #e8eadb);
}
.hero::before, .hero::after, .hero > .moon, .hero > .moth, .hero > .river { display: none; }
.hero-copy {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  column-gap: clamp(2rem, 6vw, 6rem);
  align-content: center;
  width: min(1160px, 88vw);
  margin: auto;
  padding: 9rem 0 4rem;
  text-align: left;
}
.hero-copy > :not(.featured-single) { grid-column: 1; }
.hero-copy h1 { font-size: clamp(5rem, 10vw, 8rem); line-height: .8; }
.hero-copy h1 em { color: #596d44; }
.hero-intro { margin: 2rem 0 1.1rem; color: #4f604a; }
.enter { justify-self: start; border-color: var(--line); }
.featured-single {
  grid-column: 2;
  grid-row: 1 / span 5;
  align-self: center;
  width: 100%;
  margin: 0;
  padding: 0 0 1.2rem;
  gap: .65rem;
  border-color: #75805b33;
  background: #f8f3dc88;
  box-shadow: 0 20px 60px #3e4e2917;
}
.featured-cover { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; margin-bottom: .55rem; }
.featured-single:hover { border-color: #6f7b50; }
.featured-single strong { font-size: 2rem; }
.featured-label, .featured-cta { color: #46583d; font-size: .68rem; }
.platform-strip {
  position: relative;
  left: auto;
  bottom: auto;
  transform: none;
  margin: 0 auto;
  background: #f8f7e675;
  border-color: var(--line);
  box-shadow: none;
}
.language-switch, .platform-label, .platform-mark, .eyebrow, .filter-label,
.collection-tab, .chip, .node-type, .node-arrow, .detail-breadcrumb,
.detail-footer, .detail-footer strong, .tag, .preview-time,
.music-video p, .closing-copy > p:not(.eyebrow), .lyrics,
.element-concept p { color: #52624b; }
.platform-heading > span, .platform-note, .node-index { color: #586651; }
.language-switch, .platform-mark { border-color: var(--line); }
.language-switch:hover, .platform-mark:hover, .chip.active,
.collection-tab.active { background: #76895214; border-color: #64784777; }
.universe { background: #e8eadb; padding-top: 6rem; }
.timeline::before { background: linear-gradient(#708456, #70845614); }
.node-dot { background: #849273; box-shadow: 0 0 0 5px #e8eadb; }
.work-node:hover .node-dot, .work-node.active .node-dot { box-shadow: 0 0 0 5px #e8eadb, 0 0 14px #c5be79; }
.detail-panel { box-shadow: 0 12px 40px #3a482b0a; }
.detail-description { color: #45553d; }
.element-concept { border-color: #7b8c64; background: linear-gradient(90deg, #8ea27114, transparent); }
.element-concept span { color: #425c35; }
.preview-player { border-color: #70845655; background: #7084560a; }
.preview-player.playing { border-color: #4b683b; }
.preview-toggle { color: #35482c; }
.preview-track { background: #64784733; }
.closing { background: linear-gradient(145deg, #e0e5d3, #f2edcf); }
.mirror { border-color: #677b4b44; box-shadow: 0 0 0 8px #e0e5d3, 0 0 0 9px #70845644; }
.mirror span { background: radial-gradient(ellipse at 50% 45%, #f8e7af, transparent 55%), linear-gradient(145deg, #bdcba6, #7f956e); }
footer { color: #52624b; background: #e0e5d3; }
@media (max-width: 800px) {
  .hero-copy { display: block; width: min(480px, calc(100% - 40px)); padding: 7rem 0 2.5rem; text-align: center; }
  .hero-copy h1 { font-size: clamp(4.5rem, 21vw, 7rem); }
  .hero-copy .eyebrow { font-size: .53rem; letter-spacing: .18em; }
  .hero-intro { margin: 1.8rem auto 1rem; }
  .featured-single { width: min(340px, 100%); margin: 2rem auto 0; }
  .platform-strip { width: calc(100% - 24px); }
  .hero { padding-bottom: 1.5rem; }
  .universe { padding-top: 4rem; }
}

/* Fayette Noir: deep forest, warm ivory and muted gold. */
:root {
  color-scheme: dark;
  --ink: #0d1411;
  --ink-soft: #151f19;
  --paper: #f1ecdf;
  --muted: #b2baaa;
  --line: rgba(221, 213, 184, .22);
  --red: #a69b69;
  --red-bright: #dcc990;
  --panel: rgba(25, 35, 28, .96);
}
.hero { background: radial-gradient(ellipse at 76% 35%, rgba(129, 151, 105, .22), transparent 52%), linear-gradient(145deg, #101914, #1a291e 64%, #111a15); }
.hero-copy h1 em { color: #c6c99e; }
.hero-intro { color: #c0cbb8; }
.featured-single { background: rgba(20, 32, 23, .84); border-color: rgba(202, 190, 142, .3); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.featured-single:hover { border-color: #d0bf87; }
.featured-label, .featured-cta { color: #dfd0a0; }
.platform-strip { background: rgba(18, 28, 21, .8); }
.language-switch, .platform-label, .platform-mark, .eyebrow, .filter-label,
.collection-tab, .chip, .node-type, .node-arrow, .detail-breadcrumb,
.detail-footer, .detail-footer strong, .tag, .preview-time,
.music-video p, .closing-copy > p:not(.eyebrow), .lyrics,
.element-concept p { color: #c1c8b8; }
.platform-heading > span, .platform-note, .node-index, .collection-tab small { color: #a8b3a1; }
.language-switch:hover, .platform-mark:hover, .chip.active, .collection-tab.active { color: #f1ecdf; background: rgba(190, 177, 125, .13); border-color: rgba(219, 202, 143, .65); }
.universe { background: #101a14; }
.timeline::before { background: linear-gradient(#b6a872, #b6a87222); }
.node-dot { background: #89977a; box-shadow: 0 0 0 5px #101a14; }
.work-node:hover .node-dot, .work-node.active .node-dot { background: #dcc990; box-shadow: 0 0 0 5px #101a14, 0 0 14px #cbb879; }
.detail-panel { box-shadow: 0 12px 40px rgba(0, 0, 0, .18); }
.detail-description { color: #d5d9cd; }
.element-concept { border-color: #9eac89; background: linear-gradient(90deg, rgba(136, 157, 120, .15), transparent); }
.element-concept span { color: #d2d8bb; }
.preview-player { border-color: rgba(210, 193, 133, .4); background: rgba(196, 183, 131, .06); }
.preview-player.playing { border-color: #d7c38b; }
.preview-toggle { color: #e8e4d6; }
.preview-track { background: rgba(223, 216, 190, .25); }
.closing { background: linear-gradient(145deg, #17251b, #101813); }
.mirror { border-color: rgba(194, 188, 140, .35); box-shadow: 0 0 0 8px #17251b, 0 0 0 9px rgba(194, 188, 140, .35); }
.mirror span { background: radial-gradient(ellipse at 50% 45%, rgba(225, 208, 148, .25), transparent 55%), linear-gradient(145deg, #435a40, #1b2a20); }
footer { color: #acb6a5; background: #0d1510; }
