*::-webkit-scrollbar {
	width: 4px;
}

*::-webkit-scrollbar-thumb {
	border-radius: 2px;
	background-color: rgba(133, 133, 133, 0.5);
}

*::-webkit-scrollbar-track {
	background-color: rgba(133, 133, 133, 0.2);
}

html {
	overflow-x: hidden;
	overflow-y: overlay;
	/*scrollbar-gutter: stable;*/
	/* scrollbar-gutter: stable both-edges; */
	-webkit-tap-highlight-color: transparent;
}
* {
	scrollbar-width: thin;
}

.prose :where(code):not(:where([class~='not-prose'] *))::before {
	content: '' !important;
}

.prose :where(code):not(:where([class~='not-prose'] *))::after {
	content: '' !important;
}

.prose :where(code):not(:where([class~='not-prose'] *)) {
	padding-left: 4px;
	padding-right: 4px;
	border-radius: 2px;
	background: #e4e4e4 !important;
}

.dark .dark\:prose-invert :where(code):not(:where([class~='not-prose'] *)) {
	background: #202020 !important;
}

/*!
  Theme: GitHub Light
*/
.prose pre code.hljs {
	background: #e4e4e4 !important;
}

.prose pre code.hljs {
	display: block;
	overflow-x: auto;
	padding: 1em;
}

.prose code.hljs {
	padding: 3px 5px;
}

.prose .hljs {
	/* background: #ebebeb !important; */
	color: #434f54;
}

.prose .hljs-subst {
	color: #434f54;
}

.prose .hljs-attribute,
.prose .hljs-doctag,
.prose .hljs-keyword,
.prose .hljs-name,
.prose .hljs-selector-tag {
	/* color: #00979d; */
	/* color: #0B24FB; */
	/* color: #ff3e00; */
	color: #af10a7;
}

.prose .hljs-addition,
.prose .hljs-built_in,
.prose .hljs-bullet,
.prose .hljs-code,
.prose .hljs-literal {
	color: #d35400;
}

.prose .hljs-link,
.prose .hljs-regexp,
.prose .hljs-selector-attr,
.prose .hljs-selector-pseudo,
.prose .hljs-symbol,
.prose .hljs-template-variable,
.prose .hljs-variable {
	/* color: #00979d; */
	color: #0b24fb;
	/* font-weight: bold; */
	/* color: #8a3ce2; */
}

.prose .hljs-deletion,
.prose .hljs-quote,
.prose .hljs-selector-class,
.prose .hljs-selector-id,
.prose .hljs-string,
.prose .hljs-template-tag,
.prose .hljs-type {
	/* color: #005c5f; */
	color: rgb(56, 189, 248);
}

.prose .hljs-comment {
	color: rgba(149, 165, 166, 0.8);
}

.prose .hljs-meta .hljs-keyword {
	color: #728e00;
}

.prose .hljs-meta {
	color: #434f54;
}

.prose .hljs-emphasis {
	font-style: italic;
}

.prose .hljs-strong {
	font-weight: 700;
}

.prose .hljs-function {
	color: #728e00;
}

.prose .hljs-section,
.prose .hljs-title {
	/* color: #800; */
	color: #0b24fb;
	font-weight: 700;
}

.prose .hljs-number {
	color: #8a7b52;
}

.dark .dark\:prose-invert pre code.hljs {
	background: #202020 !important;
}

.dark .dark\:prose-invert pre code.hljs {
	display: block;
	overflow-x: auto;
	padding: 1em;
}

.dark .dark\:prose-invert code.hljs {
	padding: 3px 5px;
}

/*!
  Theme: GitHub Dark
*/
.dark .dark\:prose-invert .hljs {
	color: #c9d1d9;
	/* background: #0d1117; */
}

.dark .dark\:prose-invert .hljs-doctag,
.dark .dark\:prose-invert .hljs-keyword,
.dark .dark\:prose-invert .hljs-meta .hljs-keyword,
.dark .dark\:prose-invert .hljs-template-tag,
.dark .dark\:prose-invert .hljs-template-variable,
.dark .dark\:prose-invert .hljs-type,
.dark .dark\:prose-invert .hljs-variable.language_ {
	/* color: #ff7b72; */
	color: #ffc043;
}

.dark .dark\:prose-invert .hljs-title,
.dark .dark\:prose-invert .hljs-title.class_,
.dark .dark\:prose-invert .hljs-title.class_.inherited__,
.dark .dark\:prose-invert .hljs-title.function_ {
	color: #d2a8ff;
}

.dark .dark\:prose-invert .hljs-attr,
.dark .dark\:prose-invert .hljs-attribute,
.dark .dark\:prose-invert .hljs-literal,
.dark .dark\:prose-invert .hljs-meta,
.dark .dark\:prose-invert .hljs-number,
.dark .dark\:prose-invert .hljs-operator,
.dark .dark\:prose-invert .hljs-selector-attr,
.dark .dark\:prose-invert .hljs-selector-class,
.dark .dark\:prose-invert .hljs-selector-id,
.dark .dark\:prose-invert .hljs-variable {
	color: #79c0ff;
}

.dark .dark\:prose-invert .hljs-meta .hljs-string,
.dark .dark\:prose-invert .hljs-regexp,
.dark .dark\:prose-invert .hljs-string {
	color: #a5d6ff;
}

.dark .dark\:prose-invert .hljs-built_in,
.dark .dark\:prose-invert .hljs-symbol {
	color: #ffa657;
}

.dark .dark\:prose-invert .hljs-code,
.dark .dark\:prose-invert .hljs-comment,
.dark .dark\:prose-invert .hljs-formula {
	color: #8b949e;
}

.dark .dark\:prose-invert .hljs-name,
.dark .dark\:prose-invert .hljs-quote,
.dark .dark\:prose-invert .hljs-selector-pseudo,
.dark .dark\:prose-invert .hljs-selector-tag {
	color: #7ee787;
}

.dark .dark\:prose-invert .hljs-subst {
	color: #c9d1d9;
}

.dark .dark\:prose-invert .hljs-section {
	color: #1f6feb;
	font-weight: 700;
}

.dark .dark\:prose-invert .hljs-bullet {
	color: #f2cc60;
}

.dark .dark\:prose-invert .hljs-emphasis {
	color: #c9d1d9;
	font-style: italic;
}

.dark .dark\:prose-invert .hljs-strong {
	color: #c9d1d9;
	font-weight: 700;
}

.dark .dark\:prose-invert .hljs-addition {
	color: #aff5b4;
	background-color: #033a16;
}

.dark .dark\:prose-invert .hljs-deletion {
	color: #ffdcd7;
	background-color: #67060c;
}

@font-face {
	font-family: 'JetBrainsMono';
	src: url('./assets/fonts/JetBrainsMono-Regular.woff2');
}

code {
	font-family: 'JetBrainsMono' !important;
}

/* 模拟设计软件的透明层 */
.transparent-background {
	background-image: linear-gradient(45deg, #666 25%, transparent 25%, transparent 75%, #666 75%),
		linear-gradient(45deg, #666 25%, transparent 25%, transparent 75%, #666 75%);
	background-position:
		0 0,
		10px 10px;
	background-size: 20px 20px;
}

@keyframes clip {
	from {
		clip-path: circle(0% at var(--x) var(--y));
	}
	to {
		clip-path: circle(100% at var(--x) var(--y));
	}
}

::view-transition-old(root) {
	animation: none;
}
::view-transition-new(root) {
	mix-blend-mode: normal;
	animation: clip 0.6s ease-in;
}