:root {
  --hr-bg: #2b2b2b;
  --hr-bg-deep: #111319;
  --hr-panel: #343434;
  --hr-panel-soft: #4f4a49;
  --hr-text: #f5f7fb;
  --hr-muted: #a7a7ad;
  --hr-line: rgba(255, 255, 255, .08);
  --hr-blue: #26b2ff;
  --hr-blue-soft: rgba(38, 178, 255, .18);
}

html,
body,
.member-wrap {
  background: var(--hr-bg) !important;
  color: var(--hr-text);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
}

body {
  padding-top: 70px;
}

a,
.color,
.vodlist_title a,
.title h2,
.pannel_head .title {
  color: var(--hr-text);
}

a:hover,
.top_nav li.active a,
.top_nav li a:hover,
.pc_more:hover,
.vodlist_title a:hover {
  color: var(--hr-blue) !important;
}

.container {
  max-width: 1680px;
  width: calc(100% - 40px);
}

.site-head-wrap,
.head_box,
.header {
  height: 70px !important;
}

.site-head-wrap,
.head_box {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9998;
  background: rgba(17, 19, 25, .76) !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px);
}

.header,
.head_a {
  background: transparent !important;
}

.head_a {
  height: 70px !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.head_logo,
.mac-logo,
.mac-logo .logo {
  height: 48px;
}

.head_logo img,
.mac-logo img {
  width: 168px;
  max-height: 42px;
  object-fit: contain;
}

.top_nav {
  display: flex;
  align-items: center;
  gap: 6px;
}

.top_nav li a,
.top_nav_more_btn {
  height: 38px;
  padding: 0 12px !important;
  border-radius: 19px;
  color: rgba(255, 255, 255, .86) !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 38px;
  transition: color .2s ease, background .2s ease;
}

.top_nav li.active a,
.top_nav li a:hover,
.top_nav_more_btn:hover {
  background: var(--hr-blue-soft);
}

.top_nav_overlay {
  background: rgba(28, 30, 36, .98) !important;
  border: 1px solid var(--hr-line);
  border-radius: 8px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .32);
}

.top_nav_overlay_item {
  color: rgba(255, 255, 255, .88) !important;
}

.head_a_tools {
  display: flex;
  align-items: center;
  gap: 14px;
}

.head_search,
.head_search_inner,
.head_search form,
.head_search .search-input,
.head_search_capsule_host {
  border-radius: 22px !important;
}

.head_search,
.head_search_inner {
  background: linear-gradient(90deg, rgba(114, 214, 245, .2), rgba(200, 193, 221, .2) 50%, rgba(255, 148, 179, .2)) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
}

.head_search input,
.head_search .search-input {
  color: var(--hr-text) !important;
}

.head_search input::placeholder {
  color: rgba(255, 255, 255, .58);
}

.head_user .top_ico,
.head_user .top_link {
  color: rgba(255, 255, 255, .82) !important;
}

.head_user .top_link:hover {
  color: var(--hr-blue) !important;
}

.home-index-body .container.home-unified {
  width: 100%;
  max-width: none;
  padding: 0;
}

.home-detail,
.home-unified > .box,
.home-unified .latest-tab-box,
.home-unified .layout {
  max-width: 1680px;
  width: calc(100% - 40px);
  margin-left: auto !important;
  margin-right: auto !important;
}

.banstem {
  margin-top: -70px !important;
  padding-top: 70px;
  background: var(--hr-bg-deep) !important;
}

.banstem,
.banstem_list,
.hot_banner_box,
.banner-top,
.balist_thumb {
  border-radius: 0 !important;
}

.banstem .balist_thumb {
  min-height: 470px;
  background-position: center !important;
  background-size: cover !important;
}

.banstem .balist_thumb::before,
.banstem .balist_thumb::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 1;
}

.banstem .balist_thumb::before {
  inset: 0;
  background:
    linear-gradient(90deg, rgba(17, 19, 25, .82) 0, rgba(17, 19, 25, .18) 38%, rgba(17, 19, 25, .84) 100%),
    linear-gradient(0deg, var(--hr-bg) 0, rgba(43, 43, 43, 0) 34%);
}

.banstem .balist_thumb::after {
  left: 0;
  right: 0;
  bottom: 0;
  height: 160px;
  background: linear-gradient(0deg, var(--hr-bg), rgba(43, 43, 43, 0));
}

.banstem_info {
  z-index: 2;
  max-width: 560px;
}

.banstem_title {
  color: #fff !important;
  font-weight: 800;
}

.banstem_desc,
.vodlist_sub,
.txt-list li,
.txt-list li a,
.fo_t,
.fo_t a,
.foot p {
  color: var(--hr-muted) !important;
}

.banstem_btn_play,
.button,
.home-refresh-btn:hover {
  background: var(--hr-blue) !important;
  color: #fff !important;
  border-color: var(--hr-blue) !important;
}

