@mdn/bob/editor/css/editor-libs/codemirror-override.css

Builder of Bits aka The MDN Web Docs interactive examples, example builder

/* Code Mirror editor rules */
.cm-editor {
  border: 1px solid var(--border-primary);
}

.cm-editor .cm-lineNumbers {
  color: var(--text-secondary);
}

.cm-editor .cm-lineNumbers .cm-gutterElement {
  padding: 0 3px 0 11px;
  min-width: 30px;
}

.cm-editor .cm-gutters {
  background: var(--background-secondary);
  border-right: 1px solid var(--border-primary);
}

.cm-editor .cm-scroller {
  line-height: inherit;
  font-family: var(--font-code);
}

.cm-editor .cm-cursor {
  border-color: var(--text-primary);
}

.cm-editor .cm-line::selection,
.cm-editor .cm-line ::selection {
  background-color: var(--selection-background-color) !important;
}
.cm-editor .cm-selectionBackground,
.cm-editor.cm-focused .cm-selectionBackground {
  background-color: initial;
}

/* Language specific rules */
.cm-operator,
.cm-variable {
  color: var(--code-token-default);
}

.cm-variable-2 {
  color: var(--code-token-variable-2);
}

.cm-pseudo-class {
  color: var(--code-token-pseudo-class);
}

.cm-bracket {
  color: var(--code-token-punctuation);
}
.cm-comment {
  color: var(--code-token-comment);
}

.cm-keyword,
.cm-tag {
  color: var(--code-token-tag);
}

.cm-attribute {
  color: var(--code-token-attribute-name);
}

.cm-string,
.cm-number,
.cm-atom {
  color: var(--code-token-attribute-value);
}

.cm-string-2 {
  color: var(--code-token-selector);
}

.cm-property {
  color: var(--code-token-attribute-name);
}

.cm-class-selector {
  color: var(--code-token-class-selector);
}

.cm-meta {
  color: var(--code-token-meta);
}

.cm-at-rule {
  color: var(--code-token-variable-2);
}