/* =========================================================
   XQ & LSJ — 恋爱纪念册
   配色：奶油底 + 玫瑰粉 + 金铜点缀 + 深李子文字
   ========================================================= */

:root{
  --cream:#FFF9F6;
  --cream-2:#FFF3F1;
  --blush:#FFE9EE;
  --blush-2:#FBD8E0;
  --rose-100:#F8C9D4;
  --rose-300:#EE9BAE;
  --rose-500:#D4556F;
  --rose-600:#BC3F5A;
  --rose-700:#9C2F49;
  --plum:#5A2A3C;
  --ink:#3B2730;
  --ink-2:#6E5560;
  --ink-3:#9A8390;
  --gold:#C79A5B;
  --gold-soft:#E8CFA8;
  --line:#F1DBE1;
  --white:#fff;
  --shadow-s:0 1px 2px rgba(90,42,60,.05), 0 4px 14px rgba(90,42,60,.06);
  --shadow-m:0 2px 6px rgba(90,42,60,.06), 0 14px 34px rgba(90,42,60,.10);
  --shadow-l:0 30px 70px rgba(90,42,60,.18);
  --r-s:10px; --r-m:16px; --r-l:24px; --r-xl:32px;
  --wrap:1120px;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Songti SC","STSong",SimSun,"Noto Serif CJK SC",serif;
  --sans:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Hiragino Sans GB","Noto Sans CJK SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  --nav-h:64px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 12px)}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--cream);
  line-height:1.75;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block; border:0}
a{color:inherit; text-decoration:none}
button,input,textarea{font:inherit; color:inherit}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.86em; background:var(--blush); padding:.1em .4em; border-radius:5px; color:var(--rose-700)}
::selection{background:var(--rose-100); color:var(--plum)}

.wrap{width:100%; max-width:var(--wrap); margin:0 auto; padding:0 clamp(18px,4vw,32px)}

/* ---------- 飘落花瓣 ---------- */
.petals{position:fixed; inset:0; pointer-events:none; z-index:60; overflow:hidden}
.petal{
  position:absolute; top:-8vh; width:12px; height:12px;
  background:radial-gradient(circle at 30% 30%, var(--rose-100), var(--rose-300));
  border-radius:60% 0 60% 0; opacity:.55;
  animation:fall linear infinite;
}
@keyframes fall{
  0%{transform:translate3d(0,-10vh,0) rotate(0deg)}
  100%{transform:translate3d(var(--dx,20px),110vh,0) rotate(540deg)}
}

