@import "../chroma/dark.css";
@import "../codemirror/dark.css";
@import "../markup/dark.css";

/* Import Inter from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Inter+Mono:wght@400;500&display=swap');

/*
 * Use Forgejo's built-in font variables so the font preference propagates
 * correctly without stomping on Chroma / CodeMirror token styles.
 */
:root {
  --fonts-regular: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --fonts-monospace: 'Inter Mono', 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;
}

:root {
  /* ── Monokai Pro palette ──────────────────────────────────────────────────── */
  /* Background scale */
  --mk-bg-0:   #19181a;   /* deepest */
  --mk-bg-1:   #221f22;   /* base bg */
  --mk-bg-2:   #2d2a2e;   /* editor bg */
  --mk-bg-3:   #403e41;   /* selection / hover */
  --mk-bg-4:   #5b595c;   /* comments / subtle */
  --mk-bg-5:   #727072;   /* borders */

  /* Foreground scale */
  --mk-fg-0:   #fcfcfa;   /* primary text */
  --mk-fg-1:   #c9c7cd;   /* secondary text */
  --mk-fg-2:   #939293;   /* muted text */

  /* Monokai Pro accent colors */
  --mk-yellow:  #ffd866;
  --mk-orange:  #fc9867;
  --mk-red:     #ff6188;
  --mk-magenta: #ff6188;
  --mk-violet:  #ab9df2;
  --mk-blue:    #78dce8;
  --mk-cyan:    #78dce8;
  --mk-green:   #a9dc76;

  /* Darker/lighter accent variants */
  --mk-yellow-dark:  #e6bf45;
  --mk-yellow-light: #ffe799;
  --mk-orange-dark:  #e8804d;
  --mk-orange-light: #fdaa88;
  --mk-red-dark:     #e8406e;
  --mk-red-light:    #ff85a1;
  --mk-green-dark:   #8ec45c;
  --mk-green-light:  #bfe89c;
  --mk-blue-dark:    #55c8d8;
  --mk-blue-light:   #a0eaf3;
  --mk-violet-dark:  #9080e0;
  --mk-violet-light: #c4b8f7;

  /* ── Theme flag ───────────────────────────────────────────────────────────── */
  --is-dark-theme: true;

  /* ── Primary: Monokai yellow ──────────────────────────────────────────────── */
  --color-primary:           var(--mk-yellow);
  --color-primary-contrast:  #000;
  --color-primary-dark-1:    var(--mk-yellow-light);
  --color-primary-dark-2:    var(--mk-yellow-light);
  --color-primary-dark-3:    #ffefaa;
  --color-primary-dark-4:    #ffefaa;
  --color-primary-dark-5:    #fff7cc;
  --color-primary-dark-6:    #fff7cc;
  --color-primary-dark-7:    #fffae6;
  --color-primary-light-1:   var(--mk-yellow-dark);
  --color-primary-light-2:   #d0ac3a;
  --color-primary-light-3:   #b8962e;
  --color-primary-light-4:   #9e7f22;
  --color-primary-light-5:   #9e7f22;
  --color-primary-light-6:   #856918;
  --color-primary-light-7:   #856918;
  --color-primary-alpha-10:  #ffd86619;
  --color-primary-alpha-20:  #ffd86633;
  --color-primary-alpha-30:  #ffd8664b;
  --color-primary-alpha-40:  #ffd86666;
  --color-primary-alpha-50:  #ffd86680;
  --color-primary-alpha-60:  #ffd86699;
  --color-primary-alpha-70:  #ffd866b3;
  --color-primary-alpha-80:  #ffd866cc;
  --color-primary-alpha-90:  #ffd866e1;
  --color-primary-hover:     var(--color-primary-light-1);
  --color-primary-active:    var(--color-primary-light-2);

  /* ── Secondary: Monokai background greys ─────────────────────────────────── */
  --color-secondary:          var(--mk-bg-3);
  --color-secondary-dark-1:   var(--mk-bg-4);
  --color-secondary-dark-2:   var(--mk-bg-4);
  --color-secondary-dark-3:   var(--mk-bg-5);
  --color-secondary-dark-4:   var(--mk-bg-5);
  --color-secondary-dark-5:   var(--mk-fg-2);
  --color-secondary-dark-6:   var(--mk-fg-1);
  --color-secondary-dark-7:   var(--mk-fg-1);
  --color-secondary-dark-8:   var(--mk-fg-0);
  --color-secondary-dark-9:   var(--mk-fg-0);
  --color-secondary-dark-10:  var(--mk-fg-0);
  --color-secondary-dark-11:  var(--mk-fg-0);
  --color-secondary-dark-12:  var(--mk-fg-0);
  --color-secondary-dark-13:  var(--mk-fg-0);
  --color-secondary-light-1:  var(--mk-bg-3);
  --color-secondary-light-2:  var(--mk-bg-3);
  --color-secondary-light-3:  var(--mk-bg-2);
  --color-secondary-light-4:  var(--mk-bg-2);
  --color-secondary-alpha-10: #403e4119;
  --color-secondary-alpha-20: #403e4133;
  --color-secondary-alpha-30: #403e414b;
  --color-secondary-alpha-40: #403e4166;
  --color-secondary-alpha-50: #403e4180;
  --color-secondary-alpha-60: #403e4199;
  --color-secondary-alpha-70: #403e41b3;
  --color-secondary-alpha-80: #403e41cc;
  --color-secondary-alpha-90: #403e41e1;
  --color-secondary-hover:    var(--color-secondary-light-1);
  --color-secondary-active:   var(--color-secondary-light-2);

  /* ── Console colors ───────────────────────────────────────────────────────── */
  --color-console-fg:          var(--mk-fg-0);
  --color-console-fg-subtle:   var(--mk-fg-2);
  --color-console-bg:          var(--mk-bg-1);
  --color-console-border:      var(--mk-bg-3);
  --color-console-hover-bg:    #ffffff16;
  --color-console-active-bg:   var(--mk-bg-3);
  --color-console-menu-bg:     var(--mk-bg-3);
  --color-console-menu-border: var(--mk-bg-5);

  /* ── Semantic colors ──────────────────────────────────────────────────────── */
  --color-red:     var(--mk-red);
  --color-orange:  var(--mk-orange);
  --color-yellow:  var(--mk-yellow);
  --color-olive:   #8ec45c;
  --color-green:   var(--mk-green-dark);
  --color-teal:    #3ecfca;
  --color-blue:    var(--mk-blue);
  --color-violet:  var(--mk-violet);
  --color-purple:  #c39af4;
  --color-pink:    var(--mk-red-light);
  --color-brown:   #a47252;
  --color-grey:    var(--mk-bg-5);
  --color-black:   var(--mk-bg-0);

  /* light variants */
  --color-red-light:     var(--mk-red-light);
  --color-orange-light:  var(--mk-orange-light);
  --color-yellow-light:  var(--mk-yellow-light);
  --color-olive-light:   var(--mk-green-light);
  --color-green-light:   var(--mk-green-light);
  --color-teal-light:    var(--mk-blue-light);
  --color-blue-light:    var(--mk-blue-light);
  --color-violet-light:  var(--mk-violet-light);
  --color-purple-light:  #d5c5fa;
  --color-pink-light:    #ffaab8;
  --color-brown-light:   #c0917a;
  --color-grey-light:    var(--mk-fg-2);
  --color-black-light:   var(--mk-bg-2);

  /* dark 1 variants */
  --color-red-dark-1:     var(--mk-red-dark);
  --color-orange-dark-1:  var(--mk-orange-dark);
  --color-yellow-dark-1:  var(--mk-yellow-dark);
  --color-olive-dark-1:   #7ab048;
  --color-green-dark-1:   #7ab048;
  --color-teal-dark-1:    #2eb8b3;
  --color-blue-dark-1:    var(--mk-blue-dark);
  --color-violet-dark-1:  var(--mk-violet-dark);
  --color-purple-dark-1:  #a882ee;
  --color-pink-dark-1:    #ff4070;
  --color-brown-dark-1:   #94674a;
  --color-black-dark-1:   var(--mk-bg-1);

  /* dark 2 variants */
  --color-red-dark-2:     #d42c58;
  --color-orange-dark-2:  #d46838;
  --color-yellow-dark-2:  #c9a820;
  --color-olive-dark-2:   #6a9e3e;
  --color-green-dark-2:   #6a9e3e;
  --color-teal-dark-2:    #1ea29d;
  --color-blue-dark-2:    #3ab8cc;
  --color-violet-dark-2:  #8063cc;
  --color-purple-dark-2:  #9268e0;
  --color-pink-dark-2:    #e82058;
  --color-brown-dark-2:   #8c5e3a;
  --color-black-dark-2:   var(--mk-bg-0);

  /* ── ANSI / console colors ────────────────────────────────────────────────── */
  --color-ansi-black:          var(--mk-bg-2);
  --color-ansi-red:            var(--mk-red);
  --color-ansi-green:          var(--mk-green);
  --color-ansi-yellow:         var(--mk-yellow);
  --color-ansi-blue:           var(--mk-blue);
  --color-ansi-magenta:        var(--mk-violet);
  --color-ansi-cyan:           var(--mk-cyan);
  --color-ansi-white:          var(--mk-fg-1);
  --color-ansi-bright-black:   var(--mk-bg-4);
  --color-ansi-bright-red:     var(--mk-red-light);
  --color-ansi-bright-green:   var(--mk-green-light);
  --color-ansi-bright-yellow:  var(--mk-yellow-light);
  --color-ansi-bright-blue:    var(--mk-blue-light);
  --color-ansi-bright-magenta: var(--mk-violet-light);
  --color-ansi-bright-cyan:    var(--mk-blue-light);
  --color-ansi-bright-white:   var(--mk-fg-0);

  /* ── Misc special colors ──────────────────────────────────────────────────── */
  --color-gold:      var(--mk-yellow);
  --color-white:     #ffffff;
  --color-pure-black: #000000;

  /* diff colors */
  --color-diff-removed-word-bg:  #5c2035;
  --color-diff-added-word-bg:    #2a4a20;
  --color-diff-removed-row-bg:   #3d1726;
  --color-diff-moved-row-bg:     #4a3010;
  --color-diff-added-row-bg:     #1d3618;
  --color-diff-removed-row-border: #7a2040;
  --color-diff-moved-row-border:   #8a6020;
  --color-diff-added-row-border:   #3a6a28;
  --color-diff-inactive:           var(--mk-bg-3);

  /* status colors */
  --color-error-border:      #7a2040;
  --color-error-bg:          #4a1828;
  --color-error-bg-active:   #6a2038;
  --color-error-bg-hover:    #6a2038;
  --color-error-text:        #ffd0dc;
  --color-success-border:    #3a6a28;
  --color-success-bg:        #1d3618;
  --color-success-text:      var(--mk-green-light);
  --color-warning-border:    #8a6020;
  --color-warning-bg:        #4a3010;
  --color-warning-text:      var(--mk-yellow-light);
  --color-info-border:       #2a4880;
  --color-info-bg:           #1a2d58;
  --color-info-text:         var(--mk-blue-light);

  /* badges */
  --color-red-badge:            var(--mk-red);
  --color-red-badge-bg:         #ff618822;
  --color-red-badge-hover-bg:   #ff618844;
  --color-green-badge:          var(--mk-green);
  --color-green-badge-bg:       #a9dc7622;
  --color-green-badge-hover-bg: #a9dc7644;
  --color-yellow-badge:         var(--mk-yellow);
  --color-yellow-badge-bg:      #ffd86622;
  --color-yellow-badge-hover-bg:#ffd86644;
  --color-orange-badge:         var(--mk-orange);
  --color-orange-badge-bg:      #fc986722;
  --color-orange-badge-hover-bg:#fc986744;

  /* ── Thin element colors (octicons, text, borders) ───────────────────────── */
  --thin-lightness:           0.72;
  --regular-chroma:           0.17;
  --color-thin-green:   oklch(var(--thin-lightness) var(--regular-chroma) 145deg);
  --color-thin-red:     oklch(var(--thin-lightness) var(--regular-chroma) 27deg);
  --color-thin-purple:  oklch(var(--thin-lightness) var(--regular-chroma) 298deg);
  --color-thin-orange:  oklch(var(--thin-lightness) var(--regular-chroma) 41deg);

  --thin-lightness-highlight:    0.80;
  --color-thin-red-highlight: oklch(var(--thin-lightness-highlight) var(--regular-chroma) 27deg);

  --bg-lightness: 0.24;
  --bg-chroma:    0.06;
  --color-danger-bg: oklch(var(--bg-lightness) var(--bg-chroma) 27deg);

  /* ── Target-based / structural colors ────────────────────────────────────── */
  --color-body:                 var(--mk-bg-2);
  --color-box-header:           var(--mk-bg-3);
  --color-box-body:             #312e32;
  --color-box-body-highlight:   var(--mk-bg-3);
  --color-text-dark:            var(--mk-fg-0);
  --color-text:                 var(--mk-fg-0);
  --color-text-light:           var(--mk-fg-1);
  --color-text-light-1:         var(--mk-fg-1);
  --color-text-light-2:         var(--mk-fg-2);
  --color-text-light-3:         var(--mk-fg-2);
  --color-footer:               var(--mk-bg-1);
  --color-timeline:             var(--mk-bg-3);
  --color-input-text:           var(--mk-fg-0);
  --color-input-background:     var(--mk-bg-3);
  --color-input-toggle-background: var(--mk-bg-3);
  --color-input-border:         var(--mk-bg-4);
  --color-input-border-hover:   var(--mk-bg-5);
  --color-header-wrapper:       var(--mk-bg-1);
  --color-header-wrapper-transparent: #221f2200;
  --color-light:                #00000028;
  --color-light-mimic-enabled:  rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
  --color-light-border:         #ffffff1e;
  --color-hover:                var(--mk-bg-3);
  --color-active:               var(--mk-bg-4);
  --color-menu:                 var(--mk-bg-2);
  --color-card:                 var(--mk-bg-3);
  --fancy-card-bg:              var(--mk-bg-3);
  --fancy-card-border:          var(--mk-bg-4);
  --color-markup-table-row:     #fcfcfa08;
  --color-markup-code-block:    var(--mk-bg-2);
  --color-markup-code-inline:   var(--mk-bg-1);
  --color-button:               var(--mk-bg-3);
  --color-code-bg:              var(--mk-bg-2);
  --color-shadow:               #00000070;
  --color-secondary-bg:         var(--mk-bg-3);
  --color-text-focus:           var(--mk-fg-0);
  --color-expand-button:        var(--mk-bg-4);
  --color-placeholder-text:     var(--mk-fg-2);
  --color-editor-line-highlight: var(--mk-bg-3);
  --color-project-board-bg:     var(--mk-bg-2);
  --color-project-board-dark-label: var(--mk-fg-2);
  --color-caret:                var(--mk-fg-0);
  --color-reaction-bg:          #ffffff10;
  --color-reaction-active-bg:   var(--color-primary-alpha-30);
  --color-reaction-hover-bg:    var(--color-primary-alpha-40);
  --color-tooltip-text:         #ffffff;
  --color-tooltip-bg:           #0e0d0f;
  --color-nav-bg:               var(--mk-bg-1);
  --color-nav-hover-bg:         var(--mk-bg-3);
  --color-secondary-nav-bg:     var(--color-body);
  --color-label-text:           var(--mk-fg-0);
  --color-label-bg:             var(--mk-bg-3);
  --color-label-hover-bg:       var(--mk-bg-4);
  --color-label-active-bg:      var(--mk-bg-5);
  --color-label-bg-alt:         var(--mk-bg-4);
  --color-accent:               var(--mk-yellow);
  --color-small-accent:         var(--mk-yellow-dark);
  --color-highlight-fg:         var(--mk-yellow-dark);
  --color-highlight-bg:         var(--color-primary-alpha-20);
  --color-overlay-backdrop:     #0c0b0dc0;
  --color-selection-bg:         var(--mk-yellow);
  --color-selection-fg:         var(--mk-bg-0);

  /* checkerboard for image diff */
  --checkerboard-color-1: #3a3a3a;
  --checkerboard-color-2: #282828;

  /* presence indicators */
  --color-indicator-offline:     #727072;
  --color-indicator-offline-20:  #7270721a;
  --color-indicator-idle:        var(--mk-green);
  --color-indicator-idle-20:     #a9dc761a;
  --color-indicator-active:      var(--mk-blue);
  --color-indicator-active-20:   #78dce833;

  accent-color: var(--color-accent);
  color-scheme: dark;
}

