fix(ui): keep the timeline's total when filtering, drop empty diff lines, use --mono

.lintstagedrc.json

@@ -1,4 +1,6 @@
 {
-	"*.{js,ts,tsx,jsx,mjs,cjs}": ["npx biome check --write"],
-	"*.{json,md,yaml,yml}": ["npx biome check --write"]
+	"*.{js,ts,tsx,jsx,mjs,cjs}": [
+		"npx biome check --write --no-errors-on-unmatched"
+	],
+	"*.{json,md,yaml,yml}": ["npx biome check --write --no-errors-on-unmatched"]
 }

src/disputes/RevertClusterDisplay.ts

@@ -66,7 +66,7 @@ export class RevertClusterDisplay {
 			if (cluster.section) {
 				const section = document.createElement("div");
 				section.style.cssText =
-					"font-size:0.78rem;color:var(--text-dim);margin-bottom:0.3rem;font-family:var(--font-mono);";
+					"font-size:0.78rem;color:var(--text-dim);margin-bottom:0.3rem;font-family:var(--mono);";
 				section.textContent = cluster.section;
 				card.appendChild(section);
 			}

src/language/CertaintyTimeline.ts

@@ -100,7 +100,7 @@ export class CertaintyTimeline {
 		const info = document.createElement("div");
 		info.id = "certainty-info";
 		info.style.cssText =
-			"font-size:0.78rem;color:var(--text-dim);margin-top:0.25rem;font-family:var(--font-mono);";
+			"font-size:0.78rem;color:var(--text-dim);margin-top:0.25rem;font-family:var(--mono);";
 		info.textContent = "Click a dot for details.";
 		this.container.appendChild(info);
 

src/language/WordingDiffCard.ts

@@ -60,19 +60,25 @@ export class WordingDiffCard {
 			body.textContent = ch.summary;
 			card.appendChild(body);
 
+			// A sentence seen for the first time has no "before" and a removed
+			// one has no "after"; each printed an empty − or + line.
 			if (ch.before !== ch.after) {
-				const beforeEl = document.createElement("div");
-				beforeEl.className = "card-diff";
-				beforeEl.style.cssText +=
-					";border-left:3px solid var(--red);margin-bottom:2px;";
-				beforeEl.textContent = `− ${ch.before}`;
-				card.appendChild(beforeEl);
-
-				const afterEl = document.createElement("div");
-				afterEl.className = "card-diff";
-				afterEl.style.cssText += ";border-left:3px solid var(--green);";
-				afterEl.textContent = `+ ${ch.after}`;
-				card.appendChild(afterEl);
+				if (ch.before.trim()) {
+					const beforeEl = document.createElement("div");
+					beforeEl.className = "card-diff";
+					beforeEl.style.cssText +=
+						";border-left:3px solid var(--red);margin-bottom:2px;";
+					beforeEl.textContent = `− ${ch.before}`;
+					card.appendChild(beforeEl);
+				}
+
+				if (ch.after.trim()) {
+					const afterEl = document.createElement("div");
+					afterEl.className = "card-diff";
+					afterEl.style.cssText += ";border-left:3px solid var(--green);";
+					afterEl.textContent = `+ ${ch.after}`;
+					card.appendChild(afterEl);
+				}
 			}
 
 			grid.appendChild(card);

src/main.ts

@@ -70,6 +70,7 @@ new ImportUpload(document.getElementById("import-area")!, (events) => {
 	exportCtrl.setData(events);
 	const allTypes = collectEventTypes(events);
 	filter.setTypes(allTypes);
+	timelineView.setData(events);
 	updateAll(events);
 });
 
@@ -83,6 +84,7 @@ async function loadSampleData(): Promise<void> {
 		exportCtrl.setData(events);
 		const allTypes = collectEventTypes(events);
 		filter.setTypes(allTypes);
+		timelineView.setData(events);
 		updateAll(events);
 	} catch (err) {
 		console.warn("Could not load sample data:", err);
@@ -97,8 +99,10 @@ function collectEventTypes(events: EvidenceEvent[]): EventType[] {
 	return Array.from(set).sort();
 }
 
+// Every panel but the timeline. The timeline takes the full set once, on load,
+// and a filter through applyFilter, so its count reads "3 of 12". Setting its
+// data from here made the filtered set its total, and the count read "3 of 3".
 function updateAll(events: EvidenceEvent[]): void {
-	timelineView.setData(events);
 	citationChart.setData(events);
 	certaintyTimeline.setData(events);
 	schemaViewer.setData(events as unknown as Record<string, unknown>[]);

src/timeline/DiffView.ts

@@ -128,7 +128,7 @@ export class DiffView {
 
 		const sectionInfo = document.createElement("div");
 		sectionInfo.style.cssText =
-			"font-size:0.78rem;color:var(--text-dim);margin-bottom:0.5rem;font-family:var(--font-mono);";
+			"font-size:0.78rem;color:var(--text-dim);margin-bottom:0.5rem;font-family:var(--mono);";
 		sectionInfo.textContent = event.section || "(no section)";
 		this.container.appendChild(sectionInfo);