feat: add forced password change page on first login

The backend sets mustChangePassword=true for all new accounts and
blocks API calls until the password is changed. The frontend was not
handling this flag - it logged the user in and redirected to the
dashboard where every API call silently failed with 403.

Add a /change-password page that is shown when mustChangePassword is
true. The login page now redirects there instead of home, and the
AuthGuard intercepts any direct navigation to force the change first.

apps/web/src/pages/change-password-page.tsx

@@ -0,0 +1,135 @@
+import { type FormEvent, useState } from "react";
+
+export function ChangePasswordPage() {
+  const [currentPassword, setCurrentPassword] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [error, setError] = useState("");
+  const [loading, setLoading] = useState(false);
+
+  const handleSubmit = async (e: FormEvent) => {
+    e.preventDefault();
+    setError("");
+
+    if (newPassword !== confirmPassword) {
+      setError("Passwords do not match");
+      return;
+    }
+
+    setLoading(true);
+    try {
+      const token = localStorage.getItem("stirling-token");
+      const res = await fetch("/api/auth/change-password", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          Authorization: `Bearer ${token}`,
+        },
+        body: JSON.stringify({ currentPassword, newPassword }),
+      });
+
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({}));
+        setError(data.error || "Failed to change password");
+        return;
+      }
+
+      // Password changed, reload to re-check auth state
+      window.location.href = "/";
+    } catch {
+      setError("Connection error");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="flex h-screen bg-background">
+      <div className="flex-1 flex items-center justify-center p-8">
+        <div className="w-full max-w-md space-y-8">
+          <div>
+            <h1 className="text-3xl font-bold text-foreground">
+              Stirling <span className="text-primary">Image</span>
+            </h1>
+            <h2 className="text-2xl font-bold mt-4 text-foreground">Change your password</h2>
+            <p className="text-sm text-muted-foreground mt-2">
+              You need to set a new password before continuing. Your password must be at least 8
+              characters with uppercase, lowercase, and a number.
+            </p>
+          </div>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div>
+              <label
+                htmlFor="current-password"
+                className="block text-sm font-medium mb-1 text-foreground"
+              >
+                Current password
+              </label>
+              <input
+                id="current-password"
+                type="password"
+                value={currentPassword}
+                onChange={(e) => setCurrentPassword(e.target.value)}
+                placeholder="Enter current password"
+                className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
+                required
+              />
+            </div>
+            <div>
+              <label
+                htmlFor="new-password"
+                className="block text-sm font-medium mb-1 text-foreground"
+              >
+                New password
+              </label>
+              <input
+                id="new-password"
+                type="password"
+                value={newPassword}
+                onChange={(e) => setNewPassword(e.target.value)}
+                placeholder="At least 8 characters"
+                className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
+                required
+                minLength={8}
+              />
+            </div>
+            <div>
+              <label
+                htmlFor="confirm-password"
+                className="block text-sm font-medium mb-1 text-foreground"
+              >
+                Confirm new password
+              </label>
+              <input
+                id="confirm-password"
+                type="password"
+                value={confirmPassword}
+                onChange={(e) => setConfirmPassword(e.target.value)}
+                placeholder="Repeat new password"
+                className="w-full px-4 py-3 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
+                required
+                minLength={8}
+              />
+            </div>
+            {error && <p className="text-sm text-destructive">{error}</p>}
+            <button
+              type="submit"
+              disabled={loading || !currentPassword || !newPassword || !confirmPassword}
+              className="w-full py-3 rounded-lg bg-primary/80 text-primary-foreground font-medium hover:bg-primary transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+            >
+              {loading ? "Changing..." : "Change password"}
+            </button>
+          </form>
+        </div>
+      </div>
+      <div className="hidden lg:flex flex-1 bg-primary/90 items-center justify-center p-12 text-white rounded-l-3xl">
+        <div className="max-w-lg space-y-6 text-center">
+          <h2 className="text-3xl font-bold">Almost there</h2>
+          <p className="text-lg text-white/80">
+            Set a strong password to secure your account, then you are good to go.
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/web/src/pages/login-page.tsx

@@ -26,8 +26,12 @@ export function LoginPage() {
       setToken(data.token);
       // Store username for settings display
       localStorage.setItem("stirling-username", data.user?.username || username);
-      // Full reload to force auth re-check (useAuth runs on mount)
-      window.location.href = "/";
+      // Redirect to password change if required, otherwise go home
+      if (data.user?.mustChangePassword) {
+        window.location.href = "/change-password";
+      } else {
+        window.location.href = "/";
+      }
     } catch {
       setError("Connection error");
     } finally {