/* Shared image treatment: photos and screenshots use soft corners everywhere.
   Brand marks, store badges and small UI icons keep their original silhouettes. */
:root { --xb-image-radius: 24px; }
html body img:not([src*="logo"]):not([src$=".svg"]):not([class*="logo"]):not([class*="avatar"]):not(.rounded-full):not(.cx-th):not(.cx-al):not(.cx-x):not(.cx-si):not(.an-xw):not(.gw-xw):not(.hq-close__seal):not(.hq-lockup__by img):not(.cx-src img):not(.pf-shot img):not(.hq-compact-work img:not(.mz-photo img)):not([class*="logo"] img):not([class*="icon"] img):not(a[href*="apps.apple.com"] img):not(a[href*="play.google.com"] img) {
  border-radius: var(--xb-image-radius) !important;
}
/* Clip wrapper fills, captions and hover zooms along the same curved edge. */
html body :is(.xbr-blog-media,.xbr-story-image,.customer-content .hero-media,.hq-story__media,.mz-photo,.pf-vcard__media,.hq-close__bg) {
  border-radius: var(--xb-image-radius) !important;
  overflow: hidden;
}
/* Photo panels rendered as CSS backgrounds still follow the image rule. */
html[data-hq-brand] .cta_layout::after,
html[data-hq-brand] .customer-content .cta-section::after {
  border-radius: var(--xb-image-radius) !important;
}
@media (max-width: 767px) { :root { --xb-image-radius: 16px; } }