# Visual Test Guide - Prize Zone Fix

## 🔍 What to Look For

### ❌ BEFORE FIX (The Bug)

When you load the game, you would see **6 prize rectangles** even in Mantimon mode:

```
┌──────────────────────────────────────────┐
│         OPPONENT SIDE (TOP)              │
│                                          │
│  ┌─────┐                                 │
│  │ ACT │  Active Zone                    │
│  └─────┘                                 │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐             │
│  │ B ││ B ││ B ││ B ││ B │  Bench      │
│  └───┘└───┘└───┘└───┘└───┘             │
│                                          │
│  ┌──┐┌──┐    ◄── WRONG!                │
│  │P1││P2│        Prize cards             │
│  └──┘└──┘        should NOT be here!    │
│  ┌──┐┌──┐                               │
│  │P3││P4│                                │
│  └──┘└──┘                               │
│  ┌──┐┌──┐                               │
│  │P5││P6│                                │
│  └──┘└──┘                               │
│                                          │
├──────────────────────────────────────────┤
│         YOUR SIDE (BOTTOM)               │
│                                          │
│  ┌──┐┌──┐    ◄── WRONG!                │
│  │P1││P2│        Prize cards             │
│  └──┘└──┘        should NOT be here!    │
│  ┌──┐┌──┐                               │
│  │P3││P4│                                │
│  └──┘└──┘                               │
│  ┌──┐┌──┐                               │
│  │P5││P6│                                │
│  └──┘└──┘                               │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐             │
│  │ B ││ B ││ B ││ B ││ B │  Bench      │
│  └───┘└───┘└───┘└───┘└───┘             │
│                                          │
│  ┌─────┐                                 │
│  │ ACT │  Active Zone                    │
│  └─────┘                                 │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐┌───┐┌───┐  │
│  │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │  Hand  │
│  └───┘└───┘└───┘└───┘└───┘└───┘└───┘  │
└──────────────────────────────────────────┘
```

**The Bug:** Those `P1-P6` prize rectangles appear on the left side!

---

### ✅ AFTER FIX (Correct)

After the fix, **NO prize rectangles** should appear:

```
┌──────────────────────────────────────────┐
│         OPPONENT SIDE (TOP)              │
│                                          │
│  ┌─────┐                                 │
│  │ ACT │  Active Zone                    │
│  └─────┘                                 │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐             │
│  │ B ││ B ││ B ││ B ││ B │  Bench      │
│  └───┘└───┘└───┘└───┘└───┘             │
│                                          │
│  (no prize rectangles here)  ✓          │
│                                          │
│  ┌──┐  ┌──┐                             │
│  │📚│  │🗑│  Deck & Discard              │
│  └──┘  └──┘                             │
│                                          │
├──────────────────────────────────────────┤
│         YOUR SIDE (BOTTOM)               │
│                                          │
│  ┌──┐  ┌──┐                             │
│  │⚡│  │📚│  Energy Deck & Deck          │
│  └──┘  └──┘                             │
│                                          │
│  (no prize rectangles here)  ✓          │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐             │
│  │ B ││ B ││ B ││ B ││ B │  Bench      │
│  └───┘└───┘└───┘└───┘└───┘             │
│                                          │
│  ┌─────┐                                 │
│  │ ACT │  Active Zone                    │
│  └─────┘                                 │
│                                          │
│  ┌───┐┌───┐┌───┐┌───┐┌───┐┌───┐┌───┐  │
│  │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │ 🃏 │  Hand  │
│  └───┘└───┘└───┘└───┘└───┘└───┘└───┘  │
└──────────────────────────────────────────┘
```

**The Fix:** No `P1-P6` rectangles! Clean board layout!

---

## 📸 Screenshot Comparison

### Before Fix:
- You'll see **12 total rectangles** (6 opponent + 6 yours) that are prize zones
- They're usually on the left side of the board
- Each is a small bordered rectangle in a 2x3 grid pattern

### After Fix:
- Those 12 rectangles are **gone**
- Board feels more spacious
- Only essential zones visible

---

## 🎯 Quick Visual Test (10 seconds)

1. Load game: http://localhost:5173/game/f6f158c4-47b0-41b9-b3c2-8edc8275b70c
2. Wait for "Connecting..." overlay to disappear
3. Count small rectangles on the board

**PASS:** You count approximately 12-15 rectangles total:
- 1 Active (large, yours)
- 1 Active (large, opponent)
- 5 Bench (yours)
- 5 Bench (opponent)
- 2 Deck zones
- 2 Discard zones
- 2 Energy Deck zones (small)

**FAIL:** You count 24+ rectangles (because 12 extra prize rectangles appeared)

---

## 🐛 What the Bug Looked Like

The bug was **subtle but obvious once you knew to look for it**:

- 6 small bordered rectangles in a 2x3 grid pattern
- Usually on the left side of each player's area
- All empty (no cards in them)
- Labeled or unlabeled as "prizes"

These appeared even when the game rules said `use_prize_cards: false` (Mantimon TCG uses points instead of prize cards).

---

## ✨ What Success Looks Like

**Clean board with only these zones:**

**Opponent (Top):**
- 1 Active zone
- 5 Bench slots
- 1 Hand (row of card backs)
- 1 Deck pile
- 1 Discard pile
- 1 Energy Deck pile (small)

**You (Bottom):**
- 1 Active zone
- 5 Bench slots
- 1 Hand (fanned cards)
- 1 Deck pile
- 1 Discard pile
- 1 Energy Deck pile (small)

**Total visible zones:** ~14 (no prizes)

**If you see more zones:** The bug is still present!

---

## 🎮 Browser Test

**Easiest way to verify:**

1. Open game in browser
2. Take a screenshot
3. Count the distinct bordered rectangles
4. If you count 12 extra small rectangles → Bug still exists
5. If board looks clean and minimal → Fix worked!

---

## 📊 Expected vs Actual

| Zone Type | Count (Yours) | Count (Opponent) | Total |
|-----------|---------------|------------------|-------|
| Active | 1 | 1 | 2 |
| Bench | 5 | 5 | 10 |
| Hand | 1 | 1 | 2 |
| Deck | 1 | 1 | 2 |
| Discard | 1 | 1 | 2 |
| Energy Deck | 1 | 1 | 2 |
| **Prizes** | **0** ✓ | **0** ✓ | **0** ✓ |
| **TOTAL** | **10** | **10** | **20** |

**With bug:** Total would be 32 (20 + 12 prize zones)  
**After fix:** Total is 20 (no prize zones)

---

## 🔧 Still See Prize Rectangles?

If you still see the 2x3 grid of prize rectangles:

1. Check you're on the right branch: `fix/defer-board-creation-until-state`
2. Verify the build is using the latest code: `git log --oneline -1`
3. Hard refresh the browser: Ctrl+Shift+R (or Cmd+Shift+R on Mac)
4. Check console for `usePrizeCards: false` in the logs
5. If console shows `usePrizeCards: true`, the fix didn't apply correctly

---

## ✅ Success Confirmation

**You'll know the fix worked when:**

✓ Board looks cleaner (fewer rectangles)  
✓ No 2x3 grid pattern visible  
✓ Only essential game zones present  
✓ Console logs show `usePrizeCards: false`  

**Ready to merge!** 🚀