/* Ekwipunek w rajdzie z kratkami (js/ui/RaidInventoryUI.js) + animacja otwierania plecaka (js/ui/BackpackOpenFx.js) */
#raidInventory.inv-overlay{z-index:120;background:#050706d9;backdrop-filter:blur(6px);padding:clamp(8px,2vw,24px);align-items:center;justify-content:center;overflow:hidden}
.inv-window{--cell:clamp(30px,min(3.7vw,6.1vh),54px);position:relative;z-index:2;display:flex;flex-direction:column;width:min(1260px,100%);max-height:100%;overflow:auto;
  background:linear-gradient(145deg,#171d1a,#0a0e0c 72%);border:1px solid #71816d;border-top:3px solid #b3944c;box-shadow:0 20px 80px #000d;color:#e3e5dd;padding:12px 14px;font-family:inherit}
.inv-head{display:flex;align-items:center;gap:16px;border-bottom:1px solid #ffffff20;padding-bottom:10px}
.inv-head small{color:#b9a267;letter-spacing:.18em;font-size:10px}
.inv-head h2{margin:3px 0 0;font-size:clamp(18px,2.4vw,28px);letter-spacing:.12em}
.inv-load{flex:1;max-width:420px;margin-left:auto;font-size:11px;letter-spacing:.06em}
.inv-load b{display:block;margin-bottom:4px}
.inv-bar{position:relative;height:8px;background:#0006;border:1px solid #ffffff30}
.inv-bar div{height:100%;background:#7fae64}.inv-load.heavy .inv-bar div{background:#d8b44a}.inv-load.overloaded .inv-bar div{background:#d5523e}
.inv-load.overloaded b{color:#ff8a6a}
.inv-bar i{position:absolute;top:-3px;bottom:-3px;width:1px;background:#ffffff70}
.inv-money{color:#d9c27c;font-size:12px;white-space:nowrap}
.inv-x{background:#252d28;color:#ddd;border:1px solid #ffffff36;font-size:18px;width:38px;height:38px;cursor:pointer}
.inv-body{display:grid;grid-template-columns:minmax(300px,36%) 1fr;gap:14px;padding:12px 0;min-height:0}
/* postać + sloty */
.inv-doll{display:grid;grid-template-columns:96px 1fr 96px;grid-template-rows:auto auto auto;gap:8px;align-content:start;background:#ffffff06;border:1px solid #ffffff14;padding:10px}
.inv-col{display:flex;flex-direction:column;gap:6px}
.inv-model{position:relative;min-height:260px;border:1px solid #ffffff12;background:radial-gradient(ellipse at 50% 70%,#2a3328,#0b0f0c 70%);overflow:hidden}
.inv-model .cp3-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;cursor:grab}
.inv-model .cp3-canvas{height:100%;max-width:100%;object-fit:contain;image-rendering:pixelated}
.inv-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:70px;padding:4px;border:1px solid #ffffff22;background:#0007;color:#d8dccf;font:inherit;font-size:10px;cursor:pointer;text-align:center}
.inv-slot small{position:absolute;top:2px;left:4px;color:#8e9686;font-size:8px;letter-spacing:.12em}
.inv-slot .ic{width:38px;height:38px;object-fit:contain;image-rendering:pixelated;margin-top:8px}
.inv-slot b{font-size:9px;font-weight:600;line-height:1.15;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.inv-slot em{font-style:normal;color:#d9c27c;font-size:9px}
.inv-slot.on{border-color:#6f7f62;background:#18201a}
.inv-slot.sel{outline:2px solid #e0bd74;outline-offset:-2px}
.inv-slot.hand{border-color:#7ee05a}
.inv-weapons{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr .7fr;gap:6px}
.inv-slot.wide{min-height:64px;flex-direction:row;justify-content:flex-start;gap:8px;padding:12px 8px 4px;text-align:left;flex-wrap:wrap}
.inv-slot.wide .ic{margin:0;width:44px;height:30px}
.inv-slot.wide b{flex:1;min-width:0}.inv-slot.wide em{flex-basis:100%}
.inv-nades{display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.inv-nades small{color:#8e9686;font-size:9px}
.inv-nade{position:relative;width:42px;height:42px;padding:2px;border:1px solid #ffffff22;background:#0007;cursor:pointer}
.inv-nade.on{border-color:#e0bd74}
.inv-nade .ic{width:100%;height:100%;object-fit:contain}
.inv-nade em{position:absolute;right:2px;bottom:0;font-style:normal;font-size:10px;color:#fff;text-shadow:0 1px 2px #000}
.inv-info{grid-column:1/-1;min-height:62px;padding:8px 10px;border:1px solid #ffffff14;background:#0005;font-size:12px}
.inv-info b{display:block;color:#f0e2b4}.inv-info small{display:block;color:#9da59b;margin-top:2px}
.inv-tip{margin:0;color:#8e9686;font-size:11px}
.inv-msg{margin:6px 0 0;color:#a8f080;font-size:11px}
.inv-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.inv-acts button,.inv-done{background:#313a32;color:#edf0e9;border:1px solid #809071;padding:6px 10px;font:inherit;font-size:11px;letter-spacing:.06em;cursor:pointer}
.inv-acts button:hover,.inv-done:hover{background:#596447}
/* siatki */
.inv-grids{display:flex;flex-direction:column;gap:10px;min-width:0}
.inv-sec h3{display:flex;align-items:baseline;gap:8px;margin:0 0 5px;color:#c7b577;font-size:11px;letter-spacing:.12em}
.inv-sec h3 small{color:#8e9686;font-size:10px}
.inv-none{padding:10px;border:1px dashed #ffffff22;color:#8e9686;font-size:11px}
.inv-grid{position:relative;width:calc(var(--gw)*var(--cell));height:calc(var(--gh)*var(--cell));
  background:repeating-linear-gradient(90deg,#ffffff14 0 1px,transparent 1px var(--cell)),repeating-linear-gradient(0deg,#ffffff14 0 1px,transparent 1px var(--cell)),#0a0d0b;
  border:1px solid #ffffff2a;box-shadow:inset 0 0 18px #000a}
.inv-item{position:absolute;box-sizing:border-box;padding:3px;border:1px solid #6c7466;background:linear-gradient(#2a312b,#1a1f1b);cursor:grab;touch-action:none;user-select:none}
.inv-item .ic{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none}
.inv-item em{position:absolute;right:3px;bottom:1px;font-style:normal;font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000;pointer-events:none}
.inv-item.ammo{border-color:#8a7a4a;background:linear-gradient(#2f2b1f,#1b1912)}
.inv-item:hover{border-color:#c9d6b8}
.inv-item.sel{outline:2px solid #e0bd74;outline-offset:-2px}
.inv-item.lifted{opacity:.3}
.inv-ghost{position:fixed;z-index:1000;pointer-events:none;opacity:.88;box-shadow:0 8px 20px #000c;cursor:grabbing}
.inv-mark{position:absolute;pointer-events:none;z-index:3}
.inv-mark.ok{background:#7ee05a33;border:1px solid #7ee05a}.inv-mark.bad{background:#e0503a33;border:1px solid #e0503a}
.inv-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #ffffff20;padding-top:10px;color:#9da59b;font-size:11px}
@media(max-width:900px){.inv-body{grid-template-columns:1fr}.inv-doll{grid-template-columns:84px 1fr 84px}.inv-model{min-height:200px}}
@media(max-height:620px){.inv-model{min-height:170px}.inv-slot{min-height:54px}}

/* ---- animacja: plecak zza pleców → zamek → okno ---- */
.bp-fx{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.bp-bag{position:absolute;left:50%;top:calc(50vh - min(760px,72vw,108vh)*.16);width:min(760px,72vw,108vh);aspect-ratio:400/520;transform-origin:50% 100%;animation:bpBag .82s cubic-bezier(.2,.8,.25,1) both}
.bp-bag svg{width:100%;height:100%;display:block;overflow:visible;filter:drop-shadow(0 18px 24px #000c)}
.bp-pull{animation:bpPull .24s .26s cubic-bezier(.5,0,.3,1) both}
.bp-mouth{transform-box:fill-box;transform-origin:0 70%;animation:bpMouth .26s .27s ease-out both}
.bp-lid{transform-box:fill-box;transform-origin:50% 100%;animation:bpLid .2s .44s ease-out both}
#raidInventory.bp-opening .inv-window{animation:invWinIn .3s .4s cubic-bezier(.2,.8,.3,1) both}
/* plecak wjeżdża od dołu, lekko z lewej, klapa ok. połowy ekranu; potem zjeżdża i znika pod oknem */
@keyframes bpBag{0%{transform:translate(-112%,72vh) rotate(-17deg);opacity:1}38%{transform:translate(-58%,0) rotate(-4deg)}62%{transform:translate(-57%,1vh) rotate(-3deg);opacity:1}100%{transform:translate(-55%,26vh) rotate(-1deg) scale(.96);opacity:0}}
/* suwak po łuku zamka (M84 140 Q200 64 316 140) – „szybki ruch” dłoni */
@keyframes bpPull{0%{transform:translate(0,0)}25%{transform:translate(58px,-28px)}50%{transform:translate(116px,-38px)}75%{transform:translate(174px,-28px)}100%{transform:translate(232px,0)}}
@keyframes bpMouth{0%{transform:scaleX(0) scaleY(.5)}70%{transform:scaleX(1) scaleY(1)}100%{transform:scaleX(1) scaleY(1.7)}}
@keyframes bpLid{to{transform:translateY(-30px) scaleY(.7)}}
@keyframes invWinIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.bp-fx{display:none}#raidInventory.bp-opening .inv-window{animation:none}}