@import url('../park-v14/park.css');

body.viewing.photo-mode #park {
  background-color: #13221a;
  background-image: linear-gradient(180deg, #07110b43, #07110b08 40%, #07110ba8),
    var(--habitat-backdrop, none);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

body.viewing.photo-mode .habitat-photo {
  inset: 50% auto auto 50%;
  width: min(100%, calc(100dvh * var(--habitat-aspect, 1)));
  height: auto;
  max-height: 100%;
  transform: translate(-50%, -50%);
  mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}

@media (orientation: portrait) {
  body.viewing.photo-mode .habitat-photo {
    mask-image: linear-gradient(180deg, transparent, black 8%, black 92%, transparent);
  }
}