/* Trang thiệp đầy đủ (chỉ nạp ở /t/:slug và bản xem trước mẫu) */
/* ===== Trang thiệp ===== */
body.inv{margin:0;background:var(--bg);color:var(--ink);font:15px/1.65 'Be Vietnam Pro',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.paper{max-width:480px;margin:0 auto;background:var(--paper);min-height:100vh;box-shadow:0 0 60px rgba(0,0,0,.08)}
.hero .cv{aspect-ratio:auto;min-height:100svh;max-height:880px}
.sec{padding:44px 28px;text-align:center;border-top:1px solid color-mix(in srgb,var(--acc) 30%,transparent)}
.h{font-family:var(--disp),serif;font-weight:400;color:var(--pri);font-size:34px;margin:0 0 18px;line-height:1.2}
.lead{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--pri);font-weight:600;margin:0 0 20px}
.fams{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 22px;font-size:13.5px}
.fams small{display:block;color:var(--acc);text-transform:uppercase;letter-spacing:.12em;font-weight:600;margin-bottom:4px}
.fams b{display:block;font-weight:600}.fams span{display:block;opacity:.75}
.pair{font-family:var(--disp),serif;color:var(--pri);font-size:40px;line-height:1.1;margin:8px 0}
.pair span{display:block}.pair i{font-style:normal;color:var(--acc);font-size:28px}
.msg{opacity:.85;margin:16px 0 0}
.big-date{display:flex;align-items:center;justify-content:center;gap:18px;margin:6px 0 10px}
.big-date span{font-size:13px;text-transform:uppercase;letter-spacing:.1em;border-top:1px solid var(--acc);border-bottom:1px solid var(--acc);padding:6px 0;min-width:96px}
.big-date b{font-size:58px;color:var(--pri);font-family:var(--disp),serif;font-weight:400;line-height:1}
.time{font-weight:600;font-size:17px;margin:6px 0;display:flex;align-items:center;justify-content:center;gap:6px}
.lunar{font-style:italic;opacity:.75;margin:0 0 18px}
.count{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:18px 0 22px}
.count div{background:color-mix(in srgb,var(--pri) 8%,var(--paper));border:1px solid color-mix(in srgb,var(--pri) 18%,transparent);border-radius:12px;padding:10px 4px}
.count b{display:block;font-size:24px;color:var(--pri)}.count small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;opacity:.7}
.count.done{display:none}
.venue{font-size:20px;font-weight:600;color:var(--pri);margin:0 0 6px}
.addr{display:flex;gap:6px;justify-content:center;align-items:flex-start;opacity:.85;margin:0 0 18px}
.dress{margin:18px 0 0;font-style:italic;opacity:.8}
.c-btn{display:inline-flex;align-items:center;gap:8px;background:var(--pri);color:var(--paper);border:0;border-radius:99px;padding:12px 22px;font:600 14px/1 inherit;font-family:inherit;text-decoration:none;cursor:pointer;transition:transform .15s}
.c-btn:hover{transform:translateY(-1px)}.c-btn.ghost{background:transparent;color:var(--pri);border:1.5px solid var(--pri)}
.tl{list-style:none;margin:0 auto;padding:0;max-width:340px;text-align:left}
.tl li{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:0 0 18px;position:relative}
.tl li::before{content:'';position:absolute;left:73px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--acc)}
.tl li:not(:last-child)::after{content:'';position:absolute;left:77px;top:18px;bottom:0;width:1px;background:color-mix(in srgb,var(--acc) 50%,transparent)}
.tl time{font-weight:700;color:var(--pri);text-align:right}.tl div{padding-left:20px}.tl small{display:block;opacity:.7}
.rt{text-align:left}.rt p{margin:0 0 12px}
.album-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.album-grid .ph{display:block;aspect-ratio:3/4;overflow:hidden;border-radius:10px}
.album-grid .ph.big{grid-column:span 2;aspect-ratio:4/3}
.album-grid img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.album-grid .ph:hover img{transform:scale(1.04)}
.rsvp-form{display:grid;gap:10px;text-align:left}
.rsvp-form input:not([type=radio]),.rsvp-form textarea,.rsvp-form select{width:100%;border:1px solid color-mix(in srgb,var(--ink) 20%,transparent);background:#fff;border-radius:12px;padding:12px 14px;font:inherit;color:var(--ink)}
.seg3{display:grid;gap:6px}
.seg3 label{display:block;cursor:pointer}.seg3 input{position:absolute;opacity:0}
.seg3 span{display:block;border:1px solid color-mix(in srgb,var(--pri) 30%,transparent);border-radius:12px;padding:10px 14px;text-align:center}
.seg3 input:checked+span{background:var(--pri);color:var(--paper);border-color:var(--pri)}
.ppl{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px}.ppl input{width:90px!important}
.rsvp-form .c-btn{justify-content:center}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px}
.sent{background:color-mix(in srgb,var(--pri) 10%,var(--paper));color:var(--pri);border-radius:12px;padding:12px;display:flex;gap:8px;justify-content:center;align-items:center}
.sent.err{background:#fde8e8;color:#9b1c1c}
.muted-s{opacity:.7;font-size:13.5px;margin:-8px 0 18px}
.wish-list{display:grid;gap:10px;max-height:460px;overflow:auto;text-align:left;padding-right:4px}
.wish-list blockquote{margin:0;background:color-mix(in srgb,var(--acc) 10%,var(--paper));border-left:3px solid var(--acc);border-radius:10px;padding:12px 14px}
.wish-list p{margin:0 0 4px}.wish-list cite{font-size:13px;font-style:normal;color:var(--pri);font-weight:600}
.gifts{display:grid;gap:14px}
.gift-card{border:1px solid color-mix(in srgb,var(--acc) 40%,transparent);border-radius:16px;padding:18px;background:#fff}
.gift-card img{width:200px;max-width:100%;height:auto;display:block;margin:10px auto}
.gift-card p{margin:0 0 10px;font-size:14px}.acct{font-weight:700;letter-spacing:.04em}
.disp{font-family:var(--disp),serif;font-size:40px;color:var(--pri);margin:0 0 12px}
.made{text-align:center;font-size:12px;padding:18px;opacity:.6}.made a{color:inherit}
.ico{flex:none}
/* phong bì mở thiệp */
.env{position:fixed;inset:0;z-index:50;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:24px;transition:opacity .7s,transform .7s}
.env-card{width:min(78vw,360px);box-shadow:0 30px 60px rgba(0,0,0,.18);border-radius:6px;overflow:hidden;animation:float 4s ease-in-out infinite}
.env.gone{opacity:0;transform:scale(1.08);pointer-events:none}
@keyframes float{50%{transform:translateY(-8px)}}
.music{position:fixed;right:16px;bottom:16px;z-index:40;width:46px;height:46px;border-radius:50%;border:0;background:var(--pri);color:var(--paper);font-size:20px;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.2)}
.music.on{animation:spin 4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.reveal.in{opacity:1;transform:none}
.wm{position:fixed;inset:0;z-index:30;pointer-events:none;display:flex;align-items:center;justify-content:center;font:700 34px/1.2 'Be Vietnam Pro',sans-serif;color:rgba(0,0,0,.08);transform:rotate(-30deg);text-align:center;text-transform:uppercase}
.lb{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}.lb img{max-width:94vw;max-height:90vh;border-radius:6px}
.lb button{position:absolute;top:12px;right:16px;font-size:34px;color:#fff;background:none;border:0;cursor:pointer}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.env-card{animation:none}}
.yt{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000}.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}