diff --git a/src/components/video-editor/EnterpriseSettingsPanel.tsx b/src/components/video-editor/EnterpriseSettingsPanel.tsx
index 686f9f8ab2..6e4b2a8e28 100644
--- a/src/components/video-editor/EnterpriseSettingsPanel.tsx
+++ b/src/components/video-editor/EnterpriseSettingsPanel.tsx
@@ -183,6 +183,8 @@ interface EnterpriseSettingsPanelProps {
 	subtitleStyle?: import("./types").SubtitleStyle;
 	onSubtitleStyleChange?: (style: Partial<import("./types").SubtitleStyle>) => void;
 	onSubtitleTextChange?: (id: string, text: string) => void;
+	/** Subtitle selected on the timeline; opens the Subtitles section and scrolls to it. */
+	selectedSubtitleId?: string | null;
 	onGenerateSubtitles?: () => void;
 	isGeneratingSubtitles?: boolean;
 	onClearSubtitles?: () => void;
@@ -284,6 +286,7 @@ export function EnterpriseSettingsPanel({
 	subtitleStyle,
 	onSubtitleStyleChange,
 	onSubtitleTextChange,
+	selectedSubtitleId,
 	onGenerateSubtitles,
 	isGeneratingSubtitles = false,
 	onClearSubtitles,
@@ -292,6 +295,25 @@ export function EnterpriseSettingsPanel({
 	const [wallpaperPaths, setWallpaperPaths] = useState<string[]>([]);
 	const [customImages, setCustomImages] = useState<string[]>([]);
 	const fileInputRef = useRef<HTMLInputElement>(null);
+	const [openSections, setOpenSections] = useState<string[]>(() =>
+		hasWebcam ? ["layout", "effects", "background"] : ["effects", "background"],
+	);
+	const subtitleItemRefs = useRef(new Map<string, HTMLTextAreaElement>());
+
+	// Timeline selection drives the sidebar: open the Subtitles section and bring
+	// the selected line's editor into view (after the accordion expand settles).
+	useEffect(() => {
+		if (!selectedSubtitleId) return;
+		setOpenSections((prev) => (prev.includes("subtitles") ? prev : [...prev, "subtitles"]));
+		const timer = window.setTimeout(() => {
+			const el = subtitleItemRefs.current.get(selectedSubtitleId);
+			if (el) {
+				el.scrollIntoView({ behavior: "smooth", block: "center" });
+				el.focus({ preventScroll: true });
+			}
+		}, 220);
+		return () => window.clearTimeout(timer);
+	}, [selectedSubtitleId]);
 
 	useEffect(() => {
 		let mounted = true;
@@ -716,7 +738,8 @@ export function EnterpriseSettingsPanel({
 
 				<Accordion
 					type="multiple"
-					defaultValue={hasWebcam ? ["layout", "effects", "background"] : ["effects", "background"]}
+					value={openSections}
+					onValueChange={setOpenSections}
 					className="space-y-1"
 				>
 					<AccordionItem value="layout" className="border-white/5 rounded-xl bg-white/[0.02] px-3">
@@ -1531,13 +1554,22 @@ export function EnterpriseSettingsPanel({
 													const mm = Math.floor(startSec / 60);
 													const ss = String(Math.floor(startSec % 60)).padStart(2, "0");
 													const ts = `${mm}:${ss}`;
+													const isSelected = sub.id === selectedSubtitleId;
 													return (
 														<div
 															key={sub.id}
-															className="group rounded-lg bg-white/[0.03] border border-white/5 p-2"
+															className={`group rounded-lg bg-white/[0.03] border p-2 ${
+																isSelected
+																	? "border-[#14b8a6]/60 bg-[#14b8a6]/[0.06]"
+																	: "border-white/5"
+															}`}
 														>
 															<div className="text-[10px] text-slate-600 mb-1 font-mono">{ts}</div>
 															<textarea
+																ref={(el) => {
+																	if (el) subtitleItemRefs.current.set(sub.id, el);
+																	else subtitleItemRefs.current.delete(sub.id);
+																}}
 																value={sub.text}
 																onChange={(e) => onSubtitleTextChange?.(sub.id, e.target.value)}
 																rows={2}
diff --git a/src/components/video-editor/VideoEditor.tsx b/src/components/video-editor/VideoEditor.tsx
index 984d5cdb55..71506ab38f 100644
--- a/src/components/video-editor/VideoEditor.tsx
+++ b/src/components/video-editor/VideoEditor.tsx
@@ -28,6 +28,7 @@ import { type Locale } from "@/i18n/config";
 import { getAvailableLocales, getLocaleName } from "@/i18n/loader";
 import {
 	captionSegmentsToAnnotationRegions,
+	captionSegmentsToSubtitleItems,
 	extractMono16kFromVideoUrl,
 	MAX_CAPTION_AUDIO_SEC,
 	reconcileAutoCaptionTimelineGaps,
@@ -305,6 +306,8 @@ export default function VideoEditor() {
 	const [selectedSpeedId, setSelectedSpeedId] = useState<string | null>(null);
 	const [selectedAnnotationId, setSelectedAnnotationId] = useState<string | null>(null);
 	const [selectedBlurId, setSelectedBlurId] = useState<string | null>(null);
+	const [selectedSubtitleId, setSelectedSubtitleId] = useState<string | null>(null);
+	const [sidebarTab, setSidebarTab] = useState("settings");
 	const [selectedWebcamFocusId, setSelectedWebcamFocusId] = useState<string | null>(null);
 	const [selectedWebcamSegmentId, setSelectedWebcamSegmentId] = useState<string | null>(null);
 	const [isExporting, setIsExporting] = useState(false);
@@ -393,6 +396,7 @@ export default function VideoEditor() {
 	const showCursorSettings = hasEditableCursorRecording;
 	const { locale, setLocale, t: rawT } = useI18n();
 	const [captionLanguage, setCaptionLanguage] = useState(() => captionLanguageForLocale(locale));
+	const [captionOutput, setCaptionOutput] = useState<"subtitles" | "annotations">("subtitles");
 	const t = useScopedT("editor");
 	const ts = useScopedT("settings");
 	const availableLocales = getAvailableLocales();
@@ -1149,6 +1153,7 @@ export default function VideoEditor() {
 			setSelectedSpeedId(null);
 			setSelectedAnnotationId(null);
 			setSelectedBlurId(null);
+			setSelectedSubtitleId(null);
 		}
 	}, []);
 
@@ -1159,6 +1164,7 @@ export default function VideoEditor() {
 			setSelectedSpeedId(null);
 			setSelectedAnnotationId(null);
 			setSelectedBlurId(null);
+			setSelectedSubtitleId(null);
 		}
 	}, []);
 
@@ -1169,6 +1175,7 @@ export default function VideoEditor() {
 			setSelectedTrimId(null);
 			setSelectedSpeedId(null);
 			setSelectedBlurId(null);
+			setSelectedSubtitleId(null);
 		}
 	}, []);
 
@@ -1179,6 +1186,20 @@ export default function VideoEditor() {
 			setSelectedTrimId(null);
 			setSelectedAnnotationId(null);
 			setSelectedSpeedId(null);
+			setSelectedSubtitleId(null);
+		}
+	}, []);
+
+	const handleSelectSubtitle = useCallback((id: string | null) => {
+		setSelectedSubtitleId(id);
+		if (id) {
+			setSelectedZoomId(null);
+			setSelectedTrimId(null);
+			setSelectedSpeedId(null);
+			setSelectedAnnotationId(null);
+			setSelectedBlurId(null);
+			// Jump the sidebar to this subtitle's editor (Enterprise tab).
+			setSidebarTab("enterprise");
 		}
 	}, []);
 
@@ -1747,6 +1768,29 @@ export default function VideoEditor() {
 		[selectedAnnotationId, selectedBlurId, pushState],
 	);
 
+	const handleSubtitleSpanChange = useCallback(
+		(id: string, span: Span) => {
+			pushState((prev) => ({
+				subtitleRegions: prev.subtitleRegions.map((s) =>
+					s.id === id ? { ...s, startMs: Math.round(span.start), endMs: Math.round(span.end) } : s,
+				),
+			}));
+		},
+		[pushState],
+	);
+
+	const handleSubtitleDelete = useCallback(
+		(id: string) => {
+			pushState((prev) => ({
+				subtitleRegions: prev.subtitleRegions.filter((s) => s.id !== id),
+			}));
+			if (selectedSubtitleId === id) {
+				setSelectedSubtitleId(null);
+			}
+		},
+		[selectedSubtitleId, pushState],
+	);
+
 	const handleAnnotationContentChange = useCallback(
 		(id: string, content: string) => {
 			pushState((prev) => ({
@@ -2093,6 +2137,12 @@ export default function VideoEditor() {
 		}
 	}, [selectedWebcamSegmentId, webcamSegments]);
 
+	useEffect(() => {
+		if (selectedSubtitleId && !subtitleRegions.some((s) => s.id === selectedSubtitleId)) {
+			setSelectedSubtitleId(null);
+		}
+	}, [selectedSubtitleId, subtitleRegions]);
+
 	const handleGenerateSubtitles = useCallback(async () => {
 		if (!videoSourcePath) {
 			toast.error("No video loaded");
@@ -2688,48 +2738,74 @@ export default function VideoEditor() {
 							}))
 						: segmentsRaw;
 
-				let { regions, nextNumericId, nextZIndex } = captionSegmentsToAnnotationRegions(
-					segments,
-					nextAnnotationIdRef.current,
-					nextAnnotationZIndexRef.current,
-					{
+				let createdCount = 0;
+				if (captionOutput === "subtitles") {
+					let items = captionSegmentsToSubtitleItems(segments, {
 						minWordsPerCaption: minW,
 						maxWordsPerCaption: maxW,
 						timestampGranularity: granularity,
-					},
-				);
-
-				if (regions.length === 0 && segments.length > 0) {
-					({ regions, nextNumericId, nextZIndex } = captionSegmentsToAnnotationRegions(
+					});
+					if (items.length === 0 && segments.length > 0) {
+						items = captionSegmentsToSubtitleItems(segments, {
+							minWordsPerCaption: 1,
+							maxWordsPerCaption: Number.MAX_SAFE_INTEGER,
+							timestampGranularity: granularity,
+						});
+					}
+					if (items.length === 0) {
+						toast.dismiss(AUTO_CAPTION_PROGRESS_TOAST_ID);
+						toast.info(t("autoCaptions.noneHeard"));
+						return;
+					}
+					// A generation describes the whole video: replace, like the sidebar
+					// subtitle generator does, instead of stacking duplicate lines.
+					pushState({ subtitleRegions: items, showSubtitles: true });
+					createdCount = items.length;
+				} else {
+					let { regions, nextNumericId, nextZIndex } = captionSegmentsToAnnotationRegions(
 						segments,
 						nextAnnotationIdRef.current,
 						nextAnnotationZIndexRef.current,
 						{
-							minWordsPerCaption: 1,
-							maxWordsPerCaption: Number.MAX_SAFE_INTEGER,
+							minWordsPerCaption: minW,
+							maxWordsPerCaption: maxW,
 							timestampGranularity: granularity,
 						},
-					));
-				}
+					);
 
-				if (regions.length === 0) {
-					toast.dismiss(AUTO_CAPTION_PROGRESS_TOAST_ID);
-					toast.info(t("autoCaptions.noneHeard"));
-					return;
-				}
+					if (regions.length === 0 && segments.length > 0) {
+						({ regions, nextNumericId, nextZIndex } = captionSegmentsToAnnotationRegions(
+							segments,
+							nextAnnotationIdRef.current,
+							nextAnnotationZIndexRef.current,
+							{
+								minWordsPerCaption: 1,
+								maxWordsPerCaption: Number.MAX_SAFE_INTEGER,
+								timestampGranularity: granularity,
+							},
+						));
+					}
+
+					if (regions.length === 0) {
+						toast.dismiss(AUTO_CAPTION_PROGRESS_TOAST_ID);
+						toast.info(t("autoCaptions.noneHeard"));
+						return;
+					}
 
-				pushState((prev) => ({ annotationRegions: [...prev.annotationRegions, ...regions] }));
-				nextAnnotationIdRef.current = nextNumericId;
-				nextAnnotationZIndexRef.current = nextZIndex;
+					pushState((prev) => ({ annotationRegions: [...prev.annotationRegions, ...regions] }));
+					nextAnnotationIdRef.current = nextNumericId;
+					nextAnnotationZIndexRef.current = nextZIndex;
+					createdCount = regions.length;
+				}
 
 				toast.dismiss(AUTO_CAPTION_PROGRESS_TOAST_ID);
 				const minutesTrunc = String(Math.round(MAX_CAPTION_AUDIO_SEC / 60));
 				if (truncated) {
-					toast.success(t("autoCaptions.done", { count: String(regions.length) }), {
+					toast.success(t("autoCaptions.done", { count: String(createdCount) }), {
 						description: t("autoCaptions.truncated", { minutes: minutesTrunc }),
 					});
 				} else {
-					toast.success(t("autoCaptions.done", { count: String(regions.length) }));
+					toast.success(t("autoCaptions.done", { count: String(createdCount) }));
 				}
 			} catch (e) {
 				console.error(e);
@@ -2741,7 +2817,7 @@ export default function VideoEditor() {
 				setIsAutoCaptioning(false);
 			}
 		},
-		[videoPath, trimRegions, pushState, t, captionLanguage],
+		[videoPath, trimRegions, pushState, t, captionLanguage, captionOutput],
 	);
 
 	const handleSaveDiagnostic = useCallback(async () => {
@@ -2821,6 +2897,21 @@ export default function VideoEditor() {
 						<DialogDescription>{t("autoCaptions.dialogDescription")}</DialogDescription>
 					</DialogHeader>
 					<div className="grid gap-4 py-2">
+						<div className="grid gap-2">
+							<Label htmlFor="caption-output">{t("autoCaptions.output")}</Label>
+							<Select
+								value={captionOutput}
+								onValueChange={(v) => setCaptionOutput(v as "subtitles" | "annotations")}
+							>
+								<SelectTrigger id="caption-output" className="h-9">
+									<SelectValue />
+								</SelectTrigger>
+								<SelectContent>
+									<SelectItem value="subtitles">{t("autoCaptions.outputSubtitles")}</SelectItem>
+									<SelectItem value="annotations">{t("autoCaptions.outputAnnotations")}</SelectItem>
+								</SelectContent>
+							</Select>
+						</div>
 						<div className="grid gap-2">
 							<Label htmlFor="caption-language">{t("autoCaptions.language")}</Label>
 							<Select value={captionLanguage} onValueChange={setCaptionLanguage}>
@@ -3097,7 +3188,11 @@ export default function VideoEditor() {
 								</div>
 
 								<div className="editor-settings-rail min-w-0 h-full">
-									<Tabs defaultValue="settings" className="flex h-full flex-col">
+									<Tabs
+										value={sidebarTab}
+										onValueChange={setSidebarTab}
+										className="flex h-full flex-col"
+									>
 										<TabsList className="mx-3 mt-2 grid grid-cols-2">
 											<TabsTrigger value="settings">Settings</TabsTrigger>
 											<TabsTrigger value="enterprise">Enterprise</TabsTrigger>
@@ -3417,6 +3512,7 @@ export default function VideoEditor() {
 												subtitleStyle={subtitleStyle}
 												onSubtitleStyleChange={handleSubtitleStyleChange}
 												onSubtitleTextChange={handleSubtitleTextChange}
+												selectedSubtitleId={selectedSubtitleId}
 												onGenerateSubtitles={handleGenerateSubtitles}
 												isGeneratingSubtitles={isGeneratingSubtitles}
 												onClearSubtitles={handleClearSubtitles}
@@ -3478,6 +3574,11 @@ export default function VideoEditor() {
 									onAnnotationDelete={handleAnnotationDelete}
 									selectedAnnotationId={selectedAnnotationId}
 									onSelectAnnotation={handleSelectAnnotation}
+									subtitleRegions={subtitleRegions}
+									onSubtitleSpanChange={handleSubtitleSpanChange}
+									onSubtitleDelete={handleSubtitleDelete}
+									selectedSubtitleId={selectedSubtitleId}
+									onSelectSubtitle={handleSelectSubtitle}
 									blurRegions={blurRegions}
 									onBlurAdded={handleBlurAdded}
 									onBlurSpanChange={handleAnnotationSpanChange}
diff --git a/src/components/video-editor/timeline/Item.tsx b/src/components/video-editor/timeline/Item.tsx
index be87945397..4d9434795f 100644
--- a/src/components/video-editor/timeline/Item.tsx
+++ b/src/components/video-editor/timeline/Item.tsx
@@ -17,7 +17,15 @@ interface ItemProps {
 	zoomCustomScale?: number;
 	speedValue?: number;
 	isAutoFocus?: boolean;
-	variant?: "zoom" | "trim" | "annotation" | "speed" | "blur" | "webcam-focus" | "webcam-segment";
+	variant?:
+		| "zoom"
+		| "trim"
+		| "annotation"
+		| "speed"
+		| "blur"
+		| "webcam-focus"
+		| "webcam-segment"
+		| "subtitle";
 }
 
 // Map zoom depth to multiplier labels
@@ -65,6 +73,7 @@ export default function Item({
 	const isSpeed = variant === "speed";
 	const isWebcamFocus = variant === "webcam-focus";
 	const isWebcamSegment = variant === "webcam-segment";
+	const isSubtitle = variant === "subtitle";
 
 	const glassClass = isZoom
 		? glassStyles.glassGreen
@@ -76,7 +85,9 @@ export default function Item({
 					? glassStyles.glassBlue
 					: isWebcamSegment
 						? glassStyles.glassPurple
-						: glassStyles.glassYellow;
+						: isSubtitle
+							? glassStyles.glassTeal
+							: glassStyles.glassYellow;
 
 	const endCapColor = isZoom
 		? "#21916A"
@@ -88,7 +99,9 @@ export default function Item({
 					? "#4f46e5"
 					: isWebcamSegment
 						? "#9333ea"
-						: "#B4A046";
+						: isSubtitle
+							? "#0d9488"
+							: "#B4A046";
 
 	const timeLabel = useMemo(
 		() => `${formatMs(span.start)} – ${formatMs(span.end)}`,
diff --git a/src/components/video-editor/timeline/ItemGlass.module.css b/src/components/video-editor/timeline/ItemGlass.module.css
index 83aaf96984..0da32067bd 100644
--- a/src/components/video-editor/timeline/ItemGlass.module.css
+++ b/src/components/video-editor/timeline/ItemGlass.module.css
@@ -138,6 +138,34 @@
 	z-index: 10;
 }
 
+.glassTeal {
+	position: relative;
+	border-radius: 8px;
+	-corner-smoothing: antialiased;
+	background: rgba(20, 184, 166, 0.15);
+	border: 1px solid rgba(20, 184, 166, 0.3);
+	box-shadow: 0 2px 12px 0 rgba(20, 184, 166, 0.1) inset;
+	margin: 2px 0;
+	backdrop-filter: blur(4px);
+	-webkit-backdrop-filter: blur(4px);
+	transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.glassTeal:hover {
+	background: rgba(20, 184, 166, 0.25);
+	border-color: rgba(20, 184, 166, 0.5);
+	box-shadow: 0 4px 20px 0 rgba(20, 184, 166, 0.2) inset;
+}
+
+.glassTeal.selected {
+	background: rgba(20, 184, 166, 0.35);
+	border-color: #14b8a6;
+	box-shadow:
+		0 0 0 1px #14b8a6,
+		0 4px 20px 0 rgba(20, 184, 166, 0.3) inset;
+	z-index: 10;
+}
+
 .glassPurple {
 	position: relative;
 	border-radius: 8px;
@@ -190,7 +218,9 @@
 .glassBlue:hover .zoomEndCap,
 .glassBlue.selected .zoomEndCap,
 .glassPurple:hover .zoomEndCap,
-.glassPurple.selected .zoomEndCap {
+.glassPurple.selected .zoomEndCap,
+.glassTeal:hover .zoomEndCap,
+.glassTeal.selected .zoomEndCap {
 	opacity: 1;
 }
 
diff --git a/src/components/video-editor/timeline/TimelineEditor.tsx b/src/components/video-editor/timeline/TimelineEditor.tsx
index 6f1216f23d..6673471a7d 100644
--- a/src/components/video-editor/timeline/TimelineEditor.tsx
+++ b/src/components/video-editor/timeline/TimelineEditor.tsx
@@ -35,6 +35,7 @@ import { TutorialHelp } from "../TutorialHelp";
 import type {
 	AnnotationRegion,
 	SpeedRegion,
+	SubtitleItem,
 	TrimRegion,
 	WebcamFocusRegion,
 	WebcamSegment,
@@ -52,6 +53,7 @@ const TRIM_ROW_ID = "row-trim";
 const ANNOTATION_ROW_ID = "row-annotation";
 const BLUR_ROW_ID = "row-blur";
 const SPEED_ROW_ID = "row-speed";
+const SUBTITLE_ROW_ID = "row-subtitle";
 const WEBCAM_FOCUS_ROW_ID = "row-webcam-focus";
 const WEBCAM_SEGMENT_ROW_ID = "row-webcam-segment";
 const FALLBACK_RANGE_MS = 1000;
@@ -104,6 +106,11 @@ interface TimelineEditorProps {
 	onWebcamFocusDelete?: (id: string) => void;
 	selectedWebcamFocusId?: string | null;
 	onSelectWebcamFocus?: (id: string | null) => void;
+	subtitleRegions?: SubtitleItem[];
+	onSubtitleSpanChange?: (id: string, span: Span) => void;
+	onSubtitleDelete?: (id: string) => void;
+	selectedSubtitleId?: string | null;
+	onSelectSubtitle?: (id: string | null) => void;
 	webcamSegments?: WebcamSegment[];
 	onWebcamSegmentSpanChange?: (id: string, span: Span) => void;
 	onWebcamSegmentDelete?: (id: string) => void;
@@ -136,7 +143,15 @@ interface TimelineRenderItem {
 	zoomCustomScale?: number;
 	speedValue?: number;
 	isAutoFocus?: boolean;
-	variant: "zoom" | "trim" | "annotation" | "speed" | "blur" | "webcam-focus" | "webcam-segment";
+	variant:
+		| "zoom"
+		| "trim"
+		| "annotation"
+		| "speed"
+		| "blur"
+		| "webcam-focus"
+		| "webcam-segment"
+		| "subtitle";
 }
 
 const SCALE_CANDIDATES = [
@@ -589,6 +604,7 @@ function Timeline({
 	onSelectSpeed,
 	onSelectWebcamFocus,
 	onSelectWebcamSegment,
+	onSelectSubtitle,
 	selectedZoomId,
 	selectedTrimId,
 	selectedAnnotationId,
@@ -596,6 +612,7 @@ function Timeline({
 	selectedSpeedId,
 	selectedWebcamFocusId,
 	selectedWebcamSegmentId,
+	selectedSubtitleId,
 	keyframes = [],
 	videoUrl,
 	showTrimWaveform = false,
@@ -612,6 +629,7 @@ function Timeline({
 	onSelectSpeed?: (id: string | null) => void;
 	onSelectWebcamFocus?: (id: string | null) => void;
 	onSelectWebcamSegment?: (id: string | null) => void;
+	onSelectSubtitle?: (id: string | null) => void;
 	selectedZoomId: string | null;
 	selectedTrimId?: string | null;
 	selectedAnnotationId?: string | null;
@@ -619,6 +637,7 @@ function Timeline({
 	selectedSpeedId?: string | null;
 	selectedWebcamFocusId?: string | null;
 	selectedWebcamSegmentId?: string | null;
+	selectedSubtitleId?: string | null;
 	keyframes?: { id: string; time: number }[];
 	videoUrl?: string;
 	showTrimWaveform?: boolean;
@@ -783,6 +802,7 @@ function Timeline({
 	const speedItems = items.filter((item) => item.rowId === SPEED_ROW_ID);
 	const webcamFocusItems = items.filter((item) => item.rowId === WEBCAM_FOCUS_ROW_ID);
 	const webcamSegmentItems = items.filter((item) => item.rowId === WEBCAM_SEGMENT_ROW_ID);
+	const subtitleItems = items.filter((item) => item.rowId === SUBTITLE_ROW_ID);
 
 	return (
 		<div
@@ -878,6 +898,24 @@ function Timeline({
 				))}
 			</Row>
 
+			{subtitleItems.length > 0 && (
+				<Row id={SUBTITLE_ROW_ID} isEmpty={false}>
+					{subtitleItems.map((item) => (
+						<Item
+							id={item.id}
+							key={item.id}
+							rowId={item.rowId}
+							span={item.span}
+							isSelected={item.id === selectedSubtitleId}
+							onSelect={() => onSelectSubtitle?.(item.id)}
+							variant="subtitle"
+						>
+							{item.label}
+						</Item>
+					))}
+				</Row>
+			)}
+
 			{BLUR_REGIONS_ENABLED && (
 				<Row id={BLUR_ROW_ID} isEmpty={blurItems.length === 0} hint={t("hints.pressBlur")}>
 					{blurItems.map((item) => (
@@ -1001,6 +1039,11 @@ export default function TimelineEditor({
 	onWebcamFocusDelete,
 	selectedWebcamFocusId,
 	onSelectWebcamFocus,
+	subtitleRegions = [],
+	onSubtitleSpanChange,
+	onSubtitleDelete,
+	selectedSubtitleId,
+	onSelectSubtitle,
 	webcamSegments = [],
 	onWebcamSegmentSpanChange,
 	onWebcamSegmentDelete,
@@ -1085,6 +1128,12 @@ export default function TimelineEditor({
 		onSelectAnnotation(null);
 	}, [selectedAnnotationId, onAnnotationDelete, onSelectAnnotation]);
 
+	const deleteSelectedSubtitle = useCallback(() => {
+		if (!selectedSubtitleId || !onSubtitleDelete || !onSelectSubtitle) return;
+		onSubtitleDelete(selectedSubtitleId);
+		onSelectSubtitle(null);
+	}, [selectedSubtitleId, onSubtitleDelete, onSelectSubtitle]);
+
 	const deleteSelectedBlur = useCallback(() => {
 		if (!selectedBlurId || !onBlurDelete || !onSelectBlur) return;
 		onBlurDelete(selectedBlurId);
@@ -1489,6 +1538,8 @@ export default function TimelineEditor({
 					deleteSelectedTrim();
 				} else if (selectedAnnotationId) {
 					deleteSelectedAnnotation();
+				} else if (selectedSubtitleId) {
+					deleteSelectedSubtitle();
 				} else if (selectedBlurId) {
 					deleteSelectedBlur();
 				} else if (selectedSpeedId) {
@@ -1513,11 +1564,13 @@ export default function TimelineEditor({
 		deleteSelectedZoom,
 		deleteSelectedTrim,
 		deleteSelectedAnnotation,
+		deleteSelectedSubtitle,
 		deleteSelectedBlur,
 		deleteSelectedSpeed,
 		deleteSelectedWebcamFocus,
 		deleteSelectedWebcamSegment,
 		selectedKeyframeId,
+		selectedSubtitleId,
 		selectedZoomId,
 		selectedTrimId,
 		selectedAnnotationId,
@@ -1609,6 +1662,17 @@ export default function TimelineEditor({
 			variant: "webcam-focus",
 		}));
 
+		const subtitles: TimelineRenderItem[] = subtitleRegions.map((region) => {
+			const preview = region.text.trim() || t("labels.emptyText");
+			return {
+				id: region.id,
+				rowId: SUBTITLE_ROW_ID,
+				span: { start: region.startMs, end: region.endMs },
+				label: preview.length > 20 ? `${preview.substring(0, 20)}...` : preview,
+				variant: "subtitle" as const,
+			};
+		});
+
 		const webcamSegmentItems: TimelineRenderItem[] = webcamSegments.map((segment, index) => ({
 			id: segment.id,
 			rowId: WEBCAM_SEGMENT_ROW_ID,
@@ -1621,6 +1685,7 @@ export default function TimelineEditor({
 			...zooms,
 			...trims,
 			...annotations,
+			...subtitles,
 			...blurs,
 			...speeds,
 			...webcamFocuses,
@@ -1630,6 +1695,7 @@ export default function TimelineEditor({
 		zoomRegions,
 		trimRegions,
 		annotationRegions,
+		subtitleRegions,
 		blurRegions,
 		speedRegions,
 		webcamFocusRegions,
@@ -1664,8 +1730,9 @@ export default function TimelineEditor({
 			end: r.endMs,
 		}));
 		const blurs = blurRegions.map((r) => ({ id: r.id, start: r.startMs, end: r.endMs }));
-		return [...annotations, ...blurs];
-	}, [annotationRegions, blurRegions]);
+		const subtitles = subtitleRegions.map((r) => ({ id: r.id, start: r.startMs, end: r.endMs }));
+		return [...annotations, ...blurs, ...subtitles];
+	}, [annotationRegions, blurRegions, subtitleRegions]);
 
 	const keyframeTimesMs = useMemo(() => keyframes.map((kf) => kf.time), [keyframes]);
 
@@ -1683,6 +1750,8 @@ export default function TimelineEditor({
 				onWebcamSegmentSpanChange?.(id, span);
 			} else if (annotationRegions.some((r) => r.id === id)) {
 				onAnnotationSpanChange?.(id, span);
+			} else if (subtitleRegions.some((r) => r.id === id)) {
+				onSubtitleSpanChange?.(id, span);
 			} else if (blurRegions.some((r) => r.id === id)) {
 				onBlurSpanChange?.(id, span);
 			}
@@ -1694,6 +1763,7 @@ export default function TimelineEditor({
 			webcamFocusRegions,
 			webcamSegments,
 			annotationRegions,
+			subtitleRegions,
 			blurRegions,
 			onZoomSpanChange,
 			onTrimSpanChange,
@@ -1701,6 +1771,7 @@ export default function TimelineEditor({
 			onWebcamFocusSpanChange,
 			onWebcamSegmentSpanChange,
 			onAnnotationSpanChange,
+			onSubtitleSpanChange,
 			onBlurSpanChange,
 		],
 	);
@@ -1920,6 +1991,7 @@ export default function TimelineEditor({
 						onSelectSpeed={onSelectSpeed}
 						onSelectWebcamFocus={onSelectWebcamFocus}
 						onSelectWebcamSegment={onSelectWebcamSegment}
+						onSelectSubtitle={onSelectSubtitle}
 						selectedZoomId={selectedZoomId}
 						selectedTrimId={selectedTrimId}
 						selectedAnnotationId={selectedAnnotationId}
@@ -1927,6 +1999,7 @@ export default function TimelineEditor({
 						selectedSpeedId={selectedSpeedId}
 						selectedWebcamFocusId={selectedWebcamFocusId}
 						selectedWebcamSegmentId={selectedWebcamSegmentId}
+						selectedSubtitleId={selectedSubtitleId}
 						keyframes={keyframes}
 						videoUrl={videoUrl}
 						showTrimWaveform={showTrimWaveform}
diff --git a/src/i18n/locales/ar/editor.json b/src/i18n/locales/ar/editor.json
index 4450f99e21..1f195adff4 100644
--- a/src/i18n/locales/ar/editor.json
+++ b/src/i18n/locales/ar/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "لا يحتوي هذا الفيديو على صوت صالح للنسخ.",
 		"failed": "تعذّر توليد التسميات.",
 		"truncated": "تم نسخ الدقائق الأولى فقط: {{minutes}} دقيقة.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "لا يوجد مشروع مفتوح",
diff --git a/src/i18n/locales/en/editor.json b/src/i18n/locales/en/editor.json
index b772afdb92..3cdd374573 100644
--- a/src/i18n/locales/en/editor.json
+++ b/src/i18n/locales/en/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "This video has no usable audio to transcribe.",
 		"failed": "Could not generate captions.",
 		"truncated": "Only the first {{minutes}} minutes were transcribed.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputSubtitles": "Styled subtitles (templates)",
+		"outputAnnotations": "Text annotations"
 	},
 	"emptyState": {
 		"title": "No project open",
diff --git a/src/i18n/locales/es/editor.json b/src/i18n/locales/es/editor.json
index cd6695d628..75cf57d7b3 100644
--- a/src/i18n/locales/es/editor.json
+++ b/src/i18n/locales/es/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "Este video no tiene audio utilizable para transcribir.",
 		"failed": "No se pudieron generar los subtítulos.",
 		"truncated": "Solo se transcribieron los primeros {{minutes}} minutos.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "No hay proyecto abierto",
diff --git a/src/i18n/locales/fr/editor.json b/src/i18n/locales/fr/editor.json
index 99e4f864d7..4c7de539aa 100644
--- a/src/i18n/locales/fr/editor.json
+++ b/src/i18n/locales/fr/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "Cette vidéo ne contient pas d'audio exploitable pour la transcription.",
 		"failed": "Impossible de générer les sous-titres.",
 		"truncated": "Seules les {{minutes}} premières minutes ont été transcrites.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "Aucun projet ouvert",
diff --git a/src/i18n/locales/it/editor.json b/src/i18n/locales/it/editor.json
index 66dda40db5..b1a2210d04 100644
--- a/src/i18n/locales/it/editor.json
+++ b/src/i18n/locales/it/editor.json
@@ -61,7 +61,10 @@
 		"noAudio": "Questo video non contiene audio utilizzabile per la trascrizione.",
 		"failed": "Impossibile generare i sottotitoli.",
 		"truncated": "Sono stati trascritti solo i primi {{minutes}} minuti.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"loadingEditor": "Loading editor...",
 	"emptyState": {
diff --git a/src/i18n/locales/ja-JP/editor.json b/src/i18n/locales/ja-JP/editor.json
index da5871c0b3..7ba6a347f0 100644
--- a/src/i18n/locales/ja-JP/editor.json
+++ b/src/i18n/locales/ja-JP/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "この動画には書き起こしに使える音声がありません。",
 		"failed": "キャプションを生成できませんでした。",
 		"truncated": "最初の {{minutes}} 分のみが書き起こされました。",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "プロジェクトが開かれていません",
diff --git a/src/i18n/locales/ko-KR/editor.json b/src/i18n/locales/ko-KR/editor.json
index 41271f18d9..6eee0c6fed 100644
--- a/src/i18n/locales/ko-KR/editor.json
+++ b/src/i18n/locales/ko-KR/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "이 동영상에는 전사에 사용할 수 있는 음성이 없습니다.",
 		"failed": "자막을 생성할 수 없습니다.",
 		"truncated": "처음 {{minutes}}분만 전사되었습니다.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "열린 프로젝트 없음",
diff --git a/src/i18n/locales/pt-BR/editor.json b/src/i18n/locales/pt-BR/editor.json
index d5f11e48dd..76e344b6ea 100644
--- a/src/i18n/locales/pt-BR/editor.json
+++ b/src/i18n/locales/pt-BR/editor.json
@@ -61,7 +61,10 @@
 		"noAudio": "Este vídeo não tem áudio utilizável para transcrição.",
 		"failed": "Não foi possível gerar as legendas.",
 		"truncated": "Apenas os primeiros {{minutes}} minutos foram transcritos.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"loadingEditor": "Loading editor...",
 	"emptyState": {
diff --git a/src/i18n/locales/ru/editor.json b/src/i18n/locales/ru/editor.json
index 06ca125b6b..234c7eca8a 100644
--- a/src/i18n/locales/ru/editor.json
+++ b/src/i18n/locales/ru/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "В этом видео нет звука, пригодного для расшифровки.",
 		"failed": "Не удалось создать субтитры.",
 		"truncated": "Расшифрованы только первые {{minutes}} мин.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "Нет открытых проектов",
diff --git a/src/i18n/locales/tr/editor.json b/src/i18n/locales/tr/editor.json
index f947411862..505f01f927 100644
--- a/src/i18n/locales/tr/editor.json
+++ b/src/i18n/locales/tr/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "Bu videoda yazıya dökülebilecek kullanılabilir bir ses yok.",
 		"failed": "Altyazılar oluşturulamadı.",
 		"truncated": "Yalnızca ilk {{minutes}} dakika yazıya döküldü.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "Açık proje yok",
diff --git a/src/i18n/locales/vi/editor.json b/src/i18n/locales/vi/editor.json
index 01c4c77bcb..e53477d455 100644
--- a/src/i18n/locales/vi/editor.json
+++ b/src/i18n/locales/vi/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "Video này không có âm thanh dùng được để chuyển thành văn bản.",
 		"failed": "Không thể tạo phụ đề.",
 		"truncated": "Chỉ {{minutes}} phút đầu tiên được chuyển thành văn bản.",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "Không có dự án nào được mở",
diff --git a/src/i18n/locales/zh-CN/editor.json b/src/i18n/locales/zh-CN/editor.json
index 87186ae408..d0a3e484f8 100644
--- a/src/i18n/locales/zh-CN/editor.json
+++ b/src/i18n/locales/zh-CN/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "此视频没有可用于转写的音频。",
 		"failed": "无法生成字幕。",
 		"truncated": "仅转写了最前 {{minutes}} 分钟。",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "未打开任何项目",
diff --git a/src/i18n/locales/zh-TW/editor.json b/src/i18n/locales/zh-TW/editor.json
index 70cc78611c..f55c37d317 100644
--- a/src/i18n/locales/zh-TW/editor.json
+++ b/src/i18n/locales/zh-TW/editor.json
@@ -62,7 +62,10 @@
 		"noAudio": "此影片沒有可用於轉寫的音訊。",
 		"failed": "無法產生字幕。",
 		"truncated": "僅轉寫了最前 {{minutes}} 分鐘。",
-		"language": "Spoken language"
+		"language": "Spoken language",
+		"output": "Caption style",
+		"outputAnnotations": "Text annotations",
+		"outputSubtitles": "Styled subtitles (templates)"
 	},
 	"emptyState": {
 		"title": "未開啟任何專案",
diff --git a/src/lib/captioning/annotationsFromCaptions.ts b/src/lib/captioning/annotationsFromCaptions.ts
index 4e4cff14d8..68beebf40c 100644
--- a/src/lib/captioning/annotationsFromCaptions.ts
+++ b/src/lib/captioning/annotationsFromCaptions.ts
@@ -1,4 +1,8 @@
-import type { AnnotationRegion, AnnotationTextStyle } from "@/components/video-editor/types";
+import type {
+	AnnotationRegion,
+	AnnotationTextStyle,
+	SubtitleItem,
+} from "@/components/video-editor/types";
 
 import type { CaptionSegment } from "./transcribe";
 
@@ -590,6 +594,39 @@ export function captionSegmentsToAnnotationRegions(
 	};
 }
 
+/**
+ * Same grouping/dedupe chain as `captionSegmentsToAnnotationRegions`, but emitting
+ * the editor's styled-subtitle model (rendered by SubtitleOverlay templates)
+ * instead of plain text annotations. Subtitles render one at a time in a fixed
+ * slot, so the annotation timeline-gap reconciliation is not needed here.
+ */
+export function captionSegmentsToSubtitleItems(
+	segments: CaptionSegment[],
+	layout?: CaptionSegmentLayoutOptions,
+): SubtitleItem[] {
+	const minW = layout?.minWordsPerCaption ?? 2;
+	const maxW = layout?.maxWordsPerCaption ?? 7;
+	const granularity = layout?.timestampGranularity ?? "word";
+
+	const grouped =
+		granularity === "phrase"
+			? groupPhraseCaptionSegmentsIntoLines(segments, minW, maxW)
+			: groupTimedCaptionWordsIntoLines(segments, minW, maxW);
+
+	const finalized = finalizeCaptionSegmentsForPlayback(dedupeAdjacentCaptionRepeats(grouped));
+
+	const batch = Date.now();
+	return finalized.map((seg, index) => {
+		const startMs = Math.round(seg.startSec * 1000);
+		return {
+			id: `subtitle-${batch}-${index}`,
+			startMs,
+			endMs: Math.max(Math.round(seg.endSec * 1000), startMs + 1),
+			text: seg.text,
+		};
+	});
+}
+
 export function maxAnnotationNumericId(regions: AnnotationRegion[]): number {
 	let max = 0;
 	for (const r of regions) {
diff --git a/src/lib/captioning/index.ts b/src/lib/captioning/index.ts
index cc2e2a3a6e..f2d41ebf9a 100644
--- a/src/lib/captioning/index.ts
+++ b/src/lib/captioning/index.ts
@@ -1,6 +1,7 @@
 export type { CaptionSegmentLayoutOptions } from "./annotationsFromCaptions";
 export {
 	captionSegmentsToAnnotationRegions,
+	captionSegmentsToSubtitleItems,
 	DEFAULT_AUTO_CAPTION_MIN_GAP_MS,
 	groupTimedCaptionWordsIntoLines,
 	mergeAdjacentCaptionSegments,