/* Size the camera from the original wide scene. Extra furniture may fill spare
   space below it, but never reduces the chocolate board to fit the floor. */
.scene-upper {
  position: absolute;
  inset: 0 0 auto;
  width: 100%;
  height: 100%;
}
.cabinet-bottom-extension {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 85.15625%;
  width: 100%;
  height: 83.072916667%;
  max-width: none;
  pointer-events: none;
  /* Feather only the cupboard panels. The original drawer stays visible. */
  mask-image: url("assets/cabinet-desk-rug-blend-v4.svg");
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
}
/* Localized rug edit; the approved furniture and floor remain the base image. */
.cabinet-rug-fluff {
  position: absolute;
  z-index: 2;
  left: 23.4375%;
  top: 140.885416667%;
  width: 54.6875%;
  height: 27.34375%;
  max-width: none;
  pointer-events: none;
}
.cabinet-stage {
  overflow: hidden;
}
html:not(.is-portrait-browsing) .cabinet-page:not(.is-scene-interactive) .scene-space {
  top: 0;
  transform: translateX(-50%);
}
.cabinet-page .study-plant-natural,
.cabinet-page .study-tabletop-repair {
  display: block;
  position: absolute;
  width: 113.98%;
  height: 112.17%;
  left: -7.92%;
  top: -1.39%;
  max-width: none;
  pointer-events: none;
}

/* These are shadow-only silhouettes; the photographed eyes remain untouched.
   Share their existing motion, while the parent filter casts towards the right. */
.note-contact-shadow {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.crochet-shadow-shape {
  transform-box: fill-box;
  transform-origin: 50% 50%;
}
.board-plane:has(.crochet-eye-green.is-orbiting, .crochet-eye-green.is-tap-animating) .crochet-shadow-green {
  animation: crochet-orbit 3.2s ease-in-out infinite reverse;
}
.board-plane:has(.crochet-eye-yellow.is-orbiting, .crochet-eye-yellow.is-tap-animating) .crochet-shadow-yellow {
  animation: crochet-orbit 2.8s ease-in-out infinite;
}
.board-plane:has(.crochet-eye-green.is-tap-animating) .crochet-shadow-green,
.board-plane:has(.crochet-eye-yellow.is-tap-animating) .crochet-shadow-yellow {
  animation-iteration-count: 1;
}
@media (prefers-reduced-motion: reduce) {
  .board-plane .crochet-shadow-shape { animation: none !important; }
}
