diff --git a/components/Timeline.tsx b/components/Timeline.tsx
index ecc1044..1b41417 100644
--- a/components/Timeline.tsx
+++ b/components/Timeline.tsx
@@ -33,6 +33,7 @@ import {
trimEdgeBounds,
} from "@/lib/edits";
import type { ClipSegment, Word } from "@/lib/types";
+import { isDisfluencyPlaceholder } from "@/lib/disfluencies";
import { VAD_SAMPLE_RATE } from "@/lib/vad";
import { useCutRanges } from "@/hooks/useCutRanges";
import { useIsDark } from "@/hooks/useIsDark";
@@ -726,6 +727,7 @@ export default function Timeline() {
const hovered = hoveredWordId === w.id;
const cutOut = isWordCutOut(w, cuts);
const wordSelected = selectedWordIds.includes(w.id);
+ const placeholder = isDisfluencyPlaceholder(w.text);
const showWordHandles = showHandles && (hovered || wWidth > 28);
return (
setHoveredWordId(w.id)}
onPointerLeave={() =>
diff --git a/components/TranscriptPanel.tsx b/components/TranscriptPanel.tsx
index 003b2a1..3eb1d01 100644
--- a/components/TranscriptPanel.tsx
+++ b/components/TranscriptPanel.tsx
@@ -16,6 +16,7 @@ import {
X,
} from "lucide-react";
import { useEditorStore } from "@/lib/store";
+import { isDisfluencyPlaceholder } from "@/lib/disfluencies";
import { findFillerWordIds } from "@/lib/fillers";
import { findSilenceRanges } from "@/lib/silences";
import {
@@ -60,18 +61,23 @@ const WordSpan = memo(function WordSpan({
active: boolean;
onClick: (word: Word, el: HTMLElement) => void;
}) {
+ const placeholder = isDisfluencyPlaceholder(word.text);
// The trailing space lives inside the span so that selection and deletion
// highlights are continuous across words instead of breaking at each gap.
return (
onClick(word, e.currentTarget)}
className={`py-0.5 cursor-pointer transition-colors duration-75 ${cutOut
? "word-deleted bg-red-50 text-red-600 line-through decoration-red-300 dark:bg-red-950/40 dark:text-red-400 dark:decoration-red-800"
: active
? "bg-neutral-200/80 text-zinc-900 dark:bg-neutral-700/80 dark:text-zinc-50"
- : "text-zinc-800 hover:bg-neutral-50 dark:text-zinc-200 dark:hover:bg-neutral-800/60"
+ : placeholder
+ ? "font-medium text-amber-700/90 hover:bg-amber-50 dark:text-amber-400/90 dark:hover:bg-amber-950/40"
+ : "text-zinc-800 hover:bg-neutral-50 dark:text-zinc-200 dark:hover:bg-neutral-800/60"
}`}
>
{word.text}{" "}
@@ -315,7 +321,7 @@ export default function TranscriptPanel() {
{status === "ready" && fillerIds.length > 0 && (