diff --git a/webview-ui/src/components/file-changes/FilesChangedOverview.tsx b/webview-ui/src/components/file-changes/FilesChangedOverview.tsx
index 8091a15443..3ec434cc10 100644
--- a/webview-ui/src/components/file-changes/FilesChangedOverview.tsx
+++ b/webview-ui/src/components/file-changes/FilesChangedOverview.tsx
@@ -179,29 +179,19 @@ const FilesChangedOverview: React.FC = () => {
 	}, [filesChangedEnabled])
 
 	/**
-	 * Formats line change counts for display based on file type
+	 * Formats line change counts for display - shows only plus/minus numbers
 	 * @param file - The file change to format
-	 * @returns Formatted string describing the changes
+	 * @returns Formatted string with just the line change counts
 	 */
 	const formatLineChanges = (file: FileChange): string => {
 		const added = file.linesAdded || 0
 		const removed = file.linesRemoved || 0
 
-		if (file.type === "create") {
-			return t("file-changes:line_changes.added", { count: added })
-		} else if (file.type === "delete") {
-			return t("file-changes:line_changes.deleted")
-		} else {
-			if (added > 0 && removed > 0) {
-				return t("file-changes:line_changes.added_removed", { added, removed })
-			} else if (added > 0) {
-				return t("file-changes:line_changes.added", { count: added })
-			} else if (removed > 0) {
-				return t("file-changes:line_changes.removed", { count: removed })
-			} else {
-				return t("file-changes:line_changes.modified")
-			}
-		}
+		const parts = []
+		if (added > 0) parts.push(`+${added}`)
+		if (removed > 0) parts.push(`-${removed}`)
+
+		return parts.length > 0 ? parts.join(", ") : ""
 	}
 
 	// Memoize expensive total calculations
