Add some colour variables

Currently just used for text and links.

Unrelatedly, also some notes for the layout.

Change-Id: I3cb26e4eaf3c9d35fecf9899e817ba0df31084cb

notes

@@ -0,0 +1 @@
+...

resources/screen-common.less

@@ -7,6 +7,24 @@ body {
 	font-family: sans-serif;
 	margin: 0;
 	padding: 0;
+	color: @text;
+	background: @background;
+}
+
+a {
+	text-decoration: none;
+	color: @blue;
+
+	&:visited {
+		color: @blue-dark;
+	}
+	&.new {
+		color: @red;
+
+		&:visited {
+			color: @red-dark;
+		}
+	}
 }
 
 #p-logo {

resources/variables.less

@@ -1,5 +1,31 @@
 @import "mediawiki.mixins";
 
+@text: #013;
+@background: #fff;
+
+@link: @blue;
+@link-red: @red;
+
+@grey: #ddd;
+@grey-bright: #f0f0f0;
+@grey-dark: #aaa;
+
+@red: #b22;
+@red-bright: #f44;
+@red-dark: #800;
+
+@green: #194;
+@green-bright: #4c7;
+@green-dark: #071;
+
+@blue: #06a;
+@blue-bright: #0af;
+@blue-dark: #047;
+
+@link: @blue;
+@link-red: @red;
+
+
 /* To hide objects, but keep them accessible for screen-readers */
 .hidden() {
 	position: absolute;