Make things prettier

app/assets/main.css

@@ -92,9 +92,9 @@ input#volume:focus {
 	padding: 0;
 	position: absolute;
 	z-index: 9999999;
-	border: 1px solid #99999966;
+	border: 1px solid #999999;
 	border-radius: 2px;
-	box-shadow: 2px 2px 6px #99999966;
+	box-shadow: 2px 2px 6px #66666633;
 	background: #fcfcfc;
 }
 
@@ -107,3 +107,32 @@ input#volume:focus {
 .context-menu button:hover {
 	background: #dddddd99;
 }
+
+.playlist .channel {
+	background: #aaa;
+}
+
+.playlist .channel-progress {
+	background: none;
+}
+
+.playlist .selection.point {
+	width: 2px !important;
+}
+
+.playlist .selection.segment {
+	background: #f006;
+	border-left: 1px solid red;
+	border-right: 1px solid red;
+}
+
+.playlist .playlist-time-scale {
+	color: #666;
+	font-family: sans-serif;
+	font-size: smaller;
+}
+
+.playlist .cursor {
+	width: 2px !important;
+	background: #666;
+}

app/audio-player/background.js

@@ -32,12 +32,12 @@ async function onHeadersReceived({ responseHeaders, url, tabId }) {
 
 		await tryUntilItWorks(() => browser.tabs.insertCSS(tabId, {
 			runAt: 'document_end',
-			file: '/assets/main.css',
+			file: '/assets/waveform-playlist.css',
 		}));
 
 		await tryUntilItWorks(() => browser.tabs.insertCSS(tabId, {
 			runAt: 'document_end',
-			file: '/assets/waveform-playlist.css',
+			file: '/assets/main.css',
 		}));
 	}
 }