.auth-page{background:#fff;color:#172840}
.auth-page #toast{left:50%}
.login-layout{display:grid;grid-template-columns:1fr 1fr;min-height:100svh}
.login-brand-panel{background:#eaf0f7;position:relative;overflow:hidden;display:flex;flex-direction:column;isolation:isolate;min-height:790px;padding:40px 52px 30px}
.login-brand-top{display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:2}
.login-logo{width:138px;height:58px;object-fit:contain;border-radius:4px}
.login-edition{font-size:11px;letter-spacing:2px;color:#8291a7;white-space:nowrap}
.login-brand-copy{position:relative;margin-top:57px;z-index:2;pointer-events:none}
.login-overline{display:block;font-size:10px;letter-spacing:2.7px;color:#7a8ba4;font-weight:500}
.login-brand-copy h1{font-size:66px;font-weight:600;letter-spacing:-3.2px;line-height:1.1;margin:17px 0 18px;color:#122741}
.login-brand-copy h1>span{font-size:15px;vertical-align:top;letter-spacing:0;margin:9px 0 0 5px;display:inline-block;color:#687f9c}
.login-brand-copy>p{font-size:26px;line-height:1.65;font-weight:500;letter-spacing:1px;margin:0;color:#354e6c}
.login-brand-caption{font-size:13px;color:#7b8fa9;line-height:1.8;margin-top:15px}
.login-portrait{position:relative;align-self:flex-end;margin-top:-56px;margin-right:-45px;width:min(480px,95%);aspect-ratio:1;z-index:1}
.login-portrait>img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;mask-image:linear-gradient(to bottom,transparent 0%,#000 8%,#000 90%,transparent 100%)}
.login-portrait-label{position:absolute;right:25px;bottom:58px;display:flex;align-items:center;gap:9px;padding:12px 16px;border:1px solid #ffffffc9;background:#ffffffba;backdrop-filter:blur(12px);border-radius:7px;box-shadow:0 7px 25px #46608909}
.portrait-marker{display:block;height:7px;width:7px;border:1px solid #6386c5;border-radius:50%;box-shadow:0 0 0 4px #4777bf0d}
.login-portrait-label strong{display:block;font-size:12px;font-weight:500;color:#45638b;letter-spacing:.2px}
.login-portrait-label div>span{display:block;font-size:10px;color:#889ab2;letter-spacing:2px;margin-top:4px}
.login-brand-bottom{display:flex;gap:25px;margin-top:auto;padding-top:15px;color:#7c8fa9;position:relative;z-index:2}
.login-brand-bottom>span{display:flex;align-items:center;gap:7px;font-size:12px;white-space:nowrap}
.login-brand-bottom .icon{width:16px;height:16px;color:#7f98b9}
.login-form-panel{display:flex;flex-direction:column;padding:42px 52px 29px;min-width:0;background:#fff}
.login-panel-top{display:flex;justify-content:space-between;align-items:center;color:#1e3452;font-size:16px;font-weight:600;gap:12px}
.login-panel-top b{font-size:12px;font-weight:400;color:#8392a6;margin-left:5px}
.login-env{font-size:12px;font-weight:400;color:#8290a4;display:flex;align-items:center;gap:7px}
.login-env>span{display:block;background:#7d97bc;width:5px;height:5px;border-radius:50%}
.login-form-content{width:100%;max-width:384px;margin:auto; padding:45px 0 55px}
.login-heading-icon{height:42px;width:42px;display:grid;place-items:center;border:1px solid #e4eafb;background:#f4f7ff;color:var(--brand-primary);border-radius:10px;margin-bottom:23px}
.login-heading-icon .icon{width:24px;height:24px;stroke-width:1.5}
.login-welcome>span{font-size:10px;letter-spacing:1.9px;color:#93a0b3;font-weight:500}
.login-welcome h2{margin:10px 0 11px;font-size:27px;line-height:1.5;font-weight:600;letter-spacing:-.3px;color:#1c2e48}
.login-welcome>p{font-size:14px;line-height:1.8;color:#8a97a9;margin:0}
.login-role-tabs{display:flex;border-bottom:1px solid #e5eaf2;margin:28px 0 24px;gap:30px}
.login-role-tabs button{display:flex;align-items:center;justify-content:center;gap:8px;padding:0 0 13px;color:#8b98ac;position:relative;font-size:14px;font-weight:400;transition:color .2s}
.login-role-tabs button .icon{width:16px;height:16px}
.login-role-tabs button.selected{color:var(--brand-primary);font-weight:500}
.login-role-tabs button.selected:after{content:'';position:absolute;bottom:-1px;height:2px;background:var(--brand-primary);border-radius:1px;left:0;right:0}
.login-field{margin-bottom:20px}
.login-field>label{display:block;font-size:14px;font-weight:500;color:#445774;margin-bottom:10px}
.login-input-wrap{position:relative}
.login-input-wrap>svg{position:absolute;top:16px;left:15px;width:17px;height:17px;color:#92a1b8;pointer-events:none}
.login-input-wrap input{height:50px;background:#fcfdff;border:1px solid #dfe5ef;border-radius:7px;padding:0 43px;font-size:14px;line-height:1.5;color:#334968;transition:border .2s,box-shadow .2s;width:100%;min-width:0}
.login-input-wrap input::placeholder{color:#b0bac9}
.login-input-wrap input:focus{outline:none;border-color:var(--brand-selection-border);box-shadow:0 0 0 3px #173f690c;background:#fff}
.login-input-wrap input[aria-invalid=true]{border-color:#d78e93;box-shadow:0 0 0 3px #dc55640b}
.login-password-toggle{position:absolute;top:6px;right:6px;width:37px;height:37px;display:grid;place-items:center;border-radius:5px;color:#a0adc1}
.login-password-toggle:hover{background:#edf2fa;color:#3b67b7}
.login-password-toggle .icon{width:17px;height:17px}
.login-caps{color:#b48543;font-size:12px;margin:7px 0 0}
.login-options{display:flex;align-items:center;justify-content:space-between;margin-top:-1px;gap:12px}
.login-options>label{display:flex;align-items:center;gap:8px;color:#8492a7;font-size:12px;cursor:pointer}
.login-options input{width:14px;min-height:14px;height:14px;padding:0;margin:0;accent-color:var(--brand-primary);cursor:pointer}
.login-options>button{display:flex;align-items:center;gap:4px;color:#768aa9;font-size:12px;padding:2px 0}
.login-options .icon{width:12px;height:12px}
.login-error{font-size:12px;line-height:1.7;color:#bd5763;min-height:25px;padding-top:9px}
.login-submit{width:100%;height:50px;background:var(--brand-primary);color:#fff;display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid var(--brand-primary);border-radius:7px;font-size:14px;letter-spacing:.5px;box-shadow:0 5px 12px #173f6919;transition:background .18s,transform .18s;margin-top:5px}
.login-submit:hover{background:var(--brand-primary-hover);transform:translateY(-1px)}
.login-submit:disabled{opacity:.75;cursor:wait;transform:none}
.login-submit .icon{width:16px;height:16px}
.login-spinner{width:16px;height:16px;display:inline-block;border:2px solid #ffffff60;border-top-color:#fff;border-radius:50%;animation:login-spin .7s linear infinite}
@keyframes login-spin{to{transform:rotate(360deg)}}
.login-demo-card{display:flex;gap:11px;align-items:center;padding:14px 13px;background:#f8faff;border:1px solid #e9eef8;border-radius:7px;margin-top:28px}
.login-demo-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:7px;background:#eaf0fd;color:#6a87c5}
.login-demo-icon .icon{width:14px;height:14px}
.login-demo-card strong{font-size:12px;color:#657b9d;font-weight:500}
.login-demo-card p{font-size:11px;color:#9aa8ba;margin:4px 0 0;line-height:1.7}
.login-demo-card button{padding:5px 0;margin-left:auto;font-size:12px;color:#4e75c7;display:flex;gap:3px;align-items:center;white-space:nowrap}
.login-demo-card button .icon{width:12px;height:12px}
.login-scope{display:flex;align-items:flex-start;justify-content:center;gap:5px;font-size:11px;color:#a9b3c2;line-height:1.8;margin:17px 0 0}
.login-scope .icon{width:12px;height:12px;margin-top:3px;flex:none}
.login-footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#a2adbd;gap:10px}
.login-footer b{font-size:10px;color:#b7c0ce;font-weight:400;margin-left:5px}
@media(min-width:1500px){.login-brand-panel{padding-left:75px;padding-right:60px}.login-brand-copy{margin-top:80px}.login-brand-copy h1{font-size:78px}.login-brand-copy>p{font-size:30px}.login-portrait{width:min(580px,98%);margin-top:-86px}.login-form-panel{padding-left:65px;padding-right:65px}.login-form-content{max-width:400px}}
@media(max-width:1100px){.login-brand-panel{padding:32px 32px 26px}.login-edition{font-size:9px;letter-spacing:1px}.login-logo{width:118px;height:50px}.login-brand-copy{margin-top:72px}.login-brand-copy h1{font-size:58px}.login-brand-copy>p{font-size:23px}.login-portrait{margin-top:-16px;margin-right:-50px;width:113%}.login-brand-bottom{gap:13px}.login-brand-bottom>span{font-size:10px;gap:5px}.login-form-panel{padding:36px 32px 26px}.login-form-content{padding-top:40px;padding-bottom:40px}.login-demo-card{gap:8px;padding:12px 10px}.login-demo-card p{font-size:10px}.login-welcome h2{font-size:25px}}
@media(max-width:760px){.login-layout{grid-template-columns:1fr}.login-brand-panel{display:none}.login-form-panel{min-height:100svh;padding:28px max(24px,7vw) 24px}.login-panel-top{font-size:18px}.login-panel-top:before{content:'';display:block;width:86px;height:36px;background:#07162b url('assets/facex-logo-dark.png') center/contain no-repeat;border-radius:3px}.login-panel-top>span:first-of-type{margin-right:auto;font-size:16px}.login-panel-top>span:first-of-type>b{display:none}.login-panel-top{gap:12px}.login-env{font-size:11px}.login-form-content{padding:48px 0 42px;max-width:390px}.login-welcome h2{font-size:27px}.login-welcome>p{font-size:13px}.login-heading-icon{margin-bottom:24px}.login-demo-card p{font-size:11px}.login-demo-card{gap:10px}.login-input-wrap input{font-size:16px}.login-footer{font-size:11px}}
@media(max-width:380px){.login-form-panel{padding-left:22px;padding-right:22px}.login-panel-top:before{width:75px;height:32px}.login-panel-top{gap:8px}.login-demo-icon{display:none}.login-welcome h2{font-size:25px}.login-role-tabs{gap:26px}.login-scope{font-size:10px}}
@media(prefers-reduced-motion:reduce){.login-spinner{animation:none}.login-submit{transition:none}}