@charset "utf-8";
/* ============================================================
   yanlan 主题 - 按演示图还原：蓝色门户风格 / 密集信息 / 浅灰底
   （主色蓝、灰色边框盒子、编号列表、两栏布局）
   ============================================================ */
:root {
    --yl-blue: #2a6cb0;
    --yl-blue-d: #1e5f9e;
    --yl-blue-l: #e8f1fa;
    --yl-orange: #f08a24;
    --yl-red: #d9534f;
    --yl-text: #333;
    --yl-text-2: #666;
    --yl-text-3: #999;
    --yl-line: #dde4ec;
    --yl-line-2: #eef2f6;
    --yl-bg: #f2f5f8;
    --yl-surface: #fff;
    --yl-hd-bg: #f6f9fc;
    --yl-wrap: 1220px;
    --yl-font: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
}
* { box-sizing: border-box; }
body.yl-body { margin: 0; background: var(--yl-bg); color: var(--yl-text); font: 14px/1.7 var(--yl-font); }
a { color: var(--yl-text); text-decoration: none; }
a:hover { color: var(--yl-blue); }
img { max-width: 100%; height: auto; border: 0; }
h1, h2, h3 { margin: 0; font-weight: 700; }
ul, ol { margin: 0; padding: 0; list-style: none; }
em, i { font-style: normal; }
.yl-wrap { width: 100%; max-width: var(--yl-wrap); margin: 0 auto; padding: 0 10px; }
.yl-main { display: block; padding: 12px 0 24px; min-height: 50vh; }
.yl-clamp2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yl-empty { color: var(--yl-text-3); padding: 18px; text-align: center; }

