/* Cassiopeia 用户自定义 CSS —— 2026-10-16
 *
 * 1) 修 CLS：
 *    `mod_languages` 语言选择器里的国旗图(18x12 gif、缺 width/height)和
 *    主要网格里的图集/轮播块(一达 360x427)本来是"等内容加载完才撑开高度"，
 *    导致 2~6 秒内把下面的段落整体顶下去(手机端实测 CLS 1.27~1.44、6~16 次位移)。
 *    按真实渲染尺寸固定后，浏览器在图片/块到达前就已知布局，重排归零。
 *    视觉完全一致——18x12 即国旗真实渲染尺寸，图集块高度由其本身决定。
 */
.mod-languages img {
    width: 18px;
    height: 12px;
    display: inline-block;
}
.mod-languages {
    line-height: 1;
}

/* 2) 修 CLS 的正主：语言列表是 JS 装载后逐步成型的 —— 实测模块高度在 2.4~3.7 秒之间
 *    144 → 168 → 192 分三步长（每步 +24px 一行），把 header 从 562 撑到 618，
 *    于是下面每一行依次下移 24px（实测位移向量：逐行 移动=24px），CLS 累计 1.0~1.5。
 *    国旗尺寸(18x12)全程未变，所以不是图片没预留的问题，是"行数在长"。
 *    对策：按它的终态高度预留（仅手机断点，桌面不受影响）。
 *    终端实测高度：390px 视口 = 192px。换模板/改语言项数时需同步这个值。
 */
@media (max-width: 575px) {
    .mod-languages {
        min-height: 192px;
    }
}