/* Give widescreen footage room on portrait phones instead of filling their height. */
@media (max-width: 700px) and (orientation: portrait) {
  .film-backdrop { background: #100e0b; }
  .film-backdrop .picture {
    inset: 88px 0 160px;
    height: auto;
    overflow: hidden;
    transform: none;
    background: #100e0b;
  }
  .film-backdrop .picture video {
    inset: 50% auto auto -25%;
    width: 150%;
    height: auto;
    transform: translateY(-50%);
    object-fit: contain;
    object-position: center;
    /* Feather the picture into the surrounding dark poster palette. */
    mask-image: linear-gradient(transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(transparent, #000 8%, #000 92%, transparent);
  }
}