.inv-preview-scroll-lock{position:fixed;width:100%;overflow:hidden}
.invitation-preview-phone{position:relative;box-sizing:border-box;width:min(100%,390px);aspect-ratio:9/19.5;margin-inline:auto;padding:11px;overflow:hidden;background:#151217;border:1px solid rgba(255,255,255,.28);border-radius:34px;box-shadow:0 24px 55px rgba(24,14,28,.25);container-type:inline-size}
.invitation-preview-phone>.opening-effect-scene{z-index:10}
.invitation-preview-speaker{position:absolute;z-index:12;top:7px;left:50%;width:28%;height:17px;background:#151217;border-radius:999px;transform:translateX(-50%)}
.invitation-preview-screen{position:relative;width:100%;height:100%;overflow:hidden;background:#eee7ef;border-radius:25px}
.invitation-preview-screen>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.invitation-preview-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,8,14,.18),rgba(17,8,20,.48) 48%,rgba(17,8,20,.94))}
.invitation-preview-copy{position:absolute;z-index:3;inset:auto 7% 7%;display:grid;gap:clamp(5px,2cqw,12px);color:#fff;text-align:center;text-shadow:0 2px 14px rgba(0,0,0,.65)}
.invitation-preview-copy>small{text-transform:uppercase;letter-spacing:.16em;font-size:clamp(.54rem,2.7cqw,.78rem)}
.invitation-preview-copy>small,.invitation-preview-copy h3,.invitation-preview-copy p,.invitation-preview-copy dt,.invitation-preview-copy dd{color:#fff}
.invitation-preview-copy h3{margin:0;font-family:var(--inv-heading,Georgia,serif);font-size:clamp(1.25rem,8cqw,2.5rem);line-height:1.02}
.invitation-preview-copy p{display:-webkit-box;margin:0;overflow:hidden;font-family:var(--inv-body,Arial,sans-serif);font-size:clamp(.63rem,3.3cqw,.9rem);line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.invitation-preview-copy dl{display:grid;gap:4px;margin:0;font-size:clamp(.56rem,2.8cqw,.78rem)}
.invitation-preview-copy dl div{display:grid}.invitation-preview-copy dt{font-weight:800}.invitation-preview-copy dd{margin:0}
.invitation-preview-open{position:absolute;z-index:11;inset:0;display:flex;width:100%;height:100%;align-items:flex-end;justify-content:center;padding:0 12px 15%;color:#fff;background:transparent;border:0;cursor:pointer;transition:opacity .35s ease,visibility .35s ease}
.invitation-preview-open span{display:inline-flex;min-height:42px;align-items:center;justify-content:center;padding:9px 15px;color:#fff;background:rgba(20,14,18,.78);border:1px solid rgba(255,255,255,.42);border-radius:999px;box-shadow:0 10px 28px rgba(0,0,0,.25);font:800 clamp(.58rem,2.8cqw,.78rem)/1.2 var(--inv-body,Arial,sans-serif);letter-spacing:.025em;text-shadow:0 1px 8px rgba(0,0,0,.55);backdrop-filter:blur(8px)}
.invitation-preview-phone .opening-effect-scene{transition:opacity .58s ease,visibility .58s ease}.invitation-preview-phone.is-opened .opening-effect-scene{opacity:0;visibility:hidden}.invitation-preview-phone.is-opened .invitation-preview-open{opacity:0;visibility:hidden;pointer-events:none}
.invitation-preview-missing-image{position:absolute;inset:0;display:grid;place-content:center;gap:8px;color:#6e5d70;background:linear-gradient(145deg,#f4edf3,#ddd1de);text-align:center}.invitation-preview-missing-image span{font-size:2.5rem}
.inv-preview-dialog{width:min(720px,calc(100vw - 16px));max-width:none;height:min(980px,calc(100dvh - 12px));max-height:calc(100dvh - 12px);margin:auto;padding:0;overflow:hidden;color:#221b2a;background:#fff;border:1px solid rgba(94,55,87,.18);border-radius:24px;box-shadow:0 30px 90px rgba(19,9,24,.36)}
.inv-preview-dialog::backdrop{background:rgba(20,12,23,.72);backdrop-filter:blur(6px)}
.inv-preview-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%;min-height:0}
.inv-preview-header,.inv-preview-actions{display:flex;align-items:center;gap:10px;padding:5px 10px;background:rgba(255,255,255,.97)}
.inv-preview-header{justify-content:space-between;border-bottom:1px solid #eee7ef}.inv-preview-title{min-width:0;margin-right:auto}.inv-preview-title strong,.inv-preview-title span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.inv-preview-title span{margin-top:2px;color:#766d79;font-size:.78rem}
.inv-preview-close{flex:0 0 44px;width:44px;height:44px;padding:0;color:#37283d;background:#f4eef5;border:0;border-radius:50%;font-size:1.45rem;cursor:pointer}
.inv-preview-orientation{display:flex;gap:4px;padding:4px;background:#f4eef5;border-radius:999px}.inv-preview-orientation button{min-height:38px;padding:6px 12px;color:#593c61;background:transparent;border:0;border-radius:999px;font:inherit;font-size:.75rem;font-weight:800}.inv-preview-orientation button[aria-pressed="true"]{color:#fff;background:#62386c}
.inv-preview-stage{display:grid;min-width:0;min-height:0;place-items:center;padding:6px;overflow:hidden;background:linear-gradient(145deg,#eee7ef,#dcd3df)}
.inv-preview-stage>.invitation-preview-phone{width:auto;max-width:100%;height:min(82dvh,820px,calc(100% - 2px))}
.inv-preview-stage.is-landscape>.invitation-preview-phone{width:100%;max-width:680px;height:auto;max-height:100%;aspect-ratio:16/9;border-radius:28px}.inv-preview-stage.is-landscape .invitation-preview-screen{border-radius:20px}.inv-preview-stage.is-landscape .invitation-preview-copy{inset:auto 8% 9%;text-align:left}.inv-preview-stage.is-landscape .invitation-preview-speaker{top:50%;left:7px;width:17px;height:28%;transform:translateY(-50%)}
.inv-preview-actions{justify-content:flex-end;padding-bottom:max(12px,env(safe-area-inset-bottom));border-top:1px solid #eee7ef}.inv-preview-actions a,.inv-preview-actions button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;padding:10px 16px;color:#472b4f;background:#f5eef6;border:1px solid #dfd0e2;border-radius:999px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}.inv-preview-actions .inv-preview-primary{color:#fff;background:#62386c;border-color:#62386c}.inv-preview-dialog :focus-visible{outline:3px solid #e9a93f;outline-offset:3px}
@media(max-width:620px){.inv-preview-dialog{width:100vw;height:100dvh;max-height:100dvh;border:0;border-radius:0}.inv-preview-header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;padding:5px 8px}.inv-preview-title{min-width:0;margin:0}.inv-preview-orientation{justify-content:center}.inv-preview-orientation button{min-height:34px;padding:4px 8px}.inv-preview-close{width:40px;height:40px;flex-basis:40px}.inv-preview-stage{padding:4px}.inv-preview-stage>.invitation-preview-phone{max-width:calc(100% - 2px);padding:6px;border-radius:26px}.inv-preview-stage.is-landscape>.invitation-preview-phone{width:100%;height:auto}.inv-preview-actions{flex-wrap:nowrap;padding:5px 8px max(5px,env(safe-area-inset-bottom))}.inv-preview-actions a,.inv-preview-actions button{flex:1 1 0;padding-inline:10px}}
@media(max-width:370px){.inv-preview-title span{display:none}.inv-preview-orientation button{padding-inline:7px;font-size:.68rem}}
@media(prefers-reduced-motion:reduce){.invitation-preview-phone .opening-effect-scene,.invitation-preview-phone .opening-effect-scene *{animation:none!important}}

/* Premium theme detail experience */
.invitation-preview-flow{min-height:100%;padding-bottom:calc(78px + env(safe-area-inset-bottom));color:var(--preview-primary);background:var(--preview-bg);font-family:var(--inv-body,Arial,sans-serif)}
.invitation-preview-cover{position:relative;min-height:100%;overflow:hidden;background:var(--preview-primary)}
.invitation-preview-cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.invitation-preview-cover .invitation-preview-missing-image{position:absolute}
.invitation-preview-phone.is-opened .invitation-preview-screen{overflow-y:auto;overscroll-behavior-y:contain;scroll-behavior:auto;scroll-snap-type:none;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.invitation-preview-phone.is-opened .invitation-preview-screen::-webkit-scrollbar{display:none}
.invitation-preview-screen:focus-visible{outline:3px solid var(--preview-secondary);outline-offset:-4px}
.invitation-preview-section{position:relative;display:grid;min-height:clamp(220px,115cqw,380px);align-content:center;gap:clamp(7px,2.3cqw,13px);padding:clamp(30px,12cqw,66px) clamp(20px,9cqw,48px);overflow:hidden;color:var(--preview-ink,#2b1d20);background:var(--preview-bg);text-align:center}
.invitation-preview-section:nth-child(odd){background:color-mix(in srgb,var(--preview-bg) 91%,var(--preview-accent))}
.invitation-preview-section>small{color:var(--preview-ink,#2b1d20);font-size:clamp(.6rem,2.7cqw,.78rem);font-weight:850;letter-spacing:.17em;text-transform:uppercase}
.invitation-preview-section h4{margin:0;color:var(--preview-ink,#2b1d20);font-family:var(--inv-heading,Georgia,serif);font-size:clamp(1.52rem,7.4cqw,2.45rem);font-weight:600;line-height:1.08}
.invitation-preview-section p{margin:0;color:var(--preview-muted,#5f4b51);font-size:clamp(.72rem,3.25cqw,.94rem);font-weight:500;line-height:1.65}
.invitation-preview-section a{display:inline-flex;min-height:46px;align-items:center;justify-content:center;justify-self:center;margin-top:clamp(5px,2cqw,10px);padding:8px 14px;color:var(--preview-ink,#2b1d20);background:color-mix(in srgb,var(--preview-bg) 86%,var(--preview-accent));border:1px solid color-mix(in srgb,var(--preview-ink,#2b1d20),transparent 58%);border-radius:999px;font-size:clamp(.58rem,2.6cqw,.76rem);font-weight:800;text-decoration:none}
.preview-countdown>div{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}.preview-countdown>div>span{display:grid;gap:4px;padding:12px 6px;border:1px solid color-mix(in srgb,var(--preview-ink,#2b1d20),transparent 80%);border-radius:14px}.preview-countdown strong{font-size:clamp(.64rem,3.1cqw,.92rem)}.preview-countdown>div small{color:var(--preview-muted,#5f4b51);font-size:clamp(.46rem,2.2cqw,.65rem)}
.preview-program ol{display:grid;gap:0;padding:0;margin:9px 0 0;list-style:none;text-align:left}.preview-program li{display:grid;grid-template-columns:58px 1fr;gap:8px;padding:10px 2px;border-top:1px solid color-mix(in srgb,var(--preview-ink,#2b1d20),transparent 82%);font-size:clamp(.58rem,2.7cqw,.78rem)}.preview-program time{color:var(--preview-ink,#2b1d20);font-weight:850}
.preview-gallery-mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:9px}.preview-gallery-mosaic span{display:block;aspect-ratio:4/5;background:linear-gradient(145deg,color-mix(in srgb,var(--preview-accent),#fff 55%),color-mix(in srgb,var(--preview-secondary),#fff 72%));border:1px solid color-mix(in srgb,var(--preview-ink,#2b1d20),transparent 86%);border-radius:12px}.preview-gallery-mosaic span:nth-child(2){transform:translateY(9px)}
.preview-rsvp{background:linear-gradient(150deg,var(--preview-primary),color-mix(in srgb,var(--preview-primary),#111 24%));color:var(--preview-on-primary,#fff)}.preview-rsvp h4{color:var(--preview-on-primary,#fff)}.preview-rsvp>small,.preview-rsvp p{color:var(--preview-on-primary-muted,#fff)}
.invitation-preview-quickbar{position:sticky;z-index:6;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);padding:8px max(8px,4cqw) max(8px,env(safe-area-inset-bottom));color:var(--preview-ink,#2b1d20);background:color-mix(in srgb,var(--preview-bg) 96%,transparent);border-top:1px solid color-mix(in srgb,var(--preview-ink,#2b1d20),transparent 78%);box-shadow:0 -8px 22px rgba(35,24,20,.1);backdrop-filter:blur(12px)}
.invitation-preview-quickbar span{display:grid;justify-items:center;gap:2px;font-size:clamp(.75rem,4cqw,1.1rem)}.invitation-preview-quickbar small{font:700 clamp(.42rem,2cqw,.6rem)/1 var(--inv-body,Arial,sans-serif)}
.inv-reveal{opacity:1;transform:none;transition:opacity .62s ease,transform .62s cubic-bezier(.2,.7,.2,1),filter .62s ease}
.preview-reveal-ready .inv-reveal:not(.visible){opacity:0;filter:blur(2px);transform:translateY(30px) scale(.975)}

@media(prefers-reduced-motion:reduce){.inv-reveal,.preview-reveal-ready .inv-reveal:not(.visible){opacity:1;transform:none;transition:none}}


/* Final: previews render the real public invitation, not the legacy flat mockup. */
.invitation-preview-phone{
    width:min(100%,430px);
    aspect-ratio:9/19.5;
    padding:11px;
}
.invitation-preview-screen{
    overflow:hidden;
    background:#171319;
}
.invitation-preview-frame{
    display:block;
    width:100%;
    height:100%;
    border:0;
    border-radius:25px;
    background:#171319;
}
.invitation-preview-unavailable{
    display:grid;
    width:100%;
    height:100%;
    place-items:center;
    padding:24px;
    color:#fff;
    text-align:center;
    background:#211a22;
}
.inv-preview-dialog .invitation-preview-phone{
    height:min(86dvh,900px);
    width:auto;
    max-width:min(94vw,460px);
    aspect-ratio:9/19.5;
}
.inv-preview-stage{
    min-height:0;
    padding:10px;
}
@media (max-width:700px){
    .inv-preview-dialog .invitation-preview-phone{
        width:min(94vw,430px);
        height:auto;
        max-height:calc(100dvh - 118px);
    }
}