/* Ad preview in the real demo app (FestlAdPreview). The phone keeps the demo proportions and never overflows its column. */
.ad-live-preview{display:grid;justify-items:center;gap:12px;min-width:0}
.ad-live-preview>h3{justify-self:start;margin:0}
.ad-live-preview .guided-app.sandbox-demo.mobile-preview{width:min(340px,calc(100% - 24px));margin:0 auto}
.ad-live-preview .sandbox-demo.mobile-preview .sandbox-device{min-height:0}
.ad-live-preview-note{margin:0;max-width:44ch;font-size:.82rem;line-height:1.45;color:var(--muted);text-align:center}
@media(max-width:560px){.ad-live-preview .guided-app.sandbox-demo.mobile-preview{width:min(300px,calc(100% - 28px))}}
/* festl-v358: the nested preview phone inside the website demo (depth 1) uses the full column so the twice-scaled app stays legible. */
.ad-live-preview.is-nested .guided-app.sandbox-demo.mobile-preview{width:min(340px,100%);max-width:340px}
/* The inline card (no frame, or the nested phone's fallback) keeps the column width instead of shrinking to nothing in the grid. */
.ad-live-preview>.cw-ad-frame{width:min(340px,100%);box-sizing:border-box}