/**
 * 留言板模板：欢迎语区域（浅色 / 深色）
 * 注意：深色模式下区块编辑器常给 .wp-block-group 白底，若再继承全站浅色字会看不见，须统一字色并去掉内层背景。
 */

.document-board-welcome {
	--dbw-fg: #1a1a1a;
	--dbw-fg-muted: rgba(28, 28, 30, 0.58);
	--dbw-fg-body: #2d3748;
	--dbw-fg-soft: var(--dbw-fg-body);
	--dbw-card-bg: linear-gradient(135deg, rgba(255, 255, 255, 0.92) 0%, rgba(248, 250, 252, 0.88) 50%, rgba(241, 245, 249, 0.9) 100%);
	--dbw-border: rgba(0, 0, 0, 0.06);
	--dbw-shadow: 0 4px 24px rgba(15, 23, 42, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
	--dbw-accent: var(--theme-color, #3eaf7c);
	--dbw-glow-1: color-mix(in srgb, var(--theme-color, #3eaf7c) 28%, transparent);
	--dbw-glow-2: color-mix(in srgb, var(--theme-color, #3eaf7c) 12%, transparent);

	position: relative;
	z-index: 0;
	max-width: 42rem;
	margin: 0 auto 2.25rem;
	padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.35rem, 4vw, 2.5rem);
	border-radius: 20px;
	text-align: center;
	box-shadow: var(--dbw-shadow);
	border: 1px solid var(--dbw-border);
	overflow: hidden;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	background-image: linear-gradient(
			90deg,
			transparent,
			color-mix(in srgb, var(--theme-color, #3eaf7c) 50%, transparent),
			transparent
		),
		var(--dbw-card-bg);
	background-size: 75% 2px, 100% 100%;
	background-position: center 0, center;
	background-repeat: no-repeat, no-repeat;
}

/* 背景光晕 */
.document-board-welcome::before,
.document-board-welcome::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	filter: blur(48px);
	opacity: 0.45;
	pointer-events: none;
	z-index: -1;
	animation: document-board-float 14s ease-in-out infinite;
}

.document-board-welcome::before {
	width: min(280px, 70vw);
	height: min(280px, 70vw);
	top: -18%;
	right: -12%;
	background: radial-gradient(circle, var(--dbw-glow-1) 0%, transparent 70%);
}

.document-board-welcome::after {
	width: min(220px, 55vw);
	height: min(220px, 55vw);
	bottom: -20%;
	left: -8%;
	background: radial-gradient(circle, var(--dbw-glow-2) 0%, transparent 68%);
	animation-delay: -7s;
}

@keyframes document-board-float {
	0%,
	100% {
		transform: translate(0, 0) scale(1);
	}
	50% {
		transform: translate(8px, -10px) scale(1.05);
	}
}

.document-board-welcome > * {
	position: relative;
	z-index: 1;
	margin-left: auto;
	margin-right: auto;
	max-width: 36rem;
}

.document-board-welcome > *:not(:last-child) {
	margin-bottom: 0.85rem;
}

/* 去掉内层区块白底，避免深色模式「浅字 + 白盒」 */
.document-board-welcome .wp-block-group,
.document-board-welcome .wp-block-group__inner-container,
.document-board-welcome .entry-content,
.document-board-welcome > div {
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

.document-board-welcome .wp-block-group.has-background,
.document-board-welcome .has-background {
	background: transparent !important;
	background-color: transparent !important;
}

.document-board-welcome > p,
.document-board-welcome > .wp-block-paragraph,
.document-board-welcome .wp-block-group > p {
	animation: document-board-pop-in 0.95s cubic-bezier(0.34, 1.2, 0.52, 1) backwards;
}

.document-board-welcome > p:nth-of-type(1),
.document-board-welcome > .wp-block-paragraph:nth-of-type(1),
.document-board-welcome .wp-block-group > p:nth-of-type(1) {
	animation-delay: 0.06s;
}

.document-board-welcome > p:nth-of-type(2),
.document-board-welcome > .wp-block-paragraph:nth-of-type(2),
.document-board-welcome .wp-block-group > p:nth-of-type(2) {
	animation-delay: 0.14s;
}

.document-board-welcome > p:nth-of-type(3),
.document-board-welcome > .wp-block-paragraph:nth-of-type(3),
.document-board-welcome .wp-block-group > p:nth-of-type(3) {
	animation-delay: 0.22s;
}

.document-board-welcome > p:nth-of-type(4),
.document-board-welcome > .wp-block-paragraph:nth-of-type(4),
.document-board-welcome .wp-block-group > p:nth-of-type(4) {
	animation-delay: 0.3s;
}

.document-board-welcome > p:nth-of-type(5),
.document-board-welcome > .wp-block-paragraph:nth-of-type(5),
.document-board-welcome .wp-block-group > p:nth-of-type(5) {
	animation-delay: 0.38s;
}

.document-board-welcome > p:nth-of-type(6),
.document-board-welcome > .wp-block-paragraph:nth-of-type(6),
.document-board-welcome .wp-block-group > p:nth-of-type(6) {
	animation-delay: 0.46s;
}

.document-board-welcome > p:nth-of-type(7),
.document-board-welcome > .wp-block-paragraph:nth-of-type(7),
.document-board-welcome .wp-block-group > p:nth-of-type(7) {
	animation-delay: 0.54s;
}

.document-board-welcome > p:nth-of-type(8),
.document-board-welcome > .wp-block-paragraph:nth-of-type(8),
.document-board-welcome .wp-block-group > p:nth-of-type(8) {
	animation-delay: 0.62s;
}

@keyframes document-board-pop-in {
	0% {
		opacity: 0;
		transform: translateY(22px) scale(0.94) rotateX(6deg);
	}
	55% {
		opacity: 1;
		transform: translateY(-5px) scale(1.02) rotateX(0deg);
	}
	75% {
		transform: translateY(2px) scale(0.99);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

/* 首段：流光字（与纯色 strong 兼容） */
@keyframes document-board-shimmer-text {
	0% {
		background-position: 0% 50%;
	}
	100% {
		background-position: 200% 50%;
	}
}

@keyframes document-board-first-glow {
	0%,
	100% {
		filter: drop-shadow(0 0 0 transparent);
	}
	50% {
		filter: drop-shadow(0 3px 18px color-mix(in srgb, var(--theme-color, #3eaf7c) 40%, transparent));
	}
}


/* 正文行：浅色统一为深灰系，避免过浅；提高优先级压过 .main-article / 区块继承 */
html body .main-container .main-main .main-content .main-article .document-board-welcome p,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph {
	font-size: clamp(0.95rem, 2.2vw, 1.05rem);
	line-height: 1.75;
	letter-spacing: 0.02em;
	font-weight: 500;
	color: var(--dbw-fg-body) !important;
	-webkit-font-smoothing: antialiased;
	transition: transform 0.4s cubic-bezier(0.34, 1.4, 0.64, 1), letter-spacing 0.45s ease, filter 0.35s ease;
}

/* 中间行悬停：轻微浮起（首末段另有样式可再覆盖） */
html body .main-container .main-main .main-content .main-article .document-board-welcome p:hover,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph:hover {
	transform: translateY(-3px) scale(1.015);
	letter-spacing: 0.05em;
}

html body .main-container .main-main .main-content .main-article .document-board-welcome p strong,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph strong {
	color: var(--dbw-fg) !important;
	font-weight: 700;
}

/* 末段收尾语：略浅但仍满足对比度 */
html body .main-container .main-main .main-content .main-article .document-board-welcome > p:last-of-type,
html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:last-of-type,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:last-of-type {
	margin-top: 1.35rem;
	padding-top: 1.15rem;
	border-top: 1px solid var(--dbw-border);
	font-size: clamp(0.88rem, 2vw, 0.95rem);
	color: var(--dbw-fg-muted) !important;
	font-weight: 500;
	letter-spacing: 0.06em;
}

/* 首段略醒目，与正文区分一级 + 流光字 + 入场后排字光晕 */
html body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type {
	font-size: clamp(1.02rem, 2.4vw, 1.12rem);
	font-weight: 600;
	letter-spacing: 0.02em;
	background-image: linear-gradient(
		105deg,
		var(--dbw-fg) 0%,
		var(--dbw-fg) 34%,
		var(--theme-color, #3eaf7c) 50%,
		var(--dbw-fg) 66%,
		var(--dbw-fg) 100%
	);
	background-size: 220% auto;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	-webkit-text-fill-color: transparent;
	animation: document-board-pop-in 0.95s cubic-bezier(0.34, 1.2, 0.52, 1) backwards,
		document-board-shimmer-text 7s linear infinite,
		document-board-first-glow 4.5s ease-in-out infinite;
	animation-delay: 0.06s, 0.85s, 1s;
}

html body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type strong,
html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type strong,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type strong {
	background: none !important;
	-webkit-text-fill-color: var(--dbw-fg);
	color: var(--dbw-fg) !important;
}

html body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type::first-letter,
html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type::first-letter,
html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type::first-letter {
	display: inline-block;
	font-weight: 800;
	font-size: 1.2em;
	margin-right: 0.06em;
	animation: document-board-letter-wink 2.8s ease-in-out infinite 1.2s;
}

@keyframes document-board-letter-wink {
	0%,
	88%,
	100% {
		transform: scale(1);
	}
	6% {
		transform: scale(1.12) rotate(-6deg);
	}
	12% {
		transform: scale(1) rotate(0deg);
	}
}

/* 覆盖 .main-article 内链色，避免与卡片文字冲突 */
html body .main-container .main-main .main-content .main-article .document-board-welcome a {
	color: var(--dbw-accent);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--dbw-accent) 35%, transparent);
	transition: opacity 0.2s ease, border-color 0.2s ease;
}

html body .main-container .main-main .main-content .main-article .document-board-welcome a:hover {
	opacity: 0.88;
	border-bottom-color: var(--dbw-accent);
}

html.dark body .main-container .main-main .main-content .main-article .document-board-welcome a,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome a {
	color: color-mix(in srgb, var(--theme-color, #5fd4a5) 92%, white) !important;
	border-bottom-color: color-mix(in srgb, var(--theme-color, #5fd4a5) 45%, transparent) !important;
}

/* ========== 深色模式（html.dark 与 .dark 均兼容） ========== */
html.dark .document-board-welcome,
.dark .document-board-welcome {
	--dbw-fg: rgba(255, 255, 255, 0.96);
	--dbw-fg-muted: rgba(255, 255, 255, 0.68);
	--dbw-fg-body: rgba(255, 255, 255, 0.88);
	--dbw-fg-soft: var(--dbw-fg-body);
	--dbw-card-bg: linear-gradient(145deg, rgba(42, 42, 44, 0.98) 0%, rgba(30, 30, 32, 0.96) 45%, rgba(24, 24, 26, 0.98) 100%);
	--dbw-border: rgba(255, 255, 255, 0.12);
	--dbw-shadow: 0 8px 40px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.06) inset;
	--dbw-glow-1: color-mix(in srgb, var(--theme-color, #5fd4a5) 35%, transparent);
	--dbw-glow-2: color-mix(in srgb, var(--theme-color, #5fd4a5) 18%, transparent);
	color: var(--dbw-fg-body);
}

html.dark .document-board-welcome::before,
html.dark .document-board-welcome::after,
.dark .document-board-welcome::before,
.dark .document-board-welcome::after {
	opacity: 0.38;
}

/* 深色：强制段落为浅字（!important 压过全站 --theme-text 继承） */
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome p,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome p,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph {
	color: rgba(255, 255, 255, 0.88) !important;
}

html.dark body .main-container .main-main .main-content .main-article .document-board-welcome p strong,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph strong,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome p strong,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-paragraph strong {
	color: rgba(255, 255, 255, 0.98) !important;
}

html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:last-of-type,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:last-of-type,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:last-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:last-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:last-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:last-of-type {
	color: rgba(255, 255, 255, 0.68) !important;
}

/* 深色：首段流光（须保持 color:transparent，勿在上方用「全体 p」覆盖首段） */
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type {
	background-image: linear-gradient(
		105deg,
		rgba(255, 255, 255, 0.96) 0%,
		rgba(255, 255, 255, 0.96) 32%,
		var(--theme-color, #5fd4a5) 50%,
		rgba(255, 255, 255, 0.96) 68%,
		rgba(255, 255, 255, 0.96) 100%
	);
	background-size: 220% auto;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	-webkit-text-fill-color: transparent;
}

html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type strong,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type strong,
html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type strong,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type strong,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type strong,
.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type strong {
	-webkit-text-fill-color: rgba(255, 255, 255, 0.98);
	color: rgba(255, 255, 255, 0.98) !important;
}

@media (prefers-reduced-motion: reduce) {
	.document-board-welcome::before,
	.document-board-welcome::after {
		animation: none;
	}

	.document-board-welcome > p,
	.document-board-welcome > .wp-block-paragraph,
	.document-board-welcome .wp-block-group > p {
		animation: none !important;
		transition: none;
	}

	html body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
	html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
	html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type {
		background-image: none !important;
		-webkit-text-fill-color: inherit;
		color: var(--dbw-fg) !important;
		animation: none !important;
	}

	html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
	html.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
	html.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type,
	.dark body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type,
	.dark body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type,
	.dark body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type {
		color: rgba(255, 255, 255, 0.96) !important;
	}

	html body .main-container .main-main .main-content .main-article .document-board-welcome > p:first-of-type::first-letter,
	html body .main-container .main-main .main-content .main-article .document-board-welcome > .wp-block-paragraph:first-of-type::first-letter,
	html body .main-container .main-main .main-content .main-article .document-board-welcome .wp-block-group > p:first-of-type::first-letter {
		animation: none;
	}
}