How to create a custom (Stylus) user style for bsky.app to reclaim some space and text labels?

[venteto]

I am not a CSS or JavaScript savant, and I have tried to view the source when browsing bsky.app and it is very confusing, all of the various class names that are just random strings. Moreover, I don't know how much of the structure and styling gets changed by JavaScript when I use my browser's page zoom function to make the page easier to read.

I want to keep my browser tabs visibile in my browser sidebar that is always open, and when I zoom the page enough to make the font a decent size for my eyes, this has a couple of consequences I would like to undo. I want the nav bar, which on my laptop screen resolution is treated as a left column, to remain uniconified even when I zoom the page, I still want to see the text labels for the menu entries. And I don't want the new post button to just from this left column over to the right side of the page.

Then I also want to get rid of all the empty space to the left of the nav area and to the right of the feed list, trending area, search box, etc. The the screenshot below may give a better idea of what I am seeking.

So I am wondering if anyone knows which specific elements, ID's, and classes I need to modify, and if whether JavaScript will override any of my goals, so that the site's default scripts also need to be overridden.

Thank you for any insight.