/* RankRealm movie viewer atmosphere.
   Only the watch route receives this art; its layout and fantasy frames are unchanged.
   Source: original user-supplied 1823x863 fantasy artwork.
*/
.watch-view {
  position: relative;
  isolation: isolate;
  background: #070b17;
}
.watch-view::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  aspect-ratio: 1823 / 863;
  pointer-events: none;
  background-color: #100821;
  background-image:
    linear-gradient(
      to bottom,
      rgba(7, 11, 23, .05) 0%,
      rgba(7, 11, 23, .06) 62%,
      rgba(7, 11, 23, .22) 78%,
      rgba(7, 11, 23, .78) 94%,
      #070b17 100%
    ),
    url("backgrounds/rankrealm-watch.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% 100%;
}
.watch-view > .watch-page {
  position: relative;
  z-index: 1;
}
/* Never size the image by the variable height of a long movie synopsis or
   sidebar. The scene fades naturally into the dark page during scrolling. */
@media (max-width: 700px) {
  .watch-view::before {
    min-height: 235px;
    background-size: 100% 100%, cover;
  }
}
