/*!
 * AVBJ LQIP v5 (gray) — 双层竞速：底层真实低清(lq-under) + 顶层高清(lq-over)。
 * 画框原则：每张图只有一个画框。
 *   列表卡画框 = .img 容器（既有 position:relative + 定高）；
 *   正文画框   = 原 figure（加 lq-frame 建立定位上下文）。
 * 底层 img 原位不动、不包裹 → 主题与 core gallery 的全部布局规则
 * 原样作用于底层；LQIP 与高清同比例 → 画框尺寸与原版逐像素一致。
 * 竞速由渲染管线裁决：
 *   高清在首绘前 onload → 首帧即不透明高清，低清全程不可见、无过渡感知；
 *   高清未就绪 → 低清立即可辨认，onload 后 0.12s 极短淡入覆盖；
 *   高清失败 → 顶层隐藏(内联 onerror)，真实低清保留；低清失败 → 品牌 SVG。
 * 不存在任何等待 JS 解除的状态 → 结构上不可能永久模糊/紫块。
 */

/* —— Header FOUT 防折行：Pretendard 未就绪时回退字体使 .nav-main 增宽约 74px，
       1280-1366px 临界视口下 .nav-right 会折到面包屑行；按既有 1025-1279 收紧
       策略延伸覆盖该区间，回退字体宽度也能单行容纳（实测 826px → 容纳阈值内） —— */
@media (min-width: 1280px) and (max-width: 1366px) {
	.nav-main { margin-left: 10px; }
	.nav-main > li > a { padding-left: 7px; padding-right: 7px; }
	.nav-right .nav-search,
	.nav-right .nav-night,
	.nav-right .nav-vip,
	.nav-right .nav-lang,
	.nav-right .nav-tougao,
	.nav-right .nav-notice,
	.nav-right .nav-cart { padding-left: 7px; padding-right: 7px; }
}

/* —— 跨文档导航过渡：旧页保持绘制直至新页就绪后平滑交接，
       消除页面切换白屏/硬切（Chrome 126+，其他浏览器自动忽略） —— */
@view-transition {
	navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: .14s;
}

/* —— 顶层高清通用：纯视觉层，覆盖于最近定位祖先；
       pointer-events:none 保证灯箱/链接/选中行为全部落在原结构上 —— */
img.lq-over {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity .12s ease;
	pointer-events: none;
	margin: 0;
	border: 0;
	border-radius: inherit;
}
img.lq-over.lq-on {
	opacity: 1;
}

/* —— 单层高清（无低清可用的降级链路）：原子显形。
       图库输出 baseline JPEG，流式可见时会自上而下扫描揭幕；
       置 0 透明度、onload 整张同时显形（解析期完成则免过渡，与双层一致） —— */
img.lq-solo {
	opacity: 0;
	transition: opacity .12s ease;
}
img.lq-solo.lq-on {
	opacity: 1;
}

/* —— 列表卡：底层沿用 .thumb 的 100%/100% object-fit:cover 填满 —— */

/* —— 视频预览卡(grid-vd)专项：user.css「GIF 式 hover 动态封面」区块
       （.grids .grid-vd .img .thumb，特异性 0,4,0 + !important 三连）
       同时命中双层中的顶层（顶层也带 .thumb）：
       position:relative 把高清层打回文档流 → 排在低清下方、被
       a{overflow:hidden} 整体裁出画框；opacity:1!important 又把低清
       永久钉在画框内 → 视频预览卡永远显示 36px 低清放大图。
       以 (0,5,0)+!important 把顶层钉回画框，三态状态机与普通卡一致：
       高清就绪(.lq-on)→覆盖；高清失败(无 lq-on)→opacity 0 保留低清。
       z-index 钉 1：仍低于 .grid-video(z-index:2)，hover 动态封面不受影响 —— */
.grids .grid-vd .img .thumb.lq-over {
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	opacity: 0 !important;
	z-index: 1 !important;
	pointer-events: none !important;
}
.grids .grid-vd .img .thumb.lq-over.lq-on {
	opacity: 1 !important;
}

/* 低清抵达前的极短空窗：底色随主题取中性色——日间浅灰紫调、夜间深中性，
   与页面背景同族，慢网下闪现也不构成视觉噪音；深紫色块自此退出正常加载链路 */
