autumnnote 1.5.0 → 1.6.1

package/dist/autumnnote.umd.js

@@ -114,27 +114,71 @@
 		const handler = (e) => {
 			if (e.key === "Escape") {
 				e.stopPropagation();
-				onEscape && onEscape();
+				onEscape?.();
 				return;
 			}
 			if (e.key !== "Tab") return;
 			const els = getFocusable();
 			if (!els.length) return;
 			const first = els[0];
-			const last = els[els.length - 1];
+			const last = els.at(-1);
 			if (e.shiftKey) {
 				if (document.activeElement === first) {
 					e.preventDefault();
-					last.focus();
+					/** @type {HTMLElement} */ last.focus();
 				}
 			} else if (document.activeElement === last) {
 				e.preventDefault();
-				first.focus();
+				/** @type {HTMLElement} */ first.focus();
 			}
 		};
 		document.addEventListener("keydown", handler);
 		return () => document.removeEventListener("keydown", handler);
 	}
+	/**
+	* Makes a dialog box draggable by its handle element.
+	* On first drag the box is pinned to its current viewport coordinates via
+	* `position:fixed`, freeing it from the parent flex container's centering.
+	* The position is clamped to the visible viewport.
+	*
+	* @param {HTMLElement} handle  Element the user grabs (title bar / header)
+	* @param {HTMLElement} box     Element that actually moves
+	* @returns {Function}          Cleanup function (removes the mousedown listener)
+	*/
+	function makeDraggable(handle, box) {
+		handle.style.cursor = "grab";
+		const onMousedown = (e) => {
+			if (e.button !== 0) return;
+			if (e.target.closest("button, input, select, textarea, a")) return;
+			e.preventDefault();
+			if (!box.dataset.anDragPinned) {
+				const r = box.getBoundingClientRect();
+				box.style.position = "fixed";
+				box.style.margin = "0";
+				box.style.left = `${r.left}px`;
+				box.style.top = `${r.top}px`;
+				box.dataset.anDragPinned = "1";
+			}
+			const startX = e.clientX - Number.parseFloat(box.style.left);
+			const startY = e.clientY - Number.parseFloat(box.style.top);
+			handle.style.cursor = "grabbing";
+			const onMove = (ev) => {
+				const bw = box.offsetWidth;
+				const bh = box.offsetHeight;
+				box.style.left = `${Math.max(0, Math.min(ev.clientX - startX, globalThis.innerWidth - bw))}px`;
+				box.style.top = `${Math.max(0, Math.min(ev.clientY - startY, globalThis.innerHeight - bh))}px`;
+			};
+			const onUp = () => {
+				handle.style.cursor = "grab";
+				document.removeEventListener("mousemove", onMove);
+				document.removeEventListener("mouseup", onUp);
+			};
+			document.addEventListener("mousemove", onMove);
+			document.addEventListener("mouseup", onUp);
+		};
+		handle.addEventListener("mousedown", onMousedown);
+		return () => handle.removeEventListener("mousedown", onMousedown);
+	}
 	//#endregion
 	//#region src/js/core/range.js
 	/**
@@ -168,10 +212,10 @@
 			return range;
 		}
 		/**
-		* Select this wrapped range in the window.
+		* Select this wrapped range in the globalThis.
 		*/
 		select() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel) return;
 			sel.removeAllRanges();
 			sel.addRange(this.toNativeRange());
@@ -224,13 +268,13 @@
 		return new WrappedRange(range.startContainer, range.startOffset, range.endContainer, range.endOffset);
 	}
 	/**
-	* Returns a WrappedRange for the current window selection,
+	* Returns a WrappedRange for the current globalThis selection,
 	* optionally restricted to a given editable element.
 	* @param {HTMLElement} [editable]
 	* @returns {WrappedRange|null}
 	*/
 	function currentRange(editable) {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || sel.rangeCount === 0) return null;
 		const native = sel.getRangeAt(0);
 		if (editable && !editable.contains(native.commonAncestorContainer)) return null;
