/* Stage 3D styles - ONLY for stage device */
.stage-positioner {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  cursor: grab;
  will-change: transform, left, top;
}

.stage-positioner:active {
  cursor: grabbing;
}

/* Optimize Stage 3D rendering for smooth dragging */
.stage-positioner:active .stage-box-3d,
.stage-positioner:active .face {
  transition: none !important;
}
.stage-box-3d { position: relative; transform-style: preserve-3d; transition: transform 0.05s ease-out; }
.face { position: absolute; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.15); }
.face-top { transform: rotateX(90deg) translateZ(calc(var(--stage-d) / 2)); background-image: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(0,0,0,0.5) 100%); }
.face-front { transform: translateZ(calc(var(--stage-d) / 2)); background-image: linear-gradient(180deg, rgba(255,255,255,0.1) 0%, rgba(0,0,0,0.6) 100%); }
.face-back { transform: rotateY(180deg) translateZ(calc(var(--stage-d) / 2)); filter: brightness(0.5); }
.face-left { transform: rotateY(-90deg) translateZ(calc(var(--stage-d) / 2)); filter: brightness(0.7); }
.face-right { transform: rotateY(90deg) translateZ(calc(var(--stage-w) - (var(--stage-d) / 2))); filter: brightness(0.85); }

