* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: #f4f4f4; color: #333; font: 14px/1.8 "Microsoft YaHei", "PingFang SC", Arial, sans-serif; }
a { color: #333; text-decoration: none; }
a:hover { color: #c00; text-decoration: underline; }
img { display: block; max-width: 100%; }
.info9, .contcell8, .chahd, .dateimg, .secwrap { max-width: 980px; margin: 0 auto; }

.volwrap4 { height: 30px; background: #f7f7f7; border-bottom: 1px solid #ddd; color: #777; font-size: 12px; }
.contcell8 { display: flex; gap: 24px; align-items: center; height: 30px; }
.bookinfo { border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; padding: 0; }
.bookinfo:hover { color: #0871bd; text-decoration: underline; }
.metas { background: #2f8ed8; }
.chahd { height: 76px; display: flex; align-items: center; gap: 28px; }
.vol { width: 170px; font-size: 34px; line-height: 1; font-weight: 700; }
.vol a { color: #fff; letter-spacing: 0; }
.vol a:hover { color: inherit; text-decoration: none; }
.dateunit { flex: 1; display: flex; max-width: 470px; }
.hdunit { flex: 1; height: 38px; padding: 0 12px; border: 0; outline: 0; font-size: 14px; }
.storytext5 { width: 78px; height: 38px; border: 0; background: #f5a623; color: #fff; font-size: 15px; cursor: pointer; }
.coverline { margin-left: auto; display: flex; gap: 10px; }
.coverline a { color: #fff; padding: 5px 10px; border: 1px solid rgba(255,255,255,.5); border-radius: 2px; }

.dateimg { display: flex; height: 42px; background: #287dc2; overflow: hidden; }
.dateimg a { color: #fff; line-height: 42px; padding: 0 13px; white-space: nowrap; border-right: 1px solid rgba(255,255,255,.12); }
.dateimg a:hover { background: #1d6fb0; text-decoration: none; color: #fff; }
.secwrap { display: none; }
.cellsec3 { padding: 12px 0 20px; }

.unitmeta { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 12px; }
.update7, .sideinfo, .book4, .itemcell8, .infoimg, .row, .linkline { background: #fff; border: 1px solid #ddd; }
.update7 { display: grid; grid-template-columns: 1fr 1fr; padding: 12px; gap: 12px; }
.hdarea { display: flex; min-height: 132px; overflow: hidden; }
.hdarea .bditem8 { width: 88px; flex: 0 0 88px; margin-right: 12px; }
.hdarea .bditem8 img { width: 88px; height: 120px; object-fit: cover; border: 1px solid #ddd; }
.hdarea dt { height: 28px; line-height: 28px; overflow: hidden; font-weight: 700; }
.hdarea dt span { float: right; max-width: 72px; color: #888; font-size: 12px; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hdarea dd { color: #555; height: 88px; overflow: hidden; font-size: 13px; }
.hdarea dd a { color: #555; }
.new, .book4 h2, .infoimg h2, .row h2 { height: 38px; line-height: 38px; padding: 0 12px; border-bottom: 1px solid #ddd; background: #f9f9f9; color: #287dc2; font-size: 16px; }
.shu, .foot2, .bookrow8, .navlist, .hd { list-style: none; }
.shu li, .bookrow8 li, .hd li { display: flex; height: 35px; line-height: 35px; padding: 0 12px; border-bottom: 1px dashed #e5e5e5; overflow: hidden; }
.boxbar9info, .menubox { width: 86px; color: #888; flex: 0 0 86px; }
.menuimg, .cardinner5 { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.toolft { width: 220px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bd, .wenbar { width: 88px; color: #777; text-align: right; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sideinner { width: 70px; color: #888; text-align: right; }

.catemeta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.descname { display: flex; padding: 12px; border-bottom: 1px dashed #ddd; }
.descname .bditem8 { width: 76px; flex: 0 0 76px; margin-right: 12px; }
.descname .bditem8 img { width: 76px; height: 104px; object-fit: cover; border: 1px solid #ddd; }
.descname dt { font-weight: 700; height: 28px; line-height: 28px; overflow: hidden; }
.descname dd { height: 72px; overflow: hidden; color: #555; font-size: 13px; }
.descname dd a { color: #555; }
.foot2 { padding: 7px 12px; columns: 2; }
.foot2 li { height: 28px; line-height: 28px; overflow: hidden; break-inside: avoid; }

.itemcell8 { display: flex; padding: 18px; margin-bottom: 12px; }
.itemcell8 .wenrow3 { width: 150px; flex: 0 0 150px; margin-right: 22px; }
.itemcell8 .wenrow3 img { width: 150px; height: 200px; object-fit: cover; border: 1px solid #ccc; padding: 2px; background: #fff; }
.cont7 h1 { height: 44px; line-height: 44px; font-size: 28px; font-weight: 500; border-bottom: 1px dashed #ddd; margin-bottom: 8px; }
.cont7 p { height: 30px; line-height: 30px; color: #555; }
.shuline { margin-top: 18px; display: flex; gap: 12px; }
.listbox { display: inline-block; min-width: 110px; height: 36px; line-height: 36px; text-align: center; background: #287dc2; color: #fff; border-radius: 2px; }
.listbox.siteinner { background: #f5a623; }
.listbox:hover { color: #fff; text-decoration: none; opacity: .9; }
.infoimg { margin-bottom: 12px; }
.infoimg p { padding: 14px 16px; color: #555; text-indent: 2em; }
.navlist { display: grid; grid-template-columns: repeat(3, 1fr); padding: 10px 12px; }
.navlist li { height: 34px; line-height: 34px; border-bottom: 1px dashed #e5e5e5; overflow: hidden; padding-right: 18px; white-space: nowrap; text-overflow: ellipsis; }
.linkline h1 { height: 42px; line-height: 42px; padding: 0 12px; font-size: 18px; color: #287dc2; border-bottom: 1px solid #ddd; background: #f9f9f9; }

.secwrapcon { background: #f6f1e7; border: 1px solid #d8cfbd; padding: 0 24px 26px; }
.sidearea7 { height: 38px; line-height: 38px; color: #777; border-bottom: 1px solid #e4dccd; font-size: 13px; }
.navitem { text-align: center; padding: 20px 0 10px; border-bottom: 1px dashed #d8cfbd; }
.navitem h1 { font-size: 26px; font-weight: 500; color: #222; }
.navitem p { color: #777; margin-top: 6px; }
.story5 { padding: 20px 8px; color: #222; font: 20px/2 "Microsoft YaHei", "PingFang SC", serif; }
.hdcol { display: none; margin: 0 0 16px; padding: 2px 0 10px; border-bottom: 1px dashed #d8cfbd; color: #222; font-size: 22px; font-weight: 700; line-height: 1.45; text-align: center; text-indent: 0; }
.story5 p { text-indent: 2em; margin-bottom: 14px; text-align: justify; }
.maincell { display: flex; justify-content: center; gap: 12px; padding: 18px 0 0; border-top: 1px dashed #d8cfbd; }
.maincell.site { padding: 14px 0; border-top: 0; border-bottom: 1px dashed #d8cfbd; }
.secwrapcon .maincell.coverarea { margin-bottom: 18px; }
.maincell a, .maincell span { min-width: 110px; height: 34px; line-height: 34px; text-align: center; background: #fff; border: 1px solid #d8cfbd; color: #555; }
.maincell a:hover { background: #287dc2; color: #fff; text-decoration: none; border-color: #287dc2; }

.picmeta { background: #fff; border: 1px solid #ddd; padding: 20px; }
.titlesec7 { border-top: 1px solid #ddd; background: #f7f7f7; color: #888; text-align: center; padding: 20px 0; font-size: 12px; }

@media (max-width: 768px) {
    .info9, .contcell8, .chahd, .dateimg, .secwrap { width: 100%; max-width: none; }
    .volwrap4 { display: none; }
    .metas { padding: 10px; }
    .chahd { height: auto; display: block; }
    .vol { width: auto; margin-bottom: 10px; font-size: 28px; text-align: center; }
    .dateunit { max-width: none; }
    .coverline { display: none; }
    .dateimg { display: none; }
    .secwrap { display: flex; overflow-x: auto; background: #287dc2; }
    .secwrap a { color: #fff; line-height: 38px; padding: 0 14px; white-space: nowrap; }
    .cellsec3 { padding: 8px; }
    .unitmeta, .catemeta { display: block; }
    .update7 { grid-template-columns: 1fr; margin-bottom: 10px; }
    .sideinfo, .book4 { margin-bottom: 10px; }
    .boxbar9info, .toolft, .bd, .menubox, .wenbar, .sideinner { display: none; }
    .foot2 { columns: 1; }
    .itemcell8 { display: block; text-align: center; }
    .itemcell8 .wenrow3 { margin: 0 auto 12px; }
    .cont7 h1 { height: auto; line-height: 1.4; font-size: 24px; }
    .shuline { justify-content: center; }
    .navlist { grid-template-columns: 1fr; }
    .secwrapcon { padding: 0 12px 18px; }
    .navitem h1 { font-size: 22px; }
    .story5 { font-size: 18px; line-height: 1.95; padding: 14px 0; }
    .hdcol { display: block; font-size: 18px; margin-bottom: 12px; padding-bottom: 8px; line-height: 1.45; }
    .maincell { gap: 8px; }
    .maincell a, .maincell span { min-width: 0; flex: 1; }
}

.rank9 { background: #fff; border: 1px solid #ddd; padding: 14px; }
.rank9 h1 { height: 38px; line-height: 38px; font-size: 18px; color: #287dc2; border-bottom: 1px solid #ddd; margin-bottom: 14px; }
.blockhd { display: flex; max-width: 560px; margin-bottom: 12px; }
.blockhd input { flex: 1; height: 36px; padding: 0 10px; border: 1px solid #ccc; border-right: 0; outline: 0; }
.blockhd button { width: 76px; border: 0; background: #287dc2; color: #fff; cursor: pointer; }
.titlehd { color: #777; padding: 8px 0 12px; }
.bditem3 { list-style: none; }
.bditem3 li { display: flex; padding: 12px 0; border-top: 1px dashed #e5e5e5; }
.bditem3 li[hidden] { display: none !important; }
.bditem3 li.tagbar { display: block; color: #888; }
.nameinfo { width: 72px; flex: 0 0 72px; margin-right: 12px; }
.nameinfo img { width: 72px; height: 96px; object-fit: cover; border: 1px solid #ddd; }
.cellgrid h2 { font-size: 16px; height: 28px; line-height: 28px; overflow: hidden; }
.cellgrid .volgrid { color: #888; font-size: 13px; margin-bottom: 4px; }
.cellgrid .unitarea { color: #555; height: 48px; overflow: hidden; line-height: 1.7; }
@media (max-width: 768px) {
    .rank9 { padding: 10px; }
    .blockhd { max-width: none; }
}

/* Screenshot-style desktop home layout */
body { background: #e6f8fb; color: #555; font-size: 14px; }
a { color: #4d6da8; }
.info9, .contcell8, .chahd, .dateimg, .secwrap { max-width: 1160px; }
.volwrap4 { background: #d9eef3; border-bottom: 1px solid #b8dce7; }
.contcell8 { color: #6d8f9e; }
.metas { background: #e6f8fb; }
.chahd { height: 82px; gap: 24px; }
.vol { width: 150px; font-size: 36px; font-family: Georgia, "Microsoft YaHei", serif; text-shadow: 2px 2px 0 #c3e3f1; }
.vol a { color: #0871bd; }
.dateunit { max-width: 480px; margin-left: auto; }
.hdunit { height: 36px; border: 1px solid #9bc7df; background: #fff; }
.storytext5 { height: 36px; background: #ddd; color: #222; }
.coverline { display: none; }
.dateimg { height: 44px; background: #79c2e3; padding: 0 10px; }
.dateimg a { line-height: 44px; padding: 0 11px; border-right: 0; color: #fff; font-weight: 700; }
.dateimg a:hover { background: #5eb1d8; }
.cellsec3 { padding: 12px 0 24px; }

.rank { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 22px; padding: 14px; margin-bottom: 22px; border: 3px solid #b9dff1; background: #fffdf6; }
.wen3 { display: grid; grid-template-columns: 126px 1fr; gap: 12px; min-height: 176px; }
.cellft img { width: 126px; height: 170px; object-fit: cover; border: 1px solid #abc6d4; padding: 3px; background: #fff; }
.barlink h2 { height: 28px; line-height: 28px; font-size: 15px; border-bottom: 1px dotted #c7d8e3; overflow: hidden; }
.barlink h2 a { color: #5b6fad; font-weight: 700; }
.barlink h2 span { float: right; color: #aaa; font-weight: 400; }
.barlink p { padding-top: 8px; color: #555; line-height: 1.85; height: 132px; overflow: hidden; text-indent: 2em; }
.metacon { display: grid; grid-template-columns: 1fr 335px; gap: 14px; align-items: start; }
.link, .textinfo { border: 3px solid #86c9e8; background: #eef6f6; }
.link h2, .textinfo h2 { height: 36px; line-height: 36px; padding: 0 12px; background: #9bd3e9; color: #456; font-size: 16px; }
.itemcon, .mainname { list-style: none; padding: 8px 12px; }
.itemcon li { display: grid; grid-template-columns: 95px 190px 1fr 90px 50px; gap: 8px; height: 32px; line-height: 32px; border-bottom: 1px solid #d8e2e4; overflow: hidden; }
.itemcon .head { color: #555; }
.itemcon .celllink7, .itemcon .rankmeta, .itemcon .wen { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.itemcon .wen, .itemcon .navunit3 { color: #aaa; text-align: right; }
.mainname li { display: grid; grid-template-columns: 78px 1fr 58px; gap: 6px; height: 31px; line-height: 31px; border-bottom: 1px solid #d8e2e4; overflow: hidden; }
.mainname span { color: #555; }
.mainname a { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mainname em { color: #666; font-style: normal; text-align: right; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.infounit8 { display: grid; grid-template-columns: 190px 1fr 190px; gap: 18px; padding: 14px 12px; }
.infounit8 a, .infounit8 select { height: 40px; border: 0; background: #4eadd0; color: #fff; text-align: center; border-radius: 3px; font-weight: 700; }
.infounit8 a { line-height: 40px; }
.infounit8 select { background: #fff; color: #222; border: 1px solid #d8e2e4; padding: 0 12px; }
.titlesec7 { background: #e6f8fb; border-top: 2px solid #72c4e8; color: #555; }

/* Desktop vs mobile are intentionally different. */
@media (max-width: 768px) {
    body { background: #e6f8fb; font-size: 14px; }
    .info9, .contcell8, .chahd, .dateimg, .secwrap { width: 100%; max-width: none; }
    .volwrap4 { display: none; }
    .metas { padding: 10px; background: #dff5fb; }
    .chahd { display: block; height: auto; }
    .vol { width: auto; font-size: 30px; text-align: left; margin: 0 0 10px; padding-right: 58px; }
    .dateunit { max-width: none; display: flex; margin-left: 0; }
    .hdunit { height: 38px; font-size: 14px; }
    .storytext5 { width: 72px; height: 38px; }
    .dateimg { display: none; }
    .secwrap { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); overflow: hidden; height: 40px; background: #79c2e3; padding: 0; }
    .secwrap a { min-width: 0; color: #fff; line-height: 40px; padding: 0 2px; text-align: center; font-weight: 700; white-space: nowrap; }
    .chahd .secwrap { margin-bottom: 8px; }
    .cellsec3 { padding: 8px; }
    .rank { display: block; padding: 8px; margin-bottom: 10px; border-width: 2px; }
    .wen3 { display: grid; grid-template-columns: 82px 1fr; gap: 10px; min-height: 116px; padding: 8px 0; border-bottom: 1px solid #d8e2e4; }
    .wen3:last-child { border-bottom: 0; }
    .cellft img { width: 82px; height: 110px; padding: 2px; }
    .barlink h2 { height: 24px; line-height: 24px; font-size: 15px; }
    .barlink h2 span { display: none; }
    .barlink p { height: 78px; line-height: 1.7; padding-top: 5px; text-indent: 0; }
    .metacon { display: block; }
    .imgmod4 { display: flex; flex-direction: column; }
    .imgmod4 .textinfo { order: 1; }
    .imgmod4 .link { order: 2; }
    .link, .textinfo { border-width: 2px; margin-bottom: 10px; }
    .link h2, .textinfo h2 { height: 34px; line-height: 34px; font-size: 15px; }
    .itemcon, .mainname { padding: 4px 8px; }
    .itemcon li { display: grid; grid-template-columns: 72px minmax(0, 1fr) minmax(0, 1fr); gap: 6px; height: 34px; min-height: 34px; line-height: 34px; padding: 0; }
    .itemcon .wen, .itemcon .navunit3 { display: none; }
    .itemcon .head { display: block; width: auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #555; }
    .itemcon .celllink7 { font-weight: 700; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .itemcon .rankmeta { color: #777; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .mainname li { grid-template-columns: minmax(0, 1fr) 88px; height: 34px; line-height: 34px; }
    .mainname span { display: none; }
    .infounit8 { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px 8px; }
    .infounit8 select { grid-column: 1 / -1; order: -1; }
    .titlesec7 { padding: 14px 8px; line-height: 1.7; }
}

.storyhd7 { border: 3px solid #b9dff1; background: #fffdf6; }
.storyhd7 h1 { height: 38px; line-height: 38px; padding: 0 12px; background: #dcecef; color: #444; font-size: 15px; }
.bar { overflow-x: auto; }
.hdmain2 { width: 100%; border-collapse: collapse; table-layout: fixed; }
.hdmain2 th, .hdmain2 td { height: 45px; padding: 0 12px; border-bottom: 1px solid #ddd7ca; text-align: left; color: #4d6da8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hdmain2 th { color: #444; background: #fffaf0; font-weight: 700; }
.hdmain2 th:nth-child(1), .hdmain2 td:nth-child(1) { width: 58px; }
.hdmain2 th:nth-child(2), .hdmain2 td:nth-child(2) { width: 220px; }
.hdmain2 th:nth-child(4), .hdmain2 td:nth-child(4) { width: 140px; }
.hdmain2 th:nth-child(5), .hdmain2 td:nth-child(5) { width: 110px; }
.hdmain2 th:nth-child(6), .hdmain2 td:nth-child(6) { width: 80px; color: red; }
.hdmain2 .tagbar { text-align: center; color: #888; }
.book3 { border: 0; background: transparent; color: red; cursor: pointer; }
@media (max-width: 768px) {
    .storyhd7 { border-width: 2px; }
    .storyhd7 h1 { height: auto; line-height: 1.5; padding: 8px; font-size: 14px; }
    .bar { overflow-x: hidden; }
    .hdmain2 { min-width: 0; table-layout: fixed; }
    .hdmain2 th, .hdmain2 td { height: 40px; padding: 0 8px; }
    .hdmain2 th:nth-child(1),
    .hdmain2 td:nth-child(1),
    .hdmain2 th:nth-child(4),
    .hdmain2 td:nth-child(4),
    .hdmain2 th:nth-child(5),
    .hdmain2 td:nth-child(5) { display: none; }
    .hdmain2 th:nth-child(2),
    .hdmain2 td:nth-child(2) { width: 34%; }
    .hdmain2 th:nth-child(3),
    .hdmain2 td:nth-child(3) { width: 49%; }
    .hdmain2 th:nth-child(6),
    .hdmain2 td:nth-child(6) { width: 17%; text-align: center; }
}

/* Desktop home v2: hero + classic sidebar + 3x2 category matrix */
.bdwrap { display: grid; grid-template-columns: 1fr 340px; gap: 0; border: 3px solid #b9dff1; background: #fffdf6; margin-bottom: 16px; }
.numcon3 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 22px; padding: 12px; }
.updategrid { display: grid; grid-template-columns: 142px 1fr; gap: 14px; min-height: 178px; }
.coverrow4 img { width: 142px; height: 170px; object-fit: cover; border: 1px solid #abc6d4; padding: 3px; background: #fff; }
.toolmain8 h2 { height: 30px; line-height: 30px; font-size: 15px; border-bottom: 1px dotted #c7d8e3; overflow: hidden; }
.toolmain8 h2 a { color: #5b6fad; font-weight: 700; }
.toolmain8 h2 span { float: right; max-width: 78px; color: #aaa; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.toolmain8 p { padding-top: 8px; color: #555; line-height: 1.85; height: 132px; overflow: hidden; text-indent: 2em; }
.cardpanel { border-left: 3px solid #b9dff1; background: #eef6f6; }
.cardpanel h2 { height: 39px; line-height: 39px; padding: 0 12px; background: #dcecef; color: #444; font-size: 16px; }
.cardpanel ul { list-style: none; padding: 7px 12px; }
.cardpanel li { display: grid; grid-template-columns: 78px 1fr 58px; gap: 6px; height: 31px; line-height: 31px; border-bottom: 1px solid #d8e2e4; overflow: hidden; }
.cardpanel span { color: #555; }
.cardpanel a { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cardpanel em { font-style: normal; color: #666; text-align: right; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pic3 { display: grid; grid-template-columns: repeat(3, 1fr); border: 3px solid #86c9e8; background: #fffdf6; }
.bookhd { min-height: 318px; padding: 0 12px 9px; border-right: 1px dotted #9fc9db; border-bottom: 1px solid #b9dff1; overflow: hidden; }
.bookhd:nth-child(3n) { border-right: 0; }
.bookhd h2 { height: 34px; line-height: 34px; color: #444; font-size: 16px; border-bottom: 1px solid #c7d8e3; }
.metacover { display: grid; grid-template-columns: 82px 1fr; gap: 12px; padding: 12px 0 8px; }
.itemline img { width: 82px; height: 104px; object-fit: cover; border: 1px solid #abc6d4; padding: 2px; background: #fff; }
.metacover h3 { height: 24px; line-height: 24px; font-size: 14px; overflow: hidden; }
.metacover h3 a { color: #4d6da8; }
.metacover p { height: 76px; overflow: hidden; line-height: 1.7; color: #555; }
.side { list-style: none; }
.side li { height: 26px; line-height: 26px; border-bottom: 1px solid #d8e2e4; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 768px) {
    .bdwrap { display: block; border-width: 2px; margin-bottom: 10px; }
    .numcon3 { display: block; padding: 8px; }
    .updategrid { grid-template-columns: 82px 1fr; gap: 10px; min-height: 116px; padding: 8px 0; border-bottom: 1px solid #d8e2e4; }
    .updategrid:last-child { border-bottom: 0; }
    .coverrow4 img { width: 82px; height: 110px; padding: 2px; }
    .toolmain8 h2 { height: 24px; line-height: 24px; font-size: 15px; }
    .toolmain8 h2 span { display: block; float: right; max-width: 82px; margin-right: 2px; color: #999; font-size: 13px; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .toolmain8 p { height: 78px; line-height: 1.7; padding-top: 5px; text-indent: 0; }
    .cardpanel { border-left: 0; border-top: 2px solid #b9dff1; }
    .cardpanel ul { padding-right: 12px; }
    .cardpanel li { grid-template-columns: minmax(0, 1fr) 82px; }
    .cardpanel span { display: none; }
    .pic3 { display: block; border-width: 2px; }
    .bookhd { min-height: 0; border-right: 0; padding-bottom: 6px; }
    .bookhd:nth-child(n+4) { display: none; }
    .metacover { grid-template-columns: 72px 1fr; gap: 10px; }
    .itemline img { width: 72px; height: 94px; }
    .side li { height: 30px; line-height: 30px; }
}

.catrow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 18px; padding: 12px; border: 3px solid #b9dff1; background: #fffdf6; }
.home { display: grid; grid-template-columns: 126px 1fr; gap: 14px; min-height: 178px; padding-bottom: 12px; margin-bottom: 12px; overflow: hidden; }
.col5 img { width: 126px; height: 170px; object-fit: cover; border: 1px solid #abc6d4; padding: 3px; background: #fff; }
.homeft h2 { height: 30px; line-height: 30px; font-size: 15px; border-bottom: 1px dotted #c7d8e3; overflow: hidden; }
.homeft h2 a { color: #5b6fad; font-weight: 700; }
.homeft h2 span { float: right; max-width: 82px; color: #aaa; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.homeft p { padding-top: 8px; color: #555; line-height: 1.85; height: 132px; overflow: hidden; text-indent: 2em; }
@media (max-width: 768px) {
    .catrow { display: block; padding: 8px; border-width: 2px; }
    .home { grid-template-columns: 82px 1fr; gap: 10px; min-height: 116px; padding: 8px 0; margin: 0; border-bottom: 1px solid #d8e2e4; }
    .col5 img { width: 82px; height: 110px; padding: 2px; }
    .homeft h2 { height: 24px; line-height: 24px; font-size: 15px; }
    .homeft h2 span { display: none; }
    .homeft p { height: 78px; line-height: 1.7; padding-top: 5px; text-indent: 0; }
}

.tagmeta { position: fixed; right: 18px; bottom: 26px; z-index: 50; display: grid; gap: 8px; }
.tagmeta button { width: 54px; height: 34px; border: 1px solid #5eb1d8; background: #79c2e3; color: #fff; border-radius: 3px; cursor: pointer; font-weight: 700; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.tagmeta button:hover { background: #4eadd0; }
body.datebd { background: #1e1e1e; color: #aaa; }
body.datebd a { color: #9eb8e8; }
body.datebd .volwrap4,
body.datebd .metas,
body.datebd .titlesec7 { background: #252525; border-color: #3a3a3a; color: #888; }
body.datebd .dateimg,
body.datebd .secwrap { background: #333; }
body.datebd .dateimg a:hover,
body.datebd .secwrap a:hover { background: #444; }
body.datebd .rank,
body.datebd .bdwrap,
body.datebd .pic3,
body.datebd .catrow,
body.datebd .storyhd7,
body.datebd .rank9,
body.datebd .itemcell8,
body.datebd .infoimg,
body.datebd .row,
body.datebd .linkline,
body.datebd .link,
body.datebd .textinfo,
body.datebd .cardpanel,
body.datebd .picmeta { background: #2a2a2a; border-color: #444; }
body.datebd .secwrapcon { background: #202020; border-color: #444; }
body.datebd .story5 { color: #b8b8b8; }
body.datebd .new,
body.datebd .book4 h2,
body.datebd .infoimg h2,
body.datebd .row h2,
body.datebd .link h2,
body.datebd .textinfo h2,
body.datebd .cardpanel h2,
body.datebd .storyhd7 h1,
body.datebd .linkline h1,
body.datebd .bookhd h2,
body.datebd .rank9 h1 { background: #333; color: #ccc; border-color: #444; }
body.datebd .barlink p,
body.datebd .toolmain8 p,
body.datebd .metacover p,
body.datebd .homeft p,
body.datebd .infoimg p,
body.datebd .cont7 p,
body.datebd .cellgrid .unitarea { color: #aaa; }
body.datebd .hdmain2 th { background: #333; color: #ccc; }
body.datebd .hdmain2 th,
body.datebd .hdmain2 td,
body.datebd .itemcon li,
body.datebd .mainname li,
body.datebd .cardpanel li,
body.datebd .side li { border-color: #444; }
body.datebd .hdunit,
body.datebd .blockhd input,
body.datebd .infounit8 select { background: #222; color: #ddd; border-color: #555; }
@media (max-width: 768px) {
    .tagmeta { right: 10px; bottom: 14px; }
    .tagmeta button { width: 48px; height: 32px; font-size: 13px; }
}

.cardcol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 22px; padding: 12px; border: 3px solid #b9dff1; background: #fffdf6; margin-bottom: 18px; }
.boxbar9 { display: grid; grid-template-columns: 126px 1fr; gap: 14px; min-height: 176px; overflow: hidden; }
.infoft img { width: 126px; height: 170px; object-fit: cover; border: 1px solid #abc6d4; padding: 3px; background: #fff; }
.sidecell3 h2 { height: 30px; line-height: 30px; font-size: 15px; border-bottom: 1px dotted #c7d8e3; overflow: hidden; }
.sidecell3 h2 a { color: #5b6fad; font-weight: 700; }
.sidecell3 h2 span { float: right; max-width: 78px; color: #aaa; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sidecell3 p { padding-top: 8px; color: #555; line-height: 1.85; height: 132px; overflow: hidden; text-indent: 2em; }
.sec { display: grid; grid-template-columns: 1fr 335px; gap: 14px; align-items: start; }
.itemcell, .metabd { margin-bottom: 18px; }
@media (max-width: 768px) {
    .cardcol { display: block; padding: 8px; border-width: 2px; margin-bottom: 10px; }
    .boxbar9 { grid-template-columns: 82px 1fr; gap: 10px; min-height: 116px; padding: 8px 0; border-bottom: 1px solid #d8e2e4; }
    .boxbar9:last-child { border-bottom: 0; }
    .infoft img { width: 82px; height: 110px; padding: 2px; }
    .sidecell3 h2 { height: 24px; line-height: 24px; font-size: 15px; }
    .sidecell3 h2 span { display: none; }
    .sidecell3 p { height: 78px; line-height: 1.7; padding-top: 5px; text-indent: 0; }
    .sec { display: block; }
}

.imgmod4 { display: grid; grid-template-columns: 1fr 335px; gap: 14px; align-items: start; margin-top: 16px; }
@media (max-width: 768px) {
    .imgmod4 { display: flex; flex-direction: column; width: 100%; max-width: 100%; margin-top: 10px; }
    .imgmod4 .textinfo { order: 1; }
    .imgmod4 .link { order: 2; }
    .imgmod4 .textinfo,
    .imgmod4 .link { width: 100%; max-width: 100%; min-width: 0; }
}

.contimg { border: 3px solid #86c9e8; background: #eef6f6; margin-bottom: 22px; }
.contimg .sidearea7 { height: 34px; line-height: 34px; padding: 0 12px; color: #456; border-bottom: 1px solid #b9dff1; background: #dcecef; }
.tagcover2 { display: grid; grid-template-columns: 160px 1fr; gap: 24px; padding: 14px 28px 18px; }
.homeline {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 160px;
    min-height: 200px;
    box-sizing: border-box;
    background: rgba(0,0,0,.04);
    padding: 12px;
    overflow: hidden;
}
.homeline img {
    display: block;
    width: 100%;
    height: 176px;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
}
.infopanel h1 { font-size: 30px; line-height: 44px; color: #333; }
.descbd { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; border-bottom: 1px dashed #86aebd; padding-bottom: 6px; margin-bottom: 8px; }
.descbd p { height: 28px; line-height: 28px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #444; }
.descbd .metagrid5 { color: #b54800; font-weight: 700; grid-column: 1 / -1; }
.tool3 { grid-column: 2; line-height: 1.8; color: #444; }
.deschd { display: none; }
.listrow { display: none; }
.chablock2 { border: 3px solid #4eadd0; background: #eef6f6; margin-bottom: 30px; }
.chablock2 h2 { height: 38px; line-height: 38px; text-align: center; background: #9fb6bd; color: #333; font-size: 16px; border-bottom: 1px solid #9fc9db; }
.chablock2 .navlist { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0 12px; list-style: none; }
.chablock2 .navlist li { height: 40px; line-height: 40px; border-bottom: 1px dashed #9fb6bd; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-right: 16px; }
.chablock2 .navlist.timename li { font-weight: 700; }
.card { display: grid; grid-template-columns: 250px 1fr 250px; gap: 18px; padding: 16px 12px; }
.card a, .card span, .card button, .card select { height: 40px; line-height: 40px; border: 0; text-align: center; border-radius: 3px; }
.card a, .card span, .card button { background: #1e6f8a; color: #fff; cursor: pointer; font: inherit; }
.card button:disabled { cursor: default; opacity: .65; }
.card select { background: #fff; border: 1px solid #ddd; padding: 0 12px; text-align: left; }
.hotinner { background: #eee; padding: 18px 14px; margin-bottom: 20px; }
.hotinner h2 { text-align: center; color: #777; font-size: 16px; margin-bottom: 14px; font-weight: 400; }
.navline2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 45px; }
.navline2 a { display: block; height: 38px; line-height: 38px; text-align: center; background: #e3e3e3; color: #333; border-radius: 3px; }
@media (max-width: 768px) {
    .contimg, .chablock2 { border-width: 2px; margin-bottom: 12px; }
    .contimg .sidearea7 { height: auto; line-height: 1.5; padding: 8px; }
    .tagcover2 { display: grid; grid-template-columns: 96px 1fr; gap: 10px; padding: 10px; align-items: start; }
    .homeline { width: 96px; min-height: 126px; padding: 4px; background: rgba(255,255,255,.45); }
    .homeline img { width: 100%; height: 118px; object-fit: contain; object-position: center; }
    .infopanel { min-width: 0; }
    .infopanel h1 { font-size: 18px; line-height: 28px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .descbd { display: block; border-bottom: 0; padding-bottom: 0; margin-bottom: 6px; }
    .descbd p { height: 26px; line-height: 26px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .deschd { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; grid-column: 1 / -1; margin: 2px 0 8px; }
    .ranksec { display: block; height: 32px; line-height: 32px; border: 0; border-radius: 4px; color: #fff; text-align: center; font-weight: 700; font-size: 14px; cursor: pointer; }
    .ranksec:hover { color: #fff; text-decoration: none; opacity: .92; }
    .ranksec.cover { background: #f0305a; }
    .ranksec.catecol3 { background: #f1a51e; }
    .ranksec.coverarea { background: #5b8cc3; }
    .tool3 { grid-column: 1 / -1; max-height: 118px; overflow: hidden; line-height: 1.85; color: #444; }
    .tool3.tagmetabar { max-height: none; }
    .listrow { display: block; grid-column: 1 / -1; justify-self: center; margin-top: -2px; border: 0; background: transparent; color: #4d6da8; font-weight: 700; font-size: 14px; cursor: pointer; }
    .chablock2 .navlist { grid-template-columns: 1fr; padding: 0 8px; }
    .chablock2 .navlist li { height: 36px; line-height: 36px; padding-right: 0; }
    .card { grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px 8px; }
    .card select { grid-column: 1 / -1; order: -1; }
    .navline2 { grid-template-columns: 1fr; gap: 8px; }
}

.tagmeta a { width: 54px; height: 34px; line-height: 34px; border: 1px solid #5eb1d8; background: #79c2e3; color: #fff; border-radius: 3px; cursor: pointer; font-weight: 700; box-shadow: 0 2px 8px rgba(0,0,0,.12); text-align: center; }
.tagmeta a:hover { background: #4eadd0; color: #fff; text-decoration: none; }
@media (max-width: 768px) {
    .maincell { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .maincell a, .maincell span { width: 100%; }
    .tagmeta a { width: 48px; height: 32px; line-height: 32px; font-size: 13px; }
}

@media (max-width: 768px) {
    .secwrapcon .maincell { grid-template-columns: 1fr 1fr; }
    .secwrapcon .maincell a:last-child,
    .secwrapcon .maincell span:last-child { grid-column: 1 / -1; }
}

@media (max-width: 768px) {
    html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
    .info9, .cellsec3, .metas, .chahd, .secwrapcon, .contimg, .chablock2 { max-width: 100%; overflow-x: hidden; }
    .dateunit { width: 100%; max-width: 100%; }
    .hdunit { min-width: 0; }
    .storytext5 { flex: 0 0 68px; width: 68px; }
    .secwrap { max-width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
    .secwrapcon { padding-left: 10px; padding-right: 10px; }
    .sidearea7 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .navitem h1 { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
    .navitem p { white-space: normal; overflow-wrap: anywhere; }
    .story5 { max-width: 100%; overflow-wrap: break-word; word-break: break-word; }
    .story5 p { max-width: 100%; overflow-wrap: break-word; word-break: break-word; }
    .tagmeta { right: 8px; }
}

.footgrid { display: none; margin-left: auto; padding: 6px 13px; color: #fff; border: 1px solid rgba(255,255,255,.65); border-radius: 3px; font-weight: 700; white-space: nowrap; }
.footgrid:hover { color: #fff; background: rgba(255,255,255,.16); text-decoration: none; }
@media (max-width: 768px) {
    .chahd { position: relative; }
    .footgrid { display: inline-block; position: absolute; right: 0; top: 0; margin-left: 0; padding: 4px 9px; color: #0871bd; border-color: #79c2e3; background: rgba(255,255,255,.55); font-size: 13px; }
    .footgrid:hover { color: #0871bd; background: rgba(255,255,255,.8); }
}

.pic8 {
    display: grid;
    grid-template-columns: auto 32px 32px 32px auto 48px 48px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    background: #fff;
    border-bottom: 1px dashed #d8cfbd;
}
.pic8.coverarea { border-top: 1px dashed #d8cfbd; border-bottom: 0; margin-top: 8px; }
.pic8 span { color: #287dc2; }
.pic8 label { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.pic8 select { height: 28px; border: 1px solid #83bfe0; background: #fff; }
.pic8 button { height: 28px; border: 1px solid #1e8bd1; background: #fff; color: #006eb8; border-radius: 3px; cursor: pointer; }
.pic8 button.read7 { background: #d8effc; font-weight: 700; }
@media (min-width: 1024px) {
    .secwrapcon { position: relative; }
    .secwrapcon > .sidearea7 { padding-right: 390px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .secwrapcon > .pic8:not(.coverarea) {
        position: absolute;
        top: 5px;
        right: 24px;
        z-index: 2;
        width: auto;
        padding: 0;
        background: transparent;
        border: 0;
    }
    .secwrapcon > .pic8.coverarea { display: none; }
}
.picblock9 { margin: 18px 0; padding: 18px 14px; background: #eee; }
.picblock9 h2 { text-align: center; color: #777; font-size: 16px; font-weight: 400; margin-bottom: 14px; }
.metalist { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 36px; }
.metalist a { display: block; height: 34px; line-height: 34px; text-align: center; background: #e3e3e3; color: #333; border-radius: 3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
body.datebd .picblock9 { background: #2a2a2a; }
body.datebd .metalist a { background: #333; color: #bbb; }
@media (max-width: 768px) {
    .pic8 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; padding: 8px 0; border-bottom: 1px dashed #d8cfbd; }
    .pic8.coverarea { border-top: 1px dashed #d8cfbd; border-bottom: 0; margin-top: 8px; }
    .pic8 button,
    .pic8 a { height: 28px; line-height: 28px; border: 1px solid #d8cfbd; background: #fff; color: #287dc2; border-radius: 2px; text-align: center; font-size: 12px; padding: 0; }
    .pic8 button { cursor: pointer; }
    .pic8 a:hover { text-decoration: none; }
    body.datebd .pic8 button,
    body.datebd .pic8 a { background: #333; border-color: #555; color: #9eb8e8; }
    .picblock9 { margin: 12px 0; padding: 12px 8px; }
    .metalist { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .metalist a { height: 32px; line-height: 32px; font-size: 13px; }
}

@media (max-width: 768px) {
    .secwrapcon .maincell { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
    .secwrapcon .maincell a,
    .secwrapcon .maincell span { border-radius: 0; }
    .secwrapcon .maincell a:last-child,
    .secwrapcon .maincell span:last-child { grid-column: auto; }
}

body.bar7 .secwrapcon { background: #e9fbfb; }
body.navgrid .secwrapcon { background: #f6f1e7; }
body.timewrap .secwrapcon { background: #eeeeee; }
@media (max-width: 768px) {
    .pic8 { grid-template-columns: auto 28px 28px 28px 1fr 42px 42px; align-items: center; gap: 4px; padding: 7px 4px; background: #fff; }
    .pic8 span { color: #287dc2; font-size: 13px; }
    .pic8 label { display: flex; align-items: center; gap: 3px; min-width: 0; font-size: 12px; color: #333; white-space: nowrap; }
    .pic8 select { width: 54px; height: 25px; border: 1px solid #83bfe0; background: #fff; font-size: 12px; }
    .pic8 button { height: 25px; line-height: 23px; border: 1px solid #1e8bd1; background: #fff; color: #006eb8; border-radius: 3px; font-size: 12px; }
    .pic8 button.read7 { background: #d8effc; font-weight: 700; }
    .pic8 a { display: none; }
    body.datebd .pic8 { background: #292929; }
    body.datebd .pic8 span,
    body.datebd .pic8 label { color: #bbb; }
    body.datebd .pic8 select,
    body.datebd .pic8 button { background: #333; border-color: #666; color: #9eb8e8; }
}

body.datebd .vol a { color: #b8d7ef; text-shadow: 1px 1px 0 #1a3c55; }
body.datebd .secwrapcon { background: #242424; }
body.datebd .navitem h1 { color: #ddd; }
body.datebd .navitem p,
body.datebd .sidearea7 { color: #aaa; }
body.datebd .story5 { color: #d2d2d2; }
body.datebd .story5 p { color: #d2d2d2; }
body.datebd.navgrid .secwrapcon,
body.datebd.bar7 .secwrapcon,
body.datebd.timewrap .secwrapcon { background: #242424; }
@media (max-width: 768px) {
    .pic8 { grid-template-columns: auto 28px 28px 28px 1fr 42px; }
    body.datebd .pic8 { background: #2b2b2b; border-color: #555; }
}

:root { --reader-bg-custom: #E9FAFF; }
.secwrapcon { background: var(--reader-bg-custom, #f6f1e7); }
body:not(.datebd) .secwrapcon { background: var(--reader-bg-custom, #E9FAFF); }
body:not(.datebd) .story5 { color: #333; }

@media (max-width: 768px) {
    .pic8 { grid-template-columns: auto 28px 28px 28px 1fr 42px 42px; }
}

@media (max-width: 768px) {
    .secwrapcon > .sidearea7,
    .secwrapcon > .navitem { display: none; }
    .secwrapcon { padding-top: 0; }
}

/* 关灯只作用于章节正文，头部、搜索、工具栏和翻页保持原样。 */
body.datebd { background: #e6f8fb; color: #555; }
body.datebd a { color: #4d6da8; }
body.datebd .volwrap4 { background: #d9eef3; border-color: #b8dce7; color: #6d8f9e; }
body.datebd .metas,
body.datebd .titlesec7 { background: #e6f8fb; border-color: #72c4e8; color: #555; }
body.datebd .dateimg,
body.datebd .secwrap { background: #79c2e3; }
body.datebd .dateimg a,
body.datebd .secwrap a { color: #fff; }
body.datebd .hdunit,
body.datebd .blockhd input,
body.datebd .infounit8 select { background: #fff; color: #333; border-color: #9bc7df; }
body.datebd .secwrapcon,
body.datebd.navgrid .secwrapcon,
body.datebd.bar7 .secwrapcon,
body.datebd.timewrap .secwrapcon { background: #2f3437; border-color: #444; }
body.datebd .navitem h1 { color: #ddd; }
body.datebd .navitem p,
body.datebd .sidearea7 { color: #aaa; }
body.datebd .maincell a,
body.datebd .maincell span { background: #363b3f; border-color: #555; color: #c8c8c8; }
body.datebd .pic8 { background: #2f3437; border-color: #555; }
body.datebd .pic8 span,
body.datebd .pic8 label { color: #c8c8c8; }
body.datebd .pic8 select,
body.datebd .pic8 button { background: #363b3f; border-color: #6b747b; color: #c8d7e8; }
body.datebd .story5 { background: transparent; color: #aaa; }
body.datebd .hdcol { border-color: #555; color: #bbb; }
body.datebd .story5 p { color: #aaa; }
body.datebd .vol a { color: #0871bd; text-shadow: 2px 2px 0 #c3e3f1; }
body.datebd .footgrid { color: #0871bd; border-color: #79c2e3; background: rgba(255,255,255,.55); }
body.datebd .footgrid:hover { color: #0871bd; background: rgba(255,255,255,.8); }
body.datebd .picblock9 { background: #eee; }
body.datebd .picblock9 h2 { color: #777; }
body.datebd .metalist a { background: #e3e3e3; color: #333; }
.infounit { text-align: center; padding: 54px 20px 62px; border: 3px solid #86c9e8; background: #fffdf6; }
.infounit h1 { margin-bottom: 12px; color: #287dc2; font-size: 30px; font-weight: 700; }
.infounit p { margin: 8px 0; color: #555; }
.secpanel4 { display: inline-block; min-width: 110px; height: 34px; margin-top: 12px; line-height: 34px; background: #4eadd0; color: #fff; border-radius: 3px; }
.secpanel4:hover { color: #fff; text-decoration: none; background: #287dc2; }
@media (max-width: 768px) {
    body.datebd .metas { background: #dff5fb; }
    .infounit { padding: 42px 12px 48px; border-width: 2px; }
    .infounit h1 { font-size: 24px; }
}

@media (max-width: 768px) {
    .pic8 {
        align-items: center;
    }
    .pic8 span,
    .pic8 label,
    .pic8 button,
    .pic8 select {
        height: 25px;
        line-height: 25px;
        vertical-align: middle;
    }
    .pic8 span,
    .pic8 label {
        display: flex;
        align-items: center;
    }
    .pic8 button {
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }
    .pic8 select {
        padding: 0 4px;
        line-height: 25px;
    }
}

/* Home update/new panels alignment fix */
.imgmod4 .link,
.imgmod4 .textinfo { align-self: start; }
.imgmod4 .itemcon,
.imgmod4 .mainname { padding: 8px 10px; font-size: 13px; }
.imgmod4 .itemcon li,
.imgmod4 .mainname li { height: 31px; line-height: 31px; border-bottom: 1px solid #d8e2e4; }
.imgmod4 .itemcon li { grid-template-columns: 92px 188px minmax(0, 1fr) 78px 42px; gap: 7px; }
.imgmod4 .mainname li { grid-template-columns: 82px minmax(0, 1fr) 62px; gap: 7px; }
.imgmod4 .itemcon .head,
.imgmod4 .itemcon .celllink7,
.imgmod4 .itemcon .rankmeta,
.imgmod4 .itemcon .wen,
.imgmod4 .itemcon .navunit3,
.imgmod4 .mainname span,
.imgmod4 .mainname a,
.imgmod4 .mainname em { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 768px) {
    .imgmod4 .itemcon,
    .imgmod4 .mainname { padding: 4px 8px; font-size: 14px; }
    .imgmod4 .itemcon li,
    .imgmod4 .mainname li { height: 34px; line-height: 34px; }
    .imgmod4 .itemcon li { grid-template-columns: 72px minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
    .imgmod4 .mainname li { grid-template-columns: minmax(0, 1fr) 88px; gap: 6px; }
}

/* rank-static-layout */
.catrow.col {
    display: block !important;
    border: 2px solid #86c7e7;
    background: #fffdf6;
    padding: 10px 12px;
    margin: 12px auto 0;
    box-sizing: border-box;
}
.catrow.col .sortgrid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 18px;
}
.catrow.col .home {
    float: none !important;
    width: auto !important;
    min-height: 164px;
    margin: 0 !important;
    padding: 0 0 10px;
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    gap: 12px;
    border-bottom: 1px dotted #b9ccd2;
    box-sizing: border-box;
    overflow: hidden;
}
.catrow.col .col5,
.catrow.col .col5 img {
    display: block;
    width: 116px;
    height: 154px;
}
.catrow.col .col5 img {
    object-fit: cover;
    border: 1px solid #b7cbd4;
    background: #f4f4f4;
    box-sizing: border-box;
}
.catrow.col .homeft {
    min-width: 0;
    overflow: hidden;
}
.catrow.col .homeft h2 {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 5px;
    padding: 0 0 4px;
    border-bottom: 1px dotted #b9ccd2;
    font-size: 15px;
    line-height: 22px;
    white-space: nowrap;
}
.catrow.col .homeft h2 a {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.catrow.col .update9 {
    margin-left: auto;
    max-width: 66px;
    color: #aaa;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.catrow.col .wensec {
    margin: 0;
    color: #333;
    font-size: 13px;
    line-height: 24px;
    text-indent: 2em;
    max-height: 120px;
    overflow: hidden;
}
.catrow.col .list {
    grid-column: 1 / -1;
    margin: 0;
    padding: 12px;
    color: #555;
}
@media (max-width: 720px) {
    .catrow.col {
        padding: 8px;
    }
    .catrow.col .sortgrid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .catrow.col .home {
        min-height: 108px;
        grid-template-columns: 78px minmax(0, 1fr);
        gap: 8px;
        padding: 8px 0;
    }
    .catrow.col .col5,
    .catrow.col .col5 img {
        width: 76px;
        height: 100px;
    }
    .catrow.col .homeft h2 {
        font-size: 14px;
        line-height: 20px;
    }
    .catrow.col .wensec {
        font-size: 13px;
        line-height: 20px;
        max-height: 60px;
        text-indent: 0;
    }
}
/* /rank-static-layout */

/* static rank page, bqg style */
.catrow.bdcover4 {
  display: block;
  border: 2px solid #8ed1ef;
  background: #fffdf6;
  padding: 12px;
}
.bdcover4 .tagarea {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  margin: 0 0 10px;
  min-height: 28px;
}
.bdcover4 .tagarea h2 {
  margin: 0;
  font-size: 22px;
  line-height: 28px;
  color: #444;
  font-weight: 700;
}
.bdcover4 .tagarea strong {
  grid-column: 2 / 3;
  text-align: center;
  font-size: 18px;
  line-height: 28px;
  color: #444;
}
.bdcover4 .imgcell {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 16px;
  row-gap: 12px;
}
.bdcover4 .bar2 {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px;
  min-height: 156px;
  overflow: hidden;
}
.bdcover4 .panelmain img {
  width: 110px;
  height: 148px;
  object-fit: cover;
  border: 1px solid #b7d2dd;
  background: #fff;
}
.bdcover4 .shuarea5 {
  min-width: 0;
}
.bdcover4 .bar2 h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  padding-bottom: 2px;
  border-bottom: 1px dotted #9fc7d6;
  font-size: 14px;
  line-height: 22px;
}
.bdcover4 .bar2 h3 a {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bdcover4 .bar2 h3 span,
.bdcover4 .bar2 h3 em {
  color: #999;
  font-weight: 400;
  font-style: normal;
  white-space: nowrap;
}
.bdcover4 .numcol6 {
  margin: 4px 0;
  font-size: 13px;
  line-height: 22px;
  text-align: center;
}
.bdcover4 .numcol6 a {
  display: inline;
}
.bdcover4 .wensec {
  margin: 6px 0 0;
  color: #333;
  font-size: 13px;
  line-height: 23px;
  max-height: 92px;
  overflow: hidden;
}
@media (max-width: 720px) {
  .catrow.bdcover4 {
    padding: 8px;
  }
  .bdcover4 .tagarea {
    display: flex;
    justify-content: space-between;
  }
  .bdcover4 .tagarea h2 {
    font-size: 20px;
  }
  .bdcover4 .tagarea strong {
    font-size: 16px;
  }
  .bdcover4 .imgcell {
    grid-template-columns: 1fr;
    row-gap: 10px;
  }
  .bdcover4 .bar2 {
    grid-template-columns: 86px minmax(0, 1fr);
    min-height: 116px;
  }
  .bdcover4 .panelmain img {
    width: 86px;
    height: 116px;
  }
  .bdcover4 .wensec {
    max-height: 66px;
  }
}

/* static category layout fix */
body { background: #e6f8fb; color: #333; font: 14px/1.8 "Microsoft YaHei", "PingFang SC", Arial, sans-serif; }
a { color: #2d65ad; }
a:hover { color: #c00; text-decoration: underline; }
.info9, .contcell8, .chahd, .itemcon4 { width: 980px; max-width: 980px; margin: 0 auto; }
.metas { background: #e6f8fb; }
.chahd { height: 86px; display: flex; align-items: center; gap: 28px; }
.vol { width: 180px; font-size: 34px; line-height: 1; font-family: Georgia, "Microsoft YaHei", serif; font-weight: 700; }
.vol a { color: #0871bd; text-shadow: 2px 3px 3px rgba(0, 90, 150, .28); }
.vol a:hover { text-decoration: none; color: #0871bd; }
.dateunit { margin-left: auto; flex: 0 0 470px; display: flex; height: 38px; border: 1px solid #9bd5ee; background: #fff; }
.hdunit { flex: 1; height: 36px; padding: 0 12px; border: 0; font-size: 14px; outline: 0; }
.storytext5 { width: 78px; height: 36px; border: 0; background: #ddd; color: #222; cursor: pointer; }
.dateimg { width: 980px; max-width: 980px; height: 42px; margin: 0 auto; background: #74c0df; display: block; overflow: hidden; }
.itemcon4 { display: flex; height: 42px; width: 980px; }
.dateimg a { display: block; color: #fff; font-weight: 700; line-height: 42px; padding: 0 12px; white-space: nowrap; }
.dateimg a:hover, .dateimg a.read7 { background: #57acd2; color: #fff; text-decoration: none; }
.cellsec3 { padding: 12px 0 20px; }

.sortlist { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 18px; border: 3px solid #9bd5ee; background: #fffdf5; padding: 10px; margin-bottom: 12px; }
.sortlist .wrapblock, .gridcover .wrapblock { display: grid; grid-template-columns: 112px 1fr; gap: 12px; min-height: 150px; overflow: hidden; }
.wenrow3 { display: block; width: 112px; }
.wenrow3 img { width: 112px; height: 150px; object-fit: cover; border: 1px solid #b7d3df; background: #fff; }
.namebar { min-width: 0; }
.namebar h3 { height: 26px; line-height: 26px; margin: 0 0 6px; border-bottom: 1px dotted #b9cfd7; font-size: 15px; overflow: hidden; }
.namebar h3 a { font-weight: 700; }
.namebar h3 span { float: right; max-width: 72px; color: #aaa; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.namebar p { margin: 0; text-indent: 2em; height: 108px; overflow: hidden; color: #333; line-height: 1.85; }

.gridcover { display: grid; grid-template-columns: repeat(3, 1fr); border: 3px solid #9bd5ee; background: #fffdf5; margin-bottom: 12px; }
.colinner { min-height: 275px; padding: 8px 12px; border-right: 1px dotted #9bd5ee; border-bottom: 1px solid #ddd; overflow: hidden; }
.colinner:nth-child(3n) { border-right: 0; }
.colinner h2 { margin: 0 0 8px; height: 24px; line-height: 24px; border-bottom: 1px solid #cddbe0; font-size: 16px; color: #333; }
.colinner .wrapblock { grid-template-columns: 86px 1fr; min-height: 116px; margin-bottom: 6px; }
.colinner .wenrow3, .colinner .wenrow3 img { width: 86px; }
.colinner .wenrow3 img { height: 116px; }
.colinner .namebar h3 { font-size: 14px; height: 24px; line-height: 24px; }
.colinner .namebar p { height: 96px; font-size: 13px; line-height: 24px; }
.storywrap2, .pictext4, .bookrow8, .hd { list-style: none; margin: 0; padding: 0; }
.storywrap2 li { display: flex; align-items: center; height: 24px; line-height: 24px; border-top: 1px solid #ddd; overflow: hidden; }
.storywrap2 a { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.storywrap2 span { width: 74px; margin-left: 6px; color: #666; text-align: right; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.catmain { display: grid; grid-template-columns: 1fr 300px; gap: 12px; margin-bottom: 12px; }
.text, .wrappanel, .wenft { border: 3px solid #9bd5ee; background: #eefafa; }
.text h2, .wrappanel h2 { height: 36px; line-height: 36px; padding: 0 12px; background: #9bd5ee; font-size: 16px; color: #333; }
.bookrow8 li, .pictext4 li, .hd li { display: grid; align-items: center; min-height: 30px; line-height: 30px; border-bottom: 1px solid #d1e3e8; overflow: hidden; }
.bookrow8 li { grid-template-columns: 88px minmax(120px,1.15fr) minmax(180px,1.45fr) 90px 50px; column-gap: 8px; padding: 0 10px; }
.pictext4 li { grid-template-columns: 76px minmax(0, 1fr) 76px; column-gap: 0; padding: 0 10px; }
.pictext4 li.picpanel5 { grid-template-columns: 76px minmax(0, 1fr); }
.hd li { grid-template-columns: 90px minmax(220px,1fr) minmax(240px,1.2fr) 120px 78px; column-gap: 8px; padding: 0 12px; }
.bookrow8 a, .pictext4 a, .hd a, .descrow, .wenmeta, .mod, .homebar, .pictext4 em { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.descrow { color: #555; }
.wenmeta, .mod, .homebar, .pictext4 em { color: #777; font-style: normal; text-align: right; }
.wenft { padding-bottom: 8px; }
.wenft h2 { height: 42px; line-height: 42px; padding: 0 12px; background: #fff; border-bottom: 1px solid #ddd; color: #0871bd; font-size: 18px; }
.books { display: grid; grid-template-columns: 160px minmax(160px, 1fr) 160px; gap: 12px; padding: 12px 10px 10px; background: #eefafa; }
.books button, .books select { width: 100%; height: 36px; border-radius: 2px; font: inherit; }
.books button { border: 0; background: #4badd3; color: #fff; cursor: pointer; }
.books button:disabled { opacity: .55; cursor: default; }
.books select { border: 1px solid #b9d7e3; background: #fff; padding: 0 10px; }
.wrapsec { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr); gap: 5px; width: 100%; padding: 10px 6px; box-sizing: border-box; }
.wrapsec button, .wrapsec select { min-width: 0; padding-left: 3px; padding-right: 3px; font-size: 13px; }
.bookinner > [hidden] { display: none !important; }
.page { margin: 0; padding: 28px 20px; background: #fff; border: 1px solid #ddd; }
.page h2 { margin: 0 0 8px; font-size: 22px; color: #555; }
.page p, .volmeta6 { color: #555; }

.bdcover4 { border: 3px solid #9bd5ee; background: #fffdf5; padding: 10px; }
.tagarea { display: grid; grid-template-columns: 1fr 1fr; height: 38px; line-height: 38px; border-bottom: 1px solid #ddd; margin-bottom: 8px; }
.tagarea h2, .tagarea strong { font-size: 20px; color: #333; }
.time { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px 18px; }
.homeinner4 { display: grid; grid-template-columns: 112px 1fr; gap: 12px; min-height: 164px; overflow: hidden; }
.col5 img { width: 112px; height: 150px; object-fit: cover; border: 1px solid #b7d3df; }
.homeft h3 { height: 26px; line-height: 26px; border-bottom: 1px dotted #b9cfd7; font-size: 15px; overflow: hidden; }
.homeft h3 span { float: right; max-width: 72px; color: #aaa; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.homeft h3 em { float: right; margin-left: 6px; color: #999; font-style: normal; font-weight: 400; }
.numcol6 { height: auto !important; color: #555; font-size: 13px; }
.homeft p { padding-top: 0; height: 130px; max-height: 130px; overflow: hidden; line-height: 26px; }

.titlesec7 { border-top: 2px solid #74c0df; padding: 18px 0 24px; text-align: center; color: #444; font-size: 12px; }
.tagmeta { position: fixed; right: 16px; bottom: 16px; z-index: 20; }
.tagmeta button { border: 1px solid #54afd4; background: #74c0df; color: #fff; border-radius: 3px; padding: 8px 10px; cursor: pointer; }

@media (max-width: 1023px) {
  .info9, .contcell8, .chahd, .dateimg, .itemcon4 { width: auto; max-width: none; }
  .volwrap4 { display: block; }
  .contcell8 { padding: 0 10px; justify-content: center; }
  .metas { padding: 10px; }
  .chahd { height: auto; display: block; }
  .vol { width: auto; margin-bottom: 8px; font-size: 28px; }
  .dateunit { width: 100%; max-width: none; margin: 0; flex-basis: auto; }
  .dateimg { margin: 0 10px; height: 38px; overflow-x: auto; }
  .itemcon4 { display: flex; height: 38px; min-width: max-content; }
  .dateimg a { line-height: 38px; padding: 0 12px; }
  .cellsec3 { padding: 8px 10px 16px; }
  .sortlist { display: block; padding: 8px; }
  .sortlist .wrapblock { grid-template-columns: 86px 1fr; min-height: 116px; padding: 8px 0; border-bottom: 1px solid #ddd; }
  .sortlist .wenrow3, .sortlist .wenrow3 img { width: 86px; }
  .sortlist .wenrow3 img { height: 116px; }
  .gridcover { display: block; }
  .colinner { min-height: 0; border-right: 0; }
  .catmain { display: flex; flex-direction: column; }
  .wrappanel { order: 1; }
  .text { order: 2; }
  .bookrow8 li { grid-template-columns: 1fr 1fr; gap: 0 10px; min-height: 28px; line-height: 28px; }
  .bookrow8 .descrow, .bookrow8 .wenmeta, .bookrow8 .homebar { display: none; }
  .pictext4 li { grid-template-columns: 1fr 72px; min-height: 28px; line-height: 28px; }
  .pictext4 li span { display: none; }
  .hd li { grid-template-columns: 1fr 72px; min-height: 30px; line-height: 30px; }
  .hd .descrow, .hd .tag5 { display: none; }
  .hd .wenmeta, .hd .mod { text-align: right; }
  .wenft h2 { height: 36px; line-height: 36px; font-size: 16px; }
  .books { grid-template-columns: 1fr 1.25fr 1fr; gap: 8px; padding: 10px 8px; }
  .wrapsec { grid-template-columns: 1fr 1.25fr 1fr; }
  .time { display: block; }
  .homeinner4 { grid-template-columns: 86px 1fr; min-height: 116px; padding: 8px 0; border-bottom: 1px solid #ddd; }
  .col5 img { width: 86px; height: 116px; }
}

/* mobile category layout restore: compact bqg-style category pages */
@media (max-width: 1023px) {
  .cellsec3 > .info9 {
    width: auto;
    margin-left: 8px;
    margin-right: 8px;
  }

  .wen5 {
    display: block;
    padding: 8px 10px;
    border: 2px solid #8fd1ed;
    background: #fffdf4;
    margin-bottom: 10px;
    box-sizing: border-box;
  }

  .wen5 .wrapblock {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 10px;
    min-height: 112px;
    padding: 8px 0;
    border-bottom: 1px solid #d8d8d8;
    overflow: hidden;
    box-sizing: border-box;
  }

  .wen5 .wrapblock:last-child {
    border-bottom: 0;
  }

  .wen5 .wenrow3,
  .wen5 .wenrow3 img {
    width: 82px;
  }

  .wen5 .wenrow3 img {
    height: 110px;
    object-fit: cover;
  }

  .wen5 .namebar {
    min-width: 0;
  }

  .wen5 .namebar h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: space-between;
    margin: 0 0 4px;
    padding-bottom: 3px;
    border-bottom: 1px dotted #b7d1da;
    font-size: 14px;
    line-height: 20px;
    overflow: hidden;
  }

  .wen5 .namebar h3 a {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .wen5 .namebar h3 span {
    flex: 0 0 auto;
    max-width: 5.5em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #999;
    font-size: 12px;
    font-weight: normal;
  }

  .wen5 .namebar p {
    margin: 0;
    font-size: 13px;
    line-height: 22px;
    max-height: 66px;
    overflow: hidden;
  }

  .gridbd {
    display: block;
    margin-top: 10px;
  }

  .gridbd .text,
  .gridbd .wrappanel {
    width: 100%;
    margin: 0 0 10px;
    border: 2px solid #8fd1ed;
    box-sizing: border-box;
  }

  .gridbd .text h2,
  .gridbd .wrappanel h2 {
    padding: 8px 10px;
    font-size: 14px;
    line-height: 20px;
  }

  .gridbd .bookrow8 li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
    gap: 6px;
    align-items: center;
    min-height: 32px;
    padding: 0 8px;
    box-sizing: border-box;
  }

  .gridbd .bookrow8 .descrow,
  .gridbd .bookrow8 .menusec,
  .gridbd .bookrow8 .tag5 {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
  }

  .gridbd .bookrow8 .descrow {
    display: none;
  }

  .gridbd .bookrow8 .wenmeta,
  .gridbd .bookrow8 .homebar {
    display: none;
  }

  .gridbd .pictext4 li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px;
    gap: 6px;
    align-items: center;
    min-height: 32px;
    padding: 0 8px;
    box-sizing: border-box;
  }

  .gridbd .pictext4 li.picpanel5 {
    grid-template-columns: minmax(0, 1fr);
  }

  .gridbd .pictext4 li > span {
    display: none;
  }

  .gridbd .pictext4 span,
  .gridbd .pictext4 a,
  .gridbd .pictext4 em {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
  }
}

/* desktop bqg scale restore */
@media (min-width: 1024px) {
  .info9,
  .contcell8,
  .chahd,
  .itemcon4 {
    width: 1024px;
    max-width: 1024px;
  }

  .sortlist {
    gap: 14px 20px;
    padding: 10px 12px;
  }

  .sortlist .wrapblock {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 14px;
    min-height: 160px;
  }

  .sortlist .wenrow3,
  .sortlist .wenrow3 img {
    width: 120px;
  }

  .sortlist .wenrow3 img {
    height: 160px;
  }

  .sortlist .namebar h3,
  .gridcover .namebar h3 {
    font-size: 15px;
    line-height: 23px;
  }

  .sortlist .namebar p,
  .gridcover .namebar p {
    font-size: 14px;
    line-height: 24px;
  }

  .colinner {
    padding: 10px 12px;
  }

  .colinner .wrapblock {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 12px;
    min-height: 124px;
  }

  .colinner .wenrow3,
  .colinner .wenrow3 img {
    width: 92px;
  }

  .colinner .wenrow3 img {
    height: 124px;
  }

  .storywrap2 li,
  .pictext4 li,
  .bookrow8 li {
    font-size: 14px;
    min-height: 24px;
    line-height: 24px;
  }

  .text h2,
  .wrappanel h2,
  .colinner h2 {
    font-size: 16px;
  }
}

/* 2026-07-12: desktop home layout restore: 4 featured + classic sidebar */
@media (min-width: 1024px) {
  .info9,
  .contcell8,
  .chahd,
  .itemcon4 {
    width: 1024px;
    max-width: 1024px;
    box-sizing: border-box;
  }

  .itemcon4 {
    display: flex;
    align-items: stretch;
    overflow: visible;
    height: 40px;
  }

  .itemcon4 a,
  .secwrap a {
    flex: 0 0 auto;
    display: block;
    padding: 0 10px;
    font-size: 14px;
    line-height: 40px;
    white-space: nowrap;
    box-sizing: border-box;
  }

  .shulink7 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 12px;
    border: 3px solid #9bd5ee;
    background: #fffdf5;
    padding: 10px;
    margin: 0 0 12px;
    box-sizing: border-box;
  }

  .shulink7 .sortlist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 18px;
    border: 0;
    margin: 0;
    padding: 0;
    background: transparent;
  }

  .shulink7 .sortlist .wrapblock {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    min-height: 160px;
    gap: 14px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .shulink7 .sortlist .wrapblock:nth-child(n+5) {
    display: none;
  }

  .shulink7 .wenrow3,
  .shulink7 .wenrow3 img {
    width: 120px;
    height: 160px;
    object-fit: cover;
  }

  .shubox {
    border-left: 3px solid #9bd5ee;
    background: #eefafa;
    margin: -10px -10px -10px 0;
    min-width: 0;
  }

  .shubox h2 {
    height: 36px;
    line-height: 36px;
    margin: 0;
    padding: 0 12px;
    background: #d9edf0;
    color: #333;
    font-size: 16px;
    font-weight: 700;
  }

  .shubox ul {
    list-style: none;
    margin: 0;
    padding: 6px 10px;
  }

  .shubox li {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) 68px;
    gap: 6px;
    height: 28px;
    line-height: 28px;
    border-bottom: 1px solid #d3e1e4;
    overflow: hidden;
  }

  .shubox li span,
  .shubox li a,
  .shubox li em {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-style: normal;
    font-size: 13px;
  }

  .shubox li a {
    color: #3366aa;
  }

  .shubox li em {
    color: #666;
    text-align: right;
  }
}

@media (max-width: 1023px) {
  .shulink7 {
    display: block;
    border: 2px solid #8fd1ed;
    background: #fffdf4;
    padding: 8px;
    margin-bottom: 10px;
  }

  .shulink7 .sortlist {
    display: block;
    border: 0;
    margin: 0;
    padding: 0;
    background: transparent;
  }

  .shubox {
    margin-top: 8px;
    border: 2px solid #8fd1ed;
    background: #eefafa;
  }

  .shubox h2 {
    height: 34px;
    line-height: 34px;
    margin: 0;
    padding: 0 10px;
    background: #d9edf0;
    font-size: 15px;
  }

  .shubox ul {
    list-style: none;
    margin: 0;
    padding: 4px 8px;
  }

  .shubox li {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) 58px;
    gap: 4px;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #d3e1e4;
    overflow: hidden;
  }

  .shubox li span,
  .shubox li a,
  .shubox li em {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-style: normal;
    font-size: 13px;
  }

  .shubox li em {
    text-align: right;
  }
}

/* 2026-07-12: force desktop nav/header width to 1024px */
@media (min-width: 1024px) {
  .contcell8,
  .chahd,
  .itemcon4,
  .info9 {
    width: 1024px !important;
    max-width: 1024px !important;
    box-sizing: border-box;
  }

  .dateimg,
  .secwrap {
    width: 1024px !important;
    max-width: 1024px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
  }

  .itemcon4 {
    display: flex !important;
    align-items: stretch !important;
    overflow: visible !important;
  }
}

/* 2026-07-12: remove current-menu selection mark, keep nav visually flat */
.dateimg a.read7,
.dateimg a[aria-current="page"],
.secwrap a.read7,
.secwrap a[aria-current="page"],
.itemcon4 a.read7,
.itemcon4 a[aria-current="page"] {
  background: transparent !important;
  color: #fff !important;
  text-decoration: none !important;
}

.dateimg a:hover,
.secwrap a:hover,
.itemcon4 a:hover {
  background: #57acd2 !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* 2026-07-12: desktop starts at 1024px; below 1024 uses mobile adaptive layout */
@media (min-width: 1024px) {
  .contcell8,
  .chahd,
  .itemcon4,
  .info9,
  .dateimg,
  .secwrap {
    width: 1024px !important;
    max-width: 1024px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  .dateimg,
  .secwrap {
    overflow: hidden !important;
  }
}

@media (max-width: 1023px) {
  .contcell8,
  .chahd,
  .itemcon4,
  .info9,
  .dateimg,
  .secwrap {
    width: auto !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .info9,
  .chahd,
  .contcell8 {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }

  .dateimg,
  .secwrap {
    margin-left: 10px !important;
    margin-right: 10px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .itemcon4 {
    min-width: max-content !important;
    display: flex !important;
  }
}

/* nav-hover-disabled: 导航条不保留 hover / focus / active 印记 */
.metas nav a:hover,
.metas nav a:focus,
.metas nav a.read7,
.metas nav .read7,
.chahd nav a:hover,
.chahd nav a:focus,
.chahd nav a.read7,
.chahd nav .read7,
.dateimg a:hover,
.dateimg a:focus,
.dateimg a.read7,
.dateimg .read7,
.secwrap a:hover,
.secwrap a:focus,
.secwrap a.read7,
.secwrap .read7 {
    background: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* responsive-1024-fix:start */
/* 桌面版：传统站宽度固定 1024，导航与主体保持同宽 */
@media (min-width: 1024px) {
    .contcell8,
    .metas .chahd,
    .chahd,
    .info9,
    .cellsec3,
    .toprow,
    .menu,
    .rowcon,
    .dateimg,
    .secwrap {
        width: 1024px !important;
        max-width: 1024px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }
}

/* 小于等于 1024：立即切到移动自适应，不再保留桌面定宽 */
@media (max-width: 1023px) {
    html,
    body {
        width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }

    body {
        margin: 0 !important;
    }

    .volwrap4,
    .metas,
    .cellsec3,
    .titlesec7,
    .contcell8,
    .metas .chahd,
    .chahd,
    .info9,
    .rowcon,
    .toprow,
    .menu,
    .itemmod,
    .dateimg,
    .secwrap {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    .contcell8,
    .metas .chahd,
    .chahd,
    .info9,
    .toprow,
    .menu,
    .cellsec3 {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .metas .chahd,
    .chahd {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .vol,
    .metas h1,
    .metas .vol {
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
        text-align: left !important;
    }

    .footgrid {
        margin-left: auto !important;
    }

    .dateunit {
        order: 3 !important;
        flex: 0 0 100% !important;
        display: flex !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .dateunit .hdunit,
    .dateunit input[type="text"] {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .dateunit .storytext5,
    .dateunit button,
    .dateunit input[type="submit"] {
        flex: 0 0 82px !important;
        width: 82px !important;
    }

    .dateimg,
    .secwrap {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 0 !important;
    }

    .dateimg a,
    .secwrap a {
        flex: 0 0 auto !important;
        padding: 0 12px !important;
        text-align: center !important;
    }

    .catrow,
    .hdline,
    .sortgrid,
    .textbox2,
    .nameitem6,
    .wenft .unitcol,
    .hd,
    .unitcol,
    .infoinner9,
    .name,
    .secpanel,
    .contimg {
        display: block !important;
        grid-template-columns: none !important;
        columns: auto !important;
        width: 100% !important;
    }

    .sectext,
    .catbar2,
    .unitcol .pagelist,
    .hd .pagelist,
    .infoinner9 .pagelist,
    .name .pagelist,
    .secpanel .pagelist,
    .bdunit,
    .hdarea {
        display: grid !important;
        grid-template-columns: 88px minmax(0, 1fr) !important;
        gap: 10px !important;
        width: 100% !important;
        min-height: 118px !important;
        margin: 0 0 12px !important;
        padding-bottom: 10px !important;
        border-bottom: 1px dotted #98c9d9 !important;
        box-sizing: border-box !important;
        break-inside: avoid !important;
    }

    .sectext img,
    .catbar2 img,
    .col5 img,
    .unitcol .pagelist img,
    .hd .pagelist img,
    .infoinner9 .pagelist img,
    .name .pagelist img,
    .secpanel .pagelist img,
    .bdunit img,
    .hdarea img {
        width: 88px !important;
        height: 118px !important;
        object-fit: cover !important;
    }

    .homeft,
    .conttext6,
    .namebar,
    .cont7,
    .hdarea dl,
    .hdarea .picblock {
        min-width: 0 !important;
    }

    .title6,
    .readimg,
    .unitmeta,
    .picline2 {
        display: block !important;
        grid-template-columns: none !important;
        width: 100% !important;
    }

    .title6 > *,
    .readimg > *,
    .unitmeta > *,
    .picline2 > * {
        width: 100% !important;
        margin-bottom: 10px !important;
        box-sizing: border-box !important;
    }
}

/* 导航条不保留 hover/focus/active 视觉印记 */
.dateimg a:hover,
.dateimg a:focus,
.dateimg a:active,
.dateimg a.read7,
.dateimg .read7,
.secwrap a:hover,
.secwrap a:focus,
.secwrap a:active,
.secwrap a.read7,
.secwrap .read7,
.metas nav a:hover,
.metas nav a:focus,
.metas nav a:active,
.metas nav a.read7,
.chahd nav a:hover,
.chahd nav a:focus,
.chahd nav a:active,
.chahd nav a.read7 {
    background: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}
/* responsive-1024-fix:end */
/* Homepage featured descriptions: clip at exactly five complete lines. */
@media (min-width: 1024px) {
  .shulink7 .namebar p,
  .wen5 .namebar p {
    height: 130px;
    line-height: 26px;
  }
}

/* Compact desktop header while preserving independent mobile layout. */
@media (min-width: 1024px) {
  .volwrap4,
  .contcell8 {
    height: 28px;
  }

  .chahd {
    height: 68px;
  }

  .dateimg,
  .itemcon4 {
    height: 38px;
  }

  .dateimg a,
  .itemcon4 a {
    line-height: 38px;
  }

  .cellsec3 {
    padding-top: 8px;
  }
}

/* Target-site adaptive header: up to 1023px mobile; 1024px and above desktop. */
.picarea8,
.readsec3 {
  display: none;
}

@media (max-width: 1023px) {
  .volwrap4 {
    display: none !important;
  }

  .metas {
    padding: 0 !important;
    background: #e6f8fb !important;
  }

  .metas .chahd,
  .chahd {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 0 !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
    background: #e6f8fb !important;
  }

  .metas .vol,
  .metas h1 {
    height: 52px !important;
    line-height: 52px !important;
    padding-left: 12px !important;
    margin: 0 !important;
    color: #0871bd !important;
    font-size: 27px !important;
    text-shadow: 2px 3px 3px rgba(0, 90, 150, .28) !important;
  }

  .metas .vol a {
    color: #0871bd !important;
    text-shadow: 2px 3px 3px rgba(0, 90, 150, .28) !important;
  }

  .picarea8 {
    display: flex !important;
    gap: 8px !important;
    padding-right: 10px !important;
  }

  .picarea8 a {
    display: block !important;
    min-width: 48px !important;
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 8px !important;
    border-radius: 3px !important;
    background: #74c0df !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 13px !important;
  }

  .readsec3 {
    display: grid !important;
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    height: 42px !important;
    background: #74c0df !important;
    border-top: 0 !important;
  }

  .readsec3 a {
    min-width: 0 !important;
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 !important;
    color: #fff !important;
    text-align: center !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }

  .metas .dateunit,
  .chahd .dateunit {
    display: flex !important;
    grid-column: 1 / -1 !important;
    order: initial !important;
    width: auto !important;
    height: 52px !important;
    margin: 0 !important;
    padding: 9px 10px !important;
    border: 0 !important;
    background: #e6f8fb !important;
    box-sizing: border-box !important;
  }

  .metas .dateunit .hdunit,
  .metas .dateunit input[type="text"] {
    height: 34px !important;
    border: 1px solid #8dcde7 !important;
    border-right: 0 !important;
  }

  .metas .dateunit .storytext5,
  .metas .dateunit button {
    flex: 0 0 82px !important;
    width: 82px !important;
    height: 34px !important;
    border: 1px solid #8dcde7 !important;
    background: #ddd !important;
    color: #222 !important;
  }

  body > .dateimg,
  body > nav.dateimg {
    display: none !important;
  }

  .cellsec3 {
    padding-top: 0 !important;
  }

  .shulink7 {
    margin-top: 0 !important;
  }

  /* Book detail: keep metadata beside the cover, but move actions/intro full width. */
  .tagcover2 {
    display: grid !important;
    grid-template-columns: 96px minmax(0, 1fr) !important;
    gap: 8px 10px !important;
    padding: 10px !important;
    align-items: start !important;
  }

  .tagcover2 .homeline {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 96px !important;
    min-height: 126px !important;
    padding: 4px !important;
  }

  .tagcover2 .homeline img {
    width: 100% !important;
    height: 118px !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  .tagcover2 .infopanel {
    display: contents !important;
  }

  .tagcover2 .infopanel h1 {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    height: auto !important;
    line-height: 27px !important;
    font-size: 18px !important;
    white-space: normal !important;
  }

  .tagcover2 .descbd {
    grid-column: 2 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .tagcover2 .descbd p {
    height: 25px !important;
    line-height: 25px !important;
  }

  .tagcover2 .deschd {
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
    margin: 2px 0 0 !important;
  }

  .tagcover2 .tool3 {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
    max-height: 112px !important;
    padding-top: 2px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .tagcover2 .tool3.tagmetabar {
    max-height: none !important;
  }

  .tagcover2 .listrow {
    grid-column: 1 / -1 !important;
    grid-row: 4 !important;
  }

  .chablock2 .navlist {
    grid-template-columns: 1fr !important;
  }

  .secwrapcon .hotinner {
    margin: 14px 0 0 !important;
    padding: 14px 10px 16px !important;
    background: #fff !important;
  }

  .secwrapcon .hotinner h2 {
    margin-bottom: 12px !important;
    color: #888 !important;
    font-weight: 400 !important;
  }

  .secwrapcon .navline2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 14px !important;
  }

  .secwrapcon .navline2 a {
    min-width: 0 !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  .cellsec3 .info9 > .hotinner {
    margin: 0 0 14px !important;
    padding: 14px 10px 16px !important;
    background: #fff !important;
  }

  .cellsec3 .info9 > .hotinner .navline2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px 14px !important;
  }

  .cellsec3 .info9 > .hotinner .navline2 a {
    min-width: 0 !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }
}

/* 分类页桌面双栏等高：左侧 42×35px，右侧 49×30px。 */
@media (min-width: 1024px) {
  .gridbd .bookrow8 li {
    height: 35px;
    min-height: 35px;
    line-height: 35px;
  }

  .gridbd .pictext4 li,
  .gridbd .pictext4 li.picpanel5 {
    height: 30px;
    min-height: 30px;
    line-height: 30px;
  }

  /* 数据不足49条时，左右条数相同，统一使用35px行高。 */
  .gridbd.titleblock7 .pictext4 li,
  .gridbd.titleblock7 .pictext4 li.picpanel5 {
    height: 35px;
    min-height: 35px;
    line-height: 35px;
  }
}

/* Category footer controls: keep the three paging controls on one row and
   pin the right-column entry to the bottom of the equally tall panel. */
.gridbd { align-items: stretch; }
.gridbd .text,
.gridbd .wrappanel { min-width: 0; }
.gridbd .wrappanel { display: flex; flex-direction: column; }
.gridbd .wrappanel .pictext4 { flex: 0 0 auto; }
.gridbd .navhd {
  display: grid;
  grid-template-columns: minmax(90px, 160px) minmax(120px, 1fr) minmax(90px, 160px);
  gap: 10px;
  align-items: center;
  padding: 12px 10px 10px;
  box-sizing: border-box;
}
.gridbd .navhd > a,
.gridbd .navhd > span,
.gridbd .navhd > select {
  width: 100%;
  height: 36px;
  min-width: 0;
  margin: 0;
  box-sizing: border-box;
}
.gridbd .navhd > a,
.gridbd .navhd > span {
  display: flex;
  align-items: center;
  justify-content: center;
}
.gridbd .navhd > select {
  border: 1px solid #b9d7e3;
  background: #fff;
  padding: 0 10px;
}
.gridbd .catepanel {
  margin: auto 0 0;
  padding: 12px 10px 10px;
  border-top: 1px solid #cbdde3;
  box-sizing: border-box;
}
.gridbd .catepanel a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 36px;
  background: #4badd3;
  color: #fff;
  box-sizing: border-box;
}
@media (max-width: 1023px) {
  .gridbd .navhd {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 5px;
    padding: 10px 6px;
  }
}

/* Mobile reader width: avoid stacking page/container/reader side gutters. */
@media (max-width: 1023px) {
  .cellsec3.hdbox3,
  .cellsec3.booksec9,
  .cellsec3.read9 {
    width: 100% !important;
    max-width: none !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
  }

  .cellsec3.hdbox3 > .info9,
  .cellsec3.booksec9 > .info9,
  .cellsec3.read9 > .info9 {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  .cellsec3.sort {
    width: 100% !important;
    max-width: none !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
  }

  .cellsec3.sort > .info9 {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .cellsec3.sort .secwrapcon {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: clamp(6px, 2vw, 16px) !important;
    padding-right: clamp(6px, 2vw, 16px) !important;
    box-sizing: border-box !important;
  }

  .cellsec3.sort .story5 {
    width: 100% !important;
    max-width: none !important;
    padding-left: clamp(2px, 1.2vw, 10px) !important;
    padding-right: clamp(2px, 1.2vw, 10px) !important;
    box-sizing: border-box !important;
  }

  .cellsec3.sort .pic8,
  .cellsec3.sort .maincell {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}