:root,
[data_theme=light] {
	/* color */
	--mp-gray-1: #1e1e1fff;
	--mp-gray-2: #3c3c3eff;
	--mp-gray-3: #5a5a5eff;
	--mp-gray-4: #707075ff;
	--mp-gray-5: #95959dff;
	--mp-gray-6: #b5b5baff;
	--mp-gray-7: #d4d4d9ff;
	--mp-gray-8: #f4f4f5ff;
	--mp-gray-9: #fafafaff;
	--mp-gray-1-fill: #28282aff;
	--mp-gray-1-a90: #1e1e1fe6;
	--mp-gray-1-a80: #1e1e1fcc;
	--mp-gray-1-a70: #1e1e1fb3;
	--mp-gray-1-a60: #1e1e1f99;
	--mp-gray-1-a50: #1e1e1f80;
	--mp-gray-1-a40: #1e1e1f66;
	--mp-gray-1-a30: #1e1e1f4d;
	--mp-gray-1-a20: #1e1e1f33;
	--mp-gray-1-a10: #1e1e1f1a;
	--mp-brand-1: #f74808ff;
	--mp-brand-2: #fb6c37ff;
	--mp-brand-3: #fc9069ff;
	--mp-brand-4: #fdb59bff;
	--mp-brand-5: #fedacdff;
	--mp-brand-1-click: #e14005ff;
	--mp-yellow-1: #ffc800ff;
	--mp-yellow-2: #ffd333ff;
	--mp-yellow-3: #ffe066ff;
	--mp-yellow-4: #ffec99ff;
	--mp-yellow-5: #fff7ccff;
	--mp-link-brand: #f44d10ff;
	--mp-link-brand-visited: #DD673C;
	--mp-link-normal: #0070f0ff;
	--mp-link-normal-visited: #2275D3;

	/* text */
	--mp-font-sans-serif: 'Manrope CB', 'HarmonyOS Sans SC', sans-serif;
	--mp-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--mp-font-size-title-hero: 34px;
	--mp-font-size-h1: 28px;
	--mp-font-size-h2: 26px;
	--mp-font-size-h3: 24px;
	--mp-font-size-h4: 22px;
	--mp-font-size-h5: 20px;
	--mp-font-size-h6: 18px;
	--mp-font-size-m1: 16px;
	--mp-font-size-m2: 15px;
	--mp-font-size-m3: 13px;
	--mp-font-size-m4: 12px;
	--mp-font-size-m5: 11px;
	/* h4 and larger */
	--mp-line-height-lgfontsize: 1.55em;
	--mp-letter-spacing-lgfontsize: 0.09em;
	--mp-letter-spacing-lgfontsize-bold: 0.08em;
	--mp-letter-spacing-loose-1: 0.12em;
	--mp-letter-spacing-loose-2: 0.1em;
	/* h3 and smaller */
	--mp-line-height-smfontsize: 1.6em;
	--mp-letter-spacing-smfontsize: 0.08em;
	--mp-letter-spacing-smfontsize-bold: 0.07em;

	/* motion */
	--mp-easeinout-std: cubic-bezier(0.6, 0, 0.4, 1);
	--mp-easein-std-nearby: cubic-bezier(0.65, 0, 0.45, 0.96);
	--mp-easeout-std-nearby: cubic-bezier(0.55, 0.04, 0.35, 1);
	--mp-easein-std-faraway: cubic-bezier(0.65, 0, 0.7, 0.85);
	--mp-easeout-std-faraway: cubic-bezier(0.3, 0.15, 0.35, 1);
	--mp-easeinout-fast: cubic-bezier(0.6, 0.14, 0.4, 0.86);
	--mp-easein-fast-nearby: cubic-bezier(0.65, 0.1, 0.45, 0.82);
	--mp-easeout-fast-nearby: cubic-bezier(0.55, 0.18, 0.35, 0.9);
	--mp-easein-fast-faraway: cubic-bezier(0.65, 0.1, 0.7, 0.71);
	--mp-easeout-fast-faraway: cubic-bezier(0.3, 0.29, 0.35, 0.85);
	--mp-duration-fast-1: 0.09s;
	--mp-duration-fast-2: 0.11s;
	--mp-duration-fast-3: 0.15s;
	--mp-duration-fast-4: 0.19s;
	--mp-duration-moderate-1: 0.24s;
	--mp-duration-moderate-2: 0.28s;
	--mp-duration-moderate-3: 0.32s;
	--mp-duration-slow-1: 0.4s;
	--mp-duration-slow-2: 0.7s;

	/* custom */
	--background-color: #ffffff;
}

body {
	background-color: var(--background-color);
	overscroll-behavior-x: none;
}
* {
	font-optical-sizing: auto;
	font-family: var(--mp-font-sans-serif);
	line-height: var(--mp-line-height-smfontsize);
	font-size: var(--mp-font-size-m1);
	letter-spacing: var(--mp-letter-spacing-smfontsize);
}

@media (max-width: 767.98px) {
	body {
		overscroll-behavior-x: none;
	}
	
}

