code[class*='language-'] {
  color: var(--foreground-1);

  .token {
    &.cdata,
    &.comment,
    &.doctype,
    &.prolog {
      color: var(--dark-gray-3);
    }

    &.punctuation {
      color: var(--dark-accent-5);
    }

    &.namespace {
      opacity: 0.7;
    }

    &.boolean,
    &.constant,
    &.deleted,
    &.number,
    &.property,
    &.symbol,
    &.tag {
      color: var(--dark-accent-7);
    }

    &.attr-name,
    &.builtin,
    &.char,
    &.inserted,
    &.selector,
    &.string {
      color: var(--dark-accent-4);
    }

    &.entity,
    &.operator,
    &.url {
      color: var(--dark-accent-5);
    }

    &.atrule,
    &.attr-value,
    &.keyword {
      color: var(--dark-accent-5);
    }

    &.class-name,
    &.function {
      color: var(--dark-accent-6);
    }

    &.important,
    &.regex,
    &.variable {
      color: var(--dark-accent-6);
    }

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

    &.italic {
      font-style: italic;
    }

    &.entity {
      cursor: help;
    }
  }
}

.language-css .token.string,
.style .token.string {
  color: var(--dark-accent-5);
}