@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css";*{box-sizing:border-box;margin:0;padding:0;font-family:Roboto,sans-serif}.hidden{display:none!important}.button--disabled,.login__submit:disabled{background:#b3b3b3!important;color:#4a4a4a!important;box-shadow:none!important;cursor:not-allowed;opacity:.9}.login__submit.button--disabled:before,.login__submit:disabled:before{display:none!important}.login__submit.button--disabled:hover,.login__submit:disabled:hover{transform:none!important;box-shadow:none!important}body{height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#0d1b2a,#1b263b)}.container{display:flex;align-items:center;justify-content:center;min-height:100vh;position:relative;width:100%}.screen{background:#ffffff0d;position:relative;height:650px;width:950px;display:flex;align-items:center;border-radius:30px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 0 50px #0ff3;border:1px solid rgba(255,255,255,.1)}.character{position:absolute;left:5%;z-index:1}.character__image{width:450px;height:auto;filter:drop-shadow(0 0 20px rgba(0,255,255,.5));margin-top:50px}.screen__content{z-index:1;position:absolute;right:5%;display:flex;flex-direction:column;align-items:center;opacity:0;transition:opacity 1s ease-in-out;width:45%;padding:20px}.screen__content.visible{opacity:1}.login{width:100%;max-width:350px;padding:20px;background:#ffffff1a;border-radius:25px;box-shadow:0 0 30px #00ffff4d;border:1px solid rgba(0,255,255,.2);margin-top:10px}.login__logo{display:none;margin-bottom:30px}.logo__image{width:200px;filter:drop-shadow(0 0 10px #00ffff)}.error-message{color:#fff;text-align:center;margin-top:10px;font-size:14px;width:100%}.login__field{padding:15px 0;position:relative}.login__label{display:block;color:#0ff;font-size:14px;margin-bottom:8px;margin-left:15px;text-shadow:0 0 5px rgba(0,255,255,.5)}.input__wrapper{position:relative;width:100%}.login__icon{position:absolute;top:50%;transform:translateY(-50%);left:15px;color:#096161;font-size:20px;text-shadow:0 0 5px #ffffff}.login__input{border:none;background:#ffffff0d;border-radius:50px;padding:15px 25px 15px 50px;width:100%;transition:all .4s ease;box-shadow:inset 0 0 10px #00ffff1a;font-size:16px;color:#fff;border:1px solid rgba(0,255,255,.3)}.login__input--locked{background:#ffffff08;cursor:not-allowed;opacity:.75}.email-actions{margin-top:6px;margin-left:15px;font-size:13px}.email-actions span{color:#0ff;cursor:pointer;text-decoration:underline}.email-actions span:hover{opacity:.8}.login__input::-moz-placeholder{color:#ffffff80}.login__input::placeholder{color:#ffffff80}.login__input:active,.login__input:focus,.login__input:hover{outline:none;background:#ffffff1a;box-shadow:0 0 20px #00ffff80;border-color:#0ff}.password__toggle{position:absolute;top:50%;right:40px;transform:translateY(-50%);color:#096161;font-size:18px;cursor:pointer;text-shadow:0 0 5px #ffffff}.info__icon{position:absolute;top:50%;right:15px;transform:translateY(-50%);color:#0ff;font-size:18px;cursor:pointer;text-shadow:0 0 5px #ffffff}.password-tooltip{position:absolute;top:60%;left:calc(100% + 10px);transform:translateY(-50%);background:#ffffff1a;color:#fff;padding:10px 15px;border-radius:10px;font-size:14px;line-height:1.5;width:325px;box-shadow:0 0 20px #00ffff4d;border:1px solid rgba(0,255,255,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:10}.password-tooltip:before{content:"";position:absolute;top:50%;right:100%;transform:translateY(-50%);border:8px solid transparent;border-right-color:#0ff3}.login__submit{background:linear-gradient(45deg,#0ff,#007bff);font-size:16px;margin-top:20px;padding:15px 60px;border-radius:50px;border:none;text-transform:uppercase;font-weight:700;display:flex;align-items:center;justify-content:center;width:100%;color:#000;cursor:pointer;transition:all .4s ease;box-shadow:0 0 20px #00ffff80;position:relative;overflow:hidden}.login__submit:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#fff3;transition:all .4s ease}.login__submit:hover:before{left:100%}.login__submit:active,.login__submit:focus,.login__submit:hover{transform:scale(1.05);box-shadow:0 0 30px #0ffc}.button__icon{font-size:24px;margin-left:15px;color:#000;text-shadow:0 0 10px #040404}#backgroundMedia{position:fixed;top:0;left:0;width:100vw;height:100vh;-o-object-fit:cover;object-fit:cover;z-index:-1;opacity:.3;filter:blur(5px)}.message-box{position:relative;padding:15px 20px;border-radius:10px;color:#fff;font-size:16px;text-align:center;width:100%;max-width:350px;margin-bottom:20px;box-shadow:0 0 20px #0000004d;transition:opacity .5s ease;z-index:2}.message-success{background:#0f03;border:1px solid rgba(0,255,0,.5);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.message-warning{background:#ffd70033;border:1px solid rgba(255,215,0,.5);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.message-error{background:#f003;border:1px solid rgba(255,0,0,.5);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);margin-top:10px;font-size:14px;text-align:left;padding-left:25px}.message-error div{margin-bottom:5px}@media (max-width: 768px){.screen{width:90%;height:98vh;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;padding:10px;margin:5px}.character{display:none}.screen__content{position:static;width:100%;height:100%;display:flex;justify-content:center;align-items:center;padding:10px}.login{width:100%;max-width:400px;max-height:98%;padding:20px;display:flex;flex-direction:column;justify-content:center;border-radius:15px;margin-top:5px}.login__logo{display:flex;justify-content:center;margin-bottom:20px;margin-top:10px}.logo__image{width:120px}.login__field{padding:10px 0}.login__input{font-size:14px;padding:12px 20px 12px 40px;border-radius:10px}.login__icon{font-size:18px;left:12px}.password__toggle{font-size:16px;right:35px}.info__icon{font-size:16px;right:12px}.password-tooltip{top:100%;left:50%;transform:translate(-50%) translateY(10px);width:90%;max-width:300px}.password-tooltip:before{top:-8px;left:50%;transform:translate(-50%);border:8px solid transparent;border-bottom-color:#0ff3;border-right-color:transparent}.login__submit{font-size:14px;padding:12px 40px;margin-top:15px;border-radius:10px}.button__icon{font-size:20px;margin-left:10px}.message-box{max-width:100%;font-size:14px;padding:10px 15px;margin-bottom:15px}.message-error{font-size:12px;margin-top:8px;padding-left:20px}.message-error div{margin-bottom:4px}}@media (max-width: 480px){.screen{width:100%;height:98vh;margin:5px}.login{max-width:100%;max-height:100%;padding:15px}.logo__image{width:180px}.login__input{font-size:16px;padding:14px 20px 14px 45px;border-radius:12px}.login__icon{font-size:20px;left:12px}.password__toggle{font-size:18px;right:40px}.info__icon{font-size:18px;right:12px}.password-tooltip{font-size:12px;padding:8px 12px}.login__submit{font-size:16px;padding:14px 50px;border-radius:12px}.button__icon{font-size:22px;margin-left:10px}.error-message{font-size:13px}.message-box{font-size:13px;padding:8px 12px;margin-bottom:10px}.message-error{font-size:11px;margin-top:6px;padding-left:15px}.message-error div{margin-bottom:3px}}