#explorationMap {position:fixed;top:0;left:0;box-sizing:border-box;padding:0;border:0;width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;margin:0;background:#292219;color:#fff;overflow:hidden;font:14px system-ui,sans-serif}
#explorationMap::backdrop {background:#201912}
#explorationMap .map-stage {height:100%;position:relative;overflow:hidden}
#explorationMapCanvas {display:block;width:100%;height:100%;touch-action:none;image-rendering:pixelated;outline-offset:-4px}
#explorationMap button {margin:0;box-sizing:border-box;min-height:42px;min-width:42px;border:1px solid #967753;border-radius:10px;color:#fff;background:#30271fee;padding:8px 12px;font:inherit;cursor:pointer}
#explorationMap button:disabled {opacity:.45;cursor:default}
#explorationMap button:focus-visible {outline:3px solid #ffe196;outline-offset:2px}
.map-top {position:absolute;left:12px;right:12px;top:max(10px,env(safe-area-inset-top));display:flex;gap:10px;justify-content:space-between;align-items:flex-start;pointer-events:none}
.map-heading {background:#241d17e8;padding:10px 12px;border:1px solid #715438;border-radius:12px;max-width:55%;pointer-events:auto}
.map-heading h2 {font-size:18px;line-height:1.25;margin:0 0 4px;color:#ffe0a2}
.map-heading p {font-size:12px;line-height:1.45;margin:0;color:#ebd7be}
.map-menu {display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;pointer-events:auto;max-width:45%}
.map-minimap {position:absolute;right:14px;top:110px;border:2px solid #8e6b43;border-radius:5px;background:#22170fcf;width:144px;height:108px;image-rendering:pixelated;pointer-events:none}
.map-bottom {position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:12px;right:12px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;pointer-events:none}
.map-pad {display:grid;grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px 44px;gap:4px;pointer-events:auto;touch-action:none}
.map-pad [data-direction="up"] {grid-area:1/2}.map-pad [data-direction="left"] {grid-area:2/1}.map-pad [data-direction="right"] {grid-area:2/3}.map-pad [data-direction="down"] {grid-area:3/2}
.map-pad [data-direction] {padding:0!important;font-size:20px!important;touch-action:none;user-select:none}
.map-info {max-width:330px;background:#241d17e8;border:1px solid #715438;border-radius:12px;padding:10px;pointer-events:auto}
.map-info p {margin:0 0 8px;font-size:12px;line-height:1.5;color:#f2dfc7}
.map-actions {display:flex;gap:6px;flex-wrap:wrap}
.map-popup {position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#17100baa;padding:16px;z-index:3}
.map-popup[hidden] {display:none}
.map-popup section {box-sizing:border-box;width:min(440px,100%);max-height:80vh;max-height:80dvh;max-height:calc(var(--exp-map-height)*.8);overflow:auto;background:#30251b;border:1px solid #a78454;border-radius:16px;padding:20px;box-shadow:0 12px 40px #0006}
.map-popup h3 {margin:0 0 12px;color:#ffe0a2;font-size:22px}.map-popup p {line-height:1.65}
.map-popup img {width:64px;height:64px;image-rendering:pixelated}
.map-popup .map-loadout {display:flex;gap:8px;flex-wrap:wrap}.map-loadout figure {margin:0;background:#463426;border-radius:8px;padding:6px;text-align:center;max-width:110px;font-size:12px}
.map-loadout figcaption {max-width:100px}
@media(max-width:480px){.map-top {left:8px;right:8px;gap:6px}.map-heading{padding:8px;max-width:53%}.map-heading h2{font-size:15px}.map-menu{gap:4px;max-width:45%}#explorationMap .map-menu button{padding:6px 8px;min-width:42px;font-size:12px}.map-minimap{width:96px;height:72px;right:10px;top:130px}.map-bottom{left:8px;right:8px;gap:6px}.map-info{max-width:155px;padding:8px}.map-pad{grid-template-columns:42px 42px 42px;grid-template-rows:42px 42px 42px;gap:3px}#explorationMap .map-info button{padding:6px 8px;font-size:12px}.map-heading p{font-size:11px}}
@media(max-height:500px){.map-minimap{top:80px;width:96px;height:72px}.map-heading p{display:none}.map-pad{grid-template-rows:36px 36px 36px}.map-info p{margin-bottom:4px}.map-top{top:6px}}