.chemistry-hero{min-width:0;border:1px solid #557793;border-radius:14px;background:linear-gradient(145deg,#153c5b,#0b2138);overflow:hidden;box-shadow:0 20px 40px #0002;color:#dce9f2}
.chem-heading{padding:19px 23px;border-bottom:1px solid #55779366}.chem-heading>span{font:9px Consolas,monospace;letter-spacing:1px;color:#aac6da}.chem-heading h2{font-size:17px;color:#fff;margin-top:9px;letter-spacing:0}
.chemistry-hero svg{width:100%;height:auto;max-height:285px;display:block}.chem-node circle{fill:#163e5b;stroke:#e3b259;stroke-width:1.4}.chem-node text{fill:#e4edf5;font:600 20px Poppins,Arial,sans-serif}.chem-result path{fill:#204a67;stroke:#ff975c;stroke-width:2}.chem-result>text{fill:#ffad87;font:600 36px Poppins,Arial,sans-serif}.chem-result .chem-result-caption{fill:#a8c3d8;font:10px Consolas,monospace;letter-spacing:1px}
.chem-controls{padding:15px 23px 0}.chem-controls[hidden]{display:none!important}.chem-controls>button{background:#ff6a2a;color:#0b1f3a;border:1px solid #ff6a2a;min-height:44px;padding:10px 14px;border-radius:6px;font:600 11px Poppins,Arial,sans-serif;cursor:pointer}.chem-controls>div{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.chem-controls>div button{min-height:44px;border:1px solid #7092ac;border-radius:5px;background:#ffffff05;color:#ffb38e;padding:8px 10px;font:600 11px Poppins,Arial,sans-serif;cursor:pointer}.chem-controls button span{font-weight:400;margin-left:5px;color:inherit;font-size:10px}.chem-controls button[aria-pressed=true]{background:#ff6a2a;color:#0b1f3a;border-color:#ff6a2a}.chem-controls button:disabled{opacity:.65;cursor:default}.chemistry-hero :focus-visible{outline:3px solid #ffb38e;outline-offset:3px}.chem-copy{padding:19px 23px 22px}.chem-copy>p{font-size:12px;line-height:1.8;color:#c5d9e8}.chem-copy small{display:block;font-size:9px;color:#a8c3d5;margin-top:13px}.chem-copy a{display:inline-flex;gap:8px;font-size:10px;color:#ffb38e;margin-top:12px;min-height:32px;align-items:center}.chem-status{font-size:10px!important;min-height:1.8em;margin-top:9px;color:#a8c3d5!important}
.is-forming .chem-node{animation:chem-join 2.6s var(--join-delay) cubic-bezier(.4,0,.2,1) both}.is-forming .chem-result{animation:chem-form 3.1s ease both}
@keyframes chem-join{0%,20%{transform:translate(0,0);opacity:1}75%,100%{transform:translate(var(--join-x),var(--join-y));opacity:0}}
@keyframes chem-form{0%,55%{opacity:.65}85%,100%{opacity:1}}
@media(max-width:800px){.chemistry-hero{width:100%;max-width:640px}}@media(max-width:480px){.chem-heading,.chem-copy{padding-inline:19px}.chem-controls{padding-inline:19px}.chemistry-hero svg{max-height:230px}.chem-copy>p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.is-forming .chem-node,.is-forming .chem-result{animation:none!important}}@media print{.chem-controls,.chem-status{display:none}.chem-node,.chem-result{animation:none!important}}