@media (max-width: 949px) {

    #grid-container {
        grid-template-columns: 1fr;
        max-width: 640px;
    }

    #main {
        padding: 1rem 1rem 8rem;
    }

    #aside {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: auto;
        height: auto;
        flex-direction: row;
        align-items: center;
        z-index: 1000;
        background-color: #FFFFFF;
        border-top: 1px solid var(--grey-white);
        box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
        padding: 0.6rem 1rem;
        overflow-y: visible;
    }

    .aside-expanded {
        display: none;
    }

    .aside-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        color: var(--grey-dark);
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
    }

    .aside-toggle .icon-close {
        display: none;
    }

    #aside:not(.is-expanded) {

        gap: 1rem;

        .aside-guest {
            flex-direction: row;
            flex: 1;
            margin-top: 0;
            padding: 0;
        }

        #live-user-status {
            display: flex;
            align-items: center;
            gap: 1rem;
            flex: 1;
            margin-top: 0;
        }

        .user-status-img {
            width: 30px;
        }

        .user-status-info {
            display: none;
        }

        .user-status-metrics {
            flex: 1;
            margin-top: 0;
            font-size: 1.3rem;
        }

        .user-status-xp {
            gap: 0.5rem;

            .progress-bar {
                height: 0.8rem;
            }
        }

        .user-status-energy {
            gap: 0.5rem;
            margin-top: 0.3rem;
        }

        .user-status-energy-icon {
            width: 1.6rem;
            height: 1.6rem;
        }
    }

    #aside.is-expanded {
        top: 0;
        bottom: 0;
        flex-direction: column;
        align-items: stretch;
        background-color: var(--blue-grey);
        border-top: none;
        box-shadow: none;
        padding: 1.5rem 1rem;
        overflow-y: auto;

        .aside-expanded {
            display: block;
        }

        .aside-header {
            order: -1;
        }

        .aside-toggle {
            order: -2;
            align-self: flex-end;
            margin-bottom: 0.5rem;

            .icon-open {
                display: none;
            }

            .icon-close {
                display: block;
            }
        }
    }
}

@media (min-width: 590px) {
    .big-order--1 {
        order: -1;
    }
}

@media (max-width: 589px) {
    .mini-f-column {
        flex-direction: column;
    }
    .mini-mb-1 {
        margin-bottom: 1rem;
    }
    .mini-mr-0 {
        margin-right: 0;
    }
    .mini-ml-0 {
        margin-left: 0;
    }
}

@media print {

    .illuminati-print {
        display: none !important;
        visibility: hidden !important;
    }

    #grid-container {
        grid-template-columns: 1fr;
    }

    #main {
        padding: 0;
    }
}