:root{--primary-color:#f60;--secondary-color:#e55a00;--error-color:#dc3545;--text-color:#333;--text-muted:#666;--text-light:#999;--bg-light:#f8f9fa;--bg-darker:#e9ecef}body{margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.page-login{overflow:hidden}.page-centered{background:linear-gradient(135deg, var(--bg-light) 0%, var(--bg-darker) 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.main-container{width:100vw;height:100vh;display:flex}.login-section{background:#fff;flex:1;justify-content:flex-start;align-items:flex-start;padding:120px 0 40px 190px;display:flex;position:relative}.illustration-section{background:#c5a572;flex:1;position:relative;overflow:hidden}.illustration-img{object-fit:cover;width:100%;height:100%}.bank-logo{z-index:10;width:120px;position:absolute;top:30px;left:30px}.bank-logo-centered{width:160px;margin-bottom:30px}.bank-logo-error{width:200px;margin-bottom:30px}.login-form{width:100%;max-width:350px}.login-title{color:var(--text-color);text-align:left;margin-bottom:40px;font-size:28px;font-weight:300}.input-group{margin-bottom:30px;position:relative}.input-field{width:100%;color:var(--text-color);background:0 0;border:none;border-bottom:2px solid #ddd;outline:none;padding:15px 0;font-size:16px;transition:border-color .3s}.input-field:focus{border-bottom-color:var(--primary-color)}.input-label{color:var(--text-light);pointer-events:none;font-size:16px;transition:all .3s;position:absolute;top:15px;left:0}.input-field:focus+.input-label,.input-field:valid+.input-label,.input-field.has-value+.input-label{color:var(--primary-color);font-size:14px;top:-20px}.required-dot{color:var(--error-color);margin-left:5px;font-weight:700}.remember-me{color:var(--text-muted);align-items:center;margin:25px 0;font-size:14px;display:flex}.remember-me input[type=checkbox]{margin-right:10px;transform:scale(1.2)}.virtual-keyboard{color:var(--text-muted);align-items:center;margin:15px 0;padding:5px 0;font-size:14px;text-decoration:none;display:inline-flex}.virtual-keyboard:before{content:"⌨️";margin-right:8px;font-size:16px}.btn-primary{background-color:var(--primary-color);color:#fff;text-transform:uppercase;cursor:pointer;border:none;border-radius:5px;width:100%;margin:20px 0;padding:15px;font-size:16px;font-weight:600;transition:background-color .3s}.btn-primary:hover{background-color:var(--secondary-color)}.btn-primary:disabled{cursor:not-allowed;background-color:#ccc}.forgot-password{text-align:center;margin-top:20px}.forgot-password a{color:var(--primary-color);font-size:14px;text-decoration:none}.forgot-password a:hover{text-decoration:underline}.create-keys{text-align:center;color:var(--text-muted);margin-top:30px;font-size:13px}.link-primary{color:var(--primary-color);font-weight:600;text-decoration:none}.link-primary:hover{text-decoration:underline}.card-container{text-align:center;background:#fff;border-radius:20px;width:100%;max-width:420px;padding:40px;box-shadow:0 15px 35px #0000001a}.card-title{color:var(--text-color);margin-bottom:15px;font-size:24px;font-weight:600;line-height:1.3}.card-subtitle{color:var(--text-muted);margin-bottom:30px;font-size:16px;line-height:1.4}.text-highlight{color:var(--primary-color);font-weight:600}.token-input{text-align:center;letter-spacing:6px;width:100%;height:60px;color:var(--primary-color);background:#fafafa;border:2px solid #ddd;border-radius:12px;outline:none;margin-bottom:25px;padding:15px;font-size:24px;font-weight:700;transition:all .3s}.token-input:focus{border-color:var(--primary-color);background:#fff;box-shadow:0 0 0 3px #ff66001a}.error-container{text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.error-title{color:var(--error-color);max-width:400px;margin:0 auto 20px;font-size:24px;font-weight:700}.error-subtitle{max-width:400px;color:var(--text-muted);margin:0 auto 20px;font-size:16px}.error-input-group{width:100%;max-width:350px;margin:30px auto}.progress-bar{background-color:var(--bg-darker);border-radius:10px;width:100%;height:8px;margin-bottom:20px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--primary-color), var(--secondary-color));border-radius:10px;width:0%;height:100%;animation:7s ease-in-out forwards progress;position:relative}.progress-fill:after{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);animation:1.5s infinite shine;position:absolute;inset:0}.status-text{color:var(--primary-color);font-size:14px;font-weight:500}.status-icons{opacity:.7;justify-content:center;gap:20px;margin-top:30px;font-size:24px;display:flex}@keyframes progress{0%{width:0%}20%{width:15%}40%{width:35%}60%{width:55%}80%{width:80%}to{width:100%}}@keyframes shine{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media (width<=768px){.main-container{flex-direction:column}.illustration-section{display:none}.login-section{justify-content:center;align-items:center;padding:80px 20px 20px}.login-title{text-align:center;font-size:24px}.bank-logo{width:100px;top:20px;left:20px}}@media (width<=480px){.card-container{padding:30px 25px}.bank-logo-centered{width:140px}.card-title{font-size:21px}.card-subtitle{font-size:15px}.token-input{letter-spacing:4px;height:55px;font-size:20px}}