:root {
  color-scheme: dark;
  --hg-bg: #131414;
  --hg-surface: #202121;
  --hg-surface-2: #292827;
  --hg-text: rgba(255, 255, 255, .9);
  --hg-muted: rgba(255, 255, 255, .5);
  --hg-faint: rgba(255, 255, 255, .3);
  --hg-line: rgba(255, 255, 255, .1);
  --hg-orange: #fa7705;
  --hg-orange-2: #ff9233;
  --hg-width: 1240px;
}

* { box-sizing: border-box; }
html { background: var(--hg-bg); scroll-behavior: smooth; }
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--hg-bg);
  color: var(--hg-text);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body::-webkit-scrollbar, html::-webkit-scrollbar, .hg-rail::-webkit-scrollbar { display: none; }
body, html, .hg-rail { scrollbar-width: none; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
img { display: block; }
.hg-hide { display: none !important; }
.hg-shell { margin: 0 auto; width: var(--hg-width); }
.hg-icon { display: block; height: 1em; width: 1em; }

/* Header */
.hg-header {
  height: 64px;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 100;
}
.hg-header::before {
  background: rgba(19, 20, 20, .96);
  content: "";
  inset: 0;
  opacity: 0;
  position: absolute;
  transition: opacity .3s ease;
}
.hg-header.is-scrolled::before,
.page-catalog .hg-header::before,
.page-detail .hg-header::before,
.page-player .hg-header::before,
.page-search .hg-header::before { opacity: 1; }
.hg-header-inner {
  align-items: center;
  display: flex;
  height: 64px;
  margin: 0 auto;
  position: relative;
  width: var(--hg-width);
  z-index: 1;
}
.hg-logo { display: flex; flex: 0 0 110px; height: 32px; margin-right: 82px; width: 110px; }
.hg-logo img { height: 32px; object-fit: contain; width: 110px; }
.hg-nav { align-items: center; display: flex; height: 64px; }
.hg-nav-link {
  align-items: center;
  background: none;
  border: 0;
  cursor: pointer;
  display: flex;
  font-size: 16px;
  font-weight: 500;
  height: 64px;
  margin-right: 40px;
  opacity: .4;
  padding: 0;
  transition: opacity .2s ease;
}
.hg-nav-link:hover,
.page-home .nav-home,
.page-catalog .nav-category,
.page-search .nav-category { opacity: .9; }
.hg-search { height: 40px; margin-left: auto; position: relative; width: 280px; }
.hg-search form {
  align-items: center;
  background: rgba(224, 224, 224, .08);
  border-radius: 12px;
  display: flex;
  height: 40px;
  overflow: hidden;
}
.hg-search input {
  background: transparent;
  border: 0;
  caret-color: var(--hg-orange);
  color: rgba(255, 255, 255, .8);
  flex: 1;
  font-size: 14px;
  height: 40px;
  min-width: 0;
  outline: 0;
  padding: 7px 4px 7px 16px;
}
.hg-search input::placeholder { color: rgba(255, 255, 255, .4); }
.hg-search button, .hg-mobile-search-button {
  align-items: center;
  background: none;
  border: 0;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
.hg-search button { color: rgba(255, 255, 255, .7); height: 40px; padding: 0 16px 0 8px; width: 52px; }
.hg-search svg, .hg-mobile-search-button svg { height: 18px; width: 18px; }
.hg-search .hg-search-submit-icon { height: 15px; width: 14px; }
.hg-search-submit-text { display: none; font-size: 14px; font-weight: 400; white-space: nowrap; }
.hg-search form:focus-within .hg-search-submit-icon { display: none; }
.hg-search form:focus-within .hg-search-submit-text { display: inline; }
.hg-mobile-search-button { display: none; }
.hg-mobile-search-panel { display: none; }

/* Desktop home hero */
.hg-desktop-hero { display: block; height: 803px; min-width: 1240px; overflow: hidden; position: relative; }
.hg-hero-bg {
  height: 620px;
  left: 50%;
  -webkit-mask-image: radial-gradient(ellipse 57% 40% at 50% 35%, #000 26%, rgba(0,0,0,var(--hg-hero-edge-alpha, 0)) 100%);
  mask-image: radial-gradient(ellipse 57% 40% at 50% 35%, #000 26%, rgba(0,0,0,var(--hg-hero-edge-alpha, 0)) 100%);
  opacity: var(--hg-hero-bg-opacity, .09);
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  top: 64px;
  transform: translateX(-50%) translateY(var(--hg-hero-bg-y, 0px));
  width: 1552px;
}
.hg-hero-bg-strip { height: 197px; position: absolute; transform: rotate(-2.81deg); transform-origin: center center; width: max-content; }
.hg-hero-bg-strip:nth-child(1) { left: 166px; top: -100px; }
.hg-hero-bg-strip:nth-child(2) { left: -6px; top: 113px; }
.hg-hero-bg-strip:nth-child(3) { left: 186px; top: 308px; }
.hg-hero-bg-strip-inner { --hg-bg-cycle: 1350px; animation: hgHeroBgFlowLeft 150s linear infinite; display: flex; gap: 7px; width: max-content; }
.hg-hero-bg-strip:nth-child(2) .hg-hero-bg-strip-inner { animation-duration: 225s; animation-name: hgHeroBgFlowRight; }
.hg-hero-bg-strip:nth-child(3) .hg-hero-bg-strip-inner { animation-duration: 300s; }
.hg-hero-bg-card { border-radius: 7px; flex: 0 0 143px; height: 197px; overflow: hidden; }
.hg-hero-bg-card img { filter: brightness(.85) saturate(.8); height: 100%; object-fit: cover; width: 100%; }
@keyframes hgHeroBgFlowLeft { from { transform: translateX(0); } to { transform: translateX(calc(-1 * var(--hg-bg-cycle))); } }
@keyframes hgHeroBgFlowRight { from { transform: translateX(calc(-1 * var(--hg-bg-cycle))); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) { .hg-hero-bg-strip-inner { animation: none; } }
.hg-hero-copy { left: 50%; position: fixed; top: 165px; transform: translateX(-50%); z-index: 8; }
.hg-hero-brand { display: block; height: 40px; margin: 0 auto 24px; object-fit: contain; width: 180px; }
.hg-hero-slogan { display: block; height: 79px; object-fit: contain; transform-origin: center top; width: 518px; }
.hg-download-button {
  align-items: center;
  background: linear-gradient(99.86deg, #ff7e0d .27%, var(--hg-orange-2));
  border: 0;
  border-radius: 12px;
  color: rgba(255,255,255,.95);
  cursor: pointer;
  display: flex;
  font-size: 18px;
  font-weight: 500;
  height: 44px;
  justify-content: center;
  margin: 23px auto 0;
  min-width: 190px;
  padding: 0 24px;
}
.hg-scroll-more { align-items: center; color: rgba(255,255,255,.4); display: flex; flex-direction: column; font-size: 18px; gap: 8px; left: 50%; position: absolute; top: 458px; transform: translateX(-50%); z-index: 9; }
.hg-chevron { animation: hg-chevron 1.5s ease-in-out infinite; height: 32px; width: 32px; }
@keyframes hg-chevron { 0%,100% { opacity:.45; transform:translateY(0); } 50% { opacity:.9; transform:translateY(5px); } }
.hg-mobile-hero { display: none; }

/* Home rails */
.hg-home-content { margin: 0 auto; position: relative; width: var(--hg-width); z-index: 12; }
.hg-section { margin-bottom: 68px; scroll-margin-top: 88px; }
.hg-section-head { align-items: center; display: flex; height: 34px; justify-content: space-between; margin-bottom: 20px; }
.hg-section-title { align-items: center; display: inline-flex; font-size: 24px; font-weight: 600; line-height: 34px; margin: 0; }
.hg-section-title svg { height: 24px; margin-left: 0; width: 24px; }
.hg-section-more { color: rgba(255,255,255,.58); display: none; font-size: 14px; }
.hg-rail-wrap { position: relative; }
.hg-rail { display: flex; gap: 24px; overflow-x: auto; overflow-y: hidden; padding-bottom: 4px; scroll-behavior: smooth; }
.hg-vod-card { flex: 0 0 186px; height: 333px; min-width: 0; width: 186px; }
.hg-vod-cover { background: rgba(255,255,255,.06); border-radius: 12px; height: 255px; overflow: hidden; position: relative; width: 100%; }
.hg-vod-cover::after { background: linear-gradient(180deg, transparent, rgba(0,0,0,.45)); bottom: 0; content:""; height: 72px; left:0; pointer-events:none; position:absolute; right:0; }
.hg-vod-cover img { height: 100%; object-fit: cover; opacity: 0; transition: opacity .25s ease, transform .22s ease; width: 100%; }
.hg-vod-cover img.is-loaded { opacity: 1; }
.hg-vod-card:hover .hg-vod-cover img { transform: scale(1.06); }
.hg-vod-episode { bottom: 10px; color:#fff; font-size:13px; font-weight:600; line-height:18px; position:absolute; right:10px; text-shadow:0 1px 2px rgba(0,0,0,.36); z-index:2; }
.hg-vod-title { color:rgba(255,255,255,.9); font-size:18px; font-weight:400; line-height:25px; margin:16px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:calc(100% - 10px); }
.hg-vod-tags { align-items:center; display:flex; gap:6px; height:25px; margin-top:12px; overflow:hidden; }
.hg-vod-tag { background:rgba(224,224,224,.06); border-radius:4px; color:rgba(255,255,255,.5); flex:0 0 auto; font-size:12px; line-height:17px; max-width:72px; overflow:hidden; padding:4px 8px; text-overflow:ellipsis; white-space:nowrap; }
.hg-card-view-all { align-items:center; background:rgba(255,255,255,.03); border-radius:12px; display:flex; flex:0 0 136px; font-size:14px; height:255px; justify-content:center; opacity:.7; }
.hg-card-view-all:hover { background:rgba(255,255,255,.06); opacity:1; }
.hg-rail-mask { background:linear-gradient(270deg,var(--hg-bg),rgba(19,20,20,0)); height:333px; pointer-events:none; position:absolute; right:-1px; top:0; width:64px; z-index:3; }
.hg-rail-mask-left { background:linear-gradient(90deg,var(--hg-bg),rgba(19,20,20,0)); display:none; left:-1px; right:auto; }

@media (min-width: 768px) {
  .hg-morph-section .hg-section-head { opacity: var(--hg-morph-head-opacity, 0); }
  .hg-morph-section .hg-rail-wrap, .hg-morph-rail { overflow: visible; }
  .hg-morph-rail { scroll-behavior: auto; }
  .hg-morph-section .hg-rail-mask { display: none; }
  .hg-morph-section.is-settled .hg-morph-rail { overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; }
  .hg-morph-section.is-settled .hg-rail-mask:not(.hg-rail-mask-left) { display: block; }
  .hg-rail-wrap.has-scroll-left .hg-rail-mask-left,
  .hg-morph-section.is-settled .hg-rail-wrap.has-scroll-left .hg-rail-mask-left { display: block; }
  .hg-rail-wrap:not(.has-scroll-right) > .hg-rail-mask:not(.hg-rail-mask-left) { display: none; }
  .hg-morph-card { position: relative; transform-origin: top left; will-change: transform; }
  .hg-morph-card:nth-of-type(9) { opacity: 0; pointer-events: none; }
  .hg-morph-section.is-settled .hg-morph-card:nth-of-type(9) { opacity: 1; pointer-events: auto; }
  .hg-morph-view-all { opacity: 0; pointer-events: none; }
  .hg-morph-section.is-settled .hg-morph-view-all { opacity: .7; pointer-events: auto; }
  .hg-morph-arrow, .hg-rail-arrow { background: transparent; border: 0; cursor: pointer; height: 72px; opacity: 0; padding: 0; pointer-events: none; position: absolute; top: 127.5px; transform: translateY(-50%); transition: opacity .16s ease-out; width: 56px; z-index: 5; }
  .hg-morph-arrow-left, .hg-rail-arrow-left { left: 4px; }
  .hg-morph-arrow-right, .hg-rail-arrow-right { right: 4px; }
  .hg-morph-arrow svg, .hg-rail-arrow svg { display: block; height: 72px; opacity: .8; width: 56px; }
  .hg-morph-arrow-left svg, .hg-rail-arrow-left svg { transform: rotate(180deg); }
  .hg-morph-section.is-settled .hg-rail-wrap:hover .hg-morph-arrow.is-available,
  .hg-morph-section.is-settled .hg-morph-arrow.is-available:focus-visible,
  .hg-rail-wrap:hover .hg-rail-arrow.is-available,
  .hg-rail-arrow.is-available:focus-visible { opacity: 1; pointer-events: auto; }
  .hg-morph-card .hg-vod-title,
  .hg-morph-card .hg-vod-tags,
  .hg-morph-card .hg-vod-episode { opacity: var(--hg-morph-meta-opacity, 0); }
}

/* Footer */
.hg-footer { margin: 100px auto 0; width: var(--hg-width); }
.hg-footer-inner { align-items:center; border-top:1px solid var(--hg-line); display:flex; flex-direction:column; justify-content:center; min-height:250px; padding:40px 0 50px; text-align:center; }
.hg-footer p { color:#747474; font-size:14px; letter-spacing:1px; line-height:28px; margin:0; }
.hg-footer-logo { filter: grayscale(1); height:auto; margin-top:20px; opacity:.55; width:121px; }

/* Catalog, search */
.hg-catalog { margin: 0 auto; padding: 108px 0 80px; width: var(--hg-width); }
.hg-category-tabs { align-items:center; display:flex; gap:36px; margin-bottom:24px; }
.hg-category-tabs a { color:rgba(255,255,255,.5); font-size:24px; font-weight:500; line-height:34px; }
.hg-category-tabs a.active, .hg-category-tabs a:hover { color:#fff; }
.hg-filter-row { align-items:flex-start; display:flex; flex-wrap:wrap; gap:0 34px; margin-bottom:10px; }
.hg-filter-row a { color:rgba(255,255,255,.5); font-size:16px; line-height:36px; white-space:nowrap; }
.hg-filter-row a.active, .hg-filter-row a:hover { color:var(--hg-orange); }
.page-catalog .hg-filter-row { column-gap:30px; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
.page-catalog .hg-filter-row::-webkit-scrollbar { display:none; }
.page-catalog .hg-filter-row a { flex:0 0 auto; }
.page-catalog::before { background:radial-gradient(79.79% 63.64% at 51.35% -3.04%,rgba(250,119,5,.1),transparent 100%),radial-gradient(37.71% 88.68% at 111.22% -1.29%,rgba(58,227,221,.1),transparent 100%); content:""; height:1227px; left:0; pointer-events:none; position:absolute; top:0; width:100%; }
.page-catalog .hg-catalog { padding-top:104px; position:relative; }
.page-catalog .hg-category-tabs { gap:32px; margin-bottom:21px; min-height:40px; }
.page-catalog .hg-category-tabs a { line-height:40px; }
.hg-catalog-grid { display:grid; gap:52px 32px; grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); margin-top:36px; }
.hg-catalog-grid .hg-vod-card { height:auto; width:100%; }
.hg-catalog-grid .hg-vod-cover { aspect-ratio:187/256; height:auto; }
.hg-catalog-grid .hg-vod-title { font-size:18px; font-weight:500; line-height:18px; margin:16px 0 12px; width:100%; }
.hg-catalog-grid .hg-vod-tags { margin-top:0; }
.page-catalog .hg-pagination { gap:14px; margin-top:40px; }
.page-catalog .hg-pagination a, .page-catalog .hg-pagination span { background:transparent; border-radius:8px; color:#fff; height:32px; min-width:32px; padding:0 8px; }
.page-catalog .hg-pagination .active, .page-catalog .hg-pagination a:hover { background:rgba(250,119,5,.16); color:var(--hg-orange); }
.page-catalog .hg-pagination .disabled { color:rgba(255,255,255,.24); }
.hg-search-title { font-size:28px; font-weight:600; margin:0 0 28px; }
.hg-search-keyword { color:var(--hg-orange); }
.hg-empty { align-items:center; color:rgba(255,255,255,.55); display:flex; font-size:20px; justify-content:center; min-height:400px; }
.hg-pagination { align-items:center; display:flex; gap:8px; justify-content:center; margin-top:60px; }
.hg-pagination a, .hg-pagination span { align-items:center; background:var(--hg-surface); border-radius:8px; color:rgba(255,255,255,.7); display:flex; height:42px; justify-content:center; min-width:42px; padding:0 12px; }
.hg-pagination .active, .hg-pagination a:hover { background:linear-gradient(99.86deg,#ff7e0d,var(--hg-orange-2)); color:#fff; }

/* Detail */
.hg-detail { margin:0 auto; padding:120px 0 80px; width:var(--hg-width); }
.hg-detail-hero { align-items:flex-start; display:grid; grid-template-columns:168px 1fr; gap:36px; }
.hg-detail-poster { border-radius:16px; height:236px; overflow:hidden; position:relative; width:168px; }
.hg-detail-poster img { height:100%; object-fit:cover; width:100%; }
.hg-detail-main { min-width:0; padding-top:8px; }
.hg-detail-title-row { align-items:center; display:flex; gap:12px; }
.hg-detail-title { color:#fff; font-size:30px; font-weight:600; line-height:42px; margin:0; }
.hg-detail-hot { color:rgba(255,255,255,.45); font-size:18px; }
.hg-detail-metrics { align-items:center; display:flex; flex-wrap:wrap; gap:10px 12px; margin-top:12px; }
.hg-metric, .hg-detail-tag { align-items:center; background:rgba(255,255,255,.06); border-radius:7px; color:rgba(255,255,255,.75); display:inline-flex; font-size:14px; height:30px; padding:0 10px; }
.hg-metric.accent { background:rgba(250,119,5,.13); color:#f6932f; }
.hg-douban-rating { background:rgba(0,170,91,.12); color:#58c990; gap:7px; text-decoration:none; }
.hg-douban-rating:hover { background:rgba(0,170,91,.2); color:#78dfa7; }
.hg-douban-icon { align-items:center; background:#00a862; border-radius:4px; color:#fff; display:inline-flex; flex:none; font-size:14px; font-weight:700; height:20px; justify-content:center; line-height:1; width:20px; }
.hg-detail-summary { color:rgba(255,255,255,.7); display:-webkit-box; font-size:16px; line-height:30px; margin:18px 0 0; max-width:1040px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.hg-detail-actions { align-items:center; display:flex; gap:12px; margin-top:24px; }
.hg-play-button, .hg-secondary-button { align-items:center; border:0; border-radius:12px; display:inline-flex; font-size:18px; font-weight:500; height:50px; justify-content:center; padding:0 28px; }
.hg-play-button { background:linear-gradient(99.86deg,#ff7e0d,var(--hg-orange-2)); color:#fff; }
.hg-play-button.is-unavailable { background:rgba(255,255,255,.09); color:rgba(255,255,255,.5); cursor:not-allowed; }
.hg-play-button svg { flex:none; margin-right:9px; }
.hg-play-button:hover { filter:brightness(1.08); }
.hg-secondary-button { background:rgba(255,255,255,.07); color:#fff; }
.hg-cast { display:flex; gap:28px; margin:38px 0 34px 8px; overflow-x:auto; scrollbar-width:none; }
.hg-cast::-webkit-scrollbar { display:none; }
.hg-cast-item { align-items:center; display:flex; flex:0 0 74px; flex-direction:column; min-width:0; text-align:center; }
.hg-cast-avatar { align-items:center; background:linear-gradient(145deg,#49331f,#242525); border:1px solid rgba(255,255,255,.12); border-radius:50%; color:#fff; display:flex; font-size:20px; height:56px; justify-content:center; overflow:hidden; width:56px; }
.hg-cast-avatar img { height:100%; object-fit:cover; width:100%; }
.hg-cast-name { font-size:15px; margin-top:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%; }
.hg-cast-role { color:rgba(255,255,255,.45); font-size:12px; margin-top:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%; }
.hg-episodes { display:flex; flex-wrap:wrap; gap:16px; margin-top:24px; }
.hg-episode-source { color:rgba(255,255,255,.8); font-size:17px; font-weight:500; margin:30px 0 -8px; }
.hg-episode { align-items:center; background:#242525; border-radius:12px; display:flex; font-size:17px; height:56px; justify-content:center; min-width:56px; padding:0 14px; }
.hg-episode:hover, .hg-episode.active { background:rgba(250,119,5,.18); color:var(--hg-orange); }
.hg-detail-section { margin-top:48px; }
.hg-detail-section-head { align-items:center; display:flex; justify-content:space-between; margin-bottom:24px; }
.hg-detail-section-title { font-size:24px; font-weight:600; margin:0; }
.hg-drive-section { margin-top:38px; }
.hg-drive-group { border:1px solid rgba(255,255,255,.07); border-radius:7px; margin-top:12px; overflow:hidden; }
.hg-drive-group-head { align-items:center; border-bottom:1px solid rgba(255,255,255,.06); display:flex; justify-content:space-between; min-height:46px; padding:0 14px; }
.hg-drive-group-title { align-items:center; color:rgba(255,255,255,.82); display:flex; flex-wrap:wrap; font-size:15px; font-weight:500; gap:8px; margin:0; }
.hg-drive-group-title::before { background:var(--hg-orange); border-radius:2px; content:""; height:14px; width:2px; }
.hg-drive-head-tip { color:rgba(255,255,255,.35); font-size:12px; }
.hg-drive-warning { align-items:center; color:#e58278; display:inline-flex; font-size:12px; gap:6px; line-height:1.4; }
.hg-drive-warning-icon { align-items:center; background:#d85b53; border-radius:50%; color:#fff; display:inline-flex; flex:none; font-size:10px; font-weight:700; height:14px; justify-content:center; line-height:1; width:14px; }
.hg-drive-links { display:grid; gap:7px; padding:10px 12px; }
.hg-drive-link { align-items:center; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.04); border-radius:4px; display:flex; gap:12px; min-height:42px; padding:6px 10px; transition:background .18s; }
.hg-drive-link:hover { background:rgba(255,255,255,.075); }
.hg-drive-quality { background:rgba(255,255,255,.055); border-radius:3px; color:rgba(255,255,255,.68); flex:none; font-size:12px; line-height:24px; max-width:190px; overflow:hidden; padding:0 8px; text-overflow:ellipsis; white-space:nowrap; }
.hg-drive-url { color:rgba(255,255,255,.4); flex:1; font-size:12px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hg-drive-open { color:rgba(255,255,255,.62); flex:none; font-size:12px; white-space:nowrap; }
.hg-drive-link:hover .hg-drive-open { color:var(--hg-orange); }
.hg-section-more { background:none; border:0; color:rgba(255,255,255,.55); cursor:pointer; font-size:15px; }
.hg-section-more:hover { color:#fff; }
.hg-reviews-wrap { position:relative; }
.hg-reviews { display:flex; gap:12px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; }
.hg-reviews::-webkit-scrollbar { display:none; }
.hg-review-card { background:#252626; border-radius:12px; display:flex; flex:0 0 300px; flex-direction:column; height:170px; padding:17px 18px; }
.hg-review-date { color:rgba(255,255,255,.35); font-size:12px; }
.hg-review-content { color:rgba(255,255,255,.78); display:-webkit-box; font-size:15px; line-height:22px; margin:10px 0 12px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.hg-review-bottom { align-items:center; display:flex; gap:7px; margin-top:auto; min-width:0; }
.hg-review-avatar { align-items:center; background:#48494a; border-radius:50%; color:#ccc; display:inline-flex; flex:none; font-size:12px; height:24px; justify-content:center; overflow:hidden; width:24px; }
.hg-review-avatar img { height:100%; object-fit:cover; width:100%; }
.hg-review-name { color:rgba(255,255,255,.7); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hg-review-likes { color:rgba(255,255,255,.42); font-size:12px; margin-left:auto; white-space:nowrap; }
.hg-review-empty { align-items:center; background:#252626; border-radius:12px; color:rgba(255,255,255,.4); display:flex; flex:0 0 300px; font-size:15px; height:170px; justify-content:center; }
.hg-reviews-next { align-items:center; background:rgba(31,32,32,.92); border:1px solid rgba(255,255,255,.14); border-radius:50%; color:#fff; cursor:pointer; display:flex; font-size:34px; height:40px; justify-content:center; line-height:1; opacity:0; position:absolute; right:5px; top:50%; transform:translateY(-50%); transition:opacity .2s; width:40px; }
.hg-reviews-wrap:hover .hg-reviews-next { opacity:1; }
.hg-reviews-wrap.is-expanded .hg-reviews { flex-wrap:wrap; overflow:visible; }
.hg-reviews-wrap.is-expanded .hg-reviews-next { display:none; }
.hg-related-grid { display:grid; gap:52px 24px; grid-template-columns:repeat(6,minmax(0,1fr)); }
.hg-related-grid .hg-vod-card { height:auto; width:100%; }
.hg-related-grid .hg-vod-card:nth-child(n+13) { display:none; }
.hg-related-grid .hg-vod-cover { aspect-ratio:187/256; height:auto; }
.hg-related-grid .hg-vod-title { font-size:18px; font-weight:500; line-height:18px; margin:16px 0 12px; width:100%; }
.hg-related-grid .hg-vod-tags { margin-top:0; }
.hg-related-meta { display:none; }

/* Player */
.page-player { overflow:hidden; }
.hg-player-layout { display:grid; grid-template-columns:minmax(0,1fr) clamp(280px,28vw,420px); height:100vh; padding-top:64px; }
.page-player.is-player-side-hidden { overflow:hidden; }
.hg-player-layout.is-side-hidden { grid-template-columns:minmax(0,1fr); }
.hg-player-layout.is-side-hidden .hg-player-side { display:none; }
.hg-player-layout.is-side-hidden .hg-player-box { aspect-ratio:auto; height:100%; max-height:none; max-width:none; }
.hg-player-stage { align-items:center; background:#000; display:flex; justify-content:center; min-width:0; position:relative; }
.hg-player-breadcrumb { color:rgba(255,255,255,.55); font-size:14px; left:20px; position:absolute; top:24px; z-index:3; }
.hg-player-side-toggle { align-items:center; background:rgba(46,47,49,.6); border:0; border-radius:8px 0 0 8px; color:#fff; cursor:pointer; display:flex; height:84px; justify-content:center; padding:0; position:absolute; right:0; top:50%; transform:translateY(-50%); transition:background-color .18s ease; width:32px; z-index:6; }
.hg-player-side-toggle:hover { background:rgba(46,47,49,.92); }
.hg-player-side-toggle:focus-visible { outline:2px solid var(--hg-orange); outline-offset:2px; }
.hg-player-side-toggle-icon { align-items:center; display:flex; height:24px; justify-content:center; transition:transform .2s ease; width:24px; }
.hg-player-side-toggle-icon svg { fill:none; height:24px; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2; width:24px; }
.hg-player-layout.is-side-hidden .hg-player-side-toggle-icon { transform:rotate(180deg); }
.hg-player-side-toggle-label { clip:rect(0,0,0,0); clip-path:inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }
.hg-player-box { aspect-ratio:16/9; height:auto; max-height:100%; max-width:calc(177.7778vh - 113.7778px); position:relative; width:100%; }
.hg-player-box .MacPlayer,
.hg-player-box iframe,
.hg-player-box video,
.hg-player-box embed,
.hg-player-box object { border:0; height:100% !important; inset:0; position:absolute; width:100% !important; }
.hg-player-side { background:#151616; overflow-y:auto; padding:0 20px 32px; scrollbar-width:thin; scrollbar-color:#3c3d3d transparent; }
.hg-player-tabs { align-items:center; display:flex; gap:28px; height:74px; margin-bottom:0; }
.hg-player-tabs button { background:none; border:0; color:rgba(255,255,255,.45); cursor:pointer; font-size:20px; font-weight:600; padding:0; }
.hg-player-tabs button.active { color:#fff; }
.hg-player-info { display:grid; gap:14px; grid-template-columns:84px 1fr; }
.hg-player-poster { border-radius:10px; height:118px; object-fit:cover; width:84px; }
.hg-player-name { font-size:20px; font-weight:600; margin:4px 0 12px; }
.hg-player-tags { display:flex; flex-wrap:wrap; gap:6px; }
.hg-player-tag { background:rgba(255,255,255,.07); border-radius:4px; color:rgba(255,255,255,.64); font-size:12px; line-height:20px; padding:0 6px; }
.hg-player-side h3 { font-size:20px; font-weight:600; margin:28px 0 14px; }
.hg-player-intro-wrap { position:relative; }
.hg-player-intro { color:rgba(255,255,255,.55); display:-webkit-box; font-size:14px; line-height:25px; max-height:50px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.hg-player-intro-wrap.is-expanded .hg-player-intro { display:block; max-height:none; }
.hg-player-intro-more { background:none; border:0; color:rgba(255,255,255,.75); cursor:pointer; font-size:13px; padding:4px 0 0; }
.hg-player-cast { display:grid; gap:18px 8px; grid-template-columns:repeat(4,minmax(0,1fr)); margin:26px 0 32px; }
.hg-player-cast .hg-cast-item { flex:none; }
.hg-player-cast .hg-cast-avatar { height:64px; width:64px; }
.hg-player-cast .hg-cast-name { font-size:13px; margin-top:7px; }
.hg-player-cast .hg-cast-role { font-size:11px; margin-top:3px; }
.hg-source-tabs { display:flex; gap:18px; overflow-x:auto; scrollbar-width:none; }
.hg-source-tabs::-webkit-scrollbar, .hg-player-ranges::-webkit-scrollbar { display:none; }
.hg-source-tabs a { color:rgba(255,255,255,.5); font-size:14px; white-space:nowrap; }
.hg-source-tabs a.active { color:#fff; }
.hg-player-range-wrap { align-items:center; display:flex; margin-top:20px; }
.hg-player-ranges { display:flex; flex:1; gap:18px; min-width:0; overflow-x:auto; scrollbar-width:none; }
.hg-player-ranges button, .hg-player-range-next { background:none; border:0; color:rgba(255,255,255,.48); cursor:pointer; font-size:15px; padding:0; white-space:nowrap; }
.hg-player-ranges button.active { color:#fff; font-weight:600; }
.hg-player-range-next { font-size:25px; line-height:16px; padding-left:12px; }
.hg-player-episode-grid { display:grid; gap:12px; grid-template-columns:repeat(5,minmax(0,1fr)); margin-top:16px; }
.hg-player-episode-grid[hidden] { display:none; }
.hg-player-episode-grid a { align-items:center; background:#242525; border-radius:8px; display:flex; font-size:15px; height:66px; justify-content:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hg-player-episode-grid a.active { background:rgba(250,119,5,.18); color:var(--hg-orange); }
.hg-player-recommend { display:grid; gap:18px 8px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.hg-player-recommend a { min-width:0; }
.hg-player-recommend img { aspect-ratio:121/164; border-radius:8px; display:block; height:auto; object-fit:cover; width:100%; }
.hg-player-recommend span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hg-player-rec-name { font-size:14px; margin-top:8px; }
.hg-player-rec-meta { color:rgba(255,255,255,.46); font-size:12px; margin-top:4px; }
.hg-player-comment-stats { color:rgba(255,255,255,.7); display:flex; gap:30px; padding-top:10px; }
.hg-player-comment { display:flex; gap:10px; margin:24px 0; }
.hg-player-comment-avatar { align-items:center; background:#333; border-radius:50%; display:flex; flex:0 0 38px; height:38px; justify-content:center; overflow:hidden; width:38px; }
.hg-player-comment-avatar img { height:100%; object-fit:cover; width:100%; }
.hg-player-comment-body { flex:1; min-width:0; }
.hg-player-comment-head { align-items:center; color:rgba(255,255,255,.74); display:flex; font-size:13px; justify-content:space-between; }
.hg-player-comment-head time, .hg-player-comment-up { color:rgba(255,255,255,.38); font-size:12px; }
.hg-player-comment-body p { font-size:14px; line-height:1.7; margin:9px 0; overflow-wrap:anywhere; }
.hg-player-comment-empty { color:rgba(255,255,255,.45); padding:28px 0; text-align:center; }

@media (min-width:768px) and (max-width:1200px) {
  .hg-player-side { padding-left:16px; padding-right:16px; }
  .hg-player-cast { gap:14px 4px; }
  .hg-player-cast .hg-cast-avatar { height:50px; width:50px; }
  .hg-player-cast .hg-cast-name { font-size:12px; }
  .hg-player-episode-grid { gap:6px; }
  .hg-player-episode-grid a { font-size:11px; height:48px; }
  .hg-player-recommend { gap:14px 6px; }
  .hg-player-rec-name { font-size:12px; }
  .hg-player-rec-meta { font-size:11px; }
}

/* Modal / toast */
.hg-download-modal { align-items:center; background:rgba(0,0,0,.65); display:none; inset:0; justify-content:center; position:fixed; z-index:500; }
.hg-download-modal.is-open { display:flex; }
.hg-modal-card { background:#323333; border-radius:16px; padding:28px; position:relative; text-align:center; width:310px; }
.hg-modal-card img { height:48px; margin:0 auto 18px; max-width:180px; }
.hg-modal-title { font-size:18px; margin:0 0 10px; }
.hg-modal-copy { color:rgba(255,255,255,.55); font-size:14px; line-height:22px; margin:0; }
.hg-modal-close { background:none; border:0; cursor:pointer; font-size:24px; opacity:.5; position:absolute; right:12px; top:8px; }

@media (min-width: 1880px) {
  :root { --hg-width: calc(100vw - 640px); }
  .hg-shell, .hg-header-inner, .hg-home-content, .hg-footer, .hg-catalog, .hg-detail { max-width:1720px; }
  .hg-related-grid { gap:52px 32px; grid-template-columns:repeat(8,minmax(0,1fr)); }
  .hg-related-grid .hg-vod-card:nth-child(n+13) { display:block; }
  .hg-related-grid .hg-vod-card:nth-child(n+17) { display:none; }
}

@media (max-width: 767px) {
  :root { --hg-width: 100%; }
  .hg-header { height:62px; }
  .hg-header::before { background:linear-gradient(0deg,rgba(24,26,26,.94),#181a1a); }
  .page-home .hg-header::before { background:linear-gradient(180deg,rgba(8,9,9,.92),rgba(8,9,9,.68)); opacity:1; }
  .hg-header-inner { height:62px; padding:12px 16px; width:100%; }
  .hg-logo { flex-basis:92px; height:22px; margin-right:auto; width:92px; }
  .hg-logo img { height:22px; width:92px; }
  .hg-nav { gap:20px; height:auto; margin-left:auto; }
  .hg-nav-link { font-size:16px; height:auto; margin:0; opacity:.58; }
  .hg-nav-link.nav-download { display:none; }
  .hg-search { display:none; }
  .hg-mobile-search-button { color:rgba(255,255,255,.68); display:flex; height:28px; margin-left:18px; padding:0; width:28px; }
  .hg-mobile-search-panel { background:rgba(19,20,20,.98); display:none; left:0; padding:10px 16px; position:fixed; right:0; top:62px; z-index:99; }
  .hg-mobile-search-panel.is-open { display:block; }
  .hg-mobile-search-panel form { align-items:center; background:rgba(255,255,255,.08); border-radius:10px; display:flex; height:42px; overflow:hidden; }
  .hg-mobile-search-panel input { background:none; border:0; color:#fff; flex:1; height:42px; outline:0; padding:0 14px; }
  .hg-mobile-search-panel button { background:none; border:0; color:#fff; height:42px; padding:0 16px; }
  .hg-desktop-hero { display:none; }
  .hg-mobile-hero { display:block; height:720px; overflow:hidden; position:relative; }
  .hg-mobile-hero-track { display:flex; height:720px; transition:transform .55s cubic-bezier(.22,1,.36,1); width:100%; }
  .hg-mobile-slide { flex:0 0 100%; height:720px; overflow:hidden; position:relative; width:100%; }
  .hg-mobile-slide > img { height:100%; object-fit:cover; width:100%; }
  .hg-mobile-slide::after { background:linear-gradient(180deg,rgba(19,20,20,0) 38%,rgba(19,20,20,.62) 70%,var(--hg-bg) 94%); content:""; inset:0; position:absolute; }
  .hg-mobile-copy { bottom:92px; left:20px; max-width:calc(100% - 40px); position:absolute; z-index:3; }
  .hg-mobile-title { color:#fff; font-size:36px; font-weight:700; line-height:1.05; margin:0 0 18px; max-width:260px; text-shadow:0 3px 12px rgba(0,0,0,.35); }
  .hg-mobile-desc { color:rgba(255,255,255,.7); font-size:12px; margin:14px 0 0; max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .hg-mobile-indicators { align-items:center; bottom:72px; display:flex; gap:8px; left:20px; position:absolute; z-index:5; }
  .hg-mobile-indicator { background:rgba(255,255,255,.2); border:0; border-radius:50%; height:7px; padding:0; width:7px; }
  .hg-mobile-indicator.active { background:#fff; height:9px; width:9px; }
  .hg-home-content { margin:0; padding:0 16px; width:100%; }
  .hg-section { margin-bottom:24px; }
  .hg-section-head { height:22px; margin-bottom:16px; }
  .hg-section-title { font-size:16px; font-weight:500; line-height:22px; }
  .hg-section-title svg { height:16px; width:16px; }
  .hg-rail { gap:12px; margin:0 -16px; padding:0 16px; scroll-snap-type:x proximity; }
  .hg-vod-card { flex-basis:calc((100vw - 56px)/3); height:219px; scroll-snap-align:start; width:calc((100vw - 56px)/3); }
  .hg-vod-cover { border-radius:8px; height:165px; }
  .hg-vod-episode { bottom:10px; font-size:12px; font-weight:500; right:9px; }
  .hg-vod-title { font-size:14px; font-weight:500; line-height:20px; margin-top:8px; width:100%; }
  .hg-vod-tags { gap:6px; height:22px; margin-top:4px; }
  .hg-vod-tag { border-radius:4px; font-size:12px; line-height:16px; max-width:62px; padding:3px 4px; }
  .hg-card-view-all, .hg-rail-mask, .hg-rail-arrow, .hg-morph-arrow { display:none; }
  .hg-footer { margin-top:48px; padding:0 16px 110px; width:100%; }
  .hg-footer-inner { min-height:0; padding:16px 0 24px; }
  .hg-footer p { font-size:10px; letter-spacing:0; line-height:20px; }
  .hg-footer-logo { margin-top:12px; width:90px; }
  .hg-mobile-download {
    align-items:center;
    background:linear-gradient(180deg,rgba(19,20,20,0),rgba(19,20,20,.8) 35%,var(--hg-bg) 70%);
    bottom:0;
    display:flex;
    height:116px;
    justify-content:center;
    left:0;
    padding-bottom:28px;
    position:fixed;
    right:0;
    z-index:90;
  }
  .hg-mobile-download .hg-download-button { border-radius:12px; font-size:14px; height:44px; margin:0; max-width:calc(100vw - 48px); min-width:0; overflow:hidden; padding:0 14px; white-space:nowrap; width:300px; }
  .hg-catalog { padding:90px 16px 130px; width:100%; }
  .hg-category-tabs { gap:24px; margin-bottom:14px; overflow-x:auto; }
  .hg-category-tabs a { font-size:19px; flex:0 0 auto; }
  .page-catalog .hg-header { display:block; }
  .page-catalog .hg-catalog { padding-top:78px; }
  .page-catalog .hg-category-tabs { gap:26px; margin-bottom:14px; min-height:40px; }
  .page-catalog .hg-category-tabs a { line-height:40px; }
  .hg-filter-row { flex-wrap:nowrap; gap:22px; margin:0 -16px 8px; overflow-x:auto; padding:0 16px; }
  .page-catalog .hg-filter-row { column-gap:22px; }
  .hg-filter-row a { flex:0 0 auto; font-size:14px; line-height:34px; }
  .hg-catalog-grid { gap:28px 12px; grid-template-columns:repeat(3,1fr); margin-top:22px; }
  .hg-catalog-grid .hg-vod-card { height:auto; width:100%; }
  .hg-catalog-grid .hg-vod-cover { height:auto; aspect-ratio:118/165; }
  .hg-catalog-grid .hg-vod-title { font-size:14px; margin-top:8px; }
  .page-catalog .hg-catalog-grid { gap:16px 8px; margin-top:12px; }
  .page-catalog .hg-catalog-grid .hg-vod-cover { aspect-ratio:114/159; }
  .page-catalog .hg-catalog-grid .hg-vod-title { line-height:20px; margin:8px 0 4px; }
  .page-catalog .hg-catalog-grid .hg-vod-tags { margin-top:0; }
  .hg-search-title { font-size:22px; margin-bottom:20px; }
  .hg-pagination { flex-wrap:wrap; margin-top:36px; }
  .hg-detail { padding:90px 16px 130px; width:100%; }
  .hg-detail-hero { gap:16px; grid-template-columns:104px 1fr; }
  .hg-detail-poster { border-radius:10px; height:146px; width:104px; }
  .hg-detail-main { padding:0; }
  .hg-detail-title { font-size:22px; line-height:30px; }
  .hg-detail-hot { font-size:13px; }
  .hg-detail-metrics { gap:6px; margin-top:8px; }
  .hg-metric, .hg-detail-tag { font-size:11px; height:24px; padding:0 7px; }
  .hg-detail-summary { font-size:13px; line-height:21px; margin-top:12px; }
  .hg-detail-actions { margin-top:14px; }
  .hg-play-button, .hg-secondary-button { border-radius:9px; font-size:14px; height:42px; padding:0 16px; }
  .hg-secondary-button { display:none; }
  .hg-cast { gap:18px; margin:28px 0; }
  .hg-cast-item { flex-basis:64px; }
  .hg-cast-avatar { height:48px; width:48px; }
  .hg-episodes { gap:10px; }
  .hg-episode { border-radius:8px; font-size:14px; height:44px; min-width:44px; }
  .hg-detail-section { margin-top:36px; }
  .hg-detail-section-title { font-size:19px; }
  .hg-drive-section { margin-top:28px; }
  .hg-drive-group-head { align-items:flex-start; flex-direction:column; gap:2px; justify-content:center; min-height:48px; padding:7px 11px; }
  .hg-drive-group-title { font-size:14px; }
  .hg-drive-head-tip { font-size:10px; }
  .hg-drive-warning { font-size:10px; }
  .hg-drive-warning-icon { height:12px; width:12px; }
  .hg-drive-links { padding:8px; }
  .hg-drive-link { gap:8px; min-height:39px; padding:5px 8px; }
  .hg-drive-quality { font-size:11px; line-height:22px; max-width:130px; }
  .hg-drive-url { font-size:11px; }
  .hg-drive-open { font-size:11px; }
  .hg-review-card { flex-basis:286px; }
  .hg-reviews-next { display:none; }
  .hg-related-grid { display:grid; gap:16px 8px; grid-template-columns:repeat(3,minmax(0,1fr)); overflow:visible; }
  .hg-related-grid .hg-vod-card { display:block; height:auto; width:100%; }
  .hg-related-grid .hg-vod-card:nth-child(n+7) { display:none; }
  .hg-related-grid .hg-vod-cover { aspect-ratio:114/159; height:auto; }
  .hg-related-grid .hg-vod-episode, .hg-related-grid .hg-vod-tags { display:none; }
  .hg-related-grid .hg-vod-title { font-size:14px; font-weight:500; line-height:20px; margin:8px 0 4px; }
  .hg-related-meta { color:rgba(255,255,255,.46); display:block; font-size:11px; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .page-player { overflow:auto; }
  .hg-player-layout { display:block; height:auto; min-height:100vh; padding-top:62px; }
  .hg-player-stage { height:56.25vw; }
  .hg-player-side-toggle { height:64px; width:28px; }
  .hg-player-side-toggle-icon, .hg-player-side-toggle-icon svg { height:20px; width:20px; }
  .hg-player-breadcrumb { display:none; }
  .hg-player-box { height:100%; max-width:none; }
  .hg-player-side { overflow:visible; padding:0 16px 130px; }
  .hg-player-info { grid-template-columns:72px 1fr; }
  .hg-player-poster { height:100px; width:72px; }
  .hg-player-cast { gap:16px 4px; }
  .hg-player-cast .hg-cast-avatar { height:52px; width:52px; }
  .hg-player-episode-grid { grid-template-columns:repeat(5,1fr); }
  .hg-player-episode-grid a { height:52px; }
}

@media (min-width:768px) { .hg-mobile-download { display:none; } }

/* Rank: a dedicated list layout, separate from the catalog filters. */
.page-rank .nav-rank { opacity:.9; }
.hg-rank-hero { height:254px; overflow:hidden; position:relative; }
.hg-rank-hero picture, .hg-rank-hero picture img { display:block; height:100%; width:100%; }
.hg-rank-hero picture { inset:0; position:absolute; }
.hg-rank-hero picture img { object-fit:cover; }
.hg-rank-hero-inner { margin:0 auto; max-width:1720px; padding-top:140px; position:relative; width:var(--hg-width); }
.hg-rank-hero h1 { align-items:center; color:#fff; display:flex; font-size:32px; font-weight:600; gap:5px; line-height:45px; margin:0; }
.hg-rank-wreath { color:#fff; display:inline-block; font-size:28px; font-weight:400; transform:rotate(-50deg); }
.hg-rank-wreath.is-right { transform:scaleX(-1) rotate(-50deg); }
.hg-rank-hero p { color:rgba(255,255,255,.5); font-size:14px; line-height:20px; margin:12px 0 0; }
.hg-rank-main { margin:0 auto; max-width:1720px; padding:36px 0 90px; width:var(--hg-width); }
.hg-rank-tabs { align-items:center; display:flex; gap:40px; margin-bottom:40px; overflow-x:auto; scrollbar-width:none; white-space:nowrap; }
.hg-rank-tabs::-webkit-scrollbar { display:none; }
.hg-rank-tabs a { color:rgba(255,255,255,.42); font-size:24px; font-weight:500; line-height:34px; transition:color .2s; }
.hg-rank-tabs a.active, .hg-rank-tabs a:hover { color:rgba(255,255,255,.92); }
.hg-rank-list { display:flex; flex-direction:column; gap:48px; list-style:none; margin:0; padding:0; }
.hg-rank-card { display:grid; gap:32px; grid-template-columns:160px minmax(0,1fr); min-height:224px; }
.hg-rank-cover { border-radius:10px; display:block; height:224px; overflow:hidden; position:relative; width:160px; }
.hg-rank-cover img { height:100%; object-fit:cover; width:100%; }
.hg-rank-number { align-items:center; background:linear-gradient(135deg,#ffd25f,#f3970b); border-radius:0 0 8px 0; color:#fff; display:flex; font-size:16px; font-weight:700; height:28px; justify-content:center; left:0; min-width:25px; padding:0 5px; position:absolute; top:0; }
.hg-rank-item:nth-child(n+4) .hg-rank-number { background:rgba(255,255,255,.55); }
.hg-rank-info { display:flex; flex-direction:column; min-width:0; }
.hg-rank-heading { align-items:baseline; display:flex; gap:8px; min-height:28px; }
.hg-rank-heading a { min-width:0; }
.hg-rank-heading h2 { color:rgba(255,255,255,.9); font-size:20px; font-weight:600; line-height:28px; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hg-rank-heading a:hover h2 { color:#fff; }
.hg-rank-heat { color:rgba(255,255,255,.36); flex:0 0 auto; font-size:14px; line-height:22px; }
.hg-rank-metrics { display:flex; gap:8px; margin-top:10px; }
.hg-rank-metrics span { background:rgba(185,132,70,.13); border-radius:3px; color:#b49370; font-size:12px; line-height:24px; padding:0 8px; }
.hg-rank-metrics .score { color:#d99253; }
.hg-rank-tags { color:rgba(255,255,255,.42); display:flex; font-size:14px; gap:5px; line-height:20px; margin-top:12px; }
.hg-rank-tags span:not(:last-child)::after { color:rgba(255,255,255,.35); content:'·'; margin-left:5px; }
.hg-rank-description { color:rgba(255,255,255,.42); display:-webkit-box; font-size:14px; line-height:24px; margin:8px 0 0; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.hg-rank-actions { align-items:flex-start; display:flex; gap:12px; margin-top:auto; padding-top:18px; }
.hg-rank-play, .hg-rank-episodes a, .hg-rank-more { align-items:center; background:#292a2a; border:0; border-radius:10px; color:rgba(255,255,255,.9); display:flex; flex:0 0 auto; height:46px; justify-content:center; }
.hg-rank-play { font-size:16px; gap:10px; width:168px; }
.hg-rank-play span { font-size:14px; }
.hg-rank-play:hover, .hg-rank-episodes a:hover, .hg-rank-more:hover { background:#3b3c3c; }
.hg-rank-episode-box { display:flex; flex:1; gap:12px; min-width:0; }
.hg-rank-episodes { display:flex; flex:1; flex-wrap:wrap; gap:12px; min-width:0; }
.hg-rank-episodes a { font-size:16px; width:46px; }
.hg-rank-episodes .is-extra { display:none; }
.hg-rank-episode-box.is-expanded .is-extra { display:flex; }
.hg-rank-more { cursor:pointer; font-size:22px; width:46px; }
.hg-rank-episode-box.is-expanded .hg-rank-more { align-self:flex-start; transform:rotate(180deg); }
.hg-rank-pagination { align-items:center; display:flex; gap:10px; justify-content:center; margin-top:56px; }
.hg-rank-pagination a, .hg-rank-pagination span { align-items:center; background:#292a2a; border-radius:8px; color:rgba(255,255,255,.7); display:flex; height:40px; justify-content:center; min-width:40px; padding:0 10px; }
.hg-rank-pagination .active, .hg-rank-pagination a:hover { background:#fa7705; color:#fff; }

@media (max-width:767px) {
  .hg-rank-hero { height:220px; }
  .hg-rank-hero-inner { padding:118px 16px 0; width:100%; }
  .hg-rank-hero h1 { font-size:24px; line-height:32px; }
  .hg-rank-wreath { font-size:21px; }
  .hg-rank-hero p { font-size:11px; margin-top:8px; }
  .hg-rank-main { padding:22px 16px 100px; width:100%; }
  .hg-rank-tabs { gap:24px; margin:0 -16px 28px; padding:0 16px; }
  .hg-rank-tabs a { font-size:17px; line-height:28px; }
  .hg-rank-list { gap:28px; }
  .hg-rank-card { gap:12px; grid-template-columns:100px minmax(0,1fr); min-height:140px; }
  .hg-rank-cover { border-radius:7px; height:140px; width:100px; }
  .hg-rank-number { font-size:13px; height:23px; min-width:22px; }
  .hg-rank-heading { align-items:flex-start; display:block; min-height:0; }
  .hg-rank-heading h2 { font-size:16px; line-height:22px; }
  .hg-rank-heat { font-size:11px; line-height:19px; }
  .hg-rank-metrics { gap:4px; margin-top:4px; overflow:hidden; }
  .hg-rank-metrics span { font-size:10px; line-height:20px; padding:0 4px; white-space:nowrap; }
  .hg-rank-tags { font-size:11px; line-height:18px; margin-top:5px; overflow:hidden; white-space:nowrap; }
  .hg-rank-description { font-size:11px; line-height:17px; margin-top:4px; -webkit-line-clamp:2; }
  .hg-rank-actions { display:none; }
  .hg-rank-pagination { flex-wrap:wrap; gap:6px; margin-top:36px; }
  .hg-rank-pagination a, .hg-rank-pagination span { height:34px; min-width:34px; }
}