.border-bottom {
	border-bottom: 1px solid var(--mp-gray-7) !important;
}
.py-2-5 {
	padding-top: .4rem;
	padding-bottom: .4rem;
}
.nav-shrink .py-2-5 {
	padding-top: .5rem;
	padding-bottom: .5rem;
}

.pl-1px{
	padding-left: 1.5px;
}

.pr-1px{
	padding-right: 1.5px;
}

@media (min-width: 768px) and (max-width: 1399.98px) {
	.mt-md-4-5 {
	  margin-top: 2rem !important;
	}
	.mb-md-4-5 {
		margin-bottom: 1.75rem !important;
	}
  }

@media (min-width: 1400px) {
	.col-xxl-7-5 {
	  flex: 0 0 auto;
	  width: 61.8%;
	}
	.mt-xxl-4-5 {
		margin-top: 3rem !important;
	  }
	.mb-xxl-4-5 {
		margin-bottom: 2.75rem !important;
	}
  }

/* navbar */


nav {
	background-color: var(--background-color);
	transition: margin-top 0s, top var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby), margin-bottom 0s,padding-top var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby) ,padding-bottom var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby), height var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby) ,background-color var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby) ,backdrop-filter var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby) !important;
}

/* 导航栏展开动画 */
.navbar, .navbar * {
	transition: all var(--mp-duration-moderate-2) var(--mp-easeout-fast-nearby) !important;
}

/* 导航栏收起动画 */
.nav-shrink, .nav-shrink * {
	transition: all var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) !important;
}
.nav-container {
	/* 导航栏切换动画 */
	transition: all var(--mp-duration-moderate-2) var(--mp-easeinout-std) !important;
}

#nav-placeholder {
	height: 92px;
	display: none;
	transition: all 0s !important;
}

.nav-init {
	height: 92px;
}

.nav-index-my.nav-init, .nav-index-my .nav-init {
	height: 73px;
}

.nav-index-my{
	margin-top: 1rem;
	margin-bottom: 1rem ;
}
@media (min-width: 768px) and (max-width: 1399.98px) {
	.nav-index-my {
	  margin-top: 2.45rem !important;
	  margin-bottom: 1.85rem !important;
	}
	.nav-index-my.nav-init, .nav-index-my .nav-init {
		height: 92px;
	}
  }
@media (min-width: 1400px) {
	.nav-index-my {
		margin-top: 2.8rem !important;
		margin-bottom: 2.15rem !important;
	}
	.nav-index-my.nav-init, .nav-index-my .nav-init {
		height: 96px;
	}
}

.nav-blur-effect{
	/* background:linear-gradient(hsla(0, 0%, 100%, 0.94),hsla(0, 0%, 100%, 0.9)); */
	background-color: hsla(0, 0%, 100%, 0.93);
	backdrop-filter: blur(20px) brightness(1.1) saturate(1.8);
	overflow: hidden;
	position: fixed;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	transition: margin-top 0s, top 0s, margin-bottom 0s,padding-top var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) ,padding-bottom var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby), height var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) ,background-color var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) ,backdrop-filter var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) !important;
}
.nav-blur-effect::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: var(--mp-gray-1-a10);
}

/* 如果左上角为文字 */
.navbar-brand {
	font-weight: bold;
	font-size: var(--mp-font-size-h1);
	letter-spacing: var(--mp-letter-spacing-lgfontsize-bold);
	line-height: var(--mp-line-height-lgfontsize);
	height: 100%;
	color: var(--mp-gray-1)
}

/* logo动画 */
@keyframes moveLeftAndDisappear {
    0% {
      transform: translateX(0);
      opacity: 1;
    }
    100% {
      transform: translateX(-20px); /* 向左移动 100px */
      opacity: 0; /* 完全透明 */
    }
  }
@keyframes moveRightAndAppear {
	0% {
	  transform: translateX(-20px); /* 向左移动 100px */
	  opacity: 0; /* 完全透明 */
	}
	100% {
	  transform: translateX(0);
	  opacity: 1;
	}
}

/* 未收缩 */
.navbar-brand:hover .cls-1 {
	animation: moveRightAndAppear var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) forwards;
}
.navbar-brand:hover .cls-2 {
    transform: rotate(-1.5deg) scale(1.06) translateX(-1.5px);
    transform-origin: 45.97px 46.06px; /* 设置旋转中心为 SVG 的中心 */
	fill: hsl(16, 94%, 53%);
}
.navbar-brand:not(:hover) .cls-1 {
	animation: moveLeftAndDisappear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
}
.navbar-brand:active {
    transform: scale(0.97);
    transform-origin: 45.97px 46.06px; /* 设置旋转中心为 SVG 的中心 */
	transition-duration: var(--mp-duration-fast-1) !important;
}
.navbar-brand .cls-1 {
	animation: moveRightAndAppear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
}
.navbar-brand:active .cls-2 {
	fill: hsl(16, 96%, 47%);
	transition-duration: var(--mp-duration-fast-1) !important;
}


