/* ============================================================
   仿Netflix影视站 - 完整样式
   模块：变量 / 基础 / 导航 / Hero / 按钮 / 卡片 / 页脚
        详情页 / 区块 / 剧集 / 简介 / 相关推荐
        列表页 / 分页 / 播放页 / 播放器 / 一周更新表
        响应式
   ============================================================ */

/* ============ 1. 变量 ============ */
:root{
  --nf-bg:#141414;
  --nf-bg-2:#1f1f1f;
  --nf-bg-3:#2a2a2a;
  --nf-red:#e50914;
  --nf-red-hover:#f40612;
  --nf-text:#ffffff;
  --nf-text-2:#b3b3b3;
  --nf-text-3:#808080;
  --nf-border:rgba(255,255,255,.1);
  --nf-radius:6px;
  --nf-radius-lg:12px;
}

/* ============ 2. 基础 ============ */
*{margin:0;padding:0;box-sizing:border-box}

html,body{
  background:var(--nf-bg);
  color:var(--nf-text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  font-size:14px;
  line-height:1.6;
  min-height:100vh;
  overflow-x:hidden;
  max-width:100vw;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;height:auto}
button{cursor:pointer;border:none;background:none;color:inherit;font:inherit}
input{font:inherit}

/* ============ 3. 顶部导航 ============ */
.nf-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:0 4%;height:68px;
  display:flex;align-items:center;
  background:linear-gradient(180deg,rgba(0,0,0,.7) 10%,rgba(0,0,0,0));
  transition:background .3s;
}
.nf-header.nf-header-scrolled,
.nf-header.nf-header-solid{
  background:#141414;
  box-shadow:0 2px 10px rgba(0,0,0,.5);
}
.nf-header-inner{
  display:flex;align-items:center;gap:40px;
  width:100%;max-width:1600px;margin:0 auto;
}
.nf-logo{
  font-size:24px;font-weight:900;color:var(--nf-red);
  letter-spacing:1px;white-space:nowrap;
  text-shadow:0 2px 8px rgba(229,9,20,.4);
}
.nf-nav{display:flex;gap:22px;flex:1}
.nf-nav a{
  font-size:14px;color:var(--nf-text-2);
  transition:color .2s;white-space:nowrap;
}
.nf-nav a:hover{color:var(--nf-text)}
.nf-nav a.active{color:var(--nf-text);font-weight:600}
.nf-search{position:relative;display:flex;align-items:center}
.nf-search-btn{padding:8px;color:var(--nf-text);display:flex;align-items:center}
.nf-search-input{
  width:0;padding:8px 0;background:rgba(0,0,0,.7);
  border:1px solid rgba(255,255,255,.2);color:var(--nf-text);
  border-radius:4px;transition:all .3s;outline:none;margin-left:8px;
}
.nf-search-input.active{width:240px;padding:8px 14px;border-color:var(--nf-red)}

