u/ResurgamS13

Aim of post was to demystify the meaning of "ac popup megabar results" reference for anyone else reading topic.

In a standard Nova UI that results dropdown panel's border is specified as transparent:

https://preview.redd.it/flo1rcp33lxh1.png?width=1745&format=png&auto=webp&s=d993f2aa48da572bcc422f5977a3c7166c77659c

In standard Nova UI the results dropdown panel's border can be coloured with:

.urlbarView-background {
  border: solid red !important;
}

Alternatively, alter variable --urlbar-background-border-open that controls border display in standard UI.

OP's problem with the border of "ac popup megabar results"... probably refers to one of Aris-t2's 'CustomCSSforFx' files modifying the Location bar.

Aris-t2's long-running 'CustomCSSforFx' repo was abandoned on 23 December 2025 when a 'The end' letter was posted.

Can also alter the colouring and roundness of the Nova UI's new style Settings & Preferences pages by adding 'userChrome' styling to your Firefox's profile.

If not familiar with modifying Firefox's UI with 'userChrome.css' files... follow the r/FirefoxCSS sub's Wiki > Tutorial. In this case, when styling internal Firefox pages such as 'Settings & Preferences' the modifications are added to the 'userContent.css' file.

If interested, search the r/FirefoxCSS sub... e.g. the userstyles here will alter the Nova UI's lavender/purple/violet colour palette on all the 'about' pages including 'Settings & Preferences' back to the colour palette used by the previous Proton UI.

----------

If desired, can go further and alter the roundness levels of the various Nova UI page elements as well.

Example. Could try a combined set of userstyles to revert Firefox's 'about' pages to the Proton UI's light & dark colouring... and also reduce the roundness level of the various page elements, buttons, cards, outlines, etc. to be similar to the Proton UI's more moderately rounded corners.

In 'userContent.css' try:

