hey can u add background music to this game
with a mute and unmute keybind

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Advanced Adventure Game</title>
    <style>
        body, html {
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #222;
            color: #fff;
            font-family: Arial, sans-serif;
            overflow: hidden;
        }
 
        #game-container {
            position: relative;
            width: 800px;
            height: 400px;
            background-color: #333;
            overflow: hidden;
            border: 2px solid #444;
        }
 
        #game-world {
            position: absolute;
            width: 2400px;
            height: 100%;
            transition: transform 0.1s linear;
        }
 
        #player {
            position: absolute;
            bottom: 0;
            left: 50px;
            width: 30px;
            height: 30px;
            background-color: #4CAF50;
            animation: idle 1s infinite alternate;
        }
 
        @keyframes idle {
            from { transform: translateY(0); }
            to { transform: translateY(2px); }
        }
 
@keyframes charging-prep {
    0%, 100% { box-shadow: 0 0 5px rgba(255, 0, 0, 0.6); }
    50% { box-shadow: 0 0 15px rgba(255, 0, 0, 1); }
}
 
@keyframes boss-shake {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(-5px, 0); }
    50% { transform: translate(5px, 0); }
    75% { transform: translate(-5px, 0); }
}
 
 
@keyframes charge-trail {
    0% { opacity: 0.8; transform: scale(1); }
    100% { opacity: 0; transform: scale(2); }
}
 
@keyframes boss-shield-glow {
    0%, 100% { box-shadow: 0 0 10px red; }
    50% { box-shadow: 0 0 20px red; }
}
 
        .character, .boss-door, .power-up, .enemy, .obstacle, .bullet, .burst, .boss, #friend, .coin, .flying-enemy, .charging-enemy, .stealth-enemy, .split-enemy, .sniper-enemy, .regen-enemy, .explosive-enemy, .teleporter-enemy, .mourning-enemy, .velocity-enemy, .sticky-enemy, .reflective-enemy {
            position: absolute;
        }
 
        .character, .king, .stealth-enemy, .split-enemy, .sniper-enemy, .regen-enemy, .explosive-enemy,
        .teleporter-enemy, .mourning-enemy, .velocity-enemy, .sticky-enemy, .reflective-enemy {
            border-radius: 50%;
        }
 
.charging-prep {
    animation: charging-prep 1s infinite alternate;
}
 
.boss-shielded {
    animation: boss-shield-glow 0.8s infinite alternate;
    border: 3px solid red;
}
 
.charging-active {
    box-shadow: 0 0 15px red, 0 0 30px red;
    border: 2px solid red;
}
 
.charge-trail {
    position: absolute;
    width: 35px;
    height: 35px;
    background-color: rgba(255, 50, 50, 0.5);
    border-radius: 50%;
    opacity: 1;
    animation: charge-trail 0.4s ease-out;
}
 