.box,
.latest-tab-box,
.layout,
.latest-item,
.rank_info,
.list_info {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.title,
.hu-section-head,
.pannel_head {
  border: 0 !important;
}

.title h2,
.hu-section-head h2 {
  font-size: 26px;
  line-height: 1.35;
  font-weight: 800;
}

.pc_more,
.home-refresh-btn {
  color: var(--hr-muted) !important;
  background: rgba(255, 255, 255, .06) !important;
  border: 1px solid var(--hr-line) !important;
  border-radius: 18px !important;
}

.img-list,
.vodlist,
.home-unified-vlist {
  gap: 18px;
}

.vodlist_item,
.public-list-box {
  background: transparent !important;
}

.vodlist_thumb,
.ranklist_thumb,
.topiclist_thumb,
.public-list-exp {
  position: relative;
  overflow: hidden;
  border-radius: 12px !important;
  background-color: #25252b !important;
  filter: brightness(.88);
  transition: transform .25s ease, filter .25s ease, box-shadow .25s ease;
}

.vodlist_thumb::after,
.ranklist_thumb::after {
  content: "\e659";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54px;
  height: 54px;
  margin: -27px 0 0 -27px;
  border-radius: 50%;
  background: var(--hr-blue);
  color: #fff;
  font-family: iconfont;
  font-size: 25px;
  line-height: 54px;
  text-align: center;
  opacity: 0;
  transform: scale(.82);
  transition: opacity .2s ease, transform .2s ease;
  z-index: 4;
}

.vodlist_item:hover .vodlist_thumb,
.ranklist_item:hover .ranklist_thumb {
  filter: brightness(1);
  transform: translateZ(0) scale(1.02);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .34);
}

.vodlist_item:hover .vodlist_thumb::after,
.ranklist_item:hover .ranklist_thumb::after {
  opacity: 1;
  transform: scale(1);
}

.vodlist_titbox {
  padding-top: 10px;
}

.vodlist_title,
.vodlist_title a {
  color: #fff !important;
  font-weight: 700;
}

.mac_vip_badge,
.mac_jinbi_badge,
.mac_badge_bottom_right,
.public-prt {
  border-radius: 999px !important;
  background: #ffdd9a !important;
  color: #4e2d03 !important;
  border: 0 !important;
  font-weight: 700;
}

.foot {
  margin-top: 42px;
  background: #242424 !important;
  border-top: 1px solid var(--hr-line);
}

.foot-logo img {
  max-width: 180px;
}

.top-back,
.extra-fab-tools,
.fab-tools {
  right: 18px !important;
  bottom: 84px !important;
}

.top-back a,
.extra-fab-tools a,
.extra-fab-tools button,
.fab-tools a,
.fab-tools button {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .1) !important;
  color: #fff !important;
  border: 1px solid var(--hr-line) !important;
  backdrop-filter: blur(10px);
}

#bottomNav,
.bottom-navigation,
.foot-table-box {
  background: rgba(38, 38, 38, .96) !important;
  border-top: 1px solid var(--hr-line) !important;
  border-radius: 18px 18px 0 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  position: fixed !important;
  right: 0 !important;
  z-index: 9997 !important;
  backdrop-filter: blur(12px);
}

#bottomNav a,
.bottom-navigation a {
  color: rgba(255, 255, 255, .72) !important;
}

#bottomNav a.active,
#bottomNav .active,
.bottom-navigation .active,
.bottom-navigation .cor6 {
  color: var(--hr-blue) !important;
}

@media (max-width: 1400px) {
  .head_search {
    width: 380px !important;
  }
  .top_nav li:nth-child(n+6) {
    display: none;
  }
}

@media (max-width: 1100px) {
  .top_nav li:nth-child(n+4) {
    display: none;
  }
}

@media (max-width: 820px) {
  body {
    padding-top: 70px;
    padding-bottom: 70px;
  }

  .container,
  .home-detail,
  .home-unified > .box,
  .home-unified .latest-tab-box,
  .home-unified .layout {
    width: calc(100% - 24px);
  }

  .site-head-wrap,
  .head_box,
  .header,
  .head_a {
    height: 50px !important;
    min-height: 50px !important;
  }

  .head_logo img,
  .mac-logo img {
    width: 132px;
    max-height: 34px;
  }

  .head_menu_a,
  .head_search {
    display: none !important;
  }

  .banstem {
    margin-top: -70px !important;
    padding-top: 70px;
  }

  .banstem .balist_thumb {
    min-height: 260px;
  }

  .title h2,
  .hu-section-head h2 {
    font-size: 20px;
  }

  .img-list,
  .vodlist,
  .home-unified-vlist {
    gap: 10px;
  }

  .vodlist_thumb::after,
  .ranklist_thumb::after {
    width: 42px;
    height: 42px;
    margin: -21px 0 0 -21px;
    font-size: 20px;
    line-height: 42px;
  }
}

