/*

Theme Name: argon

Author: solstice23

Author URI: https://solstice23.top/

Description: 轻盈、简洁、美观的 Wordpress 主题

Version: 1.5.2

License: GNU General Public License v3.0

License URI: https://www.gnu.org/licenses/gpl-3.0.html

*/



@charset "utf-8";


:root {

	--themecolor: #5e72e4;

	--themecolor-R: 94;

	--themecolor-G: 114;

	--themecolor-B: 228;

	--themecolor-H: 231;

	--themecolor-S: 71;

	--themecolor-L: 63;

	--themecolor-rgbstr: var(--themecolor-R), var(--themecolor-G), var(--themecolor-B);

	--themecolor-dark0: hsl(var(--themecolor-H), calc(var(--themecolor-S) * 1%), max(calc(var(--themecolor-L) * 1% - 2.5%), 0%));

	--themecolor-dark: hsl(var(--themecolor-H), calc(var(--themecolor-S) * 1%), max(calc(var(--themecolor-L) * 1% - 5%), 0%));

	--themecolor-dark2: hsl(var(--themecolor-H), calc(var(--themecolor-S) * 1%), max(calc(var(--themecolor-L) * 1% - 10%), 0%));

	--themecolor-dark3: hsl(var(--themecolor-H), calc(var(--themecolor-S) * 1%), max(calc(var(--themecolor-L) * 1% - 15%), 0%));

	--themecolor-light: hsl(var(--themecolor-H), calc(var(--themecolor-S) * 1%), min(calc(var(--themecolor-L) * 1% + 10%), 100%));

	--themecolor-gradient: linear-gradient(150deg, var(--themecolor-light) 15%, var(--themecolor) 70%, var(--themecolor-dark0) 94%);



	--color-tint-70:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.7),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.7),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.7);

	--color-tint-78:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.78),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.78),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.78);

	--color-tint-80:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.8),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.8),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.8);

	--color-tint-82:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.82),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.82),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.82);

	--color-tint-86:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.86),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.86),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.86);

	--color-tint-92:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.92),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.92),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.92);

	--color-tint-95:

		calc(var(--themecolor-R) + (255 - var(--themecolor-R)) * 0.95),

		calc(var(--themecolor-G) + (255 - var(--themecolor-G)) * 0.95),

		calc(var(--themecolor-B) + (255 - var(--themecolor-B)) * 0.95);

	--color-shade-70:

		calc(30 * 0.7 + var(--themecolor-R) * (1 - 0.7)),

		calc(30 * 0.7 + var(--themecolor-G) * (1 - 0.7)),

		calc(30 * 0.7 + var(--themecolor-B) * (1 - 0.7));

	--color-shade-75:

		calc(30 * 0.75 + var(--themecolor-R) * (1 - 0.75)),

		calc(30 * 0.75 + var(--themecolor-G) * (1 - 0.75)),

		calc(30 * 0.75 + var(--themecolor-B) * (1 - 0.75));

	--color-shade-80:

		calc(30 * 0.8 + var(--themecolor-R) * (1 - 0.8)),

		calc(30 * 0.8 + var(--themecolor-G) * (1 - 0.8)),

		calc(30 * 0.8 + var(--themecolor-B) * (1 - 0.8));

	--color-shade-82:

		calc(30 * 0.82 + var(--themecolor-R) * (1 - 0.82)),

		calc(30 * 0.82 + var(--themecolor-G) * (1 - 0.82)),

		calc(30 * 0.82 + var(--themecolor-B) * (1 - 0.82));

	--color-shade-86:

		calc(30 * 0.86 + var(--themecolor-R) * (1 - 0.86)),

		calc(30 * 0.86 + var(--themecolor-G) * (1 - 0.86)),

		calc(30 * 0.86 + var(--themecolor-B) * (1 - 0.86));

	--color-shade-90:

		calc(30 * 0.9 + var(--themecolor-R) * (1 - 0.9)),

		calc(30 * 0.9 + var(--themecolor-G) * (1 - 0.9)),

		calc(30 * 0.9 + var(--themecolor-B) * (1 - 0.9));

	--color-shade-94:

		calc(30 * 0.94 + var(--themecolor-R) * (1 - 0.94)),

		calc(30 * 0.94 + var(--themecolor-G) * (1 - 0.94)),

		calc(30 * 0.94 + var(--themecolor-B) * (1 - 0.94));

	--color-shade-96:

		calc(30 * 0.96 + var(--themecolor-R) * (1 - 0.96)),

		calc(30 * 0.96 + var(--themecolor-G) * (1 - 0.96)),

		calc(30 * 0.96 + var(--themecolor-B) * (1 - 0.96));

	--color-tint-blue:

		calc(204 * 0.6 + var(--themecolor-R) * (1 - 0.6)),

		calc(226 * 0.6 + var(--themecolor-G) * (1 - 0.6)),

		calc(255 * 0.6 + var(--themecolor-B) * (1 - 0.6));



	--color-background: #f4f5f7;

	--color-foreground: #fff;

	--color-widgets: #fff;

	--color-widgets-disabled: #e9ecef;

	--color-border: #dce0e5;

	--color-border-on-foreground: #f3f3f3;

	--color-border-on-foreground-deeper: #eee;

	--color-text-deeper: #212529;

	--color-selection: #cce2ff;

	/* ========== 统一动画系统 - 桌面端和移动端一�?========== */
	/* 动画时长 - 基于 Material Design 3 规范 */
	--animation-instant: 100ms;
	--animation-fast: 150ms;
	--animation-normal: 250ms;
	--animation-slow: 400ms;
	--animation-slower: 600ms;

	/* 缓动函数 - Material 3 标准曲线 */
	--ease-standard: cubic-bezier(0.2, 0, 0, 1);
	--ease-standard-decelerate: cubic-bezier(0, 0, 0, 1);
	--ease-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
	--ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
	--ease-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
	--ease-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);

	/* 弹性缓�?- 用于交互反馈 */
	--ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
	--ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);
	--ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

	/* 状态层透明�?- Material 3 */
	--state-hover-opacity: 0.08;
	--state-focus-opacity: 0.12;
	--state-pressed-opacity: 0.12;
	--state-dragged-opacity: 0.16;
}

html.darkmode body {

	--color-background: #282828;

	--color-foreground: #424242;

	--color-widgets: #555;

	--color-widgets-disabled: #474747;

	--color-border: #777;

	--color-border-on-foreground: #555;

	--color-border-on-foreground-deeper: #777;

	--color-text-deeper: #eee;

	--color-darkmode-toolbar: 33, 33, 33;

	--color-darkmode-banner: #212121;

	--color-selection: #607799;

}

html.darkmode.amoled-dark body,

html.darkmode.amoled-dark.immersion-color body {

	--color-background: #111;

	--color-foreground: #000;

	--color-widgets: #151515;

	--color-widgets-disabled: #000;

	--color-border: #222;

	--color-border-on-foreground: #181818;

	--color-border-on-foreground-deeper: #252525;

	--color-text-deeper: #eee;

	--color-selection: #607799;



	--color-darkmode-toolbar: 0, 0, 0;

	--color-darkmode-banner: #131313;

}



html.immersion-color body {

	--color-background: rgb(var(--color-tint-86));

	--color-foreground: rgb(var(--color-tint-92));

	--color-widgets: rgb(var(--color-tint-95));

	--color-widgets-disabled: rgb(var(--color-tint-86));

	--color-border: rgb(var(--color-tint-78));

	--color-border-on-foreground: rgb(var(--color-tint-86));

	--color-border-on-foreground-deeper: rgb(var(--color-tint-80));

	--color-text-deeper: rgb(var(--color-shade-82));

	--color-selection: rgb(var(--color-tint-70));

}

html.immersion-color.darkmode body {

	--color-background: rgb(var(--color-shade-94));

	--color-foreground: rgb(var(--color-shade-90));

	--color-widgets: rgb(var(--color-shade-86));

	--color-widgets-disabled: rgb(var(--color-shade-82));

	--color-border: rgb(var(--color-shade-80));

	--color-border-on-foreground: rgb(var(--color-shade-82));

	--color-border-on-foreground-deeper: rgb(var(--color-shade-75));

	--color-text-deeper: rgb(var(--color-tint-82));

	--color-selection: rgb(var(--color-shade-70));



	--color-darkmode-toolbar: var(--color-shade-90);

	--color-darkmode-banner: rgb(var(--color-shade-96));

}

/* 主题切换过渡效果 (Dark/Light Mode Transition) */
html {
	transition: none;
}

html.theme-transitioning,
html.theme-transitioning *,
html.theme-transitioning *::before,
html.theme-transitioning *::after {
	transition:
		background-color 250ms var(--ease-standard),
		border-color 250ms var(--ease-standard),
		color 200ms var(--ease-standard),
		box-shadow 250ms var(--ease-standard),
		fill 200ms var(--ease-standard),
		stroke 200ms var(--ease-standard) !important;
}

/*Argon CSS Override*/

.bg-white,

.card,

.dropdown-menu,

.dropdown-menu:before {

	background-color: var(--color-foreground) !important;

}

.form-control,

.form-control:focus,

.focused .input-group-text,

.btn-neutral,

.input-group-text,

.page-link,

.modal-content,

.custom-control-label::before,

.btn-secondary {

	background-color: var(--color-widgets);

}

.page-link {

	border-color: var(--color-border) !important;

}

.modal-header,

.custom-control-label::before {

	border-color: var(--color-border-on-foreground-deeper) !important;

}

.page-link:hover {

	background-color: var(--color-widgets-disabled);

}

.form-control:disabled,

.form-control[readonly] {

	background-color: var(--color-widgets-disabled);

}



/* Main CSS */

:root {

	--card-radius: 4px;

	--font: "Open Sans", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica,

		Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;

}

html.themecolor-toodark.darkmode {

	--themecolor: #5e72e4 !important;

	--themecolor-light: #8a98eb !important;

}



body {

	background: var(--color-background) !important;

	font-family: var(--font);

	overflow: overlay;

}

a {

	transition: color var(--animation-normal) var(--ease-standard);

}

audio,

canvas,

progress,

video {

	display: inline-block;

	vertical-align: baseline;

}

article .post-content {

	margin-top: 6px;

}

article .post-content p {

	line-height: 1.8;

	word-wrap: break-word;

}

article h1,

article h2,

article h3,

article h4,

article h5,

article h6,

article strong {

	font-weight: 600;

}

article h1,

article h2,

article h3,

article h4,

article h5,

article h6 {

	margin-top: 18px !important;

	margin-bottom: 15px;

}

article h1 {

	font-size: 30px;

}

article h2 {

	font-size: 26px;

}

article h3 {

	font-size: 22px;

}

article h4 {

	font-size: 18px;

}

article h5 {

	font-size: 15px;

}

article h6 {

	font-size: 13px;

}

article figcaption {

	text-align: center;

	opacity: 0.65;

	margin-top: 10px;

}

article img,

.shuoshuo-preview-container img {

	max-width: 100%;

	height: auto;

}

.shuoshuo-preview-container img {

	border-radius: var(--card-radius);

}

.shuoshuo-preview-container p+p>img:first-child {

	margin-top: 12px;

}

article .wp-block-image figcaption,

.shuoshuo-preview-container .wp-block-image figcaption {

	text-align: center;

	font-size: 14px;

	opacity: 0.6;

}

article video,

.shuoshuo-preview-container video {

	max-width: 100%;

	outline: none;

}

article .wp-caption,

.shuoshuo-preview-container .wp-caption {

	max-width: 100%;

}

article .post-content a {

	position: relative;

}

article .post-content a:before {

	content: " ";

	position: absolute;

	top: auto;

	bottom: 0px;

	left: 0;

	width: 100%;

	height: 1px;

	background-color: var(--themecolor);

	transition: all 0.2s;

	transform: scaleX(0);

	backface-visibility: hidden;

}

article .post-content a[class*="button"]:before {

	display: none;

}

article .post-content a:hover:before {

	transform: scaleX(1);

}

article .post-content a.no-hover-underline:before {

	display: none;

}

html:not(.disable-codeblock-style) article pre:not(.hljs-codeblock) {

	font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",

		"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier,

		monospace;

	font-size: 14px;

	line-height: 1.375;

	text-align: left;

	white-space: pre;

	word-spacing: normal;

	word-break: normal;

	tab-size: 4;

	hyphens: none;

	color: #5e6687;

	background: var(--color-border-on-foreground);

	direction: ltr;

	border: 1px solid var(--color-border-on-foreground-deeper);

	padding: 14px;

	border-radius: 3px;

}

article .post-content blockquote {

	padding-left: 1em;

	margin: 1em 3em 1em 0;

	font-weight: 400;

	border-left: 4px solid var(--color-border-on-foreground-deeper);

}

article .post-content mark {

	padding: 2px;

	margin: 0 5px;

	background: #fffdd1;

	border-bottom: 1px solid #ffedce;

}

article .post-content u,

article .post-content ins {

	text-decoration: none;

	border-bottom: 1px solid;

}

html:not(.disable-codeblock-style) article code:not([hljs-codeblock-inner]) {

	font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",

		"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier,

		monospace;

	color: #5e6687;

	background: var(--color-border-on-foreground);

	border: 1px solid var(--color-border-on-foreground-deeper);

	direction: ltr;

	border-radius: 3px;

	padding: 0 4px;

}

html:not(.disable-codeblock-style) article .post-content>code:not([hljs-codeblock-inner]),

article .post-content>p>code:not([hljs-codeblock-inner]) {

	padding: 2px 5px;

}

article .post-content abbr[title] {

	text-decoration: none;

	cursor: help;

	border-bottom: 1px dotted;

}

article .post-content kbd {

	padding: 2px 6px;

	font-size: 90%;

	color: #fff;

	background-color: #333;

	border-radius: 3px;

}

article .wp-embedded-content,

article .blocks-gallery-grid,

article .wp-block-gallery,

article .wp-block-media-text {

	max-width: 100%;

}

article .blocks-gallery-grid.is-cropped .blocks-gallery-image .fancybox-wrapper,

article .blocks-gallery-grid.is-cropped .blocks-gallery-item .fancybox-wrapper,

article .wp-block-gallery.is-cropped .blocks-gallery-image .fancybox-wrapper,

article .wp-block-gallery.is-cropped .blocks-gallery-item .fancybox-wrapper {

	height: 100%;

	flex: 1;

	-o-object-fit: cover;

	object-fit: cover;

}

article .wp-block-cover,

article .wp-block-cover-image {

	padding: 0;

}

article .wp-block-cover-image .wp-block-cover__inner-container,

article .wp-block-cover .wp-block-cover__inner-container {

	position: absolute;

}

article table {

	max-width: 100%;

	word-break: break-word;

}

article table>tbody>tr>td,

article table>tbody>tr>th,

article table>tfoot>tr>td,

article table>tfoot>tr>th,

article table>thead>tr>td,

article table>thead>tr>th {

	padding: 1rem;

	vertical-align: top;

	border: 1px solid var(--color-border-on-foreground-deeper);

}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {

	background-color: var(--color-border-on-foreground) !important;

}

article figure.is-style-stripes table>tbody>tr>td,

article figure.is-style-stripes table>tbody>tr>th,

article figure.is-style-stripes table>tfoot>tr>td,

article figure.is-style-stripes table>tfoot>tr>th,

article figure.is-style-stripes table>thead>tr>td,

article figure.is-style-stripes table>thead>tr>th {

	border: none !important;

}

.wp-block-table.is-style-stripes {

	border-bottom: none !important;

}

article hr,

article .wp-block-separator {

	border-top: 0.0625rem solid var(--color-border-on-foreground-deeper);

	border-bottom: none;

}

/* ---------- Mermaid 图表容器样式 ---------- */
.mermaid-container {
	background: var(--color-foreground);
	border-radius: 8px;
	padding: 20px;
	margin: 20px -20px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	position: relative;
	opacity: 0;
	animation: mermaidFadeIn 0.3s ease-in-out forwards;
}

/* 需�?18.2: Mermaid 加载动画容器 */
.mermaid-loading {
	background: var(--color-foreground);
	border-radius: 8px;
	padding: 40px 20px;
	margin: 20px -20px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 150px;
}

.mermaid-loading-spinner {
	width: 40px;
	height: 40px;
	border: 3px solid rgba(94, 114, 228, 0.2);
	border-top-color: #5e72e4;
	border-radius: 50%;
	animation: mermaidSpinner 0.8s linear infinite;
}

.mermaid-loading-text {
	margin-top: 15px;
	color: #666;
	font-size: 14px;
}

html.darkmode .mermaid-loading {
	background: var(--color-widgets);
}

html.darkmode .mermaid-loading-text {
	color: #aaa;
}

html.darkmode .mermaid-loading-spinner {
	border-color: rgba(94, 114, 228, 0.3);
	border-top-color: #5e72e4;
}

/* 加载动画旋转 */
@keyframes mermaidSpinner {
	to {
		transform: rotate(360deg);
	}
}

.mermaid-container-inner {
	overflow: auto;
	transform-origin: top left;
	transition: transform 0.3s ease;
}

.mermaid-container svg {
	width: 100% !important;
	height: auto !important;
	display: block;
}

/* 缩放控制按钮 */
.mermaid-zoom-controls {
	position: absolute;
	top: 10px;
	right: 10px;
	display: flex;
	gap: 5px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	border-radius: 6px;
	padding: 5px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

.mermaid-container:hover .mermaid-zoom-controls {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

html.darkmode .mermaid-zoom-controls {
	background: rgba(30, 30, 30, 0.85);
}

.mermaid-zoom-btn {
	width: 32px;
	height: 32px;
	border: none;
	background: transparent;
	cursor: pointer;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: #5e72e4;
	transition: all 0.2s;
}

.mermaid-zoom-btn:hover {
	background: rgba(94, 114, 228, 0.1);
}

.mermaid-zoom-btn:active {
	transform: scale(0.95);
}

.mermaid-zoom-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
	pointer-events: none;
}

.mermaid-zoom-level {
	display: flex;
	align-items: center;
	padding: 0 8px;
	font-size: 13px;
	color: #666;
	min-width: 50px;
	justify-content: center;
}

html.darkmode .mermaid-zoom-level {
	color: #aaa;
}

/* 按钮 tooltip */
.mermaid-zoom-btn[title] {
	position: relative;
}

.mermaid-zoom-btn[title]::after {
	content: attr(title);
	position: absolute;
	bottom: -35px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.85);
	color: white;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 12px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
	z-index: 100;
}

.mermaid-zoom-btn[title]:hover::after {
	opacity: 1;
}

html.darkmode .mermaid-zoom-btn[title]::after {
	background: rgba(255, 255, 255, 0.9);
	color: #333;
}

/* 提示文本 */
.mermaid-hint {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.7);
	color: white;
	padding: 6px 12px;
	border-radius: 4px;
	font-size: 12px;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s;
	white-space: nowrap;
	z-index: 9;
}

.mermaid-container:hover .mermaid-hint {
	opacity: 1;
}

html.darkmode .mermaid-hint {
	background: rgba(255, 255, 255, 0.15);
	backdrop-filter: blur(10px);
}

/* 拖拽时的光标和视觉反馈 */
/* 需求 13.1, 13.2, 13.4: 优化拖拽视觉反馈 */
.mermaid-container-inner.dragging {
	cursor: grabbing !important;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.mermaid-container-inner:not(.dragging) {
	cursor: grab;
}

/* 拖拽时禁用 SVG 内的文本选择 */
.mermaid-container-inner.dragging svg {
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

/* 需求 14: Mermaid 全屏模式样式 */
.mermaid-fullscreen {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	margin: 0 !important;
	padding: 20px !important;
	z-index: 99999 !important;
	background: var(--color-foreground) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	overflow: auto !important;
}

html.darkmode .mermaid-fullscreen {
	background: var(--color-widgets) !important;
}

/* 全屏模式下的工具栏 */
.mermaid-fullscreen .mermaid-zoom-controls {
	opacity: 1;
	transform: translateY(0);
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

html.darkmode .mermaid-fullscreen .mermaid-zoom-controls {
	background: rgba(30, 30, 30, 0.95);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

/* 全屏按钮激活状态 */
.mermaid-zoom-btn[data-action="fullscreen"].active {
	background: rgba(94, 114, 228, 0.2);
	color: var(--themecolor);
}

/* 需求 15: Mermaid 导出功能样式 */
/* 导出按钮 */
.mermaid-export-btn {
	position: relative;
}

/* 导出菜单 */
.mermaid-export-menu {
	position: absolute;
	top: 45px;
	right: 10px;
	background: white;
	border-radius: 6px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.2s ease;
	z-index: 11;
	min-width: 140px;
}

.mermaid-export-menu.visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

html.darkmode .mermaid-export-menu {
	background: #2a2a2a;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

/* 导出选项按钮 */
.mermaid-export-option {
	padding: 8px 12px;
	border: none;
	background: transparent;
	color: #333;
	text-align: left;
	cursor: pointer;
	border-radius: 4px;
	font-size: 14px;
	transition: background 0.2s;
	white-space: nowrap;
}

.mermaid-export-option:hover {
	background: rgba(94, 114, 228, 0.1);
	color: var(--themecolor);
}

html.darkmode .mermaid-export-option {
	color: #ddd;
}

html.darkmode .mermaid-export-option:hover {
	background: rgba(94, 114, 228, 0.2);
}

/* 需求 15.5: 导出错误提示 */
.mermaid-export-error {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(220, 53, 69, 0.95);
	color: white;
	padding: 12px 20px;
	border-radius: 6px;
	font-size: 14px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	z-index: 100;
	animation: slideInDown 0.3s ease;
	max-width: 80%;
	text-align: center;
}

@keyframes slideInDown {
	from {
		opacity: 0;
		transform: translate(-50%, -60%);
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}

html.darkmode .mermaid-export-error {
	background: rgba(200, 35, 51, 0.95);
}

/* 全屏模式下的内部容器 */
.mermaid-fullscreen .mermaid-container-inner {
	max-height: calc(100vh - 100px);
	display: flex;
	align-items: center;
	justify-content: center;
}

/* 全屏模式下的提示文本 */
.mermaid-fullscreen .mermaid-hint {
	opacity: 1;
	bottom: 20px;
}

/* Mermaid 淡入动画 */
@keyframes mermaidFadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 文章卡片内的 Mermaid 图表 */
article.card .mermaid-container {
	margin: 20px -20px;
}

/* 响应式调整 */
/* 需求 16.1: 移动端工具栏适配 - 调整按钮大小 */
@media screen and (max-width: 768px) {
	.mermaid-container {
		margin: 15px -15px;
		padding: 15px;
	}

	article.card .mermaid-container {
		margin: 15px -15px;
	}

	/* 移动端工具栏按钮放大，便于触摸 */
	.mermaid-zoom-controls {
		padding: 8px;
		gap: 8px;
	}

	.mermaid-zoom-btn {
		width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.mermaid-zoom-level {
		font-size: 14px;
		min-width: 55px;
		padding: 0 10px;
	}

	/* 移动端提示文本调整 */
	.mermaid-hint {
		font-size: 11px;
		padding: 5px 10px;
		bottom: 8px;
	}

	/* 移动端导出菜单调整 */
	.mermaid-export-menu {
		right: 8px;
		top: 50px;
		min-width: 150px;
	}

	.mermaid-export-option {
		padding: 10px 14px;
		font-size: 15px;
	}
}

/* 需求 16.5: 横屏模式优化 - 自动调整图表布局 */
@media screen and (max-width: 768px) and (orientation: landscape) {
	.mermaid-container {
		max-height: 70vh;
		overflow-y: auto;
	}

	.mermaid-container-inner {
		max-height: 65vh;
	}

	/* 横屏时工具栏更紧凑 */
	.mermaid-zoom-controls {
		padding: 5px;
		gap: 5px;
		top: 5px;
		right: 5px;
	}

	.mermaid-zoom-btn {
		width: 36px;
		height: 36px;
		font-size: 18px;
	}

	/* 横屏时隐藏提示文本，节省空间 */
	.mermaid-hint {
		display: none;
	}
}

@media screen and (max-width: 480px) {
	.mermaid-container {
		margin: 10px -10px;
		padding: 10px;
	}

	article.card .mermaid-container {
		margin: 10px -10px;
	}

	.mermaid-zoom-controls {
		top: 5px;
		right: 5px;
		padding: 3px;
	}

	.mermaid-zoom-btn {
		width: 28px;
		height: 28px;
		font-size: 16px;
	}
}

/* ---------- Mermaid 错误提示样式 ---------- */
.mermaid-error-container {
	background: linear-gradient(135deg, #fff5f5 0%, #ffe5e5 100%);
	border: 2px solid #fc8181;
	border-left: 5px solid #e53e3e;
	border-radius: var(--card-radius);
	padding: 20px;
	margin: 20px 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	box-shadow: 0 2px 8px rgba(220, 53, 69, 0.15);
	transition: box-shadow 0.3s ease;
}

.mermaid-error-container:hover {
	box-shadow: 0 4px 12px rgba(220, 53, 69, 0.25);
}

.mermaid-error-header {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(220, 53, 69, 0.2);
}

.mermaid-error-icon {
	font-size: 28px;
	margin-right: 12px;
	animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {

	0%,
	100% {
		transform: scale(1);
		opacity: 1;
	}

	50% {
		transform: scale(1.1);
		opacity: 0.8;
	}
}

.mermaid-error-title {
	font-size: 18px;
	font-weight: bold;
	color: #c53030;
	letter-spacing: 0.3px;
}

.mermaid-error-body {
	margin-bottom: 15px;
	line-height: 1.6;
}

.mermaid-error-type {
	font-weight: bold;
	color: #742a2a;
	margin: 8px 0;
	padding: 4px 8px;
	background: rgba(220, 53, 69, 0.1);
	border-radius: 4px;
	display: inline-block;
}

.mermaid-error-message {
	color: #742a2a;
	margin: 8px 0;
	padding: 8px 12px;
	background: rgba(255, 255, 255, 0.6);
	border-radius: 4px;
	border-left: 3px solid #fc8181;
}

.mermaid-error-code {
	margin-top: 15px;
}

.mermaid-error-code summary {
	cursor: pointer;
	color: var(--themecolor);
	font-weight: bold;
	padding: 8px 12px;
	background: rgba(255, 255, 255, 0.6);
	border-radius: 4px;
	user-select: none;
	transition: all 0.2s ease;
	display: inline-block;
}

.mermaid-error-code summary:hover {
	background: rgba(255, 255, 255, 0.9);
	transform: translateX(4px);
}

.mermaid-error-code summary::marker {
	color: var(--themecolor);
}

.mermaid-error-code[open] summary {
	margin-bottom: 10px;
}

.mermaid-error-code pre {
	background: #2d3748;
	color: #e2e8f0;
	padding: 15px;
	border-radius: 6px;
	overflow-x: auto;
	margin-top: 10px;
	font-family: 'Courier New', Consolas, Monaco, monospace;
	font-size: 14px;
	line-height: 1.6;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}

.mermaid-error-code code {
	background: transparent;
	color: inherit;
	padding: 0;
}

::-webkit-scrollbar {

	width: 10px;

	height: 8px;

	background-color: rgba(0, 0, 0, 0);

}

::-webkit-scrollbar-track {

	background-color: transparent;

}

::-webkit-scrollbar-thumb {

	background-color: rgba(0, 0, 0, 0.25);

	border-radius: 100px;

	border: 2px solid transparent;

	background-clip: content-box;

}

::-webkit-scrollbar-thumb:hover {

	background-color: rgba(var(--themecolor-rgbstr), 0.7) !important;

}

*::selection {

	background-color: var(--color-selection);

}

*::-moz-selection {

	background-color: var(--color-selection);

}

*::-webkit-selection {

	background-color: var(--color-selection);

}

html.darkmode *::selection {

	background-color: var(--color-selection);

}

html.darkmode *::-moz-selection {

	background-color: var(--color-selection);

}

html.darkmode *::-webkit-selection {

	background-color: var(--color-selection);

}

html.use-serif body {

	--font: "Noto Serif SC", serif, system-ui;

}

html.use-big-shadow *.shadow-sm {

	box-shadow: 0 15px 35px rgba(50, 50, 93, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07) !important;

}

/*标题样式*/

.article-header-style-1 article h1,

.article-header-style-1 article h2,

.article-header-style-1 article h3 {

	position: relative;

}

.article-header-style-1 article h1:after,

.article-header-style-1 article h2:after,

.article-header-style-1 article h3:after {

	content: "";

	display: block;

	position: absolute;

	background: var(--themecolor);

	opacity: 0.25;

	pointer-events: none;

	border-radius: 15px;

	left: -2px;

	bottom: 0px;

}

.article-header-style-1 article h1:after {

	width: 45px;

	height: 13px;

}

.article-header-style-1 article h2:after {

	width: 40px;

	height: 11px;

}

.article-header-style-1 article h3:after {

	width: 30px;

	height: 9px;

}

.article-header-style-1 article h1.text-center:after,

.article-header-style-1 article h1[style*="text-align: center"]:after,

.article-header-style-1 article h1[style*="text-align:center"]:after,

.article-header-style-1 article h1[class*="text-align-center"]:after,

.article-header-style-1 article h2.text-center:after,

.article-header-style-1 article h2[style*="text-align: center"]:after,

.article-header-style-1 article h2[style*="text-align:center"]:after,

.article-header-style-1 article h2[class*="text-align-center"]:after,

.article-header-style-1 article h3.text-center:after,

.article-header-style-1 article h3[style*="text-align: center"]:after,

.article-header-style-1 article h3[style*="text-align:center"]:after,

.article-header-style-1 article h3[class*="text-align-center"]:after {

	left: 50%;

	transform: translateX(-50%);

}

.article-header-style-1 article h1.text-right:after,

.article-header-style-1 article h1[style*="text-align: right"]:after,

.article-header-style-1 article h1[style*="text-align:right"]:after,

.article-header-style-1 article h1[class*="text-align-right"]:after,

.article-header-style-1 article h2.text-right:after,

.article-header-style-1 article h2[style*="text-align: right"]:after,

.article-header-style-1 article h2[style*="text-align:right"]:after,

.article-header-style-1 article h2[class*="text-align-right"]:after,

.article-header-style-1 article h3.text-right:after,

.article-header-style-1 article h3[style*="text-align: right"]:after,

.article-header-style-1 article h3[style*="text-align:right"]:after,

.article-header-style-1 article h3[class*="text-align-right"]:after {

	left: unset;

	right: -2px;

}

.article-header-style-2 article h1:before,

.article-header-style-2 article h2:before,

.article-header-style-2 article h3:before {

	content: "";

	display: inline-block;

	background: var(--themecolor);

	opacity: 1;

	pointer-events: none;

	border-radius: 15px;

	width: 6px;

	vertical-align: middle;

	margin-right: 15px;

}

.article-header-style-2 article h1:before {

	height: 25px;

	transform: translateY(-1px);

}

.article-header-style-2 article h2:before {

	height: 20px;

	transform: translateY(-2px);

}

.article-header-style-2 article h3:before {

	height: 16px;

	transform: translateY(-1px);

}

.no-results header h1:after {

	display: none !important;

}

/*卡片圆角*/

.card {

	border-radius: var(--card-radius);

}

/*主题色适配*/

.text-primary {

	color: var(--themecolor) !important;

}

a,

.btn-neutral {

	color: var(--themecolor);

}

a:hover {

	color: var(--themecolor-dark);

}

a.text-primary:focus,

a.text-primary:hover {

	color: var(--themecolor) !important;

}

.btn-primary.disabled,
.btn-primary:disabled {
	border-color: var(--themecolor) !important;
	background-color: var(--themecolor) !important;
	color: #fff !important;
}

.custom-toggle input:checked+.custom-toggle-slider {
	border-color: var(--themecolor);
}

.custom-toggle input:checked+.custom-toggle-slider:before {
	background-color: var(--themecolor);
}

.btn-primary {
	border-color: var(--themecolor) !important;
	background-color: var(--themecolor) !important;
	color: #fff !important;
}

.btn-primary:hover {
	border-color: var(--themecolor-dark) !important;
	background-color: var(--themecolor-dark) !important;
	color: #fff !important;
}

.btn-primary.focus,
.btn-primary:focus {
	border-color: var(--themecolor) !important;
	background-color: var(--themecolor) !important;
	box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08), 0 0 0 0 rgba(var(--themecolor-rgbstr), 0.5) !important;
	color: #fff !important;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show>.btn-primary.dropdown-toggle {
	border-color: var(--themecolor-dark2) !important;
	background-color: var(--themecolor-dark2) !important;
	color: #fff !important;
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0 rgba(var(--themecolor-rgbstr), 0.5) !important;
}

.btn-outline-primary {
	border-color: var(--themecolor) !important;
	color: var(--themecolor) !important;
	background-color: transparent !important;
}

.btn-outline-primary:hover {
	border-color: var(--themecolor) !important;
	background-color: var(--themecolor) !important;
	color: #fff !important;
}

.btn-outline-primary.focus,
.btn-outline-primary:focus {
	box-shadow: 0 0 0 0 rgba(var(--themecolor-rgbstr), 0.5) !important;
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
	color: var(--themecolor) !important;
	background-color: transparent !important;
}

.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show>.btn-outline-primary.dropdown-toggle {
	border-color: var(--themecolor) !important;
	background-color: var(--themecolor) !important;
	color: #fff !important;
}

.btn-primary:active,
.btn-outline-primary:active {
	border-color: var(--themecolor-dark2) !important;
	background-color: var(--themecolor-dark2) !important;
}

/* 链接按钮和中性按钮主题色覆盖 */
.btn-link {
	color: var(--themecolor) !important;
}

.btn-link:hover {
	color: var(--themecolor-dark) !important;
}

.btn-neutral {
	color: var(--themecolor) !important;
}

.btn-neutral:hover {
	color: var(--themecolor-dark) !important;
}

.page-item.active .page-link,

.custom-checkbox .custom-control-input:checked~.custom-control-label::before,

.custom-checkbox .custom-control-input:indeterminate~.custom-control-label::before,

.custom-control-input:not(:disabled):active~.custom-control-label::before {

	border-color: var(--themecolor) !important;

	background-color: var(--themecolor);

}

/*页面框架*/

#content {

	padding: 0 5px;

	max-width: 1200px;

	margin: auto;

	margin-top: -30vh;

}

html.no-banner #content {

	margin-top: 85px;

}

html.banner-mini #content,

html.is-home.banner-as-cover #content {

	margin-top: unset;

}

@media screen and (min-width: 1700px) {

	#content {

		max-width: 1500px;

	}

}

@media screen and (max-width: 900px) {

	html.no-banner #content {

		margin-top: 60px;

	}

}

#primary {

	width: calc(100% - 280px);

	float: right;

}

#leftbar {

	padding-left: 20px;

	padding-right: 20px;

	width: 280px;

	float: left;

	margin-bottom: 25px;

}

#main {

	padding: 0 20px;

	overflow: visible;

	position: relative;

}

#main.waterflow {

	padding: 0;

}

.waterflow-placeholder {

	pointer-events: none;

}



/*双栏反转布局*/

html.double-column-reverse #leftbar {

	float: right;

}

html.double-column-reverse #primary {

	float: left;

}

/*单栏布局*/

html.single-column #leftbar {

	display: none;

}

/* 单栏布局 - 移动端侧边栏支持 */
@media screen and (max-width: 900px) {
	html.single-column #leftbar {
		display: block;
		position: fixed;
		background: var(--color-foreground);
		top: 0;
		left: -300px;
		height: 100%;
		padding: 0;
		overflow: auto;
		z-index: 1002;
		box-shadow: 0 15px 35px rgba(50, 50, 93, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07) !important;
		transition: all 0.3s ease;
	}

	html.single-column.leftbar-opened #leftbar {
		left: 0px;
	}

	html.single-column #fabtn_open_sidebar {
		display: block !important;
	}

	html.single-column #open_sidebar {
		visibility: visible !important;
	}
}

html.single-column #primary {

	width: 100%;

	float: none;

	max-width: 1200px;

	margin: auto;

}

html.single-column #primary.waterflow {

	max-width: 1500px;

}

html.single-column #main {

	padding: 0;

}

/* 单栏布局 - 桌面端隐藏侧边栏按钮 */
@media screen and (min-width: 901px) {
	html.single-column #fabtn_open_sidebar {
		display: none !important;
	}
}

html.single-column .page-information-card {

	width: 100%;

	max-width: 1200px;

	margin-left: auto;

	margin-right: auto;

}

/* 单栏布局 - 桌面端隐藏顶栏侧边栏按钮 */
@media screen and (min-width: 901px) {
	html.single-column #open_sidebar {
		visibility: hidden;
	}
}

/*三栏布局*/

#rightbar {

	padding-left: 0;

	padding-right: 0;

	width: 280px;

	float: right;

	margin-bottom: 25px;

}

#rightbar>.card {

	margin-left: 10px;

	margin-right: 20px;

	margin-bottom: 15px;

	padding: 20px 25px;

}

#rightbar>.card ul {

	list-style: none;

	padding-inline-start: 0;

}

#rightbar>.card ul li {

	margin-bottom: 5px;

}

#rightbar>.card>h6 {

	margin-bottom: 15px;

}

@media screen and (min-width: 1100px) {

	html.triple-column #leftbar {

		padding-right: 10px;

	}

	html.triple-column #leftbar_part2.sticky {

		width: 250px;

	}

	html.triple-column #primary {

		width: calc(100% - 560px);

		float: left;

	}

}

html.triple-column #content {

	max-width: 1500px;

}

@media screen and (min-width: 1700px) {

	html.triple-column #content {

		max-width: 1600px;

	}

}

@media screen and (max-width: 1100px) {

	#rightbar {

		display: none;

	}

}



/*Pjax加载动画 & 卡片动画*/

@keyframes card-show {

	0% {

		opacity: 0;

		transform: scale(0.95) translateY(8px);

	}

	100% {

		opacity: 1;

		transform: none;

	}

}

#primary {

	transition: all var(--animation-normal) var(--ease-standard);

}

.card {

	animation: card-show var(--animation-normal) var(--ease-emphasized-decelerate);

	transform-origin: center top;

}

.card .card {

	animation: none;

}

/*顶栏�?Banner 部分*/

#navbar-main {

	--toolbar-color: var(--themecolor-rgbstr);

}

.headroom--pinned {

	z-index: 100;

}

html.darkmode #navbar-main {

	--toolbar-color: var(--color-darkmode-toolbar);

}

@media (min-width: 1700px) {

	.navbar-main .container {

		max-width: 1500px !important;

	}

}

@media (min-width: 1200px) and (max-width: 1700px) {

	.navbar-main .container {

		max-width: 1200px !important;

	}

}

@media (min-width: 900px) {

	.navbar-main .container {

		max-width: 100%;

	}

}

.dropdown-menu .dropdown-item {

	line-height: 1.5;

}

.dropdown-item:focus,

.dropdown-item:hover {

	background: var(--color-border-on-foreground);

}

.dropdown-item:active {

	background: var(--themecolor);

}

.navbar-brand {

	text-transform: none;

	vertical-align: middle;

}

.navbar-brand:focus,

.navbar-brand:hover {

	color: #fff !important;

}

.navbar-brand.navbar-icon-mobile {

	display: none;

}

#navbar-main {

	transition: background 0s, padding 0.15s ease;

	background-color: var(--toolbar-color) !important;

	padding-top: 0.5rem;

	padding-bottom: 0.5rem;

	transition: all var(--animation-normal) var(--ease-standard);

}

#navbar-main.navbar-ontop {

	padding-top: 1rem;

	padding-bottom: 1rem;

}

body.leftbar-can-headroom.headroom---unpinned #navbar-main {

	transform: translateY(-100%);

}



#navbar_search_input_container:not(.open) {

	cursor: pointer;

}

#navbar_search_input_container .input-group {

	box-shadow: none;

	border-radius: 20px;

	overflow: hidden;

	transition: all var(--animation-normal) var(--ease-standard);

}

#navbar_search_input_container:not(.open) .input-group {

	background: transparent;

}

#navbar_search_input_container:not(.open) .input-group:hover {

	background: rgba(255, 255, 255, 0.15);

}

#navbar_search_input_container.open .input-group {

	background: rgba(255, 255, 255, 0.2);

	-webkit-backdrop-filter: blur(12px);

	backdrop-filter: blur(12px);

}

#navbar_search_input_container.open .input-group:hover,

#navbar_search_input_container.open .input-group:focus-within {

	background: rgba(255, 255, 255, 0.95);

	backdrop-filter: none;

}

#navbar_search_input_container:not(.open) .input-group-text {

	background: transparent;

	color: #fff;

}

#navbar_search_input_container.open .input-group-text {

	background: transparent;

	color: #fff;

	transition: color var(--animation-normal) var(--ease-standard);

}

#navbar_search_input_container.open .input-group:hover .input-group-text,

#navbar_search_input_container.open .input-group:focus-within .input-group-text {

	color: #666;

}

#navbar_search_input_container .input-group-text i.fa {
	font-size: 16px;
	line-height: 1;
}

#navbar_search_input_container:not(.open) input.form-control {

	width: 0 !important;

	padding: 0 !important;

	background: transparent;

}

#navbar_search_input_container.open input.form-control {

	background: transparent;

	color: #fff;

	transition: color var(--animation-normal) var(--ease-standard);

}

#navbar_search_input_container.open input.form-control::placeholder {

	color: rgba(255, 255, 255, 0.7);

	transition: color var(--animation-normal) var(--ease-standard);

}

#navbar_search_input_container.open .input-group:hover input.form-control,

#navbar_search_input_container.open .input-group:focus-within input.form-control {

	color: #333;

}

#navbar_search_input_container.open .input-group:hover input.form-control::placeholder,

#navbar_search_input_container.open .input-group:focus-within input.form-control::placeholder {

	color: #999;

}

#navbar_search_input_container .input-group-prepend {

	margin-right: 0px;

}

#navbar_search_input_container .input-group-text {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 0.625rem;
	padding-bottom: 0.625rem;
	transition: all var(--animation-slow) var(--ease-emphasized);
}

#navbar_search_input_container input.form-control {
	width: 200px;
	padding-top: 0.625rem;
	padding-bottom: 0.625rem;
	line-height: 1.5;
	transition: all 0.5s cubic-bezier(0.4, 0, 0, 1);
}

#navbar_search_btn_mobile {

	display: none;

}

#navbar_menu_mask {

	display: none;

}

html.navbar-absolute #navbar-main {

	position: absolute !important;

}

html.navbar-absolute:not(.no-banner) #navbar-main {

	background-color: transparent;

	box-shadow: none;

}

html.no-banner #navbar-main {

	background-color: rgba(var(--themecolor-rgbstr), 0.82) !important;

}

html.no-banner.toolbar-blur #navbar-main {

	background-color: rgba(var(--themecolor-rgbstr), 0.6) !important;

	-webkit-backdrop-filter: blur(20px) saturate(130%);

	backdrop-filter: blur(20px) saturate(130%);

}

html.no-banner.toolbar-blur #navbar-main.navbar-no-blur {

	background-color: rgba(var(--themecolor-rgbstr), 0.85) !important;

	backdrop-filter: blur(0px);

}

.banner {

	margin-bottom: 25px;

	height: 71.8vh;

	overflow: hidden;

	background-position: center;

	background-repeat: no-repeat;

	background-size: cover;

}

.banner-container {

	height: calc(40vh - 120px) !important;

}

.banner-title {

	font-size: 1.8em;

	vertical-align: middle;

	position: absolute;

	top: 50%;

	transform: translateY(-50%);

	width: 100%;

	left: 0;

}

.banner-subtitle {

	margin-top: 10px;

	font-size: 16px;

	opacity: 0.9;

}

.banner-title-inner.typing-effect:after,

.banner-subtitle.typing-effect:after {

	content: "";

	width: 0px;

	height: 30px;

	display: inline-block;

	transform: translateX(5px) translateY(5px);

	animation: cursor-flash-effect 1s;

	animation-fill-mode: forwards;

	outline: 1px solid #fff;

	animation-iteration-count: var(--animation-cnt);

}

.banner-subtitle.typing-effect:after {

	height: 16px;

	transform: translateX(5px) translateY(2px);

	outline: 0.5px solid #fff;

	opacity: 0.9;

}

@keyframes cursor-flash-effect {

	0% {

		opacity: 0;

	}

	15% {

		opacity: 1;

	}

	50% {

		opacity: 1;

	}

	65% {

		opacity: 0;

	}

	100% {

		opacity: 0;

	}

}

html.no-banner .banner {

	display: none;

}

html.banner-mini .banner {

	height: unset;

}

html.banner-mini .banner>.banner-container {

	height: unset !important;

}

html.banner-mini .banner>.banner-container>.banner-title {

	position: unset;

	top: unset;

	transform: unset;

}

html.is-home.banner-as-cover.banner-as-cover .banner {

	height: 100vh;

}

html.is-home.banner-as-cover.banner-as-cover .banner-container {

	height: 100% !important;

}

.cover-scroll-down {

	display: block;

	width: max-content;

	color: #fff;

	position: absolute;

	left: 50%;

	bottom: 10px;

	transform: translateX(-50%);

	cursor: pointer;

	font-size: 36px;

	transition: opacity 0.3s ease;

}

html:not(.is-home) .cover-scroll-down {

	opacity: 0;

	pointer-events: none;

}

.cover-scroll-down.hidden {

	opacity: 0;

	pointer-events: none;

}



/* 左侧�?*/

.leftbar-banner {

	/*background: linear-gradient(150deg,#7795f8 15%,#6772e5 70%,#555abf 94%);*/

	background: var(--themecolor-gradient);

	text-align: center;

	border-radius: var(--card-radius) var(--card-radius) 0 0;

}

.leftbar-banner-title {

	font-size: 20px;

	display: block;

}

.leftbar-banner-subtitle {

	margin-top: 15px;

	margin-bottom: 8px;

	font-size: 13px;

	opacity: 0.8;

	display: block;

}



.leftbar-menu {

	margin-top: 10px;

	margin-left: 0;

	margin-right: 0;

	padding: 0;

}

.leftbar-menu-item {

	height: 36px;

	line-height: 36px;

	list-style: none;

	padding: 0;

	position: relative;

}

.leftbar-menu-item:hover>.leftbar-menu-subitem {

	opacity: 1;

	transform: none;

	pointer-events: unset;

}

.leftbar-menu-subitem {

	position: absolute;

	left: calc(100% + 8px);

	top: 0;

	background: var(--color-foreground);

	width: max-content;

	min-width: 150px;

	z-index: 1;

	height: unset;

	border-radius: 3px;

	padding: 6px 0;

	opacity: 0;

	transform: translateX(-8px);

	pointer-events: none;

	transition: all 0.3s ease;

}

.leftbar-menu-subitem:before {

	content: "";

	width: 8px;

	height: calc(100% + 12px);

	display: block;

	position: absolute;

	top: 0;

	left: -8px;

}

#leftbar_part1_menu>.leftbar-menu-item>.leftbar-menu-subitem {

	left: calc(100% + 12px);

}

#leftbar_part1_menu>.leftbar-menu-item>.leftbar-menu-subitem:before {

	width: 12px;

	left: -12px;

}

.leftbar-menu-subitem>.leftbar-menu-item:first-child a {

	border-radius: 3px 3px 0 0;

}

.leftbar-menu-subitem>.leftbar-menu-item:last-child a {

	border-radius: 0 0 3px 3px;

}

.leftbar-menu-item>a {

	display: block;

	height: 100%;

	width: 100%;

	margin: 0;

	padding: 0 20px;

	overflow-wrap: break-word;

	word-wrap: break-word;

	background-color: transparent;

	color: #32325d !important;

	text-decoration: none;

	outline: none;

	cursor: pointer;

	font-size: 14px;

	transition: background var(--animation-fast) var(--ease-standard);

}

.leftbar-menu-item>a:hover,

.leftbar-menu-item.current>a {

	background-color: var(--color-border-on-foreground);

}

.leftbar-menu-item>a>i {

	margin-right: 8px;

	width: 15px;

	text-align: center;

}

.leftbar-menu-item.leftbar-menu-item-haschildren:after {

	content: "\f0da";

	font: normal normal normal 14px/1 FontAwesome;

	font-size: 14px;

	text-rendering: auto;

	-webkit-font-smoothing: antialiased;

	-moz-osx-font-smoothing: grayscale;

	position: absolute;

	right: 16px;

	top: 0;

	line-height: 36px;

	opacity: 0.6;

	transform: translateY(1px);

	transition: all 0.3s ease;

	pointer-events: none;

}



.leftbar-search-button {

	padding-top: 0;

	transition: all 0.3s cubic-bezier(0.4, 0, 0, 1);

}

.leftbar-search-button.open {

	padding: 0 15px 18px 15px;

	margin-top: -9px;

}

#leftbar_search_container {

	transition: width var(--animation-normal) var(--ease-emphasized), height var(--animation-normal) var(--ease-emphasized), box-shadow var(--animation-fast) var(--ease-standard),

		transform var(--animation-fast) var(--ease-standard);

	height: 30px;

	transform: unset !important;

	text-transform: capitalize;

	background-color: var(--color-border-on-foreground-deeper);

	color: var(--color-text-deeper);

}

html.darkmode.amoled-dark #leftbar_search_container {

	background: #151515;

}

.leftbar-search-button.open #leftbar_search_container {

	height: 45px;

}

.leftbar-search-button:not(.open) #leftbar_search_container:focus-within {

	box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);

}

#leftbar_search_input {

	position: absolute;

	left: -1px;

	top: -1px;

	width: calc(100% + 2px);

	height: calc(100% + 2px);

	transition: all 0.3s cubic-bezier(0.4, 0, 0, 1);

	opacity: 0;

	cursor: pointer;

	user-select: none;

}

.leftbar-search-button.open #leftbar_search_input {

	opacity: 1;

	cursor: text;

	user-select: all;

	box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);

}



#leftbar_part2 {

	margin-top: 10px;

	transition: all var(--animation-normal) var(--ease-standard);

}

#leftbar_part2.sticky {

	position: fixed;

	width: 240px;

	top: 80px;

}

body.leftbar-can-headroom.headroom---unpinned #leftbar_part2.sticky {

	top: 10px;

}

html.navbar-absolute #leftbar_part2.sticky {

	top: 10px !important;

}

#leftbar_part2_inner {
	padding: 10px;
}

#leftbar_part2.sticky #leftbar_part2_inner {
	max-height: calc(100vh - 110px - var(--leftbar-part3-height, 0px));
}

/* 只有文章目录标签需要滚�?*/
#leftbar_part2.sticky #leftbar_tab_catalog {
	max-height: calc(100vh - 200px - var(--leftbar-part3-height, 0px));
	overflow-y: auto;
}

#leftbar_tab_catalog::-webkit-scrollbar {
	width: 6px;
}

#leftbar_tab_catalog::-webkit-scrollbar-track {
	background: transparent;
}

#leftbar_tab_catalog::-webkit-scrollbar-thumb {
	border-width: 1px;
	background-color: rgba(0, 0, 0, 0.2);
}

html.darkmode #leftbar_tab_catalog::-webkit-scrollbar-thumb {
	border-width: 1px;
	background-color: rgba(255, 255, 255, 0.2);
}

#leftbar_tab_catalog::-webkit-scrollbar-button {
	height: 5px;
	pointer-events: none;
}

.sidebar-tab-switcher {

	font-size: 13px;

	padding: 0 !important;

}

.sidebar-tab-switcher>a {

	padding-bottom: 5px;

	border-bottom: 1px solid transparent;

	transition: border-bottom var(--animation-fast) var(--ease-standard);

}

.sidebar-tab-switcher>a.active {

	border-bottom: 1px solid var(--themecolor);

}

html.darkmode .sidebar-tab-switcher>a.active {

	border-bottom: 1px solid var(--themecolor-light);

}



#leftbar_overview_author_image {

	width: 100px;

	height: 100px;

	margin: auto;

	background-position: center;

	background-repeat: no-repeat;

	background-size: cover;

	background-color: rgba(127, 127, 127, 0.1);

}

#leftbar_overview_author_name {

	margin-top: 15px;

	font-size: 18px;

}

#leftbar_overview_author_description {

	font-size: 14px;

	margin-top: -4px;

	opacity: 0.8;

}

.site-state {

	overflow: hidden;

	line-height: 1.4;

	white-space: nowrap;

	text-align: center;

	margin-top: 15px;

}

.site-state-item {

	display: inline-block;

	border-left: 1px solid var(--color-border-on-foreground-deeper);

	padding: 0 10px;

}

.site-state-item:first-child {

	border-left: none !important;

}

.site-state-item>a {

	cursor: pointer;

}

.site-state-item-count {

	display: block;

	text-align: center;

	color: #32325d;

	font-weight: bold;

	font-size: 16px;

}

.site-state-item-name {

	font-size: 13px;

	color: #525f82;

}

.tag.badge {

	font-size: 14px;

	text-transform: none;

	transition: background var(--animation-fast) var(--ease-standard);

	background: var(--color-border-on-foreground);

	border: 1px solid var(--color-border-on-foreground-deeper);

	padding: 5px 10px;

	margin-right: 12px;

	margin-bottom: 15px;

}

.tag.badge:hover {

	background: var(--color-border-on-foreground-deeper);

}

.tag-num {

	font-size: 12px;

	opacity: 0.7;

}

.site-author-links {

	display: flex;

	flex-wrap: wrap;

	justify-content: left;

	margin-top: 15px;

}

.site-author-links-item {

	display: inline-block;

	width: 50%;

	border-radius: 4px;

	margin-top: 5px;

	transition: background var(--animation-fast) var(--ease-standard);

	background: transparent;

}

.site-author-links-item:hover {

	background: var(--color-border-on-foreground);

}

.site-author-links-item>a {

	display: block;

	width: 100%;

	padding: 2px 8px;

	font-size: 15px;

	color: #32325d !important;

	text-align: left;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

}

.site-friend-links-title {

	margin-top: 25px;

	border-top: 1px dotted var(--color-border-on-foreground-deeper);

	padding-top: 15px;

}

.site-friend-links-ul {

	margin-top: 8px;

	padding: 3px 0 0;

}

.site-friend-links-item {

	margin: 0;

	padding: 0;

	list-style: none;

	margin-bottom: 3px;

}

.site-friend-links-item>a {

	max-width: 280px;

	box-sizing: border-box;

	display: inline-block;

	max-width: 100%;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

	color: #32325d;

	border-bottom: 1px solid #999;

}

#leftbar_announcement {

	margin-bottom: 10px;

	background: var(--themecolor-gradient);

}

html.darkmode #leftbar_announcement {

	background: var(--color-foreground);

}

.leftbar-announcement-body {

	padding: 15px 1.2em;

	padding-bottom: 22px;

}

.leftbar-announcement-title {

	font-size: 18px;

}

.leftbar-announcement-content {

	font-size: 15px;

	line-height: 1.8;

	padding-top: 8px;

	opacity: 0.9;

}

#leftbar_tab_tools ul,

#leftbar_tab_tools ol {

	list-style: none;

	padding: 0;

}

#leftbar_tab_tools ul li {

	padding-top: 10px;

	padding-bottom: 10px;

	border-bottom: var(--color-border-on-foreground) solid 1px;

}

#leftbar_tab_tools ul li:first-child {

	padding-top: 5px;

}

#leftbar_tab_tools>div>h6:first-child,

#leftbar_tab_tools .wp-block-group__inner-container>h6:first-child {

	font-size: 17px;

	font-weight: 600;

	position: relative;

	display: block;

	width: max-content;

}

#leftbar_tab_tools>div>h6:first-child:after,

#leftbar_tab_tools .wp-block-group__inner-container>h6:first-child:after {

	content: "";

	display: block;

	background: var(--themecolor);

	width: 30px;

	height: 9px;

	position: absolute;

	left: 0;

	bottom: -1px;

	border-radius: 10px;

	opacity: 0.25;

	pointer-events: none;

}

.wp-calendar-table caption {

	font-size: 14px;

	text-align: center;

	opacity: 0.7;

}

.wp-block-calendar table * {

	background: transparent !important;

	border: none !important;

	padding-top: 5px;

	padding-bottom: 8px;

}

.wp-block-calendar table th {

	opacity: 0.6;

}

.wp-block-calendar tbody td a {

	position: relative;

	text-decoration: none;

}

.wp-block-calendar tbody td a:before {

	content: "";

	display: block;

	background: var(--themecolor);

	position: absolute;

	width: 25px;

	height: 25px;

	border-radius: 20px;

	opacity: 0.2;

	transform: translateX(-2px);

	z-index: 0;

}

.wp-calendar-nav-prev a,

.wp-calendar-nav-next a {

	text-decoration: none !important;

	border: 1px solid var(--themecolor);

	color: var(--themecolor);

	padding: 1px 8px;

	border-radius: 19px;

	font-size: 14px;

	transition: all var(--animation-normal) var(--ease-standard);

	user-select: none;

}

.wp-calendar-nav-prev a:hover,

.wp-calendar-nav-next a:hover {

	background-color: var(--themecolor);

	color: #fff !important;

	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;

}

.wp-calendar-nav {

	padding-bottom: 12px;

	display: flex;

	flex-direction: row;

	flex-wrap: nowrap;

	justify-content: center;

	align-items: center;

	align-content: center;

}

html.darkmode .wp-calendar-table caption,

html.darkmode .wp-block-calendar tbody td {

	color: #eee;

}

/*底栏*/

#footer {

	background: var(--themecolor-gradient);

	color: #fff;

	width: 100%;

	float: right;

	margin-bottom: 25px;

	text-align: center;

	padding: 3px 20px 20px;

	line-height: 1.8;

	transition: none;

	user-select: none;

	-webkit-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

}

#footer a {

	color: #fff;

}



/* ========================================
   浮动按钮组件 (Float Action Buttons)
   ======================================== */

/* 容器样式 */
#float_action_buttons {
	position: fixed;
	bottom: 35px;
	right: 20px;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	align-items: center;
	transition:
		opacity var(--animation-normal) var(--ease-standard),
		transform var(--animation-normal) var(--ease-standard);
}

#float_action_buttons.fabtns-float-left {
	left: 20px;
	right: auto;
}

#float_action_buttons.fabtns-float-left .fabtn-show-on-right {
	display: none;
}

#float_action_buttons:not(.fabtns-float-left) .fabtn-show-on-left {
	display: none;
}

/* 首页横幅模式下隐�?*/
html.is-home.banner-as-cover #float_action_buttons.hidden {
	opacity: 0;
	pointer-events: none;
}

/* 加载状�?- 初始隐藏 */
.fabtns-unloaded {
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--animation-normal) var(--ease-standard);
}

/* 基础按钮样式 - 重置所�?Bootstrap 样式 */
#float_action_buttons .fabtn,
#float_action_buttons .fabtn.btn,
#float_action_buttons .fabtn.btn-icon,
#float_action_buttons .fabtn.btn-neutral,
#float_action_buttons button.fabtn {
	width: 44px !important;
	height: 44px !important;
	min-width: 44px !important;
	min-height: 44px !important;
	max-width: 44px !important;
	max-height: 44px !important;
	padding: 0 !important;
	margin: 5px 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative;
	overflow: visible;
	border: none !important;
	border-radius: var(--card-radius) !important;
	background-color: var(--color-foreground) !important;
	color: var(--themecolor) !important;
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.08),
		0 4px 16px rgba(0, 0, 0, 0.04);
	cursor: pointer;
	transition:
		background-color var(--animation-fast) var(--ease-standard),
		color var(--animation-fast) var(--ease-standard),
		transform var(--animation-normal) var(--ease-spring),
		box-shadow var(--animation-normal) var(--ease-standard),
		opacity var(--animation-fast) var(--ease-standard);
}

#float_action_buttons .fabtn:first-child {
	margin-top: 0 !important;
}

#float_action_buttons .fabtn:hover {
	color: #fff !important;
	background-color: var(--themecolor) !important;
	transform: translateY(-3px) scale(1.05);
	box-shadow:
		0 6px 20px rgba(var(--themecolor-rgbstr), 0.35),
		0 12px 28px rgba(var(--themecolor-rgbstr), 0.2) !important;
}

#float_action_buttons .fabtn:active {
	color: #fff !important;
	background-color: var(--themecolor-dark) !important;
	transform: translateY(-1px) scale(0.98);
	box-shadow:
		0 2px 8px rgba(var(--themecolor-rgbstr), 0.25) !important;
}

/* 按钮内图标居�?*/
#float_action_buttons .fabtn .btn-inner--icon {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100%;
	height: 100%;
}

#float_action_buttons .fabtn i {
	font-size: 16px;
	line-height: 1;
}

/* 隐藏状�?*/
#float_action_buttons .fabtn.fabtn-hidden {
	width: 0 !important;
	height: 0 !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: 0 !important;
	max-height: 0 !important;
	opacity: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	pointer-events: none !important;
	transform: scale(0) !important;
	overflow: hidden !important;
}

/* 左右切换按钮 - 尺寸较小 */
#float_action_buttons #fabtn_toggle_sides,
#float_action_buttons #fabtn_toggle_sides.btn {
	width: 32px !important;
	height: 32px !important;
	min-width: 32px !important;
	min-height: 32px !important;
	max-width: 32px !important;
	max-height: 32px !important;
	border-radius: var(--card-radius) !important;
	opacity: 0.6;
	font-size: 11px;
}

#float_action_buttons #fabtn_toggle_sides:hover {
	opacity: 1;
}

/* 阅读进度按钮 */
#float_action_buttons #fabtn_reading_progress {
	overflow: visible;
	font-size: 11px;
	font-weight: 600;
}

#float_action_buttons #fabtn_reading_progress_bar {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	border-radius: var(--card-radius);
	background: var(--themecolor);
	opacity: 0.12;
	transition: width var(--animation-fast) var(--ease-standard);
	pointer-events: none;
}

#float_action_buttons #fabtn_reading_progress_details {
	position: relative;
	z-index: 1;
}

/* 夜间模式按钮图标切换 */
#float_action_buttons #fabtn_toggle_darkmode i.fa {
	margin: 0;
}

#float_action_buttons #fabtn_toggle_darkmode i.fa-lightbulb-o {
	display: none;
}

html.darkmode #float_action_buttons #fabtn_toggle_darkmode i.fa-moon-o {
	display: none;
}

html.darkmode #float_action_buttons #fabtn_toggle_darkmode i.fa-lightbulb-o {
	display: inline-block;
}

/* 侧边栏打开按钮（移动端�?*/
#float_action_buttons #fabtn_open_sidebar {
	display: none;
}

/* 侧边栏遮�?*/
#sidebar_mask {
	display: none;
	opacity: 0;
}

/* 设置弹窗 */
#fabtn_blog_settings_popup {
	position: fixed;
	right: 85px;
	bottom: 35px;
	padding: 20px 24px;
	width: max-content;
	width: -moz-max-content;
	min-width: 350px;
	max-width: calc(100vw - 170px);
	max-height: calc(100vh - 70px);
	opacity: 0;
	pointer-events: none;
	transform: translateX(12px) scale(0.96);
	transition:
		opacity var(--animation-normal) var(--ease-emphasized),
		transform var(--animation-normal) var(--ease-emphasized);
	animation: none !important;
	border-radius: 20px;
	background: var(--color-foreground);
	box-shadow:
		0 12px 40px rgba(0, 0, 0, 0.15),
		0 4px 12px rgba(0, 0, 0, 0.08);

	-webkit-backdrop-filter: blur(24px) saturate(180%);

	backdrop-filter: blur(24px) saturate(180%);
	overflow-y: auto;
}

#float_action_buttons.fabtns-float-left #fabtn_blog_settings_popup {
	left: 85px;
	right: unset;
	transform: translateX(-12px) scale(0.96);
}

/* 设置弹窗打开状�?*/
.blog_settings_opened #fabtn_blog_settings_popup {
	opacity: 1 !important;
	transform: none !important;
	pointer-events: auto !important;
}

.blog_settings_opened #fabtn_toggle_blog_settings_popup {
	opacity: 1 !important;
	color: #fff !important;
	background-color: var(--themecolor) !important;
	pointer-events: auto !important;
	transform: scale(1.05);
}

.blog_settings_opened .fabtn {
	pointer-events: none;
	opacity: 0.3;
}

.blog_settings_opened #fabtn_toggle_sides {
	opacity: 0 !important;
}

#close_blog_settings {
	text-align: right;
	font-size: 12px;
	margin-right: -12px;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity var(--animation-fast) var(--ease-standard);
}

#close_blog_settings:hover {
	opacity: 1;
}

/* 暗色模式浮动按钮 */
html.darkmode .fabtn {
	color: #ddd;
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.2),
		0 4px 16px rgba(0, 0, 0, 0.15);
}

html.darkmode .fabtn:hover {
	color: #fff !important;
	background-color: var(--themecolor) !important;
	box-shadow:
		0 6px 20px rgba(var(--themecolor-rgbstr), 0.4),
		0 12px 28px rgba(0, 0, 0, 0.3) !important;
}

html.darkmode #fabtn_blog_settings_popup {
	box-shadow:
		0 12px 40px rgba(0, 0, 0, 0.4),
		0 4px 12px rgba(0, 0, 0, 0.25);
}

.blog-setting-item {
	display: flex;
	flex-flow: row;
	align-items: center;
	padding: 10px 0;
}

/* 设置面板标题样式 */
.blog-setting-item>div:first-child {
	font-weight: 500;
	color: var(--color-text-deeper);
}

#blog_setting_toggle_darkmode_and_amoledarkmode {

	cursor: pointer;

}

html:not(.amoled-dark) #blog_setting_toggle_darkmode_and_amoledarkmode span:nth-of-type(2) {

	display: none;

}

html.amoled-dark #blog_setting_toggle_darkmode_and_amoledarkmode span:first-of-type {

	display: none;

}

#blog_setting_toggle_darkmode_and_amoledarkmode:before {

	content: attr(tooltip-switch-to-blackmode);

	position: absolute;

	top: -32px;

	left: 50%;

	line-height: 22px;

	font-weight: normal;

	color: #fff;

	background: #32325d;

	padding: 3px 10px;

	font-size: 12px;

	border-radius: 3px;

	transition: all 0.3s ease;

	transform: translateX(-50%) translateY(5px);

	opacity: 0;

	width: max-content;

	width: -moz-max-content;

	pointer-events: none;

}

html.amoled-dark #blog_setting_toggle_darkmode_and_amoledarkmode:before {

	content: attr(tooltip-switch-to-darkmode);

}

#blog_setting_toggle_darkmode_and_amoledarkmode:hover:before {

	transform: translateX(-50%);

	opacity: 0.7;

}

.blog-setting-font,

.blog-setting-shadow {

	text-transform: none;

	padding: 3px 10px;

}

.blog-setting-font:hover,

.blog-setting-shadow:hover {

	color: #fff
		/*var(--themecolor)*/
	;

	/*background-color: transparent !important;*/

}

/* 设置面板分段选择器优�?*/
.blog-setting-selector-left {

	margin-right: 0 !important;

	border-top-right-radius: 0;

	border-bottom-right-radius: 0;

	transform: none !important;

	border-radius: 8px 0 0 8px;

	padding: 8px 14px;

	font-size: 13px;

	font-weight: 500;

	transition: all var(--animation-fast) var(--ease-standard);

}

.blog-setting-selector-right {

	border-top-left-radius: 0;

	border-bottom-left-radius: 0;

	margin-left: 0 !important;

	transform: none !important;

	border-left: 0;

	border-radius: 0 8px 8px 0;

	padding: 8px 14px;

	font-size: 13px;

	font-weight: 500;

	transition: all var(--animation-fast) var(--ease-standard);

}

html:not(.use-serif) #blog_setting_font_sans_serif {

	color: #fff;

	background: var(--themecolor);

	box-shadow: 0 2px 6px rgba(var(--themecolor-rgbstr), 0.3);

}

html.use-serif #blog_setting_font_serif {

	color: #fff;

	background: var(--themecolor);

	box-shadow: 0 2px 6px rgba(var(--themecolor-rgbstr), 0.3);

}

html:not(.use-big-shadow) #blog_setting_shadow_small {

	color: #fff;

	background: var(--themecolor);

	box-shadow: 0 2px 6px rgba(var(--themecolor-rgbstr), 0.3);

}

html.use-big-shadow #blog_setting_shadow_big {

	color: #fff;

	background: var(--themecolor);

	box-shadow: 0 2px 6px rgba(var(--themecolor-rgbstr), 0.3);

}

.blog-setting-filter-btn {

	border-radius: 12px;

	outline: none !important;

	border: 2px solid transparent;

	height: 44px;

	width: 44px;

	margin-left: 6px;

	cursor: pointer;

	font-size: 12px;

	font-weight: 500;

	transition: all var(--animation-fast) var(--ease-standard);

}

.blog-setting-filter-btn:hover {

	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);

	transform: translateY(-2px);

}

#blog_setting_filter_off {

	background: rgba(var(--themecolor-rgbstr), 0.05);

	color: var(--themecolor);

}

#blog_setting_filter_sunset {

	background: rgba(255, 255, 200, 1);

	color: #6e5a00;

}

#blog_setting_filter_darkness {

	background: rgba(80, 80, 80, 0.7);

	color: #eee;

}

#blog_setting_filter_grayscale {

	background: rgba(200, 200, 200, 0.8);

	color: #333;

}

#blog_setting_filter_off.active {

	border: 1px solid var(--themecolor);

}

#blog_setting_filter_sunset.active {

	border: 1px solid #6e5a00;

}

#blog_setting_filter_darkness.active {

	border: 1px solid #111;

}

#blog_setting_filter_grayscale.active {

	border: 1px solid #333;

}

/* 风格选择按钮 */
.blog-setting-style-btn {
	border-radius: 8px;
	outline: none !important;
	border: 1px solid transparent;
	height: 36px;
	padding: 0 12px;
	margin-left: 5px;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	transition: all var(--animation-fast) var(--ease-standard);
	background: rgba(var(--themecolor-rgbstr), 0.08);
	color: var(--themecolor);
}

.blog-setting-style-btn:hover {
	background: rgba(var(--themecolor-rgbstr), 0.15);
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.15);
}

.blog-setting-style-btn.active {
	background: var(--themecolor);
	color: #fff;
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.3);
}

html.darkmode .blog-setting-style-btn {
	background: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.9);
}

html.darkmode .blog-setting-style-btn:hover {
	background: rgba(255, 255, 255, 0.15);
}

html.darkmode .blog-setting-style-btn.active {
	background: var(--themecolor);
	color: #fff;
}

html.filter-sunset {

	filter: sepia(30%);

}

html.filter-darkness #primary:after {

	content: "";

	position: fixed;

	left: 0;

	top: 0;

	right: 0;

	bottom: 0;

	height: 100vh;

	width: 100vw;

	background: rgba(0, 0, 0, 0.4);

	z-index: 999999999;

	pointer-events: none;

}

html.filter-grayscale {

	filter: grayscale(1);

}

#blog_setting_card_radius_to_default {

	position: relative;

}

#blog_setting_card_radius_to_default:before {

	content: attr(tooltip);

	position: absolute;

	top: -30px;

	left: 50%;

	line-height: 15px;

	font-weight: normal;

	color: #fff;

	background: #32325d;

	padding: 3px 10px;

	font-size: 12px;

	border-radius: 3px;

	transition: all 0.3s ease;

	transform: translateX(-50%) translateY(5px);

	opacity: 0;

	width: max-content;

	width: -moz-max-content;

	pointer-events: none;

}

#blog_setting_card_radius_to_default:hover:before {

	transform: translateX(-50%);

	opacity: 0.7;

}

/*页码*/

.pagination {

	width: max-content;

	width: -moz-max-content;

	padding-top: 15px;

	padding-bottom: 15px;

	margin: auto;

	margin-bottom: 25px;

}

.pagination.pagination-mobile {

	display: none;

}

.page-link {

	transition: background-color var(--animation-fast) var(--ease-standard);

}



/*文章*/

.post {

	margin-bottom: 25px;

	padding: 30px 30px;

	padding-bottom: 35px;

}

.post-preview {

	transition: all var(--animation-slow) var(--ease-emphasized);

}

.post-title {

	font-size: 26px;

	letter-spacing: 0.5px;

	transition: all var(--animation-normal) var(--ease-standard);

}

.post-title:hover {

	letter-spacing: 1px;

}

#main.waterflow .post-title {

	transition: all var(--animation-normal) var(--ease-standard);

	display: inline-block;

}

#main.waterflow .post-title:hover {

	letter-spacing: 0.5px;

	transform: scale(1.02);

	text-rendering: optimizeLegibility;

}

.post-header {

	margin-bottom: 12px;

}

.post-meta {

	margin-top: 6px;

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	justify-content: center;

	gap: 6px;

}

.post-meta-detail {

	font-size: 14.5px;

	line-height: 24px;

	opacity: 0.8;

	display: inline-block;

	white-space: nowrap;

}

.post-meta-detail i {

	margin-right: 3px;

}

.post-meta-devide {

	display: inline-block;

	font-size: 14.5px;

	line-height: 24px;

	opacity: 0.5;

	user-select: none;

}

.post-meta-detail-categories-space {

	margin-left: 2px;

	margin-right: 2px;

}

.post-header.post-header-with-thumbnail {

	margin: -30px -30px 35px -30px;

	border-radius: var(--card-radius) var(--card-radius) 0 0;

	overflow: hidden;

	position: relative;

}

.post-thumbnail {

	width: 100%;

	min-height: 250px;

	max-height: 25vh;

	object-fit: cover;

	pointer-events: none;

}

/* 图片加载过渡效果 */
.post-thumbnail {
	transition: opacity 0.3s ease 0s;
}

.single .post-thumbnail,

.page .post-thumbnail {

	max-height: 30vh;

	min-height: 250px;

}

.post-header.post-header-with-thumbnail .post-header-text-container {

	position: absolute;

	bottom: 0;

	left: 0;

	width: 100%;

	color: #fff;

	opacity: 0.9;

	padding-bottom: 35px;

	padding-top: 35px;

	background: rgba(0, 0, 0, 0.05);

	background: linear-gradient(to top, rgba(0, 0, 0, 0.3) 20%, rgba(0, 0, 0, 0));

}

.post-header.post-header-with-thumbnail .post-header-text-container .post-title {

	color: rgba(255, 255, 255, 0.95) !important;

	/*text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.3);*/

	filter: drop-shadow(0px 1px 5px #0005);

}

.post-header.post-header-with-thumbnail .post-header-text-container .post-meta {

	text-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);

}

.post-outdated-info {

	color: var(--themecolor);

	border-left: 2px solid var(--themecolor);

	padding: 5px 20px;

	margin-top: 10px;

	margin-bottom: 25px;

	background: rgba(var(--themecolor-rgbstr), 0.1);

}

.post-outdated-info>i {

	font-size: 20px;

	margin-right: 15px;

	transform: translateY(2px);

}

.post-header-with-thumbnail+.post-content>.post-outdated-info {

	margin-top: -15px;

}

.post-content {

	line-height: 1.8;

	margin-bottom: 8px;

}

.post-content p {

	font-weight: normal;

}

.post-tags {

	margin-top: 10px;

	margin-bottom: -4px;

}

.post-tags>i {

	margin-right: 5px;

}

.tag.post-meta-detail-tag {

	margin-bottom: 4px;

	margin-right: 7px;

	font-size: 12px;

}

.additional-content-after-post+.post-tags {

	margin-top: 12px;

}

/* 文章预览样式 2 */

article.post-preview-layout-2 {

	display: flex;

	flex-direction: row;

	padding: 0;

	min-height: 200px;

	overflow: visible;

}

article.post-preview-layout-2 .post-header.post-header-with-thumbnail {

	margin: 0;

	border-radius: var(--card-radius) 0 0 var(--card-radius);

	text-align: left;

	width: 300px;

	height: 200px;

	flex-shrink: 0;

	overflow: hidden;

}

article.post-preview-layout-2 .post-thumbnail {

	width: 100%;

	height: 200px !important;

	max-height: 200px !important;

	object-fit: cover;

	object-position: center center;

}

article.post-preview-layout-2 .post-content-container {

	padding: 20px 28px;

	flex: 1;

	display: flex;

	flex-direction: column;

	max-width: 100%;

	overflow: hidden;

}

article.post-preview-layout-2 .post-content {

	flex: 1;

	margin-top: 10px;

	display: -webkit-box;

	-webkit-line-clamp: 3;

	-webkit-box-orient: vertical;

	overflow: hidden;

}

article.post-preview-layout-2 .post-title {
	max-width: max-content;
}

article.post-preview-layout-2 .post-meta {
	justify-content: flex-start;
}

/* 文章预览样式 3 */

article.post-preview-layout-3 .post-header {

	margin-bottom: 10px;

}

article.post-preview-layout-3 .post-header.post-header-with-thumbnail {

	margin-bottom: 25px;

}

article.post-preview-layout-3 .post-thumbnail {

	max-height: 20vh;

}

/*Reference*/

sup.reference {

	white-space: nowrap;

	transition: box-shadow 0.3s ease;

	border-radius: 1px;

}

sup.reference:focus {

	box-shadow: 0 0 0 2px var(--color-widgets), 0 0 0 4px rgba(var(--themecolor-rgbstr), 0.3);

	outline: none;

}

.tippy-box[data-theme~="scroll-y"] .tippy-content {

	max-height: 200px;

	overflow-y: auto;

}

.tippy-box[data-theme~="light"] {

	background-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"][data-placement^="top"]>.tippy-arrow:before {

	border-top-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"][data-placement^="bottom"]>.tippy-arrow:before {

	border-bottom-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"][data-placement^="left"]>.tippy-arrow:before {

	border-left-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"][data-placement^="right"]>.tippy-arrow:before {

	border-right-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"]>.tippy-backdrop {

	background-color: var(--color-widgets);

}

.tippy-box[data-theme~="light"]>.tippy-svg-arrow {

	fill: var(--color-widgets);

}



html.darkmode .tippy-box[data-theme~="light"] {

	color: #eee;

	background-color: var(--color-widgets);

}

.reference-list {

	padding-left: 0;

	list-style: inside none;

	counter-reset: ol;

	margin-bottom: 0;

}

.reference-list li {

	font-size: 14px;

	position: relative;

	display: flex;

}

.reference-list li .space {

	pointer-events: none;

}

.reference-list li .space:before {

	content: "";

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	display: block;

	border-radius: 3px;

	transition: background 0.3s ease;

	pointer-events: none;

	background: transparent;

}

.reference-list li .space:focus:before {

	background: rgba(var(--themecolor-rgbstr), 0.15);

}

.reference-list li:before {

	text-align: right;

	counter-increment: ol;

	content: counter(ol) ". ";

	white-space: pre;

}

.reference-list li>div>*:first-child {

	margin-right: 5px;

}

.reference-list li>div>sup {

	margin-left: 1px;

}

.reference-list li>div>sup:last-of-type {

	margin-right: 5px;

}

/*文章输入密码界面*/

.post-password-form {

	margin-top: 45px;

	margin-bottom: 55px;

}

.post-password-form-text {

	margin: auto;

	margin-bottom: 15px;

}

.post-password-form-input {

	margin: auto;

	margin-bottom: 20px;

}

.post-password-hint {

	margin-top: 10px;

	color: var(--themecolor);

	opacity: 0.9;

}

/*侧栏文章目录*/

#leftbar_catalog {
	margin-left: -5px;
	width: calc(100% + 0px);
	height: auto;
}

#leftbar_catalog::-webkit-scrollbar {
	width: 4px;
}

#leftbar_catalog::-webkit-scrollbar-track {
	background: transparent;
}

#leftbar_catalog::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.15);
	border-radius: 2px;
}

html.darkmode #leftbar_catalog::-webkit-scrollbar-thumb {
	background-color: rgba(255, 255, 255, 0.15);
}

#leftbar_catalog ul {
	padding: 0;
	list-style: none;
}

#leftbar_catalog .index-item,

#leftbar_catalog .index-link {

	width: 100%;

	display: block;

	color: #32325d;

	text-decoration: none;

	box-sizing: border-box;

}

#leftbar_catalog .index-link {

	font-size: 15px;

	padding: 4px 8px 4px 8px;

	cursor: pointer;

	transition: background-color 0.3s ease, border-left-color 0.3s ease, color 0.3s ease;

	border-left: 3px solid transparent;

	word-break: break-all;

	border-radius: 3px;

}

#leftbar_catalog .index-item.current>.index-link {

	color: var(--themecolor);

	font-weight: bold;

}

#leftbar_catalog .index-link:hover {

	background-color: var(--color-border-on-foreground-deeper);

}

#leftbar_catalog .index-subItem-box .index-item {

	padding-left: 20px;

}



/*搜索等页面的标题卡片*/

.page-information-card {

	margin: 30px 20px;

	margin-top: 0px;

	background: var(--color-foreground) !important;

}

.search-filter-wrapper {

	display: inline-block;

	margin-right: 12px;

}

.search-filter-wrapper>.custom-control-label {

	line-height: 25px;

}



/*文章导航 (�?下一篇文�?*/

.post-navigation {

	margin-bottom: 25px;

	padding: 30px 25px;

	padding-top: 25px;

	font-size: 18px;

	display: block !important;

}

.post-navigation-item {

	width: calc(50%);

	display: inline-block;

	vertical-align: top;

}

.page-navigation-extra-text {

	font-size: 22px;

	opacity: 0.85;

	display: block;

	margin-bottom: 15px;

}

.post-navigation-pre .page-navigation-extra-text i {

	margin-right: 10px;

}

.post-navigation-next .page-navigation-extra-text i {

	margin-left: 10px;

}

.post-navigation-pre {

	padding-right: 10px;

}

.post-navigation-next {

	padding-left: 10px;

	text-align: right;

}

/*相关文章*/

.related-posts {

	display: block;

	white-space: nowrap;

	margin-bottom: 25px;

	padding: 0;

	padding-bottom: 0;

}

.related-post-card {

	display: inline-block;

	height: 105px;

	width: 180px;

	border-radius: 5px;

	margin-right: 10px;

	font-size: 16px;

	line-height: 27px;

	white-space: normal;

	transition: all 0.3s ease;

	position: relative;

	background: var(--themecolor-gradient);

	overflow: hidden;

}

.related-post-card:hover {

	filter: brightness(0.9);

	box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);

	border-color: transparent;

}

.related-post-title.clamp {

	color: white;

}

.related-post-card-container {

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	padding: 10px 15px;

}

.related-post-card-container.has-thumbnail {

	background: rgba(0, 0, 0, 0.2);

	color: #fff;

	transition: all 0.3s ease;

}

.related-post-card-container.has-thumbnail:hover {

	background: rgba(0, 0, 0, 0.3);

}

.related-post-title {

	max-height: 81px;

	overflow: hidden;

}

.related-post-arrow {

	position: absolute;

	right: 15px;

	bottom: 15px;

	font-size: 15px;

	pointer-events: none;

}

.related-post-thumbnail {

	width: 100%;

	height: 100%;

	object-fit: cover;

}

i.related-post-arrow.fa.fa-chevron-right {

	color: white;

}

img.related-post-thumbnail {

	vertical-align: unset;

}

html.darkmode a.related-post-card {

	background: var(--color-border-on-foreground-deeper);

	opacity: 0.7;

	border-radius: 5px;

}

html.darkmode .related-post-title.clamp {

	color: var(--themecolor-light);

}

html.darkmode .has-thumbnail .related-post-title.clamp {

	color: #eee;

}

/*文章赞赏*/

.post-donate {

	text-align: center;

	position: relative;

}

.post-donate img {

	/*width: max-content;

	width: -moz-max-content;*/

	max-width: min(30vw, 500px);

}

.post-donate .donate-qrcode {

	width: max-content;

	width: -moz-max-content;

	position: absolute;

	left: 50%;

	bottom: 100px;

	padding: 25px;

	z-index: 2;

	transition: all 0.3s ease;

	transform: translate(-50%, 10px) scale(0.9);

	transform-origin: bottom;

	opacity: 0;

	pointer-events: none;

	background-color: var(--color-widgets) !important;

}

.post-donate .donate-btn:focus~.donate-qrcode {

	transform: translateX(-50%);

	opacity: 1;

}

.post-donate .donate-btn {

	margin-right: 0;

	margin-top: 12px;

	margin-bottom: 12px;

}

.post-donate .donate-qrcode:before {

	position: absolute;

	z-index: 3;

	bottom: 0;

	left: 50%;

	display: block;

	width: 16px;

	height: 16px;

	content: "";

	transform: translate(-50%, 8px) rotate(-45deg);

	border-radius: 0.2rem;

	background: var(--color-widgets);

	z-index: 1;

	box-shadow: -2px 2px 5px 0px rgba(0, 0, 0, 0.1);

}

/*文末附加内容*/

.additional-content-after-post {

	border-left: 3px solid var(--themecolor);

	padding: 15px 20px;

	background: rgba(var(--themecolor-rgbstr), 0.1);

	border-radius: 3px;

	margin-top: 8px;

}

/*评论�?/

#comments {

	margin-bottom: 25px;

}

/* 评论折叠功能 - Material 3 动画优化 */
#comments,
#post_comment {
	transition:
		opacity var(--animation-normal) var(--ease-standard),
		max-height var(--animation-slow) var(--ease-emphasized),
		margin var(--animation-slow) var(--ease-standard),
		padding var(--animation-slow) var(--ease-standard);
	will-change: opacity, max-height;
}

#comments.comments-collapsed,
#post_comment.comments-collapsed {
	overflow: hidden;
}

#comments.comments-collapsed {
	max-height: 0 !important;
	opacity: 0;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	border: none !important;
	transition-delay: 0.15s;
}

#post_comment.comments-collapsed {
	max-height: 0 !important;
	opacity: 0;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	border: none !important;
	transition-delay: 0s;
}

#comments:not(.comments-collapsed) {
	max-height: 9999px;
	opacity: 1;
	transition-delay: 0s;
}

#post_comment:not(.comments-collapsed) {
	max-height: 9999px;
	opacity: 1;
	transition-delay: 0.15s;
}

/* 评论切换按钮图标动画 */
#comments_toggle .btn-inner--icon i {
	transition: transform var(--animation-slow) var(--ease-spring);
	display: inline-block;
}

#comments_toggle.expanded .btn-inner--icon i {
	transform: rotate(360deg);
}

#comments>.card-body {

	transition: opacity 0.5s ease;

	overflow: visible;

}

#comments.comments-loading>.card-body {

	opacity: 0.5;

	pointer-events: none;

}

#comments li {

	list-style: none;

	position: relative;

}

#comments .comment-item:target:before,
#comments .comment-item:before {

	content: "";

	display: block;

	position: absolute;

	left: -10px;

	right: -10px;

	top: 0;

	bottom: 0;

	background-color: var(--themecolor);

	opacity: 0.15;

	border-radius: var(--card-radius);

	pointer-events: none;

	animation: comment-focus-breath 2s linear;

	animation-fill-mode: forwards;

}

#comments .comment-item:before {

	animation: none;

	opacity: 0;

	transition: opacity 0.25s ease;

}

#comments .comment-item.highlight:before {

	opacity: 0.2;

}

@keyframes comment-focus-breath {

	0% {

		opacity: 0.5;

	}

	33% {

		opacity: 0.05;

	}

	66% {

		opacity: 0.3;

	}

	100% {

		opacity: 0.15;

	}

}

.comments-title {

	font-size: 20px;

}

.comments-title i {

	margin-right: 5px;

}

.comment-list {

	padding: 0;

}

.comment-item {

	margin-bottom: 1px;

	display: flex;

	overflow: visible;

}

/* ---------- 评论项左侧区�?---------- */
.comment-item-left-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 44px;
	margin-top: 20px;
	margin-right: 16px;
	position: relative;
	min-height: 80px;
	overflow: visible;
	flex-shrink: 0;
}

.comment-avatar-vertical-center .comment-item-left-wrapper {
	margin: auto;
	margin-right: 16px;
}

/* ---------- 评论头像 ---------- */
.comment-item-avatar {
	position: relative;
	z-index: 1;
}

.comment-item-avatar .avatar {
	height: 44px;
	width: 44px;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: transform var(--animation-fast, 0.15s) var(--ease-standard, ease),
		box-shadow var(--animation-fast, 0.15s) var(--ease-standard, ease);
}

.comment-item:hover .comment-item-avatar .avatar {
	transform: scale(1.05);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

html.darkmode .comment-item-avatar .avatar {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.text-avatar {
	user-select: none;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 16px;
}

/* ---------- 评论项内容区�?---------- */
.comment-item-inner {
	display: block;
	position: relative;
	margin-top: 20px;
	padding-bottom: 40px;
	border-bottom: var(--color-border-on-foreground) solid 1px;
	width: calc(100% - 60px);
	flex: 1;
	min-width: 0;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: break-word;
}

#comments .comment-item:last-child .comment-item-inner {
	border-bottom: 0;
}

/* ---------- 评论标题区域 ---------- */
.comment-item-title {
	font-size: 15px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 6px;
	gap: 4px;
}

.comment-item-title .badge-admin,
.comment-item-title .badge-pinned,
.comment-item-title .badge-private-comment,
.comment-item-title .badge-unapproved {
	transform: translateY(-1px);
	margin-left: 4px;
	font-size: 11px;
	padding: 2px 6px;
}

/* ---------- 评论内容 ---------- */
.comment-item-text {
	min-height: 24px;
	margin-bottom: 1rem;
	overflow-wrap: break-word;
	word-wrap: break-word;
	word-break: break-word;
	line-height: 1.7;
	color: var(--color-text);
}

.comment-item-text p:last-child {
	margin-bottom: 0;
}

/* ---------- 评论作者信�?---------- */
.comment-name {
	flex: 1;
	font-weight: 600;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
}

.comment-author {
	display: inline-block;
	color: var(--color-text);
	transition: color var(--animation-fast, 0.15s) ease;
}

.comment-author a {
	color: inherit;
	text-decoration: none;
}

.comment-author a:hover {
	color: var(--themecolor);
}

.comment-parent-info {
	display: inline-block;
	opacity: 0.5;
	margin-left: 2px;
	transition: opacity var(--animation-fast, 0.15s) ease;
	font-weight: normal;
	font-size: 13px;
}

.comment-item:hover .comment-parent-info {
	opacity: 0.75;
}

/* ---------- 评论元信�?---------- */
.comment-info {
	margin-top: 2px;
	font-size: 12px;
	font-weight: normal;
	margin-left: 3px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	opacity: 0.6;
}

.comment-info>div {
	display: inline-block;
	white-space: nowrap;
	flex-shrink: 0;
}

.comment-time {
	position: relative;
	cursor: default;
}

.comment-time-details {
	pointer-events: none;
	position: absolute;
	top: -35px;
	right: 0;
	width: max-content;
	width: -moz-max-content;
	line-height: 22px;
	color: #fff;
	background: #32325d;
	padding: 3px 10px;
	font-size: 12px;
	border-radius: var(--m3-shape-sm, 6px);
	transition: all var(--animation-fast, 0.15s) var(--ease-standard, ease);
	transform: translateY(5px);
	opacity: 0;
	z-index: 10;
}

.comment-time:hover .comment-time-details {
	transform: translateY(0);
	opacity: 0.9;
}

.comment-edited {
	margin-right: 3px;
	opacity: 0.8;
}

.comment-edited>i {
	margin-right: 4px;
}

.comment-edited.comment-edithistory-accessible {
	cursor: pointer;
	transition: opacity var(--animation-fast, 0.15s) ease;
}

.comment-edited.comment-edithistory-accessible:hover {
	opacity: 1;
}

/* ---------- 评论操作按钮 ---------- */
.comment-operations {
	position: absolute;
	right: 0;
	bottom: 8px;
	font-size: 12px;
	padding: 4px 8px;
	transition: all var(--animation-fast, 0.15s) var(--ease-standard, ease);
	opacity: 0;
	transform: translateY(4px);
	display: flex;
	gap: 6px;
	background: var(--color-widgets);
	border-radius: var(--m3-shape-sm, 6px);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	pointer-events: none;
}

.comment-item:hover .comment-operations {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

html.darkmode .comment-operations {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.comment-operations .btn {
	padding: 4px 10px;
	font-size: 12px;
	border-radius: var(--m3-shape-sm, 6px);
	transition: all var(--animation-fast, 0.15s) var(--ease-standard, ease);
}

.comment-operations .btn:hover {
	opacity: 0.8;
}

/* ---------- 评论 UA 信息 ---------- */
.comment-useragent {
	display: inline-flex;
	align-items: center;
	font-weight: normal;
	padding-left: 4px;
	font-size: 13px;
	flex-shrink: 0;
	opacity: 0.5;
	transition: opacity var(--animation-fast, 0.15s) ease;
}

.comment-item:hover .comment-useragent {
	opacity: 0.7;
}

.comment-useragent>svg {
	height: 16px;
	width: 16px;
	transform: translateY(-1px);
	margin-left: 4px;
	margin-right: 1px;
	flex-shrink: 0;
}

/* ---------- 评论点赞按钮 ---------- */
.comment-upvote {
	white-space: nowrap;
	border-radius: var(--m3-shape-full, 100px);
	height: 32px;
	line-height: 30px;
	padding: 0 12px;
	border: none !important;
	color: var(--themecolor);
	background-color: rgba(var(--themecolor-rgbstr), 0.12);
	text-align: center;
	position: absolute;
	left: 50%;
	top: 48px;
	transform: translateX(-50%) !important;
	min-width: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--animation-fast, 0.15s) var(--ease-standard, ease);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.comment-upvote .btn-inner--icon {
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform var(--animation-fast, 0.15s) var(--ease-spring, ease);
}

.comment-upvote .btn-inner--icon i {
	font-size: 14px;
}

.comment-upvote .btn-inner--text {
	margin-left: 0 !important;
	margin-right: 0 !important;
	font-variant-numeric: tabular-nums;
	display: inline-block !important;
}

.comment-upvote .comment-upvote-num {
	min-width: 12px;
	text-align: center;
	display: inline-block;
}

html.darkmode .comment-upvote {
	background-color: rgba(var(--themecolor-rgbstr), 0.2);
	color: var(--themecolor-light);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.comment-upvote:hover {
	background-color: rgba(var(--themecolor-rgbstr), 0.25) !important;
	color: var(--themecolor) !important;
	transform: translateX(-50%) scale(1.05) !important;
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.25);
}

.comment-upvote:hover .btn-inner--icon {
	transform: translateY(-2px);
}

html.darkmode .comment-upvote:hover {
	background-color: rgba(var(--themecolor-rgbstr), 0.35) !important;
	color: var(--themecolor-light) !important;
}

.comment-upvote:active {
	transform: translateX(-50%) scale(0.95) !important;
}

.comment-upvote.upvoted {
	color: #fff !important;
	background-color: var(--themecolor) !important;
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.4);
}

.comment-upvote.upvoted:hover {
	background-color: var(--themecolor-dark) !important;
	color: #fff !important;
	transform: translateX(-50%) scale(1.05) !important;
	cursor: pointer;
}

.comment-upvote.comment-upvoting {
	opacity: 0.6;
	pointer-events: none;
}

.comment-upvote.comment-upvoting .btn-inner--icon i {
	animation: upvote-pulse 0.6s ease infinite;
}

@keyframes upvote-pulse {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.2);
	}
}

/*评论内容*/

.comment-item-text .comment-sticker {

	max-height: 60px;

	transition: all 0.3s ease;

	transition-delay: 0s;

	transform: none;

}

.comment-item-text .comment-sticker:active {

	transition-delay: 0.3s;

	transform: scale(2);

	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15);

	background: var(--color-widgets);

}

.comment-item-text .comment-image br {

	display: none;

}

.comment-item-text .comment-image {

	color: var(--themecolor) !important;

	cursor: pointer;

	user-select: none;

	position: relative;

}

.comment-image-preview-mask {

	display: none;

}

.comment-item-text .comment-image.comment-image-preview-zoomed .comment-image-preview-mask {

	display: block;

	background: transparent;

	position: fixed;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	width: 100vw;

	height: 100vh;

	z-index: 1501;

	cursor: zoom-out;

}

.comment-item-text .comment-image .comment-image-preview {

	width: 22px;

	height: 22px;

	position: absolute;

	left: 0;

	opacity: 0;

	/*pointer-events: none;*/

}

.comment-item-text .comment-image.comment-image-preview-zoomed .comment-image-preview {

	z-index: 1502;

	opacity: 1;

	pointer-events: unset;

}

.comment-item-text b,

.comment-item-text strong {

	font-weight: 600;

	opacity: 0.78;

}

.comment-item-text pre {

	font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",

		"DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier,

		monospace;

	font-size: 14px;

	line-height: 1.375;

	text-align: left;

	white-space: pre;

	word-spacing: normal;

	word-break: normal;

	tab-size: 4;

	hyphens: none;

	color: #5e6687;

	background: var(--color-widgets);

	direction: ltr;

	border: 1px solid var(--color-border-on-foreground);

	padding: 14px;

	border-radius: 3px;

	margin-top: 15px;

}

html.darkmode .comment-item-text pre {

	color: #eee;

}

.comment-item-text blockquote {

	padding-left: 1.2em;

	margin: 1em 3em 1em 0;

	font-weight: 400;

	border-left: 3px solid rgba(0, 0, 0, 0.12);

}

html.darkmode .comment-item-text blockquote {

	border-color: rgba(255, 255, 255, 0.2);

}

.comment-item-text ol li {

	list-style-type: decimal !important;

}

.comment-item-text ul,

.comment-item-text ol {

	padding-inline-start: 20px;

}

.comment-item-text ul li {

	list-style-type: disc !important;

}

.comment-item-text ul ul li {

	list-style-type: square !important;

}

.comment-item-text h1,

.comment-item-text h2,

.comment-item-text h3,

.comment-item-text h4,

.comment-item-text h5,

.comment-item-text h6 {

	font-weight: 600;

	opacity: 0.6;

	font-size: inherit;

	margin-top: 10px;

	margin-bottom: 5px;

	transition: opacity 0.3s ease;

}

.comment-item-text:hover h1,

.comment-item-text:hover h2,

.comment-item-text:hover h3,

.comment-item-text:hover h4,

.comment-item-text:hover h5,

.comment-item-text:hover h6 {

	font-weight: 600;

	opacity: 0.8;

}

.comment-item-text h1 {

	font-size: 20px;

}

.comment-item-text h2 {

	font-size: 19px;

}

.comment-item-text h3 {

	font-size: 18px;

}

.comment-item-text h4 {

	font-size: 17px;

}

.comment-item-text h5 {

	font-size: 16px;

}

.comment-item-text h6 {

	font-size: 15px;

}

/*评论折叠*/

.comment-item-inner.comment-folded {

	max-height: 200px;

	overflow: hidden;

}

.comment-item-inner.comment-folded:after {

	content: "";

	display: block;

	position: absolute;

	left: 0;

	right: 0;

	bottom: 0;

	height: 80px;

	background: linear-gradient(180deg, transparent 0%, var(--color-foreground) 100%);

	pointer-events: none;

}

.comment-item-inner.comment-folded .comment-operations {

	display: none;

}

.comment-item-inner.comment-folded .show-full-comment {

	position: absolute;

	bottom: 0;

	left: 0;

	right: 0;

	height: 35px;

	color: var(--themecolor);

	z-index: 2;

	text-align: left;

	cursor: pointer;

	user-select: none;

	opacity: 0.6;

	transition: opacity 0.25s ease;

}

.comment-item-inner.comment-folded:hover .show-full-comment {

	opacity: 1;

}

.comment-item-inner:not(.comment-folded) .show-full-comment {

	display: none;

}

/*评论区页�?/

.comments-navigation .page-item > div {

	cursor: pointer;

}

/*评论区更�?/

#comments_more {

	width: 52px;

	height: 52px;

	display: block;

	margin: 30px auto 10px auto;

}

#comments_more:disabled {

	animation: breath 2s ease infinite;

}

@keyframes breath {

	0% {

		transform: scale(1);

	}

	50% {

		transform: scale(1.2);

	}

	100% {

		transform: scale(1);

	}

}

.comments-navigation-more .comments-navigation-nomore {

	text-align: center;

	margin-top: 30px;

	margin-bottom: 10px;

	opacity: 0.6;

}

/*评论编辑记录*/

.comment-edit-history-item {

	border-bottom: 1px solid #e9ecef;

	margin-bottom: 22px;

	padding-bottom: 30px;

	padding-left: 5px;

	padding-right: 5px;

}

html.darkmode .comment-edit-history-item {

	border-bottom-color: #666;

}

.comment-edit-history-title {

	margin-bottom: 6px;

}

.comment-edit-history-id {

	font-size: 22px;

	font-weight: bold;

	display: inline-block;

}

.comment-edit-history-title .badge {

	transform: translateY(-3px);

	margin-left: 8px;

	display: inline-block;

}

.comment-edit-history-time {

	opacity: 0.6;

	font-size: 15px;

	margin-bottom: 12px;

}

#comment_edit_history .modal-body .comment-edit-history-item:last-child {

	border: navajowhite;

	padding-bottom: 0;

}

/*发送评论区�?/

#post_comment {

	margin-bottom: 25px;

}

/* 发送评论卡片优�?*/
#post_comment.card {
	border-radius: 16px;
	padding: 20px;
	background: var(--color-foreground);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.04),
		0 8px 24px rgba(0, 0, 0, 0.06);
	transition:
		box-shadow var(--animation-normal) var(--ease-standard),
		transform var(--animation-normal) var(--ease-standard);
}

#post_comment.card .card-body {
	padding: 0;
}

#post_comment.card:hover {
	box-shadow:
		0 4px 12px rgba(0, 0, 0, 0.06),
		0 12px 32px rgba(0, 0, 0, 0.08);
}

html.darkmode #post_comment.card {
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.2),
		0 8px 24px rgba(0, 0, 0, 0.15);
}

html.darkmode #post_comment.card:hover {
	box-shadow:
		0 4px 12px rgba(0, 0, 0, 0.25),
		0 12px 32px rgba(0, 0, 0, 0.2);
}

.post-comment-title {

	font-size: 18px;
	font-weight: 600;
	margin-bottom: 12px;

}

.post-comment-title i {

	margin-right: 8px;
	color: var(--themecolor);

}

/* ---------- 评论回复提示�?---------- */
.post-comment-reply {
	margin-top: 12px;
	margin-bottom: 12px;
	border-radius: 12px;
	overflow: hidden;
	background: linear-gradient(135deg, rgba(var(--themecolor-rgbstr), 0.08) 0%, rgba(var(--themecolor-rgbstr), 0.03) 100%);
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.15);
	transform-origin: top center;
}

.post-comment-reply-header {
	display: flex;
	align-items: center;
	padding: 12px 16px;
	gap: 12px;
	background: rgba(var(--themecolor-rgbstr), 0.05);
	border-bottom: 1px solid rgba(var(--themecolor-rgbstr), 0.1);
}

.post-comment-reply-icon {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--themecolor);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	flex-shrink: 0;
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.3);
}

.post-comment-reply-meta {
	flex: 1;
	min-width: 0;
}

.post-comment-reply-label {
	font-size: 12px;
	color: var(--color-text-light, #8898aa);
	display: block;
	line-height: 1.2;
}

.post-comment-reply-name {
	font-size: 14px;
	font-weight: 600;
	color: var(--themecolor);
	display: block;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.post-comment-reply-close {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: none;
	background: rgba(var(--themecolor-rgbstr), 0.1);
	color: var(--themecolor);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	flex-shrink: 0;
	transition: all 0.2s ease;
}

.post-comment-reply-close:hover {
	background: var(--themecolor);
	color: #fff;
	transform: rotate(90deg);
}

.post-comment-reply-preview {
	padding: 12px 16px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--color-text, #525f7f);
	max-height: 80px;
	overflow: hidden;
	position: relative;
	background: rgba(255, 255, 255, 0.5);
}

html.darkmode .post-comment-reply-preview {
	background: rgba(0, 0, 0, 0.2);
}

.post-comment-reply-preview::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 30px;
	background: linear-gradient(180deg, transparent 0%, rgba(var(--themecolor-rgbstr), 0.05) 100%);
	pointer-events: none;
}

/* 回复框动�?*/
@keyframes replySlideIn {
	from {
		opacity: 0;
		transform: scaleY(0.8) translateY(-10px);
	}

	to {
		opacity: 1;
		transform: scaleY(1) translateY(0);
	}
}

@keyframes replySlideOut {
	from {
		opacity: 1;
		transform: scaleY(1) translateY(0);
	}

	to {
		opacity: 0;
		transform: scaleY(0.8) translateY(-10px);
	}
}

.post-comment-reply.reply-entering {
	animation: replySlideIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.post-comment-reply.reply-leaving {
	animation: replySlideOut 0.2s ease-out forwards;
}

#post_comment_reply_cancel {
	margin-top: 10px;
	border-radius: 8px;
	padding: 6px 14px;
	font-size: 13px;
}

#post_comment_content {

	transition: height 0.15s ease, box-shadow var(--animation-normal) var(--ease-standard), border-color var(--animation-normal) var(--ease-standard);

	overflow: hidden;

	min-height: 80px;

	resize: none;

	white-space: pre-wrap;

	word-wrap: break-word;

	margin-bottom: 12px;

	margin-top: 0;

	border-radius: 10px;

	border: 1px solid var(--color-border-on-foreground-deeper);

	padding: 12px 14px;

	font-size: 14px;

	line-height: 1.6;

	background-color: var(--color-widgets);

}

#post_comment_content:focus {
	border-color: var(--themecolor);
	box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.1);
}

/* 评论表单输入框统一样式 */
#post_comment .input-group-alternative {
	margin-bottom: 12px !important;
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid var(--color-border-on-foreground-deeper);
	box-shadow: none;
	background-color: var(--color-widgets);
	transition: border-color var(--animation-normal) var(--ease-standard), box-shadow var(--animation-normal) var(--ease-standard);
}

#post_comment .input-group-alternative:focus-within {
	border-color: var(--themecolor);
	box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.1);
}

#post_comment .input-group-alternative .input-group-text {
	background-color: transparent;
	border: none;
	color: var(--themecolor);
	padding: 10px 12px;
}

#post_comment .input-group-alternative .form-control {
	border: none;
	background-color: transparent;
	padding: 10px 12px 10px 0;
	height: auto;
	font-size: 14px;
}

#post_comment .input-group-alternative .form-control:focus {
	box-shadow: none;
}

#post_comment_content_hidden {

	font-family: inherit !important;

	font-weight: 400;

	line-height: 1.5;

	font-size: 14px;

	padding: 0.625rem 0.75rem;

	width: calc(100% - 30px);

	overflow: hidden;

	white-space: pre-wrap;

	word-wrap: break-word;

	position: absolute;

	pointer-events: none;

	opacity: 0;

}

.post-comment-link-container:before,

.post-comment-captcha-container:before,

#post_comment_toggle_extra_input:before,

.comment-post-checkbox:before {

	pointer-events: none;

	position: absolute;

	top: -35px;

	left: 0px;

	line-height: 25px;

	font-weight: normal;

	color: #fff;

	background: #32325d;

	padding: 3px 10px;

	font-size: 14px;

	border-radius: 3px;

	z-index: 3;

	transition: all 0.3s ease;

	transform: translateY(5px);

	opacity: 0;

	width: max-content;

	width: -moz-max-content;

}

.post-comment-link-container:hover:before,

.post-comment-link-container.active:before,

.post-comment-captcha-container:hover:before,

.post-comment-captcha-container.active:before,

#post_comment_toggle_extra_input:hover:before,

.comment-post-checkbox:hover:before {

	transform: translateY(0);

	opacity: 0.7;

}

.post-comment-link-container:before {

	content: "http(s)://";

}

#post_comment_toggle_extra_input:before {

	content: attr(tooltip-show-extra-field);

	text-transform: none;

}

.show-extra-input #post_comment_toggle_extra_input:before {

	content: attr(tooltip-hide-extra-field);

}

#post_comment_toggle_extra_input {

	border-radius: 100px;

	padding: 5px 20px;

}

#post_comment_toggle_extra_input i {

	transition: all 0.3s ease;

}

.show-extra-input #post_comment_toggle_extra_input i {

	transform: rotateZ(180deg);

}

#post_comment.logged #post_comment_name,

#post_comment.logged #post_comment_email {

	opacity: 1;

	background-color: var(--color-widgets-disabled);

	pointer-events: none;

}

.comment-post-checkbox {

	display: inline-block;

	margin-top: 8px;

	height: 28px;

	margin-right: 8px;

}

.comment-post-checkbox .custom-control-label {

	line-height: 26px;

	font-size: 13px;

}

#post_comment.post-comment-force-privatemode-on .comment-post-privatemode {

	opacity: 0.6;

	pointer-events: none;

}

#post_comment.post-comment-force-privatemode-on .comment-post-privatemode .custom-control-label::before {

	border-color: var(--themecolor);

	background-color: var(--themecolor);

	color: #fff;

	box-shadow: none;

}

#post_comment.post-comment-force-privatemode-on .comment-post-privatemode .custom-control-label::after {

	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e");

}

#post_comment.post-comment-force-privatemode-off .comment-post-privatemode {

	opacity: 0.6;

	pointer-events: none;

}

#post_comment.post-comment-force-privatemode-off .comment-post-privatemode .custom-control-label::before {

	border-color: var(--color-widgets-disabled);

}

html.darkmode #post_comment.post-comment-force-privatemode-off .comment-post-privatemode .custom-control-label::before {

	background: #555;

	border-color: #666;

}

#post_comment.post-comment-force-privatemode-off .comment-post-privatemode .custom-control-label::after {

	background-image: unset;

}

.comment-post-privatemode:before {

	content: attr(tooltip);

}

.comment-post-mailnotice:before {

	content: attr(tooltip);

}

#post_comment.sending .comment-post-checkbox {

	opacity: 0.6;

	pointer-events: none;

}

.comment-btn {

	margin-top: 0;

	margin-right: 8px;

}

/*发送评论区�?编辑评论*/

#post_comment:not(.editing) .hide-on-comment-not-editing {

	display: none !important;

}

#post_comment.editing .hide-on-comment-editing {

	display: none !important;

}

#post_comment.editing .comment-post-use-markdown {

	pointer-events: none;

	opacity: 0.6;

}

#post_comment.editing .comment-post-mailnotice {

	display: none;

}

/*评论表情*/

#comment_emotion_btn {

	border-radius: 100px;

	width: 38px;

	height: 38px;

	padding: 0;

	font-size: 22px;

	background: transparent !important;

	box-shadow: none;

	color: inherit;

	border: none;

	transform: none;

	opacity: 0.7;

	margin-top: 0;

	margin-right: 8px;

	transition: all 0.3s ease;

}

#comment_emotion_btn:hover {
	opacity: 1;
	color: var(--themecolor);
}

#comment_emotion_btn.comment-emotion-keyboard-open {

	border-radius: 100px;

	color: var(--themecolor);

	opacity: 1;

}

.emotion-keyboard {

	max-width: min(500px, calc(100vw - 40px));

	min-width: min(300px, calc(100vw - 40px));

	display: flex;

	height: 300px;

	flex-direction: column;

	overflow: hidden;

	position: absolute;

	z-index: 2;

	right: 0;

	bottom: -10px;

	transform: translateY(100%) scale(0.9);

	transform-origin: top;

	transition: all 0.3s ease;

	opacity: 0;

	pointer-events: none;

}

#comment_emotion_btn.comment-emotion-keyboard-open+.emotion-keyboard {

	opacity: 1;

	transform: translateY(100%);

	pointer-events: all;

}

.emotion-keyboard-content {

	flex: 1;

	overflow-y: auto;

}

.emotion-group {

	padding: 15px 15px;

	padding-bottom: 10px;

}

.emotion-item {

	display: inline-block;

	background: var(--color-border-on-foreground);

	border-radius: 5px;

	user-select: none;

	margin-right: 12px;

	margin-bottom: 12px;

	padding: 2px 10px;

	cursor: pointer;

	transition: all 0.3s ease;

}

.emotion-item.emotion-item-sticker {

	padding: 2px;

	background: rgba(126, 126, 126, 0.15);

}

.emotion-item>img {

	max-height: 60px;

	border-radius: 3px;

	transition: filter 0.3s ease, transform 0.3s ease;

	transition-delay: 0s;

	background: var(--color-widgets);

}

.emotion-item.emotion-item-sticker:hover>img[src^="data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nI"] {

	filter: brightness(2);

}

.emotion-item:hover {

	background: var(--themecolor);

	color: #fff;

}

.emotion-group:active .emotion-item:hover>img:not([src^="data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iZW1vdGlvbi1sb2FkaW5nI"]) {

	transition: all 0.3s ease;

	transition-delay: 0.3s;

	transform: scale(1.5);

	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.15);

}

.emotion-group-description {

	text-align: right;

	font-size: 14px;

	opacity: 0.6;

}

.emotion-keyboard-bar {

	overflow-x: auto;

	white-space: nowrap;

	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.06);

	transform: scaleY(-1);

}

.emotion-keyboard-bar::-webkit-scrollbar-track {

	background: transparent;

}

.emotion-keyboard-bar::-webkit-scrollbar {

	height: 5px;

}

.emotion-keyboard-bar::-webkit-scrollbar-thumb {

	background-color: rgba(0, 0, 0, 0.2);

	border: none;

}

.emotion-keyboard-bar::-webkit-scrollbar-thumb:hover {

	background-color: var(--themecolor);

}

.emotion-group-name {

	display: inline-block;

	padding: 10px 20px;

	cursor: pointer;

	transition: all 0.3s ease;

	position: relative;

	user-select: none;

	transform: scaleY(-1);

}

.emotion-group-name:hover {

	background: var(--color-border-on-foreground);

}

.emotion-group-name.active:after {

	content: "";

	position: absolute;

	left: 0;

	right: 0;

	bottom: 0;

	background: var(--themecolor);

	height: 3px;

	pointer-events: none;

}

/*短代码适配*/

/*短代�?警告与折叠块*/

.admonition,

.collapse-block {

	border-radius: 3px;

	border-left-width: 3px;

	border-left-style: solid;

	margin-bottom: 20px;

	background-color: var(--color-widgets) !important;

}

.admonition i:first-child,

.collapse-block .collapse-block-title i:first-child {

	margin-right: 5px;

}

.collapse-block.hide-border-left {

	border-left: none;

}

.collapse-block .collapse-icon {

	position: absolute;

	right: 15px;

	bottom: 15px;

	transform: rotateZ(180deg);

	transition: all 0.2s ease;

}

.collapse-block.collapsed .collapse-icon {

	transform: rotateZ(0deg);

}

.admonition-title,

.collapse-block-title {

	padding: 10px 15px;

	font-weight: bold;

}

.collapse-block-title-inner {

	max-width: calc(100% - 20px);

	display: inline-block;

}

.collapse-block-title {

	cursor: pointer;

	position: relative;

}

.admonition-body,

.collapse-block-body {

	padding: 20px 15px;

	padding-bottom: 20px;

}

.admonition-primary,

.collapse-block-primary {

	border-left-color: #7889e8;

}

.admonition-primary>.admonition-title,

.collapse-block-primary>.collapse-block-title {

	background: #7889e833;

}

.admonition-success,

.collapse-block-success {

	border-left-color: #4fd69c;

}

.admonition-success>.admonition-title,

.collapse-block-success>.collapse-block-title {

	background: #4fd69c33;

}

.admonition-danger,

.collapse-block-danger {

	border-left-color: #f75676;

}

.admonition-danger>.admonition-title,

.collapse-block-danger>.collapse-block-title {

	background: #f7567633;

}

.admonition-info,

.collapse-block-info {

	border-left-color: #37d5f2;

}

.admonition-info>.admonition-title,

.collapse-block-info>.collapse-block-title {

	background: #37d5f233;

}

.admonition-warning,

.collapse-block-warning {

	border-left-color: #fc7c5f;

}

.admonition-warning>.admonition-title,

.collapse-block-warning>.collapse-block-title {

	background: #fc7c5f33;

}

.admonition-default,

.collapse-block-default {

	border-left-color: #3c4d69;

}

.admonition-default>.admonition-title,

.collapse-block-default>.collapse-block-title {

	background: #3c4d6933;

}

.admonition-grey,

.collapse-block-grey {

	border-left-color: #888888;

}

.admonition-grey>.admonition-title,

.collapse-block-grey>.collapse-block-title {

	background: #88888833;

}



/*短代�?友链-简�?/

.friend-links-simple .friend-category-title {

	font-size: 22px;

	text-align: center;

	font-weight: bold;

	margin-top: 20px;

	margin-bottom: 25px;

}

.friend-links-simple .link {

	padding: 0 10px;

}

.friend-links-simple .link .card {

	padding: 12px 12px;

}

.friend-links-simple .link .friend-link-avatar {

	margin-top: 8px;

}

.friend-links-simple .link .card img {

	border: none;

	max-width: unset;

}

.friend-links-simple .link .friend-link-title {

	font-size: 17px;

	font-weight: bold;

	margin-bottom: 5px;

}

.friend-links-simple .link a:before {

	display: none;

}



/*短代�?友链*/

.friend-links .link {

	padding-left: 10px;

	padding-right: 10px;

	padding-bottom: 15px;

}

.friend-links .friend-link-container {

	display: block;

	overflow: hidden;

	white-space: nowrap;

	background-color: var(--color-widgets) !important;

}

.friend-links .link a:before {

	display: none;

}

/*短代�?友链-样式 1*/

.friend-links-style1 .friend-link-avatar {

	display: inline-block;

	width: 125px;

	height: 140px;

	border-radius: 0 65px 65px 0;

	object-fit: cover;

	pointer-events: none;

}

.friend-links-style1 .friend-link-content {

	display: inline-block;

	width: calc(100% - 125px);

	height: 140px;

	vertical-align: middle;

	padding: 10px 15px 10px 15px;

	white-space: normal;

}

.friend-links-style1 .no-avatar .friend-link-content {

	width: 100%;

}

.friend-links-style1 .friend-link-title {

	font-weight: bold;

	font-size: 18px;

	height: 36px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

}

.friend-links-style1 .friend-link-description {

	height: 50px;

	overflow: hidden;

	line-height: 25px;

	position: relative;

}

.friend-links-style1 .friend-link-description:after {

	content: "";

	width: 45px;

	height: 22px;

	display: block;

	position: absolute;

	right: 0;

	top: 25px;

	pointer-events: none;

	background: linear-gradient(90deg, transparent 0%, var(--color-widgets) 100%);

}

.friend-links-style1 .friend-link-links {

	height: 32px;

	overflow: hidden;

	font-size: 18px;

	margin-top: 2px;

}

.friend-links-style1 .friend-link-links>a {

	margin-right: 12px;

}

/*短代�?友链-样式 1-方形头像*/

.friend-links-style1.friend-links-style1-square .friend-link-avatar {

	border-radius: 0;

	width: 130px;

}

.friend-links-style1.friend-links-style1-square .friend-link-content {

	width: calc(100% - 130px);

}

.friend-links-style1.friend-links-style1-square .no-avatar .friend-link-content {

	width: 100%;

}

/*短代�?友链-样式 2*/

.friend-links-style2 .friend-link-avatar {

	display: block;

	width: 100%;

	height: 160px;

	object-fit: cover;

	pointer-events: none;

}

.friend-links-style2 .friend-link-content {

	display: block;

	width: 100%;

	padding: 10px 15px 12px 15px;

}

.friend-links-style2 .friend-link-title {

	font-weight: bold;

	font-size: 18px;

	height: 36px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

}

.friend-links-style2 .friend-link-description {

	height: 25px;

	line-height: 25px;

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

}

.friend-links-style2 .friend-link-links {

	height: 30px;

	overflow: hidden;

	font-size: 18px;

	margin-top: 8px;

}

.friend-links-style2 .friend-link-links>a {

	margin-right: 15px;

}

/*短代�?友链-样式 2-大头�?/

.friend-links-style2.friend-links-style2-big .friend-link-avatar {

	height: calc(100vw * 0.2);

	min-height: 200px;

	max-height: 250px;

}

.friend-links-style2.friend-links-style2-big .friend-link-links > a {

	margin-right: 12px;

}

@media (min-width: 900px) {

	.friend-links.friend-links-style2-big .link {

		max-width: 33.33333%;

		flex: 0 0 33.33333%;

	}

}



/*短代�?时间�?/

.argon-timeline {

	margin-left: 110px;

	border-left: 3px solid rgba(var(--themecolor-rgbstr), 0.2);

	padding-left: 25px;

	position: relative;

	padding-top: 30px;

	padding-bottom: 10px;

}

.argon-timeline-time {

	position: absolute !important;

	left: -110px;

	margin-top: 12px;

	width: 85px;

	text-align: right;

	font-size: 15px;

	line-height: 26px;

}

.argon-timeline-card {

	margin-bottom: 35px;

	padding: 18px 25px;

	background: var(--color-widgets) !important;

}

.argon-timeline-card:before {

	content: "";

	position: absolute;

	left: -35px;

	top: 17px;

	background: var(--themecolor);

	width: 14px;

	height: 14px;

	border-radius: 50%;

}

.argon-timeline-title {

	font-size: 17px;

	font-weight: bold;

	margin-bottom: 5px;

}



/*短代�?隐藏文本*/

.argon-hidden-text {
	transition: all 0.3s ease;
}

.argon-hidden-text.argon-hidden-text-blur {
	filter: blur(4px);
}

.argon-hidden-text.argon-hidden-text-blur:hover {
	filter: blur(0px);
}

.argon-hidden-text.argon-hidden-text-background {
	background: #000;
	color: transparent;
	border-radius: 1px;
}

.argon-hidden-text.argon-hidden-text-background:hover {
	background: transparent;
	color: inherit;
	border-radius: 0px;
}

/*短代�?Github*/

.github-info-card {

	background: #24292e !important;

	margin-top: 20px;

	margin-bottom: 20px;

	padding: 20px 25px;

	color: #eee;

}

.github-info-card a {

	color: var(--themecolor-light);

}

.github-info-card-header {

	margin-bottom: 5px;

}

.github-info-card-header a {

	color: #eee !important;

	font-size: 16px;

}

.github-info-card-header a:before {

	display: none;

}

.github-info-card-header a i {

	margin-right: 2px;

}

.github-info-card-name-a {

	font-size: 20px;

}

.github-info-card-bottom {

	margin-top: 15px;

}

.github-info-card-bottom .github-info-card-meta {

	margin-right: 10px;

	opacity: 0.7;

}

.github-info-card-bottom .github-info-card-meta i {

	margin-right: 2px;

}

/*短代�?Github-Mini*/

.github-info-card-mini {

	display: flex;

	flex-direction: row;

	white-space: nowrap;

	align-items: center;

	padding: 15px 20px;

}

.github-info-card-mini .github-info-card-name-a {

	display: inline-block;

	margin-right: 12px;

	font-size: 19px;

}

.github-info-card-mini .github-info-card-description {

	white-space: nowrap;

	text-overflow: ellipsis;

	overflow: hidden;

	word-break: break-all;

	display: inline-block;

}

.github-info-card-mini .github-info-card-body {

	flex: 1;

	white-space: nowrap;

	overflow: hidden;

	display: flex;

	align-items: center;

}

.github-info-card-mini .github-info-card-bottom {

	display: inline-block;

	margin-top: 0;

	margin-left: 10px;

}

.github-info-card-mini .github-info-card-header {

	margin-right: 7px;

	margin-bottom: 0;

}

.github-info-card-mini .github-info-card-header a i {

	font-size: 19px;

	transform: translateY(2px);

	margin-right: 2px;

}

.github-info-card-mini .github-info-card-bottom .github-info-card-meta-forks {

	display: none;

}

.github-info-card-mini .github-info-card-bottom .github-info-card-meta-stars {

	margin-right: 0;

}



/*短代�?进度�?/

.progress {

	background: var(--color-border-on-foreground-deeper);

}

/*Gutenburg 区块-Tab 面板*/

.argon-tabpanel {

	margin-bottom: 20px;

}

.argon-tabpanel>.tabpanel-header {

	padding: 0;

}

.argon-tabpanel>.tabpanel-body {

	background-color: var(--color-widgets) !important;

}

.argon-tabpanel .nav {

	display: flex;

	justify-content: flex-start;

	align-content: center;

	flex-wrap: wrap;

}

.argon-tabpanel .nav-pills .nav-item {

	padding: 0;

	flex: 0;

	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);

	margin-bottom: 0;

}

.argon-tabpanel .nav-pills .nav-link {

	box-shadow: none;

	border-bottom-left-radius: 0;

	border-bottom-right-radius: 0;

	background-color: var(--color-widgets);

	border: solid 1px var(--color-border-on-foreground);

	border-bottom: none;

	padding: 8px 16px;

	white-space: nowrap;

}

html.darkmode .argon-tabpanel .nav-pills .nav-link {

	color: #fff;

}

.argon-tabpanel .nav-pills .nav-link:not(:first-of-type) {

	border-left: none;

}

.argon-tabpanel .nav-pills .nav-link:before {

	display: none;

}

.argon-tabpanel .nav-pills .nav-link.active,

.argon-tabpanel .nav-pills .show>.nav-link {

	background-color: var(--themecolor) !important;

}



/*noUiSlidebar*/

.noUi-connect,

.noUi-handle {

	background: var(--themecolor) !important;

}

.noUi-handle:before {

	content: attr(aria-valuenow) " px";

	position: absolute;

	left: -36px;

	top: -20px;

	font-size: 10px;

	display: block;

	width: 90px;

	text-align: center;

	transition: opacity 0.15s ease;

	opacity: 0;

	pointer-events: none;

}

.noUi-handle.noUi-active:before {

	opacity: 1;

}

.noUi-target {

	background: var(--color-border-on-foreground-deeper);

}



/*nprogress 加载进度�?/

#nprogress {

	pointer-events: none;

}

#nprogress .bar {

	background: rgba(255, 255, 255, 0.67);

	position: fixed;

	z-index: 1031;

	top: 0;

	left: 0;

	width: 100%;

	height: 2px;

}

body.leftbar-can-headroom.headroom---unpinned #nprogress .bar {

	background: rgba(var(--themecolor-rgbstr), 0.67);

}

#nprogress .peg {

	display: block;

	position: absolute;

	right: 0px;

	width: 100px;

	height: 100%;

	box-shadow: 0 0 10px rgba(255, 255, 255, 0.67), 0 0 5px rgba(255, 255, 255, 0.67);

	opacity: 1;

	-webkit-transform: rotate(3deg) translate(0px, -4px);
	transform: rotate(3deg) translate(0px, -4px);

	-ms-transform: rotate(3deg) translate(0px, -4px);

	transform: rotate(3deg) translate(0px, -4px);

}

#nprogress .spinner {

	display: block;

	position: fixed;

	z-index: 1031;

	top: 15px;

	right: 15px;

}

#nprogress .spinner-icon {

	width: 18px;

	height: 18px;

	box-sizing: border-box;

	border: solid 2px transparent;

	border-top-color: rgba(255, 255, 255, 0.67);

	border-left-color: rgba(255, 255, 255, 0.67);

	border-radius: 50%;

	-webkit-animation: nprogress-spinner 400ms linear infinite;

	animation: nprogress-spinner 400ms linear infinite;

}

.nprogress-custom-parent {

	overflow: hidden;

	position: relative;

}

.nprogress-custom-parent #nprogress .spinner,

.nprogress-custom-parent #nprogress .bar {

	position: absolute;

}

@-webkit-keyframes nprogress-spinner {

	0% {

		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);

	}

	100% {

		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);

	}

}

@keyframes nprogress-spinner {

	0% {

		transform: rotate(0deg);

	}

	100% {

		transform: rotate(360deg);

	}

}



/*iziToast*/

.iziToast:after {

	box-shadow: none !important;

}

.iziToast>.iziToast-close {

	opacity: 0.9 !important;

	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTcwODgxMzc1MTA3IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjM0MTAiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTAwMCIgaGVpZ2h0PSIxMDAwIj48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwvc3R5bGU+PC9kZWZzPjxwYXRoIGQ9Ik05NTQuMzA0IDE5MC4zMzZhMTUuNTUyIDE1LjU1MiAwIDAgMSAwIDIxLjk1MmwtMzAwLjAzMiAzMDAuMDMyIDI5OC41NiAyOTguNTZhMTUuNjE2IDE1LjYxNiAwIDAgMSAwIDIyLjAxNmwtMTIwLjk2IDEyMC44OTZhMTUuNTUyIDE1LjU1MiAwIDAgMS0yMS45NTIgMEw1MTEuMzYgNjU1LjIzMiAyMTQuMjcyIDk1Mi4zMmExNS41NTIgMTUuNTUyIDAgMCAxLTIxLjk1MiAwbC0xMjAuODk2LTEyMC44OTZhMTUuNDg4IDE1LjQ4OCAwIDAgMSAwLTIxLjk1MmwyOTcuMTUyLTI5Ny4xNTJMNjkuODg4IDIxMy43NmExNS41NTIgMTUuNTUyIDAgMCAxIDAtMjEuOTUybDEyMC44OTYtMTIwLjg5NmExNS41NTIgMTUuNTUyIDAgMCAxIDIxLjk1MiAwTDUxMS4zNiAzNjkuNDcybDMwMC4wOTYtMzAwLjAzMmExNS4zNiAxNS4zNiAwIDAgMSAyMS45NTIgMGwxMjAuODk2IDEyMC44OTZ6IiBwLWlkPSIzNDExIiBmaWxsPSIjZmZmZmZmIj48L3BhdGg+PC9zdmc+) no-repeat 50% 50% !important;

	background-size: 10px !important;

}

.iziToast>.iziToast-body .iziToast-icon {

	font-size: 18px !important;

}

.iziToast>.iziToast-body i.fa-spin:before {

	animation: fa-spin 2s infinite linear;

	display: inline-block;

}

.iziToast.iziToast-noprogressbar .iziToast-progressbar {

	display: none;

}

/*Mathjax 相关*/

.MathJax {

	outline: none !important;

}

#MathJax_Zoom {

	background: var(--color-widgets) !important;

	border: var(--color-border-on-foreground-deeper) solid 1px !important;

	border-radius: 3px !important;

	box-shadow: 0 15px 35px rgba(50, 50, 93, 0.1), 0 5px 15px rgba(0, 0, 0, 0.07) !important;

}

.CtxtMenu_Menu {

	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;

	border: none !important;

	border-radius: 5px !important;

}



/*LazyLoad 加载样式*/

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"] {

	width: 100%;

	max-height: 60vh;

	background-color: var(--color-border-on-foreground);

	background-repeat: no-repeat;

	background-position: 50% 50%;

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"]:not([srcset]) {

	height: 500px;

	pointer-events: none;

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-1 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHZpZXdCb3g9IjAgMCAzOCAzOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxkZWZzPgogICAgICAgIDxsaW5lYXJHcmFkaWVudCB4MT0iOC4wNDIlIiB5MT0iMCUiIHgyPSI2NS42ODIlIiB5Mj0iMjMuODY1JSIgaWQ9ImEiPgogICAgICAgICAgICA8c3RvcCBzdG9wLWNvbG9yPSIjNWU3MmU0IiBzdG9wLW9wYWNpdHk9IjAiIG9mZnNldD0iMCUiLz4KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzVlNzJlNCIgc3RvcC1vcGFjaXR5PSIuNjMxIiBvZmZzZXQ9IjYzLjE0NiUiLz4KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzVlNzJlNCIgb2Zmc2V0PSIxMDAlIi8+CiAgICAgICAgPC9saW5lYXJHcmFkaWVudD4KICAgIDwvZGVmcz4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSI+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0zNiAxOGMwLTkuOTQtOC4wNi0xOC0xOC0xOCIgaWQ9Ik92YWwtMiIgc3Ryb2tlPSJ1cmwoI2EpIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICAgICAgPGFuaW1hdGVUcmFuc2Zvcm0KICAgICAgICAgICAgICAgICAgICBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iCiAgICAgICAgICAgICAgICAgICAgdHlwZT0icm90YXRlIgogICAgICAgICAgICAgICAgICAgIGZyb209IjAgMTggMTgiCiAgICAgICAgICAgICAgICAgICAgdG89IjM2MCAxOCAxOCIKICAgICAgICAgICAgICAgICAgICBkdXI9IjAuOXMiCiAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvcGF0aD4KICAgICAgICAgICAgPGNpcmNsZSBmaWxsPSIjNWU3MmU0IiBjeD0iMzYiIGN5PSIxOCIgcj0iMSI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZVRyYW5zZm9ybQogICAgICAgICAgICAgICAgICAgIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSIKICAgICAgICAgICAgICAgICAgICB0eXBlPSJyb3RhdGUiCiAgICAgICAgICAgICAgICAgICAgZnJvbT0iMCAxOCAxOCIKICAgICAgICAgICAgICAgICAgICB0bz0iMzYwIDE4IDE4IgogICAgICAgICAgICAgICAgICAgIGR1cj0iMC45cyIKICAgICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPC9jaXJjbGU+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4K);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-2 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDQiIGhlaWdodD0iNDQiIHZpZXdCb3g9IjAgMCA0NCA0NCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiM1ZTcyZTQiPgogICAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgIDxjaXJjbGUgY3g9IjIyIiBjeT0iMjIiIHI9IjEiPgogICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIgogICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuOHMiCiAgICAgICAgICAgICAgICB2YWx1ZXM9IjE7IDIwIgogICAgICAgICAgICAgICAgY2FsY01vZGU9InNwbGluZSIKICAgICAgICAgICAgICAgIGtleVRpbWVzPSIwOyAxIgogICAgICAgICAgICAgICAga2V5U3BsaW5lcz0iMC4xNjUsIDAuODQsIDAuNDQsIDEiCiAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ic3Ryb2tlLW9wYWNpdHkiCiAgICAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMS44cyIKICAgICAgICAgICAgICAgIHZhbHVlcz0iMTsgMCIKICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJzcGxpbmUiCiAgICAgICAgICAgICAgICBrZXlUaW1lcz0iMDsgMSIKICAgICAgICAgICAgICAgIGtleVNwbGluZXM9IjAuMywgMC42MSwgMC4zNTUsIDEiCiAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8L2NpcmNsZT4KICAgICAgICA8Y2lyY2xlIGN4PSIyMiIgY3k9IjIyIiByPSIxIj4KICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIKICAgICAgICAgICAgICAgIGJlZ2luPSItMC45cyIgZHVyPSIxLjhzIgogICAgICAgICAgICAgICAgdmFsdWVzPSIxOyAyMCIKICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJzcGxpbmUiCiAgICAgICAgICAgICAgICBrZXlUaW1lcz0iMDsgMSIKICAgICAgICAgICAgICAgIGtleVNwbGluZXM9IjAuMTY1LCAwLjg0LCAwLjQ0LCAxIgogICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InN0cm9rZS1vcGFjaXR5IgogICAgICAgICAgICAgICAgYmVnaW49Ii0wLjlzIiBkdXI9IjEuOHMiCiAgICAgICAgICAgICAgICB2YWx1ZXM9IjE7IDAiCiAgICAgICAgICAgICAgICBjYWxjTW9kZT0ic3BsaW5lIgogICAgICAgICAgICAgICAga2V5VGltZXM9IjA7IDEiCiAgICAgICAgICAgICAgICBrZXlTcGxpbmVzPSIwLjMsIDAuNjEsIDAuMzU1LCAxIgogICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPC9jaXJjbGU+CiAgICA8L2c+Cjwvc3ZnPg==);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-3 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iNDYuNSIgdmlld0JveD0iMCAwIDEzNSAxNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iIzVlNzJlNCI+CiAgICA8cmVjdCB5PSIxMCIgd2lkdGg9IjE1IiBoZWlnaHQ9IjEyMCIgcng9IjYiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwLjVzIiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMjA7MTEwOzEwMDs5MDs4MDs3MDs2MDs1MDs0MDsxNDA7MTIwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ieSIKICAgICAgICAgICAgIGJlZ2luPSIwLjVzIiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMDsxNTsyMDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSIzMCIgeT0iMTAiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxMjAiIHJ4PSI2Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICBiZWdpbj0iMC4yNXMiIGR1cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEyMDsxMTA7MTAwOzkwOzgwOzcwOzYwOzUwOzQwOzE0MDsxMjAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJ5IgogICAgICAgICAgICAgYmVnaW49IjAuMjVzIiBkdXI9IjFzIgogICAgICAgICAgICAgdmFsdWVzPSIxMDsxNTsyMDsyNTszMDszNTs0MDs0NTs1MDswOzEwIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L3JlY3Q+CiAgICA8cmVjdCB4PSI2MCIgd2lkdGg9IjE1IiBoZWlnaHQ9IjE0MCIgcng9IjYiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIxcyIKICAgICAgICAgICAgIHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEwOzE1OzIwOzI1OzMwOzM1OzQwOzQ1OzUwOzA7MTAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9IjkwIiB5PSIxMCIgd2lkdGg9IjE1IiBoZWlnaHQ9IjEyMCIgcng9IjYiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImhlaWdodCIKICAgICAgICAgICAgIGJlZ2luPSIwLjI1cyIgZHVyPSIxcyIKICAgICAgICAgICAgIHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iMC4yNXMiIGR1cj0iMXMiCiAgICAgICAgICAgICB2YWx1ZXM9IjEwOzE1OzIwOzI1OzMwOzM1OzQwOzQ1OzUwOzA7MTAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvcmVjdD4KICAgIDxyZWN0IHg9IjEyMCIgeT0iMTAiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxMjAiIHJ4PSI2Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICBiZWdpbj0iMC41cyIgZHVyPSIxcyIKICAgICAgICAgICAgIHZhbHVlcz0iMTIwOzExMDsxMDA7OTA7ODA7NzA7NjA7NTA7NDA7MTQwOzEyMCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InkiCiAgICAgICAgICAgICBiZWdpbj0iMC41cyIgZHVyPSIxcyIKICAgICAgICAgICAgIHZhbHVlcz0iMTA7MTU7MjA7MjU7MzA7MzU7NDA7NDU7NTA7MDsxMCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgPC9yZWN0Pgo8L3N2Zz4K);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-4 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHZpZXdCb3g9IjAgMCAzOCAzOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiM1ZTcyZTQiPgogICAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxIDEpIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICA8Y2lyY2xlIHN0cm9rZS1vcGFjaXR5PSIuNSIgY3g9IjE4IiBjeT0iMTgiIHI9IjE4Ii8+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0zNiAxOGMwLTkuOTQtOC4wNi0xOC0xOC0xOCI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZVRyYW5zZm9ybQogICAgICAgICAgICAgICAgICAgIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSIKICAgICAgICAgICAgICAgICAgICB0eXBlPSJyb3RhdGUiCiAgICAgICAgICAgICAgICAgICAgZnJvbT0iMCAxOCAxOCIKICAgICAgICAgICAgICAgICAgICB0bz0iMzYwIDE4IDE4IgogICAgICAgICAgICAgICAgICAgIGR1cj0iMXMiCiAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz4KICAgICAgICAgICAgPC9wYXRoPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-5 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjUiIGhlaWdodD0iNjUiIHZpZXdCb3g9IjAgMCA0NSA0NSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiM1ZTcyZTQiPgogICAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxIDEpIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgIDxjaXJjbGUgY3g9IjIyIiBjeT0iMjIiIHI9IjYiIHN0cm9rZS1vcGFjaXR5PSIwIj4KICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIKICAgICAgICAgICAgICAgICBiZWdpbj0iMS41cyIgZHVyPSIzcyIKICAgICAgICAgICAgICAgICB2YWx1ZXM9IjY7MjIiCiAgICAgICAgICAgICAgICAgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0ic3Ryb2tlLW9wYWNpdHkiCiAgICAgICAgICAgICAgICAgYmVnaW49IjEuNXMiIGR1cj0iM3MiCiAgICAgICAgICAgICAgICAgdmFsdWVzPSIxOzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InN0cm9rZS13aWR0aCIKICAgICAgICAgICAgICAgICBiZWdpbj0iMS41cyIgZHVyPSIzcyIKICAgICAgICAgICAgICAgICB2YWx1ZXM9IjI7MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8L2NpcmNsZT4KICAgICAgICA8Y2lyY2xlIGN4PSIyMiIgY3k9IjIyIiByPSI2IiBzdHJva2Utb3BhY2l0eT0iMCI+CiAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiCiAgICAgICAgICAgICAgICAgYmVnaW49IjNzIiBkdXI9IjNzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iNjsyMiIKICAgICAgICAgICAgICAgICBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJzdHJva2Utb3BhY2l0eSIKICAgICAgICAgICAgICAgICBiZWdpbj0iM3MiIGR1cj0iM3MiCiAgICAgICAgICAgICAgICAgdmFsdWVzPSIxOzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InN0cm9rZS13aWR0aCIKICAgICAgICAgICAgICAgICBiZWdpbj0iM3MiIGR1cj0iM3MiCiAgICAgICAgICAgICAgICAgdmFsdWVzPSIyOzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPC9jaXJjbGU+CiAgICAgICAgPGNpcmNsZSBjeD0iMjIiIGN5PSIyMiIgcj0iOCI+CiAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiCiAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuNXMiCiAgICAgICAgICAgICAgICAgdmFsdWVzPSI2OzE7MjszOzQ7NTs2IgogICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPC9jaXJjbGU+CiAgICA8L2c+Cjwvc3ZnPg==);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-6 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDgiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMjAgMzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbD0iIzVlNzJlNCI+CiAgICA8Y2lyY2xlIGN4PSIxNSIgY3k9IjE1IiByPSIxNSI+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iciIgZnJvbT0iMTUiIHRvPSIxNSIKICAgICAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMC44cyIKICAgICAgICAgICAgICAgICB2YWx1ZXM9IjE1Ozk7MTUiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IiBmcm9tPSIxIiB0bz0iMSIKICAgICAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMC44cyIKICAgICAgICAgICAgICAgICB2YWx1ZXM9IjE7LjU7MSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvY2lyY2xlPgogICAgPGNpcmNsZSBjeD0iNjAiIGN5PSIxNSIgcj0iOSIgZmlsbC1vcGFjaXR5PSIwLjMiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9InIiIGZyb209IjkiIHRvPSI5IgogICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIwLjhzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iOTsxNTs5IiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIgZnJvbT0iMC41IiB0bz0iMC41IgogICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIwLjhzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iLjU7MTsuNSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvY2lyY2xlPgogICAgPGNpcmNsZSBjeD0iMTA1IiBjeT0iMTUiIHI9IjE1Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJyIiBmcm9tPSIxNSIgdG89IjE1IgogICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIwLjhzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iMTU7OTsxNSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiIGZyb209IjEiIHRvPSIxIgogICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIwLjhzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iMTsuNTsxIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgPC9jaXJjbGU+Cjwvc3ZnPgo=);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-7 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzUiIGhlaWdodD0iNDUiIHZpZXdCb3g9IjAgMCA1NSA4MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNWU3MmU0Ij4KICAgIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIC0xIDAgODApIj4KICAgICAgICA8cmVjdCB3aWR0aD0iMTAiIGhlaWdodD0iMjAiIHJ4PSIzIj4KICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iaGVpZ2h0IgogICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSI0LjNzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iMjA7NDU7NTc7ODA7NjQ7MzI7NjY7NDU7NjQ7MjM7NjY7MTM7NjQ7NTY7MzQ7MzQ7MjsyMzs3Njs3OTsyMCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8L3JlY3Q+CiAgICAgICAgPHJlY3QgeD0iMTUiIHdpZHRoPSIxMCIgaGVpZ2h0PSI4MCIgcng9IjMiPgogICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjJzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iODA7NTU7MzM7NTs3NTsyMzs3MzszMzsxMjsxNDs2MDs4MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8L3JlY3Q+CiAgICAgICAgPHJlY3QgeD0iMzAiIHdpZHRoPSIxMCIgaGVpZ2h0PSI1MCIgcng9IjMiPgogICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuNHMiCiAgICAgICAgICAgICAgICAgdmFsdWVzPSI1MDszNDs3ODsyMzs1NjsyMzszNDs3Njs4MDs1NDsyMTs1MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICA8L3JlY3Q+CiAgICAgICAgPHJlY3QgeD0iNDUiIHdpZHRoPSIxMCIgaGVpZ2h0PSIzMCIgcng9IjMiPgogICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJoZWlnaHQiCiAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjJzIgogICAgICAgICAgICAgICAgIHZhbHVlcz0iMzA7NDU7MTM7ODA7NTY7NzI7NDU7NzY7MzQ7MjM7Njc7MzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgPC9yZWN0PgogICAgPC9nPgo8L3N2Zz4=);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-8 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHZpZXdCb3g9IjAgMCAxMDUgMTA1IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiM1ZTcyZTQiPgogICAgPGNpcmNsZSBjeD0iMTIuNSIgY3k9IjEyLjUiIHI9IjEyLjUiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjFzIgogICAgICAgICB2YWx1ZXM9IjE7LjI7MSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L2NpcmNsZT4KICAgIDxjaXJjbGUgY3g9IjEyLjUiIGN5PSI1Mi41IiByPSIxMi41IiBmaWxsLW9wYWNpdHk9Ii41Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgIGJlZ2luPSIxMDBtcyIgZHVyPSIxcyIKICAgICAgICAgdmFsdWVzPSIxOy4yOzEiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgPC9jaXJjbGU+CiAgICA8Y2lyY2xlIGN4PSI1Mi41IiBjeT0iMTIuNSIgcj0iMTIuNSI+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IgogICAgICAgICBiZWdpbj0iMzAwbXMiIGR1cj0iMXMiCiAgICAgICAgIHZhbHVlcz0iMTsuMjsxIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvY2lyY2xlPgogICAgPGNpcmNsZSBjeD0iNTIuNSIgY3k9IjUyLjUiIHI9IjEyLjUiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgYmVnaW49IjYwMG1zIiBkdXI9IjFzIgogICAgICAgICB2YWx1ZXM9IjE7LjI7MSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L2NpcmNsZT4KICAgIDxjaXJjbGUgY3g9IjkyLjUiIGN5PSIxMi41IiByPSIxMi41Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgIGJlZ2luPSI4MDBtcyIgZHVyPSIxcyIKICAgICAgICAgdmFsdWVzPSIxOy4yOzEiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgPC9jaXJjbGU+CiAgICA8Y2lyY2xlIGN4PSI5Mi41IiBjeT0iNTIuNSIgcj0iMTIuNSI+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IgogICAgICAgICBiZWdpbj0iNDAwbXMiIGR1cj0iMXMiCiAgICAgICAgIHZhbHVlcz0iMTsuMjsxIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvY2lyY2xlPgogICAgPGNpcmNsZSBjeD0iMTIuNSIgY3k9IjkyLjUiIHI9IjEyLjUiPgogICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgYmVnaW49IjcwMG1zIiBkdXI9IjFzIgogICAgICAgICB2YWx1ZXM9IjE7LjI7MSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICA8L2NpcmNsZT4KICAgIDxjaXJjbGUgY3g9IjUyLjUiIGN5PSI5Mi41IiByPSIxMi41Ij4KICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgIGJlZ2luPSI1MDBtcyIgZHVyPSIxcyIKICAgICAgICAgdmFsdWVzPSIxOy4yOzEiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgPC9jaXJjbGU+CiAgICA8Y2lyY2xlIGN4PSI5Mi41IiBjeT0iOTIuNSIgcj0iMTIuNSI+CiAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IgogICAgICAgICBiZWdpbj0iMjAwbXMiIGR1cj0iMXMiCiAgICAgICAgIHZhbHVlcz0iMTsuMjsxIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgIDwvY2lyY2xlPgo8L3N2Zz4K);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-9 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iNDIiIHZpZXdCb3g9IjAgMCA1OCA1OCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMiAxKSIgc3Ryb2tlPSIjNWU3MmU0IiBzdHJva2Utd2lkdGg9IjEuNSI+CiAgICAgICAgICAgIDxjaXJjbGUgY3g9IjQyLjYwMSIgY3k9IjExLjQ2MiIgcj0iNSIgZmlsbC1vcGFjaXR5PSIxIiBmaWxsPSIjNWU3MmU0Ij4KICAgICAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuM3MiCiAgICAgICAgICAgICAgICAgICAgIHZhbHVlcz0iMTswOzA7MDswOzA7MDswIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPC9jaXJjbGU+CiAgICAgICAgICAgIDxjaXJjbGUgY3g9IjQ5LjA2MyIgY3k9IjI3LjA2MyIgcj0iNSIgZmlsbC1vcGFjaXR5PSIwIiBmaWxsPSIjNWU3MmU0Ij4KICAgICAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuM3MiCiAgICAgICAgICAgICAgICAgICAgIHZhbHVlcz0iMDsxOzA7MDswOzA7MDswIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPC9jaXJjbGU+CiAgICAgICAgICAgIDxjaXJjbGUgY3g9IjQyLjYwMSIgY3k9IjQyLjY2MyIgcj0iNSIgZmlsbC1vcGFjaXR5PSIwIiBmaWxsPSIjNWU3MmU0Ij4KICAgICAgICAgICAgICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImZpbGwtb3BhY2l0eSIKICAgICAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjEuM3MiCiAgICAgICAgICAgICAgICAgICAgIHZhbHVlcz0iMDswOzE7MDswOzA7MDswIiBjYWxjTW9kZT0ibGluZWFyIgogICAgICAgICAgICAgICAgICAgICByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICAgICAgICAgICAgPC9jaXJjbGU+CiAgICAgICAgICAgIDxjaXJjbGUgY3g9IjI3IiBjeT0iNDkuMTI1IiByPSI1IiBmaWxsLW9wYWNpdHk9IjAiIGZpbGw9IiM1ZTcyZTQiPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IgogICAgICAgICAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMS4zcyIKICAgICAgICAgICAgICAgICAgICAgdmFsdWVzPSIwOzA7MDsxOzA7MDswOzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICA8L2NpcmNsZT4KICAgICAgICAgICAgPGNpcmNsZSBjeD0iMTEuMzk5IiBjeT0iNDIuNjYzIiByPSI1IiBmaWxsLW9wYWNpdHk9IjAiIGZpbGw9IiM1ZTcyZTQiPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iZmlsbC1vcGFjaXR5IgogICAgICAgICAgICAgICAgICAgICBiZWdpbj0iMHMiIGR1cj0iMS4zcyIKICAgICAgICAgICAgICAgICAgICAgdmFsdWVzPSIwOzA7MDswOzE7MDswOzAiIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICA8L2NpcmNsZT4KICAgICAgICAgICAgPGNpcmNsZSBjeD0iNC45MzgiIGN5PSIyNy4wNjMiIHI9IjUiIGZpbGwtb3BhY2l0eT0iMCIgZmlsbD0iIzVlNzJlNCI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIxLjNzIgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjA7MDswOzA7MDsxOzA7MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvY2lyY2xlPgogICAgICAgICAgICA8Y2lyY2xlIGN4PSIxMS4zOTkiIGN5PSIxMS40NjIiIHI9IjUiIGZpbGwtb3BhY2l0eT0iMCIgZmlsbD0iIzVlNzJlNCI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIxLjNzIgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjA7MDswOzA7MDswOzE7MCIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvY2lyY2xlPgogICAgICAgICAgICA8Y2lyY2xlIGN4PSIyNyIgY3k9IjUiIHI9IjUiIGZpbGwtb3BhY2l0eT0iMCIgZmlsbD0iIzVlNzJlNCI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsLW9wYWNpdHkiCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIxLjNzIgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjA7MDswOzA7MDswOzA7MSIgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvY2lyY2xlPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-10 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iNDIiIHZpZXdCb3g9IjAgMCAxMzUgMTM1IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiM1ZTcyZTQiPgogICAgPHBhdGggZD0iTTY3LjQ0NyA1OGM1LjUyMyAwIDEwLTQuNDc3IDEwLTEwcy00LjQ3Ny0xMC0xMC0xMC0xMCA0LjQ3Ny0xMCAxMCA0LjQ3NyAxMCAxMCAxMHptOS40NDggOS40NDdjMCA1LjUyMyA0LjQ3NyAxMCAxMCAxMCA1LjUyMiAwIDEwLTQuNDc3IDEwLTEwcy00LjQ3OC0xMC0xMC0xMGMtNS41MjMgMC0xMCA0LjQ3Ny0xMCAxMHptLTkuNDQ4IDkuNDQ4Yy01LjUyMyAwLTEwIDQuNDc3LTEwIDEwIDAgNS41MjIgNC40NzcgMTAgMTAgMTBzMTAtNC40NzggMTAtMTBjMC01LjUyMy00LjQ3Ny0xMC0xMC0xMHpNNTggNjcuNDQ3YzAtNS41MjMtNC40NzctMTAtMTAtMTBzLTEwIDQuNDc3LTEwIDEwIDQuNDc3IDEwIDEwIDEwIDEwLTQuNDc3IDEwLTEweiI+CiAgICAgICAgPGFuaW1hdGVUcmFuc2Zvcm0KICAgICAgICAgICAgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIgogICAgICAgICAgICB0eXBlPSJyb3RhdGUiCiAgICAgICAgICAgIGZyb209IjAgNjcgNjciCiAgICAgICAgICAgIHRvPSItMzYwIDY3IDY3IgogICAgICAgICAgICBkdXI9IjIuNXMiCiAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+CiAgICA8L3BhdGg+CiAgICA8cGF0aCBkPSJNMjguMTkgNDAuMzFjNi42MjcgMCAxMi01LjM3NCAxMi0xMiAwLTYuNjI4LTUuMzczLTEyLTEyLTEyLTYuNjI4IDAtMTIgNS4zNzItMTIgMTIgMCA2LjYyNiA1LjM3MiAxMiAxMiAxMnptMzAuNzItMTkuODI1YzQuNjg2IDQuNjg3IDEyLjI4NCA0LjY4NyAxNi45NyAwIDQuNjg2LTQuNjg2IDQuNjg2LTEyLjI4NCAwLTE2Ljk3LTQuNjg2LTQuNjg3LTEyLjI4NC00LjY4Ny0xNi45NyAwLTQuNjg3IDQuNjg2LTQuNjg3IDEyLjI4NCAwIDE2Ljk3em0zNS43NCA3LjcwNWMwIDYuNjI3IDUuMzcgMTIgMTIgMTIgNi42MjYgMCAxMi01LjM3MyAxMi0xMiAwLTYuNjI4LTUuMzc0LTEyLTEyLTEyLTYuNjMgMC0xMiA1LjM3Mi0xMiAxMnptMTkuODIyIDMwLjcyYy00LjY4NiA0LjY4Ni00LjY4NiAxMi4yODQgMCAxNi45NyA0LjY4NyA0LjY4NiAxMi4yODUgNC42ODYgMTYuOTcgMCA0LjY4Ny00LjY4NiA0LjY4Ny0xMi4yODQgMC0xNi45Ny00LjY4NS00LjY4Ny0xMi4yODMtNC42ODctMTYuOTcgMHptLTcuNzA0IDM1Ljc0Yy02LjYyNyAwLTEyIDUuMzctMTIgMTIgMCA2LjYyNiA1LjM3MyAxMiAxMiAxMnMxMi01LjM3NCAxMi0xMmMwLTYuNjMtNS4zNzMtMTItMTItMTJ6bS0zMC43MiAxOS44MjJjLTQuNjg2LTQuNjg2LTEyLjI4NC00LjY4Ni0xNi45NyAwLTQuNjg2IDQuNjg3LTQuNjg2IDEyLjI4NSAwIDE2Ljk3IDQuNjg2IDQuNjg3IDEyLjI4NCA0LjY4NyAxNi45NyAwIDQuNjg3LTQuNjg1IDQuNjg3LTEyLjI4MyAwLTE2Ljk3em0tMzUuNzQtNy43MDRjMC02LjYyNy01LjM3Mi0xMi0xMi0xMi02LjYyNiAwLTEyIDUuMzczLTEyIDEyczUuMzc0IDEyIDEyIDEyYzYuNjI4IDAgMTItNS4zNzMgMTItMTJ6bS0xOS44MjMtMzAuNzJjNC42ODctNC42ODYgNC42ODctMTIuMjg0IDAtMTYuOTctNC42ODYtNC42ODYtMTIuMjg0LTQuNjg2LTE2Ljk3IDAtNC42ODcgNC42ODYtNC42ODcgMTIuMjg0IDAgMTYuOTcgNC42ODYgNC42ODcgMTIuMjg0IDQuNjg3IDE2Ljk3IDB6Ij4KICAgICAgICA8YW5pbWF0ZVRyYW5zZm9ybQogICAgICAgICAgICBhdHRyaWJ1dGVOYW1lPSJ0cmFuc2Zvcm0iCiAgICAgICAgICAgIHR5cGU9InJvdGF0ZSIKICAgICAgICAgICAgZnJvbT0iMCA2NyA2NyIKICAgICAgICAgICAgdG89IjM2MCA2NyA2NyIKICAgICAgICAgICAgZHVyPSI4cyIKICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz4KICAgIDwvcGF0aD4KPC9zdmc+Cg==);

}

article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"].lazyload-style-11 {

	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iNDUiIHZpZXdCb3g9IjAgMCA1NyA1NyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiM1ZTcyZTQiPgogICAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxIDEpIiBzdHJva2Utd2lkdGg9IjIiPgogICAgICAgICAgICA8Y2lyY2xlIGN4PSI1IiBjeT0iNTAiIHI9IjUiPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3kiCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIyLjJzIgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjUwOzU7NTA7NTAiCiAgICAgICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIyLjJzIgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjU7Mjc7NDk7NSIKICAgICAgICAgICAgICAgICAgICAgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvY2lyY2xlPgogICAgICAgICAgICA8Y2lyY2xlIGN4PSIyNyIgY3k9IjUiIHI9IjUiPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3kiCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIyLjJzIgogICAgICAgICAgICAgICAgICAgICBmcm9tPSI1IiB0bz0iNSIKICAgICAgICAgICAgICAgICAgICAgdmFsdWVzPSI1OzUwOzUwOzUiCiAgICAgICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICAgICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giCiAgICAgICAgICAgICAgICAgICAgIGJlZ2luPSIwcyIgZHVyPSIyLjJzIgogICAgICAgICAgICAgICAgICAgICBmcm9tPSIyNyIgdG89IjI3IgogICAgICAgICAgICAgICAgICAgICB2YWx1ZXM9IjI3OzQ5OzU7MjciCiAgICAgICAgICAgICAgICAgICAgIGNhbGNNb2RlPSJsaW5lYXIiCiAgICAgICAgICAgICAgICAgICAgIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogICAgICAgICAgICA8L2NpcmNsZT4KICAgICAgICAgICAgPGNpcmNsZSBjeD0iNDkiIGN5PSI1MCIgcj0iNSI+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJjeSIKICAgICAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjIuMnMiCiAgICAgICAgICAgICAgICAgICAgIHZhbHVlcz0iNTA7NTA7NTs1MCIKICAgICAgICAgICAgICAgICAgICAgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgICAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJjeCIKICAgICAgICAgICAgICAgICAgICAgZnJvbT0iNDkiIHRvPSI0OSIKICAgICAgICAgICAgICAgICAgICAgYmVnaW49IjBzIiBkdXI9IjIuMnMiCiAgICAgICAgICAgICAgICAgICAgIHZhbHVlcz0iNDk7NTsyNzs0OSIKICAgICAgICAgICAgICAgICAgICAgY2FsY01vZGU9ImxpbmVhciIKICAgICAgICAgICAgICAgICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgICAgICAgICAgIDwvY2lyY2xlPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);

}



/*Fancybox 样式*/

.fancybox-wrapper {

	width: max-content;

	max-width: 100%;

}

figure>.fancybox-wrapper,

figure>a>.fancybox-wrapper {

	width: unset;

}

.fancybox-wrapper.lazyload-container-unload {

	width: 100%;

}



.fancybox-wrapper>img {

	cursor: pointer;

	cursor: -webkit-zoom-in;

	cursor: zoom-in;

}

/*Zoomify 样式*/

.zoomify {

	cursor: pointer;

	cursor: -webkit-zoom-in;

	cursor: zoom-in;

}

.zoomify.zoomed {

	cursor: -webkit-zoom-out;

	cursor: zoom-out;

	padding: 0;

	margin: 0;

	border: none;

	border-radius: 0;

	box-shadow: none;

	position: relative;

	z-index: 1501;

}

.zoomify-shadow {

	position: fixed;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

	width: 100%;

	height: 100%;

	display: block;

	z-index: 1500;

	background: rgba(0, 0, 0, 0.3);

	opacity: 0;

}

.zoomify-shadow.zoomed {

	opacity: 1;

	cursor: pointer;

	cursor: -webkit-zoom-out;

	cursor: zoom-out;

}

.noscroll {

	overflow: hidden !important;

}

body.noscroll:before {

	opacity: 0 !important;

}



/*Share.js*/

/* 文章操作按钮容器 */
#post_actions_container {
	display: flex !important;
	flex-direction: row !important;
	justify-content: flex-end !important;
	align-items: center !important;
	gap: 10px !important;
	margin-bottom: 25px;
}

/* ---------- 分享按钮 ---------- */
#share_container {
	position: relative;
	display: inline-flex;
	align-items: flex-end;
}

#comments_toggle {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	height: 38px;
	white-space: nowrap;
	background-color: var(--themecolor) !important;
	border-color: var(--themecolor) !important;
}

#comments_toggle:hover {
	background-color: var(--themecolor-dark) !important;
	border-color: var(--themecolor-dark) !important;
}

#comments_toggle:active {
	background-color: var(--themecolor-dark2) !important;
	border-color: var(--themecolor-dark2) !important;
}

#comments_toggle .btn-inner--icon {
	margin-right: 0;
}

#comments_toggle .btn-inner--text {
	font-size: 14px;
}

/* 分享按钮 - 默认显示 */
#share_show {
	position: relative;
	z-index: 2;
	height: 38px;
	width: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: var(--themecolor) !important;
	border-color: var(--themecolor) !important;
	transform: translateY(0);
	opacity: 1;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

#share_show:hover {
	background-color: var(--themecolor-dark) !important;
	border-color: var(--themecolor-dark) !important;
}

#share_show:active {
	background-color: var(--themecolor-dark2) !important;
	border-color: var(--themecolor-dark2) !important;
}

/* 分享面板 - 默认隐藏 */
#share {
	position: absolute;
	bottom: 0;
	right: 0;
	display: flex;
	flex-direction: row;
	gap: 6px;
	transform: translateY(15px);
	opacity: 0;
	pointer-events: none;
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
		opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 分享渠道按钮初始状�?*/
#share>a {
	opacity: 0;
	transform: translateY(10px);
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
		opacity 0.2s ease-out;
}

/* 展开状�?- 分享按钮上滑淡出 */
#share_container.opened #share_show {
	transform: translateY(-15px);
	opacity: 0;
	pointer-events: none;
}

/* 展开状�?- 分享面板上滑淡入 */
#share_container.opened #share {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}

/* 展开时各按钮错落滑入 */
#share_container.opened #share>a {
	opacity: 1;
	transform: translateY(0);
}

#share_container.opened #share>a:nth-child(1) {
	transition-delay: 30ms;
}

#share_container.opened #share>a:nth-child(2) {
	transition-delay: 60ms;
}

#share_container.opened #share>a:nth-child(3) {
	transition-delay: 90ms;
}

#share_container.opened #share>a:nth-child(4) {
	transition-delay: 120ms;
}

#share_container.opened #share>a:nth-child(5) {
	transition-delay: 150ms;
}

#share_container.opened #share>a:nth-child(6) {
	transition-delay: 180ms;
}

#share_container.opened #share>a:nth-child(7) {
	transition-delay: 210ms;
}

#share_container.opened #share>a:nth-child(8) {
	transition-delay: 240ms;
}

/* 收起时各按钮错落滑出 */
#share_container:not(.opened) #share>a:nth-child(8) {
	transition-delay: 0ms;
}

#share_container:not(.opened) #share>a:nth-child(7) {
	transition-delay: 15ms;
}

#share_container:not(.opened) #share>a:nth-child(6) {
	transition-delay: 30ms;
}

#share_container:not(.opened) #share>a:nth-child(5) {
	transition-delay: 45ms;
}

#share_container:not(.opened) #share>a:nth-child(4) {
	transition-delay: 60ms;
}

#share_container:not(.opened) #share>a:nth-child(3) {
	transition-delay: 75ms;
}

#share_container:not(.opened) #share>a:nth-child(2) {
	transition-delay: 90ms;
}

#share_container:not(.opened) #share>a:nth-child(1) {
	transition-delay: 105ms;
}

/* 分享按钮通用样式 */
#share_container .btn {
	height: 38px;
	width: 38px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	border-radius: 10px;
}

/* 移动端分享面板适配 */
@media (max-width: 576px) {
	#share {
		flex-wrap: wrap;
		justify-content: flex-end;
		max-width: calc(100vw - 40px);
	}
}

#share .icon-wechat,
#share .icon-copy-link {
	position: relative;
}

/* 二维码弹�?- 显示在按钮上�?*/
#share .icon-wechat .wechat-qrcode,
#share .icon-copy-link .wechat-qrcode {
	position: absolute;
	z-index: 10;
	bottom: calc(100% + 10px);
	left: 50%;
	transform: translateX(-50%) translateY(10px);
	width: max-content;
	width: -moz-max-content;
	background: var(--color-widgets);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	text-align: center;
	padding: 15px 20px;
	transition: opacity 0.25s ease, transform 0.25s ease;
	opacity: 0;
	border-radius: 12px;
	pointer-events: none;
}

#share .icon-wechat:hover .wechat-qrcode,
#share .icon-copy-link:hover .wechat-qrcode {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
	pointer-events: auto;
}

/* 二维码弹窗箭�?*/
#share .wechat-qrcode:before {
	position: absolute;
	z-index: 3;
	bottom: -6px;
	left: 50%;
	display: block;
	width: 12px;
	height: 12px;
	content: "";
	transform: translateX(-50%) rotate(45deg);
	border-radius: 2px;
	background: var(--color-widgets);
}

#share .qrcode img {
	margin: auto;
}

#share .wechat-qrcode h4 {
	font-size: 16px;
	padding-bottom: 10px;
	margin: 0;
}

#share .wechat-qrcode .help {
	color: #666;
	padding-top: 10px;
	padding-bottom: 0;
	font-size: 12px;
}

html.darkmode #share .wechat-qrcode .help {
	color: var(--color-text);
}

#share>a {
	position: relative;
}

/* tooltip - 显示在按钮上�?*/
#share>a:before,
#share_show:before {
	pointer-events: none;
	position: absolute;
	bottom: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%) translateY(5px);
	line-height: 1.4;
	width: max-content;
	width: -moz-max-content;
	text-align: center;
	font-weight: normal;
	color: #fff;
	background: rgba(50, 50, 93, 0.95);
	padding: 6px 12px;
	font-size: 13px;
	border-radius: 6px;
	z-index: 10;
	transition: opacity 0.2s ease, transform 0.2s ease;
	opacity: 0;
}

#share>a:hover:before,
#share_show:hover:before {
	transform: translateX(-50%) translateY(0);
	opacity: 1;
}

#share_show:before {
	content: attr(tooltip);
	height: max-content;
	height: -moz-max-content;
	text-transform: none;
}

#share .icon-douban:before {
	content: attr(tooltip);
}

#share .icon-qq:before {
	content: attr(tooltip);
}

#share .icon-qzone:before {
	content: attr(tooltip);
}

#share .icon-weibo:before {
	content: attr(tooltip);
}

#share .icon-facebook:before {
	content: attr(tooltip);
}

#share .icon-twitter:before {
	content: attr(tooltip);
}

#share .icon-telegram:before {
	content: attr(tooltip);
}

#share .icon-copy-link:before {
	display: none !important;
}

/* 移动端分享按钮适配 */
@media (max-width: 576px) {

	/* 隐藏 tooltip */
	#share>a:before,
	#share_show:before {
		display: none !important;
	}

	/* 二维码弹窗改为左侧显�?*/
	#share .icon-wechat .wechat-qrcode,
	#share .icon-copy-link .wechat-qrcode {
		bottom: auto;
		top: 50%;
		left: auto;
		right: calc(100% + 10px);
		transform: translateY(-50%) translateX(10px);
	}

	#share .icon-wechat:hover .wechat-qrcode,
	#share .icon-copy-link:hover .wechat-qrcode {
		transform: translateY(-50%) translateX(0);
	}

	#share .wechat-qrcode:before {
		bottom: auto;
		top: 50%;
		left: auto;
		right: -6px;
		transform: translateY(-50%) rotate(45deg);
	}
}

/* ==========================================================================
   WordPress Adminbar
   ========================================================================== */
#wpadminbar {
	position: fixed !important;
	width: max-content !important;
	height: max-content !important;
	width: -moz-max-content !important;
	height: -moz-max-content !important;
	min-height: 55px;
	max-width: 100vw;
	background: var(--themecolor) !important;
	box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
	border-radius: 0 100px 100px 0;
	padding: 10px 20px;
	top: calc(50vh - 27.5px) !important;
	left: 0 !important;
	transform: translateX(calc(-100% + 25px));
	transition: all 0.3s ease;
}

#wpadminbar:hover {
	transform: none !important;
}

#wpadminbar:after {

	content: "\f105";

	font: normal normal normal 20px/1 FontAwesome;

	position: absolute;

	top: 50%;

	transform: translateY(calc(-50% - 2px));

	right: 10px;

	transition: all 0.3s ease;

	color: #fff;

}

#wpadminbar:hover:after {

	opacity: 0;

}

html[class],

html[lang] {

	margin-top: 0 !important;

}



/*说说*/

.shuoshuo-container {

	margin-bottom: 25px;

}

.shuoshuo-meta {

	text-align: center;

	background: var(--color-foreground);

	border-radius: 5px 5px 0 0;

	width: max-content;

	width: -moz-max-content;

	padding: 3px 15px;

	font-size: 15px;

	opacity: 0.95;

}

.shuoshuo-meta i.fa {

	margin-right: 3px;

}

.shuoshuo-date-date,

.shuoshuo-date-month {

	font-size: 18px;

}

.shuoshuo-main {

	border-top-left-radius: 0;

	padding: 20px 20px;

}

.shuoshuo-title {

	font-size: 18px;

	color: #555;

	font-weight: bold;

	margin-bottom: 10px;

	width: max-content;

	width: -moz-max-content;

	max-width: 100%;

}

.shuoshuo-content {

	padding-bottom: 10px;

}

.shuoshuo-content p {

	margin-bottom: 0;

	line-height: 1.8;

}

.shuoshuo-content * {

	max-width: 100%;

}

.shuoshuo-comments {

	font-size: 14px;

	opacity: 0.85;

	margin-top: 10px;

}

.shuoshuo-comments li {

	list-style: none;

}

.shuoshuo-comment-item-title {

	font-weight: bold;

}

.shuoshuo-comment-item-title .badge-admin,

.shuoshuo-comment-item-title .badge-private-comment,

.shuoshuo-comment-item-title .badge-unapproved {

	transform: translateY(-2px);

	padding: 3px 5px;

}

.shuoshuo-comments .comment-item-inner {

	margin-top: 2px;

	padding-bottom: 3px;

	border: none !important;

}

.shuoshuo-comments ul.children {

	padding-inline-start: 20px;

}

.shuoshuo-operations {

	margin-top: 5px;

	margin-left: auto;

	width: max-content;

	width: -moz-max-content;

}

.shuoshuo-operations button {

	margin-left: 3px;

}

.shuoshuo-operations button.upvoted {

	color: #fff;

	border-color: var(--themecolor);

	background-color: var(--themecolor);

	pointer-events: none;

}

@keyframes shuoshuo-upvoted-animation {

	0% {

		transform: none;

	}

	50% {

		transform: scale(1.35);

	}

	100% {

		transform: none;

	}

}

.shuoshuo-upvoted-animation i.fa {

	animation: shuoshuo-upvoted-animation 1s ease;

}

.shuoshuo-upvote i.fa-spin {

	display: none;

}

.shuoshuo-upvote.shuoshuo-upvoting i.fa-spin {

	display: inline-block;

}

.shuoshuo-upvote.shuoshuo-upvoting {

	opacity: 0.8;

	pointer-events: none;

}



.shuoshuo-preview-container {

	margin-bottom: 20px;

	padding: 25px 35px;

	transition: opacity 0.5s ease;

}

.shuoshuo-preview-container:before {

	content: "";

	display: block;

	position: absolute;

	left: -20px;

	top: -10px;

	width: 40px;

	height: 30px;

	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNTgzNDIzNDcwNTE4IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjMwOTciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNTAwIiBoZWlnaHQ9IjUwMCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNzc1Ljk5MTUxIDQzNy43MjYzOWM0OC4xMzEyMDctNzQuODg3NTk0IDExNi4yODY0Ny0xMzguMjQ5NjkxIDE4My4wMzg3OC0xODMuNTU2NTczbC03NS4xMzQyMTEtNzkuNDAxMzk4Yy0xNzIuNDgwMzA2IDY3LjY0MDU0LTMzNi43ODMzNzMgMjQyLjYxMTU3My0zMzYuNzgzMzczIDQ0OC40MzkzODJsMS4zMjcyMjggMGMtMC41Njg5NTggNi4yMzE5MzUtMC44NzQ5MjcgMTIuNTQwNjE3LTAuODc0OTI3IDE4LjkyMDkzMiAwIDExMy41ODU5NjUgOTIuMDc3MDkyIDIwNS42NjMwNTYgMjA1LjY2MzA1NiAyMDUuNjYzMDU2IDExMy41ODE4NzEgMCAyMDUuNjYzMDU2LTkyLjA3NzA5MiAyMDUuNjYzMDU2LTIwNS42NjMwNTZDOTU4Ljg5MjE0MyA1MzYuMjM5MDU0IDg3OC44NjAzODkgNDQ5LjA1NTQxMiA3NzUuOTkxNTEgNDM3LjcyNjM5ek00NzIuOTE2ODY2IDI1NC4xNjk4MTdsLTc1LjEzNDIxMS03OS40MDEzOThjLTE3Mi40ODAzMDYgNjcuNjQwNTQtMzM2Ljc4MzM3MyAyNDIuNjExNTczLTMzNi43ODMzNzMgNDQ4LjQzOTM4MmwxLjMyNzIyOCAwYy0wLjU2ODk1OCA2LjIzMTkzNS0wLjg3NDkyNyAxMi41NDA2MTctMC44NzQ5MjcgMTguOTIwOTMyIDAgMTEzLjU4NTk2NSA5Mi4wNzcwOTIgMjA1LjY2MzA1NiAyMDUuNjYzMDU2IDIwNS42NjMwNTZzMjA1LjY2MzA1Ni05Mi4wNzcwOTIgMjA1LjY2MzA1Ni0yMDUuNjYzMDU2YzAtMTA1Ljg5MDcwMi04MC4wMjg2ODUtMTkzLjA3NTM2Ny0xODIuOTAwNjMzLTIwNC40MDMzNjdDMzM4LjAwODI3IDM2Mi44Mzg3OTUgNDA2LjE2MzUzMyAyOTkuNDc2Njk5IDQ3Mi45MTY4NjYgMjU0LjE2OTgxN3oiIHAtaWQ9IjMwOTgiIGZpbGw9IiNmZmZmZmYiIGRhdGEtc3BtLWFuY2hvci1pZD0iYTMxM3guNzc4MTA2OS4wLmkyIiBjbGFzcz0ic2VsZWN0ZWQiPjwvcGF0aD48L3N2Zz4=);

	background-color: var(--themecolor);

	background-position: 40% 35%;

	border-radius: 20px;

	background-size: 32%;

	background-repeat: no-repeat;

	transition: all 0.3s ease;

}

.shuoshuo-preview-container:hover:before {

	left: -20px;

	top: -10px;

	width: 40px;

	height: 40px;

	background-position: 45% 45%;

	border-radius: 20px;

	background-size: 40%;

	background-repeat: no-repeat;

}

.shuoshuo-preview-meta {

	font-size: 14px;

	opacity: 0.6;

	transition: all 0.3s ease;

	margin-top: 10px;

}

.shuoshuo-preview-container .shuoshuo-preview-meta:hover {

	opacity: 0.8;

}

.shuoshuo-preview-meta .shuoshuo-date-date,

.shuoshuo-preview-meta .shuoshuo-date-month {

	font-size: 14px;

}

.shuoshuo-preview-link {

	position: absolute;

	right: 20px;

	bottom: 25px;

	opacity: 0;

	transition: all 0.3s ease;

}

.shuoshuo-preview-container:hover .shuoshuo-preview-link {

	opacity: 1;

}

.shuoshuo-content.shuoshuo-folded {

	position: relative;

	max-height: 400px;

	overflow: hidden;

}

.shuoshuo-content.shuoshuo-folded:after {

	content: "";

	display: block;

	position: absolute;

	left: 0;

	right: 0;

	bottom: 0;

	height: 150px;

	background: linear-gradient(180deg, transparent 0%, var(--color-foreground) 100%);

	pointer-events: none;

}

.shuoshuo-content.shuoshuo-folded .show-full-shuoshuo {

	position: absolute;

	bottom: 10px;

	right: 50%;

	transform: translateX(50%);

	color: var(--themecolor);

	z-index: 2;

	text-align: left;

	cursor: pointer;

	user-select: none;

	opacity: 1;

}

.shuoshuo-content.shuoshuo-folded .show-full-shuoshuo>button {

	border-radius: var(--card-radius);

	padding: 5px 20px;

	opacity: 0.8;

}

.shuoshuo-content.shuoshuo-folded .show-full-shuoshuo button:hover {

	opacity: 1;

}



.shuoshuo-content:not(.shuoshuo-folded) .show-full-shuoshuo {

	display: none;

}

/*归档时间�?/

.archive-timeline {

	padding-top: 10px;

}

.archive-timeline-title {

	box-shadow: none;

	border: none;

	background: transparent !important;

	font-size: 18px;

	padding: 0;

	margin-left: 1px;

	margin-bottom: 25px;

	padding-top: 7px;

}

.archive-timeline-year {

	font-size: 30px;

	color: var(--themecolor);

	margin-top: 12px !important;

	margin-bottom: 0;

}

.archive-timeline-month {

	font-size: 24px;

	color: var(--themecolor);

	opacity: 0.8;

	margin-top: 12px !important;

	margin-bottom: 0;

	font-weight: unset;

}

.archive-timeline-year + .archive-timeline-title {

	height: 50px;

	margin-top: 30px;

}

.archive-timeline *:not(.archive-timeline-year) + .archive-timeline-title:before {

	width: 12px;

	height: 12px;

	left: -34px;

	top: 18px;

}

.archive-timeline-month + .archive-timeline-title {

	height: 30px;

}

.archive-timeline-month.first-month-of-year + .archive-timeline-title {

	margin-top: -10px;

}

.archive-timeline-title > a {

	width: max-content;

	max-width: 100%;

}

.argon-timeline-time > a:before,

.archive-timeline-title > a:before {

	display: none;

}

.argon-timeline-node:first-child > .archive-timeline-year + .archive-timeline-title {

	margin-top: 0;

}

.archive-timeline h2:before,

.archive-timeline h3:before,

.archive-timeline h2:after,

.archive-timeline h3:after {

	display: none !important;

}

/*Loading Spinner*/

@keyframes spin {

	to {

		transform: rotate(1turn);

	}

}

.spinner-border {

	display: inline-block;

	width: 2rem;

	height: 2rem;

	vertical-align: text-bottom;

	border: 0.25em solid currentColor;

	border-right-color: transparent;

	border-radius: 50%;

	animation: spin 0.75s linear infinite;

}

.spinner-border-sm {

	width: 1rem;

	height: 1rem;

	border-width: 0.2em;

}

/*Loading Spinner Grow*/

@keyframes grow {

	0% {

		transform: scale(0);

	}

	50% {

		opacity: 1;

	}

}

.spinner-grow {

	display: inline-block;

	width: 2rem;

	height: 2rem;

	vertical-align: text-bottom;

	background-color: currentColor;

	border-radius: 50%;

	opacity: 0;

	animation: grow 0.75s linear infinite;

}

.spinner-grow-sm {

	width: 1rem;

	height: 1rem;

}

/*Highlight.js*/

article table.hljs-ln>tbody>tr>td,

article table.hljs-ln>tbody>tr>th,

article table.hljs-ln>tfoot>tr>td,

article table.hljs-ln>tfoot>tr>th,

article table.hljs-ln>thead>tr>td,

article table.hljs-ln>thead>tr>th {

	padding: unset;

	vertical-align: unset;

	border: unset !important;

}

.hljs {

	overflow-x: auto;

}

pre.hljs-codeblock {

	overflow: visible;

	position: relative;

	tab-size: 4;

}

pre.hljs-codeblock:before {

	content: "";

	position: absolute;

	background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1NCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDU0IDE0Ij48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPjxjaXJjbGUgY3g9IjYiIGN5PSI2IiByPSI2IiBmaWxsPSIjRkY1RjU2IiBzdHJva2U9IiNFMDQ0M0UiIHN0cm9rZS13aWR0aD0iLjUiPjwvY2lyY2xlPjxjaXJjbGUgY3g9IjI2IiBjeT0iNiIgcj0iNiIgZmlsbD0iI0ZGQkQyRSIgc3Ryb2tlPSIjREVBMTIzIiBzdHJva2Utd2lkdGg9Ii41Ij48L2NpcmNsZT48Y2lyY2xlIGN4PSI0NiIgY3k9IjYiIHI9IjYiIGZpbGw9IiMyN0M5M0YiIHN0cm9rZT0iIzFBQUIyOSIgc3Ryb2tlLXdpZHRoPSIuNSI+PC9jaXJjbGU+PC9nPjwvc3ZnPg==) no-repeat;

	background-position-y: center;

	top: 22px;

	left: 20px;

	height: 14px;

	width: 54px;

	margin-left: 5px;

	display: block;

}

code[hljs-codeblock-inner] {

	line-height: 1.5;

	font-size: 16px;

	padding: 22px 20px !important;

	border-radius: 8px;

	box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 20px;

	margin-top: 15px !important;

	margin-bottom: 15px !important;

	padding-top: 55px !important;

	display: block;

}

.hljs-ln-numbers {

	-webkit-touch-callout: none;

	-webkit-user-select: none;

	-khtml-user-select: none;

	-moz-user-select: none;

	-ms-user-select: none;

	user-select: none;

	text-align: center;

	vertical-align: top;

	padding-right: 12px !important;

	position: absolute;

	left: 20px;

	width: 30px;

	overflow-x: visible !important;

	white-space: nowrap;

	transition: all 0.3s ease;

}

.hljs-ln-numbers:before {

	content: "";

	position: absolute;

	left: -20px;

	width: 20px;

	height: 100%;

	background: inherit;

}

pre.hljs-codeblock.hljs-transparent-linenumber .hljs-ln-numbers {

	background: transparent !important;

}

.hljs-ln-code {

	padding-left: 30px !important;

	transition: all 0.3s ease;

}

pre.hljs-codeblock.hljs-break-line .hljs-ln-code {

	line-break: anywhere;

	white-space: break-spaces;

}

pre.hljs-codeblock:not(.hljs-break-line) .hljs-ln-code {

	white-space: pre;

}

code[hljs-codeblock-inner]::-webkit-scrollbar-track {

	border: none;

	background: transparent !important;

}

code[hljs-codeblock-inner]::-webkit-scrollbar-thumb {

	background: rgba(255, 255, 255, 0.3) !important;

	box-shadow: none !important;

	border: none !important;

	border-radius: 10px;

	transition: background 0.3s ease;

}

code[hljs-codeblock-inner]::-webkit-scrollbar-thumb:hover {

	background: rgba(255, 255, 255, 0.5) !important;

}

code[hljs-codeblock-inner]::-webkit-scrollbar {

	background: transparent;

	height: 6px;

}

code[hljs-codeblock-inner] *::selection {

	background-color: rgba(204, 226, 255, 0.2) !important;

}

pre.hljs-codeblock.hljs-codeblock-fullscreen {

	position: fixed;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	z-index: 10000;

	margin: 0 !important;

	animation: codeblock-fullscreen 0.5s cubic-bezier(0.18, 0.89, 0.37, 1.12);

}

pre.hljs-codeblock.hljs-codeblock-fullscreen>code[hljs-codeblock-inner] {

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	border-radius: 0;

	margin: 0 !important;

}

pre.hljs-codeblock.hljs-codeblock-fullscreen:before {

	z-index: 10001;

}

@keyframes codeblock-fullscreen {

	0% {

		transform: scale(0.5);

		opacity: 1;

	}

	100% {

		transform: none;

		opacity: 1;

	}

}

pre.hljs-codeblock.hljs-hide-linenumber .hljs-ln-numbers.hljs {

	width: 0px;

	opacity: 0;

}

pre.hljs-codeblock.hljs-hide-linenumber .hljs-ln-code {

	padding-left: 4px !important;

}

pre.hljs-codeblock .hljs-control {

	display: block;

	position: absolute;

	top: 16px !important;

	right: 20px !important;

	user-select: none;

	opacity: 0;

	transition: all 0.2s ease;

	white-space: nowrap;

	overflow: visible;

	background: transparent;

	padding: 0;

	margin: 0;

}

pre.hljs-codeblock:hover .hljs-control {

	opacity: 0.4;

}

pre.hljs-codeblock:hover .hljs-control:hover {

	opacity: 1;

}

pre.hljs-codeblock .hljs-control i.fa {

	font: normal normal normal 14px/1 FontAwesome !important;

}

.hljs-control .hljs-control-btn {

	display: inline-block;

	opacity: 0.8;

	transition: all 0.2s ease;

	cursor: pointer;

	margin-left: 15px;

	width: 12px;

	position: relative;

}

.hljs-control .hljs-control-btn:hover {

	opacity: 0.5;

}

.hljs-control-btn:before {

	position: absolute;

	top: 22px;

	left: -40px;

	width: 92px;

	text-align: center;

	opacity: 0;

	pointer-events: none;

	transition: all 0.2s ease;

	font-size: 12px;

	font-family: sans-serif;

}

.hljs-control-btn:hover:before {

	opacity: 1;

	top: 25px;

}

.hljs-control-toggle-linenumber:before {

	content: attr(tooltip-hide-linenumber);

}

pre.hljs-codeblock.hljs-hide-linenumber .hljs-control-toggle-linenumber:before {

	content: attr(tooltip-show-linenumber);

}

.hljs-control-toggle-break-line:before {

	content: attr(tooltip-enable-breakline);

}

pre.hljs-codeblock.hljs-break-line .hljs-control-toggle-break-line:before {

	content: attr(tooltip-disable-breakline);

}

.hljs-control-copy:before {

	content: attr(tooltip);

}

.hljs-control-fullscreen:before {

	content: attr(tooltip-fullscreen);

}

pre.hljs-codeblock.hljs-codeblock-fullscreen .hljs-control-fullscreen:before {

	content: attr(tooltip-exit-fullscreen);

}

pre.hljs-codeblock.hljs-codeblock-fullscreen .hljs-control-fullscreen>i:before {

	content: "\f066";
}

/*==========Style-Dark==========*/



html.darkmode body {

	color: #eee;

}

html.darkmode body:before {

	content: "";

	position: fixed;

	left: 0;

	top: 0;

	right: 0;

	bottom: 0;

	height: 100vh;

	width: 100vw;

	background: rgba(0, 0, 0, 0.2);

	z-index: 999999999;

	pointer-events: none;

	transition: background 0.3s ease;

}

html.darkmode body.fancybox-active:before {

	background: rgba(0, 0, 0, 0);

}

html.darkmode .h1,

html.darkmode .h2,

html.darkmode .h3,

html.darkmode .h4,

html.darkmode .h5,

html.darkmode .h6,

html.darkmode h1,

html.darkmode h2,

html.darkmode h3,

html.darkmode h4,

html.darkmode h5,

html.darkmode h6 {

	color: #eee;

}

html.darkmode a {

	color: var(--themecolor-light);

}

html.darkmode a:hover {

	color: var(--themecolor);

}



html.darkmode ::-webkit-scrollbar {

	background-color: rgba(255, 255, 255, 0);

}

html.darkmode ::-webkit-scrollbar-thumb {

	background-color: rgba(255, 255, 255, 0.25);

}



html.darkmode .leftbar-menu-item>a {

	color: #eee !important;

}



html.darkmode .site-state-item-count,

html.darkmode .site-author-links-item>a,

html.darkmode .site-friend-links-item>a {

	color: #eee !important;

}



html.darkmode .site-state-item-name {

	color: #aaa;

}



html.darkmode .banner {

	background-color: var(--color-darkmode-banner);

}

html.darkmode .leftbar-banner {

	background: var(--color-widgets);

}



html.darkmode #footer {

	background: var(--color-foreground) !important;

}



html.darkmode .close>span:not(.sr-only) {

	color: #eee;

}



html.darkmode .tag.badge {

	color: #eee;

}



html.darkmode .dropdown-item:active {

	background: var(--color-border-on-foreground-deeper);

}

html.darkmode .dropdown-item {

	color: #eee !important;

}



html.darkmode #leftbar_catalog .index-item,

html.darkmode #leftbar_catalog .index-link {

	color: #eee;

}

html.darkmode #leftbar_catalog .index-item.current>.index-link {

	color: var(--themecolor-light);

}



html.darkmode article .post-content pre:not(.hljs-codeblock) {

	color: #eee;

}

html.darkmode article .post-content code:not([hljs-codeblock-inner]) {

	color: #eee;

}

html.darkmode .form-control {

	color: #eee;

}

html.darkmode input[disabled],

html.darkmode textarea[disabled],

html.darkmode #post_comment.logged #post_comment_name,

html.darkmode #post_comment.logged #post_comment_email {

	opacity: 0.3;

}



html.darkmode .comment-item-text .comment-image {

	color: var(--themecolor-light) !important;

}

html.darkmode #blog_setting_darkmode_switch .custom-toggle-slider {

	border-color: var(--themecolor);

}

html.darkmode #blog_setting_darkmode_switch .custom-toggle-slider:before {

	transform: translateX(1.625rem);

	background-color: var(--themecolor);

}

html.darkmode .badge {

	color: #eee;

}

html.darkmode .page-link {

	color: #eee !important;

}

html.darkmode .zoomify-shadow {

	background: rgba(0, 0, 0, 0.6);

}

html.darkmode #share .wechat-qrcode .help {

	color: #eee;

}

html.darkmode .github-info-card {

	background: #24292e !important;

}

html.darkmode .CtxtMenu_Menu {

	filter: invert(0.8);

}



/*==========Style-Dark-For-AMOLED==========*/



html.darkmode.amoled-dark .leftbar-banner {

	background: var(--color-foreground);

}

html.darkmode.amoled-dark .github-info-card {

	background: #000 !important;

	border: 1px solid #222;

}

html.darkmode.amoled-dark #content:before,

html.darkmode.amoled-dark #content:after {

	display: none;
}

/* 桌面端隐藏移动端导航区域 */
.leftbar-mobile-nav {
	display: none;
}

/* 桌面端显示原有侧边栏内容 */
.leftbar-desktop-content {
	display: block;
}

/*==========Style-Mobile==========*/

@media screen and (max-width: 900px) {

	/* 移动端隐藏桌面端侧边栏内容，只显示移动端导航 */
	.leftbar-desktop-content {
		display: none !important;
	}

	/* 移动端侧边栏 - 优化设计 */
	.leftbar-mobile-nav {
		display: flex;
		flex-direction: column;
		min-height: 100%;
		background: var(--color-foreground);
	}

	/* 顶部用户信息�?- 增强视觉效果 */
	.leftbar-mobile-profile {
		background: var(--themecolor-gradient);
		padding: 28px 20px 24px;
		position: relative;
		color: #fff;
		overflow: hidden;
	}

	/* 背景装饰圆形 */
	.leftbar-mobile-profile::before {
		content: "";
		position: absolute;
		top: -60px;
		right: -60px;
		width: 160px;
		height: 160px;
		background: rgba(255, 255, 255, 0.08);
		border-radius: 50%;
		pointer-events: none;
	}

	.leftbar-mobile-profile::after {
		content: "";
		position: absolute;
		bottom: -40px;
		left: -40px;
		width: 120px;
		height: 120px;
		background: rgba(255, 255, 255, 0.05);
		border-radius: 50%;
		pointer-events: none;
	}

	.leftbar-mobile-close {
		position: absolute;
		top: 16px;
		right: 16px;
		width: 36px;
		height: 36px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.15);

		-webkit-backdrop-filter: blur(10px);

		backdrop-filter: blur(10px);
		cursor: pointer;
		transition: all var(--animation-fast) var(--ease-standard);
		color: #fff;
		z-index: 1;
	}

	.leftbar-mobile-close:active {
		background: rgba(255, 255, 255, 0.25);
		transform: scale(0.92);
	}

	.leftbar-mobile-close i {
		font-size: 15px;
	}

	.leftbar-mobile-avatar {
		width: 72px;
		height: 72px;
		border-radius: 50%;
		overflow: hidden;
		border: 3px solid rgba(255, 255, 255, 0.35);
		margin-bottom: 14px;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
		position: relative;
		z-index: 1;
		transition: all var(--animation-normal) var(--ease-spring);
	}

	.leftbar-mobile-avatar:active {
		transform: scale(0.95);
		border-color: rgba(255, 255, 255, 0.6);
	}

	.leftbar-mobile-avatar img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.leftbar-mobile-user-info {
		margin-bottom: 18px;
		position: relative;
		z-index: 1;
	}

	.leftbar-mobile-user-name {
		font-size: 22px;
		font-weight: 700;
		margin-bottom: 6px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 4px;
		letter-spacing: -0.3px;
	}

	.leftbar-mobile-user-desc {
		font-size: 13px;
		opacity: 0.9;
		line-height: 1.4;
	}

	.leftbar-mobile-stats {
		display: flex;
		gap: 0;
		background: rgba(255, 255, 255, 0.12);

		-webkit-backdrop-filter: blur(10px);

		backdrop-filter: blur(10px);
		border-radius: 16px;
		padding: 12px 8px;
		position: relative;
		z-index: 1;
	}

	.leftbar-mobile-stat {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
	}

	.leftbar-mobile-stat:not(:last-child)::after {
		content: "";
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 1px;
		height: 24px;
		background: rgba(255, 255, 255, 0.2);
	}

	.leftbar-mobile-stat .stat-num {
		font-size: 20px;
		font-weight: 700;
		line-height: 1.2;
	}

	.leftbar-mobile-stat .stat-label {
		font-size: 11px;
		opacity: 0.75;
		margin-top: 3px;
		font-weight: 500;
	}

	/* 搜索�?- 优化样式 */
	.leftbar-mobile-search {
		padding: 16px 16px 8px;
		background: var(--color-foreground);
	}

	.leftbar-mobile-search-inner {
		display: flex;
		align-items: center;
		background: var(--color-background);
		border-radius: 14px;
		padding: 12px 16px;
		gap: 12px;
		transition: all var(--animation-fast) var(--ease-standard);
		border: 1px solid transparent;
	}

	.leftbar-mobile-search-inner:focus-within {
		border-color: rgba(var(--themecolor-rgbstr), 0.3);
		background: var(--color-foreground);
		box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.1);
		transform: scale(1.02);
	}

	.leftbar-mobile-search-inner i {
		color: #999;
		font-size: 15px;
		transition: color var(--animation-fast) var(--ease-standard);
	}

	.leftbar-mobile-search-inner:focus-within i {
		color: var(--themecolor);
	}

	.leftbar-mobile-search-inner input {
		flex: 1;
		border: none;
		background: transparent;
		font-size: 15px;
		color: var(--color-text-deeper);
		outline: none;
	}

	.leftbar-mobile-search-inner input::placeholder {
		color: #aaa;
	}

	/* 导航菜单区域 - 优化间距和样�?*/
	.leftbar-mobile-menu-section {
		padding: 12px 12px 8px;
	}

	.leftbar-mobile-section-title {
		font-size: 11px;
		font-weight: 700;
		color: #999;
		text-transform: uppercase;
		letter-spacing: 1.2px;
		padding: 8px 12px 12px;
		margin-bottom: 0;
	}

	.leftbar-mobile-menu {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.leftbar-mobile-menu-item {
		margin-bottom: 4px;
	}

	.leftbar-mobile-menu-item>a {
		display: flex;
		align-items: center;
		padding: 14px 16px;
		color: var(--color-text-deeper);
		text-decoration: none;
		border-radius: 14px;
		transition: all var(--animation-fast) var(--ease-standard);
		font-size: 15px;
		font-weight: 500;
		position: relative;
		overflow: hidden;
	}

	/* 菜单项涟漪效�?*/
	.leftbar-mobile-menu-item>a::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background: rgba(var(--themecolor-rgbstr), 0.15);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		transition: width 0.4s var(--ease-standard), height 0.4s var(--ease-standard);
		pointer-events: none;
	}

	.leftbar-mobile-menu-item>a:active::before {
		width: 200%;
		height: 200%;
	}

	.leftbar-mobile-menu-item>a:active {
		background: rgba(var(--themecolor-rgbstr), 0.1);
		transform: scale(0.98);
	}

	.leftbar-mobile-menu-item.current>a {
		background: rgba(var(--themecolor-rgbstr), 0.1);
		color: var(--themecolor);
	}

	.leftbar-mobile-menu-item.current>a::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 4px;
		height: 20px;
		background: var(--themecolor);
		border-radius: 0 4px 4px 0;
	}

	.leftbar-mobile-menu-item .menu-text {
		flex: 1;
	}

	.leftbar-mobile-menu-item .submenu-arrow {
		font-size: 12px;
		color: #999;
		transition: transform var(--animation-normal) var(--ease-standard);
		margin-left: 8px;
	}

	.leftbar-mobile-menu-item.expanded .submenu-arrow {
		transform: rotate(180deg);
	}

	.leftbar-mobile-submenu {
		list-style: none;
		padding: 0;
		margin: 4px 0 4px 16px;
		max-height: 0;
		overflow: hidden;
		transition: max-height var(--animation-normal) var(--ease-standard);
		border-left: 2px solid var(--color-border-on-foreground-deeper);
		padding-left: 12px;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu {
		max-height: 500px;
	}

	/* 子菜单项交错入场动画 */
	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item {
		animation: fadeInUp 0.25s var(--ease-standard) both;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(1) {
		animation-delay: 0.05s;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(2) {
		animation-delay: 0.1s;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(3) {
		animation-delay: 0.15s;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(4) {
		animation-delay: 0.2s;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(5) {
		animation-delay: 0.25s;
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu .leftbar-mobile-menu-item:nth-child(6) {
		animation-delay: 0.3s;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item {
		margin-bottom: 2px;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item>a {
		padding: 11px 14px;
		font-size: 14px;
		font-weight: 400;
		color: #666;
		border-radius: 10px;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item>a:active {
		color: var(--themecolor);
		background: rgba(var(--themecolor-rgbstr), 0.08);
	}

	/* 底部操作�?- 优化设计 */
	.leftbar-mobile-footer {
		margin-top: auto;
		padding: 12px 16px 20px;
		border-top: 1px solid var(--color-border-on-foreground-deeper);
		background: var(--color-foreground);
	}

	.leftbar-mobile-actions {
		display: flex;
		justify-content: center;
		gap: 8px;
	}

	.leftbar-mobile-action {
		flex: 1;
		max-width: 100px;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 14px 12px;
		border: none;
		background: var(--color-background);
		color: #666;
		font-size: 11px;
		font-weight: 500;
		cursor: pointer;
		border-radius: 14px;
		transition: all var(--animation-fast) var(--ease-standard);
		position: relative;
		overflow: hidden;
	}

	/* 底部按钮涟漪效果 */
	.leftbar-mobile-action::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background: rgba(var(--themecolor-rgbstr), 0.2);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		transition: width 0.35s var(--ease-standard), height 0.35s var(--ease-standard);
		pointer-events: none;
	}

	.leftbar-mobile-action:active::before {
		width: 180%;
		height: 180%;
	}

	.leftbar-mobile-action:active {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
		transform: scale(0.96);
	}

	.leftbar-mobile-action i {
		font-size: 20px;
		transition: transform var(--animation-fast) var(--ease-spring);
	}

	.leftbar-mobile-action:active i {
		transform: scale(1.1);
	}

	/* ========== 移动端折叠面板样�?- Material 3 & iOS 风格 ========== */
	.leftbar-mobile-collapse-section {
		margin: 4px 12px;
		background: var(--color-background);
		border-radius: 14px;
		overflow: hidden;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
		transition: all var(--animation-normal) var(--ease-emphasized),
			box-shadow var(--animation-normal) var(--ease-standard);
	}

	.leftbar-mobile-collapse-section.expanded {
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
		margin: 6px 12px;
	}

	.leftbar-mobile-collapse-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 14px;
		cursor: pointer;
		user-select: none;
		transition: all var(--animation-fast) var(--ease-standard);
		position: relative;
		overflow: hidden;
	}

	/* 折叠头部涟漪效果 */
	.leftbar-mobile-collapse-header::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 0;
		height: 0;
		background: rgba(var(--themecolor-rgbstr), 0.15);
		border-radius: 50%;
		transform: translate(-50%, -50%);
		transition: width 0.6s var(--ease-emphasized-decelerate),
			height 0.6s var(--ease-emphasized-decelerate),
			opacity 0.4s var(--ease-standard);
		pointer-events: none;
		opacity: 0;
	}

	.leftbar-mobile-collapse-header:active::before {
		width: 300%;
		height: 300%;
		opacity: 1;
	}

	.leftbar-mobile-collapse-header:active {
		background: rgba(var(--themecolor-rgbstr), 0.04);
	}

	.collapse-header-left {
		display: flex;
		align-items: center;
		gap: 10px;
		flex: 1;
	}

	.collapse-icon {
		width: 28px;
		height: 28px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(var(--themecolor-rgbstr), 0.1);
		color: var(--themecolor);
		border-radius: 8px;
		font-size: 12px;
		transition: all var(--animation-normal) var(--ease-spring);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-icon {
		background: var(--themecolor);
		color: #fff;
		transform: scale(1.08) rotate(3deg);
		box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.35);
	}

	.collapse-title {
		font-size: 14px;
		font-weight: 600;
		color: var(--color-text-deeper);
		transition: color var(--animation-fast) var(--ease-standard);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-title {
		color: var(--themecolor);
	}

	.collapse-badge {
		background: var(--themecolor);
		color: #fff;
		font-size: 10px;
		font-weight: 700;
		padding: 2px 7px;
		border-radius: 8px;
		min-width: 18px;
		text-align: center;
		margin-left: auto;
		margin-right: 10px;
		transition: all var(--animation-normal) var(--ease-spring);
		box-shadow: 0 2px 6px rgba(var(--themecolor-rgbstr), 0.3);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-badge {
		transform: scale(1.1);
		box-shadow: 0 3px 10px rgba(var(--themecolor-rgbstr), 0.4);
	}

	.collapse-arrow {
		font-size: 11px;
		color: #aaa;
		transition: all var(--animation-normal) var(--ease-emphasized);
		width: 20px;
		height: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: transparent;
	}

	.leftbar-mobile-collapse-section.expanded .collapse-arrow {
		transform: rotate(180deg);
		color: var(--themecolor);
		background: rgba(var(--themecolor-rgbstr), 0.1);
	}

	.leftbar-mobile-collapse-content {
		max-height: 0;
		overflow: hidden;
		transition: max-height var(--animation-slow) var(--ease-emphasized),
			opacity var(--animation-normal) var(--ease-standard);
		opacity: 0;
	}

	.leftbar-mobile-collapse-section.expanded .leftbar-mobile-collapse-content {
		max-height: 350px;
		opacity: 1;
	}

	/* 折叠内容入场动画 */
	.leftbar-mobile-collapse-section.expanded .mobile-catalog-container,
	.leftbar-mobile-collapse-section.expanded .mobile-todo-container {
		animation: collapseContentFadeIn 0.35s var(--ease-emphasized-decelerate) 0.1s both;
	}

	@keyframes collapseContentFadeIn {
		from {
			opacity: 0;
			transform: translateY(-8px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	/* ========== 移动端文章目录样�?========== */
	.mobile-catalog-container {
		padding: 4px 12px 12px;
	}

	#leftbar_mobile_catalog {
		max-height: 250px;
		overflow-y: auto;
		padding-right: 4px;
	}

	#leftbar_mobile_catalog::-webkit-scrollbar {
		width: 2px;
	}

	#leftbar_mobile_catalog::-webkit-scrollbar-track {
		background: transparent;
	}

	#leftbar_mobile_catalog::-webkit-scrollbar-thumb {
		background: rgba(var(--themecolor-rgbstr), 0.25);
		border-radius: 2px;
	}

	#leftbar_mobile_catalog ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	#leftbar_mobile_catalog .index-item {
		margin-bottom: 1px;
	}

	#leftbar_mobile_catalog .index-link {
		display: block;
		padding: 8px 10px;
		font-size: 13px;
		color: #666;
		text-decoration: none;
		border-radius: 8px;
		transition: all var(--animation-fast) var(--ease-standard),
			transform var(--animation-fast) var(--ease-spring);
		position: relative;
		overflow: hidden;
	}

	#leftbar_mobile_catalog .index-link::before {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%) scaleY(0);
		width: 3px;
		height: 14px;
		background: var(--themecolor);
		border-radius: 0 3px 3px 0;
		transition: transform var(--animation-normal) var(--ease-spring);
	}

	#leftbar_mobile_catalog .index-item.current>.index-link {
		background: rgba(var(--themecolor-rgbstr), 0.1);
		color: var(--themecolor);
		font-weight: 500;
		padding-left: 14px;
	}

	#leftbar_mobile_catalog .index-item.current>.index-link::before {
		transform: translateY(-50%) scaleY(1);
	}

	#leftbar_mobile_catalog .index-link:active {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		transform: scale(0.97);
	}

	#leftbar_mobile_catalog .index-subItem-box {
		padding-left: 14px;
		border-left: 2px solid var(--color-border-on-foreground-deeper);
		margin-left: 10px;
		margin-top: 2px;
	}

	#leftbar_mobile_catalog .index-subItem-box .index-link {
		font-size: 12px;
		padding: 6px 8px;
	}

	/* ========== 移动端TODO样式 ========== */
	.mobile-todo-container {
		padding: 4px 12px 12px;
	}

	.mobile-todo-add-form {
		display: flex;
		gap: 6px;
		margin-bottom: 10px;
	}

	.mobile-todo-add-form input {
		flex: 1;
		border: 1.5px solid var(--color-border-on-foreground-deeper);
		border-radius: 10px;
		padding: 8px 12px;
		font-size: 13px;
		background: var(--color-foreground);
		color: var(--color-text-deeper);
		transition: all var(--animation-fast) var(--ease-standard),
			transform var(--animation-fast) var(--ease-spring);
		outline: none;
	}

	.mobile-todo-add-form input:focus {
		border-color: var(--themecolor);
		box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.1);
		transform: scale(1.01);
	}

	.mobile-todo-add-form input::placeholder {
		color: #aaa;
		font-size: 12px;
	}

	.mobile-todo-add-form button {
		width: 36px;
		height: 36px;
		border: none;
		border-radius: 10px;
		background: var(--themecolor);
		color: #fff;
		font-size: 14px;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all var(--animation-fast) var(--ease-spring);
		flex-shrink: 0;
		box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.3);
	}

	.mobile-todo-add-form button:active {
		transform: scale(0.88);
		background: var(--themecolor-dark);
		box-shadow: 0 1px 4px rgba(var(--themecolor-rgbstr), 0.2);
	}

	.mobile-todo-list {
		list-style: none;
		padding: 0;
		margin: 0;
		max-height: 200px;
		overflow-y: auto;
	}

	.mobile-todo-list::-webkit-scrollbar {
		width: 2px;
	}

	.mobile-todo-list::-webkit-scrollbar-thumb {
		background: rgba(var(--themecolor-rgbstr), 0.25);
		border-radius: 2px;
	}

	.mobile-todo-item {
		display: flex;
		align-items: center;
		padding: 10px 12px;
		background: var(--color-foreground);
		border-radius: 10px;
		margin-bottom: 6px;
		transition: all var(--animation-fast) var(--ease-standard),
			transform var(--animation-fast) var(--ease-spring),
			box-shadow var(--animation-fast) var(--ease-standard);
		animation: mobileTodoSlideIn 0.35s var(--ease-emphasized-decelerate) both;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
	}

	@keyframes mobileTodoSlideIn {
		from {
			opacity: 0;
			transform: translateY(-10px) scale(0.94);
		}

		to {
			opacity: 1;
			transform: translateY(0) scale(1);
		}
	}

	.mobile-todo-item:last-child {
		margin-bottom: 0;
	}

	.mobile-todo-item:active {
		transform: scale(0.97);
		background: var(--color-border-on-foreground);
		box-shadow: 0 0 0 rgba(0, 0, 0, 0);
	}

	.mobile-todo-content {
		flex: 1;
		font-size: 13px;
		color: var(--color-text-deeper);
		line-height: 1.4;
		word-break: break-word;
	}

	.mobile-todo-complete-btn,
	.mobile-todo-urge-btn,
	.mobile-todo-delete-btn {
		width: 28px;
		height: 28px;
		border: none;
		border-radius: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all var(--animation-fast) var(--ease-spring);
		flex-shrink: 0;
		margin-left: 8px;
		font-size: 11px;
	}

	.mobile-todo-complete-btn {
		background: rgba(40, 167, 69, 0.12);
		color: #28a745;
	}

	.mobile-todo-complete-btn:active {
		background: #28a745;
		color: #fff;
		transform: scale(0.85);
		box-shadow: 0 2px 8px rgba(40, 167, 69, 0.4);
	}

	.mobile-todo-urge-btn {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
	}

	.mobile-todo-urge-btn:active {
		background: var(--themecolor);
		color: #fff;
		transform: scale(0.85);
		box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.4);
	}

	.mobile-todo-urge-btn.urged {
		background: #28a745;
		color: #fff;
		animation: urgeSuccessMobile 0.5s var(--ease-spring);
	}

	@keyframes urgeSuccessMobile {

		0%,
		100% {
			transform: scale(1);
		}

		50% {
			transform: scale(1.15);
		}
	}

	.mobile-todo-delete-btn {
		background: rgba(220, 53, 69, 0.1);
		color: #dc3545;
	}

	.mobile-todo-delete-btn:active {
		background: #dc3545;
		color: #fff;
		transform: scale(0.85);
		box-shadow: 0 2px 8px rgba(220, 53, 69, 0.4);
	}

	.mobile-todo-done-mark {
		width: 28px;
		height: 28px;
		border-radius: 8px;
		background: rgba(40, 167, 69, 0.1);
		color: #28a745;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 10px;
		margin-left: 8px;
		flex-shrink: 0;
	}

	.mobile-todo-item.todo-completed .mobile-todo-content {
		text-decoration: line-through;
		color: #adb5bd;
	}

	.mobile-todo-item.todo-completed {
		opacity: 0.6;
		order: 1;
		transform: scale(0.98);
		max-height: 500px;
		overflow: hidden;
		transition: all var(--animation-normal) var(--ease-emphasized),
			max-height var(--animation-normal) var(--ease-emphasized),
			margin var(--animation-normal) var(--ease-emphasized),
			padding var(--animation-normal) var(--ease-emphasized),
			opacity var(--animation-normal) var(--ease-emphasized);
	}

	.mobile-todo-item.todo-completed.collapsed {
		max-height: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
		opacity: 0;
		transform: translateY(-10px) scale(0.9);
	}

	.mobile-todo-item.todo-completing {
		opacity: 0;
		transform: translateX(40px) scale(0.85);
		max-height: 0;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
		transition: all 0.4s var(--ease-emphasized-accelerate);
	}

	.mobile-todo-empty {
		text-align: center;
		color: #bbb;
		font-size: 12px;
		padding: 20px 0;
	}

	.mobile-todo-empty::before {
		content: "\f0ae";
		font-family: FontAwesome;
		display: block;
		font-size: 24px;
		margin-bottom: 8px;
		opacity: 0.35;
	}

	/* 移动端折叠已完成按钮 */
	.mobile-todo-collapse-btn {
		display: flex;
		align-items: center;
		gap: 3px;
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
		border: none;
		border-radius: 8px;
		padding: 2px 6px;
		font-size: 10px;
		font-weight: 600;
		cursor: pointer;
		transition: all var(--animation-fast) var(--ease-standard);
		margin-left: 6px;
		flex-shrink: 0;
	}

	.mobile-todo-collapse-btn:active {
		background: rgba(var(--themecolor-rgbstr), 0.25);
		transform: scale(0.92);
	}

	.mobile-todo-collapse-btn i {
		font-size: 8px;
		transition: transform var(--animation-fast) var(--ease-standard);
	}

	.mobile-todo-collapse-btn.collapsed i {
		transform: rotate(-90deg);
	}

	.mobile-todo-completed-count {
		min-width: 10px;
		text-align: center;
	}

	/* 移动端已完成任务分隔�?*/
	.mobile-todo-completed-divider {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 8px 12px;
		margin: 8px 0 6px;
		background: var(--color-foreground);
		border-radius: 10px;
		cursor: pointer;
		transition: all var(--animation-fast) var(--ease-standard);
		user-select: none;
		border-top: 1px dashed rgba(var(--themecolor-rgbstr), 0.2);
		border-bottom: 1px dashed rgba(var(--themecolor-rgbstr), 0.2);
		list-style: none;
	}

	.mobile-todo-completed-divider:active {
		background: rgba(var(--themecolor-rgbstr), 0.08);
		transform: scale(0.98);
	}

	.mobile-todo-completed-divider .divider-text {
		display: flex;
		align-items: center;
		gap: 5px;
		font-size: 11px;
		font-weight: 600;
		color: #6c757d;
	}

	.mobile-todo-completed-divider .divider-text i {
		color: #28a745;
		font-size: 10px;
	}

	.mobile-todo-completed-divider .mobile-todo-completed-count {
		background: rgba(40, 167, 69, 0.15);
		color: #28a745;
		font-size: 9px;
		font-weight: 600;
		padding: 2px 5px;
		border-radius: 6px;
		min-width: 16px;
		text-align: center;
	}

	.mobile-todo-completed-divider .divider-arrow {
		font-size: 9px;
		color: #6c757d;
		transition: transform var(--animation-fast) var(--ease-standard);
	}

	.mobile-todo-completed-divider.collapsed .divider-arrow {
		transform: rotate(-90deg);
	}

	#navbar_global {
		background: var(--color-foreground);
	}

	#float_action_buttons #fabtn_open_sidebar {
		display: block;
	}

	/* 移动端隐藏浮动按钮提示文�?*/
	#float_action_buttons .fabtn:before {
		display: none !important;
	}

	/* 移动端侧边栏容器 - 优化动画 */
	#leftbar {
		position: fixed;
		background: var(--color-foreground);
		top: 0;
		left: 0;
		height: 100%;
		width: 300px;
		padding: 0;
		margin-bottom: 0;
		overflow: auto;
		overflow-x: hidden;
		z-index: 1002;
		box-shadow: 4px 0 24px rgba(0, 0, 0, 0.12);
		transform: translateX(-100%);
		transition: transform var(--animation-normal) var(--ease-emphasized);
		will-change: transform;
	}

	html.leftbar-opened #leftbar {
		transform: translateX(0);
	}

	/* 移动端侧边栏入场动画关键�?*/
	@keyframes slideInFromLeft {
		from {
			opacity: 0;
			transform: translateX(-20px);
		}

		to {
			opacity: 1;
			transform: translateX(0);
		}
	}

	@keyframes fadeInUp {
		from {
			opacity: 0;
			transform: translateY(16px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	@keyframes scaleIn {
		from {
			opacity: 0;
			transform: scale(0.8);
		}

		to {
			opacity: 1;
			transform: scale(1);
		}
	}

	@keyframes circleExpand {
		from {
			transform: scale(0.6);
			opacity: 0;
		}

		to {
			transform: scale(1);
			opacity: 1;
		}
	}

	/* 侧边栏内容交错入场动�?*/
	html.leftbar-opened .leftbar-mobile-profile {
		animation: slideInFromLeft 0.4s var(--ease-emphasized) 0.05s both;
	}

	html.leftbar-opened .leftbar-mobile-avatar {
		animation: scaleIn 0.35s var(--ease-spring) 0.15s both;
	}

	html.leftbar-opened .leftbar-mobile-user-info {
		animation: fadeInUp 0.35s var(--ease-emphasized) 0.2s both;
	}

	/* 多邻国连胜徽章入场动�?*/
	html.leftbar-opened .leftbar-mobile-user-name .duolingo-streak {
		animation: duolingoBadgeIn 0.4s var(--ease-spring) 0.35s both;
	}

	@keyframes duolingoBadgeIn {
		from {
			opacity: 0;
			transform: scale(0.5) translateX(-10px);
		}

		to {
			opacity: 1;
			transform: scale(1) translateX(0);
		}
	}

	html.leftbar-opened .leftbar-mobile-stats {
		animation: fadeInUp 0.35s var(--ease-emphasized) 0.25s both;
	}

	html.leftbar-opened .leftbar-mobile-profile::before {
		animation: circleExpand 0.5s var(--ease-spring) 0.2s both;
	}

	html.leftbar-opened .leftbar-mobile-profile::after {
		animation: circleExpand 0.5s var(--ease-spring) 0.3s both;
	}

	html.leftbar-opened .leftbar-mobile-search {
		animation: slideInFromLeft 0.4s var(--ease-emphasized) 0.12s both;
	}

	html.leftbar-opened .leftbar-mobile-menu-section:nth-child(3) {
		animation: slideInFromLeft 0.4s var(--ease-emphasized) 0.18s both;
	}

	html.leftbar-opened .leftbar-mobile-menu-section:nth-child(4) {
		animation: slideInFromLeft 0.4s var(--ease-emphasized) 0.24s both;
	}

	html.leftbar-opened .leftbar-mobile-footer {
		animation: fadeInUp 0.4s var(--ease-emphasized) 0.3s both;
	}

	/* 菜单项交错入�?*/
	html.leftbar-opened .leftbar-mobile-menu-item {
		animation: fadeInUp 0.3s var(--ease-standard) both;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(1) {
		animation-delay: 0.22s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(2) {
		animation-delay: 0.26s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(3) {
		animation-delay: 0.30s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(4) {
		animation-delay: 0.34s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(5) {
		animation-delay: 0.38s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(6) {
		animation-delay: 0.42s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(7) {
		animation-delay: 0.46s;
	}

	html.leftbar-opened .leftbar-mobile-menu-item:nth-child(8) {
		animation-delay: 0.50s;
	}

	#leftbar_part1,
	#leftbar_part2 {
		box-shadow: none !important;
	}

	#leftbar_part2 {
		position: relative !important;
		width: 100% !important;
		top: unset !important;
	}

	#leftbar_part2_inner {
		max-height: unset;
		height: max-content;
		height: -moz-max-content;
	}

	#leftbar_part2_inner:before {
		content: "";
		display: block;
		margin: auto;
		margin-bottom: 15px;
		transform: translateY(-10px);
		width: 80%;
		height: 1px;
		background: var(--color-border-on-foreground-deeper);
	}

	#leftbar::-webkit-scrollbar {
		display: none;
	}

	html.leftbar-opened {
		overflow: hidden;
	}

	/* 遮罩�?- 优化动画 */
	#sidebar_mask {
		position: fixed;
		display: block;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100vw;
		height: 100vh;
		z-index: 1001;
		background: rgba(0, 0, 0, 0.5);

		-webkit-backdrop-filter: blur(2px);

		backdrop-filter: blur(2px);
		opacity: 0;
		visibility: hidden;
		transition: opacity var(--animation-normal) var(--ease-standard),
			visibility var(--animation-normal) var(--ease-standard);
	}

	html.leftbar-opened #sidebar_mask {
		opacity: 1;
		visibility: visible;
	}

	.leftbar-menu-item {
		overflow: hidden;
	}

	.leftbar-menu-item:hover {
		height: max-content;
	}

	.leftbar-menu-item:hover:after {
		transform: rotateZ(90deg) translateY(1px);
	}

	.leftbar-menu-subitem {
		position: static;
		width: calc(100% - 10px) !important;
		margin-left: 10px;
		box-shadow: none !important;
	}

	.leftbar-menu-item:hover .leftbar-menu-subitem {

		position: static;

		width: 100%;

		box-shadow: none;

	}

	.leftbar-banner {

		padding-top: 40px;

		padding-bottom: 40px;

		padding-left: 20px;

		text-align: left;

		border-radius: 0;

	}

	.leftbar-banner-subtitle {

		margin-top: 10px;

	}

	#leftbar_announcement {

		border-radius: 0;

		margin-bottom: 0;

		background: linear-gradient(180deg, var(--themecolor-dark), var(--themecolor) 90%);

	}

	html.darkmode #leftbar_announcement {

		background: var(--color-border-on-foreground) !important;

	}

	#leftbar_announcement:after {

		content: "";

		height: 1px;

		background: #fff;

		opacity: 0.15;

		margin-left: 15px;

		margin-right: 15px;

	}

	.leftbar-announcement-body {

		opacity: 0.8;

		padding-top: 20px;

	}

	#leftbar_announcement~#leftbar_part1 .leftbar-banner {

		background: var(--themecolor) !important;

		padding-top: 25px;

		padding-bottom: 25px;

	}

	html.darkmode #leftbar_announcement~#leftbar_part1 .leftbar-banner {

		background: var(--color-border-on-foreground) !important;

	}

	#primary {

		width: 100%;

	}

	#main {

		padding: 5px;

	}



	.post-header.post-header-with-thumbnail .post-header-text-container {

		padding-bottom: 20px;

	}

	.post-thumbnail {

		max-height: 30vh;

	}

	.post-header.post-header-with-thumbnail .post-header-text-container {

		padding-bottom: 20px;

	}



	.post-donate img {

		max-width: 70vw;

	}



	#comments .children {
		padding-inline-start: 15px;
	}

	/* 夜间模式适配 - 移动端侧边栏 */
	html.darkmode .leftbar-mobile-profile {
		background: linear-gradient(135deg,
				rgba(var(--themecolor-rgbstr), 0.8) 0%,
				rgba(var(--themecolor-rgbstr), 0.6) 100%);
	}

	html.darkmode .leftbar-mobile-profile::before,
	html.darkmode .leftbar-mobile-profile::after {
		background: rgba(255, 255, 255, 0.05);
	}

	html.darkmode .leftbar-mobile-stats {
		background: rgba(0, 0, 0, 0.2);
	}

	html.darkmode .leftbar-mobile-search-inner {
		background: var(--color-background);
	}

	html.darkmode .leftbar-mobile-search-inner:focus-within {
		background: var(--color-widgets);
	}

	html.darkmode .leftbar-mobile-action {
		background: var(--color-widgets);
		color: #aaa;
	}

	html.darkmode .leftbar-mobile-action:active {
		color: var(--themecolor-light);
	}

	html.darkmode .leftbar-mobile-section-title {
		color: #777;
	}

	html.darkmode .leftbar-mobile-submenu .leftbar-mobile-menu-item>a {
		color: #999;
	}

	/* ========== 移动端文章卡片独立样�?========== */
	/* 移动端布局 1: 大图模式 (默认) */
	html.mobile-layout-1 article.post-preview-layout-2,
	article.post-preview-layout-2 {
		flex-direction: column;
		max-height: none;
	}

	html.mobile-layout-1 article.post-preview-layout-2 .post-header.post-header-with-thumbnail,
	article.post-preview-layout-2 .post-header.post-header-with-thumbnail {
		width: 100%;
		height: 200px;
		border-radius: var(--card-radius) var(--card-radius) 0 0;
	}

	html.mobile-layout-1 article.post-preview-layout-2 .post-thumbnail,
	article.post-preview-layout-2 .post-thumbnail {
		height: 200px !important;
		max-height: 200px !important;
	}

	html.mobile-layout-1 article.post-preview-layout-2 .post-content-container,
	article.post-preview-layout-2 .post-content-container {
		padding: 18px 20px 20px;
	}

	html.mobile-layout-1 article.post-preview-layout-2 .post-content,
	article.post-preview-layout-2 .post-content {
		-webkit-line-clamp: 3;
		margin-top: 12px;
		line-height: 1.7;
	}

	/* 移动端布局 2: 紧凑模式 */
	html.mobile-layout-2 article.post-preview-layout-2 {
		flex-direction: column;
		max-height: none;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-header.post-header-with-thumbnail {
		width: 100%;
		height: 140px;
		border-radius: var(--card-radius) var(--card-radius) 0 0;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-thumbnail {
		height: 140px !important;
		max-height: 140px !important;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-content-container {
		padding: 14px 16px 16px;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-content {
		-webkit-line-clamp: 2;
		margin-top: 8px;
		line-height: 1.6;
		font-size: 14px;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-title {
		font-size: 16px;
	}

	html.mobile-layout-2 article.post-preview-layout-2 .post-meta-detail {
		font-size: 12px;
	}

	/* 移动端布局 3: 横向模式 */
	html.mobile-layout-3 article.post-preview-layout-2 {
		flex-direction: row;
		max-height: 120px;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-header.post-header-with-thumbnail {
		width: 120px;
		height: 120px;
		border-radius: var(--card-radius) 0 0 var(--card-radius);
		flex-shrink: 0;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-thumbnail {
		height: 120px !important;
		max-height: 120px !important;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-content-container {
		padding: 12px 14px;
		justify-content: center;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-content {
		-webkit-line-clamp: 2;
		margin-top: 6px;
		line-height: 1.5;
		font-size: 13px;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-title {
		font-size: 15px;
		line-height: 1.3;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-meta-detail {
		font-size: 11px;
	}

	html.mobile-layout-3 article.post-preview-layout-2 .post-tags {
		display: none;
	}

	/* 通用移动端文章卡片样�?*/
	article.post-preview-layout-2 .post-title {
		font-size: 18px;
		line-height: 1.4;
	}

	article.post-preview-layout-2 .post-meta-detail {
		font-size: 13px;
	}

	/* ========== 移动端搜索框动画 (照搬桌面�? ========== */
	.leftbar-mobile-search-inner {
		position: relative;
		transition: all 0.3s cubic-bezier(0.4, 0, 0, 1);
	}

	.leftbar-mobile-search-inner:focus-within {
		transform: scale(1.02);
		box-shadow: 0 4px 12px rgba(var(--themecolor-rgbstr), 0.15);
	}

	.leftbar-mobile-search-inner input {
		transition: all 0.3s cubic-bezier(0.4, 0, 0, 1);
	}

	/* 搜索框聚焦时的光标动�?*/
	@keyframes searchPulse {

		0%,
		100% {
			box-shadow: 0 0 0 0 rgba(var(--themecolor-rgbstr), 0.2);
		}

		50% {
			box-shadow: 0 0 0 4px rgba(var(--themecolor-rgbstr), 0.1);
		}
	}

	.leftbar-mobile-search-inner:focus-within {
		animation: searchPulse 2s ease-in-out infinite;
	}

	/* ========== 更多流畅侧边栏动�?========== */
	/* 关闭按钮旋转入场 */
	@keyframes rotateIn {
		from {
			opacity: 0;
			transform: rotate(-90deg) scale(0.5);
		}

		to {
			opacity: 1;
			transform: rotate(0) scale(1);
		}
	}

	html.leftbar-opened .leftbar-mobile-close {
		animation: rotateIn 0.4s var(--ease-spring) 0.1s both;
	}

	/* 统计数字弹跳动画 */
	@keyframes bounceIn {
		0% {
			opacity: 0;
			transform: scale(0.3);
		}

		50% {
			transform: scale(1.1);
		}

		70% {
			transform: scale(0.9);
		}

		100% {
			opacity: 1;
			transform: scale(1);
		}
	}

	html.leftbar-opened .leftbar-mobile-stat:nth-child(1) .stat-num {
		animation: bounceIn 0.5s var(--ease-spring) 0.3s both;
	}

	html.leftbar-opened .leftbar-mobile-stat:nth-child(2) .stat-num {
		animation: bounceIn 0.5s var(--ease-spring) 0.4s both;
	}

	html.leftbar-opened .leftbar-mobile-stat:nth-child(3) .stat-num {
		animation: bounceIn 0.5s var(--ease-spring) 0.5s both;
	}

	/* 搜索图标脉冲动画 */
	@keyframes iconPulse {

		0%,
		100% {
			transform: scale(1);
		}

		50% {
			transform: scale(1.2);
		}
	}

	html.leftbar-opened .leftbar-mobile-search-inner i {
		animation: iconPulse 0.6s var(--ease-spring) 0.35s both;
	}

	/* 底部按钮交错入场 */
	html.leftbar-opened .leftbar-mobile-action:nth-child(1) {
		animation: fadeInUp 0.35s var(--ease-emphasized) 0.35s both;
	}

	html.leftbar-opened .leftbar-mobile-action:nth-child(2) {
		animation: fadeInUp 0.35s var(--ease-emphasized) 0.42s both;
	}

	html.leftbar-opened .leftbar-mobile-action:nth-child(3) {
		animation: fadeInUp 0.35s var(--ease-emphasized) 0.49s both;
	}

	/* 底部按钮图标悬浮效果 */
	.leftbar-mobile-action i {
		transition: transform 0.3s var(--ease-spring);
	}

	.leftbar-mobile-action:active i {
		transform: scale(1.15) rotate(-5deg);
	}

	/* 菜单项悬浮指示器 */
	.leftbar-mobile-menu-item.current>a {
		position: relative;
	}

	.leftbar-mobile-menu-item.current>a::after {
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 4px;
		height: 20px;
		background: var(--themecolor);
		border-radius: 0 4px 4px 0;
		animation: slideInFromLeft 0.3s var(--ease-spring) both;
	}

	/* 子菜单展开箭头旋转 */
	.leftbar-mobile-menu-item .submenu-arrow {
		transition: transform 0.3s var(--ease-spring);
	}

	.leftbar-mobile-menu-item.expanded .submenu-arrow {
		transform: rotate(180deg);
	}

	/* 遮罩层淡入增�?*/
	#sidebar_mask {
		transition: opacity 0.35s var(--ease-emphasized),
			visibility 0.35s var(--ease-emphasized),
			backdrop-filter 0.35s var(--ease-emphasized);
	}

	html.leftbar-opened #sidebar_mask {

		-webkit-backdrop-filter: blur(4px);

		backdrop-filter: blur(4px);
	}
}

@media screen and (max-width: 1000px) {

	.navbar-main {

		padding-left: 10px;

		padding-right: 10px;

	}

	.navbar-main .container {

		margin: 0;

		max-width: 100vw;

	}

	.navbar-toggler-icon {

		width: 20px;

		height: 20px;

	}

}

@media screen and (max-width: 900px) {

	.navbar-toggler {

		outline: none !important;

	}

	.navbar-collapse-header {

		border: none !important;

	}

	.navbar-collapse .navbar-collapse-header {

		margin-bottom: 0 !important;

	}

	html.darkmode #navbar_global * {

		color: #eee;

	}

	html.darkmode #navbar_global .navbar-toggler * {
		background: #eee;
	}

	/*.navbar-brand.navbar-icon {

		display: none;

	}

	.navbar-brand.navbar-icon-mobile {

		display: block;

		margin-right: 5px;

	}*/

	.navbar-title {

		margin-right: 0;

	}

	#navbar_search_btn_mobile {

		display: list-item;

	}

	#navbar_search_container {

		display: none;

	}

	#navbar_global.show+#navbar_menu_mask {

		display: block;

		position: fixed;

		left: 0;

		top: 0;

		height: 100vh;

		width: 100vw;

		z-index: 1049;

		background: transparent;

	}

	.navbar-nav:not(#navbar_search_btn_mobile)>.nav-item i:not(.d-lg-none) {

		margin-right: 8px;

		text-align: center;

		width: 14px;

	}



	.navbar-nav:not(#navbar_search_btn_mobile)>.nav-item i:not(.d-lg-none) {

		margin-right: 8px;

		text-align: center;

		width: 14px;

	}



	.navbar-transparent .navbar-toggler-icon {

		background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4wLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i5Zu+5bGCXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMzAgMzAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMwIDMwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIyLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiB4MT0iNi4zIiB5MT0iNCIgeDI9IjI3LjEiIHkyPSI0Ii8+DQo8bGluZSBmaWxsPSJub25lIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMi41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgeDE9IjYuMyIgeTE9IjEyLjUiIHgyPSIyNy4xIiB5Mj0iMTIuNSIvPg0KPGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjIuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHgxPSI2LjMiIHkxPSIyMSIgeDI9IjI3LjEiIHkyPSIyMSIvPg0KPC9zdmc+DQo=);

	}

	.navbar-toggler-searcg-icon {

		background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMwIDMwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48Zz48Y2lyY2xlIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIyLjUiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgY3g9IjE0IiBjeT0iMTEuNiIgcj0iOC44Ii8+PGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjIuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHgxPSIyMC43IiB5MT0iMTcuNCIgeDI9IjI3LjMiIHkyPSIyNCIvPjwvZz48L3N2Zz4=) !important;

	}

}

@media screen and (min-width: 900px) and (max-width: 1000px) {

	#leftbar_part2.sticky {

		transform: translateY(-25px);

	}

	body.leftbar-can-headroom.headroom---unpinned #leftbar_part2.sticky {

		transform: translateY(-5px);

	}

}

@media screen and (max-width: 900px) {

	/*TimeLine*/

	.argon-timeline {

		margin-left: 75px;

	}

}

@media screen and (max-width: 450px) {

	/*Fab 设置菜单*/

	#fabtn_blog_settings_popup {

		position: fixed;

		left: 0 !important;

		right: 0 !important;

		bottom: 0 !important;

		z-index: 1005;

		width: 100vw;

		padding: 10px 25px;

		opacity: 0;

		max-width: unset;

		pointer-events: none;

		transform: translateY(15px);

		transition: all 0.3s ease;

		animation: none !important;

		border-radius: var(--card-radius) var(--card-radius) 0 0;

	}

	#close_blog_settings {

		margin-right: -10px;

	}

}

@media screen and (max-width: 600px) {

	/*浮动操作按钮透明*/

	#float_action_buttons {

		opacity: 0.5;

	}

	#float_action_buttons:hover,

	#float_action_buttons.blog_settings_opened {

		opacity: 1;

	}

	/*文章边界缩小*/

	.post-full {

		margin-left: -10px;

		margin-right: -10px;

	}

	/*显示更少的页�?/

	.pagination:not(.pagination-mobile) {

		display: none;

	}

	.pagination.pagination-mobile {

		display: flex;

	}

}

@media screen and (max-width: 690px) {

	/*文章分享的浮动二维码*/

	#share .icon-wechat .wechat-qrcode {

		position: fixed;

		z-index: 2000;

		left: 50%;

		top: 50%;

		bottom: unset;

		right: unset;

		width: max-content;

		width: -moz-max-content;

		background: var(--color-foreground);

		box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);

		text-align: center;

		padding: 15px 30px;

		transition: visibility 0.25s, opacity 0.25s, transform 0.25s;

		transform: translate(-50%, calc(-50% + 10px));

		opacity: 0;

		pointer-events: none;

	}

	#share .icon-wechat:hover .wechat-qrcode {

		transform: translate(-50%, -50%);

		opacity: 1;

	}

	#share .wechat-qrcode:before {

		display: none;

	}

	#share .icon-wechat:before {

		content: "";

		display: block;

		position: fixed;

		left: 0;

		top: 0;

		right: 0;

		bottom: 0;

		height: 100%;

		width: 100%;

		z-index: 1999;

		pointer-events: none;

		transform: none;

		background: rgba(0, 0, 0, 0.6);

		opacity: 0;

	}

	#share .icon-wechat:hover:before {

		opacity: 1;

	}

}



/*打印样式优化*/

@media print {

	#leftbar,

	#post_comment,

	#float_action_buttons,

	#toolbar,

	#share_container {

		display: none !important;

	}

	#primary {

		width: 100% !important;

	}

	#content {

		max-width: unset !important;

	}

	article {

		width: 100% !important;

	}

	article .post-content a {

		text-decoration: underline !important;

	}

	article a::after {

		content: " (" attr(href) ")";

	}

	html>body {

		background-color: white !important;

	}

	article p {

		color: rgba(0, 0, 0, 0.8) !important;

	}

	article {

		font: 13pt Georgia, "Nimbus Roman No9 L", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC",

			"Source Han Serif CN", STSong, "AR PL New Sung", "AR PL SungtiL GB", NSimSun, SimSun, "TW\-Sung",

			"WenQuanYi Bitmap Song", "AR PL UMing CN", "AR PL UMing HK", "AR PL UMing TW", "AR PL UMing TW MBE",

			PMingLiU, MingLiU, serif !important;

	}

}

/*Noscript*/

html.no-js article img.lazyload[src^="data:image/svg+xml;base64,PCEtLUFyZ29uTG9hZGluZy0tPg"] {

	display: none;

}

html.no-js .comment-item-text .comment-sticker.lazyload {

	display: none;

}



/*Safari 兼容*/

html.using-safari #float_action_buttons .fabtn:before,

html.using-safari #share>a:before,

html.using-safari #share_show:before,

html.using-safari .post-comment-link-container:before,

html.using-safari .post-comment-captcha-container:before,

html.using-safari #post_comment_toggle_extra_input:before,

html.using-safari .comment-post-checkbox:before,

html.using-safari .comment-time-details,

html.using-safari #share .icon-wechat .wechat-qrcode {

	-webkit-transform: translate3d(0, 0, 0) !important;
	transform: translate3d(0, 0, 0) !important;

	width: unset !important;

	white-space: nowrap;

}

@media screen and (max-width: 690px) {

	html.using-safari #share .icon-wechat .wechat-qrcode {

		transform: translate3d(-50%, -50%, 0) !important;

	}

}

html.using-safari .post-donate .donate-btn:hover~.donate-qrcode {

	transform: translateX(-50%);

	opacity: 1;

}

html.using-safari #fabtn_blog_settings_popup {

	-webkit-transform: translate3d(0, 0, 0) !important;
	transform: translate3d(0, 0, 0) !important;

}

html.using-safari #blog_setting_toggle_darkmode_and_amoledarkmode:before,

html.using-safari #blog_setting_card_radius_to_default:before {

	transform: translate3d(-50%, 0, 0) !important;

	white-space: nowrap;

}

html.using-safari .friend-link-description:after {

	display: none;

}


/* 下面是抄袭萌娘百科的css */
.huhua {
	color: #9ea3a9 !important;
	text-decoration: line-through !important;
	text-shadow: none !important;
	transition: color .2s ease;
}

.huhua a {
	color: inherit !important;
	text-decoration: inherit !important;
}

.huhua:hover,
.huhua:active {
	color: #7f858b !important;
}

.text-blur,
.text-blur a,
a .text-blur,
.text-blur a.new {
	filter: blur(2px) !important;
	transition: filter var(--text-blur-transition-time, .2s) ease, color var(--text-blur-transition-time, .2s) ease;
	display: inline-block;
}

.text-blur a {
	color: inherit !important;
}

.text-blur:hover,
.text-blur:active,
.text-blur:hover .text-blur,
.text-blur:active .text-blur {
	filter: none !important;
	color: var(--text-blur-color, inherit) !important;
}

.text-blur:hover a,
a:hover .text-blur,
.text-blur:active a,
a:active .text-blur {
	filter: none !important;
	color: inherit !important;
}

.color-curtain,
.color-curtain a,
a .color-curtain,
.color-curtain a.new {
	background-color: var(--curtain-bg, #252525) !important;
	color: var(--curtain-bg, #252525) !important;
	text-shadow: none !important;
	text-decoration: none !important;
	transition: color .2s ease, background-color .2s ease;
}

.color-curtain a {
	color: inherit !important;
	transition: inherit !important;
}

.color-curtain:hover,
.color-curtain:active,
.color-curtain:hover .color-curtain,
.color-curtain:active .color-curtain {
	color: var(--curtain-fg, #fff) !important;
}

.color-curtain:hover a,
a:hover .color-curtain,
.color-curtain:active a,
a:active .color-curtain {
	color: inherit !important;
}

.color-curtain:hover .new,
.color-curtain .new:hover,
.new:hover .color-curtain,
.color-curtain:active .new,
.color-curtain .new:active,
.new:active .color-curtain {
	color: #BA0000 !important;
}

/* 
  * 放置于这里的CSS将应用于所有皮�?
  * 萌娘百科仅开放Vector皮肤 
  * 请尊重萌娘百科版权，以下代码除非注明均是管理员手敲出来的！！！复制需要注明源自萌娘百科，并且附上URL地址 `http://zh.moegirl.org/MediaWiki:Common.css` 
  * 版权协定：知识共�?署名-非商业性使�?相同方式共享 3.0 
  * 复制之后请把图片换成自己网站上URL地址�?
  */

.heimu,
.heimu a,
a .heimu,
.heimu a.new {
	background-color: #252525 !important;
	color: #252525 !important;
	text-shadow: none !important;
	transition: color var(--heimu-transition-time, .2s) ease, background-color var(--heimu-transition-time, .2s) ease;
}

.heimu a {
	color: inherit !important;
	transition: inherit;
}

.heimu:hover,
.heimu:active,
.heimu:hover .heimu,
.heimu:active .heimu {
	color: white !important;
}

.heimu:hover a,
a:hover .heimu,
.heimu:active a,
a:active .heimu {
	color: inherit !important;
}

.heimu:hover .new,
.heimu .new:hover,
.new:hover .heimu,
.heimu:active .new,
.heimu .new:active,
.new:active .heimu {
	color: #BA0000 !important;
}

/* Fix macro styles in dark mode */
html.darkmode .heimu a,
html.darkmode .color-curtain a {
	color: inherit !important;
}

html.darkmode .heimu:hover a,
html.darkmode .color-curtain:hover a {
	color: inherit !important;
}

/* Ensure heimu/color-curtain visibility in dark mode comment sections */
html.darkmode .comment-content .heimu,
html.darkmode .comment-content .color-curtain {
	background-color: #252525 !important;
	color: #252525 !important;
}

html.darkmode .comment-content .heimu:hover,
html.darkmode .comment-content .heimu:active,
html.darkmode .comment-content .color-curtain:hover,
html.darkmode .comment-content .color-curtain:active {
	color: #fff !important;
}

/* Disable global underline effect for links in macros to prevent animation conflicts */
article .post-content .heimu a:before,
article .post-content .color-curtain a:before,
article .post-content .text-blur a:before,
article .post-content .huhua a:before {
	display: none !important;
	content: none !important;
}

/* Ensure links in macros inherit transition properties */
.heimu a,
.color-curtain a,
.text-blur a,
.huhua a {
	transition: inherit !important;
}


/* ===== Git 版本徽章 ===== */
.git-version-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: 8px;
	padding: 2px 8px;
	background: rgba(0, 0, 0, 0.15);
	border-radius: 10px;
	font-size: 11px;
	font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
	color: inherit;
	opacity: 0.7;
	transition: opacity 0.2s ease;
	vertical-align: middle;
	cursor: pointer;
	user-select: none;
}

.git-version-badge:hover {
	opacity: 1;
}

.git-version-badge .git-icon {
	width: 11px;
	height: 11px;
	color: #f05033;
	flex-shrink: 0;
}

/* Git 彩蛋弹窗 */
.git-easter-egg-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.6);

	-webkit-backdrop-filter: blur(8px);

	backdrop-filter: blur(8px);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.git-easter-egg-overlay.show {
	opacity: 1;
	visibility: visible;
}

.git-easter-egg-modal {
	background: var(--color-background, #fff);
	border-radius: 20px;
	box-shadow: 0 25px 80px rgba(0, 0, 0, 0.3);
	padding: 40px 50px;
	text-align: center;
	transform: scale(0.7) translateY(30px);
	opacity: 0;
	transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
	max-width: 90%;
	min-width: 300px;
	position: relative;
	z-index: 2;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.git-easter-egg-overlay.show .git-easter-egg-modal {
	transform: scale(1) translateY(0);
	opacity: 1;
}

.git-easter-egg-emoji {
	font-size: 56px;
	margin-bottom: 15px;
	animation: eggBounce 0.8s ease infinite;
	display: inline-block;
}

@keyframes eggBounce {

	0%,
	100% {
		transform: translateY(0) rotate(-5deg);
	}

	50% {
		transform: translateY(-12px) rotate(5deg);
	}
}

.git-easter-egg-content {
	font-size: 18px;
	color: var(--color-text, #525f7f);
	margin-bottom: 30px;
	line-height: 1.7;
	font-weight: 500;
}

.git-easter-egg-buttons {
	display: flex;
	gap: 15px;
	justify-content: center;
}

.git-easter-egg-btn {
	padding: 12px 32px;
	border: none;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
}

.git-easter-egg-btn.btn-good {
	background: var(--themecolor, #5e72e4);
	color: #fff;
}

.git-easter-egg-btn.btn-good:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 25px rgba(94, 114, 228, 0.4);
}

.git-easter-egg-btn.btn-good:active {
	transform: translateY(-1px);
}

.git-easter-egg-btn.btn-bad {
	position: fixed;
	z-index: 10001;
	background: linear-gradient(135deg, #ff6b6b, #ee5a5a);
	color: #fff;
	transition: left 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
		top 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
		transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
		box-shadow 0.2s ease,
		background 0.3s ease;
	opacity: 0;
	visibility: hidden;
}

.git-easter-egg-overlay.show .git-easter-egg-btn.btn-bad {
	opacity: 1;
	visibility: visible;
}

.git-easter-egg-btn.btn-bad:hover {
	box-shadow: 0 8px 25px rgba(238, 90, 90, 0.5);
}

/* 假装乖巧时的样式 */
.git-easter-egg-btn.btn-bad.pretend-nice {
	background: linear-gradient(135deg, #a8e6cf, #88d8b0);
	box-shadow: 0 4px 15px rgba(136, 216, 176, 0.4);
}

/* 移动�?*/
@media screen and (max-width: 576px) {
	.git-version-badge {
		display: none;
	}
}


/* ===== TODO 列表 ===== */
#leftbar_part3 {
	margin-top: 10px;
	transition: top 0.3s ease, transform 0.3s ease;
}

#leftbar_part3.sticky {
	position: fixed;
	top: calc(80px + var(--leftbar-part2-height, 300px));
	width: 240px;
}

#leftbar_part3 .card-body {
	padding: 12px 16px;
	max-height: 50vh;
	overflow-y: auto;
}

#leftbar_part3 .card-body::-webkit-scrollbar {
	width: 6px;
}

#leftbar_part3 .card-body::-webkit-scrollbar-track {
	background: transparent;
}

#leftbar_part3 .card-body::-webkit-scrollbar-thumb {
	border-width: 1px;
	background-color: rgba(0, 0, 0, 0.2);
}

html.darkmode #leftbar_part3 .card-body::-webkit-scrollbar-thumb {
	border-width: 1px;
	background-color: rgba(255, 255, 255, 0.2);
}

#leftbar_part3 .card-body::-webkit-scrollbar-button {
	height: 5px;
	pointer-events: none;
}

body.leftbar-can-headroom.headroom---unpinned #leftbar_part3.sticky {
	top: calc(10px + var(--leftbar-part2-height, 300px));
}

html.navbar-absolute #leftbar_part3.sticky {
	top: calc(10px + var(--leftbar-part2-height, 300px)) !important;
}

@media screen and (min-width: 900px) and (max-width: 1000px) {
	#leftbar_part3.sticky {
		transform: translateY(-25px);
	}

	body.leftbar-can-headroom.headroom---unpinned #leftbar_part3.sticky {
		transform: translateY(-5px);
	}
}

.todo-title {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 10px;
	font-size: 14px;
}

.todo-title i {
	color: var(--themecolor);
	font-size: 13px;
}

.todo-count {
	background: var(--themecolor);
	color: #fff;
	font-size: 10px;
	font-weight: 600;
	padding: 2px 7px;
	border-radius: 8px;
	margin-left: auto;
}

/* 折叠已完成按�?*/
.todo-collapse-btn {
	display: flex;
	align-items: center;
	gap: 4px;
	background: rgba(var(--themecolor-rgbstr), 0.1);
	color: var(--themecolor);
	border: none;
	border-radius: 8px;
	padding: 2px 7px;
	font-size: 10px;
	font-weight: 600;
	cursor: pointer;
	transition: all var(--animation-fast) var(--ease-standard);
	margin-left: 6px;
}

.todo-collapse-btn:hover {
	background: rgba(var(--themecolor-rgbstr), 0.2);
	transform: scale(1.05);
}

.todo-collapse-btn i {
	font-size: 9px;
	transition: transform var(--animation-fast) var(--ease-standard);
}

.todo-collapse-btn.collapsed i {
	transform: rotate(-90deg);
}

.todo-completed-count {
	min-width: 12px;
	text-align: center;
}

/* 已完成任务分隔栏 */
.todo-completed-divider {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	margin: 8px 0 6px;
	background: var(--color-foreground);
	border-radius: 8px;
	cursor: pointer;
	transition: all var(--animation-fast) var(--ease-standard);
	user-select: none;
	border-top: 1px dashed rgba(var(--themecolor-rgbstr), 0.2);
	border-bottom: 1px dashed rgba(var(--themecolor-rgbstr), 0.2);
	list-style: none;
}

.todo-completed-divider:hover {
	background: rgba(var(--themecolor-rgbstr), 0.05);
}

.todo-completed-divider .divider-text {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: #6c757d;
}

.todo-completed-divider .divider-text i {
	color: #28a745;
	font-size: 11px;
}

.todo-completed-divider .todo-completed-count {
	background: rgba(40, 167, 69, 0.15);
	color: #28a745;
	font-size: 10px;
	font-weight: 600;
	padding: 2px 6px;
	border-radius: 6px;
	min-width: 18px;
	text-align: center;
}

.todo-completed-divider .divider-arrow {
	font-size: 10px;
	color: #6c757d;
	transition: transform var(--animation-fast) var(--ease-standard);
}

.todo-completed-divider.collapsed .divider-arrow {
	transform: rotate(-90deg);
}

/* 站长端：显示未完成数�?*/
.todo-count::before {
	content: '';
}

.todo-add-form {
	display: flex;
	gap: 6px;
	margin-bottom: 10px;
	align-items: center;
}

.todo-add-form input {
	flex: 1;
	border-radius: 6px;
	border: 1px solid #e9ecef;
	padding: 6px 10px;
	font-size: 13px;
	height: 32px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.todo-add-form input:focus {
	border-color: var(--themecolor);
	box-shadow: 0 0 0 3px rgba(var(--themecolor-R), var(--themecolor-G), var(--themecolor-B), 0.1);
	outline: none;
}

.todo-add-form input::placeholder {
	color: #adb5bd;
	font-size: 12px;
}

.todo-add-form button {
	padding: 0;
	width: 32px;
	height: 32px;
	border-radius: 6px;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.todo-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.todo-list-scroll {
	overflow-y: visible;
	padding-right: 0;
}

.todo-list-scroll::-webkit-scrollbar {
	width: 4px;
}

.todo-list-scroll::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 2px;
}

.todo-list-scroll::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 2px;
}

.todo-list-scroll::-webkit-scrollbar-thumb:hover {
	background: #aaa;
}

.todo-item {
	display: flex;
	align-items: center;
	padding: 8px 10px;
	background: var(--color-foreground, #f8f9fa);
	border-radius: 8px;
	margin-bottom: 6px;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	animation: todoSlideIn 0.3s ease;
}

@keyframes todoSlideIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.todo-item:last-child {
	margin-bottom: 0;
}

.todo-item:hover {
	background: #f0f2f5;
	transform: translateX(2px);
}

.todo-content {
	flex: 1;
	font-size: 13px;
	line-height: 1.4;
	color: var(--color-text, #525f7f);
	word-break: break-word;
}

.todo-complete-btn,
.todo-urge-btn {
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	flex-shrink: 0;
	margin-left: 8px;
	font-size: 11px;
}

.todo-complete-btn {
	background: #d4edda;
	color: #28a745;
}

.todo-complete-btn:hover {
	background: #28a745;
	color: #fff;
	transform: scale(1.1);
}

.todo-urge-btn {
	background: rgba(var(--themecolor-rgbstr), 0.15);
	color: var(--themecolor);
}

.todo-urge-btn:hover {
	background: var(--themecolor);
	color: #fff;
	transform: scale(1.1);
}

.todo-urge-btn.urged {
	background: #28a745;
	color: #fff;
	animation: urgeSuccess 0.5s ease;
}

.todo-urge-btn.urged i::before {
	content: "\f00c";
}

@keyframes urgeSuccess {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.2);
	}
}

.todo-urge-btn:disabled,
.todo-complete-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
	transform: none;
}

.todo-item.todo-completing {
	opacity: 0;
	transform: translateX(30px) scale(0.9);
	max-height: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.todo-item.todo-completed .todo-content {
	text-decoration: line-through;
	color: #adb5bd;
}

.todo-item.todo-completed {
	opacity: 0.7;
	order: 1;
	max-height: 500px;
	overflow: hidden;
	transition: all var(--animation-normal) var(--ease-emphasized),
		max-height var(--animation-normal) var(--ease-emphasized),
		margin var(--animation-normal) var(--ease-emphasized),
		padding var(--animation-normal) var(--ease-emphasized),
		opacity var(--animation-normal) var(--ease-emphasized);
}

.todo-item.todo-completed.collapsed {
	max-height: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	opacity: 0;
	transform: translateY(-10px);
}

.todo-item.todo-completed:hover {
	opacity: 0.85;
}

/* 已完成任务的完成标记（访客端�?*/
.todo-item.todo-completed .todo-done-mark {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #d4edda;
	color: #28a745;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	margin-left: 8px;
	flex-shrink: 0;
}

.todo-delete-btn {
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	flex-shrink: 0;
	background: #f8d7da;
	color: #dc3545;
	margin-left: 8px;
	font-size: 11px;
}

.todo-delete-btn:hover {
	background: #dc3545;
	color: #fff;
	transform: scale(1.1);
}

.todo-empty {
	text-align: center;
	color: #adb5bd;
	font-size: 12px;
	padding: 20px 0;
}

.todo-empty::before {
	content: "\f0ae";
	font-family: FontAwesome;
	display: block;
	font-size: 24px;
	margin-bottom: 8px;
	opacity: 0.5;
}

.todo-captcha-container {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px dashed #e9ecef;
}

.todo-captcha-container .input-group {
	max-width: 250px;
}

.todo-captcha-text {
	font-family: monospace;
	font-weight: bold;
	background: #f8f9fa;
	cursor: default;
}

#todo-captcha-submit {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

/* 深色模式 */
html.darkmode .todo-item {
	background: var(--color-foreground, #2d3748);
}

html.darkmode .todo-item:hover {
	background: #3d4758;
}

html.darkmode .todo-add-form input {
	background: var(--color-foreground, #2d3748);
	border-color: #4a5568;
	color: #e2e8f0;
}

html.darkmode .todo-add-form input:focus {
	border-color: var(--themecolor);
}

/* ===== 多邻国连�?===== */
.duolingo-streak {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 14px;
	font-weight: 700;
	color: #FF9600;
	margin-left: 6px;
	vertical-align: middle;
	animation: duolingoFadeIn 0.5s var(--ease-emphasized-decelerate) both;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.duolingo-streak.not-done {
	color: #999;
	text-shadow: none;
}

.duolingo-flame {
	width: 14px;
	height: 17px;
	animation: duolingoFlameGlow 2s ease-in-out infinite;
}

.duolingo-streak.not-done .duolingo-flame {
	animation: none;
	opacity: 0.6;
}

/* 多邻国火焰动�?*/
@keyframes duolingoFlameGlow {

	0%,
	100% {
		filter: drop-shadow(0 0 2px rgba(255, 150, 0, 0.4));
		transform: scale(1);
	}

	50% {
		filter: drop-shadow(0 0 6px rgba(255, 150, 0, 0.8));
		transform: scale(1.05);
	}
}

@keyframes duolingoFadeIn {
	from {
		opacity: 0;
		transform: translateX(-5px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* 移动端多邻国连胜样式优化 */
.leftbar-mobile-user-name .duolingo-streak {
	font-size: 15px;
	margin-left: 8px;
	padding: 3px 10px 3px 6px;
	background: rgba(0, 0, 0, 0.25);
	border-radius: 14px;
	gap: 4px;
	color: #fff;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);

	-webkit-backdrop-filter: blur(4px);

	backdrop-filter: blur(4px);
}

.leftbar-mobile-user-name .duolingo-streak.not-done {
	background: rgba(0, 0, 0, 0.2);
	color: rgba(255, 255, 255, 0.7);
	text-shadow: none;
}

.leftbar-mobile-user-name .duolingo-flame {
	width: 16px;
	height: 19px;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
}


/* ===== 禁止选中（文章内容除外） ===== */
body {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#post_content,
.post-content,
.comment-content,
.card-body p,
textarea,
input {
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
}

/* ===== 禁止图片拖动（文章内容除外） ===== */
img {
	-webkit-user-drag: none;
	pointer-events: auto;
}

#post_content img,
.post-content img {
	-webkit-user-drag: auto;
}

/* ===== 修复评论框溢�?===== */
#post_comment.card {
	overflow: visible;
}

#post_comment .card-body {
	overflow: visible;
}

#post_comment .post-comment-title {
	overflow: hidden;
}


/* ===== 友情链接 ===== */
.friend-links-container {
	margin-top: 20px;
}

.friend-links-category {
	color: var(--themecolor);
	font-size: 18px;
	font-weight: 600;
	margin: 25px 0 15px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--themecolor);
}

.friend-links-category:first-child {
	margin-top: 0;
}

.friend-links-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 15px;
}

.friend-link-card {
	display: flex;
	align-items: center;
	padding: 15px;
	background: var(--card-bg);
	border-radius: var(--card-radius);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	text-decoration: none;
	color: inherit;
	transition: all 0.3s ease;
}

.friend-link-card:hover {
	text-decoration: none;
	color: inherit;
}

.friend-link-avatar {
	flex-shrink: 0;
	width: 50px;
	height: 50px;
	margin-right: 12px;
}

.friend-link-avatar img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.friend-link-avatar-placeholder {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--themecolor), #8e99e4);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: bold;
}

.friend-link-info {
	flex: 1;
	min-width: 0;
}

.friend-link-name {
	font-size: 15px;
	font-weight: 600;
	color: var(--font-color);
	margin-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.friend-link-desc {
	font-size: 12px;
	color: #999;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* 暗色模式适配 */
html.darkmode .friend-link-card {
	background: var(--card-bg);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

html.darkmode .friend-link-name {
	color: var(--font-color);
}

@media (max-width: 768px) {
	.friend-links-grid {
		grid-template-columns: 1fr;
	}
}


/* ========== 友情链接页面样式 ========== */

/* 页面头部 */
.argon-fl-header {
	margin-bottom: 20px;
}

.argon-fl-page-title {
	font-size: 28px;
	margin: 0 0 10px;
	color: var(--themecolor);
}

.argon-fl-page-title i {
	margin-right: 10px;
}

.argon-fl-page-desc {
	color: var(--color-text-secondary);
	margin-bottom: 15px;
}

.argon-fl-page-desc p:last-child {
	margin-bottom: 0;
}

.argon-fl-stats {
	display: flex;
	gap: 20px;
	font-size: 14px;
	color: var(--color-text-secondary);
}

.argon-fl-stats i {
	margin-right: 5px;
	color: var(--themecolor);
}

/* 分类卡片 */
.argon-fl-category-card {
	margin-bottom: 20px;
}

.argon-fl-category-title {
	font-size: 18px;
	margin: 0 0 20px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--themecolor);
	color: var(--color-text);
	display: flex;
	align-items: center;
}

.argon-fl-category-title i {
	margin-right: 10px;
	color: var(--themecolor);
}

.argon-fl-category-count {
	margin-left: auto;
	background: var(--themecolor);
	color: #fff;
	font-size: 12px;
	padding: 2px 10px;
	border-radius: 20px;
	font-weight: normal;
}

/* 友链网格 */
.argon-fl-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 15px;
}

@media (max-width: 768px) {
	.argon-fl-grid {
		grid-template-columns: 1fr;
	}
}

/* 友链项目 */
.argon-fl-item {
	display: flex;
	align-items: center;
	padding: 15px;
	background: var(--color-background);
	border-radius: var(--card-radius);
	text-decoration: none !important;
	transition: all 0.3s ease;
	border: 1px solid transparent;
}

.argon-fl-item:hover {
	background: var(--color-foreground);
	border-color: var(--themecolor);
	transform: translateX(5px);
	box-shadow: 0 4px 15px rgba(94, 114, 228, 0.15);
}

.argon-fl-item:before {
	display: none;
}

/* 头像 */
.argon-fl-avatar {
	width: 50px;
	height: 50px;
	flex-shrink: 0;
	margin-right: 15px;
	position: relative;
}

.argon-fl-avatar img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--color-border);
}

.argon-fl-avatar-text {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--themecolor), var(--themecolor-light));
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: bold;
}

/* 内容 */
.argon-fl-content {
	flex: 1;
	min-width: 0;
}

.argon-fl-name {
	font-size: 16px;
	font-weight: 600;
	color: var(--color-text);
	margin-bottom: 4px;
	display: flex;
	align-items: center;
}

.argon-fl-verified-icon {
	color: #28a745;
	font-size: 14px;
	margin-left: 6px;
}

.argon-fl-desc {
	font-size: 13px;
	color: var(--color-text-secondary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* 箭头 */
.argon-fl-arrow {
	color: var(--color-text-secondary);
	opacity: 0;
	transform: translateX(-10px);
	transition: all 0.3s ease;
}

.argon-fl-item:hover .argon-fl-arrow {
	opacity: 1;
	transform: translateX(0);
}

/* 空状�?*/
.argon-fl-empty {
	text-align: center;
	padding: 60px 20px;
	color: var(--color-text-secondary);
}

.argon-fl-empty i {
	font-size: 64px;
	margin-bottom: 20px;
	opacity: 0.3;
	color: var(--themecolor);
}

.argon-fl-empty p {
	margin: 0;
	font-size: 18px;
}

.argon-fl-empty-hint {
	font-size: 14px !important;
	margin-top: 10px !important;
	opacity: 0.7;
}

/* 申请卡片 */
.argon-fl-apply-card {
	margin-top: 10px;
}

.argon-fl-apply-title {
	font-size: 20px;
	margin: 0 0 20px;
	color: var(--themecolor);
}

.argon-fl-apply-title i {
	margin-right: 10px;
}

/* 申请结果 */
.argon-fl-result {
	padding: 15px 20px;
	border-radius: var(--card-radius);
	margin-bottom: 20px;
	display: flex;
	align-items: center;
}

.argon-fl-result i {
	margin-right: 10px;
	font-size: 18px;
}

.argon-fl-result.success {
	background: linear-gradient(135deg, rgba(40, 167, 69, 0.1), rgba(40, 167, 69, 0.05));
	color: #28a745;
	border: 1px solid rgba(40, 167, 69, 0.3);
}

.argon-fl-result.error {
	background: linear-gradient(135deg, rgba(220, 53, 69, 0.1), rgba(220, 53, 69, 0.05));
	color: #dc3545;
	border: 1px solid rgba(220, 53, 69, 0.3);
}

/* 申请要求 */
.argon-fl-requirements {
	background: var(--color-background);
	padding: 20px;
	border-radius: var(--card-radius);
	margin-bottom: 25px;
	font-size: 14px;
	line-height: 1.8;
}

.argon-fl-requirements p:last-child {
	margin-bottom: 0;
}

.argon-fl-requirements ul {
	margin: 10px 0 0;
	padding-left: 20px;
}

/* 表单 */
.argon-fl-form {
	margin-top: 20px;
}

.argon-fl-form-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

@media (max-width: 768px) {
	.argon-fl-form-grid {
		grid-template-columns: 1fr;
	}
}

.argon-fl-field {
	margin-bottom: 20px;
}

.argon-fl-field label {
	display: block;
	margin-bottom: 8px;
	font-weight: 500;
	font-size: 14px;
	color: var(--color-text);
}

.argon-fl-field label .required {
	color: #dc3545;
	margin-left: 2px;
}

.argon-fl-field input,
.argon-fl-field textarea {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--color-border);
	border-radius: var(--card-radius);
	font-size: 14px;
	background: var(--color-background);
	color: var(--color-text);
	transition: all 0.2s ease;
}

.argon-fl-field input:focus,
.argon-fl-field textarea:focus {
	outline: none;
	border-color: var(--themecolor);
	box-shadow: 0 0 0 3px rgba(94, 114, 228, 0.15);
	background: var(--color-foreground);
}

.argon-fl-field textarea {
	resize: vertical;
	min-height: 100px;
}

.argon-fl-submit {
	text-align: center;
	padding-top: 10px;
}

.argon-fl-submit button {
	padding: 14px 50px;
	font-size: 16px;
}

.argon-fl-submit button i {
	margin-right: 10px;
}

/* 夜间模式 */
html.darkmode .argon-fl-item:hover {
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* ========================================
   顶栏增强样式 - Toolbar Enhancement
   ======================================== */

/* 顶栏基础增强 - 柔和毛玻璃效�?*/
#navbar-main {
	-webkit-backdrop-filter: blur(12px) saturate(120%);
	backdrop-filter: blur(12px) saturate(120%);
	border-bottom: none;
	box-shadow: none;
}

/* 顶栏底部柔和过渡伪元�?*/
#navbar-main::after {
	content: '';
	position: absolute;
	bottom: -20px;
	left: 0;
	right: 0;
	height: 20px;
	background: linear-gradient(to bottom,
			rgba(var(--themecolor-rgbstr), 0.15) 0%,
			rgba(var(--themecolor-rgbstr), 0.05) 40%,
			transparent 100%);
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.3s ease;
}

/* 滚动后显示底部渐�?*/
#navbar-main:not(.navbar-ontop)::after {
	opacity: 1;
}

/* 顶栏在顶部时的透明状�?*/
html.navbar-absolute:not(.no-banner) #navbar-main.navbar-ontop {
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0.2) 0%,
			rgba(0, 0, 0, 0.1) 50%,
			transparent 100%) !important;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

/* 顶栏渐变背景模式 */
html.toolbar-gradient #navbar-main {
	background: linear-gradient(135deg,
			rgba(var(--themecolor-rgbstr), 0.88) 0%,
			rgba(var(--themecolor-rgbstr), 0.82) 100%) !important;
}

/* 顶栏玻璃态模�?*/
html.toolbar-glass #navbar-main {
	background: rgba(255, 255, 255, 0.12) !important;
	-webkit-backdrop-filter: blur(20px) saturate(180%);
	backdrop-filter: blur(20px) saturate(180%);
	border-bottom: none;
}

html.toolbar-glass.darkmode #navbar-main {
	background: rgba(0, 0, 0, 0.25) !important;
}

/* 顶栏阴影增强 - 更柔�?*/
html.toolbar-shadow #navbar-main {
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
}

html.toolbar-shadow.darkmode #navbar-main {
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.25);
}

/* 顶栏底部边框 - 更柔�?*/
html.toolbar-border #navbar-main {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

html.toolbar-border.darkmode #navbar-main {
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* 顶栏标题样式增强 */
.navbar-brand.navbar-title {
	font-weight: 600;
	letter-spacing: 0.5px;
	transition: all 0.3s ease;
}

.navbar-brand.navbar-title:hover {
	transform: scale(1.02);
}

/* 顶栏图标增强 */
.navbar-brand.navbar-icon img {
	transition: all 0.3s ease;
	border-radius: 6px;
}

.navbar-brand.navbar-icon:hover img {
	transform: scale(1.08);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

/* 顶栏菜单项增�?*/
.navbar-nav .nav-link {
	position: relative;
	transition: all 0.25s ease;
}

.navbar-nav .nav-link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: rgba(255, 255, 255, 0.8);
	transition: all 0.3s ease;
	transform: translateX(-50%);
	border-radius: 1px;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
	width: 60%;
}

/* 顶栏下拉菜单增强 */
.navbar-nav .dropdown-menu {
	border: none;
	border-radius: var(--card-radius);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
	padding: 8px 0;
	animation: dropdownFadeIn 0.2s ease;
}

@keyframes dropdownFadeIn {
	from {
		opacity: 0;
		transform: translateY(-8px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.navbar-nav .dropdown-item {
	padding: 10px 20px;
	font-size: 14px;
	transition: all 0.2s ease;
	border-radius: 0;
}

.navbar-nav .dropdown-item:hover {
	background: rgba(var(--themecolor-rgbstr), 0.08);
	color: var(--themecolor);
	padding-left: 24px;
}

/* 顶栏搜索框增�?*/
#navbar_search_input_container .input-group {
	border-radius: 25px;
}

#navbar_search_input_container.open .input-group {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* 顶栏紧凑模式 */
html.toolbar-compact #navbar-main {
	padding-top: 0.35rem !important;
	padding-bottom: 0.35rem !important;
}

html.toolbar-compact #navbar-main.navbar-ontop {
	padding-top: 0.6rem !important;
	padding-bottom: 0.6rem !important;
}

/* 顶栏居中模式 */
html.toolbar-center .navbar-brand.mr-0 {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

html.toolbar-center .navbar-nav.navbar-nav-hover {
	margin-left: auto;
}

@media (max-width: 991px) {
	html.toolbar-center .navbar-brand.mr-0 {
		position: relative;
		left: auto;
		transform: none;
	}
}

/* 移动端顶栏优�?*/
@media (max-width: 991px) {
	#navbar-main {
		padding-left: 8px;
		padding-right: 8px;
	}

	.navbar-brand.navbar-title {
		font-size: 16px;
	}

	.navbar-brand.navbar-icon img {
		max-height: 32px;
	}
}


/* ========================================
   Material 3 Design System Enhancement
   ======================================== */

/* M3 设计令牌 */
:root {
	/* 表面层级 */
	--m3-surface-1: rgba(var(--themecolor-rgbstr), 0.05);
	--m3-surface-2: rgba(var(--themecolor-rgbstr), 0.08);
	--m3-surface-3: rgba(var(--themecolor-rgbstr), 0.11);
	--m3-surface-4: rgba(var(--themecolor-rgbstr), 0.12);
	--m3-surface-5: rgba(var(--themecolor-rgbstr), 0.14);

	/* 状态层 */
	--m3-state-hover: rgba(var(--themecolor-rgbstr), 0.08);
	--m3-state-focus: rgba(var(--themecolor-rgbstr), 0.12);
	--m3-state-pressed: rgba(var(--themecolor-rgbstr), 0.12);
	--m3-state-dragged: rgba(var(--themecolor-rgbstr), 0.16);

	/* 圆角 */
	--m3-shape-xs: 4px;
	--m3-shape-sm: 8px;
	--m3-shape-md: 12px;
	--m3-shape-lg: 16px;
	--m3-shape-xl: 28px;

	/* 阴影 */
	--m3-elevation-1: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
	--m3-elevation-2: 0 1px 2px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.1);
	--m3-elevation-3: 0 1px 3px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.12);
	--m3-elevation-4: 0 2px 3px rgba(0, 0, 0, 0.1), 0 6px 10px rgba(0, 0, 0, 0.14);
	--m3-elevation-5: 0 4px 4px rgba(0, 0, 0, 0.1), 0 8px 12px rgba(0, 0, 0, 0.16);

	/* 过渡 */
	--m3-motion-standard: cubic-bezier(0.2, 0, 0, 1);
	--m3-motion-emphasized: cubic-bezier(0.2, 0, 0, 1);
	--m3-motion-duration-short: 150ms;
	--m3-motion-duration-medium: 250ms;
	--m3-motion-duration-long: 400ms;
}

html.darkmode {
	--m3-surface-1: rgba(255, 255, 255, 0.05);
	--m3-surface-2: rgba(255, 255, 255, 0.08);
	--m3-surface-3: rgba(255, 255, 255, 0.11);
	--m3-surface-4: rgba(255, 255, 255, 0.12);
	--m3-surface-5: rgba(255, 255, 255, 0.14);
	--m3-state-hover: rgba(255, 255, 255, 0.08);
	--m3-state-focus: rgba(255, 255, 255, 0.12);
	--m3-state-pressed: rgba(255, 255, 255, 0.12);
}

/* M3 卡片样式 */
.card {
	border-radius: var(--m3-shape-lg) !important;
	transition: box-shadow var(--m3-motion-duration-medium) var(--m3-motion-standard),
		transform var(--m3-motion-duration-medium) var(--m3-motion-standard);
}

.card.shadow-sm {
	box-shadow: var(--m3-elevation-1) !important;
}

/* M3 文章卡片 */
article.post.card {
	overflow: visible;
	border: none !important;
}

/* M3 按钮样式 */
.btn {
	border-radius: var(--m3-shape-xl) !important;
	font-weight: 500;
	letter-spacing: 0.1px;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
	position: relative;
	overflow: hidden;
}

.btn::before {
	content: '';
	position: absolute;
	inset: 0;
	background: currentColor;
	opacity: 0;
	transition: opacity var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.btn:hover::before {
	opacity: 0.08;
}

.btn:active::before {
	opacity: 0.12;
}

.btn-primary {
	box-shadow: var(--m3-elevation-1);
}

.btn-primary:hover {
	box-shadow: var(--m3-elevation-2);
	transform: translateY(-1px);
}

/* M3 输入框样�?*/
.form-control {
	border-radius: var(--m3-shape-sm) !important;
	border: 1px solid var(--color-border);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
	padding: 12px 16px;
}

.form-control:focus {
	border-color: var(--themecolor);
	box-shadow: 0 0 0 2px rgba(var(--themecolor-rgbstr), 0.2);
	outline: none;
}

/* M3 侧边栏样�?*/
#leftbar .card {
	border-radius: var(--m3-shape-lg) !important;
	overflow: hidden;
}

#leftbar_part1 {
	border-radius: var(--m3-shape-lg) !important;
}

#leftbar_part2 {
	border-radius: var(--m3-shape-lg) !important;
}

/* M3 侧边栏菜�?*/
.leftbar-menu-item>a {
	border-radius: var(--m3-shape-xl);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
	margin: 2px 8px;
	padding: 10px 16px !important;
}

.leftbar-menu-item>a:hover {
	background: var(--m3-state-hover);
}

.leftbar-menu-item.current>a {
	background: var(--m3-surface-3);
	color: var(--themecolor);
	font-weight: 500;
}

/* M3 搜索按钮 */
#leftbar_search_container {
	border-radius: var(--m3-shape-xl) !important;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

#leftbar_search_container:hover {
	background: var(--m3-state-hover) !important;
}

/* M3 标签�?*/
.nav-pills .nav-link {
	border-radius: var(--m3-shape-xl);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
	font-weight: 500;
}

.nav-pills .nav-link.active {
	background: var(--themecolor);
	box-shadow: var(--m3-elevation-1);
}

/* M3 站点统计 */
.site-state {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin: 16px 0;
}

.site-state-item {
	flex: 1;
	text-align: center;
}

.site-state-item a {
	display: block;
	padding: 12px 8px;
	border-radius: var(--m3-shape-md);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.site-state-item a:hover {
	background: var(--m3-state-hover);
}

.site-state-item-count {
	display: block;
	font-size: 20px;
	font-weight: 600;
	color: var(--themecolor);
	line-height: 1.2;
}

.site-state-item-name {
	display: block;
	font-size: 12px;
	color: #888;
	margin-top: 2px;
}

/* M3 作者链�?*/
.site-author-links {
	display: flex;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
	margin: 12px 0;
}

.site-author-links-item a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: var(--m3-shape-xl);
	background: var(--m3-surface-2);
	color: var(--themecolor);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.site-author-links-item a:hover {
	background: var(--themecolor);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--m3-elevation-2);
}

/* M3 文章列表 */
.article-list article.post {
	margin-bottom: 16px;
}

/* M3 文章预览卡片 */
.post-preview-container {
	border-radius: var(--m3-shape-lg);
	overflow: hidden;
}

/* M3 文章标题 */
.post-title a {
	transition: color var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.post-title a:hover {
	color: var(--themecolor);
}

/* M3 标签样式 */
.badge,
.tag {
	border-radius: var(--m3-shape-sm) !important;
	padding: 4px 10px;
	font-weight: 500;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.badge:hover,
.tag:hover {
	transform: translateY(-1px);
	box-shadow: var(--m3-elevation-1);
}

/* M3 分页 */
.page-link {
	border-radius: var(--m3-shape-sm) !important;
	margin: 0 2px;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.page-item.active .page-link {
	box-shadow: var(--m3-elevation-1);
}

/* M3 评论�?*/
#comments.card,
#post_comment.card {
	border-radius: var(--m3-shape-lg) !important;
}

.comment-item {
	border-radius: var(--m3-shape-md);
	transition: background var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.comment-item:hover {
	background: var(--m3-surface-1);
}

/* M3 评论头像 */
.comment-avatar img {
	border-radius: var(--m3-shape-xl) !important;
	transition: transform var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.comment-avatar img:hover {
	transform: scale(1.05);
}

/* M3 浮动按钮 */
.float-action-buttons .fabtn {
	border-radius: var(--card-radius) !important;
	box-shadow: var(--m3-elevation-2) !important;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.float-action-buttons .fabtn:hover {
	box-shadow: var(--m3-elevation-3) !important;
}

/* M3 模态框 */
.modal-content {
	border-radius: var(--m3-shape-xl) !important;
	border: none;
	box-shadow: var(--m3-elevation-5);
	overflow: hidden;
}

.modal-header {
	border-bottom: 1px solid var(--color-border-on-foreground);
	padding: 20px 24px;
}

.modal-body {
	padding: 24px;
}

/* M3 下拉菜单 */
.dropdown-menu {
	border-radius: var(--m3-shape-md) !important;
	border: none;
	box-shadow: var(--m3-elevation-3);
	padding: 8px 0;
	animation: m3-dropdown-in var(--m3-motion-duration-medium) var(--m3-motion-emphasized);
}

@keyframes m3-dropdown-in {
	from {
		opacity: 0;
		transform: scaleY(0.9) translateY(-8px);
		transform-origin: top center;
	}

	to {
		opacity: 1;
		transform: scaleY(1) translateY(0);
	}
}

.dropdown-item {
	padding: 10px 16px;
	border-radius: 0;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.dropdown-item:hover {
	background: var(--m3-state-hover);
}

/* M3 Alert 样式 */
.alert {
	border-radius: var(--m3-shape-md) !important;
	border: none;
	padding: 16px 20px;
}

/* M3 TODO 列表 */
.todo-list {
	border-radius: var(--m3-shape-md);
}

.todo-item {
	border-radius: var(--m3-shape-sm);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.todo-item:hover {
	background: var(--m3-state-hover);
}

/* M3 公告卡片 */
#leftbar_announcement {
	border-radius: var(--m3-shape-lg) !important;
	overflow: hidden;
}

/* M3 文章导航 */
.post-navigation {
	border-radius: var(--m3-shape-lg) !important;
	overflow: hidden;
}

.post-navigation-item {
	transition: background var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.post-navigation-item:hover {
	background: var(--m3-surface-1);
}

/* M3 相关文章 */
.related-posts {
	border-radius: var(--m3-shape-lg) !important;
}

.related-post-card {
	border-radius: var(--m3-shape-md);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

/* M3 代码�?*/
article pre:not(.hljs-codeblock) {
	border-radius: var(--m3-shape-md) !important;
}

.hljs-codeblock {
	border-radius: var(--m3-shape-md) !important;
	overflow: hidden;
}

/* M3 引用�?*/
article .post-content blockquote {
	border-radius: 0 var(--m3-shape-sm) var(--m3-shape-sm) 0;
	background: var(--m3-surface-1);
	padding: 16px 20px;
	border-left: 4px solid var(--themecolor);
}

/* M3 图片 */
article img {
	border-radius: var(--m3-shape-sm);
}

.wp-block-image img {
	border-radius: var(--m3-shape-md);
}

/* M3 表格 */
article table {
	border-radius: var(--m3-shape-md);
	overflow: hidden;
}

article table>thead>tr>th {
	background: var(--m3-surface-2);
}

/* M3 滚动�?*/
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background: rgba(var(--themecolor-rgbstr), 0.3);
	border-radius: var(--m3-shape-xl);
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(var(--themecolor-rgbstr), 0.5);
}

/* M3 选中文本 */
::selection {
	background: rgba(var(--themecolor-rgbstr), 0.2);
}

/* M3 链接悬停效果 */
article .post-content a {
	color: var(--themecolor);
	text-decoration: none;
	background: linear-gradient(to right, var(--themecolor), var(--themecolor)) no-repeat right bottom;
	background-size: 0 2px;
	transition: background-size var(--m3-motion-duration-medium) var(--m3-motion-standard);
}

article .post-content a:hover {
	background-size: 100% 2px;
	background-position: left bottom;
}

/* M3 页面过渡动画 */
@keyframes m3-page-in {
	from {
		opacity: 0;
		transform: translateY(16px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

#primary {
	animation: m3-page-in var(--m3-motion-duration-long) var(--m3-motion-emphasized);
}

/* M3 卡片进入动画 - 使用原有动画 */

/* M3 Chip/标签样式 */
.post-meta .badge,
.post-categories a,
.post-tags a {
	background: var(--m3-surface-2);
	color: var(--color-text-deeper);
	border: none;
	padding: 6px 12px;
	border-radius: var(--m3-shape-sm);
	font-size: 12px;
	font-weight: 500;
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

.post-meta .badge:hover,
.post-categories a:hover,
.post-tags a:hover {
	background: var(--themecolor);
	color: #fff;
}

/* M3 头像�?*/
#leftbar_overview_author_image {
	border: 3px solid var(--m3-surface-3);
	transition: all var(--m3-motion-duration-short) var(--m3-motion-standard);
}

#leftbar_overview_author_image:hover {
	border-color: var(--themecolor);
	transform: scale(1.05);
}

/* M3 响应式优�?*/
@media (max-width: 768px) {
	:root {
		--m3-shape-lg: 12px;
		--m3-shape-xl: 20px;
	}

	.card {
		border-radius: var(--m3-shape-md) !important;
	}

	.btn {
		border-radius: var(--m3-shape-lg) !important;
	}
}

/* ---------- 评论区响应式优化 ---------- */
@media (max-width: 768px) {
	.comment-item-left-wrapper {
		width: 36px;
		margin-right: 12px;
		min-height: 70px;
	}

	.comment-item-avatar .avatar {
		height: 36px;
		width: 36px;
	}

	.comment-upvote {
		height: 28px;
		line-height: 26px;
		padding: 0 8px;
		min-width: 36px;
		font-size: 12px;
		top: 42px;
	}

	.comment-item-inner {
		width: calc(100% - 48px);
		padding-bottom: 36px;
	}

	.comment-item-title {
		font-size: 14px;
	}

	.comment-operations {
		position: relative;
		right: auto;
		bottom: auto;
		opacity: 1;
		transform: none;
		margin-top: 8px;
		padding: 0;
		background: transparent;
		box-shadow: none;
		justify-content: flex-start;
	}

	.comment-useragent {
		display: none;
	}

	.comment-info {
		gap: 6px;
	}
}

/* ========== 精确修复 ========== */

/* 1. 搜索按钮动画优化 - 毛玻璃效果和左移滑入动画 */
#navbar_search_input_container .input-group {
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: hidden;
}

#navbar_search_input_container:not(.open) input.form-control {
	width: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	opacity: 0;
	transform: translateX(30px);
	transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1),
		padding 0.35s cubic-bezier(0.4, 0, 0.2, 1),
		opacity 0.25s ease 0.1s,
		transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

#navbar_search_input_container.open input.form-control {
	opacity: 1;
	transform: translateX(0);
	transition: width 0.4s cubic-bezier(0.16, 1, 0.3, 1),
		padding 0.4s cubic-bezier(0.16, 1, 0.3, 1),
		opacity 0.3s ease,
		transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* 搜索框展开时默认毛玻璃状�?*/
#navbar_search_input_container.open .input-group {
	background: rgba(255, 255, 255, 0.15) !important;
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}

#navbar_search_input_container.open .input-group .input-group-text {
	color: rgba(255, 255, 255, 0.9);
}

#navbar_search_input_container.open .input-group input.form-control {
	color: rgba(255, 255, 255, 0.95);
}

#navbar_search_input_container.open .input-group input.form-control::placeholder {
	color: rgba(255, 255, 255, 0.6);
}

/* hover或有内容时切换为白色背景 */
#navbar_search_input_container.open .input-group:hover,
#navbar_search_input_container.open .input-group:focus-within,
#navbar_search_input_container.open.has-text .input-group {
	background: rgba(255, 255, 255, 0.95) !important;
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}

#navbar_search_input_container.open .input-group:hover .input-group-text,
#navbar_search_input_container.open .input-group:focus-within .input-group-text,
#navbar_search_input_container.open.has-text .input-group .input-group-text {
	color: #666;
}

#navbar_search_input_container.open .input-group:hover input.form-control,
#navbar_search_input_container.open .input-group:focus-within input.form-control,
#navbar_search_input_container.open.has-text .input-group input.form-control {
	color: #333;
}

#navbar_search_input_container.open .input-group:hover input.form-control::placeholder,
#navbar_search_input_container.open .input-group:focus-within input.form-control::placeholder,
#navbar_search_input_container.open.has-text .input-group input.form-control::placeholder {
	color: #999;
}

/* 2. 移动端侧边栏按钮修复 */
@media screen and (max-width: 900px) {
	#open_sidebar {
		-webkit-tap-highlight-color: transparent;
		touch-action: manipulation;
		cursor: pointer;
		z-index: 1000;
	}

	#open_sidebar .navbar-toggler-icon {
		pointer-events: none;
	}

	html.leftbar-opened #leftbar {
		transform: translateX(0) !important;
		opacity: 1 !important;
		visibility: visible !important;
	}
}

/* 3. Git 徽章样式 */
.git-version-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: 8px;
	padding: 2px 8px;
	background: rgba(0, 0, 0, 0.15);
	border-radius: 10px;
	font-size: 11px;
	font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
	color: inherit;
	opacity: 0.7;
	transition: opacity 0.2s ease;
	vertical-align: middle;
	cursor: pointer;
	user-select: none;
}

.git-version-badge:hover {
	opacity: 1;
}

.git-version-badge .git-icon {
	width: 11px;
	height: 11px;
	color: #f05033;
	flex-shrink: 0;
}

/* 移动端隐藏Git徽章 */
@media screen and (max-width: 576px) {
	.git-version-badge {
		display: none;
	}

	.git-version-badge .git-icon {
		width: 11px;
		height: 11px;
	}
}

/* 4. Topbar 自定义链接样�?*/
.navbar-custom-links {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-left: 10px;
}

.navbar-custom-links a {
	color: rgba(255, 255, 255, 0.9);
	font-size: 13px;
	padding: 5px 12px;
	border-radius: 18px;
	transition: all 0.25s ease;
	text-decoration: none;
	white-space: nowrap;
}

.navbar-custom-links a:hover {
	background: rgba(255, 255, 255, 0.18);
	color: #fff;
}

.navbar-custom-links a i {
	margin-right: 5px;
}

@media screen and (max-width: 992px) {
	.navbar-custom-links {
		display: none;
	}
}

/* 6. 防止按钮文字换行 */
.btn {
	white-space: nowrap;
}

.btn-inner--text {
	white-space: nowrap;
}

.nav-link {
	white-space: nowrap;
}

.navbar-nav .nav-item {
	white-space: nowrap;
}

/* 标签和徽章防止换�?*/
.badge,
.tag,
.post-categories a,
.post-tags a {
	white-space: nowrap;
}

/* ========================================
   全局视觉优化 - 保持原有风格融入 M3
   ======================================== */

/* 全局平滑滚动�?JS 库处理，此处不设�?*/

/* 页面背景微妙纹理 */
body {
	background-image:
		radial-gradient(circle at 20% 80%, rgba(var(--themecolor-rgbstr), 0.03) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(var(--themecolor-rgbstr), 0.02) 0%, transparent 40%);
	background-attachment: fixed;
}

html.darkmode body {
	background-image:
		radial-gradient(circle at 20% 80%, rgba(var(--themecolor-rgbstr), 0.05) 0%, transparent 50%),
		radial-gradient(circle at 80% 20%, rgba(var(--themecolor-rgbstr), 0.03) 0%, transparent 40%);
}

/* 卡片悬浮效果增强 */
.card {
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.06);
	background-color: var(--color-foreground);
}

html.darkmode .card {
	border: 1px solid rgba(255, 255, 255, 0.05);
	background-color: var(--color-foreground);
}

/* 文章卡片优化 */
article.post.card {
	border: none;
	box-shadow:
		0 1px 3px rgba(0, 0, 0, 0.04),
		0 4px 12px rgba(0, 0, 0, 0.03);
}

article.post.card:hover {
	box-shadow:
		0 4px 12px rgba(0, 0, 0, 0.06),
		0 12px 28px rgba(var(--themecolor-rgbstr), 0.08);
}

/* 文章导航卡片透明�?*/
.post-navigation.card {
	background: var(--color-foreground);
}

/* 相关文章卡片透明�?*/
.related-posts.card {
	background: var(--color-foreground);
}

/* 文章标题优化 */
.post-title a {
	background: linear-gradient(to right, var(--themecolor), var(--themecolor-light));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	transition: all 0.3s ease;
}

.post-title a:hover {
	filter: brightness(1.1);
}

/* 文章预览卡片缩略图优�?*/
.post-thumbnail {
	transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

article.post.card:hover .post-thumbnail {
	transform: none;
}

/* 侧边栏卡片优�?*/
#leftbar .card,
#leftbar_part1,
#leftbar_part2 {
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.05);
}

html.darkmode #leftbar .card,
html.darkmode #leftbar_part1,
html.darkmode #leftbar_part2 {
	border: 1px solid rgba(255, 255, 255, 0.04);
}

/* 侧边栏头像光晕效�?*/
#leftbar_overview_author_image {
	box-shadow:
		0 0 0 3px rgba(var(--themecolor-rgbstr), 0.1),
		0 4px 16px rgba(var(--themecolor-rgbstr), 0.15);
}

#leftbar_overview_author_image:hover {
	box-shadow:
		0 0 0 4px rgba(var(--themecolor-rgbstr), 0.2),
		0 8px 24px rgba(var(--themecolor-rgbstr), 0.25);
}

/* 按钮优化 - 纯色主题�?+ Material 3 动画 */
.btn-primary {
	background-color: var(--themecolor);
	border: none;
	border-radius: var(--card-radius);
	box-shadow: 0 1px 3px rgba(var(--themecolor-rgbstr), 0.2);
	transition:
		background-color var(--animation-fast) var(--ease-standard),
		box-shadow var(--animation-fast) var(--ease-standard),
		transform var(--animation-fast) var(--ease-standard);
	position: relative;
	overflow: hidden;
}

.btn-primary:hover {
	background-color: var(--themecolor-dark);
	box-shadow: 0 4px 12px rgba(var(--themecolor-rgbstr), 0.35);
	transform: translateY(-1px);
}

.btn-primary:active {
	background-color: var(--themecolor-dark2);
	transform: scale(0.98);
	box-shadow: 0 1px 2px rgba(var(--themecolor-rgbstr), 0.2);
}

.btn-outline-primary {
	border: 1.5px solid var(--themecolor);
	background: transparent;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.btn-outline-primary::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--themecolor);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.3s ease;
	z-index: -1;
}

.btn-outline-primary:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}

.btn-outline-primary:hover {
	color: #fff;
	border-color: var(--themecolor);
}

/* 评论项悬浮效�?*/
.comment-body {
	transition: all 0.25s ease;
	border-radius: var(--m3-shape-md);
	padding: 12px;
	margin: -12px;
}

.comment-body:hover {
	background: rgba(var(--themecolor-rgbstr), 0.03);
}

html.darkmode .comment-body:hover {
	background: rgba(255, 255, 255, 0.03);
}

/* 输入框聚焦效�?*/
.form-control:focus,
textarea.form-control:focus {
	border-color: var(--themecolor);
	box-shadow:
		0 0 0 3px rgba(var(--themecolor-rgbstr), 0.12),
		0 2px 8px rgba(var(--themecolor-rgbstr), 0.08);
}

/* 浮动按钮优化 */
#float_action_buttons .fabtn {
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.1);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.08),
		0 4px 16px rgba(var(--themecolor-rgbstr), 0.1);
}

#float_action_buttons .fabtn:hover {
	background: var(--themecolor);
	color: #fff;
	border-color: transparent;
	box-shadow:
		0 4px 12px rgba(var(--themecolor-rgbstr), 0.3),
		0 8px 24px rgba(var(--themecolor-rgbstr), 0.2);
	transform: translateY(-2px);
}

html.darkmode #float_action_buttons .fabtn {
	background: rgba(var(--color-darkmode-foreground-rgbstr, 45, 45, 45), 0.9);
	border: 1px solid rgba(255, 255, 255, 0.08);
}

html.darkmode #float_action_buttons .fabtn:hover {
	background: var(--themecolor);
}

/* Banner 优化 */
.banner {
	position: relative;
}

.banner::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 120px;
	background: linear-gradient(to top, var(--color-background) 0%, transparent 100%);
	pointer-events: none;
}

/* Banner 标题优化 */
.banner-title {
	text-shadow:
		0 2px 4px rgba(0, 0, 0, 0.3),
		0 4px 16px rgba(0, 0, 0, 0.2);
}

/* 分页优化 */
.page-link {
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.1);
	transition: all 0.25s ease;
}

.page-link:hover {
	background: var(--themecolor);
	color: #fff;
	border-color: var(--themecolor);
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(var(--themecolor-rgbstr), 0.25);
}

.page-item.active .page-link {
	background: linear-gradient(135deg, var(--themecolor-light), var(--themecolor));
	border-color: transparent;
	box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.3);
}

html.darkmode .page-link {
	background: rgba(var(--color-darkmode-foreground-rgbstr, 45, 45, 45), 0.8);
	border-color: rgba(255, 255, 255, 0.08);
}

/* 标签优化 */
.badge.badge-secondary,
.tag.badge-secondary {
	background: rgba(var(--themecolor-rgbstr), 0.1);
	color: var(--themecolor);
	border: none;
}

.badge.badge-secondary:hover,
.tag.badge-secondary:hover {
	background: var(--themecolor);
	color: #fff;
}

/* 代码块优�?*/
article pre,
.hljs-codeblock {
	background: rgba(30, 30, 40, 0.95) !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.05),
		0 4px 16px rgba(0, 0, 0, 0.15);
}

/* 引用块优�?*/
article .post-content blockquote {
	background: linear-gradient(135deg,
			rgba(var(--themecolor-rgbstr), 0.06) 0%,
			rgba(var(--themecolor-rgbstr), 0.02) 100%);
	border-left: 3px solid var(--themecolor);
	box-shadow: inset 0 0 0 1px rgba(var(--themecolor-rgbstr), 0.05);
}

/* 目录优化 */
#post_toc a {
	transition: all 0.2s ease;
	border-radius: 4px;
	padding: 4px 8px;
	margin: -4px -8px;
}

#post_toc a:hover {
	background: rgba(var(--themecolor-rgbstr), 0.08);
	color: var(--themecolor);
}

#post_toc a.active {
	background: rgba(var(--themecolor-rgbstr), 0.12);
	color: var(--themecolor);
	font-weight: 500;
}

/* 加载动画优化 */
@keyframes skeleton-loading {
	0% {
		background-position: -200% 0;
	}

	100% {
		background-position: 200% 0;
	}
}

.skeleton-loading {
	background: linear-gradient(90deg,
			rgba(var(--themecolor-rgbstr), 0.06) 25%,
			rgba(var(--themecolor-rgbstr), 0.12) 50%,
			rgba(var(--themecolor-rgbstr), 0.06) 75%);
	background-size: 200% 100%;
	animation: skeleton-loading 1.5s infinite;
}

/* 链接下划线动�?*/
a {
	text-decoration: none;
}

/* 图片加载优化 */
article img {
	opacity: 1;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

article img:hover {
	transform: scale(1.01);
}

/* 表格优化 */
article table {
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.08);
}

article table>thead>tr>th {
	background: linear-gradient(135deg,
			rgba(var(--themecolor-rgbstr), 0.08) 0%,
			rgba(var(--themecolor-rgbstr), 0.04) 100%);
	border-bottom: 2px solid rgba(var(--themecolor-rgbstr), 0.15);
}

article table>tbody>tr:hover {
	background: rgba(var(--themecolor-rgbstr), 0.03);
}

/* 友情链接卡片优化 */
.friend-link-card {
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.08);
	transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.friend-link-card:hover {
	box-shadow:
		0 8px 24px rgba(var(--themecolor-rgbstr), 0.12),
		0 16px 48px rgba(0, 0, 0, 0.08);
	border-color: rgba(var(--themecolor-rgbstr), 0.2);
}

html.darkmode .friend-link-card {
	background: rgba(var(--color-darkmode-foreground-rgbstr, 45, 45, 45), 0.85);
	border-color: rgba(255, 255, 255, 0.06);
}

/* 时间线优�?*/
.timeline-item {
	position: relative;
}

.timeline-item::before {
	content: '';
	position: absolute;
	left: -20px;
	top: 8px;
	width: 10px;
	height: 10px;
	background: var(--themecolor);
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(var(--themecolor-rgbstr), 0.2);
	transition: all 0.3s ease;
}

.timeline-item:hover::before {
	transform: scale(1.3);
	box-shadow: 0 0 0 6px rgba(var(--themecolor-rgbstr), 0.3);
}

/* 全局焦点样式 */
:focus-visible {
	outline: 2px solid var(--themecolor);
	outline-offset: 2px;
}

/* 平滑字体渲染 */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* 响应式优�?*/
@media (max-width: 768px) {
	.card {
		-webkit-backdrop-filter: blur(6px);
		backdrop-filter: blur(6px);
	}

	article.post.card:hover {
		transform: none;
	}

	.banner::after {
		height: 80px;
	}
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ========================================
   Apple & Material 3 风格增强
   ======================================== */

/* 卡片微妙边框光泽 */
.card {
	border: 1px solid rgba(255, 255, 255, 0.18);
	box-shadow:
		0 1px 3px rgba(0, 0, 0, 0.04),
		0 4px 12px rgba(0, 0, 0, 0.03),
		inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

html.darkmode .card {
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow:
		0 1px 3px rgba(0, 0, 0, 0.2),
		0 4px 12px rgba(0, 0, 0, 0.15),
		inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* 卡片悬浮提升效果 */
article.post.card {
	transition: transform var(--animation-normal) var(--ease-spring),
		box-shadow var(--animation-normal) var(--ease-standard);
}

article.post.card:hover {
	box-shadow:
		0 8px 25px rgba(0, 0, 0, 0.08),
		0 20px 40px rgba(var(--themecolor-rgbstr), 0.06),
		inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* 按钮 Apple + Material 3 融合风格 */
.btn {
	font-weight: 500;
	letter-spacing: -0.01em;
	transition: all var(--animation-fast) var(--ease-standard);
}

/* 涟漪效果 (Ripple Effect) */
.btn-ripple {
	position: relative;
	overflow: hidden;
}

.btn-ripple::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	pointer-events: none;
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.3) 10%, transparent 10.01%);
	background-repeat: no-repeat;
	background-position: 50%;
	transform: scale(10, 10);
	opacity: 0;
	transition: opacity 350ms var(--ease-standard);
}

.btn-ripple:active::after {
	transform: scale(10, 10);
	opacity: 1;
	transition: transform 0s, opacity 0s;
}

/* 输入�?Apple 风格 */
.form-control {
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: all 0.2s ease;
}

.form-control:focus {
	border-color: var(--themecolor);
	box-shadow:
		0 0 0 3px rgba(var(--themecolor-rgbstr), 0.15),
		inset 0 1px 2px rgba(0, 0, 0, 0.02);
}

html.darkmode .form-control {
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* 侧边栏卡片光�?*/
#leftbar .card,
#leftbar_part1,
#leftbar_part2 {
	border: 1px solid rgba(255, 255, 255, 0.2);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.04),
		inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html.darkmode #leftbar .card,
html.darkmode #leftbar_part1,
html.darkmode #leftbar_part2 {
	border: 1px solid rgba(255, 255, 255, 0.06);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* 头像环发光效�?*/
#leftbar_overview_author_image {
	border: 3px solid rgba(255, 255, 255, 0.9);
	box-shadow:
		0 0 0 1px rgba(var(--themecolor-rgbstr), 0.2),
		0 4px 15px rgba(0, 0, 0, 0.1);
	transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#leftbar_overview_author_image:hover {
	transform: scale(1.05);
	box-shadow:
		0 0 0 2px rgba(var(--themecolor-rgbstr), 0.4),
		0 8px 25px rgba(var(--themecolor-rgbstr), 0.2);
}

/* 浮动按钮 Apple 风格 */
#float_action_buttons .fabtn {
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.1),
		0 8px 20px rgba(0, 0, 0, 0.06),
		inset 0 1px 0 rgba(255, 255, 255, 0.5);
	transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#float_action_buttons .fabtn:hover {
	box-shadow:
		0 6px 16px rgba(var(--themecolor-rgbstr), 0.25),
		0 12px 28px rgba(0, 0, 0, 0.1),
		inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

html.darkmode #float_action_buttons .fabtn {
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.3),
		0 8px 20px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* 分页按钮 */
.page-link {
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: all 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.page-link:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(var(--themecolor-rgbstr), 0.2);
}

.page-item.active .page-link {
	background: linear-gradient(180deg, var(--themecolor-light), var(--themecolor));
	box-shadow:
		0 2px 8px rgba(var(--themecolor-rgbstr), 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* 标签胶囊样式 */
.badge,
.tag {
	background: rgba(var(--themecolor-rgbstr), 0.1);
	color: var(--themecolor);
	border: none;
	font-weight: 500;
	transition: all 0.2s ease;
}

.badge:hover,
.tag:hover {
	background: var(--themecolor);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(var(--themecolor-rgbstr), 0.3);
}

/* 评论区卡�?*/
#comments.card,
#post_comment.card {
	border: 1px solid rgba(255, 255, 255, 0.15);
	box-shadow:
		0 2px 12px rgba(0, 0, 0, 0.04),
		inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html.darkmode #comments.card,
html.darkmode #post_comment.card {
	border: 1px solid rgba(255, 255, 255, 0.06);
	box-shadow:
		0 2px 12px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* 评论头像悬浮 */
.comment-avatar img {
	transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.comment-avatar img:hover {
	transform: scale(1.1);
	box-shadow: 0 4px 16px rgba(var(--themecolor-rgbstr), 0.2);
}

/* 导航和推荐卡�?*/
.post-navigation.card,
.related-posts.card {
	border: 1px solid rgba(255, 255, 255, 0.15);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.04),
		inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html.darkmode .post-navigation.card,
html.darkmode .related-posts.card {
	border: 1px solid rgba(255, 255, 255, 0.06);
	box-shadow:
		0 2px 8px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* 下拉菜单 Apple 风格 */
.dropdown-menu {
	border: 1px solid rgba(0, 0, 0, 0.08);
	box-shadow:
		0 10px 40px rgba(0, 0, 0, 0.12),
		0 2px 10px rgba(0, 0, 0, 0.06);
	-webkit-backdrop-filter: blur(20px) saturate(180%);
	backdrop-filter: blur(20px) saturate(180%);
	background: rgba(255, 255, 255, 0.9);
}

html.darkmode .dropdown-menu {
	background: rgba(40, 40, 40, 0.9);
	border: 1px solid rgba(255, 255, 255, 0.1);
}

/* 模态框 Apple 风格 */
.modal-content {
	border: 1px solid rgba(255, 255, 255, 0.2);
	box-shadow:
		0 25px 80px rgba(0, 0, 0, 0.25),
		0 10px 30px rgba(0, 0, 0, 0.1);
	-webkit-backdrop-filter: blur(30px) saturate(150%);
	backdrop-filter: blur(30px) saturate(150%);
	background: rgba(255, 255, 255, 0.95);
}

html.darkmode .modal-content {
	background: rgba(40, 40, 40, 0.95);
	border: 1px solid rgba(255, 255, 255, 0.1);
}

/* 代码块优雅阴�?*/
article pre,
.hljs-codeblock {
	box-shadow:
		0 4px 20px rgba(0, 0, 0, 0.15),
		inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* 引用块左边框渐变 */
article .post-content blockquote {
	border-left: 3px solid transparent;
	border-image: linear-gradient(180deg, var(--themecolor), var(--themecolor-light)) 1;
	background: linear-gradient(135deg,
			rgba(var(--themecolor-rgbstr), 0.06) 0%,
			rgba(var(--themecolor-rgbstr), 0.02) 100%);
}

/* 表格优雅样式 */
article table {
	border: 1px solid rgba(var(--themecolor-rgbstr), 0.1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
	overflow: hidden;
}

article table>thead>tr>th {
	background: linear-gradient(180deg,
			rgba(var(--themecolor-rgbstr), 0.08) 0%,
			rgba(var(--themecolor-rgbstr), 0.04) 100%);
}

/* 图片悬浮效果 */
article .post-content img {
	transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
	border-radius: 8px;
}

article .post-content img:hover {
	transform: scale(1.02);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
}

/* 链接下划线动�?*/
article .post-content a:not(.btn):not(.tag):not(.badge) {
	text-decoration: none;
	background: linear-gradient(var(--themecolor), var(--themecolor)) no-repeat right bottom;
	background-size: 0 1.5px;
	transition: background-size 0.3s ease;
	padding-bottom: 1px;
}

article .post-content a:not(.btn):not(.tag):not(.badge):hover {
	background-size: 100% 1.5px;
	background-position: left bottom;
}

/* 滚动条美�?*/
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0.02);
	border-radius: 5px;
}

::-webkit-scrollbar-thumb {
	background: rgba(var(--themecolor-rgbstr), 0.25);
	border-radius: 5px;
	border: 2px solid transparent;
	background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(var(--themecolor-rgbstr), 0.4);
	border: 2px solid transparent;
	background-clip: padding-box;
}

html.darkmode ::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.02);
}

html.darkmode ::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.2);
}

html.darkmode ::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.35);
}

/* 选中文本样式 */
::selection {
	background: rgba(var(--themecolor-rgbstr), 0.25);
	color: inherit;
}

/* 移动端响应式调整 */
@media (max-width: 768px) {
	article.post.card:hover {
		transform: none;
	}
}

/* ========================================
   Material 3 分段控件 (Segmented Control)
   ======================================== */

.segmented-control {
	display: inline-flex;
	background: var(--color-widgets-disabled);
	border-radius: 10px;
	padding: 3px;
	gap: 2px;
}

.segmented-control-item {
	padding: 6px 14px;
	border-radius: 8px;
	border: none;
	background: transparent;
	color: var(--color-text-deeper);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: all var(--animation-fast) var(--ease-standard);
}

.segmented-control-item:hover {
	background: rgba(var(--themecolor-rgbstr), 0.08);
}

.segmented-control-item.active {
	background: var(--themecolor);
	color: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

html.darkmode .segmented-control {
	background: rgba(255, 255, 255, 0.08);
}

html.darkmode .segmented-control-item {
	color: rgba(255, 255, 255, 0.9);
}

html.darkmode .segmented-control-item:hover {
	background: rgba(255, 255, 255, 0.1);
}

/* ========================================
   主题变体 - 玻璃拟�?(Glassmorphism)
   使用 CSS 变量，由站长设置控制
   ======================================== */

html.style-glass .card,
html.style-glass #fabtn_blog_settings_popup {
	background: rgba(255, 255, 255, var(--card-opacity, 0.7));
	-webkit-backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

html.style-glass .card:hover {
	background: rgba(255, 255, 255, calc(var(--card-opacity, 0.7) + 0.1));
}

html.darkmode.style-glass .card,
html.darkmode.style-glass #fabtn_blog_settings_popup {
	background: rgba(66, 66, 66, var(--card-opacity, 0.7));
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

html.darkmode.style-glass .card:hover {
	background: rgba(66, 66, 66, calc(var(--card-opacity, 0.7) + 0.1));
}

/* Fix CSS Stacking Context breaking backdrop-filter in Glass style */
html.style-glass .article-list article.post,
html.style-glass article.post.post-full,
html.style-glass .page-transition-content,
html.style-glass #primary {
	will-change: auto !important;
	transform: none !important;
	animation-fill-mode: none !important;
}

/* ========================================
   主题变体 - 新拟�?(Neumorphism)
   ======================================== */

html.style-neumorphism .card {
	background: var(--color-background);
	border: none;
	box-shadow:
		8px 8px 16px rgba(0, 0, 0, 0.08),
		-8px -8px 16px rgba(255, 255, 255, 0.8);
}

html.style-neumorphism .card:hover {
	box-shadow:
		10px 10px 20px rgba(0, 0, 0, 0.1),
		-10px -10px 20px rgba(255, 255, 255, 0.9);
}

html.style-neumorphism #fabtn_blog_settings_popup {
	background: var(--color-background);
	box-shadow:
		8px 8px 16px rgba(0, 0, 0, 0.08),
		-8px -8px 16px rgba(255, 255, 255, 0.8);
}

html.style-neumorphism .btn-primary {
	box-shadow:
		4px 4px 8px rgba(0, 0, 0, 0.1),
		-4px -4px 8px rgba(255, 255, 255, 0.5);
}

html.style-neumorphism .btn-primary:active {
	box-shadow:
		inset 2px 2px 4px rgba(0, 0, 0, 0.1),
		inset -2px -2px 4px rgba(255, 255, 255, 0.5);
}

html.darkmode.style-neumorphism .card {
	background: var(--color-background);
	box-shadow:
		8px 8px 16px rgba(0, 0, 0, 0.3),
		-8px -8px 16px rgba(255, 255, 255, 0.05);
}

html.darkmode.style-neumorphism .card:hover {
	box-shadow:
		10px 10px 20px rgba(0, 0, 0, 0.35),
		-10px -10px 20px rgba(255, 255, 255, 0.06);
}

html.darkmode.style-neumorphism #fabtn_blog_settings_popup {
	box-shadow:
		8px 8px 16px rgba(0, 0, 0, 0.3),
		-8px -8px 16px rgba(255, 255, 255, 0.05);
}

/* 样式切换过渡动画 */
html.style-glass .card,
html.style-glass #fabtn_blog_settings_popup,
html.style-neumorphism .card,
html.style-neumorphism #fabtn_blog_settings_popup {
	transition:
		background-color var(--animation-slow) var(--ease-standard),
		box-shadow var(--animation-slow) var(--ease-standard),
		backdrop-filter var(--animation-slow) var(--ease-standard);
}


/* ========== 玻璃风格下文�?页面卡片样式统一 ========== */
/* 使用 CSS 变量，确保与首页卡片一�?*/
html.style-glass article.post.post-full.card {
	background: rgba(255, 255, 255, var(--card-opacity, 0.7)) !important;
	-webkit-backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

html.darkmode.style-glass article.post.post-full.card {
	background: rgba(66, 66, 66, var(--card-opacity, 0.7)) !important;
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

/* ========== 移动端侧边栏重新设计 ========== */
@media screen and (max-width: 900px) {

	/* 侧边栏容�?*/
	#leftbar {
		width: min(300px, 82vw);
		background: var(--color-foreground);
		box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15);
	}

	/* 移动端导航整体布局 */
	.leftbar-mobile-nav {
		padding-bottom: env(safe-area-inset-bottom, 0);
		overflow-y: auto;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
	}

	/* ===== 顶部用户信息�?===== */
	.leftbar-mobile-profile {
		padding: 32px 24px 28px;
		padding-top: calc(32px + env(safe-area-inset-top, 0));
		background: var(--themecolor-gradient);
		position: relative;
	}

	/* 装饰性背景圆 */
	.leftbar-mobile-profile::before {
		content: "";
		position: absolute;
		top: -50px;
		right: -50px;
		width: 140px;
		height: 140px;
		background: rgba(255, 255, 255, 0.1);
		border-radius: 50%;
	}

	.leftbar-mobile-profile::after {
		content: "";
		position: absolute;
		bottom: -30px;
		left: -30px;
		width: 100px;
		height: 100px;
		background: rgba(255, 255, 255, 0.06);
		border-radius: 50%;
	}

	/* 关闭按钮 */
	.leftbar-mobile-close {
		position: absolute;
		top: calc(16px + env(safe-area-inset-top, 0));
		right: 16px;
		width: 36px;
		height: 36px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.18);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		color: #fff;
		cursor: pointer;
		z-index: 2;
		transition: all var(--animation-fast) var(--ease-spring);
	}

	.leftbar-mobile-close:active {
		transform: scale(0.9);
		background: rgba(255, 255, 255, 0.28);
	}

	.leftbar-mobile-close i {
		font-size: 14px;
	}

	/* 头像 */
	.leftbar-mobile-avatar {
		width: 72px;
		height: 72px;
		border-radius: 50%;
		overflow: hidden;
		border: 3px solid rgba(255, 255, 255, 0.4);
		margin: 0 auto 16px;
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
		position: relative;
		z-index: 1;
		transition: all var(--animation-normal) var(--ease-spring);
	}

	.leftbar-mobile-avatar:active {
		transform: scale(0.95);
	}

	.leftbar-mobile-avatar img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* 用户信息 */
	.leftbar-mobile-user-info {
		text-align: center;
		position: relative;
		z-index: 1;
		margin-bottom: 20px;
	}

	.leftbar-mobile-user-name {
		font-size: 22px;
		font-weight: 700;
		color: #fff;
		margin-bottom: 6px;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		flex-wrap: wrap;
	}

	.leftbar-mobile-user-desc {
		font-size: 13px;
		color: rgba(255, 255, 255, 0.85);
		line-height: 1.5;
		max-width: 220px;
		margin: 0 auto;
	}

	/* 统计数据 */
	.leftbar-mobile-stats {
		display: flex;
		background: rgba(255, 255, 255, 0.15);
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		border-radius: 16px;
		padding: 14px 10px;
		position: relative;
		z-index: 1;
	}

	.leftbar-mobile-stat {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
	}

	.leftbar-mobile-stat:not(:last-child)::after {
		content: "";
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 1px;
		height: 28px;
		background: rgba(255, 255, 255, 0.25);
	}

	.leftbar-mobile-stat .stat-num {
		font-size: 20px;
		font-weight: 700;
		color: #fff;
		line-height: 1.2;
	}

	.leftbar-mobile-stat .stat-label {
		font-size: 11px;
		color: rgba(255, 255, 255, 0.75);
		margin-top: 4px;
		font-weight: 500;
	}

	/* ===== 搜索�?===== */
	.leftbar-mobile-search {
		padding: 18px 18px 10px;
	}

	.leftbar-mobile-search-inner {
		display: flex;
		align-items: center;
		background: var(--color-background);
		border-radius: 14px;
		padding: 12px 16px;
		gap: 12px;
		border: 1.5px solid transparent;
		transition: all var(--animation-fast) var(--ease-standard);
	}

	.leftbar-mobile-search-inner:focus-within {
		border-color: rgba(var(--themecolor-rgbstr), 0.4);
		background: var(--color-foreground);
		box-shadow: 0 0 0 4px rgba(var(--themecolor-rgbstr), 0.1);
	}

	.leftbar-mobile-search-inner i {
		color: #999;
		font-size: 15px;
		transition: color var(--animation-fast);
	}

	.leftbar-mobile-search-inner:focus-within i {
		color: var(--themecolor);
	}

	.leftbar-mobile-search-inner input {
		flex: 1;
		border: none;
		background: transparent;
		font-size: 15px;
		color: var(--color-text-deeper);
		outline: none;
	}

	.leftbar-mobile-search-inner input::placeholder {
		color: #aaa;
	}

	/* ===== 菜单区域 ===== */
	.leftbar-mobile-menu-section {
		padding: 10px 14px 8px;
	}

	.leftbar-mobile-section-title {
		font-size: 11px;
		font-weight: 700;
		color: #999;
		text-transform: uppercase;
		letter-spacing: 1.5px;
		padding: 8px 14px 12px;
	}

	.leftbar-mobile-menu {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	.leftbar-mobile-menu-item {
		margin-bottom: 4px;
	}

	.leftbar-mobile-menu-item>a {
		display: flex;
		align-items: center;
		padding: 14px 16px;
		color: var(--color-text-deeper);
		text-decoration: none;
		border-radius: 14px;
		font-size: 15px;
		font-weight: 500;
		transition: all var(--animation-fast) var(--ease-standard);
	}

	.leftbar-mobile-menu-item>a:active {
		background: rgba(var(--themecolor-rgbstr), 0.1);
		transform: scale(0.98);
	}

	.leftbar-mobile-menu-item.current>a {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
	}

	.leftbar-mobile-menu-item .menu-text {
		flex: 1;
	}

	.leftbar-mobile-menu-item .submenu-arrow {
		font-size: 12px;
		color: #999;
		transition: transform var(--animation-normal) var(--ease-standard);
	}

	.leftbar-mobile-menu-item.expanded .submenu-arrow {
		transform: rotate(180deg);
	}

	/* 子菜�?*/
	.leftbar-mobile-submenu {
		list-style: none;
		padding: 0;
		margin: 4px 0 4px 18px;
		padding-left: 14px;
		border-left: 2px solid var(--color-border-on-foreground-deeper);
		max-height: 0;
		overflow: hidden;
		transition: max-height var(--animation-normal) var(--ease-standard);
	}

	.leftbar-mobile-menu-item.expanded .leftbar-mobile-submenu {
		max-height: 400px;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item {
		margin-bottom: 2px;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item>a {
		padding: 11px 14px;
		font-size: 14px;
		font-weight: 400;
		color: #666;
		border-radius: 10px;
	}

	.leftbar-mobile-submenu .leftbar-mobile-menu-item>a:active {
		color: var(--themecolor);
		background: rgba(var(--themecolor-rgbstr), 0.08);
	}

	/* ===== 折叠面板 ===== */
	.leftbar-mobile-collapse-section {
		margin: 6px 14px;
		background: var(--color-background);
		border-radius: 16px;
		overflow: hidden;
		transition: all var(--animation-normal) var(--ease-emphasized);
	}

	.leftbar-mobile-collapse-section.expanded {
		box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	}

	.leftbar-mobile-collapse-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 12px 16px;
		cursor: pointer;
		user-select: none;
		transition: background var(--animation-fast);
	}

	.leftbar-mobile-collapse-header:active {
		background: rgba(var(--themecolor-rgbstr), 0.05);
	}

	.collapse-header-left {
		display: flex;
		align-items: center;
		gap: 12px;
		flex: 1;
	}

	.collapse-icon {
		width: 32px;
		height: 32px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
		border-radius: 10px;
		font-size: 13px;
		transition: all var(--animation-normal) var(--ease-spring);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-icon {
		background: var(--themecolor);
		color: #fff;
		transform: scale(1.05);
		box-shadow: 0 3px 10px rgba(var(--themecolor-rgbstr), 0.35);
	}

	.collapse-title {
		font-size: 14px;
		font-weight: 600;
		color: var(--color-text-deeper);
		transition: color var(--animation-fast);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-title {
		color: var(--themecolor);
	}

	.collapse-badge {
		background: var(--themecolor);
		color: #fff;
		font-size: 10px;
		font-weight: 700;
		padding: 3px 8px;
		border-radius: 10px;
		min-width: 20px;
		text-align: center;
		margin-left: auto;
		margin-right: 12px;
		box-shadow: 0 2px 8px rgba(var(--themecolor-rgbstr), 0.3);
		transition: all var(--animation-normal) var(--ease-spring);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-badge {
		transform: scale(1.08);
	}

	.collapse-arrow {
		font-size: 11px;
		color: #aaa;
		transition: all var(--animation-normal) var(--ease-emphasized);
	}

	.leftbar-mobile-collapse-section.expanded .collapse-arrow {
		transform: rotate(180deg);
		color: var(--themecolor);
	}

	.leftbar-mobile-collapse-content {
		max-height: 0;
		overflow: hidden;
		transition: max-height var(--animation-slow) var(--ease-emphasized);
	}

	.leftbar-mobile-collapse-section.expanded .leftbar-mobile-collapse-content {
		max-height: 320px;
	}

	/* 目录容器 */
	.mobile-catalog-container {
		padding: 4px 14px 14px;
	}

	#leftbar_mobile_catalog {
		max-height: 240px;
		overflow-y: auto;
		padding-right: 4px;
	}

	#leftbar_mobile_catalog .index-link {
		padding: 9px 12px;
		font-size: 13px;
		border-radius: 8px;
	}

	/* TODO 容器 */
	.mobile-todo-container {
		padding: 4px 14px 14px;
	}

	.mobile-todo-add-form {
		display: flex;
		gap: 8px;
		margin-bottom: 12px;
	}

	.mobile-todo-add-form input {
		flex: 1;
		border: 1.5px solid var(--color-border-on-foreground-deeper);
		border-radius: 12px;
		padding: 10px 14px;
		font-size: 14px;
		background: var(--color-foreground);
		color: var(--color-text-deeper);
		outline: none;
		transition: all var(--animation-fast);
	}

	.mobile-todo-add-form input:focus {
		border-color: var(--themecolor);
		box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.12);
	}

	.mobile-todo-add-form button {
		width: 40px;
		height: 40px;
		border: none;
		border-radius: 12px;
		background: var(--themecolor);
		color: #fff;
		font-size: 14px;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		box-shadow: 0 3px 10px rgba(var(--themecolor-rgbstr), 0.3);
		transition: all var(--animation-fast) var(--ease-spring);
	}

	.mobile-todo-add-form button:active {
		transform: scale(0.9);
	}

	.mobile-todo-list {
		list-style: none;
		padding: 0;
		margin: 0;
		max-height: 180px;
		overflow-y: auto;
	}

	.mobile-todo-item {
		display: flex;
		align-items: center;
		padding: 12px 14px;
		background: var(--color-foreground);
		border-radius: 12px;
		margin-bottom: 6px;
		transition: all var(--animation-fast);
	}

	.mobile-todo-content {
		flex: 1;
		font-size: 13px;
		color: var(--color-text-deeper);
	}

	.mobile-todo-complete-btn,
	.mobile-todo-urge-btn,
	.mobile-todo-delete-btn {
		width: 30px;
		height: 30px;
		border: none;
		border-radius: 8px;
		font-size: 12px;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-left: 8px;
		transition: all var(--animation-fast) var(--ease-spring);
	}

	.mobile-todo-complete-btn {
		background: rgba(76, 175, 80, 0.12);
		color: #4CAF50;
	}

	.mobile-todo-complete-btn:active {
		transform: scale(0.9);
		background: rgba(76, 175, 80, 0.2);
	}

	.mobile-todo-delete-btn {
		background: rgba(244, 67, 54, 0.12);
		color: #F44336;
	}

	.mobile-todo-delete-btn:active {
		transform: scale(0.9);
	}

	.mobile-todo-urge-btn {
		background: rgba(255, 152, 0, 0.12);
		color: #FF9800;
	}

	.mobile-todo-urge-btn:active {
		transform: scale(0.9);
	}

	/* ===== 底部操作�?===== */
	.leftbar-mobile-footer {
		margin-top: auto;
		padding: 14px 18px 22px;
		padding-bottom: calc(22px + env(safe-area-inset-bottom, 0));
		border-top: 1px solid var(--color-border-on-foreground-deeper);
		background: var(--color-foreground);
	}

	.leftbar-mobile-actions {
		display: flex;
		justify-content: center;
		gap: 10px;
	}

	.leftbar-mobile-action {
		flex: 1;
		max-width: 95px;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 14px 10px;
		border: none;
		background: var(--color-background);
		color: #666;
		font-size: 11px;
		font-weight: 500;
		cursor: pointer;
		border-radius: 14px;
		transition: all var(--animation-fast) var(--ease-spring);
	}

	.leftbar-mobile-action:active {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		color: var(--themecolor);
		transform: scale(0.95);
	}

	.leftbar-mobile-action i {
		font-size: 20px;
		transition: transform var(--animation-fast) var(--ease-spring);
	}

	.leftbar-mobile-action:active i {
		transform: scale(1.15);
	}

	.leftbar-mobile-action span {
		white-space: nowrap;
	}
}

/* ===== 小屏幕适配 ===== */
@media screen and (max-width: 375px) {
	#leftbar {
		width: min(270px, 80vw);
	}

	.leftbar-mobile-profile {
		padding: 26px 20px 24px;
	}

	.leftbar-mobile-avatar {
		width: 64px;
		height: 64px;
	}

	.leftbar-mobile-user-name {
		font-size: 20px;
	}

	.leftbar-mobile-stats {
		padding: 12px 8px;
	}

	.leftbar-mobile-stat .stat-num {
		font-size: 18px;
	}

	.leftbar-mobile-search {
		padding: 14px 14px 8px;
	}

	.leftbar-mobile-menu-section {
		padding: 8px 12px 6px;
	}

	.leftbar-mobile-collapse-section {
		margin: 5px 12px;
	}

	.collapse-icon {
		width: 28px;
		height: 28px;
		font-size: 12px;
	}

	.collapse-title {
		font-size: 13px;
	}

	.leftbar-mobile-footer {
		padding: 12px 14px 18px;
	}

	.leftbar-mobile-action {
		padding: 12px 8px;
		max-width: 85px;
	}

	.leftbar-mobile-action i {
		font-size: 18px;
	}

	.leftbar-mobile-action span {
		font-size: 10px;
	}
}

/* ========== 移动端玻璃风格文章卡�?========== */
@media screen and (max-width: 900px) {
	html.style-glass article.post.post-full.card {
		background: rgba(255, 255, 255, var(--card-opacity, 0.7)) !important;
		-webkit-backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
		backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	}

	html.darkmode.style-glass article.post.post-full.card {
		background: rgba(66, 66, 66, var(--card-opacity, 0.7)) !important;
		-webkit-backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
		backdrop-filter: blur(var(--card-blur, 20px)) saturate(var(--card-saturate, 180%));
	}
}

/* ========== 暗色模式移动端目录样式补�?========== */
@media screen and (max-width: 900px) {

	/* 暗色模式下目录链接颜�?*/
	html.darkmode #leftbar_mobile_catalog .index-link {
		color: #bbb;
	}

	html.darkmode #leftbar_mobile_catalog .index-item.current>.index-link {
		color: var(--themecolor-light);
		background: rgba(var(--themecolor-rgbstr), 0.15);
	}

	html.darkmode #leftbar_mobile_catalog .index-link:active {
		background: rgba(var(--themecolor-rgbstr), 0.18);
	}

	/* 暗色模式下子目录边框 */
	html.darkmode #leftbar_mobile_catalog .index-subItem-box {
		border-left-color: rgba(255, 255, 255, 0.1);
	}

	/* 暗色模式下滚动条 */
	html.darkmode #leftbar_mobile_catalog::-webkit-scrollbar-thumb {
		background: rgba(var(--themecolor-rgbstr), 0.35);
	}
}


/* ========== backdrop-filter 移动端兼容性修�?========== */
/* 针对不支�?backdrop-filter 的浏览器提供降级方案 */

/* 检测不支持 backdrop-filter 的浏览器，使用更高不透明度的背景作为降级 */
@supports not (backdrop-filter: blur(1px)) {

	/* 顶栏降级 */
	html.no-banner.toolbar-blur #navbar-main {
		background-color: rgba(var(--themecolor-rgbstr), 0.92) !important;
	}

	/* 搜索框降�?*/
	#navbar_search_input_container.open .input-group {
		background: rgba(255, 255, 255, 0.95);
	}

	/* 侧边栏遮罩降�?*/
	#sidebar_mask {
		background: rgba(0, 0, 0, 0.65);
	}

	/* 左侧栏移动端降级 */
	@media screen and (max-width: 900px) {
		#leftbar {
			background: rgba(255, 255, 255, 0.98) !important;
		}

		html.darkmode #leftbar {
			background: rgba(30, 30, 30, 0.98) !important;
		}

		.leftbar-mobile-action {
			background: rgba(var(--themecolor-rgbstr), 0.12);
		}

		.leftbar-mobile-actions-container {
			background: rgba(255, 255, 255, 0.98);
		}

		html.darkmode .leftbar-mobile-actions-container {
			background: rgba(30, 30, 30, 0.98);
		}
	}

	/* 玻璃态顶栏降�?*/
	html.toolbar-glass #navbar-main {
		background: rgba(255, 255, 255, 0.88) !important;
	}

	html.toolbar-glass.darkmode #navbar-main {
		background: rgba(0, 0, 0, 0.85) !important;
	}

	/* 弹窗遮罩降级 */
	.modal-backdrop,
	#share_panel_mask {
		background: rgba(0, 0, 0, 0.7);
	}

	/* 图片查看器遮罩降�?*/
	.fancybox-bg {
		background: rgba(0, 0, 0, 0.92);
	}
}

/* 针对 -webkit-backdrop-filter 也不支持的情况（部分旧版安卓浏览器） */
@supports not (-webkit-backdrop-filter: blur(1px)) {
	@supports not (backdrop-filter: blur(1px)) {

		/* 确保在完全不支持的情况下有可用的样式 */
		html.no-banner.toolbar-blur #navbar-main,
		html.toolbar-glass #navbar-main {
			background-color: rgba(var(--themecolor-rgbstr), 0.95) !important;
		}

		@media screen and (max-width: 900px) {
			#leftbar {
				background: var(--color-foreground) !important;
			}
		}
	}
}

/* ========== iOS Safari 特殊处理 ========== */
/* iOS Safari 需�?-webkit- 前缀，且在某些情况下需要强制开启硬件加�?*/
@media screen and (max-width: 900px) {

	#leftbar,
	#navbar-main,
	.leftbar-mobile-actions-container {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}

/* ========== Modern UI Enhancements - 现代化布局和动画优�?========== */

/* 1. 增强动画变量 */
:root {
	--micro-duration: 80ms;
	--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in-out-expo: cubic-bezier(0.87, 0, 0.13, 1);
	--ease-elastic: cubic-bezier(0.68, -0.6, 0.32, 1.6);
	--ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);
	--shadow-1: 0 1px 2px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.1);
	--shadow-2: 0 2px 4px rgba(0, 0, 0, 0.05), 0 4px 8px rgba(0, 0, 0, 0.1);
	--shadow-3: 0 4px 8px rgba(0, 0, 0, 0.05), 0 8px 16px rgba(0, 0, 0, 0.1);
	--shadow-4: 0 8px 16px rgba(0, 0, 0, 0.08), 0 16px 32px rgba(0, 0, 0, 0.12);
	--shadow-5: 0 12px 24px rgba(0, 0, 0, 0.1), 0 24px 48px rgba(0, 0, 0, 0.15);
	--shadow-hover: 0 8px 25px rgba(0, 0, 0, 0.1), 0 4px 10px rgba(var(--themecolor-rgbstr), 0.08);
	--shadow-active: 0 2px 8px rgba(0, 0, 0, 0.08);
}

html.darkmode {
	--shadow-1: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.3);
	--shadow-2: 0 2px 4px rgba(0, 0, 0, 0.2), 0 4px 8px rgba(0, 0, 0, 0.3);
	--shadow-3: 0 4px 8px rgba(0, 0, 0, 0.2), 0 8px 16px rgba(0, 0, 0, 0.3);
	--shadow-4: 0 8px 16px rgba(0, 0, 0, 0.25), 0 16px 32px rgba(0, 0, 0, 0.35);
	--shadow-5: 0 12px 24px rgba(0, 0, 0, 0.3), 0 24px 48px rgba(0, 0, 0, 0.4);
	--shadow-hover: 0 8px 25px rgba(0, 0, 0, 0.35), 0 4px 10px rgba(var(--themecolor-rgbstr), 0.15);
}

/* 2. 桌面端卡片悬停效果增�?*/
@media (hover: hover) and (pointer: fine) {
	article.post.card {
		transition: transform var(--animation-normal) var(--ease-out-expo), box-shadow var(--animation-normal) var(--ease-standard);
	}

	article.post.card .post-thumbnail {
		transition: transform var(--animation-slow) var(--ease-out-expo);
	}

	article.post.card:hover .post-thumbnail {
		transform: none;
	}

	.card:not(article):not(.no-hover-effect) {
		transition: box-shadow var(--animation-normal) var(--ease-standard);
	}

	#leftbar .card,
	#rightbar .card {
		transition: box-shadow var(--animation-normal) var(--ease-standard), border-color var(--animation-fast) var(--ease-standard);
	}

	#leftbar .card:hover,
	#rightbar .card:hover {
		border-color: rgba(var(--themecolor-rgbstr), 0.15);
	}
}

/* 3. 按钮和链接悬停效�?*/
@media (hover: hover) and (pointer: fine) {
	.btn {
		transition: all var(--animation-fast) var(--ease-standard);
		position: relative;
		overflow: hidden;
	}

	.btn::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0.15) 0%, transparent 100%);
		opacity: 0;
		transition: opacity var(--animation-fast) var(--ease-standard);
		pointer-events: none;
	}

	.btn:hover::after {
		opacity: 1;
	}

	.btn:active {
		transform: scale(0.98);
		transition-duration: var(--micro-duration);
	}

	article .post-content a:not([class*="button"]):not(.no-underline) {
		background-image: linear-gradient(var(--themecolor), var(--themecolor));
		background-size: 0% 2px;
		background-position: 0 100%;
		background-repeat: no-repeat;
		transition: background-size var(--animation-normal) var(--ease-out-expo);
	}

	article .post-content a:not([class*="button"]):not(.no-underline):hover {
		background-size: 100% 2px;
	}

	.navbar-nav .nav-link {
		position: relative;
		transition: color var(--animation-fast) var(--ease-standard);
	}

	.navbar-nav .nav-link::before {
		content: "";
		position: absolute;
		bottom: 0;
		left: 50%;
		width: 0;
		height: 2px;
		background: currentColor;
		transition: width var(--animation-normal) var(--ease-out-expo), left var(--animation-normal) var(--ease-out-expo);
		border-radius: 1px;
	}

	.navbar-nav .nav-link:hover::before {
		width: 100%;
		left: 0;
	}

	.comment-item {
		transition: box-shadow var(--animation-normal) var(--ease-standard);
	}
}

/* 4. 滚动入场动画 */
@keyframes modernFadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes modernFadeInScale {
	from {
		opacity: 0;
		transform: scale(0.95);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes modernSlideInLeft {
	from {
		opacity: 0;
		transform: translateX(-20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes modernSlideInRight {
	from {
		opacity: 0;
		transform: translateX(20px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.article-list article.post {
	animation: modernFadeInUp var(--animation-slow) var(--ease-emphasized-decelerate) both;
}

.article-list article.post:nth-child(1) {
	animation-delay: 0ms;
}

.article-list article.post:nth-child(2) {
	animation-delay: 50ms;
}

.article-list article.post:nth-child(3) {
	animation-delay: 100ms;
}

.article-list article.post:nth-child(4) {
	animation-delay: 150ms;
}

.article-list article.post:nth-child(5) {
	animation-delay: 200ms;
}

.article-list article.post:nth-child(6) {
	animation-delay: 250ms;
}

.article-list article.post:nth-child(7) {
	animation-delay: 300ms;
}

.article-list article.post:nth-child(8) {
	animation-delay: 350ms;
}

.article-list article.post:nth-child(n+9) {
	animation-delay: 400ms;
}

#leftbar .card {
	animation: modernSlideInLeft var(--animation-slow) var(--ease-emphasized-decelerate) both;
}

#leftbar .card:nth-child(1) {
	animation-delay: 100ms;
}

#leftbar .card:nth-child(2) {
	animation-delay: 150ms;
}

#leftbar .card:nth-child(3) {
	animation-delay: 200ms;
}

#leftbar .card:nth-child(4) {
	animation-delay: 250ms;
}

#leftbar .card:nth-child(5) {
	animation-delay: 300ms;
}

#rightbar .card {
	animation: modernSlideInRight var(--animation-slow) var(--ease-emphasized-decelerate) both;
}

#rightbar .card:nth-child(1) {
	animation-delay: 100ms;
}

#rightbar .card:nth-child(2) {
	animation-delay: 150ms;
}

#rightbar .card:nth-child(3) {
	animation-delay: 200ms;
}

/* 5. 页面过渡和浮动按钮动�?*/
#primary.pjax-loading {
	opacity: 0.6;
	transform: translate3d(0, 10px, 0);
	pointer-events: none;
}

#primary {
	transition: opacity var(--animation-normal) var(--ease-standard), transform var(--animation-normal) var(--ease-standard);
}

@keyframes modernContentFadeIn {
	from {
		opacity: 0;
		transform: translate3d(0, 16px, 0);
	}

	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

article.post.post-full:not(.no-animation) {
	animation: modernContentFadeIn var(--animation-slow) var(--ease-emphasized-decelerate) both;
}

article.post.post-full {
	transform-origin: center top;
}

#float_action_buttons {
	transition: transform var(--animation-normal) var(--ease-back), opacity var(--animation-normal) var(--ease-standard);
}

#float_action_buttons .fabtn {
	transition: background var(--animation-fast) var(--ease-standard), box-shadow var(--animation-fast) var(--ease-standard), opacity var(--animation-normal) var(--ease-standard);
}

#float_action_buttons .fabtn:active {
	transform: scale(0.9);
	transition-duration: var(--micro-duration);
}

@keyframes modernFabtnBounceIn {
	0% {
		opacity: 0;
		transform: scale(0.3);
	}

	50% {
		transform: scale(1.05);
	}

	70% {
		transform: scale(0.95);
	}

	100% {
		opacity: 1;
		transform: scale(1);
	}
}

#float_action_buttons:not(.fabtns-unloaded) .fabtn:not(.fabtn-hidden) {
	animation: modernFabtnBounceIn var(--animation-slow) var(--ease-spring) both;
}

#float_action_buttons .fabtn:nth-child(1) {
	animation-delay: 0ms;
}

#float_action_buttons .fabtn:nth-child(2) {
	animation-delay: 50ms;
}

#float_action_buttons .fabtn:nth-child(3) {
	animation-delay: 100ms;
}

#float_action_buttons .fabtn:nth-child(4) {
	animation-delay: 150ms;
}

#float_action_buttons .fabtn:nth-child(5) {
	animation-delay: 200ms;
}

/* 6. 顶栏和评论区动画 */
#navbar-main {
	transition: background-color var(--animation-normal) var(--ease-standard), padding var(--animation-normal) var(--ease-standard), box-shadow var(--animation-normal) var(--ease-standard), transform var(--animation-normal) var(--ease-standard), backdrop-filter var(--animation-normal) var(--ease-standard);
}

#navbar-main:not(.navbar-ontop) {
	box-shadow: var(--shadow-2);
}

#navbar_search_input_container .input-group {
	transition: width var(--animation-normal) var(--ease-out-expo), background var(--animation-fast) var(--ease-standard), box-shadow var(--animation-fast) var(--ease-standard);
}

#navbar_search_input_container.open .input-group {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.comment-item {
	animation: modernFadeInUp var(--animation-normal) var(--ease-emphasized-decelerate) both;
}

.comment-item:nth-child(1) {
	animation-delay: 0ms;
}

.comment-item:nth-child(2) {
	animation-delay: 30ms;
}

.comment-item:nth-child(3) {
	animation-delay: 60ms;
}

.comment-item:nth-child(4) {
	animation-delay: 90ms;
}

.comment-item:nth-child(5) {
	animation-delay: 120ms;
}

.comment-item:nth-child(n+6) {
	animation-delay: 150ms;
}

@keyframes modernCommentSuccess {
	0% {
		transform: scale(0.8);
		opacity: 0;
	}

	50% {
		transform: scale(1.02);
	}

	100% {
		transform: scale(1);
		opacity: 1;
	}
}

.comment-item.new-comment {
	animation: modernCommentSuccess var(--animation-slow) var(--ease-spring);
}

/* 7. 图片和表单动�?*/
article img,
.post-thumbnail img {
	transition: opacity var(--animation-normal) var(--ease-standard);
}

article img[loading="lazy"],
.post-thumbnail img[loading="lazy"] {
	opacity: 0;
}

article img.loaded,
.post-thumbnail img.loaded,
article img:not([loading="lazy"]),
.post-thumbnail img:not([loading="lazy"]) {
	opacity: 1;
}

.form-control {
	transition: border-color var(--animation-fast) var(--ease-standard), box-shadow var(--animation-fast) var(--ease-standard), background-color var(--animation-fast) var(--ease-standard);
}

.form-control:focus {
	box-shadow: 0 0 0 3px rgba(var(--themecolor-rgbstr), 0.15);
	border-color: var(--themecolor);
}

.form-group.floating-label {
	position: relative;
}

.form-group.floating-label label {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	transition: all var(--animation-fast) var(--ease-standard);
	pointer-events: none;
	color: #999;
	background: var(--color-foreground);
	padding: 0 4px;
}

.form-group.floating-label .form-control:focus~label,
.form-group.floating-label .form-control:not(:placeholder-shown)~label {
	top: 0;
	font-size: 12px;
	color: var(--themecolor);
}

/* 8. 滚动条美�?*/
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background: rgba(var(--themecolor-rgbstr), 0.3);
	border-radius: 4px;
	border: 2px solid transparent;
	background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(var(--themecolor-rgbstr), 0.5);
	background-clip: content-box;
}

* {
	scrollbar-width: thin;
	scrollbar-color: rgba(var(--themecolor-rgbstr), 0.3) transparent;
}

/* 9. 移动端触摸优�?*/
@media (hover: none) and (pointer: coarse) {
	article.post.card:hover {
		transform: none;
		box-shadow: var(--shadow-1);
	}

	* {
		-webkit-tap-highlight-color: transparent;
	}
}

/* 10. 移动端侧边栏动画增强 */
@media screen and (max-width: 900px) {
	#leftbar {
		transition: transform var(--animation-normal) var(--ease-out-expo), box-shadow var(--animation-normal) var(--ease-standard);
		transform: translateX(-100%);
		box-shadow: none;
	}

	html.leftbar-opened #leftbar {
		transform: translateX(0);
		box-shadow: 4px 0 25px rgba(0, 0, 0, 0.15);
	}

	#leftbar_backdrop {
		transition: opacity var(--animation-normal) var(--ease-standard), visibility var(--animation-normal);
	}

	@keyframes modernSlideInDown {
		from {
			opacity: 0;
			transform: translateY(-15px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	html.leftbar-opened .leftbar-mobile-profile {
		animation: modernSlideInDown var(--animation-normal) var(--ease-emphasized-decelerate) 0.1s both;
	}

	html.leftbar-opened .leftbar-mobile-search {
		animation: modernFadeInUp var(--animation-normal) var(--ease-emphasized-decelerate) 0.15s both;
	}

	html.leftbar-opened .leftbar-mobile-menu-section {
		animation: modernFadeInUp var(--animation-normal) var(--ease-emphasized-decelerate) 0.2s both;
	}

	html.leftbar-opened .leftbar-mobile-footer {
		animation: modernFadeInUp var(--animation-normal) var(--ease-emphasized-decelerate) 0.25s both;
	}

	.leftbar-mobile-menu-item>a {
		transition: background var(--animation-fast) var(--ease-standard), transform var(--micro-duration) var(--ease-standard);
	}

	.leftbar-mobile-menu-item>a:active {
		background: rgba(var(--themecolor-rgbstr), 0.12);
		transform: scale(0.98);
	}

	article.post.card {
		transition: transform var(--micro-duration) var(--ease-standard), box-shadow var(--animation-fast) var(--ease-standard);
	}

	#navbar-main {
		transition: transform var(--animation-normal) var(--ease-standard), background-color var(--animation-fast) var(--ease-standard);
	}
}

/* 11. 骨架屏和加载动画 */
@keyframes modernSkeletonPulse {
	0% {
		background-position: -200% 0;
	}

	100% {
		background-position: 200% 0;
	}
}

.skeleton {
	background: linear-gradient(90deg, var(--color-border-on-foreground) 25%, var(--color-border-on-foreground-deeper) 50%, var(--color-border-on-foreground) 75%);
	background-size: 200% 100%;
	animation: modernSkeletonPulse 1.5s ease-in-out infinite;
	border-radius: var(--card-radius);
}

/* ==========================================================================
   现代化页面加载系统
   ========================================================================== */

/* ---------- 基础旋转器（保留用于其他地方） ---------- */
@keyframes modernSpinnerRotate {
	to {
		transform: rotate(360deg);
	}
}

.loading-spinner {
	width: 24px;
	height: 24px;
	border: 2px solid var(--color-border);
	border-top-color: var(--themecolor);
	border-radius: 50%;
	animation: modernSpinnerRotate 0.8s linear infinite;
}

/* ---------- 顶部进度条 ---------- */
#page-loading-bar {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	background: var(--themecolor-gradient);
	z-index: 9999;
	transition: width var(--animation-fast) var(--ease-out-expo);
	box-shadow: 0 0 10px rgba(var(--themecolor-rgbstr), 0.5);
}

/* ---------- 页面加载器容器 ---------- */
.page-loader {
	position: fixed;
	inset: 0;
	z-index: 9998;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 0.35s;
}

.page-loader.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), visibility 0s;
}

.page-loader.is-hiding {
	opacity: 0;
	transition: opacity 0.35s cubic-bezier(0.4, 0, 0.6, 1);
}

/* ---------- 背景遮罩 ---------- */
.page-loader-backdrop {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(var(--themecolor-rgbstr), 0.03) 0%, rgba(var(--themecolor-rgbstr), 0.08) 100%);
	-webkit-backdrop-filter: blur(24px) saturate(180%);
	backdrop-filter: blur(24px) saturate(180%);
}

html.darkmode .page-loader-backdrop {
	background: linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.6) 100%);
}

/* ---------- 内容容器 ---------- */
.page-loader-content {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
	transform: translateY(20px) scale(0.95);
	opacity: 0;
	transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease;
}

.page-loader.is-visible .page-loader-content {
	transform: translateY(0) scale(1);
	opacity: 1;
	transition-delay: 0.1s;
}

/* ---------- 进度环容器 ---------- */
.loader-ring-container {
	position: relative;
	width: 120px;
	height: 120px;
}

/* ---------- SVG 进度环 ---------- */
.loader-ring {
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
	filter: drop-shadow(0 4px 12px rgba(var(--themecolor-rgbstr), 0.2));
}

.loader-ring-bg {
	fill: none;
	stroke: var(--color-border);
	stroke-width: 3;
	opacity: 0.2;
}

.loader-ring-progress {
	fill: none;
	stroke: url(#loaderGradient);
	stroke-width: 3;
	stroke-linecap: round;
	stroke-dasharray: 283;
	stroke-dashoffset: 283;
	transition: stroke-dashoffset 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 渐变定义（通过 JS 动态添加或使用内联 SVG） */
.loader-ring::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: conic-gradient(from 0deg, var(--themecolor), transparent);
	opacity: 0.1;
	animation: ringGlow 2s ease-in-out infinite;
}

@keyframes ringGlow {

	0%,
	100% {
		opacity: 0.1;
	}

	50% {
		opacity: 0.3;
	}
}

/* ---------- 中心图标 ---------- */
.loader-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 48px;
	height: 48px;
	color: var(--themecolor);
	animation: iconPulse 2s ease-in-out infinite;
}

.loader-icon svg {
	width: 100%;
	height: 100%;
	animation: iconRotate 3s linear infinite;
}

@keyframes iconPulse {

	0%,
	100% {
		opacity: 0.6;
		transform: translate(-50%, -50%) scale(1);
	}

	50% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1.1);
	}
}

@keyframes iconRotate {
	to {
		transform: rotate(360deg);
	}
}

/* ---------- 加载文字 ---------- */
.loader-text {
	text-align: center;
	opacity: 0;
	transform: translateY(10px);
	animation: textFadeIn 0.5s ease forwards;
	animation-delay: 0.3s;
}

@keyframes textFadeIn {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.loader-title {
	font-size: 20px;
	font-weight: 600;
	color: var(--color-font);
	margin-bottom: 8px;
	letter-spacing: 0.5px;
}

.loader-subtitle {
	font-size: 14px;
	color: var(--color-font-sub);
	font-weight: 400;
}

/* ---------- 骨架屏（延迟显示） ---------- */
.loader-skeleton {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
	pointer-events: none;
}

.page-loader.show-skeleton .loader-skeleton {
	opacity: 1;
	transform: translateY(0);
}

/* ---------- 骨架卡片 ---------- */
.skeleton-card {
	width: min(480px, 85vw);
	background: var(--color-foreground);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

html.darkmode .skeleton-card {
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

/* ---------- 骨架图片 ---------- */
.skeleton-image {
	width: 100%;
	height: 200px;
	background: linear-gradient(90deg, var(--color-border-on-foreground) 0%, var(--color-border-on-foreground-deeper) 50%, var(--color-border-on-foreground) 100%);
	background-size: 200% 100%;
	animation: skeletonShimmer 1.5s ease-in-out infinite;
	position: relative;
	overflow: hidden;
}

.skeleton-image::after {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
	animation: shimmerSlide 2s infinite;
}

html.darkmode .skeleton-image::after {
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.05), transparent);
}

@keyframes shimmerSlide {
	to {
		left: 100%;
	}
}

@keyframes skeletonShimmer {

	0%,
	100% {
		background-position: 0% 0%;
	}

	50% {
		background-position: 100% 0%;
	}
}

/* ---------- 骨架内容 ---------- */
.skeleton-content {
	padding: 20px;
}

.skeleton-title {
	height: 24px;
	width: 70%;
	border-radius: 12px;
	background: linear-gradient(90deg, var(--color-border-on-foreground) 0%, var(--color-border-on-foreground-deeper) 50%, var(--color-border-on-foreground) 100%);
	background-size: 200% 100%;
	animation: skeletonShimmer 1.5s ease-in-out infinite;
	margin-bottom: 16px;
}

.skeleton-line {
	height: 14px;
	border-radius: 7px;
	background: linear-gradient(90deg, var(--color-border-on-foreground) 0%, var(--color-border-on-foreground-deeper) 50%, var(--color-border-on-foreground) 100%);
	background-size: 200% 100%;
	animation: skeletonShimmer 1.5s ease-in-out infinite;
	margin-bottom: 10px;
}

.skeleton-line.short {
	width: 60%;
}

/* ---------- 响应式适配 ---------- */
@media (max-width: 768px) {
	.loader-ring-container {
		width: 100px;
		height: 100px;
	}

	.loader-icon {
		width: 40px;
		height: 40px;
	}

	.loader-title {
		font-size: 18px;
	}

	.loader-subtitle {
		font-size: 13px;
	}

	.skeleton-image {
		height: 160px;
	}

	.skeleton-content {
		padding: 16px;
	}
}

@media (max-width: 480px) {
	.page-loader-content {
		gap: 24px;
	}

	.loader-ring-container {
		width: 90px;
		height: 90px;
	}

	.loader-icon {
		width: 36px;
		height: 36px;
	}

	.skeleton-card {
		width: 92vw;
	}

	.skeleton-image {
		height: 140px;
	}
}

/* ---------- 减少动画（无障碍） ---------- */
@media (prefers-reduced-motion: reduce) {

	.page-loader,
	.page-loader-content,
	.loader-ring-progress,
	.loader-icon,
	.loader-text,
	.loader-skeleton,
	.skeleton-image,
	.skeleton-title,
	.skeleton-line {
		animation: none !important;
		transition: none !important;
	}

	.page-loader.is-visible .page-loader-content {
		transform: none;
		opacity: 1;
	}
}

/* 页面过渡内容容器 */
.page-transition-content {
	will-change: opacity, transform;
	transition: opacity var(--animation-normal) var(--ease-standard), transform var(--animation-normal) var(--ease-emphasized-decelerate);
	transform: translate3d(0, 0, 0);
}

html.page-transition-enter .page-transition-content {
	opacity: 0;
	transform: translate3d(0, 8px, 0);
}

html.page-transition-enter.page-transition-active .page-transition-content {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {

	.page-transition-content,
	#article-loading-overlay,
	#article-loading-overlay .overlay-content {
		transition: none !important;
		animation: none !important;
	}
}

/* 12. 模态框和下拉菜单动�?*/
.modal {
	transition: opacity var(--animation-normal) var(--ease-standard);
}

.modal.show {
	opacity: 1;
}

.modal-dialog {
	transition: transform var(--animation-normal) var(--ease-emphasized-decelerate), opacity var(--animation-normal) var(--ease-standard);
	transform: scale(0.9) translateY(-20px);
	opacity: 0;
}

.modal.show .modal-dialog {
	transform: scale(1) translateY(0);
	opacity: 1;
}

@media screen and (max-width: 900px) {
	.modal-dialog.modal-bottom {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0;
		transform: translateY(100%);
		border-radius: 20px 20px 0 0;
	}

	.modal.show .modal-dialog.modal-bottom {
		transform: translateY(0);
	}
}

.dropdown-menu {
	opacity: 0;
	transform: translateY(-10px) scale(0.95);
	transform-origin: top center;
	transition: opacity var(--animation-fast) var(--ease-standard), transform var(--animation-fast) var(--ease-emphasized-decelerate), visibility var(--animation-fast);
	visibility: hidden;
}

.dropdown-menu.show {
	opacity: 1;
	transform: translateY(0) scale(1);
	visibility: visible;
}

.dropdown-item {
	transition: background var(--animation-fast) var(--ease-standard), color var(--animation-fast) var(--ease-standard);
}

/* 13. 工具提示、标签、分页动�?*/
.tooltip {
	opacity: 0;
	transform: translateY(5px);
	transition: opacity var(--animation-fast) var(--ease-standard), transform var(--animation-fast) var(--ease-emphasized-decelerate);
}

.tooltip.show {
	opacity: 1;
	transform: translateY(0);
}

.badge,
.tag {
	transition: background var(--animation-fast) var(--ease-standard);
}

.badge:active,
.tag:active {
	transform: scale(0.95);
}

.pagination .page-link {
	transition: all var(--animation-fast) var(--ease-standard);
}

.pagination .page-link:active {
	transform: scale(0.95);
}

/* 14. 目录导航动画 */
.index-link {
	transition: all var(--animation-fast) var(--ease-standard);
	position: relative;
}

.index-link::before {
	content: "";
	position: absolute;
	left: -8px;
	top: 50%;
	transform: translateY(-50%) scaleY(0);
	width: 3px;
	height: 60%;
	background: var(--themecolor);
	border-radius: 2px;
	transition: transform var(--animation-normal) var(--ease-spring);
}

.index-item.current>.index-link::before {
	transform: translateY(-50%) scaleY(1);
}

/* 15. 时间线动�?*/
.timeline-item {
	opacity: 0;
	transform: translateX(-20px);
	animation: modernTimelineSlideIn var(--animation-slow) var(--ease-emphasized-decelerate) forwards;
}

@keyframes modernTimelineSlideIn {
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.timeline-item:nth-child(1) {
	animation-delay: 0ms;
}

.timeline-item:nth-child(2) {
	animation-delay: 100ms;
}

.timeline-item:nth-child(3) {
	animation-delay: 200ms;
}

.timeline-item:nth-child(4) {
	animation-delay: 300ms;
}

.timeline-item:nth-child(5) {
	animation-delay: 400ms;
}

.timeline-item:nth-child(n+6) {
	animation-delay: 500ms;
}

/* 16. 友链和代码块动画 */
.friend-link-item {
	transition: box-shadow var(--animation-normal) var(--ease-standard);
}

.friend-link-avatar {
	transition: transform var(--animation-normal) var(--ease-spring);
}

.hljs-codeblock {
	transition: box-shadow var(--animation-normal) var(--ease-standard);
}

.code-copy-btn {
	opacity: 0;
	transition: opacity var(--animation-fast) var(--ease-standard), background var(--animation-fast) var(--ease-standard);
}

.hljs-codeblock:hover .code-copy-btn {
	opacity: 1;
}

/* 17. 减少动画偏好支持 */
@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.card,
	.btn,
	a {
		transition: none !important;
	}
}

/* 18. 打印样式优化 */
@media print {

	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
	}
}

/* ========== End of Modern UI Enhancements ========== */


/* ---------- Mermaid 夜间模式样式 ---------- */
html.darkmode .mermaid-container {
	background: var(--color-widgets);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* ---------- 夜间模式下的 Mermaid 错误提示 ---------- */
html.darkmode .mermaid-error-container {
	background: linear-gradient(135deg, #2d1f1f 0%, #3d2020 100%);
	border-color: #9b2c2c;
	border-left-color: #e53e3e;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

html.darkmode .mermaid-error-container:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}

html.darkmode .mermaid-error-header {
	border-bottom-color: rgba(155, 44, 44, 0.3);
}

html.darkmode .mermaid-error-title {
	color: #fc8181;
}

html.darkmode .mermaid-error-type {
	color: #feb2b2;
	background: rgba(155, 44, 44, 0.3);
}

html.darkmode .mermaid-error-message {
	color: #feb2b2;
	background: rgba(0, 0, 0, 0.3);
	border-left-color: #9b2c2c;
}

html.darkmode .mermaid-error-code summary {
	background: rgba(0, 0, 0, 0.3);
	color: #90cdf4;
}

html.darkmode .mermaid-error-code summary:hover {
	background: rgba(0, 0, 0, 0.5);
}

html.darkmode .mermaid-error-code pre {
	background: #1a202c;
	color: #cbd5e0;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5);
}


/* ==========================================================================
   Mermaid 图表样式
   ========================================================================== */

/* ---------- Mermaid 容器基础样式 ---------- */
.mermaid-container {
	background: var(--card-background);
	border-radius: var(--card-radius);
	padding: 20px;
	margin: 20px 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	position: relative;
	margin: 20px -20px;
	transition: opacity 0.3s ease-in;
}

.mermaid-container-inner {
	overflow: auto;
	transform-origin: top left;
	transition: transform 0.3s ease;
}

.mermaid-container svg {
	width: 100% !important;
	height: auto !important;
	display: block;
}

/* 缩放控制按钮 */
.mermaid-zoom-controls {
	position: absolute;
	top: 10px;
	right: 10px;
	display: flex;
	gap: 5px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(10px);
	border-radius: 6px;
	padding: 5px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

.mermaid-container:hover .mermaid-zoom-controls {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

html.darkmode .mermaid-zoom-controls {
	background: rgba(30, 30, 30, 0.85);
}

.mermaid-zoom-btn {
	width: 32px;
	height: 32px;
	border: none;
	background: transparent;
	cursor: pointer;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: #5e72e4;
	transition: all 0.2s;
}

.mermaid-zoom-btn:hover {
	background: rgba(94, 114, 228, 0.1);
}

.mermaid-zoom-btn:active {
	transform: scale(0.95);
}

.mermaid-zoom-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
	pointer-events: none;
}

.mermaid-zoom-level {
	display: flex;
	align-items: center;
	padding: 0 8px;
	font-size: 13px;
	color: #666;
	min-width: 50px;
	justify-content: center;
}

html.darkmode .mermaid-zoom-level {
	color: #aaa;
}

/* 按钮 tooltip */
.mermaid-zoom-btn[title] {
	position: relative;
}

.mermaid-zoom-btn[title]::after {
	content: attr(title);
	position: absolute;
	bottom: -35px;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.85);
	color: white;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 12px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
	z-index: 100;
}

.mermaid-zoom-btn[title]:hover::after {
	opacity: 1;
}

html.darkmode .mermaid-zoom-btn[title]::after {
	background: rgba(255, 255, 255, 0.9);
	color: #333;
}

/* ---------- 卡片内的 Mermaid 图表 ---------- */
.card .mermaid-container,
.post-card .mermaid-container,
.comment-content .mermaid-container {
	padding: 15px;
	margin: 15px -15px;
}

/* ---------- 夜间模式适配 ---------- */
html.darkmode .mermaid-container {
	background: var(--card-background-dark);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* ---------- 响应式设�?---------- */
@media screen and (max-width: 768px) {
	.mermaid-container {
		padding: 15px;
		margin: 15px -15px;
		border-radius: calc(var(--card-radius) * 0.8);
	}

	.card .mermaid-container,
	.post-card .mermaid-container,
	.comment-content .mermaid-container {
		margin: 15px -15px;
	}
}

@media screen and (max-width: 480px) {
	.mermaid-container {
		padding: 10px;
		margin: 10px -10px;
	}

	.card .mermaid-container,
	.post-card .mermaid-container,
	.comment-content .mermaid-container {
		margin: 10px -10px;
	}

	.mermaid-zoom-controls {
		top: 5px;
		right: 5px;
		padding: 3px;
	}

	.mermaid-zoom-btn {
		width: 28px;
		height: 28px;
		font-size: 16px;
	}
}

/* ---------- 打印样式 ---------- */
@media print {
	.mermaid-container {
		box-shadow: none;
		border: 1px solid #e2e8f0;
		page-break-inside: avoid;
	}

	.mermaid-error-container {
		display: none;
	}
}

/* ---------- 加载动画 ---------- */
.mermaid-container.loading {
	opacity: 0.5;
	position: relative;
}

.mermaid-container.loading::after {
	content: "正在渲染图表...";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: var(--color-text-secondary);
	font-size: 14px;
}

/* ---------- 滚动条样式（Webkit�?---------- */
.mermaid-container::-webkit-scrollbar {
	height: 8px;
}

.mermaid-container::-webkit-scrollbar-track {
	background: var(--color-background);
	border-radius: 4px;
}

.mermaid-container::-webkit-scrollbar-thumb {
	background: var(--color-border);
	border-radius: 4px;
}

.mermaid-container::-webkit-scrollbar-thumb:hover {
	background: var(--color-text-secondary);
}

html.darkmode .mermaid-container::-webkit-scrollbar-track {
	background: var(--color-background-dark);
}

html.darkmode .mermaid-container::-webkit-scrollbar-thumb {
	background: var(--color-border-dark);
}

html.darkmode .mermaid-container::-webkit-scrollbar-thumb:hover {
	background: var(--color-text-secondary-dark);
}