diff --git a/src/icons/icons.qrc b/src/icons/icons.qrc
index 7d23cc8ca..b6cc6c1a9 100644
--- a/src/icons/icons.qrc
+++ b/src/icons/icons.qrc
@@ -11,8 +11,8 @@
         <file>dialog-warning.svg</file>
         <file>directory.svg</file>
         <file>disconnected.svg</file>
-        <file>downloading.svg</file>
         <file>download.svg</file>
+        <file>downloading.svg</file>
         <file>edit-clear.svg</file>
         <file>edit-copy.svg</file>
         <file>edit-find.svg</file>
@@ -322,20 +322,19 @@
         <file>preferences-bittorrent.svg</file>
         <file>preferences-desktop.svg</file>
         <file>preferences-webui.svg</file>
-        <file>qbittorrent_file.ico</file>
-        <file>qbittorrent.ico</file>
         <file>qbittorrent-tray-dark.svg</file>
         <file>qbittorrent-tray-light.svg</file>
         <file>qbittorrent-tray.svg</file>
-        <file alias="qbittorrent.svg">qbittorrent-tray.svg</file>
+        <file>qbittorrent.ico</file>
+        <file>qbittorrent_file.ico</file>
         <file>queued.svg</file>
         <file>ratio.svg</file>
         <file>reannounce.svg</file>
         <file>security-high.svg</file>
         <file>security-low.svg</file>
         <file>set-location.svg</file>
-        <file>slow_off.svg</file>
         <file>slow.svg</file>
+        <file>slow_off.svg</file>
         <file>speedometer.svg</file>
         <file>splash.png</file>
         <file>stalledDL.svg</file>
@@ -351,14 +350,15 @@
         <file>torrent-start.svg</file>
         <file>torrent-stop.svg</file>
         <file>tracker-error.svg</file>
+        <file>tracker-warning.svg</file>
         <file>trackerless.svg</file>
         <file>trackers.svg</file>
-        <file>tracker-warning.svg</file>
         <file>upload.svg</file>
         <file>view-categories.svg</file>
         <file>view-preview.svg</file>
         <file>view-refresh.svg</file>
         <file>view-statistics.svg</file>
         <file>wallet-open.svg</file>
+        <file alias="qbittorrent.svg">qbittorrent-tray.svg</file>
     </qresource>
 </RCC>
diff --git a/src/lang/lang.qrc b/src/lang/lang.qrc
index 62908ac87..aa66ee3c0 100644
--- a/src/lang/lang.qrc
+++ b/src/lang/lang.qrc
@@ -1,7 +1,7 @@
 <RCC>
     <qresource prefix="/lang">
-        <file>qbittorrent_az@latin.qm</file>
         <file>qbittorrent_ar.qm</file>
+        <file>qbittorrent_az@latin.qm</file>
         <file>qbittorrent_be.qm</file>
         <file>qbittorrent_bg.qm</file>
         <file>qbittorrent_ca.qm</file>
diff --git a/src/webui/www/private/css/Layout.css b/src/webui/www/private/css/Layout.css
index 1e30090d1..0245cbcbb 100644
--- a/src/webui/www/private/css/Layout.css
+++ b/src/webui/www/private/css/Layout.css
@@ -1,3 +1,5 @@
+@import url("palette.css");
+
 /*
 
 Core.css for Mocha UI
@@ -18,11 +20,6 @@ Required by:
 /* Layout
 ---------------------------------------------------------------- */
 
-html,
-body {
-    background: #fff;
-}
-
 body {
     margin: 0; /* Required */
 }
@@ -36,12 +33,7 @@ body {
     position: relative;
 }
 
-#desktopHeader {
-    background: #f2f2f2;
-}
-
 #desktopTitlebarWrapper {
-    background: #718ba6 url("../images/bg-header.gif") repeat-x;
     height: 45px;
     overflow: hidden;
     position: relative;
@@ -55,7 +47,6 @@ body {
 }
 
 #desktopTitlebar h1.applicationTitle {
-    color: #fff;
     display: none;
     font-size: 20px;
     font-weight: bold;
@@ -65,7 +56,6 @@ body {
 }
 
 #desktopTitlebar h2.tagline {
-    color: #d4dce4;
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 10px;
     font-weight: bold;
@@ -75,12 +65,10 @@ body {
 }
 
 #desktopTitlebar h2.tagline .taglineEm {
-    color: #fff;
     font-weight: bold;
 }
 
 #topNav {
-    color: #d4dce4;
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 10px;
     padding: 13px 10px 0 0;
@@ -91,7 +79,6 @@ body {
 }
 
 #topNav a {
-    color: #fff;
     font-weight: normal;
 }
 
@@ -102,10 +89,7 @@ body {
 /* Navbar */
 
 #desktopNavbar {
-    background: #f2f2f2;
-    /*background-color: #ccc;*/
-    border-bottom: 1px solid #3f3f3f;
-    height: 20px;
+    background-color: var(--color-background-default);
     margin: 0 0px;
     overflow: hidden; /* Remove this line if you want the menu to be backward compatible with Firefox 2 */
 }
@@ -126,14 +110,14 @@ body {
 }
 
 #desktopNavbar ul li a {
-    color: #333;
+    color: var(--color-text-default);
     font-weight: normal;
-    padding: 2px 10px 6px;
+    padding: 4px 10px;
 }
 
 #desktopNavbar ul li a:hover {
-    background-color: #fff;
-    color: #333;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
 
 #desktopNavbar ul li a.arrow-right,
@@ -144,10 +128,9 @@ body {
 }
 
 #desktopNavbar li ul {
-    background: #fff url("../images/bg-dropdown.gif") repeat-y;
-    border: 1px solid #3f3f3f;
+    background-color: var(--color-background-default);
+    border: 1px solid var(--color-border-default);
     left: -999em;
-    margin-top: -6px;
     position: absolute;
     z-index: 8000;
 }
@@ -165,7 +148,6 @@ body {
 }
 
 #desktopNavbar li ul li .check {
-    background: #555;
     font-size: 1px;
     height: 5px;
     left: 6px;
@@ -177,21 +159,16 @@ body {
 }
 
 #desktopNavbar li ul li a {
-    color: #3f3f3f;
+    color: var(--color-text-default);
     font-weight: normal;
     min-width: 120px;
-    padding: 1px 10px 1px 20px;
+    padding: 4px 10px 4px 25px;
     position: relative;
 }
 
 #desktopNavbar li ul li a:hover {
