/* Phone/tablet controls share the game's forest/bronze palette. */
#joystick,#mobile-action-banks,#mobile-chat,#mobile-chat-close,#mobile-fullscreen{display:none}
.touch-layout .game{position:fixed;top:var(--viewport-top,0px);left:0;right:0;height:var(--game-height,100dvh);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-sizing:border-box;isolation:isolate;overscroll-behavior:none}
.touch-layout .game-header{height:40px;min-height:40px;padding:0 8px;gap:8px}
.touch-layout .game-header .brand{font-size:23px;margin:0}.touch-layout .game-header .brand span,.touch-layout #sound,.touch-layout #editor-link,.touch-layout .mobile-panel-toggle{display:none}
.touch-layout .game-header .location{margin-right:auto;min-width:0;gap:1px}.touch-layout .location strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:42vw}.touch-layout .location>span{font-size:9px}
.touch-layout .game-header button{height:36px;min-height:36px;padding:5px 9px;font-size:12px;touch-action:manipulation}
.touch-layout #mobile-chat,.touch-layout #mobile-fullscreen{display:inline-flex;align-items:center;justify-content:center;gap:4px}.touch-layout #mobile-fullscreen{font-size:21px;min-width:36px}.touch-layout #mobile-chat-count:empty{display:none}.touch-layout #mobile-chat-count{color:#f4d69a;font-size:10px}
.touch-layout .dock-toolbar{height:40px;min-height:40px;max-height:40px;padding:3px 6px;flex-wrap:nowrap;overflow:auto hidden;gap:4px;scrollbar-width:none;touch-action:pan-x}
.touch-layout .dock-toolbar button{flex-shrink:0;min-height:34px;padding:4px 10px;font-size:12px}.touch-layout .dock-toolbar .dock-mobile-close{display:none}.touch-layout .dock-toolbar #autoloot-settings{margin-left:0}
.touch-layout .game-layout{display:block;position:relative;flex:1;min-height:0;min-width:0;overflow:hidden}
.touch-layout .world-panel{position:absolute;inset:0;min-height:0;width:100%;height:100%;border:1px solid #52634a55}
.touch-layout #world{image-rendering:auto}
.touch-layout .dock-column{display:none;position:absolute;top:0;bottom:0;width:min(300px,88%);height:100%;z-index:12;box-shadow:0 6px 24px #000b;overflow:hidden}.touch-layout .dock-left{left:0}.touch-layout .dock-right{right:0}.touch-layout .dock-column.mobile-open{display:flex}
.touch-layout .dock-panel{display:none;max-height:100%}.touch-layout .dock-panel.mobile-selected:not([hidden]){display:flex}.touch-layout .dock-heading{height:40px;min-height:40px;padding-left:10px}.touch-layout .dock-heading strong{font-size:13px}.touch-layout .dock-heading button{width:38px;height:38px;font-size:21px}.touch-layout .dock-resize{display:none}.touch-layout .dock-content{padding:8px;overscroll-behavior:contain}.touch-layout .dock-content .minimap-card{max-height:none}
.touch-layout .game-bottom{position:relative;flex:none;display:block;height:184px;min-height:184px;max-height:184px;padding:0;border-top:1px solid #69714e99}
.touch-layout .action-area{height:100%;padding:5px 8px;display:flex;flex-direction:column;gap:5px;min-height:0;overflow:hidden}
.touch-layout .action-title{flex:none;height:32px;min-height:32px;margin:0;gap:5px;display:flex;flex-wrap:nowrap;justify-content:flex-start}
.touch-layout .action-title>button{font-size:11px;min-height:32px;height:32px;padding:4px 8px}
.touch-layout .action-title #binding-sets{gap:3px}.touch-layout .action-title #binding-sets button{height:32px;min-width:32px;padding:4px 6px;font-size:12px}.touch-layout .action-title #binding-sets #default-bindings{min-width:68px}
.touch-layout #mobile-action-banks{display:flex;gap:4px;flex:none;height:30px}.touch-layout #mobile-action-banks button{flex:1;padding:4px;min-height:30px;font-size:11px;border-radius:3px;background:#18271f;color:#9eaf9d;touch-action:manipulation}.touch-layout #mobile-action-banks button[aria-pressed=true]{color:#eedbaa;border-color:#9a8f5c;background:#34432e}
.touch-layout .hotbar{flex:1;min-height:0;display:block}.touch-layout .hotbar-row{display:none;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;height:100%;grid-auto-rows:minmax(44px,1fr)}
.touch-layout #game[data-action-bank=combat] .hotbar-row.row-0,.touch-layout #game[data-action-bank=utility] .hotbar-row.row-1{display:grid}
.touch-layout .hotkey{height:auto;max-width:none;min-height:44px;border-radius:4px;touch-action:manipulation;position:relative;background:linear-gradient(135deg,#31422d,#1a2a23);border-color:#78815d70}
.touch-layout .hotkey .key{left:4px;top:3px;font-size:9px;color:#e7d49e}.touch-layout .hotkey .glyph{height:32px;min-height:32px;padding:0;display:flex;align-items:center;justify-content:center;line-height:1}
.touch-layout .hotkey .glyph .action-symbol,.touch-layout .hotkey .physical-item{width:30px;height:30px}.touch-layout .hotkey .ability-name{display:none}.touch-layout .hotkey .cooldown{font-size:18px}.touch-layout .key-help{display:none}
.touch-layout .chat{display:none}.touch-layout .game.chat-open .chat{display:flex;position:fixed;z-index:35;top:calc(var(--viewport-top,0px) + 8px + env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));height:calc(var(--game-height,100dvh) - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-width:640px;margin:0 auto;background:#14231bf5;border:1px solid #bca66a;box-shadow:0 0 0 100vmax #030b07a6;overflow:hidden;border-radius:6px}
.touch-layout .chat-tabs{height:44px;min-height:44px;align-items:stretch;padding:0 3px}.touch-layout .chat-tabs button{min-width:0;min-height:44px;font-size:12px;padding:5px;flex:1}.touch-layout #mobile-chat-close{display:block;flex:0 0 40px;font-size:25px;color:#e7d9b7}.touch-layout #chat-log{height:auto;flex:1;min-height:0;font-size:13px;overscroll-behavior:contain;padding:12px}.touch-layout #chat-form{height:48px;min-height:48px;flex:none;padding:0 9px}.touch-layout #chat-form input{font-size:16px;height:44px}.touch-layout #chat-form button{height:44px;min-width:44px}.touch-layout #chat-form>span{font-size:10px}
.touch-layout #joystick{display:grid;place-items:center;position:absolute;z-index:8;width:116px;height:116px;left:12px;bottom:12px;border:1px solid #b7ad7970;border-radius:50%;background:radial-gradient(circle,#33433487 0 45%,#17261eb0 46% 67%,#91a88040 68% 69%,#17261e9c 70%);box-shadow:inset 0 1px 8px #0005,0 3px 14px #0004;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:grab;outline-offset:4px}
.joystick-knob{width:44px;height:44px;border:1px solid #d6c798b3;border-radius:50%;background:radial-gradient(circle at 35% 27%,#a3b18d,#52694c 48%,#263e31 100%);box-shadow:0 3px 8px #0009,inset 0 1px 2px #f3e5b45e;pointer-events:none;will-change:transform;transition:transform .12s ease-out}
#joystick:before,#joystick:after{content:'';position:absolute;width:3px;height:86px;border-top:4px solid #b9c4a075;border-bottom:4px solid #b9c4a075;pointer-events:none}#joystick:after{transform:rotate(90deg)}
#joystick.held{border-color:#e2ce8b;cursor:grabbing;background-color:#546c3d38}#joystick.held .joystick-knob{transition:none}
.touch-layout .world-top{top:8px;right:8px;left:auto}.touch-layout .world-top>span{display:none}.touch-layout .world-top button{font-size:10px;padding:6px;min-height:30px}
.touch-layout .mobile-vitals{display:flex;position:absolute;top:8px;left:8px;gap:3px;flex-direction:row;pointer-events:none;font-size:11px;font-weight:500;text-shadow:0 1px 2px #000}.touch-layout .mobile-vitals span{padding:4px 6px;background:#14231bdf;border:1px solid #b0bfa12b;border-radius:3px}.touch-layout #mobile-hp{color:#f0b79c}.touch-layout #mobile-mp{color:#a6d5e2}
.touch-layout .buff-bar{top:38px;left:8px}.touch-layout .target-card{top:65px;right:8px;max-width:150px;font-size:10px;padding:5px}
.touch-layout .world-bottom{left:140px;bottom:12px;right:10px;pointer-events:none}.touch-layout .world-bottom>span{display:none}.touch-layout #interact{margin-left:auto;pointer-events:auto;min-height:44px;max-width:180px;padding:6px 10px;font-size:12px;white-space:normal}
.touch-layout .toast{bottom:136px;max-width:85%;font-size:12px}.touch-layout .connection-overlay{z-index:25}
.touch-layout #modal{max-width:calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right));max-height:calc(var(--game-height,100dvh) - 16px);overflow:auto;overscroll-behavior:contain}.touch-layout #modal input,.touch-layout #modal select,.touch-layout #modal textarea{font-size:16px}.touch-layout #modal-close{min-height:40px;min-width:40px}
@media(orientation:landscape){
 .touch-layout .game{--action-rail:208px;--top-controls:74px}.touch-layout .game-header{height:36px;min-height:36px}.touch-layout .dock-toolbar{height:38px;min-height:38px;max-height:38px}.touch-layout .dock-toolbar button{min-height:32px;padding:4px 9px}
 .touch-layout .game-layout{margin-right:var(--action-rail)}.touch-layout .game-bottom{position:absolute;top:calc(var(--top-controls) + env(safe-area-inset-top));bottom:env(safe-area-inset-bottom);right:env(safe-area-inset-right);width:var(--action-rail);height:auto;min-height:0;max-height:none;border-top:0;border-left:1px solid #69714e99}
 .touch-layout .action-area{padding:5px;gap:4px}.touch-layout .action-title{height:auto;min-height:0;flex-wrap:wrap;gap:4px}.touch-layout #book-button{width:100%;height:28px;min-height:28px;font-size:11px}.touch-layout .action-title #binding-sets{width:100%;gap:4px}.touch-layout .action-title #binding-sets button{flex:1;height:30px;min-height:30px}.touch-layout .action-title #binding-sets #default-bindings{flex:2;min-width:76px}
 .touch-layout #mobile-action-banks{height:28px}.touch-layout #mobile-action-banks button{min-height:28px;font-size:10px}.touch-layout .hotbar{flex:initial;height:auto;min-height:0}.touch-layout .hotbar-row{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(44px,13.2dvh,60px);height:auto;gap:4px}
 .touch-layout .hotkey .glyph{height:100%;min-height:0;padding-top:4px}.touch-layout .hotkey .glyph .action-symbol,.touch-layout .hotkey .physical-item{width:30px;height:30px}.touch-layout .mobile-vitals{font-size:10px}.touch-layout .world-top button{font-size:9px;min-height:26px;padding:4px}.touch-layout .buff-bar{top:34px}.touch-layout .target-card{top:58px}
 .touch-layout #joystick{width:108px;height:108px;left:10px;bottom:10px}.touch-layout .joystick-knob{width:42px;height:42px}.touch-layout .world-bottom{left:128px}.touch-layout .toast{bottom:120px}
 .touch-layout .game-header .mobile-vitals{position:static;flex-direction:column;flex-shrink:0;gap:0;font-size:10px;line-height:13px;white-space:nowrap;margin-left:4px}.touch-layout .game-header .mobile-vitals span{padding:0;background:none;border:0}.touch-layout .game-header .location{flex:1;min-width:0}.touch-layout .game-header .location strong{max-width:100%}
 .touch-layout #hotbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(44px,13.2dvh,60px);gap:4px}.touch-layout #game[data-action-bank] #hotbar .hotbar-row{display:contents}.touch-layout #hotbar .hotkey{display:none}.touch-layout #game[data-action-bank=combat] #hotbar .hotkey[data-landscape-bank=combat],.touch-layout #game[data-action-bank=utility] #hotbar .hotkey[data-landscape-bank=utility]{display:block}
}
@media(orientation:landscape) and (max-height:340px){.touch-layout .game{--top-controls:68px}.touch-layout .game-header{height:34px;min-height:34px}.touch-layout .dock-toolbar{height:34px;min-height:34px;max-height:34px;padding-top:1px;padding-bottom:1px}.touch-layout .dock-toolbar button{min-height:30px}.touch-layout .hotbar-row{grid-auto-rows:44px}.touch-layout .action-area{gap:3px;padding:4px}.touch-layout #joystick{width:100px;height:100px}.touch-layout .joystick-knob{width:40px;height:40px}}
@media(orientation:portrait) and (max-width:360px){.touch-layout .action-title>button{padding:4px;font-size:10px}.touch-layout .action-title #binding-sets button{min-width:29px;padding:4px}.touch-layout .game-header{gap:4px}.touch-layout .game-header button{padding:5px 7px}}
@media(prefers-reduced-motion:reduce){.joystick-knob{transition:none}}