/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");

/**** 
* Classes
****/ 
var Character = Container.expand(function () {
	var self = Container.call(this);
	// Create base circle under character
	var base = self.attachAsset('characterBase', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.7
	});
	// Character type (boy or girl)
	self.type = "";
	// Character shape will be added in initialize
	self.shape = null;
	// Head, body, arms, legs for more realistic character
	self.head = null;
	self.body = null;
	self.leftArm = null;
	self.rightArm = null;
	self.leftLeg = null;
	self.rightLeg = null;
	// Animation properties
	self.bounceTimer = null;
	self.isHovered = false;
	// Initialize with type
	self.initialize = function (characterType) {
		self.type = characterType;
		// Create container for character parts
		var characterContainer = new Container();
		self.addChild(characterContainer);
		if (characterType === "boy") {
			// Boy character parts - more realistic and cartoony
			var bodyColor = 0x3498db;
			var skinColor = 0xffcc99;
			// Body (slightly rectangle/trapezoid)
			self.body = new Container();
			var bodyShape = LK.getAsset('boyCharacter', {
				anchorX: 0.5,
				anchorY: 0.5,
				scaleX: 1.2,
				scaleY: 1.3,
				y: 20
			});
			bodyShape.tint = bodyColor;
			self.body.addChild(bodyShape);
			// Head (circle)
			self.head = new Container();
			var headShape = LK.getAsset('characterBase', {
				anchorX: 0.5,
				anchorY: 0.5,
				scaleX: 0.6,
				scaleY: 0.6,
				y: -80
			});
			headShape.tint = skinColor;
			self.head.addChild(headShape);
			// Add face features
			// Eyes
			var leftEye = LK.getAsset('eyeShape', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: -25,
				y: -15
			});
			var rightEye = LK.getAsset('eyeShape', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: 25,
				y: -15
			});
			// Mouth
			var mouth = LK.getAsset('mouthShape', {
				anchorX: 0.5,
				anchorY: 0.5,
				y: 20,
				scaleY: 0.8
			});
			// Add all face parts to head
			self.head.addChild(leftEye);
			self.head.addChild(rightEye);
			self.head.addChild(mouth);
			// Arms
			self.leftArm = new Container();
			var leftArmShape = LK.getAsset('boyCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.3,
				scaleY: 0.8,
				x: -70,
				y: -30,
				rotation: 0.2
			});
			leftArmShape.tint = bodyColor;
			self.leftArm.addChild(leftArmShape);
			self.rightArm = new Container();
			var rightArmShape = LK.getAsset('boyCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.3,
				scaleY: 0.8,
				x: 70,
				y: -30,
				rotation: -0.2
			});
			rightArmShape.tint = bodyColor;
			self.rightArm.addChild(rightArmShape);
			// Legs
			self.leftLeg = new Container();
			var leftLegShape = LK.getAsset('boyCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.35,
				scaleY: 0.9,
				x: -40,
				y: 80
			});
			leftLegShape.tint = 0x2980b9;
			self.leftLeg.addChild(leftLegShape);
			self.rightLeg = new Container();
			var rightLegShape = LK.getAsset('boyCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.35,
				scaleY: 0.9,
				x: 40,
				y: 80
			});
			rightLegShape.tint = 0x2980b9;
			self.rightLeg.addChild(rightLegShape);
		} else {
			// Girl character parts - more realistic and cartoony
			var bodyColor = 0xe84393;
			var skinColor = 0xffe0bd;
			// Body (slightly rectangle/trapezoid)
			self.body = new Container();
			var bodyShape = LK.getAsset('girlCharacter', {
				anchorX: 0.5,
				anchorY: 0.5,
				scaleX: 1.0,
				scaleY: 1.3,
				y: 20
			});
			bodyShape.tint = bodyColor;
			self.body.addChild(bodyShape);
			// Head (circle)
			self.head = new Container();
			var headShape = LK.getAsset('characterBase', {
				anchorX: 0.5,
				anchorY: 0.5,
				scaleX: 0.6,
				scaleY: 0.6,
				y: -80
			});
			headShape.tint = skinColor;
			self.head.addChild(headShape);
			// Arms
			self.leftArm = new Container();
			var leftArmShape = LK.getAsset('girlCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.3,
				scaleY: 0.8,
				x: -60,
				y: -30,
				rotation: 0.2
			});
			leftArmShape.tint = bodyColor;
			self.leftArm.addChild(leftArmShape);
			self.rightArm = new Container();
			var rightArmShape = LK.getAsset('girlCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.3,
				scaleY: 0.8,
				x: 60,
				y: -30,
				rotation: -0.2
			});
			rightArmShape.tint = bodyColor;
			self.rightArm.addChild(rightArmShape);
			// Legs
			self.leftLeg = new Container();
			var leftLegShape = LK.getAsset('girlCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.35,
				scaleY: 0.9,
				x: -30,
				y: 80
			});
			leftLegShape.tint = 0xd63031;
			self.leftLeg.addChild(leftLegShape);
			self.rightLeg = new Container();
			var rightLegShape = LK.getAsset('girlCharacter', {
				anchorX: 0.5,
				anchorY: 0,
				scaleX: 0.35,
				scaleY: 0.9,
				x: 30,
				y: 80
			});
			rightLegShape.tint = 0xd63031;
			self.rightLeg.addChild(rightLegShape);
		}
		// Add all parts to the character container
		characterContainer.addChild(self.leftLeg);
		characterContainer.addChild(self.rightLeg);
		characterContainer.addChild(self.body);
		characterContainer.addChild(self.leftArm);
		characterContainer.addChild(self.rightArm);
		characterContainer.addChild(self.head);
		// Start with scale 0
		self.scaleX = 0;
		self.scaleY = 0;
		// Start idle animation after initialization
		self.startIdleAnimation();
	};
	// Idle animation for character
	self.startIdleAnimation = function () {
		function animateIdle() {
			if (!self.isHovered) {
				// Subtle body bob up and down
				tween(self.body, {
					y: self.body.y + 5
				}, {
					duration: 1000,
					easing: tween.easeInOut,
					onFinish: function onFinish() {
						tween(self.body, {
							y: self.body.y - 5
						}, {
							duration: 1000,
							easing: tween.easeInOut,
							onFinish: function onFinish() {
								self.bounceTimer = LK.setTimeout(animateIdle, 100);
							}
						});
					}
				});
				// Subtle arm swings
				tween(self.leftArm, {
					rotation: self.leftArm.rotation - 0.05
				}, {
					duration: 1000,
					easing: tween.easeInOut
				});
				tween(self.rightArm, {
					rotation: self.rightArm.rotation + 0.05
				}, {
					duration: 1000,
					easing: tween.easeInOut,
					onFinish: function onFinish() {
						tween(self.leftArm, {
							rotation: self.leftArm.rotation + 0.05
						}, {
							duration: 1000,
							easing: tween.easeInOut
						});
						tween(self.rightArm, {
							rotation: self.rightArm.rotation - 0.05
						}, {
							duration: 1000,
							easing: tween.easeInOut
						});
					}
				});
			}
		}
		// Start the animation
		self.bounceTimer = LK.setTimeout(animateIdle, 100);
	};
	// Animate character appearance
	self.appear = function () {
		tween(self, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 500,
			easing: tween.elasticOut
		});
		// Add a little jump after appearing
		LK.setTimeout(function () {
			tween(self, {
				y: self.y - 30
			}, {
				duration: 300,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					tween(self, {
						y: self.y + 30
					}, {
						duration: 400,
						easing: tween.bounceOut
					});
				}
			});
		}, 600);
	};
	// Handle selection
	self.down = function (x, y, obj) {
		// Cleanup any ongoing animations
		if (self.bounceTimer) {
			LK.clearTimeout(self.bounceTimer);
			self.bounceTimer = null;
		}
		self.isHovered = true;
		// Squash effect - wider and shorter
		tween(self, {
			scaleX: 1.1,
			scaleY: 0.8
		}, {
			duration: 100,
			easing: tween.easeOut
		});
		// Animation for parts
		tween(self.head, {
			scaleY: 0.9,
			y: self.head.y + 10
		}, {
			duration: 100,
			easing: tween.easeOut
		});
		// Arms up
		tween(self.leftArm, {
			rotation: -0.4
		}, {
			duration: 100,
			easing: tween.easeOut
		});
		tween(self.rightArm, {
			rotation: 0.4
		}, {
			duration: 100,
			easing: tween.easeOut
		});
	};
	self.up = function (x, y, obj) {
		// Play sound
		LK.getSound('buttonClick').play();
		// Stretch effect - taller and thinner
		tween(self, {
			scaleX: 0.9,
			scaleY: 1.2
		}, {
			duration: 200,
			easing: tween.elasticOut,
			onFinish: function onFinish() {
				// Head bounce
				tween(self.head, {
					scaleY: 1.1,
					y: self.head.y - 15
				}, {
					duration: 200,
					easing: tween.elasticOut,
					onFinish: function onFinish() {
						tween(self.head, {
							scaleY: 1.0,
							y: self.head.y + 15
						}, {
							duration: 200,
							easing: tween.easeOut
						});
					}
				});
				// Arms celebration
				tween(self.leftArm, {
					rotation: -0.8
				}, {
					duration: 200,
					easing: tween.elasticOut,
					onFinish: function onFinish() {
						tween(self.leftArm, {
							rotation: 0.2
						}, {
							duration: 200,
							easing: tween.easeOut
						});
					}
				});
				tween(self.rightArm, {
					rotation: 0.8
				}, {
					duration: 200,
					easing: tween.elasticOut,
					onFinish: function onFinish() {
						tween(self.rightArm, {
							rotation: -0.2
						}, {
							duration: 200,
							easing: tween.easeOut
						});
					}
				});
				// Main character animation
				tween(self, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 200,
					easing: tween.easeOut,
					onFinish: function onFinish() {
						// Character selected!
						characterSelected(self.type);
						self.isHovered = false;
						// Restart idle animation
						self.startIdleAnimation();
					}
				});
			}
		});
	};
	return self;
});
var PlayButton = Container.expand(function () {
	var self = Container.call(this);
	// Create shadow first so it appears behind the button
	var shadow = self.attachAsset('buttonShadow', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.5,
		x: 10,
		y: 10
	});
	// Create base circle
	var buttonBase = self.attachAsset('playButtonBase', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	// Create play triangle and rotate it to point right
	var playIcon = self.attachAsset('playTriangle', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 15,
		// Offset slightly to the right for better visual centering
		rotation: Math.PI / 4 // 45 degrees in radians
	});
	// Variables to track button state
	self.isPressed = false;
	self.isAnimating = false;
	// Set interactive state functions
	self.down = function (x, y, obj) {
		if (self.isAnimating) {
			return;
		}
		self.isPressed = true;
		// Shrink button when pressed
		tween(buttonBase, {
			scaleX: 0.9,
			scaleY: 0.9
		}, {
			duration: 100,
			easing: tween.easeOut
		});
		tween(playIcon, {
			scaleX: 0.9,
			scaleY: 0.9
		}, {
			duration: 100,
			easing: tween.easeOut
		});
		// Move shadow closer
		tween(shadow, {
			x: 5,
			y: 5
		}, {
			duration: 100,
			easing: tween.easeOut
		});
	};
	self.up = function (x, y, obj) {
		if (!self.isPressed || self.isAnimating) {
			return;
		}
		self.isPressed = false;
		self.isAnimating = true;
		// Play sound
		LK.getSound('buttonClick').play();
		// Return to normal size with a bounce
		tween(buttonBase, {
			scaleX: 1.1,
			scaleY: 1.1
		}, {
			duration: 200,
			easing: tween.elasticOut,
			onFinish: function onFinish() {
				tween(buttonBase, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 200,
					easing: tween.easeOut,
					onFinish: function onFinish() {
						self.isAnimating = false;
						// Trigger the "play" action
						self.triggerPlay();
					}
				});
			}
		});
		// Return play icon to normal with a bounce
		tween(playIcon, {
			scaleX: 1.1,
			scaleY: 1.1
		}, {
			duration: 200,
			easing: tween.elasticOut,
			onFinish: function onFinish() {
				tween(playIcon, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 200,
					easing: tween.easeOut
				});
			}
		});
		// Return shadow to normal position
		tween(shadow, {
			x: 10,
			y: 10
		}, {
			duration: 200,
			easing: tween.easeOut
		});
	};
	// Function called when button is clicked
	self.triggerPlay = function () {
		// Spin the button when clicked
		self.isAnimating = true;
		// Celebrate by spinning the button
		tween(self, {
			rotation: Math.PI * 2
		}, {
			duration: 1000,
			easing: tween.elasticOut,
			onFinish: function onFinish() {
				self.rotation = 0;
				self.isAnimating = false;
				// Show character selection
				showCharacterSelection();
			}
		});
	};
	// Idle animation to make the button more playful
	self.startIdleAnimation = function () {
		function pulseButton() {
			if (self.isPressed || self.isAnimating) {
				LK.setTimeout(pulseButton, 2000);
				return;
			}
			tween(buttonBase, {
				scaleX: 1.05,
				scaleY: 1.05
			}, {
				duration: 1000,
				easing: tween.easeInOut,
				onFinish: function onFinish() {
					tween(buttonBase, {
						scaleX: 1.0,
						scaleY: 1.0
					}, {
						duration: 1000,
						easing: tween.easeInOut,
						onFinish: function onFinish() {
							LK.setTimeout(pulseButton, 2000);
						}
					});
				}
			});
		}
		// Start the idle animation
		LK.setTimeout(pulseButton, 2000);
	};
	// Initial scale effect when the button appears
	buttonBase.scaleX = 0;
	buttonBase.scaleY = 0;
	playIcon.scaleX = 0;
	playIcon.scaleY = 0;
	shadow.scaleX = 0;
	shadow.scaleY = 0;
	self.appear = function () {
		tween(shadow, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 500,
			easing: tween.elasticOut
		});
		tween(buttonBase, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 700,
			easing: tween.elasticOut
		});
		tween(playIcon, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 700,
			easing: tween.elasticOut,
			onFinish: function onFinish() {
				self.startIdleAnimation();
			}
		});
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x00FF00
});

