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

/**** 
* Classes
****/ 
var ElementalNote = Container.expand(function (element, x, y) {
	var self = Container.call(this);
	var noteGraphics = self.attachAsset(element + 'Note', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.element = element;
	self.x = x;
	self.y = y;
	var label = new Text2(element.toUpperCase(), {
		size: 30,
		fill: 0xFFFFFF
	});
	label.anchor.set(0.5, 0.5);
	self.addChild(label);
	self.isDisabled = false;
	self.down = function (x, y, obj) {
		// Check if button is disabled
		if (self.isDisabled) {
			return;
		}
		// Disable button
		self.isDisabled = true;
		notePressed(self.element);
		// Play sound effect
		if (self.element === 'fire') {
			LK.getSound('Nota_Fire').play();
		} else if (self.element === 'water') {
			LK.getSound('Nota_Water').play();
		} else if (self.element === 'earth') {
			LK.getSound('Nota_Earth').play();
		} else if (self.element === 'wind') {
			LK.getSound('Nota_Wind').play();
		} else if (self.element === 'light') {
			LK.getSound('Nota_Light').play();
		} else {
			LK.getSound('summon').play();
		}
		// Visual feedback - make smaller on press and gray out
		tween(noteGraphics, {
			scaleX: 0.8,
			scaleY: 0.8,
			tint: 0x808080
		}, {
			duration: 100,
			onFinish: function onFinish() {
				// Return to normal size but keep gray
				tween(noteGraphics, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 100,
					onFinish: function onFinish() {
						// After 1 second total, re-enable button and restore color
						LK.setTimeout(function () {
							self.isDisabled = false;
							tween(noteGraphics, {
								tint: 0xffffff
							}, {
								duration: 200
							});
						}, 800); // 800ms + 200ms from previous animations = 1000ms total
					}
				});
			}
		});
	};
	return self;
});
var Enemy = Container.expand(function () {
	var self = Container.call(this);
	var enemyGraphics = self.attachAsset('enemyUnit', {
		anchorX: 0.5,
		anchorY: 0.5,
		width: 280,
		height: 280
	});
	self.health = 5;
	self.maxHealth = 5;
	self.damage = 1;
	self.speed = 1.5;
	self.attackCooldown = 0;
	// Physics properties
	self.velocityY = 0;
	self.onGround = false;
	self.gravity = 0.5;
	// Beat effect properties
	self.baseY = 0;
	self.beatEffectTimer = 0;
	// Health bar
	var healthBar = LK.getAsset('healthBar', {
		width: 100,
		height: 12
	});
	healthBar.anchor.set(0.5, 0.5);
	healthBar.y = -80;
	self.addChild(healthBar);
	self.healthBar = healthBar;
	self.update = function () {
		// Set base Y position for beat effect
		if (self.baseY === 0) {
			self.baseY = 2186; // Ground level
		}
		// Apply beat effect if active
		if (self.beatEffectTimer > 0) {
			self.beatEffectTimer--;
			var rotationAmount = Math.sin((120 - self.beatEffectTimer) * 0.3) * 0.1;
			enemyGraphics.rotation = rotationAmount;
		} else {
			enemyGraphics.rotation = 0; // Reset rotation when effect ends
			// Apply gravity
			if (!self.onGround) {
				self.velocityY += self.gravity;
				self.y += self.velocityY;
			}
			// Ground collision
			var groundY = 2186;
			if (self.y >= groundY) {
				self.y = groundY;
				self.baseY = groundY; // Update base position
				self.velocityY = 0;
				self.onGround = true;
			} else {
				self.onGround = false;
			}
		}
		if (self.attackCooldown > 0) {
			self.attackCooldown--;
		}
		// Move towards player tower (speed is controlled by combat state)
		self.x -= self.speed;
		// Check for warriors to attack and combat engagement
		var inCombat = false;
		for (var i = 0; i < warriors.length; i++) {
			var warrior = warriors[i];
			// Use half width for enemy and warrior colliders but keep full height
			var enemyColliderWidth = 280 * 0.5; // Half of enemy width
			var warriorColliderWidth = 288 * 0.5; // Half of warrior width
			var distance = Math.sqrt(Math.pow(self.x - warrior.x, 2) + Math.pow(self.y - warrior.y, 2));
			if (distance < 250) {
				// Mark as in combat to stop movement
				inCombat = true;
				if (self.attackCooldown <= 0) {
					self.attack(warrior);
					// Play combat sound when fighting with warrior
					playRandomCombatSound();
					// Attack animation - flash red and scale up
					tween(enemyGraphics, {
						tint: 0xff0000,
						scaleX: 1.3,
						scaleY: 1.3
					}, {
						duration: 200,
						onFinish: function onFinish() {
							tween(enemyGraphics, {
								tint: 0xffffff,
								scaleX: 1.0,
								scaleY: 1.0
							}, {
								duration: 200
							});
						}
					});
				}
				break;
			}
		}
		// Check if enemy is at the tower x position - stop movement to focus on tower attack
		var atTowerPosition = Math.abs(self.x - enemyTower.x) <= 50;
		// Stop movement if in combat or at tower position, otherwise resume normal movement
		if (inCombat || atTowerPosition) {
			self.speed = 0;
		} else {
			self.speed = 1.5;
		}
		// Check collision with player tower and destroy enemy - use half width for enemy collider
		var towerColliderRadius = 700; // Fixed collider size, not scaled with tower
		var enemyColliderWidth = 280 * 0.5; // Half of enemy width
		var enemyColliderHeight = 280; // Full enemy height
		var towerDistance = Math.sqrt(Math.pow(self.x - playerTower.x, 2) + Math.pow(self.y - playerTower.y, 2));
		if (towerDistance < towerColliderRadius) {
			if (self.attackCooldown <= 0) {
				self.attackPlayerTower();
			}
			// Destroy enemy when it touches the tower
			self.destroy();
			var index = enemies.indexOf(self);
			if (index > -1) {
				enemies.splice(index, 1);
			}
		}
		// Check if enemy is off-screen and destroy
		if (self.x < -500 || self.x > 4500 || self.y > 3500) {
			self.destroy();
			var index = enemies.indexOf(self);
			if (index > -1) {
				enemies.splice(index, 1);
			}
			return; // Exit update to prevent further execution
		}
		// Update health bar
		var healthPercent = self.health / self.maxHealth;
		self.healthBar.scaleX = healthPercent;
	};
	self.attack = function (target) {
		self.attackCooldown = 80;
		if (target === playerTower) {
			self.attackPlayerTower();
		} else {
			target.takeDamage(self.damage);
		}
	};
	self.attackPlayerTower = function () {
		self.attackCooldown = 80;
		playerTowerHealth -= self.damage;
		// Play random tower damage sound
		var towerSounds = ['sonido_torre_1', 'sonido_torre_2', 'sonido_torre_3', 'sonido_torre_4'];
		var randomIndex = Math.floor(Math.random() * towerSounds.length);
		LK.getSound(towerSounds[randomIndex]).play();
		// Create escombros particles when tower takes damage - quantity based on damage
		var particleCount = self.damage * 12; // Multiply particle count by damage
		for (var escombrosIndex = 0; escombrosIndex < particleCount; escombrosIndex++) {
			// 360-degree explosion pattern
			var angle = escombrosIndex / particleCount * Math.PI * 2; // Distribute evenly in 360 degrees
			var force = (200 + Math.random() * 300) * 4; // Quadruple the force
			var velocityX = Math.cos(angle) * force;
			var velocityY = Math.sin(angle) * force;
			var escombrosParticle = game.addChild(LK.getAsset('escombro_torre_jugador', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: playerTower.x,
				y: playerTower.y - 800,
				width: (60 + Math.random() * 40) * 5,
				height: (60 + Math.random() * 40) * 5,
				rotation: Math.random() * Math.PI * 2
			}));
			escombrosParticle.alpha = 0.9;
			escombrosParticle.tint = 0x8B4513; // Brown color for debris
			// Add gravity and physics properties
			escombrosParticle.velocityX = velocityX * 0.02; // Scale down for smooth movement
			escombrosParticle.velocityY = velocityY * 0.02;
			escombrosParticle.gravity = 0.8; // Gravity effect
			// Animate escombros particles with physics
			tween(escombrosParticle, {
				y: playerTower.y + 200 + escombrosParticle.velocityY * 100,
				x: playerTower.x + escombrosParticle.velocityX * 100,
				alpha: 0,
				rotation: escombrosParticle.rotation + Math.PI * 4,
				scaleX: 0.1,
				scaleY: 0.1
			}, {
				duration: 2000 + Math.random() * 1000,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					escombrosParticle.destroy();
				}
			});
		}
		if (playerTowerHealth <= 0) {
			LK.showGameOver();
		}
		updateTowerHealthBars();
	};
	self.takeDamage = function (damage) {
		self.health -= damage;
		if (self.health <= 0) {
			// Play enemy death sound
			LK.getSound('enemy_death').play();
			// Death animation - fade out and scale down
			tween(enemyGraphics, {
				alpha: 0,
				scaleX: 0.1,
				scaleY: 0.1,
				rotation: Math.PI * 2
			}, {
				duration: 500,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					self.destroy();
				}
			});
			var index = enemies.indexOf(self);
			if (index > -1) {
				enemies.splice(index, 1);
			}
			LK.setScore(LK.getScore() + 10);
			scoreText.setText('Score: ' + LK.getScore());
			// 50% chance to drop mana if not at max capacity
			if (Math.random() < 0.5 && currentMana < maxMana) {
				// Create mana drop at enemy position
				var manaDrop = game.addChild(LK.getAsset('manaOrb', {
					anchorX: 0.5,
					anchorY: 0.5,
					x: self.x,
					y: self.y
				}));
				// Visual effect - pulsing and floating up
				tween(manaDrop, {
					scaleX: 3.0,
					scaleY: 3.0,
					y: self.y - 100
				}, {
					duration: 800,
					easing: tween.easeOut
				});
				// Add mana after short delay and destroy drop
				LK.setTimeout(function () {
					currentMana = Math.min(currentMana + 1, maxMana);
					updateManaDisplay();
					// Flash effect on collection
					tween(manaDrop, {
						alpha: 0,
						scaleX: 4,
						scaleY: 4
					}, {
						duration: 300,
						onFinish: function onFinish() {
							manaDrop.destroy();
						}
					});
				}, 600);
			}
		}
	};
	return self;
});
var Nube = Container.expand(function () {
	var self = Container.call(this);
	// Create cloud with random uniform scale to maintain proportions
	var uniformScale = 0.5 + Math.random() * 1.5; // Random scale between 50% and 200%
	var cloudGraphics = self.attachAsset('shape', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: uniformScale,
		scaleY: uniformScale,
		alpha: 0.4 + Math.random() * 0.5 // Random opacity between 40% and 90%
	});
	// Set cloud to white/light gray color
	cloudGraphics.tint = 0xF0F0F0;
	// Random cloud speed (slower clouds for depth) - will be adjusted by height layer
	self.speed = 0.5 + Math.random() * 1.0; // Speed between 0.5 and 1.5
	// Adjust speed based on scale to simulate depth (smaller clouds move slower)
	self.baseSpeed = self.speed;
	// Store initial Y for floating animation
	self.initialY = 0; // Will be set when cloud is positioned
	// Method to start floating animation after positioning
	self.startFloating = function () {
		if (self.initialY === 0) {
			self.initialY = self.y; // Store the manually set position
		}
		var floatAmount = 20 + Math.random() * 30;
		var floatDuration = 3000 + Math.random() * 2000;
		tween(self, {
			y: self.initialY + floatAmount
		}, {
			duration: floatDuration,
			yoyo: true,
			repeat: -1,
			easing: tween.easeInOut
		});
	};
	self.update = function () {
		// Adjust speed based on scale for depth effect (smaller = slower, further away)
		self.speed = self.baseSpeed * (self.scaleX * 0.7 + 0.3); // Scale speed between 30% and 100%
		// Move cloud to the right
		self.x += self.speed;
		// Remove clouds that have moved off-screen to the right
		if (self.x > 4000 + cloudGraphics.width) {
			self.destroy();
			var index = clouds.indexOf(self);
			if (index > -1) {
				clouds.splice(index, 1);
			}
		}
	};
	return self;
});
var Warrior = Container.expand(function (element, tier) {
	var self = Container.call(this);
	var assetName = element + 'Warrior';
	if (element === 'fire' && tier === 1) {
		assetName = 'fireWarrior_nivel_1';
	}
	var warriorGraphics = self.attachAsset(assetName, {
		anchorX: 0.5,
		anchorY: 0.5,
		width: 288,
		height: 288
	});
	self.element = element;
	self.tier = tier;
	// Base stats - same as enemies
	var baseDamage = 1;
	var baseHealth = 5;
	// Set elemental-specific stats
	if (element === 'fire') {
		self.maxHealth = baseHealth;
		self.damage = baseDamage + 5; // +5 damage bonus
		self.speed = 2.2;
	} else if (element === 'water') {
		self.maxHealth = baseHealth;
		self.damage = baseDamage;
		self.speed = 1.8;
		self.canHeal = true;
		self.healCooldown = 0;
		self.isRanged = true;
		self.projectiles = [];
	} else if (element === 'earth') {
		self.maxHealth = baseHealth + 50; // +50 health bonus
		self.damage = baseDamage;
		self.speed = 1.5;
	} else if (element === 'light') {
		self.maxHealth = baseHealth;
		self.damage = baseDamage;
		self.speed = 2.5;
		self.isRanged = true;
		self.canAreaDamage = true;
		self.projectiles = [];
	} else if (element === 'wind') {
		self.maxHealth = baseHealth;
		self.damage = baseDamage;
		self.speed = 2.8;
		self.isFlying = true;
		self.isRanged = true;
		self.projectiles = [];
	} else {
		// Default stats for any other element
		self.maxHealth = baseHealth;
		self.damage = baseDamage;
		self.speed = 2;
	}
	self.health = self.maxHealth;
	self.attackCooldown = 0;
	self.target = null;
	self.isBeingDestroyed = false; // Flag to prevent multiple destruction attempts
	// Physics properties
	self.velocityY = 0;
	self.onGround = false;
	self.gravity = 0.5;
	// Beat effect properties
	self.baseY = 0;
	self.beatEffectTimer = 0;
	// Adjust appearance based on tier
	var scale = 1 + tier * 0.3;
	warriorGraphics.scaleX = scale;
	warriorGraphics.scaleY = scale;
	// Health bar
	var healthBar = LK.getAsset('warriorHealthBar', {
		width: 120,
		height: 16
	});
	healthBar.anchor.set(0.5, 0.5);
	healthBar.y = -100;
	self.addChild(healthBar);
	self.healthBar = healthBar;
	self.update = function () {
		// Set base Y position for beat effect
		if (self.baseY === 0) {
			if (self.isFlying) {
				self.baseY = 1800; // Flying height
			} else {
				self.baseY = 2186; // Ground level
			}
		}
		// Apply beat effect if active
		if (self.beatEffectTimer > 0) {
			self.beatEffectTimer--;
			var rotationAmount = Math.sin((120 - self.beatEffectTimer) * 0.3) * 0.1;
			warriorGraphics.rotation = rotationAmount;
		} else {
			warriorGraphics.rotation = 0; // Reset rotation when effect ends
			// Apply gravity only to non-flying units
			if (!self.isFlying && !self.onGround) {
				self.velocityY += self.gravity;
				self.y += self.velocityY;
			}
			// Ground collision for non-flying units
			var groundY = 2186;
			if (!self.isFlying && self.y >= groundY) {
				self.y = groundY;
				self.baseY = groundY; // Update base position
				self.velocityY = 0;
				self.onGround = true;
			} else if (!self.isFlying) {
				self.onGround = false;
			}
			// Flying units hover at a specific height
			if (self.isFlying) {
				self.y = 1800; // Fly above ground level
				self.baseY = 1800; // Update base position
			}
		}
		// Move towards enemy tower (speed is controlled by combat state)
		if (!self.target) {
			self.x += self.speed;
		}
		// Attack logic
		if (self.attackCooldown > 0) {
			self.attackCooldown--;
		}
		// Update heal cooldown for water warriors
		if (self.canHeal && self.healCooldown > 0) {
			self.healCooldown--;
		}
		// Water warriors heal nearby allies only (not themselves)
		if (self.canHeal && self.healCooldown <= 0) {
			self.healCooldown = 120; // 2 seconds
			// Heal nearby warriors
			for (var j = 0; j < warriors.length; j++) {
				var ally = warriors[j];
				if (ally !== self) {
					var allyDistance = Math.sqrt(Math.pow(self.x - ally.x, 2) + Math.pow(self.y - ally.y, 2));
					if (allyDistance < 300 && ally.health < ally.maxHealth) {
						ally.health = Math.min(ally.health + 1, ally.maxHealth);
						// Healing effect
						tween(ally.children[0], {
							tint: 0x00ff88
						}, {
							duration: 200,
							onFinish: function onFinish() {
								tween(ally.children[0], {
									tint: 0xffffff
								}, {
									duration: 200
								});
							}
						});
						// Create healing particles
						for (var particleIndex = 0; particleIndex < 8; particleIndex++) {
							var particle = game.addChild(LK.getAsset('particulas_curacion', {
								anchorX: 0.5,
								anchorY: 0.5,
								x: ally.x + (Math.random() - 0.5) * 100,
								y: ally.y + (Math.random() - 0.5) * 100,
								width: 140 + Math.random() * 100,
								height: 140 + Math.random() * 100
							}));
							particle.alpha = 0.8;
							// Animate particles upward and fade out
							tween(particle, {
								y: ally.y - 150 - Math.random() * 50,
								x: ally.x + (Math.random() - 0.5) * 200,
								alpha: 0,
								scaleX: 0.3,
								scaleY: 0.3
							}, {
								duration: 800 + Math.random() * 400,
								easing: tween.easeOut,
								onFinish: function onFinish() {
									particle.destroy();
								}
							});
						}
					}
				}
			}
		}
		// Check for enemies to attack and combat engagement
		var inCombat = false;
		var attackRange = self.isRanged ? 600 : 250;
		for (var i = 0; i < enemies.length; i++) {
			var enemy = enemies[i];
			// Use half width for warrior and enemy colliders but keep full height
			var warriorColliderWidth = 288 * 0.5; // Half of warrior width
			var enemyColliderWidth = 280 * 0.5; // Half of enemy width
			var distance = Math.sqrt(Math.pow(self.x - enemy.x, 2) + Math.pow(self.y - enemy.y, 2));
			if (distance < attackRange) {
				// Mark as in combat to stop movement for both melee and ranged units
				inCombat = true;
				if (self.attackCooldown <= 0) {
					self.attack(enemy);
					// Play combat sound only for melee warriors to avoid double sounds
					if (!self.isRanged) {
						playRandomCombatSound();
					}
					// Attack animation - flash blue and scale up
					tween(warriorGraphics, {
						tint: 0x00ffff,
						scaleX: 1.4,
						scaleY: 1.4
					}, {
						duration: 300,
						onFinish: function onFinish() {
							tween(warriorGraphics, {
								tint: 0xffffff,
								scaleX: scale,
								scaleY: scale
							}, {
								duration: 300
							});
						}
					});
				}
				if (!self.isRanged) break;
			}
		}
		// Check if warrior is at the tower x position - stop movement to focus on tower attack
		var atTowerPosition = Math.abs(self.x - playerTower.x) <= 50;
		// Update projectiles for ranged units
		if (self.isRanged) {
			for (var p = self.projectiles.length - 1; p >= 0; p--) {
				var proj = self.projectiles[p];
				proj.x += proj.speedX;
				proj.y += proj.speedY;
				var projectileDestroyed = false;
				// Water warrior projectiles can heal allies
				if (self.element === 'water') {
					// Check collision with allies first
					for (var w = 0; w < warriors.length; w++) {
						var ally = warriors[w];
						if (ally !== self) {
							// Use half width for ally collider but keep full height
							var allyColliderWidth = 288 * 0.5; // Half of ally width
							var allyDistance = Math.sqrt(Math.pow(proj.x - ally.x, 2) + Math.pow(proj.y - ally.y, 2));
							if (allyDistance < 50) {
								// Hit ally
								if (ally.health < ally.maxHealth) {
									// Heal ally if not at full health
									ally.health = Math.min(ally.health + 1, ally.maxHealth);
									// Healing effect
									tween(ally.children[0], {
										tint: 0x00ff88
									}, {
										duration: 200,
										onFinish: function onFinish() {
											tween(ally.children[0], {
												tint: 0xffffff
											}, {
												duration: 200
											});
										}
									});
									// Create healing particles
									for (var particleIndex = 0; particleIndex < 8; particleIndex++) {
										var particle = game.addChild(LK.getAsset('particulas_curacion', {
											anchorX: 0.5,
											anchorY: 0.5,
											x: ally.x + (Math.random() - 0.5) * 100,
											y: ally.y + (Math.random() - 0.5) * 100,
											width: 140 + Math.random() * 100,
											height: 140 + Math.random() * 100
										}));
										particle.alpha = 0.8;
										// Animate particles upward and fade out
										tween(particle, {
											y: ally.y - 150 - Math.random() * 50,
											x: ally.x + (Math.random() - 0.5) * 200,
											alpha: 0,
											scaleX: 0.3,
											scaleY: 0.3
										}, {
											duration: 800 + Math.random() * 400,
											easing: tween.easeOut,
											onFinish: function onFinish() {
												particle.destroy();
											}
										});
									}
									proj.destroy();
									self.projectiles.splice(p, 1);
									projectileDestroyed = true;
									break;
								}
								// If ally is at full health, projectile passes through
							}
						}
					}
				}
				// Check collision with enemies only if projectile wasn't destroyed by healing
				if (!projectileDestroyed) {
					for (var e = 0; e < enemies.length; e++) {
						var enemy = enemies[e];
						// Use half width for enemy collider but keep full height
						var enemyColliderWidth = 280 * 0.5; // Half of enemy width
						var projDistance = Math.sqrt(Math.pow(proj.x - enemy.x, 2) + Math.pow(proj.y - enemy.y, 2));
						if (projDistance < 80) {
							// Increased collision radius for better detection
							// Hit enemy
							if (self.canAreaDamage) {
								// Create lightning explosion visual effect at projectile impact point
								var explosion = game.addChild(LK.getAsset('efecto_electricidad', {
									anchorX: 0.5,
									anchorY: 0.5,
									x: proj.x,
									y: proj.y,
									width: 80,
									height: 80
								}));
								explosion.alpha = 0.9;
								// Animate explosion - scale up and fade out
								tween(explosion, {
									scaleX: 3.0,
									scaleY: 3.0,
									alpha: 0
								}, {
									duration: 400,
									easing: tween.easeOut,
									onFinish: function onFinish() {
										explosion.destroy();
									}
								});
								// Create electric particles expanding from explosion center
								for (var particleIndex = 0; particleIndex < 12; particleIndex++) {
									var angle = particleIndex / 12 * Math.PI * 2; // Distribute evenly in circle
									var distance = 150 + Math.random() * 100;
									var particleEndX = proj.x + Math.cos(angle) * distance;
									var particleEndY = proj.y + Math.sin(angle) * distance;
									var electricParticle = game.addChild(LK.getAsset('efecto_electricidad', {
										anchorX: 0.5,
										anchorY: 0.5,
										x: proj.x,
										y: proj.y,
										width: 20 + Math.random() * 20,
										height: 20 + Math.random() * 20
									}));
									electricParticle.alpha = 0.8;
									// Animate particles expanding outward and fading
									tween(electricParticle, {
										x: particleEndX,
										y: particleEndY,
										alpha: 0,
										scaleX: 0.2,
										scaleY: 0.2
									}, {
										duration: 300 + Math.random() * 200,
										easing: tween.easeOut,
										onFinish: function onFinish() {
											electricParticle.destroy();
										}
									});
								}
								// Lightning area damage - increased damage for area effect
								for (var ae = 0; ae < enemies.length; ae++) {
									var areaEnemy = enemies[ae];
									var areaDistance = Math.sqrt(Math.pow(proj.x - areaEnemy.x, 2) + Math.pow(proj.y - areaEnemy.y, 2));
									if (areaDistance < 600) {
										areaEnemy.takeDamage(1); // Set damage to 1 for area effect
									}
								}
							} else {
								// Single target damage for water and wind warriors
								enemy.takeDamage(self.damage);
							}
							proj.destroy();
							self.projectiles.splice(p, 1);
							projectileDestroyed = true;
							break;
						}
					}
				}
				// Remove projectiles that go off screen only if not already destroyed
				if (!projectileDestroyed && (proj.x > 4500 || proj.x < -500 || proj.y > 3500 || proj.y < -500)) {
					proj.destroy();
					self.projectiles.splice(p, 1);
				}
			}
		}
		// Stop movement if in combat or at tower position, otherwise resume normal movement
		// Exception: wind warriors (aerial units) continue moving while attacking
		if ((inCombat || atTowerPosition) && self.element !== 'wind') {
			self.speed = 0;
		} else {
			if (self.element === 'fire') {
				self.speed = 2.2;
			} else if (self.element === 'water') {
				self.speed = 1.8;
			} else if (self.element === 'earth') {
				self.speed = 1.5;
			} else if (self.element === 'light') {
				self.speed = 2.5;
			} else if (self.element === 'wind') {
				self.speed = 2.8;
			} else {
				self.speed = 2;
			}
		}
		// Check collision with enemy tower - use separate x and y collision detection for flying units
		var towerColliderRadius = 700; // Fixed collider size, not scaled with tower
		var warriorColliderWidth = 288 * 0.5; // Half of warrior width
		var warriorColliderHeight = 288; // Full warrior height
		var towerDistance = Math.sqrt(Math.pow(self.x - enemyTower.x, 2) + Math.pow(self.y - enemyTower.y, 2));
		var xDistance = Math.abs(self.x - enemyTower.x);
		var yDistance = Math.abs(self.y - enemyTower.y);
		// Debug collision for wind warriors
		if (self.element === 'wind') {
			collisionDebugText.setText('Wind Warrior - XDist: ' + Math.round(xDistance) + ' YDist: ' + Math.round(yDistance) + ' Pos: (' + Math.round(self.x) + ',' + Math.round(self.y) + ')');
		}
		// Use different collision detection for flying units vs ground units
		var collisionDetected = false;
		if (self.isFlying) {
			// For flying units, use x-distance only (ignore y difference)
			collisionDetected = xDistance < towerColliderRadius;
		} else {
			// For ground units, use traditional distance-based collision
			collisionDetected = towerDistance < towerColliderRadius;
		}
		if (collisionDetected && !self.isBeingDestroyed) {
			// Debug when collision happens
			if (self.element === 'wind') {
				collisionDebugText.setText('WIND COLLISION! XDist: ' + Math.round(xDistance) + ' Damage: ' + self.damage);
			}
			// Deal damage to tower first - always attack regardless of cooldown when touching tower
			self.attackTower();
			// Mark as being destroyed to prevent multiple collision detections
			self.isBeingDestroyed = true;
			// Remove from warriors array immediately
			var index = warriors.indexOf(self);
			if (index > -1) {
				warriors.splice(index, 1);
			}
			// Warrior self-destructs when touching the tower - immediate destruction
			self.destroy();
			return; // Exit update to prevent further execution after destruction
		}
		// Check projectile collision with enemy tower for ranged units - tower is invulnerable to projectiles
		if (self.isRanged) {
			for (var p = self.projectiles.length - 1; p >= 0; p--) {
				var proj = self.projectiles[p];
				var projTowerDistance = Math.sqrt(Math.pow(proj.x - enemyTower.x, 2) + Math.pow(proj.y - enemyTower.y, 2));
				if (projTowerDistance < 700) {
					// Fixed collider radius
					// Projectile hit the tower but tower is invulnerable - just destroy projectile
					proj.destroy();
					self.projectiles.splice(p, 1);
				}
			}
		}
		// Check if warrior is off-screen and destroy
		if (self.x < -500 || self.x > 4500 || self.y > 3500) {
			self.destroy();
			var index = warriors.indexOf(self);
			if (index > -1) {
				warriors.splice(index, 1);
			}
			return; // Exit update to prevent further execution
		}
		// Update health bar
		var healthPercent = self.health / self.maxHealth;
		self.healthBar.scaleX = healthPercent;
		self.healthBar.tint = healthPercent > 0.5 ? 0x00ff00 : healthPercent > 0.25 ? 0xffff00 : 0xff0000;
	};
	self.attack = function (target) {
		self.attackCooldown = 60; // 1 second at 60fps
		if (target === enemyTower) {
			self.attackTower();
		} else if (self.isRanged) {
			// Create projectile for ranged units with enhanced properties
			var projectileSize = 120; // Larger projectiles for better visibility (doubled from 60)
			var projectileAsset = self.element === 'light' ? 'proyectil_electricidad' : 'projectile';
			var projectile = game.addChild(LK.getAsset(projectileAsset, {
				anchorX: 0.5,
				anchorY: 0.5,
				x: self.x,
				y: self.y - 20,
				// Start slightly above warrior
				width: projectileSize,
				height: projectileSize
			}));
			// Calculate direction to target
			var dx = target.x - self.x;
			var dy = target.y - self.y;
			var distance = Math.sqrt(dx * dx + dy * dy);
			var speed = 10; // Increased speed for better gameplay
			projectile.speedX = dx / distance * speed;
			projectile.speedY = dy / distance * speed;
			// Set projectile appearance based on element
			if (self.element === 'light') {
				projectile.alpha = 0.9; // Slightly transparent for glow effect
				// Add pulsing effect for lightning
				tween(projectile, {
					scaleX: 1.3,
					scaleY: 1.3
				}, {
					duration: 300,
					yoyo: true,
					repeat: -1
				});
			} else if (self.element === 'wind') {
				projectile.tint = 0x44ff44; // Green for wind
				projectile.alpha = 0.8;
				// Add spinning effect for wind
				tween(projectile, {
					rotation: Math.PI * 2
				}, {
					duration: 500,
					repeat: -1
				});
			} else if (self.element === 'water') {
				projectile.tint = 0x1e90ff; // Sea blue for water (DodgerBlue)
				projectile.alpha = 0.85;
				// Add wobbling effect for water
				tween(projectile, {
					scaleX: 1.2,
					scaleY: 0.8
				}, {
					duration: 200,
					yoyo: true,
					repeat: -1
				});
			}
			self.projectiles.push(projectile);
			// Auto-destroy projectile after 5 seconds to prevent map clutter
			tween(projectile, {
				alpha: projectile.alpha // Dummy property to track time
			}, {
				duration: 5000,
				// 5 seconds
				onFinish: function onFinish() {
					// Find and remove projectile from array
					var index = self.projectiles.indexOf(projectile);
					if (index > -1) {
						self.projectiles.splice(index, 1);
					}
					// Destroy the projectile
					projectile.destroy();
				}
			});
			// Play element-specific projectile sound
			playRandomProjectileSound(self.element);
			return; // Exit after creating projectile to prevent melee sound
		} else {
			// Melee attack
			target.takeDamage(self.damage);
			// Play sword attack sound for melee attacks
			sonidoEspadas();
		}
	};
	self.attackTower = function () {
		self.attackCooldown = 60;
		enemyTowerHealth -= self.damage;
		// Play random tower damage sound
		var towerSounds = ['sonido_torre_1', 'sonido_torre_2', 'sonido_torre_3', 'sonido_torre_4'];
		var randomIndex = Math.floor(Math.random() * towerSounds.length);
		LK.getSound(towerSounds[randomIndex]).play();
		// Create escombros particles when enemy tower takes damage - quantity based on damage
		var particleCount = self.damage * 12; // Multiply particle count by damage
		for (var escombrosIndex = 0; escombrosIndex < particleCount; escombrosIndex++) {
			// 360-degree explosion pattern
			var angle = escombrosIndex / particleCount * Math.PI * 2; // Distribute evenly in 360 degrees
			var force = (200 + Math.random() * 300) * 4; // Quadruple the force
			var velocityX = Math.cos(angle) * force;
			var velocityY = Math.sin(angle) * force;
			var escombrosParticle = game.addChild(LK.getAsset('escombros_torre_enemiga', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: enemyTower.x,
				y: enemyTower.y - 800,
				width: (60 + Math.random() * 40) * 5,
				height: (60 + Math.random() * 40) * 5,
				rotation: Math.random() * Math.PI * 2
			}));
			escombrosParticle.alpha = 0.9;
			escombrosParticle.tint = 0x696969; // Dark gray color for enemy debris
			// Add gravity and physics properties
			escombrosParticle.velocityX = velocityX * 0.02; // Scale down for smooth movement
			escombrosParticle.velocityY = velocityY * 0.02;
			escombrosParticle.gravity = 0.8; // Gravity effect
			// Animate escombros particles with physics
			tween(escombrosParticle, {
				y: enemyTower.y + 200 + escombrosParticle.velocityY * 100,
				x: enemyTower.x + escombrosParticle.velocityX * 100,
				alpha: 0,
				rotation: escombrosParticle.rotation + Math.PI * 4,
				scaleX: 0.1,
				scaleY: 0.1
			}, {
				duration: 2000 + Math.random() * 1000,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					escombrosParticle.destroy();
				}
			});
		}
		if (enemyTowerHealth <= 0) {
			LK.showYouWin();
		}
		updateTowerHealthBars();
	};
	self.takeDamage = function (damage) {
		self.health -= damage;
		if (self.health <= 0) {
			// Mark as being destroyed to prevent multiple destruction attempts
			self.isBeingDestroyed = true;
			// Death animation - fade out and scale down
			tween(warriorGraphics, {
				alpha: 0,
				scaleX: 0.1,
				scaleY: 0.1,
				rotation: -Math.PI * 2
			}, {
				duration: 600,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					self.destroy();
				}
			});
			// Only remove from warriors array if not already removed by collision detection
			if (!self.isBeingDestroyed || self.isBeingDestroyed) {
				var index = warriors.indexOf(self);
				if (index > -1) {
					warriors.splice(index, 1);
				}
			}
		}
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x2c3e50,
	width: 3840,
	height: 1080
});

