/* ============================================================
   css/panels/panels-books.css — 书架 / 阅读器 / 批注 / 铃铛
   风格：韩系法式清新 · 花 · 高级感 · 简约
   ============================================================ */

/* ---- 书架面板（flex 列：返回条贴顶、内容区自己滚动，消掉顶部缝隙） ---- */
#nest-sub-bookshelf { padding:0; overflow:hidden; display:none; flex:1; }
#nest-sub-bookshelf.active { display:flex; flex-direction:column; overflow:hidden; }
#nest-sub-bookshelf .bs-scroll { flex:1; min-height:0; overflow-y:auto; padding:12px 8px 24px; }

/* 书架顶部标题栏 */
.bookshelf-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:6px 10px 14px;
}
.bookshelf-header-left { display:flex; align-items:center; gap:9px; }
.bookshelf-header-title {
    font-family:var(--font-decorative); font-size:24px; font-weight:500;
    font-style:italic; color:var(--text-secondary); letter-spacing:0.5px;
}
.bookshelf-add-btn {
    display:flex; align-items:center; gap:5px;
    padding:8px 15px; border-radius:20px; border:1px solid var(--accent-rose);
    background:var(--accent-rose); color:#fff; cursor:pointer;
    font-family:inherit; font-size:13px; font-weight:500; letter-spacing:0.5px;
    box-shadow:0 3px 10px rgba(201,168,168,0.28);
    transition:background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.bookshelf-add-btn:hover { background:var(--rose-dark, #A88080); transform:translateY(-1px); box-shadow:0 5px 16px rgba(201,168,168,0.36); }
.bookshelf-add-btn:active { transform:scale(0.96); }

/* 阅读设置分区卡（自主阅读 / 立即回复） */
.bookshelf-settings-card {
    margin:0 8px 10px; padding:4px;
    background:var(--surface-solid); border:1px solid var(--border);
    border-radius:14px; box-shadow:var(--shadow-xs);
    overflow:hidden;
}
.bs-set-row {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    padding:12px 14px;
}
.bs-set-row + .bs-set-row { border-top:1px solid rgba(196,168,106,0.12); }
.bs-set-main { flex:1; min-width:0; }
.bs-set-label { font-size:14px; font-weight:600; color:var(--text-primary); letter-spacing:0.3px; }
.bs-set-desc { font-size:11px; color:var(--text-muted); margin-top:3px; line-height:1.5; }
.bs-set-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.bs-set-help {
    width:20px; height:20px; border-radius:50%; border:1px solid var(--border);
    background:transparent; cursor:pointer; display:flex;
    align-items:center; justify-content:center; color:var(--text-muted); padding:0;
    transition:color 0.2s ease, border-color 0.2s ease;
}
.bs-set-help:hover { color:var(--accent); border-color:var(--accent); }

/* 书架头部右侧 设置入口（收纳 自主阅读/立即回复/使用指南）+ 独立「?」帮助 */
.bookshelf-header-actions {
    display:flex; align-items:center; gap:10px;
}
.bookshelf-help-btn {
    width:30px; height:30px; border-radius:50%;
    border:1px solid var(--border); background:var(--surface-solid);
    display:flex; align-items:center; justify-content:center;
    color:var(--text-secondary); cursor:pointer; padding:0;
    transition:color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.bookshelf-help-btn:hover { color:var(--accent); border-color:var(--accent); transform:rotate(10deg); }
.bookshelf-settings-btn {
    width:30px; height:30px; border-radius:50%;
    border:1px solid var(--border); background:var(--surface-solid);
    display:flex; align-items:center; justify-content:center;
    color:var(--text-secondary); cursor:pointer; padding:0;
    transition:color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.bookshelf-settings-btn:hover { color:var(--accent); border-color:var(--accent); transform:rotate(20deg); }

/* 书架设置面板（浮层，防闪：基类透明隐藏 + .show 一次淡入动画） */
.bookshelf-settings-overlay {
    position:fixed; inset:0; z-index:1680;
    background:rgba(30,25,20,0.35); backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    display:flex; align-items:center; justify-content:center; padding:24px;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity 0.25s ease, visibility 0s 0.25s;
}
.bookshelf-settings-overlay.show {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity 0.25s ease, visibility 0s 0s;
}
.bookshelf-settings-panel {
    width:100%; max-width:420px; max-height:80vh; overflow-y:auto;
    background:var(--surface-solid); border:1px solid var(--border);
    border-radius:18px; box-shadow:var(--shadow-lg);
    display:flex; flex-direction:column; padding-bottom:6px;
}
.bookshelf-settings-overlay.show .bookshelf-settings-panel {
    animation:bs-set-pop 0.28s cubic-bezier(0.34,1.3,0.64,1) forwards;
}
@keyframes bs-set-pop {
    from { opacity:0; transform:translateY(10px) scale(0.98); }
    to { opacity:1; transform:translateY(0) scale(1); }
}
.bookshelf-settings-header {
    display:flex; align-items:center; padding:16px 18px 10px; flex-shrink:0;
    border-bottom:1px solid var(--border);
}
.bookshelf-settings-title { font-size:16px; font-weight:600; color:var(--text-primary); }
.bookshelf-settings-title-en {
    font-size:10px; color:var(--text-muted); margin-left:8px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic;
    letter-spacing:1px; margin-top:2px;
}
.bookshelf-settings-close {
    margin-left:auto; background:none; border:none; cursor:pointer;
    color:var(--text-muted); padding:4px; border-radius:50%;
    display:flex; transition:all 0.2s ease;
}
.bookshelf-settings-close:hover { color:var(--text-primary); background:var(--accent-light); }
.bookshelf-settings-body { padding:6px 0; }
.bs-guide-btn {
    display:flex; align-items:center; justify-content:center; gap:7px;
    margin:8px 14px 10px; padding:11px; width:calc(100% - 28px);
    border-radius:12px; border:1px dashed var(--accent);
    background:var(--surface-solid); color:var(--accent);
    font-family:inherit; font-size:13px; letter-spacing:0.5px; cursor:pointer;
    transition:background 0.2s ease, border-color 0.2s ease;
}
.bs-guide-btn:hover { background:var(--accent-light); border-color:var(--accent); }

/* 阅读日历下方的「添加书」入口 */
.bookshelf-add-row {
    display:flex; align-items:center; justify-content:center; gap:7px;
    margin:2px 9px 8px; padding:12px;
    border-radius:12px; border:1px solid var(--border);
    background:var(--surface-solid); color:var(--text-secondary);
    font-family:inherit; font-size:13px; letter-spacing:0.5px; cursor:pointer;
    box-shadow:var(--shadow-xs);
    transition:color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.bookshelf-add-row:hover {
    color:var(--accent); border-color:var(--accent);
    transform:translateY(-1px); box-shadow:var(--shadow-sm);
}

.bookshelf-grid {
    display:flex; flex-direction:column; gap:0; padding-bottom:32px;
    /* 书架整体背景 — 深木色 */
    background:linear-gradient(180deg, rgba(140,110,70,0.06) 0%, rgba(120,90,55,0.04) 100%);
    border-radius:8px; min-height:100%;
}
/* 每一排书架层 */
.bookshelf-row {
    display:grid; grid-template-columns:repeat(3, 1fr); gap:10px;
    padding:14px 9px 10px; position:relative;
    /* 层板木纹 */
    border-bottom:6px solid rgba(150,120,85,0.22);
    box-shadow:0 3px 0 rgba(140,110,75,0.12), 0 7px 0 rgba(130,100,65,0.06);
    margin-bottom:2px;
}
.bookshelf-row:last-child { border-bottom:none; box-shadow:none; }

@media (max-width:380px) {
    .bookshelf-row { grid-template-columns:repeat(2, 1fr); }
}

/* 空状态 */
.bookshelf-empty { text-align:center; padding:48px 20px; color:var(--text-muted); }
.bookshelf-empty-icon { margin-bottom:16px; display:flex; align-items:center; justify-content:center; }
.bookshelf-empty-icon svg { width:72px; height:72px; opacity:0.7; }
.bookshelf-empty .empty-title {
    font-family:var(--font-decorative); font-size:26px; font-weight:500; font-style:italic;
    color:var(--text-secondary); letter-spacing:0.5px; margin-bottom:8px;
}
.bookshelf-empty p { margin:4px 0; font-size:13px; line-height:1.8; }
.bookshelf-empty .empty-subtitle { font-size:12px; letter-spacing:0.3px; color:var(--text-muted); }
.bookshelf-upload-btn {
    margin-top:20px; padding:10px 28px; border:1.5px solid var(--accent); border-radius:24px;
    background:transparent; color:var(--accent); font-size:13px; font-weight:500; cursor:pointer;
    font-family:inherit; letter-spacing:0.5px; transition:all 0.3s ease;
}
.bookshelf-upload-btn:hover { background:var(--accent); color:#fff; transform:translateY(-1px); box-shadow:0 4px 16px rgba(201,184,160,0.25); }

/* ---- 书卡（站立书本风格）---- */
.book-card {
    border-radius:6px; overflow:visible; cursor:pointer;
    transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
    background:transparent; box-shadow:none;
    -webkit-touch-callout:none; -webkit-user-select:none; user-select:none;
    -webkit-tap-highlight-color:transparent;
}
.book-card:hover { transform:translateY(-6px); }
.book-card:active { transform:scale(0.96); }

.book-cover {
    height:200px; display:flex; align-items:center; justify-content:center;
    position:relative; overflow:hidden; border-radius:5px 6px 6px 5px;
    box-shadow:0 5px 18px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.06),
               3px 0 10px rgba(0,0,0,0.08), inset -4px 0 10px rgba(0,0,0,0.08);
    transition:box-shadow 0.3s ease;
}
/* 自定义封面图（盖在渐变底色上；加载失败自动回退本地缓存/底色） */
.book-cover-img {
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; z-index:1; pointer-events:none;
}
/* 书脊线（精装书效果）*/
.book-cover::before {
    content:''; position:absolute; left:3px; top:3%; width:2.5px; height:94%;
    background:rgba(255,255,255,0.12); border-radius:1px; z-index:2; pointer-events:none;
}
/* 光影层（只在 ::after 上保留，不被图案干扰） */
.book-cover::after {
    content:''; position:absolute; inset:0; pointer-events:none; z-index:2;
    background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 8%, transparent 92%, rgba(255,255,255,0.08) 100%),
                linear-gradient(180deg, rgba(255,255,255,0.18) 0%, transparent 40%, rgba(0,0,0,0.06) 100%);
    border-radius:5px 6px 6px 5px;
}

/* ===== 图案独立层（div.book-cover-pattern）===== */
.book-cover-pattern {
    position:absolute; inset:0; pointer-events:none; z-index:1;
    border-radius:5px 6px 6px 5px;
}

/* ---- 12种封面图案 ---- */
/* 0 — 细竖条纹（精装布纹） */
.cover-pattern-0 { background: repeating-linear-gradient(90deg, transparent, transparent 6px, rgba(255,255,255,0.22) 6px, rgba(255,255,255,0.22) 7px); }
/* 1 — 十字星芒 */
.cover-pattern-1 { background:
    radial-gradient(circle at 18% 28%, rgba(255,255,255,0.3) 0px, transparent 3px),
    radial-gradient(circle at 55% 22%, rgba(255,255,255,0.25) 0px, transparent 4px),
    radial-gradient(circle at 38% 58%, rgba(255,255,255,0.3) 0px, transparent 3px),
    radial-gradient(circle at 72% 52%, rgba(255,255,255,0.22) 0px, transparent 4px),
    radial-gradient(circle at 22% 78%, rgba(255,255,255,0.25) 0px, transparent 3px),
    radial-gradient(circle at 62% 82%, rgba(255,255,255,0.28) 0px, transparent 4px); }
/* 2 — 45°斜纹（法式亚麻） */
.cover-pattern-2 { background: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255,255,255,0.18) 5px, rgba(255,255,255,0.18) 6px); }
/* 3 — 大波点 */
.cover-pattern-3 { background:
    radial-gradient(circle at 25% 20%, rgba(255,255,255,0.2) 14px, transparent 14px),
    radial-gradient(circle at 72% 38%, rgba(255,255,255,0.18) 16px, transparent 16px),
    radial-gradient(circle at 48% 68%, rgba(255,255,255,0.2) 12px, transparent 12px),
    radial-gradient(circle at 32% 88%, rgba(255,255,255,0.16) 15px, transparent 15px); }
/* 4 — 交叉网格（格纹纸） */
.cover-pattern-4 { background:
    repeating-linear-gradient(0deg, transparent, transparent 12px, rgba(255,255,255,0.14) 12px, rgba(255,255,255,0.14) 13px),
    repeating-linear-gradient(90deg, transparent, transparent 12px, rgba(255,255,255,0.14) 12px, rgba(255,255,255,0.14) 13px); }
/* 5 — 横条纹 */
.cover-pattern-5 { background: repeating-linear-gradient(0deg, transparent, transparent 8px, rgba(255,255,255,0.2) 8px, rgba(255,255,255,0.2) 9px); }
/* 6 — 菱形格 */
.cover-pattern-6 { background:
    repeating-linear-gradient(45deg, transparent, transparent 9px, rgba(255,255,255,0.14) 9px, rgba(255,255,255,0.14) 10px),
    repeating-linear-gradient(-45deg, transparent, transparent 9px, rgba(255,255,255,0.14) 9px, rgba(255,255,255,0.14) 10px); }
/* 7 — 碎花点阵（均匀密点） */
.cover-pattern-7 { background: radial-gradient(circle, rgba(255,255,255,0.25) 1.2px, transparent 1.2px); background-size: 10px 10px; }
/* 8 — 人字纹（呢绒面料） */
.cover-pattern-8 { background:
    repeating-linear-gradient(45deg, transparent, transparent 4px, rgba(255,255,255,0.14) 4px, rgba(255,255,255,0.14) 5px),
    repeating-linear-gradient(-45deg, transparent, transparent 4px, rgba(255,255,255,0.14) 4px, rgba(255,255,255,0.14) 5px),
    repeating-linear-gradient(0deg, transparent, transparent 26px, rgba(255,255,255,0.08) 26px, rgba(255,255,255,0.08) 27px); }
/* 9 — 层叠半圆弧线 */
.cover-pattern-9 { background:
    radial-gradient(ellipse at 50% 110%, rgba(255,255,255,0.18) 0%, transparent 55%),
    radial-gradient(ellipse at 50% 75%, rgba(255,255,255,0.14) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 40%, rgba(255,255,255,0.12) 0%, transparent 35%); }
/* 10 — 放射光线（sunburst） */
.cover-pattern-10 { background: conic-gradient(from 225deg at 12% 18%, transparent 0deg, rgba(255,255,255,0.18) 2.5deg, transparent 5deg, transparent 22deg, rgba(255,255,255,0.14) 24.5deg, transparent 27deg, transparent 55deg, rgba(255,255,255,0.18) 57.5deg, transparent 60deg, transparent 88deg, rgba(255,255,255,0.14) 90.5deg, transparent 93deg, transparent 130deg, rgba(255,255,255,0.18) 132.5deg, transparent 135deg, transparent 175deg, rgba(255,255,255,0.14) 177.5deg, transparent 180deg, transparent 215deg, rgba(255,255,255,0.18) 217.5deg, transparent 220deg, transparent 270deg, rgba(255,255,255,0.14) 272.5deg, transparent 275deg, transparent 330deg, rgba(255,255,255,0.18) 332.5deg, transparent 335deg); }
/* 11 — 圆环涟漪 */
.cover-pattern-11 { background:
    radial-gradient(circle at 50% 45%, transparent 28px, rgba(255,255,255,0.18) 28px, rgba(255,255,255,0.18) 29px, transparent 29px),
    radial-gradient(circle at 50% 45%, transparent 52px, rgba(255,255,255,0.14) 52px, rgba(255,255,255,0.14) 53px, transparent 53px),
    radial-gradient(circle at 50% 45%, transparent 76px, rgba(255,255,255,0.12) 76px, rgba(255,255,255,0.12) 77px, transparent 77px),
    radial-gradient(circle at 50% 45%, transparent 100px, rgba(255,255,255,0.10) 100px, rgba(255,255,255,0.10) 101px, transparent 101px); }
.book-card:hover .book-cover { box-shadow:0 8px 28px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06); }

/* 处理中的书 - 呼吸光晕 */
.book-card.processing .book-cover {
    animation:cover-breathe 2.5s ease-in-out infinite;
}
@keyframes cover-breathe {
    0%,100% { box-shadow:0 5px 18px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.06), 3px 0 10px rgba(0,0,0,0.08), inset -4px 0 10px rgba(0,0,0,0.08); }
    50% { box-shadow:0 5px 20px rgba(201,184,160,0.22), 0 0 0 4px rgba(201,184,160,0.10), 3px 0 10px rgba(0,0,0,0.08), inset -4px 0 10px rgba(0,0,0,0.08); }
}

.book-cover-title {
    font-family:var(--font-decorative); font-size:15px; font-weight:600; font-style:italic;
    color:#fff; text-align:center; padding:16px; line-height:1.35;
    text-shadow:0 2px 8px rgba(0,0,0,0.15);
    display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden;
    position:relative; z-index:1;
}

.book-info { padding:10px 4px 6px; }
.book-title { font-size:13px; font-weight:600; color:var(--text-primary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:0.2px; }
.book-author { font-size:11px; color:var(--text-muted); margin-top:2px; font-style:italic; font-family:var(--font-decorative); }
.book-meta { display:flex; align-items:center; justify-content:space-between; margin-top:6px; font-size:11px; color:var(--text-muted); }
.book-meta .book-ann-count { background:var(--accent-rose-light); color:var(--accent-rose); padding:2px 8px; border-radius:10px; font-weight:500; font-size:10px; letter-spacing:0.2px; }

/* 进度条 - 极细花藤风格 */
.book-progress-track { display:none; }
.book-progress-my { display:none; }
.book-progress-ai-dot {
    position:absolute; top:-3px; width:9px; height:9px; border-radius:50%;
    background:var(--accent-rose); border:2px solid #fff;
    box-shadow:0 1px 4px rgba(201,168,168,0.35);
    transform:translateX(-50%); transition:left 0.5s cubic-bezier(0.34,1.56,0.64,1);
}

/* ---- 3D 铃铛 ---- */
.book-bell { position:absolute; top:10px; right:10px; width:32px; height:36px; cursor:pointer; z-index:5; display:flex; align-items:flex-start; justify-content:center; }
.book-bell-inner { width:24px; height:32px; position:relative; transform-origin:top center; transition:transform 0.2s ease; }
.book-bell-inner svg { width:100%; height:100%; display:block; }
.book-bell:hover .book-bell-inner { animation:bell-swing 0.7s cubic-bezier(0.25,0.1,0.25,1); }
.book-bell.shaking .book-bell-inner { animation:bell-swing 0.7s cubic-bezier(0.25,0.1,0.25,1) infinite; }

@keyframes bell-swing {
    0%   { transform:rotate(0deg); }
    10%  { transform:rotate(22deg); }
    24%  { transform:rotate(-17deg); }
    38%  { transform:rotate(12deg); }
    52%  { transform:rotate(-7deg); }
    64%  { transform:rotate(4deg); }
    76%  { transform:rotate(-2deg); }
    88%  { transform:rotate(1deg); }
    100% { transform:rotate(0deg); }
}

/* 铃铛光晕脉冲 */
.book-bell.shaking::after {
    content:''; position:absolute; top:2px; right:2px; width:28px; height:28px;
    border-radius:50%; background:rgba(180,190,210,0.25);
    animation:bell-glow 0.7s ease-out infinite;
    pointer-events:none; z-index:-1;
}
@keyframes bell-glow {
    0%   { transform:scale(0.8); opacity:0; }
    50%  { transform:scale(1.6); opacity:0.5; }
    100% { transform:scale(2.2); opacity:0; }
}

/* ---- 阅读器 Overlay（手机竖屏书页）---- */
/* ★ 2026-10 甲方实锤（点已经加过的书 → 阅读器「出现在书架界面的下层，要退出书架才看得到」）：
   书架是 .nest-sub-panel.fullscreen（z-index:1500），这里原来是 200 → 整页被书架盖住。
   抬到 1550：刚好盖过书架，又**低于**书模块里那一批已修好的浮层（便签详情/摇铃确认 1560 起），
   所以阅读器内部那些浮层一个都不用动。 */
.book-reader-overlay { position:fixed; top:0; bottom:0; left:0; right:0; max-width:480px; margin:0 auto; padding-top:var(--safe-top); z-index:1550; background:#e8e4dd; display:none; flex-direction:column; align-items:center; }
.book-reader-overlay.open { display:flex; }

.br-header {
    display:flex; align-items:center; height:var(--header-height); padding:0 8px;
    border-bottom:1px solid rgba(0,0,0,0.06); background:rgba(255,255,255,0.85);
    flex-shrink:0; gap:4px; width:100%; max-width:480px;
    backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    z-index:5; overflow-x:auto; -webkit-overflow-scrolling:touch;
}
.br-header::-webkit-scrollbar { display:none; }
.br-back-btn {
    background:none; border:none; cursor:pointer; color:var(--text-primary); padding:6px;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    transition:transform 0.2s ease;
}
.br-back-btn svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.5; stroke-linecap:round; }
.br-back-btn:hover { transform:translateX(-2px); }
.br-title {
    flex:1; font-weight:600; font-size:14px; text-align:center;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:0.2px;
    font-family:var(--font-decorative); font-style:italic;
}

/* 自定义章节导航器 */
.br-chapter-nav {
    display:flex; align-items:center; gap:4px; flex-shrink:0;
}
.br-chapter-btn {
    background:none; border:1px solid var(--border); border-radius:50%;
    width:32px; height:32px; cursor:pointer; display:flex; align-items:center; justify-content:center;
    color:var(--text-secondary); transition:all 0.2s ease;
    flex-shrink:0;
}
.br-chapter-btn:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-light); }
.br-chapter-btn:active { transform:scale(0.92); }
.br-chapter-btn svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; }
.br-chapter-label {
    font-size:11px; color:var(--text-secondary); font-weight:500; min-width:55px; text-align:center;
    cursor:pointer; padding:4px 2px; border-radius:6px; transition:background 0.15s ease;
    font-family:var(--font-decorative); letter-spacing:0.3px;
}
.br-chapter-label:hover { background:var(--accent-light); }
/* 隐藏旧的 system select */
.br-chapter-select { display:none; }