-    background: #6c98d9;
-    border-radius: 2px;
-    color: #fff;
-}
-
-#desktopNavbar li ul li a:hover .check {
-    background: #fff;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
 
 /* lists nested under hovered list items */
@@ -210,14 +187,14 @@ body {
 }
 
 li.divider {
-    border-top: 1px solid #ebebeb;
+    border-top: 1px solid var(--color-border-default);
     margin-top: 2px;
     padding-top: 3px;
 }
 
 #pageWrapper {
-    border-bottom: 1px solid #909090;
-    border-top: 1px solid #909090;
+    border-bottom: 1px solid var(--color-border-default);
+    border-top: 1px solid var(--color-border-default);
     overflow: hidden; /* This can be set to hidden or auto */
     position: relative;
     /*height: 100%;*/
@@ -235,7 +212,6 @@ li.divider {
 }
 
 #desktopFooter {
-    background: #f2f2f2;
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 11px;
     height: 24px;
@@ -256,8 +232,7 @@ li.divider {
 /* Panels */
 
 .panel {
-    background: #f8f8f8;
-    border-bottom: 1px solid #b9b9b9;
+    border-bottom: 1px solid var(--color-border-default);
     overflow: auto;
     position: relative;
 }
@@ -266,10 +241,6 @@ li.divider {
     border-bottom: 0;
 }
 
-.panelAlt {
-    background: #f2f2f2;
-}
-
 .bottomPanel {
     border-bottom: 0;
 }
@@ -278,14 +249,8 @@ li.divider {
     padding: 8px;
 }
 
-#mainPanel {
-    background: #fff;
-}
-
 .panel-header {
-    background: #f1f1f1 url("../images/bg-panel-header.gif") repeat-x;
-    border-bottom: 1px solid #d3d3d3;
-    height: 30px;
+    border-bottom: 1px solid var(--color-border-default);
     overflow: hidden;
     position: relative;
 }
@@ -294,13 +259,7 @@ li.divider {
     padding-top: 2px;
 }
 
