/* ===== v2 layout: envelope only on cover; inner pages = full cream paper ===== */
.card{max-width:480px}
@media(min-width:700px){.card{height:min(94vh,920px)}}
.topbar,.bottom{position:absolute;left:0;right:0;z-index:6;opacity:0;visibility:hidden;transition:opacity .6s .4s,visibility .6s .4s}
body.inside .topbar,body.inside .bottom{opacity:1;visibility:visible}
.topbar{top:0;height:58px;display:flex;align-items:center;justify-content:center;background:rgba(140,139,112,.97);box-shadow:0 2px 10px rgba(40,40,20,.18);padding:0 10px}
.top-home{display:flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;color:var(--cream);padding:4px 8px;border-radius:30px}
.top-home img{width:40px;height:40px;border-radius:50%;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.top-home span{font-size:28px;line-height:1}
.top-back{position:absolute;left:8px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.14);border:0;color:var(--cream);font:400 17px "Cormorant Garamond",serif;padding:6px 12px;border-radius:20px;cursor:pointer}
.top-back:hover,.top-back:focus-visible,.top-home:focus-visible{background:rgba(255,255,255,.25);outline:2px solid var(--cream)}
@media(max-width:380px){.top-back span{display:none}}
.bottom{bottom:0;top:auto;height:60px;pointer-events:auto;background:rgba(140,139,112,.97);box-shadow:0 -2px 10px rgba(40,40,20,.18);transition-delay:.4s}
.bottom.show{opacity:1}
.foot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;bottom:auto}
.countdown{margin:0;font-size:22px;text-shadow:none;color:#f6e9bd}.countdown span{min-width:40px}.countdown i{text-shadow:none;font-size:10px;letter-spacing:.05em}
.camera{right:12px;bottom:auto;top:50%;transform:translateY(-50%);width:44px;height:44px}
.mute{left:12px;bottom:5px;width:50px;height:50px;background:rgba(201,214,168,.95);color:#3b3a2c}
body.inside .mute{width:44px;height:44px;bottom:8px;left:max(12px,calc(50% - 228px))}
@media(min-width:700px){body.inside .mute{bottom:calc(3vh + 8px)}.mute{bottom:calc(3vh + 8px);left:calc(50% - 228px)}}
@media(min-width:700px) and (min-height:980px){body.inside .mute,.mute{bottom:calc((100vh - 920px)/2 + 8px)}}
/* screens between bars */
#menu,#page{top:58px;bottom:60px}
.paper,.screen.active .paper{position:absolute;inset:0;left:0;right:0;top:0;bottom:0;transform:none;box-shadow:none;background:var(--cream)}
#page .paper{transform:translateX(24px);transition:transform .5s,opacity .5s}
#page.active .paper{transform:none}
.scroll{padding:22px 22px 40px}
/* menu */
#menu .paper{overflow-y:auto;display:flex;flex-direction:column}
.couple{position:relative;inset:auto;width:100%;height:min(42vh,340px);flex:none;object-fit:cover;object-position:50% 40%;-webkit-mask:linear-gradient(to bottom,#000 70%,transparent);mask:linear-gradient(to bottom,#000 70%,transparent);order:1}
.bubbles{order:2;position:relative;width:100%;height:auto;margin-top:-34px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 14px 24px;justify-items:center}
.bubble,.bubble:nth-child(odd),.bubble:nth-child(even){width:100%;max-width:132px;margin:0;transform:none;justify-self:center;font-size:19px}
.bubble:hover,.bubble:focus-visible,.bubble:nth-child(even):hover,.bubble:nth-child(even):focus-visible{transform:scale(1.05)}
.bubble[data-go="rsvp"]{grid-column:1/-1;aspect-ratio:auto;max-width:none;border-radius:40px;padding:14px;background:#a9b98a;color:#2f3a1f;font-size:24px}
.bubble[data-go="rsvp"] small{font:600 13px "Cormorant Garamond",serif;letter-spacing:.06em;text-transform:uppercase}
/* pages */
.portrait{margin-right:-22px}.pedido-img{margin-right:-22px}
.pager{position:sticky;bottom:-40px;margin:26px -22px -40px;padding:10px 14px;background:linear-gradient(transparent,var(--cream) 30%)}
.pager .back{font-size:16px;background:var(--cream)}
.rsvp.paper{background:#fff}
.paper.fotos{background:#c7d4b0}
.timeline span{font-size:22px}
.top-back{font-size:22px;padding:4px 12px}
#ytHost{position:fixed!important;left:-9999px;top:0;width:200px;height:200px;opacity:0;pointer-events:none}
.up{text-align:left;margin-top:10px}
.up label{display:block;font-size:14px;text-transform:uppercase;letter-spacing:.03em;margin:14px 0 6px}
.up input[type=text]{width:100%;border:2px solid #4a5a33;border-radius:12px;padding:12px;font:16px "Josefin Sans",sans-serif;background:#fff}
.up input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.up .pick{display:block;text-align:center;text-transform:none;font-size:17px;padding:22px 14px;border:2px dashed #5a6b40;border-radius:16px;background:rgba(255,255,255,.55);cursor:pointer;margin-top:18px}
.up input[type=file]:focus-visible+.sel,.up .pick:hover{background:#fff}
.up .sel{text-align:center;margin-top:8px;font-size:15px}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:8px 0}.thumbs img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}
.up .cta{display:block;width:100%;border:0;cursor:pointer;font-family:"Josefin Sans",sans-serif}
.up .cta:disabled{opacity:.5;cursor:default}
.bar{height:10px;border-radius:6px;background:rgba(255,255,255,.6);overflow:hidden}.bar i{display:block;height:100%;width:0;background:#5a6b40;transition:width .2s}
button.cta{border:0;cursor:pointer;font-family:"Josefin Sans",sans-serif}
.rsvp select{width:100%;border:2px solid #4a3f2a;border-radius:12px;padding:12px;font:16px "Josefin Sans",sans-serif;background:#fff;color:inherit}