.eq-dot {
      position: absolute;
      width: 16px;
      height: 16px;
      background: #3b7fff;
      border: 2px solid #fff;
      border-radius: 50%;
      cursor: pointer;
      transform: translate(-50%, -50%);
      transition: background 0.2s, transform 0.2s;
      z-index: 10;
  }

  .eq-dot:hover {
      background: #ffe60a;
      border-color: #ffe60a;
      transform: translate(-50%, -50%) scale(1.3);
  }

  .eq-dot.active {
      background: #ffe60a;
      border-color: #ffe60a;
  }

  .eq-dot::after {
      content: '';
      position: absolute;
      inset: -4px;
      border-radius: 50%;
      border: 2px solid #3b7fff;
      animation: pulse 2s infinite;
  }

  .eq-dot.active::after {
      border-color: #ffe60a;
  }

  @keyframes pulse {
      0% {
          opacity: 1;
          transform: scale(1);
      }

      100% {
          opacity: 0;
          transform: scale(2);
      }
  }

  .eq-popup {
      display: none;
      position: absolute;
      background: rgba(0, 0, 0, 0.88);
      border: 1px solid #ffe60a;
      border-radius: 8px;
      padding: 10px 14px;
      color: #fff;
      font-size: 0.85rem;
      width: 180px;
      z-index: 100;
      pointer-events: none;
  }

  .eq-popup.visible {
      display: block;
  }

  .eq-popup h5 {
      color: #ffe60a;
      margin: 0 0 4px 0;
      font-size: 0.9rem;
  }

  .eq-popup p {
      margin: 0;
      opacity: 0.85;
  }