/* Scoped overrides: the portrait film stays complete on phones and desktops. */
.intro.intro-video-screen {
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: #c7b68b;
  isolation: isolate;
}
.intro.intro-video-screen video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.intro-video-screen .intro-loading {
  color: #173236;
  font-size: 14px;
}
.intro-video-screen.is-playing .intro-loading { visibility: hidden; }
.intro-video-screen .intro-controls {
  position: absolute;
  z-index: 2;
  top: max(16px, env(safe-area-inset-top));
  left: max(16px, env(safe-area-inset-left));
  right: max(16px, env(safe-area-inset-right));
  display: flex;
  justify-content: space-between;
  gap: 12px;
  direction: ltr;
}
.intro-video-screen .skip,
.intro-video-screen .intro-sound {
  position: static;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 12px;
  background: rgba(11, 52, 50, .94);
  color: #fff;
  font: 500 12px Alexandria, sans-serif;
  line-height: 1.5;
  direction: rtl;
  cursor: pointer;
  touch-action: manipulation;
}
.intro-video-screen button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}