/* ===== 主题变量 ===== */
:root {
  --reader-font-size: 18px;
  --radius: 10px;
  --serif: "Songti SC", "STSong", "Noto Serif SC", "Source Han Serif SC", "SimSun", serif;
  --sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, sans-serif;
}
:root[data-theme="light"] {
  --bg: #f6f3ec; --panel: #fffef9; --text: #38352e; --muted: #8f887a;
  --accent: #9a6b2f; --accent-strong: #7c5518; --border: #e5decb;
  --link: #7c5518; --hover: #efe8d6; --shadow: 0 1px 4px rgba(80,66,40,.10);
  --btn-bg: #fffef9; --danger: #b04a3a;
}
:root[data-theme="eye"] {
  --bg: #cde6cf; --panel: #ddf0de; --text: #2e3b2e; --muted: #6b7f6b;
  --accent: #3f7a4a; --accent-strong: #2c5a36; --border: #b9d8bb;
  --link: #2c5a36; --hover: #c2e0c4; --shadow: 0 1px 4px rgba(40,70,45,.12);
  --btn-bg: #ddf0de; --danger: #a8443a;
}
:root[data-theme="dark"] {
  --bg: #17191d; --panel: #1f2228; --text: #a9a49a; --muted: #6f6d68;
  --accent: #c9a15f; --accent-strong: #d9b678; --border: #2c3038;
  --link: #c9a15f; --hover: #262a32; --shadow: 0 1px 4px rgba(0,0,0,.4);
  --btn-bg: #1f2228; --danger: #d4726a;
}