/* ---- 阅读器工具栏按钮（便签模式/书摘/字体）---- */
.br-tool-btn {
    width:32px; height:32px; border-radius:50%;
    border:1.5px solid var(--border); background:var(--surface-solid);
    cursor:pointer; display:flex; align-items:center; justify-content:center;
    color:var(--text-muted); flex-shrink:0;
    transition:all 0.2s ease; padding:0; margin-left:2px;
}
.br-tool-btn:active { transform:scale(0.9); transition:transform 0.1s ease; }
.br-tool-btn:hover { border-color:var(--accent); color:var(--accent); }
.br-tool-btn svg { display:block; }
.br-tool-btn.active { color:var(--accent-rose); border-color:var(--accent-rose); background:rgba(184,120,120,0.08); }

.br-body { flex:1; display:flex; overflow:visible; position:relative; width:100%; max-width:480px; min-height:0; }

/* 章节翻页滑动动画 */
.br-text-panel {
    flex:1; overflow-y:auto; padding:24px 10px 40px 10px;
    font-family:var(--font-reading); font-size:16px; line-height:2.6; color:#3d3228;
    transition:opacity 0.25s ease, transform 0.25s ease;
    /* 纸页质感 */
    background:#faf7f2;
    background-image:
        linear-gradient(90deg, rgba(0,0,0,0.015) 1px, transparent 1px),
        linear-gradient(rgba(0,0,0,0.012) 1px, transparent 1px);
    background-size: 100% 28px, 100% 100%;
    box-shadow:inset 0 0 60px rgba(139,119,90,0.04);
}
.br-text-panel.sliding-out { opacity:0.3; transform:translateX(-8px); }
.br-text-panel.sliding-in  { animation:slide-in-right 0.3s ease forwards; }
@keyframes slide-in-right { from{opacity:0.3;transform:translateX(8px)} to{opacity:1;transform:translateX(0)} }

/* 段落（外层 wrapper 负责定位与间距，供下嵌抽屉绝对定位锚点） */
.br-paragraph-wrap {
    position: relative;
    margin-bottom: 20px;
}
.br-paragraph {
    position:relative;
    padding:0 10px; cursor:default;
    white-space:pre-wrap; word-break:break-word;
    overflow:visible;
}
.br-paragraph .br-para-idx {
    font-size:9px; color:rgba(0,0,0,0.10); user-select:none;
    font-family:var(--font-decorative); font-style:italic;
    margin-right:4px; pointer-events:none;
}

/* ===== 段落批注小圆点（段落右侧数字标记）===== */
/* 段落位移一律由抽屉 JS 用 inline transition 驱动（常驻 class 过渡会和 inline 双驱动器撞，造成开合闪动） */
.br-paragraph { position: relative; overflow: visible; }
.br-paragraph.drawer-open { z-index: 5; }

.br-para-note-dot {
    position: absolute; right: 2px; top: 6px;
    width: 18px; height: 18px; border-radius: 50%;
    background: var(--accent-rose); color: #fff;
    font-size: 10px; font-weight: 600; line-height: 18px; text-align: center;
    opacity: 0.7; transition: opacity 0.2s ease, transform 0.2s ease;
    pointer-events: none; z-index: 1;
}
.br-paragraph.drawer-open .br-para-note-dot { opacity: 0; transform: scale(0); }

/* 段落批注背景标记 */
.br-paragraph.has-ai-ann { background: linear-gradient(180deg, transparent 0%, rgba(184,80,96,0.03) 100%); }
.br-paragraph.has-user-ann { background: linear-gradient(180deg, transparent 0%, rgba(58,90,128,0.03) 100%); }
.br-paragraph.has-both-ann { background: linear-gradient(180deg, transparent 0%, rgba(140,100,120,0.04) 100%); }