/**** 
* Game Code
****/ 
function _typeof3(o) {
	"@babel/helpers - typeof";
	return _typeof3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
		return typeof o;
	} : function (o) {
		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
	}, _typeof3(o);
}
function _typeof2(o) {
	"@babel/helpers - typeof";
	return _typeof2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
		return typeof o;
	} : function (o) {
		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
	}, _typeof2(o);
}
function _typeof(o) {
	"@babel/helpers - typeof";
	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
		return typeof o;
	} : function (o) {
		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
	}, _typeof(o);
}
var warriors = [];
var enemies = [];
var playerTowerHealth = 30;
var enemyTowerHealth = 10;
var enemySpawnTimer = 0;
var isDragging = false;
var lastMouseX = 0;
var cameraX = 0;
var maxCameraX = 1792; // 3840 - 2048 = max scroll distance
var currentMana = 5;
var maxMana = 5;
var manaRegenTimer = 0;
// Music beat detection variables
var musicBeatThreshold = 0.15; // Updated sensitivity threshold
var lastBeatTime = 0;
var beatCooldown = 15; // Reduced cooldown for more frequent detections (0.25 seconds at 60fps)
// UI Elements
var scoreText = new Text2('Score: 0', {
	size: 40,
	fill: 0xFFFFFF
});
scoreText.anchor.set(0, 0);
scoreText.x = 120;
scoreText.y = 50;
LK.gui.topLeft.addChild(scoreText);
// Create mana display
var manaText = new Text2('Mana: 5/5', {
	size: 40,
	fill: 0x00FFFF
});
manaText.anchor.set(0, 0);
manaText.x = 1100;
manaText.y = 100;
LK.gui.topLeft.addChild(manaText);
// Create mana orbs visual display
var manaOrbs = [];
for (var i = 0; i < maxMana; i++) {
	var orb = LK.getAsset('manaOrbShape', {
		width: 40,
		height: 40
	});
	orb.anchor.set(0.5, 0.5);
	orb.x = 1100 + i * 50;
	orb.y = 160;
	LK.gui.topLeft.addChild(orb);
	manaOrbs.push(orb);
}
// Settings panel state
var settingsPanelVisible = false;
var settingsBars = [];
// Settings values (0.0 to 1.0 range)
var musicValue = 0.8;
var soundValue = 0.8;
var sensitivityValue = 0.5;
// Create settings button below mana bar
var settingsButton = LK.getAsset('settingsIcon', {
	width: 120,
	height: 120
});
settingsButton.anchor.set(0.5, 0.5);
settingsButton.x = 1200; // Move slightly to the right
settingsButton.y = 250; // Move down a bit more
settingsButton.alpha = 0.8;
LK.gui.topLeft.addChild(settingsButton);
// Create slider components
function createSlider(x, y, label, initialValue, color) {
	// Background track
	var track = LK.getAsset('playerTowerHealthBar', {
		width: 250,
		height: 30
	});
	track.anchor.set(0.5, 0.5);
	track.x = x;
	track.y = y;
	track.alpha = 0;
	track.tint = 0x333333;
	LK.gui.topLeft.addChild(track);
	// Fill bar
	var fill = LK.getAsset('playerTowerHealthBar', {
		width: 250,
		height: 30
	});
	fill.anchor.set(0.0, 0.5);
	fill.x = x - 125;
	fill.y = y;
	fill.alpha = 0;
	fill.tint = color;
	fill.scaleX = initialValue;
	LK.gui.topLeft.addChild(fill);
	// Slider handle
	var handle = LK.getAsset('leftCameraButton', {
		width: 40,
		height: 40
	});
	handle.anchor.set(0.5, 0.5);
	handle.x = x - 125 + 250 * initialValue;
	handle.y = y;
	handle.alpha = 0;
	handle.tint = 0xFFFFFF;
	LK.gui.topLeft.addChild(handle);
	// Label text
	var text = new Text2(label + ': ' + initialValue.toFixed(1), {
		size: 20,
		fill: 0xFFFFFF
	});
	text.anchor.set(0.5, 0.5);
	text.x = x;
	text.y = y - 25;
	text.alpha = 0;
	LK.gui.topLeft.addChild(text);
	return {
		track: track,
		fill: fill,
		handle: handle,
		text: text,
		value: initialValue
	};
}
// Create sliders
var musicSlider = createSlider(1200, 380, 'Música', musicValue, 0x4444ff);
// Update initial display to show percentage
musicSlider.text.setText('Música: ' + Math.round(musicValue * 100) + '%');
var soundSlider = createSlider(1200, 460, 'Sonido', soundValue, 0x44ff44);
var sensitivitySlider = createSlider(1200, 540, 'Sensibilidad', sensitivityValue, 0xff4444);
// Store all slider elements
settingsBars = [musicSlider.track, musicSlider.fill, musicSlider.handle, musicSlider.text, soundSlider.track, soundSlider.fill, soundSlider.handle, soundSlider.text, sensitivitySlider.track, sensitivitySlider.fill, sensitivitySlider.handle, sensitivitySlider.text];
// Drag state
var isDraggingSlider = false;
var activeSlider = null;
var dragStartX = 0;
var dragStartValue = 0;
// Debug variables for touch position tracking
var initialTouchX = 0;
var initialTouchY = 0;
var currentTouchX = 0;
var currentTouchY = 0;
// Function to update slider value
function updateSliderValue(slider, newValue, type) {
	slider.value = Math.max(0.0, Math.min(1.0, newValue));
	slider.fill.scaleX = slider.value;
	slider.handle.x = slider.track.x - 125 + 250 * slider.value;
	// Display as percentage for music, keep decimal for others
	if (type === 'Música') {
		slider.text.setText(type + ': ' + Math.round(slider.value * 100) + '%');
	} else {
		slider.text.setText(type + ': ' + slider.value.toFixed(1));
	}
	// Apply music volume changes immediately when music slider is updated
	if (type === 'Música') {
		// Stop current music and restart with new volume
		LK.stopMusic();
		LK.playMusic('Music', {
			volume: slider.value
		});
	}
}
// Music slider interaction
musicSlider.track.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = musicSlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = musicValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
musicSlider.handle.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = musicSlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = musicValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
// Sound slider interaction
soundSlider.track.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = soundSlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = soundValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
soundSlider.handle.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = soundSlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = soundValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
// Sensitivity slider interaction
sensitivitySlider.track.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = sensitivitySlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = sensitivityValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
sensitivitySlider.handle.down = function (x, y, obj) {
	isDraggingSlider = true;
	activeSlider = sensitivitySlider;
	// Convert GUI coordinates to global coordinates
	var globalPos = LK.gui.topLeft.toGlobal({
		x: x,
		y: y
	});
	dragStartX = globalPos.x;
	dragStartValue = sensitivityValue;
	// Store initial touch position for debug
	initialTouchX = globalPos.x;
	initialTouchY = globalPos.y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
	}
};
settingsButton.down = function (x, y, obj) {
	// Visual feedback with bounce effect
	tween(settingsButton, {
		scaleX: 0.85,
		scaleY: 0.85,
		alpha: 0.6,
		rotation: Math.PI * 0.1
	}, {
		duration: 150,
		easing: tween.easeOut,
		onFinish: function onFinish() {
			tween(settingsButton, {
				scaleX: 1.05,
				scaleY: 1.05,
				alpha: 0.9,
				rotation: 0
			}, {
				duration: 150,
				easing: tween.bounceOut,
				onFinish: function onFinish() {
					tween(settingsButton, {
						scaleX: 1.0,
						scaleY: 1.0,
						alpha: 0.8
					}, {
						duration: 100
					});
				}
			});
		}
	});
	// Toggle settings panel with staggered animations
	if (settingsPanelVisible) {
		// Hide settings panel with staggered fade out
		settingsPanelVisible = false;
		for (var i = 0; i < settingsBars.length; i++) {
			var delay = i * 30; // Stagger each element by 30ms
			tween(settingsBars[i], {
				alpha: 0,
				y: settingsBars[i].y - 20,
				scaleX: 0.8,
				scaleY: 0.8
			}, {
				duration: 300,
				delay: delay,
				easing: tween.easeInOut
			});
		}
	} else {
		// Show settings panel with bouncy entrance
		settingsPanelVisible = true;
		for (var i = 0; i < settingsBars.length; i++) {
			var delay = i * 40; // Stagger each element by 40ms
			var targetY = settingsBars[i].y;
			settingsBars[i].y = targetY - 30;
			settingsBars[i].scaleX = 0.6;
			settingsBars[i].scaleY = 0.6;
			tween(settingsBars[i], {
				alpha: 1,
				y: targetY,
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 400,
				delay: delay,
				easing: tween.elasticOut
			});
		}
	}
};
// Create collision debug text in center of game
var collisionDebugText = new Text2('Collision Debug', {
	size: 60,
	fill: 0xFFFF00
});
collisionDebugText.anchor.set(0.5, 0.5);
collisionDebugText.x = 1024; // Center of screen width (2048/2)
collisionDebugText.y = 1366; // Center of screen height (2732/2)
game.addChild(collisionDebugText);
// Create touch position debug text
var touchDebugText = new Text2('Touch Info: Initial(0,0) Current(0,0)', {
	size: 40,
	fill: 0xFF00FF
});
touchDebugText.anchor.set(0.5, 0.5);
touchDebugText.x = 1024; // Center of screen width
touchDebugText.y = 1500; // Below collision debug text
game.addChild(touchDebugText);
// Create tiled ground floor
var groundTiles = [];
var tileSize = 592.704; // Size of each ground tile (increased by 5% more)
var groundY = 2732; // Position at bottom of screen
var groundHeight = 728.6; // Extend height to fill bottom gap (tileSize + 136 pixels)
var numTiles = Math.ceil(3840 / tileSize) + 2; // Cover full width plus extra for seamless tiling
for (var i = 0; i < numTiles; i++) {
	var groundTile = game.addChild(LK.getAsset('ground', {
		anchorX: 0.0,
		anchorY: 1.0,
		x: i * tileSize,
		y: groundY,
		width: tileSize,
		height: groundHeight
	}));
	groundTiles.push(groundTile);
}
// Create towers (horizontal layout)
var playerTower = game.addChild(LK.getAsset('playerTower', {
	anchorX: 0.5,
	anchorY: 1.0,
	x: 250,
	y: 2559,
	width: 1200,
	height: 1728
}));
var enemyTower = game.addChild(LK.getAsset('enemyTower', {
	anchorX: 0.5,
	anchorY: 1.0,
	x: 3590,
	y: 2559,
	width: 1200,
	height: 1728
}));
// Tower health bars
var playerTowerHealthBar = LK.getAsset('playerTowerHealthBar', {
	width: 1200,
	height: 160
});
playerTowerHealthBar.anchor.set(0.5, 0.5);
playerTowerHealthBar.x = playerTower.x;
playerTowerHealthBar.y = playerTower.y - 1840;
game.addChild(playerTowerHealthBar);
var enemyTowerHealthBar = LK.getAsset('enemyTowerHealthBar', {
	width: 1200,
	height: 160
});
enemyTowerHealthBar.anchor.set(0.5, 0.5);
enemyTowerHealthBar.x = enemyTower.x;
enemyTowerHealthBar.y = enemyTower.y - 1840;
game.addChild(enemyTowerHealthBar);
// Create elemental notes (horizontal layout at top left) - show all elements
var elements = ['fire', 'water', 'earth', 'wind', 'light'];
var notes = [];
for (var i = 0; i < elements.length; i++) {
	var note = new ElementalNote(elements[i], 0, 0);
	LK.gui.topLeft.addChild(note);
	// Make buttons smaller
	note.scaleX = 0.4;
	note.scaleY = 0.4;
	// Position buttons horizontally in upper left with proper spacing (moved 50% right total)
	note.x = 234 + i * 140; // Start at x:234 (moved from 180), space buttons 140 pixels apart
	note.y = 120; // Fixed y position in upper area
	notes.push(note);
}
// Create camera control buttons
var leftButton = LK.getAsset('leftCameraButton', {
	width: 100,
	height: 100
});
leftButton.anchor.set(0.5, 0.5);
leftButton.alpha = 0.5; // 50% transparency
LK.gui.left.addChild(leftButton);
var leftButtonText = new Text2('<', {
	size: 60,
	fill: 0xffffff
});
leftButtonText.anchor.set(0.5, 0.5);
leftButton.addChild(leftButtonText);
var rightButton = LK.getAsset('rightCameraButton', {
	width: 100,
	height: 100
});
rightButton.anchor.set(0.5, 0.5);
rightButton.alpha = 0.5; // 50% transparency
LK.gui.right.addChild(rightButton);
var rightButtonText = new Text2('>', {
	size: 60,
	fill: 0xffffff
});
rightButtonText.anchor.set(0.5, 0.5);
rightButton.addChild(rightButtonText);
function notePressed(element) {
	// Check if we have enough mana
	if (currentMana <= 0) {
		return; // No mana, can't summon
	}
	// Consume mana
	currentMana--;
	updateManaDisplay();
	// Create elemental warrior based on the note element
	var warrior = new Warrior(element, 1);
	warrior.x = playerTower.x + 300;
	warrior.y = 2186; // Spawn on ground level
	warrior.onGround = true; // Start on ground
	// Add elemental-specific visual effects on spawn
	var warriorGraphics = warrior.children[0]; // Get the warrior graphics
	if (element === 'water') {
		// Water splash effect - blue particles
		tween(warriorGraphics, {
			tint: 0x0066ff,
			scaleX: 1.5,
			scaleY: 1.5
		}, {
			duration: 300,
			onFinish: function onFinish() {
				tween(warriorGraphics, {
					tint: 0xffffff,
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 200
				});
			}
		});
	} else if (element === 'earth') {
		// Earth rumble effect - brown particles
		var originalY = warriorGraphics.y;
		tween(warriorGraphics, {
			tint: 0x8b4513,
			y: originalY - 50
		}, {
			duration: 200,
			onFinish: function onFinish() {
				tween(warriorGraphics, {
					tint: 0xffffff,
					y: originalY
				}, {
					duration: 200
				});
			}
		});
	} else if (element === 'fire') {
		// Fire burst effect - red/orange flames
		tween(warriorGraphics, {
			tint: 0xff4400,
			scaleX: 1.3,
			scaleY: 1.3,
			rotation: Math.PI * 0.1
		}, {
			duration: 250,
			onFinish: function onFinish() {
				tween(warriorGraphics, {
					tint: 0xffffff,
					scaleX: 1.0,
					scaleY: 1.0,
					rotation: 0
				}, {
					duration: 150
				});
			}
		});
	} else if (element === 'light') {
		// Lightning effect - bright yellow flash
		tween(warriorGraphics, {
			tint: 0xffff00,
			alpha: 1.5,
			scaleX: 1.2,
			scaleY: 1.2
		}, {
			duration: 150,
			onFinish: function onFinish() {
				tween(warriorGraphics, {
					tint: 0xffffff,
					alpha: 1.0,
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 100
				});
			}
		});
	} else if (element === 'wind') {
		// Wind swirl effect - green spiral
		tween(warriorGraphics, {
			tint: 0x44ff44,
			rotation: Math.PI * 2,
			scaleX: 1.1,
			scaleY: 1.1
		}, {
			duration: 400,
			easing: tween.easeOut,
			onFinish: function onFinish() {
				tween(warriorGraphics, {
					tint: 0xffffff,
					rotation: 0,
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 200
				});
			}
		});
	}
	game.addChild(warrior);
	warriors.push(warrior);
	LK.getSound('summon').play();
	// Add jump effect to all units when any note is pressed
	// Make all warriors jump
	for (var i = 0; i < warriors.length; i++) {
		var jumpWarrior = warriors[i];
		// Store current Y position if not already stored
		if (jumpWarrior.baseY === 0) {
			jumpWarrior.baseY = jumpWarrior.y;
		}
		// Apply jump tween - go up then back down
		tween(jumpWarrior, {
			y: jumpWarrior.baseY - 100
		}, {
			duration: 200,
			easing: tween.easeOut,
			onFinish: function onFinish() {
				tween(jumpWarrior, {
					y: jumpWarrior.baseY
				}, {
					duration: 200,
					easing: tween.easeIn
				});
			}
		});
	}
	// Make all enemies jump
	for (var i = 0; i < enemies.length; i++) {
		var jumpEnemy = enemies[i];
		// Store current Y position if not already stored
		if (jumpEnemy.baseY === 0) {
			jumpEnemy.baseY = jumpEnemy.y;
		}
		// Apply jump tween - go up then back down
		tween(jumpEnemy, {
			y: jumpEnemy.baseY - 100
		}, {
			duration: 200,
			easing: tween.easeOut,
			onFinish: function onFinish() {
				tween(jumpEnemy, {
					y: jumpEnemy.baseY
				}, {
					duration: 200,
					easing: tween.easeIn
				});
			}
		});
	}
}
function spawnEnemy() {
	var enemy = new Enemy();
	enemy.x = enemyTower.x - 300;
	enemy.y = 2186; // Spawn on ground level
	enemy.onGround = true; // Start on ground
	game.addChild(enemy);
	enemies.push(enemy);
}
function updateTowerHealthBars() {
	var playerHealthPercent = Math.max(0, playerTowerHealth / 30);
	var enemyHealthPercent = Math.max(0, enemyTowerHealth / 10);
	playerTowerHealthBar.scaleX = playerHealthPercent;
	enemyTowerHealthBar.scaleX = enemyHealthPercent;
	// Scale towers based on health - minimum scale of 0.3 (30%), maximum 1.0 (100%)
	var playerTowerScale = 0.3 + playerHealthPercent * 0.7; // 0.3 to 1.0 range
	var enemyTowerScale = 0.3 + enemyHealthPercent * 0.7; // 0.3 to 1.0 range
	// Apply scaling to towers
	tween.stop(playerTower, {
		scaleX: true,
		scaleY: true
	});
	tween.stop(enemyTower, {
		scaleX: true,
		scaleY: true
	});
	tween(playerTower, {
		scaleX: playerTowerScale,
		scaleY: playerTowerScale
	}, {
		duration: 500,
		easing: tween.easeInOut
	});
	tween(enemyTower, {
		scaleX: enemyTowerScale,
		scaleY: enemyTowerScale
	}, {
		duration: 500,
		easing: tween.easeInOut
	});
}
function updateManaDisplay() {
	// Update text
	manaText.setText('Mana: ' + currentMana + '/' + maxMana);
	// Update orb visuals
	for (var i = 0; i < manaOrbs.length; i++) {
		if (i < currentMana) {
			manaOrbs[i].alpha = 1.0; // Full opacity for available mana
			manaOrbs[i].tint = 0x00FFFF; // Cyan color
		} else {
			manaOrbs[i].alpha = 0.3; // Low opacity for depleted mana
			manaOrbs[i].tint = 0x666666; // Gray color
		}
	}
}
function playRandomCombatSound() {
	var combatSounds = ['combatir_1', 'combatir_2', 'combatir_3', 'combatir_4'];
	var randomIndex = Math.floor(Math.random() * combatSounds.length);
	LK.getSound(combatSounds[randomIndex]).play();
}
function sonidoEspadas() {
	LK.getSound('attack').play();
}
function playRandomProjectileSound(element) {
	var projectileSounds = [];
	if (element === 'water') {
		projectileSounds = ['sonido_proyectil_agua_1', 'sonido_proyectil_agua_2', 'sonido_proyectil_agua_3', 'sonido_proyectil_agua_4'];
	} else if (element === 'wind') {
		projectileSounds = ['sonido_proyectil_viento_1', 'sonido_proyectil_viento_2', 'sonido_proyectil_viento_3', 'sonido_proyectil_viento_4'];
	} else if (element === 'light') {
		projectileSounds = ['sonido_proyectil_energia_1', 'sonido_proyectil_energia_2', 'sonido_proyectil_energia_3', 'sonido_proyectil_energia_4'];
	}
	if (projectileSounds.length > 0) {
		var randomIndex = Math.floor(Math.random() * projectileSounds.length);
		LK.getSound(projectileSounds[randomIndex]).play();
	}
}
game.down = function (x, y, obj) {
	// Handle initial touch in game layer directly
	// Store initial touch position for debug
	initialTouchX = x;
	initialTouchY = y;
	currentTouchX = x;
	currentTouchY = y;
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
	}
	if (obj.event && obj.event.button === 2) {
		// Right mouse button
		isDragging = true;
		lastMouseX = x;
		obj.event.preventDefault(); // Prevent context menu
	}
};
leftButton.down = function (x, y, obj) {
	// Move camera left
	cameraX -= 100;
	cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
	game.x = -cameraX;
	// Visual feedback
	tween(leftButton, {
		scaleX: 0.9,
		scaleY: 0.9
	}, {
		duration: 100,
		onFinish: function onFinish() {
			tween(leftButton, {
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 100
			});
		}
	});
};
rightButton.down = function (x, y, obj) {
	// Move camera right
	cameraX += 100;
	cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
	game.x = -cameraX;
	// Visual feedback
	tween(rightButton, {
		scaleX: 0.9,
		scaleY: 0.9
	}, {
		duration: 100,
		onFinish: function onFinish() {
			tween(rightButton, {
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 100
			});
		}
	});
};
game.up = function (x, y, obj) {
	if (obj.event && obj.event.button === 2) {
		// Right mouse button
		isDragging = false;
	}
	// Stop any slider dragging when mouse is released
	if (isDraggingSlider) {
		isDraggingSlider = false;
		activeSlider = null;
	}
};
game.move = function (x, y, obj) {
	if (isDragging) {
		var deltaX = lastMouseX - x;
		cameraX += deltaX;
		cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
		game.x = -cameraX;
		lastMouseX = x;
	}
	// Update current touch position for debug (game coordinates)
	currentTouchX = x;
	currentTouchY = y;
	// Update debug text with both initial and current positions
	if (touchDebugText && typeof touchDebugText.setText === 'function') {
		touchDebugText.setText('Game Move - Initial(' + Math.round(initialTouchX) + ',' + Math.round(initialTouchY) + ') Current(' + Math.round(currentTouchX) + ',' + Math.round(currentTouchY) + ')');
	}
};
// Add GUI move handler for sliders
LK.gui.topLeft.move = function (x, y, obj) {
	// Handle slider dragging using GUI coordinates
	if (isDraggingSlider && activeSlider) {
		var deltaX = x - dragStartX;
		var deltaValue = deltaX / 250; // Convert pixel movement to value change
		var newValue = Math.max(0.0, Math.min(1.0, dragStartValue + deltaValue));
		if (activeSlider === musicSlider) {
			musicValue = newValue;
			updateSliderValue(musicSlider, musicValue, 'Música');
		} else if (activeSlider === soundSlider) {
			soundValue = newValue;
			updateSliderValue(soundSlider, soundValue, 'Sonido');
		} else if (activeSlider === sensitivitySlider) {
			sensitivityValue = newValue;
			updateSliderValue(sensitivitySlider, sensitivityValue, 'Sensibilidad');
			// Update music beat threshold based on sensitivity
			musicBeatThreshold = 0.05 + (1.0 - sensitivityValue) * 0.3;
		}
	}
};
// Cloud system for background decoration
var clouds = [];
var cloudSpawnTimer = 0;
function createCloud() {
	var cloud = new Nube();
	cloud.x = -200; // Start off-screen left
	// Create clouds randomly between y=0 and y=1000 with depth layering
	cloud.y = Math.random() * 2000; // Random position between y=0 and y=2000
	cloud.startFloating(); // Start floating animation after position is set
	// Determine if cloud is background (behind game) or foreground (in front of game)
	var isBackground = Math.random() < 0.6; // 60% chance to be background
	if (isBackground) {
		// Background clouds - behind game elements, more transparent
		// Scale already randomized in Nube constructor, apply additional uniform background scaling
		var additionalScale = 0.5 + Math.random() * 0.6; // Apply additional 50-110% scaling
		cloud.scaleX *= additionalScale;
		cloud.scaleY *= additionalScale;
		cloud.alpha = 0.4 + Math.random() * 0.5; // Random opacity between 40% and 90%
		cloud.children[0].tint = 0xE0E0E0; // Slightly darker for background effect
		// Add background clouds before other game elements
		game.addChildAt(cloud, 0); // Add at index 0 to be behind everything
	} else {
		// Foreground clouds - in front of game elements, more visible
		// Scale already randomized in Nube constructor, apply additional uniform foreground scaling
		var additionalScale = 0.8 + Math.random() * 0.8; // Apply additional 80-160% scaling
		cloud.scaleX *= additionalScale;
		cloud.scaleY *= additionalScale;
		cloud.alpha = 0.4 + Math.random() * 0.5; // Random opacity between 40% and 90%
		cloud.children[0].tint = 0xF8F8F8; // Brighter for foreground effect
		// Add foreground clouds on top of game elements
		game.addChild(cloud); // Add normally to be in front
	}
	// Vary speed based on position for depth effect
	if (cloud.y < 600) {
		// Higher clouds move slower (distance effect)
		cloud.baseSpeed = cloud.baseSpeed * 0.5;
	} else if (cloud.y > 1400) {
		// Lower clouds move faster (proximity effect)
		cloud.baseSpeed = cloud.baseSpeed * 1.5;
	}
	clouds.push(cloud);
}
function updateClouds() {
	// Note: Cloud movement is now handled by the Nube class update method
	// Spawn new clouds periodically
	cloudSpawnTimer++;
	if (cloudSpawnTimer >= 300 + Math.random() * 600) {
		// Every 5-15 seconds
		createCloud();
		cloudSpawnTimer = 0;
	}
}
// Create initial clouds
for (var i = 0; i < 24; i++) {
	// Doubled number for better coverage
	var cloud = new Nube();
	cloud.x = Math.random() * 4000; // Random initial position across screen
	// Create clouds randomly between y=0 and y=1000 with depth layering
	cloud.y = Math.random() * 2000; // Random position between y=0 and y=2000
	cloud.startFloating(); // Start floating animation after position is set
	// Determine if cloud is background (behind game) or foreground (in front of game)
	var isBackground = Math.random() < 0.6; // 60% chance to be background
	if (isBackground) {
		// Background clouds - behind game elements, more transparent
		// Scale already randomized in Nube constructor, apply additional uniform background scaling
		var additionalScale = 0.5 + Math.random() * 0.6; // Apply additional 50-110% scaling
		cloud.scaleX *= additionalScale;
		cloud.scaleY *= additionalScale;
		cloud.alpha = 0.4 + Math.random() * 0.5; // Random opacity between 40% and 90%
		cloud.children[0].tint = 0xE0E0E0; // Slightly darker for background effect
		// Add background clouds before other game elements
		game.addChildAt(cloud, 0); // Add at index 0 to be behind everything
	} else {
		// Foreground clouds - in front of game elements, more visible
		// Scale already randomized in Nube constructor, apply additional uniform foreground scaling
		var additionalScale = 0.8 + Math.random() * 0.8; // Apply additional 80-160% scaling
		cloud.scaleX *= additionalScale;
		cloud.scaleY *= additionalScale;
		cloud.alpha = 0.4 + Math.random() * 0.5; // Random opacity between 40% and 90%
		cloud.children[0].tint = 0xF8F8F8; // Brighter for foreground effect
		// Add foreground clouds on top of game elements
		game.addChild(cloud); // Add normally to be in front
	}
	// Vary speed based on position for depth effect
	if (cloud.y < 600) {
		// Higher clouds move slower (distance effect)
		cloud.baseSpeed = cloud.baseSpeed * 0.5;
	} else if (cloud.y > 1400) {
		// Lower clouds move faster (proximity effect)
		cloud.baseSpeed = cloud.baseSpeed * 1.5;
	}
	clouds.push(cloud);
}
// Start background music with initial volume from slider
LK.playMusic('Music', {
	volume: musicValue
});
game.update = function () {
	// Music beat detection and character synchronization
	var audioLevel = LK.getAudioLevel ? LK.getAudioLevel() : 0;
	// Enhanced beat detection with multiple triggers
	var beatDetected = false;
	// Primary beat detection with very low threshold
	if (audioLevel > musicBeatThreshold && LK.ticks - lastBeatTime > beatCooldown) {
		beatDetected = true;
	}
	// Fallback timer-based beat detection (every 1 second) if audio detection fails
	if (LK.ticks - lastBeatTime > 60 && !beatDetected) {
		beatDetected = true;
	}
	if (beatDetected) {
		// Beat detected - activate effect on all characters
		lastBeatTime = LK.ticks;
		// Activate effect on warriors
		for (var i = 0; i < warriors.length; i++) {
			warriors[i].beatEffectTimer = 120; // 2 seconds of sine wave effect
		}
		// Activate effect on enemies
		for (var i = 0; i < enemies.length; i++) {
			enemies[i].beatEffectTimer = 120; // 2 seconds of sine wave effect
		}
		// Activate particle effects on towers instead of scaling
		// Create particles around player tower in cone shape
		for (var p = 0; p < 24; p++) {
			// Calculate cone angle - wider at the top, narrower at bottom
			var angle = (Math.random() - 0.5) * Math.PI * 0.5; // 90 degree cone spread
			var distance = Math.random() * 300 + 100; // Random distance from center
			var startX = playerTower.x + Math.sin(angle) * (distance * 0.3); // Narrow at bottom
			var endX = playerTower.x + Math.sin(angle) * distance; // Wide at top
			var playerTowerCurrentScale = playerTower.scaleX; // Get current tower scale
			var scaledOffsetY = (1728 - 50) * playerTowerCurrentScale; // Scale the Y offset
			var particle = game.addChild(LK.getAsset('particula_torre_jugador', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: startX + 100,
				y: playerTower.y - scaledOffsetY,
				width: 300 + Math.random() * 200,
				height: 300 + Math.random() * 200,
				rotation: Math.PI
			}));
			particle.alpha = 0.8;
			// Animate particles upward to the sky in cone shape and fade out
			tween(particle, {
				y: playerTower.y - 2000 - Math.random() * 500,
				x: endX + 100,
				alpha: 0,
				scaleX: 0.2,
				scaleY: 0.2
			}, {
				duration: 3000 + Math.random() * 500,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					particle.destroy();
				}
			});
		}
		// Create particles around enemy tower in cone shape
		for (var p = 0; p < 24; p++) {
			// Calculate cone angle - wider at the top, narrower at bottom
			var angle = (Math.random() - 0.5) * Math.PI * 0.5; // 90 degree cone spread
			var distance = Math.random() * 300 + 100; // Random distance from center
			var startX = enemyTower.x + Math.sin(angle) * (distance * 0.3); // Narrow at bottom
			var endX = enemyTower.x + Math.sin(angle) * distance; // Wide at top
			var enemyTowerCurrentScale = enemyTower.scaleX; // Get current tower scale
			var scaledOffsetY = (1728 - 50) * enemyTowerCurrentScale; // Scale the Y offset
			var particle = game.addChild(LK.getAsset('particula_torre_enemiga', {
				anchorX: 0.5,
				anchorY: 0.5,
				x: startX,
				y: enemyTower.y - scaledOffsetY,
				width: 300 + Math.random() * 200,
				height: 300 + Math.random() * 200,
				rotation: Math.PI
			}));
			particle.alpha = 0.8;
			// Animate particles upward to the sky in cone shape and fade out
			tween(particle, {
				y: enemyTower.y - 2000 - Math.random() * 500,
				x: endX,
				alpha: 0,
				scaleX: 0.2,
				scaleY: 0.2
			}, {
				duration: 3000 + Math.random() * 500,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					particle.destroy();
				}
			});
		}
	}
	// Mana regeneration - every 10 seconds (600 frames at 60fps)
	manaRegenTimer++;
	if (manaRegenTimer >= 600) {
		if (currentMana < maxMana) {
			currentMana++;
			updateManaDisplay();
		}
		manaRegenTimer = 0;
	}
	// Spawn enemies periodically
	enemySpawnTimer++;
	if (enemySpawnTimer >= 180) {
		// Every 3 seconds
		spawnEnemy();
		enemySpawnTimer = 0;
	}
	// Clean up off-screen warriors
	for (var i = warriors.length - 1; i >= 0; i--) {
		var warrior = warriors[i];
		if (warrior.x > 4000) {
			warrior.destroy();
			warriors.splice(i, 1);
		}
	}
	// Clean up off-screen enemies
	for (var i = enemies.length - 1; i >= 0; i--) {
		var enemy = enemies[i];
		if (enemy.x < -200) {
			enemy.destroy();
			enemies.splice(i, 1);
		}
	}
	// Update cloud system
	updateClouds();
};

