/* Keep the exit control above Safari's video surface and reliably tappable. */
.watch-video.is-immersive .immersive-topbar,
.watch-video:fullscreen .immersive-topbar {
  z-index: 8;
  justify-content: flex-start;
  pointer-events: auto;
}

.watch-video.is-immersive .immersive-topbar > span,
.watch-video:fullscreen .immersive-topbar > span {
  position: absolute;
  top: max(14px, env(safe-area-inset-top));
  left: 50%;
  width: min(280px, calc(100% - 150px));
  display: flex;
  justify-content: center;
  opacity: 1;
  pointer-events: none;
  transform: translateX(-50%);
}

.watch-video.is-immersive .immersive-topbar .brand.brand-house,
.watch-video:fullscreen .immersive-topbar .brand.brand-house {
  width: 100%;
  min-width: 0;
  justify-content: center;
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, .9));
}

.watch-video.is-immersive .immersive-topbar .brand-house-name,
.watch-video.is-immersive .immersive-topbar .brand-house-subtitle,
.watch-video:fullscreen .immersive-topbar .brand-house-name,
.watch-video:fullscreen .immersive-topbar .brand-house-subtitle {
  color: #fff;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .9);
}

.watch-video.is-immersive .immersive-exit,
.watch-video:fullscreen .immersive-exit {
  position: relative;
  z-index: 2;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

/* Keep the centered lockup clear of the close control on narrow screens. */
@media (max-width: 720px) {
  .watch-video.is-immersive .immersive-topbar > span,
  .watch-video:fullscreen .immersive-topbar > span {
    top: max(14px, env(safe-area-inset-top));
    width: min(230px, calc(100% - 132px));
  }

  .watch-video.is-immersive .immersive-exit:active,
  .watch-video:fullscreen .immersive-exit:active {
    transform: scale(.96);
  }
}