MANIFEST                     |   3 +++
 contrib/css/216dark.css      |  26 ++++++++++++++++++++++++++
 contrib/css/216light.css     |  25 +++++++++++++++++++++++++
 contrib/css/README           |  41 +++++++++++++++++++++++++++++++++++++++++
 examples/public-inbox.psgi   |   2 +-
 lib/PublicInbox/Config.pm    |   3 +++
 lib/PublicInbox/Hval.pm      |  14 --------------
 lib/PublicInbox/WWW.pm       | 123 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 lib/PublicInbox/WwwStream.pm |   2 +-
 script/public-inbox-httpd    |   2 +-
 t/view.t                     |   2 ++

diff --git a/MANIFEST b/MANIFEST
index 5e980fe61130c36d0fa0cd300d90d9255b33dc8e..1db7bd114af6026589745fe45004cbf1d3d24298 100644
--- a/MANIFEST
+++ b/MANIFEST
@@ -26,6 +26,9 @@ MANIFEST
 Makefile.PL
 README
 TODO
+contrib/css/216dark.css
+contrib/css/216light.css
+contrib/css/README
 contrib/selinux/el7/publicinbox.fc
 contrib/selinux/el7/publicinbox.te
 examples/README
diff --git a/contrib/css/216dark.css b/contrib/css/216dark.css
new file mode 100644
index 0000000000000000000000000000000000000000..2fd85d0815fef6ae4ac8dfec2131ca2c1d437159
--- /dev/null
+++ b/contrib/css/216dark.css
@@ -0,0 +1,26 @@
+/*
+ * Dark color scheme using 216 web-safe colors, inspired
+ * somewhat by the default color scheme in mutt.
+ * It reduces eyestrain for me, and energy usage for all:
+ * https://en.wikipedia.org/wiki/Light-on-dark_color_scheme
+ */
+* { background:#000; color:#ccc }
+
+/*
+ * Underlined links add visual noise which make them hard-to-read.
+ * Use colors to make them stand out, instead.
+ */
+a { color:#69f; text-decoration:none }
+a:visited { color:#96f }
+
+/* quoted text gets a different color */
+*.q { color:#09f }
+
+/*
+ * these may be used with cgit, too
+ * (cgit uses <div>, public-inbox uses <span>)
+ */
+*.add { color:#0ff }
+*.del { color:#f0f }
+*.head { color:#fff }
+*.hunk { color:#c93 }
diff --git a/contrib/css/216light.css b/contrib/css/216light.css
new file mode 100644
index 0000000000000000000000000000000000000000..bf81bc570f28f20c40cb11057cb22c0fd039f00c
--- /dev/null
+++ b/contrib/css/216light.css
@@ -0,0 +1,25 @@
+/*
+ * Light color scheme using 216 web-safe colors.
+ * Suitable for print, and blinding people with brightness.
+ * Haphazardly thrown together because bright colors hurt my eyes
+ */
+* { background:#fff; color:#333 }
+
+/*
+ * Underlined links add visual noise which make them hard-to-read.
+ * Use colors to make them stand out, instead.
+ */
+a { color:#00f; text-decoration:none }
+a:visited { color:#808 }
+
+/* quoted text gets a different color */
+*.q { color:#006 }
+
+/*
+ * these may be used with cgit, too
+ * (cgit uses <div>, public-inbox uses <span>)
+ */
+*.add { color:#060 }
+*.del {color:#900 }
+*.head { color:#000 }
+*.hunk { color:#960 }
diff --git a/contrib/css/README b/contrib/css/README
new file mode 100644
index 0000000000000000000000000000000000000000..2473c2bed9e9a0879a363dbe2852043ee36954f9
--- /dev/null
+++ b/contrib/css/README
@@ -0,0 +1,41 @@
+Example CSS for use with public-inbox.
+
+CSS::Minifier or CSS::Minifier::XS will be tried for minimizing
+CSS at startup if available(*).
+
+Multiple CSS files may be configured for user-selectability via
+the "title" attribute or for different media.  Local CSS files
+are read into memory once at startup.
+
+If only one CSS file is given without "title", it will be inlined.
+
+Snippet from ~/.public-inbox/config, order matters to browsers.
+-----8<-----
+[publicinbox]
+	; Depending on the browser, the first entry is the default.
+	; So having "/dev/null" at the top means no colors by default.
+	; Using the "title" attribute enables `View -> "Page Style"'
+	; choices in Firefox.
+	css = /dev/null title=default
+
+	; git-config supports backslash to continue long lines
+	; Attributes ('media', 'title') must use single quotes(')
+	; or no quotes at all, but not double-quotes, as git-config(1)
+	; won't preserve them:
+	css = /path/to/public-inbox/contrib/css/216dark.css \
+		title=216dark \
+		media='screen,(prefers-color-scheme:dark)'
+
+	; for tree haters who print web pages :P
+	css = /path/to/public-inbox/contrib/css/216light.css \
+		title=216light \
+		media='screen,print,(prefers-color-scheme:light)'
+
+	; external CSS may be specified with href.
+	; Using "//" (protocol-relative) URLs is allowed, as is
+	; "https://" or "http://" for hosts which only support one protocol.
+	css = href=//example.com/fugly.css title=external
+
+
+(*) "libcss-minifier-perl" or "libcss-minifier-xs-perl"
+    on Debian-based systems
diff --git a/examples/public-inbox.psgi b/examples/public-inbox.psgi
index 4dd3306b669bde49f0a2d7c08b869366563c33b0..8886d7fa881b8d18f076a6981309b41913c9cd4b 100644
--- a/examples/public-inbox.psgi
+++ b/examples/public-inbox.psgi
@@ -8,9 +8,9 @@ #	plackup -I lib -o 127.0.0.1 -R lib -r examples/public-inbox.psgi
 use strict;
 use warnings;
 use PublicInbox::WWW;
-PublicInbox::WWW->preload;
 use Plack::Builder;
 my $www = PublicInbox::WWW->new;
+$www->preload;
 
 # share the public-inbox code itself:
 my $src = $ENV{SRC_GIT_DIR}; # '/path/to/public-inbox.git'
diff --git a/lib/PublicInbox/Config.pm b/lib/PublicInbox/Config.pm
index 355e64bfec6a19036519054b17a716641d2c7310..cead7fc287c1220b7af6905f2d04132d2c2a0a1f 100644
--- a/lib/PublicInbox/Config.pm
+++ b/lib/PublicInbox/Config.pm
@@ -49,6 +49,9 @@ 		}
 		my $nod = join('|', @domains);
 		$self->{-no_obfuscate_re} = qr/(?:$nod)\z/i;
 	}
+	if (my $css = delete $self->{'publicinbox.css'}) {
+		$self->{css} = _array($css);
+	}
 
 	$self;
 }
diff --git a/lib/PublicInbox/Hval.pm b/lib/PublicInbox/Hval.pm
index a120a291bd4d85c1e37ce4c1b549a7cdd2d948eb..0315d759cbf6340c837a1fee5c01a8a8f71b63b6 100644
--- a/lib/PublicInbox/Hval.pm
+++ b/lib/PublicInbox/Hval.pm
@@ -11,20 +11,6 @@ use PublicInbox::MID qw/mid_clean mid_escape/;
 use base qw/Exporter/;
 our @EXPORT_OK = qw/ascii_html obfuscate_addrs to_filename/;
 
-# User-generated content (UGC) may have excessively long lines
-# and screw up rendering on some browsers, so we use pre-wrap.
-#
-# We also force everything to the same scaled font-size because GUI
-# browsers (tested both Firefox and surf (webkit)) uses a larger font
-# for the Search <form> element than the rest of the page.  Font size
-# uniformity is important to people who rely on gigantic fonts.
-# Finally, we use monospace to ensure the Search field and button
-# has the same size and spacing as everything else which is
-# <pre>-formatted anyways.
-use constant STYLE =>
-	'<style>pre{white-space:pre-wrap}' .
-	'*{font-size:100%;font-family:monospace}</style>';
-
 my $enc_ascii = find_encoding('us-ascii');
 
 sub new {
diff --git a/lib/PublicInbox/WWW.pm b/lib/PublicInbox/WWW.pm
index a0fd7fa74b99a3dbb099d8c8f68b7cd269d29145..863da85a2d3820ba6105ce695cb95ddd0d6cfc24 100644
--- a/lib/PublicInbox/WWW.pm
+++ b/lib/PublicInbox/WWW.pm
@@ -6,6 +6,7 @@ #
 # We focus on the lowest common denominators here:
 # - targeted at text-only console browsers (w3m, links, etc..)
 # - Only basic HTML, CSS only for line-wrapping <pre> text content for GUIs
+#   and diff/syntax-highlighting (optional)
 # - No JavaScript, graphics or icons allowed.
 # - Must not rely on static content
 # - UTF-8 is only for user-content, 7-bit US-ASCII for us
@@ -118,6 +119,8 @@ 	} elsif ($path_info =~ m!$INBOX_RE/$MID_RE/f/?\z!o) {
 		r301($ctx, $1, $2);
 	} elsif ($path_info =~ m!$INBOX_RE/_/text(?:/(.*))?\z!o) {
 		get_text($ctx, $1, $2);
+	} elsif ($path_info =~ m!$INBOX_RE/([\w\-\.]+)\.css\z!o) {
+		get_css($self, $2);
 	} elsif ($path_info =~ m!$INBOX_RE/($OID_RE)/s/\z!o) {
 		get_vcs_object($ctx, $1, $2);
 	} elsif ($path_info =~ m!$INBOX_RE/($OID_RE)/s/([\w\.\-]+)\z!o) {
@@ -135,6 +138,7 @@ }
 
 # for CoW-friendliness, MOOOOO!
 sub preload {
+	my ($self) = @_;
 	require PublicInbox::Feed;
 	require PublicInbox::View;
 	require PublicInbox::SearchThread;
@@ -146,6 +150,9 @@ 	foreach (qw(PublicInbox::Search PublicInbox::SearchView
 			PublicInbox::Mbox IO::Compress::Gzip
 			PublicInbox::NewsWWW)) {
 		eval "require $_;";
+	}
+	if (ref($self)) {
+		$self->stylesheets_prepare($_) for ('', '../', '../../');
 	}
 }
 
@@ -462,6 +469,122 @@ sub get_attach {
 	my ($ctx, $idx, $fn) = @_;
 	require PublicInbox::WwwAttach;
 	PublicInbox::WwwAttach::get_attach($ctx, $idx, $fn);
+}
+
+# User-generated content (UGC) may have excessively long lines
+# and screw up rendering on some browsers, so we use pre-wrap.
+#
+# We also force everything to the same scaled font-size because GUI
+# browsers (tested both Firefox and surf (webkit)) uses a larger font
+# for the Search <form> element than the rest of the page.  Font size
+# uniformity is important to people who rely on gigantic fonts.
+# Finally, we use monospace to ensure the Search field and button
+# has the same size and spacing as everything else which is
+# <pre>-formatted anyways.
+our $STYLE = 'pre{white-space:pre-wrap}*{font-size:100%;font-family:monospace}';
+
+sub stylesheets_prepare ($$) {
+	my ($self, $upfx) = @_;
+	my $mini = eval {
+		require CSS::Minifier;
+		sub { CSS::Minifier::minify(input => $_[0]) };
+	} || eval {
+		require CSS::Minifier::XS;
+		sub { CSS::Minifier::XS::minify($_[0]) };
+	} || sub { $_[0] };
+
+	my $css_map = {};
+	my $stylesheets = $self->{pi_config}->{css} || [];
+	my $links = [];
+	my $inline_ok = 1;
+
+	foreach my $s (@$stylesheets) {
+		my $attr = {};
+		local $_ = $s;
+		foreach my $k (qw(media title href)) {
+			if (s/\s*$k='([^']+)'// || s/\s*$k=(\S+)//) {
+				$attr->{$k} = $1;
+			}
+		}
+
+		if (defined $attr->{href}) {
+			$inline_ok = 0;
+		} else {
+			open(my $fh, '<', $_) or do {
+				warn "failed to open $_: $!\n";
+				next;
+			};
+			my ($key) = (m!([^/]+?)(?:\.css)?\z!i);
+			my $ctime = 0;
+			my $local = do { local $/; <$fh> };
+			if ($local =~ /\S/) {
+				$ctime = sprintf('%x',(stat($fh))[10]);
+				$local = $mini->($local);
+			}
+			$css_map->{$key} = $local;
+			$attr->{href} = "$upfx$key.css?$ctime";
+			if (defined($attr->{title})) {
+				$inline_ok = 0;
+			} elsif (($attr->{media}||'screen') eq 'screen') {
+				$attr->{-inline} = $local;
+			}
+		}
+		push @$links, $attr;
+	}
+
+	my $buf = "<style>$STYLE";
+	if ($inline_ok) {
+		my @ext; # for media=print and whatnot
+		foreach my $attr (@$links) {
+			if (defined(my $str = delete $attr->{-inline})) {
+				$buf .= $str;
+			} else {
+				push @ext, $attr;
+			}
+		}
+		$links = \@ext;
+	}
+	$buf .= '</style>';
+
+	if (@$links) {
+		foreach my $attr (@$links) {
+			delete $attr->{-inline};
+			$buf .= "<link\ntype=text/css\nrel=stylesheet";
+			while (my ($k, $v) = each %$attr) {
+				$v = qq{"$v"} if $v =~ /[\s=]/;
+				$buf .= qq{\n$k=$v};
+			}
+			$buf .= ' />';
+		}
+		$self->{"-style-$upfx"} = $buf;
+	} else {
+		$self->{-style_inline} = $buf;
+	}
+	$self->{-css_map} = $css_map;
+}
+
+# returns an HTML fragment with <style> or <link> tags in them
+# Called by WwwStream by nearly every HTML page
+sub style {
+	my ($self, $upfx) = @_;
+	$self->{-style_inline} || $self->{"-style-$upfx"} || do {
+		stylesheets_prepare($self, $upfx);
+		$self->{-style_inline} || $self->{"-style-$upfx"}
+	};
+}
+
+# /$INBOX/$KEY.css endpoint
+# CSS is configured globally for all inboxes, but we access them on
+# a per-inbox basis.  This allows administrators to setup per-inbox
+# static routes to intercept the request before it hits PSGI
+sub get_css ($$) {
+	my ($self, $key) = @_;
+	my $css_map = $self->{-css_map} || stylesheets_prepare($self, '');
+	defined(my $css = $css_map->{$key}) or return r404();
+	my $h = [ 'Content-Length', bytes::length($css),
+		'Content-Type', 'text/css' ];
+	PublicInbox::GitHTTPBackend::cache_one_year($h);
+	[ 200, $h, [ $css ] ];
 }
 
 1;
diff --git a/lib/PublicInbox/WwwStream.pm b/lib/PublicInbox/WwwStream.pm
index e548f00f4a3ed024a9da56263860617b2638e60f..c3aeb6b03b0299ce117482936f002bfb58a04dd3 100644
--- a/lib/PublicInbox/WwwStream.pm
+++ b/lib/PublicInbox/WwwStream.pm
@@ -65,7 +65,7 @@ 	}
 	"<html><head><title>$title</title>" .
 		"<link\nrel=alternate\ntitle=\"Atom feed\"\n".
 		"href=\"$atom\"\ntype=\"application/atom+xml\"/>" .
-		PublicInbox::Hval::STYLE .
+	        $ctx->{www}->style($upfx) .
 		"</head><body>". $top . $tip;
 }
 
diff --git a/script/public-inbox-httpd b/script/public-inbox-httpd
index 43f1818861ed1d10f0032ec3891029e4ff79a2c3..47e38eca2ea0bfd6b313f375f49b730041bc9754 100755
--- a/script/public-inbox-httpd
+++ b/script/public-inbox-httpd
@@ -21,8 +21,8 @@ "$0 runs in /, command-line paths must be absolute\n";
 		}
 	} else {
 		require PublicInbox::WWW;
-		PublicInbox::WWW->preload;
 		my $www = PublicInbox::WWW->new;
+		$www->preload;
 		$app = builder {
 			eval {
 				enable 'Deflater',
diff --git a/t/view.t b/t/view.t
index b829ecf883f8cca07cf28444e5ba4741578de57c..ef7d6958aaa9f0c27e9d2125df0278c0b7b8d7b3 100644
--- a/t/view.t
+++ b/t/view.t
@@ -6,6 +6,7 @@ use Test::More;
 use Email::MIME;
 use Plack::Util;
 use_ok 'PublicInbox::View';
+use_ok 'PublicInbox::Config';
 
 # FIXME: make this test less fragile
 my $ctx = {
@@ -18,6 +19,7 @@ 		cloneurl => sub {[]},
 		nntp_url => sub {[]},
 		max_git_part => sub { undef },
 		description => sub { '' }),
+	www => Plack::Util::inline_object(style => sub { '' }),
 };
 $ctx->{-inbox}->{-primary_address} = 'test@example.com';