.login-page{margin:0;padding:0;min-height:100vh;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background-color:#f5f5f5}.login-page #js-header-container{width:100%;flex-shrink:0}.login-page .login-container{margin-top:0;padding:0 20px 40px}.login-container{width:100%;max-width:1200px;flex:1;display:flex;align-items:flex-start;justify-content:center;padding-top:15vh}.login-card{background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1);padding:40px;animation:fadeIn .4s ease-out;width:100%}.login-page.login-form-page{align-items:center;justify-content:flex-start}.login-page.login-form-page .login-container{max-width:420px;margin-top:0;padding-top:22vh}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.login-title{text-align:center;color:#333;font-size:22px;font-weight:700;margin-bottom:40px;letter-spacing:.5px}.error-message{background-color:#fff0f0;border:1px solid #fcc;color:#c33;padding:12px;border-radius:4px;font-size:14px;margin-bottom:20px;display:none}.error-message.show{display:block;animation:shake .5s ease}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}.form-group{margin-bottom:20px}.login-page .form-label,.login-page .login-form label,.login-page label[for=email],.login-page label[for=password]{display:block;color:#333;font-size:14px;font-weight:600;margin-bottom:10px}.login-page #email,.login-page #password,.login-page .form-input,.login-page .js-email-input,.login-page .js-password-input,.login-page .login-form input[type=email],.login-page .login-form input[type=password],.login-page input[type=email],.login-page input[type=password]{width:100%;padding:14px 18px;border:1px solid #ddd;border-radius:4px;font-size:16px;line-height:1.5;transition:all .3s ease;box-sizing:border-box}.login-page .form-input:focus,.login-page input[type=email]:focus,.login-page input[type=password]:focus{outline:none;border-color:#06c;box-shadow:0 0 0 3px rgba(0,102,204,.1)}.login-page #email::-moz-placeholder,.login-page #password::-moz-placeholder,.login-page .form-input::-moz-placeholder,.login-page .js-email-input::-moz-placeholder,.login-page .js-password-input::-moz-placeholder,.login-page .login-form input[type=email]::-moz-placeholder,.login-page .login-form input[type=password]::-moz-placeholder,.login-page input[type=email]::-moz-placeholder,.login-page input[type=password]::-moz-placeholder{color:#aaa;font-size:16px;opacity:.7}.login-page #email::placeholder,.login-page #password::placeholder,.login-page .form-input::placeholder,.login-page .js-email-input::placeholder,.login-page .js-password-input::placeholder,.login-page .login-form input[type=email]::placeholder,.login-page .login-form input[type=password]::placeholder,.login-page input[type=email]::placeholder,.login-page input[type=password]::placeholder{color:#aaa;font-size:16px;opacity:.7}.login-page #email+.login-button,.login-page .js-login-button,.login-page .login-button,.login-page button.login-button,.login-page button[type=submit].login-button{width:100%;padding:16px;background-color:#06c;color:#fff;border:none;border-radius:4px;font-size:22px;font-weight:600;text-align:center;cursor:pointer;transition:all .3s ease;margin-top:10px;line-height:1.5}.login-page .btn-back{text-align:center;font-size:20px}.login-button:hover{background-color:#0052a3}.login-button:active{transform:translateY(1px)}.login-button:disabled{background-color:#ccc;cursor:not-allowed}@media (max-width:480px){.login-card{padding:30px 20px}.login-title{font-size:20px}.login-page .form-label,.login-page .login-form label,.login-page label[for=email],.login-page label[for=password]{font-size:18px}.login-page #email,.login-page #password,.login-page .form-input,.login-page .js-email-input,.login-page .js-password-input,.login-page .login-form input[type=email],.login-page .login-form input[type=password],.login-page input[type=email],.login-page input[type=password]{font-size:15px;padding:12px 16px}.login-page #email::-moz-placeholder,.login-page #password::-moz-placeholder,.login-page .form-input::-moz-placeholder,.login-page .js-email-input::-moz-placeholder,.login-page .js-password-input::-moz-placeholder,.login-page .login-form input[type=email]::-moz-placeholder,.login-page .login-form input[type=password]::-moz-placeholder,.login-page input[type=email]::-moz-placeholder,.login-page input[type=password]::-moz-placeholder{font-size:15px}.login-page #email::placeholder,.login-page #password::placeholder,.login-page .form-input::placeholder,.login-page .js-email-input::placeholder,.login-page .js-password-input::placeholder,.login-page .login-form input[type=email]::placeholder,.login-page .login-form input[type=password]::placeholder,.login-page input[type=email]::placeholder,.login-page input[type=password]::placeholder{font-size:15px}.login-page .js-login-button,.login-page .login-button,.login-page button.login-button{font-size:20px;padding:14px}.login-page .btn-back{font-size:18px}.login-page .login-container{padding:30px 15px}.login-page.login-form-page .login-container{padding-top:40px}}