feat: add TreeFlow horizontal flowchart, replace vertical tree in StoryGallery

src/components/StoryGallery.vue

@@ -2,7 +2,7 @@
 import { computed, ref } from 'vue'
 import type { ChapterInfo, SceneNode, EndingDef, PlayerTreeNode } from '@engine/types'
 import { useI18n } from '@/composables/useI18n'
-import TreeNode from './TreeNode.vue'
+import TreeFlow from './TreeFlow.vue'
 
 const { t } = useI18n()
 
@@ -267,10 +267,9 @@ const totalChaptersComplete = computed(() => {
             <div class="detail-tree">
               <div class="section-label">故事树</div>
               <div class="tree-container">
-                <TreeNode
+                <TreeFlow
                   v-if="buildTreeForChapter(selectedChapter.id)"
                   :node="buildTreeForChapter(selectedChapter.id)!"
-                  :depth="0"
                 />
                 <div v-else class="tree-empty">暂无数据</div>
               </div>
@@ -620,14 +619,14 @@ const totalChaptersComplete = computed(() => {
   flex: 1;
   padding: 12px 0;
   border-top: 1px solid rgba(255,255,255,0.04);
+  min-height: 100px;
 }
 
 .tree-container {
   background: rgba(0,0,0,0.2);
   border: 1px solid rgba(255,255,255,0.04);
   border-radius: 6px;
-  padding: 12px 16px;
-  max-height: 240px;
+  padding: 0;
   overflow: auto;
 }