/*
 * Tema Cartas (romântica): mesa de linho, envelope com selo e carimbo, carta em papel pautado,
 * flores prensadas em traço e um mural de lembranças presas com fita crepe.
 * Fontes: --f-script (caligrafia à mão) --f-display (serifa delicada) --f-body (leitura)
 * Extra: Caveat para textos escritos à mão mais longos.
 */
.inv-romantica{--x-radius:4px;--x-btn-radius:999px;--x-title:var(--f-script);--hand:"Caveat",var(--f-script);background:var(--t-backdrop);color:var(--t-cover-ink)}
.inv-romantica .book{position:relative;z-index:1}
.desk{position:fixed;z-index:0;top:0;bottom:0;left:50%;width:min(100%,480px);transform:translateX(-50%);background:
  repeating-linear-gradient(0deg,color-mix(in srgb,var(--t-cover-ink) 3%,transparent) 0 1px,transparent 1px 3px),
  repeating-linear-gradient(90deg,color-mix(in srgb,var(--t-cover-ink) 3%,transparent) 0 1px,transparent 1px 4px),
  radial-gradient(90% 60% at 50% 20%,color-mix(in srgb,var(--t-cover) 60%,#fff),var(--t-cover))}
.ruled{background:repeating-linear-gradient(180deg,transparent 0 29px,var(--t-line) 29px 30px),var(--t-paper)}

/* ---------- Abertura: envelope ---------- */
.inv-romantica .cover{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;cursor:pointer;transition:opacity .7s ease 1.6s}
.inv-romantica .cover.is-gone{display:none}
.envelope{position:relative;width:min(84vw,340px);aspect-ratio:7/5;padding:0;border:0;background:none;perspective:1200px;-webkit-tap-highlight-color:transparent;filter:drop-shadow(0 22px 26px rgba(60,40,30,.28));animation:float 4s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-6px) rotate(-.6deg)}}
.env-back{position:absolute;inset:0;border-radius:6px;background:color-mix(in srgb,var(--t-petal) 88%,#000)}
.env-letter{position:absolute;left:6%;right:6%;top:8%;height:86%;border-radius:3px;background:repeating-linear-gradient(180deg,transparent 0 17px,var(--t-line) 17px 18px),var(--t-paper);box-shadow:0 2px 6px rgba(0,0,0,.12);opacity:0;transition:transform 1s cubic-bezier(.5,0,.2,1) .55s,opacity .2s .3s;display:flex;align-items:flex-start;justify-content:center;padding-top:10%}
.env-letter-in{display:flex;flex-direction:column;align-items:center;color:var(--t-ink)}
.env-letter-in b{font-family:var(--f-script);font-weight:400;font-size:clamp(22px,7vw,30px)}
.env-letter-in small{font-family:var(--f-display);font-size:13px;letter-spacing:.3em}
.env-front{position:absolute;inset:0;border-radius:6px;background:
  linear-gradient(to top right,var(--t-petal) 50%,transparent 50.4%) left bottom/50% 100% no-repeat,
  linear-gradient(to top left,var(--t-petal) 50%,transparent 50.4%) right bottom/50% 100% no-repeat,
  linear-gradient(to top,color-mix(in srgb,var(--t-petal) 94%,#000) 0,var(--t-petal) 55%,transparent 55.2%)}
.env-front::before{content:"";position:absolute;inset:0;border-radius:6px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.02) 0 1px,transparent 1px 3px)}
.env-stamp{position:absolute;z-index:4;right:6%;top:24%;width:19%;transform:rotate(6deg);color:var(--t-seal-ink);filter:drop-shadow(0 2px 3px rgba(0,0,0,.15))}
.env-stamp svg{width:100%;height:auto;display:block}
.env-postmark{position:absolute;z-index:4;right:18%;top:36%;width:40%;color:var(--t-seal-ink);opacity:.55;transform:rotate(-8deg)}
.env-postmark svg{width:100%;height:auto;display:block}
.env-to{position:absolute;left:10%;bottom:14%;display:flex;flex-direction:column;align-items:flex-start;font-family:var(--hand);font-size:clamp(24px,7.5vw,32px);line-height:1;color:var(--t-ink);transform:rotate(-3deg)}
.env-to small{font-size:.6em;opacity:.7}
.env-flap{position:absolute;left:0;right:0;top:0;height:58%;background:linear-gradient(180deg,color-mix(in srgb,var(--t-petal) 92%,#000),var(--t-petal));clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transition:transform .7s cubic-bezier(.5,0,.3,1),z-index 0s .35s;z-index:3;filter:drop-shadow(0 3px 2px rgba(0,0,0,.1))}
.cover-hint{margin:0;font-family:var(--hand);font-size:26px;color:var(--t-cover-ink);animation:wig 2.4s ease-in-out infinite}
@keyframes wig{50%{transform:rotate(-2deg) translateY(-2px)}}
.cover.is-open .envelope{animation:none}
.cover.is-open .env-flap{transform:rotateX(180deg);z-index:0}
.cover.is-open .env-letter{transform:translateY(-62%);opacity:1}
.cover.is-open .env-stamp,.cover.is-open .env-postmark{z-index:1}
.cover.is-open .cover-hint{opacity:0}
.cover.is-open{opacity:0;pointer-events:none}

/* ---------- Carta ---------- */
.inv-romantica .pg{min-height:100svh;padding:calc(26px + env(safe-area-inset-top)) 16px calc(40px + env(safe-area-inset-bottom))}
.letter{position:relative;padding:34px 26px 30px;color:var(--t-ink);text-align:center;background:repeating-linear-gradient(180deg,transparent 0 31px,var(--t-line) 31px 32px),var(--t-paper);box-shadow:0 24px 40px -24px rgba(60,40,30,.5);transform:rotate(-.6deg)}
.fx-paper--plain .letter,.fx-paper--plain .sheet-paper{background:var(--t-paper)}
.sprig{position:absolute;width:52px;height:auto;color:var(--t-leaf)}
.sprig-l{left:8px;top:18px;transform:rotate(-18deg)}
.sprig-r{right:6px;bottom:24px;transform:rotate(160deg)}
.dear{margin:0 0 10px;padding-left:34px;text-align:left;font-family:var(--hand);font-size:24px;color:var(--t-muted)}
.kicker{margin:0;font-family:var(--f-body);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--t-accent)}
.name{margin:10px 0 8px;font-family:var(--f-script);font-weight:400;font-size:clamp(40px,12vw,58px);line-height:1.25;overflow-wrap:normal}
.date{margin:0 0 16px;font-family:var(--f-display);font-size:17px;letter-spacing:.06em}
.written{margin:0 auto 14px;max-width:30ch;font-family:var(--hand);font-size:24px;line-height:1.3;color:var(--t-ink)}
.written.writing{-webkit-mask:linear-gradient(180deg,#000 var(--w,0%),transparent calc(var(--w,0%) + 4%));mask:linear-gradient(180deg,#000 var(--w,0%),transparent calc(var(--w,0%) + 4%))}
.signature{margin:0;text-align:right;font-family:var(--hand);font-size:22px;color:var(--t-muted)}
.signature b{font-family:var(--f-script);font-weight:400;font-size:26px;color:var(--t-ink)}
.heart-doodle{position:absolute;left:18px;bottom:16px;width:38px;height:auto;color:var(--t-accent);transform:rotate(-12deg);animation:beat 1.8s ease-in-out infinite}
@keyframes beat{0%,100%{scale:1}15%{scale:1.15}30%{scale:1}45%{scale:1.1}}
.is-closed #s-menu > *{opacity:0}
.is-opening .letter,.is-revealed .letter{animation:place .9s cubic-bezier(.2,.9,.3,1) both .15s}
.is-opened .letter{animation:none}
@keyframes place{from{opacity:0;transform:translateY(40px) rotate(4deg)}to{opacity:1;transform:rotate(-.6deg)}}

/* ---------- Mural ---------- */
.board-title{margin:34px 0 10px;text-align:center;font-family:var(--hand);font-size:30px;color:var(--t-cover-ink)}
.mini-heart{width:24px;height:auto;vertical-align:-4px;color:var(--t-accent)}
.board{display:grid;grid-template-columns:1fr 1fr;gap:22px 16px;padding:10px 4px}
.pin-item{position:relative;display:flex;flex-direction:column;gap:2px;padding:18px 14px 14px;color:var(--t-ink);text-decoration:none;background:var(--t-paper);box-shadow:0 12px 20px -12px rgba(60,40,30,.5);transform:rotate(var(--r,0deg));transition:transform .3s cubic-bezier(.2,1.4,.4,1);-webkit-tap-highlight-color:transparent}
.pin-item:hover,.pin-item:focus-visible{transform:rotate(0) scale(1.04)}
.pin-item:active{transform:rotate(0) scale(.98)}
.pin-item b{font-family:var(--hand);font-size:26px;font-weight:600;line-height:1}
.pin-item small{font-family:var(--f-body);font-size:13.5px;font-style:italic;line-height:1.3;color:var(--t-ink);opacity:.86}
/* Bilhete que sobrou sozinho na linha (sem presentes, sem manual etc.): centralizado, sem buraco ao lado */
.pin-item.is-wide{grid-column:1/-1;justify-self:center;width:min(72%,260px)}
.washi{position:absolute;left:50%;top:-10px;width:70px;height:20px;margin-left:-35px;background:color-mix(in srgb,var(--t-petal2) 85%,transparent);opacity:.9;transform:rotate(-4deg);-webkit-mask:linear-gradient(90deg,transparent 0 2px,#000 2px calc(100% - 2px),transparent 0);box-shadow:0 1px 1px rgba(0,0,0,.05)}
.ticket{grid-column:1/-1;flex-direction:row;align-items:center;gap:14px;padding:16px 18px;border-radius:6px;background:radial-gradient(circle at 0 50%,transparent 10px,var(--t-paper) 10.5px) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,transparent 10px,var(--t-paper) 10.5px) right/51% 100% no-repeat;filter:drop-shadow(0 10px 12px rgba(60,40,30,.25));box-shadow:none}
.ticket small{order:-1;padding-right:12px;border-right:2px dashed var(--t-line);writing-mode:vertical-rl;transform:rotate(180deg);font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.ticket b{flex:1;font-size:28px}
.ticket em{font-style:normal;font-family:var(--f-body);font-size:13.5px;font-weight:600;color:var(--t-accent);white-space:nowrap}
.note{background:color-mix(in srgb,var(--t-accent-2) 45%,var(--t-paper))}
.note-heart{position:absolute;right:10px;bottom:10px;width:24px;height:auto;color:var(--t-accent)}
.tag{padding-left:34px;border-radius:4px 16px 16px 4px;background:color-mix(in srgb,var(--t-petal2) 55%,var(--t-paper));clip-path:polygon(18px 0,100% 0,100% 100%,18px 100%,0 50%)}
.tag-hole{position:absolute;left:16px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--t-cover);box-shadow:inset 0 0 0 1.5px var(--t-muted)}
.notebook{padding-left:26px;background:repeating-linear-gradient(180deg,transparent 0 17px,var(--t-line) 17px 18px),var(--t-paper)}
.notebook::before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:6px;background:radial-gradient(circle,var(--t-cover) 2.5px,transparent 3px) 0 0/6px 12px}
.polaroid{grid-column:1/-1;justify-self:center;width:70%;padding:10px 10px 12px;background:#fff;align-items:center}
.pol-img{display:block;width:100%;aspect-ratio:1;background-size:cover;background-position:center;margin-bottom:8px}
.is-opening .pin-item,.is-revealed .pin-item{animation:pinIn .6s cubic-bezier(.2,1.3,.4,1) both}
.pin-item:nth-child(2){animation-delay:.08s!important}.pin-item:nth-child(3){animation-delay:.16s!important}.pin-item:nth-child(4){animation-delay:.24s!important}.pin-item:nth-child(5){animation-delay:.32s!important}
.is-opened .pin-item{animation:none}
@keyframes pinIn{from{opacity:0;transform:translateY(30px) rotate(calc(var(--r) * 3))}}
.cd-note{margin:26px auto 0;padding:12px 16px;width:fit-content;background:var(--t-paper);box-shadow:0 10px 16px -10px rgba(60,40,30,.4);transform:rotate(1.5deg);text-align:center}
.cd-note p{margin:0;font-family:var(--hand);font-size:22px;color:var(--t-muted)}
.inv-romantica .cd-u b{font-family:var(--hand);font-size:34px;color:var(--t-accent)}
.inv-romantica .cd-u small{font-family:var(--f-body);font-size:11px;letter-spacing:.12em;opacity:1;color:var(--t-ink)}
.inv-romantica .brand{margin:24px 0 0;text-align:center;font-family:var(--f-body);font-size:11px;letter-spacing:.24em;text-transform:uppercase;opacity:.85}

/* ---------- Páginas ---------- */
.note-page .back{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;font-family:var(--hand);font-size:22px;color:var(--t-cover-ink);text-decoration:none}
.sheet-paper{--x-ink:var(--t-ink);--x-muted:var(--t-muted);--x-line:var(--t-line);position:relative;padding:34px 22px 26px;color:var(--t-ink);background:repeating-linear-gradient(180deg,transparent 0 31px,var(--t-line) 31px 32px),var(--t-paper);box-shadow:0 24px 40px -24px rgba(60,40,30,.5)}
.washi--t{top:-11px}
.pg.laid .sheet-paper{animation:place .6s cubic-bezier(.2,.9,.3,1) both}
.hand-title{margin:0 0 14px;text-align:center;font-family:var(--f-script);font-weight:400;font-size:clamp(34px,10vw,44px);line-height:1.3}
.loc-name{margin:0 0 4px;text-align:center;font-family:var(--hand);font-size:30px;font-weight:600}
.loc-addr,.lead{margin:0 0 6px;text-align:center;font-family:var(--f-body);font-size:16px;line-height:1.6;color:var(--t-muted)}
.loc-when{margin:0 0 16px;text-align:center;font-family:var(--f-display);font-size:16px}
.inv-romantica .pill{background:var(--t-accent);font-family:var(--f-display)}
.inv-romantica .pill b{font-family:var(--hand);font-size:22px;font-weight:600;letter-spacing:.02em;text-transform:none}
.inv-romantica .pill--line{background:transparent;color:var(--t-accent);box-shadow:inset 0 0 0 1.5px var(--t-accent)}
.inv-romantica .gifts .pill{align-items:flex-start;text-align:left;background:color-mix(in srgb,var(--t-petal2) 40%,var(--t-paper));color:var(--t-ink);box-shadow:0 6px 10px -8px rgba(60,40,30,.5);border-radius:3px}
.inv-romantica .gifts .pill:nth-child(odd){transform:rotate(-1deg)}
.inv-romantica .gifts .pill:nth-child(even){transform:rotate(1deg)}
.inv-romantica .gifts .pill small{font-family:var(--f-body)}
.inv-romantica .seg span{font-family:var(--hand);font-size:19px;text-transform:none;letter-spacing:0}
.inv-romantica .rsvp-person legend,.inv-romantica .rsvp-hello{font-family:var(--hand);font-size:24px}
.inv-romantica .manual li span{font-family:var(--f-body);font-size:14px}
.inv-romantica .gal-item{padding:6px 6px 22px;background:#fff;border-radius:0;box-shadow:0 10px 16px -10px rgba(60,40,30,.5)}
.inv-romantica .gal-item:nth-child(odd){transform:rotate(-1.5deg)}
.inv-romantica .gal-item:nth-child(even){transform:rotate(1.5deg)}
.inv-romantica .music{color:var(--t-ink);background:color-mix(in srgb,var(--t-paper) 80%,transparent);border-color:var(--t-line)}
.inv-romantica .cover{background:radial-gradient(90% 60% at 50% 30%,color-mix(in srgb,var(--t-cover) 60%,#fff),var(--t-cover))}