/**** 
* Game Code
****/ 
// Set the game's background color to a softer green
game.setBackgroundColor(0x66CC99);
// Game state variables
var showingCharacterSelection = false;
var selectedCharacter = null;
var boyCharacter = null;
var girlCharacter = null;
// Create the play button and center it on screen
var playButton = new PlayButton();
game.addChild(playButton);
// Position the button in the center of the screen
playButton.x = 2048 / 2;
playButton.y = 2732 / 2;
// Make the button appear with animation
playButton.appear();
// Function to show character selection screen
function showCharacterSelection() {
	if (showingCharacterSelection) {
		return;
	}
	showingCharacterSelection = true;
	// Make play button disappear
	tween(playButton, {
		alpha: 0,
		scaleX: 0,
		scaleY: 0
	}, {
		duration: 500,
		easing: tween.easeOut,
		onFinish: function onFinish() {
			// Remove play button from display
			game.removeChild(playButton);
			// Create character options
			boyCharacter = new Character();
			boyCharacter.initialize("boy");
			game.addChild(boyCharacter);
			boyCharacter.x = 2048 / 3;
			boyCharacter.y = 2732 / 2;
			girlCharacter = new Character();
			girlCharacter.initialize("girl");
			game.addChild(girlCharacter);
			girlCharacter.x = 2048 * 2 / 3;
			girlCharacter.y = 2732 / 2;
			// Make characters appear with animation
			boyCharacter.appear();
			girlCharacter.appear();
		}
	});
}
// Function called when a character is selected
function characterSelected(characterType) {
	selectedCharacter = characterType;
	console.log("Selected character: " + characterType);
	// Make the non-selected character disappear with a fun spin animation
	var nonSelectedCharacter = characterType === "boy" ? girlCharacter : boyCharacter;
	// First spin quickly
	tween(nonSelectedCharacter, {
		rotation: Math.PI * 2,
		scaleX: 0.8,
		scaleY: 0.8
	}, {
		duration: 400,
		easing: tween.easeInOut,
		onFinish: function onFinish() {
			// Then shrink away
			tween(nonSelectedCharacter, {
				alpha: 0,
				scaleX: 0,
				scaleY: 0,
				y: nonSelectedCharacter.y + 100
			}, {
				duration: 500,
				easing: tween.backIn,
				onFinish: function onFinish() {
					game.removeChild(nonSelectedCharacter);
				}
			});
		}
	});
	// Move the selected character to center with a jumping animation
	var selectedCharacterObj = characterType === "boy" ? boyCharacter : girlCharacter;
	// First jump up
	tween(selectedCharacterObj, {
		y: selectedCharacterObj.y - 100,
		scaleX: 1.2,
		scaleY: 1.2
	}, {
		duration: 300,
		easing: tween.easeOut,
		onFinish: function onFinish() {
			// Then move to center position
			tween(selectedCharacterObj, {
				x: 2048 / 2,
				y: 2732 / 2,
				scaleX: 1.5,
				scaleY: 1.5
			}, {
				duration: 700,
				easing: tween.elasticOut,
				onFinish: function onFinish() {
					// Celebrate animation
					var arms = [selectedCharacterObj.leftArm, selectedCharacterObj.rightArm];
					function armWave(index) {
						if (index >= 4) {
							// Game could start here with the selected character
							console.log("Game ready to start with character: " + characterType);
							return;
						}
						var upArm = arms[index % 2];
						var downArm = arms[(index + 1) % 2];
						// Raise one arm
						tween(upArm, {
							rotation: index % 2 === 0 ? -0.8 : 0.8
						}, {
							duration: 200,
							easing: tween.easeOut,
							onFinish: function onFinish() {
								// Lower the other
								tween(downArm, {
									rotation: index % 2 === 0 ? 0.2 : -0.2
								}, {
									duration: 200,
									easing: tween.easeOut,
									onFinish: function onFinish() {
										armWave(index + 1);
									}
								});
							}
						});
					}
					// Start the celebration wave
					armWave(0);
				}
			});
		}
	});
}
// Rainbow effect for the background
var rainbowColors = [0x66CC99, 0x66CCFF, 0xCC99FF, 0xFF99CC, 0xFFCC66, 0x99FF99];
var currentColorIndex = 0;
// A function to cycle through background colors
function cycleBackgroundColor() {
	currentColorIndex = (currentColorIndex + 1) % rainbowColors.length;
	// Animate the color change
	var targetColor = rainbowColors[currentColorIndex];
	tween(game, {
		backgroundColor: targetColor
	}, {
		duration: 2000,
		easing: tween.easeInOut,
		onFinish: function onFinish() {
			// Schedule the next color change
			LK.setTimeout(cycleBackgroundColor, 4000);
		}
	});
}
// Start the background color animation after a delay
LK.setTimeout(cycleBackgroundColor, 4000);

