feat(frontend): add progress tracking

frontend/src/components/questions/completion-indicator.tsx

@@ -0,0 +1,26 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import { CheckCircle } from "lucide-react";
+import { isQuestionCompleted } from "@/lib/progress";
+
+interface CompletionIndicatorProps {
+  slug: string;
+}
+
+export function CompletionIndicator({ slug }: CompletionIndicatorProps) {
+  const [completed, setCompleted] = useState(false);
+
+  useEffect(() => {
+    setCompleted(isQuestionCompleted(slug));
+  }, [slug]);
+
+  if (!completed) return null;
+
+  return (
+    <CheckCircle
+      className="h-4 w-4 text-green-500 flex-shrink-0"
+      aria-label="Completed"
+    />
+  );
+}

frontend/src/components/questions/question-card.tsx

@@ -1,6 +1,7 @@
 import Link from "next/link";
 import { Badge } from "@/components/ui/badge";
 import { getDifficultyVariant, getDifficultyLabel, capitalize } from "@/lib/utils";
+import { CompletionIndicator } from "./completion-indicator";
 import type { QuestionListItem } from "@/types";
 
 interface QuestionCardProps {
@@ -14,7 +15,10 @@ export function QuestionCard({ question }: QuestionCardProps) {
       className="block p-4 rounded-lg border border-[var(--border)] bg-[var(--card)] hover:border-[var(--primary)] transition-colors"
     >
       <div className="flex items-start justify-between gap-4 mb-3">
-        <h3 className="font-semibold">{question.title}</h3>
+        <div className="flex items-center gap-2">
+          <CompletionIndicator slug={question.slug} />
+          <h3 className="font-semibold">{question.title}</h3>
+        </div>
         <Badge
           variant={getDifficultyVariant(question.difficulty)}
           aria-label={getDifficultyLabel(question.difficulty)}