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

/**** 
* Classes
****/ 
var BettingBoard = Container.expand(function () {
	var self = Container.call(this);
	var redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
	var boxes = [];
	var bets = [];
	// Create the betting grid (3 rows x 12 columns for individual numbers)
	for (var row = 0; row < 3; row++) {
		for (var col = 0; col < 12; col++) {
			var numberValue = 3 - row + col * 3;
			var frame = self.attachAsset('betBoxFrame', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: col * 130 + 160,
				y: row * 130 + 200,
				scaleX: 1.05,
				scaleY: 1.05
			});
			var box = self.attachAsset('betBox', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: col * 130 + 160,
				y: row * 130 + 200
			});
			// Change box color to red if the number is a red number
			if (redNumbers.indexOf(numberValue) !== -1) {
				box.tint = 0xE74C3C;
			} else {
				// Change box color to black if the number is a black number
				box.tint = 0x1a1a1a;
			}
			var numberText = new Text2(numberValue.toString(), {
				size: 55,
				// Increased size from 50 to 55
				fill: numberValue === 0 ? 0xFFFFFF : redNumbers.indexOf(numberValue) !== -1 ? 0xFFFFFF : 0xFFFFFF,
				fontWeight: 'bold' // Make the text thicker 
			});
			numberText.anchor.set(0.5, 0.5);
			numberText.x = box.x;
			numberText.y = box.y;
			self.addChild(numberText);
			// Store box info for bet placement
			boxes.push({
				box: box,
				value: numberValue,
				type: "number",
				x: box.x,
				y: box.y
			});
			// Add event handling for this box
			box.interactive = true;
			box.down = function (boxInfo) {
				return function () {
					if (self.onBetPlaced) {
						self.onBetPlaced(boxInfo);
					}
				};
			}(boxes[boxes.length - 1]);
		}
	}
	// Create 0 box
	var zeroFrame = self.attachAsset('betBoxFrame', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 160 - 130 - 3,
		y: 130 + 200,
		scaleX: 1.05,
		scaleY: 3.23
	});
	var zeroBox = self.attachAsset('betBox', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 160 - 130 - 3,
		y: 130 + 200,
		tint: 0x2ECC71,
		// Green for zero
		scaleY: 3.11 // Increase height by scaling Y-axis
	});
	var zeroText = new Text2("0", {
		size: 60,
		//{A} - Increased size from 50 to 60
		fill: 0xFFFFFF,
		fontWeight: 'bold' // Make the text thicker
	});
	zeroText.anchor.set(0.5, 0.5);
	zeroText.x = zeroBox.x;
	zeroText.y = zeroBox.y;
	self.addChild(zeroText);
	boxes.push({
		box: zeroBox,
		value: 0,
		type: "number",
		x: zeroBox.x,
		y: zeroBox.y
	});
	zeroBox.interactive = true;
	zeroBox.down = function () {
		if (self.onBetPlaced) {
			self.onBetPlaced({
				box: zeroBox,
				value: 0,
				type: "number",
				x: zeroBox.x,
				y: zeroBox.y
			});
		}
	};
	// Create outside bets (red/black, odd/even, etc.)
	var outsideBets = [{
		label: "1 to 18",
		value: "low",
		x: 1 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "EVEN",
		value: "even",
		x: 3 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "RED",
		value: "red",
		tint: 0xE74C3C,
		x: 5 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "BLACK",
		value: "black",
		tint: 0x1a1a1a,
		x: 7 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "ODD",
		value: "odd",
		x: 9 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "19 to 36",
		value: "high",
		x: 11 * 130 - 70 + 65,
		y: 3 * 130,
		width: 130 * 1.93 // Make wider by increasing width by 1.93x scale
	}, {
		label: "1st 12",
		value: "first12",
		x: 1 * 130 + 125,
		y: 3 * 130 - 520,
		width: 4 * 130 / 2 * 1.97 // Make wider by increasing width by 1.97x scale
	}, {
		label: "2nd 12",
		value: "second12",
		x: 5 * 130 + 125,
		y: 3 * 130 - 520,
		width: 4 * 130 / 2 * 1.97 // Make wider by increasing width by 1.97x scale
	}, {
		label: "3rd 12",
		value: "third12",
		x: 9 * 130 + 125,
		y: 3 * 130 - 520,
		width: 4 * 130 / 2 * 1.97 // Make wider by increasing width by 1.97x scale
	}, {
		label: "2 to 1",
		value: "twoToOne1",
		x: 12 * 130 + 65,
		y: 2 * 130 + 200 - 200,
		width: 130 // Standard width
	}, {
		label: "2 to 1",
		value: "twoToOne2",
		x: 12 * 130 + 65,
		y: 1 * 130 + 200 - 200,
		width: 130 // Standard width
	}, {
		label: "2 to 1",
		value: "twoToOne3",
		x: 12 * 130 + 65,
		y: 0 * 130 + 200 - 200,
		width: 130 // Standard width
	}];
	outsideBets.forEach(function (betInfo) {
		var scaleMultiplier = (betInfo.width || 120) / 120;
		var frame = self.attachAsset('betBoxFrame', {
			anchorX: 0.5,
			anchorY: 0.5,
			x: betInfo.x + 100,
			y: betInfo.y + 200,
			scaleX: scaleMultiplier * 1.05,
			scaleY: 1.05
		});
		var box = self.attachAsset('betBox', {
			anchorX: 0.5,
			anchorY: 0.5,
			x: betInfo.x + 100,
			y: betInfo.y + 200,
			width: betInfo.width || 120 // Default width if not specified
		});
		if (betInfo.tint) {
			box.tint = betInfo.tint;
		} else if (betInfo.value === "first12" || betInfo.value === "second12" || betInfo.value === "third12" || betInfo.value === "low" || betInfo.value === "even" || betInfo.value === "odd" || betInfo.value === "high" || betInfo.value === "twoToOne1" || betInfo.value === "twoToOne2" || betInfo.value === "twoToOne3") {
			box.alpha = 0;
		}
		var textSize = betInfo.value === "first12" || betInfo.value === "second12" || betInfo.value === "third12" ? 45 : betInfo.value.startsWith("twoToOne") ? 25 : 30;
		var text = new Text2(betInfo.label, {
			size: textSize * 2,
			// Increase text size by 2x
			fill: 0xFFFFFF,
			fontWeight: 'normal' // Make the text thinner
		});
		text.anchor.set(0.5, 0.5);
		text.x = box.x;
		text.y = box.y;
		self.addChild(text);
		boxes.push({
			box: box,
			value: betInfo.value,
			type: "outside",
			x: box.x,
			y: box.y
		});
		box.interactive = true;
		box.down = function (boxInfo) {
			return function () {
				if (self.onBetPlaced) {
					self.onBetPlaced(boxInfo);
				}
			};
		}(boxes[boxes.length - 1]);
	});
	// Place a bet
	self.placeBet = function (boxInfo, betAmount, chipType) {
		// Create chip
		var chip = LK.getAsset(chipType, {
			anchorX: 0.5,
			anchorY: 0.5,
			x: boxInfo.x,
			y: boxInfo.y
		});
		// Add text for bet amount
		var amountText = new Text2(betAmount.toString(), {
			size: 30,
			fill: chipType === 'chip1000' ? 0x000000 : 0xFFFFFF
		});
		amountText.anchor.set(0.5, 0.5);
		amountText.x = chip.x;
		amountText.y = chip.y;
		self.addChild(chip);
		self.addChild(amountText);
		// Store bet information
		bets.push({
			box: boxInfo,
			amount: betAmount,
			chip: chip,
			text: amountText
		});
		// Play chip sound
		LK.getSound('chipPlace').play();
		return bets[bets.length - 1];
	};
	// Clear all bets
	self.clearBets = function () {
		bets.forEach(function (bet) {
			bet.chip.destroy();
			bet.text.destroy();
		});
		bets = [];
	};
	// Get all current bets
	self.getBets = function () {
		return bets;
	};
	return self;
});
var Chip = Container.expand(function (type, value) {
	var self = Container.call(this);
	var chipType = type || 'chipRed';
	var chipValue = value || 5;
	var chipGraphics = self.attachAsset(chipType, {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 2,
		scaleY: 2
	});
	var valueText = new Text2(chipValue.toString(), {
		size: 60,
		fill: chipValue === 50 ? 0x000000 : 0xFFFFFF
	});
	valueText.anchor.set(0.5, 0.5);
	self.addChild(valueText);
	self.getValue = function () {
		return chipValue;
	};
	self.getType = function () {
		return chipType;
	};
	return self;
});
var RouletteWheel = Container.expand(function () {
	var self = Container.call(this);
	// Create wheel elements
	var wheelBorder = self.attachAsset('wheelBorder', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 1.2,
		scaleY: 1.2
	});
	var wheelBase = self.attachAsset('wheel', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 1.2,
		scaleY: 1.2
	});
	var numbers = [];
	var numberValues = [0, 32, 15, 19, 4, 21, 2, 25, 17, 34, 6, 27, 13, 36, 11, 30, 8, 23, 10, 5, 24, 16, 33, 1, 20, 14, 31, 9, 22, 18, 29, 7, 28, 12, 35, 3, 26];
	var numberColors = [];
	// Create number pockets
	for (var i = 0; i < numberValues.length; i++) {
		var angle = i * (2 * Math.PI / numberValues.length);
		var distance = 650; // Distance from center
		var numberCircle = LK.getAsset('number', {
			anchorX: 0.5,
			anchorY: 0.5,
			scaleX: 0.9,
			scaleY: 0.9
		});
		// Set position based on angle and distance
		numberCircle.x = Math.cos(angle) * distance;
		numberCircle.y = Math.sin(angle) * distance;
		// Set color (0 is green, others alternate red and black)
		var color;
		if (numberValues[i] === 0) {
			color = 0x2ECC71; // Green for 0
		} else {
			// Standard roulette has specific red/black pattern, not strict alternating
			// This is a simplified version
			var redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
			if (redNumbers.indexOf(numberValues[i]) !== -1) {
				color = 0xE74C3C; // Red
			} else {
				color = 0x1a1a1a; // Black
			}
		}
		numberCircle.tint = color;
		numberColors[numberValues[i]] = color;
		var numberText = new Text2(numberValues[i].toString(), {
			size: 50,
			fill: 0xFFFFFF
		});
		numberText.anchor.set(0.5, 0.5);
		numberText.x = numberCircle.x;
		numberText.y = numberCircle.y;
		numberText.rotation = angle + Math.PI / 2; // Rotate to face the center
		self.addChild(numberCircle);
		self.addChild(numberText);
		numbers.push({
			value: numberValues[i],
			angle: angle,
			color: color
		});
	}
	// Add ball
	var ball = self.attachAsset('ball', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	ball.visible = false;
	self.ball = ball;
	// Spin the wheel continuously
	self.update = function () {
		self.rotation += 0.01; // Adjust the speed as needed
	};
	// Spin the wheel and determine outcome
	self.spin = function (onComplete) {
		// Hide ball initially
		ball.visible = true;
		ball.x = 0;
		ball.y = 0;
		// Set initial rotation values
		self.rotation = 0;
		// Determine the winning number (random)
		var winningIndex = Math.floor(Math.random() * numbers.length);
		var winningNumber = numbers[winningIndex];
		// Play spin sound
		LK.getSound('spin').play();
		// Spin wheel
		var spinRotations = 5 + Math.random() * 3; // Between 5-8 rotations
		var spinDuration = 5000 + Math.random() * 2000; // Between 5-7 seconds
		// Calculate end rotation to ensure the winning number lands at the top
		// We subtract from 0 (top) the angle of the winning pocket (and add some full rotations)
		var endRotation = 2 * Math.PI * spinRotations - winningNumber.angle;
		// Animate wheel rotation
		tween(self, {
			rotation: endRotation
		}, {
			duration: spinDuration,
			easing: tween.easeOutQuad
		});
		// Animate ball movement
		tween(ball, {
			x: 0,
			y: -250
		}, {
			duration: spinDuration * 0.3,
			easing: tween.easeOutQuad
		});
		// Ball falls into pocket gradually
		LK.setTimeout(function () {
			// Delay the ball drop sound by 1 second after the spin starts
			LK.setTimeout(function () {
				LK.getSound('ballDrop').play();
			}, 1000);
			// Move ball to the winning pocket
			var targetX = Math.cos(winningNumber.angle) * 650;
			var targetY = Math.sin(winningNumber.angle) * 650;
			tween(ball, {
				x: targetX,
				y: targetY
			}, {
				duration: spinDuration * 0.4,
				easing: tween.bounceOut,
				onFinish: function onFinish() {
					if (onComplete) {
						onComplete(winningNumber.value);
					}
				}
			});
		}, spinDuration * 0.6);
		return winningNumber.value;
	};
	// Helper method to get color of a specific number
	self.getNumberColor = function (number) {
		return numberColors[number] || 0xFFFFFF;
	};
	return self;
});

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

