/* A separate, full-frame cinema view for the product film. */
html.art-film-open { overflow: hidden; }
.art-film-dialog {
  width: min(70rem, calc(100vw - 2rem));
  max-width: none;
  max-height: calc(100dvh - 2rem);
  margin: auto;
  padding: 0;
  border: 0;
  color: #fff;
  background: #171714;
  overflow: auto;
}
.art-film-dialog::backdrop { background: rgb(15 15 13 / 84%); }
.art-film-dialog__screen { position: relative; }
.art-film-dialog__loading {
  position: absolute;
  inset: 0 0 3.5rem;
  display: grid;
  place-items: center;
  margin: 0;
  color: #fff;
  font-size: .875rem;
  pointer-events: none;
}
.art-film-dialog__loading[hidden] { display: none; }
.art-film-dialog__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 3.5rem;
  padding: .25rem .5rem .25rem 1.25rem;
}
.art-film-dialog__title { margin: 0; font: inherit; font-size: .95rem; font-weight: 400; }
.art-film-dialog__close {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  font-size: 1.75rem;
  cursor: pointer;
}
.art-film-dialog__close:hover { background: rgb(255 255 255 / 10%); }
.art-film-dialog__close:focus-visible { outline: 1px solid currentColor; outline-offset: -4px; }
.art-film-dialog video {
  display: block;
  width: 100%;
  max-height: calc(100dvh - 5.5rem);
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background: #000;
}
@media (max-width: 600px) {
  .art-film-dialog { width: calc(100vw - 1rem); max-height: calc(100dvh - 1rem); }
  .art-film-dialog video { max-height: calc(100dvh - 4.5rem); }
}