/* ---------- 导航 ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; height:var(--nav-h); z-index:70;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(18px,4vw,32px);
  transition:background .3s, box-shadow .3s, backdrop-filter .3s;
}
.nav.is-solid{
  background:rgba(255,249,246,.82);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  backdrop-filter:saturate(160%) blur(14px);
  box-shadow:0 1px 0 var(--line), 0 8px 26px rgba(90,42,60,.06);
}
.nav__brand{display:flex; align-items:center; gap:10px}
.nav__mark{
  font-family:var(--serif); font-size:19px; letter-spacing:.08em; color:var(--plum);
  font-weight:600;
}
.nav__mark i{color:var(--rose-500); font-style:normal; margin:0 .18em}
.nav.is-solid .nav__mark{color:var(--plum)}
.nav__links{display:flex; gap:clamp(14px,2.4vw,30px)}
.nav__links a{
  font-size:14.5px; color:var(--ink-2); position:relative; padding:6px 2px;
  transition:color .25s;
}
.nav__links a::after{
  content:""; position:absolute; left:50%; bottom:0; width:0; height:1.5px;
  background:var(--rose-500); transform:translateX(-50%); transition:width .3s;
}
.nav__links a:hover{color:var(--rose-600)}
.nav__links a:hover::after,.nav__links a.is-active::after{width:100%}
.nav__links a.is-active{color:var(--rose-600)}
.nav__toggle{
  display:none; width:40px; height:40px; border:0; background:transparent;
  border-radius:10px; cursor:pointer; position:relative;
}
.nav__toggle span{
  position:absolute; left:10px; right:10px; height:1.8px; background:var(--plum);
  border-radius:2px; transition:.3s;
}
.nav__toggle span:nth-child(1){top:14px}
.nav__toggle span:nth-child(2){top:19px}
.nav__toggle span:nth-child(3){top:24px}
.nav__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  padding:calc(var(--nav-h) + 46px) 0 72px; overflow:hidden;
}
.hero__bg{
  position:absolute; inset:0;
  background-image:url("../img/bokeh.jpg");
  background-size:cover; background-position:center;
  transform:scale(1.06);
  filter:saturate(88%);
}
.hero__veil{
  position:absolute; inset:0;
  background:
    radial-gradient(90% 70% at 78% 18%, rgba(255,222,232,.86) 0%, rgba(255,240,238,0) 62%),
    radial-gradient(80% 70% at 12% 88%, rgba(255,235,228,.92) 0%, rgba(255,240,238,0) 60%),
    linear-gradient(160deg, rgba(255,250,247,.94) 0%, rgba(255,244,244,.9) 46%, rgba(255,236,240,.86) 100%);
}
.hero__inner{position:relative; z-index:2; width:100%; max-width:var(--wrap); margin:0 auto; padding:0 clamp(18px,4vw,32px); text-align:center}
.hero__eyebrow{
  font-size:12.5px; letter-spacing:.34em; color:var(--rose-600);
  margin:0 0 18px; text-transform:uppercase;
}
.hero__title{
  font-family:var(--serif); font-weight:600; color:var(--plum);
  font-size:clamp(44px,9.4vw,96px); line-height:1.05; margin:0;
  letter-spacing:.04em;
}
.hero__title .amp{color:var(--rose-500); font-style:italic; font-size:.72em; margin:0 .06em}
.hero__sub{
  font-family:var(--serif); font-size:clamp(17px,2.5vw,23px); color:var(--ink);
  margin:22px auto 0; max-width:38ch; line-height:1.7;
}
.hero__desc{font-size:15px; color:var(--ink-2); max-width:52ch; margin:14px auto 0; line-height:1.9}

/* 计数器 */
.counter{
  display:inline-block; margin:36px auto 0; padding:20px clamp(18px,4vw,34px);
  background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.9);
  border-radius:var(--r-xl); box-shadow:var(--shadow-m);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.counter__label{font-size:13px; letter-spacing:.18em; color:var(--ink-3); margin:0 0 12px}
.counter__units{display:flex; align-items:flex-end; gap:clamp(12px,3.4vw,30px); justify-content:center}
.unit{display:flex; flex-direction:column; align-items:center; min-width:52px}
.unit b{
  font-family:var(--serif); font-variant-numeric:tabular-nums;
  font-size:clamp(26px,5.4vw,46px); line-height:1; color:var(--rose-600);
  font-weight:600;
}
.unit i{font-style:normal; font-size:12px; color:var(--ink-3); margin-top:7px; letter-spacing:.1em}

