.bynder-audio-component{max-width:600px;margin:20px auto;padding:20px;background:#f8f9fa;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.audio-container{position:relative}
.audio-player{max-width:95%;background:white;border-radius:8px;padding:20px;box-shadow:0 2px 4px rgba(0,0,0,0.1)}
.audio-info{margin-bottom:20px;text-align:center;padding-bottom:15px;border-bottom:1px solid #e9ecef}
.audio-title{font-size:20px;font-weight:600;color:#2c3e50;margin:0 0 10px 0;line-height:1.4;text-align:center}
.audio-description{font-size:14px;color:#6c757d;margin:0;line-height:1.6;background:rgba(255,255,255,0.8);padding:12px 16px;border-radius:6px;border-left:3px solid #007cba;text-align:left;max-width:100%}
.audio-description p{margin:0;font-style:normal}
.audio-controls{display:flex;align-items:center;gap:15px;margin-bottom:15px}
.play-pause-btn{width:48px;height:48px;border-radius:50%;border:0;background:#007cba;color:white;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s ease;flex-shrink:0}
.play-pause-btn:hover{background:#005a87;transform:scale(1.05)}
.play-pause-btn:disabled{background:#ccc;cursor:not-allowed;transform:none}
.download-btn{width:40px;height:40px;border-radius:50%;border:2px solid #007cba;background:white;color:#007cba;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:bold;transition:all .2s ease;flex-shrink:0;margin-left:10px}
.download-btn:hover{background:#007cba;color:white;transform:scale(1.05);box-shadow:0 2px 8px rgba(0,124,186,0.3)}
.download-btn:active{transform:scale(0.95)}
.download-icon{display:inline-block;line-height:1}
.time-display{font-size:12px;color:#666;font-variant-numeric:tabular-nums;min-width:80px;text-align:center}
.progress-container{flex:1;display:flex;align-items:center;gap:10px}
.progress-bar{flex:1;height:6px;background:#e0e6ed;border-radius:3px;cursor:pointer;position:relative;overflow:hidden}
.progress-fill{height:100%;background:#007cba;border-radius:3px;transition:width .1s ease;width:0}
.progress-bar:hover .progress-fill{background:#005a87}
.volume-control{display:flex;align-items:center;gap:8px}
.volume-btn{width:32px;height:32px;border:0;background:transparent;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#666}
.volume-btn:hover{background:#f0f0f0}
.volume-slider{width:60px;height:4px;background:#e0e6ed;border-radius:2px;appearance:none;cursor:pointer}
.volume-slider::-webkit-slider-thumb{appearance:none;width:14px;height:14px;background:#007cba;border-radius:50%;cursor:pointer}
.volume-slider::-moz-range-thumb{width:14px;height:14px;background:#007cba;border-radius:50%;border:0;cursor:pointer}
.audio-metadata{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#888;padding-top:10px;border-top:1px solid #eee}
.audio-format{text-transform:uppercase;font-weight:500}
.audio-size{font-variant-numeric:tabular-nums}
.bynder-audio .bynder-asset-placeholder{text-align:center;padding:40px 20px;color:#666;background:#f8f9fa;border-radius:8px;border:2px dashed #ddd;margin:20px auto;max-width:400px}
.bynder-audio .bynder-partial-metadata-warning{padding:8px 12px;margin:0 auto 12px;color:#666;background:#fff3cd;border:1px solid #b6d4fe;border-radius:4px;font-size:small;position:relative;max-width:80%}
.loading-state{text-align:center;padding:20px;color:#666}
.error-state{text-align:center;padding:20px;color:#d32f2f;background:#ffebee;border:1px solid #ffcdd2;border-radius:4px;margin:10px 0}
@media screen and (max-width:768px){.bynder-audio-component{margin:10px;padding:15px}
.audio-info{margin-bottom:15px;padding-bottom:12px}
.audio-title{font-size:18px}
.audio-description{font-size:13px;padding:10px 14px;text-align:center}
.audio-controls{flex-wrap:wrap;gap:10px;justify-content:center}
.download-btn{width:36px;height:36px;font-size:14px;margin-left:8px}
.volume-control{order:3;flex:1;justify-content:center}
}
@media screen and (max-width:480px){.audio-metadata{flex-direction:column;gap:5px;align-items:flex-start}
.progress-container{flex-direction:column;gap:8px}
.time-display{min-width:auto}
}