===================================================================
--- original.js
+++ change.js
@@ -63,9 +63,13 @@
 		anchorX: 0.5,
 		anchorY: 0.5,
 		alpha: 0.1
 	});
-	self.heartFrames = {}; // Initialize heartFrames as a property of BigHeart class
+	self.heartFrames = Array.from({
+		length: 10
+	}, function () {
+		return Array(6).fill(null);
+	}); // Initialize heartFrames as a 2D array
 	for (var type = 9; type >= 0; type--) {
 		self.heartFrames[type] = [];
 		for (var i = 5; i >= 0; i--) {
 			self.heartFrames[type][5 - i] = self.attachAsset('heart_' + type + '_frame_' + i, {
@@ -109,16 +113,12 @@
 	// Event handler called when a press happens on element. This is automatically called on press if bigHeart is attached.
 	self.down = function (x, y, obj) {
 		// Log the down event
 		log("Down event triggered on BigHeart");
-		if (self.currentGraphic && self.nextGraphic) {
-			log("Current indexes:: ", self.currentGraphic.index, ',', self.nextGraphic.index); // Log the tap count
-		} else {
-			log("CurrentGraphic or NextGraphic is not initialized.");
-		}
-		// Increment tap counter
-		progressManager.manualGeneration();
+		// First animate the beat to ensure graphics are initialized
 		self.animateBeat();
+		// Then increment tap counter
+		progressManager.manualGeneration();
 		// Create a new heart projection using the current frame index
 		if (self.currentGraphic) {
 			projectionsManager.popHearts(self.currentGraphic.heartType);
 		} else {
@@ -190,14 +190,14 @@
 		var frameProgress = progress * 5; // Convert progress to frame scale (0-5)
 		log("Progress calculations:");
 		log("- frameProgress:", frameProgress);
 		// Hide all frames of current type
-		/*self.heartFrames[self.heartType].forEach(function (frame) {
+		self.heartFrames[self.heartType].forEach(function (frame) {
 			if (frame && frame._activeTween) {
 				frame._activeTween.stop();
 			}
 			frame.visible = false;
-		});*/
+		});
 		// Handle the final frame (0) separately - only shown after explosion
 		if (progress >= 1) {
 			log("Progress >= 1, showing frame 0");
 			self.currentGraphic = self.heartFrames[self.heartType][0];
@@ -211,10 +211,11 @@
 			return;
 		}
 		// Calculate frame indices based on progress
 		var currentFrameIndex = 5 - Math.floor(frameProgress);
-		var alpha = frameProgress - Math.floor(frameProgress);
+		var alpha = 1 - (frameProgress - Math.floor(frameProgress));
 		log("Frame calculations:");
+		log("- heartType:", self.heartType);
 		log("- currentFrameIndex:", currentFrameIndex);
 		log("- alpha:", alpha);
 		// Show next frame first (it will be behind current frame)
 		if (currentFrameIndex > 1) {
@@ -225,11 +226,12 @@
 				self.nextGraphic.alpha = 1; // Keep next frame fully visible
 				self.nextGraphic.scaleX = self.nextGraphic.scaleY = 1.1;
 				// Ensure nextGraphic is behind currentGraphic
 				if (self.nextGraphic.parent) {
-					self.nextGraphic.parent.setChildIndex(self.nextGraphic, 0);
+					//self.nextGraphic.parent.setChildIndex(self.nextGraphic, 0);
 				}
 				log("Next frame setup:");
+				log("- heartType:", self.nextGraphic.heartType);
 				log("- index:", currentFrameIndex - 1);
 				log("- visible:", self.nextGraphic.visible);
 				log("- alpha:", self.nextGraphic.alpha);
 				log("- scale:", self.nextGraphic.scaleX);
@@ -241,23 +243,23 @@
 		// Show current frame on top
 		self.currentGraphic = self.heartFrames[self.heartType][currentFrameIndex];
 		if (self.currentGraphic) {
 			self.currentGraphic.visible = true;
-			self.currentGraphic.alpha = 1 - alpha; // Only fade out current frame
+			self.currentGraphic.alpha = alpha; // Only fade out current frame
 			self.currentGraphic.scaleX = self.currentGraphic.scaleY = 1.1;
 			// Ensure currentGraphic is above nextGraphic
 			if (self.currentGraphic.parent) {
-				self.currentGraphic.parent.setChildIndex(self.currentGraphic, self.currentGraphic.parent.children.length - 1);
+				//self.currentGraphic.parent.setChildIndex(self.currentGraphic, self.currentGraphic.parent.children.length - 1);
 			}
 			log("Current frame setup:");
+			log("- heartType:", self.currentGraphic.heartType);
 			log("- index:", currentFrameIndex);
 			log("- visible:", self.currentGraphic.visible);
 			log("- alpha:", self.currentGraphic.alpha);
 			log("- scale:", self.currentGraphic.scaleX);
 		}
 		log("=== End updateFramesByProgress ===\n");
 	};
-	// Explosion Animation
 	self.animateExplosion = function (callback) {
 		if (!self.explosionTriggered) {
 			self.explosionTriggered = true;
 			if (true || !isDebug) {
@@ -273,23 +275,35 @@
 					alpha: 1
 				});
 				self.addChild(cloneGraphic);
 			}
+			// Update heart type immediately so new frames are ready
+			if (self.heartType < 9) {
+				var nextHeartType = self.heartType + 1;
+				// Pre-scale both frames of the next heart type
+				tween(self.heartFrames[nextHeartType][5], {
+					scaleX: 1.1,
+					scaleY: 1.1
+				}, {
+					duration: 300,
+					easing: tween.easeOut
+				});
+				tween(self.heartFrames[nextHeartType][4], {
+					scaleX: 1.1,
+					scaleY: 1.1
+				}, {
+					duration: 300,
+					easing: tween.easeOut
+				});
+				// Initialize graphics for new heart type
+				self.currentGraphic = self.heartFrames[nextHeartType][5];
+				self.nextGraphic = self.heartFrames[nextHeartType][4];
+				// Update heart type and notify projections
+				self.heartType = nextHeartType;
+				projectionsManager.updateHeartType(nextHeartType);
+			}
 			LK.setTimeout(function () {
-				LK.effects.flashScreen(0xffffff, 2000); // Flash the screen white for 500ms
-				// Pre-scale the first frame of the next heart type
-				if (self.heartType < 9) {
-					var nextHeartFrame = self.heartFrames[self.heartType + 1][5];
-					if (nextHeartFrame) {
-						tween(nextHeartFrame, {
-							scaleX: 1.1,
-							scaleY: 1.1
-						}, {
-							duration: 300,
-							easing: tween.easeOut
-						});
-					}
-				}
+				LK.effects.flashScreen(0xffffff, 2000); // Flash the screen white
 				background.changeBackground(progressManager.currentLevel + 1); // Change background when level changes
 				if (cloneGraphic) {
 					log("nextGraphic for explosion!", cloneGraphic);
 					tween(cloneGraphic, {
@@ -299,36 +313,26 @@
 					}, {
 						duration: 3000,
 						easing: tween.easeOut,
 						onFinish: function onFinish() {
-							// Make all frames of the current heartType invisible
-							self.heartFrames[self.heartType].forEach(function (frame) {
+							// Make all frames of the previous heart type invisible
+							self.heartFrames[self.heartType - 1].forEach(function (frame) {
 								frame.visible = false;
 							});
+							// Make current heart type frames visible
+							if (self.currentGraphic) {
+								self.currentGraphic.visible = true;
+							}
+							if (self.nextGraphic) {
+								self.nextGraphic.visible = true;
+							}
 							self.explosionTriggered = false; // Reset explosion flag
 							cloneGraphic.destroy(); // Remove the clone after animation
-							// Update projections manager with new heart type
-							projectionsManager.updateHeartType(self.heartType + 1);
 							if (callback) {
 								callback();
 							}
 						}
 					});
-					// Pre scale next heart
-					tween(self.heartFrames[self.heartType + 1][5], {
-						scaleX: 1.1,
-						scaleY: 1.1
-					}, {
-						duration: 300,
-						easing: tween.easeOut
-					});
-					tween(self.heartFrames[self.heartType + 1][4], {
-						scaleX: 1.1,
-						scaleY: 1.1
-					}, {
-						duration: 300,
-						easing: tween.easeOut
-					});
 				} else {
 					log("No nextGraphic for explosion!");
 				}
 			}, 205);
@@ -667,8 +671,20 @@
 		log("Heart type updated to:", self.heartType);
 		// Reset graphics for new heart type
 		self.resetGraphics();
 		log("Graphics reset for new heart type");
+		// Initialize graphics for new heart type
+		self.currentGraphic = self.heartFrames[self.heartType][5];
+		self.nextGraphic = self.heartFrames[self.heartType][4];
+		if (self.currentGraphic) {
+			self.currentGraphic.visible = true;
+			self.currentGraphic.scaleX = self.currentGraphic.scaleY = 1.1;
+		}
+		if (self.nextGraphic) {
+			self.nextGraphic.visible = true;
+			self.nextGraphic.scaleX = self.nextGraphic.scaleY = 1;
+		}
+		log("Initialized graphics for new heart type");
 		// Update projections
 		if (projectionsManager) {
 			log("Updating projections manager with heartType:", heartType);
 			projectionsManager.updateHeartType(heartType);
@@ -1281,11 +1297,9 @@
 					frame.visible = false;
 				});
 				bigHeart.animateExplosion(function () {
 					self.currentLevel++;
-					bigHeart.heartType = self.currentLevel;
 					self.updateHeartProgress(); // Start new level with correct frame
-					projectionsManager.updateHeartType(bigHeart.heartType);
 				});
 			}
 		}
 	};