#mobile-hud{display:none}
body.touch-ui{display:block;position:fixed;inset:0;overscroll-behavior:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:#000}
.touch-ui #game-shell{position:fixed;left:0;top:0;transform-origin:top left}
.touch-ui #world{width:100%;height:100%;cursor:default}
.touch-ui #classic-hud,.touch-ui .tiny-status,.touch-ui .map-name,.touch-ui .utility,.touch-ui .hint,.touch-ui .quest-track,.touch-ui .mobile-notice{display:none}
.touch-ui #mobile-hud{display:block;position:absolute;inset:0;z-index:10;pointer-events:none}
#mobile-status{position:absolute;top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));display:flex;align-items:center;gap:8px;padding:5px 9px 5px 4px;background:#090806b8;border:1px solid #8b795988;box-shadow:0 1px 4px #000;color:#e8dcc1}
#mobile-status>img{width:46px;height:45px;image-rendering:pixelated}#mobile-status>div{display:grid;gap:2px;min-width:90px}#mobile-zone{font-size:11px;color:#cfbb8e}#mobile-hp{font:14px Arial;color:#f5dfbd}#mobile-gold{font:10px SimSun;color:#d9be71}
#mobile-nav{position:absolute;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));display:grid;grid-template-columns:repeat(4,44px);gap:4px;pointer-events:auto}
#mobile-hud button{touch-action:manipulation;min-width:44px;min-height:44px;padding:4px;color:#eddfbd;border:1px solid #8f7d57;background:#19150ee6;box-shadow:inset 0 0 0 1px #3b3222;font:12px SimSun}
#mobile-hud button:active{background:#5a492b}#mobile-hud button:focus-visible{outline:2px solid #efd78b}
#touch-joystick{position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));width:112px;height:112px;border:3px solid #938367;border-radius:50%;background:#18171180;box-shadow:inset 0 0 0 5px #09080677,0 2px 4px #0009;pointer-events:auto;touch-action:none;color:#c2b191;opacity:.78}
#touch-joystick.active{opacity:1;border-color:#c6b181}#touch-joystick>span{position:absolute;pointer-events:none;font:15px Arial}#touch-joystick .stick-n{top:4px;left:46px}#touch-joystick .stick-s{bottom:4px;left:46px}#touch-joystick .stick-w{top:43px;left:5px}#touch-joystick .stick-e{top:43px;right:5px}
#touch-thumb{position:absolute;left:calc(50% - 22px);top:calc(50% - 22px);width:44px;height:44px;border:3px outset #b9a47c;border-radius:50%;background:#5c5544;box-shadow:0 2px 5px #0009;pointer-events:none}
#mobile-actions{position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:72px 48px;gap:8px;align-items:end;pointer-events:auto}
#mobile-actions button{position:relative;width:48px;height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:3px}#mobile-actions img{width:27px;height:27px;object-fit:contain;image-rendering:pixelated;pointer-events:none}#mobile-actions span{font-size:10px;line-height:11px;pointer-events:none}
#mobile-actions #mobile-attack{grid-column:2/4;justify-self:end;width:72px;height:72px;border:3px outset #9e8a60;border-radius:50%;font-size:15px;background:#312619e8}#mobile-attack img{width:33px;height:33px}#mobile-attack span{font-size:14px;line-height:17px}
#mobile-mode[aria-pressed=true]{color:#ffe480;border-color:#d5b46b}#mobile-potion span{position:absolute;right:3px;bottom:2px;color:#fff5a5;font:11px Arial}
#touch-hint{position:absolute;left:14px;bottom:max(5px,calc(env(safe-area-inset-bottom) - 2px));font-size:9px;color:#c8b68f;text-shadow:1px 1px #000}
#mobile-hud.inactive #touch-joystick,#mobile-hud.inactive #mobile-actions,#mobile-hud.inactive #touch-hint{visibility:hidden}
.touch-ui #toast{top:100px;max-width:90%;width:max-content;white-space:normal;text-align:center;font-size:13px}
.touch-ui #target-bar{top:78px;left:50%;transform:translateX(-50%);width:150px}
.touch-ui #inventory{left:50%;top:50%;right:auto;transform:translate(-50%,-50%);width:min(440px,calc(100% - 24px));height:min(590px,calc(100% - 32px));background-size:100% 100%;z-index:16}
.touch-ui .inventory-caption{top:17px;left:18px;font-size:14px;max-width:calc(100% - 80px)}
.touch-ui #bag-grid{left:16px;right:16px;top:64px;width:auto;height:auto;max-height:calc(100% - 190px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:48px;gap:4px;scrollbar-width:thin}
.touch-ui .bag-slot{width:100%;height:48px;min-height:48px;background:#bba36e10;border:1px solid #6e5b393b;touch-action:manipulation}.touch-ui .bag-slot .item-icon{width:34px;height:34px;max-height:34px}
.touch-ui #bag-close{left:auto;right:8px;top:8px;width:44px;height:44px;color:#e9d5a9;background:#18130be6;border:1px solid #826b43;font-size:20px;touch-action:manipulation}
.touch-ui #capacity{top:auto;bottom:124px;left:18px;font-size:12px}.touch-ui #gold-bag{top:auto;bottom:124px;left:auto;right:18px;font-size:12px}
.touch-ui #item-detail{top:auto;bottom:67px;left:18px;width:calc(100% - 36px);height:48px;font:12px/20px SimSun}.touch-ui #item-detail strong{font-size:14px}
.touch-ui #equip-button{left:auto;top:auto;right:18px;bottom:16px;width:100px;height:44px;color:#f1db9f;background:#34281ae8;border:1px solid #957a49;font-size:14px;touch-action:manipulation}
.touch-ui #discard-button{left:18px;top:auto;bottom:16px;width:70px;height:44px;border-radius:0;color:#c5b187;background:#17130ee8;border:1px solid #6e5a3d;font-size:12px;touch-action:manipulation}
.touch-ui #character-window{left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--character-scale,1));transform-origin:center;z-index:16}
.touch-ui #character-close{left:0;top:22px;width:44px;height:44px;color:#dbba7e;background:#100d09d9;border:1px solid #776039;font-size:19px;touch-action:manipulation}
.touch-ui .equipped-slot{width:38px;height:36px;margin-left:-2px;margin-top:-2px;touch-action:manipulation}.touch-ui .character-tab{width:38px;height:42px;touch-action:manipulation}
.touch-ui #equipment-tooltip{max-width:calc(100% - 24px);font-size:12px;line-height:21px}
.touch-ui .dialog{left:50%;top:50%;width:min(416px,calc(100% - 24px));min-height:0;max-height:calc(100% - 24px);overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:24px;font-size:13px;line-height:1.6;z-index:24}
.touch-ui .dialog>.close-simple{position:sticky;float:right;top:0;right:0;margin:-16px -16px 0 0;width:44px;height:44px;min-height:44px;font-size:19px;color:#e5c88a;background:#141009eb;border:1px solid #776039;z-index:2;touch-action:manipulation}
.touch-ui .dialog h2{font-size:18px;min-height:25px;padding-right:24px}.touch-ui .dialog button{min-height:44px;touch-action:manipulation}.touch-ui .dialog dl{grid-template-columns:110px 1fr;gap:6px;font-size:12px}
.touch-ui .screen-overlay .dialog{position:relative;left:auto;top:auto;transform:none;max-height:calc(100% - 24px)}
.touch-ui .welcome{padding-top:28px}.touch-ui .welcome>button{height:48px}.touch-ui .equipment-shop button{min-width:0;flex:1;font-size:12px}.touch-ui .equipment-shop>div{height:auto;min-height:48px}.touch-ui .equipment-shop .item-icon{margin-right:0;flex-shrink:0}.touch-ui #travel-list button{min-height:44px;font-size:13px}
@media(orientation:portrait){.touch-ui #mobile-nav{grid-template-columns:repeat(2,44px)}.touch-ui #mobile-status{max-width:calc(100% - 122px)}}
@media(orientation:landscape){.touch-ui #mobile-status{padding:3px 7px 3px 3px}.touch-ui #mobile-status>img{width:38px;height:37px}.touch-ui #mobile-status>div{gap:0}.touch-ui #touch-joystick{bottom:max(14px,env(safe-area-inset-bottom));width:108px;height:108px}.touch-ui #mobile-actions{bottom:max(12px,env(safe-area-inset-bottom))}.touch-ui #touch-hint{display:none}.touch-ui #inventory{width:min(540px,calc(100% - 24px));height:calc(100% - 24px)}.touch-ui #bag-grid{grid-template-columns:repeat(8,minmax(0,1fr));max-height:calc(100% - 180px)}.touch-ui #toast{top:65px}}

.touch-ui #inventory{background-image:url('assets/original-ui/dialogue-wide-window.png')}
.touch-ui .screen-overlay{z-index:40}
.touch-ui.mobile-panel-open #touch-joystick,.touch-ui.mobile-panel-open #mobile-actions{opacity:.18;pointer-events:none}
.touch-ui.mobile-panel-open #touch-hint{visibility:hidden}

#mobile-hud button.pressed{background:#5a492b}

.touch-ui #target-bar{top:calc(max(10px,env(safe-area-inset-top)) + 68px)}
.touch-ui #toast{top:calc(max(10px,env(safe-area-inset-top)) + 100px)}
@media(orientation:landscape){.touch-ui #toast{top:calc(max(10px,env(safe-area-inset-top)) + 54px)}}
