/* Decorative layers share the room coordinate system and never intercept input. */
.scene-art {
  display: none;
  position: absolute;
  inset: 0;
  width: 1536px;
  height: 1024px;
  overflow: visible;
  pointer-events: none;
  user-select: none;
}
.scene-art #score-curl { opacity: var(--curl, 0); }
.scene-art #plate-inscription { opacity: 0; }
.scene-art #plate-brush {
  fill: none;
  stroke: white;
  stroke-width: 22px;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.scene-art .book-animation { display: none; }
.scene-art .book-animation[data-active=true] { display: inline; }
.scene-art .book-leaf {
  transform: translateY(0);
  transition: transform 160ms cubic-bezier(.2, .7, .2, 1);
}
.scene-art .book-leaf[data-raised=true] {
  transform: translateY(calc(-1 * var(--book-lift, 10px)));
  transition-duration: 200ms;
}
.scene-art[data-books-reset=true] .book-leaf { transition: none; }

@media (min-width: 821px) and (hover: hover) and (pointer: fine) {
  .scene-art { display: block; }
  .scene-art[data-plate-active=true] #plate-inscription { opacity: 1; }
  .scene-art[data-plate-static=true] #plate-inscription { mask: none; }
}
