const bgVideo = document.getElementById('bgVideo');
    bgVideo.play().catch(error => {
      console.log('Autoplay prevented, showing muted video');
    });

    function createParticles() {
      const particlesContainer = document.getElementById('particles');
      const particleCount = window.innerWidth < 768 ? 30 : 50;
      for (let i = 0; i < particleCount; i++) {
        const particle = document.createElement('div');
        particle.classList.add('particle');
        const size = Math.random() * 3 + 1;
        particle.style.width = `${size}px`;
        particle.style.height = `${size}px`;
        
        particle.style.left = `${Math.random() * 100}%`;
        particle.style.top = `${Math.random() * 100}%`;
        
        const duration = Math.random() * 20 + 10;
        const delay = Math.random() * 5;
        particle.style.animation = `float ${duration}s linear ${delay}s infinite`;
        particle.style.opacity = Math.random() * 0.6 + 0.4;
        particlesContainer.appendChild(particle);
      }
    }

    // Add floating animation
    const style = document.createElement('style');
    style.textContent = `
      @keyframes float {
        0% {
          transform: translateY(0) translateX(0);
          opacity: ${Math.random() * 0.6 + 0.4};
        }
        100% {
          transform: translateY(-100vh) translateX(${Math.random() * 40 - 20}px);
          opacity: 0;
        }
      }
    `;
    document.head.appendChild(style);

    // Music Player Functionality
    const songs = [
      {
        title: "Blue",
        artist: "Yung Kai",
        src: "https://kiddy.wtf/blue.mp3",
        cover: "https://api.sepsakon.com/uploads/1737385059284-yungkaiblue1.jpg",
        duration: "3:41"
      },
      {
        title: "Birds of a Feather",
        artist: "Billie Eilish",
        src: "https://kiddy.wtf/a.mp3",
        cover: "https://i.ytimg.com/vi/d5gf9dXbPi0/hq720.jpg",
        duration: "3:50"
      },
      {
        title: "Always",
        artist: "Daniel Caesar",
        src: "https://kiddy.wtf/Always.mp3",
        cover: "https://i1.sndcdn.com/artworks-k7KNmCQieDFR-0-t500x500.jpg",
        duration: "3:45"
      }
    ];

    const audio = new Audio(songs[0].src);
    audio.loop = true;
    audio.volume = 0.5;

    // DOM Elements
    const miniPlayer = document.getElementById('miniPlayer');
    const miniAlbumArt = document.getElementById('miniAlbumArt');
    const miniSongTitle = document.getElementById('miniSongTitle');
    const miniSongArtist = document.getElementById('miniSongArtist');
    const miniPlayBtn = document.getElementById('miniPlayBtn');
    const miniPlayIcon = document.getElementById('miniPlayIcon');
    const miniExpandBtn = document.getElementById('miniExpandBtn');
    
    const expandedPlayer = document.getElementById('expandedPlayer');
    const playerClose = document.getElementById('playerClose');
    const albumArt = document.getElementById('albumArt');
    const songTitle = document.getElementById('songTitle');
    const songArtist = document.getElementById('songArtist');
    const playBtn = document.getElementById('playBtn');
    const playIcon = document.getElementById('playIcon');
    const prevBtn = document.getElementById('prevBtn');
    const nextBtn = document.getElementById('nextBtn');
    const volumeSlider = document.getElementById('volumeSlider');
    const progressBar = document.getElementById('progressBar');
    const progressContainer = document.getElementById('progressContainer');
    const currentTimeEl = document.getElementById('currentTime');
    const durationEl = document.getElementById('duration');

    let isPlaying = false;
    let currentSongIndex = 0;
    let isExpanded = false;

    // Format time (seconds to MM:SS)
    function formatTime(seconds) {
      const mins = Math.floor(seconds / 60);
      const secs = Math.floor(seconds % 60);
      return `${mins}:${secs < 10 ? '0' : ''}${secs}`;
    }

    // Update song info
    function updateSongInfo() {
      const song = songs[currentSongIndex];
      albumArt.src = song.cover;
      songTitle.textContent = song.title;
      songArtist.textContent = song.artist;
      durationEl.textContent = song.duration;
      
      // Update mini player
      miniAlbumArt.src = song.cover;
      miniSongTitle.textContent = song.title;
      miniSongArtist.textContent = song.artist;
    }

    // Load and play song
    function loadSong() {
      audio.src = songs[currentSongIndex].src;
      updateSongInfo();
      if (isPlaying) {
        audio.play().catch(error => {
          console.error('Playback failed:', error);
        });
      }
    }

    // Play/pause toggle
    function togglePlay() {
      if (isPlaying) {
        audio.pause();
        playIcon.classList.replace('fa-pause', 'fa-play');
        miniPlayIcon.classList.replace('fa-pause', 'fa-play');
      } else {
        audio.play()
          .then(() => {
            playIcon.classList.replace('fa-play', 'fa-pause');
            miniPlayIcon.classList.replace('fa-play', 'fa-pause');
            isPlaying = true;
          })
          .catch(error => {
            console.error('Playback failed:', error);
            alert('Please interact with the page to play audio');
          });
      }
      isPlaying = !isPlaying;
    }

    // Previous song
    function prevSong() {
      currentSongIndex--;
      if (currentSongIndex < 0) {
        currentSongIndex = songs.length - 1;
      }
      loadSong();
    }

    // Next song
    function nextSong() {
      currentSongIndex++;
      if (currentSongIndex > songs.length - 1) {
        currentSongIndex = 0;
      }
      loadSong();
    }

    // Update progress bar
    function updateProgress() {
      const { duration, currentTime } = audio;
      const progressPercent = (currentTime / duration) * 100;
      progressBar.style.width = `${progressPercent}%`;
      currentTimeEl.textContent = formatTime(currentTime);
    }

    // Set progress when clicking on progress bar
    function setProgress(e) {
      const width = this.clientWidth;
      const clickX = e.offsetX;
      const duration = audio.duration;
      audio.currentTime = (clickX / width) * duration;
    }

    // Update volume
    function setVolume() {
      audio.volume = this.value;
    }

    // Toggle expanded player
    function togglePlayer() {
      if (isExpanded) {
        expandedPlayer.classList.remove('active');
      } else {
        expandedPlayer.classList.add('active');
      }
      isExpanded = !isExpanded;
    }

    // Event Listeners
    playBtn.addEventListener('click', togglePlay);
    miniPlayBtn.addEventListener('click', togglePlay);
    miniExpandBtn.addEventListener('click', togglePlayer);
    playerClose.addEventListener('click', togglePlayer);
    prevBtn.addEventListener('click', prevSong);
    nextBtn.addEventListener('click', nextSong);
    volumeSlider.addEventListener('input', setVolume);
    audio.addEventListener('timeupdate', updateProgress);
    audio.addEventListener('ended', nextSong);
    progressContainer.addEventListener('click', setProgress);

    // Spacebar to play/pause
    document.addEventListener('keydown', (e) => {
      if (e.code === 'Space') {
        e.preventDefault();
        togglePlay();
      }
    });

    // Initialize
    createParticles();
    updateSongInfo();

    // Auto-play music when user interacts with page
    function handleFirstInteraction() {
      // Start playing "Blue" by Yung Kai
      audio.play()
        .then(() => {
          isPlaying = true;
          playIcon.classList.replace('fa-play', 'fa-pause');
          miniPlayIcon.classList.replace('fa-play', 'fa-pause');
        })
        .catch(error => {
          console.error('Auto-play failed:', error);
        });
      
      // Remove event listeners after first interaction
      document.removeEventListener('click', handleFirstInteraction);
      document.removeEventListener('keydown', handleFirstInteraction);
      document.removeEventListener('touchstart', handleFirstInteraction);
    }

    // Add event listeners for first interaction
    document.addEventListener('click', handleFirstInteraction);
    document.addEventListener('keydown', handleFirstInteraction);
    document.addEventListener('touchstart', handleFirstInteraction);