.navbar-brand .cls-1-index {
	animation: moveRightAndAppear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
}
.navbar-brand:hover .cls-1-index {
	fill: hsl(240, 3%, 34%);
}
.navbar-brand:hover .cls-2-index {
	fill: hsl(16, 94%, 53%);
}

.navbar-brand:has(.cls-1-index):hover{
	transform: scale(1.02);
}
.navbar-brand:has(.cls-1-index):active {
    transform: scale(0.97);
    transform-origin: 45.97px 46.06px; /* 设置旋转中心为 SVG 的中心 */
	transition-duration: var(--mp-duration-fast-1) !important;
}

.navbar-brand:active .cls-2-index {
	fill: hsl(16, 96%, 47%);
	transition-duration: var(--mp-duration-fast-1) !important;
}


/* 收缩时 */
.nav-shrink .navbar-brand:active {
    transform: none !important;
}
.nav-shrink .navbar-brand:hover .cls-2 {
    transform: none;
}
/* .nav-shrink .navbar-brand:hover .cls-1 {
	animation: moveLeftAndDisappear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
}
.nav-shrink .navbar-brand:not(:hover) .cls-1 {
	animation: moveLeftAndDisappear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
} */

.nav-shrink .navbar-brand .cls-1 {
	animation: moveLeftAndDisappear var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) forwards;
}

.nav-shrink .navbar-brand .cls-2 {
	/* fill: var(--mp-gray-1-a40); */
	fill: var(--mp-brand-1);
}

.nav-shrink .navbar-brand:hover .cls-2 {
	fill: var(--mp-brand-2);
	transition-duration: var(--mp-duration-fast-2) !important;
}
.nav-shrink .navbar-brand:active .cls-2 {
	fill: var(--mp-brand-1-click);
	transition-duration: var(--mp-duration-fast-1) !important;
}





.nav-shrink .navbar-brand:has(.cls-1-index):active {
    transform: none;
}
.nav-shrink .navbar-brand:has(.cls-1-index):hover {
    transform: none;
}


.nav-shrink .navbar-brand .cls-1-index {
	animation: moveLeftAndDisappear var(--mp-duration-moderate-1) var(--mp-easeinout-fast) forwards;
}

.nav-shrink .navbar-brand .cls-2-index {
	fill: var(--mp-brand-1);
}

.nav-shrink .navbar-brand:hover .cls-2-index {
	fill: var(--mp-brand-2);
	transition-duration: var(--mp-duration-fast-2) !important;
}
.nav-shrink .navbar-brand:active .cls-2-index {
	fill: var(--mp-brand-1-click);
	transition-duration: var(--mp-duration-fast-1) !important;
}

@media (max-width: 767.98px) {
	.navbar-brand:active {
		transform: none !important;
	}
	.navbar-brand:hover {
		transform: none !important;
	}
	.navbar-brand:hover .cls-2 {
		transform: none;
	}
	.navbar-brand:hover .cls-1 {
		animation: moveLeftAndDisappear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
	}
	.navbar-brand:not(:hover) .cls-1 {
		animation: moveLeftAndDisappear var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby) forwards;
	}
	
	.navbar-brand .cls-1 {
		animation: moveLeftAndDisappear var(--mp-duration-moderate-2) var(--mp-easein-fast-nearby) forwards;
	}
	
	.navbar-brand .cls-2 {
		/* fill: var(--mp-gray-1-a40); */
		fill: var(--mp-brand-1);
	}
	
	.navbar-brand:hover .cls-2 {
		fill: var(--mp-brand-2);
		transition-duration: var(--mp-duration-fast-2) !important;
	}
	.navbar-brand:active .cls-2 {
		fill: var(--mp-brand-1-click);
		transition-duration: var(--mp-duration-fast-1) !important;
	}
	
}
.no-init-animation *{
	animation: none !important;
}

/* 右侧导航栏 */
.nav-link {
	letter-spacing: var(--mp-letter-spacing-loose-1) !important;
	font-size: 1.2rem;
	font-optical-sizing: auto;
	font-weight: normal;
	font-style: normal;
	color: var(--mp-gray-3);
	text-align: center;
}

#navbarCollapse .nav-link{
	margin-bottom: 5px;
}
.nav-link:hover {
	color: hsl(240, 3%, 50%) !important;
	color: var(--mp-brand-1) !important;
	transition-duration: var(--mp-duration-fast-2) !important;
}
.nav-link:active {
	color: var(--mp-gray-2) !important;
	color: var(--mp-brand-1-click) !important;
	transform: scale(0.98);
	transition-duration: var(--mp-duration-fast-2) !important;
}

/* 导航栏收缩时导航字号 */
.nav-shrink .nav-link {
	font-size: 1rem;
}

.navbar-toggler {
	border: 0;
}
.navbar-toggler-right {
	right: 0rem;
}

.nav-shrink {
	height: 60px !important;
	padding-top: 0.3rem !important;
	padding-bottom: 0.3rem !important;
}

