html{font-size:62.5%}

.cn-theme-novel{--m:var(--m-novel,var(--crimson))}
.cn-theme-video{--m:var(--m-video,var(--crimson))}
.cn-theme-comic{--m:var(--m-comic,var(--crimson))}
.cn-theme-audio{--m:var(--m-audio,var(--crimson))}

@media(min-width:761px){
  body[data-channel-page="list"][data-channel="novel"] .cn-chero__in,
  body[data-channel-page="list"][data-channel="comic"] .cn-chero__in,
  body[data-channel-page="list"][data-channel="audio"] .cn-chero__in{
    max-width:1180px;
  }

  body[data-channel-page="list"][data-channel="novel"] .cn-chero__t,
  body[data-channel-page="list"][data-channel="comic"] .cn-chero__t,
  body[data-channel-page="list"][data-channel="audio"] .cn-chero__t{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:clamp(30px,3vw,42px);
    line-height:1.1;
  }

  body[data-channel="comic"] .cn-chero__t--long,
  body[data-channel="novel"] .cn-chero__slide[data-hero-slide="5"] .cn-chero__t,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="1"] .cn-chero__t,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="2"] .cn-chero__t,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="3"] .cn-chero__t,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="4"] .cn-chero__t,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="5"] .cn-chero__t{
    font-size:clamp(28px,2.6vw,36px);
  }

  body[data-channel="comic"] .cn-chero__t--xl,
  body[data-channel="comic"] .cn-chero__slide[data-hero-slide="0"] .cn-chero__t{
    font-size:clamp(24px,2.3vw,32px);
  }
}

/* 四个频道页推荐位简介统一两行截断：video 的 Hero 是定高(cn-chero--wide)，
   放开三行会在长标题(两行)时把 CTA 顶出可视区，故与其余三个频道同为 2 行 */
body[data-channel-page="list"][data-channel="novel"] .cn-chero__d,
body[data-channel-page="list"][data-channel="comic"] .cn-chero__d,
body[data-channel-page="list"][data-channel="audio"] .cn-chero__d,
body[data-channel-page="list"][data-channel="video"] .cn-chero__d{
  -webkit-line-clamp:2;
}

@media(min-width:761px){
  body[data-channel-page="list"][data-channel="novel"] .cn-chero__d,
  body[data-channel-page="list"][data-channel="comic"] .cn-chero__d,
  body[data-channel-page="list"][data-channel="audio"] .cn-chero__d,
  body[data-channel-page="list"][data-channel="video"] .cn-chero__d{
    max-width:620px;
    margin-top:14px;
    line-height:1.62;
  }
}

.cn-entry{font-family:inherit;text-align:left;color:inherit;text-decoration:none}
button.cn-entry{appearance:none;-webkit-appearance:none}
/* 入口卡两个修饰类分工：--row 只管卡片横排(图标在左,高度 ~78px)，--six 只管六列栅格。
   视频频道 6 个入口两个都加；小说/漫画/有声 4 个入口只加 --row，列数走 .cn-entries 默认的 var(--ne,4)。 */
