Pro for Lady RaspCherry

/* Basic Styles */

:root {
  --red1: #741210FF;
  --red2: #580C0CFF;
  --red3: #00000020;
}

::selection {
  background: #FFFFFF;
  color: #000;
}

html, body {
  background: #000;
  min-height: 100vh;
}
img, iframe {max-width: 100%;}

body {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  padding: 150px 0;
  position: relative;
  box-sizing: border-box;
}

#gaia_header a, .section a {
  color: #FFFFFF !important;
  text-decoration: none;
}
a {transition: all .5s ease-in-out;}

/* Sprite Sheet Control */

body::before, #gaia_header, #site, #main::before, #content :is(.section h2, #details h3), #allfriends::before {background: url('https://i.imgur.com/ofrhrxX.png') repeat-x;}
body::before, #gaia_header {height: 75px;}
#gaia_header {background-position: center -615px;}
#site {background-position-y: -940px;}

body::before, #main::before, #allfriends::before {
  content: '';
  width: 100%;
  position: absolute;
  left: 0;
}

body::before {
  background-position: center -540px;
  bottom: 0;
}

#main::before, #allfriends::before {
  background-position-y: -700px;
  height: 230px;
  top: 0;
}

#details h3 {background-position-y: -60px !important;}
#wishlist h2 {background-position-y: -120px !important;}
#about h2 {background-position-y: -180px !important;}
#friends h2 {background-position-y: -240px !important;}
#journal h2 {background-position-y: -300px !important;}
#comments h2 {background-position-y: -360px !important;}
#signature h2 {background-position-y: -420px !important;}
#allfriends h2 {background-position-y: -480px !important;}

/* Fonts */

@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 400;
  src: local('PT Serif'), local('PTSerif-Regular'), url('https://fonts.gstatic.com/s/ptserif/v17/EJRVQgYoZZY2vCFuvAFWzr8.woff2') format('woff2');
}

@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 700;
  src: local('PT Serif Bold'), local('PTSerif-Bold'), url('https://fonts.gstatic.com/s/ptserif/v17/EJRSQgYoZZY2vCFuvAnt66qSVys.woff2') format('woff2');
}

@font-face {
  font-family: 'Font Awesome Free';
  font-style: normal;
  font-weight: 900;
  src: url('https://ka-f.fontawesome.com/releases/v5.15.4/webfonts/free-fa-solid-900.woff2') format('woff2');
}

/* Header */

#gaia_header ul, #gaia_header .favorites_add {background: none !important;}
#gaia_header li.spacer, #gaia_header .favorites_add span {display: none;}
#gaia_header li {margin: 0 5px;}

#gaia_header ul {
  font: 700 0/31px serif !important;
  width: unset !important;
  padding: 0 5px;
  filter: drop-shadow(0 0 2px #000);
}

#gaia_header #header_right {
  float: right;
  display: flex !important;
}
#gaia_header #header_right li:nth-last-child(4) {order: 1;}

#header_left img {
  -webkit-mask: url('https://i.imgur.com/5FTB40o.png') no-repeat 0 2px;
  mask: url('https://i.imgur.com/5FTB40o.png') no-repeat 0 2px;
  background: currentColor;
  width: 0;
  padding: 0 37px 0 0;
}

#gaia_header a {
  font-size: 13px;
  text-transform: uppercase;
}
#gaia_header a:hover {color: #E41210 !important;}

#gaia_header .favorites_add {
  width: unset;
  height: unset;
  position: static;
}
#gaia_header .favorites_add::before {content: 'View Favorites';}

/* Page Layout */

#site {
  width: 940px;
  margin: 0 auto;
  contain: layout;
}

#content {
  background: none;
  width: 720px;
  padding: 0;
  margin: 110px auto 0 auto;
}

#content #sidebar, #content #main, #allfriends {
  background: var(--red1);
  border-radius: 20px;
}

#content #sidebar {
  float: left;
  width: 230px;
  margin-top: 60px;
  position: unset;
}

#content #main {
  float: right;
  width: 470px;
  min-height: unset;
  margin: 0;
}

#header, #main + .clear, #avatar_dropbox {display: none;}
#content, #content #main {border: none;}

/* Sections */

.section, .section h2 {
  color: #FFFFFF;
  font: 11px/1.8 'PT Serif', serif;
  padding: 0;
  box-sizing: border-box;
}