/* Layout polish pass 20260625 */
@media (min-width: 821px) and (max-width: 1460px) {
  .head_a {
    gap: 10px;
  }

  .top_nav {
    gap: 2px;
  }

  .top_nav li a,
  .top_nav_more_btn {
    max-width: 86px;
    overflow: hidden;
    padding: 0 9px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .head_a_tools {
    gap: 8px;
  }

  .head_search,
  .head_search_capsule_host {
    max-width: min(360px, 30vw) !important;
  }
}

@media (max-width: 820px) {
  body {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  }

  .mobile-head .head_user ul {
    gap: 8px;
    max-width: 48vw;
  }

  .mobile-head .head_user li.top_ico a .head-nav-icon {
    height: 22px !important;
    width: 22px !important;
  }

  .extra.extra-fab {
    bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  }

  #bottomNav,
  .bottom-navigation,
  .foot-table-box {
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
}

.home-unified .box,
.home-unified .latest-tab-box,
.home-unified .layout {
  margin-bottom: 24px !important;
}

.home-unified .hu-section-head {
  gap: 10px;
  margin-bottom: 10px;
}

.home-unified .hu-section-head .pc_more {
  align-items: center;
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid var(--hr-line);
  border-radius: 999px !important;
  color: rgba(255, 255, 255, .82) !important;
  display: inline-flex;
  min-height: 34px;
  padding: 0 16px !important;
}

.home-unified .hu-section-head .pc_more:hover {
  background: rgba(64, 204, 146, .18) !important;
  color: #fff !important;
}

.home-unified .latest-tab-box .latest-item .txt-list {
  display: grid;
  gap: 8px 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-unified .latest-tab-box .latest-item .txt-list li {
  box-sizing: border-box;
  margin: 0 !important;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: auto !important;
}

.home-unified .home-skeleton-card .thumb,
.home-unified .home-skeleton .thumb,
.home-unified .vodlist_thumb {
  border-radius: var(--tpl-radius-cover, 8px);
}

@media (min-width: 821px) {
  .detail-wrap .hot_banner .detail_list .vod-detail-hero-box {
    --vod-detail-rating-safe: calc(min(320px, 34vw) + 20px) !important;
  }

  .detail-wrap .hot_banner .vod-detail-hero__progress {
    max-width: min(320px, 34vw) !important;
    width: 320px !important;
  }

  .detail-wrap .hot_banner .progress_item .layui-progress {
    width: 240px !important;
  }
}

.detail-wrap .play_list_box .playlist_notfull .content_playlist li > a {
  border: 1px solid var(--tpl-border-soft, rgba(255, 255, 255, .08)) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.detail-wrap .play_list_box .playlist_notfull .content_playlist li.active > a {
  border-color: rgba(64, 204, 146, .45) !important;
}

#play_page {
  --hr-blue: var(--tpl-accent, #40cc92);
  --hr-blue-soft: rgba(64, 204, 146, .18);
}

#play_page .play_but .iconfont,
#play_page .play_but svg,
#play_page .play-but-item__report-ico {
  color: var(--tpl-accent, #40cc92) !important;
}

@media (max-width: 820px) {
  #play_page .play-but-bar .play-but-strip a.report_click > span,
  #play_page .play-but-bar .play-but-strip a[onclick*="location.reload"] > span,
  #play_page .play-but-bar .play-but-strip .play_collec > span {
    display: none !important;
  }

  #play_page .play-but-bar .play-but-item > a,
  #play_page .play-but-bar .play-but-item > .play_collec {
    min-width: 34px;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}

#vodSearchPage .search_box .pannel_head .title em {
  color: var(--tpl-accent, #40cc92);
  display: inline-block;
  max-width: min(46vw, 420px);
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  white-space: nowrap;
}

@media (max-width: 820px) {
  #vodSearchPage .searchlist_item {
    border-bottom: 1px solid var(--tpl-border-soft, rgba(255, 255, 255, .08));
    padding: 10px 0;
  }

  #vodSearchPage .searchlist_titbox {
    min-width: 0;
  }

  #vodSearchPage .vodlist_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    white-space: normal;
  }

  #vodSearchPage .vodlist_sub {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .home-unified .box,
  .home-unified .latest-tab-box,
  .home-unified .layout {
    margin-bottom: 16px !important;
  }

  .home-unified .hu-section-head .pc_more {
    max-width: 86px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

.foot {
  padding-top: 28px;
  padding-bottom: 26px;
}

.fo_t p {
  line-height: 1.8;
}

.fo_t .color {
  display: inline-flex;
  margin: 0 8px;
  transition: color .2s ease;
}

.fo_t .color:hover {
  color: var(--tpl-accent, #40cc92) !important;
}