/* 日期卡 */
.dates{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:30px}
.date-card{
  background:rgba(255,255,255,.7); border:1px solid var(--white);
  border-radius:var(--r-m); padding:14px 22px; min-width:196px;
  box-shadow:var(--shadow-s); text-align:left;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.date-card--main{background:linear-gradient(160deg,#fff,rgba(255,233,238,.9)); border-color:var(--blush-2)}
.date-card__k{display:block; font-size:12px; letter-spacing:.16em; color:var(--ink-3)}
.date-card__v{display:block; font-family:var(--serif); font-size:22px; color:var(--plum); margin:4px 0 2px}
.date-card__x{font-size:12.5px; color:var(--rose-600)}

.scroll-hint{
  display:inline-flex; flex-direction:column; align-items:center; gap:8px;
  margin-top:40px; font-size:11.5px; letter-spacing:.24em; color:var(--ink-3);
}
.scroll-hint i{width:1px; height:34px; background:linear-gradient(var(--rose-300),transparent); animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.35; transform:scaleY(.7)}50%{opacity:1; transform:scaleY(1)}}

/* ---------- 数据条 ---------- */
.strip{
  background:linear-gradient(180deg, var(--cream-2), var(--cream));
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.strip__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding-top:34px; padding-bottom:34px}
.stat{text-align:center; padding:6px 4px; position:relative}
.stat + .stat::before{
  content:""; position:absolute; left:0; top:12%; bottom:12%; width:1px; background:var(--line);
}
.stat b{
  display:block; font-family:var(--serif); font-size:clamp(22px,3.4vw,34px);
  color:var(--rose-600); font-variant-numeric:tabular-nums; line-height:1.2;
}
.stat span{font-size:12.5px; color:var(--ink-3); letter-spacing:.06em}

/* ---------- 通用 section ---------- */
.section{padding:clamp(62px,9vw,104px) 0; position:relative}
.section--alt{background:linear-gradient(180deg,var(--cream),var(--cream-2) 30%,var(--cream)); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.sec-head{max-width:640px; margin-bottom:clamp(34px,5vw,54px)}
.sec-head__k{
  display:block; font-size:11.5px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--rose-500); margin-bottom:12px;
}
.sec-head__t{
  font-family:var(--serif); font-size:clamp(27px,4.6vw,40px); color:var(--plum);
  margin:0 0 12px; font-weight:600; letter-spacing:.02em;
}
.sec-head__d{margin:0; color:var(--ink-2); font-size:15px}

/* ---------- 时间线 ---------- */
.timeline{list-style:none; margin:0; padding:0; position:relative}
.timeline::before{
  content:""; position:absolute; left:27px; top:8px; bottom:8px; width:1.5px;
  background:linear-gradient(180deg,transparent,var(--rose-100) 8%,var(--rose-100) 88%,transparent);
}
.tl-item{position:relative; padding:0 0 clamp(26px,4vw,40px) 78px}
.tl-item:last-child{padding-bottom:0}
.tl-dot{
  position:absolute; left:12px; top:20px; width:32px; height:32px; border-radius:50%;
  background:var(--white); border:1.5px solid var(--rose-100);
  display:grid; place-items:center; color:var(--rose-500);
  box-shadow:0 4px 12px rgba(212,85,111,.14); z-index:2;
}
.tl-dot svg{width:16px; height:16px; fill:currentColor}
.tl-card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-l);
  padding:clamp(20px,3vw,28px); box-shadow:var(--shadow-s);
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.tl-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-m)}
.tl-meta{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:10px}
.tl-date{font-family:var(--serif); font-size:19px; color:var(--rose-600); font-variant-numeric:tabular-nums}
.tl-tag{
  font-size:11.5px; letter-spacing:.12em; padding:3px 10px; border-radius:999px;
  background:var(--blush); color:var(--rose-700); border:1px solid var(--blush-2);
}
.tl-title{font-family:var(--serif); font-size:clamp(18px,2.6vw,23px); color:var(--plum); margin:0 0 8px; font-weight:600}
.tl-text{margin:0; color:var(--ink-2); font-size:14.8px; line-height:1.95}
.tl-item--now .tl-dot{background:var(--rose-500); border-color:var(--rose-500); color:#fff}
.tl-item--now .tl-card{border-color:var(--blush-2); background:linear-gradient(160deg,#fff, rgba(255,233,238,.55))}
.tl-item--future .tl-dot{border-style:dashed}

/* 纪念日列表 */
.anniv{margin-top:clamp(46px,7vw,72px)}
.anniv__t{font-family:var(--serif); font-size:20px; color:var(--plum); margin:0 0 18px; font-weight:600}
.anniv__list{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:12px}
.anniv__list li{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-m);
  padding:14px 18px; box-shadow:var(--shadow-s);
}
.anniv__list em{font-style:normal; font-size:14px; color:var(--ink-2)}
.anniv__list b{font-family:var(--serif); font-size:14px; color:var(--ink-3); white-space:nowrap}
.anniv__list li.is-next{border-color:var(--rose-300); background:linear-gradient(150deg,#fff,var(--blush))}
.anniv__list li.is-next b{color:var(--rose-600)}
.anniv__list li.is-past{opacity:.62}
.anniv__list li.is-past b{color:var(--gold); text-decoration:line-through; text-decoration-thickness:1px}

/* ---------- 相册 ---------- */
.chips{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:22px}
.chip{
  border:1px solid var(--line); background:var(--white); color:var(--ink-2);
  border-radius:999px; padding:7px 18px; font-size:13.5px; cursor:pointer;
  transition:.25s;
}
.chip:hover{border-color:var(--rose-300); color:var(--rose-600)}
.chip.is-on{background:var(--rose-500); border-color:var(--rose-500); color:#fff; box-shadow:0 6px 18px rgba(212,85,111,.28)}

.gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:clamp(10px,1.6vw,16px)}
.gal{
  position:relative; border:0; padding:0; margin:0; background:var(--blush);
  border-radius:var(--r-m); overflow:hidden; cursor:zoom-in; aspect-ratio:4/3;
  box-shadow:var(--shadow-s); transition:transform .4s cubic-bezier(.2,.7,.3,1), box-shadow .4s;
}
.gal img{width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.3,1); opacity:0}
.gal img.is-loaded{opacity:1; transition:opacity .5s, transform .6s cubic-bezier(.2,.7,.3,1)}
.gal:hover{transform:translateY(-4px); box-shadow:var(--shadow-m)}
.gal:hover img{transform:scale(1.07)}
.gal::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,transparent 42%, rgba(59,39,48,.62));
  opacity:0; transition:opacity .35s;
}
.gal:hover::after{opacity:1}
.gal figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:14px 16px;
  color:#fff; font-size:13.5px; text-align:left; transform:translateY(8px);
  opacity:0; transition:.35s; text-shadow:0 1px 6px rgba(0,0,0,.4);
}
.gal:hover figcaption{transform:none; opacity:1}
.gal.is-hidden{display:none}

