:root{--bg-body:#f1f5f9;--card-bg:#fff;--card-border:#e2e8f0;--primary-brand:#2563eb;--primary-hover:#1e40af;--text-main:#1e293b;--text-muted:#64748b;--input-bg:#f8fafc;--input-border:#cbd5e1;--input-focus:#3b82f6;--success:#059669;--error:#dc2626;--radius:12px;--radius-sm:8px;--shadow-card:0 4px 6px -1px #0000000d,0 10px 15px -3px #0000000d}*,:before,:after{box-sizing:border-box}html,body{height:100%;color:var(--text-main);background-color:var(--bg-body);-webkit-font-smoothing:antialiased;background-image:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%);margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;overflow-x:hidden}.login-wrapper{justify-content:center;align-items:center;min-height:100dvh;padding:20px;display:flex}.login-form{background:var(--card-bg);border-radius:var(--radius);width:100%;max-width:400px;box-shadow:0 0 0 1px #00000008,var(--shadow-card);border:none;padding:40px 32px;position:relative}.login-form:before{content:"";background:var(--primary-brand);border-radius:var(--radius)var(--radius)0 0;height:4px;position:absolute;top:0;left:0;right:0}.login-form h2{color:var(--text-main);letter-spacing:-.5px;margin-top:0}.login-form p.lead{text-align:center;color:var(--text-muted);margin-bottom:24px;font-size:14px;line-height:1.5}.form-group{margin-bottom:20px;position:relative}.form-group label{color:var(--text-main);margin-bottom:6px;font-size:12px;font-weight:600;display:block}.login-form input{appearance:none;border-radius:var(--radius-sm);border:1px solid var(--input-border);background:var(--input-bg);width:100%;color:var(--text-main);height:42px;padding:12px 16px;font-size:14px;transition:all .2s}.login-form input:focus{border-color:var(--input-focus);background:#fff;outline:none;box-shadow:0 0 0 3px #2563eb1a}.login-btn{appearance:none;border-radius:var(--radius-sm);background:var(--primary-brand);color:#fff;cursor:pointer;border:none;justify-content:center;align-items:center;width:100%;margin-top:10px;padding:12px;font-size:15px;font-weight:600;transition:all .2s;display:flex;box-shadow:0 1px 2px #0000000d}.login-btn:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a}.login-btn:active{transform:translateY(0)}.login-btn:disabled{cursor:not-allowed;box-shadow:none;background:#cbd5e1;transform:none}.msg-box{border-radius:var(--radius-sm);text-align:center;margin-bottom:20px;padding:12px;font-size:13px;font-weight:500}.msg-success{color:var(--success);border:1px solid #d1fae5;border-left:4px solid var(--success);background:#ecfdf5}.msg-error{color:var(--error);border:1px solid #fee2e2;border-left:4px solid var(--error);background:#fef2f2}.password-wrapper{width:100%;position:relative}.toggle-eye{cursor:pointer;color:#94a3b8;z-index:5;background:0 0;border:none;justify-content:center;align-items:center;width:30px;height:30px;padding:0;font-size:18px;transition:color .2s;display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.toggle-eye:hover{color:var(--primary-brand)}.logo-box{text-align:center;width:100%;margin-bottom:12px}.logo-box img{max-width:150px;height:auto}.input-group{align-items:center;gap:10px;width:100%;display:flex}.input-group input{flex:1}.btn-inline{white-space:nowrap;height:42px;width:auto!important;margin-top:0!important;padding:0 20px!important;font-size:13px!important}.btn-verify{color:#fff!important;background-color:#059669!important;border-color:#059669!important}.btn-verify:hover{background-color:#047857!important}.status-icon{color:#059669;justify-content:center;align-items:center;padding:0 10px;font-size:20px;display:flex}.text-link{cursor:pointer;color:var(--primary-brand);background:0 0;border:none;margin-top:5px;padding:0;font-size:14px;font-weight:600;display:inline-block}.text-link:hover{text-decoration:underline}.fade-in{animation:.5s ease-in-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.login-wrapper{padding:15px}}@media (max-width:480px){.login-form{box-shadow:none;border-radius:var(--radius-sm);background:#fff;padding:30px 20px}.login-wrapper{background:#f1f5f9;align-items:flex-start;padding-top:40px;overflow-y:auto}.input-group{flex-wrap:wrap}.btn-inline{width:100%!important}}