.pieza--tajibo .pieza__rejilla { min-height: 100vh; min-height: 100svh; }
.pieza--tajibo .pieza__obra { position: absolute; inset: 0; height: auto; }
.pieza--tajibo .lienzo {
  inset: 0; top: 0; left: 0; width: 100%; height: 100%; aspect-ratio: auto; transform: none;
  background: #161515; box-shadow: none; touch-action: pinch-zoom;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent;
}
.pieza--tajibo .lienzo picture { position: absolute; inset: 0; }
.pieza--tajibo .lienzo__pintura {
  position: absolute; inset: 0; width: 100%; max-width: none; height: 100%;
  object-fit: cover; object-position: 50% 50%;
}

@media (max-aspect-ratio: 1/1) {
  .pieza--tajibo .lienzo__pintura { object-position: 50% 35%; }
}
.pieza--tajibo .lienzo__vivo {
  position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; transition: opacity 0.4s var(--curva);
}
.pieza--tajibo .lienzo__vivo--apagado { opacity: 0; }

.pieza--tajibo[data-estado="final"] .lienzo__pista { opacity: 0; }

.pieza--tajibo .lienzo--sobre-luna { cursor: pointer; }
.pieza--tajibo .lienzo__luna {
  position: absolute; z-index: 2; padding: 0; border: 0; border-radius: 50%; background: none;
  pointer-events: none; -webkit-tap-highlight-color: transparent;
}
.pieza--tajibo .lienzo__luna:focus-visible { outline: 2px solid var(--hueso); outline-offset: 4px; }
.pieza--tajibo .lienzo__luna[hidden] { display: none; }

.pieza--tajibo .lienzo__pista {
  top: calc(5.5rem + env(safe-area-inset-top, 0px)); bottom: auto; opacity: 0;
  transition: opacity 0.6s var(--curva);
}
.pieza--tajibo[data-listo] .lienzo__pista { opacity: 1; }
.pieza--tajibo[data-tocado] .lienzo__pista { opacity: 0; }

@media (max-width: 63.99em) {
  .pieza--tajibo .pieza__cartela { padding-bottom: 1.75rem; }
}
.pieza--tajibo .pieza__cartela::before {
  background: linear-gradient(to top, rgb(22 21 21 / 0.92) 0%, rgb(22 21 21 / 0.7) 40%, rgb(22 21 21 / 0) 100%);
}
.pieza--tajibo .pieza__controles { gap: 1rem; }

html[data-movimiento="calmo"] .pieza--tajibo .lienzo__pista { display: none; }
html[data-movimiento="calmo"] .pieza--tajibo .lienzo__vivo { transition: none; }

@media (min-width: 64em) {
  .pieza--tajibo .pieza__obra { position: absolute; inset: 0; height: auto; }
  .pieza--tajibo .lienzo { top: 0; width: 100%; transform: none; }
  .pieza--tajibo .lienzo__pista { left: 52%; right: 0; top: 7.5rem; }
  .pieza--tajibo .pieza__rejilla { min-height: 100vh; min-height: 100svh; }
}

.pieza--en-portada .lienzo { touch-action: pan-y pinch-zoom; }
.pieza--en-portada .pieza__titulo { font-size: clamp(2.25rem, 1.7rem + 2.6vw, 4rem); }

html[data-movimiento="calmo"] .pieza--en-portada .solo-pleno { display: none; }
