:root { --forgot-password-board-width: 1920px; --forgot-password-board-height: 1080px; --forgot-password-scale: 1; --forgot-password-font: Arial, Helvetica, sans-serif; }
* { box-sizing: border-box; }
html, body { width: 100%; min-height: 100%; margin: 0; background: #000; }
body { overflow: hidden; }
.forgot-password-fit-shell { position: relative; display: grid; width: 100%; height: 100vh; min-height: 0; place-items: center; overflow: hidden; }
.forgot-password-fit-box { position: relative; z-index: 1; width: calc(var(--forgot-password-board-width) * var(--forgot-password-scale)); height: calc(var(--forgot-password-board-height) * var(--forgot-password-scale)); }
.forgot-password-artboard { position: absolute; top: 0; left: 0; width: var(--forgot-password-board-width); height: var(--forgot-password-board-height); overflow: hidden; transform: scale(var(--forgot-password-scale)); transform-origin: top left; font-family: var(--forgot-password-font); }
.forgot-password-background, .forgot-password-panel, .forgot-password-field > img, .forgot-password-verification > img, .forgot-password-submit > img { position: absolute; display: block; user-select: none; }
.forgot-password-background { z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; pointer-events: none; }
.forgot-password-brand-logo-link { position: absolute; z-index: 5; top: 25px; left: 40px; display: block; width: 141px; height: 60px; }
.forgot-password-brand-logo-link:focus-visible, .forgot-password-password-toggle:focus-visible, .forgot-password-verification:focus-visible, .forgot-password-submit:focus-visible, .forgot-password-login-link:focus-visible { outline: 2px solid #14a9ff; outline-offset: 3px; }
.forgot-password-brand-logo { width: 100%; height: 100%; }
.forgot-password-panel { z-index: 2; top: 156px; left: 619px; width: 680px; height: 760px; }
.forgot-password-title, .forgot-password-label, .forgot-password-verification > span, .forgot-password-submit > span, .forgot-password-login-link { position: absolute; z-index: 4; margin: 0; letter-spacing: 0; }
.forgot-password-title { top: 202px; left: 619px; width: 680px; color: #f7f7f8; font-size: 36px; font-weight: 700; line-height: 43px; text-align: center; }
.forgot-password-label { width: 176px; color: #f3f4f6; font-size: 18px; line-height: 24px; text-align: right; white-space: normal; word-break: break-word; transform: translateY(-50%); }
.forgot-password-label-email { top: 318px; left: 669px; }.forgot-password-label-captcha { top: 388px; left: 669px; }.forgot-password-label-new-password { top: 458px; left: 669px; }.forgot-password-label-confirm-password { top: 528px; left: 669px; }
.forgot-password-field { position: absolute; z-index: 3; width: 395px; height: 50px; }
.forgot-password-field-email { top: 293px; left: 855px; }.forgot-password-field-captcha { top: 363px; left: 855px; width: 250px; }.forgot-password-field-new-password { top: 433px; left: 855px; }.forgot-password-field-confirm-password { top: 503px; left: 855px; }
.forgot-password-field > img { inset: 0; width: 100%; height: 50px; pointer-events: none; }
.forgot-password-field input { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; padding: 0 20px; border: 0; outline: 0; background: transparent; color: #f3f4f6; font: 400 18px/50px var(--forgot-password-font); }
.forgot-password-field input::placeholder { color: #8a9aad; opacity: 1; }.forgot-password-field-new-password input, .forgot-password-field-confirm-password input { padding-right: 60px; }
.forgot-password-password-toggle { position: absolute; z-index: 2; top: 5px; right: 8px; width: 46px; height: 41px; padding: 0; border: 0; background: transparent; cursor: pointer; }.forgot-password-password-toggle img { width: 46px; height: 41px; }
.forgot-password-verification { position: absolute; z-index: 3; top: 363px; left: 1115px; width: 135px; height: 50px; padding: 0; border: 0; background: transparent; cursor: pointer; }.forgot-password-verification > img { inset: 0; width: 135px; height: 50px; }.forgot-password-verification > span { inset: 0; display: grid; place-items: center; color: #fff; font-size: 18px; }
.forgot-password-submit { position: absolute; z-index: 3; top: 593px; left: 855px; width: 395px; height: 60px; padding: 0; border: 0; background: transparent; cursor: pointer; }.forgot-password-submit > img { inset: 0; width: 395px; height: 60px; }.forgot-password-submit > span { inset: 0; display: grid; place-items: center; color: #fff; font-size: 22px; }
.forgot-password-verification:disabled, .forgot-password-submit:disabled { cursor: not-allowed; opacity: .72; }
.forgot-password-login-link { top: 690px; left: 855px; width: 395px; color: #09a8ff; font-size: 18px; line-height: 24px; text-align: center; text-decoration: none; }.forgot-password-login-link:hover { text-decoration: underline; }
.forgot-password-toast { position: absolute; top: 40px; left: 50%; z-index: 100; max-width: 900px; padding: 18px 32px; border-radius: 8px; background: rgba(20,24,32,.92); color: #fff; font-size: 24px; line-height: 1.4; opacity: 0; pointer-events: none; text-align: center; transform: translateX(-50%) translateY(-16px); transition: opacity .3s ease, transform .3s ease; }.forgot-password-toast.is-visible { opacity: 1; transform: translateX(-50%) translateY(0); }.forgot-password-toast[hidden] { display: block; visibility: hidden; }
@media (max-width: 760px) {
    :root { --forgot-password-scale: 1 !important; }
    body { overflow: auto; }
    .forgot-password-fit-shell { min-height: 760px; height: 100dvh; }
    .forgot-password-fit-box, .forgot-password-artboard { width: 100%; height: 100%; }
    .forgot-password-artboard { transform: none; }
    .forgot-password-brand-logo-link { top: 20px; left: 24px; width: 94px; height: 40px; }
    .forgot-password-panel { top: 118px; left: 50%; width: min(calc(100% - 32px), 430px); height: 590px; transform: translateX(-50%); }
    .forgot-password-title { top: 150px; left: 16px; width: calc(100% - 32px); font-size: 24px; line-height: 29px; }
    .forgot-password-label { left: 24px; font-size: 14px; line-height: 18px; }
    .forgot-password-label-email { top: 215px; }.forgot-password-label-captcha { top: 302px; }.forgot-password-label-new-password { top: 389px; }.forgot-password-label-confirm-password { top: 476px; }
    .forgot-password-field { left: 24px; width: calc(100% - 48px); height: 46px; }
    .forgot-password-field-email { top: 239px; }.forgot-password-field-captcha { top: 326px; width: calc(100% - 178px); }.forgot-password-field-new-password { top: 413px; }.forgot-password-field-confirm-password { top: 500px; }
    .forgot-password-field > img { height: 46px; }.forgot-password-field input { font-size: 16px; line-height: 46px; }
    .forgot-password-verification { top: 326px; right: 24px; left: auto; width: 144px; height: 46px; }.forgot-password-verification > img { width: 144px; height: 46px; }.forgot-password-verification > span { font-size: 15px; }
    .forgot-password-password-toggle { top: 3px; right: 6px; height: 40px; }
    .forgot-password-submit { top: 574px; left: 24px; width: calc(100% - 48px); height: 54px; }.forgot-password-submit > img { width: 100%; height: 54px; }.forgot-password-submit > span { font-size: 18px; }
    .forgot-password-login-link { top: 654px; left: 24px; width: calc(100% - 48px); font-size: 16px; }
    .forgot-password-toast { top: 76px; width: calc(100% - 32px); max-width: 430px; padding: 12px 16px; font-size: 15px; }
}

@media (max-width: 1279px) {
    html, body { min-height: 100%; background: #00162a; }
    body { overflow-y: auto; overscroll-behavior-y: contain; }
    .forgot-password-fit-shell { display: block; min-height: 100dvh; height: auto; overflow-y: auto; overflow-x: clip; }
    .forgot-password-background { position: fixed; }
    .forgot-password-fit-box { width: 100%; height: auto; min-height: 100dvh; }
    .forgot-password-artboard { position: relative; display: flex; flex-direction: column; width: 100%; min-height: 100dvh; height: auto; padding: max(20px, env(safe-area-inset-top)) clamp(16px, 4vw, 48px) max(32px, env(safe-area-inset-bottom)); overflow: visible; transform: none; }
    .forgot-password-brand-logo-link { position: relative; top: auto; left: auto; width: 118px; height: 50px; margin-bottom: clamp(28px, 5vh, 56px); }
    .forgot-password-panel { display: none; }
    .forgot-password-title { position: relative; top: auto; left: auto; width: min(100%, 560px); margin: 0 auto 18px; font-size: 28px; line-height: 34px; text-align: start; }
    .forgot-password-form { position: relative; z-index: 4; display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 0.38fr); gap: 10px 12px; width: min(100%, 560px); margin: 0 auto; padding: clamp(20px, 4vw, 32px); border: 1px solid rgba(151, 204, 241, .32); border-radius: 8px; background: rgba(0, 30, 57, .88); box-shadow: 0 16px 40px rgba(0, 0, 0, .26); }
    .forgot-password-label { position: relative; top: auto; left: auto; grid-column: 1 / -1; width: auto; font-size: 16px; line-height: 22px; text-align: left; word-break: normal; transform: none; }
    .forgot-password-field { position: relative; top: auto; left: auto; grid-column: 1 / -1; width: 100%; height: 52px; min-height: 52px; }
    .forgot-password-field-captcha { grid-column: 1; width: 100%; }
    .forgot-password-field > img { position: absolute; inset: 0; width: 100%; height: 100%; }
    .forgot-password-field input { position: relative; inset: auto; min-height: 44px; height: 100%; padding: 0 18px; font-size: 16px; line-height: normal; }
    .forgot-password-password-toggle { top: 4px; right: 4px; width: 44px; height: 44px; }
    .forgot-password-password-toggle img { width: 44px; height: 39px; }
    .forgot-password-verification { position: relative; top: auto; left: auto; grid-column: 2; width: 100%; height: 52px; min-height: 44px; }
    .forgot-password-verification > img { position: absolute; inset: 0; width: 100%; height: 100%; }
    .forgot-password-verification > span { position: relative; inset: auto; min-height: 44px; padding: 0 6px; font-size: 14px; line-height: 18px; text-align: center; }
    .forgot-password-submit { position: relative; top: auto; left: auto; grid-column: 1 / -1; width: 100%; height: 56px; min-height: 44px; margin-top: 8px; }
    .forgot-password-submit > img { position: absolute; inset: 0; width: 100%; height: 100%; }
    .forgot-password-submit > span { position: relative; inset: auto; height: 100%; font-size: 18px; line-height: 22px; }
    .forgot-password-login-link { position: relative; top: auto; left: auto; grid-column: 1 / -1; width: 100%; min-height: 44px; padding: 10px 0; font-size: 16px; line-height: 22px; }
    .forgot-password-toast { position: fixed; top: max(16px, env(safe-area-inset-top)); width: min(calc(100% - 32px), 560px); max-width: none; padding: 12px 16px; font-size: 16px; }
}

@media (max-width: 479px) {
    .forgot-password-artboard { padding-inline: 16px; }
    .forgot-password-form { grid-template-columns: minmax(0, 1fr) 120px; gap: 10px 8px; padding: 20px 16px; }
}