docs: Enhance Usage Instructions

README.md

@@ -36,13 +36,20 @@
 
 ## Usage
 
-1. [Create a `chrome` folder](https://www.userchrome.org/how-create-userchrome-css.html) in your Zen Browser's profile directory and configure it to enable userstyles.
-2. Copy the `userChrome.css`, `userContent.css`, and `zen-logo.svg` files of your preferred theme from the [`themes/`](themes/) directory in this repository to your `chrome` folder.
-3. Enable `toolkit.legacyUserProfileCustomizations.stylesheets` in [about:config](about:config).
+1. Enable `toolkit.legacyUserProfileCustomizations.stylesheets` in [about:config](about:config).
+2. Get the Profile Directory from the Application Basics section in [about:support](about:support).
+
+> [!NOTE]
+> If you are using the Flatpak installation (as of 1.17.15b), the profile directory will be incorrect. It doesn't consider flatpak's filesystem, but the profile name which appears after `.zen` will be correct. It will likely be in `~/.var/app/app.zen_browser.zen/.zen/`.
+
+3. More likely than not, Zen already created a `chrome` directory for the profile. If not, create one.
+4. From your preferred theme in [`themes`](themes/), copy `userChrome.css`, `userContent.css`, and `zen-logo.svg` to the profile's `chrome` directory.
 
 > [!NOTE]
 > If you're using the [🌻 Latte](themes/Latte/) theme, set your browser to light mode. For [🪴 Frappé](themes/Frappe/), [🌺 Macchiato](themes/Macchiato/), or [🌿 Mocha](themes/Mocha/), enable dark mode to apply the theme correctly.
 
+5. Completely close and reopen Zen. Back in [about:support](about:support), you should see the theme applied and Stylesheets listed in the Legacy User Stylesheets section.
+
 ## 🙋 FAQ
 
 - **Q:** What if I already have a `userChrome.css` and/or `userContent.css` configuration?