.cn-entries--six{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cn-entries--row .cn-entry{display:flex;flex-direction:row;align-items:center;gap:13px;min-height:74px;
  padding:16px 17px;border-radius:14px}
.cn-entries--row .cn-entry__ico{width:40px;height:40px;border-radius:11px;margin-bottom:0;flex:0 0 auto}
.cn-entries--row .cn-entry__b{position:relative;display:block;min-width:0}
.cn-entries--row .cn-entry__t{display:block;font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-entries--row .cn-entry__d{display:block;font-size:11.5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-entries--row .cn-entry__arr{display:none}
@media(min-width:680px){.cn-entries--six{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1000px){.cn-entries--six{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:679px){
  .cn-entries--row .cn-entry{height:78px;min-height:78px;gap:10px;padding:14px 12px}
  .cn-entries--row .cn-entry__ico{width:36px;height:36px;border-radius:10px}
  .cn-entries--row .cn-entry__t{font-size:14.5px}
}
.cn-rank{text-decoration:none;color:inherit}
.cn-rail__more svg{width:15px;height:15px}

.cn-rankback{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:14px;border-radius:50%;background:var(--fill-1);border:1px solid var(--line);color:var(--ink-2);cursor:pointer;transition:.16s}
.cn-rankback:hover{border-color:var(--mc);color:var(--mc);background:var(--fill-2)}

body[data-channel-page="tags"] > .mc-wrap{max-width:880px;margin:0 auto;padding:22px 18px 64px;display:flex;flex-direction:column;gap:18px}
@media(max-width:600px){body[data-channel-page="tags"] > .mc-wrap{padding:16px 14px 54px;gap:14px}}

.cn-chero__slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .55s ease}
.cn-chero__slide.is-active{opacity:1;pointer-events:auto}
.cn-chero__slide .cn-chero__bg,.cn-chero__slide .cn-chero__veil,.cn-chero__slide .cn-chero__in{position:absolute}

.cn-domsearch{display:inline-flex;align-items:center;gap:8px;height:34px;min-width:min(220px,34vw);padding:0 11px;border-radius:var(--r-pill);background:var(--fill-1);border:1px solid var(--line);color:var(--ink-3);transition:.16s}
.cn-domsearch:focus-within{border-color:var(--line-2);background:var(--fill-2);color:var(--ink-2)}
.cn-domsearch svg{width:14px;height:14px;flex:none;color:inherit}
.cn-domsearch input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:600 12.5px/1 var(--font-sans)}
.cn-domsearch input::placeholder{color:var(--ink-3)}
@media(max-width:760px){.cn-domsearch{min-width:0;flex:1 1 auto}.cn-domsearch input{font-size:16px}}

.cn-fp__headR{display:flex;align-items:center;gap:8px;margin-left:auto}
.cn-filterpanel.open{display:block}
.cn-sortpanel.open{display:block}
.cn-filterpanel .cn-fgroup{display:block;margin:8px 0 14px}
.cn-filterpanel .cn-grp__lbl{display:block;margin:0 0 9px;font-size:12px;font-weight:800;color:var(--ink-3)}
.cn-filterpanel .cn-grp{display:flex;flex-wrap:wrap;gap:8px}
.cn-filterpanel--g .cn-fp__foot{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.cn-active[hidden],.cn-empty[hidden],.cn-pager[hidden]{display:none!important}

@media(max-width:760px){
  .cn-chero--wide .cn-chero__in{margin-left:auto;margin-right:auto}
  .cn-chero--wide .cn-chero__slide.is-active{position:relative}
  .cn-chero--wide .cn-chero__slide .cn-chero__in{position:relative}
  .cn-chero--wide .cn-chero__in{left:auto;right:auto}
  .cn-chero--wide .cn-chero__cta{flex-wrap:nowrap}
  .cn-chero--wide .cn-chero__cta .cn-cbtn{flex:1 1 0;min-width:0}
  .cn-chero--wide .cn-chero__bg img{filter:blur(13px) brightness(.26) saturate(1.05)!important;transform:scale(1.3)!important;animation:none!important}
  .cn-chero--wide .cn-chero__veil{background:rgba(8,8,12,.84)!important}
  .cn-chero--wide .cn-chero__veil::after{box-shadow:inset 0 -78px 88px -52px var(--paper)!important}
  .cn-chero--wide .cn-chero__t{color:#fff!important;text-shadow:0 2px 16px rgba(0,0,0,.95)!important}
  .cn-chero--wide .cn-cstat,.cn-chero--wide .cn-cstat b{color:#fff!important}
  .cn-chero--wide .cn-cstat em{color:rgba(255,255,255,.72)!important}
}

.tagref-intro{font-size:1.4rem;line-height:1.8;color:var(--ink-2);margin:0}
.tagref-count{color:var(--ink-3);font-size:1.3rem;margin-top:8px}
.tagref-list{display:flex;flex-direction:column}
.tagref-row{display:grid;grid-template-columns:132px 1fr;gap:6px 20px;padding:13px 0;border-bottom:1px solid var(--line);align-items:baseline}
.tagref-row:last-child{border-bottom:0}
.tagref-term{justify-self:start;display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;font-size:1.3rem;font-weight:700;color:var(--mc);background:var(--fill-1);border:1px solid var(--line);text-decoration:none;white-space:nowrap;transition:.15s}
.tagref-term:hover{background:var(--mc);color:#fff;border-color:var(--mc)}
.tagref-desc{font-size:1.4rem;line-height:1.7;color:var(--ink-2)}
@media(max-width:560px){.tagref-row{grid-template-columns:1fr;gap:6px;padding:12px 0}}

.cn-edlg[hidden]{display:none}
.cn-edlg{position:fixed;inset:0;z-index:var(--z-modal,1200);display:flex;align-items:center;justify-content:center}
.cn-edlg__veil{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(3px)}
.cn-edlg__panel{position:relative;z-index:1;width:min(400px,92vw);background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:0 26px 70px rgba(0,0,0,.5);padding:24px 22px}
.cn-edlg__x{position:absolute;top:11px;right:12px;border:0;background:transparent;color:var(--ink-3);font-size:24px;line-height:1;cursor:pointer;width:34px;height:34px;border-radius:50%;transition:.15s}
.cn-edlg__x:hover{background:var(--fill-1);color:var(--ink)}
.cn-edlg__t{margin:0 0 12px;font-family:var(--font-serif);font-weight:800;font-size:19px;color:var(--ink);text-align:center;padding:0 34px}
.cn-edlg__b{font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.cn-edlg__b a{color:var(--mc);font-weight:700;text-decoration:none}
.cn-edlg__b a:hover{text-decoration:underline}
body.cn-edlg-lock{overflow:hidden}
/* H5 上也保持居中弹窗：原来是贴底抽屉(align-items:flex-end + 满宽 + 只圆上两角)，
   与站内其他确认框/提示框的形态不一致，且底部正好压住 tabbar。宽度由 .cn-edlg__panel 的 min(400px,92vw) 收着，
   两侧再留一点内边距，窄屏上不会顶到屏幕边。 */
@media(max-width:560px){.cn-edlg{padding:0 16px}.cn-edlg__panel{padding:22px 18px}}

/* ============================================================
   H5 左右留白收窄 —— 仅小说 / 漫画 / 有声 / 视频四个频道页(body[data-channel])
   ============================================================
   每侧其实是**两层**留白叠出来的，只收其中一层没用：
     ①页面横向内距 clamp(16px,5vw,72px) —— H5 段全靠 5vw，≤760px 最大能吃到 38px；
     ②列表卡自身的 .cn-lcard padding:14px。
   两层叠起来每侧 ~30-50px，390px 的屏上正文可用宽度只剩六成。
   这里两层一起收：①→clamp(8px,2vw,12px)，②→10px，每侧合计 18-22px。

   ⚠️ 必须把同屏所有横向容器一起改，只改列表墙的话，上面的功能入口、筛选卡、吸顶筛选条
   会与卡片左右对不齐。Hero 不动 —— 它是满幅背景图，内部文字定位另有一套 H5 规则(见 cine.css
   的 .cn-chero--wide 段)，跟着改容易把那套排版弄乱，且它读起来不是"板块留白"。 */
@media(max-width:760px){
  body[data-channel]{--cn-gut-h5:clamp(8px,2vw,12px)}
  body[data-channel] .cn-entries,
  body[data-channel] .cn-filterbar__in,
  body[data-channel] .cn-wall,
  body[data-channel] .cn-wallhead,
  body[data-channel] .cn-rail__head,
  body[data-channel] .cn-scroller{
    padding-left:var(--cn-gut-h5);padding-right:var(--cn-gut-h5)
  }
  /* 筛选卡是 margin 撑的左右留白，不是 padding */
  body[data-channel] .cn-fcard{margin-left:var(--cn-gut-h5);margin-right:var(--cn-gut-h5)}
  /* 第二层：列表卡自己的内边距。封面与右侧文字之间的 gap 同步收一档，
     省下来的宽度全给正文(标题/简介/标签行少换一次行) */
  body[data-channel] .cn-wall--list .cn-lcard{padding:10px;gap:11px}
}