/* fiction 皮肤 — M2 最小可读版。中文长文排版的精修属 M4（字号阶梯、暗色微调、
   窄屏细节都在那一步定稿），这里先把「能舒服读完一章」的底线立住。 */

:root {
  --bg: #faf7f0;
  --ink: #2b2620;
  --muted: #8a8177;
  --line: rgba(43, 38, 32, 0.12);
  --accent: #7a5c3e;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #191613;
    --ink: #d8d2c8;
    --muted: #7d766c;
    --line: rgba(216, 210, 200, 0.14);
    --accent: #b39069;
  }
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Songti SC", "Noto Serif CJK SC", serif;
  line-height: 1.9;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

main { max-width: 38rem; margin: 0 auto; padding: 3rem 1.25rem 4rem; }

/* —— 书架 —— */
.shelf h1 { font-size: 1.5rem; letter-spacing: 0.2em; }
.shelf-tagline { color: var(--muted); margin-top: -0.5rem; }
.shelf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}
.book-card { display: block; color: inherit; }
.book-card:hover { text-decoration: none; }
.book-cover {
  display: grid;
  place-items: center;
  aspect-ratio: 2 / 3;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: color-mix(in srgb, var(--bg) 92%, var(--ink));
  overflow: hidden;
}
.book-cover img { width: 100%; height: 100%; object-fit: cover; }
.book-cover--pending span {
  writing-mode: vertical-rl;
  letter-spacing: 0.5em;
  color: var(--muted);
  font-size: 1.1rem;
}
.book-title { display: block; margin-top: 0.6rem; }
.book-status { display: block; font-size: 0.8rem; color: var(--muted); }
.book-card--placeholder .book-cover { border-style: dashed; background: none; }

/* —— 书页 —— */
.book-head { display: flex; gap: 1.5rem; align-items: flex-start; }
.book-cover--page { flex: 0 0 9rem; }
.book-meta h1 { font-size: 1.6rem; margin: 0 0 0.5rem; letter-spacing: 0.1em; }
.badge {
  font-size: 0.75rem;
  border: 1px solid var(--accent);
  color: var(--accent);
  border-radius: 999px;
  padding: 0.1em 0.7em;
  margin-right: 0.5em;
}
.book-status { color: var(--muted); }
.cast-note { color: var(--muted); font-size: 0.9rem; }
.book-note {
  margin-top: 2rem;
  padding: 0.75rem 1rem;
  border-left: 2px solid var(--line);
  color: var(--muted);
  font-size: 0.85rem;
}
.book-note p { margin: 0.25em 0; }
.toc { margin-top: 2.5rem; }
.toc h2 { font-size: 1rem; letter-spacing: 0.3em; color: var(--muted); }
.toc ol { list-style: none; margin: 0; padding: 0; column-width: 16rem; column-gap: 2.5rem; }
.toc li { break-inside: avoid; border-bottom: 1px dashed var(--line); }
.toc a { display: flex; gap: 0.75em; padding: 0.45em 0.2em; color: inherit; }
.toc-num { color: var(--muted); font-variant-numeric: tabular-nums; min-width: 1.6em; text-align: right; }
.back { margin-top: 2.5rem; }

/* —— 阅读页 —— */
.crumb { color: var(--muted); font-size: 0.85rem; display: flex; justify-content: space-between; }
.crumb-count { font-variant-numeric: tabular-nums; }
.chapter-head h1 { font-size: 1.35rem; letter-spacing: 0.05em; }
.chapter-num { display: block; font-size: 0.8rem; color: var(--muted); letter-spacing: 0.3em; margin-bottom: 0.3em; }
.prose { margin-top: 2.5rem; font-size: 1.06rem; }
.prose p { margin: 0 0 1.35em; text-align: justify; }
.chapter-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-top: 3.5rem;
  font-size: 0.9rem;
}
.nav-step {
  display: block;
  padding: 0.75rem 0.9rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: inherit;
  line-height: 1.5;
}
.nav-step small { display: block; color: var(--muted); font-size: 0.75rem; letter-spacing: 0.15em; margin-bottom: 0.15em; }
.nav-step:hover { border-color: var(--accent); text-decoration: none; }
.nav-next { text-align: right; }
.nav-step--void { color: var(--muted); }
.nav-step--void:hover { border-color: var(--line); }
.nav-toc-line { text-align: center; margin-top: 1.5rem; font-size: 0.85rem; }
.nav-toc-line a { color: var(--muted); }
@media (max-width: 30rem) {
  .chapter-nav { grid-template-columns: 1fr; }
  .nav-next { text-align: left; }
}

.site-foot { text-align: center; padding: 0 0 2.5rem; font-size: 0.8rem; }
.site-foot a { color: var(--muted); }

@media (max-width: 30rem) {
  .book-head { flex-direction: column; }
  .book-cover--page { flex-basis: auto; width: 7.5rem; }
}