/* 小说阅读页样式 */
.read-wrapper { max-width: 900px; margin: 20px auto; padding: 0 20px; }
.read-header { background: white; border-radius: 12px; padding: 24px; margin-bottom: 16px; }
.read-header h1 { font-size: 20px; margin: 0 0 8px; }
.read-meta { font-size: 14px; color: #888; }
.read-meta span { margin-right: 16px; }
.read-body { background: white; border-radius: 12px; padding: 40px 48px; line-height: 1.9; font-size: 16px; color: #333; }
.read-body p { margin-bottom: 1.2em; text-indent: 2em; }
.chapter-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 20px; padding: 16px; background: white; border-radius: 12px; }
.chapter-nav a { padding: 8px 20px; background: #f0f0f0; border-radius: 8px; color: #666; text-decoration: none; font-size: 14px; }
.chapter-nav a:hover { background: #1890ff; color: white; }
.chapter-list { background: white; border-radius: 12px; padding: 20px; margin-top: 20px; }
.chapter-list h3 { font-size: 16px; margin-bottom: 16px; }
.cl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.cl-item { padding: 8px 12px; background: #f9f9f9; border-radius: 6px; text-align: center; font-size: 13px; color: #666; cursor: pointer; text-decoration: none; }
.cl-item:hover { background: #e6f7ff; color: #1890ff; }
.cl-item.cur { background: #1890ff; color: white; }
.cl-item.vip { background: #fff7e6; color: #fa8c16; }

/* VIP锁定 */
.vip-lock { background: linear-gradient(135deg, #fff7e6, #ffe7b6); border: 2px solid #ffa940; border-radius: 16px; padding: 40px; text-align: center; margin: 20px 0; }
.vip-lock .icon { font-size: 60px; margin-bottom: 16px; }
.vip-lock h3 { color: #d46b00; font-size: 20px; margin-bottom: 12px; }
.vip-lock p { color: #8c6a3d; font-size: 14px; margin-bottom: 20px; }
.vip-lock .btn-vip { background: linear-gradient(135deg, #ff8c00, #ff5500); color: white; padding: 12px 32px; border: none; border-radius: 24px; font-size: 16px; cursor: pointer; font-weight: 600; text-decoration: none; display: inline-block; }
.vip-lock .btn-vip:hover { opacity: 0.9; }

/* 打赏区 */
.reward-bar { background: white; border-radius: 12px; padding: 16px 24px; margin-top: 20px; display: flex; align-items: center; gap: 12px; }
.reward-bar .label { font-size: 14px; color: #666; }
.reward-btn { padding: 8px 20px; background: linear-gradient(135deg, #ff6b6b, #ee5a5a); color: white; border: none; border-radius: 20px; font-size: 14px; cursor: pointer; text-decoration: none; display: inline-block; }
.reward-btn:hover { opacity: 0.85; }

/* 打赏弹窗 */
.reward-modal { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6); z-index: 9999; align-items: center; justify-content: center; }
.reward-modal.show { display: flex; }
.reward-modal-content { background: white; border-radius: 20px; padding: 32px; width: 360px; max-width: 90%; }
.reward-modal-content h3 { font-size: 18px; text-align: center; margin-bottom: 20px; color: #333; }
.reward-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.reward-option { padding: 16px; border: 2px solid #e8e8e8; border-radius: 12px; text-align: center; cursor: pointer; transition: all 0.2s; }
.reward-option:hover { border-color: #ff6b6b; }
.reward-option.selected { border-color: #ff6b6b; background: #fff0f0; }
.reward-option .amount { font-size: 20px; font-weight: 700; color: #ff6b6b; }
.reward-option .unit { font-size: 12px; color: #999; }
.reward-modal-content .btn-confirm { width: 100%; padding: 14px; background: linear-gradient(135deg, #ff6b6b, #ee5a5a); color: white; border: none; border-radius: 12px; font-size: 16px; cursor: pointer; }
.reward-modal-content .btn-confirm:disabled { background: #ccc; cursor: not-allowed; }
.reward-modal-content .btn-close { width: 100%; padding: 10px; background: #f0f0f0; color: #666; border: none; border-radius: 8px; font-size: 14px; cursor: pointer; margin-top: 8px; }
.reward-msg { background: #f6ffed; border: 1px solid #b7eb8f; color: #52c41a; padding: 10px 16px; border-radius: 8px; font-size: 14px; margin-bottom: 16px; text-align: center; }
