/* Recode Audio — audition player */
.abp { display: flex; align-items: center; gap: var(--s-4);
  background: var(--bg-elevated); border: 1px solid var(--surface-line);
  border-radius: var(--radius-lg); padding: var(--s-4) var(--s-5); }
.abp__play {
  flex: none; width: 48px; height: 48px; border-radius: 50%; cursor: pointer;
  background: var(--green); color: var(--text-on-green); border: 0; font-size: 1.1rem;
  display: grid; place-items: center; transition: background .15s var(--ease), transform .1s var(--ease);
}
.abp__play:hover { background: var(--green-bright); }
.abp__play:active { transform: scale(0.94); }
.abp__main { flex: 1; display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; }
.abp__tabs { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.abp__tab {
  font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: 0.06em;
  padding: 0.35em 0.8em; border-radius: var(--radius-pill); cursor: pointer;
  background: transparent; color: var(--text-dim); border: 1px solid var(--surface-line);
  transition: .15s var(--ease);
}
.abp__tab:hover { color: var(--text); }
.abp__tab.is-active { background: var(--green); color: var(--text-on-green); border-color: var(--green); }
.abp__bar { height: 4px; border-radius: 2px; background: var(--surface-line); overflow: hidden; }
.abp__fill { height: 100%; width: 0; background: var(--green-bright); transition: width .1s linear; }

.prod__audio { margin-top: var(--s-6); }
.prod__audio h3 { font-size: var(--fs-small); font-family: var(--font-mono); letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--green-bright); margin-bottom: var(--s-3); }