/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1", {
	savedEggs: []
});

/**** 
* Classes
****/ 
var BrushStroke = Container.expand(function (color, size) {
	var self = Container.call(this);
	var stroke = self.attachAsset('brushStroke', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: size / 30,
		scaleY: size / 30
	});
	stroke.tint = color;
	return self;
});
var Button = Container.expand(function (label, color) {
	var self = Container.call(this);
	var background = self.attachAsset('buttonBg', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var text = new Text2(label, {
		size: 30,
		fill: 0xFFFFFF
	});
	text.anchor.set(0.5, 0.5);
	self.addChild(text);
	if (color !== undefined) {
		background.tint = color;
	}
	self.down = function () {
		tween(background, {
			scaleX: 0.9,
			scaleY: 0.9
		}, {
			duration: 100
		});
	};
	self.up = function () {
		tween(background, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 100
		});
	};
	return self;
});
var ColorButton = Container.expand(function (color) {
	var self = Container.call(this);
	var button = self.attachAsset('colorButton', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	button.tint = color;
	self.color = color;
	self.down = function () {
		tween(button, {
			scaleX: 0.9,
			scaleY: 0.9
		}, {
			duration: 100
		});
	};
	self.up = function () {
		tween(button, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 100
		});
	};
	return self;
});
var ColorPalette = Container.expand(function () {
	var self = Container.call(this);
	var background = LK.getAsset('colorPanel', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 3.6,
		// Increased from 1.2 to 3.6 (3x larger)
		scaleY: 6.9 // Increased from 3.6 to 6.9 to make panel height 1910px
	});
	self.addChild(background);
	var colorButtons = [];
	// Generate 256 color gradient palette
	var paletteColors = [];
	var buttonSize = 90; // Increased from 30 to 90 (3x larger)
	var spacing = 12; // Increased from 4 to 12 (3x larger)
	var columns = 16;
	var rows = 16;
	// Generate rainbow gradient colors for the full 256 color palette
	for (var i = 0; i < 256; i++) {
		var hue = i / 256;
		var r, g, b;
		// Convert HSV to RGB (simplified rainbow gradient)
		if (hue < 1 / 6) {
			r = 1;
			g = hue * 6;
			b = 0;
		} else if (hue < 2 / 6) {
			r = (2 / 6 - hue) * 6;
			g = 1;
			b = 0;
		} else if (hue < 3 / 6) {
			r = 0;
			g = 1;
			b = (hue - 2 / 6) * 6;
		} else if (hue < 4 / 6) {
			r = 0;
			g = (4 / 6 - hue) * 6;
			b = 1;
		} else if (hue < 5 / 6) {
			r = (hue - 4 / 6) * 6;
			b = 1;
			g = 0;
		} else {
			r = 1;
			g = 0;
			b = (1 - hue) * 6;
		}
		// Convert to 0-255 range
		var red = Math.floor(r * 255);
		var green = Math.floor(g * 255);
		var blue = Math.floor(b * 255);
		var color = red << 16 | green << 8 | blue;
		paletteColors.push(color);
	}
	for (var i = 0; i < paletteColors.length; i++) {
		var row = Math.floor(i / columns);
		var col = i % columns;
		var colorBtn = new ColorButton(paletteColors[i]);
		colorBtn.x = col * (buttonSize + spacing) - (columns - 1) * (buttonSize + spacing) / 2;
		colorBtn.y = row * (buttonSize + spacing) - (rows - 1) * (buttonSize + spacing) / 2;
		colorBtn.scaleX = 4.5; // Increased from 1.5 to 4.5 (3x larger)
		colorBtn.scaleY = 4.5; // Increased from 1.5 to 4.5 (3x larger)
		self.addChild(colorBtn);
		// Create a closure to capture the current color
		(function (color, btn) {
			btn.down = function () {
				currentColor = color;
				self.visible = false;
				// Notify the game that a color was selected
				if (self.onColorSelected) {
					self.onColorSelected(color);
				}
			};
		})(paletteColors[i], colorBtn);
		colorButtons.push(colorBtn);
	}
	// Add selector ring
	var selector = LK.getAsset('brushStroke', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 7.5,
		// Increased from 2.5 to 7.5 (3x larger)
		scaleY: 7.5 // Increased from 2.5 to 7.5 (3x larger)
	});
	selector.tint = 0xFFFFFF;
	selector.alpha = 0.7;
	self.addChild(selector);
	// Set selector initial position
	selector.x = colorButtons[0].x;
	selector.y = colorButtons[0].y;
	// Hide palette initially
	self.visible = false;
	// Method to update selector position
	self.updateSelector = function (color) {
		for (var i = 0; i < paletteColors.length; i++) {
			if (paletteColors[i] === color) {
				selector.x = colorButtons[i].x;
				selector.y = colorButtons[i].y;
				break;
			}
		}
	};
	return self;
});
var CompletedEgg = Container.expand(function (baseColor) {
	var self = Container.call(this);
	var eggGraphic = self.attachAsset('completedEgg', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	eggGraphic.tint = baseColor || 0xFFFFFF;
	// Add some random decoration to make each egg look unique
	for (var i = 0; i < 5; i++) {
		var glitter = self.attachAsset('glitter', {
			anchorX: 0.5,
			anchorY: 0.5,
			x: (Math.random() - 0.5) * 80,
			y: (Math.random() - 0.5) * 120
		});
		glitter.tint = 0xFFD700 + Math.floor(Math.random() * 0x555555);
	}
	return self;
});
var EasterEgg = Container.expand(function () {
	var self = Container.call(this);
	var eggBase = self.attachAsset('eggBase', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var designContainer = new Container();
	self.designContainer = designContainer; // Make accessible outside
	self.addChild(designContainer);
	self.addDesign = function (x, y, designElement) {
		var localPosition = designContainer.toLocal({
			x: x,
			y: y
		}, game);
		designElement.x = localPosition.x;
		designElement.y = localPosition.y;
		designContainer.addChild(designElement);
	};
	self.clearDesigns = function () {
		while (designContainer.children.length > 0) {
			designContainer.removeChild(designContainer.children[0]);
		}
	};
	self.rotate = function (angle) {
		eggBase.rotation += angle;
		designContainer.rotation += angle;
	};
	self.captureDesign = function () {
		// In a real implementation, this would create a snapshot of the egg
		// For this simplified version, we just create a new completed egg with the same tint
		var completedEgg = new CompletedEgg(eggBase.tint);
		return completedEgg;
	};
	return self;
});
var Sticker = Container.expand(function (type, scale) {
	var self = Container.call(this);
	var stickerAsset;
	if (type === 'star') {
		stickerAsset = self.attachAsset('stickerStar', {
			anchorX: 0.5,
			anchorY: 0.5,
			scaleX: scale,
			scaleY: scale
		});
	} else if (type === 'heart') {
		stickerAsset = self.attachAsset('stickerHeart', {
			anchorX: 0.5,
			anchorY: 0.5,
			scaleX: scale,
			scaleY: scale
		});
	}
	self.down = function () {
		tween(stickerAsset, {
			scaleX: scale * 0.9,
			scaleY: scale * 0.9
		}, {
			duration: 100
		});
	};
	self.up = function () {
		tween(stickerAsset, {
			scaleX: scale,
			scaleY: scale
		}, {
			duration: 100
		});
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0xAFEEEE // Light turquoise background color
});

/**** 
* Game Code
****/ 
// Define color palette - arranged in rainbow gradient
var colors = [
// Black (left)
0x000000,
// Violet group
0x9400D3,
// Violet
0x4B0082,
// Indigo
0x8A2BE2,
// Blue Violet
// Blue group
0x0000FF,
// Blue
0x000080,
// Navy Blue
0x00FFFF,
// Cyan
0x008080,
// Teal
// Green group
0x00FF00,
// Green  
0x32CD32,
// Lime Green
0x808000,
// Olive
// Red group
0x800000,
// Maroon
0xA52A2A,
// Brown
0xFF0000,
// Red
0xFF7F00,
// Orange
// Yellow group
0xFFD700,
// Gold
0xFFFF00,
// Yellow
// Pink group
0xFF69B4,
// Hot Pink
// Gray
0x808080,
// White (right)
0xFFFFFF];
// Define brush sizes
var brushSizes = [10, 20, 30];
// Initialize game variables
var currentColor = colors[0];
var currentBrushSize = brushSizes[1];
var currentEraserSize = 50;
var currentTool = 'brush';
var isPainting = false;
var lastX, lastY;
var selectedColorButton = null;
// Ensure savedEggs is properly initialized in storage
var savedEggs = [];
if (storage.savedEggs && Array.isArray(storage.savedEggs)) {
	savedEggs = storage.savedEggs;
} else {
	storage.savedEggs = [];
}
// Create main egg
var easterEgg = new EasterEgg();
easterEgg.x = 2048 / 2;
easterEgg.y = 2732 / 2 - 200;
game.addChild(easterEgg);
// Create UI components
// Tool panel
var toolPanel = LK.getAsset('toolPanel', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 - 5,
	y: 2732 - 100 // Moved up by 20 units
});
game.addChild(toolPanel);
// Color panel
var colorPanel = LK.getAsset('colorPanel', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 - 345 // Moved down by 5 units
});
game.addChild(colorPanel);
// Add color buttons
var colorButtons = [];
for (var i = 0; i < colors.length; i++) {
	var colorButton = new ColorButton(colors[i]);
	// Position in two rows (10 in first row, 10 in second row)
	if (i < 10) {
		// First row
		colorButton.x = i * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units
		colorButton.y = 2732 - 410; // First row - moved up by 10 units
	} else {
		// Second row
		colorButton.x = (i - 10) * 130 + 160; // Changed spacing from 145 to 130, moved left by 10 units
		colorButton.y = 2732 - 280; // Second row
	}
	game.addChild(colorButton);
	colorButtons.push(colorButton);
	// Scale up by 2x
	tween(colorButton, {
		scaleX: 2,
		scaleY: 2
	}, {
		duration: 300
	});
	// Add click handler
	(function (color, button) {
		colorButton.down = function () {
			tween(colorButton, {
				scaleX: 1.8,
				scaleY: 1.8
			}, {
				duration: 100
			});
			currentColor = color;
		};
		colorButton.up = function () {
			tween(colorButton, {
				scaleX: 2,
				scaleY: 2
			}, {
				duration: 100
			});
			// Stop any animations on previously selected button
			if (selectedColorButton) {
				tween.stop(selectedColorButton);
				tween(selectedColorButton, {
					scaleX: 2,
					scaleY: 2
				}, {
					duration: 100
				});
			}
			// Set new selected button
			selectedColorButton = button;
			// Start pulsing animation
			function pulseButton() {
				tween(selectedColorButton, {
					scaleX: 2.2,
					scaleY: 2.2
				}, {
					duration: 500,
					easing: tween.easeInOut,
					onFinish: function onFinish() {
						tween(selectedColorButton, {
							scaleX: 1.8,
							scaleY: 1.8
						}, {
							duration: 500,
							easing: tween.easeInOut,
							onFinish: pulseButton
						});
					}
				});
			}
			// Start the pulsing animation
			pulseButton();
		};
	})(colors[i], colorButton);
}
// Create tool buttons
// Calculate button width including scale factor
var buttonWidth = 120 * 2; // 120px width * 2 scale
var buttonSpacing = 25; // 25 units apart
var startX = 300; // Starting X position
// Create tool buttons
var brushButton = new Button("Brush", 0x6495ED);
brushButton.x = startX - 75; // Moved left by 25 more units
brushButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(brushButton);
tween(brushButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
brushButton.down = function () {
	tween(brushButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
brushButton.up = function () {
	tween(brushButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	currentTool = 'brush';
};
var stickerStarButton = new Button("Star", 0xFFD700);
stickerStarButton.x = startX + (buttonWidth + buttonSpacing) * 1 - 75; // Moved left by 25 more units
stickerStarButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(stickerStarButton);
tween(stickerStarButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
stickerStarButton.down = function () {
	tween(stickerStarButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
stickerStarButton.up = function () {
	tween(stickerStarButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	currentTool = 'star';
};
var stickerHeartButton = new Button("Heart", 0xFF0000);
stickerHeartButton.x = startX + (buttonWidth + buttonSpacing) * 2 - 75; // Moved left by 25 more units
stickerHeartButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(stickerHeartButton);
tween(stickerHeartButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
stickerHeartButton.down = function () {
	tween(stickerHeartButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
stickerHeartButton.up = function () {
	tween(stickerHeartButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	currentTool = 'heart';
};
var rotateLeftButton = new Button("< Rotate", 0x9370DB);
rotateLeftButton.x = startX + (buttonWidth + buttonSpacing) * 3 - 75; // Moved left by 25 more units
rotateLeftButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(rotateLeftButton);
tween(rotateLeftButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
rotateLeftButton.down = function () {
	tween(rotateLeftButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
rotateLeftButton.up = function () {
	tween(rotateLeftButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	easterEgg.rotate(-Math.PI / 8);
};
// Add a thin grey vertical divider between rotate buttons
var divider = LK.getAsset('buttonBg', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: startX + (buttonWidth + buttonSpacing) * 3.5 - 75,
	// Position between the two rotate buttons
	y: 2732 - 100,
	// Same Y as buttons
	scaleX: 0.05,
	// Make it thin
	scaleY: 2 // Same height as buttons
});
divider.tint = 0xe6e6fa; // Light lavender color
game.addChild(divider);
var rotateRightButton = new Button("Rotate >", 0x9370DB);
rotateRightButton.x = startX + (buttonWidth + buttonSpacing) * 4 - 75; // Moved left by 25 more units
rotateRightButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(rotateRightButton);
tween(rotateRightButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
rotateRightButton.down = function () {
	tween(rotateRightButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
rotateRightButton.up = function () {
	tween(rotateRightButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	easterEgg.rotate(Math.PI / 8);
};
var saveButton = new Button("Save", 0x32CD32);
saveButton.x = startX + (buttonWidth + buttonSpacing) * 5 - 75; // Moved left by 25 more units
saveButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(saveButton);
tween(saveButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
saveButton.down = function () {
	tween(saveButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
saveButton.up = function () {
	tween(saveButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	// Save the current egg design
	var completedEgg = easterEgg.captureDesign();
	// Add to saved eggs
	var newEggData = {
		x: 150 + savedEggs.length % 4 * 180,
		y: 2732 - 600 - Math.floor(savedEggs.length / 4) * 220,
		color: currentColor
	};
	// Ensure savedEggs is properly initialized as an array
	if (!Array.isArray(savedEggs)) {
		savedEggs = [];
	}
	// Add the new egg data to our array
	savedEggs.push(newEggData);
	// Update storage with a copy of the array
	storage.savedEggs = savedEggs.slice();
	// Play save sound
	LK.getSound('saveSound').play();
	// Add the egg to the basket display
	displaySavedEggs();
	// Increment score
	LK.setScore(LK.getScore() + 1);
	// Clear the current egg for a new design
	easterEgg.clearDesigns();
};
var eraserButton = new Button("Eraser", 0x808080);
eraserButton.x = colorPanel.x + colorPanel.width / 2 - 245; // Moved left
eraserButton.y = colorPanel.y - colorPanel.height / 2 + 85; // Moved down by 25 units
game.addChild(eraserButton);
tween(eraserButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
eraserButton.down = function () {
	tween(eraserButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
eraserButton.up = function () {
	tween(eraserButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	currentTool = 'eraser';
};
// Add color palette button
var allColorButton = new Button("All Colors", 0x9370DB);
allColorButton.x = colorPanel.x + colorPanel.width / 2 - 100; // Position it
allColorButton.y = colorPanel.y - colorPanel.height / 2 + 85; // Same y as eraser
game.addChild(allColorButton);
tween(allColorButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
allColorButton.down = function () {
	tween(allColorButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
allColorButton.up = function () {
	tween(allColorButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	// Toggle the full color palette
	colorPalette.visible = !colorPalette.visible;
	// Update selector position to match current selected color
	if (colorPalette.visible) {
		colorPalette.updateSelector(currentColor);
	}
};
var clearButton = new Button("Clear", 0xFF6347);
clearButton.x = startX + (buttonWidth + buttonSpacing) * 6 - 75; // Moved next to save button
clearButton.y = 2732 - 100; // Moved up by 20 units
game.addChild(clearButton);
tween(clearButton, {
	scaleX: 2.2,
	scaleY: 2
}, {
	duration: 300
});
clearButton.down = function () {
	tween(clearButton, {
		scaleX: 1.98,
		scaleY: 1.8
	}, {
		duration: 100
	});
};
clearButton.up = function () {
	tween(clearButton, {
		scaleX: 2.2,
		scaleY: 2
	}, {
		duration: 100
	});
	easterEgg.clearDesigns();
	LK.getSound('clearSound').play();
};
// Function to toggle eraser tool
function toggleEraserThicknessSlider(visible) {
	// Set eraser as current tool when enabled
	if (visible) {
		currentTool = 'eraser';
	}
}
// Create basket display
var basket = LK.getAsset('basket', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 - 800 // Moved up by 60 units to make room for two rows of color buttons
});
game.addChild(basket);
// Title text
var titleText = new Text2("Easter Egg Artist", {
	size: 100,
	fill: 0x8B4513 // Dark brown
});
titleText.anchor.set(0.5, 0);
titleText.x = 2048 / 2;
titleText.y = 50;
game.addChild(titleText);
// Score display
var scoreText = new Text2("Eggs: 0", {
	size: 60,
	fill: 0x4B0082 // Indigo
});
scoreText.anchor.set(0, 0);
scoreText.x = 120;
scoreText.y = 120;
game.addChild(scoreText);
// Function to display saved eggs
function displaySavedEggs() {
	// Remove any existing displayed eggs
	for (var i = game.children.length - 1; i >= 0; i--) {
		if (game.children[i].isCompletedEgg) {
			game.removeChild(game.children[i]);
		}
	}
	// Display saved eggs
	for (var i = 0; i < savedEggs.length; i++) {
		var eggData = savedEggs[i];
		var displayedEgg = new CompletedEgg(eggData.color);
		displayedEgg.x = eggData.x;
		displayedEgg.y = eggData.y;
		displayedEgg.isCompletedEgg = true;
		game.addChild(displayedEgg);
	}
}
// Display any saved eggs
displaySavedEggs();
// Game event handlers
game.down = function (x, y) {
	if (y < 2732 - 350) {
		isPainting = true;
		lastX = x;
		lastY = y;
		if (currentTool === 'brush') {
			var brushStroke = new BrushStroke(currentColor, currentBrushSize);
			easterEgg.addDesign(x, y, brushStroke);
			LK.getSound('brushSound').play();
		} else if (currentTool === 'star' || currentTool === 'heart') {
			var sticker = new Sticker(currentTool, 1.2);
			easterEgg.addDesign(x, y, sticker);
			LK.getSound('stickerSound').play();
		} else if (currentTool === 'eraser') {
			// Remove the last design element
			if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
				easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
				LK.getSound('brushSound').play(); // Play sound for eraser too
			}
		}
	}
};
game.move = function (x, y) {
	if (isPainting && (currentTool === 'brush' || currentTool === 'eraser')) {
		// Calculate distance between last point and current point
		var dx = x - lastX;
		var dy = y - lastY;
		var distance = Math.sqrt(dx * dx + dy * dy);
		// Get current size based on tool
		var currentSize = currentTool === 'brush' ? currentBrushSize : currentEraserSize;
		// Get current color based on tool
		var strokeColor = currentTool === 'brush' ? currentColor : 0xFFFFFF;
		// Get alpha based on tool (0 for eraser to make it invisible)
		var strokeAlpha = currentTool === 'brush' ? 1 : 0;
		// Play brush sound occasionally while using eraser
		if (currentTool === 'eraser' && Math.random() < 0.05) {
			LK.getSound('brushSound').play();
		}
		// If distance is greater than half the size, add intermediate points
		if (distance > currentSize / 2) {
			var steps = Math.ceil(distance / (currentSize / 2));
			for (var i = 1; i <= steps; i++) {
				var pointX = lastX + dx * i / steps;
				var pointY = lastY + dy * i / steps;
				if (currentTool === 'eraser') {
					// For eraser, remove the last design element
					if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
						easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
					}
				} else {
					var stroke = new BrushStroke(strokeColor, currentSize);
					stroke.alpha = strokeAlpha;
					easterEgg.addDesign(pointX, pointY, stroke);
				}
			}
		} else {
			if (currentTool === 'eraser') {
				// For eraser, remove the last design element
				if (easterEgg.designContainer && easterEgg.designContainer.children.length > 0) {
					easterEgg.designContainer.removeChild(easterEgg.designContainer.children[easterEgg.designContainer.children.length - 1]);
				}
			} else {
				var stroke = new BrushStroke(strokeColor, currentSize);
				stroke.alpha = strokeAlpha;
				easterEgg.addDesign(x, y, stroke);
			}
		}
		lastX = x;
		lastY = y;
	}
};
game.up = function () {
	isPainting = false;
};
// Update function
game.update = function () {
	// Update score display
	scoreText.setText("Eggs: " + LK.getScore());
};
// Create and add the full color palette
var colorPalette = new ColorPalette();
colorPalette.x = 2048 / 2;
colorPalette.y = 2732 / 2 - 200; // Position at center, aligned with the egg
game.addChild(colorPalette);
// Set up color selection callback
colorPalette.onColorSelected = function (color) {
	currentColor = color;
	// Stop any animations on previously selected button
	if (selectedColorButton) {
		tween.stop(selectedColorButton);
		tween(selectedColorButton, {
			scaleX: 2,
			scaleY: 2
		}, {
			duration: 100
		});
	}
	// Find button with matching color and set as selected
	var _loop = function _loop() {
		if (colorButtons[i].color === color) {
			var _pulseSelectedButton2 = function pulseSelectedButton() {
				tween(selectedColorButton, {
					scaleX: 2.2,
					scaleY: 2.2
				}, {
					duration: 500,
					easing: tween.easeInOut,
					onFinish: function onFinish() {
						tween(selectedColorButton, {
							scaleX: 1.8,
							scaleY: 1.8
						}, {
							duration: 500,
							easing: tween.easeInOut,
							onFinish: _pulseSelectedButton2
						});
					}
				});
			}; // Start the pulsing animation
			selectedColorButton = colorButtons[i];
			// Start pulsing animation
			_pulseSelectedButton2();
			return 1; // break
		}
	};
	for (var i = 0; i < colorButtons.length; i++) {
		if (_loop()) {
			break;
		}
	}
};
// Start background music
LK.playMusic('easterMusic', {
	fade: {
		start: 0,
		end: 0.2,
		duration: 1000
	}
});
// Initialize first color button as selected with animation
if (colorButtons.length > 0) {
	var _pulseSelectedButton = function pulseSelectedButton() {
		tween(selectedColorButton, {
			scaleX: 2.2,
			scaleY: 2.2
		}, {
			duration: 500,
			easing: tween.easeInOut,
			onFinish: function onFinish() {
				tween(selectedColorButton, {
					scaleX: 1.8,
					scaleY: 1.8
				}, {
					duration: 500,
					easing: tween.easeInOut,
					onFinish: _pulseSelectedButton
				});
			}
		});
	}; // Start the initial pulsing animation
	selectedColorButton = colorButtons[0];
	// Start pulsing animation for first color button
	_pulseSelectedButton();
}

===================================================================
--- original.js
+++ change.js
@@ -83,11 +83,11 @@
 	var self = Container.call(this);
 	var background = LK.getAsset('colorPanel', {
 		anchorX: 0.5,
 		anchorY: 0.5,
-		scaleX: 1881 / 1880,
-		// Setting exact width of 1881
-		scaleY: 1919 / 277 // Setting exact height of 1919
+		scaleX: 3.6,
+		// Increased from 1.2 to 3.6 (3x larger)
+		scaleY: 6.9 // Increased from 3.6 to 6.9 to make panel height 1910px
 	});
 	self.addChild(background);
 	var colorButtons = [];
 	// Generate 256 color gradient palette