.lab-instructions{border-top:1px solid var(--line);margin-top:68px;padding-top:55px}.lab-instructions h2{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(1.8rem,4vw,3.2rem);line-height:1;letter-spacing:-.04em;margin:12px 0 30px}.lab-instruction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.lab-instruction-grid article{border:1px solid var(--line);background:#0b1214;padding:20px;min-height:170px}.lab-instruction-grid span{font-size:.6rem;color:var(--cyan);letter-spacing:.12em}.lab-instruction-grid strong{display:block;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:.86rem;margin:28px 0 9px}.lab-instruction-grid p,.lab-reading p{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:var(--muted);font-size:.75rem;line-height:1.75;margin:0}.lab-reading{border-left:3px solid var(--lime);background:#0d1713;padding:15px 18px;margin-top:18px}.lab-reading strong{font-size:.78rem;color:var(--lime)}.lab-reading b{color:#c6ddd7}@media(max-width:700px){.lab-instruction-grid{grid-template-columns:1fr}.lab-instruction-grid article{min-height:0}.lab-instructions{margin-top:52px;padding-top:42px}:lang(zh-CN) .lab-instructions h2{font-family:var(--font-cjk);letter-spacing:0;line-height:1.25}:lang(zh-CN) .lab-instruction-grid strong{font-family:var(--font-cjk);line-height:1.5}:lang(zh-CN) .lab-instruction-grid p,:lang(zh-CN) .lab-reading p{font-family:var(--font-cjk);line-height:1.9}}

.lab-panel { animation: lab-panel-enter 560ms var(--ease-out, cubic-bezier(.23, 1, .32, 1)) 80ms both; }
.lab-panel #lab-run { position: relative; overflow: hidden; }
.lab-panel #lab-run::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform 480ms var(--ease-out, ease);
  pointer-events: none;
}

.lab-instruction-grid article,
.lab-reading,
.result-grid div {
  transition: transform var(--duration-ui, 200ms) var(--ease-out, ease), border-color var(--duration-ui, 200ms) var(--ease-out, ease), background-color var(--duration-ui, 200ms) var(--ease-out, ease), box-shadow var(--duration-ui, 200ms) var(--ease-out, ease);
}

.result-grid:not(.hidden) { animation: result-reveal 420ms var(--ease-out, cubic-bezier(.23, 1, .32, 1)) both; }
.result-grid:not(.hidden) div { animation: result-cell-enter 360ms var(--ease-out, ease) both; }
.result-grid:not(.hidden) div:nth-child(even) { animation-delay: 45ms; }

@media (hover: hover) and (pointer: fine) {
  .lab-panel #lab-run:hover::after { transform: translateX(130%); }
  .lab-instruction-grid article:hover {
    transform: translateY(-4px);
    border-color: #3a656b;
    background: #0d181b;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .22);
  }
  .result-grid div:hover { background: #0d181b; }
}

.lab-reading { position: relative; overflow: hidden; }
.lab-reading::before {
  content: "";
  position: absolute;
  left: -2px;
  top: 0;
  width: 3px;
  height: 34%;
  background: var(--lime);
  box-shadow: 0 0 12px rgba(180, 246, 106, .6);
  animation: reading-scan 3.4s var(--ease-in-out, ease-in-out) infinite;
}

@keyframes lab-panel-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes result-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes result-cell-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes reading-scan { 0%, 12% { transform: translateY(-115%); } 60%, 100% { transform: translateY(340%); } }

@media (prefers-reduced-motion: reduce) {
  .lab-panel,
  .result-grid:not(.hidden),
  .result-grid:not(.hidden) div { animation: none; }
  .lab-reading::before { animation: none; }
  .lab-instruction-grid article:hover { transform: none; }
}
