fix: resolve style issues

web/src/lib/components/kit/FieldGrid.svelte

@@ -21,9 +21,8 @@
 	}
 	.controls.compact {
 		display: grid;
-		grid-auto-flow: column;
-		grid-auto-columns: minmax(0, 1fr);
-		gap: 0 16px;
+		grid-template-columns: 1fr 1fr;
+		gap: 16px;
 	}
 
 	@media (max-width: 800px) {

web/src/lib/components/kit/Footer.svelte

@@ -8,14 +8,18 @@
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		gap: 1rem;
-		padding: 16px clamp(20px, 4vw, 64px);
+		padding: 16px clamp(20px, 4vw, 72px);
 		border-top: 1px solid var(--line);
 		font: 10px var(--font-mono);
-		letter-spacing: 0.08em;
 		color: var(--muted);
+		& span {
+			display: flex;
+			align-items: center;
+			gap: 7px;
+		}
 	}
 	.preview-footer .version {
+		font-weight: 400;
 		color: var(--blue);
 	}
 </style>

web/src/lib/components/kit/SectionLabel.svelte

@@ -37,7 +37,7 @@
 		justify-content: space-between;
 		align-items: center;
 		border-bottom: 1px solid var(--line);
-		padding-bottom: 15px;
+		padding-bottom: 12px;
 	}
 	.section-text strong {
 		display: block;

web/src/lib/components/kit/Toggle.svelte

@@ -27,8 +27,8 @@
 <style>
 	.toggle {
 		position: relative;
-		width: 2.4rem;
-		height: 1.3rem;
+		width: 32px;
+		height: 18px;
 		border: 1px solid var(--line);
 		border-radius: 999px;
 		background: var(--background);
@@ -40,17 +40,10 @@
 		border-color: var(--blue);
 	}
 	.toggle-knob {
-		position: absolute;
-		top: 1px;
-		left: 1px;
-		width: calc(1.3rem - 4px);
-		height: calc(1.3rem - 4px);
 		border-radius: 50%;
 		background: var(--foreground);
 		transition: transform 0.12s ease;
 	}
 	.toggle.on .toggle-knob {
-		transform: translateX(1.1rem);
-		background: #fff;
 	}
 </style>

web/src/lib/components/kit/ToggleRow.svelte

@@ -17,12 +17,7 @@
 
 <style>
 	.toggle-row {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		gap: 1rem;
 		color: var(--foreground);
-		font-size: 0.85rem;
 		cursor: pointer;
 	}
 </style>