.section:not(#multimedia):not(#allfriends) {
  background: none;
  margin: 16px 20px;
  position: relative;
}
.section:last-child {margin-bottom: 20px !important;}

#profile {z-index: 1;}
#multimedia {z-index: 2;}
#allfriends {padding: 20px;}

.section h2, #details h3 {
  height: 50px;
  font-size: 0 !important;
  margin: 0 0 14px -4px;
  border-radius: 5px;
}
#details h2 {display: none;}
#details h3 {margin-top: 16px;}

#about a, #comments dd a {
  font-weight: 700;
  text-decoration: dotted underline !important;
}
#about a:hover, #comments dd a:hover {opacity: .5;}

/* Section Links */

.section .links, #allfriends h2 + a {position: absolute;}
.section .links, .section .links li {margin: 0;}
#about .links {display: none;}

.section .links {
  top: 9px;
  right: 5px;
}

#allfriends h2 + a {
  top: 139px;
  right: 135px;
}

.section .links li, #allfriends h2 + a {
  display: block;
  width: 30px;
  height: 30px;
  font-size: 0;
  text-align: center;
}
.section .links li {float: left;}

.section .links a:hover, #allfriends h2 + a:hover {opacity: .5;}
.section .links a::before, #allfriends h2 + a::before {font: 20px/30px 'Font Awesome Free';}
:is(#friends, #journal, #comments) .links a::before {content: '';}
#comments #qa_addcomment a::before {content: '';}
#allfriends h2 + a::before {content: '';}

/* Avatar */

#bar {
  float: right;
  background: none !important;
  height: unset !important;
  margin: 0;
}
#bar li:nth-of-type(n+2) {display: contents;}
#bar li:last-of-type {display: none;}

#profile .avatar, #bar :is(li, a) {
  background: var(--red3) !important;
  border-radius: 5px;
}
#profile .avatar {padding: 10px;}

#profile .caption, #equipped_id {display: none;}
#commonFriends {display: none;}

#bar :is(li, a) {
  float: none;
  width: 40px !important;
  height: 35px !important;
  font-size: 0 !important;
  text-align: center;
  text-indent: 0 !important;
  padding: 0 !important;
  margin: 0 0 10px 0 !important;
  box-sizing: border-box;
}

#bar a:hover {
  background: #FFFFFF !important;
  color: #000 !important;
}

#bar li::before, #bar a::before {font: 20px/35px 'Font Awesome Free';}
#onlineButton::before {content: '';}
#offlineButton::before {content: '';}
#addButton a::before {content: '';}
#msgButton a::before {content: '';}
#tradeButton a::before {content: '';}

/* Details */

#details #stats, #details #info {
  float: none;
  width: unset;
  margin: 0;
}
#details :is(#stats, #info) * {display: inline;}
#details dt:after {content: ': ';}

#details :is(#stats, #info) dd:after {
  content: '';
  display: block;
}

/* Interests */

#details .clear ~ * {display: none;}
#details:has(h3 + dl) hr ~ * {display: block !important;}

#details h3 ~ dl a {
  text-transform: capitalize;
  opacity: .5;
}
#details h3 ~ dl a:nth-last-child(n+2)::after {content: ',';}
#details h3 ~ dl a:hover {opacity: 1;}

#details h3 ~ dl a:nth-child(n+2):last-child::before {
  content: 'and ';
  text-transform: lowercase;
}
#details h3 ~ dl a:last-child::after {content: '.';}

#details h3 ~ dl:nth-last-of-type(n+2) {margin-bottom: 10px;}
#details h3 ~ dl dd {margin-left: 10px;}

/* Wish List */

#wishlist .items {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  grid-auto-rows: max-content;
  gap: 10px;
}
#wishlist :is(li, a) {display: block;}

#wishlist a {
  background: url('') no-repeat top 4px right 4px var(--red3);
  width: 30px;
  height: 30px;
  padding: 5px;
  border-radius: 5px;
}
#wishlist a:hover {background-color: #FFFFFF;}

