.animated-background{position:relative;height:100vh;background:linear-gradient(90deg,#1e90ff,tomato);overflow:hidden;display:flex;justify-content:center;align-items:center}.gradient-sphere{position:absolute;border-radius:50%;animation:rotate-sphere 20s linear infinite}.sphere-1{width:300px;height:300px;top:30%;left:10%;background:hsla(0,0%,100%,.1)}.sphere-2{width:500px;height:500px;top:10%;right:10%;background:hsla(0,0%,100%,.05)}.sphere-3{width:700px;height:700px;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);background:hsla(0,0%,100%,.1)}@keyframes rotate-sphere{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.login-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:30px;background-color:hsla(0,0%,100%,.2);border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.3);width:100%;max-width:400px}.login-header h1{color:#fff;font-size:2em;text-align:center;font-weight:700;text-shadow:3px 3px 10px rgba(0,0,0,.5),0 0 20px hsla(0,0%,100%,.7);margin:0}.login-header p{color:#bdc3c7;text-align:center;margin:5px}.form-group{margin-bottom:20px}.form-input{width:100%;padding:12px;border:2px solid #7f8c8d;border-radius:8px;background-color:#ecf0f1;color:#2c3e50;font-size:16px;outline:none}.form-input:focus{border-color:#3498db}.sign-in-btn-container{margin-top:20px;padding:10px;background-color:#2ecc71;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,.2)}.login-button{width:100%;padding:12px;background-color:#2ecc71;border:none;border-radius:8px;color:#fff;font-size:16px;cursor:pointer;transition:background-color .3s ease}.login-button:hover{background-color:#27ae60}.spinner{width:20px;height:20px;border:2px solid transparent;border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-message{color:red;margin-bottom:10px;font-size:.9em;text-align:center}