feat: increase fireball size and speed

static/main.js

@@ -129,6 +129,7 @@ let pendingFireballPos = null;
 const hearts = [];
 const particles = [];
 let nextHeartSpawn = 0;
+let heartCharges = [0, 0];
 
 // ─────────────────────────────────────────────────────────────
 // GESTURE DETECTION
@@ -270,6 +271,36 @@ class Heart {
     }
 }
 
+function drawHeartWireframe(ctx, x, y, size, progress) {
+    ctx.save();
+    ctx.translate(x, y);
+    const s = size / 15;
+    ctx.scale(s, s);
+    ctx.lineWidth = 3 / s;
+    ctx.strokeStyle = '#ff0077';
+    ctx.shadowBlur = 15;
+    ctx.shadowColor = '#ff0077';
+    
+    ctx.beginPath();
+    ctx.moveTo(0, 5);
+    ctx.bezierCurveTo(-5, 0, -10, -5, -10, -10);
+    ctx.bezierCurveTo(-10, -15, -5, -20, 0, -15);
+    ctx.bezierCurveTo(5, -20, 10, -15, 10, -10);
+    ctx.bezierCurveTo(10, -5, 5, 0, 0, 5);
+    
+    const pathLength = 80; 
+    ctx.setLineDash([pathLength]);
+    ctx.lineDashOffset = pathLength * (1 - progress);
+    
+    ctx.stroke();
+    
+    if (progress >= 1.0) {
+        ctx.fillStyle = 'rgba(255, 0, 119, 0.3)';
+        ctx.fill();
+    }
+    ctx.restore();
+}
+
 // ─────────────────────────────────────────────────────────────
 // NEON WIREFRAME DRAWING
 // ─────────────────────────────────────────────────────────────
@@ -464,12 +495,24 @@ function detectLoop() {
             mirroredHands.forEach((hand, i) => {
                 drawHand(hand, i);
                 if (isFingerHeart(hand)) {
-                    makingHeart = true;
-                    if (frameCount >= nextHeartSpawn) {
-                        hearts.push(new Heart(hand[8].x * canvas.width, hand[8].y * canvas.height));
-                        nextHeartSpawn = frameCount + (30 + Math.random() * 150); // 0.5 to 3 seconds
-                        audio.play('heart'); 
+                    heartCharges[i] = Math.min(60, (heartCharges[i] || 0) + 2);
+                    const progress = heartCharges[i] / 60;
+                    
+                    const hx = (hand[4].x + hand[8].x) / 2 * canvas.width;
+                    const hy = (hand[4].y + hand[8].y) / 2 * canvas.height;
+                    
+                    drawHeartWireframe(ctx, hx, hy, 40, progress);
+
+                    if (progress >= 1.0) {
+                        makingHeart = true;
+                        if (frameCount >= nextHeartSpawn) {
+                            hearts.push(new Heart(hand[8].x * canvas.width, hand[8].y * canvas.height));
+                            nextHeartSpawn = frameCount + (30 + Math.random() * 150);
+                            audio.play('heart'); 
+                        }
                     }
+                } else {
+                    heartCharges[i] = Math.max(0, (heartCharges[i] || 0) - 5);
                 }
             });