.dmc-voice-toggle {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 10px;
  background: #101a28;
  color: #c6d0dd;
  font: inherit;
  font-size: .78rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease;
}

.dmc-voice-toggle:hover:not(:disabled) {
  border-color: rgba(94, 168, 255, .62);
  color: #fff;
  transform: translateY(-1px);
}

.dmc-voice-toggle.is-on {
  border-color: rgba(52, 230, 120, .38);
  background: rgba(52, 230, 120, .1);
  color: #c8ffdc;
}

.dmc-voice-toggle:disabled {
  opacity: .48;
  cursor: not-allowed;
}

.dmc-voice-icon {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
}

.dmc-voice-icon svg {
  width: 18px;
  height: 18px;
  overflow: visible;
}

.dmc-voice-speaker {
  fill: currentColor;
}

.dmc-voice-waves,
.dmc-voice-slash {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.dmc-voice-slash {
  display: none;
  color: #ff8ea0;
  stroke-width: 2.1;
}

.dmc-voice-toggle.is-off .dmc-voice-waves,
.dmc-voice-toggle:disabled .dmc-voice-waves {
  display: none;
}

.dmc-voice-toggle.is-off .dmc-voice-slash,
.dmc-voice-toggle:disabled .dmc-voice-slash {
  display: block;
}

.dmc-voice-state {
  color: #5ea8ff;
  font-size: .66rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dmc-voice-toggle.is-on .dmc-voice-state {
  color: #34e678;
}

.dmc-site-header--compact .dmc-voice-toggle {
  min-height: 38px;
}

@media (max-width: 1100px) {
  .dmc-voice-toggle {
    padding-inline: 10px;
  }

  .dmc-voice-label {
    display: none;
  }
}

@media (max-width: 720px) {
  .dmc-voice-toggle {
    min-width: 44px;
    padding-inline: 9px;
  }

  .dmc-voice-state {
    display: none;
  }
}

@media (min-width: 901px) and (max-height: 820px) {
  .dmc-page-desktop-score .dmc-site-header--compact .dmc-voice-toggle {
    min-height: 36px;
  }
}