/* ── Emoji invert (same as upstream dark theme) ─────────────────────────── */
.emoji[aria-label="check mark"],
.emoji[aria-label="currency exchange"],
.emoji[aria-label="TOP arrow"],
.emoji[aria-label="END arrow"],
.emoji[aria-label="ON! arrow"],
.emoji[aria-label="SOON arrow"],
.emoji[aria-label="heavy dollar sign"],
.emoji[aria-label="copyright"],
.emoji[aria-label="registered"],
.emoji[aria-label="trade mark"],
.emoji[aria-label="multiply"],
.emoji[aria-label="plus"],
.emoji[aria-label="minus"],
.emoji[aria-label="divide"],
.emoji[aria-label="curly loop"],
.emoji[aria-label="double curly loop"],
.emoji[aria-label="wavy dash"],
.emoji[aria-label="paw prints"],
.emoji[aria-label="musical note"],
.emoji[aria-label="musical notes"] {
  filter: invert(100%) hue-rotate(180deg);
}

/* ── Minor Fomantic/Semantic UI fixes ───────────────────────────────────── */
i.grey.icon.icon.icon.icon {
  color: var(--mk-bg-5) !important;
}

.ui.secondary.vertical.menu {
  border-radius: 0.28571429rem !important;
  overflow: hidden;
}

