.roller-wrap{--roller-fade-bg:var(--color-bg);--roller-glow:#e8b339;min-width:0;position:relative}.roller-wrap[data-axis=y]{min-height:0}.roller{scrollbar-width:none;-ms-overflow-style:none}.roller::-webkit-scrollbar{width:0;height:0;display:none}.roller-wrap[data-axis=x]>.roller{touch-action:pan-x;cursor:grab;overflow:auto hidden}.roller-wrap[data-axis=y]>.roller{touch-action:pan-y;cursor:grab;height:100%;overflow:hidden auto}.roller.is-dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}.roller-fade{pointer-events:none;opacity:0;z-index:2;transition:opacity .2s;position:absolute}.roller-fade.is-visible{opacity:1;animation:2.4s ease-in-out infinite rollerGlow}@keyframes rollerGlow{0%,to{opacity:.35}50%{opacity:.95}}@media (prefers-reduced-motion:reduce){.roller-fade.is-visible{opacity:.8;animation:none}}.roller-wrap[data-axis=x] .roller-fade[data-edge=start]{background:linear-gradient(to right, color-mix(in srgb, var(--roller-glow) 45%, var(--roller-fade-bg)), transparent);width:24px;top:0;bottom:0;left:0}.roller-wrap[data-axis=x] .roller-fade[data-edge=end]{background:linear-gradient(to left, color-mix(in srgb, var(--roller-glow) 45%, var(--roller-fade-bg)), transparent);width:24px;top:0;bottom:0;right:0}.roller-wrap[data-axis=y] .roller-fade[data-edge=start]{background:linear-gradient(to bottom, color-mix(in srgb, var(--roller-glow) 45%, var(--roller-fade-bg)), transparent);height:24px;top:0;left:0;right:0}.roller-wrap[data-axis=y] .roller-fade[data-edge=end]{background:linear-gradient(to top, color-mix(in srgb, var(--roller-glow) 45%, var(--roller-fade-bg)), transparent);height:24px;bottom:0;left:0;right:0}.roller-hint{pointer-events:none;opacity:0;z-index:3;color:var(--color-text);background:0 0;border:0;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-family:inherit;font-size:15px;font-weight:900;transition:opacity .15s;display:flex;position:absolute}button.roller-hint{cursor:pointer}.roller-hint.is-visible{opacity:1;pointer-events:auto}.roller-hint.is-visible:hover{font-size:18px}.roller-wrap[data-axis=x] .roller-hint[data-edge=start]{top:50%;left:2px;transform:translateY(-50%)}.roller-wrap[data-axis=x] .roller-hint[data-edge=end]{top:50%;right:2px;transform:translateY(-50%)}.roller-wrap[data-axis=y] .roller-hint[data-edge=start]{top:1px;left:50%;transform:translate(-50%)}.roller-wrap[data-axis=y] .roller-hint[data-edge=end]{bottom:1px;left:50%;transform:translate(-50%)}@keyframes rollerNudgeXEnd{30%{transform:translate(-7px)}}@keyframes rollerNudgeXStart{30%{transform:translate(7px)}}@keyframes rollerNudgeYEnd{30%{transform:translateY(-7px)}}@keyframes rollerNudgeYStart{30%{transform:translateY(7px)}}.roller.nudge-x-end{animation:.22s rollerNudgeXEnd}.roller.nudge-x-start{animation:.22s rollerNudgeXStart}.roller.nudge-y-end{animation:.22s rollerNudgeYEnd}.roller.nudge-y-start{animation:.22s rollerNudgeYStart}
