/* Colour and physicality for every evidence plate. Diagram content stays intact. */
.challenge-card.visuals-ready {
  --exhibit-ink: #7d2e46;
  --exhibit-edge: #d0a7b2;
  --exhibit-edge-dark: #84636b;
  --exhibit-wash: #f8ecef;
  --exhibit-ground: #f6e9e9;
  --exhibit-tile: #fffaf8;
}

.challenge-card.visuals-ready .card-head {
  border-top: 4px solid var(--exhibit-ink);
  background:
    radial-gradient(circle at 96% 2%, var(--exhibit-wash), transparent 35%),
    linear-gradient(145deg, #fffdf9, #f7f0e5);
}
.gambit-card.visuals-ready .card-head {
  background: radial-gradient(circle at 96% 2%, #39262e, transparent 36%), linear-gradient(145deg, #11100f, #292019);
  color: #f7efe2;
  border-top-color: #d6a958;
}
.challenge-card.visuals-ready .stage-count { color: var(--exhibit-ink); }
.gambit-card.visuals-ready .stage-count { color: #f1d9a4; }
.challenge-card.visuals-ready .question-copy { color: var(--exhibit-ink); }

.case-art.evidence-plate {
  position: relative;
  width: min(100%, 610px);
  max-width: none;
  margin: 18px auto 24px;
  padding: 13px 14px 12px;
  border: 1px solid var(--exhibit-edge);
  border-radius: 17px;
  background:
    radial-gradient(circle at 100% 0%, var(--exhibit-wash), transparent 46%),
    #fffdf8;
  box-shadow: 0 14px 30px #30251c17, inset 0 0 0 4px #ffffffad;
  text-align: center;
}
.case-art.evidence-plate.gear-train-plate { max-width: 470px; }
.case-art.evidence-plate::before {
  content: attr(data-exhibit-label);
  display: block;
  margin: 0 0 11px;
  padding: 0 2px 8px;
  border-bottom: 1px solid var(--exhibit-edge);
  color: var(--exhibit-ink);
  text-align: left;
  font: 800 .68rem/1.2 system-ui, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.case-art.evidence-plate > svg {
  width: 100%;
  border-radius: 11px;
  filter: drop-shadow(0 5px 10px #251d1514);
}
.case-art.evidence-plate .enlarge-art {
  min-height: 40px;
  margin: 6px 0 0;
  padding: 7px 12px;
  border: 1px solid var(--exhibit-edge);
  border-radius: 999px;
  background: #fffdf9;
  color: var(--exhibit-ink);
  font: 750 .75rem/1.2 system-ui, sans-serif;
  text-decoration: none;
}
.case-art.evidence-plate .enlarge-art:hover { background: var(--exhibit-wash); }
.case-art.evidence-plate .enlarge-art:focus-visible { outline-color: var(--exhibit-ink); }

/* The fixed light and dark puzzle marks keep their original meaning. */
svg.evidence-illuminated > rect:first-child[fill="#f2e9d4"] {
  fill: var(--exhibit-ground);
  stroke: var(--exhibit-ink);
}
svg.evidence-illuminated rect[fill="#fff9eb"],
svg.evidence-illuminated circle[fill="#fff9eb"] { fill: var(--exhibit-tile); }
svg.evidence-illuminated rect[stroke="#78654a"],
svg.evidence-illuminated rect[stroke="#615033"] { stroke: var(--exhibit-edge-dark); }
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#54432a"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#55432c"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#57482e"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#5b492b"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#463a29"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#675332"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#59492f"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#6b5734"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#5c492a"],
svg.evidence-illuminated :is(circle, path, line, polyline)[stroke="#59482c"] {
  stroke: var(--exhibit-ink);
}

/* Text-led exhibits use the same palette as their diagram-led neighbours. */
.visuals-ready .evidence-word,
.visuals-ready .equation-line,
.visuals-ready .cipher-strip span {
  background: linear-gradient(145deg, #211b1d, var(--exhibit-ink));
  color: #fff7e9;
  box-shadow: 0 9px 22px #21171422;
}
.visuals-ready .evidence-note,
.visuals-ready .rule-line { border-color: var(--exhibit-ink); background: var(--exhibit-wash); }
.visuals-ready .letter-grid span,
.visuals-ready .fragment-pair span,
.visuals-ready .answer-stack span { border-color: var(--exhibit-edge-dark); background: var(--exhibit-tile); }
.visuals-ready .fold-card { border-color: var(--exhibit-ink); }
.visuals-ready .fold-card::before,
.visuals-ready .fold-card::after { background: repeating-linear-gradient(90deg, var(--exhibit-ink) 0 5px, transparent 5px 10px); }
.visuals-ready .pentagon-puzzle .route polyline,
.visuals-ready .map-puzzle .route-preview polyline { stroke: var(--exhibit-ink); }

/* The enlarged SVG is cloned outside the card; custom properties are also on the SVG. */
.art-dialog svg.evidence-illuminated { border-radius: 10px; }

@media (max-width: 480px) {
  .case-art.evidence-plate { padding: 10px 10px 11px; border-radius: 12px; }
  .case-art.evidence-plate::before { margin-bottom: 8px; font-size: .61rem; }
  .case-art.evidence-plate .enlarge-art { min-height: 44px; }
}
@media (max-width: 370px) {
  .art-options { grid-template-columns: minmax(0, 1fr); }
  .art-options .case-art.evidence-plate { width: min(100%, 270px); margin: 8px auto 18px; }
  .art-options .case-art.evidence-plate > svg { max-height: 260px; }
}
@media (prefers-reduced-motion: reduce) {
  .case-art.evidence-plate,
  .case-art.evidence-plate * { transition: none !important; animation: none !important; }
}