Sync Passport feature with user data

[akeight]

Currently the passport PR draft is set up with mock data. We need to sync that feature with real user data.

[Jose-Gael-Cruz-Lopez]

Analysis before anyone starts, because "real user data" resolves two different ways and they differ by a whole plan.

What the draft actually contains

components/hq/passport.tsx on feature/my-passport (#172) is fully static — no useTracker, no tracked, no props. Eight stamps are hardcoded across STAMPS_LEFT / STAMPS_RIGHT, and each is hand-tuned:

{ id: "htn", top: "HACK THE NORTH", sub: "TORONTO · ON", year: "2024",
  mono: "HTN", label: "HACKED", color: "#ed5b29",
  pos: { left: -6, top: 8, size: 196 }, rotate: -8, delay: 0, ... }

So this isn't swapping an array for a fetch. Every visual property — placement, rotation, size, mono code, colour — is authored per hackathon. Real data arrives as arbitrary hackathons with none of that, so the actual work is a generator: derive the mono code from the name, pick colour from the existing status palette, and lay stamps out on a grid by index instead of by hand-picked coordinates.

The fork in "real user data"

Option A — the local tracker, doable now. store.tsx already holds tracked: TrackerMap with stages interested | applied | accepted | going, persisted to localStorage. A passport driven by this needs no backend and could ship right after #172.

Option B — server-persisted, blocked. web/README.md is explicit that the tracker is local and "nothing is persisted server-side". Real cross-device user data needs Clerk↔Supabase identity and a per-user table, which is plan 3 in #197 and doesn't exist yet.

If you mean A, this is unblocked once #172 lands. If you mean B, it can't start yet.

Three questions the implementer will hit immediately

1. Which stage earns a stamp? The copy says "every hackathon you've hacked", which argues going — but accepted and applied are also tracked. A stamp for something you merely bookmarked would cheapen it.
2. What does an empty passport look like? A new user has zero tracked hackathons, so both pages render blank. The current design has no empty state.
3. What happens past eight? The layout is two fixed pages of hand-placed stamps. Ten tracked hackathons need either pagination, scaling, or a cap.

Blocked on

#172 — the component isn't in main yet, so there's nothing to sync.