.signal-line {
  position: relative;
  height: 128px;
  margin: 20px 0 10px;
  overflow: hidden;
  border-radius: 15px;
  background: linear-gradient(to bottom, rgba(112, 101, 139, .09) 1px, transparent 1px);
  background-size: 100% 32px;
}

.signal-line canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.signal-legend {
  position: absolute;
  top: 7px;
  left: 10px;
  display: flex;
  gap: 13px;
  color: #777184;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.signal-legend span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.signal-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.signal-dot.listings { background: #7557e6; }
.signal-dot.deals { background: #39abc8; }