/* CSI course: one guided figure at a time, with a numerical reading alongside. */
.cs-course{display:grid;grid-template-columns:210px minmax(0,1fr);gap:2.5rem;margin:2rem 0 4rem}
.cs-syllabus{align-self:start;position:sticky;top:1rem;font-family:var(--font-ui,Arial,sans-serif)}
.cs-syllabus h2{font-size:1.1rem}.cs-syllabus p{font-size:.8rem;color:#656565}
.cs-syllabus nav{display:flex;flex-direction:column;border-top:1px solid #ddd}
.cs-syllabus nav button{display:flex;gap:.65rem;text-align:left;border:0;border-bottom:1px solid #ddd;padding:.65rem .5rem;background:transparent;font-size:.85rem;cursor:pointer;width:100%}
.cs-syllabus nav button span:first-child{color:#767676;font-variant-numeric:tabular-nums}
.cs-syllabus nav button.cs-current{background:#dce9f2;color:#154d72;border-left:3px solid #1a6091;font-weight:600}
.cs-syllabus>a{display:block;font-size:.82rem;margin-top:.7rem}.cs-reading-toggle{margin-top:1rem}
.cs-course button,.cs-course select{font:inherit;cursor:pointer}.cs-course button:focus-visible,.cs-course input:focus-visible,.cs-course select:focus-visible{outline:3px solid #1a6091;outline-offset:3px}
.cs-lesson-area{min-width:0}.cs-lesson-area h2{font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.15;margin:.7rem 0 1.1rem}.cs-lesson-area article>p{max-width:80ch;line-height:1.7}
.cs-lead{font-size:1.15rem;line-height:1.65}.cs-step-bar,.cs-step-nav,.cs-lab-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
#cs-active-title{scroll-margin-top:6rem}#cs-active-title:focus{outline:none}
.cs-step-bar{font: .8rem var(--font-ui,Arial,sans-serif);color:#666}.cs-step-nav{margin-top:1.8rem;padding-top:1rem;border-top:1px solid #ddd}
.cs-step-nav button,.cs-checkpoint button,.cs-lab-bar button,.cs-import button,.cs-reading-toggle{border:1px solid #b8c4cc;border-radius:3px;background:#fff;padding:.45rem .8rem;font-size:.85rem}
.cs-step-nav button:disabled{opacity:.4;cursor:default}.cs-equation{white-space:pre-wrap;overflow-wrap:anywhere;background:#edf3f7;border-left:3px solid #1a6091;padding:1.1rem;font-size:.95rem;line-height:1.7}
.cs-task{border-left:3px solid #b7c9d5;padding-left:1rem}.cs-figure{margin:1.5rem 0;border:1px solid #ccd5db;background:#fff;min-width:0}.cs-figure figcaption{padding:1rem;border-top:1px solid #ddd;font-size:.9rem;line-height:1.6}.cs-figure figcaption span{display:block;margin-top:.4rem;font-size:.8rem}
.cs-lab{padding:1rem;min-width:0}.cs-lab-bar{border-bottom:1px solid #ddd;padding-bottom:.7rem;margin-bottom:1rem}.cs-lab-bar strong{font:600 .7rem var(--font-ui,Arial,sans-serif);letter-spacing:.04em;color:#52636c}
.cs-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:.8rem 1.2rem;font: .83rem var(--font-ui,Arial,sans-serif)}
.cs-controls label{display:flex;flex-direction:column;gap:.4rem;min-width:0}.cs-controls output{display:inline;font-variant-numeric:tabular-nums}.cs-controls input[type=range]{width:100%;accent-color:#1a6091}.cs-controls select,.cs-controls input[type=number]{width:100%;padding:.45rem;border:1px solid #a9b9c5;background:#fff;box-sizing:border-box;font:inherit}
.cs-check{display:flex!important;flex-direction:row!important;align-items:center;gap:.6rem;margin-top:.8rem}.cs-check input{accent-color:#1a6091}
.cs-plot{height:380px;width:100%;min-width:0}.cs-plot-frame{min-width:0}.cs-plot-frame h4{font:600 .85rem var(--font-ui,Arial,sans-serif);margin:1.3rem 0 .4rem}.cs-two-plots{display:grid;grid-template-columns:1fr;gap:1rem}
.cs-table-wrap,.cs-vector{overflow-x:auto}.cs-readout,.cs-guide-table,.cs-vector table{border-collapse:collapse;width:100%;font: .85rem var(--font-ui,Arial,sans-serif);line-height:1.5}.cs-readout caption,.cs-guide-table caption,.cs-vector caption{text-align:left;font-weight:600;padding:.75rem 0}.cs-readout td,.cs-readout th,.cs-guide-table td,.cs-guide-table th,.cs-vector td,.cs-vector th{padding:.65rem;text-align:left;vertical-align:top;border-bottom:1px solid #ddd}.cs-readout th{width:40%;font-weight:500}.cs-readout td{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.cs-guide-table th{min-width:125px}.cs-guide-table td{min-width:190px}
.cs-vector{max-height:400px;margin-top:.8rem}.cs-vector th{position:sticky;top:0;background:#f2f5f7}.cs-selected{background:#dce9f2}.cs-vector button{white-space:nowrap}.cs-import{margin:1rem 0;padding:1rem;background:#f4f6f7}.cs-import textarea{width:100%;box-sizing:border-box;font: .8rem monospace}.cs-import p{font-size:.9rem}.cs-import button{margin:.5rem .5rem 0 0}.cs-warning,.cs-error{background:#fff0db;border-left:3px solid #a85713;padding:.8rem;font-size:.9rem}
.cs-checkpoint{padding:1.2rem;background:#f0f4f6;margin-top:1.5rem}.cs-checkpoint h3{margin:0}.cs-example{padding:.9rem 0}.cs-field-guide{border-top:1px solid #bbc8d1;padding-top:2rem;margin-top:3rem;scroll-margin-top:1rem}.cs-field-guide>p,.cs-field-guide>ol{max-width:90ch;line-height:1.7}.cs-provenance{font-size:.88rem;color:#666;max-width:95ch}.cs-reading{padding:1rem 0 2rem;border-bottom:1px solid #ddd;max-width:85ch}.cs-fallback-nav{display:flex;gap:1rem;flex-wrap:wrap}.cs-small{font-size:.75rem}
.cs-school-page .display{font-size:clamp(2rem,4vw,3.4rem);margin:.5rem 0}.cs-school-page .lede{font-size:1.05rem;max-width:80ch}.cs-school-page .tb-plainbar{display:none}.cs-school-page>.wrap-wide>.tb-rail{display:none}.cs-school-page .cs-provenance{font-size:.75rem}.cs-favorites{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0}.cs-favorites a{border:1px solid #bac9d4;padding:.45rem .7rem;font:.8rem var(--font-ui,Arial,sans-serif);background:#fff;border-radius:3px}
.cs-frames{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}.cs-frames button{padding:.6rem;border:1px solid #d3dce2;background:#f7f9fa;text-align:left;font:.8rem var(--font-ui,Arial,sans-serif);line-height:1.4}.cs-frames button span{display:block;font-size:.7rem;margin-bottom:.3rem}.cs-frames button.cs-frame-active{border-color:#1a6091;background:#dce9f2;color:#154d72}.cs-frame-instruction{font-size:.95rem;line-height:1.6;margin:1rem 0}.cs-frame-nav{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin:.8rem 0;font:.75rem var(--font-ui,Arial,sans-serif)}.cs-frame-nav button{border:1px solid #c1cdd6;padding:.5rem;background:#fff;border-radius:3px}.cs-frame-nav button:disabled{opacity:.4}
.cs-live-formula{background:#eef4f8;border:1px solid #cbdbe7;padding:1rem;margin:1rem 0}.cs-live-formula .eyebrow{font-size:.65rem}.cs-formula-value{font:1rem var(--font-mono,monospace);line-height:1.8;overflow-wrap:anywhere;margin:.5rem 0 1rem}.cs-symbols{display:flex;flex-wrap:wrap;gap:.4rem}.cs-symbols button{border:1px solid #b5c9d7;padding:.4rem .8rem;background:#fff;font:1rem var(--font-mono,monospace)}.cs-symbols button.cs-symbol-active{background:#1a6091;color:#fff}.cs-symbol-explanation{font:.85rem var(--font-ui,Arial,sans-serif);line-height:1.7;margin-bottom:0}.cs-controls label{padding:.5rem;border:1px solid transparent}.cs-controls label.cs-control-active{background:#edf4fa;border-color:#8dabc0}.cs-theory{padding:1rem;border-top:1px solid #ccd5db;border-bottom:1px solid #ccd5db}.cs-theory p{line-height:1.7}.cs-lesson-area .cs-lead{font-size:1rem;line-height:1.6;margin-bottom:1rem}
@media(min-width:1200px){.cs-two-plots{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.cs-course{grid-template-columns:1fr;gap:1.5rem}.cs-syllabus{position:static}.cs-syllabus nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.cs-syllabus nav button{font-size:.8rem}.cs-plot{height:330px}}
@media(max-width:480px){.cs-syllabus nav{grid-template-columns:repeat(2,minmax(0,1fr))}.cs-lab{padding:.7rem}.cs-controls{grid-template-columns:1fr}.cs-step-nav button{font-size:.75rem}.cs-readout th{width:45%}}
@media(max-width:650px){.cs-frames{grid-template-columns:repeat(2,minmax(0,1fr))}.cs-formula-value{font-size:.85rem}.cs-frame-nav button{font-size:.7rem}}
@media print{.cs-syllabus,.cs-step-nav,.cs-controls,.cs-lab-bar button,.tb-rail,.tb-plainbar,.masthead,.livebar,.colophon{display:none!important}.cs-course{display:block}.cs-reading{break-inside:auto}.cs-equation{break-inside:avoid}.cs-field-guide{break-before:page}.cs-plot{height:300px}}
