Layout refactoring + Three column mode

This refactors majority of layout code/markup/css related to layout.

Major changes:

• Fixed "always show mobile new post button", that stuff was broken day 1 lol
• Fixed logoLeft option, also got broken along the way
• Notifications are loaded asynchronously to make teleports work on page load. Probably saves a few bytes of a bundle for anon viewers, almost imperceptable to logged in users (it takes slightly longer for initial load of notifications).
• Instead of isMobileLayout there's now layoutType which can be mobile, normal, wide, this will also make it possible to make an option to disable wide mode or mobile mode if needed.
  • Layouts are now set with CSS class instead of media-query. Some more modifier classes like forbidding sticky headers, enabling scrollbars on sidebars, whether mobile button is visible etc.
  • There are three user options - disable wide mode entirely, wide and wide + reverse. Latter two are labelled as what they do from user perspective - move notifications to 3rd column or move post/nav to 3rd column
• There's now single Notifications component (apart from interactions) on page, shared between desktop, wide and mobile mode. Essentially we only render it once and just move around, therefore any open forms you had in it will remain open and drafts won't be lost between layout transitions. Also makes swapping between desktop and mobile modes MUCH quicker and lag-free.
• Instead of scrolling body now there's a scrolling container below navbar, that is sort of requirement for sticky headers to work but also scrollbars make more sense. You can still scroll by scrolling anywhere, except the navbar, which i think is an acceptable compromise Requirement for sticky was a bogus one, it work on body just fine. Other than that stuff like body-lock stopped working (duh) and other stuff was pain to fix so I ended up reverting to previous approach.
• Notifications, Timelines (but not user's) have sticky headers
  • Unfortunately it's not entirely possible to keep the gap above without content showing through, the only way I came up with needs a css mask to be adjusted on scroll event (since -webkit-mask-attachment is no longer a thing and there's no replacement for it) but at this point it felt like too much effort for an underwhelming solution. So some content will show through heading if it has rounded corners and heading will jump around a bit (mostly in chats)
  • Also inline expanded conversations have sticky headers (stack below other sticky headers) for easier thread closing.
  • There's an option to disable sticky headers entirely, in case they take up too much vertical space
• Chats no longer have "chat mode layout" or whatever it was, instead it works exactly as other views, instead of chat having a scrollable inner "viewport", it's the content that is being scrolled, while header and footer are kept in place with position: sticky, to avoid excessive jumpiness post form and header have been "glued" to edges.
• Columns are now scrollable by using position: sticky to hold entire column in place as if it's fixed but without moving it. Scrollbars are hidden with css (scrollbar-width on firefox, webkit pseudoelements on chrome-cringed browsers) with an option to show them (for sidebars).
  • Bonus: Stylized scrollbars on chromium-likes. Unfortunately arrows on buttons had to be made with gradients since the ONLY other option is to use background-image and even with SVG that cannot use css custom properties and therefore cannot be themed. BS. On firefox we just do simple coloring. Since we don't support any trident-based IEs don't even bother asking for IE custom scrollbars.
• App.scss got linted, reorganized and refactored, panel stuff is split into a separate file (currently trying to make a Panel component is way out of scope for this MR due to effort required)
  • Many, MANY sizing stuff now uses relative units (rems, ems) instead of pixels, as a result sizes might be not as they were before, mostly interface became a bit wider in general.
    • Also while I was at it i changed all font-size: 14px to font-size: 1(r)em (except body one) since it matches the root size. Plus many other font-sizes got changed.
    • Many dimensional things (i.e. avatars) still use pixels for now, I'll make another MR where almost everything is (r)ems, for now it's just that you can write a userstyle like body { font-size: 16px }, later it will be an in-ui option.
  • A lot of stuff that was previously defined exclusively for some things (i.e. scrolls for sidebar, chats header etc) have been more universal and reusable.
  • A lot of things now use calc() and local (prefixed with __ or ___) or when applicable global (subject to change) (i.e. --panel-header-height) css properties. Not only it makes CSS code a lot cleaner and easier to maintain, it allows better customizability either via a userstyle (now) or theme/settings (in future, possibly)

Currently known bugs:

• Menus have broken styles for buttons
• Emoji picker/suggestor in main post form gets overlapped by shadows of post form
• Offset shadow in chats when scrolled to bottom
• Deal with scrollbars on browsers that don't support scrollbar-width nor webkit scrollbar styling
• Typing long post in notifications columns scrolls main column
• Force chat panel header to be always sticky irregardless of setting