code:
/*gurochan*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #e6cbc0;
	--alt-font-color: #000;
	--background-top: #EDDAD2;
	--background-rest: #EDDAD2;
	--navbar-color: #D9AF9E;
	--post-color: #D9AF9E;
	--post-outline-color: #CA927B;
	--label-color: #E6CBC0;
	--box-border-color: #CA927B;
	--darken: #0000000f;
	--highlighted-post-color: #EEDACB;
	--highlighted-post-outline-color: #CA927B;
	--board-title: #FF6600;
	--hr: #CA927B;
	--font-color: #000;
	--name-color: #000;
	--capcode-color: #f00;
	--subject-color: #004A99;
	--link-color: #34345C;
	--post-link-color: #34345C;
	--link-hover: #34345C;
	--accent-color: #E6CBC0;
	--input-borders: #CA927B;
	--input-color: #000;
	--input-background: #E6CBC0;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color:#E0727F;
}


code:
:root {
	--icon-color: invert(15%) sepia(66%) saturate(7479%) hue-rotate(6deg) brightness(98%) contrast(124%);
	--alt-label-color: #282a2e;
	--alt-font-color: #f4c095;
	--background-top: #0d1a1d;
	--background-rest: #0d1a1d;
	--navbar-color: #222222eb;
	--post-color: #222222;
	--post-outline-color: #d2738a;
	--label-color: #282a2e;
	--box-border-color: #d2738a;
	--darken: #ffffff10;
	--highlighted-post-color: #6d99ba73;
	--highlighted-post-outline-color: #82cece;
	--board-title: #f4c095;
	--hr: #d2738a;
	--font-color: #dcdcdc;
	--name-color: #d2738a;
	--capcode-color: #15ff00;
	--subject-color: #f4c095;
	--link-color: #6d98ba;
	--post-link-color: #6d98ba;
	--link-hover: #bd0000;
	--accent-color: #d2738a;
	--input-borders: #d2738a;
	--input-color: #dcdcdc;
	--input-background: #282a2e;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #88b319;
	--pinktext-color: #e0727f;
}

body {
	background: linear-gradient(#6d99BA50,#1c1c1c75 400px calc(100% - 200px),#d2738A90),url(/css/themes/assets/iwakura-bg.gif),#0d0d0d none repeat scroll 0 0
}

a.quote {
	color: #f4c095
}

table {
	border: 1px solid var(--box-border-color)
}

tr {
	background: var(--background-rest) url(/css/themes/assets/iwakura-bg.gif)
}

.captcha {
	filter: invert(90%)
}

#float .post-container, #livetext, #threadstats, .catalog-tile, .pages, .post-container, .collapse, .bottom-reply {
	border-style: none none none solid
}

hr {
	margin: 16px 0
}

repo_name: diegolegion/algochan

license: mit


code:
/*lainchan*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #333;
	--alt-font-color: #bbb;
	--background-top: #1E1E1E;
	--background-rest: #1E1E1E;
	--navbar-color: #333;
	--post-color: #333;
	--post-outline-color: #555;
	--label-color: #333;
	--box-border-color: #666;
	--darken: #ffffff0f;
	--highlighted-post-color: #32DD7220;
	--highlighted-post-outline-color: #32DD7250;
	--board-title: #32DD72;
	--hr: #333;
	--font-color: #bbb;
	--name-color: #32DD72;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: #fff;
	--post-link-color: #fff;
	--link-hover: #32DD72;
	--accent-color: #666;
	--input-borders: #666;
	--input-color: #CCCCCC;
	--input-background: #333;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #B8D962;
	--pinktext-color:#E0727F;
}
.post-container, #float .post-container, .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats, .collapse, .bottom-reply {
	border-width: 1px;
}
.captcha {
	filter: invert(90%);
}


code:
/*miku*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #B6DDDE;
	--alt-font-color: black;
	--background-top: #2e99cc70;
	--background-rest: #D2FFEE;
	--navbar-color: #B6DDDE;
	--post-color: #B6DDDE;
	--post-outline-color: #8FCCCD;
	--label-color: #B6DDDE;
	--box-border-color: #8FCCCD;
	--darken: #00000010;
	--highlighted-post-color: #a9d8ff;
	--highlighted-post-outline-color: #8FCCCD;
	--board-title: #800000;
	--hr: #B7D9C5;
	--font-color: black;
	--name-color: #117743;
	--capcode-color: #f00;
	--subject-color: #117743;
	--link-color: #00637B;
	--post-link-color: #d00;
	--link-hover: #d00;
	--accent-color: #B6DDDE;
	--input-borders: #a9a9a9;
	--input-color: #000;
	--input-background: white;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color:#E0727F;
}
.post-container, #float .post-container, .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats, .collapse, .bottom-reply {
	border-width: 0 1px 1px 0;
}


code:
:root {
	--icon-color:invert(15%) sepia(66%) saturate(7479%) hue-rotate(6deg) brightness(98%) contrast(124%);
	--alt-label-color: #182f3f;
	--alt-font-color: #acacac;
	--background-top: #0d1a1d;
	--background-rest: #0d1a1d;
	--navbar-color: #182f3f9e;
	--post-color: #182f3f;
	--post-outline-color: #82cece;
	--label-color: #182f3f;
	--box-border-color: #82cece;
	--darken: #ffffff10;
	--highlighted-post-color: #244860;
	--highlighted-post-outline-color: #82cece;
	--board-title: #82cece;
	--hr: #82cece;
	--font-color: #acacac;
	--name-color: #82cece;
	--capcode-color: #f00;
	--subject-color: #46b5b5;
	--link-color: #82cece;
	--post-link-color: #82cece;
	--link-hover: #acacac;
	--accent-color: #82cece;
	--input-borders: #82cece;
	--input-color: #acacac;
	--input-background: #182f3f;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color: #e0727f;
}
body {
	background: var(--background-rest) url(/css/themes/assets/mushroom.png);
}
a.post-name {
	color: #a0ffff;
}
a.quote {
	color: #81a2be;
}
table {
	border: 1px solid var(--box-border-color);
}
tr {
	background: var(--background-rest) url(/css/themes/assets/mushroom.png);
}
.captcha {
	filter: invert(90%);
}


code:
/*tomorrow*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #1a1e34;
	--alt-font-color: #bfbfbf;
	--background-top: #080c19;
	--background-rest: #080c19;
	--navbar-color: #1a1e34;
	--post-color: #1a1e34;
	--post-outline-color: #2c3a4e;
	--label-color: #1a1e34;
	--box-border-color: #2c3a4e;
	--darken: #ffffff08;
	--highlighted-post-color: #44283e;
	--highlighted-post-outline-color: #664e5c;
	--board-title: #c10000;
	--hr: #303030;
	--font-color: #bfbfbf;
	--name-color: #67b38d;
	--capcode-color: #ff4141;
	--subject-color: #8f8dc9;
	--link-color: #8585a3;
	--post-link-color: #f65252;
	--link-hover: #f65252;
	--accent-color: #434343;
	--input-borders: #434343;
	--input-color: #bfbfbf;
	--input-background: #080c19;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #0a0;
	--pinktext-color:#E0727F;
}


code:
/*pink*/
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--alt-label-color: #ffcccb;
	--alt-font-color:#80002c;
	--background-top:#ffe4e6;
	--background-rest:#ffe4e6;
	--navbar-color:#ffcccb;
	--post-color:#ffcccb;
	--post-outline-color:#80002c;
	--label-color:#ffcccb;
	--box-border-color:#80002c;
	--darken:#80002c54;
	--highlighted-post-color:#eab5b4;
	--highlighted-post-outline-color:#80002c;
	--board-title:#80002c;
	--hr:#80002c;
	--font-color:#80002c;
	--name-color:#b3003e;
	--capcode-color:#f00;
	--subject-color:#e60050;
	--link-color:#80002c;
	--post-link-color:#80002c;
	--link-hover:#c48899;
	--accent-color:#80002c;
	--input-borders:#80002c;
	--input-color:#80002c;
	--input-background:#ffe6ea;
	--dice-color:darkorange;
	--title-color:#d70000;
	--greentext-color:#789922;
	--pinktext-color:#FF00EF;
}
.post-container:not(.op), .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats,#float, table, .collapse, .bottom-reply {
	box-shadow: 3px 3px 3px var(--darken);
}
hr {
	height: 0px;
	border-width: 2px medium medium;
	border-style: dashed none none;
	border-color: var(--post-outline-color);
}
.anchor:target + .post-container,
.post-container.highlighted,
.anchor:target + table tbody tr th,
.anchor:target + table {
	border: 1px dashed;
}

@media only screen and (max-width: 600px) {

	.post-info{
		background: none;
		border-bottom: none;
	}

	.anchor:target + .post-container .post-info, .post-container.highlighted .post-info {
		border-bottom: none;
	}

}


code:
/* from ptchan with love */

:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #800;
	--alt-font-color: #fff;
	--background-top: #fed6af90;
	--background-rest: #ffe;
	--navbar-color: #f0e0d6;
	--post-color: #f0e0d6;
	--post-outline-color: #d9bfb7;
	--label-color: #EA8;
	--box-border-color: #000;
	--darken: #ead6ca;
	--highlighted-post-color: #f0c0b0;
	--highlighted-post-outline-color: #d99f91;
	--board-title: #af0a0f;
	--hr: #D9BFB7;
	--font-color: #800000;
	--name-color: #117743;
	--capcode-color: #f00;
	--subject-color: #f00;
	--link-color: #800;
	--post-link-color: navy;
	--link-hover: #f00;
	--accent-color: #EA8;
	--input-borders: #a9a9a9;
	--input-color: #000;
	--input-background: white;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color:#E0727F;
}

.post-container, #float .post-container, .stickynav, .pages, .toggle-summary, .catalog-tile, #livetext, #threadstats {
	border-width: 0 1px 1px 0;
}
a.quote {
    color:var(--post-link-color);
}

.alt {
    background: var(--label-color);
    color: var(--font-color);
}

td, th {
    padding: 5px;
    overflow-wrap: anywhere;
    padding: 6px;
}

table {
    background: var(--background-rest);
    border: 1px solid var(--highlighted-post-color);
    border-radius: 5px;
}

#float .post-container, #livetext, #threadstats, .catalog-tile, .pages, .post-container, .stickynav, .toggle-summary {
    border-width: 1px 1px 1px 1px;
    border-radius: 5px;
}

.post-container {
    padding: 10px;
}

.toggle-summary {
    padding: 13px;
}

#postform {

    border-radius: 5px;
}

#dragHandle {

    border-radius: 5px;
}

.label, .rlabel {
	border: none;
    border-radius: 5px;
    padding: 5px;
}

.modal {

    border-radius: 5px;
    padding: 5px;
}

.post-date{
    opacity: 0.5;
}

img {
    border-radius: 5px;
}

video {
    border-radius: 5px;
}

@media only screen and (max-width: 600px) {
.post-info {
    background: var(--darken);
    margin: -6.5px -6.5px 5px -6.5px;
    border-bottom: 1px solid var(--post-outline-color);
    border-radius: 5px;
}

.container {
    padding: 5px;

}
}

.user-id {
    text-shadow: none;
    color: #fff;
    padding: 1px 5px;
    border: none;
    border-radius: 5px;
}

