/* custom.css — 布局与字体定制 */

/* ===== Emoji 分层回退：解决 🛜(U+1F6DC) 与国旗 🇨🇳(U+1F1E6-1F1FF) 在桌面端不显示 ===== */
/* 第一层：设备自带彩色 emoji，只管缺字形的码位；苹果/安卓命中即用，零下载 */
@font-face {
  font-family: 'Haelcy Emoji Native Flag';
  src: local('Apple Color Emoji'), local('Noto Color Emoji');
  unicode-range: U+1F1E6-1F1FF, U+1F6DC, U+1F6DD-1F6DF, U+1FA70-1FAFF;
}
/* 第二层：补缺口的网络字体，只声明缺的码位 → 只有含这些字符的页面才下载 */
@font-face {
  font-family: 'Haelcy Emoji Web Flag';
  src: url('https://registry.npmmirror.com/@fontsource/noto-color-emoji/5.3.2/files/files/noto-color-emoji-emoji-400-normal.woff2') format('woff2');
  font-display: swap;
  unicode-range: U+1F1E6-1F1FF, U+1F6DC, U+1F6DD-1F6DF, U+1FA70-1FAFF;
}
/* 第三层：其余 emoji 仍走设备自带字体；范围刻意排除英文字母、数字与 # *，免得抢走正文 */
@font-face {
  font-family: 'Haelcy Emoji Native';
  src: local('Apple Color Emoji'), local('Noto Color Emoji'), local('Segoe UI Emoji'), local('Segoe UI Symbol');
  unicode-range: U+00A9, U+00AE, U+200D, U+203C, U+2049, U+20E3, U+2122, U+2139, U+2190-21FF,
                 U+2300-23FF, U+2460-24FF, U+25A0-27BF, U+2900-297F, U+2B00-2BFF,
                 U+3030, U+303D, U+3297, U+3299, U+FE0F, U+1F000-1FAFF;
}

/* ===== 全站字体：emoji 分层在前，霞鹜文楷（屏幕版，切片 webfont，由 build.mjs 头部引入）在后 ===== */
/* CDN 未加载成功时自动回退到系统字体，页面不会坏 */
:root {
  --emoji: 'Haelcy Emoji Native Flag', 'Haelcy Emoji Web Flag', 'Haelcy Emoji Native';
  --serif: var(--emoji), 'LXGW WenKai Screen', 'Chiron GoRound TC', system-ui, sans-serif;
  --sans: var(--emoji), 'LXGW WenKai Screen', 'Chiron GoRound TC', system-ui, sans-serif;
}

/* ===== 文章正文：窄屏（手机）并排退化为单列整幅，保持与现状一致 ===== */
/* 只限定 .article-body，说说页（memo）的相框在任何宽度下都不受影响 */
@media (max-width: 480px) {
  .article-body .photoset .photos { display: block; }
}

/* ===== 相框图片按真实宽高比撑高（文章页）：并排时横图完整显示、不被 cover 裁剪 ===== */
/* 构建端已给 figure 内联 aspect-ratio: 宽/高，这里只需声明意图 */
/* 说说页/说说详情页的九宫格保持 1:1 方形（覆盖内联真实比例，避免 memo 布局变化） */
.entry-memo .photoset .photos figure.pswp-item,
.memo-page .photoset .photos figure.pswp-item {
  aspect-ratio: 1 / 1 !important;
}

/* ===== 文章页单图也撑满容器 ===== */
/* photoset 内 img 已有 width:100%（.photoset 规则）；单图（独立段落）只有 max-width:100%，
   配合 srcset 的 sizes=auto 会按懒加载占位 300px 解码，导致大图显示成 300px 小图、右侧留白 */
.article-body figure.pswp-item img {
  width: 100%;
}

/* ===== 主页 memo：文字与图片左对齐（去掉原主题 48px 缩进） ===== */
.entry-memo .memo-content { padding-left: 0; }

/* ===== 说说位置标注（微信式，蓝色小字） ===== */
.memo-location { margin-top: 10px; font-size: 13px; color: #0a84ff; }
.memo-location i { margin-right: 4px; }

/* ===== 实况照片（Live Photo）：点开大图后左下角 ▶ 播放，播一遍自动停 ===== */
figure.pswp-item.live-photo {
  position: relative;
  overflow: hidden;
}
.live-photo img {
  -webkit-user-drag: none;
}
/* 页面缩略图不直接播放：内嵌 video 仅作为灯箱的播放源（始终隐藏、不占交互） */
.live-photo .live-photo-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  pointer-events: none;
}

/* LIVE 角标 */
.live-photo::after {
  content: 'LIVE';
  position: absolute;
  right: 5px;
  bottom: 5px;
  font-family: var(--mono);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .3px;
  color: #fff;
  background: rgba(0, 0, 0, .55);
  padding: 1px 4px;
  border-radius: 3px;
  pointer-events: none;
  z-index: 2;
}

/* 灯箱（PhotoSwipe）内实况控制：左下角 ▶ 播放按钮 + 视频覆盖层 */
.pswp .pswp-live-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: transparent; /* 未出画面时透明，不盖黑屏 */
  opacity: 0;              /* 出画面才淡入（.ready） */
  transition: opacity .2s ease;
  z-index: 4;
  pointer-events: none; /* 不抢触摸，点击落到幻灯片上 */
}
.pswp .pswp-live-video.ready { opacity: 1; }
.pswp .pswp-live-controls {
  position: absolute;
  left: 24px;
  bottom: 24px;
  z-index: 5;
}
.pswp .pswp-live-controls .pswp-live-play {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px;
  padding: 0 16px;
  border: none;
  border-radius: 999px;
  color: #fff;
  background: rgba(0, 0, 0, .55);
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
  transition: background .2s, opacity .2s;
}
.pswp .pswp-live-controls .pswp-live-play i { font-size: 12px; }
.pswp .pswp-live-controls .pswp-live-play:hover { background: rgba(0, 0, 0, .75); }
/* 播放中按钮半透明，点它可提前停止 */
.pswp .pswp-live-controls .pswp-live-play.playing { opacity: .65; }
.pswp .pswp-live-hint {
  position: absolute;
  left: 24px;
  bottom: 80px;
  max-width: 86%;
  font-size: 12px;
  color: #fff;
  background: rgba(0, 0, 0, .65);
  padding: 6px 12px;
  border-radius: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}
.pswp .pswp-live-hint[hidden] { display: none; }

/* ---------- 音乐卡片（{{music <链接>}} → 官方外链播放器 iframe） ---------- */
.music-player { margin: 6px 0; max-width: 380px; }
.music-player__embed iframe {
  display: block;
  width: 100%;
  max-width: 380px;
  border: 0;
  border-radius: 8px;
  background: #f7f8fa;
  height: 66px;
}
/* VIP 歌曲试听受限（QQ 约 60 秒 / 网易云不可播）时的兜底出口 */
.music-player__link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--accent, #0a84ff);
  text-decoration: none;
  opacity: .85;
  transition: opacity .15s ease;
}
.music-player__link:hover { opacity: 1; text-decoration: underline; }
.music-player__link i { font-size: 11px; }
