controlsColumn.appendChild(patternInput);

        // Add a small help text for pattern syntax
        const helpText = document.createElement('div');
        helpText.className = 'help-text';
        helpText.innerHTML = 'Examples: "3/8 c 4", "5%8 > 4", ">.>.=.<. 4"';
        helpText.style.fontSize = '0.8em';
        helpText.style.color = '#666';
        helpText.style.marginTop = '2px';
        controlsColumn.appendChild(helpText);

        // Add octave transpose slider
        const octaveContainer = 