.ui.basic.primary.button.item {
  background-color: var(--color-active) !important;
  color: var(--color-text) !important;
  box-shadow: none !important;
}

.ui.red.label.notification_count,
.ui.primary.label,
.ui.primary.labels .label {
  background-color: var(--color-primary-light-3) !important;
}

.ui.labeled.icon.buttons > .button > .icon,
.ui.labeled.icon.button > .icon {
  background-color: var(--color-light) !important;
}

#review-box .review-comments-counter {
  background-color: var(--color-shadow) !important;
  color: var(--color-white) !important;
  margin-inline-start: 0.5em;
}

.ui.basic.labels .primary.label,
.ui.ui.ui.basic.primary.label {
  color: var(--color-text-dark) !important;
}

.ui.yellow.label.pending-label {
  color: var(--color-warning-text) !important;
}

/* ── Attention callout colors ───────────────────────────────────────────── */
strong.attention-important, svg.attention-important {
  color: var(--mk-violet-light);
}
strong.attention-note, svg.attention-note {
  color: var(--mk-blue-light);
}
strong.attention-caution, svg.attention-caution {
  color: var(--mk-red-light);
}

/* ── Basic red button states ────────────────────────────────────────────── */
.ui.basic.red.button {
  background-color: var(--mk-red-dark);
  color: var(--color-white);
}
.ui.basic.red.button:hover,
.ui.basic.red.button:focus {
  background-color: var(--color-red-dark-1);
  color: var(--color-white);
}
.ui.basic.red.button:active {
  background-color: var(--color-red-dark-2);
  color: var(--color-white);
}

