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

.dark .token.module,
.dark .token.attr-name,
.dark .token.keyword,
.dark .token.rule,
.dark .token.pseudo-class,
.dark .token.important {
  color: #cb5fde;
}

.dark .token.comment,
.dark .token.operator,
.dark .token.combinator {
  color: var(--color-slate-400);
}

.dark .token.punctuation,
.dark .token.attr-equals {
  color: var(--color-slate-500);
}

.dark .token.attr-value,
.dark .token.class,
.dark .token.string {
  color: #89ca6c;
}

.dark .token.property,
.dark .token.tag {
  color: #e3596f;
}

.dark .token.function-variable {
  color: #61afef;
}

/** Light mode */

.token.attr-value,
.token.class,
.token.string {
  color: #50a14f;
}

.token.function-variable,
.token.generic-function,
.token.function {
  color: #4078f2;
}

.token.module,
.token.keyword,
.token.rule,
.token.pseudo-class,
.token.important {
  color: #a626a4;
}

.token.property,
.token.tag,
.token.constant {
  color: #e55649;
}

.token.generic,
.token.attr-name,
.token.entity,
.token.boolean,
.token.number,
.token.class-name {
  color: #c18401;
}

.token.comment,
.token.combinator {
  color: #a0a1a7;
}
.token.operator,
.token.builtin {
  color: #0184bc;
}