/* ==========================================================================
   RiskWeb · 个人阅读系统 页面样式（前缀 rs-）
   ========================================================================== */

.rs-main { max-width: 880px; }

/* hero lead 不换行（窄面板/手机也保持一行） */
.page-hero .lead {
  white-space: nowrap;
  font-size: clamp(0.7rem, 1.95vw, 1.05rem);
  max-width: none;
}

/* ---- 四段卡片 ---- */
.rs-sec { margin-bottom: 1.4rem; padding: 1.6rem 1.7rem; }

.rs-sub { font-size: 1.05rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.55rem; }
.rs-no {
  display: inline-block; min-width: 1.7em; text-align: center;
  background: var(--life, #2f7d5d); color: #fff;
  border-radius: 6px; font-size: 0.8rem; padding: 0.12em 0.35em;
}
.rs-sec-lead { font-size: 0.92rem; color: var(--muted, #667); margin: -0.4rem 0 0.9rem; }

/* ---- 表单 ---- */
.rs-form { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-bottom: 0.9rem; }
.rs-form input[type="text"] {
  flex: 1 1 200px; min-width: 0;
  border: 1px solid var(--line, #dde3e0); border-radius: 8px;
  padding: 0.55rem 0.75rem; font-size: 0.95rem; background: #fff;
}
.rs-form input[type="text"]:focus { outline: 2px solid rgba(47, 125, 93, 0.25); border-color: var(--life, #2f7d5d); }
.rs-form select {
  flex: 0 1 200px; min-width: 0;
  border: 1px solid var(--line, #dde3e0); border-radius: 8px;
  padding: 0.55rem 0.6rem; font-size: 0.92rem; background: #fff; color: inherit;
}
.rs-addbtn { padding: 0.55rem 1.1rem; font-size: 0.92rem; white-space: nowrap; }

/* ---- 书单 ---- */
.rs-filter { display: flex; gap: 0.45rem; flex-wrap: wrap; margin-bottom: 0.7rem; }
.rs-ft {
  border: 1px solid var(--line, #dde3e0); background: #fff; color: var(--ink, #223);
  border-radius: 999px; padding: 0.28rem 0.9rem; font-size: 0.85rem; cursor: pointer;
}
.rs-ft.on { background: var(--life, #2f7d5d); border-color: var(--life, #2f7d5d); color: #fff; }

.rs-count { font-size: 0.85rem; color: var(--muted, #667); margin-bottom: 0.6rem; }

.rs-book {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.55rem 0.2rem; border-bottom: 1px dashed var(--line, #e4e9e6);
}
.rs-book:last-child { border-bottom: 0; }
.rs-book-title { font-size: 0.97rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-book-author { font-size: 0.82rem; color: var(--muted, #667); white-space: nowrap; }
.rs-done-date { font-size: 0.78rem; color: var(--life, #2f7d5d); white-space: nowrap; }

.rs-st {
  flex: 0 0 auto; border: 0; border-radius: 999px; cursor: pointer;
  font-size: 0.78rem; padding: 0.22rem 0.7rem; color: #fff; min-width: 3.2em;
}
.st-want    { background: #8a94a6; }
.st-reading { background: #d08a2e; }
.st-done    { background: var(--life, #2f7d5d); }

.rs-del {
  margin-left: auto; flex: 0 0 auto;
  border: 0; background: transparent; color: #b0654f;
  font-size: 1.05rem; cursor: pointer; line-height: 1; padding: 0.15rem 0.35rem;
}
.rs-del:hover { color: #8f3f26; }

/* ---- 笔记 ---- */
.rs-notes-head { display: flex; align-items: center; gap: 0.8rem; margin-bottom: 0.7rem; }
.rs-notes-head select {
  flex: 1 1 auto; max-width: 340px;
  border: 1px solid var(--line, #dde3e0); border-radius: 8px;
  padding: 0.5rem 0.6rem; font-size: 0.95rem; background: #fff; color: inherit;
}
.rs-saved { font-size: 0.8rem; color: var(--life, #2f7d5d); white-space: nowrap; }
#noteArea {
  width: 100%; box-sizing: border-box; resize: vertical;
  border: 1px solid var(--line, #dde3e0); border-radius: 10px;
  padding: 0.8rem 0.9rem; font-size: 0.95rem; line-height: 1.7; background: #fff;
  font-family: inherit;
}
#noteArea:focus { outline: 2px solid rgba(47, 125, 93, 0.25); border-color: var(--life, #2f7d5d); }
#noteArea:disabled { background: var(--soft, #f5f7f6); color: var(--muted, #667); }
.rs-hint { font-size: 0.85rem; color: var(--muted, #667); margin-top: 0.5rem; }

/* ---- 金句 ---- */
.rs-quote {
  position: relative; padding: 0.65rem 2.2rem 0.65rem 0.9rem;
  border-left: 3px solid var(--life, #2f7d5d);
  background: var(--soft, #f5f7f6); border-radius: 0 8px 8px 0;
  margin-bottom: 0.55rem;
}
.rs-quote-text { font-size: 0.95rem; line-height: 1.65; }
.rs-src { font-size: 0.8rem; color: var(--muted, #667); }
.rs-quote .rs-del { position: absolute; top: 0.45rem; right: 0.5rem; margin-left: 0; }

/* ---- 行动灵感板 ---- */
.rs-act {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.55rem 0.2rem; border-bottom: 1px dashed var(--line, #e4e9e6);
}
.rs-act:last-child { border-bottom: 0; }
.rs-act.on .rs-act-text { color: var(--muted, #667); text-decoration: line-through; }
.rs-act-text { font-size: 0.95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rs-chk {
  flex: 0 0 auto; width: 1.25rem; height: 1.25rem;
  border: 2px solid var(--life, #2f7d5d); border-radius: 50%;
  background: #fff; color: var(--life, #2f7d5d);
  font-size: 0.8rem; line-height: 1; cursor: pointer; padding: 0;
}
.rs-act.on .rs-chk { background: var(--life, #2f7d5d); color: #fff; }

/* ---- 空态 / 操作区 ---- */
.rs-empty { font-size: 0.9rem; color: var(--muted, #667); padding: 0.4rem 0; }

.rs-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin: 1.6rem 0 0.8rem; }
.rs-privacy { font-size: 0.82rem; color: var(--muted, #667); }

/* ---- 使用建议区微调 ---- */
.rs-usage .card h3 { font-size: 1.02rem; }

/* ---- 窄屏 ---- */
@media (max-width: 640px) {
  .rs-sec { padding: 1.2rem 1rem; }
  .rs-form select { flex: 1 1 100%; }
  .rs-book-title, .rs-act-text { white-space: normal; }
}

/* 窄屏允许 lead 换行：单行 nowrap 在移动端会横向溢出（2026-09-22 全站视觉打磨） */
@media (max-width: 680px) {
  .page-hero .lead,
  .lead { white-space: normal; }
}

/* 书卡与金句上的「排复习」按钮（2026-11-05） */
.rs-book-title { flex: 1 1 auto; min-width: 0; }
.rs-book-author, .rs-done-date { flex: 0 0 auto; }
.rs-book .rs-rev { flex: 0 0 auto; margin-left: auto; }
.rs-book .rs-del { margin-left: 0.2rem; }
.rs-quote .rs-rev { margin-top: 0.35rem; }