/* M1.15 — continuous wide valley map with camera, moving creatures and HUD. */
.app-shell.field-active .valley-viewport{position:absolute;inset:0;overflow:hidden;background:#607e75;touch-action:pan-x pan-y}
.valley-terrain{position:absolute;left:0;top:0;width:6800px;height:4650px;transform-origin:0 0;will-change:transform}
.valley-terrain::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,#162d2b31)}
.valley-landscape{position:absolute;inset:0;width:6800px;height:4650px;display:block;pointer-events:none;user-select:none}
.valley-avatar{position:absolute;width:81px;height:129px;z-index:8;transform:translate(-50%,-78%);display:flex;flex-direction:column;align-items:center;pointer-events:none;filter:drop-shadow(0 5px 5px #0d2926bb)}
.valley-avatar .hero-visual{width:100%;height:100%;min-height:0}
.valley-avatar.is-walking .hero-visual{animation:scene-walk .32s ease-in-out infinite alternate}
.valley-avatar.facing-left .hero-visual{transform:scaleX(-1)}
.valley-avatar.facing-left.is-walking .hero-visual{animation:scene-walk-left .32s ease-in-out infinite alternate}
.valley-avatar .scene-hero-open{position:absolute;inset:0;z-index:3;width:100%;height:100%;border:0;background:transparent;pointer-events:auto;cursor:pointer}
.valley-avatar .scene-hero-open:focus-visible{outline:3px solid #e7d5a2;outline-offset:2px}
.valley-avatar-name{position:absolute;bottom:101%;left:50%;transform:translateX(-50%);padding:5px 9px;border-radius:7px;background:#1a363ae0;border:1px solid #c6ded59a;color:white;font-size:11px;white-space:nowrap}
.valley-mob{position:absolute;z-index:7;transform:translate(-50%,-50%);min-width:110px;height:126px;padding:4px;background:transparent;border:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;filter:drop-shadow(0 6px 6px #17372da6);animation:valley-mob-patrol 9s ease-in-out infinite alternate;will-change:transform}
.valley-mob .mob-figure{display:grid;place-items:center;width:85px;height:75px}
.valley-mob .creature-illustration{width:100%;height:100%;object-fit:contain;animation:valley-trot .48s ease-in-out infinite alternate}
.valley-mob:nth-of-type(2){animation-duration:11s;animation-delay:-3s}
.valley-mob:nth-of-type(3){animation-duration:8s;animation-delay:-5s}
.valley-mob .mob-label{position:static;transform:none;display:flex;flex-direction:column;align-items:center;padding:5px 8px;border-radius:8px;color:#fff;background:#213d40d9;border:1px solid #a9c7b9b8;font-size:11px;white-space:nowrap}
.valley-mob .mob-label small{font-size:9px;color:#d7ebe3}
.valley-mob.mob-defeated{opacity:.33;filter:grayscale(1);pointer-events:none}
.valley-mob.mob-defeated,.valley-mob.mob-defeated .mob-figure,.valley-mob.mob-defeated img{animation:none;transform:translate(-50%,-50%)}
@keyframes valley-mob-patrol{0%{transform:translate(calc(-50% - 55px),-50%)}45%{transform:translate(calc(-50% + 34px),calc(-50% - 10px))}55%{transform:translate(calc(-50% + 34px),calc(-50% - 10px))}100%{transform:translate(calc(-50% - 55px),-50%)}}
@keyframes valley-trot{from{transform:translateY(-3px) rotate(-3deg)}to{transform:translateY(2px) rotate(3deg)}}
.valley-joystick{position:absolute;z-index:22;bottom:24px;left:23px;width:105px;height:105px;border-radius:50%;background:#26473db8;border:2px solid #d6ecdea3;touch-action:none;user-select:none;display:flex;justify-content:center;align-items:center;color:#e2eee0;font-size:36px}
.valley-joystick-thumb{position:absolute;top:50%;left:50%;width:43px;height:43px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#e4f7ef,#a2c8ba);border:2px solid #e9f7ed;pointer-events:none;box-shadow:0 3px 9px #172e29bb}
.valley-hud{position:absolute;z-index:19;top:clamp(72px,13vh,115px);left:clamp(14px,2vw,30px);padding:7px 11px;color:#e3f4ea;background:#1b3734bc;border:1px solid #bed9c2a8;border-radius:9px;font-size:11px;backdrop-filter:blur(5px);pointer-events:none}
.valley-viewport .field-overlay-heading{pointer-events:none}
.valley-viewport .field-presence-panel{z-index:40}
.valley-viewport .field-presence-trigger{z-index:41}
.valley-viewport .field-back-button{z-index:41}
.valley-cache{position:absolute;left:58%;top:52%;z-index:9}
@media(hover:hover) and (pointer:fine){.valley-joystick{display:none}}
@media(max-width:700px){.valley-hud{font-size:9px;top:67px;left:12px}.valley-avatar{width:65px;height:103px}.valley-mob{min-width:95px}.valley-mob .mob-figure{width:70px;height:65px}}
@media(prefers-reduced-motion:reduce){.valley-mob,.valley-mob .mob-figure,.valley-mob .creature-illustration,.valley-avatar .hero-visual{animation:none!important}}

/* Portal entrances remain attached to world coordinates as the camera follows. */
.valley-portal{position:absolute;z-index:10;width:170px;height:170px;transform:translate(-50%,-50%);background:transparent;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;cursor:pointer}
.valley-portal-ring{display:block;width:87px;height:87px;border-radius:50%;border:5px double #e6ffee;background:radial-gradient(circle,#b1eadacb,#3c8e78c0 50%,transparent);box-shadow:0 0 28px #85dcb5,inset 0 0 21px #c8ffed;animation:valley-portal-glow 2.6s ease-in-out infinite alternate}
.valley-portal[data-valley-portal="crossroads"] .valley-portal-ring{border-color:#ffe7b3;background:radial-gradient(circle,#f8d99ecd,#a8844dc0 50%,transparent);box-shadow:0 0 29px #e2b971}
.valley-portal-caption{font-weight:800;font-size:12px;white-space:nowrap;background:#223d43e8;border:1px solid #accabd;border-radius:8px;padding:8px 11px;margin-top:5px}
.valley-portal.portal-nearby .valley-portal-ring{filter:brightness(1.6)}
@keyframes valley-portal-glow{to{transform:scale(1.12) rotate(15deg);filter:brightness(1.4)}}
.world-transition-portals{position:absolute;inset:0;pointer-events:none;z-index:18}
.world-transition-portal{position:absolute;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:7px;width:145px;padding:11px;border:1px solid #adc8b8;border-radius:13px;background:#233f44d9;color:white;font-weight:700;box-shadow:0 5px 18px #102c30ad}
.world-transition-glow{display:grid;place-items:center;width:48px;height:48px;color:#d3f4eb;border:3px double #9be0d8;border-radius:50%;box-shadow:0 0 18px #6bcfc5;background:radial-gradient(circle,#75baaa9c,#244f5a)}
.world-transition-portal strong{font-size:11px}
.world-transition-1{left:15%;bottom:15%}
.world-transition-2{right:16%;top:18%}
.world-transition-3{left:48%;bottom:9%}
@media(max-width:700px){.world-transition-portal{width:100px;padding:5px;gap:3px}.world-transition-glow{width:30px;height:30px}.world-transition-portal strong{font-size:8px}}
@media(prefers-reduced-motion:reduce){.valley-portal-ring{animation:none!important}}

.valley-terrain .valley-landscape{object-fit:fill;max-width:none;max-height:none}
.wilderness-location[data-area="grove"] .valley-viewport{background:#1b5045}
.wilderness-location[data-area="grove"] .valley-mob .mob-label{background:#204d41ed;border-color:#97dbbe}
.wilderness-location[data-area="ruins"] .valley-viewport{background:#52676b}
.wilderness-location[data-area="ruins"] .valley-mob .mob-label{background:#324a56ed;border-color:#bfced3}
.wilderness-location[data-area="ruins"] .valley-portal-ring{border-color:#d2d9ec;background:radial-gradient(circle,#bfdef2a9,#416b82b0 55%,transparent);box-shadow:0 0 25px #9bbbd1}

/* Camera-limited tile renderer: large 6800×4650 SVG is never drawn as one playfield image. */
.valley-terrain::after{content:none!important}
.terrain-tile-layer{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:visible}
.terrain-tile{position:absolute;display:block;border:0;padding:0;margin:0;max-width:none;max-height:none;object-fit:fill;pointer-events:none;user-select:none}
.valley-avatar .walker-character{width:100%;height:100%}
.valley-viewport .valley-hud{backdrop-filter:none}

/* Never prepromote an enormous off-screen world image as one GPU layer. */
.valley-terrain{will-change:auto}

/* Character badge remains legible on every world region and updates as HP changes. */
.valley-avatar-name{display:flex;flex-direction:column;gap:3px;align-items:center;min-width:110px;padding:5px 7px;white-space:nowrap;z-index:12;border-radius:8px}
.valley-avatar-name strong{font-size:11px;line-height:1.15;color:#f6faf2}
.valley-avatar-name small{font-size:9px;color:#dce9df;line-height:1.1}
.valley-avatar-name .valley-avatar-health{position:relative;display:block;width:100%;height:7px;border-radius:8px;background:#28473d;overflow:hidden;border:1px solid #b2d8c2}
.valley-avatar-health i{display:block;height:100%;background:#39d59a;transition:width .2s linear}
.valley-avatar-name .valley-avatar-hp-text{color:#eaf9ef;font-size:9px;font-variant-numeric:tabular-nums}
@media(max-width:700px){.valley-avatar-name{min-width:99px;padding:4px 6px}.valley-avatar-name strong{font-size:10px}}