1 files changed, 39 insertions, 0 deletions
diff --git a/layouts/recordings/single.html b/layouts/recordings/single.html
index e784306..6e52caa 100644
--- a/layouts/recordings/single.html
+++ b/layouts/recordings/single.html
@@ -43,6 +43,45 @@
     <div></div>
   </footer>
 
+  {{/* Determine background audio for this page: prefer page resources, then section subfolder */}}
+  {{ $folder := path.Base (printf "%s" .File.Dir) }}
+  {{ $paudios := .Resources.Match "*.{mp3,m4a,ogg,wav,opus,OPUS,OGG,WAV,MP3,M4A}" }}
+  {{ $audio := index $paudios 0 }}
+  {{ if not $audio }}
+    {{ $secAudios := .CurrentSection.Resources.Match (printf "**/%s/*.{mp3,m4a,ogg,wav,opus,OPUS,OGG,WAV,MP3,M4A}" $folder) }}
+    {{ $audio = index $secAudios 0 }}
+  {{ end }}
+  {{ with $audio }}
+  <audio id="bgm" src="{{ .RelPermalink }}" preload="auto" loop style="display:none"></audio>
+  <div style="position:fixed;right:16px;bottom:16px;z-index:10">
+    <button id="bgm-toggle" class="btn" style="opacity:.8">BGM ▷</button>
+  </div>
+  <script>
+    // Try to autoplay; if blocked, enable on first user interaction
+    document.addEventListener('DOMContentLoaded', () => {
+      const bgm = document.getElementById('bgm');
+      const toggle = document.getElementById('bgm-toggle');
+      if (!bgm) return;
+      const tryPlay = () => bgm.play().catch(() => {});
+      tryPlay();
+      const onFirst = () => { tryPlay(); document.removeEventListener('click', onFirst); };
+      document.addEventListener('click', onFirst, { once: true });
+      if (toggle) {
+        toggle.addEventListener('click', (e) => {
+          e.preventDefault();
+          if (bgm.paused) {
+            bgm.play().then(()=>{ toggle.textContent = 'BGM ❚❚'; }).catch(()=>{});
+          } else {
+            bgm.pause();
+            bgm.currentTime = 0;
+            toggle.textContent = 'BGM ▷';
+          }
+        });
+      }
+    });
+  </script>
+  {{ end }}
+
   <script>
     // 선택: 키보드 좌우 화살표로 이전/다음 이동
     document.addEventListener("keydown", e => {