.audio-upload {
  --audio-ink: #243b40;
  --audio-muted: #61777a;
  --audio-line: #c9d9d6;
  --audio-wash: #edf5f2;
  --audio-accent: #28645d;
  margin: 1.25rem 0;
  padding: 1.1rem 1.2rem;
  border: 1px solid var(--audio-line);
  border-left: 4px solid var(--audio-accent);
  border-radius: 0.35rem;
  background: var(--audio-wash);
  color: var(--audio-ink);
}
.audio-upload__heading { margin: 0 0 .4rem; font-size: 1.08rem; }
.audio-upload__copy, .audio-upload__status { margin: .45rem 0; color: var(--audio-muted); }
.audio-upload__controls { display: flex; flex-wrap: wrap; align-items: end; gap: .8rem; margin-top: .85rem; }
.audio-upload__title { flex: 1 1 16rem; }
.audio-upload__title input { display: block; width: 100%; margin-top: .3rem; }
.audio-upload__actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.audio-upload__file { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.audio-upload__file:focus-visible + .audio-upload__button { outline: 3px solid #bf7135; outline-offset: 2px; }
.audio-upload__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.55rem;
  padding: .55rem .85rem;
  border: 1px solid var(--audio-accent);
  border-radius: .25rem;
  background: var(--audio-accent);
  color: #fff;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.audio-upload__button--quiet { background: transparent; color: var(--audio-ink); }
.audio-upload__button:disabled { opacity: .58; cursor: wait; }
.audio-upload__progress { display: block; width: 100%; height: .55rem; margin-top: .85rem; accent-color: var(--audio-accent); }
.audio-upload__status[data-kind="error"] { color: #913d32; }
.audio-upload__status[data-kind="success"] { color: #28645d; }
.audio-upload__current { margin-top: .85rem; padding-top: .75rem; border-top: 1px solid var(--audio-line); }
.audio-upload__current strong { display: block; }
.audio-upload__current p { margin: .35rem 0; }
.audio-upload__current-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .6rem; }
.premium-audio {
  margin: 1.5rem 0;
  padding: 1rem 1.15rem;
  border: 1px solid #cadbd7;
  border-radius: .35rem;
  background: #f0f6f3;
  color: #243b40;
}
.premium-audio__title { margin: 0 0 .65rem; font-size: 1.1rem; }
.premium-audio audio { display: block; width: 100%; }
.premium-audio__download { display: inline-block; margin-top: .65rem; color: #28645d; font-weight: 650; }
@media (max-width: 600px) {
  .audio-upload { padding: .9rem; }
  .audio-upload__actions, .audio-upload__actions label, .audio-upload__actions .audio-upload__button { width: 100%; }
}
