diff --git a/web/src/lib/components/kit/MetaRow.svelte b/web/src/lib/components/kit/MetaRow.svelte
index 05443c1..8e3b483 100644
--- a/web/src/lib/components/kit/MetaRow.svelte
+++ b/web/src/lib/components/kit/MetaRow.svelte
@@ -25,8 +25,7 @@
 	.meta-value {
 		margin-top: 5px;
 		line-height: normal;
-		font-family: var(--font-mono);
-		font-size: 11px;
+		font: 11px var(--font-mono);
 		color: var(--foreground);
 	}
 </style>
diff --git a/web/src/lib/components/kit/PreviewTile.svelte b/web/src/lib/components/kit/PreviewTile.svelte
index fe0c3c8..2b64e67 100644
--- a/web/src/lib/components/kit/PreviewTile.svelte
+++ b/web/src/lib/components/kit/PreviewTile.svelte
@@ -59,11 +59,11 @@
 		color: var(--blue);
 	}
 	.tile-label span {
-		font: 10px var(--font-mono);
+		font: 9px var(--font-mono);
 		color: var(--blue);
 	}
 	.tile-label b {
-		font: 400 10px var(--font-mono);
+		font: 400 9px var(--font-mono);
 		color: var(--muted);
 		text-align: right;
 	}
diff --git a/web/src/lib/components/kit/SliderField.svelte b/web/src/lib/components/kit/SliderField.svelte
index 1345f6c..e65c894 100644
--- a/web/src/lib/components/kit/SliderField.svelte
+++ b/web/src/lib/components/kit/SliderField.svelte
@@ -39,10 +39,12 @@
 		margin-bottom: 8px;
 	}
 	output {
-		font: 11px var(--font-mono);
+		font: 10px var(--font-mono);
 		color: var(--foreground);
 	}
 	input[type="range"] {
+		color: var(--foreground);
+		line-height: inherit;
 		width: 100%;
 		accent-color: var(--blue);
 	}
diff --git a/web/src/lib/components/kit/StepCard.svelte b/web/src/lib/components/kit/StepCard.svelte
index edc9d0a..13dcfdd 100644
--- a/web/src/lib/components/kit/StepCard.svelte
+++ b/web/src/lib/components/kit/StepCard.svelte
@@ -55,7 +55,7 @@
 	.step-index {
 		grid-column: 1;
 		grid-row: 1;
-		font: 600 22px var(--font-mono);
+		font: 11px var(--font-mono);
 		color: var(--blue);
 		padding: 17px 0 0px 15px;
 		border-right: 1px solid var(--line);
@@ -92,6 +92,10 @@
 		background: transparent;
 		color: var(--muted);
 		cursor: pointer;
+		line-height: inherit;
+		& :global(svg) {
+			line-height: inherit;
+		}
 	}
 	.step-card :global(.drag) {
 		margin-top: 17px;
diff --git a/web/src/routes/preview/tools/[id]/PreviewPanel.svelte b/web/src/routes/preview/tools/[id]/PreviewPanel.svelte
index e89aba4..1c03102 100644
--- a/web/src/routes/preview/tools/[id]/PreviewPanel.svelte
+++ b/web/src/routes/preview/tools/[id]/PreviewPanel.svelte
@@ -1,16 +1,16 @@
 <script lang="ts">
-	import type { PixelImage } from "$lib/core/types";
+	import Button from "$lib/components/kit/Button.svelte";
+	import CheckerCanvas from "$lib/components/kit/CheckerCanvas.svelte";
+	import DownloadButton from "$lib/components/kit/DownloadButton.svelte";
+	import Dropzone from "$lib/components/kit/Dropzone.svelte";
+	import EmptyState from "$lib/components/kit/EmptyState.svelte";
+	import MetaList from "$lib/components/kit/MetaList.svelte";
 	import Panel from "$lib/components/kit/Panel.svelte";
 	import PanelHeading from "$lib/components/kit/PanelHeading.svelte";
 	import PreviewStack from "$lib/components/kit/PreviewStack.svelte";
 	import PreviewTile from "$lib/components/kit/PreviewTile.svelte";
-	import CheckerCanvas from "$lib/components/kit/CheckerCanvas.svelte";
-	import DownloadButton from "$lib/components/kit/DownloadButton.svelte";
-	import Dropzone from "$lib/components/kit/Dropzone.svelte";
-	import Button from "$lib/components/kit/Button.svelte";
 	import StatusLine from "$lib/components/kit/StatusLine.svelte";
-	import MetaList from "$lib/components/kit/MetaList.svelte";
-	import EmptyState from "$lib/components/kit/EmptyState.svelte";
+	import type { PixelImage } from "$lib/core/types";
 
 	interface PreviewItem {
 		toolId: string;