/* v0.2.2: four owned, noninteractive layers; a single finite main show at a time. */
.game-show, .game-show * { pointer-events: none !important; box-sizing: border-box; }
.game-show { position: absolute; z-index: 7; inset: 0; overflow: hidden; isolation: isolate; }
.show-layer { position: absolute; inset: 0; overflow: hidden; transform-origin: 0 0; }
.show-environment { z-index: 0; }
.show-paws { z-index: 1; }
.show-discovery { z-index: 2; }
.show-foreground { z-index: 3; }
.game-show i { position: absolute; display: block; margin: 0; padding: 0; font-style: normal; opacity: 0; }
#app:not(.assets-ready) .game-show, .game-show[data-paused="true"] { visibility: hidden; }
#app.show-entering #hint-panel { visibility: hidden; pointer-events: none; }
.show-entry-shade { background: #030917; }
.show-door-panel { background: linear-gradient(90deg, #020813f0, #081220cb); }
.show-room-sweep {
  background: linear-gradient(115deg, transparent 24%, #eaf3ff05 32%, #eaf3ff99 46%, #eaf3ff28 56%, transparent 72%);
  border-radius: 32%;
  /* Keep the bright centre, feather to zero before all four rectangle edges. */
  -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 0%, #000 45%, #000000eb 65%, #00000059 85%, transparent 100%);
  mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 0%, #000 45%, #000000eb 65%, #00000059 85%, transparent 100%);
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
.show-stand-focus { border-radius: 50%; background: radial-gradient(ellipse, #edf5ffb8, #edf5ff42 35%, transparent 72%); }
.show-local-glow { border-radius: 50%; background: radial-gradient(circle, #edf4ffa6, #edf4ff24 45%, transparent 72%); }
.show-ripple { border: 2px solid #edf5ffe0; border-radius: 50%; background: radial-gradient(circle, #edf4ff0d, transparent 65%); transform-origin: center; }
/* Original five-pad paw silhouette, drawn entirely with CSS ellipses. */
.show-paw {
  background:
    radial-gradient(ellipse 25% 22% at 50% 68%, #edf5fff2 94%, transparent 100%),
    radial-gradient(ellipse 11% 16% at 18% 37%, #edf5fff2 92%, transparent 100%),
    radial-gradient(ellipse 11% 17% at 39% 20%, #edf5fff2 92%, transparent 100%),
    radial-gradient(ellipse 11% 17% at 65% 22%, #edf5fff2 92%, transparent 100%),
    radial-gradient(ellipse 10% 15% at 84% 41%, #edf5fff2 92%, transparent 100%);
  transform-origin: center;
}
.show-band { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.show-band path { opacity: 0; vector-effect: non-scaling-stroke; }
.show-particle { width: 3px; height: 3px; margin: -1.5px 0 0 -1.5px !important; border-radius: 50%; background: #edf4ff; }
.show-product-arc { border-radius: 50%; background: transparent; }
.show-product-arc-left { border-left: 1.5px solid #eaf2ffc4; }
.show-product-arc-right { border-right: 1.5px solid #eaf2ffc4; }
.game-show[data-low-power="true"] .show-ripple { background: transparent; }
.game-show[data-reduced="true"] .show-paw,
.game-show[data-reduced="true"] .show-band,
.game-show[data-reduced="true"] .show-particle { display: none; }
@media (prefers-reduced-motion: reduce) {
  .game-show .show-paw, .game-show .show-particle { display: none; }
}
.show-door-panel { background-image:url('assets/cinema/door-v01.png'); background-size:200% 100%; background-repeat:no-repeat; }
