*{box-sizing:border-box}body{margin:0;font-family:"Comic Sans MS","Trebuchet MS",sans-serif;background:linear-gradient(#e8f7ff,#fff7e0);color:#223;min-height:100vh}
header{background:#5b3fd6;color:#fff;padding:10px 16px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}header h1{font-size:1.3em;margin:4px 0}
main{max-width:860px;margin:auto;padding:16px}.card{background:#fff;border-radius:18px;padding:16px;margin:12px 0;box-shadow:0 3px 10px #0002}
button{font:inherit;touch-action:manipulation;min-height:44px;font-size:1em;border:0;border-radius:14px;padding:10px 16px;margin:4px;background:#ffcf33;cursor:pointer;box-shadow:0 3px 0 #c99a00}button:disabled{opacity:.4;cursor:default}
button.alt{background:#7fe0c4;box-shadow:0 3px 0 #3aa}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.exp{text-align:left}.lock{background:#ddd;box-shadow:none}
.bench{display:flex;align-items:flex-end;gap:20px;justify-content:center;min-height:190px;background:#c9a27a;border-radius:14px;padding:16px}
.beaker{width:110px;height:150px;border:5px solid #9cc;border-top:0;border-radius:0 0 22px 22px;position:relative;overflow:hidden;background:#ffffff88}
.liquid{position:absolute;bottom:0;left:0;right:0;transition:all .8s}.bubbles{position:absolute;inset:0;font-size:22px;text-align:center;animation:rise 1s infinite}
@keyframes rise{from{transform:translateY(40px);opacity:1}to{transform:translateY(-60px);opacity:0}}
.prof{font-size:60px;text-align:center;line-height:1}.prof-svg{display:inline-block;max-width:40vw;height:auto}.prof.singed{filter:grayscale(.6) brightness(.7)}.say{background:#fffbe6;border:3px solid #ffcf33;border-radius:16px;padding:10px}
.hidden{display:none!important}#boom{position:fixed;inset:0;background:radial-gradient(#fff700,#ff7b00 40%,#c00 70%,#0000);display:flex;align-items:center;justify-content:center;z-index:50;animation:flash 1.2s}
.blast{font-size:64px;font-weight:bold;color:#fff;text-shadow:0 0 10px #000;animation:pop 1.2s}
@keyframes pop{0%{transform:scale(.2)}50%{transform:scale(1.4)}100%{transform:scale(1)}}@keyframes flash{0%{opacity:0}10%{opacity:1}100%{opacity:.9}}
.shake{animation:shake .5s 2}@keyframes shake{0%,100%{transform:translate(0)}25%{transform:translate(-12px,6px)}50%{transform:translate(10px,-8px)}75%{transform:translate(-6px,-4px)}}
.smoke{font-size:30px;animation:rise 2s infinite}.ok{color:#087a3a;font-weight:bold}.bad{color:#b00;font-weight:bold}
.chip{display:inline-block;padding:10px 12px;min-height:44px;touch-action:manipulation;border-radius:12px;margin:3px;background:#eef;cursor:pointer;border:2px solid transparent}.chip.sel{border-color:#5b3fd6;background:#dcd5ff}
.danger{background:#ffe0e0}
.chip{font:inherit;font-size:1em;box-shadow:none;color:#223}
.readout{display:inline-block;font-family:monospace;font-size:1.3em;background:#222;color:#7f7;padding:6px 12px;border-radius:8px;margin:8px 0}
.bar{display:flex;align-items:center;gap:6px;margin:3px 0}.bar span:first-child{width:56px}.bar i{display:block;height:18px;background:#ff9f43;border-radius:6px}
button[aria-pressed=true].alt{outline:3px solid #5b3fd6}
@media (prefers-reduced-motion: reduce){.shake,#boom,.blast,.bubbles,.smoke{animation:none!important}.liquid{transition:none}}
.tip{background:#e8f7ff;border-left:6px solid #4aa3ff;border-radius:10px;padding:8px;margin:6px 0;color:#223;font-weight:normal}
.ph{margin:8px 0;font-size:16px}.phstrip{position:relative;height:26px;border-radius:13px;margin-top:22px;background:linear-gradient(90deg,#e0245e 0%,#ef5fa7 21%,#c060c0 43%,#7b4bb7 50%,#4a7fd0 57%,#3fae8f 71%,#7cc83c 86%,#d8d830 100%)}
.needle{position:absolute;top:-24px;transform:translateX(-50%);font-size:20px;transition:left 1s ease}
.phlab{display:flex;justify-content:space-between;font-weight:bold;font-size:16px}.phread{margin:4px 0}
.drop{font-size:44px;min-width:96px;min-height:96px;background:#bfe3ff;box-shadow:0 3px 0 #4aa3ff}
.rbar{height:18px;background:#eef;border-radius:9px;overflow:hidden;margin:6px 0}.rbar i{display:block;height:100%;background:#4aa3ff}
.detcard{font-size:1.5em;background:#fffbe6;border-radius:14px;padding:12px;text-align:center}
@media (prefers-reduced-motion: reduce){.needle{transition:none!important}}
.exp-art{display:flex;align-items:center;justify-content:center;gap:6px;background:#fffbe6;border:3px solid #ffcf33;border-radius:16px;padding:6px;margin:8px 0}
.exp-prof svg{width:84px;height:auto;display:block}.exp-scene{flex:1;max-width:420px;min-width:0;height:auto;display:block}
.bench{background:linear-gradient(#f3e3cc 0 70%,#c9a27a 70%)}.beaker{background:#eaf8ffcc}
svg.bubbles{width:100%;height:100%;font-size:inherit}
@media (max-width:420px){.exp-prof svg{width:70px}.exp-art{padding:4px;gap:2px}}
/* v9 bigger text */
body{font-size:20px;line-height:1.45}main p,.say,.tip{font-size:1em}
.ph{font-size:19px}.phlab{font-size:18px}
.phnums{position:relative;height:22px;margin:22px 8px 0;font-weight:bold;font-size:15px}.phnums span{position:absolute;transform:translateX(-50%)}
.phstrip{margin-top:4px;margin-left:8px;margin-right:8px}.needle{top:24px}.ph{padding-bottom:22px}
@media (max-width:520px){body{font-size:21px}header h1{font-size:1.15em}.exp-art{flex-direction:column}.exp-prof svg{width:90px}.exp-scene{width:100%;max-width:none}.phnums{font-size:13px}}

footer.privacy{max-width:760px;margin:8px auto 80px;padding:8px 12px;font-size:.85em;color:#444;background:#fff8;border-radius:10px}
.poison p{margin:4px 0}.poison .nw{white-space:nowrap}.poison .src{font-size:.8em;color:#555}

/* Spanish site: bigger, simpler text */
body{font-size:22px;line-height:1.5}main,.card,.say,.tip,button{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
