/* 播放与旧详情专属PC基线：1920稿按--hg-pc-unit同比，1024以上保留同一版式。
   基础选择器对齐common.css的播放组件，避免旧1199断点重新塌成单栏。
   此文件仅由播放/旧详情模板引入，不影响H5和其他页面。 */
:root{--hg-web-unit:1px;--hg-web-text-unit:1px;--hg-web-aux-min:0px}
@media (min-width:1024px){
  :root{--hg-web-unit:var(--hg-pc-unit,calc(100vw / 1920));--hg-web-text-unit:var(--hg-text-unit,max(.875px,var(--hg-web-unit)));--hg-web-aux-min:12px}
/* 原生SDK常规控制条仅覆盖尺寸，颜色/显隐/顺序继续由SDK和页内规则控制。
   先恢复1920下的基础尺寸，再与主画面同比，避免窄PC只有外框缩小而控件仍48px。 */
#cyberPlayer .xg-margin,#cyberPlayer xg-icon{margin-left:calc(16 * var(--hg-web-unit));margin-right:calc(16 * var(--hg-web-unit))}
#cyberPlayer xg-icon{height:calc(40 * var(--hg-web-unit))}
#cyberPlayer xg-icon .xgplayer-icon>svg[width="28"]{width:calc(28 * var(--hg-web-unit));height:calc(40 * var(--hg-web-unit))}
#cyberPlayer xg-icon .xgplayer-icon>svg[width="31"]{width:calc(31 * var(--hg-web-unit));height:calc(40 * var(--hg-web-unit))}
#cyberPlayer .xgplayer-fullscreen .xgplayer-icon>img{width:calc(18 * var(--hg-web-unit));height:calc(18 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .btn-text{height:calc(24 * var(--hg-web-unit));font-size:max(12px,calc(13 * var(--hg-web-text-unit)))}
:where(#cyberPlayer).xgplayer .btn-text span{min-width:calc(52 * var(--hg-web-unit));height:calc(24 * var(--hg-web-unit));line-height:calc(24 * var(--hg-web-text-unit));border-top-left-radius:calc(12 * var(--hg-web-unit));border-top-right-radius:calc(12 * var(--hg-web-unit));border-bottom-right-radius:calc(12 * var(--hg-web-unit));border-bottom-left-radius:calc(12 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-options-list{width:calc(78 * var(--hg-web-unit));border-top-left-radius:calc(1 * var(--hg-web-unit));border-top-right-radius:calc(1 * var(--hg-web-unit));border-bottom-right-radius:calc(1 * var(--hg-web-unit));border-bottom-left-radius:calc(1 * var(--hg-web-unit));font-size:max(14px,calc(14 * var(--hg-web-text-unit)))}
:where(#cyberPlayer).xgplayer .xg-options-list li{height:calc(20 * var(--hg-web-unit));line-height:calc(20 * var(--hg-web-text-unit));padding-top:calc(4 * var(--hg-web-unit));padding-bottom:calc(4 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-options-list li:nth-child(1){margin-top:calc(12 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-options-list li:last-child{margin-bottom:calc(12 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-options-list.xg-side-list li:nth-child(1){margin-top:calc(20 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-options-list.xg-side-list li:last-child{margin-bottom:calc(20 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-controls{height:calc(48 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-inner-controls{height:calc(40 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xg-center-grid{top:calc(-20 * var(--hg-web-unit));padding-top:calc(5 * var(--hg-web-unit));padding-bottom:calc(5 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .flex-controls .xg-inner-controls{bottom:calc(8 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .flex-controls .xg-center-grid{padding-right:calc(16 * var(--hg-web-unit));padding-left:calc(16 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .bottom-controls .xg-center-grid{top:calc(20 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .bottom-controls .xg-left-grid,:where(#cyberPlayer).xgplayer .bottom-controls .xg-right-grid{bottom:calc(10 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .mini-controls .xg-center-grid{bottom:calc(-28 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .controls-follow{bottom:calc(70 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.flex-controls .controls-follow{bottom:calc(45 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.mini-controls .controls-follow,:where(#cyberPlayer).xgplayer.no-controls .controls-follow,:where(#cyberPlayer).xgplayer.xgplayer-inactive .controls-follow{bottom:calc(10 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress{min-width:calc(10 * var(--hg-web-unit));height:calc(20 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-outer{height:calc(2 * var(--hg-web-unit));border-top-left-radius:calc(3 * var(--hg-web-unit));border-top-right-radius:calc(3 * var(--hg-web-unit));border-bottom-right-radius:calc(3 * var(--hg-web-unit));border-bottom-left-radius:calc(3 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-inner{margin-right:calc(2 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-btn{border-top-width:calc(0.5 * var(--hg-web-unit));border-right-width:calc(0.5 * var(--hg-web-unit));border-bottom-width:calc(0.5 * var(--hg-web-unit));border-left-width:calc(0.5 * var(--hg-web-unit));box-shadow:rgba(255, 0, 0, 0.384) 0 0 calc(1 * var(--hg-web-unit));width:calc(20 * var(--hg-web-unit));height:calc(20 * var(--hg-web-unit));border-top-left-radius:calc(30 * var(--hg-web-unit));border-top-right-radius:calc(30 * var(--hg-web-unit));border-bottom-right-radius:calc(30 * var(--hg-web-unit));border-bottom-left-radius:calc(30 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-btn::before{width:calc(12 * var(--hg-web-unit));height:calc(12 * var(--hg-web-unit));border-top-left-radius:calc(30 * var(--hg-web-unit));border-top-right-radius:calc(30 * var(--hg-web-unit));border-bottom-right-radius:calc(30 * var(--hg-web-unit));border-bottom-left-radius:calc(30 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-btn.active{border-top-width:calc(4 * var(--hg-web-unit));border-right-width:calc(4 * var(--hg-web-unit));border-bottom-width:calc(4 * var(--hg-web-unit));border-left-width:calc(4 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-btn.active::before{box-shadow:rgba(248, 89, 89, 0.69) 0 0 calc(3 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-dot{width:calc(5 * var(--hg-web-unit));border-top-left-radius:calc(6 * var(--hg-web-unit));border-top-right-radius:calc(6 * var(--hg-web-unit));border-bottom-right-radius:calc(6 * var(--hg-web-unit));border-bottom-left-radius:calc(6 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-dot .xgplayer-progress-tip{top:calc(-40 * var(--hg-web-unit));line-height:calc(30 * var(--hg-web-text-unit));border-top-left-radius:calc(6 * var(--hg-web-unit));border-top-right-radius:calc(6 * var(--hg-web-unit));border-bottom-right-radius:calc(6 * var(--hg-web-unit));border-bottom-left-radius:calc(6 * var(--hg-web-unit));border-top-width:calc(1 * var(--hg-web-unit));border-right-width:calc(1 * var(--hg-web-unit));border-bottom-width:calc(1 * var(--hg-web-unit));border-left-width:calc(1 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.xgplayer-pc .xgplayer-progress-outer{height:calc(3 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.xgplayer-pc .xgplayer-progress-inner{margin-right:calc(4 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.xgplayer-pc .xgplayer-progress.active .xgplayer-progress-outer{height:calc(6 * var(--hg-web-unit));margin-bottom:calc(3 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer.xgplayer-pc .xgplayer-progress.active .inner-focus-point::after,:where(#cyberPlayer).xgplayer.xgplayer-pc .xgplayer-progress.active .inner-focus-point::before{width:calc(6 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-bottom .xgplayer-progress-outer{top:calc(9 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-bottom .xgplayer-progress-btn::before{height:calc(6 * var(--hg-web-unit));width:calc(6 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-time{min-width:calc(40 * var(--hg-web-unit));font-size:max(14px,calc(14 * var(--hg-web-text-unit)));line-height:calc(40 * var(--hg-web-text-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-time span{line-height:calc(40 * var(--hg-web-text-unit));height:calc(40 * var(--hg-web-unit))}
:where(#cyberPlayer).xgplayer .xgplayer-progress-point{bottom:calc(-4 * var(--hg-web-unit));font-size:max(var(--hg-web-aux-min,0px),calc(11 * var(--hg-web-text-unit)));padding-top:calc(4 * var(--hg-web-unit));padding-right:calc(6 * var(--hg-web-unit));padding-bottom:calc(4 * var(--hg-web-unit));padding-left:calc(6 * var(--hg-web-unit));border-top-left-radius:calc(4 * var(--hg-web-unit));border-top-right-radius:calc(4 * var(--hg-web-unit));border-bottom-right-radius:calc(4 * var(--hg-web-unit));border-bottom-left-radius:calc(4 * var(--hg-web-unit))}

.hg-web-detail__ep-grid a[hidden], .hg-web-play__ep[hidden]{display: none !important;}
 .hg-web-detail__ep-grid a{height: calc(44 * var(--hg-web-unit)); align-items: center; justify-content: center; text-decoration: none;}
 .hg-web-detail{padding: calc(24 * var(--hg-web-unit)) var(--hg-page-gutter) calc(48 * var(--hg-web-unit));}
.hg-web-detail__hero{gap: calc(28 * var(--hg-web-unit));}
.hg-web-detail__episodes, .hg-web-detail__hero{display: flex; padding: calc(32 * var(--hg-web-unit)); border-radius: calc(20 * var(--hg-web-unit)); background: rgb(22, 22, 22); margin-top: calc(16 * var(--hg-web-unit));}
.hg-web-detail__poster{position: relative; width: calc(190 * var(--hg-web-unit)); flex-shrink: 0;}
.hg-web-detail__poster img{width: calc(190 * var(--hg-web-unit)); height: calc(285 * var(--hg-web-unit)); object-fit: cover; border-radius: calc(12 * var(--hg-web-unit)); display: block;}
.hg-web-detail__badge{position: absolute; left: calc(10 * var(--hg-web-unit)); top: calc(10 * var(--hg-web-unit)); height: calc(19 * var(--hg-web-unit)); padding: 0 calc(8 * var(--hg-web-unit)); border-radius: calc(4 * var(--hg-web-unit)); background: var(--color-primary); color: rgb(17, 17, 17); font-size:max(var(--hg-web-aux-min,0px),calc(11 * var(--hg-web-text-unit))); font-weight: 600; display: inline-flex; align-items: center;}
.hg-web-detail__info{flex: 1 1 0%; min-width: 0;}
.hg-web-detail__author, .hg-web-detail__meta{display: flex; align-items: center; gap: calc(10 * var(--hg-web-unit)); margin-bottom: calc(12 * var(--hg-web-unit));}
.hg-web-detail__author img{width: calc(34 * var(--hg-web-unit)); height: calc(34 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); object-fit: cover;}
.hg-web-detail__author span{display: block; font-size:max(12px,calc(12 * var(--hg-web-text-unit))); color: rgba(255, 255, 255, 0.45);}
.hg-web-detail__author strong{font-size:max(14px,calc(14 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-detail__info h1{margin: 0 0 calc(12 * var(--hg-web-unit)); font-size:max(14px,calc(36 * var(--hg-web-text-unit))); line-height: 1.2; color: rgb(255, 255, 255);}
.hg-web-detail__meta{flex-wrap: wrap; gap: calc(12 * var(--hg-web-unit)); margin-bottom: calc(14 * var(--hg-web-unit)); color: rgba(255, 255, 255, 0.65); font-size:max(14px,calc(14 * var(--hg-web-text-unit)));}
.hg-web-detail__score{color: var(--color-primary); font-weight: 700;}
.hg-web-detail__score em{font-style: normal; font-size:max(14px,calc(22 * var(--hg-web-text-unit)));}
.hg-web-detail__desc{margin: 0 0 calc(16 * var(--hg-web-unit)); color: rgba(255, 255, 255, 0.78); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); line-height: 1.6;}
.hg-web-detail__expand{border: 0; background: 0 0; color: var(--color-primary); cursor: pointer; padding: 0; margin-left: calc(4 * var(--hg-web-unit));}
.hg-web-detail__tags{display: flex; flex-wrap: wrap; gap: calc(8 * var(--hg-web-unit)); margin-bottom: calc(20 * var(--hg-web-unit));}
.hg-web-detail__actions{display: flex; gap: calc(12 * var(--hg-web-unit));}
.hg-web-detail__play, .hg-web-detail__share{display: inline-flex; align-items: center; gap: calc(8 * var(--hg-web-unit)); height: calc(44 * var(--hg-web-unit)); padding: 0 calc(22 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 600; text-decoration: none; border: 0; cursor: pointer;}
.hg-web-detail__play{background: var(--color-primary); color: rgb(17, 17, 17);}
.hg-web-detail__share{background: rgba(255, 255, 255, 0.08); color: rgb(255, 255, 255);}
.hg-web-detail__episodes{flex-direction: column; gap: calc(18 * var(--hg-web-unit));}
.hg-web-detail__ep-head{display: flex; align-items: flex-start; justify-content: space-between; gap: calc(16 * var(--hg-web-unit));}
.hg-web-detail__ep-head h2{margin: 0; font-size:max(14px,calc(20 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-detail__ep-head p{margin: calc(6 * var(--hg-web-unit)) 0 0; color: rgba(255, 255, 255, 0.5); font-size:max(12px,calc(13 * var(--hg-web-text-unit)));}
.hg-web-detail__ep-tip{color: var(--color-primary); font-size:max(12px,calc(13 * var(--hg-web-text-unit))); text-decoration: none; white-space: nowrap;}
.hg-web-detail__ep-tabs{display: flex; gap: calc(12 * var(--hg-web-unit));}
.hg-web-detail__ep-tabs button{height: calc(33 * var(--hg-web-unit)); padding: 0 calc(20 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); border: 0; background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.75); cursor: pointer;}
.hg-web-detail__ep-grid a.is-active, .hg-web-detail__ep-grid a:hover, .hg-web-detail__ep-tabs button.is-active{background: var(--color-primary); color: rgb(17, 17, 17); font-weight: 600;}
.hg-web-detail__ep-grid{display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: calc(10 * var(--hg-web-unit));}
.hg-web-detail__ep-grid a{display: flex; border-radius: calc(10 * var(--hg-web-unit)); background: rgba(255, 255, 255, 0.06); color: rgb(255, 255, 255); font-size:max(14px,calc(14 * var(--hg-web-text-unit)));}
.hg-web-detail__related{margin-top: calc(36 * var(--hg-web-unit));}
.hg-web-detail__related h2{margin: 0 0 calc(16 * var(--hg-web-unit)); font-size:max(14px,calc(24 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
 .hg-web-play__pl-item.is-active .hg-web-play__pl-status{color: var(--color-primary);}
.hg-web-play{padding: calc(24 * var(--hg-web-unit)) var(--hg-page-gutter) calc(48 * var(--hg-web-unit));}
.hg-web-play__main{display: grid; grid-template-columns: minmax(0, 1fr) calc(380 * var(--hg-web-unit)); gap: calc(24 * var(--hg-web-unit)); margin-top: calc(16 * var(--hg-web-unit)); align-items: start;}
.hg-web-play__left{display: flex; flex-direction: column; gap: calc(16 * var(--hg-web-unit)); min-width: 0;}
.hg-web-play__intro{display: flex; align-items: center; justify-content: space-between; gap: calc(12 * var(--hg-web-unit)); padding: calc(12 * var(--hg-web-unit)) calc(20 * var(--hg-web-unit)); border-radius: calc(10 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgb(34, 34, 42); background: rgb(22, 22, 22);}
.hg-web-play__intro-text{display: flex; gap: calc(12 * var(--hg-web-unit)); min-width: 0; flex: 1 1 0%;}
.hg-web-play__intro-text strong{flex-shrink: 0; font-size:max(14px,calc(14 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__intro-text p, .hg-web-play__pl-body strong{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.hg-web-play__intro-text p{margin: 0; font-size:max(12px,calc(13 * var(--hg-web-text-unit))); color: rgb(138, 138, 147);}
.hg-web-play__intro.is-expanded .hg-web-play__intro-text p{white-space: normal;}
.hg-web-play__expand{display: inline-flex; align-items: center; gap: calc(4 * var(--hg-web-unit)); flex-shrink: 0; border: 0; background: 0 0; color: var(--color-primary); font-size:max(12px,calc(13 * var(--hg-web-text-unit))); cursor: pointer;}
.hg-web-play__expand img{width: calc(12 * var(--hg-web-unit)); height: calc(12 * var(--hg-web-unit)); transform: rotate(90deg); transition: transform 0.2s;}
.hg-web-play__intro.is-expanded .hg-web-play__expand img{transform: rotate(-90deg);}
.hg-web-play__viewport{position: relative; width: 100%; aspect-ratio: 1250 / 440; border-radius: calc(12 * var(--hg-web-unit)); overflow: hidden; background: rgb(0, 0, 0);}
.hg-web-play__cover{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;}
.hg-web-play__center{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: calc(72 * var(--hg-web-unit)); height: calc(72 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgba(255, 255, 255, 0.25); background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2;}
.hg-web-play__center img{width: calc(28 * var(--hg-web-unit)); height: calc(28 * var(--hg-web-unit)); display: block;}
.hg-web-play__center.is-playing{opacity: 0; pointer-events: none;}
.hg-web-play__ctrl{position: absolute; left: 0; right: 0; bottom: 0; padding: calc(20 * var(--hg-web-unit)); display: flex; flex-direction: column; gap: calc(16 * var(--hg-web-unit)); background: linear-gradient(transparent, rgba(0, 0, 0, 0.8)); z-index: 2;}
.hg-web-play__progress{position: relative; height: calc(4 * var(--hg-web-unit)); border-radius: calc(2 * var(--hg-web-unit)); background: rgba(255, 255, 255, 0.25); cursor: pointer;}
.hg-web-play__progress-fill{display: block; height: 100%; border-radius: calc(2 * var(--hg-web-unit)); background: var(--color-primary);}
.hg-web-play__progress-dot{position: absolute; top: 50%; width: calc(10 * var(--hg-web-unit)); height: calc(10 * var(--hg-web-unit)); margin-left: calc(-5 * var(--hg-web-unit)); margin-top: calc(-5 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); background: var(--color-primary);}
.hg-web-play__ctrl-row{display: flex; align-items: center; justify-content: space-between; gap: calc(16 * var(--hg-web-unit));}
.hg-web-play__ctrl-left, .hg-web-play__ctrl-right{display: flex; align-items: center; gap: calc(20 * var(--hg-web-unit));}
.hg-web-play__ctrl-btn, .hg-web-play__speed{border: 0; background: 0 0; color: rgb(255, 255, 255); cursor: pointer; padding: 0; font-size:max(14px,calc(14 * var(--hg-web-text-unit))); line-height: 1;}
.hg-web-play__ctrl-btn img, .hg-web-play__speed img{width: calc(18 * var(--hg-web-unit)); height: calc(18 * var(--hg-web-unit)); display: block;}
.hg-web-play__time{font-size:max(12px,calc(13 * var(--hg-web-text-unit))); color: rgba(255, 255, 255, 0.85);}
.hg-web-play__actions{display: flex; gap: calc(12 * var(--hg-web-unit));}
.hg-web-play__action{flex: 1 1 0%; display: inline-flex; align-items: center; justify-content: center; gap: calc(8 * var(--hg-web-unit)); min-height: calc(48 * var(--hg-web-unit)); padding: calc(14 * var(--hg-web-unit)) calc(16 * var(--hg-web-unit)); border-radius: calc(8 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgb(34, 34, 42); background: rgb(22, 22, 22); color: rgb(255, 255, 255); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 500; cursor: pointer; text-decoration: none;}
.hg-web-play__action img{width: calc(16 * var(--hg-web-unit)); height: calc(16 * var(--hg-web-unit)); display: block;}
.hg-web-play__action--immersive{background: var(--color-primary); color: rgb(0, 0, 0); border-color: rgb(34, 34, 42);}
.hg-web-play__side{border-radius: calc(12 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgba(255, 255, 255, 0.1); background: rgb(22, 22, 22); padding: calc(24 * var(--hg-web-unit)); min-height: calc(560 * var(--hg-web-unit));}
.hg-web-play__side-head{display: flex; align-items: flex-start; justify-content: space-between; gap: calc(12 * var(--hg-web-unit));}
.hg-web-play__side-head h2{margin: 0; font-size:max(14px,calc(20 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__side-head p{margin: calc(6 * var(--hg-web-unit)) 0 0; font-size:max(12px,calc(12 * var(--hg-web-text-unit))); color: rgb(138, 138, 147);}
.hg-web-play__side-current{font-size:max(12px,calc(12 * var(--hg-web-text-unit))); font-weight: 600; color: var(--color-primary); white-space: nowrap;}
.hg-web-play__side-rule{margin: calc(24 * var(--hg-web-unit)) 0; border-width: calc(1 * var(--hg-web-unit)) 0 0; border-style: solid none none; border-color: rgba(255, 255, 255, 0.08) currentcolor currentcolor; border-image: none;}
.hg-web-play__ep-grid{display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(10 * var(--hg-web-unit));}
.hg-web-play__ep{display: flex; align-items: center; justify-content: center; height: calc(40 * var(--hg-web-unit)); border-radius: calc(8 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgb(34, 34, 42); background: rgb(29, 29, 30); color: rgb(138, 138, 147); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 500; text-decoration: none;}
.hg-web-play__ep.is-active{background: var(--color-primary); border-color: var(--color-primary); color: rgb(0, 0, 0); font-weight: 700;}
.hg-web-play__playlist-head{display: flex; flex-direction: column; gap: calc(12 * var(--hg-web-unit)); margin-bottom: calc(20 * var(--hg-web-unit));}
.hg-web-play__autoplay, .hg-web-play__playlist-title span{background: rgba(255, 255, 255, 0.08); font-size:max(12px,calc(12 * var(--hg-web-text-unit))); font-weight: 600;}
.hg-web-play__autoplay{display: inline-flex; align-items: center; gap: calc(4 * var(--hg-web-unit)); align-self: flex-start; padding: calc(4 * var(--hg-web-unit)) calc(8 * var(--hg-web-unit)); border-radius: calc(6 * var(--hg-web-unit)); color: rgb(60, 229, 182);}
.hg-web-play__autoplay-dot{width: calc(6 * var(--hg-web-unit)); height: calc(6 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); background: rgb(60, 229, 182);}
.hg-web-play__playlist-title{display: flex; align-items: center; justify-content: space-between;}
.hg-web-play__playlist-title h2{margin: 0; font-size:max(14px,calc(22 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__playlist-title span{padding: calc(4 * var(--hg-web-unit)) calc(10 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); color: rgb(156, 163, 175);}
.hg-web-play__playlist{display: flex; flex-direction: column; gap: calc(12 * var(--hg-web-unit));}
.hg-web-play__pl-item{display: flex; align-items: center; gap: calc(12 * var(--hg-web-unit)); padding: calc(12 * var(--hg-web-unit)); border-radius: calc(16 * var(--hg-web-unit)); background: rgb(28, 27, 33); text-decoration: none; color: inherit;}
.hg-web-play__pl-item.is-active{background: rgb(34, 25, 33); border: calc(1 * var(--hg-web-unit)) solid var(--color-primary);}
.hg-web-play__pl-thumb{position: relative; width: calc(112 * var(--hg-web-unit)); height: calc(76 * var(--hg-web-unit)); border-radius: calc(8 * var(--hg-web-unit)); overflow: hidden; flex-shrink: 0;}
.hg-web-play__pl-thumb img{width: 100%; height: 100%; object-fit: cover; display: block;}
.hg-web-play__pl-thumb span{position: absolute; left: 0; right: 0; bottom: 0; padding: calc(4 * var(--hg-web-unit)) 0; background: rgba(0, 0, 0, 0.7); color: rgb(255, 255, 255); font-size:max(var(--hg-web-aux-min,0px),calc(11 * var(--hg-web-text-unit))); font-weight: 600; text-align: center;}
.hg-web-play__pl-body{flex: 1 1 0%; min-width: 0;}
.hg-web-play__pl-body strong{display: block; margin-top: calc(6 * var(--hg-web-unit)); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__pl-body p{margin: calc(6 * var(--hg-web-unit)) 0 0; font-size:max(var(--hg-web-aux-min,0px),calc(11 * var(--hg-web-text-unit))); color: rgb(107, 114, 128);}
.hg-web-play__pl-status{display: inline-flex; align-items: center; gap: calc(4 * var(--hg-web-unit)); font-size:max(var(--hg-web-aux-min,0px),calc(11 * var(--hg-web-text-unit))); font-weight: 600; color: rgb(156, 163, 175);}
.hg-web-play__pl-status::before{content: ""; width: calc(6 * var(--hg-web-unit)); height: calc(6 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); background: currentcolor;}
.hg-web-play__pl-play{width: calc(28 * var(--hg-web-unit)); height: calc(28 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); background: var(--color-primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
.hg-web-play__pl-play img{width: calc(12 * var(--hg-web-unit)); height: calc(12 * var(--hg-web-unit)); filter: brightness(0);}
.hg-web-play__pl-item:not(.is-active) .hg-web-play__pl-play{opacity: 0;}
.hg-web-play__comments{margin-top: calc(24 * var(--hg-web-unit)); padding: calc(24 * var(--hg-web-unit)); border-radius: calc(16 * var(--hg-web-unit)); background: rgb(20, 20, 20);}
.hg-web-play__comments-head{display: flex; align-items: center; justify-content: space-between; margin-bottom: calc(20 * var(--hg-web-unit));}
.hg-web-play__comments-head h2{margin: 0; font-size:max(14px,calc(18 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__comments-head span{font-size:max(12px,calc(12 * var(--hg-web-text-unit))); color: rgb(154, 154, 158);}
.hg-web-play__composer{display: flex; align-items: center; gap: calc(12 * var(--hg-web-unit)); padding: calc(12 * var(--hg-web-unit)); border-radius: calc(12 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgb(44, 44, 46); background: rgb(28, 28, 30); margin-bottom: calc(20 * var(--hg-web-unit));}
.hg-web-play__composer input{flex: 1 1 0%; min-width: 0; border: 0; background: 0 0; color: rgb(255, 255, 255); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); outline: 0;}
.hg-web-play__composer input::placeholder{color: rgb(99, 99, 102);}
.hg-web-play__composer button{flex-shrink: 0; border: 0; border-radius: calc(8 * var(--hg-web-unit)); padding: calc(8 * var(--hg-web-unit)) calc(16 * var(--hg-web-unit)); background: var(--color-primary); color: rgb(0, 0, 0); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 600; cursor: pointer;}
.hg-web-play__composer-avatar{width: calc(36 * var(--hg-web-unit)); height: calc(36 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: linear-gradient(90deg, rgb(149, 227, 186), rgb(84, 158, 130)); color: rgb(17, 53, 37); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 700;}
.hg-web-play__comment-body p, .hg-web-play__comments h3{margin: 0 0 calc(8 * var(--hg-web-unit)); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__comment{display: flex; gap: calc(12 * var(--hg-web-unit)); padding: calc(16 * var(--hg-web-unit)) 0; border-bottom: calc(1 * var(--hg-web-unit)) solid rgba(255, 255, 255, 0.06);}
.hg-web-play__comment-avatar{width: calc(36 * var(--hg-web-unit)); height: calc(36 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: linear-gradient(90deg, rgb(149, 227, 186), rgb(84, 158, 130)); color: rgb(17, 53, 37); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); font-weight: 700;}
.hg-web-play__comment-body{flex: 1 1 0%; min-width: 0;}
.hg-web-play__comment-meta{display: flex; align-items: center; gap: calc(8 * var(--hg-web-unit)); margin-bottom: calc(8 * var(--hg-web-unit));}
.hg-web-play__comment-meta strong{font-size:max(14px,calc(14 * var(--hg-web-text-unit))); color: rgb(255, 255, 255);}
.hg-web-play__comment-meta span{font-size:max(12px,calc(12 * var(--hg-web-text-unit))); color: rgb(99, 99, 102);}
.hg-web-play__comment-body p{line-height: calc(22 * var(--hg-web-text-unit)); color: rgb(154, 154, 158);}
.hg-web-play__comment-like{display: inline-flex; align-items: center; gap: calc(4 * var(--hg-web-unit)); height: calc(24 * var(--hg-web-unit)); padding: 0 calc(12 * var(--hg-web-unit)); border-radius: calc(999 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.04); color: rgb(149, 149, 149); font-size:max(10px,calc(10 * var(--hg-web-text-unit))); cursor: pointer;}
.hg-web-play__comment-like img{width: calc(16 * var(--hg-web-unit)); height: calc(16 * var(--hg-web-unit));}
.hg-web-play__comment-more{display: block; margin: calc(24 * var(--hg-web-unit)) auto 0; width: calc(150 * var(--hg-web-unit)); height: calc(42 * var(--hg-web-unit)); border-radius: calc(8 * var(--hg-web-unit)); border: calc(1 * var(--hg-web-unit)) solid rgba(255, 255, 255, 0.12); background: 0 0; color: rgba(255, 255, 255, 0.7); font-size:max(14px,calc(14 * var(--hg-web-text-unit))); cursor: pointer;}
.hg-web-play__related{margin-top: calc(32 * var(--hg-web-unit));}

/* 这些图标由HTML尺寸属性提供，覆盖属性值后与文字和容器同步。 */
.hg-web-play__actions .hg-web-play__action img{width:calc(16 * var(--hg-web-unit));height:calc(16 * var(--hg-web-unit))}
.hg-web-play__fact>img{width:calc(2 * var(--hg-web-unit));height:calc(42 * var(--hg-web-unit))}
.hg-web-play__star img{width:100%;height:100%}
.hg-web-play .hg-ep-ranges{gap:calc(8 * var(--hg-web-unit));margin-bottom:calc(12 * var(--hg-web-unit))}
.hg-web-play .hg-ep-range{height:calc(32 * var(--hg-web-unit));padding:0 calc(14 * var(--hg-web-unit));border-radius:calc(8 * var(--hg-web-unit));border-width:calc(1 * var(--hg-web-unit));font-size:max(12px,calc(13 * var(--hg-web-text-unit)))}
/* 同一首广告节点仅在PC视觉排到13张视频后，不复制节点或新增SDK请求。 */
.hg-main-related-grid>.hg-ssp-slot[data-ssp-slot-key="feed_feed_top_main_001"]{order:1}
/* 不足13张时不提前投放末格广告，保留原节点供H5及断点切换复用。 */
.hg-main-related-grid[data-main-related-complete="0"]>.hg-ssp-slot[data-ssp-slot-key="feed_feed_top_main_001"]{display:none!important}
}

/* H5继续首广告加最多七张真实视频，侧栏、抽屉与弹窗不使用此主网格类。 */
@media (max-width:1023px){
  .hg-main-related-grid>.hg-drama-card:nth-child(n+8 of .hg-drama-card){display:none}
}
/* PC正文使用可读字号与独立命中区域，图像、画幅和广告几何继续使用设计单位。 */
@media (min-width:1024px){
  .hg-web-play__main{grid-template-columns:minmax(0,1040fr) minmax(0,380fr)}
  .hg-web-play .hg-web-play__side{width:calc((100% - 20 * var(--hg-web-unit)) * 380 / 1420)}
  .hg-web-play__titlebar{height:auto;min-height:max(40px,calc(49 * var(--hg-web-unit)))}
  .hg-web-play__title,.hg-web-play__title-ep{line-height:1.4}
  .hg-web-play__actions{height:auto;min-height:max(40px,calc(60 * var(--hg-web-unit)));align-items:stretch}
  .hg-web-play__actions .hg-web-play__action{height:auto;min-height:36px;min-width:0;line-height:1.4}
  .hg-web-play__actions .hg-web-play__action span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .hg-web-play__side-tabs button.hg-web-play__side-tab{height:auto;min-height:36px;line-height:1.4}
  .hg-web-play__side.has-comments>.hg-web-play__side-tabs{height:auto;min-height:37px;flex-wrap:wrap}
  .hg-web-play .hg-ep-range,.hg-web-play__ep{height:auto;min-height:36px;line-height:1.4}
  .hg-web-play__ep-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .hg-web-play .hg-web-play__scorebox{height:auto;min-height:208px;gap:14px}
  .hg-web-play .hg-web-play__scorehead{gap:8px;flex-wrap:wrap}
  .hg-web-play__scorenum{line-height:1}
  .hg-web-play .hg-web-play__stars{gap:8px;flex-wrap:wrap}
  .hg-web-play__stars em{line-height:1.4}
  .hg-web-play__starlist{gap:4px;flex-wrap:nowrap}
  .hg-web-play__star{min-width:28px;min-height:36px;display:flex;align-items:center;justify-content:center}
  .hg-web-play__star img{width:calc(26 * var(--hg-web-unit));height:calc(27 * var(--hg-web-unit))}
  .hg-web-play button.hg-web-play__ratesubmit{min-height:36px;height:auto;line-height:1.4;padding:8px 4px}
  button.hg-web-play__follow{min-width:64px;min-height:36px;width:auto;height:auto;padding:0 8px;line-height:1.4}
  .hg-web-play__fact b,.hg-web-play__fact span{line-height:1.4;overflow-wrap:anywhere}
  .hg-web-play .hg-web-play__synopsis-text,.hg-web-play .hg-web-play__synopsis-text p{line-height:1.5}
  .hg-web-play .hg-web-play__synopsis-text:has(>.hg-web-play__synopsis-toggle:not([hidden])){position:relative;min-height:36px;padding-right:64px}
  .hg-web-play .hg-web-play__synopsis-text::before{display:none}
  .hg-web-play button.hg-web-play__synopsis-toggle{position:absolute;right:0;bottom:0;float:none;height:auto;min-width:52px;min-height:36px;margin-left:0;line-height:1.5}
  .hg-web-play__side-comments .hg-web-play__comment-body>p,.hg-web-play__side-comments .hg-web-play__comment-meta{line-height:1.5}
  .hg-web-play__side-comments .hg-web-play__composer input,.hg-web-play__side-comments #vdCommentSubmit{height:auto;min-height:36px;line-height:1.4}
  .hg-web-play__side-comments .hg-web-play__comment-actions{height:auto;min-height:36px;align-items:center}
  .hg-web-play__side-comments button.hg-web-play__comment-reply,.hg-web-play__side-comments button.hg-web-play__comment-like,.hg-web-play__side-comments button.hg-web-play__reply-toggle{height:auto;min-height:36px;line-height:1.4}
  .hg-web-play__side-comments .hg-web-play__composer{flex-wrap:wrap}
  .hg-web-play__side-comments .hg-web-play__composer input{flex-basis:100px}
  .hg-web-play__side-comments #vdCommentSubmit{flex:0 0 auto;min-width:57px}
  .vd-address-card__head,.vd-address-card__foot{flex-wrap:wrap}
  .vd-address-card__head b,.vd-address-badge{line-height:1.4}
  button.vd-address-copy{width:auto;height:auto;min-width:66px;min-height:36px;padding:0 8px;line-height:1.4}
  .vd-address-card__ops a{min-width:36px;min-height:36px}
  .hg-web-detail__play,.hg-web-detail__share,.hg-web-detail__follow,.hg-web-detail__ep-grid a,.hg-web-detail__ep-tabs button{min-height:36px;line-height:1.4}
  #cyberPlayer .xgplayer-controls{min-height:56px}
  #cyberPlayer .xg-inner-controls,#cyberPlayer xg-icon{min-height:36px}
  #cyberPlayer xg-icon{min-width:28px}
  #cyberPlayer .xgplayer-time,#cyberPlayer .xgplayer-time span{height:auto;line-height:36px}
  #cyberPlayer .btn-text{height:auto;min-height:36px;font-size:14px}
  #cyberPlayer .btn-text span{height:auto;min-height:24px;line-height:24px}
  #cyberPlayer .xgplayer-time{font-size:14px}
  .hg-fb button.hg-fb__x,.hg-fb button.hg-fb__type,.hg-fb button.hg-fb__btn{min-height:36px}
  .hg-fb button.hg-fb__x{min-width:36px}
}
@media (min-width:1024px) and (max-width:1439px){
  .hg-web-play__factgrid{column-gap:12px;row-gap:16px}
  .hg-web-play__intro-main{gap:16px}
  .hg-web-play .hg-web-play__scorebox{width:240px;padding:16px}
}
@media (min-width:1024px){
  /* 子按钮有独立实色背景，只收首尾内角，外层保留overflow以免裁掉更多菜单。 */
  .hg-web-play__actions{--hg-action-inner-radius:max(0px,calc(12 * var(--hg-web-unit) - 1px))}
  .hg-web-play__actions>.hg-web-play__action:first-child{border-top-left-radius:var(--hg-action-inner-radius);border-bottom-left-radius:var(--hg-action-inner-radius)}
  .hg-web-play__actions>.hg-web-play__action.hg-web-play__feedback-direct{border-top-right-radius:var(--hg-action-inner-radius);border-bottom-right-radius:var(--hg-action-inner-radius)}
  /* SDK图标盒已居中，36高盒内的24高文字行还需独立居中，不改变菜单或命中尺寸。 */
  #cyberPlayer:not(.xgplayer-is-fullscreen):not(.xgplayer-is-cssfullscreen) .xgplayer-playbackrate .xgplayer-icon.btn-text{display:flex;align-items:center;justify-content:center}
}
@media (min-width:1024px){
  /* 封面与评分沿资料行自然高度铺开，共用四边内距，封面保留完整图片与3:4画幅。 */
  .hg-web-play .hg-web-play__introcard{padding:clamp(16px,calc(20 * var(--hg-web-unit)),20px)}
  .hg-web-play .hg-web-play__intro-main{align-items:stretch}
  .hg-web-play .hg-web-play__poster{position:relative;height:auto;width:auto;aspect-ratio:3/4;align-self:stretch}
  .hg-web-play .hg-web-play__poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
  .hg-web-play .hg-web-play__scorebox{align-self:stretch}
}
@media (min-width:1024px){
  /* 仅放大操作条这五枚图标，窄PC不小于18，喜欢/收藏和播放器控件保持。 */
  .hg-web-play__actions>.hg-web-play__action>img[src*="/action-share.svg"],
  .hg-web-play__actions>.hg-web-play__action>img[src*="/action-download.svg"],
  .hg-web-play__actions>.hg-web-play__action>img[src*="/action-prev.svg"],
  .hg-web-play__actions>.hg-web-play__action>img[src*="/action-next.svg"],
  .hg-web-play__actions>.hg-web-play__action>img[src*="/feedback-menu.svg"]{width:clamp(18px,calc(20 * var(--hg-web-unit)),20px);height:clamp(18px,calc(20 * var(--hg-web-unit)),20px)}
  /* 箭头原画布留白较多，放大绘制后白色部分仍落在同一逻辑图标区内。 */
  .hg-web-play__actions>[data-web-play-ep-prev]>img,.hg-web-play__actions>[data-web-play-ep-next]>img{transform:scale(1.5)}
}