/* Preserve the mobile canvas; let its own scrollbar sit beside its content. */
@media(min-width:600px){
 html:not(.customer-embedded):not(.pb-preview):has(>body.theme-claymorphism-shell){height:100%;overflow:hidden;background:var(--surface,#eee8f2)}
 html:not(.customer-embedded):not(.pb-preview)>body.theme-claymorphism-shell{height:100dvh;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 12% 15%,var(--tint,#e4d9f4),transparent 65%),radial-gradient(ellipse at 88% 85%,var(--primary,#7354b1),transparent 80%),var(--surface,#eee8f2)}
 html:not(.customer-embedded):not(.pb-preview)>body.theme-claymorphism-shell>.app-shell{width:100%;max-width:430px;height:100dvh;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-color:var(--primary,#7354b1) var(--tint,#e4d9f4);box-shadow:0 0 45px var(--shadow-color,#51405e26)}
 html:not(.customer-embedded):not(.pb-preview)>body.theme-claymorphism-shell.is-customer-view>.app-shell{overflow:hidden}
 html:not(.customer-embedded):not(.pb-preview)>body.theme-claymorphism-shell.is-locked>.app-shell,html:not(.customer-embedded):not(.pb-preview)>body.theme-claymorphism-shell:has(dialog[open],.modal-root.is-open,.drawer-backdrop:not([hidden]),.notification-backdrop:not([hidden]))>.app-shell{overflow-y:hidden}
}

/* Every overlay shares the customer's canvas, including top-layer dialogs. */
@media(min-width:431px){
body.theme-claymorphism-shell:not(.admin-clay) :is(.drawer-backdrop,.notification-backdrop){left:max(0px,calc((100vw - 430px)/2));right:max(0px,calc((100vw - 430px)/2));width:auto}
body.theme-claymorphism-shell .side-drawer{left:max(0px,calc((100vw - 430px)/2));right:auto;width:min(380px,430px);max-width:430px}
body.theme-claymorphism-shell .notification-drawer{right:max(0px,calc((100vw - 430px)/2));left:auto;width:min(390px,430px);max-width:430px}
body.theme-claymorphism-shell :is(.modal-root,.story-viewer,.story-contact-modal){left:max(0px,calc((100vw - 430px)/2));right:max(0px,calc((100vw - 430px)/2));width:auto;max-width:430px;margin-inline:auto}
body.theme-claymorphism-shell dialog{max-width:410px;box-sizing:border-box}
body.theme-claymorphism-shell dialog::backdrop{clip-path:inset(0 max(0px,calc((100vw - 430px)/2)))}
}