:root{--green:#b5ed9a;--mint:#79cda0;--panel:rgba(15,26,23,.95);--border:rgba(212,247,199,.17);--white:#f3f9f0;--muted:#aac1b1;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none;overflow:hidden;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:#14271e;color:var(--white);user-select:none;-webkit-user-select:none}button,input,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:active{transform:scale(.965)}#app{position:relative;width:100vw;height:100dvh;overflow:hidden;isolation:isolate}#game{display:block;width:100%;height:100%;touch-action:none;image-rendering:pixelated}.vignette{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 33%,rgba(4,13,9,.33) 100%)}.hud{pointer-events:none;position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:calc(var(--safe-top,env(safe-area-inset-top)) + 12px) 13px 0;gap:8px}.identity{display:flex;align-items:center;gap:7px;min-width:0}.mark{display:grid;place-items:center;width:36px;height:38px;background:rgba(13,27,22,.83);border:1px solid var(--border);border-radius:11px;font-size:20px;backdrop-filter:blur(10px)}.brand{font-size:11px;font-weight:900;letter-spacing:1px;white-space:nowrap;text-shadow:0 2px 5px #000}.brand b{color:var(--green)}.server-name{color:#d0e8cd;font-size:10px;margin-top:3px;max-width:175px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.stats{display:flex;align-items:flex-end;flex-direction:column;gap:5px}.tag{background:rgba(11,25,20,.83);border:1px solid var(--border);padding:6px 9px;border-radius:9px;font-size:11px;font-weight:750;white-space:nowrap;backdrop-filter:blur(8px)}.tag.heart{color:#ffb8b9}.tip{pointer-events:none;position:absolute;top:calc(var(--safe-top,env(safe-area-inset-top)) + 77px);left:50%;transform:translateX(-50%);text-align:center;max-width:85vw;width:max-content;background:rgba(10,22,15,.76);border:1px solid var(--border);border-radius:30px;padding:9px 14px;font-size:11px;line-height:1.35;color:#def2d4;opacity:0;transition:opacity .25s}.tip.visible{opacity:1}.zone{position:absolute;top:calc(var(--safe-top,env(safe-area-inset-top)) + 92px);right:12px;background:rgba(111,29,30,.84);border:1px solid #fd9385;border-radius:8px;padding:8px;font-size:12px;font-weight:800}.position{pointer-events:none;position:absolute;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 92px);left:13px;padding:6px 10px;background:rgba(8,21,16,.6);border-radius:8px;color:#e0ebd2;font-size:10px}.quickbar{position:absolute;left:50%;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 14px);transform:translateX(-50%);display:flex;gap:6px;max-width:calc(100vw - 18px);padding:7px;background:rgba(7,20,15,.84);border:1px solid rgba(226,254,215,.17);border-radius:17px;backdrop-filter:blur(15px);box-shadow:0 9px 22px #0007}.quickbar button{min-width:44px;padding:5px 7px;background:rgba(231,251,223,.06);border:1px solid transparent;border-radius:12px;color:white;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px}.quickbar button span{font-size:21px}.quickbar button small{font-size:9px;font-weight:700;white-space:nowrap}.quickbar button:focus-visible,.quickbar button:hover{border-color:#95ce87;background:rgba(156,208,135,.2)}.chat-toggle{position:absolute;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 119px);right:13px;background:rgba(8,25,17,.82);border:1px solid var(--border);border-radius:13px;padding:10px 12px;color:white;font-size:17px}.chat-box{position:absolute;right:13px;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 172px);width:min(340px,calc(100vw - 26px));height:275px;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:16px;overflow:hidden;background:rgba(12,27,20,.96);backdrop-filter:blur(10px);box-shadow:0 14px 35px #0008}.chat-box[hidden]{display:none}.chat-title{padding:10px 13px;font-size:12px;font-weight:900;display:flex;justify-content:space-between;background:#263e30}.chat-title button,.panel-top button{background:none;border:0;color:#d6e5d3;font-size:17px}.chat-messages{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px;font-size:11px;color:#f1f3eb;overflow-wrap:anywhere}.chat-messages strong{color:var(--green)}#chatForm{display:flex;gap:6px;padding:7px}#chatForm input{min-width:0;flex:1;background:#263e33;border:1px solid #4a6952;border-radius:9px;color:white;padding:9px;font-size:12px}#chatForm button{border:0;border-radius:9px;background:#7dbc75;color:#0c2613;padding:0 14px}.shade{position:absolute;inset:0;background:rgba(1,8,4,.45);backdrop-filter:blur(3px)}.shade[hidden],.panel[hidden]{display:none}.panel{position:absolute;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 10px);left:50%;transform:translateX(-50%);width:min(500px,calc(100vw - 20px));max-height:79dvh;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--border);border-radius:20px;box-shadow:0 19px 60px #0009;overflow:hidden}.panel-top{display:flex;justify-content:space-between;align-items:center;padding:17px 17px 12px;border-bottom:1px solid var(--border)}.panel h2{font-size:17px;margin:0;letter-spacing:.3px}.panel-content{overflow-y:auto;overscroll-behavior:contain;padding:16px;min-height:120px}.section-label{color:var(--green);font-size:11px;font-weight:900;letter-spacing:1px;margin:0 0 12px}.resource-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06);border-radius:12px;margin-bottom:8px;padding:12px}.resource-row b{font-size:13px}.resource-row small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.stock{font-size:15px;color:var(--green);font-weight:800}.resource-row button,.main-action{color:#0e2915;background:#a7df8e;border:0;border-radius:9px;font-size:12px;padding:10px 12px;font-weight:850}.resource-row button:disabled,.main-action:disabled{opacity:.35;cursor:default}.main-action{width:100%;margin:8px 0}.secondary{background:#294332;color:#e9f2e1;border:1px solid #58785d}.muted{font-size:12px;color:var(--muted);line-height:1.65}.inline-input,.inline-select{width:100%;border:1px solid #526f59;border-radius:10px;padding:10px;background:#192c22;color:white;outline:none;min-width:0}.field-name{display:block;color:var(--muted);font-size:11px;font-weight:700;margin:10px 0 5px}.pills{display:flex;gap:6px;flex-wrap:wrap}.pill{padding:7px 9px;background:#2c4935;color:#e6f1dc;border:1px solid #58775b;border-radius:8px;font-size:11px}.mini-player{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border);gap:8px;padding:10px 0}.mini-player b{font-size:12px}.mini-player span{font-size:10px;color:#b1cdb3}.mini-player button{border-radius:7px;padding:7px 9px;background:#304f38;border:1px solid #739576;color:white;font-size:11px}.inventory-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin-top:10px}.slot{aspect-ratio:1;border-radius:8px;background:#243c30;border:1px solid #3b5b47;display:flex;align-items:center;justify-content:center;font-size:23px;position:relative}.slot .quantity{position:absolute;right:3px;bottom:2px;font-size:9px;color:white;font-weight:800;text-shadow:0 1px #000}.slot.empty{background:rgba(230,255,223,.025)}#miniMap{width:100%;max-width:360px;aspect-ratio:1;display:block;margin:0 auto;border:2px solid #385441;image-rendering:pixelated;border-radius:12px}.toast{pointer-events:none;position:absolute;left:50%;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 171px);transform:translate(-50%,12px);background:#1b3125;border:1px solid #699776;color:#f0f8e8;padding:11px 15px;min-width:190px;max-width:88vw;text-align:center;border-radius:11px;opacity:0;transition:opacity .25s,transform .25s;font-size:12px;box-shadow:0 10px 30px #0009}.toast.show{opacity:1;transform:translate(-50%,0)}.auth-cover{position:absolute;inset:0;background:radial-gradient(circle at 50% 16%,#335843 0%,#132b22 54%,#091811 100%);display:flex;overflow-y:auto;justify-content:center;align-items:safe center;padding:24px 15px}.auth-cover[hidden]{display:none}.auth-content{max-width:420px;width:100%;margin:auto;text-align:center}.hero-tree{font-size:43px;margin-bottom:5px;filter:drop-shadow(0 8px 13px #0008)}.eyebrow{font-weight:800;letter-spacing:2.1px;color:#bce0ab;font-size:10px}.auth-cover h1{font-weight:1000;font-size:clamp(30px,9vw,45px);letter-spacing:2px;line-height:1.03;margin:14px 0 12px;text-shadow:0 4px 16px #0006}.auth-cover h1 span{color:#b3ea97}.auth-cover p{font-size:13px;color:#d1e2d2;line-height:1.55;margin:0 12px 21px}.auth-card{background:rgba(5,19,12,.64);border:1px solid rgba(209,251,202,.21);border-radius:18px;padding:18px;box-shadow:0 18px 46px #0005;backdrop-filter:blur(8px)}.switch{display:flex;gap:5px;background:rgba(215,255,200,.06);padding:5px;border-radius:10px;margin-bottom:20px}.switch button{width:50%;padding:10px;color:#b8cbbb;background:none;border:0;border-radius:8px;font-size:12px;font-weight:750}.switch button.active{background:#80bd7e;color:#0b220e}.auth-card label{display:block;text-align:left;font-size:10px;color:#bfd2b8;font-weight:800;letter-spacing:1px;margin-bottom:14px}.auth-card input{margin-top:7px;width:100%;padding:13px;background:#1b3426;border-radius:10px;border:1px solid #46694e;outline:none;color:white;font-size:14px}.auth-card input:focus{border-color:#b1e59a}.primary{width:100%;padding:14px;background:#a7e38b;color:#163020;border:0;border-radius:10px;font-weight:1000;font-size:13px;margin-top:5px}.auth-error{color:#ffb7a9;font-size:12px;min-height:18px;margin-top:11px}.auth-foot{font-size:10px;color:#99b69d;margin-top:21px}@media(min-width:750px){.quickbar button{min-width:64px}.quickbar button span{font-size:24px}.hud{padding-left:20px;padding-right:20px}.panel{bottom:30px;max-height:85dvh}.position{bottom:95px}}@media(max-width:359px){.quickbar{gap:2px;padding:5px}.quickbar button{min-width:43px;padding:3px 4px}.quickbar button small{font-size:8px}.brand{font-size:10px}.mark{display:none}}

.exit-house{position:absolute;top:calc(var(--safe-top,env(safe-area-inset-top)) + 93px);left:50%;transform:translateX(-50%);z-index:1000;pointer-events:auto;background:#97ca85;border:2px solid #d2f1b0;color:#102916;border-radius:12px;font-size:13px;font-weight:900;padding:10px 14px;box-shadow:0 6px 18px #0009;white-space:nowrap}.exit-house[hidden]{display:none}

/* v0.4 inventory and equipment */
.inventory-layout{display:grid;grid-template-columns:minmax(0,1fr) 104px;gap:9px;align-items:start}
.inventory-layout .inventory-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.inventory-layout .slot{padding:0;min-width:0;color:#f6fff0;cursor:pointer;aspect-ratio:1}
.inventory-layout .slot.chosen{outline:2px solid #b9ff9e;outline-offset:1px;background:#47704b}
.equipment{background:#17291d;padding:6px;border:1px solid #496a53;border-radius:12px}
.equipment .section-label{font-size:9px;letter-spacing:0;margin-bottom:8px}
.equip-row{display:flex;align-items:center;gap:5px;padding:7px 2px;border-bottom:1px solid #40604566;font-size:10px}
.equip-row>span{font-size:20px}.equip-row small{display:block;font-size:9px;color:#b4cdb5}
.equip-row.future{opacity:.62}
.inventory-actions{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.inventory-actions button{background:#355b3b;color:#f5ffef;border:1px solid #729c74;border-radius:9px;padding:9px 10px;font-weight:700;font-size:11px}
.inventory-actions button:disabled{opacity:.4}
.swim-label{top:calc(var(--safe-top,env(safe-area-inset-top)) + 139px);left:12px;right:auto;background:#1b6492c9}
@media(max-width:360px){.inventory-layout{grid-template-columns:minmax(0,1fr) 92px;gap:6px}.equipment{padding:3px}.equip-row>span{font-size:17px}}

.shade{z-index:14}.panel{z-index:15}.chat-box{z-index:9}

.paper-doll{height:83px;width:76px;position:relative;margin:5px auto 10px;background:#263d2b;border:1px solid #5a795c;border-radius:10px;overflow:hidden}
.paper-doll i{position:absolute;display:block;border:2px solid #233626;image-rendering:pixelated}
.pd-head{width:22px;height:23px;top:9px;left:26px;background:#dfb88b;box-shadow:0 -5px #4e3826}
.pd-body{width:30px;height:30px;top:32px;left:22px;background:#abc793}
.pd-leg{width:12px;height:19px;top:59px;background:#414653}
.pd-leg.left{left:25px}.pd-leg.right{left:39px}
.pd-gear{position:absolute;display:block;border:2px solid #243428;image-rendering:pixelated;z-index:2}
.pd-helm{width:26px;height:10px;top:5px;left:24px;border-radius:4px 4px 2px 2px}
.pd-armor{width:34px;height:28px;top:31px;left:20px;border-radius:5px}
.pd-legs{width:12px;height:16px;top:56px}.pd-legs.left{left:25px}.pd-legs.right{left:39px}
.pd-boots{width:14px;height:6px;top:74px}.pd-boots.left{left:24px}.pd-boots.right{left:38px}
.slot-placeholder{display:inline-grid;place-items:center;width:18px;height:18px;color:#97aa97;font-weight:900}

/* v0.4.2: clean phone HUD; tools equip directly in inventory. */
.home-toolbar{position:absolute;top:calc(var(--safe-top,env(safe-area-inset-top)) + 91px);left:50%;transform:translateX(-50%);z-index:11;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;width:max-content;max-width:calc(100vw - 22px)}
.home-toolbar button{position:static;transform:none;pointer-events:auto;white-space:nowrap;min-height:42px;box-shadow:0 6px 18px #0008}
.home-toolbar button[hidden]{display:none}
.open-chest{border:2px solid #d0efae;border-radius:12px;background:#a4d799;color:#17391f;font-weight:900;font-size:13px;padding:10px 16px}
.home-toolbar .exit-house{border-radius:12px;padding:9px 14px;font-size:12px;background:#2c4430;border:1px solid #83a98a;color:#edffe4}
.chest-heading{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;justify-content:space-between;border:1px solid #547256;background:#213c2b;padding:12px;border-radius:12px;margin:0 0 10px}
.chest-heading b{font-size:13px;color:#e2f4d7}.chest-heading span{font-size:11px;color:#b8d4b4}
.chest-section{margin-top:24px}
.chest-item{display:flex;align-items:center;justify-content:space-between;gap:7px;border-bottom:1px solid #4a654544;padding:10px 1px}
.chest-item-name{display:flex;align-items:center;gap:8px;min-width:0}.chest-item-name>span{font-size:21px}.chest-item-name b{display:block;font-size:12px;overflow-wrap:anywhere}.chest-item-name small{font-size:11px;color:#a3c49e}
.chest-item-actions{display:flex;gap:4px;flex-shrink:0}.chest-item-actions button{background:#33533b;color:#eaffdc;border:1px solid #668869;border-radius:7px;min-width:34px;min-height:36px;padding:7px;font-weight:750;font-size:11px}.chest-item-actions .chest-all-item{background:#86be7f;color:#16311d}
.hand-slot{cursor:pointer;border-radius:9px;background:#345b3b;border:1px solid #85b47f;margin-top:6px;padding:6px 4px}.hand-slot small{color:#e9f5dc}
@media(max-width:380px){.home-toolbar{top:calc(var(--safe-top,env(safe-area-inset-top)) + 87px)}.home-toolbar button{min-height:39px;font-size:12px}}

/* Telegram Mini App entry: button remains readable on narrow devices. */
.telegram-login{padding:12px;background:#132c25;border:1px solid #3e6751;border-radius:13px;margin-bottom:14px}
.telegram-title{font-weight:800;margin-bottom:9px;color:#b0e7cb}
.telegram-help{font-size:12px;line-height:1.5;color:#c3d9cb;margin:10px 0 0}
.telegram-login .primary{width:100%;white-space:normal;min-height:44px}

/* v0.6 Reborn — compact pixel equipment and readable crafting cards */
.slot.equipped{border-color:#b9eb80!important;box-shadow:inset 0 0 0 2px #b9eb8066,0 0 10px #8ad56c55}
.slot .tool-icon{width:26px;height:26px;display:block;margin:auto;image-rendering:pixelated;filter:drop-shadow(1px 2px 0 #172a21)}
.equip-row .tool-icon{width:25px;height:25px;flex:0 0 auto;image-rendering:pixelated}
.equip-row:has(.tool-icon){background:#3b5a42}
.selected-item{font-size:10px;min-height:23px;color:#c0d9b8;margin:8px 0;line-height:1.4}
.selected-item b{color:#e8f9db}
.craft-category{margin:15px 0 22px}
.craft-category h3{margin:0 0 3px;font-size:14px;color:#d6f6c1}
.craft-category>.muted{margin:0 0 10px;font-size:11px}
.craft-card{display:flex;align-items:center;gap:9px;background:#23392c;border:1px solid #456a4e;border-radius:12px;padding:10px 8px;margin-bottom:7px;min-width:0}
.craft-art{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;background:#35523c;border:1px solid #66816a;border-radius:9px;font-size:22px}
.craft-art .tool-icon{width:32px;height:32px;image-rendering:pixelated}
.craft-info{flex:1;min-width:0}
.craft-info strong{display:block;font-size:12px}
.craft-info small{display:block;color:#b0c8ae;font-size:10px;margin:3px 0}
.craft-ingredients{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:10px}
.craft-ingredients .ok{color:#b8e5a4}.craft-ingredients .missing{color:#f2ab9d}
.craft-card button{background:#b0d58e;color:#172e1a;border:none;border-radius:8px;font-weight:900;font-size:11px;padding:10px 8px;min-height:38px;flex:0 0 auto}
.craft-card button:disabled{opacity:.4}
@media(max-width:340px){.craft-card{gap:5px;padding:8px 5px}.craft-art{width:30px;height:32px;flex-basis:30px}.craft-card button{font-size:10px;padding:8px 5px}.inventory-layout .inventory-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* v0.7: small durable equipment counters; never cover pixel sprites. */
.inventory-grid .slot .durability-mark{position:absolute;left:2px;top:2px;background:rgba(8,26,19,.85);border:1px solid #719b6b;border-radius:3px;padding:1px 2px;color:#d7f9c7;font-size:8px;font-weight:800;line-height:1.2;letter-spacing:-.3px;pointer-events:none}
.inventory-grid .slot .tool-icon{width:24px;height:24px;flex:0 0 24px;}
.equipment .equip-row .tool-icon{width:21px;height:21px;vertical-align:middle}

.item-icon-inline{width:18px;height:18px;vertical-align:-3px;display:inline-block;margin-right:5px;image-rendering:pixelated;filter:drop-shadow(1px 1px 0 #15271f)}
.icon-box{display:inline-grid;place-items:center;width:22px;height:22px;flex:0 0 22px}
.icon-box .item-icon-inline{margin-right:0;vertical-align:0;width:18px;height:18px}
.resource-row b,.pill,.chest-item-name b,.trade-bag-item,.trade-slot-label{white-space:normal}
.trade-slot-icon .item-icon-inline,.trade-slot-icon .tool-icon{width:18px;height:18px;margin-right:0;vertical-align:0}
.resource-row b .item-icon-inline,.pill .item-icon-inline{margin-right:6px}

/* v0.7.1 character progression — touch-friendly upgrades for portrait phones. */
.stats-entry{margin:0 0 14px;background:linear-gradient(110deg,#bde78b,#7bcba0);color:#132a1b;box-shadow:0 3px 10px #112f194d}
.stat-summary{display:flex;flex-direction:column;gap:6px;border:1px solid #74986d;border-radius:14px;background:#233e2e;padding:14px;margin-bottom:13px}
.stat-summary strong{font-size:17px;color:#e9ffd8}.stat-summary span{font-size:13px;color:#caf0b0}.stat-summary small{font-size:11px;color:#bad3b8;line-height:1.4}
.stat-row{display:flex;align-items:center;gap:10px;border:1px solid #456750;background:#1a3024;border-radius:12px;padding:10px 8px;margin-bottom:8px;min-width:0}
.stat-icon{font-size:22px;flex:0 0 30px;text-align:center}.stat-detail{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.stat-detail b{font-size:12px}.stat-detail small{color:#b9ceb6;font-size:10px}.stat-detail span{color:#d1efa8;font-size:11px;font-weight:700}
.stat-add{flex:0 0 45px;min-height:43px;border:1px solid #d2edab;border-radius:9px;background:#a9dc89;color:#102619;font-size:16px;font-weight:900}.stat-add:disabled{opacity:.38}

/* v0.8 DEV location chooser: same existing visual style */
.location-card{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:13px 11px;margin:10px 0;border:1px solid #496550;border-radius:12px;background:rgba(30,51,38,.55)}
.location-card>div{display:flex;flex-direction:column;gap:5px}.location-card small{color:#a8c3a9}.location-card button{border:1px solid #9bcc93;background:#345e3d;color:#f0fae8;border-radius:9px;padding:9px 11px;font-weight:700}.location-card button:disabled{opacity:.45}

/* v0.8 — five-slot two-party trading, uses existing green UI design. */
.trade-intro{background:#233d2d;border:1px solid #638764;border-radius:11px;padding:12px;margin-bottom:12px}.trade-intro b{color:#e8f6d3;font-size:14px}.trade-intro small{display:block;color:#b5d1b2;margin-top:6px;font-size:11px}.trade-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.trade-columns>div{min-width:0}.trade-columns h3{font-size:12px;color:#d0eabd;text-align:center;margin:4px 0 10px;overflow-wrap:anywhere}.trade-slot{width:100%;display:flex;gap:4px;align-items:center;min-height:51px;background:#1f3528;color:#d6ead3;border:1px solid #4a7451;border-radius:9px;margin:5px 0;padding:5px;text-align:left}.trade-slot:disabled{opacity:.7}.trade-own-slot{cursor:pointer}.trade-slot.chosen{outline:2px solid #c4ec9a;background:#365b3d}.trade-slot-icon{display:grid;place-items:center;width:31px;flex:0 0 31px;height:31px;background:#304c34;border-radius:6px;font-size:18px}.trade-slot-label{font-size:10px;overflow-wrap:anywhere;line-height:1.3}.trade-money{font-size:11px;color:#eaf8d9;background:#2b4430;border:1px solid #537354;border-radius:9px;padding:9px 4px;text-align:center;margin:9px 0}.trade-status{display:block;font-size:11px;color:#d5ada8;text-align:center}.trade-status.ready{color:#b8e8a8}.trade-picker{border:1px solid #6a996a;border-radius:12px;padding:12px;margin:13px 0;background:#1c3324}.trade-picker-actions{display:flex;gap:7px;align-items:center;margin:9px 0}.trade-picker-actions>*{flex:1;min-width:0}.trade-picker-actions .main-action{font-size:12px;padding:10px 6px;min-height:41px}.trade-money-input{margin:14px 0}.trade-money-input .inline-input{width:100%;min-width:0}.trade-confirm-info{font-size:12px;color:#f5dc9d;line-height:1.45;padding:9px;border:1px solid #9d884a;background:#494329;border-radius:10px}

.aim-toggle{position:absolute;z-index:12;right:12px;top:calc(var(--safe-top,env(safe-area-inset-top)) + 105px);border:1px solid #78a579;border-radius:10px;color:#e3f4d2;background:#213e2c;font-weight:700;font-size:12px;min-height:42px;padding:9px 12px}.aim-toggle.active{background:#a8cf8d;color:#16301b;border-color:#dcf4ba}

.trade-bag{margin:15px 0 8px;padding:10px;border:1px solid #4b7051;border-radius:10px;background:#1a3325}.trade-bag-items{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}.trade-bag-item{border:1px solid #597d5c;border-radius:8px;background:#294832;color:#dff6d2;font-size:11px;padding:8px;min-height:39px;touch-action:manipulation;cursor:grab}.trade-own-slot{touch-action:manipulation}

/* v0.8 DEV.4 crafting categories, original palette retained */
.economy-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 0 15px}.economy-tabs button{border:1px solid #536d57;border-radius:10px;background:#20372d;color:#dae8d9;font-size:12px;padding:10px 7px;cursor:pointer}.economy-tabs button.active{background:#385f40;border-color:#9cbd8f;color:white;font-weight:700}
/* Seven compact actions fit across an Android portrait screen without hiding the NPC button. */
@media(max-width:600px){
 .quickbar{left:9px;right:9px;width:auto;max-width:none;transform:none;gap:3px;padding:5px}
 .quickbar button{flex:1 1 0;min-width:0;padding:4px 1px;gap:2px}
 .quickbar button span{font-size:18px}
 .quickbar button small{font-size:8px;letter-spacing:-.2px}
}

/* v0.8 release: optional mobile direction controls, original green visual style. */
.controls-toggle{position:absolute;left:12px;top:calc(var(--safe-top,env(safe-area-inset-top)) + 105px);z-index:11;border:1px solid #78a579;border-radius:10px;background:#213e2c;color:#e3f4d2;font-size:12px;font-weight:700;padding:10px 12px;min-height:42px}.controls-toggle.active{background:#a8cf8d;color:#16301b}.direction-pad{position:absolute;left:12px;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 148px);z-index:10;display:grid;grid-template-areas:". up ." "left down right";grid-template-columns:repeat(3,45px);grid-template-rows:repeat(2,47px);gap:4px;touch-action:none;user-select:none}.direction-pad[hidden]{display:none}.direction-pad button{border:1px solid #9bbe88;border-radius:11px;background:rgba(18,41,30,.88);color:#d7f8c3;font-size:21px;font-weight:900;touch-action:none}.direction-pad button:active{background:#7dbb7e;color:#102916}.direction-pad button:nth-child(1){grid-area:up}.direction-pad button:nth-child(2){grid-area:left}.direction-pad button:nth-child(3){grid-area:down}.direction-pad button:nth-child(4){grid-area:right}

/* v0.8.1 zoom, manual fire and circular analog joystick */
.zoom-controls{position:absolute;z-index:12;top:calc(var(--safe-top,env(safe-area-inset-top)) + 155px);right:12px;background:#1b3429ec;border:1px solid #729f6f;color:#e7f4db;border-radius:9px;padding:7px 9px;font-size:11px;display:flex;flex-direction:column;gap:3px;min-width:115px}.zoom-controls input{width:110px;accent-color:#9acb86}.fire-button{position:absolute;z-index:13;right:18px;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 160px);height:72px;width:72px;border-radius:50%;border:3px solid #b5dfa0;background:#365d3ddf;color:#f6ffd9;font-weight:900;touch-action:manipulation}.fire-button[hidden]{display:none}
.direction-pad.joystick{left:19px;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 160px);width:136px;height:136px;border-radius:50%;border:2px solid #789e79;background:rgba(12,35,24,.75);display:block;touch-action:none;user-select:none}.direction-pad.joystick[hidden]{display:none}.joystick-knob{position:absolute;top:50%;left:50%;width:53px;height:53px;border-radius:50%;background:#85bc86;border:2px solid #dcf8d2;box-shadow:0 3px 14px #0b2018;transform:translate(-50%,-50%);pointer-events:none}
.admin-players{max-height:160px;overflow:auto;font-size:11px}.admin-players p{border-bottom:1px solid #52735750;padding:5px}

/* v0.9 horizontal action HUD - original game palette retained */
.combat-switches{position:absolute;z-index:12;right:calc(var(--safe-right,env(safe-area-inset-right)) + 10px);top:calc(var(--safe-top,env(safe-area-inset-top)) + 55px);display:flex;gap:6px}
.combat-switches button,.farm-select{color:#effbdd;border:1px solid #7a9d72;border-radius:9px;background:#1c382ddf;font-size:11px;font-weight:900;padding:8px;min-height:34px}
.combat-switches button.active,.farm-select.active{background:#99cc79;color:#133021;border-color:#e0ffbf}
.aim-pad{position:absolute;z-index:12;right:calc(var(--safe-right,env(safe-area-inset-right)) + 23px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 32px);height:118px;width:118px;border-radius:50%;background:#112f26dc;border:2px solid #a2c99b;touch-action:none;user-select:none;box-shadow:0 6px 18px #0007}
.aim-pad .joystick-knob{width:46px;height:46px;background:#a3bdb1}
.pad-caption{position:absolute;bottom:-18px;left:0;right:0;text-align:center;font-size:10px;color:#e6f7d5;font-weight:800;pointer-events:none}
.farm-button{position:absolute;z-index:12;right:calc(var(--safe-right,env(safe-area-inset-right)) + 152px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 61px);width:70px;height:70px;border-radius:50%;border:2px solid #b5d7a5;background:#3e6847e8;color:white;font-size:11px;font-weight:900;touch-action:none;user-select:none}
.farm-button.active{background:#adca82;color:#193321}
.farm-select{position:absolute;z-index:12;right:calc(var(--safe-right,env(safe-area-inset-right)) + 146px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 143px)}
.direction-pad.joystick{left:calc(var(--safe-left,env(safe-area-inset-left)) + 27px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 30px);height:128px;width:128px}
.quickbar{left:50%;right:auto;transform:translateX(-50%);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 8px);width:max-content;max-width:50vw;padding:4px}
.quickbar button{min-width:47px;padding:4px 6px}.quickbar button span{font-size:19px}.quickbar button small{font-size:9px}
.controls-toggle{left:calc(var(--safe-left,env(safe-area-inset-left)) + 16px);top:calc(var(--safe-top,env(safe-area-inset-top)) + 50px)}
.zoom-controls{top:calc(var(--safe-top,env(safe-area-inset-top)) + 93px);left:calc(var(--safe-left,env(safe-area-inset-left)) + 16px);right:auto;min-width:100px}
.position{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 7px);left:calc(var(--safe-left,env(safe-area-inset-left)) + 15px)}
.chat-toggle{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 167px);right:calc(var(--safe-right,env(safe-area-inset-right)) + 17px)}
.chat-box{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 42px);right:calc(var(--safe-right,env(safe-area-inset-right)) + 155px);width:min(320px,42vw);height:min(250px,73dvh)}
.panel{width:min(610px,90vw);max-height:90dvh;bottom:5dvh}.panel-content{padding:12px}
.rotate-notice{position:absolute;z-index:100000;inset:0;display:flex;align-items:center;justify-content:center;background:#0e241bec;color:#f2ffdd;text-align:center;font-size:22px;font-weight:900;line-height:1.7}
.rotate-notice[hidden]{display:none}.rotate-notice button{display:block;margin:15px auto;border:1px solid #bbd7a4;background:#7dbb77;border-radius:10px;padding:12px;color:#17311a;font-weight:900}
@media(max-height:420px) and (orientation:landscape){.hud{padding:4px 12px}.quickbar{max-width:55vw}.quickbar button small{display:none}.direction-pad.joystick{width:110px;height:110px}.aim-pad{width:110px;height:110px}.zoom-controls{top:calc(var(--safe-top,env(safe-area-inset-top)) + 76px)}.chat-toggle{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 142px)}.farm-select{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 127px)}}

/* Keep the six-menu launcher above the field, clear of touch controls. */
.quickbar{top:calc(var(--safe-top,env(safe-area-inset-top)) + 48px);bottom:auto;}
/* v0.9 landscape layout collision fixes */
.combat-switches{top:calc(var(--safe-top,env(safe-area-inset-top)) + 105px)}
.zoom-controls{top:calc(var(--safe-top,env(safe-area-inset-top)) + 102px)}
@media(max-height:420px) and (orientation:landscape){
  .combat-switches{top:calc(var(--safe-top,env(safe-area-inset-top)) + 102px)}
  .zoom-controls{top:calc(var(--safe-top,env(safe-area-inset-top)) + 105px)}
}

/* v0.9.1: fullscreen landscape, true bottom launcher, safe touch zones */
html,body,#app{width:100%;height:100%;height:100dvh;overflow:hidden;touch-action:manipulation}
.quickbar{position:absolute;z-index:18;top:auto!important;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 2px)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(50vw,460px);max-width:calc(100vw - 295px);gap:2px;padding:3px 5px;display:flex;justify-content:center;align-items:center;border-radius:12px}
.quickbar button{flex:1 1 0;min-width:0!important;width:auto;padding:3px 1px;gap:1px;min-height:37px}
.quickbar button span{font-size:19px}.quickbar button small{font-size:9px}
.direction-pad.joystick{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 12px);left:calc(var(--safe-left,env(safe-area-inset-left)) + 17px)}
.aim-pad{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 12px);right:calc(var(--safe-right,env(safe-area-inset-right)) + 19px)}
.farm-button{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 32px)}
.farm-select{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 117px)}
.position{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 7px);left:calc(var(--safe-left,env(safe-area-inset-left)) + 155px)}
.chat-toggle{bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 147px)}
.fullscreen-toggle{position:absolute;z-index:16;top:calc(var(--safe-top,env(safe-area-inset-top)) + 10px);left:calc(50% - 19px);padding:5px 10px;min-height:32px;border-radius:9px;border:1px solid #719b6c;background:#153322e8;color:#d8f4c9;font-weight:900;touch-action:manipulation}
.connection-status{position:absolute;z-index:100;top:calc(var(--safe-top,env(safe-area-inset-top)) + 8px);left:50%;transform:translateX(-50%);background:#6a352bf0;border:1px solid #e8a79b;color:#fff;padding:7px 13px;border-radius:9px;font-size:12px;pointer-events:none;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis}
.connection-status[hidden]{display:none}
@media(max-height:440px) and (orientation:landscape){
 .quickbar{max-width:calc(100vw - 255px);width:min(51vw,390px);}
 .quickbar button span{font-size:16px}.quickbar button small{font-size:8px}
 .direction-pad.joystick{width:109px;height:109px;left:calc(var(--safe-left,env(safe-area-inset-left)) + 11px)}
 .aim-pad{width:109px;height:109px;right:calc(var(--safe-right,env(safe-area-inset-right)) + 11px)}
 .farm-button{width:58px;height:58px;right:calc(var(--safe-right,env(safe-area-inset-right)) + 125px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 28px)}
 .farm-select{right:calc(var(--safe-right,env(safe-area-inset-right)) + 124px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 93px)}
 .position{left:calc(var(--safe-left,env(safe-area-inset-left)) + 122px);font-size:9px}
}

/* v0.9.3 — combat settings popover instead of two HUD buttons */
.combat-controls{position:absolute;z-index:19;right:calc(var(--safe-right,env(safe-area-inset-right)) + 14px);top:calc(var(--safe-top,env(safe-area-inset-top)) + 68px)}
.combat-menu-toggle{position:relative;display:grid;place-items:center;width:48px;height:48px;padding:0;border-radius:50%;border:2px solid #a6d99d;background:#16392fe8;color:#efffe8;font-size:22px;box-shadow:0 5px 20px #0006;touch-action:manipulation}
.combat-menu-toggle.selected,.combat-menu-toggle.combat-enabled{background:#3c7149;border-color:#d0f6b3}
.combat-mode-dot{position:absolute;right:2px;top:1px;height:11px;width:11px;border-radius:50%;background:#baff72;border:2px solid #173e28}
.combat-mode-dot[hidden],.combat-settings[hidden]{display:none!important}
.combat-settings{position:absolute;top:0;right:58px;width:min(268px,calc(100vw - 90px));padding:12px;border-radius:15px;border:1px solid #8aac7b;background:#122c25f7;box-shadow:0 14px 35px #000b;color:#eaf8dc}
.combat-settings-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px}
.combat-settings-header button{border:0;background:#345043;color:#f0ffe1;border-radius:8px;width:30px;height:30px;touch-action:manipulation}
.combat-settings p{font-size:10px;color:#bbd2b9;margin:5px 0 11px}
.combat-setting-row{width:100%;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:7px;padding:9px;border:1px solid #476a51;border-radius:11px;background:#233d30;color:#e7f7e0;text-align:left;touch-action:manipulation;margin-top:7px}
.combat-setting-row span{font-size:12px;font-weight:850}
.combat-setting-row small{display:block;font-size:10px;font-weight:450;color:#afc6ae;margin-top:4px}
.combat-setting-row .combat-status{padding:7px;border-radius:7px;font-size:10px;min-width:44px;text-align:center;background:#4a534a;color:#e9e9da}
.combat-setting-row.active{border-color:#b4eb8c;background:#355d3d}
.combat-setting-row.active .combat-status{background:#b5ec93;color:#153422}
.fullscreen-toggle[hidden]{display:none!important}
@media (max-height:410px) and (orientation:landscape){
 .combat-controls{top:calc(var(--safe-top,env(safe-area-inset-top)) + 57px);right:calc(var(--safe-right,env(safe-area-inset-right)) + 13px)}
 .combat-menu-toggle{height:44px;width:44px;font-size:20px}
 .combat-settings{right:52px;top:-7px;padding:10px}
 .combat-setting-row{min-height:46px;padding:7px}
}

/* v0.9.4: match Telegram viewport and reduce costly WebView blur layers. */
#app{height:var(--tg-viewport-height,100dvh);min-height:0}
.vignette{background:radial-gradient(ellipse at 50% 45%,transparent 40%,rgba(4,13,9,.22) 100%)}
.hud .mark,.hud .tag,.quickbar{backdrop-filter:none;-webkit-backdrop-filter:none}
@media (max-width:800px){.vignette{display:none}}

/* v0.9.5: no blocking rotation overlay. Portrait is usable on Android. */
#app{height:var(--app-height,100dvh);width:100%;}
.rotate-notice{inset:auto;left:50%;top:calc(var(--safe-top,0px) + 56px);transform:translateX(-50%);width:max-content;max-width:80vw;z-index:12;pointer-events:none;background:rgba(14,36,27,.78);border:1px solid #4c7655;border-radius:11px;padding:6px 9px;font-size:11px;font-weight:650;line-height:1.3;box-shadow:none}
.rotate-notice button{display:inline-block;margin:0 0 0 6px;padding:5px 7px;font-size:10px;pointer-events:auto}
.fullscreen-toggle{z-index:25;left:50%;transform:translateX(-50%);top:calc(var(--safe-top,0px) + 7px);min-height:39px;min-width:43px;font-size:18px}
.fullscreen-toggle:active{transform:translateX(-50%) scale(.95)}
@media (orientation:portrait){
 .hud{padding-top:calc(var(--safe-top,0px) + 8px)}
 .controls-toggle{top:calc(var(--safe-top,0px) + 91px);left:12px}
 .zoom-controls{top:calc(var(--safe-top,0px) + 142px);left:12px}
 .combat-controls{top:calc(var(--safe-top,0px) + 93px);right:12px}
 .quickbar{left:50%!important;right:auto!important;bottom:calc(var(--safe-bottom,0px) + 8px)!important;width:min(98vw,450px);max-width:calc(100vw - 16px)!important;gap:2px}
 .quickbar button{min-width:0!important;min-height:48px}
 .direction-pad.joystick{bottom:calc(var(--safe-bottom,0px) + 98px);left:12px;width:118px;height:118px}
 .aim-pad{bottom:calc(var(--safe-bottom,0px) + 98px);right:12px;width:112px;height:112px}
 .farm-button{bottom:calc(var(--safe-bottom,0px) + 215px);right:19px;width:56px;height:56px;font-size:10px}
 .farm-select{bottom:calc(var(--safe-bottom,0px) + 273px);right:15px;padding:5px;font-size:10px}
 .chat-toggle{bottom:calc(var(--safe-bottom,0px) + 290px);right:15px}
 .position{bottom:calc(var(--safe-bottom,0px) + 72px);left:15px}
 .combat-settings{right:0;top:50px}
 .rotate-notice{top:calc(var(--safe-top,0px) + 52px)}
}
@media (orientation:landscape) and (max-height:450px){
 .fullscreen-toggle{top:calc(var(--safe-top,0px) + 5px)}
 .hud{padding-top:calc(var(--safe-top,0px) + 5px)}
 .quickbar{bottom:calc(var(--safe-bottom,0px) + 3px)!important}
 .direction-pad.joystick{bottom:calc(var(--safe-bottom,0px) + 10px)}
 .aim-pad{bottom:calc(var(--safe-bottom,0px) + 9px)}
}

/* v0.9.6: real visible viewport; diagnostic counter without new HUD overlays */
#app{height:var(--app-height,100dvh);width:100%;min-height:0;}
.performance-label{font-variant-numeric:tabular-nums;color:#b2dcc5;font-size:10px;line-height:1.1;letter-spacing:.2px;}
#game{contain:strict;}

/* Keep the portrait fullscreen button out of the Wildlands logo. */
@media (orientation:portrait){
 .fullscreen-toggle{top:calc(var(--safe-top,0px) + 92px);left:50%;transform:translateX(-50%)}
}

/* v0.9.8 · sharp pixel graphics, uncluttered controls, no costly backdrop blur */
.zoom-controls{min-width:145px;padding:8px 11px;border-radius:12px;background:rgba(12,37,29,.91);border:1px solid #81ad89;box-shadow:0 3px 12px #0b201c54;overflow:visible}
.zoom-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
.zoom-heading label{font-size:12px;font-weight:800;white-space:nowrap}
.graphics-toggle{border:1px solid #658f70;color:#e6f6d7;border-radius:7px;background:#1d4434;min-width:29px;height:27px;display:grid;place-items:center;font-size:15px;touch-action:manipulation}
.zoom-controls input{width:100%;min-width:140px;margin:1px 0;accent-color:#b2e98d}
.graphics-menu{position:absolute;z-index:40;top:0;left:calc(100% + 8px);width:178px;padding:9px;border-radius:13px;background:#112a23f7;border:1px solid #729879;box-shadow:0 12px 28px #001b13ad;display:flex;flex-direction:column;gap:6px}
.graphics-menu[hidden]{display:none!important}
.graphics-menu strong{font-size:12px;color:#edffe5;margin:2px 3px 4px}
.graphics-menu button{display:flex;justify-content:space-between;gap:5px;align-items:center;border:1px solid #4f705a;border-radius:8px;background:#253e32;color:#ebf9dd;font-weight:800;font-size:11px;padding:9px 8px;text-align:left;touch-action:manipulation}
.graphics-menu button small{font-size:9px;color:#b7d3b8;font-weight:500;max-width:70px;text-align:right}
.graphics-menu button.selected{border-color:#b3eb92;background:#406747}
.controls-toggle{min-height:38px;border-radius:12px;background:#16392de8;color:#e4f6df;border-color:#83b18a;font-size:12px;padding:8px 12px;box-shadow:0 3px 10px #09211855}
.controls-toggle.active{background:#356b46;color:#edffe9;border-color:#b5ed9a}
.direction-pad.joystick,.aim-pad{background:radial-gradient(circle,#234c369c 16%,#08271bbd 80%);border-color:#a3cca1;box-shadow:0 4px 10px #061c1540}
.quickbar{background:#10291fef;border:1px solid #7496745c;box-shadow:0 5px 18px #08191073}
.tag{background:#102c25e8;border-color:#6f99765c}
#game{image-rendering:pixelated}
@media (orientation:portrait){.graphics-menu{top:calc(100% + 8px);left:0;right:auto}}
@media (orientation:landscape) and (max-width:750px){.graphics-menu{top:calc(100% + 8px);left:0}}

/* v0.9.12 — RPG Landscape UI Rework */
:root{
  --rpg-gold:#d3bb7a;
  --rpg-gold-deep:#8f7441;
  --rpg-wood:#291b12;
  --rpg-panel:#102019f0;
  --rpg-panel-2:#162a21f7;
  --rpg-line:#7c6a42;
  --rpg-glow:#d7f1b4;
}
#app.rpg-ui{
  background:
    radial-gradient(circle at 50% 0%, rgba(94,115,63,.25), transparent 40%),
    linear-gradient(180deg, rgba(11,19,15,.25), rgba(4,9,7,.55));
}
#app.rpg-ui .vignette{
  background:
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0) 18%, rgba(0,0,0,0) 82%, rgba(0,0,0,.22)),
    radial-gradient(ellipse at 50% 40%, transparent 38%, rgba(4,13,9,.28) 100%);
}
#app.rpg-ui .hud{
  top:8px;left:50%;right:auto;transform:translateX(-50%);
  width:min(74vw,860px);padding:0;gap:14px;align-items:stretch;justify-content:space-between;
  pointer-events:none;z-index:22;
}
#app.rpg-ui .identity,
#app.rpg-ui .stats{
  pointer-events:auto;
  background:linear-gradient(180deg, rgba(36,28,21,.97), rgba(15,27,22,.96));
  border:1px solid rgba(214,188,124,.55);
  box-shadow:0 12px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,231,176,.15);
  border-radius:18px;
  padding:10px 14px;
  min-height:58px;
}
#app.rpg-ui .identity{flex:1 1 auto;min-width:0;display:grid;grid-template-columns:44px 1fr;column-gap:10px}
#app.rpg-ui .stats{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:8px;align-items:center}
#app.rpg-ui .mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(180deg,#203126,#0e1813);border:1px solid rgba(206,186,124,.45);font-size:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
#app.rpg-ui .brand{font-size:12px;letter-spacing:1.4px;color:#f5f0dd}
#app.rpg-ui .brand b{color:#dfeaa6}
#app.rpg-ui .server-name{font-size:11px;color:#d8d3bc;max-width:none}
#app.rpg-ui .tag{backdrop-filter:none;background:linear-gradient(180deg,#223028,#17211d);border:1px solid rgba(215,193,131,.34);border-radius:11px;padding:8px 11px;font-size:11px;min-width:92px;text-align:center}
#app.rpg-ui .tag.heart{color:#ffcdc8}
#app.rpg-ui #connectionStatus{top:78px;border-radius:12px;padding:8px 13px;background:#60362dec;border-color:#d9ab94}
#app.rpg-ui .tip{top:80px;padding:10px 16px;background:rgba(16,28,22,.92);border:1px solid rgba(209,189,129,.33);border-radius:14px;color:#f0f3de;box-shadow:0 10px 22px rgba(0,0,0,.22)}
#app.rpg-ui .zone{top:84px;right:calc(var(--safe-right,env(safe-area-inset-right)) + 18px);border-radius:14px;padding:10px 12px;font-size:11px}
#app.rpg-ui .swim-label{top:auto;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 122px);right:calc(var(--safe-right,env(safe-area-inset-right)) + 20px);background:rgba(31,86,112,.9);border-color:#79ccff}
#app.rpg-ui .controls-toggle,
#app.rpg-ui .zoom-controls,
#app.rpg-ui .combat-controls,
#app.rpg-ui .chat-toggle,
#app.rpg-ui .farm-button,
#app.rpg-ui .farm-select,
#app.rpg-ui .fullscreen-toggle,
#app.rpg-ui .position{
  box-shadow:0 10px 20px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,232,174,.06);
}
#app.rpg-ui .controls-toggle,
#app.rpg-ui .zoom-controls{
  left:calc(var(--safe-left,env(safe-area-inset-left)) + 14px);
  background:linear-gradient(180deg, rgba(41,30,20,.96), rgba(19,29,23,.98));
  border:1px solid rgba(208,183,118,.5);
  border-radius:16px;
}
#app.rpg-ui .controls-toggle{top:86px;padding:10px 13px;min-height:44px;font-weight:850;color:#f4efdc;max-width:220px}
#app.rpg-ui .zoom-controls{top:141px;padding:12px;width:min(240px,28vw);min-width:180px}
#app.rpg-ui .zoom-heading label{font-size:12px;color:#f6f0db}
#app.rpg-ui .graphics-toggle{background:#304332;border-color:#8f845f;border-radius:9px}
#app.rpg-ui .performance-label{font-size:11px;color:#dbe7c6}
#app.rpg-ui .graphics-menu{left:0;top:calc(100% + 8px);width:100%;background:linear-gradient(180deg,#1b2a21,#101a15);border-color:#8a7b56}
#app.rpg-ui .graphics-menu button{background:#24392e;border:1px solid #5f6b4e;color:#edf2df;border-radius:9px;padding:9px;text-align:left}
#app.rpg-ui .combat-controls{top:86px;right:calc(var(--safe-right,env(safe-area-inset-right)) + 16px)}
#app.rpg-ui .combat-menu-toggle,
#app.rpg-ui .chat-toggle,
#app.rpg-ui .fullscreen-toggle,
#app.rpg-ui .farm-button,
#app.rpg-ui .farm-select{
  background:linear-gradient(180deg, rgba(49,35,23,.97), rgba(21,31,25,.98));
  border:1px solid rgba(208,183,118,.54);
  color:#f5f0df;
}
#app.rpg-ui .combat-menu-toggle{width:52px;height:52px;border-radius:16px;font-size:22px}
#app.rpg-ui .combat-settings{right:0;top:60px;width:min(290px,34vw);background:linear-gradient(180deg,#1c271f,#111916);border-color:#8e805a;border-radius:18px}
#app.rpg-ui .combat-settings-header button{background:#2d4637}
#app.rpg-ui .combat-setting-row{background:#24382d;border-color:#5d6f55;border-radius:12px}
#app.rpg-ui .combat-setting-row.active{background:#3e5d3f}
#app.rpg-ui .fullscreen-toggle{top:calc(var(--safe-top,env(safe-area-inset-top)) + 88px);left:auto;right:calc(var(--safe-right,env(safe-area-inset-right)) + 78px);transform:none;border-radius:14px;width:48px;height:48px;padding:0;font-size:20px}
#app.rpg-ui .fullscreen-toggle:active{transform:scale(.95)}
#app.rpg-ui .chat-toggle{right:calc(var(--safe-right,env(safe-area-inset-right)) + 16px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 246px);padding:10px 12px;border-radius:14px}
#app.rpg-ui .farm-button{right:calc(var(--safe-right,env(safe-area-inset-right)) + 18px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 164px);width:62px;height:62px;border-radius:18px;font-size:11px}
#app.rpg-ui .farm-select{right:calc(var(--safe-right,env(safe-area-inset-right)) + 19px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 118px);padding:8px 9px;border-radius:12px;font-size:10px;max-width:72px}
#app.rpg-ui .direction-pad.joystick,
#app.rpg-ui .aim-pad{
  bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 24px);
  width:126px;height:126px;border-radius:50%;
  background:
    radial-gradient(circle at 50% 45%, rgba(93,113,71,.45), rgba(19,29,24,.95) 60%),
    linear-gradient(180deg, rgba(58,43,28,.55), rgba(16,21,19,.8));
  border:2px solid rgba(208,183,118,.55);
  box-shadow:0 14px 24px rgba(0,0,0,.32), inset 0 2px 0 rgba(255,235,188,.08);
}
#app.rpg-ui .direction-pad.joystick{left:calc(var(--safe-left,env(safe-area-inset-left)) + 20px)}
#app.rpg-ui .aim-pad{right:calc(var(--safe-right,env(safe-area-inset-right)) + 20px)}
#app.rpg-ui .joystick-knob{background:radial-gradient(circle at 35% 35%, #d8e6bf, #79926e 58%, #3b4e41 100%);border:2px solid rgba(255,249,225,.35);box-shadow:0 4px 12px rgba(0,0,0,.28)}
#app.rpg-ui .pad-caption{font-size:11px;letter-spacing:.9px;color:#f6eed1;text-shadow:0 2px 4px #000}
#app.rpg-ui .position{left:calc(var(--safe-left,env(safe-area-inset-left)) + 24px);bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 4px);padding:8px 12px;border-radius:12px;background:linear-gradient(180deg, rgba(36,28,21,.96), rgba(16,26,21,.92));border:1px solid rgba(208,183,118,.42);color:#ece7d1;font-size:11px}
#app.rpg-ui .quickbar{
  left:50%!important;right:auto!important;top:auto!important;
  bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 8px)!important;
  transform:translateX(-50%)!important;
  width:min(48vw,520px);max-width:calc(100vw - 330px)!important;
  padding:8px 10px;gap:6px;border-radius:20px;
  background:linear-gradient(180deg, rgba(53,39,27,.97), rgba(15,25,20,.97));
  border:1px solid rgba(212,189,129,.55);
  box-shadow:0 16px 32px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,233,187,.09);
}
#app.rpg-ui .quickbar::before{
  content:'';position:absolute;inset:5px;border-radius:15px;border:1px solid rgba(255,237,193,.06);pointer-events:none;
}
#app.rpg-ui .quickbar button{min-height:58px;padding:5px 4px 4px;border-radius:14px;background:linear-gradient(180deg, rgba(39,56,44,.95), rgba(19,28,24,.98));border:1px solid rgba(119,113,79,.75);color:#efe8d3;gap:3px}
#app.rpg-ui .quickbar button span{font-size:22px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.28))}
#app.rpg-ui .quickbar button small{font-size:9px;letter-spacing:.2px;color:#d9d2bb}
#app.rpg-ui .quickbar button:hover,
#app.rpg-ui .quickbar button:focus-visible{background:linear-gradient(180deg, rgba(74,96,61,.95), rgba(32,43,28,.98));border-color:#d2c28a}
#app.rpg-ui .panel{
  top:98px;bottom:16px;left:50%;transform:translateX(-50%);
  width:min(960px,calc(100vw - 310px));max-height:none;height:auto;
  background:linear-gradient(180deg, rgba(40,28,18,.985), rgba(15,24,19,.985));
  border:1px solid rgba(213,188,126,.6);border-radius:24px;
  box-shadow:0 24px 50px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,233,188,.07);
}
#app.rpg-ui .panel::before{content:'';position:absolute;inset:8px;border-radius:18px;border:1px solid rgba(255,238,192,.06);pointer-events:none}
#app.rpg-ui .panel-top{padding:16px 20px 14px;background:linear-gradient(180deg, rgba(87,67,43,.32), rgba(0,0,0,0));border-bottom:1px solid rgba(215,190,129,.26)}
#app.rpg-ui .panel h2{font-size:20px;color:#f5efd9;letter-spacing:.6px}
#app.rpg-ui .panel-content{padding:18px;display:grid;gap:12px;align-content:start}
#app.rpg-ui .resource-row,
#app.rpg-ui .craft-card,
#app.rpg-ui .mini-player,
#app.rpg-ui .equipment,
#app.rpg-ui .trade-slot,
#app.rpg-ui .trade-bag-item,
#app.rpg-ui .pill,
#app.rpg-ui .chat-box,
#app.rpg-ui .auth-card{
  background:linear-gradient(180deg, rgba(31,45,36,.94), rgba(18,27,22,.97));
  border-color:rgba(210,188,129,.24);
}
#app.rpg-ui .resource-row{padding:14px;border-radius:14px}
#app.rpg-ui .resource-row b{font-size:14px;color:#f2edd8}
#app.rpg-ui .resource-row small{color:#bec7b6}
#app.rpg-ui .resource-row button,
#app.rpg-ui .main-action,
#app.rpg-ui .mini-player button,
#app.rpg-ui .craft-card button,
#app.rpg-ui .inventory-actions button,
#app.rpg-ui .secondary{
  background:linear-gradient(180deg, #cadb95, #8aab63);
  color:#182218;border:1px solid rgba(255,247,211,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
}
#app.rpg-ui .secondary{background:linear-gradient(180deg,#4d654b,#334338);color:#f2f4e6;border-color:#63775b}
#app.rpg-ui .inline-input,
#app.rpg-ui .inline-select,
#app.rpg-ui #chatForm input,
#app.rpg-ui .auth-card input{background:#1b2a22;border-color:#6b7258;color:#f3f5ec}
#app.rpg-ui .inventory-layout{grid-template-columns:minmax(0,1fr) 170px;gap:14px}
#app.rpg-ui .inventory-layout .inventory-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
#app.rpg-ui .slot{border-radius:14px;background:linear-gradient(180deg,#283a31,#14211b);border:1px solid rgba(213,188,129,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
#app.rpg-ui .slot.empty{background:linear-gradient(180deg,#1a2520,#111915)}
#app.rpg-ui .slot.chosen{outline:2px solid #d8cc8f;background:linear-gradient(180deg,#445d49,#1c2a22)}
#app.rpg-ui .paper-doll{width:120px;height:128px;border-radius:16px;background:linear-gradient(180deg,#24362d,#18231d);border-color:#8c815d}
#app.rpg-ui .equipment{padding:10px;border-radius:16px}
#app.rpg-ui .equip-row{padding:7px 8px;border-radius:12px;background:rgba(255,255,255,.03);margin-bottom:6px}
#app.rpg-ui .craft-category h3{color:#ece8cf;font-size:16px}
#app.rpg-ui .craft-card{padding:12px 10px;border-radius:14px}
#app.rpg-ui .craft-art{width:46px;height:46px;background:#30463a;border-color:#7d7b57}
#app.rpg-ui .craft-art .tool-icon{width:34px;height:34px}
#app.rpg-ui .chat-box{right:16px;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 300px);width:min(360px,34vw);height:320px;border-radius:18px}
#app.rpg-ui .chat-title{background:linear-gradient(180deg,#3a2d21,#22352c);font-size:13px}
#app.rpg-ui .shade{background:rgba(0,0,0,.5);backdrop-filter:blur(2px)}
#app.rpg-ui .home-toolbar{top:auto;bottom:calc(var(--safe-bottom,env(safe-area-inset-bottom)) + 92px);left:50%;transform:translateX(-50%);display:flex;gap:8px}
#app.rpg-ui .open-chest,
#app.rpg-ui .exit-house{background:linear-gradient(180deg, rgba(44,33,23,.95), rgba(18,28,22,.98));border:1px solid rgba(208,183,118,.48);border-radius:12px;color:#f5efdb}
#app.rpg-ui .rotate-notice{display:none!important}
@media (orientation:portrait){
  #app.rpg-ui .hud{width:min(96vw,540px);top:8px}
  #app.rpg-ui .identity{grid-template-columns:36px 1fr}
  #app.rpg-ui .stats{display:flex;flex-wrap:wrap;justify-content:flex-end}
  #app.rpg-ui .controls-toggle{top:82px;left:10px;max-width:180px}
  #app.rpg-ui .zoom-controls{top:136px;left:10px;width:min(220px,48vw)}
  #app.rpg-ui .combat-controls{top:82px;right:10px}
  #app.rpg-ui .fullscreen-toggle{top:82px;right:68px}
  #app.rpg-ui .quickbar{width:min(98vw,520px)!important;max-width:calc(100vw - 16px)!important;bottom:calc(var(--safe-bottom,0px) + 8px)!important}
  #app.rpg-ui .panel{width:min(98vw,560px);top:188px;bottom:8px}
  #app.rpg-ui .direction-pad.joystick,#app.rpg-ui .aim-pad{width:112px;height:112px;bottom:calc(var(--safe-bottom,0px) + 88px)}
  #app.rpg-ui .farm-button{bottom:calc(var(--safe-bottom,0px) + 214px)}
  #app.rpg-ui .farm-select{bottom:calc(var(--safe-bottom,0px) + 170px)}
  #app.rpg-ui .chat-toggle{bottom:calc(var(--safe-bottom,0px) + 264px)}
  #app.rpg-ui .chat-box{width:min(95vw,360px);height:300px;bottom:calc(var(--safe-bottom,0px) + 316px)}
  #app.rpg-ui .position{bottom:calc(var(--safe-bottom,0px) + 60px)}
}
@media (orientation:landscape) and (max-height:450px){
  #app.rpg-ui .hud{width:min(82vw,780px)}
  #app.rpg-ui .identity,#app.rpg-ui .stats{min-height:50px;padding:8px 11px}
  #app.rpg-ui .controls-toggle{top:68px;padding:8px 10px;min-height:38px}
  #app.rpg-ui .zoom-controls{top:114px;padding:10px;width:min(220px,30vw)}
  #app.rpg-ui .combat-controls{top:68px}
  #app.rpg-ui .fullscreen-toggle{top:68px}
  #app.rpg-ui .combat-menu-toggle{width:46px;height:46px}
  #app.rpg-ui .direction-pad.joystick,#app.rpg-ui .aim-pad{width:112px;height:112px;bottom:calc(var(--safe-bottom,0px) + 16px)}
  #app.rpg-ui .farm-button{bottom:calc(var(--safe-bottom,0px) + 142px);width:56px;height:56px}
  #app.rpg-ui .farm-select{bottom:calc(var(--safe-bottom,0px) + 101px)}
  #app.rpg-ui .chat-toggle{bottom:calc(var(--safe-bottom,0px) + 217px)}
  #app.rpg-ui .quickbar{min-height:72px;padding:6px 9px;max-width:calc(100vw - 300px)!important}
  #app.rpg-ui .quickbar button{min-height:52px}
  #app.rpg-ui .panel{top:86px;width:min(920px,calc(100vw - 298px))}
}

/* v0.9.13 — screenshot-driven usability fix. Override v0.9.12 oversized components. */
#app.rpg-ui .vignette{background:linear-gradient(180deg,rgba(0,0,0,.07),transparent 18%,transparent 82%,rgba(0,0,0,.10))}
#app.rpg-ui .hud{
  z-index:16;top:calc(var(--safe-top,0px) + 13px);left:calc(var(--safe-left,0px) + 96px);
  right:calc(var(--safe-right,0px) + 72px);transform:none;width:auto;height:42px;
  background:rgba(18,27,21,.88);border:1px solid rgba(191,177,116,.47);
  box-shadow:0 3px 12px rgba(0,0,0,.22);border-radius:12px;
  padding:4px 9px;gap:8px;align-items:center;
}
#app.rpg-ui .identity,#app.rpg-ui .stats{background:none;border:0;box-shadow:none;padding:0;border-radius:0;min-height:0}
#app.rpg-ui .identity{display:flex;align-items:center;gap:7px;flex:1;min-width:0}
#app.rpg-ui .stats{display:flex;align-items:center;gap:5px;flex:none}
#app.rpg-ui .mark{width:26px;height:29px;min-width:26px;border-radius:8px;font-size:15px;box-shadow:none}
#app.rpg-ui .brand{font-size:10px;letter-spacing:.55px;line-height:1.1}
#app.rpg-ui .server-name{font-size:9px;margin-top:1px;max-width:185px;overflow:hidden;text-overflow:ellipsis}
#app.rpg-ui .tag{font-size:10px;min-width:0;padding:6px 7px;border-radius:8px;border-color:rgba(186,173,124,.23)}
#app.rpg-ui .controls-toggle,#app.rpg-ui .zoom-controls{
  background:rgba(17,29,23,.82);border:1px solid rgba(186,173,124,.43);
  box-shadow:0 3px 9px rgba(0,0,0,.17);border-radius:10px;
  left:calc(var(--safe-left,0px) + 12px);
}
#app.rpg-ui .controls-toggle{top:calc(var(--safe-top,0px) + 78px);min-height:31px;max-width:160px;font-size:10px;padding:5px 9px}
#app.rpg-ui .zoom-controls{top:calc(var(--safe-top,0px) + 115px);width:165px;min-width:0;padding:7px 9px;display:flex;flex-direction:column;gap:2px}
#app.rpg-ui .zoom-heading{display:flex;justify-content:space-between;align-items:center;gap:5px}
#app.rpg-ui .zoom-heading label{font-size:10px;font-weight:700;white-space:nowrap}
#app.rpg-ui .performance-label{font-size:9px;color:#cfe1c7;white-space:nowrap;max-width:155px;overflow:hidden;text-overflow:clip}
#app.rpg-ui .zoom-expand{width:23px;height:22px;flex:0 0 23px;background:#293d31;border:1px solid #657357;border-radius:7px;color:#f0ebd4;font-size:14px;padding:0}
#app.rpg-ui .zoom-details{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:5px;padding-top:7px;border-top:1px solid rgba(197,180,126,.19)}
#app.rpg-ui .zoom-details[hidden],#app.rpg-ui .graphics-menu[hidden]{display:none!important}
#app.rpg-ui .zoom-details input{width:100%;min-width:0;height:20px;margin:0;accent-color:#b2d987}
#app.rpg-ui .zoom-details .graphics-toggle{width:auto;height:27px;padding:2px 8px;font-size:11px;display:inline-flex;gap:5px}
#app.rpg-ui .graphics-menu{top:calc(100% + 7px);left:0;width:165px}
#app.rpg-ui .combat-controls{top:calc(var(--safe-top,0px) + 72px);right:calc(var(--safe-right,0px) + 12px)}
#app.rpg-ui .combat-menu-toggle{width:40px;height:40px;border-radius:11px;font-size:17px;box-shadow:0 3px 10px rgba(0,0,0,.22)}
#app.rpg-ui .combat-settings{top:48px;right:0;width:min(248px,64vw)}
#app.rpg-ui .fullscreen-toggle{top:calc(var(--safe-top,0px) + 72px);right:calc(var(--safe-right,0px) + 59px);width:40px;height:40px;border-radius:11px;font-size:16px}
#app.rpg-ui .chat-toggle{top:calc(var(--safe-top,0px) + 119px);bottom:auto;right:calc(var(--safe-right,0px) + 12px);border-radius:11px;padding:7px 9px;font-size:17px}
#app.rpg-ui .chat-box{top:calc(var(--safe-top,0px) + 163px);bottom:auto;height:min(260px,calc(100dvh - 176px));right:12px;width:min(310px,55vw)}
#app.rpg-ui .farm-button,#app.rpg-ui .farm-select{z-index:12;top:auto;right:auto;min-width:0;box-shadow:0 3px 10px rgba(0,0,0,.2);border-radius:11px}
#app.rpg-ui .farm-button{left:calc(var(--safe-left,0px) + 128px);bottom:calc(var(--safe-bottom,0px) + 116px);width:49px;height:43px;padding:3px;font-size:10px}
#app.rpg-ui .farm-select{left:calc(var(--safe-left,0px) + 182px);bottom:calc(var(--safe-bottom,0px) + 116px);width:52px;height:43px;padding:3px;font-size:9px;max-width:none}
#app.rpg-ui .direction-pad.joystick,#app.rpg-ui .aim-pad{
  bottom:calc(var(--safe-bottom,0px) + 18px);width:105px;height:105px;
  background:rgba(18,31,24,.68);border:2px solid rgba(182,186,137,.55);
  box-shadow:0 4px 12px rgba(0,0,0,.20);
}
#app.rpg-ui .direction-pad.joystick{left:calc(var(--safe-left,0px) + 13px)}
#app.rpg-ui .aim-pad{right:calc(var(--safe-right,0px) + 14px)}
#app.rpg-ui .pad-caption{font-size:9px}
#app.rpg-ui .joystick-knob{width:44px;height:44px}
#app.rpg-ui .quickbar{
  z-index:11;left:50%!important;right:auto!important;bottom:calc(var(--safe-bottom,0px) + 6px)!important;
  top:auto!important;transform:translateX(-50%)!important;width:min(45vw,380px);
  max-width:calc(100vw - 280px)!important;padding:4px 5px;gap:4px;
  border-radius:13px;background:rgba(17,27,20,.86);border:1px solid rgba(192,172,116,.44);
  box-shadow:0 4px 12px rgba(0,0,0,.22)
}
#app.rpg-ui .quickbar::before{display:none}
#app.rpg-ui .quickbar button{min-height:40px;padding:2px 1px;gap:0;border-radius:9px;background:rgba(41,58,43,.7);border-color:rgba(156,163,113,.35)}
#app.rpg-ui .quickbar button span{font-size:18px}
#app.rpg-ui .quickbar button small{display:block;font-size:8px}
#app.rpg-ui .position{left:calc(var(--safe-left,0px) + 130px);bottom:calc(var(--safe-bottom,0px) + 4px);border-radius:7px;padding:4px 7px;background:rgba(16,28,21,.76);font-size:9px}
#app.rpg-ui .swim-label{left:auto!important;right:calc(var(--safe-right,0px) + 14px)!important;top:auto!important;bottom:calc(var(--safe-bottom,0px) + 130px)!important;width:max-content!important;max-width:130px;min-width:0;font-size:10px;border-radius:9px;padding:6px 9px;box-shadow:0 3px 10px #0002}
#app.rpg-ui .tip{top:calc(var(--safe-top,0px) + 60px);border-radius:9px;padding:6px 10px;max-width:55vw;font-size:10px}
#app.rpg-ui .zone:not(.swim-label){top:calc(var(--safe-top,0px) + 164px);right:14px;font-size:10px;padding:6px 9px}
/* Modal mode takes priority over every HUD control. No floating hotbar on top. */
#app.rpg-ui .shade{z-index:60;background:rgba(1,9,7,.82);backdrop-filter:none}
#app.rpg-ui .panel{z-index:61;top:calc(var(--safe-top,0px) + 30px);bottom:calc(var(--safe-bottom,0px) + 7px);left:12px;right:12px;
  transform:none;width:auto;max-height:none;height:auto;min-height:0;display:flex;flex-direction:column;
  border-radius:13px;background:#17241d;box-shadow:0 8px 25px rgba(0,0,0,.43);border:1px solid rgba(196,178,121,.45)
}
#app.rpg-ui .panel::before{display:none}
#app.rpg-ui .panel-top{position:relative;flex:0 0 39px;min-height:39px;padding:5px 12px;border-bottom:1px solid rgba(204,185,130,.25);background:#253428}
#app.rpg-ui .panel-top h2{font-size:16px;line-height:1.1;letter-spacing:0}
#app.rpg-ui .panel-top button{min-width:36px;min-height:32px;border-radius:8px;background:#334c3b;color:#f4f3df;font-size:20px}
#app.rpg-ui .panel-content{display:block;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:9px 12px 20px;overscroll-behavior:contain}
#app.rpg-ui .panel-content .section-label{font-size:11px;margin:5px 0 6px}
#app.rpg-ui .panel-content .muted{font-size:10px;line-height:1.4;margin:5px 0 8px}
#app.rpg-ui .panel-content .main-action{margin:5px 0;padding:7px 10px;min-height:33px;font-size:11px}
#app.rpg-ui .panel-content .resource-row{padding:7px 9px;margin-bottom:5px;border-radius:9px;min-height:37px}
#app.rpg-ui .panel-content .resource-row b{font-size:11px}
#app.rpg-ui .panel-content .resource-row button{padding:6px 8px;font-size:11px}
#app.rpg-ui .panel-content .resource-row small{font-size:9px;margin-top:2px}
#app.rpg-ui .panel-content .inventory-layout{grid-template-columns:minmax(0,1fr) 148px;gap:10px;align-items:start}
#app.rpg-ui .panel-content .inventory-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-top:3px}
#app.rpg-ui .panel-content .slot{border-radius:8px;min-height:38px}
#app.rpg-ui .panel-content .slot .tool-icon{width:27px;height:27px}
#app.rpg-ui .panel-content .equipment{padding:6px;border-radius:9px}
#app.rpg-ui .panel-content .paper-doll{width:89px;height:83px;border-radius:8px;margin:4px auto}
#app.rpg-ui .panel-content .equip-row{padding:5px 4px;margin-bottom:3px;border-radius:7px;min-height:29px}
#app.rpg-ui .panel-content .equip-row small{font-size:9px}
#app.rpg-ui .panel-content .inventory-actions{margin:6px 0;gap:5px}
#app.rpg-ui .panel-content .inventory-actions button{padding:7px 8px;font-size:10px;border-radius:8px}
/* crafting: horizontal category tabs, two-column recipe cards for scrolling. */
#app.rpg-ui .panel[data-screen="craft"] .panel-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:7px}
#app.rpg-ui .panel[data-screen="craft"] .panel-content>p,
#app.rpg-ui .panel[data-screen="craft"] .panel-content>.resource-row,
#app.rpg-ui .panel[data-screen="craft"] .panel-content>.economy-tabs{grid-column:1/-1}
#app.rpg-ui .panel-content .economy-tabs{display:flex;flex-wrap:nowrap;align-items:center;overflow-x:auto;gap:5px;margin:3px 0 4px;padding:0 0 3px;scrollbar-width:thin}
#app.rpg-ui .panel-content .economy-tabs button{flex:0 0 auto;min-height:33px;padding:6px 10px;font-size:11px;border-radius:8px;white-space:nowrap;background:#2b4234;color:#eaf3e2}
#app.rpg-ui .panel-content .economy-tabs button.active{background:#84aa69;color:#102216;border-color:#cee6b2}
#app.rpg-ui .panel-content .craft-card{min-width:0;margin:0;padding:6px 8px;gap:6px;border-radius:9px}
#app.rpg-ui .panel-content .craft-info strong{font-size:11px}
#app.rpg-ui .panel-content .craft-info small{font-size:9px}
#app.rpg-ui .panel-content .craft-ingredients{font-size:9px;gap:2px 5px}
#app.rpg-ui .panel-content .craft-card button{min-height:31px;padding:5px 8px;font-size:10px}
#app.rpg-ui .panel-content .craft-art{flex:0 0 34px;width:34px;height:34px;border-radius:6px}
#app.rpg-ui .panel-content .craft-art .tool-icon{width:27px;height:27px}
#app.rpg-ui.panel-open .quickbar{display:none!important}
#app.rpg-ui.panel-open .hud,#app.rpg-ui.panel-open .zoom-controls,#app.rpg-ui.panel-open .controls-toggle,#app.rpg-ui.panel-open .combat-controls,#app.rpg-ui.panel-open .fullscreen-toggle,#app.rpg-ui.panel-open .chat-toggle,#app.rpg-ui.panel-open .farm-button,#app.rpg-ui.panel-open .farm-select,#app.rpg-ui.panel-open .direction-pad,#app.rpg-ui.panel-open .aim-pad,#app.rpg-ui.panel-open .position,#app.rpg-ui.panel-open .swim-label{visibility:hidden;pointer-events:none}
#app.rpg-ui.panel-open .chat-box{display:none!important}
@media(orientation:landscape) and (max-height:400px){
 #app.rpg-ui .hud{top:calc(var(--safe-top,0px) + 7px);height:37px}
 #app.rpg-ui .controls-toggle{top:calc(var(--safe-top,0px) + 60px)}
 #app.rpg-ui .zoom-controls{top:calc(var(--safe-top,0px) + 98px)}
 #app.rpg-ui .combat-controls,#app.rpg-ui .fullscreen-toggle{top:calc(var(--safe-top,0px) + 61px)}
 #app.rpg-ui .chat-toggle{top:calc(var(--safe-top,0px) + 105px)}
 #app.rpg-ui .direction-pad.joystick,#app.rpg-ui .aim-pad{bottom:calc(var(--safe-bottom,0px) + 13px)}
 #app.rpg-ui .quickbar{bottom:calc(var(--safe-bottom,0px) + 5px)!important}
 #app.rpg-ui .farm-button,#app.rpg-ui .farm-select{bottom:calc(var(--safe-bottom,0px) + 116px)}
 #app.rpg-ui .panel{top:calc(var(--safe-top,0px) + 24px);bottom:calc(var(--safe-bottom,0px) + 5px)}
}
@media(orientation:portrait){
 #app.rpg-ui .hud{top:calc(var(--safe-top,0px) + 12px);left:8px;right:8px;max-width:none;width:auto;padding:4px 7px}
 #app.rpg-ui .brand{font-size:9px}
 #app.rpg-ui .zoom-controls{left:9px;top:calc(var(--safe-top,0px) + 110px);width:153px}
 #app.rpg-ui .controls-toggle{left:9px;top:calc(var(--safe-top,0px) + 74px)}
 #app.rpg-ui .direction-pad.joystick,#app.rpg-ui .aim-pad{bottom:calc(var(--safe-bottom,0px) + 76px)}
 #app.rpg-ui .farm-button{left:12px;bottom:calc(var(--safe-bottom,0px) + 191px)}
 #app.rpg-ui .farm-select{left:67px;bottom:calc(var(--safe-bottom,0px) + 191px)}
 #app.rpg-ui .quickbar{width:min(98vw,410px)!important;max-width:calc(100vw - 16px)!important}
 #app.rpg-ui .position{left:12px;bottom:calc(var(--safe-bottom,0px) + 55px)}
 #app.rpg-ui .panel{left:7px;right:7px;top:calc(var(--safe-top,0px) + 38px);bottom:calc(var(--safe-bottom,0px) + 7px)}
 #app.rpg-ui .panel-content .inventory-layout{grid-template-columns:minmax(0,1fr) 119px;gap:6px}
 #app.rpg-ui .panel-content .inventory-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
 #app.rpg-ui .panel[data-screen="craft"] .panel-content{grid-template-columns:1fr}
}

/* Explicit hidden-state overrides: ID-scoped modal styles must never reveal a closed menu. */
#app.rpg-ui .panel[hidden],#app.rpg-ui .shade[hidden],#app.rpg-ui .chat-box[hidden]{display:none!important}
#app.rpg-ui .panel-content .economy-tabs{min-height:42px;align-items:center;overflow-y:hidden}
#app.rpg-ui .panel-content .economy-tabs button{min-height:34px;height:34px;line-height:1.1;align-self:center}
@media(orientation:landscape){#app.rpg-ui .panel-content .inventory-grid{grid-template-columns:repeat(9,minmax(0,1fr))}}

/* Final compact height and top bar direction (legacy .stats used a vertical column). */
#app.rpg-ui .stats{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-end}
#app.rpg-ui .quickbar{height:52px!important;min-height:0!important;max-height:52px!important;align-items:center}
#app.rpg-ui .quickbar button{min-height:40px!important;max-height:42px!important}
/* Telegram/Android status icons must remain above the game HUD. */
@media(orientation:landscape){#app.rpg-ui .hud{top:max(20px,calc(var(--safe-top,0px) + 8px))}}

/* v0.9.16 joystick movement, true bag containers, enlarged inventory, interactive map */
#app.rpg-ui .panel[data-screen="map"]{width:min(98vw,1150px);height:min(95dvh,970px);max-height:95dvh;bottom:2.5dvh;}
#app.rpg-ui .panel[data-screen="map"] .panel-content{flex:1;display:flex;align-items:center;flex-direction:column;gap:9px;padding:8px 12px 12px;min-height:0;}
#app.rpg-ui #miniMap{width:auto;height:auto;max-width:100%;max-height:calc(95dvh - 164px);aspect-ratio:1;flex:1 1 auto;min-height:0;object-fit:contain;border:2px solid #658668;border-radius:10px;touch-action:none;image-rendering:pixelated;margin:0 auto;}
#app.rpg-ui .map-toolbar{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;}
#app.rpg-ui .map-toolbar strong{margin-right:auto;font-size:13px;}
#app.rpg-ui .map-toolbar button{min-width:45px;min-height:39px;background:#36553b;border:1px solid #78945f;color:white;border-radius:8px;font-weight:900;font-size:17px;}
#app.rpg-ui .map-help{margin:0;font-size:11px;line-height:1.3;max-width:800px;text-align:center;}
#app.rpg-ui .panel[data-screen="inventory"]{width:min(97vw,930px);max-height:91dvh;}
#app.rpg-ui .panel[data-screen="bag"]{width:min(96vw,900px);max-height:91dvh;}
#app.rpg-ui .panel[data-screen="inventory"] .inventory-grid{grid-template-columns:repeat(5,minmax(51px,1fr));gap:7px;}
#app.rpg-ui .panel[data-screen="inventory"] .slot{min-height:59px;}
#app.rpg-ui .panel[data-screen="inventory"] .slot .tool-icon{width:43px;height:43px;flex:0 0 43px;}
#app.rpg-ui .panel[data-screen="inventory"] .slot .quantity{font-size:12px;right:4px;bottom:3px;}
#app.rpg-ui .panel[data-screen="inventory"] .selected-item{font-size:12px;}
#app.rpg-ui .bag-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:8px 0 12px;}
#app.rpg-ui .bag-choices button{display:flex;flex-direction:column;align-items:center;gap:4px;background:#2b4834;border:1px solid #6e8a6c;border-radius:10px;padding:9px 4px;color:#eaffdd;font-size:12px;font-weight:800;min-width:0;}
#app.rpg-ui .bag-choices button:disabled{opacity:.45;}
#app.rpg-ui .bag-choices small{font-size:10px;font-weight:500;}
#app.rpg-ui .bag-title{display:flex;gap:12px;align-items:center;padding:10px;background:#263e30;border:1px solid #6b8562;border-radius:12px;}
#app.rpg-ui .bag-title .tool-icon{width:52px;height:52px;}
#app.rpg-ui .bag-title small{display:block;color:#c4d4bf;margin-top:6px;font-size:11px;}
#app.rpg-ui .bag-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
#app.rpg-ui .bag-columns>div{background:#1d3026;border:1px solid #4b6f50;border-radius:10px;padding:10px;min-width:0;}
#app.rpg-ui .bag-columns h3{margin:0 0 10px;font-size:14px;}
#app.rpg-ui .bag-transfer-row{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:45px;padding:7px 0;border-bottom:1px solid #45614855;flex-wrap:wrap;}
#app.rpg-ui .bag-transfer-row span{display:flex;align-items:center;gap:4px;font-size:11px;min-width:0;}
#app.rpg-ui .bag-transfer-row .item-icon-inline{width:26px;height:26px;}
#app.rpg-ui .bag-transfer-row div{display:flex;gap:3px;}
#app.rpg-ui .bag-transfer-row button{background:#92c887;border:none;color:#19331c;border-radius:7px;min-width:34px;min-height:32px;font-size:11px;font-weight:900;}
@media(max-width:680px){#app.rpg-ui .bag-columns{grid-template-columns:1fr;}#app.rpg-ui .panel[data-screen="inventory"] .inventory-grid{grid-template-columns:repeat(4,minmax(44px,1fr));gap:5px;}}

/* Admin-only drone controls */
.admin-drones{margin:11px 0;padding:12px;border:1px solid #589b99;border-radius:9px;background:#183936;color:#defafb}
.admin-drones b{display:block;font-size:13px}.admin-drones small{display:block;color:#9dcac9;font-size:11px;margin:5px 0 8px}
.admin-drones .inventory-actions{display:flex;flex-wrap:wrap;gap:6px}.admin-drones .inventory-actions button{flex:1;min-width:58px;min-height:34px}