style(onboarding): restyle sso-gate provider buttons to org-combobox card style

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/features/onboarding/steps/step-sso-gate.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useOnboarding } from "@onboardjs/react";
+import { Globe } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { mockSsoConfig } from "@/features/onboarding/onboarding.mock";
 
@@ -26,9 +27,17 @@ export const StepSsoGate = () => {
             </div>
             <div className="flex flex-col gap-2">
                 {mockSsoConfig.providers.map((provider) => (
-                    <Button key={provider.id} variant="outline" type="button" onClick={() => chooseProvider(provider.id)}>
-                        Continue with {provider.label}
-                    </Button>
+                    <button
+                        key={provider.id}
+                        type="button"
+                        onClick={() => chooseProvider(provider.id)}
+                        className="flex items-center gap-3 rounded-lg border border-border p-3 text-sm hover:bg-accent/50 hover:border-primary/20 transition-colors w-full"
+                    >
+                        <div className="size-9 rounded-md border bg-muted/50 shadow-sm flex items-center justify-center shrink-0">
+                            <Globe className="size-4 text-muted-foreground" />
+                        </div>
+                        <span>Continue with {provider.label}</span>
+                    </button>
                 ))}
             </div>
             {!mockSsoConfig.forced && (