@media (max-width: 760px) {
    #file-distro-app {
        width: 100%;
        overflow-x: clip;
    }

    #file-distro-app .app-header {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        min-height: 0;
        gap: 8px;
        padding: max(8px, env(safe-area-inset-top)) 10px 8px;
    }

    #file-distro-app .brand {
        grid-row: 1;
        gap: 0;
    }

    #file-distro-app .brand-icon {
        width: 36px;
        height: 36px;
    }

    #file-distro-app .brand-wordmark {
        display: none;
    }

    #file-distro-app .app-header nav {
        grid-row: 1;
        grid-column: 2;
        min-width: 0;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 2px;
    }

    #file-distro-app .app-header nav a,
    #file-distro-app .link-button {
        display: inline-flex;
        min-height: 40px;
        align-items: center;
        padding: 0 7px;
        white-space: nowrap;
    }

    #file-distro-app .current-user {
        width: 28px;
        justify-content: center;
        font-size: 0;
    }

    #file-distro-app .current-user .fa-solid {
        font-size: 13px;
    }

    #file-distro-app .settings-button,
    #file-distro-app .logout-button {
        width: 40px;
        min-width: 40px;
        min-height: 40px;
    }

    #file-distro-app .header-status-slot {
        grid-row: 2;
        grid-column: 1 / -1;
        order: initial;
        width: 100%;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 6px;
        margin: 0;
        padding-bottom: 2px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    #file-distro-app .header-status-slot::-webkit-scrollbar {
        display: none;
    }

    #file-distro-app .header-status-badges {
        flex: 0 0 auto;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }

    #file-distro-app .storage-free-space,
    #file-distro-app .header-status-badge,
    #file-distro-app button.header-status-badge {
        height: 36px;
        min-height: 36px;
    }
}

@media (max-width: 480px) {
    #file-distro-app .app-header nav a,
    #file-distro-app .link-button {
        padding: 0 5px;
        font-size: 13px;
    }
}
