/* Film hall parity with the photographic journey. Owner-only preview.
   Two equal navigation actions, identical to photo story: language / gallery.
   Landscape/portrait source video frames remain sharp and never cropped.
   Portrait videos have plain deep-blue sidebands, NOT blurred clones. */

/* Reproduce photography journey's quiet floating controls. */
.film-journey-head{
  position:absolute;
  z-index:19;
  top:2px;
  left:0;right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:0;
  padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));
  background:linear-gradient(180deg,rgba(1,9,14,.66),transparent);
  font-size:10px;
  font-weight:650;
  letter-spacing:.12em;
  pointer-events:none;
}
.film-journey-head>*{pointer-events:auto}
.film-journey-head #film-language{
  margin:0 auto 0 0;
  align-self:center;
  flex:0 1 auto;
  width:auto;
  min-width:55px;
  max-width:112px;
  font-size:11px;
  background:rgba(8,18,23,.24);
  border-color:rgba(255,255,255,.29);
}
.film-journey-head #film-close{
  flex:0 0 auto;
  min-height:44px;
  padding:9px 15px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:40px;
  color:#fff;
  background:rgba(8,18,23,.22);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  font:650 12px/1.2 system-ui,sans-serif;
  letter-spacing:normal;
  box-shadow:none;
}
.film-journey-head #film-close:hover{
  border-color:rgba(102,168,255,.67);
  background:rgba(18,63,97,.36);
}
.film-journey-head #film-close:focus-visible,.film-journey-head #film-language:focus-visible{
  outline:2px solid #66a8ff;outline-offset:3px;
}
@media(min-width:800px){
 .film-journey-head{padding-left:32px;padding-right:32px}
}
@media(max-width:340px){
 .film-journey-head #film-language{max-width:80px;min-width:49px}
}
html[dir="rtl"] .film-journey-head{direction:rtl}
html[dir="rtl"] .film-journey-head #film-language{margin:0 0 0 auto}

/* The original vertical video is complete and sharply centered; no enlarged
   blurred duplicate of it surrounds the image. Horizontal clips may retain
   the same restrained soft background treatment as landscape photographs. */
.film-scene.is-portrait .film-stage,
.film-scene.is-portrait .film-backdrop{
  background:#031728!important;
}
.film-scene.is-portrait .film-backdrop{
  background-image:none!important;
  filter:none!important;
  transform:none!important;
}
.film-scene.is-portrait .film-stage::after{
  background:none;
}
/* In desktop landscape, maintain the text rail from landscape.css without a
   dark duplicated portrait behind the media area. */
@media (min-width:1100px) and (min-aspect-ratio:13/10) and (pointer:fine){
 .film-scene.is-portrait .film-stage::after{
   background:linear-gradient(90deg,transparent 0%,transparent 73.5%,#031728 74.5%,#031728 100%);
 }
}
/* The film itself remains an ordinary player; do not add a virtual mode. */

/* Match the photographed story's desktop nav geometry exactly. */
@media (min-width:1100px) and (min-aspect-ratio:13/10) and (pointer:fine) {
 .film-journey-head {padding:16px 20px}
}
html[dir="rtl"] .film-journey-head #film-language {max-width:92px}