/* Service screens use the viewport as a workspace, with independent scrolling. */
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game body #inventory-dialog:is(.shopping,.crafting-open)[open] {display:flex;flex-direction:column;inset:0;margin:auto;width:calc(100vw - var(--mobile-left) - var(--mobile-right));height:calc(100dvh - var(--mobile-top) - var(--mobile-bottom));max-height:none;padding:10px 12px;overflow:hidden;background:#101c27}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.bag-header {position:static;flex:0 0 auto;min-height:44px;padding:0 0 6px;background:none}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.bag-header h2 {font:20px Georgia;color:#eddbb9}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>#gear-message {display:none}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.mobile-panel-tabs {position:static;flex:0 0 auto;padding:4px 0 8px;gap:8px}
 .touch-game #inventory-dialog.crafting-open>.mobile-panel-tabs {display:none}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.merchant-layout {display:flex;flex:1;min-height:0;min-width:0;margin:0;gap:12px}
 .touch-game #inventory-dialog.shopping .shop-panel {display:grid;grid-template-columns:minmax(220px,1fr) minmax(250px,1fr);grid-template-rows:minmax(0,1fr) auto;gap:8px 16px;flex:1;min-height:0;padding:0;border:0;background:none;overflow:hidden}
 .touch-game #inventory-dialog.shopping:not([data-mobile-page=shop]) .shop-panel {display:none}
 .touch-game .commerce-shelf {display:flex;flex-direction:column;min-height:0;min-width:0;gap:8px}
 .touch-game .commerce-stock-heading {flex-shrink:0}
 .touch-game .commerce-stock-heading .shop-tabs {margin:0;padding:0;display:flex;gap:8px;border:0}
 .touch-game .commerce-stock-heading .shop-tabs button {flex:1;min-width:0;padding:6px;font-size:14px}
 .touch-game .commerce-stock-heading .shop-wallet {margin:6px 0 0;font-size:13px;color:#d7c390;line-height:1.3}
 .touch-game .commerce-stock-scroll {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:3px}
 .touch-game .commerce-stock-scroll #shop-items {padding:0;border:0;background:none;grid-template-columns:repeat(auto-fill,64px)!important;gap:8px!important}
 .touch-game .commerce-shelf .shop-pages {flex-shrink:0;margin:0;display:flex;gap:6px;overflow-x:auto}
 .touch-game .commerce-shelf .shop-pages button {min-width:44px;min-height:44px;margin:0}
 .touch-game #inventory-dialog.shopping #shop-detail {display:flex;flex-direction:column;min-width:0;min-height:0;max-height:none;padding:0 0 0 14px;margin:0;border:0;border-left:1px solid #40505c;background:none;overflow:hidden}
 .touch-game .commerce-detail-scroll {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:4px 4px 8px}
 .touch-game .commerce-item-heading {display:flex;align-items:center;gap:12px;margin-bottom:12px}
 .touch-game .commerce-item-heading h3 {font:18px Georgia;color:#efdab3;line-height:1.3}
 .touch-game .commerce-item-heading .item-icon {flex-shrink:0}
 .touch-game #shop-detail .item-description-stats {font-size:15px;line-height:1.55}
 .touch-game #shop-detail .item-skill-card p,.touch-game #shop-detail .item-skill-card small {font-size:14px;line-height:1.45}
 .touch-game .commerce-purchase {display:flex;flex:0 0 auto;gap:8px;border-top:1px solid #40505c;padding-top:8px}
 .touch-game .commerce-purchase button {min-height:48px;flex:1;font-size:15px;padding:8px}
 .touch-game .commerce-purchase button:last-child {background:#294d50;border-color:#bda46e}
 .touch-game #inventory-dialog.shopping .shop-notice {grid-column:1/-1;margin:0;font-size:13px;min-height:0}
 .touch-game #inventory-dialog.shopping .shop-notice:empty {display:none}
 .touch-game #inventory-dialog.shopping #shop-detail.commerce-empty {justify-content:center;text-align:center;color:#b8c6ca;padding:20px}
 .touch-game .commerce-empty-icon {font-size:44px;color:#bba675}
 .touch-game #inventory-dialog.crafting-open .armory-layout {display:grid!important;grid-template-columns:minmax(270px,.95fr) minmax(240px,1.05fr)!important;flex:1;min-height:0;gap:16px;margin:0;overflow:hidden}
 .touch-game #inventory-dialog.crafting-open .armory-character {display:none!important}
 .touch-game #inventory-dialog.crafting-open .armory-bag {display:flex!important;flex-direction:column;min-width:0;min-height:0;overflow:hidden;gap:8px;padding:0}
 .touch-game #inventory-dialog.crafting-open #soul-panel {display:flex!important;flex-direction:column;min-width:0;min-height:0;max-width:none;width:auto;padding:0 14px 0 0;border:0;border-right:1px solid #40505c;background:none;box-shadow:none;overflow:hidden;text-align:left;gap:8px}
 .touch-game .commerce-recipe-scroll {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:2px 3px}
 .touch-game .commerce-core-label {display:block;font-size:13px;color:#cab994}
 .touch-game .commerce-core-label #soul-select {margin-top:5px;min-height:44px;font-size:14px;width:100%}
 .touch-game #soul-panel .soul-circle {display:flex;align-items:center;justify-content:center;gap:16px;margin:12px 0;padding:0;max-width:none;width:100%;background:none}
 .touch-game #soul-panel .soul-core {flex:0 0 64px;width:64px;height:64px;margin:0;box-shadow:none;padding:0}
 .touch-game #soul-panel .soul-core img {width:60px;height:60px}
 .touch-game #soul-panel .soul-slots {display:flex;margin:0;gap:12px}
 .touch-game #soul-panel .soul-slot {width:64px;height:64px;min-height:64px;padding:0;flex-shrink:0}
 .touch-game #soul-panel .soul-slot[hidden] {display:none!important}
 .touch-game #soul-panel .soul-preview {padding:10px;margin:0;background:#152634;border:1px solid #3e5566;font-size:14px;min-height:0}
 .touch-game #soul-panel .soul-preview p {font-size:14px;line-height:1.4;margin:6px 0}
 .touch-game .commerce-services {margin-top:10px}
 .touch-game .commerce-services summary {font-size:14px;min-height:44px;padding:10px 0}
 .touch-game .commerce-services .soul-services {border:0;padding:0}
 .touch-game .commerce-services h3 {display:none}
 .touch-game .commerce-craft-footer {flex:0 0 auto;border-top:1px solid #40505c;padding-top:6px}
 .touch-game .commerce-craft-status {font-size:13px;line-height:1.3;margin:0 0 6px;max-height:38px;overflow:auto;color:#d9c69b}
 .touch-game #soul-panel .soul-craft-button {position:static;min-height:48px;margin:0;font-size:14px;letter-spacing:.5px;background:#294d50}
 .touch-game .crafting-open .armory-bag .bag-toolbar {margin:0;padding:0;gap:4px;font-size:13px;flex-shrink:0}
 .touch-game .crafting-open .bag-toolbar label {display:none}
 .touch-game .crafting-open .armory-bag>.inventory-tabs:not(.craft-source-tabs) {display:none}
 .touch-game .crafting-open .craft-source-tabs {display:flex;flex-shrink:0;margin:0;padding:0 0 6px;gap:6px}
 .touch-game .crafting-open .craft-source-tabs button {flex:1;font-size:14px;padding:6px}
 .touch-game #inventory-dialog.crafting-open .bag-body {display:block;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:3px}
 .touch-game .crafting-open #inventory-items {padding:0!important;border:0;background:none}
 .touch-game .crafting-open #inventory-items .chosen {outline:2px solid #e1c37d;outline-offset:1px}
 .touch-game #inventory-dialog.shopping:not([data-mobile-page=shop]) .armory-layout {display:block!important;flex:1;min-height:0;overflow:auto;margin:0}
 .touch-game #inventory-dialog.shopping:not([data-mobile-page=shop]) .armory-character {display:none!important}
}
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game #inventory-dialog.crafting-open .armory-layout {align-items:stretch!important;grid-template-rows:minmax(0,1fr)}
 .touch-game #inventory-dialog.crafting-open #soul-panel,.touch-game #inventory-dialog.crafting-open .armory-bag {align-self:stretch;height:100%;max-height:100%;margin:0}
 .touch-game #inventory-dialog.shopping .shop-panel {align-items:stretch}
 .touch-game #inventory-dialog.shopping #shop-detail,.touch-game .commerce-shelf {align-self:stretch;height:100%;max-height:100%;box-sizing:border-box}
}
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.merchant-layout {align-items:stretch;overflow:hidden}
 .touch-game #inventory-dialog.shopping .shop-panel {height:100%;max-height:100%;align-self:stretch}
 .touch-game #inventory-dialog.shopping #shop-detail {align-items:stretch;gap:0}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open) .commerce-craft-status {font-size:13px;line-height:1.3}
}
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game #inventory-dialog.shopping>.mobile-panel-tabs {position:absolute;top:10px;right:92px;width:176px;padding:0;z-index:3;background:none}
 .touch-game #inventory-dialog.shopping>.bag-header h2 {max-width:calc(100% - 270px);font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .touch-game #soul-panel .soul-circle {margin:8px 0}
 .touch-game .commerce-core-label #soul-select {margin-top:0}
}
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game #inventory-dialog.shopping>.bag-header h2 {max-width:calc(100vw - 340px)}
}
/* No title/header row on mobile service screens. Utilities live in the right pane. */
@media (pointer:coarse) and (hover:none) and (orientation:landscape) {
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.bag-header {display:contents}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.bag-header>div {display:none}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open) #close-inventory {position:absolute;top:10px;right:12px;z-index:5;width:44px;height:44px;min-height:44px;padding:0;font-size:0}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open) #close-inventory::after {content:'×';font:26px system-ui}
 .touch-game #inventory-dialog.shopping>.mobile-panel-tabs {top:10px;right:64px;width:160px}
 .touch-game #inventory-dialog.shopping #shop-detail {padding-top:52px}
 .touch-game #inventory-dialog.shopping:not([data-mobile-page=shop]) .armory-layout {padding-top:52px}
 .touch-game #inventory-dialog.crafting-open .bag-toolbar {padding-right:52px;min-height:44px;align-items:center}
}
/* Inventory uses the same compact close control as the service screens. */
@media (pointer:coarse) and (hover:none) {
 .touch-game body #inventory-dialog>.bag-header {display:contents}
 .touch-game body #inventory-dialog>.bag-header>div {display:none}
 .touch-game body #inventory-dialog #close-inventory {position:absolute;top:10px;right:12px;z-index:5;width:44px;height:44px;min-height:44px;padding:0;font-size:0}
 .touch-game body #inventory-dialog #close-inventory::after {content:'×';font:26px system-ui}
 .touch-game body #inventory-dialog:not(.shopping):not(.crafting-open)>.mobile-panel-tabs {position:sticky;top:0;padding:0 54px 8px 0;min-height:52px;margin:0;background:#101d28}
}
@media (pointer:coarse) and (hover:none) and (min-width:901px) {
 .touch-game body #inventory-dialog:not(.shopping):not(.crafting-open) .bag-toolbar {padding-right:52px;min-height:44px}
}
@media (pointer:coarse) and (hover:none) {
 .touch-game .mobile-stats-button {position:absolute;top:10px;right:64px;z-index:5;min-width:72px;min-height:44px;padding:8px;font-size:14px}
 .touch-game #inventory-dialog:is(.shopping,.crafting-open)>.mobile-stats-button {display:none}
 .touch-game body #inventory-dialog:not(.shopping):not(.crafting-open)>.mobile-panel-tabs {padding-right:142px}
 .touch-game #mobile-stats {background:#10212e;color:#e4e3d8;border:1px solid #b39a6d}
 .touch-game #mobile-stats #character-stats {margin:12px 0;padding:14px;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
 .touch-game #mobile-stats #character-stats small {font-size:14px;line-height:1.4}
 .touch-game #mobile-stats #character-stats b {font-size:20px}
 .touch-game #mobile-stats .attribute-allocation {grid-column:1/-1}
}
@media (pointer:coarse) and (hover:none) and (min-width:901px) {
 .touch-game body #inventory-dialog:not(.shopping):not(.crafting-open) .bag-toolbar {padding-right:142px}
}

/* Drag cards directly with a finger; gaps and panel backgrounds remain scrollable. */
.touch-game :is(#inventory-items [data-id],#inventory-items [data-soul],#equipment-slots [data-slot],.bank-columns [data-id],.bank-columns [data-soul],#shop-items [data-shop-id]) {
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}