/* The free bench uses a stable logical coordinate space, scaled to its viewport. */
.free-bench-page{max-width:1680px;padding-left:30px;padding-right:30px}
.free-bench-page .lab-grid{grid-template-columns:238px minmax(0,1fr) 258px;gap:16px}
.free-bench-page .lab-centre{min-width:0}
.bench-viewport{overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a7bdab #eaf0e7}
.bench-canvas{width:100%;min-width:880px;aspect-ratio:1200 / 680;position:relative;background-color:#f2f5ef;background-image:linear-gradient(90deg,#e9eee399 32%,transparent 32%),radial-gradient(#aabca956 .85px,transparent .85px);background-size:100% 100%,20px 20px;isolation:isolate;transition:box-shadow .15s}
.stock-drop-active{box-shadow:inset 0 0 0 3px #668979}
.bench-zones{position:absolute;top:25px;left:3%;right:3%;display:grid;grid-template-columns:32% 1fr;gap:10px;pointer-events:none;color:#758872;font-size:10px;letter-spacing:1.8px;font-weight:600}
#bench-objects{position:absolute;inset:0}
.free-workbench .bench-toolbar{padding:11px 13px;flex-wrap:wrap}
.free-workbench .bench-state{margin-left:auto;font-size:10px}
.free-workbench .btn.small{font-size:11px}
.bench-canvas .bench-object{position:absolute;min-width:0;max-width:none;flex:none;padding:0;border:0;border-radius:8px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;text-align:center;overflow:visible;background:transparent;transition:box-shadow .15s,background .15s}
.bench-canvas .bench-object.selected{background:#ffffff52;box-shadow:0 0 0 1px #b4c5b0}
.bench-canvas .bench-object:hover{background:#ffffff65}
.bench-canvas .bench-object:focus-visible,.bench-tool:focus-visible{outline:2px solid #315f54;outline-offset:5px}
.bench-canvas .bench-object.dragging{cursor:grabbing;filter:drop-shadow(0 10px 6px #294c3520)}
.bench-canvas .glass-transform{width:100%;height:100%;transform:rotate(var(--pour-angle,0deg));transform-origin:80% 20%;pointer-events:none;transition:transform .22s ease}
.bench-canvas .vessel-svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
.bench-canvas .vessel-label{position:absolute;top:85%;left:50%;transform:translateX(-50%);display:block;width:152%;max-width:146px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.6;font-size:11px;color:#345d50;background:#f5f7efe6;border-radius:4px;padding:0 3px;pointer-events:none;letter-spacing:-.1px;font-weight:600}
.bench-canvas .vessel-volume{position:absolute;top:100%;left:50%;transform:translateX(-50%);width:160%;white-space:nowrap;font-size:10px;line-height:1.7;color:#566950;pointer-events:none}
.bench-object.overlap-ready,.bench-object.pour-target{background:#dcebd65e!important;box-shadow:0 0 0 2px #759e7b!important}
.bench-object.overlap-ready:after{content:'Release to prepare pour';position:absolute;bottom:111%;left:50%;transform:translateX(-50%);padding:4px 7px;background:#335f50;color:#fff;font-size:10px;white-space:nowrap;border-radius:5px;pointer-events:none}
.bench-object.pour-source{background:transparent!important;box-shadow:none!important}
.bench-object.pour-source .glass-transform{animation:tilt-to-pour .25s ease-out both}
.receiver-label{position:absolute;bottom:108%;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1px;color:#466c42;background:#e6f0df;padding:3px 6px;border-radius:4px;pointer-events:none}
.bench-watermark{position:absolute;bottom:17px;left:27px;font-size:10px;color:#8a9683;letter-spacing:.5px;pointer-events:none}
.pour-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:105;pointer-events:none;overflow:visible}
.liquid-stream{fill:none;stroke-width:4;stroke-linecap:round;opacity:.87;stroke-dasharray:9 5;animation:pour-flow .5s linear infinite;filter:drop-shadow(0 1px 0 #365b4540)}
.solid-stream{stroke-width:5;stroke-dasharray:1 8;animation-duration:.8s}
.bench-tool{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:transparent;border:1px solid transparent;border-radius:10px;cursor:grab;touch-action:none;user-select:none;color:#637363;padding:6px 2px;font-size:10px;line-height:1.3}
.bench-tool .tool-art{display:flex;align-items:center;justify-content:center;width:60px;height:70px;background:#f9faf5ad;border:1px solid #dce5d9;border-radius:13px;box-shadow:0 3px 5px #34584308}
.bench-tool.selected{background:#ffffff55;border-color:#b4c5b0}
.bench-tool.dragging{cursor:grabbing}
.bench-tool:hover .tool-art{background:#fff}
.equipment-row{position:relative;display:flex;align-items:center}
.equipment-row .reagent-item{flex:1;min-width:0;padding-right:32px}
.equipment-row .reagent-item>svg:last-child{display:none}
.quick-tool{position:absolute;right:8px;padding:6px;border:1px solid #d6e0d0;border-radius:5px;background:#f7faf3;color:#4e745b;display:flex;align-items:center;justify-content:center}
.quick-tool:hover{background:#e7efdf}
.transfer-bar{background:#fdfefa;border-top:1px solid #dce5d7;padding:13px 16px;min-height:62px}
.transfer-empty{display:flex;align-items:center;gap:11px;font-size:11px;color:#61715a;line-height:1.65}
.transfer-empty>svg{flex-shrink:0;color:#527762}
.transfer-empty b{color:#335f50;display:block;font-weight:600}
.bench-tag{margin-left:auto;font-size:9px;white-space:nowrap;background:#e9f1e2;border-radius:4px;padding:3px 7px;color:#547448}
.transfer-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#42674f;margin-bottom:10px;gap:8px}
.transfer-heading>span{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.transfer-close{background:none;border:0;padding:4px;color:#61745c;display:flex}
.transfer-controls{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.transfer-controls .btn{touch-action:none;user-select:none}
.transfer-controls .is-pouring{background:#54745b;box-shadow:0 0 0 3px #dcebd2}
.transfer-or{font-size:10px;color:#7b8475}
.transfer-amount{display:flex;align-items:center;border:1px solid #d8e1d1;background:#fff;border-radius:6px;overflow:hidden}
.transfer-amount input{border:0;outline:0;width:64px;padding:8px;font-size:12px;color:#365b49;background:transparent}
.transfer-amount span:last-child{padding-right:9px;font-size:11px;color:#61715a}
.transfer-amount:focus-within{outline:2px solid #76977c;outline-offset:2px}
.transfer-meter{font-size:11px;color:#52744d;font-variant-numeric:tabular-nums;margin-left:auto}
.transfer-details{display:flex;align-items:center;gap:13px;flex-wrap:wrap;font-size:10px;color:#65775c;margin-top:10px;line-height:1.5}
.transfer-details label{display:flex;align-items:center;gap:5px}
.transfer-details span:last-child{margin-left:auto;font-size:9px;color:#81897a}
.selected-tool-bar{font-size:11px;display:flex;align-items:center;gap:8px;background:#f0f4e9;padding:7px 13px;border-top:1px solid #dce5d7;color:#54714e;flex-wrap:wrap}
.bench-keyboard{font-size:10px;color:#6b7a65;line-height:1.8;margin:10px 0 0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.bench-expanded .lab-grid{grid-template-columns:238px minmax(0,1fr)}
.bench-expanded .side-stack{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:15px}
.bench-expanded .side-stack:has(.guide-panel){grid-template-columns:repeat(3,1fr)}
.bench-expanded .bench-canvas{min-width:1000px}
@keyframes tilt-to-pour{from{transform:rotate(0deg)}to{transform:rotate(55deg)}}
@keyframes pour-flow{to{stroke-dashoffset:-28}}
@media(min-width:1400px){.free-bench-page .cabinet{position:sticky;top:85px}.free-bench-page .reagent-list{max-height:485px}}
@media(max-width:1250px){.free-bench-page .lab-grid{grid-template-columns:220px minmax(0,1fr)}.free-bench-page .side-stack{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:15px}.bench-expanded .side-stack:has(.guide-panel){grid-template-columns:1fr 1fr}}
@media(max-width:700px){.free-bench-page{padding-left:16px;padding-right:16px}.free-bench-page .lab-grid{display:flex;flex-direction:column}.free-bench-page .cabinet,.free-bench-page .lab-centre,.free-bench-page .side-stack{width:100%}.free-bench-page .reagent-list{max-height:220px}.free-bench-page .side-stack{display:flex;flex-direction:column}.free-bench-page .side-stack .panel{width:100%}.bench-canvas,.bench-expanded .bench-canvas{min-width:800px}.bench-viewport{max-height:455px}.free-workbench .bench-state{display:none}.transfer-bar{padding:12px}.bench-tag{display:none}.transfer-controls{gap:7px}.transfer-meter{margin-left:0;width:100%;margin-top:3px}.transfer-details span:last-child{margin-left:0}.bench-actions .spacer{display:none}}
@media(prefers-reduced-motion:reduce){.bench-canvas .pour-source .glass-transform{animation:none;transform:rotate(55deg)}.liquid-stream{animation:none;stroke-dasharray:none}}
/* Precipitation stays visible in compact glassware and in the selected-vessel view. */
.solid-visual-layer{pointer-events:none}.precipitate-grain{paint-order:stroke fill}.vessel-inspection{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:center;margin:17px 0 14px;padding:15px 21px;border:1px solid #d9e4d4;border-radius:13px;background:linear-gradient(120deg,#eff4e9,#fdfef8)}.inspection-glass{height:205px;background:radial-gradient(ellipse at 50% 65%,#d9e6d5 0%,#eff4e900 70%);display:flex;align-items:center;justify-content:center}.inspection-glass .vessel-svg{height:100%;width:140px;display:block}.inspection-copy h2{font-size:18px;line-height:1.4;color:#345f4d;margin:8px 0}.inspection-copy .eyebrow{font-size:9px;letter-spacing:1px}.solid-stage{font-size:12px;color:#537446;margin:6px 0 11px;font-weight:600}.solid-phase-list{display:flex;flex-wrap:wrap;gap:9px 20px}.solid-phase-label{display:flex;gap:9px;align-items:center;min-width:155px}.solid-phase-label i{width:14px;height:14px;border-radius:5px;border:1px solid #7c999166;box-shadow:inset 0 1px 3px #fff7;flex-shrink:0}.solid-phase-label b{font-size:11px;font-weight:600;color:#456d55;display:block}.solid-phase-label small{font-size:10px;color:#6c806d;display:block;margin-top:3px}.inspection-hint{font-size:12px;color:#798974;line-height:1.8;margin:3px 0}.inspection-caption{display:block;font-size:9px;color:#7b8b72;line-height:1.7;margin-top:12px}.modal .vessel-inspection{grid-template-columns:150px 1fr;margin:0;padding:14px;background:#f2f6ee;border-color:#dfe8d9}.modal .inspection-glass{height:235px}.modal .inspection-glass .vessel-svg{width:155px}
@media(max-width:700px){.vessel-inspection{grid-template-columns:110px minmax(0,1fr);gap:10px;padding:12px}.inspection-glass{height:165px}.inspection-glass .vessel-svg{width:110px}.inspection-copy h2{font-size:15px}.solid-phase-label{min-width:0;width:100%}.modal .vessel-inspection{grid-template-columns:110px minmax(0,1fr)}.modal .inspection-glass{height:185px}}
.indicator-observations{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:14px 0}
.indicator-result{display:flex;gap:14px;padding:18px;background:#fffdf8;border:1px solid #d8e2dd;border-radius:12px;align-items:flex-start}
.indicator-result h3{font-size:14px;margin:0 0 6px}.indicator-result b{font-size:16px}.indicator-result p{font-size:12px;line-height:1.6;color:#536b65;margin:8px 0 0}.indicator-result small{display:block;margin-top:8px;font-size:11px;color:#657a73}
.indicator-result.uncertain{border-color:#dccaa8}.indicator-swatch{display:block;flex-shrink:0;width:28px;height:28px;border-radius:50%;border:1px solid #49685b33}.litmus-strip{display:flex;flex-direction:column;width:18px;height:64px;flex-shrink:0;border:1px solid #49685b55;border-radius:3px;overflow:hidden}.litmus-strip i{flex:1;display:block}
.ph-explanation{font-size:12px;line-height:1.65;color:#627368;margin:10px 0 14px;max-width:900px}
