.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f0f9ff,#e0f2fe,#f0f9ff,#ddd6fe,#f0f9ff);background-size:400% 400%;animation:gradientShift 15s ease infinite;padding:20px;position:relative;overflow:hidden}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.login-page:before,.login-page:after{content:"";position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.08) 0%,rgba(59,130,246,.05) 50%,transparent 70%);animation:floatParticle 20s ease-in-out infinite}.login-page:before{width:600px;height:600px;top:-300px;right:-200px;animation-delay:0s}.login-page:after{width:500px;height:500px;bottom:-250px;left:-150px;animation-delay:7s}@keyframes floatParticle{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.9)}}.auth-container{width:100%;max-width:450px;position:relative;z-index:1}.auth-card{background:linear-gradient(135deg,#ffffffe6,#f0f9ffb3);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1.5px solid rgba(255,255,255,.6);border-radius:24px;padding:48px 40px;box-shadow:0 8px 32px #667eea1a,0 16px 64px #8b5cf614,inset 0 2px 4px #fffc,inset 0 -2px 4px #e2e8f04d;position:relative}.auth-header{text-align:center;margin-bottom:32px}.auth-logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:16px}.auth-logo img{width:48px;height:48px;filter:drop-shadow(0 4px 8px rgba(139,92,246,.2))}.auth-title{font-size:32px;font-weight:700;background:linear-gradient(135deg,#8b5cf6,#3b82f6,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 8px}.auth-subtitle{font-size:14px;color:#475569cc;margin:0}.auth-tabs{display:flex;gap:12px;margin-bottom:32px;background:#f1f5f999;border-radius:12px;padding:6px}.tab-btn{flex:1;padding:12px 20px;background:transparent;border:none;border-radius:8px;font-size:15px;font-weight:500;color:#475569b3;cursor:pointer;transition:all .3s ease;position:relative}.tab-btn:hover{color:#475569e6}.tab-btn.active{background:linear-gradient(135deg,#fffffff2,#f0f9ffcc);color:#3b82f6;box-shadow:0 2px 8px #3b82f626,inset 0 1px 2px #ffffffe6}.tab-content{display:none}.tab-content.active{display:block;animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.auth-form{width:100%}.form-group{margin-bottom:24px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;color:#334155e6}.form-group input{width:100%;padding:14px 16px;font-size:15px;color:#1e293b;background:#fffc;border:1.5px solid rgba(203,213,225,.6);border-radius:12px;transition:all .3s ease;box-sizing:border-box}.form-group input::placeholder{color:#94a3b899}.form-group input:focus{outline:none;background:#fffffff2;border-color:#3b82f699;box-shadow:0 0 0 3px #3b82f61a,0 2px 8px #3b82f614,inset 0 1px 2px #ffffffe6}.btn-primary{width:100%;padding:14px 24px;font-size:15px;font-weight:600;color:#fff;background:linear-gradient(135deg,#8b5cf6,#3b82f6,#2563eb);border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #3b82f640,0 2px 4px #8b5cf633,inset 0 1px 2px #ffffff4d;position:relative;overflow:hidden}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #3b82f64d,0 4px 8px #8b5cf640,inset 0 1px 2px #fff6}.btn-primary:hover:before{left:100%}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.auth-status{margin-top:20px;padding:12px 16px;border-radius:10px;font-size:14px;font-weight:500;text-align:center;display:none}.auth-status.success{display:block;background:linear-gradient(135deg,#10b98126,#0596691a);color:#065f46;border:1.5px solid rgba(16,185,129,.3);box-shadow:0 2px 8px #10b98114,inset 0 1px 2px #ffffffb3}.auth-status.error{display:block;background:linear-gradient(135deg,#ef444426,#dc26261a);color:#991b1b;border:1.5px solid rgba(239,68,68,.3);box-shadow:0 2px 8px #ef444414,inset 0 1px 2px #ffffffb3}.auth-status.loading{display:block;background:linear-gradient(135deg,#3b82f626,#2563eb1a);color:#1e40af;border:1.5px solid rgba(59,130,246,.3);box-shadow:0 2px 8px #3b82f614,inset 0 1px 2px #ffffffb3}.auth-status.info{display:block;background:linear-gradient(135deg,#8b5cf626,#7c3aed1a);color:#5b21b6;border:1.5px solid rgba(139,92,246,.3);box-shadow:0 2px 8px #8b5cf614,inset 0 1px 2px #ffffffb3}.auth-footer{margin-top:24px;text-align:center}.auth-footer a{color:#3b82f6;text-decoration:none;font-size:14px;font-weight:500;transition:color .2s ease}.auth-footer a:hover{color:#2563eb;text-decoration:underline}@media (max-width: 768px){.auth-card{padding:36px 24px;border-radius:20px}.auth-title{font-size:28px}.login-page:before,.login-page:after{opacity:.5}}@media (max-width: 480px){.auth-container{max-width:100%}.auth-card{padding:28px 20px}.auth-title{font-size:24px}.tab-btn{padding:10px 16px;font-size:14px}}
