.desktop-account-link, .desktop-back-home { display: none; }

@media (min-width: 769px) {
    body.auth-mobile {
        padding: 40px 28px; align-items: flex-start;
        background: radial-gradient(ellipse at 50% 20%, #f7ffff, #dff6f7 75%);
    }
    .auth-mobile .login-page, .auth-mobile .signup-page {
        grid-template-columns: minmax(0, 49fr) minmax(0, 51fr);
        max-width: 1076px; min-height: 0; border-radius: 30px;
        box-shadow: 0 18px 42px #076d7e24; background: #fff;
    }
    .auth-mobile .auth-hero.login-hero, .auth-mobile .auth-hero.signup-hero {
        position: relative; display: block; padding: 0; min-width: 0;
        aspect-ratio: 528 / 1266;
        /* Frame the complete left panel of the supplied design, without its form. */
        background-image: url('images/auth-reference.png');
        background-size: 217.80303% 108.05687%;
        background-position: 6.109325% 50.980392%;
        background-repeat: no-repeat;
    }
    .auth-mobile .auth-hero .auth-art { display: none; }
    .auth-mobile .auth-hero .auth-hero-copy {
        /* Keep the illustration's text available to assistive technology. */
        position: absolute; width: 1px; height: 1px; padding: 0;
        overflow: hidden; clip-path: inset(50%); white-space: nowrap;
    }
    .auth-mobile .login-card-wrap, .auth-mobile .signup-card-wrap {
        display: block; position: relative; padding: 190px 36px 70px 48px;
        background: linear-gradient(135deg, #fff, #fdfefe);
    }
    .auth-mobile .desktop-account-link {
        display: block; position: absolute; top: 40px; right: 30px;
        color: #424c78; font-size: 14px;
    }
    .auth-mobile .desktop-account-link a { margin-left: 8px; font-weight: 650; text-decoration: none; }
    .auth-mobile .desktop-back-home {
        display: inline-flex; gap: 12px; align-items: center;
        color: #008bb9; text-decoration: none; font-weight: 650; font-size: 16px;
        margin-bottom: 30px;
    }
    .auth-mobile .signup-card-wrap { padding-top: 140px; }
    .auth-mobile .signup-card .back-login { display: none; }
    .auth-mobile .login-card h2, .auth-mobile .signup-card h2 {
        color: #090f3b; font-size: clamp(26px, 3vw, 36px);
        line-height: 1.18; letter-spacing: -1.2px; margin: 0 0 12px;
    }
    .auth-mobile .subtitle { color: #151d49 !important; font-size: 17px; font-weight: 400; margin-bottom: 32px; line-height: 1.5; }
    .auth-mobile .field, .auth-mobile .form-group { margin-bottom: 22px; }
    .auth-mobile .signup-page label, .auth-mobile .login-page label {
        font-size: 15px; color: #10163f; font-weight: 650; margin-bottom: 8px;
    }
    .auth-mobile .signup-page input, .auth-mobile .login-page input {
        min-height: 50px; border: 1px solid #d8deec; border-radius: 9px;
        font-size: 15px; background: #fff; color: #172044;
    }
    .auth-mobile input::placeholder { color: #919abb; opacity: 1; }
    .auth-mobile .signup-card .help {
        background: #eef1f6; border-radius: 10px; padding: 12px 16px;
        margin-top: 10px; color: #626e93; font-size: 12px; line-height: 1.65;
    }
    .auth-mobile .help ul { padding-left: 16px; }
    .auth-mobile .signup-card .btn, .auth-mobile .login-btn {
        min-height: 56px; background: #007e9f !important; border-radius: 10px;
        font-size: 19px; font-weight: 650; margin-top: 22px;
    }
    .auth-mobile .signup-card .btn span { display: none; }
    .auth-mobile .login-link, .auth-mobile .signup-link { display: none; }
}

@media (min-width: 769px) and (max-width: 1000px) {
    body.auth-mobile { padding: 24px 18px; }
    .auth-mobile .login-card-wrap, .auth-mobile .signup-card-wrap { padding: 110px 24px 40px; }
    .auth-mobile .desktop-account-link { top: 28px; right: 24px; font-size: 12px; }
    .auth-mobile .desktop-back-home { margin-bottom: 24px; font-size: 14px; }
    .auth-mobile .subtitle { font-size: 15px; margin-bottom: 22px; }
    .auth-mobile .field, .auth-mobile .form-group { margin-bottom: 16px; }
}
