@layer atoms{.phxsg-loader{--comp-loader-size: var(--sys-spacing-5);--comp-loader-thickness: 1px}}@layer molecules{.phxsg-product-animation{--_comp-product-animation-icon-inset-block-end: var(--sys-spacing-5);--_comp-product-animation-lightbox-icon-inset-block-end: calc( (var(--comp-lightbox-gap) * 1.5) + var(--_comp-product-animation-icon-inset-block-end) );--_comp-product-animation-icon-size: var(--sys-spacing-8);--_comp-product-animation-icon-glyph-size: 18px;--_comp-product-animation-icon-background: rgb(255 255 255 / 72%);position:relative;display:flex;align-items:center;justify-content:center;inline-size:100%;block-size:100%;overflow:hidden}.phxsg-product-animation__loader{display:flex;align-items:center;justify-content:center;inline-size:100%;block-size:100%}.phxsg-product-animation__canvas{display:block;inline-size:100%;block-size:100%;max-inline-size:100%;max-block-size:100%;object-position:center}.phxsg-product-animation--contain .phxsg-product-animation__canvas,.phxsg-lightbox__product-animation .phxsg-product-animation__canvas{object-fit:contain}.phxsg-product-animation--cover .phxsg-product-animation__canvas{object-fit:cover}.phxsg-product-animation__icon-wrapper{display:flex;justify-content:center;position:absolute;inset-block-end:var(--_comp-product-animation-icon-inset-block-end);inset-inline:0;pointer-events:none}.phxsg-product-animation__icon-badge{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_comp-product-animation-icon-size);block-size:var(--_comp-product-animation-icon-size);border-radius:50%;background:var(--_comp-product-animation-icon-background);backdrop-filter:blur(6px)}.phxsg-product-animation__icon-image,.phxsg-product-animation__icon-svg{inline-size:var(--_comp-product-animation-icon-glyph-size);block-size:var(--_comp-product-animation-icon-glyph-size)}.phxsg-product-animation__icon-svg{color:currentcolor}.phxsg-lightbox__product-animation{padding-inline:var(--comp-lightbox-gap);padding-block:calc(var(--comp-lightbox-gap) * 1.5)}.phxsg-lightbox__product-animation .phxsg-product-animation__icon-wrapper{inset-block-end:var(--_comp-product-animation-lightbox-icon-inset-block-end)}}