/* Mobile fit for the onboarding tour — keeps it within the viewport so users
   never have to scroll inside the modal. Loaded after Chatbot_UI.css so these
   rules win at equal specificity. Desktop is untouched. */

@media (max-width: 900px) {
    .onboarding-shell {
        max-height: calc(var(--app-height, 100dvh) - 1rem);
        padding: 0.7rem;
        gap: 0.6rem;
    }

    .onboard-card {
        gap: 0.6rem;
    }

    /* Step 2: copy first, quota design underneath, nav pinned last. */
    .onboard-card[data-step="2"] .onboard-copy {
        display: contents;
    }

    .onboard-card[data-step="2"] .onboard-copy > * {
        order: 1;
    }

    .onboard-card[data-step="2"] .onboard-stage {
        order: 2;
    }

    .onboard-card[data-step="2"] .onboard-nav {
        order: 3;
        margin-top: 0.2rem;
    }

    .onboard-stage {
        min-height: 190px;
    }

    .onboard-copy {
        gap: 0.55rem;
        padding: 0.15rem 0.1rem 0.25rem;
    }
}

@media (max-width: 640px) {
    .onboarding-swiper {
        padding: 0.45rem;
    }

    .onboarding-kicker,
    .onboarding-chips {
        display: none;
    }

    .onboarding-header {
        padding: 0.2rem 2.4rem 0 0.1rem;
    }

    .onboarding-shell-title {
        font-size: 1.25rem;
    }

    .onboarding-shell-desc {
        font-size: 0.88rem;
        line-height: 1.4;
    }

    .onboard-stage {
        min-height: 128px;
        padding: 0.55rem;
    }

    .onboard-copy {
        gap: 0.45rem;
        padding: 0.1rem 0.1rem 0.2rem;
    }

    .onboard-step-badge {
        padding: 0.24rem 0.55rem;
        font-size: 0.66rem;
    }

    .onboard-title {
        font-size: 1.1rem;
    }

    .onboard-desc {
        font-size: 0.84rem;
        line-height: 1.38;
    }

    .onboard-points {
        gap: 0.4rem;
    }

    .onboard-point {
        padding: 0.45rem 0.55rem;
        border-radius: 14px;
    }

    .onboard-point strong {
        font-size: 0.82rem;
    }

    .onboard-point span {
        font-size: 0.78rem;
        line-height: 1.35;
    }

    .onboard-nav {
        gap: 0.5rem;
        padding-top: 0.1rem;
    }

    .onboard-btn {
        width: 2.4rem;
        height: 2.4rem;
    }

    .onboard-dot {
        width: 0.6rem;
        height: 0.6rem;
    }
}