feat: add Deep Sea alternative hunting area

- Add Deep Sea location to navigation map
- Create DeepSeaHuntingScene with dark atmosphere
- Add deep ocean transition visuals
- Bioluminescent particles and giant shadows

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

src/scenes/TransitionScene.js

@@ -125,6 +125,12 @@ export default class TransitionScene extends Phaser.Scene {
                 description: 'The familiar harbor comes into view. Seagulls circle overhead.\nYou can already smell the taverns and hear the merchants haggling.\nTime to resupply and sell your cargo.',
                 backgroundColor: 0x654321,
                 visualType: 'harbor'
+            },
+            'deepsea': {
+                title: 'Descending into the Deep Sea',
+                description: 'The waters grow dark and cold. Your ship ventures into uncharted depths.\nMassive shadows move beneath the surface. The crew whispers of leviathans.\nOnly the bravest—or most foolish—hunt here...',
+                backgroundColor: 0x0a1a2a,
+                visualType: 'deep_ocean'
             }
         };
 
@@ -147,6 +153,9 @@ export default class TransitionScene extends Phaser.Scene {
             case 'harbor':
                 this.createHarbor();
                 break;
+            case 'deep_ocean':
+                this.createDeepOcean();
+                break;
             default:
                 this.createOcean();
                 break;
@@ -305,4 +314,74 @@ export default class TransitionScene extends Phaser.Scene {
             graphics.strokePath();
         }
     }
+
+    createDeepOcean() {
+        // Dark, eerie deep ocean atmosphere
+
+        // Gradient effect with darker rectangles
+        for (let i = 0; i < 6; i++) {
+            const alpha = 0.1 + i * 0.05;
+            this.add.rectangle(400, 50 + i * 50, 800, 50, 0x000000, alpha);
+        }
+
+        // Subtle dark waves
+        const graphics = this.add.graphics();
+        graphics.lineStyle(2, 0x1a3a5a, 0.4);
+
+        for (let i = 0; i < 6; i++) {
+            const y = 80 + i * 50;
+            graphics.beginPath();
+            for (let x = 0; x < 800; x += 25) {
+                const waveY = y + Math.sin((x + i * 40) * 0.015) * 12;
+                if (x === 0) {
+                    graphics.moveTo(x, waveY);
+                } else {
+                    graphics.lineTo(x, waveY);
+                }
+            }
+            graphics.strokePath();
+        }
+
+        // Massive shadows lurking below
+        for (let i = 0; i < 2; i++) {
+            const x = 200 + i * 400;
+            const y = 200 + Math.random() * 80;
+
+            // Giant whale shadow
+            const shadow = this.add.ellipse(x, y, 200, 80, 0x000000, 0.3);
+
+            // Slow, ominous movement
+            this.tweens.add({
+                targets: shadow,
+                x: x + 30,
+                y: y + 15,
+                scaleX: 1.1,
+                duration: 4000,
+                yoyo: true,
+                repeat: -1,
+                ease: 'Sine.inOut'
+            });
+        }
+
+        // Bioluminescent particles
+        for (let i = 0; i < 15; i++) {
+            const x = Math.random() * 800;
+            const y = Math.random() * 300;
+            const particle = this.add.circle(x, y, 2, 0x4a9fff, 0.6);
+
+            this.tweens.add({
+                targets: particle,
+                alpha: { from: 0.6, to: 0.1 },
+                y: y - 20,
+                duration: 2000 + Math.random() * 2000,
+                yoyo: true,
+                repeat: -1,
+                ease: 'Sine.inOut'
+            });
+        }
+
+        // Ship silhouette at top
+        this.add.rectangle(100, 60, 70, 35, 0x1a1a1a, 0.8);
+        this.add.polygon(100, 45, [0, 0, -35, 30, 35, 30], 0x2a2a2a, 0.8);
+    }
 }