Firefox 29, Australis. AKA Mozillas big f*ck you to customizers!

So Mozillas new UX-project Australis finally hit the Aurora channel, yay? No, not at all... they really went all in making it non customizable this time. Separators integrated into buttons, non-movable elements, ginormous buttons with no option to change, buttons that disappear instead of being disabled etc etc. The list goes on, bleh. It is shit like this that makes you want to customize a program to begin with...

Mozilla, I hate you so much right now.

It is - thankfully - still possible to customize the UI with the userchome.css file or stylish. And this brings us to the main point of this post.

This is a first attempt, some of the rules below is probably not necessary and/or in conflict with other rules. I am satisfied being able to look at Firefox without hurling again at least. That's enough for now.

about:config

browser.tabs.drawInTitlebar = false

userchrome.css/Stylish

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);


/* ******************************************************* */
/* HAX */

#browser { 
    margin-right:-1px;
}

notificationbox {
    margin:0 0 -2px -1px !important;
    padding:0 !important;
    border:1px solid #bbb !important;
    border-top:1px !important
}

/* tabs below toolbar */
#navigator-toolbox > #toolbar-menubar { -moz-box-ordinal-group: 1 !important; }
#navigator-toolbox > #nav-bar { -moz-box-ordinal-group: 2 !important; }
#navigator-toolbox > #PersonalToolbar { -moz-box-ordinal-group: 3 !important; }
#navigator-toolbox > #TabsToolbar { -moz-box-ordinal-group: 4 !important; }

/* tab separators */
.tabbrowser-tab:after, .tabbrowser-tab:before { visibility: hidden !important; }

/* tabbar background */
#TabsToolbar:not(:-moz-lwtheme)::before { display: none !important; }

/* make tabs not huge */
.tabbrowser-tab .tab-content{ padding: 0 3px 8px 7px !important; }
.tabbrowser-tab[selected] .tab-content{ padding: 0 3px 8px 7px !important; }

/* tab backgrounds are ugly */
.tab-background {opacity:0!important;}

/* empty icon if no favicon */
.tabbrowser-tab:not([busy]) .tab-icon-image:not([src]):not([pinned]) {
  display: -moz-box !important;
}

/* toolbar fix */
#addon-bar, #PersonalToolbar, #nav-bar {
    background-clip: padding-box !important;
    border-color: rgba(0,0,0,.25) !important;
    border-radius: 0 !important;
}

/* silly menu button separator be gone */
#PanelUI-button {
    background-image:none !important; 
    margin: 0 0 0 -4px !important;
}

/* always show forward button */
#forward-button { visibility:visible !important; }

/* ******************************************************* */

#navigator-toolbox {
    background: none !important;
    background-image: -moz-linear-gradient(rgba(100,100,100,.3), rgba(50,50,50,1)) !important;
    border:1px solid black !important;
    border-color: #666 #555 #555 #666 !important;
    padding:0 !important;
    margin: 0 !important;
}

#nav-bar {
    background-image: -moz-linear-gradient(#555, #444) !important;
    border:0 !important;
    padding:0 0 0 3px !important;
    height:34px !important;
}

#nav-bar .toolbarbutton-1 {
    border:0 !important;
    border-radius:0 !important;
    opacity:.5 !important;
    -moz-appearance:none;
    background:none !important; 
    background-image: none !important;
    margin:0 0 0 0 !important;
    padding:0 !important;
    height:32px;
}
#nav-bar #forward-button[disabled] {
    opacity:.4 !important;
}

#nav-bar .toolbarbutton-1:hover {
    opacity:0.5 !important;
}

#urlbar {
    -moz-appearance:none !important;
    background:none !important; 
    background-image: -moz-linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0.05)) !important;
    margin: 0 0 0 3px !important;
    height:26px !important;
    border:none !important;
    border-radius:3px !important;
    color: #bbb !important;
    font-family: Roboto;
    font-size:18px !important;
    box-shadow: none !important;
} 

#TabsToolbar {
    -moz-appearance:none !important;
    background: none !important;
    height:23px !important;
    padding: 0 !important;
    border:0 !important;
    margin: 0 -16px -1px -16px !important;
    border-top:1px solid #666 !important;
}

tabs {
    background-image: -moz-linear-gradient(#666, #555) !important;
}

 tab { 
    background-image:none !important;
    background: none !important;
    border:0 !important;
    margin:0;
}
.tabbrowser-tab[pending] {
  opacity: 0.6 !important;
}

.tabbrowser-tab[pinned] {
    background: #666 !important;
    padding:0!important;
    height:23px !important;
    max-width:26px !important;
    white-space:nowrap;
}
.tabbrowser-tab[selected] {
    background: rgba(255,255,255,.6) !important; 
    font-weight:normal !important;
    /*border-left-color:rgba(160,160,160,0.5) !important;
    border-right-color:rgba(30,30,30,0.6) !important;*/
}
.tabbrowser-tab[selected]:not([pinned]) {
    min-width: 200px !important;
}
.tabbrowser-tab[selected][pinned] {
    background: rgba(255,255,255,.3) !important; 
    font-weight:normal !important;
}
.tabbrowser-tab:not([selected]):hover {
    background: #777 !important; 
    opacity:1.0 !important;
}
.tabbrowser-tab:not([selected])[pinned]:hover {
    background: rgb(110,110,110) !important; 
    opacity:1.0 !important;
}
.tabbrowser-tab:not([selected])[titlechanged] {
    background-image: -moz-linear-gradient(rgba(107,174,255,.5), rgba(66,133,244,.5)) !important;
    opacity:1.0 !important;
}
.tabbrowser-tab .tab-icon-image {
    margin: -1px 0 0 0 !important;
}
.tabbrowser-tab[pinned] .tab-icon-image {
    margin-left:-1px !important;
    margin-right:0 !important;
}
.tabbrowser-tab .tab-throbber {
    list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png") !important;
    margin:0 !important;
    margin-top:-1px !important;
    margin-left:0 !important;
    margin-right:0 !important;
}
.tabbrowser-tab .tab-text {
    margin:0 !important;
    margin-left:6px !important;
}