#hotbar.action-bar{display:block;width:max-content;max-width:calc(100vw - 20px);bottom:78px;padding:5px 7px 7px;background:linear-gradient(#342d25,#101917);border:1px solid #bfa36e;box-shadow:0 3px 18px #0009;z-index:30;}
.bar-handle,.book-handle{display:flex;align-items:center;gap:14px;justify-content:space-between;cursor:grab;touch-action:none;color:#e6cea0;font:10px system-ui;min-height:23px;}
.bar-handle button,.book-handle button{background:transparent;border:0;color:#ead4a7;cursor:pointer;font:11px system-ui;}
.bar-slots{display:flex;gap:4px}.action-bar .skill-slot{position:relative;width:54px;height:62px;padding:3px;border:1px solid #8f7a52;background:#091110;overflow:hidden;cursor:pointer;}
.action-bar .skill-slot b{z-index:2}.action-bar .skill-slot small{position:absolute;bottom:3px;left:1px;right:1px;font-size:8px;white-space:nowrap;overflow:hidden;}
.action-icon{display:grid!important;place-items:center;width:38px;height:38px;margin:1px auto 10px;color:#e9faff;font-size:25px!important;text-shadow:0 0 7px var(--spell-color);border-radius:5px;background:radial-gradient(ellipse at 50% 75%,var(--spell-color),#172839 48%,#080d14 85%);box-shadow:inset 0 0 0 1px #d5e6f022;}
.action-icon.hp,.action-icon.mp{background:radial-gradient(ellipse at 50% 70%,var(--spell-color),#0c1723 70%);font-size:23px!important;}
.slot-count{position:absolute;right:3px;top:3px;color:#fff;font:9px system-ui;font-style:normal;}.slot-timer{position:absolute;inset:12px 0 15px;display:grid;place-items:center;font:700 22px system-ui;font-style:normal;color:#fff;text-shadow:0 2px 3px #000;pointer-events:none;}
.on-cooldown .action-icon{filter:brightness(.45)}.buff-active{box-shadow:inset 0 0 10px #7ef095!important}.action-bar .locked .action-icon{filter:saturate(.3) brightness(.5)}
.skill-book{position:fixed;z-index:40;left:24px;top:155px;width:350px;max-width:calc(100vw - 24px);max-height:65vh;padding:12px;border:1px solid #baa273;background:#121d1bf5;color:#e6ddc7;box-shadow:0 8px 25px #0008;pointer-events:auto;}
.skill-book[hidden]{display:none}.skill-book p{font:11px/1.5 system-ui;color:#b9b8a4;margin:9px 0}.book-actions{overflow:auto;max-height:calc(65vh - 85px)}.book-action{display:flex;align-items:center;gap:9px;margin:6px 0;padding:6px;background:#ffffff06;border:1px solid #c9ad721c;}.book-action>button{flex-shrink:0;background:#152622;border:1px solid #857452;color:#e5d4a9;padding:3px;cursor:pointer;}.book-action>div{flex:1}.book-action strong{display:block;font:12px system-ui}.book-action small{display:block;color:#b0b7aa;font:10px/1.5 system-ui}.book-action .action-icon{margin:0}.book-action em{color:#8ccb97;font-size:12px}.picked{outline:2px solid #e7c577}.book-action button:disabled{opacity:.35;cursor:default}
@media(max-width:700px){#hotbar.action-bar{bottom:12px;max-width:calc(100vw - 12px);padding:3px}.bar-slots{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.action-bar .skill-slot{width:46px;height:47px}.action-icon{width:29px;height:29px;font-size:21px!important}.bar-handle{font-size:8px;gap:5px}.skill-book{left:12px;top:100px}.mobile-attack,.mobile-joystick{bottom:165px!important}}
/* Resource rows participate in layout instead of floating over the character. */
#leftPanel{display:block;position:absolute;left:max(10px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));width:290px;transform:none;overflow:visible;background:#111c1beF;border:1px solid #8a7955;border-radius:8px;padding:8px;box-sizing:border-box;}
#leftPanel .character-card{display:grid;grid-template-columns:45px minmax(0,1fr);gap:9px;padding:0 0 7px;min-height:0;border:0;background:none;box-shadow:none;align-items:center;}
#leftPanel .character-card:before{display:none}#leftPanel .portrait{width:42px;height:45px;font-size:22px}#leftPanel .character-card strong{font-size:16px;line-height:1.25;margin:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}#leftPanel .character-card>div{min-width:0}#leftPanel .character-card>div:last-child{display:grid!important}#leftPanel .character-card span{font-size:10px}
#leftPanel>.resource,#leftPanel>.xp-row{position:static!important;display:grid!important;grid-template-columns:26px minmax(0,1fr) 72px;align-items:center;gap:7px;width:auto!important;margin:4px 0!important;padding:0!important;height:17px;transform:none!important;}
#leftPanel .resource>div,#leftPanel .xp-row>div{width:auto!important;height:12px;min-width:0;overflow:hidden;border:1px solid #040907;border-radius:3px;background:#08120e;}
#leftPanel .resource>span,#leftPanel .xp-row>span{font:700 9px system-ui;text-align:left}#leftPanel .resource>b,#leftPanel .xp-row>b{position:static;display:block;min-width:0;font:700 10px system-ui;text-align:right;white-space:nowrap;color:#e0e8e2;}
#leftPanel .wallet-row{position:static;margin:7px 0 0;width:auto;padding:3px 0 0;border:0;border-top:1px solid #c4b78533;background:none;height:22px;font-size:10px}#leftPanel .wallet-row span{font-size:13px}
.topbar .account-button{display:none!important}.topbar .server-state{top:10px;font-size:9px}.topbar .zone-title{width:185px}.right-hud{right:10px;width:185px}.minimap>div{display:flex!important;flex-wrap:wrap;gap:4px;padding:5px;font-size:10px!important}.minimap canvas{width:100%;height:auto!important;aspect-ratio:210/150;display:block;}#mapCoords{font-size:11px;color:#fff2bd;white-space:nowrap}
#gameShell button{touch-action:manipulation}#world,#joystick,#gameShell #mobileAttack{touch-action:none}#hotbar,.skill-book{touch-action:manipulation;user-select:none;-webkit-user-select:none}#gameShell{overscroll-behavior:none}
@media(max-width:900px){
 #gameShell>.topbar{height:0;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none;pointer-events:none}#gameShell>.topbar .brand,#gameShell>.topbar .exit-button{display:none}#gameShell>.topbar .zone-title{left:auto;transform:none;right:6px;border:1px solid #8a7955;border-radius:5px;display:grid}#gameShell>.topbar .zone-title small{display:block}#soundToggle{position:absolute;left:76px;top:145px;height:29px;pointer-events:auto;background:#152820;border:1px solid #8c7a55;border-radius:4px}
 #leftPanel{width:190px;left:6px;top:6px;padding:6px;max-height:none;bottom:auto}#leftPanel .character-card{grid-template-columns:30px minmax(0,1fr);gap:6px}#leftPanel .portrait{width:29px;height:34px;font-size:16px}#leftPanel .character-card strong{font-size:12px}#leftPanel .character-card small{font-size:7px}#leftPanel .character-card span{font-size:8px}#leftPanel>.resource,#leftPanel>.xp-row{grid-template-columns:20px minmax(0,1fr) 57px;gap:4px;height:14px;margin:2px 0!important}#leftPanel .resource>b,#leftPanel .xp-row>b{font-size:8px}#leftPanel .wallet-row{height:18px;margin-top:4px;font-size:9px}
 .topbar .zone-title{right:6px;top:6px;width:124px;padding:4px}.topbar .zone-title small{font-size:6px}.topbar .zone-title strong{font-size:11px}.topbar .server-state{display:none}.right-hud{top:49px;right:6px;width:124px}#worldClock{display:none}#huntingCaption{font-size:8px;padding:3px}.field-map-toggle{font-size:9px;padding:4px}
 #panelContent{display:none;top:160px;left:8px;right:auto;width:min(320px,calc(100vw - 16px));max-height:calc(100dvh - 330px)}#leftPanel.open #panelContent{display:block}.chat{display:none!important}.panel-nav{display:none!important}.mobile-menu{display:block!important;position:absolute;left:8px;top:145px;background:#152820;color:#e8d4a1;border:1px solid #8c7a55;border-radius:4px;padding:6px 10px;font-size:11px;z-index:31;touch-action:manipulation}.panel-nav.mobile-open{display:flex!important;flex-wrap:wrap;left:8px;right:auto;top:177px;bottom:auto;transform:none;max-width:280px;z-index:35}.panel-nav.mobile-open button{display:grid!important;width:65px;height:48px}.target-card{display:block;top:200px;left:8px;transform:none;width:155px;padding:6px;pointer-events:none}.target-card[hidden]{display:none}.target-card strong{font-size:11px}.target-card small,.target-card span{font-size:8px}.mouse-guide{display:none!important}
}
@media(max-width:900px) and (orientation:landscape){#hotbar.action-bar{bottom:8px}.bar-slots{display:flex}.action-bar .skill-slot{width:43px;height:48px}.mobile-attack,.mobile-joystick{bottom:20px!important}.mobile-attack{right:12px;width:50px;height:50px}.mobile-joystick{left:15px;width:68px;height:68px}.skill-book{top:10px;left:205px;max-height:90dvh}.book-actions{max-height:calc(90dvh - 85px)}.target-card{top:165px}.right-hud{width:110px}.topbar .zone-title{width:110px}}
/* Persisted settings use independent layout regions, including a compact HUD. */
#leftPanel{transform:scale(var(--hud-scale,.65));transform-origin:top left}#panelContent[hidden]{display:none!important}.chat{width:min(510px,calc(100vw - 24px))}.game-settings{width:min(530px,calc(100vw - 24px));max-height:85dvh;padding:0!important;color:#e7e7dc}.game-settings>header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #b69a5944}.game-settings h2{margin:4px 0;font:22px Georgia,serif}.game-settings header small{font:9px system-ui;color:#c9b178;letter-spacing:2px}.game-settings button{background:#283b33;color:#e5d7b6;border:1px solid #af9259;border-radius:5px;padding:7px 12px}.settings-scroll{max-height:65dvh;overflow:auto;padding:0 20px 16px}.game-settings section{padding:12px 0;border-bottom:1px solid #b69a5928}.game-settings h3{font:13px system-ui;color:#dfc78f;margin:3px 0 14px}.game-settings label{display:grid;grid-template-columns:1fr auto;gap:9px;font:12px system-ui;margin:12px 0;align-items:center}.game-settings input[type=range]{grid-column:1/-1;width:100%;accent-color:#c6aa68}.game-settings select{background:#12251f;color:#e6e8d7;padding:8px;border:1px solid #bda06366;border-radius:4px;max-width:200px}.game-settings label small{grid-column:1/-1;color:#99ada1;font-size:10px}.game-settings .setting-check{display:flex;gap:10px}.setting-check input{accent-color:#c6aa68}.settings-note{font:11px/1.7 system-ui;color:#9cad9f}.game-settings output{color:#e6c986;font:12px system-ui}
.vertical-skills #hotbar.action-bar{left:auto;right:12px;top:230px;bottom:auto;transform:none;width:72px;max-height:calc(100dvh - 240px);overflow:auto}.vertical-skills .bar-slots{display:grid;grid-template-columns:1fr}.vertical-skills .bar-handle{flex-direction:column;gap:5px}.vertical-skills .bar-handle>span{font-size:8px}.vertical-skills .bar-handle button{font-size:9px}.vertical-skills .skill-slot{width:54px;height:51px}.vertical-skills .action-icon{width:32px;height:30px}.vertical-skills .bar-handle{padding-bottom:6px}
@media(max-width:900px){#leftPanel{transform:scale(max(.85,var(--hud-scale,.65)))}.mobile-menu{top:125px}#soundToggle{top:125px}.vertical-skills #hotbar.action-bar{top:205px;right:6px;max-height:calc(100dvh - 225px);width:59px}.vertical-skills .skill-slot{width:46px;height:45px}.vertical-skills .action-icon{width:27px;height:27px}.settings-scroll{max-height:65dvh;padding:0 12px 12px}.game-settings select{max-width:155px}}
.area-arrival{position:absolute;top:18%;left:50%;transform:translateX(-50%);z-index:18;text-align:center;pointer-events:none;opacity:0;width:min(620px,80vw);color:#eed396;text-shadow:0 2px 5px #101914,0 0 20px #a3763944}.area-arrival.show{animation:area-arrive 3.5s ease both}.area-arrival>span{display:block;font:9px system-ui;letter-spacing:4px;color:#e7e0c7}.area-arrival strong{display:block;font:italic 46px Georgia,'Times New Roman',serif;letter-spacing:1px;margin:9px 0}.area-arrival i{display:block;width:160px;height:1px;margin:auto;background:linear-gradient(90deg,transparent,#ebcc87,transparent)}@keyframes area-arrive{0%{opacity:0;translate:0 8px}15%,75%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -6px}}@media(max-width:700px){.area-arrival{top:25%}.area-arrival strong{font-size:32px}.area-arrival>span{font-size:7px;letter-spacing:2px}}
/* A compact bar keeps its real layout bounds for dragging and mobile hit testing. */
#hotbar.action-bar .skill-slot{width:48.6px;height:55.8px}#hotbar.action-bar .action-icon{width:34.2px;height:34.2px;font-size:22.5px!important}#hotbar.action-bar .bar-slots{gap:3.6px}#hotbar.action-bar .bar-handle{gap:8px;font-size:9px}#hotbar.action-bar .bar-handle button{min-height:28px;font-size:10px;padding:2px 4px}
.mp-status{position:absolute;left:50%;transform:translateX(-50%);top:48px;z-index:32;background:#122322e8;border:1px solid #9a8559;color:#ecd8a5;padding:5px 10px;font-size:10px;pointer-events:none}.mp-status[hidden],.mp-party[hidden],.mp-invite[hidden]{display:none}
.mp-party{position:absolute;left:10px;top:180px;width:205px;z-index:33;padding:7px;background:#111e1ef0;border:1px solid #a28c5e;border-radius:6px;color:#f1e0b6;font-size:11px;max-height:50vh;overflow:auto}.mp-party header{display:flex;justify-content:space-between;align-items:center}.mp-party article{display:flex;align-items:center;gap:3px;margin-top:5px}.mp-party button,.mp-invite button{border:1px solid #a28c5e;background:#21332f;color:#f1e0b6;border-radius:3px;cursor:pointer;min-height:30px}.mp-member{flex:1;min-width:0;text-align:left;padding:4px}.mp-member>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mp-member small{font-size:9px;color:#b6c7c4}.mp-member i{display:block;height:5px;background:#08100e;margin:3px 0;overflow:hidden}.mp-member em{display:block;height:100%;background:#c73343}.mp-member .mp-mp em{background:#398bd5}.mp-invite{position:absolute;z-index:65;top:25%;left:50%;transform:translateX(-50%);width:min(330px,90vw);padding:18px;background:#142520;border:1px solid #d2b16d;box-shadow:0 8px 40px #000a;text-align:center}.mp-invite div{display:flex;gap:10px;justify-content:center;margin-top:12px}.mp-invite button{padding:8px 15px}
@media(max-width:900px){
 #gameShell .mobile-menu{display:block!important;position:absolute;z-index:55;top:132px;left:8px;min-height:40px;pointer-events:auto}
 #gameShell #soundToggle{display:grid!important;position:fixed!important;z-index:56!important;left:90px;top:132px;width:40px;height:40px;pointer-events:auto!important;visibility:visible!important}
 #gameShell>.topbar{z-index:54!important;overflow:visible!important}
 #gameShell>.panel-nav{display:none!important;pointer-events:none}
 #gameShell>.panel-nav.mobile-open{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));position:absolute!important;left:8px!important;right:auto!important;top:178px!important;bottom:auto!important;width:260px!important;max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 190px);overflow:auto;transform:none!important;z-index:54!important;pointer-events:auto!important;visibility:visible!important;background:#13251cf7;border:1px solid #a08d62;padding:6px}
 #gameShell>.panel-nav.mobile-open button{display:grid!important;width:100%!important;min-height:48px;pointer-events:auto!important}
 #gameShell>.panel-nav.mobile-open b{display:block!important;font-size:10px}
 #hotbar.action-bar .skill-slot{width:41.4px;height:44px}#hotbar.action-bar .action-icon{width:26.1px;height:26.1px;font-size:18.9px!important}#hotbar.action-bar .bar-handle{flex-wrap:wrap;gap:2px}#hotbar.action-bar .bar-handle>span{display:none}#hotbar.action-bar .bar-handle button{font-size:9px;min-height:30px;padding:3px}.vertical-skills #hotbar.action-bar{width:56px}.vertical-skills #hotbar.action-bar .bar-handle button{width:100%;font-size:8px}
 .mp-party{top:182px;left:6px;width:148px;max-height:32dvh;padding:4px}.mp-party article>button:not(.mp-member){width:26px;min-height:32px;padding:1px}.mp-member small{font-size:8px}.mp-status{top:175px;font-size:8px;max-width:80vw}
}
@media(min-width:901px){#gameShell>.panel-nav button[data-panel="party"]{display:grid!important}}
#gameShell>.panel-nav.mobile-open button[hidden]{display:none!important}

/* Dispatch a completed tap directly; keep dragging and keyboard activation. */
#gameShell button{touch-action:manipulation}
#hotbar .action-pressed,#hotbar .action-sent{filter:brightness(1.35);box-shadow:inset 0 0 10px #99dfff80}
#hotbar [aria-busy="true"]::after{content:"…";position:absolute;right:3px;bottom:12px;color:#c4eaff;font-weight:bold}
