/* Runtime art layer: original production exports with accessible HTML overlays. */
.record-cover .cover-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.record-cover:has(.cover-art):after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(#17111ca8, transparent 35%, #17111cdd);
  z-index: 0;
  pointer-events: none;
}
.record-cover:has(.cover-art) > span,
.record-cover:has(.cover-art) > strong,
.record-cover:has(.cover-art) > small {
  position: relative;
  z-index: 1;
  text-shadow: 0 2px 5px #0009;
}
.artist-photo .portrait {
  object-position: center 28%;
}
.staff-portrait {
  object-fit: cover;
  object-position: center 25%;
  border-radius: 5px;
}
.event-illustration {
  width: 100%;
  height: 130px;
  object-fit: cover;
  display: block;
  border-bottom: 1px solid #87634e;
}
.prop-illustration {
  object-fit: contain;
  mix-blend-mode: screen;
}
.era-strip .era img {
  object-position: center 20%;
}
.era-timeline-1950 {
  --timeline-ground: #49342a;
  --timeline-metal: #b18b55;
}
.era-timeline-1960 {
  --timeline-ground: #46312b;
  --timeline-metal: #b89969;
}
.era-timeline-1980 {
  --timeline-ground: #39273e;
  --timeline-metal: #ad7bb9;
}
.era-timeline-2000 {
  --timeline-ground: #253039;
  --timeline-metal: #7daaa9;
}
.era-region {
  background: linear-gradient(var(--timeline-ground, #3f2b26), #2b2026);
  border-bottom-color: var(--timeline-metal, #947044);
}
:root {
  --hq-art: url("/assets/production/hq-1950.webp");
}
.title-art {
  background-image:
    linear-gradient(
      90deg,
      #181419 3%,
      #181419f2 21%,
      #181419a3 47%,
      #1814190a 79%
    ),
    linear-gradient(0deg, #19141a 0%, transparent 28%, #18141966 100%),
    var(--hq-art);
}
.ending-page {
  background-image: linear-gradient(#211822cc, #211822cc), var(--hq-art);
}
[data-era-kit="1950"] {
  --timeline-ground: #49342a;
  --timeline-metal: #b18b55;
}
[data-era-kit="1960"] {
  --timeline-ground: #46312b;
  --timeline-metal: #b89969;
}
[data-era-kit="1980"] {
  --timeline-ground: #39273e;
  --timeline-metal: #ad7bb9;
}
[data-era-kit="2000"] {
  --timeline-ground: #253039;
  --timeline-metal: #7daaa9;
}
@media (max-width: 600px) {
  .title-art {
    background-image:
      linear-gradient(90deg, #181419e3, #181419b0),
      linear-gradient(0deg, #181419, transparent 70%), var(--hq-art);
  }
}