*{box-sizing:border-box}body{margin:0;background:#edf3f7;color:#203743;font:15px system-ui}header{padding:16px 25px;background:#163e50;color:white;display:flex;justify-content:space-between;align-items:center}header a{color:white}h1{font-size:23px;margin:0}h2{font-size:18px}h3{font-size:15px}.ion-layout{display:grid;grid-template-columns:260px minmax(430px,1fr) 310px;height:calc(100vh - 85px);gap:12px;padding:12px}.panel{background:white;border:1px solid #cbd9e1;border-radius:12px;padding:15px;overflow:auto}button,select,input{font:inherit;border:1px solid #b7cbd5;border-radius:6px;padding:8px;background:white;max-width:100%}button{cursor:pointer}button:hover{background:#e1f3f4}button.active{background:#c4eae4;border-color:#168b78}.shelf{display:grid;gap:6px}.shelf button{text-align:left;font-size:13px}.group{margin:13px 0 5px;color:#206773;font-size:12px;font-weight:bold}.center{display:flex;flex-direction:column;gap:12px;overflow:auto}.bench{background:linear-gradient(#e2edf3 82%,#a5b8bc 82%,#718e92 86%);min-height:380px;border-radius:10px;position:relative}.bench svg{width:100%;height:380px}.bench svg [data-vessel]{cursor:pointer}.tools{display:flex;flex-wrap:wrap;gap:6px}.field{display:block;margin:10px 0}.field input{width:110px;display:block}#ion-notice{background:#fff1cb;padding:10px;min-height:40px}#ion-observation{line-height:1.65}#ion-safety{background:#fff2d7;padding:10px;margin:10px 0}details{margin:12px 0}summary{cursor:pointer}#ion-journal{font-size:12px;max-height:160px;overflow:auto}footer{font-size:12px;padding:12px;background:#f8fafc}footer a{color:#196574}svg .bubble{animation:rise 1.8s infinite}svg .stir{transform-box:fill-box;transform-origin:center;animation:spin .6s linear infinite}@keyframes rise{from{transform:translateY(0);opacity:.8}to{transform:translateY(-50px);opacity:0}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1050px){.ion-layout{grid-template-columns:210px minmax(360px,1fr) 260px}}@media(max-width:800px){.ion-layout{display:flex;flex-direction:column;height:auto}.panel{max-height:500px}.bench{min-height:320px}}
/* Give the working bench priority over the reagent shelves. */
.ion-layout{grid-template-columns:220px minmax(520px,1fr) 270px}
.center{min-width:0}
.center>.panel,.center>footer{flex-shrink:0}
.center>.panel:first-child{overflow:visible;padding:18px}
.bench{min-height:540px;overflow-x:auto}
.bench svg{display:block;width:100%;min-width:740px;height:540px}
@media(min-width:801px) and (max-width:1100px){
 .ion-layout{grid-template-columns:180px minmax(420px,1fr) 220px;gap:8px;padding:8px}
 .panel{padding:10px}
 .center>.panel:first-child{padding:12px}
}
@media(max-width:800px){
 .center>.panel:first-child{max-height:none}
 .bench{min-height:460px}
 .bench svg{min-width:650px;height:460px}
}