:root{--radius: .625rem;--background: oklch(.145 0 0);--foreground: oklch(.985 0 0);--card: oklch(.205 0 0);--card-foreground: oklch(.985 0 0);--primary: oklch(.88 .15 174);--primary-foreground: oklch(.145 0 0);--muted: oklch(.269 0 0);--muted-foreground: oklch(.708 0 0);--border: oklch(1 0 0 / 10%);--input: oklch(1 0 0 / 15%);--ring: oklch(.88 .15 174);--destructive: oklch(.704 .191 22.216);--radius-md: calc(var(--radius) - 2px);--radius-lg: var(--radius);--radius-xl: calc(var(--radius) + 4px);--space-xs: .5rem;--space-sm: .75rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--ease-out: cubic-bezier(.23, 1, .32, 1)}*{box-sizing:border-box}html{color-scheme:dark;background-color:var(--background)}body{margin:0;min-height:100vh;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--background);color:var(--foreground)}.connect{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:var(--space-md)}.connect-card{display:flex;flex-direction:column;gap:var(--space-lg);width:100%;max-width:28rem;padding:var(--space-xl) var(--space-lg);background:var(--card);color:var(--card-foreground);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:0 10px 15px -3px #0003,0 4px 6px -4px #0003}.brand-logo{display:flex;justify-content:center;margin:0;padding-bottom:var(--space-xs)}.brand-logo img{width:64px;height:64px;object-fit:contain;display:block}.connect-header{text-align:center;margin:0}.connect-header h1{font-size:1.5rem;font-weight:600;letter-spacing:-.025em;line-height:1.25;margin:0;color:var(--foreground)}.connect-header p{margin:var(--space-sm) 0 0;color:var(--muted-foreground);font-size:.875rem;line-height:1.5}.connect-form{display:flex;flex-direction:column;gap:var(--space-md);margin:0}.connect-form .field{display:flex;flex-direction:column;gap:var(--space-xs)}.connect h1{font-size:1.5rem;font-weight:600;letter-spacing:-.025em;line-height:1.25;margin:0;color:var(--foreground)}.connect p{color:var(--muted-foreground);font-size:.875rem;line-height:1.5;margin:0}.connect label{display:block;font-size:.875rem;font-weight:500;line-height:1.35;color:var(--foreground);margin:0}.connect label .required{color:var(--destructive)}.connect input{width:100%;height:3rem;padding:.25rem .75rem;border:1px solid var(--input);border-radius:var(--radius-xl);background:transparent;color:var(--foreground);font-size:.875rem;margin:0;outline:none;transition:border-color .16s var(--ease-out),box-shadow .16s var(--ease-out)}.connect input::placeholder{color:var(--muted-foreground)}.connect input:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px #49f7d07f}.connect button{width:100%;height:3rem;padding:0 1rem;border:none;border-radius:var(--radius-md);background:var(--primary);color:var(--primary-foreground);font-size:.875rem;font-weight:600;cursor:pointer;transition:background-color .16s var(--ease-out),transform .16s var(--ease-out)}.connect button:hover:not(:disabled){background:#49f7d0e5}.connect button:active:not(:disabled){transform:scale(.97)}.connect button:focus-visible{outline:none;box-shadow:0 0 0 3px #49f7d07f}.connect button:disabled{opacity:.5;cursor:not-allowed}.connect .error{color:var(--destructive);font-size:.875rem;margin:0;padding:var(--space-sm) var(--space-md);background:#ff65681a;background:oklch(.704 .191 22.216 / 10%);border:1px solid oklch(.704 .191 22.216 / 20%);border-radius:var(--radius-md)}.connect .hint{font-size:.8rem;color:var(--muted-foreground);margin:0}.connect .success{color:var(--primary);font-size:.875rem;font-weight:500;margin:0;text-align:center}.connect .link-button{height:2.5rem;background:transparent;color:var(--primary);border:1px solid var(--border);font-weight:500}.connect .link-button:hover:not(:disabled){background:#49f7d014}.connect .signup-prompt{text-align:center;font-size:.875rem;color:var(--muted-foreground);margin:0;padding-top:var(--space-xs)}.connect .signup-prompt a{color:var(--primary);text-decoration:none;border-radius:.25rem;transition:color .16s var(--ease-out)}@media (hover: hover) and (pointer: fine){.connect .signup-prompt a:hover{text-decoration:underline}}.connect .signup-prompt a:focus-visible{outline:2px solid var(--ring);outline-offset:2px}@media (prefers-reduced-motion: reduce){.connect button,.connect input,.connect .signup-prompt a{transition:none}.connect button:active:not(:disabled){transform:none}}