/* ============================================================
   时光影像 · 纯照片墙 v6
   只有照片：暗场、满幅、极小间距、悬停出图注、点开看大图
   ============================================================ */

:root{
  --bg:#0a0a0b;
  --bg-soft:#141416;
  --ink:#f4f1ec;
  --muted:rgba(244,241,236,.55);
  --line:rgba(244,241,236,.12);
  --serif:"Songti SC","Source Han Serif SC","Noto Serif SC","STSong",Georgia,serif;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,"Helvetica Neue",sans-serif;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scrollbar-width:none; -ms-overflow-style:none; }
html::-webkit-scrollbar{ width:0; height:0; display:none; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; }

/* ---------- 顶部：只留站名与一行副标题 ---------- */
header.site-head{
  text-align:center;
  padding:34px 20px 24px;
}
header.site-head .branding{ display:block; }
header.site-head .branding h1.site-title{
  margin:0;
  font-family:var(--serif);
  font-size:20px;
  font-weight:400;
  letter-spacing:.4em;
  text-indent:.4em;
  line-height:1.2;
  color:var(--ink);
}
header.site-head .branding h1.site-title a{ color:var(--ink); transition:opacity .3s ease; }
header.site-head .branding h1.site-title a:hover{ opacity:.65; }
header.site-head .site-desc{
  margin:10px 0 0;
  font-size:11px;
  letter-spacing:.22em;
  text-indent:.22em;
  color:rgba(244,241,236,.42);
  font-weight:300;
}
header.site-head .site-rule{ display:none; }

/* ---------- 照片墙：满幅、极小间距 ---------- */
.ph-wall{
  column-count:3;
  column-gap:8px;
  padding:0 8px 34px;
  max-width:none;
}
.ph-wall.ph-w2{ column-count:2; }
.ph-wall.ph-w3{ column-count:3; }
.ph-wall.ph-w4{ column-count:4; }

.ph-card{
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  page-break-inside:avoid;
  margin:0 0 8px;
  position:relative;
}
.ph-frame{
  position:relative;
  display:block;
  overflow:hidden;
  background:var(--bg-soft);
  line-height:0;
}
.ph-open{ display:block; position:relative; cursor:zoom-in; }
.ph-img{
  width:100%;
  height:auto;
  display:block;
  transition:transform 1.1s cubic-bezier(.16,1,.3,1), filter .5s ease;
  filter:saturate(.96) contrast(1.01);
}
.ph-card:hover .ph-img{ transform:scale(1.05); filter:saturate(1.05) contrast(1.03) brightness(1.05); }

/* 图注：悬停浮现 */
.ph-shade{
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.78) 0%, rgba(0,0,0,.3) 32%, rgba(0,0,0,0) 64%);
  opacity:0;
  transition:opacity .4s ease;
  pointer-events:none;
}
.ph-meta{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:15px 13px 12px;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  opacity:0;
  transform:translateY(5px);
  transition:opacity .38s ease, transform .38s ease;
}
.ph-card:hover .ph-shade,
.ph-card:hover .ph-meta{ opacity:1; transform:translateY(0); }
.ph-title{
  font-family:var(--serif);
  font-size:13.5px;
  letter-spacing:.05em;
  color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.7);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ph-date{
  font-size:10px;
  letter-spacing:.12em;
  color:rgba(255,255,255,.7);
  font-variant-numeric:tabular-nums;
  flex:0 0 auto;
}
@media (hover:none){
  .ph-shade{ opacity:1; background:linear-gradient(to top, rgba(0,0,0,.84) 0%, rgba(0,0,0,.3) 36%, rgba(0,0,0,0) 66%); }
  .ph-meta{ opacity:1; transform:none; }
  .ph-card:hover .ph-img{ transform:none; filter:saturate(.96) contrast(1.01); }
}

.ph-frame.ph-empty{ padding-top:66%; }
.ph-frame.ph-empty:after{
  content:"暂无封面";
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:10.5px; letter-spacing:.2em; color:rgba(244,241,236,.26);
}

