Beta UserCSS for /vt/booru

/*UserCSS thanks to sHaHaHark
still a work in progress, check youtube.booru.org forum for updates. Report broken things in the forum.*/
/*HOW TO USE
install a UserCSS browser extension. I recommend Stylus which works for Chrome and Mozilla Firefox
Click the Stylus icon in your extensions bar and click "Manage"
Click "Write new style" but leave the checkbox unticked.
Copy Paste this pastebin into Stylus.
At the bottom of the page, make sure it applies to "URLs on the domain" of "youtube.booru.org" only
Click Save
You will have to reload the extension whenever you go to the booru to see the style.*/
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200;0,400;1,400&display=swap');
* {margin:0; padding:0;box-sizing:border-box; font-family:'Source Code Pro', monospace;}
:root {
    --bg:#fff9cd;
    --txt:#324f85;
    --ar:#d72b57;
    --bc:#f27247;
    --mt:#d58f49;
    --ch:#05a284;
    --gp:#4a95ff;
    --cy:#994bf0;
    --hh:#f249c8;
}
body {
    margin:0 0 0 165px;
    padding:0;
    font-size:16px;
    background:var(--bg);
    color:var(--txt);
    font-family:'Source Code Pro', monospace!important;
}
h5, h6 {font-size:.9rem;}
a, a:visited, a:link {
    color:var(--txt);
}
a[href*="meta:"], a[href*="meta%3A"], a[href*="translated"] {color:var(--mt);}
a[href*="hash:"], a[href*="hash%3A"] {color: var(--hh);}
a[href*="group:"], a[href*="group%3A"] {color: var(--gp);}
a[href*="branch:"], a[href*="branch%3A"] {color: var(--bc);}
a[href*="art:"], a[href*="_(artist)"], a[href*="art%3A"], a[href*="_%28artist%29"], a[href*="drawfriend"] {color:var(--ar);}
a[href*="char:"], a[href*="char%3A"], a[href*="_(character)"], a[href*="_%28character%29"], a[href*="_(vtuber)"], a[href*="_%28vtuber%29"] {color:var(--ch);}
a[href*="copy:"], a[href*="copy%3A"], a[href*="_(series)"], a[href*="_%28series%29"] {color:var(--cy);}
a[href*="_request"], a[href*="tagme"] {padding: 0.1em 0.4em; border-radius: 3px;font-weight: bold;color:#fff;}
a[href*="artist_request"] {background-color:var(--ar);}
a[href*="character_request"] {background-color:var(--ch);}
a[href*="copyright_request"] {background-color:var(--cy);}
a[href*="source_request"], a[href*="translation_request"], a[href*="tagme"] {background-color:var(--mt);}
a[href*="page=ban_user"] {color:red;}
#header h2 {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}
#header h2 a {font-size:0; font-weight:200; font-style:normal; white-space:nowrap;}
#header h2 a::before {content:'/vt/booru @ youtube.booru.org'; font-size:2.5rem;}

#header {position:fixed; top:0; left:0; display:flex; background:#ffe69f; padding:.5em; height:100vh; width:165px;}
#header a {text-decoration:none;}
li {list-style:none;}
ul.flat-list li {margin:0; display:block;}

#long-notice {padding:.5em;}
#long-notice::before {content:'friends: holo.booru.org'; font-size:16px;}

.thumb a:first-of-type {display:block; width:100%; height:100%; padding:7px 11px;}
[onclick*="favorites&s=delete"] {background:#e40f68; padding:.3em; color:#fff!important; transition:0.15s ease-in-out;}
[onclick*="favorites&s=delete"]:hover {background:#ff74b9;}
.thumb a:hover img, .col1 img:hover {transform:scale(1.1);}
span.thumb {background:var(--txt); width:auto; max-width:200px; height:200px; margin:8px; overflow:hidden; display: flex; flex-direction:column; border-radius:7px; float: left;text-align: center; transition:0.15s ease-in-out;}
span.thumb br {display:none;}
#post-list span.thumb {background:var(--txt); display:inline-flex; float:none; align-items: center; justify-content: center; vertical-align:middle;}
.col1 img, .thumb img {transition:0.15s ease-in-out; border-radius:5px; overflow:hidden;}
span.thumb:hover {transform: translateY(-2px); box-shadow: 2px 3px 9px -7px #ba8c0e;}
img[title ~= "animated"] {box-shadow:0 0 0 8em #4288eb; outline:5px solid #4288eb;}
img[title ~= "meta:drawthread"] {box-shadow:0 0 0 8em #f0c273;}

#tag_list li {font-size:.85em;}

#content {
    padding:.5em;
}
#post-list {
    display:flex;
}
div.sidebar {
    width: 200px;
    height: min-content;
}
#post-list .content > div {display: grid;grid-template:"pages" auto"foot" auto"thumb" auto"ignore" auto"ads2" auto"ads" auto / 100%;text-align:center;}
.divTable {grid-area: ads2;width: auto!important; margin-top:50em; z-index:-1;}
#post-view .divTable {margin:0;}
#post-list .content div:nth-child(3) {grid-area: thumb;}
#post-list .content div:nth-child(6) {grid-area: ignore; margin: 1em 0 8em !important;}
#paginator {padding:0; grid-area: pages;display: flex;flex-wrap: wrap;justify-content: center; clear:both; margin:1em .5em;}
#paginator > * {background:var(--txt); color:#fff; padding:3px 5px;}
#paginator b {background:#f0c273; color:var(--txt);}
#paginator > a:hover {background-color:#4288eb;}
#footer {grid-area: foot;text-align: center; margin: 0 0 1em; font-size:20px;}
[href*="page=post&s=add"] {font-size:0;}
[href*="page=post&s=add"]::after {content:'Upload'; font-size:18px;}
center {grid-area:ads; margin-top:50em;}
.divTable {grid-area: ads2; width: auto!important;}
.divTable + div {display: none;}
#right-col div > div:nth-child(3) {grid-area:notes;}

/*post pages*/
#post-view {max-width:1000px;}
#post-view .sidebar {width:250px; float:left; margin-right:1em;}
#image {max-width:100%; margin-right:0!important; margin-bottom:0.5em;}
#right-col {float:none;}
#right-col > div {
  float:none!important;
  display:grid;
  grid-template:"notes" auto
  "ads2"auto/100%;
}
#right-col > div:nth-child(2) {display:none;}
#right-col > div:nth-child(3) {grid-area:notes;}
div#note-container {position:relative;}
div#post-view div.note-box {position: absolute;border: 1px solid black;width: 150px;height: 150px;cursor: move;background: #FFE;overflow: auto;opacity:0.5;filter:alpha(opacity=50);-moz-opacity:0.5;}
div#post-view div.note-corner {background: black;width: 7px;height: 7px;position: absolute;bottom: 0;right: 0;cursor: se-resize;}
div#post-view div.note-body {background: #FFE;border: 1px solid black;display: none;width: 140px;height: 100px;position: absolute;padding: 5px;cursor: pointer;overflow: auto;}
a[onclick*="addFav"] {font-size:0; color:red; font-weight:bold;}
a[onclick*="addFav"]:after {content:'Favorite'; font-size:16px!important;}
textarea {font-size:0.8rem;}

.highlightable {
    font-size: .8em;
    letter-spacing: .03em;
}
.highlightable tr td:nth-child(5), .highlightable tr th:nth-child(5) {display:none;}