fix: correct captured pieces display logic

Fixes inverted display of captured pieces in UI sidebars.

Issue:
- "Captured by White" was showing white pieces
- "Captured by Black" was showing black pieces

This is backwards! The display should show:
- "Captured by White" = black pieces that white captured
- "Captured by Black" = white pieces that black captured

Root Cause:
The capturedPieces object stores pieces by their color:
- capturedPieces.white = white pieces that were captured (by black)
- capturedPieces.black = black pieces that were captured (by white)

So the display logic was inverted.

The Fix:
- whiteCaptured (header "Captured by Black") now displays captured.white
- blackCaptured (header "Captured by White") now displays captured.black

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

js/main.js

@@ -223,12 +223,14 @@ class ChessApp {
 
         const captured = this.game.gameState.capturedPieces;
 
-        whiteCaptured.innerHTML = captured.black.map(piece =>
-            `<span class="captured-piece black">${piece.getSymbol()}</span>`
+        // "Captured by Black" shows white pieces that black captured
+        whiteCaptured.innerHTML = captured.white.map(piece =>
+            `<span class="captured-piece white">${piece.getSymbol()}</span>`
         ).join('') || '-';
 
-        blackCaptured.innerHTML = captured.white.map(piece =>
-            `<span class="captured-piece white">${piece.getSymbol()}</span>`
+        // "Captured by White" shows black pieces that white captured
+        blackCaptured.innerHTML = captured.black.map(piece =>
+            `<span class="captured-piece black">${piece.getSymbol()}</span>`
         ).join('') || '-';
     }