diff --git a/src/components/ChangelogModal.tsx b/src/components/ChangelogModal.tsx
index b312f90..2965780 100644
--- a/src/components/ChangelogModal.tsx
+++ b/src/components/ChangelogModal.tsx
@@ -1,4 +1,5 @@
 import { motion, AnimatePresence } from 'framer-motion'
+import { createPortal } from 'react-dom'
 import { X, History, CalendarDays, Tag } from 'lucide-react'
 import { changelogEntries } from '@/data'
 import type { ChangelogType } from '@/types/itto'
@@ -59,7 +60,10 @@ function groupByDate(entries: typeof changelogEntries) {
 export function ChangelogModal({ isOpen, onClose }: ChangelogModalProps) {
   const groupedEntries = groupByDate(changelogEntries)
 
-  return (
+  // 使用 Portal 将模态框渲染到 body，避免被 Header 的层叠上下文限制
+  if (typeof document === 'undefined') return null
+
+  return createPortal(
     <AnimatePresence>
       {isOpen && (
         <>
@@ -171,6 +175,7 @@ export function ChangelogModal({ isOpen, onClose }: ChangelogModalProps) {
           </motion.div>
         </>
       )}
-    </AnimatePresence>
+    </AnimatePresence>,
+    document.body
   )
 }
diff --git a/src/data/changelog.json b/src/data/changelog.json
index 3dae3e8..80705b5 100644
--- a/src/data/changelog.json
+++ b/src/data/changelog.json
@@ -1,5 +1,12 @@
 {
   "changelogEntries": [
+    {
+      "id": "2026-03-08-fix-modal-portal",
+      "date": "2026-03-08",
+      "type": "fix",
+      "title": "使用 React Portal 修复模态框层级遮挡问题",
+      "scope": "整合"
+    },
     {
       "id": "2026-03-08-changelog-group-by-date",
       "date": "2026-03-08",