'Style > Beams > Beam style' minor UI issues

[avvvvve]

Issue type

UI bug (incorrect info or interface appearance)

Bug description

Open the style dialog (Format > Style) and go to the Beams page.

Issue 1

The radio button text truncates when the window is resized. To avoid this:

• Adjust width of the preview box with the notation example to 125px
• Move the preview box to the left side (to match the new Accidentals styles)
• Make it so that when the width of the window is decreased, just cut off the right size of the content like other pages do (see video)

https://github.com/musescore/MuseScore/assets/20806406/432a4277-2d4f-4112-9b5c-40cdaf06fd74

Issue 2

The 'Beam style' heading should be left-aligned to the box below it, not to the contents of the box.

Updated design

Steps to reproduce

Resize the Style dialog while on the Beams page.

Screenshots/Screen recordings

No response

MuseScore Version

MuseScore Studio version (64-bit): 4.4.0-241780505, revision: github-musescore-musescore-f1db9c0

Regression

No.

Operating system

OS: macOS 14.5, Arch.: x86_64

Additional context

No response