/* ============ 4. Hero 大图 ============ */
.nf-hero{position:relative;height:85vh;min-height:600px;overflow:hidden}
.nf-hero-bg{
  position:absolute;top:0;left:0;right:0;bottom:0;
  background:center/cover no-repeat;
  transform:scale(1.05);transition:opacity .4s;
}
.nf-hero-mask{
  position:absolute;top:0;left:0;right:0;bottom:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.85) 0%,rgba(0,0,0,.5) 40%,rgba(0,0,0,0) 70%),
    linear-gradient(0deg,#141414 0%,rgba(20,20,20,.6) 30%,rgba(20,20,20,0) 70%);
}
.nf-hero-content{
  position:relative;z-index:2;max-width:700px;
  padding:0 4%;height:100%;
  display:flex;flex-direction:column;
  justify-content:flex-end;padding-bottom:80px;
}
.nf-hero-badge{
  display:inline-block;padding:4px 12px;
  background:var(--nf-red);color:#fff;
  font-size:12px;font-weight:600;border-radius:3px;
  margin-bottom:16px;align-self:flex-start;
}
.nf-hero-title{
  font-size:64px;font-weight:900;line-height:1.05;
  color:#fff;margin-bottom:16px;
  text-shadow:0 4px 24px rgba(0,0,0,.8);
}
.nf-hero-meta{display:flex;gap:8px;font-size:14px;color:#d1d1d1;margin-bottom:16px}
.nf-hero-desc{
  font-size:15px;line-height:1.7;color:#d1d1d1;
  margin-bottom:24px;max-width:600px;
  text-shadow:0 2px 8px rgba(0,0,0,.6);
}
.nf-hero-actions{display:flex;gap:12px}

/* ============ 5. 按钮 ============ */
.nf-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 28px;border-radius:6px;
  font-size:16px;font-weight:600;cursor:pointer;
  transition:all .2s;border:none;
}
.nf-btn-play{background:#fff;color:#141414}
.nf-btn-play:hover{background:rgba(255,255,255,.8);transform:scale(1.02)}
.nf-btn-info{background:rgba(109,109,110,.7);color:#fff}
.nf-btn-info:hover{background:rgba(109,109,110,.5)}

/* ============ 6. 主内容区 ============ */
.nf-main{
  padding:0 4% 60px;
  margin-top:-60px;
  position:relative;z-index:3;
  max-width:1600px;margin-left:auto;margin-right:auto;
}
.nf-row{margin-bottom:50px}
.nf-row-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:18px;
}
.nf-row-title{font-size:22px;font-weight:700;color:#fff}
.nf-row-more{font-size:13px;color:var(--nf-text-2);transition:color .2s}
.nf-row-more:hover{color:var(--nf-red)}
.nf-row-scroll{
  display:flex;gap:12px;overflow-x:auto;
  padding:8px 0 20px;scroll-behavior:smooth;
}
.nf-row-scroll::-webkit-scrollbar{height:6px}
.nf-row-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:3px}
.nf-row-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:3px}
.nf-row-scroll::-webkit-scrollbar-thumb:hover{background:var(--nf-red)}

/* ============ 7. 卡片 ============ */
.nf-card{
  flex-shrink:0;width:200px;border-radius:var(--nf-radius);
  overflow:hidden;transition:transform .3s;
  position:relative;display:block;
}
.nf-card:hover{transform:scale(1.06);z-index:2}
.nf-card-img{
  width:100%;aspect-ratio:2/3;
  object-fit:cover;display:block;
  background-color:var(--nf-bg-3);
  border-radius:var(--nf-radius);
  position:relative;overflow:hidden;
}
.nf-card-badge{
  position:absolute;top:8px;left:8px;
  background:var(--nf-red);color:#fff;
  font-size:11px;font-weight:700;
  padding:3px 8px;border-radius:3px;z-index:2;
}
.nf-card-info{padding:10px 4px 0}
.nf-card-info h3{
  font-size:14px;font-weight:600;color:#fff;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  margin-bottom:4px;
}
.nf-card-info p{font-size:12px;color:var(--nf-text-2)}

/* ============ 8. 页脚 ============ */
.nf-footer{
  background:#0b0b0b;padding:40px 4%;
  border-top:1px solid var(--nf-border);
}
.nf-footer-inner{max-width:1600px;margin:0 auto;text-align:center}
.nf-footer-links{
  display:flex;justify-content:center;gap:30px;
  margin-bottom:20px;flex-wrap:wrap;
}
.nf-footer-links a{color:var(--nf-text-2);font-size:13px;transition:color .2s}
.nf-footer-links a:hover{color:var(--nf-text)}
.nf-footer-copy{font-size:12px;color:var(--nf-text-3)}

