/* Phone-only layouts. Classic desktop panels keep their existing source skin. */
.desktop-client.touch-client #window-bag .native-board.inventory-extended { width: 369px; height: 500px; }
.desktop-client.touch-client #window-bag .inventory-continuous-frame {
 top: 0; height: 500px;
 background: url('/assets/ui/native-frame/inventory-closed.png') left top / 369px 500px no-repeat;
}
.desktop-client.touch-client #window-skills .skills-extended { height: 437px; }
.desktop-client.touch-client #window-skills .inventory-continuous-frame {
 top: -14px; height: 451px;
 background: url('/assets/ui/mobile-panel/skills-complete.png') left top / 393px 451px no-repeat;
}
.desktop-client.touch-client :is(#window-bag, #window-skills) .inventory-continuous-frame > i,
.desktop-client.touch-client :is(#window-bag, #window-skills) .inventory-continuous-frame::before,
.desktop-client.touch-client :is(#window-bag, #window-skills) .inventory-continuous-frame::after { display: none !important; }
.desktop-client.touch-client #window-bag .inventory-stats-paper {
 left: 61px; top: 101px; width: 67px; height: 190px; box-sizing: border-box;
 border: 0; border-image: none; border-radius: 0;
 background: url('/assets/ui/panel-repair/inventory-stats-paper.png') left top / 100% 100% no-repeat;
}
.desktop-client.touch-client #window-bag .inv-label { left: 64px; width: 26px; color: #382514; font-size: 11px; background: none; text-shadow: none; }
.desktop-client.touch-client #window-bag .inv-stat { left: 92px; width: 32px; font-size: 11px; font-weight: 600; color: #382514; text-shadow: none; }
.desktop-client.touch-client #window-bag .native-inventory-title { left: 146px; top: 14px; width: 190px; font-size: 12px; }
.desktop-client.touch-client #window-bag .native-bag {
 left: 69px; top: 326px; width: 264px; height: 132px;
 display: grid; grid-template-columns: repeat(8, 33px); grid-template-rows: none; grid-auto-rows: 33px;
 gap: 0; padding: 0; background: none; scrollbar-gutter: auto; scrollbar-width: none;
 touch-action: pan-y; overflow-y: auto; overscroll-behavior: contain;
 scroll-snap-type: y mandatory;
}
.desktop-client.touch-client #window-bag .native-bag::-webkit-scrollbar { display: none; }
.desktop-client.touch-client #window-bag .native-bag .inventory-cell {
 width: 33px; height: 33px; min-height: 33px; padding: 0;
 border: 0; border-radius: 0; background: none;
 display: grid; place-items: center; opacity: 1; scroll-snap-align: start;
}
.desktop-client.touch-client #window-bag .inventory-extended .native-context-toolbar { left: 69px; top: 463px; width: 264px; height: 23px; }
.desktop-client.touch-client #window-bag .gear-slot[data-gear="knee2"] { background: transparent !important; }
.desktop-client.touch-client #window-bag .gear-slot[data-gear="charm"] { background: transparent !important; }
.desktop-client.touch-client #window-bag .gear-slot[data-gear="charm"]::before {
 content: ''; position: absolute; left: -3px; top: -3px; width: 37px; height: 37px; z-index: -1;
 background: url('/assets/ui/native-frame/inventory-closed.png') -295px -200px no-repeat;
}
.desktop-client.touch-client #window-bag .gear-slot { z-index: 2; }
/* 2026-11-10 光環（項鍊左邊）、以太（左耳環左邊）：原圖沒有格子，複製項鍊格（內框 177,35）、左耳環格（內框 177,74），外框各多 3px */
.desktop-client.touch-client #window-bag .gear-slot:is([data-gear="halo"], [data-gear="ether"]) { background: transparent !important; }
.desktop-client.touch-client #window-bag .gear-slot:is([data-gear="halo"], [data-gear="ether"])::before {
 content: ''; position: absolute; left: -3px; top: -3px; width: 37px; height: 37px; z-index: -1;
 background: url('/assets/ui/native-frame/inventory-closed.png') -174px -32px no-repeat;
}
.desktop-client.touch-client #window-bag .gear-slot[data-gear="ether"]::before { background-position: -174px -71px; }
.desktop-client.touch-client #window-bag.single-native-window .window-header [data-close] {
 left: calc(354px * var(--native-board-scale, 1) - 13px); right: auto;
 top: calc(23px * var(--native-board-scale, 1) - 13px); margin: 0;
}
.desktop-client.touch-client #window-skills .native-skills-title { left: 133px; top: 30px; width: 214px; text-align: center; }
.desktop-client.touch-client #window-skills .native-skill-tabs { left: 133px; top: 60px; width: 214px; justify-content: center; }
.desktop-client.touch-client #window-skills .native-skill-list > button { gap: 35px; }
.desktop-client.touch-client #window-skills .native-skill-copy { transform: translateY(-2px); }
/* The information paper uses one intact wood binding, with a real inner scroller. */
.desktop-client.touch-client .single-native-window .native-item-popover {
 width: min(246px, calc(100vw - 24px)); height: min(236px, calc(100dvh - 24px));
 padding: 10px 29px 12px 12px; box-sizing: border-box;
 border: 5px solid transparent; border-image: url('/assets/ui/native-detail-frame.png') 5 / 5px / 0 stretch;
 border-radius: 0; background: #eed8ae url('/assets/ui/mobile-panel/paper-texture.png') left top / 148px 46px repeat;
 overflow: hidden; color: #362517; font-size: 12px;
}
.desktop-client.touch-client .single-native-window .native-item-popover::before,
.desktop-client.touch-client .single-native-window .native-item-popover::after { display: none !important; }
.desktop-client.touch-client .native-item-popover .native-popover-header { flex: none; height: 26px; padding: 0; align-items: center; }
.desktop-client.touch-client .native-item-popover .item-detail { min-height: 0; flex: 1 1 0; overflow-y: auto; touch-action: pan-y; }
.desktop-client.touch-client .native-item-popover .native-paper-scroll { top: 72px; bottom: 42px; right: 9px; }
.desktop-client.touch-client .native-item-popover button[data-detail-scroll="-1"] { top: 42px; right: 4px; }
.desktop-client.touch-client .native-item-popover button[data-detail-scroll="1"] { bottom: 9px; right: 4px; }
/* Name and HP ink fit within the original native party sockets. */
.desktop-client.touch-client #window-party.combat-party .window-header { inset: 0; }
.desktop-client.touch-client #window-party.combat-party .window-header::before { display: none; }
.desktop-client.touch-client #window-party.combat-party .window-header [data-close] {
 left: 68px; top: 4px; width: 25px; height: 25px;
 border: 0; background: none; font: 600 17px/25px var(--font); color: #fff4db; text-shadow: 0 1px 2px #000;
}
.desktop-client.touch-client #window-party.combat-party .party-member {
 display: block; margin: 0; padding: 0;
 background: transparent !important; border: 0; box-shadow: none; height: 15px; min-height: 15px;
}
.desktop-client.touch-client #window-party.combat-party .party-member.selected { box-shadow: inset 0 0 0 1px #efd28a; }
.desktop-client.touch-client #window-party.combat-party .party-member b {
 position: absolute; inset: 0; z-index: 1; display: block; min-width: 0; width: 100%; margin: 0; padding: 0 3px;
 box-sizing: border-box; font: 600 9px/15px var(--font); color: #fff; text-align: center;
 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: 0;
 text-shadow: 0 1px 1px #000, 1px 0 1px #000, -1px 0 1px #000;
}
.desktop-client.touch-client #window-party.combat-party .mobile-party-roster .party-member {
 width: 52px; height: 15px; border-radius: 7px; overflow: hidden;
}
.desktop-client.touch-client #window-party.combat-party .mobile-party-roster .party-meter {
 position: absolute; display: block; left: 2px; right: 2px; top: 3px; bottom: auto;
 width: auto; height: 9px; margin: 0; border-radius: 5px; overflow: hidden; background: #161b18;
}
.desktop-client.touch-client #window-party.combat-party .party-manage-toggle { border-radius: 50%; }
.desktop-client.touch-client #window-party.combat-party .party-manage-toggle[aria-expanded="true"] { box-shadow: inset 0 0 0 1px #d9b575; transform: rotate(180deg); }
.desktop-client.touch-client #window-party.combat-party .party-management {
 width: 245px; padding: 9px 10px; border-image-repeat: stretch; background: #211b16f5 url('/assets/ui/native-detail-wood.png');
}
.desktop-client.touch-client #window-party .party-invite-list { padding-bottom: 7px; border-bottom: 1px solid #84704b; }
.desktop-client.touch-client #window-party .party-invite-list h3 { margin: 7px 0 5px; font: 600 12px var(--font-title); color: #f2deb5; }
.desktop-client.touch-client #window-party .party-invite-list .party-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 5px; }
.desktop-client.touch-client #window-party .party-invite-list .party-tools span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.desktop-client.touch-client #window-party .party-invite-list button { background: #50402c; border-radius: 4px; padding: 4px 8px; }

.desktop-client.touch-client .single-native-window .native-item-popover .item-detail { font-size: 12px; }
