/* The film remains pinned; each chapter's words have their own natural, scrollable flow.
   No type shrinking or height assumption: zoom, short screens and long copy keep every word reachable. */
.film-chapter-nav { display:none; }
.phone .header .sound, .phone .header .brand, .phone .header .brand-seat { min-width:44px; min-height:44px; }
.phone .header .plain-toggle { min-height:44px; padding:8px; }
.phone .header .plain-toggle-label { display:inline!important; font-size:10px!important; letter-spacing:0!important; }
.phone .header .plain-toggle-track { display:none; }
.phone .header .cta.header-apply { min-height:44px; padding:10px 14px; }
.phone .layer-stations { background:linear-gradient(90deg,#090b12b8,#090b1280 75%,#090b1255); }
.phone .stop {
  inset:var(--film-header,88px) 0 80px; padding:18px 6vw 24px;
  overflow-y:auto; overflow-x:hidden; scrollbar-width:thin;
}
.phone .layer.is-active .stop.is-on { pointer-events:auto; }
.phone .stop .stop-copy, .phone .stop[data-side="right"] .stop-copy,
.phone .stop-video .stop-copy {
  position:relative; inset:auto; width:auto!important; max-width:none; transform:none;
}
.phone .stop h2 { font-size:clamp(1.5rem,6vw,2rem); line-height:1.2; text-wrap:balance; }
.phone .stop p { font-size:1rem; line-height:1.7; }
.phone .stop-facts { grid-template-columns:1fr; gap:.6rem; }
.phone .stop-facts li { font-size:.95rem; line-height:1.6; }
.phone .stop:has(.nodes) { display:flex; flex-direction:column; }
.phone .stop:has(.nodes) > * { flex-shrink:0; }
.phone .stop .nodes { position:relative; inset:auto; order:-1; gap:12px; margin:0 0 24px; display:flex; flex-wrap:wrap; }
.phone .stop .node { left:auto!important; top:auto!important; width:76px; height:72px; margin:0; }
.phone .stop .node-panel { width:100px; }
.phone .stop .node .node-card, .phone .stop[data-labels] .node .node-card {
  top:auto; bottom:0; left:50%; right:auto; width:100%; transform:translateX(-50%);
}
.phone .node .node-card b { font-size:.68rem; line-height:1.4; letter-spacing:.05em; }
.phone .stop .trunk-panel { max-height:none; overflow:visible; }
.phone .stop > .bough-side { position:relative; inset:auto; width:auto; }
.phone .panel-row { min-height:48px; padding:12px 2px; }
.phone .unfold-back { min-height:44px; padding:12px 6px; }
.phone .stop .cta { min-height:48px; white-space:normal; text-align:center; }
.phone .stop-panel { position:relative; inset:auto; width:100%; transform:none; margin:24px 0 0; }
.phone .stop .lantern-head { position:relative; inset:auto; width:auto; transform:none; text-align:left; margin-bottom:24px; }
.phone .stop .lanterns { position:relative; inset:auto; max-height:none; overflow:visible; display:flex; flex-direction:column; gap:24px; }
.phone .lantern { flex-shrink:0; min-width:0; }
.phone .lantern-side { min-width:0; }
.phone .lantern-card h3 { font-size:1.2rem; line-height:1.3; }
.phone .lantern-card p { font-size:1rem; line-height:1.7; margin-top:8px; }
.phone .film-chapter-nav:not([hidden]) {
  position:absolute; display:flex; align-items:center; justify-content:space-between;
  inset:auto 12px 12px; z-index:8; gap:8px; padding:5px;
  border:1px solid #c8b8db33; border-radius:12px; background:#090b12ed;
}
.film-chapter-nav button { min-width:60px; min-height:44px; padding:8px 12px; border:0; border-radius:7px; background:#c8b8db12; cursor:pointer; font-size:.8rem; }
.film-chapter-nav span { font-size:.7rem; line-height:1.4; text-align:center; color:var(--mist); }
.film-chapter-nav button:focus-visible { outline:2px solid var(--mist); outline-offset:2px; }
.phone .cstop-copy { top:var(--film-header,88px); left:6vw; right:6vw; }
.phone .cstop-copy h2 { font-size:1.5rem; }
.phone .cstop-copy h2 + p { font-size:.95rem; line-height:1.5; margin-top:8px; }
.phone .card {
  top:calc((var(--film-header,88px) + var(--carousel-copy-height,150px) + 100% - 144px) / 2);
  width:min(84vw,calc((100dvh - var(--film-header,88px) - var(--carousel-copy-height,150px) - 170px) * 1.6));
}
.phone .carousel-nav, .phone .carousel-nav:focus-visible {
  width:auto; height:auto; min-height:44px; min-width:100px; padding:8px 12px; clip:auto; overflow:visible;
  bottom:86px; left:6vw; transform:none; background:#090b12ed; color:var(--ivory); border:1px solid var(--hair); border-radius:8px;
}
.phone .carousel-nav[data-dir="1"] { left:auto; right:6vw; }
.phone .beat-finale { top:var(--film-header,88px); bottom:84px; padding-top:24px; overflow:auto; }
.phone .finale-actions { display:flex; flex-wrap:wrap; gap:12px; }
.phone .finale-actions a { min-height:48px; }
.film-detail {
  position:fixed; inset:max(12px,env(safe-area-inset-top)) 12px auto;
  width:calc(100% - 24px); max-width:600px; max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));
  margin:0 auto; padding:12px; overflow-y:auto; overscroll-behavior:contain;
  border:1px solid #8fa3ff66; border-radius:16px; background:#0c0c1c; color:var(--ivory);
  box-shadow:0 24px 80px #000b;
}
.film-detail::backdrop { background:#050507d9; }
body:has(.film-detail[open]) { overflow:hidden; }
.film-detail > .callout-close {
  position:sticky; top:0; margin-left:auto; z-index:5; width:88px; min-height:44px;
  display:flex; gap:8px; border-radius:8px; background:#1c1c32; color:var(--ivory); font-size:.85rem;
}
.phone .film-detail .callout.callout-card {
  position:relative; inset:auto; max-height:none; max-width:none; width:100%; margin:12px 0 0;
  padding-left:12px; padding-right:12px; overflow:visible; border:0; border-radius:0;
  background:#0c0c1c; box-shadow:none; animation:none;
}
.film-detail .callout p, .film-detail .callout li { font-size:1rem; line-height:1.7; }
@media (max-height:500px) {
  .phone .beat-hero { top:var(--film-header,88px); bottom:12px; display:block; overflow:auto; padding-block:12px; }
  .phone .hero-actions { flex-direction:row; flex-wrap:wrap; }
  .phone .hero-lower { margin-top:20px; }
}
@media (max-height:500px) and (min-width:600px) {
  .phone .cstop-copy { right:52%; }
  .phone .card { left:75%; top:calc(50% - 12px); width:min(42vw,calc((100dvh - 240px) * 1.6)); }
  .phone .card:not([data-slot="0"]) { visibility:hidden; }
}