.nav-switch{
	top: -60px !important;
}

.nav-unfold {
	top:0 !important;
	height: 200px !important;
}

.nav-unfold:not(.nav-shrink) {
	top:0 !important;
	height: 230px !important;
}
@media (max-width: 767.98px) {
	.nav-link {
		font-size: 1.1rem !important;
	}
	
}

/* 第二个导航栏（文章标题） */
#nav-post-second {
	display: none;
}

.nav-blur-effect #nav-post-second {
	display: flex;
}

.nav-unfold #nav-post-second {
	display: none;
}
/* 左侧标题 */
.navbar-post-title{
	font-size: var(--mp-font-size-h4);
	letter-spacing: var(--mp-letter-spacing-lgfontsize);
	font-weight: 500;
	font-style: normal;
	color: var(--mp-gray-1);
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	padding-left: 1px;
	padding-right: 1px;
	flex-shrink: 0;
}

.navbar-post-subtitle{
	font-size: var(--mp-font-size-h6);
	font-weight: normal;
	font-style: normal;
	color: var(--mp-gray-3);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	flex-grow: 1;
}

.navbar-post-year{
	font-size: var(--mp-font-size-m1);
	font-weight: 350;
	letter-spacing: var(--mp-letter-spacing-loose-1);
	font-style: normal;
	color: var(--mp-gray-5);
	text-align: right;
}

@media (min-width: 768px){
	.nav-index-px{
		padding-left: 3.55rem !important;
		padding-right: 3.55rem !important;
	}
}

/* 移动端导航栏 */
@media (max-width: 767.98px) {
	#nav-placeholder {
		height: 75px;
		display: none;
	}
	.nav-init {
		height: 73px;
	}

	.nav-shrink {
		height: 50px !important;
		padding-top: 0.2rem !important;
		padding-bottom: 0.2rem !important;
	}
	.nav-switch{
		top: -50px !important;
	}
	.navbar-post-title{
		text-overflow:clip;
		font-size: var(--mp-font-size-h6);
		letter-spacing: var(--mp-letter-spacing-smfontsize);
	}
	.navbar-post-subtitle{
		font-size: var(--mp-font-size-m1);
	}
	.navbar-post-year{
		font-size: var(--mp-font-size-m2);
	}
	.nav-unfold {
		top:0 !important;
		height: 215px !important;
	}
}


/* post 页面-标题块 */

.project-img {
	width: 100%;
	display: block;
	object-fit: cover;
	color: transparent;
}

.project-gallery-container{
	transition: all var(--mp-duration-moderate-2) var(--mp-easeout-std-nearby);
}

.page-title {
	font-size: var(--mp-font-size-h2);
	font-weight: 500;
	color:var(--mp-gray-2);
	text-align: left;
  	letter-spacing: var(--mp-letter-spacing-loose-2);
	line-height: var(--mp-line-height-lgfontsize);
}
.page-subtitle {
	font-size: var(--mp-font-size-h6);
	font-weight: 400;
	color: var(--mp-gray-4);
	text-align: left;
	width: 100%;
	letter-spacing: var(--mp-letter-spacing-loose-2);
}

.page-intro {
	font-size: var(--mp-font-size-m1);
	font-weight: 300;
	color: var(--mp-gray-4);
	text-align: justify;
	text-justify: inter-character;
	width: 100%;
	letter-spacing: var(--mp-letter-spacing-lgfontsize);
	line-height: var(--mp-line-height-smfontsize);
}

.page-info-title {
	font-size: var(--mp-font-size-m1);
	font-weight: 400;
	color: var(--mp-gray-3);
	text-align: left;
	width: 100%;
	letter-spacing: var(--mp-letter-spacing-loose-2);
	line-height: 1.6rem;
}

.page-intro br {
	margin-bottom: 0.3rem; /* 如果有 <br>，设置其下方的间距 */
	display: block; /* 使 <br> 占据一行 */
	content: ""; /* 适配部分浏览器 */
  }

.page-info {
	font-size: var(--mp-font-size-m1);
	font-weight: 300;
	color: var(--mp-gray-4);
	text-align: right;
	width: 100%;
	line-height: 1.6rem;
	letter-spacing: var(--mp-letter-spacing-loose-2);
	text-overflow: ellipsis;
	overflow: hidden;
}

.page-authors-key-text {
	font-size: var(--mp-font-size-m3);
	font-weight: 400;
	color: var(--mp-gray-5);
	text-align: left;
	width: 100%;
	line-height: 1.3rem;
	letter-spacing: var(--mp-letter-spacing-loose-2);
}

.page-authors-value-text {
	font-size: var(--mp-font-size-m2);
	font-weight: 300;
	color: var(--mp-gray-4);
	text-align: right;
	width: 100%;
	line-height: 1.3rem;
	letter-spacing: var(--mp-letter-spacing-loose-2);
	text-overflow: ellipsis;
	overflow: hidden;
}

