diff --git a/LICENSE.md b/LICENSE.md
index e066202..cba6f6a 100644
--- a/LICENSE.md
+++ b/LICENSE.md
@@ -657,4 +657,4 @@ the specific requirements.
You should also get your employer (if you work as a programmer) or
school, if any, to sign a "copyright disclaimer" for the program, if
necessary. For more information on this, and how to apply and follow
-the GNU AGPL, see .
\ No newline at end of file
+the GNU AGPL, see .
diff --git a/README.md b/README.md
index dda292a..6fd42a7 100644
--- a/README.md
+++ b/README.md
@@ -4,4 +4,5 @@ A collection for all my UserCSS styles.
I suggest using the [Stylus](https://github.com/openstyles/stylus) extension to apply them in your browser.
-All my styles are licensed under the AGPL-3.0 license.
\ No newline at end of file
+Only my 100% original styles are licensed under the AGPL-3.0 license.
+This means, not every style in this repo: for those not made from scratch, but starting from someone else's code, proper credits are indicated in the source files and I don't change the license.
diff --git a/Styles/Firefox/FFUltraSlim.css b/Styles/Firefox/FFUltraSlim.css
new file mode 100644
index 0000000..a271e80
--- /dev/null
+++ b/Styles/Firefox/FFUltraSlim.css
@@ -0,0 +1,495 @@
+/*==============================================================================================*
+ ___ ___ ___ __ __
+ |__ |__ | | | | |__) /\ /__` | | |\/|
+ | | \__/ |___ | | \ /~~\ .__/ |___ | | |
+ v0.1
+
+ FFUltraSlim: Extremely minimalist Firefox usertheme.
+ Wastes just about 25px of vertical space.
+
+ Note: Requires "Compact" toolbar density.
+
+ By OctoSpacc: https://gitlab.com/octospacc/UserCSS
+
+ Below is the original header for Cascade,
+ which this theme is mostly based off.
+
+*==============================================================================================*/
+
+/*==============================================================================================*
+
+ +-----+-----+-----+-----+-----+-----+-----+
+ | █▀▀ | ▄▀█ | █▀▀ | █▀▀ | ▄▀█ | █▀▄ | █▀▀ |
+ | █▄▄ | █▀█ | ▄▄█ | █▄▄ | █▀█ | █▄▀ | ██▄ |
+ +-----+-----+-----+-----+-----+-----+-----+
+
+ Description: Minimalist, Simple, Keyboard Centered and based on SimpleFox. 🦊
+ What you get is a really simple responsive one-line layout using the new Proton UI.
+
+ > SimpleFox: https://github.com/migueravila/SimpleFox
+
+ Author: Andreas Grafen
+ (https://andreas.grafen.info)
+
+ Repository: https://github.com/andreasgrafen/ag.proton
+
+ Thank you Nick, Abdallah and Benyamin for all the great suggestions for improvements! ♡
+ Nick: https://github.com/nicksundermeyer)
+ Abdallah: https://github.com/HeiWiper)
+ Benyamin: https://github.com/benyaminl)
+
+ If you're looking for a **mouse-friendly** clone please check out Waterfall.
+ https://github.com/crambaud/waterfall
+
+*==============================================================================================*/
+
+/* Ultra slim config */
+
+.tab-content,
+.toolbarbutton-1,
+.tab-loading-burst,
+.tab-background,
+#nav-bar,
+#nav-bar-customization-target,
+#urlbar,
+#urlbar-container,
+#urlbar-input-container,
+#urlbar-background {
+ Max-Height: 25px !important;
+ Font-Size: 10pt !important;
+}
+
+.tab-text, .tab-label {
+ Min-Height: 28px !important;
+}
+
+.scrollbox-clip {
+ Position: Fixed;
+ // Max-Height: 24px !important;
+}
+
+#identity-icon, .tab-icon-image, .tab-icon-stack {
+ Max-Height: 11px !important;
+ Max-Width: 11px !important;
+}
+
+.toolbarbutton-icon, .toolbarbutton-1 {
+ Max-Height: 20px !important;
+ Max-Width: 20px !important;
+}
+
+@media (max-width: 640px) {
+ #TabsToolbar,
+ #nav-bar,
+ #urlbar-input-container {
+ Max-Height: 24px !important;
+ }
+}
+
+/* Reposition some keys here */
+
+/* transition to oneline */
+@media (min-width: 640px) {
+ /* move tabs bar over */
+ #TabsToolbar {
+ margin-left: var(--uc-urlbar-width) !important;
+ }
+
+ /* move entire nav bar */
+ #nav-bar { margin: calc((var(--urlbar-min-height) * -1) - 8px) calc(100vw - var(--uc-urlbar-width)) 0 0 !important; }
+}
+
+/*=============================================================================================*/
+
+/*---+---+---+---+---+---+
+ | C | O | N | F | I | G |
+ +---+---+---+---+---+---*/
+
+/* Feel free to tweak the following
+ * config settingsto your own liking. */
+
+ /*---+---+---+---+---+---+---+
+ | C | O | L | O | U | R | S |
+ +---+---+---+---+---+---+---*/
+
+ /* Comment this block out if you want to keep the default theme colour. */
+ /* This will also work with custom colours from color.firefox.com. */
+
+ @media (prefers-color-scheme: dark) { :root {
+
+ --window-colour: #1E2021;
+ --secondary-colour: #191B1C;
+ --inverted-colour: #FAFAFC;
+
+ /* Containter Tab Colours */
+ --uc-identity-color-blue: #7ED6DF;
+ --uc-identity-color-turquoise: #55E6C1;
+ --uc-identity-color-green: #B8E994;
+ --uc-identity-color-yellow: #F7D794;
+ --uc-identity-color-orange: #F19066;
+ --uc-identity-color-red: #FC5C65;
+ --uc-identity-color-pink: #F78FB3;
+ --uc-identity-color-purple: #786FA6;
+
+ --uc-identity-color-blue-muted: #7ED6DF99;
+ --uc-identity-color-turquoise-muted: #55E6C199;
+ --uc-identity-color-green-muted: #B8E99499;
+ --uc-identity-color-yellow-muted: #F7D794CC;
+ --uc-identity-color-orange-muted: #F19066FF;
+ --uc-identity-color-red-muted: #FC5C65FF;
+ --uc-identity-color-pink-muted: #F78FB399;
+ --uc-identity-color-purple-muted: #786FA6FF;
+
+ }}
+
+ @media (prefers-color-scheme: light) { :root {
+
+ --window-colour: #FAFAFC;
+ --secondary-colour: #EAEAEC;
+ --inverted-colour: #1E2021;
+
+ /* Containter Tab Colours */
+ --uc-identity-color-blue: #1D65F5;
+ --uc-identity-color-turquoise: #209FB5;
+ --uc-identity-color-green: #40A02B;
+ --uc-identity-color-yellow: #E49320;
+ --uc-identity-color-orange: #FE640B;
+ --uc-identity-color-red: #FC5C65;
+ --uc-identity-color-pink: #EC83D0;
+ --uc-identity-color-purple: #822FEE;
+
+ --uc-identity-color-blue-muted: #1D65F5FF;
+ --uc-identity-color-turquoise-muted: #209FB5FF;
+ --uc-identity-color-green-muted: #40A02BFF;
+ --uc-identity-color-yellow-muted: #E49320FF;
+ --uc-identity-color-orange-muted: #FE640BFF;
+ --uc-identity-color-red-muted: #FC5C65FF;
+ --uc-identity-color-pink-muted: #EC83D0FF;
+ --uc-identity-color-purple-muted: #822FEEFF;
+
+ }}
+
+:root {
+
+ /* URL colour in URL bar suggestions */
+ --urlbar-popup-url-color: var(--uc-identity-color-purple) !important;
+
+ /*---+---+---+---+---+---+---+
+ | V | I | S | U | A | L | S |
+ +---+---+---+---+---+---+---*/
+
+ /* global border radius */
+ --uc-border-radius: 0;
+
+ /* dynamic url bar width settings */
+ --uc-urlbar-width: clamp(200px, 40vw, 500px);
+
+ /* dynamic tab width settings */
+ --uc-active-tab-width: clamp(100px, 20vw, 300px);
+ --uc-inactive-tab-width: clamp( 50px, 15vw, 200px);
+
+ /* if active always shows the tab close button */
+ --show-tab-close-button: none; /* DEFAULT: -moz-inline-box; */
+
+ /* if active only shows the tab close button on hover*/
+ --show-tab-close-button-hover: none; /* DEFAULT: -moz-inline-box; */
+
+ /* adds left and right margin to the container-tabs indicator */
+ --container-tabs-indicator-margin: 10px;
+
+}
+
+ /*---+---+---+---+---+---+---+
+ | B | U | T | T | O | N | S |
+ +---+---+---+---+---+---+---*/
+
+ #back-button,
+ #forward-button { display: none !important; }
+
+ /* bookmark icon */
+ #star-button{ display: none !important; }
+
+ /* zoom indicator */
+ #urlbar-zoom-button { display: none !important; }
+
+ /* Make button small as Possible, hidden out of sight */
+ #PanelUI-button { margin-top: -5px; margin-bottom: 44px; }
+
+ #PanelUI-menu-button {
+
+ padding: 0px !important;
+ max-height: 1px;
+
+ list-style-image: none !important;
+
+ }
+
+ #PanelUI-menu-button .toolbarbutton-icon { width: 1px !important; }
+ #PanelUI-menu-button .toolbarbutton-badge-stack { padding: 0px !important; }
+
+ #reader-mode-button{ display: none !important; }
+
+ /* tracking protection shield icon */
+ #tracking-protection-icon-container { display: none !important; }
+
+ /* #identity-box { display: none !important } /* hides encryption AND permission items */
+ #identity-permission-box { display: none !important; } /* only hides permission items */
+
+ /* e.g. playing indicator (secondary - not icon) */
+ .tab-secondary-label { display: none !important; }
+
+ #pageActionButton { display: none !important; }
+ #page-action-buttons { display: none !important; }
+
+ #urlbar-go-button { display: none !important; }
+
+/*=============================================================================================*/
+
+/*---+---+---+---+---+---+
+ | L | A | Y | O | U | T |
+ +---+---+---+---+---+---*/
+
+/* No need to change anything below this comment.
+ * Just tweak it if you want to tweak the overall layout. c: */
+
+:root {
+
+ --OneLinerMinWidth: 0px;
+
+ --uc-theme-colour: var(--window-colour, var(--toolbar-bgcolor));
+ --uc-hover-colour: var(--secondary-colour, rgba(0, 0, 0, 0.2));
+ --uc-inverted-colour: var(--inverted-colour, var(--toolbar-color));
+
+ --button-bgcolor: var(--uc-theme-colour) !important;
+ --button-hover-bgcolor: var(--uc-hover-colour) !important;
+ --button-active-bgcolor: var(--uc-hover-colour) !important;
+
+ --toolbarbutton-border-radius: var(--uc-border-radius) !important;
+
+ --tab-border-radius: var(--uc-border-radius) !important;
+ --lwt-text-color: var(--uc-inverted-colour) !important;
+ --lwt-tab-text: var(--uc-inverted-colour) !important;
+
+ --arrowpanel-border-radius: var(--uc-border-radius) !important;
+
+ --tab-block-margin: 2px !important;
+
+}
+
+window,
+#main-window,
+#toolbar-menubar,
+#TabsToolbar,
+#PersonalToolbar,
+#navigator-toolbox,
+#sidebar-box,
+#nav-bar {
+
+ -moz-appearance: none !important;
+
+ border: none !important;
+ box-shadow: none !important;
+ background: var(--uc-theme-colour) !important;
+
+}
+
+/* grey out ccons inside the toolbar to make it
+ * more aligned with the Black & White colour look */
+#PersonalToolbar toolbarbutton:not(:hover),
+#bookmarks-toolbar-button:not(:hover) { filter: grayscale(1) !important; }
+
+/* remove window control buttons */
+.titlebar-buttonbox-container { display: none !important; }
+
+/* remove "padding" left and right from tabs */
+.titlebar-spacer { display: none !important; }
+
+/* remove gap after pinned tabs */
+#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs])
+ > #tabbrowser-arrowscrollbox
+ > .tabbrowser-tab[first-visible-unpinned-tab] { margin-inline-start: 0 !important; }
+
+/* remove tab shadow */
+.tabbrowser-tab
+ >.tab-stack
+ > .tab-background { box-shadow: none !important; }
+
+/* tab background */
+.tabbrowser-tab
+ > .tab-stack
+ > .tab-background { background: var(--uc-theme-colour) !important; }
+
+/* active tab background */
+.tabbrowser-tab[selected]
+ > .tab-stack
+ > .tab-background { background: var(--uc-hover-colour) !important; }
+
+/* multi tab selection */
+#tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected=true], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { background: var(--uc-hover-colour) !important; }
+
+/* tab close button options */
+.tabbrowser-tab:not([pinned]) .tab-close-button { display: var(--show-tab-close-button) !important; }
+.tabbrowser-tab:not([pinned]):hover .tab-close-button { display: var(--show-tab-close-button-hover) !important }
+
+/* adaptive tab width */
+.tabbrowser-tab[selected][fadein]:not([pinned]) { max-width: var(--uc-active-tab-width) !important; }
+.tabbrowser-tab[fadein]:not([selected]):not([pinned]) { max-width: var(--uc-inactive-tab-width) !important; }
+
+/* container tabs indicator */
+.tabbrowser-tab[usercontextid]
+ > .tab-stack
+ > .tab-background
+ > .tab-context-line {
+
+ margin: -1px var(--container-tabs-indicator-margin) 0 var(--container-tabs-indicator-margin) !important;
+ height: 1px !important;
+
+ border-radius: var(--tab-border-radius) !important;
+ box-shadow: 0 1px 10px 1px var(--uc-identity-gradient-color) !important;
+
+}
+
+/* show favicon when media is playing but tab is hovered */
+.tab-icon-image:not([pinned]) { opacity: 1 !important; }
+
+/* Makes the speaker icon to always appear if the tab is playing (not only on hover) */
+.tab-icon-overlay:not([crashed]),
+.tab-icon-overlay[pinned][crashed][selected] {
+
+ top: 5px !important;
+ z-index: 1 !important;
+
+ padding: 1.5px !important;
+ inset-inline-end: -8px !important;
+ width: 16px !important; height: 16px !important;
+
+ border-radius: 10px !important;
+
+}
+
+
+/* style and position speaker icon */
+.tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
+
+ stroke: transparent !important;
+ background: transparent !important;
+ opacity: 1 !important; fill-opacity: 0.8 !important;
+
+ color: currentColor !important;
+
+ stroke: var(--uc-theme-colour) !important;
+ background-color: var(--uc-theme-colour) !important;
+
+}
+
+/* change the colours of the speaker icon on active tab to match tab colours */
+.tabbrowser-tab[selected] .tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
+
+ stroke: var(--uc-hover-colour) !important;
+ background-color: var(--uc-hover-colour) !important;
+
+}
+
+.tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { margin-inline-end: 9.5px !important; }
+
+.tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]) {
+
+ top: 0 !important;
+
+ padding: 0 !important;
+ margin-inline-end: 5.5px !important;
+ inset-inline-end: 0 !important;
+
+}
+
+.tab-icon-overlay:not([crashed])[soundplaying]:hover,
+.tab-icon-overlay:not([crashed])[muted]:hover,
+.tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
+
+ color: currentColor !important;
+ stroke: var(--uc-inverted-colour) !important;
+ background-color: var(--uc-inverted-colour) !important;
+ fill-opacity: 0.95 !important;
+
+}
+
+.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[soundplaying]:hover,
+.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[muted]:hover,
+.tabbrowser-tab[selected] .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover {
+
+ color: currentColor !important;
+ stroke: var(--uc-inverted-colour) !important;
+ background-color: var(--uc-inverted-colour) !important;
+ fill-opacity: 0.95 !important;
+
+}
+
+/* speaker icon colour fix */
+#TabsToolbar .tab-icon-overlay:not([crashed])[soundplaying],
+#TabsToolbar .tab-icon-overlay:not([crashed])[muted],
+#TabsToolbar .tab-icon-overlay:not([crashed])[activemedia-blocked] { color: var(--uc-inverted-colour) !important; }
+
+/* speaker icon colour fix on hover */
+#TabsToolbar .tab-icon-overlay:not([crashed])[soundplaying]:hover,
+#TabsToolbar .tab-icon-overlay:not([crashed])[muted]:hover,
+#TabsToolbar .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover { color: var(--uc-theme-colour) !important; }
+
+#nav-bar {
+
+ border: none !important;
+ box-shadow: none !important;
+ background: transparent !important;
+
+}
+
+/* remove border below whole nav */
+#navigator-toolbox { border-bottom: none !important; }
+
+#urlbar,
+#urlbar * {
+
+ outline: none !important;
+ box-shadow: none !important;
+
+}
+
+#urlbar-background { border: var(--uc-hover-colour) !important; }
+
+#urlbar[focused="true"]
+ > #urlbar-background,
+#urlbar:not([open])
+ > #urlbar-background { background: transparent !important; }
+
+
+#urlbar[open]
+ > #urlbar-background { background: var(--uc-theme-colour) !important; }
+
+.urlbarView-row:hover
+ > .urlbarView-row-inner,
+.urlbarView-row[selected]
+ > .urlbarView-row-inner { background: var(--uc-hover-colour) !important; }
+
+#statuspanel {
+
+ position: absolute !important;
+ bottom: 12px !important; left: 12px !important;
+
+}
+
+#statuspanel #statuspanel-label {
+
+ border: none !important;
+ border-radius: var(--uc-border-radius) !important;
+ background: var(--uc-theme-colour) !important;
+
+}
+
+/* Container Tabs */
+.identity-color-blue { --identity-tab-color: var(--uc-identity-color-blue) !important; --identity-icon-color: var(--uc-identity-color-blue) !important; --uc-identity-gradient-color: var(--uc-identity-color-blue-muted) !important; }
+.identity-color-turquoise { --identity-tab-color: var(--uc-identity-color-turquoise) !important; --identity-icon-color: var(--uc-identity-color-turquoise) !important; --uc-identity-gradient-color: var(--uc-identity-color-turquoise-muted) !important; }
+.identity-color-green { --identity-tab-color: var(--uc-identity-color-green) !important; --identity-icon-color: var(--uc-identity-color-green) !important; --uc-identity-gradient-color: var(--uc-identity-color-green-muted) !important; }
+.identity-color-yellow { --identity-tab-color: var(--uc-identity-color-yellow) !important; --identity-icon-color: var(--uc-identity-color-yellow) !important; --uc-identity-gradient-color: var(--uc-identity-color-yellow-muted) !important; }
+.identity-color-orange { --identity-tab-color: var(--uc-identity-color-orange) !important; --identity-icon-color: var(--uc-identity-color-orange) !important; --uc-identity-gradient-color: var(--uc-identity-color-orange-muted) !important; }
+.identity-color-red { --identity-tab-color: var(--uc-identity-color-red) !important; --identity-icon-color: var(--uc-identity-color-red) !important; --uc-identity-gradient-color: var(--uc-identity-color-red-muted) !important; }
+.identity-color-pink { --identity-tab-color: var(--uc-identity-color-pink) !important; --identity-icon-color: var(--uc-identity-color-pink) !important; --uc-identity-gradient-color: var(--uc-identity-color-pink-muted) !important; }
+.identity-color-purple { --identity-tab-color: var(--uc-identity-color-purple) !important; --identity-icon-color: var(--uc-identity-color-purple) !important; --uc-identity-gradient-color: var(--uc-identity-color-purple-muted) !important; }
diff --git a/Styles/Firefox/README.md b/Styles/Firefox/README.md
new file mode 100644
index 0000000..7fc1c59
--- /dev/null
+++ b/Styles/Firefox/README.md
@@ -0,0 +1,15 @@
+Note: Download your desired CSS file from this repo and rename it as `userChrome.css` (important).
+
+## How to use a userChrome.css theme
+
+1. Type `about:config` into your URL bar. Click on the **I accept the risk** button if you're shown a warning.
+2. Seach for **`toolkit.legacyUserProfileCustomizations.stylesheets`**, **`layers.acceleration.force-enabled`**, **`gfx.webrender.all`** and **`svg.context-properties.content.enabled`** and set them to **`true`**.
+3. Go to your profile folder:
+ - Linux: `$HOME/.mozilla/firefox/######.default-release/`
+ - MacOS: `Users/[USERNAME]/Library/Application Support/Firefox/Profiles/######.default-release`
+ - Windows: `C:\Users\[USERNAME]\AppData\Roaming\Mozilla\Firefox\Profiles\######.default-release`
+4. If it doesn't exist already create a folder called `chrome`.
+5. Copy your desired `userChrome.css` into that folder.
+6. *optional* Customise everything to your liking.
+
+_This guide is borrowed from Cascade repo. Credits: [github.com/andreasgrafen/cascade](https://github.com/andreasgrafen/cascade/blob/main/README.md#how-to-use-a-userchromecss-theme)_
diff --git a/Mastodon/MastoPurpleLight.css b/Styles/Mastodon/MastoPurpleLight.css
similarity index 100%
rename from Mastodon/MastoPurpleLight.css
rename to Styles/Mastodon/MastoPurpleLight.css