/* 首页「发现页」：主图轮播、右侧推荐、继续观看、各分类「最近更新」 */
/* ================= 首页：发现页 ================= */
.home-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;margin:4px 0 26px}
.home-hero[hidden],.home-rows[hidden]{display:none}
.home-back{margin:0 0 12px}

/* 主图：海报放大加模糊当背景，左边文字、右边一张清晰的海报；主图始终是深色底，文字用白色 */
.hero-main{position:relative;min-height:340px;border-radius:14px;overflow:hidden;background:#0d0f12;isolation:isolate}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s linear .5s}
.hero-slide.on{opacity:1;visibility:visible;transition:opacity .5s ease}
.hero-bg{position:absolute;inset:-28px;background-size:cover;background-position:center;filter:blur(26px) saturate(1.15) brightness(.72);transform:scale(1.04)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,9,11,.9) 0%,rgba(8,9,11,.62) 52%,rgba(8,9,11,.28) 100%)}
.hero-body{position:relative;height:100%;display:flex;align-items:center;gap:30px;padding:30px 36px;box-sizing:border-box}
.hero-text{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:10px;color:#fff}
.hero-title{margin:0;font-size:30px;line-height:1.2;font-weight:700;letter-spacing:.01em;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.hero-sub{margin:0;font-size:14px;color:rgba(255,255,255,.74)}
.hero-plot{margin:0;max-width:56ch;font-size:14px;line-height:1.75;color:rgba(255,255,255,.84);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hero-tags{display:flex;flex-wrap:wrap;gap:6px}
.hero-tags span{padding:3px 10px;border-radius:999px;font-size:12.5px;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2)}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.hero-actions .btn{height:40px;padding:0 18px}
.hero-actions .btn svg{width:16px;height:16px;fill:currentColor}
.hero-actions .btn:not(.primary){color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.26)}
.hero-actions .btn:not(.primary):hover{background:rgba(255,255,255,.22)}
.hero-poster{position:relative;flex:none;width:176px;aspect-ratio:2/3;border-radius:10px;overflow:hidden;background-size:cover;
  box-shadow:0 14px 38px rgba(0,0,0,.55);display:grid;place-items:center}
.hero-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-letter{font-size:56px;font-weight:700;color:rgba(255,255,255,.55)}

/* 右侧推荐：当前这张高亮，点哪个切到哪个 */
.hero-picks{display:flex;flex-direction:column;gap:10px;min-width:0}
.hero-pick{flex:1;display:flex;align-items:center;gap:12px;min-height:0;padding:10px;text-align:left;font:inherit;color:var(--text);
  border:1px solid var(--line);border-radius:12px;background:var(--card);cursor:pointer;transition:border-color .15s,background .15s}
.hero-pick:hover{border-color:var(--line-2);background:var(--card-hover)}
.hero-pick[aria-current="true"]{border-color:rgba(243,178,63,.6);background:rgba(243,178,63,.08)}
.hero-pick:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pick-thumb{flex:none;width:58px;aspect-ratio:2/3;border-radius:6px;background-size:cover;background-position:center}
.pick-info{min-width:0;display:flex;flex-direction:column;gap:3px}
.pick-title{font-size:14.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-sub{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick-tags{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 各分类「最近更新」：每行个数是设置里的「首页每行显示」（--home-cols，默认 6），每个分区两行；
   窗口放不下时和「每行显示」一样自动减少（每张至少 100px） */
:root{--home-cols:6}
.home-grid{grid-template-columns:repeat(auto-fill,minmax(max(100px,calc((100% - (var(--home-cols) - 1) * var(--gx)) / var(--home-cols))),1fr))}
.home-sec{margin:0 0 30px}
.home-sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.home-sec-head .section-title{margin:0}
.home-all{display:flex;justify-content:center;margin:4px 0 28px}
.home-all .btn{height:40px;padding:0 24px}

@media (prefers-reduced-motion:reduce){
  .hero-slide,.hero-slide.on{transition:none}
}

/* 平板：右侧推荐改成主图下面一排 */
@media (max-width:1000px){
  .home-hero{grid-template-columns:1fr}
  .hero-picks{flex-direction:row;overflow-x:auto;scrollbar-width:none}
  .hero-pick{flex:0 0 min(300px,82%)}
}
/* 手机：主图变矮、不放右边的清晰海报；分区改成一行、横向滑动 */
@media (max-width:640px){
  .hero-main{min-height:264px}
  .hero-body{padding:20px 18px;gap:0}
  .hero-poster{display:none}
  .hero-title{font-size:22px}
  .hero-plot{-webkit-line-clamp:2;font-size:13.5px}
  .hero-actions .btn{height:38px;padding:0 16px}
  .home-grid{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:calc((100% - 2 * var(--gx)) / 3.15);
    overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:4px}
  .home-grid .card{scroll-snap-align:start}
  /* 首页的「继续观看」只占一行：手机上横向滑动 */
  .cont-row.one-row{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(200px,64%);
    overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:4px}
  .cont-row.one-row .cont-card{scroll-snap-align:start}
}
