/*
 * A dark exhibition room. All light and perspective belong to the architecture;
 * the photographs and their interactions are untouched.
 * --scene-floor is the helper's measured standing position in stage pixels.
 */
.stage {
  --room-floor-edge: calc(var(--scene-floor, calc(100% - 80px)) - 25px);
  isolation: isolate;
  background: #101010;
}

.stage::before,
.stage::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  pointer-events: none;
}

/* A broad ceiling wash leaves the wall quiet enough for twelve actual prints. */
.stage::before {
  z-index: -2;
  top: 0;
  height: var(--room-floor-edge);
  background:
    linear-gradient(90deg, #0b0b0b 0%, transparent 8%, transparent 92%, #0b0b0b 100%),
    radial-gradient(ellipse 72% 105% at 47% -10%, #30302e 0%, #232322 38%, #1b1b1a 66%, #171716 100%);
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .025),
    inset 0 -1px rgba(255, 255, 255, .09);
}

/*
 * A low matte floor, with two large stone joints converging towards the wall.
 * Their low contrast gives scale without turning the room into a wireframe.
 */
.stage::after {
  z-index: -1;
  top: var(--room-floor-edge);
  bottom: 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M37 0L15 100M67 0L91 100' fill='none' stroke='%23ffffff' stroke-opacity='.035' stroke-width='.1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat,
    radial-gradient(ellipse 52% 145% at 49% 0%, rgba(255, 255, 255, .045), transparent 78%),
    linear-gradient(180deg, #1b1b1a 0%, #151514 32%, #0e0e0e 100%);
  box-shadow: inset 0 5px 10px -8px #000;
}

@media (max-width: 600px) {
  .stage::before {
    background:
      linear-gradient(90deg, #111 0%, transparent 8%, transparent 92%, #111 100%),
      radial-gradient(ellipse 115% 92% at 43% -3%, #2a2a28 0%, #212120 40%, #171716 100%);
  }
}

@media (forced-colors: active) {
  .stage::before,
  .stage::after {
    display: none;
  }
}
