/* Android touch magic window, item lists and prompts (mobile-magic.js,
   mobile-item-list.js, mobile-prompt.js). Builds on android/mobile-ui.css. */

/* Magic: one section per level page, tiles wide enough for name + MP/HP. */
.mw-ml-magic-stats{display:flex;gap:18px;margin:0 0 4px;color:#ead5ac}
.mw-ml-magic-level{margin:10px 0 6px}
.mw-ml-magic-level:first-of-type{margin-top:4px}
.mw-ml-skills{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
.mw-ml-skill{min-height:96px}
.mw-ml-skill .mw-tile-name{font-size:13px}
.mw-ml-skill.mw-ml-assigning:not(:disabled){border-color:#d0a95c;border-style:dashed}
.mw-ml-magic .mw-footer{align-items:center}
.mw-ml-magic .mw-footer .mw-ml-magic-hint{flex:1;font-size:14px;color:#c8b58c}
.mw-ml-magic .mw-footer .mw-button{flex:0 0 150px}
.mw-ml-empty{padding:24px 0;text-align:center}

/* Item lists render in normal flow inside #dialogbody. */
.mw-ml-list{width:100%;min-width:0;box-sizing:border-box;color:#eee8dc;font:15px/1.35 "Microsoft JhengHei","PingFang TC",sans-serif}
.mw-ml-list .mw-row-main{min-height:60px;font-family:inherit}
.mw-ml-list .mw-row-main:disabled{opacity:.45}
.mw-ml-row.mw-ml-chosen .mw-row-main{border-color:#d0a95c;background:#2c2416}
.mw-ml-stepper{display:flex;align-items:stretch;gap:4px;flex:0 0 auto}
.mw-ml-list .mw-ml-step{width:56px;min-width:56px;min-height:60px;padding:0;font-size:26px;line-height:1}
.mw-ml-qty{min-width:64px;min-height:60px;box-sizing:border-box;margin:0;padding:0 6px;border:1px solid #5d4a2f;border-radius:6px;background:#000;color:#ffe2a2;font:600 20px "Microsoft JhengHei",sans-serif;text-align:center;cursor:pointer}
.mw-ml-qty:disabled{opacity:.45}
.mw-ml-qty-static{display:flex;align-items:center;justify-content:center;cursor:default}

/* #dialogbody hosting a mobile list: the shop Total/OK/Cancel become one
   sticky row of large text buttons (their sprite art is cleared). */
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list){display:grid;grid-template-columns:1fr auto auto;grid-auto-flow:row dense;gap:8px;align-content:start}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>:not(.pc-shop-checkout,.pc-shop-total,.pc-shop-cancel){grid-column:1/-1}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>:is(.pc-shop-checkout,.pc-shop-total,.pc-shop-cancel){position:sticky;bottom:0;left:auto;top:auto;z-index:1;box-sizing:border-box;height:auto;min-height:52px;margin:0}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-total{grid-column:1;display:flex;align-items:center;width:auto;padding:0 12px;border:1px solid #5d4a2f;border-radius:6px;background:#0f0d0b;color:#ffe2a2;font:600 18px "Microsoft JhengHei",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-total::before{content:"合計 ";margin-right:6px;color:#c8b58c;font-weight:normal;font-size:15px}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>:is(.pc-shop-checkout,.pc-shop-cancel){width:auto;min-width:96px;padding:0 18px;border:1px solid #8d7248;border-radius:6px;background:#302820!important;background-image:none!important;color:#eee8dc;font:17px "Microsoft JhengHei",sans-serif;cursor:pointer}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-checkout{grid-column:2;background:#6b5226!important;border-color:#d0a95c;color:#fff4d6}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-cancel{grid-column:3}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>:is(.pc-shop-checkout,.pc-shop-cancel)::before{content:attr(aria-label)}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-cancel::before{content:"取消"}
.game.android-layout #dialog #dialogbody:has(>.mw-ml-list)>.pc-shop-checkout:disabled{opacity:.45;cursor:default}

/* Shop buy/sell window (#dialog.mw-ml-shop-dialog): the list scrolls, and 合計 + 購買/出售 stay as one
   sticky row at the bottom. Keyed on the dialog class so it holds even before the list is mounted.
   No 取消 key on Android (the X closes the window); older builds that still send one hide it.
   [open]:not(.pc-shop-dialog) lifts these above mobile-dialog-skin.css section 3 (display:flex!important). */
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-auto-flow:row dense;gap:8px;align-content:start}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>:not(.pc-shop-checkout,.pc-shop-total,.pc-shop-cancel){grid-column:1/-1}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>:is(.pc-shop-checkout,.pc-shop-total){position:sticky!important;bottom:0;box-shadow:0 8px 0 4px #15120e;left:auto;top:auto;z-index:1;box-sizing:border-box;width:auto!important;height:auto!important;min-height:52px;margin:0}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-total{grid-column:1;display:flex;align-items:center;padding:0 12px;border:1px solid #5d4a2f;border-radius:6px;background:#0f0d0b;color:#ffe2a2;font:600 18px "Microsoft JhengHei",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-total::before{content:"合計 ";margin-right:6px;color:#c8b58c;font-weight:normal;font-size:15px}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-checkout{grid-column:2;display:flex;align-items:center;justify-content:center;min-width:140px;padding:0 24px;border:1px solid #d0a95c;border-radius:6px;background:#6b5226!important;background-image:none!important;color:#fff4d6;font:600 18px "Microsoft JhengHei",sans-serif;cursor:pointer}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-checkout::before{content:attr(aria-label)}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-checkout::after{content:none}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-checkout:disabled{opacity:.45;cursor:default}
.game.android-layout #dialog.mw-ml-shop-dialog[open]:not(.pc-shop-dialog) #dialogbody>.pc-shop-cancel{display:none!important}

/* Prompts sit above #dialog (shop/warehouse lists stay open underneath). */
.mw-shade:has(+.mw-ml-prompt){z-index:95}
.mw-window.mw-ml-prompt{z-index:96}
.mw-ml-prompt .mw-body{display:flex;flex-direction:column;gap:8px}
.mw-ml-prompt-label{margin:0;font-size:17px;color:#ffe2a2}
.mw-ml-prompt-error{margin:0;color:#f3c0b5}
.mw-ml-prompt-error[hidden]{display:none}
.mw-ml-text-form{display:flex;margin:0}
.mw-ml-text-input{flex:1;min-width:0}
.mw-ml-pad{gap:14px;height:100%;min-height:0}
.mw-ml-pad-side{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0}
.mw-ml-pad-side .mw-ml-prompt-label{font-size:16px;max-height:66px;overflow:hidden}
.mw-ml-pad-display{display:flex;align-items:center;justify-content:flex-end;min-height:56px;padding:0 14px;border:1px solid #d0a95c;border-radius:6px;background:#000;color:#fff;font:600 30px "Microsoft JhengHei",sans-serif;font-variant-numeric:tabular-nums;overflow:hidden}
.mw-ml-pad-display.mw-ml-pad-empty{color:#8d7f66;font-size:20px}
.mw-ml-pad-range{margin:0}
.mw-ml-pad-max{margin-top:auto}
.mw-ml-pad-keys{flex:0 0 276px;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:6px}
.mw-ml-pad-key{min-height:52px;padding:0;font-size:24px}
.mw-ml-pad-key.mw-ml-pad-fn{font-size:18px;color:#ead5ac}