*{box-sizing:border-box;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}html,body{margin:0;width:100%;height:100%;background:#090b0c;overflow:hidden;touch-action:none;color:#e9dec3;font:13px system-ui}body{display:flex;justify-content:center}button{font:inherit;color:inherit;border:1px solid #655c44;background:linear-gradient(#35372f,#181d19);box-shadow:inset 0 0 8px #090b08;border-radius:7px;touch-action:none;min-height:44px;cursor:pointer}button:active,button.held,button[aria-pressed=true]{background:#635435;border-color:#c1a36a;box-shadow:inset 0 0 10px #17150e}button:disabled{opacity:.48;cursor:default}button:focus-visible{outline:2px solid #dcc389;outline-offset:-3px}#stage{position:relative;display:flex;flex-direction:column;width:100%;max-width:520px;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:#111612;overflow:hidden}#menu{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;padding:6px 8px;border-bottom:1px solid #534e3b;flex:none;background:#171c17}#viewport{position:relative;flex:1;min-height:0;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none}#dock{flex:none;padding:7px 10px 10px;border-top:1px solid #746544;background:linear-gradient(#25291f,#111813)}#quickbar{display:flex;gap:6px;padding-bottom:8px;border-bottom:1px solid #59563e77}#slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));flex:1;gap:5px}.slot{position:relative;height:48px;min-width:0;padding:0;display:grid;place-items:center;background:#111612}.slot .icon{width:36px;height:36px;background-repeat:no-repeat;pointer-events:none}.slot .number{position:absolute;left:3px;top:1px;font-size:10px;color:#dfca9c;text-shadow:0 1px 3px black}.slot .count{position:absolute;right:3px;bottom:1px;font-size:11px;text-shadow:0 1px 3px black}.slot.empty:after{content:'—';position:absolute;color:#60664f;font-size:18px}#page{flex:none;width:46px;font-size:12px}#combat{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 7px 0;height:140px}#stick{position:relative;flex:none;width:112px;height:112px;border-radius:50%;border:1px solid #8d8a67;background:radial-gradient(#39452d,#15211b);box-shadow:inset 0 0 18px #0009;touch-action:none}#stick:after{content:'移动';position:absolute;bottom:6px;left:0;right:0;text-align:center;font-size:10px;color:#b1b299;pointer-events:none}#knob{position:absolute;width:48px;height:48px;left:31px;top:31px;border-radius:50%;border:1px solid #b1a880;background:radial-gradient(circle at 35% 25%,#93927b,#424d3a 65%,#202a20);pointer-events:none}#actions{display:grid;grid-template-columns:repeat(2,58px);grid-template-rows:repeat(2,55px);gap:8px}#actions button{border-radius:15px}#attack{border-color:#b49963;background:linear-gradient(#5c5036,#25291b)}#panelbar{flex:none;min-height:56px;padding:6px 10px;display:flex;align-items:center;gap:8px;border-top:1px solid #776345;background:#151c17}#panelbar[hidden]{display:none}#panelhint{flex:1;line-height:1.4;font-size:12px;color:#b9bda9}#close{padding:0 16px;flex:none}#stage.panel-open #dock{display:none}#loading{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#171817;z-index:10;line-height:2}#loading b{color:#ccb483;letter-spacing:2px;font-size:20px}#status{max-width:320px;padding:20px;color:#b5b6ad}@media(max-height:640px){#combat{height:122px;padding-top:6px}#stick{width:104px;height:104px}#knob{left:27px;top:27px}#actions{grid-template-rows:repeat(2,49px);gap:5px}#dock{padding-bottom:6px}}

/* World canvas fills the entire phone; touch controls float over it. */
#stage{display:block;padding:0}
#viewport{position:absolute;inset:0}
#menu{position:absolute;z-index:2;top:calc(env(safe-area-inset-top) + 44px);left:6px;display:flex;gap:4px;padding:0;border:0;background:none}
#menu button{width:44px;padding:0;font-size:12px;background:#20271ccc}
#dock{position:absolute;z-index:2;left:0;right:0;bottom:env(safe-area-inset-bottom);padding:6px 10px 10px;border:0;background:none;pointer-events:none}
#dock button,#stick{pointer-events:auto}
#quickbar{border:0;padding-bottom:4px;gap:5px}
.slot{background:#141c16aa;height:44px}
#combat{padding-top:4px;height:132px}
#stick{background:radial-gradient(#39452d77,#15211b66)}
#actions button{background:#232a1dcc;border-radius:50%}
#attack{background:#54472ccc!important}
#panelbar{position:absolute;bottom:env(safe-area-inset-bottom);left:0;right:0;z-index:3}
#equip[hidden]{display:none}#equip{padding:0 12px;flex:none}
#stage.panel-open #menu{top:env(safe-area-inset-top);left:0;right:0;padding:6px 8px;background:#171c17;display:grid;grid-template-columns:repeat(4,1fr)}
#stage.panel-open #menu button{width:auto}
#stage.panel-open #viewport{top:calc(env(safe-area-inset-top) + 56px);bottom:calc(env(safe-area-inset-bottom) + 56px)}
@media(max-height:640px){#combat{height:120px}}

#asset-loading{position:absolute;inset:40% 15% auto;z-index:20;padding:16px;background:#172118ed}#asset-loading[hidden]{display:none}
#economy,#item-detail{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;gap:8px;padding:10px;background:#171b16f5;color:#e9dec3;overflow:hidden;touch-action:pan-y}#economy[hidden],#item-detail[hidden]{display:none}.economy-open canvas{visibility:hidden}#economy header,#item-detail header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none}#item-detail{z-index:6}#detail-close{padding:0 10px;flex:none}#economy-tabs,#stash-tabs{display:flex;gap:6px;flex:none;flex-wrap:wrap}#economy-tabs button,#stash-tabs button{flex:1;padding:0 8px}#item-list,#comparison{overflow:auto;min-height:0;flex:1;touch-action:pan-y;overscroll-behavior:contain}#item-list{display:flex;flex-direction:column;gap:6px}.item-row{min-height:68px;flex:none;display:grid;grid-template-columns:40px 1fr;gap:0 8px;text-align:left;padding:8px;touch-action:pan-y}.item-row .item-icon{grid-row:span 2}.item-row small{color:#bfb392}.item-icon{display:inline-block;width:36px;height:36px;flex:none;background-repeat:no-repeat;vertical-align:middle;margin-right:4px}#comparison article{border:1px solid #655c44;padding:10px;margin-bottom:8px;background:#22251d}#comparison article>b{color:#d9bf86}#comparison pre{white-space:pre-wrap;font:13px/1.5 system-ui;margin:8px 0 0;overflow-wrap:anywhere}#trade-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex:none;border-top:1px solid #655c44;padding-top:8px}#trade-controls[hidden]{display:none}#trade-quantity{width:68px;height:44px;border:1px solid #655c44;background:#111910;color:#fff;font:16px system-ui;user-select:text}#trade-confirm{width:100%;padding:0 12px}#trade-price{margin-left:auto}#loot-toggle{position:absolute;right:10px;bottom:calc(env(safe-area-inset-bottom) + 204px);z-index:3;padding:0 10px;background:#253020db}#loot-list{position:absolute;right:10px;bottom:calc(env(safe-area-inset-bottom) + 254px);z-index:4;width:min(300px,calc(100% - 20px));max-height:32vh;overflow:auto;background:#151c17f0;padding:6px;border:1px solid #655c44;touch-action:pan-y}#loot-list button{width:100%;display:flex;align-items:center;padding:4px;text-align:left;margin:3px 0}#loot-toggle[hidden],#loot-list[hidden]{display:none}#economy-toast{position:absolute;left:12px;right:12px;top:calc(env(safe-area-inset-top) + 60px);padding:12px;background:#222c1cf0;border:1px solid #89784c;z-index:30;pointer-events:none}#economy-toast[hidden]{display:none}

#economy-toast{top:auto;bottom:calc(env(safe-area-inset-bottom) + 256px)}
/* Keep the game itself portrait even on a wide desktop window. */
#stage{height:100vh;height:100dvh;width:min(100vw,520px,70dvh);flex:none}
#portrait-gate{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;background:#111612;color:#e9dec3;text-align:center}
#portrait-gate[hidden]{display:none}#portrait-gate b{font-size:22px}#portrait-gate p{margin:0;max-width:440px;line-height:1.6}#portrait-lock{padding:0 24px;min-height:48px}.portrait-blocked #stage{visibility:hidden;pointer-events:none}
.quality-badge{font-size:15px;font-weight:700;margin-bottom:10px}#item-lock{width:100%;margin-bottom:10px}.stat-comparison{border:1px solid #655c44;padding:10px;margin-bottom:10px;background:#20261c}.stat-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;padding-top:7px;font-size:12px}.stat-row span:first-child{overflow-wrap:anywhere}.stat-up{color:#9cda93}.stat-down{color:#efa69a}.stat-same{color:#b8b7a5}.comparison-help{font-size:12px;line-height:1.5;color:#bebca8}.valuable-loot{border-color:#d8b65a!important;box-shadow:0 0 8px #bc923050!important}
/* Drop overlay never captures joystick, attack or inventory touches. */
#loot-fx{position:absolute;inset:0;pointer-events:none;z-index:1}
#loot-fx-toggle{position:absolute;left:10px;bottom:calc(env(safe-area-inset-bottom) + 204px);width:44px;height:44px;white-space:pre-line;font-size:11px;line-height:15px;z-index:3;background:#253020db}
#loot-fx-toggle[hidden],.panel-open #loot-fx,.panel-open #loot-fx-toggle{display:none}
#loot-toggle{max-width:calc(100% - 74px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#loot-debug{position:absolute;left:10px;bottom:calc(env(safe-area-inset-bottom) + 254px);height:44px;padding:0 10px;z-index:3;background:#253020db}
#loot-debug[hidden],.panel-open #loot-debug{display:none}
#village-gate{position:absolute;right:10px;bottom:calc(env(safe-area-inset-bottom) + 254px);z-index:3;max-width:calc(100% - 112px);padding:0 10px;background:#3a3425ed}
#village-gate[hidden],#run-progress[hidden],#travel-panel[hidden]{display:none}
#run-progress{position:absolute;left:10px;right:10px;bottom:calc(env(safe-area-inset-bottom) + 304px);z-index:2;padding:6px 9px;background:#141d17c9;border-left:2px solid #a78f58;font-size:12px;pointer-events:none}
#travel-panel{position:absolute;inset:0;z-index:40;padding:calc(env(safe-area-inset-top) + 20px) 16px calc(env(safe-area-inset-bottom) + 20px);background:#111a16f5;overflow:auto;touch-action:pan-y;line-height:1.65}
#travel-panel header{display:flex;justify-content:space-between;align-items:center;gap:12px}#travel-panel h2{font-size:21px;margin:0}#travel-close{padding:0 16px}#travel-panel article{padding:18px 14px;border:1px solid #887248;background:linear-gradient(#343a2b,#1c251d);margin:24px 0}#travel-panel h3{color:#e0c78f;font-size:18px;margin:0 0 12px}#travel-panel p{color:#c5c5ac}#travel-enter{width:100%;margin-top:12px;background:#5b5031;min-height:48px}
#combat-debug{position:absolute;left:10px;bottom:calc(env(safe-area-inset-bottom) + 346px);z-index:3;min-height:44px;padding:0 12px;background:#253020db}
#combat-debug[hidden],#combat-debug-panel[hidden]{display:none}
#combat-debug-panel{position:absolute;inset:0;z-index:45;padding:calc(env(safe-area-inset-top) + 20px) 16px 24px;background:#111a16f5;overflow:auto;touch-action:pan-y;line-height:1.6}
#combat-debug-panel header{display:flex;align-items:center;justify-content:space-between;gap:12px}#combat-debug-panel h2{font-size:21px}#combat-debug-panel button{min-height:48px;padding:8px 16px}#combat-debug-panel .debug-targets{display:grid;gap:12px}#combat-debug-message{color:#e0c78f}



/* Desktop preview needs a visible OS cursor; touch devices have no cursor. */
#stage,#stage *{cursor:auto!important}
#stage button,#stage button *{cursor:pointer!important}
#stage button:disabled{cursor:default!important}
#stick{cursor:grab!important}
#stick:active{cursor:grabbing!important}
#stage button{pointer-events:auto;touch-action:manipulation}
#stage button>*{pointer-events:none}

button,a,select{-webkit-tap-highlight-color:transparent}
