/* A short, optional foreground scene. The ordinary home is never hidden,
   scroll-locked, made inert, or dependent on these rules. */
.first-arrival,.first-arrival[hidden]{display:none!important}
html[data-arrival-pending] .first-arrival,
html[data-arrival-active] .first-arrival{display:block!important;position:fixed;inset:0;z-index:2000;isolation:isolate;overflow:hidden;background:#f5f0e7;color:#302723;animation:first-arrival-safety 3.2s steps(1,end) forwards}
.first-arrival-scenes,.first-arrival-scenes>img{position:absolute;inset:0;width:100%;height:100%}
.first-arrival-scenes{overflow:hidden}
.first-arrival-scenes>img{max-width:none;object-fit:cover;object-position:52% 43%;transform-origin:52% 43%}
.first-arrival-city{opacity:1}
.first-arrival-room{opacity:0}
.first-arrival-caption{position:absolute;left:clamp(20px,5vw,88px);top:clamp(90px,18vh,170px);max-width:min(540px,calc(100% - 40px));padding:clamp(22px,3.4vw,42px);background:#fffaf2f5;border:1px solid #d4c7b8;box-shadow:0 12px 50px #3027231a}
.first-arrival-caption .first-arrival-eyebrow{margin:0 0 13px;font-size:.75rem;letter-spacing:.14em;line-height:1.5;font-weight:600}
.first-arrival-caption h2{font-family:var(--serif,serif);font-size:clamp(1.9rem,4.4vw,3.5rem);font-weight:600;line-height:1.45;letter-spacing:.015em;text-wrap:balance;margin:0;overflow-wrap:normal}
.first-arrival-caption h2+p{font-size:1rem;line-height:1.8;margin:16px 0 0;max-width:27em}
.first-arrival-skip{position:absolute;right:max(18px,env(safe-area-inset-right));top:max(16px,env(safe-area-inset-top));display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:48px;max-width:calc(100% - 36px);padding:11px 20px;border:1px solid #a28972;background:#fffaf2;color:#302723;font-size:1rem;font-weight:700;line-height:1.5;box-shadow:0 3px 18px #3027231a;touch-action:manipulation}
.first-arrival-skip:focus-visible{outline:3px solid #8b4a20;outline-offset:4px}
.first-arrival-credit{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));max-width:calc(100% - 36px);background:#fffaf2ed;color:#554239;padding:5px 9px;margin:0;font-size:.75rem;line-height:1.6}
.first-arrival[data-arrival-phase=playing] .first-arrival-city{animation:first-arrival-approach 2.4s cubic-bezier(.25,.1,.4,1) both}
.first-arrival[data-arrival-phase=playing] .first-arrival-room{animation:first-arrival-room 2.4s ease both}
.first-arrival[data-arrival-phase=playing] .first-arrival-caption{animation:first-arrival-caption 2.4s ease both}
.first-arrival[data-arrival-phase=playing] .first-arrival-scenes{animation:first-arrival-open 2.4s ease both}
.first-arrival[data-arrival-phase=playing]{background:transparent}
@keyframes first-arrival-approach{0%,12%{transform:scale(1)}75%,100%{transform:scale(1.06)}}
@keyframes first-arrival-room{0%,40%{opacity:0;transform:scale(1)}65%,100%{opacity:1;transform:scale(1.025)}}
@keyframes first-arrival-caption{0%,38%{opacity:1}65%,100%{opacity:0}}
@keyframes first-arrival-open{0%,80%{opacity:1}100%{opacity:0}}
/* Last-resort CSS escape if a runtime exception prevents timer cleanup. */
@keyframes first-arrival-safety{to{visibility:hidden;pointer-events:none}}
html[lang=en] .first-arrival-caption h2{font-size:clamp(1.85rem,4.2vw,3.2rem);line-height:1.2;letter-spacing:-.015em;overflow-wrap:normal;word-break:normal;hyphens:none}
@media(max-width:600px){
 .first-arrival-caption{left:18px;top:100px;max-width:calc(100% - 36px);padding:22px}
 .first-arrival-caption h2{font-size:clamp(1.7rem,7vw,2.6rem)}
 .first-arrival-scenes>img{object-position:53% center;transform-origin:53% 44%}
 .first-arrival-caption h2+p{margin-top:12px}
}
@media(max-height:430px){
 .first-arrival-caption{top:76px;padding:14px 20px;max-width:min(520px,calc(100% - 36px))}
 .first-arrival-caption h2{font-size:1.7rem}
 .first-arrival-caption .first-arrival-eyebrow,.first-arrival-caption h2+p{display:none}
}
@media(prefers-reduced-motion:reduce){
 html[data-arrival-pending] .first-arrival,
 html[data-arrival-active] .first-arrival{display:none!important;animation:none}
 .first-arrival *{animation:none!important}
}

.first-arrival-caption h2>span{display:inline-block;max-inline-size:100%;overflow-wrap:anywhere}