#root{margin:auto}.pianoroll-svg{border:1px solid #444;margin:0;overflow:auto;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.timeline{cursor:crosshair}button{border:0;padding:.3em;font-size:1.2em;font-weight:500;font-family:inherit;background-color:transparent;cursor:pointer}.note-label{pointer-events:none}.control-bar{margin:0;display:flex;justify-content:center;align-items:center;padding:5px;background-color:#1a1a1a}.control-group{padding:0 10px;display:flex;justify-content:center;align-items:center;margin-right:20px;font-size:1em}.control-group+.control-group{border-left:1px solid #222;padding-left:20px;margin-left:20px}.control-group button{margin-right:1px}.control-group button:hover{color:#e2c57d}.control-group button:disabled{color:#666}.control-group button.selected{color:#f3c040}.control-group label{display:flex;align-items:center;margin-right:10px}.control-group input,.control-group select{margin-left:5px;width:40px;border:0;background-color:#1a1a1a;font-family:Arial,sans-serif;font-size:14px}.control-group input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px}.control-group input[type=number]{text-align:center}.control-group input[type=number]::-webkit-outer-spin-button,.control-group input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.control-group input.tempo{width:30px}.control-group input.volume{width:80px;height:2px;background:#666;cursor:pointer}.control-group .orientation{transition:transform .14s ease}.control-group .orientation.horizontal:hover,.control-group .orientation.vertical{transform:rotate(-90deg)}.control-group .orientation.vertical:hover{transform:rotate(0)}.context-menu{position:absolute;display:flex;flex-direction:column;background:#1a1a1a;border:1px solid #222;box-shadow:0 2px 10px #00000080;z-index:1000;min-width:200px}.context-menu-option{display:flex;cursor:pointer;font-size:14px;text-align:left;padding:8px 24px;width:100%}.context-menu-option:hover{background-color:#333}.context-menu-option:disabled{background-color:#1a1a1a}.context-menu-divider{border-top:1px solid #444;margin:4px 0}.option-text{flex:1}.shortcut-text{color:#aaa}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}