#audio-button{
    border: 2px solid #000;
    color:#000;
    backdrop-filter:blur(10px);
    border-radius:1.618em;
    padding: 0 1.618em;
  margin-top: 0.618em;
  background-color: rgba(0,0,0,0);
  font-size:85%;
}

#audio-text {
 font-weight: 500;
    font-family: roboto,system-ui;
  background-color:rgba(0,0,0,0.15) !important;
      -webkit-backdrop-filter: blur(13px);
  backdrop-filter: blur(13px);
    border-radius: 1.618em;
    padding: 0.618em;
    font-size: 90%;
    border:#fff solid 2px;
}

.ac-min,.ac-min > *, #audio-controls {width:50px;height:50px;margin:0;padding:0;}

#audio-controls {position:absolute;top:16px;right:calc(16px + 0.628em + 150px + 16px);z-index:999;}

/* Stop control */
#audio-controls [data-ac="stop"] {
  display: inline-flex;
}

/* Optional tiny polish */
#audio-controls .ac-min button {
  font: inherit;
  background: transparent;
  cursor: pointer;
  color: #fff;
  border-radius:50%;
  height:50px;
  width:50px;
  background-color:rgba(0,0,0,0.15) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  align-items:center;
  align-content:center;
  justify-content:center;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 24px;
}

#stop-button {
  color: #fff;
  border: 2px solid #fff;
}

#audio-controls .ac-min button:disabled { opacity: .5; cursor: not-allowed; }

#audio-button {display:none;}

@media(min-width:64em) {
  #audio-button {display:block;}
}

@media (prefers-contrast: more) {
  #audio-button, #audio-controls .ac-min button {
    background-color: rgba(0,0,0,0.75);
    color: #fff;
  }
}

#mapStopButton {
  z-index: 9999;
    right: calc(16px + 0.628em + 150px + 16px);
    font: inherit;
    background: transparent;
    cursor: pointer;
    color: #fff;
    border-radius: 50%;
    height: 50px;
    width: 50px;
    align-items: center;
    align-content: center;
    justify-content: center;
}

#mapStopButton span {
    font: inherit;
    font-size: 1em;
}