===================================================================
--- original.js
+++ change.js
@@ -17,27 +17,265 @@
 	// Character type (boy or girl)
 	self.type = "";
 	// Character shape will be added in initialize
 	self.shape = null;
+	// Head, body, arms, legs for more realistic character
+	self.head = null;
+	self.body = null;
+	self.leftArm = null;
+	self.rightArm = null;
+	self.leftLeg = null;
+	self.rightLeg = null;
+	// Animation properties
+	self.bounceTimer = null;
+	self.isHovered = false;
 	// Initialize with type
 	self.initialize = function (characterType) {
 		self.type = characterType;
-		// Add appropriate shape based on type
+		// Create container for character parts
+		var characterContainer = new Container();
+		self.addChild(characterContainer);
 		if (characterType === "boy") {
-			self.shape = self.attachAsset('boyCharacter', {
+			// Boy character parts - more realistic and cartoony
+			var bodyColor = 0x3498db;
+			var skinColor = 0xffcc99;
+			// Body (slightly rectangle/trapezoid)
+			self.body = new Container();
+			var bodyShape = LK.getAsset('boyCharacter', {
 				anchorX: 0.5,
-				anchorY: 0.5
+				anchorY: 0.5,
+				scaleX: 1.2,
+				scaleY: 1.3,
+				y: 20
 			});
+			bodyShape.tint = bodyColor;
+			self.body.addChild(bodyShape);
+			// Head (circle)
+			self.head = new Container();
+			var headShape = LK.getAsset('characterBase', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				scaleX: 0.6,
+				scaleY: 0.6,
+				y: -80
+			});
+			headShape.tint = skinColor;
+			self.head.addChild(headShape);
+			// Add face features
+			// Eyes
+			var leftEye = LK.getAsset('eyeShape', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				x: -25,
+				y: -15
+			});
+			var rightEye = LK.getAsset('eyeShape', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				x: 25,
+				y: -15
+			});
+			// Mouth
+			var mouth = LK.getAsset('mouthShape', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				y: 20,
+				scaleY: 0.8
+			});
+			// Add all face parts to head
+			self.head.addChild(leftEye);
+			self.head.addChild(rightEye);
+			self.head.addChild(mouth);
+			// Arms
+			self.leftArm = new Container();
+			var leftArmShape = LK.getAsset('boyCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.3,
+				scaleY: 0.8,
+				x: -70,
+				y: -30,
+				rotation: 0.2
+			});
+			leftArmShape.tint = bodyColor;
+			self.leftArm.addChild(leftArmShape);
+			self.rightArm = new Container();
+			var rightArmShape = LK.getAsset('boyCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.3,
+				scaleY: 0.8,
+				x: 70,
+				y: -30,
+				rotation: -0.2
+			});
+			rightArmShape.tint = bodyColor;
+			self.rightArm.addChild(rightArmShape);
+			// Legs
+			self.leftLeg = new Container();
+			var leftLegShape = LK.getAsset('boyCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.35,
+				scaleY: 0.9,
+				x: -40,
+				y: 80
+			});
+			leftLegShape.tint = 0x2980b9;
+			self.leftLeg.addChild(leftLegShape);
+			self.rightLeg = new Container();
+			var rightLegShape = LK.getAsset('boyCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.35,
+				scaleY: 0.9,
+				x: 40,
+				y: 80
+			});
+			rightLegShape.tint = 0x2980b9;
+			self.rightLeg.addChild(rightLegShape);
 		} else {
-			self.shape = self.attachAsset('girlCharacter', {
+			// Girl character parts - more realistic and cartoony
+			var bodyColor = 0xe84393;
+			var skinColor = 0xffe0bd;
+			// Body (slightly rectangle/trapezoid)
+			self.body = new Container();
+			var bodyShape = LK.getAsset('girlCharacter', {
 				anchorX: 0.5,
-				anchorY: 0.5
+				anchorY: 0.5,
+				scaleX: 1.0,
+				scaleY: 1.3,
+				y: 20
 			});
+			bodyShape.tint = bodyColor;
+			self.body.addChild(bodyShape);
+			// Head (circle)
+			self.head = new Container();
+			var headShape = LK.getAsset('characterBase', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				scaleX: 0.6,
+				scaleY: 0.6,
+				y: -80
+			});
+			headShape.tint = skinColor;
+			self.head.addChild(headShape);
+			// Arms
+			self.leftArm = new Container();
+			var leftArmShape = LK.getAsset('girlCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.3,
+				scaleY: 0.8,
+				x: -60,
+				y: -30,
+				rotation: 0.2
+			});
+			leftArmShape.tint = bodyColor;
+			self.leftArm.addChild(leftArmShape);
+			self.rightArm = new Container();
+			var rightArmShape = LK.getAsset('girlCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.3,
+				scaleY: 0.8,
+				x: 60,
+				y: -30,
+				rotation: -0.2
+			});
+			rightArmShape.tint = bodyColor;
+			self.rightArm.addChild(rightArmShape);
+			// Legs
+			self.leftLeg = new Container();
+			var leftLegShape = LK.getAsset('girlCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.35,
+				scaleY: 0.9,
+				x: -30,
+				y: 80
+			});
+			leftLegShape.tint = 0xd63031;
+			self.leftLeg.addChild(leftLegShape);
+			self.rightLeg = new Container();
+			var rightLegShape = LK.getAsset('girlCharacter', {
+				anchorX: 0.5,
+				anchorY: 0,
+				scaleX: 0.35,
+				scaleY: 0.9,
+				x: 30,
+				y: 80
+			});
+			rightLegShape.tint = 0xd63031;
+			self.rightLeg.addChild(rightLegShape);
 		}