.bottom-reply {
    border-radius: 5px;
}

.collapse {
    border-radius: 5px;
}

body {
    background: url(/css/themes/assets/ptchan-bg.png) repeat 0 0 #ffe
}


code:
/*rei-zero*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #29373e;
	--alt-font-color: #d6d6d6;
	--background-top: #000E1C;
	--background-rest: #000E1C;
	--navbar-color: #29373E;
	--post-color: #29373E;
	--post-outline-color: #666666;
	--label-color: #29373E;
	--box-border-color: #000;
	--darken: #00000010;
	--highlighted-post-color: #193A3A;
	--highlighted-post-outline-color: #999999;
	--board-title: #193A3A;
	--hr: #474747;
	--font-color: #D6D6D6;
	--name-color: #117743;
	--capcode-color: #f00;
	--subject-color: #CCCCCC;
	--link-color: #5C99AD;
	--post-link-color: #00BfFF;
	--link-hover: #eeeeee;
	--accent-color: #29373E;
	--input-borders: #a9a9a9;
	--input-color: lightgray;
	--input-background: #001229;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color:#E0727F;
}


code:
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color:#2d2d86;
	--alt-font-color:#f2f2f2;
	--background-top:#19194d;
	--background-rest:#19194d;
	--navbar-color:#2d2d86;
	--post-color:#262673;
	--post-outline-color:#262673;
	--label-color:#2d2d86;
	--box-border-color:#000000;
	--darken:#ffffff10;
	--highlighted-post-color:#3636a6;
	--highlighted-post-outline-color:#111;
	--board-title:#c5c8c6;
	--hr:#282a2e;
	--font-color:#f2f2f2;
	--name-color:#117743;
	--capcode-color:red;
	--subject-color:#6666CC;
	--link-color:white;
	--post-link-color:red;
	--link-hover:#f2f2f2;
	--accent-color:#2d2d86;
	--input-borders:black;
	--input-color:black;
	--input-background:white;
	--dice-color:darkorange;
	--title-color:#d70000;
	--greentext-color:#789922;
	--pinktext-color:#E0727F;
}
.post-message a:hover {
	color:var(--post-link-color)!important;
}
.postform-style {
	color:black
}
.post-info, .post-container:target .post-info, .post-container.highlighted .post-info {
	background:none!important;border:none!important
}


code:
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--alt-label-color: #800;
	--alt-font-color: #fff;
	--background-top: #002b36;
	--background-rest: #002b36;
	--navbar-color: #002b36;
	--post-color: #073642;
	--post-outline-color: #586e75;
	--label-color: #073642;
	--box-border-color: #586e75;
	--darken: #00000010;
	--highlighted-post-color: #002b36;
	--highlighted-post-outline-color: #cb4b16;
	--board-title: #dc322f;
	--hr: #93a1a1;
	--font-color: #839496;
	--name-color: #b58900;
	--capcode-color: #f00;
	--subject-color: #b58900;
	--link-color: #839496;
	--post-link-color: #268bd2;
	--link-hover: #2aa198;
	--accent-color: #073642;
	--input-borders: #586e75;
	--input-color: #839496;
	--input-background: #002b36;
	--dice-color: #D33682;
	--title-color: #dc322f;
	--greentext-color: #789922;
	--pinktext-color: #d33682;
}
.bold {
	color: #93a1a1;
}
.em {
	color: #586e75;
}
img[src='/file/dice.png'] {
	filter: hue-rotate(290deg)
}


code:
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--alt-label-color: #EEE8D5;
	--alt-font-color: #657B83;
	--background-top: #FDF6E3;
	--background-rest: #FDF6E3;
	--navbar-color: #EEE8D5;
	--post-color: #EEE8D5;
	--post-outline-color: #93A1A1;
	--label-color: #EEE8D5;
	--box-border-color: #93A1A1;
	--darken: #00000010;
	--highlighted-post-color: #FDF6E3;
	--highlighted-post-outline-color: #cb4b16;
	--board-title: #dc322f;
	--hr: #93a1a1;
	--font-color: #657B83;
	--name-color: #b58900;
	--capcode-color: #f00;
	--subject-color: #b58900;
	--link-color: #657B83;
	--post-link-color: #268bd2;
	--link-hover: #2aa198;
	--accent-color: #EEE8D5;
	--input-borders: #93A1A1;
	--input-color: #657B83;
	--input-background: #FDF6E3;
	--dice-color: #D33682;
	--title-color: #dc322f;
	--greentext-color: #789922;
	--pinktext-color: #d33682;
}
.bold {
	color: #93a1a1;
}
.em {
	color: #586e75;
}
img[src='/file/dice.png'] {
	filter: hue-rotate(290deg)
}


code:
:root {
	--accent-color: #cb9fac;
	--input-borders: #140e10;
	--input-color: #cb9fac;
	--input-background: #1e1415;
	--input-alt-borders: #99719c;
	--input-alt-color: hsl(342.3, 29.7%, 71%);
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(295deg) brightness(93%) contrast(120%);
	--darken: #00000010;
	--capcode-color: #bd758d;
	--dice-color: darkorange;
	--pinktext-color: #E0727F;
	--label-color: #241c1e;
	--box-border-color: #140e10;
	--link-color: palevioletred;
	--post-link-color: palevioletred;
	--link-hover: pink;
	--board-title: rgba(0, 0, 0, 0);
	--subject-color: #aa00a9;
	--hr: #582d3d;
	--name-color: #bd758d;
	--font-color: hsl(342, 30%, 71%);
	--post-color: #301821;
	--post-outline-color: #40232e;
	--highlighted-post-color: #301821;
	--highlighted-post-outline-color: #40232e;
	--title-color: red;
	--greentext-color: #4f9234;
	--spoiler-bg-color: #120c0d;
	--spoiler-hover-color: #dcd9d9;
	--spoiler-bg-color-op: #584453;
}

body {
	background: #140e10 url(/css/themes/assets/tchan-bg.png);
	font-family: trebuchet ms,Tahoma,Verdana,Arial,sans-serif;
	font-size: 13.3333px!important
}

.postmenu {
	border: none;
	background: url(/css/themes/assets/tchan-star.png) no-repeat;
	display: inline-block;
	height: 19px;
	width: 17px;
	vertical-align: bottom;
	margin-left: 5px
}

a.post-name {
	color: red!important;
	font-size: 0;
	text-decoration: none
}

a.post-name:before {
	content: 'SAGE!';
	font-size: 13px;
	text-decoration: none
}

.you::after {
	margin-left: 3px;
	content: "(You)";
	font-weight: lighter;
	font-style: italic;
	font-size: 13px;
	color: var(--name-color)
}

.spoiler {
	background: var(--spoiler-bg-color);
	color: transparent
}

.spoiler:hover {
	color: var(--spoiler-hover-color)
}

.post-container.op .spoiler {
	background: var(--spoiler-bg-color-op)
}

.captcha {
	border-radius: 5px;
	filter: invert(80%) sepia(15%) saturate(557%) hue-rotate(280deg) brightness(80%) contrast(120%)
}

.post-capcode {
	color: #bd758d!important;
	font-weight: 700!important
}

.post-capcode:after {
	color: #bd758d!important;
	font-weight: 700!important;
	text-shadow: none;
	content: '';
	background: url(/css/themes/assets/tchan-capcode.png) 0 0 no-repeat;
	background-size: cover;
	width: 15px!important;
	height: 16px!important;
	display: inline-block;
	margin-left: 5px
}

.board-title {
	font-weight: 700;
	background-attachment: scroll;
	background-clip: text;
	-webkit-background-clip: text;
	background-color: rgba(0,0,0,0);
	background-image: linear-gradient(to right,red,#ffa600,#fff500,#06ff00,#00c9ff,#2300ff,#ff00fa,red);
	background-size: 200%;
	animation: heading 1s linear infinite
}

@keyframes heading {
	to {
		background-position: 200% center
	}
}

.navbar {
	background: 0 0;
	border: none;
	box-shadow: none;
	position: absolute;
	color: var(--font-color)
}

.navbar a {
	color: var(--link-color)
}

.detected {
	background: linear-gradient(to right,red,#ffa600,#fff500,#06ff00,#00c9ff,#2300ff,#ff00fa,red);
	background-size: 200% auto;
	color: #000;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: 700;
	animation: heading 1s linear infinite!important;
	font-family: trebuchet ms,Tahoma,Verdana,Arial,sans-serif!important;
	font-size: 100%!important
}

.pinktext {
	font-weight: 400;
	font-family: trebuchet ms,Tahoma,Verdana,Arial,sans-serif!important;
	font-size: x-large;
	color: #cb9eac
}

.close.postform-style,input,select,textarea {
	font-family: trebuchet ms,Tahoma,Verdana,Arial,sans-serif!important;
	font-size: 13.3333px!important;
	border-radius: 5px!important
}

.postform-style,input,select,textarea {
	font-family: trebuchet ms,Tahoma,Verdana,Arial,sans-serif!important;
	font-size: 13.3333px!important;
	border-radius: 5px!important
}

.modal a.button {
	color: var(--link-color)!important
}

.modal a.button:hover {
	color: var(--link-hover)!important
}

input[type=submit] {
	padding: 3px 4px;
	min-height: unset!important
}

input[type=file],input[type=number],input[type=password],input[type=range],input[type=text],textarea {
	border-width: 2px!important
}

.close.postform-style,input[type=button],input[type=submit],select {
	border-width: 1px!important;
	border-color: var(--input-alt-borders)!important;
	color: var(--input-alt-color)!important
}

#float .post-container,#livetext,#postform,#threadstats,.catalog-tile,.modal,.pages,.post-container,.stickynav,#action-menu, .collapse, .bottom-reply {
	border-radius: 4px;
	border-style: solid none none solid;
	border-width: 1px;
	box-shadow: 2px 2px 1px #120c0d
}

.post-container.op {
	box-shadow: unset
}

#postform {
	padding: 4px
}

#postform-dragHandle {
	border-radius: 4px
}

.file-thumb,.post-file-src * {
	max-width: 90vw;
	border-radius: 5px
}

.file-thumb {
	box-shadow: 0 1px 4px rgba(0,0,0,.2)
}

.post-container {
	padding-right: 3em;
	padding-top: .3em;
	padding-bottom: .5em;
	padding-left: .7em
}

.post-file-info {
	font-size: smaller;
	text-align: left;
	max-width: 150px
}

.post-file {
	align-items: start
}

.filelabel,div.label,textarea {
	border-radius: 5px;
	border-width: 2px
}

tr {
	background: var(--input-background);
	color: var(--input-color)
}

.board-banner {
	border: 2px solid #cb9fac;
	border-radius: 10px
}

.code {
	background-color: var(--spoiler-bg-color)!important;
	border-radius: 5px;
	border: var(--spoiler-bg-color)!important
}

.spoiler:not(:hover) * {
	background: var(--spoiler-bg-color)!important;
	color: transparent
}

.spoiler {
	cursor: auto
}

.spoiler:hover a {
	color: var(--spoiler-hover-color)!important
}

.post-container.op .spoiler:not(:hover) * {
	background: var(--spoiler-bg-color-op)!important
}

.anchor:target+.catalog-tile,.anchor:target+.post-container,.anchor:target+table,.anchor:target+table tbody tr th,.post-container.highlighted,.post-container.hoverhighlighted {
	outline: 2px dashed #cb9fac
}


code:
/* from ptchan with love */

