.dk-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.dk-ar { display: none; }

html[data-theme="mono"] .dk-ar { display: inline; stroke: none; mask: url(#dk-fade); opacity: .55; }
html[data-theme="mono"] .s1 .dk-ar, html[data-theme="mono"] .spark .dk-ar { fill: var(--accent); }
html[data-theme="mono"] .spark .dk-ar { mask: url(#dk-fade-sm); }
html[data-theme="mono"] .ser:not(.s1) .dk-ar { display: none; }
html[data-theme="mono"] .dc-svg .dk-ar { fill: var(--ink-2); }

html[data-theme="mono"] .dc-area { mask: url(#dk-fade); stroke: none; }
html[data-theme="mono"] .dc-svg .dc-sp-area, html[data-theme="mono"] .sn-svg.spark .ar { fill: var(--ink-2); mask: url(#dk-fade-sm); opacity: .6; }

html[data-theme="mono"] :is(
  .dc-bar:not(.dc-hb),
  .dc-svg [class*="seg-"]:not(.seg-empty),
  .an-svg .seg, .an-svg .arc, .an-svg.hist .bar,
  .rpc-svg .bar,
  .sn-svg:not(.spark) .bar,
  .sec-svg .seg, .sec-svg .arc,
  .chart-svg .seg, .chart-svg rect[class^="a"]
) { mask: url(#dk-12); }

html[data-theme="mono"] .dc-svg .hc.hl1 { fill: var(--ok); mask: url(#dk-4); }
html[data-theme="mono"] .dc-svg .hc.hl2 { fill: var(--ok); mask: url(#dk-8); }
html[data-theme="mono"] .dc-svg .hc.hl3 { fill: var(--ok); mask: url(#dk-12); }
html[data-theme="mono"] :is(.an-svg, .an-key) .hm.h1 { fill: var(--an-c1); mask: url(#dk-4); }
html[data-theme="mono"] :is(.an-svg, .an-key) .hm.h2 { fill: var(--an-c1); mask: url(#dk-6); }
html[data-theme="mono"] :is(.an-svg, .an-key) .hm.h3 { fill: var(--an-c1); mask: url(#dk-8); }
html[data-theme="mono"] :is(.an-svg, .an-key) .hm.h4 { fill: var(--an-c1); mask: url(#dk-12); }

@media (forced-colors: active) {
  html[data-theme="mono"] :is(.dk-ar, .dc-area, .dc-sp-area, .sn-svg .ar, .dc-bar, .an-svg *, .rpc-svg *, .sn-svg *, .sec-svg *, .chart-svg *, .dc-svg *) { mask: none; }
}