/* Inventory 780 — responsive cards and loadout, layered after storefront 779. */
#shopframe#shopframe .sf-panel.mode-bag .sf-bag{grid-template-columns:190px minmax(0,1fr);gap:18px;min-width:0;min-height:0;overflow:hidden}
#shopframe#shopframe .sf-load{display:flex;min-width:0;gap:12px}
#shopframe#shopframe .sf-load-ship{min-height:160px;border:1px solid #365776;border-radius:16px;background:radial-gradient(ellipse at 50% 40%,#244765,#101e34 75%);padding:12px;overflow:hidden}
#shopframe#shopframe .sf-load-row{height:100px;gap:10px}
#shopframe#shopframe .sf-mini{min-width:0;min-height:80px;border:1px solid #304763;background:#132238;border-radius:12px;padding:8px}
#shopframe#shopframe .sf-inv{padding:16px;gap:12px;min-height:0;min-width:0;background:#101c30;border:1px solid #2c405d;border-radius:16px;overflow:hidden}
#shopframe#shopframe .sf-inv-head{gap:10px;min-height:44px;padding:0;display:flex;flex-wrap:wrap}
#shopframe#shopframe .sf-inv-title{font:800 16px/1.35 system-ui;letter-spacing:.02em;text-shadow:none}
#shopframe#shopframe .sf-inv-count{position:static;transform:none;font:700 13px/1.3 system-ui;margin-left:auto;color:#92bfe0}
#shopframe#shopframe .sf-inv-add{position:static!important;transform:none!important;width:44px;height:44px;flex:0 0 44px}
#shopframe#shopframe .sf-inv-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;min-width:0;padding:0 0 4px;scrollbar-width:thin}
#shopframe#shopframe .sf-inv-tab{flex:0 0 auto;min-height:44px;padding:8px 14px;font:700 12px/1.3 system-ui;letter-spacing:0;border:1px solid #354b69;border-radius:10px;background:#172942;box-shadow:none;white-space:nowrap}
#shopframe#shopframe .sf-inv-tab.on{background:#24526c;border-color:#60badc;color:#ddf9ff}
#shopframe#shopframe .sf-inv-scroll{min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:2px 4px 2px 2px;flex:1 1 auto}
#shopframe#shopframe .sf-inv-grid:not(.list){grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px;align-content:start}
#shopframe#shopframe .sf-inv-grid .sf-cell{display:flex;flex-direction:column;align-items:stretch;min-width:0;height:auto;min-height:166px;aspect-ratio:auto;padding:10px 8px 36px;background:linear-gradient(145deg,#1b304b,#132238);border:1px solid #35516c;border-radius:14px;box-shadow:none;transform:none;overflow:hidden;filter:none}
#shopframe#shopframe .sf-inv-grid .sf-cell::after{display:none}
#shopframe#shopframe .sf-inv-grid .sf-cell:hover,#shopframe#shopframe .sf-inv-grid .sf-cell.on{border-color:#77c9ee;background:linear-gradient(145deg,#23415e,#152a40);box-shadow:0 0 0 1px #77c9ee55}
#shopframe#shopframe .sf-inv-grid .sf-cell.equipped{border-color:#62dfa6;background:linear-gradient(145deg,#164637,#122d32);box-shadow:inset 0 0 0 1px #62dfa633}
#shopframe#shopframe .sf-inv-grid .sf-cell-art,#shopframe#shopframe .sf-inv-grid .sf-cell-art.sk-host{position:relative;inset:auto;display:block;flex:0 0 92px;height:92px;width:100%;min-height:0;--sk-base:.85}
#shopframe#shopframe .sf-inv-grid .sf-shiprnd-art{display:flex;align-items:center;justify-content:center}
#shopframe#shopframe .sf-inv-grid .sf-cell-n{display:block;position:relative;font:700 12px/1.4 system-ui;color:#ebf6ff;text-align:center;white-space:normal;overflow-wrap:anywhere;min-width:0;text-shadow:none}
#shopframe#shopframe .sf-inv-grid .sf-cell-tag{position:absolute;left:6px;right:6px;bottom:8px;top:auto;width:auto;max-width:none;transform:none;margin:0;padding:4px 5px;border-radius:7px;font:800 10px/1.3 system-ui;white-space:normal;text-align:center;overflow-wrap:anywhere}
#shopframe#shopframe .sf-inv-grid .sf-cell-chk{position:absolute;top:6px;right:6px;left:auto;width:22px;height:22px}
#shopframe#shopframe .sf-inv-grid .sf-cell-empty{display:none}
#shopframe#shopframe .sf-inv-foot{gap:8px;flex-wrap:wrap;border-top:1px solid #ffffff12;padding-top:10px}
#shopframe#shopframe .sf-inv-foot .sf-sortbtn,#shopframe#shopframe .sf-inv-foot .sf-icobtn{min-height:44px;min-width:44px;border:1px solid #354b69;border-radius:10px;background:#192c44;box-shadow:none;font:700 12px/1.3 system-ui}
#shopframe#shopframe .sf-inv-foot .sf-sort{margin-left:auto}
#shopframe#shopframe .sf-inv-grid.list{grid-template-columns:1fr;gap:8px}
#shopframe#shopframe .sf-inv-grid.list .sf-cell{min-height:90px;display:grid;grid-template-columns:68px minmax(0,1fr);gap:12px;padding:10px 32px 30px 10px;align-items:center}
#shopframe#shopframe .sf-inv-grid.list .sf-cell-art,#shopframe#shopframe .sf-inv-grid.list .sf-cell-art.sk-host{width:68px;height:60px;flex:none}
#shopframe#shopframe .sf-inv-grid.list .sf-cell-n{text-align:left}
#shopframe#shopframe .sf-inv-grid.list .sf-cell-tag{left:90px}
#shopframe#shopframe .sf-cell:focus-visible,#shopframe#shopframe .sf-inv-tab:focus-visible{outline:2px solid #a2e5ff;outline-offset:-3px}
@media(max-width:1050px){#shopframe#shopframe .sf-panel.mode-bag .sf-bag{grid-template-columns:150px minmax(0,1fr);gap:12px}#shopframe#shopframe .sf-inv{padding:12px}}
@media(max-width:700px){
#shopframe#shopframe .sf-panel.mode-bag .sf-bag{display:flex;flex-direction:column;gap:10px;overflow:hidden}
#shopframe#shopframe .sf-panel.mode-bag .sf-load{display:flex;flex-direction:row;flex:0 0 84px;max-height:84px;gap:8px}
#shopframe#shopframe .sf-panel.mode-bag .sf-load-ship{flex:1 1 50%;max-width:50%;min-height:0;padding:4px}
#shopframe#shopframe .sf-panel.mode-bag .sf-load-row{flex:1 1 50%;height:84px;gap:8px;min-width:0}
#shopframe#shopframe .sf-load-ring{display:none}
#shopframe#shopframe .sf-mini{min-height:0;padding:4px}
#shopframe#shopframe .sf-inv{flex:1 1 auto;padding:10px;gap:8px}
#shopframe#shopframe .sf-inv-grid:not(.list){grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#shopframe#shopframe .sf-inv-title{font-size:14px}
#shopframe#shopframe .sf-inv-grid .sf-cell{min-height:154px}
#shopframe#shopframe .sf-inv-grid .sf-cell-art,#shopframe#shopframe .sf-inv-grid .sf-cell-art.sk-host{height:80px;flex-basis:80px}
#shopframe#shopframe .sf-inv-foot .sf-sort{min-width:0;flex:1 1 90px}
#shopframe#shopframe .sf-inv-foot .sf-sort select{width:100%;min-width:0}
}
@media(max-height:540px){#shopframe#shopframe .sf-panel.mode-bag .sf-load{display:none}#shopframe#shopframe .sf-panel.mode-bag .sf-bag{grid-template-columns:minmax(0,1fr)}#shopframe#shopframe .sf-inv{gap:6px;padding:8px}#shopframe#shopframe .sf-inv-head{display:none}#shopframe#shopframe .sf-inv-foot{padding-top:4px}#shopframe#shopframe .sf-inv-grid:not(.list){grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}
/* Small phones: reserve actual scroll space instead of shrinking cards. */
@media(max-width:700px) and (max-height:700px){
#shopframe#shopframe .sf-panel.mode-bag .sf-load{display:none}
#shopframe#shopframe .sf-panel.mode-bag .sf-inv-head{display:none}
#shopframe#shopframe .sf-panel.mode-bag .sf-inv{gap:6px;padding:8px}
}
#shopframe#shopframe .sf-inv-tabs,#shopframe#shopframe .sf-inv-foot,#shopframe#shopframe .sf-inv-head{flex-shrink:0}
#shopframe#shopframe .sf-inv-foot .sf-sort{flex:1 1 80px;min-width:0}
#shopframe#shopframe .sf-inv-foot .sf-sort select{width:100%;min-width:0}