/* ===== 语文桥 · 阅读页「伴读右栏 / 目录右板」（试点 demo v3） =====
 * v3：伴读回到最右侧常驻栏（300px，可收合细轨）；目录右侧滑出面板与伴读同宽（300px），
 * 鼠标离开 2 秒自动收缩；悬停金线框延续
 */

/* 左栏章节目录隐藏（目录由右侧滑出面板接管） */
body .reader-aside-left { display: none !important; }

/* ===== 伴读右栏（最右侧常驻） ===== */
.reader > .reader-aside-right {
  position: sticky; top: 113px;
  width: 300px; flex-shrink: 0; align-self: flex-start;
  max-height: calc(100vh - 130px);
  display: flex; flex-direction: column; gap: 14px;
  overflow-y: auto;
  scrollbar-width: none;
}
.reader > .reader-aside-right::-webkit-scrollbar { width: 0; height: 0; }

/* 伴读栏头（标题 + 目录入口 + 收合钮） */
.rp-ban-head {
  display: flex; align-items: center; gap: 8px;
  padding: 2px 6px 0;
}
.rp-ban-title {
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", Georgia, serif;
  font-size: 14px; font-weight: 800; letter-spacing: .12em;
  color: var(--text, #3a3428);
  border-left: 3px solid #c9a84c; padding-left: 8px;
}
.rp-ban-toc {
  margin-left: auto;
  border: 1px solid var(--border, #d8cfae); border-radius: 7px;
  background: transparent; color: var(--text-secondary, #6b6350);
  padding: 3px 9px; line-height: 1.3;
  font-size: 12px; cursor: pointer; font-family: inherit;
  transition: box-shadow .18s, color .15s, border-color .15s;
}
.rp-ban-toc:hover { color: #a8832a; border-color: #c9a84c; box-shadow: inset 0 0 0 1px rgba(201,168,76,.55), 0 0 10px rgba(201,168,76,.18); }
.rp-ban-fold {
  border: 1px solid var(--border, #d8cfae); border-radius: 7px;
  background: transparent; color: var(--text-secondary, #6b6350);
  width: 24px; height: 24px; padding: 0; line-height: 1;
  font-size: 13px; cursor: pointer; font-family: inherit;
  transition: box-shadow .18s, color .15s, border-color .15s;
}
.rp-ban-fold:hover { color: #a8832a; border-color: #c9a84c; box-shadow: inset 0 0 0 1px rgba(201,168,76,.55), 0 0 10px rgba(201,168,76,.18); }

/* 伴读卡片：悬停金线框 */
.reader > .reader-aside-right .aside-card { transition: border-color .18s, box-shadow .18s, transform .18s; }
.reader > .reader-aside-right .aside-card:hover {
  border: 1px solid rgba(201,168,76,.7);
  box-shadow: 0 0 0 1px rgba(201,168,76,.35), 0 8px 22px rgba(201,168,76,.14);
  transform: translateY(-1px);
}

/* 伴读收合后的细轨（贴最右） */
.rp-ban-rail {
  display: none;
  position: sticky; top: 113px; align-self: flex-start;
  width: 30px; flex-shrink: 0;
  border: 1px dashed var(--border, #d8cfae); border-radius: 10px;
  background: var(--surface-card, #efe8d3);
  padding: 12px 4px; cursor: pointer;
  box-shadow: var(--shadow-card, 0 2px 8px rgba(0,0,0,.06));
  transition: border-color .15s, box-shadow .18s;
}
.rp-ban-rail:hover { border-color: #c9a84c; box-shadow: 0 0 0 1px rgba(201,168,76,.4), 0 0 12px rgba(201,168,76,.18); }
.rp-ban-rail span {
  writing-mode: vertical-rl; letter-spacing: 3px;
  font-size: 12px; color: var(--text-secondary, #6b6350);
  display: block; margin: 0 auto;
}
body.rp-ban-closed .reader > .reader-aside-right { display: none !important; }
body.rp-ban-closed .rp-ban-rail { display: block; }

/* 平板/小屏：伴读栏与细轨让位正文（沿用原站 ≤1100px 隐藏规则） */
@media (max-width: 1100px) {
  .rp-ban-rail { display: none !important; }
}
/* 手机：伴读栏回正文下方通栏（沿用原站 ≤640px 规则），栏头隐藏 */
@media (max-width: 640px) {
  .rp-ban-head { display: none; }
  body.rp-ban-closed .reader > .reader-aside-right { display: flex !important; }
  body.rp-ban-closed .rp-ban-rail { display: none !important; }
}

/* ===== 目录右侧滑出面板（与伴读同宽 300px，鼠标离开 2s 自动收缩） ===== */
.rp-panel {
  position: fixed; top: 52px; right: 0; bottom: 0;
  width: 300px; max-width: 92vw;
  background: var(--page-bg, #f5f1e6);
  border-left: 1px solid var(--border, #d8cfae);
  box-shadow: -8px 0 24px rgba(0, 0, 0, .18);
  z-index: 1000;
  display: flex; flex-direction: column;
  transform: translateX(102%);
  transition: transform .25s ease;
  font-family: var(--font-sans, -apple-system, 'Segoe UI', sans-serif);
}
.rp-panel.open { transform: translateX(0); }

.rp-head {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border, #d8cfae);
  background: var(--card-bg, #efe8d3);
}
.rp-title {
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", Georgia, serif;
  font-size: 15px; font-weight: 800; letter-spacing: .1em;
  color: var(--text, #3a3428);
  border-left: 3px solid #c9a84c; padding-left: 9px;
}
.rp-close {
  margin-left: auto; border: 1px solid transparent; background: none; border-radius: 7px;
  font-size: 16px; line-height: 1; padding: 4px 7px; cursor: pointer;
  color: var(--text-secondary, #6b6350);
  transition: box-shadow .18s, color .15s;
}
.rp-close:hover { color: #a8832a; box-shadow: inset 0 0 0 1px rgba(201,168,76,.55); }

.rp-body { flex: 1; overflow: hidden; display: flex; flex-direction: column; min-height: 0; }
.rp-pane { flex: 1; overflow-y: auto; min-height: 0; }

.rp-navrow {
  display: flex; gap: 8px; padding: 8px 14px;
  position: sticky; top: 0; z-index: 2;
  background: var(--page-bg, #f5f1e6);
  border-bottom: 1px dashed var(--border, #d8cfae);
}
.rp-navrow a {
  flex: 1; text-align: center; padding: 6px 0;
  border: 1px solid var(--border, #d8cfae); border-radius: 8px;
  font-size: 13px; text-decoration: none;
  color: var(--text-secondary, #6b6350);
  transition: border-color .15s, color .15s, box-shadow .18s;
}
.rp-navrow a:hover { border-color: #c9a84c; color: #a8832a; box-shadow: 0 0 10px rgba(201,168,76,.16); }
.rp-navrow a.dis { opacity: .35; pointer-events: none; }

.rp-filter {
  width: calc(100% - 28px); margin: 8px 14px; padding: 6px 10px;
  border: 1px solid var(--border, #d8cfae); border-radius: 8px;
  font-size: 13px; background: var(--card-bg, #efe8d3); color: inherit;
  box-sizing: border-box; font-family: inherit;
  transition: border-color .15s, box-shadow .18s;
}
.rp-filter:focus { outline: none; border-color: #c9a84c; box-shadow: 0 0 0 2px rgba(201,168,76,.18); }

.rp-pane .toc-title {
  position: sticky; top: 0; z-index: 2;
  background: var(--page-bg, #f5f1e6);
  padding: 10px 14px 6px; margin: 0;
  font-size: 14px; color: var(--text-secondary, #6b6350);
}
.rp-pane .toc-list { list-style: none; margin: 0; padding: 0 0 20px; }
.rp-pane .toc-list li a {
  display: flex; gap: 8px; padding: 7px 12px; margin: 1px 8px;
  border-radius: 7px;
  font-size: 13px; color: var(--text, #3a3428);
  text-decoration: none; border-left: 3px solid transparent;
  box-shadow: inset 0 0 0 1px transparent;
  transition: background .15s, box-shadow .18s, color .15s;
}
.rp-pane .toc-list li a:hover {
  background: rgba(201, 168, 76, .08);
  box-shadow: inset 0 0 0 1px rgba(201, 168, 76, .55), 0 0 10px rgba(201,168,76,.12);
}
.rp-pane .toc-list li a.active {
  border-left-color: var(--cp-accent, #c97644);
  background: rgba(201, 118, 68, .12);
  font-weight: 600;
}
.rp-pane .toc-num { color: var(--text-secondary, #6b6350); font-variant-numeric: tabular-nums; }

/* 悬浮开关（右缘） */
.rp-toggle {
  position: fixed; right: 0; top: 50%; transform: translateY(-50%);
  z-index: 1100;
  border: 1px solid var(--border, #d8cfae); border-right: none;
  border-radius: 10px 0 0 10px;
  background: var(--card-bg, #efe8d3);
  color: var(--text-secondary, #6b6350);
  padding: 10px 8px; font-size: 13px; cursor: pointer;
  box-shadow: -4px 0 12px rgba(0, 0, 0, .12);
  font-family: inherit; line-height: 1.4;
  transition: border-color .15s, box-shadow .18s, color .15s;
}
.rp-toggle:hover { border-color: #c9a84c; color: #a8832a; box-shadow: -4px 0 14px rgba(201,168,76,.25); }
.rp-toggle span { writing-mode: vertical-rl; letter-spacing: 2px; display: block; margin-top: 4px; }

@media (max-width: 820px) {
  .rp-panel { width: 100vw; max-width: 100vw; }
  .rp-toggle { padding: 8px 6px; }
}

/* ===== 伴读卡片折叠（v3.2） ===== */
.reader > .reader-aside-right .aside-card.rp-fold .ac-head { cursor: pointer; user-select: none; -webkit-user-select: none; }
.reader > .reader-aside-right .aside-card.rp-fold .ac-head::after {
  content: '\25BE'; margin-left: 2px; align-self: center;
  font-size: 11px; color: var(--text-secondary, #6b6350);
  transition: transform .18s;
}
.reader > .reader-aside-right .aside-card.rp-fold.rp-folded .ac-head::after { content: '\25B8'; }
.reader > .reader-aside-right .aside-card.rp-fold.rp-folded > :not(.ac-head) { display: none; }
.reader > .reader-aside-right .aside-card.rp-fold .ac-head:hover .ac-ic { background: var(--orange-tint, rgba(201,168,76,.14)); }

/* ===== v3.3：兼容旧版 fixed 布局模板（水浒/三国等） ===== */
/* 旧模板 .reader-aside-right 为 fixed 并带 right 偏移，置 sticky 后须清掉左右偏移 */
body .reader > .reader-aside-right { left: auto; right: auto; top: 16px; }
/* 旧模板 .reader 非 flex，右栏无法就靠；切 flex 并排 */
body .reader { display: flex; gap: 28px; align-items: flex-start; }
/* 旧模板用 margin 给左右栏预留的位置清零（左栏已被本面板接管隐藏） */
body .reader-main { margin-left: 0; margin-right: 0; max-width: none; }