.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-gray-50);position:relative}.auth-background{position:absolute;inset:0;background:linear-gradient(135deg,var(--color-primary-600) 0%,var(--color-primary-800) 100%);overflow:hidden}.auth-pattern{position:absolute;inset:0;background-image:radial-gradient(circle at 1px 1px,var(--color-gray-200) 1px,transparent 0);background-size:40px 40px;opacity:.2}.auth-content{position:relative;z-index:1;width:100%;max-width:28rem;padding:var(--space-6)}.auth-card{background:#fffffff2;--webkit-backdrop-filter: blur(10px);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);padding:var(--space-8)}.brand-header{text-align:center;margin-bottom:var(--space-6)}.brand-logo{display:flex;align-items:center;justify-content:center;gap:var(--space-2)}.logo-icon{display:flex}.brand-name{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-primary-700)}.auth-header{text-align:center;margin-top:var(--space-4)}.auth-title{font-size:var(--font-size-2xl);margin-bottom:var(--space-1);color:var(--color-gray-800)}.auth-subtitle{font-size:var(--font-size-sm);color:var(--color-gray-500)}.auth-form,.form-fields{display:flex;flex-direction:column;gap:var(--space-4)}.auth-input-group{display:flex;flex-direction:column;gap:var(--space-2)}.input-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-gray-700)}.input-wrapper{position:relative}.input-icon{position:absolute;top:50%;left:var(--space-3);transform:translateY(-50%);color:var(--color-gray-400)}.form-input{width:100%;height:2.75rem;padding:0 var(--space-3);padding-left:calc(var(--space-10));border:1px solid var(--color-gray-300);border-radius:var(--radius-lg);font-size:var(--font-size-sm);color:var(--color-gray-700);background:var(--color-white);transition:border-color var(--transition-base),box-shadow var(--transition-base)}.form-input:focus{outline:none;border-color:var(--color-primary-500);box-shadow:0 0 0 3px var(--color-primary-200)}.password-toggle{position:absolute;top:50%;right:var(--space-3);transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--color-gray-400)}.password-toggle:hover{color:var(--color-gray-600)}.form-extras{display:flex;justify-content:flex-end}.auth-button{width:100%;height:2.75rem;background:linear-gradient(135deg,var(--color-primary-600) 0%,var(--color-primary-800) 100%);color:var(--color-white);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;justify-content:center;gap:var(--space-2);box-shadow:var(--shadow-md)}.auth-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-lg)}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{background:var(--color-gray-400);cursor:not-allowed;transform:none;box-shadow:none}.loading-spinner{width:var(--space-4);height:var(--space-4);border:2px solid rgba(255,255,255,.3);border-top-color:var(--color-white);border-radius:var(--radius-full);animation:spin 1s linear infinite}.auth-divider{position:relative;text-align:center;margin:var(--space-3) 0}.auth-divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:var(--color-gray-200)}.auth-divider span{background:#fffffff2;padding:0 var(--space-3);color:var(--color-gray-500);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.auth-footer{text-align:center;margin-top:var(--space-2)}.auth-footer p{margin:0;font-size:var(--font-size-xs);color:var(--color-gray-500)}.auth-link{color:var(--color-primary-600);text-decoration:none;font-weight:var(--font-weight-semibold);transition:color var(--transition-base)}.auth-link:hover{color:var(--color-primary-700);text-decoration:underline}@media (max-width: 480px){.auth-container{padding:var(--space-2)}.auth-card{padding:var(--space-4);border-radius:var(--radius-xl)}.auth-title{font-size:var(--font-size-xl)}.brand-name{font-size:var(--font-size-lg)}.form-input,.auth-button{height:2.5rem}}.step-indicator{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--color-gray-100);border-radius:var(--radius-full);margin-bottom:var(--space-6)}.step-indicator .step-number{font-weight:var(--font-weight-semibold);color:var(--color-primary-600)}.step-indicator .step-text{color:var(--color-gray-600);font-size:var(--font-size-sm)}.auth-subtitle strong{color:var(--color-primary-600);font-weight:var(--font-weight-semibold)}
