.toolbar {
    font-size: 1.25em;
    background-color: hsl(0 0 15);
    border-radius: 0.5em;
    cursor: pointer;
    flex-wrap: wrap;
    flex-shrink: 0;
    
    @media (width <= 800px) {
        overflow: scroll;
        scrollbar-width: none;
        flex-wrap: nowrap;

        &:has(~ .keyboard.active) {
            bottom: 11rem;
        }

        & > .tool {
            &[data-tool="keyboard-off"] {
                display: flex !important;
                position: sticky;
                right: 0px;
                background-color: hsl(0 0 15);
                margin: 0;
                padding: 0.8em;
                border-radius: 0;
            }
        }
    }
    
    & > .tool {
        margin: 0.3em 0em;
        margin-left: 0.3em;

        &[data-tool="keyboard-off"] { display: none; }
    }
}