.bullet-trail {
    position: absolute;
    width: 8px;
    height: 4px;
    background-color: rgba(255, 215, 0, 0.5);
    opacity: 1;
    transition: opacity 0.3s ease-out;
}
 
 
        .coin {
            width: 15px;
            height: 15px;
            background-color: #FFD700;
            border-radius: 50%;
            animation: spin 2s linear infinite;
        }
 
        @keyframes spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
 
        .flying-enemy {
            width: 30px;
            height: 30px;
            background-color: #0099FF;
            border-radius: 50%;
            opacity: 0.9;
        }
 
        .charging-enemy {
            width: 40px;
            height: 40px;
            background-color: #FF5500;
            animation: charge 1s linear infinite alternate;
            border-radius: 50%;
        }
 
        .enemy {
            width: 25px;
            height: 25px;
            background-color: #FF5733;
        }
 
        .obstacle {
            width: 30px;
            height: 30px;
            background-color: #f44336;
        }
 
        .power-up {
            width: 20px;
            height: 20px;
        }
 
        .bullet {
            width: 10px;
            height: 5px;
            background-color: #FFD700;
        }
 
        .burst {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background-color: rgba(255, 69, 0, 0.7);
            animation: burst 0.5s ease-out;
        }
 
        @keyframes burst {
            from { transform: scale(0.5); opacity: 1; }
            to { transform: scale(1.5); opacity: 0; }
        }
 
        .boss-door {
            width: 30px;
            height: 60px;
            background-color: #FFFF00;
        }
 
        .burst {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background-color: rgba(255, 69, 0, 0.7);
            animation: burst 0.5s ease-out;
        }   
 
        .boss {
            width: 60px;
            height: 60px;
            background-color: #FF4500;
        }
 
        #score, #lives, #level, #timer {
            position: absolute;
            top: 10px;
            font-size: 16px;
        }
 
 
 
        #score { left: 10px; }
        #lives { right: 10px; }
        #level { left: 150px; }
        #timer { left: 250px; }
 
        #instructions, #cutscene, #level-intro, #boss-fight, #boss-hallway, #game-over, #interact-message {
            position: absolute;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: rgba(0, 0, 0, 0.8);
            color: #fff;
            flex-direction: column;
            font-size: 18px;
            z-index: 10;
        }
 
        #instructions button, #cutscene button, #level-intro button, #boss-fight button, #game-over button, #boss-hallway button {
            margin-top: 10px;
            padding: 10px 20px;
            font-size: 16px;
            cursor: pointer;
            background-color: #555;
            color: #fff;
        }
 
        #cutscene, #level-intro, #boss-fight, #boss-hallway, #game-over, #interact-message {
            display: none;
        }
 
        #intro {
            position: absolute;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: space-around;
            align-items: center;
            background-color: rgba(0, 0, 0, 0.8);
            color: #fff;
            flex-direction: row;
            font-size: 18px;
            z-index: 11;
        }
 
        #boss-health-bar {
            position: absolute;
            top: 10px;
            left: 50%;
            transform: translateX(-50%);
            width: 150px;
            height: 20px;
            background-color: #666;
            border: 1px solid #333;
            display: none;
        }
 
        #boss-health {
            height: 100%;
            width: 100%;
            background-color: #FF0000;
        }
 
        #friend {
            width: 30px;
            height: 30px;
            background-color: #00FF00;
            display: none;
        }
 
        #power-up-message {
            position: absolute;
            top: 50px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 24px;
            z-index: 12;
            display: none;
        }
 
        /* New CSS for cool features */
        @keyframes flash {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.5; }
        }
 
        .flashing {
            animation: flash 0.5s infinite;
        }
 
        .glow {
            box-shadow: 0 0 10px rgba(255,255,255,0.5);
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="game-world">
            <div id="player"></div>
        </div>
        <div id="score">Score: 0</div>
        <div id="lives">Lives: 3</div>
        <div id="level">Level: 1</div>
        <div id="timer">Timer: 0</div>
        <div id="instructions">
            <p>Press Arrow Up to Jump</p>
            <p>Use Arrow Left/Right to Move</p>
            <p>Press Space to Shoot</p>
            <p>Press Z for Power-Up</p>
            <p>Press E to interact</p>
            <button onclick="startGame()">Start Game</button>
            <button onclick="togglePause()">Pause/Resume</button>
        </div>
        <div id="cutscene">
            <p>Get ready for the next level!</p>
            <button onclick="continueGame()">Continue</button>
        </div>
        <div id="level-intro">
            <p id="level-text">Level 1: Get Ready for Adventure!</p>
            <button onclick="startLevel()">Start Level</button>
        </div>
        <div id="boss-fight">
            <p>Defeat the Boss!</p>
        </div>
        <div id="game-over">
            <p>Game Over!</p>
            <button onclick="restartGame()">Restart</button>
        </div>
        <div id="boss-hallway">
            <p>You have entered the boss hallway! Prepare yourself!</p>
            <button onclick="startBossFight()">Proceed</button>
        </div>
        <div id="boss-health-bar">
            <div id="boss-health"></div>
        </div>
        <div id="power-up-message"></div>
        <div id="interact-message"></div>
        <div id="friend"></div>
    </div>
 
    <script>
            const gameContainer = document.getElementById('game-container');
            const gameWorld = document.getElementById('game-world');
            const player = document.getElementById('player');
            const scoreDisplay = document.getElementById('score');
            const livesDisplay = document.getElementById('lives');
            const levelDisplay = document.getElementById('level');
            const timerDisplay = document.getElementById('timer');
            const instructions = document.getElementById('instructions');
            const cutscene = document.getElementById('cutscene');
            const levelIntro = document.getElementById('level-intro');
            const levelText = document.getElementById('level-text');
            const bossFightScreen = document.getElementById('boss-fight');
            const gameOverScreen = document.getElementById('game-over');
            const intro = document.getElementById('intro');
            const dialoguePara = document.querySelector('#dialogue p');
            const bossHallway = document.getElementById('boss-hallway');
            const bossHealthBar = document.getElementById('boss-health-bar');
            const bossHealthDisplay = document.getElementById('boss-health');
            const powerUpMessage = document.getElementById('power-up-message');
            const interactMessage = document.getElementById('interact-message');
            const friend = document.getElementById('friend');
 
            let playerPositionX = 50;
            let playerPositionY = 0;
            let playerVelocityX = 0;
            let playerVelocityY = 0;
            let playerMaxSpeed = 5;
            const playerJumpStrength = 12;
            let jumpCount = 0;
            const maxJumps = 2;
            let isDoubleJumpEnabled = false;
            let isJumping = false;
            let isPaused = false;
            let canShoot = true;
            let bossAttacking = false;
            let bossAttackPhase = 0;
            let gameInterval;
            let obstacles = [];
            let enemies = [];
            let bullets = [];
            let powerUps = [];
            let platforms = [];
            let bossDoors = [];
            let coins = [];
            let score = 0;
            let lives = 3;
            let level = localStorage.getItem('playerLevel') ? parseInt(localStorage.getItem('playerLevel')) : 1;
            const gravity = 0.5;
            const maxLevels = 5;
            let movingLeft = false, movingRight = false;
            let currentDirection = 1;
            let currentPowerUp = null;
            let powerUpTimer = 0;
            let gameScrollPosition = 0;
            const bossScoreThreshold = 500;
            const dialogues = [
                "Player: Hey friend! What a nice day for an adventure!",
                "Friend: Indeed! Maybe we should explore the caves.",
                "Player: What's that over there? Is it the King?",
                "King: Haha, I've found you! You're coming with me!",
                "Friend: Player, help me!"
            ];
            let dialogueIndex = 0;
            let boss = null;
            let bossHealth = 100;
            let bossShielded = true;
            let bossPowerObtained = false;
            let bossFightActive = false;
 
            const allPowerUpTypes = [
                "super-speed", "invincibility", "teleportation", "time-freeze", 
                "gravity-reversal", "reflective-shield", "double-shot", "extra-life", 
                "score-boost", "mega-jump", "ice", "fire", "levitate", "hypno", "shield", 
                "regeneration", "ghost", "magnet", "invisibility", "freeze", "clone", 
                "shockwave", "energy", "shrink", "grow", "heal", "boss-power-up", 
                "speed-bullet", "rapid-fire", "spike", "anti-gravity", "energy-blast",
                "light-speed", "blazing-trail", "sonic-wave", "armor", "telekinetic",
                "camouflage", "dimension-shift", "energy-drain", "mind-control",
                "hologram"
            ];
 
            window.addEventListener('keydown', handleKeydown);
            window.addEventListener('keyup', handleKeyup);
 
function handleKeydown(e) {
    switch (e.key) {
        case 'ArrowLeft':
            movingLeft = true;
            currentDirection = -1;
            break;
        case 'ArrowRight':
            movingRight = true;
            currentDirection = 1;
            break;
        case 'ArrowUp':
            handleJump();
            break;
        case ' ':
            if (canShoot) {
                shootBullet(currentDirection);
                canShoot = false;
                setTimeout(() => canShoot = true, 300);
            }
            break;
        case 'z':
        case 'Z':
            if (bossPowerObtained) {
                // If the boss power-up is active, start charging laser
                isCharging = true;
                chargeTime = 0;
            } else {
                // If no boss power-up, use normal ability
                usePowerUp();
            }
            break;
        case 'e':
        case 'E':
            if (bossPowerObtained && summonCooldown <= 0) {
                summonAllies();
                summonCooldown = 10;
            }
            break;
    }
}
 
function handleKeyup(e) {
    switch (e.key) {
        case 'ArrowLeft':
            movingLeft = false;
            break;
        case 'ArrowRight':
            movingRight = false;
            break;
        case 'z':
        case 'Z':
            if (bossPowerObtained && isCharging) {
                isCharging = false;
                shootLaserBlast(chargeTime);
            }
            break;
    }
}
 
 
 
            function handleJump() {
                if (playerPositionY <= 0 || (isDoubleJumpEnabled && jumpCount < maxJumps)) {
                    playerVelocityY = playerJumpStrength;
                    jumpCount++;
                    isJumping = true;
                }
            }
 
            function nextDialogue() {
                if (dialogueIndex < dialogues.length - 1) {
                    dialogueIndex++;
                    dialoguePara.textContent = dialogues[dialogueIndex];
                } else {
                    intro.style.display = 'none';
                    startGame();
                }
            }
 
            function shootBullet(direction) {
                const bullet = createBullet(direction);
                bullets.push({ element: bullet, direction });
                gameWorld.appendChild(bullet);
 
                if (currentPowerUp === 'double-shot') {
                    const altBullet = createBullet(direction + 1);
                    bullets.push({ element: altBullet, direction });
                    gameWorld.appendChild(altBullet);
                }
 
                if (currentPowerUp === 'speed-bullet') {
                    const sideBullet1 = createBullet(direction + 6);
                    const sideBullet2 = createBullet(direction - 6);
                    bullets.push({ element: sideBullet1, direction });
                    bullets.push({ element: sideBullet2, direction });
                    gameWorld.appendChild(sideBullet1);
                    gameWorld.appendChild(sideBullet2);
                }
            }
 
            function createBurst(x, y) {
                const burst = document.createElement('div');
                burst.classList.add('burst');
                burst.style.left = x + 'px';
                burst.style.bottom = y + 'px';
                gameWorld.appendChild(burst);
                setTimeout(() => burst.remove(), 500);
            }
 
function moveCamera() {
    gameScrollPosition = Math.max(0, playerPositionX - (gameContainer.offsetWidth / 2));
    gameWorld.style.transform = `translateX(${-gameScrollPosition}px)`;
}
 
let summonCooldown = 0;
 
function summonAllies() {
    for (let i = 0; i < 3; i++) {
        let ally = createElement('ally', [], parseInt(player.style.left) + (i * 30));
        ally.style.bottom = player.style.bottom;
        gameWorld.appendChild(ally);
 
        let destroyCount = 0;
        let moveInterval = setInterval(() => {
            ally.style.left = (parseInt(ally.style.left) + 5) + 'px';
 
            enemies.forEach((enemy, index) => {
                if (checkCollision(ally, enemy) && destroyCount < 3) {
                    enemy.remove();
                    enemies.splice(index, 1);
                    destroyCount++;
                }
            });
 
            if (destroyCount >= 3) {
                ally.remove();
                clearInterval(moveInterval);
            }
        }, 50);
 
        setTimeout(() => {
            ally.remove();
            clearInterval(moveInterval);
        }, 5000);
    }
}
 
 
 
function createBulletTrail(x, y) {
    const trail = document.createElement('div');
    trail.classList.add('bullet-trail');
    trail.style.left = x + 'px';
    trail.style.bottom = y + 'px';
    gameWorld.appendChild(trail);
 
    setTimeout(() => {
        trail.style.opacity = '0';
        setTimeout(() => trail.remove(), 300);
    }, 50);
}
 
function moveBullets() {
    bullets.forEach((bulletObj, index) => {
        const bullet = bulletObj.element;
        const newX = parseInt(bullet.style.left) + (bulletObj.direction * 5);
        bullet.style.left = newX + 'px';
 
        // Add trail effect
        createBulletTrail(newX, parseInt(bullet.style.bottom));
 
        if (newX > gameScrollPosition + gameContainer.offsetWidth || newX < 0) {
            bullet.remove();
            bullets.splice(index, 1);
        } else {
            enemies.forEach((enemy, enemyIndex) => {
                if (checkCollision(bullet, enemy)) {
                    handleEnemyHit(enemy, enemyIndex);
                    createBurst(parseInt(bullet.style.left), parseInt(bullet.style.bottom)); // Impact effect
                    bullet.remove();
                    bullets.splice(index, 1);
                }
            });
            checkBossHit();
        }
    });
}
 
 
            function handleEnemyHit(enemy, enemyIndex) {
                if (enemy.classList.contains('explosive-enemy')) {
                    handleExplosiveEnemyHit(enemy, enemyIndex);
                } else if (enemy.classList.contains('split-enemy') && !enemy.classList.contains('split')) {
                    handleSplitterEnemyHit(enemy, enemyIndex);
                } else {
                    enemy.remove();
                    enemies.splice(enemyIndex, 1);
                    score += 10;
                    updateDisplay();
                }
            }
 
            function startGame() {
                gameOverScreen.style.display = 'none';
                instructions.style.display = 'none';
                resetGame();
                levelIntro.style.display = 'flex';
            }
 
            function startLevel() {
                levelIntro.style.display = 'none';
                gameInterval = setInterval(gameLoop, 1000 / 60);
            }
 
            function resetGame() {
                lives = 3;
                playerPositionX = 50;
                playerPositionY = 0;
                playerVelocityX = 0;
                playerVelocityY = 0;
                isJumping = false;
                jumpCount = 0;
                isDoubleJumpEnabled = false;
                gameScrollPosition = 0;
                clearAllElements();
                switchLevelBackground();
                level = parseInt(localStorage.getItem('playerLevel') || 1);
                updateDisplay();
            }
 
            function updateDisplay() {
                scoreDisplay.textContent = `Score: ${score}`;
                livesDisplay.textContent = `Lives: ${lives}`;
                levelDisplay.textContent = `Level: ${level}`;
                timerDisplay.textContent = `Timer: ${powerUpTimer}`;
            }
 
            function updatePlayerPosition() {
                if (movingLeft) {
                    playerVelocityX = -playerMaxSpeed;
                } else if (movingRight) {
                    playerVelocityX = playerMaxSpeed;
                } else {
                    playerVelocityX = 0;
                }
 
                playerPositionX += playerVelocityX;
                playerPositionX = Math.max(0, Math.min(gameWorld.offsetWidth - player.offsetWidth, playerPositionX));
                player.style.left = playerPositionX + 'px';
 
                let onPlatform = false;
                platforms.forEach(platform => {
                    if (checkCollision(player, platform) && playerVelocityY < 0) {
                        playerPositionY = parseInt(platform.style.bottom) + platform.offsetHeight;
                        playerVelocityY = 0;
                        isJumping = false;
                        jumpCount = 0;
                        onPlatform = true;
                    }
                });
 
                if (!onPlatform || isJumping || playerPositionY > 0) {
                    playerVelocityY -= gravity;
                    playerPositionY += playerVelocityY;
                    if (playerPositionY <= 0) {
                        playerPositionY = 0;
                        isJumping = false;
                        jumpCount = 0;
                    }
                }
 
                player.style.bottom = playerPositionY + 'px';
                moveCamera();
            }
 
            function spawnEntities() {
                if (!isPaused && !bossFightActive) {
                    if (Math.random() < 0.003) spawnObstacle();
                    if (Math.random() < 0.005) spawnEnemy();
                    if (Math.random() < 0.002 && !currentPowerUp) spawnPowerUp();
                    if (Math.random() < 0.001) spawnPlatform();
                    if (Math.random() < 0.003) spawnFlyingEnemy();
                    if (Math.random() < 0.002) spawnChargingEnemy();
                    if (Math.random() < 0.003) spawnCoin();
                    if (Math.random() < 0.002) spawnStealthEnemy();
                    if (Math.random() < 0.001) spawnSniperEnemy();
                    if (Math.random() < 0.002) spawnRegeneratingEnemy();
                    if (Math.random() < 0.001) spawnSplitterEnemy();
                    if (bossDoors.length === 0 && score >= level * bossScoreThreshold && enemies.length === 0) spawnBossDoor();
                }
            }
 
            function moveElements() {
                moveArray(obstacles, 2, 15);
                moveArray(enemies, 1, 30);
                moveArray(coins, 2, 0);
                moveArray(powerUps, 2, 0, true);
                moveArray(platforms, 1, 0);
                moveFlyingEnemies();
                moveChargingEnemies();
                moveStealthEnemies();
                moveBullets();
                moveNewEnemies();
            }
 
            function spawnObstacle() {
                const obstacle = createElement('obstacle', obstacles, gameScrollPosition + gameContainer.offsetWidth);
                obstacle.style.bottom = '0px';
            }
 
            function spawnEnemy() {
                const baseEnemy = createElement('enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                baseEnemy.style.bottom = '0px';
 
                const chance = Math.random();
                if (chance < 0.3) {
                    spawnTeleporterEnemy();
                } else if (chance < 0.6) {
                    spawnMourningEnemy();
                } else if (chance < 0.7) {
                    spawnVelocityEnemy();
                } else if (chance < 0.9) {
                    spawnStickyEnemy();
                } else {
                    spawnReflectiveEnemy();
                }
            }
 
            function spawnPowerUp() {
                const powerUpTypes = allPowerUpTypes;
                const type = powerUpTypes[Math.floor(Math.random() * powerUpTypes.length)];
                const powerUp = createElement('power-up', powerUps, gameScrollPosition + gameContainer.offsetWidth);
                powerUp.setAttribute('data-type', type);
                powerUp.style.backgroundColor = getPowerUpColor(type);
                powerUp.style.bottom = Math.floor(Math.random() * 100) + 'px';
            }
 
            function spawnCoin() {
                const coin = createElement('coin', coins, gameScrollPosition + gameContainer.offsetWidth);
                coin.style.bottom = Math.floor(Math.random() * 50 + 50) + 'px';
            }
 
            function getPowerUpColor(type) {
                switch (type) {
                    case 'super-speed': return 'lime';
                    case 'invincibility': return 'gold';
                    case 'teleportation': return 'violet';
                    case 'time-freeze': return 'cyan';
                    case 'gravity-reversal': return 'magenta';
                    case 'reflective-shield': return 'aqua';
                    case 'double-shot': return 'red';
                    case 'extra-life': return 'lightgreen';
                    case 'score-boost': return 'coral';
                    case 'mega-jump': return 'fuchsia';
                    case 'ice': return 'blue';
                    case 'fire': return 'red';
                    case 'levitate': return 'turquoise';
                    case 'hypno': return 'pink';
                    case 'shield': return 'silver';
                    case 'regeneration': return 'lightgreen';
                    case 'ghost': return 'lightgrey';
                    case 'magnet': return 'darkgoldenrod';
                    case 'invisibility': return 'lightsteelblue';
                    case 'freeze': return 'lightblue';
                    case 'clone': return 'orchid';
                    case 'shockwave': return 'turquoise';
                    case 'energy': return 'yellow';
                    case 'shrink': return 'aquamarine';
                    case 'grow': return 'salmon';
                    case 'heal': return 'chartreuse';
                    case 'boss-power-up': return 'darkorange';
                    default: return 'white';
                }
            }
 
            function spawnPlatform() {
                const platform = createElement('platform', platforms, gameScrollPosition + gameContainer.offsetWidth);
                platform.style.bottom = Math.floor(Math.random() * 200 + 100) + 'px';
            }
 
            function spawnBossDoor() {
                const bossDoor = createElement('boss-door', bossDoors, gameScrollPosition + gameContainer.offsetWidth + 200);
                bossDoor.style.bottom = '0px';
            }
 
            function createElement(className, array, leftPosition, type = '') {
                const element = document.createElement('div');
                element.classList.add(className);
                if (type) element.setAttribute('data-type', type);
                element.style.left = leftPosition + 'px';
                gameWorld.appendChild(element);
                array.push(element);
                return element;
            }
 
function moveArray(array, speed, scoreValue, isPowerUp = false) {
    array.forEach((el, index) => {
        el.style.left = (parseInt(el.style.left) - speed) + 'px';
        if (parseInt(el.style.left) < gameScrollPosition - el.offsetWidth) {
            removeElement(el, array, index, 0);
        } else if (checkCollision(player, el)) {
            handleCollision(el, array, index, scoreValue, isPowerUp);
        }
    });
}
 
            function removeElement(el, array, index, scoreValue) {
                el.remove();
                array.splice(index, 1);
                if (scoreValue) {
                    score += scoreValue;
                    updateDisplay();
                }
            }
 
            function handleCollision(el, array, index, scoreValue, isPowerUp = false) {
                if (el.classList.contains('coin')) {
                    score += 5;
                    updateDisplay();
                } else if (isPowerUp) {
                    applyPowerUp(el);
                } else if (el.classList.contains('boss-door') && score >= level * bossScoreThreshold) {
                    interactMessage.textContent = "Press 'E' to enter boss door.";
                    interactMessage.style.display = checkCollision(player, el) ? 'block' : 'none';
                    if (checkCollision(player, el) && playerPositionX >= parseInt(el.style.left)) {
                        openBossHallway();
                    }
                } else if (el.classList.contains('enemy') || el.classList.contains('obstacle')) {
                    reduceLives();
                }
                removeElement(el, array, index, scoreValue);
            }
 
            function applyPowerUp(el) {
                if (currentPowerUp || currentPowerUp === 'boss-power-up') return;
 
                const type = el.getAttribute('data-type');
                if (type === 'boss-power-up') {
                    grantBossPowerUp();
                } else {
                    currentPowerUp = type;
                    let duration = 10;
                    activatePowerUp(type);
                    powerUpTimer = duration;
 
                    const powerUpInterval = setInterval(() => {
                        powerUpTimer--;
                        if (powerUpTimer <= 0) {
                            clearInterval(powerUpInterval);
                            resetPowerUp();
                        }
                        updateDisplay();
                    }, 1000);
                }
 
                displayPowerUpMessage(type);
            }
 
            function activatePowerUp(type) {
                switch (type) {
                    case 'super-speed':
                        player.style.backgroundColor = 'lime';
                        playerMaxSpeed = 8;
                        break;
                    case 'invincibility':
                        player.style.backgroundColor = 'gold';
                        break;
                    case 'teleportation':
                        teleportPlayer();
                        break;
                    case 'time-freeze':
                        activateRegenerativeTime();
                        break;
                    case 'gravity-reversal':
                        toggleGravity();
                        break;
                    case 'reflective-shield':
                        activateReflectiveShield();
                        break;
                    case 'double-shot':
                        enableDoubleShot();
                        break;
                    case 'extra-life':
                        gainExtraLife();
                        break;
                    case 'score-boost':
                        boostScore();
                        break;
                    case 'mega-jump':
                        activateMegaJump();
                        break;
                    case 'energy-blast':
                        activateEnergyBlast();
                        break;
                    case 'light-speed':
                        activateLightSpeed();
                        break;
                    case 'blazing-trail':
                        activateBlazingTrail();
                        break;
                    case 'sonic-wave':
                        activateSonicWave();
                        break;
                    case 'armor':
                        activateArmor();
                        break;
                    case 'telekinetic':
                        activateTelekinetic();
                        break;
                    case 'camouflage':
                        activateCamouflage();
                        break;
                    case 'dimension-shift':
                        activateDimensionShift();
                        break;
                    case 'energy-drain':
                        activateEnergyDrain();
                        break;
                    case 'mind-control':
                        activateMindControl();
                        break;
                    case 'hologram':
                        activateHologram();
                        break;
                    default:
                        player.style.backgroundColor = getPowerUpColor(type);
                        break;
                }
            }
 
            function activateRegenerativeTime() {
                // Similar logic as rewind
            }
 
            function resetPowerUp() {
                currentPowerUp = null;
                player.style.backgroundColor = '#4CAF50';
                playerMaxSpeed = 5;
                player.style.opacity = '1';
                isDoubleJumpEnabled = false;
                clearTimeout(timeSlowTimeout);
                resetGravity();
            }
 
            function displayPowerUpMessage(type) {
                powerUpMessage.textContent = `You obtained ${type.replace(/-/g, ' ')}!`;
                powerUpMessage.style.display = 'block';
                setTimeout(() => powerUpMessage.style.display = 'none', 2000);
            }
 
            function grantBossPowerUp() {
                bossPowerObtained = true;
                powerUpMessage.textContent = "Boss Power-Up Obtained!";
                powerUpMessage.style.display = 'block';
                setTimeout(() => powerUpMessage.style.display = 'none', 2000);
            }
 
            function usePowerUp() {
                if (!currentPowerUp) return;
                switch (currentPowerUp) {
                    case 'ice':
                        shootIce();
                        break;
                    case 'fire':
                        shootFire();
                        break;
                    case 'levitate':
                        useLevitate();
                        break;
                    case 'hypno':
                        shootHypno();
                        break;
                    case 'double-shot':
                        shootDouble();
                        break;
                    default:
                        break;
                }
            }
 
            function shootIce() {
                const iceBullet = createBullet(currentDirection);
                iceBullet.style.backgroundColor = 'blue';
                gameWorld.appendChild(iceBullet);
 
                const iceBulletObj = { element: iceBullet, direction: currentDirection };
                animateBullet(iceBulletObj, 5, (target) => {
                    if (target.classList.contains('obstacle')) {
                        target.classList.add('frozen');
                        target.style.backgroundColor = '#00f';
                        target.style.opacity = '0.5';
                    }
                });
            }
 
            function shootFire() {
                const fireBullet = createBullet(currentDirection);
                fireBullet.style.backgroundColor = 'red';
                gameWorld.appendChild(fireBullet);
 
                const fireBulletObj = { element: fireBullet, direction: currentDirection };
                animateBullet(fireBulletObj, 5, (target) => {
                    if (target.classList.contains('obstacle')) {
                        target.style.transition = 'opacity 0.5s';
                        target.style.opacity = '0';
                        setTimeout(() => target.remove(), 500);
                    }
                });
            }
 
            function useLevitate() {
                player.style.transform = 'translateY(-20px)';
                const levitateUp = setTimeout(() => {
                    player.style.transform = 'translateY(0)';
                    clearTimeout(levitateUp);
                }, 1000);
            }
 
            function enableDoubleShot() {
            }
 
            function createBullet(direction = 1) {
                const bullet = document.createElement('div');
                bullet.classList.add('bullet');
                bullet.style.backgroundColor = '#FFD700';
                bullet.style.left = (playerPositionX + player.offsetWidth / 2 - 5) + 'px';
                bullet.style.bottom = (playerPositionY + player.offsetHeight / 2) + 'px';
                return bullet;
            }
 
            function shootHypno() {
                const hypnoBullet = createBullet(currentDirection);
                hypnoBullet.style.backgroundColor = 'pink';
                gameWorld.appendChild(hypnoBullet);
 
                const hypnoBulletObj = { element: hypnoBullet, direction: currentDirection };
                animateBullet(hypnoBulletObj, 5, (target) => {
                    if (target.classList.contains('enemy') && !target.classList.contains('hypnotized')) {
                        target.classList.add('hypnotized');
                        target.style.backgroundColor = 'pink';
                        hypnotizeEnemy(target);
                    }
                });
            }
 
            function shootDouble() {
                const bullet1 = createBullet(currentDirection);
                const bullet2 = createBullet(currentDirection);
                bullets.push({ element: bullet1, direction: currentDirection });
                bullets.push({ element: bullet2, direction: currentDirection });
                gameWorld.appendChild(bullet1);
                gameWorld.appendChild(bullet2);
            }
 
            function hypnotizeEnemy(enemy) {
                let destroyCount = 0;
                const moveInterval = setInterval(() => {
                    let nearestEnemy = findNearestEnemyTo(enemy);
                    if (!nearestEnemy) {
                        enemy.remove();
                        clearInterval(moveInterval);
                        return;
                    }
 
                    let ex = parseInt(enemy.style.left);
                    let ey = parseInt(enemy.style.bottom);
                    let nex = parseInt(nearestEnemy.style.left);
                    let ney = parseInt(nearestEnemy.style.bottom);
 
                    let dx = nex - ex;
                    let dy = ney - ey;
                    let distance = Math.sqrt(dx * dx + dy * dy);
 
                    if (distance < 5) {
                        destroyCount++;
                        createBurst(nex, ney);
                        nearestEnemy.remove();
                        enemies = enemies.filter(e => e !== nearestEnemy);
 
                        if (destroyCount >= 3) {
                            enemy.remove();
                            clearInterval(moveInterval);
                        }
                    } else {
                        let angle = Math.atan2(dy, dx);
                        enemy.style.left = (ex + Math.cos(angle) * 2) + 'px';
                        enemy.style.bottom = (ey + Math.sin(angle) * 2) + 'px';
                    }
                }, 1000 / 60);
            }
 
            function findNearestEnemyTo(sourceEnemy) {
                let minDistance = Infinity;
                let closestEnemy = null;
 
                enemies.forEach(enemy => {
                    if (enemy !== sourceEnemy) {
                        let distance = calculateDistance(sourceEnemy, enemy);
                        if (distance < minDistance) {
                            minDistance = distance;
                            closestEnemy = enemy;
                        }
                    }
                });
 
                return closestEnemy;
            }
 
            function calculateDistance(el1, el2) {
                let el1Rect = el1.getBoundingClientRect();
                let el2Rect = el2.getBoundingClientRect();
                let dx = (el1Rect.left + el1Rect.width / 2) - (el2Rect.left + el2Rect.width / 2);
                let dy = (el1Rect.top + el1Rect.height / 2) - (el2Rect.top + el2Rect.height / 2);
                return Math.sqrt(dx * dx + dy * dy);
            }
 
            function enableDoubleJump(enable = true) {
                isDoubleJumpEnabled = enable;
            }
 
            function teleportPlayer() {
                player.style.backgroundColor = 'blueviolet';
                setTimeout(() => {
                    playerPositionX += 300 * currentDirection;
                    playerPositionX = Math.max(0, Math.min(gameWorld.offsetWidth - player.offsetWidth, playerPositionX));
                    player.style.left = playerPositionX + 'px';
                }, 500);
            }
 
            function toggleGravity() {
                const originalGravity = gravity;
                gravity = -gravity;
                setTimeout(() => {
                    gravity = originalGravity;
                }, 5000);
            }
 
            function resetGravity() {
                gravity = Math.abs(gravity);
            }
 
            function freezeEnemies() {
                enemies.forEach(enemy => {
                    enemy.style.transition = 'opacity 1s';
                    enemy.style.opacity = '0.2';
                    enemy.classList.add('frozen-enemy');
                });
                setTimeout(() => {
                    enemies.forEach(enemy => {
                        enemy.style.opacity = '1';
                        enemy.classList.remove('frozen-enemy');
                    });
                }, 5000);
            }
 
            function createClone() {
                const clone = createElement('player', [], playerPositionX + 50);
                clone.style.bottom = playerPositionY + 'px';
                clone.style.backgroundColor = '#00F';
                clone.style.border = '2px dashed #FFF';
                gameWorld.appendChild(clone);
                setTimeout(() => clone.remove(), 5000);
            }
 
            function triggerShockwave() {
                const shockwaveRadius = 100;
                enemies.forEach(enemy => {
                    const dist = calculateDistance(player, enemy);
                    if (dist < shockwaveRadius) {
                        createBurst(parseInt(enemy.style.left), parseInt(enemy.style.bottom));
                        enemy.remove();
                    }
                });
            }
 
            function absorbEnergy() {
                score += 50;
                updateDisplay();
            }
 
            function shrinkPlayer() {
                player.style.transform = 'scale(0.5)';
                setTimeout(() => player.style.transform = 'scale(1)', 5000);
            }
 
            function growPlayer() {
                player.style.transform = 'scale(1.5)';
                setTimeout(() => player.style.transform = 'scale(1)', 5000);
            }
 
            function healPlayer() {
                if (lives < 5) {
                    lives++;
                    updateDisplay();
                }
            }
 
            function activateShield() {
                player.style.border = '3px solid purple';
                player.style.opacity = '0.6';
                lives = Math.min(lives + 1, 5);
                updateDisplay();
            }
 
            function gainExtraLife() {
                lives = Math.min(lives + 1, 5);
                updateDisplay();
            }
 
            function boostScore() {
                score += 100;
                updateDisplay();
            }
 
            function activateMegaJump() {
                playerVelocityY = playerJumpStrength * 1.5;
                isJumping = true;
            }
 
            function activateReflectiveShield() {
                player.style.border = '3px dashed cyan';
                const reflectInterval = setInterval(() => {
                    bullets.forEach((bullet, index) => {
                        if (checkCollision(player, bullet.element)) {
                            bullet.direction *= -1;
                        }
                    });
                }, 1000 / 60);
 
                setTimeout(() => {
                    player.style.border = '';
                    clearInterval(reflectInterval);
                }, 5000);
            }
 
            function activateRegeneration() {
                const regenerationInterval = setInterval(() => {
                    if (lives < 5) lives++;
                    updateDisplay();
                    if (!currentPowerUp || currentPowerUp !== 'regeneration') {
                        clearInterval(regenerationInterval);
                    }
                }, 2000);
            }
 
            function activateMagnet() {
                const magnetInterval = setInterval(() => {
                    coins.forEach(coin => {
                        const coinX = parseInt(coin.style.left);
                        const coinY = parseInt(coin.style.bottom);
                        const dx = playerPositionX - coinX;
                        const dy = playerPositionY - coinY;
                        if (Math.sqrt(dx * dx + dy * dy) < 100) {
                            coin.style.left = (coinX + dx * 0.1) + 'px';
                            coin.style.bottom = (coinY + dy * 0.1) + 'px';
                        }
                    });
 
                    if (!currentPowerUp || currentPowerUp !== 'magnet') {
                        clearInterval(magnetInterval);
                    }
                }, 1000/ 60);
            }
 
            let timeSlowTimeout;
 
            function slowDownTime() {
                const originalTiming = 1000 / 60;
                clearInterval(gameInterval);
                gameInterval = setInterval(gameLoop, originalTiming * 2);
                timeSlowTimeout = setTimeout(() => {
                    clearInterval(gameInterval);
                    gameInterval = setInterval(gameLoop, originalTiming);
                }, 5000);
            }
 
            function activateEnergyBlast() {
                const blastRadius = 100;
                let enemiesToRemove = enemies.filter(enemy => calculateDistance(player, enemy) < blastRadius);
                enemiesToRemove.forEach(enemy => {
                    createBurst(parseInt(enemy.style.left), parseInt(enemy.style.bottom));
                    enemy.remove();
                    enemies = enemies.filter(e => e !== enemy);
                });
                updateDisplay();
            }
 
            function activateLightSpeed() {
                playerMaxSpeed = 20;
                setTimeout(() => playerMaxSpeed = 5, 5000);
            }
 
            function activateBlazingTrail() {
                const trailInterval = setInterval(() => {
                    const trail = document.createElement('div');
                    trail.className = 'bullet';
                    trail.style.left = (playerPositionX + player.offsetWidth / 2) + 'px';
                    trail.style.bottom = (playerPositionY + player.offsetHeight / 2) + 'px';
                    trail.style.backgroundColor = 'orange';
                    gameWorld.appendChild(trail);
                    setTimeout(() => trail.remove(), 500);
                }, 100);
 
                setTimeout(() => clearInterval(trailInterval), 5000);
            }
 
            function activateSonicWave() {
                const wave = document.createElement('div');
                wave.className = 'burst';
                wave.style.left = playerPositionX + 'px';
                wave.style.bottom = playerPositionY + 'px';
                wave.style.backgroundColor = 'cyan';
                wave.style.width = '100px';
                wave.style.height = '100px';
                gameWorld.appendChild(wave);
                setTimeout(() => wave.remove(), 500);
                enemies.forEach(enemy => {
                    if (calculateDistance(player, enemy) < 50) {
                        createBurst(parseInt(enemy.style.left), parseInt(enemy.style.bottom));
                        enemy.remove();
                    }
                });
            }
 
            function activateArmor() {
                player.style.border = '3px solid steelblue';
                lives = Math.min(lives + 3, 5);
                updateDisplay();
            }
 
            function activateTelekinetic() {
                const forceInterval = setInterval(() => {
                    enemies.forEach(enemy => {
                        const enemyX = parseInt(enemy.style.left);
                        const enemyY = parseInt(enemy.style.bottom);
                        const dx = playerPositionX - enemyX;
                        const dy = playerPositionY - enemyY;
                        if (Math.sqrt(dx * dx + dy * dy) < 100) {
                            enemy.style.left = (enemyX + dx * 0.1) + 'px';
                            enemy.style.bottom = (enemyY + dy * 0.1) + 'px';
                        }
                    });
                }, 1000 / 60);
 
                setTimeout(() => clearInterval(forceInterval), 5000);
            }
 
            function activateCamouflage() {
                player.style.opacity = '0.2';
                setTimeout(() => player.style.opacity = '1', 5000);
            }
 
            function activateDimensionShift() {
                gameWorld.style.backgroundColor = 'black';
                setTimeout(() => gameWorld.style.backgroundColor = '', 5000);
            }
 
            function activateEnergyDrain() {
                const drainInterval = setInterval(() => {
                    if (score > 0) {
                        score -= 1;
                        updateDisplay();
                    }
                }, 100);
 
                setTimeout(() => clearInterval(drainInterval), 5000);
            }
 
            function activateMindControl() {
                enemies.forEach(enemy => {
                    if (!enemy.classList.contains('hypnotized')) {
                        enemy.classList.add('hypnotized');
                        enemy.style.backgroundColor = 'violet';
                        hypnotizeEnemy(enemy);
                    }
                });
            }
 
            function activateHologram() {
                const hologram = document.createElement('div');
                hologram.className = 'player';
                hologram.style.left = (playerPositionX - 50) + 'px';
                hologram.style.bottom = playerPositionY + 'px';
                hologram.style.backgroundColor = 'rgba(0, 0, 255, 0.5)';
                gameWorld.appendChild(hologram);
                setTimeout(() => hologram.remove(), 5000);
            }
 
            function animateBullet(bulletObj, speed, impactCallback = () => {}) {
                const bulletInterval = setInterval(() => {
                    const bullet = bulletObj.element;
                    bullet.style.left = (parseInt(bullet.style.left) + (bulletObj.direction * speed)) + 'px';
                    if (parseInt(bullet.style.left) > gameScrollPosition + gameContainer.offsetWidth || parseInt(bullet.style.left) < 0) {
                        bullet.remove();
                        clearInterval(bulletInterval);
                    } else {
                        [...obstacles, ...enemies].forEach(target => {
                            if (checkCollision(bullet, target)) {
                                impactCallback(target);
                                createBurst(parseInt(bullet.style.left), parseInt(bullet.style.bottom));
                                bullet.remove();
                                clearInterval(bulletInterval);
                            }
                        });
                    }
                }, 1000 / 60);
            }
 
            function reduceLives() {
                if (player.style.border) {
                    player.style.border = '';
                    player.style.opacity = '1';
                } else {
                    lives--;
                    if (lives <= 0) endGame(false);
                }
                updateDisplay();
            }
 
            function checkCollision(rect1, rect2) {
                const rect1Bounds = rect1.getBoundingClientRect();
                const rect2Bounds = rect2.getBoundingClientRect();
                return !(rect1Bounds.top > rect2Bounds.bottom || rect1Bounds.bottom < rect2Bounds.top ||
                        rect1Bounds.left > rect2Bounds.right || rect1Bounds.right < rect2Bounds.left);
            }
 
            function togglePause() {
                if (isPaused) {
                    gameInterval = setInterval(gameLoop, 1000 / 60);
                    isPaused = false;
                } else {
                    clearInterval(gameInterval);
                    isPaused = true;
                }
            }
 
            function clearAllElements() {
                [obstacles, enemies, bullets.map(b => b.element), powerUps, platforms, bossDoors, coins]
                    .forEach(arr => {
                        arr.forEach(el => el.remove());
                        arr.length = 0;
                    });
            }
 
            function interact() {
                if (checkCollision(player, friend)) {
                    activateFriendDialogue();
                }
                bossDoors.forEach(door => {
                    if (checkCollision(player, door)) {
                        openBossHallway();
                    }
                });
            }
 
            function openBossHallway() {
                bossHallway.style.display = 'flex';
                clearAllElements();
                clearInterval(gameInterval);
            }
 
function startBossFight() {
    bossHallway.style.display = 'none';
    triggerBossFight();
    gameInterval = setInterval(gameLoop, 1000 / 60); // Ensure the game loop is running for updates
}
 
            function incrementLevel() {
                level++;
                    playerMaxSpeed = 5; // Reset speed back to normal
                if (level > maxLevels) {
                    endGame(true);
                } else {
                    localStorage.setItem('playerLevel', level);
                    updateDisplay();
                    resetGame();
                    levelIntro.style.display = 'flex';
                    switchLevelBackground();
                    levelText.textContent = `Level ${level}: New Challenges Await!`;
                }
            }
 
            function switchLevelBackground() {
                const backgrounds = ['#333', '#1E90FF', '#228B22', '#E0FFFF', '#B22222'];
                gameContainer.style.backgroundColor = backgrounds[(level - 1) % backgrounds.length];
            }
 
            function continueGame() {
                levelIntro.style.display = 'none';
                gameInterval = setInterval(gameLoop, 1000 / 60);
            }
 
function gameLoop() {
    if (!isPaused) {
        updatePlayerPosition(); // Ensure this is called
        spawnEntities();        // You may want to stop spawning entities during the boss fight
        moveElements();         // This is optional, depending on your design
        checkScoreForLevelTransition(); // This can also be conditional
    }
}
 
            function endGame(isWin = false) {
                clearInterval(gameInterval);
                gameOverScreen.style.display = 'flex';
                gameOverScreen.innerHTML = `<p>${isWin ? 'Congratulations! You won!' : 'Game Over!'}</p>
                <button onclick="restartGame()">Restart</button>`;
            }
 
            function restartGame() {
                gameOverScreen.style.display = 'none';
                resetGame();
                startLevel();
            }
 
            function triggerBossFight() {
                bossFightScreen.style.display = 'flex';
                setTimeout(() => {
                    bossFightScreen.style.display = 'none';
                    startBossLogic();
                }, 2000);
            }
 
            function startBossLogic() {
                bossFightActive = true;
                boss = createElement('boss', [], 600);
                boss.style.bottom = '100px';
                gameWorld.appendChild(boss);
                displayBossHealth();
 
                cycleBossAttacks(); // Start the attack pattern cycle
            }
 
 
 
function cycleBossAttacks() {
    if (bossHealth <= 0) return;
 
    bossAttacking = true;
    bossShielded = true;
    boss.classList.add('boss-shielded'); // Show shield effect
 
    if (bossAttackPhase === 0) {
        bossEnemyBarrage();
    } else if (bossAttackPhase === 1) {
        bossTargetSlam();
    } else if (bossAttackPhase === 2) {
        bossExplosionRain();
    }
 
    setTimeout(() => {
        bossShielded = false;
        boss.classList.remove('boss-shielded'); // Remove shield effect
        displayMessage("Boss shield is OFF! Attack now!");
    }, 5000);
 
    bossAttackPhase = (bossAttackPhase + 1) % 3;
}
 
 
 
 
function bossEnemyBarrage() {
    boss.style.animation = "boss-shake 1s infinite alternate"; // Boss shakes
 
    let spawnCount = 0;
    let spawnInterval = setInterval(() => {
        if (spawnCount >= 10) { // Stops after 10 spawns
            clearInterval(spawnInterval);
            boss.style.animation = ""; // Stop shaking
            setTimeout(cycleBossAttacks, 3000); // Cooldown before next attack
            return;
        }
 
        let enemy = createElement('enemy', enemies, Math.random() * gameContainer.offsetWidth);
        enemy.style.bottom = "400px"; // Start from top
 
        let fallSpeed = 3;
        let fallInterval = setInterval(() => {
            enemy.style.bottom = (parseInt(enemy.style.bottom) - fallSpeed) + "px";
 
            if (parseInt(enemy.style.bottom) <= 0) {
                enemy.style.bottom = "0px"; // Stop at ground level
                clearInterval(fallInterval);
            }
        }, 50);
 
        spawnCount++;
    }, 500);
}
 
 
 
function bossTargetSlam() {
    let slamCount = 0;
    boss.style.animation = "boss-shake 0.5s infinite alternate";
 
    let followInterval = setInterval(() => {
        if (slamCount >= 3) {
            clearInterval(followInterval);
            boss.style.animation = "";
            setTimeout(cycleBossAttacks, 3000);
            return;
        }
 
        boss.style.left = player.style.left; 
        boss.style.bottom = "400px"; 
 
        let warningLine = document.createElement('div');
        warningLine.classList.add('warning-line');
        warningLine.style.left = player.style.left;
        warningLine.style.bottom = "0px";
        warningLine.style.width = "30px";
        warningLine.style.height = "5px";
        warningLine.style.backgroundColor = "red";
        warningLine.style.position = "absolute";
        gameWorld.appendChild(warningLine);
 
        setTimeout(() => {
            warningLine.remove();
            boss.style.bottom = "50px"; 
 
            if (checkCollision(boss, player)) {
                reduceLives();
            }
        }, 1000);
 
        slamCount++;
    }, 2000);
}
 
 
 
function bossExplosionRain() {
    boss.style.animation = "boss-shake 1s infinite alternate";
 
    let dropCount = 0;
    let dropInterval = setInterval(() => {
        if (dropCount >= 10) {
            clearInterval(dropInterval);
            boss.style.animation = "";
            setTimeout(cycleBossAttacks, 3000);
            return;
        }
 
        let explosionBlock = createElement('explosive-block', [], playerPositionX + Math.random() * 30 - 15);
        explosionBlock.style.bottom = "400px";
        gameWorld.appendChild(explosionBlock);
 
        let fallSpeed = 5;
        let fallInterval = setInterval(() => {
            explosionBlock.style.bottom = (parseInt(explosionBlock.style.bottom) - fallSpeed) + "px";
 
            if (parseInt(explosionBlock.style.bottom) <= 0) {
                createBurst(parseInt(explosionBlock.style.left), 0);
                if (checkCollision(explosionBlock, player)) {
                    reduceLives();
                }
                explosionBlock.remove();
                clearInterval(fallInterval);
            }
        }, 50);
 
        dropCount++;
    }, 1000);
}
 
 
 
 
 
            function displayBossHealth() {
                bossHealthBar.style.display = 'block';
                updateBossHealth();
            }
 
            function updateBossHealth() {
                bossHealthDisplay.style.width = `${bossHealth}%`;
            }
 
            function spawnBossEnemies() {
                if (bossShielded) {
                    for (let i = 0; i < 2; i++) {
                        const enemy = createElement('enemy', enemies, parseInt(boss.style.left) + (i * 50));
                        enemy.style.bottom = `${Math.random() * 250}px`;
                    }
                }
            }
 
            function spawnBossBullets() {
                const bullet = createBullet();
                bullet.style.left = parseInt(boss.style.left) + 'px';
                bullet.style.bottom = parseInt(boss.style.bottom) + 30 + 'px';
                bullet.style.backgroundColor = 'orange';
                gameWorld.appendChild(bullet);
                bullets.push({ element: bullet, direction: -1 });
            }
 
function checkBossHit() {
    if (!boss || bossShielded) return; // Stop draining health if shield is active
 
    bullets.forEach((bullet, bulletIndex) => {
        if (checkCollision(bullet.element, boss)) {
            bossHealth -= 2;
            updateBossHealth();
            bullet.element.remove();
            bullets.splice(bulletIndex, 1);
        }
    });
}
 
 
 
            function onBossDefeated() {
                bossHealthBar.style.display = 'none';
                displayMessage("Noooo!");
                friend.style.left = '400px';
                friend.style.bottom = '100px';
                friend.style.display = 'block';
                interactMessage.textContent = "Press 'E' to interact with your friend!";
                interactMessage.style.display = 'block';
 
                setTimeout(() => {
                    // Move player back to doorway
                    player.style.left = "50px";
                    player.style.bottom = "0px";
 
                    setTimeout(() => {
                        activateBossPower();
                        level = 1; // Reset to Level 1
                        resetGame();
                        startLevel();
                    }, 2000);
                }, 3000);
            }
 
 
            function activateFriendDialogue() {
                interactMessage.style.display = 'none';
                displayMessage("Thank you for saving me!");
                setTimeout(() => {
                    displayMessage("I got a secret power for you.");
                    setTimeout(() => {
                        grantBossPowerUp();
                        friend.style.display = 'none';
                    }, 3000);
                }, 2000);
            }
 
let isCharging = false;
let chargeTime = 0;
 
function shootLaserBlast(chargeTime) {
    let laser = document.createElement('div');
    laser.classList.add('laser');
    laser.style.left = player.style.left;
    laser.style.bottom = player.style.bottom;
    laser.style.width = `${chargeTime * 10}px`;
    laser.style.height = "10px";
    laser.style.backgroundColor = "cyan";
    gameWorld.appendChild(laser);
 
    setTimeout(() => {
        laser.remove();
        enemies.forEach(enemy => {
            if (checkCollision(laser, enemy)) {
                enemy.remove();
            }
        });
    }, 100);
}
 
 
            function displayMessage(message) {
                powerUpMessage.textContent = message;
                powerUpMessage.style.display = 'block';
                setTimeout(() => {
                    powerUpMessage.style.display = 'none';
                }, 2000);
            }
 
            function checkScoreForLevelTransition() {
                if (score >= level * 10000) {
                    incrementLevel();
                }
            }
 
            function spawnFlyingEnemy() {
                const flyingEnemy = createElement('flying-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                flyingEnemy.style.bottom = Math.random() * 150 + 50 + 'px';
            }
 
            function moveFlyingEnemies() {
                enemies.forEach((enemy, index) => {
                    if(enemy.classList.contains('flying-enemy')) {
                        if (parseInt(enemy.style.left) < 0) {
                            removeElement(enemy, enemies, index, 30);
                        } else {
                            enemy.style.left = (parseInt(enemy.style.left) - 2) + 'px';
                            if (checkCollision(player, enemy)) {
                                reduceLives();
                                removeElement(enemy, enemies, index, 0);
                            }
                        }
                    }
                });
            }
 
            function spawnChargingEnemy() {
                const chargingEnemy = createElement('charging-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                chargingEnemy.style.bottom = '0px';
                chargingEnemy.setAttribute('data-charge', '0');
                chargingEnemy.classList.add('charging-prep'); // Fading in/out red glow effect
            }
 
 
            function createChargeTrail(x, y) {
                const trail = document.createElement('div');
                trail.classList.add('charge-trail');
                trail.style.left = x + 'px';
                trail.style.bottom = y + 'px';
                gameWorld.appendChild(trail);
 
                setTimeout(() => trail.remove(), 400); // Shorter effect for smoothness
            }
 
 
 
 
function moveChargingEnemies() {
    enemies.forEach((enemy, index) => {
        if (enemy.classList.contains('charging-enemy')) {
            let chargeTime = parseInt(enemy.getAttribute('data-charge'));
 
            if (chargeTime < 60) {
                // Charging phase (fading in/out glow)
                enemy.setAttribute('data-charge', chargeTime + 1);
            } else {
                // Fully Charged (Solid Red Outline + Charging Forward)
                enemy.classList.remove('charging-prep');
                enemy.classList.add('charging-active');
                enemy.style.left = (parseInt(enemy.style.left) - 6) + 'px';
 
                // Create a bright red trail
                createChargeTrail(parseInt(enemy.style.left), parseInt(enemy.style.bottom));
            }
 
            // Check collision with player
            if (checkCollision(player, enemy)) {
                createBurst(parseInt(enemy.style.left), parseInt(enemy.style.bottom)); // Impact explosion
                reduceLives();
                removeElement(enemy, enemies, index, 0);
            }
 
            // Remove if out of bounds
            if (parseInt(enemy.style.left) < gameScrollPosition - enemy.offsetWidth) {
                removeElement(enemy, enemies, index, 30);
            }
        }
    });
}
 
 
 
            function spawnStealthEnemy() {
                const stealthEnemy = createElement('stealth-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                stealthEnemy.setAttribute('data-stealth', '0');
                stealthEnemy.style.backgroundColor = '#555';
                stealthEnemy.style.opacity = '1';
            }
 
            function moveStealthEnemies() {
                enemies.forEach(en => {
                    if (en.classList.contains('stealth-enemy')) {
                        const stealth = parseInt(en.getAttribute('data-stealth'));
                        if (stealth > 50) {
                            en.style.opacity = en.style.opacity == '0' ? '1' : '0';
                            en.setAttribute('data-stealth', '0');
                        } else {
                            en.setAttribute('data-stealth', stealth + 1);
                        }
                    }
                });
            }
 
            function spawnSplitterEnemy() {
                const splitter = createElement('split-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                splitter.style.bottom = '0px';
                splitter.classList.add('split');
            }
 
            function handleSplitterEnemyHit(enemy, enemyIndex) {
                if (!enemy.classList.contains('split')) {
                    for (let i = 0; i < 3; i++) {
                        const miniEnemy = createElement('split-enemy', enemies, parseInt(enemy.style.left) + i * 30);
                        miniEnemy.style.width = '15px';
                        miniEnemy.style.height = '15px';
                        miniEnemy.classList.remove('split');
                    }
                }
                removeElement(enemy, enemies, enemyIndex, 0);
            }
 
            function handleExplosiveEnemyHit(enemy, enemyIndex) {
                removeElement(enemy, enemies, enemyIndex, 0);
                enemies.forEach((otherEnemy, index) => {
                    if (calculateDistance(enemy, otherEnemy) < 50) {
                        removeElement(otherEnemy, enemies, index, 0);
                    }
                });
                createBurst(parseInt(enemy.style.left), parseInt(enemy.style.bottom));
                reduceLives();
            }
 
            function spawnSniperEnemy() {
                const sniper = createElement('sniper-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                sniper.style.bottom = '200px';
                const sniperInterval = setInterval(() => {
                    if (Math.random() < 0.05 && calculateDistance(player, sniper) < 300) {
                        const bullet = createBullet();
                        bullet.style.left = parseInt(sniper.style.left) + 'px';
                        bullet.style.bottom = parseInt(sniper.style.bottom) + 'px';
                        bullet.style.backgroundColor = 'red';
                        gameWorld.appendChild(bullet);
                        bullets.push({ element: bullet, direction: -1 });
                    }
                }, 1000);
 
                sniper.setAttribute('data-interval', sniperInterval);
            }
 
            function spawnRegeneratingEnemy() {
                const regenEnemy = createElement('regen-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                regenEnemy.setAttribute('data-health', '3');
                const regenInterval = setInterval(() => {
                    if (parseInt(regenEnemy.getAttribute('data-health')) < 5) {
                        regenEnemy.setAttribute('data-health', parseInt(regenEnemy.getAttribute('data-health')) + 1);
                    }
                }, 3000);
 
                regenEnemy.setAttribute('data-regen-interval', regenInterval);
            }
 
            function spawnNewInteractiveEnemies() {
                const randomFeature = Math.random();
                if (randomFeature < 0.2) {
                    spawnTeleporterEnemy();
                } else if (randomFeature < 0.4) {
                    spawnMourningEnemy();
                } else if (randomFeature < 0.6) {
                    spawnVelocityEnemy();
                } else if (randomFeature < 0.8) {
                    spawnStickyEnemy();
                } else {
                    spawnReflectiveEnemy();
                }
            }
 
            function moveNewEnemies() {
                moveTeleporterEnemies();
                moveMourningEnemies();
                moveVelocityEnemies();
                moveStickyEnemies();
                moveReflectiveEnemies();
            }
 
            // New enemies with creative features
            function spawnTeleporterEnemy() {
                const teleporterEnemy = createElement('teleporter-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                teleporterEnemy.style.backgroundColor = '#8A2BE2'; 
                teleporterEnemy.style.bottom = '0px';
                teleporterEnemy.setAttribute('data-teleport', '0');
            }
 
            function moveTeleporterEnemies() {
                enemies.forEach(en => {
                    if (en.classList.contains('teleporter-enemy')) {
                        const teleport = parseInt(en.getAttribute('data-teleport'));
                        if (teleport > 100) {
                            en.style.left = Math.random() * (gameWorld.offsetWidth - en.offsetWidth) + 'px';
                            en.setAttribute('data-teleport', '0');
                        } else {
                            en.setAttribute('data-teleport', teleport + 1);
                        }
                    }
                });
            }
 
            function spawnMourningEnemy() {
                const mourningEnemy = createElement('mourning-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                mourningEnemy.style.backgroundColor = '#708090';
                mourningEnemy.style.bottom = '0px';
            }
 
            function moveMourningEnemies() {
                enemies.forEach(en => {
                    if (en.classList.contains('mourning-enemy')) {
                        if (Math.random() < 0.01) {
                            en.style.opacity = en.style.opacity === '0.5' ? '1' : '0.5'; 
                        }
 
                        if (parseInt(en.style.left) < gameScrollPosition - en.offsetWidth) {
                            removeElement(en, enemies, 0, 30);
                        } else if (checkCollision(player, en)) {
                            reduceLives();
                            removeElement(en, enemies, 0, 0);
                        }
                    }
                });
            }
 
            function spawnVelocityEnemy() {
                const velocityEnemy = createElement('velocity-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                velocityEnemy.style.backgroundColor = '#FF4500'; 
                velocityEnemy.style.bottom = Math.random() * 150 + 'px';
                velocityEnemy.setAttribute('data-speed', '2');
            }
 
            function moveVelocityEnemies() {
                enemies.forEach(en => {
                    if (en.classList.contains('velocity-enemy')) {
                        const speed = parseInt(en.getAttribute('data-speed'));
                        en.style.left = (parseInt(en.style.left) - speed) + 'px';
                        en.style.bottom = (parseInt(en.style.bottom) + (Math.random() - 0.5) * 10) + 'px';
                        if (parseInt(en.style.left) < gameScrollPosition - en.offsetWidth) {
                            removeElement(en, enemies, 0, 30);
                        } else if (checkCollision(player, en)) {
                            reduceLives();
                            removeElement(en, enemies, 0, 0);
                        }
                    }
                });
            }
 
            function spawnStickyEnemy() {
                const stickyEnemy = createElement('sticky-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                stickyEnemy.style.backgroundColor = '#FFD700'; 
                stickyEnemy.style.bottom = '0px';
            }
 
            function moveStickyEnemies() {
                enemies.forEach(en => {
                    if (en.classList.contains('sticky-enemy')) {
                        en.style.left = (parseInt(en.style.left) - 1) + 'px';
                        if (checkCollision(player, en)) {
                            player.style.backgroundColor = '#FFD700';
                            setTimeout(() => player.style.backgroundColor = '#4CAF50', 2000);
                            removeElement(en, enemies, 0, 0);
                        }
                    }
                });
            }
 
            function spawnReflectiveEnemy() {
                const reflectiveEnemy = createElement('reflective-enemy', enemies, gameScrollPosition + gameContainer.offsetWidth);
                reflectiveEnemy.style.backgroundColor = '#20B2AA'; 
                reflectiveEnemy.style.bottom = Math.random() * 150 + 'px';
            }
 
            function moveReflectiveEnemies() {
                enemies.forEach((en, index) => {
                    if (en.classList.contains('reflective-enemy')) {
                        en.style.left = (parseInt(en.style.left) - 1) + 'px';
                        bullets.forEach((bullet, bulletIndex) => {
                            if (checkCollision(bullet.element, en)) {
                                bullet.direction *= -1;
                            }
                        });
                        if (checkCollision(player, en)) {
                            reduceLives();
                            removeElement(en, enemies, index, 0);
                        }
                    }
                });
            }
    </script>
</body>
</html>