diff --git a/.dockerignore b/.dockerignore
index 92b44c3c..794fd90b 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -12,3 +12,10 @@ node_modules
 .data
 *.md
 docs
+
+# Local verification artifacts and credentials
+tmp
+.playwright-mcp
+.dev.vars
+.dev.vars.*
+logs
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index b1c8f005..e7d57122 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -30,6 +30,9 @@ jobs:
       - name: Install dependencies
         run: pnpm install --frozen-lockfile
 
+      - name: Markdown editor compatibility tests
+        run: pnpm editor:test
+
       - name: Test widget framing policy
         run: node --import tsx --test tests/widget-framing.test.ts
 
diff --git a/AGENTS.md b/AGENTS.md
index 2b1baa5c..d21124d4 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -44,7 +44,7 @@ pnpm dlx shadcn-vue@latest add <component>  # Add shadcn-vue component (run pnpm
 - `components/ui/` — shadcn-vue base components (no prefix, `pathPrefix: false`)
 - `composables/` — `useApiFetch` (request wrapper), `useAuth` (auth state), `usePermission` (permissions)
 - `stores/` — Pinia stores: `board`, `postDetail`
-- `lib/md-editor-helper.ts` — Workaround for md-editor-v3 nested in shadcn Dialog (prevents internal popups from closing the outer Dialog); read this first when hitting similar issues
+- `components/TiptapMarkdownEditor.client.vue` — visual Markdown editing; `MarkdownEditorShell.vue` owns the toolbar and CodeMirror source surface; `lib/markdown-render.ts` renders sanitized public content
 
 ### Backend (`server/`)
 
diff --git a/README.md b/README.md
index 26b7ef83..84fe6d70 100644
--- a/README.md
+++ b/README.md
@@ -182,7 +182,7 @@ overrides, and authentication toggles.
 | Blob storage | Cloudflare R2 binding, Vercel Blob, or S3-compatible via `aws4fetch` (AWS, MinIO, OSS) |
 | State | Pinia |
 | UI | Tailwind CSS v4, shadcn-vue (new-york), Lucide icons |
-| Editor | md-editor-v3 |
+| Editor | Tiptap 3 (visual) + CodeMirror 6 (Markdown source) |
 | Deploy targets | Cloudflare Workers, Vercel, Node.js Docker |
 | Package manager | pnpm |
 
diff --git a/app/assets/css/markdown-content.css b/app/assets/css/markdown-content.css
new file mode 100644
index 00000000..107c24e4
--- /dev/null
+++ b/app/assets/css/markdown-content.css
@@ -0,0 +1,61 @@
+/* Shared document typography for Tiptap and the read-only Markdown renderer. */
+.md-editor-preview {
+  --md-theme-code-block-bg-color: var(--muted);
+  --md-theme-code-block-color: var(--foreground);
+  --md-theme-code-block-radius: 6px;
+  color: var(--foreground); font: 14px/1.7 var(--font-body, system-ui, sans-serif); word-break: normal; overflow-wrap: anywhere;
+}
+.md-editor-preview :is(p, ul, ol, blockquote, pre, table, figure) { margin-block: .75em; }
+.md-editor-preview > :first-child { margin-top: 0; }
+.md-editor-preview > :last-child { margin-bottom: 0; }
+.md-editor-preview :is(h1,h2,h3,h4,h5,h6) { margin: 1.25em 0 .5em; font-weight: 650; line-height: 1.35; }
+.md-editor-preview h1 { font-size: 2em; }.md-editor-preview h2 { font-size: 1.5em; }.md-editor-preview h3 { font-size: 1.25em; }
+.md-editor-preview ul { list-style: disc; padding-left: 1.5em; }.md-editor-preview ol { list-style: decimal; padding-left: 1.5em; }
+.md-editor-preview li > p { margin-block: .25em; }
+.md-editor-preview a { color: var(--primary); text-decoration: underline; }
+.md-editor-preview blockquote { border-left: 3px solid var(--border); padding-left: 1em; color: var(--muted-foreground); }
+.md-editor-preview img { max-width: 100%; height: auto; }
+.md-editor-preview table { border-collapse: collapse; max-width: 100%; width: 100%; }
+.md-editor-preview :is(th,td) { border: 1px solid var(--border); padding: 6px 10px; text-align: start; }
+.md-editor-preview th { background: var(--muted); font-weight: 600; }
+.md-editor-preview pre { overflow: auto; background: var(--muted); border-radius: 6px; padding: 14px 16px; }
+.md-editor-preview pre code { color: var(--foreground); background: transparent; padding: 0; white-space: pre; }
+.md-editor-preview code { font-family: ui-monospace, monospace; font-size: .9em; background: color-mix(in srgb, var(--accent) 14%, var(--background)); color: #d16c42; border-radius: 3px; padding: .12em .3em; }
+.md-editor-preview hr { border: 0; border-top: 1px solid var(--border); margin: 1.25em 0; }
+/* One code-block skin for editing, editor preview and public articles. */
+.md-editor-preview .fdl-code-view {
+  --fdl-code-background: #282c34;
+  --fdl-code-color: #abb2bf;
+  margin: .75em 0;
+  border: 1px solid #3b414d;
+  border-radius: 6px;
+  overflow: hidden;
+  color: var(--fdl-code-color);
+  background: var(--fdl-code-background);
+  font: 14px/1.8 source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
+}
+.md-editor-preview .fdl-code-view .md-editor-code-head { position: relative; z-index: auto; display: flex; align-items: center; justify-content: space-between; min-height: 36px; background: var(--fdl-code-background); color: var(--fdl-code-color); }
+.md-editor-preview .fdl-code-view .md-editor-code-flag { display: flex; gap: 5px; padding-left: 14px; }
+.md-editor-preview .fdl-code-view .md-editor-code-flag span { display: block; width: 12px; height: 12px; border-radius: 50%; background: #ff5f57; }
+.md-editor-preview .fdl-code-view .md-editor-code-flag span:nth-child(2) { background: #febc2e; }
+.md-editor-preview .fdl-code-view .md-editor-code-flag span:nth-child(3) { background: #28c840; }
+.md-editor-preview .fdl-code-view .fdl-code-actions { display: flex; align-items: center; gap: 12px; padding: 0 14px; font: 14px/1.5 var(--font-body, system-ui, sans-serif); }
+.md-editor-preview .fdl-code-view .fdl-code-body { display: flex; overflow-x: auto; background: var(--fdl-code-background); }
+.md-editor-preview .fdl-code-view .fdl-code-lines { flex: none; padding: 14px 0 14px 20px; min-width: 36px; text-align: right; white-space: pre; color: var(--fdl-code-color); opacity: .65; user-select: none; font: inherit; }
+.md-editor-preview .fdl-code-view pre { flex: 1; margin: 0; padding: 14px 16px; min-height: 50px; overflow: visible; border: 0; border-radius: 0; white-space: pre; font: inherit; background: var(--fdl-code-background); }
+.md-editor-preview .fdl-code-view pre code { display: inline; padding: 0; white-space: pre; overflow: visible; font: inherit; background: transparent; color: var(--fdl-code-color); border-radius: 0; }
+.md-editor-preview .fdl-code-view .fdl-code-collapse { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: 1px solid currentColor; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
+.md-editor-preview .fdl-code-view .fdl-code-chevron { width: 5px; height: 5px; border: solid currentColor; border-width: 0 1px 1px 0; transform: translateY(-1px) rotate(45deg); }
+.md-editor-preview .fdl-code-view .fdl-code-collapse:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
+.md-editor-preview .fdl-code-collapsed .fdl-code-body { display: none; }
+.md-editor-preview .fdl-code-collapsed .fdl-code-collapse { transform: rotate(-90deg); }
+
+/* Historical content containers share the document typography. */
+.md-editor-preview .fdl-legacy-container { margin: 12px 0; padding: 12px 16px; border-left: 3px solid var(--border); border-radius: 4px; background: var(--muted); }
+.md-editor-preview .fdl-container-title { font-weight: 600; margin-bottom: 8px; }
+.md-editor-preview .fdl-container-title:empty { margin: 0; }
+
+.md-editor-preview .fdl-code-view .fdl-code-copy { border: 0; padding: 2px 0; background: transparent; color: inherit; font: inherit; white-space: nowrap; cursor: pointer; }
+.md-editor-preview .fdl-code-view .fdl-code-copy:hover { color: #fff; }
+.md-editor-preview .fdl-code-view .fdl-code-copy:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 2px; }
+.md-editor-preview .fdl-code-view .fdl-code-copy[aria-busy='true'] { opacity: .6; cursor: wait; }
diff --git a/app/assets/css/markdown-editor.css b/app/assets/css/markdown-editor.css
new file mode 100644
index 00000000..7e22ce2d
--- /dev/null
+++ b/app/assets/css/markdown-editor.css
@@ -0,0 +1,317 @@
+/* Editor frame, menus and editing surface. */
+:where(.md-editor.fdl-markdown-editor) { --fdl-editor-font-family: var(--font-body, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif); position: relative; display: flex; flex-direction: column; width: 100%; min-height: 100px; height: 500px; border: 1px solid var(--border); background: var(--md-bk-color, #fff); color: var(--foreground); font: 14px/1.5 var(--fdl-editor-font-family); }
+.md-editor-toolbar-wrapper { flex: none; border-bottom: 1px solid var(--border); }
+.md-editor-toolbar, .md-editor-toolbar-left, .md-editor-toolbar-right { display: flex; align-items: center; }
+.md-editor-toolbar-item { display: inline-flex; padding: 4px; border: 0; color: inherit; background: transparent; cursor: pointer; }
+.md-editor-toolbar-item:disabled { opacity: .4; cursor: default; }
+.fdl-editor-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
+.md-editor-input-wrapper { flex: 1 1 auto; min-height: 0; height: 100%; }
+.fdl-source-mount { height: 100%; min-height: 80px; }
+.fdl-rich-mount { height: 100%; min-height: 80px; }
+.fdl-preview-pane { overflow: auto; padding: 12px 20px; }
+.md-editor-footer { display: flex; align-items: center; flex: none; gap: 8px; height: 24px; padding: 0 10px; border-top: 1px solid var(--border); font-size: 12px; color: var(--muted-foreground); }
+.md-editor-footer > :last-child:not(:first-child) { margin-inline-start: auto; }
+.fdl-tool { position: relative; display: flex; }
+.fdl-tool-menu { color: var(--foreground); animation: none !important; transition: none !important; }
+.fdl-tool-menu [role="menuitem"]:is(:hover, :focus, [data-highlighted]) { background: var(--muted); color: var(--foreground); }
+.fdl-table-picker { padding: 4px; }
+.fdl-table-size { padding-bottom: 6px; text-align: center; color: var(--muted-foreground); font-size: 12px; }
+.md-editor-table-shape-row { display: flex; gap: 3px; margin-bottom: 3px; }
+.fdl-table-picker .md-editor-table-shape-col { flex: none; width: 18px; height: 18px; padding: 0; border: 1px solid var(--border); border-radius: 2px; background: var(--background); cursor: pointer; }
+.fdl-table-picker .fdl-table-cell-selected { background: var(--muted); border-color: var(--muted-foreground); }
+.fdl-table-picker .md-editor-table-shape-col:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
+.fdl-address-dialog { max-height: calc(100dvh - 32px); overflow: auto; color: var(--foreground); }
+.fdl-editor-fullscreen { position: fixed !important; inset: 12px !important; width: auto !important; height: auto !important; z-index: 40; }
+
+/* Keep the former crop dialog's header, dimensions and side-by-side preview. */
+.fdl-crop-dialog[data-slot='dialog-content'] { display: flex; flex-direction: column; width: 668px; max-width: calc(100vw - 20px); height: 421px; max-height: calc(100dvh - 20px); gap: 0; padding: 0; border-radius: 3px; outline: none; color: var(--foreground); }
+.fdl-crop-header { display: flex; align-items: center; justify-content: space-between; height: 43px; flex: none; padding: 0 14px 0 24px; border-bottom: 1px solid var(--border); cursor: grab; touch-action: none; user-select: none; }
+.fdl-crop-header [data-slot='dialog-title'] { font-size: 16px; line-height: 22px; }
+.fdl-crop-header > div { display: flex; gap: 4px; }
+.fdl-crop-content { display: flex; flex-direction: column; padding: 20px; flex: 1; min-height: 0; }
+.fdl-crop-workspace { display: flex; gap: 14px; min-height: 0; flex: 1; }
+.fdl-crop-main, .fdl-crop-preview-pane { position: relative; flex: 1; min-width: 0; height: 100%; overflow: hidden; border: 1px solid var(--border); }
+.fdl-crop-preview { width: 100%; height: 100%; overflow: hidden; }
+.fdl-crop-main > img { display: block; max-width: 100%; }
+.fdl-crop-choose { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: pointer; color: var(--muted-foreground); background: transparent; border: 0; }
+.fdl-crop-choose:focus-visible { outline: 2px solid var(--ring); outline-offset: -3px; }
+.fdl-crop-main .fdl-crop-remove { position: absolute; top: 0; right: 0; z-index: 2; border-radius: 0 0 0 4px; }
+.fdl-crop-footer { display: flex; justify-content: flex-end; gap: 8px; padding-top: 20px; flex: none; }
+.fdl-crop-dialog.fdl-crop-fullscreen { width: calc(100vw - 20px); height: calc(100dvh - 20px); }
+@media (max-width: 640px) { .fdl-crop-dialog { height: 620px !important; } .fdl-crop-workspace { flex-direction: column; } .fdl-crop-main, .fdl-crop-preview-pane { width: 100%; height: 0; min-height: 0; } }
+
+.fdl-footer-right { justify-content: flex-end; }
+
+/* Independent shell shared by the visual and source surfaces. */
+/* Keep CodeMirror's viewport measurement and scroll anchoring away from Tiptap. */
+.fdl-structured-shell .fdl-rich-mount { height: 100%; }
+.fdl-rich-scroll { position: relative; height: 100%; overflow: auto; scrollbar-width: thin; scroll-padding-block: 24px; }
+.fdl-editor-mount { display: flex; flex-direction: column; flex: 1 0 auto; min-height: 100%; font-family: var(--fdl-editor-font-family); }
+.fdl-editor-mount > .fdl-editor-content { flex: 1 0 auto; }
+.fdl-editor-content { min-height: 100%; outline: none; overflow-wrap: anywhere; white-space: pre-wrap; }
+.fdl-markdown-editor .md-editor-toolbar-right { gap: 4px; }
+.help-article-styled .md-editor.fdl-markdown-editor { background: var(--md-bk-color); }
+.fdl-markdown-editor .fdl-editor-content { padding: 12px 20px; min-height: 100%; cursor: text; outline: none; overflow-wrap: anywhere; white-space: pre-wrap; }
+.fdl-editor-content img { display: inline-block; max-width: 100%; height: auto; }
+.fdl-editor-content table { border-collapse: collapse; width: 100%; table-layout: fixed; }
+.fdl-editor-content :is(td,th) { position: relative; border: 1px solid var(--border); vertical-align: top; }
+.fdl-editor-content .selectedCell { background: var(--accent); }
+.fdl-editor-content ul[data-type='taskList'] { list-style: none; padding-left: 0; }
+.fdl-editor-content li[data-type='taskItem'] { display: flex; gap: 8px; }
+.fdl-editor-content li[data-type='taskItem'] > div { flex: 1; }
+.fdl-editor-content p.is-editor-empty:first-child::before { content: attr(data-placeholder); float: left; height: 0; pointer-events: none; color: var(--muted-foreground); }
+.fdl-editor-content .ProseMirror-selectednode { outline: 2px solid var(--ring); }
+.fdl-editor-message { padding: 4px 12px; font-size: 12px; }
+.fdl-editor-content figure { margin: 12px 0; }
+.fdl-editor-content figcaption { color: var(--muted-foreground); font-size: .875em; margin-top: 8px; }
+.fdl-editor-content .fdl-legacy-anchor { display: block; height: 0; }
+.fdl-markdown-editor .fdl-editor-content table { margin: 44px 0 24px; }
+.fdl-table-controls { position: absolute; inset: 0; pointer-events: none; min-height: 0 !important; z-index: 10; }
+.fdl-table-frame { position: absolute; }
+.fdl-table-frame button { pointer-events: auto; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; font: 12px/1 sans-serif; color: var(--muted-foreground); border-radius: 4px; }
+.fdl-table-frame button:hover, .fdl-table-frame button:focus-visible { color: var(--primary); background: var(--muted); outline: 1px solid var(--primary); }
+.fdl-table-append { position: absolute; background: var(--muted); border: 0; }
+.fdl-table-append.column { left: calc(100% + 3px); top: 0; width: 16px; height: 100%; }
+.fdl-table-append.row { top: calc(100% + 3px); left: 0; height: 16px; width: 100%; }
+.fdl-table-insert { position: absolute; border: 0; background: transparent; padding: 0; opacity: 0; }
+.fdl-table-insert:hover, .fdl-table-insert:focus-visible { opacity: 1; z-index: 2; }
+.fdl-table-insert.row { left: -19px; width: 18px; height: 18px; transform: translateY(-50%); }
+.fdl-table-insert.column { top: -19px; width: 18px; height: 18px; transform: translateX(-50%); }
+.fdl-table-insert.row:hover::after, .fdl-table-insert.row:focus-visible::after { content: ''; position: absolute; top: 50%; left: 19px; width: var(--table-width); border-top: 2px solid var(--primary); pointer-events: none; }
+.fdl-table-insert.column:hover::after, .fdl-table-insert.column:focus-visible::after { content: ''; position: absolute; left: 50%; top: 19px; height: var(--table-height); border-left: 2px solid var(--primary); pointer-events: none; }
+.fdl-table-handle { position: absolute; border: 0; background: var(--muted); padding: 0; }
+.fdl-table-handle.row { left: -17px; width: 14px; height: 16px; transform: translateY(-50%); }
+.fdl-table-handle.column { top: -17px; height: 14px; width: 20px; transform: translateX(-50%); }
+.fdl-table-handle.corner { left: -18px; top: -40px; width: 18px; height: 18px; }
+.fdl-markdown-editor .fdl-editor-content p.is-editor-empty:first-child::before { color: #999; font: 14px/20px source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; }
+.fdl-markdown-editor .fdl-editor-content:has(> p.is-editor-empty:only-child) { padding-top: 14px; padding-left: 16px; }
+.fdl-markdown-editor .fdl-editor-content > p.is-editor-empty:only-child { margin: 0; line-height: 20px; }
+
+.fdl-markdown-editor .fdl-editor-content code.fdl-pending-code {
+  display: inline-block;
+  box-sizing: border-box;
+  width: 1em;
+  min-width: 1em;
+  height: 1em;
+  margin: 0;
+  padding: 0;
+  vertical-align: -.1em;
+  border-radius: 3px;
+  background: color-mix(in srgb, var(--accent) 14%, var(--background));
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent);
+  user-select: none;
+}
+
+.fdl-table-tooltip { position: absolute; display: none; pointer-events: none; white-space: nowrap; padding: 4px 8px; border: 1px solid var(--border); border-radius: 4px; background: var(--popover); color: var(--foreground); font-size: 12px; line-height: 20px; z-index: 4; left: 22px; top: 0; }
+.fdl-table-frame button:is(:hover, :focus-visible) > .fdl-table-tooltip { display: block; }
+.fdl-table-frame button.column > .fdl-table-tooltip { left: 0; right: auto; top: 22px; }
+.fdl-table-append.row > .fdl-table-tooltip { left: 50%; top: -30px; transform: translateX(-50%); }
+.fdl-table-append.column > .fdl-table-tooltip { left: auto !important; right: 20px !important; top: 50% !important; }
+.fdl-table-append.row:is(:hover,:focus-visible)::after { content: ''; position: absolute; top: -3px; left: 0; right: 0; border-top: 2px solid var(--primary); }
+.fdl-table-append.column:is(:hover,:focus-visible)::after { content: ''; position: absolute; left: -3px; top: 0; bottom: 0; border-left: 2px solid var(--primary); }
+
+.fdl-editor-content p.is-editor-empty:first-child:has(.fdl-pending-code)::before { content: none; }
+
+/* Same toolbar layout in both modes; persistent format state belongs to Tiptap. */
+.fdl-structured-shell .md-editor-toolbar-item.fdl-format-active {
+  color: var(--foreground, var(--md-color));
+  background: var(--fdl-toolbar-selected);
+  box-shadow: inset 0 0 0 1px var(--border, var(--md-border-color));
+  border-radius: 3px;
+}
+
+/* A quiet writing frame shared by visual and source editing. */
+.fdl-markdown-editor.md-editor {
+  /* App accent/primary tokens are saturated brand colors, including in dark mode. */
+  --fdl-toolbar-gap: 2px;
+  --fdl-toolbar-hover: color-mix(in srgb, var(--foreground) 6%, var(--md-bk-color));
+  --fdl-toolbar-selected: color-mix(in srgb, var(--foreground) 10%, var(--md-bk-color));
+  --md-color: var(--foreground);
+  --md-bk-color: #fff;
+  --md-border-color: var(--border);
+  --md-bk-color-outstand: var(--muted);
+  --md-bk-color-hover: var(--fdl-toolbar-hover);
+  border-radius: 8px;
+}
+.fdl-markdown-editor .md-editor-toolbar-wrapper {
+  position: relative;
+  z-index: 30;
+  padding: 6px;
+  overflow: visible;
+}
+.fdl-markdown-editor .md-editor-toolbar {
+  flex-wrap: nowrap;
+  gap: 8px;
+}
+.fdl-markdown-editor .md-editor-toolbar-left {
+  flex-wrap: nowrap;
+  flex-shrink: 0;
+  width: max-content;
+  min-width: 0;
+  gap: var(--fdl-toolbar-gap);
+  padding: 0;
+}
+.fdl-markdown-editor .md-editor-toolbar-right {
+  flex-shrink: 0;
+  white-space: nowrap;
+  margin-inline-start: auto;
+  padding: 0;
+  gap: 4px;
+}
+.fdl-markdown-editor .md-editor-toolbar-item {
+  flex-shrink: 0;
+  justify-content: center;
+  min-width: 28px;
+  min-height: 28px;
+  margin: 0;
+  border-radius: 4px;
+  transition: background-color .15s, color .15s;
+}
+.fdl-markdown-editor .md-editor-toolbar-item:focus-visible {
+  outline: 2px solid var(--ring, var(--md-color));
+  outline-offset: 1px;
+}
+.fdl-markdown-editor .fdl-editor-modes {
+  display: inline-flex;
+  flex-shrink: 0;
+  min-width: max-content;
+  white-space: nowrap;
+  user-select: none;
+  gap: 2px;
+  padding: 2px;
+  border-radius: 6px;
+  background: var(--muted, var(--md-bk-color-outstand));
+}
+.fdl-markdown-editor .fdl-editor-mode {
+  min-width: 0;
+  height: 26px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 4px;
+  line-height: 1.4;
+  font-family: inherit;
+  font-size: 12px;
+  font-weight: 500;
+  white-space: nowrap;
+  cursor: pointer;
+  color: var(--muted-foreground, var(--md-color));
+}
+.fdl-markdown-editor .fdl-editor-mode:hover {
+  color: var(--foreground, var(--md-color));
+  background: var(--fdl-toolbar-hover);
+}
+.fdl-markdown-editor .fdl-editor-mode[data-state='on'] {
+  color: var(--foreground, var(--md-color));
+  background: var(--md-bk-color);
+  box-shadow: 0 1px 2px rgb(0 0 0 / .08), inset 0 0 0 1px var(--border, var(--md-border-color));
+}
+.fdl-markdown-editor .md-editor-footer { border-radius: 0 0 8px 8px; }
+.fdl-markdown-editor .fdl-editor-mode:disabled { opacity: .5; cursor: not-allowed; }
+.fdl-markdown-editor .fdl-editor-mode:focus-visible {
+  outline: 2px solid var(--ring, var(--md-color));
+  outline-offset: 1px;
+}
+
+/* Override native active and hover styling without picking up branded accent colors. */
+.fdl-markdown-editor .md-editor-toolbar-active,
+.fdl-markdown-editor .md-editor-toolbar-item[aria-pressed='true'] {
+  color: var(--foreground);
+  background: var(--fdl-toolbar-selected);
+}
+.fdl-markdown-editor .md-editor-toolbar-item:not([disabled]):hover {
+  color: var(--foreground);
+  background: var(--fdl-toolbar-hover);
+}
+.fdl-markdown-editor .md-editor-toolbar-item[aria-pressed='true']:hover {
+  background: var(--fdl-toolbar-selected);
+}
+
+.fdl-editor-content .fdl-code-language {
+  min-width: 72px;
+  max-width: 160px;
+  height: 26px;
+  padding: 0 4px;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  cursor: pointer;
+}
+.fdl-editor-content .fdl-code-language:focus-visible { outline: 2px solid var(--ring); }
+.fdl-editor-content .fdl-code-language:disabled { cursor: default; opacity: .6; }
+
+.fdl-markdown-editor .fdl-toolbar-overflow-trigger {
+  display: none;
+  flex: 0 0 28px;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--foreground);
+  cursor: pointer;
+  user-select: none;
+}
+.fdl-markdown-editor[data-toolbar-collapsed] .fdl-toolbar-overflow-trigger { display: inline-flex; }
+.fdl-markdown-editor .fdl-toolbar-overflow-trigger:hover,
+.fdl-markdown-editor .fdl-toolbar-overflow-trigger[aria-expanded='true'] { background: var(--fdl-toolbar-hover); }
+.fdl-markdown-editor .fdl-toolbar-overflow-trigger:focus-visible { outline: 2px solid var(--ring); outline-offset: 1px; }
+.fdl-markdown-editor[data-toolbar-collapsed] .md-editor-toolbar-left {
+  position: absolute;
+  inset-block-start: calc(100% + 4px);
+  inset-inline-start: 6px;
+  z-index: 30;
+  flex-wrap: wrap;
+  max-width: min(320px, calc(100% - 12px));
+  box-sizing: border-box;
+  padding: 6px;
+  gap: 4px;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--popover, var(--background));
+  box-shadow: 0 4px 16px rgb(0 0 0 / .12);
+  visibility: hidden;
+  opacity: 0;
+  pointer-events: none;
+}
+.fdl-markdown-editor[data-toolbar-overflow-open] .md-editor-toolbar-left {
+  visibility: visible;
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.fdl-markdown-editor[data-toolbar-collapsed]:not([data-toolbar-overflow-open]) .md-editor-toolbar-left * { visibility: hidden !important; }
+
+
+/* Preserve the former editor surface colors and let caller sizing rules win. */
+.fdl-markdown-editor.md-editor.md-editor-dark { --md-bk-color: #000; }
+
+/* Match the former editor's quiet scrollbars in visual, source and preview. */
+.fdl-markdown-editor { --fdl-scrollbar-thumb: #999; --fdl-scrollbar-thumb-hover: #777; color-scheme: light; }
+.fdl-markdown-editor.md-editor-dark { --fdl-scrollbar-thumb: #333; --fdl-scrollbar-thumb-hover: #444; color-scheme: dark; }
+.fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre) {
+  scrollbar-width: thin;
+  scrollbar-color: var(--fdl-scrollbar-thumb) transparent;
+}
+@supports selector(::-webkit-scrollbar) {
+  /* Chromium's standard scrollbar properties override its custom pseudo-elements. */
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre) { scrollbar-width: auto; scrollbar-color: auto; }
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar-track,
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar-corner { background: transparent; }
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar-thumb { border: 1px solid transparent; border-radius: 5px; background: var(--fdl-scrollbar-thumb); background-clip: padding-box; }
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar-thumb:hover { background-color: var(--fdl-scrollbar-thumb-hover); }
+  .fdl-markdown-editor :is(.fdl-rich-scroll, .cm-scroller, .fdl-preview-pane, pre)::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
+}
+
+.fdl-heading-level { width: 16px; height: 16px; font: 600 11px/16px var(--font-body, system-ui, sans-serif); text-align: center; }
+.fdl-tool-menu [role="menuitemradio"]:is(:hover, :focus, [data-highlighted], [data-state="checked"]) { background: var(--muted); color: var(--foreground); }
+.fdl-link-controls { z-index: 60; display: flex; align-items: center; gap: 2px; max-width: calc(100vw - 16px); padding: 4px; border: 1px solid var(--border); border-radius: 6px; background: var(--popover, var(--background)); color: var(--foreground); box-shadow: 0 3px 12px #0002; }
+.fdl-link-controls [data-slot="button"] { height: 28px; min-width: 28px; color: inherit; border-radius: 4px; }
+.fdl-link-controls [data-slot="button"]:hover { background: var(--muted); color: var(--foreground); }
+.fdl-link-destination { min-width: 0; max-width: min(280px, calc(100vw - 100px)); gap: 6px; font-size: 12px; }
+.fdl-link-destination span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
diff --git a/app/assets/css/md-editor-preview.css b/app/assets/css/md-editor-preview.css
index 7ed05d0e..1a51c450 100644
--- a/app/assets/css/md-editor-preview.css
+++ b/app/assets/css/md-editor-preview.css
@@ -1,4 +1,4 @@
-/* Shared MdEditor preview styles — matches PostContent rendering */
+/* Shared Markdown preview styles — matches PostContent rendering */
 /* Imported via <script setup> so :deep() is not needed; scoped by .editor-preview-styled */
 .editor-preview-styled .md-editor-preview-wrapper {
   padding: 0;
diff --git a/app/assets/css/tailwind.css b/app/assets/css/tailwind.css
index 5f1fcbe1..b5b18023 100644
--- a/app/assets/css/tailwind.css
+++ b/app/assets/css/tailwind.css
@@ -203,29 +203,7 @@
 }
 
 
-/* md-editor modal and image preview conflict with Shadcn Dialog */
-/* md-editor / medium-zoom pointer-events hack */
-  .md-editor-modal-container,
-  .medium-zoom-overlay,
-  .medium-zoom-image--opened {
-    pointer-events: auto
-  }
-
-/* md-editor-v3 ships `word-break: break-all` on its preview containers, which splits ordinary
-   words mid-character instead of wrapping at spaces. Restore normal word wrapping, keeping
-   `overflow-wrap` as a safety net so a genuinely unbreakable run (a long URL) still breaks
-   rather than overflowing its column.
-
-   The doubled class is deliberate. The library's CSS ships in a lazy component chunk, so
-   source order cannot decide the winner and the reset has to out-rank it on specificity. Two
-   classes also beat the theme's `div.default-theme table tr th, ... td`, which sets the legacy
-   `word-wrap` alias on cells — that rule is why `th`/`td` are listed explicitly, since it
-   overrides the value the cells would otherwise inherit from the container.
-
-   `anywhere` rather than `break-word` is load-bearing. The library renders links as
-   `display: inline-flex`, so a bare URL is a flex item, and a flex item will not shrink below
-   its min-content width. Only `anywhere` reduces min-content; under `break-word` a long link
-   keeps its full width and overflows its column instead of wrapping. */
+/* Shared Markdown content wraps prose and long URLs naturally. */
 .md-editor-preview.md-editor-preview,
 .md-editor-html.md-editor-html,
 .md-editor-preview.md-editor-preview :is(h1, h2, h3, h4, h5, h6, th, td) {
diff --git a/app/components/MarkdownAddressDialog.vue b/app/components/MarkdownAddressDialog.vue
new file mode 100644
index 00000000..4c6b5220
--- /dev/null
+++ b/app/components/MarkdownAddressDialog.vue
@@ -0,0 +1,30 @@
+<script setup lang="ts">
+import { Dialog, DialogContent, DialogTitle, DialogFooter } from './ui/dialog'
+import { Input } from './ui/input'
+import { Button } from './ui/button'
+import type { toolbarLabels } from '~/lib/markdown-editor-ui'
+const props = defineProps<{ open: boolean, title: string, labels: typeof toolbarLabels.en, disabled?: boolean }>()
+const emit = defineEmits<{ cancel: [], confirm: [], restoreFocus: [] }>()
+const address = defineModel<string>('address', { required: true })
+const description = defineModel<string>('description', { required: true })
+const id = useId()
+function focusAddress(event: Event) {
+  event.preventDefault()
+  document.getElementById(`${id}-address`)?.focus()
+}
+function submitOnEnter(event: KeyboardEvent) {
+  if (event.isComposing || event.keyCode === 229 || !(event.target instanceof HTMLInputElement)) return
+  event.preventDefault(); confirm()
+}
+function confirm() { if (address.value.trim() && !props.disabled) emit('confirm') }
+</script>
+<template>
+  <Dialog :open="open" @update:open="value => { if (!value) emit('cancel') }">
+    <DialogContent class="fdl-address-dialog" :show-close-button="false" :aria-describedby="undefined" @open-auto-focus="focusAddress" @close-auto-focus="event => { event.preventDefault(); emit('restoreFocus') }" @keydown.enter="submitOnEnter">
+      <DialogTitle>{{ title }}</DialogTitle>
+      <div class="grid gap-2"><label :for="`${id}-description`">{{ labels.description }}</label><Input :id="`${id}-description`" v-model="description" :placeholder="labels.description" /></div>
+      <div class="grid gap-2"><label :for="`${id}-address`">{{ labels.addressLabel }}</label><Input :id="`${id}-address`" v-model="address" :placeholder="labels.address" /></div>
+      <DialogFooter><Button type="button" variant="outline" @click="emit('cancel')">{{ labels.cancel }}</Button><Button type="button" :disabled="!address.trim() || disabled" @click="confirm">{{ labels.ok }}</Button></DialogFooter>
+    </DialogContent>
+  </Dialog>
+</template>
diff --git a/app/components/MarkdownEditorShell.vue b/app/components/MarkdownEditorShell.vue
new file mode 100644
index 00000000..db3dc00d
--- /dev/null
+++ b/app/components/MarkdownEditorShell.vue
@@ -0,0 +1,279 @@
+<script setup lang="ts">
+import { EditorState, Compartment } from '@codemirror/state'
+import { EditorView, keymap, placeholder as sourcePlaceholder } from '@codemirror/view'
+import { history, historyKeymap, defaultKeymap, undo, redo } from '@codemirror/commands'
+import { markdown } from '@codemirror/lang-markdown'
+import { syntaxHighlighting, defaultHighlightStyle } from '@codemirror/language'
+import { Check, Bold, Italic, Strikethrough, Heading, List, ListOrdered, ListTodo, Link, Image, Code, SquareCode, Table, Quote, Undo, Redo, Eye, Save, Maximize } from 'lucide-vue-next'
+import { toolbarFormats, toolbarLabels, type SourceInsertion } from '~/lib/markdown-editor-ui'
+import { ToggleGroup, ToggleGroupItem } from './ui/toggle-group'
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem } from './ui/dropdown-menu'
+import MarkdownAddressDialog from './MarkdownAddressDialog.vue'
+import ThemedMdPreview from './ThemedMdPreview.vue'
+import MarkdownImageCrop from './MarkdownImageCrop.vue'
+import '~/assets/css/markdown-editor.css'
+const props = withDefaults(defineProps<{
+  modelValue: string, structured: boolean, language?: string, theme?: string, placeholder?: string,
+  toolbars?: readonly (string | number)[], footers?: readonly (string | number)[],
+  headingLevel?: number, activeFormats?: readonly string[], readOnly?: boolean, disabled?: boolean, maxLength?: number, sanitize?: (html: string) => string,
+}>(), { language: 'en-US', theme: 'light', placeholder: '', toolbars: () => [], footers: () => ['markdownTotal'], maxLength: undefined, sanitize: undefined, activeFormats: () => [], headingLevel: 0 })
+const emit = defineEmits<{
+  'update:modelValue': [value: string], command: [name: string, value?: number],
+  onSave: [value: string, html: Promise<string>], onFocus: [event: FocusEvent], onBlur: [event: FocusEvent],
+  uploadImages: [files: File[]], restoreFocus: [], modeChange: [mode: 'structured' | 'source'],
+}>()
+const { t } = useI18n()
+const modeLabel = (key: string) => t(`markdownEditor.${key}`, {}, { locale: props.language === 'zh-CN' ? 'zh' : 'en' })
+function updateMode(value: unknown) { if (value === 'structured' || value === 'source') { previewOnly.value = false; emit('modeChange', value) } }
+const shellId = useId()
+const root = ref<HTMLElement>()
+const sourceMount = ref<HTMLElement>()
+const fileInput = ref<HTMLInputElement>()
+const previewOnly = ref(false)
+const cropOpen = ref(false)
+function chooseImage(crop = false) { menu.value = undefined; if (crop) cropOpen.value = true; else fileInput.value?.click() }
+const menu = ref<string>()
+const fullscreen = ref(false)
+const tableSize = ref({ rows: 3, cols: 3 })
+const isMenu = (item: string | number) => ['title', 'image', 'table'].includes(String(item))
+let menuKeyboard = false
+let hoverDismiss = false
+let menuEscapeTarget: string | undefined
+function keyboardMenu() { menuKeyboard = true }
+function pointerMenu(event: PointerEvent) {
+  menuKeyboard = false
+  if (!(event.currentTarget as HTMLElement).contains(document.activeElement)) event.preventDefault()
+}
+function menuOpenFocus(event: Event) { if (!menuKeyboard) event.preventDefault() }
+let keepMenuOnClick = false
+let menuFrame = 0
+function cancelMenuClose() { cancelAnimationFrame(menuFrame); menuFrame = 0 }
+function closeHoverMenu() { hoverDismiss = true; menuKeyboard = false; menu.value = undefined }
+function openMenu(item: string | number) {
+  cancelMenuClose()
+  if (!isMenu(item) || locked.value || previewOnly.value) { if (menu.value) closeHoverMenu(); return }
+  if (menu.value !== item) { menuKeyboard = false; hoverDismiss = false; menuEscapeTarget = undefined }
+  menu.value = String(item)
+}
+function leaveMenu() {
+  cancelMenuClose()
+  // Let the pointer enter the adjacent portalled menu before checking its position.
+  menuFrame = requestAnimationFrame(() => {
+    menuFrame = 0
+    if (!menu.value) return
+    const popup = document.querySelector(`[data-editor-owner="${shellId}"][data-state="open"]`)
+    const trigger = root.value?.querySelector(`[data-command="${menu.value}"]`)
+    if (!popup?.matches(':hover') && !trigger?.matches(':hover') && !(menuKeyboard && popup?.contains(document.activeElement))) closeHoverMenu()
+  })
+}
+function protectMenuClick(event: MouseEvent, item: string | number) { keepMenuOnClick = event.detail > 0 && isMenu(item) && menu.value === item && !!(event.target as Element).closest('.md-editor-toolbar-item') }
+function setMenu(item: string | number, open: boolean) {
+  // A previous menu's close event must not dismiss the menu just entered.
+  if (!open && menu.value !== item) return
+  if (!open && keepMenuOnClick) { keepMenuOnClick = false; return }
+  cancelMenuClose()
+  menu.value = open ? String(item) : undefined
+}
+function menuEscape(item: string | number) {
+  cancelMenuClose(); menuEscapeTarget = String(item); hoverDismiss = false
+}
+function menuFocus(event: Event, item: string | number) {
+  event.preventDefault()
+  if (menu.value) return
+  if (menuEscapeTarget === String(item)) {
+    menuEscapeTarget = undefined
+    root.value?.querySelector<HTMLButtonElement>(`[data-command="${item}"]`)?.focus()
+  } else if (hoverDismiss) {
+    hoverDismiss = false
+    if (!root.value?.querySelector('.fdl-editor-body')?.contains(document.activeElement)) emit('restoreFocus')
+  }
+}
+function gridKey(event: KeyboardEvent, rows: number, cols: number) {
+  const offsets: Record<string, [number, number]> = { ArrowUp: [-1, 0], ArrowDown: [1, 0], ArrowLeft: [0, -1], ArrowRight: [0, 1] }
+  const offset = offsets[event.key]
+  if (!offset) return
+  event.preventDefault(); event.stopPropagation()
+  const row = Math.max(1, Math.min(6, rows + offset[0])), col = Math.max(1, Math.min(6, cols + offset[1]))
+  const grid = (event.target as HTMLElement).closest('.fdl-table-picker')
+  grid?.querySelector<HTMLButtonElement>(`[data-row="${row}"][data-col="${col}"]`)?.focus()
+  tableSize.value = { rows: row, cols: col }
+}
+function escapeFullscreen(event: KeyboardEvent) { if (event.key === 'Escape' && !event.defaultPrevented && fullscreen.value && !menu.value && !addressKind.value && !cropOpen.value) { fullscreen.value = false; emit('restoreFocus') } }
+const addressKind = ref<'link' | 'image'>()
+const address = ref('')
+const description = ref('')
+const labels = computed(() => toolbarLabels[props.language === 'zh-CN' ? 'zh' : 'en'])
+const locked = computed(() => props.disabled || props.readOnly)
+const divider = computed(() => props.toolbars.indexOf('='))
+const leftTools = computed(() => props.toolbars.slice(0, divider.value < 0 ? props.toolbars.length : divider.value).filter(item => typeof item === 'string' && item !== '-'))
+const icons: Record<string, unknown> = { bold: Bold, italic: Italic, strikeThrough: Strikethrough, title: Heading, unorderedList: List, orderedList: ListOrdered, task: ListTodo, link: Link, image: Image, code: SquareCode, codeRow: Code, table: Table, quote: Quote, revoke: Undo, next: Redo, previewOnly: Eye, preview: Eye, save: Save, fullscreen: Maximize, pageFullscreen: Maximize }
+const headingLabel = (level: number) => props.language === 'zh-CN' ? `${['一', '二', '三', '四', '五', '六'][level - 1]}级标题` : `Heading ${level}`
+const label = (name: string) => labels.value[name as keyof typeof labels.value] ?? name
+const editable = new Compartment(), hint = new Compartment(), sourceHistory = new Compartment()
+let view: EditorView | undefined
+let syncing = false
+function insert(recipe: (selection: string) => SourceInsertion) {
+  if (!view || locked.value) return
+  const { from, to } = view.state.selection.main
+  const result = recipe(view.state.sliceDoc(from, to))
+  const anchor = from + (result.deviationStart ?? (result.select ? 0 : result.targetValue.length))
+  const head = from + result.targetValue.length + (result.deviationEnd ?? 0)
+  view.dispatch({ changes: { from, to, insert: result.targetValue }, selection: { anchor, head: result.select ? head : anchor }, scrollIntoView: true, userEvent: 'input' })
+  view.focus()
+}
+function wrap(before: string, after = before) {
+  insert(text => ({ targetValue: before + text + after, select: true, deviationStart: before.length, deviationEnd: -after.length }))
+}
+function execute(name: string, value?: number) {
+  menu.value = undefined
+  if (name === 'previewOnly' || name === 'preview') { previewOnly.value = !previewOnly.value; if (!previewOnly.value) nextTick(() => emit('restoreFocus')); return }
+  if (name === 'save') { triggerSave(); return }
+  if (name === 'fullscreen' || name === 'pageFullscreen') { fullscreen.value = !fullscreen.value; return }
+  if (locked.value || previewOnly.value) return
+  if (props.structured) { emit('command', name, value); return }
+  if (name === 'link' || name === 'image') {
+    addressKind.value = name; address.value = ''; description.value = view?.state.sliceDoc(view.state.selection.main.from, view.state.selection.main.to) ?? ''; return
+  }
+  if (name === 'revoke') { if (view) { undo(view); view.focus() }; return }
+  if (name === 'next') { if (view) { redo(view); view.focus() }; return }
+  if (name === 'code' || name === 'codeRow') {
+    const text = view?.state.sliceDoc(view.state.selection.main.from, view.state.selection.main.to) ?? ''
+    const marker = '`'.repeat(Math.max(name === 'code' ? 3 : 1, ...Array.from(text.matchAll(/`+/g), match => match[0].length + 1)))
+    if (name === 'code') {
+      insertBlock(marker + '\n', text, '\n' + marker)
+    } else {
+      const padding = /^`|`$/.test(text) ? ' ' : ''
+      wrap(marker + padding, padding + marker)
+    }
+    return
+  }
+  const pairs: Record<string, [string, string?]> = { bold: ['**'], italic: ['*'], strikeThrough: ['~~'] }
+  if (pairs[name]) { wrap(...pairs[name]); return }
+  if (name === 'table') {
+    const cols = value ?? 3, rows = tableRows.value
+    const row = '| ' + Array(cols).fill('').join(' | ') + ' |'
+    const text = '\n' + [row, '| ' + Array(cols).fill('---').join(' | ') + ' |', ...Array(rows - 1).fill(row)].join('\n') + '\n'
+    insert(() => ({ targetValue: text, select: true, deviationStart: 3, deviationEnd: 3 - text.length })); return
+  }
+  const prefixes: Record<string, string> = { title: '#'.repeat(value ?? 2) + ' ', unorderedList: '- ', orderedList: '1. ', task: '- [ ] ', quote: '> ' }
+  if (prefixes[name] || name === 'paragraph') {
+    if (!view) return
+    const selection = view.state.selection.main
+    const from = view.state.doc.lineAt(selection.from).from
+    const to = view.state.doc.lineAt(selection.to > selection.from && view.state.doc.lineAt(selection.to).from === selection.to ? selection.to - 1 : selection.to).to
+    const text = view.state.sliceDoc(from, to).split('\n').map(line => name === 'paragraph' ? line.replace(/^#{1,6}\s+/, '') : prefixes[name] + (name === 'title' ? line.replace(/^#{1,6}\s+/, '') : line)).join('\n')
+    view.dispatch({ changes: { from, to, insert: text }, selection: { anchor: from + text.length }, scrollIntoView: true, userEvent: 'input' })
+    view.focus()
+  }
+}
+function insertBlock(before: string, text: string, after: string) {
+  if (!view) return
+  const selection = view.state.selection.main
+  const prefix = view.state.sliceDoc(0, selection.from), suffix = view.state.sliceDoc(selection.to)
+  const leading = !prefix || prefix.endsWith('\n\n') ? '' : prefix.endsWith('\n') ? '\n' : '\n\n'
+  const trailing = !suffix || suffix.startsWith('\n\n') ? '' : suffix.startsWith('\n') ? '\n' : '\n\n'
+  insert(() => ({ targetValue: leading + before + text + after + trailing, select: true, deviationStart: leading.length + before.length, deviationEnd: -after.length - trailing.length }))
+}
+const tableRows = ref(3)
+function table(rows: number, cols: number) { tableRows.value = rows; if (props.structured) { menu.value = undefined; emit('command', 'table', rows * 100 + cols) } else execute('table', cols) }
+function cancelAddress() { addressKind.value = undefined }
+function cancelCrop() { cropOpen.value = false }
+function confirmAddress() {
+  if (!address.value.trim() || locked.value) return
+  const destination = address.value.trim().replace(/[<>\n]/g, '')
+  const text = description.value.replace(/[[\]\\]/g, '\\$&')
+  insert(() => ({ targetValue: `${addressKind.value === 'image' ? '!' : ''}[${text}](<${destination}>)` }))
+  addressKind.value = undefined
+}
+function uploadFiles(event: Event) {
+  const files = Array.from((event.target as HTMLInputElement).files ?? [])
+  sendFiles(files)
+  ;(event.target as HTMLInputElement).value = ''
+  menu.value = undefined
+}
+function applyCrop(file: File) { cropOpen.value = false; sendFiles([file]) }
+function sendFiles(files: File[]) { if (!locked.value && files.length) emit('uploadImages', files) }
+function triggerSave() { emit('onSave', props.modelValue, import('~/lib/markdown-render').then(module => module.renderMarkdown(props.modelValue, undefined, props.sanitize))) }
+function resetHistory() { view?.dispatch({ effects: sourceHistory.reconfigure(history()) }) }
+function dismissDialogs() { addressKind.value = undefined; cropOpen.value = false; menu.value = undefined }
+watch(locked, value => { if (value) dismissDialogs() })
+onMounted(() => {
+  view = new EditorView({ parent: sourceMount.value!, state: EditorState.create({ doc: props.modelValue, extensions: [
+    markdown(), syntaxHighlighting(defaultHighlightStyle), EditorView.lineWrapping, sourceHistory.of(history()), keymap.of([{ key: 'Mod-s', run: () => { triggerSave(); return true } }, ...defaultKeymap, ...historyKeymap]),
+    editable.of([EditorState.readOnly.of(!!locked.value), EditorView.editable.of(!locked.value)]), hint.of(sourcePlaceholder(props.placeholder)),
+    EditorView.theme({ '&': { height: '100%', color: 'var(--foreground)', backgroundColor: 'transparent' }, '.cm-scroller': { overflow: 'auto', fontFamily: 'var(--fdl-editor-font-family)', fontSize: '14px', lineHeight: '1.7' }, '.cm-content': { padding: '12px 16px', minHeight: '100%' }, '.cm-focused': { outline: 'none' }, '&.cm-focused': { outline: 'none' }, '.cm-cursor': { borderLeftColor: 'var(--foreground)' }, '.cm-selectionBackground, &.cm-focused .cm-selectionBackground': { background: 'color-mix(in srgb, var(--foreground) 18%, transparent)' } }),
+    EditorView.updateListener.of(update => { if (update.docChanged && !syncing) emit('update:modelValue', update.state.doc.toString()) }),
+    EditorView.domEventHandlers({ focus: event => { emit('onFocus', event); return false }, blur: event => { emit('onBlur', event); return false } }),
+  ] }) })
+  document.addEventListener('keydown', escapeFullscreen)
+})
+watch(() => props.modelValue, value => {
+  if (view && value !== view.state.doc.toString()) { syncing = true; view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: value } }); syncing = false }
+})
+watch(locked, value => view?.dispatch({ effects: editable.reconfigure([EditorState.readOnly.of(!!value), EditorView.editable.of(!value)]) }))
+watch(() => props.placeholder, value => view?.dispatch({ effects: hint.reconfigure(sourcePlaceholder(value)) }))
+watch(() => props.structured, () => { previewOnly.value = false; menu.value = undefined; nextTick(() => view?.requestMeasure()) })
+onBeforeUnmount(() => { view?.destroy(); cancelMenuClose(); document.removeEventListener('keydown', escapeFullscreen) })
+defineExpose({ closeToolbarMenu: () => { menu.value = undefined }, dismissDialogs, getEditorView: () => view, insert, resetHistory, triggerSave, focus: () => view?.focus(), getSelectedText: () => view?.state.sliceDoc(view.state.selection.main.from, view.state.selection.main.to), togglePreviewOnly: (value?: boolean) => { previewOnly.value = value ?? !previewOnly.value } })
+</script>
+<template>
+  <div :id="shellId" ref="root" class="md-editor fdl-markdown-editor" :class="{ 'md-editor-dark': theme === 'dark', 'fdl-structured-shell': structured, 'fdl-editor-fullscreen': fullscreen }">
+    <div v-if="toolbars.length" class="md-editor-toolbar-wrapper">
+      <div class="md-editor-toolbar" role="toolbar">
+        <div class="md-editor-toolbar-left">
+          <DropdownMenu v-for="(item, index) in leftTools" :key="index" :open="menu === item" :modal="false" @update:open="value => setMenu(item, value)">
+            <div class="fdl-tool" @click.capture="protectMenuClick($event, item)" @pointerenter="openMenu(item)" @pointerleave="leaveMenu" @keydown.capture="keyboardMenu">
+              <component :is="isMenu(item) ? DropdownMenuTrigger : 'button'" type="button" class="md-editor-toolbar-item" :data-command="item" :class="{ 'fdl-format-active': structured && activeFormats.includes(String(item)) }" :aria-pressed="['previewOnly', 'preview'].includes(String(item)) ? previewOnly : ['fullscreen', 'pageFullscreen'].includes(String(item)) ? fullscreen : structured && toolbarFormats[String(item)] ? activeFormats.includes(String(item)) : undefined" :aria-label="label(String(item))" :title="item === 'title' && structured && headingLevel ? `${label('title')} ${headingLevel}` : label(String(item))" :disabled="(locked || previewOnly) && !['previewOnly', 'preview', 'fullscreen', 'pageFullscreen', ...(previewOnly && !locked ? ['save'] : [])].includes(String(item))" @mousedown.prevent @click="!isMenu(item) && execute(String(item))">
+                <span v-if="item === 'title' && structured && headingLevel" class="fdl-heading-level" aria-hidden="true">H{{ headingLevel }}</span><component :is="icons[String(item)]" v-else :size="16" aria-hidden="true" />
+              </component>
+              <DropdownMenuContent v-if="isMenu(item)" class="fdl-tool-menu" :side-offset="0" :data-editor-owner="shellId" align="start" @keydown.capture="keyboardMenu" @pointermove.capture="pointerMenu" @pointerleave.capture="pointerMenu" @pointerenter="openMenu(item)" @pointerleave="leaveMenu" @open-auto-focus="menuOpenFocus" @escape-key-down="menuEscape(item)" @close-auto-focus="event => menuFocus(event, item)">
+                <template v-if="item === 'title'">
+                  <DropdownMenuItem class="pr-8" @select="execute('paragraph')">{{ labels.paragraph }}</DropdownMenuItem>
+                  <DropdownMenuRadioGroup :model-value="structured && headingLevel ? String(headingLevel) : undefined"><DropdownMenuRadioItem v-for="level in 6" :key="level" :value="String(level)" indicator-position="right" @select="execute('title', level)"><template #indicator-icon><Check :size="14" /></template>{{ headingLabel(level) }}</DropdownMenuRadioItem></DropdownMenuRadioGroup>
+                </template>
+                <template v-if="item === 'image'">
+                  <DropdownMenuItem @select="execute('image')">{{ labels.url }}</DropdownMenuItem>
+                  <DropdownMenuItem @select="chooseImage()">{{ labels.upload }}</DropdownMenuItem>
+                  <DropdownMenuItem @select="chooseImage(true)">{{ labels.crop }}</DropdownMenuItem>
+                </template>
+                <div v-if="item === 'table'" class="fdl-table-picker">
+                  <div class="fdl-table-size" aria-live="polite">{{ tableSize.rows }} × {{ tableSize.cols }}</div>
+                  <div v-for="row in 6" :key="row" class="md-editor-table-shape-row"><DropdownMenuItem v-for="col in 6" :key="col" as-child @select="table(row, col)"><button type="button" class="md-editor-table-shape-col" :class="{ 'fdl-table-cell-selected': row <= tableSize.rows && col <= tableSize.cols }" :data-row="row" :data-col="col" :aria-label="`${row} × ${col}`" @pointerenter="tableSize = { rows: row, cols: col }" @focus="tableSize = { rows: row, cols: col }" @keydown="gridKey($event, row, col)" /></DropdownMenuItem></div>
+                </div>
+              </DropdownMenuContent>
+            </div>
+          </DropdownMenu>
+        </div>
+        <div class="md-editor-toolbar-right">
+          <slot name="defToolbars" />
+          <ToggleGroup
+            type="single" :spacing="1" :model-value="structured ? 'structured' : 'source'" :disabled="disabled"
+            class="fdl-editor-modes ml-auto shrink-0 gap-0 rounded-md p-0.5"
+            :aria-label="modeLabel('editingMode')"
+            @update:model-value="updateMode"
+          >
+            <ToggleGroupItem
+              v-for="mode in (['structured', 'source'] as const)" :key="mode" :value="mode"
+              class="fdl-editor-mode h-6 min-w-0 rounded px-2 py-0 text-xs font-medium transition-colors disabled:cursor-not-allowed"
+              @mousedown.prevent @click="previewOnly = false"
+            >{{ modeLabel(mode === 'structured' ? 'structuredMode' : 'sourceMode') }}</ToggleGroupItem>
+          </ToggleGroup>
+        </div>
+      </div>
+    </div>
+    <div class="md-editor-content fdl-editor-body">
+      <div v-show="!previewOnly" class="md-editor-input-wrapper">
+        <div v-show="!structured" ref="sourceMount" class="fdl-source-mount" />
+        <div v-show="structured" class="fdl-rich-mount"><slot name="visual" /></div>
+      </div>
+      <div v-if="previewOnly" class="fdl-preview-pane"><ThemedMdPreview :model-value="modelValue" :language="language" :sanitize="sanitize" /></div>
+    </div>
+    <div v-if="footers.length" class="md-editor-footer" :class="{ 'fdl-footer-right': footers.includes('=') }">
+      <span v-if="footers.includes('markdownTotal')">{{ modelValue.length }} {{ labels.count }}</span><slot name="defFooters" />
+    </div>
+    <MarkdownImageCrop v-if="cropOpen" :language="language" @cancel="cancelCrop" @apply="applyCrop" @restore-focus="emit('restoreFocus')" />
+    <input ref="fileInput" type="file" accept="image/*" multiple hidden @change="uploadFiles">
+    <MarkdownAddressDialog v-model:description="description" v-model:address="address" :open="!!addressKind" :title="addressKind === 'image' ? labels.image : labels.link" :labels="labels" :disabled="locked" @cancel="cancelAddress" @confirm="confirmAddress" @restore-focus="emit('restoreFocus')" />
+    <slot name="overlays" />
+  </div>
+</template>
diff --git a/app/components/MarkdownImageCrop.vue b/app/components/MarkdownImageCrop.vue
new file mode 100644
index 00000000..12706b87
--- /dev/null
+++ b/app/components/MarkdownImageCrop.vue
@@ -0,0 +1,84 @@
+<script setup lang="ts">
+import Cropper from 'cropperjs'
+import 'cropperjs/dist/cropper.css'
+import { Maximize2, Minimize2, Trash2, Upload, X } from 'lucide-vue-next'
+import { Dialog, DialogContent, DialogTitle, DialogFooter } from './ui/dialog'
+import { Button } from './ui/button'
+const props = defineProps<{ language: string }>()
+const emit = defineEmits<{ cancel: [], restoreFocus: [], apply: [file: File] }>()
+const input = ref<HTMLInputElement>()
+const image = ref<HTMLImageElement>()
+const preview = ref<HTMLElement>()
+const source = ref('')
+const ready = ref(false), error = ref(false), exporting = ref(false)
+const fullscreen = ref(false)
+const offset = ref({ x: 0, y: 0 })
+const zh = computed(() => props.language === 'zh-CN')
+let cropper: Cropper | undefined
+let file: File | undefined
+let disposed = false
+let drag: { x: number, y: number, left: number, top: number } | undefined
+function focusChoose(event: Event) { event.preventDefault(); nextTick(() => input.value?.parentElement?.querySelector<HTMLButtonElement>('.fdl-crop-choose')?.focus()) }
+function initialize() {
+  cropper?.destroy(); cropper = undefined; ready.value = false
+  if (!image.value || !source.value) return
+  cropper = new Cropper(image.value, { viewMode: 2, preview: preview.value, ready: () => { ready.value = true } })
+}
+function reset() {
+  cropper?.destroy(); cropper = undefined
+  if (source.value) URL.revokeObjectURL(source.value)
+  source.value = ''; ready.value = false; error.value = false; file = undefined
+  if (input.value) input.value.value = ''
+}
+function select(event: Event) {
+  const next = (event.target as HTMLInputElement).files?.[0]
+  if (!next) return
+  reset(); file = next; source.value = URL.createObjectURL(next)
+  nextTick(initialize)
+}
+function remove() { reset(); nextTick(() => input.value?.parentElement?.querySelector<HTMLButtonElement>('.fdl-crop-choose')?.focus()) }
+function apply() {
+  if (!cropper || !file || !ready.value || exporting.value) return
+  exporting.value = true
+  const name = file.name.replace(/\.[^.]+$/, '') + '.png'
+  cropper.getCroppedCanvas().toBlob(blob => {
+    if (disposed) return
+    exporting.value = false
+    if (blob) emit('apply', new File([blob], name, { type: 'image/png' }))
+    else error.value = true
+  }, 'image/png')
+}
+function startDrag(event: PointerEvent) {
+  if (fullscreen.value || (event.target as Element).closest('button')) return
+  ;(event.currentTarget as HTMLElement).setPointerCapture(event.pointerId)
+  drag = { x: event.clientX, y: event.clientY, left: offset.value.x, top: offset.value.y }
+}
+function moveDrag(event: PointerEvent) {
+  if (!drag) return
+  offset.value = { x: drag.left + event.clientX - drag.x, y: drag.top + event.clientY - drag.y }
+}
+watch(fullscreen, () => nextTick(initialize))
+onBeforeUnmount(() => { disposed = true; reset() })
+</script>
+<template>
+  <Dialog :open="true" @update:open="value => { if (!value) emit('cancel') }">
+    <DialogContent class="fdl-crop-dialog" :class="{ 'fdl-crop-fullscreen': fullscreen }" :style="fullscreen ? undefined : { marginLeft: `${offset.x}px`, marginTop: `${offset.y}px` }" :show-close-button="false" :aria-describedby="undefined" @open-auto-focus="focusChoose" @close-auto-focus="event => { event.preventDefault(); emit('restoreFocus') }">
+      <header class="fdl-crop-header" @pointerdown="startDrag" @pointermove="moveDrag" @pointerup="drag = undefined" @pointercancel="drag = undefined">
+        <DialogTitle>{{ zh ? '裁剪并上传' : 'Crop And Upload' }}</DialogTitle>
+        <div><Button type="button" variant="ghost" size="icon-sm" :aria-label="fullscreen ? (zh ? '还原' : 'Restore') : (zh ? '放大' : 'Expand')" @click="fullscreen = !fullscreen"><component :is="fullscreen ? Minimize2 : Maximize2" :size="16" /></Button><Button type="button" variant="ghost" size="icon-sm" :aria-label="zh ? '关闭' : 'Close'" @click="emit('cancel')"><X :size="18" /></Button></div>
+      </header>
+      <div class="fdl-crop-content">
+        <div class="fdl-crop-workspace">
+          <div class="fdl-crop-main">
+            <template v-if="source"><img ref="image" :src="source" alt="" @error="error = true"><Button type="button" variant="secondary" size="icon-sm" class="fdl-crop-remove" :aria-label="zh ? '删除图片' : 'Remove image'" @click="remove"><Trash2 :size="16" /></Button></template>
+            <button v-else class="fdl-crop-choose" type="button" :aria-label="zh ? '选择图片' : 'Choose image'" @click="input?.click()"><Upload :size="40" aria-hidden="true" /></button>
+          </div>
+          <div class="fdl-crop-preview-pane" :aria-label="zh ? '裁剪预览' : 'Crop preview'"><div ref="preview" class="fdl-crop-preview" /></div>
+        </div>
+        <p v-if="error" role="alert">{{ zh ? '无法读取或裁剪图片' : 'Unable to read or crop image' }}</p>
+        <DialogFooter class="fdl-crop-footer"><Button type="button" variant="outline" @click="emit('cancel')">{{ zh ? '取消' : 'Cancel' }}</Button><Button type="button" :disabled="!ready || exporting || error" @click="apply">{{ zh ? '上传' : 'Upload' }}</Button></DialogFooter>
+        <input ref="input" type="file" accept="image/*" hidden @change="select">
+      </div>
+    </DialogContent>
+  </Dialog>
+</template>
diff --git a/app/components/MarkdownLinkControls.vue b/app/components/MarkdownLinkControls.vue
new file mode 100644
index 00000000..e5eaea3d
--- /dev/null
+++ b/app/components/MarkdownLinkControls.vue
@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import { getMarkRange, type Editor } from '@tiptap/core'
+import { ExternalLink, Pencil, Unlink } from 'lucide-vue-next'
+import { PopoverRoot, PopoverAnchor, PopoverPortal, PopoverContent } from 'reka-ui'
+import { Button } from './ui/button'
+import type { toolbarLabels } from '~/lib/markdown-editor-ui'
+const props = defineProps<{ editor: Editor, enabled: boolean, labels: typeof toolbarLabels.en }>()
+const emit = defineEmits<{ edit: [] }>()
+const target = shallowRef<HTMLAnchorElement>()
+const href = ref('')
+const open = ref(false)
+let dismissed = false
+let restoreOnClose = false
+let frame = 0
+let editorElement: HTMLElement | undefined
+function sync() {
+  const editor = props.editor
+  if (!props.enabled || !editor.isEditable || !editor.isActive('link') || dismissed) { open.value = false; return }
+  const { $from, to } = editor.state.selection
+  const range = getMarkRange($from, editor.schema.marks.link!, editor.getAttributes('link'))
+  if (!range || to > range.to) { open.value = false; return }
+  const node = editor.view.domAtPos(range.from, 1).node
+  const anchor = (node instanceof HTMLElement ? node : node.parentElement)?.closest('a')
+  if (!anchor || !editor.view.dom.contains(anchor)) { open.value = false; return }
+  target.value = anchor
+  href.value = anchor.getAttribute('href') ?? ''
+  open.value = !!href.value && (editor.isFocused || open.value)
+}
+function schedule() { cancelAnimationFrame(frame); frame = requestAnimationFrame(sync) }
+function selection() { dismissed = false; schedule() }
+function dismiss() { dismissed = true; open.value = false }
+function edit() { dismiss(); emit('edit') }
+function unlink() {
+  dismiss()
+  props.editor.chain().focus(undefined, { scrollIntoView: false }).extendMarkRange('link').unsetLink().run()
+}
+function escape(event: KeyboardEvent) { event.preventDefault(); event.stopPropagation(); restoreOnClose = !props.editor.isFocused; dismiss() }
+function closeFocus(event: Event) {
+  event.preventDefault()
+  if (restoreOnClose && props.enabled) props.editor.view.focus()
+  restoreOnClose = false
+}
+function outside(event: Event) {
+  const original = (event as CustomEvent<{ originalEvent: Event }>).detail.originalEvent
+  // Selection updates decide which link is active when clicking in the editor.
+  if (original.target instanceof Node && props.editor.view.dom.contains(original.target)) event.preventDefault()
+}
+watch(() => props.enabled, value => { if (!value) dismiss(); else { dismissed = false; schedule() } })
+onMounted(() => {
+  editorElement = props.editor.view.dom
+  props.editor.on('selectionUpdate', selection)
+  props.editor.on('transaction', schedule)
+  props.editor.on('focus', schedule)
+  editorElement.addEventListener('pointerup', selection)
+})
+onBeforeUnmount(() => {
+  cancelAnimationFrame(frame)
+  props.editor.off('selectionUpdate', selection)
+  props.editor.off('transaction', schedule)
+  props.editor.off('focus', schedule)
+  editorElement?.removeEventListener('pointerup', selection)
+})
+</script>
+<template>
+  <PopoverRoot :open="open && enabled" :modal="false" @update:open="value => { if (!value) dismiss() }">
+    <PopoverAnchor :reference="target" as="span" class="sr-only" />
+    <PopoverPortal>
+      <PopoverContent class="fdl-link-controls" :aria-label="labels.linkActions" side="bottom" align="start" :side-offset="6" :collision-padding="8" hide-when-detached @open-auto-focus.prevent @close-auto-focus="closeFocus" @pointer-down-outside="outside" @focus-outside="outside" @escape-key-down="escape">
+        <Button as-child variant="ghost" size="sm" class="fdl-link-destination"><a :href="href" target="_blank" rel="noopener noreferrer" :aria-label="labels.openLink" :title="href"><span>{{ href }}</span><ExternalLink :size="14" /></a></Button>
+        <Button type="button" variant="ghost" size="icon" :aria-label="labels.editLink" :title="labels.editLink" @mousedown.prevent @click="edit"><Pencil :size="14" /></Button>
+        <Button type="button" variant="ghost" size="icon" :aria-label="labels.unlink" :title="labels.unlink" @mousedown.prevent @click="unlink"><Unlink :size="14" /></Button>
+      </PopoverContent>
+    </PopoverPortal>
+  </PopoverRoot>
+</template>
diff --git a/app/components/MarkdownTableControls.vue b/app/components/MarkdownTableControls.vue
new file mode 100644
index 00000000..9651588d
--- /dev/null
+++ b/app/components/MarkdownTableControls.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import type { Editor } from '@tiptap/core'
+import { Minus, Plus, Trash2 } from 'lucide-vue-next'
+const props = defineProps<{ editor: Editor }>()
+const { t } = useI18n()
+const root = ref<HTMLElement>()
+const geometry = ref<{ x: number, y: number, width: number, height: number, rows: number[], cols: number[] }>()
+let host: HTMLElement | null = null
+let table: HTMLTableElement | null = null
+let observer: ResizeObserver | undefined
+let frame = 0
+function measure() {
+  if (!host || !table?.isConnected || !props.editor.view.dom.contains(table)) { geometry.value = undefined; return }
+  const box = table.getBoundingClientRect(), parent = host.getBoundingClientRect()
+  geometry.value = { x: box.left - parent.left + host.scrollLeft, y: box.top - parent.top + host.scrollTop, width: box.width, height: box.height,
+    rows: Array.from(table.rows, row => row.getBoundingClientRect().top - box.top).concat(box.height),
+    cols: Array.from(table.rows[0]?.cells ?? [], cell => cell.getBoundingClientRect().left - box.left).concat(box.width) }
+}
+function schedule() { cancelAnimationFrame(frame); frame = requestAnimationFrame(measure) }
+function track(event: MouseEvent) {
+  const target = event.target as HTMLElement
+  if (root.value?.contains(target)) return
+  const candidate = target.closest('table')
+  if (candidate && props.editor.view.dom.contains(candidate)) { if (table !== candidate) table = candidate; measure() }
+  else if (!props.editor.isActive('table')) { geometry.value = undefined }
+}
+function selection() {
+  const dom = props.editor.view.domAtPos(props.editor.state.selection.from).node
+  const candidate = (dom instanceof HTMLElement ? dom : dom.parentElement)?.closest('table')
+  if (candidate) { table = candidate; schedule() }
+  else { table = null; geometry.value = undefined }
+}
+function selectCell(axis: 'row' | 'column', index: number) {
+  if (!table?.isConnected || !props.editor.isEditable) return false
+  const cell = axis === 'row' ? table.rows[index]?.cells[0] : table.rows[0]?.cells[index]
+  if (!cell) return false
+  props.editor.commands.setTextSelection(props.editor.view.posAtDOM(cell, 0) + 1)
+  return true
+}
+function insert(axis: 'row' | 'column', boundary: number) {
+  const count = axis === 'row' ? table?.rows.length : table?.rows[0]?.cells.length
+  if (!count || !selectCell(axis, Math.min(boundary, count - 1))) return
+  const chain = props.editor.chain().focus(undefined, { scrollIntoView: false })
+  if (axis === 'row') {
+    if (boundary === count) chain.addRowAfter().run()
+    else chain.addRowBefore().run()
+  } else {
+    if (boundary === count) chain.addColumnAfter().run()
+    else chain.addColumnBefore().run()
+  }
+  schedule()
+}
+function remove(axis: 'row' | 'column' | 'table', index = 0) {
+  const selected = { axis, index }
+  if (!selectCell(selected.axis === 'table' ? 'row' : selected.axis, selected.index)) return
+  const chain = props.editor.chain().focus(undefined, { scrollIntoView: false })
+  if (selected.axis === 'table') chain.deleteTable().run()
+  else if (selected.axis === 'row') chain.deleteRow().run()
+  else chain.deleteColumn().run()
+  schedule()
+}
+function leave() { if (!props.editor.isActive('table')) { geometry.value = undefined } }
+onMounted(() => {
+  host = root.value!.parentElement
+  host?.addEventListener('mousemove', track)
+  host?.addEventListener('mouseleave', leave)
+  observer = new ResizeObserver(schedule)
+  observer.observe(props.editor.view.dom)
+  if (host) observer.observe(host)
+  props.editor.on('transaction', schedule)
+  props.editor.on('selectionUpdate', selection)
+  selection()
+})
+onBeforeUnmount(() => {
+  cancelAnimationFrame(frame); observer?.disconnect()
+  host?.removeEventListener('mousemove', track); host?.removeEventListener('mouseleave', leave)
+  props.editor.off('transaction', schedule); props.editor.off('selectionUpdate', selection)
+})
+</script>
+<template>
+  <div ref="root" class="fdl-table-controls">
+    <div v-if="geometry" class="fdl-table-frame" :style="{ '--table-width': `${geometry.width}px`, '--table-height': `${geometry.height}px`, left: `${geometry.x}px`, top: `${geometry.y}px`, width: `${geometry.width}px`, height: `${geometry.height}px` }">
+      <button class="fdl-table-handle corner" type="button" :aria-label="t('markdownEditor.deleteTable')" @mousedown.prevent @click="remove('table')"><Trash2 :size="14" aria-hidden="true" /><span class="fdl-table-tooltip">{{ t('markdownEditor.deleteTable') }}</span></button>
+      <button class="fdl-table-append column" type="button" :aria-label="t('markdownEditor.addColumnAfter')" @mousedown.prevent @click="insert('column', geometry.cols.length - 1)"><Plus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">{{ t('markdownEditor.addColumnAfter') }} →</span></button>
+      <button class="fdl-table-append row" type="button" :aria-label="t('markdownEditor.addRowAfter')" @mousedown.prevent @click="insert('row', geometry.rows.length - 1)"><Plus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">↓ {{ t('markdownEditor.addRowAfter') }}</span></button>
+      <button v-for="(y, index) in geometry.rows.slice(0, -1)" :key="`r${index}`" class="fdl-table-insert row" type="button" :style="{ top: `${y}px` }" :aria-label="`${t('markdownEditor.addRowBefore')} ${index + 1}`" @mousedown.prevent @click="insert('row', index)"><Plus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">↑ {{ t('markdownEditor.insertRowAt', { index: index + 1 }) }}</span></button>
+      <button v-for="(x, index) in geometry.cols.slice(0, -1)" :key="`c${index}`" class="fdl-table-insert column" type="button" :style="{ left: `${x}px` }" :aria-label="`${t('markdownEditor.addColumnBefore')} ${index + 1}`" @mousedown.prevent @click="insert('column', index)"><Plus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">← {{ t('markdownEditor.insertColumnAt', { index: index + 1 }) }}</span></button>
+      <button v-for="(y, index) in geometry.rows.slice(0, -1)" :key="`rh${index}`" class="fdl-table-handle row" type="button" :style="{ top: `${(y + geometry.rows[index + 1]!) / 2}px` }" :aria-label="`${t('markdownEditor.deleteRow')} ${index + 1}`" @mousedown.prevent @click="remove('row', index)"><Minus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">{{ t('markdownEditor.deleteRow') }} {{ index + 1 }}</span></button>
+      <button v-for="(x, index) in geometry.cols.slice(0, -1)" :key="`ch${index}`" class="fdl-table-handle column" type="button" :style="{ left: `${(x + geometry.cols[index + 1]!) / 2}px` }" :aria-label="`${t('markdownEditor.deleteColumn')} ${index + 1}`" @mousedown.prevent @click="remove('column', index)"><Minus :size="12" aria-hidden="true" /><span class="fdl-table-tooltip">{{ t('markdownEditor.deleteColumn') }} {{ index + 1 }}</span></button>
+    </div>
+  </div>
+</template>
diff --git a/app/components/PortalWelcomeBlock.vue b/app/components/PortalWelcomeBlock.vue
index 66b178a3..74080df3 100644
--- a/app/components/PortalWelcomeBlock.vue
+++ b/app/components/PortalWelcomeBlock.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { resolveAttachmentUrls } from '~/utils/attachment'
 
 const localePath = useLocalePath()
 
@@ -9,7 +8,6 @@ const props = defineProps<{
   editable?: boolean
 }>()
 
-const resolvedDescription = computed(() => resolveAttachmentUrls(props.description))
 const hasContent = computed(() => props.title.trim().length > 0 || props.description.trim().length > 0)
 </script>
 
@@ -37,7 +35,7 @@ const hasContent = computed(() => props.title.trim().length > 0 || props.descrip
       </h1>
       <ThemedMdPreview
         v-if="description"
-        :model-value="resolvedDescription"
+        :model-value="description"
         language="en-US"
         class="mt-2"
       />
diff --git a/app/components/ThemedMdEditor.vue b/app/components/ThemedMdEditor.vue
index 212f573c..b24955ee 100644
--- a/app/components/ThemedMdEditor.vue
+++ b/app/components/ThemedMdEditor.vue
@@ -1,21 +1,37 @@
 <script setup lang="ts">
-import { MdEditor } from 'md-editor-v3'
-import 'md-editor-v3/lib/style.css'
-
-// Thin forwarding wrapper around md-editor's MdEditor that binds `theme` to the
-// global `<html>.dark` contract, so every editor follows the app theme (incl.
-// live OS changes) without each call site remembering to pass :theme. All other
-// props/listeners flow through via $attrs; v-model and named slots
-// (#defToolbars / #defFooters) are forwarded.
+import { defineComponent, h } from 'vue'
+// Retain the Markdown and slot contract with a separate client editing bundle.
 defineOptions({ inheritAttrs: false })
+const instance = ref<Record<string, (...args: unknown[]) => unknown>>()
+const methods = ['triggerSave', 'focus', 'getSelectedText', 'resetHistory', 'getEditorView', 'setMode']
+defineExpose(Object.fromEntries(methods.map(name => [name, (...args: unknown[]) => instance.value?.[name]?.(...args)])))
 const model = defineModel<string>()
-const theme = useEditorTheme()
+// Keep the engine as the root so caller sizing and scoped styles reach its frame.
+const mounted = ref(false)
+onMounted(() => { mounted.value = true })
+const { t } = useI18n()
+const Loading = defineComponent({
+  inheritAttrs: false,
+  setup(_props, { attrs }) {
+    return () => h('div', {
+      class: ['md-editor fdl-editor-loading flex min-h-[120px] w-full flex-col border border-border bg-background text-muted-foreground', attrs.class],
+      style: [{ height: '500px' }, attrs.style],
+      role: 'status', 'aria-busy': 'true',
+    }, [
+      h('div', { class: 'flex h-10 shrink-0 items-center gap-3 border-b border-border px-3', 'aria-hidden': 'true' },
+        Array.from({ length: 7 }, () => h('span', { class: 'size-4 animate-pulse rounded bg-muted' }))),
+      h('div', { class: 'flex flex-1 items-center justify-center text-sm' }, t('markdownEditor.loading')),
+    ])
+  },
+})
+const Editor = defineAsyncComponent({ loader: () => import('./TiptapMarkdownEditor.client.vue'), loadingComponent: Loading, delay: 0, suspensible: false })
 </script>
 
 <template>
-  <MdEditor v-model="model" :theme="theme" v-bind="$attrs">
+  <Editor v-if="mounted" ref="instance" v-model="model" v-bind="$attrs">
     <template v-for="(_, name) in $slots" #[name]="slotProps">
       <slot :name="name" v-bind="slotProps ?? {}" />
     </template>
-  </MdEditor>
+  </Editor>
+  <Loading v-else v-bind="$attrs" />
 </template>
diff --git a/app/components/ThemedMdPreview.vue b/app/components/ThemedMdPreview.vue
index 1a6a4f1d..cd3d4df1 100644
--- a/app/components/ThemedMdPreview.vue
+++ b/app/components/ThemedMdPreview.vue
@@ -1,14 +1,73 @@
 <script setup lang="ts">
-import { MdPreview } from 'md-editor-v3'
-import 'md-editor-v3/lib/preview.css'
-
-// Read-only counterpart of ThemedMdEditor: forwards everything (incl. the
-// one-way model-value) via $attrs and binds `theme` to the global `<html>.dark`
-// contract so rendered markdown follows the app theme automatically.
-defineOptions({ inheritAttrs: false })
-const theme = useEditorTheme()
+import { renderMarkdown } from '~/lib/markdown-render'
+import '~/assets/css/markdown-content.css'
+const props = withDefaults(defineProps<{
+  modelValue?: string, editorId?: string, language?: string,
+  sanitize?: (html: string) => string,
+  mdHeadingId?: (heading: { text: string, level: number, index: number }) => string,
+}>(), { modelValue: '', editorId: undefined, language: undefined, sanitize: undefined, mdHeadingId: undefined })
+const { t } = useI18n()
+const label = (key: string) => t(`markdownEditor.${key}`, {}, props.language ? { locale: props.language === 'zh-CN' ? 'zh' : 'en' } : {})
+const html = computed(() => renderMarkdown(props.modelValue, props.mdHeadingId, props.sanitize, { collapse: label('collapseCode'), plainText: label('plainText'), copy: label('copyCode') }))
+const feedbackTimers = new Map<HTMLButtonElement, ReturnType<typeof setTimeout>>()
+let disposed = false
+function fallbackCopy(text: string, button: HTMLButtonElement) {
+  const active = document.activeElement as HTMLElement | null
+  const selection = window.getSelection()
+  const ranges = selection ? Array.from({ length: selection.rangeCount }, (_, index) => selection.getRangeAt(index).cloneRange()) : []
+  const input = document.createElement('textarea')
+  input.value = text
+  input.readOnly = true
+  input.style.cssText = 'position:fixed;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none'
+  ;(button.closest('.fdl-markdown-preview') ?? document.body).append(input)
+  try {
+    input.focus({ preventScroll: true }); input.select()
+    if (!document.execCommand('copy')) throw new Error('Copy unavailable')
+  } finally {
+    input.remove()
+    if (selection) {
+      selection.removeAllRanges()
+      for (const range of ranges) if (range.commonAncestorContainer.isConnected) selection.addRange(range)
+    }
+    if (active?.isConnected) active.focus({ preventScroll: true })
+  }
+}
+async function handleCodeAction(event: MouseEvent) {
+  const button = (event.target as Element).closest<HTMLButtonElement>('button.fdl-code-collapse, button.fdl-code-copy')
+  const block = button?.closest('.fdl-code-view')
+  if (!block || !button) return
+  if (button.classList.contains('fdl-code-collapse')) {
+    button.setAttribute('aria-expanded', String(!block.classList.toggle('fdl-code-collapsed')))
+    return
+  }
+  if (button.getAttribute('aria-busy') === 'true') return
+  const text = block.querySelector('pre code')?.textContent ?? ''
+  let copied = false
+  button.setAttribute('aria-busy', 'true')
+  try {
+    try {
+      if (!navigator.clipboard?.writeText) throw new Error('Clipboard API unavailable')
+      await navigator.clipboard.writeText(text)
+    } catch { fallbackCopy(text, button) }
+    copied = true
+  } catch { /* Keep the code selectable if copying is unavailable. */ }
+  if (disposed || !button.isConnected) return
+  button.removeAttribute('aria-busy')
+  button.textContent = label(copied ? 'copiedCode' : 'copyCodeFailed')
+  clearTimeout(feedbackTimers.get(button))
+  feedbackTimers.set(button, setTimeout(() => {
+    if (button.isConnected) button.textContent = label('copyCode')
+    feedbackTimers.delete(button)
+  }, 2000))
+}
+onBeforeUnmount(() => { disposed = true; for (const timer of feedbackTimers.values()) clearTimeout(timer); feedbackTimers.clear() })
 </script>
-
 <template>
-  <MdPreview :theme="theme" v-bind="$attrs" />
+  <div :id="editorId" class="fdl-markdown-preview" @click="handleCodeAction">
+    <div class="md-editor-preview-wrapper">
+      <!-- HTML passes through the shared server/client sanitizer. -->
+      <!-- eslint-disable-next-line vue/no-v-html -->
+      <div class="md-editor-preview default-theme" v-html="html" />
+    </div>
+  </div>
 </template>
diff --git a/app/components/TiptapMarkdownEditor.client.vue b/app/components/TiptapMarkdownEditor.client.vue
new file mode 100644
index 00000000..04e9ce0b
--- /dev/null
+++ b/app/components/TiptapMarkdownEditor.client.vue
@@ -0,0 +1,419 @@
+<script setup lang="ts">
+import { defineComponent, h, render, shallowRef } from 'vue'
+import { Select, SelectTrigger, SelectContent, SelectItem, SelectValue } from '~/components/ui/select'
+import { createMarkdownCodeView, type CodeLanguageControl } from '~/lib/markdown-code-view'
+import MarkdownAddressDialog from './MarkdownAddressDialog.vue'
+import MarkdownEditorShell from './MarkdownEditorShell.vue'
+import { toolbarFormats, toolbarLabels, createMarkdownToolbarOverflow, normalizeMarkdownClipboard, type UploadImgCallBack } from '~/lib/markdown-editor-ui'
+import { EditorContent, useEditor } from '@tiptap/vue-3'
+import { Extension } from '@tiptap/core'
+import type { Mark } from '@tiptap/pm/model'
+import { Plugin, Selection } from '@tiptap/pm/state'
+import { history } from '@tiptap/pm/history'
+import { Placeholder } from '@tiptap/extensions'
+import MarkdownTableControls from './MarkdownTableControls.vue'
+import MarkdownLinkControls from './MarkdownLinkControls.vue'
+import { createMarkdownManager, loadMarkdown, markdownExtensions, requiresSourcePreservation, parseMarkdownDocument, serializeMarkdown, withinMarkdownLimit } from '~/lib/markdown-editor'
+import { markdownImage } from '~/utils/attachment'
+import { writingAffordances } from '~/lib/markdown-writing'
+import { markdownSelection, restoreMarkdownSelection, mapTextOffset, projectMarkdownDraft } from '~/lib/markdown-selection'
+import '~/assets/css/markdown-content.css'
+import '~/assets/css/markdown-editor.css'
+
+defineOptions({ inheritAttrs: false })
+const props = withDefaults(defineProps<{
+  modelValue?: string, placeholder?: string, language?: string,
+  toolbars?: readonly (string | number)[], footers?: readonly (string | number)[],
+  maxLength?: number, readOnly?: boolean, disabled?: boolean, preview?: boolean,
+  sanitize?: (html: string) => string,
+  onUploadImg?: (files: File[], callback: UploadImgCallBack) => void | Promise<void>,
+  onOnUploadImg?: (files: File[], callback: UploadImgCallBack) => void | Promise<void>,
+}>(), { modelValue: '', placeholder: '', language: 'en-US', toolbars: () => [], footers: undefined, maxLength: undefined, sanitize: undefined, onUploadImg: undefined, onOnUploadImg: undefined })
+const emit = defineEmits<{ 'update:modelValue': [value: string], onChange: [value: string], onSave: [value: string, html: Promise<string>], onFocus: [event: FocusEvent], onBlur: [event: FocusEvent] }>()
+const theme = useEditorTheme()
+const { t } = useI18n()
+const localize = (key: string) => t(`markdownEditor.${key}`, {}, { locale: props.language === 'zh-CN' ? 'zh' : 'en' })
+const shell = ref<InstanceType<typeof MarkdownEditorShell>>()
+const manager = createMarkdownManager()
+let loaded = loadMarkdown(props.modelValue, manager)
+const source = ref(props.modelValue)
+const buffer = ref(props.modelValue)
+const sourceOnly = ref(loaded.sourceOnly)
+const locked = computed(() => props.disabled || props.readOnly)
+const error = ref('')
+const addressKind = ref<'link' | 'image'>()
+const address = ref('')
+const description = ref('')
+const labels = computed(() => toolbarLabels[props.language === 'zh-CN' ? 'zh' : 'en'])
+function openAddress(kind: 'link' | 'image') {
+  if (kind === 'link' && editor.value?.isActive('link')) editor.value.commands.extendMarkRange('link')
+  preparedDoc = editor.value?.state.doc
+  addressKind.value = kind
+  address.value = kind === 'link' ? editor.value?.getAttributes('link').href ?? '' : ''
+  description.value = editor.value?.state.doc.textBetween(editor.value.state.selection.from, editor.value.state.selection.to, ' ') ?? ''
+  buffer.value = source.value
+}
+function cancelAddress() { addressKind.value = undefined; preparedDoc = undefined }
+function restoreFocus() { if (sourceOnly.value) shell.value?.focus(); else editor.value?.view.focus() }
+function confirmAddress() {
+  if (!address.value.trim() || !editor.value || locked.value) return
+  if (preparedDoc && preparedDoc !== editor.value.state.doc) { error.value = localize('staleInsertion'); addressKind.value = undefined; return }
+  if (addressKind.value === 'image') editor.value.chain().focus().setImage({ src: address.value.trim(), alt: description.value }).run()
+  else {
+    const text = description.value || address.value.trim()
+    const { from, to } = editor.value.state.selection
+    if (from !== to && text === editor.value.state.doc.textBetween(from, to, ' ')) editor.value.chain().focus().setLink({ href: address.value.trim() }).run()
+    else editor.value.chain().focus().insertContent({ type: 'text', text, marks: [{ type: 'link', attrs: { href: address.value.trim() } }] }).run()
+  }
+  addressKind.value = undefined
+  preparedDoc = undefined
+}
+let preferredMode: 'structured' | 'source' = 'structured'
+let syncing = false
+let epoch = 0
+let disposed = false
+let toolbarOverflow: ReturnType<typeof createMarkdownToolbarOverflow> | undefined
+let preparedDoc: object | undefined
+let sourceHistoryBody = props.modelValue
+let modeTransition = 0
+let visualSelection: { source: string, doc: object, selection: Selection, marks: readonly Mark[] | null, anchor: number, head: number } | undefined
+let pendingSourceDraft: { source: string, value: string, from: number, to: number, active: boolean } | undefined
+function sourceBuffer() {
+  return sourceOnly.value && pendingSourceDraft?.active && pendingSourceDraft.source === source.value ? pendingSourceDraft.value : source.value
+}
+
+function publish(value: string) {
+  source.value = value
+  buffer.value = value
+  emit('update:modelValue', value)
+  emit('onChange', value)
+}
+const limitGuard = Extension.create({
+  name: 'markdownLengthLimit',
+  addProseMirrorPlugins() {
+    return [new Plugin({ filterTransaction(transaction) {
+      if (!transaction.docChanged || syncing) return true
+      const valid = withinMarkdownLimit(serializeMarkdown(transaction.doc.toJSON(), loaded, manager), source.value, props.maxLength)
+      error.value = valid ? '' : localize('tooLong')
+      return valid
+    } })]
+  },
+})
+const languageControls = new WeakMap<HTMLElement, ReturnType<typeof shallowRef<Parameters<CodeLanguageControl>[1]>>>()
+const codeView = createMarkdownCodeView((host, state) => {
+  if (!state) { render(null, host); languageControls.delete(host); return }
+  const existing = languageControls.get(host)
+  if (existing) { existing.value = state; return }
+  const selected = shallowRef(state)
+  languageControls.set(host, selected)
+  // Keep one Vue tree per node; transactions update it after ProseMirror finishes.
+  render(h(defineComponent({ setup: () => {
+    let languageChanged = false
+    return () => {
+      const state = selected.value
+      return h(Select, {
+        modelValue: state.value, disabled: state.disabled,
+        'onUpdate:modelValue': value => { if (typeof value === 'string') { languageChanged = true; state.onChange(value) } },
+      }, { default: () => [
+        h(SelectTrigger, { class: 'fdl-code-language', size: 'sm', 'aria-label': state.label, title: state.label }, { default: () => h(SelectValue, {}, { default: () => state.options.find(option => option.value === state.value)?.label }) }),
+        h(SelectContent, { class: 'max-h-72', onCloseAutoFocus: (event: Event) => { if (languageChanged) { event.preventDefault(); languageChanged = false; editor.value?.view.focus() } } }, {
+          default: () => state.options.map(option => h(SelectItem, { key: option.value, value: option.value }, { default: () => option.label })),
+        }),
+      ] })
+    }
+  } })), host)
+})
+const editor = useEditor({
+  content: loaded.json, editable: !locked.value && !sourceOnly.value,
+  extensions: [...markdownExtensions(codeView), Placeholder.configure({ placeholder: () => props.placeholder }), writingAffordances(), limitGuard],
+  editorProps: {
+    transformPastedHTML: html => normalizeMarkdownClipboard(html).html,
+    attributes: { class: 'md-editor-preview default-theme fdl-editor-content', role: 'textbox', 'aria-multiline': 'true', 'aria-label': props.placeholder, 'data-code-language': localize('codeLanguage'), 'data-code-plain-text': localize('plainText'), 'data-code-collapse': localize('collapseCode') },
+    handleKeyDown(_view, event) {
+      if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 'k' && props.toolbars.includes('link') && !locked.value) { event.preventDefault(); openAddress('link'); return true }
+      if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 's') { event.preventDefault(); shell.value?.triggerSave(); return true }
+      return false
+    },
+    handlePaste(view, event) {
+      if (locked.value) return true
+      const files = Array.from(event.clipboardData?.files ?? []).filter(file => file.type.startsWith('image/'))
+      if (files.length) { void upload(files, urls => insertUploaded(urls)); return true }
+      if (view.state.selection.$from.parent.type.spec.code) return false
+      const text = event.clipboardData?.getData('text/plain') ?? ''
+      if (!text) return false
+      const html = event.clipboardData?.getData('text/html')
+      if (html && !normalizeMarkdownClipboard(html).preferText) return false
+      if (requiresSourcePreservation(text)) view.dispatch(view.state.tr.insertText(text))
+      else {
+        const json = parseMarkdownDocument(text, manager)
+        // A whole-document paste should not introduce Markdown spacing or rewrite
+        // bare URLs before the user has made any edits, just like opening a file.
+        if (view.state.doc.childCount === 1 && view.state.doc.firstChild?.type.name === 'paragraph' && !view.state.doc.firstChild.content.size) {
+          loaded = { source: text, json, sourceOnly: false }
+        }
+        editor.value?.commands.insertContent(json)
+      }
+      return true
+    },
+    handleDrop(view, event) {
+      const files = Array.from(event.dataTransfer?.files ?? []).filter(file => file.type.startsWith('image/'))
+      if (!files.length) return false
+      if (!locked.value) {
+        const hit = view.posAtCoords({ left: event.clientX, top: event.clientY })
+        if (hit) view.dispatch(view.state.tr.setSelection(Selection.near(view.state.doc.resolve(hit.pos))))
+        void upload(files, urls => insertUploaded(urls))
+      }
+      return true
+    },
+  },
+  onFocus({ event }) { emit('onFocus', event) },
+  onBlur({ event }) { emit('onBlur', event) },
+  onCreate({ editor: instance }) { loaded.json = instance.getJSON(); scheduleToolbarSync() },
+  onTransaction() { scheduleToolbarSync() },
+  onUpdate({ editor: instance }) {
+    if (syncing || sourceOnly.value) return
+    publish(serializeMarkdown(instance.getJSON(), loaded, manager))
+  },
+})
+let toolbarSyncPending = false
+function scheduleToolbarSync() {
+  if (toolbarSyncPending || disposed) return
+  toolbarSyncPending = true
+  nextTick(() => { toolbarSyncPending = false; if (!disposed) syncToolbarState() })
+}
+const activeFormats = ref<string[]>([])
+const headingLevel = ref(0)
+function syncToolbarState() {
+  headingLevel.value = sourceOnly.value ? 0 : [1, 2, 3, 4, 5, 6].find(level => editor.value?.isActive('heading', { level })) ?? 0
+  activeFormats.value = sourceOnly.value ? [] : Object.keys(toolbarFormats).filter(key => editor.value?.isActive(toolbarFormats[key]!))
+}
+watch([sourceOnly, () => props.language], () => { scheduleToolbarSync(); toolbarOverflow?.refresh() }, { flush: 'post' })
+function handleCommand(key: string, value?: number) {
+  if (sourceOnly.value || locked.value || !editor.value) return
+  const instance = editor.value
+  if (key === 'link' || key === 'image') { openAddress(key); return }
+  const commands: Record<string, () => unknown> = {
+    paragraph: () => instance.commands.setParagraph(),
+    title: () => instance.commands.setHeading({ level: (value ?? 2) as 1 | 2 | 3 | 4 | 5 | 6 }),
+    table: () => instance.commands.insertTable({ rows: Math.floor((value ?? 303) / 100), cols: (value ?? 303) % 100, withHeaderRow: true }),
+    codeRow: () => instance.commands.toggleCode(), code: () => instance.commands.toggleCodeBlock(),
+    quote: () => instance.commands.toggleBlockquote(), unorderedList: () => instance.commands.toggleBulletList(),
+    orderedList: () => instance.commands.toggleOrderedList(), task: () => instance.commands.toggleTaskList(),
+    bold: () => instance.commands.toggleBold(), italic: () => instance.commands.toggleItalic(),
+    strikeThrough: () => instance.commands.toggleStrike(), revoke: () => instance.commands.undo(), next: () => instance.commands.redo(),
+  }
+  commands[key]?.()
+  instance.view.focus()
+}
+function syncSource() {
+  const view = shell.value?.getEditorView()
+  const value = sourceBuffer()
+  if (!view || view.state.doc.toString() === value) return
+  syncing = true
+  view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: value } })
+  syncing = false
+}
+function applySource(value: string) {
+  if (syncing || locked.value || !sourceOnly.value) return
+  if (sourceOnly.value && pendingSourceDraft) {
+    if (value === pendingSourceDraft.value) {
+      pendingSourceDraft.active = true
+      if (source.value !== pendingSourceDraft.source) publish(pendingSourceDraft.source)
+      buffer.value = pendingSourceDraft.value
+      return
+    }
+  }
+  if (value === source.value) {
+    if (pendingSourceDraft) pendingSourceDraft.active = false
+    buffer.value = value; return
+  }
+  if (!withinMarkdownLimit(value, source.value, props.maxLength)) { buffer.value = sourceBuffer(); error.value = localize('tooLong'); nextTick(syncSource); return }
+  if (sourceOnly.value) { if (pendingSourceDraft) pendingSourceDraft.active = false; publish(value); return }
+}
+async function setMode(mode: 'structured' | 'source') {
+  if (props.disabled || !editor.value) return
+  const instance = editor.value
+  toolbarOverflow?.close()
+  const transition = ++modeTransition
+  const documentEpoch = epoch
+  const wasSource = sourceOnly.value
+  const enteringSource = mode === 'source' && !wasSource
+  const enteringVisual = mode === 'structured' && wasSource
+  let sourceSelection: { from: number, to: number } | undefined
+  const sourceCaret = wasSource ? shell.value?.getEditorView()?.state.selection.main : undefined
+  const resetSourceHistory = enteringSource && source.value !== sourceHistoryBody
+  if (enteringSource) {
+    visualSelection = { source: source.value, doc: instance.state.doc, selection: instance.state.selection, marks: instance.state.storedMarks, anchor: 0, head: 0 }
+    const normalized = manager.serialize(instance.getJSON())
+    const mapped = markdownSelection(instance, manager)
+    const pending = instance.state.selection.empty && !!instance.state.storedMarks?.length && mapped.source !== normalized
+    const targetSource = pending ? projectMarkdownDraft(normalized, mapped.source, source.value) : source.value
+    const from = mapTextOffset(mapped.source, targetSource, mapped.from)
+    const to = mapTextOffset(mapped.source, targetSource, mapped.to)
+    const backward = instance.state.selection.anchor > instance.state.selection.head
+    sourceSelection = { from: backward ? to : from, to: backward ? from : to }
+    if (pending) pendingSourceDraft = { source: source.value, value: targetSource, ...sourceSelection, active: true }
+    visualSelection.anchor = sourceSelection.from
+    visualSelection.head = sourceSelection.to
+  }
+  if (wasSource) sourceHistoryBody = source.value
+  addressKind.value = undefined
+  shell.value?.togglePreviewOnly(false)
+  error.value = ''
+  if (enteringVisual) {
+    const current = serializeMarkdown(instance.getJSON(), loaded, manager)
+    if (loaded.sourceOnly || current !== source.value) {
+      const next = loadMarkdown(source.value, manager)
+      if (next.sourceOnly) { error.value = t('markdownEditor.unsupportedStructured'); return }
+      syncing = true
+      instance.commands.setContent(next.json, { emitUpdate: false })
+      instance.unregisterPlugin('history'); instance.registerPlugin(history())
+      loaded = { ...next, json: instance.getJSON() }
+      syncing = false
+    }
+    const unchanged = visualSelection?.source === source.value && visualSelection.doc === instance.state.doc
+    if (unchanged && (!sourceCaret || (sourceCaret.anchor === visualSelection!.anchor && sourceCaret.head === visualSelection!.head))) {
+      instance.view.dispatch(instance.state.tr.setSelection(visualSelection!.selection).setStoredMarks(visualSelection!.marks))
+    } else if (sourceCaret) {
+      const toBody = (offset: number) => pendingSourceDraft?.active
+        ? mapTextOffset(pendingSourceDraft.value, pendingSourceDraft.source, offset)
+        : offset
+      restoreMarkdownSelection(instance, manager, source.value, toBody(sourceCaret.anchor), toBody(sourceCaret.head))
+    }
+    pendingSourceDraft = undefined
+    visualSelection = undefined
+  }
+  preferredMode = mode
+  sourceOnly.value = mode === 'source'
+  buffer.value = sourceBuffer()
+  preparedDoc = undefined
+  instance.setEditable(!locked.value && !sourceOnly.value, false)
+  instance.commands.command(() => true)
+  await nextTick()
+  if (transition !== modeTransition || documentEpoch !== epoch || disposed) return
+  findTargets()
+  if (enteringSource) syncSource()
+  if (resetSourceHistory || (enteringSource && pendingSourceDraft)) shell.value?.resetHistory()
+  const view = shell.value?.getEditorView()
+  if (sourceSelection && view) {
+    syncing = true
+    view.dispatch({ selection: { anchor: sourceSelection.from, head: sourceSelection.to }, scrollIntoView: true })
+    syncing = false
+  }
+  view?.requestMeasure()
+  await nextTick()
+  if (transition !== modeTransition || documentEpoch !== epoch || disposed) return
+  syncToolbarState()
+  if (sourceOnly.value) view?.focus()
+  else instance.view.focus()
+}
+watch(() => props.modelValue, value => {
+  if (value === source.value) return
+  shell.value?.dismissDialogs()
+  addressKind.value = undefined
+  pendingSourceDraft = undefined; visualSelection = undefined
+  modeTransition++; epoch++; sourceHistoryBody = value; preparedDoc = undefined; error.value = ''; source.value = value; buffer.value = value
+  loaded = loadMarkdown(value, manager)
+  sourceOnly.value = preferredMode === 'source' || loaded.sourceOnly
+  if (editor.value) {
+    syncing = true
+    editor.value.commands.setContent(loaded.json, { emitUpdate: false })
+    editor.value.unregisterPlugin('history'); editor.value.registerPlugin(history())
+    editor.value.view.dispatch(editor.value.state.tr.setSelection(Selection.atEnd(editor.value.state.doc)).setStoredMarks(null))
+    loaded.json = editor.value.getJSON()
+    editor.value.setEditable(!locked.value && !sourceOnly.value, false)
+    syncing = false
+  }
+  nextTick(() => {
+    // Synchronize external replacements after the source surface updates.
+    syncSource()
+    shell.value?.resetHistory()
+  })
+})
+watch(locked, value => { editor.value?.setEditable(!value && !sourceOnly.value, false); editor.value?.commands.command(() => true) })
+watch([() => props.placeholder, () => props.language], ([placeholder]) => {
+  editor.value?.setOptions({ editorProps: { attributes: { ...editor.value.options.editorProps.attributes, 'aria-label': placeholder, 'data-code-language': localize('codeLanguage'), 'data-code-plain-text': localize('plainText'), 'data-code-collapse': localize('collapseCode') } } })
+  editor.value?.commands.command(() => true)
+})
+async function upload(files: File[], callback: UploadImgCallBack) {
+  const handler = props.onOnUploadImg ?? props.onUploadImg
+  if (locked.value || !handler) { error.value = localize('uploadUnavailable'); return }
+  error.value = ''
+  const currentEpoch = epoch
+  try {
+    await handler(files, urls => {
+      if (disposed || epoch !== currentEpoch || locked.value) return
+      if (!urls.length) { error.value = localize('uploadFailed'); return }
+      // Insert at the current caret after any intervening typing.
+      callback(urls)
+    })
+  } catch (cause) {
+    if (!disposed && epoch === currentEpoch && !locked.value) error.value = localize(cause instanceof Error && cause.message === 'partialUpload' ? 'partialUpload' : 'uploadFailed')
+  }
+}
+function handleUpload(files: File[]) { void upload(files, insertUploaded) }
+function handleSave(_value: string, html: Promise<string>) { emit('onSave', source.value, html) }
+function sourceFocus(event: FocusEvent) { if (sourceOnly.value) emit('onFocus', event) }
+function sourceBlur(event: FocusEvent) { if (sourceOnly.value) emit('onBlur', event) }
+function insertUploaded(urls: Parameters<UploadImgCallBack>[0]) {
+  if (!urls.length) return
+  if (sourceOnly.value) {
+    shell.value?.insert(() => ({
+      targetValue: urls.map(item => {
+        const image: { url: string, alt?: string, title?: string } = typeof item === 'string' ? { url: item } : item
+        return markdownImage({ src: image.url, alt: image.alt, title: image.title }) + '\n'
+      }).join(''),
+      select: false,
+    }))
+    return
+  }
+  const images = urls.map(item => ({ type: 'image', attrs: typeof item === 'string' ? { src: item } : { src: item.url, alt: item.alt, title: item.title } }))
+  editor.value?.chain().focus().insertContent(images).run()
+  preparedDoc = undefined
+}
+function findTargets() {
+  const root = shell.value?.$el
+  if (!(root instanceof HTMLElement)) return
+  if (root.querySelector('.md-editor-toolbar')) {
+    if (!toolbarOverflow?.toolbar.isConnected) {
+      toolbarOverflow?.destroy()
+      toolbarOverflow = createMarkdownToolbarOverflow(root, () => localize('moreTools'), () => shell.value?.closeToolbarMenu())
+    }
+    toolbarOverflow.refresh()
+  } else { toolbarOverflow?.destroy(); toolbarOverflow = undefined }
+  scheduleToolbarSync()
+}
+onMounted(() => { findTargets() })
+watch(() => props.toolbars, () => nextTick(findTargets), { deep: true })
+onBeforeUnmount(() => { disposed = true; epoch++; toolbarOverflow?.destroy(); editor.value?.destroy() })
+defineExpose({
+  setMode, getEditorView: () => shell.value?.getEditorView(),
+  focus: () => sourceOnly.value ? shell.value?.focus() : editor.value?.commands.focus(),
+  getSelectedText: () => sourceOnly.value ? shell.value?.getSelectedText() : editor.value?.state.doc.textBetween(editor.value.state.selection.from, editor.value.state.selection.to, '\n'),
+  triggerSave: () => shell.value?.triggerSave(),
+  resetHistory: () => { shell.value?.resetHistory(); if (editor.value) { editor.value.unregisterPlugin('history'); editor.value.registerPlugin(history()) } },
+})
+</script>
+<template>
+  <MarkdownEditorShell
+    ref="shell" v-bind="$attrs" :model-value="buffer" :structured="!sourceOnly" :theme="theme" :language="language" :placeholder="placeholder"
+    :toolbars="toolbars" :footers="footers" :active-formats="activeFormats" :heading-level="headingLevel" :read-only="readOnly" :disabled="disabled" :sanitize="sanitize"
+    @update:model-value="applySource" @command="handleCommand" @mode-change="setMode" @upload-images="handleUpload" @restore-focus="restoreFocus"
+    @on-save="handleSave"
+    @on-focus="sourceFocus" @on-blur="sourceBlur"
+  >
+    <template #visual>
+      <div class="fdl-editor-scroll fdl-rich-scroll">
+        <EditorContent class="fdl-editor-mount" :editor="editor" />
+        <MarkdownLinkControls v-if="editor && toolbars.includes('link')" :editor="editor" :enabled="!sourceOnly && !locked && !addressKind" :labels="labels" @edit="openAddress('link')" />
+        <MarkdownTableControls v-if="editor && toolbars.includes('table') && !locked" :editor="editor" />
+      </div>
+    </template>
+    <template #defToolbars><slot name="defToolbars" /></template>
+    <template #defFooters><slot name="defFooters" /></template>
+    <template #overlays>
+      <MarkdownAddressDialog v-model:description="description" v-model:address="address" :open="!!addressKind" :title="addressKind === 'image' ? labels.image : labels.link" :labels="labels" :disabled="locked" @cancel="cancelAddress" @confirm="confirmAddress" @restore-focus="restoreFocus" />
+      <p v-if="error" class="fdl-editor-message text-destructive" role="alert">{{ error }}</p>
+    </template>
+  </MarkdownEditorShell>
+</template>
diff --git a/app/components/WidgetEmbed/WidgetEmbedMarkdown.vue b/app/components/WidgetEmbed/WidgetEmbedMarkdown.vue
index 17eb16a8..5bf0ecbc 100644
--- a/app/components/WidgetEmbed/WidgetEmbedMarkdown.vue
+++ b/app/components/WidgetEmbed/WidgetEmbedMarkdown.vue
@@ -6,9 +6,13 @@ function sanitize(html: string) {
   const fragment = DOMPurify.sanitize(html, {
     USE_PROFILES: { html: true },
     ADD_ATTR: ['target'],
-    FORBID_TAGS: ['style', 'form', 'input', 'button'],
+    FORBID_TAGS: ['style', 'form', 'input'],
     RETURN_DOM_FRAGMENT: true,
   })
+  fragment.querySelectorAll('button').forEach(button => {
+    if (!button.matches('.fdl-code-copy, .fdl-code-collapse') || !button.closest('.md-editor-code-head')) button.remove()
+    else button.type = 'button'
+  })
   // Links must not replace the iframe and leave the customer outside the chat.
   fragment.querySelectorAll('a[href]').forEach(link => {
     link.setAttribute('target', '_blank')
diff --git a/app/components/changelog/ChangelogEditor.vue b/app/components/changelog/ChangelogEditor.vue
index cfa3da47..4dceb2c5 100644
--- a/app/components/changelog/ChangelogEditor.vue
+++ b/app/components/changelog/ChangelogEditor.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
-import { NormalToolbar } from 'md-editor-v3'
 import '~/assets/css/md-editor-preview.css'
-import { sanitizeAttachmentHtml, resolveAttachmentUrl } from '~/utils/attachment'
+import { resolveAttachmentUrl } from '~/utils/attachment'
 import { toast } from 'vue-sonner'
 
 const props = defineProps<{
@@ -466,20 +465,18 @@ function handleAiApply(result: ChangelogAiResult) {
                 :preview="false"
                 :max-length="20000"
                 :footers="['markdownTotal']"
-                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', '-', 'previewOnly', '=', 0]"
-                :sanitize="sanitizeAttachmentHtml"
+                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', 'table', '-', 'previewOnly', '=', 0]"
+
                 style="height: 100%"
                 @on-upload-img="onUploadImg"
               >
                 <template #defToolbars>
-                  <NormalToolbar :title="$t('changelog.editor.aiWrite')" @on-click="showAiModal = true">
-                    <template #trigger>
-                      <div class="inline-flex h-7 items-center gap-1.5 rounded-md border border-purple-200 bg-purple-50 px-2.5 text-xs font-bold text-purple-600 transition-colors hover:bg-purple-100 dark:border-purple-500/30 dark:bg-purple-500/20 dark:text-purple-400">
-                        <Icon name="lucide:wand-2" size="14" />
-                        {{ $t('changelog.editor.aiWrite') }}
-                      </div>
-                    </template>
-                  </NormalToolbar>
+                  <button type="button" :title="$t('changelog.editor.aiWrite')" @click="showAiModal = true">
+                    <div class="inline-flex h-7 items-center gap-1.5 rounded-md border border-purple-200 bg-purple-50 px-2.5 text-xs font-bold text-purple-600 transition-colors hover:bg-purple-100 dark:border-purple-500/30 dark:bg-purple-500/20 dark:text-purple-400">
+                      <Icon name="lucide:wand-2" size="14" />
+                      {{ $t('changelog.editor.aiWrite') }}
+                    </div>
+                  </button>
                 </template>
               </ThemedMdEditor>
             </div>
diff --git a/app/components/comment/CommentContent.vue b/app/components/comment/CommentContent.vue
index 2cca9bb1..7f1881b5 100644
--- a/app/components/comment/CommentContent.vue
+++ b/app/components/comment/CommentContent.vue
@@ -1,22 +1,18 @@
 <script setup lang="ts">
-import { computed } from 'vue'
-import { resolveAttachmentUrls } from '~/utils/attachment'
 
-const props = defineProps<{
+defineProps<{
   content: string
 }>()
-
-const resolvedContent = computed(() => resolveAttachmentUrls(props.content))
 </script>
 
 <template>
   <div class="comment-content">
-    <ThemedMdPreview :model-value="resolvedContent" language="en-US" />
+    <ThemedMdPreview :model-value="content" language="en-US" />
   </div>
 </template>
 
 <style scoped>
-/* Remove MdPreview default container styling */
+/* Keep preview surfaces flush with the surrounding content. */
 .comment-content :deep(.md-editor) {
   border: none;
   background: transparent;
diff --git a/app/components/comment/CommentEditor.vue b/app/components/comment/CommentEditor.vue
index 8bb48ea8..6e2090d9 100644
--- a/app/components/comment/CommentEditor.vue
+++ b/app/components/comment/CommentEditor.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { sanitizeAttachmentHtml } from '~/utils/attachment'
 
 const props = withDefaults(defineProps<{
   parentId?: string
@@ -27,7 +26,8 @@ const isEditing = computed(() => !!props.initialContent)
 const showNotify = computed(() => props.canNotify && !isReply.value && !isEditing.value)
 const submitDisabled = computed(() => !content.value.trim() || props.loading)
 
-const { onUploadImg } = useUploadImg()
+const { ensureIdentity } = useGuestSession()
+const { onUploadImg } = useUploadImg(() => ensureIdentity('allowComment'))
 
 // Footer: '=' pushes slot content to the right, 0 = first defFooters child
 const footers = ['=', 0] as const
@@ -55,8 +55,8 @@ defineExpose({ clear })
       :placeholder="placeholder || (isReply ? $t('post.comment.replyPlaceholder') : $t('post.comment.addPlaceholder'))"
       :preview="false"
       :max-length="5000"
-      :toolbars="['bold', 'italic', '-', 'link', 'unorderedList', 'code', 'codeRow', 'image']"
-      :sanitize="sanitizeAttachmentHtml"
+      :toolbars="['bold', 'italic', '-', 'link', 'unorderedList', 'code', 'codeRow', 'table', 'image']"
+
       :footers="footers"
       :style="{ height: 'auto', minHeight: isReply ? '120px' : '160px' }"
       @on-upload-img="onUploadImg"
@@ -134,7 +134,7 @@ defineExpose({ clear })
 </template>
 
 <style scoped>
-/* Override MdEditor's monospace font to match project's body font */
+/* Match source editing to the surrounding comment typography. */
 .comment-editor :deep(.cm-editor),
 .comment-editor :deep(.cm-editor .cm-content),
 .comment-editor :deep(.cm-editor .cm-line),
@@ -156,10 +156,6 @@ defineExpose({ clear })
   border: 1px solid var(--border);
 }
 
-/* Hide MdEditor's custom scrollbar, use browser native on CodeMirror */
-.comment-editor :deep(.md-editor-custom-scrollbar__track) {
-  display: none !important;
-}
 .comment-editor :deep(.cm-scroller) {
   overflow-y: auto !important;
   scrollbar-width: thin;
diff --git a/app/components/help/HelpArticleEditor.vue b/app/components/help/HelpArticleEditor.vue
index 74a9d57d..d22e91b5 100644
--- a/app/components/help/HelpArticleEditor.vue
+++ b/app/components/help/HelpArticleEditor.vue
@@ -32,6 +32,7 @@ const props = defineProps<{ articleId?: string; collectionId?: string }>()
 
 const { t, locale } = useI18n()
 const { confirm } = useConfirmDialog()
+const { onUploadImg } = useUploadImg()
 const router = useRouter()
 const localePath = useLocalePath()
 
@@ -357,7 +358,7 @@ function goBack() {
           <p class="mb-2.5 mt-3 text-[11px] font-bold uppercase leading-[17px] tracking-[.05em] text-muted-foreground">
             {{ $t('help.admin.editor.body') }}<span aria-hidden="true" class="ml-0.5 text-destructive">*</span>
           </p>
-          <div ref="bodyField" class="help-editor-body">
+          <div ref="bodyField" class="help-editor-body help-article-styled">
             <ClientOnly>
               <ThemedMdEditor
                 v-model="form.content"
@@ -366,8 +367,9 @@ function goBack() {
                 :placeholder="$t('help.admin.editor.bodyPlaceholder')"
                 :preview="false"
                 :footers="['markdownTotal']"
-                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', '=', 0]"
+                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', 'table', '=', 0]"
                 class="help-editor-input"
+                @on-upload-img="onUploadImg"
               />
             </ClientOnly>
             <p v-if="errors.content" role="alert" class="mt-2 text-xs text-destructive">{{ $t('help.admin.editor.contentRequired') }}</p>
diff --git a/app/components/post/PostContent.vue b/app/components/post/PostContent.vue
index 1ea1e9e9..3f8c8046 100644
--- a/app/components/post/PostContent.vue
+++ b/app/components/post/PostContent.vue
@@ -1,22 +1,18 @@
 <script setup lang="ts">
-import { computed } from 'vue'
-import { resolveAttachmentUrls } from '~/utils/attachment'
 
-const props = defineProps<{
+defineProps<{
   content: string
 }>()
-
-const resolvedContent = computed(() => resolveAttachmentUrls(props.content))
 </script>
 
 <template>
   <div class="post-content">
-    <ThemedMdPreview :model-value="resolvedContent" language="en-US" />
+    <ThemedMdPreview :model-value="content" language="en-US" />
   </div>
 </template>
 
 <style scoped>
-/* Remove MdPreview default container styling */
+/* Keep preview surfaces flush with the surrounding content. */
 .post-content :deep(.md-editor) {
   border: none;
   background: transparent;
diff --git a/app/components/post/PostDetail.vue b/app/components/post/PostDetail.vue
index e158a905..c7502584 100644
--- a/app/components/post/PostDetail.vue
+++ b/app/components/post/PostDetail.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import '~/assets/css/md-editor-preview.css'
 import { toast } from 'vue-sonner'
-import { sanitizeAttachmentHtml } from '~/utils/attachment';
 const localePath = useLocalePath()
 
 // Event types for post mutations
@@ -410,7 +409,7 @@ async function handleShare() {
               <div class="space-y-4">
                 <Input v-model="editTitle" class="h-10 text-lg font-heading font-bold" :placeholder="$t('post.detail.titlePlaceholder')" :maxlength="200" />
                 <div class="editor-preview-styled">
-                  <ThemedMdEditor v-model="editContent" language="en-US" :placeholder="$t('post.detail.editPlaceholder')" :preview="false" :max-length="10000" :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', '-', 'previewOnly']" :sanitize="sanitizeAttachmentHtml" :style="{ height: '280px' }" @on-upload-img="onUploadImg" />
+                  <ThemedMdEditor v-model="editContent" language="en-US" :placeholder="$t('post.detail.editPlaceholder')" :preview="false" :max-length="10000" :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', 'table', '-', 'previewOnly']" :style="{ height: '280px' }" @on-upload-img="onUploadImg" />
                 </div>
                 <p v-if="editError" class="text-sm text-destructive">{{ editError }}</p>
                 <div class="flex items-center gap-3 justify-end">
diff --git a/app/components/post/PostDetailModal.vue b/app/components/post/PostDetailModal.vue
index a6777485..4fe5f918 100644
--- a/app/components/post/PostDetailModal.vue
+++ b/app/components/post/PostDetailModal.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 
 import type { PostUpdatedEvent } from './PostDetail.vue'
-import { preventShadcnDialogClose } from '~/lib/md-editor-helper';
 
 const props = defineProps<{
   slug?: string | null
@@ -27,13 +26,10 @@ watch(open, (isOpen) => {
 </script>
 
 <template>
-  <!-- Keep non-modal so md-editor/medium-zoom overlays teleported to body stay interactive -->
   <Dialog v-model:open="open" :modal="true">
     <DialogContent
       :show-close-button="false"
       @open-auto-focus.prevent
-      @pointer-down-outside="preventShadcnDialogClose"
-      @escape-key-down="preventShadcnDialogClose"
       class="!max-w-[1100px] h-[90vh] !p-0 !gap-0 overflow-hidden border-border bg-background !rounded-2xl flex flex-col"
     >
       <!-- Modal header -->
diff --git a/app/components/post/SubmitModal.vue b/app/components/post/SubmitModal.vue
index 145bb4f6..f04a8257 100644
--- a/app/components/post/SubmitModal.vue
+++ b/app/components/post/SubmitModal.vue
@@ -1,7 +1,5 @@
 <script setup lang="ts">
 import '~/assets/css/md-editor-preview.css'
-import { preventShadcnDialogClose } from '~/lib/md-editor-helper';
-import { sanitizeAttachmentHtml } from '~/utils/attachment';
 
 const props = defineProps<{
   defaultBoardId?: string
@@ -13,6 +11,20 @@ const emit = defineEmits<{ created: [slug: string] }>()
 
 const { t, locale } = useI18n()
 
+// Warm the split editor bundle before the dialog's first open.
+let cancelEditorWarmup: (() => void) | undefined
+onMounted(() => {
+  const warm = () => { void import('../TiptapMarkdownEditor.client.vue').catch(() => {}) }
+  if ('requestIdleCallback' in window) {
+    const handle = window.requestIdleCallback(warm, { timeout: 1500 })
+    cancelEditorWarmup = () => window.cancelIdleCallback(handle)
+  } else {
+    const handle = setTimeout(warm, 500)
+    cancelEditorWarmup = () => clearTimeout(handle)
+  }
+})
+onBeforeUnmount(() => cancelEditorWarmup?.())
+
 const boardStore = useBoardStore()
 const { boards } = storeToRefs(boardStore)
 
@@ -33,7 +45,7 @@ const content = ref('')
 const submitting = ref(false)
 const error = ref('')
 
-const { onUploadImg } = useUploadImg()
+const { onUploadImg } = useUploadImg(() => ensureIdentity('allowPost'))
 
 // Similar posts search
 const similarPosts = ref<any[]>([])
@@ -113,8 +125,8 @@ async function handleSubmit() {
     return
   }
 
-  // Where a guest identity is minted, if the org allows one — deliberately here
-  // and not on open, so a visitor who changes their mind leaves nothing behind.
+  // Ensure a guest identity before submitting. An earlier image upload may
+  // already have established it; opening the form alone never creates one.
   // When guest posting is off this opens the sign-in modal instead and the draft
   // waits; that path is reachable from a pre-filled link, where the reporter
   // arrives already holding text worth not throwing away.
@@ -172,12 +184,9 @@ watch(open, (v) => {
 </script>
 
 <template>
-  <!-- Keep non-modal so md-editor overlays teleported to body stay interactive -->
   <Dialog v-model:open="open" :modal="true">
     <DialogContent
       :show-close-button="false"
-      @pointer-down-outside="preventShadcnDialogClose"
-      @escape-key-down="preventShadcnDialogClose"
       class="!max-w-[800px] !max-h-[calc(100vh-1.5rem)] !p-0 !gap-0 !flex !flex-col overflow-hidden border-none bg-card !rounded-[24px] shadow-warm"
     >
       <!-- Close button -->
@@ -224,8 +233,8 @@ watch(open, (v) => {
                 :placeholder="$t('post.submit.bodyPlaceholder')"
                 :preview="false"
                 :max-length="10000"
-                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', '-', 'previewOnly']"
-                :sanitize="sanitizeAttachmentHtml"
+                :toolbars="['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', 'table', '-', 'previewOnly']"
+
                 style="height: 100%"
                 @on-upload-img="onUploadImg"
               />
@@ -279,4 +288,3 @@ watch(open, (v) => {
     @update:open="showDetailSlug = null"
   />
 </template>
-
diff --git a/app/components/ui/dropdown-menu/DropdownMenuRadioItem.vue b/app/components/ui/dropdown-menu/DropdownMenuRadioItem.vue
index e03c40c5..72b4df20 100644
--- a/app/components/ui/dropdown-menu/DropdownMenuRadioItem.vue
+++ b/app/components/ui/dropdown-menu/DropdownMenuRadioItem.vue
@@ -10,11 +10,11 @@ import {
 } from "reka-ui"
 import { cn } from "@/lib/utils"
 
-const props = defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes["class"] }>()
+const props = withDefaults(defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes["class"], indicatorPosition?: "left" | "right" }>(), { indicatorPosition: "left", class: undefined })
 
 const emits = defineEmits<DropdownMenuRadioItemEmits>()
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class", "indicatorPosition")
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits)
 </script>
@@ -25,10 +25,11 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
     v-bind="forwarded"
     :class="cn(
       'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
+      indicatorPosition === 'right' ? 'pr-8 pl-2' : undefined,
       props.class,
     )"
   >
-    <span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+    <span :class="cn('pointer-events-none absolute flex size-3.5 items-center justify-center', indicatorPosition === 'right' ? 'right-2' : 'left-2')">
       <DropdownMenuItemIndicator>
         <slot name="indicator-icon">
           <Circle class="size-2 fill-current" />
diff --git a/app/composables/useAuth.ts b/app/composables/useAuth.ts
index a7c22e18..29be9187 100644
--- a/app/composables/useAuth.ts
+++ b/app/composables/useAuth.ts
@@ -11,6 +11,7 @@ interface AuthSession {
     name: string
     email: string
     image: string | null
+    isAnonymous?: boolean
     role: string | null
   }
   session: {
diff --git a/app/composables/useEditorTheme.ts b/app/composables/useEditorTheme.ts
index cc658cc7..fdae673d 100644
--- a/app/composables/useEditorTheme.ts
+++ b/app/composables/useEditorTheme.ts
@@ -1,16 +1,4 @@
-// Theme ('light'/'dark') for md-editor surfaces, bound to the app's <html>.dark
-// contract but SSR-safe. md-editor stamps a `md-editor-dark` class from this prop,
-// so the value must be identical at SSR and first client (hydration) render —
-// otherwise Vue logs a class mismatch on every SSR'd preview (portal welcome /
-// post / comment bodies).
-//
-// The live <html>.dark can differ between SSR and hydration: for `system` mode the
-// no-FOUC inline script flips the class before hydration, and reading the DOM
-// during setup would adopt that flipped value while the server rendered the
-// unflipped one. So until mounted we derive from `mode` — which is hydration-stable
-// (cookie-seeded useState + the SSR-resolved org default) and mirrors the same
-// rule app.vue uses for the server <html> class. After mount we adopt the live DOM
-// state so the editor still tracks switcher changes and live OS-theme flips.
+// Follow the application theme for the client-only editor shell.
 export function useEditorTheme() {
   const { mode } = useThemeMode()
   const documentDark = useDocumentDark()
diff --git a/app/composables/useUploadImg.ts b/app/composables/useUploadImg.ts
index 3645fccf..4bcea81d 100644
--- a/app/composables/useUploadImg.ts
+++ b/app/composables/useUploadImg.ts
@@ -1,7 +1,9 @@
-// Shared onUploadImg handler for md-editor-v3
-export function useUploadImg() {
+// Shared image upload handler for the Markdown editor.
+export function useUploadImg(beforeUpload?: () => boolean | Promise<boolean>) {
   async function onUploadImg(files: File[], callback: (urls: string[]) => void) {
+    if (!files.length || (beforeUpload && !await beforeUpload())) return
     const urls: string[] = []
+    let failed = false
 
     for (const file of files) {
       const formData = new FormData()
@@ -12,13 +14,15 @@ export function useUploadImg() {
           method: 'POST',
           body: formData,
         })
+        if (typeof result.key !== 'string' || !result.key.trim()) throw new Error('Missing uploaded image key')
         urls.push(`attachment:${result.key}`)
       } catch {
-        // skip failed uploads silently — editor will show empty image
+        failed = true
       }
     }
 
-    callback(urls)
+    if (urls.length) callback(urls)
+    if (failed) throw new Error(urls.length ? 'partialUpload' : 'uploadFailed')
   }
 
   return { onUploadImg }
diff --git a/app/lib/markdown-code-view.ts b/app/lib/markdown-code-view.ts
new file mode 100644
index 00000000..63b0cfab
--- /dev/null
+++ b/app/lib/markdown-code-view.ts
@@ -0,0 +1,104 @@
+import type { NodeViewRenderer } from '@tiptap/core'
+
+const plainLanguages = new Set(['', 'text', 'txt', 'plain', 'plaintext'])
+function isPlainLanguage(value: string) { return plainLanguages.has(value.toLowerCase()) }
+
+const languageNames: Record<string, string> = {
+  javascript: 'JavaScript', typescript: 'TypeScript', jsx: 'JSX', tsx: 'TSX', json: 'JSON',
+  html: 'HTML', css: 'CSS', scss: 'SCSS', vue: 'Vue', bash: 'Bash', shell: 'Shell',
+  python: 'Python', sql: 'SQL', yaml: 'YAML', toml: 'TOML', xml: 'XML', markdown: 'Markdown',
+  go: 'Go', rust: 'Rust', java: 'Java', kotlin: 'Kotlin', c: 'C', cpp: 'C++', csharp: 'C#',
+  ruby: 'Ruby', php: 'PHP', swift: 'Swift', dockerfile: 'Dockerfile', diff: 'Diff',
+}
+const languageAliases: Record<string, string> = { js: 'javascript', ts: 'typescript', py: 'python', sh: 'shell', yml: 'yaml', md: 'markdown', 'c++': 'cpp', 'c#': 'csharp' }
+export function codeLanguageName(value: string, plainText: string) {
+  const key = value.toLowerCase()
+  return isPlainLanguage(key) ? plainText : languageNames[languageAliases[key] ?? key] ?? value
+}
+export type CodeLanguageControl = (host: HTMLElement, state: {
+  value: string, label: string, disabled: boolean, options: { value: string, label: string }[],
+  onChange: (value: string) => void,
+} | null) => void
+
+// The editable node and public renderer share code-frame classes and styling.
+export function createMarkdownCodeView(renderLanguage: CodeLanguageControl): NodeViewRenderer {
+  return ({ node, editor, getPos }) => {
+    let current = node
+    const dom = document.createElement('div')
+    dom.className = 'md-editor-code fdl-code-view'
+    const head = document.createElement('div')
+    head.className = 'md-editor-code-head'
+    head.contentEditable = 'false'
+    const flags = document.createElement('div')
+    flags.className = 'md-editor-code-flag'
+    for (let index = 0; index < 3; index++) flags.append(document.createElement('span'))
+    const actions = document.createElement('div')
+    actions.className = 'fdl-code-actions'
+    const language = document.createElement('div')
+    const onChange = (value: string) => {
+      if (!editor.isEditable) return
+      const pos = getPos()
+      if (typeof pos !== 'number') return
+      editor.view.dispatch(editor.state.tr.setNodeMarkup(pos, undefined, { ...current.attrs, language: value === 'plaintext' ? null : value }))
+    }
+    const editorAttributes = editor.options.editorProps.attributes
+    const collapse = document.createElement('button')
+    collapse.type = 'button'
+    collapse.className = 'fdl-code-collapse'
+    const chevron = document.createElement('span')
+    chevron.className = 'fdl-code-chevron'
+    chevron.setAttribute('aria-hidden', 'true')
+    collapse.append(chevron)
+    collapse.setAttribute('aria-label', typeof editorAttributes === 'object' ? editorAttributes['data-code-collapse'] || 'Collapse or expand code' : 'Collapse or expand code')
+    collapse.setAttribute('aria-expanded', 'true')
+    collapse.addEventListener('mousedown', event => event.preventDefault())
+    collapse.addEventListener('click', () => {
+      const collapsed = dom.classList.toggle('fdl-code-collapsed')
+      collapse.setAttribute('aria-expanded', String(!collapsed))
+    })
+    actions.append(language, collapse)
+    head.append(flags, actions)
+    const body = document.createElement('div')
+    body.className = 'fdl-code-body'
+    const numbers = document.createElement('div')
+    numbers.className = 'fdl-code-lines'
+    numbers.contentEditable = 'false'
+    numbers.setAttribute('aria-hidden', 'true')
+    const pre = document.createElement('pre')
+    const code = document.createElement('code')
+    pre.append(code)
+    body.append(numbers, pre)
+    dom.append(head, body)
+    const refresh = () => {
+      const attributes = editor.options.editorProps.attributes
+      const labels = typeof attributes === 'object' ? attributes : {}
+      collapse.setAttribute('aria-label', labels['data-code-collapse'] || 'Collapse or expand code')
+      const storedLanguage = String(current.attrs.language || '')
+      const key = storedLanguage.toLowerCase()
+      const value = isPlainLanguage(key) ? 'plaintext' : languageAliases[key] ?? key
+      const plainText = labels['data-code-plain-text'] || 'Plain text'
+      const options = Object.entries(languageNames).map(([value, label]) => ({ value, label }))
+      if (value !== 'plaintext' && !options.some(option => option.value === value)) options.push({ value, label: storedLanguage })
+      options.sort((a, b) => a.label.localeCompare(b.label, 'en', { sensitivity: 'base' }))
+      options.unshift({ value: 'plaintext', label: plainText })
+      renderLanguage(language, { value, label: labels['data-code-language'] || 'Code language', disabled: !editor.isEditable, options, onChange })
+      numbers.textContent = current.textContent.split('\n').map((_, index) => index + 1).join('\n')
+    }
+    refresh()
+    editor.on('transaction', refresh)
+    return {
+      dom, contentDOM: code,
+      update(next) { if (next.type !== current.type) return false; current = next; refresh(); return true },
+      ignoreMutation(mutation) { return mutation.type !== 'selection' && !code.contains(mutation.target) && mutation.target !== code },
+      stopEvent(event) { return head.contains(event.target as Node) },
+      destroy() { editor.off('transaction', refresh); renderLanguage(language, null) },
+    }
+  }
+}
+
+// Server-safe markup: code and language remain escaped literal text.
+export function markdownCodeBlock(text: string, language: string, labels: { collapse: string, plainText: string, copy?: string }) {
+  const escape = (value: string) => value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;')
+  const numbers = text.split('\n').map((_, index) => index + 1).join('\n')
+  return `<div class="md-editor-code fdl-code-view"><div class="md-editor-code-head"><div class="md-editor-code-flag" aria-hidden="true"><span></span><span></span><span></span></div><div class="fdl-code-actions"><span class="fdl-code-language-label">${escape(codeLanguageName(language, labels.plainText))}</span><button type="button" class="fdl-code-copy" aria-live="polite">${escape(labels.copy ?? 'Copy')}</button><button type="button" class="fdl-code-collapse" aria-label="${escape(labels.collapse)}" aria-expanded="true"><span class="fdl-code-chevron" aria-hidden="true"></span></button></div></div><div class="fdl-code-body"><div class="fdl-code-lines" aria-hidden="true">${numbers}</div><pre><code>${escape(text)}</code></pre></div></div>\n`
+}
diff --git a/app/lib/markdown-editor-ui.ts b/app/lib/markdown-editor-ui.ts
new file mode 100644
index 00000000..d318df80
--- /dev/null
+++ b/app/lib/markdown-editor-ui.ts
@@ -0,0 +1,183 @@
+export const toolbarFormats: Record<string, string> = {
+  bold: 'bold', italic: 'italic', strikeThrough: 'strike', codeRow: 'code', title: 'heading', link: 'link',
+  quote: 'blockquote', unorderedList: 'bulletList', orderedList: 'orderedList', task: 'taskList', code: 'codeBlock',
+}
+export const toolbarLabels = {
+  en: { bold: 'bold', italic: 'italic', strikeThrough: 'strikethrough', title: 'heading', quote: 'blockquote', unorderedList: 'unordered list', orderedList: 'ordered list', task: 'task list', code: 'block-level code', codeRow: 'inline code', link: 'link', image: 'image', table: 'table', revoke: 'undo', next: 'redo', previewOnly: 'preview only', preview: 'preview', save: 'save', fullscreen: 'fullscreen', pageFullscreen: 'page fullscreen', upload: 'Upload Images', crop: 'Crop And Upload', url: 'Image link', address: 'Enter a link...', description: 'Description', addressLabel: 'URL', paragraph: 'Paragraph', editLink: 'Edit link', unlink: 'Remove link', openLink: 'Open link', linkActions: 'Link actions', ok: 'OK', cancel: 'Cancel', count: 'characters' },
+  zh: { bold: '加粗', italic: '斜体', strikeThrough: '删除线', title: '标题', quote: '引用', unorderedList: '无序列表', orderedList: '有序列表', task: '任务列表', code: '代码块', codeRow: '行内代码', link: '链接', image: '图片', table: '表格', revoke: '撤销', next: '重做', previewOnly: '预览', preview: '预览', save: '保存', fullscreen: '全屏', pageFullscreen: '页面全屏', upload: '上传图片', crop: '裁剪并上传', url: '图片链接', address: '请输入链接...', description: '描述', addressLabel: '地址', paragraph: '正文', editLink: '编辑链接', unlink: '取消链接', openLink: '打开链接', linkActions: '链接操作', ok: '确定', cancel: '取消', count: '字符' },
+}
+export type UploadImage = string | { url: string, alt?: string, title?: string }
+export type UploadImgCallBack = (urls: UploadImage[]) => void
+export type SourceInsertion = { targetValue: string, select?: boolean, deviationStart?: number, deviationEnd?: number }
+
+// External clipboard HTML often contains layout-only paragraphs and emoji images.
+// Preserve semantic formatting; plain text remains authoritative for ordinary prose.
+export function normalizeMarkdownClipboard(html: string): { html: string, preferText: boolean } {
+  const body = new DOMParser().parseFromString(html, 'text/html').body
+  if (body.hasAttribute('data-pm-slice') || body.querySelector('[data-pm-slice]')) return { html, preferText: false }
+  for (const image of body.querySelectorAll('img')) {
+    const alt = image.alt.trim()
+    const emojiText = /\p{Extended_Pictographic}|\p{Regional_Indicator}|\u20e3/u.test(alt)
+      && alt.replace(/\p{Extended_Pictographic}|\p{Regional_Indicator}|\p{Emoji_Modifier}|\u200d|\ufe0e|\ufe0f|[0-9#*]|\u20e3/gu, '') === ''
+    const emojiImage = /(?:^|\s)(?:emoji|twemoji|emojione)(?:\s|$)/i.test(image.className)
+      || /twemoji|notoemoji|emojione|emoji-datasource|\/emojis?\//i.test(image.getAttribute('src') ?? '')
+      || image.hasAttribute('data-emoji')
+    if (emojiText && emojiImage) image.replaceWith(body.ownerDocument.createTextNode(alt))
+  }
+  for (const block of Array.from(body.querySelectorAll('p, div')).reverse()) {
+    // Empty table cells/list items and whitespace inside code have meaning.
+    if (block.closest('pre, code, td, th, li') || block.textContent?.trim()) continue
+    if (!block.querySelector('img, svg, video, iframe, hr, input, table') && block.querySelectorAll('br').length <= 1) block.remove()
+  }
+  const structure = body.querySelector('h1,h2,h3,h4,h5,h6,ul,ol,li,blockquote,pre,code,table,hr,img,figure')
+  const styled = Array.from(body.querySelectorAll('b,strong,em,i,s,del,[style]')).some(element => {
+    const style = (element as HTMLElement).style
+    if (['B', 'STRONG'].includes(element.tagName) && !['normal', '400'].includes(style.fontWeight)) return true
+    return ['EM', 'I', 'S', 'DEL'].includes(element.tagName)
+      || /bold|[6-9]00/.test(style.fontWeight) || style.fontStyle === 'italic' || /line-through/.test(style.textDecoration)
+  })
+  const namedLink = Array.from(body.querySelectorAll('a[href]')).some(link => link.textContent?.trim() !== link.getAttribute('href')?.trim())
+  return { html: body.innerHTML, preferText: !structure && !styled && !namedLink }
+}
+
+// Keep toolbar controls mounted while moving them into responsive overflow.
+export function createMarkdownToolbarOverflow(root: HTMLElement, label: () => string, closeMenus: () => void) {
+  const toolbar = root.querySelector<HTMLElement>('.md-editor-toolbar')!
+  const tools = toolbar.querySelector<HTMLElement>('.md-editor-toolbar-left')!
+  const right = toolbar.querySelector<HTMLElement>('.md-editor-toolbar-right')!
+  const trigger = document.createElement('button')
+  trigger.type = 'button'
+  trigger.className = 'fdl-toolbar-overflow-trigger'
+  trigger.setAttribute('aria-expanded', 'false')
+  const previousId = tools.id
+  tools.id ||= `${root.id}-overflow-tools`
+  trigger.setAttribute('aria-controls', tools.id)
+  const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
+  svg.setAttribute('viewBox', '0 0 24 24')
+  svg.setAttribute('width', '18'); svg.setAttribute('height', '18')
+  svg.setAttribute('aria-hidden', 'true')
+  for (const y of [5, 12, 19]) {
+    const circle = document.createElementNS(svg.namespaceURI, 'circle')
+    circle.setAttribute('cx', '12'); circle.setAttribute('cy', String(y))
+    circle.setAttribute('r', '1.6'); circle.setAttribute('fill', 'currentColor')
+    svg.append(circle)
+  }
+  trigger.append(svg)
+  toolbar.insertBefore(trigger, tools)
+  let collapsed = false
+  let open = false
+  let frame = 0
+  let closeTimer: ReturnType<typeof setTimeout> | undefined
+  const cancelClose = () => { clearTimeout(closeTimer); closeTimer = undefined }
+  const setOpen = (value: boolean) => {
+    cancelClose()
+    open = collapsed && value
+    root.toggleAttribute('data-toolbar-overflow-open', open)
+    trigger.setAttribute('aria-expanded', String(open))
+    tools.inert = collapsed && !open
+    if (!open) {
+      closeMenus()
+    }
+  }
+  const contains = (target: EventTarget | null) => target instanceof Node && (trigger.contains(target) || tools.contains(target) || (target instanceof Element && !!target.closest(`[data-editor-owner="${root.id}"]`)))
+  const menuOpen = () => !!document.querySelector(`[data-editor-owner="${root.id}"][data-state="open"]`)
+  const enter = (event: PointerEvent) => { if (collapsed && event.pointerType !== 'touch') setOpen(true) }
+  const scheduleClose = () => {
+    if (closeTimer) return
+    closeTimer = setTimeout(() => {
+      closeTimer = undefined
+      if (!contains(document.activeElement) && !menuOpen()) setOpen(false)
+    }, 150)
+  }
+  const leave = (event: PointerEvent) => { if (collapsed && open && !contains(event.relatedTarget)) scheduleClose() }
+  const pointermove = (event: PointerEvent) => {
+    if (!collapsed || !open) return
+    if (contains(event.target)) cancelClose()
+    else scheduleClose()
+  }
+  const protectSelection = (event: MouseEvent) => event.preventDefault()
+  const protectToolsSelection = (event: MouseEvent) => {
+    if (collapsed && event.target instanceof Element && !event.target.closest('input, textarea, select, [contenteditable="true"]')) event.preventDefault()
+  }
+  const click = (event: MouseEvent) => {
+    // Mouse hover already opens the tools; clicking must preserve the editor selection.
+    if (event.detail === 0) setOpen(!open)
+    else setOpen(true)
+  }
+  const visibleButtons = () => Array.from(tools.querySelectorAll<HTMLButtonElement>('button:not([disabled])'))
+    .filter(button => button.getBoundingClientRect().width > 0 && getComputedStyle(button).visibility !== 'hidden')
+  const keydown = (event: KeyboardEvent) => {
+    if (event.key === 'Escape' && open) {
+      event.preventDefault(); event.stopPropagation(); setOpen(false); trigger.focus()
+    } else if (event.target === trigger && ['ArrowDown', 'Enter', ' '].includes(event.key)) {
+      event.preventDefault(); setOpen(true); visibleButtons()[0]?.focus()
+    } else if (open && event.target instanceof HTMLElement && ['ArrowRight', 'ArrowLeft'].includes(event.key)) {
+      const buttons = visibleButtons(), index = buttons.indexOf(event.target as HTMLButtonElement)
+      if (index >= 0) {
+        event.preventDefault()
+        buttons[(index + (event.key === 'ArrowRight' ? 1 : buttons.length - 1)) % buttons.length]?.focus()
+      }
+    }
+  }
+  const outside = (event: PointerEvent) => { if (open && !contains(event.target)) setOpen(false) }
+  const focusout = () => {
+    queueMicrotask(() => { if (collapsed && open && !contains(document.activeElement) && !tools.matches(':hover') && !trigger.matches(':hover') && !menuOpen()) setOpen(false) })
+  }
+  const measure = () => {
+    frame = 0
+    trigger.setAttribute('aria-label', label()); trigger.title = label()
+    tools.setAttribute('role', 'toolbar'); tools.setAttribute('aria-label', label())
+    const items = Array.from(tools.children).filter((item): item is HTMLElement => {
+      if (!(item instanceof HTMLElement)) return false
+      const style = getComputedStyle(item)
+      return style.position !== 'absolute' && style.display !== 'none'
+    })
+    const itemWidth = items.reduce((width, item) => {
+      const style = getComputedStyle(item)
+      return width + item.getBoundingClientRect().width + (parseFloat(style.marginLeft) || 0) + (parseFloat(style.marginRight) || 0)
+    }, 0)
+    const toolsWidth = itemWidth + Math.max(0, items.length - 1) * (parseFloat(getComputedStyle(root).getPropertyValue('--fdl-toolbar-gap')) || 2)
+    const available = toolbar.clientWidth - right.getBoundingClientRect().width - (parseFloat(getComputedStyle(toolbar).columnGap) || 0)
+    const next = items.length > 0 && toolsWidth > available + 1
+    if (next !== collapsed) {
+      collapsed = next
+      root.toggleAttribute('data-toolbar-collapsed', collapsed)
+      setOpen(false)
+    }
+  }
+  const refresh = () => { if (!frame) frame = requestAnimationFrame(measure) }
+  const resize = new ResizeObserver(refresh)
+  resize.observe(toolbar); resize.observe(right); resize.observe(tools)
+  trigger.addEventListener('pointerenter', enter)
+  trigger.addEventListener('pointerleave', leave)
+  tools.addEventListener('pointerenter', enter)
+  tools.addEventListener('pointerleave', leave)
+  trigger.addEventListener('mousedown', protectSelection)
+  tools.addEventListener('mousedown', protectToolsSelection)
+  trigger.addEventListener('click', click)
+  trigger.addEventListener('keydown', keydown)
+  tools.addEventListener('keydown', keydown)
+  tools.addEventListener('focusout', focusout)
+  trigger.addEventListener('focusout', focusout)
+  document.addEventListener('pointerdown', outside, true)
+  document.addEventListener('pointermove', pointermove, true)
+  measure()
+  return {
+    toolbar, refresh,
+    close: () => setOpen(false),
+    destroy() {
+      cancelClose(); cancelAnimationFrame(frame); resize.disconnect()
+      document.removeEventListener('pointerdown', outside, true)
+      document.removeEventListener('pointermove', pointermove, true)
+      tools.removeEventListener('pointerenter', enter); tools.removeEventListener('pointerleave', leave)
+      tools.removeEventListener('mousedown', protectToolsSelection)
+      tools.removeEventListener('keydown', keydown); tools.removeEventListener('focusout', focusout)
+      trigger.remove()
+      tools.inert = false
+      tools.id = previousId
+      tools.removeAttribute('role'); tools.removeAttribute('aria-label')
+      root.removeAttribute('data-toolbar-collapsed'); root.removeAttribute('data-toolbar-overflow-open')
+    },
+  }
+}
+
diff --git a/app/lib/markdown-editor.ts b/app/lib/markdown-editor.ts
new file mode 100644
index 00000000..8785fda7
--- /dev/null
+++ b/app/lib/markdown-editor.ts
@@ -0,0 +1,149 @@
+import { getSchema, mergeAttributes, type JSONContent, type NodeViewRenderer } from '@tiptap/core'
+import StarterKit from '@tiptap/starter-kit'
+import Code from '@tiptap/extension-code'
+import CodeBlock from '@tiptap/extension-code-block'
+import { LegacyHtmlImageBlock, supportedFigure, LegacyContainer, LegacyContainerTitle, LegacyAnchor, LegacyFigure, LegacyFigureImage, LegacyCaption, legacyFigurePattern, legacyAnchorPattern, legacyImagePattern, htmlAttributes } from './markdown-legacy-nodes'
+import Image from '@tiptap/extension-image'
+import Link from '@tiptap/extension-link'
+import { TableKit } from '@tiptap/extension-table'
+import { TaskItem, TaskList } from '@tiptap/extension-list'
+import { Markdown, MarkdownManager } from '@tiptap/markdown'
+import { resolveAttachmentUrl, markdownImage, prepareLegacyAttachments } from '../utils/attachment'
+
+// Storage keys are opaque. Resolve them only for the DOM, never in persisted MD.
+export const AttachmentImage = Image.extend({
+  addAttributes() { return { ...this.parent?.(), width: { default: null }, height: { default: null }, html: { default: false, rendered: false } } },
+  markdownTokenizer: {
+    name: 'image', level: 'inline', start: src => src.indexOf('<img'),
+    tokenize(src) { const match = legacyImagePattern.exec(src); if (match) return { type: 'image', raw: match[0], htmlAttrs: htmlAttributes(match[0]) } },
+  },
+  parseMarkdown(token, helpers) {
+    return helpers.createNode('image', token.htmlAttrs ? { ...token.htmlAttrs, html: true } : { src: token.href, alt: token.text || null, title: token.title || null })
+  },
+  renderHTML({ HTMLAttributes }) {
+    const stored = String(HTMLAttributes.src ?? '')
+    const src = stored.startsWith('attachment:')
+      ? resolveAttachmentUrl(stored.slice('attachment:'.length))
+      : /^(https?:\/\/|\/)/i.test(stored) ? stored : null
+    return ['img', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { src })]
+  },
+  renderMarkdown(node) {
+    if (node.attrs?.html) {
+      const escape = (value: unknown) => String(value).replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+      return `<img${['src', 'alt', 'title', 'width', 'height'].filter(key => node.attrs?.[key] != null).map(key => ` ${key}="${escape(node.attrs![key])}"`).join('')}>`
+    }
+    return markdownImage({ src: String(node.attrs?.src ?? ''), alt: node.attrs?.alt, title: node.attrs?.title })
+  },
+}).configure({ inline: true, allowBase64: false })
+
+const MarkdownLink = Link.extend({
+  parseMarkdown(token, helpers) {
+    // Explicit Markdown links (including internationalized URLs) are untouched.
+    // GFM's bare-link lexer may swallow a Chinese sentence after punctuation.
+    if (/^https?:\/\//.test(token.raw ?? '') && /[。，！？；：、]/.test(token.raw ?? '')) {
+      return { type: 'text', text: token.raw }
+    }
+    return helpers.applyMark('link', helpers.parseInline(token.tokens || []), {
+      href: token.href, title: token.title || null,
+    })
+  },
+}).configure({ openOnClick: false, autolink: false, defaultProtocol: 'https' })
+
+const CompatibleCode = Code.extend({ excludes: '' })
+const CompatibleCodeBlock = CodeBlock.extend({
+  renderMarkdown(node) {
+    const text = (node.content ?? []).map(child => child.text ?? '').join('')
+    const longest = Math.max(2, ...(text.match(/`+/g) ?? []).map(run => run.length))
+    const fence = '`'.repeat(longest + 1)
+    return `${fence}${node.attrs?.language ?? ''}\n${text}\n${fence}`
+  },
+})
+
+export function markdownExtensions(codeView?: NodeViewRenderer) {
+  return [
+    StarterKit.configure({ link: false, code: false, codeBlock: false, underline: false, trailingNode: false }),
+    CompatibleCode, codeView ? CompatibleCodeBlock.extend({ addNodeView() { return codeView } }) : CompatibleCodeBlock,
+    LegacyHtmlImageBlock, LegacyContainer, LegacyContainerTitle, LegacyAnchor, LegacyFigure, LegacyFigureImage, LegacyCaption,
+    MarkdownLink,
+    AttachmentImage,
+    TableKit.configure({ table: { resizable: false } }),
+    TaskList,
+    TaskItem.configure({ nested: true }),
+    Markdown.configure({ markedOptions: { gfm: true, breaks: true } }),
+  ]
+}
+
+export function createMarkdownManager() {
+  return new MarkdownManager({
+    extensions: markdownExtensions(), markedOptions: { gfm: true, breaks: true },
+  })
+}
+
+export function parseMarkdownDocument(source: string, manager: MarkdownManager): JSONContent {
+  const json = manager.parse(prepareLegacyAttachments(source))
+  function normalize(node: JSONContent) {
+    // Empty Markdown list items still need an editable paragraph in the schema.
+    if (['listItem', 'taskItem'].includes(node.type ?? '') && !node.content?.length) node.content = [{ type: 'paragraph' }]
+    if (!node.content) return
+    node.content.forEach(normalize)
+    // Marked emits a stand-alone image as a top-level node, whereas our schema
+    // permits inline images to retain surrounding text. Wrap only block parents.
+    if (['doc', 'blockquote', 'listItem', 'taskItem', 'tableCell', 'tableHeader', 'legacyContainer'].includes(node.type ?? '')) {
+      node.content = node.content.map(child => child.type === 'image'
+        ? { type: 'paragraph', content: [child] } : child)
+    }
+  }
+  normalize(json)
+  if (!json.content?.length) json.content = [{ type: 'paragraph' }]
+  return canonicalDocument(json)
+}
+
+/** Preserve unsupported dialects as editable source instead of losing content.
+ * This is a native textarea fallback, not a second rich-text editor. Detection
+ * is deliberately conservative. A false positive is preferable to data loss.
+ */
+export function requiresSourcePreservation(source: string): boolean {
+  const prose = source.replace(/^([ \t]*)(`{3,}|~{3,})[^\n]*\n[\s\S]*?^\1\2[^\n]*$/gm, '')
+    .replace(/(`+)[^\n]*?\1/g, '')
+    .replace(/!\[[^\]\n]*\]\(<attachment:[^\n]*?>\)/g, '')
+  const supported = prose
+    .replace(new RegExp(legacyFigurePattern.source.replace('^', ''), 'g'), match => supportedFigure(match) ? '' : match)
+    .replace(new RegExp(legacyAnchorPattern.source.replace('^', ''), 'g'), '')
+    .replace(new RegExp(legacyImagePattern.source.replace('^', ''), 'g'), '')
+    .replace(/^:::[ \t]*(?:(?:tip|warning|info|danger|details|code-group)(?:[ \t]+[^\n]*)?)?[ \t]*$/gm, '')
+  return /<\/?[A-Za-z!][^>]*>|\[\^[^\]]+\]|^\s*\[[^\]]+\]:|\$\$|\$[^\n$]+\$|^ {0,3}:::(?:[ \t]|$)|==[^\n]+==|(?<!~)~[^~\n]+~(?!~)|\^[^\n^]+\^/m.test(supported)
+}
+
+// ProseMirror canonicalizes mark order and default attributes. Compare that
+// semantic representation rather than incidental parser property/mark ordering.
+export function canonicalDocument(json: JSONContent): JSONContent {
+  return getSchema(markdownExtensions()).nodeFromJSON(json).toJSON()
+}
+
+export type MarkdownDocument = { source: string, json: JSONContent, sourceOnly: boolean }
+
+export function loadMarkdown(source: string, manager: MarkdownManager): MarkdownDocument {
+  if (requiresSourcePreservation(source)) {
+    return { source, json: { type: 'doc', content: [{ type: 'paragraph' }] }, sourceOnly: true }
+  }
+  try {
+    const json = parseMarkdownDocument(source, manager)
+    getSchema(markdownExtensions()).nodeFromJSON(json).check()
+    // Reject an unstable conversion rather than accepting a lossy document.
+    const exported = manager.serialize(json)
+    const reparsed = parseMarkdownDocument(exported, manager)
+    return { source, json, sourceOnly: JSON.stringify(json) !== JSON.stringify(reparsed) }
+  } catch {
+    return { source, json: { type: 'doc', content: [{ type: 'paragraph' }] }, sourceOnly: true }
+  }
+}
+
+/** Retain byte-identical original content on load, selection changes and undo. */
+export function serializeMarkdown(json: JSONContent, loaded: MarkdownDocument, manager: MarkdownManager): string {
+  return JSON.stringify(json) === JSON.stringify(loaded.json) ? loaded.source : manager.serialize(json)
+}
+
+export function withinMarkdownLimit(next: string, previous: string, limit?: number): boolean {
+  // An existing over-limit document must remain readable and reducible.
+  return !limit || next.length <= limit || next.length <= previous.length
+}
diff --git a/app/lib/markdown-legacy-nodes.ts b/app/lib/markdown-legacy-nodes.ts
new file mode 100644
index 00000000..120e2faf
--- /dev/null
+++ b/app/lib/markdown-legacy-nodes.ts
@@ -0,0 +1,151 @@
+import { Extension, Node, mergeAttributes, type JSONContent } from '@tiptap/core'
+
+const escapeHtml = (value: unknown) => String(value ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
+const decodeHtml = (value: string) => value.replace(/&(amp|lt|gt|quot|apos|#39);/g, (_, key: string) => ({ amp: '&', lt: '<', gt: '>', quot: '"', apos: "'", '#39': "'" })[key]!)
+
+export function htmlAttributes(tag: string): Record<string, string> {
+  const attrs: Record<string, string> = {}
+  for (const match of tag.matchAll(/([\w-]+)\s*=\s*(?:"([^"]*)"|'([^']*)')/g)) attrs[match[1]!] = decodeHtml(match[2] ?? match[3] ?? '')
+  return attrs
+}
+
+function inlineHtml(nodes: JSONContent[] = []): string {
+  return nodes.map(node => {
+    if (node.type === 'hardBreak') return '<br>'
+    let text = escapeHtml(node.text)
+    for (const mark of [...(node.marks ?? [])].reverse()) {
+      const tag = { bold: 'strong', italic: 'em', strike: 's', code: 'code' }[mark.type]
+      if (tag) text = `<${tag}>${text}</${tag}>`
+      else if (mark.type === 'link') text = `<a href="${escapeHtml(mark.attrs?.href)}">${text}</a>`
+    }
+    return text
+  }).join('')
+}
+// Captions are HTML text, not Markdown: literal asterisks must stay literal.
+function captionContent(html: string): JSONContent[] | null {
+  const content: JSONContent[] = []
+  const stack: { tag: string, mark: NonNullable<JSONContent['marks']>[number] }[] = []
+  for (const part of html.split(/(<[^>]*>)/g)) {
+    if (!part) continue
+    if (!part.startsWith('<')) { content.push({ type: 'text', text: decodeHtml(part), marks: stack.map(item => item.mark) }); continue }
+    if (/^<br\s*\/?>$/.test(part)) { content.push({ type: 'hardBreak' }); continue }
+    const close = /^<\/(strong|b|em|i|s|del|code|a)>$/.exec(part)
+    if (close) { if (stack.pop()?.tag !== close[1]) return null; continue }
+    const open = /^<(strong|b|em|i|s|del|code)>$/.exec(part)
+    if (open) { stack.push({ tag: open[1]!, mark: { type: ({ strong: 'bold', b: 'bold', em: 'italic', i: 'italic', s: 'strike', del: 'strike', code: 'code' } as Record<string, string>)[open[1]!]! } }); continue }
+    if (/^<a\s+href=(?:"[^"]*"|'[^']*')>$/.test(part)) { stack.push({ tag: 'a', mark: { type: 'link', attrs: { href: htmlAttributes(part).href } } }); continue }
+    return null
+  }
+  return stack.length ? null : content
+}
+
+export const legacyFigurePattern = /^<figure(?:\s+class="[\w -]*")?>\s*(<img\s+[^>]*>)\s*<figcaption>([\s\S]*?)<\/figcaption>\s*<\/figure>/
+export const legacyAnchorPattern = /^<span\s+id=(?:"[^"]*"|'[^']*')><\/span>/
+export const legacyImagePattern = /^<img\s+(?:(?:src|alt|title|width|height)=(?:"[^"]*"|'[^']*')\s*)+\/?>/
+
+export function supportedFigure(source: string): boolean {
+  const match = legacyFigurePattern.exec(source)
+  return !!match && legacyImagePattern.exec(match[1]!)?.[0] === match[1] && captionContent(match[2]!) !== null
+}
+
+export const LegacyHtmlImageBlock = Extension.create({
+  name: 'legacyHtmlImageBlock',
+  markdownTokenizer: {
+    name: 'legacyHtmlImageBlock', level: 'block', start: src => src.search(/^<img\s/m),
+    tokenize(src) { const match = legacyImagePattern.exec(src); if (match) return { type: 'legacyHtmlImageBlock', raw: match[0], attrs: htmlAttributes(match[0]) } },
+  },
+  parseMarkdown(token, helpers) { return helpers.createNode('paragraph', {}, [helpers.createNode('image', { ...token.attrs, html: true })]) },
+})
+
+export const LegacyContainerTitle = Node.create({
+  name: 'legacyContainerTitle', content: 'inline*', defining: true,
+  parseHTML() { return [{ tag: 'p[data-container-title]' }] },
+  renderHTML() { return ['p', { 'data-container-title': '', class: 'fdl-container-title' }, 0] },
+  renderMarkdown(node, helpers) { return helpers.renderChildren(node.content ?? []) },
+})
+
+export const LegacyContainer = Node.create({
+  name: 'legacyContainer', group: 'block', content: 'legacyContainerTitle block+', defining: true,
+  addAttributes() { return { kind: { default: 'tip' } } },
+  parseHTML() { return [{ tag: 'div[data-md-container]', getAttrs: el => ({ kind: el.getAttribute('data-md-container'), title: el.getAttribute('data-title') ?? '' }) }] },
+  renderHTML({ node, HTMLAttributes }) {
+    return ['div', mergeAttributes(HTMLAttributes, { class: 'fdl-legacy-container', 'data-md-container': node.attrs.kind }), 0]
+  },
+  markdownTokenizer: {
+    name: 'legacyContainer', level: 'block', start: src => src.search(/^:::\s*(?:tip|warning|info|danger|details|code-group)\b/m),
+    tokenize(src, _tokens, lexer) {
+      const opening = /^:::\s*(tip|warning|info|danger|details|code-group)(?:[ \t]+([^\n]*))?\r?\n/.exec(src)
+      if (!opening) return
+      let depth = 1
+      let offset = opening[0].length
+      let fence: { char: string, length: number } | undefined
+      for (const line of src.slice(offset).match(/[^\n]*\n|[^\n]+$/g) ?? []) {
+        const marker = /^ {0,3}(`{3,}|~{3,})(.*)/.exec(line)
+        if (fence) {
+          if (marker && marker[1]![0] === fence.char && marker[1]!.length >= fence.length && !marker[2]!.trim()) fence = undefined
+        } else if (marker) fence = { char: marker[1]![0]!, length: marker[1]!.length }
+        else if (/^:::\s*\S/.test(line)) depth++
+        else if (/^:::\s*$/.test(line)) {
+          depth--
+          if (!depth) return { type: 'legacyContainer', raw: src.slice(0, offset + line.length), kind: opening[1], title: opening[2] ?? '', tokens: lexer.blockTokens(src.slice(opening[0].length, offset)) }
+        }
+        offset += line.length
+      }
+    },
+  },
+  parseMarkdown(token, helpers) {
+    const content = helpers.parseChildren(token.tokens ?? [])
+    return helpers.createNode('legacyContainer', { kind: token.kind }, [helpers.createNode('legacyContainerTitle', {}, helpers.parseInline(helpers.tokenizeInline?.(token.title ?? '') ?? [])), ...(content.length ? content : [{ type: 'paragraph' }])])
+  },
+  renderMarkdown(node, helpers) { const title = helpers.renderChildren(node.content?.[0]?.content ?? []); return `::: ${node.attrs?.kind}${title ? ` ${title}` : ''}\n${helpers.renderChildren(node.content?.slice(1) ?? [], '\n\n')}\n:::` },
+})
+
+export const LegacyAnchor = Node.create({
+  name: 'legacyAnchor', group: 'block', atom: true,
+  addAttributes() { return { id: { default: '' } } },
+  parseHTML() { return [{ tag: 'span[id]' }] },
+  renderHTML({ HTMLAttributes }) { return ['span', mergeAttributes(HTMLAttributes, { class: 'fdl-legacy-anchor', contenteditable: 'false' })] },
+  markdownTokenizer: {
+    name: 'legacyAnchor', level: 'block', start: src => src.indexOf('<span'),
+    tokenize(src) { const match = legacyAnchorPattern.exec(src); if (match) return { type: 'legacyAnchor', raw: match[0], id: htmlAttributes(match[0]).id } },
+  },
+  parseMarkdown(token, helpers) { return helpers.createNode('legacyAnchor', { id: token.id }) },
+  renderMarkdown(node) { return `<span id="${escapeHtml(node.attrs?.id)}"></span>` },
+})
+
+export const LegacyCaption = Node.create({
+  name: 'legacyCaption', content: 'inline*', defining: true,
+  parseHTML() { return [{ tag: 'figcaption' }] },
+  renderHTML() { return ['figcaption', 0] },
+  renderMarkdown(node) { return `<figcaption>${inlineHtml(node.content)}</figcaption>` },
+})
+
+export const LegacyFigureImage = Node.create({
+  name: 'legacyFigureImage', atom: true,
+  addAttributes() { return Object.fromEntries(['src', 'alt', 'title', 'width', 'height'].map(key => [key, { default: null }])) },
+  parseHTML() { return [{ tag: 'figure > img' }] },
+  renderHTML({ HTMLAttributes }) {
+    const src = /^(https?:\/\/|\/)/i.test(HTMLAttributes.src ?? '') ? HTMLAttributes.src : null
+    return ['img', mergeAttributes(HTMLAttributes, { src })]
+  },
+  renderMarkdown(node) { return `<img${Object.entries(node.attrs ?? {}).filter(([, value]) => value !== null).map(([key, value]) => ` ${key}="${escapeHtml(value)}"`).join('')}>` },
+})
+
+export const LegacyFigure = Node.create({
+  name: 'legacyFigure', group: 'block', content: 'legacyFigureImage legacyCaption', defining: true,
+  addAttributes() { return { class: { default: null } } },
+  parseHTML() { return [{ tag: 'figure' }] },
+  renderHTML({ HTMLAttributes }) { return ['figure', HTMLAttributes, 0] },
+  markdownTokenizer: {
+    name: 'legacyFigure', level: 'block', start: src => src.indexOf('<figure'),
+    tokenize(src) {
+      const match = legacyFigurePattern.exec(src)
+      if (!match || !supportedFigure(src)) return
+      return { type: 'legacyFigure', raw: match[0], figureClass: htmlAttributes(match[0].split('>')[0]!).class ?? null, image: htmlAttributes(match[1]!), caption: captionContent(match[2]!) }
+    },
+  },
+  parseMarkdown(token, helpers) {
+    return helpers.createNode('legacyFigure', { class: token.figureClass }, [helpers.createNode('legacyFigureImage', token.image), helpers.createNode('legacyCaption', {}, token.caption)])
+  },
+  renderMarkdown(node, helpers) { return `<figure${node.attrs?.class ? ` class="${escapeHtml(node.attrs.class)}"` : ''}>\n${helpers.renderChildren(node.content ?? [], '\n')}\n</figure>` },
+})
diff --git a/app/lib/markdown-render.ts b/app/lib/markdown-render.ts
new file mode 100644
index 00000000..a80747d7
--- /dev/null
+++ b/app/lib/markdown-render.ts
@@ -0,0 +1,96 @@
+import MarkdownIt from 'markdown-it'
+import { markdownCodeBlock } from './markdown-code-view'
+import subscript from 'markdown-it-sub'
+import superscript from 'markdown-it-sup'
+import sanitizeHtml from 'sanitize-html'
+import { resolveAttachmentUrl, prepareLegacyAttachments } from '../utils/attachment'
+
+const parser = new MarkdownIt({ html: true, breaks: true, linkify: true }).use(subscript).use(superscript)
+parser.renderer.rules.fence = (tokens, index, _options, env) => {
+  const token = tokens[index]!
+  return markdownCodeBlock(token.content.replace(/\n$/, ''), token.info.trim().split(/\s+/)[0] ?? '', env.codeLabels)
+}
+parser.renderer.rules.code_block = (tokens, index, _options, env) => markdownCodeBlock(tokens[index]!.content.replace(/\n$/, ''), '', env.codeLabels)
+// Attachment destinations are opaque storage keys, not already-encoded URLs.
+const normalizeLink = parser.normalizeLink.bind(parser)
+parser.normalizeLink = value => value.startsWith('attachment:') ? value : normalizeLink(value)
+configurePreviewContainers(parser)
+// Disabled task checkboxes are presentation, never interactive form inputs.
+parser.core.ruler.after('inline', 'task_lists', state => {
+  for (let index = 2; index < state.tokens.length; index++) {
+    const token = state.tokens[index]!
+    if (token.type !== 'inline' || state.tokens[index - 1]?.type !== 'paragraph_open' || state.tokens[index - 2]?.type !== 'list_item_open') continue
+    const first = token.children?.[0]
+    const match = first?.type === 'text' && /^\[([ xX])\] /.exec(first.content)
+    if (!match || !first) continue
+    first.content = first.content.slice(4)
+    const checkbox = new state.Token('html_inline', '', 0)
+    checkbox.content = `<input type="checkbox" disabled${match[1]!.toLowerCase() === 'x' ? ' checked' : ''}> `
+    token.children!.unshift(checkbox)
+  }
+})
+
+export function renderMarkdown(source: string, headingId?: (heading: { text: string, level: number, index: number }) => string, transform?: (html: string) => string, codeLabels: { collapse: string, plainText: string, copy?: string } = { collapse: 'Collapse or expand code', plainText: 'Plain text' }) {
+  const env = { codeLabels }
+  const tokens = parser.parse(prepareLegacyAttachments(source), env)
+  let index = 0
+  for (let i = 0; i < tokens.length; i++) {
+    const token = tokens[i]!
+    if (token.type === 'heading_open') {
+      const text = tokens[i + 1]?.content ?? ''
+      token.attrSet('id', headingId?.({ text, level: Number(token.tag.slice(1)), index }) ?? `heading-${index}`)
+      index++
+    }
+  }
+  const html = parser.renderer.render(tokens, parser.options, env)
+  // Run consumer transforms before the final safety boundary on both SSR and client.
+  return sanitizeHtml(transform ? transform(html) : html, {
+    allowedTags: [...sanitizeHtml.defaults.allowedTags, 'img', 'figure', 'figcaption', 'details', 'summary', 'input', 'del', 'button'],
+    allowedAttributes: {
+      '*': ['class', 'id', 'data-md-container', 'aria-hidden'], a: ['href', 'title', 'target', 'rel'],
+      button: ['type', 'aria-label', 'aria-expanded', 'aria-live'],
+      img: ['src', 'alt', 'title', 'width', 'height'], input: ['type', 'checked', 'disabled'],
+      th: ['colspan', 'rowspan', 'align'], td: ['colspan', 'rowspan', 'align'], ol: ['start'],
+    },
+    allowedSchemes: ['http', 'https', 'mailto', 'tel'], allowProtocolRelative: false,
+    transformTags: { button: sanitizeHtml.simpleTransform('button', { type: 'button' }), img: (_tag, attrs) => ({ tagName: 'img', attribs: { ...attrs, ...(attrs.src?.startsWith('attachment:') ? { src: resolveAttachmentUrl(attrs.src.slice(11)) ?? '' } : {}) } }), a: sanitizeHtml.simpleTransform('a', { rel: 'noopener noreferrer' }), input: (_tag, attrs) => ({ tagName: 'input', attribs: { type: 'checkbox', disabled: '', ...(Object.hasOwn(attrs, 'checked') ? { checked: '' } : {}) } }) },
+  })
+}
+
+// Parse the same historical container syntax used by the structured editor.
+// Work at block-token level so directives inside fenced code stay literal.
+function configurePreviewContainers(md: MarkdownIt) {
+  md.block.ruler.before('fence', 'legacy_container', (state, start, end, silent) => {
+    const line = (index: number) => state.src.slice(state.bMarks[index]! + state.tShift[index]!, state.eMarks[index])
+    const opening = /^:::\s*(tip|warning|info|danger|details|code-group)(?:[ \t]+(.*))?$/.exec(line(start))
+    if (!opening) return false
+    let depth = 1
+    let stop = start + 1
+    let fence: { char: string, length: number } | undefined
+    for (; stop < end; stop++) {
+      const text = line(stop)
+      const marker = /^ {0,3}(`{3,}|~{3,})(.*)/.exec(text)
+      if (fence) {
+        if (marker && marker[1]![0] === fence.char && marker[1]!.length >= fence.length && !marker[2]!.trim()) fence = undefined
+      } else if (marker) fence = { char: marker[1]![0]!, length: marker[1]!.length }
+      else if (/^:::\s*\S/.test(text)) depth++
+      else if (/^:::\s*$/.test(text) && --depth === 0) break
+    }
+    if (stop === end) return false
+    if (silent) return true
+    const open = state.push('legacy_container_open', 'div', 1)
+    open.attrSet('class', 'fdl-legacy-container')
+    open.attrSet('data-md-container', opening[1]!)
+    open.map = [start, stop + 1]
+    const title = state.push('paragraph_open', 'p', 1)
+    title.attrSet('class', 'fdl-container-title')
+    const inline = state.push('inline', '', 0)
+    inline.content = opening[2] || ''
+    inline.children = []
+    state.push('paragraph_close', 'p', -1)
+    state.md.block.tokenize(state, start + 1, stop)
+    state.push('legacy_container_close', 'div', -1)
+    state.line = stop + 1
+    return true
+  }, { alt: ['paragraph', 'reference', 'blockquote', 'list'] })
+}
diff --git a/app/lib/markdown-selection.ts b/app/lib/markdown-selection.ts
new file mode 100644
index 00000000..279f5b52
--- /dev/null
+++ b/app/lib/markdown-selection.ts
@@ -0,0 +1,107 @@
+import type { Editor } from '@tiptap/core'
+import { diffChars } from 'diff'
+import type { Mark } from '@tiptap/pm/model'
+import { Selection, TextSelection } from '@tiptap/pm/state'
+import type { MarkdownManager } from '@tiptap/markdown'
+import { parseMarkdownDocument } from './markdown-editor'
+
+let markerSequence = 0
+function selectionMarker(source: string, kind: string) {
+  let marker: string
+  do { marker = `FDL${kind}${++markerSequence}END` } while (source.includes(marker))
+  return marker
+}
+
+// Map UTF-16 editor offsets through Markdown normalization without rewriting source.
+export function mapTextOffset(before: string, after: string, offset: number, association = 1) {
+  if (before === after) return Math.max(0, Math.min(offset, after.length))
+  let oldPos = 0, newPos = 0
+  for (const change of diffChars(before, after)) {
+    const length = change.value.length
+    if (change.added) {
+      if (offset === oldPos && association < 0) return newPos
+      newPos += length
+    } else if (change.removed) {
+      if (offset < oldPos + length) return newPos
+      oldPos += length
+    } else {
+      if (offset < oldPos + length || (offset === oldPos + length && association < 0)) return newPos + offset - oldPos
+      oldPos += length; newPos += length
+    }
+  }
+  return newPos
+}
+
+// Apply only pending-format changes to the original source, retaining its spelling.
+export function projectMarkdownDraft(normalized: string, draft: string, original: string) {
+  const edits: { from: number, to: number, insert: string }[] = []
+  let position = 0
+  let edit: typeof edits[number] | undefined
+  for (const change of diffChars(normalized, draft)) {
+    if (!change.added && !change.removed) {
+      if (edit) edits.push(edit)
+      edit = undefined
+      position += change.value.length
+    } else {
+      edit ??= { from: position, to: position, insert: '' }
+      if (change.added) edit.insert += change.value
+      else { position += change.value.length; edit.to = position }
+    }
+  }
+  if (edit) edits.push(edit)
+  let result = original
+  for (const item of edits.reverse()) {
+    const from = mapTextOffset(normalized, original, item.from)
+    const to = item.to === item.from ? from : mapTextOffset(normalized, original, item.to, -1)
+    result = result.slice(0, from) + item.insert + result.slice(Math.max(from, to))
+  }
+  return result
+}
+
+// Mark a disposable document, never the live editor or saved Markdown.
+export function markdownSelection(editor: Editor, manager: MarkdownManager, includePendingMarks = true) {
+  const { from, to } = editor.state.selection
+  const source = manager.serialize(editor.getJSON())
+  if (from === 0 && to === editor.state.doc.content.size) return { source, from: 0, to: source.length }
+  const start = selectionMarker(source, 'START')
+  const end = selectionMarker(source, 'END')
+  try {
+    const transaction = editor.state.tr
+    if (!includePendingMarks) transaction.setStoredMarks(null)
+    if (from === to) {
+      transaction.insertText(start, from)
+      const marked = manager.serialize(transaction.doc.toJSON())
+      const offset = marked.indexOf(start)
+      if (offset >= 0) return { source: marked.replace(start, ''), from: offset, to: offset }
+    }
+    transaction.setStoredMarks(editor.state.doc.resolve(to).marks()).insertText(end, to)
+    transaction.setStoredMarks(editor.state.doc.resolve(from).marks()).insertText(start, from)
+    const marked = manager.serialize(transaction.doc.toJSON())
+    const left = marked.indexOf(start), right = marked.indexOf(end)
+    if (left >= 0 && right >= left) return { source: marked.replace(start, '').replace(end, ''), from: left, to: right - start.length }
+  } catch { /* A selected block has no inline insertion position. */ }
+  return { source, from: source.length, to: source.length }
+}
+
+export function restoreMarkdownSelection(editor: Editor, manager: MarkdownManager, source: string, from: number, to = from) {
+  const position = (offset: number) => {
+    const marker = selectionMarker(source, 'CARET')
+    const json = parseMarkdownDocument(source.slice(0, offset) + marker + source.slice(offset), manager)
+    const document = editor.schema.nodeFromJSON(json)
+    let found: number | undefined
+    let marks: readonly Mark[] = []
+    document.descendants((node, pos) => {
+      if (found !== undefined) return false
+      if (node.isText && node.text?.includes(marker)) { found = pos + node.text.indexOf(marker); marks = node.marks }
+      // A code-language placeholder is syntax, not editable code text.
+      else if (Object.values(node.attrs).some(value => typeof value === 'string' && value.includes(marker))) found = pos + 1
+    })
+    return { position: Math.max(0, Math.min(found ?? editor.state.doc.content.size, editor.state.doc.content.size)), marks }
+  }
+  const start = position(from), end = from === to ? start : position(to)
+  const anchor = start.position, head = end.position
+  const doc = editor.state.doc
+  const selection = doc.resolve(anchor).parent.inlineContent && doc.resolve(head).parent.inlineContent
+    ? TextSelection.create(doc, anchor, head) : Selection.near(doc.resolve(head))
+  editor.view.dispatch(editor.state.tr.setSelection(selection).setStoredMarks(selection.empty ? start.marks : null))
+}
diff --git a/app/lib/markdown-writing.ts b/app/lib/markdown-writing.ts
new file mode 100644
index 00000000..13459f56
--- /dev/null
+++ b/app/lib/markdown-writing.ts
@@ -0,0 +1,39 @@
+import { Extension } from '@tiptap/core'
+import { Plugin, TextSelection } from '@tiptap/pm/state'
+import { Decoration, DecorationSet } from '@tiptap/pm/view'
+
+export function writingAffordances() {
+  return Extension.create({
+    name: 'writingAffordances',
+    addProseMirrorPlugins() {
+      const editor = this.editor
+      return [new Plugin({
+        // A deliberate move out of a block should land in a real writing position.
+        appendTransaction(transactions, _previous, state) {
+          if (!editor.isEditable || !transactions.some(tr => tr.selectionSet) || state.selection.toJSON().type !== 'gapcursor') return null
+          const pos = state.selection.from
+          const paragraph = state.schema.nodes.paragraph
+          if (!paragraph || !state.selection.$from.parent.canReplaceWith(state.selection.$from.index(), state.selection.$from.index(), paragraph)) return null
+          const tr = state.tr.insert(pos, paragraph.create())
+          return tr.setSelection(TextSelection.create(tr.doc, pos + 1)).scrollIntoView()
+        },
+        props: {
+          decorations(state) {
+            const { selection, storedMarks, schema } = state
+            const code = schema.marks.code
+            if (!selection.empty || !code || !storedMarks?.some(mark => mark.type === code)) return null
+            const { nodeBefore, nodeAfter } = selection.$from
+            if ([nodeBefore, nodeAfter].some(node => node?.marks.some(mark => mark.type === code))) return null
+            return DecorationSet.create(state.doc, [Decoration.widget(selection.from, view => {
+              const hint = document.createElement('code')
+              hint.className = 'fdl-pending-code'
+              hint.setAttribute('aria-hidden', 'true')
+              hint.addEventListener('mousedown', event => { event.preventDefault(); view.focus() })
+              return hint
+            }, { side: 1, key: 'pending-inline-code' })])
+          },
+        },
+      })]
+    },
+  })
+}
diff --git a/app/lib/md-editor-helper.ts b/app/lib/md-editor-helper.ts
deleted file mode 100644
index d04273b8..00000000
--- a/app/lib/md-editor-helper.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import { set } from "zod"
-
-const MD_EDITOR_MODAL_WRAPPER_SELECTOR = ".md-editor-modal-container > div"
-const MD_EDITOR_ZOOM_LAYER_SELECTOR = ".medium-zoom-overlay, .medium-zoom-image--opened"
-const MD_EDITOR_EXTERNAL_LAYER_SELECTOR = [
-  ".md-editor-modal-container",
-  ".md-editor-modal-mask",
-  ".md-editor-modal",
-  ".medium-zoom-overlay",
-  ".medium-zoom-image--opened",
-].join(", ")
-
-function hasDom() {
-  return typeof document !== "undefined"
-}
-
-function isVisible(element: Element) {
-  const style = window.getComputedStyle(element)
-  return style.display !== "none" && style.visibility !== "hidden"
-}
-
-export function isMdEditorModalOpen() {
-  if (!hasDom()) return false
-
-  return [...document.querySelectorAll(MD_EDITOR_MODAL_WRAPPER_SELECTOR)].some(isVisible)
-}
-
-export function isMdEditorZoomOpen() {
-  if (!hasDom()) return false
-
-  return document.body.classList.contains("medium-zoom--opened")
-    || !!document.querySelector(MD_EDITOR_ZOOM_LAYER_SELECTOR)
-}
-
-export function isMdEditorModalOrZoomOpen() {
-  return isMdEditorModalOpen() || isMdEditorZoomOpen()
-}
-
-export function preventShadcnDialogClose(e: Event) {
-  if (isMdEditorModalOrZoomOpen()) {
-    e.preventDefault()
-  }
-}
-
-export function isMdEditorExternalLayerTarget(target: EventTarget | null) {
-  if (!hasDom() || !(target instanceof Element)) return false
-
-  return !!target.closest(MD_EDITOR_EXTERNAL_LAYER_SELECTOR)
-}
\ No newline at end of file
diff --git a/app/pages/dashboard/settings/portal.vue b/app/pages/dashboard/settings/portal.vue
index ba5be97f..9ea7730b 100644
--- a/app/pages/dashboard/settings/portal.vue
+++ b/app/pages/dashboard/settings/portal.vue
@@ -6,6 +6,7 @@ import { mergePortalModulesMetadata, resolvePortalModules } from '#layers/feedlo
 definePageMeta({ layout: 'dashboard', middleware: ['admin'] })
 
 const { t } = useI18n()
+const { onUploadImg } = useUploadImg()
 const ctx = useOrgContext()
 const orgId = computed(() => ctx.value.orgId)
 const isOwner = computed(() => ctx.value.role === 'owner')
@@ -46,7 +47,7 @@ async function toggleHelpCenter(value: boolean) {
   }
 }
 
-const toolbars = ['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'code', 'codeRow']
+const toolbars = ['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'code', 'codeRow', 'table']
 
 async function loadOrg() {
   if (!ctx.value.role) return
@@ -172,6 +173,7 @@ async function save() {
                   :disabled="!isOwner"
                   :style="{ height: '220px' }"
                   class="mt-2 !rounded-lg"
+                  @on-upload-img="onUploadImg"
                 />
                 <template #fallback>
                   <div class="mt-2 h-[220px] rounded-lg border border-border bg-background grid place-items-center text-xs text-muted-foreground">{{ $t('settings.portal.loadingEditor') }}</div>
diff --git a/app/plugins/auth-reload.client.ts b/app/plugins/auth-reload.client.ts
index 7b99d32f..56c581ff 100644
--- a/app/plugins/auth-reload.client.ts
+++ b/app/plugins/auth-reload.client.ts
@@ -4,6 +4,8 @@ export default defineNuxtPlugin(() => {
   if (/\/widget\/embed\/?$/.test(window.location.pathname)) return
   const { data: session } = useAuthSession()
   watch(() => session.value?.user?.id, (id, prev) => {
+    // The first guest identity belongs to the current draft, not an account switch.
+    if (!prev && session.value?.user?.isAnonymous) return
     if (id && id !== prev) reloadNuxtApp()
   })
 })
diff --git a/app/plugins/md-editor-config.client.ts b/app/plugins/md-editor-config.client.ts
deleted file mode 100644
index 20b6d47b..00000000
--- a/app/plugins/md-editor-config.client.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { config } from 'md-editor-v3'
-import { resolveAttachmentUrls } from '~/utils/attachment'
-
-export default defineNuxtPlugin(() => {
-  config({
-    codeMirrorExtensions(extensions) {
-      return extensions.filter(ext => ext.type !== 'linkShortener')
-    },
-    markdownItConfig(md) {
-      md.core.ruler.before('normalize', 'resolve_attachments', (state) => {
-        state.src = resolveAttachmentUrls(state.src)
-      })
-    },
-  })
-})
diff --git a/app/types/markdown-plugins.d.ts b/app/types/markdown-plugins.d.ts
new file mode 100644
index 00000000..7b7c2e94
--- /dev/null
+++ b/app/types/markdown-plugins.d.ts
@@ -0,0 +1,10 @@
+declare module 'markdown-it-sub' {
+  import type { PluginSimple } from 'markdown-it'
+  const plugin: PluginSimple
+  export default plugin
+}
+declare module 'markdown-it-sup' {
+  import type { PluginSimple } from 'markdown-it'
+  const plugin: PluginSimple
+  export default plugin
+}
diff --git a/app/utils/attachment.ts b/app/utils/attachment.ts
index 2af316d1..de992e1e 100644
--- a/app/utils/attachment.ts
+++ b/app/utils/attachment.ts
@@ -9,12 +9,6 @@ export function resolveAttachmentUrl(key: string | null | undefined): string | n
   return `/api/files/${encodeKey(key)}`
 }
 
-// A key holds spaces AND parentheses — "Screenshot (1).png" is what every OS
-// calls a duplicate — so the first branch runs to ".ext)" rather than stopping
-// at the first ")". The second is the old rule, for keys with no extension.
-const ATTACHMENT_MD_RE = /(!\[[^\]]*\]\()attachment:(.+?\.[A-Za-z0-9]{2,5}|[^)]+)(\))/g
-const ATTACHMENT_HTML_RE = /(src=["'])attachment:([^"']+)(["'])/g
-
 // encodeURI leaves # ? ( ) alone, and each ends the link early: # and ? start a
 // fragment or query, ) closes the markdown destination.
 function encodeKey(key: string): string {
@@ -25,22 +19,47 @@ function encodeKey(key: string): string {
     .replace(/\)/g, '%29')
 }
 
-/**
- * Replace attachment: protocol URLs in markdown image syntax.
- * For use before passing markdown to MdPreview.
- *
- * e.g. ![alt](attachment:uploads/img.png) → ![alt](/api/files/uploads/img.png)
- */
-export function resolveAttachmentUrls(markdown: string): string {
-  return markdown.replace(ATTACHMENT_MD_RE, (_m, pre, key, post) => `${pre}/api/files/${encodeKey(key)}${post}`)
+// The old uploader emitted destinations containing unescaped spaces. Only fix
+// the known attachment convention; never rewrite normal URLs or code samples.
+export function prepareLegacyAttachments(source: string): string {
+  // A fence remains code through EOF even when the closing fence is absent.
+  // Buffer prose so inline code spans can also cross line boundaries.
+  let fence: { marker: string, length: number } | undefined
+  let prose = ''
+  let result = ''
+  const flush = () => {
+    result += prose.split(/((`+)(?!`)[\s\S]*?(?<!`)\2(?!`))/g)
+      // Captured delimiter groups are not part of the output.
+      .filter((_part, index) => index % 3 !== 2)
+      .map((part, index) => index % 2 ? part : part.replace(
+        /(!\[[^\]\n]*\]\()attachment:([^\n]*?\.[A-Za-z0-9]{2,5})\)/g,
+        (_match, prefix, key) => `${prefix}<attachment:${key}>)`,
+      )).join('')
+    prose = ''
+  }
+  for (const line of source.match(/[^\n]*\n|[^\n]+$/g) ?? []) {
+    const marker = /^ {0,3}(`{3,}|~{3,})(.*?)(?:\r?\n)?$/.exec(line)
+    if (fence) {
+      result += line
+      if (marker && marker[1]![0] === fence.marker && marker[1]!.length >= fence.length && !marker[2]!.trim()) fence = undefined
+    } else if (marker && !(marker[1]![0] === '`' && marker[2]!.includes('`'))) {
+      flush()
+      fence = { marker: marker[1]![0]!, length: marker[1]!.length }
+      result += line
+    } else if (/^(?: {4}|\t)/.test(line)) {
+      flush()
+      result += line
+    } else {
+      prose += line
+    }
+  }
+  flush()
+  return result
 }
 
-/**
- * Replace attachment: protocol URLs in rendered HTML (img src).
- * For use as MdEditor's sanitize prop to handle preview pane.
- *
- * e.g. <img src="attachment:uploads/img.png"> → <img src="/api/files/uploads/img.png">
- */
-export function sanitizeAttachmentHtml(html: string): string {
-  return html.replace(ATTACHMENT_HTML_RE, (_m, pre, key, post) => `${pre}/api/files/${encodeKey(key)}${post}`)
+export function markdownImage(image: { src: string, alt?: string | null, title?: string | null }) {
+  const alt = (image.alt ?? '').replace(/[\\[\]]/g, '\\$&')
+  const title = (image.title ?? '').replace(/[\\"]/g, '\\$&')
+  const destination = /[\s()]/.test(image.src) ? `<${image.src}>` : image.src
+  return `![${alt}](${destination}${title ? ` "${title}"` : ''})`
 }
diff --git a/docs/README.md b/docs/README.md
index 141f9806..58ac8384 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -22,6 +22,10 @@ else — OAuth, AI, file uploads, email — is optional.
 - [`.env.example`](../.env.example) — the same list as an annotated `.env` template you can copy and edit.
 - **[Widget configuration](./widget.md)** — launcher defaults, closing behavior, configuration APIs and host-dialog integration.
 
+## Development
+
+- **[Markdown editor architecture](./markdown-editor.md)** — visual editing, historical content preservation, unchanged entry behavior and deployment verification.
+
 ## Community
 
 - [README](../README.md)
diff --git a/docs/markdown-editor.md b/docs/markdown-editor.md
new file mode 100644
index 00000000..8aac73ec
--- /dev/null
+++ b/docs/markdown-editor.md
@@ -0,0 +1,172 @@
+# Markdown editor
+
+FeedLog uses Tiptap 3 for visual editing and CodeMirror 6 for Markdown source
+editing. The toolbar, mode switch, menus, upload controls and footer belong to
+FeedLog. There is no dependency on a second complete editor or an external editor
+service. Markdown remains the stored body format; API requests, database columns,
+search extraction and embedding inputs are unchanged.
+
+## Ownership
+
+- `ThemedMdEditor.vue` preserves the callers' Markdown model and named slots,
+  loading `TiptapMarkdownEditor.client.vue` asynchronously after client mount.
+  The engine remains the component root so caller sizing and scoped styles reach
+  the actual editor frame.
+- `TiptapMarkdownEditor.client.vue` owns the Tiptap instance, content limits,
+  mode transitions, selection mapping, uploads and stored input marks.
+- `MarkdownEditorShell.vue` owns the toolbar, menus, source CodeMirror instance,
+  mode switch, preview toggle, footer and source commands. Visual commands invoke Tiptap
+  directly, without executing commands against a hidden Markdown editor.
+- `markdown-editor-ui.ts` groups toolbar labels and types, responsive overflow,
+  keyboard navigation. Toolbar menus reuse the shared DropdownMenu components.
+  `MarkdownAddressDialog.vue` shares labeled link/image fields across both modes
+  using the existing Dialog, Input and Button components.
+- `MarkdownLinkControls.vue` reuses Reka Popover and shared Buttons for nearby
+  link actions without moving the writing caret or managing a second selection.
+- `utils/attachment.ts` owns storage-key resolution, historical attachment syntax
+  and Markdown image serialization, shared by editing and preview.
+- `markdown-editor.css` owns the editor frame and interaction styles;
+  `markdown-content.css` owns shared document typography and historical containers.
+- `markdown-editor.ts` defines the schema and Markdown parsing/serialization.
+  `markdown-selection.ts` maps selection through Markdown and original spacing.
+- `markdown-writing.ts` provides empty inline-code affordances and continuation
+  paragraphs after tables and code blocks.
+- `markdown-legacy-nodes.ts` supports historical containers, figures, image
+  dimensions, captions and anchors. `markdown-code-view.ts` provides code language
+  selection and collapse controls, keeping the code itself editable. Its server-safe
+  markup also renders public code blocks; shared document CSS keeps the dark
+  frame, language label, colored header dots, line numbers and typography aligned.
+- `ThemedMdPreview.vue` renders read-only public content using
+  `markdown-render.ts`: Markdown parsing, legacy containers, attachment resolution,
+  heading identifiers and final HTML sanitization. It works on the server and
+  client. No global client plugin is required for preview configuration.
+
+The six editing integrations are help articles, post submission, post editing,
+comments, changelogs and portal welcome content. The changelog AI action is an
+ordinary button in the custom toolbar slot. Native form fields and chat inputs
+are unaffected.
+
+## Behavior
+
+Visual editing is the default for supported content. Source editing exposes the
+original Markdown and uses syntax insertion commands. Both modes share one
+compact toolbar and a neutral mode capsule. Format buttons expose pressed state
+only in visual mode, reflecting the caret, selected text and pending input marks.
+Active and hover states use neutral surfaces rather than saturated brand colors.
+The heading button displays the current H1–H6 level, and the shared radio menu
+marks that level on the right. Menu labels use full localized names without a
+separate H1–H6 prefix. Mixed levels do not claim a single level. Paragraph reset
+remains an ordinary menu action without a selected indicator.
+
+A caret inside a link activates the link button and shows nearby URL, edit and
+unlink actions. The non-modal popover preserves editor focus; Escape, leaving
+the link, source mode and read-only mode dismiss it. Opening the URL uses an
+explicit external-link action. Edit reuses the address dialog, with the full
+anchor text and destination filled in. Updating only the destination preserves
+nested emphasis; unlink keeps the text and its other marks. Visual mode also
+supports Ctrl/Cmd+K for link insertion and editing.
+
+The editor wrapper shows an immediate, localized loading frame while its client
+bundle loads. The feedback dialog warms that bundle during browser idle time
+before its first open; loading preserves caller sizing and prefilled content.
+
+Visual and source surfaces share the body font family; rendered code keeps its
+monospace font. Source mode retains Markdown syntax highlighting.
+
+Portal post and comment image uploads establish a guest identity through the
+existing per-action guest policy before calling the authenticated upload API.
+The first guest identity does not reload the page or discard the current draft;
+account switches still refresh per-user state. Failed or malformed upload
+responses never insert empty content. Partial batches insert successful images
+and report the failures; a retry clears the previous upload error.
+
+External paste uses the clipboard's original text for prose without semantic
+formatting, preserving line breaks and keeping an empty editor's source
+byte-identical until edited. Rich HTML retains marks, lists, links, tables and
+code; layout-only spacer paragraphs are removed. Known emoji images with
+Unicode alt text become characters so mode changes cannot enlarge them.
+Internal ProseMirror clipboard slices, real images, code whitespace and empty
+table/list paragraphs retain their original meaning.
+
+The right-hand mode capsule cannot shrink or wrap. When the toolbar no longer
+fits, its formatting controls collapse into a vertical ellipsis. Hover, click
+and keyboard activation open the controls; Escape closes them and restores focus
+to the trigger. Mode and formatting controls preserve the document selection.
+The same controls remain mounted when the available width changes. The former
+500px default editor height and white/black theme surfaces are retained; caller
+classes and explicit styles control the height in each page.
+
+Mode transitions retain the Tiptap DOM and map the caret or selected range to
+source offsets. Unchanged transitions restore the original selection and stored
+marks. Empty pending emphasis/code delimiters are temporary source drafts and
+are not persisted until the user types content. Backward selections and offsets
+in non-normalized Markdown are retained. Async transitions are discarded after
+an external document replacement or a newer transition.
+
+The original source and canonical document snapshot are retained in memory.
+Opening a document, changing the selection or switching modes does not rewrite
+its Markdown. Undo to the original document restores the original bytes. Actual
+body edits may normalize equivalent Markdown. External model replacements reset
+history so undo cannot revive a previously submitted or different document.
+
+Unsupported or unstable historical syntax is editable in source mode. Attempts
+to enter visual mode show an explanation rather than silently dropping content.
+Ordinary headings, emphasis, lists, tasks, blockquotes, fences, links, images,
+tables, horizontal rules and supported historical containers remain structural.
+Attachment keys stay opaque in storage and resolve only for rendering.
+
+Empty inline code has a one-character orange decoration, without hint text or
+stored placeholder content. New tables have blank cells with the caret in the
+first header cell. Continuation paragraphs allow typing after tables and code
+blocks without a large bottom padding or a custom blank-area click handler.
+Code blocks reuse the shared shadcn Select for language selection and provide a collapse control, without
+an editing-surface copy button. Public and editor previews retain a copy button
+that copies only code, with localized feedback and an HTTP-compatible clipboard
+fallback. Blank language and text/txt/plain/plaintext aliases share one plain-text
+option; opening existing fences does not rewrite their stored language. Language labels use conventional names (JavaScript, TypeScript, C++, C#) in both editing and preview, while saved fences retain Markdown language identifiers.
+
+Image paste/drop and upload menus use the existing asynchronous upload callback.
+Uploads insert at the current caret after any intervening typing. Results are
+ignored after a document replacement, unmount or transition into read-only mode.
+Link/image addresses and image cropping reuse the shared Dialog components for
+focus trapping, Escape/outside dismissal, stacking and focus restoration. The crop
+dialog retains its former 668 × 421 frame, adjustable header, image selection
+inside the dialog, freely resizable crop box and adjacent live preview. Cropper.js
+is a standalone local dependency; the Markdown editor package is not restored.
+Toolbar hover opens and switches menus immediately; ordinary tools dismiss any
+previous menu. There are no hover timers or menu animations. Pointer interaction
+preserves editor focus and selection; keyboard-opened menus retain normal focus
+navigation and Escape restoration. Preview attachment resolution is centralized in the renderer; callers
+do not rewrite Markdown or supply attachment-only HTML callbacks.
+
+Limits apply to persisted Markdown. Existing over-limit documents remain
+readable and can be shortened. Read-only mode disables document changes in both
+surfaces while allowing mode changes and preview. Theme tokens and English /
+Chinese labels apply to both modes and editor preview. Preview disables hidden
+editing controls, and choosing an editing mode leaves preview. Fullscreen exposes
+its state and exits with Escape. Source block commands act on complete lines;
+code fences inserted within a paragraph are separated into standalone blocks.
+Table selection supports pointer/arrow navigation, dimension feedback and a
+rectangular highlight. Heading menus include a normal paragraph option.
+
+## Validation
+
+- `pnpm editor:test` checks round trips, source preservation, historical content,
+  attachment handling, offset mapping and structural continuations.
+- `pnpm editor:test:browser` runs the isolated Vue fixture against the production
+  components and the project Tailwind stylesheet, without starting auth, database or AI services. It checks modes,
+  selection, pending formats, undo, composition, uploads, limits, table controls,
+  preview, responsive overflow, dark mode and localized labels.
+- `pnpm i18n:check` checks translation key parity.
+
+The browser runner accepts `CHROMIUM_PATH` and an optional `LD_LIBRARY_PATH` for
+hosts without a system Chromium installation. Optional `EDITOR_CORPUS_PATH` and
+`EDITOR_RENDER_CORPUS_PATH` enable local historical-content audits; these data
+files are not committed.
+
+Upgrade Tiptap packages together and rerun compatibility tests. The Markdown
+extension is beta. CodeMirror dependencies are direct and pinned; source editing
+does not rely on undocumented DOM/API behavior of a complete third-party editor.
+Public preview is independently sanitized even when a caller supplies an HTML
+transform. Existing `.md-editor-*` class hooks remain local CSS compatibility
+hooks for page typography and sizing, not imports from the removed editor.
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 592bf2b5..73cefe47 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -1266,5 +1266,63 @@
       "cursor": "Click Add to Cursor and confirm the installation in Cursor. When it requests authorization, sign in to FeedLog in your browser and choose your organizations.",
       "other": "For clients using the mcpServers format, merge this entry into your MCP configuration. Your client must support remote HTTP MCP and browser-based OAuth. Connect FeedLog, then sign in and choose your organizations."
     }
+  },
+  "markdownEditor": {
+    "loading": "Loading editor…",
+    "codeLanguage": "Code language",
+    "plainText": "Plain text",
+    "moreTools": "More formatting tools",
+    "editingMode": "Editing mode",
+    "structuredMode": "Visual",
+    "sourceMode": "Source",
+    "unsupportedStructured": "This content contains formatting that cannot yet be edited visually. Your Markdown is preserved in source mode.",
+    "characterCount": "Character Count",
+    "tooLong": "Content is too long.",
+    "invalidUrl": "Enter a valid URL.",
+    "partialUpload": "Some images could not be uploaded. Please try again.",
+    "uploadFailed": "Image upload failed. Please try again.",
+    "formatting": "Formatting",
+    "paragraph": "Paragraph",
+    "url": "URL",
+    "text": "Text",
+    "confirm": "OK",
+    "upload": "Upload",
+    "cancel": "Cancel",
+    "uploading": "Uploading…",
+    "bold": "Bold",
+    "italic": "Italic",
+    "strikeThrough": "Strikethrough",
+    "title": "Heading",
+    "unorderedList": "Bullet list",
+    "orderedList": "Numbered list",
+    "link": "Link",
+    "image": "Image",
+    "code": "Code block",
+    "collapseCode": "Collapse or expand code",
+    "staleInsertion": "The document changed while this action was open. Please retry at the intended position.",
+    "uploadUnavailable": "Image upload is not configured for this editor.",
+    "copyCode": "Copy",
+    "copiedCode": "Copied",
+    "copyCodeFailed": "Copy failed",
+    "codeRow": "Inline code",
+    "previewOnly": "Preview",
+    "quote": "Quote",
+    "revoke": "Undo",
+    "next": "Redo",
+    "rowActions": "Row actions",
+    "columnActions": "Column actions",
+    "tableActions": "Table actions",
+    "addRowBefore": "Insert row above",
+    "addRowAfter": "Insert row below",
+    "addColumnBefore": "Insert column left",
+    "addColumnAfter": "Insert column right",
+    "deleteRow": "Delete row",
+    "deleteColumn": "Delete column",
+    "deleteTable": "Delete table",
+    "table": "Table",
+    "task": "Task list",
+    "enterCode": "Type code",
+    "insertRowAt": "Insert above row {index}",
+    "insertColumnAt": "Insert left of column {index}"
   }
 }
diff --git a/i18n/locales/zh.json b/i18n/locales/zh.json
index 8e45bfb3..ac9397e1 100644
--- a/i18n/locales/zh.json
+++ b/i18n/locales/zh.json
@@ -1266,5 +1266,63 @@
       "cursor": "点击 Add to Cursor 并在 Cursor 中确认安装。当客户端请求授权时，在浏览器中登录 FeedLog 并选择授权组织。",
       "other": "对于使用 mcpServers 格式的客户端，将此配置合并到 MCP 配置文件中。客户端需要支持远程 HTTP MCP 和浏览器 OAuth 授权。连接 FeedLog 后，登录并选择授权组织。"
     }
+  },
+  "markdownEditor": {
+    "loading": "正在加载编辑器…",
+    "codeLanguage": "代码语言",
+    "plainText": "纯文本",
+    "moreTools": "更多格式工具",
+    "editingMode": "编辑模式",
+    "structuredMode": "可视化",
+    "sourceMode": "源码",
+    "unsupportedStructured": "当前内容包含暂不支持可视化编辑的格式，Markdown 已保留，请继续使用源码模式。",
+    "characterCount": "字数",
+    "tooLong": "内容超过字数限制。",
+    "invalidUrl": "请输入有效链接。",
+    "partialUpload": "部分图片上传失败，请重试。",
+    "uploadFailed": "图片上传失败，请重试。",
+    "formatting": "格式",
+    "paragraph": "正文",
+    "url": "链接地址",
+    "text": "文字",
+    "confirm": "确定",
+    "upload": "上传",
+    "cancel": "取消",
+    "uploading": "上传中…",
+    "bold": "加粗",
+    "italic": "斜体",
+    "strikeThrough": "删除线",
+    "title": "标题",
+    "unorderedList": "无序列表",
+    "orderedList": "有序列表",
+    "link": "链接",
+    "image": "图片",
+    "code": "代码块",
+    "collapseCode": "折叠或展开代码",
+    "staleInsertion": "操作期间正文已变化，请在目标位置重新操作。",
+    "uploadUnavailable": "此编辑器未配置图片上传。",
+    "copyCode": "复制代码",
+    "copiedCode": "已复制",
+    "copyCodeFailed": "复制失败",
+    "codeRow": "行内代码",
+    "previewOnly": "预览",
+    "quote": "引用",
+    "revoke": "撤销",
+    "next": "重做",
+    "rowActions": "行操作",
+    "columnActions": "列操作",
+    "tableActions": "表格操作",
+    "addRowBefore": "上方插入行",
+    "addRowAfter": "下方插入行",
+    "addColumnBefore": "左侧插入列",
+    "addColumnAfter": "右侧插入列",
+    "deleteRow": "删除行",
+    "deleteColumn": "删除列",
+    "deleteTable": "删除表格",
+    "table": "表格",
+    "task": "任务列表",
+    "enterCode": "输入代码",
+    "insertRowAt": "在第 {index} 行上方插入",
+    "insertColumnAt": "在第 {index} 列左侧插入"
   }
 }
diff --git a/nuxt.config.ts b/nuxt.config.ts
index b9cfa6ca..5fc2e064 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -188,6 +188,14 @@ export default defineNuxtConfig({
     transpile: ['reka-ui'],
   },
 
+  vite: {
+    ssr: {
+      // PostCSS uses nanoid's CommonJS entry through sanitize-html. Bundle it
+      // before Nitro can resolve the flattened import to the ESM-only version.
+      noExternal: ['nanoid'],
+    },
+  },
+
   nitro: {
     externals: {
       traceInclude: mastraTraceInclude,
@@ -219,13 +227,6 @@ export default defineNuxtConfig({
     },
   },
 
-  vite: {
-    ssr: {
-      // Exclude md-editor-v3 from SSR bundle — it's browser-only and very large (~2MB)
-      external: ['md-editor-v3'],
-    },
-  },
-
   ogImage: {
     enabled: false,
   },
diff --git a/package.json b/package.json
index 173458dc..25e2e628 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,8 @@
     "migrate": "drizzle-kit migrate",
     "preview": "nuxt preview",
     "postinstall": "nuxt prepare",
+    "editor:test": "node --import tsx --test tests/markdown-editor.test.ts",
+    "editor:test:browser": "node scripts/test-markdown-editor-browser.mjs",
     "agent:prompt": "node --import tsx scripts/preview-agent-prompt.ts",
     "agent:test": "node --env-file=.env --import tsx --test tests/agent-*.test.ts",
     "agent:search-eval": "node --env-file=.env --import tsx scripts/evaluate-agent-help-search.ts",
@@ -27,6 +29,11 @@
     "@better-auth/mcp": "1.7.6",
     "@better-auth/oauth-provider": "1.7.6",
     "@better-auth/utils": "0.4.2",
+    "@codemirror/commands": "6.10.3",
+    "@codemirror/lang-markdown": "6.5.0",
+    "@codemirror/language": "6.12.2",
+    "@codemirror/state": "6.6.0",
+    "@codemirror/view": "6.40.0",
     "@mastra/ai-sdk": "1.10.3",
     "@mastra/core": "1.67.0",
     "@mastra/memory": "1.30.0",
@@ -41,6 +48,18 @@
     "@nuxtjs/i18n": "10.2.4",
     "@nuxtjs/seo": "3.4.0",
     "@pinia/nuxt": "0.11.3",
+    "@tiptap/core": "3.32.0",
+    "@tiptap/extension-code": "3.32.0",
+    "@tiptap/extension-code-block": "3.32.0",
+    "@tiptap/extension-image": "3.32.0",
+    "@tiptap/extension-link": "3.32.0",
+    "@tiptap/extension-list": "3.32.0",
+    "@tiptap/extension-table": "3.32.0",
+    "@tiptap/extensions": "3.32.0",
+    "@tiptap/markdown": "3.32.0",
+    "@tiptap/pm": "3.32.0",
+    "@tiptap/starter-kit": "3.32.0",
+    "@tiptap/vue-3": "3.32.0",
     "@vercel/blob": "^2.3.3",
     "@vercel/queue": "^0.7.0",
     "@vueuse/core": "^14.2.1",
@@ -49,6 +68,8 @@
     "better-auth": "1.7.6",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "cropperjs": "1.6.2",
+    "diff": "8.0.3",
     "dompurify": "^3.4.15",
     "drizzle-kit": "^0.31.10",
     "drizzle-orm": "^0.45.2",
@@ -56,7 +77,9 @@
     "jose": "^6.2.3",
     "js-tiktoken": "1.0.21",
     "lucide-vue-next": "^0.577.0",
-    "md-editor-v3": "^6.4.2",
+    "markdown-it": "14.1.1",
+    "markdown-it-sub": "2.0.0",
+    "markdown-it-sup": "2.0.0",
     "nanoid": "^5.1.9",
     "nuxt": "^4.3.1",
     "openai": "^6.34.0",
@@ -65,6 +88,7 @@
     "pinyinlite": "^1.2.1",
     "postgres": "^3.4.9",
     "reka-ui": "^2.9.0",
+    "sanitize-html": "2.17.0",
     "shadcn-nuxt": "2.4.3",
     "slugify": "^1.6.9",
     "tailwind-merge": "^3.5.0",
@@ -81,13 +105,17 @@
     "@iconify-json/mdi": "^1.2.3",
     "@modelcontextprotocol/client": "2.2.0",
     "@nuxtjs/tailwindcss": "7.0.0-beta.1",
+    "@types/markdown-it": "14.1.2",
     "@types/node": "^25.6.0",
     "@types/pg": "^8.23.1",
+    "@types/sanitize-html": "2.16.0",
     "h3": "1.15.6",
+    "playwright-core": "1.58.2",
     "tailwindcss": "^4.2.4",
     "tsx": "^4.21.0",
     "tw-animate-css": "^1.4.0",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vue-tsc": "3.2.0"
   },
   "pnpm": {
     "supportedArchitectures": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 738f6245..0bfa2e5e 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -26,6 +26,21 @@ importers:
       '@better-auth/utils':
         specifier: 0.4.2
         version: 0.4.2
+      '@codemirror/commands':
+        specifier: 6.10.3
+        version: 6.10.3
+      '@codemirror/lang-markdown':
+        specifier: 6.5.0
+        version: 6.5.0
+      '@codemirror/language':
+        specifier: 6.12.2
+        version: 6.12.2
+      '@codemirror/state':
+        specifier: 6.6.0
+        version: 6.6.0
+      '@codemirror/view':
+        specifier: 6.40.0
+        version: 6.40.0
       '@mastra/ai-sdk':
         specifier: 1.10.3
         version: 1.10.3(@mastra/core@1.67.0(ai@7.0.105(zod@4.3.6))(zod@4.3.6))(zod@4.3.6)
@@ -58,7 +73,7 @@ importers:
         version: 2.0.0(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)(magicast@0.5.2)
       '@nuxthub/core':
         specifier: 0.10.7
-        version: 0.10.7(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)(magicast@0.5.2)(typescript@5.9.3)
+        version: 0.10.7(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)(magicast@0.5.2)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))
       '@nuxtjs/i18n':
         specifier: 10.2.4
         version: 10.2.4(@vercel/blob@2.3.3)(@vue/compiler-dom@3.5.30)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(eslint@9.39.4(jiti@2.6.1))(ioredis@5.10.0)(magicast@0.5.2)(pinia@3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3)))(rollup@4.59.0)(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3))
@@ -68,6 +83,42 @@ importers:
       '@pinia/nuxt':
         specifier: 0.11.3
         version: 0.11.3(magicast@0.5.2)(pinia@3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3)))
+      '@tiptap/core':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/extension-code':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-code-block':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-image':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-link':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-list':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-table':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extensions':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/markdown':
+        specifier: 3.32.0
+        version: 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/pm':
+        specifier: 3.32.0
+        version: 3.32.0
+      '@tiptap/starter-kit':
+        specifier: 3.32.0
+        version: 3.32.0
+      '@tiptap/vue-3':
+        specifier: 3.32.0
+        version: 3.32.0(@floating-ui/dom@1.7.6)(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)(vue@3.5.30(typescript@5.9.3))
       '@vercel/blob':
         specifier: ^2.3.3
         version: 2.3.3
@@ -92,6 +143,12 @@ importers:
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
+      cropperjs:
+        specifier: 1.6.2
+        version: 1.6.2
+      diff:
+        specifier: 8.0.3
+        version: 8.0.3
       dompurify:
         specifier: ^3.4.15
         version: 3.4.15
@@ -113,15 +170,21 @@ importers:
       lucide-vue-next:
         specifier: ^0.577.0
         version: 0.577.0(vue@3.5.30(typescript@5.9.3))
-      md-editor-v3:
-        specifier: ^6.4.2
-        version: 6.4.2(vue@3.5.30(typescript@5.9.3))
+      markdown-it:
+        specifier: 14.1.1
+        version: 14.1.1
+      markdown-it-sub:
+        specifier: 2.0.0
+        version: 2.0.0
+      markdown-it-sup:
+        specifier: 2.0.0
+        version: 2.0.0
       nanoid:
         specifier: ^5.1.9
         version: 5.1.9
       nuxt:
         specifier: ^4.3.1
-        version: 4.3.1(c29c93111529fcace22186acccc6be3b)
+        version: 4.3.1(0e1cd30fef78be60f5de7f28c90a6150)
       openai:
         specifier: ^6.34.0
         version: 6.34.0(ws@8.21.3)(zod@4.3.6)
@@ -140,6 +203,9 @@ importers:
       reka-ui:
         specifier: ^2.9.0
         version: 2.9.0(vue@3.5.30(typescript@5.9.3))
+      sanitize-html:
+        specifier: 2.17.0
+        version: 2.17.0
       shadcn-nuxt:
         specifier: 2.4.3
         version: 2.4.3(magicast@0.5.2)
@@ -154,7 +220,7 @@ importers:
         version: 1.2.1
       vue-sonner:
         specifier: ^2.0.9
-        version: 2.0.9(@nuxt/kit@4.3.1(magicast@0.5.2))(@nuxt/schema@4.3.1)(nuxt@4.3.1(c29c93111529fcace22186acccc6be3b))
+        version: 2.0.9(@nuxt/kit@4.3.1(magicast@0.5.2))(@nuxt/schema@4.3.1)(nuxt@4.3.1(0e1cd30fef78be60f5de7f28c90a6150))
       vuedraggable:
         specifier: ^4.1.0
         version: 4.1.0(vue@3.5.30(typescript@5.9.3))
@@ -180,15 +246,24 @@ importers:
       '@nuxtjs/tailwindcss':
         specifier: 7.0.0-beta.1
         version: 7.0.0-beta.1(magicast@0.5.2)(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
+      '@types/markdown-it':
+        specifier: 14.1.2
+        version: 14.1.2
       '@types/node':
         specifier: ^25.6.0
         version: 25.6.0
       '@types/pg':
         specifier: ^8.23.1
         version: 8.23.1
+      '@types/sanitize-html':
+        specifier: 2.16.0
+        version: 2.16.0
       h3:
         specifier: 1.15.6
         version: 1.15.6
+      playwright-core:
+        specifier: 1.58.2
+        version: 1.58.2
       tailwindcss:
         specifier: ^4.2.4
         version: 4.2.4
@@ -201,6 +276,9 @@ importers:
       typescript:
         specifier: ^5.9.3
         version: 5.9.3
+      vue-tsc:
+        specifier: 3.2.0
+        version: 3.2.0(typescript@5.9.3)
 
 packages:
 
@@ -583,84 +661,24 @@ packages:
   '@codemirror/commands@6.10.3':
     resolution: {integrity: sha512-JFRiqhKu+bvSkDLI+rUhJwSxQxYb759W5GBezE8Uc8mHLqC9aV/9aTC7yJSqCtB3F00pylrLCwnyS91Ap5ej4Q==}
 
-  '@codemirror/lang-angular@0.1.4':
-    resolution: {integrity: sha512-oap+gsltb/fzdlTQWD6BFF4bSLKcDnlxDsLdePiJpCVNKWXSTAbiiQeYI3UmES+BLAdkmIC1WjyztC1pi/bX4g==}
-
-  '@codemirror/lang-cpp@6.0.3':
-    resolution: {integrity: sha512-URM26M3vunFFn9/sm6rzqrBzDgfWuDixp85uTY49wKudToc2jTHUrKIGGKs+QWND+YLofNNZpxcNGRynFJfvgA==}
-
   '@codemirror/lang-css@6.3.1':
     resolution: {integrity: sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==}
 
-  '@codemirror/lang-go@6.0.1':
-    resolution: {integrity: sha512-7fNvbyNylvqCphW9HD6WFnRpcDjr+KXX/FgqXy5H5ZS0eC5edDljukm/yNgYkwTsgp2busdod50AOTIy6Jikfg==}
-
   '@codemirror/lang-html@6.4.11':
     resolution: {integrity: sha512-9NsXp7Nwp891pQchI7gPdTwBuSuT3K65NGTHWHNJ55HjYcHLllr0rbIZNdOzas9ztc1EUVBlHou85FFZS4BNnw==}
 
-  '@codemirror/lang-java@6.0.2':
-    resolution: {integrity: sha512-m5Nt1mQ/cznJY7tMfQTJchmrjdjQ71IDs+55d1GAa8DGaB8JXWsVCkVT284C3RTASaY43YknrK2X3hPO/J3MOQ==}
-
   '@codemirror/lang-javascript@6.2.5':
     resolution: {integrity: sha512-zD4e5mS+50htS7F+TYjBPsiIFGanfVqg4HyUz6WNFikgOPf2BgKlx+TQedI1w6n/IqRBVBbBWmGFdLB/7uxO4A==}
 
-  '@codemirror/lang-jinja@6.0.0':
-    resolution: {integrity: sha512-47MFmRcR8UAxd8DReVgj7WJN1WSAMT7OJnewwugZM4XiHWkOjgJQqvEM1NpMj9ALMPyxmlziEI1opH9IaEvmaw==}
-
-  '@codemirror/lang-json@6.0.2':
-    resolution: {integrity: sha512-x2OtO+AvwEHrEwR0FyyPtfDUiloG3rnVTSZV1W8UteaLL8/MajQd8DpvUb2YVzC+/T18aSDv0H9mu+xw0EStoQ==}
-
-  '@codemirror/lang-less@6.0.2':
-    resolution: {integrity: sha512-EYdQTG22V+KUUk8Qq582g7FMnCZeEHsyuOJisHRft/mQ+ZSZ2w51NupvDUHiqtsOy7It5cHLPGfHQLpMh9bqpQ==}
-
-  '@codemirror/lang-liquid@6.3.2':
-    resolution: {integrity: sha512-6PDVU3ZnfeYyz1at1E/ttorErZvZFXXt1OPhtfe1EZJ2V2iDFa0CwPqPgG5F7NXN0yONGoBogKmFAafKTqlwIw==}
-
   '@codemirror/lang-markdown@6.5.0':
     resolution: {integrity: sha512-0K40bZ35jpHya6FriukbgaleaqzBLZfOh7HuzqbMxBXkbYMJDxfF39c23xOgxFezR+3G+tR2/Mup+Xk865OMvw==}
 
-  '@codemirror/lang-php@6.0.2':
-    resolution: {integrity: sha512-ZKy2v1n8Fc8oEXj0Th0PUMXzQJ0AIR6TaZU+PbDHExFwdu+guzOA4jmCHS1Nz4vbFezwD7LyBdDnddSJeScMCA==}
-
-  '@codemirror/lang-python@6.2.1':
-    resolution: {integrity: sha512-IRjC8RUBhn9mGR9ywecNhB51yePWCGgvHfY1lWN/Mrp3cKuHr0isDKia+9HnvhiWNnMpbGhWrkhuWOc09exRyw==}
-
-  '@codemirror/lang-rust@6.0.2':
-    resolution: {integrity: sha512-EZaGjCUegtiU7kSMvOfEZpaCReowEf3yNidYu7+vfuGTm9ow4mthAparY5hisJqOHmJowVH3Upu+eJlUji6qqA==}
-
-  '@codemirror/lang-sass@6.0.2':
-    resolution: {integrity: sha512-l/bdzIABvnTo1nzdY6U+kPAC51czYQcOErfzQ9zSm9D8GmNPD0WTW8st/CJwBTPLO8jlrbyvlSEcN20dc4iL0Q==}
-
-  '@codemirror/lang-sql@6.10.0':
-    resolution: {integrity: sha512-6ayPkEd/yRw0XKBx5uAiToSgGECo/GY2NoJIHXIIQh1EVwLuKoU8BP/qK0qH5NLXAbtJRLuT73hx7P9X34iO4w==}
-
-  '@codemirror/lang-vue@0.1.3':
-    resolution: {integrity: sha512-QSKdtYTDRhEHCfo5zOShzxCmqKJvgGrZwDQSdbvCRJ5pRLWBS7pD/8e/tH44aVQT6FKm0t6RVNoSUWHOI5vNug==}
-
-  '@codemirror/lang-wast@6.0.2':
-    resolution: {integrity: sha512-Imi2KTpVGm7TKuUkqyJ5NRmeFWF7aMpNiwHnLQe0x9kmrxElndyH0K6H/gXtWwY6UshMRAhpENsgfpSwsgmC6Q==}
-
-  '@codemirror/lang-xml@6.1.0':
-    resolution: {integrity: sha512-3z0blhicHLfwi2UgkZYRPioSgVTo9PV5GP5ducFH6FaHy0IAJRg+ixj5gTR1gnT/glAIC8xv4w2VL1LoZfs+Jg==}
-
-  '@codemirror/lang-yaml@6.1.2':
-    resolution: {integrity: sha512-dxrfG8w5Ce/QbT7YID7mWZFKhdhsaTNOYjOkSIMt1qmC4VQnXSDSYVHHHn8k6kJUfIhtLo8t1JJgltlxWdsITw==}
-
-  '@codemirror/language-data@6.5.2':
-    resolution: {integrity: sha512-CPkWBKrNS8stYbEU5kwBwTf3JB1kghlbh4FSAwzGW2TEscdeHHH4FGysREW86Mqnj3Qn09s0/6Ea/TutmoTobg==}
-
   '@codemirror/language@6.12.2':
     resolution: {integrity: sha512-jEPmz2nGGDxhRTg3lTpzmIyGKxz3Gp3SJES4b0nAuE5SWQoKdT5GoQ69cwMmFd+wvFUhYirtDTr0/DRHpQAyWg==}
 
-  '@codemirror/legacy-modes@6.5.2':
-    resolution: {integrity: sha512-/jJbwSTazlQEDOQw2FJ8LEEKVS72pU0lx6oM54kGpL8t/NJ2Jda3CZ4pcltiKTdqYSRk3ug1B3pil1gsjA6+8Q==}
-
   '@codemirror/lint@6.9.5':
     resolution: {integrity: sha512-GElsbU9G7QT9xXhpUg1zWGmftA/7jamh+7+ydKRuT0ORpWS3wOSP0yT1FOlIZa7mIJjpVPipErsyvVqB9cfTFA==}
 
-  '@codemirror/search@6.6.0':
-    resolution: {integrity: sha512-koFuNXcDvyyotWcgOnZGmY7LZqEOXZaaxD/j6n18TCLx2/9HieZJ5H6hs1g8FiRxBD0DNfs0nXn17g872RmYdw==}
-
   '@codemirror/state@6.6.0':
     resolution: {integrity: sha512-4nbvra5R5EtiCzr9BTHiTLc+MLXK2QGiAVYMyi8PkQd3SR+6ixar/Q/01Fa21TBIDOZXgeWV4WppsQolSreAPQ==}
 
@@ -1564,54 +1582,24 @@ packages:
   '@lezer/common@1.5.1':
     resolution: {integrity: sha512-6YRVG9vBkaY7p1IVxL4s44n5nUnaNnGM2/AckNgYOnxTG2kWh1vR8BMxPseWPjRNpb5VtXnMpeYAEAADoRV1Iw==}
 
-  '@lezer/cpp@1.1.5':
-    resolution: {integrity: sha512-DIhSXmYtJKLehrjzDFN+2cPt547ySQ41nA8yqcDf/GxMc+YM736xqltFkvADL2M0VebU5I+3+4ks2Vv+Kyq3Aw==}
-
   '@lezer/css@1.3.1':
     resolution: {integrity: sha512-PYAKeUVBo3HFThruRyp/iK91SwiZJnzXh8QzkQlwijB5y+N5iB28+iLk78o2zmKqqV0uolNhCwFqB8LA7b0Svg==}
 
-  '@lezer/go@1.0.1':
-    resolution: {integrity: sha512-xToRsYxwsgJNHTgNdStpcvmbVuKxTapV0dM0wey1geMMRc9aggoVyKgzYp41D2/vVOx+Ii4hmE206kvxIXBVXQ==}
-
   '@lezer/highlight@1.2.3':
     resolution: {integrity: sha512-qXdH7UqTvGfdVBINrgKhDsVTJTxactNNxLk7+UMwZhU13lMHaOBlJe9Vqp907ya56Y3+ed2tlqzys7jDkTmW0g==}
 
   '@lezer/html@1.3.13':
     resolution: {integrity: sha512-oI7n6NJml729m7pjm9lvLvmXbdoMoi2f+1pwSDJkl9d68zGr7a9Btz8NdHTGQZtW2DA25ybeuv/SyDb9D5tseg==}
 
-  '@lezer/java@1.1.3':
-    resolution: {integrity: sha512-yHquUfujwg6Yu4Fd1GNHCvidIvJwi/1Xu2DaKl/pfWIA2c1oXkVvawH3NyXhCaFx4OdlYBVX5wvz2f7Aoa/4Xw==}
-
   '@lezer/javascript@1.5.4':
     resolution: {integrity: sha512-vvYx3MhWqeZtGPwDStM2dwgljd5smolYD2lR2UyFcHfxbBQebqx8yjmFmxtJ/E6nN6u1D9srOiVWm3Rb4tmcUA==}
 
-  '@lezer/json@1.0.3':
-    resolution: {integrity: sha512-BP9KzdF9Y35PDpv04r0VeSTKDeox5vVr3efE7eBbx3r4s3oNLfunchejZhjArmeieBH+nVOpgIiBJpEAv8ilqQ==}
-
   '@lezer/lr@1.4.8':
     resolution: {integrity: sha512-bPWa0Pgx69ylNlMlPvBPryqeLYQjyJjqPx+Aupm5zydLIF3NE+6MMLT8Yi23Bd9cif9VS00aUebn+6fDIGBcDA==}
 
   '@lezer/markdown@1.6.3':
     resolution: {integrity: sha512-jpGm5Ps+XErS+xA4urw7ogEGkeZOahVQF21Z6oECF0sj+2liwZopd2+I8uH5I/vZsRuuze3OxBREIANLf6KKUw==}
 
-  '@lezer/php@1.0.5':
-    resolution: {integrity: sha512-W7asp9DhM6q0W6DYNwIkLSKOvxlXRrif+UXBMxzsJUuqmhE7oVU+gS3THO4S/Puh7Xzgm858UNaFi6dxTP8dJA==}
-
-  '@lezer/python@1.1.18':
-    resolution: {integrity: sha512-31FiUrU7z9+d/ElGQLJFXl+dKOdx0jALlP3KEOsGTex8mvj+SoE1FgItcHWK/axkxCHGUSpqIHt6JAWfWu9Rhg==}
-
-  '@lezer/rust@1.0.2':
-    resolution: {integrity: sha512-Lz5sIPBdF2FUXcWeCu1//ojFAZqzTQNRga0aYv6dYXqJqPfMdCAI0NzajWUd4Xijj1IKJLtjoXRPMvTKWBcqKg==}
-
-  '@lezer/sass@1.1.0':
-    resolution: {integrity: sha512-3mMGdCTUZ/84ArHOuXWQr37pnf7f+Nw9ycPUeKX+wu19b7pSMcZGLbaXwvD2APMBDOGxPmpK/O6S1v1EvLoqgQ==}
-
-  '@lezer/xml@1.0.6':
-    resolution: {integrity: sha512-CdDwirL0OEaStFue/66ZmFSeppuL6Dwjlk8qk153mSQwiSH/Dlri4GNymrNWnUmPl2Um7QfV1FO9KFUyX3Twww==}
-
-  '@lezer/yaml@1.0.4':
-    resolution: {integrity: sha512-2lrrHqxalACEbxIbsjhqGpSW8kWpUKuY6RHgnSAFZa6qK62wvnPxA8hGOwOoDbwHcOFs5M4o27mjGu+P7TvBmw==}
-
   '@lukeed/csprng@1.1.0':
     resolution: {integrity: sha512-Z7C/xXCiGWsg0KuKsHTKJxbWhpI3Vs5GwLfOean7MGyVFGqdRgBbAjOCh6u4bbjPc/8MJ2pZmK/0DLdCbivLDA==}
     engines: {node: '>=8'}
@@ -3290,6 +3278,171 @@ packages:
     peerDependencies:
       vue: ^2.7.0 || ^3.0.0
 
+  '@tiptap/core@3.32.0':
+    resolution: {integrity: sha512-Ghh2h02GKSqzytQGcLV4espYOG4EHxjj0MsrUB2Vnr47xmlZYRf6r7k2J09H+JpBdaGrWwrTkyBEi5i3c3yy2Q==}
+    peerDependencies:
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-blockquote@3.32.0':
+    resolution: {integrity: sha512-wmuthEdlYVArNoUbqFPH35giutBABFu7fqEB0lTD1k0UXJUs4dFvcbRyGWWgnHFZgP3TT4u8e+xiayYw0eQ0NQ==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-bold@3.32.0':
+    resolution: {integrity: sha512-SQYewnYDoIBN+8oH53IDcD8p+Pz+Jnyq3hrxjy/FAo5ctc+96d3ZLdqc9gzLVSqFFo/SUINv2FVGoq9PvU7yqw==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-bubble-menu@3.32.0':
+    resolution: {integrity: sha512-X3ll8i9Z8QNvt7+tcqlwopJG+68ugO13Av0Ox4Ico+jXcTnFdDuKQJBSI9sLuMR5vTQOeTHhKYXhjF88aahMSA==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-bullet-list@3.32.0':
+    resolution: {integrity: sha512-Y5P/l06pVCUG46vXpBl3z0fW2b6JpSMX4Cvr+5sfQh8zB3TxwSiLQaaPwI3R5MFD1KfRk3AjiPRieEyXdWcNHw==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.32.0
+
+  '@tiptap/extension-code-block@3.32.0':
+    resolution: {integrity: sha512-9NZW/yXP9j9XKr+hRS5m58xiyZI+tQo1PJ7eLHXjGNFWaF601NG/h6741mbKh5uCY51XsbyqG+7que+RavngPA==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-code@3.32.0':
+    resolution: {integrity: sha512-I+aEVl0dTmkfnU6HzBGEefb9U7ja2MkucwBBwrmoMwU+uIKpC4xw8NcHC9X6sjAcom3Pxs2HX+8WEo4Vp13R/Q==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-document@3.32.0':
+    resolution: {integrity: sha512-GugeKE6AnZDluRXJUNBuX43TPcaJxy5wck6vT2J4a0/EnKStJ43suSZZf1IPfb1ij9EL9bYvAwg9DOcrvdEzTQ==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-dropcursor@3.32.0':
+    resolution: {integrity: sha512-t4Ug8hFLt30dwwYvrh63BVUt6N1Yg5PVI3tMllhCmN3Q68oD47v4MB/i5nGfzIsQqMyXUOetwHJWcZ4MoLTx4Q==}
+    peerDependencies:
+      '@tiptap/extensions': 3.32.0
+
+  '@tiptap/extension-floating-menu@3.32.0':
+    resolution: {integrity: sha512-AzKCWceL+4Q1pTc8Whw1kPqN/aYGPQ70/jXPsblWl501t/pXi6Kz0Pi/NggKkuu73VGjykh68YYf/dcOJ/mPZQ==}
+    peerDependencies:
+      '@floating-ui/dom': ^1.0.0
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-gapcursor@3.32.0':
+    resolution: {integrity: sha512-HUpKKWJLtthnpQY5LIjHlJJOmh562RusmOMIe/4iP/H7y+WUR9ZFiZjEs1NBkRjig9fwj8F3BfsrVPYBnM4nLA==}
+    peerDependencies:
+      '@tiptap/extensions': 3.32.0
+
+  '@tiptap/extension-hard-break@3.32.0':
+    resolution: {integrity: sha512-IKUYvK+bO2hGrDWhhTVg0CSh9C2belWg9GyLzvpyd3SZyQ9EgdccLfoytNjOBKbAE/TQ4Oo3kSP+XF6RsUIKPA==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-heading@3.32.0':
+    resolution: {integrity: sha512-XRiZxZuhfjvbgwCvoBHj04gOsPANEXxxRwrFCQVuFi5yeTHYIzMEioc81j6iAH9pV7aQeJCwLxuh6VHNz3dXEQ==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-horizontal-rule@3.32.0':
+    resolution: {integrity: sha512-Iry7ynsG4xgcxnH1cm+uXJnEtUzoop4sGA10NUN9I+08TOjhj/GrDiRKMQHKAiVI/R7t2MVav1MJlxFf2FdzGw==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-image@3.32.0':
+    resolution: {integrity: sha512-nv/YlOMwFUp2ItffQbHb14yAJjrn9sdxKl0WK5rH8PPiNoXVkvasieoBLNTHan9gjhrSp7LjVG2ZsMoSe/I7gg==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-italic@3.32.0':
+    resolution: {integrity: sha512-KB/i1xoHilbBGcQ+UotDWhi60KpdCde3RzRIpl2na0Yol4z4Fe2IRWg8ljIrlsssDRwel/fsHJbG7a13EP8oKA==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-link@3.32.0':
+    resolution: {integrity: sha512-DRdQSgWPSEjrDg5EDBB5yxRygHtUVLhceVGzAsTz8RziiFyvcwAvzBHCO9hd9jutjCXQ2DLIuZB8P+aHhFWnpg==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-list-item@3.32.0':
+    resolution: {integrity: sha512-FdJTCAeALixzyyGSSEmroXmkIEclbo/4t2Pl03aRERqpPOSPJcC3evDtIhLazTuP6v+FjCmJ+pXNql6ov7qitA==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.32.0
+
+  '@tiptap/extension-list-keymap@3.32.0':
+    resolution: {integrity: sha512-vXFre18Dk2m5N/gjo408C02GSrolZ8ZIf0wz6/U8lNC4FcYOISgZFj3BND6uabVntGh2GCSPrVFuNpVPhFnn/A==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.32.0
+
+  '@tiptap/extension-list@3.32.0':
+    resolution: {integrity: sha512-QdzS5nFz9agAQhBgIuQluobWib39W2cMKx1XB6tYSue7bHMJdgPFP0EnGfFajaeVX42CG6RXtQWrNfyQGKhBvg==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-ordered-list@3.32.0':
+    resolution: {integrity: sha512-htZ5hoMLBkGiDP6M5mGemjOoaBmkrj911wiGoTmMMKzO7qJq9QxUBkLY7ILPaKlUWL8U3ccLdDV2TB/nysp4Jg==}
+    peerDependencies:
+      '@tiptap/extension-list': 3.32.0
+
+  '@tiptap/extension-paragraph@3.32.0':
+    resolution: {integrity: sha512-afKLMc7fWMkkar9H5FilizStSbhFzUoCzdwwdZf6DDsn3LUt8tJlFHACK78cAyx/TzMJBo0N8/8T1u9bL+N67Q==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-strike@3.32.0':
+    resolution: {integrity: sha512-J9Vw6wmh/wV6SxSsN9RhurvAGcXSY5J3p4EQrROD5PARBl0VOnDFi7/UVoz1RkSdqOKPgAiqDZpaLRgtdBO9Rg==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-table@3.32.0':
+    resolution: {integrity: sha512-uOqCzWzxXvMccapZo+1CDxp3JGegxqNl11Lj8XiiWLxwmg81B/bKwMJW7+YlIdffgGNYJETk5YwL8T0IVBD2QQ==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-text@3.32.0':
+    resolution: {integrity: sha512-sF0jIK67IHdZMnzv2mz5vPTyK7R0ui6/YZgFg+/bLnFCNmweVAoYcHZLlC7ISRnwu0mqJr+epNtzJepY1ZDCjg==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extension-underline@3.32.0':
+    resolution: {integrity: sha512-rMLdd4vg6sed/JnaXnaupLbCtYiWikTnQ8qir9ItKOXwf1Ui9P1Y4G0bYU4+gcnMsFzaSGtrOhMqG4/c66AogQ==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+
+  '@tiptap/extensions@3.32.0':
+    resolution: {integrity: sha512-qO+ndNvlOjzU2MWCtQHoRg1tIortCXLvqPjDx58F1pUYFNCOVZegXi+jqLGDODUA31er+TVz66umzRbbN1bO1Q==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/markdown@3.32.0':
+    resolution: {integrity: sha512-y+pGAu4QMkXBMxhBoLvc6FWucQ1EWIoPi+Ajf4rAh5OlZtSV3CjBwyK6/xTwO7mvQxtoUf7DD23CzSaj5nCTBA==}
+    peerDependencies:
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/pm@3.32.0':
+    resolution: {integrity: sha512-H9eN+xHFboJybE7KPGVsu24S8aBlCIgYz38vCHRSnNv17nwmqm06owq/IQ5scza0n3Y7IfUfpgPOtm9SgeHmNQ==}
+
+  '@tiptap/starter-kit@3.32.0':
+    resolution: {integrity: sha512-aPYxaevci4PgMrTLsg+baiqI7M1ICd4V9H+zTTdrqs8OUZIbAvj/pNDuHU8uWZyKMu3Dh72t2D6ZdqRu/6aSWw==}
+
+  '@tiptap/vue-3@3.32.0':
+    resolution: {integrity: sha512-FpYquLlZpfFzgWcQuOrXuUXDNn8YYomD3dLx92b61XxVMlwKkOH3p1XS/wlNNRBLaA7oSB5VRzy5E7EXtfgqpg==}
+    peerDependencies:
+      '@floating-ui/dom': ^1.0.0
+      '@tiptap/core': 3.32.0
+      '@tiptap/pm': 3.32.0
+      vue: ^3.0.0
+
   '@tybys/wasm-util@0.10.1':
     resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==}
 
@@ -3341,6 +3494,9 @@ packages:
   '@types/resolve@1.20.2':
     resolution: {integrity: sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==}
 
+  '@types/sanitize-html@2.16.0':
+    resolution: {integrity: sha512-l6rX1MUXje5ztPT0cAFtUayXF06DqPhRyfVXareEN5gGCFaP/iwsxIyKODr9XDhfxPpN6vXUFNfo5kZMXCxBtw==}
+
   '@types/trusted-types@2.0.7':
     resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
 
@@ -3564,12 +3720,6 @@ packages:
   '@uploadthing/mime-types@0.3.6':
     resolution: {integrity: sha512-t3tTzgwFV9+1D7lNDYc7Lr7kBwotHaX0ZsvoCGe7xGnXKo9z0jG2Sjl/msll12FeoLj77nyhsxevXyGpQDBvLg==}
 
-  '@vavt/copy2clipboard@1.0.3':
-    resolution: {integrity: sha512-HtG48r2FBYp9eRvGB3QGmtRBH1zzRRAVvFbGgFstOwz4/DDaNiX0uZc3YVKPydqgOav26pibr9MtoCaWxn7aeA==}
-
-  '@vavt/util@2.1.2':
-    resolution: {integrity: sha512-L3UbSJthJwr3wq0x93O5TrCepimrmVZaIl2ciZbeL18G5++gBhJXNhcH7RcVk/6rr3SavWOvwhig0mqRLoR7dw==}
-
   '@vercel/blob@2.3.3':
     resolution: {integrity: sha512-MtD7VLo6hU07eHR7bmk5SIMD290q574UaNYTe46qeyRT+hWrCy26CoAqfd7PnIefVXvRehRZBzukxuTO9iGTVg==}
     engines: {node: '>=20.0.0'}
@@ -3635,12 +3785,21 @@ packages:
   '@vitest/utils@4.1.10':
     resolution: {integrity: sha512-fy9am/HWxbaGt/Sawrp90vt6Y6jQwf1RX77cz3uwoJwJVMli/e1IEwRPnMNJ7vKfPTwo0diXifkpPvwH9v7nGA==}
 
+  '@volar/language-core@2.4.27':
+    resolution: {integrity: sha512-DjmjBWZ4tJKxfNC1F6HyYERNHPYS7L7OPFyCrestykNdUZMFYzI9WTyvwPcaNaHlrEUwESHYsfEw3isInncZxQ==}
+
   '@volar/language-core@2.4.28':
     resolution: {integrity: sha512-w4qhIJ8ZSitgLAkVay6AbcnC7gP3glYM3fYwKV3srj8m494E3xtrCv6E+bWviiK/8hs6e6t1ij1s2Endql7vzQ==}
 
+  '@volar/source-map@2.4.27':
+    resolution: {integrity: sha512-ynlcBReMgOZj2i6po+qVswtDUeeBRCTgDurjMGShbm8WYZgJ0PA4RmtebBJ0BCYol1qPv3GQF6jK7C9qoVc7lg==}
+
   '@volar/source-map@2.4.28':
     resolution: {integrity: sha512-yX2BDBqJkRXfKw8my8VarTyjv48QwxdJtvRgUpNE5erCsgEUdI2DsLbpa+rOQVAJYshY99szEcRDmyHbF10ggQ==}
 
+  '@volar/typescript@2.4.27':
+    resolution: {integrity: sha512-eWaYCcl/uAPInSK2Lze6IqVWaBu/itVqR5InXcHXFyles4zO++Mglt3oxdgj75BDcv1Knr9Y93nowS8U3wqhxg==}
+
   '@vue-macros/common@3.1.2':
     resolution: {integrity: sha512-h9t4ArDdniO9ekYHAD95t9AZcAbb19lEGK+26iAjUODOIJKmObDNBSe4+6ELQAA3vtYiFPPBtHh7+cQCKi3Dng==}
     engines: {node: '>=20.19.0'}
@@ -3722,6 +3881,9 @@ packages:
   '@vue/devtools-shared@8.1.1':
     resolution: {integrity: sha512-+h4ttmJYl/txpxHKaoZcaKpC+pvckgLzIDiSQlaQ7kKthKh8KuwoLW2D8hPJEnqKzXOvu15UHEoGyngAXCz0EQ==}
 
+  '@vue/language-core@3.2.0':
+    resolution: {integrity: sha512-CHIuDtZ04CIElAgEuLbwmq3p7QcmYoVPmBPqtdvWJCflZE5W3KHT/5DRBvDv1r2TteCjN02uYHiaAEWq9hQNiA==}
+
   '@vue/language-core@3.2.5':
     resolution: {integrity: sha512-d3OIxN/+KRedeM5wQ6H6NIpwS3P5gC9nmyaHgBk+rO6dIsjY+tOh4UlPpiZbAh3YtLdCGEX4M16RmsBqPmJV+g==}
 
@@ -4217,9 +4379,6 @@ packages:
     resolution: {integrity: sha512-RMr0FhtfXemyinomL4hrWcYJxmX6deFdCxpJzhDttxgO1+bcCnkk+9drydLVDmAMG7NE6aN/fl4F7ucU/90gAA==}
     engines: {node: '>=0.10.0'}
 
-  codemirror@6.0.2:
-    resolution: {integrity: sha512-VhydHotNW5w1UGK0Qj96BwSk/Zqbp9WbnyK2W/eVMv4QyF41INRGpjUhFJY7/uDNuudSc33a/PKr4iDqRduvHw==}
-
   color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
     engines: {node: '>=7.0.0'}
@@ -4306,6 +4465,9 @@ packages:
     resolution: {integrity: sha512-p9nwwR4qyT5W996vBZhdvBCnMhicY5ytZkR4D1Xj0wuTDEiMnjwR57Q3RXYY/s0EpX6Ay3vgIcfaR+ewGHsi+g==}
     engines: {node: '>=18.0'}
 
+  cropperjs@1.6.2:
+    resolution: {integrity: sha512-nhymn9GdnV3CqiEHJVai54TULFAE3VshJTXSqSJKa8yXAKyBKDWdhHarnlIPrshJ0WMFTGuFvG02YjLXfPiuOA==}
+
   cross-spawn@7.0.6:
     resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
     engines: {node: '>= 8'}
@@ -5163,6 +5325,9 @@ packages:
   html-entities@2.6.0:
     resolution: {integrity: sha512-kig+rMn/QOVRvr7c86gQ8lWXq+Hkv6CbAH1hLu+RG338StTpE8Z0b44SDVaqVu7HGKf27frdmUYEs9hTUX/cLQ==}
 
+  htmlparser2@8.0.2:
+    resolution: {integrity: sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==}
+
   http-errors@2.0.1:
     resolution: {integrity: sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==}
     engines: {node: '>= 0.8'}
@@ -5322,6 +5487,10 @@ packages:
     resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
     engines: {node: '>=12'}
 
+  is-plain-object@5.1.0:
+    resolution: {integrity: sha512-bUi/yjmtKYcRVUtWRGr0UA6xEFh2I6zWUwMrUXB3s7bmYCaZ8a+0ZsTRkrawh/mzlSD1Y0Ph8bp/U+TvBpWDNw==}
+    engines: {node: '>=0.10.0'}
+
   is-property@1.0.2:
     resolution: {integrity: sha512-Ks/IoX00TtClbGQr4TWXemAnktAQvYB7HzcCxDGqEZU6oCmb2INHuOoKxbtR+HFkmYWBKv/dOZtGRiAjDhj92g==}
 
@@ -5564,6 +5733,9 @@ packages:
   linkify-it@5.0.0:
     resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
 
+  linkifyjs@4.3.3:
+    resolution: {integrity: sha512-P8aEP5U/D1/IlTY2OeYsErdwh9bGuLE30NcXtKEjgdHcahveQoQwM2yZNsioQHsWFz0P7KKudisbrzCgR0sDHg==}
+
   listhen@1.9.0:
     resolution: {integrity: sha512-I8oW2+QL5KJo8zXNWX046M134WchxsXC7SawLPvRQpogCbkyQIaFxPE89A2HiwR7vAK2Dm2ERBAmyjTYGYEpBg==}
     hasBin: true
@@ -5629,12 +5801,6 @@ packages:
     resolution: {integrity: sha512-DqC6n3QQ77zdFpCMASA1a3Jlb64Hv2N2DciFGkO/4L9+q/IpIAuRlKOvCXabtRW6cQf8usbmM6BE/TOPysCdIA==}
     engines: {bun: '>=1.0.0', deno: '>=1.30.0', node: '>=8.0.0'}
 
-  lucide-vue-next@0.543.0:
-    resolution: {integrity: sha512-Az5kpNm/koKAwSNIKjsZ4uHV2tVfmlQlcHwFBygQ8gc5/jFg7An9OrxgDy/aE5m+HLx7VfLYqDxLr8gWecZbQA==}
-    deprecated: Package deprecated. Please use @lucide/vue instead.
-    peerDependencies:
-      vue: '>=3.0.1'
-
   lucide-vue-next@0.577.0:
     resolution: {integrity: sha512-py05bAfv9SHVJqscbiOnjcnLlEmOffA58a+7XhZuFxrs6txe1E8VoR1ngWGTYO+9aVKABAz8l3ee3PqiQN9QPA==}
     deprecated: Package deprecated. Please use @lucide/vue instead.
@@ -5654,12 +5820,6 @@ packages:
   magicast@0.5.2:
     resolution: {integrity: sha512-E3ZJh4J3S9KfwdjZhe2afj6R9lGIN5Pher1pF39UGrXRqq/VDaGVIGN13BjHd2u8B61hArAGOnso7nBOouW3TQ==}
 
-  markdown-it-image-figures@2.1.1:
-    resolution: {integrity: sha512-mwXSQ2nPeVUzCMIE3HlLvjRioopiqyJLNph0pyx38yf9mpqFDhNGnMpAXF9/A2Xv0oiF2cVyg9xwfF0HNAz05g==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      markdown-it: '*'
-
   markdown-it-sub@2.0.0:
     resolution: {integrity: sha512-iCBKgwCkfQBRg2vApy9vx1C1Tu6D8XYo8NvevI3OlwzBRmiMtsJ2sXupBgEA7PPxiDwNni3qIUkhZ6j5wofDUA==}
 
@@ -5673,14 +5833,14 @@ packages:
   markdown-table@3.0.4:
     resolution: {integrity: sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==}
 
+  marked@17.0.6:
+    resolution: {integrity: sha512-gB0gkNafnonOw0obSTEGZTT86IuhILt2Wfx0mWH/1Au83kybTayroZ/V6nS25mN7u8ASy+5fMhgB3XPNrOZdmA==}
+    engines: {node: '>= 20'}
+    hasBin: true
+
   marky@1.3.0:
     resolution: {integrity: sha512-ocnPZQLNpvbedwTy9kNrQEsknEfgvcLMvOtz3sFeWApDq1MXH1TqkCIx58xlpESsfwQOnuBO9beyQuNGzVvuhQ==}
 
-  md-editor-v3@6.4.2:
-    resolution: {integrity: sha512-Jz2eYHTWpcxjakU7+2I2E9soiintAJ1NAFkXbhZYNUD1W/y52RidsjdmQRyf1YQH2pGXZyVLsHJm/mW99kA7LA==}
-    peerDependencies:
-      vue: ^3.5.3
-
   mdast-util-find-and-replace@3.0.2:
     resolution: {integrity: sha512-Tmd1Vg/m3Xz43afeNxDIhWRtFZgM2VLyaf4vSTYwudTyeuTneoL3qtWMA5jeLyz/O1vDJmmV4QuScFCA2tBPwg==}
 
@@ -5723,9 +5883,6 @@ packages:
   mdurl@2.0.0:
     resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
 
-  medium-zoom@1.1.0:
-    resolution: {integrity: sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==}
-
   memory-pager@1.5.0:
     resolution: {integrity: sha512-ZS4Bp4r/Zoeq6+NLJpP+0Zzm0pR8whtGPf1XExKLJBAczGMnSi3It14OiNCStjQjM6NU1okjQGSxgEZN8eBYKg==}
 
@@ -6123,6 +6280,9 @@ packages:
     resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
     engines: {node: '>= 0.8.0'}
 
+  orderedmap@2.1.1:
+    resolution: {integrity: sha512-TvAWxi0nDe1j/rtMcWcIj94+Ffe6n7zhow33h40SKxmsmozs6dz/e+EajymfoFcHd7sxNn8yHM8839uixMOV6g==}
+
   oxc-minify@0.112.0:
     resolution: {integrity: sha512-rkVSeeIRSt+RYI9uX6xonBpLUpvZyegxIg0UL87ev7YAfUqp7IIZlRjkgQN5Us1lyXD//TOo0Dcuuro/TYOWoQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -6195,6 +6355,9 @@ packages:
     resolution: {integrity: sha512-TXfryirbmq34y8QBwgqCVLi+8oA3oWx2eAnSn62ITyEhEYaWRlVZ2DvMM9eZbMs/RfxPu/PK/aBLyGj4IrqMHw==}
     engines: {node: '>=18'}
 
+  parse-srcset@1.0.2:
+    resolution: {integrity: sha512-/2qh0lav6CmI15FzA3i/2Bzk2zCgQhGMkvhOhKNcBVQ1ldgpbfiNTVslmooUmWJcADi1f1kIeynbDRVzNlfR6Q==}
+
   parse-statements@1.0.11:
     resolution: {integrity: sha512-HlsyYdMBnbPQ9Jr/VgJ1YF4scnldvJpJxCVx6KgqPL4dxppsWrJHCIIxQXMJrqGnsRkNPATbeMJ8Yxu7JMsYcA==}
 
@@ -6564,6 +6727,45 @@ packages:
   proper-lockfile@4.1.2:
     resolution: {integrity: sha512-TjNPblN4BwAWMXU8s9AEz4JmQxnD1NNL7bNOY/AKUzyamc379FWASUhc/K1pL2noVb+XmZKLL68cjzLsiOAMaA==}
 
+  prosemirror-changeset@2.4.4:
+    resolution: {integrity: sha512-Gyuz9jYdrAeA9I7AholyOes9KUmv/lEwsC5O9s5xF5VB3EgTPsXMGUxz4+H1B+wKVPdZbvRcg1Cp3x8qX+8ofA==}
+
+  prosemirror-commands@1.7.2:
+    resolution: {integrity: sha512-q6Q6szxqdu9Xd6EcdKsqXghu5nQdZTpB4Q9yd04WRc7/jt763e/rT60Owh0L1GYY+T46o5rD+9lEN36dZS43tw==}
+
+  prosemirror-dropcursor@1.8.4:
+    resolution: {integrity: sha512-VmKxhcA6a+h5oPSYmfF1ZNeQqPbyYaIxqZsKqeYCyTlPtrjUgNaHL3P8vVaO19oqAV0zuaM/axkowZHrB1P3Tg==}
+
+  prosemirror-gapcursor@1.4.1:
+    resolution: {integrity: sha512-pMdYaEnjNMSwl11yjEGtgTmLkR08m/Vl+Jj443167p9eB3HVQKhYCc4gmHVDsLPODfZfjr/MmirsdyZziXbQKw==}
+
+  prosemirror-history@1.5.1:
+    resolution: {integrity: sha512-onlwnqKvgtFg6srZOmDOAhlAy1FIHQpOExORybX0S+DvJepE5tPALrB9iGet/2sqqqrelSnB10OoiOJqAvu2DA==}
+
+  prosemirror-inputrules@1.5.1:
+    resolution: {integrity: sha512-7wj4uMjKaXWAQ1CDgxNzNtR9AlsuwzHfdFH1ygEHA2KHF2DOEaXl1CJfNPAKCg9qNEh4rum975QLaCiQPyY6Fw==}
+
+  prosemirror-keymap@1.2.3:
+    resolution: {integrity: sha512-4HucRlpiLd1IPQQXNqeo81BGtkY8Ai5smHhKW9jjPKRc2wQIxksg7Hl1tTI2IfT2B/LgX6bfYvXxEpJl7aKYKw==}
+
+  prosemirror-model@1.25.12:
+    resolution: {integrity: sha512-Ue2gTmXMa7EhpLNhC7J+h4+ykD8ha12K6rrZFFKKJHBForfIStw5gJ6Zrf1mqqAa9NmpmEB4wp9bKmA4eUVjWg==}
+
+  prosemirror-schema-list@1.5.1:
+    resolution: {integrity: sha512-927lFx/uwyQaGwJxLWCZRkjXG0p48KpMj6ueoYiu4JX05GGuGcgzAy62dfiV8eFZftgyBUvLx76RsMe20fJl+Q==}
+
+  prosemirror-state@1.4.4:
+    resolution: {integrity: sha512-6jiYHH2CIGbCfnxdHbXZ12gySFY/fz/ulZE333G6bPqIZ4F+TXo9ifiR86nAHpWnfoNjOb3o5ESi7J8Uz1jXHw==}
+
+  prosemirror-tables@1.8.5:
+    resolution: {integrity: sha512-V/0cDCsHKHe/tfWkeCmthNUcEp1IVO3p6vwN8XtwE9PZQLAZJigbw3QoraAdfJPir4NKJtNvOB8oYGKRl+t0Dw==}
+
+  prosemirror-transform@1.12.2:
+    resolution: {integrity: sha512-PE/aY0HEY4zczvmqrilgkUK/WautF0chvMqkmM/iN5/aPHvwrCWaQZjS6CIZp+K84YrvPFqrL+YArrfJX8xX7g==}
+
+  prosemirror-view@1.42.6:
+    resolution: {integrity: sha512-3g25f6hKV2bBxo3puH3EcYWmmVNSH0iWmNsMVT7sugDSpA025jgpOLarcDWr39SdzPjYMaiYtRdNtXialPSjEQ==}
+
   punycode.js@2.3.1:
     resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
     engines: {node: '>=6'}
@@ -6767,6 +6969,9 @@ packages:
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
+  rope-sequence@1.3.4:
+    resolution: {integrity: sha512-UT5EDe2cu2E/6O4igUr5PSFs23nvvukicWHx6GnOPlHAiiYbzNuCRQCuiUdHJQcqKalLKlrYJnjY0ySGsXNQXQ==}
+
   rou3@0.7.12:
     resolution: {integrity: sha512-iFE4hLDuloSWcD7mjdCDhx2bKcIsYbtOTpfH5MHHLSKMOUyjqQXTeZVa289uuwEGEKFoE/BAPbhaU4B774nceg==}
 
@@ -6789,6 +6994,9 @@ packages:
   safer-buffer@2.1.2:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
 
+  sanitize-html@2.17.0:
+    resolution: {integrity: sha512-dLAADUSS8rBwhaevT12yCezvioCA+bmUTPH/u57xKPT8d++voeYE6HeluA/bPbQ15TwDBG2ii+QZIEmYx8VdxA==}
+
   satori-html@0.3.2:
     resolution: {integrity: sha512-wjTh14iqADFKDK80e51/98MplTGfxz2RmIzh0GqShlf4a67+BooLywF17TvJPD6phO0Hxm7Mf1N5LtRYvdkYRA==}
 
@@ -7660,6 +7868,12 @@ packages:
       nuxt:
         optional: true
 
+  vue-tsc@3.2.0:
+    resolution: {integrity: sha512-NFhcKKQZeTuG8/gc8XwFANx/lC0Dd3dCZ97TWh1a63PcD22KkFy4QLeT8JMtduaQT1NzySWmx3qXm16Hj1Xsxg==}
+    hasBin: true
+    peerDependencies:
+      typescript: '>=5.0.0'
+
   vue@3.5.30:
     resolution: {integrity: sha512-hTHLc6VNZyzzEH/l7PFGjpcTvUgiaPK5mdLkbjrTeWSRcEfxFrv56g/XckIYlE9ckuobsdwqd5mk2g1sBkMewg==}
     peerDependencies:
@@ -8249,20 +8463,6 @@ snapshots:
       '@codemirror/view': 6.40.0
       '@lezer/common': 1.5.1
 
-  '@codemirror/lang-angular@0.1.4':
-    dependencies:
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/lang-javascript': 6.2.5
-      '@codemirror/language': 6.12.2
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-cpp@6.0.3':
-    dependencies:
-      '@codemirror/language': 6.12.2
-      '@lezer/cpp': 1.1.5
-
   '@codemirror/lang-css@6.3.1':
     dependencies:
       '@codemirror/autocomplete': 6.20.1
@@ -8271,14 +8471,6 @@ snapshots:
       '@lezer/common': 1.5.1
       '@lezer/css': 1.3.1
 
-  '@codemirror/lang-go@6.0.1':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/go': 1.0.1
-
   '@codemirror/lang-html@6.4.11':
     dependencies:
       '@codemirror/autocomplete': 6.20.1
@@ -8291,11 +8483,6 @@ snapshots:
       '@lezer/css': 1.3.1
       '@lezer/html': 1.3.13
 
-  '@codemirror/lang-java@6.0.2':
-    dependencies:
-      '@codemirror/language': 6.12.2
-      '@lezer/java': 1.1.3
-
   '@codemirror/lang-javascript@6.2.5':
     dependencies:
       '@codemirror/autocomplete': 6.20.1
@@ -8306,38 +8493,6 @@ snapshots:
       '@lezer/common': 1.5.1
       '@lezer/javascript': 1.5.4
 
-  '@codemirror/lang-jinja@6.0.0':
-    dependencies:
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/language': 6.12.2
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-json@6.0.2':
-    dependencies:
-      '@codemirror/language': 6.12.2
-      '@lezer/json': 1.0.3
-
-  '@codemirror/lang-less@6.0.2':
-    dependencies:
-      '@codemirror/lang-css': 6.3.1
-      '@codemirror/language': 6.12.2
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-liquid@6.3.2':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@codemirror/view': 6.40.0
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@codemirror/lang-markdown@6.5.0':
     dependencies:
       '@codemirror/autocomplete': 6.20.1
@@ -8348,105 +8503,6 @@ snapshots:
       '@lezer/common': 1.5.1
       '@lezer/markdown': 1.6.3
 
-  '@codemirror/lang-php@6.0.2':
-    dependencies:
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/php': 1.0.5
-
-  '@codemirror/lang-python@6.2.1':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/python': 1.1.18
-
-  '@codemirror/lang-rust@6.0.2':
-    dependencies:
-      '@codemirror/language': 6.12.2
-      '@lezer/rust': 1.0.2
-
-  '@codemirror/lang-sass@6.0.2':
-    dependencies:
-      '@codemirror/lang-css': 6.3.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/sass': 1.1.0
-
-  '@codemirror/lang-sql@6.10.0':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-vue@0.1.3':
-    dependencies:
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/lang-javascript': 6.2.5
-      '@codemirror/language': 6.12.2
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-wast@6.0.2':
-    dependencies:
-      '@codemirror/language': 6.12.2
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@codemirror/lang-xml@6.1.0':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@codemirror/view': 6.40.0
-      '@lezer/common': 1.5.1
-      '@lezer/xml': 1.0.6
-
-  '@codemirror/lang-yaml@6.1.2':
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/language': 6.12.2
-      '@codemirror/state': 6.6.0
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-      '@lezer/yaml': 1.0.4
-
-  '@codemirror/language-data@6.5.2':
-    dependencies:
-      '@codemirror/lang-angular': 0.1.4
-      '@codemirror/lang-cpp': 6.0.3
-      '@codemirror/lang-css': 6.3.1
-      '@codemirror/lang-go': 6.0.1
-      '@codemirror/lang-html': 6.4.11
-      '@codemirror/lang-java': 6.0.2
-      '@codemirror/lang-javascript': 6.2.5
-      '@codemirror/lang-jinja': 6.0.0
-      '@codemirror/lang-json': 6.0.2
-      '@codemirror/lang-less': 6.0.2
-      '@codemirror/lang-liquid': 6.3.2
-      '@codemirror/lang-markdown': 6.5.0
-      '@codemirror/lang-php': 6.0.2
-      '@codemirror/lang-python': 6.2.1
-      '@codemirror/lang-rust': 6.0.2
-      '@codemirror/lang-sass': 6.0.2
-      '@codemirror/lang-sql': 6.10.0
-      '@codemirror/lang-vue': 0.1.3
-      '@codemirror/lang-wast': 6.0.2
-      '@codemirror/lang-xml': 6.1.0
-      '@codemirror/lang-yaml': 6.1.2
-      '@codemirror/language': 6.12.2
-      '@codemirror/legacy-modes': 6.5.2
-
   '@codemirror/language@6.12.2':
     dependencies:
       '@codemirror/state': 6.6.0
@@ -8456,22 +8512,12 @@ snapshots:
       '@lezer/lr': 1.4.8
       style-mod: 4.1.3
 
-  '@codemirror/legacy-modes@6.5.2':
-    dependencies:
-      '@codemirror/language': 6.12.2
-
   '@codemirror/lint@6.9.5':
     dependencies:
       '@codemirror/state': 6.6.0
       '@codemirror/view': 6.40.0
       crelt: 1.0.6
 
-  '@codemirror/search@6.6.0':
-    dependencies:
-      '@codemirror/state': 6.6.0
-      '@codemirror/view': 6.40.0
-      crelt: 1.0.6
-
   '@codemirror/state@6.6.0':
     dependencies:
       '@marijn/find-cluster-break': 1.0.2
@@ -9152,24 +9198,12 @@ snapshots:
 
   '@lezer/common@1.5.1': {}
 
-  '@lezer/cpp@1.1.5':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@lezer/css@1.3.1':
     dependencies:
       '@lezer/common': 1.5.1
       '@lezer/highlight': 1.2.3
       '@lezer/lr': 1.4.8
 
-  '@lezer/go@1.0.1':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@lezer/highlight@1.2.3':
     dependencies:
       '@lezer/common': 1.5.1
@@ -9180,24 +9214,12 @@ snapshots:
       '@lezer/highlight': 1.2.3
       '@lezer/lr': 1.4.8
 
-  '@lezer/java@1.1.3':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@lezer/javascript@1.5.4':
     dependencies:
       '@lezer/common': 1.5.1
       '@lezer/highlight': 1.2.3
       '@lezer/lr': 1.4.8
 
-  '@lezer/json@1.0.3':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@lezer/lr@1.4.8':
     dependencies:
       '@lezer/common': 1.5.1
@@ -9207,42 +9229,6 @@ snapshots:
       '@lezer/common': 1.5.1
       '@lezer/highlight': 1.2.3
 
-  '@lezer/php@1.0.5':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@lezer/python@1.1.18':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@lezer/rust@1.0.2':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@lezer/sass@1.1.0':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@lezer/xml@1.0.6':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
-  '@lezer/yaml@1.0.4':
-    dependencies:
-      '@lezer/common': 1.5.1
-      '@lezer/highlight': 1.2.3
-      '@lezer/lr': 1.4.8
-
   '@lukeed/csprng@1.1.0': {}
 
   '@lukeed/uuid@2.0.1':
@@ -9821,7 +9807,7 @@ snapshots:
     transitivePeerDependencies:
       - magicast
 
-  '@nuxt/nitro-server@4.3.1(a257c3c373146dbd7185e42f02f8356e)':
+  '@nuxt/nitro-server@4.3.1(d9826c555e756756348b06f3a55b1b06)':
     dependencies:
       '@nuxt/devalue': 2.0.2
       '@nuxt/kit': 4.3.1(magicast@0.5.2)
@@ -9839,7 +9825,7 @@ snapshots:
       klona: 2.0.6
       mocked-exports: 0.1.1
       nitropack: 2.13.1(@electric-sql/pglite@0.3.15)(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3)(rolldown@1.0.0-beta.57)
-      nuxt: 4.3.1(c29c93111529fcace22186acccc6be3b)
+      nuxt: 4.3.1(0e1cd30fef78be60f5de7f28c90a6150)
       ohash: 2.0.11
       pathe: 2.0.3
       pkg-types: 2.3.0
@@ -9904,7 +9890,7 @@ snapshots:
       rc9: 3.0.0
       std-env: 3.10.0
 
-  '@nuxt/vite-builder@4.3.1(@types/node@25.6.0)(eslint@9.39.4(jiti@2.6.1))(lightningcss@1.31.1)(magicast@0.5.2)(nuxt@4.3.1(c29c93111529fcace22186acccc6be3b))(optionator@0.9.4)(rolldown@1.0.0-beta.57)(rollup@4.59.0)(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3))(yaml@2.8.2)':
+  '@nuxt/vite-builder@4.3.1(@types/node@25.6.0)(eslint@9.39.4(jiti@2.6.1))(lightningcss@1.31.1)(magicast@0.5.2)(nuxt@4.3.1(0e1cd30fef78be60f5de7f28c90a6150))(optionator@0.9.4)(rolldown@1.0.0-beta.57)(rollup@4.59.0)(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))(vue@3.5.30(typescript@5.9.3))(yaml@2.8.2)':
     dependencies:
       '@nuxt/kit': 4.3.1(magicast@0.5.2)
       '@rollup/plugin-replace': 6.0.3(rollup@4.59.0)
@@ -9923,7 +9909,7 @@ snapshots:
       magic-string: 0.30.21
       mlly: 1.8.1
       mocked-exports: 0.1.1
-      nuxt: 4.3.1(c29c93111529fcace22186acccc6be3b)
+      nuxt: 4.3.1(0e1cd30fef78be60f5de7f28c90a6150)
       pathe: 2.0.3
       pkg-types: 2.3.0
       postcss: 8.5.8
@@ -9934,7 +9920,7 @@ snapshots:
       unenv: 2.0.0-rc.24
       vite: 7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
       vite-node: 5.3.0(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
-      vite-plugin-checker: 0.12.0(eslint@9.39.4(jiti@2.6.1))(optionator@0.9.4)(typescript@5.9.3)(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
+      vite-plugin-checker: 0.12.0(eslint@9.39.4(jiti@2.6.1))(optionator@0.9.4)(typescript@5.9.3)(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-tsc@3.2.0(typescript@5.9.3))
       vue: 3.5.30(typescript@5.9.3)
       vue-bundle-renderer: 2.2.0
     optionalDependencies:
@@ -9964,7 +9950,7 @@ snapshots:
       - vue-tsc
       - yaml
 
-  '@nuxthub/core@0.10.7(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)(magicast@0.5.2)(typescript@5.9.3)':
+  '@nuxthub/core@0.10.7(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)(magicast@0.5.2)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))':
     dependencies:
       '@cloudflare/workers-types': 4.20260307.1
       '@nuxt/kit': 4.3.1(magicast@0.5.2)
@@ -9986,7 +9972,7 @@ snapshots:
       scule: 1.3.0
       std-env: 3.10.0
       tinyglobby: 0.2.15
-      tsdown: 0.18.4(typescript@5.9.3)
+      tsdown: 0.18.4(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))
       ufo: 1.6.3
       uncrypto: 0.1.3
       unstorage: 1.17.4(@vercel/blob@2.3.3)(aws4fetch@1.0.20)(db0@0.3.4(@electric-sql/pglite@0.3.15)(drizzle-orm@0.45.2(@cloudflare/workers-types@4.20260307.1)(@electric-sql/pglite@0.3.15)(@prisma/client@7.4.2(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3))(typescript@5.9.3))(@types/pg@8.23.1)(kysely@0.29.6)(mysql2@3.15.3)(pg@8.23.0)(postgres@3.4.9)(prisma@7.4.2(@types/react@19.2.14)(magicast@0.5.2)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(typescript@5.9.3)))(mysql2@3.15.3))(ioredis@5.10.0)
@@ -11092,6 +11078,187 @@ snapshots:
       '@tanstack/virtual-core': 3.13.21
       vue: 3.5.30(typescript@5.9.3)
 
+  '@tiptap/core@3.32.0(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-blockquote@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-bold@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-bubble-menu@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@floating-ui/dom': 1.7.6
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+    optional: true
+
+  '@tiptap/extension-bullet-list@3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extension-list': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-code-block@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-code@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-document@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-dropcursor@3.32.0(@tiptap/extensions@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extensions': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-floating-menu@3.32.0(@floating-ui/dom@1.7.6)(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@floating-ui/dom': 1.7.6
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+    optional: true
+
+  '@tiptap/extension-gapcursor@3.32.0(@tiptap/extensions@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extensions': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-hard-break@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-heading@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-horizontal-rule@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-image@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-italic@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-link@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+      linkifyjs: 4.3.3
+
+  '@tiptap/extension-list-item@3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extension-list': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-list-keymap@3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extension-list': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-ordered-list@3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/extension-list': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-paragraph@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-strike@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-table@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/extension-text@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extension-underline@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+
+  '@tiptap/extensions@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/markdown@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+      marked: 17.0.6
+
+  '@tiptap/pm@3.32.0':
+    dependencies:
+      prosemirror-changeset: 2.4.4
+      prosemirror-commands: 1.7.2
+      prosemirror-dropcursor: 1.8.4
+      prosemirror-gapcursor: 1.4.1
+      prosemirror-history: 1.5.1
+      prosemirror-inputrules: 1.5.1
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.12
+      prosemirror-schema-list: 1.5.1
+      prosemirror-state: 1.4.4
+      prosemirror-tables: 1.8.5
+      prosemirror-transform: 1.12.2
+      prosemirror-view: 1.42.6
+
+  '@tiptap/starter-kit@3.32.0':
+    dependencies:
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/extension-blockquote': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-bold': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-bullet-list': 3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-code': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-code-block': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-document': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-dropcursor': 3.32.0(@tiptap/extensions@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-gapcursor': 3.32.0(@tiptap/extensions@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-hard-break': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-heading': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-horizontal-rule': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-italic': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-link': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-list': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-list-item': 3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-list-keymap': 3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-ordered-list': 3.32.0(@tiptap/extension-list@3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0))
+      '@tiptap/extension-paragraph': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-strike': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-text': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extension-underline': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))
+      '@tiptap/extensions': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+
+  '@tiptap/vue-3@3.32.0(@floating-ui/dom@1.7.6)(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)(vue@3.5.30(typescript@5.9.3))':
+    dependencies:
+      '@floating-ui/dom': 1.7.6
+      '@tiptap/core': 3.32.0(@tiptap/pm@3.32.0)
+      '@tiptap/pm': 3.32.0
+      vue: 3.5.30(typescript@5.9.3)
+    optionalDependencies:
+      '@tiptap/extension-bubble-menu': 3.32.0(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+      '@tiptap/extension-floating-menu': 3.32.0(@floating-ui/dom@1.7.6)(@tiptap/core@3.32.0(@tiptap/pm@3.32.0))(@tiptap/pm@3.32.0)
+
   '@tybys/wasm-util@0.10.1':
     dependencies:
       tslib: 2.8.1
@@ -11150,6 +11317,10 @@ snapshots:
 
   '@types/resolve@1.20.2': {}
 
+  '@types/sanitize-html@2.16.0':
+    dependencies:
+      htmlparser2: 8.0.2
+
   '@types/trusted-types@2.0.7':
     optional: true
 
@@ -11366,10 +11537,6 @@ snapshots:
 
   '@uploadthing/mime-types@0.3.6': {}
 
-  '@vavt/copy2clipboard@1.0.3': {}
-
-  '@vavt/util@2.1.2': {}
-
   '@vercel/blob@2.3.3':
     dependencies:
       async-retry: 1.3.3
@@ -11472,12 +11639,24 @@ snapshots:
       tinyrainbow: 3.1.0
     optional: true
 
+  '@volar/language-core@2.4.27':
+    dependencies:
+      '@volar/source-map': 2.4.27
+
   '@volar/language-core@2.4.28':
     dependencies:
       '@volar/source-map': 2.4.28
 
+  '@volar/source-map@2.4.27': {}
+
   '@volar/source-map@2.4.28': {}
 
+  '@volar/typescript@2.4.27':
+    dependencies:
+      '@volar/language-core': 2.4.27
+      path-browserify: 1.0.1
+      vscode-uri: 3.1.0
+
   '@vue-macros/common@3.1.2(vue@3.5.30(typescript@5.9.3))':
     dependencies:
       '@vue/compiler-sfc': 3.5.29
@@ -11625,6 +11804,16 @@ snapshots:
 
   '@vue/devtools-shared@8.1.1': {}
 
+  '@vue/language-core@3.2.0':
+    dependencies:
+      '@volar/language-core': 2.4.27
+      '@vue/compiler-dom': 3.5.30
+      '@vue/shared': 3.5.30
+      alien-signals: 3.1.2
+      muggle-string: 0.4.1
+      path-browserify: 1.0.1
+      picomatch: 4.0.3
+
   '@vue/language-core@3.2.5':
     dependencies:
       '@volar/language-core': 2.4.28
@@ -12120,16 +12309,6 @@ snapshots:
 
   cluster-key-slot@1.1.2: {}
 
-  codemirror@6.0.2:
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/commands': 6.10.3
-      '@codemirror/language': 6.12.2
-      '@codemirror/lint': 6.9.5
-      '@codemirror/search': 6.6.0
-      '@codemirror/state': 6.6.0
-      '@codemirror/view': 6.40.0
-
   color-convert@2.0.1:
     dependencies:
       color-name: 1.1.4
@@ -12197,6 +12376,8 @@ snapshots:
 
   croner@9.1.0: {}
 
+  cropperjs@1.6.2: {}
+
   cross-spawn@7.0.6:
     dependencies:
       path-key: 3.1.1
@@ -12247,7 +12428,8 @@ snapshots:
 
   cssesc@3.0.0: {}
 
-  cssfilter@0.0.10: {}
+  cssfilter@0.0.10:
+    optional: true
 
   cssnano-preset-default@7.0.11(postcss@8.5.8):
     dependencies:
@@ -13092,6 +13274,13 @@ snapshots:
 
   html-entities@2.6.0: {}
 
+  htmlparser2@8.0.2:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      domutils: 3.2.2
+      entities: 4.5.0
+
   http-errors@2.0.1:
     dependencies:
       depd: 2.0.0
@@ -13260,6 +13449,8 @@ snapshots:
 
   is-plain-obj@4.1.0: {}
 
+  is-plain-object@5.1.0: {}
+
   is-property@1.0.2:
     optional: true
 
@@ -13452,6 +13643,8 @@ snapshots:
     dependencies:
       uc.micro: 2.1.0
 
+  linkifyjs@4.3.3: {}
+
   listhen@1.9.0:
     dependencies:
       '@parcel/watcher': 2.5.6
@@ -13522,10 +13715,6 @@ snapshots:
   lru.min@1.1.4:
     optional: true
 
-  lucide-vue-next@0.543.0(vue@3.5.30(typescript@5.9.3)):
-    dependencies:
-      vue: 3.5.30(typescript@5.9.3)
-
   lucide-vue-next@0.577.0(vue@3.5.30(typescript@5.9.3)):
     dependencies:
       vue: 3.5.30(typescript@5.9.3)
@@ -13554,10 +13743,6 @@ snapshots:
       '@babel/types': 7.29.0
       source-map-js: 1.2.1
 
-  markdown-it-image-figures@2.1.1(markdown-it@14.1.1):
-    dependencies:
-      markdown-it: 14.1.1
-
   markdown-it-sub@2.0.0: {}
 
   markdown-it-sup@2.0.0: {}
@@ -13573,31 +13758,9 @@ snapshots:
 
   markdown-table@3.0.4: {}
 
-  marky@1.3.0: {}
+  marked@17.0.6: {}
 
-  md-editor-v3@6.4.2(vue@3.5.30(typescript@5.9.3)):
-    dependencies:
-      '@codemirror/autocomplete': 6.20.1
-      '@codemirror/commands': 6.10.3
-      '@codemirror/lang-markdown': 6.5.0
-      '@codemirror/language': 6.12.2
-      '@codemirror/language-data': 6.5.2
-      '@codemirror/search': 6.6.0
-      '@codemirror/state': 6.6.0
-      '@codemirror/view': 6.40.0
-      '@lezer/highlight': 1.2.3
-      '@types/markdown-it': 14.1.2
-      '@vavt/copy2clipboard': 1.0.3
-      '@vavt/util': 2.1.2
-      codemirror: 6.0.2
-      lucide-vue-next: 0.543.0(vue@3.5.30(typescript@5.9.3))
-      markdown-it: 14.1.1
-      markdown-it-image-figures: 2.1.1(markdown-it@14.1.1)
-      markdown-it-sub: 2.0.0
-      markdown-it-sup: 2.0.0
-      medium-zoom: 1.1.0
-      vue: 3.5.30(typescript@5.9.3)
-      xss: 1.0.15
+  marky@1.3.0: {}
 
   mdast-util-find-and-replace@3.0.2:
     dependencies:
@@ -13707,8 +13870,6 @@ snapshots:
 
   mdurl@2.0.0: {}
 
-  medium-zoom@1.1.0: {}
-
   memory-pager@1.5.0:
     optional: true
 
@@ -14308,16 +14469,16 @@ snapshots:
       - vite
       - vue
 
-  nuxt@4.3.1(c29c93111529fcace22186acccc6be3b):
+  nuxt@4.3.1(0e1cd30fef78be60f5de7f28c90a6150):
     dependencies:
       '@dxup/nuxt': 0.3.2(magicast@0.5.2)
       '@nuxt/cli': 3.33.1(@nuxt/schema@4.3.1)(cac@6.7.14)(magicast@0.5.2)
       '@nuxt/devtools': 3.2.2(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue@3.5.30(typescript@5.9.3))
       '@nuxt/kit': 4.3.1(magicast@0.5.2)
-      '@nuxt/nitro-server': 4.3.1(a257c3c373146dbd7185e42f02f8356e)
+      '@nuxt/nitro-server': 4.3.1(d9826c555e756756348b06f3a55b1b06)
       '@nuxt/schema': 4.3.1
       '@nuxt/telemetry': 2.7.0(@nuxt/kit@4.3.1(magicast@0.5.2))
-      '@nuxt/vite-builder': 4.3.1(@types/node@25.6.0)(eslint@9.39.4(jiti@2.6.1))(lightningcss@1.31.1)(magicast@0.5.2)(nuxt@4.3.1(c29c93111529fcace22186acccc6be3b))(optionator@0.9.4)(rolldown@1.0.0-beta.57)(rollup@4.59.0)(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3))(yaml@2.8.2)
+      '@nuxt/vite-builder': 4.3.1(@types/node@25.6.0)(eslint@9.39.4(jiti@2.6.1))(lightningcss@1.31.1)(magicast@0.5.2)(nuxt@4.3.1(0e1cd30fef78be60f5de7f28c90a6150))(optionator@0.9.4)(rolldown@1.0.0-beta.57)(rollup@4.59.0)(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))(vue@3.5.30(typescript@5.9.3))(yaml@2.8.2)
       '@unhead/vue': 2.1.13(vue@3.5.30(typescript@5.9.3))
       '@vue/shared': 3.5.29
       c12: 3.3.3(magicast@0.5.2)
@@ -14489,6 +14650,8 @@ snapshots:
       type-check: 0.4.0
       word-wrap: 1.2.5
 
+  orderedmap@2.1.1: {}
+
   oxc-minify@0.112.0:
     optionalDependencies:
       '@oxc-minify/binding-android-arm-eabi': 0.112.0
@@ -14653,6 +14816,8 @@ snapshots:
 
   parse-ms@4.0.0: {}
 
+  parse-srcset@1.0.2: {}
+
   parse-statements@1.0.11: {}
 
   parseurl@1.3.3: {}
@@ -14980,6 +15145,80 @@ snapshots:
       signal-exit: 3.0.7
     optional: true
 
+  prosemirror-changeset@2.4.4:
+    dependencies:
+      prosemirror-transform: 1.12.2
+
+  prosemirror-commands@1.7.2:
+    dependencies:
+      prosemirror-model: 1.25.12
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+
+  prosemirror-dropcursor@1.8.4:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+      prosemirror-view: 1.42.6
+
+  prosemirror-gapcursor@1.4.1:
+    dependencies:
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.12
+      prosemirror-state: 1.4.4
+      prosemirror-view: 1.42.6
+
+  prosemirror-history@1.5.1:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+      prosemirror-view: 1.42.6
+      rope-sequence: 1.3.4
+
+  prosemirror-inputrules@1.5.1:
+    dependencies:
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+
+  prosemirror-keymap@1.2.3:
+    dependencies:
+      prosemirror-state: 1.4.4
+      w3c-keyname: 2.2.8
+
+  prosemirror-model@1.25.12:
+    dependencies:
+      orderedmap: 2.1.1
+
+  prosemirror-schema-list@1.5.1:
+    dependencies:
+      prosemirror-model: 1.25.12
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+
+  prosemirror-state@1.4.4:
+    dependencies:
+      prosemirror-model: 1.25.12
+      prosemirror-transform: 1.12.2
+      prosemirror-view: 1.42.6
+
+  prosemirror-tables@1.8.5:
+    dependencies:
+      prosemirror-keymap: 1.2.3
+      prosemirror-model: 1.25.12
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+      prosemirror-view: 1.42.6
+
+  prosemirror-transform@1.12.2:
+    dependencies:
+      prosemirror-model: 1.25.12
+
+  prosemirror-view@1.42.6:
+    dependencies:
+      prosemirror-model: 1.25.12
+      prosemirror-state: 1.4.4
+      prosemirror-transform: 1.12.2
+
   punycode.js@2.3.1: {}
 
   punycode@2.3.1: {}
@@ -15146,7 +15385,7 @@ snapshots:
 
   rfdc@1.4.1: {}
 
-  rolldown-plugin-dts@0.20.0(rolldown@1.0.0-beta.57)(typescript@5.9.3):
+  rolldown-plugin-dts@0.20.0(rolldown@1.0.0-beta.57)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3)):
     dependencies:
       '@babel/generator': 7.29.1
       '@babel/parser': 7.29.0
@@ -15159,6 +15398,7 @@ snapshots:
       rolldown: 1.0.0-beta.57
     optionalDependencies:
       typescript: 5.9.3
+      vue-tsc: 3.2.0(typescript@5.9.3)
     transitivePeerDependencies:
       - oxc-resolver
 
@@ -15243,6 +15483,8 @@ snapshots:
       '@rollup/rollup-win32-x64-msvc': 4.59.0
       fsevents: 2.3.3
 
+  rope-sequence@1.3.4: {}
+
   rou3@0.7.12: {}
 
   rou3@0.9.2: {}
@@ -15259,6 +15501,15 @@ snapshots:
 
   safer-buffer@2.1.2: {}
 
+  sanitize-html@2.17.0:
+    dependencies:
+      deepmerge: 4.3.1
+      escape-string-regexp: 4.0.0
+      htmlparser2: 8.0.2
+      is-plain-object: 5.1.0
+      parse-srcset: 1.0.2
+      postcss: 8.5.8
+
   satori-html@0.3.2:
     dependencies:
       ultrahtml: 1.6.0
@@ -15670,7 +15921,7 @@ snapshots:
     dependencies:
       typescript: 5.9.3
 
-  tsdown@0.18.4(typescript@5.9.3):
+  tsdown@0.18.4(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3)):
     dependencies:
       ansis: 4.2.0
       cac: 6.7.14
@@ -15681,7 +15932,7 @@ snapshots:
       obug: 2.1.1
       picomatch: 4.0.3
       rolldown: 1.0.0-beta.57
-      rolldown-plugin-dts: 0.20.0(rolldown@1.0.0-beta.57)(typescript@5.9.3)
+      rolldown-plugin-dts: 0.20.0(rolldown@1.0.0-beta.57)(typescript@5.9.3)(vue-tsc@3.2.0(typescript@5.9.3))
       semver: 7.7.4
       tinyexec: 1.0.2
       tinyglobby: 0.2.15
@@ -16001,7 +16252,7 @@ snapshots:
       - tsx
       - yaml
 
-  vite-plugin-checker@0.12.0(eslint@9.39.4(jiti@2.6.1))(optionator@0.9.4)(typescript@5.9.3)(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)):
+  vite-plugin-checker@0.12.0(eslint@9.39.4(jiti@2.6.1))(optionator@0.9.4)(typescript@5.9.3)(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-tsc@3.2.0(typescript@5.9.3)):
     dependencies:
       '@babel/code-frame': 7.29.0
       chokidar: 4.0.3
@@ -16016,6 +16267,7 @@ snapshots:
       eslint: 9.39.4(jiti@2.6.1)
       optionator: 0.9.4
       typescript: 5.9.3
+      vue-tsc: 3.2.0(typescript@5.9.3)
 
   vite-plugin-inspect@11.3.3(@nuxt/kit@4.3.1(magicast@0.5.2))(vite@7.3.1(@types/node@25.6.0)(jiti@2.6.1)(lightningcss@1.31.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)):
     dependencies:
@@ -16150,11 +16402,17 @@ snapshots:
       '@vue/compiler-sfc': 3.5.30
       pinia: 3.0.4(typescript@5.9.3)(vue@3.5.30(typescript@5.9.3))
 
-  vue-sonner@2.0.9(@nuxt/kit@4.3.1(magicast@0.5.2))(@nuxt/schema@4.3.1)(nuxt@4.3.1(c29c93111529fcace22186acccc6be3b)):
+  vue-sonner@2.0.9(@nuxt/kit@4.3.1(magicast@0.5.2))(@nuxt/schema@4.3.1)(nuxt@4.3.1(0e1cd30fef78be60f5de7f28c90a6150)):
     optionalDependencies:
       '@nuxt/kit': 4.3.1(magicast@0.5.2)
       '@nuxt/schema': 4.3.1
-      nuxt: 4.3.1(c29c93111529fcace22186acccc6be3b)
+      nuxt: 4.3.1(0e1cd30fef78be60f5de7f28c90a6150)
+
+  vue-tsc@3.2.0(typescript@5.9.3):
+    dependencies:
+      '@volar/typescript': 2.4.27
+      '@vue/language-core': 3.2.0
+      typescript: 5.9.3
 
   vue@3.5.30(typescript@5.9.3):
     dependencies:
@@ -16235,6 +16493,7 @@ snapshots:
     dependencies:
       commander: 2.20.3
       cssfilter: 0.0.10
+    optional: true
 
   xtend@4.0.2: {}
 
diff --git a/scripts/test-markdown-editor-browser.mjs b/scripts/test-markdown-editor-browser.mjs
new file mode 100644
index 00000000..ddae357c
--- /dev/null
+++ b/scripts/test-markdown-editor-browser.mjs
@@ -0,0 +1,1343 @@
+import { createRequire } from 'node:module'
+import { strict as assert } from 'node:assert'
+import { resolve } from 'node:path'
+import { mkdir, readFile, writeFile } from 'node:fs/promises'
+import { chromium } from 'playwright-core'
+const require = createRequire(import.meta.url)
+const nuxtRequire = createRequire(require.resolve('nuxt/package.json'))
+const builderRequire = createRequire(nuxtRequire.resolve('@nuxt/vite-builder'))
+const { createServer } = await import(builderRequire.resolve('vite'))
+const { default: vue } = await import(builderRequire.resolve('@vitejs/plugin-vue'))
+const tailwindRequire = createRequire(import.meta.resolve('@nuxtjs/tailwindcss'))
+const { default: tailwindcss } = await import(tailwindRequire.resolve('@tailwindcss/vite'))
+const root = resolve(import.meta.dirname, '..')
+const server = await createServer({ root, configFile: false, plugins: [vue(), tailwindcss()], optimizeDeps: { noDiscovery: true, include: ['vue', 'reka-ui', '@vueuse/core', 'class-variance-authority', 'clsx', 'tailwind-merge', 'diff', '@codemirror/state', '@codemirror/view', '@codemirror/commands', '@codemirror/lang-markdown', '@codemirror/language', 'markdown-it-sub', 'markdown-it-sup', 'markdown-it', 'sanitize-html', 'dompurify', 'lucide-vue-next', '@tiptap/vue-3', '@tiptap/core', '@tiptap/pm/state', '@tiptap/pm/view', '@tiptap/pm/history', '@tiptap/extensions', '@tiptap/markdown', '@tiptap/starter-kit', '@tiptap/extension-code', '@tiptap/extension-code-block', '@tiptap/extension-image', '@tiptap/extension-link', '@tiptap/extension-table', '@tiptap/extension-list'] }, resolve: { alias: { '@': `${root}/app`, '~': `${root}/app`, vue: nuxtRequire.resolve('vue/dist/vue.esm-bundler.js') }, dedupe: ['vue'] }, server: { host: '127.0.0.1', port: 0 } })
+await server.listen()
+const browser = await chromium.launch({ headless: true, executablePath: process.env.CHROMIUM_PATH || undefined })
+const page = await browser.newPage()
+const failures = []
+page.on('pageerror', error => { failures.push(error.message); console.error(error.stack) })
+let assertions = 0
+const check = async (name, fn) => { if (process.env.EDITOR_TEST_FILTER && !new RegExp(process.env.EDITOR_TEST_FILTER).test(name)) return; await fn(); assertions++; console.log(`PASS ${name}`) }
+try {
+  await page.goto(`${server.resolvedUrls.local[0]}tests/fixtures/markdown-editor/index.html`, { waitUntil: 'domcontentloaded', timeout: 120000 })
+  const rawField = () => ({
+    waitFor: () => page.locator('#full .cm-content').waitFor({state:'visible'}),
+    inputValue: () => page.evaluate(() => window.fixture.instance.value.getEditorView().state.doc.toString()),
+    fill: value => page.evaluate(value => { const view = window.fixture.instance.value.getEditorView(); view.dispatch({changes:{from:0,to:view.state.doc.length,insert:value},selection:{anchor:value.length}}) }, value),
+    focus: () => page.locator('#full .cm-content').focus(),
+    press: key => page.locator('#full .cm-content').press(key),
+    count: async () => (await page.locator('#full .cm-content').isVisible()) ? 1 : 0,
+  })
+  const insertTable = async () => {
+    await page.getByRole('button', {name:'table',exact:true}).hover()
+    const cell=page.locator('.fdl-tool-menu .md-editor-table-shape-row').nth(2).locator('.md-editor-table-shape-col').nth(2)
+    await cell.hover()
+    if (await page.locator('#full .fdl-markdown-editor').evaluate(el => el.hasAttribute('data-toolbar-collapsed'))) {
+      await page.waitForTimeout(220)
+      assert.equal(await cell.isVisible(), true, 'overflow stays open while selecting a table size')
+    }
+    await cell.click()
+  }
+  const field = page.locator('#full .tiptap')
+  await field.waitFor({ timeout: 120000 })
+  // Local IP addresses may be served over HTTP without this secure-context API.
+  await page.evaluate(() => { Object.defineProperty(crypto, 'randomUUID', { value: undefined, configurable: true }) })
+  await check('existing dimensions and toolbar/footer slots', async () => {
+    assert.equal(Math.round((await page.locator('#full .fdl-markdown-editor').boundingBox()).height), 280)
+    assert.equal(await page.locator('#custom-tool').count(), 1)
+    assert.equal(await page.locator('#submit').count(), 1)
+  })
+  await check('no new controls on a toolbar-free entry', async () => {
+    assert.equal(await page.locator('#bare [role=toolbar]').count(), 0)
+    assert.equal(await page.locator('#bare .md-editor-footer').count(), 0)
+    assert.equal(await page.locator('#bare .fdl-editor-modes').count(), 0)
+    await page.locator('#bare .tiptap').fill('ordinary reply')
+    assert.equal(await page.evaluate(() => window.fixture.bare.value), 'ordinary reply')
+  })
+  await check('former default height and background are retained while callers can size the editor', async () => {
+    const frame = page.locator('#bare .fdl-markdown-editor')
+    const initialStyle = await frame.getAttribute('style')
+    await frame.evaluate(el => el.removeAttribute('style'))
+    assert.equal(Math.round((await frame.boundingBox()).height), 500)
+    await frame.evaluate(el => el.classList.add('caller-editor-height'))
+    assert.equal(Math.round((await frame.boundingBox()).height), 420, 'caller class overrides the editor default')
+    await frame.evaluate((el, style) => { el.classList.remove('caller-editor-height'); el.setAttribute('style', style) }, initialStyle)
+    for (const [theme, background] of [['light', 'rgb(255, 255, 255)'], ['dark', 'rgb(0, 0, 0)']]) {
+      await page.evaluate(theme => { window.theme.value = theme; document.documentElement.classList.toggle('dark', theme === 'dark') }, theme)
+      await page.waitForFunction(theme => document.querySelector('#full .fdl-markdown-editor').classList.contains('md-editor-dark') === (theme === 'dark'), theme)
+      assert.equal(await frame.evaluate(el => getComputedStyle(el).backgroundColor), background)
+      assert.equal(Math.round((await frame.boundingBox()).height), 160, 'explicit caller height remains intact')
+      assert.equal(Math.round((await page.locator('#full .fdl-markdown-editor').boundingBox()).height), 280)
+    }
+    await page.evaluate(() => { window.theme.value = 'light'; document.documentElement.classList.remove('dark') })
+  })
+  await check('Markdown heading input and parent echo preserve editing', async () => {
+    await field.click(); await page.keyboard.type('## Heading')
+    assert.equal(await field.locator('h2').innerText(), 'Heading')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), '## Heading')
+    await page.keyboard.type(' more')
+    assert.equal(await field.locator('h2').innerText(), 'Heading more')
+  })
+  await check('toggle bold on and off using the same control', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'hello' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+a')
+    await page.getByRole('button', { name: 'bold', exact: true }).click()
+    assert.equal(await field.locator('strong').innerText(), 'hello')
+    await page.getByRole('button', { name: 'bold', exact: true }).click()
+    assert.equal(await field.locator('strong').count(), 0)
+  })
+  await check('toolbar reflects pending bold, cursor, selection and mode changes', async () => {
+    const bold = page.getByRole('button', { name: 'bold', exact: true })
+    const pressed = async value => {
+      await page.waitForFunction(value => document.querySelector('#full [aria-label="bold"]').getAttribute('aria-pressed') === value, value)
+      assert.equal(await bold.evaluate(el => el.classList.contains('fdl-format-active')), value === 'true')
+    }
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await field.click()
+    await pressed('false')
+    await bold.click()
+    await pressed('true')
+    await page.keyboard.type('bold')
+    assert.equal(await field.locator('strong').innerText(), 'bold')
+    await pressed('true')
+    await bold.click()
+    await pressed('false')
+    await page.keyboard.type(' plain')
+    await field.locator('strong').click()
+    await pressed('true')
+    await page.keyboard.press('ControlOrMeta+End')
+    await pressed('false')
+    await field.locator('strong').evaluate(el => {
+      const range = document.createRange(); range.selectNodeContents(el)
+      const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range)
+      document.dispatchEvent(new Event('selectionchange'))
+    })
+    await pressed('true')
+    await page.evaluate(() => window.fixture.instance.value.setMode('source'))
+    await pressed(null)
+    await rawField().fill('plain')
+    await rawField().focus()
+    await page.keyboard.press('ControlOrMeta+a')
+    await bold.click()
+    assert.equal(await rawField().inputValue(), '**plain**')
+    await pressed(null)
+    await page.evaluate(() => window.fixture.instance.value.setMode('structured'))
+    await field.locator('strong').click()
+    await pressed('true')
+  })
+  await check('format selection and hover stay neutral with saturated brand tokens', async () => {
+    const bold = page.getByRole('button', { name: 'bold', exact: true })
+    for (const theme of ['light', 'dark']) {
+      await page.evaluate(theme => { window.theme.value = theme; document.documentElement.classList.toggle('dark', theme === 'dark'); window.fixture.value.value = 'format me' }, theme)
+      await field.click(); await page.keyboard.press('ControlOrMeta+a'); await bold.click()
+      assert.equal(await bold.getAttribute('aria-pressed'), 'true')
+      for (const hover of [false, true]) {
+        if (hover) await bold.hover()
+        else await page.mouse.move(0, 0)
+        const color = await bold.evaluate(el => {
+          const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d')
+          ctx.fillStyle = getComputedStyle(el).backgroundColor; ctx.fillRect(0, 0, 1, 1)
+          return [...ctx.getImageData(0, 0, 1, 1).data]
+        })
+        assert.ok(Math.max(...color.slice(0, 3)) - Math.min(...color.slice(0, 3)) < 10, `${theme} hover=${hover}: neutral format background ${color}`)
+      }
+      await bold.click()
+      assert.equal(await bold.getAttribute('aria-pressed'), 'false')
+    }
+    await page.evaluate(() => { window.theme.value = 'light'; document.documentElement.classList.remove('dark') })
+  })
+  await check('clicking within the final paragraph preserves the clicked caret position', async () => {
+    for (const multiline of [false, true]) {
+      const finalText = multiline ? 'Wrapped final paragraph '.repeat(30) : 'Click inside this final paragraph'
+      const prefix = Array.from({ length: 30 }, (_, i) => `Earlier paragraph ${i}`).join('\n\n') + '\n\n'
+      for (const offset of [5, finalText.length - 10]) {
+        await page.evaluate(value => { window.fixture.value.value = value }, prefix + finalText)
+        const last = field.locator(':scope > p').last()
+        await last.scrollIntoViewIfNeeded()
+        const point = await last.evaluate((el, offset) => {
+          const walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT)
+          const text = walker.nextNode(); const range = document.createRange()
+          range.setStart(text, offset); range.collapse(true)
+          const rect = range.getBoundingClientRect()
+          return { x: rect.x, y: rect.y + rect.height / 2 }
+        }, offset)
+        // Reveal the exact line in a long final paragraph before measuring again.
+        await page.locator('#full .fdl-rich-scroll').evaluate((el, point) => {
+          const rect = el.getBoundingClientRect()
+          if (point.y < rect.top + 10 || point.y > rect.bottom - 10) el.scrollTop += point.y - rect.top - rect.height / 2
+        }, point)
+        const click = await last.evaluate((el, offset) => {
+          const text = document.createTreeWalker(el, NodeFilter.SHOW_TEXT).nextNode()
+          const range = document.createRange(); range.setStart(text, offset); range.collapse(true)
+          const rect = range.getBoundingClientRect(); return { x: rect.x, y: rect.y + rect.height / 2 }
+        }, offset)
+        await page.mouse.click(click.x, click.y)
+        await page.keyboard.insertText('X')
+        assert.equal(await last.innerText(), finalText.slice(0, offset) + 'X' + finalText.slice(offset))
+      }
+    }
+  })
+  await check('all inline input formats and the editor DOM survive repeated mode changes', async () => {
+    const visual = page.getByRole('button', { name: 'Visual', exact: true })
+    const source = page.getByRole('button', { name: 'Source', exact: true })
+    for (const [name, tag, delimiter] of [['bold', 'strong', '**'], ['italic', 'em', '*'], ['strikethrough', 's', '~~'], ['inline code', 'code:not(.fdl-pending-code)', '`']]) {
+      await page.evaluate(() => { window.fixture.value.value = '' })
+      await field.click()
+      await field.evaluate(el => { window.retainedEditorDOM = el })
+      const button = page.getByRole('button', { name, exact: true })
+      await button.click()
+      const updates = await page.evaluate(() => window.fixture.updates.value)
+      for (let i = 0; i < 2; i++) {
+        await source.click()
+        assert.equal(await rawField().inputValue(), delimiter + delimiter, name)
+        await visual.click()
+        await page.waitForTimeout(100)
+        assert.equal(await button.getAttribute('aria-pressed'), 'true', name)
+        assert.equal(await field.evaluate(el => el === window.retainedEditorDOM), true, 'mode changes retain the same editor DOM')
+        assert.equal(await page.evaluate(() => window.fixture.updates.value), updates)
+      }
+      await source.click()
+      await page.keyboard.type('test')
+      assert.equal(await rawField().inputValue(), delimiter + 'test' + delimiter)
+      await visual.click()
+      await page.keyboard.type('X')
+      assert.equal(await field.locator(tag).innerText(), 'testX')
+      const expected = delimiter + 'testX' + delimiter
+      assert.equal(await page.evaluate(() => window.fixture.value.value), expected)
+      await source.click(); await visual.click()
+      assert.equal(await button.getAttribute('aria-pressed'), 'true')
+      assert.equal(await page.evaluate(() => window.fixture.value.value), expected)
+    }
+  })
+  await check('source caret outside inline delimiters continues as plain text', async () => {
+    for (const [markdown, name, tag] of [['`test`', 'inline code', 'code'], ['**test**', 'bold', 'strong'], ['*test*', 'italic', 'em']]) {
+      await page.evaluate(value => { window.fixture.value.value = value }, markdown)
+      await page.getByRole('button', { name: 'Source', exact: true }).click()
+      await rawField().focus(); await page.keyboard.press('ControlOrMeta+End')
+      await page.getByRole('button', { name: 'Visual', exact: true }).click()
+      assert.equal(await page.getByRole('button', { name, exact: true }).getAttribute('aria-pressed'), 'false')
+      await page.keyboard.type(' outside')
+      assert.equal(await field.locator(tag).innerText(), 'test')
+      assert.equal(await page.evaluate(() => window.fixture.value.value), markdown + ' outside')
+    }
+  })
+  await check('selection maps through original Markdown spacing without rewriting its bytes', async () => {
+    const original = '| Header   | Other |\n| -------- | ----- |\n| alpha beta | end |\n'
+    await page.evaluate(value => { window.fixture.value.value = value }, original)
+    const point = await field.locator('td p').first().evaluate(el => {
+      const range = document.createRange(); range.setStart(el.firstChild, 6); range.collapse(true)
+      const rect = range.getBoundingClientRect(); return { x: rect.x, y: rect.y + rect.height / 2 }
+    })
+    await page.mouse.click(point.x, point.y)
+    await page.getByRole('button', { name: 'Source', exact: true }).click()
+    const expected = original.indexOf('beta')
+    assert.equal(await page.evaluate(() => window.fixture.instance.value.getEditorView().state.selection.main.head), expected, JSON.stringify(await page.evaluate(() => ({ raw: window.fixture.instance.value.getEditorView().state.doc.toString(), body: window.fixture.value.value, node: window.getSelection()?.anchorNode?.textContent, offset: window.getSelection()?.anchorOffset }))))
+    assert.equal(await rawField().inputValue(), original)
+    await page.keyboard.type('X')
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await field.locator('td').first().innerText(), 'alpha Xbeta')
+    await page.keyboard.type('Y')
+    assert.equal(await field.locator('td').first().innerText(), 'alpha XYbeta')
+  })
+  await check('undo restores byte-identical original Markdown', async () => {
+    const original = '* first\n* second\n'
+    await page.evaluate(value => { window.fixture.value.value = value }, original)
+    await field.locator('li').last().click(); await page.keyboard.press('ControlOrMeta+End'); await page.keyboard.type(' extra')
+    await page.keyboard.press('ControlOrMeta+z')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), original)
+  })
+  await check('external replacement starts a new undo history', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'replacement' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+z')
+    assert.equal(await field.innerText(), 'replacement')
+  })
+  await check('plain Markdown paste keeps heading, list and inline formatting', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await field.focus()
+    await field.evaluate(el => {
+      const data = new DataTransfer(); data.setData('text/plain', '## Pasted\n\n- **bold**\n- second')
+      el.dispatchEvent(new ClipboardEvent('paste', { clipboardData: data, bubbles: true, cancelable: true }))
+    })
+    assert.equal(await field.locator('h2').innerText(), 'Pasted')
+    assert.equal(await field.locator('li').count(), 2)
+    assert.equal(await field.locator('strong').innerText(), 'bold')
+  })
+  await check('external plain-looking HTML paste retains the original FeedLog announcement without spacer paragraphs', async () => {
+    const text='FeedLog MCP is live! 🚀\n\nConnect your AI assistant to:\n• Organize feedback and draft replies\n• Write help articles\n• Draft and publish changelogs\nManage your authorized FeedLog data through conversation.\nGet started: https://help.feedlog.ai/mcp'
+    await page.evaluate(()=>{window.fixture.value.value=''})
+    await field.focus()
+    await field.evaluate((el,text)=>{
+      const data=new DataTransfer();data.setData('text/plain',text)
+      data.setData('text/html',text.split('\n').map(line=>line?`<p style="margin: 24px 0"><span style="white-space: pre-wrap">${line}</span></p><p><br></p>`:'<p><br></p>').join(''))
+      el.dispatchEvent(new ClipboardEvent('paste',{clipboardData:data,bubbles:true,cancelable:true}))
+    },text)
+    assert.equal(await field.locator('p').count(),2)
+    assert.equal(await field.locator('img').count(),0)
+    assert.equal(await page.evaluate(()=>window.fixture.value.value),text,'an empty editor keeps the exact pasted text')
+    const before=await field.innerText()
+    for(let i=0;i<3;i++){
+      await page.getByRole('button',{name:'Source',exact:true}).click();assert.equal(await rawField().inputValue(),text)
+      await page.getByRole('button',{name:'Visual',exact:true}).click();assert.equal(await field.innerText(),before)
+    }
+    await field.press('ControlOrMeta+End');await page.keyboard.type('!')
+    await page.getByRole('button',{name:'Source',exact:true}).click();const changed=await rawField().inputValue();assert.doesNotMatch(changed,/\n{3}/)
+    await page.getByRole('button',{name:'Visual',exact:true}).click();assert.equal(await field.locator('p').count(),2)
+  })
+  await check('rich paste retains formatting and code while emoji images become stable inline text', async () => {
+    await page.evaluate(()=>{window.fixture.value.value=''})
+    await field.focus();await field.evaluate(el=>{
+      const data=new DataTransfer();data.setData('text/plain','FeedLog MCP is live! 🚀\n\nConnect your assistant\n• Feedback\n  code 🚀\n\n  tail')
+      data.setData('text/html','<p><strong>FeedLog MCP is live!</strong> <img class="emoji" alt="🚀" style="width:1em;height:1em" src="https://cdn.jsdelivr.net/gh/twitter/twemoji/assets/72x72/1f680.png"></p><p><br></p><div><br></div><p>Connect <a href="https://example.com">your assistant</a></p><ul><li><p>Feedback</p></li></ul><pre><code>  code 🚀\n\n  tail</code></pre>')
+      el.dispatchEvent(new ClipboardEvent('paste',{clipboardData:data,bubbles:true,cancelable:true}))
+    })
+    assert.equal(await field.locator('img').count(),0)
+    assert.equal(await field.locator('strong').innerText(),'FeedLog MCP is live!')
+    assert.equal(await field.locator('a').getAttribute('href'),'https://example.com')
+    assert.equal(await field.locator('li').count(),1)
+    assert.equal(await field.locator('pre code').innerText(),'  code 🚀\n\n  tail')
+    assert.equal(await field.locator(':scope > p').count(),2)
+    for(let i=0;i<2;i++){
+      await page.getByRole('button',{name:'Source',exact:true}).click();assert.doesNotMatch(await rawField().inputValue(),/!\[🚀\]|twemoji/)
+      await page.getByRole('button',{name:'Visual',exact:true}).click();assert.equal(await field.locator('img').count(),0)
+    }
+    await field.locator('p').first().click();await page.keyboard.press('ControlOrMeta+End');await page.keyboard.type(' edited')
+    assert.match(await field.innerText(),/FeedLog MCP is live! 🚀/)
+  })
+  await check('Chinese composition events preserve committed text', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await field.focus()
+    await field.dispatchEvent('compositionstart', { data: '' })
+    await page.keyboard.insertText('中文输入测试')
+    await field.dispatchEvent('compositionend', { data: '中文输入测试' })
+    await page.waitForFunction(() => window.fixture.value.value.includes('中文输入测试'))
+    assert.equal(await field.innerText(), '中文输入测试')
+  })
+  await check('legacy attachment retains source, renders URL and survives editing', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '![alt](attachment:uploads/截屏 (1).png)' })
+    await field.locator('img[src]').waitFor()
+    assert.match(await field.locator('img[src]').getAttribute('src'), /\/api\/files\/uploads\//)
+    assert.equal(await page.evaluate(() => window.fixture.value.value), '![alt](attachment:uploads/截屏 (1).png)')
+    await field.click(); await page.keyboard.press('ControlOrMeta+End'); await page.keyboard.press('Enter'); await page.keyboard.type('caption')
+    const saved = await page.evaluate(() => window.fixture.value.value)
+    assert.match(saved, /attachment:uploads\/截屏 \(1\).png/)
+    assert.match(saved, /caption/)
+  })
+  await check('raw HTML/footnotes are editable without lossy conversion', async () => {
+    const source = '<img src="/x.png" width="300">\n\nA[^1]\n\n[^1]: note'
+    await page.evaluate(source => { window.fixture.value.value = source }, source)
+    const raw = rawField()
+    await raw.waitFor()
+    assert.equal(await raw.inputValue(), source)
+    await raw.fill(source + '\nextra')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), source + '\nextra')
+    await raw.focus(); await page.keyboard.press('ControlOrMeta+a')
+    await page.getByRole('button', { name: 'bold', exact: true }).click()
+    assert.equal(await page.evaluate(() => window.fixture.value.value), '**' + source + '\nextra**')
+  })
+  await check('link editing does not submit an enclosing form', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'linked text' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+a')
+    await page.getByRole('button', { name: 'link', exact: true }).click()
+    const input = page.locator('input[placeholder="Enter a link..."]:visible')
+    await input.fill('https://example.com/中文')
+    await page.getByRole('button', {name:'OK',exact:true}).click()
+    assert.equal(await field.locator('a').getAttribute('href'), 'https://example.com/中文')
+    assert.equal(await page.evaluate(() => window.fixture.submissions.value), 0)
+  })
+  await check('shared heading menus support keyboard navigation, paragraph reset and Escape focus restoration', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'Heading text' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+a')
+    const heading = page.getByRole('button', { name: 'heading', exact: true })
+    await heading.focus(); await heading.press('ArrowDown')
+    await page.getByRole('menuitem', { name: 'Paragraph', exact: true }).waitFor()
+    assert.equal(await page.getByRole('menuitemradio').count(), 6)
+    await page.keyboard.press('End'); await page.keyboard.press('Enter')
+    assert.equal(await field.locator('h6').innerText(), 'Heading text')
+    await heading.focus(); await heading.press('ArrowDown'); await page.keyboard.press('Escape')
+    await page.waitForFunction(() => document.activeElement?.getAttribute('data-command') === 'title', null, { timeout: 5000 })
+    await heading.press('ArrowDown')
+    await page.getByRole('menuitem', { name: 'Paragraph', exact: true }).click()
+    assert.equal(await field.locator('h6').count(), 0)
+    assert.equal(await field.locator('p').innerText(), 'Heading text')
+  })
+  await check('shared address dialog has labels, traps focus, and restores the caret on Escape in both modes', async () => {
+    for (const mode of ['Visual', 'Source']) {
+      await page.getByRole('button', { name: mode, exact: true }).click()
+      await page.evaluate(() => { window.fixture.value.value = 'before' })
+      const target = mode === 'Visual' ? field : page.locator('#full .cm-content')
+      await target.click(); await page.keyboard.press('ControlOrMeta+End')
+      await page.getByRole('button', { name: 'link', exact: true }).click()
+      const dialog = page.getByRole('dialog', { name: 'link', exact: true })
+      await dialog.getByRole('heading', { name: 'link', exact: true }).waitFor()
+      await dialog.getByRole('textbox', { name: 'URL', exact: true }).fill('https://example.com')
+      await page.keyboard.press('Shift+Tab')
+      assert.equal(await dialog.getByRole('textbox', { name: 'Description', exact: true }).evaluate(el => el === document.activeElement), true)
+      await page.keyboard.press('Shift+Tab')
+      assert.equal(await dialog.getByRole('button', { name: 'OK', exact: true }).evaluate(el => el === document.activeElement), true)
+      await dialog.getByRole('textbox', { name: 'URL', exact: true }).evaluate(el => el.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', isComposing: true, bubbles: true, cancelable: true })))
+      assert.equal(await dialog.isVisible(), true, 'IME confirmation does not submit the dialog')
+      if (mode === 'Source') { await dialog.getByRole('button', { name: 'Cancel', exact: true }).focus(); await page.keyboard.press('Enter') }
+      else await page.keyboard.press('Escape')
+      await page.waitForFunction(selector => document.activeElement === document.querySelector(selector), mode === 'Visual' ? '#full .tiptap' : '#full .cm-content', { timeout: 5000 })
+      await page.keyboard.type(' after')
+      assert.equal(await page.evaluate(() => window.fixture.value.value), 'before after')
+    }
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+  })
+  await check('heading level is visible and checked without marking ordinary paragraphs', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '### Third level' })
+    await field.locator('h3').click()
+    const heading=page.getByRole('button',{name:'heading',exact:true})
+    await page.waitForFunction(()=>document.querySelector('#full [data-command="title"]').textContent==='H3')
+    assert.equal(await heading.getAttribute('title'),'heading 3')
+    await heading.hover()
+    await page.getByRole('menuitemradio',{name:'Heading 3',exact:true}).waitFor()
+    assert.equal(await page.getByRole('menuitemradio',{name:'Heading 3',exact:true}).getAttribute('aria-checked'),'true')
+    await page.getByRole('menuitemradio',{name:'Heading 3',exact:true}).click()
+    assert.equal(await field.locator('h3').innerText(),'Third level','choosing the current heading retains its level')
+    await page.evaluate(() => { window.fixture.value.value = 'ordinary paragraph' })
+    await field.click();await heading.hover()
+    assert.equal(await page.locator('[role="menuitemradio"][aria-checked="true"]').count(),0)
+    assert.equal(await page.getByRole('menuitem',{name:'Paragraph',exact:true}).getAttribute('aria-checked'),null)
+    await page.keyboard.press('Escape')
+  })
+  await check('link caret activates the toolbar and nearby actions preserve text, formatting and focus', async () => {
+    await page.evaluate(()=>{window.fixture.value.value='before [Linked **text**](https://example.com/old) after\n\noutside'})
+    const link=field.locator('a'),toolbar=page.getByRole('button',{name:'link',exact:true}),popup=page.locator('.fdl-link-controls')
+    await link.click();await popup.waitFor()
+    assert.equal(await toolbar.getAttribute('aria-pressed'),'true')
+    assert.equal(await field.evaluate(el=>el.contains(document.activeElement)),true,'popup does not steal the caret')
+    assert.equal(await popup.getByRole('link',{name:'Open link',exact:true}).getAttribute('href'),'https://example.com/old')
+    await popup.getByRole('button',{name:'Edit link',exact:true}).click()
+    const dialog=page.getByRole('dialog',{name:'link',exact:true})
+    assert.equal(await dialog.getByRole('textbox',{name:'Description',exact:true}).inputValue(),'Linked text')
+    await dialog.getByRole('textbox',{name:'URL',exact:true}).fill('https://example.com/new')
+    await dialog.getByRole('button',{name:'OK',exact:true}).click();await dialog.waitFor({state:'hidden'})
+    assert.equal(await link.locator('strong').innerText(),'text','editing URL preserves nested marks')
+    assert.equal(await link.getAttribute('href'),'https://example.com/new')
+    await link.click();await popup.waitFor();await page.keyboard.press('Escape');await popup.waitFor({state:'hidden'})
+    assert.equal(await field.evaluate(el=>el.contains(document.activeElement)),true)
+    await field.press('ArrowLeft');await popup.waitFor()
+    await field.locator('p').last().click();await popup.waitFor({state:'hidden'})
+    assert.equal(await toolbar.getAttribute('aria-pressed'),'false')
+    await link.click();await popup.waitFor();await popup.getByRole('button',{name:'Remove link',exact:true}).click()
+    assert.equal(await field.locator('a').count(),0)
+    assert.equal(await field.locator('strong').innerText(),'text')
+    assert.match(await field.innerText(),/before Linked text after/)
+    await field.press('ArrowRight');await field.press('ControlOrMeta+k')
+    await dialog.waitFor();await dialog.getByRole('button',{name:'Cancel',exact:true}).click();await dialog.waitFor({state:'hidden'})
+  })
+  await check('link actions support dark mode, localization, mixed selections, Escape and mode changes', async () => {
+    await page.evaluate(()=>{window.fixture.value.value='[first](https://one.example) and [second](https://two.example)';window.fixture.language.value='zh-CN';window.theme.value='dark';document.documentElement.classList.add('dark')})
+    const link=field.locator('a').first(),popup=page.locator('.fdl-link-controls')
+    await link.click();await popup.waitFor()
+    const edit=popup.getByRole('button',{name:'编辑链接',exact:true})
+    await edit.focus();await edit.press('Escape');await popup.waitFor({state:'hidden'})
+    assert.equal(await field.evaluate(el=>el.contains(document.activeElement)),true)
+    await link.click();await popup.waitFor()
+    const bg=await popup.evaluate(el=>getComputedStyle(el).backgroundColor)
+    assert.notEqual(bg,'rgb(255, 255, 255)')
+    await field.press('ControlOrMeta+a');await popup.waitFor({state:'hidden'})
+    assert.equal(await page.getByRole('button',{name:'链接',exact:true}).getAttribute('aria-pressed'),'false')
+    await field.press('ArrowLeft');await field.press('ArrowRight');await popup.waitFor()
+    await page.getByRole('button',{name:'源码',exact:true}).click();await popup.waitFor({state:'hidden'})
+    await page.getByRole('button',{name:'可视化',exact:true}).click();await link.waitFor();await link.click();await popup.waitFor()
+    await page.evaluate(()=>{window.fixture.readOnly.value=true});await popup.waitFor({state:'hidden'})
+    await page.evaluate(()=>{window.fixture.readOnly.value=false;window.fixture.language.value='en-US';window.theme.value='light';document.documentElement.classList.remove('dark');window.fixture.value.value='after link actions'})
+    await field.click()
+  })
+  await check('editing an existing link from its caret updates that link without duplicating its text', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '[Existing label](https://example.com/old)' })
+    await field.locator('a').click()
+    await page.getByRole('button', { name: 'link', exact: true }).click()
+    const dialog = page.getByRole('dialog', { name: 'link', exact: true })
+    assert.equal(await dialog.getByRole('textbox', { name: 'Description', exact: true }).inputValue(), 'Existing label')
+    await dialog.getByRole('textbox', { name: 'URL', exact: true }).fill('https://example.com/new')
+    await page.keyboard.press('Enter')
+    await dialog.waitFor({ state: 'hidden' })
+    assert.equal(await field.locator('a').count(), 1)
+    assert.equal(await field.locator('a').innerText(), 'Existing label')
+    assert.equal(await field.locator('a').getAttribute('href'), 'https://example.com/new')
+  })
+  await check('source block commands operate on whole lines and code fences remain separate blocks', async () => {
+    await page.getByRole('button', { name: 'Source', exact: true }).click()
+    await rawField().fill('before after')
+    await page.evaluate(() => { const view = window.fixture.instance.value.getEditorView(); view.dispatch({ selection: { anchor: 6 } }) })
+    await page.getByRole('button', { name: 'heading', exact: true }).click()
+    await page.getByRole('menuitemradio', { name: 'Heading 2', exact: false }).click()
+    assert.equal(await rawField().inputValue(), '## before after')
+    await rawField().fill('before after')
+    await page.evaluate(() => { const view = window.fixture.instance.value.getEditorView(); view.dispatch({ selection: { anchor: 7, head: 12 } }) })
+    await page.getByRole('button', { name: 'block-level code', exact: true }).click()
+    assert.equal(await rawField().inputValue(), 'before \n\n```\nafter\n```')
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await field.locator('pre code').innerText(), 'after')
+    assert.equal(await field.locator('p').first().innerText(), 'before ')
+  })
+  await check('table picker shows selected dimensions and supports two-dimensional keyboard selection in both modes', async () => {
+    for (const mode of ['Visual', 'Source']) {
+      await page.getByRole('button', { name: mode, exact: true }).click()
+      await page.evaluate(() => { window.fixture.value.value = '' })
+      const table = page.getByRole('button', { name: 'table', exact: true })
+      await table.focus(); await table.press('ArrowDown')
+      const first = page.getByRole('menuitem', { name: '1 × 1', exact: true })
+      await first.focus(); await page.keyboard.press('ArrowDown'); await page.keyboard.press('ArrowRight')
+      assert.equal(await page.locator('.fdl-tool-menu .fdl-table-size').innerText(), '2 × 2')
+      assert.equal(await page.locator('.fdl-tool-menu .fdl-table-cell-selected').count(), 4)
+      await page.keyboard.press('Enter')
+      if (mode === 'Source') await page.getByRole('button', { name: 'Visual', exact: true }).click()
+      assert.equal(await field.locator('th').count(), 2)
+      assert.equal(await field.locator('td').count(), 2)
+    }
+  })
+  await check('preview is localized and prevents hidden edits, and fullscreen exits with Escape', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '```text\nplain\n```'; window.fixture.language.value = 'zh-CN' })
+    const preview = page.getByRole('button', { name: '预览', exact: true })
+    await preview.click()
+    assert.equal(await preview.getAttribute('aria-pressed'), 'true')
+    assert.equal(await page.getByRole('button', { name: '加粗', exact: true }).isDisabled(), true)
+    assert.equal(await page.locator('#full .fdl-preview-pane .fdl-code-language-label').innerText(), '纯文本')
+    assert.equal(await page.locator('#full .fdl-preview-pane .fdl-code-copy').innerText(), '复制代码')
+    await page.getByRole('button', { name: '可视化', exact: true }).click()
+    assert.equal(await field.isVisible(), true)
+    const fullscreen = page.getByRole('button', { name: '全屏', exact: true })
+    await fullscreen.click()
+    assert.equal(await fullscreen.getAttribute('aria-pressed'), 'true')
+    await page.keyboard.press('Escape')
+    assert.equal(await fullscreen.getAttribute('aria-pressed'), 'false')
+    await page.evaluate(() => { window.fixture.language.value = 'en-US' })
+  })
+  await check('GFM tables and task lists survive reload', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '| A | B |\n| --- | --- |\n| one | two |\n\n- [ ] todo' })
+    await field.locator('table').waitFor()
+    assert.equal(await field.locator('td').count(), 2)
+    assert.equal(await field.locator('input[type=checkbox]').count(), 1)
+  })
+  await check('Markdown length constraints and read-only mode', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'abc'; window.fixture.limit.value = 5 })
+    await page.waitForFunction(() => document.querySelector('#full .tiptap')?.textContent === 'abc')
+    await field.focus(); await page.keyboard.press('ControlOrMeta+End'); await page.keyboard.type('def')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), 'abcde')
+    await page.evaluate(() => { window.fixture.readOnly.value = true })
+    await page.waitForFunction(() => document.querySelector('#full .tiptap').getAttribute('contenteditable') === 'false')
+    assert.equal(await page.getByRole('button', { name: 'bold', exact: true }).isDisabled(), true)
+    await page.evaluate(() => { window.fixture.readOnly.value = false; window.fixture.limit.value = undefined })
+  })
+  await check('oversized historical source remains visible and can be shortened', async () => {
+    await page.evaluate(() => { window.fixture.limit.value=5; window.fixture.value.value='historical long body' })
+    await page.getByRole('button',{name:'Source',exact:true}).click()
+    assert.equal(await rawField().inputValue(),'historical long body')
+    await rawField().fill('short')
+    assert.equal(await page.evaluate(() => window.fixture.value.value),'short')
+    await rawField().press('End'); await page.keyboard.type('x')
+    assert.equal(await page.evaluate(() => window.fixture.value.value),'short')
+    await page.evaluate(() => { window.fixture.value.value='another oversized external body' })
+    await page.waitForFunction(() => window.fixture.instance.value.getEditorView().state.doc.toString()==='another oversized external body')
+    await page.evaluate(() => { window.fixture.limit.value=undefined })
+    await page.getByRole('button',{name:'Visual',exact:true}).click()
+  })
+  await check('paste screenshot uses existing upload callback', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await field.focus()
+    await field.evaluate(el => {
+      const transfer = new DataTransfer()
+      transfer.items.add(new File(['image'], 'screen.png', { type: 'image/png' }))
+      el.dispatchEvent(new ClipboardEvent('paste', { clipboardData: transfer, bubbles: true, cancelable: true }))
+    })
+    await field.locator('img[src]').waitFor()
+    assert.equal(await page.evaluate(() => window.fixture.uploaded.value), 1)
+    assert.match(await page.evaluate(() => window.fixture.value.value), /attachment:/)
+  })
+  await check('image dropdown and file upload work in both modes', async () => {
+    for (const mode of ['Visual','Source']) {
+      await page.getByRole('button',{name:mode,exact:true}).click()
+      await page.evaluate(() => { window.fixture.value.value = 'upload here' })
+      await page.getByRole('button',{name:'image',exact:true}).hover()
+      await page.getByRole('menuitem',{name:'Upload Images',exact:true}).waitFor()
+      assert.equal(await page.getByRole('menuitem',{name:'Crop And Upload',exact:true}).count(),1)
+      const before=await page.evaluate(() => window.fixture.uploaded.value)
+      const chooser = page.waitForEvent('filechooser')
+      await page.getByRole('menuitem',{name:'Upload Images',exact:true}).click()
+      await (await chooser).setFiles({name:'pixel.png',mimeType:'image/png',buffer:Buffer.from('iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+aSXkAAAAASUVORK5CYII=','base64')})
+      await page.waitForFunction(count => window.fixture.uploaded.value > count,before)
+      await page.waitForFunction(() => window.fixture.value.value.includes('attachment:')).catch(async error => { console.error(mode, await page.evaluate(() => ({value:window.fixture.value.value, cm:window.fixture.instance.value.getEditorView().state.doc.toString(), alerts:[...document.querySelectorAll('[role=alert]')].map(x=>x.textContent)}))); throw error })
+    }
+    await page.getByRole('button',{name:'Visual',exact:true}).click()
+  })
+  await check('hover switches menus immediately and closes them on ordinary toolbar buttons without losing selection', async () => {
+    for (const mode of ['Visual', 'Source']) {
+      await page.getByRole('button', { name: mode, exact: true }).click()
+      await page.evaluate(() => { window.fixture.value.value = 'rapid selection' })
+      const target = mode === 'Visual' ? field : page.locator('#full .cm-content')
+      await target.click(); await page.keyboard.press('ControlOrMeta+a')
+      for (let iteration = 0; iteration < 3; iteration++) {
+        for (const [trigger, item] of [['heading', 'Paragraph'], ['image', 'Image link'], ['heading', 'Paragraph'], ['table', '1 × 1']]) {
+          await page.getByRole('button', { name: trigger, exact: true }).hover()
+          assert.equal(await page.locator('.fdl-tool-menu:visible').count(), 1)
+          assert.equal(await page.getByRole('menuitem', { name: item, exact: true }).isVisible(), true)
+          assert.equal(await page.locator('.fdl-tool-menu').evaluate(el => getComputedStyle(el).animationName), 'none')
+          assert.equal(await target.evaluate(el => el === document.activeElement), true, 'hover does not take focus away from the editor')
+        }
+        await page.getByRole('button', { name: 'bold', exact: true }).hover()
+        assert.equal(await page.locator('.fdl-tool-menu:visible').count(), 0, 'ordinary tools close the previous menu immediately')
+      }
+      await page.getByRole('button', { name: 'image', exact: true }).hover()
+      await page.getByRole('menuitem', { name: 'Image link', exact: true }).hover()
+      assert.equal(await target.evaluate(el => el === document.activeElement), true, 'hovering a menu item preserves editor focus')
+      assert.equal(await page.locator('.fdl-tool-menu:visible').count(), 1, 'pointer can enter and use the adjacent menu')
+      await target.hover({ position: { x: 600, y: 30 } })
+      assert.equal(await page.locator('.fdl-tool-menu:visible').count(), 0)
+      assert.equal(await page.evaluate(() => window.fixture.instance.value.getSelectedText()), 'rapid selection')
+    }
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    await page.waitForFunction(() => document.activeElement === document.querySelector('#full .tiptap'), null, { timeout: 5000 })
+  })
+  await check('pointer menus close after leaving the trigger and popup while keyboard menus retain focus', async () => {
+    for (const mode of ['Visual', 'Source']) {
+      await page.getByRole('button', { name: mode, exact: true }).click()
+      await page.evaluate(() => { window.fixture.value.value = 'kept selection' })
+      const target = mode === 'Visual' ? field : page.locator('#full .cm-content')
+      await target.click(); await page.keyboard.press('ControlOrMeta+a')
+      await page.waitForFunction(() => window.fixture.instance.value.getSelectedText() === 'kept selection', null, { timeout: 5000 })
+      for (const name of ['image', 'table', 'heading']) {
+        await page.getByRole('button', { name, exact: true }).hover()
+        const popup = page.locator('.fdl-tool-menu')
+        await popup.waitFor()
+        await popup.getByRole('menuitem').first().hover()
+        await target.hover({ position: { x: 600, y: 30 } })
+        await popup.waitFor({ state: 'hidden' })
+        await page.waitForFunction(selector => document.activeElement === document.querySelector(selector), mode === 'Visual' ? '#full .tiptap' : '#full .cm-content', { timeout: 5000 })
+        assert.equal(await page.evaluate(() => window.fixture.instance.value.getSelectedText()), 'kept selection', `${mode}/${name} hover preserves selection`)
+      }
+      const image = page.getByRole('button', { name: 'image', exact: true })
+      await image.focus(); await image.press('ArrowDown')
+      await page.getByRole('menuitem', { name: 'Image link', exact: true }).focus()
+      await target.hover({ position: { x: 600, y: 30 } })
+      // Wait past the hover-dismiss interval without moving keyboard focus.
+      await page.waitForTimeout(350)
+      assert.equal(await page.locator('.fdl-tool-menu').isVisible(), true)
+      await page.keyboard.press('Escape')
+      await page.waitForFunction(() => document.activeElement?.getAttribute('data-command') === 'image', null, { timeout: 5000 })
+    }
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+  })
+  await check('crop uploads use the shared callback in both modes', async () => {
+    for (const mode of ['Visual', 'Source']) {
+      await page.getByRole('button', { name: mode, exact: true }).click()
+      await page.evaluate(() => { window.fixture.value.value = 'crop here' })
+      await page.getByRole('button', { name: 'image', exact: true }).hover()
+      await page.getByRole('menuitem', { name: 'Crop And Upload', exact: true }).click()
+      const dialog = page.getByRole('dialog', { name: 'Crop And Upload', exact: true })
+      await dialog.getByRole('button', { name: 'Choose image', exact: true }).waitFor()
+      assert.equal(await dialog.getByRole('button', { name: 'Upload', exact: true }).isDisabled(), true)
+      await dialog.evaluate(el => Promise.all(el.getAnimations().map(animation => animation.finished.catch(() => {}))))
+      assert.equal(Math.round((await dialog.boundingBox()).width), 668, 'former crop dialog width is retained')
+      const chooser = page.waitForEvent('filechooser')
+      await dialog.getByRole('button', { name: 'Choose image', exact: true }).click()
+      const pixels = await page.evaluate(() => { const canvas = document.createElement('canvas'); canvas.width = 320; canvas.height = 200; const context = canvas.getContext('2d'); context.fillStyle = '#e97b60'; context.fillRect(0, 0, 320, 200); context.fillStyle = '#345'; context.fillRect(40, 30, 120, 80); return canvas.toDataURL('image/png').split(',')[1] })
+      await (await chooser).setFiles({ name: 'crop.png', mimeType: 'image/png', buffer: Buffer.from(pixels, 'base64') })
+      const apply = dialog.getByRole('button', { name: 'Upload', exact: true })
+      await apply.waitFor()
+      await dialog.locator('.cropper-crop-box').waitFor()
+      await page.waitForFunction(() => !document.querySelector('.fdl-crop-footer button:last-child').disabled, null, { timeout: 5000 })
+      assert.equal(await dialog.locator('.fdl-crop-preview img').count(), 1)
+      const geometry = await dialog.locator('.fdl-crop-main > img').evaluate(img => { const cropper = img.cropper; cropper.setData({ x: 10, y: 20, width: 180, height: 60 }); const data = cropper.getData(true); return { width: data.width, height: data.height } })
+      assert.deepEqual(geometry, { width: 180, height: 60 }, 'crop selection has no fixed aspect ratio')
+      const before = await page.evaluate(() => window.fixture.uploaded.value)
+      await apply.click()
+      await page.waitForFunction(before => window.fixture.uploaded.value > before, before)
+      const file = await page.evaluate(() => window.fixture.receivedFiles.value[0])
+      assert.equal(file.type, 'image/png')
+      assert.ok(file.size > 100, 'crop exports a real image rather than forwarding the source file')
+      await page.waitForFunction(() => window.fixture.value.value.includes('attachment:'))
+    }
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+  })
+  await check('delayed uploads preserve ongoing typing and a switch to source', async () => {
+    for (const switchMode of [false,true]) {
+      await page.getByRole('button',{name:'Visual',exact:true}).click()
+      await page.evaluate(() => { window.fixture.value.value='before '; window.fixture.uploadDelay.value=500 })
+      await field.focus(); await page.keyboard.press('ControlOrMeta+End')
+      await field.evaluate(el => { const data=new DataTransfer(); data.items.add(new File(['x'],'x.png',{type:'image/png'})); el.dispatchEvent(new ClipboardEvent('paste',{clipboardData:data,bubbles:true,cancelable:true})) })
+      if (switchMode) await page.getByRole('button',{name:'Source',exact:true}).click()
+      else await page.keyboard.insertText('continued writing')
+      await page.waitForFunction(() => window.fixture.value.value.includes('attachment:'))
+      const value=await page.evaluate(() => window.fixture.value.value)
+      assert.match(value,/before/)
+      if (!switchMode) assert.match(value,/continued writing/)
+      assert.equal(await page.getByRole('alert').count(),0)
+    }
+    await page.evaluate(() => { window.fixture.uploadDelay.value=20 })
+    await page.getByRole('button',{name:'Visual',exact:true}).click()
+  })
+  await check('source formatting commands preserve selection and undo independently of Tiptap', async () => {
+    for (const [name, expected, selected] of [
+      ['bold', '**selected**', 'selected'], ['italic', '*selected*', 'selected'],
+      ['strikethrough', '~~selected~~', 'selected'], ['inline code', '`selected`', 'selected'],
+      ['block-level code', '```\nselected\n```', 'selected'],
+      ['unordered list', '- selected', ''], ['ordered list', '1. selected', ''],
+    ]) {
+      await page.evaluate(() => { window.fixture.value.value = 'selected' })
+      await page.getByRole('button', { name: 'Source', exact: true }).click()
+      await rawField().focus(); await page.keyboard.press('ControlOrMeta+a')
+      await page.getByRole('button', { name, exact: true }).click()
+      assert.equal(await rawField().inputValue(), expected, name)
+      assert.equal(await page.evaluate(() => window.fixture.instance.value.getSelectedText()), selected, name)
+      await rawField().focus(); await page.keyboard.press('ControlOrMeta+z')
+      assert.equal(await rawField().inputValue(), 'selected', name + ' undo')
+    }
+    await rawField().fill('a ` b')
+    await rawField().focus(); await page.keyboard.press('ControlOrMeta+a')
+    await page.getByRole('button', { name: 'inline code', exact: true }).click()
+    assert.equal(await rawField().inputValue(), '``a ` b``')
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await field.locator('code').innerText(), 'a ` b')
+  })
+  await check('canceling link insertion does not block subsequent typing and uploads', async () => {
+    await page.evaluate(() => { window.fixture.value.value = 'before' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+End')
+    await page.getByRole('button', { name: 'link', exact: true }).click()
+    await page.getByRole('button', { name: 'Cancel', exact: true }).click()
+    await page.waitForFunction(() => document.activeElement === document.querySelector('#full .tiptap'), null, { timeout: 5000 })
+    await page.keyboard.press('ControlOrMeta+End'); await page.keyboard.type(' after')
+    await field.evaluate(el => {
+      const transfer = new DataTransfer()
+      transfer.items.add(new File(['image'], 'screen.png', { type: 'image/png' }))
+      el.dispatchEvent(new ClipboardEvent('paste', { clipboardData: transfer, bubbles: true, cancelable: true }))
+    })
+    await field.locator('img[src]').waitFor()
+    assert.match(await page.evaluate(() => window.fixture.value.value), /before after/)
+    assert.equal(await page.getByRole('alert').count(), 0)
+  })
+  await check('dark theme and final runtime check', async () => {
+    await page.evaluate(() => { window.theme.value = 'dark'; document.documentElement.classList.add('dark') })
+    await page.locator('#full .md-editor-dark').waitFor()
+    assert.deepEqual(failures, [])
+    await mkdir(resolve(root, 'tmp/editor-verification'), { recursive: true })
+    await page.screenshot({ path: resolve(root, 'tmp/editor-verification/dark.png'), fullPage: true })
+  })
+  await check('neutral modes, localized labels and narrow toolbar layout in both themes', async () => {
+    for (const theme of ['light', 'dark']) {
+      await page.evaluate(theme => { window.theme.value = theme; document.documentElement.classList.toggle('dark', theme === 'dark') }, theme)
+      for (const language of ['en-US', 'zh-CN']) {
+        await page.evaluate(language => { window.fixture.language.value = language }, language)
+        const visualLabel = language === 'zh-CN' ? '可视化' : 'Visual'
+        const sourceLabel = language === 'zh-CN' ? '源码' : 'Source'
+        const visual = page.getByRole('button', { name: visualLabel, exact: true })
+        const source = page.getByRole('button', { name: sourceLabel, exact: true })
+        for (const width of [900, 375]) {
+          await page.setViewportSize({ width, height: 800 })
+          await source.click()
+          assert.equal(await source.getAttribute('data-state'), 'on')
+          const colors = await source.evaluate(async el => { await Promise.all(el.getAnimations().map(animation => animation.finished.catch(() => {}))); return { background: getComputedStyle(el).backgroundColor, frame: getComputedStyle(el.closest('.md-editor')).backgroundColor } })
+          assert.equal(colors.background, colors.frame, 'selected source uses neutral surface')
+          await visual.click()
+          assert.equal(await visual.getAttribute('data-state'), 'on')
+          const fits = await page.locator('#full .md-editor-toolbar-wrapper').evaluate(el => {
+            const bounds = el.getBoundingClientRect()
+            return [...el.querySelectorAll('button')].filter(button => button.getBoundingClientRect().width > 0 && getComputedStyle(button).visibility !== 'hidden').every(button => {
+              const rect = button.getBoundingClientRect()
+              return rect.left >= bounds.left - 1 && rect.right <= bounds.right + 1
+            })
+          })
+          assert.ok(fits, `${theme} ${language} ${width}: visible toolbar buttons fit`)
+        }
+      }
+    }
+    await page.screenshot({ path: resolve(root, 'tmp/editor-verification/toolbar-dark-zh-mobile.png'), fullPage: true })
+    await page.setViewportSize({ width: 1000, height: 800 })
+    await page.evaluate(() => { window.fixture.language.value = 'en-US' })
+  })
+  await check('narrow toolbar protects the mode capsule and preserves selection through hover and keyboard overflow actions', async () => {
+    const more = page.getByRole('button', { name: 'More formatting tools', exact: true })
+    const visual = page.getByRole('button', { name: 'Visual', exact: true })
+    const source = page.getByRole('button', { name: 'Source', exact: true })
+    await visual.click()
+    await page.setViewportSize({ width: 1000, height: 800 })
+    const count = await page.locator('#full .md-editor-toolbar-item').count()
+    assert.equal(await more.isVisible(), false)
+    await page.evaluate(() => { window.fixture.value.value = 'selected words' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+a')
+    await page.setViewportSize({ width: 320, height: 800 })
+    await more.waitFor({ state: 'visible' })
+    const capsule = await page.locator('#full .fdl-editor-modes').boundingBox()
+    const trigger = await more.boundingBox()
+    assert.ok(Math.abs(capsule.y + capsule.height / 2 - trigger.y - trigger.height / 2) < 2, 'mode switch remains on the same row')
+    assert.ok((await page.locator('#full .md-editor-toolbar-wrapper').boundingBox()).height <= 44, 'toolbar stays a single row')
+    const updates = await page.evaluate(() => window.fixture.updates.value)
+    await more.hover()
+    await page.screenshot({ path: resolve(root, 'tmp/editor-verification/overflow-menu-dark-en-mobile.png'), fullPage: true })
+    assert.equal(await more.getAttribute('aria-expanded'), 'true')
+    await more.click()
+    assert.equal(await page.evaluate(() => window.fixture.instance.value.getSelectedText()), 'selected words')
+    assert.equal(await page.evaluate(() => window.fixture.updates.value), updates)
+    await page.getByRole('button', { name: 'bold', exact: true }).click()
+    assert.equal(await field.locator('strong').innerText(), 'selected words')
+    await more.focus(); await more.press('ArrowDown')
+    assert.equal(await page.getByRole('button', { name: 'bold', exact: true }).evaluate(el => el === document.activeElement), true)
+    await page.keyboard.press('Escape')
+    assert.equal(await more.getAttribute('aria-expanded'), 'false')
+    assert.equal(await more.evaluate(el => el === document.activeElement), true)
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await more.hover(); await insertTable()
+    assert.equal(await field.locator('th').count(), 3, 'native table picker works inside overflow')
+    await source.click()
+    await rawField().fill('before')
+    await more.hover(); await insertTable()
+    assert.ok((await rawField().inputValue()).includes('|'), 'source table insertion also works inside overflow')
+    await visual.click()
+    await more.focus(); await more.press('Enter')
+    assert.equal(await more.getAttribute('aria-expanded'), 'true')
+    await page.keyboard.press('Escape')
+    await page.setViewportSize({ width: 1000, height: 800 })
+    await page.waitForFunction(() => !document.querySelector('#full .fdl-markdown-editor').hasAttribute('data-toolbar-collapsed'))
+    assert.equal(await page.locator('#full .md-editor-toolbar-item').count(), count, 'no tools are duplicated or lost')
+    assert.equal(await page.getByRole('button', { name: 'bold', exact: true }).isVisible(), true)
+    await page.setViewportSize({ width: 320, height: 800 })
+    await more.hover()
+    await page.getByRole('button', { name: 'image', exact: true }).hover()
+    await page.getByRole('menuitem', { name: 'Upload Images', exact: true }).waitFor()
+    await source.click()
+    await page.locator('.fdl-tool-menu').waitFor({ state: 'hidden' })
+    assert.equal(await more.getAttribute('aria-expanded'), 'false')
+    await visual.click()
+    await page.setViewportSize({ width: 1000, height: 800 })
+  })
+  await check('legacy containers, titles, captions and anchors stay visually editable', async () => {
+    const body = '::: details Existing title\nBody **`parameter`**\n:::\n\n<figure class="agent-screenshot">\n<img src="/example.png" width="496" height="776">\n<figcaption>Existing caption</figcaption>\n</figure>\n\n<span id="existing-anchor"></span>'
+    await page.evaluate(source => { window.fixture.value.value = source }, body)
+    await field.locator('.fdl-container-title').waitFor()
+    assert.equal(await rawField().count(), 0)
+    assert.equal(await field.locator('strong code').innerText(), 'parameter')
+    assert.equal(await field.locator('figure img').getAttribute('width'), '496')
+    assert.equal(await field.locator('#existing-anchor').count(), 1)
+    await field.locator('.fdl-container-title').fill('Revised title')
+    await field.locator('figcaption').fill('Revised caption')
+    const saved = await page.evaluate(() => window.fixture.value.value)
+    assert.match(saved, /::: details Revised title/)
+    assert.match(saved, /<figcaption>Revised caption<\/figcaption>/)
+    assert.match(saved, /width="496" height="776"/)
+    assert.match(saved, /<span id="existing-anchor"><\/span>/)
+  })
+  await check('nested code fences survive actual code editing and reload', async () => {
+    const body = '````text\nExample:\n```ts\nconst x = 1\n```\n````'
+    await page.evaluate(source => { window.fixture.value.value = source }, body)
+    const code = field.locator('pre code')
+    await code.waitFor()
+    await code.fill('Example:\n```ts\nconst x = 2\n```')
+    const saved = await page.evaluate(() => window.fixture.value.value)
+    assert.match(saved, /^````text/)
+    await page.evaluate(() => { window.fixture.value.value = 'other document' })
+    await page.evaluate(source => { window.fixture.value.value = source }, saved)
+    assert.equal(await code.innerText(), 'Example:\n```ts\nconst x = 2\n```')
+    assert.equal(await field.locator('pre').count(), 1)
+  })
+  await check('code blocks reuse preview colors and retain their nested fence text', async () => {
+    const body = '````text\nExample:\n```js\nconsole.log(1)\n```\n````'
+    await page.evaluate(source => { window.fixture.value.value = source }, body)
+    const code = field.locator('pre code')
+    await code.waitFor()
+    assert.equal(await field.locator('.fdl-code-lines').innerText(), '1\n2\n3\n4')
+    assert.equal(await field.getByRole('button', { name: 'Copy' }).count(), 0)
+    await page.screenshot({ path: `${root}/tmp/editor-code-style.png` })
+    const color = await code.evaluate(el => getComputedStyle(el).color)
+    const background = await field.locator('.fdl-code-body').evaluate(el => getComputedStyle(el).backgroundColor)
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    const previewCode = page.locator('#full .md-editor-preview:not(.fdl-editor-content):visible pre code')
+    assert.equal(await previewCode.evaluate(el => getComputedStyle(el).color), color)
+    assert.equal(await previewCode.evaluate(el => getComputedStyle(el.closest('pre')).backgroundColor), background)
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    assert.equal(await code.innerText(), 'Example:\n```js\nconsole.log(1)\n```')
+  })
+  await check('nested code has the same complete frame in visual, editor preview and public preview under both themes', async () => {
+    const body = '## Code example\n\n````text\n嵌套代码示例：\n```js\nconsole.log("hello")\n```\n````\n\n| A | B |\n| --- | --- |\n| one | two |'
+    const expected = '嵌套代码示例：\n```js\nconsole.log("hello")\n```'
+    await page.setViewportSize({ width: 1100, height: 1000 })
+    for (const theme of ['light', 'dark']) {
+      await page.evaluate(theme => { window.theme.value = theme; document.documentElement.classList.toggle('dark', theme === 'dark') }, theme)
+      await page.evaluate(body => { window.fixture.value.value = body }, body)
+      const visual = field.locator('.fdl-code-view')
+      const publicBlock = page.locator('#public-preview .fdl-code-view')
+      await publicBlock.waitFor()
+      const metrics = async block => block.evaluate(el => {
+        const code = el.querySelector('pre code'), pre = el.querySelector('pre'), body = el.querySelector('.fdl-code-body')
+        const css = getComputedStyle(code), preCSS = getComputedStyle(pre)
+        return { font: css.font, color: css.color, background: getComputedStyle(body).backgroundColor, padding: preCSS.padding, headerHeight: el.querySelector('.md-editor-code-head').getBoundingClientRect().height, height: el.getBoundingClientRect().height, flags: [...el.querySelectorAll('.md-editor-code-flag span')].map(flag => ({ color: getComputedStyle(flag).backgroundColor, width: flag.getBoundingClientRect().width })) }
+      })
+      for (const block of [visual, publicBlock]) {
+        assert.equal(await block.locator('pre code').innerText(), expected)
+        assert.equal(await block.locator('.fdl-code-lines').innerText(), '1\n2\n3\n4')
+        assert.equal(await block.locator('.md-editor-code-head').isVisible(), true)
+        assert.equal(await block.locator('.md-editor-code-flag span').count(), 3)
+      }
+      const visualMetrics = await metrics(visual)
+      assert.equal(visualMetrics.background, 'rgb(40, 44, 52)', 'code keeps its dark readable surface even on a light page')
+      assert.equal(visualMetrics.headerHeight, 36)
+      assert.deepEqual(visualMetrics.flags.map(flag => flag.width), [12, 12, 12])
+      assert.deepEqual(await metrics(publicBlock), visualMetrics)
+      assert.equal(await page.locator('#public-preview table th').count(), 2)
+      assert.equal(await publicBlock.locator('.fdl-code-language-label').innerText(), 'Plain text')
+      const toggle = publicBlock.getByRole('button', { name: 'Collapse or expand code' })
+      await toggle.click()
+      assert.equal(await publicBlock.locator('.fdl-code-body').isVisible(), false)
+      assert.equal(await visual.locator('.fdl-code-body').isVisible(), true)
+      await toggle.press('Enter')
+      assert.equal(await publicBlock.locator('.fdl-code-body').isVisible(), true)
+      await visual.screenshot({ path: resolve(root, `tmp/editor-verification/code-visual-${theme}.png`) })
+      await publicBlock.screenshot({ path: resolve(root, `tmp/editor-verification/code-public-${theme}.png`) })
+      await page.getByRole('button', { name: 'preview only', exact: true }).click()
+      const preview = page.locator('#full .fdl-preview-pane .fdl-code-view')
+      assert.deepEqual(await metrics(preview), visualMetrics)
+      await page.getByRole('button', { name: 'preview only', exact: true }).click()
+      await page.waitForFunction(() => document.activeElement === document.querySelector('#full .tiptap'))
+      assert.equal(await page.evaluate(() => window.fixture.value.value), body)
+    }
+    await page.evaluate(() => { window.fixture.language.value = 'zh-CN'; window.fixture.value.value = '```\nplain\n```' })
+    const chineseLabels = JSON.parse(await readFile(resolve(root, 'i18n/locales/zh.json'), 'utf8')).markdownEditor
+    assert.equal(await page.locator('#public-preview .fdl-code-collapse').getAttribute('aria-label'), chineseLabels.collapseCode)
+    assert.equal(await page.locator('#public-preview .fdl-code-language-label').innerText(), chineseLabels.plainText)
+    await page.evaluate(async () => { window.fixture.language.value = 'en-US'; await window.fixture.nextTick() })
+  })
+  await check('plain-text language aliases share one option without rewriting the original fence', async () => {
+    for (const language of ['', 'text', 'txt', 'plain', 'plaintext']) {
+      const markdown = '```' + language + '\nplain\n```'
+      await page.evaluate(markdown => { window.fixture.value.value = markdown }, markdown)
+      const select = field.locator('.fdl-code-language')
+      await page.waitForFunction(() => document.querySelector('#full .fdl-code-language')?.textContent.trim() === 'Plain text', null, { timeout: 5000 })
+      assert.equal(await select.innerText(), 'Plain text')
+      await select.click()
+      assert.equal(await page.getByRole('option', { name: 'Plain text', exact: true }).count(), 1)
+      assert.equal(await page.getByRole('option', { name: 'text', exact: true }).count(), 0)
+      const labels = await page.getByRole('option').allTextContents()
+      assert.equal(labels[0], 'Plain text')
+      assert.deepEqual(labels.slice(1), [...labels.slice(1)].sort((a, b) => a.localeCompare(b, 'en', { sensitivity: 'base' })))
+      await page.keyboard.press('Escape')
+      await page.waitForFunction(() => document.activeElement === document.querySelector('#full .fdl-code-language'), null, { timeout: 5000 })
+      assert.equal(await page.locator('#public-preview .fdl-code-language-label').innerText(), 'Plain text')
+      assert.equal(await page.evaluate(() => window.fixture.value.value), markdown)
+    }
+  })
+  await check('public and editor previews copy only code, with feedback and an HTTP fallback', async () => {
+    const expected = '嵌套代码示例：\n```js\nconsole.log("hello")\n```'
+    const markdown = '````text\n' + expected + '\n````'
+    await page.evaluate(markdown => {
+      window.fixture.value.value = markdown
+      window.previousClipboard = Object.getOwnPropertyDescriptor(navigator, 'clipboard')
+      window.previousExecCommand = Object.getOwnPropertyDescriptor(document, 'execCommand')
+      Object.defineProperty(navigator, 'clipboard', { configurable: true, value: { writeText: async value => { window.copiedCode = value } } })
+    }, markdown)
+    assert.equal(await field.locator('.fdl-code-copy').count(), 0)
+    const publicCopy = page.locator('#public-preview .fdl-code-copy')
+    await publicCopy.click()
+    await page.waitForFunction(() => window.copiedCode !== undefined)
+    assert.equal(await page.evaluate(() => window.copiedCode), expected)
+    assert.equal(await publicCopy.innerText(), 'Copied')
+    await page.evaluate(() => { window.fixture.widgetVisible.value = true; window.copiedCode = undefined })
+    await page.locator('#widget-preview .fdl-code-copy').click()
+    assert.equal(await page.evaluate(() => window.copiedCode), expected, 'widget sanitizer preserves preview copying')
+    await page.evaluate(() => { window.fixture.widgetVisible.value = false })
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    await page.locator('#full .fdl-code-copy').click()
+    assert.equal(await page.evaluate(() => window.copiedCode), expected)
+    assert.equal(await page.evaluate(() => window.fixture.submissions.value), 0)
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    await page.evaluate(() => {
+      window.copiedCode = undefined
+      Object.defineProperty(navigator, 'clipboard', { configurable: true, value: undefined })
+      Object.defineProperty(document, 'execCommand', { configurable: true, value: command => { if (command === 'copy') window.copiedCode = document.activeElement.value; return true } })
+    })
+    await publicCopy.click()
+    assert.equal(await page.evaluate(() => window.copiedCode), expected)
+    assert.equal(await publicCopy.evaluate(el => el === document.activeElement), true, 'fallback restores focus')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), markdown)
+    await page.evaluate(() => { window.fixture.language.value = 'zh-CN' })
+    assert.equal(await publicCopy.innerText(), '复制代码')
+    await publicCopy.click()
+    assert.equal(await publicCopy.innerText(), '已复制')
+    await page.evaluate(() => {
+      if (window.previousClipboard) Object.defineProperty(navigator, 'clipboard', window.previousClipboard)
+      else delete navigator.clipboard
+      if (window.previousExecCommand) Object.defineProperty(document, 'execCommand', window.previousExecCommand)
+      else delete document.execCommand
+      window.fixture.language.value = 'en-US'
+    })
+  })
+  await check('code block language can be changed, saved, reloaded and localized without a copy button', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '```js\nconst x = 1\n```' })
+    const language = field.getByRole('combobox', { name: 'Code language', exact: true })
+    await language.click()
+    for (const name of ['Java', 'C', 'C++', 'C#', 'JavaScript', 'TypeScript', 'Python']) assert.equal(await page.getByRole('option', { name, exact: true }).count(), 1)
+    await page.getByRole('option', { name: 'TypeScript', exact: true }).click()
+    assert.match(await page.evaluate(() => window.fixture.value.value), /^```typescript\n/)
+    assert.equal(await field.locator('pre code').innerText(), 'const x = 1')
+    await page.getByRole('button', { name: 'Source', exact: true }).click()
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await language.innerText(), 'TypeScript')
+    const saved = await page.evaluate(() => window.fixture.value.value)
+    await page.evaluate(() => { window.fixture.value.value = 'other' })
+    await page.evaluate(value => { window.fixture.value.value = value }, saved)
+    assert.equal(await language.innerText(), 'TypeScript')
+    await page.evaluate(() => { window.fixture.readOnly.value = true })
+    await page.waitForFunction(() => document.querySelector('#full .fdl-code-language').disabled)
+    await page.evaluate(() => { window.fixture.readOnly.value = false; window.fixture.language.value = 'zh-CN' })
+    const chinese = field.getByRole('combobox', { name: '代码语言', exact: true })
+    await chinese.click()
+    await page.getByRole('option', { name: 'Python', exact: true }).click()
+    assert.match(await page.evaluate(() => window.fixture.value.value), /^```python\n/)
+    assert.equal(await field.locator('.fdl-code-copy').count(), 0, 'editing does not expose preview copy')
+    await page.evaluate(() => { window.fixture.language.value = 'en-US' })
+  })
+  await check('normal bottom padding and keyboard continuation after a final table or code block', async () => {
+    for (const kind of ['table', 'code']) {
+      const body = kind === 'table' ? '| A | B |\n| --- | --- |\n| a | b |' : '```text\nexample code\n```'
+      await page.evaluate(source => { window.fixture.value.value = source }, body)
+      const block = field.locator(kind === 'table' ? 'td p' : '.fdl-code-body pre code').last()
+      await block.waitFor()
+      assert.equal(await page.evaluate(() => window.fixture.value.value), body, 'loading does not add a trailing paragraph')
+      assert.equal(await field.evaluate(el => getComputedStyle(el).paddingBottom), '12px')
+      await block.click(); await page.keyboard.press('End'); await page.keyboard.press('ArrowDown')
+      await page.keyboard.insertText('Continue below ' + kind)
+      assert.equal(await field.locator(':scope > p').last().innerText(), 'Continue below ' + kind)
+      assert.equal(await block.innerText(), kind === 'table' ? 'b' : 'example code')
+    }
+  })
+  await check('historical containers render in Preview and code blocks collapse without changing Markdown', async () => {
+    const original = '::: tip Historical **tip**\nBody text\n\n::: warning Nested warning\nNested body\n:::\n\n```text\n::: tip literal in code\n::: \n```\n:::'
+    await page.evaluate(value => { window.fixture.value.value = value }, original)
+    await field.locator('.fdl-legacy-container').first().waitFor()
+    const structured = await field.locator('.fdl-legacy-container').first().evaluate(el => ({background:getComputedStyle(el).backgroundColor,border:getComputedStyle(el).borderLeft,padding:getComputedStyle(el).padding}))
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    const preview = page.locator('#full .md-editor-preview:not(.fdl-editor-content):visible')
+    await preview.locator('.fdl-legacy-container').first().waitFor()
+    assert.equal(await preview.locator('.fdl-legacy-container').count(), 2)
+    assert.equal(await preview.locator('.fdl-container-title strong').innerText(), 'tip')
+    assert.match(await preview.locator('pre code').innerText(), /::: tip literal in code/)
+    assert.deepEqual(await preview.locator('.fdl-legacy-container').first().evaluate(el => ({background:getComputedStyle(el).backgroundColor,border:getComputedStyle(el).borderLeft,padding:getComputedStyle(el).padding})), structured)
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    const collapse = field.getByRole('button', {name:'Collapse or expand code'})
+    await collapse.click()
+    assert.equal(await field.locator('.fdl-code-body').isVisible(), false)
+    assert.equal(await page.evaluate(() => window.fixture.value.value), original)
+    await collapse.click()
+    assert.equal(await field.locator('.fdl-code-body').isVisible(), true)
+  })
+  await check('unfinished feedback steps remain editable list items', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '### Steps\n1. \n2. \n3. \n\n### Environment\n- Browser:' })
+    const items = field.locator('ol li')
+    await items.first().waitFor()
+    assert.equal(await items.count(), 3)
+    assert.equal(await rawField().count(), 0)
+    await items.nth(1).locator('p').fill('Second step')
+    const saved = await page.evaluate(() => window.fixture.value.value)
+    assert.match(saved, /2\. Second step/)
+    await page.evaluate(() => { window.fixture.value.value = 'other document' })
+    await page.evaluate(source => { window.fixture.value.value = source }, saved)
+    assert.equal(await items.count(), 3)
+    assert.equal(await items.nth(1).innerText(), 'Second step')
+  })
+  await check('toolbar inserts editable tables in structured and source modes', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await insertTable()
+    assert.equal(await field.locator('tr').count(), 3)
+    assert.equal(await field.locator('th').count(), 3)
+    assert.deepEqual(await field.locator('th').allTextContents(), ['', '', ''])
+    assert.equal(await page.evaluate(() => window.getSelection()?.anchorNode?.parentElement?.closest('th') === document.querySelector('#full th')), true)
+    await page.keyboard.type('First cell')
+    assert.equal(await field.locator('th').first().innerText(), 'First cell')
+    await field.locator('th p').first().fill('Column title')
+    await page.getByRole('button', { name: 'Source', exact: true }).click()
+    const raw = rawField()
+    assert.match(await raw.inputValue(), /Column title/)
+    await raw.fill('Before table')
+    await raw.press('ControlOrMeta+End')
+    await insertTable()
+    assert.match(await raw.inputValue(), /Before table\n+\|/)
+    assert.ok(!(await raw.inputValue()).includes('Column'))
+    await page.keyboard.type('Source header')
+    assert.match(await raw.inputValue(), /\| Source header \|/)
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await field.locator('tr').count(), 3)
+    assert.equal(await field.locator('th').count(), 3)
+  })
+  await check('table row and column controls edit the selected table and survive reload', async () => {
+    await field.locator('td p').first().click()
+    await page.getByRole('button', { name: 'Insert row below', exact: true }).click()
+    await page.getByRole('button', { name: 'Insert row above 2', exact: true }).click()
+    assert.equal(await field.locator('tr').count(), 5)
+    await page.getByRole('button', { name: 'Insert column right', exact: true }).click()
+    await page.getByRole('button', { name: 'Insert column left 2', exact: true }).click()
+    assert.equal(await field.locator('tr').first().locator('th,td').count(), 5)
+    await page.getByRole('button', { name: 'Delete row 2', exact: true }).click()
+    await page.getByRole('button', { name: 'Delete column 2', exact: true }).click()
+    assert.equal(await page.getByRole('button', { name: 'Delete table', exact: true }).count(), 1)
+    await page.waitForFunction(() => document.querySelectorAll('#full .fdl-table-insert').length === 8)
+    const controls = page.locator('.fdl-table-frame')
+    const cornerBox = await controls.locator('.corner').boundingBox()
+    for (const button of await controls.locator('.fdl-table-insert').all()) {
+      const box = await button.boundingBox()
+      assert.ok(cornerBox.x + cornerBox.width <= box.x || box.x + box.width <= cornerBox.x || cornerBox.y + cornerBox.height <= box.y || box.y + box.height <= cornerBox.y, 'Table delete must not overlap insertion controls')
+    }
+    for (const button of await controls.locator('button').all()) {
+      const box = await button.boundingBox(), icon = await button.locator('svg').boundingBox()
+      assert.ok(Math.abs(box.x + box.width / 2 - icon.x - icon.width / 2) < 1 && Math.abs(box.y + box.height / 2 - icon.y - icon.height / 2) < 1, 'Table icons must be centered')
+    }
+
+    assert.equal(await field.locator('tr').count(), 4)
+    assert.equal(await field.locator('tr').first().locator('th,td').count(), 4)
+    await page.getByRole('button', { name: 'Source', exact: true }).click()
+    assert.equal(await page.getByRole('toolbar', { name: 'Table actions' }).count(), 0)
+    const raw = rawField()
+    await raw.fill((await raw.inputValue()) + '\n\nAfter table')
+    await page.getByRole('button', { name: 'Visual', exact: true }).click()
+    assert.equal(await field.locator('tr').count(), 4)
+    assert.equal(await field.locator('tr').first().locator('th,td').count(), 4)
+    await field.locator('td p').first().click()
+    await page.getByRole('button', { name: 'Delete table', exact: true }).click()
+    assert.equal(await field.locator('table').count(), 0)
+    assert.match(await field.innerText(), /After table/)
+  })
+  await check('table handles target the hovered table and stay aligned after scrolling', async () => {
+    await page.evaluate(() => { window.fixture.value.value = '| A | B |\n| --- | --- |\n| a | b |\n\nBetween tables\n\n| C | D |\n| --- | --- |\n| c | d |' })
+    const second = field.locator('table').nth(1)
+    await second.locator('td').first().hover()
+    await page.getByRole('button', { name: 'Insert column left 2', exact: true }).click()
+    assert.equal(await field.locator('table').first().locator('th').count(), 2)
+    assert.equal(await second.locator('th').count(), 3)
+    assert.deepEqual(await second.locator('th').allTextContents(), ['C', '', 'D'])
+    assert.deepEqual(await second.locator('td').allTextContents(), ['c', '', 'd'])
+    await page.getByRole('button', { name: 'Insert row above 2', exact: true }).click()
+    assert.equal(await second.locator('tr').count(), 3)
+    assert.deepEqual(await second.locator('tr').nth(1).locator('td').allTextContents(), ['', '', ''])
+    await second.locator('td').last().click()
+    await page.locator('#full .fdl-editor-scroll').evaluate(el => { el.scrollTop = el.scrollHeight })
+    const box = await second.boundingBox()
+    const controls = await page.locator('#full .fdl-table-frame').boundingBox()
+    assert.ok(Math.abs(box.x - controls.x) < 2 && Math.abs(box.y - controls.y) < 2)
+    await page.screenshot({ path: `${root}/tmp/table-handles.png` })
+    await page.evaluate(() => { window.fixture.readOnly.value = true })
+    await page.waitForFunction(() => !document.querySelector('#full .fdl-table-controls'))
+    await page.evaluate(() => { window.fixture.readOnly.value = false })
+  })
+  await check('structured/source switching preserves bytes, edits and independent preview', async () => {
+    const original = '* first\n* second\n'
+    await page.evaluate(source => { window.fixture.value.value = source }, original)
+    const updates = await page.evaluate(() => window.fixture.updates.value)
+    const sourceButton = page.getByRole('button', { name: 'Source', exact: true })
+    const structuredButton = page.getByRole('button', { name: 'Visual', exact: true })
+    const raw = rawField()
+    await sourceButton.click()
+    assert.equal(await raw.inputValue(), original)
+    await structuredButton.click()
+    assert.equal(await page.evaluate(() => window.fixture.value.value), original)
+    assert.equal(await page.evaluate(() => window.fixture.updates.value), updates)
+    await sourceButton.click()
+    await raw.fill('## Source heading\n\n**formatted**')
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    assert.equal(await page.locator('#full .md-editor-preview:not(.fdl-editor-content):visible h2').innerText(), 'Source heading')
+    await page.getByRole('button', { name: 'preview only', exact: true }).click()
+    assert.equal(await raw.inputValue(), '## Source heading\n\n**formatted**')
+    await structuredButton.click()
+    assert.equal(await field.locator('h2').innerText(), 'Source heading')
+    assert.equal(await field.locator('strong').innerText(), 'formatted')
+    await field.focus(); await page.keyboard.press('ControlOrMeta+End'); await page.keyboard.insertText(' edit')
+    await sourceButton.click()
+    assert.match(await raw.inputValue(), /edit/)
+    await page.evaluate(() => { window.fixture.value.value = 'External document' })
+    assert.equal(await raw.inputValue(), 'External document')
+    await raw.fill('A[^1]\n\n[^1]: footnote')
+    await structuredButton.click()
+    assert.equal(await raw.inputValue(), 'A[^1]\n\n[^1]: footnote')
+    assert.match(await page.getByRole('alert').innerText(), /preserved/)
+    await raw.fill('Plain again')
+    await structuredButton.click()
+    assert.equal(await field.innerText(), 'Plain again')
+  })
+  await check('empty inline code and caret survive switching without publishing a placeholder', async () => {
+    const visual = page.getByRole('button', { name: 'Visual', exact: true })
+    const source = page.getByRole('button', { name: 'Source', exact: true })
+    const raw = rawField()
+    await page.evaluate(() => { window.fixture.value.value = 'before after' })
+    await field.click(); await page.keyboard.press('ControlOrMeta+Home')
+    for (let i = 0; i < 7; i++) await page.keyboard.press('ArrowRight')
+    await page.getByRole('button', { name: 'inline code', exact: true }).click()
+    await field.locator('.fdl-pending-code').waitFor()
+    const updates = await page.evaluate(() => window.fixture.updates.value)
+    for (let i = 0; i < 2; i++) {
+      await source.click()
+      assert.equal(await raw.inputValue(), 'before ``after')
+      assert.equal(await page.evaluate(() => window.fixture.instance.value.getEditorView().state.selection.main.head), 8)
+      assert.equal(await page.locator('#full .cm-content').evaluate(el => el.contains(document.activeElement)), true)
+      await visual.click()
+      await field.locator('.fdl-pending-code').waitFor()
+      assert.equal(await page.evaluate(() => window.fixture.value.value), 'before after')
+      assert.equal(await page.evaluate(() => window.fixture.updates.value), updates)
+    }
+    assert.equal(await field.evaluate(el => el === document.activeElement), true, 'visual caret is focused after remount')
+    await page.keyboard.type('visual')
+    assert.equal(await field.locator('code:not(.fdl-pending-code)').innerText(), 'visual')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), 'before `visual`after')
+    await page.evaluate(() => { window.fixture.value.value = '' })
+    await field.click(); await page.getByRole('button', { name: 'inline code', exact: true }).click()
+    await source.click()
+    assert.equal(await raw.inputValue(), '``')
+    await page.keyboard.type('source')
+    assert.equal(await raw.inputValue(), '`source`')
+    await page.keyboard.press('ControlOrMeta+z')
+    assert.equal(await raw.inputValue(), '``')
+    assert.equal(await page.evaluate(() => window.fixture.value.value), '')
+    await page.keyboard.type('source')
+    await visual.click()
+    assert.equal(await field.locator('code:not(.fdl-pending-code)').innerText(), 'source')
+    await page.keyboard.type(' more')
+    assert.equal(await field.locator('code:not(.fdl-pending-code)').innerText(), 'source more')
+    await page.evaluate(() => { window.fixture.value.value = ''; window.fixture.limit.value = 0 })
+    await field.click(); await page.getByRole('button', { name: 'inline code', exact: true }).click()
+    await source.click()
+    assert.equal(await raw.inputValue(), '``', 'pending syntax remains visible even at the content limit')
+    await raw.fill('')
+    await visual.click()
+    assert.equal(await field.locator('.fdl-pending-code').count(), 0, 'deleting source delimiters cancels pending code')
+    await page.evaluate(() => { window.fixture.limit.value = undefined })
+    await field.click(); await page.getByRole('button', { name: 'inline code', exact: true }).click()
+    await source.click()
+    await page.evaluate(() => { window.fixture.value.value = 'Replacement document' })
+    assert.equal(await raw.inputValue(), 'Replacement document')
+    await visual.click()
+    assert.equal(await field.locator('.fdl-pending-code').count(), 0)
+    assert.equal(await field.innerText(), 'Replacement document')
+  })
+  await check('bottom typing, Enter and keyboard table exit retain the writing viewport', async () => {
+    const long=Array.from({length:40},(_,i)=>`Paragraph ${i}`).join('\n\n')
+    await page.evaluate(value => { window.fixture.value.value=value },long)
+    const scroll=page.locator('#full .fdl-rich-scroll')
+    await field.locator('p').last().click(); await page.keyboard.press('ControlOrMeta+End')
+    const before=await scroll.evaluate(el=>el.scrollTop)
+    assert.ok(before>500)
+    await page.keyboard.type(' continued'); await page.keyboard.press('Enter'); await page.keyboard.type('New bottom paragraph')
+    await page.waitForTimeout(150)
+    const after=await scroll.evaluate(el=>el.scrollTop)
+    assert.ok(after>=before-30,`typing scrolled from ${before} to ${after}`)
+    const last=await field.locator('p').last().boundingBox(), viewport=await scroll.boundingBox()
+    assert.ok(last.y>=viewport.y && last.y<viewport.y+viewport.height)
+    await page.evaluate(value => { window.fixture.value.value=value+'\n\n| A | B |\n| --- | --- |\n| one | two |' },long)
+    await scroll.evaluate(el=>{el.scrollTop=el.scrollHeight})
+    await field.locator('td p').last().click(); await page.keyboard.press('End'); await page.keyboard.press('ArrowDown')
+    await page.keyboard.type('After final table')
+    await page.waitForTimeout(150)
+    assert.match(await field.locator('p').last().innerText(),/After final table/)
+    assert.ok(await scroll.evaluate(el=>el.scrollTop)>500)
+  })
+  await check('arrow navigation out of a final table creates a normal text caret', async () => {
+    await page.evaluate(() => { window.fixture.value.value='| A | B |\n| --- | --- |\n| one | two |' })
+    await field.locator('td p').last().click(); await page.keyboard.press('End'); await page.keyboard.press('ArrowDown')
+    assert.equal(await field.locator('.ProseMirror-gapcursor').count(),0)
+    assert.equal(await page.evaluate(()=>{const n=window.getSelection()?.anchorNode;return (n?.nodeType===1?n:n?.parentElement)?.closest('td,th')?.tagName??null}),null)
+    await page.keyboard.type('below')
+    assert.equal(await field.locator(':scope > p').last().innerText(),'below')
+  })
+  await check('empty inline code shows a one-character marker without placeholder text', async () => {
+    await page.evaluate(() => { window.fixture.value.value='' })
+    await field.click(); await page.getByRole('button',{name:'inline code',exact:true}).click()
+    await field.locator('.fdl-pending-code').waitFor()
+    const marker = await field.locator('.fdl-pending-code').evaluate(el => ({ text: el.textContent, width: el.getBoundingClientRect().width, fontSize: parseFloat(getComputedStyle(el).fontSize) }))
+    assert.equal(marker.text, '')
+    assert.ok(Math.abs(marker.width - marker.fontSize) < 1, 'marker is one em wide')
+    assert.equal(await field.locator('.fdl-pending-code').evaluate(el => getComputedStyle(el.parentElement, '::before').content), 'none')
+    assert.equal(await page.evaluate(()=>window.fixture.value.value),'')
+    await page.keyboard.type('sample')
+    assert.equal(await field.locator('code:not(.fdl-pending-code)').innerText(),'sample')
+    assert.equal(await field.locator('.fdl-pending-code').count(),0)
+    assert.equal(await page.evaluate(()=>window.fixture.value.value),'`sample`')
+  })
+  if (process.env.EDITOR_CORPUS_PATH) {
+    // Local database exports stay outside source control; this runner is reusable.
+    const corpus = JSON.parse(await readFile(process.env.EDITOR_CORPUS_PATH, 'utf8'))
+    let visual = 0
+    let sourceOnly = 0
+    for (const [index, row] of corpus.entries()) {
+      await page.evaluate(async source => {
+        window.fixture.value.value = source
+        await window.fixture.nextTick()
+        await window.fixture.nextTick()
+      }, row.source)
+      const raw = rawField()
+      assert.equal(await page.evaluate(() => window.fixture.value.value), row.source, `${row.kind}/${row.id}: load`)
+      if (await raw.count()) {
+        sourceOnly++
+        assert.equal(await raw.inputValue(), row.source)
+        await raw.fill(row.source + '\nCompatibility browser marker')
+        assert.equal(await page.evaluate(() => window.fixture.value.value), row.source + '\nCompatibility browser marker')
+        await raw.fill(row.source)
+      } else {
+        visual++
+        await field.focus()
+        await page.keyboard.press('ControlOrMeta+End')
+        await page.keyboard.insertText(' CompatibilityBrowserMarker')
+        assert.match(await page.evaluate(() => window.fixture.value.value), /CompatibilityBrowserMarker/, `${row.kind}/${row.id}: input`)
+        await page.keyboard.press('ControlOrMeta+z')
+        assert.equal(await page.evaluate(() => window.fixture.value.value), row.source, `${row.kind}/${row.id}: undo`)
+      }
+      if ((index + 1) % 100 === 0) console.log(`Corpus progress: ${index + 1}/${corpus.length}`)
+    }
+    assert.deepEqual(failures, [])
+    if (process.env.EDITOR_CORPUS_EXPECT_SOURCE_ONLY !== undefined) assert.equal(sourceOnly, Number(process.env.EDITOR_CORPUS_EXPECT_SOURCE_ONLY))
+    console.log(`Local corpus: ${corpus.length} records passed (${visual} visual, ${sourceOnly} source preservation)`)
+  }
+  if (process.env.EDITOR_RENDER_CORPUS_PATH) {
+  await page.getByRole('button', { name: 'preview only', exact: true }).click()
+  await page.waitForFunction(() => typeof window.renderMarkdown === 'function')
+  const rows = JSON.parse(await readFile(process.env.EDITOR_RENDER_CORPUS_PATH, 'utf8'))
+  const report = await page.evaluate(rows => {
+    function snapshot(source) {
+      const doc = new DOMParser().parseFromString(window.renderMarkdown(source), 'text/html')
+      return {
+        text: doc.body.textContent.replace(/\s/g, ''),
+        code: [...doc.querySelectorAll('pre code')].map(el => el.textContent),
+        links: (() => {
+          const segments = []
+          const walker = doc.createTreeWalker(doc.body, NodeFilter.SHOW_TEXT)
+          while (walker.nextNode()) {
+            const node = walker.currentNode
+            const text = node.textContent.replace(/\s/g, '')
+            if (!text) continue
+            const href = node.parentElement.closest('a[href]')?.getAttribute('href') ?? null
+            if (segments.length && segments.at(-1).href === href) segments.at(-1).text += text
+            else segments.push({ href, text })
+          }
+          return segments
+        })(),
+        linkCount: doc.querySelectorAll('a[href]').length,
+        images: [...doc.querySelectorAll('img')].map(el => ['src', 'alt', 'title', 'width', 'height'].map(name => el.getAttribute(name))),
+      }
+    }
+    const differences = []
+    let imageCount = 0, linkCount = 0, codeCount = 0
+    for (const row of rows) {
+      const before = snapshot(row.source), after = snapshot(row.normalized)
+      imageCount += before.images.length; linkCount += before.linkCount; codeCount += before.code.length
+      const fields = Object.keys(before).filter(key => key !== 'linkCount').filter(key => JSON.stringify(before[key]) !== JSON.stringify(after[key]))
+      if (fields.length) differences.push({kind: row.kind, id: row.id, fields, details: fields.map(field => ({ field, before: before[field], after: after[field] }))})
+    }
+    return {total: rows.length, imageCount, linkCount, codeCount, differences}
+  }, rows)
+    await writeFile(resolve(root, 'tmp/editor-verification/render-comparison.json'), JSON.stringify(report, null, 2), { mode: 0o600 })
+    assert.deepEqual(report.differences, [])
+    console.log(`Render parity: ${report.total} bodies, ${report.imageCount} images, ${report.linkCount} links, ${report.codeCount} code blocks passed`)
+  }
+  await check('empty image upload results never alter the document or reach Tiptap', async () => {
+    await page.evaluate(() => { window.fixture.uploadResult.value = []; window.fixture.value.value = 'Keep this draft'; window.fixture.readOnly.value = false; window.fixture.instance.value.setMode('structured') })
+    await field.waitFor()
+    const warnings = []
+    const listener = message => { if (message.type() === 'warning') warnings.push(message.text()) }
+    page.on('console', listener)
+    await page.locator('#full input[type="file"]').setInputFiles({ name: 'failed.png', mimeType: 'image/png', buffer: Buffer.from('test') })
+    await page.locator('#full .fdl-editor-message').filter({ hasText: 'Image upload failed' }).waitFor()
+    assert.equal(await page.evaluate(() => window.fixture.value.value), 'Keep this draft')
+    assert.equal(await field.locator('img[src]').count(), 0)
+    assert.ok(!warnings.some(text => /Invalid content|Unknown node/.test(text)))
+    page.off('console', listener)
+    await page.evaluate(() => { window.fixture.uploadResult.value = undefined })
+  })
+  console.log(`${assertions} browser scenarios passed`)
+} finally { await browser.close(); await server.close() }
diff --git a/tests/fixtures/markdown-editor/EditorFixture.vue b/tests/fixtures/markdown-editor/EditorFixture.vue
new file mode 100644
index 00000000..6b65a814
--- /dev/null
+++ b/tests/fixtures/markdown-editor/EditorFixture.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import { ref, nextTick } from 'vue'
+import Editor from '../../../app/components/ThemedMdEditor.vue'
+import WidgetMarkdown from '../../../app/components/WidgetEmbed/WidgetEmbedMarkdown.vue'
+import ThemedMdPreview from '../../../app/components/ThemedMdPreview.vue'
+import '../../../app/assets/css/help-article.css'
+const language = ref('en-US')
+const widgetVisible = ref(false)
+const value = ref('')
+const instance = ref()
+const bare = ref('')
+const readOnly = ref(false)
+const limit = ref<number>()
+const uploaded = ref(0)
+const receivedFiles = ref<{ name: string, type: string, size: number }[]>([])
+const uploadDelay = ref(20)
+const uploadResult = ref<string[]>()
+const updates = ref(0)
+const submissions = ref(0)
+const toolbar = ['bold', 'italic', 'strikeThrough', '-', 'title', 'unorderedList', 'orderedList', '-', 'link', 'image', 'code', 'codeRow', 'table', 'previewOnly', 'fullscreen', '=', 0]
+const upload = async (_files: File[], callback: (urls: string[]) => void) => {
+  uploaded.value++
+  receivedFiles.value = _files.map(({ name, type, size }) => ({ name, type, size }))
+  await new Promise(resolve => setTimeout(resolve, uploadDelay.value))
+  callback(uploadResult.value ?? ['attachment:uploads/截屏 (1).png'])
+}
+Object.assign(window, { fixture: { instance, value, language, widgetVisible, bare, readOnly, limit, uploaded, receivedFiles, uploadDelay, uploadResult, updates, submissions, nextTick } })
+</script>
+<template>
+  <form id="full" @submit.prevent="submissions++">
+    <Editor ref="instance" v-model="value" style="height: 280px" :toolbars="toolbar" :footers="['=', 0]" :max-length="limit" :read-only="readOnly" placeholder="Write a comment" :language="language" @on-upload-img="upload" @update:model-value="updates++">
+      <template #defToolbars><button id="custom-tool" type="button">AI</button></template>
+      <template #defFooters><button id="submit" type="button">Submit</button></template>
+    </Editor>
+  </form>
+  <div id="public-preview" class="help-article-styled"><ThemedMdPreview :model-value="value" :language="language" /></div>
+  <div v-if="widgetVisible" id="widget-preview"><WidgetMarkdown :text="value" /></div>
+  <div id="bare"><Editor v-model="bare" :footers="[]" style="height: 160px" placeholder="Reply" /></div>
+</template>
+<style>
+:root { --background:#fff; --foreground:#18181b; --border:#e4e4e7; --muted:#f4f4f5; --muted-foreground:#71717a; --secondary:#f4f4f5; --primary:#2563eb; --popover:#fff; --accent:#e57a5a; --ring:#2563eb; }
+.dark { --background:#18181b; --foreground:#fafafa; --border:#3f3f46; --muted:#27272a; --secondary:#27272a; --popover:#18181b; --accent:#e57a5a; }
+* { box-sizing:border-box; } body { font-family:Arial,sans-serif; margin:24px; max-width:800px; background:var(--background); color:var(--foreground); } button { border:0; background:transparent; color:inherit; } #bare { margin-top:24px; }
+</style>
+
+<style scoped>
+.caller-editor-height { height: 420px; }
+</style>
diff --git a/tests/fixtures/markdown-editor/index.html b/tests/fixtures/markdown-editor/index.html
new file mode 100644
index 00000000..c9e6ab0e
--- /dev/null
+++ b/tests/fixtures/markdown-editor/index.html
@@ -0,0 +1 @@
+<div id="app"></div><script type="module" src="/tests/fixtures/markdown-editor/main.ts"></script>
diff --git a/tests/fixtures/markdown-editor/main.ts b/tests/fixtures/markdown-editor/main.ts
new file mode 100644
index 00000000..67bc7f91
--- /dev/null
+++ b/tests/fixtures/markdown-editor/main.ts
@@ -0,0 +1,18 @@
+import '../../../app/assets/css/tailwind.css'
+import * as Vue from 'vue'
+import ThemedMdPreview from '../../../app/components/ThemedMdPreview.vue'
+import { renderMarkdown } from '../../../app/lib/markdown-render'
+import Fixture from './EditorFixture.vue'
+import messages from '../../../i18n/locales/en.json'
+import chineseMessages from '../../../i18n/locales/zh.json'
+const theme = Vue.ref('light')
+// Nuxt auto-imports these in production. The isolated fixture supplies the same
+// Vue APIs without starting auth/database/AI services.
+Object.assign(globalThis, { ...Vue, useEditorTheme: () => theme, useI18n: () => ({ t: (key: string, _params?: unknown, options?: { locale?: string }) => (options?.locale === 'zh' ? chineseMessages : messages).markdownEditor[key.split('.')[1] as keyof typeof messages.markdownEditor] }) })
+Object.assign(window, { renderMarkdown })
+const app = Vue.createApp(Fixture)
+app.component('ClientOnly', { template: '<slot />' })
+app.component('Icon', { props: ['name'], template: '<span :data-icon="name" style="display:inline-block;width:18px;height:18px">◇</span>' })
+app.component('ThemedMdPreview', ThemedMdPreview)
+app.mount('#app')
+Object.assign(window, { theme })
diff --git a/tests/markdown-editor.test.ts b/tests/markdown-editor.test.ts
new file mode 100644
index 00000000..5f834fd4
--- /dev/null
+++ b/tests/markdown-editor.test.ts
@@ -0,0 +1,249 @@
+import { useUploadImg } from '../app/composables/useUploadImg'
+import { prepareLegacyAttachments } from '../app/utils/attachment'
+import { renderMarkdown } from '../app/lib/markdown-render'
+import { strict as assert } from 'node:assert'
+import { test } from 'node:test'
+import { getSchema, type Editor } from '@tiptap/core'
+import { EditorState, TextSelection } from '@tiptap/pm/state'
+import { mapTextOffset, projectMarkdownDraft, markdownSelection, restoreMarkdownSelection } from '../app/lib/markdown-selection'
+import { createMarkdownManager, loadMarkdown, markdownExtensions, parseMarkdownDocument, requiresSourcePreservation, serializeMarkdown, withinMarkdownLimit } from '../app/lib/markdown-editor'
+
+const manager = createMarkdownManager()
+const fixtures = [
+  '', 'Plain text', '中文输入 😀\n第二行', '## Heading\n\n**bold** *italic* ~~deleted~~ `code`',
+  '- first\n- second\n  - nested', '1. first\n2. second', '- [ ] todo\n- [x] done',
+  '> quote\n>\n> - nested', '---', '| A | B |\n| --- | --- |\n| one | two |',
+  '[文档](https://example.com/中文)', '参考这个页面 https://example.com。后面还有话',
+  '```html\n<img width="300">\n```', '![alt](attachment:uploads/a.png)',
+  '![截屏](attachment:uploads/截屏 (1) #test?.png)', 'before ![alt](attachment:uploads/a.png) after',
+  '```md\n![alt](attachment:uploads/a b.png)\n```', 'Prices are $20 and $30.',
+]
+for (const source of fixtures) {
+  test(`preserves original bytes on untouched load: ${source.slice(0, 45)}`, () => {
+    const loaded = loadMarkdown(source, manager)
+    assert.equal(serializeMarkdown(loaded.json, loaded, manager), source)
+    getSchema(markdownExtensions()).nodeFromJSON(loaded.json).check()
+  })
+}
+for (const source of ['<div>old HTML</div>', '<img src="/a.png" style="float:right">', 'Text[^1]\n\n[^1]: footnote', '[ref]: https://example.com\n\n[ref]', '$$x^2$$', '::: unknown\nmessage\n:::']) {
+  test(`preserves unsupported historical source: ${source.slice(0, 40)}`, () => {
+    assert.equal(loadMarkdown(source, manager).sourceOnly, true)
+  })
+}
+test('supports ordinary structural documents without source fallback', () => {
+  for (const source of fixtures.filter(value => !value.includes('Prices'))) {
+    assert.equal(loadMarkdown(source, manager).sourceOnly, false, source)
+  }
+})
+test('keeps attachment storage keys through edits and resolves only for display', () => {
+  const original = '![alt](attachment:uploads/截屏 (1) #?.png)'
+  const loaded = loadMarkdown(original, manager)
+  loaded.json.content!.push({ type: 'paragraph', content: [{ type: 'text', text: 'added' }] })
+  const saved = manager.serialize(loaded.json)
+  assert.match(saved, /attachment:uploads\/截屏 \(1\) #\?\.png/)
+  assert.doesNotMatch(saved, /api\/files/)
+  assert.match(renderMarkdown(saved), /\/api\/files\/uploads\/%E6/)
+  assert.match(renderMarkdown(saved), /%281%29%20%23%3F.png/)
+  assert.deepEqual(parseMarkdownDocument(saved, manager), loaded.json)
+})
+test('does not alter attachment examples inside code', () => {
+  for (const source of ['`![x](attachment:a b.png)`', '```md\n![x](attachment:a b.png)\n```', '```md\n![x](attachment:a b.png)', '````md\n```\n![x](attachment:a b.png)\n````', '`example\n![x](attachment:a b.png)`', '    ![x](attachment:a b.png)']) {
+    assert.equal(prepareLegacyAttachments(source), source)
+    assert.equal(requiresSourcePreservation(source), false)
+  }
+})
+test('does not turn Chinese prose into a link or break explicit international URLs', () => {
+  const bare = parseMarkdownDocument('参考 https://example.com。后面还有话', manager)
+  assert.doesNotMatch(JSON.stringify(bare), /"type":"link"/)
+  const explicit = parseMarkdownDocument('[文档](https://example.com/中文)', manager)
+  assert.match(JSON.stringify(explicit), /"href":"https:\/\/example.com\/中文"/)
+})
+test('length constraints count stored Markdown and allow shrinking existing over-limit text', () => {
+  assert.equal(withinMarkdownLimit('**hello**', 'hello', 5), false)
+  assert.equal(withinMarkdownLimit('123456', '1234567', 5), true)
+  assert.equal(withinMarkdownLimit('12345678', '1234567', 5), false)
+})
+
+function editedRoundtrip(source: string) {
+  const loaded = loadMarkdown(source, manager)
+  assert.equal(loaded.sourceOnly, false, source)
+  const edited = structuredClone(loaded.json)
+  edited.content!.push({ type: 'paragraph', content: [{ type: 'text', text: 'Added paragraph' }] })
+  const saved = manager.serialize(edited)
+  assert.equal(JSON.stringify(parseMarkdownDocument(saved, manager)), JSON.stringify(edited))
+  return { loaded, saved }
+}
+
+test('combined code marks and differently ordered link marks retain their semantics', () => {
+  for (const source of ['**`parameter`**', '[`parameter`](https://example.com)', '[**link**](https://example.com)', '**[link](https://example.com)**']) {
+    const { loaded } = editedRoundtrip(source)
+    assert.equal(loaded.json.content![0]!.content![0]!.marks!.length, 2)
+  }
+})
+test('code fences grow beyond nested fences and preserve literal code on edits', () => {
+  const source = '````text\nExample:\n```ts\nconst x = 1\n```\n````'
+  const { loaded, saved } = editedRoundtrip(source)
+  assert.equal(loaded.json.content![0]!.type, 'codeBlock')
+  assert.equal(loaded.json.content![0]!.content![0]!.text, 'Example:\n```ts\nconst x = 1\n```')
+  assert.match(saved, /^````text/)
+})
+test('legacy directives are editable containers with editable titles and bodies', () => {
+  for (const kind of ['tip', 'warning', 'info', 'danger', 'details', 'code-group']) {
+    const { loaded, saved } = editedRoundtrip(`::: ${kind} Title\nBody **bold**\n:::`)
+    assert.equal(loaded.json.content![0]!.type, 'legacyContainer')
+    assert.equal(loaded.json.content![0]!.content![0]!.type, 'legacyContainerTitle')
+    assert.match(saved, new RegExp(`^::: ${kind} Title`))
+  }
+})
+test('nested containers and code examples containing closing directives remain intact', () => {
+  editedRoundtrip('::: details Outer\n::: tip Inner\ntext\n:::\n```text\n:::\n```\n:::')
+})
+test('HTML figures preserve image dimensions, captions, anchors and literal punctuation', () => {
+  const source = '<figure class="agent-screenshot">\n<img src="/image.png" alt="A &amp; B" width="496" height="776">\n<figcaption>Literal *text* and <strong>bold</strong></figcaption>\n</figure>\n\n<span id="section"></span>'
+  const { loaded, saved } = editedRoundtrip(source)
+  assert.equal(loaded.json.content![0]!.type, 'legacyFigure')
+  assert.equal(loaded.json.content![0]!.content![0]!.attrs!.width, '496')
+  assert.equal(loaded.json.content![0]!.content![1]!.content![0]!.text, 'Literal *text* and ')
+  assert.equal(loaded.json.content![1]!.type, 'legacyAnchor')
+  assert.match(saved, /width="496" height="776"/)
+  assert.match(saved, /<strong>bold<\/strong>/)
+  assert.match(saved, /<span id="section"><\/span>/)
+})
+test('standalone and inline HTML images remain actual images, not escaped text', () => {
+  for (const source of ['<img src="/a.png" width="300">', 'before <img src="/a.png" width="300"> after']) {
+    const { loaded, saved } = editedRoundtrip(source)
+    assert.ok(loaded.json.content![0]!.content!.some(node => node.type === 'image'))
+    assert.match(saved, /<img src="\/a.png" width="300">/)
+  }
+})
+test('unimplemented HTML attributes or caption elements still preserve source', () => {
+  for (const source of ['<figure><img src="/a.png" onclick="bad()"><figcaption>Text</figcaption></figure>', '<figure><img src="/a.png"><figcaption><span class="custom">Text</span></figcaption></figure>']) {
+    assert.equal(loadMarkdown(source, manager).sourceOnly, true)
+  }
+})
+
+test('unfinished feedback templates retain empty numbered list items', () => {
+  for (const source of ['### Steps\n1. \n2. \n3. \n\n### Environment\n- Browser:']) {
+    const { loaded } = editedRoundtrip(source)
+    const lists = loaded.json.content!.filter(node => ['orderedList', 'bulletList', 'taskList'].includes(node.type!))
+    assert.ok(lists.length)
+    for (const list of lists) for (const item of list.content!) assert.equal(item.content![0]!.type, 'paragraph')
+  }
+})
+
+test('ordinary prose mentioning directive punctuation is not a directive block', () => {
+  editedRoundtrip('## Help\n\n正文中提到 ::: 语法，不应触发源码回退。')
+  assert.equal(loadMarkdown('::: unknown\nbody\n:::', manager).sourceOnly, true)
+})
+
+
+test('selection mapping preserves original Markdown spelling and UTF-16 offsets', () => {
+  const canonical = '| A | B |\n| --- | --- |\n| 😀 alpha beta | end |'
+  const original = '| A    | B |\n| ----- | --- |\n| 😀 alpha beta   | end |\n'
+  assert.equal(mapTextOffset(canonical, original, canonical.indexOf('beta')), original.indexOf('beta'))
+  assert.equal(mapTextOffset(original, canonical, original.indexOf('beta')), canonical.indexOf('beta'))
+  assert.equal(projectMarkdownDraft('before after', 'before ****after', 'before after\n'), 'before ****after\n')
+})
+
+test('source caret retains the distinction between inside and outside inline code', () => {
+  const schema = getSchema(markdownExtensions())
+  const source = '`test`'
+  let state = EditorState.create({ schema, doc: schema.nodeFromJSON(parseMarkdownDocument(source, manager)) })
+  const editor = {
+    get state() { return state }, schema,
+    getJSON() { return state.doc.toJSON() },
+    view: { dispatch(transaction: Parameters<EditorState['apply']>[0]) { state = state.apply(transaction) } },
+  } as unknown as Editor
+  restoreMarkdownSelection(editor, manager, source, source.length - 1)
+  assert.equal(state.selection.from, 5)
+  assert.deepEqual(state.storedMarks?.map(mark => mark.type.name), ['code'])
+  restoreMarkdownSelection(editor, manager, source, source.length)
+  assert.equal(state.selection.from, 5)
+  assert.deepEqual(state.storedMarks, [])
+  const mapped = markdownSelection(editor, manager)
+  assert.equal(mapped.from, source.length, 'explicit plain input state maps outside the code fence')
+  state = state.apply(state.tr.setSelection(TextSelection.create(state.doc, 3)))
+  assert.equal(markdownSelection(editor, manager).from, 3)
+})
+
+test('inline code saves Markdown delimiters rather than escaped literal backticks', () => {
+  for (const text of ['test', 'a`b', '`test`', "'test'", 'a ** b']) {
+    const json = { type: 'doc', content: [{ type: 'paragraph', content: [{ type: 'text', text, marks: [{ type: 'code' }] }] }] }
+    const saved = manager.serialize(json)
+    assert.equal(saved.startsWith('\\`'), false)
+    assert.deepEqual(parseMarkdownDocument(saved, manager), json)
+  }
+})
+
+// Public rendering must remain safe and deterministic without browser globals.
+test('public preview renders Markdown, task lists, legacy HTML and containers on the server', () => {
+  const html = renderMarkdown('## Title\n\n- [x] done\n\n::: tip **Note**\nBody\n:::\n\n<figure><img src="attachment:uploads/image.png" width="320"><figcaption>Caption</figcaption></figure>')
+  assert.match(html, /<h2 id="heading-0">Title<\/h2>/)
+  assert.match(html, /type="checkbox" disabled checked/)
+  assert.match(html, /data-md-container="tip"/)
+  assert.match(html, /<strong>Note<\/strong>/)
+  assert.match(html, /src="\/api\/files\/uploads\/image.png" width="320"/)
+  assert.match(html, /<figcaption>Caption<\/figcaption>/)
+})
+test('public preview preserves the heading-id callback contract and indexes', () => {
+  const seen: unknown[] = []
+  const html = renderMarkdown('# A\n\n## B', heading => { seen.push(heading); return `custom-${heading.index}` })
+  assert.deepEqual(seen, [{ text: 'A', level: 1, index: 0 }, { text: 'B', level: 2, index: 1 }])
+  assert.match(html, /id="custom-1"/)
+})
+test('public preview removes executable HTML, unsafe URLs and caller-injected HTML', () => {
+  const html = renderMarkdown('<script>alert(1)</script><img src="javascript:alert(1)" onerror="alert(1)"><iframe src="https://example.com"></iframe><input type="text" autofocus onfocus="alert(1)">', undefined, value => value + '<script>injected()</script><a href="javascript:alert(2)">unsafe</a>')
+  assert.doesNotMatch(html, /script|iframe|javascript:|onerror|onfocus|autofocus/)
+  assert.match(html, /<input type="checkbox" disabled/)
+})
+test('public preview keeps code fences literal, including attachment examples and HTML', () => {
+  const html = renderMarkdown('```html\n<script>example()</script>\n<img src="attachment:uploads/a.png">\n```')
+  assert.match(html, /&lt;script&gt;example\(\)&lt;\/script&gt;/)
+  assert.match(html, /attachment:uploads\/a.png/)
+})
+test('historical superscript and subscript still render in public previews', () => {
+  assert.match(renderMarkdown('H~2~O and x^2^'), /H<sub>2<\/sub>O and x<sup>2<\/sup>/)
+})
+test('server-rendered code retains frame, language, line numbers and nested fence text', () => {
+  const html = renderMarkdown('````text\n嵌套代码示例：\n```js\nconsole.log("hello")\n```\n````')
+  assert.match(html, /class="md-editor-code fdl-code-view"/)
+  assert.match(html, /class="md-editor-code-head"/)
+  assert.match(html, /class="fdl-code-language-label">Plain text<\/span>/)
+  assert.match(html, /class="fdl-code-lines" aria-hidden="true">1\n2\n3\n4<\/div>/)
+  assert.match(html, /console.log\("hello"\)/)
+  assert.match(html, /<button type="button" class="fdl-code-collapse" aria-label="Collapse or expand code" aria-expanded="true">/)
+})
+test('code labels and HTML-like fence metadata stay escaped and safe', () => {
+  const html = renderMarkdown('```<img/onerror=alert(1)>\n<script>literal()</script>\n```', undefined, undefined, { collapse: '收起代码', plainText: '纯文本' })
+  assert.match(html, /aria-label="收起代码"/)
+  assert.doesNotMatch(html, /<script|<img/)
+  assert.match(html, /&lt;script&gt;literal\(\)&lt;\/script&gt;/)
+  assert.match(renderMarkdown('    indented code'), /class="fdl-code-view"|class="md-editor-code fdl-code-view"/)
+})
+
+test('image uploads gate identity and report total, malformed and partial failures', async (t) => {
+  const previous = Object.getOwnPropertyDescriptor(globalThis, '$fetch')
+  t.after(() => { if (previous) Object.defineProperty(globalThis, '$fetch', previous); else Reflect.deleteProperty(globalThis, '$fetch') })
+  let calls = 0
+  let results: unknown[] = []
+  Object.defineProperty(globalThis, '$fetch', { configurable: true, value: async () => {
+    calls++
+    const result = results.shift()
+    if (result instanceof Error) throw result
+    return result
+  } })
+  const file = new File(['image'], 'image.png', { type: 'image/png' })
+  const inserted: string[][] = []
+  const callback = (urls: string[]) => { inserted.push(urls) }
+  await useUploadImg(async () => false).onUploadImg([file], callback)
+  assert.equal(calls, 0)
+  assert.deepEqual(inserted, [])
+  results = [new Error('401')]
+  await assert.rejects(useUploadImg().onUploadImg([file], callback), /uploadFailed/)
+  results = [{}]
+  await assert.rejects(useUploadImg().onUploadImg([file], callback), /uploadFailed/)
+  assert.deepEqual(inserted, [])
+  results = [{ key: 'valid.png' }, new Error('500')]
+  await assert.rejects(useUploadImg().onUploadImg([file, file], callback), /partialUpload/)
+  assert.deepEqual(inserted, [['attachment:valid.png']])
+})