feat: replace all vanilla HTML elements with shadcn components

- Install skeleton and tooltip shadcn components
- event-dialog: textarea → Textarea, duration chips → Button ghost
- date-time-picker: raw button trigger → Button outline, quick-date chips → Button ghost
- event-card: <a> URL link → Button link asChild
- sign-in: animate-pulse div → Skeleton
- ai-toolbar: animate-pulse div → Skeleton, event count span → Badge secondary
- event-actions-toolbar: event count span → Badge secondary

src/components/ai-toolbar.tsx

@@ -15,8 +15,10 @@ import {
 import Image from "next/image";
 import { IcsFilePicker } from "@/components/ics-file-picker";
 import { ImagePicker } from "@/components/image-picker";
+import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Separator } from "@/components/ui/separator";
+import { Skeleton } from "@/components/ui/skeleton";
 import { Textarea } from "@/components/ui/textarea";
 import type { CalendarEvent } from "@/lib/types";
 
@@ -62,8 +64,8 @@ export const AIToolbar = ({
 }: AIToolbarProps) => {
 	if (isPending) {
 		return (
-			<div className="glass-card p-4 mb-6 animate-pulse">
-				<div className="h-10 bg-muted/50 rounded-lg" />
+			<div className="glass-card p-4 mb-6">
+				<Skeleton className="h-10 w-full rounded-lg" />
 			</div>
 		);
 	}
@@ -192,9 +194,9 @@ export const AIToolbar = ({
 
 					<div className="ml-auto flex items-center gap-3">
 						{events.length > 0 && (
-							<span className="text-xs text-muted-foreground">
+							<Badge variant="secondary" className="text-xs">
 								{events.length} event{events.length !== 1 ? "s" : ""}
-							</span>
+							</Badge>
 						)}
 						{isAuthenticated && (
 							<Button