.c11-route{padding:clamp(16px,2.5vw,28px)}
.c11-section-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:18px 0 28px}
.c11-section-nav button{text-align:left;justify-content:flex-start;font-size:12px;line-height:1.5;padding:10px;min-height:58px}
.c11-section-nav button span{color:#6e86a0;font-size:11px}.c11-section-nav button[aria-pressed=true],.c11-question-nav button[aria-pressed=true]{border-color:#245fa5;background:#edf4fc;color:#17344f;font-weight:650}
.c11-section-heading h2{font-size:clamp(22px,2.4vw,29px);line-height:1.35;margin-bottom:18px}.c11-section-heading .small{margin-bottom:8px}
.c11-picture{border:1px solid #d9e4ef;background:#f8fbff;border-radius:7px;overflow:hidden;margin:18px 0}
.c11-diagram{display:block;width:100%;height:auto;max-height:320px;font-family:Inter,'Segoe UI',sans-serif}.c11-diagram text{font-weight:500}
.c11-model-note{padding:0 16px 12px;margin:0;font-size:11px;line-height:1.6;color:#587088}
.c11-frame-heading{display:flex;align-items:baseline;gap:14px;margin-top:20px}.c11-frame-heading h3{margin:0}.c11-frame-heading>span{font-size:12px;color:#587088;white-space:nowrap}
.c11-caption{font-size:17px;line-height:1.8;margin:14px 0;max-width:820px}
.c11-input{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13px;line-height:1.6;margin:14px 0;color:#365673}
.c11-input select{max-width:100%;min-height:40px;padding:7px 12px;border:1px solid #b5c9dd;border-radius:4px;background:white;color:#17344f;font:inherit}
.c11-input input[type=range]{width:min(320px,100%);accent-color:#245fa5;min-height:30px}.c11-input output{font-weight:700}
.c11-takeaway{padding:16px 18px;background:#f1f7f3;border-left:3px solid #508371;margin:22px 0;color:#2e5c4d}.c11-takeaway strong{font-size:12px}.c11-takeaway p{margin:8px 0 0;font-size:15px}
.c11-worked{border-top:1px solid #d9e2eb;padding-top:24px;margin-top:24px}.c11-worked>p{font-size:16px}.c11-worked .working{font-size:15px}
.c11-question-nav{display:flex;gap:7px;flex-wrap:wrap;margin:22px 0}.c11-question-nav button{min-width:42px;padding:6px 9px;font-size:12px}.c11-route h3{line-height:1.6}.c11-route fieldset:disabled{opacity:.8}.c11-route fieldset:disabled label{cursor:default}
.c11-exam-task+.c11-exam-task{border-top:1px solid #d9e2eb;padding-top:28px;margin-top:32px}.c11-exam-task .c11-frame-heading{justify-content:space-between}.c11-exam-task textarea{margin-top:8px}
.c11-criterion{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.8;padding:12px 0}.c11-criterion input{margin-top:6px;accent-color:#245fa5;flex:0 0 auto}
.c11-route .recall-card summary{font-size:16px}.c11-route select:focus-visible{outline:3px solid #e0a44a;outline-offset:3px}
@media(max-width:1100px){.c11-section-nav{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.c11-section-nav{gap:6px}.c11-section-nav button{min-height:54px;padding:8px;font-size:11px}.c11-caption{font-size:15px}.c11-model-note{font-size:11px;padding:0 10px 10px}.c11-input{font-size:12px}.c11-frame-heading{gap:10px}.c11-frame-heading h3{font-size:17px}.c11-route .actions{gap:7px}.c11-route .actions button,.c11-route .actions a{font-size:12px;padding:8px 10px}.c11-worked .working{font-size:14px;padding-left:20px}}

.c11-story-picture{background:white}.c11-bond-diagram{display:block;width:100%;max-height:350px;height:auto;background:#f8fbff}.c11-bond-diagram text{font-family:Inter,'Segoe UI',sans-serif}
.c11-atom-key{display:flex;justify-content:center;gap:26px;padding:12px 16px;border-bottom:1px solid #d9e4ef;font-size:13px;color:#365673}.c11-atom-key>span{display:flex;align-items:center;gap:8px}.c11-atom-key i{display:block;width:11px;height:11px;border-radius:50%}.oxygen-key{background:#ad5b55}.hydrogen-key{background:#245fa5}
.c11-bond-subtitles{padding:20px 22px 8px}.c11-bond-subtitles .step-label{margin:0 0 8px}.c11-bond-subtitles [data-bond=subtitle]{font-size:18px;line-height:1.7;min-height:62px;margin:0;color:#17344f}
.c11-bond-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 22px 12px}.c11-bond-controls button{font-size:13px}.c11-timeline-label{display:block;padding:0 22px 14px;font-size:11px;color:#587088}.c11-timeline-label input{display:block;width:100%;margin:8px 0 0;min-height:26px;accent-color:#245fa5}.c11-bond-story .c11-model-note{padding:0 22px 12px}
.c11-formula-reading{margin:26px 0;padding:22px;border:1px solid #d9e4ef;border-radius:7px;background:#fafcfe}.c11-formula-reading h3{font-size:22px;line-height:1.6}.c11-chemical{display:inline-block;margin-left:8px;letter-spacing:1px;font-family:Georgia,'Times New Roman',serif;font-weight:600}.c11-chemical sub{font-size:.7em}
.c11-formula-counts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.c11-formula-counts>div{display:flex;align-items:center;flex-direction:column;gap:10px;padding:18px 12px;border:1px solid #cadbeb;border-radius:6px;background:white}.c11-element-name{font-size:13px;color:#587088}.c11-element-symbol{font-family:Georgia,'Times New Roman',serif;font-size:31px;line-height:1.3;color:#245fa5}.c11-formula-counts strong{font-size:38px;line-height:1.2;font-variant-numeric:tabular-nums;letter-spacing:1px}.c11-formula-counts small{font-size:12px;color:#587088}.c11-formula-total{text-align:center;font-size:16px;line-height:1.7}
@media(max-width:480px){.c11-bond-subtitles{padding:16px 14px 8px}.c11-bond-subtitles [data-bond=subtitle]{font-size:15px;min-height:88px}.c11-bond-controls{padding:8px 14px 12px;gap:8px}.c11-timeline-label{padding:0 14px 12px}.c11-bond-story .c11-model-note{padding:0 14px 10px}.c11-atom-key{font-size:12px;gap:20px}.c11-formula-reading{padding:16px 12px}.c11-formula-reading h3{font-size:19px}.c11-formula-counts{gap:8px}.c11-formula-counts>div{padding:15px 5px;gap:9px}.c11-element-name{font-size:11px}.c11-element-symbol{font-size:28px}.c11-formula-counts strong{font-size:34px}}
