:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#294457;background:#f7f9fb;font-size:14px;--blue:#24577b;--ink:#294457;--muted:#708593;--line:#dce6ec;--teal:#458b98;--orange:#df9a43;--green:#80a857;--product:#518ac1}*{box-sizing:border-box}body{margin:0}main{max-width:1580px;margin:auto;padding:0 34px}button,input,select{font:inherit}button,select{cursor:pointer}button{border:1px solid #d6e2e9;background:#fff;border-radius:9px;color:var(--ink);font-weight:600;padding:10px 12px;min-height:40px}button:hover{background:#f0f6f9;border-color:#a0bfcd}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #d9a244;outline-offset:4px}a{color:var(--blue)}button:disabled{opacity:.45;cursor:default}[hidden]{display:none!important}.skip{position:absolute;top:-60px;left:20px;background:#fff;padding:15px;z-index:10}.skip:focus{top:8px}header{display:flex;align-items:center;height:82px;border-bottom:1px solid var(--line);gap:22px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--blue);font-size:9px;letter-spacing:1.8px;line-height:1.5}.brand strong{font-size:12px;letter-spacing:2.7px}.brand svg{width:33px;height:33px;fill:#448795}.brand svg circle{fill:#dfa047}.unit{margin-left:auto;font-size:11px;font-weight:750;letter-spacing:1.6px}.unit span{font-size:10px;font-weight:500;color:var(--muted);letter-spacing:1px}.review{font-size:10px;border:1px solid #d9e1e6;color:#7b8792;padding:7px 10px;border-radius:20px}.intro{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px 0 26px}.eyebrow{font-size:9px;letter-spacing:1.7px;font-weight:750;color:#7b929f;margin:0 0 10px}h1,h2,h3,p{margin-top:0}h1{font-size:33px;letter-spacing:-1.2px;color:var(--blue);margin:0 0 9px;line-height:1.2}h2{font-size:18px;color:var(--blue);letter-spacing:-.5px;line-height:1.3;margin:0}h3{font-size:14px;color:var(--blue);margin-bottom:11px}p{line-height:1.6}.intro p:not(.eyebrow){color:#6d818e;margin:0;font-size:14px}.ced{text-align:right;font-size:10px;font-weight:750;color:#5c8199;letter-spacing:1.4px}.ced small{display:block;font-size:11px;font-weight:400;letter-spacing:0;color:#8999a4;margin-top:7px}.experiment-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:21px}.experiment-tabs button{display:flex;align-items:center;gap:12px;text-align:left;min-height:77px;padding:14px 17px;background:#fff;font-size:14px;position:relative}.experiment-tabs button[aria-selected=true]{background:#eef6fb;border-color:#8aaec5;box-shadow:inset 0 -3px #235c83}.tab-icon{width:35px;height:35px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:19px;color:#568ca3;background:#edf4f7;border-radius:10px}.experiment-tabs button[aria-selected=true] .tab-icon{background:#24577b;color:white}.experiment-tabs small{display:block;color:#8a9ba5;font-size:10px;font-weight:400;margin-top:6px}.experiment-tabs b{margin-left:auto;color:#b5c4cd;font-size:10px;font-weight:500}.question-bar{display:flex;align-items:center;gap:15px;margin:0 0 16px;padding:0 2px}.question-bar>span:first-child{font-size:9px;letter-spacing:1.2px;color:#7e96a6;font-weight:750;white-space:nowrap}.question-bar p{margin:0;color:#426a84;font-size:13px;font-weight:600}.reference-chip{margin-left:auto;font-size:10px;color:#8596a1;white-space:nowrap}.lab-layout{display:grid;grid-template-columns:255px minmax(0,1fr);gap:18px;align-items:start}.sidebar,.workspace{display:grid;gap:16px;min-width:0}.panel{border:1px solid var(--line);background:#fff;border-radius:15px;padding:22px;min-width:0}.controls h2{margin-bottom:21px;font-size:21px}.range-label{display:block}.range-label>span:first-child{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:650;gap:10px;margin-bottom:13px}.range-label output{color:#296a8c;font-weight:750;font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;margin:0 0 10px;accent-color:#4c929f;cursor:pointer;height:17px}.range-ends{display:flex;justify-content:space-between;gap:8px;color:#95a5b0}.range-ends small{font-size:9px}.presets{display:flex;gap:6px;flex-wrap:wrap;margin:16px 0}.presets button{font-size:10px;padding:8px;min-height:33px}.presets button[data-temperature="37"]{flex:1}.condition-hint{font-size:11px;color:#7b8e99;margin:13px 0;line-height:1.65}.environment-readout{border:1px solid #dfebef;background:#f5f9fb;border-radius:10px;padding:13px;margin:17px 0;display:grid;gap:8px}.environment-readout>span{font-size:10px;color:#7e96a4}.environment-readout strong{font-size:14px;color:#3e788f}.environment-readout small{font-size:9px;color:#8b9ba4;line-height:1.5}.environment-readout .reaction-equation{font-size:26px;letter-spacing:6px;color:#4b858d}.two-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:15px 0}.two-buttons button{font-size:10px;padding:10px 6px}.two-buttons small{display:block;font-size:8px;font-weight:400;margin-top:5px;color:#7c929f}.ion-readout strong{font-size:23px;color:#c47857}.transport{border-top:1px solid #e7eef2;margin-top:18px;padding-top:18px;display:grid;grid-template-columns:1fr auto;gap:7px}.transport button{font-size:10px;padding:10px 8px}.transport .primary{background:#24577b;color:#fff;border-color:#24577b}.transport .primary:hover{background:#347295}.speed-row{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8495a0;margin:13px 0}.speed-row label{display:flex;align-items:center;gap:6px}select{border:1px solid #d8e3e9;border-radius:7px;background:white;color:#436e86;padding:5px 7px;font-size:10px}.recovery-controls{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:16px 0 12px}.recovery-controls button{font-size:10px;min-height:35px;padding:8px}.recovery-controls button:first-child{grid-column:1/-1;color:#587991;background:#f9fbfc}.tiny{font-size:9px;color:#8a9ba6;line-height:1.65;margin:9px 0 0}.small{font-size:10px;color:#8396a3;line-height:1.65}.prompts{padding:20px}.prompts ol{margin:0;padding-left:17px;display:grid;gap:12px;font-size:11px;line-height:1.6;color:#778d9a}.prompts li::marker{color:#7ea0b5;font-size:10px}.visual-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(275px,1fr);gap:16px;align-items:stretch}.chamber-panel,.closeup-panel{padding:20px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.panel-heading .eyebrow{font-size:8px;margin-bottom:8px}.state-pill{font-size:9px;background:#f1f6f8;color:#7892a1;padding:6px 9px;border-radius:20px;white-space:nowrap}.chamber-scroll{overflow-x:auto;overflow-y:hidden;border:1px solid #e2ebee;border-radius:11px;background:#fbfdfd}svg{display:block;width:100%;font-family:Inter,"Segoe UI",Arial,sans-serif}#chamber{min-width:540px}#chamber text{font-family:inherit}#chamber .enzyme-hit{cursor:pointer}#chamber .enzyme-hit:hover{filter:brightness(.96)}.legend{display:flex;flex-wrap:wrap;gap:9px 14px;font-size:9px;color:#7d929f;margin:14px 0 11px}.legend>span,.closeup-legend>span,.plot-legend>span{display:inline-flex;align-items:center;gap:5px}.dot{width:7px;height:7px;display:inline-block;border-radius:50%}.substrate{background:var(--green)}.product{background:var(--product)}.hydrogen{background:#d9926d}.diamond{display:inline-block;width:7px;height:7px;background:#b39ac6;transform:rotate(45deg)}.chamber-condition{min-height:32px;margin:0 0 17px}.trial-stats{border-top:1px solid #e7eef1;padding-top:15px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.trial-stats div{display:grid;gap:9px}.trial-stats span{font-size:9px;color:#8a9ca6}.trial-stats strong{font-size:22px;font-weight:650;color:#426e87;font-variant-numeric:tabular-nums}.focus-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:15px 0 0}.focus-row label{font-size:10px;color:#8b9ca6;display:flex;align-items:center;gap:6px}.fold-state{font-size:10px;color:#548a8a;background:#eff7f6;padding:5px 8px;border-radius:5px}.fold-state.disrupted{color:#b47d3b;background:#fff6e7}#closeup{max-height:265px}.closeup-legend{display:flex;flex-wrap:wrap;gap:9px;font-size:8px;color:#8b9ca7;margin:0 0 14px}.bond-key{display:inline-block;width:18px;border-top:2px dashed #5c9fad}.bond-key.ionic{border-color:#b6a276}.explanation{border-left:3px solid #9cbeca;background:#f4f8fa;padding:11px 12px;margin:0;font-size:10px;line-height:1.65;color:#567c91;min-height:70px;border-radius:0 6px 6px 0}.charge-readouts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.charge-readouts span{font-size:9px;padding:5px 6px;background:#f4f7fa;border-radius:5px;color:#708d9f}.graph-panel{padding:23px}.graph-layout{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:24px}.plot-legend{display:flex;gap:20px;font-size:9px;color:#8195a4;margin:5px 0 8px 43px}.line-key{display:inline-block;width:19px;border-top:2px solid #d79845}.line-key.control{border-top:2px dashed #6395b7}.illustration-tag{font-size:9px;color:#97a7b0}.rate-readouts{border-left:1px solid #e7eef2;padding-left:22px;margin:6px 0;display:grid;align-content:start;gap:20px}.rate-readouts article{display:grid;gap:8px}.rate-readouts span{font-size:10px;color:#8298a6;line-height:1.4}.rate-readouts strong{font-size:27px;color:#bd8742;font-weight:650;letter-spacing:-1px;font-variant-numeric:tabular-nums}.rate-readouts article+article strong{font-size:23px;color:#6893ad}.rate-readouts small{font-size:8px;color:#9aa9b2}.rate-readouts p{font-size:10px;color:#7f95a4;line-height:1.7;margin:0}.status-line{border-top:1px solid #e7eef1;margin-top:17px;padding-top:13px;color:#8198a6;font-size:10px;line-height:1.6;min-height:30px}.distinctions{padding:20px 22px}.distinctions>div{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.distinctions p{margin:0;font-size:10px}.distinctions b{display:block;color:#567d95;font-weight:650;margin-bottom:5px}.distinctions span{color:#8b9ca7}.teacher-notes{margin-top:22px;padding:18px 22px}.teacher-notes summary{cursor:pointer;font-size:11px;color:#618399;font-weight:650;line-height:1.6}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 30px;margin-top:25px}.notes-grid p{font-size:11px;color:#7d929f;line-height:1.8}.notes-grid h3{font-size:13px}footer{display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#9aa9b1;padding:22px 0 28px}.pan-hint{display:none}button{transition:background .15s,border-color .15s}
@media(min-width:1450px){#closeup{max-height:295px}.chamber-scroll{margin-top:10px}.chamber-condition{min-height:24px}}
@media(max-width:1200px){main{padding:0 24px}.lab-layout{grid-template-columns:235px minmax(0,1fr);gap:14px}.visual-grid{grid-template-columns:minmax(0,1fr)}.chamber-panel{min-width:0}.closeup-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px;align-content:start}.closeup-panel .panel-heading,.closeup-panel .focus-row{grid-column:1/-1}.closeup-panel #closeup{grid-column:1;grid-row:3/7;max-height:255px}.closeup-panel .closeup-legend{grid-column:2;align-self:end;margin-top:25px}.closeup-panel .explanation,.closeup-panel .charge-readouts,.closeup-panel>.tiny{grid-column:2}.experiment-tabs button{padding:13px 12px;gap:9px;font-size:12px}.tab-icon{width:30px;height:30px}.experiment-tabs b{display:none}.experiment-tabs small{font-size:9px}.reference-chip{display:none}.graph-layout{grid-template-columns:minmax(0,1fr) 140px;gap:15px}.rate-readouts{padding-left:15px}}
@media(max-width:780px){main{padding:0 18px}header{height:74px;gap:12px}.unit span{display:none}.review{font-size:8px;padding:6px 8px}.unit{font-size:9px;letter-spacing:1px}.intro{padding:24px 0 22px;align-items:start}h1{font-size:28px}.ced{display:none}.intro p:not(.eyebrow){font-size:12px}.experiment-tabs{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}.experiment-tabs button{min-height:68px}.experiment-tabs small{font-size:9px}.question-bar{align-items:start;gap:10px}.question-bar>span:first-child{font-size:8px;padding-top:4px}.question-bar p{font-size:12px}.lab-layout{grid-template-columns:1fr}.sidebar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:start}.controls{padding:20px}.prompts{position:sticky;top:10px}.visual-grid{grid-template-columns:1fr}.graph-layout{grid-template-columns:minmax(0,1fr) 155px}.distinctions>div{gap:15px}.notes-grid{grid-template-columns:1fr}.panel-heading h2{font-size:17px}.pan-hint{display:block;font-size:9px;color:#93a6b1;margin:0 0 9px}.chamber-panel .panel-heading{margin-bottom:10px}footer{flex-direction:column;gap:8px}.trial-stats span{font-size:9px}}
@media(max-width:480px){main{padding:0 14px}.brand{font-size:8px;gap:7px}.brand strong{font-size:10px;letter-spacing:2.2px}.brand svg{width:28px;height:28px}header{gap:8px}.review{font-size:7px;white-space:nowrap}.intro h1{font-size:26px;letter-spacing:-.8px}.intro .eyebrow{font-size:8px;letter-spacing:1.3px}.intro p:not(.eyebrow){font-size:11px}.experiment-tabs button{padding:11px 9px;gap:8px;font-size:11px}.tab-icon{width:28px;height:28px;font-size:16px}.experiment-tabs small{font-size:8px}.question-bar>span:first-child{display:none}.sidebar{grid-template-columns:1fr}.prompts{position:static}.controls .condition-hint{font-size:11px}.transport button{font-size:11px;min-height:42px}.two-buttons button{font-size:11px}.two-buttons small{font-size:9px}.recovery-controls button{font-size:11px}.tiny{font-size:9px}.controls h2{font-size:22px}.range-label>span:first-child{font-size:12px}.presets button{font-size:10px}.controls .environment-readout{margin:14px 0}.controls .condition-hint{margin:12px 0}.panel{padding:19px}.closeup-panel{display:block}.focus-row{margin-top:14px}.closeup-panel #closeup{max-height:275px}.closeup-panel .closeup-legend{margin-top:0}.graph-layout{grid-template-columns:1fr;gap:15px}.rate-readouts{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:16px 0 0;border-left:0;border-top:1px solid #e7eef1}.rate-readouts p{grid-column:1/-1}.graph-panel .panel-heading{align-items:start}.illustration-tag{max-width:75px;font-size:8px;text-align:right;line-height:1.5}.plot-legend{margin-left:34px;font-size:8px;gap:13px}.distinctions>div{grid-template-columns:1fr;gap:12px}.distinctions p{display:grid;grid-template-columns:100px minmax(0,1fr);gap:10px}.distinctions b{margin:0}.trial-stats strong{font-size:20px}.trial-stats span{font-size:8px;line-height:1.5}.prompts ol{gap:9px}.chamber-condition{font-size:9px}.closeup-panel .panel-heading h2{font-size:18px}.legend{font-size:8px;gap:10px}.environment-readout strong{font-size:15px}.teacher-notes{padding:16px}.teacher-notes summary{font-size:10px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}

.presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.presets button{padding:8px 4px;min-height:43px;line-height:1.5}

@media(max-width:480px){#rate-plot text{font-size:12px}.explanation{font-size:11px}.small{font-size:10px}}

.recovery-controls.product-mode #reset{grid-column:1/-1}.charge-readouts small{font-size:9px;color:#93a3ae;align-self:center}.presets button:disabled{background:#f7fafb}

.structure-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid #e5edf1;margin-top:13px;padding-top:12px}.structure-summary>div{display:grid;gap:5px}.structure-summary span{font-size:8px;letter-spacing:1px;color:#8a9eaa}.structure-summary strong{font-size:10px;font-weight:650;color:#547d91}.interaction-caption{font-size:10px;line-height:1.6;color:#778e9c;margin:12px 0 0}@media(min-width:481px) and (max-width:1200px){.closeup-panel .structure-summary,.closeup-panel .interaction-caption{grid-column:2}.closeup-panel #closeup{grid-row:3/9}}@media(max-width:480px){.structure-summary span{font-size:8px}.structure-summary strong,.interaction-caption{font-size:11px}}