/* ============ 9. 详情页 Hero ============ */
.nf-detail-hero{
  position:relative;
  min-height:480px;
  display:flex;align-items:flex-end;
  padding:0 4% 50px;overflow:hidden;
}
.nf-detail-bg{
  position:absolute;top:0;left:0;right:0;bottom:0;
  background-size:cover;background-position:center;
  filter:blur(20px) brightness(0.35);
  transform:scale(1.1);
}
.nf-detail-mask{
  position:absolute;top:0;left:0;right:0;bottom:0;
  background:linear-gradient(0deg,var(--nf-bg) 0%,rgba(20,20,20,.6) 50%,rgba(20,20,20,.4) 100%);
}
.nf-detail-content{
  position:relative;z-index:2;
  max-width:1400px;margin:0 auto;width:100%;
  display:flex;gap:28px;align-items:flex-end;
  padding-top:100px;
}
.nf-detail-poster{
  flex-shrink:0;
  width:160px;
  aspect-ratio:2/3;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 12px 40px rgba(0,0,0,.7);
  border:1px solid rgba(255,255,255,.08);
}
.nf-detail-poster img{width:100%;height:100%;object-fit:cover;display:block}
.nf-detail-info{flex:1;min-width:0;padding-bottom:6px}
.nf-detail-crumb{font-size:13px;color:var(--nf-text-2);margin-bottom:16px}
.nf-detail-crumb a{color:var(--nf-text-2);transition:color .2s}
.nf-detail-crumb a:hover{color:var(--nf-red)}
.nf-detail-crumb span{margin:0 8px;opacity:0.5}
.nf-detail-crumb em{color:#fff;font-style:normal}
.nf-detail-title{
  font-size:36px;font-weight:900;line-height:1.2;
  margin-bottom:12px;color:#fff;
}
.nf-detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.nf-tag{
  display:inline-block;padding:4px 12px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.15);
  border-radius:4px;font-size:13px;color:#d1d1d1;
}
.nf-tag-type{background:rgba(229,9,20,.2);border-color:rgba(229,9,20,.4);color:#ff6b6b}
.nf-tag-status{background:var(--nf-red);border-color:var(--nf-red);color:#fff}
.nf-tag-score{background:rgba(255,193,7,.2);border-color:rgba(255,193,7,.4);color:#ffc107}
.nf-detail-desc{
  font-size:15px;line-height:1.8;color:#d1d1d1;
  margin-bottom:24px;max-width:800px;
  display:-webkit-box;-webkit-line-clamp:3;
  -webkit-box-orient:vertical;overflow:hidden;
}
.nf-detail-actions{display:flex;gap:12px;flex-wrap:wrap}
.nf-detail-main{max-width:1400px;margin:0 auto;padding:40px 4%}

/* ============ 10. 区块 ============ */
.nf-section{
  background:var(--nf-bg-2);
  border-radius:var(--nf-radius-lg);
  padding:28px;margin-bottom:24px;
}
.nf-section-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:20px;padding-bottom:16px;
  border-bottom:1px solid var(--nf-border);
}
.nf-section-title{font-size:20px;font-weight:700;color:#fff}

/* ============ 11. 剧集 ============ */
.nf-play-source h3{font-size:15px;color:#fff;margin-bottom:10px}
.nf-episodes{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
  gap:10px;
}
.nf-ep{
  display:block;padding:12px 8px;text-align:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  border-radius:6px;color:#d1d1d1;
  font-size:14px;transition:all .2s;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.nf-ep:hover{background:rgba(229,9,20,.2);border-color:rgba(229,9,20,.5);color:#fff}
.nf-ep.active{background:var(--nf-red);border-color:var(--nf-red);color:#fff}

/* ============ 12. 简介 ============ */
.nf-desc p{font-size:15px;line-height:1.9;color:#d1d1d1;margin-bottom:14px}
.nf-desc-meta{
  margin-top:24px;padding-top:24px;
  border-top:1px solid var(--nf-border);
  display:flex;flex-direction:column;gap:12px;
}
.nf-meta-row{display:flex;gap:20px;font-size:14px}
.nf-meta-row > span:first-child{
  flex-shrink:0;width:60px;color:var(--nf-text-3);
}
.nf-meta-row a{color:#d1d1d1;margin-right:12px;transition:color .2s}
.nf-meta-row a:hover{color:var(--nf-red)}

/* ============ 13. 相关推荐 ============ */
.nf-related-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:16px;
}
.nf-related-grid .nf-card{width:100%}

/* ============ 14. 列表页 ============ */
.nf-list-main{
  max-width:1600px;margin:0 auto;
  padding:100px 4% 60px;
}
.nf-list-head{margin-bottom:30px}
.nf-list-head h1{font-size:32px;font-weight:800;margin-bottom:8px}
.nf-list-head p{color:var(--nf-text-2);font-size:14px}
.nf-list-head strong{color:var(--nf-red)}
.nf-filters{
  background:var(--nf-bg-2);
  border-radius:var(--nf-radius-lg);
  padding:24px;margin-bottom:30px;
  display:flex;flex-direction:column;gap:16px;
}
.nf-filter-row{display:flex;gap:16px;align-items:flex-start}
.nf-filter-label{
  flex-shrink:0;width:50px;
  color:var(--nf-text-3);font-size:14px;line-height:32px;
}
.nf-filter-options{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.nf-filter-options a{
  padding:6px 14px;border-radius:4px;
  font-size:14px;color:var(--nf-text-2);
  transition:all .2s;
}
.nf-filter-options a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nf-filter-options a.active{background:var(--nf-red);color:#fff}
.nf-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:20px;margin-bottom:40px;
}
.nf-grid .nf-card{width:100%}

/* ============ 15. 分页 ============ */
.nf-pagination{
  display:flex;justify-content:center;align-items:center;
  gap:6px;flex-wrap:wrap;
}
.nf-pagination a{
  display:inline-block;padding:8px 14px;
  background:var(--nf-bg-2);
  border:1px solid var(--nf-border);
  border-radius:4px;font-size:14px;
  color:#d1d1d1;transition:all .2s;
}
.nf-pagination a:hover{background:var(--nf-red);border-color:var(--nf-red);color:#fff}
.nf-pagination a.active{background:var(--nf-red);border-color:var(--nf-red);color:#fff}
.nf-pagination a.disabled{opacity:0.4;pointer-events:none}
.nf-pagination span{color:var(--nf-text-3);padding:0 6px}

/* ============ 16. 播放页 ============ */
.nf-play-main{max-width:1600px;margin:0 auto;padding:100px 4% 60px}
.nf-play-info{margin-bottom:30px}
.nf-play-crumb{font-size:13px;color:var(--nf-text-2);margin-bottom:12px}
.nf-play-crumb a{color:var(--nf-text-2)}
.nf-play-crumb a:hover{color:var(--nf-red)}
.nf-play-crumb span{margin:0 8px;opacity:0.5}
.nf-play-crumb em{color:#fff;font-style:normal}
.nf-play-title{font-size:28px;font-weight:800;margin-bottom:12px}
.nf-play-meta{display:flex;gap:8px;color:var(--nf-text-2);font-size:14px}

/* ============ 17. 播放器容器 ============ */
.nf-play-player{
  position:relative;
  width:100%;
  background:#000;
  border-radius:var(--nf-radius-lg);
  overflow:hidden;
  margin-bottom:24px;
}
.nf-play-video{
  position:relative;
  width:100%;
  padding-bottom:56.25%; /* 16:9 */
  height:0;
  display:block;
  overflow:hidden;
  background:#000;
}
.nf-play-video > *{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
}
.nf-play-video .MacPlayer,
.nf-play-video .mac_player,
.nf-play-video #player,
.nf-play-video #MacPlayer{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  display:block;
  overflow:hidden;
}
.nf-play-video iframe,
.MacPlayer iframe,
.mac_player iframe{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  border:0;
  display:block;
}
.nf-play-video video{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  object-fit:contain;
  background:#000;
}
.nf-play-placeholder{
  position:absolute;top:0;left:0;
  width:100%;height:100%;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:16px;color:var(--nf-text-3);
}
.nf-play-placeholder svg{color:var(--nf-red);opacity:0.6}

/* ============ 18. 一周更新表 ============ */
.nf-week{margin-bottom:50px}
.nf-week-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:18px;flex-wrap:wrap;gap:16px;
}
.nf-week-tabs{
  display:flex;gap:6px;
  background:var(--nf-bg-2);
  padding:6px;border-radius:8px;
  overflow-x:auto;
}
.nf-week-tabs::-webkit-scrollbar{height:0}
.nf-week-tab{
  padding:8px 18px;border-radius:6px;
  font-size:14px;color:var(--nf-text-2);
  white-space:nowrap;transition:all .2s;
  background:transparent;
}
.nf-week-tab:hover{color:#fff;background:rgba(255,255,255,.06)}
.nf-week-tab.active{background:var(--nf-red);color:#fff;font-weight:600}
.nf-week-panels{
  background:var(--nf-bg-2);
  border-radius:var(--nf-radius-lg);
  padding:20px;min-height:180px;
}
.nf-week-panel{display:none;animation:nfFadeIn .3s ease}
.nf-week-panel.active{display:block}
@keyframes nfFadeIn{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.nf-week-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:12px;
}
.nf-week-item{
  display:flex;gap:12px;padding:10px;
  border-radius:8px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  transition:all .2s;
}
.nf-week-item:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(229,9,20,.4);
  transform:translateX(4px);
}
.nf-week-cover{
  flex-shrink:0;width:60px;height:84px;
  border-radius:6px;object-fit:cover;
  background-color:var(--nf-bg-3);
  display:block;
}
.nf-week-info{
  flex:1;min-width:0;
  display:flex;flex-direction:column;
  justify-content:center;gap:4px;
}
.nf-week-info h4{
  font-size:14px;font-weight:600;color:#fff;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.nf-week-info p{
  font-size:12px;color:var(--nf-text-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.nf-week-time{
  display:inline-block;align-self:flex-start;
  padding:1px 8px;font-size:11px;
  background:rgba(229,9,20,.2);color:#ff6b6b;
  border-radius:3px;margin-top:2px;
}

/* ============================================================
   19. 响应式
   ============================================================ */

/* ---- 平板 / 大手机（<992px） ---- */
@media (max-width:991px){

  /* 导航 */
  .nf-nav{display:none}

  /* Hero */
  .nf-hero{height:70vh;min-height:500px}
  .nf-hero-title{font-size:40px}

  /* 详情页 */
  .nf-detail-hero{
    min-height:auto;
    padding:90px 4% 24px;
    align-items:flex-start;
  }
  .nf-detail-content{
    flex-direction:column;
    align-items:center;
    gap:20px;
    padding-top:0;
  }
  .nf-detail-poster{width:130px;margin:0 auto}
  .nf-detail-info{width:100%;text-align:left;padding-bottom:0}
  .nf-detail-title{font-size:22px;line-height:1.3}
  .nf-detail-title small{
    display:block;font-size:14px;margin-top:4px;
  }
  .nf-detail-crumb{font-size:12px;word-break:break-all}
  .nf-detail-meta{gap:6px}
  .nf-tag{font-size:12px;padding:3px 8px}
  .nf-detail-desc{
    font-size:14px;line-height:1.7;
    margin-bottom:16px;
    -webkit-line-clamp:4;
  }
  .nf-detail-actions{flex-wrap:wrap}
  .nf-detail-actions .nf-btn{
    flex:1 1 45%;
    justify-content:center;
    padding:10px 16px;
    font-size:14px;
  }
  .nf-detail-main{padding:20px 4%}

  /* 区块 */
  .nf-section{padding:16px;border-radius:8px;margin-bottom:16px}
  .nf-section-title{font-size:16px}
  .nf-section-head{margin-bottom:14px;padding-bottom:12px}

  /* 剧集 */
  .nf-play-source h3{font-size:14px}
  .nf-episodes{
    grid-template-columns:repeat(auto-fill,minmax(64px,1fr));
    gap:8px;
  }
  .nf-ep{padding:10px 4px;font-size:13px}

  /* 简介信息表 */
  .nf-meta-row{
    flex-direction:column;gap:6px;
    padding:8px 0;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .nf-meta-row > span:first-child{
    width:auto;font-size:12px;
    color:#999;margin-bottom:2px;
  }
  .nf-meta-row > span:last-child{
    font-size:14px;line-height:1.7;word-break:break-all;
  }
  .nf-desc p{font-size:14px;line-height:1.8}

  /* 相关推荐 */
  .nf-related-grid{
    grid-template-columns:repeat(3,1fr);
    gap:10px;
  }

  /* 播放页 */
  .nf-play-main{padding:80px 4% 40px}
  .nf-play-player{
    border-radius:0;
    margin:0 -4% 16px;
    width:calc(100% + 8%);
  }
  .nf-play-info{margin-bottom:20px}
  .nf-play-crumb{font-size:12px;word-break:break-all}
  .nf-play-title{font-size:18px;line-height:1.4}
  .nf-play-meta{font-size:13px;flex-wrap:wrap}

  /* 列表页 */
  .nf-list-main{padding:80px 4% 40px}
  .nf-list-head h1{font-size:22px}
  .nf-list-head p{font-size:13px}
  .nf-filters{
    padding:16px;border-radius:8px;
    gap:12px;margin-bottom:20px;
  }
  .nf-filter-row{flex-direction:column;gap:8px}
  .nf-filter-label{width:auto;line-height:1.4;font-size:13px}
  .nf-filter-options{gap:6px}
  .nf-filter-options a{padding:5px 10px;font-size:13px}

  /* 分类页网格：强制 2 列 */
  .nf-list-main .nf-grid,
  .nf-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    margin-bottom:20px;
  }
  .nf-grid .nf-card{
    width:100%;
    flex-shrink:1;
  }
  .nf-grid .nf-card-img{
    width:100%;
    aspect-ratio:2/3;
    object-fit:cover;
    height:auto;
  }
  .nf-grid .nf-card-info h3{
    font-size:13px;line-height:1.4;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .nf-grid .nf-card-info p{font-size:11px}

  /* 分页 */
  .nf-pagination{gap:4px}
  .nf-pagination a{
    padding:6px 10px;font-size:13px;
    min-width:32px;text-align:center;
  }
}

/* ---- 小屏手机（<576px） ---- */
@media (max-width:575px){

  /* 导航 */
  .nf-header{padding:0 3%;height:56px}
  .nf-logo{font-size:20px}

  /* Hero */
  .nf-hero{
    height:auto;min-height:320px;
    padding-bottom:40px;
  }
  .nf-hero-content{padding:90px 4% 30px}
  .nf-hero-title{font-size:24px}
  .nf-hero-meta{font-size:12px;flex-wrap:wrap}
  .nf-hero-desc{
    font-size:13px;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .nf-hero-actions{gap:8px}
  .nf-hero-actions .nf-btn{padding:8px 16px;font-size:13px}

  /* 按钮 */
  .nf-btn{padding:10px 20px;font-size:14px}

  /* 卡片 */
  .nf-card{width:140px}

  /* 详情页 */
  .nf-detail-poster{width:110px}
  .nf-detail-title{font-size:20px}

  /* 区块 */
  .nf-section{padding:16px}
  .nf-row-title{font-size:18px}

  /* 相关推荐 2 列 */
  .nf-related-grid{grid-template-columns:repeat(2,1fr)}

  /* 列表页 2 列 */
  .nf-list-main .nf-grid,
  .nf-grid{
    grid-template-columns:repeat(2,1fr);
    gap:10px;
  }
  .nf-grid .nf-card-info h3{font-size:12px}

  /* 列表页首 */
  .nf-list-main{padding-top:80px}
  .nf-filter-row{flex-direction:column;gap:8px}
  .nf-filter-label{width:auto}

  /* 剧集更小 */
  .nf-episodes{
    grid-template-columns:repeat(auto-fill,minmax(56px,1fr));
    gap:6px;
  }
  .nf-ep{font-size:12px;padding:8px 2px}

  /* 分页 */
  .nf-pagination a{
    min-width:28px;padding:5px 8px;font-size:12px;
  }

  /* 周表 */
  .nf-week-head{flex-direction:column;align-items:flex-start}
  .nf-week-tabs{width:100%}
  .nf-week-list{grid-template-columns:1fr}
}

/* ---- 超小屏（<360px） ---- */
@media (max-width:359px){
  .nf-list-main .nf-grid,
  .nf-grid{
    grid-template-columns:repeat(2,1fr);
    gap:8px;
  }
  .nf-week-head{flex-direction:column;align-items:flex-start}
  .nf-week-tabs{width:100%}
  .nf-week-list{grid-template-columns:1fr}
}

/* ============================================================
   手机端详情页 - 图片放大修复
   ============================================================ */

/* 剧情简介内的所有图片 */
.nf-desc img,
.nf-desc-content img,
.entry-content img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 12px auto !important;
  border-radius: 8px !important;
  object-fit: contain !important;
}

/* 剧情简介段落，放大字号 */
.nf-desc p {
  font-size: 15px !important;
  line-height: 1.9 !important;
  margin-bottom: 12px !important;
}

/* 手机端详情页顶部海报放大 */
@media (max-width: 991px) {
  .nf-detail-poster {
    width: 180px !important;   /* 从 130px 加大到 180px */
    margin: 0 auto !important;
  }
  .nf-detail-hero {
    padding: 90px 4% 30px !important;
  }
  .nf-detail-content {
    gap: 16px !important;
  }
}

@media (max-width: 575px) {
  .nf-detail-poster {
    width: 160px !important;   /* 手机端 160px，比原来 110px 大一倍 */
  }
  .nf-desc img,
  .nf-desc-content img {
    margin: 10px auto !important;
    border-radius: 6px !important;
  }
}
/* ============================================================
   手机端菜单
   ============================================================ */

/* 汉堡按钮：PC隐藏，手机显示 */
.nf-menu-btn {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 24px;
  height: 18px;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
  margin-right: 12px;
}

.nf-menu-btn span {
  display: block;
  width: 100%;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: all .3s;
}

/* 遮罩层 */
.nf-drawer-mask {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .7);
  z-index: 998;
  opacity: 0;
  transition: opacity .3s;
  backdrop-filter: blur(4px);
}

.nf-drawer-mask.active {
  display: block;
  opacity: 1;
}

/* 侧边抽屉 */
.nf-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 78%;
  max-width: 320px;
  background: #1a1a1a;
  z-index: 999;
  transform: translateX(-100%);
  transition: transform .3s ease;
  overflow-y: auto;
  box-shadow: 4px 0 24px rgba(0, 0, 0, .5);
  display: flex;
  flex-direction: column;
}

.nf-drawer.active {
  transform: translateX(0);
}

.nf-drawer::-webkit-scrollbar {
  width: 4px;
}

.nf-drawer::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .15);
  border-radius: 2px;
}

.nf-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  flex-shrink: 0;
}

.nf-drawer-head .nf-logo {
  font-size: 20px;
  margin: 0;
}

.nf-drawer-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  cursor: pointer;
  transition: background .2s;
}

.nf-drawer-close:hover {
  background: rgba(255, 255, 255, .15);
}

.nf-drawer-nav {
  flex: 1;
  padding: 8px 0;
  display: flex;
  flex-direction: column;
}

.nf-drawer-item {
  display: block;
  padding: 14px 24px;
  font-size: 15px;
  color: #d1d1d1;
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  transition: all .2s;
  position: relative;
}

.nf-drawer-item:hover,
.nf-drawer-item:active {
  background: rgba(229, 9, 20, .1);
  color: #fff;
  padding-left: 30px;
}

.nf-drawer-item:hover::before,
.nf-drawer-item:active::before {
  content: '';
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 18px;
  background: #e50914;
  border-radius: 2px;
}

/* 打开菜单时禁止页面滚动 */
body.nf-drawer-open {
  overflow: hidden;
}

/* 只在手机端显示菜单按钮 */
@media (max-width: 991px) {
  .nf-menu-btn {
    display: flex;
  }
  .nf-header-inner {
    gap: 12px !important;
  }
}

/* PC端隐藏抽屉 */
@media (min-width: 992px) {
  .nf-drawer,
  .nf-drawer-mask {
    display: none !important;
  }
}
/* PC端强制隐藏汉堡和抽屉 */
@media (min-width: 992px) {
  .nf-menu-btn,
  #nfMenuBtn,
  .nf-drawer,
  #nfDrawer,
  .nf-drawer-mask,
  #nfDrawerMask {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}

/* 手机端强制显示汉堡 */
@media (max-width: 991px) {
  .nf-menu-btn,
  #nfMenuBtn {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    width: 24px !important;
    height: 18px !important;
  }
}