/* ---------- 分页 / 页脚 ---------- */
.ph-pager{
  text-align:center;
  padding:6px 20px 34px;
  font-size:10.5px;
  letter-spacing:.22em;
  color:rgba(244,241,236,.32);
}
.ph-pager a{ color:rgba(244,241,236,.75); border-bottom:1px solid var(--line); padding-bottom:2px; }
.ph-pager a:hover{ color:#fff; }

footer.site-foot{
  padding:16px 20px 40px;
  text-align:center;
  font-size:10.5px;
  letter-spacing:.16em;
  color:rgba(244,241,236,.26);
  border-top:1px solid rgba(244,241,236,.06);
}
.site-foot a{ color:rgba(244,241,236,.46); }
.site-foot a:hover{ color:#fff; }

/* ---------- 详情页 ---------- */
body.post-template{ background:var(--bg); }
.ph-post{ max-width:1200px; margin:0 auto; padding:10px clamp(14px,3.4vw,52px) 34px; }
.ph-post-head{ text-align:center; padding:22px 0 30px; }
.ph-post-title{
  font-family:var(--serif);
  font-size:clamp(20px,2.3vw,28px);
  font-weight:400;
  letter-spacing:.1em;
  color:var(--ink);
  margin:0 0 12px;
}
.ph-post-date{ font-size:10.5px; letter-spacing:.22em; color:rgba(244,241,236,.4); }
.ph-post-body{ font-size:14.5px; line-height:1.95; color:rgba(244,241,236,.8); }
.ph-post-body p{ margin:0 0 20px; }
.ph-post-body img{
  width:100%; height:auto; display:block;
  margin:0 0 8px;
  background:var(--bg-soft);
}
.ph-post-body a{ color:var(--ink); border-bottom:1px solid var(--line); }
.ph-back{ text-align:center; padding:40px 0 6px; }
.ph-back a{
  display:inline-block;
  font-size:10.5px;
  letter-spacing:.26em;
  color:rgba(244,241,236,.5);
  border:1px solid rgba(244,241,236,.14);
  padding:10px 24px;
  transition:all .35s ease;
}
.ph-back a:hover{ color:#fff; border-color:rgba(244,241,236,.55); }

/* ---------- 灯箱 ---------- */
.ph-lb{
  position:fixed; inset:0;
  z-index:9999;
  background:rgba(6,6,7,.97);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden;
  transition:opacity .32s ease, visibility .32s ease;
}
.ph-lb.is-open{ opacity:1; visibility:visible; }
.ph-lb img{
  max-width:94vw;
  max-height:90vh;
  object-fit:contain;
  transform:scale(.985);
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
.ph-lb.is-open img{ transform:scale(1); }
.ph-lb-cap{
  position:absolute; left:0; right:0; bottom:22px;
  text-align:center;
  font-size:11px;
  letter-spacing:.22em;
  color:rgba(244,241,236,.55);
}
.ph-lb-close{
  position:absolute; top:16px; right:18px;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  font-size:22px; line-height:1;
  color:rgba(244,241,236,.66);
  background:none; border:none; cursor:pointer;
  transition:color .3s ease, transform .3s ease;
}
.ph-lb-close:hover{ color:#fff; transform:rotate(90deg); }

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .ph-wall, .ph-wall.ph-w4{ column-count:3; }
}
@media (max-width:760px){
  .ph-wall, .ph-wall.ph-w4, .ph-wall.ph-w3{ column-count:2; column-gap:6px; padding:0 6px 26px; }
  .ph-card{ margin-bottom:6px; }
  header.site-head{ padding:24px 16px 18px; }
  header.site-head .branding h1.site-title{ font-size:17px; letter-spacing:.34em; text-indent:.34em; }
  header.site-head .site-desc{ font-size:10px; }
  .ph-title{ font-size:12.5px; }
  .ph-date{ font-size:9.5px; }
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{ animation:none !important; transition:none !important; }
}

/* ============================================================
   v7 相册：张数标记 + 灯箱翻页
   ============================================================ */
.ph-count{
  position:absolute;
  top:10px; right:10px;
  z-index:2;
  padding:3px 8px;
  font-size:9.5px;
  letter-spacing:.14em;
  color:rgba(255,255,255,.88);
  background:rgba(0,0,0,.42);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-radius:2px;
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}
.ph-card:hover .ph-count{ opacity:1; }
@media (hover:none){ .ph-count{ opacity:1; } }

.ph-lb-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:56px; height:72px;
  display:flex; align-items:center; justify-content:center;
  font-size:34px; line-height:1;
  color:rgba(255,255,255,.55);
  background:none; border:none; cursor:pointer;
  transition:color .25s ease, background .25s ease;
  z-index:3;
}
.ph-lb-nav:hover{ color:#fff; background:rgba(255,255,255,.05); }
.ph-lb-prev{ left:0; }
.ph-lb-next{ right:0; }

.ph-lb-bar{
  position:absolute;
  left:0; right:0; bottom:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  font-size:10.5px;
  letter-spacing:.2em;
  color:rgba(244,241,236,.5);
}
.ph-lb-num{
  font-variant-numeric:tabular-nums;
  color:rgba(244,241,236,.75);
}
.ph-lb-cap{ color:rgba(244,241,236,.5); }

/* 详情页：正文图片纵向成册 */
.ph-post-body img{ cursor:zoom-in; }

@media (max-width:560px){
  .ph-lb-nav{ width:44px; height:64px; font-size:26px; }
  .ph-lb-bar{ bottom:14px; gap:12px; font-size:10px; }
}

/* ============================================================
   v9 整组查看：全屏纵向照片流
   ============================================================ */
.ph-lb{
  display:block;             /* 覆盖旧的居中 flex，改成可滚动容器 */
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  padding:0;
}
.ph-lb.is-open{ display:block; }
.ph-lb-head{
  position:sticky;
  top:0;
  z-index:6;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 22px 14px;
  font-size:11px;
  letter-spacing:.2em;
  color:rgba(244,241,236,.62);
  background:linear-gradient(to bottom, rgba(6,6,7,.96) 30%, rgba(6,6,7,0));
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.ph-lb-num{ color:rgba(244,241,236,.42); font-variant-numeric:tabular-nums; }
.ph-lb-close{
  position:fixed;
  top:10px; right:14px;
  z-index:8;
  width:44px; height:44px;
}
.ph-lb-list{
  width:min(1080px, 100%);
  margin:0 auto;
  padding:6px 0 40px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ph-lb-list img{
  width:100%;
  height:auto;
  max-width:none;
  max-height:none;
  object-fit:contain;
  display:block;
  background:#101012;
  transform:none !important;
}
@media (max-width:760px){
  .ph-lb-list{ width:100%; gap:4px; padding-bottom:24px; }
  .ph-lb-head{ padding:12px 16px 12px; font-size:10px; }
  .ph-lb-close{ top:4px; right:6px; }
}

/* v10 张数常显 */
.ph-count{opacity:1 !important;font-size:10px;letter-spacing:.1em;padding:3px 7px;background:rgba(0,0,0,.55);color:rgba(255,255,255,.94);}
.ph-card:hover .ph-count{opacity:1;}

/* ============================================================
   v11 张数标记重做：叠照片图标 + 数字，无胶囊底，融入画面
   ============================================================ */
.ph-count{
  position:absolute;
  top:10px; right:11px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:0;
  margin:0;
  background:none !important;        /* 清掉旧胶囊底色 */
  border-radius:0;
  font-family:var(--sans);
  font-size:10.5px;
  font-weight:400;
  letter-spacing:.06em;
  line-height:1;
  color:rgba(255,255,255,.96) !important;
  font-variant-numeric:tabular-nums;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  opacity:1 !important;
  pointer-events:none;
  transition:opacity .3s ease;
}
/* 叠照片小图标：两层错位描边方块 */
.ph-count:before{
  content:"";
  width:7px; height:7px;
  border:1.1px solid rgba(255,255,255,.95);
  border-radius:1px;
  box-shadow:2.2px -2.2px 0 -.4px rgba(255,255,255,.55);
  filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.5));
}
/* 极淡的暗角托底，只在图标数字周围，肉眼几乎看不出是块底 */
.ph-count:after{
  content:"";
  position:absolute;
  inset:-7px -9px -7px -9px;
  z-index:-1;
  border-radius:6px;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.34) 0%, rgba(0,0,0,0) 72%);
}

/* ============================================================
   v12 图注下移：照片上零标记，张数与日期在照片下方一行
   ============================================================ */
.ph-card{ margin:0 0 20px; }

/* 悬停时压在照片上的标题（唯一一处图上文字） */
.ph-cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:30px 12px 11px;
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.04em;
  line-height:1.35;
  color:#fff;
  text-align:left;
  background:linear-gradient(to top, rgba(0,0,0,.7) 0%, rgba(0,0,0,.28) 46%, rgba(0,0,0,0) 100%);
  opacity:0;
  transform:translateY(4px);
  transition:opacity .38s ease, transform .38s ease;
  pointer-events:none;
}
.ph-card:hover .ph-cap{ opacity:1; transform:translateY(0); }
@media (hover:none){ .ph-cap{ opacity:1; transform:none; } }

/* 图注行：照片下方，常显 */
.ph-meta{
  position:static !important;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 1px 0 !important;
  margin:0;
  opacity:1 !important;
  transform:none !important;
  line-height:1;
  font-size:10px;
  letter-spacing:.1em;
}
.ph-date{
  color:rgba(244,241,236,.40) !important;
  font-size:10px !important;
  letter-spacing:.1em !important;
  flex:0 0 auto;
}
/* 张数：叠照片小图标 + 数字，暗底上的米白，清晰不抢 */
.ph-count{
  position:static !important;
  display:inline-flex !important;
  align-items:center;
  gap:5px;
  padding:0 !important;
  background:none !important;
  border-radius:0;
  color:rgba(244,241,236,.60) !important;
  font-size:10px !important;
  letter-spacing:.1em !important;
  text-shadow:none !important;
  font-variant-numeric:tabular-nums;
  opacity:1 !important;
  transition:color .3s ease;
}
.ph-count:hover{ color:rgba(244,241,236,.95) !important; }
.ph-count:before{
  content:"";
  width:7px; height:7px;
  border:1px solid rgba(244,241,236,.42);
  border-radius:1px;
  box-shadow:2px -2px 0 -.5px rgba(244,241,236,.20);
  transition:border-color .3s ease, box-shadow .3s ease;
}
.ph-count:hover:before{
  border-color:rgba(244,241,236,.8);
  box-shadow:2px -2px 0 -.5px rgba(244,241,236,.45);
}
.ph-count:after{ display:none !important; }

/* 空封面占位保持原样 */
.ph-frame.ph-empty{ padding-top:66%; }

@media (max-width:760px){
  .ph-card{ margin:0 0 14px; }
  .ph-meta{ padding:6px 1px 0 !important; font-size:9.5px; }
  .ph-date, .ph-count{ font-size:9.5px !important; letter-spacing:.08em !important; }
  .ph-count:before{ width:6px; height:6px; }
}

/* ============================================================
   v13 图注行收尾：去图标、提亮、松开间距；手机上照片不挂标题
   ============================================================ */
.ph-meta{
  padding:11px 1px 0 !important;
  gap:12px;
}
.ph-count{
  font-size:10px !important;
  letter-spacing:.09em !important;
  color:rgba(244,241,236,.74) !important;
}
.ph-count:before{ display:none !important; }      /* 小图标在极小字号下糊成一团，去掉 */
.ph-count:after{ display:none !important; }
.ph-date{
  font-size:10px !important;
  letter-spacing:.09em !important;
  color:rgba(244,241,236,.50) !important;
}
/* 手机：照片上不常挂标题，保持画面干净 */
@media (hover:none){
  .ph-cap{ opacity:0 !important; transform:translateY(4px) !important; }
  .ph-meta{ padding:9px 1px 0 !important; }
  .ph-count, .ph-date{ font-size:9.5px !important; }
}

/* ============================================================
   v14 图注行：左对齐一行「N 张 · 日期」，字号加大更实
   ============================================================ */
.ph-meta{
  justify-content:flex-start !important;
  align-items:baseline;
  gap:0 !important;
  padding:10px 1px 0 !important;
  font-size:11px;
}
.ph-count{
  font-size:11px !important;
  letter-spacing:.06em !important;
  font-weight:400;
  color:rgba(244,241,236,.66) !important;
}
.ph-date{
  font-size:11px !important;
  letter-spacing:.06em !important;
  color:rgba(244,241,236,.46) !important;
}
/* 中间用一点分隔，不用撑到两端 */
.ph-date:before{
  content:"·";
  margin:0 7px;
  color:rgba(244,241,236,.28);
}
@media (max-width:760px){
  .ph-meta{ padding:9px 1px 0 !important; font-size:10.5px; }
  .ph-count, .ph-date{ font-size:10.5px !important; letter-spacing:.05em !important; }
  .ph-date:before{ margin:0 6px; }
}
