style: refina base visual e navegação

src/features/auth/components/auth-card-shell.tsx

@@ -5,7 +5,7 @@ import AuthSidebar from "./auth-sidebar";
 
 export function AuthCardShell({ children }: PropsWithChildren) {
 	return (
-		<Card className="relative overflow-hidden rounded-2xl border-primary/10 bg-card p-0 shadow-none">
+		<Card className="relative overflow-hidden p-0">
 			<div className="pointer-events-none absolute inset-0 overflow-hidden rounded-[inherit]">
 				<DotPattern
 					width={17}

src/features/auth/components/auth-sidebar.tsx

@@ -26,7 +26,7 @@ function AuthSidebar() {
 					<h2 className="text-[2rem] font-semibold leading-[1.04] tracking-[-0.03em] text-black/84 lg:text-[2.35rem]">
 						Controle suas finanças com clareza e foco diário.
 					</h2>
-					<p className="max-w-[18rem] text-sm leading-6 text-black/68">
+					<p className="max-w-2xs text-sm leading-6 text-black/68">
 						Centralize despesas, organize cartões e acompanhe metas mensais em
 						um painel inteligente feito para o seu dia a dia.
 					</p>

src/features/auth/components/login-form.tsx

@@ -195,37 +195,41 @@ export function LoginForm({ className, ...props }: DivProps) {
 						</FieldSeparator>
 
 						<Field>
-							<GoogleAuthButton
-								onClick={handleGoogle}
-								loading={loadingGoogle}
-								disabled={
-									loadingEmail ||
-									loadingGoogle ||
-									loadingPasskey ||
-									!isGoogleAvailable
-								}
-								text="Entrar com Google"
-							/>
-						</Field>
+							<div
+								className={cn(
+									passkeySupported ? "grid grid-cols-2 gap-2" : "flex",
+								)}
+							>
+								<GoogleAuthButton
+									onClick={handleGoogle}
+									loading={loadingGoogle}
+									disabled={
+										loadingEmail ||
+										loadingGoogle ||
+										loadingPasskey ||
+										!isGoogleAvailable
+									}
+									text="Google"
+								/>
 
-						{passkeySupported && (
-							<Field>
-								<Button
-									variant="outline"
-									type="button"
-									onClick={handlePasskey}
-									disabled={loadingEmail || loadingGoogle || loadingPasskey}
-									className="w-full gap-2"
-								>
-									{loadingPasskey ? (
-										<RiLoader4Line className="h-4 w-4 animate-spin" />
-									) : (
-										<RiFingerprintLine className="h-5 w-5" />
-									)}
-									<span>Entrar com passkey</span>
-								</Button>
-							</Field>
-						)}
+								{passkeySupported && (
+									<Button
+										variant="outline"
+										type="button"
+										onClick={handlePasskey}
+										disabled={loadingEmail || loadingGoogle || loadingPasskey}
+										className="w-full gap-2"
+									>
+										{loadingPasskey ? (
+											<RiLoader4Line className="h-4 w-4 animate-spin" />
+										) : (
+											<RiFingerprintLine className="h-5 w-5" />
+										)}
+										<span>Passkey</span>
+									</Button>
+								)}
+							</div>
+						</Field>
 
 						<FieldDescription className="pt-1 text-center">
 							Não tem uma conta?{" "}