fix: chess board init — sequential script loading + DOM verification

The board was empty because:
1. Scripts cached from previous nav resolved immediately
2. Board/Game singletons kept stale DOM references
3. Race condition between DOM render and script execution

Fix:
- Remove existing script tags before re-adding (forces re-execution)
- Load scripts SEQUENTIALLY (chess.min → openings → board → game)
- requestAnimationFrame before script loading (DOM settle)
- Explicit document.getElementById('board') check before Board.init
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

index.php

@@ -393,22 +393,32 @@ defineScreen('/game', function gameScreen() {
     </div>
   `;
 
-  function loadS(src){return new Promise((r,j)=>{if(document.querySelector('script[src="'+src+'"]')){r();return;}const s=document.createElement('script');s.src=src;s.onload=r;s.onerror=j;document.body.appendChild(s);});}
+  function loadS(src){return new Promise((r,j)=>{
+    const existing = document.querySelector('script[src="'+src+'"]');
+    if(existing){existing.remove();} // Remove old script to force re-execute
+    const s=document.createElement('script');s.src=src;s.onload=r;s.onerror=j;document.body.appendChild(s);
+  });}
 
-  Promise.all([
-    loadS('/public/js/chess.min.js'),
-    loadS('/public/js/openings.js'),
-    loadS('/public/js/board.js'),
-    loadS('/public/js/game.js')
-  ]).then(() => {
-    if (window.Board) Board.init('board', { flipped: params.color === 'b', playerColor: params.color || 'w' });
-    if (window.Game) Game.start({
-      color: params.color || 'w',
-      botId: params.bot || 'nour',
-      time: parseInt(params.time) || 300,
-      increment: parseInt(params.inc) || 0,
-      rated: params.rated !== 'false'
-    });
+  // Wait for DOM to settle, then load scripts sequentially
+  requestAnimationFrame(() => {
+    loadS('/public/js/chess.min.js')
+      .then(() => loadS('/public/js/openings.js'))
+      .then(() => loadS('/public/js/board.js'))
+      .then(() => loadS('/public/js/game.js'))
+      .then(() => {
+        // Verify #board exists before init
+        const boardEl = document.getElementById('board');
+        if (!boardEl) { console.error('Board element not found!'); return; }
+        if (window.Board) Board.init('board', { flipped: params.color === 'b', playerColor: params.color || 'w' });
+        if (window.Game) Game.start({
+          color: params.color || 'w',
+          botId: params.bot || 'nour',
+          time: parseInt(params.time) || 300,
+          increment: parseInt(params.inc) || 0,
+          rated: params.rated !== 'false'
+        });
+      })
+      .catch(e => console.error('Script load error:', e));
   });
 });