@utility syntax-light {
  /* Other */
  .x {
    color: var(--color-black-main);
  }
  /* Error */
  .err {
    color: var(--color-red-500);
  }
  /* CodeLine */
  .cl {
    color: var(--color-gray-700);
  }
  /* LineHighlight */
  .hl {
    min-width: fit-content;
    background-color: var(--color-blue-100);
  }
  .lntd:first-child .hl,
  & > .chroma > code > .hl {
    margin-left: -4px;
    border-left: 4px solid var(--color-blue-300);
  }
  /* LineNumbersTable */
  .lnt {
    white-space: pre;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
    color: var(--color-gray-400);
  }
  /* LineNumbers */
  .ln {
    white-space: pre;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
    color: var(--color-gray-400);
  }
  /* Line */
  .line {
    display: flex;
  }
  /* Keyword */
  .k {
    color: var(--color-yellow-700);
  }
  /* KeywordConstant */
  .kc {
    color: var(--color-violet-400);
  }
  /* KeywordDeclaration */
  .kd {
    color: var(--color-yellow-700);
  }
  /* KeywordNamespace */
  .kn {
    color: var(--color-yellow-700);
  }
  /* KeywordPseudo */
  .kp {
    color: var(--color-yellow-700);
  }
  /* KeywordReserved */
  .kr {
    color: var(--color-yellow-700);
  }
  /* KeywordType */
  .kt {
    color: var(--color-yellow-700);
  }
  /* Name */
  .n {
    color: var(--color-violet-400);
  }
  /* NameAttribute */
  .na {
    color: var(--color-yellow-700);
  }
  /* NameBuiltin */
  .nb {
    color: var(--color-yellow-800);
  }
  /* NameBuiltinPseudo */
  .bp {
    color: var(--color-violet-400);
  }
  /* NameClass */
  .nc {
    color: var(--color-black-main);
  }
  /* NameConstant */
  .no {
    color: var(--color-black-main);
  }
  /* NameDecorator */
  .nd {
    color: var(--color-violet-400);
  }
  /* NameEntity */
  .ni {
    color: var(--color-yellow-700);
  }
  /* NameException */
  .ne {
    color: var(--color-red-700);
  }
  /* NameFunction */
  .nf {
    color: var(--color-blue-500);
  }
  /* NameFunctionMagic */
  .fm {
    color: var(--color-blue-500);
  }
  /* NameLabel */
  .nl {
    color: var(--color-yellow-700);
  }
  /* NameNamespace */
  .nn {
    color: var(--color-black-main);
  }
  /* NameOther */
  .nx {
    color: var(--color-black-main);
  }
  /* NameProperty */
  .py {
    color: var(--color-black-main);
  }
  /* NameTag */
  .nt {
    color: var(--color-blue-400);
  }
  /* NameVariable */
  .nv {
    color: var(--color-black-main);
  }
  /* NameVariableClass */
  .vc {
    color: var(--color-violet-600);
  }
  /* NameVariableGlobal */
  .vg {
    color: var(--color-violet-600);
  }
  /* NameVariableInstance */
  .vi {
    color: var(--color-violet-600);
  }
  /* NameVariableMagic */
  .vm {
    color: var(--color-violet-600);
  }
  /* Literal */
  .l {
    color: var(--color-black-main);
  }
  /* LiteralDate */
  .ld {
    color: var(--color-black-main);
  }
  /* LiteralString */
  .s {
    color: var(--color-black-main);
  }
  /* LiteralStringAffix */
  .sa {
    color: var(--color-green-700);
  }
  /* LiteralStringBacktick */
  .sb {
    color: var(--color-green-700);
  }
  /* LiteralStringChar */
  .sc {
    color: var(--color-green-700);
  }
  /* LiteralStringDelimiter */
  .dl {
    color: var(--color-green-700);
  }
  /* LiteralStringDoc */
  .sd {
    color: #8f5902;
  }
  /* LiteralStringDouble */
  .s2 {
    color: var(--color-green-700);
  }
  /* LiteralStringEscape */
  .se {
    color: var(--color-black-main);
  }
  /* LiteralStringHeredoc */
  .sh {
    color: var(--color-green-700);
  }
  /* LiteralStringInterpol */
  .si {
    color: var(--color-green-700);
  }
  /* LiteralStringOther */
  .sx {
    color: var(--color-green-700);
  }
  /* LiteralStringRegex */
  .sr {
    color: var(--color-blue-500);
  }
  /* LiteralStringSingle */
  .s1 {
    color: var(--color-green-700);
  }
  /* LiteralStringSymbol */
  .ss {
    color: var(--color-green-700);
  }
  /* LiteralNumber */
  .m {
    color: var(--color-blue-500);
  }
  /* LiteralNumberBin */
  .mb {
    color: var(--color-blue-500);
  }
  /* LiteralNumberFloat */
  .mf {
    color: var(--color-blue-500);
  }
  /* LiteralNumberHex */
  .mh {
    color: var(--color-blue-500);
  }
  /* LiteralNumberInteger */
  .mi {
    color: var(--color-blue-500);
  }
  /* LiteralNumberIntegerLong */
  .il {
    color: var(--color-blue-500);
  }
  /* LiteralNumberOct */
  .mo {
    color: var(--color-blue-500);
  }
  /* Operator */
  .o {
    color: var(--color-blue-400);
  }
  /* OperatorWord */
  .ow {
    color: var(--color-yellow-700);
  }
  /* Punctuation */
  .p {
    color: var(--color-gray-400);
  }
  /* Comment */
  .c {
    color: var(--color-gray-400);
  }
  /* CommentHashbang */
  .ch {
    color: var(--color-gray-400);
  }
  /* CommentMultiline */
  .cm {
    color: var(--color-gray-400);
  }
  /* CommentSingle */
  .c1 {
    color: var(--color-gray-400);
  }
  /* CommentSpecial */
  .cs {
    color: var(--color-gray-400);
  }
  /* CommentPreproc */
  .cp {
    color: var(--color-gray-400);
  }
  /* CommentPreprocFile */
  .cpf {
    color: var(--color-gray-400);
  }
  /* Generic */
  .g {
    color: var(--color-black-main);
  }
  /* GenericDeleted */
  .gd {
    color: var(--color-red-500);
  }
  /* GenericEmph */
  .ge {
    color: var(--color-black-main);
  }
  /* GenericError */
  .gr {
    color: var(--color-red-500);
  }
  /* GenericHeading */
  .gh {
    color: var(--color-gray-600);
  }
  /* GenericInserted */
  .gi {
    color: var(--color-green-500);
  }
  /* GenericOutput */
  .go {
    color: var(--color-black-main);
  }
  /* GenericPrompt */
  .gp {
    user-select: none;
    color: var(--color-green-400);
  }
  /* GenericStrong */
  .gs {
    color: var(--color-black-main);
  }
  /* GenericSubheading */
  .gu {
    color: var(--color-gray-600);
  }
  /* GenericTraceback */
  .gt {
    color: var(--color-red-500);
  }
  /* GenericUnderline */
  .gl {
    color: var(--color-black-main);
    text-decoration: underline;
  }
  /* TextWhitespace */
  .w {
    color: var(--color-gray-100);
  }
}