/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./node_modules/@music/mobile-toast/dist/index.less ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/* 中间显示toast */
.mrc-toast,
.m-toast {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1000;
  transform: translate(-50%, -50%);
  min-width: 70px;
  min-height: 30px;
  text-align: center;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0;
  transition: all 200ms linear;
  /* 动画设置 */
  /* 页面顶部显示toast */
}
.mrc-toast.toast-entering,
.m-toast.toast-entering {
  opacity: 0;
}
.mrc-toast.toast-entered,
.m-toast.toast-entered {
  opacity: 1;
}
.mrc-toast.toast-exiting,
.m-toast.toast-exiting {
  opacity: 1;
}
.mrc-toast.toast-exited,
.m-toast.toast-exited {
  opacity: 0;
}
.mrc-toast .text,
.m-toast .text {
  padding: 10px 15px;
  line-height: 30px;
  font-size: 15px;
  color: #fff;
}
.mrc-toast-center,
.m-toast-center {
  margin-top: -100px;
  width: 180px;
  min-height: 116px;
  border-radius: 6px;
}
.mrc-toast-center .icn,
.m-toast-center .icn {
  display: inline-block;
  width: 35px;
  height: 35px;
  margin: 25px 0 6px;
}
.mrc-toast-center .text,
.m-toast-center .text {
  line-height: 20px;
  padding: 0 15px 10px;
}
.mrc-toast-top,
.m-toast-top {
  top: calc(15px + constant(safe-area-inset-top));
  top: calc(15px + env(safe-area-inset-top));
  left: 50%;
  transform: translateX(-50%);
  min-width: 70px;
  height: 30px;
  padding: 0 15px;
  line-height: 30px;
  border-radius: 15px;
  background: rgba(0, 0, 0, 0.6);
}
.mrc-toast-top .text,
.m-toast-top .text {
  padding: 0;
  line-height: 30px;
}
.mrc-toast-top .icn,
.m-toast-top .icn {
  display: none;
  margin: 0;
}
.mrc-toast-top.toast-entering,
.m-toast-top.toast-entering {
  transform: translate(-50%, -100%);
  opacity: 0.5;
}
.mrc-toast-top.toast-entered,
.m-toast-top.toast-entered {
  transform: translate(-50%, 0);
  opacity: 1;
}
.mrc-toast-top.toast-exiting,
.m-toast-top.toast-exiting {
  transform: translate(-50%, 0);
  opacity: 0.5;
}
.mrc-toast-top.toast-exited,
.m-toast-top.toast-exited {
  transform: translate(-50%, -100%);
  opacity: 0.01;
}
.mrc-toast-loading,
.m-toast-loading {
  margin-top: -100px;
  width: 180px;
  min-height: 116px;
  border-radius: 6px;
}
.mrc-toast-loading .icn,
.m-toast-loading .icn {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 27px 0 6px;
  background: url("//p3.music.126.net/C9tJEnwLhYm4dvTdsukD0g==/19106213556354168.jpg") no-repeat;
  background-size: 30px 240px;
  background-position: 0 0;
  animation: toastload 0.72s infinite step-start;
}
.mrc-toast-loading .text,
.m-toast-loading .text {
  line-height: 20px;
  padding: 0 15px 10px;
}
.mrc-toast-iconmiddle .icn,
.m-toast-iconmiddle .icn {
  margin-top: 43px;
}
@keyframes toastload {
  0% {
    background-position-y: 0;
  }
  14.28% {
    background-position-y: -30px;
  }
  28.56% {
    background-position-y: -60px;
  }
  42.84% {
    background-position-y: -90px;
  }
  57.12% {
    background-position-y: -120px;
  }
  71.4% {
    background-position-y: -150px;
  }
  85.68% {
    background-position-y: -180px;
  }
  100% {
    background-position-y: -210px;
  }
}

/*!*****************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/@music/mobile-toast/dist/index.css ***!
  \*****************************************************************************************************************************************************************************************************/
