What happened?

Description

The live preview drag handle is very hard to grab and sometimes grabs after mouse up and requires another click to let go.

This is because:

1. "lp-draghandle" is 4px wide
2. 2px are covered by "lp-preview-container"
3. 1px is covered by "slideout-shade" when the slideout menu is opened
4. leaving only 2px or 1px to grab

Steps to reproduce

1. Setup a section with a preview target
2. Add an entry to the section
3. Add a field to the entry that opens a slideout (Matrix, Entries, Asset)
4. Create an entry and open live preview
5. Try to grab the drag handle

If you give "lp-draghandle" a red background and "slideout-shade" a black background via browser dev tools, you can clearly see that only a single 1px is visible.

Expected behavior

The 4px "lp-draghandle" should be above everything else in order to be easy to grab.
But it should not cover the preview at all, as this may block scrolling and clicking of the previewed site.

Actual behavior

The preview handle is covered by other elements and is hard to grab.

Craft CMS version

5.8.15

PHP version

No response

Operating system and version

No response

Database type and version

No response

Image driver and version

No response

Installed plugins and versions