dsh-brief-sidebar 0.9.2 → 0.9.3

package/lib/client.js

@@ -231,11 +231,11 @@ window.__ModuleLoader__.load({
 			in_progress: "var(--dsw-alias-state-business-primary)",
 			pending: "var(--dsw-alias-label-tertiary)"
 		};
-		const SECTION_STYLE$4 = {
+		const SECTION_STYLE$5 = {
 			flexShrink: 0,
 			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
 		};
-		const HEADER_STYLE$5 = {
+		const HEADER_STYLE$6 = {
 			padding: "10px 12px 0",
 			color: "var(--dsw-alias-label-secondary)",
 			fontSize: 12,
@@ -316,24 +316,24 @@ window.__ModuleLoader__.load({
 			const { t, ctx, scope } = props;
 			const todos = useTodos(ctx, scope?.sessionId);
 			if (todos === void 0) return (0, react.createElement)("div", {
-				style: SECTION_STYLE$4,
+				style: SECTION_STYLE$5,
 				"data-dsh-brief-sidebar": "progress-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$5 }, t("section.progress")), (0, react.createElement)(Notice, {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$6 }, t("section.progress")), (0, react.createElement)(Notice, {
 				title: t("board.unavailable"),
 				detail: t("board.unavailableHint")
 			}));
 			if (todos.length === 0) return (0, react.createElement)("div", {
-				style: SECTION_STYLE$4,
+				style: SECTION_STYLE$5,
 				"data-dsh-brief-sidebar": "progress-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$5 }, t("section.progress")), (0, react.createElement)(Notice, {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$6 }, t("section.progress")), (0, react.createElement)(Notice, {
 				title: t("board.empty"),
 				detail: t("board.emptyHint")
 			}));
 			const counts = countTodos(todos);
 			return (0, react.createElement)("div", {
-				style: SECTION_STYLE$4,
+				style: SECTION_STYLE$5,
 				"data-dsh-brief-sidebar": "progress-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$5 }, t("section.progress")), (0, react.createElement)("div", { style: PROGRESS_STYLE }, progressLine(counts, t)), (0, react.createElement)("ul", { style: LIST_STYLE$4 }, todos.map((item, index) => (0, react.createElement)(TodoRow, {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$6 }, t("section.progress")), (0, react.createElement)("div", { style: PROGRESS_STYLE }, progressLine(counts, t)), (0, react.createElement)("ul", { style: LIST_STYLE$4 }, todos.map((item, index) => (0, react.createElement)(TodoRow, {
 				key: `${index}:${item.content}`,
 				item,
 				t
@@ -688,6 +688,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "已被摘要取代",
 				"recall.noBody": "（本帧没有这条记忆的全文）",
 				"section.skillUsage": "技能引用",
+				"section.references": "引用",
+				"references.tabSkills": "技能",
+				"references.tabMemory": "记忆",
 				"skillUsage.empty": "本会话还没载入过技能",
 				"skillUsage.emptyHint": "模型用 skill 工具载入、或你直接点用某个技能后，技能名会实时出现在这里。",
 				"skillUsage.uses": "{count} 次",
@@ -748,6 +751,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "replaced by summary",
 				"recall.noBody": "(this frame carries no full body for this record)",
 				"section.skillUsage": "Skill references",
+				"section.references": "References",
+				"references.tabSkills": "Skills",
+				"references.tabMemory": "Memory",
 				"skillUsage.empty": "No skills loaded in this session",
 				"skillUsage.emptyHint": "Skills show up here once the model loads one with the `skill` tool, or you invoke one directly.",
 				"skillUsage.uses": "{count}x",
@@ -808,6 +814,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "要約に置換済み",
 				"recall.noBody": "このフレームには全文が含まれていない",
 				"section.skillUsage": "スキル参照",
+				"section.references": "参照",
+				"references.tabSkills": "スキル",
+				"references.tabMemory": "メモリ",
 				"skillUsage.empty": "このセッションではスキルを読み込んでいません",
 				"skillUsage.emptyHint": "モデルが skill ツールで読み込むか、あなたがスキルを直接起動すると、ここにリアルタイムで表示されます。",
 				"skillUsage.uses": "{count} 回",
@@ -868,6 +877,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "요약에 대체됨",
 				"recall.noBody": "이 프레임에는 이 기록의 전문이 없습니다",
 				"section.skillUsage": "스킬 참조",
+				"section.references": "참조",
+				"references.tabSkills": "스킬",
+				"references.tabMemory": "메모리",
 				"skillUsage.empty": "이 세션에서 스킬을 불러오지 않았습니다",
 				"skillUsage.emptyHint": "모델이 skill 도구로 불러오거나 당신이 스킬을 직접 실행하면 여기에 실시간으로 나타납니다.",
 				"skillUsage.uses": "{count}회",
@@ -928,6 +940,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "remplacé par le résumé",
 				"recall.noBody": "(aucun texte complet pour cette entrée dans cette trame)",
 				"section.skillUsage": "Références de compétences",
+				"section.references": "Références",
+				"references.tabSkills": "Compétences",
+				"references.tabMemory": "Mémoire",
 				"skillUsage.empty": "Aucune compétence chargée dans cette session",
 				"skillUsage.emptyHint": "Les compétences apparaissent ici dès que le modèle en charge une via l’outil `skill`, ou quand vous en lancez une directement.",
 				"skillUsage.uses": "{count}×",
@@ -988,6 +1003,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "durch Zusammenfassung ersetzt",
 				"recall.noBody": "(dieser Rahmen enthält keinen vollständigen Text für diesen Eintrag)",
 				"section.skillUsage": "Skill-Referenzen",
+				"section.references": "Referenzen",
+				"references.tabSkills": "Skills",
+				"references.tabMemory": "Speicher",
 				"skillUsage.empty": "In dieser Sitzung wurden keine Skills geladen",
 				"skillUsage.emptyHint": "Skills erscheinen hier, sobald das Modell einen über das `skill`-Tool lädt oder du einen direkt aufrufst.",
 				"skillUsage.uses": "{count}x",
@@ -1048,6 +1066,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "sostituito dal riassunto",
 				"recall.noBody": "(questo frame non contiene il testo completo di questa voce)",
 				"section.skillUsage": "Riferimenti alle skill",
+				"section.references": "Riferimenti",
+				"references.tabSkills": "Skill",
+				"references.tabMemory": "Memoria",
 				"skillUsage.empty": "Nessuna skill caricata in questa sessione",
 				"skillUsage.emptyHint": "Le skill compaiono qui quando il modello ne carica una con il tool `skill` o quando ne avvii una direttamente.",
 				"skillUsage.uses": "{count}x",
@@ -1108,6 +1129,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "заменено сводкой",
 				"recall.noBody": "В этом кадре нет полного текста этой записи",
 				"section.skillUsage": "Отсылки к скиллам",
+				"section.references": "Отсылки",
+				"references.tabSkills": "Навыки",
+				"references.tabMemory": "Память",
 				"skillUsage.empty": "В этой сессии скиллы не загружались",
 				"skillUsage.emptyHint": "Навыки появятся здесь, когда модель загрузит их через инструмент `skill` или вы вызовете навык напрямую.",
 				"skillUsage.uses": "{count} раз",
@@ -1168,6 +1192,9 @@ window.__ModuleLoader__.load({
 				"recall.supersededTag": "reemplazado por el resumen",
 				"recall.noBody": "(este fotograma no trae el texto completo de este registro)",
 				"section.skillUsage": "Referencias de skills",
+				"section.references": "Referencias",
+				"references.tabSkills": "Skills",
+				"references.tabMemory": "Memoria",
 				"skillUsage.empty": "Esta sesión no ha cargado ningún skill",
 				"skillUsage.emptyHint": "Las skills aparecen aquí cuando el modelo carga una con la herramienta `skill` o cuando invocas una directamente.",
 				"skillUsage.uses": "{count}x",
@@ -1222,11 +1249,11 @@ window.__ModuleLoader__.load({
 		*
 		* Colours come from `--dsw-alias-*` tokens only (skin contract).
 		*/
-		const SECTION_STYLE$3 = {
+		const SECTION_STYLE$4 = {
 			flexShrink: 0,
 			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
 		};
-		const HEADER_STYLE$4 = {
+		const HEADER_STYLE$5 = {
 			padding: "10px 12px 0",
 			color: "var(--dsw-alias-label-secondary)",
 			fontSize: 12,
@@ -1315,9 +1342,9 @@ window.__ModuleLoader__.load({
 			const latestPaths = view.latest?.paths ?? [];
 			const history = historyPaths(view.sessionPaths, latestPaths);
 			if (latestPaths.length === 0 && view.sessionTotal === 0) return (0, react.createElement)("div", {
-				style: SECTION_STYLE$3,
+				style: SECTION_STYLE$4,
 				"data-dsh-brief-sidebar": "deliverables-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$4 }, t("section.deliverables")), (0, react.createElement)("div", { style: {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$5 }, t("section.deliverables")), (0, react.createElement)("div", { style: {
 				margin: "0 auto",
 				padding: 24,
 				maxWidth: 460,
@@ -1330,9 +1357,9 @@ window.__ModuleLoader__.load({
 				color: "var(--dsw-alias-label-secondary)"
 			} }, t("deliverables.empty")), (0, react.createElement)("div", null, t("deliverables.emptyHint"))));
 			return (0, react.createElement)("div", {
-				style: SECTION_STYLE$3,
+				style: SECTION_STYLE$4,
 				"data-dsh-brief-sidebar": "deliverables-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$4 }, t("section.deliverables")), latestPaths.length > 0 && (0, react.createElement)(GroupHeader, {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$5 }, t("section.deliverables")), latestPaths.length > 0 && (0, react.createElement)(GroupHeader, {
 				text: expandCount(t("deliverables.currentTurn"), latestPaths.length),
 				marker: "deliverables-current-group"
 			}), (0, react.createElement)("ul", { style: LIST_STYLE$3 }, latestPaths.map((path) => (0, react.createElement)(PathRow, {
@@ -1456,137 +1483,82 @@ window.__ModuleLoader__.load({
 			return template.replace("{count}", String(count)).replace("{total}", String(total));
 		}
 		//#endregion
-		//#region src/client/summary/SkillUsageSection.tsx
+		//#region src/client/summary/memory-recall.ts
 		/**
-		* The skill-usage section: the `dshSummarySkillUsage` projection drawn as one
-		* part of the summary tab.
-		*
-		* Where `MemoryRecallSection` answers "what memories did the model see", this
-		* answers "which instruction packs entered the context, and which ones were on
-		* the menu". Two groups, deliberately not merged:
-		*
-		* - **已引用** — the skill's instructions reached the conversation, either
-		*   because the model called the `skill` tool or because the user invoked it
-		*   directly (the host then injects `<skill_content>` and tells the model not
-		*   to call the tool — reading only the tool would miss over half of those
-		*   sessions, measured on 250 real ones).
-		* - **本会话可用** — the session's current catalog. Available is NOT used: the
-		*   model may never touch any of these, so it is collapsed behind a counted
-		*   toggle and never mixed into the reference rows.
+		* The `memoryRecall` projection — reading it.
 		*
-		* Like the deliverables section this is an OPTIONAL capability on both sides:
-		* no projection registry (or a host half that never registered the unit) means
-		* the client reads capability absence and the section hides. No settings switch
-		* gates it either — the list is a read-only fact about the session, not a
-		* preference.
+		* The projection unit is registered by `dsh-prime-memory` (key `memoryRecall`,
+		* wire view `{rev, sessionId, count, items[]}`): the memories this session has
+		* actually injected. Unlike
+		* `memorySlots` (pinned, resident conventions written by hand), this set is
+		* NOT resident — it is the at-a-glance answer to "what did the model see".
+		* It survives compaction on purpose: `compact` only marks the entries whose
+		* text left the context as `superseded` (and `/clear` empties the set), so a
+		* retired row keeps its strike-through instead of vanishing.
 		*
-		* Two contracts this row honours, both learned on the recall section:
-		* - **no native `title` attribute** — it paints an unskinable tooltip that
-		*   overlaps the plugin's own bubble; nothing here needs one;
-		* - **colours from `--dsw-alias-*` tokens only** (skin contract).
+		* This plugin does NOT depend on prime-memory: with the unit unregistered the
+		* client reads `undefined` from the face and the section hides. The module is
+		* deliberately PURE — no React, no context, no IO — so the narrowing is
+		* testable directly, exactly like `memory-slots.ts`.
 		*/
-		const SECTION_STYLE$2 = {
-			flexShrink: 0,
-			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
-		};
-		const HEADER_STYLE$3 = {
-			padding: "10px 12px 0",
-			color: "var(--dsw-alias-label-secondary)",
-			fontSize: 12,
-			fontWeight: 600
-		};
-		const LIST_STYLE$2 = {
-			listStyle: "none",
-			margin: 0,
-			padding: "6px 0",
-			display: "flex",
-			flexDirection: "column"
-		};
-		const ROW_STYLE$3 = {
-			display: "flex",
-			alignItems: "baseline",
-			gap: 8,
-			padding: "6px 12px"
-		};
-		/** The skill name: primary-ish but never the loudest thing in the row. */
-		const NAME_STYLE$1 = {
-			minWidth: 0,
-			overflowWrap: "anywhere",
-			color: "var(--dsw-alias-label-secondary)"
-		};
-		/** The per-skill load tally, tertiary so the name stays the reading target. */
-		const COUNT_STYLE = {
-			flexShrink: 0,
-			color: "var(--dsw-alias-label-tertiary)",
-			fontSize: 11
-		};
-		/** The "本轮" pill: same form as the deliverables codeplan tag. */
-		const TAG_STYLE = {
-			flexShrink: 0,
-			color: "var(--dsw-alias-label-tertiary)",
-			border: "1px solid var(--dsw-alias-label-tertiary)",
-			borderRadius: 999,
-			padding: "0 6px",
-			fontSize: 11,
-			lineHeight: "16px",
-			whiteSpace: "nowrap"
-		};
-		const FOOTER_STYLE$2 = {
-			padding: "0 12px 10px",
-			color: "var(--dsw-alias-label-tertiary)",
-			fontSize: 11
-		};
-		const EMPTY_STYLE$2 = {
-			margin: "0 auto",
-			padding: 24,
-			maxWidth: 460,
-			textAlign: "center",
-			color: "var(--dsw-alias-label-tertiary)",
-			lineHeight: 1.7,
-			fontSize: 12
-		};
+		/** The projection key `dsh-prime-memory` registers (its canonical constant). */
+		const MEMORY_RECALL_KEY = "memoryRecall";
+		/** Whether a value is a non-negative safe integer (the view's counter shape). */
+		function isCounter$1(value) {
+			return typeof value === "number" && Number.isSafeInteger(value) && value >= 0;
+		}
+		/** Narrow one item entry; `undefined` = malformed, dropped. */
+		function readItem(value) {
+			if (value === null || typeof value !== "object" || Array.isArray(value)) return void 0;
+			const raw = value;
+			if (typeof raw["id"] !== "string" || raw["id"].length === 0) return void 0;
+			if (typeof raw["type"] !== "string" || typeof raw["title"] !== "string") return void 0;
+			if (typeof raw["priority"] !== "number") return void 0;
+			const item = {
+				id: raw["id"],
+				type: raw["type"],
+				title: raw["title"],
+				priority: raw["priority"]
+			};
+			if (Array.isArray(raw["scenario"])) {
+				const phrases = raw["scenario"].filter((s) => typeof s === "string" && s.length > 0);
+				if (phrases.length > 0) item.scenario = phrases;
+			}
+			const rating = raw["rating"];
+			if (typeof rating === "number" && Number.isInteger(rating) && rating >= -1 && rating <= 5) item.rating = rating;
+			if (typeof raw["body"] === "string") item.body = raw["body"];
+			if (raw["retired"] === true) item.retired = true;
+			if (raw["superseded"] === true) item.superseded = true;
+			return item;
+		}
 		/**
-		* The skill-usage section. The subscription is unconditional (a plain listener,
-		* not IO); the view decides whether anything is drawn.
+		* Narrow a raw projection value into a recall view.
 		*
-		* @param props - translation, client context, session scope.
+		* `undefined` means the capability is ABSENT (prime-memory not in the
+		* composition, or no frame carried the key) or the frame drifted beyond repair;
+		* a view with `items: []` IS the honest empty state (prime-memory publishes as
+		* soon as the unit registers). Malformed items are dropped, never thrown on.
+		*
+		* @param value - the raw `unknown` snapshot of the `memoryRecall` face.
+		* @returns the validated view, or `undefined` when the capability is absent.
 		*/
-		function SkillUsageSection(props) {
-			const { t, ctx, scope } = props;
-			const [availableOpen, setAvailableOpen] = (0, react.useState)(false);
-			const view = readSkillUsage(useProjectionValue(ctx, scope?.sessionId, SKILL_USAGE_KEY));
-			if (view === void 0) return null;
-			const referenced = view.session.map((entry) => entry.name);
-			const rest = availableExcept(view.available, referenced);
-			const latestNames = view.latest?.names ?? [];
-			return (0, react.createElement)("div", {
-				style: SECTION_STYLE$2,
-				"data-dsh-brief-sidebar": "skill-usage-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$3 }, t("section.skillUsage")), view.session.length === 0 && (0, react.createElement)("div", { style: EMPTY_STYLE$2 }, (0, react.createElement)("div", { style: {
-				marginBottom: 6,
-				color: "var(--dsw-alias-label-secondary)"
-			} }, t("skillUsage.empty")), (0, react.createElement)("div", null, t("skillUsage.emptyHint"))), view.session.length > 0 && (0, react.createElement)(GroupHeader, {
-				text: expandCount(t("skillUsage.invokedGroup"), view.session.length),
-				marker: "skill-usage-invoked-group"
-			}), (0, react.createElement)("ul", { style: LIST_STYLE$2 }, view.session.map((entry) => (0, react.createElement)("li", {
-				key: entry.name,
-				style: ROW_STYLE$3,
-				"data-dsh-brief-sidebar": "skill-usage-row"
-			}, (0, react.createElement)("span", { style: NAME_STYLE$1 }, entry.name), (0, react.createElement)("span", { style: COUNT_STYLE }, expandPair(t("skillUsage.uses"), entry.count, entry.count)), latestNames.includes(entry.name) && (0, react.createElement)("span", { style: TAG_STYLE }, t("skillUsage.latestTag"))))), rest.length > 0 && (0, react.createElement)(FoldToggle, {
-				label: expandCount(t("skillUsage.availableGroup"), rest.length),
-				open: availableOpen,
-				marker: "skill-usage-available-toggle",
-				onToggle: () => {
-					setAvailableOpen((current) => !current);
-				}
-			}), rest.length > 0 && view.availableCount > view.available.length && (0, react.createElement)(GroupCaption, {
-				text: expandCount(t("skillUsage.availableCapped"), view.availableCount),
-				marker: "skill-usage-available-capped"
-			}), availableOpen && (0, react.createElement)("ul", { style: LIST_STYLE$2 }, rest.map((name) => (0, react.createElement)("li", {
-				key: name,
-				style: ROW_STYLE$3,
-				"data-dsh-brief-sidebar": "skill-usage-available-row"
-			}, (0, react.createElement)("span", { style: NAME_STYLE$1 }, name)))), view.session.length > 0 && (0, react.createElement)("div", { style: FOOTER_STYLE$2 }, expandPair(t("skillUsage.count"), view.callTotal, view.sessionTotal)));
+		function readRecall(value) {
+			if (value === null || typeof value !== "object" || Array.isArray(value)) return void 0;
+			const raw = value;
+			if (!isCounter$1(raw["rev"]) || !isCounter$1(raw["count"])) return void 0;
+			if (typeof raw["sessionId"] !== "string") return void 0;
+			if (!Array.isArray(raw["items"])) return void 0;
+			const items = [];
+			for (const entry of raw["items"]) {
+				const item = readItem(entry);
+				if (item !== void 0) items.push(item);
+			}
+			return {
+				rev: raw["rev"],
+				sessionId: raw["sessionId"],
+				count: raw["count"],
+				items
+			};
 		}
 		//#endregion
 		//#region src/client/summary/memory-slots.ts
@@ -1629,7 +1601,7 @@ window.__ModuleLoader__.load({
 		function readSlots(value) {
 			if (value === null || typeof value !== "object" || Array.isArray(value)) return void 0;
 			const raw = value;
-			if (!isCounter$1(raw["rev"]) || !isCounter$1(raw["count"]) || !isCounter$1(raw["openCount"])) return void 0;
+			if (!isCounter(raw["rev"]) || !isCounter(raw["count"]) || !isCounter(raw["openCount"])) return void 0;
 			if (!Array.isArray(raw["slots"])) return void 0;
 			const slots = [];
 			for (const entry of raw["slots"]) {
@@ -1644,7 +1616,7 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/** Whether a value is a non-negative safe integer (the view's counter shape). */
-		function isCounter$1(value) {
+		function isCounter(value) {
 			return typeof value === "number" && Number.isSafeInteger(value) && value >= 0;
 		}
 		/** Narrow one slot entry; `undefined` = malformed, dropped. */
@@ -1755,63 +1727,72 @@ window.__ModuleLoader__.load({
 			return resolve((0, react.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot));
 		}
 		//#endregion
-		//#region src/client/summary/MemorySlotsSection.tsx
+		//#region src/client/summary/SkillUsageSection.tsx
 		/**
-		* The memory-slots section: the `memorySlots` projection drawn as the third
-		* part of the summary tab (fixed last: 进展 → 产物 → 记忆).
+		* The skill-usage section: the `dshSummarySkillUsage` projection drawn as one
+		* part of the summary tab.
 		*
-		* TWO gates, both fail-open to "hidden", so a host without dsh-prime-memory
-		* paints nothing here:
+		* Where `MemoryRecallSection` answers "what memories did the model see", this
+		* answers "which instruction packs entered the context, and which ones were on
+		* the menu". Two groups, deliberately not merged:
 		*
-		* 1. **The switch.** This plugin's entry config (`configForms` → entry
-		*    `dsh-brief-sidebar`, field `showMemorySlots`, default OFF — the pinned
-		*    list moved out of the summary pane's way in favour of the session-recall
-		*    section). When the config face cannot answer (service absent, scope not
-		*    ready, field unset) the default applies — see `scope-face.ts`.
-		* 2. **The capability.** The `memorySlots` projection must exist for the
-		*    session; `undefined` hides the section entirely, exactly like the
-		*    optional deliverables section.
+		* - **已引用** — the skill's instructions reached the conversation, either
+		*   because the model called the `skill` tool or because the user invoked it
+		*   directly (the host then injects `<skill_content>` and tells the model not
+		*   to call the tool — reading only the tool would miss over half of those
+		*   sessions, measured on 250 real ones).
+		* - **本会话可用** — the session's current catalog. Available is NOT used: the
+		*   model may never touch any of these, so it is collapsed behind a counted
+		*   toggle and never mixed into the reference rows.
 		*
-		* Colours come from `--dsw-alias-*` tokens only (skin contract, enforced by
-		* `tests/purity.spec.ts`).
+		* Like the deliverables section this is an OPTIONAL capability on both sides:
+		* no projection registry (or a host half that never registered the unit) means
+		* the client reads capability absence and the section hides. No settings switch
+		* gates it either — the list is a read-only fact about the session, not a
+		* preference.
+		*
+		* Two contracts this row honours, both learned on the recall section:
+		* - **no native `title` attribute** — it paints an unskinable tooltip that
+		*   overlaps the plugin's own bubble; nothing here needs one;
+		* - **colours from `--dsw-alias-*` tokens only** (skin contract).
 		*/
-		const SECTION_STYLE$1 = {
+		const SECTION_STYLE$3 = {
 			flexShrink: 0,
 			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
 		};
-		const HEADER_STYLE$2 = {
+		const HEADER_STYLE$4 = {
 			padding: "10px 12px 0",
 			color: "var(--dsw-alias-label-secondary)",
 			fontSize: 12,
 			fontWeight: 600
 		};
-		const LIST_STYLE$1 = {
+		const LIST_STYLE$2 = {
 			listStyle: "none",
 			margin: 0,
 			padding: "6px 0",
 			display: "flex",
 			flexDirection: "column"
 		};
-		const ROW_STYLE$2 = {
+		const ROW_STYLE$3 = {
 			display: "flex",
-			alignItems: "flex-start",
+			alignItems: "baseline",
 			gap: 8,
 			padding: "6px 12px"
 		};
-		const TITLE_STYLE$1 = {
+		/** The skill name: primary-ish but never the loudest thing in the row. */
+		const NAME_STYLE$1 = {
 			minWidth: 0,
 			overflowWrap: "anywhere",
 			color: "var(--dsw-alias-label-secondary)"
 		};
-		const META_STYLE$1 = {
+		/** The per-skill load tally, tertiary so the name stays the reading target. */
+		const COUNT_STYLE = {
 			flexShrink: 0,
 			color: "var(--dsw-alias-label-tertiary)",
-			fontSize: 11,
-			lineHeight: "18px",
-			whiteSpace: "nowrap"
+			fontSize: 11
 		};
-		/** The kind pill: same form as the codeplan pill, tertiary emphasis. */
-		const KIND_STYLE = {
+		/** The "本轮" pill: same form as the deliverables codeplan tag. */
+		const TAG_STYLE = {
 			flexShrink: 0,
 			color: "var(--dsw-alias-label-tertiary)",
 			border: "1px solid var(--dsw-alias-label-tertiary)",
@@ -1821,40 +1802,12 @@ window.__ModuleLoader__.load({
 			lineHeight: "16px",
 			whiteSpace: "nowrap"
 		};
-		/** The status pill: filled tint for an open slot, plain text otherwise. */
-		const STATUS_OPEN_STYLE = {
-			flexShrink: 0,
-			color: "var(--dsw-alias-label-primary)",
-			border: "1px solid var(--dsw-alias-label-secondary)",
-			borderRadius: 999,
-			padding: "0 6px",
-			fontSize: 11,
-			lineHeight: "16px",
-			whiteSpace: "nowrap"
-		};
-		const STATUS_SETTLED_STYLE = {
-			...STATUS_OPEN_STYLE,
-			color: "var(--dsw-alias-label-tertiary)",
-			border: "1px solid var(--dsw-alias-label-tertiary)"
-		};
-		const BODY_STYLE$2 = {
-			margin: 0,
-			minWidth: 0,
-			overflowWrap: "anywhere",
+		const FOOTER_STYLE$2 = {
+			padding: "0 12px 10px",
 			color: "var(--dsw-alias-label-tertiary)",
-			fontSize: 12,
-			lineHeight: "18px"
-		};
-		const REFS_STYLE = {
-			...BODY_STYLE$2,
 			fontSize: 11
 		};
-		const TOTAL_STYLE = {
-			padding: "6px 12px 10px",
-			color: "var(--dsw-alias-label-tertiary)",
-			fontSize: 12
-		};
-		const EMPTY_STYLE$1 = {
+		const EMPTY_STYLE$2 = {
 			margin: "0 auto",
 			padding: 24,
 			maxWidth: 460,
@@ -1863,153 +1816,48 @@ window.__ModuleLoader__.load({
 			lineHeight: 1.7,
 			fontSize: 12
 		};
-		/** Locale key per known slot status; unknown statuses fall back to the raw wire value. */
-		const STATUS_KEY = {
-			open: "slots.status.open",
-			done: "slots.status.done",
-			dropped: "slots.status.dropped",
-			expired: "slots.status.expired"
-		};
 		/**
-		* One slot row: kind pill, title (full body rides the tooltip), status pill,
-		* priority; body line underneath when the wire view carries it; refs as
-		* resolved 名称简述 (record_id → title) with the raw refs on the tooltip, or
-		* raw refs when the host has not resolved them.
-		*/
-		function SlotRow(props) {
-			const { slot, t } = props;
-			const statusLabel = STATUS_KEY[slot.status] === void 0 ? slot.status : t(STATUS_KEY[slot.status]);
-			const title = slot.body === void 0 ? slot.title : `${slot.title} — ${slot.body}`;
-			const refsLine = slot.refViews !== void 0 ? slot.refViews.map((view) => view.title).join(" · ") : slot.refs !== void 0 ? slot.refs.join(" · ") : void 0;
-			return (0, react.createElement)("li", { style: ROW_STYLE$2 }, (0, react.createElement)("span", { style: KIND_STYLE }, slot.kind), (0, react.createElement)("div", { style: {
-				minWidth: 0,
-				flex: "1 1 auto",
-				display: "flex",
-				flexDirection: "column",
-				gap: 2
-			} }, (0, react.createElement)("span", {
-				style: TITLE_STYLE$1,
-				title
-			}, slot.title), slot.body !== void 0 && (0, react.createElement)("p", { style: BODY_STYLE$2 }, truncateBody(slot.body)), refsLine !== void 0 && (0, react.createElement)("p", {
-				style: REFS_STYLE,
-				title: slot.refs !== void 0 ? slot.refs.join("\n") : void 0
-			}, refsLine)), (0, react.createElement)("span", { style: META_STYLE$1 }, `P${slot.priority}`), (0, react.createElement)("span", { style: slot.status === "open" ? STATUS_OPEN_STYLE : STATUS_SETTLED_STYLE }, statusLabel));
-		}
-		/**
-		* Subscribe to this plugin's entry config and resolve the slots switch.
-		* Plumbing lives in `use-config-flag`; the default (off) lives in the resolver.
+		* The skill-usage section. The subscription is unconditional (a plain listener,
+		* not IO); the view decides whether anything is drawn.
 		*
-		* @param ctx - the client root context handed to the tab body.
-		* @returns whether the memory-slots section may render at all.
-		*/
-		function useShowMemorySlots(ctx) {
-			return useConfigFlag(ctx, resolveShowMemorySlots);
-		}
-		/**
-		* The memory-slots section. Both hooks run unconditionally (a conditional
-		* hook order would break the moment the switch flips); the switch only
-		* decides whether the resolved view paints.
 		* @param props - translation, client context, session scope.
 		*/
-		function MemorySlotsSection(props) {
-			const { t, ctx, scope } = props;
-			const show = useShowMemorySlots(ctx);
-			const view = readSlots(useProjectionValue(ctx, scope?.sessionId, MEMORY_SLOTS_KEY));
-			if (show === false) return null;
+		function SkillUsageSection(props) {
+			const { t, ctx, scope, hideHeader = false } = props;
+			const [availableOpen, setAvailableOpen] = (0, react.useState)(false);
+			const view = readSkillUsage(useProjectionValue(ctx, scope?.sessionId, SKILL_USAGE_KEY));
 			if (view === void 0) return null;
-			if (view.slots.length === 0) return (0, react.createElement)("div", {
-				style: SECTION_STYLE$1,
-				"data-dsh-brief-sidebar": "memory-slots-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$2 }, t("section.memorySlots")), (0, react.createElement)("div", { style: EMPTY_STYLE$1 }, (0, react.createElement)("div", { style: {
+			const referenced = view.session.map((entry) => entry.name);
+			const rest = availableExcept(view.available, referenced);
+			const latestNames = view.latest?.names ?? [];
+			return (0, react.createElement)("div", {
+				style: SECTION_STYLE$3,
+				"data-dsh-brief-sidebar": "skill-usage-section"
+			}, !hideHeader && (0, react.createElement)("div", { style: HEADER_STYLE$4 }, t("section.skillUsage")), view.session.length === 0 && (0, react.createElement)("div", { style: EMPTY_STYLE$2 }, (0, react.createElement)("div", { style: {
 				marginBottom: 6,
 				color: "var(--dsw-alias-label-secondary)"
-			} }, t("slots.empty")), (0, react.createElement)("div", null, t("slots.emptyHint"))));
-			return (0, react.createElement)("div", {
-				style: SECTION_STYLE$1,
-				"data-dsh-brief-sidebar": "memory-slots-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$2 }, t("section.memorySlots")), (0, react.createElement)("ul", { style: LIST_STYLE$1 }, view.slots.map((slot) => (0, react.createElement)(SlotRow, {
-				key: slot.id,
-				slot,
-				t
-			}))), (0, react.createElement)("div", { style: TOTAL_STYLE }, expandCount(t("slots.openCount"), view.openCount)));
-		}
-		//#endregion
-		//#region src/client/summary/memory-recall.ts
-		/**
-		* The `memoryRecall` projection — reading it.
-		*
-		* The projection unit is registered by `dsh-prime-memory` (key `memoryRecall`,
-		* wire view `{rev, sessionId, count, items[]}`): the memories this session has
-		* actually injected. Unlike
-		* `memorySlots` (pinned, resident conventions written by hand), this set is
-		* NOT resident — it is the at-a-glance answer to "what did the model see".
-		* It survives compaction on purpose: `compact` only marks the entries whose
-		* text left the context as `superseded` (and `/clear` empties the set), so a
-		* retired row keeps its strike-through instead of vanishing.
-		*
-		* This plugin does NOT depend on prime-memory: with the unit unregistered the
-		* client reads `undefined` from the face and the section hides. The module is
-		* deliberately PURE — no React, no context, no IO — so the narrowing is
-		* testable directly, exactly like `memory-slots.ts`.
-		*/
-		/** The projection key `dsh-prime-memory` registers (its canonical constant). */
-		const MEMORY_RECALL_KEY = "memoryRecall";
-		/** Whether a value is a non-negative safe integer (the view's counter shape). */
-		function isCounter(value) {
-			return typeof value === "number" && Number.isSafeInteger(value) && value >= 0;
-		}
-		/** Narrow one item entry; `undefined` = malformed, dropped. */
-		function readItem(value) {
-			if (value === null || typeof value !== "object" || Array.isArray(value)) return void 0;
-			const raw = value;
-			if (typeof raw["id"] !== "string" || raw["id"].length === 0) return void 0;
-			if (typeof raw["type"] !== "string" || typeof raw["title"] !== "string") return void 0;
-			if (typeof raw["priority"] !== "number") return void 0;
-			const item = {
-				id: raw["id"],
-				type: raw["type"],
-				title: raw["title"],
-				priority: raw["priority"]
-			};
-			if (Array.isArray(raw["scenario"])) {
-				const phrases = raw["scenario"].filter((s) => typeof s === "string" && s.length > 0);
-				if (phrases.length > 0) item.scenario = phrases;
-			}
-			const rating = raw["rating"];
-			if (typeof rating === "number" && Number.isInteger(rating) && rating >= -1 && rating <= 5) item.rating = rating;
-			if (typeof raw["body"] === "string") item.body = raw["body"];
-			if (raw["retired"] === true) item.retired = true;
-			if (raw["superseded"] === true) item.superseded = true;
-			return item;
-		}
-		/**
-		* Narrow a raw projection value into a recall view.
-		*
-		* `undefined` means the capability is ABSENT (prime-memory not in the
-		* composition, or no frame carried the key) or the frame drifted beyond repair;
-		* a view with `items: []` IS the honest empty state (prime-memory publishes as
-		* soon as the unit registers). Malformed items are dropped, never thrown on.
-		*
-		* @param value - the raw `unknown` snapshot of the `memoryRecall` face.
-		* @returns the validated view, or `undefined` when the capability is absent.
-		*/
-		function readRecall(value) {
-			if (value === null || typeof value !== "object" || Array.isArray(value)) return void 0;
-			const raw = value;
-			if (!isCounter(raw["rev"]) || !isCounter(raw["count"])) return void 0;
-			if (typeof raw["sessionId"] !== "string") return void 0;
-			if (!Array.isArray(raw["items"])) return void 0;
-			const items = [];
-			for (const entry of raw["items"]) {
-				const item = readItem(entry);
-				if (item !== void 0) items.push(item);
-			}
-			return {
-				rev: raw["rev"],
-				sessionId: raw["sessionId"],
-				count: raw["count"],
-				items
-			};
+			} }, t("skillUsage.empty")), (0, react.createElement)("div", null, t("skillUsage.emptyHint"))), view.session.length > 0 && (0, react.createElement)(GroupHeader, {
+				text: expandCount(t("skillUsage.invokedGroup"), view.session.length),
+				marker: "skill-usage-invoked-group"
+			}), (0, react.createElement)("ul", { style: LIST_STYLE$2 }, view.session.map((entry) => (0, react.createElement)("li", {
+				key: entry.name,
+				style: ROW_STYLE$3,
+				"data-dsh-brief-sidebar": "skill-usage-row"
+			}, (0, react.createElement)("span", { style: NAME_STYLE$1 }, entry.name), (0, react.createElement)("span", { style: COUNT_STYLE }, expandPair(t("skillUsage.uses"), entry.count, entry.count)), latestNames.includes(entry.name) && (0, react.createElement)("span", { style: TAG_STYLE }, t("skillUsage.latestTag"))))), rest.length > 0 && (0, react.createElement)(FoldToggle, {
+				label: expandCount(t("skillUsage.availableGroup"), rest.length),
+				open: availableOpen,
+				marker: "skill-usage-available-toggle",
+				onToggle: () => {
+					setAvailableOpen((current) => !current);
+				}
+			}), rest.length > 0 && view.availableCount > view.available.length && (0, react.createElement)(GroupCaption, {
+				text: expandCount(t("skillUsage.availableCapped"), view.availableCount),
+				marker: "skill-usage-available-capped"
+			}), availableOpen && (0, react.createElement)("ul", { style: LIST_STYLE$2 }, rest.map((name) => (0, react.createElement)("li", {
+				key: name,
+				style: ROW_STYLE$3,
+				"data-dsh-brief-sidebar": "skill-usage-available-row"
+			}, (0, react.createElement)("span", { style: NAME_STYLE$1 }, name)))), view.session.length > 0 && (0, react.createElement)("div", { style: FOOTER_STYLE$2 }, expandPair(t("skillUsage.count"), view.callTotal, view.sessionTotal)));
 		}
 		//#endregion
 		//#region src/client/summary/recall-feedback.ts
@@ -2236,7 +2084,7 @@ window.__ModuleLoader__.load({
 			fontSize: 11,
 			lineHeight: "16px"
 		};
-		const BODY_STYLE$1 = {
+		const BODY_STYLE$2 = {
 			minWidth: 0,
 			overflowWrap: "anywhere",
 			whiteSpace: "pre-wrap",
@@ -2258,7 +2106,7 @@ window.__ModuleLoader__.load({
 		};
 		/** A retired record stays readable in the bubble, just marked. */
 		const STALE_BODY_STYLE = {
-			...BODY_STYLE$1,
+			...BODY_STYLE$2,
 			textDecoration: "line-through"
 		};
 		/**
@@ -2285,7 +2133,7 @@ window.__ModuleLoader__.load({
 				},
 				"data-dsh-brief-sidebar": "recall-bubble",
 				role: "tooltip"
-			}, (0, react.createElement)("span", { style: TYPE_STYLE$1 }, item.type), (0, react.createElement)("div", { style: stale ? STALE_BODY_STYLE : BODY_STYLE$1 }, item.body ?? `${item.title}\n${t("recall.noBody")}`), scenario !== void 0 && (0, react.createElement)("div", { style: SCENARIO_STYLE$1 }, scenario), (0, react.createElement)("div", { style: FOOTER_STYLE$1 }, foot));
+			}, (0, react.createElement)("span", { style: TYPE_STYLE$1 }, item.type), (0, react.createElement)("div", { style: stale ? STALE_BODY_STYLE : BODY_STYLE$2 }, item.body ?? `${item.title}\n${t("recall.noBody")}`), scenario !== void 0 && (0, react.createElement)("div", { style: SCENARIO_STYLE$1 }, scenario), (0, react.createElement)("div", { style: FOOTER_STYLE$1 }, foot));
 		}
 		//#endregion
 		//#region src/client/summary/MemoryRecallSection.tsx
@@ -2331,11 +2179,11 @@ window.__ModuleLoader__.load({
 		* Colours come from `--dsw-alias-*` tokens only (skin contract, enforced by
 		* `tests/purity.spec.ts`).
 		*/
-		const SECTION_STYLE = {
+		const SECTION_STYLE$2 = {
 			flexShrink: 0,
 			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
 		};
-		const HEADER_STYLE$1 = {
+		const HEADER_STYLE$3 = {
 			padding: "10px 12px 0",
 			color: "var(--dsw-alias-label-secondary)",
 			fontSize: 12,
@@ -2347,14 +2195,14 @@ window.__ModuleLoader__.load({
 			fontSize: 11,
 			lineHeight: "15px"
 		};
-		const LIST_STYLE = {
+		const LIST_STYLE$1 = {
 			listStyle: "none",
 			margin: 0,
 			padding: "6px 0",
 			display: "flex",
 			flexDirection: "column"
 		};
-		const ROW_STYLE$1 = {
+		const ROW_STYLE$2 = {
 			display: "flex",
 			alignItems: "flex-start",
 			gap: 8,
@@ -2362,7 +2210,7 @@ window.__ModuleLoader__.load({
 		};
 		/** Selected row: one hairline of accent, no colour literal (skin contract). */
 		const ROW_SELECTED_STYLE = {
-			...ROW_STYLE$1,
+			...ROW_STYLE$2,
 			background: "var(--dsw-alias-fill-quaternary)"
 		};
 		/** The type pill: same form as the slot kind pill, tertiary emphasis. */
@@ -2376,7 +2224,7 @@ window.__ModuleLoader__.load({
 			lineHeight: "16px",
 			whiteSpace: "nowrap"
 		};
-		const TITLE_STYLE = {
+		const TITLE_STYLE$1 = {
 			minWidth: 0,
 			color: "var(--dsw-alias-label-secondary)",
 			display: "-webkit-box",
@@ -2402,7 +2250,7 @@ window.__ModuleLoader__.load({
 			fontSize: 11,
 			lineHeight: "16px"
 		};
-		const META_STYLE = {
+		const META_STYLE$1 = {
 			flexShrink: 0,
 			color: "var(--dsw-alias-label-tertiary)",
 			fontSize: 11,
@@ -2414,7 +2262,7 @@ window.__ModuleLoader__.load({
 			color: "var(--dsw-alias-label-tertiary)",
 			fontSize: 12
 		};
-		const EMPTY_STYLE = {
+		const EMPTY_STYLE$1 = {
 			margin: "0 auto",
 			padding: 24,
 			maxWidth: 460,
@@ -2530,11 +2378,11 @@ window.__ModuleLoader__.load({
 			const staleText = stale && mark !== -1 ? t("recall.obsoleted") : void 0;
 			const selectable = props.rating && !stale;
 			const titleStyle = stale ? {
-				...TITLE_STYLE,
+				...TITLE_STYLE$1,
 				...STRIKE_STYLE
-			} : TITLE_STYLE;
+			} : TITLE_STYLE$1;
 			return (0, react.createElement)("li", {
-				style: selected && props.rating ? ROW_SELECTED_STYLE : ROW_STYLE$1,
+				style: selected && props.rating ? ROW_SELECTED_STYLE : ROW_STYLE$2,
 				onClick: selectable ? props.onSelect : void 0,
 				onMouseEnter: (e) => {
 					const el = e.currentTarget;
@@ -2563,7 +2411,7 @@ window.__ModuleLoader__.load({
 				confirmLabel: t("recall.obsoleteConfirm"),
 				whyLabel: t("recall.obsoleteWhy"),
 				onScore: props.onScore
-			})), (0, react.createElement)("span", { style: META_STYLE }, `P${item.priority}`));
+			})), (0, react.createElement)("span", { style: META_STYLE$1 }, `P${item.priority}`));
 		}
 		/** How long the `-1` button stays armed before reverting to its plain label. */
 		const ARM_WINDOW_MS = 5e3;
@@ -2669,10 +2517,10 @@ window.__ModuleLoader__.load({
 			const historyRows = view.items.filter((item) => item.superseded === true && item.retired !== true);
 			const hidden = historyRows.length;
 			if (rows.length === 0) return (0, react.createElement)("div", {
-				style: SECTION_STYLE,
+				style: SECTION_STYLE$2,
 				"data-dsh-brief-sidebar": "memory-recall-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$1 }, t("section.memoryRecall")), (0, react.createElement)("div", {
-				style: EMPTY_STYLE,
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$3 }, t("section.memoryRecall")), (0, react.createElement)("div", {
+				style: EMPTY_STYLE$1,
 				...hidden > 0 ? { "data-dsh-brief-sidebar": "recall-superseded-note" } : {}
 			}, hidden > 0 ? expandCount(t("recall.supersededHidden"), hidden) : t("recall.empty")), historyRows.length > 0 && (0, react.createElement)(FoldToggle, {
 				label: expandCount(t("recall.historyGroup"), historyRows.length),
@@ -2681,7 +2529,7 @@ window.__ModuleLoader__.load({
 				onToggle: () => {
 					setHistoryOpen((current) => !current);
 				}
-			}), historyOpen && (0, react.createElement)("ul", { style: LIST_STYLE }, historyRows.map((item) => (0, react.createElement)(RecallRow, {
+			}), historyOpen && (0, react.createElement)("ul", { style: LIST_STYLE$1 }, historyRows.map((item) => (0, react.createElement)(RecallRow, {
 				key: item.id,
 				item,
 				selected: false,
@@ -2699,12 +2547,12 @@ window.__ModuleLoader__.load({
 				onLeave: () => {}
 			}))));
 			return (0, react.createElement)("div", {
-				style: SECTION_STYLE,
+				style: SECTION_STYLE$2,
 				"data-dsh-brief-sidebar": "memory-recall-section"
-			}, (0, react.createElement)("div", { style: HEADER_STYLE$1 }, t("section.memoryRecall")), rating && (0, react.createElement)("div", { style: HINT_STYLE$1 }, `${t("recall.rateHint")}${t("recall.strikeHint")}`), rows.length > 0 && (0, react.createElement)(GroupHeader, {
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$3 }, t("section.memoryRecall")), rating && (0, react.createElement)("div", { style: HINT_STYLE$1 }, `${t("recall.rateHint")}${t("recall.strikeHint")}`), rows.length > 0 && (0, react.createElement)(GroupHeader, {
 				text: expandCount(t("recall.activeGroup"), rows.length),
 				marker: "recall-active-group"
-			}), (0, react.createElement)("ul", { style: LIST_STYLE }, rows.map((item) => (0, react.createElement)(RecallRow, {
+			}), (0, react.createElement)("ul", { style: LIST_STYLE$1 }, rows.map((item) => (0, react.createElement)(RecallRow, {
 				key: item.id,
 				item,
 				selected: selectedId === item.id,
@@ -2733,7 +2581,7 @@ window.__ModuleLoader__.load({
 				onToggle: () => {
 					setHistoryOpen((current) => !current);
 				}
-			}), historyOpen && (0, react.createElement)("ul", { style: LIST_STYLE }, historyRows.map((item) => (0, react.createElement)(RecallRow, {
+			}), historyOpen && (0, react.createElement)("ul", { style: LIST_STYLE$1 }, historyRows.map((item) => (0, react.createElement)(RecallRow, {
 				key: item.id,
 				item,
 				selected: false,
@@ -2760,16 +2608,337 @@ window.__ModuleLoader__.load({
 			})());
 		}
 		//#endregion
+		//#region src/client/summary/MemorySlotsSection.tsx
+		/**
+		* The memory-slots section: the `memorySlots` projection drawn as the third
+		* part of the summary tab (fixed last: 进展 → 产物 → 记忆).
+		*
+		* TWO gates, both fail-open to "hidden", so a host without dsh-prime-memory
+		* paints nothing here:
+		*
+		* 1. **The switch.** This plugin's entry config (`configForms` → entry
+		*    `dsh-brief-sidebar`, field `showMemorySlots`, default OFF — the pinned
+		*    list moved out of the summary pane's way in favour of the session-recall
+		*    section). When the config face cannot answer (service absent, scope not
+		*    ready, field unset) the default applies — see `scope-face.ts`.
+		* 2. **The capability.** The `memorySlots` projection must exist for the
+		*    session; `undefined` hides the section entirely, exactly like the
+		*    optional deliverables section.
+		*
+		* Colours come from `--dsw-alias-*` tokens only (skin contract, enforced by
+		* `tests/purity.spec.ts`).
+		*/
+		const SECTION_STYLE$1 = {
+			flexShrink: 0,
+			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
+		};
+		const HEADER_STYLE$2 = {
+			padding: "10px 12px 0",
+			color: "var(--dsw-alias-label-secondary)",
+			fontSize: 12,
+			fontWeight: 600
+		};
+		const LIST_STYLE = {
+			listStyle: "none",
+			margin: 0,
+			padding: "6px 0",
+			display: "flex",
+			flexDirection: "column"
+		};
+		const ROW_STYLE$1 = {
+			display: "flex",
+			alignItems: "flex-start",
+			gap: 8,
+			padding: "6px 12px"
+		};
+		const TITLE_STYLE = {
+			minWidth: 0,
+			overflowWrap: "anywhere",
+			color: "var(--dsw-alias-label-secondary)"
+		};
+		const META_STYLE = {
+			flexShrink: 0,
+			color: "var(--dsw-alias-label-tertiary)",
+			fontSize: 11,
+			lineHeight: "18px",
+			whiteSpace: "nowrap"
+		};
+		/** The kind pill: same form as the codeplan pill, tertiary emphasis. */
+		const KIND_STYLE = {
+			flexShrink: 0,
+			color: "var(--dsw-alias-label-tertiary)",
+			border: "1px solid var(--dsw-alias-label-tertiary)",
+			borderRadius: 999,
+			padding: "0 6px",
+			fontSize: 11,
+			lineHeight: "16px",
+			whiteSpace: "nowrap"
+		};
+		/** The status pill: filled tint for an open slot, plain text otherwise. */
+		const STATUS_OPEN_STYLE = {
+			flexShrink: 0,
+			color: "var(--dsw-alias-label-primary)",
+			border: "1px solid var(--dsw-alias-label-secondary)",
+			borderRadius: 999,
+			padding: "0 6px",
+			fontSize: 11,
+			lineHeight: "16px",
+			whiteSpace: "nowrap"
+		};
+		const STATUS_SETTLED_STYLE = {
+			...STATUS_OPEN_STYLE,
+			color: "var(--dsw-alias-label-tertiary)",
+			border: "1px solid var(--dsw-alias-label-tertiary)"
+		};
+		const BODY_STYLE$1 = {
+			margin: 0,
+			minWidth: 0,
+			overflowWrap: "anywhere",
+			color: "var(--dsw-alias-label-tertiary)",
+			fontSize: 12,
+			lineHeight: "18px"
+		};
+		const REFS_STYLE = {
+			...BODY_STYLE$1,
+			fontSize: 11
+		};
+		const TOTAL_STYLE = {
+			padding: "6px 12px 10px",
+			color: "var(--dsw-alias-label-tertiary)",
+			fontSize: 12
+		};
+		const EMPTY_STYLE = {
+			margin: "0 auto",
+			padding: 24,
+			maxWidth: 460,
+			textAlign: "center",
+			color: "var(--dsw-alias-label-tertiary)",
+			lineHeight: 1.7,
+			fontSize: 12
+		};
+		/** Locale key per known slot status; unknown statuses fall back to the raw wire value. */
+		const STATUS_KEY = {
+			open: "slots.status.open",
+			done: "slots.status.done",
+			dropped: "slots.status.dropped",
+			expired: "slots.status.expired"
+		};
+		/**
+		* One slot row: kind pill, title (full body rides the tooltip), status pill,
+		* priority; body line underneath when the wire view carries it; refs as
+		* resolved 名称简述 (record_id → title) with the raw refs on the tooltip, or
+		* raw refs when the host has not resolved them.
+		*/
+		function SlotRow(props) {
+			const { slot, t } = props;
+			const statusLabel = STATUS_KEY[slot.status] === void 0 ? slot.status : t(STATUS_KEY[slot.status]);
+			const title = slot.body === void 0 ? slot.title : `${slot.title} — ${slot.body}`;
+			const refsLine = slot.refViews !== void 0 ? slot.refViews.map((view) => view.title).join(" · ") : slot.refs !== void 0 ? slot.refs.join(" · ") : void 0;
+			return (0, react.createElement)("li", { style: ROW_STYLE$1 }, (0, react.createElement)("span", { style: KIND_STYLE }, slot.kind), (0, react.createElement)("div", { style: {
+				minWidth: 0,
+				flex: "1 1 auto",
+				display: "flex",
+				flexDirection: "column",
+				gap: 2
+			} }, (0, react.createElement)("span", {
+				style: TITLE_STYLE,
+				title
+			}, slot.title), slot.body !== void 0 && (0, react.createElement)("p", { style: BODY_STYLE$1 }, truncateBody(slot.body)), refsLine !== void 0 && (0, react.createElement)("p", {
+				style: REFS_STYLE,
+				title: slot.refs !== void 0 ? slot.refs.join("\n") : void 0
+			}, refsLine)), (0, react.createElement)("span", { style: META_STYLE }, `P${slot.priority}`), (0, react.createElement)("span", { style: slot.status === "open" ? STATUS_OPEN_STYLE : STATUS_SETTLED_STYLE }, statusLabel));
+		}
+		/**
+		* Subscribe to this plugin's entry config and resolve the slots switch.
+		* Plumbing lives in `use-config-flag`; the default (off) lives in the resolver.
+		*
+		* @param ctx - the client root context handed to the tab body.
+		* @returns whether the memory-slots section may render at all.
+		*/
+		function useShowMemorySlots(ctx) {
+			return useConfigFlag(ctx, resolveShowMemorySlots);
+		}
+		/**
+		* The memory-slots section. Both hooks run unconditionally (a conditional
+		* hook order would break the moment the switch flips); the switch only
+		* decides whether the resolved view paints.
+		* @param props - translation, client context, session scope.
+		*/
+		function MemorySlotsSection(props) {
+			const { t, ctx, scope } = props;
+			const show = useShowMemorySlots(ctx);
+			const view = readSlots(useProjectionValue(ctx, scope?.sessionId, MEMORY_SLOTS_KEY));
+			if (show === false) return null;
+			if (view === void 0) return null;
+			if (view.slots.length === 0) return (0, react.createElement)("div", {
+				style: SECTION_STYLE$1,
+				"data-dsh-brief-sidebar": "memory-slots-section"
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$2 }, t("section.memorySlots")), (0, react.createElement)("div", { style: EMPTY_STYLE }, (0, react.createElement)("div", { style: {
+				marginBottom: 6,
+				color: "var(--dsw-alias-label-secondary)"
+			} }, t("slots.empty")), (0, react.createElement)("div", null, t("slots.emptyHint"))));
+			return (0, react.createElement)("div", {
+				style: SECTION_STYLE$1,
+				"data-dsh-brief-sidebar": "memory-slots-section"
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$2 }, t("section.memorySlots")), (0, react.createElement)("ul", { style: LIST_STYLE }, view.slots.map((slot) => (0, react.createElement)(SlotRow, {
+				key: slot.id,
+				slot,
+				t
+			}))), (0, react.createElement)("div", { style: TOTAL_STYLE }, expandCount(t("slots.openCount"), view.openCount)));
+		}
+		//#endregion
+		//#region src/client/summary/ReferenceSection.tsx
+		/**
+		* The references section: 技能与记忆并列成两个可左右切换的页签。
+		*
+		* Why a tab strip instead of three stacked sections: the two lists answer the
+		* same question — "what entered this session's context" — from two different
+		* providers (this plugin's own skill fold, and prime-memory's recall/slots).
+		* Stacked, they pushed the board and the produced files off screen on a narrow
+		* sidebar; side by side, each gets the full width when the reader actually
+		* wants it.
+		*
+		* Two decisions worth knowing when editing this file:
+		*
+		* 1. **The inactive pane stays mounted and is hidden with `display:none`.**
+		*    The recall pane carries real interaction state (selected row, pending
+		*    rating, the expanded history group); unmounting it would silently reset
+		*    what the human just did every time they glanced at the skills tab. The
+		*    cost is that a hidden pane keeps re-rendering on projection frames —
+		*    bounded, because the whole tab still renders nothing while `visible` is
+		*    false (see `SummaryTab`).
+		* 2. **The parent repeats its children's gates.** A section that hides itself
+		*    leaves the tab strip pointing at an empty pane, so the availability
+		*    question is answered here with the SAME readers and resolvers the children
+		*    use. `tests/reference-section.spec.tsx` pins both sides against the same
+		*    fixtures — if a child gate ever drifts from this one, that test goes red
+		*    rather than the UI growing a dead tab.
+		*
+		* Colours come from `--dsw-alias-*` tokens only (skin contract).
+		*/
+		const SECTION_STYLE = {
+			flexShrink: 0,
+			borderBottom: "1px solid var(--dsw-alias-border-secondary)"
+		};
+		const HEADER_STYLE$1 = {
+			padding: "10px 12px 0",
+			color: "var(--dsw-alias-label-secondary)",
+			fontSize: 12,
+			fontWeight: 600
+		};
+		/** The tab strip: flush-left, same gutter as section headers. */
+		const TABS_STYLE = {
+			display: "flex",
+			gap: 4,
+			padding: "6px 12px 0"
+		};
+		/** One tab. Selected gets a hairline of secondary label; never a colour literal. */
+		const TAB_STYLE = {
+			background: "none",
+			border: "none",
+			borderBottom: "1px solid transparent",
+			font: "inherit",
+			fontSize: 12,
+			color: "var(--dsw-alias-label-tertiary)",
+			cursor: "pointer",
+			padding: "4px 8px 6px"
+		};
+		const TAB_ACTIVE_STYLE = {
+			...TAB_STYLE,
+			borderBottom: "1px solid var(--dsw-alias-label-secondary)",
+			color: "var(--dsw-alias-label-primary)",
+			fontWeight: 600
+		};
+		const ORDER = ["skills", "memory"];
+		/**
+		* The references section. All hooks run before any early return, so the tab
+		* strip can disappear (no capability at all) without ever changing hook order.
+		*
+		* @param props - translation, client context, session scope, rating transport.
+		*/
+		function ReferenceSection(props) {
+			const { t, ctx, scope, fetchImpl } = props;
+			const [tab, setTab] = (0, react.useState)("skills");
+			const skillsLive = readSkillUsage(useProjectionValue(ctx, scope?.sessionId, SKILL_USAGE_KEY)) !== void 0;
+			const recallFrame = readRecall(useProjectionValue(ctx, scope?.sessionId, MEMORY_RECALL_KEY));
+			const slotsFrame = readSlots(useProjectionValue(ctx, scope?.sessionId, MEMORY_SLOTS_KEY));
+			const recallOn = useConfigFlag(ctx, resolveShowMemoryRecall) !== false;
+			const slotsOn = useConfigFlag(ctx, resolveShowMemorySlots) === true;
+			const memoryLive = recallFrame !== void 0 && recallOn || slotsFrame !== void 0 && slotsOn;
+			const onTabsKeyDown = (0, react.useCallback)((event) => {
+				if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return;
+				event.preventDefault();
+				const at = ORDER.indexOf(tab);
+				const step = event.key === "ArrowRight" ? 1 : ORDER.length - 1;
+				setTab(ORDER[(at + step) % ORDER.length]);
+			}, [tab]);
+			if (!skillsLive && !memoryLive) return null;
+			const tabButton = (id, label) => (0, react.createElement)("button", {
+				key: id,
+				type: "button",
+				role: "tab",
+				id: `dsh-brief-reference-tab-${id}`,
+				"aria-selected": active === id,
+				"aria-controls": `dsh-brief-reference-pane-${id}`,
+				style: active === id ? TAB_ACTIVE_STYLE : TAB_STYLE,
+				"data-dsh-brief-sidebar": `reference-tab-${id}`,
+				onClick: () => {
+					setTab(id);
+				}
+			}, label);
+			const active = tab === "skills" && !skillsLive ? "memory" : tab;
+			return (0, react.createElement)("div", {
+				style: SECTION_STYLE,
+				"data-dsh-brief-sidebar": "references-section"
+			}, (0, react.createElement)("div", { style: HEADER_STYLE$1 }, t("section.references")), (0, react.createElement)("div", {
+				role: "tablist",
+				"aria-label": t("section.references"),
+				style: TABS_STYLE,
+				onKeyDown: onTabsKeyDown,
+				"data-dsh-brief-sidebar": "reference-tabs"
+			}, skillsLive && tabButton("skills", t("references.tabSkills")), memoryLive && tabButton("memory", t("references.tabMemory"))), skillsLive && (0, react.createElement)("div", {
+				role: "tabpanel",
+				id: "dsh-brief-reference-pane-skills",
+				"aria-labelledby": "dsh-brief-reference-tab-skills",
+				hidden: active !== "skills",
+				style: active === "skills" ? void 0 : { display: "none" },
+				"data-dsh-brief-sidebar": "reference-pane-skills"
+			}, (0, react.createElement)(SkillUsageSection, {
+				t,
+				ctx,
+				scope,
+				hideHeader: true
+			})), memoryLive && (0, react.createElement)("div", {
+				role: "tabpanel",
+				id: "dsh-brief-reference-pane-memory",
+				"aria-labelledby": "dsh-brief-reference-tab-memory",
+				hidden: active !== "memory",
+				style: active === "memory" ? void 0 : { display: "none" },
+				"data-dsh-brief-sidebar": "reference-pane-memory"
+			}, (0, react.createElement)(MemoryRecallSection, {
+				t,
+				ctx,
+				scope,
+				fetchImpl
+			}), (0, react.createElement)(MemorySlotsSection, {
+				t,
+				ctx,
+				scope
+			})));
+		}
+		//#endregion
 		//#region src/client/SummaryTab.tsx
 		/**
 		* The summary tab body: the session's at-a-glance state, composed of sections.
 		*
 		* Section order: 进展 (the todos board) → 产物 (produced files, codeplan
-		* artifacts marked inline) → 技能引用 (which skills this session loaded) →
-		* 本会话召回 (what prime-memory injected into this session and compaction has
-		* not overwritten) → 记忆槽位 (hand-pinned resident conventions, off by default).
-		* Each section owns its own data chain and its own gating contract; this
-		* component owns only the shell.
+		* artifacts marked inline) → 引用 (two switchable tabs: 技能 and 记忆).
+		* The reference tabs replaced three stacked sections: which skills entered the
+		* session, what prime-memory injected and compaction has not overwritten, and
+		* the hand-pinned resident slots — all three answer "what is in this session's
+		* context", and stacking them pushed the board off a narrow sidebar. Each pane
+		* keeps its own data chain and its own gating contract; this component owns
+		* only the shell.
 		*
 		* Two better-sidebar contracts are honoured:
 		*
@@ -2816,18 +2985,8 @@ window.__ModuleLoader__.load({
 				t,
 				ctx,
 				scope
-			}), (0, react.createElement)(SkillUsageSection, {
-				key: "skill-usage",
-				t,
-				ctx,
-				scope
-			}), (0, react.createElement)(MemoryRecallSection, {
-				key: "memory-recall",
-				t,
-				ctx,
-				scope
-			}), (0, react.createElement)(MemorySlotsSection, {
-				key: "memory-slots",
+			}), (0, react.createElement)(ReferenceSection, {
+				key: "references",
 				t,
 				ctx,
 				scope