body.auth-body{display:flex;flex-direction:column;align-items:center;padding:5rem 2rem 2rem;padding-top:calc(5rem + env(safe-area-inset-top));padding-bottom:calc(2rem + env(safe-area-inset-bottom));overflow-x:hidden}.auth-card{width:100%;max-width:420px;background:var(--bg-card);backdrop-filter:blur(40px);-webkit-backdrop-filter:blur(40px);border:1px solid var(--glass-border);border-radius:24px;padding:2.5rem 2rem;position:relative;overflow:hidden;margin-top:auto;margin-bottom:auto}.auth-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--glass-highlight),transparent)}.auth-title{font-size:1.5rem;font-weight:700;text-align:center;margin-bottom:.25rem;letter-spacing:-.02em}.auth-subtitle{font-size:.9rem;text-align:center;color:var(--text-secondary);margin-bottom:1.5rem}.tab-toggle{display:flex;background:#ffffff0d;border-radius:100px;padding:4px;margin-bottom:1.5rem}.tab-toggle button{flex:1;padding:.6rem 1rem;border:none;border-radius:100px;background:transparent;color:var(--text-muted);font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .25s ease}.tab-toggle button.active{background:#ffffff1a;color:var(--text-primary)}.auth-form{display:flex;flex-direction:column;gap:.75rem}.auth-view{display:none}.auth-view.active{display:block}.auth-card .message{display:none;padding:.75rem 1rem;border-radius:10px;font-size:.85rem;margin-bottom:.75rem;line-height:1.4}.auth-card .message.visible{display:block}.auth-card .message.error{background:var(--error-subtle, rgba(255, 77, 106, .1));border:1px solid rgba(255,77,106,.2);color:var(--error, #ff4d6a)}.auth-card .message.success{background:var(--accent-subtle);border:1px solid rgba(200,255,0,.2);color:var(--accent)}.auth-card .message .inline-btn{background:none;border:none;color:inherit;text-decoration:underline;cursor:pointer;font-family:inherit;font-size:inherit;padding:0}.auth-card .divider{display:flex;align-items:center;gap:1rem;margin:1.25rem 0;color:var(--text-muted);font-size:.8rem}.auth-card .divider:before,.auth-card .divider:after{content:"";flex:1;height:1px;background:var(--glass-border)}.oauth-buttons{display:flex;flex-direction:column;gap:.5rem}.btn-oauth{display:flex;align-items:center;justify-content:center;gap:.75rem;width:100%;padding:.75rem;background:#ffffff08;border:1px solid var(--glass-border);border-radius:12px;color:var(--text-primary);font-family:inherit;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-oauth:hover{background:#ffffff0f}.btn-oauth svg{width:20px;height:20px;flex-shrink:0}.forgot-link{text-align:right;margin-top:-.25rem}.forgot-link a{color:var(--text-muted);font-size:.8rem;cursor:pointer;transition:color .2s}.forgot-link a:hover{color:var(--text-secondary)}.back-link{color:var(--text-muted);font-size:.85rem;cursor:pointer;border:none;background:none;font-family:inherit;padding:0;margin-bottom:1rem;transition:color .2s}.back-link:hover{color:var(--text-secondary)}.code-inputs{display:flex;gap:.5rem;justify-content:center;margin:.75rem 0}.code-inputs input{width:48px;height:56px;text-align:center;font-size:1.5rem;font-weight:700;font-family:inherit;background:#ffffff08;border:1px solid var(--glass-border);border-radius:12px;color:var(--text-primary);outline:none;transition:all .2s}.code-inputs input:focus{border-color:#c8ff004d;background:#ffffff0d}.step-hint{font-size:.85rem;color:var(--text-secondary);text-align:center;margin-bottom:.5rem}.resend-link{text-align:center;margin-top:.25rem}.resend-link a{color:var(--text-muted);font-size:.8rem;text-decoration:none;cursor:pointer;transition:color .2s}.resend-link a:hover{color:var(--text-secondary)}.password-rules{font-size:.8rem;color:var(--text-muted);line-height:1.6}.password-rules span{display:block;transition:color .2s}.password-rules span.valid{color:var(--accent)}.success-check{width:64px;height:64px;border-radius:50%;background:var(--accent-subtle);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}.success-check svg{width:32px;height:32px}.hidden{display:none!important}#loading-state .loading-spinner{width:32px;height:32px;border:3px solid rgba(255,255,255,.1);border-top:3px solid var(--accent);border-radius:50%;animation:auth-spin .8s linear infinite;margin:4rem auto}@keyframes auth-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:480px){body.auth-body{padding:6rem 1rem 1rem}.auth-card{padding:2rem 1.5rem;border-radius:20px}.auth-title{font-size:1.3rem}.code-inputs input{width:42px;height:50px;font-size:1.3rem}}