/**** 
* Game Code
****/ 
// Create 'Last numbers:' counter
var lastNumbers = [];
var lastNumbersText = new Text2("Last numbers:", {
	size: 40,
	fill: 0xFFFFFF
});
lastNumbersText.anchor.set(0, 0);
lastNumbersText.x = 50;
lastNumbersText.y = 200 - 777 - 200;
LK.gui.left.addChild(lastNumbersText);
var lastNumbersDisplay = [];
for (var i = 0; i < 18; i++) {
	var numberText = new Text2("", {
		size: 40,
		fill: 0xFFFFFF
	});
	numberText.anchor.set(0, 0);
	numberText.x = 50;
	numberText.y = 250 + i * 50 - 777 - 200;
	LK.gui.left.addChild(numberText);
	lastNumbersDisplay.push(numberText);
}
// Clear last numbers at the start of each game load
function clearLastNumbers() {
	lastNumbers = [];
	lastNumbersDisplay.forEach(function (text) {
		text.setText("");
	});
}
clearLastNumbers();
// Create UI elements
var balance = storage.balance || 1000;
var currentBet = 0;
var selectedChipValue = 5;
var isSpinning = false;
var bettingEnabled = true;
var placedBets = [];
// Create the roulette wheel
var wheel = new RouletteWheel();
wheel.x = 2048 / 2;
wheel.y = 2732 / 2 - 400;
wheel.scale.set(0.6);
game.addChild(wheel);
// Create betting board
var bettingBoard = new BettingBoard();
bettingBoard.x = 2048 / 2 - bettingBoard.width / 2 + 40; // Center the board horizontally
bettingBoard.y = wheel.y + 680; // Position below the wheel
game.addChild(bettingBoard);
// Create UI elements
// Balance display
var balanceText = new Text2("Balance: $" + balance, {
	size: 60,
	fill: 0xFFFFFF
});
balanceText.anchor.set(0.5, 0);
LK.gui.top.addChild(balanceText);
// Current bet display
var betText = new Text2("Current Bet: $0", {
	size: 60,
	fill: 0xFFFFFF
});
betText.anchor.set(0.5, 0);
betText.x = 0; // Center horizontally
betText.y = balanceText.height + 10;
LK.gui.top.addChild(betText);
// Result display
var resultText = new Text2("", {
	size: 80,
	fill: 0xFFFFFF
});
resultText.anchor.set(0.5, 0.5);
resultText.y -= 700; // Move result title up by 700 units
LK.gui.center.addChild(resultText);
// Create chip selection
var chipTypes = [{
	type: 'chipBlack',
	value: 5,
	x: 150
}, {
	type: 'chipRed',
	value: 25,
	x: 350
}, {
	type: 'chipGreen',
	value: 50,
	x: 550
}, {
	type: 'chipBlue',
	value: 100,
	x: 750
}, {
	type: 'chip1000',
	value: 1000,
	x: 950
}];
var chipContainer = new Container();
chipContainer.y = 2732 - 150;
game.addChild(chipContainer);
chipTypes.forEach(function (chipInfo) {
	var chip = new Chip(chipInfo.type, chipInfo.value);
	chip.x = chipInfo.x;
	chip.interactive = true;
	chip.down = function () {
		if (bettingEnabled) {
			selectedChipValue = chipInfo.value;
			highlightSelectedChip();
		}
	};
	chipContainer.addChild(chip);
});
function highlightSelectedChip() {
	for (var i = 0; i < chipContainer.children.length; i++) {
		var chip = chipContainer.children[i];
		if (chip.getValue && chip.getValue() === selectedChipValue) {
			tween(chip, {
				y: -40
			}, {
				duration: 200
			});
		} else {
			tween(chip, {
				y: 0
			}, {
				duration: 200
			});
		}
	}
}
// Initially highlight the first chip
highlightSelectedChip();
// Create action buttons
var spinButton = LK.getAsset('button', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 - 300,
	y: 2732 - 150,
	scaleX: 1.3,
	// Adjust the width of the spin button to make it wider 
	scaleY: 1.8
});
game.addChild(spinButton);
var spinText = new Text2("SPIN", {
	size: 60,
	fill: 0xFFFFFF
});
spinText.anchor.set(0.5, 0.5);
spinText.x = spinButton.x;
spinText.y = spinButton.y;
game.addChild(spinText);
spinButton.interactive = true;
spinButton.down = function () {
	if (!isSpinning) {
		// Add shiny flashing effect
		tween(spinButton, {
			tint: 0xFFFF00
		}, {
			duration: 500,
			easing: tween.easeInOut,
			onFinish: function onFinish() {
				tween(spinButton, {
					tint: 0x3498db
				}, {
					duration: 500,
					easing: tween.easeInOut
				});
			}
		});
		startSpin();
	}
};
var clearButton = LK.getAsset('button', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 - 700,
	y: 2732 - 150,
	scaleX: 1.3,
	// Adjust the width of the clear button to make it wider 
	scaleY: 1.8
});
game.addChild(clearButton);
var clearText = new Text2("CLEAR", {
	size: 60,
	fill: 0xFFFFFF
});
clearText.anchor.set(0.5, 0.5);
clearText.x = clearButton.x;
clearText.y = clearButton.y;
game.addChild(clearText);
clearButton.interactive = true;
clearButton.down = function () {
	if (bettingEnabled) {
		// Add shiny flashing effect
		tween(clearButton, {
			tint: 0xFFFF00
		}, {
			duration: 500,
			easing: tween.easeInOut,
			onFinish: function onFinish() {
				tween(clearButton, {
					tint: 0x3498db
				}, {
					duration: 500,
					easing: tween.easeInOut
				});
			}
		});
		clearBets();
	}
};
// Set up betting board event handling
bettingBoard.onBetPlaced = function (boxInfo) {
	if (bettingEnabled && balance >= selectedChipValue) {
		placeBet(boxInfo);
	}
};
// Play background music
LK.playMusic('bgMusic', {
	loop: true
});
// Helper functions
function updateBalanceDisplay() {
	balanceText.setText("Balance: $" + balance);
	storage.balance = balance;
}
function updateBetDisplay() {
	betText.setText("Current Bet: $" + currentBet);
}
function placeBet(boxInfo) {
	var chipType;
	// Determine chip type based on the value
	if (selectedChipValue === 5) {
		chipType = 'chipBlack';
	} else if (selectedChipValue === 25) {
		chipType = 'chipRed';
	} else if (selectedChipValue === 50) {
		chipType = 'chipGreen';
	} else if (selectedChipValue === 100) {
		chipType = 'chipBlue';
	} else if (selectedChipValue === 1000) {
		chipType = 'chip1000';
	}
	// Place the bet on the board
	var bet = bettingBoard.placeBet(boxInfo, selectedChipValue, chipType);
	// Update game state
	balance -= selectedChipValue;
	currentBet += selectedChipValue;
	// Store bet information
	placedBets.push({
		type: boxInfo.type,
		value: boxInfo.value,
		amount: selectedChipValue
	});
	// Update displays
	updateBalanceDisplay();
	updateBetDisplay();
}
function clearBets() {
	// Return bet amounts to balance
	balance += currentBet;
	currentBet = 0;
	// Clear bet display
	bettingBoard.clearBets();
	placedBets = [];
	// Update displays
	updateBalanceDisplay();
	updateBetDisplay();
}
function startSpin() {
	// Spin the wheel and get the result
	isSpinning = true;
	bettingEnabled = false;
	// Clear result text
	resultText.setText("");
	// Spin the wheel and get the result
	var winningNumber = wheel.spin(function (result) {
		// Process the results after the wheel stops
		processResults(result);
	});
}
function processResults(winningNumber) {
	var winAmount = 0;
	var winningColor = getNumberColor(winningNumber);
	var isOdd = winningNumber % 2 === 1;
	var isLow = winningNumber >= 1 && winningNumber <= 18;
	// Update last numbers display
	lastNumbers.unshift(winningNumber);
	if (lastNumbers.length > 18) {
		lastNumbers.pop();
	}
	for (var i = 0; i < lastNumbersDisplay.length; i++) {
		if (lastNumbers[i] !== undefined) {
			var number = lastNumbers[i];
			var colorName = number === 0 ? "GREEN" : getNumberColor(number) === 0xE74C3C ? "RED" : "BLACK";
			lastNumbersDisplay[i].setText(number.toString() + " " + colorName);
		} else {
			lastNumbersDisplay[i].setText("");
		}
	}
	// Process the results after the wheel stops
	placedBets.forEach(function (bet) {
		var won = false;
		if (bet.type === "number" && bet.value === winningNumber) {
			// Straight up bet (35:1)
			winAmount += bet.amount * 36; // Original bet + 35x payout
			won = true;
		} else if (bet.type === "outside") {
			if (winningNumber !== 0) {
				// Outside bets lose on 0
				if (bet.value === "red" && winningColor === 0xE74C3C) {
					// Red bet (1:1)
					winAmount += bet.amount * 2; // Original bet + 1x payout
					won = true;
				} else if (bet.value === "black" && winningColor === 0x1a1a1a) {
					// Black bet (1:1)
					winAmount += bet.amount * 2;
					won = true;
				} else if (bet.value === "odd" && isOdd) {
					// Odd bet (1:1)
					winAmount += bet.amount * 2;
					won = true;
				} else if (bet.value === "even" && !isOdd && winningNumber !== 0) {
					// Even bet (1:1)
					winAmount += bet.amount * 2;
					won = true;
				} else if (bet.value === "low" && isLow) {
					// 1-18 bet (1:1)
					winAmount += bet.amount * 2;
					won = true;
				} else if (bet.value === "high" && !isLow && winningNumber !== 0) {
					// 19-36 bet (1:1)
					winAmount += bet.amount * 2;
					won = true;
				} else if (bet.value === "first12" && winningNumber >= 1 && winningNumber <= 12) {
					// 1st 12 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				} else if (bet.value === "second12" && winningNumber >= 13 && winningNumber <= 24) {
					// 2nd 12 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				} else if (bet.value === "third12" && winningNumber >= 25 && winningNumber <= 36) {
					// 3rd 12 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				} else if (bet.value === "twoToOne1" && [1, 4, 7, 10, 13, 16, 19, 22, 25, 28, 31, 34].includes(winningNumber)) {
					// 2 to 1 column 1 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				} else if (bet.value === "twoToOne2" && [2, 5, 8, 11, 14, 17, 20, 23, 26, 29, 32, 35].includes(winningNumber)) {
					// 2 to 1 column 2 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				} else if (bet.value === "twoToOne3" && [3, 6, 9, 12, 15, 18, 21, 24, 27, 30, 33, 36].includes(winningNumber)) {
					// 2 to 1 column 3 bet (2:1)
					winAmount += bet.amount * 3;
					won = true;
				}
			}
		}
	});
	// Display results
	var colorName = winningNumber === 0 ? "GREEN" : winningColor === 0xE74C3C ? "RED" : "BLACK";
	resultText.setText("Result: " + winningNumber + " " + colorName);
	if (winAmount > 0) {
		// Player won
		balance += winAmount;
		LK.getSound('win').play();
		var winText = new Text2("YOU WIN $" + (winAmount - currentBet), {
			size: 80,
			fill: 0x2ECC71
		});
		winText.anchor.set(0.5, 0.5);
		winText.y = 100;
		LK.gui.center.addChild(winText);
		// Animate win text
		tween(winText, {
			alpha: 0,
			y: 50
		}, {
			duration: 2000,
			onFinish: function onFinish() {
				winText.destroy();
			}
		});
	} else {
		// Player lost
		LK.getSound('lose').play();
	}
	// Update balance display
	updateBalanceDisplay();
	// Reset for next round
	LK.setTimeout(function () {
		currentBet = 0;
		placedBets = [];
		bettingBoard.clearBets();
		updateBetDisplay();
		isSpinning = false;
		bettingEnabled = true;
		// Check if player is out of money
		if (balance < 5) {
			// Game over if player can't afford minimum bet
			LK.showGameOver();
		}
	}, 3000);
}
function getNumberColor(number) {
	if (number === 0) {
		return 0x2ECC71; // Green
	}
	// Standard roulette red numbers
	var redNumbers = [1, 3, 5, 7, 9, 12, 14, 16, 18, 19, 21, 23, 25, 27, 30, 32, 34, 36];
	if (redNumbers.indexOf(number) !== -1) {
		return 0xE74C3C; // Red
	} else {
		return 0x1a1a1a; // Black
	}
}
// Game update loop
game.update = function () {
	// Nothing needed in the update loop as everything is event-driven
};
// Initial setup
updateBalanceDisplay();
updateBetDisplay();

