.hot_rank_page{--rank-width: min(100vw, 428px);--rank-unit: calc(var(--rank-width)/100);height:calc(100vh - 59.3438px - env(safe-area-inset-bottom));height:calc(100vh - var(--app-tabbar-safe-height, 59.3438px) - env(safe-area-inset-bottom));margin:0 auto;max-width:428px;overflow-y:auto;overscroll-behavior-y:contain;width:min(100vw,428px);width:var(--rank-width);-webkit-overflow-scrolling:touch;background-color:#101012;background-image:var(--rank-banner-bg);background-position:top;background-repeat:no-repeat;background-size:100% auto;color:#e3e3e5;font-family:PingFang SC,Helvetica Neue,Arial,sans-serif}.hot_rank_page__inner{background:#101012;margin-top:calc(var(--rank-unit)*34.9333);min-height:100%}.hot_rank_page__category_tabs{position:sticky;top:0;z-index:20;display:flex;align-items:stretch;background:#101012;box-shadow:inset 0 -1px rgba(255,255,255,.08);height:calc(var(--rank-unit)*14.9333);padding:0 calc(var(--rank-unit)*3.2)}.hot_rank_page__category_tab{position:relative;display:flex;flex:none;align-items:center;justify-content:center;border-width:0px;padding:0;background:transparent;color:#c8c8cc;font-size:calc(var(--rank-unit)*4.8);font-weight:400;height:100%;line-height:calc(var(--rank-unit)*5.3333)}.hot_rank_page__category_tab+.hot_rank_page__category_tab{margin-left:calc(var(--rank-unit)*8)}.hot_rank_page__category_tab.is-active{color:#e3e3e5;font-weight:600}.hot_rank_page__category_tab.is-active:after{background:linear-gradient(315deg,#00e0ff,#00b8ff);border-radius:calc(var(--rank-unit)*.26667);bottom:calc(var(--rank-unit)*3.2);content:"";height:calc(var(--rank-unit)*.53333);left:50%;position:absolute;transform:translate(-50%);width:calc(var(--rank-unit)*3.2)}.hot_rank_page__content{position:relative}.hot_rank_page__period_tabs{position:sticky;z-index:19;margin:0;display:flex;list-style-type:none;align-items:center;justify-content:space-between;background:#101012;height:calc(var(--rank-unit)*11.7333);padding:0 calc(var(--rank-unit)*21.7333);top:calc(var(--rank-unit)*14.9333)}.hot_rank_page__period_tab{border-width:0px;padding:0;background:transparent;color:#969699;font-size:calc(var(--rank-unit)*3.73333);font-weight:400;line-height:calc(var(--rank-unit)*11.7333)}.hot_rank_page__period_tab.is-active{color:#ff743d;font-size:calc(var(--rank-unit)*4.8);font-weight:600}.hot_rank_page__list_wrap{padding:0 calc(var(--rank-unit)*3.2) calc(var(--rank-unit)*5.33333 + env(safe-area-inset-bottom))}.hot_rank_page__bottom_list,.hot_rank_page__top_list{margin:0;list-style:none}.hot_rank_page__top_list{display:flex;justify-content:space-between;border-bottom:1px solid hsla(0,0%,100%,.08);padding:calc(var(--rank-unit)*2.66667) 0 calc(var(--rank-unit)*5.33333)}.hot_rank_page__bottom_item,.hot_rank_page__top_item{margin:0;padding:0}.hot_rank_page__top_link{display:block;color:inherit;-webkit-text-decoration:none;text-decoration:none;width:calc(var(--rank-unit)*29.3333)}.hot_rank_page__bottom_cover_wrap,.hot_rank_page__top_cover_wrap{position:relative}.hot_rank_page__top_cover_wrap{height:calc(var(--rank-unit)*39.2);width:calc(var(--rank-unit)*29.3333)}.hot_rank_page__bottom_cover,.hot_rank_page__top_cover{display:block;width:100%;height:100%;border-radius:calc(var(--rank-unit)*.53333);-o-object-fit:fill;object-fit:fill}.hot_rank_page__top_badge{height:calc(var(--rank-unit)*4.8);left:0;position:absolute;top:0;width:calc(var(--rank-unit)*4.8)}.hot_rank_page__bottom_genres,.hot_rank_page__bottom_meta,.hot_rank_page__bottom_title,.hot_rank_page__top_genres,.hot_rank_page__top_meta,.hot_rank_page__top_title{margin:0}.hot_rank_page__top_title{color:#e3e3e5;font-size:calc(var(--rank-unit)*3.73333);font-weight:600;line-height:calc(var(--rank-unit)*3.73333);overflow:hidden;padding-top:calc(var(--rank-unit)*2.66667);text-overflow:ellipsis;white-space:nowrap}.hot_rank_page__bottom_genres,.hot_rank_page__bottom_meta,.hot_rank_page__top_genres,.hot_rank_page__top_meta{color:#969699;font-size:calc(var(--rank-unit)*2.93333);font-weight:400;line-height:calc(var(--rank-unit)*2.93333)}.hot_rank_page__top_meta{padding-top:calc(var(--rank-unit)*2.66667)}.hot_rank_page__top_genres{padding-top:calc(var(--rank-unit)*2.13333)}.hot_rank_page__bottom_list{padding:0 0 calc(var(--rank-unit)*5.33333)}.hot_rank_page__bottom_item+.hot_rank_page__bottom_item,.hot_rank_page__bottom_item:first-child{margin-top:calc(var(--rank-unit)*5.33333)}.hot_rank_page__bottom_link{display:flex;align-items:flex-start;color:inherit;-webkit-text-decoration:none;text-decoration:none}.hot_rank_page__bottom_cover_wrap{flex:none;height:calc(var(--rank-unit)*39.2);width:calc(var(--rank-unit)*29.3333)}.hot_rank_page__bottom_rank{position:absolute;left:0;top:0;display:block;text-align:center;background:rgba(0,0,0,.7);border-radius:calc(var(--rank-unit)*.53333);color:#fff;font-size:calc(var(--rank-unit)*3.73333);font-weight:600;height:calc(var(--rank-unit)*4.8);line-height:calc(var(--rank-unit)*4.8);width:calc(var(--rank-unit)*4.8)}.hot_rank_page__bottom_copy{margin-left:calc(var(--rank-unit)*2.66667);min-width:0}.hot_rank_page__bottom_title{color:#e3e3e5;font-size:calc(var(--rank-unit)*4.26667);font-weight:600;line-height:calc(var(--rank-unit)*4.26667);overflow:hidden;padding-top:calc(var(--rank-unit)*.26667);text-overflow:ellipsis;white-space:nowrap}.hot_rank_page__bottom_meta{padding-top:calc(var(--rank-unit)*5.73333)}.hot_rank_page__bottom_genres{padding-top:calc(var(--rank-unit)*4.13333)}