@property --_comp-scroll-container-mask-start-opacity{syntax: "<number>"; initial-value: 1; inherits: false;}@property --_comp-scroll-container-mask-end-opacity{syntax: "<number>"; initial-value: 1; inherits: false;}@layer core.atoms{.phxsg-scroll-container{--_comp-scroll-container-mask-size: var(--comp-scroll-container-mask-size, var(--sys-spacing-18));--_comp-scroll-container-mask-direction: to right;--_comp-scroll-container-mask-start-opacity: 1;--_comp-scroll-container-mask-end-opacity: 1;overflow-x:auto;mask-image:linear-gradient(var(--_comp-scroll-container-mask-direction),rgb(0 0 0 / var(--_comp-scroll-container-mask-start-opacity)) 0%,#000 var(--_comp-scroll-container-mask-size),#000 calc(100% - var(--_comp-scroll-container-mask-size)),rgb(0 0 0 / var(--_comp-scroll-container-mask-end-opacity)) 100%);transition:--_comp-scroll-container-mask-start-opacity var(--sys-motion-duration-short-4) var(--sys-motion-easing-standard-decelerate),--_comp-scroll-container-mask-end-opacity var(--sys-motion-duration-short-4) var(--sys-motion-easing-standard-decelerate);[dir=rtl] &{--_comp-scroll-container-mask-direction: to left}}}