/* Nova UI - 'about' pages - Revert colouring to Proton UI & Reduce element corner roundness */
@-moz-document url-prefix("about:"), url-prefix("chrome:") {
  :root {
    --border-radius-circle: 8px !important;
    --border-radius-xsmall: 2px !important;
    --border-radius-small: 2px !important;
    --border-radius-medium: 8px !important;
    --border-radius-large: 16px !important;
    --border-radius-xlarge: 0px !important;
    --border-radius-xxlarge: 0px !important;

    --button-border-radius: 8px !important;
    --card-border-radius: 16px !important;
    --checkbox-border-radius: 0px !important;
    --input-text-border-radius: 0px !important;
    --panel-border-radius: 0px !important;
    --panel-menuitem-border-radius: 0px !important;
    --font-size-root: 15px !important;  /* controls Addons pages scaling */

    --color-accent-primary: light-dark(oklch(55% 0.24 260), oklch(76% 0.14 205)) !important;
    --color-accent-primary-hover: light-dark(oklch(48% 0.2 260), oklch(83% 0.11 205)) !important;
    --color-accent-primary-active: light-dark(oklch(41% 0.17 260), oklch(90% 0.07 205)) !important;
    --focus-outline-color: light-dark(oklch(55% 0.24 260), oklch(76% 0.14 205)) !important;
    --text-color: light-dark(#15141a, #fbfbfe) !important;
    --background-color-box: light-dark(#ffffff, #23222b) !important;
    --background-color-canvas: light-dark(#ffffff, #1c1b22) !important;
    --background-color-information: light-dark(oklch(97% 0.05 260), oklch(34% 0.14 260)) !important;
    --button-background-color: color-mix(in srgb, currentColor 7%, transparent) !important;
    --button-background-color-hover: color-mix(in srgb, currentColor 14%, transparent) !important;
    --button-background-color-active: color-mix(in srgb, currentColor 21%, transparent) !important;
    --page-nav-button-background-color-selected: color-mix(in srgb, currentColor 8%, transparent) !important;
    --button-text-color: light-dark(#15141a, #fbfbfe) !important;
    --button-text-color-primary: light-dark(#ffffff, #15141a) !important;
    --button-border: 0 !important;
    --panel-background-color: light-dark(#ffffff, rgb(66, 65, 77)) !important;
  }
}

.button-background {
  border: none !important;
}

Possibly a corrupt xulstore.json file in your Firefox profile. This can be deleted and Firefox will create a new one... see Mozilla Support (SUMO) 'Changes to toolbars and window sizes are not saved'.

Re: item #1. see r/uBlockOrigin topic 'Can anyone tell me what "||*.cfd^" does when added to the filter list?'

OP's post comments from r/firefox ...

"So I've been ricing my fire fox for a better look but there's these black bars that I didnt manage to get rid of i even asked ai to help and it just messed up everything else if someone knows how to help id appreciate it

Paste bins for both chrome files:

https://pastebin.com/NzZsNZXh

https://pastebin.com/K9waZWRs

Edit:i have an extension called zenith Internet that let transparent tabs work better"

----------

Best way to investigate problems with a heavily modified UI... one that is using a combination of a JavaScript extension (Zen Internet) and userChrome CSS files... is to open the Browser Toolbox... and learn howto inspect and fix your own Firefox's UI.

The Browser Toolbox learning curve is steep... but persevere... all your UI layout is shown there. Use your brain instead of AI.

In this sub's Wiki Tutorial paragraph #5. explains how 'Live-editing userChrome.css' can be done within the Browser Toolbox.

How your OS' transparency setup works with your modified transparent Firefox window will be a separate complication.

----------

BTW - In the February 2026 topic 'Body and Tabs Background Alignment Problem'... replies by Kupfel suggested a simple transparent Firefox setup. This was intended for the Proton UI circa Fx147.0... but still works when applied to new Nova UI.

One item that will need adjusting for the Nova UI... is making the Nova design New Tab page's 'Customise' pencil button almost transparent... in 'userContent.css' try:

@-moz-document url(about:newtab), url(about:home) {
  .button-background:has(img[src="chrome://global/skin/icons/edit-outline.svg"]) {
     color: whitesmoke !important;
     background-color: transparent !important;
     opacity: 0.5 !important;
  }
}

https://preview.redd.it/r9kkm97db4xh1.png?width=1737&format=png&auto=webp&s=530b81161a50be81467f4087364957e261cadafd

Screenshot. Kupfel's CSS styles (from here & here) applied to a new profile of Fx158.0.1 in Nova UI mode + New Tab page 'Customise' button CSS style above. Background image idea borrowed from Vivaldi themes 'Dark Shapes' and 'OLED dark'.

That CSS one-liner is neat... not sure I've ever come across display: revert before. Every day is a school day. :)

BTW - A 'hidden' preference' is one that is not normally visible in 'about:config'... you have to 'create' it yourself and this requires some prior knowledge that it does actually exist and the operating code still exists in the browser. True 'hidden prefs' are not that common. Unfortunately, a lot of webpages talk about ordinary 'about:config' preferences as being hidden.

The preference correctly suggested by dusty-2011 browser.tabs.tabMinWidth is a normal preference that appears in as soon as you type all (or part of the preference's name e.g. 'tabmin') into 'about:config'.

Can still do this... but relies on setting preference browser.urlbar.scotchBonnet.enableOverride to false

No idea when that preference (which allows users to revert the Project Scotch Bonnet URL bar updates) might be removed?

Project Scotch Bonnet URL bar alterations were introduced from Fx137.0 to Fx149.0... thus, somewhat surprised ability to revert this 'improvement' still exists?

Try:

.search-one-offs:not([hidden]) {
  padding-block: 0px !important;
  order: -1 !important;
  border-top-width: 0px !important;
}

https://preview.redd.it/ra49md59kvwh1.png?width=1646&format=png&auto=webp&s=05d533822a482dfea943c7400024dd0b98c416b1

Screenshot. New profile of Fx158.0.1 in default 'Nova UI' mode.

The 'search-one-offs' icons line padding has also been removed in above userstyle. If want the default UI's 10px of padding above and below the search icons line back... can delete the padding-block: 0px !important; line completely... or leave line in situ and tweak the padding-block: 0px value as required.

Not heard of the Places Database 'Verify integrity' button not working before. Possible that your Firefox installation itself may have more widespread corruption, not only confined to the 'Places Database' system.

You could start a new profile as a testbed... and see if that exhibits the same problems as described in OP above. Creating a new profile depends which of Firefox's Profile Manager systems you're using... new or old?

If no problems evident... could keep the new profile as your default profile? See Mozilla Support (SUMO) article 'Restore bookmarks, passwords and data from an old Firefox profile'.

----------

You should also consider doing a 'clean slate' reinstall of Firefox if the OS and PC hardware checks were all clear.

Save your bookmarks first (see 'export you bookmarks')... the simplest method is to export bookmarks from the Library as a .html file (in Library the 'Export' option is under the 'Import and Backup' tab).

A 'clean slate' reinstall of Firefox is necessary to ensure that all remnants of any previous Firefox installation, especially if the old installation may have become corrupted, are completely removed before reinstalling.

----------

To achieve a 'clean slate' uninstall and reinstall... follow Mozilla Support (SUMO) article 'Uninstall Firefox from your computer'... especially the 'Remove user data and settings' section. Alternatively, if using a Windows OS, can do the 'clean slate' uninstall using the free version of Revo Uninstaller.

When uninstall is complete... restart computer... and reinstall the latest version of Firefox downloaded direct from Mozilla.

Place in your profile's 'userChrome.css' file:

:root {
  --color-accent-primary: orange !important;
}

Place in your profile's 'userContent.css' file:

@-moz-document url-prefix("about:"), url-prefix("chrome:") {
  :root {
    --color-accent-primary: orange !important;
  }
}

Adjust the accent colour value 'orange' to suit... can use named CSS colours or other colour formats e.g. hex, rgb, oklch.

https://preview.redd.it/ab80mpjvo8wh1.png?width=1645&format=png&auto=webp&s=fa18a245c596034be1b3e15d3f7c1811257f9c99

If not familiar with modifying Firefox's UI with 'userChrome.css' and 'userContent.css' files... follow this sub's Wiki > Tutorial.

Try following Mozilla Support (SUMO) article 'Refresh Firefox - reset add-ons and settings'.

Your description may indicate some corruption in your Firefox profile... or this could be an OS problem... or perhaps a hardware-related problem e.g. a dodgy RAM stick or a failing SSD/HDD?

Run checks on your OS and hardware to confirm your system is in good condition. If using a Windows OS run the DISM command(s)... and then run an SFC check. PC manufacturers usually provide a built-in system to check the hardware.

----------

To check for any Firefox profile corruption... check the 'sanity' of the 'Places Database'. In your default Firefox profile open the 'Troubleshooting Information' (about:support) page... scroll almost to the bottom of long page.

Locate the 'Places Database' section and click the 'Verify integrity' button... the answer should be "The places.sqlite database is sane" etc. If it is not... regret there's little that can be done without attempting to repair SQlite database files... very difficult. The only real world practical cure is to save and migrate your bookmarks and perhaps some other data to a new profile.

Help is available in r/FirefoxCSS sub when stuck. Not an 'off-the-shelf' redesign service... more of a helping hand when run into particular CSS problems having done lots of self-help legwork first.

Aris-t2's long-running 'CustomCSSforFx' repo came to an end nearly a year ago... and has been abandoned since 23 December 2025 when he posted a 'The end' letter in his GitHub site.

Mozilla will remove the ability to revert to the Proton UI in a few months time... a comment in Mozilla Connect topic 'Just allow people to disable Nova on Settings -> Appearance' predicts "ability to reverse Nova may end in Firefox v161, expected Nov 24, 2026." There is already a Bug 2071454 'Remove the address bar's Nova pref check and pre-Nova assets and code paths'.

Have successfully modified the Nova UI here... aim was to recreate the same modified 'look' already liked in the Proton UI... but now using the Nova UI's codebase

EDIT. CSS 'howto' advice removed... rebop2017's reply below notes has been modifying Firefox UI for years.

Are you using the latest version of macleod-ee's 'FirefoxSidebar' userstyles?

Have you followed the large heading and link on the GitHub page linked above that states ": : All new releases will be found here : :"... and from that new Codeberg repo installed and tested the updated versions of macleod's 'FirefoxSidebar' userstyles?

Thanks for the interesting and nicely illustrated explanation of OP's underlying problem with global * CSS. :)

Totally agree! :) Thank heavens userChrome is available for modifying the default UI... one of Firefox's greatest advantages! If interested, and never tried modifying Firefox's UI, have a look at the r/FirefoxCSS sub for ideas.

Hope you don't replace Library with something worse... bad enough hiding all the 'Smart Bookmarks' info from users.

For anyone interested, can still create some Smart Bookmarks if can find the necessary information... e.g. jscher2000's instructions, still working, posted here explaining how to create your own version of a 'Recent Bookmarks 'smart folder.

Note the dead link at the end of jscher2000's instructions... which once upon a time led you to a Mozilla page listing all the different URI's needed to create other types of Smart Folders... so could query Places Database in other ways. Grrr!

Rants are on Tuesdays. Could consider deleting all history, keeping no history, and just bookmarking any sites of interest.

OS transparency settings may be worth investigating. Firefox also has several 'about:config' preferences that relate to OS transparency settings.

Creating a testbed new profile is better than disabling extensions. With a new profile you get a clean new version of Firefox with out-of-the-box settings... nothing altered or added.

Can always use the Firefox Color extension to create own version of that toolbar theme.

Re: question "How do you properly target focused state in the Inspector?"... if have a little time to spare... try following and experimenting with the method explained by 'MotherStylus' in reply to April 2021 topic 'Find element name of 'tooltip''.

In short this method 'freezes the UI' using the Browser Toolbox's 'Debugger' tab... where you can select 'Event Listener Breakpoints' triggered by a chosen 'Filter by event type'... e.g. to freeze the URL bar when focussed try selecting as the 'event type' a Mouse "click" event... rather then the "mouseout" event suggested by MotherStylus in original article about tooltips.

This tool is complex and using it not obvious... and can get UI 'stuck' until worked out how to unlock the breakpoint(s) you have just created. Hence recommend caution and best to use a new profile as a testbed whilst learning how the tool works!

Recommend NOT trying this complex toolbox feature on your default profile... create a new profile and experiment on that.

Try using the URL bar's border-radius variables:

:root {
  --urlbar-border-radius: 5px !important;
  --urlbar-inner-border-radius: 5px !important;
  --urlbarview-border-radius: 5px !important;
  --urlbar-selection-border-radius: 5px !important;
}

Not seeing OP's reported colour change. Tried toolbar theme in all Vertical Tabs expand/close modes.

Tested with OP's 'Neon Green AMOLED theme' installed on a new profile of Fx158.0

Any CSS userstyl;es, CSS themes, or extensions that could be interfering?

Suggest create a new profile on your setup and test that toolbar theme.

A simple solution would be to try several different Lightweight Toolbar Themes from the selection listed in the Add-ons Mozilla (AMO) Themes pages... e.g. search results for 'black'...

https://preview.redd.it/rpp9hv8z0ovh1.png?width=1787&format=png&auto=webp&s=0440db053a141bd6d764053fd3895aadb34f439b

Screenshot. New profile of Fx158.0 + Toolbar theme 'Black' (Black21).

If prefer to modify your current toolbar theme please post the name and a link.

Had wondered if there was some opacity or transparency being applied somewhere... and there was! :)