Pro for sslothful

/* Design by Cassiel Socks */
/* And Coding by AlthIndor */

html, body {
  background: url('https://i.imgur.com/J1JCcdj.png') no-repeat fixed bottom 10px right -20px #000;
  background-size: auto calc(100% - 45px);
}
html {--pink: #FF1493;}
* {cursor: url('https://i.imgur.com/ASpeBop.png'), auto !important;}

body a {
  text-decoration: none !important;
  transition: all .5s ease-in-out;
}

#gaia_header {background: url('https://i.imgur.com/gJcRum0.png') no-repeat, url('https://i.imgur.com/gJcRum0.png') bottom left;}
#columns {background: url('https://i.imgur.com/gJcRum0.png') 0 -55px;}

/* Fonts */

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Serif'), local('NotoSerif-Regular'), url('https://fonts.gstatic.com/s/notoserif/v21/ga6Iaw1J5X9T9RW6j9bNfFcWaA.woff2') format('woff2');
}

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: local('Noto Serif Bold'), local('NotoSerif-Bold'), url('https://fonts.gstatic.com/s/notoserif/v21/ga6Law1J5X9T9RW6j9bNdOwzfReecQ.woff2') format('woff2');
}

@font-face {
  font-family: 'Pirata One';
  font-style: normal;
  font-weight: 400;
  src: local('Pirata One'), local('PirataOne-Regular'), url('https://fonts.gstatic.com/s/pirataone/v22/I_urMpiDvgLdLh0fAtofhi-Org.woff2') format('woff2');
}

/* Header */

#viewer #gaia_header {
  width: calc(100% - 40px) !important;
  height: 35px !important;
  top: 20px !important;
  left: 20px !important;
}
#gaia_header li.spacer {display: none;}

#gaia_header ul {
  background: none !important;
  width: auto !important;
  font: 400 0/35px 'Pirata One', serif !important;
  padding: 0 10px !important;
  box-sizing: border-box;
}
#gaia_header #header_right {float: right;}

#header_left img {
 -webkit-mask: url('https://i.imgur.com/5FTB40o.png') no-repeat 0 4px;
  mask: url('https://i.imgur.com/5FTB40o.png') no-repeat 0 4px;
  background: #FFFFFF;
  width: 0 !important;
  padding: 0 37px 0 0;
  transition: background .5s ease-in-out;
}
#header_left li:nth-of-type(2) a:hover img {background: var(--pink);}

#gaia_header a {
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 400;
}
#gaia_header a:hover {color: var(--pink) !important;}

#gaia_header li::before {
  display: inline-block;
  background: var(--pink);
  width: 6px;
  height: 3px;
  margin: 0 6px;
  position: relative;
  top: -4px;
}
#header_left li:nth-of-type(n+3)::before, #header_right li:nth-of-type(n+2)::before {content: '';}

/* Columns */

#columns {
  width: 640px;
  height: 505px;
  top: 75px;
  left: 20px;
}
#columns .column {display: contents;}

/* Scrollbars */

#columns ::-webkit-scrollbar {width: 0;}
.panel, dl {scrollbar-width: none;}

/* Panels */

.panel {
  background: none;
  width: 160px;
  color: #FFFFFF;
  font: 11px/1.7 'Noto Serif', serif;
  position: absolute;
  margin: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.panel:not(.media_panel) {border: 15px solid transparent;}
.panel h2 {display: none;}

#id_equipment, #id_comments dl, #id_wishlist, #id_footprints {overflow-y: scroll;}
#id_equipment, #id_wishlist, #id_footprints {height: 160px;}

.panel a {color: var(--pink);}
.panel a:hover {color: inherit;}

/* Panel Placement */

#id_details, #id_equipment {left: 15px;}
#id_comments, #id_wishlist {left: 225px;}
#id_footprints {left: 435px;}

#id_details {top: 65px;}
#id_equipment, #id_wishlist, #id_footprints {top: 330px;}

#id_comments {
  width: 375px;
  height: 215px;
  top: 15px;
}
#id_comments .postcontent img {max-width: 100%;}

/* Details */

#id_details p:nth-of-type(n+2) {display: none;}

.forum_userstatus, .forum_userstatus span {padding: 0 !important;}
.forum_userstatus .statuslinks {display: contents;}

.forum_userstatus, #avatar_menu {
  background: #000;
  width: 120px;
  border: 1px solid #FFFFFF20;
  border-radius: 3px;
  box-sizing: border-box;
}

.forum_userstatus {
  height: 25px;
  margin: 0 auto;
  contain: layout;
}

.forum_userstatus span, .forum_userstatus .pushBox {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
}
.forum_userstatus .pushBox {z-index: 1;}

.forum_userstatus span {
  background: url('https://i.imgur.com/UzAXOFf.png') 90px -102px no-repeat !important;
  color: #FFFFFF !important;
  font: 13px/23px 'Pirata One', serif !important;
}
.forum_userstatus span.offline {opacity: .25;}