:root {
	--icon-color: invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #040404;
	--alt-font-color: #e8eaf6;
	--background-top: #000;
	--background-rest: #000;
	--navbar-color: #040404;
	--post-color: #000;
	--post-outline-color: #111;
	--label-color: #040404;
	--box-border-color: #111;
	--darken: #040404;
	--highlighted-post-color: #000;
	--highlighted-post-outline-color: #444;
	--board-title: #e8eaf6;
	--hr: #040404;
	--font-color: #e8eaf6;
	--name-color: #e8eaf6;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: white;
	--post-link-color: #5f89ac;
	--link-hover: #81a2be;
	--accent-color: #e8eaf6;
	--input-borders: #111;
	--input-color: #e8eaf6;
	--input-background: #040404;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: lime;
	--pinktext-color: magenta;
}

.spoiler {
	background: gray;
	color: azuregray;
}

.spoiler:not(:hover) * {
	color: gray;
	background: gray !important;
}

.post-info, .post-container:target .post-info, .post-container.highlighted .post-info {
	background: none !important;
    border: none !important
}

@font-face {
    font-family: VCR OSD Mono;
    src: url(/css/themes/assets/VCR-OSD-Mono.ttf);
}

* {
    font-family: 'VCR OSD Mono', sans-serif !important;
}

body {
    background: black !important;
    width: 80%;
    margin: auto;
    font-size: medium;
}

a {
    text-decoration: none !important;
	color: var(--link-color) !important;
}

th {
    text-transform: uppercase;
}

tr:nth-child(2n) * {
    color: yellow;
}

.bold {
	color: var(--link-color) !important;
}

.navbar {
    width: inherit;
}

.navbar .nav-item {
    text-transform: uppercase;
}

.board-title {
    background-color: black;
    color: white;
    text-transform: uppercase;
    border: 6px solid red;
    width: 60%;
    margin: auto;
    letter-spacing: 0.5em;
    padding: 10px;
}

.no-m-p  {
    background-color: blue;
    color: var(--font-color) !important;
    padding: 10px 10px;
}

.footer {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    align-content: space-between;
    justify-content: space-between;
    background-color: black;
    font-size: 0; /* This a trick used to hide the bullet points that aren't encapsulated by tags */
    line-height: normal;
}

.footer a {
    color: blue !important;
    flex: 1;
    text-transform: uppercase;
    font-size: initial;
	padding: 5px 0;
}

.footer > div {
    line-break: after;
    color: red;
    font-size: initial;
    padding: 10px 0;
}

.footer a:nth-child(4n + 1) {
    background-color: red;
    color: white !important;
}

.footer a:nth-child(4n + 2) {
    background-color: lime;
}

.footer a:nth-child(4n + 3) {
    background-color: yellow;
}

.footer a:nth-child(4n + 4) {
    background-color: cyan;
}


code:
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--alt-label-color: #260E22;
	--alt-font-color: #c5c8c6;
	--background-top: #260E22;
	--background-rest: #090A18;
	--navbar-color: #260E22;
	--post-color: #260E22;
	--post-outline-color: #090A18;
	--label-color: #260E22;
	--box-border-color: #111;
	--darken: #00000050;
	--highlighted-post-color: #54264C;
	--highlighted-post-outline-color: #111;
	--board-title: #c5c8c6;
	--hr: #282a2e;
	--font-color: #c5c8c6;
	--name-color: #c5c8c6;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: #c5c8c6;
	--post-link-color: #5f89ac;
	--link-hover: #81a2be;
	--accent-color: #c5c8c6;
	--input-borders: #111;
	--input-color: #c5c8c6;
	--input-background: #090A18;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color: #E0727F;
}
#float .post-container, div#livetext, div#threadstats, .catalog-tile,
nav.pages, div.pages, .post-container:not(.op), nav.stickynav,
summary#action-menu, table, div.catalog-tile, div.highlighted,
div.hoverhighlighted, a#action-menu, .board-banner, .collapse, bottom-reply {
	border-width: 1px;
	border-radius: 2px;
}
input[type], textarea, .label, .rlabel, button, select:not(.postmenu),
.close, #settingsmodal, .postform-style, img, .spoiler, .code, .mono,
.detected, #postform {
	border-radius: 2px;
}
table {
	box-shadow: 0 0 3px #00000040;
}
.post-container.op {
	border-width: 1px;
}
.post-check {
	opacity: 0;
	margin-right: -1em;
	transition: opacity 100ms, margin-right 100ms;
}
.post-check:hover {
	opacity: 1;
	margin-right: unset;
}
.post-file-info {
	overflow-wrap: anywhere;
}
.spoiler {
	padding: 0 1px
}
.wrapbar + hr:first-of-type {
	margin: 1px 0 0 0;
}
body, small, .post-file-info, .quote, input, textarea {
	font-family: monospace!important;
	font-size: 9pt!important;
}


code:
/*tomorrow*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #282a2e;
	--alt-font-color: #c5c8c6;
	--background-top: #1d1f21;
	--background-rest: #1d1f21;
	--navbar-color: #282a2e;
	--post-color: #282a2e;
	--post-outline-color: #282a2e;
	--label-color: #282a2e;
	--box-border-color: #111;
	--darken: #ffffff10;
	--highlighted-post-color: #2b1d1f;
	--highlighted-post-outline-color: #111;
	--board-title: #c5c8c6;
	--hr: #282a2e;
	--font-color: #c5c8c6;
	--name-color: #c5c8c6;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: #c5c8c6;
	--post-link-color: #5f89ac;
	--link-hover: #81a2be;
	--accent-color: #c5c8c6;
	--input-borders: #111;
	--input-color: #c5c8c6;
	--input-background: #1d1d21;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color:#E0727F;
}

table {
	border: none;
	border-spacing: 2px;
}

.captcha {
	filter: invert(90%);
}

.box-wrap, .tabs li a {
	border: 1px solid var(--box-border-color);
}

@media only screen and (max-width: 600px) {

	.post-info{
		border-bottom: none;
	}

	.anchor:target + .post-container .post-info, .post-container.highlighted .post-info {
		border-bottom: none;
	}

}


code:
/*tomorrow*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #282a2e;
	--alt-font-color: #c5c8c6;
	--background-top: #1d1f21;
	--background-rest: #1d1f21;
	--navbar-color: #282a2e;
	--post-color: #282a2e;
	--post-outline-color: #282a2e;
	--label-color: #282a2e;
	--box-border-color: #111;
	--darken: #ffffff10;
	--highlighted-post-color: #2b1d1f;
	--highlighted-post-outline-color: #111;
	--board-title: #c5c8c6;
	--hr: #282a2e;
	--font-color: #c5c8c6;
	--name-color: #c5c8c6;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: #c5c8c6;
	--post-link-color: #5f89ac;
	--link-hover: #81a2be;
	--accent-color: #c5c8c6;
	--input-borders: #111;
	--input-color: #c5c8c6;
	--input-background: #1d1d21;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color:#E0727F;
}

.anchor:target + .post-container, .post-container.highlighted {
	border: 1px solid var(--highlighted-post-outline-color) !important;
}

#float .post-container, #livetext, #threadstats, .navbar, .catalog-tile, .pages, .post-container, .stickynav, .collapse, .bottom-reply {
	border-width: 1px!important;
	border-color: var(--box-border-color)!important;
}

.navbar{
	box-shadow: 0 0 3px 0px #00000030;
}

.post-container.op {
	border-color: transparent!important;
}

table {
	border-spacing: 0px;
}

tr:nth-child(2n+1) {
	background: unset;
}

.captcha {
	filter: invert(90%);
}

.box-wrap, .tabs li a {
	border: 1px solid var(--box-border-color);
}

@media only screen and (max-width: 600px) {

	.post-info{
		background: none;
		border-bottom: none;
	}

	.anchor:target + .post-container .post-info, .post-container.highlighted .post-info {
		border-bottom: none;
	}

}


code:
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--alt-label-color: #2d3351;
	--alt-font-color: #9ac6c9;
	--background-top: #232840;
	--background-rest: #232840;
	--navbar-color: #2d3351;
	--post-color: #2d3351;
	--post-outline-color: #232840;
	--label-color: #2d3351;
	--box-border-color: #232840;
	--darken: #ffffff00;
	--highlighted-post-color: #2d3351;
	--highlighted-post-outline-color: #9ac6c9;
	--board-title: #c5c8c6;
	--hr: #2d3351;
	--font-color: #9ac6c9;
	--name-color: #c5c8c6;
	--capcode-color: #f00;
	--subject-color: #b294bb;
	--link-color: #f649a7;
	--post-link-color: #f649a7;
	--link-hover: #f649a7;
	--accent-color: #c5c8c6;
	--input-borders: #232840;
	--input-color: #c5c8c6;
	--input-background: #2d3351;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color: #E0727F;
}
body {
	font-family: monospace;
}
.highlighted {
	border: 1px dashed var(--highlighted-post-outline-color)
}
a:hover {
	position: relative;
	text-shadow: 0 2px 10px rgba(246,73,167,.9);
}
a, .board-title {
	text-decoration: none;
	text-shadow: 0 2px 3px rgba(246,73,167,.5);
	font-weight: 800;
	transition: all .3s ease;
	position: relative;
}
a:hover::before {
	transform-origin: bottom left;
	transform: scaleX(1);
}
a::before {
	content: "";
	bottom: 0;
	left: 0;
	right: 0;
	position: absolute;
	height: 2px;
	background-color: #f649a7;
	transform-origin: bottom right;
	transform: scaleX(0);
	transition: transform .5s ease;
	box-shadow: 0 2px 5px rgba(246,73,167,.6);
	overflow: hidden;
}
a:active, a:hover {
	outline-width: 0;
}
.captcha {
	filter: invert(90%) sepia(100%) saturate(100) hue-rotate(194deg);
}


code:
:root {
	--icon-color: invert(17%) sepia(89%) saturate(7057%) hue-rotate(2deg) brightness(93%) contrast(120%);
	--darken: #ffffff10;
	--board-title: white;
	--hr: #282a2e;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color: #E0727F;
	--alt-label-color: darkblue;
	--alt-font-color: white;
	--background-top: #008080;
	--background-rest: #008080;
	--navbar-color: #c0c0c0;
	--post-color: #c0c0c0;
	--post-outline-color: #c0c0c0;
	--label-color: transparent;
	--box-border-color: transparent;
	--highlighted-post-color: #c0c0c0;
	--highlighted-post-outline-color: #c0c0c0;
	--font-color: black;
	--post-link-color: blue;
	--link-color: #fffff50;
	--link-hover: #555;
	--accent-color: grey;
	--input-borders: #111;
	--input-color: black;
	--input-background: white;
	--name-color: #ddd;
	--capcode-color: #f00;
	--subject-color: #ddd;
}
.flag {
	image-rendering:pixelated;
}
.post-container:not(.op), #float .post-container, .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats, .navbar, #postform, .op, table, .board-banner, .filelabel, .modal, .collapse, .bottom-reply {
	border: 2px outset lightgray!important;
}
input[type=button],
input[type=file],
input[type=number],
input[type=password],
input[type=range],
input[type=text],
select,
textarea,
.postform-style,
.code {
	 border:2px inset var(--post-color);
}
#postform {
	padding: 2px
}
.nav-item {
	line-height: 1.75em!important;
	margin: 2px;
}
.nav-item, .close, input[type=submit], .filelabel {
	color:black;
	background: transparent;
	border: 2px outset lightgray;
}
.close {
	font-weight: bold
}
.navbar a {
	color:black;
}
.anchor:target+.post-container .post-info, .post-container.highlighted .post-info, .post-container.hoverhighlighted .post-info, .anchor:target+table tbody tr th	{
	background: darkblue!important;
	color: white!important;
}
.op, .board-banner {
	background: var(--post-color)!important;
}
.navbar {
	top:unset!important;
	bottom: -3px;
}
.navbar a:first-of-type::before {
	content:'';
	position:absolute;
	background: url(/css/themes/assets/win95home.png);
	background-size: contain;
	height: 1.75em;
	width: 1.75em;
	left: 7px;
}
.navbar a:first-of-type {
	padding-left: 30px
}
.stickynav {
	top: 5px;
	bottom: unset
}
main {
	margin: 0;
}
table {
	background: var(--post-color);
	border-spacing:0;
}
.post-info, #postform-dragHandle, th:not(.alt){
	font-weight: bold;
	color: #ddd;
	background: #808080!important;
}
th a {
	color: #ddd!important;
}
hr {
	border-top: 2px ridge var(--post-outline-color);
}
.post-info {
	margin: -6px -6px 0px;
	padding: 3px 5px 3px 3px;
}
.board-description {
	color:var(--board-title)
}
.modal {
	padding:3px;
}
input[type=submit], input[type=submit], label[for=file] {
	background: var(--post-color)!important;
}
.footer {
	padding-bottom: 3em;
}
@media only screen and (max-width:600px) {
	.nav-item {
		padding-left: 5px;
		padding-right: 5px;
	}
}
.nav-item .rainbow {
	display: inline;
}
.catalog-thumb {
	margin-top:5px;
}
.op, .op .post-info {
	background:none!important;
}
.op .post-info {
	color:white;
}
.op .post-name {
	color:white;
}
.op.post-subject {
    color: white!important;
}
.op {
	border:2px outset transparent!important;
	--greentext-color:#3ae03a;
	--font-color:white;
	--subject-color: white;
	color:var(--font-color);
}
.anchor:target+.post-container.op {
	--greentext-color:unset;
	--font-color:black;
}
.op .postmenu {
	border-left-color: white;
}
.postmenu {
	color: black;
	border-left-color: #ddd;
}
.box-wrap, .tabs li a {
	border: 2px solid var(--post-outline-color);
	background: var(--post-color)!important;
}
.box-wrap .col {
	background: var(--post-color)!important;
}
#tab-10:target a[href="#tab-10"], #tab-1:target a[href="#tab-1"], #tab-2:target a[href="#tab-2"], #tab-3:target a[href="#tab-3"], #tab-4:target a[href="#tab-4"], #tab-5:target a[href="#tab-5"], #tab-6:target a[href="#tab-6"], #tab-7:target a[href="#tab-7"], #tab-8:target a[href="#tab-8"], #tab-9:target a[href="#tab-9"] {
  border: 2px inset var(--post-color);
}


code:
/*yotsuba b*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #98E;
	--alt-font-color: black;
	--background-top: #d6daf0;
	--background-rest: #eef2ff;
	--navbar-color: #D6DAF0;
	--post-color: #D6DAF0;
	--post-outline-color: #B7C5D9;
	--label-color: #98E;
	--box-border-color: #000;
	--darken: #00000010;
	--highlighted-post-color: #d6bad0;
	--highlighted-post-outline-color: #ba9dbf;
	--board-title: #af0a0f;
	--hr: lightgray;
	--font-color: black;
	--name-color: #117743;
	--capcode-color: #f00;
	--subject-color: #0F0C5D;
	--link-color: #34345C;
	--post-link-color: #d00;
	--link-hover: #d00;
	--input-borders: #a9a9a9;
	--input-color: #000;
	--input-background: white;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: green;
	--pinktext-color:#E0727F;
}

.post-container, #float .post-container, .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats, .collapse, .bottom-reply {
	border-width: 0 1px 1px 0;
}


code:
/*yotsuba b*/
:root {
	--icon-color:invert(17%)sepia(89%)saturate(7057%)hue-rotate(2deg)brightness(93%)contrast(120%);
	--alt-label-color: #800;
	--alt-font-color: #fff;
	--background-top: #fed6af90;
	--background-rest: #ffe;
	--navbar-color: #f0e0d6;
	--post-color: #f0e0d6;
	--post-outline-color: #d9bfb7;
	--label-color: #fca;
	--box-border-color: #000;
	--darken: #ead6ca;
	--highlighted-post-color: #f0c0b0;
	--highlighted-post-outline-color: #d99f91;
	--board-title: #af0a0f;
	--hr: #D9BFB7;
	--font-color: #800000;
	--name-color: #117743;
	--capcode-color: #f00;
	--subject-color: #f00;
	--link-color: #800;
	--post-link-color: navy;
	--link-hover: #f00;
	--accent-color: #800000;
	--input-borders: #a9a9a9;
	--input-color: #000;
	--input-background: white;
	--dice-color: darkorange;
	--title-color: #d70000;
	--greentext-color: #789922;
	--pinktext-color:#E0727F;
}