/* ===== 下嵌式抽屉 — 左滑段落从右缘抽出（主题色：与整体统一，不固定土黄）===== */
.br-note-drawer {
    position: absolute;
    top: 0; right: 0;
    width: 55%;
    height: 100%;
    min-height: 150px;
    z-index: 6;
    pointer-events: none;
    transform: translateX(100%);
    opacity: 0;
    border-radius: 12px 0 0 12px;
    background: var(--surface-solid);
    border-left: 1px solid var(--border);
    /* 内凹阴影：暗示抽屉嵌进书页、连着段落边缘 */
    box-shadow:
        inset 4px 0 12px rgba(0,0,0,0.06),
        inset 0 3px 10px rgba(0,0,0,0.05),
        inset 0 -3px 10px rgba(0,0,0,0.05),
        -2px 4px 14px var(--shadow-sm);
    overflow: hidden;
}
.br-note-drawer-inner {
    position: relative; height: 100%;
    display: flex; flex-direction: column;
    min-height: 0;
}

/* 抽屉顶部「写一张便签」入口 */
.br-note-add {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    margin: 10px 12px 4px;
    padding: 7px 10px;
    border: 1px dashed var(--accent);
    border-radius: 8px;
    background: var(--surface-solid);
    color: var(--accent);
    font-size: 12px; letter-spacing: 1px;
    cursor: pointer; flex-shrink: 0;
    transition: background 0.2s ease, border-color 0.2s ease;
}
.br-note-add:hover { background: var(--accent-light); border-color: var(--accent); }
.br-note-add svg { flex-shrink: 0; }

/* 抽屉内卡片：横向排列、微微上下交错、单张左右滑动（可纵向撑满，不裁文） */
.br-note-drawer-cards {
    display: flex; gap: 8px; overflow-x: auto; overflow-y: auto;
    scroll-snap-type: x mandatory;
    padding: 4px 12px 6px; min-height: 0;
    flex: 1; align-items: stretch;
    -webkit-overflow-scrolling: touch;
}
.br-note-drawer-cards::-webkit-scrollbar { height: 3px; }
.br-note-drawer-cards::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }

/* 空态提示：居中显示在卡片区，不贴底 */
.br-note-drawer-empty {
    margin: auto; text-align: center;
    font-size: 12px; color: var(--text-muted);
    letter-spacing: 1px; padding: 12px 0;
}

.br-note-card {
    flex: 0 0 150px; min-height: 0; height: auto;
    cursor: pointer; scroll-snap-align: center;
    transition: transform 0.2s ease; align-self: center;
}
.br-note-card:nth-child(odd)  { transform: translateY(-5px); }
.br-note-card:nth-child(even) { transform: translateY(5px); }
.br-note-card:hover { transform: translateY(-7px) !important; z-index: 20; }

.br-note-card-paper {
    position: relative;
    width: 100%; min-height: 84px;
    background: linear-gradient(176deg, var(--surface-solid) 0%, var(--bg-primary) 100%);
    border-radius: 4px 8px 8px 4px;
    border: 1px solid var(--border);
    border-top: 2px solid var(--accent-rose);
    box-shadow: var(--shadow-xs);
    padding: 10px 8px 8px;
    display: flex; flex-direction: column;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}
.br-note-card:hover .br-note-card-paper {
    box-shadow: var(--shadow-sm);
}

.br-note-card-dot {
    position: absolute; top: 5px; right: 6px;
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--accent-rose);
    animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
    0%,100% { opacity: 0.6; }
    50% { opacity: 1; }
}

.br-note-card-content {
    font-family: var(--font-handwriting); font-size: 12px; line-height: 1.5;
    color: var(--text-primary); overflow: hidden; word-break: break-word;
    display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
    margin-bottom: 4px;
}
.br-note-card-author {
    font-size: 10px; margin-top: auto; color: var(--text-muted);
}
.br-note-card-author.ai { color: var(--accent-rose); }
.br-note-card-author.user { color: var(--sage); }
/* 父便签纸内的回复子集 */
.br-note-card-replies {
    margin-top: 8px; padding-top: 7px; border-top: 1px dashed rgba(0,0,0,0.08);
    display: flex; flex-direction: column; gap: 4px;
}
.br-note-reply {
    display: flex; gap: 5px; align-items: baseline; font-size: 10px; line-height: 1.45;
}
.br-note-reply-author { flex-shrink: 0; color: var(--text-muted); }
.br-note-reply.ai .br-note-reply-author { color: var(--accent-rose); }
.br-note-reply.user .br-note-reply-author { color: var(--sage); }
.br-note-reply-content { color: var(--text-secondary); overflow: hidden; }

.br-note-card.is-reply .br-note-card-paper { border-top-color: var(--sage); opacity:0.85; }
.br-note-card.is-reply .br-note-card-content { font-size:11px; }

.br-note-drawer-hint {
    text-align: center; font-size: 10px; color: var(--text-muted);
    padding: 0 0 8px; opacity: 0.6; letter-spacing: 1px; flex-shrink: 0;
}

/* ===== 书签模式 UI ===== */
#br-bookmark-bar {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; background: var(--surface-solid);
    border-bottom: 1px solid var(--border);
    font-size: 13px; color: var(--text-primary);
    flex-shrink: 0;
}
.br-bookmark-bar-icon { display: flex; align-items: center; color: var(--accent-rose); flex-shrink: 0; }
.br-bookmark-bar-text { flex: 1; font-size: 12px; color: var(--text-secondary); letter-spacing: 0.3px; }
.br-bookmark-bar-excerpt {
    padding: 5px 14px; border: none; border-radius: 14px;
    background: var(--rose-dark, #A88080);
    color: #fff; font-size: 12px; font-weight: 500; cursor: pointer;
    font-family: inherit; letter-spacing: 0.3px;
    box-shadow: 0 1px 4px rgba(200,160,160,0.3);
    transition: all 0.2s ease;
}
.br-bookmark-bar-excerpt:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(200,160,160,0.4); }
.br-bookmark-bar-exit {
    padding: 4px 12px; border: 1px solid var(--border); border-radius: 12px;
    background: var(--surface-solid); color: var(--text-secondary);
    font-size: 12px; cursor: pointer; font-family: inherit;
    transition: all 0.2s ease;
}
.br-bookmark-bar-exit:hover { border-color: var(--text-muted); color: var(--text-primary); }

/* 书签模式：段落可选 */
/* 书摘模式：去掉所有段落常驻虚线框（会在开合瞬间画一遍"黑色虚线框闪动"）——只保留柔和高亮 */
body.bookmark-mode .br-paragraph {
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease, box-shadow 0.2s ease;
}
body.bookmark-mode .br-paragraph:hover {
    background: var(--accent-light);
}
body.bookmark-mode .br-paragraph.bookmark-selected {
    background: var(--accent-rose-light);
    box-shadow: inset 0 0 0 1.5px var(--accent-rose);
}
body.bookmark-mode .br-para-note-dot { pointer-events: none; opacity: 0.3; }

