.multicam-dialog { position: relative; }
.multicam-scan-overlay {
  position: absolute;
  z-index: 8;
  left: 50%;
  bottom: 154px;
  width: min(760px, calc(100% - 32px));
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 11px;
  color: #f4f7fb;
  background: rgba(8, 14, 24, .78);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .34);
  backdrop-filter: blur(16px);
  transform: translateX(-50%);
  pointer-events: none;
}

.multicam-scan-overlay[hidden] { display: none; }
.multicam-scan-overlay .scan-symbol {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #71d9ae;
  background: rgba(21, 142, 99, .22);
  font-size: 17px;
  font-weight: 800;
}
.multicam-scan-overlay strong,
.multicam-scan-overlay small { display: block; min-width: 0; }
.multicam-scan-overlay strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.multicam-scan-overlay small { margin-top: 2px; color: #aeb8c8; font-size: 10px; }
.multicam-scan-marker { width: 5px; height: 20px; background: #53d69b; box-shadow: 0 0 0 2px rgba(83, 214, 155, .2); cursor: pointer; }
.multicam-scan-marker.is-cluster {
  width: 8px;
  background: #53d69b;
}
.multicam-scan-marker.is-cluster > span {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 4px);
  min-width: 18px;
  height: 16px;
  display: grid;
  place-items: center;
  padding: 0 4px;
  border: 1px solid rgba(113, 217, 174, .34);
  border-radius: 5px;
  color: #dffff2;
  background: rgba(8, 30, 27, .92);
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
  transform: translateX(-50%);
  pointer-events: none;
}

@media (max-width: 760px) {
  .multicam-scan-overlay { bottom: 140px; width: calc(100% - 20px); padding: 8px 10px; }
  .multicam-scan-overlay .scan-symbol { width: 25px; height: 25px; }
  .multicam-scan-overlay strong { font-size: 11px; }
}
