/* css/audio-ab.css */
.audio-ab {
  max-width: 640px; margin: 32px auto; padding: 20px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  color: #fff;
}
.ab-title { font-weight: 700; margin-bottom: 14px; letter-spacing: 0.5px; }
.ab-track { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.ab-play {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--accent, #ff7a00); color: #000; border: 0; cursor: pointer;
  font-size: 16px; display: grid; place-items: center;
  transition: transform 0.2s;
}
.ab-play:hover { transform: scale(1.08); }
.ab-bar {
  flex: 1; height: 6px; background: rgba(255,255,255,0.15);
  border-radius: 3px; cursor: pointer; overflow: hidden;
}
.ab-fill { height: 100%; background: var(--accent, #ff7a00); width: 0; transition: width 0.1s linear; }
.ab-time { font-variant-numeric: tabular-nums; font-size: 13px; opacity: 0.8; min-width: 90px; text-align: right; }
.ab-switch { display: flex; gap: 4px; background: rgba(0,0,0,0.3); padding: 4px; border-radius: 999px; }
.ab-switch button {
  flex: 1; background: transparent; color: inherit; border: 0; padding: 10px 16px;
  border-radius: 999px; cursor: pointer; font-size: 12px; font-weight: 700; letter-spacing: 1px;
  transition: background 0.2s, color 0.2s;
}
.ab-switch button[aria-selected="true"] { background: var(--accent, #ff7a00); color: #000; }