div.drop-down .datepicker {
  top: 46px;
  transform: translateY(-362px); }

div.drop-down .drop-down-mask {
  opacity: 0; }

div.drop-down.on .drop-down-mask {
  opacity: 1; }

div.drop-down.on .datepicker {
  transform: translateY(0); }

div.drop-down .datepicker {
  box-sizing: border-box;
  z-index: 1; }
  div.drop-down .datepicker .datepicker-content {
    margin-top: 0;
    padding-top: 24px;
    transition: all .3s ease-out; }
  div.drop-down .datepicker .datepicker-navbar {
    display: flex;
    top: unset;
    bottom: 24px;
    border-bottom: none;
    flex-direction: row-reverse;
    height: 40px; }
    div.drop-down .datepicker .datepicker-navbar .datepicker-navbar-btn {
      position: relative;
      display: inline-block;
      flex: 1;
      height: 40px;
      background-color: #EE4D2D;
      color: #fff;
      line-height: 38px;
      margin: 0 12px;
      border-radius: 2px;
      padding: 0;
      box-sizing: border-box;
      border: 1px solid #EE4D2D; }
      div.drop-down .datepicker .datepicker-navbar .datepicker-navbar-btn:active::after {
        content: ' ';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.05); }
    div.drop-down .datepicker .datepicker-navbar .datepicker-navbar-btn:last-child {
      background-color: #fff;
      color: #EE4D2D; }
      div.drop-down .datepicker .datepicker-navbar .datepicker-navbar-btn:last-child:active::after {
        background-color: rgba(238, 77, 45, 0.05); }

.avator {
  flex-shrink: 0; }

.NewBoard {
  background-color: rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  border: 0.5px solid rgba(255, 255, 255, 0.04);
  margin: 0 12px 12px;
  padding: 15.5px 0; }
  .NewBoard-header {
    display: flex;
    align-items: center;
    padding: 0 16px 4px; }
    .NewBoard-header-icon {
      color: #fff;
      width: 16px;
      height: 16px;
      margin-right: 6px; }
    .NewBoard-header-title {
      flex: 1;
      color: #fff;
      font-weight: 500;
      font-size: 14px; }
    .NewBoard-header-button {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 16px;
      display: flex;
      align-items: center; }
  .NewBoard-red-point {
    height: 8px;
    width: 8px;
    background-color: #ee4d2d;
    border-radius: 8px;
    margin-left: 4px; }
  .NewBoard-arrow {
    width: 6px;
    height: 16px;
    margin-left: 4px;
    vertical-align: bottom; }
  .NewBoard-time {
    font-size: 10px;
    line-height: 14px;
    color: rgba(255, 255, 255, 0.65);
    height: 14px;
    padding: 0 16px; }
  .NewBoard-content {
    padding: 0 8px; }
    .NewBoard-content-row {
      display: flex;
      gap: 1px;
      justify-content: center; }
    .NewBoard-content-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      flex: 1;
      padding: 0 10px;
      text-align: center; }
    .NewBoard-content-value {
      font-weight: 700;
      font-size: 18px;
      line-height: 20px;
      color: #fff;
      text-align: center;
      flex: 1 0 calc((100% - 2px) / 3);
      overflow: hidden;
      padding: 0 8px 8px;
      box-sizing: border-box; }
    .NewBoard-content-label {
      font-size: 10px;
      line-height: 14px;
      color: rgba(255, 255, 255, 0.65);
      text-align: center;
      flex: 1 0 calc((100% - 2px) / 3);
      padding-top: 8px;
      padding-bottom: 4px; }

.NewBoard-tip-text {
  font-weight: 500;
  font-size: 10px;
  line-height: 12px;
  color: #fff;
  white-space: nowrap; }

.NewBoard-tooltip-container {
  margin-top: 24px;
  padding: 4px 8px;
  width: auto !important; }