/* ── Inter font settings ────────────────────────────────────────────────── */
/*
 * Forgejo picks up --fonts-regular / --fonts-monospace from :root above.
 * The body rule below is a belt-and-braces fallback and adds OT features.
 * No !important here — we must not override Chroma/CodeMirror token colors.
 */
body {
  font-family: var(--fonts-regular);
  font-feature-settings: "cv02", "cv03", "cv04", "cv11", "calt", "kern";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Monospace contexts — no !important, lets chroma token <span> colors through */
code, pre, kbd, samp,
.cm-editor, .cm-content,
.chroma,
.file-view .lines-code {
  font-family: var(--fonts-monospace);
  font-feature-settings: "calt", "kern";
}

/* Slightly tighter letter spacing on headings for Inter */
h1, h2, h3, h4, h5, h6,
.header {
  letter-spacing: -0.015em;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11", "calt", "kern";
}

/* ── Monokai Pro — Chroma syntax highlighting ───────────────────────────────
 * These rules appear after @import "../chroma/dark.css" in document order,
 * so they override that sheet without needing !important.
 * Token reference: https://github.com/alecthomas/chroma/blob/master/types.go
 *
 * Monokai Pro palette used:
 *   #fcfcfa  fg        #ff6188  red/keyword    #fc9867  orange/type
 *   #ffd866  yellow    #a9dc76  green/string   #78dce8  blue/number
 *   #ab9df2  violet    #727072  comment        #2d2a2e  bg
 * ─────────────────────────────────────────────────────────────────────────── */

/* Base / container */
.chroma                    { color: #fcfcfa; background-color: #2d2a2e; }
.chroma .lntable           { background-color: #2d2a2e; }
.chroma .lnt               { color: #5b595c; }          /* line number gutter */
.chroma .ln                { color: #5b595c; }
.chroma .hl                { background-color: #403e41; display: block; width: 100%; } /* highlighted line */

/* Comments */
.chroma .c   { color: #727072; font-style: italic; }    /* Comment */
.chroma .c1  { color: #727072; font-style: italic; }    /* CommentSingle */
.chroma .ch  { color: #727072; font-style: italic; }    /* CommentHashbang */
.chroma .cm  { color: #727072; font-style: italic; }    /* CommentMultiline */
.chroma .cs  { color: #ab9df2; font-style: italic; }    /* CommentSpecial */
.chroma .cp  { color: #fc9867; }                        /* CommentPreproc  — #include etc. */
.chroma .cpf { color: #a9dc76; }                        /* CommentPreprocFile — the path in #include */

/* Keywords */
.chroma .k   { color: #ff6188; }                        /* Keyword */
.chroma .kc  { color: #ab9df2; }                        /* KeywordConstant — true/false/nil */
.chroma .kd  { color: #ff6188; }                        /* KeywordDeclaration — var/let/const/func */
.chroma .kn  { color: #ff6188; }                        /* KeywordNamespace — import/package/using */
.chroma .kp  { color: #ff6188; }                        /* KeywordPseudo */
.chroma .kr  { color: #ff6188; }                        /* KeywordReserved */
.chroma .kt  { color: #fc9867; }                        /* KeywordType — int/string/bool */

/* Names */
.chroma .n   { color: #fcfcfa; }                        /* Name (generic) */
.chroma .na  { color: #a9dc76; }                        /* NameAttribute */
.chroma .nb  { color: #ffd866; }                        /* NameBuiltin — print/len/etc */
.chroma .bp  { color: #ffd866; }                        /* NameBuiltinPseudo — self/cls */
.chroma .nc  { color: #ffd866; }                        /* NameClass */
.chroma .nd  { color: #a9dc76; }                        /* NameDecorator */
.chroma .ne  { color: #ff6188; }                        /* NameException */
.chroma .nf  { color: #a9dc76; }                        /* NameFunction */
.chroma .fm  { color: #a9dc76; }                        /* NameFunctionMagic — __init__ etc */
.chroma .ni  { color: #ffd866; }                        /* NameEntity */
.chroma .nl  { color: #fc9867; }                        /* NameLabel */
.chroma .nn  { color: #ffd866; }                        /* NameNamespace */
.chroma .no  { color: #ab9df2; }                        /* NameConstant */
.chroma .nt  { color: #ff6188; }                        /* NameTag — HTML/XML tags */
.chroma .nv  { color: #fcfcfa; }                        /* NameVariable */
.chroma .vc  { color: #78dce8; }                        /* NameVariableClass */
.chroma .vg  { color: #78dce8; }                        /* NameVariableGlobal */
.chroma .vi  { color: #78dce8; }                        /* NameVariableInstance */
.chroma .vm  { color: #78dce8; }                        /* NameVariableMagic */
.chroma .nx  { color: #fcfcfa; }                        /* NameOther */
.chroma .py  { color: #fcfcfa; }                        /* NameProperty */

/* Literals — strings */
.chroma .s   { color: #ffd866; }                        /* LiteralString */
.chroma .s1  { color: #ffd866; }                        /* LiteralStringSingle */
.chroma .s2  { color: #ffd866; }                        /* LiteralStringDouble */
.chroma .sa  { color: #fc9867; }                        /* LiteralStringAffix — f"" b"" */
.chroma .sb  { color: #ffd866; }                        /* LiteralStringBacktick */
.chroma .sc  { color: #ffd866; }                        /* LiteralStringChar */
.chroma .dl  { color: #ffd866; }                        /* LiteralStringDelimiter */
.chroma .sd  { color: #727072; font-style: italic; }    /* LiteralStringDoc — docstrings */
.chroma .se  { color: #ff6188; }                        /* LiteralStringEscape — \n \t */
.chroma .sh  { color: #ffd866; }                        /* LiteralStringHeredoc */
.chroma .si  { color: #fc9867; }                        /* LiteralStringInterpol — ${} */
.chroma .sr  { color: #ab9df2; }                        /* LiteralStringRegex */
.chroma .ss  { color: #fc9867; }                        /* LiteralStringSymbol */
.chroma .sx  { color: #ffd866; }                        /* LiteralStringOther */

/* Literals — numbers */
.chroma .m   { color: #ab9df2; }                        /* LiteralNumber */
.chroma .mb  { color: #ab9df2; }                        /* LiteralNumberBin */
.chroma .mf  { color: #ab9df2; }                        /* LiteralNumberFloat */
.chroma .mh  { color: #ab9df2; }                        /* LiteralNumberHex */
.chroma .mi  { color: #ab9df2; }                        /* LiteralNumberInteger */
.chroma .il  { color: #ab9df2; }                        /* LiteralNumberIntegerLong */
.chroma .mo  { color: #ab9df2; }                        /* LiteralNumberOct */

/* Operators & punctuation */
.chroma .o   { color: #ff6188; }                        /* Operator — + - * / */
.chroma .ow  { color: #ff6188; }                        /* OperatorWord — and or not in */
.chroma .p   { color: #fcfcfa; }                        /* Punctuation — () {} [] , ; */

/* Generic (diffs, tracebacks, etc.) */
.chroma .g   { color: #fcfcfa; }
.chroma .gd  { color: #ff6188; background-color: #3d1726; }   /* GenericDeleted */
.chroma .gi  { color: #a9dc76; background-color: #1d3618; }   /* GenericInserted */
.chroma .ge  { font-style: italic; }                           /* GenericEmph */
.chroma .gs  { font-weight: bold; }                            /* GenericStrong */
.chroma .gh  { color: #ffd866; font-weight: bold; }            /* GenericHeading */
.chroma .gu  { color: #a9dc76; font-weight: bold; }            /* GenericSubheading */
.chroma .go  { color: #727072; }                               /* GenericOutput */
.chroma .gp  { color: #fc9867; font-weight: bold; }            /* GenericPrompt */
.chroma .gr  { color: #ff6188; }                               /* GenericError */
.chroma .gt  { color: #fc9867; }                               /* GenericTraceback */
.chroma .gl  { text-decoration: underline; }                   /* GenericUnderline */

/* Whitespace & error */
.chroma .w   { color: #5b595c; }                        /* TextWhitespace */
.chroma .err { /* intentionally unstyled — Chroma overuses this token */ }