React auth: OTP + magic link + JWT (house stack)

The front half of the house auth vertical, extracted from perfect-resume (the superset implementation; brandician lacks password login/reset, wine-your-sign lacks refresh). Works against the standard FastAPI backend (auth.py + OTP modules — still project-embedded; the JWT/OTP endpoints are identical across the sibling projects).

Files (assets/)

Requires the react-api-client skill first — the store calls its auth.* namespace and formats errors with getErrorMessage(); tokens land in localStorage as access_token/refresh_token where the client's interceptors expect them.

The flow (backend contract, /api/v1.0)

1. POST /auth/register or /auth/login (email) → {otp_id}; an email goes out with a 6-digit code and a magic link (?magic=<token>).
2. POST /auth/verify-otp {otp_id, code} or POST /auth/magic-link {token} → {access_token, refresh_token}. Login/Register forms auto-call verifyMagicLink on mount when ?magic= is present (spinner → navigate to the app).
3. Password variants: /auth/login-password, /auth/password-reset/request, /auth/password-reset/confirm (code) or /confirm-magic (link token).
4. Token refresh is handled by the api-client interceptor, not the store.

Adaptation points

• auth.ts persist key (PROJECT CONFIG marker) — must be unique per app.
• AuthGuard.tsx uses the project's Tailwind theme tokens (pr-* in the template) — swap for the project's palette.
• Login/Register forms are intentionally not bundled (heavily styled per project); reference implementations: perfect-resume/front-end/src/components/auth/LoginForm.tsx and RegisterForm.tsx (captcha, invite codes, waitlist, magic-link auto-verify).