diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index bbc633ced..5be8b83db 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -6,11 +6,12 @@ function importAll (r) {
 
 require('jquery-ujs');
 require('hammerjs');
-require('qtip2');
 
 // should start looking for nodejs replacements
 importAll(require.context('../vendor', true, /\.js$/));
 
+importAll(require.context('../src/styles/base', true, /\.scss$/));
+
 require("jquery-ui/ui/widgets/autocomplete");
 require("jquery-ui/ui/widgets/button");
 require("jquery-ui/ui/widgets/dialog");
@@ -25,5 +26,5 @@ require("jquery-ui/themes/base/resizable.css");
 require("jquery-ui/themes/base/theme.css");
 
 importAll(require.context('../src/javascripts', true, /\.js(\.erb)?$/));
-importAll(require.context('../src/styles', true, /\.scss$/));
-importAll(require.context('../src/styles', true, /\.scss.erb$/));
+importAll(require.context('../src/styles/common', true, /\.scss(?:\.erb)?$/));
+importAll(require.context('../src/styles/specific', true, /\.scss(?:\.erb)?$/));
diff --git a/app/javascript/src/javascripts/mod_queue.js b/app/javascript/src/javascripts/mod_queue.js
index 96db3fca0..ad3bf6b37 100644
--- a/app/javascript/src/javascripts/mod_queue.js
+++ b/app/javascript/src/javascripts/mod_queue.js
@@ -1,3 +1,5 @@
+import Utility from './utility'
+
 let ModQueue = {};
 
 ModQueue.processed = 0;
diff --git a/app/javascript/src/javascripts/post_tooltips.js.erb b/app/javascript/src/javascripts/post_tooltips.js.erb
index ee4810a08..513d75085 100644
--- a/app/javascript/src/javascripts/post_tooltips.js.erb
+++ b/app/javascript/src/javascripts/post_tooltips.js.erb
@@ -1,9 +1,12 @@
 import Utility from './utility'
 
+require('qtip2');
+require('qtip2/dist/jquery.qtip.css');
+
 let PostTooltip = {};
 
 PostTooltip.render_tooltip = function (event, qtip) {
-  var post_id = $(event.target).parents("[data-id]").data("id");
+  var post_id = $(this).parents("[data-id]").data("id");
 
   $.get("/posts/" + post_id, { variant: "tooltip" }).then(function (html) {
     qtip.set("content.text", html);
diff --git a/app/javascript/src/styles/common/000_vars.scss b/app/javascript/src/styles/base/000_vars.scss
similarity index 99%
rename from app/javascript/src/styles/common/000_vars.scss
rename to app/javascript/src/styles/base/000_vars.scss
index 05be001e8..348a0e35e 100644
--- a/app/javascript/src/styles/common/000_vars.scss
+++ b/app/javascript/src/styles/base/000_vars.scss
@@ -1,5 +1,3 @@
-@charset "UTF-8";
-
 $menu_color: #F5F5FF;
 $link_color: hsl(213, 100%, 50%);
 $link_hover_color: lighten($link_color, 25%);
diff --git a/app/javascript/src/styles/common/010_reset.scss b/app/javascript/src/styles/base/010_reset.scss
similarity index 99%
rename from app/javascript/src/styles/common/010_reset.scss
rename to app/javascript/src/styles/base/010_reset.scss
index 6570f4346..ae050714d 100644
--- a/app/javascript/src/styles/common/010_reset.scss
+++ b/app/javascript/src/styles/base/010_reset.scss
@@ -1,6 +1,6 @@
 // Source: https://github.com/FrogBot/sassy_bootstrap/blob/master/lib/_reset.sass
 
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 // Reset.sass
 // Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an
diff --git a/app/javascript/src/styles/common/020_base.scss b/app/javascript/src/styles/base/020_base.scss
similarity index 97%
rename from app/javascript/src/styles/common/020_base.scss
rename to app/javascript/src/styles/base/020_base.scss
index a383d1557..ecd5b2056 100644
--- a/app/javascript/src/styles/common/020_base.scss
+++ b/app/javascript/src/styles/base/020_base.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 body {
   background-color: #FFF;
diff --git a/app/javascript/src/styles/common/030_links.scss b/app/javascript/src/styles/base/030_links.scss
similarity index 92%
rename from app/javascript/src/styles/common/030_links.scss
rename to app/javascript/src/styles/base/030_links.scss
index 87a971429..2ddb74c52 100644
--- a/app/javascript/src/styles/common/030_links.scss
+++ b/app/javascript/src/styles/base/030_links.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 a:link {
   color: $link_color;
diff --git a/app/javascript/src/styles/common/autocomplete.scss b/app/javascript/src/styles/common/autocomplete.scss
index 128d5ccfa..a273a3a0c 100644
--- a/app/javascript/src/styles/common/autocomplete.scss
+++ b/app/javascript/src/styles/common/autocomplete.scss
@@ -1,3 +1,5 @@
+@import "../base/000_vars.scss";
+
 .ui-autocomplete {
   font-size: 0.9em;
 
@@ -9,8 +11,12 @@
     border-right: 1px solid #C5C5C5;
   }
 
-  .ui-menu-item a {
-    padding: 1px .2em;
+  .ui-menu-item-wrapper {
+    padding: 3px .5em 3px .4em;
+
+    a {
+      margin-right: 1em;
+    }
   }
 
   .autocomplete-arrow {
diff --git a/app/javascript/src/styles/common/dtext.scss b/app/javascript/src/styles/common/dtext.scss
index dfc071b68..2910d3fbf 100644
--- a/app/javascript/src/styles/common/dtext.scss
+++ b/app/javascript/src/styles/common/dtext.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 div.prose {
   line-height: 1.4em;
diff --git a/app/javascript/src/styles/common/inline.scss b/app/javascript/src/styles/common/inline.scss
index 323372932..8415acdf2 100644
--- a/app/javascript/src/styles/common/inline.scss
+++ b/app/javascript/src/styles/common/inline.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 span.error {
   display: block;
diff --git a/app/javascript/src/styles/common/jquery_ui_custom.scss b/app/javascript/src/styles/common/jquery_ui_custom.scss
index 702c77b16..5ab5781ad 100644
--- a/app/javascript/src/styles/common/jquery_ui_custom.scss
+++ b/app/javascript/src/styles/common/jquery_ui_custom.scss
@@ -1,4 +1,4 @@
-@import "./000_vars.scss";
+@import "../base/000_vars.scss";
 
 .ui-widget {
   font-family: $base_font_family;
diff --git a/app/javascript/src/styles/common/main_layout.scss b/app/javascript/src/styles/common/main_layout.scss
index a9ab13a35..661984bfd 100644
--- a/app/javascript/src/styles/common/main_layout.scss
+++ b/app/javascript/src/styles/common/main_layout.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#search {
   margin-bottom: 1em;
diff --git a/app/javascript/src/styles/common/page_header.scss b/app/javascript/src/styles/common/page_header.scss
index 3f2f42729..193e1dbc8 100644
--- a/app/javascript/src/styles/common/page_header.scss
+++ b/app/javascript/src/styles/common/page_header.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 #maintoggle {
   display: none;
diff --git a/app/javascript/src/styles/common/paginator.scss b/app/javascript/src/styles/common/paginator.scss
index a430e4154..bb492e8c9 100644
--- a/app/javascript/src/styles/common/paginator.scss
+++ b/app/javascript/src/styles/common/paginator.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 div.paginator {
   display: block;
diff --git a/app/javascript/src/styles/common/tables.scss b/app/javascript/src/styles/common/tables.scss
index 33f6ef694..1d200e64b 100644
--- a/app/javascript/src/styles/common/tables.scss
+++ b/app/javascript/src/styles/common/tables.scss
@@ -1,4 +1,4 @@
-@import "000_vars.scss";
+@import "../base/000_vars.scss";
 
 table.striped {
   p {
diff --git a/app/javascript/src/styles/common/tags.scss.erb b/app/javascript/src/styles/common/tags.scss.erb
index 3737730e9..4d95c038e 100644
--- a/app/javascript/src/styles/common/tags.scss.erb
+++ b/app/javascript/src/styles/common/tags.scss.erb
@@ -1,13 +1,17 @@
-@import "./000_vars.scss";
+@import "../base/000_vars.scss";
 
 <% TagCategory.css_mapping.each do |category,cssmap| %>
-  .category-<%= category %> a, a.tag-type-<%= category %>, .ui-state-active a.tag-type-<%= category %> {
+  .category-<%= category %> a, a.tag-type-<%= category %>, .ui-widget-content a.tag-type-<%= category %> {
     color: <%= cssmap["color"] %>;
 
     &:hover {
       color: <%= cssmap["hover"] %>;
     }
   }
+
+  .ui-widget-content .ui-state-active a.tag-type-<%= category %> {
+    color: <%= cssmap["hover"] %>;
+  }
 <% end %>
 
 .category-banned a, a.tag-type-banned, .ui-state-active a.tag-type-banned {
diff --git a/app/javascript/src/styles/specific/api_keys.scss b/app/javascript/src/styles/specific/api_keys.scss
index 0041d0ab8..5f6db1e19 100644
--- a/app/javascript/src/styles/specific/api_keys.scss
+++ b/app/javascript/src/styles/specific/api_keys.scss
@@ -1,4 +1,4 @@
-@import "../common/020_base.scss";
+@import "../base/020_base.scss";
 
 #c-maintenance-user-api-keys {
   #api-key {
diff --git a/app/javascript/src/styles/specific/artists.scss b/app/javascript/src/styles/specific/artists.scss
index 00f74ce55..d11398f61 100644
--- a/app/javascript/src/styles/specific/artists.scss
+++ b/app/javascript/src/styles/specific/artists.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-artists, div#excerpt {
   span.new-artist {
diff --git a/app/javascript/src/styles/specific/bans.scss b/app/javascript/src/styles/specific/bans.scss
index ae58d7a56..0672b5877 100644
--- a/app/javascript/src/styles/specific/bans.scss
+++ b/app/javascript/src/styles/specific/bans.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 #c-bans #a-index {
   tr[data-expired="true"] {
diff --git a/app/javascript/src/styles/specific/comments.scss b/app/javascript/src/styles/specific/comments.scss
index 8ada861f5..7bbeb4c38 100644
--- a/app/javascript/src/styles/specific/comments.scss
+++ b/app/javascript/src/styles/specific/comments.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div.comments-for-post {
   div.notices {
diff --git a/app/javascript/src/styles/specific/dmails.scss b/app/javascript/src/styles/specific/dmails.scss
index f6261d971..a82d1ce6f 100644
--- a/app/javascript/src/styles/specific/dmails.scss
+++ b/app/javascript/src/styles/specific/dmails.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-dmails {
   tr.read-false {
diff --git a/app/javascript/src/styles/specific/explore.scss b/app/javascript/src/styles/specific/explore.scss
index 86353235b..cb3d98173 100644
--- a/app/javascript/src/styles/specific/explore.scss
+++ b/app/javascript/src/styles/specific/explore.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-explore-posts {
   header {
diff --git a/app/javascript/src/styles/specific/favorites.scss b/app/javascript/src/styles/specific/favorites.scss
index 13a7a7f46..4305d1d05 100644
--- a/app/javascript/src/styles/specific/favorites.scss
+++ b/app/javascript/src/styles/specific/favorites.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-favorites {
   section#content > h1 {
diff --git a/app/javascript/src/styles/specific/keyboard_shortcuts.scss b/app/javascript/src/styles/specific/keyboard_shortcuts.scss
index eb16070fa..aede2d667 100644
--- a/app/javascript/src/styles/specific/keyboard_shortcuts.scss
+++ b/app/javascript/src/styles/specific/keyboard_shortcuts.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-static {
   div#a-keyboard-shortcuts {
diff --git a/app/javascript/src/styles/specific/mod_queue.scss.erb b/app/javascript/src/styles/specific/mod_queue.scss.erb
index 62f381414..5766f9255 100644
--- a/app/javascript/src/styles/specific/mod_queue.scss.erb
+++ b/app/javascript/src/styles/specific/mod_queue.scss.erb
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-moderator-post-queues {
   div.post {
diff --git a/app/javascript/src/styles/specific/notes.scss b/app/javascript/src/styles/specific/notes.scss
index 045d1d837..866eabd3c 100644
--- a/app/javascript/src/styles/specific/notes.scss
+++ b/app/javascript/src/styles/specific/notes.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#note-container {
   position: absolute;
diff --git a/app/javascript/src/styles/specific/pools.scss b/app/javascript/src/styles/specific/pools.scss
index 2466a5f1b..c44a12bfc 100644
--- a/app/javascript/src/styles/specific/pools.scss
+++ b/app/javascript/src/styles/specific/pools.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 a.pool-category-series, .pool-category-series a {
   color: #A0A;
diff --git a/app/javascript/src/styles/specific/post_tooltips.scss b/app/javascript/src/styles/specific/post_tooltips.scss
index 650575fb0..e96b5adaf 100644
--- a/app/javascript/src/styles/specific/post_tooltips.scss
+++ b/app/javascript/src/styles/specific/post_tooltips.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 $tooltip-line-height: 16px;
 $tooltip-body-height: $tooltip-line-height * 6; // 6 lines high.
diff --git a/app/javascript/src/styles/specific/post_versions.scss b/app/javascript/src/styles/specific/post_versions.scss
index 03c505847..ee95ad7e4 100644
--- a/app/javascript/src/styles/specific/post_versions.scss
+++ b/app/javascript/src/styles/specific/post_versions.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-post-versions {
   div#a-index {
diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss
index fd22a57f2..80c636aeb 100644
--- a/app/javascript/src/styles/specific/posts.scss
+++ b/app/javascript/src/styles/specific/posts.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 article.post-preview {
   height: 154px;
diff --git a/app/javascript/src/styles/specific/related_tags.scss b/app/javascript/src/styles/specific/related_tags.scss
index 15b476a32..245cac83c 100644
--- a/app/javascript/src/styles/specific/related_tags.scss
+++ b/app/javascript/src/styles/specific/related_tags.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#related-tags-container {
   padding-right: 2em;
diff --git a/app/javascript/src/styles/specific/sessions.scss b/app/javascript/src/styles/specific/sessions.scss
index 8ff8d9eb3..190a3ce83 100644
--- a/app/javascript/src/styles/specific/sessions.scss
+++ b/app/javascript/src/styles/specific/sessions.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-sessions {
   div#a-new {
diff --git a/app/javascript/src/styles/specific/site_map.scss b/app/javascript/src/styles/specific/site_map.scss
index 46b2f5738..ffdd45c0a 100644
--- a/app/javascript/src/styles/specific/site_map.scss
+++ b/app/javascript/src/styles/specific/site_map.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-static {
   div#a-site-map {
diff --git a/app/javascript/src/styles/specific/terms_of_service.scss b/app/javascript/src/styles/specific/terms_of_service.scss
index 9a2a7be4d..aca31eb42 100644
--- a/app/javascript/src/styles/specific/terms_of_service.scss
+++ b/app/javascript/src/styles/specific/terms_of_service.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-static div#a-terms-of-service {
   width: 40em;
diff --git a/app/javascript/src/styles/specific/users.scss b/app/javascript/src/styles/specific/users.scss
index eeea777a1..5626af936 100644
--- a/app/javascript/src/styles/specific/users.scss
+++ b/app/javascript/src/styles/specific/users.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 div#c-users {
   div#a-show {
diff --git a/app/javascript/src/styles/specific/z_responsive.scss b/app/javascript/src/styles/specific/z_responsive.scss
index 72c8b73eb..8d769a7ad 100644
--- a/app/javascript/src/styles/specific/z_responsive.scss
+++ b/app/javascript/src/styles/specific/z_responsive.scss
@@ -1,4 +1,4 @@
-@import "../common/000_vars.scss";
+@import "../base/000_vars.scss";
 
 #desktop-version-link {
   display: none;
diff --git a/app/views/posts/partials/show/_ugoira_original.html.erb b/app/views/posts/partials/show/_ugoira_original.html.erb
index dfff4499e..2252053ce 100644
--- a/app/views/posts/partials/show/_ugoira_original.html.erb
+++ b/app/views/posts/partials/show/_ugoira_original.html.erb
@@ -38,9 +38,9 @@
 
 <% content_for(:html_header) do %>
   <script type="text/javascript">
-    Danbooru.Ugoira = {};
+    let Ugoira = {};
 
-    Danbooru.Ugoira.create_player = function() {
+    Ugoira.create_player = function() {
       var meta_data = {
         mime_type: <%= raw @post.pixiv_ugoira_frame_data.content_type.to_json %>,
         frames: <%= raw @post.pixiv_ugoira_frame_data.data.to_json %>
@@ -57,24 +57,24 @@
       this.player = new ZipImagePlayer(options);
     }
 
-    Danbooru.Ugoira.player = null;
+    Ugoira.player = null;
 
     $(function() {
-      Danbooru.Ugoira.create_player();
-      $(Danbooru.Ugoira.player).on("loadProgress", function(ev, progress) {
+      Ugoira.create_player();
+      $(Ugoira.player).on("loadProgress", function(ev, progress) {
         $("#seek-slider").progressbar("value", Math.floor(progress * 100));
       });
 
       var player_manually_paused = false;
       $("#ugoira-play").click(function(e) {
-        Danbooru.Ugoira.player.play();
+        Ugoira.player.play();
         $(this).hide();
         $("#ugoira-pause").show();
         player_manually_paused = false;
         e.preventDefault();
       })
       $("#ugoira-pause").click(function(e) {
-        Danbooru.Ugoira.player.pause();
+        Ugoira.player.pause();
         $(this).hide();
         $("#ugoira-play").show();
         player_manually_paused = true;
@@ -87,23 +87,23 @@
 
       $("#seek-slider").slider({
         min: 0,
-        max: Danbooru.Ugoira.player._frameCount-1,
+        max: Ugoira.player._frameCount-1,
         start: function(event, ui) {
           // Need to pause while slider is being dragged or playback speed will bug out
-          Danbooru.Ugoira.player.pause();
+          Ugoira.player.pause();
         },
         slide: function(event, ui) {
-          Danbooru.Ugoira.player._frame = ui.value;
-          Danbooru.Ugoira.player._displayFrame();
+          Ugoira.player._frame = ui.value;
+          Ugoira.player._displayFrame();
         },
         stop: function(event, ui) {
           // Resume playback when dragging stops, but only if player was not paused by the user earlier
           if (!(player_manually_paused)) {
-            Danbooru.Ugoira.player.play();
+            Ugoira.player.play();
           }
         }
       });
-      $(Danbooru.Ugoira.player).on("frame", function(frame, frame_number) {
+      $(Ugoira.player).on("frame", function(frame, frame_number) {
         $("#seek-slider").slider("option", "value", frame_number);
       });
     });