/* ==========================================================================
   奇阅小说 · 起点风格（design/ 落地）  novel.css
   --------------------------------------------------------------------------
   来源：design/assets/tokens.css + design/assets/common.css（v2 起点真身规格）
   令牌：统一 --qd-* 单一命名空间（原设计稿令牌机械改名，语义一一对应）

   ⚠️ 只被「小说」模板引入，漫画模板不引入 → 漫画区零影响。
   ⚠️ 全部悬停态规则已包裹进 @media (hover:hover) and (pointer:fine)（触摸端守卫）。
   ========================================================================== */

/* ---------------------------- 全局触摸守卫 ------------------------------- */
html, body { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

/* ---------------------------- 设计令牌（唯一来源）------------------------- */
:root {

  /* ---------- 品牌橙（番茄风主色，非砖红）---------- */
  /* 依据：番茄官方 CSS 实测 —— #ff5f00 ×68（品牌橙，最高频）*/
  --qd-red:       #ff5f00;   /* 按钮 / 强调底色（变量名沿用，值改橙）*/
  --qd-red-hover: #fa6725;   /* hover（番茄次色 ×61）*/
  --qd-red-deep:  #ff4f00;   /* 按下（番茄主色深 ×27）*/
  --qd-red-grad:  linear-gradient(135deg,#ff8b07 0%,#ff5f00 100%);

  /* 橙渐变（番茄暖橙，供 hero / 徽标用）*/
  --qd-brand-grad: linear-gradient(135deg,#ff8b07 0%,#ff5f00 100%);

  /* 橙阶（番茄暖橙渐变三阶）*/
  --qd-brand-1:   #ffd3a0;
  --qd-brand-2:   #ffa33a;
  --qd-brand-3:   #ff8b07;
  --qd-brand-tint:#fff5ee;   /* 极浅橙底：hover / 选中态 */

  /* ---------- 次级蓝（链接 / 次级按钮）---------- */
  /* 番茄 --primary-color 实为蓝 #3370ff（×24），橙色是硬编码品牌色 */
  --qd-link:       #3370ff;
  --qd-link-hover: #6694ff;
  --qd-link-bg:    #ccdbff;

  /* ---------- 文字 ---------- */
  --qd-text:   #282f38;   /* 标题 / 深（番茄 --font-color）*/
  --qd-text-2: #404040;   /* 正文 */
  --qd-text-3: #a4a4a4;   /* 辅助 */
  --qd-text-4: #b3b3b3;   /* 弱化 / 占位 */

  /* ---------- 背景 / 线 ---------- */
  --qd-bg:      #f5f5f5;   /* 页面底（番茄）*/
  --qd-bg-warm: #fff6f0;   /* 页面顶暖色氛围底（hero 渐隐目标色，二者必须一致）*/
  --qd-bg-2:    #f2f2f2;   /* 筛选条 / 搜索通栏 */
  --qd-bg-3:    #fafafa;   /* 浅卡片区（番茄 ×12）*/
  --qd-bg-4:    #f7f7f7;   /* 次级底 */
  --qd-card:    #fff;
  --qd-border:  #e6e8eb;
  --qd-border-2:#c2c6cc;
  --qd-border-3:#eef0f2;

  /* ---------- 语义色（番茄）---------- */
  --qd-green:   #0fbf60;
  --qd-green-2: #14ed78;
  --qd-orange:  #ff8b07;   /* 番茄 warning */
  --qd-yellow:  #ffd3a0;
  --qd-beige:   #d9d4c7;
  --qd-gold:    #bfa16a;

  /* ---------- 尺寸 ---------- */
  --qd-page-w: 1200px;   /* ★ 番茄实测内容宽（非 1200/1440）*/
  --qd-line:   32px;    /* 列表行高 */
  --qd-btn-h:  36px;    /* 主按钮高（番茄风，比起点 34 略高）*/
  --qd-gap:    20px;
  --qd-header-h:64px;
  --qd-side-w: 240px;   /* ★ P1：侧栏 280→240，为书卡让出空间 */

  /* ---------- 圆角（番茄风的灵魂，与起点正相反）---------- */
  --qd-radius-sm:   2px;    /* 标签 */
  --qd-radius-md:   4px;    /* 按钮 / 输入框 */
  --qd-radius:      8px;    /* ★ 卡片 / 封面 */
  --qd-radius-xl:   12px;   /* 大容器 */
  --qd-radius-pill: 999px;  /* 胶囊 */
  --qd-radius-circle: 50%;  /* 正圆（如 hero 左右按钮）*/

  /* ---------- 阴影（克制：靠层次不靠重影）---------- */
  --qd-shadow-cover: 0 6px 16px rgba(0,0,0,.12);
  --qd-shadow-card:  0 4px 10px rgba(0,0,0,.1);
  --qd-shadow-hover: 0 4px 20px rgba(0,0,0,.08);

  /* ---------- 字体（现代无衬线，去宋体）---------- */
  --qd-font: "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;
  --qd-font-hei: "PingFang SC","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif;
  --qd-font-num: "DIN Alternate","Helvetica Neue",Arial,sans-serif;

  /* ---------- 层级 ---------- */
  --qd-z-header:  100;
  --qd-z-dropdown:110;

}


/* ---------------------------------- 重置 --------------------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font:14px/1.6 var(--qd-font);
  color:var(--qd-text);background:var(--qd-bg);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;transition:color .15s}
img{display:block;max-width:100%}
ul,ol{list-style:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;outline:none}
h1,h2,h3,h4{font-weight:600;line-height:1.35}
em,i{font-style:normal}

/* ---------------------------------- 布局 --------------------------------- */
.wrap{width:var(--qd-page-w);max-width:96%;margin:0 auto}
.box-center{width:var(--qd-page-w);max-width:96%;margin:0 auto}
.page-main{padding:18px 0 40px}
.layout-side{display:flex;gap:var(--qd-gap);align-items:flex-start}
.layout-side > .main{flex:1;min-width:0}
.layout-side > .side{width:var(--qd-side-w);flex:none}

.grid{display:grid;gap:var(--qd-gap)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-5{grid-template-columns:repeat(5,1fr)}
.grid-6{grid-template-columns:repeat(6,1fr)}

/* ---------------------------------- 头部 --------------------------------- */
/* 起点顶栏：白底 + 1px 底线，无阴影 */
.site-header{
  position:sticky;top:0;z-index:var(--qd-z-header);
  background:#fff;border-bottom:1px solid var(--qd-border);
}
.site-header__inner{display:flex;align-items:center;gap:24px;height:var(--qd-header-h)}
.site-logo{
  display:flex;align-items:center;gap:7px;flex:none;
  font:700 22px/1 var(--qd-font);color:var(--qd-red);letter-spacing:.5px;
}
.site-logo__mark{
  width:32px;height:32px;flex:none;
  background:var(--qd-red-grad);border-radius:var(--qd-radius-md);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font:700 16px/1 var(--qd-font);
}
.site-nav{display:flex;align-items:center;gap:0;flex:none}
.site-nav a{
  position:relative;font:14px/var(--qd-header-h) var(--qd-font);color:var(--qd-text);
  padding:0 25px;height:var(--qd-header-h);display:inline-block;
}
.site-nav a.is-active{color:var(--qd-red);font-weight:700}
.site-nav a.is-active::after{
  content:"";position:absolute;left:25px;right:25px;bottom:0;height:2px;background:var(--qd-red);
}
.site-header__right{display:flex;align-items:center;gap:10px;margin-left:auto;flex:none}

/* 顶栏搜索（小） */
.search-box{
  display:flex;align-items:center;
  background:#fff;border:1px solid var(--qd-border-2);
  height:34px;width:220px;
}
.search-box:focus-within{border-color:var(--qd-red)}
.search-box input{
  flex:1;min-width:0;border:0;background:transparent;
  padding:0 12px;font-size:13px;height:32px;
}
.search-box input::placeholder{color:var(--qd-text-3)}
.search-box button{
  border:0;background:var(--qd-red);color:#fff;
  height:34px;padding:0 16px;cursor:pointer;font-size:13px;
}

.head-link{font:14px/1 var(--qd-font);color:var(--qd-text-2)}

/* ------------------------- 搜索通栏（起点 80px）-------------------------- */
.filter-search-wrap{height:80px;background:var(--qd-bg-2)}
.filter-search-wrap .box-center{display:flex;align-items:center;height:80px}
.filter-search-box{display:flex;align-items:center;height:80px}
.filter-search-box .ftitle{
  width:126px;padding-left:0;font:14px/80px var(--qd-font);color:var(--qd-text);flex:none;
}
.filter-search{display:flex;align-items:center;height:34px}
.filter-search input{
  width:692px;max-width:100%;height:34px;padding:0 12px;
  border:1px solid var(--qd-border-2);border-right:0;background:#fff;font-size:14px;
}
.filter-search input:focus{border-color:var(--qd-red)}
.filter-search .everyone{
  display:flex;align-items:center;gap:12px;margin-left:24px;
  font:12px/1 var(--qd-font);color:var(--qd-text-3);
}
.filter-search .everyone a{color:var(--qd-text-3)}

/* ---------------------------------- 按钮 --------------------------------- */
/* 起点按钮：方角、34px 高 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  height:var(--qd-btn-h);padding:0 18px;border:1px solid var(--qd-border);
  border-radius:var(--qd-radius-md);
  background:var(--qd-card);color:var(--qd-text-2);
  font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap;vertical-align:middle;
}
.btn--primary{
  background:var(--qd-red);border-color:var(--qd-red);color:#fff;
  box-shadow:0 2px 6px rgba(255,95,0,.24);
}
/* 起点 .red-btn */
.red-btn{background:var(--qd-red);border-color:var(--qd-red);color:#fff;text-align:center}
.btn--ghost{background:#fff;border-color:var(--qd-border-2);color:var(--qd-text)}
.btn--blue{background:#fff;border-color:var(--qd-border-2);color:var(--qd-link)}
.btn--block{width:100%}
.btn--lg{height:40px;padding:0 26px;font-size:15px}
.btn--sm{height:28px;padding:0 12px;font-size:13px}
.btn--xs{height:24px;padding:0 9px;font-size:12px}
.btn:disabled,.btn.is-disabled{opacity:.5;cursor:not-allowed}

/* 蓝色文字链（起点 .load-more） */
.load-more{
  display:inline-flex;align-items:center;gap:4px;
  font:14px/1 var(--qd-font);color:var(--qd-link);
}
.load-more::after{
  content:"";width:0;height:0;margin-top:3px;
  border-top:5px solid currentColor;border-right:5px solid transparent;border-left:5px solid transparent;
}

/* ---------------------------------- 标签 --------------------------------- */
.tag{
  display:inline-flex;align-items:center;height:20px;padding:0 7px;
  border-radius:var(--qd-radius-sm);
  font-size:12px;line-height:1;background:var(--qd-brand-tint);color:var(--qd-red);white-space:nowrap;
}
.tag--gray{background:#f2f2f2;color:var(--qd-text-2)}
.tag--blue{background:#eef2fa;color:var(--qd-link)}
.tag--green{background:#eafaf0;color:#2fa85a}
.tag--gold{background:#fdf6e3;color:var(--qd-gold)}
.tag--yellow{background:var(--qd-yellow);color:#8a6d1a}
.tag--outline{background:transparent;border:1px solid var(--qd-border);color:var(--qd-text-2)}

.status{font-size:12px;padding:1px 6px}
.status--serial{background:#eafaf0;color:#2fa85a}
.status--done{background:#f2f2f2;color:var(--qd-text-2)}

/* ---------------------------------- 卡片 --------------------------------- */
/* 扁平卡片：白底 + 1px 边框，无阴影 */
.card{background:var(--qd-card);border:1px solid var(--qd-border);border-radius:var(--qd-radius);margin-bottom:var(--qd-gap)}
.card__hd{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:0 18px;height:46px;border-bottom:1px solid var(--qd-border);
}
.card__hd h2,.card__hd h3{font-size:16px}
.card__hd .more{font-size:13px;color:var(--qd-link)}
.card__bd{padding:16px 18px}
.card__bd--tight{padding:0}

/* 区块标题（起点 .wrap-title 22px） */
.sec-hd{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:8px;margin-bottom:6px}
.sec-hd h2{font-size:22px;line-height:30px}
.sec-hd .more{font-size:13px;color:var(--qd-link)}

/* --------------------- 密集行式书单（起点核心结构）---------------------- */
/* 一行：分类(56px) + 书名(168px) + 作者，全部 14px/32px */
.hot-book-list dd{overflow:hidden;line-height:var(--qd-line)}
.hot-book-list dd a{
  float:left;margin-left:-8px;
  font:14px/var(--qd-line) var(--qd-font);color:var(--qd-text);
}
.hot-book-list dd a.classify{
  width:56px;height:var(--qd-line);margin-right:5px;color:var(--qd-text-4);overflow:hidden;
}
.hot-book-list dd a.name{width:168px;height:var(--qd-line);overflow:hidden}
.hot-book-list dd .author{float:left;font:12px/var(--qd-line) var(--qd-font);color:var(--qd-text-3)}

/* 通用密集行（分类/书名/作者/更新章/时间） */
.dense-list li{display:flex;align-items:center;gap:0;height:var(--qd-line);font:14px/var(--qd-line) var(--qd-font)}
.dense-list .classify{width:56px;flex:none;color:var(--qd-text-4);font-size:13px}
.dense-list .name{width:168px;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dense-list .author{width:90px;flex:none;color:var(--qd-text-3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dense-list .chap{flex:1;min-width:0;color:var(--qd-text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dense-list .time{width:86px;flex:none;text-align:right;color:var(--qd-text-3);font-size:12px;font-family:var(--qd-font-num)}

/* --------------------------------- 书籍卡 --------------------------------- */
.grid-books{display:grid;grid-template-columns:repeat(6,1fr);gap:20px 16px}
/* ★ P1 修复：首页带 240px 侧栏，6 列会把卡片挤到 132px（分类页 182px）
   → 首页缩为 5 列，使卡片宽度与分类页对齐 */
.grid-books--sm{grid-template-columns:repeat(5,1fr)}
.book-card{display:block;border-radius:var(--qd-radius);transition:all .2s ease}
.book-card__cover{
  position:relative;width:100%;aspect-ratio:3/4;overflow:hidden;
  border-radius:var(--qd-radius);
  box-shadow:var(--qd-shadow-card);transition:transform .3s cubic-bezier(.34,.69,.1,1),box-shadow .2s ease;
  background:var(--qd-bg-2);
}
.book-card__cover .ph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font:700 32px/1 var(--qd-font);text-shadow:0 1px 5px rgba(0,0,0,.3);
}
.book-card__cover .badge{
  position:absolute;left:0;top:0;padding:1px 6px;
  background:var(--qd-red);color:#fff;font-size:11px;
}
.book-card__cover .fin{
  position:absolute;right:0;bottom:0;padding:1px 5px;
  background:rgba(0,0,0,.6);color:#fff;font-size:11px;
}
.book-card__title{
  margin-top:6px;font-size:14px;font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.book-card__meta{
  margin-top:2px;font-size:12px;color:var(--qd-text-3);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.book-card__desc{
  margin-top:3px;font-size:12px;color:var(--qd-text-2);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* 横版：小封面 + 文字 */
.book-row{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--qd-border-3)}
.book-row:last-child{border-bottom:0}
.book-row__cover{width:56px;flex:none}
.book-row__cover .book-card__cover{aspect-ratio:3/4}
.book-row__cover .ph{font-size:18px}
.book-row__body{flex:1;min-width:0}
.book-row__title{font-size:15px;font-weight:600}
.book-row__meta{margin-top:3px;font-size:12px;color:var(--qd-text-3);display:flex;gap:10px;flex-wrap:wrap}
.book-row__desc{
  margin-top:5px;font-size:13px;color:var(--qd-text-2);line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* 占位封面渐变（8 套） */
.cov-0{background:linear-gradient(135deg,#ff8b07,#ff5f00)}
.cov-1{background:linear-gradient(135deg,#3370ff,#6694ff)}
.cov-2{background:linear-gradient(135deg,#0fbf60,#14ed78)}
.cov-3{background:linear-gradient(135deg,#a855f7,#7c3aed)}
.cov-4{background:linear-gradient(135deg,#ffa33a,#ffd3a0)}
.cov-5{background:linear-gradient(135deg,#3370ff,#ccdbff)}
.cov-6{background:linear-gradient(135deg,#ee4d38,#f27767)}
.cov-7{background:linear-gradient(135deg,#4a4a4a,#7a7a7a)}

/* --------------------------------- 分页 --------------------------------- */
.pager{display:flex;align-items:center;justify-content:center;gap:5px;padding:22px 0;flex-wrap:wrap}
.pager a,.pager span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 9px;
  background:#fff;border:1px solid var(--qd-border);border-radius:var(--qd-radius-md);
  font-size:13px;color:var(--qd-text-2);transition:all .1s linear;
}
.pager .is-active{background:var(--qd-red);border-color:var(--qd-red);color:#fff;font-weight:600}
.pager .is-disabled{color:var(--qd-text-3);background:#fafafa;cursor:not-allowed}
.pager .pager__info{margin-left:8px;color:var(--qd-text-3);font-size:13px;border:0;background:transparent}

/* --------------------------------- 面包屑 -------------------------------- */
.crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--qd-text-3);padding:0 0 12px}
.crumb a{color:var(--qd-text-2)}
.crumb .sep{color:#ccc}

/* --------------------------------- 表单 --------------------------------- */
.field{margin-bottom:14px}
.field > label{display:block;margin-bottom:5px;font-size:13px;color:var(--qd-text-2)}
.input,.select,.textarea{
  width:100%;height:var(--qd-btn-h);padding:0 12px;
  background:#fff;border:1px solid var(--qd-border-2);
  font-size:14px;transition:border-color .15s;
}
.textarea{height:auto;min-height:90px;padding:8px 12px;line-height:1.7;resize:vertical}
.input:focus,.select:focus,.textarea:focus{border-color:var(--qd-red)}
.input::placeholder,.textarea::placeholder{color:var(--qd-text-3)}
.input--lg{height:40px;font-size:15px}
.field__hint{margin-top:5px;font-size:12px;color:var(--qd-text-3)}
.checkbox{display:flex;align-items:flex-start;gap:7px;font-size:13px;color:var(--qd-text-2);cursor:pointer}
.checkbox input{margin-top:3px;accent-color:var(--qd-red)}

/* 筛选条（浅灰底 #f2f2f2） */
.filter-bar{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:12px 18px;background:var(--qd-bg-2);border:1px solid var(--qd-border);margin-bottom:var(--qd-gap);
}
.filter-bar .input,.filter-bar .select{width:auto;height:34px;font-size:13px}
.filter-bar__label{font-size:13px;color:var(--qd-text-2);flex:none}

/* chips 胶囊（起点分类筛选：不用圆角，用方角选中） */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips a{
  display:inline-flex;align-items:center;height:26px;padding:0 12px;
  background:#f5f5f5;color:var(--qd-text-2);font-size:13px;
}
.chips a.is-on{background:var(--qd-red);color:#fff;font-weight:600}

/* 分段控件 */
.seg{display:inline-flex;background:var(--qd-bg-2);padding:2px}
.seg button{
  border:0;background:transparent;padding:4px 13px;font-size:13px;
  color:var(--qd-text-2);cursor:pointer;
}
.seg button.is-on{background:var(--qd-red);color:#fff;font-weight:600}

/* 下划线 Tabs */
.tabs{display:flex;gap:20px;border-bottom:1px solid var(--qd-border);padding:0 18px}
.tabs button,.tabs a{
  border:0;background:transparent;padding:12px 0;font-size:15px;
  color:var(--qd-text-2);cursor:pointer;position:relative;
}
.tabs .is-on{color:var(--qd-red);font-weight:700}
.tabs .is-on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--qd-red)}

/* --------------------------------- 表格 --------------------------------- */
/* 32px 行节奏 */
.table{width:100%;border-collapse:collapse;font-size:13px}
.table th{
  text-align:left;font-weight:600;color:var(--qd-text-2);
  background:var(--qd-bg-2);padding:9px 12px;border-bottom:1px solid var(--qd-border);white-space:nowrap;
}
.table td{padding:9px 12px;border-bottom:1px solid var(--qd-border-3);color:var(--qd-text-2)}
.table .num{font-family:var(--qd-font-num);font-variant-numeric:tabular-nums}

/* --------------------------------- 侧栏 -------------------------------- */
.side-card{background:#fff;border:1px solid var(--qd-border);margin-bottom:var(--qd-gap)}
.side-card__hd{
  padding:11px 14px;font-size:15px;font-weight:600;border-bottom:1px solid var(--qd-border);
  display:flex;align-items:center;justify-content:space-between;
}
.side-card__hd .more{font-size:12px;color:var(--qd-link);font-weight:400}
.side-card__bd{padding:8px 14px 12px}

/* 排行列表 */
.rank-list li{
  display:flex;align-items:center;gap:9px;
  padding:8px 0;border-bottom:1px solid var(--qd-border-3);
  font-size:13px;transition:all .1s linear;
}
.rank-list li:last-child{border-bottom:0}
.rank-list .no{
  width:20px;height:18px;flex:none;text-align:center;line-height:18px;
  font:700 12px/18px var(--qd-font-num);color:var(--qd-text-4);
  border-radius:var(--qd-radius-sm);
}
/* 前 3 名：实心徽章（番茄风点缀）*/
.rank-list li:nth-child(1) .no{background:var(--qd-red);color:#fff}
.rank-list li:nth-child(2) .no{background:var(--qd-brand-2);color:#fff}
.rank-list li:nth-child(3) .no{background:var(--qd-brand-1);color:#fff}
.rank-list .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-list .v{flex:none;color:var(--qd-text-3);font-size:12px;font-family:var(--qd-font-num)}

/* 名次徽章 */
.medal{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;flex:none;
  background:var(--qd-red);color:#fff;font:700 12px/1 var(--qd-font-num);
}
.medal--n{background:#f0f0f0;color:var(--qd-text-2);font-weight:600}

/* --------------------------------- 底部 -------------------------------- */
.site-footer{background:#2b2b2b;color:#9a9a9a;margin-top:34px;font-size:13px}
.site-footer__main{display:flex;gap:40px;padding:30px 0 24px;flex-wrap:wrap}
.site-footer__brand{flex:1;min-width:260px}
.site-footer__brand h4{color:#fff;font-size:15px;margin-bottom:9px}
.site-footer__brand p{line-height:1.8}
.site-footer__col{min-width:130px}
.site-footer__col h4{color:#fff;font-size:14px;margin-bottom:10px}
.site-footer__col a{display:block;padding:4px 0;color:#9a9a9a}
.site-footer__bottom{
  border-top:1px solid #3a3a3a;padding:14px 0;color:#777;font-size:12px;
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
}

/* --------------------------------- 空态 -------------------------------- */
.empty{text-align:center;padding:56px 20px;color:var(--qd-text-3)}
.empty__ico{
  width:64px;height:64px;margin:0 auto 14px;
  background:var(--qd-bg-2);display:flex;align-items:center;justify-content:center;
  font-size:28px;color:#ccc;
}
.empty p{font-size:14px;margin-bottom:14px}

/* ==========================================================================
   扩展块（会员中心 / 作家中心 / 列表 / 阅读）——同一套令牌，扁平一致
   ========================================================================== */

/* ------------------------------ 章节列表 ------------------------------- */
.chap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--qd-border);
  border:1px solid var(--qd-border)}
.chap-grid a{
  display:block;padding:9px 13px;background:#fff;font-size:13px;color:var(--qd-text-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.chap-grid a.is-new{color:var(--qd-red)}
.chap-vol{display:flex;align-items:center;gap:8px;padding:12px 0 6px;font-size:14px;font-weight:600}
.chap-vol::before{content:"";width:3px;height:14px;background:var(--qd-red)}

/* ------------------------------ 数据卡片 ------------------------------- */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stat-card{
  background:#fff;border:1px solid var(--qd-border);padding:16px 18px;
  border-left:3px solid var(--qd-red);
}
.stat-card__label{font-size:13px;color:var(--qd-text-3)}
.stat-card__value{margin-top:5px;font:700 26px/1.2 var(--qd-font);font-family:var(--qd-font-num);font-variant-numeric:tabular-nums}
.stat-card__value small{font-size:13px;font-weight:400;color:var(--qd-text-3);margin-left:4px}
.stat-card__sub{margin-top:5px;font-size:12px;color:var(--qd-text-3)}
.stat-card--blue{border-left-color:var(--qd-link)}
.stat-card--green{border-left-color:#2fa85a}
.stat-card--gold{border-left-color:var(--qd-gold)}

/* --------------------------- 会员 / 作家布局 --------------------------- */
.member-layout{display:flex;gap:var(--qd-gap);align-items:flex-start}
.member-layout > .main{flex:1;min-width:0}
.side-menu{width:196px;flex:none;background:#fff;border:1px solid var(--qd-border)}
.side-menu__hd{padding:14px 16px;border-bottom:1px solid var(--qd-border)}
.side-menu__hd b{display:block;font-size:15px}
.side-menu__hd span{font-size:12px;color:var(--qd-text-3)}
.side-menu a{display:flex;align-items:center;gap:8px;padding:10px 16px;font-size:14px;color:var(--qd-text-2)}
.side-menu a.is-on{background:var(--qd-brand-tint);color:var(--qd-red);font-weight:600;
  box-shadow:inset 3px 0 0 var(--qd-red)}
.side-menu__group{padding:12px 16px 5px;font-size:12px;color:var(--qd-text-3)}

/* 会员横幅：扁平红块，无渐变圆角 */
.member-hero{
  background:var(--qd-red);
  border:1px solid var(--qd-red);padding:22px 24px;color:#fff;
  display:flex;align-items:center;gap:18px;margin-bottom:var(--qd-gap);
}
.member-hero .avatar{
  width:56px;height:56px;flex:none;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.45);
  display:flex;align-items:center;justify-content:center;
  font:700 22px/1 var(--qd-font);
  border-radius:50%;position:relative;cursor:pointer;overflow:hidden;
}
.member-hero .avatar .avatar-edit{
  position:absolute;left:0;right:0;bottom:0;height:18px;line-height:18px;
  font-size:11px;font-weight:400;text-align:center;color:#fff;
  background:rgba(0,0,0,.55);opacity:0;transition:opacity .2s;
}
.member-hero .avatar:hover .avatar-edit{opacity:1}
.member-hero__body{flex:1;min-width:0}
.member-hero__body h1{font-size:19px;margin-bottom:3px}
.member-hero__body p{font-size:13px;color:rgba(255,255,255,.85)}
.member-hero .btn{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.45);color:#fff}

/* ------------------------------ 登录/注册 ------------------------------ */
.auth-wrap{
  min-height:500px;display:flex;align-items:center;justify-content:center;
  padding:44px 20px;background:var(--qd-bg);
}
.auth-card{
  width:390px;max-width:100%;background:#fff;border:1px solid var(--qd-border);padding:32px 30px;
}
.auth-card__title{font-size:21px;text-align:center;margin-bottom:5px}
.auth-card__desc{font-size:13px;color:var(--qd-text-3);text-align:center;margin-bottom:22px}
.auth-card .field:last-of-type{margin-bottom:20px}
.auth-alt{display:flex;justify-content:space-between;font-size:13px;margin:-4px 0 16px}
.auth-alt a{color:var(--qd-text-2)}
.auth-split{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--qd-text-3);font-size:12px}
.auth-split::before,.auth-split::after{content:"";flex:1;height:1px;background:var(--qd-border)}
.auth-third{display:flex;gap:12px;justify-content:center}
.auth-third a{
  width:40px;height:40px;border:1px solid var(--qd-border-2);
  display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--qd-text-2);
}
.pwd-strength{display:flex;gap:5px;margin-top:7px}
.pwd-strength i{flex:1;height:3px;background:#eee}
.pwd-strength.s1 i:nth-child(1){background:var(--qd-orange)}
.pwd-strength.s2 i:nth-child(-n+2){background:#e0b13f}
.pwd-strength.s3 i{background:#2fa85a}

/* -------------------------------- 套餐卡 ------------------------------- */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.plan-card{
  background:#fff;border:1px solid var(--qd-border-2);padding:24px 20px;text-align:center;
  position:relative;transition:border-color .16s;
}
.plan-card--hot{border-color:var(--qd-red);border-width:2px}
.plan-card__flag{
  position:absolute;top:0;right:0;background:var(--qd-red);color:#fff;
  font-size:12px;padding:2px 10px;
}
.plan-card__name{font-size:15px;font-weight:600;margin-bottom:12px}
.plan-card__price{font:700 32px/1 var(--qd-font-num);color:var(--qd-red)}
.plan-card__price small{font-size:14px;font-weight:400;color:var(--qd-text-3)}
.plan-card__old{font-size:12px;color:var(--qd-text-3);text-decoration:line-through;margin-top:3px}
.plan-card ul{margin:16px 0 18px;font-size:13px;color:var(--qd-text-2);text-align:left}
.plan-card ul li{padding:5px 0 5px 18px;position:relative}
.plan-card ul li::before{content:"✓";position:absolute;left:0;color:#2fa85a;font-weight:700}

/* ------------------------------- 时间轴 -------------------------------- */
.timeline{position:relative;padding-left:20px}
.timeline::before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:1px;background:var(--qd-border)}
.timeline__item{position:relative;padding:0 0 18px}
.timeline__item::before{
  content:"";position:absolute;left:-20px;top:5px;width:9px;height:9px;
  background:#fff;border:2px solid var(--qd-red);
}
.timeline__date{font-size:12px;color:var(--qd-text-3);margin-bottom:3px}
.timeline__body{font-size:14px;color:var(--qd-text)}

/* ------------------------------- 图表位 -------------------------------- */
.chart{height:200px;display:flex;align-items:flex-end;gap:12px;padding:18px 0 0;border-bottom:1px solid var(--qd-border)}
.chart__bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px}
.chart__bar i{display:block;width:100%;max-width:32px;background:var(--qd-red)}
.chart__bar span{font-size:11px;color:var(--qd-text-3)}
.chart__bar:nth-child(even) i{background:var(--qd-link)}
.progress{height:5px;background:#f0f0f0;overflow:hidden}
.progress i{display:block;height:100%;background:var(--qd-red)}

/* ----------------------------- 排行详情行 ----------------------------- */
/* ★ P0 修复：排行榜总览网格
   ------------------------------------------------------------------
   根因（历史）：PC novel.css/qidian.css 均未定义 .rank-grid → 降级为 display:block，
        6 张卡单列堆叠（实测宽 900px 高 2282px，x 坐标全 =120）。
   ⚠️ WAVE10：此处原有第二份 .rank-grid 定义（repeat(4,1fr) 且缺 minmax(0,..)），
        与下方「⑤ 排行榜网格」块同选择器打架（后者胜出→实际 3 列）。已删除本份，
        .rank-grid 唯一定义见 ⑤ 块。
   ------------------------------------------------------------------ */
.rank-card__title{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:600}
.rank-card__dot{
  display:inline-block;width:8px;height:8px;flex:none;
  border-radius:var(--qd-radius-sm);
}
.rank-card__sub{margin-left:auto;font-size:12px;color:var(--qd-text-3);font-weight:400}
.rank-list.rk-list .t a{color:var(--qd-text-2)}

.rank-row{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--qd-border-3)}
.rank-row:last-child{border-bottom:0}
.rank-row .cover{width:50px;flex:none}
.rank-row .cover .book-card__cover{aspect-ratio:3/4;box-shadow:none}
.rank-row .cover .ph{font-size:16px}
.rank-row .body{flex:1;min-width:0}
.rank-row .t{font-size:15px;font-weight:600}
.rank-row .m{margin-top:3px;font-size:12px;color:var(--qd-text-3);display:flex;gap:12px;flex-wrap:wrap}
.rank-row .score{flex:none;text-align:right}
.rank-row .score b{display:block;font:700 16px/1.2 var(--qd-font-num);color:var(--qd-red)}
.rank-row .score span{font-size:12px;color:var(--qd-text-3)}

/* ------------------------------- 阅读页 -------------------------------- */
.read-wrap{max-width:1000px;margin:0 auto}
.read-toolbar{
  position:sticky;top:var(--qd-header-h);z-index:50;background:#fff;border-bottom:1px solid var(--qd-border);
  padding:9px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.read-toolbar__sp{margin-left:auto}
.read-paper{background:#fff;border:1px solid var(--qd-border);padding:34px 52px 40px;margin:18px 0}
.read-paper h1{font:600 25px/1.5 var(--qd-font);text-align:center;margin-bottom:8px}
.read-paper .meta{text-align:center;font-size:13px;color:var(--qd-text-3);margin-bottom:24px;
  padding-bottom:16px;border-bottom:1px solid var(--qd-border)}
.article{font-size:18px;line-height:2;color:#333;font-family:var(--qd-font)}
.article p{margin-bottom:1.1em;text-indent:2em}
.article.fz-s{font-size:16px}
.article.fz-m{font-size:18px}
.article.fz-l{font-size:21px}
.article.fz-xl{font-size:24px}
body.bg-paper{background:var(--qd-bg)}
body.bg-white .read-paper{background:#fff}
body.bg-beige{background:#f5efe2}
body.bg-beige .read-paper{background:#faf5e9}
body.bg-night{background:#1c1c1c}
body.bg-night .read-paper,body.bg-night .read-toolbar{background:#262626;color:#b5b5b5;border-color:#333}
body.bg-night .article{color:#a8a8a8}
body.bg-night .read-paper .meta{color:#7a7a7a;border-color:#333}
body.bg-night .read-paper h1{color:#d5d5d5}
body.bg-night .crumb,body.bg-night .crumb a{color:#7a7a7a}
.read-nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid var(--qd-border)}
.read-tools{display:flex;align-items:center;gap:8px}
.read-tools .swatch{width:22px;height:22px;border:1px solid var(--qd-border-2);cursor:pointer;display:inline-block}
.read-tools .swatch.on{border-color:var(--qd-red);border-width:2px}

/* ------------------------------- 目录侧栏 ------------------------------ */
.toc-list{max-height:400px;overflow:auto;padding:0 14px 10px}
.toc-list a{display:block;height:28px;line-height:28px;font-size:13px;color:var(--qd-text-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toc-list a.is-on{color:var(--qd-red);font-weight:600}

/* ------------------------------- 书籍详情 ------------------------------ */
.book-hero{display:flex;gap:24px;padding:24px}
.book-hero__cover{width:180px;flex:none}
.book-hero__cover .book-card__cover{aspect-ratio:3/4;box-shadow:var(--qd-shadow-cover)}
.book-hero__cover .ph{font-size:48px}
.book-hero__body{flex:1;min-width:0}
.book-hero__body h1{font-size:28px;margin-bottom:10px}
.book-hero__meta{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--qd-text-2);margin-bottom:10px}
.book-hero__meta b{color:var(--qd-text);font-weight:600}
.book-hero__tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.book-hero__score{display:flex;gap:26px;margin-bottom:18px;padding:12px 16px;background:var(--qd-bg-3);border:1px solid var(--qd-border)}
.book-hero__score div p:first-child{font-size:12px;color:var(--qd-text-3)}
.book-hero__score div p:last-child{font:700 18px/1.3 var(--qd-font-num);color:var(--qd-red)}
.book-hero__actions{display:flex;gap:9px;flex-wrap:wrap}
.intro-text{font-size:14px;line-height:1.9;color:var(--qd-text-2)}

/* --------------------------------- 工具类 ------------------------------ */
.flex{display:flex}
.flex-c{display:flex;align-items:center}
.flex-b{display:flex;align-items:center;justify-content:space-between}
.gap8{gap:8px}.gap12{gap:12px}.gap16{gap:16px}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mt20{margin-top:20px}
.mb8{margin-bottom:8px}.mb12{margin-bottom:12px}.mb16{margin-bottom:16px}.mb20{margin-bottom:20px}
.tc{text-align:center}.tr{text-align:right}
.fz12{font-size:12px}.fz13{font-size:13px}.fz16{font-size:16px}
.c2{color:var(--qd-text-2)}.c3{color:var(--qd-text-3)}
.red{color:var(--qd-red)}.blue{color:var(--qd-link)}.gold{color:var(--qd-gold)}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bold{font-weight:600}
.hidden{display:none}

/* --------------------------------- 响应式 ------------------------------ */
@media (max-width:1199px){
.grid-books{grid-template-columns:repeat(5,1fr)}
.grid-5,.grid-6{grid-template-columns:repeat(4,1fr)}
.chap-grid{grid-template-columns:repeat(3,1fr)}
.stat-grid{grid-template-columns:repeat(2,1fr)}
.plan-grid{grid-template-columns:repeat(2,1fr)}
.filter-search input{width:420px}}
@media (max-width:900px){
.layout-side,.member-layout{flex-direction:column}
.layout-side > .side,.side-menu{width:100%}
.side-menu a{display:inline-flex;width:50%}
.site-nav{display:none}
.grid-books{grid-template-columns:repeat(4,1fr)}
.grid-4{grid-template-columns:repeat(3,1fr)}
.grid-5,.grid-6,.grid-3{grid-template-columns:repeat(3,1fr)}
.book-hero{flex-direction:column}
.book-hero__cover{width:130px}
.read-paper{padding:22px 18px 28px}
.filter-search-wrap{height:auto}
.filter-search-wrap .box-center,.filter-search-box{height:auto;flex-wrap:wrap;gap:10px;padding:12px 0}
.filter-search-box .ftitle{width:auto;line-height:1.6}
.filter-search input{width:100%}
.chart{gap:7px}}
@media (max-width:640px){
.wrap,.box-center{max-width:100%;padding:0 12px}
.grid-books{grid-template-columns:repeat(3,1fr);gap:12px 9px}
.grid-2,.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:repeat(2,1fr)}
.chap-grid{grid-template-columns:repeat(2,1fr)}
.stat-grid,.plan-grid{grid-template-columns:1fr}
.search-box{width:auto;min-width:0}
.site-header__inner{gap:10px}
.site-header__right .head-link{display:none}
.card__bd{padding:12px}
.sec-hd h2{font-size:18px}
.auth-card{padding:24px 18px}
.read-paper h1{font-size:20px}
.article{font-size:16px}
.dense-list .author,.dense-list .time{display:none}}
@media (hover: hover) and (pointer: fine) {
a:hover{color:var(--qd-red-hover)}
.site-nav a:hover{color:var(--qd-red-hover)}
.search-box button:hover{background:var(--qd-red-hover)}
.head-link:hover{color:var(--qd-red-hover)}
.filter-search .everyone a:hover{color:var(--qd-red-hover)}
.btn--primary:hover{background:var(--qd-red-hover);border-color:var(--qd-red-hover);color:#fff}
.red-btn:hover{background:var(--qd-red-hover);border-color:var(--qd-red-hover);color:#fff}
.btn--ghost:hover{border-color:var(--qd-red);color:var(--qd-red)}
.btn--blue:hover{background:var(--qd-link-bg);border-color:var(--qd-link);color:var(--qd-link-hover)}
.load-more:hover{color:var(--qd-link-hover)}
.card__hd .more:hover{color:var(--qd-link-hover)}
.sec-hd .more:hover{color:var(--qd-link-hover)}
.hot-book-list dd a:hover{color:var(--qd-red-hover)}
.hot-book-list dd a.classify:hover{color:var(--qd-red-hover)}
.dense-list li:hover{background:var(--qd-bg-3)}
.book-card:hover .book-card__cover{transform:translateY(-2px)}
.pager a:hover{border-color:var(--qd-red);color:var(--qd-red)}
.crumb a:hover{color:var(--qd-red-hover)}
.chips a:hover{background:var(--qd-brand-tint);color:var(--qd-red-hover)}
.table tbody tr:hover{background:var(--qd-bg-3)}
.site-footer__col a:hover{color:#fff}
.chap-grid a:hover{background:var(--qd-brand-tint);color:var(--qd-red-hover)}
.side-menu a:hover{background:var(--qd-bg-3);color:var(--qd-red-hover)}
.member-hero .btn:hover{background:#fff;color:var(--qd-red);border-color:#fff}
.auth-alt a:hover{color:var(--qd-red-hover)}
.auth-third a:hover{border-color:var(--qd-red);color:var(--qd-red)}
.plan-card:hover{border-color:var(--qd-red)}
.rank-row:hover{background:var(--qd-bg-3)}
.toc-list a:hover{color:var(--qd-red-hover)}
}


/* ==========================================================================
   小说模板落地补丁（novel.css 末尾追加）
   —— 设计稿未含的部分：导航选中态（零 JS）/ WAP 顶栏 / 交互动效
   ========================================================================== */

/* ---------------------- 站点导航选中态（零 JS，靠 body[data-nav]）------- */
body[data-nav="home"] .site-nav a[data-nav="home"],
body[data-nav="all"] .site-nav a[data-nav="all"],
body[data-nav="rank"] .site-nav a[data-nav="rank"],
body[data-nav="full"] .site-nav a[data-nav="full"],
body[data-nav="cate"] .site-nav a[data-nav="cate"],
body[data-nav="comic"] .site-nav a[data-nav="comic"],
.site-nav a.is-active {
  color: var(--qd-red); font-weight: 700;
  box-shadow: inset 0 -2px 0 var(--qd-red);
}

/* ---------------------- WAP 顶栏与横滑导航 ------------------------------ */
.site-header--wap .site-header__inner { flex-wrap: wrap; gap: 8px; }
.search-box--wap { width: 100%; margin: 0 0 10px; }
.search-box--wap input { flex: 1; min-width: 0; }
.wap-nav { background: #fff; border-bottom: 1px solid var(--qd-border); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.wap-nav .wrap { display: flex; gap: 2px; padding: 0 12px; }
.wap-nav a { flex: none; padding: 10px 12px; font-size: 14px; color: var(--qd-text-2); white-space: nowrap; }
body[data-nav="home"] .wap-nav a[data-nav="home"],
body[data-nav="all"] .wap-nav a[data-nav="all"],
body[data-nav="rank"] .wap-nav a[data-nav="rank"],
body[data-nav="full"] .wap-nav a[data-nav="full"],
body[data-nav="bookcase"] .wap-nav a[data-nav="bookcase"],
body[data-nav="comic"] .wap-nav a[data-nav="comic"] { color: var(--qd-red); font-weight: 700; }

/* ---------------------- 阅读页字号/背景档（设计稿 read.html 契约）------- */
.read-paper { transition: background .15s, color .15s; }
body.fz-s  .read-paper .article { font-size: 14px; }
body.fz-m  .read-paper .article { font-size: 16px; }
body.fz-l  .read-paper .article { font-size: 18px; }
body.fz-xl .read-paper .article { font-size: 21px; }
body.bg-white .read-paper { background: #fff; }
body.bg-paper .read-paper { background: var(--qd-bg); }
body.bg-beige .read-paper { background: #f5f1e6; }
body.bg-night { background: #2b2b2b; }
body.bg-night .read-paper { background: #333; border-color: #3d3d3d; }
body.bg-night .read-paper h1, body.bg-night .read-paper .article { color: #c9c9c9; }
body.bg-night .read-tools, body.bg-night .read-bar { background: #2b2b2b; border-color: #3d3d3d; }
body.bg-night .read-tools .swatch { border-color: #555; }

/* ---------------------- 触摸端守卫（全部悬停态）------------------------- */
@media (hover: hover) and (pointer: fine) {
  .wap-nav a:hover { color: var(--qd-red); }
  .switch-btn:hover, .read-tools button:hover { color: var(--qd-red); }
  .plan-card:hover { border-color: var(--qd-red); }
}


/* ==========================================================================
   V5 追加①：小说首页焦点图 + 首页栅格（design/index.html 页内样式落地）
   --------------------------------------------------------------------------
   来源：design/index.html 内联 <style>（6020B）—— 此前整块未搬进本文件，
   导致焦点图无任何尺寸约束；模板塞真 <img> 后按原始分辨率撑爆。
   令牌一律映射到既有单一命名空间 --qd-*（不引第二套）。
   ========================================================================== */

/* --- 首页顶部 hero 通栏（番茄风）：满宽 1240px，替换起点 277×124 3D 堆叠小方块 ---
   有海报 → 平铺淡入轮播（无缩放/位移）；无海报 → 默认通栏
   注：.hero-slide 不设 background，空出 cov-N 渐变作零图片兜底 --- */
/* --- 首页顶部 hero 通栏（番茄风）· 通栏出血版 ---
   G1 加大：PC 400px / WAP 220px    G2 通栏：width:100vw 左右贴边 0
   G3 去卡片化：圆角 0 / 阴影 none  G4 融合：::after 底部渐隐到 body 底色
   对齐：文字/dots 用 max(20px, calc((100vw - 页宽)/2)) 对齐内容区，不贴视口边
   手法照搬漫画先例 qidianpc/Comic/zone.html（Banner 通栏出血，border-radius:0） */
.hero-banner{
  position:relative;width:100vw;margin-left:calc(50% - 50vw);
  margin-bottom:var(--qd-gap);
  border-radius:0;overflow:hidden;
  box-shadow:none;
  background:var(--qd-brand-grad);
}
/* G4 与背景融合：底部向下渐隐到 body 顶色（二者同为 --qd-bg-warm，故无硬边界）*/
.hero-banner::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:96px;z-index:4;
  background:linear-gradient(to bottom,rgba(255,246,240,0) 0%,var(--qd-bg-warm) 100%);
  pointer-events:none;
}
/* G4 页面底：首页顶部浅橙氛围渐变（收尾到 --qd-bg-warm，与 hero 渐隐终点一致）
   注意：详情页 view.html 也是 data-nav="home"（既有事实），仅用 data-nav 会泄漏到详情页
   → 叠加 :has(.hero-banner) 精确定位到真首页（全站仅首页有 .hero-banner）
   不支持的浏览器会整条选择器失效 → 回退纯灰底，不会误染 */
body[data-nav="home"]:has(.hero-banner){
  background-color:var(--qd-bg);
  background-image:linear-gradient(180deg,
    var(--qd-bg-warm) 0%,
    var(--qd-bg-warm) 520px,
    var(--qd-bg) 980px);
  background-repeat:no-repeat;
}
/* 通栏出血守卫：用 clip 而非 hidden —— clip 不建立滚动容器，
   故 .site-header 的 position:sticky 仍生效（overflow-x:hidden 会破坏它）*/
html,body{overflow-x:clip}
.hero-slides{position:relative;height:400px}
.hero-slide{
  position:absolute;inset:0;z-index:1;
  display:flex;align-items:center;
  padding:0 max(20px,calc((100vw - var(--qd-page-w)) / 2));
  color:#fff;overflow:hidden;
  opacity:0;visibility:hidden;
  transition:opacity .5s ease,visibility .5s ease;
}
/* 窄屏降档（G1：PC 档 1440/1240/992/768 均 ≥380）*/
@media (max-width:1199px){ .hero-slides{height:380px} }
@media (max-width:640px){ .hero-slides{height:220px} }
/* 无海报默认通栏同步降档，保持与轮播态一致 */
@media (max-width:1199px){ .hero-default{min-height:380px} }
.hero-slide.is-cur{opacity:1;visibility:visible;z-index:2}
.hero-slide__img{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;
}
.hero-slide__scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.26) 48%,rgba(0,0,0,0) 100%);
}
.hero-slide__body{position:relative;z-index:2;max-width:660px;min-width:0}
.hero-slide__tag{
  display:inline-flex;align-items:center;height:22px;padding:0 9px;
  border-radius:var(--qd-radius-sm);background:rgba(255,255,255,.92);color:var(--qd-red);
  font-size:12px;font-weight:600;margin-bottom:12px;
}
.hero-slide__title{
  display:block;font-size:34px;line-height:1.28;font-weight:700;color:#fff;
  text-shadow:0 1px 6px rgba(0,0,0,.3);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.hero-slide__desc{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:10px;font-size:15px;line-height:1.7;color:rgba(255,255,255,.92);
}
/* 左右按钮：纯 CSS 箭头（不用字符，避免渲染成 ? 占位）*/
.hero-btn{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:38px;height:38px;padding:0;border:0;border-radius:var(--qd-radius-circle);
  background:rgba(0,0,0,.26);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:all .2s ease;
}
.hero-banner:hover .hero-btn{opacity:1}
.hero-btn::before{
  content:"";width:9px;height:9px;
  border-top:2px solid currentColor;border-right:2px solid currentColor;
}
/* 箭头：优先落在通栏出血的左右留白内（对齐内容区外侧，不贴视口边）*/
.hero-btn.prev{left:max(20px,calc((100vw - var(--qd-page-w)) / 2 - 52px))}
.hero-btn.next{right:max(20px,calc((100vw - var(--qd-page-w)) / 2 - 52px))}
/* 窄屏无出血留白时（<1344px，此时 (100vw-1240)/2 < 52）箭头会压到左对齐正文上，
   故下移成组靠右：垂直位置错开正文（正文居中），水平靠右，实测无重叠 */
@media (max-width:1343px){
  .hero-btn{top:auto;bottom:28px;transform:none}
  .hero-btn.prev{left:auto;right:70px}
  .hero-btn.next{right:20px}
}
.hero-btn.prev::before{transform:rotate(-135deg)}
.hero-btn.next::before{transform:rotate(45deg)}
/* 圆点指示：对齐内容区左侧，抬到渐隐层之上避免被冲淡 */
.hero-dots{
  position:absolute;left:max(20px,calc((100vw - var(--qd-page-w)) / 2));bottom:108px;z-index:6;
  display:flex;align-items:center;gap:8px;
}
.hero-dots i{
  width:8px;height:8px;border-radius:var(--qd-radius-pill);
  background:rgba(255,255,255,.5);cursor:pointer;transition:all .2s ease;
}
.hero-dots i.on{width:22px;background:#fff}
/* 无海报：默认通栏 */
.hero-default{
  display:flex;align-items:center;justify-content:space-between;gap:28px;
  min-height:400px;
  padding:56px max(20px,calc((100vw - var(--qd-page-w)) / 2));
}
.hero-default__body{max-width:640px}
.hero-default__body h1{margin:0 0 10px;font-size:36px;line-height:1.28;font-weight:700;color:#fff}
.hero-default__body p{margin:0;font-size:15px;line-height:1.7;color:rgba(255,255,255,.92)}
.hero-default .btn{
  flex:none;background:#fff;border-color:#fff;color:var(--qd-red);
  height:44px;padding:0 30px;font-size:16px;font-weight:600;
  box-shadow:0 4px 14px rgba(0,0,0,.14);
}

/* --- 首页主区栅格：左主内容 + 右侧栏 --- */
.home-main { display: flex; gap: 20px; align-items: flex-start; }
.home-main > .main { flex: 1; min-width: 0; }.home-main > .side { width: var(--qd-side-w); flex: none; }

/* --- 分类快捷（起点 hot-classify）--- */
.classify-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 26px; padding: 2px 0; }
.classify-sec { margin-bottom: 14px; }
.classify-sec h4 {
  display: flex; align-items: center; gap: 6px; font-size: 16px; padding-bottom: 5px; margin-bottom: 4px;
  border-bottom: 1px solid var(--qd-border);
}
.classify-sec h4 a { color: var(--qd-red); }
.classify-sec h4 .more { font-size: 12px; color: var(--qd-link); font-weight: 400; margin-left: auto; }

/* --- 更新表（起点 update-list table）--- */
.upd-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.upd-table td { padding: 0; border-bottom: 1px solid var(--qd-border-3); height: 32px; }
.upd-table .classify { width: 66px; padding-left: 2px; font-size: 13px; color: var(--qd-text-4); }
.upd-table .name { width: 178px; }
.upd-table .name a { font: 14px/30px var(--qd-font); color: var(--qd-text); }
.upd-table .chap { font-size: 13px; color: var(--qd-text-2); }
.upd-table .author { width: 80px; font-size: 12px; color: var(--qd-text-3); }
.upd-table .time { width: 80px; text-align: right; font-size: 12px; color: var(--qd-text-3); font-family: var(--qd-font-num); }

/* --- 更新区 Tabs --- */
.upd-tab { display: flex; align-items: center; gap: 16px; border-bottom: 1px solid var(--qd-border); padding-bottom: 6px; margin-bottom: 4px; }
.upd-tab a { font: 13px/1.6 var(--qd-font); color: var(--qd-text-3); padding-bottom: 4px; position: relative; }
.upd-tab a.act { color: var(--qd-red); font-weight: 700; }
.upd-tab a.act::after { content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 2px; background: var(--qd-red); }
.upd-tab .r { margin-left: auto; font-size: 12px; color: var(--qd-link); }

/* --- 侧栏公告 Tabs --- */
.news-tabs { display: flex; gap: 14px; border-bottom: 1px solid var(--qd-border); padding: 0 14px; }
.news-tabs button { border: 0; background: transparent; padding: 11px 0; font-size: 14px; color: var(--qd-text-2); cursor: pointer; position: relative; }
.news-tabs button.is-on { color: var(--qd-red); font-weight: 700; }
.news-tabs button.is-on::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--qd-red); }
.news-list { padding: 6px 14px 12px; }
.news-list a { display: block; height: 28px; line-height: 28px; font-size: 13px; color: var(--qd-text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news-list em { color: var(--qd-red); margin-right: 5px; }

/* --- 分类快捷入口（九宫格，方角）--- */
.cate-entry { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--qd-border); border: 1px solid var(--qd-border); }
.cate-entry a { background: #fff; padding: 12px 6px; text-align: center; font-size: 13px; }
.cate-entry a b { display: block; font-size: 15px; color: var(--qd-red); margin-bottom: 3px; font-weight: 600; }

@media (max-width: 1199px) {
  .cate-entry { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
  /* 纵向堆叠时交叉轴必须 stretch：否则子项按 min-content 收缩，
     表格/网格把 .main 撑出容器宽（390px 设备实测 +12px 横向溢出）。 */
  .home-main { flex-direction: column; align-items: stretch; }
  .home-main > .main { width: 100%; }
  .home-main > .side { width: 100%; }
  .focus-wrap { flex-direction: column; align-items: center; }
  .upd-table .author { display: none; }
  .cate-entry { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .cate-entry { grid-template-columns: repeat(2, 1fr); }
  .classify-grid { grid-template-columns: 1fr; }
  .upd-table .chap { display: none; }
}

/* ==========================================================================
   V5 追加②：封面缩略图尺寸统一
   --------------------------------------------------------------------------
   根因：设计稿只有 .ph 首字占位；真实模板塞真 <img> 后无人给 img 定尺寸
        → 图片按原始分辨率渲染 → 撑爆页面。
   约定：容器定尺寸（aspect-ratio / 固定宽高 + overflow:hidden），
        <img> 一律 width:100%;height:100%;object-fit:cover。
   ========================================================================== */

/* 竖版书封（3:4 容器） */
.book-card__cover img,
.qd-book-item img,
.qd-finish-item img,
.qd-ld-top1 img,
.qd-feature-book img,
.qd-rank-top1 img,
.qd-popular-grid img,
.qd-finish-grid img,
.qd-cate-new-card img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 横向小封面（容器固定宽高） */
.book-row__cover img,
.rank-row .cover img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 长图阅读区（漫画/条漫风格）：限宽、高度自适应，不裁切 */
.cz-stage img { display: block; width: 100%; max-width: 100%; height: auto; }

/* 触摸端守卫：这里新增的悬停态（若有）统一包裹 */
@media (hover: hover) and (pointer: fine) {
  .upd-table tr:hover { background: var(--qd-bg-3); }
  .upd-tab a:hover { color: var(--qd-red-hover); }
  .news-list a:hover { color: var(--qd-red-hover); }
  .cate-entry a:hover { background: var(--qd-brand-tint); color: var(--qd-red-hover); }
  .classify-sec h4 a:hover { color: var(--qd-red-hover); }
  .classify-sec h4 .more:hover { color: var(--qd-link-hover); }
}

/* ==========================================================================
   V6 网格塌缩守卫
   --------------------------------------------------------------------------
   根因：repeat(N, 1fr) 的轨道最小值 = 子项 min-content；长标题/固定宽封面
        会把轨道撑爆 → 窄屏整页横向溢出（实测首页 390px 溢出 51px）。
   修法：子项显式 min-width:0，覆盖自动最小尺寸。
   ========================================================================== */
.grid-books > *,
.grid-2 > *, .grid-3 > *, .grid-4 > *, .grid-5 > *, .grid-6 > *,
.stat-grid > *, .plan-grid > *, .chap-grid > *, .classify-grid > * { min-width: 0; }

/* ==========================================================================
   V6 D1：会员中心 / 作家中心 组件落地
   --------------------------------------------------------------------------
   来源：design/member-*.html + design/author-*.html 的页内 <style>。
   这些页面此前仍是旧 nx-* 类名（旧 novelnexus 语言），与起点风格设计稿
   无关；本次统一到设计稿类名，并只补设计稿内联、common.css 未含的组件。
   令牌一律映射到既有单一命名空间 --qd-*（不引第二套 --c-*）。
   ========================================================================== */

/* ---------- 触摸端基础（点按高亮抑制 + 手势基线）---------- */
/* 注：不设 overflow-x:hidden —— 它会静默掩盖真实溢出，并会破坏
   .site-header / .read-toolbar 的 position:sticky（祖先 overflow 非 visible 即失效）。*/
html, body { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

/* ---------- 会员/作家：精简页头 ---------- */
.auth-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: var(--qd-header-h); }
.auth-head__links { display: flex; align-items: center; gap: 14px; flex: none; }
.auth-foot { text-align: center; font-size: 12px; color: var(--qd-text-3); padding: 22px 20px 34px; line-height: 1.9; }
.auth-foot span { display: block; }

/* ---------- 会员横幅：签到位 ---------- */
.hero-sign { flex: none; text-align: right; }
.hero-sign .days { display: block; font-size: 12px; color: rgba(255,255,255,.85); margin-top: 8px; }

/* ---------- 账户信息双列 ---------- */
.info-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 28px; }

/* ---------- 顶栏用户区（作家页）---------- */
.avatar-sm {
  width: 28px; height: 28px; flex: none; display: flex; align-items: center; justify-content: center;
  color: #fff; font: 700 13px/1 var(--qd-font);
}
.head-user { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--qd-text-2); }

/* ---------- 按钮补充（设计稿 member-vip / member-profile）---------- */
.btn--grad { background: var(--qd-red-grad); border-color: transparent; color: #fff; }
.btn--pill { border-radius: var(--qd-radius-pill); }

/* ---------- 作家工作台：双列 ---------- */
.dash-cols { display: grid; grid-template-columns: 1fr 340px; gap: var(--qd-gap); align-items: start; }
.hero-meta { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 8px; font-size: 13px; color: rgba(255,255,255,.82); }
.todo { display: flex; align-items: center; gap: 12px; padding: 15px 0; border-bottom: 1px solid var(--qd-border); }
.todo:first-child { padding-top: 2px; }
.todo:last-child { padding-bottom: 2px; border-bottom: 0; }
.todo__type { width: 80px; justify-content: center; flex: none; }
.todo__body { flex: 1; min-width: 0; }
.todo__title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.todo__meta { margin-top: 5px; font-size: 12px; color: var(--qd-text-3); display: flex; gap: 12px; flex-wrap: wrap; }
.chart-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; font-size: 13px; }
.chart-legend { display: flex; justify-content: flex-end; gap: 16px; margin-top: 12px; font-size: 12px; color: var(--qd-text-3); }
.chart-legend i { display: inline-block; width: 9px; height: 9px; margin-right: 5px; }

/* ---------- 作家：作品管理 ---------- */
.works-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 18px; background: var(--qd-bg-2); border-bottom: 1px solid var(--qd-border);
}
.works-bar__search { flex: 1; min-width: 0; }
.works-bar__sp { margin-left: auto; }
.works-cover { width: 44px; flex: none; }
.works-cover .book-card__cover { aspect-ratio: 3/4; box-shadow: none; }
.works-cover .ph { font-size: 15px; }
.works-ops { display: flex; gap: 6px; flex-wrap: wrap; }
.works-sum { font-size: 12px; color: var(--qd-text-3); }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-card { background: #fff; border: 1px solid var(--qd-border); }
.table-card .table { margin: 0; }

/* ---------- 作家：数据统计 ---------- */
.stats-cols { display: grid; grid-template-columns: 1fr 300px; gap: var(--qd-gap); align-items: start; }
.stats-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.stats-bar__sp { margin-left: auto; }
.portrait-title { font-size: 14px; font-weight: 600; margin-bottom: 10px; }
.portrait-block { padding: 4px 0; }
.bar-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; font-size: 13px; }
.bar-row__label { width: 62px; flex: none; color: var(--qd-text-2); }
.bar-row__bar { flex: 1; min-width: 0; height: 8px; background: #f0f0f0; overflow: hidden; }
.bar-row__bar i { display: block; height: 100%; background: var(--qd-red); }
.bar-row__val { width: 54px; flex: none; text-align: right; font-size: 12px; color: var(--qd-text-3); font-family: var(--qd-font-num); }
.sex-legend { display: flex; gap: 16px; margin-top: 10px; font-size: 12px; color: var(--qd-text-3); }
.chart--sm { height: 150px; }
.chart--xs { height: 110px; }

/* ---------- 作家：收益中心 ---------- */
.income-hero {
  background: var(--qd-red); border: 1px solid var(--qd-red); padding: 22px 24px; color: #fff;
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-bottom: var(--qd-gap);
}
.income-hero__body { flex: 1; min-width: 0; }
.income-hero__body h1 { font-size: 19px; margin-bottom: 3px; }
.income-hero__body p { font-size: 13px; color: rgba(255,255,255,.85); }
.income-hero__num { text-align: right; flex: none; }
.income-hero__num b { display: block; font: 700 30px/1.1 var(--qd-font-num); }
.income-hero__num span { font-size: 12px; color: rgba(255,255,255,.85); }
.income-hero .btn { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.45); color: #fff; }
.rmb { font-family: var(--qd-font-num); color: var(--qd-red); }
.chart-card { background: #fff; border: 1px solid var(--qd-border); margin-bottom: var(--qd-gap); }
.chart-card__hd {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 0 18px; height: 46px; border-bottom: 1px solid var(--qd-border); font-size: 16px; font-weight: 600;
}
.chart-note { margin-top: 10px; font-size: 12px; color: var(--qd-text-3); }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lg-red { display: inline-block; width: 9px; height: 9px; background: var(--qd-red); margin-right: 5px; }
.lg-blue { display: inline-block; width: 9px; height: 9px; background: var(--qd-link); margin-right: 5px; }
.amount { font-family: var(--qd-font-num); }
.link { color: var(--qd-link); }
.tips { font-size: 12px; color: var(--qd-text-3); line-height: 1.8; }

/* ---------- 会员：阅读历史 / 收藏 ---------- */
.hist-stat { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 18px; background: var(--qd-bg-2); border-bottom: 1px solid var(--qd-border); font-size: 13px; }
.hist-stat__item b { font-family: var(--qd-font-num); color: var(--qd-red); margin-right: 2px; }
.hist-stat__sep { color: var(--qd-border-2); }
.hist-group { margin-bottom: 4px; }
.hist-group h4 {
  padding: 10px 18px 6px; font-size: 13px; color: var(--qd-text-3); font-weight: 600;
  background: var(--qd-bg-3); border-bottom: 1px solid var(--qd-border-3);
}
.hist-item { display: flex; align-items: center; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--qd-border-3); }
.hist-item:last-child { border-bottom: 0; }
.hist-item .tm { flex: none; font-size: 12px; color: var(--qd-text-3); font-family: var(--qd-font-num); text-align: right; }
.hist-item .dur { flex: none; font-size: 12px; color: var(--qd-text-3); }
.hist-item .go { flex: none; }
.fav-row { display: flex; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--qd-border-3); }
.fav-row:last-child { border-bottom: 0; }
.fav-row__cover { width: 56px; flex: none; }
.fav-row__cover .book-card__cover { aspect-ratio: 3/4; box-shadow: none; }
.fav-row__cover .ph { font-size: 18px; }
.fav-row__body { flex: 1; min-width: 0; }
.fav-row__title { font-size: 15px; font-weight: 600; }
.fav-row__meta { margin-top: 4px; font-size: 12px; color: var(--qd-text-3); display: flex; gap: 12px; flex-wrap: wrap; }
.fav-row__desc {
  margin-top: 5px; font-size: 13px; color: var(--qd-text-2); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fav-row__op { flex: none; display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.cmt-row { display: flex; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--qd-border-3); }
.cmt-row:last-child { border-bottom: 0; }
.cmt-row__ava {
  width: 34px; height: 34px; flex: none; display: flex; align-items: center; justify-content: center;
  color: #fff; font: 700 14px/1 var(--qd-font);
}
.cmt-row__body { flex: 1; min-width: 0; }
.cmt-row__hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--qd-text-3); }
.cmt-row__txt { margin-top: 5px; font-size: 14px; color: var(--qd-text-2); line-height: 1.7; }
.cmt-row__ref { margin-top: 6px; padding: 8px 10px; background: var(--qd-bg-2); border-left: 2px solid var(--qd-border-2); font-size: 12px; color: var(--qd-text-3); }
.like { font-size: 12px; color: var(--qd-text-3); }

/* ---------- 会员：VIP 充值 ---------- */
.balance-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 18px; background: var(--qd-bg-2); border: 1px solid var(--qd-border); margin-bottom: var(--qd-gap); font-size: 13px;
}
.balance-bar__label { color: var(--qd-text-2); }
.balance-bar__num { font: 700 18px/1 var(--qd-font-num); color: var(--qd-red); }
.balance-bar__sep { color: var(--qd-border-2); }
.balance-bar__val { color: var(--qd-text-2); }
.vip-note { font-size: 12px; color: var(--qd-text-3); line-height: 1.9; }
.cmp-vip { background: #fdecec; color: var(--qd-red); font-weight: 600; }
.cmp-ok { color: #2fa85a; font-weight: 700; }
.cmp-no { color: var(--qd-text-3); }

/* ---------- 作家：章节编辑器 ---------- */
.editor-grid { display: grid; grid-template-columns: 220px 1fr 260px; gap: var(--qd-gap); align-items: start; }
.col-tree, .col-doc, .col-set { background: #fff; border: 1px solid var(--qd-border); }
.toc-vol { border-bottom: 1px solid var(--qd-border-3); }
.tree-hd-btn { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 10px 14px; border: 0; background: var(--qd-bg-3); font-size: 13px; font-weight: 600; cursor: pointer; }
.editor-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 9px 14px; border-bottom: 1px solid var(--qd-border); background: var(--qd-bg-3); }
.doc-title { width: 100%; height: 42px; padding: 0 14px; border: 0; border-bottom: 1px solid var(--qd-border); font-size: 17px; font-weight: 600; }
.doc-area { width: 100%; min-height: 420px; padding: 16px; border: 0; resize: vertical; font-size: 15px; line-height: 2; }
.doc-body { min-width: 0; }
.doc-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border-top: 1px solid var(--qd-border); }
.page-title { font-size: 18px; font-weight: 600; }
.set-row { padding: 12px 14px; border-bottom: 1px solid var(--qd-border-3); }
.set-row label { display: block; margin-bottom: 6px; font-size: 13px; color: var(--qd-text-2); }
.set-note { margin-top: 6px; font-size: 12px; color: var(--qd-text-3); }
.set-ops { display: flex; gap: 8px; padding: 14px; }
.radio-list { display: flex; gap: 14px; flex-wrap: wrap; }
.radio-item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--qd-text-2); cursor: pointer; }
.radio-item input { accent-color: var(--qd-red); }
.cnt { font-size: 12px; color: var(--qd-text-3); font-family: var(--qd-font-num); }

/* ---------- 会员：找回密码 ---------- */
.code-row { display: flex; align-items: center; gap: 8px; }
.code-row .input { flex: 1; min-width: 0; }
.auth-tip { margin-top: 5px; font-size: 12px; color: var(--qd-text-3); }

/* ---------- 通用：小徽标字 ---------- */
.head-user .avatar-sm { text-decoration: none; }

/* ---------- 会员/作家响应式 ---------- */
@media (max-width: 1199px) {
  .dash-cols { grid-template-columns: 1fr; }
  .stats-cols { grid-template-columns: 1fr; }
  .editor-grid { grid-template-columns: 200px 1fr; }
  .col-set { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .info-list { grid-template-columns: 1fr; }
  .member-hero { flex-wrap: wrap; }
  .hero-sign { text-align: left; }
  .editor-grid { grid-template-columns: 1fr; }
  .hist-item { flex-wrap: wrap; }
}
@media (max-width: 640px) {
  .auth-head__links .head-link { display: none; }
  .member-hero { padding: 20px; gap: 14px; }
  .member-hero .avatar { width: 52px; height: 52px; font-size: 20px; }
  .member-hero__body h1 { font-size: 18px; }
  .todo { flex-wrap: wrap; }
  .todo__type { width: auto; }
  .todo__title { white-space: normal; }
  .fav-row { flex-wrap: wrap; }
  .fav-row__op { flex-direction: row; align-items: center; width: 100%; }
  .income-hero__num { text-align: left; }
}

/* ---------- 触摸端守卫（D1 新增悬停态）---------- */
@media (hover: hover) and (pointer: fine) {
  .head-user:hover { color: var(--qd-red); }
  .income-hero .btn:hover { background: #fff; color: var(--qd-red); border-color: #fff; }
  .btn--grad:hover { filter: brightness(1.06); color: #fff; }
  .fav-row__title a:hover { color: var(--qd-red-hover); }
  .hist-item .go:hover { color: var(--qd-red-hover); }
  .code-row .btn:hover { border-color: var(--qd-red); color: var(--qd-red); }
  .tree-hd-btn:hover { background: var(--qd-bg-2); }
}

/* ==== WAVE4 首页纵向分区流（共享基座：PC 直载 + WAP 经 @import 继承）==== */
/* ==========================================================================
   WAVE4 · 首页纵向单列分区流（仅 PC 首页 include）
   --------------------------------------------------------------------------
   纵横式：1200 内容区 + 无右栏 + 通栏换底色块（翻页感）
   复用既有 .card / .card__hd / .card__bd / .book-card / .rank-list（不新造命名空间）
   数据缺口处置：A1(副文=作者·分类·最近章节) / B2(频道用站内推荐位)
   hover 一律包 @media (hover:hover) and (pointer:fine)
   ========================================================================== */

/* ---------- ① 分区通用：标题左侧橙色竖条（纵横式）---------- */
.w4-sec .card__hd { height: 54px; }
.w4-sec .card__hd h2 { position: relative; padding-left: 13px; font-size: 19px; font-weight: 700; }
.w4-sec .card__hd h2::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 19px; border-radius: 2px; background: var(--qd-red);
}

/* ---------- ② T9 快捷入口条 ---------- */
.home-quick {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: var(--qd-card); border: 1px solid var(--qd-border);
  border-radius: var(--qd-radius); padding: 15px 18px; margin-bottom: var(--qd-gap);
}
.home-quick a {
  display: inline-flex; align-items: center; justify-content: center;
  height: 36px; padding: 0 17px; border-radius: var(--qd-radius-pill);
  background: var(--qd-bg-3); border: 1px solid var(--qd-border);
  font-size: 14px; color: var(--qd-text-2); transition: all .18s ease;
}
.home-quick a.is-hot { background: var(--qd-red); border-color: var(--qd-red); color: #fff; font-weight: 600; }
.home-quick a b { font-weight: 600; }
.home-quick__sep { width: 1px; height: 20px; background: var(--qd-border); margin: 0 4px; }

/* ---------- ③ T10 活动条（公告 + 会员小条）---------- */
.home-acts {
  display: flex; align-items: center; gap: 18px;
  height: 56px; padding: 0 18px; margin-bottom: var(--qd-gap);
  background: linear-gradient(90deg, var(--qd-brand-tint) 0%, var(--qd-card) 62%);
  border: 1px solid var(--qd-border); border-radius: var(--qd-radius); overflow: hidden;
}
.home-acts__hd {
  flex: none; display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 700; color: var(--qd-red);
}
.home-acts__hd::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--qd-red); }
.home-acts__list { flex: 1; min-width: 0; display: flex; align-items: center; gap: 26px; overflow: hidden; }
.home-acts__list a { font-size: 13px; color: var(--qd-text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.home-acts__list a:hover { color: var(--qd-red-hover); }
.home-acts__user { flex: none; display: flex; align-items: center; gap: 10px; margin-left: auto; }
.home-acts__user .tip { font-size: 13px; color: var(--qd-text-3); }

/* ---------- ④ T11 主编力荐（大卡 + 热门推荐侧列）---------- */
.pick { display: flex; gap: 26px; align-items: stretch; }
.pick__big { flex: 1; min-width: 0; display: flex; gap: 24px; }
.pick__cover {
  flex: none; width: 192px; aspect-ratio: 3 / 4; border-radius: var(--qd-radius);
  overflow: hidden; position: relative; box-shadow: var(--qd-shadow-card);
}
.pick__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pick__cover .ph {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #fff; font: 700 52px/1 var(--qd-font); text-shadow: 0 1px 6px rgba(0, 0, 0, .3);
}
.pick__body { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 4px 0; }
.pick__title { font-size: 26px; font-weight: 700; line-height: 1.3; }
.pick__title a { color: var(--qd-text); }
.pick__title a:hover { color: var(--qd-red); }
.pick__meta { margin-top: 10px; font-size: 14px; color: var(--qd-text-3); }
.pick__sub {
  margin-top: 12px; font-size: 14px; line-height: 1.8; color: var(--qd-text-2);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pick__data { display: flex; gap: 30px; margin-top: 18px; }
.pick__data div span { display: block; font-size: 12px; color: var(--qd-text-3); }
.pick__data div b { font: 700 20px/1.4 var(--qd-font-num); color: var(--qd-red); }
.pick__acts { display: flex; gap: 10px; margin-top: auto; padding-top: 18px; }
.pick__side { flex: none; width: 320px; border-left: 1px solid var(--qd-border); padding-left: 24px; }
.pick__side h3 { font-size: 15px; font-weight: 600; margin-bottom: 4px; }

/* ---------- ⑤ T12 编辑力荐（横排卡片）---------- */
.edlist { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px 16px; }
.edlist .book-card__title { font-size: 14px; }
.edlist .book-card__meta { margin-top: 3px; font-size: 12px; color: var(--qd-text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- ⑥ T13 经典完本 ---------- */
.finlist { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 20px 14px; }
.finlist .book-card__title { font-size: 13px; }
.finlist .book-card__meta { margin-top: 3px; font-size: 12px; color: var(--qd-text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- ⑦ T14 全站排行（tab + 双列榜单）---------- */
.w4-tabs { display: flex; gap: 6px; }
.w4-tabs button {
  border: 0; background: transparent; padding: 7px 15px; border-radius: var(--qd-radius-pill);
  font-size: 14px; color: var(--qd-text-2); cursor: pointer; transition: all .18s ease;
}
.w4-tabs button.is-on { background: var(--qd-red); color: #fff; font-weight: 600; }
.w4-pane { display: none; }
.w4-pane.is-on { display: block; }
.rk-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 34px; }
.rk-item {
  display: flex; align-items: center; gap: 12px; padding: 11px 0;
  border-bottom: 1px solid var(--qd-border-3); font-size: 14px;
}
.rk-item:last-child { border-bottom: 0; }
.rk-item .no {
  flex: none; width: 22px; height: 22px; line-height: 22px; text-align: center;
  font: 700 12px/22px var(--qd-font-num); color: var(--qd-text-4); background: var(--qd-bg-2);
  border-radius: var(--qd-radius-sm);
}
.rk-item:nth-child(1) .no { background: var(--qd-red); color: #fff; }
.rk-item:nth-child(2) .no { background: var(--qd-brand-2); color: #fff; }
.rk-item:nth-child(3) .no { background: var(--qd-brand-1); color: #fff; }
.rk-item .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-item .t a { color: var(--qd-text); }
.rk-item .t a:hover { color: var(--qd-red); }
.rk-item .v { flex: none; font-size: 12px; color: var(--qd-text-3); }

/* ---------- ⑧ T15 频道色块（全宽出血 · 换底色）---------- */
.home-channel {
  width: 100vw; margin-left: calc(50% - 50vw);
  padding: 40px 0; margin-bottom: var(--qd-gap);
  border-top: 1px solid var(--qd-border); border-bottom: 1px solid var(--qd-border);
}
/* 三个频道色块统一为极浅灰，与站内浅卡片区一致（原先各有暖橙/冷蓝/淡绿渐变） */
.home-channel--a { background: var(--qd-bg-3); }
.home-channel--b { background: var(--qd-bg-3); }
.home-channel--c { background: var(--qd-bg-3); }
.home-channel__in { width: var(--qd-page-w); max-width: 96%; margin: 0 auto; }
.home-channel__hd { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.home-channel__hd h2 { position: relative; padding-left: 13px; font-size: 22px; font-weight: 700; }
.home-channel__hd h2::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 22px; border-radius: 2px; background: var(--qd-red);
}
.home-channel__hd .more { margin-left: auto; font-size: 13px; color: var(--qd-link); }
.ch-bd { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px 16px; align-items: start; }
.ch-bd > .book-card:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.ch-bd > .book-card:nth-child(1) .book-card__title { font-size: 18px; margin-top: 10px; }
.ch-bd > .book-card:nth-child(1) .book-card__meta { margin-top: 5px; font-size: 13px; }
.ch-bd .book-card__meta { margin-top: 3px; font-size: 12px; color: var(--qd-text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- ⑨ T16 最近更新（tab + 表格）---------- */
.upd-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 34px; }
.upd-cols .upd-table td { height: 34px; }

/* ---------- ⑩ T17 人气作家 ---------- */
.aulist { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px 16px; }
.au-item {
  display: flex; align-items: center; gap: 12px; padding: 12px;
  background: var(--qd-bg-3); border: 1px solid var(--qd-border-3);
  border-radius: var(--qd-radius); transition: all .18s ease;
}
.au-item__av {
  flex: none; width: 44px; height: 44px; border-radius: 50%; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: var(--qd-red-grad); color: #fff; font: 700 17px/1 var(--qd-font);
}
.au-item__bd { min-width: 0; }
.au-item__name { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.au-item__meta { margin-top: 3px; font-size: 12px; color: var(--qd-text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- ⑪ 悬停（仅真悬停设备）---------- */
@media (hover: hover) and (pointer: fine) {
  .home-quick a:hover { background: var(--qd-red); border-color: var(--qd-red); color: #fff; }
  .w4-tabs button:hover { background: var(--qd-bg-2); }
  .w4-tabs button.is-on:hover { background: var(--qd-red-hover); }
  .au-item:hover { border-color: var(--qd-red); background: #fff; }
}

/* ---------- ⑫ 中屏降档 ---------- */
@media (max-width: 1199px) {
  .edlist { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .finlist { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .aulist { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pick__side { width: 260px; }
  .ch-bd { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ch-bd > .book-card:nth-child(1) { grid-column: span 2; grid-row: span 2; }
}
@media (max-width: 900px) {
  .pick { flex-direction: column; }
  .pick__side { width: 100%; border-left: 0; border-top: 1px solid var(--qd-border); padding-left: 0; padding-top: 18px; }
  .edlist { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .finlist { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .aulist { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rk-cols, .upd-cols { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   WAVE5 · 封面尺寸统一（老板报「编辑力荐封面尺寸不统一」）
   --------------------------------------------------------------------------
   ① 缺陷1：主编力荐大封面被 flex 拉伸 → 加 align-self:flex-start 让 aspect-ratio 生效
   ② 缺陷2：.book-card__cover 无 aspect-ratio 降级 → @supports not 兜底（旧浏览器 padding-bottom）
   ③ 低清图渲染：不做放大优化，保留浏览器默认平滑插值（盒子统一由尺寸规则保证）
   全部为追加覆盖规则，未改动上方任何既有声明 → 现代浏览器行为与改动前完全一致
   @supports not 仅在不支持 aspect-ratio 的浏览器生效
   ========================================================================== */

/* ① 主编力荐大封面：阻止 flex 拉伸，使 aspect-ratio:3/4 生效（192×256） */
.pick__cover { align-self: flex-start; }

/* ③ 低清封面渲染策略：不做放大优化（默认平滑插值），不引入 pixelated 等放大优化模式 */
.book-card__cover > img { image-rendering: auto; }

/* ② 旧浏览器降级（不支持 aspect-ratio 时）：padding-bottom 占位 + 图片绝对定位铺满 */
@supports not (aspect-ratio: 3 / 4) {
  .book-card__cover { height: 0; padding-bottom: 133.3333%; }
  .book-card__cover > img { position: absolute; inset: 0; }
  .pick__cover { height: 256px; }
}

/* ==========================================================================
   WAVE7 · 三页仿纵横扁平化（排行榜 / 完本 / 分类）
   --------------------------------------------------------------------------
   根因：下列 19 个类此前全站（65 个 css）均未定义 —— 它们只在
         .nx-filter-row / .qd-rank-menu-group / .nx-home-rank-top / .qd-rank-top1
         等其它命名里作为「子串」出现，精确选择器匹配为 0。
         缺失导致三页区块无内边距、无分割线、卡片高度不齐 → 老板看到的「错位」。
   基调：沿用首页 WAVE4 语言 —— 1200 单列 · 扁平分区（细分割线 + 留白）
         · 一律 var(--qd-*) 令牌 · 分区标题左橙竖条
   范围：body[data-nav="rank|all|full|cate"] 精确限定
         → 不触首页(data-nav=home)/详情/阅读/搜索/漫画
   仅追加，不改动上方任何既有声明
   ========================================================================== */

/* ---------- ① 三页「卡套卡」降层：外层 .card → 扁平分区 ---------- */
body[data-nav="rank"] .page-main > .card,
body[data-nav="all"]  .page-main > .card,
body[data-nav="full"] .page-main > .card,
body[data-nav="cate"] .page-main > .card {
  background: transparent; border: 0; border-radius: 0; padding: 0; margin-bottom: 30px;
}
body[data-nav="rank"] .page-main > .card > .card__hd,
body[data-nav="all"]  .page-main > .card > .card__hd,
body[data-nav="full"] .page-main > .card > .card__hd,
body[data-nav="cate"] .page-main > .card > .card__hd {
  height: auto; padding: 0 0 12px; border-bottom: 1px solid var(--qd-border); margin-bottom: 18px;
}
body[data-nav="rank"] .page-main > .card > .card__hd h2,
body[data-nav="all"]  .page-main > .card > .card__hd h2,
body[data-nav="full"] .page-main > .card > .card__hd h2,
body[data-nav="cate"] .page-main > .card > .card__hd h2 {
  position: relative; padding-left: 13px; font-size: 19px; font-weight: 700;
}
body[data-nav="rank"] .page-main > .card > .card__hd h2::before,
body[data-nav="all"]  .page-main > .card > .card__hd h2::before,
body[data-nav="full"] .page-main > .card > .card__hd h2::before,
body[data-nav="cate"] .page-main > .card > .card__hd h2::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 19px; border-radius: 2px; background: var(--qd-red);
}
body[data-nav="rank"] .page-main > .card > .card__bd,
body[data-nav="all"]  .page-main > .card > .card__bd,
body[data-nav="full"] .page-main > .card > .card__bd,
body[data-nav="cate"] .page-main > .card > .card__bd { padding: 0; }

/* ---------- ② 页面横幅（排行榜 / 完本）：扁平，替代未定义块 ---------- */
.rank-hero,
.rank-top,
.fin-hero {
  display: flex; align-items: center; gap: 16px;
  padding: 22px 26px; margin-bottom: 26px;
  background: linear-gradient(90deg, var(--qd-brand-tint) 0%, var(--qd-card) 68%);
  border: 1px solid var(--qd-border); border-radius: var(--qd-radius);
}
.rank-hero__ico,
.rank-top__ico,
.fin-hero__ico {
  flex: none; width: 52px; height: 52px; border-radius: var(--qd-radius);
  display: flex; align-items: center; justify-content: center;
  background: var(--qd-red-grad); color: #fff; font-size: 24px;
}
.rank-hero__body,
.rank-top__body,
.fin-hero__body { flex: 1; min-width: 0; }
.rank-hero__body h1,
.rank-top__body h1,
.fin-hero__body h1 { font-size: 22px; font-weight: 700; }
.rank-hero__body p,
.rank-top__body p,
.fin-hero__body p { margin-top: 5px; font-size: 13px; color: var(--qd-text-3); }
.rank-hero__stat { flex: none; text-align: right; }
.rank-hero__stat span { display: block; font: 700 26px/1.2 var(--qd-font-num); color: var(--qd-red); }
.rank-hero__stat small { font-size: 12px; color: var(--qd-text-3); }
/* WAVE15：图标改为内联 SVG（fill=currentColor，继承 color:#fff → 白字在橙底上）。
   尺寸与 52×52 盒匹配；display:block 消掉 inline 基线空隙，靠 flex 居中不悬空。 */
.rank-hero__ico svg { display: block; width: 28px; height: 28px; }
/* WAVE15：≤900 断点无 19px 内缩（兄弟元素 padding 为 0），hero 同步归零，
   使内容落 wrap 左缘、与 .rank-filter__label 对齐；
   原 26px 会让 hero 右移 26px（且与 ≥901 方向相反）。 */
@media (max-width: 900px) {
  body[data-nav="rank"] .page-main > .rank-hero { padding-left: 0; padding-right: 0; }
}
/* WAVE15：窄屏副标题降级 —— 隐藏维度枚举，避免 390px 折 3 行把 hero 撑到 143px、
   图标被 align-items:center 托到文字块中间而“悬空”。 */
@media (max-width: 640px) {
  .rank-hero__dims { display: none; }
}
.rank-top__act,
.fin-hero__stats { flex: none; display: flex; gap: 10px; align-items: center; }

/* ---------- ③ 榜单筛选条（右栏「榜单分类/筛选」转横向，功能不丢） ---------- */
.rank-filter { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.rank-filter__label { flex: none; font-size: 13px; color: var(--qd-text-3); }
.rank-switch { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.rank-switch__label { flex: none; font-size: 13px; color: var(--qd-text-3); }

/* ---------- ④ 榜单表头 ---------- */
.rank-head {
  display: flex; align-items: center; gap: 12px;
  padding: 0 18px 10px; border-bottom: 1px solid var(--qd-border);
  font-size: 12px; color: var(--qd-text-3);
}
.rank-head__n { width: 22px; flex: none; text-align: center; }
.rank-head__book { flex: 1; min-width: 0; }
.rank-head__s { flex: none; }

/* ---------- ⑤ 排行榜网格：3 列 · 等高（空榜不再塌陷成一条） ----------
   WAVE10：3 列 → 4 列（需求：一行四个榜单卡）。
   WAVE16：4 列 → 3 列（左侧让出 202px 给「榜单导航」后 main=940，
           (940-2*20)/3 = 300/列，与纵横实测 300 一致）。
   用 minmax(0,1fr) 而不是 1fr：1fr = minmax(auto,1fr)，其 auto 最小值取网格项的
   min-content，长书名会把列撑破（与 WAVE9 的 .rname min-width:auto 同源）。
   本块是 .rank-grid 的唯一定义（上方旧定义已删）。 */
.rank-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--qd-gap); align-items: stretch;
}
.rank-grid > * { min-width: 0; }
.rank-grid > .card { margin-bottom: 0; display: flex; flex-direction: column; }
.rank-grid > .card > .card__bd { flex: 1; }

/* ---------- ⑤' WAVE16：仿纵横 —— 左「榜单导航」栏 + 右榜单网格 ----------
   容器是 .page-main 直系子元素，≥901 时继承既有 padding:0 19px → 内容宽 1162（x=139..1301）。
   侧栏取 202（而非需求文字的 240）：1162-202-20=940 → 3 列正好 300/列，
   且 202 比 240 更贴近纵横实测的 222；同时保住 x=139 这条贯穿 hero/网格/底部的对齐线。 */
.rank-layout { display: flex; gap: 20px; align-items: flex-start; }
.rank-side { width: 202px; flex: none; }
.rank-main { flex: 1; min-width: 0; }

/* 侧栏导航条：纵横为 36px 高 / 14px / 左内缩 17px / 无底色 / 悬停高亮。
   ⚠︎ 用 3 个类提高权重：后方 .rank-list.rk-list（2 类）的 padding:9px 14px 会盖掉 2 类规则。 */
.rank-list.rk-list.rk-list--plain li {
  display: block; padding: 0; border-bottom: 0; font-size: 14px;
}
.rank-list.rk-list.rk-list--plain li a {
  display: flex; align-items: center; height: 36px; padding: 0 17px;
  border-radius: var(--qd-radius-md); color: var(--qd-text-2);
  transition: background .1s linear, color .1s linear;
}
.side-card__bd .btn--block { margin-top: 14px; }

/* ---------- ⑥ 榜单说明 / 榜单导航（原右栏内容转底部，不丢功能） ----------
   WAVE12：底部两列要与上方 .rank-grid 的列边界精确重合。
   .rank-grid 是 4 列 + gap 20（col=(1162-3*20)/4=275.5，边界 139│434.5 710│730 1025.5│1301）；
   这里 2 列时 col=(1162-20)/2=571 → 139│710 730│1301，正好等于网格 1-2 列 / 3-4 列。
   原 gap:26 会算成 568 → 707│733，右偏 3px。
   margin-top:26 与其它区块间距（hero 26 / filter 22）对齐；原先与网格零间距。 */
.rank-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 26px; align-items: start; }
/* WAVE16：底部两块卡片化（仿纵横）—— 白底 + 边框 + 圆角。
   ⚠️ 加 1px 边框后内容右移 1px，故下方三处内边距各 −1px（18→17 / 15→14），
   以保住 W13 的对齐值（正文 154 / 745）。border-box 下外框不变，列边界不受影响。
   align-items:start —— 左卡（4 条说明）内容比右卡（3 张书卡）短很多，
   stretch 会在左卡里留一片看得见的空白白块；改用 start 让各自自然高。 */
.rank-notes > div {
  background: var(--qd-card); border: 1px solid var(--qd-border);
  border-radius: var(--qd-radius); padding-bottom: 14px;
}
.rank-menu-group { margin-bottom: 16px; }
.rank-menu-group:last-child { margin-bottom: 0; }
.rank-menu-group__title {
  position: relative; padding-left: 11px; margin-bottom: 8px;
  font-size: 15px; font-weight: 600;
}
.rank-menu-group__title::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 3px; height: 15px; border-radius: 2px; background: var(--qd-red);
}
.rule-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; }
.rule-list li { position: relative; padding-left: 15px; font-size: 13px; color: var(--qd-text-2); }
.rule-list li::before {
  content: ""; position: absolute; left: 0; top: 8px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--qd-red);
}

/* ---------- ⑦ 分类树 / 筛选行 / 结果条 ---------- */
.cate-tree { display: flex; flex-wrap: wrap; gap: 8px; }
.cate-tree a {
  display: inline-flex; align-items: center; height: 32px; padding: 0 15px;
  border-radius: var(--qd-radius-pill); background: var(--qd-bg-3);
  border: 1px solid var(--qd-border);
  font-size: 14px; color: var(--qd-text-2); transition: all .18s ease;
}
.cate-tree a.is-on { background: var(--qd-red); border-color: var(--qd-red); color: #fff; font-weight: 600; }

.filter-row {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 13px 0; border-bottom: 1px solid var(--qd-border-3);
}
.filter-row:first-child { padding-top: 0; }
.filter-row:last-child { border-bottom: 0; padding-bottom: 0; }
.filter-row__label { flex: none; width: 46px; font-size: 13px; color: var(--qd-text-3); line-height: 26px; }

.result-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding-bottom: 14px; margin-bottom: 18px; border-bottom: 1px solid var(--qd-border);
}
.result-bar__hd { font-size: 15px; font-weight: 600; }
.result-bar__hd small { font-size: 12px; color: var(--qd-text-3); font-weight: 400; }
.result-bar__sort { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.result-bar__sort a { color: var(--qd-link); }

/* 分类列表（横向书行）双列 */
.list-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 30px; }

/* ---------- ⑧ 空态：体面占位（完本页无数据时不塌成一条） ---------- */
.empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 300px; padding: 44px 20px; text-align: center; color: var(--qd-text-3);
}
.empty__ico {
  width: 96px; height: 96px; margin-bottom: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--qd-bg-2); font-size: 42px; color: var(--qd-text-3);
}
.empty p { font-size: 15px; margin-bottom: 18px; }

/* ---------- ⑨ 补齐其它缺失工具类 ---------- */
.fw4 { font-weight: 400; }
.rank-row--top { background: var(--qd-bg-3); }
.rank-row--top .medal { background: var(--qd-red); }

/* ---------- ⑩ 悬停（仅真悬停设备） ---------- */
@media (hover: hover) and (pointer: fine) {
  .cate-tree a:hover { background: var(--qd-red); border-color: var(--qd-red); color: #fff; }
  .result-bar__sort a:hover { color: var(--qd-red-hover); }
}

/* ---------- ⑪ 中屏降档 ---------- */
/* WAVE16：≤1199 让步 —— 侧栏折到顶部通栏（与既有 .layout-side 的降级同思路，
   见 L707-708），rank-grid 回到满宽 3 列 → 列宽与 W16 之前逐像素一致（零回归）。
   ⚠️ 纵向堆叠时交叉轴必须 stretch，否则子项按 min-content 收缩：
   .rank-main 会从 616 塔到 332.69，列宽全错（与 L1005-1007 对 .home-main 的同类修复同源）。
   导航两组并排 + 条目 2 列，把原来的 1 列高条压矮；总览按钮占满行。 */
@media (max-width: 1199px) {
  .rank-layout { flex-direction: column; align-items: stretch; }
  .rank-side { width: 100%; }
  .rank-side .side-card__bd { display: flex; flex-wrap: wrap; gap: 0 28px; }
  .rank-side .rank-menu-group { flex: 1 1 240px; }
  .rank-side .rank-list.rk-list.rk-list--plain { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rank-side .side-card__bd > .btn--block { flex: 1 1 100%; }
  .rank-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rank-notes { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}
@media (max-width: 900px) {
  .rank-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .list-cards { grid-template-columns: minmax(0, 1fr); }
  .rule-list { grid-template-columns: minmax(0, 1fr); }
  .rank-hero, .rank-top, .fin-hero { flex-wrap: wrap; }
  .result-bar { flex-wrap: wrap; gap: 8px; }
}
/* WAVE10：≤640 降为 1 列。PC 主题在窄视口（含桌面 UA 打开 390px）也要能读，
   4 列硬扛到 390px 会挤成一条；WAP 主题那份是独立 1 列，本规则不影响它。 */
@media (max-width: 640px) {
  .rank-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- (12) WAVE7 补充：.sec 扁平分区 / 榜单补充块 ---------- */
.sec { margin-bottom: 30px; }
.sec > .card__hd {
  height: auto; padding: 0 0 12px; border-bottom: 1px solid var(--qd-border); margin-bottom: 18px;
}
.sec > .card__hd h2 {
  position: relative; padding-left: 13px; font-size: 19px; font-weight: 700;
}
.sec > .card__hd h2::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 19px; border-radius: 2px; background: var(--qd-red);
}
/* WAVE12：与 .card__hd 同头栏度量（height:46 / padding:0 18px），
   使底部标题与网格卡标题同缩进、「更多 ›」同内缩 18px；
   仅保留 margin-bottom:14px。红条 ::before 与 17px 字号保持不变（未动版式风格）。 */
.rank-notes .card__hd {
  height: 46px; padding: 0 17px; border-bottom: 1px solid var(--qd-border); margin-bottom: 14px;
}
.rank-notes .card__hd h2 {
  /* WAVE12：padding-left 13→16。网格卡标题是「圆点 8px + gap 7px」→
     文字在卡内 x=173；本处 h2 左缘 157，补 16 → 文字 173，与网格卡标题精确齐平。
     红条 ::before（left:0）仍在 157，与网格卡圆点 158 差 1px —— 那 1px 来自
     网格卡的 border-left:1px（本区块是无边框 div），无法在不碰 .rank-grid 的前提下消除。
     字号 17px 与红条样式未改。 */
  position: relative; padding-left: 16px; font-size: 17px; font-weight: 700;
}
.rank-notes .card__hd h2::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 4px; height: 17px; border-radius: 2px; background: var(--qd-red);
}
/* WAVE13：底部两块的「正文」要与上方榜单卡正文锁同一条竖线。
   榜单卡正文左缘 = 卡边框 1px(139) + 内边距 14 = 154；
   本区块是无边框 div（左缘 139），补 15 → 154（右缘 1301-15=1286），与卡片正文齐平。
   ⚠️ .book-row 基础规则是 padding:12px 0，此处只覆盖左右，上下 12px 必须保留。 */
.rank-notes .rule-list { padding: 0 14px; }
.rank-notes .book-row  { padding-left: 14px; padding-right: 14px; }
/* WAVE14：≤640 时基础规则 .card__bd{padding:12px} 会让榜单卡正文再右移 12px，
   而本区块是无 .card__bd 的裸 div → 正文停在 12+15=27，比卡片正文 39 少 12px。
   此处补同样的 12px（26 = 12 + 14）；
   ⚠️ 不能加给 .rank-notes > div，否则标题(.card__hd)会一起内缩被推歪。
   .book-row 上下 12px 继续保留。
   （WAVE16：外层加了 1px 边框，故 27→26；26 = 12 + 1(边框) + 13→ 仍得 39。） */
@media (max-width: 640px) {
  .rank-notes .rule-list { padding: 0 26px; }
  .rank-notes .book-row  { padding: 12px 26px; }
}
.rank-switch-bar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 14px 0; border-bottom: 1px solid var(--qd-border);
}
.rank-empty { padding: 26px 18px; text-align: center; font-size: 13px; color: var(--qd-text-3); }
.empty--lg { min-height: 340px; }
.empty__sub { font-size: 13px; color: var(--qd-text-3); max-width: 460px; margin: 0 auto 20px; line-height: 1.8; }
.empty__acts { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 640px) {
  .sec > .card__hd h2 { font-size: 16px; }
  .empty--lg { min-height: 240px; padding: 30px 16px; }
}

/* ---------- (13) WAVE7 补充2：内容区宽度与首页对齐 ----------
   首页 WAVE4 的正文在 .card__bd 内，左右各 18px 内边距 → 内容宽 1164；
   三页扁平分区若走满 1200，书卡会比首页宽 6px、高约 18px，跨页观感不齐。
   此处统一为 1164（与首页一致）；横幅/面包屑/分页保持满宽。 */
@media (min-width: 901px) {
  body[data-nav="rank"] .page-main > *,
  body[data-nav="all"]  .page-main > *,
  body[data-nav="full"] .page-main > *,
  body[data-nav="cate"] .page-main > * { padding-left: 19px; padding-right: 19px; }
  body[data-nav="rank"] .page-main > .crumb,
  body[data-nav="all"]  .page-main > .crumb,
  body[data-nav="full"] .page-main > .crumb,
  body[data-nav="cate"] .page-main > .crumb,
  body[data-nav="rank"] .page-main > .pager,
  body[data-nav="all"]  .page-main > .pager,
  body[data-nav="full"] .page-main > .pager,
  body[data-nav="cate"] .page-main > .pager,
  body[data-nav="rank"] .page-main > .rank-top,
  body[data-nav="full"] .page-main > .fin-hero { padding-left: 0; padding-right: 0; }
  /* WAVE15：hero 需 18px 内边距（自身边框 1px + 18 = 19，与下方内容对齐），
     故从上面那组【归零】里拆出单列一条。
     ⚠️ 不能把它挂在 crumb/pager 组尾 —— 那样整组都会吃 18px（面包屑会被右推 18px）。 */
  body[data-nav="rank"] .page-main > .rank-hero { padding-left: 18px; padding-right: 18px; }
  /* WAVE15：本条原为 .rank-hero{padding-left:0;padding-right:0}，
     但兄弟元素在本断点有 19px 内缩，hero 自身有 1px 边框 ——
     padding 取 0 会让 hero 内容比下方整体【左移 18px】（@1440 图标 121 vs 标签 139）。
     现取 18（边框 1 + 18 = 19）→ 内容落 x=139，与 .rank-filter__label 对齐。 */
}

/* ---------- (14) WAVE7 补充3：书卡标题行高归一 ----------
   首页书卡标题用 <h4>（继承标题行高 1.35 → 18.9px），列表页用 <div>（继承 body 1.6 → 22.4px），
   导致卡高差 2.5px。此处显式统一，使三页书卡与首页逐像素等高。 */
body[data-nav="all"]  .book-card__title,
body[data-nav="cate"] .book-card__title,
body[data-nav="full"] .book-card__title { line-height: 1.35; }


/* ==========================================================================
   WAVE8 · 仿纵横小说网（排行榜 Top3 / 作品页信息层级 / 目录折叠）
   --------------------------------------------------------------------------
   ① 修老板报的「字错位」真根因：
      模板封面用 <span class="cover"> 包 <span class="book-card__cover">，
      span 默认 display:inline —— inline 元素上 aspect-ratio 不生效，
      其高度退化为内部 <img> 的自身比例（3:4 图 → 50×66.7；4:5 图 → 50×62.5），
      同一排卡片行高 92/92/88 不齐 → 卡内 .rank-list 起点错开 → 跨列文字对不齐。
      修法：封面容器显式块级化 + 定高，图片一律 object-fit 裁切填充，
          图片自身比例不再参与行高计算。
   ② 排行榜总览：Top3 带封面（仿纵横）+ 04-10 编号行 + 细分隔线 + 留白。
   ③ 作品页：状态标签 / 数据区 / 最新章节 / 按钮组 层级对齐纵横。
   ④ 目录折叠：SEO 安全 —— 全部章节链接仍写在 HTML 源码里，
      仅用 CSS 隐藏超出部分 + JS 展开，不做服务端分页。
   令牌一律沿用单一命名空间 --qd-*。仅追加，不改动上方任何既有声明。
   ========================================================================== */

/* ---------- ① 封面容器块级化：根治行高不齐 ---------- */
.rank-row .cover,
.rank-top3 .rt-cover { display: block; }

.rank-row .cover { width: 50px; flex: none; }
.rank-row .cover .book-card__cover,
.rank-top3 .rt-cover .book-card__cover {
  display: block; width: 100%;
  aspect-ratio: 3 / 4; overflow: hidden;
  border-radius: 4px; box-shadow: none; background: var(--qd-bg-2);
}
.rank-row .cover .book-card__cover > img,
.rank-top3 .rt-cover .book-card__cover > img {
  display: block; width: 100%; height: 100%; object-fit: cover;
}
/* 双保险：封面盒显式定高（50 × 4/3），任何图片比例都不再撑变行高 */
.rank-row .cover .book-card__cover { height: 66.7px; }

/* ---------- ② 排行榜总览：Top3 带封面（仿纵横）---------- */
.rank-top3 { margin: 0; padding: 0; }
.rank-top3 > li {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid var(--qd-border-3);
}
.rank-top3 > li:last-child { border-bottom: 0; }
.rank-top3 .rt-cover { position: relative; flex: none; width: 54px; }
.rank-top3 .rt-cover .book-card__cover { height: 72px; }
.rank-top3 .rt-no {
  position: absolute; left: 0; top: 0;
  min-width: 18px; height: 18px; padding: 0 4px;
  display: flex; align-items: center; justify-content: center;
  background: var(--qd-text-4); color: #fff;
  font: 700 11px/1 var(--qd-font-num);
  border-radius: 0 0 4px 0;
}
.rank-top3 > li:nth-child(1) .rt-no { background: var(--qd-red); }
.rank-top3 > li:nth-child(2) .rt-no { background: var(--qd-brand-2); }
.rank-top3 > li:nth-child(3) .rt-no { background: var(--qd-brand-1); }
.rank-top3 .rt-body { flex: 1; min-width: 0; display: block; }
.rank-top3 .rt-t {
  display: block; font-size: 14px; font-weight: 600; color: var(--qd-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rank-top3 .rt-m {
  display: block; margin-top: 3px; font-size: 12px; color: var(--qd-text-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rank-top3 .rt-v {
  flex: none; font-size: 12px; color: var(--qd-text-3);
  font-family: var(--qd-font-num); font-variant-numeric: tabular-nums;
}
.rank-empty { padding: 26px 14px; text-align: center; font-size: 13px; color: var(--qd-text-3); }

/* 编号行（04-10）：更细分隔 + 更透气行高 */
.rank-list.rk-list li { padding: 9px 14px; gap: 10px; }
.rank-list.rk-list .no { width: 22px; background: transparent; color: var(--qd-text-4); }
.rank-list.rk-list .v { font-variant-numeric: tabular-nums; }

/* ---------- ③ 作品页：信息层级（仿纵横）---------- */
.book-hero__stats {
  display: flex; margin: 0 0 14px;
  border: 1px solid var(--qd-border); background: var(--qd-bg-3);
}
.book-hero__stats > div {
  flex: 1; min-width: 0; padding: 10px 14px; text-align: center;
  border-right: 1px solid var(--qd-border);
}
.book-hero__stats > div:last-child { border-right: 0; }
.book-hero__stats p { margin-bottom: 4px; font-size: 12px; color: var(--qd-text-3); }
.book-hero__stats b { font: 700 17px/1.2 var(--qd-font-num); color: var(--qd-text); }
.book-hero__latest {
  margin-bottom: 14px; font-size: 13px; color: var(--qd-text-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.book-hero__latest a { color: var(--qd-link); }

/* W20：已删除「最新章节快读」全套样式规则 —— 模板已移除该区块，不留死代码。 */

/* ---------- ④ 目录折叠（SEO 安全：链接仍全部在源码里）---------- */
.chap-grid.is-collapsed > a:nth-child(n+25) { display: none; }
.chap-toggle-wrap { padding: 14px 0 2px; text-align: center; }
.chap-toggle {
  display: inline-flex; align-items: center; gap: 7px;
  height: 34px; padding: 0 22px; cursor: pointer;
  background: #fff; border: 1px solid var(--qd-border-2); border-radius: var(--qd-radius-md);
  font-size: 13px; color: var(--qd-text-2);
}
.chap-toggle::after {
  content: ""; width: 6px; height: 6px; margin-top: -4px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}
.chap-toggle.is-open::after { margin-top: 3px; transform: rotate(-135deg); }

@media (hover: hover) and (pointer: fine) {
  .chap-toggle:hover { border-color: var(--qd-red); color: var(--qd-red); }
  .rank-top3 .rt-t:hover { color: var(--qd-red); }
}

@media (max-width: 640px) {
  .book-hero__stats > div { padding: 8px 6px; }
  .book-hero__stats b { font-size: 15px; }
  .rank-top3 .rt-cover { width: 46px; }
  .rank-top3 .rt-cover .book-card__cover { height: 61.3px; }
}
/* WAVE8 补充：编号行标题单行省略 —— 缺省 .rank-row .t/.m 未设 nowrap，
   长书名在窄屏换行 → 行高 44.4 vs 20 交替（实测 WAP 97.97/91.69 抖动）。
   统一为单行省略，使行高恒定（与 Top3 的 .rt-t 一致）。 */
.rank-row .body { display: block; }
.rank-row .t,
.rank-row .m { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-row .m { display: flex; }   /* .m 仍是 flex（含作者/分类/状态胶囊），仅 .t 省略 */

/* ==========================================================================
   WAVE17 · 作品页仿起点：左竖导航 + 主区 + 作者卡
   --------------------------------------------------------------------------
   容器 .wrap 1200（data-nav="home" 无 19px 内缩）→ 1200 = 104 + 20 + 816 + 20 + 240
   主区 816（=1200-104-20-20-240，落在需求允许的 800~840 内）。
   沿用 --qd-* 令牌，未引入新 token；未新增/删除任何既有类名。
   ========================================================================== */
.book-layout { display: flex; gap: 20px; align-items: flex-start; margin-bottom: var(--qd-gap); }
.book-main { flex: 1; min-width: 0; }
/* 主区内只有 hero 一张卡；其自带的 margin-bottom 会在布局底部多出 20px，清零交由 .book-layout 统一控距 */
.book-main > .card:last-child { margin-bottom: 0; }

/* ---------- 左竖导航（纯锚点，SEO 安全；sticky 吸附） ---------- */
.book-nav { width: 104px; flex: none; }
.book-nav__card {
  position: sticky; top: calc(var(--qd-header-h) + 16px);
  background: var(--qd-card); border: 1px solid var(--qd-border);
  border-radius: var(--qd-radius); padding: 6px 0;
}
.book-nav__card a {
  display: block; padding: 0 14px; height: 56px; line-height: 56px;
  font-size: 14px; color: var(--qd-text-2);
  border-left: 3px solid transparent; transition: all .15s linear;
}
/* 选中项高亮（照起点：左侧红条 + 浅底色）。纯 CSS，无 JS 依赖 */
.book-nav__card a:first-child { color: var(--qd-red); font-weight: 600; border-left-color: var(--qd-red); background: var(--qd-brand-tint); }

/* ---------- 右作者卡 ---------- */
.book-side { width: 240px; flex: none; }
.author-card { display: flex; gap: 14px; align-items: flex-start; }
.author-card__avatar {
  flex: none; width: 56px; height: 56px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--qd-red-grad); color: #fff; font-size: 22px; font-weight: 700;
}
.author-card__body { flex: 1; min-width: 0; }
.author-card__name { font-size: 15px; font-weight: 700; color: var(--qd-text); }
.author-card__meta { margin-top: 4px; font-size: 12px; color: var(--qd-text-3); }
.author-card__intro { margin-top: 8px; font-size: 12px; line-height: 1.7; color: var(--qd-text-2); }
.author-card__books { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--qd-border-3); }
.author-card__books-title { margin-bottom: 6px; font-size: 12px; font-weight: 600; color: var(--qd-text-3); }
.author-card__book {
  display: block; font-size: 13px; color: var(--qd-text-2); line-height: 1.9;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------- hero 内简介预览（截断 2 行；完整简介仍在下文「作品简介」卡片） ---------- */
.book-hero__intro {
  margin-bottom: 14px; font-size: 13px; line-height: 1.7; color: var(--qd-text-3);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .book-nav__card a:hover { color: var(--qd-red); background: var(--qd-brand-tint); }
  .author-card__name:hover, .author-card__book:hover { color: var(--qd-red); }
}

/* ---------- 响应式 ---------- */
/* ≤1199：作者卡收进下方，竖导航转横向锚点条（与站点既有降级同思路） */
@media (max-width: 1199px) {
  .book-layout { flex-direction: column; align-items: stretch; }
  .book-nav { width: 100%; }
  .book-nav__card { position: static; display: flex; padding: 0; }
  .book-nav__card a { flex: 1; height: 44px; line-height: 44px; padding: 0 12px; text-align: center;
    border-left: 0; border-bottom: 3px solid transparent; }
  .book-nav__card a:first-child { border-left-color: transparent; border-bottom-color: var(--qd-red); }
  .book-side { width: 100%; }
}
/* ≤640：竖导航保持横向可读 */
@media (max-width: 640px) {
  .book-nav__card a { font-size: 13px; padding: 0 8px; }
  .author-card__avatar { width: 48px; height: 48px; font-size: 19px; }
}

/* ==========================================================================
   W20：作品页「打赏支持」+「书友评论」（仿起点互动投票 / 书友评论）
   令牌沿用 --qd-*，不写死颜色；WAP 经 @import 复用本段。
   ========================================================================== */

/* ------------------------------ 打赏 ------------------------------ */
.reward-wrap { display: flex; gap: 24px; align-items: flex-start; }
.reward-main { flex: 1; min-width: 0; }
.reward-side { width: 300px; flex: none; }

/* 金额单选：选中态红框 + 浅红底 */
.reward-amounts { display: flex; gap: 12px; }
.reward-amt {
  position: relative; flex: 1; min-width: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  height: 58px; cursor: pointer;
  background: var(--qd-card); border: 1px solid var(--qd-border-2);
  border-radius: var(--qd-radius); transition: border-color .15s, background .15s;
}
.reward-amt input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.reward-amt__c {
  font-family: var(--qd-font-num); font-size: 17px; font-weight: 700;
  line-height: 1.25; color: var(--qd-text);
}
.reward-amt__u { font-size: 11px; color: var(--qd-text-3); }
.reward-amt.is-on { border-color: var(--qd-red); background: var(--qd-brand-tint); }
.reward-amt.is-on .reward-amt__c { color: var(--qd-red); }

.reward-remark { margin-top: 12px; min-height: 64px; }
.reward-submit { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.reward-tip { font-size: 12px; color: var(--qd-text-3); }
.reward-tip a { color: var(--qd-link); }
.reward-sum { color: var(--qd-red); font-family: var(--qd-font-num); }

/* 打赏榜 */
.reward-side__title {
  font-size: 14px; font-weight: 600; color: var(--qd-text);
  padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid var(--qd-border-3);
}
.reward-list { max-height: 262px; overflow-y: auto; }
.reward-item { display: flex; align-items: center; gap: 8px; height: 30px; font-size: 13px; }
.reward-item__no {
  flex: none; width: 18px; height: 18px; line-height: 18px; text-align: center;
  border-radius: var(--qd-radius-sm); background: var(--qd-bg-2);
  font-size: 11px; color: var(--qd-text-3); font-family: var(--qd-font-num);
}
.reward-item__no.is-top--1 { background: var(--qd-red); color: #fff; }
.reward-item__no.is-top--2 { background: var(--qd-orange); color: #fff; }
.reward-item__no.is-top--3 { background: var(--qd-yellow); color: var(--qd-text); }
.reward-item__name {
  flex: 1; min-width: 0; color: var(--qd-text-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.reward-item__amt { flex: none; font-family: var(--qd-font-num); font-weight: 600; color: var(--qd-red); }
.reward-empty { padding: 18px 0; text-align: center; font-size: 13px; color: var(--qd-text-3); }

/* ------------------------------ 评论 ------------------------------ */
.comment-input { min-height: 76px; }
.comment-form__foot { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.comment-form__tip { font-size: 12px; color: var(--qd-text-3); }
.comment-form__tip a { color: var(--qd-link); }
.comment-form.is-locked .comment-input { background: var(--qd-bg-2); cursor: not-allowed; }

.comment-list { margin-top: 4px; border-top: 1px solid var(--qd-border-3); }
.comment-item { display: flex; gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--qd-border-3); }
.comment-item:last-child { border-bottom: 0; }
.comment-item__avatar {
  flex: none; width: 34px; height: 34px; line-height: 34px; text-align: center;
  border-radius: var(--qd-radius-circle); background: var(--qd-brand-grad);
  color: #fff; font-size: 14px; font-weight: 600;
}
.comment-item__avatar.has-img, .reward-item__avatar.has-img { overflow: hidden; padding: 0; background: var(--qd-border-3); }
.comment-item__avatar.has-img img, .reward-item__avatar.has-img img {
  display: block; width: 100%; height: 100%; object-fit: cover; border-radius: var(--qd-radius-circle);
}
.reward-item__avatar {
  flex: none; width: 22px; height: 22px; line-height: 22px; text-align: center;
  border-radius: var(--qd-radius-circle); background: var(--qd-brand-grad);
  color: #fff; font-size: 12px; font-weight: 600;
}
.comment-item__body { flex: 1; min-width: 0; }
.comment-item__hd { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.comment-item__name { font-size: 13px; font-weight: 600; color: var(--qd-text); }
.comment-item__time { font-size: 12px; color: var(--qd-text-3); }
.comment-item__content {
  margin-top: 4px; font-size: 13px; line-height: 1.7; color: var(--qd-text-2);
  word-break: break-word;
}
.comment-item__reply {
  margin-top: 8px; padding: 8px 10px;
  background: var(--qd-bg-3); border-left: 2px solid var(--qd-red);
  border-radius: 0 var(--qd-radius-sm) var(--qd-radius-sm) 0;
  font-size: 12px; line-height: 1.7; color: var(--qd-text-2);
}
.comment-item__reply-label { color: var(--qd-red); }
.comment-empty { padding: 26px 0; text-align: center; font-size: 13px; color: var(--qd-text-3); }

/* --------------------------- hover 守卫 --------------------------- */
@media (hover: hover) and (pointer: fine) {
  .reward-amt:hover { border-color: var(--qd-red); }
}

/* ≤900：打赏两栏转单栏（打赏榜下沉到操作区下方）
   注：align-items 必须重置为 stretch —— 基类的 flex-start 在 column 方向会让子项收缩到内容宽，
   金额按钮被挤成 48px。实测错误值 48px → 正确值随容器铺满。 */
@media (max-width: 900px) {
  .reward-wrap { flex-direction: column; gap: 18px; align-items: stretch; }
  .reward-main { flex: none; width: 100%; }
  .reward-side { width: 100%; }
  .reward-list { max-height: none; }
}

/* ≤640：金额按钮换行，2 列 */
@media (max-width: 640px) {
  .reward-amounts { flex-wrap: wrap; }
  .reward-amt { flex: 0 0 calc((100% - 12px) / 2); }
  .reward-submit { flex-wrap: wrap; }
}
/* W93：首页公告条「更多」入口 */
.home-acts__more{flex:0 0 auto;font-size:12px;color:var(--qd-muted);text-decoration:none;white-space:nowrap}
.home-acts__more:hover{color:var(--qd-red,#e11d48)}