#personal-surgery-home main { width: min(calc(100% - 32px), 1040px); padding-block: 8px 36px; }
#personal-surgery-home main a { color: var(--psh-link); text-underline-offset: .16em; }
#personal-surgery-home [hidden] { display: none; }

.book-nav { display: flex; flex-wrap: wrap; gap: 0 20px; font-size: 14px; }
.book-nav a { display: inline-flex; align-items: center; min-height: 44px; }
.book-to-top { display: inline-flex; align-items: center; min-height: 44px; margin-block-start: 12px; font-size: 14px; }
.textbook-reader + .psh-footer { border-block-start: 1px solid var(--psh-line); }
.book-header { max-width: 80ch; padding-block: 13px 20px; }
#personal-surgery-home .book-header .psh-kicker { letter-spacing: .08em; }
#personal-surgery-home .book-header h1 {
  margin-block: 6px 0;
  font-size: clamp(28px, 5vw, 48px);
  line-height: 1.1;
  letter-spacing: -.04em;
  overflow-wrap: anywhere;
}
#personal-surgery-home .book-header .psh-intro {
  max-width: 55ch;
  margin-block-start: 12px;
  font-size: clamp(17px, 2.2vw, 21px);
  line-height: 1.45;
}
#personal-surgery-home .book-status { margin-top: 9px; color: var(--psh-muted); font-size: 14px; }

.book-search {
  display: grid;
  gap: 7px;
  margin-block: 0 16px;
  padding: 12px;
  border: 1px solid var(--psh-line);
  border-radius: 9px;
  background: var(--psh-project);
}
.book-search-label { font-weight: 700; }
.book-search-input {
  width: 100%;
  min-height: 44px;
  padding: 8px 11px;
  border: 1px solid var(--psh-muted);
  border-radius: 6px;
  background: var(--psh-paper);
  color: var(--psh-ink);
  font: inherit;
  font-size: 16px;
}
.book-search-status { color: var(--psh-muted); font-size: 14px; }
.book-search-status:empty { display: none; }

.book-list, .book-chapters { padding: 0; margin: 0; list-style: none; border-block-start: 1px solid var(--psh-line); }
.book-list > li, .book-chapters > li {
  border-block-end: 1px solid var(--psh-line);
  scroll-margin-block-start: 12px;
}
.book-list li:target { background: var(--psh-project); }
.book-list li:target a { box-shadow: inset 3px 0 var(--psh-link); }
.book-list a, .chapter-dropdown summary {
  display: grid;
  grid-template-columns: 3ch minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 4px 10px;
  min-height: 48px;
  padding: 12px 8px;
  line-height: 1.35;
  text-decoration: none;
}
.book-list a:hover strong, .book-list a:focus-visible strong { text-decoration: underline; }
.book-list .list-index, .book-chapters .list-index { color: var(--psh-muted); font-variant-numeric: tabular-nums; font-size: 13px; }
.book-list small, .chapter-dropdown summary small { color: var(--psh-muted); font-size: 13px; }
.book-search-results a { grid-template-columns: minmax(0, 1fr) minmax(0, 33%); }

.chapter-dropdown summary {
  grid-template-columns: 3ch minmax(0, 1fr) auto 20px;
  color: var(--psh-link);
  cursor: pointer;
  list-style: none;
}
.chapter-dropdown summary::-webkit-details-marker { display: none; }
.chapter-dropdown summary::after {
  content: "";
  justify-self: center;
  align-self: center;
  width: 7px;
  height: 7px;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  transform: translateY(-2px) rotate(45deg);
}
.chapter-dropdown[open] summary, .chapter-dropdown summary:hover { background: var(--psh-project); }
.chapter-dropdown[open] summary::after { transform: translateY(2px) rotate(225deg); }
.chapter-dropdown-body {
  margin-inline-start: 16px;
  padding-inline-start: 12px;
  border-inline-start: 2px solid var(--psh-line);
}
.chapter-dropdown-body .book-list > li:last-child { border-block-end: 0; }
.chapter-page-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding-inline: 8px;
  font-size: 14px;
}

.scans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  align-items: start;
  gap: 16px;
  margin-block-end: 20px;
}
.scans.single { grid-template-columns: minmax(0, 580px); }
.scan-link {
  display: grid;
  place-items: center;
  min-height: 44px;
  padding: 4px;
  border: 1px solid var(--psh-line);
  border-radius: 8px;
  background: white;
  cursor: zoom-in;
}
.scans img { display: block; width: auto; height: auto; max-width: 100%; max-height: 560px; object-fit: contain; }
.scan-link { text-decoration: none; }
.scan-enlarge {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 650;
}
.scan-enlarge span { font-size: 17px; }
.scan-link:hover .scan-enlarge, .scan-link:focus-visible .scan-enlarge { text-decoration: underline; }
.scans figcaption { margin-block-start: 5px; color: var(--psh-muted); font-size: 13px; }
#personal-surgery-home .topic-explanation-link { margin-top: 0; }
.topic-explanation-link a { display: inline-flex; align-items: center; min-height: 44px; }
.image-note { margin-bottom: 18px; max-width: 72ch; padding: 12px 14px; border-radius: 6px; background: var(--psh-project); }
.explanation { border-block: 1px solid var(--psh-line); margin-top: 18px; scroll-margin-block-start: 12px; }
.explanation summary { min-height: 48px; padding-block: 12px; color: var(--psh-link); cursor: pointer; font-weight: 650; }
.explanation-body { max-width: 72ch; padding-block: 4px 18px; overflow-wrap: anywhere; }
#personal-surgery-home .explanation-body p + p { margin-top: 12px; }
#personal-surgery-home .explanation-body h2 { margin-block: 18px 6px; font-size: 20px; }
.topic-footer { margin-top: 12px; }

@media (max-width: 690px) {
  .book-header { padding-block: 9px 16px; }
  .book-list a { grid-template-columns: 3ch minmax(0, 1fr); }
  .book-list small { grid-column: 2; }
  .chapter-dropdown summary { grid-template-columns: 3ch minmax(0, 1fr) 20px; }
  .chapter-dropdown summary small { grid-column: 2; }
  .chapter-dropdown summary::after { grid-column: 3; grid-row: 1 / span 2; }
  .book-search-results a { grid-template-columns: minmax(0, 1fr); }
  .book-search-results small { grid-column: 1; }
  .scans { grid-template-columns: minmax(0, 1fr); }
  .scans img { max-height: min(70vh, 520px); }
}