-.panel-headerContent.tabs {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: left -68px;
-}
-
 .panel-header h2 {
-    color: #333;
     display: inline-block;
     font-size: 12px;
     height: 22px;
@@ -326,7 +285,6 @@ li.divider {
 /* Column and Panel Handles */
 
 .horizontalHandle {
-    background: #eee url("../images/bg-handle-horizontal.gif") repeat-x;
     font-size: 1px;
     height: 4px;
     line-height: 1px;
@@ -348,8 +306,8 @@ li.divider {
 }
 
 .columnHandle {
-    background: #c3c3c3 url("../images/handle-icon.gif") center center no-repeat;
-    border: 1px solid #909090;
+    background: url("../images/handle-icon.gif") center center no-repeat;
+    border: 1px solid var(--color-border-default);
     border-bottom: 0;
     border-top: 0;
     float: left;
diff --git a/src/webui/www/private/css/Tabs.css b/src/webui/www/private/css/Tabs.css
index 34f80748f..e5b4cb199 100644
--- a/src/webui/www/private/css/Tabs.css
+++ b/src/webui/www/private/css/Tabs.css
@@ -1,3 +1,5 @@
+@import url("palette.css");
+
 /*
 
 Tabs.css for Mocha UI
@@ -18,10 +20,7 @@ Required by:
 /* Toolbar Tabs */
 
 .toolbarTabs {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: left -70px;
     overflow: visible;
-    padding: 0 5px 2px 2px;
 }
 
 .tab-menu {
@@ -33,32 +32,28 @@ Required by:
 }
 
 .tab-menu li {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: left -35px;
     cursor: pointer;
     float: left;
-    margin: 0 0 5px;
-}
-
-.tab-menu li.selected {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: left 0;
 }
 
 .tab-menu li a {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: right -35px;
-    color: #181818;
+    background-color: var(--color-background-default);
+    border-radius: 5px 5px 0 0;
+    color: var(--color-text-default);
     display: block;
     font-weight: normal;
     margin-left: 8px;
-    padding: 6px 15px 5px 9px;
+    padding: 5px 16px;
     text-align: center;
 }
 
+.tab-menu li:hover a {
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
+}
+
 .tab-menu li.selected a {
-    background: url("../images/tabs.gif") repeat-x;
-    background-position: right 0;
-    color: #181818;
+    background-color: var(--color-background-blue);
+    color: var(--color-text-white);
     font-weight: bold;
 }
diff --git a/src/webui/www/private/css/Window.css b/src/webui/www/private/css/Window.css
index d211dd980..73cab1219 100644
--- a/src/webui/www/private/css/Window.css
+++ b/src/webui/www/private/css/Window.css
@@ -1,3 +1,5 @@
+@import url("palette.css");
+
 /*
 
 Window.css for Mocha UI
@@ -19,12 +21,15 @@ Required by:
 ---------------------------------------------------------------- */
 
 .mocha {
-    background-color: #e5e5e5;
+    background-color: var(--color-background-default);
     display: none;
     overflow: hidden;
 }
 
 .mochaOverlay {
+    background-color: var(--color-background-default);
+    border-radius: 5px;
+    height: auto !important; /* also fixes out of block issue */
     left: 0;
     position: absolute; /* This is also set in theme.js in order to make theme transitions smoother */
     top: 0;
@@ -42,13 +47,13 @@ Required by:
 */
 
 .mochaTitlebar {
-    background: url("../images/spacer.gif?from=fafafa&to=e5e5e5");
+    background-color: var(--color-background-default);
+    border-radius: 5px;
     overflow: hidden;
     width: 100%;
 }
 
 .mochaTitlebar h3 {
-    color: #888;
     font-size: 12px;
     font-weight: bold;
     line-height: 15px;
@@ -56,14 +61,9 @@ Required by:
     padding: 5px 10px 4px 12px;
 }
 
-.mocha.isFocused .mochaTitlebar h3 {
-    color: #181818;
-}
-
 .mochaToolbarWrapper {
-    background: #f1f1f1;
-    border-top: 1px solid #d9d9d9;
-    height: 29px;
+    background-color: var(--color-background-popup);
+    height: auto !important;
     overflow: hidden;
     position: relative;
     width: 100%; /* For IE */
@@ -71,22 +71,24 @@ Required by:
 
 div.mochaToolbarWrapper.bottom {
     border: 0;
-    border-bottom: 1px solid #d9d9d9;
+    border-bottom: 1px solid var(--color-border-default);
 }
 
 .mochaToolbar {
-    border-top: 1px solid #fff;
+    border-top: 1px solid var(--color-border-default);
+    height: auto !important;
+    padding-top: 4px;
     width: 100%; /* For IE */
 }
 
 .mochaContentBorder {
-    border-bottom: 1px solid #dadada;
-    border-top: 1px solid #dadada;
+    border-bottom: 1px solid var(--color-border-default);
+    border-top: 1px solid var(--color-border-default);
 }
 
 /* Has a fixed height and scrollbars if required. */
 .mochaContentWrapper {
-    background: #fff;
+    background-color: var(--color-background-popup);
     font-size: 12px;
     overflow: auto;
 }
@@ -115,13 +117,12 @@ div.mochaToolbarWrapper.bottom {
 
 /* Bottom right resize handle */
 .mocha .cornerSE {
-    background: #fefefe; /* This is the color of the visible resize handle */
+    background-color: var(--color-background-default);
     height: 20px;
     width: 20px;
 }
 
 .mochaCanvasHeader {
-    background: transparent;
     left: 0;
     overflow: hidden;
     position: absolute;
@@ -131,7 +132,6 @@ div.mochaToolbarWrapper.bottom {
 }
 
 .mochaControls {
-    background: transparent;
     height: 14px;
     position: absolute;
     right: 8px;
@@ -141,7 +141,6 @@ div.mochaToolbarWrapper.bottom {
 }
 
 .mochaCanvasControls {
-    background: transparent;
     position: absolute;
     right: 8px;
     top: 8px;
@@ -159,8 +158,8 @@ div.mochaToolbarWrapper.bottom {
 .mochaMinimizeButton,
 .mochaMaximizeButton,
 .mochaCloseButton {
-    background-color: #fff;
-    color: #666;
+    background-color: var(--color-background-default);
+    color: var(--color-text-default);
     cursor: pointer;
     float: right;
     font-size: 1px;
diff --git a/src/webui/www/private/css/dynamicTable.css b/src/webui/www/private/css/dynamicTable.css
index f54c35692..bf79be70a 100644
--- a/src/webui/www/private/css/dynamicTable.css
+++ b/src/webui/www/private/css/dynamicTable.css
@@ -1,3 +1,5 @@
+@import url("palette.css");
+
 /**************************************************************
 
     Dynamic Table
@@ -5,27 +7,23 @@
 
 **************************************************************/
 
-.dynamicTable tbody tr {
-    background-color: #fff;
-}
-
 .dynamicTable tbody tr:nth-child(even),
 .dynamicTable tbody tr.alt {
-    background-color: #eee;
+    background-color: var(--color-background-default);
 }
 
 #transferList .dynamicTable td {
-    padding: 0 2px;
+    padding: 4px 2px;
 }
 
 .dynamicTable tbody tr.selected {
-    background-color: #354158;
-    color: #fff;
+    background-color: var(--color-background-blue);
+    color: var(--color-text-white);
 }
 
 .dynamicTable tbody tr:hover {
-    background-color: #ee6600;
-    color: #fff;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
 
 #transferList tr:hover {
@@ -50,22 +48,17 @@ tr.dynamicTableHeader {
 }
 
 .dynamicTable th {
-    background-color: #eee;
-    border-right: 1px solid #ccc;
+    border-right: 1px solid var(--color-border-default);
     box-sizing: border-box;
-    padding: 4px;
+    padding: 4px 2px;
     white-space: nowrap;
 }
 
 .dynamicTable td {
-    padding: 0px 4px;
+    padding: 4px 2px;
     white-space: nowrap;
 }
 
-.dynamicTable thead tr {
-    background-color: #eee;
-}
-
 .dynamicTable th,
 .dynamicTable td {
     overflow: hidden;
diff --git a/src/webui/www/private/css/lib/vanillaSelectBox.css b/src/webui/www/private/css/lib/vanillaSelectBox.css
deleted file mode 100644
index b12a75766..000000000
--- a/src/webui/www/private/css/lib/vanillaSelectBox.css
+++ /dev/null
@@ -1,271 +0,0 @@
-.hidden-search {
-	display: none !important;
-}
-
-
-li[data-parent].closed{
-	display:none !important;
-}
-
-li[data-parent].open:not(.hidden-search){
-	display:block !important;
-}
-
-.vsb-menu{
-  cursor:pointer;
-  z-index:1000;
-	display:block;
-	visibility: hidden;
-  position:absolute;/*Don't change*/
-  border:1px solid #B2B2B2;
-  background-color: #fff;
-  background-clip: padding-box;
-  border: 1px solid rgba(0,0,0,.15);
-  box-shadow: 0 6px 12px rgba(0,0,0,.175);
-  border-radius:4px;
-  font-size : 11px;
-}
-
-.vsb-js-search-zone{
-	position:absolute;/*Don't change*/
-    z-index:1001;
-	width: 80%;
-	min-height:1.8em;
-	padding: 2px;
-	background-color: #fff;
-}
-
-.vsb-js-search-zone input{
-	border: 1px solid grey;
-	margin-left: 2px;
-	width: 96%;
-	border-radius: 4px;
-	height: 25px !important;
-}
-
-.vsb-main{
-	position: relative;/*Don't change*/
-	display: inline-block;
-	vertical-align: middle;
-	text-align:left;
-}
-
-.vsb-menu li:hover {
-	background: linear-gradient(#f5f5f5, #e8e8e8);
-}
-
-.vsb-menu ul{
-	user-select:none;
-	list-style:none;
-	white-space: nowrap;
-	margin:0px;
-	margin-top:4px;
-	padding-left:10px;
-	padding-right:10px;
-	padding-bottom:3px;
-	color: #333;
-	cursor:pointer;
-	overflow-y:auto;
-}
-
-li.disabled{
-	cursor:not-allowed;
-	opacity:0.3;
-	background-color: #999;
-}
-
-li.overflow{
-	cursor:not-allowed;
-	opacity:0.3;
-	background-color: #999;
-}
-
-li.short{
-	overflow:hidden;
-	text-overflow: ellipsis;
-}
-
-.vsb-main button{
-	min-width: 120px;
-	border-radius: 0;
-	width: 100%;
-	text-align: left;
-	z-index: 1;
-	color: #333;
-	background: white !important;
-	border: 1px solid #999 !important;
-	line-height:20px;
-	font-size:14px;
-	padding:6px 12px;
-}
-
-.vsb-main button.disabled{
-	cursor:not-allowed;
-	opacity:0.65;
-}
-
-.vsb-main .title {
-	margin-right: 6px;
-	user-select:none;
-}
-
-.vsb-main li:hover {
-	background: linear-gradient(#f5f5f5, #e8e8e8);
-}
-
-.vsb-main ul{
-	white-space: nowrap;
-}
-
-.vsb-menu li {
-	font-size: 14px;
-	background-color: #fff;
-	min-height:1.4em;
-	padding: 0.2em 2em 0.2em 1em;
-}
-
-.vsb-menu li.grouped-option b {
-	display: inline-block;
-	font-size: 15px;
-	margin-left:10px;
-	transform: translate(-18px);
-}
-
-.vsb-menu li.grouped-option.open span {
-	display: inline-block;
-	font-size: inherit;
-	margin-top:-2px;
-	height: 8px;
-	width:  8px;
-	transform: translate(-38px) rotate(45deg);
-	border-bottom:  3px solid black;
-	border-right:  3px solid black;
-	border-radius:2px;
-}
-
-.vsb-menu li.grouped-option.closed span {
-	display: inline-block;
-	font-size: inherit;
-	height: 8px;
-	width:  8px;
-	transform: translate(-38px) rotate(-45deg);
-	border-bottom:  3px solid black;
-	border-right:  3px solid black;
-	border-radius:2px;
-}
-
-.vsb-menu li.grouped-option i {
-	display: inline-block;
-	font-size: inherit;
-	float:left;
-	font-weight:bold;
-	margin-left:22px;
-	margin-right:2px;
-	height: 11px;
-	width:  8px;
-	border : 1px solid;
-	border-radius : 3px;
-	padding: 1px 3px 2px 3px;
-	margin-top:0px;
-	color:black;
-}
-
-.vsb-menu li.grouped-option.checked i::after {
-	content: "";
-	display: inline-block;
-	font-size: inherit;
-	color: #333;
-	float:left;
-	margin-left:0px;
-	display: inline-block;
-	transform: rotate(45deg);
-	height: 8px;
-	width:  5px;
-	border-bottom: 3px solid black;
-	border-right:  3px solid black;
-}
-
-.vsb-menu :not(.multi) li.active {
-	margin-left:7px;
-}
-
-.vsb-menu :not(.multi) li.active::before {
-	content: "";
-	display: inline-block;
-	font-size: inherit;
-	margin-left:-18px;
-	transform: rotate(45deg);
-	height: 10px;
-	width:  5px;
-	border-bottom:  3px solid black;
-	border-right:  3px solid black;
-	border-radius:2px;
-}
-
-.vsb-menu .multi li {
-	font-size: 14px;
-	background-color: #fff;
-	min-height:1.4em;
-	padding: 0.2em 2em 0.2em 26px;
-}
-
-.vsb-menu .multi li.grouped-option {
-	font-size: 15px;
-	padding-left: 5px;
-}
-
-
-.vsb-menu .multi li.grouped-option:hover {
-	font-weight: bold;
-	text-decoration: underline;
-	color:rgb(52, 31, 112);
-}
-
-.vsb-menu .multi li:not(.grouped-option)::before{
-	content: "";
-	display: inline-block;
-	font-size: inherit;
-	float:left;
-	font-weight:bold;
-	margin-left:-22px;
-	margin-right:2px;
-	border : 1px solid;
-	border-radius : 3px;
-	padding : 7px;
-	margin-top:0px;
-	color:black;
-}
-
-.vsb-menu .multi li:not(.grouped-option).active::after {
-	content: "";
-	display: inline-block;
-	font-size: inherit;
-	color: #333;
-	float:left;
-	margin-left:-18px;
-	display: inline-block;
-	transform: rotate(45deg);
-	margin-top:1px;
-	height: 8px;
-	width:  5px;
-	border-bottom: 3px solid black;
-	border-right:  3px solid black;
-}
-
-.caret {
-	display: inline-block;
-	width: 0;
-	height: 0;
-	margin-left: 2px;
-	vertical-align: middle;
-	border-top: 4px dashed;
-	border-top: 4px solid;
-	border-right: 4px solid transparent;
-	border-left: 4px solid transparent;
-}
-
-
-li[data-parent]{
-	padding-left: 50px !important;
-}
-
diff --git a/src/webui/www/private/css/palette.css b/src/webui/www/private/css/palette.css
new file mode 100644
index 000000000..10fcd991b
--- /dev/null
+++ b/src/webui/www/private/css/palette.css
@@ -0,0 +1,49 @@
+/* Adaptive color palette */
+
+/* Default rules */
+* {
+    --color-accent-blue: hsl(210deg 65% 55%);
+    --color-text-blue: hsl(210deg 100% 55%);
+    --color-text-orange: hsl(26deg 100% 45%);
+    --color-text-red: hsl(0deg 100% 65%);
+    --color-text-green: hsl(110deg 94% 27%);
+    --color-text-white: hsl(0deg 0% 100%);
+    --color-text-disabled: hsl(0deg 0% 60%);
+    --color-text-default: hsl(0deg 0% 33%);
+    --color-background-blue: hsl(210deg 65% 55%);
+    --color-background-popup: hsl(0deg 0% 100%);
+    --color-background-default: hsl(0deg 0% 94%);
+    --color-background-hover: hsl(26deg 80% 60%);
+    --color-border-blue: hsl(210deg 42% 48%);
+    --color-border-default: hsl(0deg 0% 85%);
+}
+
+:root {
+    color-scheme: light dark;
+}
+
+/* Light corrections */
+@media (prefers-color-scheme: light) {
+    :root {
+        color-scheme: light;
+    }
+}
+
+/* Dark corrections */
+@media (prefers-color-scheme: dark) {
+    :root {
+        color-scheme: dark;
+    }
+
+    * {
+        --color-accent-blue: hsl(210deg 42% 48%);
+        --color-text-blue: hsl(210deg 88.1% 73.5%);
+        --color-text-orange: hsl(26deg 65% 70%);
+        --color-text-default: hsl(0deg 0% 90%);
+        --color-background-blue: hsl(210deg 42% 48%);
+        --color-background-popup: hsl(0deg 0% 20%);
+        --color-background-default: hsl(0deg 0% 25%);
+        --color-background-hover: hsl(26deg 50% 55%);
+        --color-border-default: hsl(0deg 0% 33%);
+    }
+}
diff --git a/src/webui/www/private/css/style.css b/src/webui/www/private/css/style.css
index 7f7f201bd..fc5ff21c5 100644
--- a/src/webui/www/private/css/style.css
+++ b/src/webui/www/private/css/style.css
@@ -1,3 +1,5 @@
+@import url("palette.css");
+
 /* Reset */
 
 a img,
@@ -6,6 +8,32 @@ a img,
     border: none;
 }
 
+/* Forms */
+
+input[type="text"],
+input[type="number"],
+input[type="password"],
+input[type="button"],
+button,
+select {
+    border: 1px solid var(--color-border-default);
+    border-radius: 3px;
+    color: var(--color-text-default);
+    padding: 4px;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+    accent-color: var(--color-accent-blue);
+}
+
+input[type="button"],
+input[type="submit"],
+button {
+    cursor: pointer;
+    padding: 4px 16px;
+}
+
 /*table { border-collapse: collapse; border-spacing: 0; }*/
 
 :focus {
@@ -15,7 +43,7 @@ a img,
 /* Structure */
 
 body {
-    color: #555;
+    color: var(--color-text-default);
     font-family: Arial, Helvetica, sans-serif;
     font-size: 12px;
     line-height: 18px;
@@ -36,7 +64,6 @@ body {
 h2,
 h3,
 h4 {
-    color: #333;
     font-size: 12px;
     font-weight: bold;
     margin: 0;
@@ -44,13 +71,13 @@ h4 {
 }
 
 h2 {
-    color: #555;
+    color: var(--color-text-default);
     font-size: 14px;
     font-weight: bold;
 }
 
 #mochaPage h3 {
-    border-bottom: 1px solid #bbb;
+    border-bottom: 1px solid var(--color-border-default);
     display: block;
     font-size: 12px;
     margin: 0 0 8px;
@@ -59,7 +86,7 @@ h2 {
 
 #error_div,
 #rename_error {
-    color: #f00;
+    color: var(--color-text-red);
     float: left;
     font-size: 14px;
     font-weight: bold;
@@ -70,7 +97,7 @@ h4 {
 }
 
 a {
-    color: #e60;
+    color: var(--color-text-orange);
     cursor: pointer;
     text-decoration: none;
 }
@@ -99,12 +126,19 @@ dd {
     padding: 0 0 9px;
 }
 
+/* Forms */
+
+fieldset {
+    border: 1px solid var(--color-border-default);
+    border-radius: 5px;
+}
+
 /* Code */
 
 pre {
-    background-color: #f6f6f6;
-    border: 1px solid #d1d7dc;
-    color: #006600;
+    background-color: var(--color-background-default);
+    border: 1px solid var(--color-border-default);
+    color: var(--color-text-green);
     display: block;
     font-family: "Courier New", Courier, monospace;
     font-size: 11px;
@@ -117,9 +151,9 @@ pre {
 /* Dividers */
 
 hr {
-    background-color: #ddd;
+    background-color: var(--color-background-default);
     border: 0px;
-    color: #ccc;
+    color: var(--color-text-default);
     height: 1px;
 }
 
@@ -147,22 +181,22 @@ hr {
 
 #Filters ul img {
     height: 16px;
-    padding: 2px 4px;
+    padding: 0 4px;
     vertical-align: middle;
     width: 16px;
 }
 
 .selectedFilter {
-    background-color: #415a8d;
-    color: #ffffff;
+    background-color: var(--color-background-blue) !important;
+    color: var(--color-text-white) !important;
 }
 
 .selectedFilter a {
-    color: #ffffff;
+    color: var(--color-text-white) !important;
 }
 
 #properties {
-    background-color: #e5e5e5;
+    background-color: var(--color-background-default);
 }
 
 a.propButton {
@@ -184,15 +218,15 @@ a.propButton img {
 /* context menu specific */
 
 .contextMenu {
-    background: #eee;
-    border: 1px solid #999;
+    background-color: var(--color-background-default);
+    border: 1px solid var(--color-border-default);
     display: none;
     list-style-type: none;
     padding: 0;
 }
 
 .contextMenu .separator {
-    border-top: 1px solid #999;
+    border-top: 1px solid var(--color-border-default);
 }
 
 .contextMenu li {
@@ -201,7 +235,7 @@ a.propButton img {
 }
 
 .contextMenu li a {
-    color: #000;
+    color: var(--color-text-default);
     display: block;
     font-family: tahoma, arial, sans-serif;
     font-size: 12px;
@@ -211,21 +245,21 @@ a.propButton img {
 }
 
 .contextMenu li a:hover {
-    background-color: #ddd;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
 
 .contextMenu li a.disabled {
-    color: #ccc;
     font-style: italic;
 }
 
 .contextMenu li a.disabled:hover {
-    background-color: #eee;
+    color: var(--color-text-disabled);
 }
 
 .contextMenu li ul {
-    background: #eee;
-    border: 1px solid #999;
+    background: var(--color-background-default);
+    border: 1px solid var(--color-border-default);
     left: -999em;
     list-style-type: none;
     margin: -29px 0 0 100%;
@@ -259,6 +293,7 @@ a.propButton img {
 .contextMenu li img {
     height: 16px;
     margin-bottom: -4px;
+    margin-right: 0.5em; /* return missed padding */
     width: 16px;
 }
 
@@ -328,7 +363,7 @@ a.propButton img {
 /* Mocha Customization */
 
 #mochaToolbar {
-    height: 29px;
+    height: auto !important;
     margin-top: 5px;
     overflow-y: hidden;
     position: relative;
@@ -354,17 +389,20 @@ a.propButton img {
 }
 
 #torrentsFilterToolbar {
-    float: right;
-    margin-right: 30px;
+    display: inline-block;
+    vertical-align: top;
 }
 
 #torrentsFilterInput {
+    background-color: var(--color-background-default);
     background-image: url("../images/edit-find.svg");
     background-position: left;
     background-repeat: no-repeat;
     background-size: 1.5em;
-    padding-left: 2em;
-    width: 160px;
+    border: 1px solid var(--color-border-default);
+    border-radius: 3px;
+    min-width: 160px;
+    padding: 4px 4px 4px 25px;
 }
 
 #torrentFilesFilterToolbar {
@@ -403,7 +441,7 @@ label.partial {
 }
 
 fieldset.settings {
-    border: solid 1px black;
+    border: 1px solid var(--color-border-default);
     border-radius: 8px;
     padding: 4px 4px 4px 10px;
 }
@@ -455,19 +493,21 @@ ul.filterList {
 }
 
 ul.filterList a {
-    color: inherit;
+    color: var(--color-text-default);
     display: block;
     overflow: hidden;
+    padding: 4px 6px;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
 
 ul.filterList li:hover {
-    background-color: #e60;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
 
 ul.filterList li:hover a {
-    color: white;
+    color: var(--color-text-white);
 }
 
 td.generalLabel {
@@ -477,15 +517,6 @@ td.generalLabel {
     width: 1px;
 }
 
-#torrentFilesTableDiv {
-    line-height: 20px;
-}
-
-#torrentTrackersTableDiv,
-#webseedsTable {
-    line-height: 25px;
-}
-
 .filesTableCollapseIcon {
     cursor: pointer;
     height: 15px;
@@ -532,7 +563,6 @@ td.generalLabel {
 }
 
 .select-watched-folder-editable {
-    background-color: white;
     border: solid grey 1px;
     height: 20px;
     position: relative;
@@ -623,27 +653,18 @@ td.statusBarSeparator {
 }
 
 .red {
-    color: red;
+    color: var(--color-text-red);
 }
 
 .green {
-    color: green;
+    color: var(--color-text-green);
 }
 
 .searchPluginsTableRow {
     cursor: pointer;
 }
 
-#torrentFilesTableDiv .dynamicTable tr.nonAlt {
-    background-color: #fff;
-}
-
-#torrentFilesTableDiv .dynamicTable tr.nonAlt.selected {
-    background-color: #354158;
-    color: #fff;
-}
-
 #torrentFilesTableDiv .dynamicTable tr.nonAlt:hover {
-    background-color: #ee6600;
-    color: #fff;
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
 }
diff --git a/src/webui/www/private/css/vanillaSelectBox.css b/src/webui/www/private/css/vanillaSelectBox.css
new file mode 100644
index 000000000..80727e843
--- /dev/null
+++ b/src/webui/www/private/css/vanillaSelectBox.css
@@ -0,0 +1,231 @@
+@import url("palette.css");
+
+.hidden-search {
+    display: none !important;
+}
+
+li[data-parent].closed {
+    display: none !important;
+}
+
+li[data-parent].open:not(.hidden-search) {
+    display: block !important;
+}
+
+.vsb-menu {
+    background-clip: padding-box;
+    background-color: var(--color-background-default);
+    border: 1px solid var(--color-border-default);
+    cursor: pointer;
+    display: block;
+    font-size: 11px;
+    position: absolute;
+    visibility: hidden;
+    z-index: 1000; /*Don't change*/
+}
+
+.vsb-js-search-zone {
+    min-height: 1.8em;
+    padding: 2px;
+    position: absolute;
+    width: 80%;
+    z-index: 1001; /*Don't change*/
+}
+
+.vsb-js-search-zone input {
+    border-radius: 4px;
+    height: 25px !important;
+    margin-left: 2px;
+    width: 96%;
+}
+
+.vsb-main {
+    display: inline-block;
+    position: relative;
+    text-align: left;
+    vertical-align: top; /*Don't change*/
+}
+
+.vsb-menu ul {
+    cursor: pointer;
+    list-style: none;
+    margin: 0;
+    overflow-y: auto;
+    padding: 0;
+    user-select: none;
+    white-space: nowrap;
+}
+
+li.disabled {
+    background-color: #999;
+    cursor: not-allowed;
+    opacity: 0.3;
+}
+
+li.overflow {
+    background-color: #999;
+    cursor: not-allowed;
+    opacity: 0.3;
+}
+
+li.short {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.vsb-main button {
+    border: 1px solid var(--color-border-default);
+    border-radius: 4px;
+    min-width: 120px;
+    padding: 6px 12px;
+    text-align: left;
+    width: 100%;
+    z-index: 1;
+}
+
+.vsb-main button.disabled {
+    cursor: not-allowed;
+    opacity: 0.65;
+}
+
+.vsb-main .title {
+    margin-right: 6px;
+    user-select: none;
+}
+
+.vsb-main ul {
+    white-space: nowrap;
+}
+
+.vsb-menu li {
+    font-size: 12px;
+    padding: 4px 26px;
+}
+
+.vsb-menu li:hover {
+    background-color: var(--color-background-hover);
+    color: var(--color-text-white);
+}
+
+.vsb-menu li.grouped-option b {
+    display: inline-block;
+    margin-left: 10px;
+    transform: translate(-18px);
+}
+
+.vsb-menu li.grouped-option.open span {
+    border-radius: 2px;
+    display: inline-block;
+    font-size: inherit;
+    height: 8px;
+    margin-top: -2px;
+    transform: translate(-38px) rotate(45deg);
+    width: 8px;
+}
+
+.vsb-menu li.grouped-option.closed span {
+    border-radius: 2px;
+    display: inline-block;
+    font-size: inherit;
+    height: 8px;
+    transform: translate(-38px) rotate(-45deg);
+    width: 8px;
+}
+
+.vsb-menu li.grouped-option i {
+    border: 1px solid;
+    border-radius: 3px;
+    display: inline-block;
+    float: left;
+    font-size: inherit;
+    font-weight: bold;
+    height: 11px;
+    margin-left: 22px;
+    margin-right: 2px;
+    margin-top: 0px;
+    padding: 1px 3px 2px;
+    width: 8px;
+}
+
+.vsb-menu li.grouped-option.checked i::after {
+    content: "";
+    display: inline-block;
+    float: left;
+    font-size: inherit;
+    height: 8px;
+    margin-left: 0px;
+    transform: rotate(45deg);
+    width: 5px;
+}
+
+.vsb-menu :not(.multi) li.active {
+    margin-left: 7px;
+}
+
+.vsb-menu :not(.multi) li.active::before {
+    border-bottom: 3px solid var(--color-border-blue);
+    border-radius: 2px;
+    border-right: 3px solid var(--color-border-blue);
+    content: "";
+    display: inline-block;
+    font-size: inherit;
+    height: 10px;
+    margin-left: -18px;
+    transform: rotate(45deg);
+    width: 5px;
+}
+
+.vsb-menu .multi li.grouped-option {
+    padding-left: 5px;
+}
+
+.vsb-menu .multi li.grouped-option:hover {
+    color: rgb(52 31 112);
+    font-weight: bold;
+    text-decoration: underline;
+}
+
+.vsb-menu .multi li:not(.grouped-option)::before {
+    background: var(--color-background-popup);
+    border: 1px solid;
+    border-radius: 3px;
+    content: "";
+    display: inline-block;
+    float: left;
+    font-size: inherit;
+    font-weight: bold;
+    margin-left: -22px;
+    margin-right: 2px;
+    margin-top: 0px;
+    padding: 7px;
+}
+
+.vsb-menu .multi li:not(.grouped-option).active::after {
+    border-bottom: 3px solid var(--color-border-blue);
+    border-right: 3px solid var(--color-border-blue);
+    content: "";
+    display: inline-block;
+    float: left;
+    font-size: inherit;
+    height: 8px;
+    margin-left: -18px;
+    margin-top: 1px;
+    transform: rotate(45deg);
+    width: 5px;
+}
+
+.caret {
+    border-left: 4px solid transparent;
+    border-right: 4px solid transparent;
+    border-top: 4px dashed;
+    border-top: 4px solid;
+    display: inline-block;
+    height: 0;
+    margin-left: 2px;
+    vertical-align: middle;
+    width: 0;
+}
+
+li[data-parent] {
+    padding-left: 50px !important;
+}
diff --git a/src/webui/www/private/images/bg-dropdown.gif b/src/webui/www/private/images/bg-dropdown.gif
deleted file mode 100644
index b598f9dd0..000000000
Binary files a/src/webui/www/private/images/bg-dropdown.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-handle-horizontal.gif b/src/webui/www/private/images/bg-handle-horizontal.gif
deleted file mode 100644
index 27fd405ba..000000000
Binary files a/src/webui/www/private/images/bg-handle-horizontal.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-header.gif b/src/webui/www/private/images/bg-header.gif
deleted file mode 100644
index 6f44fb91f..000000000
Binary files a/src/webui/www/private/images/bg-header.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-panel-header.gif b/src/webui/www/private/images/bg-panel-header.gif
deleted file mode 100644
index ea746f0d2..000000000
Binary files a/src/webui/www/private/images/bg-panel-header.gif and /dev/null differ
diff --git a/src/webui/www/private/images/tabs.gif b/src/webui/www/private/images/tabs.gif
deleted file mode 100644
index c8b5b0c64..000000000
Binary files a/src/webui/www/private/images/tabs.gif and /dev/null differ
diff --git a/src/webui/www/private/scripts/client.js b/src/webui/www/private/scripts/client.js
index e2e8f279c..eb8e791f2 100644
--- a/src/webui/www/private/scripts/client.js
+++ b/src/webui/www/private/scripts/client.js
@@ -1212,7 +1212,7 @@ window.addEvent('load', function() {
             loadMethod: 'xhr',
             contentURL: 'views/log.html',
             require: {
-                css: ['css/lib/vanillaSelectBox.css'],
+                css: ['css/vanillaSelectBox.css'],
                 js: ['scripts/lib/vanillaSelectBox.js'],
             },
             tabsURL: 'views/logTabs.html',
diff --git a/src/webui/www/private/scripts/piecesbar.js b/src/webui/www/private/scripts/piecesbar.js
index 96d21af86..ae98dda00 100644
--- a/src/webui/www/private/scripts/piecesbar.js
+++ b/src/webui/www/private/scripts/piecesbar.js
@@ -54,10 +54,10 @@ window.qBittorrent.PiecesBar = (() => {
                 'id': 'piecesbar_' + (piecesBarUniqueId++),
                 'width': 0,
                 'height': 0,
-                'downloadingColor': 'green',
-                'haveColor': 'blue',
+                'downloadingColor': 'hsl(110deg 94% 27%)', // @TODO palette vars not supported for this value, apply average
+                'haveColor': 'hsl(210deg 55% 55%)', // @TODO palette vars not supported for this value, apply average
                 'borderSize': 1,
-                'borderColor': '#999'
+                'borderColor': 'var(--color-border-default)'
             };
 
             if (parameters && ($type(parameters) === 'object'))
diff --git a/src/webui/www/private/scripts/progressbar.js b/src/webui/www/private/scripts/progressbar.js
index e83746bd8..e2d542144 100644
--- a/src/webui/www/private/scripts/progressbar.js
+++ b/src/webui/www/private/scripts/progressbar.js
@@ -47,10 +47,10 @@ window.qBittorrent.ProgressBar = (function() {
                 'value': $pick(value, 0),
                 'width': 0,
                 'height': 0,
-                'darkbg': '#006',
-                'darkfg': '#fff',
-                'lightbg': '#fff',
-                'lightfg': '#000'
+                'darkbg': 'var(--color-background-blue)',
+                'darkfg': 'var(--color-text-white)',
+                'lightbg': 'var(--color-background-default)',
+                'lightfg': 'var(--color-text-default)'
             };
             if (parameters && $type(parameters) == 'object')
                 $extend(vals, parameters);
@@ -60,7 +60,7 @@ window.qBittorrent.ProgressBar = (function() {
                 'id': vals.id,
                 'class': 'progressbar_wrapper',
                 'styles': {
-                    'border': '1px solid #000',
+                    'border': '1px solid var(--color-border-default)',
                     'width': vals.width,
                     'height': vals.height,
                     'position': 'relative',
diff --git a/src/webui/www/private/views/log.html b/src/webui/www/private/views/log.html
index 9e1866349..9cfa6a98a 100644
--- a/src/webui/www/private/views/log.html
+++ b/src/webui/www/private/views/log.html
@@ -9,15 +9,13 @@
 
     #logFilterBar>label {
         font-weight: bold;
-        margin-right: 10px;
+        margin-right: .3em;
     }
 
     #logFilterBar>button {
         display: inline-block;
-        height: 24px;
-        padding: 0 .5em;
+        padding: 4px 15px;
         margin-left: .3em;
-        font-weight: bold;
     }
 
     #logView {
@@ -40,9 +38,11 @@
         background-repeat: no-repeat;
         background-position: left;
         background-size: 1.5em;
-        padding: 1px 5px 1px 2em;
-        margin-left: 20px;
+        padding: 4px 5px 4px 2em;
+        margin-left: .3em;
         width: 200px;
+        border: 1px solid var(--color-border-default);
+        border-radius: 3px;
     }
 
     #logFilterSummary {
@@ -56,24 +56,24 @@
     }
 
     .logNormal {
-        color: #80766e;
+        color: var(--color-text-default);
     }
 
     .logInfo {
-        color: #1781b5;
+        color: var(--color-text-blue);
     }
 
     .logWarning {
-        color: #f97d1c;
+        color: var(--color-text-orange);
     }
 
     .logCritical,
     .peerBlocked {
-        color: #ee3f4d;
+        color: var(--color-text-red);
     }
 
     .vsb-main>button {
-        padding: 0 12px !important;
+        padding: 4px 12px !important;
     }
 
     .contextMenu>li>a>img {
@@ -209,6 +209,7 @@
                     clearAll: 'QBT_TR(Clear All)QBT_TR[CONTEXT=ExecutionLogWidget]',
                 },
                 placeHolder: "QBT_TR(Choose a log level...)QBT_TR[CONTEXT=ExecutionLogWidget]",
+                keepInlineStyles: false
             });
 
             const logTableContextMenu = new window.qBittorrent.ContextMenu.ContextMenu({
diff --git a/src/webui/www/private/views/search.html b/src/webui/www/private/views/search.html
index fbae44ae8..2a4453466 100644
--- a/src/webui/www/private/views/search.html
+++ b/src/webui/www/private/views/search.html
@@ -1,12 +1,13 @@
 <style>
     #searchPattern {
         width: 300px;
-        line-height: 2em;
-        padding: 1px 5px 1px 2em;
         background-image: url("images/edit-find.svg");
         background-repeat: no-repeat;
         background-size: 1.5em;
         background-position: left;
+        border: 1px solid var(--color-border-default);
+        border-radius: 3px;
+        padding: 4px 2px 4px 25px;
     }
 
     #categorySelect {
@@ -17,10 +18,6 @@
         width: 150px;
     }
 
-    #startSearchButton {
-        width: 90px;
-    }
-
     #searchResultsNoPlugins {
         height: calc(100% - 110px);
     }
diff --git a/src/webui/www/public/css/login.css b/src/webui/www/public/css/login.css
index 61aec4e32..f807b4629 100644
--- a/src/webui/www/public/css/login.css
+++ b/src/webui/www/public/css/login.css
@@ -1,5 +1,4 @@
 body {
-    color: #555;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 12px;
     line-height: 18px;
diff --git a/src/webui/www/public/index.html b/src/webui/www/public/index.html
index 18c559af7..b8c95be4f 100644
--- a/src/webui/www/public/index.html
+++ b/src/webui/www/public/index.html
@@ -3,6 +3,7 @@
 
 <head>
     <meta charset="UTF-8" />
+    <meta name="color-scheme" content="light dark" />
     <title>qBittorrent QBT_TR(Web UI)QBT_TR[CONTEXT=OptionsDialog]</title>
     <link rel="icon" type="image/png" href="images/qbittorrent32.png" />
     <link rel="icon" type="image/svg+xml" href="images/qbittorrent-tray.svg" />
diff --git a/src/webui/www/translations/webui_translations.qrc b/src/webui/www/translations/webui_translations.qrc
index cbb6a9a19..4d53fc17c 100644
--- a/src/webui/www/translations/webui_translations.qrc
+++ b/src/webui/www/translations/webui_translations.qrc
@@ -1,7 +1,7 @@
 <RCC>
     <qresource prefix="/www/translations">
-        <file>webui_az@latin.qm</file>
         <file>webui_ar.qm</file>
+        <file>webui_az@latin.qm</file>
         <file>webui_be.qm</file>
         <file>webui_bg.qm</file>
         <file>webui_ca.qm</file>
diff --git a/src/webui/www/webui.qrc b/src/webui/www/webui.qrc
index ba489348e..b9f9bcb79 100644
--- a/src/webui/www/webui.qrc
+++ b/src/webui/www/webui.qrc
@@ -10,9 +10,10 @@
         <file>private/css/dynamicTable.css</file>
         <file>private/css/Layout.css</file>
         <file>private/css/noscript.css</file>
+        <file>private/css/palette.css</file>
         <file>private/css/style.css</file>
         <file>private/css/Tabs.css</file>
-        <file>private/css/lib/vanillaSelectBox.css</file>
+        <file>private/css/vanillaSelectBox.css</file>
         <file>private/css/Window.css</file>
         <file>private/download.html</file>
         <file>private/downloadlimit.html</file>
@@ -22,17 +23,13 @@
         <file>private/images/application-rss.svg</file>
         <file>private/images/application-url.svg</file>
         <file>private/images/arrow-right.gif</file>
-        <file>private/images/bg-dropdown.gif</file>
-        <file>private/images/bg-handle-horizontal.gif</file>
-        <file>private/images/bg-header.gif</file>
-        <file>private/images/bg-panel-header.gif</file>
         <file>private/images/checked-completed.svg</file>
         <file>private/images/collapse.svg</file>
         <file>private/images/configure.svg</file>
         <file>private/images/connected.svg</file>
         <file>private/images/dialog-warning.svg</file>
-        <file>private/images/disconnected.svg</file>
         <file>private/images/directory.svg</file>
+        <file>private/images/disconnected.svg</file>
         <file>private/images/download.svg</file>
         <file>private/images/downloading.svg</file>
         <file>private/images/edit-clear.svg</file>
@@ -351,7 +348,6 @@
         <file>private/images/stalledUP.svg</file>
         <file>private/images/stopped.svg</file>
         <file>private/images/system-log-out.svg</file>
-        <file>private/images/tabs.gif</file>
         <file>private/images/tags.svg</file>
         <file>private/images/task-complete.svg</file>
         <file>private/images/task-reject.svg</file>
@@ -387,6 +383,7 @@
         <file>private/scripts/lib/mocha.min.js</file>
         <file>private/scripts/lib/MooTools-Core-1.6.0-compat-compressed.js</file>
         <file>private/scripts/lib/MooTools-More-1.6.0-compat-compressed.js</file>
+        <file>private/scripts/lib/vanillaSelectBox.js</file>
         <file>private/scripts/misc.js</file>
         <file>private/scripts/mocha-init.js</file>
         <file>private/scripts/piecesbar.js</file>
@@ -399,7 +396,6 @@
         <file>private/scripts/prop-webseeds.js</file>
         <file>private/scripts/rename-files.js</file>
         <file>private/scripts/speedslider.js</file>
-        <file>private/scripts/lib/vanillaSelectBox.js</file>
         <file>private/setlocation.html</file>
         <file>private/shareratio.html</file>
         <file>private/upload.html</file>