/* 돌잔치 ① 성장 앨범 · 버터 크림 + 더스티 피치 + 세이지, 둥근 글꼴 */
:root{
  --page:#EFE6DA; --paper:#FBF6EE; --fg:#3E3630; --sub:#958779; --line:#EADFD0;
  --accent:#C98468; --on-accent:#fff; --sun:#C98468; --sage:#9DAE94;
  --font:'Gowun Dodum',-apple-system,sans-serif; --disp:'Fraunces',Georgia,serif; --pen:'Nanum Pen Script',cursive;
  --card:#FBF6EE; --fab-bg:rgba(62,54,48,.4);
}
body{background:var(--page)}
.book{max-width:480px;margin:0 auto;background:var(--paper);overflow:hidden;box-shadow:0 0 50px rgba(90,70,50,.12)}
.k{font:italic 400 15px/1 var(--disp);color:var(--accent);letter-spacing:.04em;margin-bottom:10px}
h2{font-size:23px;font-weight:400;margin-bottom:22px}
.sub{color:var(--sub);font-size:13.5px;line-height:1.8;margin-bottom:18px}
.sec{padding:64px 26px 20px;text-align:center}
/* 표지 */
.cv{position:relative}
.cv img{width:100%;height:auto}
.cv::after{content:"";position:absolute;inset:auto 0 0;height:46%;background:linear-gradient(transparent,var(--paper) 88%)}
.cv-t{position:absolute;left:0;right:0;bottom:6px;z-index:2;text-align:center;padding:0 20px}
.cv-en{font:italic 300 22px/1 var(--disp);color:var(--accent)}
.cv-t h1{font-weight:400;font-size:34px;letter-spacing:.06em;margin:10px 0 8px}
.cv-t h1 small{display:block;font-size:15px;letter-spacing:.04em;color:var(--fg);margin-top:4px}
.cv-d{font-size:13.5px;color:var(--sub);line-height:1.8}
/* 편지 */
.lt{font-size:15px;line-height:2.1;text-align:center}
.sig{font:400 28px/1 var(--pen);color:var(--accent);margin:16px 0 34px}
.par{border-top:1px dashed var(--line);padding-top:28px}
.lt2{font-size:14px;line-height:2;color:#5A5047}
.pn{margin-top:16px;font-size:14px}
.pn b{font-weight:400;font-size:16px}
/* 1년 */
.ms{margin:0 -6px 40px}
.ms-ph{display:block;width:100%;border-radius:200px 200px 14px 14px;overflow:hidden;box-shadow:0 14px 30px rgba(120,90,60,.16)}
.ms-ph img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ms figcaption{margin-top:16px;font-size:14px;line-height:1.8;color:#5A5047}
.ms figcaption b{display:block;font-size:19px;font-weight:400;color:var(--fg)}
.dn{display:inline-block;font:500 12px/1 var(--disp);letter-spacing:.12em;color:#fff;background:var(--sage);padding:6px 10px;border-radius:20px;margin-bottom:8px}
/* 돌잡이 */
.dj{background:#F4EDE2}
.djs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.dc{background:#fff;border-radius:16px;padding:16px 6px 12px;box-shadow:0 4px 10px rgba(120,90,60,.08);transition:transform .2s,box-shadow .2s;border:2px solid transparent}
.dc b{display:block;font-size:16px;font-weight:400;margin-bottom:4px}
.dc span{font-size:11.5px;color:var(--sub);line-height:1.4;display:block}
.dc.on{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 10px 18px rgba(201,132,104,.25)}
.dj-go{border-radius:30px}
/* 잔치 */
.big{font:300 84px/1 var(--disp);color:var(--fg);margin-bottom:8px}
.prog{list-style:none;text-align:left;max-width:300px;margin:6px auto 26px;border-left:2px solid var(--line);padding-left:18px}
.prog li{position:relative;padding:6px 0;font-size:14.5px}
.prog li::before{content:"";position:absolute;left:-24px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--accent)}
.prog span{display:inline-block;width:58px;font:500 14px var(--disp);color:var(--accent)}
.day .cal{margin-bottom:16px}
.cal td.on span{border-radius:50%}
.dd{font-size:14.5px;margin-bottom:18px}.dd b{font:500 24px var(--disp);color:var(--accent)}
.btn-line{border-radius:30px}
.btn-solid{border-radius:30px}
.place .map{border-radius:18px;overflow:hidden;margin-top:6px}
.place .ways,.place .maplinks{text-align:left}
.maplinks a,.maplinks button{border-radius:12px}
/* 갤러리 */
.gps{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gp{border-radius:14px;overflow:hidden}
.gp img{width:100%;aspect-ratio:1;object-fit:cover}
.gp:nth-child(3n+1){grid-column:span 2}
.gp:nth-child(3n+1) img{aspect-ratio:16/10}
.gb{margin-top:34px;text-align:left}
.gb-head{display:flex;justify-content:space-between;align-items:center}
.gb-head h3{font-size:17px;font-weight:400}
.heart{text-align:left}.heart .k{text-align:center}
.cts{margin-top:18px}
.ft{text-align:center;padding:40px 24px 50px}
.ft-t{font:400 24px/1.4 var(--pen);color:var(--accent);margin-bottom:20px}
.sh{display:flex;gap:8px;justify-content:center}
.chips span{border-radius:22px}
/* 1년 보기 시작 화면 */
.gw-intro{position:fixed;inset:0;z-index:70;background:var(--paper);display:flex;align-items:center;justify-content:center;transition:opacity 1s,visibility 1s}
.gw-intro.gone{opacity:0;visibility:hidden}
.gw-start{text-align:center;padding:0 24px;transition:opacity .6s}
.gw-k{font:500 13px/1 var(--disp);letter-spacing:.4em;color:var(--accent);padding-left:.4em}
.gw-t{font-size:30px;margin:18px 0 34px;line-height:1.4}
.gw-t small{display:block;font-size:17px;color:var(--sub)}
.gw-btn{background:var(--accent);color:#fff;padding:15px 28px;border-radius:30px;font-size:15px;box-shadow:0 10px 22px rgba(201,132,104,.35)}
.gw-n{font-size:12px;color:var(--sub);margin-top:14px}
.gw-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .6s}
.run .gw-start{opacity:0;pointer-events:none}
.run .gw-stage{opacity:1}
.gw-ph{position:relative;width:min(70vw,300px);aspect-ratio:4/5;border-radius:200px 200px 16px 16px;overflow:hidden;box-shadow:0 20px 40px rgba(120,90,60,.2)}
.gw-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .7s,transform 1.6s}
.gw-ph img.on{opacity:1;transform:none}
.gw-day{margin-top:26px;font:300 64px/1 var(--disp);color:var(--fg);font-variant-numeric:tabular-nums}
.gw-day span{font:400 16px var(--font);color:var(--sub);margin-left:6px}
.gw-lab{font:400 26px/1 var(--pen);color:var(--accent);margin-top:12px;min-height:26px}
.gw-stage{pointer-events:none}.gw-start{position:relative;z-index:2}