===================================================================
--- original.js
+++ change.js
@@ -17,8 +17,16 @@
 	// Create the betting grid (3 rows x 12 columns for individual numbers)
 	for (var row = 0; row < 3; row++) {
 		for (var col = 0; col < 12; col++) {
 			var numberValue = 3 - row + col * 3;
+			var frame = self.attachAsset('betBoxFrame', {
+				anchorX: 0.5,
+				anchorY: 0.5,
+				x: col * 130 + 160,
+				y: row * 130 + 200,
+				scaleX: 1.05,
+				scaleY: 1.05
+			});
 			var box = self.attachAsset('betBox', {
 				anchorX: 0.5,
 				anchorY: 0.5,
 				x: col * 130 + 160,
@@ -60,8 +68,16 @@
 			}(boxes[boxes.length - 1]);
 		}
 	}
 	// Create 0 box
+	var zeroFrame = self.attachAsset('betBoxFrame', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		x: 160 - 130 - 3,
+		y: 130 + 200,
+		scaleX: 1.05,
+		scaleY: 3.23
+	});
 	var zeroBox = self.attachAsset('betBox', {
 		anchorX: 0.5,
 		anchorY: 0.5,
 		x: 160 - 130 - 3,
@@ -175,8 +191,17 @@
 		y: 0 * 130 + 200 - 200,
 		width: 130 // Standard width
 	}];
 	outsideBets.forEach(function (betInfo) {
+		var scaleMultiplier = (betInfo.width || 120) / 120;
+		var frame = self.attachAsset('betBoxFrame', {
+			anchorX: 0.5,
+			anchorY: 0.5,
+			x: betInfo.x + 100,
+			y: betInfo.y + 200,
+			scaleX: scaleMultiplier * 1.05,
+			scaleY: 1.05
+		});
 		var box = self.attachAsset('betBox', {
 			anchorX: 0.5,
 			anchorY: 0.5,
 			x: betInfo.x + 100,