Refactor: reorganize components into domain subfolders

shared/    → StatusBadge
layout/    → Navbar
championships/ → ChampionshipCard
registrations/ → RegistrationCard, RegistrationTimeline
admin/     → UserCard

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/src/components/registrations/RegistrationTimeline.tsx

@@ -0,0 +1,57 @@
+import { Registration } from "@/types/registration";
+
+const STEPS: { key: string; label: string }[] = [
+  { key: "submitted", label: "Submitted" },
+  { key: "form_submitted", label: "Form submitted" },
+  { key: "payment_pending", label: "Payment pending" },
+  { key: "payment_confirmed", label: "Payment confirmed" },
+  { key: "video_submitted", label: "Video submitted" },
+  { key: "accepted", label: "Accepted" },
+];
+
+interface Props {
+  registration: Registration;
+}
+
+export function RegistrationTimeline({ registration }: Props) {
+  const currentIndex = STEPS.findIndex((s) => s.key === registration.status);
+  const isRejected = registration.status === "rejected";
+  const isWaitlisted = registration.status === "waitlisted";
+
+  if (isRejected) {
+    return (
+      <div className="rounded-lg bg-red-50 px-4 py-3 text-sm text-red-700">
+        Your registration was <strong>rejected</strong>.
+      </div>
+    );
+  }
+
+  if (isWaitlisted) {
+    return (
+      <div className="rounded-lg bg-amber-50 px-4 py-3 text-sm text-amber-700">
+        You are on the <strong>waitlist</strong>.
+      </div>
+    );
+  }
+
+  return (
+    <div className="space-y-2">
+      <p className="text-sm font-medium text-gray-700">Registration progress</p>
+      <ol className="space-y-2">
+        {STEPS.map((step, i) => {
+          const done = i <= currentIndex;
+          return (
+            <li key={step.key} className="flex items-center gap-3 text-sm">
+              <span className={`flex h-5 w-5 shrink-0 items-center justify-center rounded-full text-xs font-bold ${
+                done ? "bg-violet-600 text-white" : "bg-gray-200 text-gray-400"
+              }`}>
+                {done ? "✓" : i + 1}
+              </span>
+              <span className={done ? "text-gray-900" : "text-gray-400"}>{step.label}</span>
+            </li>
+          );
+        })}
+      </ol>
+    </div>
+  );
+}