/* Keep the approved aperture and tower geometry. */
.screen.has-intro video,.screen video { object-fit:cover; transform:none; animation:none; filter:none; }
.screen .screen-intro { display:none; }
.screen .screen-brand { opacity:0; }
body.phone-video-fallback .screen video { opacity:1; }
.film-tools { position:fixed; top:7.7rem; right:clamp(1rem,4vw,4rem); z-index:5; display:grid; grid-template-columns:auto 44px auto; gap:.3rem; align-items:center; }
.film-sound-hint { grid-column:1 / -1; margin:0; color:#fff0ce; font:400 11px/1.4 Arial,sans-serif; text-shadow:0 1px 5px #000; }
.film-sound-hint[hidden] { display:none; }
.film-tools button { min-height:44px; border:1px solid #d7b46b80; border-radius:3px; background:#061722eb; color:#fff0ce; cursor:pointer; padding:.55rem .8rem; font:600 11px/1.3 Arial,sans-serif; letter-spacing:.02em; }
.film-tools button:hover { background:#20333f; border-color:#efc780; }
.film-tools button:focus-visible,.film-cinema-actions button:focus-visible,.film-cinema-actions a:focus-visible { outline:3px solid #f5d698; outline-offset:3px; }
.film-tools small { display:block; font-size:10px; font-weight:400; color:#d7e3e7; }
.film-tools [data-film-toggle] { min-width:44px; font-size:16px; }
.cinema { display:block; width:100%; height:100dvh; max-width:100%; max-height:100dvh; padding:16px; border:0; margin:0; box-sizing:border-box; z-index:30; overflow:auto; background:#020a10f7; }
.cinema::backdrop { background:#010608f2; }
.cinema .cinema-stage { width:min(1180px,100%); min-width:0; margin:0 auto; animation:none; }
.cinema .cinema-stage::after { display:none; }
.cinema-frame { width:min(100%,calc(55dvh * 2.16216)); margin:0 auto; background:#02080d; aspect-ratio:1280/592; clear:both; }
.cinema .cinema-stage video { aspect-ratio:1280/592; object-fit:contain; border:0; border-radius:0; box-shadow:0 0 0 1px #c09b5b80,0 20px 100px #000; }
.cinema .cinema-close { position:relative; float:right; top:auto; right:auto; width:44px; height:44px; margin-bottom:8px; font-size:24px; }
.film-cinema-actions { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.6rem; margin-top:1.2rem; }
.film-cinema-actions button,.film-cinema-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.5rem .85rem; border:1px solid #a88a5480; border-radius:3px; background:#0a1c26; color:#fff1d0; font:600 13px/1.3 Arial,sans-serif; text-decoration:none; cursor:pointer; }
.film-cinema-actions [data-visit] { background:#ead19b; border-color:#ead19b; color:#14212a; }
.cinema .cinema-label { margin:.6rem 0 0; font:500 15px/1.6 Georgia,serif; }
.cinema .cinema-label span { font-size:11px; }
.film-status { min-height:1.6em; margin:.5rem 0 0; color:#dfe9ed; text-align:center; font:400 13px/1.5 Arial,sans-serif; }
.film-status:empty { display:none; }
.film-notice { color:#c3ccd2; text-align:center; font:400 11px/1.6 Arial,sans-serif; margin:.75rem auto 0; max-width:44rem; }
.film-transcript { max-width:56rem; margin:2rem auto 0; padding:1rem; border-top:1px solid #d5b77b70; color:#fff4df; font:400 16px/1.7 Arial,sans-serif; }
.film-transcript summary { cursor:pointer; min-height:44px; }
.film-transcript ol { padding-left:1.5rem; }
.film-transcript li { margin:.8rem 0; }
.broadcast-endcard {
 opacity:0; transform:scale(.985); transition:opacity .9s ease,transform 1.1s ease;
 background:radial-gradient(circle at 50% 20%,rgba(43,105,131,.72),transparent 58%),linear-gradient(145deg,#020b13fa,#092231f7);
 box-shadow:inset 0 0 0 1px rgba(237,200,126,.32),inset 0 0 28px #000b;
}
.broadcast-endcard.broadcast-visible { opacity:1; transform:none; }
.broadcast-endcard .broadcast-endcard-copy { color:#c9dce3; font:700 clamp(7px,1.75cqw,10px)/1.2 Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.broadcast-endcard button { border-top-color:#e2bd77aa; color:#ffeac0; font-weight:600; }
.screen.broadcast-ready { box-shadow:inset 0 0 0 1px rgba(237,200,126,.4),0 0 28px rgba(97,212,242,.2); }
.cinema.broadcast-playing .cinema-frame { width:min(1480px,100%); max-height:none; aspect-ratio:auto; min-height:calc(100dvh - 150px); border:1px solid rgba(229,184,94,.46); background:#02080d; box-shadow:0 20px 100px #000; }
.cinema.broadcast-playing .cinema-frame iframe { display:block; width:100%; height:calc(100dvh - 150px); min-height:620px; border:0; background:#02080d; }
.cinema.broadcast-playing .cinema-label,.cinema.broadcast-playing .film-status,.cinema.broadcast-playing .film-notice { display:none; }
.cinema.broadcast-playing .film-cinema-actions { margin-top:.55rem; }
.cinema.broadcast-playing [data-film-sound],.cinema.broadcast-playing [data-visit] { display:none; }
.cinema.broadcast-playing [data-film-replay]::after { content:'\00a0the film'; }
.patio-foreground { display:none; }
@media(min-width:701px) {
 .arrival-summary { width:min(24rem,calc(46vw - min(22.022vw,227.37px) - 1rem)); }
}
@media(max-width:700px) {
 /* The phone first-view should explain Lighthouse before the visitor reaches the tower. */
 .harbor { --phone-tower-width:min(96vw,490px); grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto auto auto; align-items:start; justify-items:center; height:auto; min-height:100svh; padding-top:1rem; row-gap:.55rem; align-content:start; background:#061521 url('/assets/lighthouse-harbor-mobile-clean.webp') center top / cover scroll no-repeat; }
 body.orientation-playing .harbor { --phone-tower-width:min(126vw,620px); }
 .harbor.harbor-live-ready { background:#061521 url('/assets/lighthouse-harbor-mobile-clean.webp') center top / cover scroll no-repeat; }
 .harbor-live-scene,.harbor-live-life { display:none!important; }
 .harbor::before,.harbor::after { position:absolute; inset:0; }
 .harbor::after { background:linear-gradient(180deg,rgba(1,8,13,.10),transparent 36%,rgba(39,20,6,.02) 54%,rgba(232,179,103,.16) 82%,rgba(255,220,157,.20)),radial-gradient(ellipse at 50% 87%,rgba(255,223,171,.22),rgba(190,128,65,.14) 32%,transparent 66%); }
 .harbor > .brand { position:relative; inset:auto; transform:none; width:min(14rem,64vw); grid-area:1 / 1; margin-bottom:.08rem; }
 .film-tools { position:relative; inset:auto; box-sizing:border-box; width:calc(100% - 1.5rem); max-width:26rem; grid-template-columns:minmax(0,1fr) 44px minmax(0,5.7rem); gap:.35rem; margin:0 auto; grid-area:2 / 1; }
 .harbor > .arrival-summary { position:relative; inset:auto; box-sizing:border-box; grid-area:3 / 1; align-self:start; margin:.1rem auto .45rem; width:calc(100% - 1.5rem); max-width:26rem; transform:none; overflow:hidden; }
 .harbor > .arrival-summary { backdrop-filter:none; }
 .harbor > .lighthouse-stage { grid-area:4 / 1; }
 .lighthouse-stage > .stage-artwork { position:relative; z-index:2; }
 .patio-foreground { --patio-width:min(100vw,520px); position:absolute; z-index:1; left:50%; bottom:-.2%; display:block; width:var(--patio-width); height:36%; transform:translateX(-50%); pointer-events:none; background:url('/assets/lighthouse-harbor-mobile-clean.webp') center bottom / 100% auto no-repeat; -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 100%),linear-gradient(90deg,#000 0,#000 18%,transparent 32%,transparent 68%,#000 82%,#000 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 100%),linear-gradient(90deg,#000 0,#000 18%,transparent 32%,transparent 68%,#000 82%,#000 100%); mask-composite:intersect; }
 .film-tools button { min-width:0; max-width:100%; font-size:12px; padding:.45rem .5rem; overflow-wrap:anywhere; }
 .film-sound-hint { text-align:center; }
 .film-tools [data-film-toggle] { font-size:14px; }
 .cinema { padding:12px; }
 .cinema .cinema-stage { width:100%; }
 .film-cinema-actions { gap:.4rem; margin-top:.9rem; }
 .film-cinema-actions button,.film-cinema-actions a { font-size:12px; padding:.45rem .65rem; }
 .cinema .cinema-label { font-size:13px; }
 .cinema.broadcast-playing { padding:8px; }
 .cinema.broadcast-playing .cinema-frame,.cinema.broadcast-playing .cinema-frame iframe { min-height:calc(100dvh - 112px); height:calc(100dvh - 112px); }
}
@media(prefers-reduced-motion:reduce) { .cinema { transition:none; } }


html.force-phone-view body { background:#02070c; }
html.force-phone-view .harbor { width:min(100vw,430px); height:auto; min-height:100svh; margin:0 auto; --phone-tower-width:min(96vw,490px); grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto auto auto; align-items:start; justify-items:center; padding-top:1rem; row-gap:.55rem; align-content:start; overflow:hidden; background:#061521 url('/assets/lighthouse-harbor-mobile-clean.webp') center top / cover scroll no-repeat; }
html.force-phone-view .harbor.harbor-live-ready { background:#061521 url('/assets/lighthouse-harbor-mobile-clean.webp') center top / cover scroll no-repeat; }
html.force-phone-view .harbor-live-scene,html.force-phone-view .harbor-live-life { display:none!important; }
html.force-phone-view .harbor::after { background:linear-gradient(180deg,rgba(1,8,13,.10),transparent 36%,rgba(39,20,6,.02) 54%,rgba(232,179,103,.16) 82%,rgba(255,220,157,.20)),radial-gradient(ellipse at 50% 87%,rgba(255,223,171,.22),rgba(190,128,65,.14) 32%,transparent 66%); }
html.force-phone-view .harbor::before,html.force-phone-view .harbor::after { position:absolute; inset:0; }
html.force-phone-view .harbor::before { background:radial-gradient(circle at 50% 28%,rgba(87,140,168,.14),transparent 48%); }
html.force-phone-view .harbor::after { background:linear-gradient(180deg,rgba(1,8,13,.12),transparent 48%,rgba(1,8,13,.04)); }
html.force-phone-view .brand { position:relative; inset:auto; transform:none; transform-origin:top left; width:min(14rem,64vw); grid-area:1 / 1; margin-bottom:.08rem; }
html.force-phone-view .arrival-note { display:none; }
html.force-phone-view .home { left:1rem; bottom:1rem; font-size:.49rem; }
html.force-phone-view .film-tools { position:relative; inset:auto; box-sizing:border-box; width:calc(100% - 1.5rem); max-width:26rem; grid-template-columns:minmax(0,1fr) 44px minmax(0,5.7rem); gap:.35rem; margin:0 auto; grid-area:2 / 1; }
html.force-phone-view .film-tools button { min-width:0; max-width:100%; font-size:12px; padding:.45rem .5rem; overflow-wrap:anywhere; }
html.force-phone-view .film-tools [data-film-toggle] { font-size:14px; }
html.force-phone-view .film-sound-hint { text-align:center; }
html.force-phone-view .harbor > .arrival-summary { position:relative; z-index:3; left:auto; right:auto; top:auto; bottom:auto; box-sizing:border-box; grid-area:3 / 1; align-self:start; margin:.1rem auto .45rem; width:calc(100% - 1.5rem); max-width:26rem; transform:none; overflow:hidden; border-left:0; border-top:1px solid rgba(229,184,94,.68); border-bottom:1px solid rgba(117,223,255,.22); background:linear-gradient(135deg,rgba(2,14,24,.9),rgba(6,31,47,.7)); box-shadow:0 1rem 2.4rem rgba(0,0,0,.28); backdrop-filter:none; }
html.force-phone-view .harbor > .arrival-summary span { margin-bottom:.32rem; font-size:.52rem; letter-spacing:.15em; }
html.force-phone-view .harbor > .arrival-summary p { font:600 .91rem/1.34 Georgia,serif; }
html.force-phone-view .harbor > .arrival-summary ul { display:grid; grid-template-columns:1fr; gap:.31rem; margin:.66rem 0 0; font-size:.58rem; line-height:1.34; letter-spacing:.045em; }
html.force-phone-view .harbor > .arrival-summary li:nth-child(n) { display:list-item; }
html.force-phone-view .harbor > .arrival-summary li::before { margin-right:.32rem; }
html.force-phone-view .harbor > .arrival-summary,html.force-phone-view .harbor > .arrival-summary * { min-width:0; max-width:100%; }
html.force-phone-view .harbor > .arrival-summary .plain-help { margin-top:.66rem; font-size:.7rem; line-height:1.35; }
html.force-phone-view .harbor > .arrival-summary .arrival-summary-actions { display:grid; grid-template-columns:1fr; gap:.52rem; margin-top:.72rem; }
html.force-phone-view .harbor > .arrival-summary .arrival-summary-actions button { min-width:0; width:100%; min-height:46px; padding:.58rem .4rem; font-size:.54rem; letter-spacing:.08em; white-space:normal; overflow-wrap:anywhere; }
html.force-phone-view .harbor > .lighthouse-stage { grid-area:4 / 1; width:min(94vw,480px); min-width:0; margin-top:.2rem; translate:none; }
html.force-phone-view .lighthouse-stage > .stage-artwork { position:relative; z-index:2; }
html.force-phone-view .patio-foreground { --patio-width:min(100vw,520px); position:absolute; z-index:1; left:50%; bottom:-.2%; display:block; width:var(--patio-width); height:36%; transform:translateX(-50%); pointer-events:none; background:url('/assets/lighthouse-harbor-mobile-clean.webp') center bottom / 100% auto no-repeat; -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 100%),linear-gradient(90deg,#000 0,#000 18%,transparent 32%,transparent 68%,#000 82%,#000 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 100%),linear-gradient(90deg,#000 0,#000 18%,transparent 32%,transparent 68%,#000 82%,#000 100%); mask-composite:intersect; }
html.force-phone-view .stage-concierge { left:1rem; right:1rem; bottom:3.6rem; width:auto; }
html.force-phone-view .screen-guidance { gap:.42rem; padding:6%; }
html.force-phone-view .screen-guidance small { font-size:.45rem; }
html.force-phone-view .screen-guidance strong { font-size:clamp(1rem,5vw,1.3rem); line-height:1; }
html.force-phone-view .screen-guidance em { font-size:.43rem; }


/* 2026-10-08 mobile overlap guard: keep the film controls and front-desk card inside the visible phone screen. */
@media(max-width:700px) {
 .harbor { width:100vw; max-width:100vw; overflow-x:hidden; }
 .film-tools { justify-self:start; width:calc(100vw - 1.5rem); max-width:calc(100vw - 1.5rem); margin:0 .75rem; grid-template-columns:minmax(0,1fr) 44px; }
 .film-tools [data-film-sound] { grid-column:1 / -1; }
 .harbor > .arrival-summary { justify-self:start; width:calc(100vw - 1.5rem); max-width:calc(100vw - 1.5rem); margin:.1rem .75rem .45rem; }
 .harbor > .arrival-summary p,.harbor > .arrival-summary li,.harbor > .arrival-summary .plain-help,.harbor > .arrival-summary span,.harbor > .arrival-summary strong { overflow-wrap:break-word; }
 .harbor > .arrival-summary .arrival-summary-actions { grid-template-columns:1fr; }
 .harbor > .arrival-summary .arrival-summary-actions button { white-space:normal; }
}
html.force-phone-view .harbor { width:100vw; max-width:100vw; overflow-x:hidden; }
html.force-phone-view .film-tools { justify-self:start; width:calc(100vw - 1.5rem); max-width:calc(100vw - 1.5rem); margin:0 .75rem; grid-template-columns:minmax(0,1fr) 44px; }
html.force-phone-view .film-tools [data-film-sound] { grid-column:1 / -1; }
html.force-phone-view .harbor > .arrival-summary { justify-self:start; width:calc(100vw - 1.5rem); max-width:calc(100vw - 1.5rem); margin:.1rem .75rem .45rem; }
html.force-phone-view .harbor > .arrival-summary p,html.force-phone-view .harbor > .arrival-summary li,html.force-phone-view .harbor > .arrival-summary .plain-help,html.force-phone-view .harbor > .arrival-summary span,html.force-phone-view .harbor > .arrival-summary strong { overflow-wrap:break-word; }

/* 2026-10-09 phone home clarity: keep the Lighthouse story, but make the first phone screen read like a simple front desk. */
@media(max-width:700px) {
 .harbor {
  grid-template-rows:auto auto auto auto;
  row-gap:.48rem;
 }
 .harbor > .brand {
  display:grid!important;
  justify-items:center;
  width:min(18.2rem,84vw);
  max-width:calc(100vw - 2rem);
  margin:.1rem auto .02rem;
  text-align:center;
 }
 .harbor > .brand strong {
  white-space:nowrap;
  font-size:clamp(2rem,9.1vw,2.35rem);
  letter-spacing:-.07em;
 }
 .harbor > .brand small {
  display:block;
  width:min(14rem,72vw);
  font-size:.46rem;
  letter-spacing:.15em;
  white-space:normal;
 }
 .harbor > .arrival-summary {
  grid-area:2 / 1;
  margin:.08rem .75rem .2rem;
  border-top-width:2px;
  background:linear-gradient(135deg,rgba(2,14,24,.96),rgba(6,31,47,.9));
 }
 .harbor > .arrival-summary p {
  font:600 .92rem/1.32 Georgia,serif;
 }
 .harbor > .arrival-summary .phone-front-desk {
  display:block;
  margin:.58rem 0 0;
  padding:.62rem .68rem;
  border:1px solid rgba(117,223,255,.28);
  color:rgba(235,248,251,.95);
  background:rgba(4,28,43,.58);
  font:800 .68rem/1.34 Arial,sans-serif;
  letter-spacing:.01em;
  text-transform:none;
 }
 .harbor > .arrival-summary ul {
  gap:.28rem;
  margin:.58rem 0 0;
  font-size:.56rem;
  line-height:1.32;
 }
 .harbor > .arrival-summary .front-door-mini {
  gap:.42rem;
  margin-top:.7rem;
 }
 .harbor > .arrival-summary .front-door-mini a {
  min-height:46px;
  padding:.55rem .42rem;
  font-size:.54rem;
  letter-spacing:.065em;
 }
 .harbor > .arrival-summary .plain-help {
  margin-top:.72rem;
  font-size:.72rem;
  line-height:1.34;
 }
 .harbor > .arrival-summary .arrival-summary-actions button,
 .harbor > .arrival-summary .member-entry strong,
 .harbor > .arrival-summary .storage-customer-entry strong {
  min-height:48px;
 }
 .film-tools {
  grid-area:3 / 1;
  align-self:start;
  grid-template-columns:minmax(0,1fr) 44px minmax(0,4.8rem);
  margin:.05rem .75rem .15rem;
 }
 .film-tools button {
  min-height:42px;
  padding:.42rem .46rem;
  font-size:11px;
 }
 .film-tools [data-film-sound] {
  grid-column:auto;
 }
 .film-tools small {
  font-size:9px;
 }
 .harbor > .lighthouse-stage {
  grid-area:4 / 1;
 }
 .home {
  position:relative;
  left:auto;
  bottom:auto;
  z-index:3;
  grid-area:5 / 1;
  justify-self:start;
  margin:0 0 1rem .9rem;
 }
}

html.force-phone-view .harbor > .brand {
 display:grid!important;
 justify-items:center;
 width:min(18.2rem,84vw);
 max-width:calc(100vw - 2rem);
 margin:.1rem auto .02rem;
 text-align:center;
}
html.force-phone-view .harbor > .brand strong {
 white-space:nowrap;
 font-size:clamp(2rem,9.1vw,2.35rem);
 letter-spacing:-.07em;
}
html.force-phone-view .harbor > .brand small {
 display:block;
 width:min(14rem,72vw);
 font-size:.46rem;
 letter-spacing:.15em;
 white-space:normal;
}
html.force-phone-view .harbor > .arrival-summary {
 grid-area:2 / 1;
 margin:.08rem .75rem .2rem;
 border-top-width:2px;
 background:linear-gradient(135deg,rgba(2,14,24,.96),rgba(6,31,47,.9));
}
html.force-phone-view .harbor > .arrival-summary .phone-front-desk {
 display:block;
 margin:.58rem 0 0;
 padding:.62rem .68rem;
 border:1px solid rgba(117,223,255,.28);
 color:rgba(235,248,251,.95);
 background:rgba(4,28,43,.58);
 font:800 .68rem/1.34 Arial,sans-serif;
 letter-spacing:.01em;
 text-transform:none;
}
html.force-phone-view .harbor > .arrival-summary .front-door-mini a {
 min-height:46px;
 padding:.55rem .42rem;
 font-size:.54rem;
}
html.force-phone-view .film-tools {
 grid-area:3 / 1;
 grid-template-columns:minmax(0,1fr) 44px minmax(0,4.8rem);
 margin:.05rem .75rem .15rem;
}
html.force-phone-view .film-tools [data-film-sound] {
 grid-column:auto;
}