.audio-section{background-color:#0000;border:none;width:100%;padding:0}.audio-controls{align-items:center;gap:12px;display:flex}.audio-controls.disabled{opacity:.5;pointer-events:none}.audio-controls.active{background-color:#ffffff0d;border:1px solid #ffffff1a;border-radius:20px;padding:8px 12px}.play-pause-btn{background:linear-gradient(135deg, var(--primary-accent), #1f7ead);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:14px;transition:all .2s;display:flex;box-shadow:0 4px 10px #38bdf84d}.play-pause-btn:hover{transform:scale(1.05);box-shadow:0 6px 15px #38bdf866}.play-pause-btn:disabled{cursor:not-allowed;box-shadow:none;background:#ffffff1a}.loading{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.audio-info{flex-direction:column;flex:1;gap:6px;display:flex}.time-display{color:#fff9;font-size:11px;font-weight:500}.progress-bar{cursor:pointer;background-color:#ffffff1a;border-radius:3px;height:6px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--primary-accent), var(--secondary-accent));border-radius:3px;height:100%;transition:width .1s;box-shadow:0 0 10px #38bdf880}body.light-mode .time-display{color:#475569}body.light-mode .progress-bar{background-color:#0f172a1a}body.light-mode .audio-controls.active{background-color:#0f172a0d;border-color:#0f172a1a}body.light-mode .no-audio-label{color:#94a3b8}
.audio-visualizer{border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#0003;border-radius:8px;margin-top:12px;overflow:hidden}.audio-visualizer canvas{border-radius:8px;display:block}