.wp-block-code.mql-code {
    margin: 1.5rem 0;
    overflow-x: auto;
    border: 1px solid #263449;
    border-radius: 12px;
    background: #111827 !important;
    box-shadow: 0 8px 24px rgb(15 23 42 / 10%);
    color: #e2e8f0;
    -webkit-overflow-scrolling: touch;
}

.wp-block-code.mql-code code {
    display: block;
    min-width: max-content;
    padding: 1.1rem 1.25rem;
    color: inherit;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: .9rem;
    line-height: 1.7;
    tab-size: 4;
    white-space: pre;
}

.wp-block-code.mql-code .mql-comment { color: #94a3b8; font-style: italic; }
.wp-block-code.mql-code .mql-keyword { color: #93c5fd; font-weight: 650; }
.wp-block-code.mql-code .mql-type { color: #67e8f9; }
.wp-block-code.mql-code .mql-function { color: #c4b5fd; }
.wp-block-code.mql-code .mql-string { color: #86efac; }
.wp-block-code.mql-code .mql-number { color: #fbbf24; }
.wp-block-code.mql-code .mql-constant { color: #fdba74; }
.wp-block-code.mql-code .mql-preprocessor { color: #f0abfc; }
.wp-block-code.mql-code .mql-operator { color: #fda4af; }

@media (max-width: 600px) {
    .wp-block-code.mql-code {
        margin-inline: -0.25rem;
        border-radius: 9px;
    }

    .wp-block-code.mql-code code {
        padding: .9rem 1rem;
        font-size: .82rem;
    }
}