:root{
    --c-main:#0E1B26;
    --c-sub:#00D9C0;
    --c-bg:#F2F7F6;
    --c-accent:#FF3D71;
    --c-ink:#12232E;
    --c-ink-soft:#3C5563;
    --c-line:#D3E3E0;
    --radius:16px;
    --shadow-1:0 2px 6px rgba(14,27,38,.06);
    --shadow-2:0 10px 26px rgba(14,27,38,.10),0 2px 8px rgba(0,0,0,.05);
    --gap:18px;
    --sec:64px;
    --pad:20px;
  }
  *{box-sizing:border-box}
  html{font-size:16px;scroll-behavior:smooth}
  body{
    margin:0;background:var(--c-bg);color:var(--c-ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    font-size:15px;line-height:1.75;-webkit-font-smoothing:antialiased;
  }
  img{width:100%;height:100%;object-fit:cover;display:block}
  a{color:var(--c-main);text-decoration:none}
  a:hover{color:var(--c-accent)}
  :focus-visible{outline:2px solid var(--c-accent);outline-offset:3px;border-radius:6px}
  .wrap{max-width:1240px;margin:0 auto;padding:0 var(--pad)}
  h1,h2,h3,p{margin:0}
  /* 顶部品牌区 */
  .topbar{position:sticky;top:0;z-index:50;background:rgba(242,247,246,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--c-line)}
  .topbar-in{display:flex;align-items:center;gap:16px;min-height:64px}
  .brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;color:var(--c-main);letter-spacing:.5px;white-space:nowrap}
  .brand .dot{width:26px;height:26px;border-radius:50%;background:var(--c-main);display:grid;place-items:center;color:var(--c-sub);font-size:13px;font-weight:800}
  .nav{display:flex;gap:6px;margin-left:8px;flex:1;flex-wrap:wrap}
  .nav a{padding:8px 12px;border-radius:100px;font-size:14px;color:var(--c-ink-soft)}
  .nav a:hover,.nav a:focus-visible{background:var(--c-sub);color:var(--c-main)}
  .search{display:flex;align-items:center;border:1px solid var(--c-line);background:#fff;border-radius:100px;padding:4px 4px 4px 14px;box-shadow:var(--shadow-1)}
  .search input{border:0;outline:0;font-size:14px;width:150px;background:transparent;color:var(--c-ink);font-family:inherit}
  .search button{height:36px;border:0;border-radius:100px;background:var(--c-main);color:#fff;font-size:13px;padding:0 16px;cursor:pointer;font-family:inherit}
  .search button:hover{background:var(--c-accent)}
  .menu-btn{display:none;height:42px;padding:0 16px;border-radius:100px;border:1px solid var(--c-line);background:#fff;color:var(--c-main);font-size:14px;cursor:pointer;font-family:inherit}
  /* 面包屑 */
  .crumb{font-size:13.5px;color:var(--c-ink-soft);padding:18px 0 0}
  .crumb a{color:var(--c-ink-soft)}
  .crumb span[aria-current]{color:var(--c-main);font-weight:600}
  /* Hero magazine */
  .hero{position:relative;padding:28px 0 8px;overflow:hidden}
  .hero .circle-a,.hero .circle-b{position:absolute;border-radius:50%;pointer-events:none;z-index:0}
  .hero .circle-a{width:320px;height:320px;background:rgba(0,217,192,.16);top:-120px;right:-90px}
  .hero .circle-b{width:200px;height:200px;background:rgba(255,61,113,.10);bottom:-90px;left:-70px}
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr .9fr;gap:36px;align-items:end}
  .hero h1{font-size:34px;line-height:1.24;color:var(--c-main);letter-spacing:-.5px}
  .hero .hook{font-size:16px;line-height:1.8;color:var(--c-ink-soft);margin-top:16px;max-width:56ch}
  .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
  .tag{font-size:13px;line-height:1.4;padding:6px 12px;border-radius:100px;background:#fff;color:var(--c-main);border:1px solid var(--c-line)}
  .tag.hot{background:var(--c-main);color:#fff;border-color:var(--c-main)}
  .meta-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px;font-size:13.5px;color:var(--c-ink-soft)}
  .meta-row b{color:var(--c-accent);font-size:15px}
  .cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
  .btn{display:inline-flex;align-items:center;justify-content:center;height:46px;padding:0 24px;border-radius:100px;font-size:14px;font-weight:600;cursor:pointer;border:1px solid transparent;font-family:inherit;transition:background .18s,color .18s,transform .18s}
  .btn-main{background:var(--c-main);color:#fff}
  .btn-main:hover{background:var(--c-accent);color:#fff;transform:translateY(-1px)}
  .btn-ghost{background:#fff;color:var(--c-main);border-color:var(--c-line)}
  .btn-ghost:hover{border-color:var(--c-sub);color:var(--c-main)}
  .poster{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-2);aspect-ratio:3/4;background:#dbe9e6;position:relative}
  .poster .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:linear-gradient(to top,rgba(14,27,38,.82),transparent);color:#fff;font-size:13.5px;line-height:1.5}
  /* 通用栏目 */
  section{padding-top:var(--sec)}
  .sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:20px}
  .sec-head h2{font-size:22px;line-height:1.3;color:var(--c-main);letter-spacing:-.2px}
  .sec-head h2::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c-accent);margin-right:10px;vertical-align:middle}
  .sec-desc{font-size:14.5px;line-height:1.7;color:var(--c-ink-soft);margin-top:8px;max-width:72ch}
  .more{font-size:13.5px;font-weight:600;color:var(--c-main);border-bottom:2px solid var(--c-sub);padding-bottom:2px}
  /* 分类导航 */
  .cat-scroll{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
  .cat{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-1);display:block;transition:transform .18s,box-shadow .18s,border-color .18s}
  .cat:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--c-sub);color:var(--c-main)}
  .cat h3{font-size:16px;line-height:1.4;color:var(--c-main)}
  .cat p{font-size:13.5px;line-height:1.6;color:var(--c-ink-soft);margin-top:6px}
  /* 剧集卡片网格 */
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--gap)}
  .card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-1);display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
  .card:hover{transform:translateY(-3px);box-shadow:var(--shadow-2)}
  .card .cover{aspect-ratio:3/4;background:#dbe9e6}
  .card .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
  .card h3{font-size:16.5px;line-height:1.4;color:var(--c-main)}
  .card .desc{font-size:13.5px;line-height:1.65;color:var(--c-ink-soft);flex:1}
  .card .foot{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--c-ink-soft);gap:8px}
  .card .go{color:var(--c-main);font-weight:600}
  .card .go:hover{color:var(--c-accent)}
  /* 剧情简介 */
  .story-box{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-2);padding:24px;display:grid;grid-template-columns:1fr;gap:16px}
  .story-box p{font-size:15.5px;line-height:1.8;color:var(--c-ink-soft)}
  .story-box p strong{color:var(--c-main)}
  .highlights{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-top:20px}
  .hl{background:#fff;border-left:4px solid var(--c-sub);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow-1)}
  .hl h3{font-size:16px;line-height:1.4;color:var(--c-main);margin-bottom:6px}
  .hl p{font-size:13.5px;line-height:1.65;color:var(--c-ink-soft)}
  /* 人物关系 */
  .people{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--gap)}
  .person{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-1);text-align:center}
  .person .ava{width:88px;height:88px;border-radius:50%;overflow:hidden;margin:0 auto 12px;border:3px solid var(--c-sub)}
  .person h3{font-size:16.5px;color:var(--c-main);line-height:1.4}
  .person .role{font-size:13px;color:var(--c-accent);font-weight:600;margin-top:4px}
  .person p{font-size:13.5px;line-height:1.65;color:var(--c-ink-soft);margin-top:8px}
  /* 追剧队列 */
  .queue-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}
  .queue-count{font-size:14px;color:var(--c-ink-soft)}
  .queue-count b{color:var(--c-accent);font-size:16px}
  .ep{display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;background:#fff;border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-1);margin-bottom:12px}
  .ep .num{width:56px;height:56px;border-radius:12px;background:var(--c-main);color:var(--c-sub);display:grid;place-items:center;font-weight:800;font-size:15px}
  .ep h3{font-size:16px;line-height:1.4;color:var(--c-main)}
  .ep p{font-size:13.5px;line-height:1.6;color:var(--c-ink-soft);margin-top:4px}
  .ep .emeta{font-size:12.5px;color:var(--c-ink-soft);margin-top:4px}
  .ep-btn{height:42px;padding:0 20px;border-radius:100px;border:1px solid var(--c-line);background:#fff;color:var(--c-main);font-size:13.5px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit;transition:all .18s}
  .ep-btn:hover{border-color:var(--c-sub)}
  .ep-btn.on{background:var(--c-accent);border-color:var(--c-accent);color:#fff}
  .toggle-ep{height:44px;padding:0 22px;border-radius:100px;border:1px dashed var(--c-line);background:transparent;color:var(--c-main);font-size:14px;cursor:pointer;margin-top:6px;font-family:inherit}
  .toggle-ep:hover{border-color:var(--c-sub)}
  .hide{display:none}
  /* 相关推荐 */
  .rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--gap)}
  .rel .card .cover{aspect-ratio:2/3}
  /* 标签云 */
  .tagcloud{display:flex;flex-wrap:wrap;gap:10px}
  .tagcloud .tag{cursor:pointer}
  .tagcloud .tag:hover{background:var(--c-sub);border-color:var(--c-sub);color:var(--c-main)}
  .tagcloud .tag.active{background:var(--c-accent);border-color:var(--c-accent);color:#fff}
  /* FAQ */
  .faq{display:grid;gap:12px}
  .faq details{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-1);padding:16px 20px}
  .faq summary{font-size:15.5px;font-weight:600;color:var(--c-main);cursor:pointer;line-height:1.5}
  .faq summary::marker{color:var(--c-accent)}
  .faq p{font-size:14.5px;line-height:1.75;color:var(--c-ink-soft);margin-top:10px}
  /* 友情链接 */
  .links{display:flex;flex-wrap:wrap;gap:10px}
  .links a{font-size:13.5px;padding:6px 12px;border-radius:100px;background:#fff;border:1px solid var(--c-line);color:var(--c-ink-soft)}
  .links a:hover{border-color:var(--c-sub);color:var(--c-main)}
  /* 页脚 */
  footer{margin-top:var(--sec);background:var(--c-main);color:#c8d9df;padding:48px 0 28px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
  footer h3{font-size:15px;color:#fff;margin-bottom:12px;line-height:1.4}
  footer p,footer a{font-size:13px;line-height:1.7;color:#c8d9df}
  footer a:hover{color:var(--c-sub)}
  .foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
  .foot-note{font-size:12.5px;line-height:1.6;color:#9fb6bf;margin-top:28px;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center}
  .foot-note a{font-size:12.5px;color:#c8d9df}
  .top-btn{position:fixed;right:18px;bottom:22px;height:46px;padding:0 18px;border-radius:100px;border:0;background:var(--c-accent);color:#fff;font-size:13.5px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-2);z-index:40;font-family:inherit}
  .top-btn:hover{background:var(--c-main)}
  /* 响应式 */
  @media (min-width:720px){
    :root{--pad:32px;--sec:72px}
    body{font-size:16px}
    .hero h1{font-size:46px}
    .sec-head h2{font-size:26px}
    .story-box{padding:30px}
    .story-box p{font-size:16.5px}
  }
  @media (min-width:1100px){
    :root{--pad:40px;--sec:80px}
    .hero h1{font-size:52px}
    .sec-head h2{font-size:28px}
  }
  @media (max-width:719px){
    .nav{display:none}
    .nav.open{display:flex;position:absolute;left:var(--pad);right:var(--pad);top:64px;background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow-2);flex-direction:column}
    .menu-btn{display:inline-flex;align-items:center}
    .search{display:none}
    .hero-grid{grid-template-columns:1fr;gap:24px}
    .hero h1{font-size:32px}
    .poster{max-width:340px}
    .foot-grid{grid-template-columns:1fr 1fr}
    .ep{grid-template-columns:48px 1fr;grid-template-areas:"num body" "num act"}
    .ep .num{grid-area:num;width:48px;height:48px}
    .ep .epbody{grid-area:body}
    .ep .ep-act{grid-area:act;justify-self:start;margin-top:6px}
  }
  @media (max-width:400px){
    :root{--pad:16px}
    .hero h1{font-size:30px}
    .grid,.rel,.people{grid-template-columns:1fr 1fr;gap:14px}
    .card .body{padding:14px}
    .card h3{font-size:15.5px}
    .cat-scroll{grid-template-columns:1fr 1fr}
  }
  @media (prefers-reduced-motion:reduce){
    *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  }