@media (max-width: 767.98px) {
	.page-title {
		font-size: var(--mp-font-size-h4);
	}
	.page-subtitle {
		font-size: var(--mp-font-size-h6);
	}
	.page-intro {
		font-size: var(--mp-font-size-m2);
	}
	.page-info-title {
		font-size: var(--mp-font-size-m2);
	}
	.page-info {
		font-size: var(--mp-font-size-m2);
	}
	.page-authors-key-text {
		font-size: var(--mp-font-size-m3);
	}
	.page-authors-value-text {
		font-size: var(--mp-font-size-m2);
	}
	
}

#infoCollapse{
	display: flex;
}
#infoCollapse.collapse:not(.show) {
	display: none;
}

/* 右侧作品信息动效: before/分割线 after/背景 */
.info-item{
	position: relative;
	align-items: center;
}
@media (max-width: 991.98px) {
	.info-item{
		height: 36px;
	}
	
}

.info-item::after {
	content: " ";
	position: absolute;
	top: 2.5%;
	left: 2.5%;
	width: 95%;
	height: 95%;
	background: none;
	z-index: -1;
	border-radius: 5px;
	transition: all var(--mp-duration-moderate-2) var(--mp-easeinout-std);
  }

.info-item:not(:first-child):before {
	content: " ";
	position: absolute;
	top: -0.3px;
	left: 0;
	width: 100%;
	height: 0.6px;
	background-color: var(--mp-gray-7);
	z-index: 1;
	transition: all var(--mp-duration-moderate-2) var(--mp-easeinout-std);
	transform: translateZ(0);
  }

.info-item:hover::before, .info-item:hover+.info-item::before {
	content: " ";
	position: absolute;
	top: -0.3px;
	left: 2.5%;
	width: 95%;
	height: .6px;
	background: none;
	z-index: 1;
	transition: all var(--mp-duration-fast-3) var(--mp-easeinout-fast);
  }

.info-item:hover::after {
	content: " ";
	position: absolute;
	top: -5%;
	left: -2%;
	width: 104%;
	height: 110%;
	background-color: var(--mp-gray-9);
	z-index: -1;
	border-radius: 5px;
	transition: all var(--mp-duration-fast-3) var(--mp-easeinout-fast);
  }

/* 作者下拉菜单项动效 */
.info-dropdown-item{
	position: relative;
	align-items: first baseline;
}
.page-authors-value-text br {
	margin-bottom: 0.2rem;
  }

.info-dropdown-item::after {
	content: " ";
	position: absolute;
	top: 2.5%;
	left: 2.5%;
	width: 95%;
	height: 95%;
	background-color: none;
	z-index: -1;
	border-radius: 5px;
	transition: all var(--mp-duration-moderate-2) var(--mp-easeinout-std);
  }

.info-dropdown-item:not(:first-child)::before {
	content: " ";
	position: absolute;
	top: -0.25px;
	left: 0;
	width: 100%;
	height: 0.5px;
	background-color: var(--mp-gray-8);
	z-index: 1;
	transition: all var(--mp-duration-moderate-2) var(--mp-easeinout-std);
	transform: translateZ(0);
  }

.info-dropdown-item:hover::before, .info-dropdown-item:hover+.info-dropdown-item::before {
	content: " ";
	position: absolute;
	top: -0.25px;
	left: 2.5%;
	width: 95%;
	height: 0.5px;
	background: none;
	z-index: 1;
	transition: all var(--mp-duration-fast-3) var(--mp-easeinout-fast);
  }

.info-dropdown-item:hover::after {
	content: " ";
	position: absolute;
	top: -5%;
	left: -2%;
	width: 104%;
	height: 110%;
	background-color: rgba(250, 250, 250, 0.6);
	z-index: -1;
	border-radius: 5px;
	transition: all var(--mp-duration-fast-3) var(--mp-easeinout-fast);
  }


@media (max-width: 991.98px) {
	.info-dropdown-item{
		min-height: 32px;
	}
	.page-authors-value-text br {
		display: none;
	  }
}
/* 下拉菜单按钮 */
.info-item.info-dropdown-button:active::after {
	content: " ";
	position: absolute;
	top: -4.5%;
	left: -1.5%;
	width: 103%;
	height: 109%;
	background-color: var(--mp-gray-8);
	z-index: -1;
	border-radius: 8px;
	transition: all var(--mp-duration-fast-1) var(--mp-easeinout-fast);
  }
.info-dropdown-arrow {
	fill: var(--mp-gray-7);
	height: 24px;
	width: 24px;
	transform-style: preserve-3d;
	transform: rotateX(180deg);
	transition: fill var(--mp-duration-moderate-2) var(--mp-easeinout-std), transform .6s var(--mp-easein-std-faraway);
}

.info-item:hover .info-dropdown-arrow {
	fill: var(--mp-gray-5);
	transition: fill var(--mp-duration-fast-3) var(--mp-easeinout-fast), transform .6s var(--mp-easein-std-faraway);
}

.info-item:active .info-dropdown-arrow {
	fill: var(--mp-gray-4);
}

