.quicknav{display:none;position:absolute;pointer-events:auto}
@media(max-width:1200px),(max-height:600px) and (max-width:1200px){#eliteModeButton{position:absolute!important;left:12px;top:180px;width:222px;z-index:5}}
.player-copy{min-width:0;flex:1}
#performanceStatus{display:block!important}
.actiondock .skills .skill-lock{opacity:.7}.actiondock .skills .skill-lock .skill-art{opacity:1}.actiondock .skills .skill-lock:after{content:'ล็อก';font-size:8px;line-height:12px;padding:0 3px;border-radius:4px;background:#05101fe6;color:#e0e9ee;z-index:4}
#targetPanel{position:absolute;top:81px;left:50%;transform:translateX(-50%);width:224px;max-width:calc(100vw - 24px);padding:5px 8px;background:#0718216b;border:0;border-radius:7px;box-shadow:none;backdrop-filter:none;pointer-events:none;text-shadow:0 1px 3px #000}
#targetPanel .target-heading{display:flex;align-items:center;gap:5px;min-width:0}#targetPanel strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;text-align:left}#targetPanel small{font-size:9px;margin:0;white-space:nowrap}#targetPanel .bar{height:4px;margin:4px 0 2px;background:#08162099}#targetPanel .target-health{display:flex;justify-content:space-between;font-size:9px;color:#d4e1e6}
#targetPanel.is-boss{width:310px;padding:7px 9px;background:#21180c8c;border:1px solid #d0a96088}#targetPanel.is-boss strong{font-size:12px}#targetPanel.is-boss .bar{height:6px}#targetPanel.is-boss .bar i{background:linear-gradient(90deg,#d99439,#f6d37b)}.boss-badge{font-size:9px;font-weight:800;color:#ffdc89;white-space:nowrap;letter-spacing:.4px}
@media(max-width:1200px),(max-height:600px) and (max-width:1200px){.topnav .righttools{position:static;inset:auto;width:auto;max-width:none;min-width:0;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:5px}.topnav .righttools button{min-height:44px;flex:1;font-size:11px;padding:6px}}
/* Compact two-thumb layout. Never scale the page or shrink touch hit boxes. */
#hudCredits,#mobileQuestToggle,#miniExpand,#skillPage,#mobileHome,#mobileBottomNav,#mobileXP{display:none}
#healingTarget{position:absolute;left:12px;top:210px;display:flex;max-width:260px;z-index:5;border:1px solid #75cbbf70;border-radius:8px;background:#082e32dc;overflow:hidden}#healingTarget[hidden]{display:none}#healingTarget button{min-height:44px;padding:5px 8px;border:0;background:transparent;font-size:11px}#healingTarget .healing-name{text-align:left;min-width:0}#healingTarget small{display:block;color:#8bd7c3;font-size:9px}#healingTarget strong{display:block;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}#healingTarget[data-available=false]{border-color:#b86b59}
@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 #game{--hud-bottom:max(8px,env(safe-area-inset-bottom));--combat-bottom:calc(var(--hud-bottom) + 60px)}
 .hud .player,.minimap,#mobileQuestToggle,#hudCredits{border:1px solid #79b9c36b;background:linear-gradient(140deg,#153746e3,#071b2bdc);box-shadow:inset 0 1px #ccf7ff15,0 3px 12px #0003;border-radius:5px 12px 5px 12px}
 .hud{inset:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) auto max(8px,env(safe-area-inset-left))}
 .hud .player{width:176px;height:82px;max-height:82px;padding:5px;gap:4px}.hud .player #portrait{width:32px;height:54px}.player-copy strong{font-size:12px}.player-copy .bar{height:12px}.player-copy .bar span{font-size:9px}.player-copy .eyebrow{font-size:8px}.player-copy .xp{height:3px}
 .quicknav{display:flex;right:0;top:0;gap:2px}.quicknav button{width:44px;height:44px;min-height:44px;padding:3px;font-size:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border-color:#6e9caa66;background:#0c2438e0}.quicknav .interface-icon{width:24px;height:24px;margin:0}
 #menuToggle{top:48px;min-width:44px;width:44px;height:44px;min-height:44px;font-size:10px;padding:3px;background:#102b3de0}.hud .topnav{top:98px}
 #hudCredits{display:block;position:absolute;top:calc(max(8px,env(safe-area-inset-top)) + 50px);right:60px;max-width:90px;padding:7px 6px;color:#f3ce85;font-size:11px;line-height:22px;z-index:4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .hud .zone{top:86px;left:0;max-width:200px;text-align:left;transform:none}.hud .zone h1{font-size:11px;margin:0}.hud .zone .eyebrow,.hud .zone>span:last-child{display:none}
 #mobileQuestToggle{display:flex;align-items:center;gap:5px;position:absolute;left:8px;top:116px;width:182px;height:44px;min-height:44px;text-align:left;padding:5px 8px;z-index:4;font-size:10px;color:#e7cf99}#mobileQuestToggle span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}#mobileQuestToggle b{font-size:14px;font-weight:400}
 #questTracker{display:none!important;position:absolute;top:162px;bottom:auto;left:8px;width:215px;max-width:calc(100vw - 124px);max-height:195px;overflow:auto;padding:8px;z-index:8;background:#071b2af5}body.quest-peek #questTracker{display:block!important}#questTracker .eyebrow{font-size:8px}#questTracker h3{font-size:12px;margin:5px 0}#questTracker p{font-size:10px;margin:5px 0;line-height:1.5}#questTracker small{font-size:10px}#questTracker button{min-height:44px;font-size:10px;padding:4px}
 .minimap,.in-town .minimap{display:block;top:108px;right:8px;width:104px;padding:4px 4px 17px}.minimap canvas{width:94px;height:58px}.minimap>div:not(#cameraControls){display:block;font-size:8px;height:12px;line-height:12px}.minimap #mapcount{display:none}#cameraControls{display:none}#miniExpand{display:block;position:absolute;right:-1px;bottom:-8px;min-width:44px;min-height:44px;width:44px;height:44px;padding:3px;background:transparent;border:0;color:#adf3e6;font-size:19px}
 body.mini-expanded .minimap{width:min(260px,calc(100vw - 16px));padding:7px 7px 39px;z-index:12;background:#071a2bef}body.mini-expanded .minimap canvas{width:100%;height:auto}body.mini-expanded #cameraControls{display:flex;margin:4px 0 0}body.mini-expanded #cameraControls button{height:44px;min-height:44px;flex:1}body.mini-expanded #miniExpand{bottom:0}
 #networkStatus,.in-town #networkStatus{top:202px;right:8px;width:104px;max-width:104px;min-height:44px;height:44px;padding:3px;font-size:8px;border-color:transparent;background:#081f2c99}
 #performanceStatus{top:auto!important;right:8px!important;bottom:calc(var(--hud-bottom) + 48px)!important;font-size:9px!important;padding:2px 5px!important;line-height:12px}
 #targetPanel,#targetPanel.is-boss{top:171px;left:8px;transform:none;width:calc(100vw - 128px);max-width:250px;padding:4px 6px}#targetPanel .target-heading{flex-wrap:nowrap}#targetPanel strong{font-size:10px}#targetPanel .target-health{font-size:8px}
 #eliteModeButton{top:222px!important;left:8px!important;width:168px!important;min-height:44px!important;height:44px!important;font-size:10px!important}
 #healingTarget{top:220px;left:8px;max-width:232px;height:44px}#healingTarget strong{max-width:160px;font-size:10px}
 .bottomhud .actiondock{bottom:var(--combat-bottom);right:10px;width:190px;height:190px;overflow:visible}
 .actiondock .skills button{width:50px;height:50px;min-height:50px;border:1px solid #94d1d6;border-radius:50%;box-shadow:inset 0 0 5px #dafcff33,0 3px 8px #0008}
 .actiondock .skills button:nth-child(1){left:0;right:auto;bottom:0}.actiondock .skills button:nth-child(2){left:0;right:auto;bottom:59px}.actiondock .skills button:nth-child(3){left:31px;right:auto;bottom:115px}.actiondock .skills button:nth-child(4){left:89px;right:auto;bottom:140px}
 #game[data-skill-page="0"] .skills button:nth-child(n+5){display:none}#game[data-skill-page="1"] .skills button:nth-child(-n+4){display:none}
 .actiondock .skills button:nth-child(5){left:0;right:auto;bottom:0}.actiondock .skills button:nth-child(6){left:0;right:auto;bottom:59px}
 #skillPage{display:block;position:absolute;right:0;bottom:97px;width:44px;height:44px;min-height:44px;padding:3px;border:1px solid #7296ac;border-radius:50%;background:#0d293ed9;font-size:10px}
 .bottomhud .actiondock #attackBtn{right:0;bottom:0;width:88px;height:88px;min-height:88px;border:2px solid #efd083;background:radial-gradient(circle at 35% 30%,#89713de8,#362f1fee);box-shadow:inset 0 0 12px #f2d18a33,0 3px 12px #0008}
 .bottomhud .actiondock .consumable,.bottomhud .actiondock #mobileHome{position:absolute;left:auto;right:0;top:auto;width:44px;height:44px;min-height:44px;padding:2px;border-radius:10px;background:#102d3be3;border:1px solid #76a6b582}
 .bottomhud .actiondock #potionBtn{left:auto;right:0;bottom:300px}.bottomhud .actiondock #etherBtn{left:auto;right:0;bottom:251px}.bottomhud .actiondock #mobileHome{display:block;bottom:202px}.actiondock #mobileHome[hidden]{display:none}.actiondock #mobileHome .interface-icon{width:30px;height:30px;margin:auto}
 .bottomhud .botdock{right:63px;left:auto;bottom:calc(var(--combat-bottom) + 213px);width:132px;height:44px;min-height:44px;display:flex;background:#092d32d9}.botdock button{min-height:44px}.botdock #autoBtn{flex:1;min-width:0;padding:3px 5px}.botdock button:last-child{flex:0 0 44px;min-width:44px;width:44px;padding:3px;font-size:0}.botdock button:last-child::before{width:25px;height:25px}.botdock strong{font-size:9px;white-space:nowrap}.botdock #autotext{font-size:9px}
 #movementPad,.in-town #movementPad{left:12px;bottom:calc(var(--combat-bottom) + 7px);width:108px;height:108px;border-color:#8ce7e17a;box-shadow:inset 0 0 16px #72e8e322,0 3px 10px #0004}#movementPad small{font-size:9px;bottom:-17px}
 #socialDock,.in-town #socialDock{left:12px;bottom:calc(var(--combat-bottom) + 153px)}#chatToggle{min-width:72px;min-height:44px;border-color:#81b9c06b}.chat-open #chatPanel{bottom:calc(var(--combat-bottom) + 145px);max-height:45dvh}#chatPanel.expanded{bottom:8px;max-height:calc(100dvh - 16px)}
 #messages,.in-town #messages{left:12px;bottom:calc(var(--combat-bottom) + 205px);max-width:150px}.message{font-size:9px;line-height:1.5}.nearby-loot{display:none}
 #mobileBottomNav{display:flex;position:absolute;bottom:var(--hud-bottom);left:50%;transform:translateX(-50%);width:228px;height:46px;gap:2px;padding:2px;z-index:7;border:1px solid #598a9b69;border-radius:9px;background:#071e2ddd}#mobileBottomNav button{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;min-width:44px;min-height:44px;height:44px;padding:0;font-size:8px;background:transparent;border:0;gap:0}#mobileBottomNav .interface-icon{width:24px;height:24px;margin:0}#mobileBottomNav button:disabled{opacity:.32}
 #mobileXP{display:block;position:absolute;bottom:0;left:0;right:0;height:3px;background:#041523;pointer-events:none}#mobileXP i{display:block;height:100%;background:linear-gradient(90deg,#48bab9,#f3d38e)}
 .in-town .townbar{bottom:var(--combat-bottom);right:8px;width:186px;gap:4px;padding:4px}.in-town .townbar button{min-height:48px;font-size:10px}.in-town .townbar .interface-icon{width:22px;height:22px}.in-town .botdock{display:none}
 body:has(dialog[open]) #mobileBottomNav,body:has(dialog[open]) #mobileQuestToggle,body:has(dialog[open]) #healingTarget{visibility:hidden}
 #modal button,#modal .close{min-height:44px}#modal .close{min-width:44px}
 .topnav .player-tools button,.topnav .righttools button{min-height:44px}
 .game-tooltip{max-width:min(280px,calc(100vw - 16px));font-size:11px;pointer-events:none}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){
 #game{--combat-bottom:calc(var(--hud-bottom) + 12px)}
 .quicknav{right:48px;top:0}#menuToggle{top:0}#hudCredits{top:59px;right:120px}
 .minimap,.in-town .minimap{top:58px;width:96px}.minimap canvas{width:86px;height:50px}#networkStatus,.in-town #networkStatus{top:143px;right:8px;width:96px;min-height:44px}
 #performanceStatus{bottom:var(--hud-bottom)!important;right:210px!important}
 #mobileQuestToggle{top:108px;width:178px}#questTracker{top:154px;width:210px;max-height:calc(100dvh - 174px)}
 #targetPanel,#targetPanel.is-boss{left:50%;transform:translateX(-50%);top:12px;max-width:240px}#eliteModeButton,#healingTarget{top:54px!important;left:198px!important;width:214px!important;max-width:214px}
 #movementPad,.in-town #movementPad{width:104px;height:104px;bottom:calc(var(--hud-bottom) + 15px)}
 #mobileBottomNav{bottom:var(--hud-bottom);left:calc(50% - 20px);width:216px}
 #socialDock,.in-town #socialDock{left:135px;bottom:var(--hud-bottom)}#messages,.in-town #messages{left:135px;bottom:calc(var(--hud-bottom) + 100px)}
 .bottomhud .actiondock{width:176px;height:180px}.actiondock .skills button{width:46px;height:46px;min-height:46px}.actiondock .skills button:nth-child(4){left:83px;bottom:129px}#skillPage{bottom:90px}
 .bottomhud .actiondock #potionBtn{bottom:0;top:auto;right:190px}.bottomhud .actiondock #etherBtn{bottom:0;top:auto;right:240px}.bottomhud .actiondock #mobileHome{bottom:51px;right:190px}
 .bottomhud .botdock{right:205px;bottom:calc(var(--hud-bottom) + 118px);width:120px}.in-town .townbar{bottom:calc(var(--hud-bottom) + 8px)}
 #chatPanel,.chat-open #chatPanel{left:135px;bottom:60px;width:min(340px,calc(100vw - 360px));max-height:calc(100dvh - 76px)}
}
@media(max-width:374px) and (orientation:portrait){.hud .player{width:168px}.hud .player #portrait{width:28px}#mobileQuestToggle{width:173px}.bottomhud .actiondock{right:8px;width:178px}#movementPad,.in-town #movementPad{width:100px;height:100px;left:8px}}
@media(orientation:portrait) and (max-width:900px){#mobileQuestToggle{top:calc(108px + max(8px,env(safe-area-inset-top)))}.minimap,.in-town .minimap{top:calc(100px + max(8px,env(safe-area-inset-top)))}#targetPanel,#targetPanel.is-boss{top:calc(163px + max(8px,env(safe-area-inset-top)))}#networkStatus,.in-town #networkStatus{top:calc(194px + max(8px,env(safe-area-inset-top)))}#healingTarget{top:calc(212px + max(8px,env(safe-area-inset-top)))}#questTracker{top:calc(154px + max(8px,env(safe-area-inset-top)))}}
@media(orientation:portrait) and (max-height:740px){.bottomhud .actiondock #potionBtn{bottom:202px;right:98px}.bottomhud .actiondock #etherBtn{bottom:202px;right:49px}.bottomhud .botdock{left:8px;right:auto;bottom:calc(var(--combat-bottom) + 213px);width:128px}#healingTarget{top:214px;max-width:200px}#healingTarget strong{max-width:125px}#socialDock,.in-town #socialDock{bottom:calc(var(--combat-bottom) + 134px)}}
@media(max-width:1200px),(max-height:600px) and (max-width:1200px){.topnav .player-tools #upgradeNotice:not([hidden]){display:block!important;position:static;width:auto}.menu-open .hud{z-index:20}.menu-open #eliteModeButton{visibility:hidden}}
/* Visible objective and progress remain on the play surface, including towns. */
@media(min-width:1201px){.in-town #questTracker{display:block}}
@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 .hud .player{border-color:#74c5dc;background:linear-gradient(130deg,#173349ef,#071829ed);box-shadow:inset 0 1px #9becff55,0 0 8px #37a9d22b;border-radius:3px 13px 3px 13px}
 #mobileQuestToggle{display:flex;flex-direction:column;align-items:stretch;gap:4px;height:98px;padding:6px 8px;background:linear-gradient(135deg,#0f3449e8,#081a2bee);border-color:#73bdcf9c;box-shadow:inset 0 1px #b1efff21,0 3px 10px #0004}
 #mobileQuestToggle>span{display:block;flex:none;-webkit-line-clamp:unset;overflow:visible}#mobileQuestToggle .quest-kicker{font-size:9px;color:#a9e9ef;display:flex;justify-content:space-between;padding-bottom:3px;border-bottom:1px solid #6a9ba947}#mobileQuestToggle .quest-title{font-size:11px;color:#f3d791;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#mobileQuestToggle .quest-objective{font-size:10px;color:#d6e6ea;line-height:1.4;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:1}#mobileQuestToggle .quest-meter{display:flex;align-items:center;gap:6px}#mobileQuestToggle .quest-meter>i{flex:1;background:#0007;height:4px;border-radius:6px;overflow:hidden}#mobileQuestToggle .quest-meter em{display:block;height:100%;background:linear-gradient(90deg,#d4b452,#ffe29a)}#mobileQuestToggle .quest-meter b{font-size:9px;font-weight:400;color:#cfe7ed}
 #questTracker{top:216px}#targetPanel,#targetPanel.is-boss{top:221px}#eliteModeButton{top:270px!important}
}
@media(orientation:portrait) and (max-width:900px){
 .hud .player{width:min(176px,calc(100vw - 200px))}.hud .player #portrait{width:28px}
 .quicknav{right:46px;top:34px}#menuToggle{top:34px}#hudCredits{top:max(8px,env(safe-area-inset-top));right:8px;width:182px;max-width:182px;height:28px;padding:2px 8px;line-height:22px;text-align:left;border-radius:5px;color:#f9d991}
 #questTracker{top:calc(208px + max(8px,env(safe-area-inset-top)))}#targetPanel,#targetPanel.is-boss{top:calc(213px + max(8px,env(safe-area-inset-top)))}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){#mobileQuestToggle{height:86px}#questTracker{top:198px;max-height:calc(100dvh - 220px)}#targetPanel,#targetPanel.is-boss{top:12px}#eliteModeButton{top:54px!important}}

/* Compact controls retain 44px touch targets; quest visibility is device-local. */
#questVisibilityControls{position:absolute;left:12px;top:210px;display:flex;gap:4px;z-index:10;pointer-events:auto}
#questVisibilityControls button{min-height:44px;min-width:44px;padding:4px 9px;background:#09233485;border:1px solid #8ac2d36b;color:#e2f3f7;font-size:11px;border-radius:9px}
#questVisibilityControls button[hidden]{display:none}
body[data-quest-visibility="hidden"] #mobileQuestToggle,body[data-quest-visibility="folded"] #mobileQuestToggle,body[data-quest-visibility="hidden"] #questTracker,body[data-quest-visibility="folded"] #questTracker{display:none!important}
#questTracker{background:#071b2a80!important;backdrop-filter:none!important}
@media(max-width:900px),(pointer:coarse) and (max-width:1200px),(max-height:600px) and (max-width:1200px){
 #questVisibilityControls{left:8px;top:calc(108px + max(8px,env(safe-area-inset-top)))}
 #mobileQuestToggle{top:calc(155px + max(8px,env(safe-area-inset-top)))!important;height:82px;background:#0b263b70!important;box-shadow:none!important;backdrop-filter:none!important}
 #mobileQuestToggle .quest-kicker{display:none}#mobileQuestToggle .quest-objective{color:#f2f6fa;text-shadow:0 1px 2px #000}
 #questTracker{top:calc(240px + max(8px,env(safe-area-inset-top)))!important;max-height:calc(100dvh - 300px)}
 .bottomhud .botdock{left:auto!important;right:10px!important;bottom:calc(var(--combat-bottom) + 149px)!important;width:44px!important;height:44px;min-height:44px;border:0;background:transparent!important;padding:0;box-shadow:none}
 .bottomhud .botdock #autoBtn{position:relative;display:flex;align-items:center;justify-content:center;width:44px!important;min-width:44px;height:44px;min-height:44px;flex:0 0 44px!important;padding:0!important;border-radius:50%;background:#102a3b99;border:1px solid #85b7c677;font-size:11px!important;color:#c7d8e2}
 .bottomhud .botdock #autoBtn::before,.bottomhud .botdock #autoBtn #autotext,.bottomhud .botdock #autoBtn i{display:none!important}.bottomhud .botdock #autoBtn strong{font-size:11px;display:block}
 .bottomhud .botdock.active #autoBtn{background:#095248cc;border-color:#79ffd1;color:#a7ffe5;box-shadow:0 0 7px #58e0aa55}
 .bottomhud .botdock #autoBtn[aria-pressed="true"]::after{content:'';position:absolute;bottom:4px;width:4px;height:4px;border-radius:50%;background:#8effbf}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1200px){#questVisibilityControls{top:100px}#mobileQuestToggle{top:146px!important;height:70px}#questTracker{top:218px!important;max-height:calc(100dvh - 235px)}.bottomhud .botdock{bottom:calc(var(--combat-bottom) + 139px)!important}}
@media(min-width:1201px){#questTracker{top:258px!important}}

@media(max-width:374px) and (orientation:portrait){.actiondock .skills button:nth-child(4){left:76px}}
