/* Science controls describe actions; native ranges remain usable with keys and touch. */
.science-play-range,.science-play-action{--tool-color:#ccebdc;--tool-ink:#243d35;box-sizing:border-box;color:var(--tool-ink)}
[data-tone=blue],[data-tone=cool]{--tool-color:#d7edf5}[data-tone=yellow],[data-tone=warm]{--tool-color:#f6edb6}[data-tone=pink]{--tool-color:#f1dce8}[data-tone=red]{--tool-color:#f6d6d2}[data-tone=green]{--tool-color:#d7edce}[data-tone=purple]{--tool-color:#e2def4}
.science-play-range{display:block;background:#fffdf8;border:1px solid #d7ded2;border-radius:22px;padding:16px;margin:0;min-width:0;box-shadow:0 4px 0 #dde4d7}
.science-play-range-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:calc(16px * var(--reading-scale,1))}
.science-play-range-heading b{flex:1;line-height:1.4}.science-play-range-heading img{width:46px;height:38px;object-fit:contain}.science-play-range output{padding:4px 10px;background:var(--tool-color);border-radius:12px;font-weight:800;min-width:36px;text-align:center}
.science-play-range input[type=range]{display:block;width:100%;height:52px;min-height:52px;margin:8px 0 0;padding:0;appearance:none;background:transparent;cursor:grab;accent-color:#426c58;touch-action:pan-y}
.science-play-range input[type=range]:active{cursor:grabbing}.science-play-range input[type=range]::-webkit-slider-runnable-track{height:16px;background:linear-gradient(to right,#426c58 var(--tool-progress),var(--tool-color) var(--tool-progress));border:1px solid #829884;border-radius:12px}.science-play-range input[type=range]::-webkit-slider-thumb{appearance:none;width:42px;height:42px;background:#fffdf6;border:3px solid #426c58;border-radius:50%;margin-top:-14px;box-shadow:0 4px 0 #b6cdbd}.science-play-range input[type=range]::-moz-range-track{height:16px;background:var(--tool-color);border:1px solid #829884;border-radius:12px}.science-play-range input[type=range]::-moz-range-progress{height:16px;background:#426c58;border-radius:12px}.science-play-range input[type=range]::-moz-range-thumb{width:36px;height:36px;background:#fffdf6;border:3px solid #426c58;border-radius:50%}
.science-play-range-ends{display:flex;justify-content:space-between;gap:12px;font-size:calc(13px * var(--reading-scale,1));font-weight:700}.science-play-range small{display:block;margin-top:8px;font-size:calc(13px * var(--reading-scale,1));line-height:1.5}
.science-play-action{display:flex;align-items:center;justify-content:center;gap:10px;min-height:72px;min-width:48px;padding:12px 14px;border:1px solid #bfcfbb;border-radius:20px;background:var(--tool-color);box-shadow:0 5px 0 #b8c8b4;text-align:left;cursor:pointer;font:inherit;transition:transform .12s,box-shadow .12s}
.science-play-action b{display:block;font-size:calc(17px * var(--reading-scale,1));line-height:1.35}.science-play-action small{display:block;margin-top:4px;font-size:calc(13px * var(--reading-scale,1));line-height:1.4}.science-play-action img{width:50px;height:44px;object-fit:contain}.science-play-action:active{transform:translateY(4px);box-shadow:0 1px 0 #b8c8b4}.science-play-action[aria-pressed=true]{border:3px solid #426c58;padding:10px 12px}.science-play-action-state{align-self:flex-start;font-size:calc(12px * var(--reading-scale,1));font-weight:800;background:#fffdf8;border:1px solid currentColor;border-radius:9px;padding:3px 5px;white-space:nowrap}
.science-play-action:disabled,.science-play-range input:disabled{cursor:default;opacity:.6}.science-play-action:focus-visible,.science-play-range input:focus-visible,[data-extra-drag]:focus-visible,[data-science-drag]:focus-visible,[data-extra-stage] [role=button]:focus-visible{outline:3px solid #173f32;outline-offset:5px}
.science-play-deck,.science-play-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 16px}.science-play-deck>.science-play-range{grid-column:1/-1}.science-play-actions>.science-play-action:only-child{grid-column:1/-1}.science-play-action[data-science-toggle]{justify-content:flex-start}
.science-play-options{margin-top:14px;border:1px solid #d7ded2;border-radius:18px;background:#fffdf8;padding:0 12px}.science-play-options summary{min-height:48px;display:flex;align-items:center;gap:8px;font-size:calc(14px * var(--reading-scale,1));font-weight:700;cursor:pointer}.science-play-options[open]{padding-bottom:16px}.science-play-options[open] .science-play-range{margin-top:12px}
.science-extra-controls fieldset{display:block;border:0;padding:0;margin:0;min-width:0}.science-extra-controls .science-play-deck{margin-top:4px}.science-extra-controls .science-play-action{width:100%}.science-extra-controls .science-play-options{grid-column:1/-1}.science-extra-stage [role=button],[data-extra-drag],[data-science-drag]{cursor:grab;touch-action:none}.science-extra-stage [role=button]{cursor:pointer}.science-extra-stage [role=button]:active,[data-extra-drag]:active{cursor:grabbing}
.science-controls .science-choice{min-height:52px}.science-play-hint,.science-extra-note{font-size:calc(14px * var(--reading-scale,1));line-height:1.5;color:#3b5045}
.science-extra-lab>header,.science-header{padding-bottom:6px}.science-extra-lab .science-extra-result{font-size:calc(18px * var(--reading-scale,1))}
[data-reduced-motion=true] .science-play-action{transition:none;transform:none}@media(prefers-reduced-motion:reduce){.science-play-action{transition:none;transform:none}}
[data-color-mode=contrast] .science-play-action,[data-color-mode=contrast] .science-play-range,[data-color-mode=contrast] .science-play-options{background:#fff;color:#111;border:2px solid #111;box-shadow:0 3px 0 #111}[data-color-mode=contrast] .science-play-action[aria-pressed=true]{background:#fff4a6;border-width:4px}[data-color-mode=contrast] .science-play-range input[type=range]::-webkit-slider-thumb{border-color:#111}[data-color-mode=contrast] .science-play-range input[type=range]::-webkit-slider-runnable-track{background:#ddd;border-color:#111}
@media(max-width:440px){.science-play-action{padding:10px;gap:7px}.science-play-action b{font-size:calc(16px * var(--reading-scale,1))}.science-play-action small{font-size:calc(12px * var(--reading-scale,1))}.science-play-action img{width:36px;height:36px}.science-play-deck,.science-play-actions{gap:10px}.science-play-range{padding:12px}.science-play-range-heading b{font-size:calc(15px * var(--reading-scale,1))}}
@media(max-width:360px){[data-text-size="150"] .science-play-deck,[data-text-size="150"] .science-play-actions{grid-template-columns:1fr}}
/* The switch is a functional lever, with its state also written in words. */
.science-play-action[data-science-toggle="closed"]{grid-column:1/-1;position:relative;padding-right:90px;min-height:84px}
.science-play-action[data-science-toggle="closed"]::after{content:"";position:absolute;right:18px;top:50%;width:52px;height:30px;margin-top:-15px;border:2px solid #426c58;border-radius:18px;background:#fffdf8}
.science-play-action[data-science-toggle="closed"]::before{content:"";position:absolute;right:43px;top:50%;z-index:1;width:28px;height:28px;margin-top:-14px;background:#426c58;border:2px solid #fff;border-radius:50%;transition:right .12s}
.science-play-action[data-switch-state="on"]::before{right:19px}.science-play-action[data-switch-state="on"]::after{background:#d2eb67}
.science-play-fine{border:1px solid #d7ded2;border-radius:18px;background:#fffdf8;padding:0 12px;margin-top:14px;grid-column:1/-1}.science-play-fine summary{min-height:48px;display:flex;align-items:center;font-size:calc(14px * var(--reading-scale,1));font-weight:700;cursor:pointer}.science-play-fine[open]{padding-bottom:14px}.science-play-fine-controls{display:grid;gap:12px;margin-top:8px}.science-play-fine-controls label{display:grid;gap:8px}.science-play-fine-controls input,.science-play-fine-controls select{width:100%;min-height:48px;font-size:calc(16px * var(--reading-scale,1))}.science-play-choice-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;grid-column:1/-1}.science-play-choice-group>button:only-child{grid-column:1/-1}.science-extra-tool-state{font-size:calc(14px * var(--reading-scale,1));line-height:1.6;margin:6px 0 10px;color:#3b5045}.science-extra-direct:focus-visible{outline:3px solid #173f32;outline-offset:5px}.science-extra-direct[aria-disabled="true"],[data-science-drag][aria-disabled="true"]{cursor:default}
.science-teacher-guide{border:1px solid #d6e0d2;border-radius:22px;background:#fffdf8;padding:20px;margin:0 0 22px;color:#243d35}.science-guide-heading{display:flex;justify-content:space-between;gap:16px;align-items:start}.science-guide-heading h3{margin:6px 0 16px;font-size:calc(21px * var(--reading-scale,1));line-height:1.5}.science-guide-label{font-size:calc(13px * var(--reading-scale,1));color:#546853}.science-guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.science-guide-steps button{border:1px solid #bccfbc;border-radius:16px;background:#f3f7ed;padding:12px;min-height:76px;color:#243d35;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;font:inherit;cursor:pointer}.science-guide-steps button>span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #426c58;border-radius:50%;font-weight:800;background:#fff}.science-guide-steps button b{font-size:calc(16px * var(--reading-scale,1))}.science-guide-steps button small{width:100%;font-size:calc(12px * var(--reading-scale,1))}.science-guide-steps [aria-pressed=true]{border:3px solid #426c58;background:#e5f0bb;padding:10px}.science-guide-current{padding:14px 16px;background:#eff5e7;border-radius:14px;line-height:1.7;font-size:calc(16px * var(--reading-scale,1))}.science-guide-inclusion summary{min-height:48px;display:flex;align-items:center;font-weight:700;cursor:pointer}.science-guide-inclusion p{line-height:1.7;font-size:calc(15px * var(--reading-scale,1))}.science-guide-observe{margin-bottom:0;font-size:calc(14px * var(--reading-scale,1));color:#546853;line-height:1.6}
.science-lesson-picker{margin:0 0 18px}.science-lesson-cards{display:grid;grid-template-columns:1fr;gap:10px}.science-lesson-card{display:flex;align-items:start;flex-direction:column;gap:6px;padding:14px 16px;min-height:76px;border:1px solid #c5d2c0;border-radius:16px;background:#f7faef;color:#243d35;text-align:left;font:inherit;cursor:pointer}.science-lesson-card b{font-size:16px}.science-lesson-card small{font-size:13px;line-height:1.5;color:#526447}.science-lesson-card[aria-pressed=true]{border:3px solid #426c58;padding:12px 14px;background:#eaf3cf}.science-lesson-plan{margin-top:16px;padding:14px;border:1px solid #d6e0d2;border-radius:14px;background:#fffdf8;line-height:1.6}.science-lesson-plan ol{padding-left:22px}.science-lesson-plan li+li{margin-top:10px}.science-lesson-plan p{font-size:14px}
.science-teacher-guide button:focus-visible,.science-lesson-card:focus-visible{outline:3px solid #173f32;outline-offset:4px}[data-reduced-motion=true] .science-play-action::before{transition:none}@media(prefers-reduced-motion:reduce){.science-play-action::before{transition:none}}
[data-color-mode=contrast] :is(.science-teacher-guide,.science-guide-current,.science-guide-steps button,.science-play-fine,.science-lesson-card,.science-lesson-plan){background:#fff;color:#111;border:2px solid #111}[data-color-mode=contrast] .science-guide-steps [aria-pressed=true],[data-color-mode=contrast] .science-lesson-card[aria-pressed=true]{background:#fff4a6;border-width:4px}
@media(max-width:520px){.science-guide-heading{flex-direction:column}.science-guide-steps{grid-template-columns:1fr}.science-teacher-guide{padding:16px}.science-play-action[data-science-toggle="closed"]{padding-right:78px}.science-play-choice-group{grid-template-columns:1fr 1fr}}
@media(max-width:360px){[data-text-size="150"] .science-play-choice-group{grid-template-columns:1fr}}
[data-science-scene="switch"]{cursor:pointer;touch-action:manipulation}[data-science-scene="switch"]:focus-visible{outline:3px solid #173f32;outline-offset:5px}
/* A choice heading and its controls stay together across narrow screens. */
.science-play-choice-group>b,.science-play-choice-group>.science-play-deck{grid-column:1/-1}.science-play-choice-group>.science-play-deck{margin-top:0}
/* Direct manipulation needs a full-width picture, including on a phone. */
body[data-role="student"] .science-lab .science-stage-content .science-diagram{max-height:none;width:100%;height:auto}
.science-lesson-plan>a.secondary,.science-guide-heading>a.secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;max-width:100%;box-sizing:border-box;text-decoration:none;text-align:center;white-space:normal;line-height:1.5;padding:10px 14px;cursor:pointer}
.science-lesson-plan>a.secondary:focus-visible,.science-guide-heading>a.secondary:focus-visible{outline:3px solid #173f32;outline-offset:4px}
