/* 종류 ⑤ 미니멀 카드 · 따뜻한 회색 바탕 위 두꺼운 면지 카드, 블라인드 엠보싱 모노그램, 먹색 한 가지 */
:root{
  --page:#ECEAE6; --paper:#FBFAF7; --fg:#2E2D2B; --sub:#8A8782; --line:#E4E1DB;
  --accent:#2E2D2B; --on-accent:#FBFAF7; --sun:#9A5B4E;
  --font:'Noto Serif KR',serif; --disp:'Cormorant Garamond','Times New Roman',serif;
  --card:#FBFAF7; --fab-bg:rgba(46,45,43,.55);
}
body{background:var(--page);font-weight:300}
.stack{max-width:440px;margin:0 auto;padding:22px 16px 30px;display:flex;flex-direction:column;gap:16px}
.card{background:var(--paper);padding:46px 28px 40px;text-align:center;box-shadow:0 1px 1px rgba(0,0,0,.04),0 10px 30px rgba(60,55,45,.08);position:relative}
.card::before{content:"";position:absolute;inset:8px;border:1px solid var(--line);pointer-events:none}
.k{font:500 11px/1 var(--disp);letter-spacing:.46em;padding-left:.46em;color:var(--sub);margin-bottom:22px}
.sub{font-size:13px;color:var(--sub);line-height:1.9}
hr{border:0;width:28px;height:1px;background:var(--fg);opacity:.4;margin:26px auto}
/* 첫 카드 */
.hero{padding-top:40px}
.greet{font:italic 400 20px/1 var(--disp);color:var(--fg);margin-bottom:26px}
.mono{display:flex;align-items:center;justify-content:center;gap:16px;font:300 66px/1 var(--disp);color:var(--paper);text-shadow:-1px -1px 1px rgba(255,255,255,.9),1px 1px 2px rgba(0,0,0,.2);margin-bottom:26px}
.mono span{width:1px;height:46px;background:rgba(0,0,0,.18);box-shadow:1px 0 0 #fff}
.mono.sm{font-size:34px;gap:10px;margin:0 0 20px;color:var(--page)}
.mono.sm span{height:26px}
.nm{font-weight:400;font-size:24px;letter-spacing:.12em;line-height:1.5;margin:6px 0 18px}
.nm small{display:block;font:italic 300 15px/1.6 var(--disp);letter-spacing:.1em;color:var(--sub)}
.dt{font:500 14px/1 var(--disp);letter-spacing:.24em}
.vn{font-size:13px;color:var(--sub);margin-top:10px}
.frame{margin:34px auto 0;padding:10px;border:1px solid var(--line);width:86%}
.frame img{width:100%;height:auto}
.ready .hero{animation:rise 1.4s cubic-bezier(.22,.61,.36,1) both}
.ready .mono{animation:press 1.6s ease .3s both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}}
@keyframes press{from{opacity:0;letter-spacing:.4em;filter:blur(3px)}}
.letter{font-size:14.5px;line-height:2.1}
.letter b{font-weight:500}
.fam{font-size:14px}
/* 날짜 */
.md{font:300 92px/1 var(--disp);letter-spacing:.02em}
.md i{font-style:normal;font-size:.5em;color:var(--sub);margin:0 .15em;vertical-align:middle}
.cd{font:400 26px/1 var(--disp);letter-spacing:.06em;margin:22px 0 20px;font-variant-numeric:tabular-nums lining-nums}
.cd small{font:300 13px var(--font);color:var(--sub);margin:0 6px 0 3px}
.mini{max-width:280px;margin:0 auto 24px}
.mini td span{width:28px;height:28px;font-size:13px}
.mini td.on span{background:none;color:var(--fg);box-shadow:inset 0 0 0 1px var(--fg)}
/* 사진 한 장씩 */
.view{margin:0 -6px}
.vw{display:block;width:100%;aspect-ratio:3/4;background:#F1EFEA;overflow:hidden}
.vw img{width:100%;height:100%;object-fit:cover;transition:opacity .25s}
.vw img.fade{opacity:0}
.vctl{display:flex;justify-content:space-between;align-items:center;padding:12px 4px 0;font:500 13px/1 var(--disp);letter-spacing:.24em}
.vctl button{width:44px;height:36px;font-size:16px}
.thumbs{display:flex;gap:6px;overflow-x:auto;margin:16px -6px 0;padding-bottom:4px;scrollbar-width:none}
.thumbs::-webkit-scrollbar{display:none}
.thumbs button{flex:0 0 52px;height:52px;opacity:.45;transition:opacity .3s}
.thumbs button.on{opacity:1;outline:1px solid var(--fg);outline-offset:2px}
.thumbs img{width:100%;height:100%;object-fit:cover}
/* 장소 */
.vn2{font-size:19px;letter-spacing:.08em;margin-bottom:6px}
.place .map{margin-top:22px}
.place .ways,.place .maplinks{text-align:left}
.rs .btn-solid{margin-top:22px}
.gb{margin-top:36px;text-align:left}
.gb-head{display:flex;justify-content:space-between;align-items:center}
.gb-head .k{margin:0}
.cts{margin-top:20px;text-align:left}
.acc{text-align:left}
/* 이름 넣은 링크 */
.mk{background:#F4F2EE}
.mkf{display:flex;gap:6px;margin-top:18px}
.mkf input{flex:1;min-width:0;padding:12px;border:1px solid var(--line);background:#fff;font:inherit;font-size:14px;color:var(--fg)}
.mkf .btn-solid{width:auto;padding:12px 16px;font-size:13px}
.mk-out{margin-top:12px;display:flex;gap:8px;align-items:center;justify-content:center;font-size:12px;color:var(--sub);word-break:break-all}
.mk-out .btn-line{padding:7px 12px}
.foot{text-align:center;padding:24px 0 10px}
.sh{display:flex;gap:8px;justify-content:center}
.mono{color:#EDEAE3;text-shadow:-1px -1px 0 #fff,1px 1px 1px rgba(0,0,0,.3)}