@property --scroll-mask-t-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-b-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-l-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-r-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@keyframes scroll-mask-y-scroll{0%{--scroll-mask-t-from:100%}10%,to{--scroll-mask-t-from:var(--scroll-mask-fade-from-t,100%)}0%,90%{--scroll-mask-b-from:var(--scroll-mask-fade-from-b,100%)}to{--scroll-mask-b-from:100%}}@keyframes scroll-mask-x-scroll{0%{--scroll-mask-l-from:100%}10%,to{--scroll-mask-l-from:var(--scroll-mask-fade-from-l,100%)}0%,90%{--scroll-mask-r-from:var(--scroll-mask-fade-from-r,100%)}to{--scroll-mask-r-from:100%}}@supports (animation-timeline:scroll()){:where([class^=scroll-mask-],[class*=\ scroll-mask-]){--scroll-mask-t:linear-gradient(to top,black,black var(--scroll-mask-t-from),transparent);--scroll-mask-b:linear-gradient(to bottom,black,black var(--scroll-mask-b-from),transparent);--scroll-mask-l:linear-gradient(to left,black,black var(--scroll-mask-l-from),transparent);--scroll-mask-r:linear-gradient(to right,black,black var(--scroll-mask-r-from),transparent);-webkit-mask-image:var(--scroll-mask-t),var(--scroll-mask-b),var(--scroll-mask-l),var(--scroll-mask-r);mask-image:var(--scroll-mask-t),var(--scroll-mask-b),var(--scroll-mask-l),var(--scroll-mask-r);-webkit-mask-composite:source-in;animation:linear scroll-mask-y-scroll,linear scroll-mask-x-scroll;animation-timeline:scroll(self),scroll(self inline);-webkit-mask-composite:source-in;mask-composite:intersect}}@utility scroll-mask-t{--scroll-mask-fade-from-t: 80%;}@utility scroll-mask-t-from-*{--scroll-mask-fade-from-t: --spacing(--value(integer)); --scroll-mask-fade-from-t: --value(percentage); --scroll-mask-fade-from-t: --value([length],[percentage]);}@utility scroll-mask-b{--scroll-mask-fade-from-b: 80%;}@utility scroll-mask-b-from-*{--scroll-mask-fade-from-b: --spacing(--value(integer)); --scroll-mask-fade-from-b: --value(percentage); --scroll-mask-fade-from-b: --value([length],[percentage]);}@utility scroll-mask-y{--scroll-mask-fade-from-t: 80%; --scroll-mask-fade-from-b: 80%;}@utility scroll-mask-y-from-*{--scroll-mask-fade-from-t: --spacing(--value(integer)); --scroll-mask-fade-from-t: --value(percentage); --scroll-mask-fade-from-t: --value([length],[percentage]); --scroll-mask-fade-from-b: --spacing(--value(integer)); --scroll-mask-fade-from-b: --value(percentage); --scroll-mask-fade-from-b: --value([length],[percentage]);}@utility scroll-mask-l{--scroll-mask-fade-from-l: 80%;}@utility scroll-mask-l-from-*{--scroll-mask-fade-from-l: --spacing(--value(integer)); --scroll-mask-fade-from-l: --value(percentage); --scroll-mask-fade-from-l: --value([length],[percentage]);}@utility scroll-mask-r{--scroll-mask-fade-from-r: 80%;}@utility scroll-mask-r-from-*{--scroll-mask-fade-from-r: --spacing(--value(integer)); --scroll-mask-fade-from-r: --value(percentage); --scroll-mask-fade-from-r: --value([length],[percentage]);}@utility scroll-mask-x{--scroll-mask-fade-from-l: 80%; --scroll-mask-fade-from-r: 80%;}@utility scroll-mask-x-from-*{--scroll-mask-fade-from-l: --spacing(--value(integer)); --scroll-mask-fade-from-l: --value(percentage); --scroll-mask-fade-from-l: --value([length],[percentage]); --scroll-mask-fade-from-r: --spacing(--value(integer)); --scroll-mask-fade-from-r: --value(percentage); --scroll-mask-fade-from-r: --value([length],[percentage]);}