/* ---------- 清单 ---------- */
.wishes{display:grid; grid-template-columns:repeat(auto-fill,minmax(272px,1fr)); gap:12px}
.wish{
  display:flex; gap:14px; align-items:flex-start;
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-m);
  padding:18px 20px; cursor:pointer; box-shadow:var(--shadow-s);
  transition:.3s; user-select:none;
}
.wish:hover{border-color:var(--rose-300); transform:translateY(-2px)}
.wish__box{
  flex:0 0 auto; width:22px; height:22px; border-radius:7px; margin-top:2px;
  border:1.5px solid var(--blush-2); background:var(--cream); position:relative;
  transition:.25s;
}
.wish__box::after{
  content:""; position:absolute; left:6.5px; top:2.5px; width:6px; height:11px;
  border:2px solid #fff; border-top:0; border-left:0; transform:rotate(42deg) scale(.4);
  opacity:0; transition:.25s;
}
.wish__body{min-width:0}
.wish__t{font-size:15px; color:var(--ink); display:block; transition:.25s}
.wish__n{font-size:12.5px; color:var(--ink-3); display:block; margin-top:2px}
.wish.is-done{background:linear-gradient(150deg,#fff,var(--blush)); border-color:var(--blush-2)}
.wish.is-done .wish__box{background:var(--rose-500); border-color:var(--rose-500)}
.wish.is-done .wish__box::after{opacity:1; transform:rotate(42deg) scale(1)}
.wish.is-done .wish__t{color:var(--ink-3); text-decoration:line-through; text-decoration-color:var(--rose-300)}
.wishes__foot{margin:22px 0 0; font-size:13.5px; color:var(--ink-3); text-align:center}
.wishes__foot span{color:var(--rose-600); font-family:var(--serif); font-size:16px}

/* ---------- 留言板 ---------- */
.msg-sec{position:relative}
.msg-sec::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:url("../img/bokeh.jpg"); background-size:cover; background-position:center;
  opacity:.07; mix-blend-mode:multiply;
}
.msg-sec .wrap{position:relative; z-index:2}
.msg-form{
  background:rgba(255,255,255,.86); border:1px solid var(--white);
  border-radius:var(--r-l); padding:clamp(20px,3vw,28px);
  box-shadow:var(--shadow-m); margin-bottom:26px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
.field{margin-bottom:16px; position:relative}
.field--row{margin-bottom:0}
.field label{display:block; font-size:12.5px; letter-spacing:.1em; color:var(--ink-3); margin-bottom:7px}
.field input,.field textarea{
  width:100%; border:1px solid var(--line); background:var(--cream);
  border-radius:var(--r-s); padding:12px 14px; font-size:15px; outline:none;
  transition:.25s; resize:vertical; line-height:1.7;
}
.field input:focus,.field textarea:focus{border-color:var(--rose-300); background:#fff; box-shadow:0 0 0 4px rgba(212,85,111,.1)}
.field input::placeholder,.field textarea::placeholder{color:#BFA9B3}
.field__count{position:absolute; right:12px; bottom:10px; font-size:11.5px; color:var(--ink-3); font-style:normal}
.field__count i{font-style:normal}
.moods{display:flex; gap:8px; flex-wrap:wrap}
.mood{
  border:1px solid var(--line); background:var(--cream); border-radius:999px;
  padding:6px 15px; font-size:13px; cursor:pointer; color:var(--ink-2); transition:.22s;
}
.mood:hover{border-color:var(--rose-300)}
.mood.is-on{background:var(--rose-500); border-color:var(--rose-500); color:#fff}
.msg-form__foot{display:flex; align-items:center; gap:16px; margin-top:20px; flex-wrap:wrap}
.msg-form__note{font-size:13px; color:var(--ink-3)}
.msg-form__note.is-err{color:var(--rose-600)}

.btn{
  border:1px solid transparent; border-radius:999px; cursor:pointer;
  padding:11px 28px; font-size:14.5px; transition:.25s; background:none;
}
.btn--primary{background:var(--rose-500); color:#fff; box-shadow:0 8px 22px rgba(212,85,111,.3)}
.btn--primary:hover{background:var(--rose-600); transform:translateY(-1px); box-shadow:0 12px 26px rgba(212,85,111,.34)}
.btn--primary:disabled{opacity:.55; cursor:not-allowed; transform:none}
.btn--ghost{border-color:var(--line); color:var(--ink-2); padding:7px 18px; font-size:13px; background:#fff}
.btn--ghost:hover{border-color:var(--rose-300); color:var(--rose-600)}

.msg-bar{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px}
.msg-bar__count{font-size:13.5px; color:var(--ink-3)}
.msg-bar__count b{font-family:var(--serif); font-size:18px; color:var(--rose-600)}

.msgs{list-style:none; margin:0; padding:0; display:grid; gap:12px}
.msg{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r-m);
  padding:18px 20px; box-shadow:var(--shadow-s); animation:pop .45s cubic-bezier(.2,.8,.3,1) both;
}
@keyframes pop{from{opacity:0; transform:translateY(10px) scale(.985)}to{opacity:1; transform:none}}
.msg--pinned{background:linear-gradient(150deg,#fff,var(--blush)); border-color:var(--blush-2)}
.msg__head{display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap}
.msg__ava{
  width:32px; height:32px; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(150deg,var(--blush-2),var(--rose-300)); color:#fff;
  font-size:13px; font-family:var(--serif); flex:0 0 auto;
}
.msg__name{font-size:14.5px; color:var(--plum); font-weight:600}
.msg__mood{
  font-size:11px; letter-spacing:.08em; padding:2px 9px; border-radius:999px;
  background:var(--blush); color:var(--rose-700); border:1px solid var(--blush-2);
}
.msg__time{font-size:12px; color:var(--ink-3); margin-left:auto; white-space:nowrap}
.msg__text{margin:0; font-size:15px; color:var(--ink-2); line-height:1.9; white-space:pre-wrap; overflow-wrap:anywhere}
.msg__foot{margin-top:12px; display:flex; gap:14px; align-items:center}
.like{
  display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line);
  background:#fff; border-radius:999px; padding:5px 14px; font-size:12.5px;
  color:var(--ink-2); cursor:pointer; transition:.22s;
}
.like:hover{border-color:var(--rose-300); color:var(--rose-600)}
.like.is-on{border-color:var(--rose-300); background:var(--blush); color:var(--rose-700)}
.like svg{width:13px; height:13px; fill:currentColor; transition:transform .3s}
.like.is-on svg{animation:beat .5s}
@keyframes beat{0%{transform:scale(1)}35%{transform:scale(1.45)}60%{transform:scale(.92)}100%{transform:scale(1)}}
.msgs__empty{text-align:center; color:var(--ink-3); font-size:14px; padding:34px 0; margin:0}

/* ---------- 页脚 ---------- */
.foot{padding:56px 0 44px; background:linear-gradient(180deg,var(--cream-2),#FBEBEF)}
.foot__in{text-align:center}
.foot__heart{color:var(--rose-300); animation:beat 2.6s ease-in-out infinite; display:inline-block}
.foot__note{
  font-family:var(--serif); font-size:clamp(16px,2.4vw,20px); color:var(--plum);
  margin:14px auto 10px; max-width:34em; line-height:1.8; text-wrap:balance;
  padding:0 6px;
}
.foot__meta{font-size:12.5px; color:var(--ink-3); letter-spacing:.06em; margin:0}

/* ---------- 灯箱 ---------- */
.lightbox{
  position:fixed; inset:0; z-index:90; display:grid; place-items:center;
  background:rgba(40,22,30,.93); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  padding:clamp(14px,4vw,54px); animation:fadein .3s;
}
.lightbox[hidden]{display:none}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.lb__fig{margin:0; max-width:100%; max-height:100%; display:flex; flex-direction:column; align-items:center; gap:14px}
.lb__fig img{
  max-width:100%; max-height:74svh; border-radius:var(--r-m);
  box-shadow:0 30px 80px rgba(0,0,0,.5); animation:zoom .35s cubic-bezier(.2,.8,.3,1);
}
@keyframes zoom{from{opacity:0; transform:scale(.96)}to{opacity:1; transform:none}}
.lb__fig figcaption{
  color:#F6E4E9; font-size:14px; display:flex; gap:14px; align-items:center; text-align:center;
}
.lb__fig figcaption em{font-style:normal; color:#B99AA6; font-size:12.5px; font-variant-numeric:tabular-nums}
.lb__close{
  position:absolute; top:14px; right:18px; width:44px; height:44px; border:0; border-radius:50%;
  background:rgba(255,255,255,.12); color:#fff; font-size:26px; line-height:1; cursor:pointer; transition:.25s;
}
.lb__close:hover{background:rgba(255,255,255,.24)}
.lb__nav{
  position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px;
  border:0; border-radius:50%; background:rgba(255,255,255,.1); color:#fff;
  font-size:28px; line-height:1; cursor:pointer; transition:.25s;
}
.lb__nav:hover{background:rgba(255,255,255,.24)}
.lb__prev{left:12px} .lb__next{right:12px}

/* ---------- 滚动出现 ---------- */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1)}
.reveal.is-in{opacity:1; transform:none}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .strip__grid{grid-template-columns:repeat(2,1fr); gap:22px 8px}
  .stat:nth-child(odd)::before{display:none}
  .stat:nth-child(3)::before,.stat:nth-child(4)::before{display:none}
  .stat:nth-child(3),.stat:nth-child(4){border-top:1px solid var(--line); padding-top:22px}
  .anniv__list{grid-template-columns:1fr}
}
@media (max-width:720px){
  :root{--nav-h:58px}
  .nav__toggle{display:block}
  .nav__links{
    position:fixed; top:var(--nav-h); left:0; right:0;
    flex-direction:column; gap:0; padding:8px 18px 18px;
    background:rgba(255,249,246,.97); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
    box-shadow:0 18px 34px rgba(90,42,60,.12);
    border-bottom:1px solid var(--line);
    transform-origin:top; transform:scaleY(.6); opacity:0; pointer-events:none;
    transition:.28s cubic-bezier(.2,.8,.3,1);
  }
  .nav__links.is-open{transform:none; opacity:1; pointer-events:auto}
  .nav__links a{padding:14px 2px; border-bottom:1px solid var(--line); font-size:15.5px}
  .nav__links a:last-child{border-bottom:0}
  .nav__links a::after{display:none}
  .hero{min-height:auto; padding-top:calc(var(--nav-h) + 40px); padding-bottom:56px}
  .hero__title{letter-spacing:.02em}
  .counter{width:100%; padding:18px 14px}
  .counter__units{gap:10px}
  .unit{min-width:0}
  .dates{flex-direction:column; align-items:stretch}
  .date-card{min-width:0}
  .timeline::before{left:15px}
  .tl-item{padding-left:52px}
  .tl-dot{left:0; width:30px; height:30px}
  .gallery{grid-template-columns:repeat(2,1fr); gap:9px}
  .gal figcaption{opacity:1; transform:none; font-size:12px; padding:10px 11px}
  .gal::after{opacity:1; background:linear-gradient(180deg,transparent 48%, rgba(59,39,48,.58))}
  .wishes{grid-template-columns:1fr}
  .msg__time{margin-left:0; width:100%; order:9}
  .lb__nav{width:42px; height:42px; font-size:24px}
  .lb__prev{left:6px} .lb__next{right:6px}
  .lb__fig img{max-height:66svh}
}
@media (max-width:380px){
  .gallery{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important}
  html{scroll-behavior:auto}
  .reveal{opacity:1; transform:none}
  .petals{display:none}
}