:root{--navy:#102a56;--navy-dark:#091b39;--blue:#2563eb;--blue-hover:#1d4ed8;--surface:#fff;--background:#f5f7fb;--text:#172033;--muted:#667085;--border:#e4e8f0;--success:#087443;--success-bg:#ecfdf3;--danger:#b42318;--danger-bg:#fef3f2;--warning:#b54708;--warning-bg:#fffaeb;--shadow:0 24px 70px #0f172a1a;--radius:22px}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:radial-gradient(circle at 10% 5%, #2563eb14, transparent 28%), var(--background);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Arial,Helvetica,sans-serif}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}.auth-page{grid-template-columns:minmax(320px,.85fr) minmax(500px,1.15fr);min-height:100vh;display:grid}.auth-hero{color:#fff;background:radial-gradient(circle at 90% 15%,#60a5fa59,#0000 25%),linear-gradient(145deg,#081b3a,#123b78);flex-direction:column;justify-content:space-between;padding:56px;display:flex;position:relative;overflow:hidden}.auth-hero:after{content:"";border:60px solid #ffffff0a;border-radius:50%;width:360px;height:360px;position:absolute;bottom:-140px;right:-150px}.brand{z-index:1;letter-spacing:-.8px;font-size:28px;font-weight:800;position:relative}.brand-dot{color:#60a5fa}.hero-content{z-index:1;max-width:480px;position:relative}.hero-eyebrow{letter-spacing:1.5px;text-transform:uppercase;color:#93c5fd;margin-bottom:14px;font-size:13px;font-weight:700}.hero-title{letter-spacing:-2px;margin:0;font-size:clamp(36px,4vw,58px);line-height:1.05}.hero-copy{color:#cbd5e1;max-width:420px;margin:24px 0 0;font-size:16px;line-height:1.7}.hero-points{gap:13px;margin-top:34px;display:grid}.hero-point{color:#e2e8f0;align-items:center;gap:12px;font-size:14px;display:flex}.hero-check{background:#ffffff1f;border-radius:50%;flex:none;place-items:center;width:25px;height:25px;font-size:12px;display:grid}.hero-footer{z-index:1;color:#94a3b8;font-size:12px;position:relative}.auth-main{justify-content:center;align-items:center;padding:40px;display:flex}.auth-card{border-radius:var(--radius);width:min(100%,650px);box-shadow:var(--shadow);background:#fffffff5;border:1px solid #e2e8f0e6;padding:38px}.card-header{margin-bottom:30px}.card-title{letter-spacing:-.7px;margin:0;font-size:29px}.card-subtitle{color:var(--muted);margin:10px 0 0;font-size:14px;line-height:1.55}.progress{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:30px;display:grid}.progress-item{background:#e8edf5;border-radius:99px;height:5px;transition:background .18s}.progress-item.active{background:var(--blue)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.field{flex-direction:column;gap:8px;display:flex}.field.full{grid-column:1/-1}.label-row{justify-content:space-between;align-items:center;gap:12px;display:flex}label{color:#344054;font-size:13px;font-weight:700}.optional{color:#98a2b3;font-size:11px;font-weight:400}.input-wrap{position:relative}.input,.textarea{border:1px solid var(--border);width:100%;color:var(--text);background:#fff;border-radius:11px;outline:none;transition:border-color .15s,box-shadow .15s}.input{height:48px;padding:0 14px}.textarea{resize:vertical;min-height:95px;padding:13px 14px}.input:focus,.textarea:focus{border-color:#93b4ff;box-shadow:0 0 0 4px #2563eb17}.input:disabled,.textarea:disabled{color:#667085;cursor:not-allowed;background:#f8fafc}.password-input{padding-right:76px}.show-password{color:var(--blue);background:0 0;border:0;font-size:12px;font-weight:700;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.helper{color:var(--muted);margin:0;font-size:11px;line-height:1.5}.otp-row{gap:10px;display:flex}.otp-row .input{flex:1}.btn{border:0;border-radius:11px;min-height:48px;padding:0 20px;font-weight:700;transition:transform .1s,background .15s,opacity .15s}.btn:active:not(:disabled){transform:scale(.99)}.btn:disabled{cursor:not-allowed;opacity:.58}.btn-primary{color:#fff;background:var(--blue)}.btn-primary:hover:not(:disabled){background:var(--blue-hover)}.btn-secondary{color:#344054;background:#eef2f7}.btn-full{width:100%}.form-actions{justify-content:space-between;gap:12px;margin-top:28px;display:flex}.form-actions .btn{min-width:130px}.alert{border-radius:10px;margin-bottom:22px;padding:13px 15px;font-size:13px;line-height:1.5}.alert-error{color:var(--danger);background:var(--danger-bg);border:1px solid #fecdca}.alert-success{color:var(--success);background:var(--success-bg);border:1px solid #abefc6}.verified-badge{color:var(--success);align-items:center;gap:6px;font-size:12px;font-weight:700;display:inline-flex}.password-rules{grid-template-columns:repeat(2,1fr);gap:7px;margin-top:4px;display:grid}.rule{color:#98a2b3;font-size:11px}.rule.ok{color:var(--success)}.auth-switch{text-align:center;color:var(--muted);margin:24px 0 0;font-size:13px}.auth-switch a{color:var(--blue);font-weight:700;text-decoration:none}.pending-card{text-align:center}.status-icon{width:72px;height:72px;color:var(--warning);background:var(--warning-bg);border-radius:50%;place-items:center;margin:0 auto 20px;font-size:30px;font-weight:800;display:grid}.status-details{text-align:left;border:1px solid var(--border);background:#f8fafc;border-radius:12px;margin:26px 0;padding:18px}.status-row{justify-content:space-between;gap:20px;padding:9px 0;font-size:13px;display:flex}.status-row+.status-row{border-top:1px solid #e9edf3}.status-key{color:var(--muted)}.status-value{text-align:right;font-weight:700}.login-card{max-width:500px}.login-fields{gap:20px;display:grid}.mobile-brand{display:none}@media (max-width:900px){.auth-page{grid-template-columns:1fr}.auth-hero{display:none}.auth-main{min-height:100vh;padding:28px 20px}.mobile-brand{color:var(--navy);margin-bottom:26px;font-size:25px;font-weight:800;display:block}}@media (max-width:600px){.auth-main{align-items:flex-start;padding:22px 15px 35px}.auth-card{border-radius:18px;padding:24px 18px;box-shadow:0 12px 35px #0f172a12}.card-title{font-size:25px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.password-rules{grid-template-columns:1fr}.otp-row{flex-direction:column}.form-actions{flex-direction:column-reverse}.form-actions .btn{width:100%}}
