Refactor card component styles for improved layout consistency

- Standardized Card component classes across multiple files by removing unnecessary padding and gaps, enhancing visual alignment and creating a more cohesive appearance throughout the application.

web/src/lib/components/ui/card/card.svelte

@@ -22,8 +22,8 @@
 	data-density={density}
 	class={cn(
 		"ring-foreground/10 bg-card text-card-foreground overflow-hidden rounded-xl text-sm ring-1 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col",
-		"density-default gap-4 py-4 data-[size=sm]:gap-3 data-[size=sm]:py-3",
-		"density-compact gap-0 py-0",
+		"data-[density=default]:gap-4 data-[density=default]:py-4 data-[density=default]:data-[size=sm]:gap-3 data-[density=default]:data-[size=sm]:py-3",
+		"data-[density=compact]:gap-0 data-[density=compact]:py-0",
 		className
 	)}
 	{...restProps}

web/src/routes/+page.svelte

@@ -563,7 +563,7 @@
 	{#snippet skeleton()}
 		<div class="mb-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6">
 			{#each Array.from({ length: 6 }) as _, i (i)}
-				<Card.Root class="gap-0 py-0 border border-border shadow-sm">
+				<Card.Root class="border border-border shadow-sm">
 					<Card.Header class="space-y-2 pb-2">
 						<Skeleton class="h-3 w-24" />
 						<Skeleton class="h-8 w-20" />

web/src/routes/incidents/+page.svelte

@@ -312,7 +312,7 @@
 	{#snippet skeleton()}
 		<div class="mb-4 grid gap-4 sm:grid-cols-3">
 			{#each Array.from({ length: 3 }) as _, i (i)}
-				<Card.Root class="gap-0 py-0">
+				<Card.Root>
 					<Card.Header class="pb-2">
 						<Skeleton class="h-4 w-20" />
 						<Skeleton class="mt-2 h-8 w-12" />
@@ -320,7 +320,7 @@
 				</Card.Root>
 			{/each}
 		</div>
-		<Card.Root class="gap-0 py-0">
+		<Card.Root>
 			<Card.Content class="space-y-2 p-4">
 				{#each Array.from({ length: 6 }) as _, i (i)}
 					<Skeleton class="h-12 w-full" />

web/src/routes/ips/+page.svelte

@@ -528,7 +528,7 @@
 >
 	{#snippet skeleton()}
 		<div class="space-y-4">
-			<Card.Root class="gap-0 py-0">
+			<Card.Root>
 				<Card.Header>
 					<Skeleton class="h-5 w-48" />
 					<Skeleton class="h-4 w-64" />
@@ -537,7 +537,7 @@
 					<Skeleton class="h-[420px] w-full rounded-md" />
 				</Card.Content>
 			</Card.Root>
-			<Card.Root class="gap-0 py-0">
+			<Card.Root>
 				<Card.Content class="space-y-2 p-4">
 					{#each Array.from({ length: 6 }) as _, i (i)}
 						<Skeleton class="h-10 w-full" />

web/src/routes/mihomo/+page.svelte

@@ -255,7 +255,7 @@
 				</KpiStatCard>
 			</div>
 
-			<Card.Root class="gap-0 py-0 border-l-4 border-l-violet-500/40 shadow-sm">
+			<Card.Root class="border-l-4 border-l-violet-500/40 shadow-sm">
 				<Card.Header class="pb-2">
 					<Card.Title class="text-base">Ноды</Card.Title>
 					<Card.Description>

web/src/routes/servers/[alias]/+page.svelte

@@ -114,7 +114,7 @@
 	{#snippet skeleton()}
 		<div class="mb-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
 			{#each Array.from({ length: 4 }) as _, i (i)}
-				<Card.Root class="gap-0 py-0 border border-border shadow-sm">
+				<Card.Root class="border border-border shadow-sm">
 					<Card.Header class="space-y-2 pb-2">
 						<Skeleton class="h-3 w-24" />
 						<Skeleton class="h-8 w-20" />

web/src/routes/servers/[alias]/mihomo/+page.svelte

@@ -514,7 +514,7 @@
 		<Skeleton class="mb-4 h-6 w-96 max-w-full" />
 		<div class="mb-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6">
 			{#each Array.from({ length: 6 }) as _, i (i)}
-				<Card.Root class="gap-0 py-0 border-l-4 border-l-muted-foreground/30 shadow-sm">
+				<Card.Root class="border-l-4 border-l-muted-foreground/30 shadow-sm">
 					<Card.Header class="pb-2">
 						<div class="flex gap-3">
 							<Skeleton class="size-10 shrink-0 rounded-lg" />
@@ -532,7 +532,7 @@
 		</div>
 		<div class="grid gap-4 lg:grid-cols-2">
 			{#each Array.from({ length: 6 }) as _, i (i)}
-				<Card.Root class="gap-0 py-0 border-l-4 border-l-muted-foreground/30 shadow-sm">
+				<Card.Root class="border-l-4 border-l-muted-foreground/30 shadow-sm">
 					<Card.Header class="pb-2">
 						<div class="flex gap-3">
 							<Skeleton class="size-10 shrink-0 rounded-lg" />

web/src/routes/users/+page.svelte

@@ -366,7 +366,7 @@
 	isEmpty={isDataEmpty}
 >
 	{#snippet skeleton()}
-		<Card.Root class="gap-0 py-0">
+		<Card.Root>
 			<Card.Content class="space-y-2 p-4">
 				{#each Array.from({ length: 8 }) as _, i (i)}
 					<Skeleton class="h-10 w-full" />