/* Keep the label and instrument picture together across React updates. */
#root .overflow-x-auto:has(.drum-instrument-label){direction:ltr}
#root .overflow-x-auto .group>div:first-child>span.drum-instrument-label{
  display:flex;align-items:center;gap:7px;width:112px!important;flex:none;
  white-space:normal!important;overflow:visible!important;text-overflow:clip!important;
  direction:ltr;line-height:1.15;
}
.drum-instrument-icon{
  display:block;width:32px;height:32px;flex:0 0 32px;object-fit:contain;
  border-radius:6px;background:#f8fafc;border:1px solid #64748b;pointer-events:none;
}
.drum-instrument-name{
  min-width:0;flex:1;font-size:12px;direction:var(--mms-page-direction);text-align:start;
}
.drum-instrument-preview{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;padding:0;border:0;border-radius:6px;background:transparent;cursor:pointer}
.drum-instrument-preview:hover{box-shadow:0 0 0 2px #34d399}
.drum-instrument-preview:focus-visible{outline:2px solid #34d399;outline-offset:3px}
.drum-instrument-preview:active{transform:scale(.93)}
