Thanks for you for your thorough response, Christian!
I agree with a lot of what you was saying. However, I still think some things are not as easy as they might be. Let me describe a typical situation I've been in many times working with my clients. This is when you need to style a one particular element only. Say, you need to add an extra margin space to a specific element because a page content requires that. However, it is required for one page only. Other pages will do just fine with standard margins. So what do I do?
I can use a utility class, something like "mb-50" with "margin-bottom: 50px" in it. However, if this class gets reused on some other page (which is a general idea with CSS rule sets) I'll lose an ability to tweak it for this particular page only: every change I make will be inadvertently reflected on the other page of the site. And it's really hard to keep track of that.
That's the problem with CSS rules for one particular element: if they are exposed in a global CSS stylesheet, there is no way to prevent them form being used somewhere else. That creates a huge problem.
Scoped CSS would be an ideal solution here, but looks like it is pulled out of specs as of now. So the only option left is an inline CSS. Even if I don't like it in general, it would probably make sense to use in situations as described above. They do not generate any extra resource for loading as they are in the page itself. That will generate CSS that will be attached to one element only and cannot be shared by others. But there is no way to add that in Layout currently, as I understand. Maybe adding an inline CSS option would be a good idea, what do you think?
BTW, in my initial suggestion I have no intention to generate any external file resources. My idea was to use embedded CSS (hidden link) that will not result in additional network requests.
All said about CSS is even more true for JS. Very often JS is element specific. For example, to enable a Bootstrap 3 tooltip one has to do "$('#tooltip-id').tooltip(options)". Or it could be adding a specific animation to a specific element within a layout. On my opinion, it would make more sense to to keep such JS closer to the layout than in some global file. For complex sites there can be hundreds or even thousands of such code pieces. A global file would be harder to navigate. And if with build systems like Webpack we can split them into several files, there is no option like that in Layouts. Everything is in on (big) file.
Putting a JS layout specific code to the page is easy. It can just be dropped within "<script></script>" tags right after the layout markup, or at the end of page body. For ease of debugging a block can be marked with the comment of where it belongs.
Maybe having a specific JS for each layout cell is an overkill, but having a common JS block for the whole layout might be beneficial, I think.
Your suggestion of having a layout editor and a CSS/JS editor in separate windows does work, but, on, my opinion, it's more of a workaround. My screen is 1920px wide, may developers have even larger screens nowadays. But even on my screen there is a wasted space at the right of a layout editor (please see a screenshot below). Why not to use it for adding a CSS/JS editor there? Then there will be no need to have it in a separate window which, I think, is still a little unnatural.
Please let me know what do you think. You, guys and gals, are creating a great product. I do believe in you and I think Toolset deserves to be the best offer on the market. Implementing seemingly small usability improvement can make a huge difference for all your users.
It's also often a client decision of what product/technology would be used for a site. It's because he/she pays the money and he/she does some small text/style changes on his/her own. Some competitive layout products have really nice UIs, even though they are not nearly as powerful as Toolset with Views, CRED, and all other goodness. But it's really hard to convince clients as they often (unfortunately) judge by looks. It takes a lot of time to explain, but still does not work sometimes. Making Layouts visually nicer and more user friendly would help with that a lot. And that will help with you market share, too.