/* Astral Frontier map and compact mobile HUD refinement.
   Presentation only: no map graph, collision, travel, save, or combat data changes. */

:root{
 --atlas-ink:#06111d;
 --atlas-panel:#0a1b2b;
 --atlas-cyan:#68dce8;
 --atlas-cyan-soft:#9beaf0;
 --atlas-gold:#edc875;
 --atlas-green:#75f0b4;
 --atlas-danger:#ff7d8d;
}

.topnav .mobile-options-summary{display:none}

/* Full star chart: stronger hierarchy with restrained gold/cyan accents. */
.star-atlas{color:#eaf8fb}
.star-atlas>header{position:relative;padding:12px 14px 18px;border:1px solid #4a7184;border-bottom-color:#bd995d;background:linear-gradient(135deg,#102b3a 0,#091a2a 58%,#171a2b 100%);box-shadow:inset 0 1px #bdeff51f,0 12px 34px #0005;border-radius:12px 12px 4px 4px;overflow:hidden}
.star-atlas>header::after{content:"";position:absolute;right:-60px;top:-92px;width:230px;height:230px;border:1px solid #68dce829;border-radius:50%;box-shadow:0 0 0 24px #68dce80b,0 0 0 48px #edc87508;pointer-events:none}
.star-atlas h3{font-size:clamp(20px,3vw,29px);letter-spacing:.02em;color:#f7e4ad;margin:5px 0 8px}
.atlas-position{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px;color:#a9c5cf;font-size:13px}
.atlas-position b{color:#e9fcff;border:1px solid #68dce866;background:#071824cc;border-radius:999px;padding:5px 10px}
.atlas-position span{color:#8eabb6}
.atlas-legend{display:flex;gap:7px!important;flex-wrap:wrap;margin-top:10px}
.atlas-legend span{display:inline-flex;align-items:center;min-height:28px;padding:3px 9px;border:1px solid #496879;background:#071824b8;border-radius:999px;font-size:11px;color:#cde7eb}
.atlas-legend .legend-self{color:#dffcff;border-color:#68dce8}.atlas-legend .legend-city{color:#f8dda0;border-color:#b99151}.atlas-legend .legend-field{color:#b7f5ee}.atlas-legend .legend-route{color:#9fb6cf}
.atlas-scroll{position:relative;border:1px solid #5d8294!important;border-radius:8px!important;background:radial-gradient(circle at 72% 27%,#1e486166 0,transparent 34%),radial-gradient(circle at 18% 82%,#1a594a44 0,transparent 30%),linear-gradient(145deg,#06111d,#09182b 65%,#15182b)!important;box-shadow:inset 0 0 0 1px #9de7ef10,inset 0 0 42px #0008,0 14px 36px #0005}
.atlas-scroll::before,.atlas-scroll::after{content:"";position:absolute;z-index:3;pointer-events:none;width:28px;height:28px;border-color:var(--atlas-gold);opacity:.7}.atlas-scroll::before{left:7px;top:7px;border-left:2px solid;border-top:2px solid}.atlas-scroll::after{right:7px;bottom:7px;border-right:2px solid;border-bottom:2px solid}
.atlas-chart{background-image:linear-gradient(#70b4c80c 1px,transparent 1px),linear-gradient(90deg,#70b4c80c 1px,transparent 1px),radial-gradient(#b7eaf04d .75px,transparent 1px)!important;background-size:44px 44px,44px 44px,29px 33px!important}
.atlas-chart line{stroke:#517898!important;stroke-width:2!important;stroke-dasharray:3 7!important;filter:drop-shadow(0 0 4px #5cd3e655)}
.atlas-chart line.near{stroke:var(--atlas-gold)!important;stroke-width:3!important;stroke-dasharray:none!important;filter:drop-shadow(0 0 5px #edc87599)}
.atlas-node{min-width:112px!important;min-height:112px!important;gap:4px!important;isolation:isolate}
.atlas-land{position:relative;width:88px!important;height:66px!important;border-radius:12px!important;border:1px solid #5f7f99!important;background-color:#0b1b2a;box-shadow:0 9px 20px #000b,inset 0 0 18px #000b,0 0 0 3px #07121dbd!important;overflow:visible}
.atlas-land::after{content:"";position:absolute;inset:4px;border:1px solid color-mix(in srgb,var(--zone) 52%,transparent);border-radius:8px;pointer-events:none}
.atlas-node-icon{position:absolute;left:-10px;top:-10px;display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--atlas-cyan);border-radius:50%;background:#071824;color:#c7faff;font:700 14px/1 system-ui;box-shadow:0 0 12px #68dce877;font-style:normal}
.atlas-city .atlas-land{width:68px!important;height:68px!important;border-color:#bc985e!important}.atlas-city .atlas-node-icon{border-color:var(--atlas-gold);color:#ffe6a4;box-shadow:0 0 12px #edc87566}
.atlas-node strong{max-width:132px;color:#eaf8fb!important;background:#06121de8!important;border:1px solid #38576b;border-radius:4px!important;padding:4px 7px!important;font-size:12px!important;line-height:1.25!important;text-shadow:0 1px 3px #000!important;overflow:hidden;text-overflow:ellipsis}
.atlas-node small{color:#9fbac5!important;background:#071520e8!important;border:1px solid #2d4858;border-radius:999px!important;padding:3px 7px!important;font-size:10px!important}
.atlas-node:not(.visited) .atlas-land{filter:saturate(.6) brightness(.72)}
.atlas-here{z-index:4}.atlas-here .atlas-land{border:2px solid var(--atlas-cyan)!important;box-shadow:0 0 0 4px #68dce829,0 0 28px #68dce87a,inset 0 0 16px #0008!important}.atlas-here .atlas-node-icon{background:var(--atlas-cyan);color:#06111d;animation:atlasPulse 1.9s ease-out infinite}.atlas-here strong{border-color:var(--atlas-cyan);color:#fff!important}.atlas-here small{color:#dffcff!important;border-color:#68dce877!important}
.atlas-alert{position:absolute;right:-8px;top:-8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--atlas-gold);color:#211607;font:800 14px/1 system-ui;box-shadow:0 0 0 3px #09131c,0 0 15px #edc87599;font-style:normal}
.atlas-node:hover .atlas-land,.atlas-node:focus-visible .atlas-land{transform:translateY(-2px) scale(1.04)!important;border-color:#e9fcff!important}.atlas-node:focus-visible{outline:3px solid #fff2b8!important;outline-offset:5px!important}.atlas-node:active .atlas-land{transform:scale(.98)!important}
.atlas-help{margin:9px 2px 15px;color:#8faab6;font-size:11px}
@keyframes atlasPulse{0%{box-shadow:0 0 0 0 #68dce899}70%,100%{box-shadow:0 0 0 12px #68dce800}}

/* The minimap uses the same readable visual language as the star chart. */
.minimap{border:1px solid #5a8797!important;background:linear-gradient(145deg,#071824f2,#0b2331ed)!important;box-shadow:inset 0 0 0 1px #b9eef21a,0 9px 24px #0008!important}
.minimap::before{content:"TACTICAL MAP";display:block;margin:0 0 4px;color:var(--atlas-gold);font:700 9px/1.1 system-ui;letter-spacing:.14em}
.minimap canvas{border:1px solid #274b5b;border-radius:3px;background:#06111d}
#miniLegend{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 8px;height:auto!important;padding:5px 1px 0!important;color:#bed2d8;font-size:9px!important}
#miniLegend span{display:flex;align-items:center;gap:4px;white-space:nowrap}
#miniLegend i{display:inline-block;width:8px;height:8px;border:2px solid;border-radius:50%}
#miniLegend .mini-self{border-color:var(--atlas-cyan);background:#e8feff}.mini-route{border-color:var(--atlas-green)!important;border-radius:1px!important;transform:rotate(45deg)}.mini-player{border-color:var(--atlas-gold)!important;background:var(--atlas-gold)}.mini-important{border-color:var(--atlas-danger)!important;background:var(--atlas-danger)}
body.mini-expanded #miniLegend{display:grid!important}

@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 /* Only one clear top-menu entry remains. Former top shortcuts are available inside it. */
 .quicknav{display:none!important}
 #hudCredits{position:static!important;inset:auto!important;width:100%!important;max-width:none!important;height:44px!important;min-height:44px!important;padding:6px 10px!important;font-size:12px!important;line-height:1.2!important;text-align:left!important;border-color:#6f8796!important;background:#102c3a!important}
 #menuToggle{top:0!important;right:0!important;width:76px!important;min-width:76px!important;height:44px!important;min-height:44px!important;padding:4px 6px!important;border-color:#d1ae6b!important;background:linear-gradient(160deg,#173c4b,#19263b)!important;color:#ffe5a7!important;font-size:10px!important;line-height:1.15!important;box-shadow:0 4px 14px #0007!important}
 .hud .topnav{top:calc(var(--safe-top) + 52px)!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;padding:10px!important;border:1px solid #537b8d!important;border-top-color:#c7a45f!important;border-radius:9px!important;background:linear-gradient(150deg,#071824fa,#0b2433fa 62%,#181b2cfa)!important;box-shadow:0 18px 44px #000c!important}
 .topnav button,.topnav a{min-width:44px!important;min-height:44px!important;padding:5px!important;font-size:10px!important;line-height:1.2!important}
 .topnav .mobile-menu-heading{min-height:48px;padding-bottom:7px;border-bottom:1px solid #5c728066}.mobile-menu-heading>span{display:flex;flex-direction:column;gap:2px}.mobile-menu-heading small{color:var(--atlas-cyan);font-size:9px;letter-spacing:.13em}.mobile-menu-heading strong{color:#ffe4a1;font-size:14px}.mobile-menu-heading button{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;border-color:#8aa0aa!important;background:#102837!important}
 .topnav .mobile-options-summary{display:grid;grid-template-columns:1fr minmax(96px,42%);align-items:center;gap:2px 8px;grid-column:1/-1;padding:8px;border:1px solid #3b6072;border-radius:7px;background:#061521a8}.mobile-options-summary>.eyebrow{font-size:8px;color:var(--atlas-cyan)}.mobile-options-summary>strong{font-size:11px;color:#d8e8ea;font-weight:500}.mobile-options-summary>#hudCredits{grid-column:2;grid-row:1/3}
 .topnav .mobile-service-links{padding-top:5px;border-top:1px solid #304f5e}.topnav #mobileLayoutMenu{padding:4px;border:1px solid #314f60;border-radius:6px;background:#06162188}.topnav #mobileLayoutMenu summary{font-size:11px;color:#d9c58f}
 .hud .topnav .player-tools :is(#accountButton,#characterSelectButton,#fullscreenButton,#upgradeNotice,#logoutButton){min-width:44px!important;min-height:44px!important;height:auto!important;padding:5px!important}
 /* Chat occupies the freed top-center area; opening it still uses the existing compact panel. */
 #socialDock,.in-town #socialDock{position:absolute!important;top:var(--safe-top)!important;bottom:auto!important;left:auto!important;right:calc(var(--safe-side) + 84px)!important;transform:none!important;z-index:17!important}
 #chatToggle{width:96px!important;min-width:96px!important;height:40px!important;min-height:40px!important;padding:3px 7px!important;border:1px solid #5f8e9d!important;border-bottom-color:#c7a45f!important;background:linear-gradient(155deg,#0b2d3c,#101d30)!important;color:#e7f8fa!important;border-radius:8px!important;font-size:10px!important;box-shadow:0 5px 16px #0008!important}
 #chatToggle .interface-icon{width:19px!important;height:19px!important}
 #chatPanel,.chat-open #chatPanel{border:1px solid #5d8594!important;border-top-color:#d0ad67!important;background:linear-gradient(#081b29fa,#07131efa)!important;box-shadow:0 18px 50px #000d!important}
 #messages,.in-town #messages{width:min(220px,68vw)!important;max-width:220px!important}.message{border-left:2px solid #68dce88c!important;background:#061521d9!important}
 /* Smaller visual footprint while preserving touch targets. */
 .hud .player{font-size:10px!important}.hud .player #portrait{border-radius:4px}.player-copy{min-width:0}.player-copy .bar{border-radius:3px!important}
 .minimap,.in-town .minimap{width:82px!important;height:70px!important;padding:3px!important;border-radius:6px!important}.minimap::before{font-size:7px!important;margin-bottom:2px!important}.minimap canvas{width:74px!important;height:45px!important}#miniExpand{right:-5px!important;bottom:-14px!important;border:1px solid #5e8290!important;border-radius:50%!important;background:#081c29e8!important;color:#d9f6f7!important}
 body.mini-expanded .minimap{width:244px!important;height:auto!important;padding:7px 7px 34px!important}body.mini-expanded .minimap canvas{width:228px!important;height:141px!important}
 #mobileQuestToggle,#worldBossStatus,#targetPanel{font-size:10px!important}
}

@media(max-width:360px) and (orientation:portrait){
 #chatToggle{width:68px!important;min-width:68px!important;font-size:9px!important}.hud .player{max-width:152px!important}.mobile-options-summary>strong{font-size:10px}.hud .topnav{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){
 #socialDock,.in-town #socialDock{top:var(--safe-top)!important;bottom:auto!important;left:50%!important;transform:translateX(-50%)!important}
 #chatToggle{width:94px!important;height:38px!important;min-height:38px!important}
 .hud .topnav{top:calc(var(--safe-top) + 46px)!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;max-height:calc(var(--af-viewport-height,100dvh) - 54px)!important}
 .minimap,.in-town .minimap{top:calc(var(--safe-top) + 60px)!important}
 #messages,.in-town #messages{top:calc(var(--safe-top) + 46px)!important}
}

@media(min-width:1201px){
 /* Desktop geometry stays intact; only the map surface receives the new theme. */
 #miniLegend{font-size:9px!important}.minimap::before{font-size:9px}
}

@media(prefers-reduced-motion:reduce){.atlas-here .atlas-node-icon{animation:none}}

/* .62: one options menu, centered chat entry, no duplicated bottom shortcuts. */
#mobileSkillsLink{display:none}
@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 #game{--combat-bottom:calc(var(--hud-bottom) + 4px)}
 .topnav #mobileSkillsLink{display:flex!important;align-items:center;justify-content:center;gap:6px;min-height:44px!important;font-size:12px!important}
 #game #chatToggle{height:44px!important;min-height:44px!important;font-size:11px!important}
 #game .minimap #miniLegend{display:none!important}
 body.mini-expanded #game .minimap #miniLegend{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));height:auto!important;padding:6px 0!important;line-height:14px!important;font-size:10px!important;gap:6px}
 body.mini-expanded #game .minimap>div{height:auto!important;min-height:14px!important}
 body.mini-expanded #game .minimap{padding-bottom:44px!important;max-height:calc(var(--af-viewport-height,100dvh) - 132px);overflow:auto}
 #game .minimap #miniExpand{right:0!important;bottom:0!important;min-width:44px!important;min-height:44px!important;width:44px!important;height:44px!important}
 body.menu-open #game .minimap,body.chat-open #game .minimap{visibility:hidden!important}
 body:is(.mini-expanded,.menu-open,.chat-open) #game #rebirthSkillDock,body:has(dialog[open]) #game #rebirthSkillDock{visibility:hidden!important}
 #game .hud .player{box-sizing:border-box!important;width:clamp(144px,calc(100vw - 184px),220px)!important;min-width:144px!important}
}
@media(max-width:400px) and (orientation:portrait){
 #game #chatToggle{width:68px!important;min-width:68px!important}
 #game #socialDock{width:68px!important;right:calc(var(--safe-side) + 84px)!important;left:auto!important}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){
 #game #targetPanel,#game #targetPanel.is-boss{top:calc(var(--safe-top) + 52px)!important}
 #game #messages,#game.in-town #messages{top:calc(var(--safe-top) + 98px)!important}
}

/* .64: the entire collapsed map is the touch target. A second 44px overlay
   used to cover most of the tiny canvas. Expanded controls occupy real rows. */
@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 body:not(.mini-expanded) #game .minimap #miniExpand{display:none!important}
 body:not(.mini-expanded) #game .minimap::before{content:'TACTICAL MAP ↗'}
 body.mini-expanded #game .minimap{display:flex!important;flex-direction:column;gap:4px;padding:7px!important;max-height:calc(var(--af-viewport-height,100dvh) - 104px)!important;z-index:19!important;opacity:1!important;background:#071a2b!important}
 body.mini-expanded #game .minimap>*{flex-shrink:0}
 body.mini-expanded #game .minimap #miniExpand{display:flex!important;align-items:center;justify-content:center;order:-1;position:static!important;inset:auto!important;width:100%!important;margin:0 0 2px!important;border-radius:5px!important;font-size:12px!important;background:#123346!important}
 body.mini-expanded #game .minimap canvas{display:block;max-width:100%!important}
 #game .minimap:focus-visible{outline:2px solid #7ae4dc;outline-offset:3px}
 #game .hud .topnav{grid-auto-rows:minmax(44px,max-content)!important;align-content:start!important}
 #game .topnav #mobileLayoutMenu{height:auto!important}
 body.left-handed #game #socialDock{left:auto!important;right:calc(var(--safe-side) + 84px)!important;transform:none!important}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){
 body.mini-expanded #game .minimap{max-height:calc(var(--af-viewport-height,100dvh) - 84px)!important}
 #game #socialDock,body.left-handed #game #socialDock{left:50%!important;right:auto!important;width:94px!important;transform:translateX(-50%)!important}
}
/* Short landscape: keep every combat control below the 70px minimap. */
@media(orientation:landscape) and (max-height:400px){
 #game .bottomhud .actiondock{width:244px!important;max-width:244px!important;height:156px!important}
 #game .actiondock .skills button:nth-child(1),#game .actiondock .skills button:nth-child(5){left:0!important;bottom:0!important}
 #game .actiondock .skills button:nth-child(2),#game .actiondock .skills button:nth-child(6){left:0!important;bottom:52px!important}
 #game .actiondock .skills button:nth-child(3){left:52px!important;bottom:0!important}
 #game .actiondock .skills button:nth-child(4){left:52px!important;bottom:52px!important}
 #game #skillPage{right:88px!important;bottom:0!important}
 #game .bottomhud .actiondock .consumable,#game .bottomhud .actiondock #mobileHome{bottom:112px!important}
 #game .bottomhud .botdock{right:calc(var(--safe-side) + 88px)!important;bottom:calc(var(--combat-bottom) + 56px)!important}
 body.left-handed #game .bottomhud .botdock{right:auto!important;left:calc(var(--safe-side) + 112px)!important}
}