diff --git a/src/views/Article.svelte b/src/views/Article.svelte
index 135fc92..ab728f6 100644
--- a/src/views/Article.svelte
+++ b/src/views/Article.svelte
@@ -45,7 +45,23 @@
           iframe.style.pointerEvents = 'auto'
           container.classList.add('game-active')
           overlay.setAttribute('data-state', 'played')
-          container.scrollIntoView({ behavior: 'smooth', block: 'center' })
+
+          const menuHeight = document.querySelector('header')?.offsetHeight ?? 0
+          const minTop = menuHeight + 16
+          const rect = container.getBoundingClientRect()
+          const centeredTop = (window.innerHeight - rect.height) / 2
+          const targetTop = Math.max(centeredTop, minTop)
+
+          let scrollEl = container.parentElement
+          while (scrollEl && scrollEl !== document.body) {
+            const { overflow, overflowY } = getComputedStyle(scrollEl)
+            if (/auto|scroll/.test(overflow + overflowY)) break
+            scrollEl = scrollEl.parentElement
+          }
+          const base = (!scrollEl || scrollEl === document.body) ? window.scrollY : scrollEl.scrollTop
+          const target = base + rect.top - targetTop
+          ;(scrollEl && scrollEl !== document.body ? scrollEl : window)
+            .scrollTo({ top: target, behavior: 'smooth' })
         })
 
         deactivateBtn?.addEventListener('click', (e) => {