/* Front article markdown sync with backend editor preview */
/* Source mapped from typecho/write/css/joe.write.min.css (.cm-preview-content block) */
/* Markdown preview style refresh (inspired by phycat) */
article.post .entry-content {
	--pc-accent: var(--theme, #3aa7f6);
	--pc-accent-deep: #1b7fd1;
	--pc-secondary: #8abce9;
	--pc-text: #26323f;
	--pc-text-soft: #46556a;
	--pc-border: #e3ecf5;
	padding: 18px 18px 26px;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: .015em;
	color: var(--pc-text);
	text-align: left;
	font-family: "LXGW WenKai Screen", "LXGW WenKai", "LXGW WenKai GB", "PingFang SC", "Noto Serif CJK SC", "Microsoft YaHei", serif;
	text-rendering: optimizeLegibility;
}

article.post .entry-content p,
article.post .entry-content li,
article.post .entry-content blockquote,
article.post .entry-content table,
article.post .entry-content th,
article.post .entry-content td {
	font-family: inherit !important;
	color: var(--pc-text-soft);
	font-size: 1em !important;
}

article.post .entry-content h1,
article.post .entry-content h2,
article.post .entry-content h3,
article.post .entry-content h4,
article.post .entry-content h5,
article.post .entry-content h6 {
	font-family: inherit !important;
	font-weight: 700;
	color: #1d2b3a;
	line-height: 1.6;
	margin: 1.2em 0 .7em;
}

article.post .entry-content h1::before,
article.post .entry-content h4::after {
	content: none;
}

article.post .entry-content h1 {
	text-align: center;
	font-size: 1.65em;
	padding-bottom: .45em;
	position: relative;
}

article.post .entry-content h1::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 72px;
	height: 4px;
	border-radius: 99px;
	transform: translateX(-50%);
	background: linear-gradient(90deg, var(--pc-accent), #74c7ff);
}

/* Mode B: Twin pillars h2 */
article.post .entry-content h2 {
	background: none !important;
	box-shadow: none !important;
	border: none !important;
	border-radius: 0 !important;
	position: relative;
	padding-left: 20px;
	padding-right: 0;
	display: block;
	width: 100%;
	box-sizing: border-box;
	font-size: 1.35em;
	margin: 1.05em 0 .8em;
	line-height: 1.45;
	transition: none;
}

article.post .entry-content h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 1.05em;
	width: 5px;
	background-color: var(--pc-accent);
	border-radius: 4px;
	opacity: 1;
	transition: none;
}

article.post .entry-content h2::after {
	content: "";
	position: absolute;
	left: 8px;
	top: 50%;
	transform: translateY(-50%);
	height: .72em;
	width: 2px;
	background-color: var(--pc-secondary);
	border-radius: 2px;
	opacity: .75;
	transition: none;
}

article.post .entry-content h3 {
	font-size: 1.2em;
	padding-left: 14px;
	position: relative;
}

article.post .entry-content h3::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 5px;
	height: 64%;
	border-radius: 5px;
	background: var(--pc-accent);
}

article.post .entry-content h4,
article.post .entry-content h5,
article.post .entry-content h6 {
	font-size: 1.05em;
}

article.post .entry-content h4::before,
article.post .entry-content h5::before,
article.post .entry-content h6::before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
	border-radius: 50%;
}

article.post .entry-content h4::before {
	width: 8px;
	height: 8px;
	background: var(--pc-accent);
}

article.post .entry-content h5::before {
	width: 8px;
	height: 8px;
	border: 2px solid var(--pc-accent);
	background: transparent;
}

article.post .entry-content h6::before {
	width: 6px;
	height: 6px;
	background: #90a4b8;
}

article.post .entry-content p {
	line-height: 1.95;
	margin: .65em 0 1em;
}

article.post .entry-content hr {
	margin: 1.4em 0;
	height: 0;
	border: none;
	border-top: 2px dashed #cddded;
}

article.post .entry-content ul,
article.post .entry-content ol {
	padding-left: 1.6em;
	margin: .45em 0 1em .25em;
}

article.post .entry-content ul ul,
article.post .entry-content ol ol,
article.post .entry-content ul ol,
article.post .entry-content ol ul {
	margin: .25em 0 .5em;
}

article.post .entry-content li {
	line-height: 1.85;
	margin: .24em 0;
	color: var(--pc-text-soft);
}

article.post .entry-content li::marker {
	color: #5d728a;
	font-family: inherit;
}

article.post .entry-content li > p {
	font-family: inherit !important;
	line-height: 1.85;
	margin: .16em 0 !important;
	color: inherit;
}

article.post .entry-content blockquote {
	position: relative;
	margin: 1.2em 0;
	padding: .9em 1em;
	border: none;
	border-radius: 10px;
	background: rgba(58, 167, 246, .08);
	color: #3c4b61;
}

article.post .entry-content blockquote::before {
	content: none;
}

article.post .entry-content blockquote p {
	margin: 0;
}

article.post .entry-content pre[class*=language-] {
	margin: 1em 0;
	border-radius: 10px;
	border: 1px solid #2f3a4a;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
}

article.post .entry-content pre[class*=language-] code,
article.post .entry-content code,
article.post .entry-content code:not([class]) {
	font-family: "Cascadia Code", "JetBrains Mono", "Fira Code", Consolas, "SFMono-Regular", Menlo, monospace;
}

article.post .entry-content code:not([class]) {
	font-size: .88em;
	padding: .15em .45em;
	border-radius: 6px;
	color: #2d5f9f;
	background: rgba(45, 95, 159, .12);
}

