.arx-syntax,
.arx-syntax-ln {
    display: block;
    overflow-x: auto;
    font-family: 'JetBrains Mono', 'Courier New', monospace;
    font-size: 0.82rem;
    line-height: 1.65;
    tab-size: 4;
    color: #a8bfcc;
    background: #111820;
    border: 1px solid #1c2a3a;
    border-radius: 0.375rem;
    padding: 1rem 1.25rem;
    white-space: pre;
    margin: 0;
}

.arx-syn-ln {
    display: inline-block;
    width: 2.5em;
    min-width: 2.5em;
    margin-right: 1em;
    padding-right: 0.75em;
    text-align: right;
    color: #3d5568;
    opacity: 0.5;
    user-select: none;
    -webkit-user-select: none;
    pointer-events: none;
    border-right: 1px solid #1c2a3a;
}

.arx-syntax-wrap {
    position: relative;
    display: block;
    margin: 1rem 0;
}

.arx-syn-copy {
    position: absolute;
    top: 0.4rem;
    right: 0.5rem;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.55rem;
    font-family: 'JetBrains Mono', 'Courier New', monospace;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #3d5568;
    background: #0c1017;
    border: 1px solid #1c2a3a;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: opacity 0.15s, color 0.15s, background 0.15s, border-color 0.15s;
}

.arx-syn-copy:hover {
    color: #a8bfcc;
    border-color: #3d5568;
}

.arx-syn-copy.copied {
    color: #00e87a;
    border-color: #00e87a;
    opacity: 1;
}

.arx-syn-keyword  { color: #c792ea; font-style: normal; }
.arx-syn-builtin  { color: #82aaff; }
.arx-syn-string   { color: #c3e88d; }
.arx-syn-number   { color: #f78c6c; }
.arx-syn-comment  { color: #546e7a; font-style: italic; }
.arx-syn-boolean  { color: #ff5370; }
.arx-syn-tag      { color: #89ddff; }
.arx-syn-attr     { color: #c792ea; }
.arx-syn-entity   { color: #89ddff; }
.arx-syn-doctype  { color: #ffcb6b; }
.arx-syn-selector { color: #ffcb6b; }
.arx-syn-property { color: #82aaff; }
.arx-syn-pseudo   { color: #c792ea; }
.arx-syn-punct    { color: #89ddff; }
.arx-syn-atrule   { color: #c792ea; }
.arx-syn-regex    { color: #c3e88d; }
.arx-syn-variable { color: #f07178; }
.arx-syn-flag     { color: #ffcb6b; }