.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-box{background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:40px;max-width:450px;width:100%;box-shadow:0 20px 60px var(--shadow);animation:fadeIn .5s ease-out}.login-title{font-size:2.5rem;font-weight:900;background:linear-gradient(135deg,var(--accent-1),var(--accent-2),var(--accent-3));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-align:center;margin-bottom:10px}.login-subtitle{text-align:center;color:var(--text-secondary);margin-bottom:30px;font-size:.9rem}.login-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:30px}.login-tab{padding:12px;background:transparent;border:2px solid var(--border);border-radius:10px;color:var(--text-secondary);cursor:pointer;font-size:1rem;font-weight:600;transition:all .3s ease;font-family:inherit}.login-tab.active{background:linear-gradient(135deg,var(--accent-1),var(--accent-2));border-color:var(--accent-1);color:#fff}.login-form{gap:20px}.form-group,.login-form{display:flex;flex-direction:column}.form-group{gap:8px}.form-group label{color:var(--accent-3);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.form-group input{padding:12px 16px;background:var(--bg-secondary);border:2px solid var(--border);border-radius:10px;color:var(--text-primary);font-size:1rem;font-family:inherit;transition:all .3s ease}.form-group input:focus{outline:none;border-color:var(--accent-1);box-shadow:0 0 0 3px rgba(255,107,157,.1)}.error-message{background:rgba(255,107,157,.1);border:1px solid var(--accent-1);color:var(--accent-1);padding:12px;border-radius:8px;font-size:.9rem;text-align:center}.submit-button{padding:14px;background:linear-gradient(135deg,var(--accent-1),var(--accent-2));border:none;border-radius:10px;color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;font-family:inherit;text-transform:uppercase;letter-spacing:1px}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 30px rgba(255,107,157,.3)}.submit-button:disabled{opacity:.6;cursor:not-allowed}.login-hint{margin-top:20px;padding:12px;background:rgba(78,205,196,.1);border-left:3px solid var(--accent-3);border-radius:8px;color:var(--text-secondary);font-size:.85rem;line-height:1.5}.user-info{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:20px}.username{color:var(--accent-3);font-weight:600}.logout-button{padding:8px 16px;background:rgba(255,107,157,.2);border:1px solid var(--accent-1);border-radius:8px;color:var(--accent-1);cursor:pointer;font-size:.85rem;font-weight:600;transition:all .3s ease;font-family:inherit}.logout-button:hover{background:var(--accent-1);color:#fff}.loading-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.loading-spinner{width:50px;height:50px;border:4px solid var(--border);border-top-color:var(--accent-3);border-radius:50%;animation:spin 1s linear infinite}.hint-input{margin-top:8px;padding:8px 12px;background:rgba(78,205,196,.05);border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);font-size:.85rem;font-family:inherit;transition:all .3s ease}.hint-input:focus{outline:none;border-color:var(--accent-3);box-shadow:0 0 0 2px rgba(78,205,196,.1)}.hint-input::-moz-placeholder{color:var(--text-secondary);opacity:.5}.hint-input::placeholder{color:var(--text-secondary);opacity:.5}@media (max-width:640px){.login-container{padding:14px;align-items:stretch}.login-box{max-width:none;border-radius:16px;padding:22px 16px;align-self:center;margin:auto 0}.login-title{font-size:2rem}.login-subtitle{margin-bottom:22px;font-size:.86rem;line-height:1.6}.login-tabs{gap:8px;margin-bottom:22px}.form-group input,.login-tab,.submit-button{min-height:46px;font-size:16px}.login-form{gap:16px}.login-hint{line-height:1.6}}@keyframes spin{to{transform:rotate(1turn)}}