/* Chapter 4 deliberately reuses chapter_3.css; additions remain scoped. */
.chapter-four select { display:block; max-width:100%; padding:12px; margin:12px 0; border:1px solid #829783; border-radius:6px; background:white; color:#253e30; font:inherit; }
.chapter-four .atlas .diagram { width:100%; max-height:620px; }
.chapter-four .atlas-marker circle { fill:#f5cf79; stroke:#654c22; stroke-width:2; }
.chapter-four .atlas-marker text { fill:#283c2d; font:bold 24px system-ui,sans-serif; }
.chapter-four .experiment input[type=range] { display:block; width:100%; margin:20px 0; }
.chapter-four .experiment label { display:block; font-weight:650; }
.chapter-four .three { align-items:start; }
.chapter-four .result { min-height:4em; }
.chapter-four :focus-visible { outline:3px solid #a66d13; outline-offset:4px; }
@media(max-width:760px) { .chapter-four .atlas-marker text { font-size:24px; } .chapter-four .experiment .diagram text { font-size:17px; } }
.chapter-four main { width:100%; min-width:0; }
.chapter-four .hero, .chapter-four .chapter-section, .chapter-four .reading-route { min-width:0; }
.chapter-four .hero>* { min-width:0; }
.chapter-four .section-heading>div { min-width:0; }
.chapter-four p, .chapter-four h2, .chapter-four select { overflow-wrap:anywhere; }
@media(max-width:760px) { .chapter-four .hero { grid-template-columns:minmax(0,1fr); } }