.collapsed .info-dropdown-arrow {
	transform: rotateX(0deg);
}

/* 上一个/下一个按钮 */

.prev-arrow, .next-arrow {
	will-change: transform, stroke;
	stroke: var(--mp-gray-7);
	stroke-opacity: 1;
	stroke-width: 1.7px;
	fill: none;
	transform: translateZ(0);
	transition: all var(--mp-duration-moderate-1) var(--mp-easeout-std-nearby);
}

.prev-arrow{
	margin-right: 12px;
}

.next-arrow{
	margin-left: 12px;
}

.page-prev-next-button:hover .prev-arrow{
	transform: translateX(-2px);
	stroke: var(--mp-brand-1);
}

.page-prev-next-button:hover .next-arrow{
	transform: translateX(2px);
	stroke: var(--mp-brand-1);
}

.page-prev-next-button{
	flex:0 1 auto;
	min-width: 10%;
	max-width: 45%;
	text-decoration: none !important;
}

.prev-next-content {
	letter-spacing: var(--mp-letter-spacing-smfontsize);
	width: 90% !important;
}

.page-prev-next-button:active{
	transform: scale(0.99);
	transition-duration: var(--mp-duration-fast-1) !important;
}

.page-prev-next-button:active .next-arrow, .page-prev-next-button:active .prev-arrow{
	stroke: var(--mp-brand-1-click);
	transition-duration: var(--mp-duration-fast-1) !important;
}

.prev-next-title {
	padding-left: 1px;
	font-size: var(--mp-font-size-h6);
	font-weight: 500;
	line-height: 1.5em;
	color: var(--mp-gray-3);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.prev-next-subtitle {
	font-size: var(--mp-font-size-m2);
	font-weight: 300;
	line-height: 1.2em;
	color: var(--mp-gray-3);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.page-prev-next-button:hover .prev-next-title, .page-prev-next-button:hover .prev-next-subtitle{
	color: var(--mp-gray-2);
}

.my-prev-next{
	margin-top: .5rem;
	margin-bottom: 1.3rem;
}

@media (max-width: 767.98px) {
	.prev-next-title {
		font-size: var(--mp-font-size-m1);
	}
	.prev-next-subtitle {
		font-size: var(--mp-font-size-m3);
	}

	
}

/* footer */
.footer-container{
	margin-top: 4rem;
	gap: 20px;
}

.footer-item{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 22px;
	font-size: var(--mp-font-size-m4);
	font-weight: 300;
	color: var(--mp-gray-5);
	letter-spacing: var(--mp-letter-spacing-loose-2);
	gap: 3px;
}

.footer-item *{
	font-size: var(--mp-font-size-m4);
	font-weight: 300;
	color: var(--mp-gray-5);
	text-decoration: none;
	letter-spacing: var(--mp-letter-spacing-loose-2);
}

.footer-item a{
	justify-items: center;
	fill: var(--mp-gray-5);
	color: var(--mp-gray-5);
	transition: all var(--mp-duration-fast-3) var(--mp-easeout-fast-nearby);
}

.footer-item a:hover{
	fill: var(--mp-brand-1);
	color: var(--mp-brand-1);
	text-decoration: underline;
}

.footer-item a:active{
	fill: var(--mp-brand-1-click);
	color: var(--mp-brand-1-click);
	text-decoration: underline;
	transition-duration: var(--mp-duration-fast-1) !important;
}


@media (max-width: 767.98px) {
	.footer-container{
		flex-direction: column;
	}
	.footer-item{
		flex-direction: column;
	}
	.footer-item *{
		font-size: var(--mp-font-size-m5);
	}
	
}














form {
	max-width: 500px;
	margin: 0 auto;
}

button {
	position: relative;
  padding: 8px 12px 8px 12px;
  border: solid var(--mp-gray-7) 2px;
  text-decoration: none;
}

button:focus{
	box-shadow: none !important;
}

button::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	border-radius: inherit;
	transition: background-color var(--mp-duration-fast-2) var(--mp-easeinout-fast);
	background-color: transparent;
	text-decoration: none;
  }

button:hover::before {
	background-color: hsla(240, 2%, 12%, 0.03);
}


button:active::before {
	background-color: hsla(240, 2%, 12%, 0.1);
}

input, textarea {
	font-size: 0.8rem;
  border: 1px solid #ddd;
  background: #fff;
  padding: 0.5rem 0.7rem;
	margin: 5px 0;
  transition: all 0.3s ease-in-out;
  width: 100%;

}

input:focus, textarea:focus {
  border-color: #777;
  outline: none;
}



h1, h2, h3 {
	font-family: 'Crimson Text', sans-serif;
	letter-spacing: 1px;
	font-weight: 300;
	margin-bottom: 20px;
	display: flex;
}




/* index */

.index-card-mx{
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	margin-bottom: -1.5rem;
}

.index-card-container {
	margin-bottom: 1.3rem; /* 或者使用任何你需要的浮点数 */
	padding-left: 0.6rem;
	padding-right: 0.6rem;
	transform: none;
  }

.index-card-item {
	width: 100%;
	position: relative;
	aspect-ratio: 16/9;
	background-color: var(--mp-gray-9);
	float: left;
	overflow: hidden;
	position: relative;
	/* text-align: center; */
	border-radius: 12px;
	filter: none;
	transition: border-radius var(--mp-duration-slow-2) var(--mp-easeout-fast-faraway), filter var(--mp-duration-fast-2) var(--mp-easeout-fast-nearby);
	display: block;
  }

.index-card-item:hover {
border-radius: 7px;
transition: border-radius var(--mp-duration-fast-4) var(--mp-easeinout-fast);
}

.index-card-item:active{
border-radius: 12px;
transform: scale(0.99);
filter: contrast(0.9);
transition: border-radius var(--mp-duration-fast-1) var(--mp-easein-fast-nearby), transform var(--mp-duration-fast-1) var(--mp-easein-fast-nearby), filter var(--mp-duration-fast-1) var(--mp-easein-fast-nearby);
}
  /* .index-card-container:hover{
	transform: scale(1.015);	
	transition: transform 0.2s ease-out;
} */
  /* .index-card-item::before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: .5px solid var(--mp-gray-1-a10);
	border-radius: inherit;
	transition: border .2s ease-in;
	z-index: 1;
	pointer-events: none;
  }
  .index-card-item:hover::before{
	border:1px solid var(--mp-gray-1-a20);
	transition: border .5s ease-out;
  } */

.index-card-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	color: transparent;
	transition: filter var(--mp-duration-slow-1) var(--mp-easeinout-fast), opacity .38s var(--mp-easeinout-fast), transform var(--mp-duration-slow-2) var(--mp-easeout-fast-faraway);
}
  
  .index-card-item:hover .index-card-img {
	  opacity: 0.2;
	  transform: scale(1.04);
	  filter: blur(12px) saturate(1.2) brightness(0.95);
	  transition: transform var(--mp-duration-fast-4) var(--mp-easeinout-fast), opacity var(--mp-duration-fast-4) var(--mp-easeinout-fast), filter var(--mp-duration-moderate-3) var(--mp-easein-std-nearby);
  }



