.chapter-levels { scroll-margin-top:100px; }
.chapter-levels [hidden] { display:none!important; }
.level-navigation { padding:22px 24px 16px; margin-bottom:24px; background:#f0f2e8; border:1px solid #d8dfcf; border-radius:17px; }
.level-nav-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:17px; }
.level-nav-heading .eyebrow { font-size:0.9rem; margin:0 0 5px; }
.level-nav-heading p { margin:0; color:#435c4e; font-size:1.05rem; }
.level-total { color:#315849; font-size:1rem; font-weight:650; white-space:nowrap; }
.level-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; }
.level-step { display:flex; align-items:center; gap:12px; text-align:left; padding:14px; border:1px solid #cbd5c2; border-radius:11px; color:#395342; background:#fffef8; font:inherit; cursor:pointer; min-height:78px; }
.level-step[aria-current=step] { border:2px solid #2e6554; padding:13px; background:#e4efdf; box-shadow:0 0 0 3px #2e65540b; }
.level-step:disabled { cursor:default; background:#eeeee6; border-color:#dadcd2; color:#697368; }
.level-step[aria-current=step]:disabled { background:#e4efdf; }
.level-step strong { display:block; font-family:Georgia,'Times New Roman',serif; font-size:1.4rem; font-weight:400; }
.level-step small { display:block; margin-top:4px; font-size:0.9rem; line-height:1.5; }
.level-step-symbol { display:grid; place-items:center; flex:0 0 33px; width:33px; height:33px; border-radius:50%; background:#edf0e4; color:#54725a; font-family:Georgia,serif; font-size:1.25rem; }
.level-step--complete .level-step-symbol { background:#2e6554; color:white; }
.level-locked { margin-left:auto; font-size:0.9rem; text-transform:uppercase; letter-spacing:.07em; }
.level-nav-note { color:#677665; font-size:0.9rem; margin:12px 0 0; line-height:1.6; }
.level-lab { border:1px solid var(--line,#d8dfcf); border-radius:17px; background:#fffef8; overflow:hidden; }
.level-lab-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:25px 28px 0; }
.level-lab-heading .eyebrow { font-size:0.9rem; margin-bottom:8px; }
.level-lab h2 { font-family:Georgia,'Times New Roman',serif; font-size:1.9rem; font-weight:400; letter-spacing:-.025em; margin:0; line-height:1.16; }
.level-task-dots { display:flex; list-style:none; gap:8px; padding:0; margin:0; flex-shrink:0; }
.level-task-dots li { display:grid; place-items:center; width:31px; height:31px; border-radius:50%; border:1px solid #d5ddce; color:#687766; font-size:1rem; }
.level-task-dots li[aria-current] { background:#285c4d; color:white; border-color:#285c4d; }
.level-task-dots li.done { background:#e0ecd9; color:#37634b; }
.level-intro { color:#596b5f; font-size:1.05rem; line-height:1.7; margin:13px 28px 23px; max-width:85ch; }
.level-lab-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); border-top:1px solid #e2e5da; }
.level-lab-picture { padding:25px 21px; background:#f5f1e7; min-width:0; }
.level-lab-picture svg { width:100%; height:auto; display:block; border-radius:11px; background:#f8f4e8; }
.level-lab-picture>p { color:#67766b; font-size:1rem; line-height:1.8; margin:19px 11px 0; }
.level-lab-controls { padding:25px 28px; min-width:0; }
.level-task-instruction { background:#f0f3e8; border-left:3px solid #9eb188; border-radius:0 7px 7px 0; padding:15px 17px; font-size:1.05rem; line-height:1.8; color:#38543f; margin-bottom:22px; }
.level-task-instruction .task-steps { margin-top:10px; }
.level-task-instruction .task-guide-tip { margin-bottom:0; }
.level-field { margin:0 0 19px; }
.level-field>label,.level-choice legend { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:1rem; line-height:1.6; font-weight:650; color:#38553e; margin-bottom:8px; }
.level-field output { color:#547549; font-size:1rem; font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.level-input-row { display:flex; align-items:center; gap:10px; }
.level-input-row>span { color:#65745f; font-size:1rem; }
.level-input-row input[type=number] { width:100%; min-width:0; max-width:250px; font:inherit; font-size:1.2rem; color:#294a3c; background:white; border:1px solid #bdcbb5; border-radius:8px; padding:10px 12px; min-height:44px; }
.level-input-row input[type=range] { width:100%; min-width:0; min-height:36px; margin:0; accent-color:#3d6a51; cursor:pointer; }
.level-field-help { font-size:0.9rem; line-height:1.7; color:#70816a; margin:7px 0 0; }
.level-choice { margin:0 0 20px; padding:0; border:0; }
.level-choice legend { margin-bottom:10px; }
.level-choice>label { display:flex; align-items:flex-start; gap:9px; padding:10px 11px; margin:6px 0; border:1px solid #dce2d3; border-radius:8px; font-size:1rem; line-height:1.6; cursor:pointer; background:#fffefa; }
.level-choice input { flex:0 0 auto; width:16px; height:16px; margin:2px 0 0; accent-color:#376851; }
.level-choice>label:has(input:checked) { background:#eaf2e4; border-color:#79976b; }
.level-form-actions { display:flex; gap:9px; flex-wrap:wrap; align-items:center; margin-top:22px; }
.level-reset { border:0; background:none; color:#687864; font:inherit; font-size:0.9rem; text-decoration:underline; text-underline-offset:3px; padding:10px 4px; cursor:pointer; }
.level-score-note { font-size:0.9rem; line-height:1.8; color:#76816f; margin:14px 0 0; }
.level-feedback { font-size:1rem; line-height:1.8; margin-top:15px; }
.level-feedback:not(:empty) { border-radius:9px; padding:12px 14px; background:#f4eedb; color:#6e5c33; }
.level-feedback[data-kind=success] { background:#e4f0dc; color:#376044; }
.level-feedback[data-kind=error] { background:#f8e9df; color:#815139; }
.level-task-next { margin-top:16px; }
.level-ending { display:grid; grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr); overflow:hidden; border:1px solid #d9dfd0; border-radius:22px; background:#fffdf5; box-shadow:0 12px 38px #3b4c3610; }
.level-ending-art { margin:0; background:#203b39; display:flex; flex-direction:column; justify-content:center; }
.level-ending-art img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.level-ending-art figcaption { padding:25px 28px 30px; color:#fff7df; font-family:Georgia,'Times New Roman',serif; font-size:1.65rem; line-height:1.3; }
.level-ending-art figcaption span { display:block; margin-top:9px; color:#d9e4ce; font-family:Inter,Arial,sans-serif; font-size:1rem; }
.level-ending-copy { padding:35px 36px 28px; }
.level-ending-kicker { display:flex; align-items:center; gap:9px; color:#7a6b36; font-size:0.9rem; letter-spacing:.1em; font-weight:700; line-height:1.6; }
.level-celebration-mark { font-size:1.85rem; color:#b3953c; }
.level-ending h2 { font-family:Georgia,'Times New Roman',serif; font-size:2.1rem; line-height:1.13; font-weight:400; letter-spacing:-.025em; margin:13px 0 20px; text-wrap:balance; }
.level-ending-story { color:#4e6358; font-size:1.1rem; line-height:1.85; margin:0 0 24px; }
.level-ending-result { padding:16px; background:#edf3e3; border:1px solid #d5e1c7; border-radius:11px; display:flex; gap:15px; align-items:flex-start; }
.level-ending-result>.stars { white-space:nowrap; font-size:1.2rem; letter-spacing:2px; line-height:1.5; }
.level-ending-result strong { display:block; font-size:1rem; color:#34583d; }
.level-ending-result p { color:#59734d; font-size:0.9rem; line-height:1.7; margin:5px 0 0; }
.level-save-message { color:#73816a; font-size:0.9rem; line-height:1.7; margin:13px 0 19px; }
.level-ending-actions { display:flex; flex-wrap:wrap; gap:10px; }
.level-ending-actions .btn { font-size:0.9rem; padding:11px 14px; }
.level-ending-replay { background:none; border:0; font:inherit; font-size:0.9rem; color:#54734d; text-decoration:underline; text-underline-offset:4px; cursor:pointer; padding:16px 0 3px; }
.chapter-levels button:focus-visible,.chapter-levels input:focus-visible,.chapter-levels a:focus-visible { outline:3px solid #bd9043; outline-offset:4px; }
.chapter-levels h2:focus,.chapter-levels h3:focus { outline:none; }
.chapter-progress-tag { display:block; margin-top:8px; font-size:0.9rem; line-height:1.7; color:#5c7453; }
.book-level-list { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0 0; padding:0; list-style:none; }
.book-level-list li { padding:5px 8px; border-radius:6px; background:#eef2e6; color:#59734c; font-size:0.9rem; }
.book-level-list li.level-book-locked { background:#f0f0ea; color:#7c8478; }
@media(max-width:900px) { .level-step { gap:8px; padding:11px; }.level-step[aria-current=step] { padding:10px; }.level-locked { display:none; }.level-lab-layout { grid-template-columns:1fr; }.level-lab-picture { padding:20px; }.level-lab-picture [data-level-visual] { max-width:680px; margin:auto; }.level-lab-picture>p { max-width:650px; margin:15px auto 0; }.level-ending { grid-template-columns:1fr; }.level-ending-art { display:block; }.level-ending-art img { max-height:400px; object-fit:cover; }.level-ending-art figcaption { padding:18px 27px; font-size:1.55rem; }.level-ending-art figcaption span { display:inline; margin-left:15px; font-size:0.9rem; }.level-ending-copy { padding:29px 31px; } }
@media(max-width:560px) { .chapter-levels { scroll-margin-top:130px; }.level-navigation { padding:17px 14px 13px; margin-bottom:19px; }.level-nav-heading { align-items:flex-start; gap:8px; }.level-nav-heading p { font-size:0.9rem; }.level-total { font-size:0.9rem; white-space:normal; max-width:82px; text-align:right; line-height:1.6; }.level-steps { gap:6px; }.level-step { display:block; min-height:119px; padding:10px 8px; }.level-step[aria-current=step] { padding:9px 7px; }.level-step-symbol { width:25px; height:25px; font-size:1.05rem; margin-bottom:8px; }.level-step strong { font-size:1.2rem; }.level-step small { font-size:0.9rem; line-height:1.6; }.level-nav-note { font-size:0.9rem; }.level-lab-heading { padding:22px 19px 0; align-items:flex-start; gap:10px; }.level-lab h2 { font-size:1.7rem; }.level-task-dots { gap:4px; }.level-task-dots li { width:23px; height:23px; font-size:0.9rem; }.level-intro { margin:13px 19px 20px; font-size:1rem; }.level-lab-picture { padding:15px 7px; }.level-lab-picture>p { font-size:0.9rem; margin:13px 10px 0; }.level-lab-controls { padding:22px 18px; }.level-task-instruction { font-size:1rem; padding:13px; }.level-ending-copy { padding:25px 21px; }.level-ending-art img { max-height:none; }.level-ending-art figcaption { font-size:1.5rem; padding:19px 21px; }.level-ending-art figcaption span { display:block; margin:7px 0 0; }.level-ending h2 { font-size:1.9rem; }.level-ending-story { font-size:1.05rem; }.level-ending-result { display:block; }.level-ending-result .stars { display:block; margin-bottom:9px; }.level-ending-actions { flex-direction:column; align-items:stretch; }.level-ending-actions .btn { justify-content:center; }.level-ending-kicker { font-size:0.9rem; } }
@media(max-width:360px) { .level-step strong { font-size:1.05rem; }.level-step { padding-left:4px; padding-right:4px; }.level-step[aria-current=step] { padding-left:3px; padding-right:3px; } }
@media print { .level-navigation,.level-ending-actions,.level-ending-replay { display:none!important; }.level-ending { break-inside:avoid; box-shadow:none; } }

/* A separate celebration follows the completed chapter story. */
.chapter-celebration{--medal-fill:#e9c48e;--medal-stroke:#ad7836;--medal-star:#85581e;--medal-ribbon:#74977a;position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);overflow:hidden;border:1px solid #d9c58d;border-radius:23px;background:linear-gradient(125deg,#fffbed,#fffdf6 57%,#f2f5e9);box-shadow:0 16px 45px #66542b14;scroll-margin-top:120px}
.celebration--medium{--medal-fill:#e5edf0;--medal-stroke:#8395a1;--medal-star:#526a7a;--medal-ribbon:#7d8dac}
.celebration--difficult{--medal-fill:#f7dc86;--medal-stroke:#ba8b24;--medal-star:#98690c;--medal-ribbon:#397665;border-color:#c5a35b}
.celebration-art{margin:0;display:flex;flex-direction:column;justify-content:center;background:#173d3c;position:relative;z-index:1}
.celebration-art img{width:100%;height:auto;object-fit:contain;display:block;aspect-ratio:3/2}
.celebration-art figcaption{color:#f7e7ad;font:italic 1.5rem/1.5 Georgia,serif;text-align:center;padding:28px 25px}
.celebration-copy{padding:32px 34px 23px;position:relative;z-index:2}
.celebration-kicker{font-size:0.9rem;font-weight:750;letter-spacing:.13em;text-transform:uppercase;color:#90722d;line-height:1.6}
.chapter-celebration h2{font:400 clamp(1.95rem,4vw,2.8rem)/1.1 Georgia,serif;letter-spacing:-.035em;color:#214f42;margin:10px 0 8px;text-wrap:balance}
.celebration-chapter{font-size:1.05rem;color:#66765b;line-height:1.5;margin:0 0 18px}
.celebration-award{display:flex;align-items:center;gap:17px;margin:0 0 16px;padding:14px 15px;background:#fff7df;border:1px solid #ebd8a0;border-radius:13px}
.celebration-medal{width:61px;height:74px;flex:0 0 61px;filter:drop-shadow(0 3px 2px #6d542b18);animation:medal-arrival .65s ease-out both}
.celebration-award span{font-size:0.9rem;font-weight:600;color:#8b743e;text-transform:uppercase;letter-spacing:.07em}
.celebration-award h3{font:400 1.7rem/1.15 Georgia,serif;color:#735922;margin:6px 0 0;text-wrap:balance}
.celebration-message{margin:0 0 19px;padding:0;border:0;color:#405d4d}
.celebration-message p{font-size:1.1rem;line-height:1.75;margin:0 0 7px}
.celebration-message cite{font-size:0.9rem;font-style:normal;font-weight:650;color:#758260}
.celebration-results{display:flex;gap:9px 18px;align-items:center;flex-wrap:wrap;border-top:1px solid #dfe3cf;border-bottom:1px solid #dfe3cf;padding:13px 0;color:#57704f;font-size:0.9rem;line-height:1.6}
.celebration-results .stars{font-size:1.55rem;letter-spacing:3px;color:#ae842a}
.celebration-idea{font-size:1rem;line-height:1.7;color:#657453;margin:15px 0 13px}
.celebration-unlock{font-size:1.05rem;font-weight:600;line-height:1.65;color:#315b40;margin:0 0 18px}
.celebration-actions{display:flex;flex-wrap:wrap;gap:9px}
.celebration-actions .btn{font-size:1rem;padding:12px 15px;min-height:44px}
.celebration-copy .level-save-message{margin:13px 0 3px}
.celebration-extras{display:flex;flex-wrap:wrap;gap:4px 22px}
.celebration-extras .level-ending-replay{padding:12px 0;min-height:44px}
.celebration-sound-note{font-size:0.9rem;line-height:1.6;color:#6e7e62;margin:1px 0 0}
.celebration-confetti{position:absolute;inset:0;overflow:hidden;z-index:3;pointer-events:none}
.celebration-confetti i{position:absolute;top:-24px;left:var(--x);width:8px;height:14px;border-radius:2px;background:var(--confetti);opacity:0;animation:discovery-confetti 2.8s ease-in var(--delay) 1 both}
.celebration-confetti i:nth-child(3n){width:8px;height:8px;border-radius:50%}
@keyframes discovery-confetti{0%{opacity:0;transform:translateY(-20px) rotate(0)}12%{opacity:.9}78%{opacity:.6}100%{opacity:0;transform:translateY(800px) rotate(var(--turn))}}
@keyframes medal-arrival{0%{transform:scale(.8) rotate(-9deg);opacity:0}70%{transform:scale(1.06) rotate(3deg)}100%{transform:scale(1) rotate(0);opacity:1}}
@media(max-width:850px){.chapter-celebration{grid-template-columns:minmax(0,1fr)}.celebration-art{background:#f2e8ca}.celebration-art img{max-height:380px;object-fit:contain}.celebration-art figcaption{color:#6e6137;padding:13px 20px;font-size:1.3rem}.celebration-copy{padding:27px 28px 22px}.celebration-confetti i{animation-duration:3.4s}}
@media(max-width:560px){.chapter-celebration{border-radius:16px;scroll-margin-top:190px}.celebration-copy{padding:24px 20px 20px}.celebration-art figcaption{font-size:1.2rem}.celebration-award h3{font-size:1.6rem}.celebration-actions{display:grid;grid-template-columns:1fr}.celebration-actions .btn{width:100%;text-align:center}.celebration-results{gap:8px 15px}.celebration-message p{font-size:1.05rem}.celebration-kicker{font-size:0.9rem}}
@media(prefers-reduced-motion:reduce){.celebration-confetti{display:none}.celebration-medal{animation:none}}
@media print{.celebration-confetti,.celebration-actions,.celebration-extras,.celebration-sound-note{display:none!important}.chapter-celebration{box-shadow:none;break-inside:avoid}}

/* Optional proof notes, used by the mirror chapter. */
.level-explanation { padding:14px 17px; margin:0 0 22px; border:1px solid #b8cdbd; border-radius:10px; background:#f1f7ef; line-height:1.75; }
.level-explanation summary { cursor:pointer; font-weight:700; }
.level-explanation p { margin:12px 0 0; }
.chapter-source-links a { display:inline-block; margin:5px 0; }

/* Accessible snapshot ordering, used by the flying-stones investigation. */
.level-order { border:0; margin:14px 0 20px; padding:0; min-width:0; }
.level-order legend { font-weight:650; color:#34584d; line-height:1.6; }
.level-order ol { list-style:none; padding:0; margin:10px 0; display:grid; gap:8px; }
.level-order li { display:flex; align-items:center; gap:10px; padding:8px 10px; background:#f3f0e5; border:1px solid #d4dcca; border-radius:10px; cursor:grab; }
.level-order-number { background:#285c53; color:#fff; min-width:26px; height:26px; border-radius:50%; text-align:center; line-height:26px; font-size:.9rem; }
.level-order-symbol { font-size:1.6rem; color:#b57a29; }
.level-order-label { flex:1; line-height:1.4; }
.level-order-buttons { display:flex; gap:5px; flex:none; }
.level-order-buttons button { min-width:44px; min-height:44px; border:1px solid #bbcbb9; background:#fffdf5; color:#285c53; border-radius:6px; font-size:1.2rem; cursor:pointer; }
.level-order-buttons button:disabled { opacity:.35; cursor:default; }
.level-order-buttons button:focus-visible { outline:3px solid #ba8e41; outline-offset:2px; }
@media(max-width:440px) { .level-order li { gap:6px; padding:7px; } .level-order-symbol { display:none; } .level-order-label { font-size:.95rem; } }

/* Euclid instruments: keep measurements readable in narrow responsive layouts. */
@media(max-width:600px) { .euclid-beginning-instrument text { font-size:24px; } }
