<div class="status" id="statusMsg">⚡ idle</div>
// individual buttons document.getElementById('playLubBtn').addEventListener('click', () => if (autoInterval) stopAutoCycle(); playLub(); activateLub(); statusSpan.innerHTML = '🔊 Manual LUB (AV valves)'; setTimeout(() => if (!autoInterval) statusSpan.innerHTML = '⚡ idle'; , 800); ); lub dub valves
footer text-align: center; font-size: 0.7rem; margin-top: 1.5rem; opacity: 0.7; </style> </head> <body> <div class="card"> <h1>❤️ LUB DUB VALVES</h1> <div class="sub">atrioventricular → lub | semilunar → dub</div> div class="status" id="statusMsg">
<div class="button-group"> <button class="lub-btn" id="playLubBtn">🔊 LUB (S1)</button> <button class="dub-btn" id="playDubBtn">🔊 DUB (S2)</button> <button class="auto-btn" id="autoCycleBtn">🔄 AUTO CYCLE</button> </div> if (autoInterval) stopAutoCycle()
button background: #2c3e4e; border: none; font-size: 1.2rem; font-weight: bold; padding: 0.8rem 1.6rem; border-radius: 60px; color: white; cursor: pointer; transition: 0.1s linear; box-shadow: 0 4px 8px black; font-family: monospace;