/* Dedicated bitmap components; labels and hit areas remain native-resolution DOM. */
.content-release #modal:has(.rpg-bag-window){width:min(880px,96cqw);height:min(638px,94cqh);max-height:94cqh;padding:18px 22px 14px;border:12px solid transparent;border-image:var(--rpg-window-frame-v1,url('/public/assets/rpg-window-frame-v1.webp')) 30 fill / 12px / 0 stretch;background:#171817!important;box-shadow:0 18px 70px #000a;display:flex;flex-direction:column;overflow:hidden}
#modal:has(.rpg-bag-window)>header{flex:none;padding:0 0 12px;margin:0 0 14px;border-bottom:1px solid #99845b55;min-height:38px}
#modal:has(.rpg-bag-window) #modal-kicker:empty{display:none}
#modal:has(.rpg-bag-window) #modal-title{font-size:21px;letter-spacing:.04em;line-height:1.3;color:#f1e6d0}
#modal:has(.rpg-bag-window) #modal-body{padding:0;min-height:0;flex:1;overflow:hidden}
#content-root:has(.rpg-bag-window){height:100%;display:flex;flex-direction:column;font:13px/1.5 system-ui,-apple-system,'Noto Sans KR',sans-serif;color:#e8e5dc;text-shadow:none}
.rpg-bag-window{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,1fr);gap:22px;min-height:0;flex:1}
.inv-workspace{min-width:0;min-height:0;display:flex;flex-direction:column}
#modal-body .rpg-bag-window button{font:inherit;text-shadow:none;letter-spacing:0;min-width:0;margin:0;cursor:pointer;color:#e8e1d2;touch-action:pan-y}
#modal-body .rpg-bag-window button:focus-visible{outline:2px solid #f1d899;outline-offset:2px}
#modal-body .rpg-bag-window button{background-image:none;min-height:0;padding:0}
#modal-body .rpg-bag-window .inv-slot{padding:7px;border:1px solid transparent;border-radius:3px;min-height:0}
#modal-body .rpg-bag-window .inv-button{background:#34342b!important;padding:9px 16px;border:1px solid #8b7854;min-height:36px}
#modal-body .rpg-bag-window .inv-categories button{background:transparent!important;padding:8px 3px;min-height:36px;border:0;border-bottom:2px solid transparent}
#modal-body .rpg-bag-window .inv-categories button[aria-pressed=true]{border-bottom-color:#cfb474}
.content-release #content-root .inv-item-heading{display:flex;justify-content:flex-start;padding-bottom:14px;text-align:left}
#modal-body .rpg-bag-window .inv-slot{display:block;line-height:0}
.inv-slot .content-item-image{position:absolute;inset:12%;width:76%;height:76%;max-height:76%;object-fit:contain;display:block;pointer-events:none;margin:0}
.inv-categories{display:flex;gap:0;border-bottom:1px solid #675b46;margin-bottom:14px}
#modal-body .inv-categories button{flex:1;border:0;border-bottom:2px solid transparent;background:transparent;padding:10px 3px;min-height:42px;color:#a8a89e}
#modal-body .inv-categories button[aria-pressed=true]{color:#f4deb0;border-bottom-color:#cfb474;background:#b19a6512}
.inv-toolbar{display:flex;gap:10px;margin-bottom:14px}
.inv-toolbar input,.inv-toolbar select,.inv-ring-choice select{font:inherit;min-width:0;background:#101312;border:1px solid #655e4e;border-radius:3px;color:#ddd8c9;min-height:36px;padding:7px 9px;touch-action:pan-y}
.inv-toolbar input{width:100%;flex:1}.inv-toolbar select{width:100px}
.inv-grid-scroll{flex:1;min-height:0;min-width:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;padding:3px}
.inv-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;align-content:start}
#modal-body .inv-slot,.inv-slot-empty{position:relative;aspect-ratio:1;min-height:0;width:100%;padding:7px;overflow:hidden;border:1px solid transparent;border-radius:3px;background: var(--rpg-item-slot-v1,url('/public/assets/rpg-item-slot-v1.webp')) center/100% 100% no-repeat!important;box-shadow:0 2px 3px #0005}
#modal-body .inv-slot:hover{filter:brightness(1.15)}
#modal-body .inv-slot[aria-pressed=true]{outline:2px solid #e0c58a;outline-offset:0;box-shadow:inset 0 0 14px #dfbd6338}
.inv-slot-empty{opacity:.55}
.inv-slot.is-legendary{border-color:#c2923b!important;box-shadow:inset 0 0 8px #c2923b38,0 2px 3px #0005!important}
.inv-legendary-grade{color:#efc668;margin-right:8px;font-weight:600}
.inv-relic-effect{padding:0 0 14px;margin-bottom:14px;border-bottom:1px solid #a98b4840}
.inv-relic-effect h4{color:#e6bd6e;margin:0 0 7px}
.inv-relic-effect p{margin:0;color:#e0d6bb;line-height:1.65;overflow-wrap:anywhere}
.inv-categories,.inv-toolbar,.inv-pages{flex-shrink:0}
.inv-grid-scroll,.inv-detail,#content-root[data-screen=equipment] .inv-workspace{overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#9a8054 #141715;color-scheme:dark}
.rpg-bag-window ::-webkit-scrollbar{width:8px;height:0}
.rpg-bag-window ::-webkit-scrollbar-track{background:#141715;border:1px solid #514633;border-radius:4px}
.rpg-bag-window ::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#665334,#b59b68,#79613e);border:2px solid #171b17;border-radius:4px;min-height:32px}
.rpg-bag-window ::-webkit-scrollbar-thumb:hover{background:#ceb07a}
.rpg-bag-window ::-webkit-scrollbar-button{display:none;width:0;height:0}
.rpg-bag-window ::-webkit-scrollbar-corner{background:transparent}
.inv-slot small{position:absolute;line-height:1;font-size:11px;font-weight:700;text-shadow:0 1px 2px #000,1px 0 2px #000;pointer-events:none}
.inv-equipped-mark{top:4px;left:5px;color:#a4d6bf}.inv-upgrade{top:4px;right:4px;color:#efd08c}.inv-stack{right:5px;bottom:5px;color:#fff}
.inv-pages{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:12px;font-size:12px;color:#bbb5a7}
#modal-body .inv-button{border:1px solid #8b7854;border-radius:3px;background:#34342b;padding:9px 16px;min-height:40px;line-height:1.35}
#modal-body .inv-button:hover:not(:disabled){background:#4d4936}
#modal-body .inv-button:disabled{opacity:.42;cursor:default}
#modal-body .inv-pages .inv-button{min-height:32px;padding:4px 14px;font-size:20px}
.inv-detail{min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden;background:#0c100fba;border:1px solid #81725455;padding:18px}
.inv-detail>.inv-item-heading,.inv-detail>.inv-item-actions{flex-shrink:0}
.inv-detail>.inv-item-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;touch-action:pan-y;padding-right:16px;scroll-padding-block:8px}
#content-root .inv-item-heading{display:flex;align-items:center;gap:14px;padding:0 0 16px;border-bottom:1px solid #86765044;margin:0}
.inv-item-large{width:62px;height:62px;flex:none;display:grid;place-items:center;background:var(--rpg-item-slot-v1,url('/public/assets/rpg-item-slot-v1.webp')) center/100% 100%}
.inv-item-large img{width:44px;height:44px;object-fit:contain}.inv-item-heading small{font-size:11px;color:#b4b4a7}
.inv-item-heading h3{font-size:17px;line-height:1.5;margin:3px 0 5px;font-weight:650;color:#f1dfb9;word-break:keep-all}.inv-item-heading em{font-style:normal;color:#eacc85}.inv-item-heading span{font-size:11px;color:#b0baac}
.inv-requirement{display:flex;justify-content:space-between;font-size:12px;color:#c3c7b9;margin:16px 0}.inv-requirement.is-low{color:#ee9d8a}
.inv-stat-list{margin:12px 0}.inv-stat-list>div{display:flex;justify-content:space-between;gap:14px;padding:5px 0;font-size:12px}.inv-stat-list dt{color:#b8beb4}.inv-stat-list dd{margin:0;font-variant-numeric:tabular-nums;color:#eae6d8;white-space:nowrap}
.inv-item-body h4{font-size:12px;color:#d5c295;border-top:1px solid #86765044;padding-top:16px;margin:18px 0 8px;font-weight:600}
.inv-options dd,.inv-stat-list dd.inv-positive{color:#8fd8b1}.inv-stat-list dd.inv-negative{color:#ee9e92}
.inv-compare-current{font-size:11px;line-height:1.5;color:#989f93;display:block}.inv-ring-choice{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;margin-top:14px}
#content-root .inv-item-actions{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 0;margin-top:12px;border-top:1px solid #86765044}.inv-item-actions>button{flex:1}.inv-item-actions>span{font-size:11px;color:#a4ab9f}.inv-use-description{font-size:14px;padding:12px 0}
.inv-detail-empty{height:100%;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#a9aa9c;gap:10px;font-size:12px}.inv-detail-empty span{color:#d1c39f;font-size:15px}.inv-detail-empty p{margin:0}
#content-root .inv-footer{flex:none;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #86765055;padding:12px 0 0;margin-top:16px;color:#a7ac9d;font-size:11px}.inv-gold{display:flex;align-items:center;gap:10px}.inv-gold b{font-size:15px;color:#ede2c5;font-variant-numeric:tabular-nums;font-weight:550}.inv-gold em{color:#d4b474;font-style:normal}
.equipment-identity{display:flex;justify-content:space-between;align-items:center;padding:0 4px 12px;color:#eee0c2}.equipment-identity strong{font-size:15px;font-weight:550}.equipment-identity span{font-size:12px;color:#b6b49c}
/* The first equipment mount supplies cached art; CSS must not race its fetch. */
.equipment-stage{position:relative;flex:1;min-height:280px;background:var(--equipment-stage-v1,none) center 75%/cover no-repeat;border:1px solid #8c77513d;isolation:isolate}
.equipment-stage canvas{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);width:58%;height:78%;object-fit:contain;pointer-events:none;image-rendering:pixelated}
.equipment-position{position:absolute;width:54px;text-align:center}.equipment-position>span{display:block;font-size:11px;line-height:1.6;color:#c5c3b3;margin-bottom:3px}.equipment-position-0,.equipment-position-1,.equipment-position-2,.equipment-position-3{left:16px}.equipment-position-4,.equipment-position-5,.equipment-position-6,.equipment-position-7{right:16px}.equipment-position-0,.equipment-position-4{top:8px}.equipment-position-1,.equipment-position-5{top:calc(25% + 3px)}.equipment-position-2,.equipment-position-6{top:calc(50% - 2px)}.equipment-position-3,.equipment-position-7{top:calc(75% - 7px)}.equipment-empty{color:#625e4f;font-size:22px}
.equipment-bottom{padding-top:12px;text-align:center}
.equipment-position-8{left:50%;top:8px;transform:translateX(-50%)}
.equipment-stage canvas{bottom:6%}
@container game-viewport (max-height:540px){
 .content-release #modal:has(.rpg-bag-window){height:96cqh;max-height:96cqh;padding:9px 12px 8px;border-width:8px;border-image-width:8px}
 #modal:has(.rpg-bag-window)>header{padding-bottom:5px;margin-bottom:7px;min-height:28px}#modal:has(.rpg-bag-window) #modal-title{font-size:17px}
 .rpg-bag-window{gap:14px;grid-template-columns:minmax(0,1.35fr) minmax(210px,1fr)}.inv-categories{margin-bottom:7px}#modal-body .inv-categories button{padding:5px 3px;min-height:32px;font-size:12px}.inv-toolbar{margin-bottom:7px;gap:6px}.inv-toolbar input,.inv-toolbar select{min-height:30px;padding:4px 7px;font-size:12px}.inv-grid{gap:5px}.inv-detail{padding:12px}.inv-item-heading h3{font-size:15px}.inv-item-large{width:48px;height:48px}.inv-item-large img{width:36px;height:36px}#content-root .inv-item-heading{gap:10px;padding-bottom:10px}.inv-pages{margin-top:5px}#modal-body .inv-pages .inv-button{min-height:26px;padding:1px 12px}#content-root .inv-footer{margin-top:8px;padding-top:7px}.inv-gold b{font-size:13px}.equipment-stage{min-height:0}.equipment-identity{padding-bottom:5px}.equipment-identity strong{font-size:12px}.equipment-position{width:37px}.equipment-position>span{font-size:10px;margin-bottom:1px}.equipment-position-0,.equipment-position-1,.equipment-position-2,.equipment-position-3{left:10px}.equipment-position-4,.equipment-position-5,.equipment-position-6,.equipment-position-7{right:10px}.equipment-position-0,.equipment-position-4{top:0}.equipment-position-1,.equipment-position-5{top:25%}.equipment-position-2,.equipment-position-6{top:50%}.equipment-position-3,.equipment-position-7{top:75%}.equipment-bottom{padding-top:5px}#modal-body .equipment-bottom button{min-height:28px;padding:4px 12px;font-size:12px}
}
@container game-viewport (max-width:650px){.content-release #modal:has(.rpg-bag-window){width:98cqw;padding-inline:8px}.rpg-bag-window{gap:10px;grid-template-columns:minmax(0,1.25fr) minmax(190px,1fr)}.inv-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.inv-detail{padding:10px}.inv-gold>span{display:none}.inv-item-heading h3{font-size:14px}.inv-item-large{width:40px;height:40px}.inv-item-large img{width:32px;height:32px}.inv-toolbar select{width:84px}.equipment-position{width:34px}.equipment-position>span{font-size:9px}}
@container game-viewport (max-height:540px){
 #content-root[data-screen=equipment] .inv-workspace{overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain}
 .equipment-stage{min-height:192px;flex-shrink:0}.equipment-position{width:42px}
 .equipment-position>span{position:absolute;top:50%;left:calc(100% + 6px);transform:translateY(-50%);margin:0;white-space:nowrap;font-size:10px}
 .equipment-position-4>span,.equipment-position-5>span,.equipment-position-6>span,.equipment-position-7>span{left:auto;right:calc(100% + 6px)}
 .equipment-position-8{top:2px}.equipment-position-8>span{left:auto;right:calc(100% + 6px)}
 #modal-body .rpg-bag-window .equipment-bottom .inv-button{padding:5px 12px;min-height:30px}
 #modal-body .rpg-bag-window .inv-categories button{padding:5px 3px;min-height:32px}
 #modal-body .rpg-bag-window .inv-pages .inv-button{min-height:26px;padding:1px 12px}
}
