body:has(#arrival:not([hidden])) .masthead{display:none}
body:has(#arrival:not([hidden])) main{max-width:none;padding:0}
body:has(#arrival:not([hidden])){overflow:hidden;overscroll-behavior:none}
.arrival-scene{position:fixed;inset:0 0 auto;height:calc(var(--app-height,100svh) - var(--console-height));background:#132437;overflow:hidden;isolation:isolate;color:#fff0c1}
.arrival-heading{display:none}
.arrival-viewport{position:absolute;top:0;bottom:30px;left:0;right:0;overflow:hidden;background:linear-gradient(#1e3f60,#6d97b3);touch-action:none}
.arrival-world{position:absolute;left:0;top:0;will-change:transform;background:#293c4b}
.arrival-hero{position:absolute;width:auto;aspect-ratio:1;transform:translate(-50%,-100%) scale(var(--depth-scale,1));transform-origin:50% 100%;z-index:4;pointer-events:none;will-change:left,top,opacity}
.arrival-sprite{position:absolute;inset:0;width:100%;height:100%;display:block;transform-origin:50% 100%;filter:drop-shadow(1px 2px 1px #0005)}
.arrival-doors{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.arrival-footer{position:absolute;left:0;right:0;bottom:0;height:30px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left));background:#102235;border-top:2px solid #b08748;font-size:clamp(9px,1.1vw,13px);z-index:5}.arrival-floor{font-size:10px;color:#e5c37c;white-space:nowrap}.arrival-status{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700}
.arrival-scene[data-phase="inside"] .arrival-status{color:#f7d578}
@media(max-height:480px){.arrival-viewport{top:0;bottom:23px}.arrival-footer{height:23px;font-size:9px}.arrival-floor{font-size:8px}}

.arrival-floor-art{position:absolute;left:0;width:100%;height:20%;background-image:url('./arrival-floors.png');background-repeat:no-repeat}


.arrival-building-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.arrival-door-target{position:absolute;z-index:3;background:transparent;border:0;padding:0;box-shadow:none;border-radius:0;color:transparent;cursor:pointer;touch-action:none}
.arrival-door-target:focus-visible{outline:3px solid #ffe184;outline-offset:-3px;background:#ffe18422}
.arrival-target{position:absolute;z-index:5;width:18px;height:8px;border:2px solid #ffe28a;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 10px #ffda67;pointer-events:none}
.arrival-target[hidden]{display:none}
.arrival-scene[data-phase="navigation"] .arrival-viewport{cursor:pointer}
.arrival-scene[data-phase="navigation"] .arrival-viewport:active{cursor:pointer}

.ambient-people{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}.ambient-people[hidden]{display:none}
/* Hit areas remain invisible after a touch; the generic button hover style must not cover doors. */
.arrival-door-target:hover,.arrival-door-target:active{background:transparent;transform:none;border:0;box-shadow:none}
.player-beacon{position:absolute;z-index:8;top:-9%;left:50%;width:12%;height:9%;min-width:9px;max-width:17px;transform:translateX(-50%);background:#ffe69a;clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 1px 2px #182637);animation:player-beacon-float 2s ease-in-out infinite;opacity:.85;pointer-events:none}
@keyframes player-beacon-float{0%,100%{transform:translate(-50%,0);opacity:.72}50%{transform:translate(-50%,-4px);opacity:1}}
.arrival-hero.in-cabin .player-beacon{display:none}.arrival-hero.reduced-motion .player-beacon{animation:none;opacity:.9}
@media(prefers-reduced-motion:reduce){.player-beacon{animation:none}}

.player-beacon{width:16px;height:12px;min-width:16px;max-width:16px;top:-12%;background:none;clip-path:none;filter:none}.player-beacon svg{display:block;width:100%;height:100%}

.player-beacon::after{content:"";position:absolute;inset:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:11px solid #ffe69a;filter:drop-shadow(0 1px 1px #102235)}.player-beacon svg{display:none}

/* Corridors use all available space above the permanent television console. */
.arrival-footer{display:none}
.arrival-viewport{top:0;bottom:0}
/* The lift directory mirrors the four door columns in the building. */
.elevator-directory {
 position:absolute;
 inset:0;
 z-index:10;
 display:flex;
 flex-direction:column;
 gap:4px;
 padding:5px max(7px,env(safe-area-inset-right)) 6px max(7px,env(safe-area-inset-left));
 border:4px solid #a14c26;
 border-color:#e18b4b #87381e #87381e #e18b4b;
 clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);
 background:#140e16;
 box-shadow:inset 0 0 0 2px #ed9852,inset 0 0 0 4px #57231d,inset 0 0 0 5px #a14c26;
 font-family:ZuvTV Pixel,monospace;
}
.elevator-directory[hidden]{display:none}
body:has(.elevator-directory:not([hidden])) .language-settings-trigger{display:none}
.directory-heading {
 position:relative;
 display:grid;
 grid-template-columns:1fr auto 1fr;
 align-items:center;
 gap:5px;
 padding:2px 5px;
 background:repeating-linear-gradient(#192c4e 0 2px,#1c3155 2px 4px);
 border:2px solid #ba6636;
 box-shadow:inset 0 0 0 1px #070f21;
}
.directory-heading h2 {
 grid-column:2;
 margin:0;
 padding:0 8px;
 background:#101d36;
 color:#ffda86;
 font-family:ZuvTV Pixel,monospace;
 font-size:clamp(13px,2.7vw,38px);
 line-height:1;
 text-align:center;
 text-shadow:2px 2px #492619;
}
.directory-close {
 justify-self:end;
 min-height:32px;
 padding:2px 6px;
 border:2px solid #8e421d;
 border-radius:0;
 background:#ffca6d;
 box-shadow:inset 0 2px #fff0af,inset 0 -2px #d78939;
 color:#211016;
 font:700 clamp(11px,1.5vw,20px)/1.1 ZuvTV Pixel,monospace;
 white-space:nowrap;
}
.directory-list {
 position:relative;
 display:grid;
 grid-template-rows:repeat(13,minmax(26px,1fr));
 gap:2px;
 flex:1;
 min-height:0;
 overflow:auto;
 overscroll-behavior:contain;
 touch-action:pan-y;
 scrollbar-width:thin;
 scrollbar-color:#c98341 #1c1723;
}
.directory-row {
 display:grid;
 grid-template-columns:clamp(31px,5.2vw,76px) minmax(0,1fr);
 gap:4px;
 min-height:0;
}
.directory-floor-badge,.directory-stop,.directory-cell {
 box-shadow:inset 0 2px #ffffff40,inset 0 -2px #0003;
}
.directory-floor-badge {
 position:relative;
 display:grid;
 place-items:center;
 background:#fbbb53;
 color:#26141a;
 font-size:clamp(13px,2vw,29px);
 font-weight:700;
}
.directory-here .directory-floor-badge{background:#302018;color:#ffd278}
.directory-here .directory-floor-badge::before {
 content:"";
 position:absolute;
 left:2px;
 width:clamp(5px,1vw,13px);
 height:65%;
 background:#ffd278;
 clip-path:polygon(0 0,100% 50%,0 100%);
}
.directory-stops {
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr)) clamp(9px,3vw,42px) repeat(2,minmax(0,1fr));
 grid-template-rows:minmax(0,1fr);
 gap:4px;
 min-height:0;
}
.directory-cell{display:flex;min-width:0;min-height:0;background:#747e98}
.directory-shaft {
 background:linear-gradient(90deg,#085d94 0 10%,#52dafa 10% 20%,#c3faff 20% 35%,#24abd8 35% 45%,#102840 45% 55%,#24abd8 55% 65%,#c3faff 65% 80%,#52dafa 80% 90%,#085d94 90%);
 box-shadow:inset 0 2px #ccf9ff88,inset 0 -2px #06486e;
}
.directory-stop {
 flex:1;
 min-width:0;
 min-height:0;
 margin:0;
 padding:1px clamp(4px,.85vw,12px);
 border:0;
 border-radius:0;
 background:#ede1d0;
 color:#150f17;
 font:700 clamp(11px,1.7vw,24px)/1 ZuvTV Pixel,monospace;
 text-align:left;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.directory-stop[data-chain="0"]{background:#ff534c}
.directory-stop[data-chain="1"]{background:#77d746}
.directory-stop[data-chain="2"]{background:#69ccee}
.directory-stop:hover,.directory-close:hover{filter:brightness(1.12)}
.directory-stop:active,.directory-close:active{filter:brightness(.88);transform:none}
.directory-list:focus-visible,.directory-stop:focus-visible,.directory-close:focus-visible {
 outline:2px solid #fff0ac;
 outline-offset:-2px;
}
@media(max-height:520px){
 .directory-list{grid-template-rows:repeat(13,minmax(30px,1fr))}
}

.night-fade{position:fixed;inset:0;background:#030609;opacity:0;z-index:150;pointer-events:none}.night-fade.active{pointer-events:auto}

.arrival-viewport{background:linear-gradient(#2484e3,#8acdfa)}
.arrival-viewport.city-night{background:linear-gradient(#081239,#223b72)}
.arrival-city{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;image-rendering:pixelated}
.city-night .arrival-city{filter:brightness(.55) saturate(1.35) hue-rotate(14deg)}
.arrival-building-art,.arrival-doors,.arrival-roof{image-rendering:pixelated}
.arrival-roof{position:absolute;left:0;bottom:100%;width:100%;height:auto;pointer-events:none}
.arrival-room-preview{position:absolute;z-index:9;display:flex;align-items:center;gap:9px;max-width:calc(100% - 10px);padding:6px;border:2px solid #e5bb59;background:#101c38;color:#fff2be;box-shadow:0 3px 0 #050913;font-size:clamp(11px,2vw,19px);user-select:none}
.arrival-room-preview[hidden]{display:none}
.arrival-room-preview canvas{width:clamp(42px,8vw,88px);aspect-ratio:1.5;object-fit:cover;border:1px solid #e5bb59;image-rendering:pixelated}
.arrival-room-preview button{flex:none;background:#f5bc40;color:#241706;border:2px solid #ffdf88;border-radius:3px;padding:6px 12px;min-height:44px;font:inherit;font-weight:900}
.arrival-room-preview .preview-over{background:#fff1ad}
.arrival-city{mask-image:linear-gradient(transparent,#000 12%)}
.arrival-viewport,.arrival-door-target{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}

.city-night .arrival-roof{filter:none}
.arrival-roof{left:-9.242%;width:118.484%;height:var(--arrival-roof-height)}
.arrival-viewport.city-roof{background:linear-gradient(#2087ea,#3a97eb var(--roof-sky-line),#8acdfa)}
.arrival-viewport.city-roof.city-night{background:linear-gradient(#13528f,#245b92 var(--roof-sky-line),#223b72)}

/* Mediterranean production modules: fixed four-floor viewport, scenery behind facade. */
.arrival-roof{left:0;width:100%;height:var(--arrival-roof-height)}
.arrival-city{object-fit:cover;object-position:center bottom;mask-image:linear-gradient(transparent,#000 12%)}
.arrival-world{background:transparent}

/* Barcelona panorama remains visible behind every floor, including the roof. */
.arrival-city{object-fit:fill;mask-image:none;transform:none}

/* Vertical parallax follows continuous elevator position; cover preserves skyline proportions. */
.arrival-city{object-fit:cover;object-position:center center;will-change:transform}
