    @media (max-width: 400px) {
        html.is-datanav,
        html.is-datanav body {
            width: 100% !important;
            height: 100dvh !important;
            min-height: 100dvh !important;
            margin: 0 !important;
            overflow: hidden !important;
        }

        html.is-datanav #main-wrapper {
            display: block !important;
            width: 100vw !important;
            height: 100dvh !important;
            min-height: 100dvh !important;
            overflow: hidden !important;
        }

        html.is-datanav .left-sidebar,
        html.is-datanav .left-sidebar:hover {
            position: fixed !important;
            inset: 0 auto 0 0 !important;
            width: 70px !important;
            min-width: 70px !important;
            max-width: 70px !important;
            height: 100dvh !important;
            transform: none !important;
            overflow: hidden !important;
            z-index: 3001 !important;
        }

        html.is-datanav .brand-logo {
            justify-content: center !important;
            padding: 8px 0 !important;
        }

        html.is-datanav #sidebarnav .sidebar-link {
            justify-content: center !important;
            padding: 9px 8px !important;
            gap: 0 !important;
        }

        html.is-datanav #sidebarnav .hide-menu,
        html.is-datanav #sidebarnav .nav-small-cap .hide-menu {
            display: none !important;
        }

        html.is-datanav .page-wrapper {
            margin-left: 70px !important;
            width: calc(100vw - 70px) !important;
            min-height: 100dvh !important;
        }

        html.is-datanav .topbar {
            left: 70px !important;
            width: calc(100vw - 70px) !important;
        }

        html.is-datanav .global-login:not(.u-hidden) {
            inset: 0 !important;
            width: 100vw !important;
            height: 100dvh !important;
            min-height: 100dvh !important;
            padding: 0 !important;
            align-items: stretch !important;
            justify-content: stretch !important;
            overflow: auto !important;
            scrollbar-width: none !important;
        }

        html.is-datanav .global-login:not(.u-hidden)::-webkit-scrollbar {
            display: none !important;
        }

        html.is-datanav .global-login__inner,
        html.is-datanav .global-login__content {
            width: 100% !important;
            max-width: none !important;
            min-height: 100dvh !important;
            border-radius: 0 !important;
            box-sizing: border-box !important;
        }
    }html.is-datanav .brand-logo {
        justify-content: center !important;
        padding: 8px 0 !important;
    }

    html.is-datanav .left-sidebar .brand-logo .logo-img.sb-workspace {
        width: 40px !important;
        max-width: 40px !important;
        margin: 0 auto !important;
        padding: 4px !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

    html.is-datanav .sb-workspace-mark {
        width: 32px !important;
        height: 32px !important;
        flex-basis: 32px !important;
    }

    html.is-datanav .brand-logo .logo-img img.dark-logo,
    html.is-datanav .brand-logo .logo-img img.light-logo {
        content: url("/images/logo-icon.svg") !important;
        width: 32px !important;
        height: 32px !important;
        object-fit: contain !important;
        border-radius: 8px !important;
    }

    html.is-datanav .brand-logo .logo-img img.dark-logo {
        display: none !important;
    }

    html.is-datanav .brand-logo .logo-img img.light-logo {
        display: block !important;
    }

    html.is-datanav #headerCollapse,
    html.is-datanav .left-sidebar .sidebartoggler {
        display: none !important;
    }
