:root{
  --bg:#11121a;
  --panel:#20232d;
  --line:#34384a;
  --text:#eceffc;
  --sub:#adb4ce;
  --pri:#ff3f8e;
  --pri2:#ff9f4a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 Arial,"Microsoft YaHei",sans-serif}
a{text-decoration:none;color:inherit}
img{display:block;width:100%}
.container{max-width:1240px;margin:0 auto;padding:0 14px}

.site-head{position:sticky;top:0;z-index:50;background:#151824f2;border-bottom:0;backdrop-filter:blur(4px)}
.top-nav{
  display:flex;align-items:center;gap:12px;min-height:50px;
  max-width:1320px;width:calc(100% - 2px);
  margin-top:6px;margin-bottom:6px;
  border:0;border-radius:999px;
  background:linear-gradient(180deg,#23283a,#1a1f30);
  padding:4px 16px;
  box-shadow:0 6px 18px #00000033,inset 0 1px 0 #ffffff10;
}
.logo{display:flex;align-items:center}
.logo img{height:26px;width:auto;max-width:140px;object-fit:contain}
.pc-nav{display:flex;gap:12px;flex:1;overflow:auto}
.pc-nav a{
  white-space:nowrap;color:var(--sub);
  border:1px solid #40465c;
  border-radius:999px;
  padding:5px 12px;
  background:#1c2132;
}
.pc-nav a:hover,.pc-nav a.active{color:var(--pri)}
.head-tools{display:none;gap:8px}
.icon-btn{border:1px solid var(--line);padding:5px 11px;border-radius:999px;background:#1d2130;color:var(--sub);cursor:pointer}
.search-row{display:flex;gap:12px;align-items:center;padding:8px 14px}
.search-form{display:flex;gap:8px;flex:1}
.search-form select,.search-form input,.search-form button{height:34px;border:1px solid var(--line);background:#171b28;color:var(--text);border-radius:999px}
.search-form input{flex:1;padding:0 10px}
.search-form button{padding:0 12px}
.rank-link{color:var(--sub)}
.top-inline{padding:0;flex:0 1 clamp(300px,36vw,460px);min-width:300px;background:#1a1e2b;border:1px solid var(--line);border-radius:8px;padding:3px 6px}
.top-inline .search-form{gap:6px}
.top-inline .search-form select{width:58px;flex:0 0 58px}
.top-inline .search-form input{min-width:80px}
.top-inline .rank-link{font-size:12px;white-space:nowrap}

/* 仅手机：顶栏下展开；勿使用 .top-inline（768 下会被 display:none 整段隐藏） */
.m-search-dock{display:none;padding:10px 0;background:#151824fa;border-bottom:1px solid var(--line)}
.m-search-dock.is-open{display:block}
.m-search-dock .m-search-bar-inner{
  display:block;width:100%;max-width:none;min-width:0;margin:0;
  background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 8px;
}
.m-search-dock .search-form{display:flex;gap:6px;align-items:center;width:100%}
.m-search-dock .search-form select{width:58px;flex:0 0 58px}
.m-search-dock .search-form input{flex:1;min-width:0}
button.icon-btn{
  font:inherit;-webkit-appearance:none;appearance:none;
  margin:0;text-align:center;
}
@media (min-width:769px){
  .m-search-dock,
  .m-search-dock.is-open{display:none!important}
}

.m-nav{position:fixed;inset:0;background:#0008;display:none;z-index:60}
.m-nav.show{display:block}
.m-nav-panel{width:min(320px,80vw);height:100%;background:#212534;padding:14px;overflow:auto}
.m-nav-panel>a,.m-nav-panel details>a{display:block;padding:7px 0;color:var(--sub)}
.m-nav-panel summary{
  padding:7px 0;cursor:pointer;list-style:none;
  color:var(--sub);font-weight:600;
  -webkit-tap-highlight-color:transparent;
}
.m-nav-panel summary::-webkit-details-marker{display:none}
.m-nav-panel details{border-bottom:1px solid #ffffff10}
html[data-theme="light"] .m-nav-panel details{border-bottom-color:#e8ecf5}
html[data-theme="light"] .m-nav-panel{background:#ffffff;border-right:1px solid #d5d9e8}
html[data-theme="light"] .m-nav-panel summary,
html[data-theme="light"] .m-nav-panel>a,
html[data-theme="light"] .m-nav-panel details>a{color:#2a3552}
.m-nav-panel summary,
.m-nav-panel>a,
.m-nav-panel details>a{line-height:1.5}
.m-nav-panel details>a{padding-left:18px}

.hero{margin:12px 0}
.hero-focus{position:relative;height:320px;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:#111}
.hero-slides-auto{position:absolute;inset:0}
.hero-cover{position:absolute;inset:0;opacity:0;transition:opacity .55s ease;background-size:cover;background-position:center center;filter:saturate(1.05) contrast(1.02);transform:translateZ(0)}
.hero-cover.is-active{opacity:1;z-index:2}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#0004 0%,#0001 50%,#0006 100%)}
.hero-right{position:absolute;right:14px;top:14px;bottom:58px;width:230px;background:#111b;border:1px solid #ffffff1f;border-radius:8px;overflow:hidden;backdrop-filter:blur(4px)}
.hero-right ul{margin:0;padding:0;list-style:none}
.hero-right li{border-bottom:1px solid #ffffff14}
.hero-right li:last-child{border-bottom:0}
.hero-right a{display:flex;justify-content:space-between;gap:8px;padding:9px 10px}
.hero-right li.is-active{background:#ffffff14}
.hero-right span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.hero-right em{font-style:normal;color:var(--sub);font-size:12px;white-space:nowrap}
.hero-quick{display:flex;border-top:1px solid #ffffff18}
.hero-quick a{flex:1;text-align:center;padding:8px 0;font-size:12px;color:#f4c46c}
.hero-cats{position:absolute;left:0;right:258px;bottom:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:linear-gradient(180deg,#0f132600,#0f1326dd)}
.hero-cat{padding:9px 12px;border-right:1px solid #ffffff14}
.hero-cat:last-child{border-right:0}
.hero-cat-title{font-size:20px;font-weight:700;color:#f3f6ff}
.hero-cat-sub{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap}
.hero-cat-sub a{font-size:12px;color:#e4e9fb}

.module{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:14px}
.module h2{margin:0 0 10px;font-size:24px;display:flex;justify-content:space-between;align-items:center}
.module .more{font-size:12px;color:var(--sub)}
.split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px}
.sub-links{font-size:12px;display:inline-flex;gap:8px;margin-left:10px}
.sub-links a{color:var(--sub)}

.vod-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.vod-grid-scroll{display:flex;gap:10px;overflow:auto}
.vod-grid-scroll{scrollbar-width:none;-ms-overflow-style:none}
.vod-grid-scroll::-webkit-scrollbar{display:none}
.vod-grid-scroll .vod-card{min-width:150px}
.vod-card{background:#1a1e2b;border:1px solid #2d3344;border-radius:7px;overflow:hidden}
.vod-card img{aspect-ratio:3/4;object-fit:cover;background:#0f1119}
.vod-card h3{margin:6px 6px 2px;font-size:13px;line-height:1.35;height:34px;overflow:hidden}
.vod-card p{margin:0 6px 6px;color:var(--sub);font-size:12px}
.vod-card .desc{height:34px;overflow:hidden}
.vod-card.big{grid-column:span 2}

.rank ol{margin:0;padding:0;list-style:none}
.rank li{display:flex;align-items:center;gap:7px;border-bottom:1px dashed var(--line);padding:8px 0}
.rank .no{font-size:12px;color:var(--pri);min-width:34px}
.rank li a{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.rank li em{font-style:normal;font-size:12px;color:var(--sub)}

.detail-main{display:grid;grid-template-columns:220px minmax(0,1fr);gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:12px}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:12px}
.side-col{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;height:max-content}
.poster img{border-radius:6px;object-fit:cover;aspect-ratio:3/4}
.actions{display:flex;gap:8px;margin-top:10px}
.btn{padding:7px 12px;border-radius:6px;color:#fff;font-size:13px}
.btn.play{background:#ff9f2f}
.btn.fav{background:#ff5579}
.player-box{background:#000;aspect-ratio:16/9;border-radius:8px;overflow:hidden}
.player-ops{display:flex;gap:8px;margin-top:10px}
.player-ops a{padding:5px 10px;border:1px solid var(--line);border-radius:6px;color:var(--sub)}
.play-list,.guess-like,.list-page,.player-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:12px}
.line-select-wrap{margin:8px 0 10px}
.line-select{
  width:100%;max-width:320px;height:34px;
  border:1px solid var(--line);border-radius:999px;
  background:#171b28;color:var(--text);padding:0 12px;
}
.ep-panel{display:none}
.ep-panel.active{display:block}
.ep-list{display:flex;gap:8px;flex-wrap:wrap}
.ep-list a{padding:4px 9px;border:1px solid var(--line);border-radius:6px;color:var(--sub)}
.ep-list a.on{border-color:var(--pri);color:#fff;background:#ffffff10}

.site-foot{border-top:1px solid var(--line);margin-top:14px;padding:16px 0;color:var(--sub);text-align:center}
.fixed-tools{
  position:fixed;right:12px;bottom:12px;display:flex;flex-direction:column;gap:8px;z-index:70;
  padding:8px;border:1px solid #3d4358;border-radius:20px;background:#1b2031d9;backdrop-filter:blur(4px);
}
.tool{
  border:1px solid var(--line);background:#1d2130;color:var(--text);
  padding:7px 10px;border-radius:999px;font-size:12px;text-align:center;
}
.paging-wrap{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:16px 0}
.paging-wrap .page-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;padding:8px 14px;border-radius:999px;
  border:1px solid var(--line);background:#1d2130;color:var(--text);
  font-size:13px;
}
.paging-wrap .page-btn.is-current{
  border-color:var(--pri);color:#fff;background:#ffffff12;
}
html[data-theme="light"] .paging-wrap .page-btn{
  background:#fff;border-color:#cad4ec;color:#32405e;
}
html[data-theme="light"] .paging-wrap .page-btn.is-current{
  border-color:#ff8eb7;color:#b81f63;background:#ffe8f2;
}

html[data-theme="light"]{
  --bg:#f3f5fb;--panel:#fff;--line:#d5d9e8;--text:#1d2436;--sub:#59627c;--pri:#ff2d7c;--pri2:#ff9f4a;
}

/* Light theme readability tuning */
html[data-theme="light"] .site-head{background:#f6f8fff2}
html[data-theme="light"] .top-nav{
  background:linear-gradient(180deg,#ffffff,#eef2ff);
  box-shadow:0 6px 16px #2c3b6b26,inset 0 1px 0 #ffffff;
}
html[data-theme="light"] .pc-nav a{
  background:#f8faff;
  border-color:#c8d2ea;
  color:#34405c;
}
html[data-theme="light"] .pc-nav a:hover,
html[data-theme="light"] .pc-nav a.active{
  background:#ffe8f2;
  border-color:#ff9fc2;
  color:#ca2b73;
}
html[data-theme="light"] .icon-btn{
  background:#f7f9ff;
  border-color:#cad4ec;
  color:#33405e;
}
html[data-theme="light"] .top-inline{
  background:#f8faff;
  border-color:#c8d2ea;
}
html[data-theme="light"] .m-search-dock{background:#f6f8fffa;border-bottom-color:#d5d9e8}
html[data-theme="light"] .m-search-dock .m-search-bar-inner{
  background:#f8faff;
  border-color:#c8d2ea;
}
html[data-theme="light"] .search-form select,
html[data-theme="light"] .search-form input,
html[data-theme="light"] .search-form button{
  background:#ffffff;
  border-color:#cad4ec;
  color:#25304a;
}
html[data-theme="light"] .search-form input::placeholder{color:#7b86a2}
html[data-theme="light"] .module h2{color:#1e2a45}
html[data-theme="light"] .module .more,
html[data-theme="light"] .sub-links a,
html[data-theme="light"] .rank-link{color:#4f5f84}
html[data-theme="light"] .vod-card{
  background:#fbfcff;
  border-color:#d7deef;
}
html[data-theme="light"] .vod-card h3{color:#1f2a44}
html[data-theme="light"] .vod-card p{color:#5a6687}
html[data-theme="light"] .rank .no{color:#d3246d}
html[data-theme="light"] .rank li a{color:#273452}
html[data-theme="light"] .rank li em{color:#5a6687}
html[data-theme="light"] .line-select{
  background:#ffffff;
  border-color:#cad4ec;
  color:#273452;
}
html[data-theme="light"] .ep-list a{
  background:#f8faff;
  border-color:#cad4ec;
  color:#3b4a6f;
}
html[data-theme="light"] .ep-list a.on{
  border-color:#ff8eb7;
  color:#b81f63;
  background:#ffe8f2;
}
html[data-theme="light"] .fixed-tools{
  background:#f2f5ffd9;
  border-color:#c8d2ea;
}
html[data-theme="light"] .tool{
  background:#ffffff;
  border-color:#cad4ec;
  color:#32405e;
}

html[data-theme="light"] .site-foot{color:#5a6687}

.list-page h1{
  margin:12px 0;font-size:clamp(16px,3.8vw,22px);line-height:1.35;
  font-weight:600;color:var(--text);word-break:break-word;
}

.module.split .left > h2{flex-wrap:wrap;gap:8px;align-items:flex-start}
.module.split .left > h2 > a:first-child{flex:0 1 auto}
.module.split .left > h2 .sub-links{
  flex:1 1 auto;min-width:0;justify-content:flex-end;flex-wrap:wrap;
}

.detail-main .info h1{margin:0 0 8px;font-size:22px;line-height:1.25;color:var(--text)}
.detail-main .info p{margin:6px 0;color:var(--sub);font-size:13px;line-height:1.5}

.play-list > h2,.guess-like > h2{
  margin:0 0 10px;font-size:18px;color:var(--text);
}
.play-list .ep-panel > h3{font-size:15px;margin:8px 0 6px;color:var(--text)}

@media (max-width:1024px){
  .split{grid-template-columns:1fr}
  .hero-focus{height:260px}
  .hero-right{width:200px}
  .hero-cats{right:220px}
  .two-col{grid-template-columns:1fr}
  .side-col{display:none}
  .rank{display:none}
}
@media (max-width:768px){
  .pc-nav{display:none}
  .head-tools{display:flex}
  .top-inline{display:none}
  .hero-focus{height:220px}
  .hero-right{display:none}
  .hero-cats{right:0;grid-template-columns:repeat(2,minmax(0,1fr))}
  /* 手机首页：热门推荐用横滑；分类区用 3 列更稳，避免单列巨图 */
  .m-body .vod-grid.m-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .vod-grid:not(.m-grid),.m-grid:not(.vod-grid-scroll){grid-template-columns:repeat(4,minmax(0,1fr))}
  .vod-grid,.m-grid{gap:6px}
  .vod-card.big{grid-column:span 1}
  .hot-recommend .vod-grid-scroll .vod-card{flex:0 0 auto;min-width:min(36vw,132px);max-width:46vw}
  .vod-grid-scroll .vod-card{min-width:min(32vw,118px)}
  .vod-card h3{height:auto;min-height:2.7em;font-size:11px}
  .vod-card p{min-height:1.6em;font-size:10px}
  .module h2{font-size:17px}
  .module.split .left > h2{flex-direction:column;align-items:stretch}
  .module.split .left > h2 .sub-links{margin-left:0;justify-content:flex-start}
  .detail-main{grid-template-columns:96px minmax(0,1fr);align-items:start}
  .detail-main .info h1{font-size:17px}
  .search-row{padding-top:0}
  .fixed-tools .anchor-btn{display:none}
  .m-body .site-head{position:static}
}