aegon-lv82 1.0.0

package/src/views/gen-ai/components/editor/ChapterTiptapEditor.vue

@@ -0,0 +1,3139 @@
+<template>
+  <div
+    ref="editorRootRef"
+    class="report-tiptap-editor is-readonly"
+    :class="{ 'is-typing': isTypewriting }"
+    @mouseleave="scheduleHideReviewPopover"
+  >
+    <div class="report-tiptap-editor__toolbar" role="toolbar" aria-label="富文本工具欄">
+      <div class="report-tiptap-editor__group">
+        <button
+          type="button"
+          class="report-tiptap-editor__tool"
+          title="撤銷"
+          :disabled="!editable || !editor?.can().undo()"
+          @click="editor?.chain().focus().undo().run()"
+        >
+          <Undo2 :size="18" :stroke-width="1.75" />
+        </button>
+        <button
+          type="button"
+          class="report-tiptap-editor__tool"
+          title="重做"
+          :disabled="!editable || !editor?.can().redo()"
+          @click="editor?.chain().focus().redo().run()"
+        >
+          <Redo2 :size="18" :stroke-width="1.75" />
+        </button>
+      </div>
+
+      <span class="report-tiptap-editor__divider" aria-hidden="true" />
+
+      <!-- 格式 + 插入工具欄 -->
+      <TiptapToolbar :editor="editor" :editable="editable" />
+    </div>
+
+    <div
+      class="report-tiptap-editor__body"
+      @click="onEditorBodyClick"
+      @mouseover="onEditorBodyMouseOver"
+    >
+      <EditorContent :editor="editor" class="report-tiptap-editor__content" />
+    </div>
+
+    <!-- //0917 批註 tip：掛到中間 main card 內，避免超出模板區（Vue 3.4 無 Teleport defer） -->
+    <Teleport :to="reviewPopoverTeleportTo">
+      <div
+        v-if="reviewPopoverVisible && activeReviewMarker"
+        ref="reviewPopoverRef"
+        class="report-chapter-review-popover"
+        :style="reviewPopoverStyle"
+        @click.stop
+        @mouseenter="onReviewPopoverMouseEnter"
+        @mouseleave="onReviewPopoverMouseLeave"
+      >
+        <div class="review-marker-popover">
+          <div class="review-marker-popover__meta">
+            <button
+              v-if="activeReviewMarker.author"
+              type="button"
+              class="review-marker-popover__source-name"
+              :title="activeReviewMarker.author"
+              @click.stop="onSourceNameClick"
+            >
+              {{ formatSourceNameDisplay(activeReviewMarker.author) }}
+            </button>
+            <span class="review-marker-popover__id">{{ activeReviewMarker.id }}</span>
+          </div>
+          <div class="review-marker-popover__body">
+            <div
+              ref="reviewPopoverScrollRef"
+              class="review-marker-popover__scroll"
+              @scroll.passive="syncReviewPopoverThumb"
+            >
+              <p class="review-marker-popover__content">{{ activeReviewMarker.content }}</p>
+            </div>
+            <!-- //0917 滾動條：掛 body、貼正文不蓋文件名；>18 行 tip 打開即顯示灰膠囊 -->
+            <div
+              class="review-marker-popover__thumb-track"
+              :class="{ 'is-visible': reviewPopoverThumbShow }"
+              aria-hidden="true"
+              @mousedown.prevent="onReviewPopoverTrackDown"
+            >
+              <div
+                class="review-marker-popover__thumb"
+                :style="{
+                  height: `${reviewPopoverThumbH}px`,
+                  transform: `translateY(${reviewPopoverThumbY}px)`,
+                }"
+                @mousedown.stop.prevent="onReviewPopoverThumbDown"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </Teleport>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  createNodeFromContent,
+  mergeAttributes,
+  Node,
+  ResizableNodeView,
+  type CommandProps,
+} from '@tiptap/core'
+import Image from '@tiptap/extension-image'
+import { Italic as ItalicExtension } from '@tiptap/extension-italic'
+import LinkExtension from '@tiptap/extension-link'
+import { TableKit } from '@tiptap/extension-table/kit'
+import Underline from '@tiptap/extension-underline'
+import type { Node as ProseMirrorNode } from '@tiptap/pm/model'
+import StarterKit from '@tiptap/starter-kit'
+import type { Editor } from '@tiptap/vue-3'
+import { EditorContent, useEditor, VueNodeViewRenderer } from '@tiptap/vue-3'
+import { ElMessage } from 'element-plus'
+import { Redo2, Undo2 } from 'lucide-vue-next'
+import { nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { CHART_STREAM_REFS_UPDATED_EVENT, getChartStreamRef } from '../../build-report/chartStreamRefs'
+import type { SourceFile } from '../../build-report/useReportWorkflow'
+import {
+  isPreviewableFileName,
+  openFilePreviewInNewTab,
+} from '../Preview'
+import {
+  normalizeReadableSpacing,
+  parseMarkdownToHtml,
+  parseMarkdownToHtmlStream,
+  stripThinkBlocks,
+} from './parseMarkdownHtml'
+import ReportStructureBlockView from './StructureBlockView.vue'
+import TiptapToolbar from './TiptapToolbar.vue'
+
+export interface EditorReviewMarker {
+  id: number
+  author: string
+  content: string
+  sourceFile?: SourceFile
+  href?: string
+  linkLabel?: string
+  filePath?: string
+  filePreviewUrl?: string
+  chunkId?: string
+}
+
+const props = withDefaults(
+  defineProps<{
+    chapterTitle?: string
+    chapterIntro?: string
+    /** 已廢棄：打字機僅展示，始終不可編輯 */
+    editable?: boolean
+    showReviewMarkers?: boolean
+    /** 批註由父級傳入；空則不展示假批註 */
+    reviewMarkers?: EditorReviewMarker[]
+    /** 跳過打字機，直接滿內容 */
+    disableTypewriter?: boolean
+    /**
+     * 內容身份（如 chapter key）。設置後：拖拽僅改標題序號時不重跑打字機，
+     * 標題與正文作為整體隨 DOM 重排移動。
+     */
+    contentIdentity?: string
+    /**
+     * 多章串聯打字機相位：
+     * - auto：單章模式，掛載即打字
+     * - idle：等待（空白，不打字）
+     * - typing：當前正在打字
+     * - done：已打完，保持滿內容
+     */
+    typewriterPhase?: 'auto' | 'idle' | 'typing' | 'done'
+    /**
+     * 只渲染父級標題 + 正文；無本地假文案/表格/引用
+     */
+    plainContent?: boolean
+    /**
+     * 流式斷續：追平當前緩衝後，若在此時間內無新內容才 emit complete。
+     * 緩衝仍為空時會一直等待（不 complete）。單位 ms。
+     */
+    typewriterSettleMs?: number
+  }>(),
+  {
+    chapterTitle: '',
+    chapterIntro: '',
+    editable: false,
+    showReviewMarkers: false,
+    reviewMarkers: () => [],
+    plainContent: true,
+    disableTypewriter: false,
+    contentIdentity: '',
+    typewriterPhase: 'auto',
+    typewriterSettleMs: 1500,
+  }
+)
+
+const emit = defineEmits<{
+  'typewriter-complete': []
+}>()
+
+const markerSourceFiles = ref<Record<number, SourceFile>>({})
+const reviewPopoverVisible = ref(false)
+const reviewPopoverStyle = ref<Record<string, string>>({})
+const activeReviewMarker = ref<EditorReviewMarker | null>(null)
+/** //0917 掛到當前打字機根節點內，避免超出中欄 */
+const reviewPopoverTeleportTo = ref<string | HTMLElement>('body')
+const reviewPopoverRef = ref<HTMLElement | null>(null)
+const reviewPopoverScrollRef = ref<HTMLElement | null>(null)
+//0917 tip popup 滾動條 / 邊距常數
+const REVIEW_POPOVER_THUMB_H = 50
+/** //0917 上右下左永遠 14px */
+const REVIEW_POPOVER_PAD = 14
+/** //0917 超過 18 行出滾動條；行高 14px × 1.6 = 22.4 */
+const REVIEW_POPOVER_LINE_H = 22.4
+const REVIEW_POPOVER_MIN_LINES = 18
+const REVIEW_POPOVER_MIN_BODY_H = Math.round(REVIEW_POPOVER_LINE_H * REVIEW_POPOVER_MIN_LINES) //0917 與 CSS max-height 一致
+const REVIEW_POPOVER_META_GAP = 10
+const REVIEW_POPOVER_MAX_H =
+  REVIEW_POPOVER_PAD * 2 + 28 + REVIEW_POPOVER_META_GAP + REVIEW_POPOVER_MIN_BODY_H
+const reviewPopoverThumbShow = ref(false)
+/** //0917 正文 >18 行（可滾） */
+const reviewPopoverNeedsScroll = ref(false)
+const reviewPopoverThumbH = ref(REVIEW_POPOVER_THUMB_H)
+const reviewPopoverThumbY = ref(0)
+let hideReviewPopoverTimer = 0
+let reviewPopoverThumbDrag: {
+  startY: number
+  startScrollTop: number
+  trackTravel: number
+  maxScroll: number
+} | null = null
+
+//0917 tip 灰膠囊位置跟隨 scrollTop
+function syncReviewPopoverThumb() {
+  const wrap = reviewPopoverScrollRef.value
+  if (!wrap) {
+    reviewPopoverThumbY.value = 0
+    return
+  }
+  const viewH = Math.max(0, wrap.clientHeight)
+  const maxScroll = Math.max(0, wrap.scrollHeight - viewH)
+  //0917 實際溢出時補標（防止量高漏判）
+  if (maxScroll > 1) {
+    reviewPopoverNeedsScroll.value = true
+    reviewPopoverThumbShow.value = true
+  }
+  if (!reviewPopoverThumbShow.value || viewH <= 0) {
+    reviewPopoverThumbY.value = 0
+    return
+  }
+  const thumbH = Math.min(
+    REVIEW_POPOVER_THUMB_H,
+    Math.max(50, Math.floor(viewH * 0.35)),
+    Math.max(50, viewH)
+  )
+  //0917 最短 50px，保證灰膠囊看得見
+  reviewPopoverThumbH.value = Math.min(viewH, Math.max(50, thumbH))
+  const travel = Math.max(0, viewH - reviewPopoverThumbH.value)
+  if (maxScroll <= 0 || travel <= 0) {
+    reviewPopoverThumbY.value = 0
+    return
+  }
+  reviewPopoverThumbY.value = Math.min(
+    travel,
+    Math.max(0, Math.round((wrap.scrollTop / maxScroll) * travel))
+  )
+}
+
+/** //0917 移入 tip：確保 >18 行時滾動條 UI 亮著 */
+function onReviewPopoverMouseEnter() {
+  cancelHideReviewPopover()
+  if (reviewPopoverNeedsScroll.value) {
+    reviewPopoverThumbShow.value = true
+    void nextTick(() => syncReviewPopoverThumb())
+  }
+}
+
+function onReviewPopoverMouseLeave() {
+  //0917 不在 leave 時藏條：>18 行 tip 打開期間 UI 保持可見
+  scheduleHideReviewPopover()
+}
+
+/** //0917 滾輪 delta → px（兼容 line/page 模式） */
+function wheelDeltaToPx(event: WheelEvent, viewH: number) {
+  let dy = event.deltaY
+  if (event.deltaMode === 1) dy *= 16
+  else if (event.deltaMode === 2) dy *= viewH || REVIEW_POPOVER_MIN_BODY_H
+  if (dy !== 0 && Math.abs(dy) < 1) dy = dy < 0 ? -1 : 1
+  return dy
+}
+
+//0917 tip 原生 wheel（非 passive），拖條/滾輪可滾
+function onReviewPopoverWheelNative(event: WheelEvent) {
+  const pop = reviewPopoverRef.value
+  const wrap = reviewPopoverScrollRef.value
+  if (!pop || !wrap || !reviewPopoverVisible.value) return
+
+  const maxScroll = Math.max(0, wrap.scrollHeight - wrap.clientHeight)
+  if (maxScroll <= 1) return
+
+  event.preventDefault()
+  event.stopPropagation()
+  cancelHideReviewPopover()
+
+  const dy = wheelDeltaToPx(event, wrap.clientHeight)
+  if (!dy) return
+  wrap.scrollTop = Math.min(maxScroll, Math.max(0, wrap.scrollTop + dy))
+  syncReviewPopoverThumb()
+}
+
+function bindReviewPopoverWheel() {
+  const pop = reviewPopoverRef.value
+  if (!pop) return
+  pop.removeEventListener('wheel', onReviewPopoverWheelNative, true)
+  pop.addEventListener('wheel', onReviewPopoverWheelNative, { capture: true, passive: false })
+}
+
+function unbindReviewPopoverWheel() {
+  const pop = reviewPopoverRef.value
+  if (!pop) return
+  pop.removeEventListener('wheel', onReviewPopoverWheelNative, true)
+}
+
+/**
+ * //0917 ≤18 行撐開；>18 行鎖 18 行並強制顯示右側滾動條。
+ * CSS max-height 會裁切正文，量高失敗時也要用實際 scrollHeight 補判，否則條不出現。
+ */
+function layoutReviewPopoverScroll() {
+  const pop = reviewPopoverRef.value
+  const scroll = reviewPopoverScrollRef.value
+  if (!pop || !scroll) return
+  const meta = pop.querySelector('.review-marker-popover__meta') as HTMLElement | null
+  const content = scroll.querySelector('.review-marker-popover__content') as HTMLElement | null
+
+  scroll.style.height = ''
+  scroll.style.minHeight = ''
+  scroll.style.maxHeight = ''
+  scroll.style.overflowY = 'auto'
+  if (content) content.style.minHeight = ''
+
+  reviewPopoverStyle.value = {
+    ...reviewPopoverStyle.value,
+    height: 'auto',
+    maxHeight: 'none',
+    overflow: 'hidden',
+  }
+  pop.style.height = 'auto'
+  pop.style.maxHeight = 'none'
+  void pop.offsetWidth
+  void scroll.offsetHeight
+
+  const metaH = meta ? Math.ceil(meta.getBoundingClientRect().height) : 28
+  const metaMb = meta
+    ? parseFloat(getComputedStyle(meta).marginBottom) || REVIEW_POPOVER_META_GAP
+    : REVIEW_POPOVER_META_GAP
+
+  let rawTextH = content?.scrollHeight || scroll.scrollHeight || REVIEW_POPOVER_LINE_H
+  if (content && pop.offsetWidth > 0) {
+    const cs = getComputedStyle(content)
+    const probe = content.cloneNode(true) as HTMLElement
+    const probeW = Math.max(
+      1,
+      content.clientWidth || Math.floor(pop.getBoundingClientRect().width) - REVIEW_POPOVER_PAD * 2
+    )
+    probe.style.cssText = [
+      'position:absolute',
+      'left:-99999px',
+      'top:0',
+      'visibility:hidden',
+      'pointer-events:none',
+      `width:${probeW}px`,
+      'height:auto',
+      'max-height:none',
+      'overflow:visible',
+      'white-space:normal',
+      'word-break:break-word',
+      'overflow-wrap:anywhere',
+      `font-size:${cs.fontSize}`,
+      `font-family:${cs.fontFamily}`,
+      `font-weight:${cs.fontWeight}`,
+      `line-height:${cs.lineHeight}`,
+      'margin:0',
+      'padding:0',
+    ].join(';')
+    document.body.appendChild(probe)
+    rawTextH = Math.max(rawTextH, probe.scrollHeight)
+    probe.remove()
+  }
+
+  let needsScroll = rawTextH > REVIEW_POPOVER_MIN_BODY_H + 1
+
+  if (needsScroll) {
+    scroll.style.height = `${REVIEW_POPOVER_MIN_BODY_H}px`
+    scroll.style.maxHeight = `${REVIEW_POPOVER_MIN_BODY_H}px`
+    scroll.style.overflowY = 'auto'
+  } else {
+    scroll.style.height = 'auto'
+    scroll.style.maxHeight = `${REVIEW_POPOVER_MIN_BODY_H}px`
+    scroll.style.overflowY = 'hidden'
+  }
+
+  void scroll.offsetHeight
+  //0917 CSS/限高裁切後再量一次：有溢出就必須出條
+  if (scroll.scrollHeight > scroll.clientHeight + 1) {
+    needsScroll = true
+    scroll.style.height = `${REVIEW_POPOVER_MIN_BODY_H}px`
+    scroll.style.maxHeight = `${REVIEW_POPOVER_MIN_BODY_H}px`
+    scroll.style.overflowY = 'auto'
+  }
+
+  reviewPopoverNeedsScroll.value = needsScroll
+  //0917 >18 行：tip 打開即顯示滾動條 UI
+  reviewPopoverThumbShow.value = needsScroll
+
+  const finalBodyH = needsScroll ? REVIEW_POPOVER_MIN_BODY_H : Math.ceil(rawTextH)
+  const nextMax = REVIEW_POPOVER_PAD * 2 + metaH + metaMb + finalBodyH
+  reviewPopoverStyle.value = {
+    ...reviewPopoverStyle.value,
+    height: 'auto',
+    maxHeight: `${nextMax}px`,
+    overflow: 'hidden',
+  }
+  pop.style.maxHeight = `${nextMax}px`
+
+  void scroll.offsetHeight
+  if (needsScroll) {
+    const viewH = scroll.clientHeight || REVIEW_POPOVER_MIN_BODY_H
+    reviewPopoverThumbH.value = Math.min(viewH, Math.max(50, Math.floor(viewH * 0.35)))
+  }
+  syncReviewPopoverThumb()
+  bindReviewPopoverWheel()
+}
+
+//0917 tip 拖滑塊 / 點軌道
+function onReviewPopoverThumbDown(event: MouseEvent) {
+  const wrap = reviewPopoverScrollRef.value
+  if (!wrap) return
+  cancelHideReviewPopover()
+  const viewH = wrap.clientHeight
+  const maxScroll = Math.max(0, wrap.scrollHeight - viewH)
+  if (maxScroll <= 0) return
+  const thumbH = reviewPopoverThumbH.value
+  reviewPopoverThumbDrag = {
+    startY: event.clientY,
+    startScrollTop: wrap.scrollTop,
+    trackTravel: Math.max(1, viewH - thumbH),
+    maxScroll,
+  }
+  window.addEventListener('mousemove', onReviewPopoverThumbMove)
+  window.addEventListener('mouseup', onReviewPopoverThumbUp)
+}
+
+function onReviewPopoverTrackDown(event: MouseEvent) {
+  const wrap = reviewPopoverScrollRef.value
+  const track = event.currentTarget as HTMLElement | null
+  if (!wrap || !track) return
+  if ((event.target as HTMLElement | null)?.closest?.('.review-marker-popover__thumb')) return
+  cancelHideReviewPopover()
+  const viewH = wrap.clientHeight
+  const maxScroll = Math.max(0, wrap.scrollHeight - viewH)
+  if (maxScroll <= 0) return
+  const rect = track.getBoundingClientRect()
+  const thumbH = reviewPopoverThumbH.value
+  const travel = Math.max(1, viewH - thumbH)
+  const y = event.clientY - rect.top - thumbH / 2
+  const ratio = Math.min(1, Math.max(0, y / travel))
+  wrap.scrollTop = ratio * maxScroll
+  syncReviewPopoverThumb()
+  onReviewPopoverThumbDown(event)
+}
+
+function onReviewPopoverThumbMove(event: MouseEvent) {
+  const drag = reviewPopoverThumbDrag
+  const wrap = reviewPopoverScrollRef.value
+  if (!drag || !wrap) return
+  if (drag.maxScroll <= 0) return
+  const deltaY = event.clientY - drag.startY
+  const nextScroll = drag.startScrollTop + (deltaY / drag.trackTravel) * drag.maxScroll
+  wrap.scrollTop = Math.min(Math.max(0, nextScroll), drag.maxScroll)
+  syncReviewPopoverThumb()
+}
+
+function onReviewPopoverThumbUp() {
+  reviewPopoverThumbDrag = null
+  window.removeEventListener('mousemove', onReviewPopoverThumbMove)
+  window.removeEventListener('mouseup', onReviewPopoverThumbUp)
+  //0917 拖完若指針已不在 tip 上，收起條
+  const pop = reviewPopoverRef.value
+  if (pop && !pop.matches(':hover')) {
+    reviewPopoverThumbShow.value = false
+  }
+}
+
+function resolveReviewPopoverMount() {
+  //0917 掛到中欄模板區，勿掛进 is-typing 編輯器根（避免打字光標 ::after 洩進 tip 正文末尾成「|」）
+  const main = document.querySelector('.report-edit-page__main--anchored') as HTMLElement | null
+  if (main) {
+    reviewPopoverTeleportTo.value = main
+    return main
+  }
+  const editor = editorRootRef.value
+  if (editor) {
+    reviewPopoverTeleportTo.value = editor
+    return editor
+  }
+  reviewPopoverTeleportTo.value = 'body'
+  return null
+}
+
+function sanitizeTipContent(text: string) {
+  return String(text || '')
+    .replace(/[\u0000-\u0008\u000B\u000C\u000E-\u001F]/g, '')
+    .replace(/\|+\s*$/g, '')
+    .trim()
+}
+
+/** 從父級 reviewMarkers 同步來源檔（無 mock 隨機目錄） */
+function syncMarkerSourceFiles() {
+  const next: Record<number, SourceFile> = {}
+  for (const marker of props.reviewMarkers) {
+    if (marker.sourceFile) next[marker.id] = marker.sourceFile
+  }
+  markerSourceFiles.value = next
+}
+
+function getMarkerSourceFile(markerId: number): SourceFile | undefined {
+  return markerSourceFiles.value[markerId]
+}
+
+function fileIdFromPreviewUrl(url: string, fallback: string) {
+  const raw = String(url || '').trim()
+  if (!raw) return fallback
+  try {
+    const parsed = new URL(raw, window.location.origin)
+    return (
+      parsed.searchParams.get('pageId') ||
+      parsed.searchParams.get('pageContentId') ||
+      parsed.searchParams.get('fileIndexId') ||
+      parsed.searchParams.get('fileId') ||
+      fallback
+    )
+  } catch {
+    return fallback
+  }
+}
+
+function resolvePreviewFile(marker: EditorReviewMarker): SourceFile | null {
+  const fromList = getMarkerSourceFile(marker.id)
+  const fromRef = marker.chunkId ? getChartStreamRef(marker.chunkId) : undefined
+  const name = String(
+    marker.author || marker.linkLabel || fromRef?.sourceName || fromList?.name || ''
+  ).trim()
+  //0917 tip：只用 REF 已有的下載地址，絕不靠本系統 GenaiReportFileController 再下一次
+  const url = String(
+    marker.filePath || fromRef?.filePath || marker.href || fromList?.url || ''
+  ).trim()
+  const id = String(
+    fromList?.id || fileIdFromPreviewUrl(url, marker.chunkId || String(marker.id))
+  ).trim()
+  if (!name && !url && !id) return null
+  return {
+    id: id || String(marker.id),
+    name: name || fromList?.name || '未命名檔案',
+    selected: fromList?.selected ?? true,
+    url: url || undefined,
+  }
+}
+
+async function openSourcePreview(file: SourceFile) {
+  if (!isPreviewableFileName(file.name)) {
+    ElMessage.warning('暫僅支持預覽 PDF / DOCX / DOC / 圖片')
+    return
+  }
+  if (!String(file.url || '').trim()) {
+    ElMessage.warning('缺少檔案地址，無法預覽')
+    return
+  }
+  //0917 先關 tip，避免 Teleport 殘留影響中欄；預覽只開新 tab，不改本頁路由
+  reviewPopoverVisible.value = false
+  try {
+    await openFilePreviewInNewTab({
+      id: file.id,
+      name: file.name,
+      url: file.url,
+    })
+  } catch (err) {
+    ElMessage.warning(
+      err instanceof Error && err.message.trim() ? err.message : '無法打開預覽頁'
+    )
+  }
+}
+
+function onSourceNameClick() {
+  const marker = activeReviewMarker.value
+  if (!marker) return
+  const file = resolvePreviewFile(marker)
+  if (!file) {
+    ElMessage.warning('缺少檔案資訊，無法預覽')
+    return
+  }
+  void openSourcePreview(file)
+}
+
+function closeReviewPopover() {
+  unbindReviewPopoverWheel()
+  cancelHideReviewPopover()
+  onReviewPopoverThumbUp()
+  reviewPopoverVisible.value = false
+  activeReviewMarker.value = null
+  reviewPopoverNeedsScroll.value = false
+  reviewPopoverThumbShow.value = false
+  reviewPopoverThumbY.value = 0
+}
+
+function cancelHideReviewPopover() {
+  if (!hideReviewPopoverTimer) return
+  window.clearTimeout(hideReviewPopoverTimer)
+  hideReviewPopoverTimer = 0
+}
+
+function scheduleHideReviewPopover() {
+  //0917 拖動滾動條時勿關閉 tip
+  if (reviewPopoverThumbDrag) return
+  cancelHideReviewPopover()
+  hideReviewPopoverTimer = window.setTimeout(() => {
+    hideReviewPopoverTimer = 0
+    if (reviewPopoverThumbDrag) return
+    closeReviewPopover()
+  }, 160)
+}
+
+function formatSourceNameDisplay(name: string) {
+  return String(name || '').trim()
+}
+
+function getMainClampBounds(main?: HTMLElement | null) {
+  const el =
+    main ??
+    (editorRootRef.value?.querySelector('.report-tiptap-editor__body') as HTMLElement | null) ??
+    editorRootRef.value ??
+    (document.querySelector('.report-edit-page__main--anchored') as HTMLElement | null)
+  if (el) {
+    const r = el.getBoundingClientRect()
+    return {
+      left: r.left + 8,
+      top: r.top + 8,
+      right: r.right - 8,
+      bottom: r.bottom - 8,
+      originLeft: r.left,
+      originTop: r.top,
+      useAbsolute: true as const,
+    }
+  }
+  return {
+    left: 8,
+    top: 8,
+    right: window.innerWidth - 8,
+    bottom: window.innerHeight - 8,
+    originLeft: 0,
+    originTop: 0,
+    useAbsolute: false as const,
+  }
+}
+
+/** //0917 錨在當前 tip 上下：優先下方，不夠則上方；禁止按 18 行滿高把 tip 頂飛到編輯器頂部 */
+function positionReviewPopover(el: HTMLElement, place: 'above' | 'below' | 'auto' = 'auto') {
+  const mount = resolveReviewPopoverMount()
+  const clampEl =
+    (editorRootRef.value?.querySelector('.report-tiptap-editor__body') as HTMLElement | null) ??
+    mount
+  const originEl = (mount as HTMLElement | null) ?? editorRootRef.value
+  const originRect = originEl?.getBoundingClientRect()
+  const rect = el.getBoundingClientRect()
+  const gap = 8
+  const bounds = getMainClampBounds(clampEl)
+  const POPOVER_MAX_W = 500
+  const maxWidth = Math.min(POPOVER_MAX_W, Math.max(200, bounds.right - bounds.left))
+  const width = maxWidth
+
+  const spaceBelow = Math.max(0, bounds.bottom - rect.bottom - gap)
+  const spaceAbove = Math.max(0, bounds.top < rect.top ? rect.top - bounds.top - gap : 0)
+  let placement: 'above' | 'below' = place === 'auto' ? 'below' : place
+  if (place === 'auto') {
+    // 下方夠放優先；否則選空間更大的一側，始終貼著當前 tip
+    if (spaceBelow >= 80 || spaceBelow >= spaceAbove) placement = 'below'
+    else placement = 'above'
+  }
+
+  // 初始不按 sideSpace 壓矮（否則首幀/量高會裁成一行）；高度交給 layout 按正文撐開
+  const maxHeight = REVIEW_POPOVER_MAX_H
+
+  let left = rect.left
+  if (left + width > bounds.right) left = bounds.right - width
+  left = Math.min(Math.max(left, bounds.left), Math.max(bounds.left, bounds.right - width))
+
+  //0917 先用短估計貼 tip，真正高度由 layout + anchor 再校正（避免 18 行滿高把 tip 頂飛）
+  const guessH = 80
+  let top = placement === 'below' ? rect.bottom + gap : rect.top - gap - guessH
+  if (placement === 'below' && top + guessH > bounds.bottom && spaceAbove >= guessH) {
+    placement = 'above'
+    top = rect.top - gap - guessH
+  }
+  if (placement === 'above' && top < bounds.top && spaceBelow >= guessH) {
+    placement = 'below'
+    top = rect.bottom + gap
+  }
+
+  const originLeft = originRect?.left ?? bounds.originLeft
+  const originTop = originRect?.top ?? bounds.originTop
+
+  reviewPopoverStyle.value = {
+    position: 'absolute',
+    left: `${Math.round(left - originLeft)}px`,
+    top: `${Math.round(top - originTop)}px`,
+    transform: 'none',
+    width: `${Math.round(width)}px`,
+    maxWidth: `${POPOVER_MAX_W}px`,
+    height: 'auto',
+    maxHeight: `${Math.round(maxHeight)}px`,
+    overflow: 'hidden',
+    zIndex: '4000',
+  }
+  return { placement, gap, bounds, rect, originLeft, originTop, maxHeight }
+}
+
+/** //0917 按實際高度貼回 tip，絕不因滿高估算被夾到編輯器頂部 */
+function anchorReviewPopoverToCitation(
+  citation: HTMLElement,
+  placement: 'above' | 'below',
+  gap: number,
+  bounds: { left: number; top: number; right: number; bottom: number },
+  originLeft: number,
+  originTop: number
+) {
+  const pop = reviewPopoverRef.value
+  if (!pop) return placement
+  const rect = citation.getBoundingClientRect()
+  const popH = Math.max(1, Math.ceil(pop.getBoundingClientRect().height))
+  const popW = pop.offsetWidth || 0
+
+  let left = Number.parseFloat(String(reviewPopoverStyle.value.left || '0')) + originLeft
+  if (left + popW > bounds.right) left = bounds.right - popW
+  left = Math.min(Math.max(left, bounds.left), Math.max(bounds.left, bounds.right - popW))
+
+  let nextPlacement = placement
+  const belowTop = rect.bottom + gap
+  const aboveTop = rect.top - gap - popH
+  const belowFits = belowTop + popH <= bounds.bottom + 0.5
+  const aboveFits = aboveTop >= bounds.top - 0.5
+
+  let top: number
+  if (placement === 'below') {
+    if (belowFits) top = belowTop
+    else if (aboveFits) {
+      nextPlacement = 'above'
+      top = aboveTop
+    } else {
+      nextPlacement = 'above'
+      top = Math.max(bounds.top, Math.min(aboveTop, bounds.bottom - popH))
+    }
+  } else if (aboveFits) {
+    top = aboveTop
+  } else if (belowFits) {
+    nextPlacement = 'below'
+    top = belowTop
+  } else {
+    top = Math.max(bounds.top, Math.min(aboveTop, bounds.bottom - popH))
+  }
+
+  // 定位只改 left/top；高度完全交給 layout，禁止再改 maxHeight（否則會裁掉下邊距 / 滾動條）
+  reviewPopoverStyle.value = {
+    ...reviewPopoverStyle.value,
+    left: `${Math.round(left - originLeft)}px`,
+    top: `${Math.round(top - originTop)}px`,
+  }
+  return nextPlacement
+}
+
+function onReviewDocClick(event: MouseEvent) {
+  if (!reviewPopoverVisible.value) return
+  const target = event.target as HTMLElement | null
+  if (target?.closest('.report-chapter-review-popover')) return
+  if (target?.closest('.report-tiptap-citation')) return
+  closeReviewPopover()
+}
+
+function markerFromCitation(citation: HTMLElement): EditorReviewMarker | null {
+  const id = Number(citation.dataset.citation)
+  const tip = String(citation.dataset.tip || citation.getAttribute('title') || '').trim()
+  const href = String(citation.dataset.href || '').trim()
+  const linkLabel = String(citation.dataset.linkLabel || '').trim()
+  const sourceName = String(citation.dataset.sourceName || '').trim()
+  const filePath = String(citation.dataset.filePath || '').trim()
+  const filePreviewUrl = String(citation.dataset.filePreviewUrl || '').trim()
+  const chunkId = String(citation.dataset.chunkId || '').trim()
+  const fromList = Number.isFinite(id)
+    ? (props.reviewMarkers.find((item) => item.id === id) ?? null)
+    : null
+  if (fromList) {
+    return {
+      ...fromList,
+      content: sanitizeTipContent(fromList.content || tip),
+      href: fromList.href || href || filePath,
+      linkLabel: fromList.linkLabel || linkLabel || sourceName || href,
+      author: fromList.author || sourceName,
+      filePath: fromList.filePath || filePath,
+      filePreviewUrl: fromList.filePreviewUrl || filePreviewUrl,
+      chunkId: fromList.chunkId || chunkId,
+    }
+  }
+  if (!tip && !href && !sourceName) return null
+  return {
+    id: Number.isFinite(id) ? id : 0,
+    author: sourceName,
+    content: sanitizeTipContent(tip),
+    href: href || filePath,
+    linkLabel: linkLabel || sourceName || href,
+    filePath,
+    filePreviewUrl,
+    chunkId,
+  }
+}
+
+function openReviewFromCitation(citation: HTMLElement) {
+  cancelHideReviewPopover()
+  const marker = markerFromCitation(citation)
+  if (!marker) {
+    closeReviewPopover()
+    return
+  }
+  activeReviewMarker.value = marker
+  const placed = positionReviewPopover(citation)
+  reviewPopoverVisible.value = true
+  void nextTick(() => {
+    if (!reviewPopoverVisible.value || activeReviewMarker.value !== marker) return
+    if (!reviewPopoverRef.value) return
+    //0917 先按內容撐開/限高，再用實際高度貼回 tip（避免短 tip 被 18 行滿高頂飛）
+    layoutReviewPopoverScroll()
+    anchorReviewPopoverToCitation(
+      citation,
+      placed.placement,
+      placed.gap,
+      placed.bounds,
+      placed.originLeft,
+      placed.originTop
+    )
+    syncReviewPopoverThumb()
+    requestAnimationFrame(() => {
+      if (!reviewPopoverVisible.value || activeReviewMarker.value !== marker) return
+      layoutReviewPopoverScroll()
+      anchorReviewPopoverToCitation(
+        citation,
+        placed.placement,
+        placed.gap,
+        placed.bounds,
+        placed.originLeft,
+        placed.originTop
+      )
+      syncReviewPopoverThumb()
+    })
+  })
+}
+
+function onEditorBodyMouseOver(event: MouseEvent) {
+  const target = event.target as HTMLElement | null
+  if (target?.closest('.report-chapter-review-popover')) {
+    cancelHideReviewPopover()
+    return
+  }
+  const citation = target?.closest('.report-tiptap-citation') as HTMLElement | null
+  if (!citation) {
+    if (reviewPopoverVisible.value) scheduleHideReviewPopover()
+    return
+  }
+  openReviewFromCitation(citation)
+}
+
+function onEditorBodyClick(event: MouseEvent) {
+  const target = event.target as HTMLElement | null
+  const bodyLink = target?.closest('a.report-tiptap-link') as HTMLAnchorElement | null
+  if (bodyLink?.href) {
+    event.preventDefault()
+    event.stopPropagation()
+    closeReviewPopover()
+    window.open(bodyLink.href, '_blank', 'noopener,noreferrer')
+    return
+  }
+
+  const citation = target?.closest('.report-tiptap-citation') as HTMLElement | null
+  if (!citation) return
+  event.preventDefault()
+  event.stopPropagation()
+  openReviewFromCitation(citation)
+}
+
+function onChartStreamRefsUpdated() {
+  if (isTypewriting.value && streamSession) {
+    applyStreamSessionHtml(streamSession)
+    return
+  }
+  if (!isTypewriting.value && editor.value) {
+    applyEditorHtml(buildContentHtml())
+  }
+}
+
+onMounted(() => {
+  syncMarkerSourceFiles()
+  resolveReviewPopoverMount()
+  document.addEventListener('click', onReviewDocClick, true)
+  window.addEventListener(CHART_STREAM_REFS_UPDATED_EVENT, onChartStreamRefsUpdated)
+})
+
+onBeforeUnmount(() => {
+  stopTypewriter()
+  unbindReviewPopoverWheel()
+  cancelHideReviewPopover()
+  onReviewPopoverThumbUp()
+  document.removeEventListener('click', onReviewDocClick, true)
+  window.removeEventListener(CHART_STREAM_REFS_UPDATED_EVENT, onChartStreamRefsUpdated)
+})
+
+function escapeHtml(value: string) {
+  return value
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+}
+
+/**
+ * tip 用 inline atom，避免 Mark 把打字光標/後續字元吸進圓點（視覺上成「2|」）
+ */
+const CitationNode = Node.create({
+  name: 'citation',
+  group: 'inline',
+  inline: true,
+  atom: true,
+  selectable: true,
+  draggable: false,
+
+  addOptions() {
+    return {
+      HTMLAttributes: {
+        class: 'report-tiptap-citation',
+      },
+    }
+  },
+
+  addAttributes() {
+    return {
+      id: {
+        default: null,
+        parseHTML: (element) => element.getAttribute('data-citation'),
+        renderHTML: (attributes) => {
+          if (attributes.id == null) return {}
+          return {
+            'data-citation': attributes.id,
+            class: 'report-tiptap-citation',
+          }
+        },
+      },
+      tip: {
+        default: '',
+        parseHTML: (element) =>
+          element.getAttribute('data-tip') || element.getAttribute('title') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.tip) return {}
+          return { 'data-tip': attributes.tip }
+        },
+      },
+      href: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-href') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.href) return {}
+          return { 'data-href': attributes.href }
+        },
+      },
+      linkLabel: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-link-label') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.linkLabel) return {}
+          return { 'data-link-label': attributes.linkLabel }
+        },
+      },
+      sourceName: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-source-name') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.sourceName) return {}
+          return { 'data-source-name': attributes.sourceName }
+        },
+      },
+      filePath: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-file-path') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.filePath) return {}
+          return { 'data-file-path': attributes.filePath }
+        },
+      },
+      filePreviewUrl: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-file-preview-url') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.filePreviewUrl) return {}
+          return { 'data-file-preview-url': attributes.filePreviewUrl }
+        },
+      },
+      chunkId: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-chunk-id') || '',
+        renderHTML: (attributes) => {
+          if (!attributes.chunkId) return {}
+          return { 'data-chunk-id': attributes.chunkId }
+        },
+      },
+    }
+  },
+
+  parseHTML() {
+    return [{ tag: 'span.report-tiptap-citation' }, { tag: 'span[data-citation]' }]
+  },
+
+  renderHTML({ node, HTMLAttributes }) {
+    const id = String(node.attrs.id ?? '1')
+    return [
+      'span',
+      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
+        'data-citation': id,
+        class: 'report-tiptap-citation',
+        contenteditable: 'false',
+      }),
+      id,
+    ]
+  },
+})
+
+function getEditorImageMaxSize(editorDom: HTMLElement | null) {
+  const body = editorDom?.closest('.report-tiptap-editor__body') as HTMLElement | null
+  const maxWidth = Math.max(120, (body?.clientWidth ?? editorDom?.clientWidth ?? 640) - 8)
+  const maxHeight = Math.max(120, (body?.clientHeight ?? 480) - 8)
+  return { maxWidth, maxHeight }
+}
+
+function applyImageDomSize(el: HTMLImageElement, width: number, height: number) {
+  const w = Math.max(1, Math.round(width))
+  const h = Math.max(1, Math.round(height))
+  el.style.width = `${w}px`
+  el.style.height = `${h}px`
+  el.setAttribute('width', String(w))
+  el.setAttribute('height', String(h))
+}
+
+declare module '@tiptap/core' {
+  interface Commands<ReturnType> {
+    structureBlock: {
+      insertStructureBlock: () => ReturnType
+    }
+  }
+}
+
+/** 結構區塊：組織架構圖演示 NodeView */
+const StructureBlock = Node.create({
+  name: 'structureBlock',
+  group: 'block',
+  atom: true,
+  draggable: true,
+  selectable: true,
+
+  addAttributes() {
+    return {
+      title: {
+        default: '',
+        parseHTML: (element) => element.getAttribute('data-title') || '',
+        renderHTML: (attributes) => ({ 'data-title': attributes.title }),
+      },
+      zoom: {
+        default: 70,
+        parseHTML: (element) => Number(element.getAttribute('data-zoom') || 70),
+        renderHTML: (attributes) => ({ 'data-zoom': attributes.zoom }),
+      },
+      tree: {
+        default: {
+          id: 'root',
+          label: '',
+          pct: 0,
+          children: [],
+        },
+        parseHTML: (element) => {
+          const raw = element.getAttribute('data-tree')
+          if (!raw) {
+            return {
+              id: 'root',
+              label: '',
+              pct: 0,
+              children: [],
+            }
+          }
+          try {
+            return JSON.parse(raw)
+          } catch {
+            return {
+              id: 'root',
+              label: '',
+              pct: 0,
+              children: [],
+            }
+          }
+        },
+        renderHTML: (attributes) => ({
+          'data-tree': JSON.stringify(attributes.tree ?? null),
+        }),
+      },
+    }
+  },
+
+  parseHTML() {
+    return [{ tag: 'div[data-type="structure-block"]' }]
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    return ['div', mergeAttributes({ 'data-type': 'structure-block' }, HTMLAttributes)]
+  },
+
+  addCommands() {
+    return {
+      insertStructureBlock:
+        () =>
+          ({ commands }) =>
+            commands.insertContent({
+              type: this.name,
+              attrs: {
+              title: '',
+                zoom: 70,
+                tree: {
+                  id: 'root',
+                label: '',
+                  pct: 0,
+                  children: [],
+                },
+              },
+            }),
+    }
+  },
+
+  addNodeView() {
+    return VueNodeViewRenderer(ReportStructureBlockView)
+  },
+})
+
+/** 可縮放圖片：手動調整後同步 width/height 到 DOM，並限制不超過編輯器可視高度 */
+const ResizableReportImage = Image.extend({
+  addAttributes() {
+    return {
+      ...this.parent?.(),
+      width: {
+        default: null,
+        parseHTML: (element) => {
+          const raw = element.getAttribute('width')
+          return raw ? Number(raw) : null
+        },
+        renderHTML: (attributes) => {
+          if (attributes.width == null) return {}
+          return { width: attributes.width }
+        },
+      },
+      height: {
+        default: null,
+        parseHTML: (element) => {
+          const raw = element.getAttribute('height')
+          return raw ? Number(raw) : null
+        },
+        renderHTML: (attributes) => {
+          if (attributes.height == null) return {}
+          return { height: attributes.height }
+        },
+      },
+    }
+  },
+
+  addNodeView() {
+    return ({ node, getPos, HTMLAttributes, editor }) => {
+      const el = document.createElement('img')
+      el.draggable = false
+
+      const mergedAttributes = mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)
+      Object.entries(mergedAttributes).forEach(([key, value]) => {
+        if (value == null) return
+        if (key === 'width' || key === 'height') return
+        el.setAttribute(key, String(value))
+      })
+      if (mergedAttributes.src != null) el.src = String(mergedAttributes.src)
+
+      const { maxWidth, maxHeight } = getEditorImageMaxSize(editor.view.dom)
+
+      const nodeView = new ResizableNodeView({
+        element: el,
+        editor,
+        node,
+        getPos,
+        onResize: (width, height) => {
+          applyImageDomSize(el, width, height)
+        },
+        onCommit: (width, height) => {
+          const pos = getPos()
+          if (pos === undefined) return
+          applyImageDomSize(el, width, height)
+          this.editor
+            .chain()
+            .setNodeSelection(pos)
+            .updateAttributes(this.name, {
+              width: Math.round(width),
+              height: Math.round(height),
+            })
+            .run()
+        },
+        onUpdate: (updatedNode) => {
+          if (updatedNode.type.name !== this.name) return false
+          const nextWidth = updatedNode.attrs.width as number | null
+          const nextHeight = updatedNode.attrs.height as number | null
+          if (nextWidth != null && nextHeight != null) {
+            applyImageDomSize(el, nextWidth, nextHeight)
+          }
+          const nextSrc = updatedNode.attrs.src as string | null
+          if (nextSrc && el.getAttribute('src') !== nextSrc) {
+            el.src = nextSrc
+          }
+          return true
+        },
+        options: {
+          directions: ['top-left', 'top-right', 'bottom-left', 'bottom-right'],
+          min: { width: 48, height: 48 },
+          max: { width: maxWidth, height: maxHeight },
+          preserveAspectRatio: true,
+          className: {
+            container: 'report-tiptap-image-resize',
+            wrapper: 'report-tiptap-image-resize__wrap',
+            handle: 'report-tiptap-image-resize__handle',
+            resizing: 'is-resizing',
+          },
+        },
+      })
+
+      const initialWidth = node.attrs.width as number | null
+      const initialHeight = node.attrs.height as number | null
+      if (initialWidth != null && initialHeight != null) {
+        applyImageDomSize(el, initialWidth, initialHeight)
+      }
+
+      const dom = nodeView.dom as HTMLElement
+      dom.style.visibility = 'hidden'
+      dom.style.pointerEvents = 'none'
+      el.onload = () => {
+        // 載入後若尚無尺寸，按編輯器上限收縮一次並寫回 attrs/DOM
+        if (node.attrs.width == null || node.attrs.height == null) {
+          const naturalW = el.naturalWidth || el.offsetWidth
+          const naturalH = el.naturalHeight || el.offsetHeight
+          if (naturalW > 0 && naturalH > 0) {
+            let width = naturalW
+            let height = naturalH
+            if (height > maxHeight) {
+              width = Math.round((width * maxHeight) / height)
+              height = maxHeight
+            }
+            if (width > maxWidth) {
+              height = Math.round((height * maxWidth) / width)
+              width = maxWidth
+            }
+            applyImageDomSize(el, width, height)
+            const pos = getPos()
+            if (pos !== undefined) {
+              this.editor
+                .chain()
+                .command(({ tr }: CommandProps) => {
+                  tr.setNodeMarkup(pos, undefined, {
+                    ...node.attrs,
+                    width,
+                    height,
+                  })
+                  return true
+                })
+                .run()
+            }
+          }
+        }
+        dom.style.visibility = ''
+        dom.style.pointerEvents = ''
+      }
+
+      return nodeView
+    }
+  },
+})
+
+/** 僅父級標題 + 正文；正文按 Markdown + HTML 解析（接口 sectionContent） */
+function buildPlainContentHtml() {
+  const title = normalizeReadableSpacing((props.chapterTitle || '').trim())
+  const intro = (props.chapterIntro || '').trim()
+  if (!title && !intro) return ''
+  let html = ''
+  if (title) html += `<h2>${escapeHtml(title)}</h2>`
+  if (intro) html += parseMarkdownToHtml(intro)
+  return html
+}
+
+function buildContentHtml() {
+  return buildPlainContentHtml()
+}
+
+/**
+ * 流式打字機：
+ * - 按父級傳入的 title/intro 緩衝逐字輸出
+ * - 緩衝追平後進入 waiting，持續等待模型斷續追加
+ * - 追加後從已打進度續打（不整段重來）
+ * - 追平且 settleMs 內無新內容 → complete；緩衝一直為空則永不 complete
+ */
+/** DeepSeek 風格：約 64 字/秒，單幀最多 6 字，避免卡頓感 */
+const TYPEWRITER_CHARS_PER_SEC = 64
+const TYPEWRITER_MAX_CHARS_PER_FRAME = 6
+
+const editorRootRef = ref<HTMLElement | null>(null)
+const isTypewriting = ref(false)
+let typewriterRaf = 0
+let typewriterToken = 0
+let typewriterSettleTimer = 0
+
+interface StreamSession {
+  titleTarget: string
+  introTarget: string
+  titleTyped: number
+  introTyped: number
+  lastTs: number
+  charCarry: number
+  waiting: boolean
+  /** 啟動時已有內容（一次性接口灌入） */
+  startedWithContent: boolean
+  /** 過程中緩衝曾變長（斷續流式） */
+  sawContentGrowth: boolean
+}
+
+let streamSession: StreamSession | null = null
+
+function isScrollableY(el: HTMLElement): boolean {
+  const { overflowY } = getComputedStyle(el)
+  const canOverflow =
+    overflowY === 'auto' ||
+    overflowY === 'scroll' ||
+    overflowY === 'overlay' ||
+    el.classList.contains('el-scrollbar__wrap')
+  return canOverflow && el.scrollHeight > el.clientHeight + 1
+}
+
+/** 中欄 el-scrollbar wrap（優先 report-edit-page__main--anchored） */
+function findTypewriterScrollParent(from: HTMLElement): HTMLElement | null {
+  const main =
+    (from.closest('.report-edit-page__main--anchored') as HTMLElement | null) ||
+    (document.querySelector('.report-edit-page__main--anchored') as HTMLElement | null)
+  if (main) {
+    const wrap = main.querySelector(
+      '.report-edit-page__col-scroll .el-scrollbar__wrap'
+    ) as HTMLElement | null
+    if (wrap) return wrap
+  }
+
+  const col = from.closest('.report-edit-page__col-scroll') as HTMLElement | null
+  const wrap = col?.querySelector('.el-scrollbar__wrap') as HTMLElement | null
+  if (wrap) return wrap
+
+  let node: HTMLElement | null = from.parentElement
+  let fallback: HTMLElement | null = null
+  while (node && node !== document.body) {
+    if (node.classList.contains('el-scrollbar__wrap')) fallback = node
+    if (isScrollableY(node)) return node
+    node = node.parentElement
+  }
+  return fallback
+}
+
+/** 打字機默認跟滾；用戶拖條 / 滾輪接管後暫停，回到底部再恢復 */
+let typewriterFollowPaused = false
+let typewriterAutoScrolling = false
+let typewriterFollowWrap: HTMLElement | null = null
+let typewriterFollowBar: HTMLElement | null = null
+/** 結束打字灌全文時強制釘底，避免 applyEditorHtml 還原到中間位置 */
+let pinBottomAfterNextApply = false
+let scrollEaseRaf = 0
+let finalizePinTimers: number[] = []
+
+function isNearTypewriterBottom(el: HTMLElement) {
+  const maxTop = el.scrollHeight - el.clientHeight
+  return maxTop <= 0 || el.scrollTop >= maxTop - 48
+}
+
+function pauseTypewriterFollow() {
+  if (!isTypewriting.value) return
+  // 人工介入優先：滾輪 / 拖條 / touch 立刻停跟滾，直到用戶回到底部
+  typewriterFollowPaused = true
+  if (scrollEaseRaf) {
+    cancelAnimationFrame(scrollEaseRaf)
+    scrollEaseRaf = 0
+  }
+}
+
+function onTypewriterFollowScroll() {
+  if (!isTypewriting.value || typewriterAutoScrolling) return
+  const wrap = typewriterFollowWrap
+  if (!wrap) return
+  if (isNearTypewriterBottom(wrap)) {
+    // 用戶滾回底部 → 恢復自動釘底
+    typewriterFollowPaused = false
+    return
+  }
+  // 非程序滾動且已離開底部 → 視為人工接管（兼容只拖軌道、不經 wheel 的情況）
+  typewriterFollowPaused = true
+}
+
+function unbindTypewriterFollowGuards() {
+  if (typewriterFollowWrap) {
+    typewriterFollowWrap.classList.remove('is-typewriter-follow')
+    typewriterFollowWrap.removeEventListener('wheel', pauseTypewriterFollow, true)
+    typewriterFollowWrap.removeEventListener('touchmove', pauseTypewriterFollow, true)
+    typewriterFollowWrap.removeEventListener('scroll', onTypewriterFollowScroll)
+    typewriterFollowWrap = null
+  }
+  if (typewriterFollowBar) {
+    typewriterFollowBar.removeEventListener('pointerdown', pauseTypewriterFollow, true)
+    typewriterFollowBar = null
+  }
+}
+
+function bindTypewriterFollowGuards() {
+  const root = editorRootRef.value
+  if (!root) return
+  const wrap = findTypewriterScrollParent(root)
+  if (!wrap) return
+  if (wrap !== typewriterFollowWrap) {
+    unbindTypewriterFollowGuards()
+    typewriterFollowWrap = wrap
+    wrap.classList.add('is-typewriter-follow')
+    // capture：人工操作先於跟滾處理
+    wrap.addEventListener('wheel', pauseTypewriterFollow, { passive: true, capture: true })
+    wrap.addEventListener('touchmove', pauseTypewriterFollow, { passive: true, capture: true })
+    wrap.addEventListener('scroll', onTypewriterFollowScroll, { passive: true })
+  }
+  const scrollbar = wrap.closest('.el-scrollbar')
+  const bar = scrollbar?.querySelector('.el-scrollbar__bar.is-vertical') as HTMLElement | null
+  if (bar && bar !== typewriterFollowBar) {
+    if (typewriterFollowBar) {
+      typewriterFollowBar.removeEventListener('pointerdown', pauseTypewriterFollow, true)
+    }
+    typewriterFollowBar = bar
+    bar.addEventListener('pointerdown', pauseTypewriterFollow, { capture: true })
+  }
+}
+
+function withTypewriterAutoScroll(fn: () => void) {
+  typewriterAutoScrolling = true
+  fn()
+  window.setTimeout(() => {
+    typewriterAutoScrolling = false
+  }, 80)
+}
+
+function clearFinalizePinTimers() {
+  for (const id of finalizePinTimers) window.clearTimeout(id)
+  finalizePinTimers = []
+}
+
+/** 釘到中欄滾動容器最底部（打印中平滑跟進；結束時強制多次補釘） */
+function pinTypewriterScrollToBottom(options: { smooth?: boolean; force?: boolean } = {}) {
+  const { smooth = true, force = false } = options
+  if (!force && typewriterFollowPaused) return
+  const root = editorRootRef.value
+  if (!root) return
+  const scrollParent = findTypewriterScrollParent(root)
+  if (!scrollParent) return
+  if (!force) bindTypewriterFollowGuards()
+
+  const maxTop = Math.max(0, scrollParent.scrollHeight - scrollParent.clientHeight)
+  if (maxTop <= 0) {
+    withTypewriterAutoScroll(() => {
+      scrollParent.scrollTop = 0
+    })
+    return
+  }
+
+  if (!smooth || force) {
+    if (scrollEaseRaf) {
+      cancelAnimationFrame(scrollEaseRaf)
+      scrollEaseRaf = 0
+    }
+    withTypewriterAutoScroll(() => {
+      scrollParent.scrollTop = maxTop
+    })
+    return
+  }
+
+  const cur = scrollParent.scrollTop
+  const delta = maxTop - cur
+  if (delta <= 0.5) return
+  // 落後過多直接追上；否則緩動，避免內容跳動
+  if (delta > 96) {
+    withTypewriterAutoScroll(() => {
+      scrollParent.scrollTop = maxTop
+    })
+    return
+  }
+  withTypewriterAutoScroll(() => {
+    scrollParent.scrollTop = cur + Math.max(delta * 0.5, Math.min(delta, 28))
+  })
+}
+
+/** DeepSeek 式跟隨：打印過程中始終朝容器底部，最新一行留在視口底邊 */
+function scrollTypewriterLikeDeepSeek() {
+  pinTypewriterScrollToBottom({ smooth: true, force: false })
+}
+
+let scrollFollowToken = 0
+
+/** 佈局穩定後再釘底；結束時多次補釘，避免停在中間 */
+function scrollTypewriterAfterLayout(finalize = false) {
+  if (!finalize && typewriterFollowPaused) return
+  const token = ++scrollFollowToken
+  const run = () => {
+    if (token !== scrollFollowToken) return
+    if (!finalize && typewriterFollowPaused) return
+    pinTypewriterScrollToBottom({ smooth: !finalize, force: finalize })
+  }
+  run()
+  requestAnimationFrame(() => {
+    requestAnimationFrame(run)
+  })
+  if (!finalize) return
+  clearFinalizePinTimers()
+  for (const ms of [32, 80, 160, 320]) {
+    finalizePinTimers.push(
+      window.setTimeout(() => {
+        if (token !== scrollFollowToken) return
+        pinTypewriterScrollToBottom({ smooth: false, force: true })
+      }, ms)
+    )
+  }
+}
+
+function clearTypewriterSettleTimer() {
+  if (typewriterSettleTimer) {
+    window.clearTimeout(typewriterSettleTimer)
+    typewriterSettleTimer = 0
+  }
+}
+
+/** 與最終灌入全文一致：不剝句末標點，避免打完後跳變 */
+function getStreamTargets() {
+  return {
+    title: (props.chapterTitle || '').trim(),
+    // <think> 不进打字机，避免先空打几十秒才出 mock 正文
+    intro: stripThinkBlocks(props.chapterIntro || '').trim(),
+  }
+}
+
+/** 新緩衝相對已打前綴：可續打則保留進度，否則回退到公共前綴 */
+function mergeStreamField(
+  prevTarget: string,
+  typed: number,
+  nextTarget: string
+): { target: string; typed: number; grew: boolean } {
+  const typedText = prevTarget.slice(0, typed)
+  if (nextTarget.startsWith(typedText)) {
+    return {
+      target: nextTarget,
+      typed,
+      grew: nextTarget.length > prevTarget.length,
+    }
+  }
+  let common = 0
+  const limit = Math.min(typedText.length, nextTarget.length)
+  while (common < limit && typedText[common] === nextTarget[common]) common += 1
+  return {
+    target: nextTarget,
+    typed: common,
+    grew: nextTarget.length > common,
+  }
+}
+
+function renderStreamHtml(session: StreamSession): string {
+  let html = ''
+  if (session.titleTarget.length > 0 || session.titleTyped > 0) {
+    html += `<h2>${escapeHtml(session.titleTarget.slice(0, session.titleTyped))}</h2>`
+  }
+  if (
+    session.introTyped > 0 ||
+    (session.titleTyped >= session.titleTarget.length && session.introTarget)
+  ) {
+    html += parseMarkdownToHtmlStream(session.introTarget.slice(0, session.introTyped), {
+      // 追平後把末尾 [ref:uuid] 刷成 tip；打字中則等後續字元，避免光標貼 tip 成「3|」
+      flushTrailingRef: isStreamCaughtUp(session),
+    })
+  }
+  return html
+}
+
+function isStreamCaughtUp(session: StreamSession) {
+  return (
+    session.titleTyped >= session.titleTarget.length &&
+    session.introTyped >= session.introTarget.length
+  )
+}
+
+function isStreamBufferEmpty(session: StreamSession) {
+  return !session.titleTarget && !session.introTarget
+}
+
+function applyStreamSessionHtml(session: StreamSession) {
+  applyEditorHtml(renderStreamHtml(session))
+  scrollTypewriterAfterLayout(false)
+}
+
+function advanceStreamChars(session: StreamSession, count: number): 'progress' | 'caught_up' {
+  let remain = count
+  while (remain > 0) {
+    if (session.titleTyped < session.titleTarget.length) {
+      const take = Math.min(remain, session.titleTarget.length - session.titleTyped)
+      session.titleTyped += take
+      remain -= take
+      continue
+    }
+    if (session.introTyped < session.introTarget.length) {
+      const take = Math.min(remain, session.introTarget.length - session.introTyped)
+      session.introTyped += take
+      remain -= take
+      continue
+    }
+    return 'caught_up'
+  }
+  return isStreamCaughtUp(session) ? 'caught_up' : 'progress'
+}
+
+function stopTypewriter() {
+  if (typewriterRaf) {
+    cancelAnimationFrame(typewriterRaf)
+    typewriterRaf = 0
+  }
+  if (scrollEaseRaf) {
+    cancelAnimationFrame(scrollEaseRaf)
+    scrollEaseRaf = 0
+  }
+  clearTypewriterSettleTimer()
+  clearFinalizePinTimers()
+  streamSession = null
+  isTypewriting.value = false
+  typewriterFollowPaused = false
+  unbindTypewriterFollowGuards()
+}
+
+function finishTypewriter() {
+  // 先標記下一幀灌全文要釘底，避免 applyEditorHtml 把滾動還原到中間
+  pinBottomAfterNextApply = true
+  stopTypewriter()
+  applyEditorHtml(buildContentHtml())
+  pinBottomAfterNextApply = false
+  scrollTypewriterAfterLayout(true)
+  emit('typewriter-complete')
+}
+
+/**
+ * 追平後：
+ * - 緩衝空 → 持續等首包
+ * - 啟動即有全文且過程無增長 → 一次性接口，立即 complete
+ * - 否則 → settle 等待斷續追加
+ */
+function onStreamCaughtUp(token: number, session: StreamSession) {
+  session.waiting = true
+  isTypewriting.value = true
+  applyStreamSessionHtml(session)
+
+  if (isStreamBufferEmpty(session) || !session.introTarget) {
+    clearTypewriterSettleTimer()
+    return
+  }
+
+  if (session.startedWithContent && !session.sawContentGrowth) {
+    finishTypewriter()
+    return
+  }
+
+  if (!typewriterSettleTimer) scheduleStreamSettle(token)
+}
+
+function scheduleStreamSettle(token: number) {
+  clearTypewriterSettleTimer()
+  const settleMs = Math.max(0, props.typewriterSettleMs)
+  if (settleMs <= 0) {
+    finishTypewriter()
+    return
+  }
+  typewriterSettleTimer = window.setTimeout(() => {
+    typewriterSettleTimer = 0
+    if (token !== typewriterToken) return
+    const session = streamSession
+    if (!session || !isStreamCaughtUp(session) || isStreamBufferEmpty(session)) return
+    finishTypewriter()
+  }, settleMs)
+}
+
+function ensureTypewriterRaf(token: number) {
+  if (typewriterRaf) return
+  typewriterRaf = requestAnimationFrame((ts) => streamFrame(token, ts))
+}
+
+function streamFrame(token: number, ts: number) {
+  typewriterRaf = 0
+  if (token !== typewriterToken || !editor.value) {
+    stopTypewriter()
+    return
+  }
+  if (props.editable || props.disableTypewriter || props.typewriterPhase === 'done') {
+    stopTypewriter()
+    applyEditorHtml(buildContentHtml())
+    return
+  }
+  if (props.typewriterPhase === 'idle') {
+    stopTypewriter()
+    applyEditorHtml('')
+    return
+  }
+
+  const session = streamSession
+  if (!session) return
+
+  if (!session.lastTs) session.lastTs = ts
+  const dt = Math.min(48, ts - session.lastTs)
+  session.lastTs = ts
+
+  if (isStreamCaughtUp(session)) {
+    onStreamCaughtUp(token, session)
+    return
+  }
+
+  session.waiting = false
+  session.charCarry += (TYPEWRITER_CHARS_PER_SEC * dt) / 1000
+  let n = Math.floor(session.charCarry)
+  session.charCarry -= n
+  n = Math.min(Math.max(n, 0), TYPEWRITER_MAX_CHARS_PER_FRAME)
+
+  if (n > 0) {
+    const result = advanceStreamChars(session, n)
+    applyStreamSessionHtml(session)
+    if (result === 'caught_up') {
+      onStreamCaughtUp(token, session)
+      return
+    }
+  }
+
+  ensureTypewriterRaf(token)
+}
+
+/** 父級斷續回寫 title/intro：合併緩衝並續打，不整段重啟 */
+function onStreamContentUpdated() {
+  if (props.editable || props.disableTypewriter) return
+  if (props.typewriterPhase === 'idle' || props.typewriterPhase === 'done') return
+
+  const { title, intro } = getStreamTargets()
+  if (!streamSession || !isTypewriting.value) {
+    startTypewriterOrSetFull()
+    return
+  }
+
+  const session = streamSession
+  const prevTitleLen = session.titleTarget.length
+  const prevIntroLen = session.introTarget.length
+  const nextTitle = mergeStreamField(session.titleTarget, session.titleTyped, title)
+  const nextIntro = mergeStreamField(session.introTarget, session.introTyped, intro)
+  session.titleTarget = nextTitle.target
+  session.titleTyped = nextTitle.typed
+  session.introTarget = nextIntro.target
+  session.introTyped = nextIntro.typed
+
+  if (
+    nextTitle.grew ||
+    nextIntro.grew ||
+    session.titleTarget.length > prevTitleLen ||
+    session.introTarget.length > prevIntroLen
+  ) {
+    session.sawContentGrowth = true
+  }
+
+  clearTypewriterSettleTimer()
+  if (isStreamCaughtUp(session)) {
+    onStreamCaughtUp(typewriterToken, session)
+    return
+  }
+
+  session.waiting = false
+  applyStreamSessionHtml(session)
+  ensureTypewriterRaf(typewriterToken)
+}
+
+function applyPhaseContent() {
+  stopTypewriter()
+  if (!editor.value) return
+
+  if (props.editable || props.disableTypewriter || props.typewriterPhase === 'done') {
+    applyEditorHtml(buildContentHtml())
+    return
+  }
+
+  if (props.typewriterPhase === 'idle') {
+    applyEditorHtml('')
+    return
+  }
+
+  // auto / typing → 打字機
+  startTypewriterOrSetFull()
+}
+
+/** 只讀：流式打字機；可編輯 / disableTypewriter / done：直接滿內容 */
+function startTypewriterOrSetFull() {
+  stopTypewriter()
+  if (!editor.value) return
+
+  if (props.editable || props.disableTypewriter || props.typewriterPhase === 'done') {
+    applyEditorHtml(buildContentHtml())
+    return
+  }
+
+  if (props.typewriterPhase === 'idle') {
+    applyEditorHtml('')
+    return
+  }
+
+  const { title, intro } = getStreamTargets()
+  const hasIntro = !!intro
+  const token = ++typewriterToken
+  // 章節標題保留不動：啟動時一次顯示完整標題，只對正文做流式打印
+  const titleTyped = title.length
+  streamSession = {
+    titleTarget: title,
+    introTarget: intro,
+    titleTyped,
+    introTyped: 0,
+    lastTs: 0,
+    charCarry: 0,
+    waiting: !hasIntro,
+    startedWithContent: hasIntro,
+    sawContentGrowth: false,
+  }
+  isTypewriting.value = true
+  typewriterFollowPaused = false
+  applyStreamSessionHtml(streamSession)
+  bindTypewriterFollowGuards()
+  // 正文仍空：持續等待 props 更新；有正文則開始續打
+  if (title || hasIntro) ensureTypewriterRaf(token)
+}
+
+function isEmptyParagraphNode(node: ProseMirrorNode) {
+  if (node.type.name !== 'paragraph') return false
+  return node.content.size === 0 || !node.textContent.trim()
+}
+
+/** TipTap 解析 table 等塊級節點後常自動補尾部空 <p>，造成章節間大片空白 */
+function removeTrailingEmptyParagraphs() {
+  const ed = editor.value
+  if (!ed) return
+
+  let guard = 0
+  while (guard < 12) {
+    guard += 1
+    const { doc } = ed.state
+    if (doc.childCount <= 1) break
+    const last = doc.lastChild
+    if (!last || !isEmptyParagraphNode(last)) break
+    const from = doc.content.size - last.nodeSize
+    const to = doc.content.size
+    const ok = ed
+      .chain()
+      .command(({ tr, dispatch }: CommandProps) => {
+        if (dispatch) {
+          tr.delete(from, to)
+          dispatch(tr)
+        }
+        return true
+      })
+      .run()
+    if (!ok) break
+  }
+}
+
+function isPmDocNode(value: unknown): value is ProseMirrorNode {
+  return (
+    !!value &&
+    typeof value === 'object' &&
+    'type' in value &&
+    'content' in value &&
+    'nodeSize' in value
+  )
+}
+
+function applyEditorHtmlDiff(ed: Editor, html: string) {
+  const parsed = createNodeFromContent(html, ed.schema, { slice: false })
+  if (!isPmDocNode(parsed)) {
+    ed.commands.setContent(html, { emitUpdate: false })
+    return
+  }
+
+  ed.chain()
+    .command(({ tr, dispatch }: CommandProps) => {
+      if (!dispatch) return true
+      const oldDoc = tr.doc
+      const start = oldDoc.content.findDiffStart(parsed.content)
+      if (start == null) return true
+      const diffEnd = oldDoc.content.findDiffEnd(parsed.content)
+      let endA = oldDoc.content.size
+      let endB = parsed.content.size
+      if (diffEnd) {
+        endA = diffEnd.a
+        endB = diffEnd.b
+        const overlap = start - Math.min(endA, endB)
+        if (overlap > 0) {
+          endA += overlap
+          endB += overlap
+        }
+      }
+      try {
+        tr.replace(start, endA, parsed.slice(start, endB))
+      } catch {
+        tr.replaceWith(0, oldDoc.content.size, parsed.content)
+      }
+      tr.setMeta('preventUpdate', true)
+      tr.setMeta('addToHistory', false)
+      dispatch(tr)
+      return true
+    })
+    .run()
+}
+
+let lastAppliedEditorHtml = ''
+
+function applyEditorHtml(html: string) {
+  const ed = editor.value
+  if (!ed) return
+
+  const trimmed = html.trim()
+  if (trimmed === lastAppliedEditorHtml) return
+  lastAppliedEditorHtml = trimmed
+
+  const root = editorRootRef.value
+  const scrollParent = root ? findTypewriterScrollParent(root) : null
+  const prevTop = scrollParent?.scrollTop ?? 0
+  const shouldPinBottom =
+    pinBottomAfterNextApply || (isTypewriting.value && !typewriterFollowPaused)
+
+  if (!trimmed) {
+    ed.commands.clearContent(true)
+    return
+  }
+
+  applyEditorHtmlDiff(ed, trimmed)
+  removeTrailingEmptyParagraphs()
+  if (!scrollParent) return
+  // 打字中 / 打完灌全文：釘底；其餘保持原滾動位置
+  if (shouldPinBottom) {
+    pinTypewriterScrollToBottom({
+      smooth: isTypewriting.value && !pinBottomAfterNextApply,
+      force: pinBottomAfterNextApply || !isTypewriting.value,
+    })
+    return
+  }
+  scrollParent.scrollTop = prevTop
+}
+
+/**
+ * 斜體：瀏覽器對中文幾乎不做 italic/oblique 合成（即使 font-synthesis:style）。
+ * 用 inline-block + skew 強制可見，樣式寫進 DOM 避免 scoped CSS 未命中。
+ */
+const ReportItalic = ItalicExtension.extend({
+  renderHTML({ HTMLAttributes }) {
+    return [
+      'em',
+      mergeAttributes(HTMLAttributes, {
+        class: 'report-tiptap-italic',
+        style: 'font-style:italic;font-synthesis:style;color:inherit',
+      }),
+      0,
+    ]
+  },
+  parseHTML() {
+    return [
+      { tag: 'span.report-tiptap-italic' },
+      { tag: 'em.report-tiptap-italic' },
+      { tag: 'em' },
+      { tag: 'i' },
+      { style: 'font-style=italic' },
+      { style: 'font-style=oblique' },
+    ]
+  },
+})
+
+const editor = useEditor({
+  editable: false,
+  extensions: [
+    StarterKit.configure({
+      italic: false,
+      heading: { levels: [1, 2, 3, 4, 5, 6] },
+      blockquote: {
+        HTMLAttributes: {
+          class: 'report-tiptap-remark',
+        },
+      },
+    }),
+    ReportItalic,
+    Underline,
+    CitationNode,
+    LinkExtension.configure({
+      openOnClick: false,
+      autolink: true,
+      HTMLAttributes: {
+        class: 'report-tiptap-link',
+        target: '_blank',
+        rel: 'noopener noreferrer',
+      },
+    }),
+    ResizableReportImage.configure({
+      allowBase64: true,
+      HTMLAttributes: { class: 'report-tiptap-image' },
+      resize: {
+        enabled: false,
+        alwaysPreserveAspectRatio: true,
+        minWidth: 48,
+        minHeight: 48,
+      },
+    }),
+    TableKit.configure({
+      table: { resizable: true },
+    }),
+    StructureBlock,
+  ],
+  content: '',
+  editorProps: {
+    attributes: {
+      class: 'report-tiptap-editor__prose',
+    },
+    handleTextInput: () => true,
+    handlePaste: () => true,
+    handleDrop: () => true,
+  },
+  onCreate: () => {
+    // 等 useEditor 把實例寫入 ref 後再啟動（避免 onCreate 同步觸發時 editor 仍為 null）
+    nextTick(() => applyPhaseContent())
+  },
+})
+
+watch(
+  () => props.editable,
+  () => {
+    editor.value?.setEditable(false)
+  }
+)
+
+/** 僅更新已渲染標題文字（拖拽改序號時用，避免重跑打字機） */
+function patchChapterTitleOnly(title: string) {
+  const ed = editor.value
+  if (!ed || ed.isEmpty) return false
+  const { doc } = ed.state
+  let headingPos = -1
+  doc.descendants((node: ProseMirrorNode, pos: number) => {
+    if (headingPos >= 0) return false
+    if (node.type.name === 'heading') {
+      headingPos = pos
+      return false
+    }
+    return true
+  })
+  if (headingPos < 0) return false
+  const heading = doc.nodeAt(headingPos)
+  if (!heading) return false
+  const from = headingPos + 1
+  const to = headingPos + heading.nodeSize - 1
+  ed.chain()
+    .command(({ tr, dispatch }: CommandProps) => {
+      if (dispatch) {
+        tr.insertText(title || '', from, to)
+        dispatch(tr)
+      }
+      return true
+    })
+    .run()
+  return true
+}
+
+watch(
+  () => props.typewriterPhase,
+  (phase, prev) => {
+    if (phase === prev) return
+    // done：typing 剛打完時內容已是滿文，勿重設以免高度抖動、滾動丟到底
+    if (phase === 'done') {
+      stopTypewriter()
+      if (prev === 'typing') return
+      applyEditorHtml(buildContentHtml())
+      return
+    }
+    if (phase === 'idle') {
+      stopTypewriter()
+      applyEditorHtml('')
+      return
+    }
+    if (phase === 'typing' || phase === 'auto') {
+      startTypewriterOrSetFull()
+    }
+  }
+)
+
+watch(
+  () => props.reviewMarkers,
+  () => {
+    syncMarkerSourceFiles()
+  },
+  { deep: true }
+)
+
+watch(
+  () =>
+    [
+      props.contentIdentity,
+      props.chapterTitle,
+      props.chapterIntro,
+      props.showReviewMarkers,
+      props.disableTypewriter,
+    ] as const,
+  (next, prev) => {
+    if (props.typewriterPhase === 'done') {
+      if (!editor.value) return
+      if (!isTypewriting.value) applyEditorHtml(buildContentHtml())
+      return
+    }
+    if (props.typewriterPhase === 'idle') {
+      applyEditorHtml('')
+      return
+    }
+    if (props.showReviewMarkers) syncMarkerSourceFiles()
+
+    // 進入編輯 / 關閉打字機：立刻滿文，不走續打
+    if (props.disableTypewriter || props.editable) {
+      startTypewriterOrSetFull()
+      return
+    }
+
+    // contentIdentity 變化：整章重啟
+    if (prev && (next[0] || prev[0]) && next[0] !== prev[0]) {
+      startTypewriterOrSetFull()
+      return
+    }
+
+    // 進行中：title/intro 斷續更新 → 合併緩衝續打（不整段重來）
+    if (isTypewriting.value && streamSession) {
+      if (prev && next[1] === prev[1] && next[2] === prev[2] && next[4] === prev[4]) return
+      onStreamContentUpdated()
+      return
+    }
+
+    startTypewriterOrSetFull()
+  }
+)
+
+watch(
+  () => props.chapterTitle,
+  (title) => {
+    // 有 contentIdentity 時，序號變化只改標題，正文與打字機進度保持不變
+    if (!props.contentIdentity) return
+    if (isTypewriting.value) return
+    if (props.disableTypewriter) return
+    if (props.typewriterPhase === 'idle') return
+    patchChapterTitleOnly(title || '')
+  }
+)
+</script>
+
+<style scoped>
+.report-tiptap-editor {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  height: auto;
+  background: #fff;
+  /* App 全域 font-synthesis:none + 僅有 Regular Noto 時，需在編輯器內恢復合成，否則粗體/斜體無視覺效果 */
+  font-synthesis: weight style;
+}
+
+/* DeepSeek 風格流式光標：細豎線、不掛在 TipTap 尾部空 p 上（空 p 矩形為 0 會把跟滾拽回頂） */
+.report-tiptap-editor.is-typing
+  :deep(
+    .ProseMirror > *:last-child:not(p:empty):not(p:has(> br.ProseMirror-trailingBreak:only-child))
+  )::after {
+  content: '';
+  display: inline-block;
+  width: 2px;
+  height: 1.05em;
+  margin-left: 2px;
+  background: currentColor;
+  opacity: 0.65;
+  vertical-align: -0.12em;
+  border-radius: 1px;
+  animation: none;
+}
+
+/* tip 為段末時關掉塊級光標，避免豎線貼進圓點成「2|」 */
+.report-tiptap-editor.is-typing
+  :deep(.ProseMirror > *:last-child:has(> .report-tiptap-citation:last-child))::after,
+.report-tiptap-editor.is-typing
+  :deep(
+    .ProseMirror
+      > *:last-child:has(> .report-tiptap-citation:nth-last-child(2) + br.ProseMirror-trailingBreak)
+  )::after,
+.report-tiptap-editor.is-typing
+  :deep(
+    .ProseMirror
+      > *:last-child:has(> .report-tiptap-citation:nth-last-child(2) + img.ProseMirror-separator)
+  )::after {
+  content: none !important;
+  display: none !important;
+}
+
+/* tip 自身永不掛 ::before/::after 光標 */
+.report-tiptap-editor.is-typing :deep(.report-tiptap-citation::before),
+.report-tiptap-editor.is-typing :deep(.report-tiptap-citation::after) {
+  content: none !important;
+  display: none !important;
+  width: 0 !important;
+  height: 0 !important;
+  margin: 0 !important;
+  background: none !important;
+  border: none !important;
+}
+
+.report-tiptap-editor.is-typing :deep(.ProseMirror > *:nth-last-child(2):has(+ p:empty))::after,
+.report-tiptap-editor.is-typing
+  :deep(
+    .ProseMirror > *:nth-last-child(2):has(+ p:has(> br.ProseMirror-trailingBreak:only-child))
+  )::after {
+  content: '';
+  display: inline-block;
+  width: 2px;
+  height: 1.05em;
+  margin-left: 2px;
+  background: currentColor;
+  opacity: 0.65;
+  vertical-align: -0.12em;
+  border-radius: 1px;
+  animation: none;
+}
+
+.report-tiptap-editor.is-typing :deep(.ProseMirror > table:last-child)::after,
+.report-tiptap-editor.is-typing :deep(.ProseMirror > table:nth-last-child(2):has(+ p:empty))::after,
+.report-tiptap-editor.is-typing
+  :deep(
+    .ProseMirror > table:nth-last-child(2):has(+ p:has(> br.ProseMirror-trailingBreak:only-child))
+  )::after {
+  content: none;
+}
+
+.report-tiptap-editor__toolbar {
+  --report-tiptap-toolbar-fg: oklch(0.145 0 0);
+  /* 暫時隱藏工具欄；恢復時改回 display: flex */
+  display: none;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: 0;
+  flex-shrink: 0;
+  min-height: 40px;
+  padding: 4px 8px;
+  border-bottom: 1px solid #e5e7eb;
+  background: #fff;
+  overflow-x: auto;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-size: 14px;
+  color: var(--report-tiptap-toolbar-fg);
+}
+
+.report-tiptap-editor__group {
+  display: inline-flex;
+  align-items: center;
+  gap: 0;
+  flex-shrink: 0;
+}
+
+.report-tiptap-editor__tool {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 2px;
+  box-sizing: border-box;
+  min-width: 32px;
+  height: 32px;
+  padding: 0 6px;
+  border: none;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--report-tiptap-toolbar-fg);
+  font-family: inherit;
+  font-size: 14px;
+  line-height: 1;
+  cursor: pointer;
+  transition:
+    background 0.15s ease,
+    color 0.15s ease;
+}
+
+.report-tiptap-editor__tool :deep(svg) {
+  display: block;
+  flex-shrink: 0;
+  color: inherit;
+  stroke: currentColor;
+}
+
+.report-tiptap-editor__tool:hover:not(:disabled) {
+  background: #f3f4f6;
+  color: var(--report-tiptap-toolbar-fg);
+}
+
+.report-tiptap-editor__tool.is-active {
+  background: #f3f4f6;
+  color: var(--report-tiptap-toolbar-fg);
+}
+
+.report-tiptap-editor__tool:disabled {
+  opacity: 0.35;
+  cursor: not-allowed;
+}
+
+.report-tiptap-editor__divider {
+  width: 1px;
+  height: 16px;
+  margin: 0 8px;
+  background: #e5e7eb;
+  flex-shrink: 0;
+}
+
+.report-tiptap-editor__body {
+  flex: 1 0 auto;
+  min-height: 0;
+  overflow: visible;
+}
+
+.report-tiptap-editor__content {
+  min-height: 0;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose) {
+  outline: none;
+  min-height: 360px;
+  height: auto;
+  color: #374151;
+  font-size: 14px;
+  line-height: 1.75;
+  font-synthesis: weight style;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h1),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h2),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h3),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h4),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h5),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h6) {
+  color: #1a1a1a;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-weight: 700;
+  line-height: 1.35;
+  font-synthesis: weight;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h1) {
+  margin: 0 0 32px;
+  color: #111827;
+  font-size: 36px;
+  line-height: 1.11;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h2) {
+  margin: 24px 0 !important;
+  color: #111827;
+  font-size: 24px;
+  line-height: 1.33;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h3) {
+  margin: 32px 0 12px;
+  color: #111827;
+  font-size: 20px;
+  line-height: 1.6;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h4) {
+  margin: 24px 0 10px;
+  font-size: 18px;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h5),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h6) {
+  margin: 20px 0 8px;
+  font-size: 16px;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose hr) {
+  margin: 24px 0;
+  border: none;
+  border-top: 1px solid #e5e7eb;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose pre) {
+  margin: 16px 0;
+  padding: 12px 14px;
+  overflow-x: auto;
+  border-radius: 6px;
+  background: #f3f4f6;
+  font-size: 13px;
+  line-height: 1.5;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose code) {
+  padding: 0.1em 0.35em;
+  border-radius: 4px;
+  background: #f3f4f6;
+  font-size: 0.9em;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose pre code) {
+  padding: 0;
+  background: transparent;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose s),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose del) {
+  text-decoration: line-through;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose p) {
+  margin: 20px 0;
+  color: #374151;
+  font-size: 16px;
+  font-weight: 400;
+  word-spacing: normal;
+  letter-spacing: normal;
+  overflow-wrap: break-word;
+  word-break: normal;
+}
+
+/* 隱藏 TipTap 尾部空段落（含僅 trailingBreak 的空 p），避免章節結尾大片空白 */
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose > p:empty),
+.report-tiptap-editor__content
+  :deep(.report-tiptap-editor__prose > p:has(> br.ProseMirror-trailingBreak:only-child)) {
+  display: none !important;
+  margin: 0 !important;
+  padding: 0 !important;
+  height: 0 !important;
+  min-height: 0 !important;
+  overflow: hidden !important;
+  border: 0 !important;
+}
+
+/* 章節實際最後一個可見塊不再額外撐底邊距 */
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose > *:last-child) {
+  margin-bottom: 0;
+}
+
+/* 粗體 / 斜體：強制可見；顏色必須繼承正文，勿用 text-stroke（會變深） */
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose strong),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose b) {
+  color: inherit !important;
+  font-weight: 700 !important;
+  font-synthesis: weight !important;
+  -webkit-text-stroke: 0;
+}
+
+/*
+ * （中文合成斜體可能偏弱，但不再破壞詞間空格）
+ */
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose em),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose i),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose .report-tiptap-italic) {
+  color: inherit !important;
+  font-style: italic !important;
+  font-synthesis: style !important;
+  display: inline !important;
+  transform: none !important;
+  -webkit-transform: none !important;
+  max-width: none;
+  margin-inline: 0;
+  vertical-align: baseline;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose ::selection),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose *::selection) {
+  background: #b6002a;
+  color: #fff;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose ::-moz-selection),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose *::-moz-selection) {
+  background: #b6002a;
+  color: #fff;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-remark) {
+  margin: 0 0 14px;
+  padding: 0;
+  border: none;
+  color: #374151;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-size: 12.8px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1.4;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h2.ProseMirror-selectednode),
+.report-tiptap-editor__content :deep(.report-tiptap-editor__prose h3.ProseMirror-selectednode) {
+  background: #fdecef;
+  color: #c53355;
+  border-radius: 4px;
+  outline: none;
+  box-shadow: 0 0 0 4px #fdecef;
+}
+
+.report-tiptap-editor__content :deep(.report-structure-block.ProseMirror-selectednode) {
+  outline: none;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-source) {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin: 0 0 18px;
+  color: #909399;
+  font-size: 13px;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-source__icon) {
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  border: 1.5px solid #c0c4cc;
+  border-radius: 2px;
+  background:
+    linear-gradient(135deg, transparent 40%, #c0c4cc 40%, #c0c4cc 55%, transparent 55%),
+    linear-gradient(#c0c4cc, #c0c4cc) 3px 4px / 8px 1.5px no-repeat,
+    linear-gradient(#c0c4cc, #c0c4cc) 3px 7px / 8px 1.5px no-repeat;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-citation) {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  margin-left: 4px;
+  margin-right: 4px;
+  border: 1px solid #d1d1d1;
+  border-radius: 50%;
+  background: #d1d1d1;
+  color: #374151;
+  font-size: 10px;
+  font-weight: 700;
+  line-height: 1;
+  vertical-align: middle;
+  cursor: pointer;
+  box-shadow: none;
+  user-select: none;
+  pointer-events: auto;
+  overflow: hidden;
+  flex-shrink: 0;
+  box-sizing: border-box;
+  position: relative;
+  z-index: 1;
+  isolation: isolate;
+  white-space: nowrap;
+}
+
+/* 移入不改變樣式、不彈出任何提示 */
+.report-tiptap-editor__content :deep(.report-tiptap-citation:hover),
+.report-tiptap-editor__content :deep(.report-tiptap-citation:focus) {
+  background: #d1d1d1;
+  color: #374151;
+  border-color: #d1d1d1;
+  outline: none;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-link) {
+  color: #409eff;
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-link:hover) {
+  color: #66b1ff;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image) {
+  display: block;
+  max-width: 100%;
+  border-radius: 4px;
+  object-fit: contain;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image-resize) {
+  position: relative;
+  display: inline-block;
+  max-width: 100%;
+  line-height: 0;
+  margin: 12px 0;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image-resize__wrap) {
+  position: relative;
+  display: block;
+  max-width: 100%;
+  line-height: 0;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image-resize [data-resize-handle]) {
+  position: absolute;
+  z-index: 10;
+  width: 8px;
+  height: 8px;
+  background: rgba(0, 0, 0, 0.55);
+  border: 1px solid rgba(255, 255, 255, 0.9);
+  border-radius: 2px;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image-resize [data-resize-handle='top-left']) {
+  top: -4px;
+  left: -4px;
+  cursor: nwse-resize;
+}
+
+.report-tiptap-editor__content :deep(.report-tiptap-image-resize [data-resize-handle='top-right']) {
+  top: -4px;
+  right: -4px;
+  cursor: nesw-resize;
+}
+
+.report-tiptap-editor__content
+  :deep(.report-tiptap-image-resize [data-resize-handle='bottom-left']) {
+  bottom: -4px;
+  left: -4px;
+  cursor: nesw-resize;
+}
+
+.report-tiptap-editor__content
+  :deep(.report-tiptap-image-resize [data-resize-handle='bottom-right']) {
+  bottom: -4px;
+  right: -4px;
+  cursor: nwse-resize;
+}
+
+.report-tiptap-editor__content
+  :deep(.report-tiptap-image-resize[data-resize-state='true'] .report-tiptap-image-resize__wrap) {
+  outline: 1px solid rgba(0, 0, 0, 0.25);
+  border-radius: 2px;
+}
+
+/*
+ * ===== 原表格樣式（備份，已註釋；對齊 el-table 前） =====
+ * 勿另建備份 .vue；回滾時取消本塊註釋，並刪下方「現行表格樣式」即可
+.report-tiptap-editor__content :deep(table) {
+  width: 100%;
+  margin: 12px 0 20px;
+  border-collapse: collapse;
+  table-layout: fixed;
+  overflow: hidden;
+  border: 1px solid #d1d1d1;
+}
+
+.report-tiptap-editor__content :deep(th),
+.report-tiptap-editor__content :deep(td) {
+  box-sizing: border-box;
+  border: 1px solid #d1d1d1;
+  padding: 4px 8px;
+  min-width: 48px;
+  font-size: 14px;
+  line-height: 1.4;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  color: #374154;
+  vertical-align: middle;
+  background: #fff;
+}
+
+.report-tiptap-editor__content :deep(th) {
+  height: 68px;
+  min-height: 68px;
+  font-weight: 400;
+  background: #fff;
+}
+
+.report-tiptap-editor__content :deep(td) {
+  min-height: 36px;
+  height: auto;
+  vertical-align: top;
+}
+ */
+
+/* ===== 現行表格樣式（本組件內）：對齊 el-table，圓角 5px、表頭底色、全文左對齊、緊湊行高 ===== */
+.report-tiptap-editor__content :deep(table) {
+  width: 100%;
+  margin: 12px 0 20px;
+  border-collapse: separate;
+  border-spacing: 0;
+  table-layout: fixed;
+  overflow: hidden;
+  border: 1px solid var(--el-table-border-color, #ebeef5);
+  border-radius: 5px;
+  background: #fff;
+}
+
+.report-tiptap-editor__content :deep(th),
+.report-tiptap-editor__content :deep(td) {
+  box-sizing: border-box;
+  border-right: 1px solid var(--el-table-border-color, #ebeef5);
+  border-bottom: 1px solid var(--el-table-border-color, #ebeef5);
+  padding: 2px 12px;
+  min-width: 48px;
+  min-height: 16px;
+  font-size: 14px;
+  line-height: 1.3;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-weight: 400;
+  color: var(--el-table-text-color, #606266);
+  text-align: left !important;
+  vertical-align: middle;
+  background: #fff;
+  white-space: normal;
+  word-break: break-word;
+  overflow-wrap: anywhere;
+}
+
+.report-tiptap-editor__content :deep(th:last-child),
+.report-tiptap-editor__content :deep(td:last-child) {
+  border-right: none;
+}
+
+.report-tiptap-editor__content :deep(tr:last-child > th),
+.report-tiptap-editor__content :deep(tr:last-child > td) {
+  border-bottom: none;
+}
+
+.report-tiptap-editor__content :deep(th) {
+  height: auto;
+  color: var(--el-table-header-text-color, #909399);
+  background-color: var(--el-table-header-bg-color, #f5f7fa);
+}
+
+.report-tiptap-editor__content :deep(td) {
+  height: auto;
+  vertical-align: middle;
+}
+
+/* 表格內段落：上下 15px；允許換行 */
+.report-tiptap-editor__content :deep(th p),
+.report-tiptap-editor__content :deep(td p) {
+  margin: 15px 0;
+  font-size: inherit;
+  line-height: inherit;
+  color: inherit;
+  font-weight: inherit;
+  text-align: left !important;
+  white-space: normal;
+  word-break: break-word;
+  overflow-wrap: anywhere;
+}
+
+.report-tiptap-editor__content :deep(.selectedCell::after) {
+  background: rgb(197 51 85 / 12%);
+}
+
+.report-tiptap-editor__content :deep(ul),
+.report-tiptap-editor__content :deep(ol) {
+  margin: 0 0 14px;
+  padding-left: 1.4em;
+}
+
+.report-tiptap-editor__content :deep(ol) {
+  list-style-type: decimal;
+}
+
+.report-tiptap-editor__content :deep(ul) {
+  list-style-type: disc;
+}
+
+.report-tiptap-editor__content :deep(li) {
+  color: #374151;
+}
+
+.report-tiptap-editor__content :deep(li::marker) {
+  color: #999 !important;
+  font-size: 16px !important;
+  font-weight: 500 !important;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+}
+
+.report-tiptap-editor__content :deep(li > p) {
+  margin: 0 0 2px;
+  font-size: inherit;
+  color: inherit;
+}
+
+.report-tiptap-editor.is-readonly :deep(.report-tiptap-editor__prose) {
+  cursor: default;
+  caret-color: transparent;
+}
+
+.report-tiptap-editor.is-readonly :deep(.ProseMirror) {
+  caret-color: transparent;
+}
+
+.report-tiptap-editor.is-readonly :deep(.report-tiptap-image-resize [data-resize-handle]) {
+  display: none !important;
+  pointer-events: none !important;
+}
+</style>
+
+<style>
+/* //0917 tip popup 樣式：四邊 14px、>18 行灰膠囊滾動條（貼正文不蓋文件名） */
+.report-chapter-review-popover {
+  position: relative;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  /* //0917 上右下左永遠 14px，限高時也靠 border-box 把 padding 算進 maxHeight，不被裁掉 */
+  padding: 14px;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  background: #fff;
+  color: #374151;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-size: 14px;
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+  user-select: none;
+  -webkit-user-select: none;
+  overflow: hidden;
+  caret-color: transparent;
+}
+
+/* //0917 杜絕打字光標 ::after 或殘留「|」出現在 tip 正文末尾 */
+.report-chapter-review-popover::before,
+.report-chapter-review-popover::after,
+.report-chapter-review-popover .review-marker-popover__content::before,
+.report-chapter-review-popover .review-marker-popover__content::after {
+  content: none !important;
+  display: none !important;
+}
+
+.review-marker-popover {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-width: 0;
+  min-height: 0;
+  overflow: visible; /* //0917 軌道伸进右側 padding */
+}
+
+.review-marker-popover__meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin: 0 0 10px;
+  padding: 0;
+  min-width: 0;
+  flex-shrink: 0;
+}
+
+.review-marker-popover__id {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  flex-shrink: 0;
+  border-radius: 50%;
+  background: #c53355;
+  color: #fff;
+  font-size: 11px;
+  font-weight: 700;
+}
+
+.review-marker-popover__source-name {
+  flex: 1;
+  min-width: 0;
+  padding: 0;
+  border: none;
+  background: none;
+  text-align: left;
+  font-family: inherit;
+  font-size: 14px;
+  font-weight: 600;
+  line-height: 1.4;
+  color: #409eff;
+  text-decoration: none;
+  cursor: pointer;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.review-marker-popover__source-name:hover {
+  text-decoration: underline;
+}
+
+.review-marker-popover__author {
+  font-size: 14px;
+  font-weight: 600;
+  color: #374151;
+}
+
+.review-marker-popover__body {
+  position: relative;
+  display: block;
+  flex: 0 0 auto;
+  width: 100%;
+  min-width: 0;
+  min-height: 0;
+  /* //0917 visible：軌道伸进右側 padding；裁切靠外層 popover overflow:hidden */
+  overflow: visible;
+}
+
+.review-marker-popover__scroll {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  min-height: 0;
+  max-height: 403.2px; /* //0917 14 * 1.6 * 18 */
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 0;
+  margin: 0;
+  box-sizing: border-box;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  overscroll-behavior: contain;
+  touch-action: pan-y;
+  -webkit-overflow-scrolling: touch;
+}
+
+.review-marker-popover__scroll::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  display: none;
+}
+
+/*
+ * //0917 掛在 body：top/bottom 貼正文，不蓋文件名。
+ * right:-10px 落入 popover 右側 14px 邊距（距邊框約 4px）。
+ * 與中欄主滾動條同款：opacity + #999 !important。
+ */
+.review-marker-popover__thumb-track {
+  position: absolute !important;
+  top: 0 !important;
+  bottom: 0 !important;
+  right: -10px !important;
+  width: 8px !important;
+  z-index: 20 !important;
+  overflow: hidden !important;
+  box-sizing: border-box !important;
+  opacity: 0;
+  pointer-events: none;
+  cursor: pointer;
+  transition: opacity 0.12s ease;
+}
+
+.review-marker-popover__thumb-track.is-visible {
+  opacity: 1 !important;
+  pointer-events: auto !important;
+}
+
+.review-marker-popover__thumb {
+  position: absolute !important;
+  top: 0 !important;
+  left: 0 !important;
+  width: 8px !important;
+  min-height: 50px !important;
+  max-height: 100% !important;
+  border-radius: 9999px !important;
+  background-color: #999 !important;
+  cursor: grab !important;
+  pointer-events: auto !important;
+  box-sizing: border-box !important;
+  will-change: transform;
+}
+
+.review-marker-popover__thumb:active {
+  cursor: grabbing;
+  background-color: #777 !important;
+}
+
+.review-marker-popover__thumb:hover {
+  background-color: #777 !important;
+}
+
+.review-marker-popover__content {
+  margin: 0;
+  padding: 0;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+  font-size: 14px;
+  line-height: 1.6;
+  color: #374151;
+  user-select: none;
+  -webkit-user-select: none;
+  caret-color: transparent;
+  white-space: normal;
+  word-break: break-word;
+  overflow-wrap: anywhere;
+}
+
+.review-marker-popover__preview-link {
+  display: inline;
+  padding: 0;
+  border: none;
+  background: none;
+  text-align: left;
+  font-family: inherit;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #409eff;
+  text-decoration: underline;
+  cursor: pointer;
+  word-break: break-all;
+}
+
+.review-marker-popover__preview-link:hover {
+  color: #66b1ff;
+}
+</style>
+
+<!-- 非 scoped：確保斜體 skew、列表標記色一定打到 ProseMirror -->
+<style>
+.report-tiptap-editor .ProseMirror strong,
+.report-tiptap-editor .ProseMirror b,
+.report-tiptap-editor .ProseMirror em,
+.report-tiptap-editor .ProseMirror i,
+.report-tiptap-editor .report-tiptap-italic,
+.report-tiptap-editor em.report-tiptap-italic,
+.report-tiptap-editor span.report-tiptap-italic {
+  color: inherit !important;
+}
+
+.report-tiptap-editor .ProseMirror em,
+.report-tiptap-editor .ProseMirror i,
+.report-tiptap-editor .report-tiptap-italic,
+.report-tiptap-editor em.report-tiptap-italic,
+.report-tiptap-editor span.report-tiptap-italic {
+  font-style: italic !important;
+  font-synthesis: style !important;
+  display: inline !important;
+  transform: none !important;
+  -webkit-transform: none !important;
+  max-width: none;
+  margin-inline: 0;
+  vertical-align: baseline;
+}
+
+.report-tiptap-editor .ProseMirror h2 {
+  margin: 24px 0 !important;
+}
+
+.report-tiptap-editor .ProseMirror ul,
+.report-tiptap-editor .ProseMirror ol {
+  margin: 0 0 14px;
+  padding-left: 1.4em;
+}
+
+.report-tiptap-editor .ProseMirror ol {
+  list-style-type: decimal;
+}
+
+.report-tiptap-editor .ProseMirror ul {
+  list-style-type: disc;
+}
+
+.report-tiptap-editor .ProseMirror li::marker {
+  color: #999 !important;
+  font-size: 16px !important;
+  font-weight: 500 !important;
+  font-family: var(--gen-ai-font-family, 'Noto Sans', 'Noto Sans TC', sans-serif);
+}
+
+.report-tiptap-editor .ProseMirror li > p {
+  margin: 0 0 2px;
+}
+
+.report-tiptap-editor .ProseMirror .report-tiptap-citation,
+.report-tiptap-editor .report-tiptap-citation {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  margin-left: 4px;
+  margin-right: 4px;
+  border: 1px solid #d1d1d1;
+  border-radius: 50%;
+  background: #d1d1d1;
+  color: #374151;
+  font-size: 10px;
+  font-weight: 700;
+  line-height: 1;
+  vertical-align: middle;
+  cursor: pointer;
+  box-shadow: none;
+  user-select: none;
+  pointer-events: auto;
+  overflow: hidden;
+  flex-shrink: 0;
+  box-sizing: border-box;
+  position: relative;
+  z-index: 1;
+  isolation: isolate;
+  white-space: nowrap;
+}
+
+.report-tiptap-editor .ProseMirror .report-tiptap-citation:hover,
+.report-tiptap-editor .ProseMirror .report-tiptap-citation:focus,
+.report-tiptap-editor .report-tiptap-citation:hover,
+.report-tiptap-editor .report-tiptap-citation:focus {
+  background: #d1d1d1;
+  color: #374151;
+  border-color: #d1d1d1;
+  outline: none;
+}
+
+.report-tiptap-editor .ProseMirror a.report-tiptap-link,
+.report-tiptap-editor a.report-tiptap-link {
+  color: #409eff;
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.report-tiptap-editor .ProseMirror a.report-tiptap-link:hover,
+.report-tiptap-editor a.report-tiptap-link:hover {
+  color: #66b1ff;
+}
+</style>