Add NPC Sprites (Created by my amazing daughter)

game.js

@@ -21,8 +21,8 @@ function setNPC(el, val) {
   if (val && val.endsWith('.png')) {
     el.innerHTML = '';
     const img = document.createElement('img');
-    img.src = val;
-    img.style.cssText = 'height:1em;width:auto;image-rendering:pixelated;vertical-align:middle;';
+    img.src = val.includes('/') ? val : './' + val;
+    img.style.cssText = 'width:auto;image-rendering:pixelated;vertical-align:middle;display:block;';
     el.appendChild(img);
   } else {
     el.textContent = val || '🧑';
@@ -30,11 +30,11 @@ function setNPC(el, val) {
 }
 
 const NPC = {
-  'Professor Oak':     './oak.png',
-  'Rival Gary':        '😤',
+  'Professor Oak':     'oak.png',
+  'Rival Gary':        'gary.png',
   'Old Man Bob':       '🧓',
-  'Nurse Joy':         '👩‍⚕️',
-  'Officer Jenny':     '👮‍♀️',
+  'Nurse Joy':         'joy.png',
+  'Officer Jenny':     'jenny.png',
   'Brock':             '🧑‍🍳',
   'Misty':             '🧜‍♀️',
   'Giovanni':          '😈',
@@ -52,7 +52,7 @@ const NPC = {
   'Agatha':            '👻',
   'Lance':             '🐉',
   'Champion':          '🏆',
-  'Gary':              '😤',
+  'Gary':              'gary.png',
 };
 
 const INTRO_MSGS = CONFIG.introLines.map(text => ({ speaker:'PROFESSOR OAK', npc:'Professor Oak', text }));
@@ -1194,7 +1194,7 @@ class Game {
     this.state.answering=false;
     this.state.cursor=0;
 
-    document.getElementById('battle-npc-sprite').textContent = NPC[q.npc]||'🧑';
+    setNPC(document.getElementById('battle-npc-sprite'), NPC[q.npc]||'🧑');
     document.getElementById('battle-npc-name').textContent   = q.npc.toUpperCase();
     document.getElementById('battle-speaker').textContent    = q.npc.toUpperCase();
     document.getElementById('battle-player-name').textContent= (this.state.playerName||'ASH').toUpperCase();