/* ═══════════ Effekter: level-up, vinst, rån (gw-fx.js) ═══════════ */
#gwfx-layer{position:fixed;inset:0;pointer-events:none;z-index:2147483000;overflow:hidden}
.gwfx-p{position:absolute;display:block;width:9px;height:9px;margin:-4px 0 0 -4px;border-radius:2px;font-style:normal;
  animation:gwfx-fly var(--dur,1200ms) cubic-bezier(.15,.7,.3,1) both;will-change:transform,opacity}
.gwfx-p.spark{width:6px;height:6px;border-radius:50%;box-shadow:0 0 10px currentColor}
.gwfx-p.confetti{width:8px;height:14px}
.gwfx-p.star,.gwfx-p.coin,.gwfx-p.bill{width:auto;height:auto;background:none!important;font-size:22px;line-height:1;color:#f5c842;text-shadow:0 0 12px rgba(245,200,66,.7)}
.gwfx-p.coin,.gwfx-p.bill{font-size:26px;text-shadow:0 4px 10px rgba(0,0,0,.5)}
@keyframes gwfx-fly{0%{transform:translate(0,0) scale(.4) rotate(0);opacity:0}10%{opacity:1}
  100%{transform:translate(var(--dx),var(--dy)) scale(1) rotate(var(--rot));opacity:0}}
.gwfx-flash{position:absolute;inset:0;animation:gwfx-flash .8s ease-out both}
.gwfx-flash.gold{background:radial-gradient(circle at 50% 40%,rgba(245,200,66,.45),rgba(245,200,66,0) 60%)}
.gwfx-flash.red{background:radial-gradient(circle at 50% 50%,rgba(255,40,60,0) 40%,rgba(255,40,60,.35));box-shadow:inset 0 0 120px rgba(255,30,50,.55)}
@keyframes gwfx-flash{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
.gwfx-banner{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%) scale(.6);opacity:0;font-weight:900;font-size:clamp(30px,7vw,64px);
  letter-spacing:.02em;white-space:nowrap;animation:gwfx-in .5s cubic-bezier(.2,1.6,.4,1) forwards;font-family:Oswald,Impact,sans-serif}
.gwfx-banner.win{color:#7dff9a;text-shadow:0 0 24px rgba(125,255,154,.6),0 6px 0 #0b3d1d}
.gwfx-banner.rob{color:#f5c842;text-shadow:0 0 24px rgba(245,200,66,.6),0 6px 0 #4a3500}
.gwfx-banner.robbed{color:#ff5c7a;text-shadow:0 0 24px rgba(255,92,122,.6),0 6px 0 #4a0010}
.gwfx-banner.out{animation:gwfx-out .5s ease-in forwards}
@keyframes gwfx-in{to{transform:translate(-50%,-50%) scale(1);opacity:1}}
@keyframes gwfx-out{from{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-90%) scale(.9);opacity:0}}
.gwfx-pop{animation:gwfx-pop .9s cubic-bezier(.2,1.8,.4,1)}
@keyframes gwfx-pop{0%{transform:scale(1)}30%{transform:scale(1.35);box-shadow:0 0 0 6px rgba(245,200,66,.35),0 0 30px rgba(245,200,66,.8)}100%{transform:scale(1)}}
/* Ljudknapp i headern */
.gw-sound-btn{font-size:15px;line-height:1}
.gw-sound-btn .on{display:inline}.gw-sound-btn .off{display:none}
.gw-muted .gw-sound-btn .on{display:none}.gw-muted .gw-sound-btn .off{display:inline}
/* Bilar och vapen (optimerade WebP): enhetlig ram, skugga och svag zoom vid hover */
img[src^="/images/opt/"]{border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.45);transition:transform .25s ease,box-shadow .25s ease;background:#14141b}
:is(a,button,div):hover>img[src^="/images/opt/"]{transform:scale(1.03);box-shadow:0 10px 26px rgba(0,0,0,.55),0 0 0 1px rgba(245,200,66,.25)}
@media (prefers-reduced-motion:reduce){.gwfx-p,.gwfx-banner,.gwfx-flash,.gwfx-pop{animation:none!important;display:none}}

/* ── Attack (PvP): slash, muzzle flash, damage numbers, shake, KO ── */
.gwfx-slash{position:absolute;width:280px;height:10px;margin:-5px 0 0 -140px;border-radius:50%;transform:rotate(-28deg) scaleX(0);
  background:linear-gradient(90deg,rgba(255,255,255,0),#fff 45%,#ffd36b 55%,rgba(255,80,40,0));box-shadow:0 0 18px #ffb347,0 0 40px rgba(255,90,40,.7);
  animation:gwfx-slash .42s cubic-bezier(.2,.9,.3,1) forwards}
.gwfx-slash::after{content:"";position:absolute;inset:0;transform:rotate(56deg);background:inherit;box-shadow:inherit;animation:gwfx-slash2 .42s .09s cubic-bezier(.2,.9,.3,1) both}
.gwfx-slash.crit{height:16px;box-shadow:0 0 26px #ff4d2e,0 0 60px rgba(255,40,40,.85)}
.gwfx-slash.miss{background:linear-gradient(90deg,rgba(255,255,255,0),rgba(200,210,230,.8),rgba(255,255,255,0));box-shadow:none;opacity:.7}
.gwfx-slash.miss::after{display:none}
@keyframes gwfx-slash{0%{transform:rotate(-28deg) scaleX(0);opacity:1}55%{transform:rotate(-28deg) scaleX(1);opacity:1}100%{transform:rotate(-28deg) scaleX(1.1);opacity:0}}
@keyframes gwfx-slash2{0%{transform:rotate(56deg) scaleX(0);opacity:1}55%{transform:rotate(56deg) scaleX(1)}100%{transform:rotate(56deg) scaleX(1.1);opacity:0}}
.gwfx-muzzle{position:absolute;width:90px;height:90px;margin:-45px 0 0 -45px;border-radius:50%;
  background:radial-gradient(circle,#fff 0,#ffe27a 22%,#ff8a1f 45%,rgba(255,60,0,0) 70%);animation:gwfx-muzzle .24s ease-out forwards}
@keyframes gwfx-muzzle{0%{transform:scale(.2);opacity:1}40%{transform:scale(1.2);opacity:1}100%{transform:scale(1.5);opacity:0}}
.gwfx-dmg{position:absolute;transform:translate(-50%,-50%);font-weight:900;font-size:clamp(26px,5vw,44px);font-variant-numeric:tabular-nums;
  color:#fff;text-shadow:0 3px 0 #7a0a0a,0 0 16px rgba(255,60,60,.8);animation:gwfx-dmg 1.2s cubic-bezier(.2,.8,.3,1) forwards;pointer-events:none}
.gwfx-dmg.crit{color:#ffdf6b;font-size:clamp(34px,7vw,60px);text-shadow:0 4px 0 #6b2b00,0 0 22px rgba(255,170,40,.9)}
.gwfx-dmg.taken{color:#ff6b81;text-shadow:0 3px 0 #3d0010,0 0 16px rgba(255,40,80,.8)}
@keyframes gwfx-dmg{0%{transform:translate(-50%,-50%) scale(.3);opacity:0}15%{transform:translate(-50%,-70%) scale(1.25);opacity:1}
  35%{transform:translate(-50%,-80%) scale(1)}100%{transform:translate(-50%,-190%) scale(.95);opacity:0}}
.gwfx-banner.ko{color:#ffdf6b;font-size:clamp(40px,10vw,92px);text-shadow:0 0 30px rgba(255,120,40,.8),0 7px 0 #5a1500}
.gwfx-banner small{display:block;font-size:.38em;color:#f5c842;text-align:center}
body.gwfx-shake1{animation:gwfx-shake .3s linear}
body.gwfx-shake2{animation:gwfx-shake .42s linear;--gwfx-amp:7px}
body.gwfx-shake3{animation:gwfx-shake .55s linear;--gwfx-amp:12px}
@keyframes gwfx-shake{0%,100%{transform:none}15%{transform:translate(calc(var(--gwfx-amp,4px)*-1),2px)}30%{transform:translate(var(--gwfx-amp,4px),-2px)}
  45%{transform:translate(calc(var(--gwfx-amp,4px)*-.7),1px)}60%{transform:translate(calc(var(--gwfx-amp,4px)*.6),-1px)}80%{transform:translate(calc(var(--gwfx-amp,4px)*-.3),0)}}
@media (prefers-reduced-motion:reduce){.gwfx-slash,.gwfx-muzzle,.gwfx-dmg{display:none}body[class*="gwfx-shake"]{animation:none!important}}