diff --git a/assets/gameboard-easy.js b/assets/gameboard-easy.js
index 96b3c71..be31d71 100644
--- a/assets/gameboard-easy.js
+++ b/assets/gameboard-easy.js
@@ -1,44 +1,3 @@
-// --- AUDIO CONFIG ---
-const bgMusic = document.getElementById("bgMusic");
-const sfxClick = document.getElementById("sfxClick");
-const sfxMatch = document.getElementById("sfxMatch");
-const sfxWrong = document.getElementById("sfxWrong");
-const sfxCountdown = document.getElementById("sfxCountdown");
-const sfxWin = document.getElementById("sfxWin");
-const sfxLose = document.getElementById("sfxLose");
-const toggleBtn = document.getElementById("toggleMusic");
-const countdownOverlay = document.getElementById("countdown-overlay");
-
-let musicMuted = false;
-
-function playSFX(audio) {
-    if(!musicMuted) {
-        audio.currentTime = 0;
-        audio.play().catch(() => {});
-    }
-}
-
-document.addEventListener('click', function initAudio() {
-    if(musicMuted) {
-        musicMuted = false;
-        toggleBtn.textContent = "🔊";
-        bgMusic.play().catch(() => {});
-        document.removeEventListener('click', initAudio);
-    }
-});
-
-toggleBtn.onclick = (e) => {
-    e.stopPropagation();
-    if (musicMuted) {
-        bgMusic.play();
-        toggleBtn.textContent = "🔊";
-    } else {
-        bgMusic.pause();
-        toggleBtn.textContent = "🔇";
-    }
-    musicMuted = !musicMuted;
-};
-
 const images = [
   "images/fruit1.png", "images/fruit2.png", "images/fruit3.png", 
   "images/fruit4.png", "images/fruit5.png", "images/fruit6.png"
diff --git a/assets/gameboard-hard.js b/assets/gameboard-hard.js
index 2b74d71..2dd54d3 100644
--- a/assets/gameboard-hard.js
+++ b/assets/gameboard-hard.js
@@ -1,42 +1,3 @@
-const bgMusic = document.getElementById("bgMusic");
-const sfxClick = document.getElementById("sfxClick");
-const sfxMatch = document.getElementById("sfxMatch");
-const sfxWrong = document.getElementById("sfxWrong");
-const sfxCountdown = document.getElementById("sfxCountdown");
-const sfxWin = document.getElementById("sfxWin");
-const sfxLose = document.getElementById("sfxLose");
-const toggleBtn = document.getElementById("toggleMusic");
-const overlay = document.getElementById("countdown-overlay");
-
-let musicMuted = true;
-
-function playSFX(audio) {
-    if(!musicMuted) {
-        audio.currentTime = 0;
-        audio.play().catch(() => {});
-    }
-}
-
-document.addEventListener('click', function initAudio() {
-    if(musicMuted) {
-        musicMuted = false;
-        toggleBtn.textContent = "🔊";
-        bgMusic.play().catch(() => {});
-        document.removeEventListener('click', initAudio);
-    }
-});
-
-toggleBtn.onclick = (e) => {
-    e.stopPropagation();
-    if (musicMuted) {
-        bgMusic.play();
-        toggleBtn.textContent = "🔊";
-    } else {
-        bgMusic.pause();
-        toggleBtn.textContent = "🔇";
-    }
-    musicMuted = !musicMuted;
-};
 
 const images = [
   "images/fruit1.png", "images/fruit2.png", "images/fruit3.png",
diff --git a/assets/gameboard-medium.js b/assets/gameboard-medium.js
index a7037ea..1a1c7fa 100644
--- a/assets/gameboard-medium.js
+++ b/assets/gameboard-medium.js
@@ -1,42 +1,4 @@
-const bgMusic = document.getElementById("bgMusic");
-const sfxClick = document.getElementById("sfxClick");
-const sfxMatch = document.getElementById("sfxMatch");
-const sfxWrong = document.getElementById("sfxWrong");
-const sfxCountdown = document.getElementById("sfxCountdown");
-const sfxWin = document.getElementById("sfxWin");
-const sfxLose = document.getElementById("sfxLose");
-const toggleBtn = document.getElementById("toggleMusic");
-const countdownOverlay = document.getElementById("countdown-overlay");
 
-let musicMuted = true;
-
-function playSFX(audio) {
-    if(!musicMuted) {
-        audio.currentTime = 0;
-        audio.play().catch(() => {});
-    }
-}
-
-document.addEventListener('click', function initAudio() {
-    if(musicMuted) {
-        musicMuted = false;
-        toggleBtn.textContent = "🔊";
-        bgMusic.play().catch(() => {});
-        document.removeEventListener('click', initAudio);
-    }
-});
-
-toggleBtn.onclick = (e) => {
-    e.stopPropagation();
-    if (musicMuted) {
-        bgMusic.play();
-        toggleBtn.textContent = "🔊";
-    } else {
-        bgMusic.pause();
-        toggleBtn.textContent = "🔇";
-    }
-    musicMuted = !musicMuted;
-};
 
 const images = [
   "images/fruit1.png", "images/fruit2.png", "images/fruit3.png", 
diff --git a/audioManager.js b/audioManager.js
index 8d65c68..4004333 100644
--- a/audioManager.js
+++ b/audioManager.js
@@ -10,44 +10,50 @@ const AudioManager = {
         lose: document.getElementById("sfxLose")
     },
     toggleBtn: document.getElementById("toggleMusic"),
-
     init: function() {
-        this.toggleBtn.textContent = "🔊"; 
-        this.toggleBtn.onclick = (e) => {
-            e.stopPropagation();
-            this.toggleMute();
-        };
+        if(this.toggleBtn) this.toggleBtn.textContent = "🔊";
+        if(this.toggleBtn) {
+            this.toggleBtn.onclick = (e) => {
+                e.stopPropagation();
+                this.toggleMute();
+            };
+        }
         if (this.sounds.bg) {
             this.sounds.bg.volume = 0.5;
-            this.playMusic(); 
+            this.sounds.bg.play().catch(() => {
+                console.log("Autoplay ditahan browser, menunggu interaksi user...");
+            });
         }
-    },
 
+        const unlockAudio = () => {
+            if (!this.isMuted && this.sounds.bg && this.sounds.bg.paused) {
+                this.sounds.bg.play().catch(() => {});
+            }
+            document.removeEventListener('click', unlockAudio);
+        };
+        document.addEventListener('click', unlockAudio);
+    },
     toggleMute: function() {
         this.isMuted = !this.isMuted; 
+
         if (this.isMuted) {
             if(this.sounds.bg) this.sounds.bg.pause();
-            this.toggleBtn.textContent = "🔇";
+            if(this.toggleBtn) this.toggleBtn.textContent = "🔇";
         } else {
-            this.playMusic();
-            this.toggleBtn.textContent = "🔊";
+            if(this.sounds.bg) this.sounds.bg.play().catch(() => {});
+            if(this.toggleBtn) this.toggleBtn.textContent = "🔊";
         }
     },
 
-    playMusic: function() {
-        if (!this.isMuted && this.sounds.bg) {
-            this.sounds.bg.play().catch(e => console.log("Autoplay waiting for interaction..."));
-        }
-    },
+    playSFX: function(name) {
+        if (this.isMuted) return;
 
-    playSFX: function(type) {
-        if (this.isMuted) return; 
-        const audio = this.sounds[type];
+        const audio = this.sounds[name];
         if (audio) {
             audio.currentTime = 0;
             audio.play().catch(() => {});
             if (this.sounds.bg && this.sounds.bg.paused) {
-                this.playMusic();
+                this.sounds.bg.play().catch(() => {});
             }
         }
     }
diff --git a/gameboard-easy.php b/gameboard-easy.php
index ab770ac..58e9081 100644
--- a/gameboard-easy.php
+++ b/gameboard-easy.php
@@ -61,6 +61,8 @@ $user = $_SESSION['user'];
   </div>
 </div>
 
-<script src="assets/gameboard-easy.js"></script>
+<audio id="bgMusic" src="audio/bg-music.mp3" loop></audio>
+<script src="audioManager.js"></script>
+<script src="assets/gameboard-hard.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/gameboard-hard.php b/gameboard-hard.php
index 57dbf38..ca3f29b 100644
--- a/gameboard-hard.php
+++ b/gameboard-hard.php
@@ -58,6 +58,9 @@ exit();
   </div>
 </div>
 
+<audio id="bgMusic" src="audio/bg-music.mp3" loop></audio>
+<script src="audioManager.js"></script>
 <script src="assets/gameboard-hard.js"></script>
+
 </body>
 </html>
\ No newline at end of file
diff --git a/gameboard-medium.php b/gameboard-medium.php
index 99d13b5..da93f3a 100644
--- a/gameboard-medium.php
+++ b/gameboard-medium.php
@@ -58,6 +58,8 @@ exit();
   </div>
 </div>
 
-<script src="assets/gameboard-medium.js"></script>
+<audio id="bgMusic" src="audio/bg-music.mp3" loop></audio>
+<script src="audioManager.js"></script>
+<script src="assets/gameboard-hard.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/mainboard.php b/mainboard.php
index 4fb4076..e380f89 100644
--- a/mainboard.php
+++ b/mainboard.php
@@ -45,8 +45,8 @@ $roleIcon = ($roleRaw === 'admin') ? '👑' : '🎮';
 
       <div class="actions">
         <button class="btn blue" onclick="openCredits()">ℹ️ Credit</button>
-        <button id="leaderboardBtn" class="btn gold">🏆 Leaderboard</button>
-        <button id="logoutBtn" class="btn gray">🚪 Logout</button>
+        <button id="leaderboardBtn" onclick="window.location.href='Leaderboard.php'" class="btn gold">🏆 Leaderboard</button>
+        <button id="logoutBtn" class="btn gray" onclick="window.location.href='logout.php'">🚪 Logout</button>
       </div>
     </header>