:root{--z-scrollbar-size:4px;--z-scrollbar-padding:4px;--z-scrollbar-margin:2px}.z-scroller-test,.z-scroller>.z-scrollarea{display:block;position:relative;height:100%;box-sizing:border-box;padding:var(--z-scroller-padding,0);overflow:auto!important;scroll-behavior:smooth;overscroll-behavior:auto;will-change:scroll-position;scrollbar-width:thin;scrollbar-width:none!important;-webkit-overflow-scrolling:touch}.z-scroller-test::-webkit-scrollbar,.z-scroller>.z-scrollarea::-webkit-scrollbar{width:0!important;height:0!important}.z-scroller{--zz-scrollbar-margin:calc(var(--z-scrollbar-margin) - var(--z-scrollbar-padding));--zz-scrollbar-size:calc(var(--z-scrollbar-size) + var(--z-scrollbar-padding) * 2);position:relative;overflow:hidden;z-index:0}.z-scroller.z-vert{height:100%}.z-scroller:not(.z-horz)>.z-scrollarea{overflow-x:hidden!important}.z-scroller:not(.z-vert)>.z-scrollarea{overflow-y:hidden!important}.z-scroller.z-dragging>.z-scrollarea{scroll-behavior:auto}.z-scroller.z-discreet>.z-scrollbar{pointer-events:none}.z-scroller .z-scrollcontent{display:block;min-width:100%}.z-scroller.z-horz-active.z-vert-active>.z-scrollbar.z-horz{right:var(--z-scrollbar-size)}.z-scroller.z-horz-active.z-vert-active>.z-scrollbar.z-vert{bottom:var(--z-scrollbar-size)}.z-scroller.z-horz-active.z-vert-active>.z-scrollbar.z-vert:after{position:absolute;top:calc(100% - var(--z-scrollbar-margin));left:var(--z-scrollbar-padding);width:var(--z-scrollbar-size);height:var(--z-scrollbar-size);content:"";background:#696969;border-radius:inherit;opacity:.5}.z-scrollbar{position:absolute;right:var(--zz-scrollbar-margin);bottom:var(--zz-scrollbar-margin);border-radius:50px;opacity:0;z-index:99;cursor:pointer;transition:opacity .3s ease-out;contain:strict}.z-scrollbar.z-visible{opacity:1}.z-scrollbar.z-vert{width:var(--zz-scrollbar-size);top:var(--zz-scrollbar-margin)}.z-scrollbar.z-vert .z-thumb{width:100%}.z-scrollbar.z-horz{height:var(--zz-scrollbar-size);left:var(--zz-scrollbar-margin)}.z-scrollbar.z-horz .z-thumb{height:100%}.z-scrollbar .z-thumb{position:relative;box-sizing:border-box;cursor:pointer;border-radius:inherit;border:transparent solid var(--z-scrollbar-padding);background:content-box #696969;opacity:.7;transition:opacity .3s;mix-blend-mode:difference}@media(hover:hover){.z-scroller.z-horz-active:not(.z-discreet)>.z-scrollarea>.z-scrollcontent{padding-bottom:calc(var(--zz-scrollbar-size) / 2)}.z-scrollbar .z-thumb:hover{opacity:1}}.z-scrollbar.z-dragging .z-thumb{opacity:1}