/* The lab scene (owner #48, #63, #70): our robot at the PC desk, holo panels, +BTC / +AIN pops; one look for the landing
   hero and the Lab's middle. Scene units x --u (set by scene-pixel.js). Sprites: 4 frames, rows work / boost / win. */
.px-room { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); pointer-events: none; --sp: 1; }
.px-wall { position: absolute; inset: 0 0 auto 0; height: calc(112 * var(--u));
  background: repeating-linear-gradient(90deg, var(--wall-a, #2e3b70) 0 calc(31 * var(--u)), var(--wall-b, #1f2850) 0 calc(32 * var(--u))); }
.px-wall::after { content: ""; position: absolute; inset: auto 0 0 0; height: calc(3 * var(--u)); background: #0b0d1a; }
.px-floor { position: absolute; inset: calc(112 * var(--u)) 0 0 0;
  background: repeating-linear-gradient(0deg, var(--floor-a, #4e2e1a) 0 calc(11 * var(--u)), var(--floor-b, #3d2414) 0 calc(12 * var(--u))); }

.px-spr { position: absolute; width: calc(var(--z) * var(--u)); height: calc(var(--z) * var(--u)); background-repeat: no-repeat;
  background-size: 400% 100%; image-rendering: pixelated; image-rendering: crisp-edges;
  animation: px-run calc(0.4s * var(--sp, 1)) steps(4) infinite; }
@keyframes px-run { to { background-position-x: 133.333%; } }

@keyframes px-hit { 40% { transform: scale(1.08); } }
.px-bot { transition: opacity 0.3s, transform 0.3s; }
.px-bot.is-off { opacity: 0; transform: translateY(calc(6 * var(--u))); }

.px-room.is-dark .px-st { filter: grayscale(0.7) brightness(0.55); animation-play-state: paused; }
.px-room.is-paused .px-spr { animation-play-state: paused; }
.px-pop { position: absolute; font: 700 calc(9 * var(--u)) var(--font-display, var(--f-display)); color: #f0a01e; text-shadow: 0 2px 0 #0b0d1a; animation: px-pop 0.9s ease-out forwards; }
@keyframes px-pop { to { transform: translateY(calc(-26 * var(--u))); opacity: 0; } }
.px-spr[data-r] { background-size: 400% 300%; }
.px-room.is-boost .px-spr[data-r] { background-position-y: 50%; }
.px-room.is-win .px-spr[data-r] { background-position-y: 100%; }
.px-holo { position: absolute; background: #1c0f3ae6; --e: calc(2 * var(--u)); /* pixel frame, corners left out (#307) */
  box-shadow: 0 calc(var(--e) * -1) 0 #a970ff, 0 var(--e) 0 #a970ff, calc(var(--e) * -1) 0 0 #a970ff, var(--e) 0 0 #a970ff, inset 0 var(--e) 0 #3a2470;
  animation: px-float 3.2s ease-in-out infinite; transition: opacity 0.3s; }
.px-holo svg { width: 100%; height: 100%; display: block; fill: #2ed2ee; }
.px-holo.is-off { opacity: 0.15; }
@keyframes px-float { 50% { transform: translateY(calc(-3 * var(--u))); } }
.px-glow { position: absolute; left: calc(84 * var(--u)); top: calc(4 * var(--u)); width: calc(90 * var(--u)); height: calc(90 * var(--u));
  background: radial-gradient(circle, #2ed2ee40, transparent 65%); }
.px-room.is-dark .px-glow { opacity: 0; } .px-room.is-dark .px-holo { opacity: 0.1; }
.px-pop.is-btc { color: #f7931a; } .px-pop.is-ain { color: #2ed2ee; }
.px-pop { font-size: calc(11 * var(--u)); animation-duration: 1.4s; }
@media (prefers-reduced-motion: reduce) { .px-holo { animation: none; } }
@media (prefers-reduced-motion: reduce) { .px-spr { animation: none; } }
/* owner #71: the room tag (the Lab's room scene) */
.px-tag { position: absolute; left: calc(6 * var(--u)); top: calc(6 * var(--u)); padding: calc(2 * var(--u)) calc(5 * var(--u)); border-radius: calc(3 * var(--u));
  background: #0b0d1acc; border: calc(1.5 * var(--u)) solid #39405a; color: #e8edf8; font: 400 calc(8 * var(--u)) var(--font-display, var(--f-display)); letter-spacing: 0.08em; }
/* owner #72: the wide room pans inside its host; its layer (stations, rigs) takes taps, the art does not */
.px-room.is-wide { position: relative; left: 0; top: 0; transform: none; }
.px-layer { position: absolute; inset: 0; pointer-events: none; }
.px-layer [data-act] { pointer-events: auto; cursor: pointer; }
.px-in { position: absolute; left: 0; top: 0; width: 100%; }
.px-room.is-wide { background: repeating-linear-gradient(90deg, var(--wall-a, #2e3b70) 0 calc(31 * var(--u)), var(--wall-b, #1f2850) 0 calc(32 * var(--u))); }

.px-spr[hidden] { display: none; }
/* the busy landing lab (owner #306): LEDs blink in steps, BTC coins drift up and fade; both stop with the room */
.px-led { position: absolute; width: calc(2.5 * var(--u)); height: calc(2.5 * var(--u)); background: #3dff8a; box-shadow: 0 0 calc(3 * var(--u)) currentColor; color: #3dff8a;
  animation: px-blink 1.6s steps(1, end) infinite; }
.px-led.is-c { background: #2ed2ee; color: #2ed2ee; } .px-led.is-a { background: #f7931a; color: #f7931a; }
@keyframes px-blink { 50% { opacity: 0.2; } }
.px-coin { opacity: 0; animation: px-run 0.4s steps(4) infinite, px-rise 4.4s ease-out infinite; }
@keyframes px-rise { 0% { opacity: 0; transform: translateY(0); } 15% { opacity: 1; } 70% { opacity: 0.9; } 100% { opacity: 0; transform: translateY(calc(-22 * var(--u))); } }
.px-room.is-paused .px-led, .px-room.is-paused .px-coin { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .px-led, .px-coin { animation: none; } .px-coin { opacity: 0; } }
/* the landing's floor (owner #309): the web sign on the desk edge, three Bitcoin vacuums driving out and back, coins sucked into each nose */
.px-sign { position: absolute; left: calc(130 * var(--u)); top: calc(94 * var(--u)); transform: translateX(-50%); display: flex; align-items: center; gap: calc(2 * var(--u));
  padding: calc(1 * var(--u)) calc(4 * var(--u)); background: #0b0d1a; color: #2ed2ee; font: 400 calc(7.5 * var(--u))/1 var(--font-display, var(--f-display)); white-space: nowrap;
  box-shadow: 0 calc(-1 * var(--u)) 0 #2ed2ee, 0 var(--u) 0 #2ed2ee, calc(-1 * var(--u)) 0 0 #2ed2ee, var(--u) 0 0 #2ed2ee; }
.px-sign .px-spr { position: relative; left: 0 !important; top: 0 !important; flex: none; }
.px-unload { opacity: 0; } /* only seen while it hops into the vault (#310) */