/* VaporwaveFurniture.png — 768×480 sprite sheet */
:root {
  --sheet-w: 768;
  --sheet-h: 480;
  --sheet-url: url("VaporwaveFurniture.png");
}

.room-prop {
  position: absolute;
  background-image: var(--sheet-url);
  background-repeat: no-repeat;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  pointer-events: none;
  z-index: 2;
  filter: drop-shadow(4px 6px 0 rgba(0, 0, 0, 0.55));
}

/*
  Sprite math:
    width  = --sw * --scale  px
    height = --sh * --scale  px
    bg-size   = sheet_w * --scale  ×  sheet_h * --scale
    bg-pos    = -sx * --scale  ,  -sy * --scale
*/

/* ── ARCADE MACHINES ─────────────────────────────────────────────
   Three large cabinets at the top-right of the sheet.
   x:612 → 664 → 716, each 52 px wide, 108 px tall.
   Corrected: arcade-2 starts at 664 (not 666) to close the 2-px gap.
   arcade-3 width capped at 50 so it stays 2 px inside the 768 boundary.
*/
.room-prop--arcade-1 {
  --sx: 612; --sy: 0; --sw: 52; --sh: 112; --scale: 3;
  left: 0%; bottom: 6%;
}
.room-prop--arcade-2 {
  --sx: 664; --sy: 0; --sw: 52; --sh: 112; --scale: 3;
  left: 12%; bottom: 6%;
}
.room-prop--arcade-3 {
  --sx: 716; --sy: 0; --sw: 50; --sh: 112; --scale: 3;
  left: 22%; bottom: 8%;
}

/* ── COMPUTER / TERMINAL PROP ────────────────────────────────── */
.room-prop--computer {
  --sx: 328; --sy: 28; --sw: 112; --sh: 88; --scale: 3.5;
  right: 28%; bottom: 14%;
  z-index: 3;
  pointer-events: auto;
  cursor: default;
}

/* ── COUNTER — long reception bar, anchored bottom-left ───────── */
.room-prop--counter {
  --sx: 0; --sy: 292; --sw: 256; --sh: 80; --scale: 2.8;
  left: 0; bottom: 0;
  z-index: 1;
}

/* ── SOFA — couch, right side ────────────────────────────────── */
.room-prop--sofa {
  --sx: 360; --sy: 168; --sw: 144; --sh: 56; --scale: 3.2;
  right: 3%; bottom: 20%;
}

/* ── GREEK COLUMNS ───────────────────────────────────────────── */
.room-prop--column-l {
  --sx: 620; --sy: 188; --sw: 44; --sh: 108; --scale: 3.4;
  right: 14%; bottom: 12%;
}
.room-prop--column-r {
  --sx: 668; --sy: 188; --sw: 44; --sh: 108; --scale: 3.4;
  right: 4%; bottom: 12%;
}

/* ── PALM TREE ───────────────────────────────────────────────── */
.room-prop--palm {
  --sx: 536; --sy: 360; --sw: 64; --sh: 96; --scale: 3.2;
  right: 3%; bottom: 8%;
}

/* ── NEON WAVE SIGN ──────────────────────────────────────────── */
.room-prop--neon {
  --sx: 672; --sy: 392; --sw: 72; --sh: 72; --scale: 3;
  right: 1%; top: 10%;
  animation: neonPulse 2.5s ease-in-out infinite;
}

/* ── VENUS DE MILO ───────────────────────────────────────────── */
.room-prop--venus {
  --sx: 488; --sy: 304; --sw: 52; --sh: 100; --scale: 3;
  right: 4%; bottom: 32%;
}

/* ── DAVID BUST ──────────────────────────────────────────────── */
.room-prop--david {
  --sx: 440; --sy: 308; --sw: 44; --sh: 72; --scale: 3;
  left: 2%; top: 36%;
}

/* ── WINDOW — back wall ──────────────────────────────────────── */
.room-prop--window {
  --sx: 196; --sy: 160; --sw: 56; --sh: 56; --scale: 3.5;
  left: 28%; top: 10%;
}

/* ── FRAMED POSTER — back wall ───────────────────────────────── */
.room-prop--poster {
  --sx: 384; --sy: 0; --sw: 56; --sh: 56; --scale: 3.2;
  right: 28%; top: 8%;
}

/* ── FLOWER POT ──────────────────────────────────────────────── */
.room-prop--plant {
  --sx: 442; --sy: 0; --sw: 28; --sh: 56; --scale: 3;
  left: 20%; top: 20%;
}

/* ── COMPUTED SIZE + POSITION ────────────────────────────────── */
.room-prop[class*="room-prop--"] {
  width: calc(var(--sw) * 1px * var(--scale));
  height: calc(var(--sh) * 1px * var(--scale));
  background-size: calc(var(--sheet-w) * 1px * var(--scale)) calc(var(--sheet-h) * 1px * var(--scale));
  background-position: calc(var(--sx) * -1px * var(--scale)) calc(var(--sy) * -1px * var(--scale));
}

@keyframes neonPulse {
  0%, 100% { filter: drop-shadow(0 0 8px #ff71ce) drop-shadow(4px 6px 0 rgba(0, 0, 0, 0.5)); }
  50%       { filter: drop-shadow(0 0 18px #01cdfe) drop-shadow(4px 6px 0 rgba(0, 0, 0, 0.5)); }
}

.poster-delorean {
  position: absolute;
  left: 38%;
  top: 8%;
  width: 220px;
  height: auto;
  image-rendering: pixelated;
  z-index: 2;
  border: 4px solid #ff71ce;
  box-shadow: 6px 6px 0 #000, 0 0 20px rgba(255, 113, 206, 0.4);
  pointer-events: none;
}