Lub Dub Valves |top| -

const autoBtn = document.getElementById('autoCycleBtn'); autoBtn.addEventListener('click', () => if (isAuto) stopAutoCycle(); autoBtn.textContent = '🔄 AUTO CYCLE'; autoBtn.style.background = '#2b5e3b'; else // resume audio context on user gesture if (audioCtx.state === 'suspended') audioCtx.resume(); startAutoCycle(); autoBtn.textContent = '⏚ī¸ STOP CYCLE'; autoBtn.style.background = '#a13e2d'; );

.valve flex: 1; background: #0f212e; border-radius: 2rem; padding: 1.5rem; text-align: center; transition: all 0.2s ease; box-shadow: 0 8px 20px rgba(0,0,0,0.3); border: 1px solid #2c4c6c; lub dub valves

.lub .valve-title color: #ff9f7c; .dub .valve-title color: #7cd4ff; const autoBtn = document

<div class="bpm-control"> <span>❤ī¸ BPM (auto)</span> <input type="range" id="bpmSlider" min="40" max="140" value="72" step="1"> <span id="bpmValue">72</span> </div> <footer>lub-dub rhythm | synthetic heart valves | real-time audio + animation</footer> </div> const autoBtn = document.getElementById('autoCycleBtn')

.lub-btn background: #c2571a; border-bottom: 3px solid #ffaa70; .dub-btn background: #1a6c9e; border-bottom: 3px solid #70c8ff; .auto-btn background: #2b5e3b; border-bottom: 3px solid #8bc34a;