From aa40f563066042022b22b9337aa23731d6339f05 Mon Sep 17 00:00:00 2001
From: Ghommie <Ghombeat@Gmail.com>
Date: Sun, 21 Jul 2019 07:49:52 +0200
Subject: [PATCH 1/7] darkmode/lightmode fixes and tweaks.

---
 code/__DEFINES/colors.dm                      |   4 +-
 code/modules/client/darkmode.dm               | 114 ++++++------------
 code/modules/client/verbs/looc.dm             |  32 ++---
 .../browserassets/css/browserOutput.css       |   5 +-
 .../browserassets/css/browserOutput_white.css |   3 +-
 5 files changed, 55 insertions(+), 103 deletions(-)

diff --git a/code/__DEFINES/colors.dm b/code/__DEFINES/colors.dm
index 06c3c352ca..b028fc7990 100644
--- a/code/__DEFINES/colors.dm
+++ b/code/__DEFINES/colors.dm
@@ -11,8 +11,8 @@
 
 #define COLOR_WHITEMODE_INFO_BUTTONS_BG "#90b3dd"
 #define COLOR_WHITEMODE_ISSUE_BUTTON_BG "#ef7f7f"
-#define COLOR_WHITEMODE_BACKGROUND "#ffffff"
-#define COLOR_WHITEMODE_DARKBACKGROUND "#eeeeee"
+#define COLOR_WHITEMODE_BACKGROUND "f2f2f2"
+#define COLOR_WHITEMODE_DARKBACKGROUND "#e6e6e6"
 #define COLOR_WHITEMODE_TEXT "#000000"
 
 #define COLOR_FLOORTILE_GRAY   "#8D8B8B"
diff --git a/code/modules/client/darkmode.dm b/code/modules/client/darkmode.dm
index 9e8d136b3b..343e4601ed 100644
--- a/code/modules/client/darkmode.dm
+++ b/code/modules/client/darkmode.dm
@@ -5,7 +5,7 @@ This lets you switch chat themes by using winset and CSS loading, you must relog
 Things to note:
 If you change ANYTHING in interface/skin.dmf you need to change it here:
 Format:
-winset(src, "window as appears in skin.dmf after elem", "var to change = currentvalue;var to change = desired value")
+winset(src, "window as appears in skin.dmf after elem", "var to change = desired value")
 How this works:
 I've added a function to browseroutput.js which registers a cookie for darkmode and swaps the chat accordingly. You can find the button to do this under the "cog" icon next to the ping button (top right of chat)
 This then swaps the window theme automatically
@@ -14,91 +14,51 @@ Thanks to spacemaniac and mcdonald for help with the JS side of this.
 
 /client/proc/force_white_theme() //There's no way round it. We're essentially changing the skin by hand. It's painful but it works, and is the way Lummox suggested.
 	//Main windows
