feat(client): unify section headers on /logs and group titles with their tables

- Apply the eyebrow variant to "Runtime stats" and "Memory & CPU" so /logs sections share the same uppercase header style as Job queue
- Pair each section's heading + explainer with its table in a tighter sub-stack so the big gap only sits between sections, not under the explainer
- Restore the missing useTheme() call inside TableFailedJobs and TableLogs so the monospace token resolves

client/src/Pages/Logs/TabDiagnostics.tsx

@@ -23,8 +23,8 @@ export const TabDiagnostics = () => {
 			<Stack gap={theme.spacing(4)}>
 				<Stack gap={theme.spacing(1)}>
 					<Typography
-						variant="h6"
-						sx={{ textTransform: "uppercase" }}
+						variant="eyebrow"
+						color="text.secondary"
 					>
 						{t("pages.logs.diagnostics.sections.runtimeStats.title")}
 					</Typography>
@@ -37,8 +37,8 @@ export const TabDiagnostics = () => {
 			<Stack gap={theme.spacing(4)}>
 				<Stack gap={theme.spacing(1)}>
 					<Typography
-						variant="h6"
-						sx={{ textTransform: "uppercase" }}
+						variant="eyebrow"
+						color="text.secondary"
 					>
 						{t("pages.logs.diagnostics.sections.memoryCpu.title")}
 					</Typography>

client/src/Pages/Logs/TabQueue.tsx

@@ -43,61 +43,65 @@ export const TabQueue = () => {
 	};
 
 	return (
-		<Stack gap={theme.spacing(8)}>
+		<Stack gap={theme.spacing(16)}>
 			<Metrics metrics={metrics} />
-			<Stack gap={theme.spacing(1)}>
-				<Typography
-					variant="eyebrow"
-					color="text.secondary"
-				>
-					{t("pages.logs.jobQueue")}
-				</Typography>
-				<Typography
-					sx={{
-						fontSize: 13,
-						color: theme.palette.text.secondary,
-					}}
-				>
-					<Trans
-						i18nKey="pages.logs.jobQueueExplainer"
-						components={{
-							highlight: (
-								<Box
-									component="span"
-									sx={{
-										backgroundColor:
-											theme.palette.mode === "dark"
-												? "rgba(19, 113, 91, 0.18)"
-												: "#ECF7F2",
-										color: theme.palette.text.primary,
-										px: 1,
-										py: 0.25,
-										borderRadius: 0.5,
-									}}
-								/>
-							),
+			<Stack gap={theme.spacing(3)}>
+				<Stack gap={theme.spacing(1)}>
+					<Typography
+						variant="eyebrow"
+						color="text.secondary"
+					>
+						{t("pages.logs.jobQueue")}
+					</Typography>
+					<Typography
+						sx={{
+							fontSize: 13,
+							color: theme.palette.text.secondary,
 						}}
-					/>
-				</Typography>
+					>
+						<Trans
+							i18nKey="pages.logs.jobQueueExplainer"
+							components={{
+								highlight: (
+									<Box
+										component="span"
+										sx={{
+											backgroundColor:
+												theme.palette.mode === "dark"
+													? "rgba(19, 113, 91, 0.18)"
+													: "#ECF7F2",
+											color: theme.palette.text.primary,
+											px: 1,
+											py: 0.25,
+											borderRadius: 0.5,
+										}}
+									/>
+								),
+							}}
+						/>
+					</Typography>
+				</Stack>
+				<TableJobs jobs={jobs} />
 			</Stack>
-			<TableJobs jobs={jobs} />
-			<Stack gap={theme.spacing(1)}>
-				<Typography
-					variant="eyebrow"
-					color="text.secondary"
-				>
-					{t("pages.logs.failedJobs")}
-				</Typography>
-				<Typography
-					sx={{
-						fontSize: 13,
-						color: theme.palette.text.secondary,
-					}}
-				>
-					{t("pages.logs.failedJobsExplainer")}
-				</Typography>
+			<Stack gap={theme.spacing(3)}>
+				<Stack gap={theme.spacing(1)}>
+					<Typography
+						variant="eyebrow"
+						color="text.secondary"
+					>
+						{t("pages.logs.failedJobs")}
+					</Typography>
+					<Typography
+						sx={{
+							fontSize: 13,
+							color: theme.palette.text.secondary,
+						}}
+					>
+						{t("pages.logs.failedJobsExplainer")}
+					</Typography>
+				</Stack>
+				<TableFailedJobs metrics={metrics} />
 			</Stack>
-			<TableFailedJobs metrics={metrics} />
 			<Stack alignItems={"flex-end"}>
 				<Button
 					variant="contained"

client/src/Pages/Logs/components/TableJobs.tsx

@@ -121,6 +121,7 @@ interface TableFailedJobsProps {
 }
 export const TableFailedJobs = ({ metrics }: TableFailedJobsProps) => {
 	const { t } = useTranslation();
+	const theme = useTheme();
 	if (!metrics) {
 		return null;
 	}

client/src/Pages/Logs/components/TableLogs.tsx

@@ -45,6 +45,7 @@ const LevelBadge = ({ level }: { level: LogLevel }) => {
 
 export const TableLogs = ({ logs, logCount, page, setPage }: TableLogsProps) => {
 	const { t } = useTranslation();
+	const theme = useTheme();
 	const dispatch = useDispatch();
 	const rowsPerPage = useSelector(
 		(state: RootState) => state?.ui?.logs?.rowsPerPage ?? 15