/* ===== 基础 ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg); color: var(--text);
  font-family: var(--sans);
  min-height: 100vh;
  transition: background .2s ease, color .2s ease;
}
a { color: var(--link); }

/* ===== 顶栏 ===== */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.header-inner {
  max-width: 880px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 10px 16px; flex-wrap: wrap;
}
.site-title {
  font-family: var(--serif); font-weight: 700; font-size: 20px;
  color: var(--text); text-decoration: none; letter-spacing: .05em;
}
.header-left { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.crumb-sep { color: var(--border); }
.crumb-book {
  color: var(--muted); text-decoration: none; font-size: 14px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40vw;
}
.crumb-book:hover { color: var(--accent-strong); }
.controls { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ctrl-btn {
  border: 1px solid var(--border); background: var(--btn-bg); color: var(--muted);
  border-radius: 999px; padding: 4px 11px; font-size: 12px; cursor: pointer;
  font-family: var(--sans); line-height: 1.6;
}
.ctrl-btn:hover { color: var(--accent-strong); border-color: var(--accent); }
.ctrl-btn.active { background: var(--accent); border-color: var(--accent); color: #fff; }
.ctrl-sep { width: 1px; height: 16px; background: var(--border); margin: 0 2px; }

/* ===== 阅读页 ===== */
.reader { max-width: 760px; margin: 0 auto; padding: 28px 20px 64px; }
.reader h1 {
  font-family: var(--serif); font-size: 26px; text-align: center;
  margin: 20px 0 8px; line-height: 1.5; font-weight: 700;
}
.progress { text-align: center; color: var(--muted); font-size: 13px; margin-bottom: 32px; }
.content p {
  font-family: var(--serif);
  font-size: var(--reader-font-size);
  line-height: 2;
  text-indent: 2em;
  margin-bottom: 1em;
  overflow-wrap: break-word;
}

/* ===== 章节导航 ===== */
.chapter-nav { display: flex; gap: 10px; margin: 24px 0; }
.chapter-nav.bottom { margin-top: 48px; }
.nav-btn {
  flex: 1; text-align: center; padding: 11px 6px;
  border: 1px solid var(--border); border-radius: var(--radius);
  background: var(--panel); color: var(--link);
  text-decoration: none; font-size: 15px; transition: background .15s;
}
.nav-btn:hover { background: var(--hover); border-color: var(--accent); }
.nav-btn.disabled { color: var(--muted); opacity: .5; pointer-events: none; }

/* ===== 首页 Hero ===== */
.hero { max-width: 880px; margin: 0 auto; padding: 56px 20px 24px; text-align: center; }
.hero h1 {
  font-family: var(--serif); font-size: 46px; letter-spacing: .18em;
  margin-bottom: 14px; font-weight: 700;
}
.hero .author { color: var(--muted); font-size: 15px; margin-bottom: 22px; }
.hero .stats {
  display: inline-flex; gap: 16px; color: var(--muted); font-size: 13px;
  border: 1px solid var(--border); border-radius: 999px;
  padding: 6px 18px; background: var(--panel);
}

/* ===== 简介 ===== */
.intro { max-width: 760px; margin: 10px auto 0; padding: 0 20px; }
.intro-card {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 20px 24px; box-shadow: var(--shadow);
}
.intro-card h2 { font-size: 15px; color: var(--accent-strong); margin-bottom: 10px; }
.intro-card p {
  font-family: var(--serif); font-size: 15px; line-height: 1.9;
  text-indent: 2em; color: var(--text); margin-bottom: .4em;
}
.continue-wrap { max-width: 760px; margin: 22px auto 0; padding: 0 20px; text-align: center; }
.continue-btn {
  display: inline-block; background: var(--accent); color: #fff !important;
  text-decoration: none; padding: 11px 28px; border-radius: 999px; font-size: 15px;
  box-shadow: var(--shadow);
}
.continue-btn:hover { background: var(--accent-strong); }

/* ===== 目录 ===== */
.toc-section { max-width: 880px; margin: 28px auto 40px; padding: 0 16px; }
.toc-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.toc-head h2 { font-size: 20px; font-family: var(--serif); white-space: nowrap; }
#toc-search, #book-search {
  flex: 1; padding: 10px 16px; font-size: 15px;
  border: 1px solid var(--border); border-radius: 999px;
  background: var(--panel); color: var(--text); outline: none;
}
#toc-search:focus, #book-search:focus { border-color: var(--accent); }
#toc-search::placeholder, #book-search::placeholder { color: var(--muted); }
.toc details {
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius); margin-bottom: 10px; overflow: hidden;
}
.toc summary {
  cursor: pointer; padding: 13px 18px; font-size: 14px; color: var(--muted);
  list-style: none; display: flex; justify-content: space-between; align-items: center;
  user-select: none;
}
.toc summary::-webkit-details-marker { display: none; }
.toc summary::after { content: "▸"; transition: transform .15s; font-size: 12px; }
.toc details[open] summary::after { transform: rotate(90deg); }
.toc summary:hover { color: var(--accent-strong); }
.toc ul {
  list-style: none; display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 2px; padding: 2px 10px 14px;
}
.toc li a {
  display: block; padding: 8px 10px; border-radius: 6px; text-decoration: none;
  color: var(--text); font-size: 14px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.toc li a:hover { background: var(--hover); color: var(--accent-strong); }
.toc-empty { text-align: center; color: var(--muted); padding: 40px 0; font-size: 14px; display: none; }

/* ===== 页脚 ===== */
.site-footer {
  text-align: center; color: var(--muted); font-size: 12px;
  padding: 28px 16px; border-top: 1px solid var(--border); margin-top: 30px;
  line-height: 1.9;
}

/* ===== 回到顶部 ===== */
.to-top {
  position: fixed; right: 20px; bottom: 28px; width: 42px; height: 42px;
  border-radius: 50%; border: 1px solid var(--border);
  background: var(--panel); color: var(--muted); cursor: pointer;
  box-shadow: var(--shadow); opacity: 0; pointer-events: none;
  transition: opacity .2s; font-size: 16px; z-index: 60;
}
.to-top.show { opacity: .92; pointer-events: auto; }
.to-top:hover { color: var(--accent-strong); border-color: var(--accent); }

/* ===== 小屏适配 ===== */
@media (max-width: 560px) {
  .hero h1 { font-size: 34px; }
  .reader h1 { font-size: 22px; }
  .toc ul { grid-template-columns: 1fr; }
  .toc-head { flex-direction: column; align-items: stretch; }
  .toc-head h2 { text-align: center; }
  .book-grid { grid-template-columns: 1fr; }
}

/* ===== 密码解锁页 ===== */
.lock-wrap {
  min-height: 68vh; display: flex; align-items: center; justify-content: center;
  padding: 40px 20px;
}
.lock-card {
  background: var(--panel); border: 1px solid var(--border); border-radius: 16px;
  box-shadow: var(--shadow); padding: 42px 36px 34px;
  max-width: 380px; width: 100%; text-align: center;
}
.lock-icon { font-size: 42px; margin-bottom: 10px; }
.lock-card h1 {
  font-family: var(--serif); font-size: 26px; letter-spacing: .12em; margin-bottom: 10px;
}
.lock-tip { color: var(--muted); font-size: 14px; margin-bottom: 26px; }
#unlock-form { display: flex; flex-direction: column; gap: 12px; }
#unlock-password {
  padding: 12px 16px; font-size: 15px; text-align: center; letter-spacing: .06em;
  border: 1px solid var(--border); border-radius: 10px;
  background: var(--bg); color: var(--text); outline: none;
}
#unlock-password:focus { border-color: var(--accent); }
.unlock-btn {
  padding: 12px; font-size: 15px; border: none; border-radius: 10px;
  background: var(--accent); color: #fff; cursor: pointer; letter-spacing: .3em;
  text-indent: .3em; font-family: var(--sans);
}
.unlock-btn:hover { background: var(--accent-strong); }
.unlock-btn:disabled { opacity: .6; cursor: default; }
.unlock-error { color: var(--danger); font-size: 13px; margin-top: 14px; }
.locked-tip { text-align: center; color: var(--muted); padding: 80px 0; font-size: 14px; }

/* ===== 书架（书列表） ===== */
.book-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 14px;
}
.book-card {
  display: flex; gap: 16px; align-items: stretch;
  background: var(--panel); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 16px;
  text-decoration: none; color: var(--text); box-shadow: var(--shadow);
  transition: transform .15s ease, border-color .15s ease;
}
.book-card:hover { transform: translateY(-2px); border-color: var(--accent); }
.cover {
  flex: none; width: 86px; min-height: 116px; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-family: var(--serif); font-weight: 700; font-size: 17px;
  letter-spacing: .2em; padding: 10px 6px; text-align: center;
  writing-mode: vertical-rl; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.cover.c0 { background: linear-gradient(135deg, #8c6d3f, #b8955a); }
.cover.c1 { background: linear-gradient(135deg, #3f7a4a, #63a06e); }
.cover.c2 { background: linear-gradient(135deg, #5a6b8c, #7d8fb3); }
.cover.c3 { background: linear-gradient(135deg, #8c4a4a, #b36a6a); }
.cover.c4 { background: linear-gradient(135deg, #6b4a8c, #9070b3); }
.cover.c5 { background: linear-gradient(135deg, #3f6f7a, #62a0ad); }
.book-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.book-info h2 { font-size: 17px; font-family: var(--serif); margin-bottom: 6px; }
.book-meta { color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.book-intro {
  font-size: 13px; color: var(--muted); line-height: 1.7;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