-	winset(src, "infowindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "infowindow", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "info", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_WHITEMODE_BACKGROUND]")
-	winset(src, "info", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "browseroutput", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "browseroutput", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "outputwindow", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "outputwindow", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "mainwindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "split", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_BACKGROUND]")
+	winset(src, "infowindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "info", "background-color = [COLOR_WHITEMODE_BACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "browseroutput", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "outputwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "mainwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
+	winset(src, "split", "background-color = [COLOR_WHITEMODE_BACKGROUND]")
 	//Buttons
-	winset(src, "changelog", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG]")
-	winset(src, "changelog", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "rules", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG]")
-	winset(src, "rules", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "wiki", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG]")
-	winset(src, "wiki", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "forum", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG]")
-	winset(src, "forum", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "github", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG]")
-	winset(src, "github", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "report-issue", "background-color = [COLOR_DARKMODE_ISSUE_BUTTON_BG];background-color = [COLOR_WHITEMODE_ISSUE_BUTTON_BG]")
-	winset(src, "report-issue", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "changelog", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "rules", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "wiki", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "forum", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "github", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "report-issue", "background-color = [COLOR_WHITEMODE_ISSUE_BUTTON_BG];text-color = [COLOR_WHITEMODE_TEXT]")
 	//Status and verb tabs
-	winset(src, "output", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_BACKGROUND]")
-	winset(src, "output", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "statwindow", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "statwindow", "text-color = #eaeaea;text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "stat", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_BACKGROUND]")
-	winset(src, "stat", "tab-background-color = [COLOR_DARKMODE_BACKGROUND];tab-background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "stat", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "stat", "tab-text-color = [COLOR_DARKMODE_TEXT];tab-text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "stat", "prefix-color = [COLOR_DARKMODE_TEXT];prefix-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "stat", "suffix-color = [COLOR_DARKMODE_TEXT];suffix-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "output", "background-color = [COLOR_WHITEMODE_BACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "statwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "stat", "background-color = [COLOR_WHITEMODE_BACKGROUND];tab-background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT];tab-text-color = [COLOR_WHITEMODE_TEXT];prefix-color = [COLOR_WHITEMODE_TEXT];suffix-color = [COLOR_WHITEMODE_TEXT]")
 	//Etc.
-	winset(src, "say", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "say", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "asset_cache_browser", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
-	winset(src, "asset_cache_browser", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "tooltip", "background-color = [COLOR_DARKMODE_BACKGROUND];background-color = [COLOR_WHITEMODE_BACKGROUND]")
-	winset(src, "tooltip", "text-color = [COLOR_DARKMODE_TEXT];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "say", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "asset_cache_browser", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "tooltip", "background-color = [COLOR_WHITEMODE_BACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 
 /client/proc/force_dark_theme() //Inversely, if theyre using white theme and want to swap to the superior dark theme, let's get WINSET() ing
 	//Main windows
-	winset(src, "infowindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_DARKBACKGROUND]")
-	winset(src, "infowindow", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "info", "background-color = [COLOR_WHITEMODE_BACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "info", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "browseroutput", "background-color = [COLOR_WHITEMODE_BACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "browseroutput", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "outputwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "outputwindow", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "mainwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_DARKBACKGROUND]")
-	winset(src, "split", "background-color = [COLOR_WHITEMODE_BACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
+	winset(src, "infowindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "info", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "browseroutput", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "outputwindow", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "mainwindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND]")
+	winset(src, "split", "background-color = [COLOR_DARKMODE_BACKGROUND]")
 	//Buttons
-	winset(src, "changelog", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "changelog", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "rules", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "rules", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "wiki", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "wiki", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "forum", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "forum", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "github", "background-color = [COLOR_WHITEMODE_INFO_BUTTONS_BG];background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG]")
-	winset(src, "github", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "report-issue", "background-color = [COLOR_WHITEMODE_ISSUE_BUTTON_BG];background-color = [COLOR_DARKMODE_ISSUE_BUTTON_BG]")
-	winset(src, "report-issue", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "changelog", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "rules", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "wiki", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "forum", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "github", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "report-issue", "background-color = [COLOR_DARKMODE_ISSUE_BUTTON_BG];text-color = [COLOR_DARKMODE_TEXT]")
 	//Status and verb tabs
-	winset(src, "output", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "output", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "statwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_DARKBACKGROUND]")
-	winset(src, "statwindow", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "stat", "background-color = [COLOR_WHITEMODE_BACKGROUND];background-color = [COLOR_DARKMODE_DARKBACKGROUND]")
-	winset(src, "stat", "tab-background-color = [COLOR_WHITEMODE_DARKBACKGROUND];tab-background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "stat", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "stat", "tab-text-color = [COLOR_WHITEMODE_TEXT];tab-text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "stat", "prefix-color = [COLOR_WHITEMODE_TEXT];prefix-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "stat", "suffix-color = [COLOR_WHITEMODE_TEXT];suffix-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "output", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "statwindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "stat", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];tab-background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT];tab-text-color = [COLOR_DARKMODE_TEXT];prefix-color = [COLOR_DARKMODE_TEXT];suffix-color = [COLOR_DARKMODE_TEXT]")
 	//Etc.
-	winset(src, "say", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "say", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "asset_cache_browser", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "asset_cache_browser", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "tooltip", "background-color = [COLOR_WHITEMODE_BACKGROUND];background-color = [COLOR_DARKMODE_BACKGROUND]")
-	winset(src, "tooltip", "text-color = [COLOR_WHITEMODE_TEXT];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "say", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "asset_cache_browser", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "tooltip", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
 
 
 /datum/asset/simple/goonchat
diff --git a/code/modules/client/verbs/looc.dm b/code/modules/client/verbs/looc.dm
index 4049034203..b371372dfe 100644
--- a/code/modules/client/verbs/looc.dm
+++ b/code/modules/client/verbs/looc.dm
@@ -1,3 +1,6 @@
+GLOBAL_VAR_INIT(LOOC_COLOR, null)//If this is null, use the CSS for OOC. Otherwise, use a custom colour.
+GLOBAL_VAR_INIT(normal_looc_colour, "#6699CC")
+
 /client/verb/looc(msg as text)
 	set name = "LOOC"
 	set desc = "Local OOC, seen only by those in view."
@@ -59,30 +62,17 @@
 			continue //Also handled later.
 
 		if(C.prefs.toggles & CHAT_OOC)
-//			var/display_name = src.key
-//			if(holder)
-//				if(holder.fakekey)
-//					if(C.holder)
-//						display_name = "[holder.fakekey]/([src.key])"
-//				else
-//					display_name = holder.fakekey
-			to_chat(C,"<font color='#6699CC'><span class='ooc'><span class='prefix'>LOOC:</span> <EM>[src.mob.name]:</EM> <span class='message'>[msg]</span></span></font>")
+			if(GLOB.LOOC_COLOR)
+				to_chat(C, "<font color='[GLOB.LOOC_COLOR]'><b><span class='prefix'>LOOC:</span> <EM>[src.mob.name]:</EM> <span class='message'>[msg]</span></b></font>")
+			else
+				to_chat(C, "<span class='looc'><span class='prefix'>LOOC:</span> <EM>[src.mob.name]:</EM> <span class='message'>[msg]</span></span>")
 
 	for(var/client/C in GLOB.admins)
 		if(C.prefs.toggles & CHAT_OOC)
 			var/prefix = "(R)LOOC"
 			if (C.mob in heard)
 				prefix = "LOOC"
-			to_chat(C,"<font color='#6699CC'><span class='ooc'>[ADMIN_FLW(usr)]<span class='prefix'>[prefix]:</span> <EM>[src.key]/[src.mob.name]:</EM> <span class='message'>[msg]</span></span></font>")
-
-	/*for(var/mob/dead/observer/G in world)
-		if(!G.client)
-			continue
-		var/client/C = G.client
-		if (C in GLOB.admins)
-			continue //handled earlier.
-		if(C.prefs.toggles & CHAT_OOC)
-			var/prefix = "(G)LOOC"
-			if (C.mob in heard)
-				prefix = "LOOC"
-		to_chat(C,"<font color='#6699CC'><span class='ooc'><span class='prefix'>[prefix]:</span> <EM>[src.key]/[src.mob.name]:</EM> <span class='message'>[msg]</span></span></font>")*/
+			if(GLOB.LOOC_COLOR)
+				to_chat(C, "<font color='[GLOB.LOOC_COLOR]'><b>[ADMIN_FLW(usr)] <span class='prefix'>[prefix]:</span> <EM>[src.key]/[src.mob.name]:</EM> <span class='message'>[msg]</span></b></font>")
+			else
+				to_chat(C, "<span class='looc'>[ADMIN_FLW(usr)] <span class='prefix'>[prefix]:</span> <EM>[src.key]/[src.mob.name]:</EM> <span class='message'>[msg]</span></span>")
diff --git a/code/modules/goonchat/browserassets/css/browserOutput.css b/code/modules/goonchat/browserassets/css/browserOutput.css
index b6db020df0..d5300dee4f 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput.css
@@ -265,6 +265,7 @@ h1.alert, h2.alert		{color: #a4bad6;}
 em						{font-style: normal;	font-weight: bold;}
 
 .ooc					{color: #cca300;	font-weight: bold;}
+.looc					{color: #d8b555;	font-weight: bold;}
 .antagooc				{color: #ce254f;	font-weight: bold;}
 .adminobserverooc		{color: #0099cc;	font-weight: bold;}
 .adminooc				{color: #3d5bc3;	font-weight: bold;}
@@ -326,8 +327,8 @@ h1.alert, h2.alert		{color: #99aab5;}
 .blue					{color: #215cff}
 .green				{color: #059223;}
 .nicegreen				{color: #059223;}
-.userlove				{color: #FF1493;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #ff6dbc;}
-.love					{color: #ff006a;	font-style: italic;	text-shadow: 0 0 6px #ff6d6d;}
+.userlove				{color: #ff42a6;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #82365e;}
+.love					{color: #ff4591;	font-style: italic;	text-shadow: 0 0 6px #994449;}
 .shadowling			{color: #8e8a99;}
 .cult					{color: #aa1c1c;}
 
diff --git a/code/modules/goonchat/browserassets/css/browserOutput_white.css b/code/modules/goonchat/browserassets/css/browserOutput_white.css
index e21185449b..3050ccf611 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput_white.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput_white.css
@@ -10,7 +10,7 @@ html, body {
 	color: #000000;
 }
 body {
-	background: #fff;
+	background: #f0f0f0;
     font-family: Verdana, sans-serif;
     font-size: 9pt;
     line-height: 1.2;
@@ -261,6 +261,7 @@ h1.alert, h2.alert		{color: #000000;}
 em						{font-style: normal;	font-weight: bold;}
 
 .ooc					{color: #002eb8;	font-weight: bold;}
+.looc					{color: #6699CC;	font-weight: bold;}
 .antagooc				{color: #b8002e;	font-weight: bold;}
 .adminobserverooc		{color: #0099cc;	font-weight: bold;}
 .adminooc				{color: #700038;	font-weight: bold;}

From 2a711a84d092cbca28df53fb8e8b6c6a7d710afa Mon Sep 17 00:00:00 2001
From: Ghommie <Ghombeat@Gmail.com>
Date: Sun, 21 Jul 2019 08:22:39 +0200
Subject: [PATCH 2/7] Further tweaks on dark mode.

---
 code/__DEFINES/colors.dm                             | 12 ++++++------
 .../goonchat/browserassets/css/browserOutput.css     |  2 +-
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/code/__DEFINES/colors.dm b/code/__DEFINES/colors.dm
index b028fc7990..df7955f6be 100644
--- a/code/__DEFINES/colors.dm
+++ b/code/__DEFINES/colors.dm
@@ -4,15 +4,15 @@
 #define COLOR_INPUT_ENABLED "#D3B5B5"
 
 #define COLOR_DARKMODE_INFO_BUTTONS_BG "#40628A"
-#define COLOR_DARKMODE_ISSUE_BUTTON_BG "#ce4242"
+#define COLOR_DARKMODE_ISSUE_BUTTON_BG "#CE4242"
 #define COLOR_DARKMODE_BACKGROUND "#202020"
 #define COLOR_DARKMODE_DARKBACKGROUND "#171717"
-#define COLOR_DARKMODE_TEXT "#f0f0f0"
+#define COLOR_DARKMODE_TEXT "#E6E6E6"
 
-#define COLOR_WHITEMODE_INFO_BUTTONS_BG "#90b3dd"
-#define COLOR_WHITEMODE_ISSUE_BUTTON_BG "#ef7f7f"
-#define COLOR_WHITEMODE_BACKGROUND "f2f2f2"
-#define COLOR_WHITEMODE_DARKBACKGROUND "#e6e6e6"
+#define COLOR_WHITEMODE_INFO_BUTTONS_BG "#90B3DD"
+#define COLOR_WHITEMODE_ISSUE_BUTTON_BG "#EF7F7F"
+#define COLOR_WHITEMODE_BACKGROUND "F2F2F2"
+#define COLOR_WHITEMODE_DARKBACKGROUND "#E6E6E6"
 #define COLOR_WHITEMODE_TEXT "#000000"
 
 #define COLOR_FLOORTILE_GRAY   "#8D8B8B"
diff --git a/code/modules/goonchat/browserassets/css/browserOutput.css b/code/modules/goonchat/browserassets/css/browserOutput.css
index d5300dee4f..48fa88829e 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput.css
@@ -7,7 +7,7 @@ html, body {
 	padding: 0;
 	margin: 0;
 	height: 100%;
-	color: #f0f0f0;
+	color: #e6e6e6;
 }
 body {
 	background: #171717;

From 47b673a2495b2a6250992fb71b13838ed1c466f2 Mon Sep 17 00:00:00 2001
From: Ghommie <Ghombeat@Gmail.com>
Date: Sun, 21 Jul 2019 13:00:52 +0200
Subject: [PATCH 3/7] .

---
 code/__DEFINES/colors.dm                                  | 2 +-
 code/modules/goonchat/browserassets/css/browserOutput.css | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/code/__DEFINES/colors.dm b/code/__DEFINES/colors.dm
index df7955f6be..9d9461c0c1 100644
--- a/code/__DEFINES/colors.dm
+++ b/code/__DEFINES/colors.dm
@@ -7,7 +7,7 @@
 #define COLOR_DARKMODE_ISSUE_BUTTON_BG "#CE4242"
 #define COLOR_DARKMODE_BACKGROUND "#202020"
 #define COLOR_DARKMODE_DARKBACKGROUND "#171717"
-#define COLOR_DARKMODE_TEXT "#E6E6E6"
+#define COLOR_DARKMODE_TEXT "#A4BAD6"
 
 #define COLOR_WHITEMODE_INFO_BUTTONS_BG "#90B3DD"
 #define COLOR_WHITEMODE_ISSUE_BUTTON_BG "#EF7F7F"
diff --git a/code/modules/goonchat/browserassets/css/browserOutput.css b/code/modules/goonchat/browserassets/css/browserOutput.css
index 48fa88829e..9aaef56811 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput.css
@@ -7,7 +7,7 @@ html, body {
 	padding: 0;
 	margin: 0;
 	height: 100%;
-	color: #e6e6e6;
+	color: #A4BAD6;
 }
 body {
 	background: #171717;

From cbf041663f760d82bd39e603fd045b3db5257c74 Mon Sep 17 00:00:00 2001
From: Ghommie <42542238+Ghommie@users.noreply.github.com>
Date: Wed, 11 Sep 2019 23:30:04 +0200
Subject: [PATCH 4/7] Fixing and testing themes.

---
 code/__DEFINES/colors.dm                      |  10 +-
 code/modules/client/asset_cache.dm            |   1 +
 code/modules/client/darkmode.dm               |  28 +-
 code/modules/goonchat/browserOutput.dm        |  17 +-
 .../browserassets/css/browserOutput.css       | 229 ++++++++-------
 .../browserassets/css/browserOutput_dark.css  | 155 ++++++++++
 ...tput_white.css => browserOutput_light.css} | 278 +++---------------
 .../browserassets/html/browserOutput.html     |   5 +-
 .../browserassets/js/browserOutput.js         |  51 ++--
 modular_citadel/interface/skin.dmf            |  47 ++-
 10 files changed, 406 insertions(+), 415 deletions(-)
 create mode 100644 code/modules/goonchat/browserassets/css/browserOutput_dark.css
 rename code/modules/goonchat/browserassets/css/{browserOutput_white.css => browserOutput_light.css} (58%)

diff --git a/code/__DEFINES/colors.dm b/code/__DEFINES/colors.dm
index 9d9461c0c1..cc2cd8834a 100644
--- a/code/__DEFINES/colors.dm
+++ b/code/__DEFINES/colors.dm
@@ -4,14 +4,14 @@
 #define COLOR_INPUT_ENABLED "#D3B5B5"
 
 #define COLOR_DARKMODE_INFO_BUTTONS_BG "#40628A"
-#define COLOR_DARKMODE_ISSUE_BUTTON_BG "#CE4242"
-#define COLOR_DARKMODE_BACKGROUND "#202020"
-#define COLOR_DARKMODE_DARKBACKGROUND "#171717"
-#define COLOR_DARKMODE_TEXT "#A4BAD6"
+#define COLOR_DARKMODE_ISSUE_BUTTON_BG "#A92C2C"
+#define COLOR_DARKMODE_BACKGROUND "#272727"
+#define COLOR_DARKMODE_DARKBACKGROUND "#242424"
+#define COLOR_DARKMODE_TEXT "#E0E0E0"
 
 #define COLOR_WHITEMODE_INFO_BUTTONS_BG "#90B3DD"
 #define COLOR_WHITEMODE_ISSUE_BUTTON_BG "#EF7F7F"
-#define COLOR_WHITEMODE_BACKGROUND "F2F2F2"
+#define COLOR_WHITEMODE_BACKGROUND "#F0F0F0"
 #define COLOR_WHITEMODE_DARKBACKGROUND "#E6E6E6"
 #define COLOR_WHITEMODE_TEXT "#000000"
 
diff --git a/code/modules/client/asset_cache.dm b/code/modules/client/asset_cache.dm
index 5402353fd4..5afdd6d226 100644
--- a/code/modules/client/asset_cache.dm
+++ b/code/modules/client/asset_cache.dm
@@ -571,6 +571,7 @@ GLOBAL_LIST_EMPTY(asset_datums)
 		"fontawesome-webfont.woff" = 'tgui/assets/fonts/fontawesome-webfont.woff',
 		"font-awesome.css"	       = 'code/modules/goonchat/browserassets/css/font-awesome.css',
 		"browserOutput.css"	       = 'code/modules/goonchat/browserassets/css/browserOutput.css',
+		"browserOutput_dark.css"  = 'code/modules/goonchat/browserassets/css/browserOutput_dark.css',
 	)
 
 /datum/asset/spritesheet/goonchat
diff --git a/code/modules/client/darkmode.dm b/code/modules/client/darkmode.dm
index 343e4601ed..f806e5c964 100644
--- a/code/modules/client/darkmode.dm
+++ b/code/modules/client/darkmode.dm
@@ -16,7 +16,7 @@ Thanks to spacemaniac and mcdonald for help with the JS side of this.
 	//Main windows
 	winset(src, "infowindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 	winset(src, "info", "background-color = [COLOR_WHITEMODE_BACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "browseroutput", "background-color = [COLOR_DARKMODE_INFO_BUTTONS_BG];text-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "browseroutput", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 	winset(src, "outputwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 	winset(src, "mainwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND]")
 	winset(src, "split", "background-color = [COLOR_WHITEMODE_BACKGROUND]")
@@ -30,7 +30,9 @@ Thanks to spacemaniac and mcdonald for help with the JS side of this.
 	//Status and verb tabs
 	winset(src, "output", "background-color = [COLOR_WHITEMODE_BACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 	winset(src, "statwindow", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
-	winset(src, "stat", "background-color = [COLOR_WHITEMODE_BACKGROUND];tab-background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT];tab-text-color = [COLOR_WHITEMODE_TEXT];prefix-color = [COLOR_WHITEMODE_TEXT];suffix-color = [COLOR_WHITEMODE_TEXT]")
+	winset(src, "stat", "background-color = [COLOR_WHITEMODE_BACKGROUND];tab-background-color = [COLOR_WHITEMODE_DARKBACKGROUND];\
+				text-color = [COLOR_WHITEMODE_TEXT];tab-text-color = [COLOR_WHITEMODE_TEXT];\
+				prefix-color = [COLOR_WHITEMODE_TEXT];suffix-color = [COLOR_WHITEMODE_TEXT]")
 	//Etc.
 	winset(src, "say", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
 	winset(src, "asset_cache_browser", "background-color = [COLOR_WHITEMODE_DARKBACKGROUND];text-color = [COLOR_WHITEMODE_TEXT]")
@@ -54,24 +56,10 @@ Thanks to spacemaniac and mcdonald for help with the JS side of this.
 	//Status and verb tabs
 	winset(src, "output", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
 	winset(src, "statwindow", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "stat", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];tab-background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT];tab-text-color = [COLOR_DARKMODE_TEXT];prefix-color = [COLOR_DARKMODE_TEXT];suffix-color = [COLOR_DARKMODE_TEXT]")
+	winset(src, "stat", "background-color = [COLOR_DARKMODE_DARKBACKGROUND];tab-background-color = [COLOR_DARKMODE_BACKGROUND];\
+				text-color = [COLOR_DARKMODE_TEXT];tab-text-color = [COLOR_DARKMODE_TEXT];\
+				prefix-color = [COLOR_DARKMODE_TEXT];suffix-color = [COLOR_DARKMODE_TEXT]")
 	//Etc.
 	winset(src, "say", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
 	winset(src, "asset_cache_browser", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
-	winset(src, "tooltip", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
-
-
-/datum/asset/simple/goonchat
-	verify = FALSE
-	assets = list(
-		"json2.min.js"             = 'code/modules/goonchat/browserassets/js/json2.min.js',
-		"errorHandler.js"          = 'code/modules/goonchat/browserassets/js/errorHandler.js',
-		"browserOutput.js"         = 'code/modules/goonchat/browserassets/js/browserOutput.js',
-		"fontawesome-webfont.eot"  = 'tgui/assets/fonts/fontawesome-webfont.eot',
-		"fontawesome-webfont.svg"  = 'tgui/assets/fonts/fontawesome-webfont.svg',
-		"fontawesome-webfont.ttf"  = 'tgui/assets/fonts/fontawesome-webfont.ttf',
-		"fontawesome-webfont.woff" = 'tgui/assets/fonts/fontawesome-webfont.woff',
-		"font-awesome.css"	       = 'code/modules/goonchat/browserassets/css/font-awesome.css',
-		"browserOutput.css"	       = 'code/modules/goonchat/browserassets/css/browserOutput.css',
-		"browserOutput_white.css"  = 'code/modules/goonchat/browserassets/css/browserOutput_white.css',
-	)
+	winset(src, "tooltip", "background-color = [COLOR_DARKMODE_BACKGROUND];text-color = [COLOR_DARKMODE_TEXT]")
\ No newline at end of file
diff --git a/code/modules/goonchat/browserOutput.dm b/code/modules/goonchat/browserOutput.dm
index 082f20f524..ae49e2cb45 100644
--- a/code/modules/goonchat/browserOutput.dm
+++ b/code/modules/goonchat/browserOutput.dm
@@ -82,11 +82,13 @@ GLOBAL_DATUM_INIT(iconCache, /savefile, new("tmp/iconCache.sav")) //Cache of ico
 		if("setMusicVolume")
 			data = setMusicVolume(arglist(params))
 
-		if("swaptodarkmode")
-			swaptodarkmode()
+		if("colorPresetPost") //User just swapped color presets in their goonchat preferences. Do we do anything else?
+			switch(href_list["preset"])
+				if("light")
+					owner.force_white_theme()
+				if("dark" || "normal")
+					owner.force_dark_theme()
 
-		if("swaptolightmode")
-			swaptolightmode()
 
 	if(data)
 		ehjax_send(data = data)
@@ -246,10 +248,3 @@ GLOBAL_DATUM_INIT(iconCache, /savefile, new("tmp/iconCache.sav")) //Cache of ico
 
 		// url_encode it TWICE, this way any UTF-8 characters are able to be decoded by the Javascript.
 		C << output(url_encode(url_encode(message)), "browseroutput:output")
-
-
-/datum/chatOutput/proc/swaptolightmode() //Dark mode light mode stuff. Yell at KMC if this breaks! (See darkmode.dm for documentation)
-	owner.force_white_theme()
-
-/datum/chatOutput/proc/swaptodarkmode()
-	owner.force_dark_theme()
diff --git a/code/modules/goonchat/browserassets/css/browserOutput.css b/code/modules/goonchat/browserassets/css/browserOutput.css
index 9aaef56811..164d0d65c6 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput.css
@@ -7,20 +7,16 @@ html, body {
 	padding: 0;
 	margin: 0;
 	height: 100%;
-	color: #A4BAD6;
+	color: #000000;
 }
 body {
-	background: #171717;
+	background: #E0E0E0; /*CIT CHANGE - darkens chatbox a lil*/
     font-family: Verdana, sans-serif;
     font-size: 9pt;
-	font-color: #f0f0f0;
     line-height: 1.2;
 	overflow-x: hidden;
 	overflow-y: scroll;
-	word-wrap: break-word;		
-	scrollbar-face-color:#1A1A1A;
-	scrollbar-track-color:#171717;
-	scrollbar-highlight-color:#171717;
+	word-wrap: break-word;
 }
 
 em {
@@ -60,9 +56,9 @@ img.icon {
 	border-radius: 10px;
 }
 
-a {color: #397ea5;}
-a.visited {color: #7c00e6;}
-a:visited {color: #7c00e6;}
+a {color: #0000ff;}
+a.visited {color: #ff00ff;}
+a:visited {color: #ff00ff;}
 a.popt {text-decoration: none;}
 
 /*****************************************
@@ -93,21 +89,21 @@ a.popt {text-decoration: none;}
 	bottom: 0;
 	right: 0;
 	padding: 8px;
-	background: #202020;
+	background: #d0d0d0;
 	text-decoration: none;
     font-variant: small-caps;
     font-size: 1.1em;
     font-weight: bold;
-	color: #a4bad6;
+	color: #333;
 }
-#newMessages:hover {background: #171717;}
+#newMessages:hover {background: #ccc;}
 #newMessages i {vertical-align: middle; padding-left: 3px;}
 #ping {
 	position: fixed;
 	top: 0;
 	right: 115px;
 	width: 45px;
-	background: #202020;
+	background: #d0d0d0;
 	height: 30px;
 	padding: 8px 0 2px 0;
 }
@@ -124,19 +120,19 @@ a.popt {text-decoration: none;}
 	right: 0;
 }
 #userBar .subCell {
-	background: #202020;
+	background: #d0d0d0;
     height: 30px;
 	padding: 5px 0;
 	display: block;
-	color: #a4bad6;
+	color: #333;
 	text-decoration: none;
     line-height: 28px;
-    border-top: 1px solid #171717;
+    border-top: 1px solid #b4b4b4;
 }
-#userBar .subCell:hover {background: #202020;}
+#userBar .subCell:hover {background: #ccc;}
 #userBar .toggle {
 	width: 40px;
-    background: #202020;
+    background: #ccc;
     border-top: 0;
     float: right;
     text-align: center;
@@ -172,7 +168,7 @@ a.popt {text-decoration: none;}
 	position: fixed;
 	top: 50%;
 	left: 50%;
-	background: #ddd;
+	background: #d0d0d0;
 }
 .popup .close {
 	position: absolute;
@@ -189,7 +185,7 @@ a.popt {text-decoration: none;}
 .popup .close:hover {background: #999;}
 .popup .head {
 	background: #999;
-	color: #ddd;
+	color: #d0d0d0;
 	padding: 0 10px;
 	height: 30px;
 	line-height: 30px;
@@ -200,7 +196,7 @@ a.popt {text-decoration: none;}
 }
 .popup input {border: 1px solid #999; background: #fff; margin: 0; padding: 5px; outline: none; color: #333;}
 .popup input[type=text]:hover, .popup input[type=text]:active, .popup input[type=text]:focus {border-color: green;}
-.popup input[type=submit] {padding: 5px 10px; background: #999; color: #ddd; text-transform: uppercase; font-size: 0.9em; font-weight: bold;}
+.popup input[type=submit] {padding: 5px 10px; background: #999; color: #d0d0d0; text-transform: uppercase; font-size: 0.9em; font-weight: bold;}
 .popup input[type=submit]:hover, .popup input[type=submit]:focus, .popup input[type=submit]:active {background: #aaa; cursor: pointer;}
 
 .changeFont {padding: 10px;}
@@ -214,7 +210,7 @@ a.popt {text-decoration: none;}
 
 /* ADMIN CONTEXT MENU */
 .contextMenu {
-	background-color: #ddd;
+	background-color: #d0d0d0;
 	position: fixed;
 	margin: 2px;
 	width: 150px;
@@ -246,9 +242,9 @@ a.popt {text-decoration: none;}
 ******************************************/
 
 /* MOTD */
-.motd {color: #a4bad6;	font-family: Verdana, sans-serif;}
-.motd h1, .motd h2, .motd h3, .motd h4, .motd h5, .motd h6 {color: #a4bad6;	text-decoration: underline;}
-.motd a, .motd a:link, .motd a:visited, .motd a:active, .motd a:hover {color: #a4bad6;}
+.motd {color: #638500;	font-family: Verdana, sans-serif;}
+.motd h1, .motd h2, .motd h3, .motd h4, .motd h5, .motd h6 {color: #638500;	text-decoration: underline;}
+.motd a, .motd a:link, .motd a:visited, .motd a:active, .motd a:hover {color: #638500;}
 
 /* ADD HERE FOR BOLD */
 .bold, .name, .prefix, .ooc, .looc, .adminooc, .admin, .medal, .yell {font-weight: bold;}
@@ -259,91 +255,91 @@ a.popt {text-decoration: none;}
 /* OUTPUT COLORS */
 .highlight {background: yellow;}
 
-h1, h2, h3, h4, h5, h6	{color: #a4bad6;font-family: Georgia, Verdana, sans-serif;}
-h1.alert, h2.alert		{color: #a4bad6;}
+h1, h2, h3, h4, h5, h6	{color: #0000ff;font-family: Georgia, Verdana, sans-serif;}
+h1.alert, h2.alert		{color: #000000;}
 
 em						{font-style: normal;	font-weight: bold;}
 
-.ooc					{color: #cca300;	font-weight: bold;}
-.looc					{color: #d8b555;	font-weight: bold;}
-.antagooc				{color: #ce254f;	font-weight: bold;}
+.ooc					{color: #002eb8;	font-weight: bold;}
+.looc					{color: #6699CC;	font-weight: bold;}
+.antagooc				{color: #b8002e;	font-weight: bold;}
 .adminobserverooc		{color: #0099cc;	font-weight: bold;}
-.adminooc				{color: #3d5bc3;	font-weight: bold;}
+.adminooc				{color: #700038;	font-weight: bold;}
 
-.adminsay   			{color: #ff4500;	font-weight: bold;}
-.admin					{color: #5975da;	font-weight: bold;}
+.adminsay   			{color: #FF4500}
+.admin					{color: #386aff;	font-weight: bold;}
 
 .name					{					font-weight: bold;}
 
 .say					{}
-.deadsay				{color: #e2c1ff;}
+.deadsay				{color: #5c00e6;}
 .binarysay    			{color: #20c20e; background-color: #000000; display: block;}
 .binarysay a  			{color: #00ff00;}
 .binarysay a:active, .binarysay a:visited {color: #88ff88;}
-.radio					{color: #1ecc43;}
-.sciradio				{color: #c68cfa;}
-.comradio				{color: #5177ff;}
-.secradio				{color: #dd3535;}
-.medradio				{color: #57b8f0;}
-.engradio				{color: #f37746;}
-.suppradio				{color: #b88646;}
-.servradio				{color: #6ca729;}
-.syndradio				{color: #8f4a4b;}
-.centcomradio			{color: #2681a5;}
-.aiprivradio			{color: #d65d95;}
-.redteamradio           {color: #ff4444;}
-.blueteamradio          {color: #3434fd;}
+.radio					{color: #008000;}
+.sciradio				{color: #993399;}
+.comradio				{color: #948f02;}
+.secradio				{color: #a30000;}
+.medradio				{color: #337296;}
+.engradio				{color: #fb5613;}
+.suppradio				{color: #a8732b;}
+.servradio				{color: #6eaa2c;}
+.syndradio				{color: #6d3f40;}
+.centcomradio			{color: #686868;}
+.aiprivradio			{color: #ff00ff;}
+.redteamradio           {color: #ff0000;}
+.blueteamradio          {color: #0000ff;}
 
 .yell					{					font-weight: bold;}
 
-.alert					{color: #d82020;}
-h1.alert, h2.alert		{color: #99aab5;}
+.alert					{color: #ff0000;}
+h1.alert, h2.alert		{color: #000000;}
 
 .emote					{					font-style: italic;}
 .selecteddna			{color: #ffffff; 	background-color: #001B1B}
 
-.attack					{color: #e01c1c;}
-.disarm					{color: #b42525;}
-.passive				{color: #a00f0f;}
+.attack					{color: #ff0000;}
+.disarm					{color: #990000;}
+.passive				{color: #660000;}
 
-.userdanger				{color: #c51e1e;	font-weight: bold; font-size: 24px;}
-.danger					{color: #c51e1e;}
-.warning				{color: #c51e1e;	font-style: italic;}
+.userdanger				{color: #ff0000;	font-weight: bold; font-size: 24px;}
+.danger					{color: #ff0000;}
+.warning				{color: #ff0000;	font-style: italic;}
 .alertwarning			{color: #FF0000;    font-weight: bold}
-.boldwarning			{color: #c51e1e;	font-style: italic;	font-weight: bold}
-.announce 				{color: #c51e1e;	font-weight: bold;}
-.boldannounce			{color: #c51e1e;	font-weight: bold;}
-.greenannounce			{color: #059223;	font-weight: bold;}
+.boldwarning			{color: #ff0000;	font-style: italic;	font-weight: bold}
+.announce 				{color: #228b22;	font-weight: bold;}
+.boldannounce			{color: #ff0000;	font-weight: bold;}
+.greenannounce			{color: #00ff00;	font-weight: bold;}
 .rose					{color: #ff5050;}
-.info					{color: #6685f5;}
-.notice					{color: #6685f5;}
-.boldnotice				{color: #6685f5;	font-weight: bold;}
-.adminnotice			{color: #6685f5;}
+.info					{color: #0000CC;}
+.notice					{color: #000099;}
+.boldnotice				{color: #000099;	font-weight: bold;}
+.adminnotice			{color: #0000ff;}
 .adminhelp              {color: #ff0000;    font-weight: bold;}
-.unconscious			{color: #a4bad6;	font-weight: bold;}
+.unconscious			{color: #0000ff;	font-weight: bold;}
 .suicide				{color: #ff5050;	font-style: italic;}
-.red					{color: #FF0000}
-.pink					{color: #ff70c1;}
-.blue					{color: #215cff}
-.green				{color: #059223;}
-.nicegreen				{color: #059223;}
-.userlove				{color: #ff42a6;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #82365e;}
-.love					{color: #ff4591;	font-style: italic;	text-shadow: 0 0 6px #994449;}
-.shadowling			{color: #8e8a99;}
-.cult					{color: #aa1c1c;}
+.green					{color: #03ff39;}
+.red					{color: #FF0000;}
+.pink					{color: #FF69Bf;}
+.blue					{color: #0000FF;}
+.nicegreen				{color: #14a833;}
+.userlove				{color: #FF1493;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #ff6dbc;}
+.love					{color: #ff006a;	font-style: italic;	text-shadow: 0 0 6px #ff6d6d;}
+.shadowling				{color: #3b2769;}
+.cult					{color: #960000;}
 
-.cultitalic				{color: #aa1c1c;	font-style: italic;}
-.cultbold				{color: #aa1c1c; font-style: italic; font-weight: bold;}
-.cultboldtalic				{color: #aa1c1c; font-weight: bold; font-size: 24px;}
+.cultitalic				{color: #960000;	font-style: italic;}
+.cultbold				{color: #960000; font-style: italic; font-weight: bold;}
+.cultboldtalic			{color: #960000; font-weight: bold; font-size: 24px;}
 
-.cultlarge				{color: #aa1c1c; font-weight: bold; font-size: 24px;}
-.narsie					{color: #aa1c1c; font-weight: bold; font-size: 120px;}
-.narsiesmall			{color: #aa1c1c; font-weight: bold; font-size: 48px;}
+.cultlarge				{color: #960000; font-weight: bold; font-size: 24px;}
+.narsie					{color: #960000; font-weight: bold; font-size: 120px;}
+.narsiesmall			{color: #960000; font-weight: bold; font-size: 48px;}
 .colossus				{color: #7F282A; font-size: 40px;}
-.hierophant				{color: #b441ee; font-weight: bold; font-style: italic;}
-.hierophant_warning		{color: #c56bf1; font-style: italic;}
-.purple					{color: #9956d3;}
-.holoparasite			{color: #88809c;}
+.hierophant				{color: #660099; font-weight: bold; font-style: italic;}
+.hierophant_warning		{color: #660099; font-style: italic;}
+.purple					{color: #5e2d79;}
+.holoparasite			{color: #35333a;}
 
 .revennotice			{color: #1d2953;}
 .revenboldnotice		{color: #1d2953;	font-weight: bold;}
@@ -351,11 +347,11 @@ h1.alert, h2.alert		{color: #99aab5;}
 .revenminor				{color: #823abb}
 .revenwarning			{color: #760fbb;	font-style: italic;}
 .revendanger			{color: #760fbb;	font-weight: bold; font-size: 24px;}
-.umbra					{color: #7c00e6;}
-.umbra_emphasis			{color: #7c00e6;	font-weight: bold;	font-style: italic;}
-.umbra_large			{color: #7c00e6; font-size: 24px; font-weight: bold; font-style: italic;}
+.umbra					{color: #5000A0;}
+.umbra_emphasis			{color: #5000A0;	font-weight: bold;	font-style: italic;}
+.umbra_large			{color: #5000A0; font-size: 24px; font-weight: bold; font-style: italic;}
 
-.deconversion_message	{color: #a947ff; font-size: 24px; font-style: italic;}
+.deconversion_message	{color: #5000A0; font-size: 24px; font-style: italic;}
 
 .brass					{color: #BE8700;}
 .heavy_brass			{color: #BE8700; font-weight: bold; font-style: italic;}
@@ -380,17 +376,17 @@ h1.alert, h2.alert		{color: #99aab5;}
 .neovgre				{color: #6E001A; font-weight: bold; font-style: italic;}
 .neovgre_small			{color: #6E001A;}
 
-.newscaster				{color: #c05d5d;}
-.ghostalert				{color: #6600ff;	font-style: italic; font-weight: bold;}
+.newscaster				{color: #800000;}
+.ghostalert				{color: #5c00e6;	font-style: italic; font-weight: bold;}
 
-.alien					{color: #855d85;}
-.noticealien			{color: #059223;}
-.alertalien				{color: #059223;	font-weight: bold;}
-.changeling				{color: #059223;	font-style: italic;}
+.alien					{color: #543354;}
+.noticealien			{color: #00c000;}
+.alertalien				{color: #00c000;	font-weight: bold;}
+.changeling				{color: #800080;	font-style: italic;}
 
-.spider					{color: #8800ff;}
+.spider					{color: #4d004d;}
 
-.interface				{color: #750e75;}
+.interface				{color: #330033;}
 
 .sans					{font-family: "Comic Sans MS", cursive, sans-serif;}
 .papyrus				{font-family: "Papyrus", cursive, sans-serif;}
@@ -401,29 +397,54 @@ h1.alert, h2.alert		{color: #99aab5;}
 .big					{font-size: 24px;}
 .reallybig				{font-size: 32px;}
 .extremelybig			{font-size: 40px;}
-.greentext				{color: #059223;	font-size: 24px;}
-.redtext				{color: #c51e1e;	font-size: 24px;}
-.clown					{color: #ff70c1;	font-size: 24px; font-family: "Comic Sans MS", cursive, sans-serif; font-weight: bold;}
+.greentext				{color: #00FF00;	font-size: 24px;}
+.redtext				{color: #FF0000;	font-size: 24px;}
+.clown					{color: #FF69Bf;	font-size: 24px; font-family: "Comic Sans MS", cursive, sans-serif; font-weight: bold;}
 .his_grace				{color: #15D512;	font-family: "Courier New", cursive, sans-serif; font-style: italic;}
+.velvet					{color: #660015; 	font-weight: bold; animation: velvet 5000ms infinite;}
+@keyframes velvet {
+	0% { color: #400020; }
+	40% { color: #FF0000; }
+	50% { color: #FF8888; }
+	60% { color: #FF0000; }
+	100% { color: #400020; }
+}
+
+.hypnophrase			{color: #202020;	font-weight: bold; animation: hypnocolor 1500ms infinite;}
+@keyframes hypnocolor {
+	0% { color: #202020; }
+	25% { color: #4b02ac; }
+	50% { color: #9f41f1; }
+	75% { color: #541c9c; }
+	100% { color: #7adbf3; }
+}
+
+.phobia			{color: #dd0000;	font-weight: bold; animation: phobia 750ms infinite;}
+@keyframes phobia {
+	0% { color: #f75a5a; }
+	50% { color: #dd0000; }
+	100% { color: #f75a5a; }
+}
+
 
 .icon 					{height: 1em;	width: auto;}
 
 .memo					{color: #638500;	text-align: center;}
 .memoedit				{text-align: center;	font-size: 16px;}
-.abductor				{color: #c204c2; font-style: italic;}
-.mind_control			{color: #df3da9; font-size: 3; font-weight: bold; font-style: italic;}
+.abductor				{color: #800080; font-style: italic;}
+.mind_control			{color: #A00D6F; font-size: 3; font-weight: bold; font-style: italic;}
 .slime					{color: #00CED1;}
 .drone					{color: #848482;}
 .monkey					{color: #975032;}
 .swarmer				{color: #2C75FF;}
 .resonate				{color: #298F85;}
 
-.monkeyhive				{color: #a56408;}
-.monkeylead				{color: #af6805;	font-size: 2;}
+.monkeyhive				{color: #774704;}
+.monkeylead				{color: #774704;	font-size: 2;}
 
 .connectionClosed, .fatalError {background: red; color: white; padding: 5px;}
 .connectionClosed.restored {background: green;}
-.internal.boldnshit {color: #3d5bc3; font-weight: bold;}
+.internal.boldnshit {color: #000099; font-weight: bold;}
 
 /* HELPER CLASSES */
 .text-normal {font-weight: normal; font-style: normal;}
diff --git a/code/modules/goonchat/browserassets/css/browserOutput_dark.css b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
new file mode 100644
index 0000000000..7d04748847
--- /dev/null
+++ b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
@@ -0,0 +1,155 @@
+html, body {color: #E0E0E0;}
+body {
+	background: #171717;
+	font-color: #E0E0E0;
+	scrollbar-face-color:#1A1A1A;
+	scrollbar-track-color:#171717;
+	scrollbar-highlight-color:#171717;
+}
+
+a {color: #397ea5;}
+a.visited {color: #7c00e6;}
+a:visited {color: #7c00e6;}
+
+#newMessages {background: #242424;}
+#newMessages:hover {background: #272727;}
+
+#ping {background: #171717;}
+
+#userBar .subCell {
+	background: #272727;
+	 border-top: 1px solid #171717;
+}
+#userBar .subCell:hover {background: #272727;}
+#userBar .toggle {background: #272727;}
+
+/* MOTD */
+.motd {color: #E0E0E0;	font-family: Verdana, sans-serif;}
+.motd h1, .motd h2, .motd h3, .motd h4, .motd h5, .motd h6 {color: #E0E0E0;	text-decoration: underline;}
+.motd a, .motd a:link, .motd a:visited, .motd a:active, .motd a:hover {color: #E0E0E0;}
+
+h1, h2, h3, h4, h5, h6	{color: #E0E0E0;font-family: Georgia, Verdana, sans-serif;}
+h1.alert, h2.alert		{color: #E0E0E0;}
+
+.ooc					{color: #cca300;	font-weight: bold;}
+.looc					{color: #d8b555;	font-weight: bold;}
+.antagooc				{color: #ce254f;	font-weight: bold;}
+.adminobserverooc		{color: #0099cc;	font-weight: bold;}
+.adminooc				{color: #3d5bc3;	font-weight: bold;}
+
+.admin					{color: #5975da;	font-weight: bold;}
+
+.deadsay				{color: #e2c1ff;}
+.radio					{color: #1ecc43;}
+.sciradio				{color: #c68cfa;}
+.comradio				{color: #5177ff;}
+.secradio				{color: #dd3535;}
+.medradio				{color: #57b8f0;}
+.engradio				{color: #f37746;}
+.suppradio				{color: #b88646;}
+.servradio				{color: #6ca729;}
+.syndradio				{color: #8f4a4b;}
+.centcomradio			{color: #2681a5;}
+.aiprivradio			{color: #d65d95;}
+.redteamradio           {color: #ff4444;}
+.blueteamradio          {color: #3434fd;}
+
+.alert					{color: #d82020;}
+h1.alert, h2.alert		{color: #99aab5;}
+
+.attack					{color: #e01c1c;}
+.disarm					{color: #b42525;}
+.passive				{color: #a00f0f;}
+
+.userdanger				{color: #c51e1e;	font-weight: bold; font-size: 24px;}
+.danger					{color: #c51e1e;}
+.warning				{color: #c51e1e;	font-style: italic;}
+.alertwarning			{color: #c51e1e;    font-weight: bold}
+.boldwarning			{color: #c51e1e;	font-style: italic;	font-weight: bold}
+.announce 				{color: #c51e1e;	font-weight: bold;}
+.boldannounce			{color: #c51e1e;	font-weight: bold;}
+.greenannounce			{color: #059223;	font-weight: bold;}
+.info					{color: #6685f5;}
+.notice					{color: #6685f5;}
+.boldnotice				{color: #6685f5;	font-weight: bold;}
+.adminnotice			{color: #6685f5;}
+.adminhelp              {color: #ff0000;    font-weight: bold;}
+.unconscious			{color: #E0E0E0;	font-weight: bold;}
+.red					{color: #FF0000}
+.pink					{color: #ff70c1;}
+.blue					{color: #215cff}
+.green					{color: #059223;}
+.nicegreen				{color: #059223;}
+.userlove				{color: #ff42a6;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #82365e;}
+.love					{color: #ff4591;	font-style: italic;	text-shadow: 0 0 6px #994449;}
+.shadowling				{color: #8e8a99;}
+.cult					{color: #aa1c1c;}
+
+.cultitalic				{color: #aa1c1c;	font-style: italic;}
+.cultbold				{color: #aa1c1c; font-style: italic; font-weight: bold;}
+.cultboldtalic			{color: #aa1c1c; font-weight: bold; font-size: 24px;}
+
+.cultlarge				{color: #aa1c1c; font-weight: bold; font-size: 24px;}
+.narsie					{color: #aa1c1c; font-weight: bold; font-size: 120px;}
+.narsiesmall			{color: #aa1c1c; font-weight: bold; font-size: 48px;}
+.hierophant				{color: #b441ee; font-weight: bold; font-style: italic;}
+.hierophant_warning		{color: #c56bf1; font-style: italic;}
+.purple					{color: #9956d3;}
+.holoparasite			{color: #88809c;}
+
+.revennotice			{color: #3645aa;}
+.revenboldnotice		{color: #3645aa;	font-weight: bold;}
+.revenbignotice			{color: #3645aa;	font-weight: bold; font-size: 24px;}
+.revenminor				{color: #823ddd}
+.revenwarning			{color: #8911d9;	font-style: italic;}
+.revendanger			{color: #8911d9;	font-weight: bold; font-size: 24px;}
+.umbra					{color: #7c00e6;}
+.umbra_emphasis			{color: #7c00e6;	font-weight: bold;	font-style: italic;}
+.umbra_large			{color: #7c00e6; font-size: 24px; font-weight: bold; font-style: italic;}
+
+.deconversion_message	{color: #a947ff; font-size: 24px; font-style: italic;}
+
+.alloy					{color: #545b64;}
+.heavy_alloy			{color: #545b64; font-weight: bold; font-style: italic;}
+.nezbere_large			{color: #545b64; font-size: 24px; font-weight: bold; font-style: italic;}
+.nezbere				{color: #545b64; font-weight: bold; font-style: italic;}
+.nezbere_small			{color: #545b64;}
+.inathneq_large			{color: #1d7dc7; font-size: 24px; font-weight: bold; font-style: italic;}
+.inathneq				{color: #1d7dc7; font-weight: bold; font-style: italic;}
+.inathneq_small			{color: #1d7dc7;}
+.neovgre_large			{color: #7c0622; font-size: 24px; font-weight: bold; font-style: italic;}
+.neovgre				{color: #7c0622; font-weight: bold; font-style: italic;}
+.neovgre_small			{color: #7c0622;}
+
+.newscaster				{color: #c05d5d;}
+.ghostalert				{color: #6600ff;	font-style: italic; font-weight: bold;}
+
+.alien					{color: #855d85;}
+.noticealien			{color: #059223;}
+.alertalien				{color: #059223;	font-weight: bold;}
+.changeling				{color: #059223;	font-style: italic;}
+
+.spider					{color: #8800ff;}
+
+.interface				{color: #750e75;}
+
+.greentext				{color: #059223;	font-size: 24px;}
+.redtext				{color: #c51e1e;	font-size: 24px;}
+.clown					{color: #ff70c1;	font-size: 24px; font-family: "Comic Sans MS", cursive, sans-serif; font-weight: bold;}
+.velvet					{color: #660015; 	font-weight: bold; animation: velvet 5000ms infinite;}
+@keyframes velvet {
+	0% { color: #890020; }
+	40% { color: #c51e1e; }
+	50% { color: #FF8888; }
+	60% { color: #c51e1e; }
+	100% { color: #890020; }
+}
+
+.abductor				{color: #c204c2; font-style: italic;}
+.mind_control			{color: #df3da9; font-size: 3; font-weight: bold; font-style: italic;}
+.drone					{color: #979795;}
+
+.monkeyhive				{color: #a56408;}
+.monkeylead				{color: #af6805;	font-size: 2;}
+
+.internal.boldnshit {color: #3d5bc3; font-weight: bold;}
diff --git a/code/modules/goonchat/browserassets/css/browserOutput_white.css b/code/modules/goonchat/browserassets/css/browserOutput_light.css
similarity index 58%
rename from code/modules/goonchat/browserassets/css/browserOutput_white.css
rename to code/modules/goonchat/browserassets/css/browserOutput_light.css
index 3050ccf611..098bd25367 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput_white.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput_light.css
@@ -1,236 +1,18 @@
-/*****************************************
-*
-* GLOBAL STYLES
-*
-******************************************/
-html, body {
-	padding: 0;
-	margin: 0;
-	height: 100%;
-	color: #000000;
-}
-body {
-	background: #f0f0f0;
-    font-family: Verdana, sans-serif;
-    font-size: 9pt;
-    line-height: 1.2;
-	overflow-x: hidden;
-	overflow-y: scroll;
-	word-wrap: break-word;
-}
+body {background: #F1F1F1;}
 
-em {
-	font-style: normal;
-	font-weight: bold;
-}
+#newMessages {background: #ddd;}
+#ping {background: #ddd;}
 
-img {
-	margin: 0;
-	padding: 0;
-	line-height: 1;
-	-ms-interpolation-mode: nearest-neighbor;
-	image-rendering: pixelated;
-}
-img.icon {
-	height: 1em;
-	min-height: 16px;
-	width: auto;
-	vertical-align: bottom;
-}
-
-
-.r:before { /* "repeated" badge class for combined messages */
-	content: 'x';
-}
-.r {
-	display: inline-block;
-	min-width: 0.5em;
-	font-size: 0.7em;
-	padding: 0.2em 0.3em;
-	line-height: 1;
-	color: white;
-	text-align: center;
-	white-space: nowrap;
-	vertical-align: middle;
-	background-color: crimson;
-	border-radius: 10px;
-}
-
-a {color: #0000ff;}
-a.visited {color: #ff00ff;}
-a:visited {color: #ff00ff;}
-a.popt {text-decoration: none;}
-
-/*****************************************
-*
-* OUTPUT NOT RELATED TO ACTUAL MESSAGES
-*
-******************************************/
-#loading {
-	position: fixed;
-	width: 300px;
-	height: 150px;
-	text-align: center;
-	left: 50%;
-	top: 50%;
-	margin: -75px 0 0 -150px;
-}
-#loading i {display: block; padding-bottom: 3px;}
-
-#messages {
-	font-size: 13px;
-	padding: 3px;
-	margin: 0;
-	word-wrap: break-word;
-}
-#newMessages {
-	position: fixed;
-	display: block;
-	bottom: 0;
-	right: 0;
-	padding: 8px;
-	background: #ddd;
-	text-decoration: none;
-    font-variant: small-caps;
-    font-size: 1.1em;
-    font-weight: bold;
-	color: #333;
-}
-#newMessages:hover {background: #ccc;}
-#newMessages i {vertical-align: middle; padding-left: 3px;}
-#ping {
-	position: fixed;
-	top: 0;
-	right: 115px;
-	width: 45px;
-	background: #ddd;
-	height: 30px;
-	padding: 8px 0 2px 0;
-}
-#ping i {display: block; text-align: center;}
-#ping .ms {
-	display: block;
-	text-align: center;
-	font-size: 8pt;
-	padding-top: 2px;
-}
-#userBar {
-	position: fixed;
-	top: 0;
-	right: 0;
-}
-#userBar .subCell {
-	background: #ddd;
-    height: 30px;
-	padding: 5px 0;
-	display: block;
-	color: #333;
-	text-decoration: none;
-    line-height: 28px;
-    border-top: 1px solid #b4b4b4;
-}
-#userBar .subCell:hover {background: #ccc;}
-#userBar .toggle {
-	width: 40px;
-    background: #ccc;
-    border-top: 0;
-    float: right;
-    text-align: center;
-}
-#userBar .sub {clear: both; display: none; width: 160px;}
-#userBar .sub.scroll {overflow-y: scroll;}
-#userBar .sub.subCell {padding: 3px 0 3px 8px; line-height: 30px; font-size: 0.9em; clear: both;}
-#userBar .sub span {
-	display: block;
-	line-height: 30px;
-	float: left;
-}
-#userBar .sub i {
-	display: block;
-	padding: 0 5px;
-	font-size: 1.1em;
-	width: 22px;
-	text-align: center;
-	line-height: 30px;
-	float: right;
-}
-#userBar .sub input {
-	position: absolute;
-	padding: 7px 5px;
-	width: 121px;
-	line-height: 30px;
-	float: left;
-}
-#userBar .topCell {border-top: 0;}
+#userBar .subCell {background: #ddd;}
 
 /* POPUPS */
-.popup {
-	position: fixed;
-	top: 50%;
-	left: 50%;
-	background: #ddd;
-}
-.popup .close {
-	position: absolute;
-	background: #aaa;
-	top: 0;
-	right: 0;
-	color: #333;
-	text-decoration: none;
-	z-index: 2;
-	padding: 0 10px;
-	height: 30px;
-	line-height: 30px;
-}
-.popup .close:hover {background: #999;}
-.popup .head {
-	background: #999;
-	color: #ddd;
-	padding: 0 10px;
-	height: 30px;
-	line-height: 30px;
-	text-transform: uppercase;
-	font-size: 0.9em;
-	font-weight: bold;
-	border-bottom: 2px solid green;
-}
-.popup input {border: 1px solid #999; background: #fff; margin: 0; padding: 5px; outline: none; color: #333;}
-.popup input[type=text]:hover, .popup input[type=text]:active, .popup input[type=text]:focus {border-color: green;}
-.popup input[type=submit] {padding: 5px 10px; background: #999; color: #ddd; text-transform: uppercase; font-size: 0.9em; font-weight: bold;}
-.popup input[type=submit]:hover, .popup input[type=submit]:focus, .popup input[type=submit]:active {background: #aaa; cursor: pointer;}
-
-.changeFont {padding: 10px;}
-.changeFont a {display: block; text-decoration: none; padding: 3px; color: #333;}
-.changeFont a:hover {background: #ccc;}
-
-.highlightPopup {padding: 10px; text-align: center;}
-.highlightPopup input[type=text] {display: block; width: 215px; text-align: left; margin-top: 5px;}
-.highlightPopup input.highlightColor {background-color: #FFFF00;}
-.highlightPopup input.highlightTermSubmit {margin-top: 5px;}
+.popup {background: #ddd;}
+.popup .head {color: #ddd;}
+.popup input[type=submit] {color: #ddd;}
 
 /* ADMIN CONTEXT MENU */
-.contextMenu {
-	background-color: #ddd;
-	position: fixed;
-	margin: 2px;
-	width: 150px;
-}
-.contextMenu a {
-	display: block;
-	padding: 2px 5px;
-	text-decoration: none;
-	color: #333;
-}
+.contextMenu {background-color: #ddd;}
 
-.contextMenu a:hover {
-	background-color: #ccc;
-}
-
-/* ADMIN FILTER MESSAGES MENU */
-.filterMessages {padding: 5px;}
-.filterMessages div {padding: 2px 0;}
-.filterMessages input {}
-.filterMessages label {}
 
 .icon-stack {height: 1em; line-height: 1em; width: 1em; vertical-align: middle; margin-top: -2px;}
 
@@ -266,8 +48,8 @@ em						{font-style: normal;	font-weight: bold;}
 .adminobserverooc		{color: #0099cc;	font-weight: bold;}
 .adminooc				{color: #700038;	font-weight: bold;}
 
-.adminsay   			{color: #ff4500;	font-weight: bold;}
-.admin					{color: #4473ff;	font-weight: bold;}
+.adminsay   			{color: #FF4500}
+.admin					{color: #386aff;	font-weight: bold;}
 
 .name					{					font-weight: bold;}
 
@@ -305,7 +87,7 @@ h1.alert, h2.alert		{color: #000000;}
 .userdanger				{color: #ff0000;	font-weight: bold; font-size: 24px;}
 .danger					{color: #ff0000;}
 .warning				{color: #ff0000;	font-style: italic;}
-.alertwarning           	{color: #FF0000;    font-weight: bold}
+.alertwarning			{color: #FF0000;    font-weight: bold}
 .boldwarning			{color: #ff0000;	font-style: italic;	font-weight: bold}
 .announce 				{color: #228b22;	font-weight: bold;}
 .boldannounce			{color: #ff0000;	font-weight: bold;}
@@ -318,10 +100,10 @@ h1.alert, h2.alert		{color: #000000;}
 .adminhelp              {color: #ff0000;    font-weight: bold;}
 .unconscious			{color: #0000ff;	font-weight: bold;}
 .suicide				{color: #ff5050;	font-style: italic;}
-.green				{color: #03ff39;}
-.red					{color: #FF0000}
+.green					{color: #03ff39;}
+.red					{color: #FF0000;}
 .pink					{color: #FF69Bf;}
-.blue					{color: #0000FF}
+.blue					{color: #0000FF;}
 .nicegreen				{color: #14a833;}
 .userlove				{color: #FF1493;	font-style: italic; font-weight: bold;	text-shadow: 0 0 6px #ff6dbc;}
 .love					{color: #ff006a;	font-style: italic;	text-shadow: 0 0 6px #ff6d6d;}
@@ -330,7 +112,7 @@ h1.alert, h2.alert		{color: #000000;}
 
 .cultitalic				{color: #960000;	font-style: italic;}
 .cultbold				{color: #960000; font-style: italic; font-weight: bold;}
-.cultboldtalic				{color: #960000; font-weight: bold; font-size: 24px;}
+.cultboldtalic			{color: #960000; font-weight: bold; font-size: 24px;}
 
 .cultlarge				{color: #960000; font-weight: bold; font-size: 24px;}
 .narsie					{color: #960000; font-weight: bold; font-size: 120px;}
@@ -401,13 +183,38 @@ h1.alert, h2.alert		{color: #000000;}
 .redtext				{color: #FF0000;	font-size: 24px;}
 .clown					{color: #FF69Bf;	font-size: 24px; font-family: "Comic Sans MS", cursive, sans-serif; font-weight: bold;}
 .his_grace				{color: #15D512;	font-family: "Courier New", cursive, sans-serif; font-style: italic;}
+.velvet					{color: #660015; 	font-weight: bold; animation: velvet 5000ms infinite;}
+@keyframes velvet {
+	0% { color: #400020; }
+	40% { color: #FF0000; }
+	50% { color: #FF8888; }
+	60% { color: #FF0000; }
+	100% { color: #400020; }
+}
+
+.hypnophrase			{color: #202020;	font-weight: bold; animation: hypnocolor 1500ms infinite;}
+@keyframes hypnocolor {
+	0% { color: #202020; }
+	25% { color: #4b02ac; }
+	50% { color: #9f41f1; }
+	75% { color: #541c9c; }
+	100% { color: #7adbf3; }
+}
+
+.phobia			{color: #dd0000;	font-weight: bold; animation: phobia 750ms infinite;}
+@keyframes phobia {
+	0% { color: #f75a5a; }
+	50% { color: #dd0000; }
+	100% { color: #f75a5a; }
+}
+
 
 .icon 					{height: 1em;	width: auto;}
 
 .memo					{color: #638500;	text-align: center;}
 .memoedit				{text-align: center;	font-size: 16px;}
 .abductor				{color: #800080; font-style: italic;}
-.mind_control				{color: #A00D6F; font-size: 3; font-weight: bold; font-style: italic;}
+.mind_control			{color: #A00D6F; font-size: 3; font-weight: bold; font-style: italic;}
 .slime					{color: #00CED1;}
 .drone					{color: #848482;}
 .monkey					{color: #975032;}
@@ -419,9 +226,8 @@ h1.alert, h2.alert		{color: #000000;}
 
 .connectionClosed, .fatalError {background: red; color: white; padding: 5px;}
 .connectionClosed.restored {background: green;}
-.internal.boldnshit {color: blue; font-weight: bold;}
+.internal.boldnshit {color: #000099; font-weight: bold;}
 
 /* HELPER CLASSES */
 .text-normal {font-weight: normal; font-style: normal;}
 .hidden {display: none; visibility: hidden;}
-
diff --git a/code/modules/goonchat/browserassets/html/browserOutput.html b/code/modules/goonchat/browserassets/html/browserOutput.html
index 9c6d462a85..68da251702 100644
--- a/code/modules/goonchat/browserassets/html/browserOutput.html
+++ b/code/modules/goonchat/browserassets/html/browserOutput.html
@@ -5,8 +5,9 @@
 	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 	<link rel="stylesheet" type="text/css" href="font-awesome.css" />
-	<link id="sheetofstyles" rel="stylesheet" type="text/css" href="browserOutput_white.css" />
+	<link rel="stylesheet" type="text/css" href="browserOutput.css" />
 	<link rel="stylesheet" type="text/css" href="spritesheet_chat.css" />
+	<link rel="stylesheet" type="text/css" id="colorPresetLink"/>
 	<script type="text/javascript" src="errorHandler.js"></script>
 	<script type="text/javascript" src="jquery.min.js"></script>
 	<script type="text/javascript" src="json2.min.js"></script>
@@ -29,7 +30,7 @@
 			<span class="ms" id="pingMs">--ms</span>
 		</div>
 		<div id="darkmodething">
-			<a href="#" class="subCell toggle" id="darkmodetoggle" title="Darkmode"><i class="icon-adjust"></i></a>
+			<a href="#" class="subCell toggle" id="changeColorPreset" title="Change color preset"><i class="icon-eye-open"></i></a>
 		</div>
 		<div id="audio">
 			<a href="#" class="subCell toggle" id="toggleAudio" title="Audio"><i class="icon-volume-up"></i></a>
diff --git a/code/modules/goonchat/browserassets/js/browserOutput.js b/code/modules/goonchat/browserassets/js/browserOutput.js
index 93a498fd06..b6fdf2c276 100644
--- a/code/modules/goonchat/browserassets/js/browserOutput.js
+++ b/code/modules/goonchat/browserassets/js/browserOutput.js
@@ -35,7 +35,7 @@ var opts = {
 	'wasd': false, //Is the user in wasd mode?
 	'priorChatHeight': 0, //Thing for height-resizing detection
 	'restarting': false, //Is the round restarting?
-	'darkmode':false, //Are we using darkmode? If not WHY ARE YOU LIVING IN 2009???
+	'colorPreset': 0, 	// index in the color presets list.
 
 	//Options menu
 	'selectedSubLoop': null, //Contains the interval loop for closing the selected sub menu
@@ -73,6 +73,14 @@ var opts = {
 
 };
 
+// Array of names for chat display color presets.
+// If not set to normal, a CSS file `browserOutput_${name}.css` will be added to the head.
+var colorPresets = [
+	'normal',
+	'light',
+	'dark'
+]
+
 function clamp(val, min, max) {
 	return Math.max(min, Math.min(val, max))
 }
@@ -96,6 +104,12 @@ if (typeof String.prototype.trim !== 'function') {
 	};
 }
 
+function updateColorPreset() {
+	var el = $("#colorPresetLink")[0];
+	el.href = "browserOutput_"+colorPresets[opts.colorPreset]+".css";
+	runByond('?_src_=chat&proc=colorPresetPost&preset='+colorPresets[opts.colorPreset]);
+}
+
 // Linkify the contents of a node, within its parent.
 function linkify(parent, insertBefore, text) {
 	var start = 0;
@@ -395,19 +409,6 @@ function toHex(n) {
 	return "0123456789ABCDEF".charAt((n-n%16)/16) + "0123456789ABCDEF".charAt(n%16);
 }
 
-function swap() { //Swap to darkmode
-	if (opts.darkmode){
-		document.getElementById("sheetofstyles").href = "browserOutput_white.css";
-		opts.darkmode = false;
-		runByond('?_src_=chat&proc=swaptolightmode');
-	} else {
-		document.getElementById("sheetofstyles").href = "browserOutput.css";
-		opts.darkmode = true;
-		runByond('?_src_=chat&proc=swaptodarkmode');
-	}
-	setCookie('darkmode', (opts.darkmode ? 'true' : 'false'), 365);
-}
-
 function handleClientData(ckey, ip, compid) {
 	//byond sends player info to here
 	var currentData = {'ckey': ckey, 'ip': ip, 'compid': compid};
@@ -615,7 +616,7 @@ $(function() {
 		'shighlightColor': getCookie('highlightcolor'),
 		'smusicVolume': getCookie('musicVolume'),
 		'smessagecombining': getCookie('messagecombining'),
-		'sdarkmode': getCookie('darkmode'),
+		'scolorPreset': getCookie('colorpreset'),
 	};
 
 	if (savedConfig.sfontSize) {
@@ -626,9 +627,6 @@ $(function() {
 		$("body").css('line-height', savedConfig.slineHeight);
 		internalOutput('<span class="internal boldnshit">Loaded line height setting of: '+savedConfig.slineHeight+'</span>', 'internal');
 	}
-	if(savedConfig.sdarkmode == 'true'){
-		swap();
-	}
 	if (savedConfig.spingDisabled) {
 		if (savedConfig.spingDisabled == 'true') {
 			opts.pingDisabled = true;
@@ -654,6 +652,13 @@ $(function() {
 		opts.highlightColor = savedConfig.shighlightColor;
 		internalOutput('<span class="internal boldnshit">Loaded highlight color of: '+savedConfig.shighlightColor+'</span>', 'internal');
 	}
+
+	if (savedConfig.scolorPreset) {
+		opts.colorPreset = Number(savedConfig.scolorPreset);
+		updateColorPreset();
+		internalOutput('<span class="internal boldnshit">Loaded color preset of: '+colorPresets[opts.colorPreset]+'</span>', 'internal');
+	}
+
 	if (savedConfig.smusicVolume) {
 		var newVolume = clamp(savedConfig.smusicVolume, 0, 100);
 		$('#adminMusic').prop('volume', newVolume / 100);
@@ -839,9 +844,6 @@ $(function() {
 	$('#toggleOptions').click(function(e) {
 		handleToggleClick($subOptions, $(this));
 	});
-	$('#darkmodetoggle').click(function(e) {
-		swap();
-	});
 	$('#toggleAudio').click(function(e) {
 		handleToggleClick($subAudio, $(this));
 	});
@@ -992,6 +994,13 @@ $(function() {
 		opts.messageCount = 0;
 	});
 	
+	$('#changeColorPreset').click(function() {
+		opts.colorPreset = (opts.colorPreset+1) % colorPresets.length;
+		updateColorPreset();
+		setCookie('colorpreset', opts.colorPreset, 365);
+		internalOutput('<span class="internal boldnshit">Changed color preset to: '+colorPresets[opts.colorPreset]);
+	});
+
 	$('#musicVolumeSpan').hover(function() {
 		$('#musicVolumeText').addClass('hidden');
 		$('#musicVolume').removeClass('hidden');
diff --git a/modular_citadel/interface/skin.dmf b/modular_citadel/interface/skin.dmf
index c5b5138609..1a6eb17336 100644
--- a/modular_citadel/interface/skin.dmf
+++ b/modular_citadel/interface/skin.dmf
@@ -54,7 +54,7 @@ window "mainwindow"
 		size = 640x440
 		anchor1 = none
 		anchor2 = none
-		background-color = #eeeeee
+		background-color = #242424
 		is-default = true
 		saved-params = "pos;size;is-minimized;is-maximized"
 		icon = 'icons\\ss13_64.png'
@@ -66,7 +66,7 @@ window "mainwindow"
 		size = 637x440
 		anchor1 = 0,0
 		anchor2 = 100,100
-		background-color = #eeeeee
+		background-color = #272727
 		saved-params = "splitter"
 		left = "mapwindow"
 		right = "infowindow"
@@ -78,7 +78,7 @@ window "mainwindow"
 		size = 200x200
 		anchor1 = none
 		anchor2 = none
-		background-color = #ffffff
+		background-color = #272727
 		is-visible = false
 		saved-params = ""
 	elem "tooltip"
@@ -87,7 +87,7 @@ window "mainwindow"
 		size = 999x999
 		anchor1 = none
 		anchor2 = none
-		background-color = #ffffff
+		background-color = #272727
 		is-visible = false
 		saved-params = ""
 
@@ -119,7 +119,7 @@ window "infowindow"
 		size = 640x480
 		anchor1 = none
 		anchor2 = none
-		background-color = #eeeeee
+		background-color = #242424
 		saved-params = "pos;size;is-minimized;is-maximized"
 		is-pane = true
 	elem "info"
@@ -128,6 +128,7 @@ window "infowindow"
 		size = 640x445
 		anchor1 = 0,0
 		anchor2 = 100,100
+		background-color = #272727
 		saved-params = "splitter"
 		left = "statwindow"
 		right = "outputwindow"
@@ -138,7 +139,8 @@ window "infowindow"
 		size = 104x20
 		anchor1 = 3,0
 		anchor2 = 19,0
-		background-color = #90b3dd
+		text-color = #a4BaD6
+		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Changelog"
 		command = "changelog"
@@ -148,7 +150,8 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 19,0
 		anchor2 = 34,0
-		background-color = #90b3dd
+		text-color = #a4BaD6
+		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Rules"
 		command = "rules"
@@ -158,7 +161,8 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 34,0
 		anchor2 = 50,0
-		background-color = #90b3dd
+		text-color = #a4BaD6
+		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Wiki"
 		command = "wiki"
@@ -168,7 +172,8 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 50,0
 		anchor2 = 66,0
-		background-color = #90b3dd
+		text-color = #a4BaD6
+		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Forum"
 		command = "forum"
@@ -178,7 +183,8 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 66,0
 		anchor2 = 81,0
-		background-color = #90b3dd
+		text-color = #a4BaD6
+		background-color = #40628a
 		saved-params = "is-checked"
 		text = "GitHub"
 		command = "github"
@@ -189,7 +195,8 @@ window "infowindow"
 		anchor1 = 81,0
 		anchor2 = 97,0
 		font-size = 8
-		background-color = #ef7f7f
+		text-color = #a4BaD6
+		background-color = #A92c2c
 		saved-params = "is-checked"
 		text = "Report Issue"
 		command = "report-issue"
@@ -201,7 +208,7 @@ window "outputwindow"
 		size = 640x480
 		anchor1 = none
 		anchor2 = none
-		background-color = #eeeeee
+		background-color = #272727
 		saved-params = "pos;size;is-minimized;is-maximized"
 		titlebar = false
 		statusbar = false
@@ -225,7 +232,8 @@ window "outputwindow"
 		size = 37x20
 		anchor1 = 100,100
 		anchor2 = none
-		background-color = #eeeeee
+		text-color = #a4BaD6
+		background-color = #272727
 		saved-params = "is-checked"
 		text = "Chat"
 		command = ".winset \"say.is-checked=true ? input.command=\"!say \\\"\" : input.command=\""
@@ -237,7 +245,7 @@ window "outputwindow"
 		size = 640x456
 		anchor1 = 0,0
 		anchor2 = 100,100
-		background-color = #ffffff
+		background-color = #272727
 		is-visible = false
 		is-disabled = true
 		saved-params = ""
@@ -248,6 +256,8 @@ window "outputwindow"
 		size = 640x456
 		anchor1 = 0,0
 		anchor2 = 100,100
+		text-color = #a4bad6
+		background-color = #272727
 		is-default = true
 		saved-params = ""
 
@@ -258,7 +268,7 @@ window "statwindow"
 		size = 640x480
 		anchor1 = none
 		anchor2 = none
-		background-color = #eeeeee
+		background-color = #242424
 		saved-params = "pos;size;is-minimized;is-maximized"
 		is-pane = true
 	elem "stat"
@@ -267,9 +277,14 @@ window "statwindow"
 		size = 640x480
 		anchor1 = 0,0
 		anchor2 = 100,100
+		text-color = #a4bad6
+		background-color = #272727
 		is-default = true
 		saved-params = ""
-		tab-background-color = #eeeeee
+		tab-text-color = #a4bad6
+		tab-background-color = #242424
+		prefix-color = #a4bad6
+		suffix-color = #a4bad6
 
 window "preferences_window"
 	elem "preferences_window"

From e8a3612619f892ac8e26b634a847073c2f2d21ea Mon Sep 17 00:00:00 2001
From: Ghommie <42542238+Ghommie@users.noreply.github.com>
Date: Thu, 12 Sep 2019 01:01:26 +0200
Subject: [PATCH 5/7] dark and default tweaks.

---
 .../browserassets/css/browserOutput_dark.css  | 10 +++++---
 modular_citadel/interface/skin.dmf            | 24 +++++++++----------
 2 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/code/modules/goonchat/browserassets/css/browserOutput_dark.css b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
index 7d04748847..c8dc0cca0e 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput_dark.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
@@ -11,14 +11,18 @@ a {color: #397ea5;}
 a.visited {color: #7c00e6;}
 a:visited {color: #7c00e6;}
 
-#newMessages {background: #242424;}
+#newMessages {
+	background: #242424;
+	color: #E0E0E0;
+}
 #newMessages:hover {background: #272727;}
 
-#ping {background: #171717;}
+#ping {background: #272727;}
 
 #userBar .subCell {
 	background: #272727;
-	 border-top: 1px solid #171717;
+	color: #E0E0E0
+	border-top: 1px solid #171717;
 }
 #userBar .subCell:hover {background: #272727;}
 #userBar .toggle {background: #272727;}
diff --git a/modular_citadel/interface/skin.dmf b/modular_citadel/interface/skin.dmf
index 1a6eb17336..025a53bdca 100644
--- a/modular_citadel/interface/skin.dmf
+++ b/modular_citadel/interface/skin.dmf
@@ -139,7 +139,7 @@ window "infowindow"
 		size = 104x20
 		anchor1 = 3,0
 		anchor2 = 19,0
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Changelog"
@@ -150,7 +150,7 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 19,0
 		anchor2 = 34,0
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Rules"
@@ -161,7 +161,7 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 34,0
 		anchor2 = 50,0
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Wiki"
@@ -172,7 +172,7 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 50,0
 		anchor2 = 66,0
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #40628a
 		saved-params = "is-checked"
 		text = "Forum"
@@ -183,7 +183,7 @@ window "infowindow"
 		size = 100x20
 		anchor1 = 66,0
 		anchor2 = 81,0
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #40628a
 		saved-params = "is-checked"
 		text = "GitHub"
@@ -195,7 +195,7 @@ window "infowindow"
 		anchor1 = 81,0
 		anchor2 = 97,0
 		font-size = 8
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #A92c2c
 		saved-params = "is-checked"
 		text = "Report Issue"
@@ -232,7 +232,7 @@ window "outputwindow"
 		size = 37x20
 		anchor1 = 100,100
 		anchor2 = none
-		text-color = #a4BaD6
+		text-color = #e0e0e0
 		background-color = #272727
 		saved-params = "is-checked"
 		text = "Chat"
@@ -256,7 +256,7 @@ window "outputwindow"
 		size = 640x456
 		anchor1 = 0,0
 		anchor2 = 100,100
-		text-color = #a4bad6
+		text-color = #e0e0e0
 		background-color = #272727
 		is-default = true
 		saved-params = ""
@@ -277,14 +277,14 @@ window "statwindow"
 		size = 640x480
 		anchor1 = 0,0
 		anchor2 = 100,100
-		text-color = #a4bad6
+		text-color = #e0e0e0
 		background-color = #272727
 		is-default = true
 		saved-params = ""
-		tab-text-color = #a4bad6
+		tab-text-color = #e0e0e0
 		tab-background-color = #242424
-		prefix-color = #a4bad6
-		suffix-color = #a4bad6
+		prefix-color = #e0e0e0
+		suffix-color = #e0e0e0
 
 window "preferences_window"
 	elem "preferences_window"

From c090c98118f08e06c548bae5e0544e820e9fe7f5 Mon Sep 17 00:00:00 2001
From: Ghommie <42542238+Ghommie@users.noreply.github.com>
Date: Thu, 12 Sep 2019 04:11:44 +0200
Subject: [PATCH 6/7] final fixes.

---
 code/modules/client/asset_cache.dm                             | 3 ++-
 code/modules/goonchat/browserassets/css/browserOutput_dark.css | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/code/modules/client/asset_cache.dm b/code/modules/client/asset_cache.dm
index 5afdd6d226..643d072469 100644
--- a/code/modules/client/asset_cache.dm
+++ b/code/modules/client/asset_cache.dm
@@ -571,7 +571,8 @@ GLOBAL_LIST_EMPTY(asset_datums)
 		"fontawesome-webfont.woff" = 'tgui/assets/fonts/fontawesome-webfont.woff',
 		"font-awesome.css"	       = 'code/modules/goonchat/browserassets/css/font-awesome.css',
 		"browserOutput.css"	       = 'code/modules/goonchat/browserassets/css/browserOutput.css',
-		"browserOutput_dark.css"  = 'code/modules/goonchat/browserassets/css/browserOutput_dark.css',
+		"browserOutput_dark.css"   = 'code/modules/goonchat/browserassets/css/browserOutput_dark.css',
+		"browserOutput_light.css"  = 'code/modules/goonchat/browserassets/css/browserOutput_light.css'
 	)
 
 /datum/asset/spritesheet/goonchat
diff --git a/code/modules/goonchat/browserassets/css/browserOutput_dark.css b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
index c8dc0cca0e..2e1fe8cdec 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput_dark.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput_dark.css
@@ -21,7 +21,7 @@ a:visited {color: #7c00e6;}
 
 #userBar .subCell {
 	background: #272727;
-	color: #E0E0E0
+	color: #E0E0E0;
 	border-top: 1px solid #171717;
 }
 #userBar .subCell:hover {background: #272727;}

From 7d3003179bddf582cbdd220b36ad4ad9fc946e39 Mon Sep 17 00:00:00 2001
From: Ghommie <42542238+Ghommie@users.noreply.github.com>
Date: Mon, 23 Sep 2019 17:55:55 +0200
Subject: [PATCH 7/7] This will fix and close #9346

---
 code/modules/goonchat/browserassets/js/browserOutput.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/code/modules/goonchat/browserassets/js/browserOutput.js b/code/modules/goonchat/browserassets/js/browserOutput.js
index b6fdf2c276..abd05d29ed 100644
--- a/code/modules/goonchat/browserassets/js/browserOutput.js
+++ b/code/modules/goonchat/browserassets/js/browserOutput.js
@@ -915,7 +915,7 @@ $(function() {
 
 		$.ajax({
 			type: 'GET',
-			url: 'browserOutput_white.css',
+			url: 'browserOutput.css',
 			success: function(styleData) {
 				var blob = new Blob(['<head><title>Chat Log</title><style>', styleData, '</style></head><body>', $messages.html(), '</body>']);