/* Extend the mobile login photograph behind the branding and down to the form. */
@media (max-width: 760px) {
    .v2-login.auth-login .auth-shell {
        position: relative;
        isolation: isolate;
        background: #080808;
    }
    .v2-login.auth-login .auth-shell::before {
        content: "";
        position: absolute;
        z-index: 0;
        inset: var(--app-safe-top, 0px) 0 auto;
        height: clamp(280px, 50svh, 520px);
        pointer-events: none;
        background-image:
            linear-gradient(180deg, rgba(8,8,8,.48) 0%, rgba(8,8,8,.56) 42%, rgba(8,8,8,.8) 65%, rgba(8,8,8,.97) 87%, #080808 100%),
            var(--auth-hero);
        background-position: center, center 4%;
        background-size: cover;
        background-repeat: no-repeat;
    }
    .v2-login.auth-login .auth-showcase,
    .v2-login.auth-login .auth-panel {
        position: relative;
        z-index: 1;
        background: transparent;
    }
    .v2-login.auth-login .auth-showcase-shade { display: none; }
    .v2-login.auth-login .auth-showcase { overflow: visible; }
    .v2-login.auth-login .auth-showcase .auth-brand {
        position: absolute;
        top: var(--auth-logo-center, 16svh);
        left: 50%;
        z-index: 2;
        margin: 0;
        transform: translate(-50%, -50%);
    }
    .v2-login.auth-login .auth-brand img {
        filter: drop-shadow(0 3px 14px rgba(0,0,0,.5));
    }
}