===================================================================
--- original.js
+++ change.js
@@ -1210,83 +1210,107 @@
 // Music slider interaction
 musicSlider.track.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = musicSlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = musicValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 musicSlider.handle.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = musicSlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = musicValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 // Sound slider interaction
 soundSlider.track.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = soundSlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = soundValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 soundSlider.handle.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = soundSlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = soundValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 // Sensitivity slider interaction
 sensitivitySlider.track.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = sensitivitySlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = sensitivityValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 sensitivitySlider.handle.down = function (x, y, obj) {
 	isDraggingSlider = true;
 	activeSlider = sensitivitySlider;
-	// Use local GUI coordinates directly
-	dragStartX = x;
+	// Convert GUI coordinates to global coordinates
+	var globalPos = LK.gui.topLeft.toGlobal({
+		x: x,
+		y: y
+	});
+	dragStartX = globalPos.x;
 	dragStartValue = sensitivityValue;
 	// Store initial touch position for debug
-	initialTouchX = x;
-	initialTouchY = y;
+	initialTouchX = globalPos.x;
+	initialTouchY = globalPos.y;
 	if (touchDebugText && typeof touchDebugText.setText === 'function') {
-		touchDebugText.setText('Touch Info: Initial(' + Math.round(x) + ',' + Math.round(y) + ') Current(' + Math.round(x) + ',' + Math.round(y) + ')');
+		touchDebugText.setText('Touch Info: Initial(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ') Current(' + Math.round(globalPos.x) + ',' + Math.round(globalPos.y) + ')');
 	}
 };
 settingsButton.down = function (x, y, obj) {
 	// Visual feedback with bounce effect