/*
Theme Name: 叶伟2050
Theme URI: https://imwaco.com
Author: imwaco
Author URI: https://imwaco.com
Description: 「叶伟2050」专属区块主题(FSE)——浅色现代卡片网格(参照 mksaas 版式):圆角卡片、标题作封面、分类胶囊徽章。无特色图时封面=按分类微着色的标题卡;有特色图则用图、标题白字叠加。
Version: 2.13.2
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: muwu
*/

/* ============ 卡片网格 ============ */
.muwu-query .wp-block-post-template.is-layout-grid { gap: 1.5rem; }

.muwu-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 0;
	box-shadow: 0 1px 2px rgba(26, 24, 23, .05);
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.muwu-card { cursor: pointer; }
.muwu-card:hover {
	transform: translateY(-4px);
	border-color: transparent;
	box-shadow: 0 16px 38px rgba(26, 24, 23, .13);
}
/* 抵消 constrained 布局给 flex 子元素加的 auto 左右外边距 */
.muwu-card > *,
.muwu-card-body > *,
.muwu-cover > * {
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

/* 封面:无图时=按分类微着色的标题卡;有图时=图 + 白字标题叠加 */
.muwu-cover {
	position: relative;
	height: 184px;
	display: flex;
	flex-direction: column;
	gap: .75rem;
	overflow: hidden;
	padding: 1.25rem 1.3rem;
	background:
		radial-gradient(125% 120% at 82% 0%, color-mix(in srgb, var(--muwu-cat, #b9b3a8) 26%, transparent), transparent 58%),
		linear-gradient(150deg, #ffffff, color-mix(in srgb, var(--muwu-cat, #b9b3a8) 12%, #ffffff));
	border-bottom: 1px solid var(--wp--preset--color--line);
}

/* 封面顶部一行:分类(左,超长截断) + 日期(右) */
.muwu-cover-meta {
	position: relative;
	z-index: 2;
	margin-top: auto;
	align-items: center;
	gap: .5rem;
}
.muwu-cover-date {
	flex: 0 0 auto;
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: .78rem;
}
.muwu-cover-img {
	position: absolute;
	inset: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
.muwu-cover-img a,
.muwu-cover-img img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 标题作封面主视觉(左对齐,顶部对齐:各卡标题首行起始高度一致) */
.muwu-cover-title {
	margin: 0;
	position: relative;
	z-index: 2;
	text-align: left;
}
.muwu-cover-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	font-size: 1.45rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: -.015em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.muwu-cover-title a:hover { color: var(--wp--preset--color--accent); }
/* 有特色图时:加暗色蒙版,标题转白字 */
.muwu-cover:has(.muwu-cover-img)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(0, 0, 0, .15), rgba(0, 0, 0, .55));
}
.muwu-cover:has(.muwu-cover-img) .muwu-cover-title a {
	color: #fff;
	text-shadow: 0 1px 10px rgba(0, 0, 0, .55);
}
/* 有特色图时:日期也转亮色带阴影,避免暗灰字叠在图上看不清 */
.muwu-cover:has(.muwu-cover-img) .muwu-cover-date {
	color: rgba(255, 255, 255, .92);
	text-shadow: 0 1px 8px rgba(0, 0, 0, .6);
}

.muwu-card-body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: .6rem;
	flex: 1;
	padding: 1.1rem 1.2rem;
}

/* 分类徽章(胶囊,左侧;超长用省略号截断) */
.muwu-cat-tag { margin: 0; line-height: 1; min-width: 0; }
.muwu-cat-tag a {
	display: inline-block;
	max-width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: bottom;
	padding: .26em .7em;
	border-radius: 999px;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-decoration: none;
	color: color-mix(in srgb, var(--muwu-cat, #6f6a63) 78%, #000);
	background: color-mix(in srgb, var(--muwu-cat, #6f6a63) 13%, #fff);
	border: 1px solid color-mix(in srgb, var(--muwu-cat, #6f6a63) 22%, #fff);
}
.muwu-cat-tag a:hover { background: color-mix(in srgb, var(--muwu-cat, #6f6a63) 20%, #fff); }

.muwu-card-body .wp-block-post-excerpt { margin: 0; }
.muwu-card-body .wp-block-post-excerpt__excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: .9rem;
	line-height: 1.7;
}

/* ============ 首页 hero + 分类筛选胶囊 ============ */
.muwu-hero { text-align: center; }
.muwu-hero .muwu-hero-tagline { color: var(--wp--preset--color--muted); font-size: 1.05rem; }

.muwu-filter { gap: .5rem !important; }
.muwu-filter .wp-block-button__link {
	padding: .4em 1.1em;
	border-radius: 999px;
	font-size: .9rem;
	background: transparent;
	color: var(--wp--preset--color--muted);
	border: 1px solid var(--wp--preset--color--line);
}
.muwu-filter .wp-block-button__link:hover {
	color: var(--wp--preset--color--contrast);
	border-color: #d8d4cc;
}
.muwu-filter .wp-block-button.is-style-fill .wp-block-button__link {
	background: var(--wp--preset--color--contrast);
	color: #fff;
	border-color: var(--wp--preset--color--contrast);
}

/* ============ 品牌字标(叶伟 + 2050:数字弱化、留白,避免汉字+数字黏死)============ */
.muwu-brand {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--large);
	letter-spacing: -.02em;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}
/* @imwaco:比「叶伟」小一号的落款 handle——拉丁等宽 + @,名字为主、handle 为从 */
.muwu-brand-num {
	font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
	font-size: .5em;
	font-weight: 600;
	letter-spacing: .01em;
	margin-left: .5em;
	vertical-align: .12em;
	color: var(--wp--preset--color--accent);
}

/* ============ 页头 ============ */
.muwu-header {
	border-bottom: 1px solid var(--wp--preset--color--line);
	background: rgba(255, 255, 255, .78);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	backdrop-filter: saturate(160%) blur(10px);
}
.muwu-nav a { color: var(--wp--preset--color--muted); text-decoration: none; font-size: .95rem; }
.muwu-nav a:hover { color: var(--wp--preset--color--contrast); }
.muwu-nav .current-menu-item > a { color: var(--wp--preset--color--contrast); }

/* ============ 文章页 ============ */
/* 正文下方:tag(左) / 分类(右) 同一行 */
.muwu-article-taxonomy {
	padding: .8rem 0;
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
	align-items: center;
	gap: .75rem;
	flex-wrap: wrap;
}
.muwu-article-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; }
.muwu-article-tags .wp-block-post-terms__separator { display: none; }
.muwu-article-tags a {
	display: inline-block;
	padding: .22em .72em;
	border-radius: 999px;
	background: var(--wp--preset--color--elevated);
	border: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--muted);
	font-size: .78rem;
	text-decoration: none;
	transition: border-color .15s, color .15s;
}
.muwu-article-tags a:hover { color: var(--wp--preset--color--contrast); border-color: #d3cfc6; }
.muwu-article-cats { margin: 0; white-space: nowrap; }
.muwu-article-cats a {
	color: var(--muwu-cat, var(--wp--preset--color--accent));
	font-size: .85rem;
	font-weight: 600;
	text-decoration: none;
}
.muwu-article-cats a:hover { text-decoration: underline; }


.muwu-article .wp-block-post-content { font-size: 1.075rem; line-height: 1.9; }
.muwu-article .wp-block-post-content p { margin: 0 0 1.35em; }
.muwu-article .wp-block-post-content img { max-width: 100%; height: auto; border-radius: 12px; }
.muwu-article .wp-block-post-content h2,
.muwu-article .wp-block-post-content h3 { margin-top: 1.8em; }
.muwu-article .wp-block-post-content blockquote {
	border-left: 3px solid var(--wp--preset--color--accent);
	padding-left: 1.1em;
	color: var(--wp--preset--color--muted);
}
.muwu-article .wp-block-post-content pre {
	background: #fff;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 10px;
	padding: 1em 1.2em;
}
.muwu-article-meta { color: var(--wp--preset--color--muted); font-size: .9rem; }
.muwu-article-meta a { color: var(--wp--preset--color--muted); }
.muwu-article .wp-block-post-terms a { color: var(--muwu-cat, var(--wp--preset--color--accent)); }

/* 上一篇/下一篇:各占一半;label 灰色小字、title 深色加粗各占一行;右侧右对齐 */
/* WP 7.0 实际渲染: div.post-navigation-link-{previous|next} > span.label + a.title */
.muwu-article-nav { gap: 1.5rem; align-items: flex-start; }
.muwu-article-nav .wp-block-post-navigation-link {
	flex: 1;
	min-width: 0;
}
.muwu-article-nav .post-navigation-link__label {
	display: block;
	font-size: .82rem;
	color: var(--wp--preset--color--muted);
}
.muwu-article-nav .wp-block-post-navigation-link a {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 500;
	font-size: .9rem;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	margin-top: .18em;
	transition: color .15s;
}
.muwu-article-nav .wp-block-post-navigation-link a:hover { color: var(--wp--preset--color--accent); }
/* 右侧(下一篇):整体右对齐 */
.muwu-article-nav .post-navigation-link-next { text-align: right; }

/* ============ 页脚 ============ */
.muwu-footer { border-top: 1px solid var(--wp--preset--color--line); color: var(--wp--preset--color--muted); }
.muwu-footer a { color: var(--wp--preset--color--muted); text-decoration: none; }
.muwu-footer a:hover { text-decoration: underline; }

/* ============ 分页 ============ */
.wp-block-query-pagination {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	margin-top: 3.5rem;
	gap: .45rem !important;
}
.wp-block-query-pagination .wp-block-query-pagination-numbers { display: flex; gap: .45rem; align-items: center; }
.wp-block-query-pagination a,
.wp-block-query-pagination .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 .85em;
	border-radius: 10px;
	border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--muted);
	font-size: .9rem;
	text-decoration: none;
	transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.wp-block-query-pagination a:hover {
	color: var(--wp--preset--color--contrast);
	border-color: #d3cfc6;
}
.wp-block-query-pagination .current {
	font-weight: 700;
	color: #fff;
	background: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
}
.wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers.dots {
	border: 0;
	background: transparent;
	min-width: auto;
	color: var(--wp--preset--color--muted);
}

/* 失效 Flash 视频的占位提示 */
.muwu-dead-embed {
	padding: .9em 1.1em;
	background: var(--wp--preset--color--elevated);
	border: 1px dashed var(--wp--preset--color--line);
	border-radius: 10px;
	color: var(--wp--preset--color--muted);
	font-size: .92rem;
}

/* ============ 焦点框(全站统一)============ */
/* 鼠标点击不留黑框;键盘 Tab 才显示橙色圆角框(无障碍标准做法) */
a:focus:not(:focus-visible),
.wp-block-button__link:focus:not(:focus-visible) {
	outline: none;
	box-shadow: none;
}
a:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
	border-radius: 4px;
}
/* 包图片的链接:消除行内图底部基线空隙(否则焦点框只有底部有缝) */
.muwu-article .wp-block-post-content a:has(img) { display: inline-block; }
.muwu-article .wp-block-post-content a:has(img) img { display: block; }
/* 焦点框:四周统一 3px 留白,圆角贴合图片 */
.muwu-article .wp-block-post-content a:has(img):focus-visible {
	outline-offset: 3px;
	border-radius: 12px;
}

/* ============ 图片灯箱(文章页:封面图 + 正文图,统一预览)============ */
.muwu-article .wp-block-post-featured-image img,
.muwu-article .wp-block-post-content img {
	cursor: zoom-in;
}
.muwu-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(26, 24, 23, .55);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, visibility .2s ease;
}
.muwu-lightbox.is-open { opacity: 1; visibility: visible; }

.muwu-lb-stage {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5vmin;
	overflow: hidden;
	cursor: zoom-out;
	touch-action: none;
}
.muwu-lb-stage.is-zoomed { cursor: grab; }
.muwu-lb-img {
	max-width: 92vw;
	max-height: 90vh;
	width: auto;
	height: auto;
	border-radius: 6px;
	box-shadow: 0 10px 50px rgba(0, 0, 0, .4);
	user-select: none;
	-webkit-user-drag: none;
}

/* 控件:关闭 / 左右切换 / 计数 */
.muwu-lb-btn {
	position: absolute;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	cursor: pointer;
	color: #fff;
	background: rgba(0, 0, 0, .32);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	border-radius: 999px;
	line-height: 1;
	transition: background .15s ease;
}
.muwu-lb-btn:hover { background: rgba(0, 0, 0, .55); }
.muwu-lb-close { top: 3vmin; right: 3vmin; width: 44px; height: 44px; font-size: 26px; }
.muwu-lb-prev, .muwu-lb-next { top: 50%; transform: translateY(-50%); width: 48px; height: 48px; font-size: 30px; }
.muwu-lb-prev { left: 3vmin; }
.muwu-lb-next { right: 3vmin; }
.muwu-lb-counter {
	position: absolute;
	z-index: 2;
	bottom: 3vmin;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
	background: rgba(0, 0, 0, .32);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	padding: .3em .9em;
	border-radius: 999px;
	font-size: .85rem;
}
@media (max-width: 600px) {
	.muwu-lb-close { width: 40px; height: 40px; font-size: 22px; }
	.muwu-lb-prev, .muwu-lb-next { width: 40px; height: 40px; font-size: 24px; }
}
