.parallax-scene {
  position: relative;
  isolation: isolate;
  min-height: var(--scene-height, 60vh);
  overflow: var(--scene-overflow, clip);
  background: var(--scene-bg, transparent);
}

.parallax-scene > .parallax-layer {
  position: absolute;
  inset: calc(var(--parallax-overscan-y, 0px) * -1) calc(var(--parallax-overscan-x, 0px) * -1);
}

.parallax-scene > .parallax-layer,
.parallax-scene [data-layer],
.parallax {
  will-change: translate;
}

.in-editor .parallax-scene > .parallax-layer {
  outline: 1px dashed rgba(255, 255, 255, 0.14);
  outline-offset: -2px;
}
html.in-editor:not(.fig-dragging) .parallax-scene > .parallax-layer { pointer-events: none; }
html.in-editor:not(.fig-dragging) .parallax-scene > .parallax-layer > * { pointer-events: auto; }
.in-editor .parallax-scene > .parallax-layer:empty::after {
  content: "Layer: drop content here";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: rgba(255, 255, 255, 0.35);
  font: 12px/1.3 system-ui, -apple-system, "Segoe UI", sans-serif;
  pointer-events: none;
}
