@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('outfit-regular.woff2') format('woff2');
}
.cpx_login__page {
    --cpx-login-ink: #212529;
    --cpx-login-border: #ced4da;
    --cpx-login-radius: 16px;
    --cpx-login-space: 16px;
    --cpx-login-shadow: 0 2px 100px rgba(0, 21, 51, .3);
    min-height: 100dvh;
    color: var(--cpx-login-ink);
    background: var(--cpx-ink) url('login-background.png') center / cover fixed;
    font-family: 'Outfit', sans-serif;
    font-size: 1.1rem;
    line-height: 1.5;
    overscroll-behavior: none;
}
.cpx_login__layout { display: flow-root; max-width: 1424px; margin-inline: auto; }
.cpx_login__panel { width: 50%; min-height: calc(100dvh - 60px); margin: 30px 0 30px 45px; padding: 96px 12px 48px; border-radius: 32px; background: var(--cpx-surface); box-shadow: var(--cpx-login-shadow); }
.cpx_login__content { width: 500px; max-width: 100%; margin-inline: auto; padding-inline: 48px; }
.cpx_login__brandmark { display: block; width: 60px; height: 60px; margin-bottom: 48px; }
.cpx_login__content h1 { margin-bottom: 8px; color: var(--cpx-login-ink); font-size: 2.5rem; font-weight: 400; letter-spacing: normal; line-height: 1.2; }
.cpx_login__form { display: flex; align-items: start; flex-direction: column; }
.cpx_login__form label { margin-bottom: 8px; }
.cpx_login__form input { width: 100%; min-height: 48px; margin-bottom: var(--cpx-login-space); padding: 8px 16px; color: var(--cpx-login-ink); border: 1px solid var(--cpx-login-border); border-radius: var(--cpx-login-radius); background: var(--cpx-surface); font-family: inherit; font-size: 1.25rem; font-weight: 400; line-height: 1.5; }
.cpx_login__form .cpx_login__token { width: 7em; max-width: 100%; min-height: 71px; margin-bottom: 24px; font-size: 2em; letter-spacing: 1rem; text-align: center; }
.cpx_login__submit { position: absolute; overflow: hidden; width: 1px; height: 1px; min-height: 0; margin: -1px; padding: 0; clip-path: inset(50%); white-space: nowrap; }
.cpx_login__submit:focus-visible { position: static; width: auto; height: auto; min-height: var(--cpx-touch-target); margin: 0; padding: 8px 16px; clip-path: none; }
.cpx_login__form input:autofill { background: var(--cpx-surface); }
@media (max-width: 767px) {
    .cpx_login__panel { width: 100%; min-height: 100dvh; margin: 0; padding: 96px 24px 40px; border-radius: 0; box-shadow: none; }
    .cpx_login__content { padding: 0; }
    .cpx_login__content h1 { font-size: calc(1.375rem + 1.5vw); }
}