/* ---------- 顶部 ---------- */
.yl-header { background: #fff; border-bottom: 2px solid var(--yl-blue); }
.yl-head-in { display: flex; align-items: center; gap: 16px; height: 74px; }
.yl-logo { display: flex; flex-direction: column; line-height: 1.25; }
.yl-logo-t { font-size: 26px; font-weight: 700; color: var(--yl-blue); letter-spacing: 1px; }
.yl-logo-s { font-size: 12px; color: var(--yl-text-3); }
.yl-search { flex: 1 1 auto; display: flex; max-width: 480px; margin-left: 10px; }
.yl-search input { flex: 1 1 auto; height: 36px; padding: 0 12px; border: 2px solid var(--yl-blue); border-right: 0; background: #fff; font: inherit; outline: none; }
.yl-search button { height: 36px; padding: 0 22px; border: 0; background: var(--yl-blue); color: #fff; font: inherit; cursor: pointer; }
.yl-search button:hover { background: var(--yl-blue-d); }
.yl-quick { display: flex; gap: 18px; font-size: 13px; color: var(--yl-text-2); margin-left: auto; }
.yl-quick a { color: var(--yl-text-2); }
.yl-nav { background: var(--yl-blue); }
.yl-nav .yl-wrap { display: flex; flex-wrap: wrap; align-items: center; height: 42px; }
.yl-nav a { color: #fff; font-size: 15px; padding: 0 17px; line-height: 42px; display: block; }
.yl-nav a:first-child { padding-left: 14px; }
.yl-nav a:hover, .yl-nav a.on { background: var(--yl-blue-d); color: #fff; }

/* ---------- 通用盒子（灰头 + 白身 + 边框）---------- */
.yl-sec { background: var(--yl-surface); border: 1px solid var(--yl-line); margin-bottom: 12px; }
.yl-sec-hd { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 12px; background: var(--yl-hd-bg); border-bottom: 1px solid var(--yl-line); }
.yl-sec-hd h1, .yl-sec-hd h2 { font-size: 16px; color: var(--yl-blue-d); }
.yl-sec-hd h1::before, .yl-sec-hd h2::before { content: ""; display: inline-block; width: 4px; height: 15px; background: var(--yl-blue); margin-right: 8px; vertical-align: -2px; border-radius: 2px; }
.yl-sec-sub { font-size: 12px; color: var(--yl-text-3); }
.yl-more { margin-left: auto; font-size: 12.5px; color: var(--yl-blue); }
.yl-crumb { font-size: 12.5px; color: var(--yl-text-3); padding: 6px 2px 10px; }
.yl-crumb a { color: var(--yl-text-2); }
.yl-crumb .cur { color: var(--yl-text); }

/* ---------- 两栏 ---------- */
.yl-two-col { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 12px; align-items: start; }

/* ---------- 热门推荐（2x2 大卡）---------- */
.yl-grid { display: grid; gap: 10px; }
.yl-grid-commend { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; }
.yl-card-commend { display: flex; gap: 10px; padding-bottom: 10px; border-bottom: 1px dotted var(--yl-line); }
.yl-cover { flex: 0 0 auto; width: 92px; height: 123px; overflow: hidden; background: #eef2f6; display: block; position: relative; }
.yl-cover img { width: 100%; height: 100%; object-fit: cover; }
.yl-tag { position: absolute; left: 0; bottom: 0; right: 0; background: rgba(0, 0, 0, .55); color: #fff; font-size: 11px; text-align: center; line-height: 18px; }
.yl-card-bd { min-width: 0; flex: 1 1 auto; }
.yl-book-title { font-size: 15px; font-weight: 700; margin: 0 0 4px; }
.yl-book-title a { color: var(--yl-blue-d); }
.yl-book-intro { font-size: 12.5px; color: var(--yl-text-2); line-height: 1.7; margin: 0 0 5px; }
.yl-book-meta { font-size: 12px; color: var(--yl-text-3); margin: 0 0 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-book-meta a { color: var(--yl-blue); }
.yl-book-foot { display: flex; justify-content: space-between; font-size: 12px; color: var(--yl-text-3); margin: 0; }

/* ---------- 分类块（3 列，编号列表）---------- */
.yl-cat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.yl-cat { background: #fff; border: 1px solid var(--yl-line); }
.yl-cat-hd { display: flex; align-items: center; height: 40px; padding: 0 12px; background: var(--yl-hd-bg); border-bottom: 1px solid var(--yl-line); }
.yl-cat-hd h2 { font-size: 15.5px; color: var(--yl-blue-d); }
.yl-cat-hd .yl-more { margin-left: auto; font-size: 12px; }
.yl-cat-top { display: flex; gap: 10px; padding: 10px 12px 8px; border-bottom: 1px dotted var(--yl-line); }
.yl-cat-top .yl-cover { width: 80px; height: 107px; }
.yl-cat-top .yl-book-intro { font-size: 12px; }
.yl-cat-list { padding: 6px 12px 10px; counter-reset: ylrank; }
.yl-cat-list li { display: flex; align-items: center; gap: 8px; height: 31px; border-bottom: 1px dotted var(--yl-line-2); font-size: 13.5px; counter-increment: ylrank; }
.yl-cat-list li:last-child { border-bottom: 0; }
.yl-cat-list li::before { content: counter(ylrank); flex: 0 0 auto; width: 16px; height: 16px; line-height: 16px; text-align: center; font-size: 11px; color: #fff; background: #b9c6d4; border-radius: 50%; }
.yl-cat-list li:nth-child(1)::before { background: #e0574f; }
.yl-cat-list li:nth-child(2)::before { background: #f0924a; }
.yl-cat-list li:nth-child(3)::before { background: #e5b53c; }
.yl-cat-list li a { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-cat-list li em { flex: 0 0 auto; color: var(--yl-text-3); font-size: 12px; }

/* ---------- 最近更新表格 ---------- */
.yl-upd-hd, .yl-upd-row { display: grid; grid-template-columns: 56px minmax(0, 1.1fr) minmax(0, 1.5fr) 84px 60px; gap: 8px; align-items: center; font-size: 13px; }
.yl-upd-hd { padding: 8px 12px; background: #fafcfe; border-bottom: 1px solid var(--yl-line); color: var(--yl-text-3); font-size: 12px; }
.yl-upd-row { padding: 7px 12px; border-bottom: 1px dotted var(--yl-line-2); }
.yl-upd-row .c { color: var(--yl-blue); font-size: 12px; }
.yl-upd-row .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-upd-row .ch, .yl-upd-row .a { color: var(--yl-text-3); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-upd-row .d { color: var(--yl-text-3); font-size: 12px; text-align: right; }

/* ---------- 最新入库 / 排行 ---------- */
.yl-newlist { padding: 8px 12px; counter-reset: ylnew; }
.yl-newlist li { display: flex; gap: 8px; align-items: center; height: 29px; font-size: 13.5px; counter-increment: ylnew; }
.yl-newlist li::before { content: counter(ylnew); flex: 0 0 auto; width: 16px; height: 16px; line-height: 16px; text-align: center; font-size: 11px; color: #fff; background: var(--yl-blue); border-radius: 50%; }
.yl-newlist li a { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-newlist li em { flex: 0 0 auto; color: var(--yl-text-3); font-size: 12px; }

/* ---------- 列表 / 搜索 / 作者 ---------- */
.yl-list { padding: 0 12px; }
.yl-list-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px dotted var(--yl-line); }
.yl-list-item:last-child { border-bottom: 0; }
.yl-cover-sm { flex: 0 0 auto; width: 76px; height: 102px; overflow: hidden; background: #eef2f6; display: block; }
.yl-cover-sm img { width: 100%; height: 100%; object-fit: cover; }
.yl-list-bd { min-width: 0; }
.yl-list-bd em { color: var(--yl-red); }
.yl-filter { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; background: #fff; border: 1px solid var(--yl-line); margin-bottom: 12px; }
.yl-filter a { padding: 4px 14px; border: 1px solid var(--yl-line); font-size: 13px; color: var(--yl-text-2); background: #fff; }
.yl-filter a.on, .yl-filter a:hover { background: var(--yl-blue); border-color: var(--yl-blue); color: #fff; }
.yl-filter .yl-full { margin-left: auto; }
.yl-pager { padding: 14px 0; text-align: center; }
.yl-pager a, .yl-pager span, .yl-pager strong { display: inline-block; min-width: 32px; padding: 5px 10px; margin: 2px; border: 1px solid var(--yl-line); font-size: 13px; background: #fff; color: var(--yl-text-2); }
.yl-pager strong { background: var(--yl-blue); border-color: var(--yl-blue); color: #fff; }

/* ---------- 书籍详情 ---------- */
.yl-book { display: flex; gap: 18px; padding: 16px 14px; background: #fff; border: 1px solid var(--yl-line); margin-bottom: 12px; }
.yl-book-cover { flex: 0 0 auto; width: 148px; height: 198px; overflow: hidden; background: #eef2f6; }
.yl-book-cover img { width: 100%; height: 100%; object-fit: cover; }
.yl-book-info { flex: 1 1 auto; min-width: 0; }
.yl-book-h1 { font-size: 22px; color: var(--yl-blue-d); margin-bottom: 8px; }
.yl-meta-list { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; color: var(--yl-text-2); margin: 0 0 6px; }
.yl-meta-list a { color: var(--yl-blue); }
.yl-book-kw { font-size: 12.5px; color: var(--yl-text-3); margin: 0 0 4px; }
.yl-book-last { font-size: 13px; margin: 0 0 12px; }
.yl-book-last a { color: var(--yl-orange); }
.yl-btn-row { display: flex; flex-wrap: wrap; gap: 8px; }
.yl-btn { display: inline-block; padding: 7px 22px; border: 1px solid var(--yl-line); background: #fff; color: var(--yl-text-2); font-size: 13.5px; }
.yl-btn-main { background: var(--yl-blue); border-color: var(--yl-blue); color: #fff; }
.yl-btn-main:hover { background: var(--yl-blue-d); color: #fff; }
.yl-btn-ghost { color: var(--yl-blue); border-color: #b9d3ea; background: var(--yl-blue-l); }
.yl-intro { padding: 12px 14px; font-size: 13.5px; color: var(--yl-text-2); line-height: 1.9; }
.yl-lastch { padding: 10px 14px; background: #fafcfe; border-bottom: 1px dotted var(--yl-line); font-size: 13px; }
.yl-lastch-t { color: var(--yl-blue-d); font-weight: 700; margin-right: 8px; }
.yl-lastch a { margin-right: 14px; color: var(--yl-blue); }
.yl-catalog { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 12px; padding: 8px 14px 14px; max-height: 620px; overflow: auto; }
.yl-catalog li { padding: 6px 0; border-bottom: 1px dotted var(--yl-line-2); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-catalog .yl-cat-vol { grid-column: 1 / -1; color: var(--yl-blue-d); font-weight: 700; background: #f6f9fc; padding: 6px 8px; border-bottom: 1px solid var(--yl-line); }

/* 相关推荐 */
.yl-rel-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 12px; }
.yl-rel { display: flex; gap: 8px; padding: 8px; border: 1px solid var(--yl-line-2); }
.yl-rel:hover { border-color: #cfe0ef; }
.yl-rel img { flex: 0 0 auto; width: 62px; height: 83px; object-fit: cover; background: #eef2f6; }
.yl-rel-bd { min-width: 0; display: flex; flex-direction: column; }
.yl-rel-bd b { font-size: 13px; color: var(--yl-blue-d); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-rel-bd em { font-size: 12px; color: var(--yl-text-3); }
.yl-rel-bd i { font-size: 12px; color: var(--yl-text-2); line-height: 1.5; }
.yl-rel-tags { padding: 0 12px 12px; font-size: 13px; color: var(--yl-text-2); }
.yl-rel-tags a { margin-right: 12px; color: var(--yl-blue); }
.yl-rel-t { color: var(--yl-text-3); }

/* ---------- 阅读页 ---------- */
.yl-read { background: #fff; border: 1px solid var(--yl-line); padding: 16px 22px 22px; }
.yl-read-hd { border-bottom: 1px dotted var(--yl-line); padding-bottom: 10px; margin-bottom: 14px; }
.yl-read-hd h1 { font-size: 20px; color: var(--yl-blue-d); margin-bottom: 6px; }
.yl-read-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; color: var(--yl-text-3); }
.yl-read-meta a { color: var(--yl-blue); }
.yl-read-tools { display: flex; gap: 6px; margin-top: 10px; }
.yl-read-tools button { padding: 4px 12px; border: 1px solid var(--yl-line); background: #fafcfe; color: var(--yl-text-2); font: inherit; font-size: 12.5px; cursor: pointer; }
.yl-read-tools button:hover { border-color: var(--yl-blue); color: var(--yl-blue); }
.yl-read-content { font-size: 18px; line-height: 2.1; color: #222; word-break: break-word; }
.yl-read-content p { margin: 0 0 .85em; text-indent: 2em; }
.yl-enc-tip { text-indent: 0 !important; color: var(--yl-text-3); }
.yl-read-nav { display: flex; gap: 8px; justify-content: center; margin-top: 20px; }
.yl-nav-btn { display: inline-block; padding: 7px 20px; border: 1px solid var(--yl-line); background: #fafcfe; color: var(--yl-text-2); font-size: 13px; }
.yl-nav-btn:hover { border-color: var(--yl-blue); color: var(--yl-blue); }
.yl-nav-next { background: var(--yl-blue); border-color: var(--yl-blue); color: #fff; }
.yl-nav-next:hover { background: var(--yl-blue-d); color: #fff; }
.yl-nav-btn.is-disabled { color: var(--yl-text-3); pointer-events: none; }
.yl-read-tip { text-align: center; font-size: 12px; color: var(--yl-text-3); margin: 10px 0 0; }
body.yl-night { background: #20252b; }
body.yl-night .yl-header, body.yl-night .yl-read, body.yl-night .yl-sec, body.yl-night .yl-cat { background: #262d34; border-color: #333c44; }
body.yl-night .yl-read-content, body.yl-night a, body.yl-night .yl-read-hd h1 { color: #b9c5cf; }
body.yl-night .yl-nav { background: #1b5c96; }
body.yl-night .yl-sec-hd, body.yl-night .yl-cat-hd { background: #2b333b; border-color: #333c44; }

/* ---------- 页脚 ---------- */
.yl-footer { background: #fff; border-top: 2px solid var(--yl-blue); margin-top: 14px; }
.yl-foot-in { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 20px; padding: 18px 0; font-size: 12.5px; color: var(--yl-text-3); }
.yl-foot-title { font-size: 13.5px; color: var(--yl-text); font-weight: 700; margin: 0 0 6px; }
.yl-foot-col p { margin: 0 0 4px; line-height: 1.9; }
.yl-sitemap-links, .yl-links { display: flex; flex-wrap: wrap; gap: 2px 12px; }
.yl-sitemap-links a, .yl-links a { color: var(--yl-text-2); }
.yl-copy { border-top: 1px solid var(--yl-line); padding: 10px 0; text-align: center; font-size: 12.5px; color: var(--yl-text-3); }

/* ---------- 自适应 ---------- */
@media (max-width: 1100px) {
    .yl-two-col { grid-template-columns: minmax(0, 1fr); }
    .yl-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .yl-catalog { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .yl-rel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .yl-head-in { height: auto; padding: 10px 0; flex-wrap: wrap; gap: 8px; }
    .yl-search { order: 3; flex: 1 1 100%; max-width: none; margin: 0; }
    .yl-quick { font-size: 12.5px; gap: 14px; }
    .yl-nav .yl-wrap { height: auto; padding: 4px 0; }
    .yl-nav a { padding: 0 12px; line-height: 36px; font-size: 14px; }
    .yl-grid-commend { grid-template-columns: 1fr; }
    .yl-cat-grid { grid-template-columns: 1fr; }
    .yl-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .yl-rel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .yl-book { flex-direction: column; }
    .yl-book-cover { width: 120px; height: 160px; }
    .yl-book-h1 { font-size: 19px; }
    .yl-foot-in { grid-template-columns: 1fr; gap: 12px; }
    .yl-upd-hd { display: none; }
    .yl-upd-row { grid-template-columns: 52px minmax(0, 1fr) 60px; }
    .yl-upd-row .ch, .yl-upd-row .a { display: none; }
    .yl-read { padding: 14px 12px; }
    .yl-read-content { font-size: 17px; }
}
@media (max-width: 640px) {
    .yl-logo-t { font-size: 20px; }
    .yl-catalog { grid-template-columns: 1fr; }
    .yl-rel-grid { grid-template-columns: 1fr; }
    .yl-card-commend .yl-book-intro { display: none; }
    .yl-read-content { font-size: 16.5px; }
}

/* ============================================================
   演示图实测配色覆盖（demo_home.png 像素采样）
   底 #CCE0EA / 盒 #E6F0F5 / 标题条 #CFE2EB / 蓝条 #3D89AF
   深蓝 #126E9D / 边框 #94BED2 / 分隔 #66A2C0 / 浅行 #DAE9F1
   ============================================================ */
body.yl-body { background: #cce0ea; color: #2f4f5f; }
a { color: #2f4f5f; }
.y1-wrap, .yl-wrap { }
.yl-header, .yl-sec, .yl-cat, .yl-book, .yl-read, .yl-footer,
.yl-filter, .yl-card-commend, .yl-list-item, .yl-rel, .yl-cat-top { background: #e6f0f5; border-color: #94bed2; }
.yl-header { border-bottom-color: #3d89af; }
.yl-footer { border-top-color: #3d89af; }
.yl-sec-hd, .yl-cat-hd { background: #cfe2eb; border-bottom-color: #94bed2; }
.yl-sec-hd h1, .yl-sec-hd h2, .yl-cat-hd h2,
.yl-book-title a, .yl-book-h1, .yl-read-hd h1 { color: #126e9d; }
.yl-more, .yl-book-meta a, .yl-upd-row .c, .yl-lastch a, .yl-crumb a, .yl-meta-list a,
.yl-nav-btn, .yl-filter a.on { color: #2b6f92; }
.yl-nav { background: #3d89af; }
.yl-nav a { color: #fff; }
.yl-nav a:hover, .yl-nav a.on { background: #126e9d; color: #fff; }
.yl-search input { border-color: #3d89af; background: #fff; color: #2f4f5f; }
.yl-search button { border-color: #3d89af; background: #3d89af; color: #fff; }
.yl-search button:hover { background: #126e9d; }
.yl-logo-t { color: #126e9d; }
.yl-upd-hd { background: #dae9f1; border-bottom-color: #94bed2; }
.yl-upd-row { border-bottom-color: #bcd6e2; }
.yl-cat-list li, .yl-newlist li { border-bottom-color: #bcd6e2; }
.yl-cat-list li::before { background: #66a2c0; }
.yl-cat-list li:nth-child(1)::before { background: #d9534f; }
.yl-cat-list li:nth-child(2)::before { background: #e8823c; }
.yl-cat-list li:nth-child(3)::before { background: #d9a52a; }
.yl-newlist li::before { background: #66a2c0; }
.yl-cover, .yl-cover-sm, .yl-book-cover { background: #cfe2eb; }
.yl-lastch, .yl-intro, .yl-sec-hd, .yl-cat-hd { background-color: #cfe2eb; }
.yl-intro { background: #e6f0f5; }
.yl-btn { background: #dae9f1; border-color: #94bed2; color: #2f4f5f; }
.yl-btn-main, .yl-nav-next { background: #3d89af; border-color: #3d89af; color: #fff; }
.yl-btn-main:hover, .yl-nav-next:hover { background: #126e9d; color: #fff; }
.yl-btn-ghost { background: #dae9f1; border-color: #94bed2; color: #2b6f92; }
.yl-read-tools button { background: #dae9f1; border-color: #94bed2; color: #2f4f5f; }
.yl-read-content { color: #24485c; }
.yl-pager a, .yl-pager span { background: #dae9f1; border-color: #94bed2; }
.yl-pager strong { background: #3d89af; border-color: #3d89af; color: #fff; }
.yl-filter a { background: #dae9f1; border-color: #94bed2; color: #2f4f5f; }
.yl-copy { border-top-color: #94bed2; }
.yl-foot-title { color: #126e9d; }

/* ===== 详情页：演示图结构（书籍卡 / 4列章节格 / Tips）===== */
.yl-bookcard { display: flex; gap: 16px; padding: 14px; }
.yl-bookcard .yl-book-cover { width: 148px; height: 198px; flex: 0 0 auto; border: 1px solid #94bed2; }
.yl-book-author { font-size: 14px; font-weight: 400; color: #2b6f92; }
.yl-line { font-size: 13px; color: #3d6072; margin: 0 0 5px; }
.yl-last-a { color: #d9534f; }
.yl-intro-box { background: #dae9f1; border: 1px solid #bcd6e2; padding: 8px 10px; margin: 8px 0 10px; font-size: 13px; line-height: 1.8; color: #33566a; max-height: 92px; overflow: auto; }
.yl-intro-box p { margin: 0; }
.yl-chap-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 6px 10px 10px; }
.yl-chap { display: block; padding: 6px 8px; border: 1px solid #bcd6e2; background: #dae9f1; margin: -1px 0 0 -1px; font-size: 13px; color: #2f4f5f; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-chap:hover { background: #cfe2eb; color: #126e9d; }
.yl-chap-vol { grid-column: 1 / -1; padding: 6px 8px; background: #cfe2eb; border: 1px solid #94bed2; font-weight: 700; color: #126e9d; font-size: 13px; }
.yl-tips { background: #dae9f1; border: 1px solid #94bed2; padding: 12px 14px; font-size: 13px; line-height: 1.9; color: #33566a; margin-bottom: 12px; }
.yl-tips p { margin: 0 0 6px; }
.yl-tips a { color: #2b6f92; }
@media (max-width: 900px) { .yl-chap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .yl-bookcard { flex-direction: column; } }
@media (max-width: 640px) { .yl-chap-grid { grid-template-columns: 1fr; } }

/* ===== 分类卡片：8 个分类 一行 4 个（紧凑版）===== */
.yl-cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.yl-cat-top { padding: 8px 10px; gap: 8px; }
.yl-cat-top .yl-cover { width: 62px; height: 83px; }
.yl-cat-top .yl-book-title { font-size: 13.5px; }
.yl-cat-top .yl-book-intro { font-size: 12px; -webkit-line-clamp: 2; }
.yl-cat-list { padding: 4px 10px 8px; }
.yl-cat-list li { height: 27px; font-size: 12.5px; gap: 6px; }
.yl-cat-list li em { display: none; }
.yl-cat-hd { height: 36px; padding: 0 10px; }
.yl-cat-hd h2 { font-size: 14px; }
@media (max-width: 1100px) { .yl-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .yl-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .yl-cat-grid { grid-template-columns: 1fr; } }

/* ===== 分类卡片：每行尺寸统一、上下对齐（空分类也占同样高度）===== */
.yl-cat { display: flex; flex-direction: column; }
.yl-cat-top { height: 96px; overflow: hidden; align-items: flex-start; }
.yl-cat-top .yl-book-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yl-cat-top .yl-book-intro { max-height: 34px; }
.yl-cat-list { flex: 1 1 auto; min-height: 274px; display: flex; flex-direction: column; }
.yl-cat-list li { flex: 0 0 27px; }
/* 空分类占位 */
.yl-cat-list li.yl-cat-empty { justify-content: center; color: #7f99a8; border-bottom: 0; }
.yl-cat-list li.yl-cat-empty::before { display: none; }

/* ===== 右侧人气卡片：与左侧内容等高对齐（拉伸填满，列表均分）===== */
.yl-two-col > aside { display: flex; flex-direction: column; align-self: stretch; }
.yl-two-col > aside > .yl-sec { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.yl-two-col > aside > .yl-sec:last-child { margin-bottom: 0; }
.yl-two-col > aside .yl-newlist { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between; padding: 10px 12px 14px; }
.yl-two-col > aside .yl-newlist li { flex: 0 0 auto; height: 30px; }

/* 人气卡：卡片等高对齐，但列表靠上紧凑（不拉开行距） */
.yl-two-col > aside .yl-newlist { justify-content: flex-start; }
.yl-two-col > aside .yl-newlist li { height: 32px; }

/* ===== 布局修正：人气卡恢复自然高度；分类网格移到全宽、卡片变宽 ===== */
.yl-two-col > aside { display: block; align-self: flex-start; }
.yl-two-col > aside > .yl-sec { display: block; flex: none; min-height: 0; }
.yl-two-col > aside .yl-newlist { display: block; padding: 8px 12px 10px; }
.yl-two-col > aside .yl-newlist li { height: 30px; }
/* 全宽分类网格：4 列，卡片更宽 */
.yl-cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.yl-cat-top { height: 104px; }
.yl-cat-top .yl-cover { width: 72px; height: 96px; }
.yl-cat-top .yl-book-title { font-size: 14.5px; }
.yl-cat-list { min-height: 286px; }
.yl-cat-list li { flex: 0 0 28px; height: 28px; font-size: 13px; }
.yl-cat-list li em { display: block; }
.yl-cat-hd h2 { font-size: 15px; }
@media (max-width: 1100px) { .yl-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .yl-cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .yl-cat-grid { grid-template-columns: 1fr; } }

/* ===== 热门推荐：一行 3 本 × 2 行 = 6 本；与右侧人气榜等高 ===== */
.yl-grid-commend { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; }
.yl-card-commend { padding-bottom: 8px; }
.yl-card-commend .yl-cover { width: 78px; height: 104px; }
.yl-card-commend .yl-book-title { font-size: 14px; }
.yl-card-commend .yl-book-intro { font-size: 12px; }
/* 顶部两栏：两侧卡片拉伸等高 */
.yl-two-col:first-of-type { align-items: stretch; }
.yl-two-col:first-of-type > div { display: flex; flex-direction: column; }
.yl-two-col:first-of-type > div > .yl-sec { flex: 1 1 auto; display: flex; flex-direction: column; }
.yl-two-col:first-of-type > div > .yl-sec .yl-grid-commend { flex: 1 1 auto; align-content: space-between; }
.yl-two-col:first-of-type > aside { display: flex; flex-direction: column; align-self: stretch; }
.yl-two-col:first-of-type > aside > .yl-sec { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.yl-two-col:first-of-type > aside .yl-newlist { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between; }
.yl-two-col:first-of-type > aside .yl-newlist li { height: auto; min-height: 30px; }
@media (max-width: 900px) { .yl-grid-commend { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .yl-grid-commend { grid-template-columns: 1fr; } }

/* 顶部两栏：去掉卡片下边距，两张卡片才能真正等高对齐 */
.yl-two-col:first-of-type { align-items: stretch; }
.yl-two-col:first-of-type > div > .yl-sec,
.yl-two-col:first-of-type > aside > .yl-sec { margin-bottom: 0 !important; height: 100%; }
.yl-two-col:first-of-type { margin-bottom: 12px; }

/* ===== WAP 端（≤900px）：所有列表统一只显示 6 条；热门推荐恢复显示简介 ===== */
@media (max-width: 900px) {
    /* 人气小说榜 6 条 */
    .yl-two-col:first-of-type > aside .yl-newlist li:nth-child(n+7),
    /* 最新入库 6 条 */
    .yl-two-col:nth-of-type(2) aside .yl-newlist li:nth-child(n+7),
    /* 分类卡片列表 6 条 */
    .yl-cat-list li:nth-child(n+7) {
        display: none !important;
    }
    /* 最近更新：表头是第 1 个孩子，所以从第 8 个孩子起隐藏 = 只留 6 行 */
    .yl-sec .yl-upd-row:nth-child(n+8) {
        display: none !important;
    }
    /* 热门推荐卡片：WAP 端也要显示简介 */
    .yl-card-commend .yl-book-intro,
    .yl-cat-top .yl-book-intro {
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    /* 卡片不再强制最低高度，避免 6 条时留大片空白 */
    .yl-cat-list { min-height: 0 !important; }
    .yl-two-col:first-of-type > aside .yl-newlist { justify-content: flex-start; }
    .yl-cat-top { height: auto !important; min-height: 96px; }
}

/* WAP 端：隐藏「最新入库」（只保留最近更新，单栏铺满） */
@media (max-width: 900px) {
    .yl-bottom > aside { display: none !important; }
    .yl-bottom { grid-template-columns: 1fr !important; }
}

/* ===== 底部两栏：最近更新 与 最新入库 等高对齐 ===== */
.yl-bottom { align-items: stretch; }
.yl-bottom > div { display: flex; flex-direction: column; }
.yl-bottom > div > .yl-sec { flex: 1 1 auto; display: flex; flex-direction: column; margin-bottom: 0 !important; height: 100%; }
.yl-bottom > aside { display: flex; flex-direction: column; align-self: stretch; }
.yl-bottom > aside > .yl-sec { flex: 1 1 auto; display: flex; flex-direction: column; margin-bottom: 0 !important; height: 100%; min-height: 0; }
.yl-bottom > aside .yl-newlist { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-between; padding: 10px 12px 14px; }
.yl-bottom > aside .yl-newlist li { height: auto; min-height: 30px; }

/* ===== WAP 端布局复位：取消桌面用的等高/拉伸，回到单列自然堆叠 ===== */
@media (max-width: 900px) {
    .yl-two-col, .yl-two-col:first-of-type, .yl-bottom {
        display: block !important;
        grid-template-columns: none !important;
    }
    .yl-two-col > div,
    .yl-two-col:first-of-type > div,
    .yl-two-col:first-of-type > aside,
    .yl-bottom > div {
        display: block !important;
        height: auto !important;
        align-self: auto !important;
    }
    .yl-two-col > div > .yl-sec,
    .yl-two-col:first-of-type > div > .yl-sec,
    .yl-two-col:first-of-type > aside > .yl-sec,
    .yl-bottom > div > .yl-sec {
        display: block !important;
        height: auto !important;
        flex: none !important;
        min-height: 0 !important;
        margin-bottom: 12px !important;
    }
    .yl-two-col:first-of-type > aside .yl-newlist,
    .yl-bottom > aside .yl-newlist {
        display: block !important;
        justify-content: flex-start !important;
    }
    /* 最新入库在 WAP 隐藏（保持上一条要求） */
    .yl-bottom > aside { display: none !important; }
    /* 分类网格单列铺满 */
    .yl-cat-grid { display: grid !important; }
}

/* WAP 端：彻底复位所有容器高度，消除页脚上方大片空白 */
@media (max-width: 900px) {
    html, body.yl-body { height: auto !important; }
    .yl-main, .yl-main > .yl-wrap, .yl-main .yl-wrap {
        height: auto !important; min-height: 0 !important;
        display: block !important; padding-bottom: 10px !important;
    }
    .yl-two-col, .yl-bottom, .yl-sec, .yl-cat, .yl-cat-grid, .yl-cat-list, .yl-cat-top, .yl-newlist {
        height: auto !important; min-height: 0 !important; max-height: none !important;
    }
    .yl-two-col > *, .yl-bottom > *, .yl-sec > * { height: auto !important; }
    .yl-cat-list { display: block !important; }
    .yl-cat-list li { flex: none !important; }
}

/* WAP 端顶部微调：logo 右移 5px，右侧链接左移 5px */
@media (max-width: 900px) {
    .yl-head-in .yl-logo { margin-left: 5px; }
    .yl-head-in .yl-quick { margin-right: 5px; }
}

/* WAP 端：搜索框左右各内缩 5px */
@media (max-width: 900px) {
    .yl-head-in .yl-search {
        margin-left: 5px !important;
        margin-right: 5px !important;
    }
}

/* WAP 端：隐藏「人气小说榜」（它单列堆叠时显示在热门推荐下方） */
@media (max-width: 900px) {
    .yl-two-col:first-of-type > aside { display: none !important; }
}

/* 【撤销】WAP 端重新显示「人气小说榜」（覆盖之前的隐藏规则） */
@media (max-width: 900px) {
    .yl-two-col:first-of-type > aside {
        display: flex !important;
        flex-direction: column !important;
    }
    .yl-two-col:first-of-type > aside > .yl-sec {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 12px !important;
    }
    .yl-two-col:first-of-type > aside .yl-newlist { display: block !important; }
}

/* 关键修复：1100px 以下两栏会塌成单列，此时必须取消桌面用的等高拉伸，否则严重错位 */
@media (max-width: 1100px) {
    .yl-two-col, .yl-two-col:first-of-type, .yl-bottom {
        display: block !important;
        grid-template-columns: none !important;
    }
    .yl-two-col > div, .yl-two-col > aside,
    .yl-two-col:first-of-type > div, .yl-two-col:first-of-type > aside,
    .yl-bottom > div {
        display: block !important;
        height: auto !important;
        align-self: auto !important;
    }
    .yl-two-col > div > .yl-sec,
    .yl-two-col:first-of-type > div > .yl-sec,
    .yl-two-col:first-of-type > aside > .yl-sec,
    .yl-bottom > div > .yl-sec {
        display: block !important;
        height: auto !important;
        flex: none !important;
        min-height: 0 !important;
        margin-bottom: 12px !important;
    }
    .yl-two-col:first-of-type > aside .yl-newlist,
    .yl-bottom > aside .yl-newlist {
        display: block !important;
        justify-content: flex-start !important;
    }
}

/* ===== 详情页（严格对照 demo_info.png）===== */
.yl-info-top .yl-bookcard { padding: 12px 14px; }
.yl-info-top .yl-book-h1 { font-size: 21px; color: #1f5f8b; }
.yl-book-author { font-weight: 400; font-size: 14px; color: #3d7fa6; }
.yl-info-top .yl-line { font-size: 13px; color: #33566a; margin: 0 0 4px; }
.yl-intro-box { background: #eef5f9; border: 1px solid #cfdfe8; padding: 8px 10px; margin: 8px 0 10px; font-size: 12.5px; line-height: 1.8; color: #33566a; max-height: 84px; overflow: auto; }
/* 人气小说推荐：带彩色圆形序号 */
.yl-hotlist { padding: 6px 10px 8px; }
.yl-hotlist li { display: flex; align-items: center; gap: 8px; height: 34px; border-bottom: 1px dotted #cfdfe8; font-size: 13.5px; counter-increment: ylhot; }
.yl-hotlist { counter-reset: ylhot; }
.yl-hotlist li:last-child { border-bottom: 0; }
.yl-hotlist li::before { content: counter(ylhot); flex: 0 0 auto; width: 18px; height: 18px; line-height: 18px; text-align: center; font-size: 11px; color: #fff; border-radius: 50%; background: #e8823c; }
.yl-hotlist li:nth-child(1)::before { background: #e0574f; }
.yl-hotlist li:nth-child(2)::before { background: #e8823c; }
.yl-hotlist li:nth-child(3)::before { background: #d9a52a; }
.yl-hotlist li:nth-child(n+4)::before { background: #5b93b8; }
.yl-hotlist li a { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yl-hotlist li em { flex: 0 0 auto; color: #7f99a8; font-size: 12px; }
/* 章节标题居中、无左侧色条 */
.yl-center-hd { justify-content: center; background: #cfe2eb; }
.yl-center-hd h2 { color: #1f5f8b; font-size: 15.5px; }
.yl-center-hd h2::before { display: none; }
/* 章节格子：四列白/淡蓝格 */
.yl-chap-grid { padding: 8px 10px 12px; }
.yl-chap { background: #f4f9fb; border: 1px solid #cfdfe8; color: #2f4f5f; font-size: 12.5px; padding: 7px 8px; }
.yl-chap:hover { background: #e3eff5; color: #126e9d; }
/* 详情页右侧卡片自然高度 */
.yl-info-top > aside { display: block !important; align-self: flex-start !important; }
.yl-info-top > aside > .yl-sec { display: block !important; height: auto !important; flex: none !important; }
@media (max-width: 1100px) { .yl-info-top { display: block !important; } }