base.css

:root {
  --prism-scheme: light;

  /* Colors */
  --prism-foreground: #6e6e6e;
  --prism-background: #f4f4f4;

  /* Tokens */
  --prism-comment: #a8a8a8;
  --prism-string: #555555;
  --prism-literal: #333333;
  --prism-keyword: #000000;
  --prism-function: #4f4f4f;
  --prism-deleted: #333333;
  --prism-class: #333333;
  --prism-builtin: #757575;
  --prism-property: #333333;
  --prism-namespace: #4f4f4f;
  --prism-punctuation: #ababab;
  --prism-decorator: var(--prism-class);
  --prism-operator: var(--prism-punctuation);
  --prism-number: var(--prism-literal);
  --prism-boolean: var(--prism-literal);
  --prism-variable: var(--prism-literal);
  --prism-constant: var(--prism-literal);
  --prism-symbol: var(--prism-literal);
  --prism-interpolation: var(--prism-literal);
  --prism-selector: var(--prism-keyword);
  --prism-keyword-control: var(--prism-keyword);
  --prism-regex: var(--prism-string);
  --prism-json-property: var(--prism-property);
  --prism-inline-background: var(--prism-background);

  /* Token Styles */
  --prism-comment-style: italic;
  --prism-url-decoration: underline;

  /* Extension */
  --prism-line-number: #a5a5a5;
  --prism-line-number-gutter: #333333;
  --prism-line-highlight-background: #eeeeee;
  --prism-selection-background: #dddddd;
  --prism-marker-color: var(--prism-foreground);
  --prism-marker-opacity: 0.4;
  --prism-marker-font-size: 0.8em;

  /* Font */
  --prism-font-size: 1em;
  --prism-line-height: 1.5em;
  --prism-font-family: monospace;
  --prism-inline-font-size: var(--prism-font-size);
  --prism-block-font-size: var(--prism-font-size);

  /* Sizing */
  --prism-tab-size: 2;

  --prism-block-padding-x: 1em;
  --prism-block-padding-y: 1em;
  --prism-block-margin-x: 0;
  --prism-block-margin-y: 0.5em;
  --prism-block-radius: 0.3em;
  --prism-inline-padding-x: 0.3em;
  --prism-inline-padding-y: 0.1em;
  --prism-inline-radius: 0.3em;
}

div[class*='language-'],
pre[class*='language-'],
code[class*='language-'] {
  font-size: var(--prism-font-size);
  font-family: var(--prism-font-family);
  direction: ltr;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  line-height: var(--prism-line-height);
  -moz-tab-size: var(--prism-tab-size);
  -o-tab-size: var(--prism-tab-size);
  tab-size: var(--prism-tab-size);
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  color: var(--prism-foreground) !important;
}

/* Code blocks */
div[class*='language-'],
pre[class*='language-'] {
  font-size: var(--prism-block-font-size);
  padding: var(--prism-block-padding-y) var(--prism-block-padding-x);
  margin: var(--prism-block-margin-y) var(--prism-block-margin-x);
  border-radius: var(--prism-block-radius);
  overflow: auto;
  background: var(--prism-background);
}

/* Inline code */
:not(pre) > code[class*='language-'] {
  font-size: var(--prism-inline-font-size);
  padding: var(--prism-inline-padding-y) var(--prism-inline-padding-x);
  border-radius: var(--prism-inline-radius);
  background: var(--prism-inline-background);
}

/* Selection */
pre[class*='language-']::-moz-selection,
pre[class*='language-'] ::-moz-selection,
code[class*='language-']::-moz-selection,
code[class*='language-'] ::-moz-selection {
  background: var(--prism-selection-background);
}

pre[class*='language-']::selection,
pre[class*='language-'] ::selection,
code[class*='language-']::selection,
code[class*='language-'] ::selection {
  background: var(--prism-selection-background);
}

/* Tokens */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: var(--prism-comment);
  font-style: var(--prism-comment-style);
}

.token.namespace {
  color: var(--prism-namespace);
}

.token.interpolation {
  color: var(--prism-interpolation);
}

.token.string {
  color: var(--prism-string);
}

.token.punctuation {
  color: var(--prism-punctuation);
}

.token.operator {
  color: var(--prism-operator);
}

.token.keyword.module,
.token.keyword.control-flow {
  color: var(--prism-keyword-control);
}

.token.url,
.token.symbol,
.token.inserted {
  color: var(--prism-symbol);
}

.token.constant {
  color: var(--prism-constant);
}

.token.string.url {
  text-decoration: var(--prism-url-decoration);
}

.token.boolean,
.language-json .token.boolean {
  color: var(--prism-boolean);
}

.token.number,
.language-json .token.number {
  color: var(--prism-number);
}

.token.variable {
  color: var(--prism-variable);
}

.token.keyword {
  color: var(--prism-keyword);
}

.token.atrule,
.token.attr-value,
.token.selector {
  color: var(--prism-selector);
}

.token.function {
  color: var(--prism-function);
}

.token.deleted {
  color: var(--prism-deleted);
}

.token.important,
.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token.class-name {
  color: var(--prism-class);
}

.token.tag,
.token.builtin {
  color: var(--prism-builtin);
}

.token.attr-name,
.token.property,
.token.entity {
  color: var(--prism-property);
}

.language-json .token.property {
  color: var(--prism-json-property);
}

.token.regex {
  color: var(--prism-regex);
}

.token.decorator,
.token.annotation {
  color: var(--prism-decorator);
}

/* overrides color-values for the Line Numbers plugin
 * http://prismjs.com/plugins/line-numbers/
 */
.line-numbers .line-numbers-rows {
  border-right-color: var(--prism-line-number);
}

.line-numbers-rows > span:before {
  color: var(--prism-line-number-gutter);
}

/* overrides color-values for the Line Highlight plugin
  * http://prismjs.com/plugins/line-highlight/
  */
.line-highlight {
  background: var(--prism-line-highlight-background);
}