-td.di-b {background: #411} /* bmp */
-td.di-d {background: #330} /* rfc-1345 digraph */
-td.di-prop {background: #420} /* proposed digraph */
-td.di-a {background: #131} /* ascii */
-td.di-rare {background: #181818} /* disfavoured */
-td.di-invalid {background: #222} /* impossible */
-
-/* continents */
-td.c-af {background: #1C1C00}
-td.c-eu {background: #221400}
-td.c-as {background: #200}
-td.c-oc {background: #102}
-td.c-aa {background: #012}
-td.c-sa {background: #001A1A}
-td.c-na {background: #001800}
-
-.glyphs tbody td:hover {color: #000}
-.glyphs tbody td:hover small {color: #FFF}
+.l1 {background: #411} /* bmp */
+.l2 {background: #321} /* proposed digraph */
+.l3 {background: #330} /* rfc-1345 digraph */
+.l4 {background: #030} /* ascii */
+.l5 {background: #00331D} /* ascii */
+.l0 {background: #222}
+.ex { color: #777} /* disfavoured */
+.u-invalid {background: #333} /* impossible */
+
+.p4::after {color: #F44}
+.p3::after {color: #E66}
+.p2::after {color: #C88}
+.p1::after,
+.p0::after {color: #CCC}
+
+/* general colorization */
+
+.c-sa,
+.g1 {background: #044}
+.c-na,
+.g2 {background: #040}
+.g3 {background: #340}
+.c-af,
+.g4 {background: #440}
+.c-eu,
+.g5 {background: #530}
+.g6 {background: #520}
+.c-as,
+.g7 {background: #500}
+.c-an,
+.g8 {background: #503}
+.c-oc,
+.g9 {background: #205}
+.no {background: #222}
+
+.X:hover,
+.l:hover a, .l:hover a:visited,
+.g9 a:hover, .g9[onclick]:hover,
+.g8 a:hover, .g8[onclick]:hover,
+.g7 a:hover, .g7[onclick]:hover,
+.g6 a:hover, .g6[onclick]:hover,
+.g5 a:hover, .g5[onclick]:hover,
+.g4 a:hover, .g4[onclick]:hover,
+.g3 a:hover, .g3[onclick]:hover,
+.g2 a:hover, .g2[onclick]:hover {
+ color: #000; /* on default (light) background hover */
+}
+.legend .ex:hover {background: #666}
+.X:hover small {color: #FFF}
+
+/* images */
+
+figcaption {
+ color: #FFF;
+ background: rgba(0, 0, 0, .5);
+}
+.gallery figure:hover ~ ul figcaption {
+ /* mark all children */
+ color: #000;
+ background: rgba(255, 255, 255, .5);
+}
+
+/* starcraft */
+
+.units tbody tr:hover:not(.race) {
+ background: #222;
+}
+.unit-gas {
+ color: #AC9;
+}
+.unit-min, .unit-min a:not(:hover) {
+ color: #ABC;
+}
+.unit-supply {
+ color: #8C6;
+}
+.unit-o {color: #C5A} /* organic */
+.unit-u {color: #66B} /* mechanic */
+.unit-p {color: #0A8} /* psionic */
+.unit-composed {
+ color: #A44;
+}
+.unit-air {
+ color: #4AC;
+}
+.unit-x {color: #666}
+.unit-s {color: #AC6}
+.unit-m {color: #C70}
+.unit-l {color: #C44}
+.unit-h {color: #C06}
+.magic-opt:before,
+.magic-opt:after {
+ color: #CCC;
+}
+.hurtrel, .units .hurtrel {
+ color: #887;
+}
+tbody .unit-shield {
+ color: #88A;
+}
+.unit-pdd {
+ color: #A8C;
+}
+.unit-splash {
+ color: #4A0;
+}
+.hurt-a {
+ color: #8AC;
+}
+.hurt-g {
+ color: #8CA;
+}
+.unit-massive {
+ color: #844;
+}
+.unit-detect::before {
+ color: #0A8;
+}
+.unit-jump {
+ color: #780;
+}
+body .magic-perma {
+ text-decoration-color: #460;
+ -moz-text-decoration-color: #460;
+ -webkit-text-decoration-color: #460;
+}