.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:1rem}.login-card{background:#fff;border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;padding:2.5rem;width:100%;max-width:420px}.dark .login-card{background:#1f2937}.login-header{text-align:center;margin-bottom:1.5rem}.login-header h1{font-size:1.875rem;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.dark .login-header h1{background:linear-gradient(135deg,#818cf8,#a78bfa);-webkit-background-clip:text;background-clip:text}.login-header p{color:#6b7280;font-size:.875rem}.dark .login-header p{color:#9ca3af}.auth-tabs{display:flex;margin-bottom:1.5rem;border-bottom:1px solid #e5e7eb}.dark .auth-tabs{border-bottom-color:#374151}.auth-tab{flex:1;padding:.75rem .5rem;font-size:.875rem;font-weight:500;color:#6b7280;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .2s ease}.auth-tab:hover{color:#4f46e5}.auth-tab.active{color:#4f46e5;border-bottom-color:#4f46e5}.dark .auth-tab{color:#9ca3af}.dark .auth-tab:hover,.dark .auth-tab.active{color:#818cf8;border-bottom-color:#818cf8}.login-form{display:flex;flex-direction:column;gap:1.25rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.875rem;font-weight:500;color:#374151}.dark .form-group label{color:#d1d5db}.form-group input{padding:.75rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:1rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;background:#fff;color:#1f2937}.dark .form-group input{background:#374151;border-color:#4b5563;color:#f9fafb}.form-group input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f133}.form-group input:disabled{background-color:#f3f4f6;cursor:not-allowed}.dark .form-group input:disabled{background-color:#1f2937}.login-button{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;font-weight:600;font-size:1rem;border:none;border-radius:.5rem;cursor:pointer;transition:transform .15s ease-in-out,box-shadow .15s ease-in-out;margin-top:.5rem}.login-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 20px -10px #6366f180}.login-button:disabled{opacity:.7;cursor:not-allowed}.spinner{width:1.25rem;height:1.25rem;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{color:#ef4444;font-size:.875rem;text-align:center;padding:.75rem;background-color:#fef2f2;border-radius:.375rem;margin-top:1rem}.dark .error-message{background-color:#ef44441a}.success-message{color:#10b981;font-size:.875rem;text-align:center;padding:.75rem;background-color:#ecfdf5;border-radius:.375rem;margin-top:1rem}.dark .success-message{background-color:#10b9811a}.login-footer{margin-top:1.5rem;text-align:center;padding-top:1.5rem;border-top:1px solid #e5e7eb}.dark .login-footer{border-top-color:#374151}.login-footer p{color:#6b7280;font-size:.8rem}.login-footer strong{color:#4f46e5}.dark .login-footer strong{color:#818cf8}.link-button{background:none;border:none;color:#4f46e5;font-weight:600;cursor:pointer;text-decoration:underline;font-size:inherit}.link-button:hover{color:#4338ca}.dark .link-button{color:#818cf8}.dark .link-button:hover{color:#a5b4fc}.dark .login-footer p{color:#9ca3af}.support-link{margin-top:1rem;padding-top:1rem;border-top:1px solid #e5e7eb;font-size:.8rem}.dark .support-link{border-top-color:#374151}.support-link a{color:#6366f1;text-decoration:none;font-weight:600}.support-link a:hover{text-decoration:underline}.dark .support-link a{color:#818cf8}.user-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:#6366f11a;border-radius:.5rem;margin-bottom:1rem}.dark .user-header{background:#6366f133}.user-info{display:flex;align-items:center;gap:.75rem}.user-avatar{width:2.5rem;height:2.5rem;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1rem}.user-details{display:flex;flex-direction:column}.user-email{font-size:.875rem;font-weight:500;color:#1f2937}.dark .user-email{color:#f9fafb}.user-plan{font-size:.75rem;color:#6b7280}.dark .user-plan{color:#9ca3af}.user-credits{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#fff;border-radius:.375rem;font-size:.875rem;font-weight:500}.dark .user-credits{background:#374151}.credits-label{color:#6b7280}.dark .credits-label{color:#9ca3af}.credits-value{color:#10b981;font-weight:700}.logout-button{padding:.5rem 1rem;background:transparent;border:1px solid #d1d5db;border-radius:.375rem;color:#6b7280;font-size:.875rem;cursor:pointer;transition:all .15s ease-in-out}.dark .logout-button{border-color:#4b5563;color:#9ca3af}.logout-button:hover{background:#f3f4f6;color:#374151}.dark .logout-button:hover{background:#374151;color:#f9fafb}.projects-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.projects-modal{background:#fff;border-radius:1rem;width:90%;max-width:900px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 25px 50px -12px #00000040}.dark .projects-modal{background:#1f2937}.projects-modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid #e5e7eb}.dark .projects-modal-header{border-color:#374151}.projects-modal-header h2{margin:0;font-size:1.5rem;color:#111827}.dark .projects-modal-header h2{color:#f9fafb}.modal-close-btn{background:transparent;border:none;font-size:1.5rem;cursor:pointer;color:#6b7280;padding:.5rem;line-height:1}.modal-close-btn:hover{color:#111827}.dark .modal-close-btn:hover{color:#f9fafb}.projects-modal-content{flex:1;overflow-y:auto;padding:1.5rem}.projects-loading,.projects-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;color:#6b7280;text-align:center}.dark .projects-loading,.dark .projects-empty{color:#9ca3af}.projects-loading-spinner{width:48px;height:48px;border:4px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}.dark .projects-loading-spinner{border-color:#374151;border-top-color:#60a5fa}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.5rem}.project-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:.75rem;overflow:hidden;transition:all .2s ease}.dark .project-card{background:#374151;border-color:#4b5563}.project-card:hover{box-shadow:0 10px 15px -3px #0000001a;transform:translateY(-2px)}.project-thumbnail{width:100%;height:150px;object-fit:cover;background:#e5e7eb}.dark .project-thumbnail{background:#1f2937}.project-thumbnail-placeholder{width:100%;height:150px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:2rem}.project-info{padding:1rem}.project-title{margin:0 0 .5rem;font-size:1rem;font-weight:600;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dark .project-title{color:#f9fafb}.project-date{font-size:.75rem;color:#6b7280;margin-bottom:1rem}.dark .project-date{color:#9ca3af}.project-actions{display:flex;gap:.5rem}.project-load-btn,.project-delete-btn{flex:1;padding:.5rem;border-radius:.375rem;font-size:.875rem;cursor:pointer;transition:all .15s ease}.project-load-btn{background:#3b82f6;color:#fff;border:none}.project-load-btn:hover{background:#2563eb}.project-delete-btn{background:transparent;color:#ef4444;border:1px solid #ef4444}.project-delete-btn:hover{background:#ef4444;color:#fff}.my-projects-btn{padding:.5rem 1rem;background:#8b5cf6;border:none;border-radius:.375rem;color:#fff;font-size:.875rem;cursor:pointer;transition:all .15s ease-in-out;display:flex;align-items:center;gap:.5rem}.my-projects-btn:hover{background:#7c3aed}.save-project-btn{padding:.75rem 1.5rem;background:#10b981;border:none;border-radius:.5rem;color:#fff;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s ease-in-out;display:flex;align-items:center;gap:.5rem}.save-project-btn:hover{background:#059669}.save-project-btn:disabled{background:#9ca3af;cursor:not-allowed}