html body.video-workspace .app-shell #createView #assetGrid.has-audio-assets {
  max-height: none !important;
  overflow: visible !important;
}

html body.video-workspace .app-shell #createView #assetGrid.has-audio-assets .workflow-reference-assets {
  align-items: flex-start;
}

html body.video-workspace .app-shell #createView #assetGrid .asset-item.audio-asset-card {
  display: flex !important;
  flex: 1 1 240px !important;
  flex-direction: column !important;
  width: min(100%, 300px) !important;
  min-width: min(100%, 220px) !important;
  max-width: 300px !important;
  height: auto !important;
  min-height: 0 !important;
  gap: 6px !important;
  overflow: hidden !important;
  isolation: isolate;
}

html body.video-workspace .app-shell #createView #assetGrid .asset-item.audio-asset-card > audio {
  display: block !important;
  flex: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 40px !important;
  max-height: 40px !important;
  border-radius: 6px;
}

html body.video-workspace .app-shell #createView #assetGrid .audio-asset-card .asset-footer {
  width: 100%;
  min-width: 0;
  min-height: 20px !important;
  padding: 0 2px;
}

html body.video-workspace .app-shell #createView #assetGrid .audio-asset-card .asset-label {
  max-width: none !important;
  font-size: 10px !important;
}

html body.video-workspace .app-shell #createView #assetGrid .audio-asset-card .asset-remove {
  font-size: 10px !important;
}

html body.video-workspace .app-shell #createView #assetGrid .audio-asset-card .asset-remove::after {
  content: none !important;
}

@media (max-width: 720px) {
  html body.video-workspace .app-shell #createView #assetGrid.has-audio-assets {
    overflow: visible !important;
  }

  html body.video-workspace .app-shell #createView #assetGrid .asset-item.audio-asset-card {
    flex-basis: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
}