.post-container, #float .post-container, .stickynav, .pages, #action-menu, .catalog-tile, #livetext, #threadstats, .collapse, .bottom-reply {
	border-width: 0 1px 1px 0;
}

tr, tr:nth-child(2n+1) {
    background: #fff;
}


code:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns:ev="http://www.w3.org/2001/xml-events"
	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 318.6 318.6"
	 style="enable-background:new 0 0 318.6 318.6;" xml:space="preserve">
<style type="text/css">
	.st0{fill:#E2761B;stroke:#E2761B;stroke-linecap:round;stroke-linejoin:round;}
	.st1{fill:#E4761B;stroke:#E4761B;stroke-linecap:round;stroke-linejoin:round;}
	.st2{fill:#D7C1B3;stroke:#D7C1B3;stroke-linecap:round;stroke-linejoin:round;}
	.st3{fill:#233447;stroke:#233447;stroke-linecap:round;stroke-linejoin:round;}
	.st4{fill:#CD6116;stroke:#CD6116;stroke-linecap:round;stroke-linejoin:round;}
	.st5{fill:#E4751F;stroke:#E4751F;stroke-linecap:round;stroke-linejoin:round;}
	.st6{fill:#F6851B;stroke:#F6851B;stroke-linecap:round;stroke-linejoin:round;}
	.st7{fill:#C0AD9E;stroke:#C0AD9E;stroke-linecap:round;stroke-linejoin:round;}
	.st8{fill:#161616;stroke:#161616;stroke-linecap:round;stroke-linejoin:round;}
	.st9{fill:#763D16;stroke:#763D16;stroke-linecap:round;stroke-linejoin:round;}
</style>
<polygon class="st0" points="274.1,35.5 174.6,109.4 193,65.8 "/>
<g>
	<polygon class="st1" points="44.4,35.5 143.1,110.1 125.6,65.8 	"/>
	<polygon class="st1" points="238.3,206.8 211.8,247.4 268.5,263 284.8,207.7 	"/>
	<polygon class="st1" points="33.9,207.7 50.1,263 106.8,247.4 80.3,206.8 	"/>
	<polygon class="st1" points="103.6,138.2 87.8,162.1 144.1,164.6 142.1,104.1 	"/>
	<polygon class="st1" points="214.9,138.2 175.9,103.4 174.6,164.6 230.8,162.1 	"/>
	<polygon class="st1" points="106.8,247.4 140.6,230.9 111.4,208.1 	"/>
	<polygon class="st1" points="177.9,230.9 211.8,247.4 207.1,208.1 	"/>
</g>
<g>
	<polygon class="st2" points="211.8,247.4 177.9,230.9 180.6,253 180.3,262.3 	"/>
	<polygon class="st2" points="106.8,247.4 138.3,262.3 138.1,253 140.6,230.9 	"/>
</g>
<polygon class="st3" points="138.8,193.5 110.6,185.2 130.5,176.1 "/>
<polygon class="st3" points="179.7,193.5 188,176.1 208,185.2 "/>
<g>
	<polygon class="st4" points="106.8,247.4 111.6,206.8 80.3,207.7 	"/>
	<polygon class="st4" points="207,206.8 211.8,247.4 238.3,207.7 	"/>
	<polygon class="st4" points="230.8,162.1 174.6,164.6 179.8,193.5 188.1,176.1 208.1,185.2 	"/>
	<polygon class="st4" points="110.6,185.2 130.6,176.1 138.8,193.5 144.1,164.6 87.8,162.1 	"/>
</g>
<g>
	<polygon class="st5" points="87.8,162.1 111.4,208.1 110.6,185.2 	"/>
	<polygon class="st5" points="208.1,185.2 207.1,208.1 230.8,162.1 	"/>
	<polygon class="st5" points="144.1,164.6 138.8,193.5 145.4,227.6 146.9,182.7 	"/>
	<polygon class="st5" points="174.6,164.6 171.9,182.6 173.1,227.6 179.8,193.5 	"/>
</g>
<polygon class="st6" points="179.8,193.5 173.1,227.6 177.9,230.9 207.1,208.1 208.1,185.2 "/>
<polygon class="st6" points="110.6,185.2 111.4,208.1 140.6,230.9 145.4,227.6 138.8,193.5 "/>
<polygon class="st7" points="180.3,262.3 180.6,253 178.1,250.8 140.4,250.8 138.1,253 138.3,262.3 106.8,247.4 117.8,256.4
	140.1,271.9 178.4,271.9 200.8,256.4 211.8,247.4 "/>
<polygon class="st8" points="177.9,230.9 173.1,227.6 145.4,227.6 140.6,230.9 138.1,253 140.4,250.8 178.1,250.8 180.6,253 "/>
<g>
	<polygon class="st9" points="278.3,114.2 286.8,73.4 274.1,35.5 177.9,106.9 214.9,138.2 267.2,153.5 278.8,140 273.8,136.4
		281.8,129.1 275.6,124.3 283.6,118.2 	"/>
	<polygon class="st9" points="31.8,73.4 40.3,114.2 34.9,118.2 42.9,124.3 36.8,129.1 44.8,136.4 39.8,140 51.3,153.5 103.6,138.2
		140.6,106.9 44.4,35.5 	"/>
</g>
<polygon class="st6" points="267.2,153.5 214.9,138.2 230.8,162.1 207.1,208.1 238.3,207.7 284.8,207.7 "/>
<polygon class="st6" points="103.6,138.2 51.3,153.5 33.9,207.7 80.3,207.7 111.4,208.1 87.8,162.1 "/>
<polygon class="st6" points="174.6,164.6 177.9,106.9 193.1,65.8 125.6,65.8 140.6,106.9 144.1,164.6 145.3,182.8 145.4,227.6
	173.1,227.6 173.3,182.8 "/>
</svg>


code:
function pug_attr(t,e,n,r){if(!1===e||null==e||!e&&("class"===t||"style"===t))return"";if(!0===e)return" "+(r?t:t+'="'+t+'"');var f=typeof e;return"object"!==f&&"function"!==f||"function"!=typeof e.toJSON||(e=e.toJSON()),"string"==typeof e||(e=JSON.stringify(e),n||-1===e.indexOf('"'))?(n&&(e=pug_escape(e))," "+t+'="'+e+'"'):" "+t+"='"+e.replace(/'/g,"'")+"'"}
function pug_escape(e){var a=""+e,t=pug_match_html.exec(a);if(!t)return e;var r,c,n,s="";for(r=t.index,c=0;r<a.length;r++){switch(a.charCodeAt(r)){case 34:n=""";break;case 38:n="&";break;case 60:n="<";break;case 62:n=">";break;default:continue}c!==r&&(s+=a.substring(c,r)),c=r+1,s+=n}return c!==r?s+a.substring(c,r):s}
var pug_match_html=/["&<>]/;function banmessage(locals) {var pug_html = "", pug_mixins = {}, pug_interp;;
    var locals_for_with = (locals || {});

    (function (__, banmessage) {
      pug_mixins["banmessage"] = pug_interp = function(banmessage){
var block = (this && this.block), attributes = (this && this.attributes) || {};
pug_html = pug_html + "\u003Cp class=\"ban\"\u003E\u003Cspan class=\"message\"\u003E" + (pug_escape(null == (pug_interp = __('USER WAS BANNED FOR THIS POST')) ? "" : pug_interp)) + "\u003C\u002Fspan\u003E \u003Cspan" + (" class=\"reason\""+pug_attr("data-reason", banmessage, true, false)) + "\u003E" + (pug_escape(null == (pug_interp = banmessage) ? "" : pug_interp)) + "\u003C\u002Fspan\u003E\u003C\u002Fp\u003E";
};
pug_mixins["banmessage"](banmessage);
    }.call(this, "__" in locals_for_with ?
        locals_for_with.__ :
        typeof __ !== 'undefined' ? __ : undefined, "banmessage" in locals_for_with ?
        locals_for_with.banmessage :
        typeof banmessage !== 'undefined' ? banmessage : undefined));
    ;;return pug_html;}


code:
/* globals __ captchaOptions captchaformsection */
const captchaCookieRegex = /captchaid=(.[^;]*)/ig;
class CaptchaController {

	constructor() {
		this.captchaFields = [];
		this.refreshing = false;
	}

	init() {
		this.captchaFields = document.getElementsByClassName('captchafield');
		this.refreshing = false;
		for (let captcha of this.captchaFields) {
			this.setupCaptchaField(captcha);
		}
	}

	captchaAge() {
		const captchaCookieMatch = document.cookie.match(captchaCookieRegex);
		if (!captchaCookieMatch) { return; }
		const cookieParams = new URLSearchParams(captchaCookieMatch[0]);
		const captchaIdCookie = cookieParams.get('captchaid');
		if (captchaIdCookie) {
			const captchaExpiry = new Date(parseInt(captchaIdCookie.slice(0,8),16)*1000);
			return (Date.now() - captchaExpiry);
		}
	}

	startRefreshTimer() {
		clearTimeout(this.refreshTimer); //this wont throw an error if its null, so no need to check
		const captchaAge = this.captchaAge();
		if (captchaAge != null) {
			console.log('Refreshing captcha in ', 300000-captchaAge);
			this.refreshTimer = setTimeout(() => {
				this.refreshCaptchas();
			}, 300000-captchaAge);
		}
	}

	setupCaptchaField(captcha) {
		if (captcha.closest('form').dataset.captchaPreload == 'true') {
			return this.loadCaptcha(captcha);
		}
		if (captchaOptions.type === 'grid' || captchaOptions.type === 'grid2') {
			let hoverListener = captcha.closest('details') || captcha;
			//captcha.parentElement.previousSibling.previousSibling.tagName === 'SUMMARY' ? captcha.parentElement.previousSibling.previousSibling :  captcha.parentElement;
			hoverListener.addEventListener('mouseover', () => this.loadCaptcha(captcha), { once: true });
		} else { //captchaOptions.type === 'text'
			captcha.placeholder = __('focus to load captcha');
			captcha.addEventListener('focus', () => this.loadCaptcha(captcha), { once: true });
		}
	}

	refreshCaptchas(e) {
		if (this.refreshing) {
			return null;
		}
		this.refreshing = true;
		e && e.target.classList.add('spin');
		for (let captchacheck of document.querySelectorAll('input[name="captcha"]')) {
			captchacheck.checked = false;
		}
		document.cookie = 'captchaid=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
		const xhr = new XMLHttpRequest();
		xhr.onload = () => {
			this.startRefreshTimer();
			for (let captcha of this.captchaFields) {
				const existingImage = captcha.previousSibling.children[0];
				if (existingImage) {
					captcha.previousSibling.children[0].src = xhr.responseURL;
				} else {
					this.loadCaptcha(captcha, xhr.responseURL);
				}
			}
			this.refreshing = false;
			e && e.target.classList.remove('spin');
		};
		xhr.onerror = () => {
			this.refreshing = false;
			e && e.target.classList.remove('spin');
		};
		xhr.open('GET', '/captcha', true);
		xhr.send(null);
	}

	removeCaptcha() {
		const postForm = document.getElementById('postform');
		const captchaField = postForm.querySelector('.captcha');
		if (captchaField) {
			//delete the whole row
			const captchaRow = captchaField.closest('.row');
			captchaRow.remove();
		}
	}

	addMissingCaptcha() {
		const postSubmitButton = document.getElementById('submitpost');
		const captchaFormSectionHtml = captchaformsection({ captchaOptions });
		postSubmitButton.insertAdjacentHTML('beforebegin', captchaFormSectionHtml);
		const captchaFormSection = postSubmitButton.previousSibling;
		const captchaField = captchaFormSection.querySelector('.captchafield');
		this.loadCaptcha(captchaField);
	}

	loadCaptcha(field, imgSrc = '/captcha') {
		const captchaDiv = field.previousSibling;
		if (captchaDiv.children.length > 0) {
			return;
		}
		const captchaImg = document.createElement('img');
		const refreshDiv = document.createElement('div');
		captchaDiv.style.display = '';
		captchaImg.style.margin = '0 auto';
		captchaImg.style.display = 'flex';
		//captchaImg.style.width = '100%';
		refreshDiv.classList.add('captcharefresh', 'noselect');
		refreshDiv.addEventListener('click', (e) => this.refreshCaptchas(e), true);
		refreshDiv.textContent = '↻';
		if (captchaOptions.type === 'text') {
			field.placeholder = __('loading');
		}
		captchaImg.src = imgSrc;
		captchaImg.onload = () => {
			if (captchaOptions.type === 'text') {
				field.placeholder = __('Captcha text');
			}
			captchaDiv.appendChild(captchaImg);
			captchaDiv.appendChild(refreshDiv);
			this.startRefreshTimer();
		};
	}

}

const captchaController = new CaptchaController();

window.addEventListener('DOMContentLoaded', () => {

	captchaController.init();

});


code:
/* global renderSheet rulesKey isCatalog */
if (isCatalog) {
	window.addEventListener('DOMContentLoaded', () => {

		const getFilterSelector = (filter) => {
			filter = filter.replace(/["\\]/g, '\\$&').toLowerCase();
			return `.catalog-tile:not([data-filter*="${filter}"])`;
		};
		const catalogFilter = document.getElementById('catalogfilter');
		catalogFilter.value = '';
		const filterCatalog = () => {
			for (let i = 0; i < renderSheet[rulesKey].length; i++) {
				if (renderSheet[rulesKey][i].selectorText.startsWith('.catalog-tile:not([data-filter*=')) {
					renderSheet.deleteRule(i);
					break;
				}
			}
			if (catalogFilter.value.length > 0) {
				renderSheet.insertRule(getFilterSelector(catalogFilter.value) + ' { display: none; }');
			}
		};
		catalogFilter.addEventListener('input', filterCatalog, false);

		const sorts = {
			date: (a, b) => {
				//date newest first
				return new Date(b.dataset.date) - new Date(a.dataset.date);
			},
			bump: (a, b) => {
				//bump date most recent first
				return a.dataset.bump - b.dataset.bump;
			},
			replies: (a, b) => {
				//replies most first
				return b.dataset.replies - a.dataset.replies;
			},
		};
		const tiles = document.getElementsByClassName('catalog-tile');
		const catalogSort = document.getElementById('catalogsort');
		catalogSort.value = '';
		const sortCatalog = (mode) => {
			console.log('sorting catalog', mode);
			const tilesArray = Array.from(tiles);
			tilesArray
				.sort(sorts[mode] || (() => 1))
				.forEach((tile, index) => {
					tile.style.order = index;
				});
		};
		catalogSort.addEventListener('change', (e) => { sortCatalog(e.target.value); }, false);

	});
}


code:
window.addEventListener('DOMContentLoaded', () => {

	const messageBox = document.getElementById('message');
	const parentForm = messageBox && messageBox.form;

	if (messageBox) {
		const messageBoxLabel = messageBox.previousSibling;
		const maxLength = messageBox.getAttribute('maxlength');
		const minLength = messageBox.getAttribute('minlength');
		let currentLength = messageBox.value.length;
		const counter = document.createElement('small');
		messageBoxLabel.appendChild(counter);

		const updateCounter = () => {
			counter.innerText = `(${currentLength}/${maxLength})`;
			if (currentLength >= maxLength || currentLength < minLength) {
				counter.style.color = 'red';
			} else {
				counter.removeAttribute('style');
			}
		};

		const updateLength = function() {
			if (messageBox.value.length > maxLength) {
				messageBox.value = messageBox.value.substring(0,maxLength);
			}
			currentLength = messageBox.value.length;
			updateCounter();
			parentForm && parentForm.dispatchEvent(new CustomEvent('messageBoxChange'));
		};

		updateCounter();

		messageBox.addEventListener('input', updateLength);

	}

});


code:
/* globals setLocalStorage setDefaultLocalStorage settings */
const renderCSSLink = document.createElement('style');
renderCSSLink.type = 'text/css';
renderCSSLink.id = 'rendercss';
document.head.appendChild(renderCSSLink);
const renderSheet = renderCSSLink.sheet;
const rulesKey = renderSheet.rules ? 'rules' : 'cssRules';

class CssToggle {
	constructor (settingId, localStorageKey, localStorageDefault, settingCss) {
		this.localStorageKey = localStorageKey;
		this.localStorageDefault = localStorageDefault;
		setDefaultLocalStorage(this.localStorageKey, this.localStorageDefault);
		this.settingBoolean = localStorage.getItem(this.localStorageKey) == 'true';
		this.settingCss = settingCss;
		window.addEventListener('settingsReady', () => {
			//on event fire, set boolean to correct checked stats
			this.setting = document.getElementById(settingId);
			this.setting.checked = this.settingBoolean;
			this.setting.addEventListener('change', () => {
				this.toggle();
			}, false);
		});
		this.apply();
	}
	toggle () {
		this.settingBoolean = !this.settingBoolean;
		console.log('toggling', this.localStorageKey, this.settingBoolean);
		this.apply();
		setLocalStorage(this.localStorageKey, this.settingBoolean);
	}
	apply () {
		if (this.settingBoolean) {
			renderSheet.insertRule(this.settingCss);
		} else {
			for (let i = 0; i < renderSheet[rulesKey].length; i++) {
				if (renderSheet[rulesKey][i].selectorText == this.settingCss.split(' {')[0]) {
					renderSheet.deleteRule(i);
				}
			}
		}
	}
}

//define the css
const hidePostStubsCss = '.post-container.hidden, .catalog-tile.hidden { display: none;margin-top: -1.5em;height: 0; }';
const hideDeletedPostContentCss = '.post-container.marked[data-mark="Deleted"] .post-data { display: none; }';
const hideThumbnailsCss = '.file-thumb, .catalog-thumb { visibility: hidden !important; }';
const hideRecursiveCss = '.op.hidden ~ .anchor, .op.hidden ~ .post-container { display: none; }';
const heightUnlimitCss = 'img, video { max-height: unset; }';
const crispCss = 'img { image-rendering: crisp-edges; }';
const nonColorIdsCss = '.user-id { background: transparent none repeat scroll 0% 0% !important; border-color: transparent; text-shadow: none; color: var(--font-color); }';
const alwaysShowSpoilersCss = '.spoiler { color: var(--font-color) !important; background: transparent none repeat scroll 0% 0%; outline: 1px solid black; cursor: auto; }';
const smoothScrollingCss = 'html { scroll-behavior: smooth; }';
const threadWatcherCss = '#threadwatcher { display: flex; }';

//make classes with css
new CssToggle('hiderecursive-setting', 'hiderecursive', settings.hideRecursive, hideRecursiveCss);
new CssToggle('heightlimit-setting', 'heightlimit', settings.heightUnlimit, heightUnlimitCss);
new CssToggle('crispimages-setting', 'crispimages', settings.crispImages, crispCss);
new CssToggle('hidethumbnails-setting', 'hidethumbnails', settings.hideThumbnails, hideThumbnailsCss);
new CssToggle('noncolorids-setting', 'noncolorids', settings.nonColorIds, nonColorIdsCss);
new CssToggle('alwaysshowspoilers-setting', 'alwaysshowspoilers', settings.alwaysShowSpoilers, alwaysShowSpoilersCss);
new CssToggle('hidepoststubs-setting', 'hidepoststubs', settings.hidePostStubs, hidePostStubsCss);
new CssToggle('hidedeletedpostcontent-setting', 'hidedeletedpostcontent', settings.hideDeletedPostContent, hideDeletedPostContentCss);
new CssToggle('smoothscrolling-setting', 'smoothscrolling', settings.smoothScrolling, smoothScrollingCss);
new CssToggle('threadwatcher-setting', 'threadwatcher', settings.threadWatcher, threadWatcherCss);


code:
/* globals setLocalStorage */
class Dragable {

	constructor(handle, target) {
		this.draging = false;
		this.xo = 0;
		this.yo = 0;
		this.targetId = target;
		this.handle = document.querySelector(handle);
		this.target = document.querySelector(target);
		const savedTop = localStorage.getItem(`${this.targetId}-dragtop`);
		if (savedTop != 'null') {
			this.target.style.top = savedTop;
			this.target.style.bottom = 'unset';
		}
		const savedLeft = localStorage.getItem(`${this.targetId}-dragleft`);
		if (savedLeft != 'null') {
			this.target.style.left = savedLeft;
		}
		this.target.style.right = 'unset';
		this.target.addEventListener('opened', e => this.updateMaxSizes(e));
		this.handle.addEventListener('mousedown', e => this.startDrag(e));
		this.handle.addEventListener('touchstart', e => this.startDrag(e), {passive: true});
		document.addEventListener('mouseup', e => this.stopDrag(e));
		document.addEventListener('touchend', e => this.stopDrag(e));
		window.addEventListener('resize', e => this.updateMaxSizes(e));
		window.addEventListener('orientationchange', e => this.updateMaxSizes(e));
	}

	//get a position in bounds
	inBounds(pos, offset, size, limit) {
		if (pos-offset <= 0) {
			return 0;
		} else if (pos-offset+size > limit) {
			return limit-size;
		} else {
			return pos-offset;
		}
	}

	updateMaxSizes() {
		let rect = this.target.getBoundingClientRect();
		if (rect.width === 0) {
			return;
		}
		//reset to top left if resized or rotated and and edge goes off the screen
		if (rect.right > document.documentElement.clientWidth) {
			this.target.style.left = 0;
		}
		if (rect.bottom > document.documentElement.clientHeight) {
			this.target.style.top = 0;
		}
		//set max widths, get rect again since it might have changed
		rect = this.target.getBoundingClientRect();
		this.target.style.maxHeight = `${document.documentElement.clientHeight - rect.top}px`;
		this.target.style.maxWidth = `${document.documentElement.clientWidth - rect.left}px`;
	}

	//start drag and attach appropriate listener for click/drag
	startDrag(e) {
		this.draging = true;
		this.handle.style.cursor = 'grabbing';
		this.target.style.position = 'fixed';
		const rect = this.target.getBoundingClientRect();
		switch (e.type) {
			case 'mousedown':
				this.xo = e.clientX - rect.left;
				this.yo = e.clientY - rect.top;
				window.addEventListener('mousemove', e => this.doDrag(e));
				break;
			case 'touchstart':
				e.preventDefault();
				e.stopPropagation();
				this.xo = e.targetTouches[0].clientX - rect.left;
				this.yo = e.targetTouches[0].clientY - rect.top;
				window.addEventListener('touchmove', e => this.doDrag(e));
				break;
			default:
				//user has alien technology
				break;
		}
	}

	//do the actual drag/movement
	doDrag(e) {
		if (!this.draging) {
			return;
		}
		this.updateMaxSizes();
		this.target.style.bottom = 'unset';
		switch (e.type) {
			case 'mousemove':
				this.target.style.left = `${this.inBounds(e.clientX, this.xo, this.target.offsetWidth, document.documentElement.clientWidth)}px`;
				this.target.style.top = `${this.inBounds(e.clientY, this.yo, this.target.offsetHeight, document.documentElement.clientHeight)}px`;
				break;
			case 'touchmove':
				e.preventDefault();
				e.stopPropagation();
				this.target.style.left = `${this.inBounds(e.targetTouches[0].clientX, this.xo, this.target.offsetWidth, document.documentElement.clientWidth)}px`;
				this.target.style.top = `${this.inBounds(e.targetTouches[0].clientY, this.yo, this.target.offsetHeight, document.documentElement.clientHeight)}px`;
				break;
			default:
				break;
		}
		this.target.style.bottom = 'unset';
		setLocalStorage(`${this.targetId}-dragtop`, this.target.style.top);
		setLocalStorage(`${this.targetId}-dragleft`, this.target.style.left);
	}

	//stopped dragging
	stopDrag() {
		if (this.draging) {
			this.draging = false;
			this.handle.style.cursor = 'grab';
			window.removeEventListener('mousemove', e => this.doDrag(e));
			window.removeEventListener('touchmove', e => this.doDrag(e));
		}
	}

}

if (document.getElementById('postform')) {
	new Dragable('#postform-dragHandle', '#postform');
}


code:
/* globals isCatalog */
if (!isCatalog) { //dont show embed buttons in catalog
	window.addEventListener('DOMContentLoaded', () => {

		const linkSelector = '.post-message a:not(.quote)'; //get links that arent quotes

		const supportedEmbeds = [
			{
				linkRegex: /^https?:\/\/(?:www\.|m\.)?(?:youtube\.com|youtu\.?be)\//i,
				toHtml: (url) => {
					try {
						const urlObject = new URL(url);
						const searchParams = urlObject.searchParams;
						const videoId = searchParams.get('v') // /watch?v=
							|| (urlObject.hostname === 'youtu.be' && urlObject.pathname.substring(1)) // /videoid
							|| (urlObject.pathname.startsWith('/shorts/') && urlObject.pathname.substring(8)); // /shorts/videoi
						if (videoId && videoId.length === 11) {
							return ['',
								`https://www.youtube-nocookie.com/embed/${encodeURIComponent(videoId)}`];
						}
					} catch (e) { /*invalid url*/ }
					return null;
				}
			},
			{
				linkRegex: /^https?:\/\/(?:www\.)?bitchute\.com\/video\/[a-z0-9]{12}\//i,
				toHtml: (url) => {
					try {
						const urlObject = new URL(url);
						const videoId = urlObject.pathname.split('/')[2];
						if (videoId) {
							return ['',
								`https://www.bitchute.com/embed/${encodeURIComponent(videoId)}/`];
						}
					} catch (e) { /*invalid url*/ }
					return null;
				}
			},
			{
				linkRegex: /^https?:\/\/(?:www\.)?odysee\.com\/.+\/.+/i,
				toHtml: (url) => {
					try {
						const urlObject = new URL(url);
						const videoId = urlObject.pathname;
						if (videoId && videoId.startsWith('/@')) {
							return ['',
								`https://odysee.com/$/embed${videoId}`];
						}
					} catch (e) { /*invalid url*/ }
					return null;
				}
			},
			//TODO: add more of these
		];

		const toggleEmbed = (embedSpan, embedHtml, embedSrc) => {
			if (embedSpan.dataset.open === 'true') {
				embedSpan.nextSibling.remove();
				embedSpan.firstElementChild.textContent = 'Embed';
			} else {
				embedSpan.insertAdjacentHTML('afterend', embedHtml);
				embedSpan.nextSibling.src = embedSrc;
				embedSpan.firstElementChild.textContent = 'Close';
			}
			embedSpan.dataset.open = embedSpan.dataset.open === 'true' ? 'false' : 'true';
		};

		const addEmbedButtons = (l) => {
			for (let i = 0; i < l.length; i++) {
				const embedHandler = supportedEmbeds.find(handler => handler.linkRegex.test(l[i].href));
				if (!embedHandler) { continue; }
				const [embedHtml, embedSrc] = embedHandler.toHtml(l[i].href);
				if (embedHtml) {
					const embedSpan = document.createElement('span');
					const openBracket = document.createTextNode('[');
					const embedLink = document.createElement('a');
					const closeBracket = document.createTextNode(']');
					embedSpan.classList.add('ml-5', 'noselect', 'bold');
					embedLink.classList.add('dummy-link');
					embedLink.textContent = 'Embed';
					embedSpan.appendChild(openBracket);
					embedSpan.appendChild(embedLink);
					embedSpan.appendChild(closeBracket);
					l[i].parentNode.insertBefore(embedSpan, l[i].nextSibling);
					embedLink.addEventListener('click', () => toggleEmbed(embedSpan, embedHtml, embedSrc, false));
				}
			}
		};

		const links = Array.from(document.querySelectorAll(linkSelector));
		addEmbedButtons(links);

		const updateEmbedLinks = (e) => {
			if (e.detail.hover) {
				return;
			}
			const newlinks = Array.from(e.detail.post.querySelectorAll(linkSelector))
				.filter(link => {
					//dont add for existing or during updatepostmessage
					return !(link.nextSibling
						&& link.nextSibling.classList
						&& link.nextSibling.classList.contains('dummy-link'));
				});
			addEmbedButtons(newlinks);
		};

		window.addEventListener('addPost', updateEmbedLinks);
		window.addEventListener('updatePostMessage', updateEmbedLinks);

	});
}


code:
/* globals setLocalStorage isCatalog */
window.addEventListener('DOMContentLoaded', () => {

	const actionFooter = document.querySelector('#action-menu');
	if (actionFooter) {
		actionFooter.addEventListener('click', () => {
			if (!actionFooter.parentElement.classList.contains('floatactions')) {
				actionFooter.scrollIntoView();
			} else {
				actionFooter.parentElement.classList.remove('floatactions');
			}
		}, false);
	}

	const volumeSetting = document.getElementById('volume-setting');
	let volumeLevel = localStorage.getItem('volume');
	const changeVolume = () => {
		volumeLevel = volumeSetting.value;
		const allMedia = document.querySelectorAll('audio,video');
		for (let i = 0; i < allMedia.length; i++) {
			allMedia[i].volume = volumeLevel/100;
		}
		console.log('adjusting default volume', volumeLevel);
		setLocalStorage('volume', volumeLevel);
	};
	volumeSetting.value = volumeLevel;
	volumeSetting.addEventListener('change', changeVolume, false);

	const loopSetting = document.getElementById('loop-setting');
	let loopEnabled = localStorage.getItem('loop') == 'true';
	const toggleLoop = () => {
		loopEnabled = loopSetting.checked;
		console.log('toggling video/audio looping', loopEnabled);
		setLocalStorage('loop', loopEnabled);
	};
	loopSetting.checked = loopEnabled;
	loopSetting.addEventListener('change', toggleLoop, false);

	const imageloadingbarsSetting = document.getElementById('imageloadingbars-setting');
	let imageloadingbarsEnabled = localStorage.getItem('imageloadingbars') == 'true';
	const toggleImageloadingbars = () => {
		imageloadingbarsEnabled = imageloadingbarsSetting.checked;
		console.log('toggling video/audio imageloadingbarsing', imageloadingbarsEnabled);
		setLocalStorage('imageloadingbars', imageloadingbarsEnabled);
	};
	imageloadingbarsSetting.checked = imageloadingbarsEnabled;
	imageloadingbarsSetting.addEventListener('change', toggleImageloadingbars, false);

	if (!isCatalog) { //dont expand on catalog
		const thumbs = document.getElementsByClassName('post-file-src');
		const toggle = function(thumb, expanded, filename, src) {
			if (thumb.style.display === 'none') { //closing
				thumb.style.display = '';
				expanded.style.display = 'none';
				filename.style.maxWidth = '';
			} else { //expanding
				thumb.style.display = 'none';
				expanded.style.display = '';
				if (expanded.offsetWidth >= filename.offsetWidth) {
					filename.style.maxWidth = expanded.offsetWidth+'px';
				}
			}
			//handle css thing for play icon on vid/audio
			const close = thumb.nextSibling.textContent === '[Close]' ? thumb.nextSibling : null;
			if (close) {
				expanded.loop = loopEnabled;
				expanded.volume = volumeLevel/100;
				if (src.style.visibility === 'hidden') {
					src.style.visibility = 'visible';
					close.style.display = 'none';
					expanded.pause();
				} else {
					src.style.visibility = 'hidden';
					close.style.display = 'block';
					expanded.play();
				}
			}
		};

		const expand = function(e) {
			if (e.target.nodeName === 'VIDEO' || e.target.nodeName === 'AUDIO') {
				e.stopPropagation();
				return;
			}
			if (this.dataset.attachment == 'true') {
				return;
			}
			e.preventDefault();
			const fileAnchor = this.firstChild;
			const fileHref = fileAnchor.href;
			const type = this.dataset.type;
			const thumbElement = fileAnchor.firstChild;
			const isSpoilered = thumbElement.classList.contains('spoilerimg');
			const fileName = this.previousSibling;
			const pfs = this.closest('.post-file-src');
			let expandedElement = type === 'image' ? thumbElement.nextSibling : fileAnchor.nextSibling;

			if (expandedElement) {
				toggle(thumbElement, expandedElement, fileName, pfs);
			} else if (thumbElement.style.opacity !== '0.5') {
				let source;
				switch (type) {
					case 'image':
						e.preventDefault();
						if (!isSpoilered) {
							fileAnchor.style.minWidth = fileAnchor.offsetWidth+'px';
							fileAnchor.style.minHeight = fileAnchor.offsetHeight+'px';
						}
						thumbElement.style.opacity = '0.5';
						thumbElement.style.cursor = 'wait';
						if (localStorage.getItem('imageloadingbars') == 'true'
							&& window.URL.createObjectURL) {
							const request = new XMLHttpRequest();
							request.onprogress = (e) => {
								const progress = Math.floor((e.loaded/e.total)*100);
								const progressWidth = Math.floor((e.loaded/e.total)*thumbElement.offsetWidth);
								if (progress >= 100) {
									pfs.removeAttribute('data-loading');
								} else {
									pfs.setAttribute('data-loading', progress);
									pfs.style = `--data-loading: ${progressWidth}px`;
								}
							};
							expandedElement = document.createElement('img');
							source = expandedElement;
							const loaded = function() {
								pfs.removeAttribute('data-loading');
								pfs.removeAttribute('style');
								const blob = this.response;
								source.onload = function() {
									thumbElement.style.opacity = '';
									thumbElement.style.cursor = '';
									fileAnchor.appendChild(expandedElement);
									toggle(thumbElement, expandedElement, fileName, pfs);
								};
								source.src = window.URL.createObjectURL(blob);
							};
							request.onload = loaded;
							request.responseType = 'blob';
							request.open('GET', fileHref, true);
							request.send(null);
						} else {
							expandedElement = document.createElement('img');
							source = expandedElement;
							source.onload = function() {
								thumbElement.style.opacity = '';
								thumbElement.style.cursor = '';
								fileAnchor.appendChild(expandedElement);
								toggle(thumbElement, expandedElement, fileName, pfs);
							};
							source.src = fileHref;
						}
						break;
					case 'video':
					case 'audio': {
						e.preventDefault();
						expandedElement = document.createElement(type);
						const closeSpan = document.createElement('span');
						const openBracket = document.createTextNode('[');
						const closeLink = document.createElement('a');
						const closeBracket = document.createTextNode(']');
						closeSpan.classList.add('noselect', 'bold');
						closeSpan.style.marginBottom = '3px';
						closeSpan.style.display = 'block';
						closeSpan.style.color = 'var(--font-color)';
						closeLink.classList.add('dummy-link');
						closeLink.textContent = 'Close';
						closeSpan.appendChild(openBracket);
						closeSpan.appendChild(closeLink);
						closeSpan.appendChild(closeBracket);
						closeSpan.addEventListener('click', function(e) {
							e.preventDefault();
							e.stopPropagation();
							toggle(thumbElement, expandedElement, fileName, pfs);
						}, true);
						expandedElement.controls = 'true';
						source = document.createElement('source');
						expandedElement.appendChild(source);
						if (type === 'audio' && thumbElement.nodeName === 'IMG') {
							expandedElement.style.backgroundImage =
								`url("${encodeURI(thumbElement.src)}")`;
							expandedElement.style.backgroundRepeat = 'no-repeat';
							expandedElement.style.backgroundPosition = 'top';
							expandedElement.style.backgroundSize = 'contain';
							expandedElement.style.minWidth = thumbElement.width+'px';
							expandedElement.style.paddingTop = thumbElement.height+'px';
						} else if (!isSpoilered) {
							expandedElement.style.minWidth = fileAnchor.offsetWidth+'px';
							expandedElement.style.minHeight = fileAnchor.offsetHeight+'px';
						}
						pfs.appendChild(expandedElement);
						fileAnchor.appendChild(closeSpan);
						toggle(thumbElement, expandedElement, fileName, pfs);
						source.src = fileHref;
						return;
					}
				}
			}
		};

		const addExpandEvent = (t) => {
			for (let i = 0; i < t.length; i++) {
				t[i].addEventListener('click', expand, false);
			}
		};

		addExpandEvent(thumbs);

		window.addEventListener('addPost', function(e) {
			if (e.detail.hover) {
				return; //dont need to handle hovered posts for this
			}
			const post = e.detail.post;
			const newthumbs = post.getElementsByClassName('post-file-src');
			addExpandEvent(newthumbs);
		});
	}

});


code:
/* globals __ setLocalStorage pugfilters isCatalog captchaController threadWatcher */
const getFiltersFromLocalStorage = () => {
	const savedFilters = JSON.parse(localStorage.getItem('filters1'));
	return savedFilters.reduce((acc, filter) => {
		const regexFilter = filter.type.endsWith('r');
		if (regexFilter) {
			acc[filter.type].push(new RegExp(filter.val, 'i')); //todo: serialize flags? probs not necessary
		} else {
			acc[filter.type].add(filter.val);
		}
		return acc;
	}, {
		single: new Set(),
		fid: new Set(),
		fname: new Set(),
		ftrip: new Set(),
		fsub: new Set(),
		fmsg: new Set(),
		fflag: new Set(),
		fnamer: [],
		ftripr: [],
		fsubr: [],
		fmsgr: [],
		fflagr: [],
	});
};

let { single, fid, fname, ftrip, fsub, fmsg, fflag, fnamer, ftripr, fsubr, fmsgr, fflagr } = getFiltersFromLocalStorage();

let filtersTable;
const updateFiltersTable = () => {
	[...filtersTable.children].slice(3).forEach(row => row.remove());
	filtersTable.insertAdjacentHTML('beforeend', pugfilters({filterArr: JSON.parse(localStorage.getItem('filters1'))}));
	const closeButtons = filtersTable.querySelectorAll('.close');
	for (let elem of closeButtons) {
		let { type: closeType, data: closeData } = elem.dataset;
		if (closeType.endsWith('r')) {
			closeData = new RegExp(closeData, 'i');
		}
		elem.addEventListener('click', () => { toggleFilter(closeType, closeData); });
	}
};

const updateSavedFilters = () => {
	setLocalStorage('filters1', JSON.stringify([
		...([...single].map(x => ({type:'single', val:x}))),
		...([...fid].map(x => ({type:'fid', val:x}))),
		...([...ftrip].map(x => ({type:'ftrip', val:x}))),
		...([...fname].map(x => ({type:'fname', val:x}))),
		...([...fsub].map(x => ({type:'fsub', val:x}))),
		...([...fmsg].map(x => ({type:'fmsg', val:x}))),
		...([...fflag].map(x => ({type:'fflag', val:x}))),
		...fnamer.map(x => ({type:'fnamer', val:x.source.toString()})),
		...ftripr.map(x => ({type:'ftripr', val:x.source.toString()})),
		...fsubr.map(x => ({type:'fsubr', val:x.source.toString()})),
		...fmsgr.map(x => ({type:'fmsgr', val:x.source.toString()})),
		...fflagr.map(x => ({type:'fflagr', val:x.source.toString()})),
	]));
	updateFiltersTable();
};

const anyFilterMatches = (filteringPost) => {
	const { board, postId, userId, name, subject, tripcode, country } = filteringPost.dataset;
	const postMessage = filteringPost.querySelector('.post-message');
	const message = postMessage ? postMessage.textContent : null;
	const flag = country ? country.code : null;
	return single.has(`${board}-${postId}`)
		|| fid.has(userId)
		|| fname.has(name)
		|| ftrip.has(tripcode)
		|| fsub.has(subject)
		|| fmsg.has(message)
		|| fflag.has(flag)
		|| fnamer.some(r => r.test(name))
		|| ftripr.some(r => r.test(tripcode))
		|| fsubr.some(r => r.test(subject))
		|| fmsgr.some(r => r.test(message))
		|| fflagr.some(r => r.test(flag));
};

const togglePostsHidden = (posts, state, single) => {
	for (let elem of posts) {
		const showing = (!state && (!anyFilterMatches(elem) || single));
		if (showing) { //possible fix for multiple filters & unhiding conflicts
			elem.classList['remove']('hidden');
		} else {
			elem.classList['add']('hidden');
		}
		elem.querySelector('.postmenu').children[0].textContent = (showing ? __('Hide') : __('Show'));
	}
};

//I wish this wasn't necessary, but css selectors dont support regex :(
const getPostsByRegex = (attribute, regex) => {
	const matches = [];
	for (let elem of document.querySelectorAll(`[${attribute}]`)) {
		const value = elem.getAttribute(attribute).toString();
		if (regex.test(value) === true) {
			matches.push(elem);
		}
	}
	return matches;
};

const getPostsByMessage = (data, regex=false) => {
	//you asked for this
	const postMessages = [...document.querySelectorAll(`.${isCatalog ? 'catalog-tile': 'post-container' } .post-message`)];
	const matchingMessages = postMessages.filter(m => (regex ? data.test(m.textContent) : m.textContent.includes(data)));
	return matchingMessages.map(m => m.closest(`.${isCatalog ? 'catalog-tile': 'post-container' }`));
};

const getPostsByFilter = (type, data) => {
	let posts = [];
	switch (type) {
		case 'single': {
			const [dataBoard, dataPostId] = data.split('-');
			const singlePost = document.querySelector(`[data-board="${dataBoard}"][data-post-id="${dataPostId}"]`);
			posts = singlePost ? [singlePost] : [];
			break;
		}
		case 'fid':
			posts = document.querySelectorAll(`[data-user-id="${data}"]`);
			break;
		case 'fname':
			posts = document.querySelectorAll(`[data-name="${CSS.escape(data)}"]`);
			break;
		case 'fnamer':
			posts = getPostsByRegex('data-name', data);
			break;
		case 'ftrip':
			posts = document.querySelectorAll(`[data-tripcode="${CSS.escape(data)}"]`);
			break;
		case 'ftripr':
			posts = getPostsByRegex('data-tripcode', data);
			break;
		case 'fsub':
			posts = document.querySelectorAll(`[data-subject="${CSS.escape(data)}"]`);
			break;
		case 'fsubr':
			posts = getPostsByRegex('data-subject', data);
			break;
		case 'fmsg':
			posts = getPostsByMessage(data);
			break;
		case 'fmsgr':
			posts = getPostsByMessage(data, true);
			break;
		case 'fflag':
			posts = document.querySelectorAll(`[data-flag="${CSS.escape(data)}"]`);
			break;
		case 'fflagr':
			posts = getPostsByRegex('data-flag', data);
			break;
		default:
			break;
	}
	return [...posts];
};

const setFilterState = (type, data, state) => {
	const addOrDelete = state ? 'add' : 'delete';
	switch (type) {
		case 'single':
			single[addOrDelete](data);
			break;
		case 'fid':
			fid[addOrDelete](data);
			break;
		case 'fname':
			fname[addOrDelete](data);
			break;
		case 'fnamer':
			fnamer = fnamer.filter(r => r.source != data.source);
			if (state) {
				fnamer.push(data);
			}
			break;
		case 'ftrip':
			ftrip[addOrDelete](data);
			break;
		case 'ftripr':
			ftripr = ftripr.filter(r => r.source != data.source);
			if (state) {
				ftripr.push(data);
			}
			break;
		case 'fsub':
			fsub[addOrDelete](data);
			break;
		case 'fsubr':
			fsubr = fsubr.filter(r => r.source != data.source);
			if (state) {
				fsubr.push(data);
			}
			break;
		case 'fmsg':
			fmsg[addOrDelete](data);
			break;
		case 'fmsgr':
			fmsgr = fmsgr.filter(r => r.source != data.source);
			if (state) {
				fmsgr.push(data);
			}
			break;
		case 'fflag':
			fflag[addOrDelete](data);
			break;
		case 'fflagr':
			fflagr = fflagr.filter(r => r.source != data.source);
			if (state) {
				fflagr.push(data);
			}
			break;
		default:
			break;
	}
};

const toggleFilter = (filterType, filterData, state) => {
	const posts = getPostsByFilter(filterType, filterData);
	setFilterState(filterType, filterData, state);
	togglePostsHidden(posts, state, filterType === 'single');
	updateSavedFilters();
};

//i guess this works, lmfao and saves ton of time
let actionForm, modalBg, moderatingPost;
const cancelModeratePost = (e) => {
	if (!moderatingPost) {
		return;
	}
	e.preventDefault();
	moderatingPost.querySelector('.post-check').checked = false;
	moderatingPost.style.zIndex = 'unset';
	if (moderatingPost.classList.contains('op')) {
		moderatingPost.style.background = 'unset';
	}
	modalBg.style.display = 'none';
	modalBg.style.zIndex = 4;
	actionForm.removeAttribute('open');
	moderatingPost = null;
};
const moderatePost = (postContainer) => {
	moderatingPost = postContainer;
	actionForm.classList.add('floatactions');
	actionForm.setAttribute('open', 'open');
	actionForm.style.zIndex = 3;
	postContainer.style.zIndex = 3;
	if (postContainer.classList.contains('op')) {
		postContainer.style.background = 'var(--post-color)';
	}
	modalBg.style.display = 'unset';
	modalBg.style.zIndex = 3;
	const actionCaptcha = actionForm.querySelector('.captchafield');
	const postCheck = postContainer.querySelector('.post-check');
	Array.from(postCheck.form.elements)
		.filter(e => e.name === 'checkedposts')
		.forEach(e => e.checked = false);
	postCheck.checked = true;
	if (actionCaptcha) {
		captchaController.loadCaptcha(actionCaptcha);
	}
};

const postMenuChange = function() {
	const postContainer = this.closest(isCatalog ? '.catalog-tile': '.post-container');
	const postDataset = postContainer.dataset;
	const filterType = this.value;
	const hiding = !postContainer.classList.contains('hidden');
	this.value = '';
	let filterData;
	switch (filterType) {
		case 'single':
			filterData = `${postDataset.board}-${postDataset.postId}`;
			break;
		case 'fid':
			filterData = postDataset.userId;
			break;
		case 'fname':
			filterData = postDataset.name;
			break;
		case 'ftrip':
			filterData = postDataset.tripcode;
			break;
		case 'fsub':
			filterData = postDataset.subject;
			break;
		case 'fflag':
			filterData = postDataset.flag;
			break;
		case 'moderate':
			return moderatePost(postContainer);
		case 'edit':
			return window.location = `/${postDataset.board}/manage/editpost/${postDataset.postId}.html`;
		case 'watch': {
			const postMessage = postContainer.querySelector('.post-message');
			const watcherSubject = (postDataset.subject || (postMessage && postMessage.textContent) || `#${postDataset.postId}`).substring(0, 25);
			threadWatcher.add(postDataset.board, postDataset.postId, { subject: watcherSubject, unread: 0, updatedDate: new Date() });
			return;
		}
		case 'playlist':{
			console.log('creating playlist...');
			window.dispatchEvent(new CustomEvent('createPlaylist', {
				detail:{
					board:postDataset.board,
					postId:postDataset.postId
				}
			}));
			break;
		}
	}
	toggleFilter(filterType, filterData, hiding);
};

for (let menu of document.getElementsByClassName('postmenu')) {
	menu.value = '';
	menu.addEventListener('change', postMenuChange, false);
}

const getHiddenElems = () => {
	let posts = [];
	for (let elem of single) {
		posts = posts.concat(getPostsByFilter('single', elem));
	}
	for (let id of fid) {
		posts = posts.concat(getPostsByFilter('fid', id));
	}
	for (let name of fname) {
		posts = posts.concat(getPostsByFilter('fname', name));
	}
	for (let tripcode of ftrip) {
		posts = posts.concat(getPostsByFilter('ftrip', tripcode));
	}
	for (let subject of fsub) {
		posts = posts.concat(getPostsByFilter('fsub', subject));
	}
	for (let message of fmsg) {
		posts = posts.concat(getPostsByFilter('fmsg', message));
	}
	for (let flag of fflag) {
		posts = posts.concat(getPostsByFilter('fflag', flag));
	}
	for (let namer of fnamer) {
		posts = posts.concat(getPostsByFilter('fnamer', namer));
	}
	for (let tripcoder of ftripr) {
		posts = posts.concat(getPostsByFilter('ftripr', tripcoder));
	}
	for (let subr of fsubr) {
		posts = posts.concat(getPostsByFilter('fsubr', subr));
	}
	for (let messager of fmsgr) {
		posts = posts.concat(getPostsByFilter('fmsgr', messager));
	}
	for (let flagr of fflagr) {
		posts = posts.concat(getPostsByFilter('fflagr', flagr));
	}
	return posts;
};

togglePostsHidden(getHiddenElems(), true);

window.addEventListener('addPost', function(e) {
	const newPost = e.detail.post;
	if (anyFilterMatches(newPost)) {
		newPost.classList.add('hidden');
	}
	if (e.detail.hover) { return; }
	const menu = newPost.querySelector('.postmenu');
	menu.value = '';
	menu.addEventListener('change', postMenuChange, false);
});

window.addEventListener('updatePostMessage', function(e) {
	const newPost = e.detail.post;
	if (anyFilterMatches(newPost)) {
		newPost.classList.add('hidden');
	}
});

window.addEventListener('settingsReady', function() {

	actionForm = document.getElementById('actionform');
	if (actionForm) {
		modalBg = document.querySelector('.modal-bg');
		actionForm.firstChild.addEventListener('click', cancelModeratePost);
		modalBg.addEventListener('click', cancelModeratePost, false);
	}

	filtersTable = document.getElementById('advancedfilters');
	updateFiltersTable();

	const filtersForm = document.getElementById('filter-form');
	filtersForm.addEventListener('submit', (e) => {
		e.preventDefault();
		const isRegex = filtersForm.elements.regex.checked;
		const type = `${filtersForm.elements.type.value}${isRegex ? 'r' : ''}`;
		const val = isRegex ? new RegExp(filtersForm.elements.value.value, 'i') : filtersForm.elements.value.value;
		console.log('adding filter', type, val);
		toggleFilter(type, val, true);
	});

	const filterClearButton = document.getElementById('filters-clear');
	const clearFilters = () => {
		single = new Set(),
		fid = new Set(),
		fname = new Set(),
		ftrip = new Set(),
		fsub = new Set(),
		fmsg = new Set(),
		fflag = new Set(),
		fnamer = [],
		ftripr = [],
		fsubr = [],
		fmsgr = [],
		fflagr = [],
		updateFiltersTable();
		togglePostsHidden(document.querySelectorAll(`.${isCatalog ? 'catalog-tile': 'post-container' }`), false);
		updateSavedFilters();
		console.log('cleared hidden posts');
	};
	filterClearButton.addEventListener('click', clearFilters, false);

});