diff --git a/src/App.vue b/src/App.vue
index 853716c..a398a5a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -311,6 +311,7 @@ body {
 
 .vue-flow__minimap {
     @apply !bg-white/80 !backdrop-blur-md !border-slate-200 !shadow-2xl !rounded-xl !overflow-hidden !transition-all;
+    display: none !important;
     bottom: 130px !important;
     right: 1rem !important;
     width: 140px !important;
@@ -326,6 +327,7 @@ body {
 
 @media (min-width: 768px) {
     .vue-flow__minimap {
+        display: block !important;
         bottom: 1.5rem !important;
         right: 1.5rem !important;
         width: 220px !important;
diff --git a/src/components/TopNav.vue b/src/components/TopNav.vue
index 3c8b3fc..959b7a1 100644
--- a/src/components/TopNav.vue
+++ b/src/components/TopNav.vue
@@ -12,7 +12,7 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { BackgroundVariant } from '@vue-flow/background'
 
 // 图标：所有按钮与状态展示
-import { ChevronDown, ChevronUp, Download, Focus, LayoutDashboard, Menu, Sparkles, Target, X, Trash2, Globe, Settings } from 'lucide-vue-next'
+import { ChevronDown, ChevronUp, Download, Focus, LayoutDashboard, Menu, Sparkles, Target, X, Trash2, Globe, Settings, ArrowLeftRight, Map, Palette } from 'lucide-vue-next'
 
 /**
  * props：
@@ -146,6 +146,16 @@ const callAndClose = (fn: () => void) => {
                     <span>{{ props.t('nav.center') }}</span>
                 </button>
 
+                <button
+                    @click="props.config.hierarchicalDragging = !props.config.hierarchicalDragging"
+                    class="toolbar-btn flex-shrink-0"
+                    :class="props.config.hierarchicalDragging ? 'text-orange-500 bg-orange-50 border-orange-100' : 'text-slate-400 hover:text-slate-600'"
+                    :title="props.t('nav.hierarchicalDragging')"
+                >
+                    <ArrowLeftRight class="w-3.5 h-3.5 md:w-4 h-4" />
+                    <span>{{ props.t('nav.hierarchicalDragging') }}</span>
+                </button>
+
                 <div class="h-4 w-[1px] bg-slate-100 mx-1 flex-shrink-0"></div>
 
                 <button @click="props.onGenerateSummary" class="toolbar-btn text-orange-600 hover:bg-orange-50 border-orange-100 flex-shrink-0" :title="props.t('nav.summary')">
@@ -277,6 +287,16 @@ const callAndClose = (fn: () => void) => {
                 </div>
             </div>
 
+            <button
+                @click="props.config.hierarchicalDragging = !props.config.hierarchicalDragging"
+                class="toolbar-btn"
+                :class="props.config.hierarchicalDragging ? 'text-orange-500 bg-orange-50 border-orange-100' : 'text-slate-400 hover:text-slate-600'"
+                :title="props.t('nav.hierarchicalDragging')"
+            >
+                <ArrowLeftRight class="w-4 h-4" />
+                <span>{{ props.t('nav.hierarchicalDragging') }}</span>
+            </button>
+
             <button
                 @click="props.config.showMiniMap = !props.config.showMiniMap"
                 class="toolbar-btn border-slate-100"