diff --git a/src/components/auth/AuthModal.tsx b/src/components/auth/AuthModal.tsx
index ca62eb33..0cfd06db 100644
--- a/src/components/auth/AuthModal.tsx
+++ b/src/components/auth/AuthModal.tsx
@@ -34,6 +34,10 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
     displayName: ''
   });
 
+  // Detect iframe environment and make CAPTCHA optional for preview compatibility
+  const isInIframe = window.self !== window.top;
+  const requireCaptcha = !isInIframe;
+
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setFormData(prev => ({
       ...prev,
@@ -45,7 +49,7 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
     e.preventDefault();
     setLoading(true);
 
-    if (!signInCaptchaToken) {
+    if (requireCaptcha && !signInCaptchaToken) {
       toast({
         variant: "destructive",
         title: "CAPTCHA required",
@@ -59,13 +63,16 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
     setSignInCaptchaToken(null);
 
     try {
-      const { error } = await supabase.auth.signInWithPassword({
+      const signInOptions: any = {
         email: formData.email,
         password: formData.password,
-        options: {
-          captchaToken: tokenToUse
-        }
-      });
+      };
+      
+      if (tokenToUse) {
+        signInOptions.options = { captchaToken: tokenToUse };
+      }
+
+      const { error } = await supabase.auth.signInWithPassword(signInOptions);
       if (error) throw error;
       
       toast({
@@ -109,7 +116,7 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
       return;
     }
 
-    if (!captchaToken) {
+    if (requireCaptcha && !captchaToken) {
       toast({
         variant: "destructive",
         title: "CAPTCHA required",
@@ -123,17 +130,22 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
     setCaptchaToken(null);
 
     try {
-      const { data, error } = await supabase.auth.signUp({
+      const signUpOptions: any = {
         email: formData.email,
         password: formData.password,
         options: {
-          captchaToken: tokenToUse,
           data: {
             username: formData.username,
             display_name: formData.displayName
           }
         }
-      });
+      };
+
+      if (tokenToUse) {
+        signUpOptions.options.captchaToken = tokenToUse;
+      }
+
+      const { data, error } = await supabase.auth.signUp(signUpOptions);
       
       if (error) throw error;
 
@@ -288,21 +300,23 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
                 </div>
               </div>
 
-              <div>
-                <TurnstileCaptcha
-                  key={signInCaptchaKey}
-                  onSuccess={setSignInCaptchaToken}
-                  onError={() => setSignInCaptchaToken(null)}
-                  onExpire={() => setSignInCaptchaToken(null)}
-                  siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
-                  theme="auto"
-                />
-              </div>
+              {requireCaptcha && (
+                <div>
+                  <TurnstileCaptcha
+                    key={signInCaptchaKey}
+                    onSuccess={setSignInCaptchaToken}
+                    onError={() => setSignInCaptchaToken(null)}
+                    onExpire={() => setSignInCaptchaToken(null)}
+                    siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
+                    theme="auto"
+                  />
+                </div>
+              )}
 
               <Button 
                 type="submit" 
                 className="w-full" 
-                disabled={loading || !signInCaptchaToken}
+                disabled={loading || (requireCaptcha && !signInCaptchaToken)}
               >
                 {loading ? "Signing in..." : "Sign In"}
               </Button>
@@ -448,21 +462,23 @@ export function AuthModal({ open, onOpenChange, defaultTab = 'signin' }: AuthMod
                 </div>
               </div>
 
-              <div>
-                <TurnstileCaptcha
-                  key={captchaKey}
-                  onSuccess={setCaptchaToken}
-                  onError={() => setCaptchaToken(null)}
-                  onExpire={() => setCaptchaToken(null)}
-                  siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
-                  theme="auto"
-                />
-              </div>
+              {requireCaptcha && (
+                <div>
+                  <TurnstileCaptcha
+                    key={captchaKey}
+                    onSuccess={setCaptchaToken}
+                    onError={() => setCaptchaToken(null)}
+                    onExpire={() => setCaptchaToken(null)}
+                    siteKey={import.meta.env.VITE_TURNSTILE_SITE_KEY}
+                    theme="auto"
+                  />
+                </div>
+              )}
 
               <Button 
                 type="submit" 
                 className="w-full" 
-                disabled={loading || !captchaToken}
+                disabled={loading || (requireCaptcha && !captchaToken)}
               >
                 {loading ? "Creating account..." : "Create Account"}
               </Button>