:root{--login-panel-left-bg:#000;--login-panel-left-text:#fff;--login-panel-left-muted:#a3a3a3;--login-panel-left-accent:#fff;--login-panel-left-overlay:#0f172a4d;--login-panel-right-bg:#fff;--login-panel-right-text:#1c1917;--login-panel-right-secondary:#57534e;--login-panel-right-muted:#a8a29e;--login-panel-right-border:#e5e5e5;--login-panel-right-input-bg:#f5f5f4;--login-panel-right-input-border:#d6d3d1;--login-panel-right-input-border-focus:#0d9488;--login-panel-right-input-shadow:#0d948826;--login-step-bg:#e5e5e5;--login-step-active:#0d9488;--login-err-bg:#fef2f2;--login-err-border:#fecaca;--login-err-text:#dc2626}@media (prefers-color-scheme:dark){:root{--login-panel-left-bg:#000;--login-panel-left-text:#fff;--login-panel-left-muted:#a3a3a3;--login-panel-left-accent:#fff;--login-panel-left-overlay:#00000080;--login-panel-right-bg:#171717;--login-panel-right-text:#f5f5f4;--login-panel-right-secondary:#a8a29e;--login-panel-right-muted:#57534e;--login-panel-right-border:#292524;--login-panel-right-input-bg:#292524;--login-panel-right-input-border:#44403c;--login-panel-right-input-border-focus:#2dd4bf;--login-panel-right-input-shadow:#2dd4bf33;--login-step-bg:#44403c;--login-step-active:#2dd4bf;--login-err-bg:#450a0a;--login-err-border:#7f1d1d;--login-err-text:#fca5a5}}.login-root{min-height:100dvh;display:flex}.login-left{background:var(--login-panel-left-bg);width:50%;color:var(--login-panel-left-text);display:none;position:relative;overflow:hidden}.login-left-inner{z-index:2;flex-direction:column;justify-content:center;height:100%;padding:3rem 3.5rem;display:flex;position:relative}.login-left-bg{z-index:1;background:radial-gradient(at 20%,#2dd4bf14 0%,#0000 50%),radial-gradient(at 80% 20%,#2dd4bf0a 0%,#0000 40%),radial-gradient(at 50% 80%,#2dd4bf0f 0%,#0000 40%);position:absolute;inset:0}.login-left-decor{z-index:1;background:linear-gradient(90deg, var(--login-panel-left-accent) 0%, transparent 100%);opacity:.2;height:1px;position:absolute;bottom:3rem;left:3.5rem;right:3.5rem}.login-left-pattern{z-index:1;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(at 50% 40%,#000 30%,#0000 70%);mask-image:radial-gradient(at 50% 40%,#000 30%,#0000 70%)}.login-brand{letter-spacing:-.03em;color:var(--login-panel-left-text);margin-bottom:.75rem;font-size:2.75rem;font-weight:700;line-height:1}.login-right{background:var(--login-panel-right-bg);justify-content:center;align-items:center;width:100%;padding:2rem;display:flex}.login-right-inner{width:100%;max-width:26rem}.login-right-header{flex-direction:column;align-items:center;margin-bottom:2rem;display:flex}.login-right-title{color:var(--login-panel-right-text);letter-spacing:-.02em;margin-bottom:.25rem;font-size:1.375rem;font-weight:600}.login-right-sub{color:var(--login-panel-right-muted);font-size:.875rem}.login-step-bar{justify-content:center;align-items:center;gap:.5rem;margin-bottom:2rem;display:flex}.login-step-dot{color:var(--login-panel-right-muted);align-items:center;gap:.5rem;font-size:.75rem;font-weight:500;transition:color .2s;display:flex}.login-step-dot--active{color:var(--login-step-active)}.login-step-dot-indicator{background:var(--login-step-bg);border-radius:50%;width:.5rem;height:.5rem;transition:background .3s,transform .3s}.login-step-dot--active .login-step-dot-indicator{background:var(--login-step-active);transform:scale(1.25)}.login-step-line{background:var(--login-step-bg);border-radius:1px;flex:0 0 2rem;height:2px;transition:background .3s}.login-step-line--active{background:var(--login-step-active)}.login-body{animation:.35s ease-out login-fade}@keyframes login-fade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.login-error{color:var(--login-err-text);background:var(--login-err-bg);border:1px solid var(--login-err-border);border-radius:8px;align-items:center;gap:.5rem;margin-bottom:1.25rem;padding:.625rem .75rem;font-size:.75rem;animation:.35s ease-out login-shake;display:flex}@keyframes login-shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.login-fields{flex-direction:column;gap:1rem;display:flex}.login-field{flex-direction:column;gap:.25rem;display:flex}.login-label{color:var(--login-panel-right-text);font-size:.75rem;font-weight:600}.login-input{background:var(--login-panel-right-input-bg);border:1px solid var(--login-panel-right-input-border);width:100%;color:var(--login-panel-right-text);box-sizing:border-box;border-radius:8px;outline:none;padding:.625rem .75rem;font-size:.875rem;transition:border-color .15s,box-shadow .15s}.login-input:focus{border-color:var(--login-panel-right-input-border-focus);box-shadow:0 0 0 3px var(--login-panel-right-input-shadow)}.login-input::placeholder{color:var(--login-panel-right-muted)}.login-input-wrap{position:relative}.login-input-wrap .login-input{padding-left:2.25rem;padding-right:2.5rem}.login-input-icon{color:var(--login-panel-right-muted);pointer-events:none;width:1rem;height:1rem;position:absolute;top:50%;left:.625rem;transform:translateY(-50%)}.login-eye{width:1.75rem;height:1.75rem;color:var(--login-panel-right-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;transition:all .15s;display:flex;position:absolute;top:50%;right:.375rem;transform:translateY(-50%)}.login-eye:hover{color:var(--login-panel-right-secondary);background:var(--login-panel-right-input-bg)}.login-btn{background:var(--login-panel-left-bg);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:.375rem;min-height:2.5rem;padding:.625rem 1rem;font-size:.875rem;font-weight:500;transition:opacity .15s;display:flex}.login-btn:hover{opacity:.9}.login-btn:disabled{opacity:.4;cursor:default}.login-btn--secondary{color:var(--login-panel-right-secondary);border:1px solid var(--login-panel-right-border);background:0 0}.login-btn--secondary:hover{background:var(--login-panel-right-input-bg);opacity:1}.login-back{color:var(--login-panel-right-muted);cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;padding:.25rem;font-size:.8125rem;transition:color .15s;display:inline-flex}.login-back:hover{color:var(--login-panel-right-secondary)}.login-divider{align-items:center;gap:.75rem;margin:.5rem 0;display:flex}.login-divider:before,.login-divider:after{content:"";background:var(--login-panel-right-border);flex:1;height:1px}.login-divider-text{color:var(--login-panel-right-muted);font-size:.75rem}.login-footer{justify-content:space-between;align-items:center;margin-top:2rem;font-size:.75rem;display:flex}.login-footer-link{color:var(--login-panel-right-muted);text-decoration:none;transition:color .15s}.login-footer-link:hover{color:var(--login-step-active)}.login-role-grid{grid-template-columns:1fr;gap:.75rem;display:grid}@media (min-width:640px){.login-role-grid{grid-template-columns:1fr 1fr 1fr}}.login-role-card{border:1.5px solid var(--login-panel-right-border);background:var(--login-panel-right-bg);cursor:pointer;text-align:center;border-radius:10px;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem 1rem;transition:all .15s;display:flex}.login-role-card:hover{border-color:var(--login-step-active);box-shadow:0 0 0 3px var(--login-panel-right-input-shadow)}.login-role-card:active{transform:scale(.97)}.login-role-card-icon{border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex}.login-role-card-label{color:var(--login-panel-right-text);font-size:.8125rem;font-weight:600}.login-role-card-sub{color:var(--login-panel-right-muted);font-size:.6875rem;line-height:1.4}.login-sa-badge{color:var(--login-panel-right-secondary);background:var(--login-panel-right-input-bg);border:1px solid var(--login-panel-right-border);border-radius:8px;align-items:center;gap:.375rem;padding:.5rem .75rem;font-size:.8125rem;display:flex}.login-spin{border:2px solid #ffffff40;border-top-color:#fff;border-radius:50%;width:1rem;height:1rem;animation:.5s linear infinite login-spin}@keyframes login-spin{to{transform:rotate(360deg)}}@media (min-width:768px){.login-left{display:flex}.login-right{width:50%}}@media (max-width:767px){.login-right-inner{max-width:100%}}