diff --git a/frontend/src/pages/settings/SettingsPage.tsx b/frontend/src/pages/settings/SettingsPage.tsx
index c77bb34..44f2393 100644
--- a/frontend/src/pages/settings/SettingsPage.tsx
+++ b/frontend/src/pages/settings/SettingsPage.tsx
@@ -273,6 +273,7 @@ function PasswordCard() {
 
 function TotpCard() {
   const qc = useQueryClient();
+  const isDemo = useDemoMode();
   const totpEnabled = useAuthStore(s => s.totpEnabled);
   const { setToken, token, userId, displayName } = useAuthStore();
 
@@ -346,10 +347,14 @@ function TotpCard() {
       {step === "idle" && !totpEnabled && (
         <div className="space-y-3">
           <p className="text-sm text-muted-foreground">Add an extra layer of security with an authenticator app.</p>
+          {isDemo && (
+            <p className="text-xs text-amber-400/80">2FA setup is disabled in demo mode.</p>
+          )}
           <button
             onClick={() => setupMutation.mutate()}
-            disabled={setupMutation.isPending}
-            className="flex items-center gap-2 bg-primary text-primary-foreground px-4 py-2 rounded-lg text-sm font-medium hover:bg-primary/90 disabled:opacity-50 transition-colors"
+            disabled={isDemo || setupMutation.isPending}
+            title={isDemo ? "Disabled in demo mode" : undefined}
+            className="flex items-center gap-2 bg-primary text-primary-foreground px-4 py-2 rounded-lg text-sm font-medium hover:bg-primary/90 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
           >
             {setupMutation.isPending && <Loader2 className="w-4 h-4 animate-spin" />}
             Set up 2FA
@@ -360,9 +365,14 @@ function TotpCard() {
       {step === "idle" && totpEnabled && (
         <div className="space-y-3">
           <p className="text-sm text-muted-foreground">2FA is active. Your account is protected.</p>
+          {isDemo && (
+            <p className="text-xs text-amber-400/80">2FA changes are disabled in demo mode.</p>
+          )}
           <button
             onClick={() => setStep("disable")}
-            className="flex items-center gap-2 border border-destructive/40 text-destructive px-4 py-2 rounded-lg text-sm font-medium hover:bg-destructive/10 transition-colors"
+            disabled={isDemo}
+            title={isDemo ? "Disabled in demo mode" : undefined}
+            className="flex items-center gap-2 border border-destructive/40 text-destructive px-4 py-2 rounded-lg text-sm font-medium hover:bg-destructive/10 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
           >
             Disable 2FA
           </button>