body.pps-product-embedded{min-height:0;margin:0}.pps-product-embedded .announcement,.pps-product-embedded .breadcrumb,.pps-product-embedded .intro,.pps-product-embedded .gang-intro,.pps-product-embedded>footer,.pps-product-embedded .site-header .brand,.pps-product-embedded .site-header nav,.pps-product-embedded .site-header .help-link{display:none}.pps-product-embedded .site-header{position:static;justify-content:flex-end;padding:8px 0;border:0;max-width:none}.pps-product-embedded main{max-width:none;margin:0;padding:0 8px 16px}.pps-product-embedded .workspace{margin:0}.pps-product-embedded .preview-notice{margin-top:0}

/* Gang-sheet products share the expanded editor's compact opening layout. */
.pps-product-embedded:has(.gang-main)>.site-header{display:none}
.pps-product-embedded .gang-main{padding:0 16px 12px;box-sizing:border-box}
.pps-product-embedded .gang-main>.development-note{display:none}
.pps-product-embedded .gang-main .gang-workspace{height:max(520px,calc(100svh - 210px));margin-bottom:0}
.pps-product-embedded.pps-workspace-expanded .gang-main .gang-workspace{height:auto}
@media(max-width:749px){.pps-product-embedded .gang-main{padding-inline:12px}}
@media(max-width:640px){body.pps-product-embedded main{padding-inline:20px}}

body.pps-precut-modal-expanded{height:100dvh;overflow:hidden}.pps-precut-modal-expanded dialog[open]{max-height:calc(100dvh - 24px);box-sizing:border-box}

/* Center dialogs in the visible slice of the frame, even near the store footer. */
.pps-product-embedded dialog[open]{position:fixed;top:calc(var(--pps-modal-visible-top,0px) + 12px);bottom:calc(var(--pps-modal-visible-bottom,0px) + 12px);height:fit-content;margin-block:auto;max-height:calc(var(--pps-modal-visible-height,100dvh) - 24px);box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain}

/* Shopify already supplies the page header. Keep only the ordering UI here. */
.pps-product-embedded:has(.steps)>.site-header,
.pps-product-embedded:has(.steps)>.preview-notice{display:none}

/* Full document height is reported to the theme, independent of iframe height. */
@media(min-width:901px){
 html:has(body.pps-product-embedded .steps){height:auto;overflow:visible}
 body.pps-product-embedded:has(.steps){height:auto;overflow:visible;display:block}
 .pps-product-embedded .workspace>.library-rail,.pps-product-embedded .workspace>.checker-rail{position:relative;top:0}
}