#wishlist a[title$='(questing)'] {background-image: url('https://graphics.gaiaonline.com/images/profiles/v1/custom/wishlist_questing.gif');}
#wishlist a[title$='(donated)'] {background-image: url('https://graphics.gaiaonline.com/images/profiles/v1/custom/wishlist_donated.gif');}
#wishlist a[title$='(bought)'] {background-image: url('https://graphics.gaiaonline.com/images/profiles/v1/custom/wishlist_bought.gif');}

/* Friends */

#find_friends_banner, #friends h2 ~ p {display: none;}
#friendGroup p, #friendGroup span {display: contents;}
#friendGroup li, #friendGroup a {overflow: hidden;}

#friendGroup {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  grid-auto-rows: max-content;
  gap: 10px;
}

#friendGroup li {
  display: flex;
  flex-flow: column-reverse nowrap;
  width: 96px !important;
  height: 116px !important;
  border: 2px solid var(--red2) !important;
  border-radius: 5px;
}

#friendGroup img {
  background: var(--red3);
  transition: all .5s ease-in-out;
}
#friendGroup li:hover img {background: #FFFFFF;}

#friendGroup span a {
  display: block;
  background: var(--red2);
  height: 20px;
  line-height: 22px;
  padding: 0 10px;
  text-overflow: ellipsis;
}

/* All Friends */

#allfriends :is(h2, ul) {position: relative;}
#allfriends h2 ~ p {display: none;}

#allfriends ul {
  grid-template-columns: repeat(6, max-content);
  min-height: 380px;
  margin-left: 15px;
}

#allfriends .pagination {
  background: var(--red2);
  height: 30px;
  line-height: 30px;
  padding: 0 10px;
  margin-top: 20px;
  border-radius: 5px;
}

/* Journal */

#journal h3 + p {margin-top: 10px;}
#journal br {display: none;}

#journal #entries {margin: 10px 0 0 10px;}
#journal #entries li {margin: 0;}
#journal #entries a {opacity: .5;}
#journal #entries a:hover {opacity: 1;}

/* Media */

#multimedia, #multimedia embed {position: absolute;}
#multimedia h2 {display: none;}

#multimedia {
  background: url('https://i.imgur.com/MWTKBXK.gif') !important;
  width: 14px;
  height: 11px;
  margin: 0;
  top: 207px;
  left: 293px;
  overflow: hidden;
}

#multimedia embed {
  width: 300px;
  height: 200px;
  bottom: -15px;
  left: -28px;
  opacity: .001;
}

/* Comments */

#comments :is(#alerts_banner, h2 ~ p, .date a, .admin, .clear) {display: none;}
#comments :is(.message, .postcontent) {font: inherit !important;}
#comments :is(.message, dt) {display: contents;}
#comments :is(.date, dd) {margin: 0 !important;}
#comments :is(dt, dt img) {position: unset !important;}
#comments :is(dl, dt) {padding: 0 !important;}

#comments dl {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 15px 10px;
}

#comments dt a {
  display: block;
  background: var(--red3);
  width: 48px;
  height: 48px;
  border: 1px solid var(--red2);
  border-radius: 50%;
  overflow: hidden;
}

#comments dt img {
  max-width: unset;
  margin: -30px 0 0 -47px;
  transform: scaleX(-1);
  image-rendering: pixelated;
}

#comments dd {
  display: flex;
  flex-flow: row-reverse wrap;
  justify-content: start;
  align-items: baseline;
  gap: 0 .5em;
  background: none;
  border: none;
}
#comments dd::before, #comments dd::after {content: unset;}

#comments .date {
  font-size: 9px;
  font-style: normal;
  text-align: inherit !important;
  opacity: .5;
}
#comments .date + p {font-size: 13px;}

#comments .postcontent {
  flex: 0 0 100%;
  padding-top: 1px;
  margin-top: 1px;
  overflow-wrap: anywhere;
  border-top: 2px dotted var(--red2);
}
#comments .postcontent div {text-align: left !important;}

/* Misc */

.spoiler-control {
  background: linear-gradient(to bottom, #FFFFFF, #C0C0C0);
  width: 100px;
  height: 25px;
  font: 700 11px/24px sans-serif;
  text-transform: uppercase;
  border: 1px solid var(--red2);
  border-radius: 5px;
}
.spoiler-control:hover {color: var(--red1);}

.spoiler-wrapper {padding: 0;}
.spoiler-revealed {padding: 5px;}
.spoiler-revealed .spoiler-control {margin-bottom: 10px;}