/* Character guidance is separate from the original reading paragraphs. */
.reader-guide {
  --rg-ink: #51413b;
  --rg-muted: #8b6153;
  display: flex;
  align-items: center;
  gap: 22px;
  width: 100%;
  min-width: 0;
  margin: 20px 0 34px;
  color: var(--rg-ink);
}
.reader-guide, .reader-guide * { box-sizing: border-box; }
.reader-guide .rg-art {
  display: block;
  flex: 0 0 104px;
  width: 104px;
  height: 130px;
  object-fit: contain;
  object-position: center;
}
.reader-guide .rg-speech { min-width: 0; max-width: 100%; }
.reader-guide .rg-speaker {
  display: block;
  margin-bottom: 9px;
  color: var(--rg-muted);
  font-size: .75rem;
  font-weight: 650;
  line-height: 1.5;
}
.reader-guide .rg-speech p {
  margin: 0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.9;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.reader-guide.rg-interpretation.rg-before { align-items: flex-end; gap: 18px; }
.reader-guide.rg-interpretation .rg-art { flex-basis: 120px; width: 120px; height: 180px; }
.reader-guide.rg-interpretation.rg-before .rg-speech {
  padding: 17px 21px;
  margin-bottom: 14px;
  border: 1px solid #e5d3c5;
  border-radius: 23px 23px 23px 5px;
  background: #fffdf9;
}
.reader-guide.rg-advice.rg-before { flex-direction: row-reverse; justify-content: space-between; }
.reader-guide.rg-advice .rg-art { flex-basis: 86px; width: 86px; height: 112px; }
.reader-guide.rg-after {
  display: block;
  margin: 34px 0 20px;
  padding: 12px 0 0;
}
.reader-guide.rg-after .rg-speech p { font-size: .9375rem; font-weight: 400; }
.reader-guide .rg-speech .rg-next { margin-top: 9px; }
[data-reading-mode="text"] .reader-guide .rg-art { display: none; }
[data-reading-mode="text"] .reader-guide { display: block; }
[data-reading-mode="text"] .reader-guide.rg-before .rg-speech {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
@media (max-width: 480px) {
  .reader-guide { gap: 15px; margin: 18px 0 28px; }
  .reader-guide .rg-art { flex-basis: 78px; width: 78px; height: 102px; }
  .reader-guide.rg-interpretation.rg-before { gap: 12px; align-items: center; }
  .reader-guide.rg-interpretation .rg-art { flex-basis: 82px; width: 82px; height: 132px; }
  .reader-guide.rg-interpretation.rg-before .rg-speech { padding: 14px 15px; margin-bottom: 0; }
  .reader-guide.rg-advice .rg-art { flex-basis: 70px; width: 70px; height: 92px; }
}
@media (max-width: 360px) {
  .reader-guide.rg-interpretation.rg-before { align-items: flex-start; }
  .reader-guide.rg-interpretation .rg-art { flex-basis: 64px; width: 64px; height: 104px; }
  .reader-guide.rg-interpretation.rg-before .rg-speech { padding: 12px; }
}
@media print { .reader-guide { display: none !important; } }

/* Yeonhong's scene sizes follow the role of the passage, not a repeated avatar card. */
.reader-guide.rg-bond { margin-block: 28px 42px; }
.reader-guide.rg-bond .rg-speech p + p { margin-top: 12px; }
.reader-guide.rg-bond .rg-speech .rg-question { font-size: 1.25rem; line-height: 1.65; font-weight: 600; letter-spacing: -.025em; }
.reader-guide.rg-bond.rg-board.rg-before { display: block; margin-block: 26px 46px; }
.reader-guide.rg-bond.rg-board .rg-speech { max-width: 29rem; margin: 0 auto 24px; padding: 0 10px; }
.reader-guide.rg-bond.rg-board .rg-art { width: 100%; max-width: 460px; height: auto; aspect-ratio: 2 / 3; margin-inline: auto; object-fit: contain; }
.reader-guide.rg-bond.rg-interpretation.rg-before { display: grid; grid-template-columns: minmax(110px, .8fr) minmax(0, 1.2fr); align-items: end; gap: 20px; max-width: 590px; margin-inline: auto; }
.reader-guide.rg-bond.rg-interpretation .rg-art { width: 100%; max-width: 220px; height: auto; aspect-ratio: 1; justify-self: end; }
.reader-guide.rg-bond.rg-interpretation.rg-before .rg-speech { margin-bottom: 20px; padding: 20px 23px; }
.reader-guide.rg-bond.rg-advice.rg-before { max-width: 570px; margin-inline: auto; align-items: center; gap: 22px; }
.reader-guide.rg-bond.rg-advice .rg-art { flex: 0 0 96px; width: 96px; height: 96px; }
.reader-guide.rg-bond.rg-advice .rg-speech { flex: 1; }
.reader-guide.rg-bond.rg-between { display: block; margin: 60px 0 34px; }
.reader-guide.rg-bond.rg-between .rg-speech { max-width: 35rem; }
.reader-guide.rg-bond.rg-between .rg-question { margin-top: 20px; color: #89514c; }
.reader-guide.rg-bond.rg-after { max-width: 40rem; margin: 38px 0 24px; }
.reader-guide.rg-bond.rg-after .rg-speech .rg-question { font-size: 1.0625rem; }
[data-reading-mode="text"] .reader-guide.rg-bond { display: block; margin-block: 26px 30px; }
[data-reading-mode="text"] .reader-guide.rg-bond .rg-art { display: none; }
[data-reading-mode="text"] .reader-guide.rg-bond .rg-speech { max-width: none; padding: 0; margin: 0; }
[data-reading-mode="text"] .reader-guide.rg-bond.rg-between { margin-top: 40px; }
@media (max-width: 480px) {
  .reader-guide.rg-bond .rg-speech .rg-question { font-size: 1.125rem; }
  .reader-guide.rg-bond.rg-interpretation.rg-before { grid-template-columns: minmax(100px, .75fr) minmax(0, 1.25fr); gap: 12px; }
  .reader-guide.rg-bond.rg-interpretation.rg-before .rg-speech { padding: 17px 16px; margin-bottom: 8px; }
  .reader-guide.rg-bond.rg-advice .rg-art { flex-basis: 76px; width: 76px; height: 76px; }
  .reader-guide.rg-bond.rg-advice.rg-before { gap: 16px; }
  .reader-guide.rg-bond.rg-between { margin-top: 52px; }
}
@media (max-width: 360px) {
  .reader-guide.rg-bond.rg-interpretation.rg-before { grid-template-columns: 88px minmax(0, 1fr); gap: 10px; }
  .reader-guide.rg-bond.rg-interpretation.rg-before .rg-speech { padding: 14px; }
  .reader-guide.rg-bond.rg-advice.rg-before { gap: 12px; }
  .reader-guide.rg-bond.rg-advice .rg-art { flex-basis: 62px; width: 62px; height: 62px; }
}
@media print { .reader-guide.rg-bond { display: none !important; } }
[data-reading-mode="text"] .reader-guide.rg-bond.rg-before { display: block; }
[data-reading-mode="text"] .reader-guide.rg-bond.rg-before .rg-speech { padding: 0; margin: 0; }