@@ -241,7 +285,7 @@
 	* @param {Function} fn
 	*/
 	function withSavedRange(fn) {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || sel.rangeCount === 0) {
 			fn(null);
 			return;
@@ -276,16 +320,16 @@
 	* execCommand's state detection is unreliable.
 	*/
 	function underline() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return;
 		let container = sel.getRangeAt(0).commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
-		const uEl = container && container.closest && container.closest("u");
+		const uEl = container?.closest("u");
 		const nativeState = document.queryCommandState("underline");
 		if (uEl && !nativeState) {
 			const parent = uEl.parentNode;
 			while (uEl.firstChild) parent.insertBefore(uEl.firstChild, uEl);
-			parent.removeChild(uEl);
+			uEl.remove();
 			return;
 		}
 		execCommand("underline");
@@ -296,16 +340,16 @@
 	* execCommand's state detection is unreliable (mirrors underline() logic).
 	*/
 	function strikethrough() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
-		const sEl = sc && sc.closest && (sc.closest("s") || sc.closest("strike"));
+		const sEl = sc?.closest("s") || sc?.closest("strike");
 		const nativeState = document.queryCommandState("strikeThrough");
 		if (sEl && !nativeState) {
 			const parent = sEl.parentNode;
 			while (sEl.firstChild) parent.insertBefore(sEl.firstChild, sEl);
-			parent.removeChild(sEl);
+			sEl.remove();
 			return;
 		}
 		execCommand("strikeThrough");
@@ -337,10 +381,10 @@
 	* Sets the font size (in pt or with unit) for the selection.
 	* Uses a span-based approach to set px sizes precisely.
 	* @param {string} size - e.g. '14px'
-	* @param {HTMLElement} [editable] - scoping element to avoid touching nodes outside this editor
+	* @param {HTMLElement|Document} [editable] - scoping element to avoid touching nodes outside this editor
 	*/
 	function fontSize(size, editable = document) {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		const wasCollapsed = !sel || !sel.rangeCount || sel.getRangeAt(0).collapsed;
 		if (wasCollapsed && sel && sel.rangeCount > 0) {
 			try {
@@ -366,12 +410,12 @@
 			span.style.fontSize = size;
 			el.parentNode.insertBefore(span, el);
 			while (el.firstChild) span.appendChild(el.firstChild);
-			el.parentNode.removeChild(el);
+			el.remove();
 			newSpans.push(span);
 		});
 		if (!wasCollapsed && sel && newSpans.length > 0) {
 			const first = newSpans[0];
-			const last = newSpans[newSpans.length - 1];
+			const last = newSpans.at(-1);
 			try {
 				const nr = document.createRange();
 				const startNode = first.firstChild || first;
@@ -415,11 +459,11 @@
 	* (which would destroy the ul > li checklist structure).
 	*/
 	function outdent() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (sel && sel.rangeCount) {
 			let container = sel.getRangeAt(0).commonAncestorContainer;
 			if (container.nodeType === 3) container = container.parentElement;
-			const checkLi = container && container.closest && container.closest(".an-checklist li");
+			const checkLi = container?.closest(".an-checklist li");
 			if (checkLi) {
 				_checklistItemToP(checkLi);
 				return;
@@ -449,7 +493,7 @@
 			if (child.nodeType === 1 && child.tagName === "INPUT") continue;
 			p.appendChild(child.cloneNode(true));
 		}
-		p.innerHTML = p.innerHTML.replace(/\u200B/g, "");
+		p.innerHTML = p.innerHTML.replaceAll("​", "");
 		if (!p.hasChildNodes() || !p.textContent.trim()) {
 			p.innerHTML = "";
 			p.appendChild(document.createTextNode("\xA0"));
@@ -461,14 +505,14 @@
 			checkUl.parentNode.insertBefore(newUl, checkUl.nextSibling);
 		}
 		checkUl.parentNode.insertBefore(p, checkUl.nextSibling);
-		checkUl.removeChild(checkLi);
-		if (checkUl.children.length === 0) checkUl.parentNode.removeChild(checkUl);
+		checkLi.remove();
+		if (checkUl.children.length === 0) checkUl.remove();
 		try {
 			const nr = document.createRange();
 			const firstChild = p.firstChild;
 			nr.setStart(firstChild && firstChild.nodeType === 3 ? firstChild : p, 0);
 			nr.collapse(true);
-			const s = window.getSelection();
+			const s = globalThis.getSelection();
 			if (s) {
 				s.removeAllRanges();
 				s.addRange(nr);
@@ -492,7 +536,7 @@
 	* @param {string} value - Line-height value to apply; typically a unitless multiplier (for example, "1.5").
 	*/
 	function lineHeight(value) {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || sel.rangeCount === 0) return;
 		const range = sel.getRangeAt(0);
 		const BLOCK_TAGS = new Set([
@@ -541,25 +585,25 @@
 	/**
 	* Wraps the selection in an inline <code> element, or unwraps it if the
 	* cursor is already inside a <code> that is not inside a <pre>.
-	* @param {HTMLElement} [editable]
+	* @param {HTMLElement} [_editable]
 	*/
-	function toggleInlineCode(editable) {
-		const sel = window.getSelection();
+	function toggleInlineCode(_editable) {
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return;
 		const range = sel.getRangeAt(0);
 		let container = range.commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
-		const codeEl = container && container.closest ? container.closest("code") : null;
+		const codeEl = container?.closest("code");
 		if (codeEl && !codeEl.closest("pre")) {
 			const parent = codeEl.parentNode;
 			const prevSibling = codeEl.previousSibling;
 			const movedChildren = Array.from(codeEl.childNodes);
 			while (codeEl.firstChild) parent.insertBefore(codeEl.firstChild, codeEl);
-			parent.removeChild(codeEl);
-			if (parent && parent.normalize) parent.normalize();
+			codeEl.remove();
+			parent?.normalize();
 			if (movedChildren.length > 0) try {
 				const firstMoved = movedChildren[0];
-				const lastMoved = movedChildren[movedChildren.length - 1];
+				const lastMoved = movedChildren.at(-1);
 				const nr = document.createRange();
 				const anchorNode = firstMoved.parentNode === parent ? firstMoved : prevSibling ? prevSibling.nextSibling : parent.firstChild;
 				if (anchorNode) {
@@ -600,11 +644,11 @@
 	* @returns {boolean}
 	*/
 	function isInlineCode() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return false;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
-		const code = sc && sc.closest ? sc.closest("code") : null;
+		const code = sc?.closest("code");
 		return !!(code && !code.closest("pre"));
 	}
 	/**
@@ -622,30 +666,30 @@
 	* Empty or whitespace-only selections do not create a checklist.
 	*/
 	function toggleChecklist() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return;
 		const range = sel.getRangeAt(0);
 		let container = range.commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
-		const ul = container.closest && container.closest(".an-checklist");
+		const ul = container?.closest(".an-checklist");
 		if (ul) {
 			const selectedLis = Array.from(ul.querySelectorAll("li")).filter((li) => sel.containsNode(li, true));
 			if (selectedLis.length > 0) {
-				let firstP = null;
+				/** @type {HTMLElement|null} */ let firstP = null;
 				selectedLis.forEach((li) => {
 					const p = document.createElement("p");
 					for (const child of li.childNodes) {
 						if (child.nodeType === 1 && child.tagName === "INPUT") continue;
 						p.appendChild(child.cloneNode(true));
 					}
-					p.innerHTML = p.innerHTML.replace(/\u200b/g, "");
+					p.innerHTML = p.innerHTML.replaceAll("​", "");
 					if (!p.hasChildNodes() || !p.textContent.trim()) {
 						p.innerHTML = "";
 						p.appendChild(document.createTextNode("\xA0"));
 					}
 					ul.parentNode.insertBefore(p, ul);
 					if (!firstP) firstP = p;
-					ul.removeChild(li);
+					li.remove();
 				});
 				if (ul.children.length === 0) ul.remove();
 				if (firstP) {
@@ -673,7 +717,7 @@
 			]);
 			let block = container;
 			while (block && block.parentNode && !BLOCK_TAGS.has(block.tagName)) block = block.parentNode;
-			const itemText = block && BLOCK_TAGS.has(block.tagName) ? Array.from(block.childNodes).map((n) => n.textContent).join("").replace(/\u00a0/g, " ") : "";
+			const itemText = block && BLOCK_TAGS.has(block.tagName) ? Array.from(block.childNodes).map((n) => n.textContent).join("").replaceAll("\xA0", " ") : "";
 			const ul = document.createElement("ul");
 			ul.className = "an-checklist";
 			const li = document.createElement("li");
@@ -729,7 +773,7 @@
 		if (blocks.length === 0) return;
 		const newUl = document.createElement("ul");
 		newUl.className = "an-checklist";
-		let lastTextNode = null;
+		/** @type {Text|null} */ let lastTextNode = null;
 		blocks.forEach((block) => {
 			const li = document.createElement("li");
 			const cb = document.createElement("input");
@@ -744,7 +788,7 @@
 		});
 		const firstBlock = blocks[0];
 		firstBlock.parentNode.insertBefore(newUl, firstBlock);
-		blocks.forEach((block) => block.parentNode && block.parentNode.removeChild(block));
+		blocks.forEach((block) => block.remove());
 		if (lastTextNode) {
 			const nr = document.createRange();
 			nr.setStart(lastTextNode, lastTextNode.textContent.length);
@@ -758,11 +802,11 @@
 	* @returns {boolean}
 	*/
 	function isInChecklist() {
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return false;
 		let container = sel.getRangeAt(0).commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
-		return !!(container && container.closest && container.closest(".an-checklist li"));
+		return !!container?.closest(".an-checklist li");
 	}
 	//#endregion
 	//#region src/js/module/Buttons.js
@@ -773,12 +817,14 @@
 	*/
 	/**
 	* @typedef {object} DropdownDef
-	* @property {string}   name       - unique identifier
-	* @property {'select'} type       - discriminator for Toolbar renderer
+	* @property {string}   name          - unique identifier
+	* @property {'select'} type          - discriminator for Toolbar renderer
 	* @property {string}   tooltip
-	* @property {string[]} [items]    - overridden at render time from options
-	* @property {Function} action     - called with (context, value)
-	* @property {Function} [getValue] - called with (context) to get current value
+	* @property {Array<string|{value:string,label:string,disabled?:boolean}>} [items] - overridden at render time from options
+	* @property {Function} action        - called with (context, value)
+	* @property {Function} [getValue]    - called with (context) to get current value
+	* @property {string}   [selectClass] - extra CSS class(es) for the <select>
+	* @property {string}   [placeholder] - placeholder text for the empty option
 	*/
 	/**
 	* @typedef {object} ButtonDef
@@ -842,11 +888,11 @@
 	var italicBtn = btn("italic", "italic", "Italic (Ctrl+I)", () => italic(), () => document.queryCommandState("italic"));
 	var underlineBtn = btn("underline", "underline", "Underline (Ctrl+U)", () => underline(), () => {
 		if (document.queryCommandState("underline")) return true;
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || !sel.rangeCount) return false;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
-		return !!(sc && sc.closest && sc.closest("u"));
+		return !!(sc && sc.closest("u"));
 	});
 	var strikeBtn = btn("strikethrough", "strikethrough", "Strikethrough", () => strikethrough(), () => document.queryCommandState("strikeThrough"));
 	var superscriptBtn = btn("superscript", "superscript", "Superscript", () => superscript(), () => document.queryCommandState("superscript"));
@@ -905,15 +951,15 @@
 		action: (ctx, value) => fontSize(value, ctx.layoutInfo.editable),
 		getValue: (ctx) => {
 			try {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (sel && sel.rangeCount) {
 					let el = sel.getRangeAt(0).startContainer;
-					if (el.nodeType === 3) el = el.parentElement;
+					if (el && el.nodeType === 3) el = el.parentElement;
 					while (el && el.nodeType === 1 && !el.style.fontSize) el = el.parentElement;
-					const size = el && el.style && el.style.fontSize ? el.style.fontSize : "";
+					const size = el && el.style.fontSize ? el.style.fontSize : "";
 					if (size) return size;
 				}
-				const editable = ctx && ctx.layoutInfo && ctx.layoutInfo.editable;
+				const editable = ctx?.layoutInfo?.editable;
 				if (editable) return editable.style.fontSize || "";
 				return "";
 			} catch {
@@ -1010,7 +1056,7 @@
 		action: (_ctx, value) => lineHeight(value),
 		getValue: () => {
 			try {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || !sel.rangeCount) return "";
 				const BLOCKS = new Set([
 					"P",
@@ -1028,8 +1074,11 @@
 					"TH"
 				]);
 				let el = sel.getRangeAt(0).startContainer;
-				if (el.nodeType === 3) el = el.parentElement;
-				while (el && !BLOCKS.has(el.tagName)) el = el.parentElement;
+				if (el && el.nodeType === 3) el = el.parentElement;
+				while (el && !BLOCKS.has(
+					/** @type {Element} */
+					el.tagName
+				)) el = el.parentElement;
 				if (!el) return "";
 				return el.style.lineHeight || getComputedStyle(el).lineHeight || "";
 			} catch {
@@ -1052,47 +1101,64 @@
 	*/
 	/**
 	* @typedef {object} AsnOptions
-	* @property {string}   [placeholder]       - Placeholder text when editor is empty
-	* @property {number}   [height]            - Editor height in px (min)
-	* @property {number}   [minHeight]         - Minimum height in px
-	* @property {number}   [maxHeight]         - Maximum height in px (0 = unlimited)
-	* @property {boolean}  [focus]             - Auto-focus on init
-	* @property {boolean}  [resizable]         - Show resize handle
-	* @property {Array}    [toolbar]           - Toolbar button group config
-	* @property {boolean}  [pasteAsPlainText]  - Force plain-text paste
-	* @property {boolean}  [pasteCleanHTML]    - Sanitise HTML on paste
+	* @property {string}   [placeholder]          - Placeholder text when editor is empty
+	* @property {number}   [height]               - Editor height in px (min)
+	* @property {number}   [minHeight]            - Minimum height in px
+	* @property {number}   [maxHeight]            - Maximum height in px (0 = unlimited)
+	* @property {boolean}  [focus]                - Auto-focus on init
+	* @property {boolean}  [resizable]            - Show resize handle
+	* @property {Array}    [toolbar]              - Toolbar button group config
+	* @property {boolean}  [useBootstrap]         - Use Bootstrap button classes on toolbar buttons
+	* @property {string}   [toolbarButtonClass]   - CSS classes for Bootstrap toolbar buttons
+	* @property {boolean}  [useFontAwesome]       - Use Font Awesome icons (default: true)
+	* @property {string}   [fontAwesomeClass]     - Font Awesome prefix class, e.g. 'fas' or 'fa-solid'
+	* @property {boolean}  [pasteAsPlainText]     - Force plain-text paste
+	* @property {boolean}  [pasteCleanHTML]       - Sanitise HTML on paste
 	* @property {boolean}  [pasteStripAttributes] - Strip class/style/data-* from pasted HTML (default: false)
-	* @property {boolean}  [allowImageUpload]  - Allow file upload in image dialog
-	* @property {number}   [maxImageSize]      - Max upload size in MB
-	* @property {number}   [tabSize]           - Spaces per tab in non-list context
-	* @property {Function} [onChange]          - Callback on content change
-	* @property {Function} [onFocus]           - Callback on focus
-	* @property {Function} [onBlur]            - Callback on blur
-	* @property {Function} [onImageUpload]     - Custom upload handler: (files) => void
-	* @property {boolean}  [stickyToolbar]     - Stick the toolbar to the viewport top when scrolling
-	* @property {number}   [stickyToolbarOffset] - Top offset in px for sticky toolbar (e.g. fixed nav height)
-	* @property {string}   [theme]             - 'light' (default) | 'dark'
-	* @property {boolean}  [codeHighlight]     - Auto-load Prism.js for syntax highlighting of code blocks
-	* @property {string}   [codeHighlightCDN]  - CDN base URL for Prism assets (defaults to cdnjs)
-	* @property {boolean}  [markdownPaste]     - Convert pasted Markdown text to HTML (default: true)
-	* @property {boolean}  [readOnly]          - Start editor in read-only / non-editable mode
-	* @property {boolean}  [spellcheck]        - Enable browser spellcheck in the editable area (default: true)
-	* @property {string}   [direction]         - Text direction: 'ltr' (default) | 'rtl'
-	* @property {string}   [toolbarOverflow]   - Toolbar overflow strategy: 'wrap' (default) | 'scroll'
-	* @property {boolean}  [autoSave]          - Auto-save content to localStorage on change
-	* @property {string}   [autoSaveKey]       - localStorage key used for auto-save (default: 'autumnnote-autosave')
-	* @property {number}   [maxChars]          - Maximum character count (0 = unlimited). Shows warning in statusbar.
-	* @property {number}   [maxWords]          - Maximum word count (0 = unlimited). Shows warning in statusbar.
-	* @property {boolean}  [tableHeaderRow]    - Insert a header row (<thead><th>) when creating tables
-	* @property {Function} [onPaste]           - Callback fired on every paste: ({ text, html }) => void
-	* @property {Function} [onSelectionChange]   - Callback fired on cursor/selection change: (context) => void
-	* @property {string[]}  [colorSwatches]       - Custom brand colour swatches prepended to the colour-picker palette
+	* @property {boolean}  [allowImageUpload]     - Allow file upload in image dialog
+	* @property {number}   [maxImageSize]         - Max upload size in MB
+	* @property {number}   [tabSize]              - Spaces per tab in non-list context
+	* @property {number}   [historyLimit]         - Maximum undo/redo history steps
+	* @property {string}   [defaultFontFamily]    - Default font family applied to the editable area on init
+	* @property {string}   [defaultFontSize]      - Default font size applied to the editable area on init (e.g. '14px')
+	* @property {string[]} [fontFamilies]         - Font families shown in the font-family toolbar dropdown
+	* @property {Function} [onChange]             - Callback on content change
+	* @property {Function} [onFocus]              - Callback on focus
+	* @property {Function} [onBlur]               - Callback on blur
+	* @property {Function} [onInit]               - Callback after the editor has initialised
+	* @property {Function} [onImageUpload]        - Custom upload handler: (files) => void
+	* @property {Function} [onImageError]         - Callback when an image upload error occurs
+	* @property {boolean}  [stickyToolbar]        - Stick the toolbar to the viewport top when scrolling
+	* @property {number}   [stickyToolbarOffset]  - Top offset in px for sticky toolbar (e.g. fixed nav height)
+	* @property {string}   [theme]                - 'light' (default) | 'dark'
+	* @property {boolean}  [codeHighlight]        - Auto-load Prism.js for syntax highlighting of code blocks
+	* @property {string}   [codeHighlightCDN]     - CDN base URL for Prism assets (defaults to cdnjs)
+	* @property {boolean}  [markdownPaste]        - Convert pasted Markdown text to HTML (default: true)
+	* @property {boolean}  [readOnly]             - Start editor in read-only / non-editable mode
+	* @property {boolean}  [spellcheck]           - Enable browser spellcheck in the editable area (default: true)
+	* @property {string}   [direction]            - Text direction: 'ltr' (default) | 'rtl'
+	* @property {string}   [toolbarOverflow]      - Toolbar overflow strategy: 'wrap' (default) | 'scroll'
+	* @property {boolean}  [autoSave]             - Auto-save content to localStorage on change
+	* @property {string}   [autoSaveKey]          - localStorage key used for auto-save (default: 'autumnnote-autosave')
+	* @property {number}   [maxChars]             - Maximum character count (0 = unlimited). Shows warning in statusbar.
+	* @property {number}   [maxWords]             - Maximum word count (0 = unlimited). Shows warning in statusbar.
+	* @property {boolean}  [tableHeaderRow]       - Insert a header row (<thead><th>) when creating tables
+	* @property {Function} [onPaste]              - Callback fired on every paste: ({ text, html }) => void
+	* @property {Function} [onSelectionChange]    - Callback fired on cursor/selection change: (context) => void
+	* @property {string[]} [colorSwatches]        - Custom brand colour swatches prepended to the colour-picker palette
 	* @property {Function} [onDestroy]            - Callback fired when the editor is destroyed: (context) => void
 	* @property {Function} [onCharLimitReached]   - Callback fired when the character limit is hit: (context) => void
 	* @property {Function} [onWordLimitReached]   - Callback fired when the word limit is hit: (context) => void
-	* @property {string}   [focusColor]            - Custom focus ring colour, e.g. '#f97316'. Overrides the default blue.
+	* @property {string}   [focusColor]           - Custom focus ring colour, e.g. '#f97316'. Overrides the default blue.
+	* @property {boolean}  [autoSaveRestore]      - Show a restore banner when a previously auto-saved draft exists
+	* @property {number}   [autoSaveRestoreTimeout] - Maximum age in days for a draft to be offered for restore (0 = no expiry)
+	* @property {Function} [onAutoSaveRestore]    - Callback fired after the user chooses to restore a draft
+	* @property {boolean}  [markdownShortcuts]    - Convert markdown syntax typed inline to HTML
+	* @property {boolean}  [bubbleToolbar]        - Show a mini floating toolbar above text selections
+	* @property {string[]} [bubbleToolbarItems]   - Button names for the bubble toolbar
+	* @property {object|null} [mention]            - @mention configuration (onSearch, minChars, ...)
+	* @property {string}   [lang]                 - Display language or partial locale object override
 	*/
-	/** @type {AsnOptions} */
 	var defaultOptions = {
 		placeholder: "",
 		height: 200,
@@ -1552,6 +1618,8 @@
 				rowHeight: "Row Height",
 				tableBorderWidth: "Table Border Width",
 				deleteTable: "Delete Table",
+				cellBackground: "Cell Background",
+				noShading: "No Shading",
 				columnWidthPx: "Column Width (px)",
 				rowHeightPx: "Row Height (px)",
 				tableBorderWidthPx: "Table Border Width (px)",
@@ -1907,6 +1975,8 @@
 					rowHeight: "Chiều cao hàng",
 					tableBorderWidth: "Độ rộng viền bảng",
 					deleteTable: "Xóa bảng",
+					cellBackground: "Màu Nền Ô",
+					noShading: "Xóa Màu Nền",
 					columnWidthPx: "Chiều rộng cột (px)",
 					rowHeightPx: "Chiều cao hàng (px)",
 					tableBorderWidthPx: "Độ rộng viền bảng (px)",
@@ -4101,14 +4171,17 @@
 		} catch (_) {}
 		if (!initialContent) initialContent = targetEl.tagName === "TEXTAREA" ? (targetEl.value || "").trim() : (targetEl.innerHTML || "").trim();
 		editable.innerHTML = sanitiseHTML(initialContent, { allowIframes: true });
-		const defaultFont = options.defaultFontFamily || options.fontFamilies && options.fontFamilies[0];
+		const defaultFont = options.defaultFontFamily || options.fontFamilies?.[0];
 		if (defaultFont) editable.style.fontFamily = defaultFont;
 		if (options.defaultFontSize) editable.style.fontSize = options.defaultFontSize;
 		if (options.height) editable.style.minHeight = `${options.height}px`;
 		else if (options.minHeight) editable.style.minHeight = `${options.minHeight}px`;
 		if (options.maxHeight) editable.style.maxHeight = `${options.maxHeight}px`;
 		container.appendChild(editable);
-		if (options.theme === "dark") container.classList.add("an-theme-dark");
+		if (options.theme === "dark") {
+			container.classList.add("an-theme-dark");
+			document.body.classList.add("an-theme-dark");
+		}
 		if (options.readOnly) {
 			container.classList.add("an-disabled");
 			editable.querySelectorAll("ul.an-checklist input[type=\"checkbox\"]").forEach((cb) => {
@@ -4146,7 +4219,7 @@
 		constructor(editable, limit = 100) {
 			this.editable = editable;
 			this._limit = limit;
-			/** @type {Array<{html: string, range: {sc: string, so: number, ec: string, eo: number}|null}>} */
+			/** @type {Array<{html: string, images?: Record<string,string>, sel: {start: number, end: number}|null}>} */
 			this.stack = [];
 			this.stackOffset = -1;
 			this._savePoint();
@@ -4160,7 +4233,7 @@
 		* @returns {{ start: number, end: number }|null}
 		*/
 		_serializeSelection() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || sel.rangeCount === 0) return null;
 			const range = sel.getRangeAt(0);
 			if (!this.editable.contains(range.startContainer)) return null;
@@ -4226,7 +4299,7 @@
 				const range = document.createRange();
 				range.setStart(startNode, startOff);
 				range.setEnd(endNode, endOff);
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				sel.removeAllRanges();
 				sel.addRange(range);
 			} catch (_) {
@@ -4234,7 +4307,7 @@
 					const fb = document.createRange();
 					fb.setStart(this.editable, 0);
 					fb.collapse(true);
-					const s = window.getSelection();
+					const s = globalThis.getSelection();
 					if (s) {
 						s.removeAllRanges();
 						s.addRange(fb);
@@ -4298,8 +4371,7 @@
 		recordUndo() {
 			const current = this._serialize();
 			const { html: tokenized } = this._tokenizeImages(current);
-			const prev = this.stack[this.stackOffset];
-			if (prev && prev.html === tokenized) return;
+			if (this.stack[this.stackOffset]?.html === tokenized) return;
 			this._savePoint();
 		}
 		/**
@@ -4345,8 +4417,7 @@
 	* Build an HTML table with the given number of columns and rows, optionally including a header row.
 	* @param {number} cols - Number of columns in each row.
 	* @param {number} rows - Total number of rows to create (including header when `headerRow` is true).
-	* @param {{ headerRow?: boolean }} [opts] - Options object.
-	* @param {boolean} [opts.headerRow=false] - When true and `rows > 0`, creates a header row (`<thead>`) plus body rows for the remainder.
+	* @param {{ headerRow?: boolean }} [opts] - Options: `headerRow` creates a `<thead>` when true.
 	* @returns {HTMLTableElement} The constructed `<table>` element with a `<tbody>` and optional `<thead>`; each cell contains a `<br>` placeholder.
 	*/
 	function createTable(cols, rows, opts = {}) {
@@ -4380,12 +4451,11 @@
 	* @param {number} cols - Number of columns for the new table.
 	* @param {number} rows - Number of rows for the new table.
 	* @param {{ headerRow?: boolean }} [opts] - Options for table creation.
-	* @param {boolean} [opts.headerRow=false] - If true, include a header row as the first row.
 	*/
 	function insertTable(cols, rows, opts = {}) {
 		if (cols <= 0 || rows <= 0) return;
 		const table = createTable(cols, rows, opts);
-		const sel = window.getSelection();
+		const sel = globalThis.getSelection();
 		if (!sel || sel.rangeCount === 0) return;
 		const range = sel.getRangeAt(0);
 		range.deleteContents();
@@ -4403,7 +4473,7 @@
 			"PRE"
 		]);
 		let anchor = range.startContainer;
-		if (anchor.nodeType === 3) anchor = anchor.parentElement;
+		if (anchor?.nodeType === 3) anchor = anchor.parentElement;
 		while (anchor && !BLOCK.has(anchor.tagName?.toUpperCase()) && anchor.parentElement) anchor = anchor.parentElement;
 		if (anchor && BLOCK.has(anchor.tagName?.toUpperCase()) && anchor.parentNode) {
 			anchor.after(table);
@@ -4493,8 +4563,8 @@
 	* Inspired by Summernote's Typing module
 	*/
 	var _FA_PATTERN = /\bfa-/;
-	var isFAIcon = (n) => !!(n && n.nodeName === "I" && _FA_PATTERN.test(n.className || ""));
-	var isZwsAnchor = (n) => !!(n && n.nodeType === Node.TEXT_NODE && (n.textContent === "​" || n.textContent === ""));
+	var isFAIcon = (n) => !!(n?.nodeName === "I" && _FA_PATTERN.test(n.className || ""));
+	var isZwsAnchor = (n) => !!(n?.nodeType === Node.TEXT_NODE && (n.textContent === "​" || n.textContent === ""));
 	/**
 	* Handles special keydown behaviour inside the editor.
 	* @param {KeyboardEvent} event
@@ -4504,7 +4574,7 @@
 	*/
 	function handleKeydown(event, editable, options = {}) {
 		const moveCaret = (setFn) => {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel) return false;
 			const nr = document.createRange();
 			setFn(nr);
@@ -4514,14 +4584,14 @@
 			return true;
 		};
 		if (isKey(event, key.BACKSPACE)) {
-			const sel = window.getSelection();
-			if (sel && sel.rangeCount > 0) {
+			const sel = globalThis.getSelection();
+			if (sel?.rangeCount > 0) {
 				const r = sel.getRangeAt(0);
 				if (r.collapsed && r.startContainer.nodeType === Node.TEXT_NODE) {
 					const textNode = r.startContainer;
 					if (r.startOffset === 0 && isFAIcon(textNode.previousSibling)) {
 						event.preventDefault();
-						textNode.previousSibling.remove();
+						/** @type {ChildNode} */ textNode.previousSibling.remove();
 						return true;
 					}
 					if (r.startOffset === 1 && textNode.textContent === "​" && isFAIcon(textNode.previousSibling)) {
@@ -4545,7 +4615,7 @@
 			return false;
 		}
 		if (isKey(event, key.LEFT) || isKey(event, key.RIGHT)) {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || sel.rangeCount === 0) return false;
 			const r = sel.getRangeAt(0);
 			if (!r.collapsed) return false;
@@ -4633,7 +4703,7 @@
 				else execCommand("indent");
 				return true;
 			}
-			if (para && para.nodeName.toUpperCase() === "PRE") {
+			if (para?.nodeName.toUpperCase() === "PRE") {
 				if (event.shiftKey) return false;
 				event.preventDefault();
 				execCommand("insertText", " ".repeat(options.tabSize || 4));
@@ -4656,18 +4726,18 @@
 			if (!range) return false;
 			const sc = range.sc;
 			const el = sc.nodeType === 3 ? sc.parentElement : sc;
-			if (el && el.nodeName === "I" && /\bfa-/.test(el.className || "")) {
+			if (el?.nodeName === "I" && /\bfa-/.test(el.className || "")) {
 				const nr = document.createRange();
 				nr.setStartAfter(el);
 				nr.collapse(true);
-				const selI = window.getSelection();
+				const selI = globalThis.getSelection();
 				if (selI) {
 					selI.removeAllRanges();
 					selI.addRange(nr);
 				}
 				return false;
 			}
-			const videoWrapper = el && el.closest && el.closest(".an-video-wrapper");
+			const videoWrapper = el?.closest(".an-video-wrapper");
 			if (videoWrapper) {
 				event.preventDefault();
 				const p = document.createElement("p");
@@ -4676,16 +4746,16 @@
 				const nr = document.createRange();
 				nr.setStart(p, 0);
 				nr.collapse(true);
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				sel.removeAllRanges();
 				sel.addRange(nr);
 				return true;
 			}
-			const checkLi = el && el.closest && el.closest(".an-checklist li");
+			const checkLi = el?.closest(".an-checklist li");
 			if (checkLi) {
 				event.preventDefault();
 				const ul = checkLi.closest(".an-checklist");
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				let nativeRange = sel.getRangeAt(0);
 				const liText = (li) => Array.from(li.childNodes).filter((n) => !(n.nodeType === 1 && n.tagName === "INPUT")).map((n) => n.textContent).join("").replace(/[\u00a0\u200B]/g, " ").trim();
 				if (!liText(checkLi)) {
@@ -4729,12 +4799,12 @@
 				return true;
 			}
 			const para = closestPara(range.sc, editable);
-			if (para && para.nodeName.toUpperCase() === "PRE") {
+			if (para?.nodeName.toUpperCase() === "PRE") {
 				event.preventDefault();
 				execCommand("insertText", "\n");
 				return true;
 			}
-			if (para && para.nodeName.toUpperCase() === "BLOCKQUOTE") {
+			if (para?.nodeName.toUpperCase() === "BLOCKQUOTE") {
 				const native = range.toNativeRange();
 				native.setEnd(para, para.childNodes.length);
 				if (native.toString() === "" && range.isCollapsed()) {
@@ -4781,8 +4851,9 @@
 	function _domToMd(node, depth = 0) {
 		if (node.nodeType === 3) return node.textContent.replace(/\s+/g, " ");
 		if (node.nodeType !== 1) return "";
-		const tag = node.nodeName.toLowerCase();
-		const inner = () => Array.from(node.childNodes).map((n) => _domToMd(n, depth)).join("");
+		const el = node;
+		const tag = el.nodeName.toLowerCase();
+		const inner = () => Array.from(el.childNodes).map((n) => _domToMd(n, depth)).join("");
 		switch (tag) {
 			case "p":
 			case "div": return `\n\n${inner()}\n\n`;
@@ -4800,34 +4871,34 @@
 			case "del":
 			case "s":
 			case "strike": return `~~${inner()}~~`;
-			case "sup": return `^${inner()}`;
-			case "sub": return `~${inner()}`;
+			case "sup": return `^${inner()}^`;
+			case "sub": return `~${inner()}~`;
 			case "code":
-				if (node.closest("pre")) return inner();
+				if (el.closest("pre")) return inner();
 				return `\`${inner()}\``;
 			case "pre": {
-				const codeEl = node.querySelector("code");
-				const langMatch = (codeEl && codeEl.className || "").match(/language-(\S+)/);
-				return `\n\n\`\`\`${langMatch ? langMatch[1] : ""}\n${(codeEl || node).textContent || ""}\n\`\`\`\n\n`;
+				const codeEl = el.querySelector("code");
+				const langMatch = /language-(\S+)/.exec(codeEl && codeEl.className || "");
+				return `\n\n\`\`\`${langMatch ? langMatch[1] : ""}\n${(codeEl || el).textContent || ""}\n\`\`\`\n\n`;
 			}
 			case "blockquote": return `\n\n${inner().trim().split("\n").map((l) => `> ${l}`).join("\n")}\n\n`;
 			case "a": {
-				const href = node.getAttribute("href") || "";
+				const href = el.getAttribute("href") || "";
 				return `[${inner()}](${href})`;
 			}
 			case "img": {
-				const src = node.getAttribute("src") || "";
-				return `![${node.getAttribute("alt") || ""}](${src})`;
+				const src = el.getAttribute("src") || "";
+				return `![${el.getAttribute("alt") || ""}](${src})`;
 			}
 			case "ul": {
-				const items = Array.from(node.querySelectorAll(":scope > li"));
+				const items = Array.from(el.querySelectorAll(":scope > li"));
 				if (!items.length) return inner();
 				const indent = "  ".repeat(depth);
 				const lines = items.map((li) => `${indent}- ${_domToMd(li, depth + 1).trim()}`).join("\n");
 				return depth === 0 ? `\n\n${lines}\n\n` : `\n${lines}`;
 			}
 			case "ol": {
-				const items = Array.from(node.querySelectorAll(":scope > li"));
+				const items = Array.from(el.querySelectorAll(":scope > li"));
 				if (!items.length) return inner();
 				const indent = "  ".repeat(depth);
 				const lines = items.map((li, i) => `${indent}${i + 1}. ${_domToMd(li, depth + 1).trim()}`).join("\n");
@@ -4836,9 +4907,9 @@
 			case "li": return inner();
 			case "hr": return "\n\n---\n\n";
 			case "table": {
-				const rows = Array.from(node.querySelectorAll("tr"));
+				const rows = Array.from(el.querySelectorAll("tr"));
 				if (!rows.length) return inner();
-				const cellTexts = rows.map((tr) => Array.from(tr.querySelectorAll("th, td")).map((c) => c.textContent.trim().replace(/\|/g, "\\|")));
+				const cellTexts = rows.map((tr) => Array.from(tr.querySelectorAll("th, td")).map((c) => c.textContent.trim().replaceAll("|", "\\|")));
 				const cols = Math.max(...cellTexts.map((r) => r.length));
 				const padRow = (row) => {
 					const r = [...row];
@@ -4847,7 +4918,7 @@
 				};
 				let md = "\n\n";
 				md += `| ${padRow(cellTexts[0]).join(" | ")} |\n`;
-				md += `| ${Array(cols).fill("---").join(" | ")} |\n`;
+				md += `| ${new Array(cols).fill("---").join(" | ")} |\n`;
 				for (let r = 1; r < cellTexts.length; r++) md += `| ${padRow(cellTexts[r]).join(" | ")} |\n`;
 				return md + "\n";
 			}
@@ -4871,12 +4942,12 @@
 	* @returns {string}
 	*/
 	function markdownToHTML(text) {
-		const lines = text.replace(/\r\n/g, "\n").replace(/\r/g, "\n").split("\n");
+		const lines = text.replaceAll("\r\n", "\n").replaceAll("\r", "\n").split("\n");
 		const out = [];
 		let i = 0;
 		while (i < lines.length) {
 			const line = lines[i];
-			const fenceMatch = line.match(/^```(\S*)$/);
+			const fenceMatch = /^```(\S*)$/.exec(line);
 			if (fenceMatch) {
 				const lang = fenceMatch[1];
 				const codeLines = [];
@@ -4895,7 +4966,7 @@
 				i++;
 				continue;
 			}
-			const hMatch = line.match(/^(#{1,6})\s+(.+)$/);
+			const hMatch = /^(#{1,6})\s+(.+)$/.exec(line);
 			if (hMatch) {
 				const level = hMatch[1].length;
 				out.push(`<h${level}>${_inline(hMatch[2])}</h${level}>`);
@@ -4942,7 +5013,8 @@
 					i++;
 				}
 				const thead = `<thead><tr>${headerCells.map((c) => `<th>${_inline(c)}</th>`).join("")}</tr></thead>`;
-				const tbody = bodyRows.length ? `<tbody>${bodyRows.map((row) => `<tr>${row.map((c) => `<td>${_inline(c)}</td>`).join("")}</tr>`).join("")}</tbody>` : "";
+				const renderRow = (row) => `<tr>${row.map((c) => `<td>${_inline(c)}</td>`).join("")}</tr>`;
+				const tbody = bodyRows.length ? `<tbody>${bodyRows.map(renderRow).join("")}</tbody>` : "";
 				out.push(`<table>${thead}${tbody}</table>`);
 				continue;
 			}
@@ -4978,10 +5050,51 @@
 		return text;
 	}
 	function _esc(v) {
-		return String(v).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+		return String(v).replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
 	}
 	function _escAttr(v) {
-		return String(v).replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/'/g, "&#39;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+		return String(v).replaceAll("&", "&amp;").replaceAll("\"", "&quot;").replaceAll("'", "&#39;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
+	}
+	//#endregion
+	//#region src/js/core/detectLang.js
+	/**
+	* detectLang.js — Heuristic programming-language detection for code snippets.
+	*
+	* Returns a Prism.js language identifier or null when no language can be
+	* determined with reasonable confidence.
+	*
+	* Detection order (conflicts in parentheses):
+	*   TypeScript → Rust → PHP → Java → Kotlin → Swift → Go
+	*   → JavaScript → HTML → CSS → JSON → SQL → Python → Ruby
+	*   → Bash → C++ → C# → C → XML
+	*
+	* @param {string} code
+	* @returns {string|null}
+	*/
+	function detectLang(code) {
+		if (!code || !code.trim()) return null;
+		const s = code.trim();
+		if (/(:\s*(string|number|boolean|void|never|any|unknown)\b|interface\s+\w+\s*\{|type\s+\w+\s*[=<(]|<\w+>\s*[;,)]|readonly\s+\w|enum\s+\w+\s*\{|\?\s*:\s*\w|as\s+\w+\s*[;,)\]])/.test(s)) return "typescript";
+		if (/\bprintln!\s*\(|\bprint!\s*\(|\bfn\s+\w+\s*(<[^>]*>)?\s*\(|\blet\s+mut\s|\bpub\s+fn\s|\buse\s+std::|\bimpl\s+\w+|\bOption<|\bResult<\w+/.test(s)) return "rust";
+		if (/(<\?php\b|<\?=|\becho\s+.*\$\w|\$this->|\$\w+\s*=\s*\w|\bforeach\s*\(\s*\$|Illuminate\\)/.test(s)) return "php";
+		if (/\bpublic\s+(class|static|void|int|String)\s+\w|System\.out\.(print|println)\s*\(|@(Override|Autowired|Component|Service|Controller)\b|import\s+java\.(util|io|lang|net)\.|throws\s+\w+Exception/.test(s)) return "java";
+		if (/\bfun\s+\w+\s*\(|\bdata\s+class\s+\w+|\bcompanion\s+object\b|\bval\s+\w+\s*:\s*\w|\bprintln\s*\(/.test(s)) return "kotlin";
+		if (/\bguard\s+(let|var)\b|\bprotocol\s+\w+\s*\{|\bextension\s+\w+|\bfunc\s+\w+[^(]*\([^)]*\)\s*->\s*\w|\blet\s+\w+\s*:\s*[A-Z]\w*|\bSwiftUI\b/.test(s)) return "swift";
+		if (/\bpackage\s+\w+\b|\bfmt\.(Print|Println|Sprintf|Errorf|Fprintf)\s*\(|:=\s*\w|\bgoroutine\b|\bchan\s+\w|\bgo\s+func\b/.test(s)) return "go";
+		if (/\b(const\s+\w|let\s+\w+\s*=|var\s+\w+\s*=|function\s+\w|\=>\s*[{(]|import\s+.*\bfrom\b\s*['"]|require\s*\(|console\.(log|error|warn|info)|document\.\w|window\.\w|async\s+function|\bPromise\b|React\.|useState\s*\(|\.then\s*\()/.test(s)) return "javascript";
+		if (/^<!DOCTYPE html/i.test(s) || /<(html|head|body|div|section|article|nav|p|a|img|ul|ol|li|table|form|input|button|script|style)\b[^>]*>/i.test(s)) return "html";
+		if (/(^|\n)\s*(\/\/\s+\S|&[:.[\w]|\$\w+\s*:|@(mixin|include|extend|each|if|for|use|forward)\b|#\{)/.test(s) && /[\w#.*&[\]:(),>+~ -]+\s*\{/.test(s)) return "scss";
+		if (/(^|\n)\s*[\w#.*:[\]&, +-]+\s*\{[^}]*[\w-]+\s*:[^{}:;]+[;}\n]/m.test(s) && !/<\w|function\s|def\s|:\s*(string|number)/.test(s)) return "css";
+		if (/^\s*[{[]/.test(s) && /"\w[\w\s-]*"\s*:/.test(s) && !/\bfunction\b|\bdef\b/.test(s)) return "json";
+		if (/(^|\n)\s*(SELECT\s|INSERT\s+INTO|UPDATE\s+\w|DELETE\s+FROM|CREATE\s+(TABLE|DATABASE|INDEX|VIEW)|DROP\s+(TABLE|DATABASE)|ALTER\s+TABLE|WITH\s+\w+\s+AS\s*\()/im.test(s)) return "sql";
+		if (/\bdef\s+\w+\s*\([^)]*\)\s*:|(^|\n)\s*class\s+\w+.*:\s*$|(^|\n)\s*import\s+\w|(^|\n)\s*from\s+\w+\s+import\s+|\bprint\s*\(|if\s+__name__\s*==\s*['"]__main__['"]/m.test(s)) return "python";
+		if (/\bputs\s+\S|\battr_(accessor|reader|writer)\s|\.each\s+do\s*\|\w+\s*\||\bdo\s*\|\w+\s*\|.*\bend\b|\bdef\s+\w+[^:]*\n[\s\S]*?\bend\b/.test(s)) return "ruby";
+		if (/^#!.*\/(ba|z|da|fi|k)?sh\b/m.test(s) || /\b(echo\s+["']|grep\s+|awk\s+|sed\s+['"\\/-]|chmod\s+|sudo\s+|apt(-get)?\s+install|brew\s+install|npm\s+(install|run|start|build)|pip\s+(install|3\s)|docker\s+(run|build|compose)|kubectl\s+|git\s+(clone|add|commit|push|pull|checkout))\b/.test(s)) return "bash";
+		if (/\bcout\s*<<|\bcin\s*>>|using\s+namespace\s+std\b|std::\w|\btemplate\s*<\w|\b#include\s*<(iostream|vector|map|set|algorithm|string|memory)>/.test(s)) return "cpp";
+		if (/\busing\s+System\b|Console\.(Write|WriteLine)\s*\(|\bget;\s*set;|\basync\s+Task[<\s]|IEnumerable<|\bLINQ\b|\.Select\s*\(|\.Where\s*\(/.test(s)) return "csharp";
+		if (/\b#include\s*<(stdio|stdlib|string|math|time|ctype)\.h>|\bprintf\s*\(|\bscanf\s*\(|int\s+main\s*\(\s*(void|int\s+argc)|\bmalloc\s*\(|\bfree\s*\(/.test(s) && !/namespace|cout|cin|std::/.test(s)) return "c";
+		if (/^<\?xml\s/i.test(s) || /xmlns:|<\/[\w:]+>/.test(s)) return "xml";
+		return null;
 	}
 	//#endregion
 	//#region src/js/module/Editor.js
@@ -5022,7 +5135,7 @@
 			const onBeforeInput = (event) => this._enforceLimit(event);
 			const onSelChange = () => {
 				if (!this.context._alive) return;
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (sel && sel.rangeCount > 0 && editable.contains(sel.anchorNode)) {
 					this.context.invoke("toolbar.refresh");
 					if (typeof this.options.onSelectionChange === "function") this.options.onSelectionChange(this.context);
@@ -5032,13 +5145,14 @@
 				if (e.target.type === "checkbox" && e.target.closest(".an-checklist")) this.afterCommand();
 			};
 			const fixChecklistCursor = (event) => {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || !sel.rangeCount) return;
 				const r = sel.getRangeAt(0);
 				if (!r.collapsed) return;
 				const sc = r.startContainer;
 				if (sc.nodeType !== Node.ELEMENT_NODE) return;
-				const li = sc.matches && sc.matches(".an-checklist li") ? sc : null;
+				const scEl = sc;
+				const li = scEl.matches(".an-checklist li") ? scEl : null;
 				if (!li) return;
 				const cb = li.querySelector("input[type=\"checkbox\"]");
 				if (!cb) return;
@@ -5078,33 +5192,37 @@
 					return;
 				}
 				const target = e.target;
-				if (target && (target.nodeName === "IFRAME" || target.closest && target.closest(".an-video-wrapper"))) e.preventDefault();
+				if (target && (target.nodeName === "IFRAME" || target.closest(".an-video-wrapper"))) e.preventDefault();
 			}), on(editable, "drop", (e) => {
 				if (isReadOnly()) e.preventDefault();
 			}));
 			/** @type {string|null} 'superscript' | 'subscript' | null */
 			let _compositionSupSub = null;
 			const onCompositionStart = () => {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || !sel.rangeCount) {
 					_compositionSupSub = null;
 					return;
 				}
 				let node = sel.getRangeAt(0).startContainer;
 				if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
-				if (node && node.closest) if (node.closest("sup")) _compositionSupSub = "superscript";
-				else if (node.closest("sub")) _compositionSupSub = "subscript";
-				else _compositionSupSub = null;
+				if (node) {
+					const el = node;
+					if (el.closest("sup")) _compositionSupSub = "superscript";
+					else if (el.closest("sub")) _compositionSupSub = "subscript";
+					else _compositionSupSub = null;
+				}
 			};
 			const onCompositionEnd = () => {
 				const tag = _compositionSupSub;
 				_compositionSupSub = null;
 				if (!tag) return;
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || !sel.rangeCount) return;
 				let node = sel.getRangeAt(0).startContainer;
 				if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
-				if (!(node && node.closest && (tag === "superscript" ? node.closest("sup") : node.closest("sub")))) document.execCommand(tag);
+				const el = node;
+				if (!(tag === "superscript" ? el?.closest("sup") : el?.closest("sub"))) document.execCommand(tag);
 			};
 			this._disposers.push(on(editable, "compositionstart", onCompositionStart), on(editable, "compositionend", onCompositionEnd));
 		}
@@ -5178,7 +5296,7 @@
 			if (type === "insertFromPaste" || type === "insertFromDrop") return;
 			if (!type.startsWith("insert")) return;
 			const text = this.context.layoutInfo.editable.innerText || "";
-			const chars = text.replace(/\n/g, "").length;
+			const chars = text.replaceAll("\n", "").length;
 			if (maxChars && chars >= maxChars) {
 				event.preventDefault();
 				if (typeof this.options.onCharLimitReached === "function") this.options.onCharLimitReached(this.context);
@@ -5193,6 +5311,7 @@
 		}
 		afterCommand() {
 			this._cleanOrphanedFigures();
+			this._ensureTrailingParagraph();
 			this.context.invoke("toolbar.refresh");
 			this.context.invoke("statusbar.update");
 			this._scheduleSnapshot();
@@ -5216,9 +5335,34 @@
 		*/
 		_cleanOrphanedFigures() {
 			this.context.layoutInfo.editable.querySelectorAll("figure.an-figure").forEach((fig) => {
-				if (!fig.querySelector("img")) fig.parentNode.removeChild(fig);
+				if (!fig.querySelector("img")) fig.remove();
 			});
 		}
+		/**
+		* Ensures the editable always ends with a plain paragraph so the cursor can
+		* be placed after block elements that do not naturally allow it
+		* (pre, blockquote, table, figure, ul, ol, hr).
+		* Without this, clicking below the last such element does nothing.
+		*/
+		_ensureTrailingParagraph() {
+			const editable = this.context.layoutInfo.editable;
+			if (!editable) return;
+			const last = editable.lastElementChild;
+			if (!last) return;
+			if (new Set([
+				"PRE",
+				"BLOCKQUOTE",
+				"TABLE",
+				"FIGURE",
+				"UL",
+				"OL",
+				"HR"
+			]).has(last.nodeName)) {
+				const p = document.createElement("p");
+				p.innerHTML = "<br>";
+				editable.appendChild(p);
+			}
+		}
 		focus() {
 			this.context.layoutInfo.editable.focus();
 		}
@@ -5227,7 +5371,7 @@
 		* @returns {string}
 		*/
 		getHTML() {
-			const raw = this.context.layoutInfo.editable.innerHTML.replace(/\u200B/g, "");
+			const raw = this.context.layoutInfo.editable.innerHTML.replaceAll("​", "");
 			return this.context.invoke("clipboard.resolveImages", raw) ?? raw;
 		}
 		/**
@@ -5272,7 +5416,7 @@
 		* @returns {boolean}
 		*/
 		isEmpty() {
-			const text = (this.context.layoutInfo.editable.innerText || "").trim().replace(/\u00a0/g, "");
+			const text = (this.context.layoutInfo.editable.innerText || "").trim().replaceAll("\xA0", "");
 			const hasMedia = !!this.context.layoutInfo.editable.querySelector("img, video, iframe, table");
 			return !text && !hasMedia;
 		}
@@ -5402,10 +5546,24 @@
 			this.context.print();
 		}
 		/**
-		* @param {string} tagName - e.g. 'h1', 'p', 'blockquote'
+		* @param {string} tagName - e.g. 'h1', 'p', 'blockquote', 'pre'
 		*/
 		formatBlock(tagName) {
 			formatBlock(tagName);
+			if (tagName === "pre") {
+				const sel = globalThis.getSelection();
+				if (sel && sel.rangeCount > 0) {
+					const container = sel.getRangeAt(0).commonAncestorContainer;
+					const pre = container.nodeType === 1 ? container.closest("pre") : container.parentElement?.closest("pre");
+					if (pre && !pre.dataset.language) {
+						const lang = detectLang(pre.textContent || "");
+						if (lang) {
+							this.context.invoke("codeTooltip.applyLanguage", pre, lang);
+							return;
+						}
+					}
+				}
+			}
 			this.afterCommand();
 		}
 		/**
@@ -5450,7 +5608,7 @@
 		* @param {boolean} [openInNewTab=false]
 		*/
 		insertLink(url, text, openInNewTab = false) {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || sel.rangeCount === 0) return;
 			const safeUrl = sanitiseUrl(url);
 			if (!safeUrl) return;
@@ -5462,8 +5620,8 @@
 				if (openInNewTab) {
 					const link = this._getClosestAnchor();
 					if (link) {
-						link.setAttribute("target", "_blank");
-						link.setAttribute("rel", "noopener noreferrer");
+						/** @type {Element} */ link.setAttribute("target", "_blank");
+						/** @type {Element} */ link.setAttribute("rel", "noopener noreferrer");
 					}
 				}
 			}
@@ -5513,7 +5671,7 @@
 			this.afterCommand();
 		}
 		_getClosestAnchor() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || sel.rangeCount === 0) return null;
 			let node = sel.getRangeAt(0).startContainer;
 			while (node) {
@@ -5528,7 +5686,7 @@
 		* @returns {string}
 		*/
 		_escapeAttr(str) {
-			return String(str ?? "").replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+			return String(str ?? "").replaceAll("&", "&amp;").replaceAll("\"", "&quot;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
 		}
 	};
 	//#endregion
@@ -5643,7 +5801,7 @@
 			this._refreshRaf = null;
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this.el && this.el.parentNode) this.el.parentNode.removeChild(this.el);
+			if (this.el && this.el.parentNode) this.el.remove();
 			this.el = null;
 		}
 		_buildButtons() {
@@ -5711,8 +5869,8 @@
 			let isOpen = false;
 			const setHighlight = (rows, cols) => {
 				cells.forEach((cell) => {
-					const r = +cell.getAttribute("data-row");
-					const c = +cell.getAttribute("data-col");
+					const r = +cell.dataset.row;
+					const c = +cell.dataset.col;
 					cell.classList.toggle("active", r <= rows && c <= cols);
 				});
 				label.textContent = rows && cols ? `${rows} × ${cols}` : this.context.locale.toolbar.insertTableLabel || "Insert Table";
@@ -5726,8 +5884,8 @@
 				const ph = popup.offsetHeight;
 				let left = rect.left;
 				let top = rect.bottom + 4;
-				if (left + pw > window.innerWidth - 8) left = Math.max(8, window.innerWidth - pw - 8);
-				if (top + ph > window.innerHeight - 8) top = rect.top - ph - 4;
+				if (left + pw > globalThis.innerWidth - 8) left = Math.max(8, globalThis.innerWidth - pw - 8);
+				if (top + ph > globalThis.innerHeight - 8) top = rect.top - ph - 4;
 				popup.style.left = `${left}px`;
 				popup.style.top = `${top}px`;
 				popup.style.visibility = "";
@@ -5745,16 +5903,16 @@
 				else openPopup();
 			});
 			const d2 = on(grid, "mouseover", (e) => {
-				const cell = e.target.closest(".an-table-cell");
+				const cell = e.target?.closest(".an-table-cell");
 				if (!cell) return;
-				setHighlight(+cell.getAttribute("data-row"), +cell.getAttribute("data-col"));
+				setHighlight(+cell.dataset.row, +cell.dataset.col);
 			});
 			const d3 = on(grid, "mouseleave", () => setHighlight(0, 0));
 			const d4 = on(grid, "click", (e) => {
-				const cell = e.target.closest(".an-table-cell");
+				const cell = e.target?.closest(".an-table-cell");
 				if (!cell) return;
-				const rows = +cell.getAttribute("data-row");
-				const cols = +cell.getAttribute("data-col");
+				const rows = +cell.dataset.row;
+				const cols = +cell.dataset.col;
 				closePopup();
 				this.context.invoke("editor.focus");
 				def.action(this.context, rows, cols);
@@ -5763,7 +5921,7 @@
 				if (isOpen) closePopup();
 			});
 			this._disposers.push(d1, d2, d3, d4, d5, () => {
-				if (popup.parentNode) popup.parentNode.removeChild(popup);
+				if (popup.parentNode) popup.remove();
 			});
 			wrap.appendChild(btn);
 			document.body.appendChild(popup);
@@ -5853,13 +6011,13 @@
 			/** @type {Range|null} saved selection range before popup opens */
 			let savedRange = null;
 			const saveSelection = () => {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				savedRange = sel && sel.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
 			};
 			const restoreSelection = () => {
 				if (!savedRange) return;
 				try {
-					const sel = window.getSelection();
+					const sel = globalThis.getSelection();
 					if (!sel) return;
 					sel.removeAllRanges();
 					sel.addRange(savedRange);
@@ -5874,7 +6032,7 @@
 				const rect = arrowBtn.getBoundingClientRect();
 				const popupMinW = 184;
 				let left = rect.left;
-				if (left + popupMinW > window.innerWidth) left = rect.right - popupMinW;
+				if (left + popupMinW > globalThis.innerWidth) left = rect.right - popupMinW;
 				popup.style.top = `${rect.bottom + 4}px`;
 				popup.style.left = `${Math.max(4, left)}px`;
 				popup.style.display = "block";
@@ -5914,11 +6072,17 @@
 				e.preventDefault();
 			});
 			const d3b = on(swatches, "click", (e) => {
-				const sw = e.target.closest(".an-color-swatch");
-				if (sw) applyColor(sw.dataset.color);
+				const sw = e.target?.closest(".an-color-swatch");
+				if (sw) applyColor(
+					/** @type {HTMLElement} */
+					sw.dataset.color
+				);
 			});
 			const d4 = on(colorInput, "change", (e) => {
-				applyColor(e.target.value);
+				applyColor(
+					/** @type {HTMLInputElement} */
+					e.target.value
+				);
 			});
 			const d5 = on(document, "click", (e) => {
 				if (isOpen && !wrap.contains(e.target) && !popup.contains(e.target)) closePopup();
@@ -5931,9 +6095,9 @@
 				passive: true,
 				capture: true
 			});
-			window.addEventListener("resize", onScrollResize, { passive: true });
-			this._disposers.push(d1, d2, d2b, d3, d3b, d4, d5, d6, () => document.removeEventListener("scroll", onScrollResize, { capture: true }), () => window.removeEventListener("resize", onScrollResize), () => {
-				if (popup.parentNode) popup.parentNode.removeChild(popup);
+			globalThis.addEventListener("resize", onScrollResize, { passive: true });
+			this._disposers.push(d1, d2, d2b, d3, d3b, d4, d5, d6, () => document.removeEventListener("scroll", onScrollResize, { capture: true }), () => globalThis.removeEventListener("resize", onScrollResize), () => {
+				if (popup.parentNode) popup.remove();
 			});
 			this._colorPickerClosers.push(closePopup);
 			this._disposers.push(() => {
@@ -5977,7 +6141,7 @@
 			/** @type {Range|null} */
 			let _savedRange = null;
 			const dMousedown = on(select, "mousedown", () => {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				_savedRange = sel && sel.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
 			});
 			const disposer = on(select, "change", (e) => {
@@ -5986,7 +6150,7 @@
 				if (!value || selectedOpt.disabled) return;
 				this.context.invoke("editor.focus");
 				if (_savedRange) try {
-					const sel = window.getSelection();
+					const sel = globalThis.getSelection();
 					if (sel) {
 						sel.removeAllRanges();
 						sel.addRange(_savedRange);
@@ -6051,17 +6215,25 @@
 			if (!this.el) return;
 			const btnMap = this._btnMap || /* @__PURE__ */ new Map();
 			this.el.querySelectorAll("button[data-btn]").forEach((btn) => {
-				const def = btnMap.get(btn.getAttribute("data-btn"));
+				const def = btnMap.get(
+					/** @type {HTMLElement} */
+					btn.dataset.btn
+				);
 				if (def && typeof def.isActive === "function") btn.classList.toggle("active", !!def.isActive(this.context));
-				if (def && typeof def.isDisabled === "function") btn.disabled = !!def.isDisabled(this.context);
+				if (def && typeof def.isDisabled === "function")
+ /** @type {HTMLButtonElement} */ btn.disabled = !!def.isDisabled(this.context);
 			});
 			this.el.querySelectorAll("select[data-btn]").forEach((select) => {
-				const def = btnMap.get(select.getAttribute("data-btn"));
+				const def = btnMap.get(
+					/** @type {HTMLElement} */
+					select.dataset.btn
+				);
 				if (!def || typeof def.getValue !== "function") return;
 				let raw = (def.getValue(this.context) || "").replace(/["']/g, "").trim();
 				if (!raw) raw = this.options.defaultFontFamily || this.options.fontFamilies && this.options.fontFamilies[0] || "";
-				const matched = Array.from(select.options).find((opt) => opt.value && opt.value.toLowerCase() === raw.toLowerCase());
-				select.value = matched ? matched.value : "";
+				const sel = select;
+				const matched = Array.from(sel.options).find((opt) => opt.value && opt.value.toLowerCase() === raw.toLowerCase());
+				sel.value = matched ? matched.value : "";
 			});
 		}
 		/**
@@ -6181,7 +6353,7 @@
 				this._dragDisposers.forEach((d) => d());
 				this._dragDisposers = null;
 			}
-			if (this.el && this.el.parentNode) this.el.parentNode.removeChild(this.el);
+			this.el?.remove();
 			this.el = null;
 		}
 		_bindResize(handle) {
@@ -6245,7 +6417,7 @@
 			if (!this._wordCountEl || !this._charCountEl) return;
 			const text = this.context.layoutInfo.editable.textContent || "";
 			const words = _countWords(text);
-			const chars = text.replace(/\n/g, "").length;
+			const chars = text.replaceAll("\n", "").length;
 			const maxWords = this.options.maxWords || 0;
 			const maxChars = this.options.maxChars || 0;
 			const LS = this.context.locale.statusbar;
@@ -6267,7 +6439,7 @@
 		* @returns {number}
 		*/
 		getCharCount() {
-			return (this.context.layoutInfo.editable.innerText || "").replace(/\n/g, "").length;
+			return (this.context.layoutInfo.editable.innerText || "").replaceAll("\n", "").length;
 		}
 	};
 	//#endregion
@@ -6360,7 +6532,7 @@
 				if (el.querySelector("a, strong, em, b, i, ul, ol, li, table, img, blockquote, pre, code, h1, h2, h3, h4, h5, h6")) continue;
 				const parent = el.parentNode;
 				while (el.firstChild) parent.insertBefore(el.firstChild, el);
-				parent.removeChild(el);
+				el.remove();
 			}
 			doc.querySelectorAll("*").forEach((el) => {
 				el.removeAttribute("class");
@@ -6402,7 +6574,7 @@
 			this._forcePlain = !!val;
 		}
 		_onPaste(event) {
-			const clipboardData = event.clipboardData || window.clipboardData;
+			const clipboardData = event.clipboardData || globalThis.clipboardData;
 			if (!clipboardData) return;
 			const forcePlain = this._forcePlain;
 			this._forcePlain = false;
@@ -6446,7 +6618,6 @@
 				if (this.options.pasteStripAttributes) html = this._stripAttributes(html);
 				execCommand("insertHTML", html);
 				this.context.invoke("editor.afterCommand");
-				return;
 			}
 		}
 		_onDragover(event) {
@@ -6478,17 +6649,17 @@
 				this.options.onImageUpload(files);
 				return;
 			}
-			const UNSUPPORTED = [
+			const UNSUPPORTED = new Set([
 				"image/tiff",
 				"image/x-tiff",
 				"image/bmp",
 				"image/x-bmp",
 				"image/x-ms-bmp"
-			];
+			]);
 			const maxBytes = (this.options.maxImageSize || 5) * 1024 * 1024;
 			files.forEach((file) => {
 				if (!file || !file.type.startsWith("image/")) return;
-				if (UNSUPPORTED.includes(file.type)) {
+				if (UNSUPPORTED.has(file.type)) {
 					const message = `Image format "${file.type}" is not supported for display in web browsers. Please convert to PNG, JPEG, or WebP first.`;
 					this.context.triggerEvent("imageError", {
 						file,
@@ -6540,10 +6711,10 @@
 		*/
 		_dataUrlToBlob(dataUrl) {
 			const [header, b64] = dataUrl.split(",");
-			const mime = header.match(/:(.*?);/)?.[1] ?? "image/png";
+			const mime = /:(.*?);/.exec(header)?.[1] ?? "image/png";
 			const binary = atob(b64);
 			const arr = new Uint8Array(binary.length);
-			for (let i = 0; i < binary.length; i++) arr[i] = binary.charCodeAt(i);
+			for (let i = 0; i < binary.length; i++) arr[i] = binary.codePointAt(i);
 			return new Blob([arr], { type: mime });
 		}
 		/**
@@ -6611,7 +6782,7 @@
 				}
 			}
 			if (!range) return;
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (sel) {
 				sel.removeAllRanges();
 				sel.addRange(range);
@@ -6623,7 +6794,7 @@
 		* @returns {string}
 		*/
 		_escapeHTML(str) {
-			return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+			return str.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll("\"", "&quot;").replaceAll("'", "&#039;");
 		}
 	};
 	//#endregion
@@ -6660,7 +6831,7 @@
 		_update() {
 			const editable = this.context.layoutInfo.editable;
 			const isFocused = document.activeElement === editable;
-			const isEmpty = !(editable.textContent.replace(/\u200B/g, "").trim().length > 0) && !editable.querySelector("img, table, hr, .an-video-wrapper");
+			const isEmpty = !(editable.textContent.replaceAll("​", "").trim().length > 0) && !editable.querySelector("img, table, hr, .an-video-wrapper");
 			editable.classList.toggle("an-placeholder", isEmpty && !isFocused);
 		}
 	};
@@ -6688,7 +6859,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._textarea && this._textarea.parentNode) this._textarea.parentNode.removeChild(this._textarea);
+			this._textarea?.remove();
 			this._textarea = null;
 		}
 		toggle() {
@@ -6719,7 +6890,7 @@
 			if (!this._active || !this._textarea) return;
 			const { editable } = this.context.layoutInfo;
 			editable.innerHTML = sanitiseHTML(this._textarea.value, { allowIframes: true });
-			this._textarea.parentNode.removeChild(this._textarea);
+			this._textarea.remove();
 			this._textarea = null;
 			editable.style.display = "";
 			this._active = false;
@@ -6743,7 +6914,7 @@
 			}).split("\n").map((line) => {
 				const stripped = line.trim();
 				if (!stripped) return "";
-				if (/^<\//.test(stripped)) indent = Math.max(0, indent - 1);
+				if (stripped.startsWith("</")) indent = Math.max(0, indent - 1);
 				const out = "  ".repeat(indent) + stripped;
 				if (/^<[^/!][^>]*[^/]>/.test(stripped) && !INLINE_RE.test(stripped) && !/^<(br|hr|img|input|link|meta)/.test(stripped)) indent++;
 				return out;
@@ -6832,7 +7003,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
 			this._dialog = null;
 		}
 		/**
@@ -6855,8 +7026,13 @@
 				"aria-label": L.ariaLabel
 			});
 			const box = createElement("div", { class: "an-dialog-box" });
+			const header = createElement("div", { class: "an-dialog-header" });
+			const iconEl = createElement("span", { class: "an-dialog-icon" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.title;
+			header.appendChild(iconEl);
+			header.appendChild(title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.url;
 			const urlInput = createElement("input", {
@@ -6901,8 +7077,9 @@
 			cancelBtn.textContent = L.cancelBtn;
 			btnRow.appendChild(insertBtn);
 			btnRow.appendChild(cancelBtn);
-			box.append(title, urlLabel, urlInput, textLabel, textInput, tabLabel, btnRow);
+			box.append(header, urlLabel, urlInput, textLabel, textInput, tabLabel, btnRow);
 			overlay.appendChild(box);
+			makeDraggable(header, box);
 			const d1 = on(insertBtn, "click", () => this._onInsert());
 			const d2 = on(cancelBtn, "click", () => this._close());
 			const d3 = on(overlay, "click", (e) => {
@@ -6924,7 +7101,7 @@
 			return overlay;
 		}
 		_prefill() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			let anchor = null;
 			if (sel && sel.rangeCount > 0) {
 				let node = sel.getRangeAt(0).startContainer;
@@ -7011,7 +7188,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
 			this._dialog = null;
 		}
 		show() {
@@ -7032,8 +7209,13 @@
 				"aria-label": L.ariaLabel
 			});
 			const box = createElement("div", { class: "an-dialog-box" });
+			const header = createElement("div", { class: "an-dialog-header" });
+			const iconEl = createElement("span", { class: "an-dialog-icon" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.title;
+			header.appendChild(iconEl);
+			header.appendChild(title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.imageUrl;
 			const urlInput = createElement("input", {
@@ -7052,7 +7234,7 @@
 				autocomplete: "off"
 			});
 			this._altInput = altInput;
-			box.append(title, urlLabel, urlInput, altLabel, altInput);
+			box.append(header, urlLabel, urlInput, altLabel, altInput);
 			const alignLabel = createElement("label", { class: "an-label" });
 			alignLabel.textContent = L.alignment;
 			const alignRow = createElement("div", { class: "an-align-row" });
@@ -7121,6 +7303,7 @@
 			btnRow.appendChild(cancelBtn);
 			box.append(btnRow);
 			overlay.appendChild(box);
+			makeDraggable(header, box);
 			const d1 = on(insertBtn, "click", () => this._onInsert());
 			const d2 = on(cancelBtn, "click", () => this._close());
 			const d3 = on(overlay, "click", (e) => {
@@ -7237,7 +7420,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
 			this._dialog = null;
 		}
 		show() {
@@ -7258,8 +7441,13 @@
 				"aria-label": L.ariaLabel
 			});
 			const box = createElement("div", { class: "an-dialog-box" });
+			const header = createElement("div", { class: "an-dialog-header" });
+			const iconEl = createElement("span", { class: "an-dialog-icon" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.title;
+			header.appendChild(iconEl);
+			header.appendChild(title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.videoUrl;
 			const urlInput = createElement("input", {
@@ -7295,8 +7483,9 @@
 			cancelBtn.textContent = L.cancelBtn;
 			btnRow.appendChild(insertBtn);
 			btnRow.appendChild(cancelBtn);
-			box.append(title, urlLabel, urlInput, hintEl, widthLabel, widthInput, btnRow);
+			box.append(header, urlLabel, urlInput, hintEl, widthLabel, widthInput, btnRow);
 			overlay.appendChild(box);
+			makeDraggable(header, box);
 			const d0 = on(urlInput, "input", () => {
 				const info = this._parseVideoUrl(urlInput.value.trim());
 				hintEl.textContent = info ? this.context.locale.videoDialog.detected(info.type) : urlInput.value ? this.context.locale.videoDialog.unknownFormat : "";
@@ -7317,7 +7506,7 @@
 		}
 		_onInsert() {
 			const rawUrl = this._urlInput.value.trim();
-			const width = Math.max(80, parseInt(this._widthInput.value, 10) || 560);
+			const width = Math.max(80, Number.parseInt(this._widthInput.value, 10) || 560);
 			if (!rawUrl) {
 				this._urlInput.focus();
 				return;
@@ -7360,22 +7549,22 @@
 			} catch {
 				return null;
 			}
-			const ytWatch = url.match(/(?:youtube\.com\/watch\?(?:.*&)?v=|youtube\.com\/embed\/)([a-zA-Z0-9_-]{11})/);
+			const ytWatch = /(?:youtube\.com\/watch\?(?:.*&)?v=|youtube\.com\/embed\/)([a-zA-Z0-9_-]{11})/.exec(url);
 			if (ytWatch) return {
 				type: "YouTube",
 				embedUrl: `https://www.youtube.com/embed/${ytWatch[1]}`
 			};
-			const ytShort = url.match(/youtu\.be\/([a-zA-Z0-9_-]{11})/);
+			const ytShort = /youtu\.be\/([a-zA-Z0-9_-]{11})/.exec(url);
 			if (ytShort) return {
 				type: "YouTube",
 				embedUrl: `https://www.youtube.com/embed/${ytShort[1]}`
 			};
-			const ytShorts = url.match(/youtube\.com\/shorts\/([a-zA-Z0-9_-]{11})/);
+			const ytShorts = /youtube\.com\/shorts\/([a-zA-Z0-9_-]{11})/.exec(url);
 			if (ytShorts) return {
 				type: "YouTube Shorts",
 				embedUrl: `https://www.youtube.com/embed/${ytShorts[1]}`
 			};
-			const vimeo = url.match(/vimeo\.com\/(\d+)/);
+			const vimeo = /vimeo\.com\/(\d+)/.exec(url);
 			if (vimeo) return {
 				type: "Vimeo",
 				embedUrl: `https://player.vimeo.com/video/${vimeo[1]}`
@@ -7399,7 +7588,7 @@
 				const iframeTitle = `${info.type} video player`;
 				return `<div class="an-video-wrapper" style="position:relative;display:block;width:${width}px;max-width:100%"><iframe src="${info.embedUrl}" width="${width}" height="${height}" title="${iframeTitle}" frameborder="0" allowfullscreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" style="display:block;max-width:100%"></iframe><div class="an-video-shield"></div></div>`;
 			}
-			if (info && info.type === "Direct video") return `<div class="an-video-wrapper" style="position:relative;display:block;width:${width}px;max-width:100%"><video src="${info.embedUrl.replace(/"/g, "%22")}" width="${width}" height="${height}" controls style="display:block;max-width:100%"></video><div class="an-video-shield"></div></div>`;
+			if (info && info.type === "Direct video") return `<div class="an-video-wrapper" style="position:relative;display:block;width:${width}px;max-width:100%"><video src="${info.embedUrl.replaceAll("\"", "%22")}" width="${width}" height="${height}" controls style="display:block;max-width:100%"></video><div class="an-video-shield"></div></div>`;
 			const safeSrc = (() => {
 				try {
 					const p = new URL(url);
@@ -7410,7 +7599,7 @@
 				}
 			})();
 			if (!safeSrc) return null;
-			return `<div class="an-video-wrapper" style="position:relative;display:block;width:${width}px;max-width:100%"><video src="${safeSrc.replace(/"/g, "%22")}" width="${width}" height="${height}" controls style="display:block;max-width:100%"></video><div class="an-video-shield"></div></div>`;
+			return `<div class="an-video-wrapper" style="position:relative;display:block;width:${width}px;max-width:100%"><video src="${safeSrc.replaceAll("\"", "%22")}" width="${width}" height="${height}" controls style="display:block;max-width:100%"></video><div class="an-video-shield"></div></div>`;
 		}
 	};
 	//#endregion
@@ -7479,9 +7668,9 @@
 			};
 			this._disposers.push(on(editable, "click", (e) => this._onEditorClick(e)), on(editable, "contextmenu", (e) => {
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
-				const img = e.target.closest("img");
+				const img = e.target?.closest("img");
 				if (img) this._select(img);
-			}), on(document, "click", (e) => this._onDocClick(e)), on(window, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(window, "resize", onWindowResize, { passive: true }), on(editable, "scroll", () => this._updateOverlayPosition(), { passive: true }));
+			}), on(document, "click", (e) => this._onDocClick(e)), on(globalThis, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(globalThis, "resize", onWindowResize, { passive: true }), on(editable, "scroll", () => this._updateOverlayPosition(), { passive: true }));
 			return this;
 		}
 		destroy() {
@@ -7496,7 +7685,7 @@
 				this._positionRaf = null;
 			}
 			this._deselect();
-			if (this._overlay && this._overlay.parentNode) this._overlay.parentNode.removeChild(this._overlay);
+			if (this._overlay && this._overlay.parentNode) this._overlay.remove();
 			this._overlay = null;
 		}
 		/** @returns {HTMLImageElement|null} */
@@ -7698,7 +7887,7 @@
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
 				const wrapper = this._findWrapper(e.target);
 				if (wrapper) this._select(wrapper);
-			}), on(document, "click", (e) => this._onDocClick(e)), on(window, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(window, "resize", onWindowResize), on(editable, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(editable, "dragstart", (e) => {
+			}), on(document, "click", (e) => this._onDocClick(e)), on(globalThis, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(globalThis, "resize", onWindowResize), on(editable, "scroll", () => this._updateOverlayPosition(), { passive: true }), on(editable, "dragstart", (e) => {
 				if (e.target instanceof Element && e.target.closest(".an-video-wrapper")) e.preventDefault();
 			}));
 			return this;
@@ -7715,7 +7904,7 @@
 				this._positionRaf = null;
 			}
 			this._deselect();
-			if (this._overlay && this._overlay.parentNode) this._overlay.parentNode.removeChild(this._overlay);
+			this._overlay?.remove();
 			this._overlay = null;
 		}
 		/** @returns {HTMLElement|null} */
@@ -7736,7 +7925,7 @@
 		*/
 		_findWrapper(el) {
 			if (!el || !(el instanceof Element)) return null;
-			if (el.classList && el.classList.contains("an-video-wrapper")) return el;
+			if (el.classList?.contains("an-video-wrapper")) return el;
 			const w = el.closest(".an-video-wrapper");
 			if (w) return w;
 			return null;
@@ -7769,7 +7958,7 @@
 		_onDocClick(e) {
 			if (!this._activeWrapper) return;
 			if (this._activeWrapper.contains(e.target)) return;
-			if (this._overlay && this._overlay.contains(e.target)) return;
+			if (this._overlay?.contains(e.target)) return;
 			if (e.target.closest(".an-contextmenu")) return;
 			this._deselect();
 		}
@@ -7889,19 +8078,19 @@
 			document.body.appendChild(this._el);
 			const editable = this.context.layoutInfo.editable;
 			this._disposers.push(on(editable, "mouseover", (e) => {
-				const anchor = e.target.closest("a[href]");
+				const anchor = e.target?.closest("a[href]");
 				if (anchor && editable.contains(anchor)) this._scheduleShow(anchor);
 			}), on(editable, "mouseout", (e) => {
 				const to = e.relatedTarget;
 				if (!to || !editable.contains(to) && !this._el.contains(to)) this._scheduleHide();
-			}));
+			}), on(globalThis, "scroll", () => this._hide(), { passive: true }), on(globalThis, "resize", () => this._hide(), { passive: true }));
 			return this;
 		}
 		destroy() {
 			this._clearTimers();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			if (this._el && this._el.parentNode) this._el.remove();
 			this._el = null;
 		}
 		_buildTooltip() {
@@ -7986,8 +8175,8 @@
 			const margin = 6;
 			let top = rect.bottom + margin;
 			let left = rect.left;
-			if (top + tipH > window.innerHeight - margin) top = rect.top - tipH - margin;
-			if (left + tipW > window.innerWidth - margin) left = window.innerWidth - tipW - margin;
+			if (top + tipH > globalThis.innerHeight - margin) top = rect.top - tipH - margin;
+			if (left + tipW > globalThis.innerWidth - margin) left = globalThis.innerWidth - tipW - margin;
 			if (left < margin) left = margin;
 			this._el.style.top = `${top}px`;
 			this._el.style.left = `${left}px`;
@@ -8002,12 +8191,12 @@
 			}
 		}
 		_openLink() {
-			const url = this._activeAnchor && this._activeAnchor.getAttribute("href");
-			if (url) window.open(url, "_blank", "noopener,noreferrer");
+			const url = this._activeAnchor?.getAttribute("href");
+			if (url) globalThis.open(url, "_blank", "noopener,noreferrer");
 			this._hide();
 		}
 		_copyLink() {
-			const url = this._activeAnchor && this._activeAnchor.getAttribute("href");
+			const url = this._activeAnchor?.getAttribute("href");
 			if (url) navigator.clipboard.writeText(url).catch(() => {
 				const ta = document.createElement("textarea");
 				ta.value = url;
@@ -8016,7 +8205,7 @@
 				document.body.appendChild(ta);
 				ta.select();
 				document.execCommand("copy");
-				document.body.removeChild(ta);
+				ta.remove();
 			});
 			if (this._copyBtn) {
 				this._copyBtn.classList.add("an-link-tooltip-btn--copied");
@@ -8027,7 +8216,7 @@
 			const anchor = this._activeAnchor;
 			if (!anchor) return;
 			this._hide();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			const range = document.createRange();
 			range.selectNodeContents(anchor);
 			sel.removeAllRanges();
@@ -8038,7 +8227,7 @@
 			const anchor = this._activeAnchor;
 			if (!anchor) return;
 			this._hide();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			const range = document.createRange();
 			range.selectNode(anchor);
 			sel.removeAllRanges();
@@ -8079,21 +8268,22 @@
 			const editable = this.context.layoutInfo.editable;
 			this._disposers.push(on(editable, "mouseover", (e) => {
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
-				const img = e.target.closest("img");
+				const img = e.target?.closest("img");
 				if (img && editable.contains(img) && !img.closest("a[href]")) this._scheduleShow(img);
 			}, { passive: true }), on(editable, "mouseout", (e) => {
 				const to = e.relatedTarget;
 				if (!to || !editable.contains(to) && !this._el.contains(to)) this._scheduleHide();
 			}, { passive: true }), on(document, "click", (e) => {
-				if (this._activeImg && !this._activeImg.contains(e.target) && !this._el.contains(e.target)) this._hide();
-			}));
+				const et = e.target;
+				if (this._activeImg && !this._activeImg.contains(et) && !this._el.contains(et)) this._hide();
+			}), on(globalThis, "scroll", () => this._hide(), { passive: true }), on(globalThis, "resize", () => this._hide(), { passive: true }));
 			return this;
 		}
 		destroy() {
 			this._clearTimers();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			this._el?.remove();
 			this._el = null;
 		}
 		_buildTooltip() {
@@ -8170,7 +8360,7 @@
 			clearTimeout(this._hideTimer);
 			this._hideTimer = setTimeout(() => this._hide(), HIDE_DELAY$3);
 		}
-		_show(img) {
+		_show(_img) {
 			this._el.style.display = "flex";
 			requestAnimationFrame(() => {
 				if (this._activeImg) this._positionNear(this._activeImg);
@@ -8194,8 +8384,8 @@
 			const margin = 6;
 			let top = rect.bottom + margin;
 			let left = rect.left + (rect.width - tipW) / 2;
-			if (top + tipH > window.innerHeight - margin) top = rect.top - tipH - margin;
-			if (left + tipW > window.innerWidth - margin) left = window.innerWidth - tipW - margin;
+			if (top + tipH > globalThis.innerHeight - margin) top = rect.top - tipH - margin;
+			if (left + tipW > globalThis.innerWidth - margin) left = globalThis.innerWidth - tipW - margin;
 			if (left < margin) left = margin;
 			this._el.style.top = `${top}px`;
 			this._el.style.left = `${left}px`;
@@ -8251,8 +8441,8 @@
 			const img = this._activeImg;
 			if (!img) return;
 			const current = img.style.transform || "";
-			const match = current.match(/rotate\((-?[\d.]+)deg\)/);
-			const next = ((match ? parseFloat(match[1]) : 0) + delta + 360) % 360;
+			const match = /rotate\((-?[\d.]+)deg\)/.exec(current);
+			const next = ((match ? Number.parseFloat(match[1]) : 0) + delta + 360) % 360;
 			const cleaned = current.replace(/rotate\(-?[\d.]+deg\)/, "").trim();
 			img.style.transform = cleaned ? `${cleaned} rotate(${next}deg)` : next === 0 ? "" : `rotate(${next}deg)`;
 			this.context.invoke("editor.afterCommand");
@@ -8267,8 +8457,8 @@
 			this._hide();
 			this.context.invoke("imageResizer.deselect");
 			const figure = img.closest("figure.an-figure");
-			if (figure && figure.parentNode) figure.parentNode.removeChild(figure);
-			else if (img.parentNode) img.parentNode.removeChild(img);
+			if (figure) figure.remove();
+			else img.remove();
 			this.context.invoke("editor.afterCommand");
 		}
 		_crop() {
@@ -8287,7 +8477,7 @@
 					this._hide();
 					const range = document.createRange();
 					range.selectNodeContents(cap);
-					const sel = window.getSelection();
+					const sel = globalThis.getSelection();
 					if (sel) {
 						sel.removeAllRanges();
 						sel.addRange(range);
@@ -8321,7 +8511,7 @@
 			figure.appendChild(figcaption);
 			const range = document.createRange();
 			range.selectNodeContents(figcaption);
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (sel) {
 				sel.removeAllRanges();
 				sel.addRange(range);
@@ -8362,14 +8552,15 @@
 			const editable = this.context.layoutInfo.editable;
 			this._disposers.push(on(editable, "mouseover", (e) => {
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
-				const wrapper = e.target.closest(".an-video-wrapper");
+				const wrapper = e.target?.closest(".an-video-wrapper");
 				if (wrapper && editable.contains(wrapper)) this._scheduleShow(wrapper);
 			}, { passive: true }), on(editable, "mouseout", (e) => {
 				const to = e.relatedTarget;
 				if (!to || !editable.contains(to) && !this._el.contains(to)) this._scheduleHide();
 			}, { passive: true }), on(document, "click", (e) => {
-				if (this._activeWrapper && !this._activeWrapper.contains(e.target) && !this._el.contains(e.target)) this._hide();
-			}));
+				const target = e.target;
+				if (this._activeWrapper && !this._activeWrapper.contains(target) && !this._el.contains(target)) this._hide();
+			}), on(globalThis, "scroll", () => this._hide(), { passive: true }), on(globalThis, "resize", () => this._hide(), { passive: true }));
 			return this;
 		}
 		destroy() {
@@ -8377,7 +8568,7 @@
 			this._clearTimers();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			this._el?.remove();
 			this._el = null;
 		}
 		_buildTooltip() {
@@ -8449,7 +8640,7 @@
 			if (this._hideTimer) return;
 			this._hideTimer = setTimeout(() => this._hide(), HIDE_DELAY$2);
 		}
-		_show(wrapper) {
+		_show(_wrapper) {
 			this._el.style.display = "flex";
 			requestAnimationFrame(() => {
 				if (this._activeWrapper) this._positionNear(this._activeWrapper);
@@ -8474,8 +8665,8 @@
 			const margin = 6;
 			let top = rect.bottom + margin;
 			let left = rect.left + (rect.width - tipW) / 2;
-			if (top + tipH > window.innerHeight - margin) top = rect.top - tipH - margin;
-			if (left + tipW > window.innerWidth - margin) left = window.innerWidth - tipW - margin;
+			if (top + tipH > globalThis.innerHeight - margin) top = rect.top - tipH - margin;
+			if (left + tipW > globalThis.innerWidth - margin) left = globalThis.innerWidth - tipW - margin;
 			if (left < margin) left = margin;
 			this._el.style.top = `${top}px`;
 			this._el.style.left = `${left}px`;
@@ -8529,7 +8720,7 @@
 			if (!wrapper) return;
 			this._hide();
 			this.context.invoke("videoResizer.deselect");
-			if (wrapper.parentNode) wrapper.parentNode.removeChild(wrapper);
+			wrapper.remove();
 			this.context.invoke("editor.afterCommand");
 		}
 		_togglePreview() {
@@ -8673,8 +8864,35 @@
 		rowHeight: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" y1="7" x2="20" y2="7"/><line x1="4" y1="17" x2="20" y2="17"/><line x1="12" y1="7" x2="12" y2="17"/><path d="M9 10l3-3 3 3"/><path d="M9 14l3 3 3-3"/></svg>`,
 		tableBorder: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round"><line x1="3" y1="6" x2="21" y2="6" stroke-width="1"/><line x1="3" y1="13" x2="21" y2="13" stroke-width="2"/><line x1="3" y1="20" x2="21" y2="20" stroke-width="3"/></svg>`,
 		deleteTable: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="1"/><line x1="3" y1="9" x2="21" y2="9"/><line x1="3" y1="15" x2="21" y2="15"/><line x1="9" y1="3" x2="9" y2="21"/><line x1="15" y1="3" x2="15" y2="21"/><line x1="16" y1="16" x2="22" y2="22" stroke="#ef4444"/><line x1="22" y1="16" x2="16" y2="22" stroke="#ef4444"/></svg>`,
-		selectCells: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4 L4 20 L9 15 L12 21 L14 20 L11 14 L17 14 Z" fill="currentColor" opacity="0.15"/><path d="M4 4 L4 20 L9 15 L12 21 L14 20 L11 14 L17 14 Z"/></svg>`
+		selectCells: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4 L4 20 L9 15 L12 21 L14 20 L11 14 L17 14 Z" fill="currentColor" opacity="0.15"/><path d="M4 4 L4 20 L9 15 L12 21 L14 20 L11 14 L17 14 Z"/></svg>`,
+		cellShade: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 11L8.93 3.36a1 1 0 0 0-1.29.08L3.22 7.8a1 1 0 0 0-.07 1.29L11 20"/><path d="m5 14 5-5"/><path d="M22 22a2 2 0 0 1-2 2h-3a2 2 0 0 1-2-2c0-1.5 2.5-5 3.5-5s3.5 3.5 3.5 5z"/></svg>`
 	};
+	var SHADE_PRESETS = [
+		"#000000",
+		"#434343",
+		"#666666",
+		"#999999",
+		"#b7b7b7",
+		"#cccccc",
+		"#efefef",
+		"#ffffff",
+		"#ff0000",
+		"#ff9900",
+		"#ffff00",
+		"#00ff00",
+		"#00ffff",
+		"#4a86e8",
+		"#9900ff",
+		"#ff00ff",
+		"#f4cccc",
+		"#fce5cd",
+		"#fff2cc",
+		"#d9ead3",
+		"#d0e0e3",
+		"#c9daf8",
+		"#d9d2e9",
+		"#ead1dc"
+	];
 	var TableTooltip = class {
 		/** @param {import('../Context.js').Context} context */
 		constructor(context) {
@@ -8689,6 +8907,9 @@
 			this._sizeApply = null;
 			this._sizeTitleEl = null;
 			this._sizeInputEl = null;
+			this._shadePopover = null;
+			this._shadeTitleEl = null;
+			this._shadeColorStrip = null;
 			this._selectMode = false;
 			this._selectedCells = [];
 			this._selectStart = null;
@@ -8701,6 +8922,8 @@
 			document.body.appendChild(this._el);
 			this._sizePopover = this._buildSizePopover();
 			document.body.appendChild(this._sizePopover);
+			this._shadePopover = this._buildCellShadePopover();
+			document.body.appendChild(this._shadePopover);
 			const editable = this.context.layoutInfo.editable;
 			this._editable = editable;
 			const onSelMousedown = (e) => {
@@ -8727,20 +8950,24 @@
 			this._disposers.push(on(editable, "mousedown", onSelMousedown), on(editable, "mousemove", onSelMousemove), on(document, "mouseup", onSelMouseup));
 			this._disposers.push(on(editable, "mouseover", (e) => {
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
-				const table = e.target.closest("table");
+				const table = e.target?.closest("table");
 				if (table && editable.contains(table)) {
-					const cell = e.target.closest("td, th");
-					if (cell) this._activeCell = cell;
+					const cell = e.target?.closest("td, th");
+					if (cell) {
+						this._activeCell = cell;
+						this._syncShadeStrip();
+					}
 					this._scheduleShow(table);
 				}
 			}, { passive: true }), on(editable, "mouseout", (e) => {
 				if (this._selectMode) return;
 				const to = e.relatedTarget;
-				if (!to || !editable.contains(to) && !this._el.contains(to) && !(this._sizePopover && this._sizePopover.contains(to))) this._scheduleHide();
+				if (!to || !editable.contains(to) && !this._el.contains(to) && !this._sizePopover?.contains(to)) this._scheduleHide();
 			}, { passive: true }), on(document, "click", (e) => {
-				if (this._selectMode && this._activeTable && this._activeTable.contains(e.target)) return;
-				if (this._activeTable && !this._activeTable.contains(e.target) && !this._el.contains(e.target) && !(this._sizePopover && this._sizePopover.contains(e.target))) this._hide();
-			}));
+				const et = e.target;
+				if (this._selectMode && this._activeTable?.contains(et)) return;
+				if (this._activeTable && !this._activeTable.contains(et) && !this._el.contains(et) && !this._sizePopover?.contains(et)) this._hide();
+			}), on(document, "selectionchange", () => this._syncShadeStrip()), on(globalThis, "scroll", () => this._hide(), { passive: true }), on(globalThis, "resize", () => this._hide(), { passive: true }));
 			this._initResize();
 			return this;
 		}
@@ -8866,10 +9093,12 @@
 			this._clearTimers();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			if (this._el && this._el.parentNode) this._el.remove();
 			this._el = null;
-			if (this._sizePopover && this._sizePopover.parentNode) this._sizePopover.parentNode.removeChild(this._sizePopover);
+			if (this._sizePopover && this._sizePopover.parentNode) this._sizePopover.remove();
 			this._sizePopover = null;
+			if (this._shadePopover && this._shadePopover.parentNode) this._shadePopover.remove();
+			this._shadePopover = null;
 		}
 		_buildTooltip() {
 			const L = this.context.locale.tooltips.table;
@@ -8897,6 +9126,24 @@
 			el.appendChild(this._makeBtn(ICONS$2.mergeCells, L.mergeCells, () => this._mergeCells()));
 			el.appendChild(this._makeBtn(ICONS$2.unmergeCells, L.unmergeCells, () => this._unmergeCells()));
 			el.appendChild(this._sep());
+			const shadeBtn = createElement("button", {
+				type: "button",
+				class: "an-link-tooltip-btn an-link-tooltip-btn--shade",
+				title: L.cellBackground
+			});
+			const shadeSvgWrap = createElement("span", { class: "an-bubble-btn-svg" });
+			shadeSvgWrap.innerHTML = ICONS$2.cellShade;
+			const shadeStrip = createElement("span", { class: "an-link-tooltip-color-strip" });
+			shadeBtn.appendChild(shadeSvgWrap);
+			shadeBtn.appendChild(shadeStrip);
+			this._shadeColorStrip = shadeStrip;
+			this._disposers.push(on(shadeBtn, "click", (e) => {
+				e.preventDefault();
+				e.stopPropagation();
+				this._openCellShadePopover();
+			}));
+			el.appendChild(shadeBtn);
+			el.appendChild(this._sep());
 			el.appendChild(this._makeBtn(ICONS$2.colWidth, L.columnWidth, () => this._openSizePopover("col")));
 			el.appendChild(this._makeBtn(ICONS$2.rowHeight, L.rowHeight, () => this._openSizePopover("row")));
 			el.appendChild(this._makeBtn(ICONS$2.tableBorder, L.tableBorderWidth, () => this._openSizePopover("border")));
@@ -8905,6 +9152,7 @@
 			this._disposers.push(on(el, "mouseenter", () => this._clearTimers()), on(el, "mouseleave", () => {
 				if (this._selectMode) return;
 				if (this._sizePopover && this._sizePopover.style.display !== "none") return;
+				if (this._shadePopover && this._shadePopover.style.display !== "none") return;
 				this._scheduleHide();
 			}));
 			return el;
@@ -8951,10 +9199,16 @@
 		_show() {
 			if (!this._activeTable) return;
 			this._el.style.display = "flex";
+			this._syncShadeStrip();
 			requestAnimationFrame(() => {
 				if (this._activeTable) this._positionNear(this._activeTable);
 			});
 		}
+		_syncShadeStrip() {
+			if (!this._shadeColorStrip || !this._el || this._el.style.display === "none") return;
+			const cell = this._getCell();
+			this._shadeColorStrip.style.background = cell?.style.backgroundColor || "transparent";
+		}
 		_hide() {
 			this._el.style.display = "none";
 			this._activeTable = null;
@@ -8983,20 +9237,20 @@
 			let left = rect.left + (rect.width - tipW) / 2;
 			let top = rect.top - tipH - margin;
 			if (top < margin) top = rect.bottom + margin;
-			if (left + tipW > window.innerWidth - margin) left = window.innerWidth - tipW - margin;
+			if (left + tipW > globalThis.innerWidth - margin) left = globalThis.innerWidth - tipW - margin;
 			if (left < margin) left = margin;
 			this._el.style.left = `${left}px`;
 			this._el.style.top = `${top}px`;
 		}
 		_getCell() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (sel && sel.rangeCount) {
 				let container = sel.getRangeAt(0).commonAncestorContainer;
 				if (container.nodeType === 3) container = container.parentElement;
-				const cellFromSel = container && container.closest && container.closest("td, th");
-				if (cellFromSel && this._activeTable && this._activeTable.contains(cellFromSel)) return cellFromSel;
+				const cellFromSel = container?.closest("td, th");
+				if (cellFromSel && this._activeTable?.contains(cellFromSel)) return cellFromSel;
 			}
-			return this._activeCell || this._activeTable && this._activeTable.querySelector("td, th");
+			return this._activeCell || this._activeTable?.querySelector("td, th");
 		}
 		_toggleSelectMode() {
 			this._selectMode = !this._selectMode;
@@ -9095,11 +9349,12 @@
 			const table = cells[0].closest("table");
 			if (!table) return;
 			const allRows = Array.from(table.querySelectorAll("tr"));
-			const refRow = [...new Set(cells.map((c) => c.closest("tr")).filter(Boolean))].reduce((best, r) => {
+			const selectedRows = [...new Set(cells.map((c) => c.closest("tr")).filter(Boolean))];
+			const refRow = selectedRows.reduce((best, r) => {
 				const bi = allRows.indexOf(best);
 				const ri = allRows.indexOf(r);
 				return position === "above" ? ri < bi ? r : best : ri > bi ? r : best;
-			});
+			}, selectedRows[0]);
 			const colCount = Array.from(refRow.cells).reduce((sum, c) => sum + (c.colSpan || 1), 0);
 			const newRow = document.createElement("tr");
 			const refCells = Array.from(refRow.cells);
@@ -9142,7 +9397,7 @@
 			if (selectedRows.filter((r) => r.closest("tbody")).length >= totalBodyRows) return;
 			this._activeCell = null;
 			this._clearSelection();
-			selectedRows.forEach((r) => r.parentElement?.removeChild(r));
+			selectedRows.forEach((r) => r.remove());
 			requestAnimationFrame(() => this._positionNear(this._activeTable));
 			this.context.invoke("editor.afterCommand");
 		}
@@ -9164,7 +9419,7 @@
 			});
 			this._activeCell = null;
 			this._clearSelection();
-			cellsToDelete.forEach((c) => c.parentElement?.removeChild(c));
+			cellsToDelete.forEach((c) => c.remove());
 			requestAnimationFrame(() => this._positionNear(this._activeTable));
 			this.context.invoke("editor.afterCommand");
 		}
@@ -9175,7 +9430,7 @@
 			if (!table) return;
 			let selected = this._getSelectedCells().filter((c) => table.contains(c));
 			if (selected.length < 2) {
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || sel.rangeCount === 0) return;
 				const range = sel.getRangeAt(0);
 				selected = Array.from(table.querySelectorAll("td, th")).filter((c) => {
@@ -9217,7 +9472,7 @@
 			first.rowSpan = maxR - minR + 1;
 			first.style.verticalAlign = "middle";
 			first.innerHTML = rectCells.map((c) => c.innerHTML).join("");
-			rectCells.slice(1).forEach((c) => c.parentElement?.removeChild(c));
+			rectCells.slice(1).forEach((c) => c.remove());
 			this._clearSelection();
 			this.context.invoke("editor.afterCommand");
 		}
@@ -9225,7 +9480,7 @@
 			const table = this._activeTable;
 			if (!table) return;
 			this._hide();
-			if (table.parentNode) table.parentNode.removeChild(table);
+			if (table.parentNode) table.remove();
 			this.context.invoke("editor.afterCommand");
 		}
 		_unmergeCells() {
@@ -9314,20 +9569,22 @@
 			this._sizeInputEl = inputEl;
 			this._sizeApply = null;
 			const d1 = on(applyBtn, "click", () => {
-				const val = parseInt(this._sizeInputEl.value, 10);
+				const val = Number.parseInt(this._sizeInputEl.value, 10);
 				if (val > 0 && typeof this._sizeApply === "function") this._sizeApply(val);
 				this._hideSizePopover();
 			});
 			const d2 = on(cancelBtn, "click", () => this._hideSizePopover());
 			const d3 = on(inputEl, "keydown", (e) => {
-				if (e.key === "Enter") {
+				const ke = e;
+				if (ke.key === "Enter") {
 					e.preventDefault();
 					applyBtn.click();
 				}
-				if (e.key === "Escape") this._hideSizePopover();
+				if (ke.key === "Escape") this._hideSizePopover();
 			});
 			const d4 = on(document, "click", (e) => {
-				if (this._sizePopover && this._sizePopover.style.display !== "none" && !this._sizePopover.contains(e.target) && !this._el.contains(e.target)) this._hideSizePopover();
+				const et = e.target;
+				if (this._sizePopover && this._sizePopover.style.display !== "none" && !this._sizePopover.contains(et) && !this._el.contains(et)) this._hideSizePopover();
 			});
 			const d5 = on(popover, "mouseenter", () => this._clearTimers());
 			const d6 = on(popover, "mouseleave", () => this._scheduleHide());
@@ -9341,11 +9598,11 @@
 				const table = cell.closest("table");
 				if (!table) return;
 				const firstCell = table.querySelector("td, th");
-				const currentPx = firstCell ? parseInt(firstCell.style.borderWidth, 10) || parseInt(window.getComputedStyle(firstCell).borderWidth, 10) || 1 : 1;
+				const currentPx = firstCell ? Number.parseInt(firstCell.style.borderWidth, 10) || Number.parseInt(globalThis.getComputedStyle(firstCell).borderWidth, 10) || 1 : 1;
 				this._sizeTitleEl.textContent = this.context.locale.tooltips.table.tableBorderWidthPx;
 				this._sizeInputEl.min = "0";
 				this._sizeInputEl.max = "10";
-				this._sizeInputEl.value = currentPx;
+				this._sizeInputEl.value = String(currentPx);
 				this._sizeApply = (val) => {
 					const cells = Array.from(table.querySelectorAll("td, th"));
 					if (val === 0) cells.forEach((c) => {
@@ -9400,8 +9657,8 @@
 				const ph = this._sizePopover.offsetHeight || 110;
 				let left = tipRect.left;
 				let top = tipRect.bottom + 6;
-				if (left + pw > window.innerWidth - 8) left = window.innerWidth - pw - 8;
-				if (top + ph > window.innerHeight - 8) top = tipRect.top - ph - 6;
+				if (left + pw > globalThis.innerWidth - 8) left = globalThis.innerWidth - pw - 8;
+				if (top + ph > globalThis.innerHeight - 8) top = tipRect.top - ph - 6;
 				this._sizePopover.style.left = `${left}px`;
 				this._sizePopover.style.top = `${top}px`;
 				if (this._sizeInputEl) {
@@ -9414,6 +9671,84 @@
 			if (this._sizePopover) this._sizePopover.style.display = "none";
 			this._sizeApply = null;
 		}
+		_buildCellShadePopover() {
+			const pop = createElement("div", { class: "an-cell-shade-popover" });
+			pop.style.display = "none";
+			const title = createElement("div", { class: "an-size-popover-title" });
+			pop.appendChild(title);
+			this._shadeTitleEl = title;
+			const palette = createElement("div", { class: "an-context-color-palette" });
+			SHADE_PRESETS.forEach((color) => {
+				const sw = createElement("div", {
+					class: "an-context-color-swatch",
+					title: color
+				});
+				sw.style.background = color;
+				this._disposers.push(on(sw, "click", (e) => {
+					e.stopPropagation();
+					this._applyCellShade(color);
+				}));
+				palette.appendChild(sw);
+			});
+			pop.appendChild(palette);
+			const noShadeRow = createElement("div", { class: "an-context-color-custom" });
+			const noShadeBtn = createElement("button", {
+				type: "button",
+				class: "an-shade-no-color"
+			});
+			this._disposers.push(on(noShadeBtn, "click", () => this._applyCellShade("")));
+			noShadeRow.appendChild(noShadeBtn);
+			pop.appendChild(noShadeRow);
+			this._shadeNoBtn = noShadeBtn;
+			const customRow = createElement("div", { class: "an-context-color-custom" });
+			const colorInput = createElement("input", {
+				type: "color",
+				class: "an-shade-color-input",
+				value: "#ffffff"
+			});
+			const customLabel = createElement("span");
+			customLabel.textContent = "Custom…";
+			this._disposers.push(on(colorInput, "change", () => this._applyCellShade(colorInput.value)));
+			customRow.appendChild(colorInput);
+			customRow.appendChild(customLabel);
+			pop.appendChild(customRow);
+			this._disposers.push(on(pop, "mousedown", (e) => e.preventDefault()), on(pop, "mouseenter", () => this._clearTimers()), on(pop, "mouseleave", () => this._scheduleHide()));
+			this._disposers.push(on(document, "click", (e) => {
+				const et = e.target;
+				if (this._shadePopover && this._shadePopover.style.display !== "none" && !this._shadePopover.contains(et) && !this._el?.contains(et)) this._hideCellShadePopover();
+			}));
+			return pop;
+		}
+		_openCellShadePopover() {
+			if (!this._shadePopover) return;
+			const L = this.context.locale.tooltips.table;
+			if (this._shadeTitleEl) this._shadeTitleEl.textContent = L.cellBackground;
+			if (this._shadeNoBtn) this._shadeNoBtn.textContent = L.noShading;
+			this._shadePopover.style.display = "block";
+			requestAnimationFrame(() => {
+				if (!this._shadePopover || !this._el) return;
+				const pw = this._shadePopover.offsetWidth || 170;
+				const ph = this._shadePopover.offsetHeight || 120;
+				const tipRect = this._el.getBoundingClientRect();
+				let left = tipRect.left;
+				let top = tipRect.bottom + 6;
+				if (left + pw > globalThis.innerWidth - 8) left = globalThis.innerWidth - pw - 8;
+				if (top + ph > globalThis.innerHeight - 8) top = tipRect.top - ph - 6;
+				this._shadePopover.style.left = `${Math.max(8, left)}px`;
+				this._shadePopover.style.top = `${Math.max(8, top)}px`;
+			});
+		}
+		_hideCellShadePopover() {
+			if (this._shadePopover) this._shadePopover.style.display = "none";
+		}
+		_applyCellShade(color) {
+			(this._selectMode ? this._selectedCells : [this._getCell()]).forEach((cell) => {
+				if (cell) cell.style.backgroundColor = color;
+			});
+			if (this._shadeColorStrip) this._shadeColorStrip.style.background = color || "transparent";
+			this._hideCellShadePopover();
+			this.context.invoke("editor.afterCommand");
+		}
 	};
 	//#endregion
 	//#region src/js/module/CodeTooltip.js
@@ -9446,13 +9781,14 @@
 			const editable = this.context.layoutInfo.editable;
 			this._disposers.push(on(editable, "mouseover", (e) => {
 				if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
-				const pre = e.target.closest("pre");
+				const pre = e.target?.closest("pre");
 				if (pre && editable.contains(pre)) this._scheduleShow(pre);
 			}), on(editable, "mouseout", (e) => {
 				const to = e.relatedTarget;
 				if (!to || !editable.contains(to) && !this._el.contains(to)) this._scheduleHide();
 			}), on(document, "click", (e) => {
-				if (this._activePre && !this._activePre.contains(e.target) && !this._el.contains(e.target)) this._hide();
+				const et = e.target;
+				if (this._activePre && !this._activePre.contains(et) && !this._el.contains(et)) this._hide();
 			}));
 			return this;
 		}
@@ -9460,7 +9796,7 @@
 			this._clearTimers();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			this._el?.remove();
 			this._el = null;
 		}
 		_buildTooltip() {
@@ -9487,6 +9823,7 @@
 				["python", "Python"],
 				["html", "HTML"],
 				["css", "CSS"],
+				["scss", "SCSS"],
 				["json", "JSON"],
 				["xml", "XML"],
 				["bash", "Bash / Shell"],
@@ -9585,21 +9922,21 @@
 			let top = rect.top - tipH - margin;
 			let left = rect.left + (rect.width - tipW) / 2;
 			if (top < margin) top = rect.bottom + margin;
-			if (left + tipW > window.innerWidth - margin) left = window.innerWidth - tipW - margin;
+			if (left + tipW > globalThis.innerWidth - margin) left = globalThis.innerWidth - tipW - margin;
 			if (left < margin) left = margin;
 			this._el.style.top = `${top}px`;
 			this._el.style.left = `${left}px`;
 		}
 		_syncWrapBtn() {
 			if (!this._activePre || !this._wrapBtn) return;
-			const wrapped = (this._activePre.style.whiteSpace || "").includes("pre-wrap") || window.getComputedStyle(this._activePre).whiteSpace === "pre-wrap";
+			const wrapped = (this._activePre.style.whiteSpace || "").includes("pre-wrap") || globalThis.getComputedStyle(this._activePre).whiteSpace === "pre-wrap";
 			this._wrapBtn.classList.toggle("active", wrapped);
 			this._wrapBtn.title = wrapped ? this.context.locale.tooltips.code.disableWordWrap : this.context.locale.tooltips.code.enableWordWrap;
 		}
 		_syncLangSelect() {
 			if (!this._activePre || !this._langSelect) return;
 			const codeEl = this._activePre.querySelector("code");
-			const fromAttr = this._activePre.getAttribute("data-language") || "";
+			const fromAttr = this._activePre.dataset.language || "";
 			const fromClass = codeEl ? (_LANG_CLASS_RE.exec(codeEl.className) || [])[1] || "" : "";
 			this._langSelect.value = fromAttr || fromClass || "";
 		}
@@ -9618,7 +9955,7 @@
 					document.execCommand("copy");
 					this._flashCopied();
 				} catch (_) {}
-				document.body.removeChild(ta);
+				ta.remove();
 			}
 		}
 		_flashCopied() {
@@ -9642,10 +9979,26 @@
 			this.context.invoke("editor.afterCommand");
 			this._positionNear(pre);
 		}
+		/**
+		* Applies a language to a given <pre> element: sets classes, data-language,
+		* and triggers Prism highlighting. Called by the auto-detect flow.
+		* @param {HTMLElement} pre
+		* @param {string} lang - Prism language identifier, e.g. 'javascript'
+		*/
+		applyLanguage(pre, lang) {
+			if (!pre || !lang) return;
+			const savedPre = this._activePre;
+			this._activePre = pre;
+			if (this._langSelect) this._langSelect.value = lang;
+			this._onLangChange();
+			if (this._langSelect) this._langSelect.value = lang;
+			this._activePre = savedPre || pre;
+		}
 		_onLangChange() {
 			const pre = this._activePre;
 			if (!pre) return;
 			const lang = this._langSelect.value;
+			const _w = globalThis;
 			let codeEl = pre.querySelector("code");
 			if (!codeEl) {
 				codeEl = document.createElement("code");
@@ -9655,16 +10008,16 @@
 			}
 			codeEl.className = lang ? `language-${lang}` : "";
 			pre.className = lang ? `language-${lang}` : "";
-			if (lang) pre.setAttribute("data-language", lang);
-			else pre.removeAttribute("data-language");
+			if (lang) pre.dataset.language = lang;
+			else delete pre.dataset.language;
 			const applyPrism = () => {
 				codeEl.querySelectorAll("br").forEach((br) => br.replaceWith("\n"));
-				window.Prism.highlightElement(codeEl);
+				_w.Prism.highlightElement(codeEl);
 				this.context.invoke("editor.afterCommand");
 			};
 			if (lang) {
-				if (typeof window.Prism !== "undefined") {
-					if (window.Prism.languages[lang]) {
+				if (_w.Prism !== void 0) {
+					if (_w.Prism.languages[lang]) {
 						applyPrism();
 						return;
 					}
@@ -9672,7 +10025,7 @@
 					return;
 				} else if (this._prismScript) {
 					this._prismScript.addEventListener("load", () => {
-						if (window.Prism.languages[lang]) applyPrism();
+						if (_w.Prism.languages[lang]) applyPrism();
 						else this._loadPrismComponent(lang, applyPrism);
 					}, { once: true });
 					return;
@@ -9685,7 +10038,8 @@
 		* Called once at initialize time. Fire-and-forget; errors are silent.
 		*/
 		_ensurePrism() {
-			if (!this.context.options.codeHighlight || window.Prism) return;
+			const _w = globalThis;
+			if (!this.context.options.codeHighlight || _w.Prism) return;
 			const cdn = this.context.options.codeHighlightCDN;
 			const themeHref = `${cdn}/themes/prism-tomorrow.min.css`;
 			const scriptSrc = `${cdn}/prism.min.js`;
@@ -9697,7 +10051,7 @@
 			}
 			const existingScript = document.querySelector(`script[src="${scriptSrc}"]`);
 			if (existingScript) {
-				this._prismScript = window.Prism ? null : existingScript;
+				this._prismScript = _w.Prism ? null : existingScript;
 				return;
 			}
 			const script = document.createElement("script");
@@ -9717,10 +10071,11 @@
 		* @param {Function} cb  – called once the grammar is ready
 		*/
 		_loadPrismComponent(lang, cb) {
+			const _w = globalThis;
 			const src = `${this.context.options.codeHighlightCDN}/components/prism-${lang}.min.js`;
 			if (document.querySelector(`script[src="${src}"]`)) {
 				const poll = setInterval(() => {
-					if (window.Prism && window.Prism.languages[lang]) {
+					if (_w.Prism?.languages[lang]) {
 						clearInterval(poll);
 						cb();
 					}
@@ -9751,7 +10106,7 @@
 			const pre = this._activePre;
 			if (!pre) return;
 			this._hide();
-			if (pre.parentNode) pre.parentNode.removeChild(pre);
+			pre.remove();
 			this.context.invoke("editor.afterCommand");
 		}
 	};
@@ -12106,7 +12461,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
 			this._dialog = null;
 		}
 		show() {
@@ -12133,15 +12488,19 @@
 			});
 			const box = createElement("div", { class: "an-dialog-box an-emoji-box" });
 			const titleRow = createElement("div", { class: "an-icon-title-row" });
+			const titleGroup = createElement("div", { class: "an-dialog-title-group" });
+			const iconEl = createElement("span", { class: "an-dialog-icon an-dialog-icon--sm" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M8 13s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.title;
+			titleGroup.append(iconEl, title);
 			const closeBtn = createElement("button", {
 				type: "button",
 				class: "an-icon-close",
 				"aria-label": L.close
 			});
 			closeBtn.innerHTML = "&times;";
-			titleRow.append(title, closeBtn);
+			titleRow.append(titleGroup, closeBtn);
 			const searchInput = createElement("input", {
 				type: "search",
 				class: "an-input an-icon-search",
@@ -12163,7 +12522,7 @@
 					class: "an-icon-cat",
 					"data-cat": id
 				});
-				tab.textContent = L.categories && L.categories[id] || label;
+				tab.textContent = L.categories?.[id] || label;
 				catBar.appendChild(tab);
 			});
 			this._catBar = catBar;
@@ -12190,6 +12549,7 @@
 			btnRow.appendChild(cancelBtn);
 			box.append(titleRow, searchInput, catBar, grid, btnRow);
 			overlay.appendChild(box);
+			makeDraggable(titleRow, box);
 			const d1 = on(closeBtn, "click", () => this._close());
 			const d2 = on(cancelBtn, "click", () => this._close());
 			const d3 = on(overlay, "click", (e) => {
@@ -12197,7 +12557,7 @@
 			});
 			const d4 = on(searchInput, "input", () => this._filterEmojis(searchInput.value, this._activeCat));
 			const d5 = on(catBar, "click", (e) => {
-				const tab = e.target.closest("[data-cat]");
+				const tab = e.target?.closest("[data-cat]");
 				if (tab) {
 					this._activeCat = tab.dataset.cat;
 					this._updateCatTabs();
@@ -12205,7 +12565,7 @@
 				}
 			});
 			const d6 = on(grid, "click", (e) => {
-				const cell = e.target.closest(".an-emoji-cell");
+				const cell = e.target?.closest(".an-emoji-cell");
 				if (cell) this._onEmojiClick(cell.dataset.char);
 			});
 			this._disposers.push(d1, d2, d3, d4, d5, d6);
@@ -12213,17 +12573,22 @@
 		}
 		_updateCatTabs() {
 			this._catBar.querySelectorAll(".an-icon-cat").forEach((tab) => {
-				tab.classList.toggle("active", tab.dataset.cat === this._activeCat);
+				tab.classList.toggle(
+					"active",
+					/** @type {HTMLElement} */
+					tab.dataset.cat === this._activeCat
+				);
 			});
 		}
 		_filterEmojis(query, cat) {
 			const q = (query || "").trim().toLowerCase();
 			let count = 0;
 			this._grid.querySelectorAll(".an-emoji-cell").forEach((cell) => {
-				const matchCat = !cat || cat === "all" || cell.dataset.cat === cat;
-				const matchQuery = !q || cell.dataset.keywords.includes(q) || cell.dataset.char === q;
+				const hCell = cell;
+				const matchCat = !cat || cat === "all" || hCell.dataset.cat === cat;
+				const matchQuery = !q || hCell.dataset.keywords.includes(q) || hCell.dataset.char === q;
 				const visible = matchCat && matchQuery;
-				cell.style.display = visible ? "" : "none";
+				hCell.style.display = visible ? "" : "none";
 				if (visible) count++;
 			});
 			let empty = this._grid.querySelector(".an-icon-empty");
@@ -12232,13 +12597,13 @@
 				empty.textContent = "No emojis found";
 				this._grid.appendChild(empty);
 			}
-			empty.style.display = count > 0 ? "none" : "";
+			/** @type {HTMLElement} */ empty.style.display = count > 0 ? "none" : "";
 		}
 		_onEmojiClick(char) {
 			const savedRange = this._savedRange;
 			const editable = this.context.layoutInfo.editable;
 			if (savedRange) savedRange.select();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			let range = sel && sel.rangeCount > 0 ? sel.getRangeAt(0) : null;
 			if (!range) {
 				range = document.createRange();
@@ -12246,9 +12611,9 @@
 				range.collapse(false);
 			}
 			const _sc = range.startContainer;
-			const _tdAnchor = (_sc.nodeType === 1 ? _sc : _sc.parentElement)?.closest?.("td, th");
+			const _tdAnchor = (_sc.nodeType === 1 ? _sc : _sc.parentElement)?.closest("td, th");
 			range.deleteContents();
-			if (_tdAnchor && _tdAnchor.isConnected && !_tdAnchor.contains(range.startContainer)) {
+			if (_tdAnchor?.isConnected && !_tdAnchor.contains(range.startContainer)) {
 				range.setStart(_tdAnchor, 0);
 				range.collapse(true);
 			}
@@ -12268,7 +12633,7 @@
 			if (this._dialog) {
 				this._dialog.style.display = "flex";
 				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._searchInput && this._searchInput.focus(), 50);
+				setTimeout(() => this._searchInput?.focus(), 50);
 			}
 		}
 		_close() {
@@ -12575,7 +12940,7 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			this._dialog?.remove();
 			this._dialog = null;
 		}
 		show() {
@@ -12606,15 +12971,19 @@
 			});
 			const box = createElement("div", { class: "an-dialog-box an-icon-box" });
 			const titleRow = createElement("div", { class: "an-icon-title-row" });
+			const titleGroup = createElement("div", { class: "an-dialog-title-group" });
+			const iconEl = createElement("span", { class: "an-dialog-icon an-dialog-icon--sm" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.title;
+			titleGroup.append(iconEl, title);
 			const closeBtn = createElement("button", {
 				type: "button",
 				class: "an-icon-close",
 				"aria-label": L.close
 			});
 			closeBtn.innerHTML = "&times;";
-			titleRow.append(title, closeBtn);
+			titleRow.append(titleGroup, closeBtn);
 			const searchInput = createElement("input", {
 				type: "search",
 				class: "an-input an-icon-search",
@@ -12636,7 +13005,7 @@
 					class: "an-icon-cat",
 					"data-cat": id
 				});
-				tab.textContent = L.categories && L.categories[id] || label;
+				tab.textContent = L.categories?.[id] || label;
 				catBar.appendChild(tab);
 			});
 			this._catBar = catBar;
@@ -12729,6 +13098,7 @@
 			this._insertBtn = insertBtn;
 			box.append(titleRow, searchInput, catBar, grid, optRow, preview, btnRow);
 			overlay.appendChild(box);
+			makeDraggable(titleRow, box);
 			const d1 = on(closeBtn, "click", () => this._close());
 			const d2 = on(cancelBtn, "click", () => this._close());
 			const d3 = on(insertBtn, "click", () => this._onInsert());
@@ -12737,7 +13107,7 @@
 			});
 			const d5 = on(searchInput, "input", () => this._filterIcons(searchInput.value, this._activeCat));
 			const d6 = on(catBar, "click", (e) => {
-				const tab = e.target.closest("[data-cat]");
+				const tab = e.target?.closest("[data-cat]");
 				if (tab) {
 					this._activeCat = tab.dataset.cat;
 					this._updateCatTabs();
@@ -12745,7 +13115,7 @@
 				}
 			});
 			const d7 = on(grid, "click", (e) => {
-				const cell = e.target.closest(".an-icon-cell");
+				const cell = e.target?.closest(".an-icon-cell");
 				if (cell) this._selectIcon(cell.dataset.name);
 			});
 			const d8 = on(styleSelect, "change", () => this._updatePreview(this._selectedIcon));
@@ -12757,19 +13127,24 @@
 		}
 		_updateCatTabs() {
 			this._catBar.querySelectorAll(".an-icon-cat").forEach((tab) => {
-				tab.classList.toggle("active", tab.dataset.cat === this._activeCat);
+				tab.classList.toggle(
+					"active",
+					/** @type {HTMLElement} */
+					tab.dataset.cat === this._activeCat
+				);
 			});
 		}
 		_filterIcons(query, cat) {
 			const q = (query || "").trim().toLowerCase();
 			let visibleCount = 0;
 			this._grid.querySelectorAll(".an-icon-cell").forEach((cell) => {
-				const name = cell.dataset.name;
-				const cellCat = cell.dataset.cat;
+				const hCell = cell;
+				const name = hCell.dataset.name;
+				const cellCat = hCell.dataset.cat;
 				const matchesCat = !cat || cat === "all" || cellCat === cat;
 				const matchesQuery = !q || name.includes(q);
 				const visible = matchesCat && matchesQuery;
-				cell.style.display = visible ? "" : "none";
+				hCell.style.display = visible ? "" : "none";
 				if (visible) visibleCount++;
 			});
 			let empty = this._grid.querySelector(".an-icon-empty");
@@ -12778,12 +13153,16 @@
 				empty.textContent = "No icons found";
 				this._grid.appendChild(empty);
 			}
-			empty.style.display = visibleCount > 0 ? "none" : "";
+			/** @type {HTMLElement} */ empty.style.display = visibleCount > 0 ? "none" : "";
 		}
 		_selectIcon(name) {
 			this._selectedIcon = name;
 			this._grid.querySelectorAll(".an-icon-cell").forEach((cell) => {
-				cell.classList.toggle("active", cell.dataset.name === name);
+				cell.classList.toggle(
+					"active",
+					/** @type {HTMLElement} */
+					cell.dataset.name === name
+				);
 			});
 			this._insertBtn.removeAttribute("disabled");
 			this._updatePreview(name);
@@ -12794,17 +13173,17 @@
 				this._preview.innerHTML = "<span class=\"an-icon-preview-hint\">Select an icon</span>";
 				return;
 			}
-			const cls = this._styleSelect && this._styleSelect.value || "fa-solid";
-			const size = this._sizeSelect && this._sizeSelect.value || "1em";
-			const color = (this._useColorCb ? this._useColorCb.checked : false) && this._colorInput ? this._colorInput.value : "";
+			const cls = this._styleSelect?.value || "fa-solid";
+			const size = this._sizeSelect?.value || "1em";
+			const color = this._useColorCb?.checked ?? false ? this._colorInput?.value ?? "" : "";
 			const styleAttr = [size ? `font-size:${size}` : "", color ? `color:${color}` : ""].filter(Boolean).join(";");
 			this._preview.innerHTML = `<i class="${cls} fa-${name}" aria-hidden="true"${styleAttr ? ` style="${styleAttr}"` : ""}></i><div class="an-icon-preview-name">${cls} fa-${name}</div>`;
 		}
 		_onInsert() {
 			if (!this._selectedIcon) return;
-			const cls = this._styleSelect && this._styleSelect.value || "fa-solid";
-			const size = this._sizeSelect && this._sizeSelect.value || "";
-			const color = (this._useColorCb ? this._useColorCb.checked : false) && this._colorInput ? this._colorInput.value : "";
+			const cls = this._styleSelect?.value || "fa-solid";
+			const size = this._sizeSelect?.value || "";
+			const color = this._useColorCb?.checked ?? false ? this._colorInput?.value ?? "" : "";
 			const styleParts = [size ? `font-size:${size}` : "", color ? `color:${color}` : ""].filter(Boolean);
 			const iconEl = document.createElement("i");
 			iconEl.className = `${cls} fa-${this._selectedIcon}`;
@@ -12814,15 +13193,15 @@
 			const savedRange = this._savedRange;
 			const editable = this.context.layoutInfo.editable;
 			if (savedRange) savedRange.select();
-			const sel = window.getSelection();
-			let range = sel && sel.rangeCount > 0 ? sel.getRangeAt(0) : null;
+			const sel = globalThis.getSelection();
+			let range = (sel?.rangeCount ?? 0) > 0 ? sel.getRangeAt(0) : null;
 			if (!range) {
 				range = document.createRange();
 				range.selectNodeContents(editable);
 				range.collapse(false);
 			}
 			const _sc = range.startContainer;
-			const _tdAnchor = (_sc.nodeType === 1 ? _sc : _sc.parentElement)?.closest?.("td, th");
+			const _tdAnchor = (_sc.nodeType === 1 ? _sc : _sc.parentElement)?.closest("td, th");
 			range.deleteContents();
 			if (_tdAnchor && _tdAnchor.isConnected && !_tdAnchor.contains(range.startContainer)) {
 				range.setStart(_tdAnchor, 0);
@@ -12854,7 +13233,7 @@
 			if (this._dialog) {
 				this._dialog.style.display = "flex";
 				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._searchInput && this._searchInput.focus(), 50);
+				setTimeout(() => this._searchInput?.focus(), 50);
 			}
 		}
 		_close() {
@@ -12955,7 +13334,7 @@
 			icon: ICONS.paste,
 			action: (ctx) => {
 				if (!navigator.clipboard) return;
-				const editable = ctx.layoutInfo && ctx.layoutInfo.editable;
+				const editable = ctx.layoutInfo?.editable;
 				if (!editable) return;
 				const doInsert = (html, text) => {
 					editable.focus();
@@ -13080,29 +13459,29 @@
 			this.el.style.display = "none";
 			document.body.appendChild(this.el);
 			this._renderItems(this._items);
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (editable) this._disposers.push(on(editable, "contextmenu", (e) => this._onContextMenu(e)));
 			this._disposers.push(on(document, "click", (e) => this._maybeHide(e)));
 			this._disposers.push(on(document, "keydown", (e) => {
 				if (e.key === "Escape") this.hide();
 			}));
-			this._disposers.push(on(window, "scroll", () => this.hide(), { passive: true }));
+			this._disposers.push(on(globalThis, "scroll", () => this.hide(), { passive: true }));
 			return this;
 		}
 		destroy() {
 			this._menuDisposers.forEach((d) => {
 				try {
 					d();
-				} catch (e) {}
+				} catch (_e) {}
 			});
 			this._menuDisposers = [];
 			this._disposers.forEach((d) => {
 				try {
 					d();
-				} catch (e) {}
+				} catch (_e) {}
 			});
 			this._disposers = [];
-			if (this.el && this.el.parentNode) this.el.parentNode.removeChild(this.el);
+			if (this.el) this.el.remove();
 			this.el = null;
 		}
 		_renderItems(items) {
@@ -13130,8 +13509,8 @@
 					backBtn.appendChild(createElement("span", { class: "an-context-label" }, [backLabel]));
 					const off = on(backBtn, "click", (e) => {
 						e.stopPropagation();
-						const curLeft = parseFloat(this.el.style.left);
-						const curTop = parseFloat(this.el.style.top);
+						const curLeft = Number.parseFloat(this.el.style.left);
+						const curTop = Number.parseFloat(this.el.style.top);
 						this._renderItems(it.navigate());
 						this._reposition(curLeft, curTop);
 					});
@@ -13174,8 +13553,8 @@
 					btn.appendChild(chevron);
 					const off = on(btn, "click", (e) => {
 						e.stopPropagation();
-						const curLeft = parseFloat(this.el.style.left);
-						const curTop = parseFloat(this.el.style.top);
+						const curLeft = Number.parseFloat(this.el.style.left);
+						const curTop = Number.parseFloat(this.el.style.top);
 						this._renderItems(it.navigate());
 						this._reposition(curLeft, curTop);
 					});
@@ -13290,20 +13669,20 @@
 					});
 					this._menuDisposers.push(offHeader);
 					const offMove = on(gridEl, "mousemove", (e) => {
-						const cell = e.target.closest("[data-row]");
+						const cell = e.target?.closest("[data-row]");
 						if (!cell) return;
 						setHighlight(+cell.dataset.row, +cell.dataset.col);
 					});
 					const offLeave = on(gridEl, "mouseleave", () => setHighlight(0, 0));
 					const offClick = on(gridEl, "click", (e) => {
-						const cell = e.target.closest("[data-row]");
+						const cell = e.target?.closest("[data-row]");
 						if (!cell) return;
 						const rows = +cell.dataset.row;
 						const cols = +cell.dataset.col;
-						const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+						const editable = this.context.layoutInfo?.editable;
 						if (editable && this._savedRange) {
 							editable.focus();
-							const sel = window.getSelection();
+							const sel = globalThis.getSelection();
 							sel.removeAllRanges();
 							sel.addRange(this._savedRange.cloneRange());
 						}
@@ -13321,7 +13700,7 @@
 					class: "an-context-item",
 					"data-name": it.name || ""
 				});
-				if (typeof it.disabled === "function" ? it.disabled(this.context) : !!it.disabled) btn.disabled = true;
+				if (typeof it.disabled === "function" ? it.disabled(this.context) : !!it.disabled) /** @type {HTMLButtonElement} */ btn.disabled = true;
 				if (it.icon) {
 					const iconSpan = createElement("span", {
 						class: "an-context-icon",
@@ -13345,15 +13724,15 @@
 			});
 		}
 		_onContextMenu(event) {
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (!editable) return;
 			if (!editable.contains(event.target)) return;
 			if (this.context.layoutInfo.container.classList.contains("an-disabled")) return;
 			event.preventDefault();
-			const winSel = window.getSelection();
+			const winSel = globalThis.getSelection();
 			this._savedRange = winSel && winSel.rangeCount > 0 ? winSel.getRangeAt(0).cloneRange() : null;
 			this._renderItems(this._items);
-			let openX = event.clientX;
+			const openX = event.clientX;
 			let openY = event.clientY;
 			if (this._savedRange && !this._savedRange.collapsed) try {
 				const selRect = this._savedRange.getBoundingClientRect();
@@ -13382,9 +13761,9 @@
 			const h = this.el.offsetHeight;
 			let left = rx;
 			let top = ry;
-			if (left + w > window.innerWidth - 8) left = window.innerWidth - w - 8;
+			if (left + w > globalThis.innerWidth - 8) left = globalThis.innerWidth - w - 8;
 			if (left < 8) left = 8;
-			if (top + h > window.innerHeight - 8) top = window.innerHeight - h - 8;
+			if (top + h > globalThis.innerHeight - 8) top = globalThis.innerHeight - h - 8;
 			if (top < 8) top = 8;
 			this.el.style.left = `${left}px`;
 			this.el.style.top = `${top}px`;
@@ -13405,17 +13784,17 @@
 			let node = range.startContainer;
 			if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
 			if (!node) return type === "foreColor" ? "#000000" : "transparent";
-			const cs = window.getComputedStyle(node);
+			const cs = globalThis.getComputedStyle(node);
 			if (type === "foreColor") return cs.color || "#000000";
 			const bg = cs.backgroundColor;
 			return !bg || bg === "rgba(0, 0, 0, 0)" || bg === "transparent" ? "transparent" : bg;
 		}
 		/** Restore selection, apply a color command, then hide the menu. */
 		_applyColor(type, color) {
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (!editable || !this._savedRange) return;
 			editable.focus();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			sel.removeAllRanges();
 			sel.addRange(this._savedRange.cloneRange());
 			document.execCommand(type, false, color);
@@ -13430,15 +13809,15 @@
 		copyFormat() {
 			const range = this._savedRange;
 			if (!range) return;
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			let node = range.startContainer;
 			if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
 			if (!node || !editable || !editable.contains(node)) return;
-			const cs = window.getComputedStyle(node);
+			const cs = globalThis.getComputedStyle(node);
 			const explicitFontFamily = this._findExplicitStyle(node, editable, "fontFamily");
 			const explicitFontSize = this._findExplicitStyle(node, editable, "fontSize");
 			this._copiedFormat = {
-				bold: parseInt(cs.fontWeight, 10) >= 700,
+				bold: Number.parseInt(cs.fontWeight, 10) >= 700,
 				italic: cs.fontStyle === "italic" || cs.fontStyle === "oblique",
 				underline: (cs.textDecorationLine || "").includes("underline"),
 				strikethrough: (cs.textDecorationLine || "").includes("line-through"),
@@ -13469,10 +13848,10 @@
 		pasteFormat() {
 			if (!this._copiedFormat || !this._savedRange) return;
 			const fmt = this._copiedFormat;
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (!editable) return;
 			editable.focus();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			sel.removeAllRanges();
 			sel.addRange(this._savedRange.cloneRange());
 			document.execCommand("removeFormat");
@@ -13489,14 +13868,14 @@
 				const preExisting = new Set(editable.querySelectorAll("font[size=\"7\"]"));
 				document.execCommand("fontSize", false, "7");
 				editable.querySelectorAll("font[size=\"7\"]").forEach((el) => {
-					if (!preExisting.has(el)) el.setAttribute("data-an-tmp", marker);
+					if (!preExisting.has(el)) /** @type {HTMLElement} */ el.dataset.anTmp = marker;
 				});
 				editable.querySelectorAll(`[data-an-tmp="${marker}"]`).forEach((el) => {
 					const span = document.createElement("span");
 					span.style.fontSize = fmt.fontSize;
 					el.parentNode.insertBefore(span, el);
 					while (el.firstChild) span.appendChild(el.firstChild);
-					el.parentNode.removeChild(el);
+					el.remove();
 				});
 			}
 			this.context.invoke("editor.afterCommand");
@@ -13504,10 +13883,10 @@
 		/** Strip all inline formatting from the saved selection. */
 		removeFormat() {
 			if (!this._savedRange) return;
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (!editable) return;
 			editable.focus();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			sel.removeAllRanges();
 			sel.addRange(this._savedRange.cloneRange());
 			document.execCommand("removeFormat");
@@ -13519,7 +13898,7 @@
 			while (el = iter.nextNode()) {
 				if (!editable.contains(el) || el === editable) continue;
 				try {
-					if (range.intersectsNode(el)) el.removeAttribute("style");
+					if (range.intersectsNode(el)) /** @type {Element} */ el.removeAttribute("style");
 				} catch {}
 			}
 			this.context.invoke("editor.afterCommand");
@@ -13621,14 +14000,14 @@
 		destroy() {
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			this._dialog?.remove();
 			this._dialog = null;
 		}
 		show() {
 			if (this._dialog) {
 				this._dialog.style.display = "flex";
 				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._closeBtn && this._closeBtn.focus(), 50);
+				setTimeout(() => this._closeBtn?.focus(), 50);
 			}
 		}
 		_close() {
@@ -13734,7 +14113,7 @@
 			this._clearHighlights();
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.parentNode.removeChild(this._dialog);
+			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
 			this._dialog = null;
 		}
 		/**
@@ -13781,8 +14160,8 @@
 			const replaceActions = this._dialog.querySelector(".an-fr-replace-actions");
 			const title = this._dialog.querySelector(".an-dialog-title");
 			const isReplace = this._mode === "replace";
-			if (replaceRow) replaceRow.style.display = isReplace ? "" : "none";
-			if (replaceActions) replaceActions.style.display = isReplace ? "" : "none";
+			if (replaceRow) /** @type {HTMLElement} */ replaceRow.style.display = isReplace ? "" : "none";
+			if (replaceActions) /** @type {HTMLElement} */ replaceActions.style.display = isReplace ? "" : "none";
 			if (title) title.textContent = isReplace ? this.context.locale.findReplace.findReplaceTitle : this.context.locale.findReplace.findTitle;
 		}
 		_buildDialog() {
@@ -13793,106 +14172,123 @@
 				"aria-modal": "true",
 				"aria-label": L.findReplaceTitle
 			});
-			const box = createElement("div", { class: "an-dialog-box" });
-			const titleRow = createElement("div", { class: "an-icon-title-row" });
+			const box = createElement("div", { class: "an-dialog-box an-fr-box" });
+			const header = createElement("div", { class: "an-fr-header" });
+			const titleGroup = createElement("div", { class: "an-dialog-title-group" });
+			const iconEl = createElement("span", { class: "an-dialog-icon an-dialog-icon--sm" });
+			iconEl.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>`;
 			const title = createElement("h3", { class: "an-dialog-title" });
 			title.textContent = L.findTitle;
+			titleGroup.append(iconEl, title);
 			const closeBtn = createElement("button", {
 				type: "button",
 				class: "an-icon-close",
-				"aria-label": "Close"
+				title: L.close,
+				"aria-label": L.close
 			});
-			closeBtn.textContent = L.close;
+			closeBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>`;
 			this._closeBtn = closeBtn;
-			titleRow.append(title, closeBtn);
-			box.appendChild(titleRow);
-			const findRow = createElement("div", { class: "an-fr-find-row" });
+			header.append(titleGroup, closeBtn);
+			box.appendChild(header);
+			const searchBar = createElement("div", { class: "an-fr-search-bar" });
 			const findInput = createElement("input", {
 				type: "text",
-				class: "an-input",
+				class: "an-input an-fr-input",
 				placeholder: L.findPlaceholder,
 				"aria-label": L.searchAriaLabel
 			});
 			this._findInput = findInput;
-			findRow.appendChild(findInput);
-			box.appendChild(findRow);
-			const optRow = createElement("div", { class: "an-fr-options-row" });
-			const caseLabel = createElement("label", { class: "an-label an-label-inline" });
 			const caseCheckbox = createElement("input", {
 				type: "checkbox",
-				"aria-label": "Case sensitive"
+				style: "display:none",
+				"aria-hidden": "true"
 			});
 			this._caseCheckbox = caseCheckbox;
-			caseLabel.append(caseCheckbox, document.createTextNode(L.caseSensitive));
-			const counter = createElement("span", { class: "an-fr-counter" });
-			this._counterEl = counter;
-			optRow.append(caseLabel, counter);
-			box.appendChild(optRow);
-			const findActions = createElement("div", { class: "an-dialog-actions an-fr-find-actions" });
+			const caseBtn = createElement("button", {
+				type: "button",
+				class: "an-fr-icon-btn",
+				title: "Case sensitive",
+				"aria-label": "Case sensitive"
+			});
+			caseBtn.textContent = "Aa";
 			const prevBtn = createElement("button", {
 				type: "button",
-				class: "an-btn"
+				class: "an-fr-icon-btn",
+				title: "Previous (Shift+Enter)",
+				"aria-label": "Previous"
 			});
-			prevBtn.textContent = L.prevBtn;
+			prevBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>`;
 			const nextBtn = createElement("button", {
 				type: "button",
-				class: "an-btn an-btn-primary"
+				class: "an-fr-icon-btn",
+				title: "Next (Enter)",
+				"aria-label": "Next"
 			});
-			nextBtn.textContent = L.nextBtn;
-			findActions.append(prevBtn, nextBtn);
-			box.appendChild(findActions);
+			nextBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>`;
+			const counter = createElement("span", { class: "an-fr-counter" });
+			this._counterEl = counter;
+			searchBar.append(findInput, caseCheckbox, caseBtn, prevBtn, nextBtn, counter);
+			box.appendChild(searchBar);
 			const replaceRow = createElement("div", { class: "an-fr-replace-row" });
 			replaceRow.style.display = "none";
 			const replaceInput = createElement("input", {
 				type: "text",
-				class: "an-input",
+				class: "an-input an-fr-input",
 				placeholder: L.replacePlaceholder,
 				"aria-label": L.replaceAriaLabel
 			});
 			this._replaceInput = replaceInput;
-			replaceRow.appendChild(replaceInput);
-			box.appendChild(replaceRow);
-			const replaceActions = createElement("div", { class: "an-dialog-actions an-fr-replace-actions" });
-			replaceActions.style.display = "none";
 			const replaceBtn = createElement("button", {
 				type: "button",
-				class: "an-btn"
+				class: "an-btn an-fr-replace-btn"
 			});
 			replaceBtn.textContent = L.replaceBtn;
 			const replaceAllBtn = createElement("button", {
 				type: "button",
-				class: "an-btn an-btn-primary"
+				class: "an-btn an-btn-primary an-fr-replace-btn"
 			});
 			replaceAllBtn.textContent = L.replaceAllBtn;
-			replaceActions.append(replaceBtn, replaceAllBtn);
+			replaceRow.append(replaceInput, replaceBtn, replaceAllBtn);
+			box.appendChild(replaceRow);
+			const replaceActions = createElement("div", { class: "an-fr-replace-actions" });
+			replaceActions.style.display = "none";
 			box.appendChild(replaceActions);
 			overlay.appendChild(box);
+			makeDraggable(header, box);
 			const d1 = on(closeBtn, "click", () => this._close());
 			const d2 = on(overlay, "click", (e) => {
 				if (e.target === overlay) this._close();
 			});
 			const d3 = on(findInput, "input", () => this._onSearch());
-			const d4 = on(caseCheckbox, "change", () => {
+			const d4 = on(caseBtn, "click", () => {
+				this._caseSensitive = !this._caseSensitive;
+				caseCheckbox.checked = this._caseSensitive;
+				caseBtn.classList.toggle("an-fr-icon-btn--active", this._caseSensitive);
+				this._onSearch();
+			});
+			const d5 = on(caseCheckbox, "change", () => {
 				this._caseSensitive = caseCheckbox.checked;
+				caseBtn.classList.toggle("an-fr-icon-btn--active", this._caseSensitive);
 				this._onSearch();
 			});
-			const d5 = on(nextBtn, "click", () => this._next());
-			const d6 = on(prevBtn, "click", () => this._prev());
-			const d7 = on(replaceBtn, "click", () => this._replace());
-			const d8 = on(replaceAllBtn, "click", () => this._replaceAll());
-			const d9 = on(findInput, "keydown", (e) => {
-				if (e.key === "Enter") {
+			const d6 = on(nextBtn, "click", () => this._next());
+			const d7 = on(prevBtn, "click", () => this._prev());
+			const d8 = on(replaceBtn, "click", () => this._replace());
+			const d9 = on(replaceAllBtn, "click", () => this._replaceAll());
+			const d10 = on(findInput, "keydown", (e) => {
+				const ke = e;
+				if (ke.key === "Enter") {
 					e.preventDefault();
-					e.shiftKey ? this._prev() : this._next();
+					ke.shiftKey ? this._prev() : this._next();
 				}
 			});
-			const d10 = on(replaceInput, "keydown", (e) => {
+			const d11 = on(replaceInput, "keydown", (e) => {
 				if (e.key === "Enter") {
 					e.preventDefault();
 					this._replace();
 				}
 			});
-			this._disposers.push(d1, d2, d3, d4, d5, d6, d7, d8, d9, d10);
+			this._disposers.push(d1, d2, d3, d4, d5, d6, d7, d8, d9, d10, d11);
 			return overlay;
 		}
 		_onSearch() {
@@ -13960,15 +14356,19 @@
 			const re = this._queryRegex;
 			const MAX_RESULTS = 500;
 			const walker = document.createTreeWalker(root, 4);
-			let node;
-			while ((node = walker.nextNode()) && results.length < MAX_RESULTS) {
+			let node = walker.nextNode();
+			while (node && results.length < MAX_RESULTS) {
 				re.lastIndex = 0;
 				let m;
-				while ((m = re.exec(node.textContent)) !== null && results.length < MAX_RESULTS) results.push({
+				while ((m = re.exec(
+					/** @type {Text} */
+					node.textContent
+				)) !== null && results.length < MAX_RESULTS) results.push({
 					node,
 					start: m.index,
 					end: m.index + m[0].length
 				});
+				node = walker.nextNode();
 			}
 			return results;
 		}
@@ -14003,7 +14403,7 @@
 			const parent = match.mark.parentNode;
 			const textNode = document.createTextNode(replacement);
 			parent.insertBefore(textNode, match.mark);
-			parent.removeChild(match.mark);
+			match.mark.remove();
 			parent.normalize();
 			this.context.invoke("editor.afterCommand");
 			const savedIndex = this._currentIndex;
@@ -14021,7 +14421,7 @@
 				if (!mark || !mark.parentNode) return;
 				const textNode = document.createTextNode(replacement);
 				mark.parentNode.insertBefore(textNode, mark);
-				mark.parentNode.removeChild(mark);
+				mark.remove();
 			});
 			if (this.context.layoutInfo.editable) this.context.layoutInfo.editable.normalize();
 			this._matches = [];
@@ -14040,7 +14440,7 @@
 				const parent = mark.parentNode;
 				if (!parent) return;
 				while (mark.firstChild) parent.insertBefore(mark.firstChild, mark);
-				parent.removeChild(mark);
+				mark.remove();
 			});
 			editable.normalize();
 			this._matches = [];
@@ -14091,7 +14491,7 @@
 					resolve(null);
 				}
 			};
-			if (img.src.startsWith("data:") || img.src.startsWith("blob:") || img.src.startsWith(window.location.origin)) {
+			if (img.src.startsWith("data:") || img.src.startsWith("blob:") || img.src.startsWith(globalThis.location.origin)) {
 				tryDraw(img);
 				return;
 			}
@@ -14253,9 +14653,10 @@
 				}), on(h, "touchstart", (e) => {
 					e.preventDefault();
 					e.stopPropagation();
+					const te = e;
 					this._startHandleDrag({
-						clientX: e.touches[0].clientX,
-						clientY: e.touches[0].clientY
+						clientX: te.touches[0].clientX,
+						clientY: te.touches[0].clientY
 					}, id);
 				}, { passive: false }));
 				this._handles[id] = h;
@@ -14272,9 +14673,10 @@
 				if (e.target !== cropBox && e.target !== grid) return;
 				e.preventDefault();
 				e.stopPropagation();
+				const te2 = e;
 				this._startBoxMove({
-					clientX: e.touches[0].clientX,
-					clientY: e.touches[0].clientY
+					clientX: te2.touches[0].clientX,
+					clientY: te2.touches[0].clientY
 				});
 			}, { passive: false }));
 			const infoEl = document.createElement("div");
@@ -14347,8 +14749,8 @@
 			this._cropBox.style.top = `${y}px`;
 			this._cropBox.style.width = `${w}px`;
 			this._cropBox.style.height = `${h}px`;
-			const vw = window.innerWidth;
-			const vh = window.innerHeight;
+			const vw = globalThis.innerWidth;
+			const vh = globalThis.innerHeight;
 			this._scrim.style.clipPath = [
 				`polygon(`,
 				`0 0, ${vw}px 0, ${vw}px ${vh}px, 0 ${vh}px, 0 0,`,
@@ -14372,7 +14774,7 @@
 			}
 			const margin = 8;
 			let tbTop = y + h + margin;
-			if (tbTop + 40 > window.innerHeight - margin) tbTop = y - 40 - margin;
+			if (tbTop + 40 > globalThis.innerHeight - margin) tbTop = y - 40 - margin;
 			this._toolbar.style.left = `${x}px`;
 			this._toolbar.style.top = `${tbTop}px`;
 		}
@@ -14436,9 +14838,10 @@
 		_attachDocDrag(onMove) {
 			const onTouchMove = (e) => {
 				e.preventDefault();
+				const te3 = e;
 				onMove({
-					clientX: e.touches[0].clientX,
-					clientY: e.touches[0].clientY
+					clientX: te3.touches[0].clientX,
+					clientY: te3.touches[0].clientY
 				});
 			};
 			const cleanup = () => {
@@ -14498,7 +14901,7 @@
 				this._close(false);
 				return;
 			}
-			const fmt = img.src.match(/^data:image\/(jpe?g)/i) ? "image/jpeg" : "image/png";
+			const fmt = /^data:image\/(jpe?g)/i.exec(img.src) ? "image/jpeg" : "image/png";
 			const quality = fmt === "image/jpeg" ? .92 : void 0;
 			const newSrc = canvas.toDataURL(fmt, quality);
 			this._close(false);
@@ -14538,7 +14941,7 @@
 			banner.textContent = msg;
 			document.body.appendChild(banner);
 			setTimeout(() => {
-				if (banner.parentNode) banner.parentNode.removeChild(banner);
+				banner.remove();
 			}, 4e3);
 		}
 		/**
@@ -14553,7 +14956,7 @@
 				this._cropBox,
 				this._toolbar
 			].forEach((el) => {
-				if (el && el.parentNode) el.parentNode.removeChild(el);
+				el?.remove();
 			});
 			this._scrim = null;
 			this._cropBox = null;
@@ -14574,7 +14977,7 @@
 	*
 	* Activated when both `autoSave` and `autoSaveRestore` options are true.
 	* On initialize it checks localStorage for a draft that is within the
-	* `autoSaveRestoreTimeout` day window.  If one is found a dismissible banner
+	* `autoSaveRestoreTimeout` day globalThis.  If one is found a dismissible banner
 	* is prepended to the editor container.
 	*/
 	var AutoSaveRestore = class {
@@ -14660,7 +15063,7 @@
 			this._removeBanner();
 		}
 		_removeBanner() {
-			if (this._banner && this._banner.parentNode) this._banner.parentNode.removeChild(this._banner);
+			this._banner?.remove();
 			this._banner = null;
 		}
 	};
@@ -14723,8 +15126,8 @@
 		* @returns {{ text: string, range: Range, lineNode: Node } | null}
 		*/
 		_getLineContext() {
-			const sel = window.getSelection();
-			if (!sel || !sel.rangeCount) return null;
+			const sel = globalThis.getSelection();
+			if (!sel?.rangeCount) return null;
 			const range = sel.getRangeAt(0);
 			if (!range.collapsed) return null;
 			const editable = this.context.layoutInfo.editable;
@@ -14743,7 +15146,7 @@
 		}
 		_isBlock(node) {
 			if (node.nodeType !== Node.ELEMENT_NODE) return false;
-			const display = window.getComputedStyle(node).display;
+			const display = globalThis.getComputedStyle(node).display;
 			return display === "block" || display === "list-item" || display === "table-cell";
 		}
 		/** Applies block rule on Space key. Returns true if a rule fired. */
@@ -14774,7 +15177,7 @@
 				}
 			];
 			for (const { re, handler } of blockPatterns) {
-				const m = text.match(re);
+				const m = re.exec(text);
 				if (m) {
 					handler(m);
 					return true;
@@ -14798,8 +15201,8 @@
 			return false;
 		}
 		_selectLineAndDelete() {
-			const sel = window.getSelection();
-			if (!sel || !sel.rangeCount) return;
+			const sel = globalThis.getSelection();
+			if (!sel?.rangeCount) return;
 			const range = sel.getRangeAt(0);
 			const startRange = document.createRange();
 			startRange.setStart(range.startContainer.parentNode || range.startContainer, 0);
@@ -14837,8 +15240,8 @@
 			this.context.triggerEvent("change", this.context.getHTML());
 		}
 		_onInput() {
-			const sel = window.getSelection();
-			if (!sel || !sel.rangeCount) return;
+			const sel = globalThis.getSelection();
+			if (!sel?.rangeCount) return;
 			const range = sel.getRangeAt(0);
 			if (!range.collapsed) return;
 			if (!this.context.layoutInfo.editable.contains(range.startContainer)) return;
@@ -14866,7 +15269,7 @@
 			];
 			const upToCursor = text.slice(0, offset);
 			for (const { re, tag } of inlineRules) {
-				const m = upToCursor.match(re);
+				const m = re.exec(upToCursor);
 				if (!m) continue;
 				const matchStart = upToCursor.length - m[0].length;
 				const matchEnd = offset;
@@ -14877,11 +15280,8 @@
 				el.textContent = innerText;
 				const beforeNode = document.createTextNode(before);
 				const afterNode = document.createTextNode("​" + after);
-				const parent = node.parentNode;
-				parent.insertBefore(beforeNode, node);
-				parent.insertBefore(el, node);
-				parent.insertBefore(afterNode, node);
-				parent.removeChild(node);
+				/** @type {ChildNode} */ node.before(beforeNode, el, afterNode);
+				/** @type {ChildNode} */ node.remove();
 				const newRange = document.createRange();
 				newRange.setStart(afterNode, 1);
 				newRange.collapse(true);
@@ -14952,12 +15352,12 @@
 		strikethrough: (ctx) => ctx.invoke("editor.strikethrough"),
 		link: (ctx) => ctx.invoke("linkDialog.show"),
 		removeFormat: (ctx) => {
-			const editable = ctx.layoutInfo && ctx.layoutInfo.editable;
+			const editable = ctx.layoutInfo?.editable;
 			if (!editable) return;
 			editable.focus();
 			document.execCommand("removeFormat");
-			const sel = window.getSelection();
-			if (sel && sel.rangeCount > 0 && !sel.getRangeAt(0).collapsed) {
+			const sel = globalThis.getSelection();
+			if (sel?.rangeCount > 0 && !sel.getRangeAt(0).collapsed) {
 				const range = sel.getRangeAt(0);
 				const ancestor = range.commonAncestorContainer;
 				const root = ancestor.nodeType === 1 ? ancestor : ancestor.parentElement;
@@ -15015,13 +15415,15 @@
 			const d6 = this.context.on("contextMenu:hide", () => {
 				this._contextMenuOpen = false;
 			});
-			this._disposers.push(d1, d2, d3, d4, d5, d6);
+			const d7 = on(globalThis, "scroll", () => this._hide(), { passive: true });
+			const d8 = on(globalThis, "resize", () => this._hide(), { passive: true });
+			this._disposers.push(d1, d2, d3, d4, d5, d6, d7, d8);
 			return this;
 		}
 		destroy() {
-			if (this._el && this._el.parentNode) this._el.parentNode.removeChild(this._el);
+			this._el?.remove();
 			this._el = null;
-			if (this._picker && this._picker.parentNode) this._picker.parentNode.removeChild(this._picker);
+			this._picker?.remove();
 			this._picker = null;
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
@@ -15129,20 +15531,22 @@
 			picker.appendChild(customRow);
 			document.body.appendChild(picker);
 			this._picker = picker;
-			this._picker._paletteEl = palette;
-			this._picker._noColorBtn = noColorBtn;
-			this._picker._colorInput = colorInput;
+			const pickerAny = picker;
+			pickerAny._paletteEl = palette;
+			pickerAny._noColorBtn = noColorBtn;
+			pickerAny._colorInput = colorInput;
 		}
 		_openColorPicker(type, anchorBtn) {
-			const sel = window.getSelection();
-			if (sel && sel.rangeCount > 0) this._savedRange = sel.getRangeAt(0).cloneRange();
+			const sel = globalThis.getSelection();
+			if (sel?.rangeCount > 0) this._savedRange = sel.getRangeAt(0).cloneRange();
 			this._pickerType = type;
-			const palette = this._picker._paletteEl;
-			const noColorBtn = this._picker._noColorBtn;
+			const pickerAny = this._picker;
+			const palette = pickerAny._paletteEl;
+			const noColorBtn = pickerAny._noColorBtn;
 			if (type === "hiliteColor") {
 				if (!palette.contains(noColorBtn)) palette.appendChild(noColorBtn);
-			} else if (palette.contains(noColorBtn)) palette.removeChild(noColorBtn);
-			this._picker._colorInput.value = type === "foreColor" ? "#000000" : "#ffff00";
+			} else if (palette.contains(noColorBtn)) noColorBtn.remove();
+			/** @type {any} */ this._picker._colorInput.value = type === "foreColor" ? "#000000" : "#ffff00";
 			this._picker.style.display = "block";
 			const pw = this._picker.offsetWidth;
 			const ph = this._picker.offsetHeight;
@@ -15150,7 +15554,7 @@
 			let top = toolbarRect.top - ph - 6;
 			if (top < 8) top = toolbarRect.bottom + 6;
 			let left = anchorBtn.getBoundingClientRect().left;
-			left = Math.max(8, Math.min(left, window.innerWidth - pw - 8));
+			left = Math.max(8, Math.min(left, globalThis.innerWidth - pw - 8));
 			this._picker.style.left = `${left}px`;
 			this._picker.style.top = `${top}px`;
 		}
@@ -15160,10 +15564,10 @@
 		}
 		/** Restore the saved selection, apply execCommand, update the color strip, then close the picker. */
 		_applyColor(type, color) {
-			const editable = this.context.layoutInfo && this.context.layoutInfo.editable;
+			const editable = this.context.layoutInfo?.editable;
 			if (!editable || !this._savedRange) return;
 			editable.focus();
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			sel.removeAllRanges();
 			try {
 				sel.addRange(this._savedRange.cloneRange());
@@ -15174,9 +15578,8 @@
 			if (!document.execCommand(cmd, false, color) && cmd === "hiliteColor") document.execCommand("backColor", false, color);
 			this.context.invoke("editor.afterCommand");
 			const name = type === "hiliteColor" ? "hiliteColor" : "foreColor";
-			const btn = this._el && this._el.querySelector(`[data-name="${name}"]`);
-			const strip = btn && btn.querySelector(".an-bubble-color-strip");
-			if (strip) strip.style.background = color === "transparent" ? "transparent" : color;
+			const strip = (this._el?.querySelector(`[data-name="${name}"]`))?.querySelector(".an-bubble-color-strip");
+			if (strip) /** @type {HTMLElement} */ strip.style.background = color === "transparent" ? "transparent" : color;
 			this._closeColorPicker();
 			this._syncActive();
 		}
@@ -15190,8 +15593,16 @@
 			const gap = 8;
 			let left = rect.left + rect.width / 2 - bw / 2;
 			let top = rect.top - bh - gap;
-			left = Math.max(8, Math.min(left, window.innerWidth - bw - 8));
+			left = Math.max(8, Math.min(left, globalThis.innerWidth - bw - 8));
 			if (top < 8) top = rect.bottom + gap;
+			const tableTooltipEl = document.querySelector(".an-table-tooltip");
+			if (tableTooltipEl && tableTooltipEl.style.display !== "none") {
+				const ttRect = tableTooltipEl.getBoundingClientRect();
+				if (top < ttRect.bottom + gap && top + bh > ttRect.top - gap) {
+					top = rect.bottom + gap;
+					if (top + bh > globalThis.innerHeight - 8) top = ttRect.bottom + gap;
+				}
+			}
 			el.style.top = `${top}px`;
 			el.style.left = `${left}px`;
 			el.style.visibility = "";
@@ -15215,20 +15626,18 @@
 		/** Read the current selection's color and update the color-strip indicators. */
 		_syncColorStrips() {
 			if (!this._el) return;
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || !sel.rangeCount) return;
 			let node = sel.getRangeAt(0).startContainer;
 			if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
 			if (!node) return;
-			const cs = window.getComputedStyle(node);
-			const foreBtn = this._el.querySelector("[data-name=\"foreColor\"]");
-			const foreStrip = foreBtn && foreBtn.querySelector(".an-bubble-color-strip");
-			if (foreStrip) foreStrip.style.background = cs.color || "#000000";
-			const hiliteBtn = this._el.querySelector("[data-name=\"hiliteColor\"]");
-			const hiliteStrip = hiliteBtn && hiliteBtn.querySelector(".an-bubble-color-strip");
+			const cs = globalThis.getComputedStyle(node);
+			const foreStrip = this._el.querySelector("[data-name=\"foreColor\"]")?.querySelector(".an-bubble-color-strip");
+			if (foreStrip) /** @type {HTMLElement} */ foreStrip.style.background = cs.color || "#000000";
+			const hiliteStrip = this._el.querySelector("[data-name=\"hiliteColor\"]")?.querySelector(".an-bubble-color-strip");
 			if (hiliteStrip) {
 				const bg = cs.backgroundColor;
-				hiliteStrip.style.background = !bg || bg === "rgba(0, 0, 0, 0)" || bg === "transparent" ? "transparent" : bg;
+				/** @type {HTMLElement} */ hiliteStrip.style.background = !bg || bg === "rgba(0, 0, 0, 0)" || bg === "transparent" ? "transparent" : bg;
 			}
 		}
 		_onSelectionChange() {
@@ -15236,7 +15645,7 @@
 			this._rafId = requestAnimationFrame(() => {
 				if (this._contextMenuOpen) return;
 				if (this._picker && this._picker.style.display !== "none") return;
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				if (!sel || sel.isCollapsed || !sel.rangeCount) {
 					this._hide();
 					return;
@@ -15259,8 +15668,8 @@
 		}
 		_onMousedown(e) {
 			if (!this._visible) return;
-			if (this._el && this._el.contains(e.target)) return;
-			if (this._picker && this._picker.contains(e.target)) return;
+			if (this._el?.contains(e.target)) return;
+			if (this._picker?.contains(e.target)) return;
 			if (this.context.layoutInfo.editable.contains(e.target)) return;
 			this._hide();
 		}
@@ -15345,7 +15754,7 @@
 		}
 		destroy() {
 			clearTimeout(this._debounceTimer);
-			if (this._dropdown && this._dropdown.parentNode) this._dropdown.parentNode.removeChild(this._dropdown);
+			this._dropdown?.remove();
 			this._dropdown = null;
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
@@ -15356,11 +15765,11 @@
 			el.setAttribute("role", "listbox");
 			el.addEventListener("mousedown", (e) => e.preventDefault());
 			el.addEventListener("click", (e) => {
-				const item = e.target.closest(".an-mention-item");
+				const item = e.target?.closest(".an-mention-item");
 				if (item) this._select(+item.dataset.index);
 			});
 			el.addEventListener("mousemove", (e) => {
-				const item = e.target.closest(".an-mention-item");
+				const item = e.target?.closest(".an-mention-item");
 				if (item) this._highlightItem(+item.dataset.index);
 			});
 			document.body.appendChild(el);
@@ -15375,7 +15784,7 @@
 				const li = document.createElement("div");
 				li.className = "an-mention-item";
 				li.setAttribute("role", "option");
-				li.dataset.index = i;
+				li.dataset.index = String(i);
 				if (item.avatar) {
 					const img = document.createElement("img");
 					img.src = item.avatar;
@@ -15409,8 +15818,8 @@
 			const ddw = dd.offsetWidth;
 			let top = rect.bottom + 4;
 			let left = rect.left;
-			if (rect.bottom + ddh + 8 > window.innerHeight) top = rect.top - ddh - 4;
-			left = Math.max(8, Math.min(left, window.innerWidth - ddw - 8));
+			if (rect.bottom + ddh + 8 > globalThis.innerHeight) top = rect.top - ddh - 4;
+			left = Math.max(8, Math.min(left, globalThis.innerWidth - ddw - 8));
 			dd.style.top = `${top}px`;
 			dd.style.left = `${left}px`;
 			dd.style.visibility = "";
@@ -15434,7 +15843,7 @@
 		* collapsed range is reliable at this point but often empty inside async callbacks.
 		*/
 		_captureCaretRect() {
-			if (this._triggerNode && this._triggerNode.isConnected) try {
+			if (this._triggerNode?.isConnected) try {
 				const r = document.createRange();
 				const end = Math.min(this._triggerOffset + 1, this._triggerNode.textContent.length);
 				r.setStart(this._triggerNode, this._triggerOffset);
@@ -15445,13 +15854,13 @@
 					return;
 				}
 			} catch (_) {}
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || !sel.rangeCount) return;
 			const rects = sel.getRangeAt(0).getClientRects();
 			if (rects.length > 0) this._caretRect = rects[rects.length - 1];
 		}
 		_getQueryAtCursor() {
-			const sel = window.getSelection();
+			const sel = globalThis.getSelection();
 			if (!sel || !sel.rangeCount) return null;
 			const range = sel.getRangeAt(0);
 			if (!range.collapsed) return null;
@@ -15508,7 +15917,7 @@
 		}
 		_onDocClick(e) {
 			if (!this._open) return;
-			if (this._dropdown && this._dropdown.contains(e.target)) return;
+			if (this._dropdown?.contains(e.target)) return;
 			this._hideDropdown();
 		}
 		_select(index) {
@@ -15517,7 +15926,7 @@
 			if (this._triggerNode) {
 				const node = this._triggerNode;
 				node.textContent = node.textContent.slice(0, this._triggerOffset) + node.textContent.slice(this._triggerOffset + this._cfg.trigger.length + this._query.length);
-				const sel = window.getSelection();
+				const sel = globalThis.getSelection();
 				const range = document.createRange();
 				range.setStart(node, this._triggerOffset);
 				range.collapse(true);
@@ -15625,7 +16034,7 @@
 		/**
 		* Registers and initialises a custom module on this instance.
 		* @param {string} name
-		* @param {Function} ModuleClass
+		* @param {new (ctx: this) => any} ModuleClass
 		* @returns {this}
 		*/
 		registerModule(name, ModuleClass) {
@@ -15878,23 +16287,27 @@
 			a.style.display = "none";
 			document.body.appendChild(a);
 			a.click();
-			document.body.removeChild(a);
+			a.remove();
 			URL.revokeObjectURL(url);
 		}
 		/**
-		* Opens the editor content in a new window and triggers the browser print dialog.
+		* Opens the editor content in a new globalThis and triggers the browser print dialog.
 		* @param {string} [title='']
 		*/
 		print(title = "") {
 			const content = this.getHTML();
-			const safeTitle = (title || "").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-			const w = window.open("", "_blank");
-			if (!w) return;
-			w.document.write(`<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>${safeTitle}</title><style>body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;line-height:1.6;padding:20mm;color:#111827;}ul.an-checklist{list-style:none;padding-left:0;}ul.an-checklist li{padding-left:24px;position:relative;margin:2px 0;}ul.an-checklist li input[type="checkbox"]{position:absolute;left:0;top:3px;}code{background:#f3f4f6;border-radius:3px;padding:.1em .35em;font-family:monospace;}pre{background:#f3f4f6;padding:.75em 1em;border-radius:4px;overflow-x:auto;}table{border-collapse:collapse;}td,th{border:1px solid #d1d5db;padding:4px 8px;}</style></head><body>${content}</body></html>`);
-			w.document.close();
-			w.onload = () => {
+			const markup = `<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>${(title || "").replace(/[<>&"']/g, (c) => `&#${c.charCodeAt(0)};`)}</title><style>body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;line-height:1.6;padding:20mm;color:#111827;}ul.an-checklist{list-style:none;padding-left:0;}ul.an-checklist li{padding-left:24px;position:relative;margin:2px 0;}ul.an-checklist li input[type="checkbox"]{position:absolute;left:0;top:3px;}code{background:#f3f4f6;border-radius:3px;padding:.1em .35em;font-family:monospace;}pre{background:#f3f4f6;padding:.75em 1em;border-radius:4px;overflow-x:auto;}table{border-collapse:collapse;}td,th{border:1px solid #d1d5db;padding:4px 8px;}</style></head><body>${content}</body></html>`;
+			const blob = new Blob([markup], { type: "text/html" });
+			const url = URL.createObjectURL(blob);
+			const w = globalThis.open(url, "_blank");
+			if (!w) {
+				URL.revokeObjectURL(url);
+				return;
+			}
+			w.addEventListener("load", () => {
 				w.print();
-			};
+				URL.revokeObjectURL(url);
+			});
 		}
 		/**
 		* Sets whether the editor is disabled (readonly).
@@ -15932,10 +16345,12 @@
 			this._disposers.forEach((d) => d());
 			this._disposers = [];
 			const container = this.layoutInfo.container;
-			if (container && container.parentNode) {
+			const wasDark = container?.classList.contains("an-theme-dark");
+			if (container?.parentNode) {
 				this.targetEl.style.display = "";
-				container.parentNode.removeChild(container);
+				container.remove();
 			}
+			if (wasDark && !document.querySelector(".an-container.an-theme-dark")) document.body.classList.remove("an-theme-dark");
 			if (typeof this.options.onDestroy === "function") this.options.onDestroy(this);
 			this._alive = false;
 			this._listeners.clear();
@@ -15944,7 +16359,8 @@
 		* Syncs editor HTML back into the original textarea/input for form submission.
 		*/
 		_syncToTarget() {
-			if (this.targetEl.tagName === "TEXTAREA" || this.targetEl.tagName === "INPUT") this.targetEl.value = this.getHTML();
+			if (this.targetEl.tagName === "TEXTAREA" || this.targetEl.tagName === "INPUT")
+ /** @type {HTMLInputElement} */ this.targetEl.value = this.getHTML();
 		}
 	};
 	//#endregion
@@ -15954,7 +16370,7 @@
 	* Inspired by Summernote's env.js
 	*/
 	var userAgent = navigator.userAgent;
-	/Chrome\//.test(userAgent), /Firefox\//.test(userAgent), /^((?!chrome|android).)*safari/i.test(userAgent), /Edg\//.test(userAgent), /Macintosh/.test(userAgent), /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent), "ontouchstart" in window || navigator.maxTouchPoints, /Macintosh/.test(userAgent);
+	/Chrome\//.test(userAgent), /Firefox\//.test(userAgent), /^((?!chrome|android).)*safari/i.test(userAgent), /Edg\//.test(userAgent), /Macintosh/.test(userAgent), /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent), "ontouchstart" in globalThis || navigator.maxTouchPoints, /Macintosh/.test(userAgent);
 	//#endregion
 	//#region src/js/index.js
 	var _originalDefaults = { ...defaultOptions };