/*!
 * 影视专业版 · 门户型（绿色） · 帝国CMS 7.5
 * tokens → base → header → focus → section → card → rank → text list → list page
 * → filter → pager → detail → playlist → player → search → footer → 适配
 * 不依赖 aspect-ratio / inset 等新属性，旧版微信 / UC / QQ 浏览器也能正常排版
 */
:root {
  --c: #12b35a;
  --c2: #0e9c4e;
  --soft: #e9f8ef;
  --soft2: #d3f1df;
  --bg: #ffffff;
  --g: #f4f5f7;
  --g2: #eceef1;
  --line: #eceef1;
  --t1: #1b1c1f;
  --t2: #555b66;
  --t3: #9aa0a8;
  --hot: #ff5a3c;
  --w: 1320px;
  --pad: 24px;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: #fff; color: #1b1c1f; font: 14px/1.5 -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
a:hover { color: #12b35a; color: var(--c); }
img { display: block; max-width: 100%; border: 0; }
button, input { font: inherit; color: inherit; margin: 0; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
input[type="search"] { -webkit-appearance: none; appearance: none; }
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
h1, h2, h3, h4, p, ul, ol, dl, dd, dt { margin: 0; padding: 0; }
ul, ol { list-style: none; }
:focus-visible { outline: 2px solid var(--c); outline-offset: 2px; }
svg { flex-shrink: 0; }
.yx-w { width: 100%; max-width: 1320px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.yx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ell { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.yx-scroll::-webkit-scrollbar { display: none; }

/* ---------- buttons / tags ---------- */
.yx-btn { display: inline-flex; align-items: center; justify-content: center; height: 42px; padding: 0 24px; border-radius: 21px; font-size: 15px; font-weight: 700; white-space: nowrap; border: 1px solid transparent; transition: background-color .15s, color .15s, border-color .15s; }
.yx-btn svg { margin-right: 6px; }
.yx-btn svg:last-child:not(:first-child) { margin: 0 0 0 4px; }
.yx-btn--main { background: var(--c); color: #fff; }
.yx-btn--main:hover { background: var(--c2); color: #fff; }
.yx-btn--line { background: #fff; color: var(--t1); border-color: var(--g2); }
.yx-btn--line:hover { color: var(--c); border-color: var(--c); }
.yx-btn--sm { height: 32px; padding: 0 14px; font-size: 13px; border-radius: 16px; }
.yx-btn.is-disabled { opacity: .4; pointer-events: none; }
.yx-tag { display: inline-block; height: 22px; margin: 0 6px 6px 0; padding: 0 8px; line-height: 20px; border-radius: 4px; font-size: 12px; color: var(--t2); background: var(--g); border: 1px solid var(--line); white-space: nowrap; vertical-align: middle; }
.yx-tag--c { color: var(--c2); background: var(--soft); border-color: var(--soft2); font-weight: 700; }
a.yx-tag:hover { color: var(--c); border-color: var(--soft2); }

/* ---------- header ---------- */
.yx-hd { position: -webkit-sticky; position: sticky; top: 0; z-index: 50; background: #fff; background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--line); }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .yx-hd { background: rgba(255, 255, 255, .88); -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px); }
}
/* 顶部一条品牌色细线 */
.yx-hd::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, #12b35a, #2fd1a0 50%, #12b35a); }
.yx-hd.is-scrolled { box-shadow: 0 6px 24px rgba(16, 24, 40, .08); }
.yx-hd__bar { display: flex; align-items: center; height: 72px; padding-top: 3px; }
.yx-logo { flex-shrink: 0; margin-right: 30px; line-height: 1; }
.yx-logo a { display: flex; align-items: center; color: var(--t1); }
.yx-logo a:hover { color: var(--t1); }
.yx-logo__icon { position: relative; flex-shrink: 0; width: 38px; height: 38px; margin-right: 10px; border-radius: 11px; background: #12b35a; background: linear-gradient(135deg, #34d67f 0%, #12b35a 55%, #0a8f47 100%); box-shadow: 0 6px 14px rgba(18, 179, 90, .28); }
.yx-logo__icon::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -7px 0 0 -4px; border-left: 12px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.yx-logo__t { display: flex; flex-direction: column; }
.yx-logo__n { margin: 0; font-size: 21px; font-weight: 800; line-height: 1; letter-spacing: 1px; }
.yx-logo__t small { margin-top: 6px; font-size: 11px; color: var(--t3); letter-spacing: 2px; white-space: nowrap; }
/* 导航：选中项是实心胶囊，频道鼠标移上去展开二级栏目 */
.yx-nav { display: flex; align-items: center; min-width: 0; }
.yx-nav__i { position: relative; }
.yx-nav__a { display: flex; align-items: center; height: 38px; margin: 0 2px; padding: 0 15px; border-radius: 19px; font-size: 16px; font-weight: 600; color: var(--t1); white-space: nowrap; transition: background-color .15s, color .15s; }
.yx-nav__a svg { margin-left: 3px; color: var(--t3); transition: transform .2s; }
.yx-nav__i:hover > .yx-nav__a { color: var(--c); background: var(--g); }
.yx-nav__a.on, .yx-nav__i:hover > .yx-nav__a.on { color: #fff; background: var(--c); box-shadow: 0 4px 12px rgba(18, 179, 90, .3); }
.yx-nav__a.on svg { color: rgba(255, 255, 255, .85); }
.yx-nav__i.has-dd:hover > .yx-nav__a svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.yx-nav__dd { position: absolute; left: 50%; top: 100%; z-index: 60; padding-top: 14px; visibility: hidden; opacity: 0; -webkit-transform: translate(-50%, 6px); transform: translate(-50%, 6px); transition: opacity .16s, transform .16s, visibility 0s .16s; }
.yx-nav__i:hover > .yx-nav__dd, .yx-nav__i:focus-within > .yx-nav__dd { visibility: visible; opacity: 1; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); transition-delay: 0s; }
.yx-nav__ddin { display: grid; grid-template-columns: repeat(3, minmax(88px, auto)); grid-gap: 4px; gap: 4px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 16px 40px rgba(16, 24, 40, .14); }
.yx-nav__ddin a { padding: 8px 12px; border-radius: 8px; font-size: 14px; color: var(--t2); white-space: nowrap; text-align: center; }
.yx-nav__ddin a:hover { background: var(--soft); color: var(--c2); }
.yx-nav__ddin .yx-nav__all { grid-column: 1 / -1; margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--line); border-radius: 0; color: var(--c); font-weight: 600; }
.yx-nav__ddin .yx-nav__all:hover { background: none; color: var(--c2); }
.yx-sch { position: relative; margin-left: auto; width: 320px; display: flex; align-items: center; height: 40px; border-radius: 20px; background: var(--g); border: 1px solid transparent; transition: border-color .15s, background-color .15s, box-shadow .15s; }
.yx-sch:focus-within { background: #fff; border-color: var(--c); box-shadow: 0 0 0 4px rgba(18, 179, 90, .1); }
.yx-sch__ic { display: flex; margin-left: 14px; color: var(--t3); }
.yx-sch input { flex: 1; min-width: 0; height: 38px; padding: 0 10px 0 8px; border: 0; background: transparent; outline: none; font-size: 13px; }
.yx-sch input::-webkit-input-placeholder { color: var(--t3); }
.yx-sch input::placeholder { color: var(--t3); }
.yx-sch > button { flex-shrink: 0; height: 32px; margin-right: 4px; padding: 0 16px; border-radius: 16px; background: var(--c); color: #fff; font-size: 13px; font-weight: 600; }
.yx-sch > button:hover { background: var(--c2); }
/* 下载 APP 按钮（橙色，和绿色主色区分开，一眼能看到）+ 二维码浮层 */
.yx-hd__app { position: relative; flex-shrink: 0; margin-left: 8px; }
.yx-hd__appbtn { display: flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 19px; font-size: 14px; font-weight: 700; color: #fff; white-space: nowrap; background: #ff6a3c; background: linear-gradient(135deg, #ff9346, #ff5a3c); box-shadow: 0 6px 14px rgba(255, 90, 60, .28); transition: box-shadow .15s, transform .15s; }
.yx-hd__appbtn svg { margin-right: 5px; }
.yx-hd__appbtn:hover { color: #fff; box-shadow: 0 8px 18px rgba(255, 90, 60, .36); -webkit-transform: translateY(-1px); transform: translateY(-1px); }
.yx-hd__apppop { position: absolute; right: 0; top: 100%; z-index: 60; display: flex; align-items: center; width: 326px; margin-top: 14px; padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 18px 44px rgba(16, 24, 40, .16); visibility: hidden; opacity: 0; -webkit-transform: translateY(6px); transform: translateY(6px); transition: opacity .16s, transform .16s, visibility 0s .16s; }
.yx-hd__apppop::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.yx-hd__app:hover .yx-hd__apppop, .yx-hd__app:focus-within .yx-hd__apppop { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; transition-delay: 0s; }
.yx-hd__appqr { flex-shrink: 0; padding: 6px; border: 1px solid var(--line); border-radius: 10px; }
.yx-hd__appqr svg { display: block; }
.yx-hd__appinfo { display: flex; flex-direction: column; min-width: 0; margin-left: 14px; }
.yx-hd__appinfo .yx-hd__appic { width: 40px; height: 40px; margin: 0 0 10px; border-radius: 11px; }
.yx-hd__appinfo b { font-size: 16px; color: var(--t1); }
.yx-hd__appinfo span { margin-top: 4px; font-size: 12px; line-height: 1.6; color: var(--t2); }
.yx-hd__appinfo em { margin-top: 8px; font-size: 12px; font-style: normal; font-weight: 700; color: var(--hot); }
.yx-mnav, .yx-appbar { display: none; }

/* 热门搜索 */
/* 一行放不下的热搜词整个隐藏，不会被切成半个字 */
.yx-hot { display: flex; flex-wrap: wrap; align-items: center; height: 20px; margin-top: 14px; font-size: 13px; line-height: 20px; color: var(--t3); white-space: nowrap; overflow: hidden; }
.yx-hot b { flex-shrink: 0; margin-right: 12px; color: var(--t1); }
.yx-hot a { margin-right: 16px; color: var(--t2); }
.yx-hot a:nth-of-type(-n+3) { color: var(--hot); }

/* ---------- focus（首页焦点图） ---------- */
.yx-focus { display: flex; margin-top: 20px; height: 430px; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 24px rgba(0, 0, 0, .08); background: #fff; }
.yx-focus__main { position: relative; flex: 1; min-width: 0; overflow: hidden; background: #3a4a42; }
.yx-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; color: #fff; opacity: 0; visibility: hidden; transition: opacity .6s, visibility 0s linear .6s; }
.yx-slide.on { opacity: 1; visibility: visible; transition: opacity .6s; }
.yx-slide:hover { color: #fff; }
.yx-slide__bg { position: absolute; top: -40px; left: -40px; right: -40px; bottom: -40px; }
.yx-slide__bg img { width: 100%; height: 100%; object-fit: cover; filter: blur(26px) saturate(150%); }
.yx-slide::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, .14) 62%, rgba(0, 0, 0, 0)); }
.yx-slide__pic { position: absolute; right: 70px; top: 44px; z-index: 2; width: 232px; height: 342px; border-radius: 10px; overflow: hidden; box-shadow: 0 20px 40px rgba(0, 0, 0, .3); }
.yx-slide__pic img { width: 100%; height: 100%; object-fit: cover; }
.yx-slide__txt { position: absolute; left: 48px; bottom: 56px; z-index: 2; max-width: 520px; }
.yx-slide__txt em { display: inline-block; font-style: normal; font-size: 13px; background: var(--c); padding: 2px 9px; border-radius: 4px; }
.yx-slide__h { display: block; margin: 12px 0 8px; font-weight: 700; font-size: 40px; line-height: 1.2; text-shadow: 0 2px 12px rgba(0, 0, 0, .2); word-break: break-word; }
.yx-slide__txt p { font-size: 14px; line-height: 1.7; opacity: .88; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yx-slide__txt .yx-btn { margin-top: 18px; }
.yx-focus__dots { position: absolute; left: 48px; bottom: 24px; z-index: 3; display: flex; }
.yx-focus__dots i { width: 8px; height: 8px; margin-right: 6px; border-radius: 4px; background: rgba(255, 255, 255, .5); cursor: pointer; transition: width .25s, background-color .25s; }
.yx-focus__dots i.on { width: 22px; background: #fff; }
/* 右侧片单：6 条平分焦点图高度，最后一条不会被截掉 */
.yx-focus__list { width: 350px; flex-shrink: 0; display: flex; flex-direction: column; padding: 6px 0; }
.yx-focus__list li { flex: 1; display: flex; min-height: 0; }
.yx-focus__list li a { flex: 1; min-width: 0; display: flex; align-items: center; padding: 0 18px; }
.yx-focus__list img { width: 42px; height: 58px; margin-right: 12px; border-radius: 5px; object-fit: cover; flex-shrink: 0; background: var(--g); }
.yx-focus__list div { min-width: 0; }
.yx-focus__list b { display: block; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-focus__list span { display: block; font-size: 12px; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-focus__list li.on a { background: var(--soft); box-shadow: inset 3px 0 0 var(--c); }
.yx-focus__list li.on b { color: var(--c); }

/* ---------- section ---------- */
.yx-sec { margin-top: 38px; }
.yx-sec__hd { display: flex; align-items: center; margin-bottom: 16px; min-width: 0; }
.yx-sec__hd h2 { flex-shrink: 0; margin-right: 24px; font-size: 23px; line-height: 1.3; }
.yx-sec__hd h2 small { margin-left: 10px; font-size: 13px; font-weight: 400; color: var(--t3); }
.yx-sec__hd h2 small b { color: var(--c); }
.yx-tabs { display: flex; min-width: 0; }
.yx-tabs a, .yx-tabs button { flex-shrink: 0; margin-right: 18px; font-size: 14px; line-height: 28px; color: var(--t2); white-space: nowrap; }
.yx-tabs a:hover, .yx-tabs button:hover { color: var(--c); }
.yx-tabs .on { color: var(--c); font-weight: 700; }
.yx-more { flex-shrink: 0; margin-left: auto; padding-left: 12px; font-size: 13px; color: var(--t3); white-space: nowrap; }
[data-panel][hidden] { display: none; }
.yx-side { display: -ms-grid; display: grid; grid-template-columns: minmax(0, 1fr) 300px; grid-column-gap: 28px; column-gap: 28px; align-items: start; }
.yx-side > * { min-width: 0; }
.yx-side__aside > * + * { margin-top: 20px; }

/* ---------- grid & card ---------- */
.yx-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-gap: 20px 14px; gap: 20px 14px; }
.yx-grid--8 { grid-template-columns: repeat(8, minmax(0, 1fr)); grid-gap: 16px 14px; gap: 16px 14px; }
.yx-grid--list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.yx-cd { display: block; min-width: 0; }
.yx-cd__pic { position: relative; height: 0; padding-top: 142%; overflow: hidden; border-radius: 8px; background: var(--g) url("../img/poster.svg") center / 46% no-repeat; }
.yx-cd__pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.yx-cd__pic::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 36%; background: linear-gradient(0deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); pointer-events: none; }
.yx-cd:hover .yx-cd__pic img { -webkit-transform: scale(1.05); transform: scale(1.05); }
.yx-cd__tag { position: absolute; left: 0; top: 0; z-index: 1; padding: 1px 7px; border-radius: 8px 0 8px 0; font-size: 11px; color: #fff; background: var(--c); }
.yx-cd__bd { position: absolute; right: 7px; bottom: 6px; z-index: 1; max-width: 90%; font-size: 12px; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-cd__t { margin-top: 8px; font-size: 14px; font-weight: 600; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 长片名：显示不下时省略前半截，结尾的“第二季 / 最终章 / 2024”保留（yx_title_html） */
.yx-tt { display: flex; min-width: 0; max-width: 100%; overflow: hidden; }
.yx-tt > .yx-tt__h { flex: 0 1 auto; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yx-tt > .yx-tt__t { flex: 0 0 auto; margin: 0; white-space: nowrap; overflow: visible; }
.yx-cd__s { margin-top: 1px; font-size: 12px; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-cd:hover .yx-cd__t { color: var(--c); }

/* ---------- rank ---------- */
.yx-rk { border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px 8px; background: #fff; }
.yx-rk__hd { display: flex; align-items: center; margin-bottom: 6px; }
.yx-rk__hd h3 { font-size: 17px; }
.yx-rk__hd h3::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--c); vertical-align: 2px; }
.yx-rk__hd .yx-more { font-size: 12px; }
.yx-rk ol > li a { display: flex; align-items: center; padding: 7px 0; font-size: 14px; }
.yx-rk ol > li i { flex-shrink: 0; width: 20px; height: 20px; margin-right: 10px; border-radius: 5px; background: var(--g); color: var(--t3); font-style: normal; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center; }
/* 前三名：红 / 橙 / 黄 */
.yx-rk ol > li i.n1 { background: #ff4d3a; color: #fff; }
.yx-rk ol > li i.n2 { background: #ff8a2b; color: #fff; }
.yx-rk ol > li i.n3 { background: #ffb31f; color: #fff; }
.yx-rk ol > li span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-rk ol > li em { flex-shrink: 0; max-width: 42%; margin-left: 8px; font-style: normal; font-size: 12px; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-rk ol > li.f a { padding: 6px 0; }
.yx-rk ol > li.f img { flex-shrink: 0; width: 44px; height: 62px; margin-right: 10px; border-radius: 5px; object-fit: cover; background: var(--g); }
.yx-rk ol > li.f div { flex: 1; min-width: 0; }
.yx-rk ol > li.f b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-rk ol > li.f small { display: block; font-size: 12px; line-height: 1.6; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-rk ol > li a:hover span, .yx-rk ol > li a:hover b { color: var(--c); }
.yx-rk4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-gap: 20px; gap: 20px; }

/* ---------- 文字列表（最新更新） ---------- */
.yx-tl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-column-gap: 28px; column-gap: 28px; }
.yx-tl li { display: flex; align-items: center; min-width: 0; padding: 7px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
.yx-tl li .c { flex-shrink: 0; margin-right: 6px; font-size: 12px; color: var(--t3); }
.yx-tl li a { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-tl li em { flex-shrink: 0; margin-left: 8px; font-style: normal; font-size: 12px; color: var(--t3); }
.yx-tl li em.new { color: var(--hot); }
.yx-side__aside .yx-tl { grid-template-columns: minmax(0, 1fr); }

/* ---------- crumb / list head ---------- */
/* 面包屑：首页图标 + 细箭头分隔，当前页不加链接、太长省略 */
.yx-crumb { display: flex; align-items: center; min-width: 0; padding: 16px 0 0; font-size: 13px; line-height: 20px; color: var(--t3); white-space: nowrap; }
.yx-crumb a { flex-shrink: 0; color: var(--t3); transition: color .15s; }
.yx-crumb a:hover { color: var(--c); }
.yx-crumb__home { display: inline-flex; align-items: center; }
.yx-crumb__home svg { margin: -1px 4px 0 0; }
.yx-crumb__sep { flex-shrink: 0; width: 6px; height: 6px; margin: 0 10px 0 7px; border-top: 1.5px solid #c3c8cf; border-right: 1.5px solid #c3c8cf; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.yx-crumb__cur { min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--t2); }
/* 列表页标题：栏目名 + 数量徽标 + 一行简介 */
.yx-lhd { margin: 16px 0 16px; }
.yx-lhd__t { display: flex; align-items: center; min-width: 0; }
.yx-lhd h1 { min-width: 0; margin-right: 10px; font-size: 26px; font-weight: 800; line-height: 1.3; word-break: break-word; }
.yx-lhd__n { flex-shrink: 0; padding: 2px 9px; border-radius: 11px; background: var(--soft); color: var(--c2); font-size: 12px; font-weight: 700; line-height: 18px; white-space: nowrap; }
.yx-lhd p { max-width: 900px; margin-top: 6px; font-size: 13px; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------- filter ---------- */
.yx-flt { margin-top: 4px; padding: 4px 20px; border: 1px solid var(--line); border-radius: 12px; background: #fafbfc; }
.yx-flt__row { display: flex; align-items: center; padding: 7px 0; }
.yx-flt__row + .yx-flt__row { border-top: 1px solid var(--line); }
.yx-flt__lab { flex-shrink: 0; width: 52px; font-size: 13px; color: var(--t3); }
.yx-flt__list { display: flex; flex-wrap: wrap; min-width: 0; }
.yx-flt__list a { flex-shrink: 0; margin: 2px 6px 2px 0; padding: 0 12px; border-radius: 14px; font-size: 13px; line-height: 28px; color: var(--t2); white-space: nowrap; }
.yx-flt__list a:hover { color: var(--c); }
.yx-flt__list a.on { color: var(--c2); background: var(--soft); font-weight: 700; }
.yx-flt__tip { margin-top: 12px; font-size: 13px; color: var(--t3); }
.yx-flt__tip a { color: var(--c); }
.yx-empty { padding: 60px 20px; text-align: center; color: var(--t3); border: 1px dashed var(--g2); border-radius: 10px; }
.yx-empty strong { display: block; margin-bottom: 6px; font-size: 16px; color: var(--t2); }

/* ---------- pager ---------- */
.yx-pg { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 32px 0 6px; }
.yx-pg a, .yx-pg span, .yx-pg li a, .yx-pg li span { display: inline-block; min-width: 38px; height: 38px; margin: 3px; padding: 0 12px; border-radius: 6px; border: 1px solid var(--line); background: #fff; font-size: 14px; line-height: 36px; text-align: center; color: var(--t2); }
.yx-pg a:hover { color: var(--c); border-color: var(--c); }
.yx-pg .on, .yx-pg li.active a, .yx-pg li.active span { color: #fff; background: var(--c); border-color: var(--c); font-weight: 700; }
.yx-pg .dis { color: var(--t3); background: var(--g); }
.yx-pg .num { border: 0; background: none; color: var(--t3); }
.yx-pg li { display: inline-block; }
.yx-pg li.visible-xs { display: none; }

/* ---------- detail ---------- */
.yx-info { display: flex; margin-top: 14px; padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: #fff; background: linear-gradient(180deg, #f3fbf6 0%, #ffffff 60%); }
.yx-info__pic { position: relative; flex-shrink: 0; width: 220px; height: 312px; margin-right: 32px; border-radius: 10px; overflow: hidden; background: var(--g); box-shadow: 0 10px 26px rgba(0, 0, 0, .14); }
.yx-info__pic img { width: 100%; height: 100%; object-fit: cover; }
.yx-info__pic .play { position: absolute; left: 50%; top: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: rgba(18, 179, 90, .92); box-shadow: 0 6px 18px rgba(0, 0, 0, .25); }
.yx-info__pic .play::after { content: ""; position: absolute; left: 22px; top: 17px; border-left: 16px solid #fff; border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
.yx-info__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.yx-info__main h1 { font-size: 30px; line-height: 1.3; word-break: break-word; }
.yx-info__alias { margin-top: 4px; font-size: 13px; color: var(--t3); }
.yx-info__tags { margin-top: 12px; }
.yx-info__dl { display: grid; grid-template-columns: repeat(2, minmax(0, 300px)); grid-column-gap: 32px; column-gap: 32px; margin-top: 8px; font-size: 14px; }
.yx-info__desc { max-width: 880px; margin-top: 10px; font-size: 13px; line-height: 1.75; color: var(--t2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yx-info__desc span { color: var(--t3); }
.yx-info__desc a { margin-left: 6px; color: var(--c); white-space: nowrap; }
.yx-info__dl div { display: flex; min-width: 0; padding: 4px 0; }
.yx-info__dl div.full { grid-column: 1 / -1; }
.yx-info__dl dt { flex-shrink: 0; width: 46px; color: var(--t3); }
.yx-info__dl dd { min-width: 0; color: var(--t1); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yx-info__dl dd a { margin-right: 10px; }
.yx-info__btns { display: flex; flex-wrap: wrap; margin-top: auto; padding-top: 18px; }
.yx-info__btns .yx-btn { margin-right: 12px; }
.yx-box { margin-top: 20px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.yx-box__hd { display: flex; align-items: center; margin-bottom: 14px; }
.yx-box__hd h2 { font-size: 19px; line-height: 1.3; }
.yx-box__hd h2::before { content: ""; display: inline-block; width: 4px; height: 17px; margin-right: 9px; border-radius: 2px; background: var(--c); vertical-align: -2px; }
.yx-box__hd .tools { margin-left: auto; display: flex; align-items: center; }
.yx-prose { font-size: 15px; line-height: 1.9; color: var(--t2); word-break: break-word; }
.yx-prose.is-clamped { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.yx-more-btn { margin-top: 8px; font-size: 13px; color: var(--c); }

/* ---------- playlist（JS 依赖这些类名） ---------- */
.yx-lines { display: flex; flex-wrap: wrap; margin-bottom: 4px; }
.yx-lines button { height: 32px; margin: 0 8px 8px 0; padding: 0 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--g); font-size: 13px; color: var(--t2); }
.yx-lines button.is-active { color: #fff; background: var(--c); border-color: var(--c); }
.yx-lines button small { margin-left: 4px; font-size: 11px; opacity: .75; }
.yx-eps { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); grid-gap: 10px; gap: 10px; }
.yx-eps[hidden] { display: none; }
.yx-eps a { display: block; height: 38px; padding: 0 6px; border-radius: 6px; border: 1px solid var(--line); background: var(--g); font-size: 13px; line-height: 36px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-eps a:hover { color: var(--c); border-color: var(--c); background: var(--soft); }
.yx-eps a.is-current { color: #fff; background: var(--c); border-color: var(--c); font-weight: 700; }
.yx-eps.is-collapsed a:nth-child(n+31) { display: none; }
.yx-eps__more { margin-top: 12px; text-align: center; }
.yx-eps__more[hidden] { display: none; }
.yx-noplay { padding: 24px; text-align: center; color: var(--t3); background: var(--g); border-radius: 8px; }

/* ---------- player ---------- */
.yx-play { display: flex; margin-top: 14px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 6px 24px rgba(0, 0, 0, .06); }
.yx-play__main { flex: 1; min-width: 0; }
.yx-player { position: relative; height: 0; padding-top: 56.25%; overflow: hidden; background: #2b3530; }
.yx-player__bg { position: absolute; top: -40px; left: -40px; right: -40px; bottom: -40px; }
.yx-player__bg img { width: 100%; height: 100%; object-fit: cover; filter: blur(30px) brightness(.7) saturate(130%); }
#yx-player { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.yx-player .dplayer { width: 100%; height: 100%; background: transparent; }
.yx-player .dplayer-video-wrap, .yx-player .dplayer-video-wrap video { background: transparent; }
.yx-player__empty { display: flex; align-items: center; justify-content: center; height: 100%; color: #fff; font-size: 15px; }
.yx-play__side { position: relative; flex-shrink: 0; width: 340px; border-left: 1px solid var(--line); }
.yx-play__in { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; }
.yx-play__hd { flex-shrink: 0; padding: 16px 18px 12px; border-bottom: 1px solid var(--line); }
.yx-play__hd b { display: block; font-size: 17px; line-height: 1.35; }
.yx-play__hd span { display: block; margin-top: 3px; font-size: 12px; color: var(--t3); }
.yx-play__eps { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 12px 18px 18px; }
.yx-play__eps .yx-lines { position: -webkit-sticky; position: sticky; top: -12px; z-index: 1; padding-top: 4px; background: #fff; }
.yx-play__eps .yx-eps { grid-template-columns: repeat(auto-fill, minmax(66px, 1fr)); grid-gap: 8px; gap: 8px; }
.yx-play__eps .yx-eps a { height: 34px; line-height: 32px; }
.yx-playbar { display: flex; flex-wrap: wrap; align-items: center; margin-top: 16px; }
.yx-playbar h1 { margin-right: 14px; font-size: 22px; line-height: 1.35; word-break: break-word; }
.yx-playbar h1 a:hover { color: var(--c); }
.yx-playbar h1 small { margin-left: 8px; font-size: 15px; font-weight: 400; color: var(--c); }
.yx-playbar__nav { margin-left: auto; display: flex; }
.yx-playbar__nav .yx-btn { margin-left: 10px; }
.yx-playbar p { width: 100%; margin-top: 6px; font-size: 12px; color: var(--t3); }
.yx-mini { display: flex; }
.yx-mini__pic { flex-shrink: 0; width: 110px; height: 156px; margin-right: 18px; border-radius: 8px; overflow: hidden; background: var(--g); }
.yx-mini__pic img { width: 100%; height: 100%; object-fit: cover; }
.yx-mini__main { flex: 1; min-width: 0; }
.yx-mini__main h2 { font-size: 19px; }
.yx-mini__main .yx-info__tags { margin-top: 8px; }

/* ---------- search ---------- */
.yx-res { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: 16px; gap: 16px; }
.yx-re { display: flex; min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.yx-re:hover { border-color: var(--soft2); box-shadow: 0 6px 20px rgba(0, 0, 0, .06); }
.yx-re__pic { flex-shrink: 0; width: 108px; height: 152px; margin-right: 16px; border-radius: 8px; overflow: hidden; background: var(--g); }
.yx-re__pic img { width: 100%; height: 100%; object-fit: cover; }
.yx-re__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.yx-re__main h2 { font-size: 17px; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-re__main h2 a:hover { color: var(--c); }
.yx-re__tags { margin-top: 8px; }
.yx-re__line { font-size: 13px; color: var(--t2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-re__line span { margin-right: 6px; color: var(--t3); }
.yx-re__desc { margin-top: 4px; font-size: 13px; line-height: 1.7; color: var(--t3); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yx-re__btns { margin-top: auto; padding-top: 10px; }
.yx-re__btns .yx-btn { margin-right: 8px; }

/* ---------- article ---------- */
.yx-alist li { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.yx-alist li a { flex: 1; min-width: 0; margin-right: 14px; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-alist li span { flex-shrink: 0; font-size: 12px; color: var(--t3); }
.yx-article h1 { font-size: 26px; line-height: 1.35; }
.yx-article__meta { margin: 10px 0 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--t3); }
.yx-article__meta span { margin-right: 16px; }
.yx-article__body { font-size: 16px; line-height: 1.95; word-break: break-word; }
.yx-article__body p { margin: 0 0 1.1em; }
.yx-article__body img { height: auto; margin: 14px auto; border-radius: 8px; }
.yx-article__nav { margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; color: var(--t2); }

/* ---------- footer ---------- */
.yx-ft { margin-top: 56px; padding: 34px 0 26px; background: #f7f8fa; border-top: 1px solid var(--line); font-size: 13px; color: var(--t3); }
/* 左边频道分类（自动排成等宽列），右边「关于」，中间一条竖线 */
.yx-ft__links { display: flex; align-items: flex-start; }
.yx-ft__cols { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); grid-gap: 4px 36px; gap: 4px 36px; }
.yx-ft__links dl { min-width: 0; margin: 0 0 12px; }
.yx-ft__links dt { margin-bottom: 8px; font-size: 15px; font-weight: 700; color: var(--t1); }
.yx-ft__links dd a { display: inline-block; margin: 0 12px 6px 0; color: var(--t2); }
.yx-ft__links dd a:hover { color: var(--c); }
.yx-ft__about { flex: 0 0 340px; min-width: 0; margin-left: 40px; padding-left: 32px; border-left: 1px solid var(--g2); line-height: 1.8; }
.yx-ft__about b { display: block; margin-bottom: 8px; font-size: 15px; color: var(--t1); }
.yx-ft__friend { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.yx-ft__friend a { margin-right: 14px; color: var(--t2); }
.yx-ft__copy { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); line-height: 1.9; }
.yx-ft__copy a { color: var(--t2); }
.yx-top { position: fixed; right: 20px; bottom: 26px; z-index: 40; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #fff; color: var(--t2); border: 1px solid var(--g2); box-shadow: 0 6px 18px rgba(0, 0, 0, .1); opacity: 0; visibility: hidden; transition: opacity .25s, visibility 0s linear .25s; }
.yx-top.is-visible { opacity: 1; visibility: visible; transition: opacity .25s; }
.yx-top:hover { color: #fff; background: var(--c); border-color: var(--c); }
.yx-404 { padding: 90px 0 40px; text-align: center; }
.yx-404 b { display: block; font-size: 110px; line-height: 1; color: var(--c); }
.yx-404 h1 { margin-top: 10px; font-size: 22px; }
.yx-404 p { margin: 8px 0 22px; color: var(--t3); }
.yx-404 .yx-sch { width: 420px; max-width: 100%; margin: 0 auto 20px; }

/* =========================== 体验细节 =========================== */
/* 头部：手机端下滑时收起 */
.yx-hd { -webkit-transition: -webkit-transform .25s, box-shadow .2s; transition: transform .25s, box-shadow .2s; }
.yx-hd.is-hide { -webkit-transform: translateY(-100%); transform: translateY(-100%); box-shadow: none; }
.yx-hd__his { display: flex; align-items: center; flex-shrink: 0; height: 38px; margin-left: 12px; padding: 0 12px; border-radius: 19px; font-size: 13px; color: var(--t2); }
.yx-hd__his svg { margin-right: 5px; }
.yx-hd__his:hover { color: var(--c); background: var(--soft); }

/* 搜索下拉 */
.yx-sch__pop { position: absolute; left: 0; right: 0; top: 100%; z-index: 60; margin-top: 8px; padding: 12px 0 8px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(0, 0, 0, .12); text-align: left; }
.yx-sch__pop[hidden], .yx-sch__his[hidden] { display: none; }
.yx-sch__t { display: flex; align-items: center; padding: 0 16px 6px; font-size: 13px; }
.yx-sch__t b { color: var(--t1); }
.yx-sch__t button { margin-left: auto; font-size: 12px; color: var(--t3); }
.yx-sch__t button:hover { color: var(--hot); }
.yx-sch__tags { display: flex; flex-wrap: wrap; padding: 0 12px 8px 16px; }
.yx-sch__tags button { max-width: 100%; height: 28px; margin: 0 8px 8px 0; padding: 0 12px; border-radius: 14px; background: var(--g); font-size: 13px; color: var(--t2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-sch__tags button:hover { color: var(--c); background: var(--soft); }
.yx-sch__hot li a { display: flex; align-items: center; padding: 6px 16px; font-size: 13px; color: var(--t1); }
.yx-sch__hot li a:hover { background: var(--g); color: var(--c); }
.yx-sch__hot i { flex-shrink: 0; width: 18px; margin-right: 10px; font-style: normal; font-weight: 700; color: var(--t3); text-align: center; }
.yx-sch__hot li:nth-child(-n+3) i { color: var(--hot); }
.yx-sch__hot span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 观看记录 / 收藏 面板 */
html.yx-lock, html.yx-lock body { overflow: hidden; }
.yx-panel { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 90; }
.yx-panel[hidden] { display: none; }
.yx-panel__mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(20, 24, 22, .3); opacity: 0; transition: opacity .2s; }
.yx-panel.is-on .yx-panel__mask { opacity: 1; }
.yx-panel__box { position: absolute; top: 74px; right: 24px; right: max(24px, calc((100vw - 1320px) / 2 + 24px)); width: 400px; max-height: calc(100vh - 100px); display: flex; flex-direction: column; background: #fff; border-radius: 14px; box-shadow: 0 18px 50px rgba(0, 0, 0, .18); opacity: 0; -webkit-transform: translateY(-8px); transform: translateY(-8px); transition: opacity .2s, transform .2s; }
.yx-panel.is-on .yx-panel__box { opacity: 1; -webkit-transform: none; transform: none; }
.yx-panel__hd { display: flex; align-items: center; padding: 12px 12px 0 18px; border-bottom: 1px solid var(--line); }
.yx-panel__tabs { display: flex; }
.yx-panel__tabs button { position: relative; margin-right: 22px; padding: 6px 0 12px; font-size: 15px; color: var(--t2); }
.yx-panel__tabs button.on { color: var(--t1); font-weight: 700; }
.yx-panel__tabs button.on::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 2px; background: var(--c); }
.yx-panel__x { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 0 0 8px auto; border-radius: 50%; color: var(--t3); }
.yx-panel__x:hover { color: var(--t1); background: var(--g); }
.yx-panel__bd { flex: 1; min-height: 140px; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 6px 0; }
.yx-plist[hidden], .yx-panel__empty[hidden], .yx-panel__ft button[hidden] { display: none; }
.yx-plist li { position: relative; }
.yx-plist li a { display: flex; align-items: center; padding: 9px 46px 9px 18px; }
.yx-plist li a:hover { background: var(--g); color: inherit; }
.yx-plist img { flex-shrink: 0; width: 48px; height: 66px; margin-right: 12px; border-radius: 6px; object-fit: cover; background: var(--g); }
.yx-plist div { flex: 1; min-width: 0; }
.yx-plist b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-plist span { display: block; margin-top: 2px; font-size: 12px; color: var(--c2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-plist em { display: block; font-style: normal; font-size: 11px; color: var(--t3); }
.yx-plist .bar { display: block; height: 3px; margin-top: 6px; border-radius: 2px; background: var(--g2); overflow: hidden; }
.yx-plist .bar s, .yx-cd__bar s { display: block; height: 100%; background: var(--c); }
.yx-plist button[data-del] { position: absolute; right: 10px; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; font-size: 18px; line-height: 28px; color: var(--t3); }
.yx-plist button[data-del]:hover { color: var(--hot); background: var(--g); }
.yx-panel__empty { padding: 48px 24px; text-align: center; font-size: 13px; color: var(--t3); }
.yx-panel__ft { display: flex; align-items: center; padding: 10px 18px; border-top: 1px solid var(--line); font-size: 12px; color: var(--t3); }
.yx-panel__ft button { margin-left: auto; font-size: 12px; color: var(--t2); }
.yx-panel__ft button:hover { color: var(--hot); }

/* 提示条 */
.yx-toast { position: fixed; left: 50%; bottom: 80px; z-index: 100; max-width: 86%; padding: 10px 18px; border-radius: 20px; background: rgba(27, 28, 31, .88); color: #fff; font-size: 13px; line-height: 1.5; text-align: center; pointer-events: none; opacity: 0; visibility: hidden; -webkit-transform: translate(-50%, 10px); transform: translate(-50%, 10px); transition: opacity .2s, transform .2s, visibility 0s linear .2s; }
.yx-toast.is-on { opacity: 1; visibility: visible; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); transition: opacity .2s, transform .2s; }

/* 手机底部导航（电脑不显示） */
.yx-tab { display: none; }

/* 卡片：悬停播放按钮、图片淡入、进度条 */
.yx-js .yx-cd__pic img { opacity: 0; transition: opacity .35s, transform .4s; }
.yx-js .yx-cd__pic img.is-ok { opacity: 1; }
.yx-cd__play { position: absolute; left: 50%; top: 50%; z-index: 1; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; background: rgba(18, 179, 90, .92); box-shadow: 0 6px 16px rgba(0, 0, 0, .25); opacity: 0; -webkit-transform: scale(.8); transform: scale(.8); transition: opacity .2s, transform .2s; pointer-events: none; }
.yx-cd__play::after { content: ""; position: absolute; left: 18px; top: 14px; border-left: 13px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.yx-cd:hover .yx-cd__play, .yx-cd:focus-visible .yx-cd__play { opacity: 1; -webkit-transform: none; transform: none; }
.yx-cd__bar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; height: 3px; background: rgba(255, 255, 255, .35); }
@media (hover: none) { .yx-cd__play { display: none; } }

/* 继续观看 */
.yx-cont[hidden] { display: none; }
.yx-cont .yx-sec__hd button.yx-more { font-size: 13px; }
.yx-cont__list { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); grid-gap: 16px 14px; gap: 16px 14px; }
.yx-cont .yx-cd__s { color: var(--c2); }
.yx-cont .yx-cd__pic::after { height: 24%; }

/* 影片页 */
.yx-btn--ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.yx-btn--ghost:hover { color: #fff; border-color: #fff; background: rgba(255, 255, 255, .12); }
.yx-btn.is-on { color: var(--hot); border-color: #ffd3c9; background: #fff6f3; }
.yx-btn.is-on svg path { fill: currentColor; }
.yx-info__resume { margin-top: 10px; font-size: 13px; color: var(--t2); }
.yx-info__resume[hidden] { display: none; }
.yx-info__resume b { color: var(--c2); }
.yx-box__sub { margin-left: 10px; font-size: 13px; color: var(--t3); }
.yx-eps a { position: relative; }
.yx-eps a.is-seen { color: var(--t3); background: #fff; }
.yx-eps a.is-last { color: var(--c2); border-color: var(--c); background: var(--soft); }
.yx-eps a.is-last::after { content: ""; position: absolute; top: 4px; right: 4px; width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
.yx-eps a.is-current, .yx-eps a.is-current:hover { color: #fff; background: var(--c); border-color: var(--c); font-weight: 700; }
.yx-eps__new { position: absolute; top: 0; right: 0; padding: 0 4px; border-radius: 0 5px 0 5px; background: var(--hot); color: #fff; font-size: 10px; font-style: normal; font-weight: 700; line-height: 15px; }
mark { padding: 0 1px; border-radius: 2px; background: #fff1a8; color: inherit; }
.yx-empty__hot { margin-top: 18px; }
.yx-empty__hot b { display: block; margin-bottom: 8px; font-size: 13px; color: var(--t2); }
.yx-empty__hot a { display: inline-block; margin: 4px; padding: 4px 12px; border-radius: 14px; background: var(--g); font-size: 13px; color: var(--t2); }
.yx-empty__hot a:hover { color: var(--c); background: var(--soft); }

/* 播放页 */
.yx-playbar__acts { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; }
.yx-playbar__acts > * { margin: 4px 0 4px 10px; }
.yx-switch { position: relative; display: inline-flex; align-items: center; font-size: 13px; color: var(--t2); cursor: pointer; -webkit-user-select: none; user-select: none; }
.yx-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.yx-switch i { position: relative; width: 34px; height: 20px; margin-right: 6px; border-radius: 10px; background: var(--g2); transition: background-color .2s; }
.yx-switch i::after { content: ""; position: absolute; left: 2px; top: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: transform .2s; }
.yx-switch input:checked + i { background: var(--c); }
.yx-switch input:checked + i::after { -webkit-transform: translateX(14px); transform: translateX(14px); }
.yx-switch input:focus-visible + i { outline: 2px solid var(--c); outline-offset: 2px; }
.yx-ptip { position: absolute; left: 16px; top: 16px; z-index: 5; display: flex; align-items: center; max-width: calc(100% - 32px); padding: 6px 6px 6px 14px; border-radius: 18px; background: rgba(0, 0, 0, .62); color: #fff; font-size: 13px; }
.yx-ptip[hidden] { display: none; }
.yx-ptip button { flex-shrink: 0; margin-left: 10px; padding: 3px 10px; border-radius: 12px; background: rgba(255, 255, 255, .2); font-size: 12px; color: #fff; }
.yx-ptip button:hover { background: var(--c); }
.yx-pov { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 6; display: flex; align-items: center; justify-content: center; background: rgba(16, 20, 18, .74); }
.yx-pov[hidden] { display: none; }
.yx-pov__box { max-width: 90%; text-align: center; color: #fff; }
.yx-pov__msg { font-size: 16px; line-height: 1.6; }
.yx-pov__msg b { margin-right: 2px; font-size: 24px; color: #5be39a; }
.yx-pov__btns { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 16px; }
.yx-pov__btns .yx-btn { margin: 4px 6px; }
.yx-dim { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 70; background: rgba(10, 12, 11, .9); }
.yx-dim[hidden] { display: none; }
.yx-lightoff .yx-play { position: relative; z-index: 71; }
.yx-play__rel { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.yx-play__rel > b { display: block; margin-bottom: 4px; font-size: 14px; }
.yx-play__rel li a { display: flex; padding: 6px 0; }
.yx-play__rel img { flex-shrink: 0; width: 54px; height: 76px; margin-right: 10px; border-radius: 6px; object-fit: cover; background: var(--g); }
.yx-play__rel div { min-width: 0; }
.yx-play__rel span { display: block; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-play__rel small { display: block; font-size: 12px; line-height: 1.7; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-play__rel li a:hover span { color: var(--c); }
.yx-mini__line { margin-top: 2px; margin-bottom: 4px; font-size: 13px; color: var(--t2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-mini__line span { margin-right: 6px; color: var(--t3); }
.yx-mini__line a { margin-right: 8px; }

/* =========================== 适配 =========================== */
/* 每种网格在不同宽度下显示的数量：最近更新 8/6/8/6，频道块 12/10/12/6，猜你喜欢 12/10/12/9，列表全部 */
@media (max-width: 1279px) {
  .yx-grid--8 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .yx-grid--8 > :nth-child(n+7) { display: none; }
  .yx-grid--home, .yx-grid--rel { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .yx-grid--home > :nth-child(n+11), .yx-grid--rel > :nth-child(n+11) { display: none; }
  .yx-grid--list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .yx-focus__list { width: 300px; }
  .yx-sch { width: 240px; }
  .yx-nav__a { padding: 0 12px; }
  .yx-logo { margin-right: 18px; }
  .yx-logo__t small { display: none; }
  .yx-slide__pic { right: 40px; }
}
@media (max-width: 1023px) {
  .yx-w { padding-left: 18px; padding-right: 18px; }
  .yx-focus__list { display: none; }
  .yx-side { display: block; }
  .yx-side__aside { margin-top: 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: 20px; gap: 20px; }
  .yx-side__aside > * + * { margin-top: 0; }
  .yx-grid > * { display: block !important; }
  .yx-grid--8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .yx-grid--home, .yx-grid--rel { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .yx-grid--list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .yx-rk4, .yx-tl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yx-play { display: block; }
  .yx-play__side { width: auto; border-left: 0; border-top: 1px solid var(--line); }
  .yx-play__in { position: static; }
  .yx-play__eps { max-height: 300px; }
  .yx-res { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 899px) {
  .yx-hd::before { height: 2px; }
  .yx-hd__bar { height: 58px; padding-top: 2px; }
  .yx-nav, .yx-hd__app { display: none; }
  .yx-logo { margin-right: 12px; }
  .yx-logo__icon { width: 32px; height: 32px; margin-right: 8px; border-radius: 10px; box-shadow: 0 4px 10px rgba(18, 179, 90, .25); }
  .yx-logo__icon::after { margin: -6px 0 0 -3px; border-left-width: 10px; border-top-width: 6px; border-bottom-width: 6px; }
  .yx-logo__n { font-size: 18px; letter-spacing: 0; }
  .yx-logo__t small { display: none; }
  .yx-sch { flex: 1; width: auto; height: 38px; }
  .yx-sch__ic { margin-left: 11px; }
  .yx-sch input { height: 36px; padding-left: 6px; }
  .yx-sch > button { height: 30px; padding: 0 12px; }
  /* 手机频道条：频道左右滑动，右边固定一个“APP”入口 */
  .yx-mnav { display: block; border-top: 1px solid var(--line); }
  .yx-mnav .yx-w { display: flex; align-items: center; }
  .yx-mnav__s { flex: 1; min-width: 0; display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .yx-mnav__s::-webkit-scrollbar { display: none; }
  .yx-mnav__s a { position: relative; flex-shrink: 0; padding: 10px 13px 11px; font-size: 16px; color: var(--t2); }
  .yx-mnav__s a:first-child { padding-left: 0; }
  .yx-mnav__s a.on { color: var(--t1); font-weight: 800; }
  .yx-mnav__s a.on::after { content: ""; position: absolute; left: 50%; bottom: 4px; width: 18px; height: 4px; margin-left: -9px; border-radius: 2px; background: var(--c); }
  .yx-mnav__s a:first-child.on::after { margin-left: -15px; }
  .yx-mnav__app { flex-shrink: 0; display: flex; align-items: center; height: 26px; margin-left: 8px; padding: 0 10px; border-radius: 13px; font-size: 12px; font-weight: 700; color: var(--hot); background: #fff1eb; }
  .yx-mnav__app svg { margin-right: 3px; }
  /* 顶部提示条还在时，频道条里的 APP 入口先不显示（关掉提示条后才出现） */
  .yx-appbar:not([hidden]) ~ .yx-hd .yx-mnav__app { display: none; }
  /* 手机顶部“下载APP”提示条 */
  .yx-appbar { display: flex; align-items: center; padding: 8px 8px 8px 14px; background: #f3fbf6; background: linear-gradient(90deg, #eefaf3, #fff5ee); border-bottom: 1px solid var(--line); }
  .yx-appbar[hidden] { display: none; }
  .yx-appbar .yx-appbar__ic { width: 36px; height: 36px; margin: 0 10px 0 0; border-radius: 10px; box-shadow: 0 4px 10px rgba(18, 179, 90, .22); }
  .yx-appbar__t { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  .yx-appbar__t b { font-size: 14px; color: var(--t1); }
  .yx-appbar__t span { margin-top: 1px; font-size: 11px; color: var(--t2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .yx-appbar__btn { flex-shrink: 0; height: 30px; margin-left: 8px; padding: 0 14px; line-height: 30px; border-radius: 15px; font-size: 13px; font-weight: 700; color: #fff; background: #ff6a3c; background: linear-gradient(135deg, #ff9346, #ff5a3c); }
  .yx-appbar__btn:hover { color: #fff; }
  .yx-appbar__x { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-left: 2px; color: var(--t3); }
}
@media (max-width: 767px) {
  .yx-w { padding-left: 14px; padding-right: 14px; }
  .yx-hot { margin-top: 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .yx-hot::-webkit-scrollbar { display: none; }
  .yx-focus { margin-top: 12px; height: 210px; border-radius: 10px; box-shadow: none; }
  .yx-slide__pic { right: 14px; top: 20px; width: 112px; height: 166px; border-radius: 8px; }
  .yx-slide__txt { left: 16px; bottom: 34px; max-width: 56%; }
  .yx-slide__txt em { font-size: 11px; padding: 1px 6px; }
  .yx-slide__h { margin: 8px 0 4px; font-size: 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .yx-slide__txt p { font-size: 12px; }
  .yx-slide__txt .yx-btn { margin-top: 10px; height: 30px; padding: 0 14px; font-size: 12px; }
  .yx-focus__dots { left: 16px; bottom: 14px; }
  .yx-sec { margin-top: 24px; }
  .yx-sec__hd { flex-wrap: wrap; margin-bottom: 12px; }
  .yx-sec__hd h2 { margin-right: 10px; font-size: 19px; }
  .yx-sec__hd h2 small { display: block; margin: 2px 0 0; font-size: 12px; }
  .yx-sec__hd .yx-tabs { -webkit-box-ordinal-group: 4; order: 3; width: 100%; margin-top: 6px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .yx-sec__hd .yx-tabs::-webkit-scrollbar { display: none; }
  .yx-grid, .yx-grid--8, .yx-grid--home, .yx-grid--rel, .yx-grid--list { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: 14px 9px; gap: 14px 9px; }
  .yx-grid--8 > :nth-child(n+7), .yx-grid--home > :nth-child(n+7), .yx-grid--rel > :nth-child(n+10) { display: none !important; }
  .yx-cd__pic { border-radius: 6px; }
  .yx-cd__tag { font-size: 10px; padding: 0 5px; }
  .yx-cd__bd { font-size: 11px; right: 5px; bottom: 4px; }
  .yx-cd__t { margin-top: 6px; font-size: 13px; }
  .yx-cd__s { font-size: 11px; }
  .yx-home .yx-side__aside { display: none; }
  .yx-side__aside { grid-template-columns: minmax(0, 1fr); }
  .yx-rk4, .yx-tl { grid-template-columns: minmax(0, 1fr); }
  .yx-rk4 > :nth-child(n+2) { display: none; }
  .yx-tl li:nth-child(n+16) { display: none; }
  .yx-lhd { margin: 10px 0 12px; }
  .yx-lhd h1 { font-size: 22px; }
  .yx-lhd p { display: none; }
  .yx-flt { padding: 2px 12px; }
  .yx-flt__row { padding: 4px 0; }
  .yx-flt__lab { width: 34px; font-size: 12px; }
  .yx-flt__list { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .yx-flt__list::-webkit-scrollbar { display: none; }
  .yx-pg a, .yx-pg span { min-width: 34px; height: 34px; margin: 2px; padding: 0 10px; line-height: 32px; font-size: 13px; }
  .yx-pg .hide-m { display: none; }
  .yx-pg li a.hidden-xs, .yx-pg li.hidden-xs { display: none; }
  .yx-pg li.visible-xs { display: inline-block; }
  .yx-info { padding: 14px; border-radius: 10px; }
  .yx-info__pic { width: 110px; height: 156px; margin-right: 14px; border-radius: 8px; }
  .yx-info__pic .play { width: 40px; height: 40px; margin: -20px 0 0 -20px; }
  .yx-info__pic .play::after { left: 16px; top: 12px; border-left-width: 12px; border-top-width: 8px; border-bottom-width: 8px; }
  .yx-info__main h1 { font-size: 19px; }
  .yx-info__tags { margin-top: 6px; }
  .yx-info__tags .yx-tag { height: 20px; padding: 0 6px; line-height: 18px; font-size: 11px; margin: 0 4px 4px 0; }
  .yx-info__dl { display: block; margin-top: 2px; font-size: 12px; }
  .yx-info__dl div { padding: 1px 0; align-items: flex-start; }
  .yx-info__dl div.m-hide { display: none; }
  .yx-info__dl dt { width: auto; margin-right: 4px; white-space: nowrap; }
  .yx-info__dl dd { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .yx-info__btns { padding-top: 10px; flex-wrap: nowrap; }
  .yx-info__btns .yx-btn { flex: 1; height: 34px; margin-right: 8px; padding: 0 8px; font-size: 13px; }
  .yx-info__btns .yx-btn:last-child { margin-right: 0; }
  .yx-box { margin-top: 14px; padding: 14px; border-radius: 10px; }
  .yx-box__hd h2 { font-size: 17px; }
  .yx-prose { font-size: 14px; line-height: 1.8; }
  .yx-eps { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-gap: 8px; gap: 8px; }
  .yx-eps a { height: 34px; line-height: 32px; font-size: 12px; }
  .yx-page-play .yx-crumb { display: none; }
  .yx-page-play .yx-w.yx-play-w { padding-left: 0; padding-right: 0; }
  .yx-play { margin-top: 0; border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; }
  .yx-play__hd { padding: 10px 14px; }
  .yx-play__eps { padding: 10px 14px 14px; max-height: 250px; }
  .yx-play__eps .yx-eps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .yx-playbar h1 { font-size: 18px; }
  .yx-playbar__nav { width: 100%; margin: 10px 0 0; }
  .yx-playbar__nav .yx-btn { flex: 1; margin: 0 8px 0 0; }
  .yx-playbar__nav .yx-btn:last-child { margin-right: 0; }
  .yx-mini__pic { width: 80px; height: 114px; margin-right: 12px; }
  .yx-mini__main h2 { font-size: 16px; }
  .yx-re { padding: 12px; }
  .yx-re__pic { width: 86px; height: 122px; margin-right: 12px; }
  .yx-re__main h2 { font-size: 16px; }
  .yx-re__desc { display: none; }
  .yx-ft { margin-top: 36px; padding: 22px 0 20px; }
  .yx-ft__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: 0 20px; gap: 0 20px; }
  .yx-ft__links dl { margin-bottom: 10px; }
  .yx-top { right: 12px; bottom: 16px; width: 38px; height: 38px; }
  .yx-404 { padding-top: 60px; }
  .yx-404 b { font-size: 80px; }
}
/* ---------- 版面对齐 ---------- */
/* 首页频道块：右侧排行榜和左侧海报一样高，榜单条目均匀分布，下面不留空白 */
@media (min-width: 1024px) {
  .yx-home .yx-sec .yx-side { align-items: stretch; }
  .yx-home .yx-side__aside { display: flex; flex-direction: column; }
  .yx-home .yx-side__aside > .yx-rk { flex: 1; display: flex; flex-direction: column; }
  .yx-home .yx-side__aside > .yx-rk ol { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
}
/* 播放页选集区：底部渐隐，提示还能往下滚 */
@media (min-width: 1024px) {
  .yx-play__eps { -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 26px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 26px), transparent); }
}

/* ---------- 分类页（片库式） ---------- */
.yx-lib { margin: 16px 0 14px; }
.yx-lib__t { display: flex; flex-wrap: wrap; align-items: baseline; }
.yx-lib h1 { margin-right: 12px; font-size: 30px; font-weight: 800; line-height: 1.25; }
.yx-lib__t span { font-size: 14px; color: var(--t3); }
.yx-lib__t b { color: var(--c); }
.yx-lib p { max-width: 900px; margin-top: 6px; font-size: 13px; color: var(--t3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 类型：带数量的胶囊按钮 */
.yx-types { display: flex; flex-wrap: wrap; margin-bottom: 4px; }
.yx-types a { flex-shrink: 0; display: inline-flex; align-items: center; height: 36px; margin: 0 10px 10px 0; padding: 0 16px; border-radius: 18px; background: var(--g); font-size: 14px; color: var(--t1); white-space: nowrap; transition: background-color .15s, color .15s; }
.yx-types a i { margin-left: 6px; font-style: normal; font-size: 12px; color: var(--t3); }
.yx-types a:hover { background: var(--soft); color: var(--c2); }
.yx-types a.on { background: var(--c); color: #fff; font-weight: 700; }
.yx-types a.on i { color: rgba(255, 255, 255, .8); }
/* 静态分页：第 2 页起不显示 TOP 10；第 1 页不显示页码 */
/* 静态列表页：热播 TOP 10 只在第 1 页显示（帝国CMS 8.0 第 1 页页码为空，7.5 为 1） */
.yx-top10[data-pageno]:not([data-pageno=""]):not([data-pageno="1"]) { display: none; }
.yx-pno[data-p=""] { display: none; }
/* 热播 TOP 10：海报左下角大号描边数字 */
.yx-top10 { margin-top: 28px; }
.yx-top10__hd { display: flex; align-items: center; }
.yx-top10__hd h2 { font-size: 20px; }
.yx-top10__list { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); grid-gap: 14px; gap: 14px; margin-top: 14px; }
.yx-top10__list li { min-width: 0; }
.yx-top10__list a { position: relative; display: block; padding-left: 28px; }
.yx-top10__list b { position: absolute; left: 0; bottom: 24px; z-index: 1; font-size: 56px; font-weight: 900; font-style: italic; line-height: .8; color: var(--c); }
.yx-top10__list b.t3 { color: #ff5a3c; }
@supports (-webkit-text-stroke: 2px #000) {
  .yx-top10__list b { color: #fff; -webkit-text-stroke: 2px var(--c); text-shadow: 0 4px 12px rgba(0, 0, 0, .12); }
  .yx-top10__list b.t3 { color: #fff; -webkit-text-stroke-color: #ff5a3c; }
}
.yx-top10__pic { position: relative; display: block; height: 0; padding-top: 142%; border-radius: 6px; overflow: hidden; background: var(--g); }
.yx-top10__pic img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.yx-top10__list a:hover img { -webkit-transform: scale(1.05); transform: scale(1.05); }
.yx-top10__t { display: block; margin-top: 6px; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yx-top10__list a:hover .yx-top10__t { color: var(--c); }
/* 结果条：滚动时吸在头部下面 */
.yx-bar { position: -webkit-sticky; position: sticky; top: 64px; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; margin-top: 26px; padding: 12px 0; background: #fff; border-bottom: 1px solid var(--line); }
.yx-bar h2 { margin-right: 22px; font-size: 20px; }
.yx-sort { display: flex; padding: 3px; border-radius: 18px; background: var(--g); }
.yx-sort a { padding: 5px 16px; border-radius: 15px; font-size: 13px; line-height: 20px; color: var(--t2); white-space: nowrap; }
.yx-sort a:hover { color: var(--c); }
.yx-sort a.on { background: #fff; color: var(--c2); font-weight: 700; box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
.yx-bar__sel { display: flex; flex-wrap: wrap; align-items: center; margin-left: auto; font-size: 13px; color: var(--t3); }
.yx-bar__n b { color: var(--c); }
.yx-bar__n em { font-style: normal; }
.yx-chip { display: inline-flex; align-items: center; height: 26px; margin-left: 8px; padding: 0 8px 0 11px; border-radius: 13px; background: var(--soft); color: var(--c2); font-size: 13px; }
.yx-chip i { margin-left: 4px; font-style: normal; font-size: 15px; line-height: 1; opacity: .7; }
.yx-chip:hover { background: var(--soft2); color: var(--c2); }
.yx-bar__clear { margin-left: 12px; color: var(--t3); }
.yx-bar__clear:hover { color: var(--hot); }
/* 海报墙：每页 30 部，6 / 5 / 3 列都能排满 */
.yx-grid--lib { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-gap: 26px 16px; gap: 26px 16px; margin-top: 20px; }
.yx-cd__ov { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: block; padding: 44px 12px 12px; background: linear-gradient(0deg, rgba(0, 0, 0, .84), rgba(0, 0, 0, .5) 70%, rgba(0, 0, 0, 0)); color: #fff; opacity: 0; -webkit-transform: translateY(8px); transform: translateY(8px); transition: opacity .2s, transform .2s; pointer-events: none; }
.yx-cd__ov .d { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 12px; line-height: 1.6; opacity: .92; }
.yx-cd__ov .b { display: inline-flex; align-items: center; margin-top: 8px; padding: 3px 10px; border-radius: 12px; background: var(--c); font-size: 12px; font-weight: 700; }
.yx-cd__ov .b svg { margin-right: 3px; }
.yx-cd:hover .yx-cd__ov, .yx-cd:focus-visible .yx-cd__ov { opacity: 1; -webkit-transform: none; transform: none; }
.yx-cd:hover .yx-cd__ov ~ .yx-cd__bd, .yx-cd:hover .yx-cd__bd { opacity: 0; }
.yx-cd__bd { transition: opacity .2s; }
@media (hover: none) { .yx-cd__ov { display: none; } }
/* 跳页 */
.yx-pg__go { display: inline-flex; align-items: center; margin-left: 10px; font-size: 13px; color: var(--t3); }
.yx-pg__go input { width: 56px; height: 38px; margin: 0 6px; padding: 0 6px; border: 1px solid var(--line); border-radius: 6px; background: #fff; text-align: center; font-size: 14px; -moz-appearance: textfield; }
.yx-pg__go input::-webkit-inner-spin-button, .yx-pg__go input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.yx-pg__go input:focus { border-color: var(--c); outline: none; }
.yx-pg__go button { height: 38px; margin-left: 4px; padding: 0 14px; border-radius: 6px; background: var(--g); color: var(--t2); font-size: 13px; }
.yx-pg__go button:hover { background: var(--c); color: #fff; }
@media (max-width: 1279px) {
  .yx-grid--lib { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .yx-top10__list { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .yx-top10__list li:nth-child(n+9) { display: none; }
}
@media (max-width: 1023px) {
  .yx-types { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0 -18px 6px; padding: 0 18px; }
  .yx-types::-webkit-scrollbar { display: none; }
  .yx-types a { margin-bottom: 0; }
  .yx-top10__list { display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 14px -18px 0; padding: 0 18px; }
  .yx-top10__list::-webkit-scrollbar { display: none; }
  .yx-top10__list li, .yx-top10__list li:nth-child(n+9) { display: block; flex: 0 0 17%; margin-right: 12px; }
}
@media (max-width: 899px) {
  .yx-bar { top: 0; }
}
@media (max-width: 767px) {
  .yx-lib { margin: 10px 0 10px; }
  .yx-lib h1 { font-size: 22px; }
  .yx-lib__t span { font-size: 12px; }
  .yx-lib p { display: none; }
  .yx-types { margin: 0 -14px 10px; padding: 0 14px; }
  .yx-types a { height: 32px; margin-right: 8px; padding: 0 13px; font-size: 13px; }
  .yx-top10 { margin-top: 20px; }
  .yx-top10__hd h2 { font-size: 17px; }
  .yx-top10__list { margin: 12px -14px 0; padding: 0 14px; }
  .yx-top10__list li, .yx-top10__list li:nth-child(n+9) { flex: 0 0 28%; margin-right: 10px; }
  .yx-top10__list a { padding-left: 20px; }
  .yx-top10__list b { bottom: 22px; font-size: 42px; }
  .yx-bar { margin-top: 18px; padding: 10px 0; }
  .yx-bar h2 { display: none; }
  .yx-bar__sel { width: 100%; margin: 8px 0 0; }
  .yx-grid--lib { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: 16px 9px; gap: 16px 9px; margin-top: 14px; }
}

/* 体验细节的适配 */
@media (max-width: 1279px) {
  .yx-hd__his { padding: 0 9px; }
  .yx-hd__his span { display: none; }
  .yx-hd__his svg { margin: 0; }
  .yx-cont__list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .yx-cont__list > :nth-child(n+7) { display: none; }
}
@media (max-width: 1023px) {
  .yx-play__rel { display: none; }
  .yx-cont__list > * { display: block; }
  .yx-cont__list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .yx-cont__list > :nth-child(n+7) { display: none; }
}
@media (max-width: 1023px) {
  /* 页脚：「关于」放到分类下面 */
  .yx-ft__links { display: block; }
  .yx-ft__about { margin: 6px 0 0; padding: 14px 0 0; border-left: 0; border-top: 1px solid var(--g2); }
  /* 筛选条件一行横向滑动，不再换行出现孤零零的一项 */
  .yx-flt__list { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .yx-flt__list::-webkit-scrollbar { display: none; }
  .yx-info__dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* 能横向滑动的行：右边缘渐隐，提示后面还有 */
  .yx-flt__list, .yx-mnav__s { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
}
@media (max-width: 767px) {
  .yx-hot, .yx-sec__hd .yx-tabs { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 28px), transparent); }
}
@media (min-width: 768px) and (max-width: 1023px) {
  /* 平板：首页排行榜占满整行，分两列排 */
  .yx-home .yx-side__aside { display: block; }
  .yx-home .yx-side__aside > .yx-rk ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(5, auto); grid-auto-flow: column; grid-column-gap: 32px; column-gap: 32px; }
  .yx-home .yx-rk ol > li.f img, .yx-home .yx-rk ol > li.f small { display: none; }
  .yx-home .yx-rk ol > li.f a { padding: 7px 0; }
}
@media (max-width: 899px) {
  .yx-hd__his { display: none; }
}
@media (max-width: 767px) {
  .yx-tab { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: flex; height: 56px; padding-bottom: 0; padding-bottom: env(safe-area-inset-bottom); height: calc(56px + env(safe-area-inset-bottom)); background: #fff; background: rgba(255, 255, 255, .97); border-top: 1px solid var(--line); box-shadow: 0 -4px 16px rgba(0, 0, 0, .04); }
  .yx-tab a, .yx-tab button { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; font-size: 11px; color: var(--t3); }
  .yx-tab svg { margin-bottom: 2px; }
  .yx-tab .on { color: var(--c); font-weight: 700; }
  body { padding-bottom: 56px; padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
  .yx-top { bottom: 70px; bottom: calc(70px + env(safe-area-inset-bottom)); }
  .yx-toast { bottom: 76px; bottom: calc(76px + env(safe-area-inset-bottom)); }
  .yx-panel__box { top: auto; left: 0; right: 0; bottom: 0; width: auto; max-height: 80vh; border-radius: 16px 16px 0 0; padding-bottom: env(safe-area-inset-bottom); -webkit-transform: translateY(40px); transform: translateY(40px); }
  .yx-sch__pop { left: -60px; right: -6px; }
  .yx-cont__list { display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin: 0 -14px; padding: 0 14px; }
  .yx-cont__list::-webkit-scrollbar { display: none; }
  .yx-cont__list > * { display: block !important; flex: 0 0 29%; margin-right: 9px; }
  .yx-cont .yx-cd__play { display: block; width: 34px; height: 34px; margin: -17px 0 0 -17px; opacity: 1; -webkit-transform: none; transform: none; }
  .yx-cont .yx-cd__play::after { left: 13px; top: 10px; border-left-width: 10px; border-top-width: 7px; border-bottom-width: 7px; }
  .yx-hot { flex-wrap: nowrap; height: auto; }
  .yx-info__desc { display: none; }
  .yx-crumb { padding-top: 12px; font-size: 12px; }
  .yx-lhd__n { font-size: 11px; padding: 1px 8px; }
  .yx-info__btns .yx-btn { min-width: 0; }
  .yx-info__btns .yx-btn span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .yx-info__btns .yx-btn--sel { display: none; }
  .yx-info__btns .yx-btn--ic { flex: 0 0 34px; width: 34px; padding: 0; }
  .yx-info__btns .yx-btn--ic span { display: none; }
  .yx-info__btns .yx-btn--ic svg { margin: 0; }
  .hide-s, .hide-m { display: none !important; }
  .yx-box__hd { flex-wrap: wrap; }
  .yx-box__sub { margin-left: 8px; font-size: 12px; }
  .yx-playbar__acts { width: 100%; margin: 8px 0 0; }
  .yx-playbar__acts > * { margin: 4px 8px 4px 0; }
  .yx-playbar__acts .yx-btn { padding: 0 12px; }
  .yx-ptip { left: 10px; top: 10px; font-size: 12px; }
  .yx-pov__msg { font-size: 14px; }
  .yx-pov__msg b { font-size: 20px; }
}
@media (max-width: 359px) {
  .yx-grid, .yx-grid--8, .yx-grid--home, .yx-grid--rel, .yx-grid--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ---------- 下载 APP：播放页提示、页脚二维码 ---------- */
.yx-appcta { display: flex; align-items: center; margin: 16px 0 0; padding: 12px 16px; border-radius: 14px; background: #f3fbf6; background: linear-gradient(90deg, #eefaf3, #fff5ee); border: 1px solid #e3f4ea; }
.yx-appcta .yx-appcta__ic { width: 44px; height: 44px; margin: 0 12px 0 0; border-radius: 12px; }
.yx-appcta__t { flex: 1; min-width: 0; }
.yx-appcta__t b { display: block; font-size: 15px; color: var(--t1); }
.yx-appcta__t span { display: block; margin-top: 2px; font-size: 12px; color: var(--t2); }
.yx-appcta__qr { display: flex; align-items: center; margin: 0 18px; }
.yx-appcta__qr svg { display: block; padding: 3px; background: #fff; border-radius: 6px; }
.yx-appcta__qr span { margin-left: 8px; font-size: 12px; color: var(--t3); }
.yx-appcta .yx-appcta__btn { flex-shrink: 0; background: #ff6a3c; background: linear-gradient(135deg, #ff9346, #ff5a3c); }
.yx-appcta .yx-appcta__btn:hover { background: #ff5a3c; color: #fff; }
.yx-ft__app { display: flex; align-items: center; margin-top: 16px; padding: 12px; background: #fff; border: 1px solid var(--g2); border-radius: 12px; }
.yx-ft__appqr { flex-shrink: 0; margin-right: 12px; }
.yx-ft__appqr svg { display: block; }
.yx-ft__app b { display: block; font-size: 14px; color: var(--t1); }
.yx-ft__app span { display: block; margin: 2px 0 4px; font-size: 12px; color: var(--t3); }
.yx-ft__appbtn { font-size: 12px; font-weight: 700; color: var(--hot); }
/* 微信里点安卓安装包：提示去浏览器打开 */
.yx-wxtip { position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 200; background: rgba(0, 0, 0, .72); color: #fff; text-align: right; }
.yx-wxtip p { margin: 18px 22px 0 60px; font-size: 16px; line-height: 1.7; }
.yx-wxtip b { font-size: 26px; }
@media (max-width: 1023px) {
  .yx-hd__appbtn { padding: 0 13px; }
  .yx-sch { width: 210px; }
}
@media (max-width: 899px) {
  .yx-ft__appqr { display: none; }
}
@media (max-width: 767px) {
  .yx-appcta { margin-top: 12px; padding: 10px 12px; }
  .yx-appcta .yx-appcta__ic { width: 38px; height: 38px; margin-right: 10px; }
  .yx-appcta__qr { display: none; }
  .yx-appcta__t b { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; }
}