/* Custom Audio Player: Modern, Accessible, and On-Brand */
.custom-audio-player {
  --accent: #ffe075;
  --accent-light: #d0b787;
  --radius: 1.7em;
  display: flex;
  align-items: center;
  gap: 1.2em;
  padding: 0.5em 1.2em 0.5em 0.8em;
  max-width: 100%;
  margin: 0.7em 0 1.3em 0;
  font-family: "Acumin Pro", Arial, sans-serif;
  font-size: 1.07em;
}
.custom-audio-btn {
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 1.5px 8px #00359522;
  transition: background 0.16s, box-shadow 0.18s;
  outline: none;
}
.custom-audio-btn:focus, .custom-audio-btn:hover {
  background: var(--accent-light);
  color: var(--accent);
  box-shadow: 0 2.5px 12px #00359533;
}
.custom-audio-btn svg {
  width: 1.5em;
  height: 1.5em;
  display: block;
}
.custom-audio-progress {
  flex: 1 1 90px;
  height: 0.6em;
  border-radius: 0.3em;
  background: #e7eaf0;
  position: relative;
  cursor: pointer;
  outline: none;
  box-shadow: 0 0.5px 2.5px #00359511;
  margin-right: 0.6em;
  overflow: hidden;
}
.custom-audio-progress-bar {
  height: 100%;
  border-radius: 0.3em;
  background: linear-gradient(90deg, var(--accent-light) 0%, var(--accent) 100%);
  width: 0%;
  transition: width 0.18s cubic-bezier(.22,1,.36,1);
}
.custom-audio-time {
  min-width: 70px;
  text-align: right;
  color: #444;
  font-size: 0.99em;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  user-select: none;
}
@media (max-width: 600px) {
  .custom-audio-player {
    max-width: 99vw;
    font-size: 0.98em;
    padding: 0.45em 0.5em 0.45em 0.5em;
    gap: 0.7em;
  }
  .custom-audio-btn {
    width: 2.1em;
    height: 2.1em;
  }
  .custom-audio-time {
    min-width: 54px;
    font-size: 0.91em;
  }
}