/* 中间显示toast */
.mrc-toast,
.m-toast {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1000;
  transform: translate(-50%, -50%);
  min-width: 70px;
  min-height: 30px;
  text-align: center;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.8);
  opacity: 0;
  transition: all 200ms linear;
  /* 动画设置 */
  /* 页面顶部显示toast */
}
.mrc-toast.toast-entering,
.m-toast.toast-entering {
  opacity: 0;
}
.mrc-toast.toast-entered,
.m-toast.toast-entered {
  opacity: 1;
}
.mrc-toast.toast-exiting,
.m-toast.toast-exiting {
  opacity: 1;
}
.mrc-toast.toast-exited,
.m-toast.toast-exited {
  opacity: 0;
}
.mrc-toast .text,
.m-toast .text {
  padding: 10px 15px;
  line-height: 30px;
  font-size: 15px;
  color: #fff;
}
.mrc-toast-center,
.m-toast-center {
  margin-top: -100px;
  width: 180px;
  min-height: 116px;
  border-radius: 6px;
}
.mrc-toast-center .icn,
.m-toast-center .icn {
  display: inline-block;
  width: 35px;
  height: 35px;
  margin: 25px 0 6px;
}
.mrc-toast-center .text,
.m-toast-center .text {
  line-height: 20px;
  padding: 0 15px 10px;
}
.mrc-toast-top,
.m-toast-top {
  top: calc(15px + constant(safe-area-inset-top));
  top: calc(15px + env(safe-area-inset-top));
  left: 50%;
  transform: translateX(-50%);
  min-width: 70px;
  height: 30px;
  padding: 0 15px;
  line-height: 30px;
  border-radius: 15px;
  background: rgba(0, 0, 0, 0.6);
}
.mrc-toast-top .text,
.m-toast-top .text {
  padding: 0;
  line-height: 30px;
}
.mrc-toast-top .icn,
.m-toast-top .icn {
  display: none;
  margin: 0;
}
.mrc-toast-top.toast-entering,
.m-toast-top.toast-entering {
  transform: translate(-50%, -100%);
  opacity: 0.5;
}
.mrc-toast-top.toast-entered,
.m-toast-top.toast-entered {
  transform: translate(-50%, 0);
  opacity: 1;
}
.mrc-toast-top.toast-exiting,
.m-toast-top.toast-exiting {
  transform: translate(-50%, 0);
  opacity: 0.5;
}
.mrc-toast-top.toast-exited,
.m-toast-top.toast-exited {
  transform: translate(-50%, -100%);
  opacity: 0.01;
}
.mrc-toast-loading,
.m-toast-loading {
  margin-top: -100px;
  width: 180px;
  min-height: 116px;
  border-radius: 6px;
}
.mrc-toast-loading .icn,
.m-toast-loading .icn {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 27px 0 6px;
  background: url("//p3.music.126.net/C9tJEnwLhYm4dvTdsukD0g==/19106213556354168.jpg") no-repeat;
  background-size: 30px 240px;
  background-position: 0 0;
  animation: toastload 0.72s infinite step-start;
}
.mrc-toast-loading .text,
.m-toast-loading .text {
  line-height: 20px;
  padding: 0 15px 10px;
}
.mrc-toast-iconmiddle .icn,
.m-toast-iconmiddle .icn {
  margin-top: 43px;
}
@keyframes toastload {
  0% {
    background-position-y: 0;
  }
  14.28% {
    background-position-y: -30px;
  }
  28.56% {
    background-position-y: -60px;
  }
  42.84% {
    background-position-y: -90px;
  }
  57.12% {
    background-position-y: -120px;
  }
  71.4% {
    background-position-y: -150px;
  }
  85.68% {
    background-position-y: -180px;
  }
  100% {
    background-position-y: -210px;
  }
}

/*!***********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/components/taskItem/index.less ***!
  \***********************************************************************************************************************************************************************************************************************************************************/
