@media (max-width: 1200px) {
    body.to-auth-page .to-auth-shell {
        width: min(1080px, calc(100% - 32px));
        gap: 24px;
    }

    body.to-auth-page .to-auth-card {
        padding: 30px;
    }

    body.to-auth-page .to-auth-aside__inner {
        padding: 36px;
    }
}

@media (max-width: 1080px) {
    body.to-auth-page .to-auth-shell {
        width: min(720px, calc(100% - 28px));
        min-height: auto;
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 32px 0;
    }

    body.to-auth-page .to-auth-panel,
    body.to-auth-page .to-auth-aside {
        width: 100%;
    }

    body.to-auth-page .to-auth-aside__inner {
        min-height: auto;
    }

    body.to-auth-page .to-auth-card__title {
        font-size: clamp(26px, 5vw, 36px);
    }

    body.to-auth-page .to-auth-aside__title {
        font-size: clamp(24px, 5vw, 34px);
    }
}

@media (max-width: 840px) {
    body.to-auth-page .to-auth-shell {
        width: min(100% - 28px, 640px);
        gap: 22px;
        padding: 28px 0;
    }

    body.to-auth-page .to-auth-brand {
        margin-bottom: 18px;
    }

    body.to-auth-page .to-auth-brand__link {
        max-width: 100%;
    }

    body.to-auth-page .to-auth-card,
    body.to-auth-page .to-auth-aside__inner {
        border-radius: 24px;
    }

    body.to-auth-page .to-auth-card {
        padding: 28px 24px;
    }

    body.to-auth-page .to-auth-aside__inner {
        padding: 30px 24px;
    }

    body.to-auth-page .to-auth-form {
        gap: 16px;
    }

    body.to-auth-page .to-auth-steps {
        gap: 12px;
    }
}

@media (max-width: 680px) {
    body.to-auth-page {
        background:
            radial-gradient(circle at top right, rgba(255, 102, 0, 0.14), transparent 36%),
            linear-gradient(180deg, #ffffff 0%, var(--to-auth-bg) 100%);
    }

    body.to-auth-page .to-auth-shell {
        width: min(100% - 22px, 540px);
        gap: 20px;
        padding: 22px 0;
    }

    body.to-auth-page .to-auth-brand__link {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    body.to-auth-page .to-auth-brand__content {
        min-width: 0;
    }

    body.to-auth-page .to-auth-brand__mark {
        width: 42px;
        min-width: 42px;
        height: 42px;
        border-radius: 14px;
        font-size: 21px;
    }

    body.to-auth-page .to-auth-brand__title {
        font-size: 16px;
    }

    body.to-auth-page .to-auth-brand__subtitle {
        font-size: 12px;
    }

    body.to-auth-page .to-auth-card,
    body.to-auth-page .to-auth-aside__inner {
        padding: 24px 18px;
        border-radius: 22px;
    }

    body.to-auth-page .to-auth-card__header {
        margin-bottom: 20px;
    }

    body.to-auth-page .to-auth-card__eyebrow,
    body.to-auth-page .to-auth-aside__eyebrow {
        font-size: 12px;
    }

    body.to-auth-page .to-auth-card__title {
        font-size: 25px;
        line-height: 1.55;
    }

    body.to-auth-page .to-auth-card__description {
        font-size: 14px;
        line-height: 2;
    }

    body.to-auth-page .to-auth-alert {
        padding: 13px 14px;
        font-size: 13px;
    }

    body.to-auth-page .to-auth-field__label {
        font-size: 13px;
    }

    body.to-auth-page .to-auth-field__control {
        height: 50px;
        min-height: 50px;
        padding-right: 14px;
        padding-left: 14px;
        font-size: 15px;
    }

    body.to-auth-page .to-auth-button {
        min-height: 50px;
        padding: 11px 16px;
        font-size: 14px;
    }

    body.to-auth-page .to-auth-options {
        align-items: flex-start;
        flex-direction: column;
    }

    body.to-auth-page .to-auth-card__footer {
        align-items: center;
        flex-direction: column;
        text-align: center;
    }

    body.to-auth-page .to-auth-secure-note {
        padding: 15px;
    }

    body.to-auth-page .to-auth-secure-note__value {
        justify-content: center;
        text-align: center;
        font-size: 17px;
    }

    body.to-auth-page .to-auth-aside__title {
        font-size: 24px;
        line-height: 1.65;
    }

    body.to-auth-page .to-auth-steps {
        margin-top: 22px;
    }

    body.to-auth-page .to-auth-steps__item {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
        border-radius: 16px;
    }

    body.to-auth-page .to-auth-steps__number {
        width: 38px;
        height: 38px;
        border-radius: 13px;
        font-size: 14px;
    }

    body.to-auth-page .to-auth-steps__text {
        font-size: 13px;
    }
}

@media (max-width: 520px) {
    body.to-auth-page .to-auth-shell {
        width: min(100% - 18px, 480px);
        padding: 18px 0;
    }

    body.to-auth-page .to-auth-brand__link {
        flex-direction: column;
        gap: 10px;
    }

    body.to-auth-page .to-auth-brand__content {
        align-items: center;
    }

    body.to-auth-page .to-auth-card,
    body.to-auth-page .to-auth-aside__inner {
        padding: 22px 16px;
        border-radius: 20px;
    }

    body.to-auth-page .to-auth-card__title {
        font-size: 23px;
    }

    body.to-auth-page .to-auth-card__description {
        font-size: 13.5px;
    }

    body.to-auth-page .to-auth-field {
        gap: 7px;
    }

    body.to-auth-page .to-auth-field__hint,
    body.to-auth-page .to-auth-field__error {
        font-size: 12px;
    }

    body.to-auth-page .to-auth-check {
        align-items: flex-start;
    }

    body.to-auth-page .to-auth-check__input {
        margin-top: 4px;
    }

    body.to-auth-page .to-auth-alert__list {
        padding-right: 16px;
    }

    body.to-auth-page .to-auth-secure-note__value {
        font-size: 16px;
    }

    body.to-auth-page .to-auth-steps__item {
        align-items: flex-start;
    }
}

@media (max-width: 390px) {
    body.to-auth-page .to-auth-shell {
        width: min(100% - 14px, 360px);
    }

    body.to-auth-page .to-auth-card,
    body.to-auth-page .to-auth-aside__inner {
        padding: 20px 14px;
    }

    body.to-auth-page .to-auth-card__title {
        font-size: 21px;
    }

    body.to-auth-page .to-auth-aside__title {
        font-size: 22px;
    }

    body.to-auth-page .to-auth-field__control {
        font-size: 14px;
    }

    body.to-auth-page .to-auth-button {
        font-size: 13.5px;
    }
}

@media (hover: none) and (pointer: coarse) {
    body.to-auth-page .to-auth-button:hover,
    body.to-auth-page .to-auth-button--primary:hover,
    body.to-auth-page .to-auth-button--secondary:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.to-auth-page *,
    body.to-auth-page *::before,
    body.to-auth-page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}