.index-card-item .index-card-overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
}

.index-card-item .overlay-title {
	font-size: var(--mp-font-size-h3);
	font-weight: 600;
	color: var(--mp-gray-1-a80);
	text-align: center;
	opacity: 0;
	line-height: 1.5em;
	max-width: 90%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	letter-spacing: var(--mp-letter-spacing-lgfontsize-bold);
	transition: opacity var(--mp-duration-fast-4) var(--mp-easeinout-fast);
}

.index-card-item:hover .overlay-title {
	opacity: 1;
	transition: opacity var(--mp-duration-fast-4) var(--mp-easein-fast-nearby);
}

.index-card-item .overlay-subtitle {
	font-size: var(--mp-font-size-h5);
	font-weight: 400;
	color: var(--mp-gray-1-a50);
	line-height: 1.35em;
	max-width: 90%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: center;
	opacity: 0;
	transition: opacity var(--mp-duration-fast-4) var(--mp-easeinout-fast);
}

.index-card-item:hover .overlay-subtitle {
	opacity: 1;
	transition: opacity var(--mp-duration-fast-4) var(--mp-easein-fast-nearby);
}

.overlay-year {
	letter-spacing: var(--mp-letter-spacing-loose-2);
	font-weight: 350 !important;
	line-height: 1.4em !important;
}



@media (min-width: 576px) and (max-width: 767.98px) {
	.index-card-mx{
		margin-left: 1rem;
		margin-right: 1rem;
	}
}

@media (min-width: 768px){
	.index-card-mx{
		margin-left: 1.85rem;
		margin-right: 1.85rem;
	}
}

@media (max-width: 767.98px) {
	#mobile-content {
	  display: block;
	}
	#desktop-content {
	  display: none;
	}
	.index-card-container {
		margin-bottom: 0.8rem; /* 或者使用任何你需要的浮点数 */
	}
	.index-card-item .index-card-overlay {
		display: none !important;
	}

	.index-card-item {
		width: 100%;
		height: 100%;
		border-radius: 16px;
		transition: border-radius var(--mp-duration-slow-2) var(--mp-easeout-fast-faraway), filter var(--mp-duration-moderate-3) var(--mp-easeinout-fast);
	}
	.index-card-item:hover {
		border-radius: 13px;
		filter: contrast(1.1);
		transition: border-radius var(--mp-duration-fast-4) var(--mp-easeinout-fast), filter var(--mp-duration-fast-4) var(--mp-easeinout-fast);
	}

	.index-card-item:hover .index-card-img{
		opacity: 1;
		transform: scale(1);
		filter: none;
	}
	
	.index-card-item:active{
		border-radius: 20px;
		transform: scale(0.99);
		filter: contrast(0.9);
		transition: border-radius var(--mp-duration-fast-2) var(--mp-easein-fast-faraway), transform var(--mp-duration-fast-2) var(--mp-easein-fast-faraway), filter var(--mp-duration-fast-2) var(--mp-easein-fast-faraway);
	}
	
  }

  
