<div class="bubble left-tail" id="recording-assoc-bubble" data-bind="bubble: $root.recordingBubble" style="display: block; width: 684px; top: 24797.8px; left: 600px;">
      <p>Each track in the MusicBrainz database has to be linked to a recording, choose the appropriate recording or look for it in the database.</p>

      <p>If we do not have a recording for this track in the database yet, please select "Add a new recording" below.</p>

      <p data-bind="with: target">
        Search:
        <span class="autocomplete">
          <img alt="Search" class="search" src="https://staticbrainz.org/MB/search-293028c.svg">
          <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span><input type="text" class="name ui-autocomplete-input" data-bind="autocomplete: { entity: 'recording', currentSelection: recording, lookupHook: $root.recordingAssociation.autocompleteHook($data) }" autocomplete="off" placeholder="Type to search, or paste an MBID">
        </span>
      </p>

      <table data-bind="with: target">
        <tbody>
          <!-- ko if: loadingSuggestedRecordings --><!-- /ko -->
          <!-- ko if: suggestedRecordings().length -->
          <tr>
            <td colspan="4">
              <h3 style="margin-bottom: 1em;">Suggested recordings:</h3>
            </td>
          </tr>
          <!-- /ko -->
          <!-- ko foreach: suggestedRecordings -->
          <tr>
            <td class="select">
              <input name="recording-selection" type="radio" data-bind="attr: { value: gid }, checked: String($parent.recordingGID())" data-change="recording" value="1858e0c4-b6db-4092-94c3-18b20ef98f3e">
            </td>
            <td class="recording" data-bind="html: html({ target: '_blank' })"><a target="_blank" href="/recording/1858e0c4-b6db-4092-94c3-18b20ef98f3e"><bdi>くちべに挽歌</bdi></a></td>
            <td class="artist" data-bind="html: renderArtistCredit(artistCredit)"><a target="_blank" href="/artist/e5dd1991-8e80-431d-80f1-4e58d14d0788" title="Shimakura, Chiyoko"><bdi>島倉千代子</bdi></a></td>
            <td class="length" data-bind="text: formattedLength">?:??</td>
          </tr>
          <!-- ko if: $data.appearsOn && appearsOn.results.length > 0 --><!-- /ko -->
          
          <tr>
            <td class="select">
              <input name="recording-selection" type="radio" data-bind="attr: { value: gid }, checked: String($parent.recordingGID())" data-change="recording" value="1858e0c4-b6db-4092-94c3-18b20ef98f3e">
            </td>
            <td class="recording" data-bind="html: html({ target: '_blank' })"><a target="_blank" href="/recording/1858e0c4-b6db-4092-94c3-18b20ef98f3e"><bdi>くちべに挽歌</bdi></a></td>
            <td class="artist" data-bind="html: renderArtistCredit(artistCredit)"><a target="_blank" href="/artist/e5dd1991-8e80-431d-80f1-4e58d14d0788" title="Shimakura, Chiyoko"><bdi>島倉千代子</bdi></a></td>
            <td class="length" data-bind="text: formattedLength">?:??</td>
          </tr>
          <!-- ko if: $data.appearsOn && appearsOn.results.length > 0 --><!-- /ko -->
          <!-- /ko -->

          <tr>
            <td>
              <input name="recording-selection" value="true" type="radio" id="add-new-recording" data-bind="checked: hasNewRecording, checkedValue: true">
            </td>
            <td colspan="3">
              <label for="add-new-recording">
                Add a new recording
              </label>
            </td>
          </tr>
        </tbody>
      </table>

      
  <div class="buttons" style="float: right;">
    <button type="button" data-click="previousTrack">Previous</button>
    <button type="button" data-click="nextTrack">Next</button>
    <button type="button" class="positive" data-click="hide">Done</button>
  </div>

    </div>