@media (max-width: 800px) {
    .site-nav {
        margin-bottom: 28px;
    }

    .nav-inner {
        width: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: center;
        gap: 8px 6px;
        padding: 10px max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left));
    }

    .nav-left {
        display: contents;
    }

    .nav-brand {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
        font-size: 1.08rem;
    }

    .nav-github,
    .nav-discord {
        grid-row: 1;
        min-height: 34px;
        box-sizing: border-box;
        justify-content: center;
        margin: 0;
        padding: 6px 9px;
        font-size: 0.68rem;
        letter-spacing: 0.04em;
    }

    .nav-github { grid-column: 2; }
    .nav-discord { grid-column: 3; }

    .nav-links {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        min-width: 0;
        flex-wrap: nowrap;
        gap: 22px;
        padding: 9px 1px 10px;
        overflow-x: auto;
        overflow-y: hidden;
        border-top: 1px solid rgba(255, 255, 255, 0.055);
        scrollbar-width: none;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .nav-links::-webkit-scrollbar {
        display: none;
    }

    .nav-link {
        flex: 0 0 auto;
        min-height: 30px;
        display: inline-flex;
        align-items: center;
        box-sizing: border-box;
        font-size: 0.75rem;
        scroll-snap-align: start;
    }
}

@media (max-width: 600px) {
    body {
        padding: 12px;
    }

    .site-nav {
        margin: -12px -12px 26px;
    }

    header:not(.site-nav) {
        margin-top: 8px;
        margin-bottom: 30px;
    }

    .main-layout {
        gap: 14px;
    }

    .card {
        min-width: 0;
        padding: 17px;
    }

    .card-header {
        margin-bottom: 18px;
        font-size: 0.96rem;
    }

    .row {
        flex-direction: column;
        gap: 0;
    }

    input[type="text"],
    input[type="password"],
    input[type="number"],
    textarea {
        min-width: 0;
        font-size: 16px;
    }

    .primary-btn,
    .danger-btn {
        min-height: 46px;
        padding: 13px;
    }

    .discord-mockup,
    .telegram-mockup,
    .results-mockup {
        min-width: 0;
        padding: 12px;
    }

    .discord-msg {
        min-width: 0;
        gap: 10px;
    }

    .discord-msg > div,
    .file-info,
    .tg-bubble {
        min-width: 0;
    }

    .file-attachment {
        max-width: 100%;
    }

    .email-item {
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 11px 12px;
        overflow-wrap: anywhere;
    }

    .status-console {
        padding: 12px;
        font-size: 0.72rem;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 380px) {
    .nav-brand {
        font-size: 1rem;
    }

    .nav-github,
    .nav-discord {
        padding-right: 7px;
        padding-left: 7px;
        font-size: 0.64rem;
    }
}
