/* Keep the supplied experiment intact, with flow-based website utilities. */
.bio-home{color:var(--green);text-decoration:none;white-space:nowrap}
header{flex-wrap:wrap;gap:10px;padding:8px 0}
.brand{min-width:0}.header-tools{flex-wrap:wrap;justify-content:flex-end}
#app{grid-template-rows:auto minmax(0,1fr) auto}
footer{min-height:80px}
button,.scene-head,.panel-heading,.operation-heading,.takeaway{min-width:0}
.scene-controls{flex-shrink:0}.scene-head{gap:8px}
.principle-copy h2{font-size:22px}.principle-copy p{font-size:14px}
.principle-copy{overflow:auto;min-height:0;flex-shrink:1}
aside{overflow:auto}.micro-wrap{flex-shrink:0;min-height:136px}
.header-tools .ghost{max-width:none}.brand h1,.brand p,.eyebrow{letter-spacing:0}
@media(max-width:850px){header{justify-content:space-between}.header-tools{gap:4px}.modes{margin:0}.brand{flex-shrink:0}.principle-copy h2{font-size:18px}.principle-copy p{font-size:13px}}
@media(max-width:620px){#app{height:auto;min-height:100dvh}html,body{height:auto;overflow:auto}.brand{flex:1}.header-tools{justify-content:flex-start;width:100%}.header-tools .ghost{font-size:12px;padding:5px 8px}.header-tools #recordBtn,.header-tools #settingsBtn{max-width:none;font-size:12px}main{display:flex;flex-direction:column}#experiment{min-height:440px;flex:none}.stage{min-height:280px}aside{display:flex;min-height:400px;flex:none}.principle-copy{overflow:visible}.micro-wrap{min-height:180px}.micro-caption,.quiz-block,.takeaway{display:block}.micro-caption{font-size:12px}.quiz-block{font-size:14px}.takeaway{display:flex}footer{min-height:100px;flex-wrap:wrap}.flow-label{display:none}#stepper{width:100%;flex-wrap:wrap;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.step .words strong{font-size:12px}.scene-controls button:last-child{display:block}}