Fix diagonal corner artifact by stopping arrow animation via inline style when hidden

game.js

@@ -447,12 +447,14 @@ class Game {
   _updateDirArrow(nearNPC) {
     const arrow = document.getElementById('map-dir-arrow');
     if (!arrow) return;
-    if (nearNPC) { arrow.classList.remove('visible'); return; }
+    if (nearNPC) { arrow.style.display = 'none'; arrow.style.animation = 'none'; return; }
     const world = document.getElementById('map-world');
     const viewH = (world && world.offsetHeight) ? world.offsetHeight : 300;
-    arrow.textContent  = '▶';
-    arrow.style.bottom = (viewH * 0.28) + 'px';
-    arrow.classList.add('visible');
+    arrow.textContent     = '▶';
+    arrow.style.display   = 'block';
+    arrow.style.animation = 'arrowPulse .7s ease-in-out infinite';
+    arrow.style.removeProperty('left');
+    arrow.style.bottom    = (viewH * 0.28) + 'px';
   }
 
   _nearNPC() {
@@ -476,7 +478,7 @@ class Game {
       return;
     }
     const arrow = document.getElementById('map-dir-arrow');
-    if (arrow) arrow.classList.remove('visible');
+    if (arrow) { arrow.style.display = 'none'; arrow.style.animation = 'none'; }
     const bub = document.getElementById('player-bubble');
     if (bub) bub.classList.remove('visible');
     SFX.encounter();