/* Details of Camilo's original works. Cropping belongs to the page, never the file. */
/* The actual pigments own these openings. Opaque paper also keeps the existing
   difference-blended headings legible inside their isolated scenes. */
.journey-journal :is(.journal-cover-opening, .notebook-opening, .paint-opening, .traces-opening, .reserve-opening) { background: var(--white); }
.journey-journal :is(.journal-cover-opening, .notebook-opening, .paint-opening, .traces-opening, .reserve-opening) > .chapter-field { display: none; }
.art-fragment {
  position: absolute;
  display: block;
  overflow: hidden;
  margin: 0;
  translate: 0 var(--fragment-y, 0px);
  background: var(--white, #f7f7f2);
  color: var(--black, #111);
  -webkit-tap-highlight-color: transparent;
}
.art-fragment > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.art-fragment:focus-visible {
  z-index: 10 !important;
  clip-path: none !important;
  outline: 3px solid currentColor;
  outline-offset: 6px;
  filter: drop-shadow(0 0 3px var(--white, #fff));
}
.fragment-label {
  position: absolute;
  z-index: 2;
  left: 16%;
  bottom: 15%;
  max-width: 70%;
  padding: 8px 11px;
  background: var(--white, #f7f7f2);
  color: var(--black, #111);
  font: 400 10px/1.4 DM, Arial, sans-serif;
  letter-spacing: 0;
  opacity: 0;
  transition: opacity .22s ease;
  pointer-events: none;
}
.art-fragment:is(:hover, :focus-visible) .fragment-label { opacity: 1; }
.motion-reduced .art-fragment { translate: none; }
.motion-reduced .fragment-label { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .art-fragment { translate: none; }
  .fragment-label { transition: none; }
}