.recap-board {
  position: relative;
  margin: 0 12px 12px;
  padding: 15.5px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  border: 0.5px solid rgba(255, 255, 255, 0.04);
  box-sizing: border-box; }
  .recap-board > * {
    box-sizing: border-box; }
  .recap-board.is-alert .title-text {
    color: #F69113; }
  .recap-board.is-alert .recap-text {
    color: #F69113; }
  .recap-board .icon-chart {
    width: 16px;
    height: 16px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIkSURBVHgBfVM7bBNBEH2z9xNC/iBARIQYIxpAsuzURCiWaKicCgk6OgKN3dAaKkrHpKOmoQtCggolDRUFh6CP6ZAQiiMinNi+HWZ372wnUbLy+mbn5r2ZNztHOLIGneIyBarBmldIcRnQIEIMJLEeJi/OtPZ7s/GUGTudYjHygjaBmyAtHhYgS4RsIVHEzGDh0mvhk0HrGMG/7sWvElCTCAHOENgKBGvAyp7FoG9+FNbpUb/vW/CrSx2wrgqYKX+FyNJmBK4KQmrv9eStro4PBm1xtGinM1eOFG9LdgS37nNwd51wyko+PwP/WLcVgZO6CgltzvTM3z4RzH++OyMquLMFUENUUY0s3eE1+vQUw7d3wAe7GH95idHHB1Myo07yK0LDl1PNsQGpeANmypWIcgsYvakwhQUKVj4crkhINFHZdyBOne6pLi+Rd9NlTPIlUvNLEMIpmibXR+YWerLLs+wZ2No3HuJ4Q5xm+cU+Q2+I0TSM4/g1VH5hmoiy0BRlVtZM2NuN6W9nblmmbHMyNAr26V2/B4QFa2O4C95+LwgzRKZV2hL7TNdUrvVrS1KspdrYtseY5yugfEn2VagLlVR0NmIws9ml1f2edZjvIKRgU7LXstGVTS5Uy3WZMTNn7fIojsPHg0XbcPN3rtXvn23+XtSsuxN5nKl24rL2S/3dIIrqU8+RJZ9zGb73nJBU5W3NVCCqfsLjdx6wEazubc3G/wcW2dsfvAekVQAAAABJRU5ErkJggg==) no-repeat;
    background-size: contain;
    flex-shrink: 0;
    margin-right: 4px; }
  .recap-board-title {
    position: relative;
    color: rgba(255, 255, 255, 0.87);
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
    font-weight: 500;
    text-transform: capitalize; }
  .recap-board-content {
    width: 100%;
    margin-top: 12px; }
    .recap-board-content .recap-board-content-link {
      display: flex;
      flex-direction: row;
      height: 30px;
      background-color: rgba(11, 3, 1, 0.15);
      font-size: 12px;
      align-items: center;
      color: rgba(255, 255, 255, 0.65);
      padding-left: 12px;
      padding-right: 12px;
      border-radius: 4px; }
      .recap-board-content .recap-board-content-link-tip {
        flex: 1; }
    .recap-board-content .recap-board-content-tips {
      display: flex;
      flex-direction: column; }
    .recap-board-content .recap-board-content-tips-item {
      display: flex;
      flex-direction: row;
      font-size: 14px;
      line-height: 16px;
      color: rgba(255, 255, 255, 0.87);
      margin-top: 12px;
      justify-content: space-between;
      font-weight: 400; }
      .recap-board-content .recap-board-content-tips-item-status {
        color: #26aa99;
        font-weight: 500; }
      .recap-board-content .recap-board-content-tips-item .Increasing {
        color: #26aa99; }
      .recap-board-content .recap-board-content-tips-item .Falling {
        color: #f83949; }
      .recap-board-content .recap-board-content-tips-item .Stable {
        color: #eda500; }
    .recap-board-content-title {
      font-weight: 700;
      font-size: 14px;
      line-height: 16px;
      color: rgba(255, 255, 255, 0.87);
      margin-bottom: 8px; }
    .recap-board-content-tips {
      font-size: 14px;
      line-height: 20px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.65); }
    .recap-board-content-desc {
      font-size: 14px;
      line-height: 20px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.65); }
    .recap-board-content .recap-sub-title {
      color: rgba(255, 255, 255, 0.87);
      font-size: 13px;
      font-style: normal;
      font-weight: 590;
      line-height: 18px;
      /* 138.462% */
      margin-bottom: 4px; }
    .recap-board-content .recap-text {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 15px;
      flex: 1;
      word-break: break-all; }
    .recap-board-content .recap-btn {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 6px 10px;
      margin-left: 8px;
      background: #EE4D2D;
      border-radius: 2px;
      font-size: 12px;
      color: #FFFFFF;
      white-space: nowrap; }

.k-suggestion-board {
  position: relative;
  margin: 0 12px 12px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  border: 0.5px solid rgba(255, 255, 255, 0.04);
  box-sizing: border-box;
  padding: 15.5px; }
  .k-suggestion-board > * {
    box-sizing: border-box; }
  .k-suggestion-board.is-alert .title-text {
    color: #F69113; }
  .k-suggestion-board.is-alert .suggestion-text {
    color: #F69113; }
  .k-suggestion-board-title {
    position: relative;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
    font-weight: 500;
    text-transform: capitalize; }
  .k-suggestion-board-icon {
    width: 16px;
    height: 16px;
    margin-right: 6px; }
  .k-suggestion-board-content {
    width: 100%;
    padding-top: 12px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between; }
    .k-suggestion-board-content .suggestion-sub-title {
      color: rgba(255, 255, 255, 0.87);
      font-size: 13px;
      font-style: normal;
      font-weight: 590;
      line-height: 18px;
      /* 138.462% */
      margin-bottom: 4px; }
    .k-suggestion-board-content .suggestion-text {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 14px;
      flex: 1;
      word-break: break-word; }
    .k-suggestion-board-content .suggestion-btn {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 0px 10px;
      margin-left: 8px;
      background: #EE4D2D;
      border-radius: 2px;
      font-size: 12px;
      height: 24px;
      line-height: 24px;
      color: #FFFFFF;
      white-space: nowrap; }

html[lang='my'] .k-suggestion-board .suggestion-text {
  line-height: 18px; }

.m-LiveEnd--KOL {
  display: flex;
  flex-direction: column;
  height: 100%; }
  .m-LiveEnd--KOL .KOL-header {
    margin-top: env(safe-area-inset-top);
    margin-top: constant(safe-area-inset-top);
    height: 48px; }
  .m-LiveEnd--KOL .KOL-close {
    position: absolute;
    right: 16px;
    top: calc(env(safe-area-inset-top) + 16px);
    top: calc(constant(safe-area-inset-top) + 16px);
    width: 24px;
    height: 24px;
    background-size: 24px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGmSURBVHgB7dvNbcJAEIbhcQpIBVSQWlIBFVABJVEBFVABJ445UUEaIPuJjYQS0Bjvz6zE+0irRLns7Bcb2+PFDAAAAAAAvJjL5bJKY5/Ghw1CteSaVhYph3NI4yuN4wgh5XCOuaZDaUiTLZQn3qVxW8B3Gutpmk4WIP+DVNP7zZ/PuaazLVAS0D79uHfEhIT0IJxfp1TPpy3wZstt7RrGXypw1/N0c8JRjVtbaPERJDMKa34kta6hKCCJDKnH3MUBSURIveasEpD0DKnnXNUCkh6F9z5aqwYkLRcQcSpXD0haLCTqYtAkIKm5oMgrZbOApMbCou+1mgYkJQsc4Ua0eUCyZKEjhCNdApJnFjxKONItIJmz8Pz7EOFI14BkRkhmg4Qj3QMSJ6R7whpxIQHJEyGFdinDApIZIYWGIyUdxZfAKebgQ9rBZd7BjaKDRw0HD6sO2h0OGmYOWq4OmvYOXvs4eHHo4NWzg80LDra/ONhA5SjZozjM81LLWtjE6ShpuW7susX2Vlxj6zrn2v5vLFWNG4vwChvJaxTEVxEAAAAAAMBAfgBGhgoSKXvXQwAAAABJRU5ErkJggg==); }
  .m-LiveEnd--KOL .KOL-title {
    font-size: 20px;
    color: #fff;
    text-align: center;
    margin-bottom: 4px;
    margin-top: 0;
    font-weight: 500; }
  .m-LiveEnd--KOL .KOL-duration {
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: rgba(255, 255, 255, 0.65);
    margin-bottom: 24px; }
  .m-LiveEnd--KOL .KOL-scroll {
    overflow-y: scroll;
    width: 100%;
    padding-bottom: env(safe-area-inset-bottom);
    padding-bottom: constant(safe-area-inset-bottom); }

.m-incentive-task {
  padding: 15.5px;
  margin: 0 12px 12px;
  background-color: rgba(255, 255, 255, 0.06);
  border: 0.5px solid rgba(255, 255, 255, 0.04);
  border-radius: 10px; }
  .m-incentive-task .it-title {
    font-size: 14px;
    line-height: 16px;
    display: flex;
    align-items: center;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.87); }
  .m-incentive-task .it-icon-task {
    width: 16px;
    height: 16px;
    margin-right: 6px; }
  .m-incentive-task .it-title {
    flex: 1; }
  .m-incentive-task .it-see-more {
    color: rgba(255, 255, 255, 0.65);
    font-size: 12px;
    line-height: 16px;
    display: flex;
    align-items: center; }
  .m-incentive-task .it-red-point {
    height: 8px;
    width: 8px;
    background-color: #ee4d2d;
    border-radius: 8px;
    margin-left: 4px; }
  .m-incentive-task .it-arrow-right {
    width: 10px;
    height: 10px;
    margin-left: 4px;
    vertical-align: bottom; }
  .m-incentive-task .it-line {
    display: flex;
    justify-content: space-between;
    padding-top: 12px; }
    .m-incentive-task .it-line-text {
      font-size: 14px;
      line-height: 18px;
      color: rgba(255, 255, 255, 0.87);
      white-space: nowrap;
      margin-right: 24px; }
    .m-incentive-task .it-line-number {
      font-weight: 500;
      font-size: 16px;
      line-height: 18px;
      color: rgba(255, 255, 255, 0.87); }
    .m-incentive-task .it-line-reward {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      row-gap: 8px; }
  .m-incentive-task .it-claim-row {
    position: relative; }
    .m-incentive-task .it-claim-row-arrow {
      position: absolute;
      top: -6px;
      right: 12px;
      width: 12px;
      height: 6px;
      overflow: hidden; }
    .m-incentive-task .it-claim-row-arrow::after {
      content: '';
      display: block;
      width: 0;
      height: 0;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-bottom: 6px solid rgba(11, 3, 1, 0.15);
      margin: 0 auto; }
    .m-incentive-task .it-claim-row-content {
      background-color: rgba(11, 3, 1, 0.15);
      border-radius: 4px;
      margin-top: 10px;
      padding: 8px 12px;
      display: flex;
      align-items: center;
      justify-content: space-between; }
    .m-incentive-task .it-claim-row-text {
      font-weight: 400;
      font-size: 12px;
      line-height: 14px;
      color: rgba(255, 255, 255, 0.65); }
    .m-incentive-task .it-claim-row-value {
      font-weight: 500;
      font-size: 12px;
      line-height: 14px;
      color: #ee4d2d; }
    .m-incentive-task .it-claim-row-button {
      flex-shrink: 0;
      margin-left: 8px;
      font-weight: 500;
      font-size: 10px;
      line-height: 12px;
      color: #fff;
      padding: 3px 8px;
      background-color: #ee4d2d;
      border-radius: 3px; }

.it-reward-tag {
  padding: 0 4px;
  line-height: 16px;
  font-weight: 700;
  font-size: 10px;
  color: #cd6b11;
  background-color: #ffea85;
  display: flex;
  align-items: center;
  border-radius: 100px;
  margin-left: 8px; }
  .it-reward-tag span {
    margin-left: 2px; }

.it-reward-tag-dashed {
  border: 0.8px dashed rgba(237, 165, 0, 0.5);
  color: #eda500;
  background-color: transparent;
  box-sizing: border-box;
  height: 16px;
  line-height: 14px;
  padding: 0 3px; }

.it-toast {
  width: max-content;
  border-radius: 4px; }

.it-toast-claim {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 8px; }

.it-toast-claim-text {
  color: #ffea85;
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  margin-left: 4px; }

.m-replay-setting {
  margin: 0 12px 12px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  border: 0.5px solid rgba(255, 255, 255, 0.04);
  padding: 15.5px;
  display: flex;
  align-items: center; }
  .m-replay-setting-icon {
    width: 16px;
    height: 16px;
    margin-right: 6px; }
  .m-replay-setting-title {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #FFF;
    flex: 1; }
  .m-replay-setting-checked {
    color: rgba(255, 255, 255, 0.65);
    font-size: 12px;
    line-height: 16px; }
  .m-replay-setting-arrow {
    width: 10px;
    height: 10px;
    vertical-align: bottom; }
  .m-replay-setting-drawer {
    border-radius: 12px 12px 0 0;
    background-color: whitesmoke; }
    .m-replay-setting-drawer-mask {
      background-color: transparent; }
    .m-replay-setting-drawer-header {
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      font-size: 14px; }
    .m-replay-setting-drawer-close {
      position: absolute;
      right: 16px;
      top: 14px;
      width: 20px;
      height: 20px;
      background-size: 20px 20px;
      background-repeat: no-repeat;
      background-position: center;
      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAG7SURBVHgB7drNTQMxEIbhAcqgAxqABkIDFJITTeRGIdy4UQEVcMuJQvAn1hcr8e98Y6+YVxqtFGmjPLKS7For4nme53m77FHW7SDKncKcw7zIeh3l77OdRKmIjbMSOmLjDKMPyRuuhE6xcbJfvTvJd96OT8nrz2F+wnzLnI7bpL2G+cydWAKjr+24CjqHfS+cWwVGq6CHsKgWjGajh7GoBYxmoVWwqBWMrNFqWNQDRlZoVSzqBSM2Wh2LRsCIhaZg0SgYaaNpWKQBRlpoKhZpgdEomo5FmmDUizbBIm0wakWbYREDjGrRpljEAqMSGkdTLLoRftdW8VJULGKucOzaSqfRscgCjEpoEyy6lX+W1QqXvsdmOycW4NofLRM0G5z7nwXMfLuICS5dVEzZLmKBa6+gzNEMcOvloilaG9x7bWyG1gSP3giYoLXAWnc9dLQGWPsWj4oeBbPuZ2noETD75p2C7gVb7VSoo3vA1tsyquhWsPke1JYaugU8CxtTQdeCZ2Njw+ga8CrYGPV/eo+PLT3kTqp5bOk+eZNZK5t2aaXfwnyIQnt49LB277u6lR8uXfmzeZ7ned61fgHzgdKKO1YhawAAAABJRU5ErkJggg==); }
    .m-replay-setting-drawer-toggle {
      background-color: white;
      padding: 8px 12px;
      margin: 8px 12px;
      border-radius: 10px; }
      .m-replay-setting-drawer-toggle-text {
        font-weight: 500;
        font-size: 14px; }
    .m-replay-setting-drawer-desc {
      margin: 6px 24px 24px;
      font-size: 12px;
      line-height: 16px;
      color: rgba(0, 0, 0, 0.54); }

.m-NewBoard {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  margin: 0 20px 10px 20px; }
  .m-NewBoard-header {
    display: flex;
    padding: 13px;
    align-items: center; }
    .m-NewBoard-header-icon {
      color: #fff;
      width: 16px;
      height: 16px;
      margin-right: 6px; }
    .m-NewBoard-header-title {
      flex: 1;
      color: #fff;
      font-weight: 500;
      font-size: 14px; }
    .m-NewBoard-header-button {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 16px;
      display: flex;
      align-items: center; }
  .m-NewBoard-red-point {
    height: 8px;
    width: 8px;
    background-color: #ee4d2d;
    border-radius: 8px;
    margin-left: 4px; }
  .m-NewBoard-arrow {
    width: 6px;
    height: 16px;
    margin-left: 4px;
    vertical-align: bottom; }
  .m-NewBoard-bottom-line {
    height: 0.5px;
    background-color: #d8d8d8;
    opacity: 0.1; }
  .m-NewBoard-left-line {
    width: 1px;
    background-color: #d8d8d8;
    opacity: 0.1;
    height: 44px; }
  .m-NewBoard-content {
    display: flex;
    padding: 20.5px 0 18px 0; }
    .m-NewBoard-content-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      flex: 1;
      padding: 0 10px;
      text-align: center; }
    .m-NewBoard-content-value {
      font-weight: 500;
      font-size: 18px;
      line-height: 18px;
      color: #fff;
      margin-bottom: 12px; }
    .m-NewBoard-content-label {
      font-weight: normal;
      font-size: 12px;
      line-height: 14px;
      color: #888; }

.m-NewBoard-tip-text {
  font-weight: 500;
  font-size: 10px;
  line-height: 12px;
  color: #fff;
  white-space: nowrap; }

.m-NewBoard-tooltip-container {
  margin-top: -8px;
  padding: 4px 8px;
  width: auto !important; }

.m-recap-board {
  position: relative;
  margin: 0 20px 12px;
  min-height: 101px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  box-sizing: border-box; }
  .m-recap-board > * {
    box-sizing: border-box; }
  .m-recap-board.is-alert .title-text {
    color: #F69113; }
  .m-recap-board.is-alert .recap-text {
    color: #F69113; }
  .m-recap-board .icon-chart {
    width: 20px;
    height: 20px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAIkSURBVHgBfVM7bBNBEH2z9xNC/iBARIQYIxpAsuzURCiWaKicCgk6OgKN3dAaKkrHpKOmoQtCggolDRUFh6CP6ZAQiiMinNi+HWZ372wnUbLy+mbn5r2ZNztHOLIGneIyBarBmldIcRnQIEIMJLEeJi/OtPZ7s/GUGTudYjHygjaBmyAtHhYgS4RsIVHEzGDh0mvhk0HrGMG/7sWvElCTCAHOENgKBGvAyp7FoG9+FNbpUb/vW/CrSx2wrgqYKX+FyNJmBK4KQmrv9eStro4PBm1xtGinM1eOFG9LdgS37nNwd51wyko+PwP/WLcVgZO6CgltzvTM3z4RzH++OyMquLMFUENUUY0s3eE1+vQUw7d3wAe7GH95idHHB1Myo07yK0LDl1PNsQGpeANmypWIcgsYvakwhQUKVj4crkhINFHZdyBOne6pLi+Rd9NlTPIlUvNLEMIpmibXR+YWerLLs+wZ2No3HuJ4Q5xm+cU+Q2+I0TSM4/g1VH5hmoiy0BRlVtZM2NuN6W9nblmmbHMyNAr26V2/B4QFa2O4C95+LwgzRKZV2hL7TNdUrvVrS1KspdrYtseY5yugfEn2VagLlVR0NmIws9ml1f2edZjvIKRgU7LXstGVTS5Uy3WZMTNn7fIojsPHg0XbcPN3rtXvn23+XtSsuxN5nKl24rL2S/3dIIrqU8+RJZ9zGb73nJBU5W3NVCCqfsLjdx6wEazubc3G/wcW2dsfvAekVQAAAABJRU5ErkJggg==) no-repeat;
    background-size: contain;
    flex-shrink: 0;
    margin-right: 4px; }
  .m-recap-board-title {
    position: relative;
    color: #fff;
    font-size: 14px;
    line-height: 42px;
    padding-left: 10px;
    display: flex;
    align-items: center;
    font-weight: 500;
    text-transform: capitalize; }
    .m-recap-board-title::after {
      content: ' ';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: rgba(255, 255, 255, 0.09); }
  .m-recap-board-content {
    width: 100%;
    padding: 16px 10px; }
    .m-recap-board-content .m-recap-board-content-link {
      display: flex;
      flex-direction: row;
      height: 30px;
      background-color: rgba(11, 3, 1, 0.15);
      font-size: 12px;
      align-items: center;
      color: rgba(255, 255, 255, 0.65);
      padding-left: 12px;
      padding-right: 12px;
      border-radius: 2px; }
      .m-recap-board-content .m-recap-board-content-link-tip {
        flex: 1; }
    .m-recap-board-content .m-recap-board-content-tips {
      display: flex;
      flex-direction: column; }
    .m-recap-board-content .m-recap-board-content-tips-item {
      display: flex;
      flex-direction: row;
      font-size: 14px;
      line-height: 16px;
      color: rgba(255, 255, 255, 0.87);
      margin-top: 12px;
      justify-content: space-between;
      font-weight: 400; }
      .m-recap-board-content .m-recap-board-content-tips-item-status {
        color: #26aa99;
        font-weight: 500; }
      .m-recap-board-content .m-recap-board-content-tips-item .Increasing {
        color: #26aa99; }
      .m-recap-board-content .m-recap-board-content-tips-item .Falling {
        color: #f83949; }
      .m-recap-board-content .m-recap-board-content-tips-item .Stable {
        color: #eda500; }
    .m-recap-board-content-title {
      font-weight: 700;
      font-size: 14px;
      line-height: 16px;
      color: rgba(255, 255, 255, 0.87);
      margin-bottom: 8px; }
    .m-recap-board-content-tips {
      font-size: 14px;
      line-height: 20px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.65); }
    .m-recap-board-content-desc {
      font-size: 14px;
      line-height: 20px;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.65); }
    .m-recap-board-content .recap-sub-title {
      color: rgba(255, 255, 255, 0.87);
      font-size: 13px;
      font-style: normal;
      font-weight: 590;
      line-height: 18px;
      /* 138.462% */
      margin-bottom: 4px; }
    .m-recap-board-content .recap-text {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 15px;
      flex: 1;
      word-break: break-all; }
    .m-recap-board-content .recap-btn {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 6px 10px;
      margin-left: 8px;
      background: #EE4D2D;
      border-radius: 2px;
      font-size: 12px;
      color: #FFFFFF;
      white-space: nowrap; }

.m-suggestion-board {
  position: relative;
  margin: 0 20px 12px;
  min-height: 101px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  box-sizing: border-box; }
  .m-suggestion-board > * {
    box-sizing: border-box; }
  .m-suggestion-board.is-alert .title-text {
    color: #F69113; }
  .m-suggestion-board.is-alert .suggestion-text {
    color: #F69113; }
  .m-suggestion-board .icon-insights {
    width: 20px;
    height: 20px;
    background: url(data:image/png;base64,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) no-repeat;
    background-size: contain;
    flex-shrink: 0;
    margin-right: 4px; }
  .m-suggestion-board .icon-alert {
    width: 20px;
    height: 20px;
    background: url(data:image/png;base64,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) no-repeat;
    background-size: contain;
    flex-shrink: 0;
    margin-right: 4px; }
  .m-suggestion-board-title {
    position: relative;
    color: #fff;
    font-size: 14px;
    line-height: 42px;
    padding-left: 10px;
    display: flex;
    align-items: center;
    font-weight: 500;
    text-transform: capitalize; }
    .m-suggestion-board-title::after {
      content: ' ';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: rgba(255, 255, 255, 0.09); }
  .m-suggestion-board-content {
    width: 100%;
    padding: 16px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .m-suggestion-board-content .suggestion-sub-title {
      color: rgba(255, 255, 255, 0.87);
      font-size: 13px;
      font-style: normal;
      font-weight: 590;
      line-height: 18px;
      /* 138.462% */
      margin-bottom: 4px; }
    .m-suggestion-board-content .suggestion-text {
      color: rgba(255, 255, 255, 0.65);
      font-size: 12px;
      line-height: 15px;
      flex: 1;
      word-break: break-all; }
    .m-suggestion-board-content .suggestion-btn {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 6px 10px;
      margin-left: 8px;
      background: #EE4D2D;
      border-radius: 2px;
      font-size: 12px;
      color: #FFFFFF;
      white-space: nowrap; }

html, body {
  height: 100%;
  width: 100%;
  background: transparent; }

.streaming-cover-guideline {
  position: relative;
  padding: 3.30667rem 0 1.06667rem;
  background: #fef2e6; }
  .streaming-cover-guideline * {
    box-sizing: border-box; }
  .streaming-cover-guideline.is-android {
    padding: 2.66667rem 0 1.06667rem; }
    .streaming-cover-guideline.is-android .guideline-header {
      height: 1.33333rem;
      line-height: 1.33333rem;
      padding-top: 0; }
    .streaming-cover-guideline.is-android .guideline-header .i-back {
      top: 0.37333rem; }
    .streaming-cover-guideline.is-android .guideline-bg {
      top: -0.42667rem; }
  .streaming-cover-guideline.ios-8-min {
    padding: 2.13333rem 0 1.06667rem; }
    .streaming-cover-guideline.ios-8-min .guideline-header {
      padding-top: 0.53333rem; }
    .streaming-cover-guideline.ios-8-min .guideline-header .i-back {
      top: 0.8rem; }
    .streaming-cover-guideline.ios-8-min .guideline-bg {
      top: -0.58667rem; }
  .streaming-cover-guideline .guideline-header {
    position: fixed;
    top: 0;
    left: 0;
    height: 1.17333rem;
    width: 100%;
    padding-top: 1.17333rem;
    background: white;
    color: #000000;
    text-align: center;
    line-height: 1.17333rem;
    font-size: 0.53333rem;
    z-index: 100;
    box-sizing: content-box; }
    .streaming-cover-guideline .guideline-header .i-back {
      position: absolute;
      left: 0.32rem;
      top: 1.44rem;
      width: 0.64rem;
      height: 0.64rem;
      background-size: 100% 100%; }
  .streaming-cover-guideline .guideline-bg {
    position: absolute;
    top: 0.58667rem;
    left: 50%;
    transform: translateX(-50%);
    width: 10rem;
    height: 4.26667rem;
    background-size: 100% 100%; }
  .streaming-cover-guideline .guideline-title {
    position: relative;
    font-style: normal;
    font-weight: 900;
    font-size: 0.74667rem;
    line-height: 0.88rem;
    text-align: center;
    color: #EE4D2D; }
  .streaming-cover-guideline .guideline-section-rule {
    width: 8.72rem;
    height: 4.96rem;
    margin: 0.53333rem auto;
    background: #FFFFFF;
    border-radius: 0.21333rem;
    overflow: hidden; }
    .streaming-cover-guideline .guideline-section-rule .session-title {
      padding: 0.4rem 0;
      color: #212120;
      font-size: 0.42667rem;
      font-weight: 600;
      text-align: center; }
    .streaming-cover-guideline .guideline-section-rule .guideline-rule {
      width: 8.72rem;
      height: 3.62667rem;
      background: linear-gradient(180deg, #FFFAF2 0%, rgba(255, 255, 255, 0) 100.75%);
      color: rgba(0, 0, 0, 0.87);
      font-size: 0.32rem;
      line-height: 0.42667rem;
      border-radius: 0.21333rem;
      padding: 0.32rem; }
      .streaming-cover-guideline .guideline-section-rule .guideline-rule li {
        position: relative;
        margin-left: 0.53333rem;
        list-style: none; }
        .streaming-cover-guideline .guideline-section-rule .guideline-rule li::before {
          content: ' ';
          position: absolute;
          top: 0.16rem;
          left: -0.24rem;
          width: 0.08rem;
          height: 0.08rem;
          border-radius: 50%;
          background-color: #000000; }
  .streaming-cover-guideline .guideline-section-example {
    position: relative;
    width: 8.72rem;
    margin: 0.53333rem auto;
    background: #FF8147;
    border-radius: 0.21333rem; }
    .streaming-cover-guideline .guideline-section-example.bad-example {
      background: rgba(165, 192, 230, 0.8); }
      .streaming-cover-guideline .guideline-section-example.bad-example .section-content::before {
        background: linear-gradient(180deg, #F2F7FF 0.9%, rgba(255, 255, 255, 0) 98.47%); }
    .streaming-cover-guideline .guideline-section-example .i-good, .streaming-cover-guideline .guideline-section-example .i-bad {
      position: absolute;
      top: 0.21333rem;
      left: 0.21333rem;
      width: 0.42667rem;
      height: 0.42667rem;
      background-size: 100%;
      z-index: 2; }
    .streaming-cover-guideline .guideline-section-example .i-star {
      position: absolute;
      top: 0.96rem;
      right: 0.21333rem;
      width: 0.64rem;
      height: 0.64rem;
      background-size: 100%;
      z-index: 2; }
    .streaming-cover-guideline .guideline-section-example .section-title {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 1.92rem;
      line-height: 0.53333rem;
      padding: 0.4rem 1.33333rem;
      text-align: center;
      color: #FFF;
      font-size: 0.42667rem;
      font-weight: 600; }
    .streaming-cover-guideline .guideline-section-example .section-content {
      position: relative;
      width: 100%;
      background: #fff;
      border-radius: 0.21333rem;
      overflow: hidden; }
      .streaming-cover-guideline .guideline-section-example .section-content::before {
        content: ' ';
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background: linear-gradient(180deg, #FFFAF2 0.9%, rgba(255, 255, 255, 0) 98.47%); }
    .streaming-cover-guideline .guideline-section-example .section-rule {
      width: 8.72rem;
      color: rgba(0, 0, 0, 0.87);
      font-size: 0.32rem;
      line-height: 0.42667rem;
      border-radius: 0.16rem;
      padding: 0.32rem 0 0.32rem 0.32rem; }
      .streaming-cover-guideline .guideline-section-example .section-rule li {
        position: relative;
        margin-left: 0.53333rem;
        list-style: none; }
        .streaming-cover-guideline .guideline-section-example .section-rule li::before {
          content: ' ';
          position: absolute;
          top: 0.16rem;
          left: -0.24rem;
          width: 0.08rem;
          height: 0.08rem;
          border-radius: 50%;
          background-color: #000000; }
    .streaming-cover-guideline .guideline-section-example .example-title {
      position: relative;
      color: rgba(0, 0, 0, 0.87);
      font-weight: 400;
      font-size: 0.32rem;
      margin: 0.26667rem; }
    .streaming-cover-guideline .guideline-section-example .image-example-list {
      position: relative;
      margin: 0.32rem 0;
      display: flex;
      justify-content: center;
      align-items: center; }
      .streaming-cover-guideline .guideline-section-example .image-example-list .example-item {
        position: relative;
        margin: 0 0.10667rem; }
        .streaming-cover-guideline .guideline-section-example .image-example-list .example-item .i-tag {
          position: absolute;
          top: 0;
          left: 0;
          background-color: #EE4D2D;
          width: 0.42667rem;
          height: 0.42667rem;
          border-radius: 0.10667rem 0 0.10667rem 0; }
          .streaming-cover-guideline .guideline-section-example .image-example-list .example-item .i-tag.bad-tag {
            background-color: #6F82A8; }
          .streaming-cover-guideline .guideline-section-example .image-example-list .example-item .i-tag .i-good, .streaming-cover-guideline .guideline-section-example .image-example-list .example-item .i-tag .i-bad {
            content: ' ';
            position: absolute;
            left: 50%;
            top: 50%;
            width: 0.26667rem;
            height: 0.26667rem;
            transform: translate(-50%, -50%); }
      .streaming-cover-guideline .guideline-section-example .image-example-list .example-img {
        width: 2.56rem;
        height: 2.56rem;
        border-radius: 0.10667rem; }

/*  imported from styles.scss  */
._3jPok {
  display: inline-block;
  position: relative;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  margin-left: 0.75rem; }

._3pPCj {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-sizing: border-box;
  display: block;
  width: 3rem;
  height: 1.75rem;
  border-radius: 0.875rem;
  outline: 0;
  margin: 0;
  background-color: rgba(0, 0, 0, 0.09);
  -webkit-transition: background-color 0.2s, border 0.2s;
  transition: background-color 0.2s, border 0.2s; }

._3pPCj:checked {
  border-color: transparent;
  background-color: #30b566;
  background-color: var(--nc-success, #30b566); }

._3pPCj:checked ~ ._2IQS1 {
  -webkit-transform: translateX(20px);
  transform: translateX(20px); }

._3pPCj:disabled {
  opacity: 0.5; }

._2IQS1 {
  position: absolute;
  display: block;
  box-sizing: border-box;
  pointer-events: none;
  top: 0.125rem;
  left: 0.125rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 0.75rem;
  background: white;
  box-shadow: 0 0.125rem 0.1875rem rgba(0, 0, 0, 0.2);
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s; }

.B7gGv {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }

._1adxB {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent; }

:root {
  --ios-bg: #fff;
  --ios-color: color(var(--ios-bg) contrast(50%));
  --ios-disabled-color: #fff;
  --ios-theme: #dbdbdb;
  --default-bg: #f7f7f7;
  --default-color: color(var(--default-bg) contrast(50%));
  --default-disabled-color: color(var(--default-color) blend(var(--default-bg) 70%));
  --default-theme: #4eccc4;
  --dark-bg: #263238;
  --dark-color: color(var(--dark-bg) contrast(50%));
  --dark-disabled-color: color(var(--dark-color) blend(var(--dark-bg) 70%));
  --dark-theme: #50ccc4;
  --android-bg: #f5f5f5;
  --android-color: color(var(--android-bg) contrast(50%));
  --android-disabled-color: color(var(--android-color) blend(var(--android-bg) 70%));
  --android-theme: #31b6e7;
  --android-dark-bg: #292829;
  --android-dark-color: color(var(--android-dark-bg) contrast(50%));
  --android-dark-disabled-color: color(var(--android-dark-color) blend(var(--android-dark-bg) 70%)); }

.datepicker-modal {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 999;
  display: none;
  overflow: hidden; }

.on .datepicker-modal {
  display: block; }

.on .datepicker {
  transform: translateY(0); }

.datepicker {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 1001;
  font-size: 16px;
  text-align: center;
  box-sizing: content-box;
  -webkit-font-smoothing: antialiased;
  user-select: none;
  height: 316px;
  transform: translateY(100vh);
  transition: transform 0.5s; }
  .datepicker .datepicker-header {
    padding: 0 .5em;
    min-height: 2em;
    line-height: 2em;
    font-size: 1.125em; }
  .datepicker .datepicker-navbar {
    padding: 0 .5em .5em .5em;
    overflow: hidden; }
  .datepicker .datepicker-navbar-btn {
    float: right;
    padding: 0 1em;
    cursor: pointer;
    height: 48px;
    line-height: 48px;
    font-size: 16px; }
    .datepicker .datepicker-navbar-btn:first-child {
      color: #EE4D2D;
      padding: 0 12px 0 0; }
    .datepicker .datepicker-navbar-btn:last-child {
      color: #202325;
      padding: 0 0 0 12px; }
  .datepicker .datepicker-caption {
    display: flex;
    padding: .5em .25em; }
  .datepicker .datepicker-caption-item {
    flex: 1;
    margin: 0 .25em;
    height: 40px;
    line-height: 40px;
    font-size: 1.2em; }
  .datepicker .datepicker-content {
    display: flex;
    padding: .5em .25em; }
  .datepicker .datepicker-col-1 {
    flex: 1;
    margin: 0 .25em; }
    .datepicker .datepicker-col-1:nth-child(2) {
      padding-right: 8px;
      padding-left: 8px; }
    .datepicker .datepicker-col-1:nth-child(4) {
      padding-right: 8px;
      padding-left: 24px; }
  .datepicker .datepicker-viewport {
    height: 100%;
    position: relative;
    overflow: hidden; }
    .datepicker .datepicker-viewport::after {
      content: '';
      position: absolute;
      z-index: 2;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      pointer-events: none; }
  .datepicker .datepicker-wheel {
    position: absolute;
    height: 37px;
    top: 50%;
    width: 100%;
    margin-top: 0;
    transform: translateY(-50%); }
  .datepicker .datepicker-scroll {
    list-style-type: none;
    padding: 0; }
    .datepicker .datepicker-scroll > li {
      cursor: pointer;
      height: 20px;
      padding-bottom: 16px;
      font-size: 16px;
      line-height: 20px;
      text-align: center; }
    .datepicker .datepicker-scroll > li.selected {
      height: 47px;
      line-height: 47px;
      font-size: 20px;
      color: rgba(0, 0, 0, 0.87) !important; }

.datepicker {
  /* ios */
  /* default */
  /* dark */
  /* android */
  /* android-dark */ }
  .datepicker.ios {
    background-color: var(--ios-bg); }
    .datepicker.ios .datepicker-col-1 {
      margin: 0; }
    .datepicker.ios .datepicker-header {
      color: var(--ios-color);
      padding: 0 3.5em; }
    .datepicker.ios .datepicker-viewport::after {
      background: transparent; }
    .datepicker.ios .datepicker-wheel {
      border: 0;
      height: 47px; }
      .datepicker.ios .datepicker-wheel::before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 100%;
        height: 1px;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.26) 50%, transparent 50%);
        z-index: 10; }
      .datepicker.ios .datepicker-wheel::after {
        position: absolute;
        left: 0;
        bottom: 0;
        content: '';
        width: 100%;
        height: 1px;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.26) 50%, transparent 50%);
        z-index: 10; }
    .datepicker.ios .datepicker-caption-item {
      color: var(--ios-color); }
    .datepicker.ios .datepicker-scroll li {
      color: rgba(0, 0, 0, 0.26); }
    .datepicker.ios .datepicker-scroll li.disabled {
      color: var(--ios-disabled-color); }
    .datepicker.ios .datepicker-navbar {
      position: absolute;
      z-index: 2;
      top: 0;
      left: 0;
      width: 100%;
      padding: 0;
      border-bottom: 1px solid rgba(0, 0, 0, 0.09);
      height: 48px;
      box-sizing: border-box;
      background: #fff; }
    .datepicker.ios .datepicker-navbar-btn:nth-child(2) {
      float: left; }
    .datepicker.ios .datepicker-content {
      background-color: #fff;
      height: calc(100% - 48px);
      margin-top: 48px;
      padding: 0;
      box-sizing: border-box;
      padding: 32px 12px 45px 12px; }
    .datepicker.ios .datepicker-header + .datepicker-content {
      padding-top: 0; }
    .datepicker.ios .datepicker-caption + .datepicker-content {
      padding-top: 0; }
  .datepicker.default {
    background-color: var(--default-bg); }
    .datepicker.default .datepicker-header {
      color: var(--default-theme); }
    .datepicker.default .datepicker-wheel {
      border-top: 1px solid var(--default-theme);
      border-bottom: 1px solid var(--default-theme); }
    .datepicker.default .datepicker-caption-item {
      color: var(--default-color); }
    .datepicker.default .datepicker-scroll li {
      color: var(--default-color); }
    .datepicker.default .datepicker-scroll li.disabled {
      color: var(--default-disabled-color); }
    .datepicker.default .datepicker-navbar-btn {
      color: var(--default-theme); }
  .datepicker.dark {
    background-color: var(--dark-bg); }
    .datepicker.dark .datepicker-header {
      color: var(--dark-theme); }
    .datepicker.dark .datepicker-wheel {
      border-top: 1px solid var(--dark-theme);
      border-bottom: 1px solid var(--dark-theme); }
    .datepicker.dark .datepicker-caption-item {
      color: var(--dark-color); }
    .datepicker.dark .datepicker-scroll li {
      color: var(--dark-color); }
    .datepicker.dark .datepicker-scroll li.disabled {
      color: var(--dark-disabled-color); }
    .datepicker.dark .datepicker-navbar-btn {
      color: var(--dark-theme); }
  .datepicker.android, .datepicker.android-dark {
    background-color: var(--android-bg); }
    .datepicker.android .datepicker-header, .datepicker.android-dark .datepicker-header {
      color: var(--android-theme);
      border-bottom: 2px solid var(--android-theme); }
    .datepicker.android .datepicker-col-1, .datepicker.android-dark .datepicker-col-1 {
      margin: 0 .625em; }
    .datepicker.android .datepicker-viewport::after, .datepicker.android-dark .datepicker-viewport::after {
      background-image: linear-gradient(#f5f5f5, rgba(245, 245, 245, 0) 52%, rgba(245, 245, 245, 0) 48%, #f5f5f5); }
    .datepicker.android .datepicker-wheel, .datepicker.android-dark .datepicker-wheel {
      border-top: 2px solid var(--android-theme);
      border-bottom: 2px solid var(--android-theme); }
    .datepicker.android .datepicker-caption-item, .datepicker.android-dark .datepicker-caption-item {
      color: var(--android-color); }
    .datepicker.android .datepicker-scroll li, .datepicker.android-dark .datepicker-scroll li {
      font-size: 1.125em;
      color: var(--android-color); }
    .datepicker.android .datepicker-scroll li.disabled, .datepicker.android-dark .datepicker-scroll li.disabled {
      color: var(--android-disabled-color); }
    .datepicker.android .datepicker-navbar, .datepicker.android-dark .datepicker-navbar {
      display: flex;
      border-top: 1px solid #d9d4d4;
      padding: 0; }
    .datepicker.android .datepicker-navbar-btn, .datepicker.android-dark .datepicker-navbar-btn {
      padding: 0;
      color: #000;
      flex: 1; }
      .datepicker.android .datepicker-navbar-btn:nth-child(2), .datepicker.android-dark .datepicker-navbar-btn:nth-child(2) {
        border-left: 1px solid #d9d4d4; }
  .datepicker.android-dark {
    background-color: var(--android-dark-bg); }
    .datepicker.android-dark .datepicker-viewport::after {
      background-image: linear-gradient(#282828, rgba(40, 40, 40, 0) 52%, rgba(40, 40, 40, 0) 48%, #282828); }
    .datepicker.android-dark .datepicker-caption-item {
      color: var(--android-dark-color); }
    .datepicker.android-dark .datepicker-scroll li {
      color: var(--android-dark-color); }
    .datepicker.android-dark .datepicker-scroll li.disabled {
      color: var(--android-dark-disabled-color); }
    .datepicker.android-dark .datepicker-navbar {
      border-color: #424542; }
    .datepicker.android-dark .datepicker-navbar-btn {
      color: #fff; }
      .datepicker.android-dark .datepicker-navbar-btn:nth-child(2) {
        border-color: #424542; }

.shopee-avatar {
  padding-top: 0;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center; }
  .shopee-avatar.fill-image * {
    width: 100%;
    height: 100%; }

.shopee-img {
  position: relative;
  display: block;
  background: #f4f4f4;
  overflow: hidden; }
  .shopee-img .cover, .shopee-img .contain, .shopee-img .center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%); }
  .shopee-img img.none {
    display: none; }
  .shopee-img img.visible {
    display: inherit; }
  .shopee-img .dimmer {
    width: 100%;
    height: 100%;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3); }
    .shopee-img .dimmer i {
      color: #fff;
      cursor: pointer; }

.shopee-img-reminder-manage-avatar {
  width: 110px;
  height: 110px; }
  @media screen and (max-width: 360px) {
    .shopee-img-reminder-manage-avatar {
      width: 1.1rem;
      height: 1.1rem; } }

.shopee-img-reminder-share-avatar {
  width: 110px;
  height: 110px; }

.shopee-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center; }

.i-check {
  width: 16px;
  height: 16px;
  border-radius: 2px; }
  .i-check.uncheck {
    border: 1px solid #757575; }
  .i-check.check {
    border: 1px solid #EE4D2D;
    background: #EE4D2D; }
  .i-check.prev-check {
    border: 1px solid #FF9472;
    background: #FF9472; }
  .i-check svg {
    fill: #fff; }

.i-coins svg {
  margin: 2px 3px; }

.i-add svg {
  fill: #EE4D2D; }

.i-sort svg {
  fill: #555;
  width: 24px;
  height: 24px; }

.i-delete {
  width: 30px;
  height: 30px;
  background: #F5F5F5;
  border-radius: 50%; }
  .i-delete svg {
    fill: #555;
    width: 24px;
    height: 24px; }

.i-arrow-right svg {
  width: 12px;
  height: 12px;
  fill: #512601; }

.i-viewers svg {
  height: 11px;
  width: 11px;
  fill: #fff; }

.i-play svg {
  width: 40px;
  height: 40px;
  fill: #fff; }

.i-time svg {
  width: 30px;
  height: 30px;
  fill: #fff; }

.i-live-end svg {
  width: 48px;
  height: 48px;
  fill: #fff; }

.i-replay svg {
  width: 24px;
  height: 24px;
  fill: #EE4D2D; }

.i-price {
  display: flex;
  flex-direction: column; }
  .i-price svg {
    fill: rgba(0, 0, 0, 0.54); }
  .i-price .active {
    fill: #EE4D2D; }

.i-select {
  display: flex; }
  .i-select svg {
    height: 16px;
    width: 16px;
    fill: #4a4a4a; }

.i-page-back {
  width: 18px;
  height: 24px; }
  .i-page-back svg {
    width: 18px;
    height: 24px; }

.header-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin-left: 15px;
  margin-top: 16px;
  position: relative; }

.live-message {
  display: flex;
  flex-direction: row;
  align-items: flex-start; }

.shop-popularity {
  display: flex;
  flex-direction: row;
  margin-top: 3px; }

.shop-intro {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin-right: 10px;
  margin-left: 5px; }

.shop-name {
  max-width: 146px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-weight: 500;
  font-size: 14px;
  color: #ffffff;
  letter-spacing: 0;
  line-height: 14px; }

.shop-popularity-number {
  font-size: 11px;
  color: #ffffff;
  letter-spacing: 0;
  margin-left: 3px; }

.title {
  display: -webkit-box;
  width: 70%;
  font-weight: 500;
  font-size: 18px;
  color: #FFFFFF;
  letter-spacing: 0;
  line-height: 21px;
  margin-bottom: 16px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden; }

.wrapper {
  height: 80px;
  width: 80px;
  position: relative;
  left: 15px;
  top: 23px; }

.price {
  position: absolute;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.65);
  font-size: 12px;
  width: 100%;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

.host-avatar {
  width: 32px;
  height: 32px;
  overflow: hidden;
  border-radius: 50%; }

#product-section .product-item-dragging {
  visibility: hidden; }

#product-section .product-item-ghost, #product-section .product-item-dragging {
  box-shadow: 0 0 9px rgba(0, 0, 0, 0.12);
  position: relative;
  z-index: 10;
  border-radius: 6px; }

.streaming-notice {
  font-size: 12px;
  line-height: 15px;
  text-align: center;
  color: rgba(0, 0, 0, 0.54);
  margin-bottom: 10px;
  margin-top: 40px; }
  .streaming-notice a {
    color: #007AFF; }

.PromoLabel_promo-label-container {
  max-height: 396px; }

body .Setup_Toast-container {
  padding: 12px 16px;
  border-radius: 6px; }

body .Setup_Toast-content {
  font-size: 14px; }

.hide-scrollbar::-webkit-scrollbar {
  display: none; }

.setup-banner-text {
  position: absolute;
  display: flex;
  align-items: center;
  height: 100%;
  width: 65%;
  padding: 6px 10px;
  box-sizing: border-box;
  white-space: word-wrap;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 20px;
  font-weight: bold; }

#product-section .product-item-dragging {
  visibility: hidden; }

#product-section .product-item-ghost, #product-section .product-item-dragging {
  box-shadow: 0 0 9px rgba(0, 0, 0, 0.12);
  position: relative;
  z-index: 10;
  border-radius: 6px; }

.streaming-notice {
  font-size: 12px;
  line-height: 15px;
  text-align: center;
  color: rgba(0, 0, 0, 0.54);
  margin-bottom: 10px;
  margin-top: 40px; }
  .streaming-notice a {
    color: #007AFF; }

.PromoLabel_promo-label-container {
  max-height: 396px; }

body .Setup_Toast-container {
  padding: 12px 16px;
  border-radius: 6px; }

body .Setup_Toast-content {
  font-size: 14px; }

.hide-scrollbar::-webkit-scrollbar {
  display: none; }

.setup-banner-text {
  position: absolute;
  display: flex;
  align-items: center;
  height: 100%;
  width: 65%;
  padding: 6px 10px;
  box-sizing: border-box;
  white-space: word-wrap;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 20px;
  font-weight: bold; }

@keyframes movement {
  0% {
    transform: translateY(2px); }
  50% {
    transform: translateY(-2px); }
  100% {
    transform: translateY(2px); } }

.shopee-loader {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%; }
  .shopee-loader.global {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%); }

.shopee-loader-dot circle {
  animation: movement 400ms linear 0s infinite normal none running; }

.shopee-loader-dot circle:nth-child(2) {
  animation-delay: 100ms; }

.shopee-loader-dot circle:nth-child(3) {
  animation-delay: 200ms; }

.shopee-loader-spinner {
  background: transparent !important;
  width: 20PX;
  height: 20PX;
  border-radius: 50%;
  border: 1px solid #fff;
  border-bottom-color: transparent;
  display: inline-block;
  animation: loading-rotate 0.75s 0s linear infinite;
  animation-fill-mode: both; }

.float-avatar {
  position: absolute;
  width: 72px;
  height: 88px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.5);
  right: 15px;
  top: 54px;
  display: flex;
  align-items: center;
  flex-direction: column; }
  .float-avatar .avatar-wrapper {
    margin-top: 2px;
    height: 66px;
    width: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative; }
  .float-avatar .avatar-name {
    font-weight: 500;
    font-size: 10px;
    text-align: center;
    color: #fff;
    margin-bottom: 8px;
    text-align: center;
    padding: 0 2px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    box-sizing: border-box; }
  .float-avatar .avatar-border {
    border-color: #00d9bd;
    border-radius: 50%;
    border-style: solid;
    border-width: 1px;
    padding: 1px;
    position: relative;
    overflow: hidden; }
    .float-avatar .avatar-border.disconnected {
      border-color: #ee2c4a; }
  .float-avatar .avatar-mask {
    display: none;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    font-size: 7px;
    font-weight: 500;
    color: #fff;
    text-align: center; }
    .float-avatar .avatar-mask .bad-network-text {
      margin-top: 4px; }
  .float-avatar.show-mask .avatar-mask {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }

.dialog-title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  padding: 12px 16px;
  font-weight: 500; }

.dialog-content {
  color: rgba(0, 0, 0, 0.65);
  font-size: 14px;
  line-height: 20px;
  text-align: left;
  padding: 0 20px 20px;
  font-weight: 500; }

.primary-link {
  color: #4080EE;
  font-size: 14px;
  text-decoration: none; }

.sp-container {
  display: flex;
  width: max-content; }

.sp-tag {
  overflow: hidden;
  line-height: 12px;
  white-space: nowrap;
  border-radius: 2px;
  padding: 1px 4px;
  background: linear-gradient(90.69deg, #ffae04 1.8%, #eb1717 86.7%, #eb6417 99.4%); }

.sp-text {
  overflow: hidden;
  color: #fff;
  font-size: 9px;
  font-weight: 500; }

.sp-timeBox {
  border-radius: 0 1px 1px 0;
  border: 1px solid #ee4d2d;
  border-left: none;
  text-align: center;
  white-space: nowrap; }

.sp-time {
  color: #EE4D2D;
  line-height: 12px;
  font-size: 9px;
  margin: 0 3px; }

.sp-countdown-width-40 {
  width: 40px; }

.sp-container-uncoming {
  display: flex;
  border: 0.5px solid #ee4d2d;
  border-radius: 1px; }
  .sp-container-uncoming .sp-timeBox {
    border: none; }
  .sp-container-uncoming .sp-text {
    color: #ee4d2d;
    line-height: 13px;
    display: flex;
    align-items: center; }
  .sp-container-uncoming .sp-tag {
    background: rgba(238, 77, 45, 0.09);
    padding: 0 4px; }
  .sp-container-uncoming .sp-time {
    line-height: 13px;
    height: 13px; }

@charset "UTF-8";
:root {
  --esat: env(safe-area-inset-top);
  --esar: env(safe-area-inset-right);
  --esab: env(safe-area-inset-bottom);
  --esal: env(safe-area-inset-left);
  --csat: constant(safe-area-insert-top);
  --csar: constant(safe-area-inset-right);
  --csab: constant(safe-area-inset-bottom);
  --csal: constant(safe-area-inset-left); }

.product-select_popover {
  right: 3px;
  /* 箭头样式 */ }
  @supports (top: env(safe-area-inset-top)) {
    .product-select_popover {
      top: calc(var(--esat) + 52px); } }
  @supports (top: constant(safe-area-inset-top)) {
    .product-select_popover {
      top: calc(var(--csat) + 52px); } }
  .product-select_popover div:first-child {
    top: -5px;
    right: 21px; }
    .product-select_popover div:first-child div {
      border-color: transparent transparent #ee4d2d !important;
      top: 0;
      left: 0; }

.m-product-select-tooltip-container {
  margin-top: -4px; }
  .m-product-select-tooltip-container > div:first-child {
    left: 21px !important; }

.circular-progress .circular {
  display: block;
  animation: rotate 2s linear infinite;
  position: relative;
  height: 50px;
  width: 50px; }

.circular-progress .path {
  stroke-dasharray: 1,200;
  stroke-dashoffset: 0;
  animation: dash 1.5s ease-in-out infinite;
  stroke-linecap: round; }

@keyframes rotate {
  100% {
    transform: rotate(360deg); } }

@keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0; }
  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35; }
  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124; } }

.circular-loading {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center; }
  .circular-loading-wrapper {
    background: rgba(0, 0, 0, 0.87);
    width: 140px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    border: none;
    border-radius: 4px;
    padding: 20px 0 10px;
    text-align: center; }
  .circular-loading-icon {
    width: 50px;
    margin: auto;
    margin-bottom: 10px; }
  .circular-loading-label {
    color: #fff; }

.icon-animation-scale, .button-animation-scale {
  animation: btn-replace-scale 0.24s ease; }

.icon-animation-scale-in, .button-animation-scale-in {
  animation: btn-replace-scale-in 0.24s ease; }

.icon-animation-fade-in, .button-animation-fade-in {
  animation: btn-replace-fade-in 0.24s ease; }

.icon-animation-fade-in-bottom, .button-animation-fade-in-bottom {
  animation: btn-replace-fade-in-bottom 0.24s ease; }

.icon-animation-fade-in-top, .button-animation-fade-in-top {
  animation: btn-replace-fade-in-top 0.24s ease; }

.icon-animation-fade-in, .button-animation-fade-in {
  animation: btn-replace-fade-in 0.24s ease; }

.shopee-btn {
  outline: none;
  background: transparent;
  border: 0;
  transition: all .2s ease; }
  .shopee-btn .shopee-loader {
    height: 100%;
    overflow: hidden; }
  .shopee-btn .text {
    margin-left: 4px;
    line-height: 24px;
    display: block;
    width: 100%; }
  .shopee-btn.shopee-btn-disabled {
    opacity: 0.5; }

.setup-spinner-wrapper {
  width: 100%;
  display: flex;
  justify-content: center; }


/*# styles.e08cd1f2.chunk.css.map*/