.task {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 7.4648vw;
}
.task .taskIcon {
  width: 6.3984vw;
  height: 6.3984vw;
  flex-shrink: 0;
  margin-left: 4.2656vw;
}
.task .taskItemDesc {
  display: flex;
  flex-direction: column;
  flex: 1;
  margin-left: 4.2656vw;
  margin-right: 3.1992vw;
}
.task .taskItemDesc .taskItemName {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 4.2656vw;
  color: #fff;
}
.task .taskItemDesc .taskItemTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  color: #999;
  margin-top: 2.1328vw;
}
.task .taskAction {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  margin-left: auto;
  margin-right: 4.2656vw;
  align-items: center;
}
.task .taskAction .actionButton {
  flex-shrink: 0;
  height: 6.9316vw;
  border-radius: 12.5302vw;
  border: 0.5px solid #ffe498;
  padding: 0 3.999vw;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.9326vw;
  color: #ffe498;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: content-box;
}
.task .taskAction .actionButton.finished {
  color: rgba(255, 255, 255, 0.6);
  background: #999;
  border-color: transparent;
}
.task .taskAction .residualCnt {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.4vw;
  color: #fff;
  margin-top: 2.13333vw;
}

/*!******************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/components/dailyTask.less ***!
  \******************************************************************************************************************************************************************************************************************************************************/
