/* arrows on sideways rows (computers only; js/rails.js) */
.rlx-wrap{position:relative;min-width:0}
.rlx-btn{position:absolute;z-index:6;top:50%;display:grid;place-items:center;width:38px;height:38px;margin-top:-19px;border-radius:50%;
  background:rgba(22,21,30,.92);border:1px solid rgba(255,255,255,.14);color:#fff;box-shadow:0 8px 22px -6px rgba(0,0,0,.8);cursor:pointer;opacity:0;transition:opacity .18s,transform .15s,background .15s}
.rlx-btn[hidden]{display:none}
.rlx-btn.l{left:-6px}.rlx-btn.r{right:-6px}
.rlx-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.rlx-wrap:hover .rlx-btn{opacity:1}
.rlx-btn:hover{background:#2a2838;transform:scale(1.06)}
.rlx-btn:active{transform:scale(.94)}
/* soft fade on the side that has more */
.rlx-wrap.more-r>:first-child{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 48px),transparent)}
.rlx-wrap.more-l>:first-child{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px);mask-image:linear-gradient(90deg,transparent,#000 48px)}
.rlx-wrap.more-l.more-r>:first-child{-webkit-mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(90deg,transparent,#000 48px,#000 calc(100% - 48px),transparent)}
.rlx-drag{cursor:grabbing!important;user-select:none;-webkit-user-select:none;scroll-behavior:auto!important}
.rlx-drag *{pointer-events:none}
@media (hover:none),(pointer:coarse){.rlx-btn{display:none!important}.rlx-wrap>:first-child{-webkit-mask-image:none!important;mask-image:none!important}}
