dsh-plugin-lookatstudy 0.22.1 → 0.22.2

package/lib/client.js

@@ -391,6 +391,14 @@ window.__ModuleLoader__.load({
 .lks-ui .lks14-emptycard-hint{font-size:.825rem;color:var(--ink-muted);line-height:1.6}
 /* B5: notebook tab capsule + 960px reading column */
 .lks-ui .lks14-notebody{margin:0 auto;max-width:960px;width:100%;padding:12px 20px 24px;box-sizing:border-box}
+/* #10-followup: the reading column is height:auto (the note col scrolls), so
+   .lks14-board's height:100% resolved against a content-sized parent and the
+   stage collapsed to a ~90px sliver — the never-upscale contain fit then
+   scaled tall artifacts to tens of px. On the board tab the body fills the
+   col instead (a flex column); the notes/cmap tabs keep the scrolling
+   reading column. */
+.lks-ui .lks14-notebody.lks14-notebody-fill{display:flex;flex-direction:column;flex:1 1 0;min-height:0;max-width:none;padding-bottom:8px}
+.lks-ui .lks14-notebody-fill .lks14-board{flex:1 1 0}
 .lks-ui .lks14-viewtabs{background:var(--surface-2);border-radius:10px;padding:3px;align-self:flex-start}
 .lks-ui .lks14-readbar{position:sticky;top:0;z-index:20;background:var(--surface-2);border-radius:10px}
 
@@ -484,8 +492,12 @@ window.__ModuleLoader__.load({
 .lks-ui .lks14-board-artifact{padding:20px;width:fit-content;max-width:1200px}
 /* issue #10: the board stage handles oversize via zoom — the table lays out
    normally inside a bounded card (display:block + overflow was made for the
-   narrow chat column; on the canvas it broke cells into overlap) */
-.lks-ui .lks14-board-artifact .lks-acard-table{display:table;width:100%;max-width:100%;overflow:visible}
+   narrow chat column; on the canvas it broke cells into overlap).
+   #10-followup: width:100% made the table's width depend on the fit-content
+   wrapper WHILE the wrapper's width depended on the table — a circular
+   dependency that collapsed to near-zero in the wild; width:auto lets both
+   resolve from content (the wrapper hugs the table's max-content). */
+.lks-ui .lks14-board-artifact .lks-acard-table{display:table;width:auto;max-width:100%;overflow:visible}
 .lks-ui .lks14-board-artifact .lks-acard{min-width:560px;background:var(--surface-0);border:1px solid var(--border-faint);border-radius:14px}
 .lks-ui .lks14-cmapwrap{position:relative}
 .lks-ui .lks14-cmap-expand{position:absolute;top:10px;right:10px;z-index:5}
@@ -1689,8 +1701,16 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		*/
 		/** Poll cadence for the shared store; one cycle serves every mounted seat. */
 		const POLL_MS = 3e3;
+		/** Sentinel for 304 responses (the state poll's ETag path): keep the snapshot. */
+		const NOT_MODIFIED = Symbol("not-modified");
 		async function fetchJson(url, init) {
-			const res = await fetch(url, init);
+			const headers = new Headers(init?.headers);
+			headers.set("x-lks-request", "1");
+			const res = await fetch(url, {
+				...init,
+				headers
+			});
+			if (res.status === 304) return NOT_MODIFIED;
 			const body = await res.json().catch(() => null);
 			if (!res.ok) {
 				const error = body !== null && typeof body === "object" && "error" in body && typeof body.error === "string" ? body.error : `HTTP ${res.status}`;
@@ -1728,8 +1748,10 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				this.inflight = true;
 				try {
 					const next = await fetchJson("/lookatstudy/api/state");
-					this.snapshot = next;
-					this.emit();
+					if (next !== NOT_MODIFIED) {
+						this.snapshot = next;
+						this.emit();
+					}
 				} catch {} finally {
 					this.inflight = false;
 				}
@@ -1968,7 +1990,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				const bin = atob(raw);
 				const bytes = new Uint8Array(bin.length);
 				for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
-				return bytes.buffer;
+				return bytes;
 			}
 		};
 		/** The voices the dashboard route accepts (same allowlist server-side). */
@@ -2028,6 +2050,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				uploadAttachment: studyStore.uploadAttachment.bind(studyStore),
 				setFocus: studyStore.setFocus.bind(studyStore),
 				searchLessons: studyStore.searchLessons.bind(studyStore),
+				tts: studyStore.tts.bind(studyStore),
 				deleteCourse: studyStore.deleteCourse.bind(studyStore),
 				deleteNote: studyStore.deleteNote.bind(studyStore),
 				editNote: studyStore.editNote.bind(studyStore),
@@ -2086,7 +2109,6 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"quiz.right": "答对了",
 			"quiz.wrong": "答错了",
 			"quiz.youChose": "你选了",
-			"quiz.answer": "正确答案",
 			"quiz.hook": "练习卡完成：{correct}/{total} 正确。请简短点评，针对错题讲讲思路。",
 			"quiz.action.explain-wrong": "讲讲错题",
 			"quiz.action.retry": "再来一组",
@@ -2122,8 +2144,6 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"review.nudge.go": "去复习",
 			"rail.search.jump": "打开这一课",
 			"proposal.banner": "《{lesson}》可以提前毕业了",
-			"proposal.accept": "接受",
-			"proposal.decline": "再练练",
 			"proposal.accept.msg": "我接受《{lesson}》的掌握度提议，帮我标记为掌握。",
 			"proposal.decline.msg": "《{lesson}》我先再练练，暂不接受提前毕业。",
 			"tutor.thinking": "导师思考中…",
@@ -2404,7 +2424,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"exam.leave.message": "考试进行中——现在离开,未答的题将按错计分。",
 			"exam.leave.confirm": "离开并结算",
 			"exam.leave.cancel": "继续答题",
-			"prompt.exam.bank": "请为「{section}」的章节测验出题:先用 study_view 读一遍本节课时,再按各课时的知识点用 study_exam_bank_apply 一次性提交整份题库(单选 5-15 题,kcTitle 必须用本节的概念标题,每题附一句话解析)。题库就绪后告诉我可以开考。",
+			"prompt.exam.bank": "请为「{section}」的章节测验出题:先用 study_lesson 读一遍本节课时,再按各课时的知识点用 study_exam_bank_apply 一次性提交整份题库(单选 5-15 题,kcTitle 必须用本节的概念标题,每题附一句话解析)。题库就绪后告诉我可以开考。",
 			"prompt.review": "开始今天的复习,从最到期的课时开始",
 			"prompt.proposal.accept": "接受提案 {id} —— 确认标记这课为已掌握",
 			"prompt.proposal.decline": "拒绝提案 {id} —— 我想再练练"
@@ -2449,7 +2469,6 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"quiz.right": "Correct",
 			"quiz.wrong": "Wrong",
 			"quiz.youChose": "You chose",
-			"quiz.answer": "Answer",
 			"quiz.hook": "Practice card finished: {correct}/{total} correct. Please comment briefly and walk through the wrong ones.",
 			"quiz.action.explain-wrong": "Explain my wrong answers",
 			"quiz.action.retry": "Another set",
@@ -2485,8 +2504,6 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"review.nudge.go": "Review now",
 			"rail.search.jump": "Open this lesson",
 			"proposal.banner": "{lesson} is ready to graduate early",
-			"proposal.accept": "Accept",
-			"proposal.decline": "Keep practicing",
 			"proposal.accept.msg": "I accept the mastery proposal for \"{lesson}\" — mark it mastered.",
 			"proposal.decline.msg": "I want more practice on \"{lesson}\" before graduating.",
 			"tutor.thinking": "The tutor is thinking…",
@@ -2767,7 +2784,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			"exam.leave.message": "The exam is in progress — leaving now counts unanswered questions as wrong.",
 			"exam.leave.confirm": "Leave & settle",
 			"exam.leave.cancel": "Keep answering",
-			"prompt.exam.bank": "Author the section exam bank for \"{section}\": read this section's lessons with study_view, then submit the full multiple-choice set in one study_exam_bank_apply call (5-15 single-choice questions, kcTitle must be one of the section's concept titles, one-line explanation each). Tell me when the bank is ready.",
+			"prompt.exam.bank": "Author the section exam bank for \"{section}\": read this section's lessons with study_lesson, then submit the full multiple-choice set in one study_exam_bank_apply call (5-15 single-choice questions, kcTitle must be one of the section's concept titles, one-line explanation each). Tell me when the bank is ready.",
 			"prompt.review": "Start today's review, from the most overdue lesson first",
 			"prompt.proposal.accept": "Accept proposal {id} — confirm marking this lesson as mastered",
 			"prompt.proposal.decline": "Reject proposal {id} — I want to practice more"
@@ -3076,6 +3093,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		//#endregion
 		//#region src/client/enhance.ts
 		var enhance_exports = /* @__PURE__ */ __exportAll({
+			KATEX_SRI: () => KATEX_SRI,
+			MERMAID_SECURITY_LEVEL: () => MERMAID_SECURITY_LEVEL,
 			attachCodeHeader: () => attachCodeHeader,
 			enhanceCode: () => enhanceCode,
 			enhanceDiagrams: () => enhanceDiagrams,
@@ -3127,10 +3146,14 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			mermaid: "https://esm.sh/mermaid@11.4.1",
 			mermaidElk: "https://esm.sh/@mermaid-js/layout-elk@0.1.7"
 		};
-		function loadScript(src) {
+		function loadScript(src, integrity) {
 			return new Promise((resolve, reject) => {
 				const el = document.createElement("script");
 				el.src = src;
+				if (integrity !== void 0) {
+					el.integrity = integrity;
+					el.crossOrigin = "anonymous";
+				}
 				el.onload = () => {
 					resolve();
 				};
@@ -3140,6 +3163,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				document.head.append(el);
 			});
 		}
+		/** Audit D32: SRI pin for the KaTeX CDN script (0.16.22, sha384 over the exact bytes). */
+		const KATEX_SRI = "sha384-cMkvdD8LoxVzGF/RPUKAcvmm49FQ0oxwDF3BGKtDXcEc+T1b2N+teh/OJfpU0jr6";
 		let katexPromise = null;
 		function defaultLoadKatex() {
 			katexPromise ??= (async () => {
@@ -3150,7 +3175,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 					link.setAttribute("data-lks-katex", "1");
 					document.head.append(link);
 				}
-				if (window.katex === void 0) await loadScript(CDN.katexJs);
+				if (window.katex === void 0) await loadScript(CDN.katexJs, KATEX_SRI);
 				const katex = window.katex;
 				if (katex === void 0) throw new Error("katex missing after load");
 				return katex;
@@ -3239,6 +3264,13 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				noteTextColor: read("--ink-rgb", "rgb(245 245 250)")
 			};
 		}
+		/**
+		* Audit A1 (2026-09-14): diagram sources arrive from imported (untrusted)
+		* content — mermaid must run under 'strict'. 'loose' skips DOMPurify label
+		* sanitization and enables click callbacks, which turns a hostile repo
+		* README into stored XSS in the host page. Exported so the gate is testable.
+		*/
+		const MERMAID_SECURITY_LEVEL = "strict";
 		function defaultLoadMermaid() {
 			mermaidPromise ??= (async () => {
 				const mermaid = (await import(
@@ -3255,7 +3287,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				mermaid.initialize({
 					startOnLoad: false,
 					theme: "base",
-					securityLevel: "loose",
+					securityLevel: MERMAID_SECURITY_LEVEL,
 					themeVariables: mermaidThemeVariables()
 				});
 				return mermaid;
@@ -3267,19 +3299,14 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			const display = /\$\$([^$]+)\$\$/.exec(text);
 			const inline = /\$([^$\n]+)\$/.exec(text);
 			if (display === null && inline === null) return null;
-			const m = display !== null && (inline === null || display.index <= inline.index) ? {
-				...display,
-				display: true
-			} : inline === null ? null : {
-				...inline,
-				display: false
-			};
+			const useDisplay = display !== null && (inline === null || display.index <= inline.index);
+			const m = useDisplay ? display : inline;
 			if (m === null) return null;
 			return {
 				before: text.slice(0, m.index),
 				tex: m[1],
 				after: text.slice(m.index + m[0].length),
-				display: m.display
+				display: useDisplay
 			};
 		}
 		/** KaTeX every $..$ / $$..$$ in the container; degrades to plain text on any failure. */
@@ -3294,7 +3321,10 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			const walker = document.createTreeWalker(container, NodeFilter.SHOW_TEXT);
 			const targets = [];
 			let node;
-			while ((node = walker.nextNode()) !== null) if (findMathSpan(node.data) !== null && node.parentElement?.tagName !== "CODE") targets.push(node);
+			while ((node = walker.nextNode()) !== null) {
+				const parent = node.parentElement;
+				if (findMathSpan(node.data) !== null && parent?.tagName !== "CODE" && parent?.closest(".lks-shiki, .lks-mermaid") === null) targets.push(node);
+			}
 			for (const t of targets) {
 				let guard = 0;
 				while (guard++ < 200) {
@@ -3474,7 +3504,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		* no zoom; this is the one place our port must normalize).
 		*/
 		function panelZoomOf(el) {
-			const z = el?.closest(".lks14")?.style.zoom;
+			const z = (el?.closest(".lks14"))?.style.zoom;
 			const n = z === void 0 || z === "" ? NaN : Number(z);
 			return Number.isFinite(n) && n > 0 ? n : 1;
 		}
@@ -3631,25 +3661,21 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			for (const line of text.split("\n")) {
 				const plain = /^([A-D])[.、:)]\s*(.+)$/.exec(line.trim());
 				const table = /^\|\s*\*{0,2}([A-D])\*{0,2}\s*\|\s*(.+?)\s*\|$/.exec(line.trim());
-				const match = plain ?? (table !== null ? [
-					table[0],
-					table[1],
-					table[2].replaceAll("**", "").replaceAll("`", "")
-				] : null);
+				const match = plain !== null ? [plain[1], plain[2]] : table !== null ? [table[1], table[2].replaceAll("**", "").replaceAll("`", "")] : null;
 				if (match === null) {
 					flush();
 					continue;
 				}
 				const nextLetter = run.length === 0 ? "A" : String.fromCharCode(run[run.length - 1].letter.charCodeAt(0) + 1);
-				if (match[1] === nextLetter) run.push({
-					letter: match[1],
-					text: match[2]
+				if (match[0] === nextLetter) run.push({
+					letter: match[0],
+					text: match[1]
 				});
 				else {
 					flush();
-					if (match[1] === "A") run.push({
-						letter: match[1],
-						text: match[2]
+					if (match[0] === "A") run.push({
+						letter: match[0],
+						text: match[1]
 					});
 				}
 			}
@@ -3794,16 +3820,22 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		*/
 		function ctxSegments(pct, breakdown) {
 			if (pct <= 0) return [];
-			const total = breakdown === null ? 0 : breakdown.systemTokens + breakdown.toolsTokens + breakdown.messageTokens;
+			if (breakdown === null) return [{
+				key: "total",
+				cls: "",
+				width: pct
+			}];
+			const bd = breakdown;
+			const total = bd.systemTokens + bd.toolsTokens + bd.messageTokens;
 			if (total <= 0) return [{
 				key: "total",
 				cls: "",
 				width: pct
 			}];
 			return [
-				["sys", breakdown.systemTokens],
-				["tools", breakdown.toolsTokens],
-				["msgs", breakdown.messageTokens]
+				["sys", bd.systemTokens],
+				["tools", bd.toolsTokens],
+				["msgs", bd.messageTokens]
 			].map(([key, tokens]) => ({
 				key,
 				cls: key,
@@ -4740,8 +4772,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			const claimed = /* @__PURE__ */ new Set();
 			const out = [];
 			for (const row of rows) {
-				const type = row.role === "tool" && row.toolState === "done" && row.resultText !== void 0 ? ARTIFACT_TOOLS[row.text] : void 0;
-				if (type === void 0) {
+				const type = row.role === "tool" && row.toolState === "done" && row.resultText !== void 0 && row.text !== void 0 ? ARTIFACT_TOOLS[row.text] : void 0;
+				if (type === void 0 || row.resultText === void 0) {
 					out.push(row);
 					continue;
 				}
@@ -5680,8 +5712,11 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		* does everything. Gestures: single-pointer drag pan, two-pointer pinch
 		* anchored at the midpoint, wheel zoom anchored at the cursor, double
 		* click/tap toggles fit↔100%. ResizeObserver refits on content/stage size
-		* changes (mermaid's async svg). A floating −/%/fit/+ toolbar stays mounted.
-		* Shared by the notebook's board tab and the diagram modals.
+		* changes (mermaid's async svg) — through the #12 gates: value-equality on
+		* setSize, a bounds-differ short-circuit on refit, rAF coalescing, and a
+		* recurrence-tripping oscillation breaker (see makeRefitBreaker). A floating
+		* −/%/fit/+ toolbar stays mounted. Shared by the notebook's board tab and
+		* the diagram modals.
 		* (lucide glyphs collapse to text/plugin icons; the client stays dependency-
 		* free.)
 		* @module dsh-plugin-lookatstudy/client/canvasstage
@@ -5690,6 +5725,43 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		const MAX_SCALE = 4;
 		/** 工具条步进(手势/滚轮连续,按钮给干脆的一档)。 */
 		const STEP = 1.25;
+		/** True when the two bounds readings differ in ANY field — the auto-refit
+		* short-circuit. The pre-fix refit ran fitTransform on every RO callback with
+		* zero hysteresis, so any feedback touching a size re-fired it forever. */
+		function stageBoundsDiffer(a, b) {
+			if (a === null) return true;
+			return a.contentW !== b.contentW || a.contentH !== b.contentH || a.viewW !== b.viewW || a.viewH !== b.viewH;
+		}
+		function makeRefitBreaker(opts = {}) {
+			const windowMs = opts.windowMs ?? 2e3;
+			const now = opts.now ?? (() => performance.now());
+			let seen = [];
+			let tripped = false;
+			return {
+				allow(key) {
+					const t = now();
+					seen = seen.filter((s) => t - s.t < windowMs);
+					if (tripped) return false;
+					if (seen.some((s) => s.key === key)) {
+						tripped = true;
+						return false;
+					}
+					seen.push({
+						t,
+						key
+					});
+					return true;
+				},
+				reset() {
+					seen = [];
+					tripped = false;
+				},
+				tripped() {
+					return tripped;
+				}
+			};
+		}
+		const boundsKey = (b) => `${String(b.contentW)}x${String(b.contentH)}@${String(b.viewW)}x${String(b.viewH)}`;
 		function CanvasStage({ children, grid = true, testid }) {
 			const stageRef = (0, react.useRef)(null);
 			const contentRef = (0, react.useRef)(null);
@@ -5711,6 +5783,9 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				moved: false
 			});
 			const lastTapRef = (0, react.useRef)(null);
+			const lastBoundsRef = (0, react.useRef)(null);
+			const breakerRef = (0, react.useRef)(null);
+			if (breakerRef.current === null) breakerRef.current = makeRefitBreaker();
 			const bounds = (0, react.useCallback)(() => {
 				const stage = stageRef.current;
 				const content = contentRef.current;
@@ -5723,32 +5798,62 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 					viewH: stage?.clientHeight ?? 0
 				};
 			}, []);
-			const refit = (0, react.useCallback)(() => {
-				const b = bounds();
-				if (b.contentW === 0 || b.viewW === 0) return;
+			const currentBounds = (0, react.useCallback)(() => ({
+				contentW: contentRef.current?.offsetWidth ?? 0,
+				contentH: contentRef.current?.offsetHeight ?? 0,
+				viewW: stageRef.current?.clientWidth ?? 0,
+				viewH: stageRef.current?.clientHeight ?? 0
+			}), []);
+			const applyFit = (0, react.useCallback)((b) => {
 				setTf(fitTransform(b.contentW, b.contentH, b.viewW, b.viewH));
 				atFitRef.current = true;
-			}, [bounds]);
+			}, []);
+			const refit = (0, react.useCallback)(() => {
+				breakerRef.current?.reset();
+				const b = currentBounds();
+				if (b.contentW === 0 || b.viewW === 0) return;
+				lastBoundsRef.current = b;
+				applyFit(b);
+			}, [currentBounds, applyFit]);
+			const measureNow = (0, react.useCallback)(() => {
+				const content = contentRef.current;
+				if (content === null) return;
+				const w = content.offsetWidth;
+				const h = content.offsetHeight;
+				setSize((prev) => prev !== null && prev.w === w && prev.h === h ? prev : {
+					w,
+					h
+				});
+				const b = currentBounds();
+				if (!stageBoundsDiffer(lastBoundsRef.current, b)) return;
+				lastBoundsRef.current = b;
+				if (b.contentW === 0 || b.viewW === 0) return;
+				if (b.contentW < 120) return;
+				if ((breakerRef.current ?? makeRefitBreaker()).allow(boundsKey(b))) applyFit(b);
+			}, [currentBounds, applyFit]);
 			(0, react.useEffect)(() => {
 				const stage = stageRef.current;
 				const content = contentRef.current;
 				if (stage === null || content === null) return;
-				const measure = () => {
-					setSize({
-						w: content.offsetWidth,
-						h: content.offsetHeight
+				measureNow();
+				let raf = 0;
+				const onRo = () => {
+					if (raf !== 0) return;
+					raf = requestAnimationFrame(() => {
+						raf = 0;
+						measureNow();
 					});
-					refit();
 				};
-				measure();
-				const ro = new ResizeObserver(measure);
+				const ro = new ResizeObserver(onRo);
 				ro.observe(content);
 				ro.observe(stage);
 				return () => {
 					ro.disconnect();
+					if (raf !== 0) cancelAnimationFrame(raf);
 				};
-			}, [refit]);
+			}, [measureNow]);
 			const zoomBy = (0, react.useCallback)((factor, ax, ay) => {
+				breakerRef.current?.reset();
 				const b = bounds();
 				const cx = ax ?? b.viewW / 2;
 				const cy = ay ?? b.viewH / 2;
@@ -5960,7 +6065,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			let seen;
 			try {
 				const raw = storage.getItem(seenArtifactsKey(lessonId));
-				seen = new Set(Array.isArray(JSON.parse(raw ?? "[]")) ? JSON.parse(raw ?? "[]") : []);
+				const parsed = JSON.parse(raw ?? "[]");
+				seen = new Set(Array.isArray(parsed) ? parsed.filter((x) => typeof x === "string") : []);
 			} catch {
 				seen = /* @__PURE__ */ new Set();
 			}
@@ -6071,12 +6177,32 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				to: a.lineEnd
 			})}`), a.note))));
 		}
+		/** The 放大查看 modal's mermaid host — rendered ONCE per mermaid source. The
+		* raw-ref-callback version re-ran renderMermaidInto on every parent render
+		* (each 3s state poll), and its el.textContent='' clear + async re-render
+		* re-mounted the svg twice per tick — the #12 flicker. A stable effect deps
+		* chain (string mermaid + useCallback'd onFail) breaks the loop at the
+		* source; the CanvasStage gates are the second line of defense. */
+		function DiagramModalDiagram({ mermaid, onFail }) {
+			const bodyRef = (0, react.useRef)(null);
+			(0, react.useEffect)(() => {
+				if (bodyRef.current === null) return;
+				renderMermaidInto(bodyRef.current, mermaid, onFail);
+			}, [mermaid, onFail]);
+			return (0, react.createElement)("div", {
+				className: "lks14-modal-diagram",
+				ref: bodyRef
+			});
+		}
 		/** Mermaid diagram card with an expand modal (upstream DiagramViewerModal). */
 		function DiagramCard({ artifact }) {
 			const mermaid = typeof artifact.data.mermaid === "string" ? artifact.data.mermaid : "";
 			const bodyRef = (0, react.useRef)(null);
 			const [failed, setFailed] = (0, react.useState)(false);
 			const [expanded, setExpanded] = (0, react.useState)(false);
+			const onFail = (0, react.useCallback)(() => {
+				setFailed(true);
+			}, []);
 			(0, react.useEffect)(() => {
 				if (!expanded) return;
 				const onKey = (e) => {
@@ -6089,10 +6215,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			}, [expanded]);
 			(0, react.useEffect)(() => {
 				if (bodyRef.current === null) return;
-				renderMermaidInto(bodyRef.current, mermaid, () => {
-					setFailed(true);
-				});
-			}, [mermaid]);
+				renderMermaidInto(bodyRef.current, mermaid, onFail);
+			}, [mermaid, onFail]);
 			const body = failed ? (0, react.createElement)("pre", { className: "lks-acard-code" }, mermaid) : (0, react.createElement)("div", {
 				className: "lks-acard-diagram",
 				ref: bodyRef
@@ -6121,13 +6245,9 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				onClick: () => {
 					setExpanded(false);
 				}
-			}, (0, react.createElement)(IconCloseFill16, { size: 13 }))), failed ? (0, react.createElement)("pre", { className: "lks-acard-code" }, mermaid) : (0, react.createElement)(CanvasStage, { testid: "diagram-modal-stage" }, (0, react.createElement)("div", {
-				className: "lks14-modal-diagram",
-				ref: (el) => {
-					if (el !== null) renderMermaidInto(el, mermaid, () => {
-						setFailed(true);
-					});
-				}
+			}, (0, react.createElement)(IconCloseFill16, { size: 13 }))), failed ? (0, react.createElement)("pre", { className: "lks-acard-code" }, mermaid) : (0, react.createElement)(CanvasStage, { testid: "diagram-modal-stage" }, (0, react.createElement)(DiagramModalDiagram, {
+				mermaid,
+				onFail
 			})))) : null);
 		}
 		/** The opening guess: two big options, click = pick (sent to the tutor, who
@@ -7307,7 +7427,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				key: opt.letter,
 				className: "lks14-opt",
 				onClick: () => {
-					interactive.send(tr("quiz.answer", {
+					interactive?.send(tr("quiz.answer", {
 						letter: opt.letter,
 						text: opt.text
 					}));
@@ -7980,6 +8100,33 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 		* search-and-jump (the dashboard search API), course switch, review, start
 		* studying — all funneling the panel's own actions.
 		*/
+		/** The cmap modal's diagram host — rendered ONCE per (title, concepts) VALUE.
+		* The raw-ref-callback version re-ran renderLessonConceptMap on every parent
+		* render (each 3s state poll recreates the feed-derived concepts array, so
+		* even a memo-by-identity effect would re-fire); the dataset key compares by
+		* value — poll re-renders no-op, a real mastery change re-renders. Same #12
+		* family as the diagram modal. */
+		function CmapModalDiagram({ title, concepts }) {
+			const ref = (0, react.useRef)(null);
+			(0, react.useEffect)(() => {
+				const el = ref.current;
+				if (el === null) return;
+				const key = `${title}\u0000${concepts.map((c) => `${c.title}:${String(c.masteryPct)}`).join("
")}`;
+				if (el.dataset.cmapKey === key) return;
+				el.dataset.cmapKey = key;
+				el.textContent = "";
+				renderLessonConceptMap(el, title, concepts.map((c) => ({
+					title: c.title,
+					masteryPct: c.masteryPct
+				}))).catch(() => {
+					el.textContent = tr("bb.fallback.cmap");
+				});
+			});
+			return (0, react.createElement)("div", {
+				className: "lks14-modal-diagram",
+				ref
+			});
+		}
 		function CommandPalette({ searchLessons, courses, onClose, onLesson, onCourse, onReview, onStudy }) {
 			const [query, setQuery] = (0, react.useState)("");
 			const [lessons, setLessons] = (0, react.useState)([]);
@@ -9669,7 +9816,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 			(0, react.useEffect)(() => {
 				if (tab !== "teach" || proseRef.current === null || lesson === null) return;
 				enhanceRendered(proseRef.current).catch(() => {}).finally(() => {
-					applyHighlights(proseRef.current, recordQuotes);
+					if (proseRef.current !== null) applyHighlights(proseRef.current, recordQuotes);
 					setEnhanceTick(Date.now());
 				});
 			}, [tab, lesson?.html]);
@@ -9678,7 +9825,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				locateNoteQuote(pendingLocate, proseRef.current);
 				setPendingLocate(null);
 			}, [pendingLocate, tab]);
-			const body = lesson === null ? (0, react.createElement)("div", { className: "lks14-empty" }, tr("bb.empty"), (0, react.createElement)("br"), tr("bb.empty.hint")) : (0, react.createElement)("div", { className: "lks14-notebody" }, (0, react.createElement)("div", { className: "lks14-viewtabs" }, (0, react.createElement)("button", {
+			const body = lesson === null ? (0, react.createElement)("div", { className: "lks14-empty" }, tr("bb.empty"), (0, react.createElement)("br"), tr("bb.empty.hint")) : (0, react.createElement)("div", { className: `lks14-notebody${tab === "board" ? " lks14-notebody-fill" : ""}` }, (0, react.createElement)("div", { className: "lks14-viewtabs" }, (0, react.createElement)("button", {
 				className: `lks14-viewtab${tab === "teach" ? " on" : ""}`,
 				"aria-pressed": String(tab === "teach"),
 				onClick: () => {
@@ -9722,7 +9869,7 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				onClick: () => {
 					setRateBusy(true);
 					recordReview(lesson.lessonId, Number(q)).then(() => {
-						const rateEl = document.querySelector(`[data-lks-rate="${lesson.lessonId}"]`);
+						const rateEl = document.querySelector(`[data-lks-rate="${CSS.escape(lesson.lessonId)}"]`);
 						const rr = Number(q) >= 4 && rateEl !== null ? rateEl.getBoundingClientRect() : null;
 						celebrate(Number(q) >= 4 ? "correct" : "wrong", rr !== null ? { origin: {
 							x: rr.right - 48,
@@ -9830,19 +9977,12 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 				onClick: () => {
 					setCmapExpanded(false);
 				}
-			}, (0, react.createElement)(IconCloseFill16, { size: 13 }))), (0, react.createElement)(CanvasStage, { testid: "cmap-modal-stage" }, (0, react.createElement)("div", {
-				className: "lks14-modal-diagram",
-				ref: (el) => {
-					if (el !== null) {
-						el.textContent = "";
-						renderLessonConceptMap(el, lesson.title, lesson.concepts.map((c) => ({
-							title: c.title,
-							masteryPct: c.masteryPct
-						}))).catch(() => {
-							el.textContent = tr("bb.fallback.cmap");
-						});
-					}
-				}
+			}, (0, react.createElement)(IconCloseFill16, { size: 13 }))), (0, react.createElement)(CanvasStage, { testid: "cmap-modal-stage" }, (0, react.createElement)(CmapModalDiagram, {
+				title: lesson.title,
+				concepts: lesson.concepts.map((c) => ({
+					title: c.title,
+					masteryPct: c.masteryPct
+				}))
 			})))) : null) : (0, react.createElement)("div", { className: "lks14-zones" }, (() => {
 				const understand = artifacts.filter((a) => a.artifactType === "compare_table" || a.artifactType === "diagram" || a.artifactType === "code_walkthrough");
 				if (understand.length === 0) return null;
@@ -9893,10 +10033,8 @@ mark.lks-hl{background:var(--dsw-alias-state-warn-tertiary);color:inherit;border
 					"data-tooltip": tr("note.locate"),
 					"aria-label": tr("note.locate"),
 					onClick: () => {
-						if (tab !== "teach") {
-							setTab("teach");
-							setPendingLocate(n.quote ?? "");
-						} else locateNoteQuote(n.quote ?? "", proseRef.current);
+						setTab("teach");
+						setPendingLocate(n.quote ?? "");
 					}
 				}, (0, react.createElement)(IconGoalOutline16, { size: 12 })) : null, (0, react.createElement)("button", {
 					className: "lks-note-act",