.iphonexbm {
  padding-bottom: 0 !important;
}
.dailyTask {
  width: 100%;
  height: 73vh;
  background: #2e2e2e;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.dailyTask .shareContainer {
  width: 76.7808vw;
  height: 107.1732vw;
  position: absolute;
  top: 0;
  z-index: -1;
  overflow: hidden;
  background-color: #000;
}
.dailyTask .shareContainer .shareBottomCover {
  width: 100%;
  position: absolute;
  z-index: 1;
  top: 2.66667vw;
}
.dailyTask .shareContainer .shareContent {
  position: relative;
  z-index: 3;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.dailyTask .shareContainer .shareContent .shareRank {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 4.2656vw;
  margin-top: 5.5986vw;
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankLeft {
  display: flex;
  align-items: center;
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftIcon {
  width: 3.7324vw;
  height: 3.7324vw;
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.9326vw;
  color: #fff;
  margin-left: 1.0664vw;
  margin-right: 1.0664vw;
  letter-spacing: 0.5px;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.4);
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 3.7324vw;
  line-height: 4.2656vw;
  color: #fff;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.1);
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankRight {
  display: flex;
  align-items: center;
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightIcon {
  width: 3.7324vw;
  height: 3.7324vw;
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.9326vw;
  color: #fff;
  margin-left: 1.0664vw;
  margin-right: 1.0664vw;
  letter-spacing: 0.5px;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.4);
}
.dailyTask .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 3.7324vw;
  line-height: 4.2656vw;
  color: #fff;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.1);
}
.dailyTask .shareContainer .shareContent .shareCoverBox {
  width: 50.3874vw;
  height: 41.8562vw;
  margin: 0 auto;
  position: relative;
  margin-top: 7.998vw;
  left: 6.3984vw;
}
.dailyTask .shareContainer .shareContent .shareCoverBox .cd {
  width: 100%;
  height: 100%;
}
.dailyTask .shareContainer .shareContent .shareCoverBox .shareCover {
  width: 41.8562vw;
  height: 41.8562vw;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
}
.dailyTask .shareContainer .shareContent .shareSongName {
  width: 100%;
  text-align: center;
  padding: 0 4.2656vw;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 4.7988vw;
  line-height: 5.5986vw;
  color: #fff;
  margin-top: 5.8652vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dailyTask .shareContainer .shareContent .shareSongArtist {
  width: 100%;
  text-align: center;
  padding: 0 4.2656vw;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  line-height: 3.7324vw;
  color: #999;
  margin-top: 1.8662vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dailyTask .shareContainer .shareContent .shareSongTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  line-height: 3.7324vw;
  color: #cbbb8d;
  margin-top: 4.7988vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 4.2656vw;
  margin-top: 6.3984vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomLeft {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareLogo {
  width: 14.1298vw;
  height: 2.3994vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareUser {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.1328vw;
  line-height: 2.3994vw;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 1.5996vw;
  margin-bottom: 1.333vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareTime {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.1328vw;
  line-height: 2.3994vw;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomLeft .searchBar {
  width: 53.32vw;
  height: 6.1318vw;
  margin-top: 7.4648vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomRight {
  width: 10.3974vw;
  height: 10.3974vw;
  position: relative;
  margin-top: -0.2666vw;
}
.dailyTask .shareContainer .shareContent .shareContentBottom .shareBottomRight canvas {
  border: 0.5332vw solid #fff;
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  box-sizing: border-box;
  image-rendering: pixelated;
}
.dailyTask .shareContainer .bottomSubtract {
  width: 100%;
  position: absolute;
  display: flex;
  flex-direction: column;
  z-index: 2;
  bottom: 0;
}
.dailyTask .shareContainer .bottomSubtract img {
  width: 100%;
  aspect-ratio: 864/642;
}
.dailyTask .shareContainer .bottomSubtract .black {
  width: 100%;
  flex-grow: 1;
  background: #131313;
}
.dailyTask .shareContainer:not(.shareContainer-searchbar) .searchBar {
  display: none;
}
.dailyTask .shareContainer.shareContainer-searchbar {
  height: 117.8372vw;
}
.dailyTask .shareContainer.shareContainer-searchbar .shareLogo,
.dailyTask .shareContainer.shareContainer-searchbar .shareBottomRight {
  display: none;
}
.dailyTask .shareContainer.shareContainer-searchbar .shareSongName {
  margin-top: 3.1992vw;
}
.dailyTask .shareContainer.shareContainer-searchbar .shareContentBottom {
  margin-top: 4.2656vw;
  justify-content: center;
}
.dailyTask .shareContainer.shareContainer-searchbar .shareBottomLeft {
  align-items: center;
}
.dailyTask .shareContainer.shareContainer-searchbar .bottomSubtract {
  height: 70.3824vw;
}
.dailyTask .taskhead {
  margin-top: 6.3984vw;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.dailyTask .taskhead .taskCover {
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  width: 18.662vw;
  height: 18.662vw;
  margin-right: 3.73324vw;
  margin-left: 4.7988vw;
  padding: 0;
  border: none;
}
.dailyTask .taskhead .taskCover .taskCoverImg {
  width: 100%;
  height: 100%;
  border-radius: 1.5996vw;
  background-color: #666;
}
.dailyTask .taskhead .taskDesc {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1.0664vw;
}
.dailyTask .taskhead .taskDesc .taskSongName {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 4.2656vw;
  color: #ffe498;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dailyTask .taskhead .taskDesc .taskSongArtist {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dailyTask .taskhead .taskShare {
  margin-right: 4.26656vw;
  margin-left: auto;
  margin-bottom: 3.7324vw;
  flex-shrink: 0;
  width: 6.3984vw;
  height: 6.3984vw;
}
.dailyTask .taskRank {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 4.7988vw;
  margin-top: 4.2656vw;
  flex-shrink: 0;
  align-items: center;
}
.dailyTask .taskRank .taskRankExpand {
  width: 7.4648vw;
  height: 7.4648vw;
  margin-left: 0.5332vw;
  margin-right: -1.333vw;
  cursor: pointer;
  transform: rotate(180deg);
  transition: transform 0.3s ease;
}
.dailyTask .taskRank .taskRankExpand.expanded {
  transform: rotate(0);
}
.dailyTask .taskRank .noRank {
  width: 2.13328vw;
  height: 0.53332vw;
  background-color: #999;
}
.dailyTask .taskRank .taskRankLeft {
  display: flex;
  align-items: center;
}
.dailyTask .taskRank .taskRankLeft .taskRankLeftIcon {
  width: 4.7988vw;
  height: 4.7988vw;
  margin-bottom: 0.2666vw;
}
.dailyTask .taskRank .taskRankLeft .taskRankLeftTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.7324vw;
  color: #fff;
  margin-left: 1.5996vw;
  margin-right: 1.5996vw;
  margin-top: 0.2666vw;
}
.dailyTask .taskRank .taskRankLeft .taskRankLeftRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 4.7988vw;
  line-height: 7.4648vw;
  color: #fff;
  margin-top: 0.2666vw;
}
.dailyTask .taskRank .taskRankRight {
  display: flex;
  align-items: center;
}
.dailyTask .taskRank .taskRankRight .taskRankRightIcon {
  width: 4.7988vw;
  height: 4.7988vw;
  margin-bottom: 0.2666vw;
}
.dailyTask .taskRank .taskRankRight .taskRankRightTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.7324vw;
  color: #fff;
  margin-left: 1.5996vw;
  margin-right: 1.5996vw;
  margin-top: 0.2666vw;
}
.dailyTask .taskRank .taskRankRight .taskRankRightRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 4.7988vw;
  line-height: 7.4648vw;
  color: #fff;
  margin-top: 0.2666vw;
}
.dailyTask .taskScoreCollapse {
  display: flex;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.3s ease;
  max-height: 0;
  opacity: 0;
}
.dailyTask .taskScoreCollapse.expanded {
  max-height: 106.64vw;
  opacity: 1;
}
.dailyTask .taskScoreCollapse .radar {
  margin: 5.332vw auto 2.666vw;
}
.dailyTask .rankTabBox {
  display: flex;
  justify-content: center;
  height: auto;
  margin-top: 5.8652vw;
  margin-bottom: 7.4648vw;
  flex-shrink: 0;
}
.dailyTask .rankTabBox .rankTab {
  position: relative;
  display: flex;
  justify-content: center;
}
.dailyTask .rankTabBox .rankTab .rankTabText {
  position: relative;
  z-index: 2;
  color: #ccc;
  text-align: center;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-size: 3.7324vw;
  font-weight: 500;
}
.dailyTask .rankTabBox .rankTab .rankTabText.bold {
  color: #fff;
  text-align: center;
  font-family: FZLanTingHeiS-B-GB, Arial, Helvetica, sans-serif;
  font-weight: 700;
}
.dailyTask .rankTabBox .rankTab .rankTabBar {
  width: 14.9296vw;
  height: 0.5332vw;
  flex-shrink: 0;
  border-radius: 5.332vw;
  background: #c09a56;
  position: absolute;
  bottom: 0;
}
.dailyTask .rankTabBox .rankTab2 {
  margin-left: 10.664vw;
}
.dailyTask .taskContentBox {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
  padding-bottom: 12.8vw;
}
.u-btmsht_ct {
  overflow: hidden;
  background: #2e2e2e;
  border-top-left-radius: 4.7988vw;
  border-top-right-radius: 4.7988vw;
}
.z-process-image .shareBottomCover {
  top: 0 !important;
}
.search-loading-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 26.66vw;
}
.search-loading-container .loading-img {
  width: 5.332vw;
  height: 5.332vw;
}

/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/components/error-view/index.less ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
.m-error-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: 'PingFang SC', 'Helvetica Neue', 'Helvetica', sans-serif;
}
.m-error-view .m-error-view-errorPic {
  margin-top: 8.53333vw;
  width: 45.33333vw;
  height: 32vw;
  background-repeat: no-repeat;
  background-size: 45.33333vw;
  background-image: url(https://s7.music.126.net/68be3fc655ac7c00952c9607/d7efdc62213ce01b83bc.png);
}
.m-error-view .m-error-view-message {
  margin-top: 2.13333vw;
  padding: 0 4.26667vw;
  font-size: 4vw;
  color: rgba(234, 235, 235, 0.9);
}
.m-error-view .m-error-view-subMessage {
  margin-top: 2.13333vw;
  padding: 0 4.26667vw;
  font-size: 3.46667vw;
  color: rgba(234, 235, 235, 0.5);
}
.m-error-view .m-error-view-retry {
  display: flex;
  height: 10.66667vw;
  border-radius: 5.33333vw;
  flex-direction: row;
  align-items: center;
  margin-top: 5.33333vw;
  padding: 2.93333vw 5.86667vw;
  border: 1px solid rgba(234, 235, 235, 0.4);
  font-size: 4.26667vw;
  font-weight: 500;
  color: #eaebeb;
}

/*!**************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./src/view.less ***!
  \**************************************************************************************************************************************************************************************************************************************/
.nebular-playlist-component {
  background-color: black;
  padding-top: 8vw;
  position: relative;
}
.nebular-playlist-component .tip {
  padding: 0 4vw 0 3.2vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.nebular-playlist-component .tip .periodTip {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 2.93333vw;
  font-weight: 700;
}
.nebular-playlist-component .tip .historyLinkText {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 2.93333vw;
  font-weight: 700;
  color: #fff;
}
.nebular-playlist-component .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 4vw 0 3.2vw;
  margin-top: 2.13333vw;
}
.nebular-playlist-component .title .titleText {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 5.86667vw;
  font-weight: 700;
}
.nebular-playlist-component .title .right {
  display: flex;
  align-items: center;
  width: 23.2vw;
  height: 6.93333vw;
  border-radius: 3.46667vw;
  background-color: #F8D290;
}
.nebular-playlist-component .title .right .play {
  width: 3.73333vw;
  height: 3.73333vw;
  margin-left: 2.66667vw;
  display: block;
}
.nebular-playlist-component .title .right .play-text {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 3.2vw;
  font-weight: 700;
  margin-left: 1.33333vw;
  color: #000;
}
.nebular-playlist-component .rank-list {
  padding: 0 4vw 0 3.2vw;
  margin-top: 5.33333vw;
  position: relative;
  z-index: 2;
  min-height: 53.33333vw;
  padding-bottom: 8vw;
}
.nebular-playlist-component .rank-list .rank-item {
  display: flex;
  padding: 2.66667vw 4vw 0 2.66667vw;
  width: 93.86667vw;
  height: 24vw;
  box-sizing: border-box;
  border-radius: 2.66667vw;
  overflow: hidden;
  position: relative;
  margin-top: 5.33333vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.nebular-playlist-component .rank-list .rank-item .rank-num {
  font-family: D-DIN Exp, Arial, Helvetica, sans-serif;
  font-size: 10.4vw;
  line-height: 11.73333vw;
  color: #fff;
  flex-shrink: 0;
  font-weight: 600;
}
.nebular-playlist-component .rank-list .rank-item .rank-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
  margin-left: 4vw;
  margin-right: 5.33333vw;
  flex-shrink: 1;
  overflow: hidden;
}
.nebular-playlist-component .rank-list .rank-item .rank-info .rank-name {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 4.53333vw;
  font-weight: 700;
  color: #fff;
  overflow: hidden;
}
.nebular-playlist-component .rank-list .rank-item .rank-info .rank-artist {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 2.66667vw;
  color: #9F9D9B;
}
.nebular-playlist-component .rank-list .rank-item .rank-info .rank-sound {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  margin-top: 1.33333vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-info .rank-sound .rank-sound-tip {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 1.86667vw;
  line-height: 1.6;
  background-color: #fff;
  color: #3A2719;
  border-radius: 1.06667vw;
  padding: 0 1.33333vw;
  white-space: nowrap;
}
.nebular-playlist-component .rank-list .rank-item .rank-info .rank-sound .rank-sound-value {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 2.66667vw;
  line-height: 1.2;
  color: #fff;
  margin-left: 1.06667vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-num-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
  margin-right: 5.33333vw;
  flex-shrink: 1;
  overflow: hidden;
}
.nebular-playlist-component .rank-list .rank-item .rank-num-box .rank-num2 {
  font-family: D-DIN Exp, Arial, Helvetica, sans-serif;
  font-size: 8vw;
  line-height: 8.8vw;
  color: #fff;
}
.nebular-playlist-component .rank-list .rank-item .rank-num-box .rank-name2 {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 4.53333vw;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}
.nebular-playlist-component .rank-list .rank-item .rank-num-box .rank-artist2 {
  font-family: FZLanTingHeiS-DB1-GB, Arial, Helvetica, sans-serif;
  font-size: 2.66667vw;
  color: #9F9D9B;
}
.nebular-playlist-component .rank-list .rank-item .rank-right {
  display: flex;
  flex-direction: column;
  margin-left: auto;
  flex-shrink: 0;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action {
  display: flex;
  align-items: center;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .likeBtn {
  position: relative;
  width: 4.86933vw;
  height: 4.75467vw;
  margin-right: 6.33067vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .likeBtn .count {
  line-height: 1.17;
  letter-spacing: -0.04em;
  font-variation-settings: "opsz" auto;
  position: absolute;
  top: 0px;
  left: 3.73333vw;
  font-size: 1.6vw;
  white-space: nowrap;
  font-family: "HarmonyOS Sans SC Black", Arial, Helvetica, sans-serif;
  color: #F8D290;
  font-weight: 700;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .commentBtn {
  width: 4.90667vw;
  height: 4.90667vw;
  position: relative;
  margin-right: 6.02667vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .commentBtn .count {
  line-height: 1.17;
  letter-spacing: -0.04em;
  font-variation-settings: "opsz" auto;
  position: absolute;
  top: 1px;
  left: 3.73333vw;
  font-size: 1.6vw;
  white-space: nowrap;
  font-family: "HarmonyOS Sans SC Black", Arial, Helvetica, sans-serif;
  color: #F8D290;
  font-weight: 700;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .playBtn {
  width: 6.13333vw;
  height: 6.13333vw;
  margin-right: 3.36vw;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .shareBtn {
  width: 4.53333vw;
  height: 4.53333vw;
  display: flex;
  justify-content: center;
  align-items: center;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .action .shareBtn .shareIcon {
  width: 4.53333vw;
  height: 4.53333vw;
  display: block;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .more {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-size: 3.2vw;
  line-height: 6.4vw;
  color: #000;
  width: 26.66667vw;
  height: 6.4vw;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #F8D290;
  border-radius: 12.53333vw;
  margin-left: auto;
  margin-top: 3.73333vw;
  font-weight: 700;
}
.nebular-playlist-component .rank-list .rank-item .rank-right .rcmd {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-size: 3.2vw;
  line-height: 6.4vw;
  color: #000;
  width: 16.53333vw;
  height: 6.4vw;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #F8D290;
  border-radius: 12.53333vw;
  margin-left: auto;
  margin-top: 3.73333vw;
  font-weight: 700;
}
.nebular-playlist-component .shareContainer {
  width: 76.7808vw;
  height: 107.1732vw;
  position: absolute;
  top: 0;
  z-index: -1;
  overflow: hidden;
  background-color: #000;
}
.nebular-playlist-component .shareContainer .shareBottomCover {
  width: 100%;
  position: absolute;
  z-index: 1;
}
.nebular-playlist-component .shareContainer .shareContent {
  position: relative;
  z-index: 3;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 4.2656vw;
  margin-top: 5.5986vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankLeft {
  display: flex;
  align-items: center;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftIcon {
  width: 3.7324vw;
  height: 3.7324vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.9326vw;
  color: #fff;
  margin-left: 1.0664vw;
  margin-right: 1.0664vw;
  letter-spacing: 0.5px;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.4);
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankLeft .shareRankLeftRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 3.7324vw;
  line-height: 4.2656vw;
  color: #fff;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.1);
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankRight {
  display: flex;
  align-items: center;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightIcon {
  width: 3.7324vw;
  height: 3.7324vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.9326vw;
  color: #fff;
  margin-left: 1.0664vw;
  margin-right: 1.0664vw;
  letter-spacing: 0.5px;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.4);
}
.nebular-playlist-component .shareContainer .shareContent .shareRank .shareRankRight .shareRankRightRankText {
  font-family: D-DIN, Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-size: 3.7324vw;
  line-height: 4.2656vw;
  color: #fff;
  text-shadow: 0 0 3.46667vw rgba(0, 0, 0, 0.1);
}
.nebular-playlist-component .shareContainer .shareContent .shareCoverBox {
  width: 50.3874vw;
  height: 41.8562vw;
  margin: 0 auto;
  position: relative;
  margin-top: 7.998vw;
  left: 6.3984vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareCoverBox .cd {
  width: 100%;
  height: 100%;
}
.nebular-playlist-component .shareContainer .shareContent .shareCoverBox .shareCover {
  width: 41.8562vw;
  height: 41.8562vw;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
}
.nebular-playlist-component .shareContainer .shareContent .shareCoverBox.shareCoverBox-rank {
  margin-top: 15.2vw;
  margin-bottom: 1.86667vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareSongName {
  width: 100%;
  text-align: center;
  padding: 0 4.2656vw;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 4.7988vw;
  line-height: 5.5986vw;
  color: #fff;
  margin-top: 5.8652vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nebular-playlist-component .shareContainer .shareContent .shareSongArtist {
  width: 100%;
  text-align: center;
  padding: 0 4.2656vw;
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  line-height: 3.7324vw;
  color: #999;
  margin-top: 1.8662vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nebular-playlist-component .shareContainer .shareContent .shareSongTip {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 3.1992vw;
  line-height: 3.7324vw;
  color: #cbbb8d;
  margin-top: 4.7988vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 4.2656vw;
  margin-top: 6.3984vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomLeft {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareLogo {
  width: 26.9266vw;
  height: 2.3994vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareUser {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.1328vw;
  line-height: 2.3994vw;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 1.5996vw;
  margin-bottom: 1.333vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomLeft .shareTime {
  font-family: FZLanTingHeiS-DB-GB, Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 2.1328vw;
  line-height: 2.3994vw;
  color: #999;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomLeft .searchBar {
  width: 53.32vw;
  height: 6.1318vw;
  margin-top: 7.4648vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomRight {
  width: 10.3974vw;
  height: 10.3974vw;
  position: relative;
  margin-top: -0.2666vw;
}
.nebular-playlist-component .shareContainer .shareContent .shareContentBottom .shareBottomRight canvas {
  border: 0.5332vw solid #fff;
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  box-sizing: border-box;
  image-rendering: pixelated;
}
.nebular-playlist-component .shareContainer .bottomSubtract {
  width: 100%;
  position: absolute;
  display: flex;
  flex-direction: column;
  z-index: 2;
  bottom: 0;
}
.nebular-playlist-component .shareContainer .bottomSubtract img {
  width: 100%;
  aspect-ratio: 864/642;
}
.nebular-playlist-component .shareContainer .bottomSubtract .black {
  width: 100%;
  flex-grow: 1;
  background: #131313;
}
.nebular-playlist-component .shareContainer:not(.shareContainer-searchbar) .searchBar {
  display: none;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar {
  height: 117.8372vw;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar .shareLogo,
.nebular-playlist-component .shareContainer.shareContainer-searchbar .shareBottomRight {
  display: none;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar .shareSongName {
  margin-top: 3.1992vw;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar .shareContentBottom {
  margin-top: 4.2656vw;
  justify-content: center;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar .shareBottomLeft {
  align-items: center;
}
.nebular-playlist-component .shareContainer.shareContainer-searchbar .bottomSubtract {
  height: 70.3824vw;
}