/* M1.7: full-viewport Arven and explorable crossroads. */
.app-shell.scene-fullscreen,.app-shell.scene-fullscreen .main-shell{
  width:100%;height:100dvh;min-height:0!important;overflow:hidden
}
.app-shell.scene-fullscreen .content{
  width:100%;max-width:none!important;height:100%;min-height:0;
  padding:0!important;margin:0!important;overflow:hidden
}
.app-shell.scene-fullscreen .city-location,
.app-shell.scene-fullscreen .gate-location{
  position:relative;width:100%;height:100%;margin:0;overflow:hidden
}
.app-shell.scene-fullscreen .city-panorama,
.app-shell.scene-fullscreen .gate-panorama{
 position:absolute;inset:0;width:100%;height:100%!important;margin:0;
 border:0;border-radius:0;box-shadow:none;overflow:hidden
}
.app-shell.scene-fullscreen .city-panorama-art,
.app-shell.scene-fullscreen .gate-scene-art{
  width:100%;height:100%;inset:0;object-fit:fill
}
.city-panorama .location-heading,.gate-panorama .gate-overlay-heading{
 position:absolute;top:clamp(10px,2.5vh,23px);left:clamp(12px,2.2vw,32px);
 z-index:13;margin:0;padding:0;max-width:calc(100% - 95px);
 color:#fff;text-shadow:0 2px 9px #1b292cda;pointer-events:none
}
.city-panorama .location-heading h1,.gate-panorama .gate-overlay-heading h1{
 color:#fff;font-size:clamp(21px,3.1vw,42px);line-height:1.16;
 text-shadow:0 3px 11px #121d23da
}
.city-panorama .location-heading .location-crumb,
.gate-panorama .gate-overlay-heading .location-crumb{
 color:#e4f0f0;font-size:clamp(7px,.65vw,10px);
 text-shadow:0 2px 5px #11212b
}
.gate-overlay-heading small{display:block;color:#e8f0ec;font-size:11px;font-weight:650;margin-top:3px}
.city-panorama .location-status{
 position:absolute;top:0;left:100%;
 transform:translateX(20px);color:#173b32;background:#eff8f5e0;
 border:1px solid #cce8d9;padding:7px 9px;white-space:nowrap;font-size:10px;
 text-shadow:none;border-radius:10px
}
.city-overlay-vitals,.gate-overlay-vitals{
 position:absolute;top:clamp(82px,21vh,130px);left:clamp(12px,2.2vw,32px);
 z-index:13;width:min(57%,665px);min-width:240px;
 max-width:calc(100% - 105px);pointer-events:none
}
.city-overlay-vitals .adventure-hud,.gate-overlay-vitals .adventure-hud{
 display:grid;grid-template-columns:1fr 1fr;gap:9px;
 padding:9px 11px;margin:0;background:#e7f0efdc;
 backdrop-filter:blur(6px);border:1px solid #e8f2eeb0;border-radius:12px;
 box-shadow:0 6px 18px #1120275c
}
.city-overlay-vitals .quest-hint,.gate-overlay-vitals .quest-hint{display:none}
.city-overlay-vitals .adventure-resource>span,
.gate-overlay-vitals .adventure-resource>span{font-size:10px}
.city-overlay-vitals .adventure-resource-track,
.gate-overlay-vitals .adventure-resource-track{height:8px}
.city-panorama .city-poi{z-index:7}
.city-panorama .poi-gate{z-index:8}
.city-panorama .city-scene-label{display:none}
.scene-explorer{
 position:absolute;z-index:11;width:clamp(75px,10.5vw,138px);
 height:clamp(110px,27vh,220px);
 display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
 transform:translate(-50%,-78%);pointer-events:none;
 filter:drop-shadow(0 3px 8px #101d25ba)
}
.scene-explorer img{
 display:block;width:100%;height:100%;object-fit:contain;
 object-position:center bottom;transform-origin:50% 86%;
 filter:drop-shadow(0 7px 4px #10242c9f)
}
.scene-explorer-heading{
 position:absolute;bottom:96%;left:50%;transform:translateX(-50%);
 display:flex;flex-direction:column;align-items:center;gap:3px;
 min-width:clamp(95px,10vw,145px);padding:6px 8px;
 color:#f8fbfb;background:#22343ce8;border:1px solid #c0d2d1b0;
 border-radius:10px;text-align:center;backdrop-filter:blur(4px);
 box-shadow:0 4px 12px #0d1a2294
}
.scene-explorer-heading strong{font-size:clamp(9px,1vw,13px);white-space:nowrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.scene-explorer-heading>span{color:#dae5e4;font-size:clamp(8px,.8vw,10px)}
.scene-explorer-health{width:100%;height:6px;background:#142731;border-radius:100px;overflow:hidden}
.scene-explorer-health>span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#18b474,#2be49d)}
.scene-explorer-shadow{position:absolute;bottom:0;width:55%;height:11px;border-radius:50%;background:#101d2080;filter:blur(5px)}
.city-explorer{left:33%;top:88%;z-index:10}
.city-explorer img{animation:scene-idle 4s ease-in-out infinite}
.gate-explorer{z-index:12;will-change:left,top}
.gate-explorer.is-walking img{animation:scene-walk .32s ease-in-out infinite alternate}
.gate-explorer.facing-left img{transform:scaleX(-1)}
.gate-explorer.facing-left.is-walking img{animation:scene-walk-left .32s ease-in-out infinite alternate}
.gate-footprints{position:absolute;inset:0;z-index:5;pointer-events:none}
.gate-footprint{
 display:block;position:absolute;transform:translate(-50%,-50%) rotate(var(--step-angle,0deg));
 width:11px;height:17px;opacity:.6;
 background:radial-gradient(ellipse at 35% 28%,#2d4a41 0 32%,transparent 37%),
   radial-gradient(ellipse at 65% 73%,#2d4a41 0 30%,transparent 35%);
 filter:blur(.7px);animation:trail-fade 4s linear forwards
}
@keyframes scene-idle{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes scene-walk{from{transform:translateY(-4px) rotate(-3deg)}to{transform:translateY(2px) rotate(4deg)}}
@keyframes scene-walk-left{from{transform:translateY(-4px) scaleX(-1) rotate(-3deg)}to{transform:translateY(2px) scaleX(-1) rotate(4deg)}}
@keyframes trail-fade{0%{opacity:.65}45%{opacity:.4}100%{opacity:0}}
/* The landscape is rectangular as a viewport; walking is bounded by an irregular clearing polygon. */
.gate-panorama .gate-scene-art{filter:saturate(.93) contrast(1.03) brightness(.95)}
.gate-panorama::after{pointer-events:none}
.gate-panorama .gate-scene-haze{pointer-events:none}
.gate-panorama .gate-destination{
 position:absolute;z-index:10;
 display:flex;align-items:center;justify-content:center;
 width:clamp(54px,6vw,90px);height:clamp(65px,9vh,105px);
 min-height:0;padding:2px;max-width:none;
 background:transparent;border:0;border-radius:50%;box-shadow:none;
 transform:translate(-50%,-50%);color:#f7fafa;backdrop-filter:none;
 overflow:visible;pointer-events:auto
}
.gate-panorama .gate-destination:hover,
.gate-panorama .gate-destination:focus-visible{
 background:transparent;box-shadow:none;transform:translate(-50%,-50%) scale(1.06)
}
.gate-panorama .gate-destination-symbol{
 display:grid;place-items:center;flex:0 0 auto;width:45%;height:45%;
 border:1px solid #d3f1f2b8;border-radius:50%;font-size:clamp(21px,2.7vw,36px);
 color:#e5f7f7;background:#416878a6;box-shadow:0 0 19px #aad7e3ba,inset 0 0 13px #efffff8c;
 animation:portal-breathe 2.5s ease-in-out infinite
}
.gate-panorama .gate-portal-emerald .gate-destination-symbol{
 border-color:#bbefcf;color:#d6f8e3;background:#407159a6;box-shadow:0 0 22px #8ce9a8ac
}
.gate-panorama .gate-portal-violet .gate-destination-symbol{
 border-color:#d9c2fb;color:#f1dcff;background:#62527ea6;box-shadow:0 0 22px #d1b0faac
}
.gate-panorama .gate-destination-copy{
 position:absolute;left:50%;bottom:94%;z-index:12;
 display:flex;flex-direction:column;align-items:center;gap:4px;flex:none;
 transform:translate(-50%,7px);
 width:clamp(150px,16vw,215px);padding:8px 11px;
 background:#203239ef;border:1px solid #d7e7e7b4;border-radius:9px;
 color:#fff;text-align:center;box-shadow:0 6px 15px #0d20279e;
 opacity:0;visibility:hidden;pointer-events:none;
 transition:opacity .17s ease,transform .17s ease,visibility .17s ease
}
.gate-panorama .gate-destination.portal-nearby .gate-destination-copy,
.gate-panorama .gate-destination:focus-visible .gate-destination-copy{
 opacity:1;visibility:visible;transform:translate(-50%,0)
}
.gate-panorama .gate-destination-copy strong{font:750 clamp(11px,1.2vw,15px) Cinzel,Georgia,serif;line-height:1.2}
.gate-panorama .gate-destination-copy small{font-size:clamp(9px,.9vw,11px);color:#d5e6e7;line-height:1.3}
@keyframes portal-breathe{
 0%,100%{box-shadow:0 0 9px #cee9e6a3,inset 0 0 6px #fff8;transform:scale(.94)}
 50%{box-shadow:0 0 26px #d9efecdf,inset 0 0 18px #fff9;transform:scale(1.08)}
}
.gate-joystick{
 position:absolute;left:clamp(25px,5vw,90px);bottom:clamp(23px,7vh,70px);
 width:clamp(84px,11vw,123px);height:clamp(84px,11vw,123px);
 border-radius:50%;border:2px solid #e6eeed98;
 background:radial-gradient(circle,#e7f4ef3f,#2d464fbf);
 backdrop-filter:blur(4px);display:grid;place-items:center;
 box-shadow:0 4px 21px #06182087,inset 0 2px 15px #e4efeb42;
 z-index:25;touch-action:none;user-select:none;cursor:grab
}
.gate-joystick.engaged{cursor:grabbing;background:#3a5b66c9}
.gate-joystick-arrows{font-size:51px;color:#e9f4f4a3;opacity:.65;pointer-events:none}
.gate-joystick-thumb{
 position:absolute;left:calc(50% - 20px);top:calc(50% - 20px);
 width:40px;height:40px;border-radius:50%;border:2px solid #edf9f5d3;
 background:#263b47e8;box-shadow:0 2px 12px #001821d6;
 pointer-events:none;will-change:transform
}
.gate-back-button.world-back-button{
 position:absolute;right:clamp(15px,2.2vw,33px);bottom:clamp(13px,3vh,27px);
 z-index:22;top:auto;left:auto;min-height:42px;
 padding:10px 16px;background:#283a45eb;border:1px solid #e3eeecc1;
 box-shadow:0 4px 15px #0c1824aa
}
.scene-loading-overlay{
 position:fixed;inset:0;z-index:350;background:#111d27e8;
 display:grid;place-items:center;backdrop-filter:blur(7px);color:#eef3f2;
 animation:loader-appear .22s ease-out both;pointer-events:all
}
.scene-loading-card{min-width:220px;max-width:90%;display:flex;flex-direction:column;align-items:center;gap:12px}
.scene-loading-card>img{width:55px;height:55px;animation:loader-pulse .8s ease-in-out infinite alternate}
.scene-loading-card strong{font:700 23px Cinzel,Georgia,serif;text-align:center}
.scene-loading-card>span{font-size:11px;letter-spacing:2px;color:#c5d4d4}
.scene-loading-track{width:220px;height:4px;border-radius:99px;overflow:hidden;background:#495963}
.scene-loading-track i{height:100%;display:block;width:100%;transform-origin:left;background:#d2e3de;animation:loader-progress .65s ease-out both}
@keyframes loader-appear{from{opacity:0}to{opacity:1}}
@keyframes loader-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes loader-pulse{from{opacity:.6;transform:scale(.94)}to{opacity:1;transform:scale(1.04)}}
@media(max-width:960px){
 .city-panorama .location-heading h1,.gate-overlay-heading h1{font-size:clamp(22px,3vw,32px)}
 .city-overlay-vitals,.gate-overlay-vitals{top:76px;min-width:200px;width:50%}
 .city-overlay-vitals .adventure-hud,.gate-overlay-vitals .adventure-hud{padding:6px;gap:5px}
 .scene-explorer-heading{padding:4px 5px}
 .scene-explorer{width:clamp(62px,9vw,120px);height:clamp(90px,26vh,175px)}
 .gate-joystick{width:90px;height:90px;left:24px;bottom:19px}
 .gate-joystick-thumb{width:34px;height:34px;left:calc(50% - 17px);top:calc(50% - 17px)}
}
@media(max-height:470px) and (orientation:landscape){
 .city-panorama .location-heading,.gate-panorama .gate-overlay-heading{top:7px}
 .city-panorama .location-heading h1,.gate-panorama .gate-overlay-heading h1{font-size:23px}
 .city-overlay-vitals,.gate-overlay-vitals{top:69px;width:48%}
 .city-overlay-vitals .adventure-resource>span,.gate-overlay-vitals .adventure-resource>span{font-size:9px}
 .scene-explorer{width:clamp(58px,8.7vw,105px);height:clamp(87px,28vh,136px)}
 .gate-joystick{height:75px;width:75px;bottom:13px;left:15px}
 .gate-joystick-arrows{font-size:39px}
 .gate-back-button.world-back-button{min-height:35px;padding:7px 11px;font-size:10px}
 .gate-panorama .gate-destination-copy{padding:6px;gap:2px}
}
@media(max-width:550px){
 .city-panorama .location-heading,.gate-panorama .gate-overlay-heading{max-width:calc(100% - 75px)}
 .city-panorama .location-status{display:none}
 .city-overlay-vitals,.gate-overlay-vitals{min-width:185px;max-width:55%}
 .city-overlay-vitals .adventure-resource>span,.gate-overlay-vitals .adventure-resource>span{font-size:8px}
}
html.immersive-mode.force-landscape .app-shell.scene-fullscreen,
html.immersive-mode.force-landscape .app-shell.scene-fullscreen .main-shell{
 height:var(--immersive-width,100vw)!important;min-height:0!important
}
html.immersive-mode.force-landscape .app-shell.scene-fullscreen .content{height:100%!important}
@media(prefers-reduced-motion:reduce){
 .scene-explorer img,.gate-destination-symbol,.gate-footprint,
 .scene-loading-overlay,.scene-loading-card>img,.scene-loading-track i{
 animation:none!important
 }
 .gate-destination-copy{transition:none!important}
}