/* Reading surface: the rendered note (and course module) body. Calm, one column. */
.prose {
  font-family: var(--font-read);
  font-size: var(--font-size-base);
  line-height: var(--line-height);
  color: var(--ink);
  font-kerning: normal;
  font-feature-settings: 'liga' 1, 'calt' 1;
  overflow-wrap: break-word;
  word-break: break-word;
  overflow-x: hidden;
  caret-color: var(--accent);
}
[data-font="source-serif"] .prose { font-family: var(--font-serif); line-height: 1.72; }

.prose > *:first-child { margin-top: 0; }
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
  font-family: var(--font);
  color: var(--ink);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.015em;
  margin: 1.8em 0 .5em;
  text-wrap: balance;
  scroll-margin-top: 84px;
}
.prose h1 { font-size: 1.6em; letter-spacing: -.02em; }
.prose h2 { font-size: 1.3em; }
.prose h3 { font-size: 1.1em; }
.prose h4 { font-size: 1em; }
.prose h5, .prose h6 { font-size: .8em; text-transform: uppercase; letter-spacing: .06em; color: var(--ink2); }
.prose hr + h1, .prose hr + h2, .prose hr + h3, .prose hr + h4 { margin-top: .6em; }

.prose p { margin: 0 0 1.05em; }
.prose p:empty { display: none; }

.prose a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-color: rgba(45,91,255,.35);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
  transition: text-decoration-color var(--t-fast) var(--ease);
}
.prose a:hover { text-decoration-color: var(--accent); }
.prose strong { font-weight: 700; color: var(--ink); }
.prose em { font-style: italic; }

.prose ul, .prose ol { margin: 0 0 1.05em; padding-left: 1.4em; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin-bottom: .35em; }
.prose li::marker { color: var(--ink3); }
.prose ol > li::marker { color: var(--ink2); }
.prose li > ul, .prose li > ol { margin-top: .35em; margin-bottom: 0; }

.prose blockquote {
  margin: 1.3em 0;
  padding: .1em 0 .1em 1.1em;
  border-left: 2px solid var(--line);
  color: var(--ink2);
}
.prose blockquote p:last-child { margin-bottom: 0; }

.prose code {
  font-family: var(--font-mono);
  font-size: .84em;
  background: var(--code-bg);
  padding: .14em .4em;
  border-radius: 5px;
}
.prose pre {
  margin: 1.3em 0;
  padding: 14px 16px;
  overflow-x: auto;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.prose pre code, .prose pre code.hljs { background: none; padding: 0; font-size: .82rem; line-height: 1.65; }

.prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }

.prose img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
  border-radius: var(--r-sm);
}
.prose iframe, .prose video, .prose object, .prose embed { max-width: 100% !important; height: auto; }
.prose img[width], .prose img[style] { width: auto; max-width: 100% !important; }

/* Wide tables scroll inside their wrapper (reader.js wraps them) instead of crushing to one
   letter per line: cells size to their words, not to the column's share of the measure. */
.prose .table-wrap { margin: 1.3em 0; overflow-x: auto; overscroll-behavior-x: contain; }
.prose .table-wrap > table { margin: 0; }
.prose table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 1.3em 0;
  font-family: var(--font);
  font-size: .86em;
  line-height: 1.5;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  overflow: hidden;
  font-variant-numeric: tabular-nums;
}
.prose th, .prose td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line-soft); }
.prose .table-wrap th, .prose .table-wrap td { word-break: normal; overflow-wrap: normal; min-width: 7ch; }
.prose tr:last-child td { border-bottom: 0; }
.prose th { background: var(--surface-2); font-weight: 700; font-size: .92em; color: var(--ink2); border-bottom-color: var(--line); }

/* Collapsible transcript */
.prose details {
  margin: 1.6em 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 0 18px;
}
.prose details summary {
  display: flex; align-items: center; gap: 10px;
  min-height: 52px; cursor: pointer; list-style: none; user-select: none;
  font-family: var(--font); font-weight: 700; font-size: 15.5px; color: var(--ink);
}
.prose details summary::-webkit-details-marker { display: none; }
.prose details summary::after {
  content: ""; margin-left: auto; width: 9px; height: 9px;
  border-right: 1.8px solid var(--ink2); border-bottom: 1.8px solid var(--ink2);
  transform: translateY(-2px) rotate(45deg);
  transition: transform var(--t-base) var(--ease);
}
.prose details[open] summary::after { transform: translateY(2px) rotate(225deg); }
.prose details[open] { padding-bottom: 6px; }
.prose details[open] summary { border-bottom: 1px solid var(--line-soft); margin-bottom: 14px; }

/* Sutra chanting layout: per-character ruby with the pinyin above. Verse blocks
   centre, the numbered sutra sections run as left-aligned prose. */
.prose .sutra-head, .prose .sutra-verse, .prose .sutra-prose {
  font-family: var(--font-serif);
  letter-spacing: .05em;
  line-height: 2.05;
}
.prose .sutra-head { text-align: center; font-weight: 700; margin: 1.9em 0 .7em; }
.prose h3.sutra-head { font-size: 1.75em; }
.prose h4.sutra-head { font-size: 1.45em; }
.prose .sutra-verse, .prose .sutra-prose { font-size: 1.5em; margin: 0 0 1.1em; }
.prose .sutra-verse { text-align: center; }
.prose .sutra-prose { text-align: left; }
.prose .sutra-head ruby, .prose .sutra-verse ruby, .prose .sutra-prose ruby {
  ruby-position: over;
  -webkit-ruby-position: before;
  ruby-align: center;
}
.prose rt {
  font-family: var(--font);
  font-size: .5em;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--ink2);
}