/* Reading-page illustrations. Scope everything to the added plates. */
.reading-art { margin: 2rem auto; max-width: 680px; min-width: 0; border: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 20%, transparent); border-radius: 10px; overflow: hidden; text-align: left; }
.reading-art-image { display: block; background: #100d18; }
.reading-art img { display: block; width: 100%; height: auto; max-height: 560px; object-fit: contain; margin: 0; }
.reading-art figcaption { padding: 1rem 1.15rem; font: .9rem/1.6 system-ui, sans-serif; }
.reading-art figcaption strong, .reading-art figcaption span { display: block; }
.reading-art figcaption strong { font-size: 1rem; margin-bottom: .35rem; }
.reading-art figcaption a { color: inherit; display: inline-block; margin-top: .6rem; text-underline-offset: .2em; }
.reading-art a:focus-visible { outline: 3px solid #b88cff; outline-offset: -4px; }
.reading-art-section { scroll-margin-top: 80px; max-width: 860px; margin: 3rem auto; padding: 0 1.25rem; }
.reading-art-section>h2 { margin-bottom: .8rem; }
.reading-art-section>p { line-height: 1.7; }
.reading-art-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
.reading-art-grid .reading-art { width: 100%; margin: 1rem 0; }
.reading-art-grid .reading-art img { height: 420px; }
.reading-art-inline { margin-top: 1.5rem; }
.reading-art-inline .reading-art { margin: 0; }
.reading-art-inline .reading-art img { max-height: 360px; }
.reading-art-section .reading-art-note { font-size: .85rem; opacity: .8; }
@media(max-width:600px) {
  .reading-art-grid { grid-template-columns: 1fr; }
  .reading-art-grid .reading-art img { height: auto; max-height: 520px; }
  .reading-art-section { padding: 0 1rem; }
  .reading-art figcaption { padding: .9rem; }
}
@media print { .reading-art { break-inside: avoid; } .reading-art img { max-height: 340px; } }

.reading-art-section>p>a { color: inherit; text-underline-offset: .2em; }
