.sr{min-width:0;position:relative}.sr-track{scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;gap:8px;padding:4px 2px;scroll-padding-inline:2px;display:flex;overflow-x:auto}.sr-track::-webkit-scrollbar{display:none}.sr-track>*{scroll-snap-align:start}.sr:before,.sr:after{content:"";z-index:2;pointer-events:none;opacity:0;width:40px;transition:opacity .2s;position:absolute;top:0;bottom:0}.sr:before{background:linear-gradient(90deg,#fff 20%,#fff0);left:0}.sr:after{background:linear-gradient(270deg,#fff 20%,#fff0);right:0}.sr.has-left:before,.sr.has-right:after{opacity:1}.sr-arrow{z-index:3;width:34px;height:34px;color:var(--ink);cursor:pointer;background:#fff;border:1px solid #cfdcd7;border-radius:50%;place-items:center;padding:0;display:none;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 4px 12px #143a422e}.sr-arrow:hover{background:#f1f6f4}.sr-arrow-left{left:0}.sr-arrow-right{right:0}@media (hover:hover) and (pointer:fine){.sr.has-left .sr-arrow-left,.sr.has-right .sr-arrow-right{display:grid}}