.work-scene { position: absolute; inset: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.work-scene:first-child { opacity: 1; }
.scene-plane { position: absolute; width: max(100%, 150vh); aspect-ratio: 3 / 2; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.scene-floor { width: 100%; height: 100%; display: block; }
.actor { position: absolute; width: var(--size); aspect-ratio: 1; transform-origin: 50% 70%; filter: drop-shadow(5px 9px 7px #0009); }
.actor img { display: block; width: 100%; height: 100%; }
.installed-module { pointer-events: none; }
.cargo { position: absolute; left: 36%; top: -3%; width: 28%; height: 23%; border: 4px solid #927654; background: #4a3825; box-shadow: 2px 4px 5px #0007; transform-origin: center; }
.cargo.tomatoes { background: radial-gradient(circle at 30% 30%, #ae5744 0 13%, #6b3025 14% 22%, transparent 23%) 0 0 / 15px 15px, #403a28; }
.cargo.crate { border-color: #343e3b; }
.cargo.wood { left: 18%; top: 0; width: 64%; height: 15%; border: 1px solid #84623e; background: repeating-linear-gradient(2deg, #ab8054 0px, #ab8054 3px, #92704d 4px, #ba9164 6px); }
.reading-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #080b0d26, #080b0d45 18%, #080b0ddb 35%, #080b0deb 50%, #080b0ddb 65%, #080b0d45 82%, #080b0d26), linear-gradient(#080b0d55, transparent 24%, transparent 78%, #080b0d75); pointer-events: none; }
.scene-preview { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #111; border: 1px solid #ffffff18; }
.scene-preview .scene-plane { width: 100%; }
.scene-preview .reading-shade { background: linear-gradient(90deg, transparent 18%, #080b0dbb 36%, #080b0ddd 50%, #080b0dbb 64%, transparent 82%); }
.preview-copy { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; width: 40%; margin: auto; color: #f1eee6; font: clamp(15px, 2.3vw, 30px)/1.35 Georgia, serif; }
.preview-copy span { display: block; font: 10px/1.6 monospace; letter-spacing: .12em; text-transform: uppercase; color: #aaa99f; margin-bottom: 20px; }
@media (max-width: 700px) {
  .backdrop .scene-plane { width: max(170vw, 130vh); left: auto; right: -23vw; transform: translateY(-50%); }
  .backdrop .actor:not(:last-child):not(.installed-module) { display: none; }
  .backdrop .reading-shade { background: linear-gradient(90deg, #080b0de8, #080b0dda 55%, #080b0da8), linear-gradient(#080b0d88, transparent, #080b0dbb); }
}