Here is what I've been using through the excellent Stylus browser addon. It's derived from some of the Stylus themes for HN. (comment box text is black but not being a web guy I didn't fix it):

Screenshots: https://imgur.com/a/RhesGUo

/*Base*/
::selection{background: #111; color: #F60;}
body{background-color: #222; color: #CCC;}
a:link{color: #8AD !important;}
a:visited{color: #666 !important;}
a.storylink{color: #dfdfdf !important;}

/*Font*/
:root{font-size: 16px; text-rendering: optimizeLegibility;}
body, td, .admin, td, .subtext, td, input[type="submit"], .default, .admin, .title, .subtext, .yclinks, .pagetop, .comhead, .comment{font-family: sans-serif;}
body,td,input,textarea,.default,.title,.pagetop{font-size: 1rem;}
.comment{font-size: 0.9167rem;}
.admin, .admin td{font-size: 0.875rem;}
.yclinks, .comhead{font-size: 0.8333rem;}
.subtext,.subtext td, .rank, font[size="1"]{font-size: 0.75rem;}
.rank{font-weight: bold;}

/*Input*/
input, textarea{background-color: #333; border: 0.0625rem solid #555; padding: 0.1875rem;}
input[type="submit"]{background-color: #444; padding: 0.5rem 1.5rem;}

/*Vote Arrows*/
.votearrow{display: none;}
a[id^="up"]:before{content: "▲"; color: #666; font-weight: bold; padding: 0.1875rem;}
a[id^="up"].nosee:before{visibility: visible; color: #F60;}
a[id^="down"]:before{content: "▼"; color: #666; font-weight: bold; padding: 0.1875rem;}
a[id^="down"].nosee:before{visibility: visible; color: #369;}

/*Spacers*/
tr.spacer{height: 0.1875rem !important;}
#pagespace{display: none;}

/*Backing*/
#hnmain{background-color: #111;}
.itemlist{background-color: #111; width: 100%; padding: 0.1875rem;}

/*Header Bar*/
#hnmain > tbody > tr > td[bgcolor="#ff6600"]{position: relative; background-color: #333; border: 0.1875rem solid #111; border-bottom: none; padding: 0.1875rem;}
#hnmain > tbody > tr > td[bgcolor="#ff6600"] a{color: #F60 !important;}
.pagetop{color: #888;}
#hnmain > tbody > tr > td[bgcolor="#ff6600"] td:nth-child(2){position: absolute; top: 0.375rem; width: 100%; height: 0 !important; text-align: center; margin-left: -30px; padding-left: 30px;}
.hnname{position: absolute; left: 30; top: 0.1875rem;}

/*Syncopation*/
.itemlist .athing:nth-child(odd), .itemlist .athing:nth-child(odd)+tr, .athing.comtr:nth-child(odd){background-color: #1E1E1E;}
.itemlist .athing:nth-child(even), .itemlist .athing:nth-child(even)+tr, .athing.comtr:nth-child(even){background-color: #242424;}

/*Item*/
.itemlist .athing td{padding-top: 0.5rem;}
.itemlist .athing+tr td{padding-bottom: 0.5rem;}
.itemlist .athing .title:first-child{background-color: #111; border-bottom-right-radius: 0.375rem !important; text-align: center; padding-top: 0.375rem;}

/*Fat Item*/
.fatitem{padding-top: 0.625rem;}
.fatitem form{margin: 0;}
.fatitem .votelinks{padding: 0 0.375rem;}

/*Coments*/
.comment-tree{width: 100%;}
.ind{background-image: repeating-linear-gradient(to right, #111, #111 39px, #222 40px);}
.athing.comtr td{padding: 0;}
.athing.comtr table{border-collapse: collapse;}
.athing.comtr .default{padding: 0.625rem 2.5rem 0.625rem 0;}
.athing.comtr .votelinks{padding: 0.625rem;}
.athing.comtr .comment a{color: #369 !important;}
.athing.comtr .comment .reply a{color: #8AD !important;}
.comment{max-width: none;}
.comment pre{max-width: 70vw;}
.comment pre *{font-family: monospace;}

/*Custom*/
.subtext .hnuser:link,
.comhead a:link,
.subtext a:visited {
color: #c678ddcc !important;
}
.age a:link,
.age a:visited {
color: #98be65cc !important;
}

/*Comment Colors*/
.c00{color: #dddddd;}
.c5a{color: #cecece;}
.c73{color: #bebebe;}
.c82{color: #aeaeae;}
.c88{color: #9c9c9c;}
.c9c{color: #888888;}
.cae{color: #828282;}
.cbe{color: #737373;}
.cce{color: #5a5a5a;}
.cdd{color: #000000;}

/*New Comments Page*/
.athing > .default{padding: 0.625rem 2.5rem 0.625rem 0 !important;}
.athing > .ind+.votelinks{padding: 0.625rem;}

/*Hover*/
.itemlist .athing:hover, .itemlist .athing:hover td, .itemlist .athing:hover+tr td{background-color: #333;}
.itemlist .athing:hover .rank{color: #369;}
.athing.comtr:hover{background-color: #333;}

body > center > table {
width: 80% !important;
}