body{margin:0;overflow:hidden;background-color:#1a1a1a;color:#fff}canvas{display:block}.controls{position:fixed;top:10px;left:10px;padding:10px;background:#000000b3;border-radius:5px;z-index:1000}button{background:#4caf50;border:none;color:#fff;padding:8px 16px;border-radius:4px;cursor:pointer;margin:5px}button:hover{background:#45a049}button#addSine{background:#2196f3}button#addSine:hover{background:#1976d2}.global-controls{position:fixed;top:20px;right:20px;background:#000c;padding:20px;border-radius:10px;box-shadow:0 4px 6px #0000001a;z-index:1000}.slider-container{margin-bottom:15px}.slider-container:last-child{margin-bottom:0}.slider-container label{display:block;color:#fff;margin-bottom:5px;font-family:system-ui,-apple-system,sans-serif;font-size:14px}.slider-container input[type=range]{width:200px;height:4px;-webkit-appearance:none;background:#4caf50;border-radius:2px;outline:none}.slider-container input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#fff;border-radius:50%;cursor:pointer;transition:background .2s}.slider-container input[type=range]::-webkit-slider-thumb:hover{background:#e0e0e0}.slider-container input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#fff;border:none;border-radius:50%;cursor:pointer;transition:background .2s}.slider-container input[type=range]::-moz-range-thumb:hover{background:#e0e0e0}#exportState{background:#9c27b0}#exportState:hover{background:#7b1fa2}#importState{background:#ff9800}#importState:hover{background:#f57c00}