How do I control the panes in Safari Web Developer?

To control the panes in Safari Web Developer, you can follow these steps:

1. Open Safari and navigate to the webpage you want to inspect.
2. Click on Safari in the menu bar and select Preferences.
3. Click on the Advanced tab.
4. Check the box next to "Show Develop menu in menu bar".
5. Close the Preferences window.
6. Click on Develop in the menu bar and select Show Web Inspector.
7. The Web Inspector window will open. You should see a split pane view with the HTML and CSS code on the left and the page preview on the right.
8. To resize the panes, hover your mouse over the vertical divider line between the two panes. When the cursor changes to a double-headed arrow, click and drag to adjust the size of the panes.
9. To switch between the HTML and CSS code view and the page preview, click on the tabs at the top of the right pane.

You can also use the keyboard shortcut Option + Command + I to open the Web Inspector.

Here's the screenshot with highlighted the described steps.

If you click the Styles tab you get the CSS.

You want to get rid of 2️⃣ while maintaining 1️⃣. The 3️⃣ does it. Or am I missing something?

Click in the Web Inspector on the top-right Settings icon (cog) or ⌘, keyboard shortcut and in the Elements tab uncheck Details sidebar: Show independent Styles sidebar.