.posts.grids .post.grid .img {
	background: #eceaf1;
}
body.night .posts.grids .post.grid .img {
	background: #1d1b22;
}
/* 正文画框空窗同理（极短，仅慢网可见） */
body.single .article-content figure.lq-frame {
	background: rgba(127, 127, 140, .06);
}
body.night.single .article-content figure.lq-frame {
	background: rgba(255, 255, 255, .035);
}

/* —— 正文：figure 即画框；圆角裁切在画框层统一完成，双层永远同形 —— */
body.single .article-content figure.lq-frame {
	position: relative;
	border-radius: 6px;
	overflow: hidden;
}
/* 顶层强制钉死在画框上。
   裁决依据：user.css 对画廊 img 有 position:relative!important（4363 行组），
   会把顶层打回文档流、在底层下方形成第二个画框；88vh 限高与边框规则同样命中。
   此处以 (0,4,3)+!important 全量压制，顶层在任何语境下都只能是画框上的覆盖层 */
body.single .article-content figure.lq-frame img.lq-over {
	position: absolute !important;
	left: 0 !important;
	top: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	margin: 0 !important;
	border: 0 !important;
	/* contain：底层盒为画框宽、内容按比例居中收纳（竖图在 88vh 约束下窄于画框）；
	   顶层同图同比例 contain → 渲染内容与底层逐像素重合，交接无任何位移或裁切差 */
	object-fit: contain !important;
}
/* 说明文字浮于顶层之上（core gallery caption 叠图布局） */
body.single .article-content figure.lq-frame figcaption {
	position: relative;
	z-index: 2;
}
/* ============================================================
   统一布局系统（灰度域正文图片，一套规则覆盖全部语境）
   原则：任何画框不得依赖图片自然宽度（低清底层自然宽恒为 64px）。
   1. 所有画框一律占满其所在布局单元（普通画廊=整行、双列=半格、
      栏目列=列宽），图片实际显示宽度统一由底层内联
      min(容器, 高清自然宽, 88vh折算宽) 决定 → 大图填满、小图原尺寸居中；
   2. 所有双列容器的"列轨/列宽"一律等分，不再由内容固有尺寸推导
      （稳定版的 max-content / flex-basis:auto 契约遇 64px 底层必然塌缩）。
   本文件在 user.css 之后加载，同特异性 !important 按源顺序胜出。
   ============================================================ */
/* 1. 画框统一：覆盖普通画廊、22/55 快捷类、gallery-two-col(s)、
      wp-block-columns 栏目内 figure、独立单图等全部语境。
      .lq-frame 重复 4 次提权至 (0,6,2)：主题对各画廊 figure 的
      width:max-content!important 最高为 (0,5,2)，必须全部压过 */
body.single .article-content figure.lq-frame.lq-frame.lq-frame.lq-frame {
	display: block !important; /* 杀掉 core 画廊 figure 的 display:flex（其 img flex:1 0 0% 会回退到 64px 自然尺寸，压塌画框） */
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
}
body.single .article-content figure.lq-frame.lq-frame.lq-frame.lq-frame img.lq-under {
	flex: none !important; /* 同上：底层永不参与 flex 尺寸协商 */
}
/* 1b. 列内画廊/单图容器：主题把列设为 flex 纵向容器且第 1、2 列
      align-items:flex-start/flex-end!important（横轴不 stretch），
      容器宽度回退为内容固有宽度 = 64px 底层 → 整链塌缩。
      强制占满横轴，宽度裁决权交还底层内联 min() */
body.single .article-content .wp-block-column > .wp-block-gallery,
body.single .article-content .wp-block-column > figure.wp-block-image {
	width: 100% !important;
	align-self: stretch !important;
}
/* 2a. 两列栏目：等分列 */
body.single .article-content .wp-block-columns.is-layout-flex .wp-block-column.is-layout-flow,
body.single .article-content .wp-block-columns.is-layout-flex .wp-block-column {
	flex: 1 1 0 !important;
	min-width: 0 !important;
}
/* 2b. 55 类画廊：列轨由 max-content 改等分（22 类与 two-col(s) 已是等分轨） */
body.single .article-content .wp-block-gallery[class~="55"],
body.single .article-content .wp-block-column[class~="55"] .wp-block-gallery {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* —— 正文图片观感（仅灰度域）：统一节奏与边界，弱化模板感。
       仅作用于正文顶层块，不触碰画廊内部 figure 的 flex 等高布局 —— */
body.single .article-content > .wp-block-image,
body.single .article-content > .wp-block-gallery {
	margin-top: 14px;
	margin-bottom: 14px;
}