.banner{-webkit-tap-highlight-color:#0000;background:0 0;outline:none;width:300px;display:block;position:relative;overflow:hidden}.banner .banner-top-img{cursor:pointer;aspect-ratio:300/127;-webkit-tap-highlight-color:#0000;border-radius:12px;outline:none;width:100%;height:auto;margin:0 auto;display:block}.single-banner-wrapper{justify-content:center;align-items:center;width:100%;padding:0 20px;display:flex}
.container-button{z-index:10;width:100%;margin-top:16px;padding-left:24px;padding-right:24px;position:relative}.container-button .button-rank{background:linear-gradient(270deg,#00d9ed 0%,#008ced 100%);border-radius:100px;justify-content:center;align-items:center;gap:8px;width:100%;height:50px;display:flex;position:relative;overflow:hidden}.container-button .button-rank:before{content:"";will-change:transform,left;pointer-events:none;opacity:1;background:linear-gradient(120deg,#fff0 0%,#fff9 50%,#fff0 100%);width:50%;height:100%;animation:2s ease-in-out .1s infinite shine;position:absolute;top:0;left:-75%;transform:translateZ(0)skew(-20deg)}
.change-layout-container{z-index:1;justify-content:space-between;align-items:center;margin-top:10px;margin-bottom:8px;padding-left:16px;padding-right:16px;display:flex;position:relative}.change-layout-container .online-status{justify-content:center;align-items:center;gap:2px;display:flex}.change-layout-container .online-status img{width:24px;height:24px}.change-layout-container .online-status span{color:#fff;font-size:16px;font-weight:600;line-height:21px}.change-layout-container .layout-toggle{border:1px solid #fff;border-radius:100px;justify-content:center;align-items:center;height:24px;padding-left:8px;padding-right:8px;display:flex}.change-layout-container .layout-toggle img{width:18px;height:18px}.change-layout-container .layout-toggle span{color:#fff;margin-left:4px;font-size:10px;font-weight:400;line-height:0!important}
.banner-top-slider .slick-track{align-items:center;gap:12px;display:flex!important}.slider{margin-bottom:2px;padding-left:8px;padding-right:8px}.slider .slick-track{align-items:center;gap:4px;display:flex!important}.slider .slick-slider{box-shadow:none;border:none}.slider .slick-prev,.slider .slick-next{display:none!important}.slider .slick-slide{width:auto!important;height:100%!important}.slider .tab-item{align-items:center;gap:4px;display:flex}.slider .tab-item p{margin-bottom:0;font-size:13px;font-weight:600}.slider .glass-button{color:#a196a4;background:0 0;border:none;border-radius:100px;justify-content:center;align-items:center;height:33px;padding:6px 12px;font-size:13px;transition:background .3s;display:flex;position:relative;overflow:hidden}.slider .glass-button.active{color:#fff;background:linear-gradient(270deg,#7700ed 0%,#ed008c 100%)}.slider .glass-button.active-green{color:#fff;background:linear-gradient(270deg,#37c98a 0%,#d9f03f 100%)}.slider .glass-button.active:before{content:"";pointer-events:none;background:linear-gradient(120deg,#fff0 0%,#fff9 50%,#fff0 100%);width:50%;height:100%;animation:2s ease-in-out infinite shine;position:absolute;top:0;left:-75%;transform:skew(-20deg)}@keyframes shine{0%{left:-75%}to{left:125%}}.tab-container{justify-content:space-between;gap:8px;margin-bottom:8px;padding:0 8px;display:flex}.tab-button{color:#a196a4;background:0 0;border:none;border-radius:100px;flex:1;justify-content:center;align-items:center;height:33px;padding:6px 12px;font-size:13px;font-weight:600;transition:background .3s;display:flex;position:relative;overflow:hidden}.tab-button.active{color:#fff;background:linear-gradient(270deg,#7700ed 0%,#ed008c 100%)}.tab-button.active-green{background:linear-gradient(270deg,#37c98a 0%,#d9f03f 100%)}.tab-button.active:before{content:"";pointer-events:none;background:linear-gradient(120deg,#fff0 0%,#fff9 50%,#fff0 100%);width:50%;height:100%;animation:2s ease-in-out infinite shine;position:absolute;top:0;left:-75%;transform:skew(-20deg)}