.forum_userstatus span::before {
  content: '⚪';
  font-size: 10px;
  margin: 0 .2em 0 .4em;
  position: relative;
  top: -1px;
}

/* Avatar Menu */

#avatar_menu {
  font: 11px 'Noto Serif', serif;
  margin-top: 10px;
}
#avatar_menu a {color: var(--pink);}

#avatar_menu a:hover, #avatar_menu .menu_seperator {background: #202020 !important;}
#avatar_menu a:hover {color: #FFFFFF;}
#avatar_menu .menu_seperator {margin: 1px 0 !important;}

#avatar_menu::before, #avatar_menu::after {
  content: '';
  position: absolute;
}

#avatar_menu::before {
  width: calc(100% + 2px);
  height: 15px;
  bottom: 100%;
  left: -1px;
}

#avatar_menu::after {
  top: -11px;
  left: 1px;
  border-bottom: 12px solid #000;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  filter: drop-shadow(0 -2px #202020);
}

/* Comments */

#id_comments {
  display: flex;
  flex-flow: row wrap;
  justify-content: right;
  gap: 30px .5em;
}
#id_comments #alerts_banner, #id_comments .date a, #id_comments .deletecomment {display: none;}
#id_comments #alert_container {display: contents;}

#id_comments dl {
  width: calc(100% - 5px);
  height: 135px;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow-x: hidden;
}

#id_comments dt {
  height: unset !important;
  line-height: inherit;
  text-align: left;
  margin: 0 0 3px 0;
  padding: 0 0 5px 0;
  border-bottom: 1px dashed #FFFFFF40;
}

#id_comments .username {
  float: none;
  display: inline;
}

#id_comments dd {
  display: grid;
  grid-template-columns: 50px calc(100% - 60px);
  gap: 10px;
  margin: 0 0 15px 0;
}
#id_comments dd:last-of-type {margin: 0;}

#id_comments .dropBox {
  background: #000;
  width: 48px;
  height: 48px;
  margin: 5px 0 0 0;
  border: 1px solid #FFFFFF40;
  border-radius: 3px;
  overflow: hidden;
}

#id_comments .dropBox img {
  width: 120px;
  height: 150px;
  margin: -30px 0 0 -47px;
}

/* Comments Buttons */

#id_comments h2 + div, #id_comments h2 ~ p {display: contents;}
#id_comments .clear {display: none;}

#id_comments h2 + div a, #id_comments h2 ~ p a, #alert_container::after {
  display: block;
  height: 20px;
  color: #FFFFFF;
  font: 0/20px 'Pirata One', serif;
  margin-top: 2px;
}
#id_comments h2 + div a:hover, #id_comments h2 ~ p a:hover {color: var(--pink);}

#id_comments h2 + div a::before, #id_comments h2 ~ p a::before, #alert_container::after {font-size: 20px;}
#id_comments h2 + div a::before {content: 'Post';}
#id_comments h2 ~ p a::before {content: 'View';}
#alert_container::after {content: 'or';}

/* Equip and Wish */

#id_equipment, #id_wishlist {
  display: grid;
  grid-template-columns: repeat(3, 40px);
  grid-auto-rows: max-content;
  gap: 5px;
  scroll-snap-type: y mandatory;
}
#id_equipment .clear, #id_wishlist .clear, .premium_sparkle {display: none;}

#id_equipment .item, #id_wishlist .item {
  position: relative;
  scroll-snap-align: start;
}

#id_equipment a, #id_wishlist a {
  display: block;
  background: #000000;
  width: 30px;
  height: 30px;
  padding: 4px;
  border: 1px solid #FFFFFF20;
  border-radius: 3px;
}

#id_equipment a:hover, #id_wishlist a:hover {
  background: var(--pink);
  border-color: #FFFFFF80;
}

.owner_checkmark {
  margin: 0;
  bottom: 5px;
  left: 5px;
  transition: filter .5s ease-in-out;
}
#id_wishlist .item:hover .owner_checkmark {filter: brightness(0);}

/* Visitors */

#id_footprints {
  line-height: 1.25;
  scroll-snap-type: y mandatory;
}

#id_footprints .item {
  display: flex;
  flex-flow: row-reverse wrap;
  justify-content: start;
  scroll-snap-align: start;
}
#id_footprints .item:nth-last-of-type(n+2) {margin-bottom: 6px;}

#id_footprints .item a {
  flex: 1 0 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

#id_footprints .item::after {
  content: '→ ';
  margin: 0 0 0 1em;
  white-space: pre;
}

/* Media */

.media_panel {
  background: url('https://i.imgur.com/MWTKBXK.gif') no-repeat center;
  width: 20px;
  height: 20px !important;
  top: 33px;
  left: 148px;
}

.media_panel iframe {
  width: 300px;
  height: 200px;
  position: absolute;
  bottom: -10px;
  left: -25px;
  opacity: .001;
}

.media_panel .buttons {
  position: fixed;
  top: 95px;
  left: 167px;
}