:root {
  --bg: #f7f7f4;
  --panel: #ffffff;
  --ink: #1f2933;
  --muted: #68717d;
  --line: #d8ddd7;
  --accent: #2f6f73;
  --accent-dark: #1d4e52;
  --mark: #ffe08a;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font: 16px/1.75 -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", "PingFang SC", sans-serif;
}
button, input { font: inherit; }
button {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  border-radius: 6px;
  padding: 7px 10px;
  cursor: pointer;
}
button:hover { border-color: var(--accent); color: var(--accent-dark); }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 330px;
  overflow: auto;
  border-right: 1px solid var(--line);
  background: #fbfbf8;
  padding: 18px;
}
.brand { display: grid; gap: 4px; margin-bottom: 18px; }
.brand strong { font-size: 20px; }
.brand span, .kicker, .summary, .page-meta, figcaption, .block-type { color: var(--muted); font-size: 13px; }
.search-box { display: grid; gap: 6px; margin-bottom: 10px; }
.search-box input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px 12px;
  background: #fff;
}
.actions, .reader-tools { display: flex; gap: 8px; flex-wrap: wrap; }
.summary { margin: 12px 0; min-height: 22px; }
.nav-link {
  display: block;
  margin: 8px 0 12px;
  color: var(--accent-dark);
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 10px;
  background: #fff;
  font-weight: 700;
}
.nav-link:hover { border-color: var(--accent); background: #eef5f2; }
.nav-link.active { background: #dcebe7; border-color: var(--accent); }
.toc { display: grid; gap: 2px; padding-bottom: 40px; }
.toc a {
  display: block;
  color: var(--ink);
  text-decoration: none;
  border-radius: 6px;
  padding: 6px 8px;
  line-height: 1.35;
}
.toc a:hover { background: #eef5f2; }
.toc .chapter-link { font-weight: 700; margin-top: 6px; }
.toc .chapter-link.active { background: #dcebe7; color: var(--accent-dark); }
.toc .section-link { color: #40505c; font-size: 14px; }
.toc .level-2 { padding-left: 20px; }
.toc .level-3 { padding-left: 36px; font-size: 14px; }
.reader { margin-left: 330px; min-height: 100vh; }
.reader-header {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  background: rgba(247, 247, 244, 0.94);
  backdrop-filter: blur(10px);
  padding: 20px clamp(20px, 4vw, 54px);
}
h1 { margin: 0; font-size: clamp(28px, 4vw, 44px); line-height: 1.1; letter-spacing: 0; }
.results {
  max-width: 980px;
  margin: 0 auto;
  padding: 24px clamp(16px, 4vw, 44px) 80px;
}
.page {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0 0 18px;
  padding: clamp(18px, 3vw, 30px);
}
.chapter-flow {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(18px, 3vw, 34px);
}
.chapter-page-marker {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-size: 13px;
  margin: 24px 0 10px;
}
.chapter-page-marker::after {
  content: "";
  flex: 1;
  border-top: 1px solid var(--line);
}
.chapter-page-marker:first-child { margin-top: 0; }
.teaching-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  margin: 0 0 18px;
  padding: clamp(16px, 2.5vw, 24px);
}
.teaching-panel h2, .teaching-entry h2 { margin: 0 0 10px; font-size: 21px; line-height: 1.35; }
.teaching-list { display: grid; gap: 12px; }
.teaching-entry {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 0 0 14px;
  padding: clamp(16px, 2.5vw, 24px);
}
.teaching-entry.compact { background: #fbfbf8; margin: 0; padding: 14px; }
.teaching-meta { color: var(--muted); font-size: 13px; margin-bottom: 8px; }
.teaching-fields { display: grid; gap: 8px; }
.teaching-field strong { color: var(--accent-dark); margin-right: 6px; }
.chapter-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.chapter-tags a {
  color: var(--accent-dark);
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 13px;
}
.chapter-tags a:hover { border-color: var(--accent); background: #eef5f2; }
.page-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
  margin-bottom: 18px;
}
.page h2 { margin: 0; font-size: 20px; line-height: 1.35; }
.copy-page, .copy-block { white-space: nowrap; }
.block { position: relative; margin: 14px 0; }
.block:hover .copy-block { opacity: 1; }
.copy-block {
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
  padding: 3px 7px;
  font-size: 12px;
}
.text-block { padding-right: 54px; }
.title-1 { font-size: 30px; font-weight: 750; margin-top: 22px; }
.title-2 { font-size: 24px; font-weight: 720; margin-top: 20px; }
.title-3 { font-size: 20px; font-weight: 700; margin-top: 18px; }
p { margin: 0; text-align: justify; }
ul { margin: 0; padding-left: 1.3em; }
li { margin: 8px 0; }
figure { margin: 18px 0; }
img { max-width: 100%; height: auto; border-radius: 6px; border: 1px solid var(--line); background: #f2f2ee; }
figcaption { margin-top: 6px; }
details {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 10px;
  background: #fbfbf8;
}
summary { cursor: pointer; color: var(--accent-dark); }
table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: 14px; }
td, th { border: 1px solid var(--line); padding: 7px 8px; vertical-align: top; }
mark { background: var(--mark); color: inherit; padding: 0 1px; }
.math-inline {
  font-family: "Times New Roman", Georgia, serif;
  font-style: italic;
  white-space: nowrap;
}
sub, sup {
  font-size: 0.72em;
  line-height: 0;
}
.equation {
  overflow-x: auto;
  border-left: 3px solid var(--accent);
  padding: 8px 12px;
  background: #f3f7f5;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.empty {
  text-align: center;
  color: var(--muted);
  padding: 80px 20px;
}
.toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  background: var(--accent-dark);
  color: #fff;
  padding: 10px 14px;
  border-radius: 6px;
  opacity: 0;
  transform: translateY(8px);
  transition: 160ms ease;
  pointer-events: none;
}
.toast.show { opacity: 1; transform: translateY(0); }
@media (max-width: 860px) {
  .sidebar {
    position: static;
    width: auto;
    max-height: 48vh;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .reader { margin-left: 0; }
  .reader-header { position: static; align-items: flex-start; flex-direction: column; }
}