.emt-acq-lab {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: clamp(14px, 2.4vw, 24px);
  border: 1px solid rgba(115, 167, 194, 0.3);
  border-radius: 22px;
  background: linear-gradient(150deg, #102735 0%, #0d202c 55%, #111e2c 100%);
  color: #f2f8fb;
}

.emt-acq-lab * { box-sizing: border-box; }
.emt-acq-lab [hidden] { display: none !important; }
.emt-acq-lab :is(button, textarea, a):focus-visible {
  outline: 3px solid #f4cf77;
  outline-offset: 3px;
}
.emt-acq-lab :is(h3, h4, h5, p) { margin: 0; }
.emt-acq-lab button { cursor: pointer; }
.emt-acq-lab button:disabled { cursor: not-allowed; opacity: 0.5; }

.emt-acq-head { display: grid; gap: 8px; }
.emt-acq-head h3 { font-size: clamp(1.25rem, 2.3vw, 1.8rem); line-height: 1.2; }
.emt-acq-head p, .emt-acq-map-panel > p, .emt-acq-mode-explanation,
.emt-acq-selected-status, .emt-acq-capture-help, .emt-acq-source-note {
  color: #c5d8e2;
  line-height: 1.5;
}

.emt-acq-patient {
  position: sticky;
  top: 8px;
  z-index: 8;
  display: grid;
  gap: 4px;
  padding: 12px 15px;
  border: 1px solid #d8a764;
  border-left: 5px solid #f0bd77;
  border-radius: 13px;
  background: #3b302c;
  box-shadow: 0 8px 24px #061018a8;
}
.emt-acq-patient strong { color: #ffdc9d; font-size: 0.8rem; letter-spacing: 0.06em; }
.emt-acq-patient p { color: #fff0d7; font-size: 0.91rem; line-height: 1.35; }

.emt-acq-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: acquisition-step;
}
.emt-acq-flow li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 2px 8px;
  min-width: 0;
  padding: 9px;
  border: 1px solid #496d78;
  border-radius: 10px;
  background: #183541;
  counter-increment: acquisition-step;
}
.emt-acq-flow li::before {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #225f65;
  color: #e9fff9;
  font-weight: 800;
  content: counter(acquisition-step);
}
.emt-acq-flow strong { color: #f4dda8; font-size: 0.82rem; }
.emt-acq-flow span { color: #cbdfe5; font-size: 0.74rem; line-height: 1.35; }

.emt-acq-mode-panel, .emt-acq-map-panel, .emt-acq-controls,
.emt-acq-quality, .emt-acq-capture {
  min-width: 0;
  border: 1px solid #38576a;
  border-radius: 16px;
  background: #142e3d;
  padding: clamp(12px, 1.5vw, 18px);
}
.emt-acq-lab h4 { margin-bottom: 10px; color: #d8f4f4; font-size: 1.02rem; }
.emt-acq-mode-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.emt-acq-mode-panel h4 { flex-basis: 100%; margin-bottom: 0; }
.emt-acq-mode-button,
.emt-acq-electrode-button,
.emt-acq-site-choice {
  border: 1px solid #5d8191;
  border-radius: 11px;
  background: #193949;
  color: #eaf6f9;
  font: inherit;
  text-align: left;
}
.emt-acq-mode-button { padding: 8px 12px; font-weight: 700; }
.emt-acq-mode-button[aria-pressed="true"] {
  border-color: #8ce4d0;
  background: #1b5f62;
  box-shadow: inset 0 0 0 1px #8ce4d0;
}
.emt-acq-mode-explanation { flex-basis: 100%; font-size: 0.9rem; }

.emt-acq-main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
.emt-acq-map-panel, .emt-acq-controls { display: grid; gap: 12px; }
.emt-acq-map-panel h4, .emt-acq-controls h4 { margin: 0; }
.emt-acq-map-panel > p { font-size: 0.88rem; }
.emt-acq-visuals { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.emt-acq-photo, .emt-acq-map-practice { min-width: 0; margin: 0; }
.emt-acq-photo { display: grid; gap: 8px; }
.emt-acq-photo-frame {
  position: relative;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  border: 1px solid #688591;
  border-radius: 14px;
  background: #405766;
}
.emt-acq-photo-frame img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 12%; }
.emt-acq-photo-side,
.emt-acq-photo-midline-label {
  position: absolute;
  padding: 4px 6px;
  border: 1px solid rgba(222, 245, 244, 0.8);
  border-radius: 5px;
  background: rgba(6, 30, 39, 0.78);
  color: #f3fbf9;
  font: 800 clamp(0.55rem, 1.3vw, 0.72rem)/1.2 system-ui, sans-serif;
  letter-spacing: 0.04em;
}
.emt-acq-photo-side { top: 9px; }
.emt-acq-photo-side--right { left: 9px; }
.emt-acq-photo-side--left { right: 9px; }
.emt-acq-photo-midline {
  position: absolute;
  left: 50%;
  top: 57%;
  height: 28%;
  border-left: 2px dashed rgba(255, 244, 205, 0.92);
  filter: drop-shadow(0 1px 2px #1c2938);
}
.emt-acq-photo-midline-label { left: 50%; top: 51%; transform: translateX(-50%); white-space: nowrap; }
.emt-acq-photo figcaption { color: #d4e3e8; font-size: 0.79rem; line-height: 1.4; }
.emt-acq-map-practice { display: grid; gap: 8px; }
.emt-acq-map-practice h5 { color: #f4dda8; font-size: 0.87rem; }
.emt-acq-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 600 / 560;
  overflow: hidden;
  border: 1px solid #466c78;
  border-radius: 14px;
  background:
    radial-gradient(circle at 50% 42%, #255264 0%, transparent 55%),
    linear-gradient(180deg, #163544, #102833);
}
.emt-acq-stage > svg { display: block; width: 100%; height: 100%; }
.emt-acq-body-shape { fill: #245363; stroke: #73a4af; stroke-width: 3; }
.emt-acq-anatomy { fill: none; stroke: #c5b98c; stroke-width: 2; stroke-dasharray: 6 5; opacity: 0.7; }
.emt-acq-guide { stroke: #f2c58e; stroke-width: 2; opacity: 0.75; }
.emt-acq-stage[data-guides="false"] .emt-acq-guide { opacity: 0; }
.emt-acq-orientation { fill: #e2f0ec; font-size: 12px; font-weight: 700; letter-spacing: 1px; }
.emt-acq-marker-layer, .emt-acq-target-layer { position: absolute; inset: 0; pointer-events: none; }
.emt-acq-marker,
.emt-acq-map-target {
  position: absolute;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  font-size: 0.57rem;
  font-weight: 800;
  line-height: 1;
}
.emt-acq-marker { z-index: 2; border: 2px solid #b6faf0; background: #137b81; color: white; box-shadow: 0 2px 8px #071a28; }
.emt-acq-marker[data-state="review"] { border-color: #ffc88e; background: #88502e; }
.emt-acq-marker[data-state="loose"] { border-color: #ffe3a5; background: #8b543d; }
.emt-acq-marker[data-selected="true"] { box-shadow: 0 0 0 4px #f4ce6f, 0 2px 8px #071a28; }
.emt-acq-map-target {
  z-index: 3;
  pointer-events: auto;
  border: 2px solid #9fe5d7;
  background: #0b3345dc;
  color: white;
  font: 700 1rem/1 system-ui, sans-serif;
}
.emt-acq-map-target[data-expected="false"] { border-color: #e5ae7f; }
.emt-acq-map-target:hover { background: #267484; }
.emt-acq-map-legend { font-size: 0.8rem !important; }

.emt-acq-electrode-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.emt-acq-electrode-button { min-height: 40px; padding: 7px 9px; font-size: 0.79rem; font-weight: 700; }
.emt-acq-electrode-button[aria-pressed="true"] { box-shadow: inset 0 0 0 2px #f4ce6f; }
.emt-acq-electrode-button[data-state="set"] { border-color: #74ccb9; }
.emt-acq-electrode-button[data-state="review"] { border-color: #e9a674; background: #654430; }
.emt-acq-electrode-button[data-state="loose"] { border-color: #ffd28e; background: #754739; }
.emt-acq-selected-heading { color: #fcdda1; font-size: 1rem; }
.emt-acq-selected-status { font-size: 0.86rem; }
.emt-acq-site-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.emt-acq-site-choice { display: grid; gap: 2px; min-height: 48px; padding: 8px 10px; font-size: 0.87rem; }
.emt-acq-site-choice small { color: #a8c8d2; font-size: 0.72rem; }
.emt-acq-site-choice[data-current="true"] { border-color: #8ce4d0; background: #1b5f62; box-shadow: inset 0 0 0 1px #8ce4d0; }
.emt-acq-site-choice:hover, .emt-acq-electrode-button:hover { filter: brightness(1.18); }
.emt-acq-utility { display: flex; flex-wrap: wrap; gap: 7px; }
.emt-acq-utility button { flex: 1 1 130px; min-height: 40px; padding: 7px 9px; font-size: 0.8rem; white-space: normal; }

.emt-acq-quality { display: grid; gap: 12px; }
.emt-acq-quality h4 { margin: 0; }
.emt-acq-counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.emt-acq-counts > div { display: grid; gap: 3px; padding: 9px; border: 1px solid #4d7280; border-radius: 10px; background: #1b3b4a; }
.emt-acq-counts strong { color: #a8f2dc; font-size: 1.25rem; }
.emt-acq-counts span { color: #d2e7ed; font-size: 0.75rem; line-height: 1.2; }
.emt-acq-quality-message { padding: 10px; border-left: 3px solid #e6b477; border-radius: 5px; background: #2f3c43; line-height: 1.45; font-size: 0.88rem; }
.emt-acq-quality[data-signal="connected"][data-placement="aligned"] .emt-acq-quality-message { border-left-color: #82d9c7; background: #1c494a; }
.emt-acq-quality-lanes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.emt-acq-quality-lane { min-width: 0; display: grid; gap: 5px; padding: 9px; border: 1px solid #4b7080; border-radius: 10px; background: #102835; }
.emt-acq-quality-lane strong { color: #d5e9ec; font-size: 0.78rem; }
.emt-acq-signal-sketch { height: 40px; padding: 3px; border: 1px solid #315867; border-radius: 6px; background: #081d26; }
.emt-acq-signal-sketch svg { width: 100%; height: 100%; }
.emt-acq-signal-sketch path { fill: none; stroke: #89ead4; stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.emt-acq-quality-lane[data-signal="missing"] .emt-acq-signal-sketch path { stroke: #667987; opacity: 0.35; }
.emt-acq-quality-lane[data-signal="loose"] .emt-acq-signal-sketch path { stroke: #f2bd78; stroke-dasharray: 9 4 2 5; }
.emt-acq-lane-detail { color: #b7d0d9; font-size: 0.72rem; line-height: 1.25; }
.emt-acq-signal-caveat { color: #b7d0d9; font-size: 0.76rem; line-height: 1.35; }
.emt-acq-views { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; color: #bdd5dc; font-size: 0.78rem; }
.emt-acq-views > span:first-child { width: 100%; }
.emt-acq-view-label { min-width: 30px; padding: 4px 6px; border: 1px solid #4b7180; border-radius: 6px; text-align: center; color: #e4f3f6; background: #1d4352; }

.emt-acq-capture { display: grid; gap: 10px; }
.emt-acq-capture h4 { margin: 0; }
.emt-acq-note-label { display: grid; gap: 5px; color: #d7e9ed; font-size: 0.87rem; }
.emt-acq-note-label textarea { width: 100%; min-height: 56px; resize: vertical; padding: 9px; border: 1px solid #668c9a; border-radius: 9px; background: #0e2735; color: white; font: inherit; }
.emt-acq-note-label textarea::placeholder { color: #9cb8c4; }
.emt-acq-capture > button { justify-self: start; min-height: 40px; white-space: normal; }
.emt-acq-capture-help { font-size: 0.8rem; }
.emt-acq-captures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.emt-acq-capture-card { min-width: 0; display: grid; align-content: start; gap: 7px; padding: 12px; border: 1px solid #547684; border-radius: 11px; background: #1a3946; }
.emt-acq-capture-index { color: #f4d396; font-size: 0.73rem; font-weight: 800; letter-spacing: 0.04em; }
.emt-acq-capture-card h5 { font-size: 0.95rem; }
.emt-acq-capture-card p, .emt-acq-capture-card li { color: #d2e4e9; font-size: 0.8rem; line-height: 1.4; }
.emt-acq-capture-card ul { margin: 0; padding-left: 20px; }
.emt-acq-capture-change { color: #b9e9dc !important; }
.emt-acq-capture-note { border-top: 1px solid #52717e; padding-top: 7px; overflow-wrap: anywhere; }
.emt-acq-empty-capture { grid-column: 1 / -1; color: #b8d1dc; font-size: 0.85rem; }
.emt-acq-source-note { font-size: 0.79rem; }
.emt-acq-source-note a { color: #a1f3df; }
.emt-acq-live-summary { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px !important; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 850px) {
  .emt-acq-visuals { grid-template-columns: 1fr; }
  .emt-acq-photo-frame, .emt-acq-stage { max-width: 600px; width: 100%; margin-inline: auto; }
  .emt-acq-photo figcaption { max-width: 600px; margin-inline: auto; }
  .emt-acq-electrode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
  .emt-acq-patient { position: static; }
  .emt-acq-flow { grid-template-columns: 1fr; }
  .emt-acq-flow li { grid-template-columns: 25px minmax(0, 1fr); padding: 7px 9px; }
  .emt-acq-flow li::before { width: 25px; height: 25px; }
  .emt-acq-flow span { font-size: 0.7rem; }
  .emt-acq-mode-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .emt-acq-mode-panel h4, .emt-acq-mode-explanation { grid-column: 1 / -1; }
  .emt-acq-mode-button { min-height: 44px; font-size: 0.78rem; }
  .emt-acq-site-choices { grid-template-columns: 1fr; }
  .emt-acq-photo-side, .emt-acq-photo-midline-label { font-size: 0.56rem; }
  .emt-acq-map-target { display: none; }
  .emt-acq-map-target { width: 22px; height: 22px; }
  .emt-acq-marker { width: 18px; height: 18px; font-size: 0.43rem; border-width: 1px; }
  .emt-acq-quality-lanes { grid-template-columns: 1fr; }
  .emt-acq-quality-lane { grid-template-columns: minmax(100px, 0.7fr) minmax(100px, 1fr); align-items: center; }
  .emt-acq-lane-detail { grid-column: 1 / -1; }
  .emt-acq-captures { grid-template-columns: 1fr; }
}

@media (max-width: 380px) {
  .emt-acq-lab { padding: 10px; }
  .emt-acq-patient { padding: 8px 10px; }
  .emt-acq-patient p { font-size: 0.78rem; }
  .emt-acq-mode-panel, .emt-acq-map-panel, .emt-acq-controls, .emt-acq-quality, .emt-acq-capture { padding: 10px; }
  .emt-acq-map-target { width: 18px; height: 18px; font-size: 0.78rem; }
  .emt-acq-marker { width: 15px; height: 15px; font-size: 0.39rem; }
  .emt-acq-electrode-button { font-size: 0.72rem; padding: 6px; }
  .emt-acq-counts > div { padding: 6px; }
  .emt-acq-counts strong { font-size: 1.05rem; }
  .emt-acq-counts span { font-size: 0.67rem; }
}