/* ===== 批注书写浮层 ===== */
@keyframes note-pop-in {
    from { opacity:0; transform:scale(0.92); }
    to { opacity:1; transform:scale(1); }
}
@keyframes note-pop-out {
    from { opacity:1; transform:scale(1); }
    to { opacity:0; transform:scale(0.92); }
}
.br-user-ann-overlay {
    /* ★ 2026-10：跟着阅读器一起抬（原来是 270，会被抬到 1550 的阅读器盖住） */
    position: fixed; z-index: 1552;
    background: rgba(30,25,20,0.25);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    inset: 0; display: flex; align-items: center; justify-content: center;
    padding-bottom: 18vh; /* 抬高一些，避免被键盘挡住 */
    animation: note-pop-in 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.br-user-ann-overlay.closing {
    animation: note-pop-out 0.2s ease-in forwards;
    pointer-events: none;
}
.br-user-ann-panel {
    background: linear-gradient(175deg, #FFFCF6 0%, #FBF6EC 100%);
    border: 1px solid rgba(180,155,130,0.18);
    border-radius: 18px; padding: 20px 18px 16px; width: 320px; max-width: 90vw;
    box-shadow:
        0 2px 0 rgba(255,255,255,0.6) inset,
        0 4px 20px rgba(160,135,110,0.12),
        0 12px 40px rgba(0,0,0,0.08);
    position: relative;
}
.br-user-ann-panel::before {
    content: ''; position: absolute; top: 0; left: 24px; right: 24px; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201,168,168,0.4), transparent);
}
.br-user-ann-panel-header {
    display: flex; align-items: flex-start; justify-content: space-between;
    margin-bottom: 14px;
}
.br-user-ann-panel-title-row {
    display: flex; flex-direction: column; gap: 2px;
}
.br-user-ann-quill {
    color: var(--accent-rose); opacity: 0.5; margin-bottom: 6px;
    animation: quill-dip 3s ease-in-out infinite;
}
@keyframes quill-dip {
    0%,100% { transform: rotate(0deg); }
    25% { transform: rotate(-8deg); }
    75% { transform: rotate(5deg); }
}
.br-user-ann-panel-title {
    display: flex; align-items: center; gap: 8px;
    font-size: 15px; color: var(--text-primary); font-weight: 500;
    letter-spacing: 0.5px;
}
.br-user-ann-panel-subtitle {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-size: 10px; color: var(--text-muted); letter-spacing: 1.5px;
    opacity: 0.6; margin-top: 1px;
}
.br-user-ann-context {
    margin-bottom: 14px; padding: 10px 12px;
    background: rgba(0,0,0,0.015); border-radius: 8px;
    font-size: 12px; line-height: 1.7; color: var(--text-muted);
    font-family: var(--font-reading); font-style: italic;
    border-left: 2px solid rgba(200,160,150,0.2);
    max-height: 60px; overflow: hidden;
}
.br-user-ann-panel-close {
    background: none; border: none; cursor: pointer; color: var(--text-muted);
    padding: 4px; border-radius: 50%; display: flex;
    transition: all 0.2s ease;
}
.br-user-ann-panel-close:hover { color: var(--text-primary); background: var(--accent-light); }
.br-user-ann-textarea {
    width: 100%; padding: 12px 14px;
    border: none; border-radius: 12px;
    font-family: var(--font-handwriting); font-size: 15px;
    resize: vertical; background:
        repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(180,160,130,0.06) 27px, rgba(180,160,130,0.06) 28px);
    color: var(--text-primary); box-sizing: border-box;
    line-height: 1.75; margin-bottom: 14px; min-height: 80px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s ease;
}
.br-user-ann-textarea:focus {
    outline: none;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.04), 0 0 0 3px rgba(201,168,168,0.12);
}
.br-user-ann-actions { display: flex; justify-content: flex-end; gap: 10px; }
.br-user-ann-cancel {
    padding: 8px 20px; border: 1px solid var(--border);
    border-radius: 18px; background: transparent; color: var(--text-secondary);
    cursor: pointer; font-family: inherit; font-size: 13px; transition: all 0.2s ease;
}
.br-user-ann-cancel:hover { border-color: var(--text-muted); color: var(--text-primary); background: rgba(0,0,0,0.02); }
.br-user-ann-submit {
    padding: 8px 22px; border: none; border-radius: 18px;
    background: var(--rose-dark, #A88080);
    color: #fff; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 500;
    box-shadow: var(--shadow-sm);
    transition: all 0.2s ease; letter-spacing: 0.3px;
}
.br-user-ann-submit:hover { background: var(--rose-hover); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(200,160,160,0.4); }

/* 章节摘要卡片 */
.br-summary-card {
    margin:0 6px 20px; padding:12px 14px;
    background:rgba(0,0,0,0.02); border-radius:8px;
    border-left:2px solid var(--accent); font-size:14px; line-height:1.7;
    color:var(--text-secondary); font-family:var(--font-reading); font-style:italic;
}
.br-summary-label {
    font-size:11px; font-weight:600; color:var(--accent); letter-spacing:0.5px;
    text-transform:uppercase; margin-bottom:4px; font-family:var(--font-decorative);
    font-style:normal;
}

/* 原侧边批注栏 — 已废弃，保留隐藏 */
.br-annotations-bar { display:none !important; }
.br-inline-annotations { display:none !important; }

/* 进度条 - 极细 */
.br-progress-bar { display:none; }
.br-progress-track { height:3px; background:var(--divider); border-radius:2px; position:relative; overflow:visible; }
.br-progress-my { height:100%; background:var(--rose-dark); border-radius:2px; transition:width 0.5s cubic-bezier(0.34,1.56,0.64,1); }
.br-progress-ai-marker {
    position:absolute; top:-3px; width:10px; height:10px; border-radius:50%;
    background:var(--accent-rose); border:2px solid #fff;
    box-shadow:0 1px 6px rgba(201,168,168,0.35);
    transform:translateX(-50%); transition:left 0.5s cubic-bezier(0.34,1.56,0.64,1);
}

/* ===== 批注详情浮层：z 放在书架全屏层(1500)之上一点 ===== */
.ann-detail-overlay {
    display:flex; position:fixed; inset:0; z-index:1560;
    background:rgba(30,25,20,0.35); backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    align-items:flex-end; justify-content:center;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity 0.25s ease, visibility 0s 0.25s;
}
.ann-detail-overlay.show {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity 0.25s ease, visibility 0s 0s;
}
/* 双击防闪：入场动画只挂 .show（一次性），基类只留 close 方向 transition，彻底断开双驱动 */
.ann-detail-overlay.show .ann-detail-panel {
    animation:ann-slide-up 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.ann-detail-panel {
    position:relative; width:100%; max-width:480px; max-height:85vh;
    background:linear-gradient(175deg, var(--surface-solid) 0%, var(--bg-primary) 100%);
    border-radius:18px 18px 0 0;
    box-shadow:0 -4px 30px rgba(0,0,0,0.12);
    display:flex; flex-direction:column;
    transform:translateY(100%);
    transition:transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow:hidden;
}
@keyframes ann-slide-up {
    from { transform:translateY(100%); }
    to { transform:translateY(0); }
}
.ann-detail-header {
    display:flex; align-items:center; padding:16px 18px 10px;
    border-bottom:1px solid rgba(0,0,0,0.04); flex-shrink:0;
}
.ann-detail-title {
    font-size:16px; font-weight:600; color:var(--text-secondary);
    font-family:var(--font-decorative); font-style:italic;
}
.ann-detail-title-en {
    font-size:10px; color:var(--text-muted); margin-left:6px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic;
    letter-spacing:1px; margin-top:2px;
}
.ann-detail-close {
    margin-left:auto; background:none; border:none; cursor:pointer;
    color:var(--text-muted); padding:4px; border-radius:50%;
    display:flex; transition:all 0.2s ease;
}
.ann-detail-close:hover { color:var(--text-primary); background:var(--accent-light); }

.ann-detail-author {
    display:flex; align-items:center; gap:8px; padding:10px 18px 4px; flex-shrink:0;
}
.ann-author-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.ann-author-dot.ai { background:var(--accent-rose); }
.ann-author-dot.user { background:#A8B8A0; }
.ann-author-name { font-size:14px; font-weight:500; color:var(--text-primary); }
.ann-author-date { font-size:11px; color:var(--text-muted); margin-left:auto; }

.ann-detail-body {
    padding:10px 18px 4px; flex:1 1 auto; min-height:0; overflow-y:auto;
}
.ann-detail-content {
    font-family:var(--font-handwriting); font-size:16px; line-height:1.9;
    color:#5a4030;
    background:linear-gradient(transparent 26px, rgba(180,160,140,0.12) 26px);
    background-size:100% 28px;
    padding:8px 12px; border-radius:6px;
    border-left:2px solid rgba(200,160,150,0.2);
}

.ann-detail-thread {
    flex:0 0 auto; overflow-y:auto; padding:10px 18px; max-height:160px;
    display:flex; flex-direction:column; gap:8px;
}
.ann-thread-empty { text-align:center; padding:20px; font-size:12px; color:var(--text-muted); font-style:italic; }
.ann-thread-msg {
    max-width:85%; padding:8px 12px; border-radius:8px;
    font-size:13px; line-height:1.5;
}
.ann-thread-msg.ai {
    align-self:flex-start;
    background:#fff5f5; border-bottom-left-radius:2px;
    font-family:var(--font-handwriting); color:#7a4048;
    box-shadow:0 1px 3px rgba(0,0,0,0.03);
}
.ann-thread-msg.user {
    align-self:flex-end;
    background:var(--rose-dark); color:#fff; border-bottom-right-radius:2px;
    font-family:var(--font-handwriting);
}
.ann-thread-author { font-size:10px; color:var(--text-muted); display:block; margin-bottom:2px; }
.ann-thread-msg.user .ann-thread-author { text-align:right; color:rgba(255,255,255,0.7); }

.ann-detail-actions {
    display:flex; gap:8px; padding:8px 18px; border-top:1px solid rgba(0,0,0,0.04); flex-shrink:0;
}
.ann-detail-btn {
    display:flex; align-items:center; gap:4px; padding:6px 14px;
    border:1.5px solid var(--border); border-radius:16px;
    background:var(--surface-solid); cursor:pointer;
    font-size:12px; color:var(--text-secondary);
    transition:all 0.2s ease; font-family:inherit;
}
.ann-detail-btn:hover { border-color:var(--accent); color:var(--accent); }
.ann-detail-btn.delete { color:var(--accent-rose); border-color:rgba(200,160,160,0.3); }
.ann-detail-btn.delete:hover { background:rgba(200,160,160,0.08); border-color:var(--accent-rose); }

.ann-detail-reply-row {
    display:flex; padding:8px 18px calc(16px + env(safe-area-inset-bottom, 0px));
    border-top:1px solid rgba(0,0,0,0.04); flex-shrink:0;
}
.ann-detail-reply-btn {
    flex:1; display:flex; align-items:center; justify-content:center; gap:6px;
    padding:11px 14px;
    border:1.5px dashed rgba(184,120,120,0.4); border-radius:20px;
    background:rgba(255,255,255,0.6); color:var(--accent-rose, #B87878);
    font-size:13px; letter-spacing:1px; cursor:pointer;
    font-family:inherit; transition:all 0.2s ease;
}
.ann-detail-reply-btn:hover { background:rgba(184,120,120,0.08); border-color:rgba(184,120,120,0.7); }
.ann-detail-reply-btn svg { flex-shrink:0; }

/* 便签回信全屏输入 */
.ann-reply-overlay {
    position:fixed; inset:0; z-index:1580;
    display:flex; flex-direction:column;
    background:linear-gradient(175deg, #FFFEFA 0%, #F9F4EB 20%, #F3ECD8 100%);
    transform:translateY(100%); opacity:0; pointer-events:none;
    transition:transform 0.32s cubic-bezier(0.25,0.46,0.45,0.94), opacity 0.32s ease;
}
.ann-reply-overlay.open { transform:translateY(0); opacity:1; pointer-events:auto; }
.ann-reply-top {
    display:flex; align-items:center; gap:11px;
    padding:calc(14px + var(--safe-top)) 16px 10px; border-bottom:1px solid rgba(0,0,0,0.04);
    flex-shrink:0;
}
.ann-reply-back {
    flex-shrink:0; background:none; border:none; cursor:pointer;
    color:var(--text-secondary); padding:5px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    transition:all 0.2s ease; -webkit-tap-highlight-color:transparent;
}
.ann-reply-back:active { transform:scale(0.9); }
.ann-reply-back:hover { color:var(--text-primary); background:var(--accent-light); }
.ann-reply-titlerow { display:flex; flex-direction:column; gap:1px; }
.ann-reply-title { font-size:16px; font-weight:600; color:var(--text-secondary); font-family:var(--font-decorative); font-style:italic; line-height:1.2; }
.ann-reply-title-en { font-size:9px; color:var(--text-muted); font-family:'Playfair Display', var(--font-decorative); font-style:italic; letter-spacing:1px; margin-top:2px; }
.ann-reply-textarea {
    flex:1; margin:16px; padding:14px; resize:none; outline:none;
    border:1.5px solid rgba(0,0,0,0.08); border-radius:12px;
    font-family:var(--font-handwriting); font-size:16px; line-height:1.8;
    color:#5a4030; background:rgba(255,255,255,0.6);
}
.ann-reply-textarea:focus { border-color:var(--accent); }
.ann-reply-actions {
    padding:0 16px 24px; display:flex; justify-content:flex-end; flex-shrink:0;
}
.ann-reply-send {
    display:flex; align-items:center; gap:6px;
    padding:10px 24px; border:none; border-radius:24px;
    background:var(--rose-dark, #A88080); color:#fff;
    font-size:14px; letter-spacing:1px; cursor:pointer;
    font-family:inherit; transition:all 0.2s ease;
    box-shadow:0 2px 8px rgba(200,160,160,0.35);
}
.ann-reply-send:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(200,160,160,0.45); }
.ann-reply-send:active { transform:scale(0.96); }
.ann-reply-send:disabled { opacity:0.5; cursor:not-allowed; }

/* 立即回复进度指示器 */
.ann-detail-instant-status {
    padding:10px 18px 14px; text-align:center; border-top:1px solid rgba(0,0,0,0.04);
}
.ann-instant-envelope {
    display:inline-block; margin-bottom:4px;
    animation:env-float 2s ease-in-out infinite;
    color:var(--accent-rose);
}
@keyframes env-float {
    0%,100% { transform:translateY(0); }
    50% { transform:translateY(-6px); }
}
.ann-instant-text { font-size:13px; color:var(--text-secondary); margin-bottom:6px; font-family:var(--font-decorative); font-style:italic; }
.ann-instant-slide { animation:annInstantSlideUp 0.4s cubic-bezier(0.22,1,0.36,1); }
@keyframes annInstantSlideUp {
    from { opacity:0; transform:translateY(16px); }
    to { opacity:1; transform:translateY(0); }
}
.ann-instant-dots { display:flex; justify-content:center; gap:6px; }
.ann-instant-dot {
    width:6px; height:6px; border-radius:50%; background:var(--accent-rose);
    opacity:0.3; transition:opacity 0.4s ease;
}
.ann-instant-dots.stage-send .ann-instant-dot:nth-child(1) { opacity:1; animation:dot-blink 0.6s ease-in-out infinite; }
.ann-instant-dots.stage-writing .ann-instant-dot:nth-child(1),
.ann-instant-dots.stage-writing .ann-instant-dot:nth-child(2) { opacity:1; }
.ann-instant-dots.stage-writing .ann-instant-dot:nth-child(2) { animation:dot-blink 0.6s ease-in-out infinite 0.2s; }
.ann-instant-dots.stage-done .ann-instant-dot { opacity:1; background:#A8B8A0; }
.ann-instant-dots.stage-pending .ann-instant-dot { opacity:0.5; background:var(--text-muted); }
@keyframes dot-blink {
    0%,100% { opacity:0.3; }
    50% { opacity:1; }
}

/* 删除确认弹窗 */
.ann-delete-confirm {
    display:flex; position:fixed; inset:0; z-index:1570;
    background:rgba(30,25,20,0.4);
    align-items:center; justify-content:center;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity 0.2s ease, visibility 0s 0.2s;
}
.ann-delete-confirm.show {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity 0.2s ease, visibility 0s 0s;
}
.ann-delete-confirm-card {
    background:var(--surface-solid); border-radius:16px;
    padding:28px 24px 20px; text-align:center;
    box-shadow:0 8px 40px rgba(0,0,0,0.15);
    max-width:280px; width:90%;
    transform:scale(0.92); transition:transform 0.2s cubic-bezier(0.34,1.56,0.64,1);
}
.ann-delete-confirm.show .ann-delete-confirm-card { transform:scale(1); }
.ann-delete-confirm-card {
    background:var(--surface-solid); border-radius:16px;
    padding:28px 24px 20px; text-align:center;
    box-shadow:0 8px 40px rgba(0,0,0,0.15);
    max-width:280px; width:90%;
}
.ann-delete-confirm-icon { color:var(--accent-rose); margin-bottom:12px; }
.ann-delete-confirm-text {
    font-size:15px; color:var(--text-primary); margin-bottom:20px;
    font-family:var(--font-reading); line-height:1.5;
}
.ann-delete-confirm-actions { display:flex; gap:10px; justify-content:center; }
.ann-delete-confirm-cancel, .ann-delete-confirm-ok {
    padding:8px 22px; border-radius:18px; font-size:14px;
    cursor:pointer; border:1.5px solid var(--border);
    background:var(--surface-solid); color:var(--text-secondary);
    font-family:inherit; transition:all 0.2s ease;
}
.ann-delete-confirm-ok {
    background:var(--accent-rose); color:#fff; border-color:var(--accent-rose);
}
.ann-delete-confirm-ok:hover { background:var(--rose-hover); }
.ann-delete-confirm-cancel:hover { border-color:var(--accent); color:var(--accent); }

/* 立即回复 / 自主阅读 帮助气泡（通用）——层级要高于书架设置面板，否则被盖住 */
.bs-help-bubble {
    display:none; position:fixed; z-index:1750; max-width:240px;
    background:var(--surface-solid); border-radius:12px;
    padding:14px 16px; box-shadow:0 4px 24px rgba(0,0,0,0.12);
    border:1px solid var(--border);
    animation:bsHelpIn 0.22s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes bsHelpIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
.instant-reply-help-text {
    font-size:13px; line-height:1.8; color:var(--text-secondary);
}
.instant-reply-help-arrow {
    position:absolute; top:-6px; right:8px; width:12px; height:6px;
    clip-path:polygon(50% 0%, 0% 100%, 100% 100%);
    background:var(--surface-solid);
}

/* 旧评论面板 — 已废弃 */
.annotation-comment-panel { display:none !important; }

/* ===== 书架使用指南浮层 ===== */
.bookshelf-help-overlay {
    display:flex; position:fixed; inset:0; z-index:1700;
    background:rgba(30,25,20,0.3); backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    align-items:center; justify-content:center;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity 0.22s ease, visibility 0s 0.22s;
}
.bookshelf-help-overlay.show {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity 0.22s ease, visibility 0s 0s;
}
.bookshelf-help-panel {
    transform:translateY(6px);
}
.bookshelf-help-overlay.show .bookshelf-help-panel {
    animation:note-pop-in 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
}

.bookshelf-help-panel {
    width:340px; max-width:90vw; max-height:75vh; overflow-y:auto;
    background:linear-gradient(175deg, #FFFEFA 0%, #F9F4EB 100%);
    border-radius:18px; padding:20px 20px 16px;
    box-shadow:0 8px 40px rgba(0,0,0,0.12);
    animation:note-pop-in 0.3s cubic-bezier(0.25,0.46,0.45,0.94);
}
.bookshelf-help-header {
    display:flex; align-items:center; margin-bottom:18px;
}
.bookshelf-help-title {
    font-size:17px; font-weight:600; color:var(--text-secondary);
    font-family:var(--font-decorative); font-style:italic;
}
.bookshelf-help-title-en {
    font-size:9px; color:var(--text-muted); margin-left:6px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic;
    letter-spacing:1px; margin-top:3px;
}
.bookshelf-help-close {
    margin-left:auto; background:none; border:none; cursor:pointer;
    color:var(--text-muted); padding:4px; border-radius:50%;
    display:flex; transition:all 0.2s ease;
}
.bookshelf-help-close:hover { color:var(--text-primary); background:var(--accent-light); }

.bookshelf-help-body { display:flex; flex-direction:column; gap:0; }

.bookshelf-help-item {
    display:flex; gap:14px; padding:14px 0;
    border-bottom:1px solid rgba(0,0,0,0.04);
}
.bookshelf-help-item:last-child { border-bottom:none; }

.bookshelf-help-icon {
    flex-shrink:0; width:36px; height:36px; border-radius:50%;
    background:rgba(200,160,150,0.08); display:flex;
    align-items:center; justify-content:center;
    color:var(--accent-rose); margin-top:2px;
}
.bookshelf-help-label { font-size:14px; font-weight:500; color:var(--text-primary); margin-bottom:3px; }
.bookshelf-help-desc { font-size:12px; color:var(--text-muted); line-height:1.7; }

.bookshelf-help-btn {
    width:28px; height:28px; border-radius:50%; border:1.5px solid var(--border);
    background:var(--surface-solid); cursor:pointer; display:flex;
    align-items:center; justify-content:center; color:var(--text-muted);
    transition:all 0.2s ease; padding:0; opacity:0.5;
}
.bookshelf-help-btn:hover { opacity:1; color:var(--accent); border-color:var(--accent); }

/* 便签模式下段落可交互提示 */
.note-mode .br-paragraph .br-para-note-dot {
    animation: note-dot-breathe 2.5s ease-in-out infinite;
}
@keyframes note-dot-breathe {
    0%,100% { transform:scale(1); opacity:0.7; }
    50% { transform:scale(1.25); opacity:1; }
}

[data-theme-mode="dark"] .bookshelf-help-panel { background:linear-gradient(175deg, #2e2a24 0%, #28241c 100%); }
[data-theme-mode="dark"] .bookshelf-help-item { border-bottom-color:rgba(255,255,255,0.04); }
[data-theme-mode="dark"] .bookshelf-help-icon { background:rgba(200,160,150,0.1); }
[data-theme-mode="dark"] .bookshelf-help-btn { border-color:rgba(255,255,255,0.1); color:#a09888; }

/* ===== 章节侧边栏 ===== */
.br-chapter-sidebar-overlay {
    position: fixed; inset: 0; z-index: 195;
    background: rgba(30,25,20,0.25);
    backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.br-chapter-sidebar {
    position: fixed; top: 0; right: 0; width: 280px; height: 100%;
    z-index: 196; background: var(--bg-chat);
    display: flex; flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.32,0.72,0,1);
    box-shadow: var(--shadow-lg);
}
.br-chapter-sidebar.open { transform: translateX(0); }
.br-chapter-sidebar-header {
    display: flex; align-items: center;
    padding: 8px 12px; border-bottom: 1px solid var(--border);
    flex-shrink: 0; gap: 8px;
}
.br-sidebar-tabs { display: flex; gap: 2px; flex: 1; }
.br-sidebar-tab {
    padding: 6px 12px; border: none; border-radius: 8px;
    background: none; cursor: pointer; font-family: inherit;
    font-size: 13px; color: var(--text-muted); font-weight: 500;
    transition: all 0.2s ease; display: flex; align-items: center; gap: 4px;
}
.br-sidebar-tab.active { background: var(--accent-light); color: var(--accent-rose); }
.br-sidebar-tab:hover { color: var(--accent); }
.br-sidebar-tab-en {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-size: 9px; opacity: 0.5; letter-spacing: 0.5px;
}
.br-chapter-sidebar-close {
    background: none; border: none; cursor: pointer; color: var(--text-muted);
    padding: 4px; border-radius: 50%; display: flex; transition: all 0.15s ease; flex-shrink: 0;
}
.br-chapter-sidebar-close:hover { color: var(--text-primary); background: var(--accent-light); }
.br-chapter-sidebar-list { flex: 1; overflow-y: auto; padding: 6px 0; }

/* 便签列表项 */
.br-sidebar-ann-item {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 10px 14px; border: none; background: none; width: 100%;
    text-align: left; cursor: pointer; font-family: inherit;
    border-bottom: 1px solid var(--divider); transition: background 0.15s ease;
}
.br-sidebar-ann-item:hover { background: var(--accent-light); }
.br-sidebar-ann-dot {
    width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 5px;
}
.br-sidebar-ann-dot.ai { background: var(--accent-rose); }
.br-sidebar-ann-dot.user { background: var(--accent-sage); }
.br-sidebar-ann-body { flex: 1; min-width: 0; }
.br-sidebar-ann-author { font-size: 10px; font-weight: 600; margin-bottom: 2px; letter-spacing: 0.3px; }
.br-sidebar-ann-author.ai { color: var(--accent-rose); }
.br-sidebar-ann-author.user { color: var(--accent-sage); }
.br-sidebar-ann-text { font-size: 12px; color: var(--text-secondary); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.br-sidebar-ann-para { font-size: 10px; color: var(--text-muted); margin-top: 2px; }

/* 书名标题 — 阅读内容的一部分，出现在摘要上方 */
.br-title-bar {
    text-align: center; padding: 16px 20px 6px;
}
.br-title-bar-book {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-size: 20px; color: var(--text-primary); letter-spacing: 1px;
    display: block; line-height: 1.3;
}
.br-title-bar-chapter {
    display: block; font-size: 12px; color: var(--accent-rose);
    margin-top: 4px; letter-spacing: 0.5px;
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    opacity: 0.7;
}
.br-chapter-sidebar-item {
    display: flex; align-items: center; gap: 8px;
    width: 100%; padding: 11px 16px; border: none; background: none;
    text-align: left; cursor: pointer; font-family: inherit;
    transition: background 0.15s ease; border-left: 3px solid transparent;
}
.br-chapter-sidebar-item:hover { background: var(--accent-light); }
.br-chapter-sidebar-item.current {
    background: rgba(201,168,168,0.08);
    border-left-color: var(--accent-rose);
}
.ch-sidebar-order {
    width: 22px; height: 22px; border-radius: 50%;
    background: var(--accent-light); color: var(--accent);
    font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.ch-sidebar-text { flex: 1; min-width: 0; }
.ch-sidebar-title { font-size: 14px; color: var(--text-primary); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-sidebar-reason { font-size: 11px; color: var(--text-muted); display: block; margin-top: 1px; font-style: italic; }
.ch-sidebar-marks { flex-shrink: 0; display: flex; gap: 3px; align-items: center; }
.ch-sidebar-dot { font-size: 10px; }
.ch-sidebar-dot.ai-read { color: var(--accent-rose); }
.ch-sidebar-dot.my-reading { color: var(--accent-sage); }
.br-chapter-legend {
    display: flex; gap: 14px; align-items: center;
    padding: 6px 16px 8px;
    border-bottom: 1px solid var(--divider);
    margin-bottom: 4px;
}
.br-chapter-legend-item {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; color: var(--text-muted); letter-spacing: 0.3px;
}
.br-chapter-legend-item .ch-sidebar-dot { font-size: 9px; line-height: 1; }

/* ===== 双进度条（书架+侧边栏底部） ===== */
.br-dual-progress { padding: 10px 16px 12px; flex-shrink: 0; }
.br-dual-progress-row { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.br-dual-progress-row:last-child { margin-bottom: 0; }
.br-dual-progress-label { font-size: 10px; color: var(--text-muted); width: 24px; text-align: right; flex-shrink: 0; letter-spacing: 0.3px; }
.br-dual-progress-track { flex: 1; height: 4px; border-radius: 2px; background: var(--divider); position: relative; overflow: visible; }
.br-dual-progress-fill { height: 100%; border-radius: 2px; transition: width 0.5s ease; }
.br-dual-progress-fill.ai { background: var(--accent-rose); }
.br-dual-progress-fill.my { background: var(--accent-sage); }
.br-dual-progress-dot {
    position: absolute; top: -4px; width: 12px; height: 12px; border-radius: 50%;
    transition: left 0.5s ease;
}
.br-dual-progress-dot.ai { background: var(--accent-rose); box-shadow: 0 0 6px rgba(201,168,168,0.4); }
.br-dual-progress-dot.my { background: var(--accent-sage); box-shadow: 0 0 6px rgba(168,184,160,0.4); }
.br-sidebar-sort-btn {
    display: flex; align-items: center; gap: 4px;
    padding: 4px 10px; margin: 6px 12px 4px;
    border: 1px solid var(--border); border-radius: 12px;
    background: var(--surface-solid); cursor: pointer;
    font-family: inherit; font-size: 11px; color: var(--text-secondary);
    transition: all 0.15s ease; align-self: flex-end;
}
.br-sidebar-sort-btn:hover { border-color: var(--accent); color: var(--accent); }
.br-sidebar-sort-label { letter-spacing: 0.3px; }
.ch-sidebar-status { font-size: 11px; color: var(--text-muted); flex-shrink: 0; }
.ch-sidebar-status.completed { color: var(--accent-sage); }

/* 批注中段落高亮 */
.br-paragraph.annotating {
    background: rgba(201,168,168,0.1) !important;
    outline: 2px dashed var(--accent-rose);
    outline-offset: 2px;
    border-radius: 6px;
}

/* ===== 书签文本预览区 ===== */
.br-bookmark-preview {
    padding: 10px 4px; margin: 0 12px 8px;
    background: var(--surface-solid);
    border: 1px solid var(--border); border-radius: 10px;
    font-size: 14px; line-height: 1.8; color: var(--text-primary);
    max-height: 200px; overflow-y: auto;
    user-select: text; -webkit-user-select: text;
    font-family: var(--font-reading);
    box-shadow: var(--shadow-xs);
}
.br-bookmark-line {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 6px 10px; border-radius: 6px;
    cursor: pointer; transition: all 0.15s ease;
    font-size: 14px; line-height: 1.7;
}
.br-bookmark-line:hover { background: rgba(201,168,168,0.06); }
.br-bookmark-line .bm-line-num {
    font-size: 10px; color: var(--text-muted); flex-shrink: 0;
    min-width: 20px; text-align: right; padding-top: 3px;
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
}
.br-bookmark-line.selected {
    background: rgba(201,168,168,0.14);
    box-shadow: inset 2px 0 0 var(--accent-rose);
}
.br-bookmark-line.selected .bm-line-num { color: var(--accent-rose); }
.br-bookmark-preview .bm-hint {
    font-size: 10px; color: var(--text-muted);
    padding: 2px 10px 4px; letter-spacing: 0.5px;
}
.br-bookmark-line.whole {
    border-bottom: 1px dashed var(--border);
    margin-bottom: 4px; font-weight: 500;
}
.br-bookmark-line.whole .bm-line-text { color: var(--accent-rose); }

/* ===== 移动端窄屏 ===== */
@media (max-width:420px) {
    .br-paragraph { padding: 0 6px; }
    .br-note-card { flex: 0 0 128px; }
    .br-note-card-content { font-size: 11px; }
    .ann-detail-panel { max-height: 80vh; }
    .br-chapter-sidebar { width: 260px; }
    .br-bookmark-preview { max-height: 120px; font-size: 13px; }
}

/* ===== 更窄屏 <370px ===== */
@media (max-width:370px) {
    .br-note-card { flex: 0 0 100px; }
    .br-note-card-content { font-size: 10px; }
    .br-para-note-dot { width: 15px; height: 15px; font-size: 9px; line-height: 15px; right: 1px; }
}

/* ===== 深色模式适配 ===== */
[data-theme-mode="dark"] .book-reader-overlay {
    background:#1a1815;
}
[data-theme-mode="dark"] .br-header {
    background:rgba(30,28,24,0.9);
    border-bottom-color:rgba(255,255,255,0.06);
}
[data-theme-mode="dark"] .br-text-panel {
    background:#1e1c17;
    background-image:
        linear-gradient(90deg, rgba(255,255,255,0.015) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,0.01) 1px, transparent 1px);
    background-size:100% 42px, 100% 100%;
    box-shadow:inset 0 0 60px rgba(0,0,0,0.15);
    color:#d4cec4;
}
[data-theme-mode="dark"] .br-paragraph .br-para-idx {
    color:rgba(255,255,255,0.1);
}
[data-theme-mode="dark"] .br-summary-card {
    background:rgba(255,255,255,0.03);
    color:#b0a89c;
}
[data-theme-mode="dark"] .br-summary-label { color:var(--accent); }
[data-theme-mode="dark"] .br-paragraph.has-ai-ann {
    background:linear-gradient(180deg, transparent 0%, rgba(212,144,152,0.05) 100%);
}
[data-theme-mode="dark"] .br-paragraph.has-user-ann {
    background:linear-gradient(180deg, transparent 0%, rgba(122,156,192,0.05) 100%);
}
[data-theme-mode="dark"] .br-paragraph.has-both-ann {
    background:linear-gradient(180deg, transparent 0%, rgba(160,130,150,0.06) 100%);
}
[data-theme-mode="dark"] .br-progress-bar {
    background:rgba(30,28,24,0.8);
    border-top-color:rgba(255,255,255,0.05);
}
[data-theme-mode="dark"] .br-progress-ai-marker {
    border-color:#1e1c17;
}
[data-theme-mode="dark"] .ann-detail-panel {
    background:linear-gradient(175deg, #2e2a24 0%, #2a2620 20%, #242018 100%);
    box-shadow:0 -4px 30px rgba(0,0,0,0.4);
}
[data-theme-mode="dark"] .ann-detail-content {
    color:#c0b8a8;
    background:linear-gradient(transparent 26px, rgba(255,255,255,0.03) 26px);
    background-size:100% 28px;
    border-left-color:rgba(200,160,150,0.15);
}
[data-theme-mode="dark"] .ann-thread-msg.ai {
    background:rgba(212,144,152,0.1); color:#d4a8ae;
}
[data-theme-mode="dark"] .ann-detail-reply-input {
    background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.08); color:#d4cec4;
}
[data-theme-mode="dark"] .ann-detail-reply-input::placeholder { color:rgba(255,255,255,0.2); }
/* 便签抽屉/卡片改用主题变量（--surface-solid/--bg-primary/--accent-rose），随明暗主题自动适配，不再写死深色 */
[data-theme-mode="dark"] .ann-delete-confirm-card { background:#2a261e; box-shadow:0 8px 40px rgba(0,0,0,0.4); }
[data-theme-mode="dark"] .bs-help-bubble { background:#2a2620; border-color:rgba(255,255,255,0.08); }
[data-theme-mode="dark"] .instant-reply-help-arrow { background:#2a2620; }
[data-theme-mode="dark"] .br-user-ann-overlay { background:rgba(15,12,10,0.45); }
[data-theme-mode="dark"] .br-user-ann-panel { background:linear-gradient(175deg, #2e2a22 0%, #28241c 100%); }
[data-theme-mode="dark"] .br-user-ann-panel::before { background:linear-gradient(90deg, transparent, rgba(200,160,150,0.25), transparent); }
[data-theme-mode="dark"] .br-user-ann-textarea {
    background:rgba(255,255,255,0.04);
    border-color:rgba(255,255,255,0.06);
    color:#c0b8a8;
    background-image:repeating-linear-gradient(0deg, transparent, transparent 27px, rgba(255,255,255,0.03) 27px, rgba(255,255,255,0.03) 28px);
}
[data-theme-mode="dark"] .br-user-ann-textarea:focus {
    box-shadow:inset 0 1px 3px rgba(0,0,0,0.2), 0 0 0 3px rgba(200,160,150,0.15);
}
[data-theme-mode="dark"] .br-user-ann-cancel { color:#a09888; border-color:rgba(255,255,255,0.12); }
[data-theme-mode="dark"] .bs-set-help { border-color:rgba(255,255,255,0.1); color:#a09888; }
[data-theme-mode="dark"] .br-font-btn,
[data-theme-mode="dark"] .br-tool-btn,
[data-theme-mode="dark"] .br-chapter-btn {
    border-color:rgba(255,255,255,0.1);
    color:#a09888;
}
[data-theme-mode="dark"] .br-font-btn:hover,
[data-theme-mode="dark"] .br-tool-btn:hover,
[data-theme-mode="dark"] .br-chapter-btn:hover {
    border-color:var(--accent); color:var(--accent);
    background:rgba(201,184,160,0.1);
}
[data-theme-mode="dark"] .br-tool-btn.active {
    color:var(--accent-rose); border-color:var(--accent-rose);
    background:rgba(200,160,160,0.12);
}
/* 深色模式：书架 */
[data-theme-mode="dark"] .bookshelf-grid {
    background:linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0.01) 100%);
}
[data-theme-mode="dark"] .bookshelf-row {
    border-bottom-color:rgba(255,255,255,0.06);
    box-shadow:0 3px 0 rgba(255,255,255,0.02), 0 7px 0 rgba(255,255,255,0.01);
}
[data-theme-mode="dark"] .bookshelf-empty { color:rgba(255,255,255,0.3); }
[data-theme-mode="dark"] .book-cover::before { background:rgba(255,255,255,0.06); }
[data-theme-mode="dark"] .book-cover::after {
    background:linear-gradient(90deg, rgba(0,0,0,0.1) 0%, transparent 8%, transparent 92%, rgba(255,255,255,0.04) 100%),
               linear-gradient(180deg, rgba(255,255,255,0.08) 0%, transparent 40%, rgba(0,0,0,0.12) 100%);
}
[data-theme-mode="dark"] .chapter-list-overlay { background:rgba(0,0,0,0.6); }
[data-theme-mode="dark"] .chapter-list-panel {
    background:#2a2720; border-color:rgba(255,255,255,0.08);
}
[data-theme-mode="dark"] .chapter-list-item { color:#c0b8a8; }
[data-theme-mode="dark"] .chapter-list-item:hover { background:rgba(255,255,255,0.04); }
[data-theme-mode="dark"] .chapter-list-item.current {
    background:rgba(201,184,160,0.08);
}
[data-theme-mode="dark"] .font-settings-panel {
    background:#2a2720; border-color:rgba(255,255,255,0.08);
}
[data-theme-mode="dark"] .font-option,
[data-theme-mode="dark"] .font-size-btn {
    background:rgba(255,255,255,0.03); border-color:rgba(255,255,255,0.08);
    color:#c0b8a8;
}
[data-theme-mode="dark"] .font-option.active,
[data-theme-mode="dark"] .font-size-btn.active {
    color:#fff;
}
[data-theme-mode="dark"] .font-settings-close {
    border-color:rgba(255,255,255,0.08); color:#a09888;
}
[data-theme-mode="dark"] .font-upload-row { color:#a09888; }
[data-theme-mode="dark"] .book-ctx-menu {
    background:#2a2720; box-shadow:0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.06);
}
[data-theme-mode="dark"] .book-ctx-item { color:#c0b8a8; }
[data-theme-mode="dark"] .book-ctx-item:hover { background:rgba(255,255,255,0.04); }
[data-theme-mode="dark"] .book-edit-panel {
    background:#2a2720; border-color:rgba(255,255,255,0.08);
}
[data-theme-mode="dark"] .book-edit-input,
[data-theme-mode="dark"] .book-edit-textarea {
    background:rgba(255,255,255,0.04); border-color:rgba(255,255,255,0.08);
    color:#c0b8a8;
}
[data-theme-mode="dark"] .book-edit-cancel { background:rgba(255,255,255,0.06); color:#a09888; }
[data-theme-mode="dark"] .bookmark-float-btn {
    background:#2a2720; border-color:rgba(201,184,150,0.3); color:#b0a080;
}
[data-theme-mode="dark"] .bookmark-float-btn:hover { background:#353025; }

/* ---- 章节列表弹窗 ---- */
.chapter-list-overlay {
    /* ★ 2026-10：跟着阅读器一起抬（原来是 300） */
    position:fixed; inset:0; z-index:1553; background:rgba(30,25,20,0.35);
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.chapter-list-panel {
    background:var(--surface-solid); border-radius:16px; max-width:320px; width:88%;
    max-height:60vh; overflow-y:auto; box-shadow:var(--shadow-lg); border:1px solid var(--border);
    padding:8px 0;
}
.chapter-list-title {
    font-size:14px; font-weight:600; text-align:center; padding:10px 16px 4px;
    color:var(--text-primary); letter-spacing:0.3px;
}
.chapter-list-subtitle {
    font-size:10px; color:var(--text-muted); text-align:center; padding:0 16px 8px;
    font-style:italic; font-family:var(--font-decorative); letter-spacing:0.2px;
}
.chapter-list-item {
    display:flex; align-items:flex-start; gap:8px; width:100%; padding:10px 16px;
    background:none; border:none; font-family:inherit; font-size:13px;
    color:var(--text-primary); cursor:pointer; text-align:left;
    transition:background 0.15s ease; border-left:3px solid transparent;
}
.chapter-list-item:hover { background:var(--accent-light); }
.chapter-list-item.current { border-left-color:var(--accent); font-weight:600; background:var(--accent-light); }
.ch-order-badge {
    flex-shrink:0; width:22px; height:22px; border-radius:50%;
    background:var(--rose-dark); color:#fff; font-size:11px; font-weight:700;
    display:flex; align-items:center; justify-content:center; margin-top:1px;
}
.ch-item-text { flex:1; min-width:0; }
.ch-item-title { display:block; font-size:13px; }
.ch-order-reason {
    display:block; font-size:10px; color:var(--text-muted); margin-top:2px;
    font-style:italic;
}
.chapter-list-item .ch-status { font-size:10px; color:var(--text-muted); flex-shrink:0; margin-top:2px; }

/* 常驻 · 右下角操作菜单按钮 */
.book-menu-btn {
    position:absolute; bottom:8px; right:8px; z-index:6;
    width:28px; height:28px; border-radius:50%; border:none;
    background:rgba(0,0,0,0.28); cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:transform 0.2s ease, background 0.2s ease;
    backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
    -webkit-tap-highlight-color:transparent;
}
.book-menu-btn:active { transform:scale(0.9); }
.book-menu-btn:hover { transform:scale(1.12); background:rgba(0,0,0,0.4); }

/* ---- 封面调色板弹窗 ---- */
.cover-palette-overlay {
    position:fixed; inset:0; z-index:1560; background:rgba(30,25,20,0.32);
    display:flex; align-items:center; justify-content:center;
}
.cover-palette-panel {
    background:linear-gradient(172deg, var(--surface-solid) 0%, var(--bg-primary) 100%);
    border-radius:20px; padding:18px 18px 14px; text-align:left;
    max-width:320px; width:90%;
    max-height:calc(100dvh - 28px); overflow-y:auto; -webkit-overflow-scrolling:touch;
    box-shadow:var(--shadow-lg); border:1px solid var(--border);
    animation:popIn 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.cover-palette-header {
    display:flex; align-items:flex-start; gap:10px; margin-bottom:14px;
}
.cover-palette-head { flex:1; min-width:0; }
.cover-palette-title {
    font-size:15px; font-weight:600; color:var(--text-primary);
    font-family:var(--font-decorative); font-style:italic; letter-spacing:0.3px;
}
.cover-palette-sub {
    font-size:10px; color:var(--text-muted); margin-top:2px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic; letter-spacing:1px;
}
.cover-palette-x {
    flex-shrink:0; background:none; border:none; cursor:pointer;
    color:var(--text-muted); padding:4px; border-radius:50%; line-height:1;
    display:flex; transition:all 0.2s ease;
}
.cover-palette-x:hover { color:var(--text-primary); background:var(--accent-light); }
.cover-palette-preview {
    position:relative; height:64px; border-radius:8px; margin-bottom:14px;
    border:1.5px solid var(--border); overflow:hidden;
    background:linear-gradient(160deg, #e8ddd2, #cdbfae);
}
.cover-palette-preview-fallback {
    position:absolute; inset:0;
    background:
        linear-gradient(45deg, rgba(255,255,255,0.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.06) 75%),
        linear-gradient(45deg, rgba(255,255,255,0.06) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.06) 75%);
    background-size:20px 20px; background-position:0 0, 10px 10px;
}
.cover-palette-sec { margin-bottom:12px; }
.cover-palette-sec-label {
    font-size:11px; font-weight:500; color:var(--text-secondary);
    letter-spacing:0.5px; margin-bottom:10px; font-family:var(--font-decorative);
    display:flex; align-items:center; gap:8px;
}
.cover-palette-sec-label::after {
    content:''; flex:1; height:1px; background:var(--border); opacity:0.6;
}
.cover-palette-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.cover-color-dot {
    width:100%; aspect-ratio:1; border-radius:10px; border:2px solid transparent;
    cursor:pointer; transition:all 0.2s ease;
    position:relative; overflow:hidden;
}
.cover-color-dot::after {
    content:''; position:absolute; inset:0; pointer-events:none; z-index:2;
    border-radius:8px;
}
/* 主题色块内的图案层：底色是内联 linear-gradient，图案放这里不被内联覆盖；纯色 block 无此层 → 与纯色区分开 */
.cover-pattern-inner {
    position:absolute; inset:0; pointer-events:none; z-index:1;
    border-radius:8px;
}
.cover-color-dot:hover { transform:scale(1.07); border-color:var(--accent); box-shadow:0 4px 12px rgba(0,0,0,0.12); }
.cover-color-dot:active { transform:scale(0.96); }
.cover-sec-divider { height:1px; background:var(--border); opacity:0.55; margin:4px 0 14px; }
.cover-palette-sec { margin-bottom:12px; }
.cover-palette-sec-label { margin-bottom:12px; }
/* 「纯色」备选格 */
.cover-palette-extra-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; }
.cover-extra-dot {
    width:100%; aspect-ratio:1; border-radius:12px; border:2px solid transparent;
    cursor:pointer; transition:all 0.2s ease; box-shadow:0 1px 4px rgba(0,0,0,0.05);
}
.cover-extra-dot:hover { transform:scale(1.07); border-color:var(--accent); box-shadow:0 4px 12px rgba(0,0,0,0.12); }
.cover-extra-dot:active { transform:scale(0.96); }
/* 自定义上传按钮（无系统默认框） */
.cover-upload-btn {
    display:flex; align-items:center; justify-content:center; gap:9px;
    width:100%; padding:12px 14px; border:1.5px dashed var(--border);
    border-radius:12px; background:rgba(0,0,0,0.015);
    color:var(--text-secondary); font-family:inherit; font-size:13px;
    cursor:pointer; transition:all 0.2s ease; margin-bottom:8px;
}
.cover-upload-btn:hover { border-color:var(--accent); color:var(--accent); background:rgba(201,168,168,0.05); }
.cover-upload-btn:active { transform:scale(0.98); }
.cover-custom-remove {
    display:block; width:100%; padding:9px; border:none; background:transparent;
    color:var(--danger); font-family:inherit; font-size:12px; cursor:pointer;
    margin-bottom:4px; border-radius:8px; transition:background 0.15s ease;
}
.cover-custom-remove:hover { background:rgba(224,176,160,0.08); }
.cover-palette-footer {
    display:flex; align-items:center; gap:12px; margin-top:10px; padding-top:12px;
    border-top:1px solid var(--border);
}
.cover-palette-close {
    padding:9px 24px; border:1px solid var(--border); border-radius:20px;
    background:transparent; font-family:inherit; font-size:13px;
    color:var(--text-secondary); cursor:pointer; transition:all 0.15s ease;
}
.cover-palette-close:hover { background:var(--accent-light); color:var(--accent); }
.cover-palette-hint {
    margin-left:auto; font-size:11px; color:var(--text-muted);
    font-family:var(--font-decorative); font-style:italic; letter-spacing:0.3px;
}

/* ---- 右键菜单 (书卡/章节) ---- */
.book-ctx-menu {
    position:fixed; z-index:1560; min-width:190px; max-width:230px;
    background:var(--surface-solid); border-radius:16px;
    box-shadow:0 12px 40px rgba(0,0,0,0.16), 0 0 0 1px var(--border);
    padding:4px 0 6px; animation:popIn 0.18s cubic-bezier(0.34,1.56,0.64,1);
    user-select:none; -webkit-user-select:none; overflow:hidden;
}
.book-ctx-head {
    padding:8px 16px 9px; border-bottom:1px solid var(--border);
}
.book-ctx-title {
    font-size:13px; font-weight:600; color:var(--text-primary);
    font-family:var(--font-decorative); font-style:italic; letter-spacing:0.2px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.book-ctx-sub {
    font-size:10px; color:var(--text-muted); margin-top:2px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic; letter-spacing:1px;
}
.book-ctx-body { padding:6px 0; }
.book-ctx-item {
    display:flex; width:100%; align-items:center; gap:10px;
    padding:11px 16px; border:none; background:none;
    font-family:inherit; font-size:14px; color:var(--text-primary); cursor:pointer;
    text-align:left; transition:background 0.12s ease;
}
.book-ctx-item:hover { background:var(--accent-light); }
.book-ctx-item:active { background:var(--accent-light); transform:scale(0.98); }
.book-ctx-ic {
    display:flex; align-items:center; justify-content:center;
    width:24px; height:24px; flex-shrink:0; color:var(--accent-rose); opacity:0.85;
}
.book-ctx-item.danger .book-ctx-ic { color:var(--danger); }
.book-ctx-label-text { flex:1; }
.book-ctx-danger { border-top:1px solid var(--border); padding:6px 0; }
.book-ctx-item.danger { color:var(--danger); font-weight:500; }
.book-ctx-item.danger:hover { background:rgba(224,176,160,0.1); }

/* ---- 编辑弹窗 ---- */
.book-edit-overlay {
    /* ★ 2026-10：跟着阅读器一起抬（原来是 360） */
    position:fixed; inset:0; z-index:1555; background:rgba(30,25,20,0.35);
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
    animation:fadeIn 0.2s ease;
}
.book-edit-panel {
    background:var(--surface-solid); border-radius:16px; padding:20px 22px;
    max-width:380px; width:90%; max-height:70vh; overflow-y:auto;
    box-shadow:var(--shadow-lg); border:1px solid var(--border);
    animation:popIn 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.book-edit-panel-chapter { max-width:480px; max-height:85vh; }
.book-edit-head { display:flex; align-items:baseline; gap:8px; margin-bottom:14px; }
.book-edit-title {
    font-size:16px; font-weight:600; color:var(--text-primary); letter-spacing:0.3px;
    font-family:var(--font-decorative); font-style:italic;
}
.book-edit-title-en {
    font-size:9px; color:var(--text-muted); letter-spacing:1px;
    font-family:'Playfair Display', var(--font-decorative); font-style:italic;
}
.book-edit-label {
    display:block; font-size:12px; font-weight:500; color:var(--text-secondary);
    margin-bottom:4px; margin-top:10px; letter-spacing:0.2px;
}
.book-edit-label:first-of-type { margin-top:0; }
.book-edit-input {
    width:100%; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px;
    font-family:inherit; font-size:14px; background:var(--input-bg); color:var(--text-primary);
    box-sizing:border-box; transition:border-color 0.2s ease; outline:none;
}
.book-edit-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-light); }
.book-edit-textarea {
    width:100%; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px;
    font-family:var(--font-reading); font-size:14px; line-height:1.8; color:var(--text-primary);
    background:var(--input-bg); resize:vertical; box-sizing:border-box;
    transition:border-color 0.2s ease; outline:none;
}
.book-edit-textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-light); }
.book-edit-actions { display:flex; gap:10px; margin-top:16px; justify-content:flex-end; }
.book-edit-actions button {
    padding:10px 24px; border:none; border-radius:22px; font-size:14px; font-weight:600;
    cursor:pointer; font-family:inherit; transition:all 0.2s ease; letter-spacing:0.2px;
}
.book-edit-cancel { background:var(--accent-light); color:var(--accent); }
.book-edit-cancel:hover { background:rgba(201,184,160,0.22); }
.book-edit-save { background:var(--rose-dark); color:#fff; }
.book-edit-save:hover { transform:translateY(-1px); box-shadow:0 4px 14px rgba(201,184,160,0.3); }

/* ---- 红点通知 ---- */
.book-unread-dot {
    position:absolute; top:8px; left:8px; width:8px; height:8px; border-radius:50%;
    /* ★ 2026-10 甲方定：未读标记一律跟主题色走（--rose） */
    background:var(--rose, #C9A8A8); border:1.5px solid rgba(255,255,255,0.85);
    box-shadow:0 0 0 2px rgba(201,168,168,0.28); z-index:6;
    animation:unread-pulse 2.4s ease-in-out infinite;
}
@keyframes unread-pulse {
    0%,100% { box-shadow:0 0 0 2px rgba(201,168,168,0.28); }
    50% { box-shadow:0 0 0 5px rgba(201,168,168,0.10); }
}

/* ---- 字体设置按钮（阅读器标题栏）---- */
.br-font-btn {
    background:none; border:1px solid var(--border); border-radius:50%;
    width:32px; height:32px; cursor:pointer; display:flex;
    align-items:center; justify-content:center;
    color:var(--text-secondary); flex-shrink:0;
    transition:all 0.2s ease; font-size:16px;
}
.br-font-btn:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-light); }

/* ---- 字体设置面板 ---- */
.font-settings-overlay {
    /* ★ 2026-10：跟着阅读器一起抬（原来是 350） */
    position:fixed; inset:0; z-index:1554; background:rgba(30,25,20,0.3);
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.font-settings-overlay.closing { animation:fontSettingsOut 0.2s ease forwards; }
@keyframes fontSettingsOut { from { opacity:1; } to { opacity:0; } }
.font-loading { text-align:center; padding:16px 0; font-size:12px; color:var(--text-muted); grid-column:1 / -1; }
.font-settings-panel {
    background:var(--surface-solid); border-radius:16px; padding:22px;
    max-width:320px; width:88%; box-shadow:var(--shadow-lg);
    border:1px solid var(--border); animation:popIn 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.font-settings-title {
    font-size:16px; font-weight:600; margin-bottom:16px; text-align:center;
    font-family:var(--font-decorative); font-style:italic; letter-spacing:0.3px;
}
.font-section-label {
    font-size:11px; font-weight:500; color:var(--text-muted);
    margin-bottom:8px; margin-top:12px; letter-spacing:0.3px;
}
.font-options {
    display:grid; grid-template-columns:repeat(3, 1fr); gap:8px;
}
.font-option {
    padding:10px 8px; border:1.5px solid var(--border); border-radius:10px;
    background:var(--surface); font-family:inherit; font-size:13px; cursor:pointer;
    text-align:center; transition:background 0.2s ease, border-color 0.2s ease, color 0.2s ease; color:var(--text-primary);
}
.font-option:hover { border-color:var(--accent); }
.font-option.active { border-color:var(--accent); background:var(--accent-light); color:var(--accent); font-weight:600; }
.font-size-options {
    display:flex; gap:8px;
}
.font-size-btn {
    flex:1; padding:10px 8px; border:1.5px solid var(--border); border-radius:10px;
    background:var(--surface); font-family:inherit; font-size:13px; cursor:pointer;
    text-align:center; transition:background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; color:var(--text-primary);
}
.font-size-btn:hover { border-color:var(--accent); }
.font-size-btn.active {
    border-color:var(--rose-dark); background:var(--rose-dark); color:#fff; font-weight:600;
    box-shadow:0 3px 10px rgba(168,128,128,0.28), 0 1px 2px rgba(168,128,128,0.2);
}
.font-upload-row { margin-top:4px; }
.font-file-input {
    width:100%; font-family:inherit; font-size:12px; color:var(--text-secondary);
}
.font-file-input::file-selector-button {
    padding:7px 14px; border:1.5px solid var(--accent); border-radius:18px;
    background:transparent; color:var(--accent); font-family:inherit; font-size:12px;
    font-weight:500; cursor:pointer; margin-right:8px; transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.font-file-input::file-selector-button:hover { background:var(--accent); color:#fff; }
.font-settings-close {
    display:block; width:100%; margin-top:16px; padding:10px;
    border:1px solid var(--border); border-radius:20px;
    background:transparent; font-family:inherit; font-size:13px;
    color:var(--text-secondary); cursor:pointer; transition:background 0.15s ease, color 0.15s ease;
}
.font-settings-close:hover { background:var(--accent-light); color:var(--accent); }

/* ★ 2026-10 甲方实锤（点加号新增书籍 → 表单「出现在书架界面的下层，要退出书架才看得到」）：
   书架是 .nest-sub-panel.fullscreen（z-index:1500），这里原来是 340 → 整块被书架盖住。
   抬到 1556：盖过书架、也盖过阅读器（1550）；仍低于「选封面」浮层（1560，它从这个表单里打开）。 */
.book-add-overlay {
    position:absolute; inset:0; z-index:1556;
    display:none; align-items:flex-end; justify-content:center;
    background:rgba(30,25,20,0.32);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
.book-add-overlay.open { display:flex; }
.book-add-overlay.closing { display:flex; animation:bookAddOut 0.25s ease forwards; }
@keyframes bookAddOut { from { opacity:1; } to { opacity:0; } }
.book-add-panel {
    width:100%; max-width:480px;
    background:var(--bg-primary, #FBF7F0);
    border-radius:22px 22px 0 0; padding:20px 20px 28px;
    box-shadow:0 -8px 40px rgba(0,0,0,0.14);
    animation:bookAddIn 0.32s cubic-bezier(0.25,0.46,0.45,0.94);
}
@keyframes bookAddIn { from { transform:translateY(40px); opacity:0; } to { transform:translateY(0); opacity:1; } }
.book-add-header {
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:16px;
}
.book-add-header-titles { display:flex; align-items:baseline; gap:8px; }
.book-add-title { font-family:var(--font-decorative); font-style:italic; font-size:18px; font-weight:600; color:var(--text-secondary); }
.book-add-title-en { font-size:9px; color:var(--text-muted); font-family:'Playfair Display', var(--font-decorative); font-style:italic; letter-spacing:0.5px; }
.book-add-close {
    width:28px; height:28px; border-radius:50%; border:none; background:transparent;
    cursor:pointer; display:flex; align-items:center; justify-content:center;
    color:var(--text-muted); transition:background 0.2s ease, color 0.2s ease;
}
.book-add-close:hover { background:var(--accent-light); color:var(--accent); }
.book-add-body { display:flex; flex-direction:column; gap:16px; }
.book-add-section { display:flex; flex-direction:column; gap:7px; }
.book-add-section-label {
    font-size:12px; font-weight:600; color:var(--text-secondary); letter-spacing:0.5px;
    display:flex; align-items:center; gap:6px;
}
.book-add-optional {
    font-size:9px; font-weight:400; color:var(--text-muted);
    padding:1px 6px; border-radius:8px; background:rgba(0,0,0,0.03);
}
.book-add-required {
    font-size:9px; font-weight:500; color:var(--accent-rose);
    padding:1px 6px; border-radius:8px; background:rgba(201,168,168,0.1);
}
.book-add-cover-row { display:flex; align-items:center; gap:12px; }
.book-add-cover-preview {
    width:56px; height:76px; border-radius:6px; flex-shrink:0;
    background:linear-gradient(160deg,#e8d8d0,#b09a8e);
    border:1px solid rgba(0,0,0,0.05); overflow:hidden;
    box-shadow:0 2px 8px rgba(0,0,0,0.1);
    background-size:cover; background-position:center;
}
.book-add-cover-btn {
    padding:8px 14px; border:1.5px solid var(--border); border-radius:18px;
    background:transparent; color:var(--text-secondary); cursor:pointer;
    font-family:inherit; font-size:12px; transition:border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}
.book-add-cover-btn:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-light); }
.book-add-input {
    width:100%; padding:11px 14px; border:1.5px solid var(--border); border-radius:12px;
    background:var(--surface-solid); font-family:inherit; font-size:14px;
    color:var(--text-primary); outline:none; transition:border-color 0.25s ease, box-shadow 0.25s ease;
    box-sizing:border-box;
}
.book-add-input::placeholder { color:var(--text-muted); }
.book-add-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(201,176,168,0.12); }
.book-add-txt-btn {
    display:flex; align-items:center; gap:8px; width:100%;
    padding:12px 14px; border:1.5px dashed var(--accent); border-radius:12px;
    background:var(--accent-light); color:var(--accent); cursor:pointer;
    font-family:inherit; font-size:13px; font-weight:500;
    transition:background 0.2s ease, border-color 0.2s ease;
    box-sizing:border-box;
}
.book-add-txt-btn:hover { background:rgba(201,176,168,0.22); }
.book-add-txt-btn.has-file { border-style:solid; color:var(--accent-rose); border-color:var(--accent-rose); background:rgba(201,168,168,0.1); }
.book-add-txt-note { font-size:10.5px; color:var(--text-muted); line-height:1.6; }
.book-add-paste {
    width:100%; min-height:120px; padding:11px 14px; border:1.5px solid var(--border);
    border-radius:12px; background:var(--surface-solid); font-family:inherit; font-size:13px;
    line-height:1.6; color:var(--text-primary); outline:none; resize:vertical;
    box-sizing:border-box; transition:border-color 0.25s ease, box-shadow 0.25s ease;
}
.book-add-paste::placeholder { color:var(--text-muted); }
.book-add-paste:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(201,176,168,0.12); }
.book-add-footer { margin-top:20px; }
.book-add-submit {
    width:100%; padding:13px; border:none; border-radius:24px;
    background:var(--accent-rose); color:#fff; cursor:pointer;
    font-family:inherit; font-size:14px; font-weight:600; letter-spacing:1px;
    box-shadow:0 4px 14px rgba(201,168,168,0.3);
    transition:background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.book-add-submit:hover { background:var(--rose-dark); transform:translateY(-1px); box-shadow:0 6px 18px rgba(201,168,168,0.38); }
.book-add-submit:active { transform:scale(0.98); }
.book-add-submit:disabled { background:var(--border); color:var(--text-muted); box-shadow:none; cursor:not-allowed; }

/* ---- 书签浮动按钮 ---- */
.bookmark-float-btn {
    /* ★ 2026-10：跟着阅读器一起抬（原来是 260） */
    position:fixed; z-index:1551; display:flex; align-items:center; gap:6px;
    padding:8px 14px; background:#f5f0e8; border:1.5px solid #c9b896;
    border-radius:20px; font-size:13px; font-weight:500; color:#7a6040;
    cursor:pointer; box-shadow:0 4px 16px rgba(0,0,0,0.12);
    font-family:var(--font-decorative); font-style:italic;
    animation:popIn 0.2s cubic-bezier(0.34,1.56,0.64,1);
    user-select:none; -webkit-user-select:none;
}
.bookmark-float-btn:hover { background:#ede6d8; transform:translateY(-1px); box-shadow:0 6px 20px rgba(0,0,0,0.15); }

/* ===== 摇铃二次确认弹窗 ===== */
.br-bell-confirm-overlay {
    position: fixed; inset: 0; z-index: 1560;
    background: rgba(30,25,20,0.35);
}
.br-bell-confirm {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%) scale(0.9);
    z-index: 1561; background: var(--bg-chat);
    border-radius: 18px; padding: 28px 24px 22px;
    width: 280px; text-align: center;
    box-shadow: 0 8px 32px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    opacity: 0; pointer-events: none;
    transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), opacity 0.2s ease;
}
.br-bell-confirm.open { opacity: 1; pointer-events: auto; transform: translate(-50%,-50%) scale(1); }
.br-bell-confirm-icon {
    display: flex; align-items: center; justify-content: center;
    width: 52px; height: 52px; margin: 0 auto 14px; border-radius: 50%;
    background: rgba(201,168,168,0.12); color: var(--accent-rose);
}
.br-bell-confirm-text {
    font-size: 14px; color: var(--text-primary); line-height: 1.7; margin-bottom: 18px;
    letter-spacing: 0.3px;
}
.br-bell-confirm-text span {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-weight: 600; color: var(--accent-rose);
}
.br-bell-confirm-actions { display: flex; gap: 10px; justify-content: center; }
.br-bell-confirm-cancel {
    padding: 8px 24px; border: 1px solid var(--border); border-radius: 20px;
    background: transparent; color: var(--text-secondary); cursor: pointer;
    font-family: inherit; font-size: 13px; transition: all 0.2s ease;
}
.br-bell-confirm-cancel:hover { border-color: var(--text-muted); color: var(--text-primary); }
.br-bell-confirm-ok {
    padding: 8px 24px; border: none; border-radius: 20px;
    background: var(--rose-dark, #A88080);
    color: #fff; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 500;
    box-shadow: var(--shadow-sm);
    transition: all 0.2s ease;
}
.br-bell-confirm-ok:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(200,160,160,0.4); }

/* ===== 划底已读气泡 ===== */
.br-read-marker {
    text-align: center; padding: 20px 0 10px;
    animation: readMarkerIn 0.4s ease forwards;
}
@keyframes readMarkerIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.br-read-marker-bubble {
    display: inline-block; padding: 8px 18px;
    background: rgba(201,168,168,0.12);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(201,168,168,0.2);
    border-radius: 20px; font-size: 13px; color: var(--accent-rose);
    cursor: pointer; letter-spacing: 0.3px;
    transition: all 0.2s ease;
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
}
.br-read-marker-bubble:hover {
    background: rgba(201,168,168,0.2); border-color: rgba(201,168,168,0.35);
    transform: translateY(-1px);
}

/* 暗色适配 */
[data-theme-mode="dark"] .br-bell-confirm { background: #2a2520; }
[data-theme-mode="dark"] .br-read-marker-bubble { background: rgba(201,168,168,0.08); }

/* ===== 迷你阅读日历入口（书架顶部） ===== */
.reading-calendar-mini {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 14px; margin: 8px 12px 0;
    background: var(--surface-solid); border: 1px solid var(--border);
    border-radius: 12px; cursor: pointer;
    box-shadow: var(--shadow-xs); transition: all 0.2s ease;
}
.reading-calendar-mini:hover { box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.reading-calendar-mini-icon {
    width: 36px; height: 36px; border-radius: 10px;
    background: rgba(201,168,168,0.1); display: flex; align-items: center; justify-content: center;
    color: var(--accent-rose); flex-shrink: 0;
}
.reading-calendar-mini-body { flex: 1; min-width: 0; }
.reading-calendar-mini-title { font-size: 13px; font-weight: 500; color: var(--text-primary); letter-spacing: 0.3px; }
.reading-calendar-mini-sub {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-size: 10px; color: var(--text-muted); letter-spacing: 0.5px; margin-top: 1px;
}
.reading-calendar-mini-heat { display: flex; gap: 3px; flex-shrink: 0; }
.reading-calendar-mini-dot {
    width: 8px; height: 8px; border-radius: 2px;
    background: var(--divider);
}
.reading-calendar-mini-dot.both { background: linear-gradient(135deg, var(--accent-rose) 50%, var(--sage, #A8B8A0) 50%); }
.reading-calendar-mini-dot.ann { background: var(--accent-rose); }
.reading-calendar-mini-dot.ch { background: var(--sage, #A8B8A0); }
.reading-calendar-mini-dot.single { background: rgba(201,168,168,0.35); }
.bookmark-float-btn svg { stroke:#c9b896; flex-shrink:0; }

/* ===== 阅读日历详情浮层（月视图） ===== */
.rc-overlay {
    position: fixed; inset: 0; z-index: 1600;
    display: none; align-items: center; justify-content: center;
    background: rgba(30, 28, 26, 0.4);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    padding: 20px 14px;
}
.rc-overlay.show { display: flex; animation: overlayFadeIn 0.2s ease; }
.rc-panel {
    width: 100%; max-width: 420px; max-height: 86vh;
    display: flex; flex-direction: column;
    background: var(--bg-primary, #F8F4EF);
    border-radius: 18px; overflow: hidden;
    box-shadow: 0 2px 8px rgba(30,28,26,0.12), 0 18px 50px rgba(30,28,26,0.28);
    animation: popIn 0.24s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.rc-header {
    display: flex; align-items: center; gap: 6px;
    padding: 14px 14px 10px;
    border-bottom: 1px solid rgba(196, 168, 106, 0.22);
}
.rc-title-wrap { flex: 1; text-align: center; }
.rc-title { display: block; font-size: 16px; font-weight: 600; letter-spacing: 1px; color: var(--text-primary); }
.rc-title-en {
    display: block; font-family: 'Playfair Display', serif; font-style: italic;
    font-size: 10px; color: var(--gold, #C4A86A); opacity: 0.7; letter-spacing: 1px; margin-top: 1px;
}
.rc-nav-btn, .rc-close-btn {
    width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
    border: none; background: transparent; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: var(--text-secondary);
}
.rc-nav-btn:active, .rc-close-btn:active { background: rgba(201,168,168,0.15); }
.rc-grid {
    display: grid; grid-template-columns: repeat(7, 1fr);
    gap: 2px; padding: 10px 12px 4px;
    min-height: 210px; /* 6行月历 + weekday 头，固定高度杜绝切月塌陷 */
}
.rc-grid.rc-fade-in { animation: rcFadeIn 0.35s ease; }
@keyframes rcFadeIn { from { opacity: 0.35; } to { opacity: 1; } }
.rc-loading { grid-column: 1 / -1; text-align: center; padding: 26px 0; font-size: 12px; color: var(--text-muted); }
.rc-weekday { text-align: center; font-size: 10px; color: var(--text-muted); padding: 2px 0 6px; }
.rc-cell {
    aspect-ratio: 1; border-radius: 9px; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    transition: background 0.15s ease;
}
.rc-cell-blank { cursor: default; }
.rc-cell-num { font-size: 12.5px; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.rc-cell.rc-has-data .rc-cell-num { color: var(--text-primary); font-weight: 600; }
.rc-cell.rc-today { box-shadow: inset 0 0 0 1.2px var(--accent-rose); }
.rc-cell.rc-selected { background: rgba(201, 168, 168, 0.18); }
.rc-cell:not(.rc-cell-blank):active { background: rgba(201, 168, 168, 0.12); }
.rc-cell-dots { display: flex; gap: 2px; height: 5px; }
.rc-dot-ch, .rc-dot-ann {
    display: inline-block; width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0;
}
.rc-dot-ch { background: var(--sage, #A8B8A0); }
.rc-dot-ann { background: var(--accent-rose, #C9A8A8); }
.rc-legend {
    display: flex; gap: 16px; justify-content: center;
    padding: 6px 0 8px; font-size: 10.5px; color: var(--text-muted);
    border-bottom: 1px solid rgba(196, 168, 106, 0.16);
}
.rc-legend span { display: inline-flex; align-items: center; gap: 4px; }
.rc-day-detail {
    flex: 1; overflow-y: auto; min-height: 110px; max-height: 240px;
    padding: 12px 16px 16px;
}
.rc-detail-date {
    font-family: 'Playfair Display', var(--font-decorative); font-style: italic;
    font-size: 15px; color: var(--text-primary); margin-bottom: 8px;
}
.rc-detail-empty { text-align: center; padding: 24px 0; font-size: 12px; color: var(--text-muted); }
.rc-detail-section { margin-bottom: 10px; }
.rc-detail-label {
    display: flex; align-items: center; gap: 5px;
    font-size: 11.5px; color: var(--text-secondary); margin-bottom: 5px; letter-spacing: 0.3px;
}
.rc-detail-item {
    font-size: 12.5px; line-height: 1.65; color: var(--text-primary);
    padding: 3px 0 3px 11px; position: relative;
}
.rc-detail-item::before {
    content: ''; position: absolute; left: 2px; top: 11px;
    width: 3px; height: 3px; border-radius: 50%; background: var(--text-muted);
}
.rc-ann-who { color: var(--accent-rose); font-weight: 600; margin-right: 5px; }
.rc-ann-src { color: var(--text-muted); font-size: 11px; margin-left: 5px; }
.rc-detail-more { color: var(--text-muted); font-size: 11.5px; }
.rc-detail-more::before { display: none; }