/* ==========================================================================
   MB01 · 视频模块（列表 / 筛选 / 详情 / 播放 / 搜索）
   ========================================================================== */

.mb-main-inner{ padding-top:var(--header-h); }

/* ---------------- 筛选器 ---------------- */
.filter{
  margin-top:18px; padding:16px 18px;
  border-radius:var(--radius); border:1px solid var(--line);
  background:var(--bg-panel); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.filter__row{ display:flex; gap:12px; padding:10px 0; border-bottom:1px dashed var(--line); }
.filter__row:last-child{ border-bottom:0; }
.filter__label{
  flex:0 0 56px; font-size:13px; color:var(--t-muted); line-height:28px;
}
.filter__opts{ display:flex; flex-wrap:wrap; gap:8px; flex:1 1 auto; }
.filter__opt{
  padding:4px 12px; border-radius:999px; font-size:13px;
  color:var(--t-secondary); background:rgba(255,255,255,.04);
  border:1px solid transparent; transition:all .22s ease;
}
.filter__opt:hover{ color:#fff; background:rgba(255,255,255,.08); }
.filter__opt.is-on{
  color:#fff; font-weight:600; border-color:rgba(34,211,238,.45);
  background:linear-gradient(135deg, rgba(59,130,246,.35), rgba(139,92,246,.35));
  box-shadow:0 4px 14px rgba(59,130,246,.28);
}
.filter__letter{ display:flex; flex-wrap:wrap; gap:6px; }
.filter__letter .filter__opt{ padding:4px 10px; min-width:34px; text-align:center; font-family:var(--font-tech); }

/* 排序条 */
.sortbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin:18px 0 4px; flex-wrap:wrap;
}
.sortbar__title{ font-size:clamp(17px,1.9vw,21px); font-weight:700; color:var(--t-ink); }
.sortbar__opts{ display:flex; gap:8px; }
.sortbar__opt{
  padding:6px 14px; border-radius:999px; font-size:13px;
  color:var(--t-secondary); background:rgba(255,255,255,.05); border:1px solid var(--line);
  transition:all .22s ease;
}
.sortbar__opt:hover{ color:#fff; border-color:rgba(34,211,238,.45); }
.sortbar__opt.is-on{ color:#fff; background:var(--grad-main); border-color:transparent; box-shadow:0 4px 14px rgba(59,130,246,.35); }

/* ---------------- 详情页 ---------------- */
.detail{ margin-top:18px; }
.detail__hero{
  display:grid; gap:clamp(18px,3vw,34px);
  grid-template-columns:clamp(180px,22vw,260px) 1fr;
  padding:clamp(16px,2.4vw,26px);
  border-radius:var(--radius);
  background:
    radial-gradient(80% 120% at 0% 0%, rgba(59,130,246,.18), transparent 60%),
    var(--bg-panel);
  border:1px solid var(--line);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  box-shadow:0 18px 50px rgba(2,6,23,.5);
}
/* 移动端不要塌成单列：海报带 2:3 比例，满宽会被拉成一整屏高。
   改成「小海报 + 信息」两栏，超窄屏才上下堆叠并居中限宽。 */
@media (max-width:760px){
  .detail__hero{ grid-template-columns:118px minmax(0,1fr); gap:14px; padding:16px; }
}
@media (max-width:420px){
  .detail__hero{ grid-template-columns:1fr; }
  .detail__pic{ max-width:200px; margin-inline:auto; }
}

.detail__pic{
  position:relative; border-radius:var(--radius-sm); overflow:hidden;
  aspect-ratio:2/3; border:1px solid var(--line-strong);
  background:linear-gradient(160deg,#0d1430,#111a3a);
  box-shadow:0 14px 38px rgba(2,6,23,.55);
}
.detail__pic img{ width:100%; height:100%; object-fit:cover; display:block; }
.detail__score{
  position:absolute; right:10px; top:10px;
  padding:4px 12px; border-radius:999px;
  font-family:var(--font-tech); font-size:14px; font-weight:700; color:#fff;
  background:var(--grad-main); box-shadow:0 4px 16px rgba(59,130,246,.5);
}

.detail__title{
  font-size:clamp(20px,2.6vw,30px); font-weight:800; color:var(--t-ink);
  margin-bottom:6px; line-height:1.3;
}
.detail__sub{ font-size:13px; color:var(--t-muted); margin-bottom:14px; }
.detail__tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.detail__meta{ display:grid; gap:8px 20px; grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:760px){ .detail__meta{ grid-template-columns:1fr; gap:6px; } }
.detail__meta dl{ display:flex; gap:8px; font-size:13px; min-width:0; }
.detail__meta dt{ flex:0 0 auto; color:var(--t-muted); }
.detail__meta dd{ color:var(--t-secondary); min-width:0; word-break:break-all; }
.detail__acts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }

/* 剧情 */
.detail__plot{
  margin-top:var(--gap); padding:18px;
  border-radius:var(--radius); border:1px solid var(--line);
  background:var(--bg-panel); backdrop-filter:blur(12px);
}
.detail__plot p{ color:var(--t-secondary); font-size:14px; line-height:2; }

/* ---------------- 播放源 / 选集 ---------------- */
.player-box{
  margin-top:var(--gap); padding:18px;
  border-radius:var(--radius); border:1px solid var(--line);
  background:var(--bg-panel); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.player-box__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.src-tabs{ display:flex; flex-wrap:wrap; gap:8px; }
.src-tab{
  padding:6px 16px; border-radius:999px; font-size:13px;
  color:var(--t-secondary); background:rgba(255,255,255,.05); border:1px solid var(--line);
  transition:all .25s ease;
}
.src-tab:hover{ color:#fff; border-color:rgba(34,211,238,.45); }
.src-tab.is-on{
  color:#fff; font-weight:600; border-color:transparent;
  background:var(--grad-main); box-shadow:0 4px 14px rgba(59,130,246,.35);
}
.episodes{ display:none; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:10px; }
.episodes.is-on{ display:grid; animation:ep-in .3s ease both; }
@keyframes ep-in{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }
.episode{
  display:flex; align-items:center; justify-content:center; text-align:center;
  padding:10px 8px; border-radius:var(--radius-sm); font-size:13px;
  color:var(--t-secondary); background:rgba(255,255,255,.04);
  border:1px solid var(--line); transition:all .25s ease;
}
.episode:hover{
  color:#fff; transform:translateY(-2px);
  background:rgba(59,130,246,.18); border-color:rgba(34,211,238,.5);
  box-shadow:0 6px 18px rgba(59,130,246,.25);
}
.episode.is-cur{
  color:#fff; font-weight:600; border-color:transparent;
  background:var(--grad-main); box-shadow:0 6px 18px rgba(59,130,246,.4);
}

/* 选集折叠（集数 > 24 时由脚本自动加 is-clamp） */
.episodes.is-clamp{ max-height:186px; overflow-y:auto; padding-right:4px; }
.episodes.is-clamp.is-open{ max-height:none; }
.episodes.is-clamp::-webkit-scrollbar{ width:6px; }
.episodes.is-clamp::-webkit-scrollbar-thumb{ background:rgba(34,211,238,.35); border-radius:3px; }
.episodes__more{ margin-top:12px; }

/* 快捷键提示 */
.play__hint{
  margin-top:10px; font-size:12px; color:var(--t-muted); display:flex; align-items:center; gap:6px;
}
.play__hint kbd{
  padding:2px 7px; border-radius:5px; font-family:var(--font-tech); font-size:11px;
  color:var(--t-secondary); background:rgba(255,255,255,.06); border:1px solid var(--line);
}

/* 影院模式：加宽容器、隐藏推荐、淡化导航（鼠标移上时恢复） */
body.is-cinema .mb-container{ max-width:1560px; }
body.is-cinema .play-reco{ display:none; }
body.is-cinema .mb-footer{ display:none; }
body.is-cinema .mb-nav{ opacity:.28; transition:opacity .3s ease; }
body.is-cinema .mb-nav:hover{ opacity:1; }
body.is-cinema .play__frame{ box-shadow:0 20px 60px rgba(0,0,0,.6), 0 0 40px rgba(34,211,238,.08); }

/* ---------------- 播放页 ---------------- */
.play{ margin-top:18px; }
.play__frame{
  position:relative; overflow:hidden;
  border-radius:var(--radius); border:1px solid var(--line-strong);
  background:#000; box-shadow:0 18px 50px rgba(2,6,23,.6), 0 0 40px rgba(59,130,246,.18);
}
.play__frame > div, .play__frame iframe, .play__frame video{
  width:100% !important; height:clamp(240px,56vh,620px) !important; display:block; border:0;
}
.play__bar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-top:12px;
}
.play__title{ font-size:clamp(17px,2vw,22px); font-weight:700; color:var(--t-ink); }
.play__nav{ display:flex; gap:8px; }

/* ---------------- 搜索页 ---------------- */
.search-head{
  margin-top:18px; padding:22px;
  border-radius:var(--radius); border:1px solid var(--line);
  background:
    radial-gradient(70% 140% at 10% 0%, rgba(139,92,246,.2), transparent 60%),
    var(--bg-panel);
  backdrop-filter:blur(12px);
}
.search-head__title{ font-size:clamp(18px,2.2vw,24px); font-weight:700; color:var(--t-ink); }
.search-head__title em{ font-style:normal; background:var(--grad-main); -webkit-background-clip:text; background-clip:text; color:transparent; }
.search-head__tip{ margin-top:8px; font-size:13px; color:var(--t-muted); }
.search-form{ margin-top:16px; display:flex; gap:10px; flex-wrap:wrap; }
.search-form .mb-input{ flex:1 1 260px; }

/* 列表行（搜索页用横向信息行） */
.vod-row{
  display:grid; gap:16px; grid-template-columns:120px 1fr;
  padding:14px; border-radius:var(--radius-sm);
  border:1px solid var(--line); background:rgba(255,255,255,.03);
  transition:all .25s ease;
}
.vod-row:hover{ background:rgba(59,130,246,.1); border-color:rgba(34,211,238,.4); transform:translateY(-2px); }
.vod-row__pic{ border-radius:8px; overflow:hidden; aspect-ratio:2/3; background:#0d1430; }
.vod-row__pic img{ width:100%; height:100%; object-fit:cover; }
.vod-row__title{ font-size:15px; font-weight:700; color:var(--t-ink); margin-bottom:6px; }
.vod-row:hover .vod-row__title{ color:var(--c-cyan); }
.vod-row__meta{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12px; color:var(--t-muted); }
.vod-row__desc{
  margin-top:8px; font-size:13px; color:var(--t-secondary); line-height:1.8;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
@media (max-width:560px){ .vod-row{ grid-template-columns:92px 1fr; gap:12px; } }

/* ===== 分类入口（vod/index 影视库） ===== */
.cat-entry{ display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:12px; }
.cat-entry__item{
  position:relative; overflow:hidden; padding:16px 14px; border-radius:var(--radius);
  background:linear-gradient(150deg, rgba(26,38,88,.55), rgba(10,14,39,.72));
  border:1px solid var(--line); transition:all .3s ease;
}
.cat-entry__item::after{
  content:""; position:absolute; inset:0; opacity:0; transition:opacity .3s ease;
  background:linear-gradient(150deg, rgba(59,130,246,.28), rgba(34,211,238,.12));
}
.cat-entry__item:hover{ transform:translateY(-4px); border-color:rgba(34,211,238,.45); box-shadow:0 12px 26px rgba(0,0,0,.42); }
.cat-entry__item:hover::after{ opacity:1; }
.cat-entry__name{ position:relative; z-index:1; display:block; font-size:15px; font-weight:700; color:var(--t-ink); }
.cat-entry__sub{ position:relative; z-index:1; display:block; margin-top:5px; font-size:12px; color:var(--t-muted); }

/* ===== 分集剧情 ===== */
.plot-head{ display:grid; grid-template-columns:150px minmax(0,1fr); gap:22px; align-items:end; }
@media (max-width:720px){
  .plot-head{ grid-template-columns:108px minmax(0,1fr); gap:14px; }
  .plot-head__title{ font-size:19px; }
}
@media (max-width:420px){
  .plot-head{ grid-template-columns:1fr; }
  .plot-head__pic{ max-width:180px; }
}
.plot-head__pic{ display:block; border-radius:var(--radius-sm); overflow:hidden; padding:0; }
.plot-head__pic img{ display:block; width:100%; aspect-ratio:2/3; object-fit:cover; }
.plot-head__title{ margin:0 0 10px; font-size:24px; font-weight:700; color:var(--t-ink); }
.plot-head__title small{ margin-left:8px; font-size:14px; font-weight:400; color:var(--t-muted); }
.plot-head__meta{ display:flex; flex-wrap:wrap; gap:8px; font-size:12px; color:var(--t-muted); }
.plot-head__meta span{ padding:4px 12px; border-radius:999px; background:rgba(255,255,255,.04); border:1px solid var(--line); }
.plot-head__ops{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.plot-list{ padding:6px 24px 10px; margin-top:var(--gap); }
.plot-item{ padding:18px 0; border-bottom:1px dashed var(--line); }
.plot-item:last-child{ border-bottom:none; }
.plot-item__title{ margin:0 0 8px; font-size:16px; font-weight:600; }
.plot-item__title a{ color:var(--t-ink); }
.plot-item__title a:hover{ color:var(--c-cyan); }
.plot-item__desc{ margin:0; font-size:14px; line-height:2; color:var(--t-secondary); }
.plot-item__more{ margin-left:8px; font-size:13px; color:var(--c-cyan); }
.plot-item__more:hover{ text-shadow:0 0 10px rgba(34,211,238,.45); }

/* ===== 专题详情 ===== */
.topic-hero{ display:grid; grid-template-columns:220px minmax(0,1fr); gap:24px; padding:24px; }
@media (max-width:720px){
  .topic-hero{ grid-template-columns:128px minmax(0,1fr); gap:16px; padding:18px; }
  .topic-hero__title{ font-size:19px; }
}
@media (max-width:420px){
  .topic-hero{ grid-template-columns:1fr; }
  .topic-hero__pic{ max-width:190px; margin-inline:auto; }
}
.topic-hero__pic img{
  width:100%; aspect-ratio:2/3; object-fit:cover; border-radius:var(--radius-sm);
  border:1px solid var(--line); background:var(--bg-elevate);
}
.topic-hero__title{ margin:0 0 10px; font-size:24px; font-weight:700; color:var(--t-ink); }
.topic-hero__count{ font-size:13px; color:var(--t-muted); margin-bottom:14px; }
.topic-hero__count b{ color:var(--c-cyan); font-size:16px; }
.topic-hero__desc{ margin:0 0 18px; font-size:14px; line-height:2; color:var(--t-secondary); }
.topic-body{ display:grid; grid-template-columns:minmax(0,1fr) var(--sidebar); gap:var(--gap); align-items:start; }
.topic-body > *{ min-width:0; }
@media (max-width:960px){ .topic-body{ grid-template-columns:minmax(0,1fr); } }

/* ===== 评论 ===== */
.cmt-item{ display:flex; gap:12px; padding:14px 0; border-bottom:1px dashed var(--line); }
.cmt-item:last-child{ border-bottom:none; }
.cmt-item__face{
  flex:0 0 40px; width:40px; height:40px; border-radius:50%; object-fit:cover;
  border:1px solid var(--line); background:var(--bg-elevate);
}
.cmt-item__main{ flex:1 1 auto; min-width:0; }
.cmt-item__top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.cmt-item__name{ font-size:14px; font-weight:600; color:var(--t-ink); }
.cmt-item__time{ font-size:12px; color:var(--t-muted); }
.cmt-item__con{ margin:0; font-size:14px; line-height:1.9; color:var(--t-secondary); word-break:break-word; }
.cmt-item__ops{ display:flex; flex-wrap:wrap; gap:14px; margin-top:8px; font-size:12px; color:var(--t-muted); }
.cmt-item__ops a{ color:var(--t-muted); transition:color .2s ease; }
.cmt-item__ops a:hover{ color:var(--c-cyan); }

/* ===== 友情链接墙 ===== */
.link-wall{ display:flex; flex-wrap:wrap; gap:10px; padding:18px; }
.link-wall a{
  padding:7px 14px; border-radius:999px; font-size:13px; color:var(--t-muted);
  background:rgba(255,255,255,.03); border:1px solid var(--line); transition:all .2s ease;
}
.link-wall a:hover{ color:var(--c-cyan); border-color:rgba(34,211,238,.45); background:rgba(34,211,238,.08); }