@@ -222,11 +212,29 @@ const FilesChangedOverview: React.FC = () => {
 
 	return (
 		<div
-			className="files-changed-overview border border-vscode-panel-border rounded p-3 my-2 bg-vscode-editor-background"
-			data-testid="files-changed-overview">
+			className="files-changed-overview"
+			data-testid="files-changed-overview"
+			style={{
+				border: "1px solid var(--vscode-panel-border)",
+				borderTop: 0,
+				borderRadius: 0,
+				padding: "6px 10px",
+				margin: 0,
+				backgroundColor: "var(--vscode-editor-background)",
+			}}>
 			{/* Collapsible header */}
 			<div
-				className={`flex justify-between items-center ${isCollapsed ? "" : "mb-3 border-b border-vscode-panel-border pb-2"} cursor-pointer select-none`}
+				style={{
+					display: "flex",
+					justifyContent: "space-between",
+					alignItems: "center",
+					marginTop: "0 2px",
+					//marginBottom: isCollapsed ? "0" : "6px",
+					borderBottom: isCollapsed ? "none" : "1px solid var(--vscode-panel-border)",
+					// paddingBottom: "0px",
+					cursor: "pointer",
+					userSelect: "none",
+				}}
 				onClick={() => setIsCollapsed(!isCollapsed)}
 				onKeyDown={(e) => {
 					if (e.key === "Enter" || e.key === " ") {
@@ -244,11 +252,15 @@ const FilesChangedOverview: React.FC = () => {
 						: t("file-changes:accessibility.expanded"),
 				})}
 				title={isCollapsed ? t("file-changes:header.expand") : t("file-changes:header.collapse")}>
-				<div className="flex items-center gap-2">
+				<div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
 					<span
-						className={`codicon ${isCollapsed ? "codicon-chevron-right" : "codicon-chevron-down"} text-[12px] transition-transform`}
+						className={`codicon ${isCollapsed ? "codicon-chevron-right" : "codicon-chevron-down"}`}
+						style={{
+							fontSize: "12px",
+							transition: "transform 0.2s ease",
+						}}
 					/>
-					<h3 className="m-0 text-sm font-bold" data-testid="files-changed-header">
+					<h3 style={{ margin: 0, fontSize: "14px", fontWeight: "bold" }} data-testid="files-changed-header">
 						{t("file-changes:summary.count_with_changes", {
 							count: files.length,
 							changes: totalChanges,
@@ -258,7 +270,7 @@ const FilesChangedOverview: React.FC = () => {
 
 				{/* Action buttons always visible for quick access */}
 				<div
-					className="flex gap-2"
+					style={{ display: "flex", gap: "8px" }}
 					onClick={(e) => e.stopPropagation()} // Prevent collapse toggle when clicking buttons
 				>
 					<button
@@ -266,7 +278,16 @@ const FilesChangedOverview: React.FC = () => {
 						disabled={isProcessing}
 						tabIndex={0}
 						data-testid="reject-all-button"
-						className={`bg-vscode-button-secondaryBackground text-vscode-button-secondaryForeground border border-vscode-button-border rounded px-2 py-1 text-xs ${isProcessing ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`}
+						style={{
+							backgroundColor: "var(--vscode-button-secondaryBackground)",
+							color: "var(--vscode-button-secondaryForeground)",
+							border: "none",
+							borderRadius: "3px",
+							padding: "4px 8px",
+							fontSize: "13px",
+							cursor: isProcessing ? "not-allowed" : "pointer",
+							opacity: isProcessing ? 0.6 : 1,
+						}}
 						title={t("file-changes:actions.reject_all")}>
 						{t("file-changes:actions.reject_all")}
 					</button>
@@ -275,7 +296,16 @@ const FilesChangedOverview: React.FC = () => {
 						disabled={isProcessing}
 						tabIndex={0}
 						data-testid="accept-all-button"
-						className={`bg-vscode-button-background text-vscode-button-foreground border border-vscode-button-border rounded px-2 py-1 text-xs ${isProcessing ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`}
+						style={{
+							backgroundColor: "var(--vscode-button-background)",
+							color: "var(--vscode-button-foreground)",
+							border: "none",
+							borderRadius: "3px",
+							padding: "4px 8px",
+							fontSize: "13px",
+							cursor: isProcessing ? "not-allowed" : "pointer",
+							opacity: isProcessing ? 0.6 : 1,
+						}}
 						title={t("file-changes:actions.accept_all")}>
 						{t("file-changes:actions.accept_all")}
 					</button>
@@ -285,7 +315,14 @@ const FilesChangedOverview: React.FC = () => {
 			{/* Collapsible content area */}
 			{!isCollapsed && (
 				<div
-					className={`max-h-[300px] overflow-y-auto transition-opacity duration-200 ease-in-out ${isCollapsed ? "opacity-0" : "opacity-100"} relative`}
+					style={{
+						maxHeight: "300px",
+						overflowY: "auto",
+						transition: "opacity 0.2s ease-in-out",
+						opacity: isCollapsed ? 0 : 1,
+						position: "relative",
+						paddingTop: "8px",
+					}}
 					onScroll={handleScroll}>
 					{shouldVirtualize && (
 						<div style={{ height: totalHeight, position: "relative" }}>
@@ -357,41 +394,99 @@ const FileItem: React.FC<FileItemProps> = React.memo(
 	({ file, formatLineChanges, onViewDiff, onAcceptFile, onRejectFile, handleWithDebounce, isProcessing, t }) => (
 		<div
 			data-testid={`file-item-${file.uri}`}
-			className="flex justify-between items-center px-2 py-1.5 mb-1 bg-vscode-list-hoverBackground rounded text-[13px] min-h-[60px]">
-			<div className="flex-1 min-w-0">
-				<div className="text-xs text-vscode-editor-foreground overflow-hidden text-ellipsis whitespace-nowrap">
+			style={{
+				display: "flex",
+				justifyContent: "space-between",
+				alignItems: "center",
+				padding: "6px 8px",
+				marginBottom: "3px",
+				backgroundColor: "var(--vscode-list-hoverBackground)",
+				borderRadius: "3px",
+				fontSize: "13px",
+				minHeight: "32px", // Thinner rows
+				lineHeight: "1.3",
+			}}>
+			<div style={{ flex: 1, minWidth: 0 }}>
+				<div
+					style={{
+						fontFamily: "var(--vscode-editor-font-family)",
+						fontSize: "13px",
+						color: "var(--vscode-editor-foreground)",
+						overflow: "hidden",
+						textOverflow: "ellipsis",
+						whiteSpace: "nowrap",
+						fontWeight: 500,
+					}}>
 					{file.uri}
 				</div>
-				<div className="text-[11px] text-vscode-descriptionForeground mt-0.5">
-					{t(`file-changes:file_types.${file.type}`)} • {formatLineChanges(file)}
-				</div>
 			</div>
 
-			<div className="flex gap-1 ml-2">
-				<button
-					onClick={() => handleWithDebounce(() => onViewDiff(file.uri))}
-					disabled={isProcessing}
-					title={t("file-changes:actions.view_diff")}
-					data-testid={`diff-${file.uri}`}
-					className={`bg-transparent text-vscode-button-foreground border border-vscode-button-border rounded px-1.5 py-0.5 text-[11px] min-w-[50px] ${isProcessing ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`}>
-					{t("file-changes:actions.view_diff")}
-				</button>
-				<button
-					onClick={() => handleWithDebounce(() => onRejectFile(file.uri))}
-					disabled={isProcessing}
-					title={t("file-changes:actions.reject_file")}
-					data-testid={`reject-${file.uri}`}
-					className={`bg-vscode-button-secondaryBackground text-vscode-button-secondaryForeground border border-vscode-button-border rounded px-1.5 py-0.5 text-[11px] min-w-[20px] ${isProcessing ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`}>
-					✗
-				</button>
-				<button
-					onClick={() => handleWithDebounce(() => onAcceptFile(file.uri))}
-					disabled={isProcessing}
-					title={t("file-changes:actions.accept_file")}
-					data-testid={`accept-${file.uri}`}
-					className={`bg-vscode-button-background text-vscode-button-foreground border border-vscode-button-border rounded px-1.5 py-0.5 text-[11px] min-w-[20px] ${isProcessing ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}`}>
-					✓
-				</button>
+			<div style={{ display: "flex", alignItems: "center", gap: "8px", marginLeft: "8px" }}>
+				<div
+					style={{
+						fontSize: "12px",
+						color: "var(--vscode-descriptionForeground)",
+						whiteSpace: "nowrap",
+						flexShrink: 0,
+					}}>
+					{formatLineChanges(file)}
+				</div>
+				<div style={{ display: "flex", gap: "4px" }}>
+					<button
+						onClick={() => handleWithDebounce(() => onViewDiff(file.uri))}
+						disabled={isProcessing}
+						title={t("file-changes:actions.view_diff")}
+						data-testid={`diff-${file.uri}`}
+						style={{
+							backgroundColor: "transparent",
+							color: "var(--vscode-button-foreground)",
+							border: "1px solid var(--vscode-button-border)",
+							borderRadius: "3px",
+							padding: "2px 6px",
+							fontSize: "11px",
+							cursor: isProcessing ? "not-allowed" : "pointer",
+							minWidth: "50px",
+							opacity: isProcessing ? 0.6 : 1,
+						}}>
+						{t("file-changes:actions.view_diff")}
+					</button>
+					<button
+						onClick={() => handleWithDebounce(() => onRejectFile(file.uri))}
+						disabled={isProcessing}
+						title={t("file-changes:actions.reject_file")}
+						data-testid={`reject-${file.uri}`}
+						style={{
+							backgroundColor: "var(--vscode-button-secondaryBackground)",
+							color: "var(--vscode-button-secondaryForeground)",
+							border: "1px solid var(--vscode-button-border)",
+							borderRadius: "3px",
+							padding: "2px 6px",
+							fontSize: "11px",
+							cursor: isProcessing ? "not-allowed" : "pointer",
+							minWidth: "20px",
+							opacity: isProcessing ? 0.6 : 1,
+						}}>
+						✗
+					</button>
+					<button
+						onClick={() => handleWithDebounce(() => onAcceptFile(file.uri))}
+						disabled={isProcessing}
+						title={t("file-changes:actions.accept_file")}
+						data-testid={`accept-${file.uri}`}
+						style={{
+							backgroundColor: "var(--vscode-button-background)",
+							color: "var(--vscode-button-foreground)",
+							border: "1px solid var(--vscode-button-border)",
+							borderRadius: "3px",
+							padding: "2px 6px",
+							fontSize: "11px",
+							cursor: isProcessing ? "not-allowed" : "pointer",
+							minWidth: "20px",
+							opacity: isProcessing ? 0.6 : 1,
+						}}>
+						✓
+					</button>
+				</div>
 			</div>
 		</div>
 	),
diff --git a/webview-ui/src/i18n/locales/en/file-changes.json b/webview-ui/src/i18n/locales/en/file-changes.json
index d8ce319366..c959645479 100644
--- a/webview-ui/src/i18n/locales/en/file-changes.json
+++ b/webview-ui/src/i18n/locales/en/file-changes.json
@@ -24,7 +24,7 @@
 		"modified": "modified"
 	},
 	"summary": {
-		"count_with_changes": "({{count}}) Files Changed{{changes}}",
+		"count_with_changes": "{{count}} Files Changed{{changes}}",
 		"changes_format": " ({{changes}})"
 	},
 	"accessibility": {