/* kbd: align with editor inline token style */
article.post .entry-content kbd {
	font-family: "Cascadia Code", "JetBrains Mono", "Fira Code", Consolas, "SFMono-Regular", Menlo, monospace !important;
	font-size: .88em !important;
	line-height: 1;
	padding: .15em .45em !important;
	margin: 0 .12em;
	border: none !important;
	border-radius: 6px !important;
	box-shadow: none !important;
	color: #2d5f9f !important;
	background: rgba(45, 95, 159, .12) !important;
	white-space: nowrap;
	vertical-align: baseline;
}

article.post .entry-content table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 1em 0;
	border: 1px solid var(--pc-border);
	border-radius: 10px;
	overflow: hidden;
}

article.post .entry-content table th,
article.post .entry-content table td {
	padding: .58em .8em;
	border-right: 1px solid var(--pc-border);
	border-bottom: 1px solid var(--pc-border);
}

article.post .entry-content table th:last-child,
article.post .entry-content table td:last-child {
	border-right: none;
}

article.post .entry-content table tr:last-child td {
	border-bottom: none;
}

article.post .entry-content table thead th {
	background: #f2f8ff;
	color: #2f4968;
}

article.post .entry-content a:not([class]) {
	color: var(--pc-accent-deep);
	text-decoration: none;
	border-bottom: 1px dashed rgba(27, 127, 209, .35);
}

article.post .entry-content a:not([class]):hover {
	color: #1267ad;
	border-bottom-color: rgba(18, 103, 173, .75);
}

article.post .entry-content img:not([class]) {
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(23, 39, 58, .12);
}

/* todo list */
article.post .entry-content .task-list-item {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

article.post .entry-content .task-list-item input[type="checkbox"],
article.post .entry-content li input[type="checkbox"],
article.post .entry-content .joe_checkbox {
	appearance: none;
	-webkit-appearance: none;
	width: 1.05em;
	height: 1.05em;
	border: 2px solid var(--pc-accent);
	border-radius: 4px;
	display: inline-block;
	vertical-align: -2px;
	margin-right: .45em;
	position: relative;
	background: #fff;
}

article.post .entry-content .task-list-item input[type="checkbox"]:checked,
article.post .entry-content li input[type="checkbox"]:checked,
article.post .entry-content .joe_checkbox:checked {
	background: var(--pc-accent);
}

article.post .entry-content .task-list-item input[type="checkbox"]:checked::after,
article.post .entry-content li input[type="checkbox"]:checked::after,
article.post .entry-content .joe_checkbox:checked::after {
	content: "";
	position: absolute;
	left: .24em;
	top: .01em;
	width: .27em;
	height: .52em;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

article.post .entry-content .task-list-item:has(input[type="checkbox"]:checked) {
	color: #8a97a8;
	text-decoration: line-through;
	text-decoration-thickness: 1px;
}

/* MathJax formula typography */
article.post .entry-content mjx-container {
	margin: .55em 0 !important;
	font-size: 1.06em !important;
	color: #34465d !important;
}

article.post .entry-content mjx-container[display="true"] {
	padding: .3em 0;
	overflow-x: auto;
	overflow-y: hidden;
}

article.post .entry-content mjx-container[jax="SVG"] {
	color: #34465d !important;
}

article.post .entry-content mjx-container[display="true"] svg {
	max-width: 100%;
	height: auto !important;
}
/* Neutralize legacy front list pseudo line style */
article.post .entry-content li::before,
article.post .entry-content li:before {
	content: none !important;
	border: none !important;
}

/* Dark mode adaptation */
.sp-dark-mode article.post .entry-content {
	--pc-accent: #64b1ff;
	--pc-accent-deep: #79bcff;
	--pc-secondary: #9fc8f1;
	--pc-text: #dfe9fb;
	--pc-text-soft: #b6c7e2;
	--pc-border: rgba(126, 164, 211, .28);
	color: var(--pc-text);
}

.sp-dark-mode article.post .entry-content h1,
.sp-dark-mode article.post .entry-content h2,
.sp-dark-mode article.post .entry-content h3,
.sp-dark-mode article.post .entry-content h4,
.sp-dark-mode article.post .entry-content h5,
.sp-dark-mode article.post .entry-content h6 {
	color: #e9f1ff;
}

.sp-dark-mode article.post .entry-content h6::before {
	background: #9fb7d9;
}

.sp-dark-mode article.post .entry-content hr {
	border-top-color: #3c5270;
}

.sp-dark-mode article.post .entry-content li::marker {
	color: #8ea8c8;
}

.sp-dark-mode article.post .entry-content blockquote {
	background: rgba(86, 136, 203, .2);
	color: #d8e5fb;
}

.sp-dark-mode article.post .entry-content table thead th {
	background: rgba(76, 112, 163, .32);
	color: #dce9ff;
}

.sp-dark-mode article.post .entry-content a:not([class]) {
	color: #8ec5ff;
	border-bottom-color: rgba(142, 197, 255, .45);
}

.sp-dark-mode article.post .entry-content a:not([class]):hover {
	color: #b0d7ff;
	border-bottom-color: rgba(176, 215, 255, .7);
}

.sp-dark-mode article.post .entry-content code:not([class]),
.sp-dark-mode article.post .entry-content kbd {
	color: #a8ccff !important;
	background: rgba(120, 168, 231, .16) !important;
}

.sp-dark-mode article.post .entry-content .task-list-item input[type="checkbox"],
.sp-dark-mode article.post .entry-content li input[type="checkbox"],
.sp-dark-mode article.post .entry-content .joe_checkbox {
	background: #1f2c45;
	border-color: #6aaef0;
}

.sp-dark-mode article.post .entry-content .task-list-item:has(input[type="checkbox"]:checked) {
	color: #93a8c5;
}

.sp-dark-mode article.post .entry-content mjx-container,
.sp-dark-mode article.post .entry-content mjx-container[jax="SVG"] {
	color: #c9dbf6 !important;
}
