*{box-sizing:border-box} :root{font:16px/1.65 system-ui,sans-serif;color:#1d2c3c;background:#f4f6f8}body{margin:0}a{color:inherit;text-underline-offset:3px}button,input,select,textarea{font:inherit}button,select{cursor:pointer}button{border:1px solid #b7c3cf;border-radius:5px;padding:.55em .9em;background:white;color:#14283e;font-weight:600}button:hover{background:#e7edf2}button.primary{background:#922941;color:white;border-color:#922941}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid #bc7c00;outline-offset:3px}.skip{position:fixed;top:-100px;background:white;z-index:50;padding:1em}.skip:focus{top:0}aside{position:fixed;inset:0 auto 0 0;width:285px;overflow:auto;background:#14283e;color:white;padding:28px 24px}.brand{font-weight:750;text-decoration:none;font-size:1.3rem}.eyebrow{color:#edc77c;letter-spacing:.1em;font-size:.875rem;font-weight:700}h1{font:400 2.35rem/1.12 Georgia,serif;margin:22px 0}h1 span{color:#edc77c}aside p,aside small{color:#cfdae4}small{font-size:.875rem}.progress-label{display:flex;justify-content:space-between;gap:10px}progress{width:100%;accent-color:#edc77c}#steps{display:grid;gap:5px;margin:20px 0}#steps a{padding:7px 10px;text-decoration:none;border-left:3px solid transparent;font-size:.95rem}#steps a[aria-current=step]{background:#294057;border-color:#edc77c}#steps a .done{float:right;color:#edc77c}.page{margin-left:285px;min-width:0}header{padding:16px 32px;display:flex;justify-content:space-between;align-items:center;gap:16px;background:white;border-bottom:1px solid #dce2e7;font-size:.875rem}main,#reference{max-width:1390px;margin:auto;padding:32px}h2{font:400 clamp(2rem,4vw,3rem)/1.18 Georgia,serif;margin:8px 0 18px}h3{font-size:1.2rem;margin:0 0 12px}h4{margin:0 0 10px}.meta{color:#922941;font-weight:700;letter-spacing:.04em;font-size:.875rem}.lead{font-weight:600;font-size:1.1rem;max-width:78ch}.teaching{max-width:88ch}.teaching p{margin:12px 0}.worked{padding:0 4px}.takeaway{border-left:4px solid #922941;padding:12px 16px;background:#e9eef3}.panel,.question,.apply,.quiz-card{background:white;border:1px solid #dce2e7;padding:22px;border-radius:6px;margin:22px 0}.question fieldset,.quiz-card fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-weight:650;margin-bottom:12px}.choice{display:flex;align-items:start;gap:10px;border-top:1px solid #e5e9ee}.choice input{margin-top:19px;flex:none}.choice label{padding:12px 0;cursor:pointer;flex:1}.choice:has(input:checked){background:#f5edf0}.feedback{margin-top:12px;padding:12px 16px;background:#eef3f7;border-left:4px solid #922941;white-space:pre-line}.feedback:empty{display:none}.feedback.success{border-color:#236b50;background:#edf6f0}.teaching-code,textarea{background:#14283e;color:#f4f6f8;border-radius:5px;font:1rem/1.6 "Courier New",monospace;padding:18px;tab-size:4}.teaching-code{white-space:pre-wrap;overflow-wrap:anywhere}code{font-family:"Courier New",monospace;overflow-wrap:anywhere}pre{white-space:pre-wrap;overflow-wrap:anywhere}textarea{width:100%;min-height:310px;resize:vertical;border:0;white-space:pre;overflow:auto}label.editor-label{display:block;font-weight:650;margin-bottom:8px}.workspace{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);gap:22px}.workspace>div{min-width:0}.actions,.presets,.bottom{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:14px 0}.bottom{justify-content:space-between;margin-top:28px}.presets button{font-size:.875rem;padding:.35em .65em}.presets button[aria-pressed=true]{border:2px solid #922941;background:#f9edf0}.width-control{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.width-control input[type=range]{flex:1;min-width:110px;accent-color:#922941}.width-control input[type=number]{width:95px;padding:5px;border:1px solid #a9b8c6;border-radius:4px}.preview-scroll{overflow:auto;max-width:100%;background:#e6ebf0;border:1px solid #b7c3cf;padding:0}.preview-scroll iframe{display:block;border:0;background:white;height:330px;max-width:none}.ruler{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}.ruler span{padding:3px 7px;border-bottom:3px solid #c4ced7;font-size:.875rem}.ruler .active{border-color:#922941;background:#f9edf0;font-weight:650}.subtle{font-size:.875rem;color:#536274}.width-status{font-weight:650;font-size:.875rem}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;padding:10px;border-bottom:1px solid #dce2e7;vertical-align:top}table input,table select{max-width:100%;width:130px;padding:6px;border:1px solid #adbbc7;border-radius:4px}caption{text-align:left;font-weight:650;margin:8px 0}.target-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0}.target{background:#eef3f7;padding:12px;border-radius:4px}.blocks{display:grid;gap:4px}.blocks span{background:#dbe6f2;border:1px solid #667f99;text-align:center;padding:4px;font-size:.875rem}.blocks .heading{grid-column:1/-1;background:#14283e;color:white}.target p{font-size:.875rem;margin:5px 0}.checklist{list-style:none;padding:0}.checklist li{padding:8px 0;border-bottom:1px solid #dde5e9}.checklist .pass{color:#205e45}footer{padding:24px 32px;font-size:.875rem;color:#596775}#reference{background:white;border-top:4px solid #922941;margin-bottom:24px}#reference h2{font-size:2rem}.measure-frame{position:fixed;left:-20000px;top:0;border:0;height:800px;visibility:hidden;pointer-events:none}.completed{background:#edf6f0;border-left:4px solid #236b50;padding:18px}.quiz-card pre{font-size:.95rem;background:#eef3f7;padding:15px}[hidden]{display:none!important}
@media(max-width:1150px){.workspace{grid-template-columns:1fr}aside{width:250px}.page{margin-left:250px}main,#reference{padding:25px}}@media(max-width:720px){aside{position:static;width:auto;padding:22px}aside h1{font-size:2rem}aside p{margin:10px 0}#steps{grid-template-columns:1fr 1fr}#steps a{font-size:.875rem;padding:6px}.page{margin:0}header{padding:14px;flex-wrap:wrap}main,#reference{padding:18px}.panel,.question,.apply,.quiz-card{padding:16px}.target-grid{grid-template-columns:1fr}.target{max-width:330px}.teaching-code,textarea{font-size:1rem}footer{padding:18px}h2{font-size:2rem}}
@media print{aside,header,main,footer,#reference button{display:none!important}.page{margin:0}#reference{display:block!important;border:0;margin:0;padding:0;font-size:11pt}#reference h2{font-size:22pt}a{color:black}}
/* Cards lab: one reading surface, followed by editor and rendered experiment. */
.teaching{max-width:100%}.teaching p{max-width:90ch}.teaching-code{max-height:560px;overflow:auto}.extension-label{margin:14px 10px 4px;color:#edc77c;font-weight:700;font-size:.875rem}textarea{min-height:460px;border:1px solid #557087}.workspace{display:block}.width-control>div:first-child{flex:1;display:flex;align-items:center;gap:12px}.width-control label{font-size:.875rem;font-weight:650}.width-control>div:last-child{display:flex;align-items:center;gap:10px}.guide-control{display:flex;align-items:center;gap:10px;margin:14px 0}.guide-control label{font-size:.95rem}.layout-status{background:#eef3f7;padding:12px;font-size:.95rem;font-weight:650}.check-result{padding:12px 16px;margin:8px 0;border-left:4px solid #9b5d00}.check-result.passed{background:#e4f4e9;border-color:#236b50;color:#184b36}.check-result.needs-work{background:#fff4df;color:#694000}.completion-panel{border-top:4px solid #922941}.pending{color:#694000}.measure-frame{height:3000px}.preview-scroll{max-height:1000px}.width-presets button{font-size:.875rem}#reference table{min-width:0}#reference th:first-child{width:45%}#reference button{margin-top:14px}#checks{overflow-wrap:anywhere}aside nav p{font-size:.875rem}header span{white-space:nowrap}summary{cursor:pointer;padding:10px 0;font-weight:650}#solution[open]{margin-top:18px}
@media(max-width:720px){textarea{min-height:380px}#steps .extension-label{grid-column:1/-1}.width-control>div{width:100%}.width-control>div:last-child{justify-content:space-between}.teaching-code{font-size:.95rem}.page header{font-size:.875rem}#reference th,#reference td{padding:8px}.bottom button{flex:1}.preview-scroll{max-height:800px}}
@media print{#reference{display:block!important}.table-scroll{overflow:visible}#reference table{font-size:10pt}#reference tr{break-inside:avoid}}
/* A single practice task followed by reflection, in the Forms lab format. */
.example-toolbar{display:flex;gap:14px;align-items:end;flex-wrap:wrap;margin:20px 0}.example-toolbar>div{flex:1;min-width:220px}.example-toolbar label{display:block;font-weight:650;margin-bottom:6px}.example-toolbar select{width:100%;min-height:46px;background:white;color:#14283e;padding:8px 12px;border:1px solid #9eafbf;border-radius:5px}.practice li{margin:10px 0;max-width:95ch}.practice ol,.practice ul{padding-left:25px}.completion-panel{padding:20px 0;margin:22px 0}.challenge-check{border-top:1px solid #dce2e7;margin-top:22px;padding-top:12px}.challenge-check button{margin:4px 8px 4px 0}.extension-review{padding:18px 0;margin:20px 0;border-top:1px solid #dce2e7}.extension-review summary{font-size:1.15rem}.review-result{white-space:normal;margin:24px 0}.review-result h3{margin:0 0 12px}.review-result p{margin:12px 0}.review-link{padding:8px 0;font-size:.95rem}.bottom .review-link{flex-basis:100%}.quiz-card .teaching-code{max-height:350px}.teaching{margin-bottom:24px}
@media(max-width:720px){.example-toolbar>div{min-width:0;width:100%;flex-basis:100%}.example-toolbar button{width:100%}.practice li{margin:12px 0}.bottom .review-link{font-size:.9rem}.question legend,.quiz-card legend{overflow-wrap:anywhere}}
.review-example{margin:12px 0 18px}.review-example figcaption{font-size:.875rem;font-weight:650;margin-bottom:8px}.review-example iframe{display:block;width:100%;height:340px;border:1px solid #b7c3cf;background:white}.quiz-card .teaching-code{color:#14283e}