@media (min-width: 768px) {
	#mobile-content {
	  display: none;
	}
	#desktop-content {
	  display: block;
	}

  }


.index-mobile-title {
	letter-spacing: var(--mp-letter-spacing-lgfontsize);
	font-size: var(--mp-font-size-h6);
	font-weight: 500;
	text-align: left;
	color: var(--mp-gray-3);
}

.index-mobile-year {
	letter-spacing: var(--mp-letter-spacing-loose-2);
	font-size: var(--mp-font-size-m2);
	font-weight: 350;
	text-align: right;
	padding-top: 2.3px;
	color: var(--mp-gray-4);
}

.index-mobile-subtitle {
	letter-spacing: var(--mp-letter-spacing-lgfontsize);
	font-size: var(--mp-font-size-m2);
	font-weight: 300;
	text-align: left;
	color: var(--mp-gray-4);
}

/* page */


.portfolio-content {
	color: var(--mp-gray-3);
}

.portfolio-content iframe {
	width: 100%;
	aspect-ratio: 16/9;
	border-radius: 0.5rem;
}

.portfolio-content br {
	margin-bottom: 0.7rem; /* 如果有 <br>，设置其下方的间距 */
	display: block; /* 使 <br> 占据一行 */
	content: ""; /* 适配部分浏览器 */
  }

.project-gallery-container.lazy-container{
	position: relative;
	overflow: hidden;
	background: var(--mp-gray-9);
	display: block;
	aspect-ratio: 16/9;
	border-radius: 0.7rem;
}

.portfolio-content .lazy-container{
	margin-bottom: 1.3rem;
	border-radius: 0.5rem;
	max-width: 100%;
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--mp-gray-9);
	aspect-ratio: 16/9;
}
.portfolio-content video{
	margin-top: 0.3rem;
	margin-bottom: 0.7rem;
	border-radius: 0.5rem;
}



.lg-counter{
	color:#fff
}

@media (min-width: 768px) {
	.portfolio-content p {
		margin-top: 0;
		margin-bottom: 1rem;
		width: 100%;
	}
}
/* lazyload */
  
  /* 初始模糊状态 */
  .lazy-container .lazy-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: blur(20px);
	transform: scale(1.03);
	transform-origin: center;
	color: transparent;
  }
  .project-gallery-container .lazy-img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: none;
	transform: none;
	transform-origin: center;
  }
  
  /* 加载完成状态 */
  .lazy-img.loaded {
	filter: blur(0);
	transform: scale(1);
	transition: filter var(--mp-duration-moderate-2) var(--mp-easeout-std-nearby), transform var(--mp-duration-slow-1) var(--mp-easeout-std-nearby);
  }
  .lazy-container:has(.lazy-img.img-error)::before {
	content: ""; /* 必须属性 */
	position: absolute;
	bottom: 12px;
	right: 12px;
	width: 40px;  /* 图标尺寸 */
	height: 40px;
	
	/* 使用 Base64 嵌入 SVG 图标（示例为破碎图标） */
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiBmaWxsPSIjZmZmZmZmIj48cGF0aCBkPSJNMjEyLjMxLTE0MFExODItMTQwIDE2MS0xNjFxLTIxLTIxLTIxLTUxLjMxdi01MzUuMzhRMTQwLTc3OCAxNjEtNzk5cTIxLTIxIDUxLjMxLTIxaDUzNS4zOFE3NzgtODIwIDc5OS03OTlxMjEgMjEgMjEgNTEuMzF2NTM1LjM4UTgyMC0xODIgNzk5LTE2MXEtMjEgMjEtNTEuMzEgMjFIMjEyLjMxWk0yNDAtNDQyLjc3bDE2MC0xNjAgMTYwIDE2MCAxNjAtMTYwIDQwIDQwdi0xODQuOTJxMC01LjM5LTMuNDYtOC44NXQtOC44NS0zLjQ2SDIxMi4zMXEtNS4zOSAwLTguODUgMy40NnQtMy40NiA4Ljg1djI2NC45Mmw0MCA0MFpNMjEyLjMxLTIwMGg1MzUuMzhxNS4zOSAwIDguODUtMy40NnQzLjQ2LTguODV2LTI2NS41NGwtNDAtNDAtMTYwIDE2MC0xNjAtMTYwLTE2MCAxNjAtNDAtNDB2MTg1LjU0cTAgNS4zOSAzLjQ2IDguODV0OC44NSAzLjQ2Wk0yMDAtMjAwdi0yNzcuODUgNjBWLTc2MC0yMDBaIi8+PC9zdmc+');
	
	/* 添加阴影 */
	filter: drop-shadow(0px 0px 2px var(--mp-gray-1-a50));
	z-index: 1;
  }

@media (max-width: 991.98px) {
	.portfolio-content .lazy-container{
		margin-bottom: 0.7rem;
	}
}