feat: implement video likes and play tracking UI

Video Detail Page (/videos/[slug]):
- Load like status from server on page load
- Add functional like button with heart icon
- Show likes count with real-time updates
- Track video plays when user clicks play
- Record watch progress every 10 seconds
- Mark video as completed at 90% watched
- Show toast notifications for like/unlike actions
- Require authentication to like videos

Video Listing Page (/videos):
- Display play count badge on video thumbnails
- Show play icon with count in top-right corner

Features:
- Like/unlike videos with live count updates
- Play tracking with analytics data
- Progress tracking for completion metrics
- Authentication-gated liking functionality
- User-friendly toast feedback

All UI components working and integrated with backend API

packages/frontend/src/routes/videos/[slug]/+page.server.ts

@@ -1,10 +1,26 @@
 import { error } from "@sveltejs/kit";
-import { getCommentsForVideo, getVideoBySlug } from "$lib/services.js";
+import { getCommentsForVideo, getVideoBySlug, getVideoLikeStatus } from "$lib/services.js";
+
 export async function load({ fetch, params, locals }) {
 	const video = await getVideoBySlug(params.slug, fetch);
 	const comments = await getCommentsForVideo(video.id, fetch);
+
+	let likeStatus = { liked: false };
+	if (locals.authStatus.authenticated) {
+		try {
+			likeStatus = await getVideoLikeStatus(video.id, fetch);
+		} catch (error) {
+			console.error("Failed to get like status:", error);
+		}
+	}
+
 	try {
-		return { video, comments, authStatus: locals.authStatus };
+		return {
+			video,
+			comments,
+			authStatus: locals.authStatus,
+			likeStatus
+		};
 	} catch {
 		error(404, "Video not found");
 	}