+		// Add all parts to the character container
+		characterContainer.addChild(self.leftLeg);
+		characterContainer.addChild(self.rightLeg);
+		characterContainer.addChild(self.body);
+		characterContainer.addChild(self.leftArm);
+		characterContainer.addChild(self.rightArm);
+		characterContainer.addChild(self.head);
 		// Start with scale 0
 		self.scaleX = 0;
 		self.scaleY = 0;
+		// Start idle animation after initialization
+		self.startIdleAnimation();
 	};
+	// Idle animation for character
+	self.startIdleAnimation = function () {
+		function animateIdle() {
+			if (!self.isHovered) {
+				// Subtle body bob up and down
+				tween(self.body, {
+					y: self.body.y + 5
+				}, {
+					duration: 1000,
+					easing: tween.easeInOut,
+					onFinish: function onFinish() {
+						tween(self.body, {
+							y: self.body.y - 5
+						}, {
+							duration: 1000,
+							easing: tween.easeInOut,
+							onFinish: function onFinish() {
+								self.bounceTimer = LK.setTimeout(animateIdle, 100);
+							}
+						});
+					}
+				});
+				// Subtle arm swings
+				tween(self.leftArm, {
+					rotation: self.leftArm.rotation - 0.05
+				}, {
+					duration: 1000,
+					easing: tween.easeInOut
+				});
+				tween(self.rightArm, {
+					rotation: self.rightArm.rotation + 0.05
+				}, {
+					duration: 1000,
+					easing: tween.easeInOut,
+					onFinish: function onFinish() {
+						tween(self.leftArm, {
+							rotation: self.leftArm.rotation + 0.05
+						}, {
+							duration: 1000,
+							easing: tween.easeInOut
+						});
+						tween(self.rightArm, {
+							rotation: self.rightArm.rotation - 0.05
+						}, {
+							duration: 1000,
+							easing: tween.easeInOut
+						});
+					}
+				});
+			}
+		}
+		// Start the animation
+		self.bounceTimer = LK.setTimeout(animateIdle, 100);
+	};
 	// Animate character appearance
 	self.appear = function () {
 		tween(self, {
 			scaleX: 1,
@@ -45,31 +283,122 @@
 		}, {
 			duration: 500,
 			easing: tween.elasticOut
 		});
+		// Add a little jump after appearing
+		LK.setTimeout(function () {
+			tween(self, {
+				y: self.y - 30
+			}, {
+				duration: 300,
+				easing: tween.easeOut,
+				onFinish: function onFinish() {
+					tween(self, {
+						y: self.y + 30
+					}, {
+						duration: 400,
+						easing: tween.bounceOut
+					});
+				}
+			});
+		}, 600);
 	};
 	// Handle selection
 	self.down = function (x, y, obj) {
-		// Shrink when pressed
+		// Cleanup any ongoing animations
+		if (self.bounceTimer) {
+			LK.clearTimeout(self.bounceTimer);
+			self.bounceTimer = null;
+		}
+		self.isHovered = true;
+		// Squash effect - wider and shorter
 		tween(self, {
-			scaleX: 0.9,
-			scaleY: 0.9
+			scaleX: 1.1,
+			scaleY: 0.8
 		}, {
 			duration: 100,
 			easing: tween.easeOut
 		});
+		// Animation for parts
+		tween(self.head, {
+			scaleY: 0.9,
+			y: self.head.y + 10
+		}, {
+			duration: 100,
+			easing: tween.easeOut
+		});
+		// Arms up
+		tween(self.leftArm, {
+			rotation: -0.4
+		}, {
+			duration: 100,
+			easing: tween.easeOut
+		});
+		tween(self.rightArm, {
+			rotation: 0.4
+		}, {
+			duration: 100,
+			easing: tween.easeOut
+		});
 	};
 	self.up = function (x, y, obj) {
 		// Play sound
 		LK.getSound('buttonClick').play();
-		// Expand then return to normal size
+		// Stretch effect - taller and thinner
 		tween(self, {
-			scaleX: 1.1,
-			scaleY: 1.1
+			scaleX: 0.9,
+			scaleY: 1.2
 		}, {
 			duration: 200,
 			easing: tween.elasticOut,
 			onFinish: function onFinish() {
+				// Head bounce
+				tween(self.head, {
+					scaleY: 1.1,
+					y: self.head.y - 15
+				}, {
+					duration: 200,
+					easing: tween.elasticOut,
+					onFinish: function onFinish() {
+						tween(self.head, {
+							scaleY: 1.0,
+							y: self.head.y + 15
+						}, {
+							duration: 200,
+							easing: tween.easeOut
+						});
+					}
+				});
+				// Arms celebration
+				tween(self.leftArm, {
+					rotation: -0.8
+				}, {
+					duration: 200,
+					easing: tween.elasticOut,
+					onFinish: function onFinish() {
+						tween(self.leftArm, {
+							rotation: 0.2
+						}, {
+							duration: 200,
+							easing: tween.easeOut
+						});
+					}
+				});
+				tween(self.rightArm, {
+					rotation: 0.8
+				}, {
+					duration: 200,
+					easing: tween.elasticOut,
+					onFinish: function onFinish() {
+						tween(self.rightArm, {
+							rotation: -0.2
+						}, {
+							duration: 200,
+							easing: tween.easeOut
+						});
+					}
+				});
+				// Main character animation
 				tween(self, {
 					scaleX: 1.0,
 					scaleY: 1.0
 				}, {
@@ -77,8 +406,11 @@
 					easing: tween.easeOut,
 					onFinish: function onFinish() {
 						// Character selected!
 						characterSelected(self.type);
+						self.isHovered = false;
+						// Restart idle animation
+						self.startIdleAnimation();
 					}
 				});
 			}
 		});
@@ -343,31 +675,89 @@
 // Function called when a character is selected
 function characterSelected(characterType) {
 	selectedCharacter = characterType;
 	console.log("Selected character: " + characterType);
-	// Make the non-selected character disappear
+	// Make the non-selected character disappear with a fun spin animation
 	var nonSelectedCharacter = characterType === "boy" ? girlCharacter : boyCharacter;
+	// First spin quickly
 	tween(nonSelectedCharacter, {
-		alpha: 0,
-		scaleX: 0,
-		scaleY: 0
+		rotation: Math.PI * 2,
+		scaleX: 0.8,
+		scaleY: 0.8
 	}, {
-		duration: 500,
-		easing: tween.easeOut,
+		duration: 400,
+		easing: tween.easeInOut,
 		onFinish: function onFinish() {
-			game.removeChild(nonSelectedCharacter);
+			// Then shrink away
+			tween(nonSelectedCharacter, {
+				alpha: 0,
+				scaleX: 0,
+				scaleY: 0,
+				y: nonSelectedCharacter.y + 100
+			}, {
+				duration: 500,
+				easing: tween.backIn,
+				onFinish: function onFinish() {
+					game.removeChild(nonSelectedCharacter);
+				}
+			});
 		}
 	});
-	// Move the selected character to center
+	// Move the selected character to center with a jumping animation
 	var selectedCharacterObj = characterType === "boy" ? boyCharacter : girlCharacter;
+	// First jump up
 	tween(selectedCharacterObj, {
-		x: 2048 / 2
+		y: selectedCharacterObj.y - 100,
+		scaleX: 1.2,
+		scaleY: 1.2
 	}, {
-		duration: 500,
+		duration: 300,
 		easing: tween.easeOut,
 		onFinish: function onFinish() {
-			// Game could start here with the selected character
-			console.log("Game ready to start with character: " + characterType);
+			// Then move to center position
+			tween(selectedCharacterObj, {
+				x: 2048 / 2,
+				y: 2732 / 2,
+				scaleX: 1.5,
+				scaleY: 1.5
+			}, {
+				duration: 700,
+				easing: tween.elasticOut,
+				onFinish: function onFinish() {
+					// Celebrate animation
+					var arms = [selectedCharacterObj.leftArm, selectedCharacterObj.rightArm];
+					function armWave(index) {
+						if (index >= 4) {
+							// Game could start here with the selected character
+							console.log("Game ready to start with character: " + characterType);
+							return;
+						}
+						var upArm = arms[index % 2];
+						var downArm = arms[(index + 1) % 2];
+						// Raise one arm
+						tween(upArm, {
+							rotation: index % 2 === 0 ? -0.8 : 0.8
+						}, {
+							duration: 200,
+							easing: tween.easeOut,
+							onFinish: function onFinish() {
+								// Lower the other
+								tween(downArm, {
+									rotation: index % 2 === 0 ? 0.2 : -0.2
+								}, {
+									duration: 200,
+									easing: tween.easeOut,
+									onFinish: function onFinish() {
+										armWave(index + 1);
+									}
+								});
+							}
+						});
+					}
+					// Start the celebration wave
+					armWave(0);
+				}
+			});
 		}
 	});
 }
 // Rainbow effect for the background