/* PC 作品详情页（/book/{id}），2026-10 改版：只管页面主体，弹窗沿用 bookInfo.css 里的旧样式 */
.bd-page, .bd-share-mask, .bd-notice-pop {
    --bd-ink: #1F1D3A;
    --bd-sub: #6B6880;
    --bd-mute: #75728C;
    --bd-brand: #7E7CFB;        /* 全站主题色：按钮等实心底 */
    --bd-brand-hover: #6C69F2;
    --bd-brand-ink: #5B57E8;    /* 紫色文字用深一档，浅底上才看得清 */
    --bd-brand-soft: #EEEDFD;
    --bd-line: #ECEAF5;
}
.bd-page {
    width: 1200px;
    margin: 0 auto;
    padding: 18px 0 64px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    color: var(--bd-ink);
    font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
    text-align: left;
}
/* 分享弹窗在 .bd-page 外面：只共用颜色变量，字体和盒模型单独给 */
.bd-share-mask { font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif; text-align: left; }
.bd-share-mask *, .bd-share-mask *::before, .bd-share-mask *::after { box-sizing: border-box; }
.bd-share-mask button, .bd-share-mask input, .bd-share-mask textarea { font-family: inherit; }
.bd-page *, .bd-page *::before, .bd-page *::after { box-sizing: border-box; }
.bd-page a { color: inherit; text-decoration: none; }
.bd-page button { font-family: inherit; cursor: pointer; }
.bd-serif { font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif; }
.bd-ellipsis { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-card { background: #FFFFFF; border: 1px solid var(--bd-line); border-radius: 16px; padding: 20px 22px; }
.bd-h2 { margin: 0; font-size: 20px; font-weight: 700; }
.bd-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bd-head .bd-grow { flex: 1; }
.bd-link, .bd-page a.bd-link { font-size: 13px; color: var(--bd-brand-ink); }
.bd-link:hover { color: #4B47D6; }
.bd-crumb { font-size: 13px; color: var(--bd-sub); display: flex; gap: 8px; }
.bd-crumb a:hover { color: var(--bd-brand-ink); }

/* ===== 顶部作品区（方案 B：白卡 + 左侧封面色块）===== */
.bd-hero { position: relative; display: flex; border-radius: 20px; overflow: hidden; background: #FFFFFF; border: 1px solid var(--bd-line); color: var(--bd-ink); }
.bd-hero-side { flex: none; position: relative; width: 340px; overflow: hidden; display: flex; flex-direction: column; align-items: center; padding: 30px 0; background: #D9D6EC; }
.bd-hero-bg { position: absolute; left: -40px; top: -40px; width: calc(100% + 80px); height: calc(100% + 80px); object-fit: cover; filter: blur(30px) saturate(1.15); opacity: 0.75; }
.bd-hero-mask { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.25); }
/* 封面 230×322；画框 274×358 叠在外面（偏移同旧版 -22/-18），徽章 74×74 在右上角 */
.bd-cover { flex: none; position: relative; width: 230px; height: 322px; margin: 18px 22px; }
.bd-cover > img.bd-cover-img { position: absolute; left: 0; top: 0; width: 230px; height: 322px; border-radius: 6px; object-fit: cover; box-shadow: 0 16px 34px rgba(30, 20, 60, 0.35); }
.bd-cover-frame { position: absolute; left: -22px; top: -18px; width: 274px; height: 358px; background-position: center center; background-repeat: no-repeat; background-size: 100%; pointer-events: none; }
.bd-cover-mark { position: absolute; left: 170px; top: -8px; width: 74px; height: 74px; }
.bd-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 14px; padding: 40px 40px 34px; }
.bd-badges { display: flex; gap: 8px; flex-wrap: wrap; font-size: 12px; align-items: center; }
.bd-badge { font-weight: 700; border-radius: 4px; padding: 2px 8px; }
.bd-badge-end { background: #E3F5EA; color: #1E7A4A; }
.bd-badge-ing { background: var(--bd-brand-soft); color: var(--bd-brand-ink); }
.bd-badge-sign { background: #FDF0DA; color: #9A6514; }
.bd-badge-pay { background: #FFEDE3; color: #D2551C; }
.bd-badge-month { background: #F6E8F7; color: #9B3FA0; }
.bd-badge-free { background: #E4F1FA; color: #2470A6; }
/* 请假条 / 更新预告：封面正下方的小卡片，Q 版人物从左边探出头 */
.bd-notice-card { position: relative; z-index: 1; display: flex; align-items: center; width: 230px; height: 60px; margin-top: 8px; padding: 0 12px 0 74px; border: 1px solid rgba(255, 255, 255, 0.75); border-radius: 14px; background: rgba(255, 255, 255, 0.62); backdrop-filter: blur(8px); box-shadow: 0 8px 20px rgba(31, 29, 58, 0.14); text-align: left; cursor: pointer; font-family: inherit; transition: transform .15s, box-shadow .15s; }
.bd-notice-card:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(31, 29, 58, 0.2); }
.bd-notice-q { position: absolute; left: 10px; bottom: 0; width: 56px; height: auto; transition: transform .2s; transform-origin: 50% 100%; }
.bd-notice-card:hover .bd-notice-q { transform: rotate(-6deg) scale(1.04); }
.bd-notice-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.bd-notice-txt b { font-size: 14px; }
.bd-notice-txt span { font-size: 12px; color: var(--bd-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-notice-card em { flex: none; font-style: normal; font-size: 11px; padding: 3px 8px; border-radius: 10px; color: #FFFFFF; }
.bd-notice-card.is-next b { color: var(--bd-brand-ink); }
.bd-notice-card.is-next em { background: var(--bd-brand); }
.bd-notice-card.is-off b { color: #A8620A; }
.bd-notice-card.is-off em { background: #E8961F; }
/* 弹窗：放在全站遮罩 showMark 里，宽 380 */
.bd-notice-pop { position: relative; width: 380px; max-width: calc(100vw - 32px); border-radius: 20px; background: #FFFFFF; overflow: hidden; box-shadow: 0 24px 60px rgba(22, 20, 44, 0.28); font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif; color: var(--bd-ink); text-align: left; animation: bd-pop .2s ease-out; }
.bd-notice-pop *, .bd-notice-pop *::before, .bd-notice-pop *::after { box-sizing: border-box; }
.bd-notice-x { position: absolute; right: 14px; top: 14px; z-index: 1; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.7); color: #6B6880; font-size: 18px; line-height: 28px; padding: 0; cursor: pointer; }
.bd-notice-x:hover { background: #FFFFFF; color: var(--bd-ink); }
.bd-notice-top { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 24px 22px; text-align: center; }
.bd-notice-pop.is-next .bd-notice-top { background: linear-gradient(180deg, #ECEBFE 0%, #FFFFFF 100%); }
.bd-notice-pop.is-off .bd-notice-top { background: linear-gradient(180deg, #FFF0DA 0%, #FFFFFF 100%); }
.bd-notice-pop-q { width: 76px; height: auto; margin: -6px 0 4px; filter: drop-shadow(0 8px 14px rgba(31, 29, 58, 0.16)); }
.bd-notice-top b { font-size: 19px; }
.bd-notice-top span { font-size: 13px; color: var(--bd-sub); }
.bd-notice-rows { margin: 0 24px; padding: 14px 16px; border-radius: 12px; background: #F8F7FE; display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; align-items: baseline; }
.bd-notice-pop.is-off .bd-notice-rows { background: #FFF9F1; }
.bd-notice-rows dt { font-size: 13px; color: var(--bd-sub); white-space: nowrap; }
.bd-notice-rows dd { margin: 0; font-size: 14px; line-height: 1.6; word-break: break-all; }
.bd-notice-rows dd.bd-notice-time { font-size: 16px; font-weight: 700; }
.bd-notice-pop.is-next .bd-notice-time { color: var(--bd-brand-ink); }
.bd-notice-pop.is-off .bd-notice-time { color: #A8620A; }
.bd-notice-foot { display: flex; gap: 10px; padding: 18px 24px 22px; }
.bd-notice-btn { flex: 1; height: 42px; border: 0; border-radius: 21px; background: var(--bd-brand); color: #FFFFFF; font-size: 14px; font-weight: 700; font-family: inherit; cursor: pointer; }
.bd-notice-btn:hover { background: var(--bd-brand-hover); }
.bd-notice-btn.bd-ghost { flex: none; width: 96px; background: #F2F1F9; color: #4A475C; font-weight: 400; }
.bd-notice-btn.bd-ghost:hover { background: #E8E6F5; }
.bd-title { margin: 0; font-size: 36px; font-weight: 900; letter-spacing: 1px; line-height: 1.2; }
.bd-author-line { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--bd-sub); flex-wrap: wrap; }
.bd-author-line img { width: 28px; height: 28px; border-radius: 14px; object-fit: cover; background: #E9E7F8; box-shadow: 0 0 0 1px rgba(31, 29, 58, 0.12), 0 2px 6px rgba(91, 87, 232, 0.16); }
.bd-author-line strong { color: var(--bd-ink); }
.bd-author-line a:hover strong { color: var(--bd-brand-ink); }
.bd-stats { display: flex; gap: 28px; flex-wrap: wrap; align-items: flex-end; }
.bd-stat b { display: block; font-size: 24px; font-weight: 700; line-height: 1.2; }
.bd-stat span { display: block; font-size: 12px; color: var(--bd-mute); margin-top: 2px; }
.bd-score { padding-left: 28px; border-left: 1px solid #E3E1F2; }
.bd-score b { color: #D9921A; display: inline; }
.bd-stars { display: inline-flex; gap: 2px; vertical-align: 2px; margin-left: 6px; }
.bd-stars img { width: 15px; height: 15px; }
/* 分类实心 > 频道浅紫 > 普通标签描边 */
.bd-tags { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.bd-tags span, .bd-tags a { font-size: 12px; line-height: 18px; border-radius: 12px; padding: 2px 11px; color: #4A475C; border: 1px solid #DCDAEA; }
.bd-page .bd-tags a.bd-tag-sort { background: var(--bd-brand); border-color: var(--bd-brand); color: #FFFFFF; font-weight: 700; }
.bd-page .bd-tags a.bd-tag-sort:hover { background: var(--bd-brand-hover); }
.bd-tags span.bd-tag-group { background: var(--bd-brand-soft); border-color: var(--bd-brand-soft); color: var(--bd-brand-ink); }
/* 频道配色沿用旧版：纯爱紫（默认）、百合黄、言情粉 */
.bd-tags span.bd-tag-group.bd-group-bh { background: #FBF0CC; border-color: #FBF0CC; color: #B86E00; }
.bd-tags span.bd-tag-group.bd-group-yq { background: #FBE3F9; border-color: #FBE3F9; color: #B83FAF; }
.bd-info-top { display: flex; gap: 28px; align-items: flex-start; }
.bd-info-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
/* 右上口碑卡：评分 + 读者印象前三 + 去评分 */
.bd-rep { flex: none; width: 210px; padding: 16px 18px; border-radius: 14px; background: linear-gradient(160deg, #FFF8EC 0%, #F8F7FE 70%); border: 1px solid #F1ECE0; display: flex; flex-direction: column; align-items: flex-start; }
.bd-rep-score { display: flex; align-items: center; gap: 8px; }
.bd-rep-score b { font-size: 38px; line-height: 1; font-weight: 700; color: #D9921A; }
.bd-rep-score .bd-stars { margin-left: 0; vertical-align: 0; }
.bd-rep-none b { font-size: 20px; color: var(--bd-sub); font-family: inherit; }
.bd-rep-people { margin-top: 6px; font-size: 12px; color: var(--bd-mute); }
.bd-rep-effect { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #E6E2D6; width: 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.bd-rep-effect em { width: 100%; font-style: normal; font-size: 12px; color: var(--bd-sub); }
.bd-rep-effect .bd-effect-tag { height: 22px; padding: 0 8px; gap: 5px; }
.bd-rep-go { margin-top: 12px; height: 30px; padding: 0 14px; border-radius: 15px; border: 1px solid #F0D9B0; background: #FFFFFF; color: #B7771A; font-size: 13px; cursor: pointer; }
.bd-rep-go:hover { background: #FFF4E0; border-color: #E9C68A; }
.bd-intro-row { display: flex; gap: 16px; align-items: flex-start; }
/* 简介：折叠 4 行；展开后放进固定高度的浅底滚动框，顶部区不会被撑高 */
.bd-intro { flex: 1; min-width: 0; margin: 0; font-size: 14px; line-height: 1.85; color: #4A475C; max-width: 760px; }
.bd-intro p { margin: 0; }
.bd-intro p.introHide { -webkit-line-clamp: 4; }
.bd-intro.is-open p { max-height: 236px; overflow-y: auto; background: #F7F6FE; border-radius: 12px; padding: 12px 16px; scrollbar-width: thin; scrollbar-color: #C9C6F4 transparent; }
.bd-intro.is-open p::-webkit-scrollbar { width: 6px; }
.bd-intro.is-open p::-webkit-scrollbar-thumb { background: #C9C6F4; border-radius: 3px; }
.bd-intro .introTag { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; color: var(--bd-brand-ink); font-size: 13px; line-height: 20px; cursor: pointer; }
.bd-intro .introTag::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.bd-intro.is-open .introTag::after { transform: translateY(2px) rotate(-135deg); }
.bd-intro .introTag:hover { color: #4B47D6; }
.bd-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 4px; position: relative; }
.bd-btn { height: 48px; padding: 0 24px; border-radius: 24px; border: 0; font-size: 15px; display: inline-flex; align-items: center; gap: 6px; }
.bd-page a.bd-btn-read, .bd-btn-read { background: var(--bd-brand); color: #FFFFFF; font-size: 18px; font-weight: 700; padding: 0 32px; box-shadow: 0 8px 18px rgba(126, 124, 251, 0.35); }
.bd-page a.bd-btn-read:hover { background: var(--bd-brand-hover); color: #FFFFFF; }
/* 继续阅读：两行，第二行是上次读到的章节 */
.bd-page a.bd-btn-read.bd-resume { flex-direction: column; justify-content: center; align-items: flex-start; gap: 0; height: 52px; padding: 0 28px; max-width: 220px; line-height: 1.2; }
.bd-resume span { font-size: 17px; }
.bd-resume small { max-width: 164px; font-size: 12px; font-weight: 400; opacity: .85; margin-top: 3px; }
.bd-btn-buy { background: var(--bd-brand-soft); color: var(--bd-brand-ink); font-weight: 700; }
.bd-btn-buy:hover { background: #E2E0FC; }
.bd-btn-buy small { font-size: 12px; font-weight: 400; }
.bd-btn-buy.bd-done { background: #F2F1F9; color: var(--bd-mute); cursor: default; }
.bd-btn-ghost { border: 1px solid #D4D1EE; background: #FFFFFF; color: #3A3850; }
.bd-btn-ghost:hover { border-color: #B9B5EC; color: var(--bd-brand-ink); }
.bd-btn-ghost.bd-done { color: var(--bd-mute); }
.bd-mini { display: flex; align-items: center; gap: 16px; margin-left: auto; font-size: 13px; color: var(--bd-sub); position: relative; }
.bd-mini > a:hover, .bd-mini > span:hover { color: var(--bd-brand-ink); }
.bd-share-btn { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 14px; border-radius: 16px; border: 1px solid #DCDAEA; background: #FFFFFF; color: #4A475C; font-size: 13px; cursor: pointer; }
.bd-share-btn:hover { border-color: #B9B5EC; color: var(--bd-brand-ink); background: #FAFAFF; }
/* 分享弹窗 */
.bd-share-mask { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 3000; background: rgba(22, 20, 44, 0.45); display: flex; align-items: center; justify-content: center; animation: bd-fade .18s ease-out; }
@keyframes bd-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes bd-pop { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.bd-share-box { width: 520px; max-width: calc(100vw - 32px); max-height: calc(100vh - 40px); overflow-y: auto; background: #FFFFFF; border-radius: 18px; padding: 20px 24px 22px; box-shadow: 0 24px 60px rgba(22, 20, 44, 0.28); animation: bd-pop .2s ease-out; color: var(--bd-ink); }
.bd-share-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.bd-share-head b { font-size: 17px; }
.bd-share-x { width: 30px; height: 30px; border: 0; border-radius: 50%; background: #F2F1F9; color: #6B6880; font-size: 20px; line-height: 30px; padding: 0; cursor: pointer; }
.bd-share-x:hover { background: #E6E4F5; color: var(--bd-ink); }
.bd-share-card { display: flex; gap: 14px; padding: 12px; border-radius: 12px; background: linear-gradient(135deg, #F4F3FE 0%, #FBF7FF 100%); }
.bd-share-card > img { flex: none; width: 64px; height: 88px; border-radius: 6px; object-fit: cover; background: #E9E7F8; box-shadow: 0 6px 14px rgba(31, 29, 58, 0.18); }
.bd-share-card > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.bd-share-card b { font-size: 15px; }
.bd-share-card span { font-size: 12px; color: var(--bd-sub); }
.bd-share-card p { margin: 2px 0 0; font-size: 12px; line-height: 1.6; color: #6B6880; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.bd-share-label { display: flex; align-items: baseline; gap: 8px; margin: 16px 0 6px; }
.bd-share-label span { font-size: 13px; font-weight: 700; }
.bd-share-label em { font-style: normal; font-size: 12px; color: var(--bd-mute); }
.bd-share-text { display: block; width: 100%; box-sizing: border-box; resize: none; border: 1px solid #E3E1F2; border-radius: 10px; padding: 8px 12px; font-size: 13px; line-height: 1.7; font-family: inherit; color: var(--bd-ink); outline: 0; }
.bd-share-text:focus { border-color: var(--bd-brand); box-shadow: 0 0 0 3px rgba(126, 124, 251, 0.15); }
.bd-share-chs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-top: 16px; }
.bd-share-chs button { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 0; border: 0; border-radius: 12px; background: transparent; font-size: 12px; color: #4A475C; cursor: pointer; }
.bd-share-chs button:hover { background: #F6F5FD; }
.bd-share-chs button:hover img, .bd-share-chs button:hover i { transform: translateY(-2px); }
.bd-share-chs img, .bd-share-chs i { width: 42px; height: 42px; border-radius: 50%; transition: transform .15s; }
.bd-share-chs i { display: flex; align-items: center; justify-content: center; }
.bd-share-xlogo { background: #111111; }
.bd-share-copy { background: var(--bd-brand); color: #FFFFFF; }
.bd-share-foot { display: flex; gap: 16px; align-items: center; margin-top: 16px; padding: 14px; border-radius: 12px; background: #F8F7FE; transition: box-shadow .2s; }
.bd-share-foot.bd-flash { animation: bd-flash 1.2s ease-out; }
@keyframes bd-flash { 0%, 60% { box-shadow: 0 0 0 3px #2DC100; } 100% { box-shadow: 0 0 0 0 rgba(45, 193, 0, 0); } }
.bd-share-qr { flex: none; width: 104px; height: 104px; padding: 6px; background: #FFFFFF; border-radius: 8px; box-shadow: 0 0 0 1px #E6E4F2; }
.bd-share-qr canvas, .bd-share-qr img, .bd-share-qr table { display: block; width: 92px !important; height: 92px !important; }
.bd-share-foot-r { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.bd-share-foot-r b { font-size: 14px; }
.bd-share-foot-r > span { font-size: 12px; color: var(--bd-sub); }
.bd-share-link { display: flex; margin-top: 8px; border: 1px solid #E3E1F2; border-radius: 8px; overflow: hidden; background: #FFFFFF; }
.bd-share-link input { flex: 1; min-width: 0; border: 0; outline: 0; padding: 0 10px; height: 32px; font-size: 12px; color: var(--bd-sub); background: transparent; }
.bd-share-link button { flex: none; border: 0; padding: 0 14px; background: var(--bd-brand); color: #FFFFFF; font-size: 12px; cursor: pointer; }
.bd-share-link button:hover { background: var(--bd-brand-hover); }
.bd-qr { position: absolute; right: 40px; bottom: 28px; width: 150px; padding: 6px; background: #FFFFFF; border-radius: 10px; box-shadow: 0 10px 24px rgba(31, 29, 58, 0.18); border: 1px solid var(--bd-line); display: none; z-index: 5; }
.bd-qr img { width: 138px; height: 138px; display: block; }

/* ===== 下半部分 ===== */
.bd-body { display: flex; gap: 24px; align-items: flex-start; }
.bd-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.bd-side { flex: none; width: 376px; display: flex; flex-direction: column; gap: 20px; position: sticky; top: 16px; }

/* 作品互动：整张卡片就是按钮 */
.bd-votes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.bd-vote { background: #FFFFFF; border: 1px solid var(--bd-line); border-radius: 16px; padding: 18px 12px 14px; display: flex; flex-direction: column; align-items: center; gap: 2px; transition: box-shadow 0.15s, border-color 0.15s; }
.bd-vote:hover { border-color: #C9C6F4; box-shadow: 0 6px 16px rgba(55, 48, 140, 0.1); }
.bd-vote img { width: 52px; height: 52px; }
.bd-vote b { margin-top: 6px; font-size: 22px; font-weight: 700; color: var(--bd-ink); line-height: 1.2; }
.bd-vote span { font-size: 12px; color: var(--bd-sub); }
.bd-vote em { margin-top: 8px; font-style: normal; font-size: 13px; color: var(--bd-brand-ink); font-weight: 700; }

/* 目录 */
.bd-latest, .bd-page a.bd-latest { margin-top: 14px; display: flex; align-items: center; gap: 12px; background: #F7F6FE; border-radius: 12px; padding: 12px 16px; color: var(--bd-ink); }
.bd-latest .bd-new { font-size: 12px; color: #FFFFFF; background: var(--bd-brand); border-radius: 4px; padding: 1px 6px; flex: none; }
.bd-latest strong { font-size: 15px; min-width: 0; }
.bd-latest .bd-pay { font-size: 11px; color: #9A6514; background: #FFF6E5; border-radius: 4px; padding: 1px 6px; flex: none; }
.bd-latest time { margin-left: auto; font-size: 12px; color: var(--bd-mute); flex: none; }
.bd-chaps { margin-top: 12px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 10px; }
.bd-chap, .bd-page a.bd-chap { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 12px; border-radius: 10px; border: 1px solid #F0EFF6; color: var(--bd-ink); min-width: 0; }
.bd-chap:hover { background: var(--bd-brand-soft); }
.bd-chap .bd-ellipsis { flex: 1; min-width: 0; font-size: 14px; }
.bd-chap img { flex: none; }
.bd-chap small { flex: none; font-size: 12px; color: var(--bd-mute); }
.bd-empty { padding: 18px 0 6px; color: var(--bd-mute); font-size: 14px; text-align: center; }

/* 书评 */
.bd-tabs { display: flex; background: #F2F1F9; border-radius: 10px; padding: 3px; }
.bd-tabs button { border: 0; background: transparent; color: #4A475C; border-radius: 8px; padding: 6px 14px; font-size: 13px; }
.bd-tabs button.bd-on { background: #FFFFFF; color: var(--bd-brand-ink); font-weight: 700; box-shadow: 0 1px 3px rgba(31, 29, 58, 0.12); }
.bd-composer { margin-top: 14px; border: 1px solid #E3E1F2; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.bd-composer textarea { border: 0; outline: 0; resize: vertical; min-height: 60px; width: 100%; font-size: 14px; font-family: inherit; color: var(--bd-ink); }
.bd-composer-foot { display: flex; align-items: center; gap: 10px; }
.bd-composer-foot > span { font-size: 13px; color: var(--bd-sub); }
/* 读者印象（App 同款接口） */
.bd-effect { margin-top: 14px; padding: 14px 16px; border-radius: 12px; background: #F8F7FE; }
.bd-effect-head { display: flex; align-items: baseline; gap: 10px; }
.bd-effect-head b { font-size: 14px; color: var(--bd-ink); }
.bd-effect-head span { font-size: 12px; color: var(--bd-mute); }
.bd-effect-bar { margin-top: 10px; display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: #ECEAF6; }
.bd-effect-bar i { flex: none; height: 100%; min-width: 2px; }
.bd-effect-tags { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; }
.bd-effect-tag { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 13px; background: #FFFFFF; border: 1px solid #E6E4F2; font-size: 12px; color: #4A4760; }
.bd-effect-tag i { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.bd-effect-tag em { font-style: normal; color: var(--bd-mute); }
.bd-effect-mini { margin-top: 8px; height: 22px; padding: 0 8px; background: #F6F5FC; border-color: transparent; }
.bd-effect-pick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-top: 10px; border-top: 1px dashed #E6E4F2; }
.bd-effect-pick > span { font-size: 13px; color: var(--bd-sub); margin-right: 4px; }
.bd-effect-pick button { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border-radius: 13px; border: 1px solid #E6E4F2; background: #FFFFFF; font-size: 12px; color: #4A4760; cursor: pointer; }
.bd-effect-pick button i { width: 8px; height: 8px; border-radius: 50%; }
.bd-effect-pick button:hover { border-color: #CFCCE6; }
.bd-effect-pick button.bd-on { color: var(--bd-ink); font-weight: 700; }
.bd-btn-sm { margin-left: auto; background: var(--bd-brand); color: #FFFFFF; border: 0; border-radius: 18px; height: 36px; padding: 0 20px; font-size: 14px; }
.bd-btn-sm:hover { background: var(--bd-brand-hover); }
.bd-cmt { display: flex; gap: 12px; padding: 16px 0; border-bottom: 1px solid #F2F1F8; }
.bd-cmt:last-child { border-bottom: 0; }
/* 头像 40；有头像框时框宽 66（同作者卡 90:150 的比例），中心对准头像，左右上留出框的位置 */
.bd-cmt-avbox, .bd-page a.bd-cmt-avbox { flex: none; position: relative; width: 40px; height: 40px; display: block; }
.bd-cmt-avbox, .bd-page a.bd-cmt-avbox { margin: 0 6px; }
.bd-page a.bd-cmt-avbox.bd-has-lace { margin-top: 10px; }
.bd-cmt-av { display: block; width: 40px; height: 40px; border-radius: 20px; object-fit: cover; background: #E9E7F8; box-shadow: 0 0 0 1px rgba(31, 29, 58, 0.10); }
.bd-cmt-lace { position: absolute; left: 50%; top: 50%; width: 66px; height: auto; transform: translate(-50%, -50%); pointer-events: none; }
.bd-cmt-main { flex: 1; min-width: 0; }
.bd-cmt-meta { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--bd-mute); flex-wrap: wrap; }
.bd-cmt-meta .bd-name { color: var(--bd-ink); font-size: 14px; font-weight: 700; }
.bd-cmt.reply-notice .bd-name { color: #4C22D6; }
.bd-page .bd-cmt-meta a.bd-name-color { color: #E5484D; }
/* 全订：沿用旧版粉色气泡底图 full_order.png（118×52，左侧带小尖角） */
.bd-full { display: inline-block; width: 42px; height: 19px; line-height: 19px; padding-left: 3px; text-align: center; font-size: 12px; color: #FFFFFF; background: url(../../img/book/info/full_order.png) no-repeat center / 100% 100%; }
/* 作者本人的评论：名字后紫色「作者」标 + 整条浅紫底 */
.bd-by-author { display: inline-flex; align-items: center; height: 18px; padding: 0 7px; border-radius: 9px; background: var(--bd-brand); color: #FFFFFF; font-size: 11px; font-weight: 700; letter-spacing: 1px; line-height: 1; }
.bd-by-author-sm { height: 16px; padding: 0 6px; font-size: 10px; margin-left: 6px; vertical-align: 1px; }
.bd-cmt.bd-cmt-by-author { padding-left: 10px; padding-right: 12px; background: linear-gradient(90deg, #F5F4FF 0%, rgba(245, 244, 255, 0) 100%); border-radius: 12px; box-shadow: inset 3px 0 0 var(--bd-brand); }
.bd-full-sm { width: 38px; height: 17px; line-height: 17px; font-size: 11px; margin-left: 6px; vertical-align: 1px; }
.bd-cmt-meta .bd-chapname { color: var(--bd-brand-ink); background: var(--bd-brand-soft); border-radius: 4px; padding: 0 6px; font-size: 12px; }
.bd-cmt-meta .bd-grade { color: #9A6514; }
.bd-cmt-ops { margin-left: auto; display: flex; gap: 14px; }
.bd-cmt-ops span { cursor: pointer; font-size: 12px; color: var(--bd-mute); }
.bd-cmt-ops span:hover { color: var(--bd-brand-ink); }
.bd-cmt-ops .bd-danger:hover { color: #C0392B; }
.bd-cmt-text { margin-top: 8px; font-size: 14px; color: #3A3850; line-height: 1.7; white-space: pre-wrap; word-break: break-all; cursor: pointer; }
.bd-cmt-text.relpyTextHide { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; }
/* 评论图片：九宫格缩略图，单张时放大一些，点开看原图 */
.bd-cmt-imgs { margin-top: 10px; display: grid; grid-template-columns: repeat(3, 110px); gap: 8px; }
.bd-cmt-imgs a { display: block; width: 110px; height: 110px; border-radius: 8px; overflow: hidden; background: #F2F1F9; }
.bd-cmt-imgs img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.bd-cmt-imgs a:hover img { transform: scale(1.04); }
.bd-cmt-imgs.bd-one { grid-template-columns: 220px; }
.bd-cmt-imgs.bd-one a { width: 220px; height: auto; max-height: 260px; }
.bd-cmt-imgs.bd-one img { height: auto; max-height: 260px; }
.bd-top-tag { display: inline-block; font-size: 12px; color: #FFFFFF; background: var(--bd-brand); border-radius: 3px; padding: 0 5px; margin-right: 4px; }
.bd-good { color: var(--bd-brand-ink); margin-right: 2px; }
.bd-reply-box { margin-top: 12px; border: 1px solid #E3E1F2; border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.bd-reply-box textarea { border: 0; outline: 0; resize: vertical; min-height: 50px; width: 100%; font-size: 14px; font-family: inherit; }
.bd-replies { margin-top: 10px; background: #F7F6FE; border-radius: 10px; padding: 10px 14px; font-size: 13px; color: #3A3850; line-height: 1.7; }
.bd-replies p { margin: 0; }
.bd-replies .bd-who { color: var(--bd-brand-ink); font-weight: 700; }
.bd-replies time { display: block; font-size: 12px; color: var(--bd-mute); margin-bottom: 6px; }
.bd-replies .bd-link { display: block; text-align: right; }
.bd-pager { margin-top: 18px; display: flex; justify-content: center; }
.bd-pager .el-pagination.is-background .el-pager li:not(.disabled).active { background-color: var(--bd-brand); color: #FFFFFF; }
.bd-pager .el-pagination.is-background .el-pager li:not(.disabled):not(.active):hover { color: var(--bd-brand-ink); }

/* 右栏 */
.bd-author { padding: 26px 22px 22px; }
.bd-author-top, .bd-page a.bd-author-top { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--bd-ink); }
/* 头像 90 圆形；头像框 150 叠在外面居中；徽章 84×39 压在头像下沿 */
/* 头像框素材不是正方形（如 208×274），同旧版只定宽 150、高度按比例，中心对准头像中心 */
.bd-avatar { position: relative; width: 150px; height: 150px; margin: 18px 0 14px; }
/* 头像：白圈 + 发丝描边 + 浅紫投影，白底头像也能和卡片背景分开；border-box 保证外径仍是 90，头像框对位不变 */
.bd-avatar > img.bd-avatar-img { position: absolute; left: 30px; top: 30px; width: 90px; height: 90px; box-sizing: border-box; border: 3px solid #FFFFFF; border-radius: 45px; object-fit: cover; background: #E9E7F8; box-shadow: 0 0 0 1px #DEDBF2, 0 8px 20px rgba(91, 87, 232, 0.22); }
.bd-avatar-frame { position: absolute; left: 0; top: 50%; width: 150px; height: auto; transform: translateY(-50%); pointer-events: none; }
.bd-avatar-mark { position: absolute; left: 33px; top: 112px; width: 84px; height: 39px; }
.bd-author-name { margin-top: 6px; font-size: 18px; font-weight: 700; }
.bd-author-stats { margin-top: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); text-align: center; background: #F7F6FE; border-radius: 12px; padding: 12px 0; }
.bd-author-stats img { width: 24px; height: 24px; }
.bd-author-stats b { display: block; font-size: 18px; font-weight: 700; }
.bd-author-stats span { display: block; font-size: 12px; color: var(--bd-sub); }
.bd-notice { margin-top: 16px; }
.bd-notice div { font-size: 13px; color: var(--bd-sub); margin-bottom: 6px; }
.bd-notice p { margin: 0; font-size: 14px; line-height: 1.75; color: #3A3850; word-wrap: break-word; white-space: pre-line; }

/* 听书：唱片封套 + 黑胶，悬停时唱片滑出并转动 */
.bd-sound, .bd-page a.bd-sound { display: flex; gap: 12px; align-items: center; margin-top: 12px; padding: 10px 12px 10px 10px; border-radius: 14px; border: 1px solid #F0EFF8; background: linear-gradient(120deg, #F4F3FE 0%, #FFFFFF 70%); color: var(--bd-ink); }
.bd-sound:hover { border-color: #DCD9F8; box-shadow: 0 6px 16px rgba(55, 48, 140, 0.08); }
.bd-vinyl { position: relative; flex: none; width: 100px; height: 72px; }
.bd-sleeve { position: absolute; left: 0; top: 0; z-index: 1; width: 72px; height: 72px; border-radius: 6px; object-fit: cover; box-shadow: 0 6px 14px rgba(31, 29, 58, 0.22); }
.bd-disc { position: absolute; left: 32px; top: 5px; width: 62px; height: 62px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: repeating-radial-gradient(circle at center, #1C1B22 0, #1C1B22 1.5px, #2C2A35 1.5px, #2C2A35 3px); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); transition: left 0.4s ease; }
.bd-disc::before { content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; border-radius: 50%; background: conic-gradient(from 30deg, rgba(255, 255, 255, 0) 0deg, rgba(255, 255, 255, 0.14) 30deg, rgba(255, 255, 255, 0) 70deg, rgba(255, 255, 255, 0) 210deg, rgba(255, 255, 255, 0.1) 240deg, rgba(255, 255, 255, 0) 280deg); }
.bd-disc::after { content: ""; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; border-radius: 50%; background: #F4F3FE; }
.bd-disc-label { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; border: 2px solid #111; }
.bd-sound:hover .bd-disc { left: 38px; animation: bd-spin 4s linear infinite; }
@keyframes bd-spin { to { transform: rotate(360deg); } }
.bd-sound-info { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.bd-sound-info b { font-size: 15px; }
.bd-sound-info span { font-size: 12px; color: var(--bd-mute); }
.bd-sound:hover b { color: var(--bd-brand-ink); }
.bd-sound-play { position: absolute; left: 6px; bottom: 6px; z-index: 2; width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid #FFFFFF; background: var(--bd-brand); box-shadow: 0 4px 10px rgba(126, 124, 251, 0.35); }
.bd-sound-play::after { content: ""; position: absolute; left: 8px; top: 5.5px; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #FFFFFF; }
.bd-sound:hover .bd-sound-play { background: var(--bd-brand-hover); }

/* 同作者的其他作品 */
.bd-other, .bd-page a.bd-other { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid #F2F1F8; color: var(--bd-ink); }
.bd-other:last-child { border-bottom: 0; }
.bd-other img { width: 60px; height: 80px; border-radius: 6px; object-fit: cover; flex: none; background: #E9E7F8; box-shadow: 0 4px 10px rgba(55, 48, 140, 0.14); }
.bd-other-info { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 5px; }
.bd-other-info b { font-size: 15px; }
.bd-other-info span { font-size: 12px; color: var(--bd-mute); }
.bd-other:hover b { color: var(--bd-brand-ink); }

.bd-books { display: flex; gap: 10px; margin-top: 12px; }
.bd-book, .bd-page a.bd-book { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; color: var(--bd-ink); }
.bd-book img { width: 100%; aspect-ratio: 3 / 4; border-radius: 6px; object-fit: cover; box-shadow: 0 4px 10px rgba(55, 48, 140, 0.14); background: #E9E7F8; }
.bd-book span { font-size: 13px; }
.bd-book:hover span { color: var(--bd-brand-ink); }

.bd-fans-tabs { display: flex; gap: 14px; font-size: 13px; margin-left: auto; }
.bd-fans-tabs button { border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--bd-sub); padding: 2px 0; }
.bd-fans-tabs button.bd-on { border-bottom-color: var(--bd-brand); color: var(--bd-brand-ink); font-weight: 700; }
.bd-fan { display: flex; align-items: center; gap: 10px; height: 42px; border-bottom: 1px solid #F4F3F8; font-size: 13px; }
.bd-fan:last-child { border-bottom: 0; }
.bd-fan .bd-ellipsis { flex: 1; min-width: 0; color: var(--bd-ink); }
.bd-fan .bd-gift { color: #9A6514; font-weight: 700; flex: none; }
.bd-fan .bd-rank { flex: none; width: 20px; height: 20px; border-radius: 4px; background: var(--bd-brand-soft); color: var(--bd-brand-ink); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.bd-fan .bd-money { color: var(--bd-sub); flex: none; }