#demo-video-quality {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  font: 12px/1.4 var(--brand-sans, system-ui);
  color: #eaf3f6;
}
#demo-quality-select {
  min-height: 38px;
  max-width: 180px;
  padding: 7px 9px;
  border: 1px solid #526571;
  border-radius: 5px;
  background: #12212b;
  color: #eaf3f6;
  font: inherit;
}
#demo-quality-select:focus-visible {
  outline: 2px solid #c6ff3d;
  outline-offset: 2px;
}
#demo-quality-select:disabled {
  opacity: 0.6;
}
@media (max-width: 600px) {
  #demo-video-quality {
    font-size: 11px;
  }
  #demo-quality-select {
    min-height: 36px;
    max-width: 155px;
  }
}

@media (max-width: 600px) {
  html[data-viewer-mode='sample'] #replay-dock #replay-clean-progress {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  html[data-viewer-mode='sample'] #replay-clean-progress #demo-speed {
    grid-row: 3;
    grid-column: 1;
    justify-self: start;
  }
  html[data-viewer-mode='sample'] #replay-clean-progress #demo-video-quality {
    grid-row: 3;
    grid-column: 2 / -1;
    justify-self: end;
  }
}
