.annotated-close-reading--monaco { margin: 3rem 0; padding: 1.5rem; background: #f8f6f1; border: 1px solid #ded9ce; scroll-margin-top: 170px; }
.annotated-close-reading--monaco h2 { margin-bottom: .6rem; }
.annotated-close-reading--monaco .annotation-intro { max-width: 65ch; }
.annotated-close-reading--monaco .annotation-overview { position: relative; width: min(100%, 600px); margin: 1.5rem auto; }
.annotated-close-reading--monaco .annotation-overview img { display: block; width: 100%; height: auto; }
.annotated-close-reading--monaco .annotation-marker { position: absolute; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: #005d70; color: white; font: bold 1rem/1 sans-serif; text-decoration: none; box-shadow: 0 0 0 3px white; }
.annotated-close-reading--monaco .annotation-marker:focus-visible { outline: 3px solid #d24f27; outline-offset: 5px; }
.annotated-close-reading--monaco .annotation-marker--one { top: 6%; left: 48%; }
.annotated-close-reading--monaco .annotation-marker--two { top: 30%; left: 66%; }
.annotated-close-reading--monaco .annotation-marker--three { top: 69%; left: 73%; }
.annotated-close-reading--monaco figcaption { font-size: .9rem; line-height: 1.45; margin-top: .5rem; }
.annotated-close-reading--monaco .annotation-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.annotated-close-reading--monaco .annotation-details article { background: white; border: 1px solid #ded9ce; padding: .85rem; min-width: 0; scroll-margin-top: 170px; }
.annotated-close-reading--monaco .annotation-details h3 { font-size: 1.1rem; line-height: 1.3; }
.annotated-close-reading--monaco .annotation-details img { display: block; width: 100%; height: auto; }
.annotated-close-reading--monaco .annotation-details p { margin: .7rem 0 0; }
@media (max-width: 767px) { .annotated-close-reading--monaco { padding: 1rem; } .annotated-close-reading--monaco .annotation-details { grid-template-columns: 1fr; } }