/* Staff login only: portal and recovery pages retain their own presentation. */
body.is-public:has(.staff-login) { background: #f8f9fb; }
body.is-public:has(.staff-login) .app-header, body.is-public:has(.staff-login) .app-bg { display: none; }
body.is-public:has(.staff-login) .workspace-main { width: 100%; max-width: none; min-height: 100vh; margin: 0; padding: 0; }
body.is-public:has(.staff-login) .workspace-main > .space-y-2 { position: fixed; z-index: 40; top: 1rem; left: 50%; width: min(34rem, calc(100% - 2rem)); transform: translateX(-50%); }
.staff-login { display: grid; grid-template-columns: 1.04fr 1fr; min-height: 100svh; padding: 14px; color: #172a3b; background: #f8f9fb; font-size: 14px; }
.staff-login, .staff-login * { box-sizing: border-box; }
.staff-login h1, .staff-login h2, .staff-login p { margin: 0; }
.staff-login svg { width: 19px; height: 19px; flex-shrink: 0; }
.staff-login__story { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; min-height: 840px; padding: 42px 48px 28px; overflow: hidden; border-radius: 22px; color: #fff; background: #0b202c; }
.staff-login__story:before { position: absolute; inset: 0; z-index: -2; content: ''; background-image: linear-gradient(180deg, #091a251f, #0b202c 88%), var(--login-image, linear-gradient(135deg, #102b37, #081721)); background-size: cover; background-position: center; }
.staff-login__brand { display: flex; align-items: center; gap: 13px; font-size: 18px; font-weight: 700; letter-spacing: -.5px; }
.staff-login__brand-mark { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid #ffffff30; border-radius: 13px; background: #ffffff0a; }
.staff-login__brand-mark svg { width: 23px; height: 23px; color: #b6dacf; }
.staff-login__brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.staff-login__brand small { display: block; margin-top: 5px; color: #adbdc5; font-size: 11px; font-weight: 400; letter-spacing: .1px; }
.staff-login__art { position: absolute; z-index: -1; top: 12%; left: 10%; width: 90%; height: 54%; opacity: .9; filter: drop-shadow(0 35px 36px #0007); transform: rotate(-26deg); }
.staff-login__art i { position: absolute; top: 8%; left: 12%; width: 78%; aspect-ratio: 1; border-radius: 50%; border: 1px solid #b9eddf5c; background: linear-gradient(140deg, #c0e4d942, #16313c05 38%, #4a8b802e 67%, #b7ecda57); box-shadow: inset 7px 2px 10px #dcfff929, inset -9px -10px 20px #0006, 0 8px 22px #0005; transform: rotateX(48deg); }
.staff-login__art i:nth-child(2) { top: 17%; left: 20%; width: 62%; background: linear-gradient(130deg, #203d48, #72a89980, #132f39); }
.staff-login__art i:nth-child(3) { top: 26%; left: 28%; width: 46%; background: linear-gradient(130deg, #132f3b, #588f8190, #142d39); }
.staff-login__art i:nth-child(4) { top: 35%; left: 36%; width: 30%; background: linear-gradient(130deg, #789e92, #203d48 70%); }
.staff-login__story-copy { margin-top: auto; padding-top: 375px; }
body.app-shell .staff-login .staff-login__eyebrow { font-size: 10px !important; font-weight: 700; letter-spacing: 2.2px; text-transform: uppercase; }
.staff-login__story-copy .staff-login__eyebrow { color: #c0dccf; }
body.app-shell .staff-login h2 { margin: 22px 0 20px; font-size: clamp(30px, 3.1vw, 49px) !important; font-weight: 500; line-height: 1.17; letter-spacing: -2px; }
body.app-shell .staff-login h2 em { font-family: Georgia, serif; font-weight: 400; font-size: 1.04em !important; color: #bedbcc; }
.staff-login__story-copy > p:last-of-type { color: #aebfc8; font-size: 14px; line-height: 1.85; }
.staff-login__pillars { display: flex; align-items: center; gap: 18px; margin-top: 28px; color: #d4dedf; font-size: 11px; }
.staff-login__pillars i { width: 3px; height: 3px; border-radius: 50%; background: #77918e; }
.staff-login__story-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 45px; padding-top: 21px; border-top: 1px solid #ffffff20; color: #90a5af; font-size: 11px; }
.staff-login__access { display: flex; flex-direction: column; padding: 29px 44px 14px; }
.staff-login__access-top, .staff-login__access-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; color: #6c7882; font-size: 11px; }
.staff-login__access-top b { margin: 0 9px; color: #b8c1c5; font-weight: 400; }
.staff-login__secure { display: inline-flex; gap: 7px; align-items: center; }
.staff-login__secure svg { width: 13px; height: 13px; }
.staff-login__form-wrap { width: min(100%, 378px); margin: auto; padding: 54px 0; }
.staff-login__welcome-mark { display: grid; place-items: center; width: 49px; height: 49px; margin-bottom: 27px; border: 1px solid #dbe4e1; border-radius: 15px; color: #385f53; background: linear-gradient(140deg, #fff, #eaf0eb); box-shadow: 0 4px 9px #182e2910; }
.staff-login__welcome-mark svg { width: 26px; height: 26px; }
.staff-login__form-wrap > .staff-login__eyebrow { color: #638071; }
body.app-shell .staff-login h1 { margin-top: 12px; font-size: 42px !important; font-weight: 600; line-height: 1.15; letter-spacing: -1.9px; }
.staff-login__intro { margin-top: 12px !important; color: #73808a; font-size: 14px; line-height: 1.7; }
.staff-login__sso { display: flex; justify-content: center; align-items: center; gap: 12px; height: 52px; margin-top: 31px; padding: 0 18px; border: 1px solid #d5dce0; border-radius: 9px; color: #233748; background: #fff; text-decoration: none; font-weight: 600; font-size: 13px; box-shadow: 0 2px 3px #172c3a03; transition: border-color .15s, background .15s; }
.staff-login__sso svg:last-child { width: 15px; margin-left: auto; }
.staff-login__sso svg:first-child { margin-right: auto; }
.staff-login__sso:hover { border-color: #638071; background: #f1f5f2; }
.staff-login__divider { display: flex; align-items: center; gap: 16px; margin: 24px 0; font-size: 11px; color: #89949b; }
.staff-login__divider:before, .staff-login__divider:after { content: ''; flex: 1; height: 1px; background: #e0e5e8; }
.staff-login__form { margin-top: 26px; }
.staff-login__divider + .staff-login__form { margin-top: 0; }
.staff-login__form label { display: block; font-size: 12px; font-weight: 600; }
.staff-login__input { display: flex; align-items: center; gap: 12px; min-height: 52px; margin-top: 9px; padding: 0 15px; border: 1px solid #dae1e5; border-radius: 9px; background: #fff; }
.staff-login__input svg { width: 16px; height: 16px; color: #8c9aa3; }
.staff-login__input input { width: 100%; min-width: 0; height: 50px; padding: 0; border: 0; outline: 0; box-shadow: none; color: #172a3b; background: transparent; font-size: 13px; }
.staff-login__input input::placeholder { color: #8b979f; opacity: 1; }
.staff-login__input:focus-within { border-color: #688d7e; box-shadow: 0 0 0 3px #688d7e20; }
.staff-login__password-label { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 21px; }
.staff-login__password-label a { color: #567666; font-size: 11px; text-decoration: none; font-weight: 600; }
.staff-login__password-label a:hover { text-decoration: underline; }
.staff-login__submit { display: flex; align-items: center; justify-content: center; gap: 14px; width: 100%; min-height: 53px; margin-top: 25px; border: 1px solid #152c3b; border-radius: 9px; background: linear-gradient(115deg, #243f50, #102735); color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; box-shadow: 0 8px 15px -8px #152c3b60; transition: background .15s; }
.staff-login__submit:hover { background: #2e4b58; }
.staff-login a:focus-visible, .staff-login button:focus-visible { outline: 3px solid #688d7e; outline-offset: 4px; }
.staff-login__protection { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 26px; color: #668273; font-size: 11px; }
.staff-login__protection p { color: #63747e; line-height: 1.7; }
.staff-login__protection small { display: block; color: #829098; font-size: 10px; }
.staff-login__access-footer { padding-top: 18px; border-top: 1px solid #e4e8e9; }
.staff-login__access-footer svg { color: #8ba297; }
@media (min-width: 1600px) { .staff-login__story { padding-inline: 64px; } }
@media (max-width: 1100px) { .staff-login__story { padding-inline: 30px; } .staff-login__access { padding-inline: 30px; } .staff-login__access-top > span:first-child { display: none; } .staff-login__access-top { justify-content: flex-end; } }
@media (max-width: 760px) { .staff-login { grid-template-columns: 1fr; padding: 0; } .staff-login__story { display: none; } .staff-login__access { min-height: 100svh; padding: 28px 24px 22px; } .staff-login__access-top > span:first-child { display: block; } .staff-login__access-top { justify-content: space-between; } .staff-login__form-wrap { padding-block: 46px; } body.app-shell .staff-login h1 { font-size: 36px !important; } }
@media (prefers-reduced-motion: reduce) { .staff-login * { transition: none !important; } }

/* The shared shell applies important heading/button rules to public pages too. */
body.app-shell .staff-login h2 { color: #f4f7f5 !important; }
body.app-shell .staff-login h1 { color: #172a3b !important; }
body.app-shell .staff-login .staff-login__submit { min-height: 53px; padding: 14px 18px; border: 1px solid #152c3b !important; border-radius: 9px !important; background: linear-gradient(115deg, #243f50, #102735) !important; color: #fff !important; font-weight: 600; }
body.app-shell .staff-login .staff-login__submit:hover { background: #2e4b58 !important; }
body.app-shell .staff-login .staff-login__input input { background: transparent !important; color: #172a3b !important; border: 0 !important; box-shadow: none !important; }
body.app-shell .staff-login .staff-login__brand small { font-size: 11px !important; }
body.is-public:has(.staff-login) > .sleek-mobile-scrim { display: none; }
@media (max-width: 760px) { body.app-shell .staff-login { padding: 0; } }