/* Keep the approved desktop composition in browsers that predate the
   unprefixed CSS mask properties. The SVG uses the same original JPEG and
   protective matte windows already used by the approved mobile portrait. */
@media (min-width: 901px) {
  @supports not ((mask-image: linear-gradient(#000, #000)) and (mask-mode: luminance) and (mask-composite: add)) {
    .portrait-scene .portrait-person { display: none; }
    .portrait-scene .portrait-person-mobile {
      display: block !important;
      position: absolute;
      left: 40%;
      top: -5.2%;
      width: 53%;
      height: auto;
      max-width: none;
      pointer-events: none;
    }
    .opening .portrait-person-mobile { left: 41.5%; }
  }

  /* These scenes fill the viewport on desktop. Keep their natural 2:1
     proportions when CSS aspect-ratio is unavailable. */
  @supports not (aspect-ratio: 2 / 1) {
    .opening, .meet-masha { min-height: 50vw; }
    .portrait-scene .portrait-stage::before {
      content: '';
      display: block;
      padding-top: 50%;
    }
  }

  /* Older desktop engines also need physical inset properties. */
  @supports not (inset: 0) {
    .masthead { top: 0; right: 0; bottom: auto; left: 0; }
    .opening .opening-image.portrait-scene,
    .meet-scene, .location-image, .location-image::after,
    .offerings-backdrop,
    .portrait-scene .portrait-room,
    .portrait-scene .portrait-foreground {
      top: 0; right: 0; bottom: 0; left: 0;
    }
    .portrait-scene .portrait-stage {
      top: auto; right: 0; bottom: 0; left: 0;
    }
  }

  /* Prevent the tiny pen inscription inheriting body size without cqw. */
  @supports not (font-size: 1cqw) {
    .portrait-pen-inscription { font-size: .73vw; }
  }
}
