feat: add ui kit page

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

@@ -4,6 +4,7 @@
 		type?: string;
 		placeholder?: string;
 		readonly?: boolean;
+		label?: string;
 		oninput?: (value: string) => void;
 	}
 	let {
@@ -11,6 +12,7 @@
 		type = "text",
 		placeholder = "",
 		readonly = false,
+		label,
 		oninput,
 	}: Props = $props();
 
@@ -26,6 +28,7 @@
 	{placeholder}
 	{readonly}
 	{value}
+	aria-label={label}
 	oninput={handle}
 />
 

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

@@ -1,20 +1,21 @@
 <script lang="ts">
 	import { ArrowUpRight } from "@lucide/svelte";
-	import type { Snippet } from "svelte";
+	import type { Component } from "svelte";
+	import Icon from "./Icon.svelte";
 
 	interface Props {
 		title: string;
 		href: string;
 		description?: string;
 		index?: number;
-		icon?: Snippet;
+		icon?: Component<{ size?: number; class?: string }>;
 	}
 	let { title, href, description, index, icon }: Props = $props();
 </script>
 
 <!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->
 <a class="tool-card" {href}>
-	{#if icon}<span class="tool-icon">{@render icon()}</span>{/if}
+	{#if icon}<span class="tool-icon"><Icon {icon} size={18} /></span>{/if}
 	<span class="tool-index">
 		{index !== undefined ? index.toString().padStart(2, "0") : ""}
 	</span>

web/src/lib/styles/design2.css

@@ -5,6 +5,18 @@
 @import "@fontsource/ibm-plex-mono/400.css";
 @import "@fontsource/ibm-plex-mono/500.css";
 
+/* Минимальный reset (новый дизайн грузится только на preview-маршрутах). */
+*,
+*::before,
+*::after {
+	box-sizing: border-box;
+}
+html,
+body {
+	margin: 0;
+	padding: 0;
+}
+
 /* Новый дизайн: токены (§2 плана redesign).
    Файл грузится только layout'ом новой ветки (preview/+layout), поэтому
    глобально не конфликтует со старым app.css. */