.semantic-fx-layer{position:absolute;inset:0;z-index:48;pointer-events:none;overflow:visible}
.semantic-fx{position:absolute;inset:0;pointer-events:none}
.semantic-fx i{position:absolute;display:block;left:var(--x);top:var(--y);animation-delay:var(--delay);will-change:transform,opacity}
.semantic-fx.fx-burn i{width:13px;height:20px;border-radius:55% 45% 60% 40%;background:radial-gradient(circle at 50% 75%,#fff7a8 0 16%,#ff9b22 38%,#e52d12 70%,transparent 72%);filter:drop-shadow(0 0 5px #ff6a00);animation:fxFlame .75s ease-out forwards}
.semantic-fx.fx-poison i{width:var(--s);height:var(--s);border:2px solid #79ff86;border-radius:50%;background:rgba(31,220,84,.22);box-shadow:inset 2px 2px 3px rgba(220,255,223,.75),0 0 6px #16a34a;animation:fxBubble 1s ease-out forwards}
.semantic-fx.fx-wither i{width:var(--s);height:var(--s);background:#080808;clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,40% 61%,0 50%,40% 39%);filter:drop-shadow(0 0 2px rgba(255,255,255,.35));animation:fxWither .85s cubic-bezier(.18,.8,.3,1) forwards}
.semantic-fx.fx-bullet::before{content:"";position:absolute;inset:12%;border-radius:12px;background:radial-gradient(circle at 50% 48%,rgba(255,220,170,.38),transparent 42%);animation:fxBulletFlash .32s ease-out forwards}
.semantic-fx.fx-bullet i{width:clamp(50px,28%,72px);aspect-ratio:1;background:url('/static/fx/assets/bullet-hole-v1.webp') center/contain no-repeat;filter:drop-shadow(0 2px 3px rgba(0,0,0,.9));animation:fxBullet 1.9s ease-out forwards}
.semantic-fx.fx-track-up i,.semantic-fx.fx-track-down i{left:50%;top:58%;width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;filter:drop-shadow(0 0 5px currentColor)}
.semantic-fx.fx-track-up i{color:#46e890;border-bottom:20px solid currentColor;animation:fxTrackUp .8s ease-out forwards}
.semantic-fx.fx-track-down i{color:#ff4d57;border-top:20px solid currentColor;animation:fxTrackDown .8s ease-in forwards}
@keyframes fxFlame{0%{opacity:0;transform:translate(-50%,8px) scale(.45) rotate(-8deg)}30%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-32px + var(--dy))) scale(.1) rotate(15deg)}}
@keyframes fxBubble{0%{opacity:0;transform:translate(-50%,10px) scale(.45)}25%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),-42px) scale(1.25)}}
@keyframes fxWither{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}25%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.65) rotate(150deg)}}
@keyframes fxBulletFlash{0%{opacity:0;transform:scale(.72)}18%{opacity:1}100%{opacity:0;transform:scale(1.08)}}
@keyframes fxBullet{0%{opacity:0;transform:translate(-50%,-50%) scale(3.2) rotate(var(--rot))}14%{opacity:1;transform:translate(-50%,-50%) scale(.65) rotate(var(--rot))}28%{transform:translate(-50%,-50%) scale(1.16) rotate(var(--rot))}45%,84%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(var(--rot))}100%{opacity:0;transform:translate(-50%,-50%) scale(.92) rotate(var(--rot))}}
@keyframes fxTrackUp{0%{opacity:0;transform:translate(-50%,8px) scale(.6)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-70px) scale(1.15)}}
@keyframes fxTrackDown{0%{opacity:0;transform:translate(-50%,-38px) scale(.7)}28%{opacity:1}100%{opacity:0;transform:translate(-50%,45px) scale(1.1)}}
.dmg-num:not(.crit-burst){padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important}
.dmg-num .dmg-copy{position:relative;z-index:1}
.damage-boost-mark{display:inline-block;width:.72em;height:.56em;margin-right:.08em;background:currentColor;clip-path:polygon(0 100%,0 55%,15% 20%,30% 60%,50% 0,70% 60%,85% 20%,100% 55%,100% 100%);filter:drop-shadow(0 1px 1px #000);vertical-align:.1em}
#game-fx-canvas{position:fixed;inset:0;z-index:9997;width:100vw;height:100vh;pointer-events:none;display:none}
@media(prefers-reduced-motion:reduce){.semantic-fx i{animation-duration:.22s!important}}