:root {
    --md-auth-max: 520px;
    --md-auth-pad: clamp(1rem, 4vw, 1.5rem);
}

.auth-shell {
    min-height: 100vh;
    min-height: 100svh;
}

@supports (min-height: 100dvh) {
    .auth-shell {
        min-height: 100dvh;
    }
}

.auth-main {
    padding: clamp(1rem, 3.6vw, 2.25rem);
}

.auth-card {
    min-height: unset;
}

@media (max-width: 1024px) {
    .auth-main {
        padding: var(--md-auth-pad);
    }

    .auth-card {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        border-radius: var(--r-2xl);
        min-height: min(820px, calc(100svh - (var(--md-auth-pad) * 2)));
    }

    @supports (min-height: 100dvh) {
        .auth-card {
            min-height: min(820px, calc(100dvh - (var(--md-auth-pad) * 2)));
        }
    }

    .auth-panel--brand {
        display: grid;
        padding: 1.35rem 1.35rem 1rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: var(--r-2xl) var(--r-2xl) 0 0;
    }

    .md-enterprise-orbit {
        display: none;
    }

    .md-auth-brand-wave {
        display: none;
    }

    .md-auth-brand {
        gap: 1rem;
    }

    .md-auth-brand-text {
        max-width: none;
    }

    .md-auth-brand-bottom {
        margin-top: 0;
        padding-top: 0;
        gap: 0.75rem;
    }

    .md-auth-brand-card {
        width: 100%;
        min-width: 0;
        max-width: none;
        transform: none;
        padding: 0.85rem 0.85rem 0.9rem;
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.12);
    }

    .md-panel-left::after {
        inset: 0.9rem;
        border-radius: calc(var(--r-xl) - 6px);
        opacity: 0.45;
    }

    .md-auth-brand-preview {
        display: none;
    }

    .md-auth-brand-card-list {
        display: flex;
        flex-wrap: wrap;
        gap: 0.55rem;
        font-size: 0.82rem;
    }

    .md-auth-activity {
        --md-activity-line-height: 1.2rem;
        --md-activity-gap: 0.35rem;
        gap: 0.45rem;
    }

    .md-auth-activity-line {
        font-size: 0.82rem;
    }

        .md-auth-brand-card-list li {
            padding: 0.35rem 0.6rem;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.04);
            border: 1px solid rgba(255, 255, 255, 0.12);
        }

    .auth-panel--content {
        padding: 0;
        background: #ffffff;
    }

    .md-auth {
        width: min(var(--md-auth-max), 100%);
        margin: 0 auto;
        padding: 1.2rem 1.35rem 1.6rem;
    }

    .md-auth-title {
        font-size: 1.5rem;
        line-height: 2rem;
    }

    .md-auth-subtitle {
        font-size: 0.92rem;
    }

    .md-auth-secondary {
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }

    .md-auth-turnstile {
        justify-content: flex-start;
    }
}

.md-auth-mobile-bar {
    display: none;
}

@media (max-width: 1024px) and (orientation: portrait) {
    .auth-panel--brand {
        display: none;
    }

    .auth-card {
        grid-template-rows: 1fr;
    }
}

@media (max-width: 640px) {
    .auth-bg {
        display: none;
    }

    .auth-shell {
        min-height: 100svh;
        overflow: auto;
    }

    @supports (min-height: 100dvh) {
        .auth-shell {
            min-height: 100dvh;
        }
    }

    .auth-main {
        padding: 0;
        place-items: stretch;
    }

    .auth-panel--brand {
        display: none;
    }

    .auth-shell {
        background: #ffffff;
    }

    .auth-card {
        border-radius: 0;
        min-height: 100svh;
        height: 100svh;
        background: #ffffff;
        grid-template-rows: auto 1fr;
        display: flex;
        flex-direction: column;
        border: 0;
        overflow: hidden;
    }

    @supports (min-height: 100dvh) {
        .auth-card {
            min-height: 100dvh;
            height: 100dvh;
        }
    }

    .auth-panel--brand {
        padding: calc(1.25rem + env(safe-area-inset-top)) 1.25rem 0.95rem;
    }

    .md-auth-mobile-bar {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: calc(0.9rem + env(safe-area-inset-top)) 1rem 0.9rem;
        background: linear-gradient(160deg, #070f1f 0%, #0a162e 100%);
        border-bottom: 1px solid rgba(15, 23, 42, 0.1);
        position: sticky;
        top: 0;
        z-index: 5;
    }

    .md-auth-mobile-logo {
        height: 28px;
        width: auto;
    }

    .md-panel-left::after {
        inset: 0.7rem;
        border-radius: calc(var(--r-xl) - 8px);
    }

    .auth-panel--content {
        padding-bottom: env(safe-area-inset-bottom);
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .md-auth-brand-title {
        font-size: 1.35rem;
        line-height: 1.65rem;
    }

    .md-auth-brand-text {
        font-size: 0.95rem;
        line-height: 1.45;
    }

    .md-auth {
        width: 100%;
        margin: 0;
        padding: 0.8rem 1.05rem 1.2rem;
        min-height: 0;
    }

    .md-auth-header {
        margin-bottom: 3rem;
    }

    .md-auth-form {
        gap: 0.7rem;
    }

    .md-auth-field {
        gap: 0.4rem;
    }

    .md-auth-input {
        font-size: 16px;
        height: 50px;
    }

    .md-auth-label-row {
        flex-wrap: wrap;
        align-items: flex-start;
        row-gap: 0.3rem;
    }

    .md-auth-link {
        font-size: 0.82rem;
    }

    .md-auth-check {
        padding: 0.35rem 0.25rem;
        gap: 0.7rem;
    }

        .md-auth-check input[type="checkbox"] {
            width: 20px;
            height: 20px;
        }

    .md-auth-button {
        height: 52px;
    }

    .md-auth-secondary {
        flex-direction: row;
        align-items: center;
        gap: 0.4rem;
        justify-content: center;
        text-align: center;
    }

    .auth-form:not(.md-auth) {
        width: 100%;
        margin: 0;
        padding: 0.75rem 1.05rem 1.2rem;
        min-height: 0;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .auth-grid {
        gap: 0.6rem;
    }

    .auth-field label {
        font-size: 0.72rem;
    }

    .auth-input {
        height: 46px;
        font-size: 16px;
    }

    .auth-actions {
        margin-top: auto;
        flex-direction: column;
        align-items: stretch;
    }

    .auth-actions .auth-button {
        width: 100%;
        min-width: 0;
    }

    .auth-actions .auth-helper {
        text-align: center;
    }
}

@media (max-width: 380px) {
    .md-auth {
        padding: 0.7rem 0.95rem 1.1rem;
    }

    .md-auth-title {
        font-size: 1.35rem;
        line-height: 1.85rem;
    }

    .md-auth-brand-card-list {
        gap: 0.45rem;
    }

    .md-auth-activity {
        --md-activity-line-height: 1.1rem;
        --md-activity-gap: 0.3rem;
        gap: 0.4rem;
    }

    .md-auth-activity-line {
        font-size: 0.78rem;
    }
}