*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body.login-exact-page{min-height:100vh;background:#eef5ff;color:#0e2140;overflow:hidden}
.login-exact-shell{width:100%;min-height:100vh;display:grid;grid-template-columns:minmax(0,64%) minmax(430px,36%);background:#f3f7fd}
.login-exact-showcase{position:relative;min-height:100vh;overflow:hidden;background:#061d46}
.login-exact-showcase-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left center;display:block}
.login-exact-side{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:68px 28px 54px;background:radial-gradient(circle at 100% 15%,rgba(92,166,255,.2),transparent 34%),linear-gradient(180deg,#f8fbff,#edf4fc)}
.login-theme-switch{position:absolute;top:36px;right:42px;height:50px;padding:4px;display:flex;border:1px solid #d9e3f1;border-radius:28px;background:rgba(255,255,255,.82);box-shadow:0 10px 28px rgba(68,99,145,.08);backdrop-filter:blur(14px);z-index:2}
.login-theme-switch button{min-width:92px;height:40px;border:0;border-radius:22px;background:transparent;color:#7183a3;font-weight:700;font-size:14px;cursor:pointer}
.login-theme-switch button.is-active{background:#fff;color:#0f6bea;box-shadow:0 4px 14px rgba(45,94,158,.1)}
.login-exact-card{width:min(100%,560px);padding:42px 42px 34px;border:1px solid rgba(126,151,188,.18);border-radius:30px;background:#fff;box-shadow:0 24px 70px rgba(65,96,140,.16)}
.login-exact-brand{height:92px;display:flex;align-items:center;justify-content:center;margin-bottom:22px}
.login-exact-brand img{max-width:min(100%,330px);max-height:88px;object-fit:contain;display:block}
.login-exact-heading{text-align:left;margin:0 0 28px}
.login-exact-heading h1{margin:0 0 8px;font-size:42px;line-height:1.05;letter-spacing:-.035em;color:#0b1f40;font-weight:850}
.login-exact-heading p{margin:0;color:#7084a7;font-size:17px;line-height:1.45}
.login-exact-error{margin:0 0 18px;padding:13px 15px;border-radius:13px;background:#fff0f2;border:1px solid #ffc4ce;color:#a7122d;font-weight:700;font-size:13px}
.login-exact-form{display:grid;gap:18px}
.login-exact-group{display:grid;gap:8px;color:#0d2342;font-size:13px;font-weight:800}
.login-exact-field{height:58px;display:flex;align-items:center;gap:12px;padding:0 14px;border:1px solid #cfdced;border-radius:15px;background:#fff;box-shadow:0 3px 10px rgba(50,80,120,.035)}
.login-exact-field:focus-within{border-color:var(--login-accent,#2678f2);box-shadow:0 0 0 4px color-mix(in srgb,var(--login-accent,#2678f2) 10%,transparent)}
.login-exact-field>svg,.login-password-toggle svg{width:21px;height:21px;flex:0 0 auto;fill:none;stroke:#647da5;stroke-width:1.8}
.login-exact-field input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#0e2140;font:inherit;font-weight:600}
.login-exact-field input::placeholder{color:#8da0bd}
.login-password-toggle{width:34px;height:34px;border:0;background:transparent;padding:6px;display:grid;place-items:center;cursor:pointer;border-radius:8px}
.login-password-toggle:hover{background:#f2f6fc}
.login-exact-options{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:2px;font-size:13px;color:#10294c}
.login-remember{display:flex;align-items:center;gap:9px;cursor:pointer}.login-remember input{width:18px;height:18px;accent-color:var(--login-accent,#2678f2)}
.login-forgot{font-weight:700;color:var(--login-accent,#2678f2)}
.login-exact-submit{height:58px;border:0;border-radius:15px;background:linear-gradient(90deg,var(--login-accent,#1777ff),#1266f6);color:#fff;font-size:17px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:13px;cursor:pointer;box-shadow:0 13px 26px color-mix(in srgb,var(--login-accent,#2678f2) 22%,transparent)}
.login-exact-submit svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
.login-exact-submit:hover{transform:translateY(-1px)}
.login-exact-divider{display:flex;align-items:center;gap:12px;margin:24px 0;color:#8293ae;font-size:12px}.login-exact-divider:before,.login-exact-divider:after{content:"";height:1px;flex:1;background:#d8e2ef}
.login-exact-passkey{width:100%;min-height:64px;border:1px solid #cfdbeb;border-radius:15px;background:#fff;display:flex;align-items:center;gap:13px;padding:12px 16px;text-align:left;color:#0e2140;cursor:pointer}
.login-exact-passkey:hover{border-color:var(--login-accent,#2678f2)}
.passkey-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#eef5ff;color:var(--login-accent,#2678f2);font-size:22px}
.login-exact-passkey strong,.login-exact-passkey small{display:block}.login-exact-passkey strong{font-size:13px}.login-exact-passkey small{font-size:11px;color:#7588a5;margin-top:2px}
.passkey-inline-status{font-size:11px;color:#657890;margin-top:7px}
.login-exact-help{margin-top:24px;padding-top:18px;border-top:1px solid #dbe4f0;text-align:center;color:#7184a4;font-size:12px;line-height:1.4}.login-exact-help strong{color:var(--login-accent,#2678f2)}
.login-exact-footer{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px;color:#7689a8;font-size:11px}.login-exact-footer i{width:1px;height:12px;background:#c9d5e4}
body[data-login-theme="dark"] .login-exact-side{background:radial-gradient(circle at 100% 15%,rgba(60,100,210,.24),transparent 36%),linear-gradient(180deg,#0e1830,#111b32)}
body[data-login-theme="dark"] .login-exact-card{background:#17223a;border-color:#2a3c5b;box-shadow:0 24px 70px rgba(0,0,0,.25)}
body[data-login-theme="dark"] .login-exact-heading h1,body[data-login-theme="dark"] .login-exact-group,body[data-login-theme="dark"] .login-exact-options,body[data-login-theme="dark"] .login-exact-passkey{color:#f5f8ff}
body[data-login-theme="dark"] .login-exact-heading p,body[data-login-theme="dark"] .login-exact-help,body[data-login-theme="dark"] .login-exact-footer{color:#9eb0cc}
body[data-login-theme="dark"] .login-exact-field,body[data-login-theme="dark"] .login-exact-passkey{background:#101b30;border-color:#324662}
body[data-login-theme="dark"] .login-exact-field input{color:#f5f8ff}
body[data-login-theme="dark"] .login-theme-switch{background:#18243b;border-color:#2f425f}body[data-login-theme="dark"] .login-theme-switch button.is-active{background:#243653;color:#fff}
@media(max-width:1250px){.login-exact-shell{grid-template-columns:minmax(0,60%) minmax(430px,40%)}.login-exact-card{padding:34px 32px}.login-theme-switch{top:24px;right:24px}}
@media(max-width:980px){body.login-exact-page{overflow:auto}.login-exact-shell{display:block}.login-exact-showcase{min-height:620px}.login-exact-showcase-image{object-fit:cover;object-position:left top}.login-exact-side{min-height:auto;padding:90px 20px 34px}.login-exact-card{width:min(100%,620px)}.login-theme-switch{top:22px;right:22px}}
@media(max-width:640px){.login-exact-showcase{min-height:390px}.login-exact-showcase-image{object-position:left top}.login-exact-side{padding:78px 12px 26px}.login-exact-card{padding:26px 20px;border-radius:22px}.login-exact-brand{height:66px;margin-bottom:16px}.login-exact-brand img{max-width:240px;max-height:64px}.login-exact-heading h1{font-size:34px}.login-exact-heading p{font-size:14px}.login-exact-field{height:54px}.login-exact-submit{height:55px}.login-exact-options{font-size:12px}.login-theme-switch button{min-width:70px}.login-theme-switch span{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* 18.9QV - force crisp white credential fields in light mode, including browser autofill */
body:not([data-login-theme="dark"]) .login-exact-field{
    background:#fff !important;
    border-color:#cfdced !important;
}
body:not([data-login-theme="dark"]) .login-exact-field input,
body:not([data-login-theme="dark"]) .login-exact-field input:focus,
body:not([data-login-theme="dark"]) .login-exact-field input:active{
    background:#fff !important;
    color:#0b0f18 !important;
    -webkit-text-fill-color:#0b0f18 !important;
    caret-color:#0b0f18 !important;
    opacity:1 !important;
    box-shadow:0 0 0 1000px #fff inset !important;
    -webkit-box-shadow:0 0 0 1000px #fff inset !important;
}
body:not([data-login-theme="dark"]) .login-exact-field input::placeholder{
    color:#7b8799 !important;
    -webkit-text-fill-color:#7b8799 !important;
    opacity:1;
}
body:not([data-login-theme="dark"]) .login-exact-field input:-webkit-autofill,
body:not([data-login-theme="dark"]) .login-exact-field input:-webkit-autofill:hover,
body:not([data-login-theme="dark"]) .login-exact-field input:-webkit-autofill:focus,
body:not([data-login-theme="dark"]) .login-exact-field input:-webkit-autofill:active{
    -webkit-text-fill-color:#0b0f18 !important;
    caret-color:#0b0f18 !important;
    box-shadow:0 0 0 1000px #fff inset !important;
    -webkit-box-shadow:0 0 0 1000px #fff inset !important;
    transition:background-color 99999s ease-out 0s;
}
body:not([data-login-theme="dark"]) .login-exact-field input:-moz-autofill{
    background:#fff !important;
    color:#0b0f18 !important;
    box-shadow:0 0 0 1000px #fff inset !important;
}
body:not([data-login-theme="dark"]) .login-exact-field:focus-within{
    background:#fff !important;
}

/* Keep the intended dark-theme treatment. */
body[data-login-theme="dark"] .login-exact-field input:-webkit-autofill,
body[data-login-theme="dark"] .login-exact-field input:-webkit-autofill:hover,
body[data-login-theme="dark"] .login-exact-field input:-webkit-autofill:focus,
body[data-login-theme="dark"] .login-exact-field input:-webkit-autofill:active{
    -webkit-text-fill-color:#f5f8ff !important;
    caret-color:#f5f8ff !important;
    box-shadow:0 0 0 1000px #101b30 inset !important;
    -webkit-box-shadow:0 0 0 1000px #101b30 inset !important;
}

/* 18.9QW - corrected high-resolution login hero rendering */
.login-exact-showcase{
    isolation:isolate;
    background:#061d46;
}
.login-exact-showcase-image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center center;
    max-width:none;
    transform:none !important;
    filter:none !important;
    image-rendering:auto;
    -webkit-transform:translateZ(0);
    backface-visibility:hidden;
}

/* Keep the approved composition visible on common desktop resolutions. */
@media (min-width:981px) and (max-aspect-ratio:16/9){
    .login-exact-showcase-image{
        object-position:center top;
    }
}
@media (min-width:1600px){
    .login-exact-shell{
        grid-template-columns:minmax(0,62%) minmax(500px,38%);
    }
    .login-exact-showcase-image{
        object-position:center center;
    }
}
@media (min-width:2200px){
    .login-exact-shell{
        grid-template-columns:minmax(0,64%) minmax(560px,36%);
    }
}

/* 18.9QX - show the complete approved left-side artwork without cropping */
@media (min-width:981px){
    body.login-exact-page{
        overflow:hidden;
    }
    .login-exact-shell{
        grid-template-columns:minmax(0,58%) minmax(470px,42%);
    }
    .login-exact-showcase{
        min-height:100vh;
        display:flex;
        align-items:center;
        justify-content:center;
        overflow:hidden;
        background:
            radial-gradient(circle at 78% 20%,rgba(24,116,255,.18),transparent 34%),
            linear-gradient(180deg,#071f4a 0%,#03183a 100%);
    }
    .login-exact-showcase-image{
        position:relative;
        inset:auto;
        width:100%;
        height:100vh;
        max-width:100%;
        max-height:100vh;
        object-fit:contain;
        object-position:center center;
        display:block;
        transform:none!important;
        filter:none!important;
    }
}

/* Wider displays: use the space without ever cropping the bottom cards. */
@media (min-width:1600px){
    .login-exact-shell{
        grid-template-columns:minmax(0,60%) minmax(520px,40%);
    }
    .login-exact-showcase-image{
        width:100%;
        height:100vh;
        object-fit:contain;
    }
}

/* Shorter laptop screens: still keep all four lower image tiles visible. */
@media (min-width:981px) and (max-height:850px){
    .login-exact-showcase-image{
        height:100vh;
        width:100%;
        object-fit:contain;
        object-position:center center;
    }
    .login-exact-side{
        padding-top:54px;
        padding-bottom:34px;
    }
    .login-exact-card{
        padding-top:30px;
        padding-bottom:28px;
    }
}

/* 18.9QY - desktop proportion fix: fill the left area without cropping the approved hero */
@media (min-width:981px){
    .login-exact-shell{
        grid-template-columns:minmax(0,52%) minmax(500px,48%);
        min-height:100vh;
    }
    .login-exact-showcase{
        min-height:100vh;
        background:#061d46;
        padding:0;
    }
    .login-exact-showcase-image{
        width:100%;
        height:100vh;
        max-width:100%;
        max-height:100vh;
        object-fit:contain;
        object-position:center center;
    }
    .login-exact-side{
        min-height:100vh;
        justify-content:center;
        padding:58px 28px 30px;
        overflow-y:auto;
        scrollbar-width:none;
    }
    .login-exact-side::-webkit-scrollbar{width:0;height:0;display:none}
    .login-exact-card{
        width:min(100%,540px);
        flex:0 0 auto;
    }
    .login-theme-switch{
        top:20px;
        right:28px;
    }
}

/* Common 1366–1680 desktop/laptop widths: give the hero almost its natural fitted width. */
@media (min-width:981px) and (max-width:1700px){
    .login-exact-shell{
        grid-template-columns:minmax(0,50%) minmax(500px,50%);
    }
}

/* Short desktop screens: keep every sign-in option visible without zooming the page. */
@media (min-width:981px) and (max-height:920px){
    .login-exact-side{
        justify-content:flex-start;
        padding-top:62px;
        padding-bottom:20px;
    }
    .login-exact-card{
        padding:28px 34px 24px;
        border-radius:26px;
    }
    .login-exact-brand{
        height:72px;
        margin-bottom:14px;
    }
    .login-exact-brand img{
        max-width:290px;
        max-height:70px;
    }
    .login-exact-heading{
        margin-bottom:20px;
    }
    .login-exact-heading h1{
        font-size:36px;
        margin-bottom:5px;
    }
    .login-exact-heading p{
        font-size:15px;
    }
    .login-exact-form{
        gap:14px;
    }
    .login-exact-field,
    .login-exact-submit{
        height:52px;
    }
    .login-exact-divider{
        margin:16px 0;
    }
    .login-exact-passkey{
        min-height:56px;
        padding:10px 14px;
    }
    .login-exact-help{
        margin-top:16px;
        padding-top:14px;
    }
    .login-exact-footer{
        margin-top:14px;
    }
}

/* Very short desktop displays: preserve functionality and allow only the right column to scroll. */
@media (min-width:981px) and (max-height:760px){
    .login-exact-side{
        padding-top:54px;
    }
    .login-exact-card{
        padding:22px 30px 20px;
    }
    .login-exact-brand{height:58px;margin-bottom:10px}
    .login-exact-brand img{max-width:250px;max-height:56px}
    .login-exact-heading h1{font-size:31px}
    .login-exact-heading p{font-size:14px}
    .login-exact-form{gap:11px}
    .login-exact-field,.login-exact-submit{height:48px}
    .login-exact-divider{margin:12px 0}
    .login-exact-help{margin-top:12px;padding-top:10px}
    .login-exact-footer{margin-top:10px}
}

/* 18.9QZ - anchor the full login hero flush to the top without cropping */
@media (min-width:981px){
    .login-exact-showcase{
        position:relative;
        min-height:100vh;
        padding:0!important;
        margin:0!important;
        overflow:hidden;
        align-items:initial!important;
        justify-content:initial!important;
        background:#061d46;
    }
    .login-exact-showcase-image{
        position:absolute!important;
        inset:0!important;
        width:100%!important;
        height:100%!important;
        max-width:none!important;
        max-height:none!important;
        margin:0!important;
        padding:0!important;
        display:block!important;
        object-fit:contain!important;
        object-position:center top!important;
        transform:none!important;
        filter:none!important;
    }
}


/* 18.9RA - authoritative desktop balance reset */
@media (min-width:981px){
  html,body.login-exact-page{width:100%;height:100%;min-height:100%;overflow:hidden}
  .login-exact-shell{
    width:100vw!important;
    min-width:0!important;
    min-height:100vh!important;
    grid-template-columns:minmax(0,55%) minmax(440px,45%)!important;
    overflow:hidden!important;
  }
  .login-exact-showcase{
    width:100%!important;
    min-width:0!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:0!important;
    margin:0!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;
    overflow:hidden!important;
    background:#061d46!important;
  }
  .login-exact-showcase-image{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    height:100vh!important;
    max-width:100%!important;
    max-height:100vh!important;
    margin:0!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  .login-exact-side{
    width:100%!important;
    min-width:0!important;
    min-height:100vh!important;
    padding:72px 24px 28px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    scrollbar-width:none!important;
  }
  .login-exact-side::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
  .login-exact-card{
    width:min(100%,480px)!important;
    max-width:480px!important;
    margin:0 auto!important;
    padding:32px 32px 28px!important;
    border-radius:26px!important;
    flex:0 0 auto!important;
  }
  .login-exact-brand{
    height:72px!important;
    margin:0 0 18px!important;
    overflow:visible!important;
  }
  .login-exact-brand img{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    max-height:70px!important;
    object-fit:contain!important;
  }
  .login-theme-switch{
    top:18px!important;
    right:24px!important;
    height:46px!important;
    padding:3px!important;
  }
  .login-theme-switch button{
    min-width:78px!important;
    height:38px!important;
    font-size:13px!important;
  }
  .login-exact-heading{margin-bottom:22px!important}
  .login-exact-heading h1{font-size:36px!important;line-height:1.08!important}
  .login-exact-heading p{font-size:15px!important}
  .login-exact-form{gap:14px!important}
  .login-exact-field,.login-exact-submit{height:52px!important}
  .login-exact-divider{margin:16px 0!important}
  .login-exact-help{margin-top:16px!important;padding-top:14px!important}
  .login-exact-footer{margin-top:16px!important}
}

@media (min-width:981px) and (max-width:1400px){
  .login-exact-shell{grid-template-columns:minmax(0,54%) minmax(420px,46%)!important}
  .login-exact-card{width:min(100%,450px)!important;max-width:450px!important;padding:28px 28px 24px!important}
  .login-exact-brand{height:64px!important}
  .login-exact-brand img{max-height:62px!important}
  .login-exact-heading h1{font-size:33px!important}
}

@media (min-width:981px) and (max-height:820px){
  .login-exact-side{align-items:flex-start!important;padding-top:56px!important;padding-bottom:18px!important}
  .login-exact-card{padding:24px 28px 20px!important}
  .login-exact-brand{height:58px!important;margin-bottom:12px!important}
  .login-exact-brand img{max-height:56px!important}
  .login-exact-heading{margin-bottom:16px!important}
  .login-exact-heading h1{font-size:31px!important}
  .login-exact-form{gap:11px!important}
  .login-exact-field,.login-exact-submit{height:48px!important}
  .login-exact-divider{margin:12px 0!important}
  .login-exact-passkey{min-height:54px!important}
  .login-exact-help{margin-top:12px!important;padding-top:10px!important}
  .login-exact-footer{margin-top:10px!important}
}

/* 18.9RB - authoritative desktop proportion rebuild */
@media (min-width:981px){
  html,body.login-exact-page{
    width:100%;
    height:100%;
    min-height:100%;
    overflow:hidden!important;
  }

  /*
   * The approved hero artwork is close to a 0.90 width/height ratio.
   * Size the left column from viewport HEIGHT rather than a blunt percentage,
   * so the artwork fills the column without dark gutters or bottom cropping.
   */
  .login-exact-shell{
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    display:grid!important;
    grid-template-columns:minmax(620px,min(56vw,90vh)) minmax(520px,1fr)!important;
    overflow:hidden!important;
    background:#eef5ff!important;
  }

  .login-exact-showcase{
    position:relative!important;
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#071f4a!important;
  }

  .login-exact-showcase-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center top!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    filter:none!important;
  }

  .login-exact-side{
    position:relative!important;
    width:100%!important;
    height:100vh!important;
    min-width:0!important;
    min-height:100vh!important;
    padding:74px 36px 34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    scrollbar-width:none!important;
    background:
      radial-gradient(circle at 92% 8%,rgba(72,146,255,.18),transparent 30%),
      radial-gradient(circle at 10% 92%,rgba(110,92,255,.10),transparent 28%),
      linear-gradient(180deg,#f8fbff 0%,#edf4fd 100%)!important;
  }
  .login-exact-side::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}

  .login-exact-card{
    width:min(100%,540px)!important;
    max-width:540px!important;
    margin:auto!important;
    padding:38px 40px 32px!important;
    border-radius:30px!important;
    border:1px solid rgba(126,151,188,.20)!important;
    box-shadow:0 24px 70px rgba(48,82,132,.15)!important;
    flex:0 0 auto!important;
  }

  .login-exact-brand{
    height:78px!important;
    margin:0 0 20px!important;
    overflow:visible!important;
  }
  .login-exact-brand img{
    width:auto!important;
    max-width:340px!important;
    max-height:76px!important;
    object-fit:contain!important;
  }

  .login-theme-switch{
    top:18px!important;
    right:30px!important;
    height:44px!important;
    padding:3px!important;
    border-radius:24px!important;
  }
  .login-theme-switch button{
    min-width:72px!important;
    height:36px!important;
    font-size:12px!important;
    border-radius:20px!important;
  }

  .login-exact-heading{margin-bottom:24px!important}
  .login-exact-heading h1{font-size:38px!important;line-height:1.06!important;margin-bottom:7px!important}
  .login-exact-heading p{font-size:15px!important}
  .login-exact-form{gap:16px!important}
  .login-exact-field{height:54px!important;border-radius:14px!important}
  .login-exact-submit{height:54px!important;border-radius:14px!important}
  .login-exact-divider{margin:18px 0!important}
  .login-exact-passkey{min-height:58px!important;border-radius:14px!important}
  .login-exact-help{margin-top:18px!important;padding-top:14px!important}
  .login-exact-footer{margin-top:18px!important}
}

/* Standard laptops: preserve the same visual proportions without squeezing the form. */
@media (min-width:981px) and (max-width:1450px){
  .login-exact-shell{
    grid-template-columns:minmax(590px,min(55vw,90vh)) minmax(470px,1fr)!important;
  }
  .login-exact-side{padding-left:24px!important;padding-right:24px!important}
  .login-exact-card{width:min(100%,500px)!important;max-width:500px!important;padding:34px 34px 28px!important}
  .login-exact-brand img{max-width:310px!important}
  .login-exact-heading h1{font-size:35px!important}
}

/* Short desktop displays: compact vertically, never zoom the entire interface. */
@media (min-width:981px) and (max-height:820px){
  .login-exact-side{
    align-items:flex-start!important;
    padding-top:58px!important;
    padding-bottom:18px!important;
  }
  .login-exact-card{padding:24px 32px 22px!important}
  .login-exact-brand{height:58px!important;margin-bottom:12px!important}
  .login-exact-brand img{max-height:56px!important;max-width:280px!important}
  .login-exact-heading{margin-bottom:16px!important}
  .login-exact-heading h1{font-size:31px!important}
  .login-exact-heading p{font-size:14px!important}
  .login-exact-form{gap:11px!important}
  .login-exact-field,.login-exact-submit{height:48px!important}
  .login-exact-divider{margin:12px 0!important}
  .login-exact-passkey{min-height:52px!important;padding:9px 13px!important}
  .login-exact-help{margin-top:12px!important;padding-top:10px!important}
  .login-exact-footer{margin-top:10px!important}
}

/* On very wide displays keep the form comfortably sized rather than floating in empty space. */
@media (min-width:2000px) and (min-height:1000px){
  .login-exact-card{max-width:600px!important;padding:44px 46px 38px!important}
  .login-exact-brand img{max-width:370px!important;max-height:82px!important}
  .login-exact-heading h1{font-size:42px!important}
  .login-exact-field,.login-exact-submit{height:58px!important}
}

/* 18.9RC - definitive responsive login layout (desktop / tablet / mobile)
   The approved hero is 1190 x 1322 (aspect ratio ~0.9002). On desktop the
   left column follows that ratio against the viewport height, so the whole
   artwork fills the column without crop or dark side gutters. */

/* Shared hardening */
.login-exact-shell,
.login-exact-showcase,
.login-exact-side,
.login-exact-card{min-width:0}
.login-exact-showcase-image{max-width:none}
.login-exact-side{scrollbar-width:none}
.login-exact-side::-webkit-scrollbar{display:none;width:0;height:0}
.login-exact-card{max-width:100%}

/* Full desktop: artwork aspect ratio drives the left column. */
@media (min-width:1181px){
    body.login-exact-page{
        min-height:100vh;
        overflow:hidden;
    }
    .login-exact-shell{
        height:100vh;
        min-height:100vh;
        display:grid;
        grid-template-columns:min(56vw,90vh) minmax(520px,1fr);
        align-items:stretch;
        overflow:hidden;
        background:#f3f7fd;
    }
    .login-exact-showcase{
        width:100%;
        height:100vh;
        min-height:0;
        padding:0;
        margin:0;
        display:block;
        overflow:hidden;
        background:#061d46;
    }
    .login-exact-showcase-image{
        position:absolute;
        inset:0;
        width:100%;
        height:100%;
        object-fit:fill;
        object-position:center center;
        display:block;
        transform:none!important;
        filter:none!important;
    }
    .login-exact-side{
        height:100vh;
        min-height:0;
        overflow-y:auto;
        overflow-x:hidden;
        display:flex;
        justify-content:center;
        align-items:center;
        padding:68px clamp(24px,3vw,56px) 34px;
    }
    .login-exact-card{
        width:min(100%,560px);
        margin:auto;
    }
    .login-theme-switch{
        position:fixed;
        top:20px;
        right:clamp(22px,2.5vw,44px);
        z-index:20;
    }
}

/* Short desktop screens: keep card usable without scaling the entire page. */
@media (min-width:1181px) and (max-height:880px){
    .login-exact-side{
        justify-content:flex-start;
        padding-top:64px;
        padding-bottom:20px;
    }
    .login-exact-card{padding:28px 34px 24px;border-radius:26px}
    .login-exact-brand{height:68px;margin-bottom:12px}
    .login-exact-brand img{max-width:285px;max-height:66px}
    .login-exact-heading{margin-bottom:18px}
    .login-exact-heading h1{font-size:35px}
    .login-exact-heading p{font-size:15px}
    .login-exact-form{gap:13px}
    .login-exact-field,.login-exact-submit{height:51px}
    .login-exact-divider{margin:14px 0}
    .login-exact-passkey{min-height:56px;padding:10px 14px}
    .login-exact-help{margin-top:14px;padding-top:12px}
    .login-exact-footer{margin-top:12px}
}

/* Tablet landscape and large tablet portrait: stack artwork above form.
   The image uses its natural ratio, preventing crop and blur. */
@media (min-width:768px) and (max-width:1180px){
    body.login-exact-page{
        overflow:auto;
        background:#edf4fc;
    }
    .login-exact-shell{
        display:flex;
        flex-direction:column;
        width:100%;
        min-height:100vh;
        background:#edf4fc;
    }
    .login-exact-showcase{
        order:1;
        width:100%;
        height:auto;
        min-height:0;
        padding:0;
        margin:0;
        overflow:hidden;
        background:#061d46;
    }
    .login-exact-showcase-image{
        position:relative;
        inset:auto;
        width:100%;
        height:auto;
        max-height:none;
        display:block;
        object-fit:contain;
        object-position:center top;
    }
    .login-exact-side{
        order:2;
        width:100%;
        min-height:auto;
        overflow:visible;
        padding:72px 30px 34px;
    }
    .login-exact-card{
        width:min(100%,620px);
        margin:0 auto;
        padding:36px 38px 30px;
    }
    .login-theme-switch{
        position:absolute;
        top:18px;
        right:28px;
    }
    .login-exact-footer{margin-bottom:4px}
}

/* Mobile */
@media (max-width:767px){
    html,body{width:100%;overflow-x:hidden}
    body.login-exact-page{
        overflow-y:auto;
        background:#edf4fc;
    }
    .login-exact-shell{
        display:flex;
        flex-direction:column;
        width:100%;
        min-height:100vh;
    }
    .login-exact-showcase{
        order:1;
        width:100%;
        height:auto;
        min-height:0;
        overflow:hidden;
        background:#061d46;
    }
    .login-exact-showcase-image{
        position:relative;
        inset:auto;
        width:100%;
        height:auto;
        max-height:none;
        object-fit:contain;
        object-position:center top;
        display:block;
    }
    .login-exact-side{
        order:2;
        width:100%;
        min-height:auto;
        overflow:visible;
        align-items:stretch;
        padding:68px 14px 24px;
    }
    .login-theme-switch{
        position:absolute;
        top:14px;
        right:14px;
        height:44px;
        padding:3px;
    }
    .login-theme-switch button{
        min-width:68px;
        height:36px;
        font-size:12px;
    }
    .login-exact-card{
        width:100%;
        margin:0;
        padding:26px 20px 24px;
        border-radius:22px;
    }
    .login-exact-brand{
        height:62px;
        margin-bottom:14px;
    }
    .login-exact-brand img{
        max-width:min(100%,240px);
        max-height:60px;
    }
    .login-exact-heading{
        margin-bottom:22px;
    }
    .login-exact-heading h1{
        font-size:32px;
        line-height:1.08;
    }
    .login-exact-heading p{font-size:14px}
    .login-exact-form{gap:15px}
    .login-exact-field{
        height:54px;
        padding:0 12px;
    }
    .login-exact-options{
        align-items:center;
        gap:10px;
        font-size:12px;
    }
    .login-exact-submit{height:54px;font-size:16px}
    .login-exact-divider{margin:18px 0}
    .login-exact-passkey{min-height:60px;padding:10px 12px}
    .login-exact-help{margin-top:18px;padding-top:14px}
    .login-exact-footer{gap:8px;margin-top:18px;font-size:10px}
}

/* Very narrow phones: avoid collisions in account options. */
@media (max-width:420px){
    .login-exact-side{padding-left:10px;padding-right:10px}
    .login-exact-card{padding:24px 16px 22px}
    .login-exact-heading h1{font-size:29px}
    .login-exact-options{flex-wrap:wrap}
    .login-forgot{margin-left:auto}
    .login-exact-passkey small{font-size:10px}
}

/* 18.9RD - mobile/tablet login refinement
   Mobile intentionally uses a compact hero crop rather than rendering the full
   desktop marketing artwork at its natural portrait height. */
@media (max-width:767px){
  html,body{background:#edf4fc!important;min-height:100%;}
  body.login-exact-page{background:#edf4fc!important;overflow-y:auto!important;}
  .login-exact-shell{
    min-height:100vh!important;
    background:#edf4fc!important;
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
  }
  .login-exact-showcase{
    width:100%!important;
    height:clamp(250px,42vh,390px)!important;
    min-height:250px!important;
    max-height:390px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#061d46!important;
    position:relative!important;
  }
  .login-exact-showcase-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center 8%!important;
    display:block!important;
    transform:none!important;
  }
  .login-exact-side{
    width:100%!important;
    min-height:auto!important;
    margin:0!important;
    padding:14px 12px 26px!important;
    background:#edf4fc!important;
    overflow:visible!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
  }
  .login-theme-switch{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    margin:-4px auto 12px!important;
    width:auto!important;
    height:40px!important;
    padding:3px!important;
    align-self:center!important;
    z-index:4!important;
  }
  .login-theme-switch button{
    min-width:64px!important;
    height:34px!important;
    padding:0 13px!important;
    font-size:12px!important;
  }
  .login-exact-card{
    width:100%!important;
    max-width:560px!important;
    margin:0 auto!important;
    padding:22px 18px 20px!important;
    border-radius:22px!important;
    box-shadow:0 16px 42px rgba(31,61,111,.14)!important;
  }
  .login-exact-brand{
    height:48px!important;
    min-height:48px!important;
    margin:0 0 12px!important;
  }
  .login-exact-brand img{
    max-width:min(100%,220px)!important;
    max-height:48px!important;
  }
  .login-exact-heading{margin:0 0 18px!important;}
  .login-exact-heading h1{font-size:29px!important;line-height:1.08!important;margin-bottom:5px!important;}
  .login-exact-heading p{font-size:14px!important;line-height:1.35!important;}
  .login-exact-form{gap:12px!important;}
  .login-exact-label{font-size:12px!important;margin-bottom:5px!important;}
  .login-exact-field{height:50px!important;padding:0 10px!important;border-radius:14px!important;}
  .login-exact-field input{font-size:15px!important;}
  .login-exact-options{margin-top:2px!important;gap:8px!important;font-size:12px!important;}
  .login-exact-submit{height:50px!important;font-size:15px!important;border-radius:13px!important;}
  .login-exact-divider{margin:14px 0!important;}
  .login-exact-passkey{min-height:54px!important;padding:9px 11px!important;border-radius:13px!important;}
  .login-exact-passkey strong{font-size:13px!important;}
  .login-exact-passkey small{font-size:10.5px!important;line-height:1.2!important;}
  .login-exact-help{margin-top:14px!important;padding-top:12px!important;font-size:11px!important;}
  .login-exact-footer{margin:14px 0 0!important;gap:7px!important;font-size:10px!important;justify-content:center!important;flex-wrap:wrap!important;}
}

/* Small phones: keep the login usable without oversized vertical gaps. */
@media (max-width:430px){
  .login-exact-showcase{height:280px!important;min-height:280px!important;max-height:280px!important;}
  .login-exact-showcase-image{object-position:center 4%!important;}
  .login-exact-side{padding:10px 9px 22px!important;}
  .login-theme-switch{margin-bottom:9px!important;}
  .login-exact-card{padding:20px 15px 18px!important;border-radius:20px!important;}
  .login-exact-heading h1{font-size:27px!important;}
  .login-exact-options{flex-wrap:nowrap!important;}
  .login-exact-options label,.login-forgot{font-size:11px!important;}
}

/* Tablets: keep more marketing artwork but avoid the full portrait-height image. */
@media (min-width:768px) and (max-width:1180px){
  .login-exact-shell{background:#edf4fc!important;gap:0!important;}
  .login-exact-showcase{
    height:clamp(390px,48vh,560px)!important;
    min-height:390px!important;
    max-height:560px!important;
    position:relative!important;
  }
  .login-exact-showcase-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 12%!important;
  }
  .login-exact-side{
    padding:18px 24px 30px!important;
    background:#edf4fc!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
  }
  .login-theme-switch{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    margin:0 auto 14px!important;
  }
  .login-exact-card{width:min(100%,620px)!important;margin:0 auto!important;padding:30px 32px 26px!important;}
}


/* 18.9RE - remove login appearance switch from every breakpoint.
   Login remains in the clean light presentation; portal appearance can still be controlled after sign-in. */
html{color-scheme:light;}
.login-theme-switch{display:none!important;}
body.login-exact-page{color-scheme:light;}
/* Recover spacing previously reserved for the removed switch. */
@media (min-width:1181px){
  .login-exact-side{padding-top:38px!important;}
}
@media (min-width:768px) and (max-width:1180px){
  .login-exact-side{padding-top:18px!important;}
}
@media (max-width:767px){
  .login-exact-side{padding-top:12px!important;}
}
