:root[data-applied-mode=light] code[class*=language-],
:root[data-applied-mode=light] pre[class*=language-]
{
	color: #393A34;
	font-family: Cascadia-Code, monospace;
	direction: ltr;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	font-size: 0.9em;
	line-height: 1.3;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

:root[data-applied-mode=light] pre > code[class*=language-]
{
	font-size: 1em;
}

:root[data-applied-mode=light] pre[class*=language-]::-moz-selection, :root[data-applied-mode=light] pre[class*=language-] ::-moz-selection,
:root[data-applied-mode=light] code[class*=language-]::-moz-selection, :root[data-applied-mode=light] code[class*=language-] ::-moz-selection
{
	background: #C1DEF1;
}

:root[data-applied-mode=light] pre[class*=language-]::selection, :root[data-applied-mode=light] pre[class*=language-] ::selection,
:root[data-applied-mode=light] code[class*=language-]::selection, :root[data-applied-mode=light] code[class*=language-] ::selection
{
	background: #C1DEF1;
}

:root[data-applied-mode=light] pre[class*=language-]
{
	padding: 1em;
	margin: 0.5em 0;
	overflow: auto;
	border: 2px solid #DDD;
	border-radius: 8px;
	background-color: white;
}

:root[data-applied-mode=light] :not(pre) > code[class*=language-]
{
	padding: 0.2em;
	padding-top: 1px;
	padding-bottom: 1px;
	margin: 0 0.2em;
	background: #F8F8F8;
	border: 2px solid #DDD;
	border-radius: 8px;
}

:root[data-applied-mode=light] .token.comment,
:root[data-applied-mode=light] .token.prolog,
:root[data-applied-mode=light] .token.doctype,
:root[data-applied-mode=light] .token.cdata
{
	color: #008000;
	font-style: italic;
}

:root[data-applied-mode=light] .token.namespace
{
	opacity: 0.7;
}

:root[data-applied-mode=light] .token.string
{
	color: #A31515;
}

:root[data-applied-mode=light] .token.punctuation,
:root[data-applied-mode=light] .token.operator
{
	color: #393A34; /* no highlight */
}

:root[data-applied-mode=light] .token.url,
:root[data-applied-mode=light] .token.symbol,
:root[data-applied-mode=light] .token.number,
:root[data-applied-mode=light] .token.boolean,
:root[data-applied-mode=light] .token.variable,
:root[data-applied-mode=light] .token.constant,
:root[data-applied-mode=light] .token.inserted
{
	color: #36ACAA;
}

:root[data-applied-mode=light] .token.atrule,
:root[data-applied-mode=light] .token.keyword,
:root[data-applied-mode=light] .token.attr-value,
:root[data-applied-mode=light] .language-autohotkey .token.selector,
:root[data-applied-mode=light] .language-json .token.boolean,
:root[data-applied-mode=light] .language-json .token.number,
:root[data-applied-mode=light] code[class*=language-css]
{
	color: #00F;
}

:root[data-applied-mode=light] .token.function
{
	color: #74531F;
}

:root[data-applied-mode=light] .token.deleted,
:root[data-applied-mode=light] .language-autohotkey .token.tag
{
	color: #9A050F;
}

:root[data-applied-mode=light] .token.selector,
:root[data-applied-mode=light] .language-autohotkey .token.keyword
{
	color: #00009F;
}

:root[data-applied-mode=light] .token.important
{
	color: #E90;
}

:root[data-applied-mode=light] .token.important,
:root[data-applied-mode=light] .token.bold
{
	font-weight: bold;
}

:root[data-applied-mode=light] .token.italic
{
	font-style: italic;
}

:root[data-applied-mode=light] .token.class-name,
:root[data-applied-mode=light] .language-json .token.property
{
	color: #2B91AF;
}

:root[data-applied-mode=light] .token.tag,
:root[data-applied-mode=light] .token.selector
{
	color: #800000;
}

:root[data-applied-mode=light] .token.attr-name,
:root[data-applied-mode=light] .token.property,
:root[data-applied-mode=light] .token.regex,
:root[data-applied-mode=light] .token.entity
{
	color: #F00;
}

:root[data-applied-mode=light] .token.directive.tag .tag
{
	background: #FF0;
	color: #393A34;
}

:root[data-applied-mode=light] .line-numbers.line-numbers .line-numbers-rows
{
	border-right-color: #A5A5A5;
}

:root[data-applied-mode=light] .line-numbers .line-numbers-rows > span:before
{
	color: #2B91AF;
}

:root[data-applied-mode=light] .line-highlight.line-highlight
{
	background: rgba(193, 222, 241, 0.2);
	background: -webkit-linear-gradient(left, rgba(193, 222, 241, 0.2) 70%, rgba(221, 222, 241, 0));
	background: linear-gradient(to right, rgba(193, 222, 241, 0.2) 70%, rgba(221, 222, 241, 0));
}

:root[data-applied-mode=light] pre[class*=language-].line-numbers
{
	position: relative;
	padding-left: 3.8em;
	counter-reset: linenumber;
}

:root[data-applied-mode=light] pre[class*=language-].line-numbers > code
{
	position: relative;
	white-space: inherit;
}

:root[data-applied-mode=light] .line-numbers .line-numbers-rows
{
	position: absolute;
	pointer-events: none;
	top: 0;
	font-size: 100%;
	left: -3.8em;
	width: 3em; /* works for line-numbers below 1000 lines */
	letter-spacing: -1px;
	border-right: 2px solid #999;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

:root[data-applied-mode=light] .line-numbers-rows > span
{
	display: block;
	counter-increment: linenumber;
}

:root[data-applied-mode=light] .line-numbers-rows > span:before
{
	content: counter(linenumber);
	color: #999;
	display: block;
	padding-right: 0.8em;
	text-align: right;
}

:root[data-applied-mode=light] .token a
{
	color: inherit;
}

:root[data-applied-mode=dark] pre[class*=language-],
:root[data-applied-mode=dark] code[class*=language-]
{
	color: #D4D4D4;
	font-family: Cascadia-Code, monospace;
	direction: ltr;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	font-size: 0.9em;
	line-height: 1.3;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

:root[data-applied-mode=dark] pre[class*=language-]::selection,
:root[data-applied-mode=dark] code[class*=language-]::selection,
:root[data-applied-mode=dark] pre[class*=language-] *::selection,
:root[data-applied-mode=dark] code[class*=language-] *::selection
{
	text-shadow: none;
	background: #264F78;
}

@media print
{
	:root[data-applied-mode=dark] pre[class*=language-],
	:root[data-applied-mode=dark] code[class*=language-]
	{
		text-shadow: none;
	}
}

:root[data-applied-mode=dark] pre > code[class*=language-]
{
	font-size: 1em;
}

:root[data-applied-mode=dark] pre[class*=language-]
{
	padding: 1em;
	margin: 0.5em 0;
	border: 2px solid darkgray;
	border-radius: 8px;
	overflow: auto;
	background: #1E1E1E;
}

:root[data-applied-mode=dark] :not(pre) > code[class*=language-]
{
	padding: 0.1em 0.3em;
	color: #DB4C69;
	border: 2px solid darkgray;
	border-radius: 8px;
	margin: 0 0.2em;
	background: #1E1E1E;
}

:root[data-applied-mode=dark] .namespace
{
	opacity: 0.7;
}

:root[data-applied-mode=dark] .token.doctype .token.doctype-tag
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.doctype .token.name
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.comment,
:root[data-applied-mode=dark] .token.prolog
{
	color: #6A9955;
}

:root[data-applied-mode=dark] .token.punctuation,
:root[data-applied-mode=dark] .language-html .language-css .token.punctuation,
:root[data-applied-mode=dark] .language-html .language-javascript .token.punctuation
{
	color: #D4D4D4;
}

:root[data-applied-mode=dark] .token.property,
:root[data-applied-mode=dark] .token.tag,
:root[data-applied-mode=dark] .token.boolean,
:root[data-applied-mode=dark] .token.number,
:root[data-applied-mode=dark] .token.constant,
:root[data-applied-mode=dark] .token.symbol,
:root[data-applied-mode=dark] .token.inserted,
:root[data-applied-mode=dark] .token.unit
{
	color: #B5CEA8;
}

:root[data-applied-mode=dark] .token.selector,
:root[data-applied-mode=dark] .token.attr-name,
:root[data-applied-mode=dark] .token.string,
:root[data-applied-mode=dark] .token.char,
:root[data-applied-mode=dark] .token.builtin,
:root[data-applied-mode=dark] .token.deleted
{
	color: #CE9178;
}

:root[data-applied-mode=dark] .language-css .token.string.url
{
	text-decoration: underline;
}

:root[data-applied-mode=dark] .token.operator,
:root[data-applied-mode=dark] .token.entity
{
	color: #D4D4D4;
}

:root[data-applied-mode=dark] .token.operator.arrow
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.atrule
{
	color: #CE9178;
}

:root[data-applied-mode=dark] .token.atrule .token.rule
{
	color: #C586C0;
}

:root[data-applied-mode=dark] .token.atrule .token.url
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.atrule .token.url .token.function
{
	color: #DCDCAA;
}

:root[data-applied-mode=dark] .token.atrule .token.url .token.punctuation
{
	color: #D4D4D4;
}

:root[data-applied-mode=dark] .token.keyword
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.keyword.module,
:root[data-applied-mode=dark] .token.keyword.control-flow
{
	color: #C586C0;
}

:root[data-applied-mode=dark] .token.function,
:root[data-applied-mode=dark] .token.function .token.maybe-class-name
{
	color: #DCDCAA;
}

:root[data-applied-mode=dark] .token.regex
{
	color: #D16969;
}

:root[data-applied-mode=dark] .token.important
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.italic
{
	font-style: italic;
}

:root[data-applied-mode=dark] .token.constant
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.class-name,
:root[data-applied-mode=dark] .token.maybe-class-name
{
	color: #4EC9B0;
}

:root[data-applied-mode=dark] .token.console
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.parameter
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.interpolation
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.punctuation.interpolation-punctuation
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.boolean
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.property,
:root[data-applied-mode=dark] .token.variable,
:root[data-applied-mode=dark] .token.imports .token.maybe-class-name,
:root[data-applied-mode=dark] .token.exports .token.maybe-class-name
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.selector
{
	color: #D7BA7D;
}

:root[data-applied-mode=dark] .token.escape
{
	color: #D7BA7D;
}

:root[data-applied-mode=dark] .token.tag
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.tag .token.punctuation
{
	color: #808080;
}

:root[data-applied-mode=dark] .token.cdata
{
	color: #808080;
}

:root[data-applied-mode=dark] .token.attr-name
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] .token.attr-value,
:root[data-applied-mode=dark] .token.attr-value .token.punctuation
{
	color: #CE9178;
}

:root[data-applied-mode=dark] .token.attr-value .token.punctuation.attr-equals
{
	color: #D4D4D4;
}

:root[data-applied-mode=dark] .token.entity
{
	color: #569CD6;
}

:root[data-applied-mode=dark] .token.namespace
{
	color: #4EC9B0;
}

:root[data-applied-mode=dark] pre[class*=language-javascript],
:root[data-applied-mode=dark] code[class*=language-javascript],
:root[data-applied-mode=dark] pre[class*=language-jsx],
:root[data-applied-mode=dark] code[class*=language-jsx],
:root[data-applied-mode=dark] pre[class*=language-typescript],
:root[data-applied-mode=dark] code[class*=language-typescript],
:root[data-applied-mode=dark] pre[class*=language-tsx],
:root[data-applied-mode=dark] code[class*=language-tsx]
{
	color: #9CDCFE;
}

:root[data-applied-mode=dark] pre[class*=language-css],
:root[data-applied-mode=dark] code[class*=language-css]
{
	color: #CE9178;
}

:root[data-applied-mode=dark] pre[class*=language-html],
:root[data-applied-mode=dark] code[class*=language-html]
{
	color: #D4D4D4;
}

:root[data-applied-mode=dark] .language-regex .token.anchor
{
	color: #DCDCAA;
}

:root[data-applied-mode=dark] .language-html .token.punctuation
{
	color: #808080;
}

:root[data-applied-mode=dark] pre[class*=language-] > code[class*=language-]
{
	position: relative;
	z-index: 1;
}

:root[data-applied-mode=dark] .line-highlight.line-highlight
{
	background: #F7EBC6;
	box-shadow: inset 5px 0 0 #F7D87C;
	z-index: 0;
}

:root[data-applied-mode=dark] pre[class*=language-].line-numbers
{
	position: relative;
	padding-left: 3.8em;
	counter-reset: linenumber;
}

:root[data-applied-mode=dark] pre[class*=language-].line-numbers > code
{
	position: relative;
	white-space: inherit;
}

:root[data-applied-mode=dark] .line-numbers .line-numbers-rows
{
	position: absolute;
	pointer-events: none;
	top: 0;
	font-size: 100%;
	left: -3.8em;
	width: 3em; /* works for line-numbers below 1000 lines */
	letter-spacing: -1px;
	border-right: 2px solid #999;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

:root[data-applied-mode=dark] .line-numbers-rows > span
{
	display: block;
	counter-increment: linenumber;
}

:root[data-applied-mode=dark] .line-numbers-rows > span:before
{
	content: counter(linenumber);
	color: #999;
	display: block;
	padding-right: 0.8em;
	text-align: right;
}

:root[data-applied-mode=dark] .token a
{
	color: inherit;
}