@font-face {
  font-family: ReadingSerif;
  src: url('../assets/fonts/reading-serif.ttf') format('truetype');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: ReadingSerif;
  src: url('../assets/fonts/reading-serif-italic.ttf') format('truetype');
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: LiteraryDisplay;
  src: url('../assets/fonts/literary-display.ttf') format('truetype');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
:root {
  --body: ReadingSerif, Georgia, 'Times New Roman', serif;
  --heading: LiteraryDisplay, Georgia, 'Times New Roman', serif;
  --ui: 'Segoe UI', Arial, sans-serif;
  --ink: #43352e;
  --green: #626b53;
}
h1, h2, h3 { font-weight: 500; }
h1 { line-height: 1.04; letter-spacing: -.035em; }
.chapter-eyebrow, .eyebrow, .bookmark-label, .counter, .search-count,
.photo-hint, .group-number, .answer-label, .copy-feedback {
  font-family: var(--ui);
  font-weight: 400;
}
.chapter-eyebrow { font-size: 10px; letter-spacing: .16em; line-height: 1.8; }
.bookmark-label { font-size: 12px; letter-spacing: .05em; }
.book-name { font-size: 30px; font-weight: 500; letter-spacing: .015em; }
.prose { font-size: 18px; line-height: 1.85; }
.prose p, .answer-text p { text-wrap: pretty; }
.greeting { margin-top: 32px; }
.greeting p:first-child { font-family: var(--body); font-size: 23px; line-height: 1.55; }
.greeting p:first-child::first-letter { float: none; font-size: inherit; color: inherit; margin: 0; line-height: inherit; }
.greeting p:last-child { font-size: 16px; line-height: 1.8; }
.chapter-hello h1 { font-weight: 500; font-size: 94px; }
.handwritten { letter-spacing: 0; }
.page-nav { font-size: 21px; }
.page-count { font-size: 22px; }
.photo-hint { font-size: 10px; letter-spacing: .09em; margin-top: 10px; }
.photo-caption { font-size: 26px; }
.group-jump { font-size: 24px; padding: 17px 0; line-height: 1.18; }
.group-number { font-size: 10px; }
.question-group { margin-top: 50px; }
.question-group h2 { font-size: 35px; line-height: 1.12; margin-bottom: 20px; }
.question-group h2::before { content: ''; display: block; height: 1px; width: 28px; background: #b18a83; margin-bottom: 14px; }
.search-label { font-family: var(--ui); font-size: 12px; letter-spacing: .07em; }
.search-input { background: transparent; border-bottom-color: #cbb5a2; }
.search-input input { padding-left: 0; font-size: 15px; }
.search-count { font-size: 11px; line-height: 1.7; margin-top: 13px; }
.question-toggle { font-family: var(--heading); font-size: 27px; line-height: 1.18; font-weight: 500; padding: 19px 0; gap: 14px; }
.question-symbol { font-size: 22px; font-weight: 400; }
.answer { padding: 10px 0 27px 20px; position: relative; }
.answer::before { content: ''; position: absolute; inset: 13px auto 30px 0; width: 1px; background: linear-gradient(#b88e83, #d9cdb945); }
.answer-label { display: block; text-transform: uppercase; font-size: 9px; letter-spacing: .2em; color: var(--rose); margin: 0 0 18px; }
.answer-text { font-family: var(--body); font-size: 17px; line-height: 1.85; }
.answer-text p { margin-bottom: 1.2em; }
.answer-text p:first-child { color: #48342d; }
.answer-actions { padding-top: 12px; margin-top: 22px; border-top: 1px solid #d9cdb980; gap: 0 17px; }
.answer-actions .text-button, .answer-actions .text-link { font-family: var(--ui); font-size: 11px; line-height: 1.5; text-decoration: none; }
.answer-actions .text-button:hover, .answer-actions .text-link:hover { text-decoration: underline; }
.copy-feedback { font-size: 11px; }
.chapter-questions .side-note { font-size: 25px; }
.chapter-rei { display: block; }
.chapter-rei::after { display: none; }
.chapter-rei>.left-sheet { padding: 82px 0 48px; background-color: var(--paper); box-shadow: none; }
.chapter-rei .left-content { display: grid; grid-template-columns: 1fr 1fr; position: static; }
.rei-title { padding: 15px 55px 30px; }
.chapter-rei h1 { font-size: 70px; max-width: 440px; }
.rei-intro { font-size: 27px; line-height: 1.45; margin: 28px 0; max-width: 260px; }
.rei-title-drawing { width: 130px; height: 150px; color: #9a9c83; margin: 10px 0 10px 35px; }
.rei-title-drawing svg { width: 100%; height: 100%; }
.read-poem { font-family: var(--ui); font-size: 12px; text-decoration: none; letter-spacing: .04em; }
.rei-companion { padding: 12px 55px 0; }
.rei-companion .pet-area { max-width: 325px; }
.rei-companion .pet-status { font-size: 23px; min-height: 3.2em; line-height: 1.5; max-width: 330px; margin: 23px auto 0; }
.rei-companion .rei-actions { margin-top: 12px; }
.rei-companion .pet-button { font-size: 21px; }
.chapter-rei>.right-sheet { padding: 0; box-shadow: none; }
.poem-heading-wrap { display: flex; align-items: center; justify-content: space-between; margin: 0 55px; padding: 19px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--rose); }
.poem-heading-wrap h2 { font-family: var(--ui); font-size: 10px; text-transform: uppercase; letter-spacing: .2em; font-weight: 400; scroll-margin-top: 24px; }
.poem-heading-wrap>span { font-size: 26px; line-height: 1; }
.poem { font-size: 19px; line-height: 1.7; white-space: normal; }
.poem-folio { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid #d9cdb97a; }
.poem-leaf { min-width: 0; padding: 54px 64px 50px 74px; position: relative; }
.poem-leaf:nth-child(2) { padding-left: 68px; box-shadow: inset 13px 0 22px -19px #735e435e; border-left: 1px solid #d9cdb973; }
.stanza { white-space: pre-wrap; overflow-wrap: break-word; margin: 0 0 1.4em; max-width: 30ch; break-inside: avoid; }
.stanza:last-of-type { margin-bottom: 0; }
.poem-folio:first-child .poem-leaf:first-child .stanza:first-child { font-family: var(--heading); font-size: 36px; color: var(--rose); line-height: 1.15; margin-bottom: 1em; }
.poem-folio:last-child .poem-leaf:last-child .stanza:last-of-type { font-style: italic; font-size: 22px; color: var(--rose); margin-top: 1.6em; }
.rei-after-poem { max-width: 510px; margin: auto; padding: 0 30px 45px; }
.rei-after-poem .rei-extra { margin-top: 40px; border: 0; }
.closing-prose p:last-child { font-family: var(--heading); font-size: 34px; line-height: 1.3; }
.chapter-poems { display: block; }
.chapter-poems::after { display: none; }
.chapter-poems>.left-sheet { padding: 90px 55px 40px; background: var(--paper); box-shadow: none; }
.chapter-poems .left-content { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 75px; }
.anthology-intro h1 { font-size: 76px; max-width: 330px; }
.anthology-note { font-size: 27px; margin: 28px 0 0; }
.poem-index { border-top: 1px solid var(--line); }
.poem-index a { display: grid; grid-template-columns: 25px 1fr 15px; gap: 14px; align-items: center; text-decoration: none; color: var(--ink); font-family: var(--heading); font-weight: 500; font-size: 25px; line-height: 1.2; padding: 16px 0; min-height: 55px; border-bottom: 1px solid var(--line); }
.poem-index a[aria-current=page] { color: var(--rose); }
.poem-index-number { font-family: var(--heading); font-size: 16px; color: var(--rose); }
.poem-index a>span:last-child { font-size: 17px; color: var(--rose); }
.chapter-poems>.right-sheet { padding: 0; box-shadow: none; }
.poem-title-block { padding: 34px 55px 0; border-top: 1px solid var(--line); }
.poem-title-block h2 { font-size: 53px; max-width: 700px; margin-top: 16px; line-height: 1.08; scroll-margin-top: 30px; }
.poem-title-block .eyebrow { color: var(--rose); }
.poem-ornament { display: block; color: var(--rose); font-size: 27px; margin-top: 17px; }
.chapter-poems .poem-folio:first-child .poem-leaf:first-child .stanza:first-child { font-family: var(--body); font-size: inherit; line-height: inherit; margin-bottom: 1.4em; color: var(--ink); }
.poem-navigation { padding: 28px 55px 12px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.poem-navigation .text-link { font-family: var(--ui); font-size: 12px; }
.chapter-poems .right-sheet>.rei-shortcut { padding-bottom: 35px; }
@media(max-width:979px) {
  .chapter-poems>.left-sheet { padding: 76px 48px 30px; }
  .chapter-poems .left-content { display: block; }
  .anthology-intro h1 { font-size: 62px; max-width: 100%; }
  .anthology-note { margin: 22px 0 25px; }
  .poem-index a { font-size: 25px; padding: 14px 0; }
  .poem-title-block { padding: 30px 48px 0; }
  .poem-title-block h2 { font-size: 45px; }
  .poem-navigation { padding: 20px 48px; }
  .chapter-rei>.left-sheet { padding: 75px 0 33px; }
  .chapter-rei .left-content { display: block; }
  .rei-title { padding: 0 48px 24px; }
  .chapter-rei h1 { font-size: 59px; max-width: 460px; }
  .rei-intro { max-width: 100%; margin: 22px 0 10px; }
  .rei-title-drawing { display: none; }
  .rei-companion { padding: 13px 48px 0; }
  .rei-companion .pet-area { max-width: 340px; }
  .poem-heading-wrap { margin: 0 48px; }
  .poem-folio { display: block; border-bottom: 0; }
  .poem-leaf, .poem-leaf:nth-child(2) { padding: 0 48px; border: 0; box-shadow: none; }
  .poem-folio:first-child .poem-leaf:first-child { padding-top: 35px; }
  .stanza { margin-bottom: 1.5em; }
  .stanza:last-of-type { margin-bottom: 1.5em; }
  .poem-folio:last-child .poem-leaf:last-child { padding-bottom: 28px; }
  .poem { font-size: 19px; line-height: 1.7; }
  .poem-folio:first-child .poem-leaf:first-child .stanza:first-child { font-size: 32px; }
  .poem-folio:last-child .poem-leaf:last-child .stanza:last-of-type { font-size: 21px; }
  .answer-text { font-size: 18px; line-height: 1.8; }
}
@media(max-width:680px) {
  .chapter-poems>.left-sheet { padding-left: 29px; padding-right: 29px; }
  .anthology-intro h1 { font-size: 56px; }
  .anthology-note { font-size: 24px; }
  .poem-index a { font-size: 23px; gap: 9px; }
  .poem-title-block { padding-left: 29px; padding-right: 29px; }
  .poem-title-block h2 { font-size: 39px; }
  .poem-navigation { padding: 15px 29px; }
  .chapter-hello h1 { font-size: 77px; }
  h1 { font-size: 49px; }
  .prose { font-size: 17px; line-height: 1.8; }
  .greeting p:first-child { font-size: 22px; }
  .greeting p:last-child { font-size: 16px; }
  .question-group h2 { font-size: 33px; }
  .question-toggle { font-size: 26px; padding: 18px 0; }
  .answer { padding-left: 16px; }
  .answer-text { font-size: 17px; line-height: 1.8; }
  .answer-label { margin-bottom: 16px; }
  .answer-actions { gap: 0 13px; }
  .answer-actions .text-button, .answer-actions .text-link { font-size: 10px; }
  .page-nav { font-size: 19px; }
  .page-count { font-size: 20px; }
  .rei-title { padding: 0 29px 18px; }
  .chapter-rei h1 { font-size: 54px; }
  .rei-intro { font-size: 25px; }
  .rei-companion { padding: 12px 32px 0; }
  .rei-companion .pet-status { min-height: 4.8em; font-size: 22px; }
  .poem-heading-wrap { margin: 0 29px; }
  .poem-leaf, .poem-leaf:nth-child(2) { padding-left: 29px; padding-right: 25px; }
  .poem { font-size: 18px; line-height: 1.7; }
  .poem-folio:first-child .poem-leaf:first-child .stanza:first-child { font-size: 30px; }
  .poem-folio:last-child .poem-leaf:last-child .stanza:last-of-type { font-size: 20px; }
  .rei-after-poem { padding-left: 29px; padding-right: 29px; }
}
@media(max-width:360px) {
  .chapter-poems>.left-sheet { padding-left: 23px; padding-right: 23px; }
  .anthology-intro h1 { font-size: 48px; }
  .poem-title-block { padding-left: 23px; padding-right: 23px; }
  .poem-title-block h2 { font-size: 36px; }
  h1 { font-size: 43px; }
  .chapter-hello h1 { font-size: 70px; }
  .chapter-rei h1 { font-size: 47px; }
  .rei-title { padding-left: 23px; padding-right: 23px; }
  .rei-companion { padding-left: 25px; padding-right: 25px; }
  .poem-leaf, .poem-leaf:nth-child(2) { padding-left: 23px; padding-right: 20px; }
  .poem { font-size: 17px; }
  .poem-heading-wrap { margin-left: 23px; margin-right: 23px; }
  .question-toggle { font-size: 24px; }
  .answer-text { font-size: 17px; }
  .page-nav { font-size: 17px; }
}
